@import url(https://fonts.googleapis.com/css?family=Rokkitt:400,700);

* { margin:0; padding:0;}
html {height:100%;}
body {height:100%; font-family: 'Rokkitt', sans-serif; font-size:16px; color:#364222; text-align:left; font-weight:normal; line-height:24px; background:#ffffff; letter-spacing: 0.5px; }
h1,h2,h3 {font-family: 'Rokkitt', serif; font-size:20px; font-weight:normal; color:#aaba47; padding-bottom:10px; text-transform:uppercase; letter-spacing:2px;}
img {border:0; margin:0; padding:0;}
a:link, a:visited {color: #aaba47; text-decoration:none;}
a:hover, a:active {color: #364222; text-decoration:none;}

#container {
width:1200px;
height:auto;
margin:0 auto; 
overflow:hidden; 
padding:0 20px;
}

#zijbalk {
width:209px;
height:auto;
margin:30px 0;
overflow:hidden; 
float:left; 
}

#logo {
width:180px;
height:104px;
margin-bottom:45px; 
overflow:hidden; 
float:left; 
}

#menu {
width:210px;
height:auto;
overflow:hidden; 
float:left; 
line-height:24px;
letter-spacing:1px;
border-bottom:1px solid #aaba47;
padding-bottom:5px;
}

#menu-info {
width:210px;
height:auto;
overflow:hidden; 
float:left; 
line-height:24px;
letter-spacing:1px;
}

#menu a:link, #menu a:visited, #menu-info a:link, #menu-info a:visited {color: #364222; text-decoration:none;}
#menu a:hover, #menu a:active, #menu-info a:hover, #menu-info a:active {color: #aaba47; text-decoration:none;}

#menu li li,
#menu-info li li {
background-image:url('images/stripe.png');
background-repeat:no-repeat;
padding-left:16px;
list-style-type:none;
margin-left:1px;
}

#content {
width:990px;
height:auto;
margin:30px 0 0; 
overflow:hidden; 
float:right; 
border-left:1px solid #aaba47;
}

#slider {
border-bottom:1px solid #aaba47;
padding:0 0 30px 30px;
}

#reportage {
height:399px;
border-bottom:1px solid #aaba47;
padding:0 0 5px 25px;
}

.reportage {
margin-right:22px;
}

#links {
width:450px;
height:auto;
margin:30px 0; 
overflow:hidden; 
float:left; 
border-right:1px solid #aaba47;
padding:0 30px;
}

#linksinfo {
width:960px;
height:auto;
margin:30px 0; 
overflow:hidden; 
float:left; 
border-right:1px solid #aaba47;
padding:0 30px;
}

#linksvoordieptepaginas {
width:auto;
height:auto;
overflow:hidden; 
float:left; 
border-right:1px solid #aaba47;
padding:0 30px;
}

#rechts {
width:450px;
height:auto;
margin:30px 0; 
overflow:hidden; 
float:right; 
}

#testimonial {
border-left:1px solid #aaba47;
margin-left:1px;
padding-left:16px;
font-style:italic;
font-size: 14px;
}

#testimonial b{
font-style:bold;
font-size: 16px;
}

#interieurfoto {
padding:0 0 30px 30px;
}

#interieurfoto-text {
width:920px;
}

#footer {
width:1200px;
height:auto;
font-size:14px;
letter-spacing:0;
line-height:18px;
text-align:center;
vertical-align:bottom;
margin-bottom:30px;
padding-top:30px;
overflow:hidden; 
float:left; 
border-top:1px solid #aaba47;
}

/* Formulier */

#contact-area {
	margin-top: 25px;
}

#contact-area h2{padding-top:20px;}

#contact-area label{width:140px;clear:both;}

#contact-area input, #contact-area textarea {
	padding: 5px;
	width: 200px;
	margin: 0px 0px 10px 0px;
	border: 2px solid #ccc;
}

#contact-area textarea {
	height: 170px;
	width: 505px;
}

#contact-area textarea:focus, #contact-area input:focus {
	border: 2px solid #900;
}

#contact-area input.submit-button {
	width: 100px;
	float: left;
}

label {
	float: left;
	text-align: left;
	margin-right: 5px;
	width: 300px;
	padding-top: 5px;
}

#visionforge {
    width: 100%;
    margin-bottom: 20px;
    text-align: center;
}

#visionforge-image {
    max-width: 100%;
    height: auto;
    cursor: pointer;
}
.popup {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.8);
}

.popup-content {
    position: relative;
    background-color: transparent;
    margin: auto;
    padding: 20px;
    max-width: 90%;
    max-height: 90%;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
}

#popup-image {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.close {
    position: absolute;
    top: 10px;
    right: 25px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
}

.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}
}

/* 365: */

#year{margin:30px 0px;padding-bottom:40px;}
#year b{font-family:sans-serif;font-weight:normal;}
#year h2 a, #year h2{color:#555;font-family:'Quicksand';font-weight:normal;font-variant:normal;font-style:normal;font-size:16px;text-decoration:none;margin:20px 5px 20px 5px;}
#year h2 a:hover{text-decoration:none;color:#b99245;}
#year h2 a{color:#82662f;}
#year h2 a.active{color:#82662f;border-bottom:2px solid #82662f;}
#year b a{padding-bottom:20px;}
#year b h2 a{padding-bottom:5px;}

.backhome{font-weight:bold;color:#161616 !important;}




/* Toegevoegd 2026-06-11: responsive contactformulier + FAQ */
#contact-area input, #contact-area textarea { max-width: 100%; box-sizing: border-box; }
#contact-area input[type=text], #contact-area input[type=email] { width: 320px; }
#contact-area textarea { width: 100%; max-width: 505px; }
#contact-area input.submit-button { width: auto; padding: 8px 22px; background:#aaba47; color:#fff; border:none; cursor:pointer; letter-spacing:1px; }
#contact-area input.submit-button:hover { background:#929f3d; }
.faq p { margin: 0 0 14px 0; }
.faq b { color:#364222; }