:root {
	--hcgrey: #efefef;
	--hcdark: #15374b;
	--hcdarkblue: #0671B3;
	--hcblue: #009ee2;
	--hcgreen: #00954E;
	--hclightgreen: #87CE2E;
	--hcorange: #f9b233;
  }

body {
	background-color: var(--hcgrey);
	overflow-x: hidden;
}

.bg-theme-grey{
	background-color: var(--hcgrey);
}

.text-theme {
	color: var(--hcblue);
}

.text-theme-lightgreen {
	color: var(--hclightgreen) !important;
}

.text-theme-green {
	color: var(--hcgreen) !important;
}

.text-theme-orange {
	color: var(--hcorange) !important;
}

.text-theme-darkblue {
	color: var(--hcdarkblue) !important;
}

/* Top nav */
a.top-nav{
	line-height: 20px;
	text-decoration: none;
	display: inline-block;
	color:var(--hcdark)!important;
	padding: 12px 0px;
	font-size: 18px;
	font-weight: 400;
	margin:0px 16px;
}

a.top-nav.active{
	color: var(--hcblue)!important;
	border-bottom: 2px solid var(--hcblue);
}

a.top-nav:hover{
	color: var(--hcblue) !important;
}

/* navbar */
.navbar {
	-moz-box-shadow: 0 5px 5px rgba(23, 46, 77, 0.15);
	-webkit-box-shadow: 0 5px 5px rgba(23, 46, 77, 0.15);
	box-shadow: 0 5px 5px rgba(23, 46, 77, 0.15);
	line-height: 80px;
}

.navbar-light .navbar-nav .nav-link{
	color: var(--hcdark);
	font-size: 18px;
	font-weight: 400;
}

.navbar-light .navbar-nav .nav-link:hover{
	color: var(--hcblue);
}

.navbar-light .navbar-nav .contact{
	color: #fff;
	font-size: 18px;
	font-weight: 400;
	background-color: var(--hcblue);
	border-radius: 30px;
	padding: 10px 20px;
	text-decoration: none;
}

.navbar-light .navbar-nav .contact:hover {
	background-color: var(--hcdarkblue);
}
.navbar-brand {
	margin-top: -10px;
}

.navbar-toggler {
	border: 0px;
	color: var(--hcdark);
}

.navbar-toggler:hover {
	color: var(--hcblue);
}
/* END navbar */

/* Jumbotron */
.bg-theme-header {
	background: url(../img/header.jpg);
	background-position-x: 0%;
	background-position-y: 0%;
	background-repeat: repeat;
	background-attachment: scroll;
	background-size: auto;
	background-position-x: 0%;
	background-position-y: 0%;
	background-repeat: repeat;
	background-attachment: scroll;
	background-size: auto;
	/* box-shadow: inset 0 0 0 1000px rgba(34,61,62,.7); */
	background-attachment: fixed;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 1;
}

.bg-theme-header:after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	z-index: -2;
	opacity: 0.3;
	background: linear-gradient(to right, #f9b233, #009640);
	background: linear-gradient(45deg, rgba(249, 178, 51, 1) 10%, rgba(0, 159, 227, 1) 50%, rgba(0, 150, 64, 1) 90%);
	z-index: 9;
}

h1 {
	font-size: 3.5rem;
	font-size: 46px;
	font-weight: 300;
	line-height: 1.2;
}

