@charset "utf-8";
/* CSS Document -  WEBSPICE - Sofie Vandenberghe -  www.webspice.be*/
@font-face {
	font-family: "Montserrat Light";
	src: url('fonts/MontserratLight.woff2') format('woff2'),
		url('fonts/MontserratLight.woff') format('woff'),
		 url('fonts/MontserratLight.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Source Sans Pro";
	src: url('fonts/SourceSansPro-Regular.woff2') format('woff2'),
		url('fonts/SourceSansPro-Regular.woff') format('woff'),
		url('fonts/SourceSansPro-Regular.ttf')  format('truetype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

html {
  scroll-behavior: smooth;
text-rendering: optimizeLegibility !important;
-moz-osx-font-smoothing:grayscale!important;
-webkit-font-smoothing:antialiased!important
}
body{font-family:"Source Sans Pro";color:#161514;font-size: 18px;overflow-x:hidden; overflow-y:scroll;}
h1, h2  {font-size:48px; line-height:70px;font-family:"Montserrat Light";  margin: 0 auto 40px; position: relative;color:#cd6d2e; text-align: center;text-transform:uppercase}
h3 { font-size:26px; line-height:34px;font-family:"Montserrat Light"; margin: 25px 0 5px 0; font-weight:bold;color:#cd6d2e }
h4{ font-size: 20px; margin-top: 0px;margin-bottom:20px;font-family: "Montserrat Light";position:relative;padding-bottom:20px;text-transform: uppercase;text-align: center;}
h5{font-size:20px; line-height:28px;font-family:"Montserrat Light";color:#cd6d2e;text-transform: uppercase}
h6{font-size:24px; font-weight:normal; margin: 0 0 10px; line-height:30px;}
p{font-size:18px; font-weight:normal; line-height: 30px;margin: 0 0 10px;  }
a{ text-decoration:underline; outline:none; transition: ease-in .3s;color:#cd6d2e}
a:hover, a:focus, a:focus, a:active{ text-decoration:underline;color:#161514}
p a:hover, a:hover{cursor:pointer;text-decoration: underline;}
ul {margin-left: 15px;margin-top: 10px;}
ul li{margin:5px}

.breadcrumb {background-color:transparent;border-radius:0;justify-content:flex-end;padding-left:0px;padding-top:10px;margin-bottom: 0}
.breadcrumb-item {font-size:12px}
.bgwece{background:#000000;margin-top:50px;}
#webspice { text-align: center;}
#webspice a {
font-weight:600;
font-size:14px;
color:#BBB8B8;
text-decoration:none;
    padding-top: 5px;padding-bottom:5px;
    }
#webspice a:hover{color:#ffffff}
.bol {
color:#D99F15;
font-size:24px
}
.btn {
box-shadow: none !important;
text-decoration:none;
transition: 0.3s;
color:#ffffff;
background: #cd6d2e;
border:none;
padding:0;
font-family: 'Montserrat Light';
border-radius:0;
font-size:18px;
text-transform:uppercase;
height: 68px;
line-height: 68px; 
display: block;
max-width: 480px;
margin: auto;
}
.btn:hover, a.btn:hover{text-decoration:none; background-color:#161514;color:#ffffff;}
/*******/
input:focus{ outline:none;}
.form-control::placeholder {color: #959494;}
.form-control, .form-control-file{font-weight: normal;
	padding: 8px 10px;
    border:1px solid #cd6d2e;
	border-radius:0px;
 color: #666666;
margin:5px 0}
.form-control:focus {
    color: #cd6d2e;
    background-color: #fff;
    border-color: #0f2548;
    outline: 0;
    box-shadow: none;
}
.submit {
font-family: "Montserrat Light";
display: block;
line-height: 1.25;
text-align: center;
vertical-align: middle;
text-decoration: none;
text-shadow: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-clip: padding-box;
margin-top: 20px;
font-size: 17px;
padding: 17px;
margin-left: auto;
margin-right: auto;
text-transform:uppercase;
transition: all 0.5s;
width: 250px;
color: #cd6d2e;
background: #ffffff;
border:1px solid #cd6d2e;
border-radius: 0;
letter-spacing: 1px
}
.submit:hover {background:#232220;color:#ffffff;text-decoration:none }
 iframe.map {height:500px; width:100%;display: block;}

/**----Header Css----**/
.top-header{ margin-bottom:5px}
.top-header ul{padding: 5px 1rem 0 0 ;margin-bottom:0;display: flex;
justify-content: space-between;}
.top-header ul li{ width: auto; display: inline-block; line-height: 40px; color: #cd6d2e;text-decoration: none;font-size:16px;padding: 0;margin: 0;}
.top-header ul li svg {margin-right:5px;color:#cd6d2e}
.top-header ul li a:hover{text-decoration: underline;  transition: ease-in .3s;}

/* nav */
.navbar-toggler:focus,.navbar-toggler:active {outline: 0;}
.navbar-toggler{position:relative;display:none}
.navbar-toggler span { display: block; background-color: #fff; height: 3px; width: 35px; margin-top: 4px; margin-bottom: 4px; -webkit-transform: rotate(0deg); 	-moz-transform: rotate(0deg); -o-transform: rotate(0deg); 	transform: rotate(0deg); position: relative; left: 0; opacity: 1; 	}
.navbar-toggler span:nth-child(1),
.navbar-toggler span:nth-child(3) {-webkit-transition: transform .35s ease-in-out;	-moz-transition: transform .35s ease-in-out;
	-o-transition: transform .35s ease-in-out;	transition: transform .35s ease-in-out;	}
.navbar-toggler:not(.collapsed) span:nth-child(1) { position: absolute; left: 12px; top: 10px; -webkit-transform: rotate(135deg); -moz-transform: rotate(135deg); -o-transform: rotate(135deg); 	transform: rotate(135deg); 	 opacity: 0.9; 	}
.navbar-toggler:not(.collapsed) span:nth-child(2) {	height: 12px;	visibility: hidden;	 background-color: transparent;	}
.navbar-toggler:not(.collapsed) span:nth-child(3) {	position: absolute;	left: 12px;	top: 10px;	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg); -o-transform: rotate(-135deg); transform: rotate(-135deg); opacity: 0.9;	}
.navi{align-items:flex-end}
.navi ul.navbar-nav{margin-top:0;margin-left:auto}
.nav-item{margin-right:30px;}
ul.navbar-nav .nav-item:last-child {margin-right:0px;}
.nav-link, .dropdown-item { text-transform:uppercase; color: #161514;  text-decoration: none; font-size:14px; letter-spacing: 1px; line-height:28px;transition: 0.5s; position: relative;font-family: "Montserrat Light"; }
.nav-link:focus, .nav-link:hover, .nav-link.active, .dropdown-item:focus, .dropdown-item:hover {color:#cd6d2e;text-decoration:none;background-color:transparent}
.dropdown-menu { padding: 20px; margin-top:40px;border: 0; border-radius: 0;background-color: #f7f5ef;  }


.banner, .banner2, .banner3, .banner4,.banner5,.banner6,.banner7 {position: relative;z-index: 1;height: 600px;}
.banner:after{ background: url(../fotomateriaal/banner.webp); right:0;  background-position: center center; width:70%; top:0;
    background-attachment: scroll; content:''; position:absolute; background-repeat: no-repeat; background-size: cover;height:600px; }	
.banner2:after{ background: url(../fotomateriaal/banner2.webp); right:0;  background-position: center center; width:70%; top:0;
    background-attachment: scroll; content:''; position:absolute; background-repeat: no-repeat; background-size: cover;height:600px; }
.banner3:after{ background: url("../fotomateriaal/nogepa.webp"); right:0;  background-position: center center; width:70%; top:0;
    background-attachment: scroll; content:''; position:absolute; background-repeat: no-repeat; background-size: cover;height:600px; }
.banner4:after{ background: url("../fotomateriaal/ame.webp"); right:0;  background-position: center center; width:70%; top:0;
    background-attachment: scroll; content:''; position:absolute; background-repeat: no-repeat; background-size: cover;height:600px; }
.banner5:after{ background: url("../fotomateriaal/medisch.webp"); right:0;  background-position: center center; width:70%; top:0;
    background-attachment: scroll; content:''; position:absolute; background-repeat: no-repeat; background-size: cover;height:600px; }
.banner6:after{ background: url("../fotomateriaal/voorschrift.webp"); right:0;  background-position: center center; width:70%; top:0;
    background-attachment: scroll; content:''; position:absolute; background-repeat: no-repeat; background-size: cover;height:600px; }
.info-box{padding:50px;background-color:#f7f5ef;position: absolute;
top: 60px;
left: 50px;
z-index: 99;min-width: 600px}
.bannermob{display:none}
/*index*/
.info-box{background-color:#f7f5ef;padding:30px}
.intro{padding-top:80px;padding-bottom: 100px}
.artsen{padding:0 80px;}
.artsen .container-fluid{background-color:#f7f5ef;padding-top:100px;padding-bottom:100px}
.card-body{padding-left:20px}
.card-footer{text-align: center;border-top:none;background-color:#ffffff;padding:0}
.card-footer h5{text-align:left;margin-bottom:30px;padding-left:20px}
.card h5 a{text-decoration:none;}
.card-footer .btncard{color:#ffffff;font-family: "Montserrat Light";text-decoration:none;background-color:#cd6d2e;text-transform: uppercase;padding:20px;display:block}
.card-footer .btncard:hover{background-color:#161514}
.adres{padding:80px 0}
/**----Footer Css----**/
footer {padding:60px 0 0px;background:#232220;text-align: center}
footer p, footer a{color:#ffffff;font-size: 16px;line-height: 22px}
footer a:hover, footer a svg:hover {color: #cd6d2e}
footer a svg {width:30px; height:30px}
#btn-back-to-top:hover {background-position: left bottom;} 
#btn-back-to-top {position: fixed; border-radius:0; border:0; bottom: 20px; right: 20px; display: none; background: url("../fotomateriaal/back-top-btn.webp") no-repeat left top; 	text-indent: -999999px; 		transition: ease-in .3s all; 		z-index: 999999; 	width: 47px; height: 47px; 	}
/* Responsive */
@media (min-width:1901px){.container-fluid{padding:0 50px}}
@media screen and (max-width: 1900px) {.artsen .container-fluid {padding-left: 50px;padding-right: 50px;} }
@media screen and (max-width: 1400px) {
h1 { font-size:50px; line-height: 60px;  }
h2 {font-size: 30px;  line-height: 50px;   margin: 0 0 20px;}
h3 {font-size: 24px; line-height: 30px; margin: 0 0 20px; }
.nav-item {margin-right: 0px;}
	.banner:after,.banner2:after,.banner3:after,.banner4:after,.banner5:after,.banner6:after,.banner7:after{width:80%}}
@media screen and (max-width: 1200px) {
h1 {font-size: 40px; line-height: 50px;}
h2 { font-size: 25px;    line-height: 40px;}
h3 {font-size: 24px; line-height: 30px; margin: 0 0 20px; }
.navi{justify-content: flex-start}
.dropdown-menu {display: block;}
.navbar-toggler { display: block!important;  background: #cd6d2e; height: 40px; border-radius: 0px;}
.collapse.navbar-collapse {display: none !important;}
.navbar-collapse.collapse.show {display: block !important;}
#main_nav  {position: absolute;
top: 110px;
left:10px;
background-color: #fff;
z-index: 9999;
padding: 5px 20px;
transition: 0.2s ease-in;}
.navbar-nav {display: block !important; }
.navbar-expand-lg .navbar-nav .dropdown-menu {padding: 0;  position: static; margin: 0 0 15px;}
.navbar-toggler:focus {box-shadow: 0 0 0 0!important;}
.nav-link { font-size: 14px; line-height: 24px; }
collapse.navbar-collapse {
  display: none !important;
}
.banner,.banner2,.banner3,.banner4,.banner5,.banner6,.banner7{height:400px}
.banner:after,.banner2:after,.banner3:after,.banner4:after,.banner5:after,.banner6:after,.banner7:after {height:400px}
.banner .info-box{left:15px;min-width:400px}
.artsen .container-fluid, .artsen {
  padding-left: 15px;
  padding-right: 15px;
}
footer {padding: 70px 0 0px;}
.bgwece {margin-top:45px; }
}
@media screen and (max-width: 992px) {
h1{ font-size: 32px; line-height: 40px; }
h2 {font-size: 28px; line-height: 36px;}	
footer {padding: 40px 0 0px;}		


}
@media screen and (max-width: 768px) {	


	}
@media (max-width: 576px){
	h2 { font-size: 24px; line-height: 32px; }
	h3 { font-size: 18px;    line-height: 24px;    margin: 0 0 15px;}
	#webspice { text-align: left; padding: 0 20px; }
	.intro {padding-top: 40px;padding-bottom: 50px;}
	.top-header ul{margin-left: 5px;flex-direction:column;}
}
@media (max-width: 481px){
	.bannermob{display:block}
	.banner .info-box,.banner2 .info-box,.banner3 .info-box,.banner4 .info-box,.banner5 .info-box,.banner6 .info-box,.banner7 .info-box {padding:10px;position:relative;top:0;left:0;min-width:auto}
	.banner:after,.banner2:after,.banner3:after,.banner4:after,.banner5:after,.banner6:after,.banner7:after{background:none;height:auto}
	.banner,.banner2,.banner3,.banner4,.banner5,.banner6,.banner7{height:auto}
	

}
.inhoud h2 {
  font-size: 28px;
  letter-spacing: 0.08em;
  margin-top: 35px;
  margin-bottom: 18px;
}

@media (max-width: 767px) {
  .inhoud h2 {
    font-size: 23px;
    letter-spacing: 0.04em;
  }
}

