    
body { 
	position:relative;
	height:100%;
	font-family: 'Open Sans', sans-serif;
	font-weight: 300;
	color:#007178;
	background-color: #ffffff;
	transition: background-color 1.0s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0s;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	overflow-y:scroll;
	}

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }	

.container {
	max-width: 1200px; /*was 1300px*/
	width: 100%;
	padding-left: 30px;
	padding-right: 30px;
}
.container > .navbar-collapse {margin-left:-30px;}
.container-fluid > .navbar-collapse {margin-left:-30px;}

.img-responsive { /*added because img-responsive didnt work in display table-cells*/
	width:100%; 
}
	

.font-accent { 
	font-family: ClayHandwritingPro;
	font-weight: normal;
	font-style: normal;
	padding-right:0.2em;
	font-size: 1.25em;
}
section {
	mxxargin-bottom:30px; /*was 30px */
}
section:before, 
section:after { content: ""; display: table; }
section:after { clear: both; }
section { zoom: 1; }
section:last-child {
	margin-bottom:0px; 
}

.well {
	background-color: #f0f0f0;
    border-width: 0px;
    border-radius: 0px;
    box-shadow: none;
    padding: 0px;	
	margin-bottom:0px;
}	
.withpad {
	padding-top:45px;
	padding-bottom:45px;
}
	

/* txt -------------------------------------------------------------------------*/


h1, h2, h3, h4, h5, h6 {
	font-family: 'Ubuntu';	
}
h1 {
	
	color:#007178;
	font-weight: 300;
	font-size:220%;
	line-height:1.25em;
	margin-bottom: 50px;
    margin-top: 52px;
	position:relative;
	hyphens: auto;
}

nav.themanav { 
    display: block;
    width: 100%;
	margin-top:52px;
    margin-bottom: 50px;
}
	@media (min-width: 768px) {
		nav.themanav { 
			display: table;
		}
	}
	
nav.themanav a, nav.themanav h1 {
    display: block;
    text-align: center;
}
@media (min-width: 768px) {
		nav.themanav a, nav.themanav h1 {
			display: table-cell;
		}
	}
nav.themanav h1 {
    display: block;
    text-align: center;
	margin-bottom: 20px;
    margin-top: 10px;
}
@media (min-width: 768px) {
		nav.themanav h1 {
			padding-left:20px;
			padding-right:20px;
		}
	}	

nav.themanav a {
	color:#848484;
	font-size:80%;
}
nav.themanav h1:first-child {
    text-align: center;
}
@media (min-width: 768px) {
		nav.themanav h1:first-child {
			text-align: left;
		}
	}

nav.themanav h1:last-child {
    text-align: center;
}
@media (min-width: 768px) {
		nav.themanav h1:last-child {
			text-align: right;
		}
	}

nav.themanav a:only-of-type:first-child {
    text-align: center;
}
@media (min-width: 768px) {
		nav.themanav a:only-of-type:first-child {
			text-align: left;
		}
	}

nav.themanav a:only-of-type:last-child {
    text-align: center;
}
@media (min-width: 768px) {
		nav.themanav a:only-of-type:last-child {
			text-align: right;
		}
	}
	
h2 {
	color:#007178;
	font-weight: 300;
	font-size:220%;
	margin-bottom: 15px;
    margin-top: 0px;
	overflow: hidden;
	hyphens: auto;
	line-height: 1.25;
}
.quote h2 {
	font-family: 'Open Sans';
	font-weight:200;
	font-size:170%;
	line-height:1.30em;
	text-align:center;
	padding:30px 0px;
}
h3 {
	color:#007178;
	font-size:100%;
	font-weight:500;
	line-height:1.3em;
}
.specs h3 {
	margin-bottom: 5px;
    margin-top: 5px;
}
.lead {
    font-size: 20px;
    line-height: 1.5;
    font-weight: 300;
    margin-bottom: 40px;	
}
.tcenter {
	text-align:center;
}

/* ==============================================================================================================
HEADER
============================================================================================================== */
		
.header{
	position:fixed;
	top:0;
	width:100%;
	background: rgba(255, 255, 255, 0);
    z-index: 21;
	padding:0px 0px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s ;
    transition: all 0.3s ;
}	
.header.shrink {
    padding:0px 0px;
	background: rgba(255, 255, 255, 0.8);
}
	
