@charset "utf-8"; /* PROJECTNAAM STYLES Author: Sebastiaan Smid, Netvlies ----------------------------------------------------*/ /* Table of contents =RESETS =FIXES =BOX MODEL ----------------------------------------------------*/ /* =RESETS ----------------------------------------------------*/ * { margin: 0; padding: 0; outline: 0; font-family: Arial, Verdana, Helvetica; font-size: 12px; color: #444; } img { border: 0; } body { background: #fff; } /* =FIXES ----------------------------------------------------*/ .clr { overflow: hidden; height: 100%; } /* =BOX MODEL ----------------------------------------------------*/ #page-box { background: none; } #page-inner-box { background: none; } #header { background: none; } #content-box { width: 686px; padding: 0 0 0 0; background: none; } #content-inner-box { width: 686px; } #col-a { display: none; } #col-b { width: 676px; xfloat: left; padding: 10px 0 0 0; } hr { color: #9c9c9c; float: left; background: #9c9c9c; border: none; height: 1px; margin: 15px 0; } #fof { margin-left: 111px; } #vsl-balloon { display: none; } /* =NAV MAIN ----------------------------------------------------*/ #nav-main { width: 686px; display: block; } #nav-main li { display: none; float: left; } #nav-main li.logo { display: block; margin: 20px 0 0 28px; } #nav-main li.logo a { height: 51px; } /* =FORM SEARCH ----------------------------------------------------*/ #frm-search { display: none; } /* =CRUMB PATH ----------------------------------------------------*/ #crumbpath { display: none; } /* =SEARCH RESULTS ----------------------------------------------------*/ #results .result { display: block; overflow: hidden; margin-bottom: 10px; width: 452px; height: 80px; padding: 3px; } #results .result.green { background: url(../img/search-result_green_bg.gif); } #results .result.green em { font-style: normal; background: #fff; color: #74b337; } #results .result.red { background: url(../img/search-result_red_bg.gif); } #results .result.red em { font-style: normal; background: #fff; color: #cd343f; } #results .result.blue { background: url(../img/search-result_blue_bg.gif); } #results .result.blue em { font-style: normal; background: #fff; color: #009bcf; } #results .result.orange { background: url(../img/search-result_orange_bg.gif); } #results .result.orange em { font-style: normal; background: #fff; color: #ff9000; } #results .result em { padding: 0 2px; } #results .result a { color: #fff; } #results .result a.vsl { display: block; width: 76px; height: 76px; padding: 2px 4px; float: left; background: url(../img/search-result_img_bg.png) } #results .result h2 { display: block; float: left; width: 350px; height: 15px; font-size: 13px; overflow: hidden; margin: 2px 0 0 14px; float: left; } #results .result h2 * { font-size: 13px; } #results .result .content { float: left; display: block; width: 350px; height: 48px; overflow: hidden; line-height: 16px; margin: 5px 0 0 14px; } #results .result .content a { text-decoration: none; } #frm-search-result { height: 23px; margin: 0 0 9px 0; line-height: 23px; } #frm-search-result span { float: left; margin-right: 20px; } #frm-search-result label { width: 163px; float: left; left: 20px; display: block; background: url(../img/frm_search-result_inputbg.gif) no-repeat; height: 23px; } #frm-search-result label input.txt { float: left; border: 0; background: none; font-weight: normal; width: 95px; height: 19px; margin: 4px 0 0 7px; color: #444; } #frm-search-result label input.submit { display: none; float: left; margin: 0; border: 0; } /* =SHOPPINGCART ----------------------------------------------------*/ #shoppingcart { width: 667px;margin: 0 0 0 9px; } #shoppingcart .top { height: 12px; font-size: 0; line-height: 12px; background: url(../img/shopping-cart_top_bg.png); } #shoppingcart .bottom { height: 12px; font-size: 0; line-height: 12px; background: url(../img/shopping-cart_bottom_bg.png); } #shoppingcart .content { background: #fff; padding: 0 20px; } #shoppingcart h1 { margin-bottom: 2px; } #shoppingcart .steps { display: none; margin: 10px 0; overflow: hidden; height: 45px; } #shoppingcart .steps div { float: left; display: block; height: 45px; overflow: hidden; } #shoppingcart .steps a { float: left; display: block; height: 45px; overflow: hidden; } #shoppingcart .steps .past img { margin-top: -90px; } #shoppingcart .steps .active img { margin-top: -45px; } #cart-overview { } #cart-overview h2 { overflow: hidden; clear: both; } #cart-overview h2 span { color: #686868; display: block; float: left; } #cart-overview .colhrd-a { width: 400px; padding: 0 0 0 4px; } #cart-overview .colhrd-b { width: 80px; } #cart-overview .colhrd-c { width: 80px; } #cart-overview .product { width: 621px; height: 80px; padding: 3px; margin: 8px 0 0 0; } #cart-overview .product.green { background:url(../img/shopping-cart_product-bg_green.gif); } #cart-overview .product.orange { background:url(../img/shopping-cart_product-bg_orange.gif); } #cart-overview .product.blue { background:url(../img/shopping-cart_product-bg_blue.gif); } #cart-overview .product.red { background:url(../img/shopping-cart_product-bg_red.gif); } #cart-overview .product .vsl { display: block; width: 76px; height: 76px; padding: 2px 4px; float: left; background: url(../img/search-result_img_bg.png) } #cart-overview .product .text { color: #fff;font-weight: bold; float: left; width: 290px; height: 62px; padding: 5px 10px; overflow: hidden; } #cart-overview .product .text h3 { margin-bottom: 5px; } #cart-overview .product .text h3 a { color: #fff; } #cart-overview .product .num { text-align: center; float: left; width: 80px; padding-top: 28px; } #cart-overview .product .fixednum { text-align: center; float: left; width: 80px; padding-top: 30px; color: #fff; } #cart-overview .product .price { color: #fff; font-weight: bold; text-align: center; float: left; width: 80px; padding-top: 30px; } #cart-overview .product select { border: 1px solid #c6c6c6; } #cart-overview .product .del { text-align: center; float: left; width: 67px; padding-top: 24px; } .price-overview { overflow: hidden; width: 627px; margin-top: 10px; } .price-overview .reload { float: left; font-weight: bold; font-size: 16px; margin: 20px 0 0 0; } .price-overview .totalprice { float: right; display: inline; margin-right: 43px; } .price-overview .totalprice span { float: left; margin-right: 21px; line-height: 24px; font-size: 18px; font-weight: bold; } .price-overview .totalprice div { float: left; } .price-overview .totalprice small { font-size: 10px;} .price-overview .totalprice td.right { text-align: right; } #cart-overview .footer, #cart-user-data .footer, #cart-extra-options .footer,#cart-final-overview .footer { display: none; } #cart-user-data .hr { display: block; } #user-data { background: url(../img/shopping-cart_fieldset_1_bg.gif) no-repeat 410px 40px;} #delivery-data { display: none; } #payment-options { background: url(../img/shopping-cart_fieldset_2_bg.gif) no-repeat 460px 10px; } form.user-form .footer { display: none; } #cart-extra-options { } #cart-extra-options #gift-card .cards { overflow: hidden; clear: both; width: 402px; } #cart-extra-options #gift-card .card { float: left; margin-right: 10px; width: 124px; height: 120px; } #cart-extra-options #gift-card .card .vsl { position: relative; float: left; width: 124px; height: 86px; } #cart-extra-options #gift-card .card .vsl .magnifier { position: absolute; bottom: 8px; right: 8px; } #cart-extra-options #card-text { width: 392px; height: 105px; margin-bottom: 10px; border: 1px solid #c6c6c6; } #cart-adress-overview { overflow: hidden; clear: both; padding: 0 0 10px 0; border-bottom: 1px solid #c6c6c6; } #cart-adress-overview ul { margin-top: 20px; width: 300px; float: left; } #cart-adress-overview ul li { list-style: none; } #cart-adress-overview ul li label { font-weight: bold; float: left; display: block; width: 140px; background: url(../img/user-content_frm_label_bg.gif) no-repeat 130px 8px; } #cart-adress-overview ul li h3 { color: #74b337; margin-bottom: 10px; } #cart-adress-overview ul li h3 span { color: #74b337; font-size: 9px;} #cart-adress-overview ul li h3 a { color: #74b337;font-size: 9px; } #cart-card-overview { color: #74b337; overflow: hidden; width: 100%; clear: both; padding: 0 0 10px 0; } #cart-card-overview h3 span { color: #74b337; font-size: 9px;} #cart-card-overview h3 a { color: #74b337; font-size: 9px; } #cart-card-overview ul { margin-top: 20px; width: 200px; float: left; } #cart-card-overview ul li { list-style: none; } #cart-card-overview ul li label { font-weight: bold; float: left; display: block; width: 130px; background: url(../img/user-content_frm_label_bg.gif) no-repeat 125px 8px; } #cart-card-overview ul li img { margin-top: 5px; } #cart-card-overview ul li h3 { color: #74b337; margin-bottom: 10px; } #cart-card-overview ul li h3 span { color: #74b337; font-size: 9px;} #cart-card-overview ul li h3 a { color: #74b337;font-size: 9px; } #cart-card-overview .card-text { font-weight: normal; float: left; width: 400px; padding: 45px 0 0 0; } #cart-final-overview h2 { overflow: hidden; clear: both; } #cart-final-overview h2 span { color: #686868; display: block; float: left; } #cart-final-overview .colhrd-a { width: 460px; padding: 0 0 0 4px; } #cart-final-overview .colhrd-b { width: 80px; } #cart-final-overview .colhrd-c { width: 80px; } #cart-final-overview .product { width: 621px; height: 80px; padding: 3px; margin: 8px 0 0 0; } #cart-final-overview .product.green { background:url(../img/shopping-cart_product-bg_green2.gif); } #cart-final-overview .product.orange { background:url(../img/shopping-cart_product-bg_orange2.gif); } #cart-final-overview .product.blue { background:url(../img/shopping-cart_product-bg_blue2.gif); } #cart-final-overview .product.red { background:url(../img/shopping-cart_product-bg_red2.gif); } #cart-final-overview .product .vsl { display: block; width: 76px; height: 76px; padding: 2px 4px; float: left; background: url(../img/search-result_img_bg.png) } #cart-final-overview .product .text { color: #fff;font-weight: bold; float: left; width: 342px; height: 62px; padding: 5px 10px; overflow: hidden; } #cart-final-overview .product .text h3 { margin-bottom: 5px; } #cart-final-overview .product .text h3 a { color: #fff; } #cart-final-overview .product .fixednum { text-align: center; float: left; width: 85px; padding-top: 30px; color: #fff; } #cart-final-overview .product .price { color: #fff; font-weight: bold; text-align: center; float: left; width: 90px; padding-top: 30px; } #cart-final-overview .product select { border: 1px solid #c6c6c6; } #cart-final-overview #price-overview { overflow: hidden; width: 627px; margin-top: 10px; } #cart-final-overview #price-overview .totalprice { float: right; display: inline; margin-right: 43px; } #cart-final-overview #price-overview .totalprice span { float: left; margin-right: 21px; line-height: 30px; font-size: 18px; font-weight: bold; } #cart-final-overview #price-overview .totalprice div { float: left; } /* =PRODUCT DETAIL ----------------------------------------------------*/ #product-detail .col-a { width: 172px; float: left; margin-right: 20px; } #product-detail .col-b { width: 266px; float: left; } #product-detail .info { background: url(../img/product-detail_left_bg.gif) no-repeat; } #product-detail .info h3 { padding: 8px 0; font-size: 15px; color: #444; } #product-detail .productsize { display: block; } #product-detail .productsize .sizes { display: none; overflow: hidden; height: 100%; } #product-detail .productsize a { position: relative; float: left; display: block; height: 25px; margin: 0 2px 2px 0; overflow: hidden; } #product-detail .productsize a.selected img { position: relative; top: -25px; } #product-detail .productsize a.na img { cursor: default; position: relative; top: -50px; } #product-detail .productsize .loader { display: none; position: absolute; left: 86px; } #print-productsizes { display: block !important; } #print-productsizes ul li { margin: 0 0 0 14px; } #product-detail .productcolour { display: block; } #product-detail .productcolour .colors div { display: none; } #product-detail .productcolour a, #product-detail .productcolour a img { display: none; } #product-detail .productcolour .colors #print-colours { display: block; } #print-colours ul li { margin: 0 0 0 14px; } #product-detail .productcolour .loader { display: none; position: absolute; left: 86px; } #product-detail .product-price { padding: 15px 0; color: #808080; font-weight: bold; font-size: 15px; } #product-detail .product-price strong { color: #444; font-size: 15px; } #product-detail .description { margin-bottom: 15px; } #frm-product-intobasket { } #carrousel { display: none; } #product-intobasket { display: none; } .productsizealert, .productcolouralert { display: none; } #carrousel{ position: relative; width: 172px; padding: 0; height: 44px; overflow: hidden; } #carrousel-box { width: 144px; margin-left: 16px; } #carrousel-box ul { list-style: none; height: 44px; overflow: hidden; } #carrousel-box ul li { float: left; display: inline; margin: 0 4px 0 0; padding: 0; } #carrousel-box ul li.active { background: #e5e5e5; } #carrousel-box ul li.empty { background: #f1f1f1; border: 1px solid #eaeaea; } #carrousel-box ul li.first { margin-left: 0; } #carrousel-box ul li a { overflow: hidden; display: block; height: 44px; width: 44px; background: #f2f2f2; } #carrousel-box ul li a img { vertical-align: bottom; } #carrousel .next { position: absolute; top: 0; right: 0; width: 19px; } #carrousel .prev { position: absolute; top: 0; left: 0; width: 19px;} #carrousel .prev.disabled, #carrousel .next.disabled { display: none; } #carrousel .prev, #carrousel .next { display: none; } /* =CONTENT BLOCKS ----------------------------------------------------*/ /* small blocks */ .block .vsl { display: block; padding: 6px 10px 14px 10px;} .block .text { display: block; height: 28px; overflow: hidden; padding: 0 10px; line-height: 14px; font-size: 12px; color: #444; text-decoration: none; } .block .text * { color: #444; } .block.product { } .block { position: relative; width: 160px; height: 198px; float: left; margin: 0 0 9px 5px; } .block.red { background: none; } .block.green { background: none; } .block.orange { background: none; } .block.blue { background: none; } .block.info { background:url(../img/block_info_bg.png); } .block.info h2 { margin: 10px 16px; } .block.info .text { margin: 0 16px; height: 150px; overflow: hidden; color: #fff; line-height: 15px; font-size: 12px; padding: 0; } /* small basket block */ #basket { display: none; } /* small auswahl block */ #auswahl { display: none; } /* small angesehen block */ #angesehen { display: none; } /* 2 blocks in 1 */ .duoblock { position: relative; width: 329px; height: 198px; float: left; margin: 0 0 9px 5px; } .duoblock.duored { background:url(../img/duoblock_red_bg.png); } .duoblock.duogreen { background:url(../img/duoblock_green_bg.png); } .duoblock.duoorange { background:url(../img/duoblock_orange_bg.png); } .duoblock.duoblue { background:url(../img/duoblock_blue_bg.png); } /* 2 blocks with text */ .duoblock.text .user-content { margin: 0 15px; height: 112px; overflow: hidden !important; } .duoblock.text h2 { padding: 10px 15px; } .duoblock .more { position: absolute; bottom: 12px; left: 10px; } /* 2 blocks with product search */ .duoblock.productsearch { background: none; } .duoblock.productsearch * { display: none; } /* 3 blocks with product search */ .triblock { position: relative; width: 498px; float: left; margin: 0 0 9px 9px; } #triblock-top { height: 12px; overflow: hidden; line-height: 12px; background: url(../img/triblock-top_bg.png) no-repeat left top; } #triblock-bottom { height: 12px; overflow: hidden; line-height: 12px; background: url(../img/triblock-bottom_bg.png) no-repeat right bottom; } #triblock-content { background: #fff; } #triblock-content h1 { margin-bottom: 2px; } #triblock-content { padding: 0 20px 0 20px; } #categories-hdr { overflow: hidden; height: 100%; } #categories-hdr .sorting { position: relative; float: left; margin: 0 0 9px 9px; overflow: hidden; width: 498px; height: 26px; background:url(../img/categories_long_bg.png); } #categories-hdr .sorting img { float: left; margin-left: 10px; } #categories-hdr .sorting form { float: right; padding: 3px 2px 0 0; } #categories-hdr .sorting form select { border: 1px solid #c6c6c6; width: 120px; } #categories-hdr .sorting form select, #categories-hdr .sorting form input.submit { vertical-align:top; } .showitems { float: left; text-align: center; padding: 0 5px 0 0; margin: 0 0 9px 9px; width: 155px; height: 26px; background:url(../img/categories_short_bg.png); } .showitems, .showitems * { color: #009bcf; line-height: 26px; } #categories-footer { display: none; } #categories-footer .paging { float: left; margin: 0 0 9px 9px; width: 498px; height: 26px; overflow: hidden; background:url(../img/categories_long_bg.png); } #categories-footer .paging ol { display: block; text-align: center; height: 18px; } #categories-footer .paging li { display: inline; line-height: 18px; } #categories-footer .paging li span { background: #009bcf url(../img/paging_left_bg.gif) no-repeat left top; } #categories-footer .paging li span span { line-height: 18px; background:url(../img/paging_right_bg.gif) no-repeat right top; } /* =POPUP ----------------------------------------------------*/ #nvs_popup .tl { width: 8px; height: 8px; background: url(../img/popup_tl.png) no-repeat; position: absolute; top: 0; left: 0; } #nvs_popup .tr { width: 8px; height: 8px; background: url(../img/popup_tr.png) no-repeat; position: absolute; top: 0; right: 0; } #nvs_popup .bl { width: 8px; height: 8px; background: url(../img/popup_bl.png) no-repeat; position: absolute; bottom: 0; left: 0; } #nvs_popup .br { width: 8px; height: 8px; background: url(../img/popup_br.png) no-repeat; position: absolute; bottom: 0; right: 0; } #nvs_popup_innerbox { position: relative; padding: 6px 37px; } #nvs_popup_header { padding: 0 0 0 17px; text-align: left; font-size: 11px; color: #989898; margin-bottom: 12px; } #nvs_popup_header strong { font-size: 11px; color: #494949; } #nvs_popup_close { position: absolute; top: -28px; right: 13px; font-size: 12px; font-weight: bold; color: #fff; text-decoration: underline; cursor: pointer; } #nvs_popup_prev, #nvs_popup_next { position: absolute; top: 0px; width: 17px; height: 100%; cursor: pointer; } #nvs_popup_next { right: 0px;background: url(../img/nvs_popup_next.gif) no-repeat left center; } #nvs_popup_prev { left: 0px; background: url(../img/nvs_popup_prev.gif) no-repeat right center; } /* =PAGING ----------------------------------------------------*/ .paging { display: none; } .user-form { width: 100%; margin:0; padding: 0; font-family: Arial; font-size: 12px; line-height: 19px; } .user-form h2 { color: #7bb049; font-size: 16px; } .user-form h3 { color: #7bb049 !important; font-size: 12px; } .user-form div.small, .user-form small { font-size: 10px; } .user-form .required { line-height: 1.5em; margin-left: 5px; } .user-form .required img { vertical-align: text-top; margin: 4px 0 0 0; } .user-form fieldset { border: 0; padding: 10px 0 0 0; } .user-form li { list-style: none; padding: 0 0 5px 0; height: 100%; overflow: hidden; } .user-form li label { display: block; float: left; width: 145px; font-weight: bold; background: url(../img/user-content_frm_label_bg.gif) no-repeat 135px 8px; } .user-form li.smalllabel label { display: block; float: left; width: 160px; font-weight: bold; background: url(../img/user-content_frm_label_bg.gif) no-repeat 150px 8px; } .user-form li.smalllabel div { float: left; width: 265px;} .user-form li.mediumlabel label { display: block; float: left; width: 205px; font-weight: bold; background: url(../img/user-content_frm_label_bg.gif) no-repeat 195px 8px; } .user-form li.mediumlabel div { float: left; width: 250px;} .user-form li.largelabel label { display: block; float: left; width: 275px; font-weight: bold; background: url(../img/user-content_frm_label_bg.gif) no-repeat 270px 8px; } .user-form li.largelabel div { float: left; width: 180px;} .user-form li label.radio { background: none; font-weight: normal; margin-right: 10px; } .user-form li div { float: left; width: 310px;} .user-form li div label { display: inline !important; float: none !important;vertical-align: middle; } .user-form li div span.error { clear: both; font-size: 10px; line-height: 12px; display: block; margin: 0; padding: 5px 0 0 24px; font-weight: bold; color: #da2e2e; background: url(../img/user-content_frm_error.gif) no-repeat 8px center; } .user-form li input { float: left; margin: 0; padding: 2px 0; } .user-form li input.text { width: 245px; border: 1px solid #b2b4b3; } .user-form li input.textlarge { width: 180px; border: 1px solid #b2b4b3; } .user-form li input.textsmall { width: 60px; border: 1px solid #b2b4b3; margin-left: 3px;} .user-form li input.textmedium { width: 120px; border: 1px solid #b2b4b3; } .user-form li input.textmedium.margin { margin-left: 3px; } .user-form li input.radio { float: none; vertical-align: middle; margin-right: 5px; } .user-form li input.checkbox { height: 1em; vertical-align: middle; } .user-form li label.checkbox { display: block; } .user-form li input.submit { } .user-form li select.select { width: 245px; border: 1px solid #b2b4b3; } .user-form li select.multiselect { width: 245px; border: 1px solid #b2b4b3; } .user-form li textarea { float: left; width: 290px; line-height: 1.1em; height: 9.9em; border: 1px solid #b2b4b3; } .user-form hr { margin: 5px 0; width: 400px; color: #9c9c9c; background: #9c9c9c; border: 0; height: 1px; }