@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&family=Russo+One&display=swap');

:root {
    --bs-light-rgb: rgb(221, 221, 221);
	--bs-warning: #ff8100;
}

/* :root, html, body {
	scroll-behavior: smooth;
	scroll-margin-block-start: 170px;
} */

.container {
	max-width: 1200px !important;
}

.btn-warning {
	background-color: #ff8100 !important;
	border-color: #ff8100 !important;
}

.label-lg {
	font-size: 16px;
	font-weight: bold;
}

.badge {
	font-weight: 400;
}

.order-front-content {
	border:1px solid #ccc;
	height:500px;
	margin-bottom:15px;
}

.form-check-input {
	width: 1.25em;
	height: 1.25em;
	margin-left: -1.74em !important;
}

label.error {
	display: none !important;
}

.order-form-1 {
		border: 1px solid #bbb;
}

.trustpilot {
	transition: all 200ms ease;
}

.trustpilot a {
	text-decoration: none;
	transition: all 200ms ease;
}

.trustpilot a:hover {
	text-decoration: none;
}

.trustpilot:hover {
	opacity: 0.6;
	transition: all 200ms ease;
}

.trustpilot .score {
	display: flex;
	gap: 8px;
}

.trustpilot .text {
	text-align: right;
	font-size: 12px;
    margin-top: -7px;
}

.stars{
    background-image:url('/img/icons/star.svg');
    background-position-y:center;
    background-repeat:repeat-x;
    background-size:16px 12px;
    position:relative;
    height:23px;
    width:24px
}

.stars--1{
    width:16px
}
.stars--1.halve-star{
    width:24px
}
.stars--2{
    width:32px
}
.stars--2.halve-star{
    width:40px
}
.stars--3{
    width:48px
}
.stars--3.halve-star{
    width:55.9968px
}
.stars--4{
    width:64px
}
.stars--4.halve-star{
    width:72px
}
.stars--5{
    width:80px
}

.title {
	line-height: 60px;
	font-family: 'Open Sans';
	font-size: 2.9375rem !important;
	max-width: 17ch;
}

#header {
	height: 101px !important;
	position: fixed;
	width: 100%; 
	top: 0;
}

#header .social-icons-whatsapp i {
	font-size: 18px !important;
	color: white;
	line-height: 27px;
	padding-left: 2px;
}

#header .social-icons-whatsapp a {
	display: inline;
	padding: 0 !important;
	width: 28px;
	height: 28px;
	line-height: 28px;
	text-align: center;
}

#header .social-icons-whatsapp a {
	transition: all 0.2s ease;
	border-radius: 100%;
	display: block;
	height: 28px;
	line-height: 28px;
	width: 28px;
	text-align: center;
	color: #333 !important;
	text-decoration: none;
	font-size: 12.8px;
	font-size: 0.8rem;
}

#header .social-icons-whatsapp:hover a {
	background: #151719;
	color: #FFF !important;
}

#header .social-icons-whatsapp .badge, #header .nav-item .badge {
	font-size: 11px !important;
	margin-left: 5px !important;
	padding: 0.3em 0.5em !important;
	margin-right: 10px;
}

#header .header-nav-top .social-icons-whatsapp {
	display: flex;
	align-items: center;
}

@media screen and (max-width: 991px) {
	#header .header-container.header-container-height-xs {
		background: white;
		height: 50px !important;
	}

	#header .ws-nowrap span {
		display: none;
	}
}

@media screen and (min-width: 992px) {
	#header {
		height: 121px !important;
	}

	#header .header-body {
		background: #e7f9ea;
	}

	#header .header-nav-main .active {
		color: white;
	}
}

@media screen and (min-width: 768px) {
	#header .header-nav-top .social-icons-whatsapp {
		display: none;
	}
}

@media screen and (max-width: 767px) {
	#header .header-nav-top .nav > li + .nav-item-left-border::after {
		display: none;
	}

	#header .header-nav-top .nav .ws-nowrap {
		margin-top: 2px;
		display: inline-block;
	}
}

.usp-bar {
	width: 100%;
	background: white;
	color: #555555;
	height: 50px;
	box-shadow: 0 5px 10px rgba(0, 0, 0, 0.20);
	margin-top: 101px;
}

.usp-bar .container, .usp-bar ul {
	height: 100%;
}

.usp-bar ul {
	list-style: none;
	max-width: 700px;
}

.usp-bar li {
	margin-right: 15px !important;
}