.header #logo {
	width:160px; /* CHANGE! with different logo size */
	height:35px; /* CHANGE! with different logo size */
	font-size:0.1em; 
	line-height:0.1em; 
	display:inline-block;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	z-index:20;	
}
	@media (min-width: 768px) {
		.header #logo {
			width:290px; /* 173px CHANGE! with different logo size */
			height:64px; /* 50px CHANGE! with different logo size */
		}
	}

.header #logo img {
	width:100%;
	height:100%;
}

.header.shrink #logo  {
	width:120px; /* CHANGE! with different logo size */
	height:26px; /* CHANGE! with different logo size */
}
	@media (min-width: 768px) {
		.header.shrink #logo  {
			width:180px; /* 120px CHANGE! with different logo size */
			height:40px; /* 35px CHANGE! with different logo size */
		}
	}




.headerhome{
	position:absolute;
	top:0;
	width:100%;
	background: rgba(255, 255, 255, 0);
	padding:0px 0px;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s ;
    transition: all 0.3s ;
}	
	@media (min-width: 768px) {
		.headerhome {
			position:absolute;
			top:auto;
			bottom:20px;
			z-index:30;
		}
		.headerhome.sticky {
			position: fixed;
			top: 0;
			bottom:auto;
		}		
		.headerhome.sticky.shrink {
			padding:0px 0px;
			background: rgba(255, 255, 255, 0.8);
		}
		.headerhome.sticky.shrink .navbar-header {
			padding: 20px 0;
		}
		.headerhome.sticky.shrink #logo  {
			width:180px; /* 120px CHANGE! with different logo size */
			height:40px; /* 35px CHANGE! with different logo size */
		}
		.headerhome.sticky.shrink .navbar-nav {
			padding: 22px 0 0;
		}
	}
.headerhome #logo {
	position:absolute;
	top:100px;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	width:290px; /* 173px CHANGE! with different logo size */
	height:64px; /* 50px CHANGE! with different logo size */
	font-size:0.1em; 
	line-height:0.1em; 	
	display:block;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	margin:0px 0px;
	background: url(../stdimg/logo-wit.png) no-repeat;
	background-size: 290px 64px;
}
.headerhome.sticky.shrink #logo {
	background: url(../stdimg/logo.png) no-repeat;
	background-size: 180px 40px;
}	
	@media (min-width: 768px) {
		.headerhome #logo {
			display:inline-block;
			margin:0px; /* ? */
			position:static;
			top:auto;
			left: 50%;
			-webkit-transform:none;
			transform: none;
			width:290px; /* 173px CHANGE! with different logo size */
			height:64px; /* 50px CHANGE! with different logo size */
		}
	}
	
.headerhome #logo.navbar-brand {
    float: none;
	margin-left: 0px !important;
}	
	@media (min-width: 768px) {
		.headerhome #logo.navbar-brand {
			float: left;
			margin-left: 10px;
		}
	}
	
.headerhome #logo img {
	width:100%;
	height:100%;
}




/* ==============================================================================================================
NAVBAR
============================================================================================================== */

.navbar {
	margin-bottom: 0px;
	border: 0px solid transparent;
}
	@media (min-width: 768px) {
		.navbar {
			background-color: transparent;
		}
	}
	
@media (min-width: 768px) {
	.header .navbar-nav {
		padding:57px 0px 28px 0px;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
		margin-left:40px;
	}
	.header.shrink .navbar-nav {
		padding:22px 0px 0px 0px;
	}
}	

.header .navbar-header {
	padding:40px 0px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	z-index:20;
	position:relative;
}
.header.shrink .navbar-header {
	padding:20px 0px;
}

.navbar-collapse {
	-webkit-transition: height 0.01s;
	-moz-transition: height 0.01s;
	-ms-transition: height 0.01s;
	-o-transition: height 0.01s;
	transition: height 0.01s;
	padding-left:0px;
}
	@media (min-width: 768px) {
		.navbar-collapse {
			padding-left: 0px; /* overwrite bootstrap */
			padding-right: 0px; /* overwrite bootstrap */
			text-align:center;
		}
	}
