/**
 * @section   : Layout CSS
 * @project   : Walraven en zonen
 * @author    : Boye Oomens <boye@e-sites.nl>
 * @media     : all
 * @version   : 1.0
 */

 /* Algemene container en header */
#wrapper {width:995px; position:relative; margin:0 auto 0; font-size:120%; overflow:hidden; background:#fff;}

#header {width:995px; height:112px; position:relative; margin:0 auto; background:#fa6c15; z-index:998;}
#header h1 {margin:0; position:absolute; left:20px; top:20px; z-index:1;}
#header h1 a {width:226px; height:75px; display:block; color:#fff; overflow:hidden; background:url(/images/logos/walraven.gif) no-repeat top left; text-decoration:none; position:relative; z-index:1000;}
#header h1 span {visibility:hidden;}

/* Kruimelpad in de topheader */
.crumbTrail {margin:0; position:absolute; top:80px; right:20px; font-size:90%; z-index:1;}
.crumbTrail li {display:inline; list-style:none; color:#fff;}
.crumbTrail a {text-decoration:none; color:#fff; font-weight:normal; text-decoration:underline;}
.crumbTrail a:hover,
.crumbTrail a.active {color:#fff; text-decoration:none;}

/* Hoofdnavigatie */
#nav {margin:0; list-style:none; padding:0; z-index:2; font-size:120%; position:absolute; left:175px; top:16px;}
#nav li {display:block; float:left; position:relative; margin:0; padding:0; z-index:2;}
#nav li:hover ol {display:block;}
#nav li:hover ol ol {display:none;}
#nav li a {display:inline-block; color:#fff; background:#fa6c15; text-decoration:none; font-weight:bold; position:relative; z-index:3; padding:5px 10px;}
#nav li:hover a,
#nav li a:hover {color:#fa6c15; background:#fff;}
#nav li:hover ol li a {color:#666;}
#nav .hasSubs:hover {text-decoration:none; padding:0;}
#nav .hasSubs:hover a {border-bottom:1px solid #fff;}
#nav .hasSubs:hover ol a {border-bottom:none;}
#nav li ol {display:none; width:198px; border:1px solid #fa6c15; font-size:85%; position:absolute; top:30px; left:-1px; margin:0; padding:5px 0 5px 0; z-index:2; background:#fff;}
#nav li ol li {width:198px; float:none; padding:0;}
#nav li ol li:hover ol {display:block;}
#nav li ol li ol {display:none; width:198px; border:1px solid #fa6c15; font-size:100%; position:absolute; top:0; left:198px; margin:0; padding:5px 0 5px 0; z-index:5; background:#fff;}
#nav li ol li a {width:188px; padding:2px 5px; text-transform:none; color:#666; font-weight:normal;}
#nav li ol li a:hover {width:165px; background:url(/images/icons/orangeArrowRight.gif) no-repeat 4px 11px; padding-left:15px; font-weight:bold;}

/* Algemene content divisie */
.content {width:995px; overflow:hidden; position:relative; z-index:1;}
.hasBg {background:url(/images/backgrounds/sidebar.png) repeat-y top right; border-bottom:1px solid #ccc;}
.content h2.title {color:#fa6c15; font-size:175%;}
.content h4,
.content h5,
.content h6 {font-size:12px;}
.homepageSection {width:354px; height:227px; position:absolute; right:0; top:0; padding:20px; overflow:hidden;}
.homepageSection p {color:#fff;}
.context {width:582px; float:left; position:relative; padding:0 10px 10px 10px; overflow:hidden;}
.context .mainImg {margin:0 0 10px -10px;}
.sidebar {width:363px; float:left; padding:10px 15px; overflow:hidden;}
.sidebar h3 {font-size:18px; color:#fa6c15; margin-top:5px;}

/* Contentblokken op de homepage */
.contentBlocks {width:995px; height:91px; padding:0; overflow:hidden; border-bottom:1px solid #ccc; margin:0;}
.contentBlocks li {width:280px; height:101px; border-right:1px solid #ccc; margin:0; padding:5px 10px; overflow:hidden; display:block; float:left; position:relative;}
.contentBlocks .last {width:373px; margin-right:0; background:#e5e5e5; border-right:none;}
.contentBlocks li h4 {color:#666; font-size:14px;}
.contentBlocks li img {width:100px; height:54px; float:left; margin:2px 8px 0 0; border:1px solid #fa6c15;}
.contentBlocks li h5 {padding:5px 0 0 0; margin:0; font-size:16px; line-height:100%;}
.contentBlocks li h5 a {color:#fa6c15; text-decoration:none;}
.contentBlocks li h5 a:hover {color:#666;}
.contentBlocks li p {color:#666; padding:3px 0 5px 0; margin:0; font-size:100%;}
.contentBlocks li p a {font-weight:normal; color:#666;}
.contentBlocks li p a:hover {text-decoration:none;}

/* Verticale contentblokkken */
.vertical {width:363px; height:auto; border-bottom:none; margin:0; padding:0;}
.vertical li {width:363px; height:70px; border-bottom:1px solid #ccc; border-right:none; padding:0 0 0 0; margin:10px 0 0 0;}
.vertical li.last {border-bottom:none;}
.vertical li h4 {padding:0 0 0 0; margin:0; font-size:12px; line-height:100%;}
.vertical li h4 a {color:#fa6c15; text-decoration:none;}
.vertical li h4 a:hover {color:#666;}
.vertical li p {line-height:120%;}

/* Acties/Producten/Nieuws lijstweergave */
.listView {margin:10px 0 0 0; padding:0; list-style:none;}
.listView li {margin:0 0 10px 0; padding:0; height:94px; display:block; clear:left; overflow:hidden;}
.listView li h4 {margin:0; padding:0; font-size:12px;}
.listView li h4 a {text-decoration:none; color:#fa6c15;}
.listView li h4 a:hover {color:#666;}
.listView li .nieuwsImg {width:90px; overflow:hidden; float:left; margin:0 8px 0 0; border:1px solid #000; padding:0;}
.listView li a {text-decoration:underline;}
.listView li a:hover {text-decoration:none;}

/* Footer */
#footer {width:995px; margin:0; color:#ccc; clear:both; position:relative;}
#footer .quickNav {border-bottom:1px solid #ccc; padding:7px 0 7px 10px; margin:0; list-style:none;}
#footer .quickNav li {display:inline; padding:0 15px 0 0;}
#footer .quickNav a {text-decoration:underline; color:#ccc;}
#footer .quickNav a:hover {text-decoration:none;}
#footer .noWeight a {font-weight:normal;}
#footer address {width:995px; overflow:hidden; border-bottom:1px solid #ccc; padding:7px 0 7px 10px; display:block; float:left;}
#footer address span {display:block; float:left; margin:0 15px 0 0;}
#footer address a {color:#ccc; text-decoration:underline; font-weight:normal}
#footer address a:hover {text-decoration:none;}
#footer .copyright {display:block; padding:7px 0 7px 10px; clear:left;}

/* Misc logos */
#solar {position:relative; float:right;}
#bsp {position:absolute; bottom:0;}
#webshop {width:141px; display:block; margin:10px 0 0 0;}
#klantenBeoordeling {float:right; margin:0 10px;}