body {
	margin: 0;
	color: black;
	font-family: "Poppins", sans-serif; /* lettertype volgens nieuw ontwerp */
	font-style: normal;
	font-size:16px;
	font-weight: 250;
	overflow-x: hidden;
}

body::-webkit-scrollbar {
  display: none;
}

.background {
	position: fixed;
	top: 125px;
	left: 50%;
	transform: translate(-50%,0);
	width: 471px;
	height: 632px;
	background: url('/images/info1-image.png') no-repeat center center;
	background-size: cover;
	z-index: -1;
}

/* a window to see fixed background behind contents */
.background-view {
	height: 450px;
	background-color: none;
}

.error {
	margin-top: 200px;
	margin-bottom: 100px;
}

a {
	text-decoration: none;
	color: white;
}

a:hover {
	color: #5F9EA0;
}

.navbar_row {
	position: fixed;
	left: 0;
	right: 0;
	top: 10px;
	height: 100px;
	z-index: 1000;
}

.nav-link {
	color: #006300;
	font-weight:600;
}

.evssense-link {
	border: 1px solid #006300;
	border-radius: 5px;
	font-size: 14px;
	font-weight: 200 !important;
	width: 150px;
	margin-bottom: 10px;
}

.header, .choose, .info, .paragraph, .highlight-top, .highlight-middle, .highlight-bottom, .detail, .quotes, .contact, .footer, .imageview {
	position: relative;
	left: 0;
	right: 0;
	width: 472px;
	background-repeat: no-repeat;
}

.header {
	background-color: #006300;
	height: 400px;
}

.choose {
	height: 875px;
	background-color: white;
}

.header-title {
	position: absolute;
	color: white;
	font-weight: 700;
	line-height:120%;
	top: 140px;
	font-size: 48px;
}

.header-subtitle {
	position: absolute;
	top: 255px;
	color: white;
	font-weight: 200;
	font-size: 28px;
}

.evs-circle {
	position: absolute;
	width: 74px;
	height: 74px;
	border-radius: 37px;
	border: 14px solid #5F9EA0;
	background-color: white;
}

.vline {
	position: absolute;
	width:14px;
	background-color: #5F9EA0;
}

.hline {
	position: absolute;
	height:14px;
	background-color: #5F9EA0;
}

.button {
	position: relative;
	height: 50px;
	width: 150px;
	border-radius: 25px;
	font-size: 14px;
	font-weight: 500;
	padding-left: 12px;
	padding-top: 14px;
	cursor: pointer;
}

.button-circle {
	position: absolute;
	top: 9px;
	left: 112px;
	width: 31px;
	height: 31px;
	border-radius: 12px;
	background-image: url("/images/button_bullit.png");
}

.header-home {
	height: 700px;
	background-color: white;
	background-image: url("/images/headerbg_xs_home.png");
}

.line1 {
	top: 717px;
	left: 1366px;
	height: 304px;
	z-index: 10;
}

.vline-header1 {
	left: 55px;
	height: 135px;
	background-color: white;
}

.vline-header2 {
	top: 350px;
	left: 55px;
	height: 260px;
	background-color: white;
}

.evs-circle-header1 {
	top:400px;
	left: 25px;
	background-color: #006300;
	border: 14px solid white;
}

.vline-header3 {
	top: 566px;
	left: 55px;
	height: 67px;
}

.hline-header1 {
	top: 625px;
	left: 55px;
	width: 417px;
}

.button-header1 {
	position: absolute;
	top: 400px;
	left: 100px;
	background-color: white;
	color: #5F9EA0;
}

.button-header1:hover {
	background-color: #5F9EA0;
	color: white;
}

.freebutton {
	position: absolute;
	top: 557px;
	left: 200px;
	width: 150px;
	height: 150px;
	padding-top: 20px;
	border-radius: 75px;
	border: 14px solid #006300;
	background-color: #006300;
	cursor: pointer;
	color: white;
	z-index: 2;
}

.free {
	font-size:24px;
	font-weight: 500 !important;
	line-height: 80%;
}

.advice {
	font-size:18px;
	font-weight: 500 !important;
}

.arrow {
	position: relative;
	width: 55px;
	height: 35px;
	top: 7px;
	left: 35px;
	z-index: 10;
	background-image: url("/images/arrow_large_white.svg");
	background-repeat: no-repeat;
}

.freebutton:hover {
	background-color: white;
	color: #006300;
	border: 14px solid #5F9EA0;
	z-index: 3;
}

.freebutton:hover .arrow {
	background-image: url("/images/arrow_large_green.svg");
	background-repeat: no-repeat;
}

.title {
	font-size:28px;
	font-weight: 600;
	color: #006300;
	line-height: 100%;
	margin-top: 25px;
}

.why {
	position: relative;
	width: 300px;
	height: 250px;
}