.navbar-brand {
	padding: 0px 0px;
	margin-left: 15px!important;
}
	@media (min-width: 768px) {
		.navbar-brand {
			padding: 0px 0px;
			margin-left: 0px!important;
		}
	}
	
.navbar-default {
	background-color: transparent;
	border-color: transparent;
}

.navbar-toggle {
    border: 0 none;
    float: right;
    margin: 0;
    padding: 10px 0 0 0;
    transition: all 0.3s ease 0s;
	z-index:22;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}

.navbar-default .navbar-toggle .fa {
	float:right;
	padding-right: 15px;
}

	
.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
	background-color: transparent;
	color:#007178;
}
.navbar-default .navbar-toggle .fa {
	color: #ffffff;
}
.navbar-default .navbar-toggle.collapsed .fa {
	color: #007178;
}
.navbar-default .navbar-collapse, .navbar-default .navbar-form {
	border-color: transparent;	
	z-index:2;
	position:relative;
}
.navbar-nav > li > a {
    padding-bottom: 10px;
    padding-top: 10px;
	text-transform:uppercase;
	font-size:90%;
	text-align:center;
}
.navbar-default .navbar-nav > li > a {
	color: #007178;
}
.navbar-default .navbar-nav > li > a:hover, 
.navbar-default .navbar-nav > li > a:focus {
	background-color: transparent;
	color: #007178;
}
	@media (min-width: 768px) {
		.navbar-default .navbar-nav > li > a:hover, 
		.navbar-default .navbar-nav > li > a:focus {
			background-color: transparent;
		}
	}
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus {
	background-color: transparent;
	color: #848484;
}
.navbar-default .navbar-nav > .open > a, 
.navbar-default .navbar-nav > .open > a:hover, 
.navbar-default .navbar-nav > .open > a:focus {
	background-color: transparent;
	color: #007178;
}

.collapsing,
.in {
	background-color: rgba(0, 113, 120, 0.8);
	height:100vh;
	padding-top:100px;
}
.navbar-default .collapse.in .navbar-nav > li > a {
	color: #ffffff;
	font-size:160%;
	padding-bottom: 30px;
    padding-top: 30px;
}

/* ==============================================================================================================
full section home
============================================================================================================== */

.fullsection {
	height: 100vh;
	position:relative;
	background:#007178;
}
.fullhomeimg {
    background-image: url(../images/couch.jpg);
	background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	height: 100vh;
	width: 100%;
	margin: 0 auto;
	padding: 0;
}
	@media (max-width: 768px) {
		.fullhomeimg {
			background-attachment: unset !important;
			background-position: 30% 0 !important;
		}
	}
	@media (min-width: 768px) {
		.fullhomeimg {
			background-attachment: scroll;
			background-attachment: fixed;
			background-position: 50% 0;
		}
	}
	html.ipad .fullhomeimg,
	html.iphone .fullhomeimg	{ background-attachment: scroll!important;}
	
