@import url('https://fonts.googleapis.com/css?family=Ubuntu:300,300i,400,400i,500,500i,700,700i');
html,
body {
    height: 100%;
	margin:0px;
	padding:0px;
}
body {
    background-color: #fff;
    background-size: cover;
    font-family: 'Ubuntu', sans-serif;
    color: #515f67;
    font-size: 15px;
    font-weight: 400;
    line-height: 25px;
    letter-spacing: 0.05em;
}
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f6f6f6;
    z-index: 99999
}
#status {
    width: 200px;
    height: 200px;
    position: absolute;
    left: 50%;
    top: 50%;
    background-image: url(../images/status.gif);
    background-repeat: no-repeat;
    background-position: center;
    margin: -100px 0 0 -100px
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
    margin: 15px 0px
}

h1 {
    font-size: 32px;
    line-height: 34px;
    font-weight: 300;
    color: #fff;
    margin: 50px 10px 10px 10px;
    text-transform: uppercase;
}

h1 {
    position:relative;
    display:inline-block;
}
h1:after {
    content:'';
    position:absolute;
    left:0;
    top:100%;
    margin: 10px auto;
    width:20%;
    height:2px;
    background:#353f47;
}
h2 {
    font-size: 25px;
    font-weight: 800;
    color: #353f46;
    text-transform: uppercase;
}
h3 {
    font-size: 24px;
    font-weight: 800;
    color: #353f46;
    margin: 25px 10px 0px 0px;
}
h4 {
    font-size: 20px;
    font-weight: 600;
    color: #353f46;
}
h5 {
    font-size: 15px;
    font-weight: 400;
    color: #353f46;
}
h6 {
    font-size: 15px;
    font-weight: 400;
    color: #353f46;
}

ul {
    list-style-type: disc;
    margin: 15px 45px 45px 45px
}
ol {
    list-style-type: decimal;
    margin: 15px 45px
}
ul li,
ol li {
    display: list-item
}
a {
    color: #353f46;
    text-decoration: none
}
a:visited {
    color: #353f46
}
a:hover {
    color: #000;
}
a:active {
    color: #fff
}
.gridlink a {
    font-weight: 400;
    text-decoration: none
}
a.button, button {
    background-color: #353f46;
	border-radius:25px;
    color: #fff !important;
    padding: 10px 20px;
	margin:20px;
    font-size: 1.2em;
	font-weight:500 !important;
    text-align: center;
	display:inline-block;
	border:0px solid #fff;
	cursor:pointer;
}
a.button:hover, button:hover {
    background-color: #000
}
hr {
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #fff
}

#blauw {background-color:#4bcaff; color:#fff}
#grijs {background-color:#fff}
#grijs h1 {color:#111}
#donkergrijs {background-color:#515f67; color:#fff}

#donkergrijs h1:after {background:#fff;}