.why-bullit {
	position: absolute;
	top:10px;
	width: 100px;
	height: 100px;
	border-radius: 50px;
	cursor: pointer;
	color: white;
	background-color: #006300;
	
}

.why-bullit-label {
	position: absolute;
	top: 100px;
	width: 200px;
	height: 50px;
	cursor: pointer;
	color: #006300;
	padding-top: 25px;
	font-weight: 600;
	font-size: 18px;
}

.why-bullit-text {
	position: absolute;
	top: 150px;;
	width: 300px;
	height: 100px;
	cursor: pointer;
	color: black;
	font-size: 16px;
	padding-top: 25px;
}

.why-bullit1-home {
	background-image: url("/images/energy-bullit.png");
}

.why-bullit1-home:hover {
	background-image: url("/images/energy-bullit-hover.png");
}

.why-bullit2-home {
	background-image: url("/images/service-bullit.png");
}

.why-bullit2-home:hover {
	background-image: url("/images/service-bullit-hover.png");
}

.why-bullit3-home {
	background-image: url("/images/subsidie-bullit.png");
}

.why-bullit3-home:hover {
	background-image: url("/images/subsidie-bullit-hover.png");
}

.why-bullit1-vve {
	background-image: url("/images/deskundig.png");
}

.why-bullit1-vve:hover {
	background-image: url("/images/deskundig-hover.png");
}

.why-bullit2-vve {
	background-image: url("/images/betrokken.png");
}

.why-bullit2-vve:hover {
	background-image: url("/images/betrokken-hover.png");
}

.why-bullit3-vve {
	background-image: url("/images/transparant.png");
}

.why-bullit3-vve:hover {
	background-image: url("/images/transparant-hover.png");
}

.why-bullit3-company {
	background-image: url("/images/homecharger.png");
}

.why-bullit3-company:hover {
	background-image: url("/images/homecharger-hover.png");
}

.hline-choose1 {
	top: 146px;
	left: 1230px;
	width: 150px;
}

.hline-choose2 {
	top: 146px;
	width: 136px;
}

.vline-choose1 {
	left: 0px;
	top: 146px;
	height: 660px;
}

.evs-circle-choose1 {
	top: 200px;
	left: -30px;
}

.highlight-card {
	position: relative;
	top: 90px;
}

.highlight-card {
	position: relative;
	height: 440px;
	margin: auto;
}

.highlight-title {
	color: white;
	font-size: 32px;
	font-weight: 600;
	line-height: 135%;
}

.highlight-top {
	height: 350px;
	background-color: #659B81;
	z-index: 5;
}

