/* File: print.css Created by: Cinnamon Interactive BV Date: September 2005 */ /* COLORS ---------------------------------------------------------------------------------------------- */ /* #616161 DARK BLUE #FFF BACKGROUND #B8B8B8 ZILVER #000 MOSTERD #616161 DARK GRAY */ /* GENERAL STYLES ---------------------------------------------------------------------------------------------- */ html, body { background-color: #FFF; margin: 0; padding: 0; } body { background: #FFF font: 95%/140% "Verdana", "Helvetica", "Arial", sans-serif; } * html body { font: 90%/130% "Verdana", "Helvetica", "Arial", sans-serif; } /* a hack for IE Win only \*/ * html div ul {margin: 0; padding: 0; text-indent: 0;} /*end of hack */ address { margin: 0.5em 0; padding: 0; } address span { margin: 0; padding: 0; display: block; color: #616161; background-color: transparent; } .clear { clear: both; } dl { color: #616161; font: 80%/140% "Verdana", "Helvetica", "Arial", sans-serif; } dt { font-weight: bold; margin-top: 15px; } dd { text-indent: 0; margin: 4px 0 0 0; } h1 { background-color: transparent; margin: 0 0 0.8em 0; font: normal 150%/100% "Gill Sans Light", "Helvetica", sans-serif; color: #B2B1C9; background-color: transparent;} h2 { font: 86%/120% "Verdana", "Helvetica", sans-serif; margin: 0; padding: 0; background-color: transparent; font-weight: 600; } h3 { font: bold 86%/120% "Verdana", "Helvetica", sans-serif; margin: 2em 0 0 0; background-color: transparent; } p, li, a, label, address span { font: 85%/133% "Verdana", "Helvetica", sans-serif; background-color: transparent; } p { color: #616161; background-color: transparent;} .home #intro p { color: #616161; } #intro-tekst { color: #616161; } li { list-style: none; margin: 0; padding: 0; text-indent: 0; } li a { font: bold 100%/125% "Verdana", "Helvetica", sans-serif; text-transform: none; background-color: transparent; } img { text-align:left; text-transform: none; font: 70%/133% bold "Lucida Grande", "Helvetica", "Arial", sans-serif; color: #616161; border: 0; background-color: transparent; } .bericht-holder * {padding: 0; margin: 0;} /* MAIN BLOCKS START HERE ---------------------------------------------------------------------------------------------- */ #logo #printlogo { display: block; width: 127mm; height: 60mm; } #logo span { display: none; } /* SPACER BETWEEN LEFT & RIGHT ---------------------------------------------------------------------------------------------- */ #spacer { float: left; width: 15px; height: 300px; } /* MAIN NAVIGATION ---------------------------------------------------------------------------------------------- */ #skip-nav { display: none; } #navigation { display: none; } #navigation li span { display: none; } #navigation ul { margin: 0; padding: 0; text-indent: 0; } #navigation li { padding: 0; text-indent: 0; list-style: none; } #navigation li a { height: 20px; width: 138px; display: block; } /* home */ #navigation li#nav-home/* hide ie5 */{ background: url("/img/navigatie/home-on.gif") no-repeat; padding-bottom: 1px;} #navigation li#nav-home a { background: url("/img/navigatie/home.gif") no-repeat; padding-bottom: 1px;} #navigation li#nav-home.current a, #navigation li#nav-home a:hover { background: url("/img/navigatie/home-on.gif") no-repeat; padding-bottom: 1px;} /* nieuws */ #navigation li#nav-nieuws/* hide ie5 */{ background: url("/img/navigatie/nieuws-on.gif") no-repeat; } #navigation li#nav-nieuws a { background: url("/img/navigatie/nieuws.gif") no-repeat; } #navigation li#nav-nieuws.current a, #navigation li#nav-nieuws a:hover { background: url("/img/navigatie/nieuws-on.gif") no-repeat; } /* collectie */ #navigation li#nav-collectie/* hide ie5 */{ background: url("/img/navigatie/collectie-on.gif") no-repeat; } #navigation li#nav-collectie a { background: url("/img/navigatie/collectie.gif") no-repeat; } #navigation li#nav-collectie.current a, #navigation li#nav-collectie a:hover { background: url("/img/navigatie/collectie-on.gif") no-repeat; } /* contact */ #navigation li#nav-contact/* hide ie5 */{ background: url("/img/navigatie/contact-on.gif") no-repeat; } #navigation li#nav-contact a { background: url("/img/navigatie/contact.gif") no-repeat; } #navigation li#nav-contact.current a, #navigation li#nav-contact a:hover { background: url("/img/navigatie/contact-on.gif") no-repeat; } /* gastenboek */ #navigation li#nav-gastenboek/* hide ie5 */{ background: url("/img/navigatie/gastenboek-on.gif") no-repeat; } #navigation li#nav-gastenboek a { background: url("/img/navigatie/gastenboek.gif") no-repeat; } #navigation li#nav-gastenboek.current a, #navigation li#nav-gastenboek a:hover { background: url("/img/navigatie/gastenboek-on.gif") no-repeat; } /* wiebenik */ #navigation li#nav-wiebenik/* hide ie5 */{ background: url("/img/navigatie/wie_ben_ik-on.gif") no-repeat; } #navigation li#nav-wiebenik a { background: url("/img/navigatie/wie_ben_ik.gif") no-repeat; } #navigation li#nav-wiebenik.current a, #navigation li#nav-wiebenik a:hover { background: url("/img/navigatie/wie_ben_ik-on.gif") no-repeat; } /* verkoop */ #navigation li#nav-verkoop/* hide ie5 */{ background: url("/img/navigatie/verkoop-on.gif") no-repeat; } #navigation li#nav-verkoop a { background: url("/img/navigatie/verkoop.gif") no-repeat; } #navigation li#nav-verkoop.current a, #navigation li#nav-verkoop a:hover { background: url("/img/navigatie/verkoop-on.gif") no-repeat; } /* OUTER WRAP ---------------------------------------------------------------------------------------------- */ #wrap { width: 780px; margin: 0 auto 0 auto; padding: 0; } #intro { margin-left: 345px; width: 384px; } *html #intro { margin-left: 375px; } /* #nieuws #intro { margin-left: 330px; margin-top: -2.5em; width: 384px; border: 1px solid blue; } */ /* 404 ---------------------------------------------------------------------------------------------- */ #fourofour { margin-left: 346px; width: 384px; } #fourofour li { background: transparent url("/img/bericht-bullet.gif") 0px 3px no-repeat; display: block; padding: 5px 5px 5px 18px; color: #616161; border-bottom: #5F617E 0px solid; text-decoration : none; margin: 0 0 0 -18px; list-style: none; } #fourofour a { padding: 5px 5px 5px 18px; color: #616161; border-bottom: #5F617E 0px solid; text-decoration : none; margin: 0 0 0 -18px; list-style: none; } #fourofour a:hover { padding: 5px 5px 5px 18px; color: #c49246; border-bottom: #5F617E 0px solid; text-decoration : none; margin: 0 0 0 -18px; list-style: none; } /* COLUMN LEFT ---------------------------------------------------------------------------------------------- */ #content-left { width: 285px; float: left; margin: 25px 0 0 25px; padding: 74px 10px 0 10px; min-height: 100px; } #content-left a { text-transform: none; text-decoration: none; background-color: transparent; padding: 0; color: #616161; } #content-left.current a { text-transform: none; text-decoration: none; background-color: transparent; padding: 0; color: #616161; } #content-left a:hover { text-transform: none; text-decoration: none; background-color: transparent; padding: 0; color: #616161; } #content-left ul { padding: 0 0 5px 0; text-indent: 0; width: 250px; } #content-left li { margin-left: 20px; margin-top: 0.5em; background: transparent url("/img/bericht-bullet.gif") 0px 3px no-repeat; padding-left: 20px; } #content-left #zoeken { margin-left: 55px; } #content-left #formulier { margin-left: 25px; } #content-left address span {padding-left: 55px; } #content-left a {color: #616161; background-color: transparent; text-decoration: none; border-bottom: 1px solid #5D5F7C; } #content-left a:hover {color: #616161; background-color: transparent; text-decoration: none; border-bottom: 1px solid #5D5F7C; } /* COLLECTIE ------------------------------------- */ .collectie #content-left { background: transparent url("/img/collectie-col-bg.jpg") left top no-repeat; min-height: 297px; margin-top: 180px; } * html .collectie #content-left { height: 310px; margin-top: 157px; } .collectie #content-left a { text-transform: none; text-decoration: none; background-color: transparent; padding: 0; color: #616161; } .collectie #content-left li.current a { text-transform: none; text-decoration: none; background-color: transparent; padding: 0; color: #616161; } .collectie #content-left a:hover { text-transform: none; text-decoration: none; background-color: transparent; padding: 0; color: #616161; } /* GASTENBOEK ------------------------------------- */ #gastenboek #content-left { background: transparent url("/img/gastenboek-col-bg.jpg") left top no-repeat; margin-top: 223px; } /* CONTACT ------------------------------------- */ .contact #content-left { background: transparent url("/img/contact-col-bg.jpg") left top no-repeat; margin-top: 150px; height: 150px; } .email a { font-size: 100%; } /* WIE BEN IK ------------------------------------- */ .wiebenik #content-left { background: transparent; margin-top: 235px; } /* VERKOOP ------------------------------------- */ .verkoop #content-left { background: transparent; margin-top: 235px; } /* VOORWAARDEN ------------------------------------- */ .voorwaarden #content-left { background: transparent; margin-top: 235px; } /* HOME ------------------------------------- */ .home #content-left { background: transparent url("/img/nieuws-col-bg.jpg") left top no-repeat; } .home #content-left li.mededeling { background: none; margin-top: 4px; margin-bottom: 15px; color: #474747; } /* NIEUWS ------------------------------------- */ #nieuws #content-left { margin-top: 200px; background: transparent url("/img/nieuws-col-bg.jpg") left top no-repeat; height: 230px; } #nieuws span { display: none; } #nieuws #content-left li { margin: 0.5em 0 0 20px; text-indent: 0; list-style: none; } /* publicatie date newsbericht */ .nieuwsbericht .published { font-size: 80%; color: #616161; } /* nieuws overzicht */ li.samenvatting p { padding-left: 20px; } /* intro news item */ /*.nieuwsbericht .samenvatting { background-color: transparent; color: #616161; font-size: 90%; }*/ /* float img */ .float-img img { float: left; width: 200px; margin-right: 15px; margin-bottom: 0; margin-top: 20px; } .float-img img { padding: 3px; border: 1px solid #ddd; } /* body news items */ .nieuwsbericht p { background: none; color: #616161; padding: 5px 0 5px 20px; } /* PHOTO MEERDETAIL.PHP ---------------------------------------------------------------------------------------------- */ #content-photo { background: transparent; margin-top: 22px; margin-left: 300px; float: left; padding: 0; } #content-photo a {font-size: 100%; color: #616161; background-color: transparent; text-decoration: none; border-bottom: 1px solid #5D5F7C; } #content-photo img { padding: 10px; } #content-photo p { margin: 0 0 10px 10px; padding: 0; } /* COLUMN RIGHT ---------------------------------------------------------------------------------------------- */ #content-right { background: transparent; width: 385px; margin-top: 22px; float: left; padding: 0; } #content-right h2 { text-align: center; text-transform: uppercase; color: #c49246; padding: 15px 0 0 0; } #content-right h3 { text-align:left; text-transform: none; color: #616161; padding: 15px 0 0 0; } #content-right ul { padding: 0; margin: 0; width: 230px; } #content-right li { font-size: 75%; } #nieuws #content-right ul { padding: 0; margin: 0; margin-top: 12px; width: 280px; } #nieuws #content-right li { font-size: 100%; } #nieuws #content-right h2 { text-align: left; text-transform: uppercase; color: #c49246; padding: 5px 0 0 0; } #content-right * li.product-naam { font-weight: bold; text-align:left; text-transform: none; color: #616161; border-bottom: 1px solid #B8B8B8; padding: 0.5em 0 0 0; margin-bottom: 0.75em;} #content-right a {color: #616161; background-color: transparent; text-decoration: none; border-bottom: 1px solid #5D5F7C; } #content-right a:hover {color: #616161; background-color: transparent; text-decoration: none; border-bottom: 1px solid #5D5F7C; } #content-right ul li.bericht { background: transparent url("/img/bericht-bullet.gif") 0px 3px no-repeat; padding-left: 20px; } /* archief */ #content-right ul li.summary { background: transparent url("/img/bericht-bullet.gif") 0px 7px no-repeat; padding-left: 20px; margin: 12px 0 0 0; line-height: 100%; } #content-right ul li.summary a { font: bold 80%/90% "Verdana", "Helvetica", sans-serif; } #content-right ol li { padding: 0; margin: 0; width: 385px; } /* PRODUCT INFO ---------------------------------------------------------------------------------------------- */ /* container */ #nieuwe-collectie { background: #fff/* url("/img/catalogue-boven0.gif") 0px 0px no-repeat*/; width: 385px; } /* border zijkanten */ .border { border-left: 0px solid #B8B8B8; border-right: 0px solid #B8B8B8; padding-top: 30px; padding-left: 15px; } /* elk object container */ .product-houder { background: #FFF; /*url("/img/catalogue-fullbody1.gif") 0px 0px no-repeat;*/ height: 119px; padding: 0; margin: 10px 0 0 0; } /* what's this? */ .product-object { background: #FFF; /*url("/img/catalogue-body.gif") repeat-y; margin: 0 0 -5px 0; padding: 0;*/ } .holder p { padding: 0 5px; } /* bottom background */ #product-footer { background: #FFF; /*url("/img/catalogue-onder0.gif") 0px 3px no-repeat;*/ height: 19px; margin: -3px 0; padding: 0px; } .product img { margin: 8px 13px 10px 14px; float: left; } /* specifications product list ------------------------------------- */ .product ul { float: left; margin: 0; padding: 0; } .product li { list-style: none; color: #616161; margin: 0 0 0 25px; } /* bold li in specs list */ .product-naam { color: #616161; margin: 0; padding: 0; } .product * em { font-style: normal; color: #616161; } .meer { border-bottom: 1px solid #b8b8b8; float: right; margin-top: -20px; margin-left: 10px; clear: both; } * html .meer { margin-top: -22px; } .meer span { padding: 2px 0 3px 6px; width: 80px; height: 14px; background: #b8b8b8; float: right; } #content-right .product-houder a.info, #nieuwe-collectie .product-houder a.info { color: #fff; background-color: transparent; text-decoration: none; margin: 10px 10px 0 0; padding: 0; font-size: 80%; border: none; } /* COLLECTIE; FULL PRODUCT INFO ---------------------------------------------------------------------------------------------- */ .product-img { margin: 15px 0 0 25px; width: 130px; } .product * em { font-style: normal; color: #616161; } .product-list ul { padding: 0 0 0 16px; margin: 5px 0 0 0; float: left; width: 175px; } .product-list li { list-style: none; color: #616161; padding: 5px 0; margin: -8px 0 0 25px; } .object-beeld { background: url("/img/product-bg-med.jpg") no-repeat; height: 174px; width: 194px; float: left; margin-left: 10px; padding-bottom: 0.25em; } .object-beeld img { padding: 5px; margin: -5px; } h3.object-naam { width: 360px; font-weight: bold; text-align:left; text-transform: none; color: #616161; border-bottom: 1px solid #B8B8B8; padding: 0; margin-bottom: 0.15em; margin-left: 10px;} .object .thm-holder1 { background: url("/img/fullproduct-w.gif") no-repeat; height: 170px; width: 170px; float: left; padding: 0; margin-left: 10px; } .object .thm-holder2 { background: url("/img/fullproduct-w.gif") no-repeat; height: 170px; width: 170px; float: left; padding:0; margin-right: 10px; } .object .thm-holder1 img { margin: 15px 25px; } .object .thm-holder2 img { margin: 15px 25px; } .object-naam { color: #616161; display: block; margin: -5px 0 0 0; padding: 0; text-align: left; } /*.object .product img { margin: 15px 0 0 8px; width: 130px; }*/ .object .product-list { width: 170px;} .object .product-list, .object object-beeld, holder {display: inline; } .object .product-list {display: inline; width: 170px; margin-left: -100px;} .object ul {border: 1px solid blue; } .object li {width: 160px; } /* FOOTER ---------------------------------------------------------------------------------------------- */ #footer { background-color: transparent; width: 445px; margin-right: auto; margin-left: auto; margin-top: 0; padding: 0; } #footer * { font-size: 90%; } #footer ul { border-top: 1px solid #b8b8b8; background-color: transparent; } #footer li { list-style: none; display: inline; text-indent: 0; text-align: center; background-color: transparent; color: #b8b8b8; padding: 0; margin: 0; } #footer a { background-color: transparent; color: #b8b8b8; text-transform: none; padding: 0; display: inline; text-decoration: none; } #voorw #footer { margin-top: 5em; } .contact #footer { margin-top: 8em;} .wiebenik #footer { margin-top: 6em;} #voorw #footer { margin-top: 15em;} .verkoop #footer { margin-top: 6em;} /* VOORWAARDEN LIJST STYLE ---------------------------------------------------------------------------------------------- */ .voorwaarden li { background: transparent; padding: 5px 5px 5px 18px; color: #616161; margin: 0; text-decoration : none; list-style: none; } .verkoop #content-right ul { padding: 0; margin: 0; margin-top: 12px; width: auto; } .verkoop #content-right li { margin: 12px 0 0 0; background: url("/img/bericht-bullet.gif") 0px 3px no-repeat; padding-left: 20px; font: 85%/140% "Verdana", "Helvetica", "Arial", sans-serif; color: #616161; } /* FORMS (mozilla only) ---------------------------------------------------------------------------------------------- */ input { display: block; padding: 0.25em 0; margin: 0; } input:focus, select:focus, textarea:focus { background: #EAE6C3; color:#000; } label { display: block; text-align:left; text-transform: none; color: #616161; padding: 15px 0 0 0; } .secret { display: none; } #content-right .bericht-holder { display: block; border-top: 1px solid #b8b8b8; border-bottom: 0px solid #b8b8b8; background-color: #f4f4f4; padding: 0; margin: 0.5em 0; } #content-right .bericht-holder h2 { display: block; text-align:left; text-transform: none; color: #616161; padding: 0.5em 0;} #content-right .bericht-holder p { text-align: left; color: #616161; padding: 0; } /* PRIVACY, WIE BEN IK?, VERKOOP AND VOORWAARDEN PAGES ---------------------------------------------------------------------------------------------- */ .voorwaarden#content-right ol {font-size: 75%; color: black; background-color: transparent;} .error { border: 1px solid red; } /* GROTE FOTO (MEERDETAILS.PHP) ---------------------------------------------------------------------------------------------- */ .foto { margin: 1em 0; line-height: 160%; color: #222; background: #FFF; border: 1px solid #B8B8B8; } .b1, .b2, .b3, .b4 { position: relative; } .b1 { background: url("/img/top-left.gif") top left no-repeat; top: -1px; left: -1px; } .b2 { background: url("/img/top-right.gif") top right no-repeat; right: -2px; } .b3 { background: url("/img/bottom-right.gif") bottom right no-repeat; bottom: -2px; } .b4 { background: url("/img/bottom-left.gif") bottom left no-repeat; left: -2px; padding: 15px 15px 10px 12px; } #content-photo a#noul { border-bottom : 0; }