.fullhomegradient {
	position:absolute;
	bottom:0;
	left:0;
	height: 50vh;
	width: 100%;
	background: -moz-linear-gradient(top,  rgba(1,75,80,0) 0%, rgba(1,75,80,0.8) 100%);
	background: -webkit-linear-gradient(top,  rgba(1,75,80,0) 0%,rgba(1,75,80,0.8) 100%);
	background: linear-gradient(to bottom,  rgba(1,75,80,0) 0%,rgba(1,75,80,0.8) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00014b50', endColorstr='#b3014b50',GradientType=0 );
}	

.homeintro {
	position:absolute;
	bottom:5%;
	width:90%;
	left:5%;
	text-align:center;
	background: rgba(255, 255, 255, 0);
	padding:0px 0px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s ;
	transition: all 0.3s ;
}
.homeintro h1 {
	color:#ffffff;
	font-size:180%;
	font-weight:500;
	text-shadow: 1px 1px 0 rgba(40, 50, 50, 0.3);
	letter-spacing: -0.03em;
}
.homeintro p {
	text-align:center;
	font-family: 'Ubuntu';
	font-size:120%;
	line-height:1.3em;
	color:#ffffff;
	text-shadow: 1px 1px 0 rgba(40, 50, 50, 0.3);
}
	@media (min-width: 768px) {
		.homeintro {
			position:absolute;
			bottom:180px;
			width:100%;
			left:auto;
			text-align:right;
			background: rgba(255, 255, 255, 0);
			padding:0px 0px;
			-webkit-transition: all 0.3s;
			-moz-transition: all 0.3s ;
			transition: all 0.3s ;
		}
		.homeintro h1 {
			font-size:400%; /* was 500% 500 */
			font-weight:500;
			padding-left:20%;
			line-height:1.1em;
		}
		.homeintro p {
			padding-left:40%;
			text-align:right;
			font-size:180%; /* was 240% 1.2em */
			line-height:1.2em;
			letter-spacing: -0.01em;
		}		
	}



.headerhome .navbar-header {
	padding:0px 0px;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
	@media (min-width: 768px) {
		.headerhome .navbar-header {
			padding:40px 0px
		}
	}

.headerhome .navbar-toggle {
    float: none;
    width:100%;
	padding: 30px 30px 30px 0px;
    position: fixed;
}	
	
.navbar-default .navbar-collapse, 
.navbar-default .navbar-form {
	position:fixed;
	width:100%;
	top:0;
}
	@media (min-width: 768px) {
		.navbar-default .navbar-collapse, 
		.navbar-default .navbar-form  {
			position: relative;
			width:auto;
		}
		
	}
	
@media (min-width: 768px) {
	.headerhome .navbar-nav {
		padding:65px 0px 28px 0px;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
		margin-left:40px;
	}
	.headerhome .navbar-default .navbar-nav > li > a {
		color: #ffffff;
	}
	.headerhome.sticky.shrink .navbar-default .navbar-nav > li > a {
		color: #007178;
	}
}
	
	
	



/* ==============================================================================================================
FOOTER
============================================================================================================== */
	
#footer {
	color:#848484;
	padding-top:55px;
	padding-bottom:55px;
}
#footer p {
	margin: 0 0 0px;
}
#footer a {
	color:#848484;
}
#footer a:hover {
	color:#007178;
}
#footer a .fa{
	display:none;
}
#footer a:hover .fa{
	display:inline-block;
	padding: 0px 5px;
}
#footer .social {
	padding:0px 0px 20px 0px;
}
#footer .social  a {
	padding: 0px 3px;
	margin:0;
	color:#b9b9b9!important;
}
#footer .social  a:hover {
	color:#007178!important;
}
#footer .social a .fa{
	display:inline-block;
}
#footer .social a:hover .fa{
	padding: 0px 0px;
}

/* ==============================================================================================================
TEAM
============================================================================================================== */	

.hasbackgroundimage{
	padding-bottom:100px;
	background-image: url(../images/team.png);
	background-repeat: no-repeat;
	background-position: bottom;
	background-size: 100%;
}
	@media (min-width: 768px) {
		.hasbackgroundimage {
			padding-bottom:200px;
		}
	}
	
/* ==============================================================================================================
MASONRY
============================================================================================================== */	
.grid {
	margin-bottom:20px;
}
.grid-sizer,
.grid-item { 
	width: 100%;
	float: left;
	overflow: hidden;
	margin: 0px 0;
}
	@media (min-width: 768px) {
		.grid-sizer,
		.grid-item { 
			width: 33.333%;
		}
	}
	
.grid-item  img {
    display: block;
    margin: 0;
    width: 100%;
	padding:30px 15px 0px 15px;
	trxxansform-origin: 50% 50% 0;
	trxxansition: opacity 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s, transform 25s cubic-bezier(0.215, 0.61, 0.355, 1) 0s; will-change: opacity, transform;
}
	.grid-item:hover img {
		txxransform:scale(1.15);
		oxxpacity: 0.9;
	}
.grid-item  video {
    display: block;
    margin: 0;
    width: 100%;
	height:100%;
	padding:30px 15px 0px 15px;
}
.grid-item p {
	margin: 0;
    padding: 15px 20px 5px;
	text-align:center;
	fxxont-weight:400;
	color:#007178;
	width:100%;	
}
.grid-item p:last-child {
	margin-bottom: 0px!important;
}

/* ==============================================================================================================
COLLAGE
============================================================================================================== */

.collage {
	display:block;	
	padding-left:15px;
	padding-right:15px;
}
	@media (min-width: 768px) {
		.collage {
			height: calc(101vw - 25vw);
			overflow:hidden;
			position: relative;
			padding-left:0;
			padding-right:0;
		}
	}
