*, *::before, *::after { box-sizing:border-box; }
*:hover { transition:all 0.3s ease 0s; }

@keyframes fadeInOpacity {
	0% { opacity:0; }
	100% { opacity:1; }
}

@media only print {
	img { display:none !important; }
}

html {
font-size:16px;
overflow-x:hidden;
scroll-behavior:smooth;
}

body {
/** BEPAAL SITEFONT IN CMS SETTINGS **/
color:rgba(0,0,0,0.8);
font-weight:400;
line-height:1;
margin:0;
}
@media only screen and (max-width:900px) {
	body { font-size:1em; }
}

/* SITEWIDTH zie style index.php */
.sitewidth {
margin:0 auto;
}
@media only screen and (max-width:900px) { 
	.sitewidth { width:100%; }
}

main {
width:100%;
height:auto;
}
@media only screen and (max-width:900px) {
	main {
	margin-bottom:-12px;
	}
}

/* anchor link offset */
main:target:before {
content:"";
display:block;
height:100px;
margin:-100px 0 0;
}

.pagtop {
width:100%;
height:auto;
padding:0;
margin:0;
background-color:rgba(255,255,255,1);
display:flex;
flex-flow:row wrap;
}

h1 {
font-family:'Roboto-Medium', 'Arial', sans-serif;
color:rgba(0,0,0,0.85);
font-size:2.2em;
line-height:1;
font-weight:700;
margin:0;
}
h2 {
font-family:'Roboto-Bold', 'Arial', sans-serif;
color:rgba(0,0,0,0.85);
font-size:1.2em;
line-height:1;
font-weight:700;
margin:0;
}
h3 {
color:rgba(0,0,0,0.85);
font-size:1em;
line-height:1;
font-weight:400;
margin:0;
}
h4 {
color:rgba(0,0,0,0.85);
font-size:1em;
line-height:1;
font-weight:400;
margin:0;
}
h5 {
color:rgba(0,0,0,0.85);
font-size:1em;
line-height:1;
font-weight:400;
margin:0;
}

a {
color:rgba(0,0,0,0.85);
transition:all 0.3s ease 0s;
}
a:link {
color:rgba(0,0,0,0.85);
text-decoration:none;
}
a:visited {
color:rgba(0,0,0,0.85);
text-decoration:none;
}
a:active {
color:rgba(0,0,0,0.85);
text-decoration:none;
}
a:hover {
color:rgba(0,0,0,0.85);
text-decoration:none;
}

p {
font-size:1em;
line-height:1.4;
margin:0;
}

em, b, strong, .strong {
font-family:'Roboto-Bold', 'Arial', sans-serif;
font-weight:700;
}

i {
font-style:italic;
}

sup {
font-size:0.6em;
}

img {
max-width:100%;
border:none;
}

ul {
list-style:none;
list-style-position:inside;
padding:0;
margin:0;
}
li {
line-height:1.5;
padding-left:0.5%; 
}
li:before {
content: "- ";
color:#000;
}

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

blockquote {
font-family:'Roboto-Medium', 'Arial', sans-serif;
font-size:1.1em;
font-weight:700;
text-align:center;
line-height:1.4;
margin:0;
display:block;
}

.bron {
font-family:'Roboto-Medium', 'Arial', sans-serif;
font-size:0.8em;
font-weight:700;
margin-top:16px;
display:block;
}

.wit {
color:#fff;
}
.wit a {
color:#fff;
}
.wit a:link {
color:#fff;
}
.wit a:visited {
color:#fff;
}
.wit a:active {
color:#fff;
}
.wit a:hover {
color:#fff;
}

table {
width:100%;
height:auto;
margin:0;
border-collapse:collapse;
display:block;
}
th {
}
tr {
}
td {
width:auto;
min-width:50px;
height:auto;
font-size:1em;
white-space:nowrap;
padding:5px 2px 5px 2px;
text-align:left;
vertical-align:middle;
border:none;
}
@media only screen and (max-width:900px) {
	td {
	white-space:normal;
	}
}

