/* Cubique Webcreations  
www.cubique.nl */

/* ----------------------------------------------------- algemene kenmerken ------- */
* {
	margin: 0;
	padding: 0;
}
body {
	background: #fff;
	font-family: arial, verdana, tahoma;
}
img {
	border: 0 none;
}
td {
	vertical-align: top;
}
a, input {
	outline: none;
}

/* ----------------------------------------------------- layout kenmerken ------- */

#container {
	width: 1000px;
	position: relative;
	min-height: 500px;
}
#header {
	position: relative;
	height: 175px;
	overflow: hidden;
	background: url('img/main/kozel-header.jpg') no-repeat;
}
#left-block {
	background: #fff url('img/main/back-left-block.gif') no-repeat;
	background-position: 0 2px;
	width: 510px;
	min-height: 600px;
	float: left;
}
#right-block { 
	width: 490px;
	background: #e75523 url('img/main/back-content.gif') no-repeat bottom;
	min-height: 600px;
	height: auto !important;
	height: 600px;
	float:right;
}
#menu {
	width: 490px;
	height: 90px;
}
#content {
	margin: 25px;
	color: #fff;
	padding-bottom: 140px;
	width: 410px;
}

/* ----------------------------------------------------- header kenmerken ------- */

#header ul {
	padding: 0;
	margin: 15px 0 0 400px;
	list-style-type: none
}
#header li {
	line-height: 140%;
	font-size: 71%;
	font-weight: bold;	
}
#header li a {
	color: #003c5a;
	text-decoration: none;
	padding-left: 10px;
}
#header li a:hover {
	color: #0083b7
}
#header li a:hover {
	background: url('img/main/submenu-top-arrow.gif') no-repeat;
	background-position: 0 2px;
}
#link-home {
	float: left;
	margin: 145px 0 0 117px;
}
#link-home, #link-home a {
	width: 261px;
	height: 31px;	
}
#link-home a {
	display:block
}

/* ----------------------------------------------------- left block kenmerken ------- */

#gallery-holder {
	margin: 110px 0 0 60px;
	width: 450px;
}
.image-gallery {
	width: 450px;
	height: 300px;
}
#gallery-holder p {
	color: #003c5a;
	font-size: 69%;
	padding: 10px 0 0 0;
	font-weight: bold;
}
#vakorganisaties {
	width: 450px;
	margin-left: 60px;
	height: 80px;
	position: absolute;
	top: 750px;
}
#gallery-holder .hidden {
	display: none;
}
#thumbnails {
	height: 55px;
	margin-top: 25px;
}
#thumbnails ul {
	list-style-type: none;
}
#thumbnails li {
	float: left;
	display: inline;
	margin-right: 5px;
}
#scroll {
	height: 15px;
	width: 30px;
	position: absolute;
	left: 470px;
	top: 593px;
}
#scroll .right {
	margin-left: 15px;
}

/* ----------------------------------------------------- menu kenmerken ------- */

#menu ul {
	list-style-type: none;
}
#menu li {
	display: block;
	float: left;
	line-height: 40px;
}
#menu li a {
	position:relative;
	display: block; 
	float: left;
	height: 40px;
}
#menu a#kozel				{background-image: url('img/menu/menu-kozel.gif'); width: 67px}
#menu a#service				{background-image: url('img/menu/menu-service.gif'); width: 78px}
#menu a#portfolio			{background-image: url('img/menu/menu-portfolio.gif'); width: 91px}
#menu a#vacatures			{background-image: url('img/menu/menu-vacatures.gif'); width: 96px}
#menu a#bedrijfsprofiel		{background-image: url('img/menu/menu-profiel.gif'); width: 75px}
#menu a#contact				{background-image: url('img/menu/menu-contact.gif'); width: 83px}

#menu span, #vakorganisaties span {
	visibility: hidden;
	height: 0;
	width: 0;
	display: none;
}
#menu a:hover, #menu a.selected {
	height: 80px;
}
#menu a#kozel:hover, #menu a#kozel.selected {
	background-position: -67px 0;
}
#menu a#service:hover, #menu a#service.selected {
	background-position: -78px 0;
}
#menu a#portfolio:hover, #menu a#portfolio.selected {
	background-position: -91px 0;
}
#menu a#vacatures:hover, #menu a#vacatures.selected {
	background-position: -96px 0;
}
#menu a#bedrijfsprofiel:hover, #menu a#bedrijfsprofiel.selected {
	background-position: -75px 0;
}
#menu a#contact:hover, #menu a#contact.selected {
	background-position: -83px 0;
}
#menu .visible {
	display: inline;
	visibility: visible;
}
#menu .hidden {
	display: none;
	visibility: hidden;
}

/* ----------------------------------------------------- submenu kenmerken ------- */

#subholder {
	float: left;
	margin-left: 115px;
}
#submenu {
	font-size: 71%;
	left: 300px;
}
#submenu {
	line-height: 140%;
	font-weight: bold;
	
}
#submenu a {
	text-decoration: none;
	color: #eb8866;
	padding-left: 10px;
}
#submenu a:hover {
	color: #fff;
	background: url('img/main/submenu-arrow.gif') no-repeat;
	background-position: 0 2px;
}

/* ----------------------------------------------------- vakorganisaties kenmerken ------- */

#vakorganisaties ul {
	list-style-type: none;
}
#vakorganisaties li {
	display: block;
	float: left;
	line-height: 32px;
}
#vakorganisaties li a {
	position:relative;
	display: block; 
	margin-right: 20px; 
	float: left;
	height: 32px;
}
#vakorganisaties a#bouwgarant			{background-image: url('img/main/bouwgrarant.gif'); width: 48px}
#vakorganisaties a#bouwend-nederland	{background-image: url('img/main/bouwend-nederland.gif'); width: 102px}
#vakorganisaties a#vakgroep-restauratie	{background-image: url('img/main/vakgroep-restauratie.gif'); width: 116px}

#vakorganisaties a#bouwgarant:hover {
	background-position: -48px 0;	
}
#vakorganisaties a#bouwend-nederland:hover {
	background-position: -102px 0;
}
#vakorganisaties a#vakgroep-restauratie:hover {
	background-position: -116px 0;
}

/* ----------------------------------------------------- content kenmerken ------- */

#content h1 {
	font-size: 115%;
	border-bottom: 1px #fff dotted;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
#content h2 {
	font-size: 100%;
	padding-bottom: 5px;
	margin-bottom: 10px;
}
#content h3 {
	font-size: 84%;
	padding-bottom: 5px;
}
#content p {
	line-height: 150%;
	padding: 10px 0 0 0;
	font-size: 84%;
}
#content ul {
	margin: 10px 0 0 25px;
}
#content li {
	line-height: 140%;
	font-size: 81%;
}
#content a {
	color: #fff;
	text-decoration: underline;
}
#content a:hover {
	color: #113d5a;
}
.imgleft {
	float: left;
	padding: 0;
	margin: 3px 3px 3px 0;
}
.imgright {
	float: right;
	padding: 0;
	margin: 3px 0 3px 3px;
}