html {
overflow-x:hidden;
}

body {
/** BEPAAL FONT IN CMS SETTINGS **/
font-size:13px;
color:#000000;
font-weight:normal;
line-height:1.2;
margin:0;
background-color:#fff;
}

#bg {
position:fixed;
top:0;
bottom:0;
left:0;
right:0;
width:auto;
height:auto;
margin:0;
padding:0;
background-image:url('../graphics/bg.jpg');
background-repeat: repeat-x;
background-size:100% 100%;
z-index:0;
}

h1 {
color:#000000;
font-size:1.1em;
font-weight:bold;
text-transform:uppercase;
margin:0 0 0.5em 0;
}

h2 {
color:#000000;
font-size:1em;
font-weight:bold;
margin:0 0 0 0;
}

h3 {
color:#000000;
font-size:1em;
font-weight:normal;
margin:0 0 0.5em 0;
}

h4 {
color:#000000;
font-size:1em;
font-weight:normal;
margin:0 0 0.5em 0;
}

h5 {
color:#000000;
font-size:1em;
font-weight:normal;
margin:0 0 0.5em 0;
}

a:link {
color:#3875CE;
text-decoration:none;
}
a:visited {
color:#3875CE;
text-decoration:none;
}
a:active {
color:#3875CE;
text-decoration:none;
}
a:hover {
color:#3875CE;
text-decoration:underline;
}

p {
margin:0;
}

b,strong {
font-weight:bold;
}

i {
font-style:italic;
}

hr {
width:100%;
height:1px;
background-color:#f36f3d;
margin:1em 0 0 0;
border:none;
clear:both;
}

.alert {
color:#ea8c8f;
}

/**
#site {
position:relative;
width:1000px;
height:auto;
text-align:left;
margin:0 auto 0 auto;
padding:0 0 6em 0;
z-index:1;
}
**/

#site {
position:absolute;
top:50%;
left:50%;
width:1000px;
height:680px;
margin:-340px 0 0 -500px;
text-align:left;
}
/* Mobiel [landscape] */
@media only screen and (max-device-width: 736px) and (orientation: landscape) {
	#site {
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:auto;
	text-align:left;
	margin:0;
	}
}
/* Tablet [portrait] Mobiel [landscape]*/
@media only screen and (min-device-width: 738px)  and (max-device-width: 1000px) and (orientation: portrait) {
	#site {
	position:relative;
	top:0;
	left:0.7%;
	width:98%;
	height:auto;
	text-align:left;
	margin:10% 0 0 0;
	}
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	#site {
	position:relative;
	top:0;
	left:0;
	width:100%;
	height:auto;
	text-align:left;
	margin:0;
	}
}

#navbox {
position:relative;
width:20%;
height:624px;
font-size:1em;
color:#000000;
line-height:1.5;
text-align:left;
background-color:#fff;
box-shadow:5px 5px 5px 0 rgba(0,0,0,0.6);
padding:3em 2% 0 2%;
margin:0.6em 1% 0 0;
float:left;
z-index:2;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	#navbox {
	position:fixed;
	top:0;
	bottom:2%;
	left:0.5%;
	width:20%;
	height:auto;
	font-size:0.9em;
	line-height:1.2;
	padding:0.5em 2% 0 2%;
	margin:0.6em 1% 0 0;
	}
}

#nav {
width:auto;
height:auto;
min-height:300px;
text-align:center;
list-style-type:none;
margin:0;
padding:0.5em 0 0.5em 0;
clear:both;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	#nav {
	min-height:0;
	}
}
#nav li {
width:auto;
height:auto;
margin:0 0 0.2em 0;
}
#nav .li-on {
border:1px solid #f36f3d;
}
#nav a {
font-size:1em;
color:#000000;
border:1px solid #fff;
padding:0.5em 0.1% 0.5em 0.1%;
display:block;
}
#nav a:link {
color:#000000;
text-decoration:none;
}
#nav a:active {
color:#000000;
text-decoration:none;
}
#nav a:visited {
color:#000000;
text-decoration:none;
}

