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

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

#sidebar {width:214px; float:left; height:auto;}
#sidebar h1 {margin:0 0 5px 0;}
#sidebar h1 a {width:204px; height:120px; display:block; color:#002b4a; overflow:hidden; background:url(/images/logos/koller.png) no-repeat top left; text-decoration:none; position:relative; z-index:1000;}
#sidebar h1 span {visibility:hidden;}

/* Kruimelpad in de topheader */
.crumbTrail {width:980px; padding:2px 0 0 15px; margin:0; background:#002b4a; height:18px; font-size:80%; color:#627b8e;}
.crumbTrail li {display:inline; list-style:none;}
.crumbTrail a {text-decoration:none; color:#627b8e; font-weight:normal; text-decoration:underline;}
.crumbTrail a:hover,
.crumbTrail a.active {color:#fff; text-decoration:none;}

/* Hoofdnavigatie */
.nav {width:204px; padding:0; margin:0; list-style:none; font-size:90%; text-transform:uppercase;}
.nav li {width:204px; display:block; margin:0; padding:0; position:relative; z-index:99; float:left;}
.nav li.start {font-weight:bold; color:#00457a; padding:6px 5px; width:152px; background:url(/images/icons/greyArrow.png) no-repeat 70px 12px;}
.nav li a {width:174px; display:block; text-decoration:none; text-transform:uppercase; color:#999; padding:6px 15px; z-index:99; border-top:1px solid #ddd;}
.nav li:hover a,
.nav li a.active,
.nav li a:hover {color:#00457a; border-color:#00457a;}
.nav li:hover ol a {color:#999;}
.nav li ol a:hover {color:#00457a;}
.nav li ol {width:204px; background:#fff; display:none; padding:0; position:absolute; top:0; left:204px; margin:0; z-index:100; border:1px solid #00457a;}
.nav li:hover ol {display:block;}
.nav li:hover ol ol {display:none; position:absolute; margin:0;}
.nav li ol li {width:204px; margin:0; padding:0; height:auto; position:relative;}
.nav li ol li.first a {border-top:none;}
.nav li ol ol {position:absolute; display:none; top:-1px; margin:0;}
.nav li ol li:hover ol {display:block;}
#container .nav li ol li ol li a {width:174px; border-top:1px solid #00457a;}
#container .nav li ol li ol li.first a {border-top:none;}

/* Algemene content divisie */
.content {width:781px; position:relative; z-index:1; overflow:hidden; float:left; background:#ebebeb url(/images/misc/greyPixel.png) repeat-y 474px 0;}
.content h2.title {color:#00457a; text-transform:uppercase; font-size:140%; margin:12px 0 0 0;}
.content .bottom {width:781px; height:13px; font-size:0; position:relative; clear:both; background:url(/images/backgrounds/contentBottom.png) no-repeat bottom left;}

.section {position:relative;}
.content .left {width:452px; float:left; padding-left:12px; padding-right:12px;}
.content .left img.mainImg {margin:0 0 0 -12px;}
.content .right {width:277px; float:right; padding:0 17px 0 0;}
.content .right h3 {color:#00457a; font-size:140%; margin:12px 0; text-transform:uppercase;}

/* Content blokken op de homepage */
.contentBlocks {width:773px; height:137px; margin:10px 0 0 0; clear:left; float:right; background:url(/images/backgrounds/greyContentBlock.png) no-repeat top left; padding:8px 0 0 8px; overflow:hidden; clear:left; position:relative;}
.contentBlocks ul {overflow:hidden; margin:0;}
.contentBlocks ul li {width:190px; height:130px; float:left; position:relative; overflow:hidden; display:block; padding:0; margin-right:14px;}
.contentBlocks ul li.last {margin-right:0;}
.contentBlocks ul li img {width:190px; position:relative;}
.contentBlocks ul li h4 {font-size:110%; text-transform:uppercase; position:absolute; bottom:9px; left:18px; color:#fff;}
.contentBlocks ul li h4 a {color:#fff; text-decoration:none;}
.contentBlocks ul li h4 a:hover {color:#fff;}

/* Overzicht met acties en of producten */
.items {font-size:100%; color:#666; list-style:none; margin:0;}
.items li {padding:0; margin:0 0 10px 0; display:block; clear:left; overflow:hidden;}
.items li img {width:82px; height:62px; float:right; margin:0 0 8px 7px;}
.items li h4 {display:inline; margin:0;}
.items li h4 a {text-decoration:underline;}
.items li p {margin:0; padding:0;}
.items li a {color:#00457a; text-decoration:underline;}
.items li a:hover {text-decoration:none; color:#00457a;}

/* Footer */
#footer {width:781px; margin:10px 0 10px 0; color:#666; font-size:90%; clear:both; float:right;}
#footer address {width:819px; display:block; overflow:hidden; position:relative;}
#footer address span {width:auto; float:left; display:block; margin:0 12px 0 0;}
#footer address span a {color:#666; font-weight:normal;}

#besp {float:right; display:block; width:150px; margin-top:-15px;}