@font-face {
    font-family: 'WebSymbolsRegular';
    src: url('fonts/WebSymbols-Regular-webfont.eot');
    src: url('fonts/WebSymbols-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/WebSymbols-Regular-webfont.woff') format('woff'),
         url('fonts/WebSymbols-Regular-webfont.ttf') format('truetype'),
         url('fonts/WebSymbols-Regular-webfont.svg#WebSymbolsRegular') format('svg');
    font-weight: normal;
    font-style: normal;
}

* { 
margin: 0;
padding: 0;
	}

body {
background-color: #ffffff;
font-family: "Lucida Grande", Verdana, sans-serif;
font-size: 1em;
color: #1c1c1c;
}

#kop {
width: 100%;
margin: 0 auto;
height: 4em;
background-color: dimgray;  
}

@media screen and (max-width: 800px) {
	#kop { height: auto; }
}

#gse { 
width: 350px;
float: right; 
}

@media screen and (max-width: 800px) {
	#gse {  width: 100%; float: none;  }
}

#kop > p {
width: 60%;
margin: 0 auto;
font-size: 1.2em;
}

@media screen and (max-width: 1440px) {
	#kop > p { width: 80%; }
}

@media screen and (max-width: 1000px) {
	#kop > p { width: 95%; }
}

@media screen and (max-width: 800px) {
	#kop > p { width: 100%; font-size: 1.4em; margin: 0.25em 0; }
}

#kop > p > a { 
 width: 15%;
 display: block;
 background-color: #347C2C; /* groen  */
 color: white;
 font-weight: bold;
 text-align: center;
 text-decoration: none;
 padding: 5% 0.5em;
 border: 4px solid white;
 color: #ffffff;
 text-decoration: none;
}

@media screen and (max-width: 800px) {
	#kop p a { width: 100%; font-size: 1em; border: 0; border-bottom: 4px solid white; padding: 1em 0.5em; }
}

#midden {
 width: 60%;
 margin: 0 auto;
}

@media screen and (max-width: 1440px) {
	#midden { width: 80%; }
}

@media screen and (max-width: 1000px) {
	#midden { width: 95%; }
}

@media screen and (max-width: 800px) {
	#midden { width: 100%; }
}

#menukolom {
width: 16%; 
float: left; 
margin-top: 6.5em;
padding-right: 1.2em;
padding-left: 0.4em;
 }


@media screen and (max-width: 800px) {
	#menukolom { width: 100%; float: none; margin: 0; padding-left: 0; }
}

#menukolom p {
font-size: 0.8em;
color: #2f4f4f;
margin: 0.8em 0 0.5em 0;
}

#menu { 
margin: 0; 
padding: 0; }

#menu ul {
list-style-type: none;
margin: 0; padding: 0;
}

#hoofdmenu > li, .xoxo > li {
position: relative;
}

#hoofdmenu > li > a, .xoxo > li > a {
display: block;
background-color: #347c2c;
width: 100%;
padding: 0.5em 0 0.5em 0.5em;
color: whitesmoke;
font-weight: normal;
font-size: 0.9em;
text-decoration: none;
text-align: left;
margin-left: 0;
border-bottom: 0.4em solid white;
}

@media screen and (max-width: 800px) {
	#hoofdmenu > li > a, .xoxo > li > a { width: 100%; border-bottom: 1px solid white; }
}

#hoofdmenu > li > a:hover, .xoxo > li > a:hover {
 background-color: #003366;
 }
 
 
#hoofdmenu > li:hover ul, .xoxo > li:hover ul, .xoxo li#nav_menu-2:hover ul {
 display: block;
 position: absolute;
 top: -1px;
 left: 103.5%;
 z-index: 2;
 border-left: 0.2em solid white;
}

@media screen and (max-width: 800px) {
	#hoofdmenu > li:hover ul, .xoxo > li:hover ul, .xoxo li#nav_menu-2:hover ul { position: absolute; left: 20%; }
}

