/* *********************************positionering div's************************************/
body{
	
	margin:0px;
	padding:0px;
	height:auto;
	width:auto;
	overflow-x:hidden;
	overflow-y:visible;
	background:#ffffff;	
	background:url('../images/ontwerp/achtergrond.jpg');
	background-repeat:repeat-x;
	font-size: 13px;
	font-family: Arial, Helvetica, sans-serif; 
	color: #1A171B;		
}
img{
	border: 0px;
}

#container{
	width:901px;
	margin-left:auto;
	margin-right:auto;
}
#website {
	float:left;
	width: 901px;
	border:0px solid #1A171B;	 	
}
#menu{
float:left;
margin-top:30px;
width: 901px;
height: 30px;
margin-left:10px;
}
#logo{
float:right;
margin-top:50px;
width: 411px;
height: 67px;
margin-left:10px;
background:url('../images/ontwerp/logo.png');
background-repeat:no-repeat;
}

#banner {
	margin-top: 10px;
	width: 901px; 
	height:248px;
	float:left;
	border:0px solid #D9341E;
	}



#content {
	margin-left:0px;
	margin-top:0px;
	width: 860px; 
	border:0px solid #D9341E;
	padding: 3px 30px 10px 10px;
	float:left;
	background:url('../images/ontwerp/content.jpg') top;
	background-repeat:repeat-x;
}


/******************************* FOOTER WEBSITE*****************************************************/
#footerwebsite{
width: 901px; 
height:52px;
float:left;
margin-left:0px;
margin-top:-5px;background:url('../images/ontwerp/footer.jpg');
background-repeat:no-repeat;}


.footer_leftwebsite {
	float: left;
	text-align: left;
	padding: 20px 0px 0px 15px;
	color: #ffffff;
}



.footer_rightwebsite {
	float: right;
	text-align: right;
	padding: 20px 15px 0px 0px;
	color: #ffffff;
}

/* **************************************opmaak teksten************************************/

h1{   
font-size: 24px; 
color: #497527;
}
h2{  
text-align: top; 
font-size: 14px; 
color: #E4146C;
align:left;
}
a { 
color: #D9341E;
text-decoration:none;
}
a:hover{ 
color: #D9341E;
text-decoration:underline;
}
a.link { 
color: #ffffff;
text-decoration:none;
}
a.link:hover{ 
color: #87B91A;
text-decoration:underline;
}
a.linktekst { 
color: #000000;
text-decoration:none;
}
a.linktekst:hover{ 
color: #D37540;
text-decoration:none;
}

td.tekstnieuws{
color: #98271B;	
}


.fotos{
	float:left;
	padding:2px;
	border:1px solid #E9E9E9;
}
hr {
color:  #E9E9E9;
height:1px;	
} 

.fotos{
	float:left;
	padding:5px;
	border:1px solid #E9E9E9;
	margin:10px;
}

/* ****************************opmaak lijsten menu************************************/
/* ****************************opmaak lijsten menu************************************/
ul#hoofdmenu{ 
margin: 0;/*zorgt ervoor dat hoofdmenuvak geen margin en padding heeft, dus linksboven in de hoek begint*/
padding: 0;}

ul#hoofdmenu li{
display: inline;/*zorgt voor een horizontaal menu*/
float: left;
height:30px;
}

ul#hoofdmenu li a{ 	
list-style:none; 
color:#ffffff;/*wit*/ 
text-decoration:none;
margin: 0px;
padding-right: 10px;
display: block;}

ul#hoofdmenu li a:hover{
text-decoration: none;
color:#87B91A;/*lichtgroen*/
padding-right: 10px;
display: block;}

/****************submenu*/
ul#hoofdmenu ul {
position: absolute;
margin: 0;
padding: 0;
top: 52px;/* gerekend vanaf top site */
width:150px; /* breedte van het menu mag je zelf kiezen, als je tekst er maar inpast */
border: 0px solid #191919;
background-color: #191919;
list-style: none;
}