.collage [class*="box"] {
	width:100%;
	position:relative;
}
	@media (min-width: 768px) {
		.collage [class*="box"] {
			width:auto;
			position:absolute;
		}
		/* box posities --------------------------------------------------- */
		.collage .box1 { /*links boven */
			height: 66.666%;
			width: 50%;
			position: absolute;
			left: 0;	
			top: 0;
			overflow: hidden;
		}
		.collage .box2 { /*links onder */
			width: 50%;
			height: 33.333%;		
			position: absolute;
			left:0; 
			bottom:0; 		
			overflow: hidden;
		}
		.collage .box3 { /*rechts boven 'links' */
			width: 25%;
			height: 33.333%;		
			position: absolute;
			right: 25%;	
			top: 0;
			overflow: hidden;
		}
		.collage .box4 { /*rechts boven 'rechts' */
			width: 25%;
			height: 33.333%;		
			position: absolute;
			right: 0;	
			top: 0;
			overflow: hidden;
		}
		.collage .box5 { /*rechts onder */
			height: 66.666%;
			width: 50%;
			position: absolute;
			bottom: 0; 
			right: 0;
			overflow: hidden;
		}
	}


/* box inhoud --------------------------------------------------- */	
.collage img	{
	width:100%; 
	height:100%;
}
.collage video	{
	height:100%;
	text-align:center; 
	margin-left:-170px;
}
		
/* box A effect --------------------------------------------------- */	
.collage a {
	position:absolute;
	width:100%;
	height:100%;
	z-index: 1;
	background:transparent;
	color:#ffffff!important;
	opacity:1;
}
.box1 a { bottom:0; right:0;}
.box2 a { top:0; right:0;}
.box3 a { bottom:0; right:0;}
.box4 a { bottom:0; left:0;}
.box5 a { bottom:0; left:0;}
		
	@media (min-width: 768px) {
		.collage a {
			display:block;
			position:absolute;
			width:50%;
			height:10%;
			z-index: 1;
			background:transparent;
			transition: all 0.4s ease 0s;
			color:#ffffff!important;
		}
		
		.box1 a { bottom:0; right:0;}
		.box2 a { top:0; right:0;}
		.box3 a { bottom:0; right:0;}
		.box4 a { bottom:0; left:0;}
		.box5 a { bottom:0; left:0;}
		
		.collage a:hover {
			width:100%;
			height:100%;
			background:#007178;
			opacity:0.95;
		}
	}

.collage a span.titel {
	display:block;
	background:#007178;
	padding: 5px 30px;
	position:absolute;
	bottom:20px;
	right:20px;
}
	@media (min-width: 768px) {
		.collage a span.titel {
			position:absolute;
		}
		.box1 a span.titel { bottom:0; right:0;}
		.box2 a span.titel { bottom: auto; top:0; right:0;}
		.box3 a span.titel { bottom:0; right:0;}
		.box4 a span.titel { bottom:0; left:0; right:auto;}
		.box5 a span.titel { bottom:0; left:0; right:auto;}
	}

.collage a span.intro {
	display:none;
	opacity:0;
	color:#007178;
	text-align:center;
	color:#a1cbce;
	padding: 0px 0px;
	width:80%;	
	left: 50%;
	top:50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
}
.box3 a span.intro {
	width:90%;	
}
.box4 a span.intro {
	width:90%;	
}
	@media (min-width: 768px) {
		.collage a:hover span.intro {
			display:block;
			position:absolute;			
			opacity:1;
			font-size:80%;
			line-height:1.3em;
		}
	}

.collage a span.intro img	{
	display:block; 
	max-width:100%; 
	width:auto; 
	height:auto; 
	margin-left: auto;
	margin-right: auto; 
	padding-bottom:10px;
}
.collage a span.intro .meer {
	color:#ffffff;
	font-weight:500;
}	
	
