

HTML, BODY {
	font-family : 'open sans', Helvetica, sans-serif;
	font-size: 13px;
}

p {
	margin: 0;
	padding: 0px 0px 10px 0px;
	line-height: 180%;	
}



h1 {
	padding: 0;
	height:auto;
	margin:30px 0 15px 0;
	color:#479189;
	font-size:35px;
	font-weight:normal
}

h2 {
	margin: 0;
	padding: 4px 0px 3px 0px;
	font-size: 20px;
	margin-bottom:10px;
	font-weight:normal;
	font-style:italic;
}

h3 {
	margin: 0;
	padding: 2px 0px 2px 0px;
	font-size: 100%;
	color: #000000;
}

.clearer {
	clear: both;
}



/* Layout-Elemente  */

BODY {
	background-color: #bf9474;
	margin: 0;
	padding: 0;
}
#wrapper {
	max-width:1100px;
	margin:0 auto;
	position:relative;
	margin-top:20px;
	}



#logo {
	text-align:right;
	font-size:25px;
	color:white;
	margin-right:10px;
	margin-bottom:10px;
}


#eyecatcher {
	width: 175px;
	height: 189px;
	background : url(../images/karin_geels.jpg) no-repeat top right;
	overflow: hidden;
	background-size:175px;
}
.mobileimage {
	box-shadow: 5px 5px 5px #333333;
  -webkit-box-shadow: 5px 5px 6px #333333;
  -ms-filter:'progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=115,strength=4)'; /* IE 8 */
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=115,strength=4); /* IE 5,6,7 */
	margin:0 auto;
	display:none;
}
#main {
	padding:2.5%;
	border-radius:6px;
	background-color:#fff;	
	border-radius:14px;
	box-shadow: 5px 5px 5px #333333;
  -webkit-box-shadow: 5px 5px 6px #333333;
  -ms-filter:'progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=115,strength=4)'; /* IE 8 */
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=115,strength=4); /* IE 5,6,7 */
	width:95%;
}
#mainwrapper {
	float:left;
	margin-left:50px;
	width:75%;
}
.text {
	float:left;
	width:65%;
	margin-right:40px;
}
#nav {
	float:left;
	margin-left:10px;
	border-radius:6px;
	background-color:#479189;
	padding-bottom:12px;
		box-shadow: 5px 5px 5px #333333;
  -webkit-box-shadow: 5px 5px 6px #333333;
  -ms-filter:'progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=115,strength=4)'; /* IE 8 */
  filter:progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=115,strength=4); /* IE 5,6,7 */
}

#nav ul {
	margin: 0;
	padding: 0;
}

#nav li
{
	list-style: none;
}

a.menuButton, a.menuButtonActive
{
	display: block;
	padding: 12px 10px;
	width: 140px;
	color: #fff;
	text-decoration: none;
	background-color: #479189;
	border-top: 1px solid #ffffff;	
}

a.menuButton, a.menuButtonActive
{
	width: 155px;

}


div.sidepicture {
	float: right;
	padding: 10px 13px;
	margin: 0px 0px 10px 0px;
	width: 200px;
	border-bottom: 1px solid #aaaaaa;	
	border-right: 1px solid #aaaaaa;	
	border-top: 1px solid #eeeeee;	
	border-left: 1px solid #eeeeee;	
	background: #479189;
	border-bottom-left-radius:12px;
	border-bottom-right-radius:12px;
}

p.sidepicturetext {
	margin-top: 10px;
	color:white;
	padding: 2px 0px 5px 0px;
	line-height: 160%;	
	font-size: 90%;
}

#sidebar {
	width: 155px;
	background-color: #479189;
	border-bottom: 1px solid #fff;
	border-top: 1px solid #eeeeee;	
	padding: 8px 10px 8px 10px;
	color:white;
}

#sidebar h2 {
	font-size: 10pt;
	color: #fff;
	font-weight : bold;
	margin-top : 2pt;
	margin-bottom : 2pt;
}

#sidebar p {
	margin: 0px 0px 5px 0px;
	padding: 0px;
}

#sidebar a {
	font-weight: bold;
	color: #065A7F;
	text-decoration: none;
}

#mobile-menu {
		display:none;
		float:right;
		width:40px;
		position:relative;
		height:42px;
		z-index:9999;
		margin:-5px 50px 5px 0px;
		cursor:pointer;
	}
	.mobile-menu {
		display:block;

	}