.submenu > ul, .widget-container > ul, #nav_menu-2 ul {
 display: none;
 z-index: 3 !important;
}

.submenu > ul > li > a, .widget-container > ul > li > a, #menu-website li a, .blogroll li a {
 display: block;
 width: 13em;
 background-color: #003366;
 color: white;
 padding: 0.5em 0 0.5em 0.5em;
 text-decoration: none;
 border-top: 1px solid white;
}

@media screen and (max-width: 800px) 	{ 
	.submenu > ul > li > a, .widget-container > ul > li > a, #menu-website li a, .blogroll li a { min-width: 92%; }
	}

.submenu > ul > li > a:hover, .widget-container > ul > li > a:hover, #menu-website li a:hover {
 background-color: firebrick;
}

.shop > a {
    background-color: #003366!important;
}


#menu label {
	font-weight: bold;
	color: #b22222;
	margin-bottom: 0.8em;
}

.menucat, .widget-title {
display: block;
background-color: #347c2c;
width: 100%;
padding: 0.5em 0 0.5em 0.5em;
margin: 0 0 0.4em 0;
text-align: left;
font-size: 1em;
color: whitesmoke;
font-weight: normal;
}	


#menu_onder {
margin: 0 0 0.5em 0;
}

@media screen and (max-width: 800px) 	{ 
	#menu_onder p { padding-left: 0.5em; }
}

p.cat {
display: block;
width: 101%;
background-color: #003366;
padding: 0.5em 0 0.5em 0.5em;
text-align: left;
font-size: 0.9em;
font-weight: normal;
color: white !important;
}

#menu_onder p a {
padding: 0.1em 0.1em 0.5em 0;
font-size: 0.8em;
color: #003366;
font-weight: normal;
text-decoration: none;
}

#hoofdvak {
 width: 79%;
 min-height: 600px;
 float: left;
 border-left: 2px solid lightslategray;
 margin-top: 2em;
 margin-bottom: 2em;
 padding-left: 1%;
}

#hoofdvak:before, hoofdvak:after {
  content: "";
  display: table;
  clear: both;
}  

@media screen and (max-width: 800px) 	{ 
	#hoofdvak { width: 90%; padding: 0 6% 0 4%; border-left: 0; }
}

.menumobiel {
	display: none;
}

#hoofdvak p, .entry-meta, .entry-utility {
	line-height: 140%;
	font-size: 0.9em;
	margin-bottom: 1em;
	color: #2f4f4f;
}

#hoofdvak .entry-content {
	line-height: 140%;
	font-size: 1em;
	margin-bottom: 1em;
	color: #2f4f4f;
}

#hoofdvak ol, ul {
	line-height: 140%;
	font-size: 0.9em;
	margin-bottom: 18px;
	margin-left: 18px;
	color: #2f4f4f;
}

#hoofdvak ol li ul {
	line-height: 1.4em;
	font-size: 1em;
	margin-bottom: 1em;
	margin-left: 1em;
	color: #2f4f4f;
}

#hoofdvak li {
	margin-bottom: 0.8em;
}

#hoofdvak h1 {
	font-size: 1em;
	font-weight: bold;
	margin: 0 0 0.8em 0;
	color: #b22222; /* #810541 */
}

#hoofdvak h2 {
	color: #b22222;
    letter-spacing: -0.01em;	
	font-weight: bold;
	font-size: 0.9em;
	margin: 0.8em 0 0.3em 0;
}

#hoofdvak h3 { 
	font-weight: bold;
	font-size: 0.8em;
	color: #5b5b5b;
	letter-spacing: -0.01em;
	line-height: 120%;
	padding-top: 8px;
	margin: 0; 
}		

#hoofdvak h4 {
	margin: 0;
	color: #153E7E;
	font-size: 0.8em;
	padding-top:5px;
	padding-bottom:5px;
	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #ffffff;
}

#hoofdvak h5 {
    color: #003366;
    font-weight: bold;
    font-size: 0.85em;
    padding-bottom: 0.5em;
}