.highlight-middle {
	height: 365px;
	background-image: linear-gradient(#659B81, #006300);
}

.highlight-bottom {
	height: 1050px;
  background-color: white;
}

.button-highlight {
	background-color: white;
	color: #5F9EA0;
	top: 40px;
	padding-left: 20px;
	z-index: 20;
}

.info {
	height: 1525px;
	background-color: white;
}

.detail {
	height: 875px;
	background-color: white;
}

.quotes {
	height: 1125px;
	top: -2px;
	background-color: white;
}

.contact {
	top: -3px;
	height: 600px;
	background-color: #eeeeee;
	padding-top: 35px;
	font-size: 14px;
}

.footer {
	top: -4px;
	height: 250px;
	padding-top: 35px;
	background-color: black;
	font-size: 12px;
	color: white;
	font-weight: 200;
	line-height: 135%;
}

@media(min-width: 576px) {
/* Bootstrap breakpoint xs -> sm */
	.header, .choose, .info, .paragraph, .highlight-top, .highlight-middle, .highlight-bottom, .detail, .quotes, .contact, .footer, .imageview {
		width: 1380px;
		margin: auto;
	}
	
	.background {
		top: -550px;
		width: 1379px;
		height: 1855px;
	}

	.header-home {
		height: 862px;
		background-color: white;
		background-image: url("/images/website_welcome.png");
	}
	
	.header-title {
		top: 192px;
		left: 96px;
		font-size: 64px;
	}
	
	.header-subtitle {
		left: 96px;
		top: 360px;
	}
	
	.button-header1 {
		left: 96px;
		top: 425px;
	}
	
	.freebutton {
		top: 606px;
		left: 768px;
		width: 228px;
		height: 228px;
		padding-top: 40px;
		border-radius: 114px;
	}
	
	.free {
		font-size:40px;
		font-weight: 700 !important;
		line-height: 95%;
	}
	
	.advice {
		font-size:28px;
		font-weight: 600 !important;
	}
	
	.freebutton:hover {
		background-color: white;
		color: #006300;
		border: 14px solid #5F9EA0;
		padding-top: 40px;
	}
	
	.arrow {
		top: 25px;
		left: 75px;
	}
	
	.vline-header1 {
		top: 0px;
		left: 450px;
		height: 250px;
	}
	
	.vline-header2 {
		top: 425px;
		left: 450px;
		height: 190px;
	}
	
	.evs-circle-header1 {
		top:500px;
		left: 420px;
	}
	
	.vline-header3 {
		top: 615px;
		left: 450px;
		height: 105px;
	}
	
	.hline-header1 {
		top: 717px;
		left: 450px;
		width: 930px;
	}
	
	.choose {
		height: 350px;
	}
	
	.title {
		font-size:48px;
	}
	
	.highlight-top, .highlight-middle, .highlight-bottom {
		height: 270px;
	}
	
	.info {
		height: 825px;
		background-color: white;
	}
	
	.info-large {
		height: 1150px;
	}

	.vline-info1 {
		left: 0px;
		top: 0px;
		height: 750px;
	}
	
	.hline-info1 {
		left: 0px;
		top: 750px;
		width: 450px;
	}
	
	.evs-circle-info1 {
		top: 720px;
		left: 445px;
	}
	
	.header-advies {
		background-image: url("/images/advies.png");
		height: 785px;
	}
	
	.header-vve {
		height: 500px;
	}
	
	.header-bedrijven {
		height: 500px;
	}
	
	.header-verhuur {
		height: 500px;
	}
	
	.header-sense {
		height: 500px;
	}
	
	.highlight-title {
		font-size: 40px;
	}
	
	.detail {
		height: 425px;
	}
	
	.quotes {
		height: 500px;
	}
	
	.contact {
		height: 425px;
	}

}

.button2 {
	position: relative;
	top: 80px;
	background-color: #5F9EA0;
	color: white;
}

.button3:hover {
	background-color: #5F9EA0;
	color: white;
}

.button2:hover, .button4:hover {
	background-color: white;
	color: #5F9EA0;
}

.button4 {
	background-color: #5F9EA0;
	color: white;
	padding-left: 20px;
}

.list-title {
	font-weight: 500;
}

.line7 {
	top: 0px;
	left: 1250px;
	height: 250px;
	background-color: white;
}

.evs-circle2 {
	top: 248px;
	left: 1220px;
	border-color: white;
	background: none;
	z-index: 10;
}

.line8 {
	top: 55px;
	left: 1250px;
	height: 104px;
	background-color: white;
}

.line9 {
	top: 145px;
	left: 97px;
	width: 1153px;
	background-color: white;
}

.line10 {
	top: 145px;
	left: 97px;
	height: 120px;
	background-color: white;
}

.line11 {
	top: 0px;
	left: 97px;
	height: 300px;
}

.line12 {
	top: 400px;
	left: 97px;
	height: 100px;
}

.line13 {
	top: 486px;
	left: 97px;
	width: 750px;
}

.highlight-picture {
	position: absolute;
	top: 0px;
	width: 300px;
	height: 300px;
}

.highlight-picture-label {
	position: absolute;
	top: 315px;
	width: 300px;
	cursor: pointer;
	color: #006300;
	font-weight: 600;
	font-size: 18px;
}

.highlight-picture-text {
	position: absolute;
	top: 355px;
	width: 300px;
	height: 100px;
	color: black;
	font-weight: 200;
	font-size: 16px;
	cursor: pointer;
	line-height: 135%;
}

.b500 {
	font-weight: 500;
}

.quote {
	position: relative;
	margin: auto;
	top: 25px;
	width: 300px;
	height: 325px;
	color: black;
	font-weight: 200;
	font-size: 14px;
	line-height: 135%;
	border: 1px solid #b8e987;
	border-radius: 10px;
}

.qoute-picture {
	position: relative;
	top: 50px;
	left: 40px;
	width: 220px;
	height: 100px;
}

.qoute-text {
	position: relative;
	top: 75px;
	left: 10px;
	width: 280px;
	height: 100px;
	font-weight: 200;
}

.quote-reference {
	position: relative;
	top: 45px;
	height: 25px;
	left: 10px;
	width: 280px;
	font-weight: 400;
}

.quote-info {
	position: relative;
	top: 50px;
	left: 10px;
	width: 280px;
	height: 25px;
	font-size: 12px;
	font-weight: 200;
}


.contact-question {
	font-weight: 400;
	letter-spacing: 5px;
}

.contact-title {
	margin-top: 10px;
	font-size: 36px;
	font-weight: 600;
}



@media(min-width: 768px) {
/* Bootstrap breakpoint sm -> md */
	.evssense-link {
		margin-bottom: 0px;
	}
}

@media(min-width: 992px) {
/* Bootstrap breakpoint md -> lg */
}

@media(min-width: 1200px) {
/* Bootstrap breakpoint lg -> xl */
}

@media(min-width: 1400px) {
/* Bootstrap breakpoint xl -> xxl */
}