/* ==============================================================================================================
WORK
============================================================================================================== */	
#work {
	padding-top:0px;
	position: relative;
}
.wrap-images {
    position: absolute;
    top: 0;
    left:0;
    height: 100vh;
    width: 100%;
    z-index: -10;
	background-image: url(../images/table.jpg);
	opacity: 0.2;
}
.bigimg {
    position: absolute;
    top: 0;
    left:0;
    height: 100vh;
    width: 100%;
    background-position: center center;
    background-repeat: no-repeat;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
    transition: all 0.5s ease-in-out;
    opacity: 0;
}
.wrap-links {
    display: table;
	height: 100vh;
    width: 100%;
    vertical-align: middle;
	padding-top: 100px;
}
.wrap-links div {
	mxxargin-top:200px;
	display: table-cell;
	vertical-align: middle;
	width: 100%;
}
.wrap-links div a {
	display: block;
	text-align: center;
	font-family: 'Open Sans';
	font-weight: 300;
	font-size: 140%;
	line-height: 1.2em;
	color: #007178;
	padding: 10px 20px;
}
	@media (min-width: 768px) {
		.wrap-links div a {
			font-weight: 300;
			font-size:200%;
			line-height:1.1em;
			padding:15px 0px;
		}
	}
		
.wrap-links div a:hover {			
	background: #007178;
	color: rgba(255, 255, 255, 0.8);
}


/* ==============================================================================================================
SLIDER
============================================================================================================== */

.carousel-control .glyphicon-chevron-left, 
.carousel-control .glyphicon-chevron-right, 
.carousel-control .icon-prev, 
.carousel-control .icon-next {
   display:none;
}		
.carousel-control.left,
.carousel-control.right
 {
    background-image: none;
}

.carousel-fade .carousel-inner .item {
  opacity: 0;
  transition-property: opacity;
}

.carousel-fade .carousel-inner .active {
  opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}

.carousel-fade .carousel-control {
  z-index: 2;
}

/*
WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
now override the 3.3 new styles for modern browsers & apply opacity
*/
@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-fade .carousel-inner > .item.next,
    .carousel-fade .carousel-inner > .item.active.right {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.prev,
    .carousel-fade .carousel-inner > .item.active.left {
      opacity: 0;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
    .carousel-fade .carousel-inner > .item.next.left,
    .carousel-fade .carousel-inner > .item.prev.right,
    .carousel-fade .carousel-inner > .item.active {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0);
              transform: translate3d(0, 0, 0);
    }
}

.carousel-indicators {	
	top:50%;
    bottom: auto;
	border:0;
	line-height:82px;
	margin-bottom: 0px;
	height:82px;
	margin-top: -41px; /* Half the height */
	margin-left: auto;
	width: 100%;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
}

.carousel-indicators li {
    background: transparent url(../stdimg/see.png) no-repeat;
    border: 0px solid #fff;
    border-radius: 0
    cursor: pointer;
    display: inline-block;
    height: 82px;
    margin: 1px;
    text-indent: -999px;
    width: 31px;
}

.carousel-indicators .active {
    background: transparent url(../stdimg/see-active.png) no-repeat;
    height: 82px;
    width: 111px;
}


		
/* ==============================================================================================================
CONTACT
============================================================================================================== */			
#contact {
	height: 300px; /* was height: 100vh; */
    width: 100%; 
}
	@media (min-width: 768px) {
		#contact {
			height: 500px; /* was height: 100vh; */ 
		}
	}
		
#map-canvas { 
	height: 300px;  /* was height: 100vh; */
	width: 100%; 
	position:absolute; 
	top: 0; 
	left: 0; 
	z-index: 0; /* Set z-index to 0 as it will be on a layer below the contact form */
}	
	@media (min-width: 768px) {
		#map-canvas { 
			height: 500px;  /* was height: 100vh; */	
		}
	}	

.custommarker{
	background: #007178;
	border-radius: 50%;
	height: 8px;
	width: 8px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: 11px 0px 0px -12px;
	z-index:20;
}
.custommarker:after {
	content: "";
	border-radius: 50%;
	height: 40px;
	width: 40px;
	position: absolute;
	margin: -16px 0 0 -16px;
	animation: pulsate 2s ease-out;
	animation-iteration-count: infinite;
	opacity: 0;
	background-color:#008299;
	bxxox-shadow: 0 0 1px 2px #007178;
	animation-delay: 1.1s;
	z-index:1;
}

@keyframes pulsate {
  0% {
    transform: scale(0.1, 0.1);
    opacity: 1;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    transform: scale(2.6, 2.6);
    opacity: 0;
  }
}	