.mini-inhoud {
    width: 300px;
    max-width: 40%;
    float: right;
    border-radius: 0px 15px 0px 15px;
    border-top: 3px solid #003366;
    border-bottom: 3px solid #003366;
    box-shadow: 2px 2px 6px -2px #000;
    -webkit-box-shadow: 2px 2px 6px -2px #000;
    -moz-box-shadow: 2px 2px 6px -2px #000;
    background-color: gainsboro;
    padding: 0.5em;
    margin: 1em 0 1em 1em;
}

.mini-inhoud ol, .mini-inhoud ol li {
    font-size: 0.8em;
    color: blue;
    margin-bottom: 0.3em!important;
    line-height: 140%!important;
}

.suggesties {
    width: 300px;
    max-width: 40%;
    float: right;
    border-radius: 0px 15px 0px 15px;
    border-top: 3px solid #003366;
    border-bottom: 3px solid #003366;
    box-shadow: 2px 2px 6px -2px #000;
    -webkit-box-shadow: 2px 2px 6px -2px #000;
    -moz-box-shadow: 2px 2px 6px -2px #000;
    background-color: gainsboro;
    padding: 0.5em;
    margin: 1em 0 1em 1em;
}

.suggesties ul, .suggesties ul li {
    font-size: 0.85em;
    margin-bottom: 0.3em!important;
    line-height: 140%!important;
}


#hoofdvak table {
	line-height: 140%;
	font-size: 0.9em;
	margin-bottom: 18px;
	color: #2f4f4f;
}

ul.video { line-height: 130%; font-size: 0.8em; }
.video > li { margin-bottom: 0.6em; }


#video {
display: block;
width: 720px;
max-width: 98%;
margin: 4% auto;
padding: 0.2em;
border: 1px solid darkgray;
}

.videocontainer {
display: block; 
position: relative; 
padding-bottom: 62.5%; 
height: 0; 
border: 1px solid darkgray; 
}

#video h1 {
font-size: 0.9em;
font-weight: bold;
margin: 0.4em 0 0.8em 0;
color: #b22222; /* #810541 */
}

#video-onderschrift {
display: block;
width: 720px;
max-width: 98%;
margin: -1em auto 0 auto;
padding: 0 0.2em 0 0.2em;
}

#video-onderschrift > a {
display: block;
width: 250px;
float: right;
font-size: 0.8em;
text-decoration: none;
text-align: right;
}

#video-onderschrift > a:hover {
color: firebrick;
}

#gerelateerd {
display: block;
width: 400px;
max-width: 98%;
margin: 1em 0 0 0;
padding: 0.8em 0.2em 0.5em 0.2em;
font-size: 0.8em;
}

#gerelateerd h1 {
color: firebrick; 
font-size: 1.05em;
text-align: left;
}

#gerelateerd ul {
text-align: left;
}

#broncode {
display: block;
width: 100%;
max-width: 720px;
margin: 1em auto 1em auto;
padding: 0 0.2em;
font-size: 0.8em;
}

#broncode h1 {
color: firebrick; 
font-size: 1.2em;
text-align: left;
}

#broncode div { 
width: 100%;
height: 175px;
overflow: scroll;
font-family: courier; 
font-size: 1em; 
color: #006600; 
padding: 0.5em; 
border: 1px solid darkgray;
}

a#player {
display:block;
width:720px;
height: 450px;
}

.subtitel { 
	font-style: italic; 
	font-size: 0.8em;
	margin-top: 0.4em;
	color: #003366;
}

.nadruk {
	color: #b22222;
	font-weight: bold;
}

.verder  {
	color: #b22222;
	font-weight: bold;
	font-size: 0.75em;
	text-align: right;
	margin-bottom: 8px;
}

.bijschrift {
font-size: 0.75em;
font-weight: bold;
color: blue;
display: block;
line-height: 150%;
margin-bottom:10px;
text-align: center;
}


.center  {
	text-align: center;
}

.gg  { 
	float: right;
	margin: 0 0 0.8em 0.8em;
	}