.usp-bar ul li a, .usp-bar .carousel .carousel-item a {
	color: #555555;
	text-decoration: underline;
}

.usp-bar ul li:hover a, .usp-bar .carousel .carousel-item a:hover {
	opacity: 0.8;
}

.usp-bar ul li i, .usp-bar .carousel .carousel-item i {
	color: #FF8100;
	margin-right: 10px;
	font-size: 16px;
}

.usp-bar .carousel .carousel-item {
	height: 50px;
}

.usp-bar .carousel .carousel-item .carousel-item-content {
	width: fit-content;
	margin-top: 12px;
}

@media screen and (min-width: 991px) {
	.usp-bar {
		transform: translateY(0px);
		margin-top: 121px;
	}

	.usp-bar #usp-carousel {
		display: none;
	}
}

@media screen and (max-width: 992px) {
	.usp-bar .container {
		display: none;
	}
}


.hero, .page-header {
	background: linear-gradient(
		rgba(0, 0, 0, 0.7), 
		rgba(0, 0, 0, 0.7)
	  ), url('../img/graszoden-kopen-hero-back-1920-520.webp') !important;
	background-size: cover !important;
	background-position: center;
	background-repeat: no-repeat;
}

.hero {
	min-height: 520px;
}

@media screen and (max-width: 982px) {
	.hero, .page-header {
		background-image: none !important;
		padding: 20px 0 !important;
		min-height: auto;
	}
}

.page-header .sub-title {
	font-size: 25px;
	margin-top: 10px;
}

@media screen and (max-width: 575px) {
	.slider-contact-form-wrapper {
		padding: 1.5rem !important;
	}
}

.slider-contact-form-wrapper {
	box-shadow: 0 0px 26px rgba(0, 0, 0, 0.25);
	/*max-width: 550px;*/
	margin: 0 auto;
}

.slider-contact-form-wrapper form {
	transition: all 200ms ease;
}

.slider-contact-form-wrapper h2 {
	color: #064d3b;
}

.slider-contact-form-wrapper .radio-group p {
	margin-bottom: 0;
}

.slider-contact-form-wrapper .radio-group .form-group .form-check {
	display: inline-block;
	width: 100%;
	position: relative;
}

.slider-contact-form-wrapper .radio-group .form-group .form-check button {
	border-radius: 50%;
	width: 20px;
	height: 20px;
	padding: 0;
	position: absolute;
	right: 0;
}

.slider-contact-form-wrapper .radio-group input {
	margin-top: 5px;
}

.slider-contact-form-wrapper input[type="text"], .slider-contact-form-wrapper input[type="number"] {
	border: 1px solid #222;
    border-radius: 0;
}

.slider-contact-form-wrapper .form-group input[type="text"], 
.slider-contact-form-wrapper .form-group input[type="number"] {
	width: fit-content;
	margin-left: -5px;
}

.slider-contact-form-wrapper .form-group input[type="text"].is-invalid, 
.slider-contact-form-wrapper .form-group input[type="number"].is-invalid {
	border-color: #dc3545 !important;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
	border-color: #dc3545 !important;
}

.slider-contact-form-wrapper .radio-group input:checked {
	background-color: #064d3b;
	border: none;
	box-shadow: none;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
	background-position: left;
}

.slider-contact-form-wrapper .radio-group input:checked ~ .form-check-label {
	color: #064d3b;
}

.slider-contact-form-wrapper {
	position: relative;
}

.form-popup, .order-summary {
	transform: scaleY(0);
	height: 0;
	transition: all 200ms ease;
	pointer-events: none;
	transform-origin: top;
	margin-top: 10px;
}

.form-popup.show, .order-summary.show {
	transform: scaleY(1);
	pointer-events: all;
	transition: all 200ms ease;
	height: auto;
	transform-origin: top;
}

.order-summary.active {
	background: #064d3b;
	border-radius: 4px;
}

.order-summary h2 {
	padding-bottom: 10px;
	border-bottom: 1px solid #EEE;
}

.order-summary .cart-info {
	position: absolute;
	width: 100%;
	text-align: center;
	top: 50%;
	margin-top: -4px;
	left: 0;
	padding: 0;
	display: block;
	line-height: 1;
}