.clear, .clearbreak {
width:100%;
font-size:0.01em;
line-height:0.01;
clear:both;
}

.mobile, .mobilebreak {
display:none;
}
@media only screen and (max-width:900px) {
	.mobile, .mobilebreak {
	display:block;
	clear:right;
	}
}

.alert, a.alert {
color:#ff6723 !important;
}
.alertborder {
color:#ff6723 !important;
border:1px solid #ff6723 !important;
}

.terug {
text-align:left;
display:block;
}

.pijl {
position:relative;
top:0;
width:auto;
height:auto;
font-size:1em;
line-height:1.2;
text-decoration:none;
vertical-align:middle;
border:none;
background:none;
display:inline-block;
}
.pijlklein {
top:1px;
font-size:0.8em;
}
.pijlmini {
top:1px;
font-size:0.6em;
}

.content {
position:relative;
height:auto;
margin:0 auto;
clear:both;
}
@media only screen and (max-width:900px) {
	.content {
	width:100%;
	margin:0;
	}
}

input[type="text"], input[type="email"], input[type="number"], input[type="password"], textarea {
width:100%;
height:auto;
font-size:1em;
padding:4px 8px;
border:none;
box-sizing:border-box;
}

.search {
position:relative;
width:100%;
height:auto;
display:flex;
}
.search input[type=text] {
width:calc(100% - 40px);
height:auto;
color:rgba(0,0,0,1);
font-size:0.8em;
margin:0 3px 0 auto;
background-color:rgba(234,231,224,1);
display:block;
border:none;
border-radius:4px;
}
.search::placeholder {
font-family:'HelveticaBold', 'Helvetica', 'Arial', sans-serif;
color:#000;
}
.search input[type=submit] {
width:40px;
height:36px;
margin-right:6px;
border:none;
border-radius:4px;
background-image:url('../graphics/search.png');
background-repeat:no-repeat;
background-size:auto 70%;
background-position:center 6px;
background-color:rgba(255,255,255,1);
transition:all 0.3s ease 0s;
}
.search input:focus{
outline:none;
}
.search input[type=submit]:hover {
background-image:url('../graphics/search-on.png');
background-color:rgba(0,0,0,1);
cursor:pointer;
}

.slidesbox, .imgbox, .videobox {
position:relative;
width:100%;
height:auto;
margin:0;
overflow:hidden;
}
@media only screen and (max-width:900px) {
	.introhome .imgbox, .introhome .videobox {
	margin-bottom:0;
	}
	.intropagtop .imgbox, .intropagtop .videobox {
	margin-bottom:16px;
	}
	.element .imgbox, .intropagtop .videobox {
	margin-bottom:0;
	}
}

.imgbox img, .videobox video {
position:relative;
width:100%;
height:auto;
margin:0;
overflow:hidden;
}

.slidesbox .slides {
position:relative;
}
.slidesbox .slides img, .slidesbox .slides video {
position:relative;
width:100%;
height:auto;
object-fit:cover;
display:block;
}

.slidesbox .prev {
position:absolute;
left:0;
right:50%;
top:0;
bottom:0;
width:auto;
height:auto;
z-index:5;
user-select:none;
}
.slidesbox .prev:hover {
cursor:w-resize;
}
.slidesbox .next {
position:absolute;
left:50%;
right:0;
top:0;
bottom:0;
width:auto;
height:auto;
z-index:5;
user-select:none;
}
.slidesbox .next:hover {
cursor:e-resize;
}
.slidesbox .prevnext {
display:none;
}
@media only screen and (pointer:coarse) {
	.slidesbox .prev, .slidesbox .next {
	display:none;
	}
	.slidesbox .prevnext {
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	width:auto;
	height:auto;
	z-index:5;
	user-select:none;
	display:block;
	}
}

.fade {
animation-name:fadeInOpacity;
animation-timing-function:ease-in;
animation-duration:0.5s;
}