.mobile-menu ul {
  display:block;
  width:195px;
	margin:0;
  margin:70px 0 0 15px;
  padding:10px 0px 3px 0px;
	list-style-type:none;
	margin-top:52px!important;
		background-color:#479189;
	border-top-right-radius:12px;
	border-bottom-left-radius:12px;

}
.mobile-menu ul li a {
  color:#4c4d4f;
	font-size:15px;
	line-height:32px;
	text-decoration:none;
	color:white;
	margin-bottom:0px;
	padding:3px 15px;
	font-weight:300;
	display:block;
	text-align:right;
}

.mobile-menu ul li {
	display:block!important;
}
.mobile-menu {
	z-index:999999999999;
  position:absolute;
  top:0;
  left:-120px;
  width:auto;
  height:42px;
  background:url(../images/mobiel_menu2.png) 160px 0 no-repeat;
  overflow:hidden;
}
.mobile-menu ul li a:hover {
	background-color:#666;
}

#praktijkimages img {
	margin-right:20px;
	vertical-align: bottom;
	width:100px;
}
#praktijkimages img.scag {
	width:75px;
	margin-right:0;
}


@media screen and (max-device-width: 1100px),
screen and (max-width: 1100px)  {
	

	div.sidepicture {
	width: 150px;
}
	div.sidepicture img {
	width: 100%;
}

.text {
	width:66%;
}

#praktijkimages img {
	width:80px;
}
#praktijkimages img.scag {
	width:70px;
}

}

@media screen and (max-device-width: 1002px),
screen and (max-width: 1002px)  {
	
#mainwrapper {
	width:73%;
}

}


@media screen and (max-device-width: 940px),
screen and (max-width: 940px)  {
.text {
	width:62%;
	margin-right:20px;
}
	#mainwrapper {
	width:71%;
}

#praktijkimages img {
	width:65px;
	margin-right:15px;
}
#praktijkimages img.scag {
	width:50px;
}

}

@media screen and (max-device-width: 846px),
screen and (max-width: 846px)  {
.text {
	width:60%;
	margin-right:10px;
}
	#mainwrapper {
	width:69%;
}
}

@media screen and (max-device-width: 800px),
screen and (max-width: 800px)  {
.text {
	width:100%;
	margin-right:0px;
	float:none;
}
div.sidepicture {
	float:none;
	margin:0 auto;
}
	#mainwrapper {
	width:66%;
}

#praktijkimages img {
	margin-right:10px;
	width:75px;
}
#praktijkimages img.scag {
	width:50px;
}

}

@media screen and (max-device-width: 730px),
screen and (max-width: 730px)  {

	#mainwrapper {
	width:64%;
}
}
@media screen and (max-device-width: 685px),
screen and (max-width: 685px)  {

	#mainwrapper {
	width:62%;
}
}

@media screen and (max-device-width: 642px),
screen and (max-width: 642px)  {

	#mainwrapper {
	width:62%;
	margin-left:30px;
}
}

@media screen and (max-device-width: 600px),
screen and (max-width: 600px)  {
	
	#praktijkimages img {
		width:85px;
		margin-right:20px;
	}
	#praktijkimages img.scag {
		width:80px;
	}

h1 {
	font-size:25px;
}

#main {
	padding:5%;
	border-radius:6px;
	background-color:#fff;	
	border-radius:14px;
		box-shadow:none;
  -webkit-box-shadow:none;
	width:90%;
}
	
h1 {
	text-align:center;
	margin-top:15px;
}
h2 {
		text-align:center;
}
	#nav {
		display:none;
	}
	
	#mainwrapper {
	width:100%;
	margin-left:0px;
}
#wrapper {
	padding:0 3%;
}
#mobile-menu {
		display:block;
}
#logo {
		text-align:left;
}
#mobile-menu {
	margin:0px 50px 10px 0px;
}
#logo {
	margin-bottom:15px;
}
.mobileimage {
	display:block;
}
table.content td {
	padding:7px 10px;
	border:1px solid black;
	border-bottom:0;
	border-right:0;
}
table.content {
	border-bottom:1px solid black;
	border-right:1px solid black;
}

}
@media screen and (max-device-width: 500px),
screen and (max-width: 500px)  {
	
#eyecatcher {
	width: 135px;
	height: 150px;
	background-size:135px;
	margin-top:15px;
}
#praktijkimages img {
	width:70px;
	margin-right:10px;
}
#praktijkimages img.scag {
	width:60px;
}


}
@media screen and (max-device-width: 400px),
screen and (max-width: 400px)  {

#praktijkimages img {
	margin-right:5px;
	width:65px;
}
#praktijkimages img.scag {
	width:40px;
}
}
@media screen and (max-device-width: 383px),
screen and (max-width: 383px)  {
	
	h2 {
		display:none;
	}
	
#logo {
	font-size:22px;
}
}
@media screen and (max-device-width: 340px),
screen and (max-width: 340px)  {
#logo {
	font-size:20.6px;
}
}