ul#hoofdmenu ul li{
border-bottom:1px solid #fff; /* workaround for IE */ 
text-align:left;
padding: 0px;
width:150px;
color:#ffffff;
} 
ul#hoofdmenu ul li a{ 
background-image:none;/*anders wordt de background url van het hoofdmenu getoond*/ 
padding: 10px 5px 5px 5px; 
color:#ffffff;/*wit*/
text-decoration:none;}

ul#hoofdmenu ul li a:hover{
text-decoration: none; 
padding: 10px 5px 5px 5px;
color:#cccccc;}/*logo oranjegeel*/


/************************************ css bij javascript ShowHideDIV.js *********************************************/
.mouse2
{
visibility:hidden;
background-color: #000000;
color: white;
font-size:10px;
border:1px solid white;
z-index:10;
}


/************************************ css bij fotopresentatie *********************************************/
#box{
	visibility:hidden;
	position:absolute;
	left:0px;
	top:0px;	
}

#achtergrond{
position:absolute;
top: 0px;
left:0px;
z-index:10;
background-color: #191919;
height:1200px; 
width:2000px;
filter:alpha(opacity=40);
-moz-opacity:.40;
opacity:.40;
}
	
#vergroting{
	position:absolute;/*dit is nodig omdat anders het filter niet van 70 teruggaat naar 100*/
	top: 175px;
	left:200px;
	width:600px;
	height:450px;
	border: solid 0px #000;
	z-index:20;
	filter:alpha(opacity=100);   
	-moz-opacity: 1.0;   
	opacity: 1.0;
}



#gallery{
	position:absolute;/*dit is nodig omdat anders het filter niet van 70 teruggaat naar 100*/
	top: 35px;
	left:200px;
	width:765px;
	height:803px;
	background-color: #BB491A;
	border: solid 0px #000;
	z-index:20;
	filter:alpha(opacity=100);   
	-moz-opacity: 1.0;   
	opacity: 1.0;
}
#presKop{
	position:absolute;/*dit is nodig omdat anders het filter niet van 30 teruggaat naar 100*/
	top: 30px;
	left:0px;
	text-align:center;
	width:766px;
	height:45px;
	padding-left:0px;
	padding-right:0px;
}
#presNaam{
	float:left;
	width:710px;
	padding-top:7px;
	font-size:14px;
	color:#FFFFFF;
	font-weight:bold;
}
#presSluit{
	float:left;
	padding-top:7px;
	width:14px;
}
#presKaart{
	position:absolute;/*dit is nodig omdat anders het filter niet van 30 teruggaat naar 100*/
	top: 55px;
	left:0px;
	height:420px;	
}
#box_foto{
	margin-left: 80px;
	width:600px;
	height:398px;
	margin-top:10px;
}

#pres_foto{
	float:left;
	width:592px;
	padding:6px;
	text-align:left;
}
#box_fotos{
	position:absolute;/*dit is nodig omdat anders het filter niet van 30 teruggaat naar 100*/
	top: 520px;
	left:80px;
	width:600px;
	height:210px;
}
.box_thumb{
	float:left;
	padding-top:6px;
	padding-left:6px;
	padding-right:5px;
	padding-bottom:5px;
	width:109px;
	height:73px;
	text-align:left;}

IMG.boxthumb{
	width:99px;
	height:66px;
}

/************************************ einde css bij fotopresentatie *********************************************/


.scrollen {
		overflow:auto;
		height: 115%;
		width: 103%;	
}
/************************************ css bij drie tn op pagina content *********************************************/
.boxtnfoto{
	float:left;
	width:172px;
	height:125px;
	padding:0px;
	background:url('../images/ontwerp/tnachtergrond.jpg') left top no-repeat;
	text-align:left;
}
.tnfoto{
	float:left;
	width:150px;
	height:100px;
	padding:0px;
	text-align:left;
}

/************************************ css bij fotocarousel *********************************************/
.stepcarousel{
position: relative; /*leave this value alone*/
border: 0px solid #1A171B;
overflow: scroll; /*leave this value alone*/
width: 800px; /*Width of Carousel Viewer itself*/
height: 120px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 9px; /*margin around each panel*/
width: 150px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}