:root {
	--colg1: #f0fad9;
	--colg2: #dff6b4;
	--colg3: #c1e589;
	--colg4: #9ecc65;
	--colg5: #72ab38;
	--colg6: #599328;
	--colg7: #427b1c;

	--coly1: #fef3cb;
	--coly2: #fee498;
	--coly3: #fed165;
	--coly4: #fdbe3f;
	--coly5: #fc9f00;
}

@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: normal;
	src: url(poppins-light.woff2) format('woff2');
}
@font-face {
	font-family: 'Poppins';
	font-style: normal;
	font-weight: bold;
	src: url(poppins-semibold.woff2) format('woff2');
}
@font-face {
	font-family: 'Poppins';
	font-style: italic;
	font-weight: normal;
	src: url(poppins-lightitalic.woff2) format('woff2');
}
@font-face {
	font-family: 'Poppins';
	font-style: italic;
	font-weight: bold;
	src: url(poppins-semibolditalic.woff2) format('woff2');
}

html {
	scroll-behavior: smooth;
}
* {
	box-sizing: border-box;
}
body {
    margin: 0;
    padding: 0;
	font-family: 'Poppins';
	font-size: 18px;
	line-height: 1.5em;
	text-align: left;
    color: #555;
    background-color: #fff;
}

p, h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: normal; }
img { border: none; }
table { border-collapse: collapse; }
.clear { clear: both; }


/* Bootstrap Standard Breakpoints */
/******************** Extra small devices <576 (portrait phones) Mobile first! ********************/