.subheader {background-color:#000; color:#fff; width:100%; margin:0px; padding:12px 10px; height:8%; overflow:hidden}
.center {text-align:center; width:100%;}
.breadcrumbs {
    color: #666;
    text-transform: uppercase;
    font-weight: 500;
    margin: 10px 0px;
    padding: 5px 10px 0px 25px;
    font-size: 10px;
    letter-spacing: 0.05em;
    width: 100%;
    text-align: right;position: relative;
    display: block
}
.breadcrumbs a {
    font-weight: 500 !important
}
strong {
    font-weight: bold
}
b {
    font-weight: 400
}
.margin20 {
    margin-top: 20px
}
.floatright {
    float: right
}
em,
i {
    font-style: italic;
	    font-size: 15px;
}
u {
    text-decoration: underline
}

.space140 {
    height: 110px;
	width:100%;
}
main {
    max-width: 100%;
    height: auto
}
.logo {
    margin: 20px 0
}
.slider {
    width: 100%
}


.wit {
    background-color: #F8F8F8;
    height: auto;
    overflow: auto
}
.wit a {
    color: #353f46;
}
.wit a:hover {
    color: #000;
}
.wit h1,
.wit h2 {
    color: #000
}


.blokkenwrap {margin-top:!important; z-index:99999 !important; color:#ccc; max-width:1200px; display:block; margin:auto; }
.blokken {padding:50px 30px; text-align:center; margin:0 auto}
.blokken i {font-size:50px; text-align:center; margin:0 auto; width:100%}
.blokken a {color:#fff !important; font-size:30px; line-height:50px; text-align:center; width:100%;}
.contact {
    font-size: 36px;
    margin: 20px
}
.contact ul li {
    position: relative;
    margin: 20px;
    padding: 0px;
    line-height: 25px;
    list-style-type: none;
    font-size: 20px;
    color: #353f46;
    text-transform: uppercase;
    font-family: 'Ubuntu', sans-serif
}
.contact a {
    font-weight: 400 !important
}
.contact ul li:before {
    content: '\f061';
    font-family: 'FontAwesome';
    float: left;
    margin-top: 0px;
    margin-left: -1.5em
}
.imageblok {
    margin-top: -130px;
    z-index: 100 !important;
    position: relative;
    text-align: center;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 30px;
    overflow: auto
}
.imageblok .frame {
    max-width: 250px !important;
    margin: 0 auto;
    position: relative;
    height: 220px !important;
    transform: scale(1);
    transition: all 0.6s;
    overflow: hidden
}
.imageblok img {
    max-width: 200px !important;
    height: auto !important;
    transform: scale(1);
    transition: all 0.6s;
    overflow: hidden
}
.imageblok img:hover {
    transform: scale(0.95)
}

form {
    margin: 0 auto;
    max-width: 600px;
}
form h1,
form h2,
form h3,
form h4,
form h5,
form h6,
form p {
    margin: 15px 0;
}
form input {
    border-radius: 0;
}
form select {
    border-radius: 0;
    -webkit-appearance: none;
}
label {
    line-height: 16px;
    color: #000;
    font-size: 14px;
	width:30%; 
	float:left;
	display:block;
	padding:5px;
	text-align: right;
}

.notes {
    line-height: 16px;
    color: #4f8396;
    font-size: 11px;
	padding:10px 5px;
}

.hidden {display:none}
form input,
form textarea,
form button,
form select {
    font-size: 15px;
    font-weight: 300;
}
form input[type=text],
form input[type=email],
form input[type=tel],
form input[type=password],
form select,
form textarea {
    padding: 7px;
    background: #fff;
    border: 1px solid #ccc;
    margin-bottom: 10px;
	width:60%;
	float:left;
	font-family: 'Ubuntu', sans-serif;
}

input::placeholder, textarea::placeholder, input[type=email]::placeholder {color: #ccc;}

form input[type=radio],
form input[type=checkbox] {
    margin-top: 15px;
}
form input[type=submit],
form input[type=reset] {
	display:block;
	position:relative;
	width:200px;
    padding: 10px 20px;
    font-size: 16px;
    background: #353f46;
    color: #fff;
    border: 0;
    cursor: pointer;
	font-family: 'Ubuntu', sans-serif;
	font-weight: 500 !important;
	width:30%;
	margin-top:20px;
	margin-left:30%;
	float:left}
form input[type=submit]:hover,
form input[type=reset]:hover {
    background: #000;
}
form table {
    margin: 0 !important;
}


/*Gallery*/

	.galleryphotomap {
		list-style-type: none;
		width:19%;
		margin: 2%;
		overflow: hidden;
	}


.galleryphotomap figure {overflow:hidden !important; height:auto !important; max-height:350px !important; margin:0px !important; padding:0px !important; width:100% !important; float:none}
.galleryphotomap figure img {-webkit-transform:scale(1.0);transform:scale(1.0);-webkit-transition:0.6s ease-in-out;transition:0.6s ease-in-out; width:100%; }
.galleryphotomap figure:hover img {-webkit-transform:scale(1.2);transform:scale(1.2);}

	.galleryphotomap {
		float: left;
		position: relative;
		overflow: hidden;
	}


	.galleryphotomap .title {
		width:100%;
		padding:10px;
		font-size:18px;
		font-weight:bold;
		text-align:center;
		display:block	}
	.galleryphotomap:hover {
	}
	.galleryphotomap:hover  .caption-text {
        font-size:0px;
		 -moz-transition: all 0.6s;
  -webkit-transition: all 0.6s;
  transition: all 0.6s;
	}


	.galleryphotomap img {
		float: left;
		z-index: 4;
	}


	.galleryphotomap .caption {
		cursor: pointer;
		position: absolute;
		opacity: 1;
		top:0px;
		bottom:0px;
		left:0px;
		right:0px;
		-webkit-transition:all 0.15s ease-in-out;
		-moz-transition:all 0.15s ease-in-out;
		-o-transition:all 0.15s ease-in-out;
		-ms-transition:all 0.15s ease-in-out;
		transition:all 0.15s ease-in-out;
		color: #fff;

	}
	.galleryphotomap .caption-text {
		z-index: 10;
		position: absolute;
		width: 100%;
		text-align: center;
		top:40%;
		font-weight:bold;
		font-size:24px;
	}
.galleryphoto {float:left; display: inline-block; width:25%;overflow:auto; padding:0px; margin:0px;}
.galleryphoto img {display:block; padding:1px;}
.PhotoSwipe figure {float:left; display:inline-block; width:20%; height:auto !important; margin:0% 0% 0% 0%;}
.PhotoSwipe figure img {display:block; padding:0px; width:100%; height:auto}


#myDIV {
    width: 100%;
    padding: 50px 0;
    text-align: center;
    margin-top:20px;
	display:none;

}
.website,
.website * {
    display: none !important
}
.content {
    padding: 50px 10px;
	overflow:auto;
}
.content a {
    font-weight: bold
}
.content img {
    max-width: 100% !important;
    height: auto;
}


.content ul {
    list-style-type: none;
    margin-left: 50px;
	margin-top:10px;
	margin-bottom:10px;
}
.content ul li {
    position: relative;
    list-style-type: none;
}
.content ul li:before
{
  content: '\f111';
  font-family: 'FontAwesome';
  font-size:4px;
  float: left;
  margin-left: -3.5em;
  color: #353f46;
}
main {
    display: table-row;
    height: 100%
}
.parallax-section-1 {
    height: 700px;
    margin: 0px;
    background-position: -100px center 100px center;
    background-repeat: no-repeat;
	-webkit-background-size: cover;
    -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}

.parallax-section-2, .parallax-section-3 {
    height: 600px;
    margin: 0px;
    padding: 0px;
    background-position: -50% center 50% center;
    background-repeat: no-repeat;
			  -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
}
.quote {
    width: 100%;
	height:100%;
    text-align: center;
    font-size: 36px;
    line-height: 40px;
    font-weight: 600;
    color: #fff;
    margin-top: 0px;
	padding:8% 10% 8% 10%;
    display: inline-block;
}
.quotesub {
    width: 100%;
    text-align: center;
    font-size: 26px;
    font-weight: 600;
    color: #fff;
    margin-top: 15px;
    display: inline-block
}
#map {
    width: 100%;
    height: 500px;
}

#map img {
    max-width: inherit !important;
    height: auto;
}
#map h3 {
	margin:0px; padding:0px; text-transform:uppercase;
}
/*Calendar*/

