/* Summary: Homepage Website: Resort Websites Author: Matthew Branthwaite (matthewbranthwaite.co.uk) Created: 2006-10-06 Updated: 2008-12-08 */ /* ---------------------------------------------------------------- 1. C O N T E N T A N D S I D E B A R ---------------------------------------------------------------- */ #home-container { margin: 0 auto 0 auto; padding: 0; width: 760px; text-align: left; background: #fff url(/i/css/images/home/container-bg.png) left top repeat-y; } #home-container .container-inner { padding: 0 0 10px 0; margin: 0; } #home-container a { cursor: pointer; text-decoration: none; font-weight: bold; } #home-container a:hover { text-decoration: underline; } #home-container #sidebar { float: left; width: 190px; padding: 5px 0 0 0; margin: 0; font-size: 10px; line-height: 12px; } #home-container #content { float: left; width: 380px; padding: 0; margin: 0; } #sidebar-links { float: left; width: 180px; padding: 5px 0 0 0; margin: 0; font-size: 10px; line-height: 12px; } #home-container #content-end { clear: both; } #sidebar .mod { padding: 10px 10px 0px 10px; } #content .mod { padding: 10px 10px 0 10px; } #sidebar-links .mod { padding: 10px 0 0 15px; } /* ---------------------------------------------------------------- 2. H E A D E R S ---------------------------------------------------------------- */ /* CONTENT COL HEADINGS */ .section-header { position: relative; height: 18px; margin: 0 0 10px 0; padding: 0; overflow: hidden; font-size: 14px; line-height: 14px; z-index: 1; } .section-header a { display: block; position: relative; } .section-header a:hover { text-decoration: none; } #content h2.section-header { padding: 0; } #sidebar .section-header { height: 15px; margin: 0 0 6px 0; } #sidebar-links .section-header { height: 14px; margin: 0 0 7px 0; } #sidebar-links .section-header a { height: 15px; padding: 0; } .section-header span, .section-header a span { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 2; } /* sidebar headers */ #header-welcome span { background: transparent url("/i/css/images/home/headings/welcome.png") 0 0 no-repeat; } #header-chalet-finder { color: #fff; } /* determined by background color of the module */ #header-chalet-finder span { background: transparent url("/i/css/images/home/headings/chalet-finder.png") 0 0 no-repeat; } #header-newsletter span { background: transparent url("/i/css/images/home/headings/newsletter.png") 0 0 no-repeat; } #header-holiday-extras span { background: transparent url("/i/css/images/home/headings/holiday-extras.png") 0 0 no-repeat; } /* content headers */ #header-recommendations span { background: transparent url("/i/css/images/home/headings/our-choice.png") 0 0 no-repeat; } #header-special-offers span { background: transparent url("/i/css/images/home/headings/special-offers.png") 0 0 no-repeat; } #header-next-four-weeks span { background: transparent url("/i/css/images/home/headings/next-four-weeks.png") 0 0 no-repeat; } #header-latest-news span { background: transparent url("/i/css/images/home/headings/latest-news.png") 0 0 no-repeat; } #header-about-resort span { background: transparent url("/i/css/images/home/headings/about-resort.png") 0 0 no-repeat; } /* sidebar-links headers */ #header-snow-report span { background: transparent url("/i/css/images/home/headings/snow-report.png") 0 0 no-repeat; } #header-superior-chalets span { background: transparent url("/i/css/images/home/headings/superior-chalets.png") 0 0 no-repeat; } #header-hotels span { background: transparent url("/i/css/images/home/headings/hotels.png") 0 0 no-repeat; } #header-self-catering span { background: transparent url("/i/css/images/home/headings/self-catering.png") 0 0 no-repeat; } #header-summer span { background: transparent url("/i/css/images/home/headings/summer.png") 0 0 no-repeat; } #header-short-breaks span { background: transparent url("/i/css/images/home/headings/short-breaks.png") 0 0 no-repeat; } #header-webcams span { background: transparent url("/i/css/images/home/headings/webcams.png") 0 0 no-repeat; } /* hide this header - only for accessibility purposes */ #header-quick-links { font-size: 0; display: block; height: 0; overflow: hidden; } /* ---------------------------------------------------------------- 3. D I V I D E R S ---------------------------------------------------------------- */ .home-divider { display: block; border: 0; padding: 0; margin: 0; height: 15px; background: transparent url("/i/css/images/home/divider-dashed.png") 0 12px repeat-x; } #content .home-divider { width: 360px; } /* dont show the following dividers */ #module-welcome .home-divider, #module-search .home-divider, #module-about-resort .home-divider { height: 10px; background: none; } /* sidebar-links dividers */ #module-links .home-divider { height: 1px; display: block; padding: 0 0 25px 0; background: transparent url("/i/css/images/home/divider-dashed.png") 0 50% repeat-x; } /* ---------------------------------------------------------------- 4. M O D U L E S ---------------------------------------------------------------- */ .mod-footer { padding: 5px 0 0 0; font-size: 10px; } #home-container #content .mod-footer a { font-weight: normal; } #module-search { background: #327ebb url("/i/css/images/home/chalet-finder-bg.png") left top repeat-y; color: #fff; } #module-search legend, #module-search br { display: none; } #module-search label { display: block; margin: 0 0 3px 0; font-weight: bold; } #module-search p { margin-bottom: 5px; } #module-search input { vertical-align: middle; } #module-search input.textfield, #module-search select { font-size: 11px; width: 164px; } #module-search input.submit-btn { width: 80px; font-weight: bold; } #module-newsletter legend, #module-newsletter label { font-size: 0; display: block; height: 0; overflow: hidden; } #module-newsletter p { margin-bottom: 8px; } #module-newsletter input { font-size: 11px; width: 164px; } #module-newsletter input.submit-btn { width: 80px; font-weight: bold; } #module-hol-extras ul { list-style: none; margin: 0; padding: 0; } #module-hol-extras li { list-style: none; padding: 3px 0; margin: 0; border-bottom: 1px solid #c4c4c4; } #module-hol-extras li a img { margin-right: 7px; } #module-hol-extras li a:hover span { text-decoration: underline; } #module-weather .weather-wrapper { height: 1%; background: #327ebb url("/i/css/images/home/weather-bg.png") right top no-repeat; } #module-weather dl { display: block; padding: 4px; margin: 0; } #module-weather dt { display: block; float: left; padding-right: 4px; padding-top: 4px; margin: 0; background: none; } #module-weather dt strong { font-weight: normal; font-style: normal; } #module-weather dd { padding-top: 4px; margin: 0; } /* recommendations - our choice */ #content #module-recommendations { height: 1%; padding-right: 0; margin: 0; } #content #module-recommendations ol { height: 1%; list-style-type: none; margin: 0; padding: 0; } #content #module-recommendations li { height: 1%; list-style: none; display: inline; float: left; margin: 0 9px 9px 0; padding: 7px 0 0 0; background: transparent url("/i/css/images/home/recommendation-top.png") left top no-repeat; } #content #module-recommendations li a { display: block; float: left; width: 83px; padding: 0 0 7px 0; font: normal 11px Verdana, sans-serif; text-align: center; color: #000; background: #e0ecf5 url("i/css/images/home/recommendation-end.png") left bottom no-repeat; } #content #module-recommendations li a:hover { text-decoration: none; } #content #module-recommendations li a img { display: block; margin: 0 auto 5px auto; } #content #module-recommendations li em { display: block; font-style: normal; font-weight: bold; } #content #module-recommendations li a strong { font: bold 17px Verdana, sans-serif; color: #c60000; } #content #module-recommendations li a:hover strong { text-decoration: underline; } /* special offers */ #content #module-offers { height: 1%; clear: both; } #content #module-offers ol.offers { list-style: none; margin: 0; padding: 0; } #content #module-offers ol.offers li { list-style: none; margin: 0; padding: 0 0 0 42px; } #content #module-offers ol.offers li a { display: block; height: 1%; padding: 4px 25px 4px 0; margin: 0 0 6px; background: url("/i/css/images/home/offer-arrow.png") 290px 48% no-repeat; } #content #module-offers ol.offers li.offer1 { background: url("/i/css/images/home/offer-1.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer2 { background: url("/i/css/images/home/offer-2.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer3 { background: url("/i/css/images/home/offer-3.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer4 { background: url("/i/css/images/home/offer-4.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer5 { background: url("/i/css/images/home/offer-5.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer6 { background: url("/i/css/images/home/offer-6.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer7 { background: url("/i/css/images/home/offer-7.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer8 { background: url("/i/css/images/home/offer-8.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer9 { background: url("/i/css/images/home/offer-9.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer10 { background: url("/i/css/images/home/offer-10.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer11 { background: url("/i/css/images/home/offer-11.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer12 { background: url("/i/css/images/home/offer-12.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer13 { background: url("/i/css/images/home/offer-13.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer14 { background: url("/i/css/images/home/offer-14.png") 0 48% no-repeat; } #content #module-offers ol.offers li.offer15 { background: url("/i/css/images/home/offer-15.png") 0 48% no-repeat; } /* upcoming ski weeks - calendar */ #content #module-calendar { padding-right: 0; } #content #module-calendar ul.calendar { height: 1%; list-style-type: none; margin: 0; padding: 0; } #content #module-calendar ul.calendar li { display: inline; list-style: none; float: left; width: 83px; margin: 0 9px 9px 0; padding: 7px 0 0 0; background: #e5eff7 url("/i/css/images/home/recommendation-top.png") left top no-repeat; } #content #module-calendar ul.calendar li a { display: block; float: left; width: 83px; padding: 0 0 7px 0; margin: 0; font: normal 11px Verdana, sans-serif; text-align: center; text-decoration: none; color: #000; background: #e5eff7 url("/i/css/images/home/recommendation-end.png") left bottom no-repeat; } /* the date */ #content #module-calendar ul.calendar li a span { display: block; width: 31px; padding: 16px 4px 4px 4px; margin: 0 auto 4px; font: bold 12px Verdana, sans-serif; color: #fff; background: #327ebb url("/i/css/images/home/calendar-bg.png") right top no-repeat; } #content #module-calendar ul.calendar li a span em { display: block; font-style: normal; font: bold 20px Arial, Tahoma, Helvetica, Sans-serif; line-height: 16px; } #content #module-calendar ul.calendar li a strong { display: block; font: bold 17px Verdana, sans-serif; } #content #module-calendar ul.calendar li a:hover strong { text-decoration: underline; } /* right sidebar */ #module-links p { margin: 0; } #module-links img { display: block; margin-bottom: 3px; }