.order-summary .cart-info .cart-qty {
	position: absolute;
	top: -10px;
	right: 3px;
	width: 15px;
	height: 15px;
	display: block;
	font-size: 9px;
	font-weight: 600;
	color: #fff;
	background-color: #ed5348;
	text-align: center;
	line-height: 15px;
	border-radius: 20px;
	box-shadow: -1px 1px 2px 0 rgba(0, 0, 0, 0.3);
}


.order-summary .mini-products-list {
	list-style: none;
	margin: 0;
	margin-bottom: 25px;
	padding: 0;
}

.order-summary .mini-products-list li {
	position: relative;
	padding: 15px 0;
	height: 26px;
}

.order-summary .mini-products-list li:first-child {
	margin-top: -15px;
}

.order-summary .mini-products-list li .product-image {
	float: left;
	border-color: #ededed;
	border-width: 1px;
	padding: 0;
	border: 1px solid #ddd;
	background-color: #fff;
	display: block;
	position: relative;
	margin-right: 10px;
}

.order-summary .mini-products-list li .product-image img {
	max-width: 40px;
}

.order-summary .mini-products-list li .product-details {
	margin-left: 0;
	line-height: 1.4;
}

.order-summary .mini-products-list li .product-details a {
	letter-spacing: 0.005em;
	font-weight: 600;
	color: #696969;
}

.order-summary .mini-products-list li .product-details .product-name {
	margin: 0;
	font-size: 0.9em;
	font-weight: 400;
}

.order-summary .mini-products-list li .product-details .qty-price {
	font-size: 0.8em;
	line-height: 0;
	margin-top: 5px;
}

.order-summary .mini-products-list li .product-details .qty-price .price {
	display: inline-block;
	min-height: 0;
}

.order-summary .mini-products-list li .product-details .btn-remove {
	z-index: 3;
	top: 5px;
	right: -5px;
	width: 20px;
	height: 20px;
	background-color: #fff;
	color: #474747;
	border-radius: 100%;
	position: absolute;
	text-align: center;
	box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.2);
	line-height: 20px;
	font-size: 10px;
}

.order-summary .totals {
	padding: 15px 0 25px;
	overflow: hidden;
	border-top: 1px solid #EEE;
}

.order-summary .totals .label {
	float: left;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: 700;
	color: #474747;
}

.order-summary .totals .price-total {
	float: right;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 700;
	color: #474747;
}

.order-summary .actions {
	padding: 0;
	margin: 0;
}

.order-summary .actions .btn {
	min-width: 125px;
	text-align: center;
	margin: 5px 0;
	font-size: 11.2px;
	font-size: 0.7rem;
	text-transform: uppercase;
	font-weight: 600;
}

.order-summary .actions .btn:first-child {
	float: left;
}


.breadcrumbs {
	padding: 15px;
}

.breadcrumbs li {
	color: #777;
}

.breadcrumbs a {
	color: #064d3b;
}



/*
	===============================================
					Bestellen
	===============================================
*/

.bestellen {
	position: relative;
}

.bestellen section {
	background: #fff;
	padding: 15px 0;
}

.bestellen section:first-of-type {
	padding-top: 50px;
}

.bestellen .order-summary {
	margin-top: 50px;
	height: fit-content;
	transform: scaleY(1);
	background: #fff;
	box-shadow: 0 0px 26px rgba(0, 0, 0, 0.25);
	padding: 2em 3em;
	position: sticky;
	top: 150px;
	pointer-events: all;
}

.bestellen .order-summary.order-summary-mobile {
	position: static;
}

@media screen and (max-width: 576px) {
	.bestellen .order-summary.order-summary-mobile {
		width: calc(100% + 24px);
		transform: translateX(-12px);
	}
}


.bestellen .slider-contact-form-wrapper {
	box-shadow: 0 0px 26px rgba(0, 0, 0, 0.25);
}

.bestellen .slider-contact-form-wrapper form {
	transition: all 200ms ease;
}

.bestellen .slider-contact-form-wrapper h2 {
	color: #064d3b;
	margin-bottom: 30px;
}

.bestellen p {
	font-weight: bold;
	margin-bottom: 5px;
	font-size: 16px;
	padding-left: 0;
}

.bestellen .form-group .col-sm-3 {
	margin-left: 0;
	padding-left: 0;
}

.bestellen .col-sm-9 .row:last-of-type {
	margin-bottom: 15px;
}

.bestellen .slider-contact-form-wrapper .radio-group p {
	margin-bottom: 0;
}

.bestellen .slider-contact-form-wrapper .form-check {
	display: inline-block;
	width: 100%;
	position: relative;
}

