/* ### GENERAL ### */ * { margin: 0px; padding: 0px; } html, body { font-family: Arial; font-size: 12px; color: #939598; } input, select, textarea { font-family: Arial; font-size: 12px; color: #000; } body { padding-bottom: 20px; background: #1c5b86 url('images/body-back.png') repeat-x 0 0; } img { border: 0px; display: block; } a {font-family: Arial; font-size: 12px; color: #939598;} a:hover {color: #0099cc; text-decoration: underline;} a.smaller {font-family: Arial; font-size: 11px; color: #939598;} /* ### GLOBAL CLASSES ### */ .clear { clear: both; height: 1px; } /* ### WRAPPER ### */ #wrapper { position: relative; display: block; width: 100%; min-height: 100%; background: url('images/header.png') no-repeat center top; } /* ### MAIN CONTAINER ### */ #mainCntr { margin: 0px auto; width: 980px; } /* ### HEADER CONTAINER ### */ #headerCntr { position: relative; width: 1000px; height: 193px; } #headerCntr h1 { width: 379px; height: 95px; margin-top: 40px; margin-left: 10px; } #headerCntr h1 a { width: 379px; height: 95px; display:block; text-indent: -9999px; background: url('images/logo.png') no-repeat 0 0; } /* ### TOP BOX ### */ .topBox { padding: 0 15px 0 15px; height: 26px; width: auto;} .topBox p { line-height: 26px; font-family: Verdana; font-size: 11px; color: #c1c6c9; } .topBox p.rightText{ float:right; } .topBox span { color: #4091c9; } /* ### MENU CONTAINER ### */ #menuCntr { width: auto; height: 51px; background: url('images/menu-back.gif') no-repeat 0 0; } /* ### MENU BOX ### */ .menuBox ul { list-style: none;} .menuBox ul li { list-style: none; line-height: 51px; float: left } .menuBox ul li.zoek { list-style: none; line-height: 51px; float: right; margin-right:10px; } .menuBox ul li a { padding: 0 23px 0 20px; color: #939598; font-size: 12px; text-decoration: none; background: url('images/separator.png') no-repeat right 4px; } .menuBox ul li.last a { background: none; } .menuBox ul li a:hover { color: #636466; font-size: 12px; } .menuBox ul li a.active { color: #636466; font-size: 14px; font-family: 'Trebuchet MS'; } /* ### LOGIN BOX ### */ .loginBox { float: right; height: 51px; } .loginBox form { padding-top: 8px; } .loginBox form fieldset { border: 0px; width: 375px; } .loginBox form fieldset label { color: #939598; position: relative; top: -9px; } .loginBox form fieldset input.textInput { padding: 2px; width: 126px; height: 14px; color: #939598; font-size: 11px; margin: 0 5px 0 5px; border: inset 1px #CCCCCC; position: relative; top: -10px; } .loginBox form fieldset input.button { } /* ### BANNER CONTAINER ### */ #bannerCntr { padding: 14px 10px 17px 10px; height: 145px; background-color: #d7dfe3; } /* ### BANNER BOX ### */ .bannerBox { padding: 0 4px 0 4px; width: 472px; height: 145px; float:left; } /* ### CONTENT CONTAINER ### */ #contentCntr { padding-bottom: 15px; overflow: hidden; width: 980px; background: #eff2f4 url('images/body-left.gif') repeat-y 0 0; } /* ### LEFT CONTAINER ### */ #leftCntr { float: left; display: inline; width: 201px; } /* ### CATEGORIEN BOX ### */ .categorienBox { width: 100%;} .categorienBox h2 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/categorien.gif') no-repeat 0 0; } .categorienBox ul { padding: 3px 9px 10px 9px; } .categorienBox ul li { padding-left:12px; line-height:21px; list-style: none; background: url('images/right-arrow.gif') no-repeat left 7px; } .categorienBox ul li a { padding-left: 10px; color: #767779; font-size: 13px; text-decoration: none; } .categorienBox ul li a:hover { text-decoration: underline; } .categorienBox ul li.subCat { background: url('images/down-arrow.gif') no-repeat left 8px; } .categorienBox ul li.subCat ul { padding: 0px 9px 0px 9px; } .categorienBox ul li.subCat ul li { background: none; } /* ### AANBIEDINGEN BOX ### */ .aanbiedingenBox { padding-bottom: 10px; } .aanbiedingenBox h2 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/aanbiedingen2.gif') no-repeat 0 0; } .aanbiedingenBox img { width: 100px; } .aanbiedingenBox p {margin-left:10px; padding: 8px; color: #636466; font-size: 8px; } /* ### WINKELWAGEN BOX ### */ .winkelwagenBox { padding-bottom: 15px; } .winkelwagenBox h2 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/winkelwagen.gif') no-repeat 0 0; } .winkelwagenBox p { padding: 8px; color: #636466; font-size: 13px; } /* ### RIGHT CONTAINER ### */ #rightCntr { float: left; margin-left:0px; width: 778px; } /* ### CONTENTPAGINA CONTAINER ### */ #contentpaginaCntr { float: left; margin-left:20px; width: 500px;} /* ### CONTENTPAGINA2 CONTAINER ### */ #contentpaginaCntr2 { margin-left:20px; width: 300px;} /* ### CONTENTPAGINA3 CONTAINER ### */ #contentpaginaCntr3 { float: right; margin-right:60px;} /* ### CONTENTPAGINA4 CONTAINER ### */ #contentpaginaCntr4 { float: left; margin-left:20px;} /* ### CONTENTPAGINA5 CONTAINER ### */ #contentpaginaCntr5 { float: left; margin-left:300px;} /* ### CONTENTPAGINA6 CONTAINER ### */ #contentpaginaCntr6 { float: left; margin-left:480px;} /* ### CONTENTPAGINA7 CONTAINER ### */ #contentpaginaCntr7 { float: left; margin-left:60px; width: 600px;} /* ### CONTENTPAGINA8 CONTAINER ### */ #contentpaginaCntr8 { float: left; margin-left:10px;} /* ### WELKOM BOX ### */ .welkomBox { padding-bottom: 31px; } .welkomBox h1 { height: 36px; background: #e6eaed url('images/home-icon.gif') no-repeat right center; } .welkomBox h1 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/welkom.gif') no-repeat 6px 0; } .welkomBox p { padding:12px; color: #939598; } /* ### WINKELWAGENPAGINA BOX ### */ .winkelwagenpaginaBox { padding-bottom: 31px; } .winkelwagenpaginaBox h3 { height: 36px; background: #d7dde1 url('images/winkelwagenpagina-icon.gif') no-repeat right center; } .winkelwagenpaginaBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/winkelwagenpagina.gif') no-repeat 6px 0; } .winkelwagenpaginaBox p { padding:12px; color: #939598; } /* ### BESTELLING BOX ### */ .bestellingBox { padding-bottom: 31px; } .bestellingBox h3 { height: 36px; background: #d7dde1 url('images/winkelwagenpagina-icon.gif') no-repeat right center; } .bestellingBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/bestelling.gif') no-repeat 6px 0; } .bestellingBox p { padding:12px; color: #939598; } /* ### NIEUWSTE BOX ### */ .nieuwsteBox { width: 100%; } .nieuwsteBox h3 { height: 36px; margin-bottom: 30px; background: #d7dde1 url('images/nieuwste-icon.gif') no-repeat right center; } .nieuwsteBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background:url('images/nieuwste.gif') no-repeat 6px 0; } .nieuwsteBox p { padding: 6px 13px 6px 13px; font-family: Arial; font-size: 13px; color: #000000; } /* ### FOOTER CONTAINER ### */ #footerCntr { padding: 9px; overflow: hidden; width: 962px; background: #d7dde1 url('images/footer-back.gif') no-repeat center bottom; } /* ### INFORMATIE BOX ### */ .informatieBox { padding: 0 20px 0 15px; color: #939598; width: 250px; float: left; background: url('images/right-line.gif') repeat-y right 0; } .informatieBox h4 { height: 30px; background: url('images/informatie-icon.gif') no-repeat right center; } .informatieBox h4 span { height: 30px; width: auto; text-indent: -9999px; display: block; background: url('images/informatie.gif') no-repeat 6px 0; } .informatieBox p{ padding:0px 6px 6px 6px; } /* ### BELANGRIJK BOX ### */ .belangrijkBox { padding: 0 40px 0 15px; color: #939598; width: 345px; float:left; background:url('images/right-line.gif') repeat-y right 0; } .belangrijkBox h4 { height: 30px; background: url('images/belangrijk-icon.gif') no-repeat right center; } .belangrijkBox h4 span { height: 30px; width: auto; text-indent: -9999px; display: block; background:url('images/belangrijk.gif') no-repeat 6px 0; } .belangrijkBox p{ padding:0px 6px 6px 6px; } /* ### CONTACT BOX ### */ .contactBox { padding: 0 20px 0 15px; color: #939598; width: 240px; float: left; } .contactBox h4 { height: 30px; background: url('images/contact-icon.gif') no-repeat right center; } .contactBox h4 span { height: 30px; width: auto; text-indent: -9999px; display: block; background: url('images/contact.gif') no-repeat 6px 0; } .contactBox p{ padding:0px 6px 6px 6px; } /* ### CONTACTPAGINA BOX ### */ .contactpaginaBox { padding-bottom: 31px; } .contactpaginaBox h3 { height: 36px; background: #d7dde1 url('images/contact-icon.gif') no-repeat right center; } .contactpaginaBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/contact.gif') no-repeat 6px 0; } .contactpaginaBox p { padding:12px; color: #939598; } /* ### UWGEGEGEVENS BOX ### */ .uwgegevensBox { padding-bottom: 31px; } .uwgegevensBox h3 { height: 36px; background: #d7dde1 url('images/contact-icon.gif') no-repeat right center; } .uwgegevensBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background: url('images/uwgegevens.gif') no-repeat 6px 0; } .uwgegevensBox p { padding:12px; color: #939598; } /* ### ARTIKELEN BOX ### */ .artikelenBox { width: 100%; } .artikelenBox h3 { height: 36px; margin-bottom: 30px; background: #d7dde1 url('images/nieuwste-icon.gif') no-repeat right center; } .artikelenBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background:url('images/artikelen.gif') no-repeat 6px 0; } .artikelenBox p { padding: 6px 13px 6px 13px; font-family: Arial; font-size: 13px; color: #000000; } /* ### KOCHTEN BOX ### */ .ookgekochtBox { width: 100%; } .ookgekochtBox h3 { height: 36px; margin-bottom: 30px; background: #d7dde1 url('images/informatie-icon.gif') no-repeat right center; } .ookgekochtBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background:url('images/kochtenookpagina.gif') no-repeat 6px 0; } .ookgekochtBox p { padding: 6px 13px 6px 13px; font-family: Arial; font-size: 13px; color: #000000; } /* ### SUBCATEGORIEN BOX ### */ .subcategorienBox { width: 100%; } .subcategorienBox h3 { height: 36px; margin-bottom: 30px; background: #d7dde1 url('images/nieuwste-icon.gif') no-repeat right center; } .subcategorienBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background:url('images/subcategorien.gif') no-repeat 6px 0; } .subcategorienBox p { padding: 6px 13px 6px 13px; font-family: Arial; font-size: 13px; color: #000000; } /* ### ZOEKRESULTATEN BOX ### */ .zoekresultatenBox { width: 100%; } .zoekresultatenBox h3 { height: 36px; margin-bottom: 30px; background: #d7dde1 url('images/nieuwste-icon.gif') no-repeat right center; } .zoekresultatenBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background:url('images/zoekresultaten.gif') no-repeat 6px 0; } .zoekresultatenBox p { padding: 6px 13px 6px 13px; font-family: Arial; font-size: 13px; color: #000000; } /* ### OVERONS BOX ### */ .overonsBox { width: 100%; } .overonsBox h3 { height: 36px; margin-bottom: 30px; background: #d7dde1 url('images/informatie-icon.gif') no-repeat right center; } .overonsBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background:url('images/overons.gif') no-repeat 6px 0; } .overonsBox p { padding: 6px 13px 6px 13px; font-family: Arial; font-size: 13px; color: #000000; } /* ### FAQ ### */ .faqBox { width: 100%; } .faqBox h3 { height: 36px; margin-bottom: 30px; background: #d7dde1 url('images/belangrijk-icon.gif') no-repeat right center; } .faqBox h3 span { height: 36px; width: auto; text-indent: -9999px; display: block; background:url('images/faq.gif') no-repeat 6px 0; } .faqBox p { padding: 6px 13px 6px 13px; font-family: Arial; font-size: 13px; color: #000000; } a {color: #939598; text-decoration: none; font-size: 14px;} a:hover {color: #0099cc; text-decoration: underline;}