.slideinfo {
margin:0 auto;
display:flex;
}
.introhome .slideinfo {
margin-bottom:12px;
}
@media only screen and (max-width:900px) {
	.introhome .slideinfo {
	margin-bottom:12px;
	}
}
.intropagtop .slideinfo {
margin-bottom:36px;
}
.element .slideinfo {
margin-bottom:-20px;
}

.slidecaptions {
width:auto;
height:auto;
font-size:0.7em;
text-align:left;
padding:6px 0 0 48px;
}
@media only screen and (max-width:900px) {
	.slidecaptions {
	width:50%;
	}
}
.slidecaptions_margin {
margin-bottom:24px;
}
@media only screen and (max-width:900px) {
	.slidecaptions_margin {
	margin-bottom:24px;
	}
}
.slidecaptions-25 {
padding:6px 0 0 24px;
}
@media only screen and (max-width:900px) {
	.slidecaptions-25 {
	width:100%;
	}
}
.slidecaptions .show-slidecaption {
display:block;
}


.slidebuttons {
width:auto;
height:auto;
text-align:right;
padding:0;
margin:6px 0 0 auto;
}
@media only screen and (max-width:900px) {
	.slidebuttons {
	width:48%;
	margin:12px 0 0 0;
	}
}
.slidebuttons .dot {
cursor:pointer;
height:12px;
width:12px;
margin:0 6px 0 0;
background-color:rgba(0,0,0,0.3);
border-radius:50%;
display:inline-block;
transition:background-color 0.6s ease;
}
@media only screen and (max-width:900px) {
	.slidebuttons .dot {
	height:8px;
	width:8px;
	}
}
.slidebuttons .active, .dot:hover {
background-color:rgba(0,0,0,1);
}

.button {
position:relative;
width:auto;
max-width:100%;
height:auto;
color:#fff !important;
font-size:1.2em;
text-decoration:none;
text-align:center;
text-transform:uppercase;
white-space:pre-wrap;
letter-spacing:1px;
padding:7px 12px 7px 15px;
margin:0;
background-color:#000;
border:none;
border-radius:6px;
cursor:pointer;
display:block;
float:right;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
}
a.button {
color:#fff;
text-decoration:none;
}
a.button:link {
color:#fff;
text-decoration:none;
}
a.button:active {
color:#fff;
text-decoration:none;
}
a.button:visited {
color:#fff;
text-decoration:none;
}
.button:hover {
color:#fff;
text-decoration:none;
background-color:#ff6723;
}
.buttonklein {
font-size:0.8em;
text-transform:none;
padding:3px 6px 3px 8px;
}
.textbutton {
position:relative;
width:auto;
height:auto;
color:#000;
font-size:1em;
background-color:transparent;
border:none;
margin:0;
transition:all .5s ease 0s;
-webkit-appearance:none;
-moz-appearance:none;
appearance:none;
}
.textbutton:hover {
color:#869F83;
cursor:pointer;
}

.soundbutton {
position:absolute;
bottom:3px;
right:0;
width:2rem;
height:2rem;
background:transparent;
border:none;
background-image:url("../graphics/sound-off.png");
background-position:center;
background-size:2rem 2rem;
background-repeat:no-repeat;
z-index:100;
}
.soundbutton:hover, .soundbutton-on {
background-image:url("../graphics/sound-on.png");
cursor:pointer;
}

.cookiesmelding {
position:relative;
width:96%;
height:auto;
text-align:center;
padding:0.5em 2% 0.7em 2%;
background:rgba(255, 255, 255, 0.8);
display:block;
}

.cmsbalk {
position:fixed;
top:10px;
right:1%;
width:auto;
height:auto;
font-family:Lucida Sans Unicode, Lucida Grande, sans-serif;
font-size:0.8em;
line-height:1.5;
color:#000;
text-align:left;
text-decoration:none;
background-color:rgba(255, 255, 255, 0.8);
padding:10px;
box-shadow:0 0 4px #888;
z-index:100;
}
.cmsbalk:hover {
box-shadow:0 0 4px #e10000;
}