.fyc-calendar{margin:40px auto; max-width:1400px;}.fyc-calendar-table{width:80%;height:150px;margin:20px auto}.fyc-calendar-table thead>tr:first-child>th{padding:10px;background-color:#009fe3;color:#fff;font-weight: bold;font-size: 18px}.fyc-calendar-table thead>tr>th{ border:0px; background-color:#c8effb;color:#000; padding:0px 10px;}
	.fyc-calendar-table tbody>tr>td{border:0px solid #555; text-align:center}.fyc-niwd-holiday { color:#fff; background-color: #ff0000 !important;}
		.calender {width:25%; float:left; display:block; height:300px}
		.fyc-calendar-table td {background-color:#fff; padding:0px !important}
/*End calendar*/

.news {background-color:#ededed; height:600px; border-radius:3px; padding:0px !important; position:relative; overflow:hidden}
.geel .news {background-color:#fff}
.news .date {font-size:10px; color:#666; margin:0px; padding:0px; position:absolute; right:10px;}
.news h4 {margin:25px 0px 5px 0px;padding:0px; text-transform:uppercase}
.news a { color:#000}
.news .content {padding:10px 20px 10px 20px; min-height:300px;}
.news figure {overflow:hidden !important; height:auto; max-height:350px !important; margin:0px !important; padding:0px !important;  border-radius:3px;}
.news figure img {-webkit-transform:scale(1.0);transform:scale(1.0);-webkit-transition:0.6s ease-in-out;transition:0.6s ease-in-out; width:100% !important; height:auto !important}
.news figure:hover img {-webkit-transform:scale(1.05);transform:scale(1.05);}

a.news-link {display:block; background-color:#353f46; text-align:center; font-size:12px; width:100px; padding:4px; font-weight:500; color:#fff; position:absolute; left:20px; bottom:20px;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
a.news-link:hover {background-color:#000; color:#FFF}

a.jscroll-link { margin:20px auto; display:block; background-color:#000;  text-align:center; width:180px; padding:8px; font-weight:500; color:#fff; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
a.jscroll-link:hover {background-color:#000; color:#fff;}

.sharebuttons {margin:0px !important; padding:5px !important; display:block; position:absolute; width:150px; right:20px; bottom:50px}
.sharebuttonswrap { display:block; position: relative; width:100%; height:40px; margin-top:100px; clear:both}

.socialmedia i {font-size:24px; font-weight:800; color:#353f46; width:50px; display:block; height:50px; border: 3px #353f46 solid;  border-radius:60px; margin:10px; text-align:center; padding:10px 0px;}
.socialmedia i:hover {color: #353f46; border-color:#353f46 !important; cursor:pointer}
.socialmedia-wrap { width:150px; text-align:center; margin:0 auto; position:relative; display:block}
.socialmedia-wrap img {width:35px; height:35px; padding:2px;display:block; float:left}
.socialmedia-wrap img:hover {
  transform: scale(0.9);
  -webkit-transform: scale(0.9);
   -webkit-transition:height 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;
}
.content-carousel {margin:40px; min-height:350px;}
.content-carousel  ul li {
    position: relative;
    list-style-type: none;
}

.content-carousel ul li:before
{
  content: '\f00c';
  font-family: 'FontAwesome';
  float: left;
  margin-left: -1.5em;
  color: #353f46;
}


.expertise {height:430px; padding:0px !important; margin: 0px 5px 30px 5px; position:relative; overflow:hidden; text-align:center}
.expertise h4 {margin:0px 0px 5px 0px;padding:0px; text-transform:uppercase; color:#000}
.expertise a { color:#353f46; font-weight:normal}
.expertise .content {padding:0px 10px 0px 10px; text-align: center; }
.expertise .link { position:absolute; bottom: 0px; text-align: center; left:0; right:0 }


.expertise figure {
  position: relative;
  background-color: #FFF;
  padding: 0px;
  margin:0px 40px;
  overflow: hidden;
  border: 0px solid #EDEDED;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  max-width:100% !important;
}

.expertise .hover {
  -webkit-transition: transform 0.5s, opacity 400ms ease;
}

.expertise img {
  width: 100%;
  height: 100%;
  max-width:100% !important;
  border-radius: 50%;
}

.expertise figure:hover .hover {
  transform: scale(0.9);
  -webkit-transform: scale(0.9);
}
a.expertise-link {display:block; background-color:#000; text-align:center; font-size:12px; width:100px; padding:4px; font-weight:500; color:#fff; position:absolute; left:20px; bottom:20px;-webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
a.expertise-link:hover {background-color:#13263b; color:#FFF}

#referenties {background-color:#f6f6f6; overflow:auto}
.references figure {
  position: relative;
  background-color: #FFF;
  padding: 0px;
  margin:0px 40px;
  overflow: hidden;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  max-width:100% !important;
  cursor:pointer;
}

.references  .hover {
  -webkit-transition: transform 0.5s, opacity 400ms ease;
}

.references  img {
  width: 100%;
  height: 100%;
  max-width:100% !important;
  border-radius: 50%;
}

.references  figure:hover .hover {
  transform: scale(0.9);
  -webkit-transform: scale(0.9);
}

.about {max-width:800px; margin:0 auto}

.about .three-column {width:33% !important; margin:0px; float:left}
.about  figure {
  position: relative;
  padding: 0px;
  margin:0px 20px;
  overflow: hidden;
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  max-width:150px !important;
  cursor:pointer;
}

.about   .hover {
  -webkit-transition: transform 0.5s, opacity 400ms ease;
}

.about  img {
  width: 100%;
  height: 100%;
  max-width:200px !important;
}

.about  figure:hover .hover {
  transform: scale(0.9);
  -webkit-transform: scale(0.9);
}
/*Search*/

.header-search { position:absolute; right:10px; top:5px; z-index:1299; width:150px; display:block; margin:0px; padding:0px; height:30px; text-align:right; -webkit-transition:all 0.3s;-moz-transition:all 0.3s;-ms-transition:all 0.3s;-o-transition:all 0.3s;transition:all 0.3s;}
.header-search form {margin:0px !important; padding:0px !important; background-color:#099; display:block}
.header-search input[type=text] {width:100px; float:left; margin:0px !important; border: solid 2px #333; border-right:0px !important; color:#fff; border-radius: 0px; height:30px !important; font-size:12px; padding:3px; background-color:#000}
.header-search input[type=submit] {float:left; display:block; width:30px; height:30px; margin:0px; padding:0px; border: solid 2px #333; border-left:0px !important; border-radius:0px; font-size:10px; font-family: 'FontAwesome';}

footer {
    background-color: #353f47!important;
    width: 100%;
    color:#515f67;
    font-size: 13px;
	font-weight:bold;
	padding:20px;
	position:relative;
}


footer img {
    max-width: 100% !important
}
footer h4 {
    font-size: 16px;
	color:#ccc;
}
footer a {
    color: #f6f6f6 !important
}
footer a:hover {
    color: #ccc;
    text-decoration: underline
}

.footer-logo {width:200px !important; height: auto; margin-top:20px;}
header .three-column,
header .two-third-column,
footer .four-column,
footer .one-column {
    border: 0
}

.bottom { width:100%; padding:0px;}
.scrollToTop {
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
    width: 39px;
    height: 39px;
    font-size: 20px;
    position: fixed;
    bottom: 30px;
    right: 20px;
    display: none;
    background: #353f46;
    background-image: url(../images/top-arrow.png)
}
.scrollToTop:hover {
    text-decoration: none
}
#nieuws {
    text-align: center
}
fieldset {
    border: 0;
    padding: 0;
}
input[type=text],
input[type=email],
input[type=url],
input[type=password],
textarea {
    width: 100%;
    border-top: 1px solid #ccc;
    border-left: 1px solid #ccc;
    border-right: 1px solid #eee;
    border-bottom: 1px solid #eee;
}
input[type=text]:focus,
input[type=email]:focus,
input[type=url]:focus,
input[type=password]:focus,
textarea:focus {
    outline: 0;
    border-color: #4697e4;
}



.wattedoen .four-column {
  position: relative;
  background:#515f67;
}

.wattedoen .four-column img {
	display:block;
}
.wattedoen .caption {
  position: absolute;
  top: 65%;
  left: 50%;
  width:100%;
  transform: translate(-50%, -50%);
  z-index:100;
  color:#fff;
  font-size:24px;
  font-weight:bold;
  text-align:center;
  opacity:0;
  	 -webkit-transition:all 0.6s;-moz-transition:all 0.6s;-ms-transition:all 0.6s;-o-transition:all 0.6s;transition:all 0.6s;  
}

.wattedoen .four-column:hover .caption {
    opacity:1;
	 -webkit-transition:all 0.6s;-moz-transition:all 0.6s;-ms-transition:all 0.6s;-o-transition:all 0.6s;transition:all 0.6s;  
}

.wattedoen .four-column:hover img {opacity:0.5;   	 -webkit-transition:all 0.6s;-moz-transition:all 0.6s;-ms-transition:all 0.6s;-o-transition:all 0.6s;transition:all 0.6s;  
}


@media screen and (max-width: 1150px) {
.calender {width:33%; float:left; display:block; height:300px}
}
@media screen and (max-width: 900px) {
.quote {font-size:24px; line-height:26px; 	padding:8% 5% 8% 5%;}
.calender {width:44%; margin: 3%; float:left; display:block; height:auto}
}
@media (max-width: 650px) {
    .parallax-section-1, .parallax-section-2 {
        height: 200px
    }
}
@media screen and (max-width: 600px) {
.calender {width:100%; margin: 0%; float:left; display:block; height:auto}
	
	.subheader {background-color:#000; color:#fff; width:100%; margin:0px; padding:8px 10px; height:70px; overflow:hidden}

    #logofooter {
        display: none
    }
    .formbuilderform {
        font-size: 15px
    }
    #cssmenu > ul > li > a {
        color: #ffffff;
        padding: 15px 10px;
        font-weight: 200 !important;
        letter-spacing: 1px;
        text-transform: uppercase;
        font-size: 12px !important
    }
    form {
        max-width: 100% !important
    }
    footer {
        outline: none
    }
    .imageblok {
        display: none
    }
    #slider {
        margin-top: 135px
    }
    .quote {
        font-size: 20px;
        line-height: 30px;
    }
    .quotesub {
        font-size: 16px;
        margin-top: 10px
    }
    input[type=text],
    input[type=email],
    input[type=url],
    input[type=password],
    textarea,
    select {
        width: 100%;
    }
	

}
@media screen and (max-width: 480px) {
	.blokkenwrap {display:none}
    body {
        background-image: none;
    }

    #content img,
    .tgtimg,
    .pagination {
        height: 200px !important;
        max-height: 200px !important
    }
    .maintitle {
        font-size: 16px
    }
    main {
        background-size: 50%
    }
 
    h1 {
        font-size: 20px !important;
		margin:40px 10px 0px 10px;
    }
    h2 {
        font-size: 16px !important
    }
	
	label {width:100%;}
	
	form input[type=text],
form input[type=email],
form input[type=tel],
form input[type=password],
form select,
form textarea {
	width:100%;
	float:left;
}


.expertise {padding:10px !important;} 
.expertise .content {padding:5px; max-width:100%;}

.parallax-section-1 {
    height: 250px !important;
}

.parallax-section-2 {
    height: 200px !important;
}
form input[type=submit],
form input[type=reset] {
    padding: 10px 10px;
    font-size: 14px;
	margin-left:0%;
	float:left}
	
label {text-align:left}

h3, h4 {font-size:18px !important; line-height:22px}


}