@media only screen and (max-width: 600px) {
	h1 {
		font-size: 1.8rem;
		font-weight: 300;
		line-height: 1.2;
	}
}

	/* END Jumbotron */
	.position {
		padding-top: 40px;
		margin-top: -40px;
	}

	.container {
		max-width: 1300px;
	}

	footer {
		color: #acb7bf;
	}

	footer a:link,
	footer a:visited {
		color: #acb7bf;
		text-decoration: none;
	}

	footer a:hover,
	footer a:active {
		color: var(--hcblue);
	}

	.footer-brand img{
		max-width: 250px;
	}

	.btn-primary {
		color: #fff;
		background-color: var(--hcblue);
		border-color: var(--hcblue);
		display: inline-block !important;
	}

	/* cards */
	.bg-dark-theme{
		background-color: var(--hcdark);
	}

	.card-hover {
		transition: .3s ease-in-out;
		box-shadow: 0 0 11px #eaf0f6;
	}

	.card-hover:hover {
		box-shadow: 0 10px 50px -5px rgba(51, 71, 91, 0.12);
		-webkit-transform: scale(1.014);
		transform: scale(1.014);
	}

	/* END cards */

	/* badge */
	.badge-light {
		color: var(--hcdark);
		background-color: var(--hcgrey);
		font-size: 13px;
		font-weight: normal;
	  }

	.space-large {
		margin: 120px 0px;
	}

	img.img-blow {
		height: auto;
		width: 120% !important;
		margin: 80px 0px 80px 0px;
		z-index: 999;
	}

	img.img-blow-right {
		height: auto;
		width: 120% !important;
		margin: 80px 0px 80px -20%;
		z-index: 999;
	}

	.shadow-img {
		box-shadow: 0 10px 50px -5px rgba(51, 71, 91, 0.3);
		-moz-box-shadow: 0 10px 50px -5px rgba(51, 71, 91, 0.3);
		-webkit-box-shadow: 0 10px 50px -5px rgba(51, 71, 91, 0.3);
		-o-box-shadow: 0 10px 50px -5px rgba(51, 71, 91, 0.3);
		/*
	box-shadow: 30px 30px  0px rgba(248,177,51,0.9);
  -moz-box-shadow: 30px 30px  0px rgba(248,177,51,0.9);
  -webkit-box-shadow: 30px 30px 0px rgba(248,177,51,0.9);
  -o-box-shadow: 30px 30px 0px rgba(248,177,51,0.9);
  */
	}

	.text-box-right {
		max-width: 480px;
		margin: 140px 100px 140px 20%;
	}

	.text-box-left {
		max-width: 480px;
		margin: 140px 20% 140px 100px;
	}

	@media only screen and (max-width: 1100px) {
		.text-box-right {
			margin: 140px 65px 140px 20%;
		}

		.text-box-left {
			margin: 140px 20% 140px 65px;
		}
	}

	@media only screen and (max-width: 1000px) {
		.text-box-right {
			margin: 140px 20px 140px 16%;
		}

		.text-box-left {
			margin: 140px 16% 140px 20px;
		}
	}

	@media (max-width: 768px) {
		.chc {
			margin-left: 16px;
			margin-right: 16px;
		}

		.text-box-right {
			margin: 32px 16px 32px 16px;
			max-width: 100%;

		}

		.text-box-left {
			margin: 32px 16px 32px 16px;
			max-width: 100%;
		}

		img.img-blow {
			height: auto;
			width: 100% !important;
			margin: 0px 0px 0px 0px;
			z-index: 999;
		}

		img.img-blow-right {
			height: auto;
			width: 100% !important;
			margin: 0px 0px 0px 0%;
			z-index: 999;
		}
	}

	.typed7 {
		font-size: 24px;
		letter-spacing: 1px;
		color: #FFF;
		line-height: 32px;
	}

	.typo,
	.img {
		float: left;
		font-size: 36px;
		line-height: 68px;
	}

	.cht-sticky {
		position: -webkit-sticky;
		position: sticky;
		top: 70px;
		height: 100%;
	}

	.bg-header {
		background-image: url(../img/bg-header.png);
		background-position: center right;
		background-repeat: no-repeat;
	}

	.bg-header-dia {
		background-image: url(../img/bg-header-dia.png);
		background-position: center right;
		background-repeat: no-repeat;
	}

	img.gif-sm {
		display: none;
	}

	@media (max-width: 768px) {

		img.gif-sm {
			display: block;
		}

		.typo-big {
			display: none;
		}

		.cht-sticky {
			position: -webkit-relative;
			position: relative;
			top: 0;
			height: 100%;
		}

		.bg-sm-grey {
			background-color: #f2f2f2;
		}

		.bg-header {
			background-image: none;
		}

		.sm-block {
			width: 100%;
			display: block;
		}
	}

	.bg-theme {
		background-color: #f8b133;
	}

	.bg-dark-theme {
		background-color: #16384c;
	}

	.bg-img-theme {
		background-image: url(../img/bg.png);
		background-position: bottom right;
		background-repeat: no-repeat;
	}

	/* Scroll spy*/
	.dotnav {
		position: fixed;
		top: 20%;
		right: 24px;
		width: 12px;
		z-index: 9999;
		list-style-type: none;
	}

	.dotnav ul {
		position: relative;
	}

	.dotnav ul li {
		position: relative;
		padding-bottom: 20px;
		color: var(--hcblue);
	}

	.dotnav a.nav-link {
		display: block;
		width: 12px;
		height: 12px;
		text-indent: -9999px;
		border-radius: 50%;
		border: 2px solid;
		border-color: #D3D8DE;
		text-decoration: none;
		padding: 0px;
		margin: 0px;
	}

	.dotnav a.nav-link:hover {
		border-radius: 50%;
		background-color: var(--hcblue);
		border-color: var(--hcblue);
		text-decoration: none;
	}

	.dotnav a.nav-link.active {
		border-radius: 50%;
		background-color: var(--hcblue);
		border-color: var(--hcblue);
		text-decoration: none;
	}

	.label {
		position: relative;
		top: -60%;
		left: -200%;
		width: 100%;
		text-align: right;
		font-size: 1em;
		color: #343938;
		display: none;
	}

	.dotnav a.nav-link:hover .label {
		display: block;
	}

	.text-theme {
		color: #f8b133;
	}

	.imgwrapperharry {
		background-image: url(../img/harry-korthals.png);
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		background-position: center;
	}

	.imgwrapperewout {
		background-image: url(../img/ewout-kuiper.png);
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		background-position: center;
	}

	.imgwrappervesitiging {
		background-image: url(../img/vestiging.png);
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		background-position: center;
	}