/* CREDITS * ---------------------------------------------------------- * Title: Ronny Gielen - CSS Main Stylesheet * Author: Jeroen Bijnens * ---------------------------------------------------------- */ /* Algemene Styles ---------------------------------------------------------- */ textarea, body{font-family:Arial, Helvetica, sans-serif; font-size:12px} body{background:url(../images/layout/body_bg.png) #2d2d2f repeat-x left bottom; height:100%;} html, body{margin:0; padding:0;} html{ } /*default elements*/ strong,b{font-weight:bold} em{font-style:italic} a:focus{outline:none} abbr, acronym{border-bottom:1px dotted; cursor:help} .clear{clear:both;} a img{border:0;} /* Container ---------------------------------------------------------- */ div#container{min-height: 100%; height: auto !important; height: 100%; margin:0 auto -186px; width:941px;} /* Header ---------------------------------------------------------- */ div#header{height:190px; position:relative;} div#header div.logo{position:absolute; top:1px; right:356px;} div#header div.header_top{background:url(../images/layout/header/header_top.png) no-repeat top left; height:51px; padding:0 35px 0 35px; position:relative; width:871px;} div#header div.header_top div.header_left{font-size:14px; left:35px; position:absolute; top:20px;} div#header div.header_top div.header_right{background:url(../images/layout/header/telephone.png) no-repeat left -7px; color:#50b948; font-size:14px; padding-left:25px; position:absolute; right:35px; top:20px;} div#header div.header_top div.header_right span{color:#222222;} div#header div.header_bottom{background:url(../images/layout/header/header_bottom.png) no-repeat top left; height:74px;} div#header ul.navigation{height:66px; margin:0; padding:0;} /* navigatie -----------------*/ div#header ul.navigation li{display:inline; float:left;} div#header ul.navigation li a{ display:block; height:66px; text-indent:-9999px;} div#header ul.navigation li.gegoten a{background:url(../images/layout/header/menu.png) no-repeat 0 0; width:120px;} div#header ul.navigation li.vloeren a{background:url(../images/layout/header/menu.png) no-repeat -120px 0; width:125px;} div#header ul.navigation li.onderhoud a{background:url(../images/layout/header/menu.png) no-repeat -245px 0; width:117px;} div#header ul.navigation li.blank a{background:url(../images/layout/header/menu.png) no-repeat -362px 0; width:223px;} div#header ul.navigation li.eco a{background:url(../images/layout/header/menu.png) no-repeat -585px 0; width:115px;} div#header ul.navigation li.aannemers a{background:url(../images/layout/header/menu.png) no-repeat -700px 0; width:134px;} div#header ul.navigation li.contact a{background:url(../images/layout/header/menu.png) no-repeat -834px 0; width:107px;} div#header ul.navigation li.gegoten a:hover, div#header ul.navigation li.gegoten a.active{background:url(../images/layout/header/menu.png) no-repeat 0 -66px; width:120px;} div#header ul.navigation li.vloeren a:hover, div#header ul.navigation li.vloeren a.active{background:url(../images/layout/header/menu.png) no-repeat -120px -66px; width:125px;} div#header ul.navigation li.onderhoud a:hover, div#header ul.navigation li.onderhoud a.active{background:url(../images/layout/header/menu.png) no-repeat -245px -66px; width:117px;} div#header ul.navigation li.blank a:hover, div#header ul.navigation li.blank a.active{background:url(../images/layout/header/menu.png) no-repeat -362px -66px; width:223px;} div#header ul.navigation li.eco a:hover, div#header ul.navigation li.eco a.active{background:url(../images/layout/header/menu.png) no-repeat -585px -66px; width:115px;} div#header ul.navigation li.aannemers a:hover, div#header ul.navigation li.aannemers a.active{background:url(../images/layout/header/menu.png) no-repeat -700px -66px; width:134px;} div#header ul.navigation li.contact a:hover, div#header ul.navigation li.contact a.active{background:url(../images/layout/header/menu.png) no-repeat -834px -66px; width:107px;} /* navigatie -----------------*/ /* Content ---------------------------------------------------------- */ div#content{background:#f1f1f1; border-left:2px solid #fff; border-right:2px solid #fff; border-bottom:2px solid #fff; line-height:18px;} div#content div.content_sides{background:url(../images/layout/content/content_sides.png) repeat-y left top; overflow:hidden;} div#content div.content_top_bg{background:url(../images/layout/content/content_top_bg.png) no-repeat left top; overflow:hidden; padding:30px 32px 40px 32px; position:relative; width:873px;} div#content div.border{background:url(../images/layout/content/border_bg.png) repeat-y top left; overflow:hidden;} div#content div.content{/*border-right:1px solid #afa7a5;*/} /*breadcrumbs*/ div#content div.breadcrumbs{font-size:11px; left:33px; position:absolute; top:15px;} /* slideshowdiv */ div#content div.eyecatcher{background:url(../images/layout/content/eyecatcher_bg.png) no-repeat top left; height:238px; margin:0 auto; overflow:hidden; padding:11px 0; width:870px;} div.eyecatcher div.text{float:left; height:180px; margin:23px; overflow:hidden; width:460px;} div.eyecatcher div.text h2{color:#2c2c2f !important; margin-top:-3px !important; margin-bottom:0px;} div.eyecatcher div.image{float:right; margin:2px; position:relative;width:321px;height:210px} div.eyecatcher div.image img {position: absolute;top:0;left:0} /*slideshow controls */ div.eyecatcher div.image div.controls{bottom:0px; font-size:11px; position:absolute; right:0px;z-index:99} div.eyecatcher div.image div.controls ul li{background:none !important; float:left; list-style:none; list-style-image:none; padding:0 !important;} div.eyecatcher div.image div.controls ul li a{background:url(../images/layout/header/slide_controls.png) no-repeat 0 0; color:#32302d !important; display:block; line-height:23px; height:23px; text-align:center; text-decoration:none !important; width:21px;} div.eyecatcher div.image div.controls ul li a:hover, div.eyecatcher div.image div.controls ul li a.active{background:url(../images/layout/header/slide_controls.png) no-repeat 0 -23px; color:#fff !important;} div.eyecatcher div.image div.controls ul li a.last{width:20px;} /* slideshowdiv */ /* tekstopmaak content */ div#content h1{font-size:20px; margin:20px 0 14px;} div#content h1 span{color:#50b948;} div#content div.content h1{margin-left:-30px;} div#content h2{color:#50b948; font-size:12px; font-style:bold; font-style:italic; margin:20px 0 5px;} div#content h2.cufon{color:#222222;font-size:18px; margin:20px 0 14px;} div#content h2.cufon span{color:#50b948;} div#content h3{font-size:12px; font-style:bold; margin-top:10px; margin-bottom:5px;} div#content a{color:#50b948; text-decoration:underline;} div#content ul{margin:0; padding:6px 0 16px 0;} div#content ul li{background:url(../images/layout/content/list-item.png) no-repeat left 2px; list-style:none; padding-left:35px;} /* tekstopmaak content */ div#content div.content{float:left; padding-right:85px; padding-left:30px; width:511px;} div#content div.content div#map{border:1px solid #AFA7A5; height:200px; margin-top:30px; overflow:hidden; width:300px;} /*sidebar ---------*/ div#content div.sidebar{float:right; text-align:center; width: 244px;} div#content div.sidebar a{color:#ae9f98; line-height:16px; text-decoration:underline;} div#content div.sidebar a:hover{text-decoration:none;} div#content div.sidebar div{margin:0 auto 10px; text-align:center; width:150px;} div#content div.sidebar div a img{display:block; margin:0 auto; } /*sidebar ---------*/ /*inline images*/ div#content a img.left{margin-right:10px; margin-bottom:10px; margin-top:10px; border:1px solid #AFA7A5;} div#content a img.right{margin-left:20px; margin-bottom:10px; margin-top:10px; border:1px solid #AFA7A5;} div#content a img.imagebox{border:3px double #AFA7A5;} /* Content ---------------------------------------------------------- */ form.default{width:620px} /*fieldset*/ form.default fieldset{width:900px; padding:10px; border:1px solid black;} form.default fieldset legend{border:1px solid black;} /*entry*/ form.default div.entry{clear:both; overflow:hidden; margin:0 0 5px; padding:5px} form.default div.entry label{float:left} /*error*/ form.default div.error{background:#FFE6E7; border:1px solid #CC0000} form.default span.error{color:#CC0000; float:right; display:block; line-height:18px; padding:0 0 0 18px; font-size:11px; background:url(../images/layout/icon_error.gif) no-repeat 0 0} /*text*/ form.default div.text label{line-height:18px} form.default div.text input{width:100%} /*textarea*/ form.default div.textarea label{clear:both; line-height:18px; display:block} form.default div.textarea textarea{width:100%} /*radiobutton*/ form.default div.radiobutton label{width:100%; display:block} /*checkbox*/ form.default div.checkbox label{width:100%; display:block} /*select*/ form.default div.select select{clear:both; display:block} form.default div.select label{display:block} /* Footer ---------------------------------------------------------- */ div.push{height:186px;} div#footer{color:#fff; height:186px; line-height:22px; margin:0 auto; width:941px;} div#footer span{color:#50b948;} div#footer a{color:#fff; text-decoration:underline;} div#footer div{height:100px;} div#footer div.contact{background:url(../images/layout/footer/contact_icon.png) no-repeat 14px 10px;; float:left; padding:20px 0 0 85px; width:175px;} div#footer div.offerte{background:url(../images/layout/footer/offerte_icon.png) no-repeat 4px 14px; float:left; padding:20px 0 0 75px; width:204px;} div#footer div.mediasoft{float:right; margin-top:0px;} div#footer div.mediasoft a{}