/* 
Website: Het Bolwerk Gennep / Smedema
Author: CYBOX internet & communicatie, Boxmeer, www.cybox.nl
*/

/* default
--------------------------------------------------------------------------------------*/

body {
	background-color: #473e3c;
	font-family: arial, sans-serif;
	font-size: 11px;
	color: #333;
	/*background-image: url('../images/naam.jpg'); */
	/* background-repeat: no-repeat / repeat-x / repeat-y */
	/* background-position: 50% 0 / 0 50% / 10px 30px */
	/* background-attachment: fixed / auto */
}
a {
	color: #7190c9;
	cursor: pointer;
}
a:hover {
	color: #fd0;
}
p {
	margin-bottom: 10px;
	line-height: 16px;
}




#container {
	width: 960px;
	margin: 0 auto;
	position: relative;
}

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

#container #header {
	background-image: url('../images/header.jpg');
	background-color: #4a3b38;
	width: 960px;
	height: 767px;
}
#header h1 {
	padding-top: 45px;

	font-size: 25px;
	color: #fff;
	text-transform: uppercase;
	letter-spacing: 1px;
	text-align: center;
}
#container #text {
	background-color: #e4cfc9;
	width: 960px;
	height: 490px;
	position: relative;
}
#container #text .text {
	position: absolute;
	left: 110px;
	top: 30px;
	width: 740px;
	line-height: 34px;
	color: #69514f;
	font-size: 20px;
}
#container #text .prijs {
	position: absolute;
	right: 145px;
	top: 210px;
	width: 450px;
	line-height: 34px;
	color: #69514f;
	font-size: 28px;
	font-weight: bold;
	text-align: right;
}

#container #text .knop {
	position: absolute;
	bottom: 26px;
	width: 200px;
	height: 200px;
	background-image: url('../images/knop.png');
	background-repeat: no-repeat;
	background-position: 0 0;
	font-size: 21px;
	text-align: center;
	line-height: 30px;
}
#container #text .knop:hover {
	background-position: 0 -200px;	
}
#container #text .knop h2 {
	padding: 15px;
	padding-top: 70px;
}
#container #text .knop h2 a {
	color: #fff; text-decoration: none;
	display: block;
}
#container #text .knop h2 a:hover {
	color: #e4cfc9;
}
.knop1 {
	left: 110px;
}
.knop2 {
	left: 290px;
}
.knop3 {
	left: 470px;
}
.knop4 {
	left: 650px;
}

.contactcontent {
	background: #6e91cb;
	padding: 20px;
	width:540px; 
	height: 115px;
	position: absolute;
	bottom: 220px;
	left: 30px;
	z-index: 989999;
	display: none;
}	
.contactcontent .column {
	float: left;
	line-height: 22px;
}
.contactcontent .column h3 {
	color: #fff;
	font-size: 16px;
	font-weight: normal;
}
.contactcontent .column a {
	color: #fff;
}
.contactcontent .column a:hover {
	color: #473e3c;
}
.contactcontent  .tip {
	position: absolute;
	bottom: -30px;
	left: 130px;
}		

#container #footer {
	background-image: url('../images/footer.jpg');
	background-color: #fff;
	width: 960px;
	height: 363px;
	position: relative;	
	z-index: 6;
}
#container #footer .link1 {
	position: absolute;
	left: 120px;
	top: 47px;
	width: 280px;
	height: 240px;
}
#container #footer .link2 {
	position: absolute;
	right: 140px;
	top: 47px;
	width: 280px;
	height: 240px;
}
#container #footer .link1, #container #footer .link2 {
	display: block;
	width: 280px;
	height: 240px;
	border: 0px solid #000;	
}


.bouwgestart {
	position: absolute; left: -30px; top: 130px;
}

/* video */

.video {
	position: absolute; left: -30px; top: 80px;
	width: 342px; height: 261px;
	background-image: url('../images/video-backdrop.png');
	background-repeat: no-repeat;
	z-index: 9;
}
.video .stream {
	position: absolute; left: 11px; top: 11px;
}
.video .stream img {
	display: block; width: 320px; height: 240px;
}
.video .live {
	position: absolute; right: 11px; top: 11px;
	width: 38px; height: 16px; color: #fff;
	padding: 5px;
	background-image: url('../images/video-live.png');
}
.video .refresh {
	position: absolute; right: 65px; top: 18px;
	cursor: pointer;
}
.video .zoom {
	position: absolute; right: 82px; top: 19px;
	cursor: pointer;
}
.bouwgestart2 {
	position: absolute; left: 300px; top: 130px;
}

#zoomed {
	position: fixed; 
	left: 50%; 
	top: 50%;
	width: 640px;
	height: 480px;
	margin-left: -320px;
	margin-top: -240px;
	z-index: 999;
	border: 10px solid #fff;
	background: #000;
}
#zoomed .close {
	position: absolute;
	bottom: -30px;
	cursor: pointer;
	right: 0;
	color: #fff;
}	
#zoomed .refresh-big {
	position: absolute;
	bottom: -30px;
	cursor: pointer;
	left: 0;
	color: #fff;
}
#zoomed-bg {
	background: #473E3C;
	position: fixed;
	left: 0;
	top:0;
	width: 100%;
	height: 100%;
	z-index: 9;
	opacity:0.9;
	filter:alpha(opacity=90); /* For IE8 and earlier */	
}