.bestellen .slider-contact-form-wrapper .form-check button {
	border-radius: 50%;
	width: 20px;
	height: 20px;
	padding: 0;
	position: absolute;
	right: 0;
}

@media screen and (max-width: 575px) {
	.bestellen .col-sm-9 {
		padding-left: 0.25rem;
	}

	.bestellen #adresgegevens .col-sm-9.form-group {
		padding-left: 12px;
	}
}

.bestellen .slider-contact-form-wrapper .radio-group input {
	margin-top: 4px;
}

.bestellen .slider-contact-form-wrapper input[type="text"],
.bestellen .slider-contact-form-wrapper input[type="number"],
.bestellen .slider-contact-form-wrapper input[type="tel"],
.bestellen .slider-contact-form-wrapper input[type="email"],
.bestellen .slider-contact-form-wrapper input[type="date"],
.bestellen .slider-contact-form-wrapper textarea {
	border: 1px solid #222;
    border-radius: 0;
}

.bestellen .slider-contact-form-wrapper input[type="text"],
.bestellen .slider-contact-form-wrapper input[type="number"],
.bestellen .slider-contact-form-wrapper input[type="tel"],
.bestellen .slider-contact-form-wrapper input[type="date"],
.bestellen .slider-contact-form-wrapper input[type="email"] {
	width: fit-content;
	margin-left: -5px;
}

.bestellen .slider-contact-form-wrapper .form-group input[type="text"].is-invalid, 
.bestellen .slider-contact-form-wrapper .form-group input[type="number"].is-invalid {
	border-color: #dc3545 !important;
}

.form-control.is-invalid, .was-validated .form-control:invalid {
	border-color: #dc3545 !important;
}

.bestellen .slider-contact-form-wrapper .radio-group input:checked {
	background-color: #064d3b;
	border: none;
	box-shadow: none;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
	background-position: left;
}

.bestellen .slider-contact-form-wrapper .radio-group input:checked ~ .form-check-label {
	color: #064d3b;
}

.bestellen .slider-contact-form-wrapper {
	position: relative;
}

.bestellen #adresgegevens input:not([type="radio"], [type="checkbox"]) {
	width: 100%;
}

.bestellen #adresgegevens .col-sm-9 input:not([type="radio"], [type="checkbox"]):first-of-type {
	margin-bottom: 10px;
}

#kies-uw-betaalmethode h3 {
	text-transform: none;
}

#kies-uw-betaalmethode .radio-group .form-check {
	margin-bottom: 30px;
	position: relative;
}

#kies-uw-betaalmethode .radio-group .form-check input {
	margin-top: 0;
	margin-right: 30px;
}

#kies-uw-betaalmethode .radio-group .form-check-label {
	height: 70px;
	border: 1px solid rgba(0, 0, 0, 0.12);
	margin-bottom: 0px;
	padding-left: 40px;
	box-sizing: border-box;
	border-radius: 6px;
}

#kies-uw-betaalmethode .radio-group .form-check-label.active {
	border-color: #064d3b;
}


#kies-uw-betaalmethode .form-check .form-check-label .payment-img {
	width: 50px;
	height: 50px;
	margin-right: 20px;
	border-radius: 6px;

	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
}

#kies-uw-betaalmethode .form-check .form-check-label[for="payment1"] .payment-img {
	background-image: url('/img/logos/ideal.svg');
}

#kies-uw-betaalmethode .form-check .form-check-label[for="payment2"] .payment-img {
	background-image: url('/img/logos/creditcard.svg');
}

#kies-uw-betaalmethode .form-check .form-check-label[for="payment3"] .payment-img {
	background-image: url('/img/logos/klarna.svg');
}

#kies-uw-betaalmethode .form-check .form-check-label[for="payment4"] .payment-img {
	background-image: url('/img/logos/applepay.svg');
}

#kies-uw-betaalmethode .form-check .form-check-label[for="payment5"] .payment-img {
	background-image: url('/img/logos/paypal.svg');
}

#kies-uw-betaalmethode .form-check .form-check-label[for="payment6"] .payment-img {
	background-image: url('/img/logos/bancontact.svg');
}

#kies-uw-betaalmethode .form-check .form-check-label[for="payment7"] .payment-img {
	background-image: url('/img/logos/sofort.svg');
}