header nav {
	height: 40px;
}
header .container {
	width: 100%;
	height: 740px;
	margin-bottom: 80px;
	background-image: linear-gradient(to right top, #fdbe3f, #fed165, #fed165, #fee498, #fef3cb);
	/*background-image: linear-gradient(to right top, var(--coly4), var(--coly3), var(--coly3), var(--coly2), var(--coly1));*/
	box-shadow: 0 6px 12px 0 var(--coly5);
}
header .container .headliner {
	max-width: 1400px;
	margin: 0 auto;
}
header .container .headliner .flexc {
	max-width: 1200px;
	margin: 0 auto;
	display: flex;
	justify-content: center;
}
header .container .headliner .flexc .logo {
	position: relative;
	top: -60px;
	padding: 40px;
	border-radius: 50% 50% 50% 50%;
	box-shadow: 0 0 30px 0 #fff;
	background-color: #fff;
}
header .container .headliner .flexc .logo img {
	width: 180px;
}
header .container .headliner section {
	margin: 0 4vw 0;
}
header .container .headliner section .content {
	max-width: 1200px;
	margin: 0 auto;
}
header .container .headliner section .content .claim {
	max-width: 576px;
	margin-bottom: 2vw;
	font-weight: bold;
	font-size: 16vw;
	line-height: 1em;
	text-transform: uppercase;
    color: var(--colg5);
	text-shadow: 0 0.3vw 1.2vw var(--coly1);
}
header .container .headliner section .content .subclaim {
	max-width: 640px;
	margin-bottom: 40px;
	padding: 5px 10px;
    color: var(--colg6);
	background-color: var(--coly1);
	box-shadow: -1px 2px 4px 0 var(--coly4);
}
header .container .headliner section .content h1 {
	max-width: 840px;
	margin: 0 auto;
	text-align: center;
	font-size: 30px;
	line-height: 1.5em;
	font-weight: bold;
	color: var(--colg5);
	text-shadow: 0 0.3vw 1.2vw var(--coly1);
}


main a {
    color: #a12b00;
    text-decoration: underline;
}
main a.button {
	padding: 18px 18px 15px;
	text-decoration: none;
	border-radius: 6px;
	background-color: var(--coly3);
	box-shadow: 0 2px 4px 0 var(--coly5);
}
main h2 {
	margin-bottom: 20px;
	text-align: left;
	font-size: 36px;
	line-height: 1.3em;
	color: var(--colg6);
}
main h3 {
	margin: 40px 0 20px;
	text-align: left;
	font-size: 27px;
	line-height: 1.3em;
	color: var(--colg6);
}
main section ul {
	margin: 20px 0 20px 30px;
	padding: 0;
}
main section p, 
main section ul li {
	margin-bottom: 0.5em;
}
main .green {
	color: var(--colg6);
}


main .statement {
	margin: 0 20px 80px;
}
main .statement .flexc {
	max-width: 640px;
	margin: 0 auto;
	display: flex;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}
main .statement figure {
	min-width: 120px;
	max-width: 200px;
	margin: 0 0 0 10px;
}
main .statement figure img {
	width: 100%;
	border-radius: 100%;
}
main .statement figure figcaption {
	text-align: center;
	font-size: 15px;
	line-height: 1.5em;
}
main .statement blockquote {
	max-width: 360px;
	margin: 0;
	font-style: italic;
}

main .usps {
	text-align: center;
}
main .usps .flexc {
	max-width: 1012px;
	margin: 0 auto 20px;
	padding-top: 20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: baseline;
}
main .usps .flexc .flexi {
	width: 300px;
	margin: 0 10px 60px;
	padding: 20px 10px;
	background-color: var(--coly1);
	box-shadow: 0 2px 4px 0 var(--coly2);
}
main .usps .flexc .v1 {
	background-color: var(--colg1);
	box-shadow: 0 2px 4px 0 var(--colg2);
}
main .usps .flexc .flexi .symbol {
	width: 38px;
	height: 38px;
	padding: 10px;
	margin: -38px auto 10px;
	background-color: #fff;
	border-radius: 100%;
	transition-property: all;
	transition-timing-function: ease-in-out;
	transition-duration: 1.5s;
	transition-delay: 0.2s;
}
main .usps .flexc .flexi .visible {
	width: 76px;
	height: 76px;
	margin: -76px auto 10px;
}
main .usps .flexc .flexi .symbol img {
	width: 100%;
}

main section.cta {
	margin: 0 20px 100px;
}
main section.cta .container {
	max-width: 640px;
	margin: 0 auto;
}
main section.cta .content {
	max-width: 500px;
}
main section.cta h2 {
	margin-bottom: 10px;
	color: var(--coly5);
}
main section.cta p {
	margin-bottom: 30px;
}

main .product_intro {
	position: relative;
	max-width: 992px;
	margin: 0 auto;
}
main .product_intro img {
	display: block;
	width: 100%; 
	max-width: 992px; 
	content: url("img-product-intro-576.jpg");
}
main section.product {
	max-width: 992px;
	margin: 0 auto 80px;
	padding: 60px 20px 40px;
	background-color: var(--coly1);
	box-shadow: 0 2px 4px 0 var(--coly2);
}
main section.product .content {
	max-width: 640px;
	margin: 0 auto;
}

main .benefits_intro {
	position: relative;
	max-width: 992px;
	height: 300px;
	margin: 0 auto;
	background-image: url("img-benefits-intro-576.jpg");
	background-size: cover;
	background-position: left bottom;
}
main section.benefits {
	max-width: 992px;
	margin: 0 auto 80px;
	padding: 60px 20px 40px;
	background-color: var(--colg1);
	box-shadow: 0 2px 4px 0 var(--colg2);
}
main section.benefits .content {
	max-width: 640px;
	margin: 0 auto;
}

main .usp_innovation_intro {
	position: relative;
	max-width: 992px;
	height: 300px;
	margin: 0 auto;
	background-image: url("img-usp-innovation-intro-576.jpg");
	background-size: cover;
	background-position: right bottom;
}
main .usp_innovation_intro p.v1 {
	position: absolute;
	top: 10px;
	left: 0;
	padding: 0 20px 0;
	font-weight: bold;
	font-size: 20px;
	line-height: 1.5em;
	color: var(--colg5);
	text-shadow: 0 2px 8px #ffffff;
}
main .usp_innovation_intro p.v2 {
	position: absolute;
	bottom: 20px;
	left: 0;
	padding: 6px 20px 4px;
	font-weight: bold;
	font-size: 18px;
	line-height: 1.5em;
	color: var(--coly5);
	background-color: #fff;
}

main section.usp_innovation {
	max-width: 992px;
	margin: 0 auto 80px;
	padding: 60px 20px 40px;
	background-color: var(--coly1);
	box-shadow: 0 2px 4px 0 var(--coly2);
}
main section.usp_innovation .content {
	max-width: 640px;
	margin: 0 auto;
}
main section.usp_innovation .content p.accordion {
	margin-top: 20px;
	text-align: center;
    color: #a12b00;
    text-decoration: underline;
	cursor: pointer;
}
main section.usp_innovation .content p.accordion::after {
	content: " \25bc";
}
main section.usp_innovation .content p.active::after {
	content: " \25b2";
}
main section.usp_innovation .content .panel {
	max-height: 0;
	overflow: hidden;
	transition-property: max-height;
	transition-timing-function: ease-in-out;
	transition-duration: 0.5s;
	transition-delay: 0s;
}

main .safety_intro {
	position: relative;
	max-width: 992px;
	height: 300px;
	margin: 0 auto;
	background-image: url("img-safety-intro-576.jpg");
	background-size: cover;
	background-position: center bottom;
}

main section.safety {
	max-width: 992px;
	margin: 0 auto 80px;
	padding: 60px 20px 40px;
	background-color: var(--colg1);
	box-shadow: 0 2px 4px 0 var(--colg2);
}
main section.safety .content {
	max-width: 640px;
	margin: 0 auto;
}

main section.nextsteps {
	max-width: 992px;
	margin: 0 auto 80px;
	padding: 60px 0 40px;
	background-color: var(--coly1);
	box-shadow: 0 2px 4px 0 var(--coly2);
}
main section.nextsteps .headline {
	max-width: 680px;
	margin: 0 auto;
	padding: 0 20px;
}
main section.nextsteps .timeline {
	position: relative;
	max-width: 660px;
	margin: 0 auto;
	padding: 0 20px 0 0;
}
/* Vertical ruler */
main section.nextsteps .timeline::after {
	content: '';
	position: absolute;
	top: 20px;
	bottom: 0;
	left: 31px;
	width: 6px;
	margin-left: -3px;
	background-image: linear-gradient(to bottom, #72ab38, #72ab38, #72ab38, #72ab38, #72ab38, #72ab38, #72ab38, #72ab38, #72ab38, #fff);
	/*background-image: linear-gradient(to bottom, var(--colg5), var(--colg5), var(--colg5), var(--colg5), var(--colg5), var(--colg5), var(--colg5), var(--colg5), var(--colg5), #fff);*/
}
/* Container around content */
main section.nextsteps .timeline .timeline-container {
	position: relative;
	left: 0;
	width: 100%;
	padding: 5px 0 5px 70px;
	background-color: inherit;
}
/* Arrows */
main section.nextsteps .timeline .timeline-container::before {
	content: " ";
	position: absolute;
	top: 15px;
	left: 60px;
	right: 30px;
	z-index: 1;
	width: 0;
	height: 0;
	border: medium solid var(--coly5);
	border-width: 10px 10px 10px 0;
	border-color: transparent var(--coly5) transparent transparent;
}
main section.nextsteps .timeline .v1::before {
	border: medium solid var(--colg5);
	border-width: 10px 10px 10px 0;
	border-color: transparent var(--colg5) transparent transparent;
}
/* Circles */
main section.nextsteps .timeline .timeline-container::after {
	content: '';
	position: absolute;
	top: 17px;
	left: 23px;
	right: -17px;
	z-index: 1;
	width: 8px;
	height: 8px;
	border: 4px solid var(--coly5);
	border-radius: 50%;
	background-color: #fff;
	transition-property: all;
	transition-timing-function: ease-in-out;
	transition-duration: 1.5s;
	transition-delay: 0.2s;
}
main section.nextsteps .timeline .v1::after {
	border: 4px solid var(--colg5);
	background-color: var(--colg2);
}
/* Circles: Transition */
main section.nextsteps .timeline .visible::after {
	top: 10px;
	left: 15px;
	width: 24px;
	height: 24px;
}
/* Content */
main section.nextsteps .timeline .timeline-container .content {
	position: relative;
	padding: 5px 0 5px 10px;
	border-radius: 0;
	box-shadow: -1px 1px 1px 0 var(--coly3);
}
main section.nextsteps .timeline .v1 .content {
	color: var(--colg6);
	box-shadow: -1px 1px 1px 0 var(--colg3);
}
main section.nextsteps .timeline .timeline-container .content p {
	margin: 0;
}

main section.action {
	max-width: 680px;
	margin: 0 auto;
	padding: 0 20px;
}
main section.action .content h2 {
	color: var(--coly5);
}

div.meetergo-iframe {
	height: 1080px;
}

main section.action_contact {
	padding: 80px 0 160px;
}
main section.action_contact .content h3 {
	text-align: center;
	color: var(--coly5);
}
main section.action_contact .content p {
	text-align: center;
}
main section.action_contact .content a.tel {
	font-size: 27px;
}

main .trustelements .flexc {
	max-width: 720px;
	margin: -20px auto -20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: baseline;
}
main .trustelements .flexc .flexi {
	margin: 20px 10px 0;
}
main .trustelements .flexc .flexi .symbol {
	width: 130px;
	height: 130px;
	padding: 10px;
	background-color: #fff;
	border-radius: 100%;
}
main .trustelements .flexc .flexi .symbol img {
	width: 100%;
}


footer {
	padding: 120px 0;
	text-align: center;
	color: #fff;
	background-image: linear-gradient(to top, #427b1c, #72ab38);
	/*background-image: linear-gradient(to top, var(--colg7), var(--colg5));*/
}
footer .flexc {
	max-width: 640px;
	margin: 0 auto;
}
footer .flexi {
}
footer img {
	width: 200px;
	margin-bottom: 40px;
}
footer p {
	font-style: normal;
}
footer a {
	color: #fff;
}


/******************** Small devices (landscape phones) ********************/
@media (min-width: 576px) {


header .container {
	background-image: url("bg-header-768.jpg");
	background-size: 768px;
	background-position: center top;
	background-repeat: no-repeat;
	background-color: var(--coly1);
}
header .container .headliner .flexc {
	justify-content: flex-end;
}
header .container .headliner .flexc .logo {
	box-shadow: 0 0 30px 10px #fff;
	border-radius: 50% 0 50% 50%;
}
header .container .headliner section {
	margin: -20px 40px 0;
}
header .container .headliner section .content .claim {
	margin-bottom: 10px;
	font-size: 92px;
	text-shadow: 0 2px 8px var(--coly1);
}
header .container .headliner section .content .subclaim {
	background-color: var(--coly2);
	box-shadow: 0 2px 4px 0 #aaa;
}
header .container .headliner section .content h1 {
	font-size: 36px;
	text-shadow: 0 2px 8px var(--coly1);
}


main .statement {
	margin: 0 40px 100px;
}
main .statement figure {
	margin: 0 0 0 40px;
}
main .statement figure figcaption {
	font-size: 18px;
	line-height: 1.5em;
}

main section.cta {
	margin: 0 40px 120px;
}

main .product_intro img {
	content: url("img-product-intro-992.jpg");
}
main section.product {
	margin: 0 auto 100px;
	padding: 80px 40px 60px;
}

main .benefits_intro {
	height: 400px;
	background-image: url("img-benefits-intro-768.jpg");
}
main section.benefits {
	margin: 0 auto 100px;
	padding: 80px 40px 60px;
}

main .usp_innovation_intro {
	height: 400px;
	background-image: url("img-usp-innovation-intro-768.jpg");
}
main .usp_innovation_intro p.v1 {
	top: 20px;
	padding: 0 40px 0;
	font-size: 30px;
}
main .usp_innovation_intro p.v2 {
	bottom: 20px;
	padding: 8px 24px 6px 40px;
	font-size: 24px;
}

main section.usp_innovation {
	margin: 0 auto 100px;
	padding: 80px 40px 60px;
}

main .safety_intro {
	height: 400px;
	background-image: url("img-safety-intro-768.jpg");
}

main section.safety {
	margin: 0 auto 100px;
	padding: 80px 40px 60px;
}

main section.nextsteps {
	margin: 0 auto 100px;
	padding: 80px 20px 60px;
}

main section.action {
	max-width: 720px;
	padding: 0 40px;
}


}
/******************** Medium devices (tablets) ********************/
@media (min-width: 768px) { 


header .container {
	background-image: url("bg-header.jpg");
	background-size: 1850px;
}
header .container .headliner section {
	margin: 0 80px 0;
}


main .statement {
	margin: 0 80px 100px;
}

main .usps .flexc {
	margin: 0 auto 40px;
}

main section.cta {
	margin: 0 80px 120px;
}

main section.product {
	padding: 80px 80px 60px;
}

main .benefits_intro {
	height: 420px;
	background-image: url("img-benefits-intro-992.jpg");
}
main section.benefits {
	padding: 80px 80px 60px;
}

main .usp_innovation_intro {
	height: 420px;
	background-image: url("img-usp-innovation-intro-992.jpg");
}
main .usp_innovation_intro p {
	font-size: 21px;
	line-height: 1.5em;
}
main .usp_innovation_intro p.v1 {
	padding: 0 80px 0;
}
main .usp_innovation_intro p.v2 {
	padding: 12px 80px 10px 80px;
}

main section.usp_innovation {
	padding: 80px 80px 60px;
}

main .safety_intro {
	height: 420px;
	background-image: url("img-safety-intro-992.jpg");
}
main section.safety {
	padding: 80px 80px 60px;
}

main section.nextsteps {
	padding: 80px 60px 60px;
}


footer {
	padding: 160px 0;
}
footer .flexc {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
footer img {
	margin-bottom: 0;
}


}
/******************** Custom: meetergo-iframe ********************/
@media (min-width: 785px) {


div.meetergo-iframe {
	height: 620px;
}


}
/******************** Large devices (desktops) ********************/
@media (min-width: 992px) {


header .container {
	margin-bottom: 120px;
	background-image: url("bg-header.jpg");
	background-size: 1850px;
}
header .container .headliner section {
	margin: -20px 80px 0;
}
header .container .headliner section .content .claim {
	font-size: 110px;
}
header .container .headliner section .content .subclaim {
	margin-bottom: 60px;
	padding: 7px 20px;
	font-size: 21px;
	line-height: 1.5em;
}
header .container .headliner section .content h1 {
	font-size: 44px;
}


main .usps .flexc {
	margin: 0 auto 60px;
	justify-content: space-between;
}

main section.cta {
	margin: 0 80px 140px;
}

main section.product {
	margin: 0 auto 120px;
	padding: 100px 80px 80px;
}

main section.benefits {
	margin: 0 auto 120px;
	padding: 100px 80px 80px;
}

main .usp_innovation_intro p.v1 {
	font-size: 40px;
}
main .usp_innovation_intro p.v2 {
	font-size: 30px;
}
main section.usp_innovation {
	margin: 0 auto 120px;
	padding: 100px 80px 80px;
}

main section.safety {
	margin: 0 auto 120px;
	padding: 100px 80px 80px;
}

main section.nextsteps {
	margin: 0 auto 120px;
	padding: 100px 80px 80px;
}


}
/* __________ Extra large devices (large desktops) __________ */
@media (min-width: 1200px) {


header .container .headliner .flexc .logo {
	border-radius: 50% 50% 50% 50%;
}


}