/* ---------------------------------------------------------------------------------------------------- START OF STREAMLINED STYLES */ #breadcrumb { display:block; width:100%; margin-bottom:4px; /*margin-left:9px;*/ padding-bottom:11px; padding-top:11px; background: transparent url("/images/breadcrumb_dotted_line.gif") repeat-x bottom left; } #breadcrumb H5 { margin:0; line-height:20px; font-family:helvetica,arial,sans-serif; font-size:18px; font-weight:normal; color:#666666; } /* ------------------------- PAGE LAYOUT STYLES ------------------------- */ /* Default width of content without widget to right */ #aboutSWAHome, #swaDifference, #whyFlySWA, #customerService, #otherProducts, #whatsNew { width:750px; } /* ---- NOTES: ---- For all column layouts, remember the floating rule - when you float, it is taken out of the flow of the page. These are set up so that the right column height dictates total height of the row. With that said, always define the right height if it is shorter than the left (this is an approximation and really more of an IE bug fix). ADDITIONAL COLUMN WIDTHS: If you need a column width that doesn't conform to the following 2 types, use the columnLeft/columnRight classes and then redefine the widths as you need them for that section. MORE THAN TWO COLUMNS: Try to use one of these two layouts. Within one of the columns, you can further seperate out additional columns. This helps maintain the simplicity of using these classes. */ /* 2 column layout - *RECOMMENDED* wide left/narrow right */ .columnWide { float:left; position:relative; width:550px; } .columnNarrow { margin-left:555px; width:210px; } /* 2 column layout - *RECOMMENDED* almost equal widths */ .columnLeft { float:left; position:relative; width:400px; } .columnRight { margin-left:405px; width:275px; } /* common layout elements */ .dottedLine { border:1px dotted #CCCCCC; border-style:none none dotted; width:100%; height:1px; display:block; } .newSection { clear:both; margin-top:20px; /*padding-top:20px;*/ } .topicButton { width:130px; margin:0 6px 2px 0px; float:left; text-align:center; } .calendarDate{ text-align:center; width:35px; float:left; margin-right:10px; } .calendarDate .month{ background:white url(/assets/images/calendarDate_top_red.gif) no-repeat top left; font-size:10px;line-height:12px; color:#FFF; font-weight:bold; text-transform:uppercase; padding-top:1px 0; } .calendarDate .day{ font-size:20px; font-weight:bold; color:black; letter-spacing:-2px; line-height:25px; background:#FFF url(/assets/images/calendarDate_bottom_white.gif) no-repeat bottom left; } /* ------------------------- TYPOGRAPHY STYLES ------------------------- */ .H1subtext { font:18px/20px helvetica,arial,sans-serif; line-height:25px; color:#000000; } H2 { margin:0; padding:0; } H2.subLine { padding-bottom:6px; border-bottom:1px solid #dee1f2; } H3 { font-size:18px; font-family:helvetica,arial,sans-serif; font-weight:bold; } H3.subLine { font-size:16px; font-family:helvetica,arial,sans-serif; font-weight:bold; margin:6px 0 6px 0; line-height:20px; } .headerLinks { float:right; margin-top:12px; font-family:Verdana,Tahoma,sans-serif; font-size:11px; font-weight:normal; line-height:11px; } .headerLinksEmphasis { float:right; margin-top:5px; font-family:Verdana,Tahoma,sans-serif; font-size:12px; font-weight:bold; } P.emphasis { font-family: helvetica,arial,sans-serif; font-size:16px; font-weight:normal; line-height:25px; } P.subLine { font-family: helvetica,arial,sans-serif; font-size:13px; font-weight:bold; line-height:16px; } P { font-family:Verdana,Tahoma,sans-serif; font-size:11px; line-height:15px; } .subText { font-family:Verdana,Tahoma,sans-serif; font-size:11px; } .sw2 .swa-footer--contact p { font-family: Arial, sans-serif; font-size: 13px; line-height: 1.42; } /* ------------------------- NAVIGATIONAL LINK LISTS ------------------------- */ /* Navigation without bullets, right arrow, fixed width */ UL.navigation { margin:0; padding:0; list-style: none; font-family:Helvetica, Arial, sans-serif; font-size:12px; font-weight:bold; } UL.navigation LI { line-height:16px; } UL.navigation LI A { display:block; width:180px; background: url("/images/link_arrow.gif") no-repeat 172px 2px; } /* Navigation without bullets, right arrow, variable width */ UL.navStyle2 { margin:0; padding:0; list-style: none; font-family:Helvetica, Arial, sans-serif; font-size:12px; font-weight:bold; } UL.navStyle2 LI { line-height:16px; } UL.navStyle2 LI A { display:block; margin:0 25px 0 0; padding:0 15px 10px 0; white-space:nowrap; background: url("/images/link_arrow.gif") no-repeat right 4px; } /* Navigation without bullets, no arrow, dotted line top/btm */ UL.navNews { margin:0; padding:0; list-style: none; font-family:Helvetica, Arial, sans-serif; font-size:12px; font-weight:bold; border-bottom:1px dotted #CCCCCC; } UL.navNews LI { position:relative; line-height:16px; border-top:1px dotted #CCCCCC; /*IE bug fix:*/border-bottom:1px solid white; } UL.navNews LI A { display:block; position:relative; height:39px; padding:5px 0; font-weight:normal; } UL.navNews .dateIcon { float:left; position:relative; margin-right:1em; } /* ------------------------- STYLES SPECIFIC TO about_swa_home.html ------------------------- */ #aboutSWAHome #hero { width:760px; height:380px; background:url("/images/about_swa/main_garyPlanePpl_753x409.jpg") no-repeat bottom left; } #aboutSWAHome #hero H1 { margin-left:200px; padding-top:15px; } #aboutSWAHome #hero .H1subtext { margin:10px 0px 0px 200px; width:510px; } #aboutSWAHome #hero UL { margin:10px 0px 0px 540px; } #aboutSWAHome #careers { position:relative; } #aboutSWAHome #careers UL.navigation LI { line-height:20px; } #aboutSWAHome #careers #star { position:absolute; top:60px; left:320px; width:200px; height:220px; background:url("/images/careers/stars/lisaTiller_200x170.gif") no-repeat -5px 0; } #aboutSWAHome #careers #star P { padding:170px 0 0 12px; } #aboutSWAHome #careers #swa_nuts { position:absolute; top:285px; left:10px; width:489px; height:104px; background:url("/images/about_swa/main_nutsAboutSWA_489x104.gif") no-repeat -6px 0; } #aboutSWAHome #careers #swa_nuts UL.col1 { float:left; position:relative; left:270px; margin:32px 0 0 0; padding:0px; list-style:none; width:100px; } #aboutSWAHome #careers #swa_nuts UL.col2 { float:left; position:relative; left:280px; margin:32px 0 0 0; padding:0px; list-style:none; width:95px; } #aboutSWAHome #careers #swa_nuts LI { line-height:13px; font-family:Verdana,Tahoma,sans-serif; font-weight:normal; font-size:11px; } #aboutSWAHome #commitments { height:400px; margin-top:20px; } #aboutSWAHome #commitments UL { margin:0px; padding:0px; list-style:none; } #aboutSWAHome #commitments LI { margin:12px 0; padding-left:27px; font-family:Verdana,Tahoma,sans-serif; font-size:11px; font-weight:bold; line-height:15px; background:url("/images/icon_document_24x31.gif") no-repeat top left; } #aboutSWAHome #commitments LI A { font-weight:normal; } #aboutSWAHome #facts IMG { margin:1em 0; } #aboutSWAHome #news_details {} #aboutSWAHome #help_box { height:320px; margin-top:20px; background:url("/images/about_swa/main_helpPane_207x319.gif") no-repeat top right; } #aboutSWAHome #help_box P { margin:0; padding:25px 20px 0 20px; } #aboutSWAHome #help_box #msgContactUs A.msgContactUsLink { display:block; margin-top:10px; padding-left:65px; line-height:52px; font-size:16px; background:url("/images/about_swa/main_helpPane_call.gif") no-repeat top left; } #aboutSWAHome #help_box #msgAdvertise A.msgAdvertiseLink { display:block; margin-top:10px; padding-left: 37px; line-height:39px; font-size:16px; background:url("/images/about_swa/main_helpPane_advertise.gif") no-repeat top left; } #aboutSWAHome #more_details { margin-top:20px; } #aboutSWAHome #more_details UL.navigation { float:left; } #aboutSWAHome #more_details UL.navigation LI A { width:170px; background: url("/images/link_arrow.gif") no-repeat 162px 2px; margin-right:12px; } #aboutSWAHome #LUV #link { text-align:center; } #aboutSWAHome #LUV .columnWide { width:460px; text-align:center; } #aboutSWAHome #LUV .columnNarrow { margin-left:465px; width:300px; text-align:center; } /* ------------------------- STYLES SPECIFIC TO customer_service.html ------------------------- */ #customerService #headline H1 { margin:0; } #customerService #headline .H1subtext { margin:10px 0 0 0; width:520px; height:120px; background:url("/images/help/customerService_howwehelp.jpg") no-repeat 20px 80px; } #customerService #newToSWA UL.navigation { margin-top:12px; } #customerService { position:relative; background: url("/images/help/customerService_bkgrnd.jpg") no-repeat top left; } #customerService H3 { font-size:18px; } #customerService LI { line-height:16px; font-weight:bold; } #customerService #commonFAQs { margin:32px 0 0 0; padding:0; } #customerService #commonFAQs .FAQtop { width:550px; height:12px; background:url("/images/help/customerService_faqtop.gif") no-repeat bottom left; } #customerService #commonFAQs .FAQcontent { margin:0; padding:0 20px 0 20px; border-left:3px solid #fed47f; border-right:3px solid #fed47f; border-bottom:1px dotted #fffdf2; background:#fffdf2 url("/images/help/customerService_faqfade.gif") repeat-x top left; } #customerService #commonFAQs H2 { margin:0; padding:6px 0 4px 0; } #customerService #commonFAQs .question { padding:10px 0 4px 0; font-family:Helvetica, Arial, sans-serif; font-size:13px; font-weight:bold; line-height:16px; } #customerService #commonFAQs .answer { padding:0 0 4px 0; font-family:Verdana,Tahoma,sans-serif; color:#707070; line-height:15px; } #customerService #commonFAQs HR { width:100%; color:#ffffff; border: 1px dotted #abaaaa; border-style: none none dotted; background-color:#ffffff; } #customerService #commonFAQs .FAQbtm { width:550px; height:12px; background: #fffdf2 url("/images/help/customerService_faqbtm.gif") no-repeat top left; } #customerService #commonFAQs UL.navOther { margin:0; padding:0; list-style:none; height:20px; font-family: helvetica,arial,sans-serif; font-size:13px; } #customerService #commonFAQs UL.navOther LI.faq_all { float:left; position:relative; width:242px; } #customerService #commonFAQs UL.navOther LI.faq_mobile { float:left; position:relative; width:118px; padding-left:5px; } #customerService #links { position:relative; top:250px; height:700px; margin-left:565px; font-size:12px; } #customerService #contactUs, #customerService #moreThanPolicies { clear:both; } #customerService #contactUs H2, #customerService #moreThanPolicies H2 { width:100%; margin-top:35px; padding-bottom:6px; } #customerService #contactUs .contactTypes { height:95px; padding:16px 0 16px 0; line-height:16px; border-bottom:1px solid #dde0f2; } #customerService #contactUs .text { clear:both; margin-bottom:10px; font-size:12px; } #customerService #contactUs .byline { font-family:Verdana,Tahoma,sans-serif; line-height:16px; } #customerService #contactUs .disclaimer { font-family:Verdana,Tahoma,sans-serif; line-height:14px; font-size:9px; margin-top:5px; } #customerService #contactUs .info { display:block; font-size:17px; font-weight:bold; color:#000000; } #customerService #contactUs .email, #customerService #contactUs .phone, #customerService #contactUs .letter { float:left; height:50px; margin-top:10px; padding:2px 0 0 75px; color:#707070; } #customerService #contactUs .email { background:url("/images/help/customerService_email.gif") no-repeat 30px 1px; } #customerService #contactUs .phone { background:url("/images/help/customerService_phone.gif") no-repeat 30px 1px; } #customerService #contactUs .letter { background:url("/images/help/customerService_mail.gif") no-repeat 30px 1px; } #customerService #contactUs .letter .info { font-size:10px; line-height:12px; } #customerService #moreThanPolicies { clear:both; float:left; width:550px; } #customerService #moreThanPolicies .text { position:relative; height:24px; } #customerService #moreThanPolicies .text A { float:right; } #customerService #moreThanPolicies #videoMain { float:left; width:410px; } #customerService #moreThanPolicies #videoSide { float:right; width:140px; } #customerService #moreThanPolicies #videoSide IMG { margin-bottom:10px; } #customerService #newToSWA { float:right; position:relative; top:0; margin-top:34px; padding:0; width:225px; font-size:12px; } #customerService #newToSWA .newTop { width:225px; height:12px; background:url("/images/help/customerService_newtop.gif") no-repeat bottom left; } #customerService #newToSWA .newContent { margin:0; padding:0 25px 0 20px; border-bottom:1px dotted #FFFFFF; background:#fffdf2 url("/images/help/customerService_newside.gif") repeat-y top left; } #customerService #newToSWA .newBtm { width:225px; height:253px; background: url("/images/help/customerService_newbtm.gif") no-repeat top left; } #customerService #newToSWA H3 { padding-top:10px; } #customerService #newToSWA .text { margin:6px 0 12px 0; font-size:11px; line-height:16px; } /* ------------------------- STYLES SPECIFIC TO southwest_difference.html ------------------------- */ /* This overrides styles due to not having a link in one or more list items. */ #swaDifference #involved UL.navNews LI .noA { width:240px; position:relative; height:39px; padding:5px 0; font-weight:normal; } #swaDifference { padding-left:10px; background: url("/images/about_swa/swDiffCollage.jpg") no-repeat -2px 50px; } /*#swaDifference .topicButton { float:left; text-align:center; }*/ #swaDifference #headline { position:relative; height:330px; } #swaDifference #walkinTheWalk #garysGreeting { margin-top:10px; } #swaDifference #walkinTheWalk #garysGreeting .garyImg { position:absolute; left:230px; top:-65px; } #swaDifference #walkinTheWalk #garysGreeting H3, #swaDifference #walkinTheWalk #garysGreeting P { width:250px; } #swaDifference #walkinTheWalk #swaMission { height:150px; margin-top:40px; font-weight:bold; text-align:center; } #swaDifference #walkinTheWalk #swaMission IMG { display:block; margin-left:auto; margin-right:auto; } #swaDifference #walkinTheWalk #swaCaresSection, #swaDifference #walkinTheWalk #videoShowcase { margin-top:10px; } #swaDifference #walkinTheWalk #swaCaresSection UL.navigation { float:left; margin-right:16px; } #swaDifference #walkinTheWalk #swaCaresSection UL.navigation LI A { display:block; width:125px; background: url("/images/link_arrow.gif") no-repeat 117px 2px; } #swaDifference #walkinTheWalk #swaCaresSection UL.navigation LI.narrow A { display:block; width:90px; background: url("/images/link_arrow.gif") no-repeat 82px 2px; } #swaDifference #walkinTheWalk #swaCaresSection UL.navigation LI A.noArrow { background:none; } #swaDifference #walkinTheWalk #videoShowcase { position:relative; height:250px; } #swaDifference #walkinTheWalk #videoShowcase .video { float:left; position:relative; width:165px; height:200px; padding:20px 0 0 12px; text-align:center; } #swaDifference #countOnUs .columnLeft { width:410px; height:405px; } #swaDifference #countOnUs .columnRight { margin-left:415px; width:350px; height:290px; } #swaDifference #countOnUS .topicButton { font-family:Verdana,Tahoma,sans-serif; font-size:9px; } #swaDifference #countOnUs #video .video { margin:20px auto 0 auto; text-align:center; } #swaDifference #involved .columnLeft { width:340px; } #swaDifference #involved .columnRight { margin-left:350px; width:415px; height:245px; } #swaDifference #involved .topicButton { margin:0 0 6px 6px; } #swaDifference #involved UL.navNews LI A { width:240px; display:block; } #swaDifference #involved UL.navNews LI A.fareBrowseLink { float:right; position:absolute; left:245px; top:1px; width:92px; padding-top:12px; } #swaDifference #hereForYou #letstalk { padding-top:80px; } /* ------------------------- STYLES SPECIFIC TO other_products.html ------------------------- */ #otherProducts H1 .headerLinks { padding-right:20px; } #otherProducts #travelProducts { position:relative; height:200px; margin:0; padding:0; background:url("/images/programs_services/top_section_top.gif") no-repeat top left; } #otherProducts #travelProducts #cruise { width:400px; height:100px; margin:0; padding:0; border-right:1px solid white; } #otherProducts #travelProducts #cruise .content { padding-top:25px; padding-left:30px; } #otherProducts #travelProducts #cruise .topicButton { width:85px; margin-top:0; margin-bottom:4px; } #otherProducts #travelProducts #cruise HR { clear:both; color:#dde0f2; background-color:#dde0f2; height:1px; width:95%; } #otherProducts #travelProducts #cruise .baggageTransfer { clear:both; float:left; width:202px; margin-top:6px; margin-bottom:6px; font-family:Helvetica, Arial, sans-serif; font-size:12px; font-weight:bold; line-height:16px; } #otherProducts #travelProducts #cruise .baggageTransfer .subText { font-weight:normal; } #otherProducts #travelProducts #cruise .cruiseInfo { margin-top:6px; margin-bottom:6px; font-family:Helvetica, Arial, sans-serif; font-size:12px; font-weight:bold; line-height:16px; } #otherProducts #travelProducts #cruise .cruisePhone { margin-top:6px; margin-bottom:4px; font-size:10px; } #otherProducts #travelProducts #shuttle { float:left; margin:0; padding:0; border-left:1px solid #dde0f2; } #otherProducts #travelProducts #shuttle .content { padding-top:25px; } #otherProducts #travelProducts #shuttle H3, #otherProducts #travelProducts #shuttle P, #otherProducts #travelProducts #shuttle A { display:block; text-align:center; } #otherProducts #travelProducts #shuttle IMG { margin-left:auto; margin-right:auto; } #otherProducts #travelProducts #shuttle IMG.shuttleImg { margin-left:30px; margin-bottom:15px; } #otherProducts #travelProducts #shuttle A { line-height:30px; } #otherProducts #groups { clear:both; margin-right:16px; padding:10px 0 12px 10px; border-top:2px solid #bcbcbc; background-color:#f3f7fe; } #otherProducts #groups H2 { margin:0; padding:0 5px 0 0; display:inline; } #otherProducts #groups .online { float:left; margin-right:10px; font-size:14px; } #otherProducts #groups .call { float:left; margin-right:2px; font-size:14px; } #otherProducts #groups .call H2 { color:#333399; } #otherProducts #themeParks H3 { padding-right:35px; } #otherProducts #newsProds { height:170px; } #otherProducts #newsProds .topicButton { margin-top:20px; } #otherProducts #themesAndInterests UL.navNews LI .event { display:block; position:relative; width:290px; height:39px; padding:5px 0; font-weight:normal; } #otherProducts #themesAndInterests LI A.fareBrowseLink { float:right; position:absolute; left:295px; top:1px; width:92px; padding-top:12px; } #otherProducts #themesAndInterests #travelTheme1 { float:left; } #otherProducts #themesAndInterests #travelTheme2 { float:right; } #otherProducts #familyTravel { position:relative; left:30px; top:20px; height:420px; background:url("/images/programs_services/familyfriendly_background.jpg") no-repeat top left; } #otherProducts #familyTravel .text { position:relative; top:15px; width:300px; margin-left:16px; } #otherProducts #familyTravel P.contentStart { padding-top:110px; } #otherProducts #familyTravel UL { padding-top:5px; } /* ------------------------- STYLES SPECIFIC TO whats_new.html ------------------------- */ #whatsNew HR { width:100%; height:1px; color:#ffffff; border: 1px dotted #CCCCCC; border-style: none none dotted; background-color:#ffffff; } #whatsNew .title { font-family:Helvetica, Arial, sans-serif; font-size:14px; font-weight:bold; } #whatsNew .link A { margin:0; padding:0 15px 10px 0; font-weight:bold; line-height:16px; background: url("/images/link_arrow.gif") no-repeat right 2px; } #whatsNew #articleBoxes .box { margin-bottom:15px; background:url("/images/about_swa/maincontent_podtile.gif") repeat-y top left; } #whatsNew #articleBoxes .box .content { position:relative; padding:15px 15px 0 15px; background:url("/images/about_swa/maincontent_podtop.gif") no-repeat top left; } #whatsNew #articleBoxes IMG { padding:0 1em 4em 0 !important; padding:0; float:left; margin:0 !important; margin:0 1em 1em 0; } #whatsNew #articleBoxes #focusBox IMG { margin:0 auto; padding:0; float:none; text-align:center; } #whatsNew #articleBoxes .box .content .text { padding:10px 0 10px 0; } #whatsNew #articleBoxes .box .link { position:relative; height:22px; padding:0 15px 15px 15px; text-align:right; background:url("/images/about_swa/maincontent_podbot.gif") no-repeat bottom left; } #whatsNew #articleBriefs { padding-left:30px; margin-top:20px; } #whatsNew #articleBriefs .brief { position:relative; width:260px; height:140px; margin-bottom:30px; } #whatsNew #articleBriefs .brief .title { padding:0 0 6px 0; line-height:16px; border-bottom:1px dotted #CCCCCC; } #whatsNew #articleBriefs .brief .image { float:left; margin:10px 10px 0 0; } #whatsNew #articleBriefs .brief .text { margin:10px 0 10px 0; } #whatsNew .offerTerms { clear:both; padding:0 75px 0 25px; } #whatsNew .offerTerms P { font-size:10px; font-family:Arial,Helvetica,sans-serif; } /* ------------------------- STYLES SPECIFIC TO why_fly_southwest.html ------------------------- */ #whyFlySWA { position:relative; padding-left:10px; background: url("/images/about_swa/whyFly_bkgrnd2.jpg") no-repeat 0 -20px; } #whyFlySWA UL.navStyle2 { display:block; height:30px; } #whyFlySWA UL.navStyle2 LI { display:inline; font-size:13px; } #whyFlySWA UL.navStyle2 LI A { float:left; } #whyFlySWA #headline { /*IE bug fix:*/border-bottom:1px solid white; } #whyFlySWA #headline H1 { margin:0; } #whyFlySWA #headline H2 { margin:40px 0 0 275px; width:470px; height:75px; border:none; } #whyFlySWA #headline H2 .line1 { color:#091D87; } #whyFlySWA #headline H2 .line2 { color:#3546BB; } #whyFlySWA #headline #whyFlyReason1 { margin:0 0 0 330px; padding:0; } #whyFlySWA #headline #whyFlyReason2 { margin:10px 0 0 430px; padding:0; } #whyFlySWA #headline #whyFlyReason3 { margin:15px 0 0 510px; padding:0; } #whyFlySWA #headline .title { margin:5px 0; font-weight:bold; color:#3546BB; font-size:12px; } #whyFlySWA #headline .quote { margin:5px 0; font-size:14px; font-weight:bold; line-height:20px; } #whyFlySWA #headline .reference { margin:5px 0; } #whyFlySWA #experience UL.navStyle2 { padding:0 0 0 160px; margin-left:16px; } #whyFlySWA #experience UL.benefits { margin-left:16px; padding:0 0 0 160px; list-style-image:url("/images/list_bulletarrow.gif"); color:#000000; background:url("/images/about_swa/whyFly_itson.gif") no-repeat 0 15px; } #whyFlySWA #experience UL.benefits LI { font-family:Helvetica, Arial, sans-serif; font-size:16px; line-height:24px; } #whyFlySWA #value { position:relative; } #whyFlySWA #value IMG.highlight { float:right; position:absolute; left:500px; margin-top:-66px; } #whyFlySWA #value P { margin-top:10px; width:450px; } #whyFlySWA #value UL.navStyle2 { margin:20px 0 20px 0; }