/*
Theme Name: SKAA
Theme URI:    https://www.devotees.nl
Author: 	Devotees
Author URI: https://www.devotees.nl
Description:  Custom built template
Version: 1.0

*/

:root {
  --skaaburnham: #032A17;
  --skaagreen: #3DA371;
  --skaagreen2: #3DA371;
  --grey: #333333;
  --dankers-grey: #333333;
  --skaamint: #9DD1B7;
}

body, html {
	margin: 0px;
	padding: 0px;
	font-size: 14pt;
	color: var(--grey);
	font-family: "Ubuntu", sans-serif;
	font-weight: 400;
	font-style: normal;
	line-height: 170%;
	margin-top: 0 !important;
}

h1,
h2,
h3,
h4,
h5 {
	font-family: "Ubuntu", sans-serif;
}

* {
	box-sizing: border-box;
}

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

section {
	position: relative;
	width: 100%;
}

.sectioninner {
	position: relative;
	padding: 0 16em;
	width: 100%;
	transition: padding .25s;
}

.topblock {
	position: relative;
	height: 12.2em;
	width: 100%;
	background: white;
}

.home .topblock {
	height: 10.2em;
}

section.top {
	z-index: 99999;
	position: absolute;
	top: 0;
	background: white;
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.0);
	transition: box-shadow .25s;
}

.scrollview .top {
	position: fixed;
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	display: flex;
	align-items: center;
}

.topwhite {
	padding: 1em 0;
	transition: padding .25s;
}

.scrollview .top .topwhite {
	padding: .25em 0;
	flex-grow: 1;
}

.toplogo {
	position: relative;
	height: 3em;
	margin: .5em 0;
	width: auto;
	margin-right: auto;
}

.scrollview .toplogo {
	height: 3em;
	margin: 0;
	transition: height .25s;
}

.toplogo img,
.toplogo svg {
	position: relative;
	display: block;
	width: auto;
	height: 100%;
}

.scrollview .top .sectioninner {
	padding: 0 2em;
}

.flexcontainer {
	display: flex;
	position: relative;
	align-items: center;
	height: 100%;
}

.twee_kolommen .flexcontainer {
	height: auto;
}

.topright {
	text-align: right;
	white-space: nowrap;
}

.topright a {
	margin-left: 1em;
	color: var(--skaagreen);
	transition: color .25s;
}

.topright a:hover {
	color: var(--grey);
}
.topright a svg {
	fill:black;
	vertical-align: middle;
	top:-.1em;
	position: relative;
	height: 1.5em;
	width: auto;
	margin-right: .5em;
	transition: fill .25s;
}

.topright a:hover svg {
	fill: var(--grey);
}

.topright form {
	display: inline-block;
	position: relative;
	margin-right: 1em;
	margin-left: 1em;
}

.topright form .searchsubmit {
	display: none;
}

.search h3 {
	font-size: 1.5em;
	font-weight: 300;
	margin-left: .75em;
	margin-top: 2em;
}

.topright form input {
	position: relative;
	padding: .75em;
	border-radius: .75em;
	border: 1px solid var(--skaagreen2);
	transition: border .25s;
	width: auto;
	font-size: 1em;
	width: 16em;
	text-align: center;
	padding-right: 1.75em;
}


.topright form input::placeholder {
	color: var(--grey);
	opacity: 1;
}

.topright form input:focus {
	border: 1px solid var(--grey);
	outline: none;
}

.wpcf7-spinner {
	right: 1em;
	position: absolute;
}

.wpcf7-submit {
	display: none;
}

.wpcf7-response-output {
	background: white;
	border-radius: .5em;
	border: 0 !important;
	color: var(--dankers-grey);	
	width:100%;
	margin: 1em  0 !important;
	padding: 1em !important;
	font-weight: bold;
}

.wpcf7-not-valid-tip {
	color: yellow;
	font-weight: bold;
}

.wpcf7 small {
	display: block;
	line-height: 1.1em;
	margin-top: .5em;
}


.topright form input:focus::placeholder {
	opacity: .5;
}

.topright form svg {
	position: absolute;
	right: .75em;
	top: .85em;
	height: 1em;
	cursor: pointer;
	fill:var(--grey);
	transition: fill .25s;
}

.topright form svg:hover {
	fill: var(--skaagreen);
}

.topright .langswitcher {
	display: inline-block;
	margin-left: .5em;
}

.topright .langswitcher a {
	transition: color .25s;
	margin-left: .5em;
	color: #333;
}

.topright .langswitcher a:hover {
	color: var(--skaagreen);
}
.topright .currentlanguage {
	color: var(--skaagreen) !important;
}

.scrollview .langswitcher,
.scrollview .topright a {
	display: none;
}

.topred {
	background: var(--skaagreen);
	padding: 1.25em 0;
	transition: padding .25s;
}

.scrollview .topred {
	padding: 1em 0;
}

.topred .menu {
	margin: 0;
	padding: 0;
}

.topred .menu li {
	list-style: none;
	display: inline-block;
	margin-right: 1.5em;
}

.topred .menu li.menucontact {
	float: right;
	margin-right: 0;
}

.scrollview .topred .menu li {
	margin: 0 .5em;
	transition: margin .25s;
}

.scrollview .topred .menu li:first-of-type {
	margin-left: 0;
}
.scrollview .topred .menu li:last-of-type {
	margin-right: 0;
}