.code { 
	font-family: courier;
}

.coderood { 
	font-family: courier;
	color: #b22222;
	font-weight: bold; 
}		

.hr {
	width: 60%;
	height: 0.5em;
	background-image: url(http://www.mijn-eigen-website.nl/images/hr.gif);
	margin: 0.9em auto 1.2em auto;
	background-repeat: no-repeat;
}

.cursor
{
    cursor: url(http://www.mijn-eigen-website.nl/images/nat1021.cur);
}			

kbd {
	font-family: courier;
	font-size: 1.2em;
}

#zoekmob {
	display: none;
}

@media screen and (max-width: 800px) 	{ 
	#zoekmob { display: block; }
}
 
#hoofdvak form {
	line-height: 1.4em;
	font-size: 0.8em;
	margin-bottom: 1.1em;
}

#hoofdvak form  label {
	line-height: 1.4em;
	font-size: 0.8em;
	margin-bottom: 18px;
}

#hoofdvak form  p {
	line-height: 1.4em;
	font-size: 0.8em;
	color: #df0101;
	margin-bottom: 1.2em;
}

#hoofdvak form input,textarea {
	margin: 0.5em 0 0.tem 0;
}

.invulveld { 
 font-family: "Courier New", Courier, monospace;
 font-size: 1em;
 color: #0404b4;
 }
 
#media   {
    margin-top: 1.8em;
	margin-bottom: 0.9em;
}
			
#voet {
 clear: both;
 background-color: dimgray;
 margin: 0 auto 2em auto;
 padding-top: 2em;
 padding-right: 0.5em;
 padding-bottom: 2.5em;
 color: #848484;
 font-size: 0.8em;
 text-align: center;
 line-height: 1.5em;
 color: white;
}
	
#voet a {
	color: white;
	text-decoration: none;
}

.clearfix:before, .clearfix:after {
  content: "";
  display: table;
  clear: both;
}  

.adv-vierkant {
border: 1px solid #909090; border-radius: 10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; -o-border-radius: 10px; box-shadow: 5px 5px 5px #505050; -webkit-box-shadow: 5px 5px 5px #505050; -moz-box-shadow: 5px 5px 5px #505050; -o-box-shadow: 5px 5px 5px #505050; padding: 0.4em 0.8em 0.8em 0.8em; width: 40%; max-width: 96%; float: right; margin: 0 0 0.5em 0.5em;
}

.adv-vierkant h1 {
color: #347C2C; font-family: helvetica, sans-serif; font-size: 1.1em; font-weight: bold;
}

.adv-vierkant p {
font-family: trebuchet, sans-serif; color: #505050 !important; font-size: 0.90em; padding: 0; margin: 0;
}

.adv-vierkant ul {
list-style-image: url('http://www.mijn-eigen-website.nl/afb/groenvierkantje.jpg'); font-family: trebuchet, sans-serif; color: #505050; font-size: 0.85em; margin: 0.8em 0.5em 1em 0; position: relative; left: 2em;
}

.adv-vierkant ul li { margin: 0.2em 0; padding: 0; }

.downloadbutton { 
	border: 1px solid dimgrey; 
	-webkit-border-radius: 10px; border-radius: 10px; 
	-webkit-background-clip: padding-box; background-clip: padding-box;
	background: #347c2c;
	padding: 5px 16px 4px 16px; 
	font-family: arial, sans-serif; 
	font-size: .8em; 
	font-weight: normal; 
	color: white; 
	cursor: pointer; 
	}
.downloadbutton:before { 
	font-family: WebSymbolsRegular; 
	content: 'X'; 
	color: white; 
	font-size: 1.5em; 
	float: left; 
	margin: -4px 8px -2px -12px;
	}
.downloadbutton:hover {
	border: 1px solid firebrick;
	background: firebrick;
	}

/* wp-opmaak */

.qa { 
	color: #b22222;
    font-weight: bold; 
}		

.vraag { 
	color: #153E7E; 
}		
			 
