/*=========================================================================== Typography (Search) This stylesheet defines the text and font styles for the following: * Type faces, sizes, leading (line-height), and kerning (letter-spacing). * Font styles such as italics, bold, case transformations, etc. * Underlining, including borders on inline elements simulating underlines. ===========================================================================*/ /*=========================================================================== Components ===========================================================================*/ /*=========================================================================== Modules ===========================================================================*/ /* Change Travel Details ===========================================================================*/ /* Search Header */ div#search-header h1 { font-size: 2em; /* 22px relative to 11px */ line-height: 1em; /* 22px relative to 22px */ text-transform: none; } div#search-header h1 em { font-size: 0.6363em; /* 14px relative to 22px */ line-height: 1.1429em; /* 16px relative to 14px */ font-style: normal; } ul#search-navigation { line-height: 1.1818em; /* 13px relative to 11px */ } ul#search-navigation li a { font-weight: bold; } div#change-travel-details h3 em { font-style: normal; font-size: 0.7857em; /* 11px relative to 14px */ } /* Great Travel Deals ===========================================================================*/ div#great-travel-deals dl dt { font-size: 1.1818em; /* 13px relative to 11px */ line-height: 1.7692em; /* 23px relative to 13px */ } div#great-travel-deals dl dd { line-height: 1.6363em; /* 18px relative to 11px */ } /* Destination Guides ===========================================================================*/ div#destination-guides h6 a { text-decoration: none; } div#destination-guides h6 a em { font-style: normal; font-size: 0.7857em; /* 11px relative to 14px */ text-decoration: underline; text-transform: none; } /* Road Trips ===========================================================================*/ div#road-trips h6 a { text-decoration: none; } div#road-trips h6 a em { font-style: normal; text-transform: none; text-decoration: underline; font-size: 0.7857em; /* 11px relative to 14px */ } /*=========================================================================== Pages ===========================================================================*/ /* HTTP 404 ===========================================================================*/ /*=========================================================================== Colors (Search) This stylesheet defines the colors for the following: * Text and links * Backgrounds * Borders ===========================================================================*/ @media screen, handheld { /*=========================================================================== Components ===========================================================================*/ /*=========================================================================== Modules ===========================================================================*/ /* Change Travel Details ===========================================================================*/ form#change-travel-details-form { background-color: transparent; } form#change-travel-details-form fieldset#check-in-and-out-dates, form#change-travel-details-form fieldset { background-color: #D7D7D7; /* PZ tableBody2, default #EEF3F9 pale blue */ } body.search-section div#change-travel-details div#search-header, body.search-section div#change-travel-details div#search-header a { color: #FFFFFF; /* PZ bgColor, default #FFFFFF white */ background-color: #34208B; /* PZ tableBack, default #0D447F deep blue */ } div#change-travel-details h3 { background-color: #373737; /* PZ darkSubText, default #6699CC medium dark blue */ } div#change-travel-details fieldset#top-destinations ul li#recently-searched-cities { background-color: #FAF4CD; /* PZ hiLiteColor, default #FAF4CD pale yellow */ } div#change-travel-details div#amenities, div#change-travel-details fieldset#top-destinations ul { border-color: #34208B; /* PZ tableBack, default #0D447F deep blue */ } div#change-travel-details p.directions { color: #888888; /* PZ lightestSubText, default #999999 medium gray */ } /* Destination Guides ===========================================================================*/ div#destination-guides { background-color: #D7D7D7; /* PZ tableBody2, default #EEF3F9 pale blue */ border-color: #34208B; /* PZ tableBack, default #0D447F deep blue */ } div#destination-guides h6 a { color: #0D447F; /* PZ text, default #000000 true black */ } div#destination-guides h6 a em { color: #036; /* PZ link, default #003366 ultra dark blue */ } div#destination-guides h6 a:focus em, div#destination-guides h6 a:hover em, div#destination-guides h6 a:active em { color: #C00; /* PZ alink, default #CC0000 old red */ } /* Great Travel Deals ===========================================================================*/ div#great-travel-deals h6 { background-color: #F0F0F0; /* PZ tableBody1, default #D4E5FA light blue */ } div#great-travel-deals dl { background-color: #D7D7D7; /* PZ tableBody2, default #EEF3F9 pale blue */ } /* Road Trips ===========================================================================*/ div#road-trips { background-color: #D7D7D7; /* PZ tableBody2, default #EEF3F9 pale blue */ } div#road-trips h6 a { color: #0D447F; /* PZ text, default #000000 true black */ } div#road-trips h6 a em { color: #036; /* PZ link, default #003366 ultra dark blue */ } div#road-trips h6 a:focus em, div#road-trips h6 a:hover em, div#road-trips h6 a:active em { color: #C00; /* PZ alink, default #CC0000 old red */ } /*=========================================================================== Pages ===========================================================================*/ /* HTTP 404 ===========================================================================*/ div#http-error { background-color: #D7D7D7; /* PZ tableBody2, default #EEF3F9 pale blue */ border-color: #036; /* PZ vlink, default #003366 ultra dark blue */ } div#http-error h3 { color: #FFFFFF; /* PZ bgColor, default #FFFFFF white */ background-color: #373737; /* PZ darkSubText, default #6699CC medium dark blue */ } /* Disambiguation ===========================================================================*/ } /* end @media */ /*=========================================================================== Layout (Search) This stylesheet defines the overall layout in the following ways: * Defines column layouts using floated containers. * Defines margins and padding. * Replaces specific textual content with images. * Hides parts of the page that not to be shown (i.e. accessibility help). * Misc. such as background images, borders, cursors, dimensions, etc. ===========================================================================*/ @media screen { /* Page ===========================================================================*/ /* div#primary-and-secondary-content uses Easy Clearing */ div#content div#primary-and-secondary-content { width: 750px; margin-left: auto; margin-right: auto; } div#page-content.has-left-sidebar div#primary-and-secondary-content { margin-right: 0; } div#page-content.has-right-sidebar div#primary-and-secondary-content { margin-left: 0; } div#primary-content { float: left; width: 435px; } div#secondary-content { float: right; width: 300px; } /* Easy Clearing ===========================================================================*/ /* Easy Clearing - Tony Aslett, Position is Everything, and Alex Robinson http://www.tanfa.co.uk/archives/show.asp?var=300 */ div#primary-and-secondary-content:after, div#destination-guides ul:after, div#destination-guides:after, div#change-travel-details fieldset#top-destinations ul:after, .js div#change-travel-details ul.long-options.sliced-list:after, div#search-header:after, div#road-trips:after { content: "."; display: block; visibility: hidden; clear: both; height: 0; } div#primary-and-secondary-content, div#destination-guides ul, div#destination-guides, div#change-travel-details fieldset#top-destinations ul, .js div#change-travel-details ul.long-options.sliced-list, div#search-header, div#road-trips { display: inline-block; } /* for IE 6 */ * html div#primary-and-secondary-content, * html div#destination-guides ul, * html div#destination-guides, * html div#change-travel-details fieldset#top-destinations ul, * html.js div#change-travel-details ul.long-options.sliced-list, * html div#search-header, * html div#road-trips { height: 1%; } div#primary-and-secondary-content, div#destination-guides ul, div#destination-guides, div#change-travel-details fieldset#top-destinations ul, .js div#change-travel-details ul.long-options.sliced-list, div#search-header, div#road-trips { display: block; } /*=========================================================================== Components ===========================================================================*/ /*=========================================================================== Modules ===========================================================================*/ /* Change Travel Details ===========================================================================*/ body.search-section div#change-travel-details { width: auto; margin-left: 0; margin-top: 10px; } body.search-section div#change-travel-details h3 { padding-top: 5px; padding-bottom: 5px; margin-top: 10px; margin-bottom: 0; } /* for IE 6 */ * html body.search-section div#change-travel-details h3 { height: 1%; } /* Search Header */ div#search-header { position: relative; margin-bottom: 10px; } .js div#change-travel-details div#search-header { margin-left: -1px; margin-right: -1px; } div#search-header h1 { position: relative; float: left; padding-top: 0px; padding-left: 10px; padding-bottom: 10px; margin-bottom: 0; } div#search-header h1 em { display: block; } div#search-header ul#search-navigation { float: right; padding-right: 10px; padding-bottom: 10px; } div#search-header ul#search-navigation li { text-align: right; margin-bottom: 6px; } /* Change Travel Details Form */ body.search-section div#change-travel-details form#change-travel-details-form { padding-top: 0; } /* for IE 6 */ * html body.search-section div#change-travel-details form#change-travel-details-form { display: inline; } div#change-travel-details fieldset#destination, div#change-travel-details fieldset#destination-address, div#change-travel-details fieldset#landmarks { padding: 10px; margin-bottom: 10px; } div#change-travel-details fieldset#top-destinations { padding-top: 10px; } /* for IE 6 */ * html div#change-travel-details fieldset#property-preferences { position: relative; } /* for IE 7 */ *+html div#change-travel-details fieldset#property-preferences { position: relative; } /* Enter A City */ div#change-travel-details label#for-other-city { position: relative; float: left; margin-left: 10px; margin-top: 20px; z-index: 4; } /* for IE 6 */ * html div#change-travel-details label#for-other-city { display: inline; } div#change-travel-details label#for-other-city span.label-title { /* Aural Text Class - Peter Krantz http://www.standards-schmandards.com/index.php?2004/10/08/1-the-aural-text-class */ position: absolute; top: 0; /* for IE 8 */ left: -1000em; } div#change-travel-details label#for-other-city input.type-radio { left: 0px; top: 0px; } /* for IE 6 */ * html div#change-travel-details label#for-other-city input.type-radio { top: -4px; left: -4px; } /* for IE 7 */ *+html div#change-travel-details label#for-other-city input.type-radio { top: -4px; left: 8px; } div#change-travel-details label#for-enter-a-city span.label-title { margin-bottom: 2px; } div#change-travel-details p.directions { margin: 0; margin-top: 1em; /* 11px relative to 11px */ } /* Top Destinations */ div#change-travel-details fieldset#top-destinations ul { margin-top: 10px; border-top-width: 1px; border-top-style: solid; } div#change-travel-details fieldset#top-destinations ul.has-recently-searched-cities { position: relative; overflow: hidden; } div#change-travel-details fieldset#top-destinations ul li#most-popular-cities { float: left; width: 97%; padding-top: 5px; padding-left: 10px; padding-bottom: 10px; } div#change-travel-details fieldset#top-destinations ul.has-recently-searched-cities li#most-popular-cities { width: 60%; } div#change-travel-details fieldset#top-destinations ul.has-recently-searched-cities li#most-popular-cities ul { width: 50%; } /* for IE 6 */ * html div#change-travel-details fieldset#top-destinations ul.has-recently-searched-cities li#most-popular-cities ul { width: 45%; } div#change-travel-details fieldset#top-destinations ul li#most-popular-cities ul { width: 33%; } div#change-travel-details fieldset#top-destinations ul li#recently-searched-cities { float: left; width: 35.3%; padding-top: 5px; padding-left: 10px; padding-bottom: 150px; margin-bottom: -140px; } div#change-travel-details fieldset#top-destinations ul li ul { border-top-width: 0; border-top-style: none; padding: 0; margin: 0; float: left; } div#change-travel-details fieldset#top-destinations ul ul li { float: none; } div#change-travel-details div#property-types { padding-top: 10px; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; } div#change-travel-details div#amenities { margin-top: 10px; padding-top: 10px; padding-left: 10px; padding-right: 10px; padding-bottom: 10px; border-top-width: 1px; border-top-style: solid; } .js div#change-travel-details ul.long-options.sliced-list li { float: left; width: 48%; margin-right: 5px; } * html.js div#change-travel-details ul.long-options.sliced-list li { width: 47%; } /* for IE 6 */ .js div#change-travel-details ul.long-options.sliced-list li ul li { float: none; width: 100%; } /* Check In / Out */ /* for Safari 1.0-2.0, Mobile Safari, and KHTML */ body:last-child:not(:root:root).search-section div#change-travel-details fieldset#check-in-and-out-dates { position: relative; /* fix z-index from recently-searched-cities equal height column */ } /* for IE 6 */ * html body.search-section form#change-travel-details-form fieldset.actions { margin-top: -5px; } /* for IE 7 */ *+html form#change-travel-details-form fieldset.actions { margin-top: -5px; } /* Landmarks ===========================================================================*/ .js div#change-travel-details input#submit-landmarks { display: none; } .js div#change-travel-details div#landmark-options { overflow: hidden; height: 0; margin-top: 0.4545em; /* 5px relative to 11px */ } * html.js div#change-travel-details div#landmark-options { position: relative; } /* for IE 6 */ *+html.js div#change-travel-details div#landmark-options { position: relative; } /* for IE 7 */ .js div#change-travel-details div#landmark-options p { margin-left: 0; margin-right: 0; } .js fieldset#landmarks img { float: right; margin-right: 10px; } /* Destination Guides ===========================================================================*/ /* div#destination-guides uses Easy Clearing */ div#destination-guides { margin-top: 10px; margin-bottom: 10px; padding: 15px; border-width: 1px; border-style: solid; } .js div#destination-guides { margin-top: 15px; margin-bottom: 15px; } div#destination-guides h6 { margin-bottom: 0; } div#destination-guides h6 a em { display: block; margin-top: 0.9091em; /* 10px relative to 11px */ } /* div#destination-guides ul uses Easy Clearing */ div#destination-guides ul { margin-right: 10px; margin-bottom: 5px; } div#destination-guides ul li { float: right; text-align: center; margin-left: 15px; } /* div#destination-guides ul li:last-child, */ div#destination-guides ul li.last-child { margin-left: 0; } div#destination-guides ul li a { display: block; width: 120px; } div#destination-guides ul li a span.before { display: block; width: 120px; height: 60px; background-image: url(../../../zen/_media/destination-guides/_destination-guides.jpg); background-repeat: no-repeat; } div#destination-guides ul li#las-vegas a span.before { background-position: 0 -60px; } div#destination-guides ul li#new-york a span.before { background-position: 0 -120px; } div#destination-guides a.button { margin-right: 10px; } /* Great Travel Deals ===========================================================================*/ div#great-travel-deals { position: relative; margin-bottom: 10px; } div#great-travel-deals h6 { position: relative; padding-left: 10px; padding-right: 10px; padding-top: 2px; padding-bottom: 10px; margin-top: 10px; margin-bottom: 0; overflow: visible; } /* trigger hasLayout */ * html div#great-travel-deals h6 { zoom: 1; } /* for IE 6 */ *+html div#great-travel-deals h6 { zoom: 1; } /* for IE 7 */ div#great-travel-deals div.ad-banner { padding: 0; margin: 0; overflow: hidden; } div#great-travel-deals dl { padding: 1px 10px 7px 10px; } div#great-travel-deals dl dt { margin-top: 3px; } div#great-travel-deals dd { display: list-item; list-style-type: square; margin-left: 20px; } /* Road Trips ===========================================================================*/ div#road-trips { margin-top: -10px; margin-bottom: 10px; padding-bottom: 10px; } div#road-trips h6 a { display: block; padding-left: 10px; padding-right: 10px; padding-top: 120px; background-image: url(../../_media/search/road-trips.jpg); background-repeat: no-repeat; background-position: top left; } div#road-trips h6 a em { display: block; } div#road-trips p { margin-left: 10px; margin-right: 10px; } div#road-trips a.button { margin-right: 10px; } /*=========================================================================== Pages ===========================================================================*/ /* Search By Address ===========================================================================*/ div#change-travel-details label#for-street-address { float: left; margin-right: 50px; } /* Search By City ===========================================================================*/ /* HTTP 404 ===========================================================================*/ div#http-error { margin-bottom: 10px; border-width: 1px; border-style: solid; } div#http-error h3 { padding-left: 20px; padding-top: 10px; padding-bottom: 10px; } div#http-error p { margin-left: 20px; margin-right: 20px; } /* Disambiguation ===========================================================================*/ } /* end @media */