.topred .menu li a {
	color: white;
	font-weight: bold;
	font-size: 1.05em;
	transition: color .25s;
}

.topred .menu li a:hover,
.topred .menu li.current-menu-item a:not(.current-menu-item .sub-menu a),
.archive .topred .menu li:nth-of-type(2) a:not(.sub-menu a),
.single-product .topred .menu li:nth-of-type(2) a:not(.sub-menu a),
.topred .menu .current-menu-ancestor a:not(.sub-menu a) {
	color: var(--grey);
}



.topred .sub-menu {
	position: absolute;
	background: var(--skaagreen);
	border-radius: 0 0 .75em .75em;
	padding: 1em 0 0 1em;
	margin-left: -1em;
	box-sizing: border-box;
	display: none;
}

.topred li:hover .sub-menu {
	display: block;
}

.topred li.menu-item-has-children::after {
	content: '';
	background-image: url('i/menuarrow.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 1em;
	width: 1em;
	position: relative;
	display: inline-block;
	margin-left: .5em;
}

.topred li.menu-item-has-children:hover::after,
.topred .menu .current-menu-ancestor:not(.sub-menu li)::after,
.archive .topred .menu li:nth-of-type(2):not(.sub-menu li)::after,
.single-product .topred .menu li:nth-of-type(2):not(.sub-menu li)::after {
	background-image: url('i/menuarrow-r.svg');
}

.topred .sub-menu li {
	display: block;
	position: relative;
	margin: .5em 0;
	margin-right: 0;
	padding-right: 1.5em;
}

.topred .sub-menu li a {
	color: white;
	font-weight: 500;
}

.topred .sub-menu li.menu-item-has-children::after {
	background-image: url('i/menuarrow-r.svg');
	transform: rotate(-90deg);
}

.topred .sub-menu li .sub-menu {
	position: absolute;
	background: var(--dankers-grey);
	border-radius:   0 .75em .75em .75em;
	padding: 1em .5em;
	margin-left: calc(100%);
	box-sizing: border-box;
	display: none;
	top:-1.5em;
}

.topred .sub-menu li .sub-menu li a:hover,
.topred .sub-menu li .sub-menu li.current-menu-item a {
	color: var(--skaagreen) !important;
}

.topred .sub-menu li .sub-menu li {
	white-space: nowrap;
}

.topred li .sub-menu li:hover .sub-menu {
	display: block;
}

.menucontact a {
	background: white;
	color: var(--skaagreen) !important;
	position: relative;
	border-radius: .75em;
	padding: .5em 2em;
	margin-top: -.5em;
	text-align: center;
	transition: background .25s, color .25s !important, padding .25s;
	display: inline-block;
}

.menucontact a:hover {
	background: var(--grey);
	color: white !important;
}

.scrollview .menucontact a {
	padding: .25em 1em;
}

.breadcrumbs {
	margin-top: 2em;
}

.breadcrumbs a {
	color: var(--skaagreen2);
	transition: color .25s;
}

.breadcrumbs a:hover {
	color: var(--skaaburnham);
}

.breadcrumbs .sep {
	margin: 0 .5em;
	display: inline-block;
	color: var(--dankers-grey);
}


section.visual .visualimg {
	position: relative;
	width: 100%;
	height: auto;
	display: block;
}

section.visual .sectioninner.main {
	position: absolute;
	top:0;
	bottom: 0;
}

.sectioninner.main.withcols {
	bottom: 22em !important;
}

.adres svg {
	vertical-align: middle;
	position: relative;
	margin-right: .5em;
	height: 1.5em;
	top:-.1em;
	width:auto;
}

.homecol .adres {
	color: var(--dankers-grey);
}

.adres a {
	display: inline-block;
	margin-top: .25em;
	text-decoration: none !important;
	transition: color .25s;
}

.homecol .adres a {
	color: var(--skaagreen2);
}
.homecol .adres a:hover {
	color: var(--skaaburnham);
}

.adres svg {
	transition: fill .25s;
}

.homecol .adres svg {
	fill:black;
}

.homecol .adres a:hover svg {
	fill:var(--skaaburnham);
}

.sectioninner.homecols {
	position: relative;
	margin-top: -15em;
}

.sectioninner.homecols .flexcontainer {
	justify-content: center;
	align-items: flex-start; 
}

.sectioninner.homecols .homecol {
	width: calc(100% / 3);
	padding: 2em;
	box-sizing: border-box;
	margin: .5em;
	border-radius: .75em;
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	align-self: stretch;
	display: flex;
	flex-direction: column;
}

.sectioninner.homecols .homecol b {
	display: block;
}

.sectioninner.homecols .homecol b:first-of-type {
	font-size: 1.25em;
}

.sectioninner.homecols .homecol form {
	margin-top: 1em;
}

.sectioninner.homecols .homecol .subheader {
	margin-top: .25em;
	color: var(--skaagreen2);
}

.sectioninner.homecols .homecol .button {
	margin-top: auto;
	text-decoration: none;
	color: white;
	background: var(--skaaburnham);
	border: 1px solid var(--skaaburnham);
	transform: background .25s, color .25s;
}

.sectioninner.homecols .homecol .button:hover {
	background: var(--skaagreen2);
	border: 1px solid var(--skaagreen2);
}

.redback {
	background: var(--skaagreen2);
	color: white;
}

.whiteback {
	background: white;
}

.whiteback b {
	color: var(--skaagreen2);
}

.whiteback a {
	color: var(--skaagreen2);
	text-decoration: underline;
	transition: color .25s;
}

.whiteback a:hover {
	color: var(--skaaburnham);
}

.sectioninner.homecols .homecol input,
.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select {
	position: relative;
	padding: .75em;
	border-radius: .75em;
	width: auto;
	font-size: 1em;
	border: 1px solid white;
	transition: border .25s;
	width: 100%;
	margin-bottom: .75em;
	font-family: "Ubuntu", sans-serif;
	font-weight: 400;
	background: white;
}

.sectioninner.homecols .homecol input::placeholder {
	font-size: .85em;
}

.wpcf7 label {
	display: block;
	margin-top: .75em;
}

.wpcf7 select {
	color: var(--grey);
}

.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select {
	margin-bottom: 0;
	border: 1px solid var(--grey);
}

.sectioninner.homecols .homecol input:focus,
.wpcf7 input:focus,
.wpcf7 textarea:focus,
.wpcf7 select:focus {
	border: 1px solid var(--skaaburnham);
	outline: none;
}

.wpcf7-select {
	-moz-appearance:none; /* Firefox */
	-webkit-appearance:none; /* Safari and Chrome */
	appearance:none;
}

.wpcf7-form-control-wrap[data-name="contact-over"]:after {
	content: '';
	background-image: url('i/menuarrow-b.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 1em;
	width: 1em;
	position: absolute;
	display: inline-block;
	right: 1em;
	z-index: 10;
	pointer-events: none;
	top:0;
}


.search_product_submit {
	position: relative;
	width: 100%;
	border-radius: .75em;
	background: var(--skaagreen2);
	padding: .75em;
	color: white;
	text-align: center;
	cursor: pointer;
	transition: background .25s;
	border: 1px solid white;
}

.search_product_submit svg,
.ctacol1 .button svg {
	vertical-align: middle;
	margin-right: .5em;
	height: 1em;
	width: auto;
	fill:white;
	position: relative;
	top: -.1em;
}

.search_product_submit:hover {
	background: var(--skaaburnham);
}

section.visual h1 {
	color: white;
	font-size: 2em;
	font-weight: 400;
	text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
section.visual h1 p {
	margin: 0;
}

section.visual h1 b {
	font-weight: 600;
	color: var(--skaagreen);
	margin-top: .75em;
	margin-bottom: .75em;
	font-size: 1.618em;
	display: block;
}

h1,h2,h3,h4,h5 {
	margin: 0;
	padding: 0;
	line-height: 130%;
}

.product_categorieen,
.product_categorieen_uitgebreid {
	margin-top: 4em;
}

.product_categorieen .sectioninner {
	text-align: center;
	padding-top: 4em;
	padding-bottom: 4em;
}

h1 {
	font-weight: bold !important;
}

section:not(.visual) h1,
section:not(.visual) h2 {
	font-weight: 400;
	color: var(--skaagreen);
	margin-bottom: .5em;
	font-size: 2em;
}

section.tekst_gecentreerd h2 {
	color: var(--skaaburnham);
}


section:not(.visual) h2 {
	font-size: 2.5em;
	font-size: 1.618rem;
	line-height: 1em;
}

.tekst_gecentreerd h2,
.product_categorieen h2 {
	font-size: 2.5em !important;
}

.producthold {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	width: 100%;
	justify-content: left;
}

.home .producthold {
	justify-content: center;
}

.producthold .cta_container {
	font-size: .88em;
}

.product {
	width: calc((100% - 8em) / 4);
	margin: 2em 1em;
	position: relative;
	display: block;
	text-align: center;
	color: var(--skaagreen);
	transition: color .25s;
	text-align: center;
}

.product_overview .product,
.related_products .product {
	text-align: left;
	font-weight: bold;
}

.related_products .product {
	width: calc(50% - 2em)
}

.productsizes {
	font-weight: 400;
	color: var(--grey);
}

.productimgwrap {
	position: relative;
	height: 14em;
	width: 100%;
	margin-bottom: .75em;
	display: flex;
	align-items: center;
	justify-content: center;
}

.product .productimg {
	max-height: 100%;
	max-width: 100%;
	position: relative;
	vertical-align: middle;
}

.product:hover {
	color: var(--grey);
}

section.twee_kolommen .sectioninner {
	padding-top: 1em;
	margin-top: 4em;
}

section.twee_kolommen .sectioninner.hasback {
	background: var(--skaamint);
	padding-top: 8em !important;
	padding-bottom: 8em !important;

}

section:nth-of-type(3).twee_kolommen .sectioninner {
	margin-top: 0;
}

section.twee_kolommen .flexcontainer {
	align-items: flex-start; 
}

section.twee_kolommen .col {
	width: 50%;
	margin-bottom: 4em;
}
section.twee_kolommen .col:first-of-type {
	padding-right: 4em;
}
section.twee_kolommen .col:last-of-type {
	padding-left: 4em;
}

section.twee_kolommen .col p:first-of-type {
	margin-top: 0;
}


section.twee_kolommen .sectioninner.titledark {
	padding-top: 8em !important;
	padding-bottom: 0 !important;
}

section.twee_kolommen .sectioninner.titledark h2 {
	color: var(--skaaburnham);
	margin-top: -2em;
}


section.twee_kolommen .sectioninner.hasback h2 {
	color: var(--skaaburnham);
}
/* 
section.twee_kolommen .col p img {
	border-radius: .75em;
} */

section.twee_kolommen a:not(.button), .prod_color_disclaimer a {
	color: var(--skaagreen);
	text-decoration: underline;
}
section.twee_kolommen a:not(.button):hover, .prod_color_disclaimer a:hover {
	text-decoration: none;
}

section.twee_kolommen h3 {
	font-size: 1.5em;
	font-weight: 300;
	margin-bottom: 1em;
}

.button {
	position: relative;
	border-radius: .75em;
	background: var(--skaaburnham);
	padding: .75em 2em;
	color: white;
	text-align: center;
	cursor: pointer;
	transition: background .25s;
	display: inline-block;
}

.col .button {
	margin-top: 2em;
}

.button::after  {
	content: '';
	display: inline-block;
	position: relative;
	margin-left: .75em;
	top:.3em;
	width: 1.25em;
	height: 1.25em;
	background-image: url('i/arrow-w.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	transition: left .25s;
	box-sizing: border-box;
	left: 0;
}

.button:hover {
	background: var(--skaagreen2);	
}

.button:hover::after {
	left: .25em;
}

.uspswrap {
	position: relative;
	width: 100%;
	text-align: center;
}

p + .usps {
	margin-top: 4rem;
}

.usps {
	margin: 0;
	padding: 0;
	text-align: left;
	display: inline-block;
	list-style: none;
}

.usps li {
	font-size: 1.2em;
	margin-bottom: .5em;
	position: relative;
}

.usps li::before  {
	content: '';
	display: inline-block;
	position: relative;
	margin-right: .5em;
	top:.3em;
	width: 1.25em;
	height: 1.25em;
	background-image: url('i/usp.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	transition: left .25s;
	box-sizing: border-box;
	left: 0;
}


.col .usps li {
	padding-left: 2em;
}

.col .usps li::before {
	position: absolute;
	top:.2em;
}

.logo_slides {
	height: 2em;
	position: relative;
	width: calc(100 - 2em);
	margin: 0 1em;
}

.logo_slides img,
.logo_slides svg {
	width: calc((100vw - 24em) / 5);
}


/* Slider */
.slick-slider
{
	position: relative;

	display: block;
	box-sizing: border-box;

	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
			user-select: none;

	-webkit-touch-callout: none;
	-khtml-user-select: none;
	-ms-touch-action: pan-y;
		touch-action: pan-y;
	-webkit-tap-highlight-color: transparent;
}

.slick-list
{
	position: relative;

	display: block;
	overflow: hidden;

	margin: 0;
	padding: 0;
}
.slick-list:focus
{
	outline: none;
}
.slick-list.dragging
{
	cursor: pointer;
	cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
	-webkit-transform: translate3d(0, 0, 0);
	   -moz-transform: translate3d(0, 0, 0);
		-ms-transform: translate3d(0, 0, 0);
		 -o-transform: translate3d(0, 0, 0);
			transform: translate3d(0, 0, 0);
}

.slick-track
{
	position: relative;
	top: 0;
	left: 0;

	display: block;
	margin-left: auto;
	margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
	display: table;

	content: '';
}
.slick-track:after
{
	clear: both;
}
.slick-loading .slick-track
{
	visibility: hidden;
}

.slick-slide
{
	display: none;
	float: left;

	height: 100%;
	min-height: 1px;
}
[dir='rtl'] .slick-slide
{
	float: right;
}
.slick-slide img,
.slick-slide svg
{
	display: block;
}
.slick-slide.slick-loading img,
.slick-slide.slick-loading svg
{
	display: none;
}
.slick-slide.dragging img
{
	pointer-events: none;
}
.slick-initialized .slick-slide
{
	display: block;
}
.slick-loading .slick-slide
{
	visibility: hidden;
}
.slick-vertical .slick-slide
{
	display: block;

	height: auto;

	border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
	display: none;
}

.slick_prev,
.slick_next {
	position: absolute;
	height: 1em;
	width: auto;
	top:.75em;
	cursor: pointer;
}

.slider_wrap {
	position: relative;
	margin-bottom: 4em;
}

.slick_prev {
	left: 0;
}

.slick_next {
	right: 0;
}

.pagination {
	position: relative;
	width: 100%;
	color: var(--skaagreen);
	margin-top: 2em;
}

.pagination .page-numbers {
	margin-right: .5em;
}

.page-numbers.current {
	padding: .1em .25em;
	border-radius: .25em;
	color: white;
	background: var(--skaagreen);
}

.cta_container {
	position: relative;
	width: 100%;
	padding: 4em;
	background: var(--skaagreen);
	color: white;
	border-radius: .75em;
}

.product_cta .cta_container {
	padding: 2em;
}

.ctacol1 {
	width: 70%;
	padding-right: 6em;
}

.cta_container h2 {
	color: white !important;
	margin-bottom: 1em !important;
	display: block;
}



.ctatekst {
	font-size: 1.5em;
	line-height: 150%;
}

.ctatekst h2 {
	font-size: 2.427em;
}

.product_cta .ctatekst {
	font-size: 1em;
	line-height: 170%;
	margin-top: 1em;
	margin-bottom: 2em;
}

.cta_container .button {
	margin-top: 2em;
	background: var(--grey);
	margin-left: auto;
}

.cta_container .button::after {
	display: none;
}

.cta_container .button:hover {
	background: var(--skaaburnham);
}

.cta_container .flexcontainer {
	align-items: stretch !important;
}

.ctacol2 {
	width: 30%;
	display: flex;
	text-align: right;
}



.ctacol2 img {
	height: 8em;
	width: auto;
	display: block;
	border-radius: 100%;
	margin-bottom: 1em;
}

.ctacol2 .button {
	margin-top: 0;
	align-self: center;
}

.ctacol2 .naam {
	font-size: 1.5em;
	margin-bottom: .5em;
}

.ctacontact {
	display: block;
	margin-top: 1em;
}

.ctacontact a  {
	transition: color .25s;
}
.ctacontact a:hover {
	color: var(--skaaburnham);
}

.ctacontact a svg {
	fill:white;
	margin-right: .5em;
	vertical-align: middle;
	height: 1.5em;
	top:-.1em;
	position: relative;
	transition: fill .25s;
}

.ctacontact a:hover svg {
	fill: var(--skaaburnham);
}

.ctawhite {
	position: absolute;
  z-index: 0;
  width: 100%;
  background: white;
  height: 14em;
  bottom: 0;
  left: 0;
}

section.reviews {
	margin-top: 4em;
}

section.reviews h2 {
	font-size: 1.5em;
	text-align: center;
	margin-bottom: 2em;
}

.blogartikel .sectioninner {
	background: white;
	padding: 4em 20%;
}

.featured-image {
	float: right;
	width: 25%;
	margin-left: 2em;
	margin-bottom: 2em;
}

.featured-image img {
	width: 100%;
	height: auto;
	display: block;
}

section.blogoverzicht {
	padding-bottom: 4em;
}
.bloghold {
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
}
.blogitem {
	width: calc((100% - 4em) / 4);
	margin-bottom: 1.5em;	
	border: 1px solid var(--skaamint);
	align-self: stretch;
	display: flex;
	flex-direction: column;
	border-radius: .75em;
	overflow: hidden;
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	background: white;
}

.blogcontentwrap {
	padding: 2em;
	position: relative;
	width: 100%;
}

.blogitem b {
	display: block;
	color: var(--skaagreen);
	font-weight: 600;
	margin-top: 1em;
	margin-bottom: 1em;
}

.blogitem .button {
	font-size: .8em;
	margin-top: auto;
	width: auto;
	align-self: center;
}

.blogimghold {
	display: flex;
	height: 15em;
	justify-content: center;
	box-sizing: border-box;
	overflow: hidden;
	background: var(--skaamint);
}
.blogimghold img {
	width: 100%; /* Maintain the aspect ratio */
	height: auto;
	object-fit: cover;
	display: block;
}

.blog_link {
	color: var(--skaagreen);
}

.blog_link::after  {
	content: '';
	display: inline-block;
	position: relative;
	margin-left: .75em;
	top:.3em;
	width: 1.25em;
	height: 1.25em;
	background-image: url('i/arrow-m.svg');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center center;
	transition: left .25s;
	box-sizing: border-box;
	left: 0;
}

.blog_link:hover::after {
	left: .25em;
}

section.tekst_gecentreerd:not(section:nth-child(3)) {
	margin-top: 4em;
}


.tekst_gecentreerd .sectioninner {
	text-align: center;
	background: var(--skaamint);
	padding-top: 8em !important;
	padding-bottom: 8em !important;

}

.tekst_gecentreerd .sectioninner {
	padding-top: 4em;
	padding-bottom: 4em;
}

.tekst_gecentreerd .sectioninner h2 {
	margin-bottom: 1.25em !important;
}


.tekst_gecentreerd .sectioninner .button {
	margin-top: 2.5em;
}

section.prefooter {
	margin-top: 8em;
	padding: 1em 0;
	background: var(--skaamint);
}

.footerlogo {
	height: 4em;
	width: auto;
} 

.footerlogo img {
	height: 100%;
	display: block;
	width: auto;
	vertical-align: middle;
}

.bottomright {
	margin-left: auto;
	font-size: 1.2em;
	padding-right: 1em;
	color: var(--skaaburnham);
}

section.footer {
	background: var(--skaagreen);
	padding-top: 4em;
	padding-bottom: 2em;
}

section.footer .flexcontainer {
	align-items: flex-start;
}

.wp-gr .wp-google-powered {
	color: white !important;
}

.footercol {
	width: calc(100% / 3);
	padding-right: 4em;
	color: white;
}

.footercol ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.footertitle {
	display: block;
	font-weight: bold;
	font-size: 1em;
	margin-bottom: 1.5em;
}

.footerinner {
	font-size: .85em;
}

.footer a:hover {
	text-decoration: underline;
}

.pelifooter img {
	width: auto;
	height: 2em;
	display: block;
	margin-bottom: 1em;
}

.pelifooter .footerinner {
	line-height: 140%;
	margin-top: 1.5em;
}


.socials {
	position: relative;
	margin: 1em 0;
}

.social {
	height: 2em;
	width: auto;
	margin-right: .5em;
	position: relative;
	display: inline-block;
}

.social svg {
	height: 100%;
	position: relative;
	display: block;
	width: auto;
	fill:white;
	transition: fill .25s;
}

.social:hover svg {
	fill: var(--grey);
}

.footerinner .grw-header-inner {
	padding: 0 !important;
	margin: 0 !important;
}

.footerinner .adres svg {
	fill:white;
}

.footerinner .adres a:hover {
	color: black;
}

.footerinner .adres a:hover svg {
	fill:black;
}

.endfooter {
	font-size: .8em;
	color: white;
	text-align: center;
	margin-top: 4em;
}

.endfooter svg {
	fill:white;
	height: .8em;
	width: auto;
	display: inline-block;
}

.hamburger {
	display: none;
}

section.usps ul {
	list-style: none;
	margin: 0;
	text-align: center;
	padding: 0;
	padding-top: 4em;
	padding-bottom: 2em;
}

section.usps ul li {
	display: inline-block;
	margin: .5em .8em;
	font-size: 1.3em;
}

section.cta {
	padding-top: 4em;
	padding-bottom: 2em;
}

.videowrapper {
	width: 75%;
	margin: auto;
	height: auto;
	border-radius: 2em;
	overflow: hidden;
}

.embed-container {
	position: relative;
	padding-bottom: 56.25%;
}
 
.embed-container iframe,
.embed-container object,
.embed-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border-radius: .75em;
}

.wp-videovideo{ width: 100%; height: 100%; max-width: 100%; }
.wp-video{width: 100% !important; overflow: hidden; border-radius: .75em;}

.backtooverview {
	margin-top: 2em;
	display: inline-block;
	font-weight: bold;
	color: var(--skaagreen2);
	transition: color .25s;
}

.backtooverview svg {
	fill: var(--skaagreen2);
	vertical-align: middle;
	position: relative;
	top: -.1em;
	margin-right: .5em;
	transition: fill .25s;
}

.backtooverview:hover {
	color: var(--skaaburnham);
}

.backtooverview:hover svg {
	fill: var(--skaaburnham);
}

.shophold {
	margin-top: 2em;
}

.shophold .flexcontainer {
	align-items: flex-start;
}

.shophold .filters {
	width: 25%;
}


.shophold .filters h2 {
	color: var(--skaagreen2);
}

.filtertoggle {
	display: none;
}

.filtergroup{
	margin-top: 1.5em;
}

.filtergroup b {
	font-size: 1.15em;
	color: var(--skaagreen2);
	display: block;
	margin-bottom: .75em;
}

.filtergroup b span {
	font-size: .75em;
}

.maatchoice {
	margin-bottom: .25em;
	transition: color .25s;
	cursor: pointer;
	position: relative;
	display: none;
}

.maatchoice:nth-of-type(1),
.maatchoice:nth-of-type(2),
.maatchoice:nth-of-type(3),
.maatchoice:nth-of-type(4) {
	display: block;
}

.filtergroup.expanded .maatchoice {
	display: block !important;
}

.filtergroup.expanded .meertoggle {
	display: none;
}

.meertoggle {
	text-decoration: underline;
	cursor: pointer;
	transition: color .25s;
}

.meertoggle:hover,
.maatchoice:hover {
	color: var(--skaagreen);
}

.meerinput {
	display: none;
}

.maatchoice .check {
	display: inline-block;
	vertical-align: middle;
	height: 1.25em;
	width: 1.25em;
	border-radius: 100%;
	border: .15em solid black;
	position: relative;
	top:-.1em;
	margin-right: .5em;
	transition: background .25s;
}

.maatchoice:hover .check::after,
.maatchoice.active .check::after {
	content: '';
	width: 1em;
	height: 1em;
	border-radius: 100%;
	background: black;
	display: block;
	border: .175em solid white;
	box-sizing: border-box;
}

.maatchoice:hover .check::after {
	background: var(--skaagreen) !important;
}


.shophold .product_overview {
	width: 100%;
}

.product_overview a {
	color: var(--skaagreen);
	transition: color .25s;
}


.product_overview a:hover {
	color: var(--skaagreen2);
}

.product_overview p:first-of-type {
	margin-top: 0;
}

.product_overview h1 {
	margin-bottom: 1em !important;
}

.product_overview_filters {
	margin-top: 4em;
	display: flex;
	align-items: center;
}

.shophold .product_overview .producthold {
	margin-top: 4em;
}

.single_product {
	margin-top: 2em;
	margin-bottom: 4em;
}

.single_product h1 {
	font-size: 2.8em !important;
	margin-bottom: 0 !important;
	font-weight: bold !important;
}

.single_product .flexcontainer {
	align-items: flex-start;
	flex-wrap: wrap;
}

.single_product .firstflex {
	margin-top: 4em;
}

.product_content {
	width: calc((100% / 5) * 3);
	padding-right: 8em;
}


.product_content .productimg {
	width: 50%;
	height: auto;
	display: block;
}



.product_cta {
	padding-left: 2em;
	width: calc((100% / 5) * 2);
}

.product_cta form {
	padding-right: 4em;
}

.product_cta .button {
	margin-top: 1em;
}

.product_desc {
	margin-top: 2em;
}

.product_specs {
	margin-top: 2em;
}

.product_specs table {
	width: 100%;
	margin-bottom: 2em;	
}

.product_specs table td {
	width: 50%;
	vertical-align: middle;
}


.productimg {
	transform: scale(1);
	transition: transform .5s;
	cursor: pointer;
}	

.productimg:hover {
	transform: scale(1.15);
	z-index: 9999;
}

.productname {
	font-size: 1.25em;
}

.color {
	position: relative;
	display: inline-block;
	width: 1em;
	height: 1em;
	border-radius: 1em;
	margin-right: .25em;
	border-width: .1em;
	border-style: solid;
	border-color: black !important;
	vertical-align: middle;
}

.color:hover {
	border-color: black !important;
}

.color .tip {
	position: absolute;
	vertical-align: middle;
	text-align: center;
	display: none;
	margin-top: -2em;
	margin-left: .5em;
	border: .1em solid black;
	background: white;
	border-radius: .5em .5em .5em 0;
	padding: .15em .75em;
	z-index: 10;
	pointer-events: none;
	box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
	
}

.color:hover .tip {
	display: inline-block;
}

.related_products {
	margin-top: 2em;
	margin-bottom: 2em;
}

.searchcta {
	margin-bottom: 4em;
}

.searchproducts {
	width: 100% !important;
}

.searchproducts .product {
	width: calc((100% - 8em) / 4);
}


.aanvraag_trigger,
.col p a {
	color: var(--skaagreen);
	text-decoration: underline;
	transition: color .25s;
	cursor: pointer;
}

.vacature_link {
	color: var(--skaaburnham);
	margin-bottom: 1em;
	display: block;
	transition: color .25s;
	text-decoration: underline;
}

.aanvraag_trigger:hover,
.col p a:hover,
.vacature_link:hover {
	color: var(--skaagreen2);
}

.filter {
	padding: .5em 1em;
	border-radius: 1em;
	color: white;
	background: var(--skaagreen);
	display: inline-block;
	box-sizing: border-box;
	cursor: pointer;
	position: relative;
	margin-right: 1em;
}

.filter.inactive {
	pointer-events: none !important;
	background: var(--skaamint);
}

.filter svg {
	vertical-align: middle;
	position: relative;
	height: .85em;
	width: auto;
	margin-left: .5em;
}

.filter .counter {
	background: white;
	color: var(--skaagreen);
	border-radius: 100%;
	width: 1.5em;
	height: 1.5em;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	line-height: 1em;
	padding: .25em;
	margin-left: .5em;
	top:-.1em;
	text-align: center;
}

.filter .filterlist {
	display: none;
}

.filter:hover .filterlist {
	display: block;
	position: absolute;
	background: var(--skaagreen);
	border-radius: 1em;
	color: white;
	z-index: 99;
	left: 0;
	max-height: 20em;
	overflow-y: auto;
	width: 20em;
	
}

.filterlist a {
	display: block;
	padding: .5em 1em;
	color: white;
}

.filterlist .filtercheck {
	border-radius: .25em;
	width: 1.5em;
	height: 1.5em;
	background: white;
	display: inline-block;
	margin-right: .5em;
	vertical-align: middle;
	position: relative;
	top:-.1em;
	transition: background .25s;
}

.filterlist a .filtercheck::after {
	content: '';
	position: absolute;
	top: .15em;
	left: .15em;
	right: .15em;
	bottom: .15em;
	box-sizing: border-box;	
	background: url('i/check.svg');
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	opacity: 0;
	transition: opacity .25s;
}


.filterlist a:hover .filtercheck::after {
	opacity: .25;
}


.filterlist a.active .filtercheck::after {
	opacity: 1;
}

.filterlist a:hover {
	background: var(--skaagreen2);
	color: white;
}

.orderby-form {
	margin-left: auto;
	color: var(--skaagreen2);
	font-weight: 400;
}

.orderby-form select {
	background: none;
	border: none;
	font-size: 1em;
	font-family: "Ubuntu", sans-serif;
	font-weight: 400;
	font-style: normal;
	line-height: 170%;
	color: var(--skaagreen2);
}

.contactcol1 {
	 padding-right: 4em;
	 box-sizing: border-box;
	 height: 100%;
	 bottom: 0;
	 top:0;
	 right:30%;
	 left:0;
	 position: absolute;
	 display: flex;
	 flex-direction: column;
}

.contactcol1 h2 {
	font-size: 1.5em !important;
	color: black !important;
}

.contactcol1 h3 {
	font-size: 1.25em !important;
	color: black !important;
	margin-top: 1.5em !important;
}


.contactcol2 {
	width: 30%;
	height: 100%;
	margin-left: 70%;
}

.contact .flexcontainer {
	display: flex;
	justify-content: center;
	align-items: stretch;
	height: 100%;
}

section.contact {
	z-index: 10;
	margin-top: 2em;
	margin-bottom: 4em;
}

.contactcol2 .colimg {
	width: 100%;
	height: auto;
	position: relative;
	display: block;
	border-radius: .5em .5em 0 0;
	margin-top: 1.5em;
}

.col2inner {
	border-radius: 0 0 .5em .5em;
	color: white;
	background: var(--skaagreen2);
	padding: 2em;
	box-sizing: border-box;
}

section.contact .col50 {
	width: 50%;
}

section.contact .col50:first-of-type {
	padding-right: 2em;
}

section.contact .col50:last-of-type {
	padding-left: 2em;
}

.col.nomarg .col2inner {
	margin-bottom: 2em;
}

.col2inner h2 {
	color: white !important;
	font-size: 1.75em !important;
	margin-bottom: .75em !important;
}

.col2inner .button {
	margin-top: 2em;
	margin-bottom: 3em;
	background: var(--skaaburnham);
}

.col2inner textarea {
	resize: vertical;
	height: 10em;
}

.googlemap {
	position: relative;
	max-width: 75%;
	height: auto;
	z-index: 0;
	border-radius: .75em;
	overflow: hidden;
	flex:1;
	margin-top: 1em;
}

.googlemap iframe {
	width: 100%;
	display: block;
	margin: 0;
	height: 100%;
}

.disc {
	font-size: .75em;
	display: block;
	margin-bottom: .25em;
}

.voorbeeldwrap {
	position: relative;
	width: calc((100% / 5) * 3);
	background: var(--skaamint);
	padding: 2em;
	box-sizing: border-box;
	display: inline-block;
	border-radius: .75em;
	margin-bottom: 2em;
}
.related_products .flexcontainer {
	width: calc((100% / 5) * 3);
	padding-right: 8em;
	align-items: flex-start;
	flex-wrap: wrap;
}

.voorbeeldenhold {
	flex-wrap: wrap;
	width: calc(100% + 1em);
	margin-left: -.5em;
}

.voorbeeld {
	width: calc((100% - 4em) / 4);
	background: white;
	align-self: stretch;
	display: flex;
	padding: .5em;
	margin: .5em;
	box-sizing: border-box;
}

.voorbeeld img {
	max-width: 100%;
	max-height: 100%;
	align-self: center;
	display: block;
	cursor: pointer;
}

.grecaptcha-badge { visibility: hidden; }

section.blokken_met_icons {
	padding-bottom: 3em;
}

.iconblocks {
	margin-top: 2em;
	justify-content: space-between;
	align-items: stretch;
	flex-wrap: wrap;
}

.iconblocks .icoblok {
	width: calc((100% - 3em) / 4);
	background: var(--skaamint);
	border-radius: .75em;
	padding: 2em;
	box-sizing: border-box;
	margin-bottom: 1em;
}

.iconblocks .ico {
	margin-bottom: .5em;
	text-align: center;
}

.iconblocks .ico svg {
	width: 4em;
	fill:var(--skaagreen2) !important;
	height: auto;
}

.iconblocks .titel {
	font-size: 1.5em;
	text-align: center;
	margin-bottom: .75em;
}
.iconblocks .inhoud {
	font-size: .9em;
}
.iconblocks .inhoud p:first-of-type {
	margin-top: 0;
}
.iconblocks .inhoud p:last-of-type {
	margin-bottom: 0;
}


.form_popup,
.img_enlarged {
	position: fixed;
	height: 100%;
	width: 100%;
	overflow-y: auto;
	top: 0;
	left: 0;
	z-index: 9999999;
	opacity: 0;
	transition: opacity .5s;
	pointer-events: none;
	background: rgba(0,0,0, .75);
	display: flex;
	justify-content: center;
	align-items: center;
}

.img_enlarged_closer {
	position: absolute;
	top:0;
	bottom: 0;
	right: 0;
	left: 0;
}

.img_enlarged_closer svg {
	position: absolute;
	fill:white;
	height: 1.5em;
	width: auto;
	top:2em;
	right: 2em;
	transition: fill .25s;
	cursor: pointer;
}

.img_enlarged_closer svg:hover {
	fill: var(--green);
}

.form_popup.active,
.img_enlarged.active {
	opacity: 1;
	pointer-events: all;
}

.img_enlarged .imgholder {
	max-width: 100%;
}
	

.img_enlarged .imgholder img {
	max-width: 100%;
	height: auto;
}

.img_nav {
	position: absolute;
	height: calc(100% - 8em);
	width: 4em;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	top:4em;
}

.img_nav.prev {
	left: 0;
}

.img_nav.next {
	right: 0;
}

.img_nav svg {
	display: inline-block;
	fill:white;
	height: 2em;
	width: auto;
	transition: fill .25s;
}

.img_nav:hover svg {
	fill:var(--skaaburnham);
}

.dealers .flexcontainer {
	justify-content: space-between;
	flex-wrap: wrap;
}

section.dealers h1 {
	font-weight: bold;
}

.dealerhold {
	margin-top: 2em;
	margin-bottom: 3em;
	width: calc((100% - 3em) / 4);
}

.dealerlogo {
	width: 100%;
	height: auto;
	display: flex;
	background: #D9D9D9;
	aspect-ratio: 1 / 1;
}

.dealerlogo img {
	width: 75%;
	height: auto;
	margin: auto;
}

.dealernaam {
	font-size: 1.25em;
	margin-top: 1.25em;
	color: var(--skaagreen);
	margin-bottom: 1em;
}

.dealertel svg {
	fill: black;
	vertical-align: middle;
	top: -.1em;
	position: relative;
	height: 1.5em;
	width: auto;
	margin-right: .5em;
	transition: fill .25s;
	
}


.dealeradres {
	margin-top: 1em;
	margin-bottom: 1.25em;
}

.dealerhold a {
	color: var(--skaagreen);
	text-decoration: underline;
	transition: color .25s;
}

.dealerhold a:hover {
	color: var(--skaaburnham);
}


.docwrap {
	background: var(--skaamint);
	border-radius: .75em;
	padding: 2em;
	color: var(--skaaburnham);
	margin-top: 4em;
}

.docwrap h3 {
	font-weight: 400;
	font-size: 1.5em;
}

.dochold {
	margin-top: 1.5em;
	font-weight: bold;
}

.dochold a {
	margin-bottom: .5em;
	display: block;
	transition: color .25s;
}

.dochold a svg {
	fill:white;
	height: 1.25em;
	margin-top: -.2em;
	width: auto;
	vertical-align: middle;
	margin-left: .5em;
	transition: fill .25s;
}

.dochold a:hover svg {
	fill:var(--skaagreen2);
}

.dochold a:hover {
	color: var(--skaagreen2);
}