/* PRODUCT.CSS */ /* Contains style and layout for all product pages */ /* =============================================== */ h1 { background:none; padding: 0 0 8px 0; margin:0; } #product-main { width:690px; float:left; margin: 0 10px 0 0; } #product-main-header { padding: 0 0 0 10px; } #breadCrumbs { padding: 0 0 5px 0;} #breadCrumbs a:link, #breadCrumbs a:visited, #breadCrumbs a:hover { color: #666; } #product-main-container {} #content { float:left; width:460px; margin: 0 10px 0 0; } /* IE6 hack */ *html #content {float:left; width:460px; margin: 0 5px 0 0;} /* PRODUCT TABS */ #product-tabs { height:25px;} #product-tabs a:link, #product-tabs a:visited {color:#333; font-weight:bold; text-decoration:none;padding: 0 0 0 10px;} #product-tabs a:hover, #product-tabs a.active {color:#ED1C24;} #tab1-on { width:67px; height:26px; float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_benefits_active.jpg) no-repeat; line-height:26px; margin: 0 2px 0 0;} #tab1-off { width:67px; height:26px; float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_benefits_inactive.jpg) no-repeat; line-height:26px; margin: 0 2px 0 0; } #tab2-on { width:125px; height:25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_howdoesitwork_active.jpg) no-repeat; line-height:26px; margin: 0 2px 0 0;} #tab2-off { width:125px; height:25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_howdoesitwork_inactive.jpg) no-repeat; line-height:26px; margin: 0 2px 0 0;} #tab3-on { width:68px; height: 25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_reviews_active.jpg) no-repeat; line-height:26px; margin: 0 2px 0 0;} #tab3-off { width:68px; height: 25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_reviews_inactive.jpg) no-repeat; line-height:26px; margin: 0 2px 0 0;} #tab4-on { width:51px;height: 25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_faqs_active.jpg) no-repeat; line-height:26px;margin: 0 2px 0 0;} #tab4-off { width:51px;height: 25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_faqs_inactive.jpg) no-repeat; line-height:26px;margin: 0 2px 0 0;} #tab5-on { width:105px;height: 25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_travel_inactive.jpg) no-repeat; line-height:25px;} #tab6-off { width:125px;height: 25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_tpass_inactive.jpg) no-repeat; line-height:26px;} #tab7-off { width:105px;height: 25px;float:left; background:url(/system/styles/images/backgrounds/tabs/product/tab_tassist_inactive.jpg) no-repeat; line-height:26px;} ul#product-tabs li.tab5-on {background:url(/system/styles/images/backgrounds/tabs/product/tab_travel_inactive.jpg) no-repeat; padding:4px 10px 6px 10px; color:#333;} ul#product-tabs li.tab5-on a:link, ul#product-tabs li.tab5-on a:visited {color:#ED1C24;} ul#product-tabs li.tab5-off {background:url(/system/styles/images/backgrounds/tabs/product/tab_travel_inactive.jpg) no-repeat;} ul#product-tabs li.tab6-on {background:url(/system/styles/images/backgrounds/tabs/product/tab_tpass_active.jpg) no-repeat; padding:4px 10px 6px 10px;} ul#product-tabs li.tab6-on a:link, ul#product-tabs li.tab6-on a:visited, ul#product-tabs li.tab6-off a:link, ul#product-tabs li.tab6-off a:visited{color:#ED1C24;} ul#product-tabs li.tab6-off {background:url(/system/styles/images/backgrounds/tabs/product/tab_tpass_inactive.jpg) no-repeat;} ul#product-tabs li.tab7-on {background:url(/system/styles/images/backgrounds/tabs/product/tab_tassist_active.jpg) no-repeat; padding:4px 10px 6px 10px;} ul#product-tabs li.tab7-on a:link, ul#product-tabs li.tab7-on a:visited, ul#product-tabs li.tab7-off a:link, ul#product-tabs li.tab7-off a:visited {color:#ED1C24;} ul#product-tabs li.tab7-off {background:url(/system/styles/images/backgrounds/tabs/product/tab_tassist_inactive.jpg) no-repeat;} /* PRODUCT CONTENT */ #product-main-panel { background:#EEE; padding:10px; } #product-main-panel h2 { font-size:1.2em; } ; h3 { font-size:1.1em; } /* BENEFITS PAGE */ #main-panel-benefits .header { background:url(/system/styles/images/backgrounds/product/bg_table_benefits.jpg); height:22px; margin: 8px 0 0 0; } #main-panel-benefits .header h2 { padding: 4px 10px 0 10px; } #main-panel-benefits .benefit .question h3 { padding: 5px 60px 5px 30px; background: url(/system/styles/images/artwork/ico_greentick_bg_white.jpg) no-repeat top left; } #main-panel-benefits .benefit .question { border:1px solid #CCCCCC; margin:1px 0 0 0; cursor: pointer; background: #FEFEFE url('/system/styles/images/backgrounds/product/show_light.jpg') no-repeat top right; } #main-panel-benefits .benefit .question.active { background-image: url('/system/styles/images/backgrounds/product/hide_light.jpg'); } #main-panel-benefits .benefit .answer { border-left:1px solid #CCCCCC; border-right:1px solid #CCCCCC; border-bottom:1px solid #CCCCCC; background:#FFFFFF; padding:10px; } /* REVIEWS PAGE */ #main-panel-reviews { margin: 10px 0 0 0;} #main-panel-reviews .faq-off .question h2, #main-panel-reviews .faq-on .question h2 { padding: 5px 60px 5px 10px; } #main-panel-reviews .faq-off .question, #main-panel-reviews .faq-on .question { margin:0 0 5px 0;padding:0; cursor: pointer; background: #CCCCCC url(/system/styles/images/backgrounds/product/show.jpg) no-repeat top right; } #main-panel-reviews .faq-off .question.active, #main-panel-reviews .faq-on .question.active { margin:0;padding:0; background-image: url('/system/styles/images/backgrounds/product/hide.jpg'); } #main-panel-reviews .faq-off .answer, #main-panel-reviews .faq-on .answer { border:1px solid #CCCCCC; background:#FFFFFF; padding:10px; margin: 0 0 5px 0; } /* FAQS */ #main-panel-faqs { margin: 10px 0 0 0;} #interior-product-main #product-main-panel #main-panel-faqs h2 { padding: 5px 0 3px 0;} #content #product-main-panel #main-panel-faqs .faq-off .question h2, #main-panel-faqs .faq-on .question h2 { padding: 5px 60px 5px 10px; } #content #product-main-panel #main-panel-faqs .faq-off .answer h3, #main-panel-faqs .faq-on .answer h3 { color:#333;} #main-panel-faqs .faq-off .question, #main-panel-faqs .faq-on .question { margin:0 0 5px 0;padding:0; cursor: pointer; background: #CCCCCC url(/system/styles/images/backgrounds/product/show.jpg) no-repeat top right; } #main-panel-faqs .faq-off .question.active, #main-panel-faqs .faq-on .question.active { margin:0;padding:0; background-image: url('/system/styles/images/backgrounds/product/hide.jpg'); } #main-panel-faqs .faq-off .answer , #main-panel-faqs .faq-on .answer { border:1px solid #CCCCCC; background:#FFFFFF; padding:10px; margin: 0 0 5px 0; } /* TRAVEL LANDING PAGE */ #introtravel {width:440px;} .travel { float:left; width:210px; padding: 0 10px 0 0; } #container #product-main #product-main-container #content #product-main-panel #main-panel-travel h2 {padding: 10px 0 0 0;} #main-panel-travel p {padding:0;} #container #product-main #product-main-container #content #product-main-panel .travel ul { margin:0;} #container #product-main #product-main-container #content #product-main-panel .travel ul li { background:none; list-style-type:none; padding:0;} #container #product-main #product-main-container #content #product-main-panel .travel ul li.benefit { background:url(/system/styles/images/artwork/ico_greentick_bg_grey.jpg) no-repeat; padding: 4px 0 0 30px; } #container #product-main #product-main-container #content #product-main-panel .travel ul li.button { padding: 10px 0 0 0;} #container #product-main #product-main-container #content #product-main-panel .travel ul li.text { width:202px; padding:5px 5px 3px 5px} #container #product-main #product-main-container #content #product-main-panel .travel ul li h2 {font-size:1.2em;} /* CALL TO ACTION IN MAIN PANEL */ #product-cta { background: #CCC url(/system/styles/images/backgrounds/product/bg_product-main-cta.jpg) no-repeat bottom; width: 450px; padding: 5px; } #product-cta h2{ padding: 5px;} #product-cta p {padding: 0 0px 0 5px;} /* BUYING OPTIONS */ #options { float:left; width:220px; background:#EEE; } #options-text-product {border:1px solid #DEDEDE;padding: 5px 10px 15px 10px; } #options-text h2, #options-text-travel h2 { font-size: 1.2em;} #options-text { padding:5px } #options-text h3 { padding: 0 5px 8px 20px; background:url(/system/styles/images/artwork/ico_greentick_options.gif) no-repeat; color:#333; font-size:1.1em; font-weight:bold; } #options-text img { padding: 0 0 5px 0;} #options-text p.smallprint {font-size:0.9em; padding: 10px 0 10px 0; } #options-text .buyonline {padding: 0 0 13px 0;} #options-text .buyphone span { color:#ED1C24; font-weight:bold; font-size:1.1em;} #options-text .buyphone p { padding: 0; } #options-text .notes { padding: 15px 10px 10px 10px} #options-text .notes p {padding: 0 0 5px 0;} #options-text-travel { padding:5px;} #options-text-travel p { padding:5px 0 10px 5px;} #options-text-travel h3 { padding: 0 5px 8px 20px; background:url(/system/styles/images/artwork/ico_greentick_options.gif) no-repeat; color:#333; font-size:1.1em; font-weight:bold; } #options-text-travel .travel-product { padding: 5px 10px 15px 10px; border:1px solid #DEDEDE; margin: 0 0 5px 0; } #options-text-travel .travel-product p { padding:0;} #options-text-travel .buyonline {padding: 0 0 13px 0px;} #options-text-travel .buyphone {padding: 0 0 0 0px;} #options-text-travel .buyphone span { color:#ED1C24; font-weight:bold; font-size:1.1em;} #options-text-travel .notes { padding: 5px 10px 10px 5px} /* SIDE */ #product-side { width: 240px; float: right; }