.adp, .adp table {
    color: #848484;
    font-family: 'Open Sans';
	width:100%;
}
.adp-placemark {
    background: #ffffff!important;
    border: 0px solid silver!important;
	
    color: #007178;
    cursor: pointer;
    margin: 10px 0;
    vertical-align: middle;
}
.adp div:nth-of-type(2) table.adp-placemark {border-bottom:2px solid #007178!important;}
.adp div:nth-of-type(3) > div:nth-of-type(3) table.adp-placemark {border-top:2px solid #007178!important;}

.adp-placemark td:first-child {display: none;}

.adp-text {
	color:#007178;
	padding: 8px 0px;
}

.adp-summary,
.adp-details {
    color: #848484;
	font-size:75%;
}
.adp-legal {
    color: #a4a4a4;
	font-size:60%;
}


/* ==============================================================================================================
GENERAL REST
============================================================================================================== */

#content {
	padding-top:115px;
}
#content.homepage {
	padding-top:0px;
}
	@media (min-width: 768px) {
		#content {
			padding-top: 144px; 
		}
		#content.homepage {
			padding-top: 0px; 
		}
	}

.specs {
	padding:0;
	margin:0 0 30px 0;
}
.specs p:last-child {
    margin-bottom:0px;
}
	
/* ul -----------------------------------------------------------------------*/					

ul.links {
	padding:0;
	margin:0 0 15px 0;
}
ul.links li{
	list-style-type: none;
	padding:2px 0px;
}
ul.links li a{
	background:#007178;
	color:#ffffff;
	border-radius: 3px;
	padding:0px 8px;
}
ul.links li a .fa{
	display:none;
}
ul.links li a:hover .fa{
	display:inline-block;
	padding: 0px 5px;
}					
				
/* a ---------------------------------------------------------------------------*/	
a {
	text-decoration:none;
	outline: 0;
	outline: none!important;
	color:#007178;
}
a:link {
	text-decoration:none;
}
a:visited {
	text-decoration:none;
}
a:hover {
	text-decoration:none;
	color:#007178;
}
a:active {
	text-decoration:none;
	outline: 0;
	outline: none!important;
}
a:focus {
	text-decoration:none;
	outline: 0;
	outline: none!important;
}	
		
/* tables-----------------------------------------------------------------------*/		

table {
	margin:0 0 15px 0;
	border-collapse: collapse;
}
th, td {
	vertical-align:top;
	padding:8px 14px;
	border-bottom:1px solid #f0f0f0;
}	


/* forms-----------------------------------------------------------------------*/
.mandatory {
	font-size:80%;
	padding-bottom:10px;
}
label {
	display:block !important;
	font-weight: 600!important;
	font-size:90%;
}
label.error {
	color:#dc4949;
}
.diverror {
	color:#ffffff;
	background: #dc4949;
	border-radius: 3px;
	padding:10px 25px;
	font-size:85%;
}
.divok {
	background:#2cb961;
	color:#ffffff;
	border-radius: 3px;
	padding:10px 25px;
	font-size:85%;
}
.knop {
	background:#039aa3;
	border-color:#039aa3;
	border-width:0px;
	border-radius: 3px;
	color:#ffffff;
	font-weight: 600;
	padding:6px 12px;
	margin: 15px 0px;
}

input[type="radio"] {
    display:inline-block !important;
}
input[type="radio"] + label {
	display:inline-block !important;
	font-weight:300 !important;
}

	
/* ===================================================================================================================================================
LOSSE MEDIA QUERIES
=================================================================================================================================================== */

@media (min-width: 768px) {	

		.columns-2 { 
			-webkit-column-count: 2;
			-moz-column-count: 2;
			column-count: 2;
			-webkit-column-gap: 40px;
			-moz-column-gap: 40px;
			column-gap: 40px;
		}
		.container-fluid.nopad {
			padding-left: 0px;
			padding-right: 0px;
		}
		.collage .caption { 
			width:auto;
		}
		.box1 .caption { 
			top:55%; 
			right:0; 
			padding-right:10%; 
			width:80%; 
			text-align:right;
		}
		.box1 .caption h5 { 
			font-size:210%; 
			line-height:1.25em;  
		}
		
		
}