#nav a:last-child {
margin-bottom:0;
}
#nav a.on {
color:#000;
}
#nav a:hover {
color:#fff;
text-decoration:none;
background-color:#f36f3d;
border:1px solid #f36f3d;
}

#nav-formulier {
width:auto;
height:auto;
text-align:center;
list-style-type:none;
margin:1em 0 0 0;
padding:0.5em 0 0.5em 0;
clear:both;
}
#nav-formulier li {
width:auto;
height:auto;
margin:0 0 0.2em 0;
}
#nav-formulier .li-on {
border:1px solid #f36f3d;
}
#nav-formulier a {
font-size:1em;
color:#fff;
background-color:#f36f3d;
border:1px solid #f36f3d;
padding:0.5em 0.1% 0.5em 0.1%;
display:block;
}
#nav-formulier a:link {
color:#fff;
text-decoration:none;
}
#nav-formulier a:active {
color:#fff;
text-decoration:none;
}
#nav-formulier a:visited {
color:#fff;
text-decoration:none;
}
#nav-formulier a:last-child {
margin-bottom:0;
}
#nav-formulier a.on {
color:#fff;
border:1px solid #f36f3d;
}
#nav-formulier a:hover {
color:#000;
text-decoration:none;
background-color:#fff;
border:1px solid #f36f3d;
}

#subnav {
width:auto;
height:auto;
text-align:center;
list-style-type:none;
padding:0;
margin:0;
}
#subnav li {
margin:0;
float:none;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	#subnav li {
	font-size:0.9em;
	overflow:hidden;
	}
}
#subnav a {
font-size:1em;
color:#000000;
padding:0.5em 1em 0.5em 1em;
background-color:rgba(243,111,61,0.15);
border:1px solid #fff;
display:block;
}
#subnav a:link {
color:#000000;
text-decoration:none;
}
#subnav a:active {
color:#000000;
text-decoration:none;
}
#subnav a:visited {
color:#000000;
text-decoration:none;
}
#subnav a:hover {
color:#fff;
text-decoration:none;
background-color:#f36f3d;
border:1px solid #f36f3d;
}
#subnav a.on {
color:#fff;
background-color:#f36f3d;
border:1px solid #f36f3d;
}
#subnav li:last-child {
margin-bottom:0;
}

#taalkeuze {
width:auto;
height:auto;
padding:0.5em 0 0.5em 0;
margin:0;
float:right;
}
#taalkeuze a {
font-size:1em;
color:#000000;
text-align:left;
padding:0.5em 2% 0.5em 2%;
margin:0 1% 0 0;
display:block;
float:left;
}
#taalkeuze a:link {
color:#000000;
text-decoration:none;
}
#taalkeuze a:active {
color:#000000;
text-decoration:none;
}
#taalkeuze a:visited {
color:#000000;
text-decoration:none;
}
#taalkeuze a:hover {
color:#ffffff;
text-decoration:none;
background-color:#f36f3d;
}
#taalkeuze a:last-child {
margin:0;
}

#nav-footer {
position:absolute;
bottom:0.2em;
width:auto;
height:auto;
margin:0;
}
#nav-footer a {
margin:0 7% 0.6em 0;
display:block;
float:left;
}
#nav-footer img {
width:auto;
height:30px;
border:none;
}
#nav-footer p {
font-size:0.8em;
margin:0 0 0.5em 0;
clear:both;
}

#content {
position:relative;
width:50%;
height:671px;
margin:0 1% 0 0;
background-color:#fff;
box-shadow:5px 5px 5px 0 rgba(0,0,0,0.6);
float:left;
}
#content img {
max-width:100%;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	#content {
	position:fixed;
	top:0;
	bottom:2%;
	left:26%;
	width:72%;
	height:auto;
	margin:0;
	}
}

.logo {
width:80%;
height:auto;
font-size:1.2em;
margin:1em auto 0 auto;
display:block;
float:none;
clear:both;
}
.logo img {
width:100%;
height:auto;
border:none;
float:none;
}

