/* ---------------------------------------------------- * MEUBELEN MARRES - MAIN STYLESHEET * ---------------------------------------------------- * @Author David Candreva * @Inventis www.inventis.be * @Create 20-09-07 * @Changes 28-09-07 David Candreva * ---------------------------------------------------- */ /* ---------------------------------------------------- * General * ---------------------------------------------------- */ body { background-color: #000; font-size: 12px; font-family: Arial, Helvetica, sans-serif; } a { color: #000; text-decoration: none; } a:hover { text-decoration: underline; } img.decoratie { float: right; } h1 { text-transform: uppercase; font-weight: bold; color: #1c1b21; font-size:16px; } h2 { text-transform: uppercase; font-weight: bold; color: #1c1b21; font-size:14px; } strong {font-weight:bold;} /* ---------------------------------------------------- * Alles dat in de siteContainer zit absolute menu's, pagination ... * ---------------------------------------------------- */ .pagination { text-align: center; color: #FFF; font-size: 11px; font-weight: bold; padding-top:63px; width: 141px; height: 80px; position: absolute; top: 429px; left: 858px; background-color: #000000;} .pagination a { text-transform: uppercase; color: #FFF; } .pagination a.vorige { padding-left: 10px; background: url(/design/images/layout/vorige_bullet.gif) no-repeat left center; } .pagination a.volgende { padding-right: 10px; background: url(/design/images/layout/volgende_bullet.gif) no-repeat right center; } .productInfo { color: #FFF; font-size: 11px; position: absolute; right: 0; top: 143px; height: 286px; padding: 0 8px; background-color: #000000; width: 125px; } .productInfo h1 { padding-top: 15px; padding-bottom: 4px; } .productInfo p { font-size: 10px; margin-bottom: 8px; text-align:center;} .productInfo a.vorige { color: #FFF; padding-left: 14px; background: url(/design/images/layout/dubble_bullet.gif) no-repeat left center; } img.secondRowLeft { position: absolute; top: 143px; left: 0; } img.rechtsbottom { position: absolute; right: 0; bottom: 0; } a.marres { position: absolute; left: 143px; top: 286px; } a.marres:hover { text-decoration: none; } /* ---------------------------------------------------- * Containers & Wrappers * ---------------------------------------------------- */ #siteContainer { background: #FFF url(/design/images/layout/siteContainer9_bg.gif) no-repeat center 0; width: 999px; height: 571px; margin: 0 auto; position: relative; } .siteContainer2 { background: #FFF url(/design/images/layout/siteContainer9_bg.gif) no-repeat center 0 !important; } #mainContainer { display:inline; margin-left: 286px; margin-top: 143px; width: 572px; float: left; height: 428px; overflow: hidden; } #siteContainer a.marres{ display:block; width:143px; height:143px; text-indent:-9000px; background:url(/design/images/layout/marres-interieur.gif) no-repeat top left;} #siteContainer a#homeLink { display:block; position:absolute; text-indent:-9000px; top:0px; left:855px; width:143px; height:143px;} #siteContainer a#moviesLink { display:block; position:absolute; text-indent:-9000px; top:0px; left:0; width:143px; height:143px; background:url(/design/images/movies.png) no-repeat top left;} #siteContainer a#wineLink { display:block; position:absolute; text-indent:-9000px; top:286px; left:855px; width:143px; height:143px; z-index:90} /* ---------------------------------------------------- * Content * ---------------------------------------------------- */ #content { float: left; width: 286px; } #content p.justify { text-align: justify; } #content .home { padding: 110px 25px 0 25px; } #content .home h1 { padding-bottom: 20px; } #content .home p { color: #000; font-size: 11px; } span.vorig { display: block; clear: both; margin-top: 15px; } span.vorig a { background: url(/design/images/layout/terug_bullet.gif) no-repeat 0 center; padding-left: 16px; } #content .contact { padding: 0px 0 0 0px; } #content .contact .box{height:143px;} #content .contact .box .box1{height:143px; width:143px; background-color:#88a200/*#936334*/; float:left;} #content .contact .box .box2{height:143px; width:143px; background-color:#97c000/*#b18b45*/; float:left;} #content .contact .content { padding-left: 25px; } #content .contact h1 { text-transform: uppercase; font-size: 12px; width:120px;} #content .contact address { font-size: 11px; font-weight:normal;} #content .contact table { margin-top: 13px; font-size: 11px; } #content .contact table tr { border-bottom: 1px solid #f2f2f2; } #content .contact table tr.top { border-bottom: 0; } #content .contact table tr td { padding: 4px 0; padding-left: 0; } #content .contact table tr td strong { color: #FF0000; } /* ---------------------------------------------------- * Acties * ---------------------------------------------------- */ .acties { width: 100%;} .acties .box { width: 286px; float: left; } .acties .box .info { display: block; clear: both; padding: 5px 0 0 5px; } .acties .box .info h1 { float: left; } .acties .box .info span { float: left; padding-left: 5px; font-weight: bold; } .acties .box a { float: right; margin-right: 8px; font-size: 11px; background: url(/design/images/layout/meer_bullet.gif) no-repeat right center; padding-right: 15px; } /* ---------------------------------------------------- * Nieuws * ---------------------------------------------------- */ .nieuws { width: 100%; } #nieuwsdetail{width:286px; overflow:hidden; float:left;} .nieuws div { position: relative; overflow: hidden;} .nieuws div img { float: left; } .nieuws div .box { color: #e62f2f; padding-left: 25px; text-align: left; padding-top: 67px; height: 69px; float: left; width:261px; } .nieuws div .box h2 { text-transform: uppercase; font-weight: bold; } .nieuws div .box a.leesmeer { font-size: 11px; position: absolute; bottom: 8px; right: 10px; background: url(/design/images/layout/leesmeer_bullet.gif) no-repeat right 5px; padding-right: 16px; } .nieuws .tekst { clear: both; padding: 25px; font-size: 11px; line-height: 17px; } .nieuws .tekst span.vorig { display: block; clear: both; margin-top: 15px; } .nieuws .tekst span.vorig a { background: url(/design/images/layout/terug_bullet.gif) no-repeat 0 center; padding-left: 16px; } .assortiment { width: 100%; overflow: hidden; } .assortiment a { float: left; } /* ---------------------------------------------------- * advies * ---------------------------------------------------- */ .advies { width: 100%; } .advies div.item { overflow: hidden; clear:both;} .advies div.item img { float: left; width:286px;} .advies div.item .box { color: #e62f2f; text-align: left; height: 143px; float: left; width:286px; overflow:hidden; position:relative} .advies div.item .box h2 { clear:both; text-transform: uppercase; font-weight: bold; margin-top:65px;} .advies div.item .box a.leesmeer { font-size: 11px; position: absolute; bottom: 8px; right: 10px; background: url(/design/images/layout/leesmeer_bullet.gif) no-repeat right 5px; padding-right: 16px; } .advies .tekst { clear: both; padding: 25px; font-size: 11px; line-height: 17px; } .advies .tekst span.vorig { display: block; clear: both; margin-top: 15px; } .advies .tekst span.vorig a { background: url(/design/images/layout/terug_bullet.gif) no-repeat 0 center; padding-left: 16px; } /* ---------------------------------------------------- * Outlet * ---------------------------------------------------- */ .outlet { width: 100%; overflow: hidden; height:428px; } .outlet .top { height: 286px; overflow: hidden; } .outlet .top img { float: left; } .outlet .discription { padding: 9px; width: 268px; float: left; } .outlet .discription h1 { loat: left; color: #e62f2f; text-transform: uppercase; font-weight: bold; margin-bottom: 15px; } .outlet .discription span { font-weight: bold; float: right; } .outlet .discription p { clear: both; font-size: 11px; line-height: 15px; } .outlet .bottom { width: 100%; } .outlet .bottom a {display:block; float:left; width:143px; height:143px; position:relative; z-index:5;} img.verkocht {position:absolute; right:35px; bottom:35px; margin:35px 0 0 -110px; z-index:999;} /* ---------------------------------------------------- * Actiedetail * ---------------------------------------------------- */ .actiedetail { width: 100%; } .actiedetail .top { height: 286px; overflow: hidden; } .actiedetail .top img { float: left; } .actiedetail .discription { padding: 9px; width: 268px; float: left; } .actiedetail .discription h1 { float: left; margin-bottom: 15px; width:286px; } .actiedetail .discription span.prijs { font-weight: bold; float: right; } .actiedetail .discription p { clear: both; font-size: 11px; line-height: 15px; } .actiedetail .discription span a { font-size: 11px; background: url(/design/images/layout/terug_bullet.gif) no-repeat left center; padding-left: 15px; } .fotoPrijs { background-color:#ffffff; float:right; padding:5px; margin-right:10px; position:relative; z-index:999; top:-30px; text-align:right; font-weight:bold; font-size:14px; color:#1a1a1a;} /* ---------------------------------------------------- * Tips * ---------------------------------------------------- */ .tips { width: 100%; } .tips div { position: relative; width: 100%; overflow: hidden; } .tips div img { float: left; } .tips div .box { padding: 10px 19px 0 15px; width: 252px; height:132px; float: left; } .tips div .box p { padding-top: 4px; font-size: 11px; } .tips div .box h2 { color: #e62f2f; } /* ---------------------------------------------------- * Realisaties * ---------------------------------------------------- */ .realisaties { width: 100%; } .realisaties div { position: relative; width: 100%; overflow: hidden; } .realisaties div img { float: left; } .realisaties div .box { padding: 10px 19px 0 15px; width: 252px; height:132px; float: left; } .realisaties div .box p { padding-top: 4px; font-size: 11px; } .realisaties div .box h2 { color: #e62f2f; } /* ---------------------------------------------------- * Grid * ---------------------------------------------------- */ .grid { background: url(/design/images/layout/gradient.gif) no-repeat 0 0; width: 100%; height: 428px; } .grid a { display: block; width: 143px; height: 20px; float: left; line-height: 16px; padding-top:123px; text-align: center; font-size: 11px; text-transform: uppercase; font-weight: bold; text-decoration:none;} .assortiment_grid a {text-indent:-9000px;} .assortiment_grid a:hover { text-indent:0;} .grid a.zitten { background: url(/design/images/layout/assortiment/zitten.png) no-repeat center;} .grid a.tafelen { background: url(/design/images/layout/assortiment/tafelen.png) no-repeat center;} .grid a.wandsystemen { background: url(/design/images/layout/assortiment/wandsystemen.png) no-repeat center;} .grid a.karpetten { background: url(/design/images/layout/assortiment/karpetten.png) no-repeat center;} .grid a.bijzetmeubelen { background: url(/design/images/layout/assortiment/bijzetmeubelen.png) no-repeat center;} .grid a.kantoor { background: url(/design/images/layout/assortiment/kantoor.png) no-repeat center;} .grid a.decoratiekunst { background: url(/design/images/layout/assortiment/decoratiekunst.png) no-repeat center;} .grid a.dressings { background: url(/design/images/layout/assortiment/dressings.png) no-repeat center;} .grid a.slapen { background: url(/design/images/layout/assortiment/slapen.png) no-repeat center;} .grid a.merken { background: url(/design/images/layout/assortiment/merken.png) no-repeat center;} .grid a.verlichting { background: url(/design/images/layout/assortiment/verlichting.png) no-repeat center;} .grid a.outdoor { background: url(/design/images/layout/assortiment/outdoor.png) no-repeat center;} /* ---------------------------------------------------- * Grid2 * ---------------------------------------------------- */ .grid2 { background: url(/design/images/layout/gradient.gif) no-repeat 0 0; width: 100%; height: 428px; } .grid2 a { display: block; width: 143px; height: 143px; float: left; line-height: 16px; text-align: center; font-size: 13px; text-transform: uppercase; font-weight: bold; } .grid2 a.text{height: 88px; padding-top: 55px;} /* ---------------------------------------------------- * ContactForm * ---------------------------------------------------- */ .right, .left { width: 286px; float: left; overflow:hidden;} .right a{float:left; text-decoration:none; background:none;} form.contactForm { overflow: hidden; margin: 0 auto; width: 233px; clear: both; padding-top: 15px; float:right; padding-right:15px;} form.contactForm .entry { overflow: hidden; width: 100%; clear: both; background-color: #F2F2F2; margin-bottom: 5px; font-size: 11px; padding: 4px; } form.contactForm .error { overflow: hidden; border: 1px solid #f6a4a4; color:#FF0000;} form.contactForm .error .errorMsg {margin-left:80px; color:#e83a3a; font-size:10px;} form.contactForm .entry label { width: 60px; display: block; float: left; } form.contactForm .entry input, form.contactForm .entry textarea, form.contactForm .entry select { width: 163px; float: left; font-size: 11px; background-color: #F2F2F2; border: 0; } form.contactForm .entry textarea#boodschap { clear: both; width: 100%; height: 70px; } form.contactForm .entrySubmit input { float: right; } /* ---------------------------------------------------- * Product * ---------------------------------------------------- */ .product { width: 100%; } .product img { float: left; } .product img.big { float: right; } /* ---------------------------------------------------- * Navigatie * ---------------------------------------------------- */ #nav { width: 1024px; margin: 32px auto; } #nav a.active{background-color:#d10000;} #nav a:hover{background-color:#d10000; text-decoration:none;} #nav ul { width: 100%; text-align: center; } #nav ul li { display: inline; padding: 0 30px; background: transparent url(/design/images/layout/nav_bullet.gif) no-repeat right center; } #nav ul li ul { margin-top: 16px; float: left; display: block; text-align: left; } #nav ul li ul li { background: transparent url(/design/images/layout/navsub-stripe_bullet.gif) no-repeat right center; padding: 0 22px 0 15px; } #nav ul li ul li a { font-size: 11px; } #nav ul li ul li.subNav1 { margin-left: 70px; padding: 0 3px; background: url(/design/images/layout/navsub_bullet.gif) no-repeat left center; } #nav ul li ul li ul li { font-size: 10px; background: transparent url(/design/images/layout/navsub-stripe_bullet.gif) no-repeat right center; padding: 0 22px 0 15px; } #nav ul li ul li ul li a { font-size: 10px; } #nav ul li ul li ul li.subNav2 { margin-left: 115px; padding: 0 3px; padding-left:15px; background: url(/design/images/layout/navsub_bullet.gif) no-repeat left center; } #nav ul li.first { padding-left: 30px; } #nav ul li a { font-weight: bold; font-family: "Trebuchet MS", Helvetica, sans-serif; color: #FFF; text-transform: uppercase; font-size: 11px; } #nav ul li.last { background:none; } #overlay {width:100%; padding:0; margin:0; height:100%; top:0; left:0; background:#333; position:absolute; z-index:9; opacity:0.8;filter:alpha(opacity=80)} #beaudor {width:890px; height:660px; position:absolute; left:50%; top:50%; margin:-340px 0 0 -445px; z-index:10;} #beaudor a.goto {float:right; color:#fff; font-size:16px; padding:10px 0; font-weight:bold; text-decoration:none;} #beaudor a.goto:hover {color:#D49F01;}