.vraag a:link  { 
	text-decoration: none; color: #2f4f4f;
}	
			 
.vraag a:visited  { 
	text-decoration: none; color: #2f4f4f;
}	

.vraag a:hover  { 
	font-weight: bold; color: #b22222; 
}	 

.antwoord { 
	font-size: 80%; 
	padding: 0.8em 0 0 1.2em; 
	color: #2f4f4f;
}

h3.storytitle {
	padding-top: 1.1em;
	padding-bottom: 0.5em;
	font-size: 0.9em !important;
}

.navigation {
width: 184px;
padding-left: 6px;
padding-right:6px;
margin-bottom: 16px;
}

.navigationbtm {
width: 196px;
height:8px;
margin-top:-5px;
}

.meta {
	font-size: 75%;
	padding-bottom: 8px;
}

.meta li, ul.post-meta li {
	display: inline;
}

.meta ul {
	display: inline;
	list-style: none;
	margin: 0;
	padding: 0;
}

.meta, .meta a {
	color: #808080;
	font-weight: normal;
	letter-spacing: 0;
}

.meerberichten {
font-size: 75%;
margin-bottom: 8px;
}

.linkcat, .categories {
	font-weight: bold;
	color: white;
	background-color: #347c2c
}

.linkcat ul, .categories ul { 
background-color: white;
list-style-type: square !important;
}

.categories li { font-size: 0.85em;}

.linkcat ul a, .categories ul a { 
text-decoration: none;
color: #404040;
font-weight: normal;
padding: 0.2em 0;
}

.footer a  { 
	color: #153E7E; 
	text-decoration: none;
}

.form-allowed-tags, .logged-in-as {
color: firebrick;
font-size: 0.8em;
}

.meta-prep, .entry-date {
font-size: 0.8em;
}

h2.storytitle {
font-size: 0.95em !important; 
}

h2.entry-title {
padding-top: 2em;
}

h2.entry-title > a {
font-size: 1.1em;
color: firebrick;
}

h3#comments-title, h3#reply-title {
padding-bottom: 1.8em;
color: firebrick;
}

#respond > form > p {
font-size: 1em;
color: #2f4f4f;
}

#respond label {
font-size: 1.8em;
color: firebrick;
}

#respond code {
font-size: 1.2em;
}

.commentmetadata > a {
font-size: 0.8em;
}

h1.page-title {
color: #003366 !important;
}

h1.entry-title {
font-size: 1.2em !important;

	
#nav-below a { font-size: 0.8em; }
/* einde wp-opmaak */

/* opmaak nieuwsbrief */

span.required {
	line-height: 140%;
	font-size: 0.8em;
	color: #2f4f4f;
}

div.error {
padding-bottom: 1.1em;
}

li.list {
	line-height: 140%;
	font-size: 1em;
	margin-bottom: 1em;
	color: #2f4f4f;
}

table div.required {
	font-size: 1.15em;
	color: firebrick;
}

p.information {
	line-height: 140%;
	font-size: 1.2em;
	margin-bottom: 1em;
	color: #2f4f4f;
}

/* opmaak nieuwsbrief */


/* onduidelijke waarvoor dit is */

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }

.loginform {
font: 16px normal verdana, arial, sans-serif;
font: normal 12px verdana, arial, sans-serif;
padding: 3px;
border: none;
color: darkslategray;
}

.loginform #txtbox {
font: bold 16px verdana, arial, sans-serif;
color: #810541;
}

.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */
}

.button {
 list-style-type: none; 
 margin-left: 0;
}

.button li { 
 float: left;
 position: relative;
 }
 
.button li a, .button li a:link {
display: block;
width: 130px;
color: #ffffff;
background-color: #347C2C;
padding: 3px 0 4px 0;
border: 1px solid blue;
font-weight: bold;
font-size: 12px;
text-align: center;
text-decoration: none;
margin: 4px 4px 4px 4px;
}

.button li a:hover {
background-color: #810541;
}