/* cascading style sheet checkdigit.nl by Corné Klijs*/

body						{ /*overflow: hidden;*/ background-color:#000; margin: 0 auto; text-align: center; padding: 0; font-family: Arial, "Arial Unicode MS", "Arial Rounded MT Bold", "Helvetica" }
table td, table th	{ padding: 0}

div.preload 			{ position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index:100; background-color:#C0C0C0}
P.loading	   		{ color: #333; font-size: 14px; text-align:center }
img.load					{ border-width: 0; width: 32px; height:32px }	

TABLE.main 			{ border-collapse: collapse; border: 0px none ;width: 100%; height: 100%}
.cell_m 					{	background: #000; width: 100%}
.cell_mm				{	background: #000; width: 100%; height: 100%; vertical-align: top}

TABLE.top   			{ border: 0px none ; width: 100%; height: 100%}

A:link						{ color: #393; /*font-weight: bold; */text-decoration: none}
A:visited					{ color: #393; text-decoration: none}
A:active					{ color: #C0C0C0; text-decoration: none}
A:hover 					{ color: #C0C0C0; text-decoration: none}

H1							{ margin: 40px 20px 0 20px; font-size: 1.5em; text-align: left; color:#808080; font-weight: lighter } H1::first-letter { color: #393}
H2, P						{ margin: 5px 20px 0 40px; font-size: 0.9em; text-align: left; color:#808080; font-weight: lighter } H2::first-letter { color: #393} P::first-letter { color: #393}
H3							{ margin: 5px 10px 0 10px; font-size: 0.9em; text-align: center; color:#808080; font-weight: lighter } H3::first-letter { color: #393}

P.vaandel				{ font-size: 32px; font-weight: bold; color: #FFF; margin: 0 0 0 0; text-align: center} P.vaandel::first-letter { color: #393} 
.small	   		    	{ color: #FFF; font-size: 20px; text-align: center }
.foodnote	 			{ color: #FFF; font-size: 14px; text-align: center}
.mac						{ color: #FFF; font-size:30px; cursor:pointer}
P.mailx					{ margin: 0 20px 0 40px ; font-size: 16px; text-align: left; color:#F00 } P.mailx::first-letter { color: #F00}
.fillR							{ font-size: 16px; text-align: center; color:#F30; margin-top :0px}	
.fillG							{ font-size: 16px; text-align: center; color:#3C3; margin-top :0px}	
.imgok 					{ width: 16px ; height: 16px; border: 0; margin-top : 5px}	
.imgwr 					{ width: 13px ; height: 16px; border: 0; margin-top : 5px}
.imgban 					{ width: 95vw ; border: 0}
P.note					{ margin: -20px 20px -10px 20px ; font-size: 10px; text-align: center; color:#808080; vertical-align: bottom}
P.banner				{ margin: 0 0 0 0; font-size: 14px; text-align: right; color:#808080; font-weight: lighter; background-color:#FFF} P::first-letter { color: #393}

img.fotolsmin		{ border: 0.3vw solid #DDD; border-radius: 0.6vw; background-color: #FFF; padding: 0.6vw; width: 26vw; height: 17.3vw; margin-top: 5vw}
img.fotoptmin		{ border: 0.3vw solid #DDD; border-radius: 0.6vw; background-color: #FFF; padding: 0.6vw; width: 17.3vw; height: 26vw; margin-top: 0.6vw}

#Gordijn				{}
div.site      			{ position: relative; float: left; margin: 0px auto; padding: 0 0; width: 100%; height: 100%; background-color:#FFF}
div.vaandel			{ position: fixed; width: 100%; height: 40px; background-color:#333; right:0px; top:0px; z-index: 100}
div.small					{ display: none}

div.footnote			{ position: fixed; bottom: 0px; text-align : center; width: 100%; background-color:#333; z-index: 100}
div.phone				{ display: none}

div.buttons			{ display: none}
div.small					{ display: none}
div.balk					{ display: none} 
div.showbottom	{ display: none}
div.ie						{ display: none}
div.showmob		{ display: none}
div.small					{ display: none}
div.menu 				{}
div.mac					{ position: fixed; right: 5px; top:0px}
div.front					{ float: left; position: relative; overflow: visible; top: 0px; width:100%; height: auto; z-index: 50; background-color:#FFF}
div.front2				{ float: left; position: relative; top: 40px; width:100%; height: auto; z-index: 50; background-color:#FFF}
div.fronta				{ float: left; position: relative; width:100%; height: auto; z-index: 50; background-color:#FFF}
div.frontb				{ float: left; position: relative; margin: 3vw 0 0 4.5vw; width:90vw; z-index: 50; background-color:#BBB; text-align: center}
div.contchk1			{ float: left; position: relative; margin: 3vw 0 0 4vw; width:90vw; background-color:#F0FFF0; border-style: solid; border-radius: 3px; border-width: 3px; border-color: #393; text-align: center}
div.input2				{ margin-top: 2px; position: relative; float: left; width : 90vw; height: 24px; border-style: solid; border-width: 0px; border-color: #000; background-color: #F0FFF0}
div.output2			{ margin-top: 2px; position: relative; float : left; width : 90vw; height: 24px; border-style: solid; border-width : 0px; border-color : #000; background-color:#F8F8F8}
div.pictview			{ float: left; position: relative; width: 30vw; height: 30vw; z-index: 50; background-color:#FFF; text-align: center }
div.view					{ float: left; position: relative; width: 29vw; height: 29vw; margin: 0.5vw; z-index: 50; background-color:#EEE}

.toets						{ font-family: Arial, "Arial Unicode MS", "Arial Rounded MT Bold", "Helvetica"}
.toets						{ display: inline-block; border: 3px solid #393; color: #666; border-radius: 3px; padding: 0px 0px; text-align: center; text-decoration: none; background-color: white;  width: 90px; height: 28px; font-size: 16px; margin: 0px 0px; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; cursor: pointer; box-shadow: 0px 5px 15px 0px #666}

.toets2					{ font-family: Arial, "Arial Unicode MS", "Arial Rounded MT Bold", "Helvetica"}
.toets2					{ display: inline-block; border: 3px solid #393; color: #666; border-radius: 3px; padding: 0px 0px; text-align: center; text-decoration: none; background-color: white; height: 28px; font-size: 16px; margin: 6px 0 6px 0; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; cursor: pointer; box-shadow: 0px 5px 15px 0px #666}

input[type=text] {width: 80vw; box-sizing: border-box; border:1px inset #393; font-size: 16px; background-color: #f8f8f8; color: #393; padding: 4px 20px 4px 10px; transition: width 0.4s ease-in-out}

textarea {width: 80vw;height: 150px; padding: 12px 20px; box-sizing: border-box; border:1px inset #393; font-size: 16px; background-color: #f8f8f8; color: #393; resize: none}

@media only screen and (min-width: 480px) and (max-width: 820px) and (orientation: landscape){

.toets2					{ width: 40vw}

.imgban 					{ width: 50vw ; border: 0}
img.techr 				{ float: right; margin-left: 5px; margin-right: 30px; width: 30vw ;border: 1px solid #DDD; border-radius:4px; padding: 3px 5px; box-shadow: 0px 5px 15px 0px #666}
div.banner				{ float: left; position: relative; margin: 3vw 0 5vw 1vw; text-align: center; width: 98vw; background-color:#000}

input.invoer			{ width: 30vw; height: 24px; font-size:16px; color: #393; padding: 0px 10px 0px 10px}

/* gordijn menu */
.menu 					{ height: 0%; width: 100%; position: fixed; z-index: 1; top: 0px; left: 0; background-color: #333; overflow-y: hidden; transition: 0.5s}
.menu-content		{ position: relative; top: 10%; width: 100%; text-align: center; margin-top: 15px}
.menu a 				{ padding: 8px; text-decoration: none; font-size: 20px; color: #FFF; display: block; transition: 0.3s }
.menu a:hover, .overlay a:focus { color: #393 }
.menu .closebtn	{ position: absolute; top: 0px; right: 15px; font-size: 40px}

}

@media only screen and (min-width: 320px) and (max-width: 481px) and (orientation: portrait) {

.toets2					{ width: 70vw}

.imgban 					{ width: 95vw ; border: 0}
img.techr 				{ position: relative; margin-left: 5vw; width: 88vw ; border: 1vw solid #FFF; border-radius:1vw; padding: 1vw 1vw; box-shadow: 0px 1vw 3vw 0px #666}
div.banner				{ float: left; position: relative; margin: 3vw 0 11vw 2.5vw; text-align: center; width: 95vw; background-color:#000}


input.invoer			{ width: 45vw; height: 24px; font-size:16px; color: #393; padding: 0px 10px 0px 10px}

/* gordijn menu */
.menu 					{ height: 0%; width: 100%; position: fixed; z-index: 1; top: 40px; left: 0; background-color: #333; overflow-y: hidden; transition: 0.5s}
.menu-content		{ position: relative; top: 15%; width: 100%; text-align: center; margin-top: 10px}
.menu a 				{ padding: 8px; text-decoration: none; font-size: 20px; color: #FFF; display: block; transition: 0.3s}
.menu a:hover, .overlay a:focus { color: #393}
.menu .closebtn	{ position: absolute; top: 10px; right: 25px; font-size: 40px}

}

/* cascading style sheet checkdigit.nl by Corné Klijs*/