html, body {height: 100%;} body { margin: 0; color: #333; min-width: 960px; font: 11px arial, verdana, helvetica, sans-serif; } /*--- general ---*/ ul, ol {list-style: none;} img {border: none;display: block;} form, ul, ol, dl, dd, p {margin: 0;padding: 0;} h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: normal; font-family: arial, verdana, helvetica, sans-serif; } a { color: #066; cursor: pointer; text-decoration: none; } a:hover {text-decoration: underline;} a:active, a:focus {outline: none;} .tex { color: #007f99; font: 11px arial, sans-serif; } .clr:after { height: 0; clear: both; content: ""; display: block; } * html .clr {height: 1%;} #page { width: 960px; margin: 0 auto; } /* header */ #header { z-index: 10; width: 100%; height: 159px; position: relative; } .wrap-header-1 { width: 100%; overflow: hidden; padding: 0 0 18px 0; } /* logo */ .logo { float: left; margin: 20px 0 0 0; } /* contact-detail */ .contact-detail { float: right; width: 162px; height: 42px; overflow: hidden; margin: 8px 0 0 0; text-indent: -12000px; background: url("contact.gif") no-repeat; } .contact-detail:hover {background-position: 0 -42px;} .wrap-header-2 { width: 100%; z-index: 50; height: 35px; position: relative; background: url("bar.gif") no-repeat; } /* main-nav */ .main-nav {float: left;} .main-nav li { float: left; padding: 0 2px 0 0; position: relative; background: url("s-1.gif") no-repeat 100% 1px; } .main-nav li a { color: #fff; width: 120px; display: block; font-size: 13px; line-height: 35px; font-weight: bold; text-align: center; } .main-nav li a:hover {text-decoration: none;} .main-nav li a.t-1:hover {background: url("bg-hover-2.gif") no-repeat;} .main-nav li a#active-all {background: url("bg-hover-1.gif") repeat-x;} /*.main-nav li a#active-all {background: url("bg-active.gif") repeat-x;}*/ /*.main-nav li a#active-all:hover {background: url("bg-hover-1.gif") no-repeat;}*/ .main-nav li a#active-all:hover {background: url("bg-active.gif") no-repeat;} .main-nav li a#active-1 {background: url("bg-home-on.gif") no-repeat;} .main-nav li a#active-1:hover {background: url("bg-hover-2.gif") no-repeat;} .main-nav li a#active-2:hover {background: url("bg-home-on.gif") no-repeat;} .main-nav div { left: 0; top: 35px; width: 242px; display: none; position: absolute; } .main-nav li.hover div, .main-nav li:hover div {display: block;} .main-nav li.hover a, .main-nav li:hover a {color:#FFF; background: url("bg-hover-1.gif") no-repeat;} .main-nav li.hover a#active-all, .main-nav li:hover a#active-all {background: url("bg-hover-1.gif") no-repeat;} .main-nav li.hover a.t-1, .main-nav li:hover a.t-1 {background: url("bg-hover-2.gif") no-repeat;} .main-nav li.hover a#active-1, .main-nav li:hover a#active-1 {background: url("bg-home-on.gif") no-repeat;} .main-nav li.hover a#active-2, .main-nav li:hover a#active-2 {background: url("bg-home-on.gif") no-repeat;} .main-nav li.hover li a, .main-nav li:hover li a { color: #fff; background: url("i-5.gif") no-repeat 0 2px; } .main-nav div ul { float: none; width: 212px; padding: 18px 10px 11px 20px; background: url("bg-sub-1.png") repeat; } .main-nav li.c-1 div ul {background: url("bg-sub-2.png") repeat;} .main-nav div ul li { padding: 0; float: none; background: none; } .main-nav div ul li a { height: 1%; width: auto; font-size: 12px; text-align: left; line-height: 14px; padding: 0 0 7px 16px; background: url("i-2.gif") no-repeat 0 2px; } .main-nav div ul li a:hover {text-decoration: none;color:#C7E5EA;} .main-nav li.c-1 div ul li a {background: url("i-3.gif") no-repeat 0 2px;} /* checkout */ .checkout { float: right; text-align: right; padding: 8px 19px 0 0; } .checkout li { display: inline; font-size: 13px; font-weight: bold; line-height: 15px; padding: 0 0 0 15px; } .checkout li a {color: #fff;} .checkout li img { display: inline; margin: 0 7px 0 0; vertical-align: -2px; } .wrap-header-3 { width: 100%; overflow: hidden; padding: 10px 0 0 0; } /* form-search */ .form-search { float: right; width: 168px; height: 25px; background: url("bg-search.gif") no-repeat; } .form-search .tex { padding: 0; float: left; width: 130px; border: none; background: none; margin: 5px 0 0 10px; } .form-search #search { float: right; width: 13px; height: 13px; margin: 7px 7px 0 0; background: url("search.gif") no-repeat; } .form-search #search.hover, .form-search #search:hover {background-position: 0 -13px;} /* content */ #content { width: 100%; min-height: 332px; margin: 10px 0 10px 0; background: url("bg-content.jpg") no-repeat; } * html #content {height: 332px;} /* primary-content */ .primary-content { float: left; width: 225px; padding: 20px 0 0 20px; } /* description */ .description { height: 1%; padding: 0 0 13px 0; } .description h1 {padding: 0 0 5px 0;} .description p {line-height: 13px;} /* shop-details */ .shop-details { color: #000; width: 205px; overflow: hidden; font-size: 12px; line-height: 14px; padding: 146px 10px 10px 10px; /*background: url("bg-shop.jpg") no-repeat;*/ } .shop-details dl { width: 100%; overflow: hidden; } .shop-details .details-1 {padding: 0 0 18px 0;} .shop-details .details-1 dt { float: left; width: 15px; } .shop-details .details-1 dd { float: right; width: 190px; } .shop-details .details-2 dt { float: left; width: 105px; } .shop-details .details-2 dd { float: right; width: 100px; } .shop-details a {color: #099;} /* secondary-content */ .secondary-content { float: left; width: 430px; padding: 0 20px; } /* extra-content */ .extra-content { float: right; width: 225px; padding: 20px 20px 0 0; } /* enter-online-shop */ .enter-online-shop { height: 1%; padding: 0 0 20px 0; } .enter-online-shop a { width: 225px; height: 67px; display: block; overflow: hidden; text-indent: -12000px; background: url("enter.gif") no-repeat; } .enter-online-shop a:hover {background-position: 0 -67px;} /* latest-products, special-offers, delivery-guide */ .latest-products, .special-offers, .delivery-guide, .package-deals, .best-sellers { width: 225px; height: 155px; font-size: 11px; overflow: hidden; line-height: 13px; position: relative; margin: 0 0 20px 0; /*background: url("latest-products-box.jpg") no-repeat;*/ } .latest-products{ background: url("latest-products-box.jpg") no-repeat; } .special-offers{ background: url("special-offers-box.jpg") no-repeat; } .delivery-guide{ background: url("delivery-guide-box.jpg") no-repeat; } .package-deals{ background: url("package-deals-box.jpg") no-repeat; } .best-sellers{ background: url("best-sellers-box.jpg") no-repeat; } .latest-products .titleDesc, .special-offers .titleDesc, .package-deals .titleDesc, .best-sellers .titleDesc{ top: 119px; left: 10px; position: absolute; } .special-offers img, .latest-products img, .package-deals img, .best-sellers img  { top: 10px; left: 10px; position: absolute; } .delivery-guide img { top: 9px; left: 0; position: absolute; } .special-offers ul, .latest-products ul {padding: 17px 74px 0 10px;} .delivery-guide ul {padding: 60px 74px 7px 10px;} .delivery-guide p {padding: 0 74px 0 10px;} .special-offers ul li, .latest-products ul li {padding: 0 0 7px 0;} .special-offers ul li strong, .latest-products ul li strong { height: 1%; display: block; } .delivery-guide .more, .special-offers .more, .latest-products .more, .package-deals .more, .best-sellers .more  { top: 133px; left: 175px; width: 39px; height: 11px; overflow: hidden; position: absolute; text-indent: -12000px; background: url("more-1.gif") no-repeat; } .special-offers .more {background: url("more-2.gif") no-repeat;} .delivery-guide .more {background: url("more-3.gif") no-repeat;} .package-deals .more {background: url("more-2.gif") no-repeat;} .special-offers .more:hover, .latest-products .more:hover, .package-deals .more:hover, .best-sellers .more:hover, .delivery-guide .more:hover {background-position: 0 -11px;} /* footer */ #footer { width: 100%; color: #666; font-size: 11px; line-height: 13px; } #footer a {color: #448f8f;} #footer a:hover {color: #339900;} /* sponsors, wrap-footer-1, wrap-footer-2 */ .sponsors, .wrap-footer-1, .wrap-footer-2, .wrap-footer-3 { width: 100%; overflow: hidden; } .wrap-footer-1 { padding: 7px 0 0 0; border-top: 1px solid #B2DCE3; } .wrap-footer-1 ul {float: left;} .wrap-footer-1 ul li {display: inline;} .wrap-footer-1 ul li a {margin: 0 4px 0 0;} .wrap-footer-1 p {float: right;} .wrap-footer-2 {padding: 15px 0 0px 0;} .wrap-footer-3 {padding: 0 0 7px 0;} .wrap-footer-3 p{float: left;} .wrap-footer-2 ul, .wrap-footer-3 ul { float: right; padding: 6px 0 0 0; } .wrap-footer-2 ul li, .wrap-footer-2 ul li img, .wrap-footer-3 ul li, .wrap-footer-3 ul li img {display: inline;} .wrap-footer-2 ul li, .wrap-footer-2 ul li, .wrap-footer-3 ul li, .wrap-footer-3 ul li{padding: 0 0 0 4px;} .wrap-footer-3 ul li img {border: 1px solid #008AA3;} .sponsors { padding: 60px 0 80px 0; border-top: 1px solid #B2DCE3; } /* page-2 */ .home-link { top: 0; left: 0; width: 30px; height: 25px; overflow: hidden; position: absolute; text-indent: -12000px; background: url("bg-home.gif") repeat; } .home-link:hover {background-position: 0 -25px;} .breadcrumbs { float: left; width: 782px; height: 25px; overflow: hidden; position: relative; background: url("bg-bar-2.gif") no-repeat; } .breadcrumbs ul { padding: 0 0 0 40px; } .breadcrumbs ul li { float: left; color: #007F99; line-height: 25px; padding: 0 5px 0 8px; background: url("i-4.gif") no-repeat 0 11px; } .breadcrumbs ul li:first-child { padding-left: 0; background-image: none; } .breadcrumbs ul li a {color: #007F99;} .wrap-content { width: 100%; padding: 0 0 41px 0; } /* primary-content-2 */ .primary-content-2 { float: right; width: 675px; padding: 20px 20px 0 0; } /* main-section-one */ .main-section-one { width: 662px; height: 151px; overflow: hidden; line-height: 16px; margin: 0 0 20px 0; padding: 2px 2px 2px 11px; background: url("grad-1.gif") no-repeat; } .main-section-one h1 { color: #066; font-size: 14px; font-weight: bold; padding: 15px 0 5px 0; } .main-section-one h1.frag-Heading { font-size: 18px; margin-top:53px; } .main-section-one img { float: right; margin: 0 0 0 20px; } .wrap-sub-section { width: 695px; overflow: hidden; position: relative; margin: 0 -20px 0 0; } /* sub-section */ .sub-section { float: left; width: 327px; height: 160px; margin: 0 20px 20px 0; background: url("grad-2.gif") no-repeat; } .description-section { float: left; width: 196px; line-height: 13px; padding: 0 0 0 11px; } .description-section h2 { color: #066; font-size: 11px; font-weight: bold; padding: 9px 0 2px 0; } .description-section p {font-size: 10px;} .image-section { float: right; width: 100px; padding: 28px 12px 0 0; } .image-section img {border: 1px solid #B2DCE3;} .image-section .more { float: right; margin: 10px 0 0 0; } .image-section .more img { border: none; display: block; } /* secondary-content-2 */ .secondary-content-2 { float: left; width: 225px; padding: 20px 0 0 20px; } /* our-products */ .our-products { width: 100%; background: url("mid-1.gif") repeat-y; } .our-products h3 { height: 1%; color: #fff; font-size: 13px; line-height: 15px; padding: 8px 10px; background: url("top-1.gif") no-repeat; } .wrap-side-nav-1 { height: 1%; margin: 0 0 10px 0; background: url("mid-2.gif") repeat-y; } .wrap-side-nav-2 {background: url("top-2.gif") no-repeat;} .wrap-side-nav-3 { height: 1%; padding: 7px 11px 2px 11px; background: url("bot-2.gif") no-repeat 0 100%; } /* side-nav */ .side-nav li { padding: 0 0 7px 16px; background: url("i-2.gif") no-repeat 0 2px; } .side-nav li a { color: #066; font-size: 12px; font-weight: bold; } .side-nav li a:hover, .side-nav li a.active { color: #390; text-decoration: none; } .side-nav ul {margin: 7px 0 -7px 0;} .side-nav ul li { padding: 0 0 8px 26px; background: url("i-4.gif") no-repeat 16px 5px; } .side-nav ul li a {font-weight: normal;} /* extra-buttons */ .extra-buttons { width: 100%; margin: 0 0 -10px 0; } .extra-buttons ul { width: 100%; overflow: hidden; } .extra-buttons ul li { float: left; width: 100%; margin: 0 0 10px 0; } .extra-buttons ul li a { width: 225px; height: 67px; display: block; overflow: hidden; position: relative; } * html .extra-buttons ul li a:hover {border: 0;} .extra-buttons ul li a img { top: 0; left: 0; position: absolute; } .extra-buttons ul li a:hover img {top: -67px;} .extra-buttons ul li a.last {height: 82px;} .extra-buttons ul li a.last:hover img {top: -82px;} /* help-downloads */ .help-downloads { height: 1%; margin: 0 0 10px 0; background: url("mid-3.gif") repeat-y; } .wrap-help-downloads-1 {background: url("top-3.gif") no-repeat;} .wrap-help-downloads-2 { height: 1%; padding: 11px 1px 2px 1px; background: url("bot-3.gif") no-repeat 0 100%; } .wrap-help-downloads-2 ul { width: 100%; overflow: hidden; } .wrap-help-downloads-2 ul li { float: left; width: 100%; padding: 0 0 10px 0; } .wrap-help-downloads-2 ul li a { width: 223px; height: 21px; display: block; overflow: hidden; position: relative; } .wrap-help-downloads-2 ul li a:hover {border: 0;} .wrap-help-downloads-2 ul li a img { top: 0; left: 0; position: absolute; } .wrap-help-downloads-2 ul li a:hover img {top: -21px;} /* page-3 */ .wrap-info { width: 100%; overflow: hidden; padding-bottom: 20px; } /* product-image-panel */ .product-image-panel { float: left; width: 316px; height: 389px; padding: 7px 6px 0 5px; background: url("bg-1p.gif") no-repeat; } .product-image-panel h1 { color: #066; font-size: 13px; line-height: 15px; font-weight: bold; margin: 0 5px 2px; } .product-image-panel img {display: block;} .product-image-panel ul { margin: 0; width: 100%; overflow: hidden; list-style: none; padding: 18px 0 0; } .product-image-panel ul li.grow { float: left; padding-left: 6px; } .product-image-panel ul li.click-image { float: right; padding-top: 15px; padding-right: 5px; } /* related-products */ .related-products { float: right; width: 327px; height: 387px; overflow: hidden; padding: 9px 0 0; background: url("bg-2p.gif") no-repeat; } .related-products h2 { color: #008da4; font-size: 13px; line-height: 15px; font-weight: bold; margin: 0 11px 0; } .related-products ul { margin: 0; width: 323px; overflow: hidden; list-style: none; padding: 8px 2px 0; } .related-products ul li { float: left; width: 302px; font-size: 11px; line-height: 26px; font-weight: bold; padding: 2px 10px 10px 11px; border-top: 1px solid #B2DCE3; } .related-products ul li:first-child {border-top: none;} .related-products ul li p {margin: 0 0 19px;} .related-products ul li p strong { color: #066; display: block; } .related-products ul li .more {margin: 0;} .related-products ul li .more a img { float: none; border: none; } .related-products ul li img { float: right; margin: 8px 0 0; border: 1px solid #B2DCE3; } /* product-description */ .product-description { color: #333333; float: left; width: 327px; line-height: 14px; margin-top: -1px; } .product-description p {margin: 0 20px 7px 0;} .product-description .back {padding: 17px 0 0;} .product-description ul{ margin: 0; padding: 0; list-style: none; } .product-description ul li { /*color: #066;*/ line-height: 16px; padding: 0 0 9px 9px; background: url("i-4.gif") no-repeat 2px 5px; } /* product-specifications */ .product-specifications { float: right; width: 327px; background: url("mid-4.gif") repeat-y; } .wrap-product-specifications-1 {background: url("top-4.gif") no-repeat;} .wrap-product-specifications-2 { height: 1%; min-height: 270px; padding: 8px 11px 14px; background: url("bot-4.gif") no-repeat 0 100%; } * html .wrap-product-specifications-2 {height: 270px;} .wrap-product-specifications-2 h3 { color: #008da4; font-size: 13px; line-height: 15px; font-weight: bold; margin: 0 0 24px; } .wrap-product-specifications-2 img  {margin: 0 0 10px 7px;} .wrap-product-specifications-2 ul { margin: 0; padding: 0; list-style: none; } .wrap-product-specifications-2 ul li { color: #066; line-height: 16px; padding: 0 0 9px 9px; background: url("i-4.gif") no-repeat 2px 5px; } .wrap-product-specifications-2 ul li a {color: #066;} /* compact-product-layout */ .compact-product-layout { width: 675px; margin-bottom: 17px; background: url("mid-5.gif") repeat-y; } .wrap-compact-product-layout-1 {background: url("top-5.gif") no-repeat;} .wrap-compact-product-layout-2 { height: 1%; padding: 0 2px; overflow: hidden; background: url("bot-5.gif") no-repeat 0 100%; } /* product-table */ .product-table { margin: 0; padding: 0; color: #066; border: none; font-weight: bold; border-collapse: collapse; } .product-table td { border: none; padding-left: 5px; padding-right: 5px; padding-top: 10px; padding-bottom: 9px; border-bottom: 1px solid #B2DCE3; } .product-table td.last {border-bottom: none;} .product-table .td-1 { width: 382px; padding-left: 10px; } .product-table .td-2 { width: 60px; color: #000; font-size: 13px; text-align: right; } .product-table .td-2a { width: 60px; color: #000; font-size: 13px; text-align: right; } .product-table .td-3 {width: 66px;} .product-table .td-3 label { font-size: 13px; vertical-align: middle; } .product-table .td-3 input { width: 26px; padding: 3px 2px; margin: 0 0 0 6px; text-align: center; vertical-align: middle; border: 1px solid #B2DCE3; } .product-table .td-4 { width: 53px; text-align: right; padding-right: 10px; } h2.fragment-title, h2.fragment-subtitle { color: #066; font-size: 16px; font-weight: bold; padding: 2px 0 9px 0; } h2.fragment-subtitle { font-size: 12px; padding: 2px 0 3px 0; } h1.fragment-heading { color: #066; font-size: 13px; font-weight: bold; /*padding: 2px 0 9px 0;*/ } .chkouterror{ border:1px solid #CC0000; background-color:#FFF; margin-top:10px;	 } #noFragList{ line-height: 180%; font-size:12px; color:#006666; font-weight:bold; } #shipping table tr td{ color:#333333; font-family:arial,verdana,helvetica,sans-serif; font-size:11px; border: solid 1px #B2DCE3; padding: 3px; margin: 3px; } #shipping td{ text-align:left; vertical-align:top; } #shipping .heading{ color: #FFFFFF; font-size: 11px; background-color: #00889E; } #contactPanel{ width:250px; float:right; padding:12px 0 0; margin:0; } #contactPanel .tel-no{ float:right; padding:0 0 10px; } #contactPanel  .add-This { /*clear:right;*/ float:right; width:250px; } #contactPanel .add-This img{ border:0; display:inline; float:right; }