@media screen and (max-width: 575px) {
	#kies-uw-betaalmethode .form-check {
		padding: 0;
	}

	#kies-uw-betaalmethode .form-check .form-check-label .payment-img {
		display: none;
	}
}

#kies-uw-betaalmethode .radio-group .form-check-label .payment-info .payment-name {
	font-weight: bold;
	margin-bottom: 2px;
	font-size: 20px;
	line-height: 20px;
}

#kies-uw-betaalmethode .radio-group .form-check-label .payment-info .payment-subtitle {
	font-weight: normal;
	font-size: 14px;
	line-height: 14px;
}

#kies-uw-betaalmethode .checkbox-group input:checked {
	background-color: #064d3b;
	border: none;
	box-shadow: none;
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
}

#kies-uw-betaalmethode .checkbox-group input:checked ~ .form-check-label {
	color: #064d3b;
}



/*
	===============================================
				     Customer service
	===============================================
*/

.featured-box h2 {
	color: #064d3b;
}

.process i, .process h4 a {
	color: #064d3b;
}

.process h4 a:hover {
	color: #777;
}

/*
	===============================================
				     Custom background
	===============================================
*/

.bg-primary-green {
	background: #064d3b !important;
}

/*
	===============================================
				     cookie
	===============================================
*/
/* To be used with cookieCuttr by Chris Wharton (http://cookiecuttr.com) */

.cc-cookies { position:fixed; width: 90%; left: 0; top: 0; padding: 0.5em 5%; background: #565656; background: rgba(86,86,86,0.95); color: #fff; font-size: 13px; font-weight: 700; text-shadow: 0 -1px 0 rgba(0,0,0,0.35); z-index: 99999; text-align: center; color: #fff; }
.cc-cookies a, .cc-cookies a:hover { color: #fff; text-decoration: underline; }
.cc-cookies a:hover { text-decoration: none; }
.cc-overlay { height: 100%; padding-top: 25%; }
.cc-cookies-error { float: left; width: 90%; text-align: center; margin: 1em 0 2em 0; background: #fff; padding: 2em 5%; border: 1px solid #ccc; font-size: 18px; color: #333; }
.cc-cookies a.cc-cookie-accept, .cc-cookies-error a.cc-cookie-accept, .cc-cookies a.cc-cookie-decline, .cc-cookies-error a.cc-cookie-decline, .cc-cookies a.cc-cookie-reset { display: inline-block; color: #fff; text-decoration: none; background: #7DAF3B; padding: 0.5em 0.75em; border-radius: 3px; box-shadow: 0 0 2px rgba(0,0,0,0.25); text-shadow: 0 -1px 0 rgba(0,0,0,0.35); -o-transition: background 0.5s ease-in; -webkit-transition: background 0.25s ease-in; -moz-transition: background 0.25s ease-in; transition: background 0.25s ease-in; }
.cc-cookies a.cc-cookie-decline, .cc-cookies-error a.cc-cookie-decline { background: #af3b3b; margin-left: 0.5em; }
.cc-cookies a.cc-cookie-reset { background: #f15b00; }
.cc-cookies a:hover.cc-cookie-accept, .cc-cookies-error a:hover.cc-cookie-accept, .cc-cookies a:hover.cc-cookie-decline, .cc-cookies-error a:hover.cc-cookie-decline, .cc-cookies a:hover.cc-cookie-reset  { background: #000; -o-transition: background 0.5s ease-in; -webkit-transition: background 0.25s ease-in; -moz-transition: background 0.25s ease-in; transition: background 0.25s ease-in; }
.cc-cookies-error a.cc-cookie-accept, .cc-cookies-error a.cc-cookie-decline { display: block; margin-top: 1em; }
.cc-cookies.cc-discreet { width: auto; padding: 0.5em 1em; left: auto; top: auto; }
.cc-cookies.cc-discreet a.cc-cookie-reset { background: none; text-shadow: none; padding: 0; text-decoration: underline; }
.cc-cookies.cc-discreet a:hover.cc-cookie-reset { text-decoration: none; }

@media screen and (max-width: 768px) {
.cc-cookies a.cc-cookie-accept, .cc-cookies a.cc-cookie-decline, .cc-cookies a.cc-cookie-reset { display: block; margin: 1em 0; }
}

@media screen and (max-width: 480px) {
.cc-cookies { position: relative; float: left; }
}

.feature-box.feature-box-style-2 .feature-box-icon [class*="fa-"], .feature-box.feature-box-style-2 .feature-box-icon .icons {color:#000;}
