body {
  background-position: 0% 0%; padding:0px; margin:0px; font-family: Arial;
  line-height: 1.2em;
  font-size:100%;
  background-repeat:repeat; background-attachment:scroll
}
.sidebarwit  { color: ##E6A950; background-color: #FFFFFF; 
	img:width:100%;
    max-width:500px; 
    height: auto;
	float:left;
	margin: 0 10px 5px 0;
}
span.goud    { color: #E6A950; font-weight: bold }
#header, #menu, #footer, h1, h2, h3 {
  font-family: 'Arial';
}
#header {
  color: #FFFFFF;
  background:#00FF00 url('img/stenen413.jpg');
  width: 100%;
  margin: 0;
  padding: 0 
}
#header h1{
	margin: 0;
	background-repeat: no-repeat;
	background-position: 8px 8px; padding-left:20px; padding-right:0; padding-top:30px; padding-bottom:20px
}

#footer { 
	color: #FFFFFF;
	background:#333 url('img/stenen413.jpg');  
	padding:0;
	margin:0;
	clear: both;
  	width: 100% 
}
#footer h3 {
padding: 20px;; font-family:Arial; color:#FFFFFF
}

#content{
max-width:1280px;
margin: 20px auto;
}

#main {
  float: left;
  width: 60%;
  margin: 0 0 20px 0;
  padding: 0;
}
#main .textArea {
color: #333333;
margin-right: 2%;
padding-left:2%; padding-right:2%; padding-top:2; padding-bottom:0
}
#main h1, h2, h3, h5 {
color: #FF9900
}
#main h4 { color: #A08F87 
}
.sidebar h1 {
color: #FFFFFF}
.sidebar{
	background-position: 0% 0%; float: left;
	padding: 0;
	width:39%; margin-left:1%; margin-right:0; margin-top:0; margin-bottom:20px; background-color:#FF9900; background-repeat:repeat; background-attachment:scroll; border-radius: 8px 
}
.sidebar .textArea {
	padding: 20px;
	color: #fff;
	font-size: 85%;  
} 
.sidebar a {
color: #FFFFA4
}
.sidebar a:hover {
color: #FFFF99; background-color: #B0B000
}

#kwart {
  float: left;
  width: 25%;
  margin: 0 0 20px 0;
  padding: 0;
}
#kwart .textArea {
color: #333333;
margin-right: 2%;
padding-left:2%; padding-right:2%; padding-top:2; padding-bottom:0
}
#kwart h1, h2, h3, h5 {
color: ##E6A950
}

.img {
	width:100%;
    max-width:400px; 
    height: auto;
	float:left;
	margin: 0 10px 10px 0;
	border-radius: 8px;
}

.imgsmall {
	width:100%;
    max-width:200px; 
    height: auto;
	float:left;
	margin: 0 10px 5px 0;
	border-radius: 8px;
}
.imgside {
	width:100%;
    max-width:500px; 
    height: auto;
	float:left;
	margin: 0 10px 5px 0;
}


#menu ul {
  background-position: 0% 0%; margin:0; color: #333333;font-size: 80%;
  overflow: hidden; list-style-type:none; padding-left:10px; padding-right:10px; padding-top:0px; padding-bottom:0px; background-color:#A08F87; background-repeat:repeat; background-attachment:scroll 
}

#menu li {
  display:inline-block
}
#menu a {
  display: block;
  color:#FFFFFF;
  text-decoration: none;
  padding: 10px;
  font-weight: bold
}
#menu a:hover {
	background: rgb(51,51,51);
	color: #fff;
}

a:link.aap   {
	text-decoration: none;
	color: #FFFF99;background-color:#A08F87
	}
a:active.aap {
	color: #FFFF66;
	text-decoration: none
}
a:visited.aap {
	color: #FFFF66;
	text-decoration: none
}
a:hover.aap  {
	color: #FFFF66;
	background-color: #FFFF99; background-image:url('img/stenen413.jpg')
}

a:link.noot   {
	text-decoration: none;
	color: #000080;background-color:#FFFF99 
}
a:active.noot {
	color: #FFFF66;
	text-decoration: none
}
a:visited.noot {
	color: #0000FF;
	text-decoration: none
}
a:hover.noot  {
	color: #FFFF66;
	background-color: #FFFF99; background-image:url('img/stenen413.jpg')
}


/* MEDIA QUERIES */
@media screen and (max-width: 768px) {
	.sidebar{
	margin: 0 0 20px 1%;
	clear:both;
	width:98%; 
	}
	#main {
	clear:both;
	width:100%;	
	}
	#main .textArea {
	margin:0;
	}	 
}
@media screen and (max-width: 480px) {
	body{
		font-size: 120%;
	}
	#main h1{
		font-size: 160%;
}

	.sidebar{
		margin: 0;
		width:100%;   
	}
	#menu li {
	  display:block;
	  border-bottom-color:#FFF;
	  border-bottom-style:solid;
	  border-bottom-width:1px;
	  text-align:center;
	  padding:0px;
	}
	#menu a {
  		padding: 4px;
	}

	#menu ul {
		padding: 0;
		margin-left:0; margin-right:0; margin-top:0; margin-bottom:10px
	}
}