body,html{margin:10px;padding:0;}
/*body{font-family: "Helvetica Neue", "Lucida Grande", "Segoe UI", Arial, Helvetica, Verdana, sans-serif;}*/
body{
	font-family: Verdana,Helvetica,Arial,sans-serif;
	line-height: 1.5em;
}

.clear{clear:both;}
.float,.left{display:block;float:left;margin:2px;}
.right{display:block;float:right;margin:2px;}
.bold{font-weight:bold;}
.small{width:200px}
.border{border: solid 1px black;border-radius:10px;padding:5px;}
 
/* HEADINGS  */
h1,h2,h3,h4,h5,h6{
    font-size: 1.5em;
    color: #0024C4;
    font-variant: small-caps;
    text-transform: none;
    font-weight: 200;
    margin-bottom: 0px;
}
h1{
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
    clear: both;
	font-weight:700;
	color:#0000ff;
}
h2{font-size: 1.5em; font-weight: 600; color: #0000cc;}
h3,dt{font-size: 1.2em; font-weight: 500; color: #0000cc;}
h4{font-size: 1.1em;}
h5,h6{font-size: 1em;}


a:link,a:visited,a:active,a:hover{color:#00F;}
h2 a:link,h2 a:visited,h2 a:active,h2 a:hover{color:#00F;text-decoration:underline;}

ul.foto { list-style: none; padding: 0 20px; margin: 0; background: #eee; font-size: 1.2em; }
ul.foto li { margin: 0; padding: 0 20px 0 0; float: left; display: block; overflow: hidden; width: 220px; height: 220px; }
ul.foto li a { padding: 10px 5px; display: block; text-decoration: none; color:#000; }
ul.foto li a:hover { background: #ccc; }
ul.foto li span { display:block; clear:left; }

ul.video { list-style: none; padding: 0 20px; margin: 0; background: #eee; font-size: 1.2em; }
ul.video li { margin: 0; padding: 0 20px 0 0; float: left; display: block; overflow: hidden; width: 420px; height: 360px; }
ul.video li a { padding: 10px 5px; display: block; text-decoration: none; color:#000; }
ul.video li a:hover { background: #ccc; }
ul.video li span { display:block; clear:left; }

#footer{font-size:0.8em;}

#hosted{position:absolute;width:150px;right:0;top:0;font-size:0.6em;}
#hosted a:link,#hosted a:visited{color:#000;text-decoration:none;}
#hosted a:active,#hosted a:hover{color:#44F;text-decoration:underline}

#foto span{padding-left:5px}

#youtube iframe {padding:10px 0 0 5px;}

#menu{position:absolute; top:3px; left:3px; font-size:0.8em;}
#menu a{text-decoration:none;}
#menu a:hover{background:#ccc;}

.m .border{border: solid 1px blue;}
.v .border{border: solid 1px #dd0d8f;}

.naam-breed{width:168px;}
.naam-breder{width:228px;}
.welzijn{width:328px;padding-left:55px;padding-top:5px;}
.welzijn2{width:328px;padding-left:85px;padding-top:5px;}
.headerbanner {border-radius: 20px;}
.inlinelogo {float:left; margin-right:10px;border-radius:50%}
.imagebreedte {width: 800px;}
.hoek {border-radius: 20px;}
.fototekst{width:328px;}
.fotomargin{margin-left: 55px;}
.werkwijze {background:#c3e4ff;padding:10px;}
.werkwijze h3 {margin-top:35px;color: #00057a;}
.ontstaan {background:#d7faca;padding:10px;}
.ontstaan h3 {margin-top:35px;color: #007a1a;}
.opleiding {background:#ffdafd;padding:10px;}
.opleiding h3 {margin-top:35px;color: #790039;}
.bluecolor {background:#0024C4;}
.natuurlijk {width: 800px;}

.spreuk {font-family: 'FrenchScriptMT';color:#0024C4;font-size:3em;padding:10px;background:#DDF5FE;margin: 25px 0 25px 0;border-radius: 20px; }
.footertekst{color:#00057a;font-family: sans-serif; font-weight: bold;}
div {border-radius: 20px;}

.l50{float:left;width:49%;}
.r50{float:left;width:49%;}


img.footerlogo {
  width: 100%; /* Full width by default */
  max-width: 100%; /* Prevents overflow */
  height: auto; /* Maintains aspect ratio */
}
/* Reduce image width on desktop screens */
@media (min-width: 800px) {
  img.footerlogo {
    width: 50%; /* Reduce width to 50% on larger screens */
    margin: 0 auto; /* Center the image */
    display: block; /* Ensures centering works */
  }
}

div#wrapper { width:1000px; margin:auto; }
@media (max-width: 1000px) {
  div#wrapper { width:95%;margin:0; }
  div.l50,div.r50{width:95%;}
  img.imagebreedte {width: 95%;}
  img.fotomargin{margin-left: 0px;}
  img.natuurlijk {width: 95%;}
}

#wrapper .m a:link,#wrapper .m a:visited,#wrapper .m a:active,#wrapper .m a:hover{color:blue;}
#wrapper .v a:link,#wrapper .v a:visited,#wrapper .v a:active,#wrapper .v a:hover{color:#dd0d8f;}

h1.border{
    font-size: 3em;
	padding-bottom: 10px;
	padding-left: 10px;
    margin-bottom: 0px;
	font-weight:600;
	color:#0000ff;
	width:300px;
	border: solid 1px blue;
}
h1 img {vertical-align:text-top;}