.tekst {
width:80%;
height:27em;
font-size:1em;
text-align:justify;
padding:1em 4% 1em 0;
margin:0 0 0 10%;
overflow:auto;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	.tekst {
	font-size:0.8em;
	height:23em;
	}
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 430px) and (orientation: portrait) {
	.tekst {
	height:18em;
	}
}
.tekst img {
max-width:100%;
margin:0 1% 0.3em 1%;
}
.tekst-startpagina {
height:19em;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	.tekst-startpagina {
	height:17em;
	}
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 430px) and (orientation: portrait) {
	.tekst-startpagina {
	height:14em;
	}
}
.tekst-nieuws, .tekst-formulier, .tekst-contact {
height:40em;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	.tekst-nieuws, .tekst-contact {
	height:43em;
	}
	.tekst-formulier {
	height:auto;
	}
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 430px) and (orientation: portrait) {
	.tekst-nieuws, .tekst-contact {
	height:35em;
	}
}

#slideshow {
width:80%;
height:160px;
margin:0.7em auto 0.7em auto;
padding:0;
border-top:1px solid #f36f3d;
border-bottom:1px solid #f36f3d;
}

#berichten {
position:relative;
width:18%;
height:658px;
margin:0;
padding:0 3% 1em 3%;
background-color:#fff;
box-shadow:5px 5px 5px 0 rgba(0,0,0,0.6);
overflow-y:auto;
float:left;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) and (orientation: portrait) {
	#berichten {
	display:none;
	}
}
#berichten h1 {
color:#000;
font-size:0.9em;
font-weight:bold;
text-align:center;
text-transform:uppercase;
margin:1em 0 0.5em 0;
}
#berichten .berichtkop {
width:100%;
height:auto;
clear:both;
padding:0.5em 0 0.2em 0;
margin:0 auto 1em auto;
border-top:1px solid #f36f3d;
border-bottom:1px solid #f36f3d;
display:block;
}
#berichten .berichtkop h1 {
color:#000;
font-size:0.9em;
font-weight:bold;
text-align:center;
text-transform:none;
margin:0;
}
#berichten .berichtkop h5 {
color:#000;
font-size:0.8em;
font-weight:normal;
font-style:italic;
text-align:center;
margin:0 0 0.2em 0;
}
#berichten .berichtkop img {
width:auto;
height:auto;
max-width:100%;
margin:0 0 0.3em 0;
float:left;
}

#cookiesmelding {
width:50%;
height:auto;
font-size:2em;
color:#000;
text-align:center;
padding:0.5em 2% 0.5em 2%;
background: rgba(255, 255, 255, 0.5);
border:1px solid #000;
margin:0 auto 0 auto;
display:block;
}


/* Tekstpagina contact-formulier */
#contactform {
width:80%;
height:auto;
margin:0;
clear:both;
}
#contactform .veld {
width:100%;
height:auto;
clear:both;
}
#contactform .veldtekst {
width:25%;
height:auto;
text-align:right;
white-space:nowrap;
padding:4px 2px 3px 0;
vertical-align:top;
float:left;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) {
	#contactform .veldtekst {
	width:auto;
	text-align:left;
	float:none;
	}
}
#contactform .veldinput {
width:70%;
height:auto;
white-space:nowrap;
padding:1px 0 3px 0;
vertical-align:middle;
float:left;
}
/* Mobiel [portrait] */
@media only screen and (max-device-width: 736px) {
	#contactform .veldinput { width:100%; }
}
#contactform  .alertborder {
border:1px solid #ea8c8f;
}
#contactform input, textarea {
max-width:80%;
font-size:1em;
padding:3px;
border:1px solid #000;
}
#contactform .knop {
width:auto;
height:30px;
font-weight:normal;
letter-spacing:1px;
text-shadow:0 0 10px #ffffff;
text-transform:uppercase;
background-color:#ffffff;
border:solid 1px #000;
border-radius:5px;
margin:0;
padding:5px 16px 4px 16px;
}
#contactform .knop:hover {
font-weight:bold;
background-color:#eeeeee;
border:solid 1px #CC3300;
border-radius:5px;
box-shadow:0 0 10px #CC3300;
cursor:pointer;
}

