@charset "utf-8";
/* CSS Document */

/*template*/
*{margin:0; padding:0; outline:none; box-sizing:border-box;}
img,fieldset{border:0px; display:block;}
br.clear, div.clear{clear:both; font-size:0px;}
ul, ol{list-style:none;}
html{width:100%; height:100%; font-size:62.5%;}
/*body{width:100%; height:100%; background:#fff0f5; font-family: 'Noto Sans JP', sans-serif; font-size:1.6rem; line-height:1.628571; color:#03120b; overflow-x:hidden; overflow-y:scroll; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}*/
body{width:100%; height:100%; background:url('../images/papier.jpg'); font-family: 'Noto Sans JP', sans-serif; font-size:1.6rem; line-height:1.628571; color:#03120b; overflow-x:hidden; overflow-y:scroll; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}
h1, h2, h3, h4, h5, h6{width:100%; height:auto; line-height:1.2; color:#189a61;}
h1{font-size:2.4rem; margin-bottom:35px;}
h2{font-size:2.0rem; margin-bottom:20px;}
h3{font-size:1.6rem; margin-bottom:10px;}
h3.padding{padding-bottom:35px;}
h3.red{color:#ff0000;}
h1.nomargin,
h2.nomargin,
h3.nomargin,
h4.nomargin,
h5.nomargin,
h6.nomargin{margin:0px;}

p{margin:0px 0px 15px 0px;}
a, a *{color:#189a61; text-decoration:none;}
small{font-size:1.2rem;}
article ul,
article ol{list-style:disc outside; margin:0px 0px 30px 20px;}
button{-webkit-appearance:none;}
.red, .red *{color:#d90000;}
.red a{text-decoration:underline;}
table td{vertical-align:top; padding:3px 0px;}

header, nav, article, aside, section, footer{display:block; overflow:hidden;}
header, section, footer{width:100%; height:auto; position:relative;}

.left{float:left;}
.right{float:right;}

.video-container{position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed{position:absolute; top:0; left:0; width:100%; height:100%;}

/*forms*/
.winnie{opacity:0; position:absolute; top:0; left:0; height:0; width:0; z-index:-1;}
textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"],
.input-checkbox {
-webkit-appearance: none;
border-radius: 0;
}
/*text*/
.input-wrapper{position:relative; display:block; margin:0px 0px 45px 0px;}
.input-wrapper label{position:absolute; top:-13px; left:0; font-size:11px; color:#888888; padding:0px 1%; transition:all 0.1s linear; opacity:0; font-weight:bold;}
.input-wrapper label.on{color:#999999;}
.input-wrapper label.show{top:-15px; opacity:1;}
.input-wrapper input{width:100%; height:35px; display:block; color:#131217; overflow:hidden; border:none; font-size:15px; font-size:1.5rem; padding:0px 1%; border-bottom:1px solid #eae9e9;}
.input-wrapper input.red{border-bottom:1px solid #d90000;}
.input-wrapper input:focus{border-color:#189a61; transition:.2s;}
.input-wrapper input.red:focus{border-bottom:1px solid #d90000; transition:.2s;}

/*radio*/
.input-wrapper-radio{position:relative; display:block; margin:0px 0px 45px 0px; padding:0px 1%;}
.input-wrapper-radio .headlabel{position:absolute; top:-25px; opacity:1; left:0; font-size:11px; color:#999999; padding:0px 1%; transition:all 0.1s linear; font-weight:bold;}
.input-wrapper-radio input[type="radio"]:not(:checked), [type="radio"]:checked{position: absolute; left:-9999px;}
.input-wrapper-radio input[type="radio"]:not(:checked) + label, [type="radio"]:checked + label{position:relative; color:#131217; padding:0px 25px; cursor:pointer; font-size:15px; font-size:1.5rem;}
.input-wrapper-radio input[type="radio"]:not(:checked) + label.red, [type="radio"]:checked + label.red{color:#d90000;}
.input-wrapper-radio input[type="radio"]:not(:checked) + label:before,[type="radio"]:checked + label:before,[type="radio"]:not(:checked) + label:after,[type="radio"]:checked + label:after{content: ''; position:absolute;}
.input-wrapper-radio input[type="radio"]:not(:checked) + label:before, [type="radio"]:checked + label:before{left:0; top:0; width:18px; height:18px; background:#ffffff; overflow:hidden; border-radius:15px; transition:background-color .2s;}
.input-wrapper-radio input[type="radio"]:not(:checked) + label:after,[type="radio"]:checked + label:after {width:16px; height:16px; transition:all .2s; border-radius:50%; background:#ffffff; top:0; left:0; border:1px solid #189a61;}
.input-wrapper-radio input[type="radio"]:checked + label:before {background:#189a61;}
.input-wrapper-radio input[type="radio"]:checked + label:after {display:none;}
.input-wrapper-radio input[type="radio"]:disabled + label:after{border:1px solid #efefef; background:#efefef;}
.input-wrapper-radio input[type="radio"]:disabled + label{color:#bebebe;}
.input-wrapper-radio input[type="radio"] + label small{margin-left:15px;}

/*checkbox*/
.input-wrapper-checkbox{position:relative; display:block; padding:0px 1%;}
.input-wrapper-checkbox input[type="checkbox"] {position:absolute; left:-9999px;}
.input-wrapper-checkbox input[type="checkbox"]:not(:checked) + label:before, [type="checkbox"]:checked + label:before, [type="checkbox"]:not(:checked) + label:after, [type="checkbox"]:checked + label:after{content:''; position:absolute;}
.input-wrapper-checkbox input[type="checkbox"] + label:before{top:2px; left:0; width:15px; height:15px; content: ''; cursor: pointer; display:inline-block; border-radius:4px; border:1px solid #189a61; transition:background-color .2s; background:#ffffff;}
.input-wrapper-checkbox input[type="checkbox"] + label{padding-left:25px; line-height:20px; position:relative; float:left; color:#131217; font-size:15px; font-size:1.5rem; }
.input-wrapper-checkbox input[type="checkbox"] + label.red{color:#d90000;}
.input-wrapper-checkbox label a{color:#189a61; text-decoration:underline;}
.input-wrapper-checkbox label.red a{color:#d90000;}
.input-wrapper-checkbox input[type="checkbox"] + label span{width:986px; font-size:19px; font-weight:normal; color:#86899c; line-height:17px; margin:0px 0px 15px 0px; display:inline-block;}
.input-wrapper-checkbox input[type="checkbox"] + label:last-child{margin:0px 0px 20px 0px;}
.input-wrapper-checkbox input[type="checkbox"] + label:after {-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter:alpha(opacity=0); opacity:0; content:''; position:absolute; width:6px; height:3px; background:transparent; top:6px; left:4px; border:3px solid #189a61; border-top:none; transition:opacity .1s; border-right:none; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); -o-transform:rotate(-45deg); -ms-transform:rotate(-45deg); transform:rotate(-45deg);}
.input-wrapper-checkbox input[type="checkbox"] + label:hover::after {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); opacity:0.9;}
.input-wrapper-checkbox input[type="checkbox"]:checked + label:before {background:#189a61;}
.input-wrapper-checkbox input[type="checkbox"]:checked + label:after {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:0.9; border-color:#fff;}

/*textarea*/
.input-wrapper-textarea{position:relative; display:block; margin:0px 0px 45px 0px;}
.input-wrapper-textarea label{position:absolute; top:-13px; left:0; font-size:11px; color:#aaa; padding:0px 1%; transition:all 0.1s linear; opacity:0; font-weight:bold;}
.input-wrapper-textarea label.on{color:#999999;}
.input-wrapper-textarea label.show{top:-20px; opacity:1;}
.input-wrapper-textarea textarea{width:100%; height:125px; display:block; overflow:hidden; border:none; resize:none; padding:0px 1%; font-family:'Lato', serif; font-size:15px; font-size:1.5rem; color:#131217; border-bottom:1px solid #eae9e9;}
.input-wrapper-textarea textarea.red{border-bottom:1px solid #d90000;}
.input-wrapper-textarea textarea:focus{border-color:#189a61; transition:.2s;}
.input-wrapper-textarea textarea.red:focus{border-bottom:1px solid #d90000; transition:.2s;}

/*select*/
.input-wrapper-select{position:relative; background: url('../images/dropdown.png') no-repeat right #FEFEFE; border: #ccc 1px solid; -webkit-border-radius: 3px; border-radius: 3px; -webkit-box-shadow: inset 0px 0px 10px 1px #FEFEFE; box-shadow: inset 0px 0px 10px 1px #FEFEFE;  display:block; margin:0px 0px 45px 0px; padding:0px 1%;}
.input-wrapper-select.red{border:#d90000 1px solid;}
.input-wrapper-select .headlabel{position:absolute; top:-25px; opacity:1; left:0; font-size:11px; color:#999999; padding:0px 1%; transition:all 0.1s linear; font-weight:bold;}
.input-wrapper-select .selectDefault,
.input-wrapper-select .selectDefault2 { padding-left:8px; font-size:15px; font-size:1.5rem; }
.input-wrapper-select select { opacity:0; filter:alpha(opacity=0); position:absolute; top:0; left:0; width:100%; height:100%; display:block; z-index:101; }
.input-wrapper-select select:focus { outline: none; }

.input-wrapper-submit{margin-top:35px; display:grid; grid-template-columns:1fr 1fr; grid-gap:15px; box-sizing:border-box;}

.input-wrapper-submit .button-left input[type=button],
.input-wrapper-submit .button-left input[type=submit]{padding:10px 20px; border-radius:10px; color:#189a61; border:1px solid #189a61; font-family:'Noto Sans JP', sans-serif; text-decoration:none !important; font-size:16px; font-size:1.6rem; font-weight:normal; float:left; background:#ffffff; cursor:pointer;}
.input-wrapper-submit .button-right input[type=button],
.input-wrapper-submit .button-right input[type=submit]{padding:10px 20px; border-radius:10px; color:#ffffff; border:1px solid #189a61; font-family:'Noto Sans JP', sans-serif; text-decoration:none !important; font-size:16px; font-size:1.6rem; font-weight:normal; float:right; background:#189a61; cursor:pointer;}
.input-wrapper-submit .button-right input[type=button].grey,
.input-wrapper-submit .button-right input[type=submit].grey{border:1px solid #6d6d6d; background:#6d6d6d;}

/*anims*/
@-webkit-keyframes fade{ from {opacity:.4} to {opacity:1}}
@keyframes fade{ from {opacity:.4} to {opacity:1}}

/*buttons*/
.button{display:inline-block; padding:10px 20px; text-align:center; font-size:1.6rem; border-radius:10px; font-weight:bold; text-decoration:none !important;}  
.button.green{color:#ffffff !important; background:#16945d;}
.button.red{color:#ffffff !important; background:#ff0000;}
.button.pink{color:#ffffff !important; background:#da0e6b;}
.button.wide{width:100%;}
.button.margin-top{margin-top:35px;}
.button.margin-right{margin-right:35px;}

/*containers*/
.wrapper{width:100%; max-width:1920px; display:block; margin:0px auto;}
.container{width:100%; max-width:1330px; margin:0px auto; padding:0px 35px;}

/*header*/
header{height:130px; overflow:visible; z-index:8000; padding:20px 0px; background:#ffffff;}
header .grid{width:100%; max-width:1330px; display:block; margin:0px auto; display:grid; grid-template-columns:315px auto;}
header .grid .logo{width:fit-content; height:inherit;}
header .grid .logo img{width:315px;}
header .grid .contact{display:flex; justify-content:flex-end;}
header .grid .contact a{font-size:1.4rem; display:grid; grid-template-columns:35px auto; padding:20px 0px; margin-right:50px;}
header .grid .contact a:last-of-type{margin-right:0px;}
header .grid .contact a i{line-height:33px; font-size:20px;}

nav{width:100%; height:50px; display:block; background:rgb(24,154,97); background:linear-gradient(0deg, rgba(24,154,97,1) 0%, rgba(19,123,78,1) 100%);}
nav ul{display:flex; justify-content:flex-start;}
nav ul li{height:50px; text-align:right; display:inline-flex;}
nav ul li:not(:last-child){margin-right:35px;}
nav ul li a{margin:auto; color:#ffffff; font-weight:bold; transition:0.6s;}
nav .icon{display:none;}

.breadcrumb{width:100%; height:35px; display:inline-flex; box-sizing:border-box; background:#c5e6d7;}
.breadcrumb ol{width:100%; min-height:30px; list-style:none; display:block; margin:auto 0px;}
.breadcrumb ol li{float:left; color:#189a61; font-size:1.4rem; margin-right:10px;}
.breadcrumb ol li a{width:auto; text-decoration:none; margin-right:10px; line-height:35px;}
.breadcrumb ol li a span{color:#189a61; font-size:1.4rem; text-decoration:none;}
.breadcrumb ol li:last-child a span{color:#189a61;}

/*main*/
.arrow{display:block; width:100px; height:475px; position:absolute; right:35px; background:url('../images/groene-krul-splash.png') no-repeat top center / contain; z-index:800;}
.stitch{display:block; width:35px; height:232px; background:url('../images/stitch.png') no-repeat top center / contain;}
.padding-top{padding-top:70px;}

section .placeholder{width:80%; min-width:1260px; margin:0px auto;}
section .split{display:grid; grid-template-columns:35px auto; grid-gap:70px;}
section .split .products-anchor{display:none;}

section.slider{height:394px; margin:auto; position:relative;}
section.slider .slides{width:100%; height:inherit; display:block; overflow:hidden;}
section.slider .slides .slide{width:100%; height:inherit; position:relative; display:block; float:left; overflow:hidden;}

section.intro{background:#ddf0e7;}
section.intro article{width:80%; padding:50px 50px 100px 50px; background:url('../images/witte-krul.png') no-repeat bottom center / 80%;}
section.intro article p,
section.intro article p *{font-size:1.8rem; color:#189a61; text-align:center; font-weight:bold;}
section.intro article * a{text-decoration:underline;}

section.content{padding:35px 0px;}
section.content .category{display:grid; grid-template-columns:1fr 2fr; grid-gap:70px;}
section.content .filter{width:100%; display:block; padding-top:35px;}
section.content .filter ol li{float:left; margin-right:35px; text-transform:uppercase; font-weight:bold; color:#6d6d6d; cursor:pointer;} 
section.content .filter ol li:hover,
section.content .filter ol li.on{color:#189a61;}
section.content .product-grid{width:100%; display:grid; grid-template-columns:repeat(3, 1fr); grid-gap:35px;}
section.content .product-grid.green{grid-template-columns:repeat(4, 1fr); grid-gap:35px;}
section.content .product-grid.two{grid-template-columns:repeat(2, 1fr);}
section.content .product-grid.list{grid-template-columns:repeat(1, 1fr);}
section.content .product-grid.list .product{display:grid; grid-template-columns:1fr 2fr; grid-gap:0px;}
section.content .product-grid.list .product .image{grid-area:1/1/3/2;}
section.content .product-grid.list .product .info{grid-area:1/2/1/2;}
section.content .product-grid.list .product .basket{grid-area:2/2/2/2;}
section.content .product-grid .product .image{width:100%; padding-top:100%; display:block; position:relative;}
section.content .product-grid .product .image img{width:100%; height:100%; object-fit:cover; position:absolute; top:0; left:0;}
section.content .product-grid .product .info{background:#ffffff; padding:15px;}
section.content .product-grid .product .info p{font-size:1.4rem; padding-right:5px; color:#85a392; min-height:45px;}
section.content .product-grid .product .info h3{min-height:55px; color:#189a61;}
section.content .product-grid .product .basket{display:grid; grid-template-columns:75px auto; background:#ffffff; padding:15px;}
section.content .product-grid .product .basket span{display:block; width:100%; color:#189a61; font-weight:bold; font-size:1.8rem; line-height:45px;}
section.content .product-grid .product .product-basket a{width:45px; height:45px; display:block; margin-left:10px; border-radius:10px; float:right; text-align:center;}
section.content .product-grid .product .product-basket a i{color:#ffffff; line-height:45px; font-size:2.0rem;}
section.content .product-grid .product .product-basket a.facebook{background:#0078FF;}
section.content .product-grid .product .product-basket a.mail{background:#da0e6b;}
section.content .product-grid .product .product-basket a.whatsapp{background:#25D366;}
section.content .product-grid.green .product{background:#189a61; padding:12px; border-radius:8px;}
section.content .product-grid.green .product .image{background:#ffffff;}
section.content .product-grid.green .product .image img{object-fit:contain;}
section.content .product-grid.green .product .info{background:unset; padding:15px 0px;}
section.content .product-grid.green .product .info h3{min-height:unset;}
section.content .product-grid.green .product .info h3 a{color:#ffffff;}
section.content .product-grid.green .product .info .button,
section.content .product-grid.green .product .info p{display:none;}
section.content .product-grid .readmore{grid-column-end: span 3; text-align:right;}
section.content .product-grid .readmore a{font-weight:bold;}
section.content .product-grid.two .readmore{grid-column-end: span 2;}
section.content .product-grid.list .readmore{grid-column-end: span 1 !important;}
section.content .product-grid .about{grid-column-end: span 3; display:grid; grid-template-columns:auto 100px;}
section.content .product-grid.list .about{grid-column-end: span 1 !important;}
section.content .product-grid.two .about{grid-column-end: span 2;}
section.content .product-grid.two .about .switch{text-align:right;}
section.content .product-grid.two .about .switch i{color:#6d6d6d; font-size:1.8rem; text-decoration:none; margin-left:20px; cursor:pointer;}
section.content .product-grid.two .about .switch i.active,
section.content .product-grid.two .about .switch i:hover{color:#03120b;}
section.content .product-detail small{color:#6d6d6d;}
section.content .product-detail .product-options,
section.content .product-detail .product-options *{font-size:15px; font-size:1.5rem;}
section.content .product-detail .product-options h3{margin-bottom:0px;}
section.content .product-detail .product-options input[type="radio"]:not(:checked), [type="radio"]:checked{position: absolute; left:-9999px;}
section.content .product-detail .product-options * .price{padding-left:35px; color:#888888;}
section.content .product-detail .product-options * .price .otherprice{color:#aaaaaa;}
section.content .product-detail .product-options input[type="radio"]:not(:checked) + label, [type="radio"]:checked + label{position:relative; padding:0px 25px; cursor:pointer; font-size:15px; font-size:1.5rem;}
section.content .product-detail .product-options input[type="radio"]:not(:checked) + label.red, [type="radio"]:checked + label.red{color:#d90000;}
section.content .product-detail .product-options input[type="radio"]:not(:checked) + label:before,[type="radio"]:checked + label:before,[type="radio"]:not(:checked) + label:after,[type="radio"]:checked + label:after{content: ''; position:absolute;}
section.content .product-detail .product-options input[type="radio"]:not(:checked) + label:before, [type="radio"]:checked + label:before{left:0; top:0; width:18px; height:18px; background:#ffffff; overflow:hidden; border-radius:15px; transition:background-color .2s;}
section.content .product-detail .product-options input[type="radio"]:not(:checked) + label:after,[type="radio"]:checked + label:after {width:16px; height:16px; transition:all .2s; border-radius:50%; background:#ffffff; top:0; left:0; border:1px solid #cdd0d6;}
section.content .product-detail .product-options input[type="radio"]:checked + label:before {background:#6db52d;}
section.content .product-detail .product-options input[type="radio"]:checked + label:after {display:none;}
section.content .product-detail .product-options .optiongroup-description{color:#888888;}
section.content .product-detail .product-properties{display:block; overflow:hidden;}
section.content .product-detail .product-properties dl{width:100%; display:grid; grid-template-columns:150px auto;}
section.content .product-detail .product-properties dl dt{color:#6d6d6d; font-size:1.2rem; font-weight:bold;}
section.content .product-detail .product-properties dl dd{color:#6d6d6d; font-size:1.2rem;}
section.content .product-detail .product-order{display:grid; grid-template-columns:1fr 1fr; grid-gap:15px; padding:15px; box-sizing:border-box; background:#c5e6d7; margin-top:35px;}
section.content .product-detail .product-order .product-price{color:#189a61; font-size:30px; font-size:3.0rem; font-weight:bold;}
section.content .product-detail .product-order .product-price strike.price-promo{color:#9a1851; font-size:22px; font-size:2.2rem; text-decoration:line-through; margin-right:15px;}
section.content .product-detail .product-order .product-basket input[type=button]{border:0px; color:#ffffff; padding:10px 20px; border-radius:10px; font-weight:bold; font-size:1.6rem; text-decoration:none; float:right; cursor:pointer;}
section.content .product-detail .product-order .product-basket input[type=button].button-add{background-color:#189a61;}
section.content .product-detail .product-order .product-basket input[type=button].button-showcart{background-color:#da0e6b;}
section.content .product-detail .product-order .product-basket input[type=button].button-nostock{background-color:#6d6d6d; pointer-events:none; cursor:arrow; color:#ffffff;}
section.content .shop{display:grid; grid-template-columns:2fr 1fr; grid-gap:70px; row-gap:0px;}
section.content .shop article{grid-column-end:span 2;}
section.content .shop .shop-basket .basket-head{display:grid; grid-template-columns:1fr 125px 100px;}
section.content .shop .shop-basket .basket-head div{background:#c5e6d7; color:#189a61; padding:5px 15px;}
section.content .shop .shop-basket .basket-product{display:grid; grid-template-columns:125px 1fr 125px 100px; padding-top:15px; background:#ffffff;}
section.content .shop .shop-basket .basket-product div{border-bottom:1px solid #6d6d6d; padding:5px 15px; margin-bottom:15px;}
section.content .shop .shop-basket .basket-product .picture img{width:100%;}
section.content .shop .shop-basket .basket-product .description p.productoptions{margin:0px 0px 15px 0px; font-size:14px; font-size:1.4rem; text-transform:none;}
section.content .shop .shop-basket .basket-product .description small{padding:5px 0px; cursor:pointer;}
section.content .shop .shop-basket .basket-product .description small a,
section.content .shop .shop-basket .basket-product .description small a i{color:#c72230 !important; text-decoration:none; text-transform:none;}
section.content .shop .shop-basket .basket-product .quantity input{width:50px; height:30px; float:left; text-align:center; padding:0px 5px; margin-right:10px; font-size:1.4rem; border:1px solid #6d6d6d;}
section.content .shop .shop-basket .basket-product .quantity a i{text-decoration:none; color:#6d6d6d; font-size:1.8rem; line-height:20px;}
section.content .shop .shop-basket .basket-product .price{text-align:right; text-transform:uppercase;}
section.content .shop .shop-basket .basket-product .price span{float:left; text-transform:uppercase;}
section.content .shop .shop-basket .basket-total{display:grid; grid-template-columns:1fr 200px 125px; margin-bottom:35px;}
section.content .shop .shop-basket .basket-total div{padding:5px 15px;}
section.content .shop .shop-basket .basket-total .subtotal{color:#6d6d6d;}
section.content .shop .shop-basket .basket-total .total{border-top:1px solid #6d6d6d; color:#189a61; font-weight:bold;}
section.content .shop .shop-basket .basket-total .price{text-align:right;}
section.content .shop .shop-basket .basket-total .price span{float:left;}
section.content .shop .shop-basket .basket-total .margintop{margin-top:15px;}
section.content .shop .shop-checkout table{width:100%; margin-bottom:35px; text-align:justify;}
section.content .shop .shop-checkout table tbody tr td:first-of-type{width:200px; font-weight:bold;}
section.content .shop .shop-checkout .basket-summary{display:grid; grid-template-columns:150px 1fr 100px; margin-bottom:35px;}
section.content .shop .shop-checkout .basket-summary .basket-head{background:#c5e6d7; color:#189a61; padding:5px 15px;}
section.content .shop .shop-checkout .basket-summary .basket-row{border-bottom:1px solid #938a83; padding:15px; box-sizing:border-box;}
section.content .shop .shop-checkout .basket-summary .basket-row.picture img{width:100%;}
section.content .shop .shop-checkout .basket-summary .basket-row.description{font-weight:bold;}
section.content .shop .shop-checkout .basket-summary .basket-row.description p.productoptions{font-size:14px; font-size:1.4rem; text-transform:none; font-weight:normal;}
section.content .shop .shop-checkout .basket-summary .basket-row.price{text-align:right; font-weight:bold;}
section.content .shop .shop-checkout .basket-summary .basket-row.price span{float:left;}    
section.content .shop .shop-checkout .basket-total{display:grid; grid-template-columns:1fr 200px 125px; margin:35px 0px;}
section.content .shop .shop-checkout .basket-total div{padding:5px 15px;}
section.content .shop .shop-checkout .basket-total .subtotal{color:#189a61;}
section.content .shop .shop-checkout .basket-total .shipping{color:#938a83;}
section.content .shop .shop-checkout .basket-total .total{border-top:2px solid #189a61;}
section.content .shop .shop-checkout .basket-total .price{text-align:right;}
section.content .shop .shop-checkout .basket-total .price span{float:left;}
section.content .shop .usp{background:url('../images/arrow-white.png') no-repeat top right #c5e4d6; background-size:25%; padding:35px; display:block;}
    
section.content .instruction div{margin-bottom:15px;}
section.content .instruction div.more{display:grid; grid-template-columns:repeat(2, 1fr); grid-gap:15px;}
section.content .instruction div.green{background:#189a61; border-radius:8px; padding:12px;}
section.content .instruction div.green a{background:#ffffff; display:block;}
section.content .instruction div.green a img{object-fit:contain;}
section.content .instruction div.more img,
section.content .instruction div.image img{width:100%;}
section.content .instruction div.download{background:url('../images/arrow-white.png') no-repeat top right #c5e4d6; background-size:25%; padding:35px; display:block;}
section.content .instruction div.download h3{margin-bottom:35px;}
section.content .instruction div.download p{color:#6d6d6d;}
section.content .instruction div.video{background:url('../images/arrow-white.png') no-repeat top right #ffc4c4; background-size:25%; padding:35px; display:block;}
section.content .instruction div.video h3{margin-bottom:35px;}
section.content .instruction div.video p{color:#ff0000;}
section.content .relevant p{color:#6d6d6d; font-size:1.4rem;}

section.content .contact{display:grid; grid-template-columns:1fr 1fr; grid-gap:70px;}
section.content .contact .location #map{height:500px;}

section.agenda{padding: 35px 0; padding-top:70px;}
section.agenda .grid{display:grid; grid-template-columns:1fr 1fr 1fr; gap:35px;}
section.agenda .grid h2{grid-column-end:span 3;}
section.agenda .grid .agenda-item{width: 100%; background:white;}
section.agenda .grid .agenda-item .image{width: 100%; padding-top:100%; display:block; position: relative;}
section.agenda .grid .agenda-item .image img{width: 100%; height:100%; object-fit:cover; position:absolute; top:0; left:0}
section.agenda .grid .agenda-item article{padding:15px; color:#85a392;}
section.agenda .grid .agenda-item article p{font-size:1.2rem;}
section.agenda .grid .agenda-item article .title{color:#189a61; margin-bottom:24px;}
section.agenda .grid .agenda-item article .time,
section.agenda .grid .agenda-item article .date{ margin-bottom:12px;}

section.event-detail{margin:48px 0;}
section.event-detail .grid{display: grid; grid-template-columns:400px auto; gap:24px;}
section.event-detail .grid .event-overview .image{width: 100%; height:350px; margin-bottom:24px; display:block;}
section.event-detail .grid .event-overview .image img{width: 100%; height: 100%; object-fit:cover;}
section.event-detail .grid .event-overview article{padding:24px;}
section.event-detail .grid .event-overview .green-swirl{background: url(../images/arrow-white.png) no-repeat top right #c5e4d6; background-size: 25%; padding: 35px; display: block;}
section.event-detail .grid .event-overview article .title{color:#137b4e; font-size:2.0rem; font-weight:700; margin-bottom:24px;}
section.event-detail .grid .event-overview article .time,
section.event-detail .grid .event-overview article .date{font-style: italic; margin-bottom:12px; color:#9a1851;}
section.event-detail .grid .event-overview article .date i,
section.event-detail .grid .event-overview article .time i{margin-right:4px;}
section.event-detail .grid .event-overview .button{display:block; width: 100%;}
section.event-detail .grid .event-details .details{font-style: italic; color:#9a1851; font-size:1.6rem; margin-bottom:32px;}
section.event-detail .grid .event-details .details i{margin-right:8px;}
section.event-detail .grid .event-details .contact{display:grid; grid-template-columns:auto 32px 32px 32px; gap:12px;}
section.event-detail .grid .event-details .contact .price{font-size:2.6rem; color:#137b4e; font-weight:700;}
section.event-detail .grid .event-details .contact a.facebook,
section.event-detail .grid .event-details .contact a.whatsapp,
section.event-detail .grid .event-details .contact a.mail{width:32px; height:32px;  border-radius:8px; text-align:center;}
section.event-detail .grid .event-details .contact i{font-size:1.8rem; line-height:32px; color:white;}
section.event-detail .grid .event-details .contact a.whatsapp{background:#137b4e;}
section.event-detail .grid .event-details .contact a.facebook{background:#0078FF;}
section.event-detail .grid .event-details .contact a.mail{background:#da0e6b;}


footer{background:rgb(24,154,97); background:linear-gradient(0deg, rgba(24,154,97,1) 0%, rgba(19,123,78,1) 100%);}
footer .grid{width:100%; max-width:1330px; display:block; padding:35px 35px 50px 35px !important; margin:0px auto; display:grid; grid-template-columns:209px auto;  background:url('../images/groene-krul.png') no-repeat bottom center / 80%;}
footer .grid .logo{width:fit-content; height:inherit;}
footer .grid .logo img{width:209px;}
footer .grid .links{display:flex; justify-content:flex-end;}
footer .grid .links ul{margin-right:75px;}
footer .grid .links ul:last-of-type{margin-right:0px;}
footer .grid .links ul li{margin-bottom:20px;}
footer .grid .links ul li,
footer .grid .links ul li *{color:#ffffff; font-size:1.4rem;}
footer .grid .links ul li:first-of-type{font-weight:bold;}
footer .copyright{height:50px; background:#137b4e;}
footer .copyright br{display:none;}
footer .copyright *{color:rgba(255,255,255,0.6); font-size:1.2rem; line-height:50px;}
footer .copyright a{margin-left:20px;}

/*normal*/
@media only screen and (max-width:1260px) 
{   
    body{font-size:1.4rem;}
    .container{padding:0px 15px;}
    .padding-top{padding-top:50px;}
    header .grid .contact a{margin-right:35px;}
    section.intro article{padding:50px 50px 50px 0px;}
    section.intro article p, 
    section.intro article p *{font-size:1.6rem;}
    section .split{grid-gap:50px;}
    section.content .product-grid{grid-template-columns:repeat(2,1fr); grid-gap:50px;}
    section.content .product-grid.green{grid-template-columns:repeat(3, 1fr);}   
    section.content .product-grid .readmore{grid-column-end:span 2;}
    section.content .product-grid .product .basket span{line-height:30px;}
    section.content .product-grid .product .product-basket a{width:30px; height:30px; border-radius:7px;}
    section.content .product-grid .product .product-basket a i{line-height:30px; font-size:1.8rem;}
    section.agenda .grid .agenda-item .image{ height:250px;} 
    section.agenda .grid .agenda-item article .title{font-size:1.8rem;}  
    footer .grid .links ul{margin-right:50px;}
    footer .grid .links ul li{margin-bottom:10px;}
}

/*medium*/
@media only screen and (max-width:994px) 
{
    h1{font-size:2.0rem;}
    h2{font-size:1.6rem;}
    h3{font-size:1.4rem;}
    header .grid .contact a{padding:0px;}
    header .grid .contact a span{display:none;}
    header .grid .contact a i{font-size:32px; line-height:80px;}
    header .grid .contact .cart-action i{font-size:32px;}
    .arrow{width:75px;}
    .stitch{width:15px;}
    section.slider{height:300px;}
    section.intro article{background-size:100%;}
    section.intro article p, section.intro article p *{font-size:1.4rem;}
    section.content .category{grid-gap:35px;}
    section.content .product-grid{grid-gap:35px;}
    section.content .product-grid.green{grid-gap:15px;}
    section.content .product-grid .product .basket span{font-size:1.6rem; line-height:25px;}
    section.content .product-grid .product .product-basket a{width:25px; height:25px; border-radius:6px;}
    section.content .product-grid .product .product-basket a i{line-height:25px; font-size:1.6rem;}   
    section.content .instruction div.download{padding:15px;}
    section.content .shop{grid-template-columns:1fr;}
    section.content .shop article{grid-column-end:unset;}
    section.content .shop aside{margin-top:35px;}
    section .split{grid-template-columns:15px auto; grid-gap:35px;}
    footer .grid{grid-gap:50px;}
    footer .grid .links{display:grid; justify-content:unset; grid-template-columns:repeat(2,1fr); grid-gap:35px;}
    footer .grid .links ul{margin-right:0px;}
}

/*small*/
@media only screen and (max-width:784px)
{
    body{font-size:1.2rem;}
    h1{font-size:1.8rem;}
    h2{font-size:1.4rem;}
    h3{font-size:1.2rem;}    
    .button{font-size:1.4rem;}
    .button.margin-top{margin-top:15px;}
    header .grid{grid-template-columns:1fr;}
    header .grid .contact a{display:none;}
    header .grid .contact .cart-action{position:absolute; top:130px;}
    header .grid .contact .cart-action i{line-height:50px; color:#ffffff;}
    header .grid .logo{width:100%;}
    header .grid .logo img{margin:0px auto;}
    header .grid .contact .cart-action a .label{bottom:11px; color:#189a61;}
    header .grid .contact .cart-action a i{color:#c5e6d7;}
    header .grid .contact .cart-action a i.green{color:#ffffff;}
    nav .icon{width:auto; height:50px; display:block; position:absolute; top:130px; left:15px; line-height:50px; font-size:1.8rem; font-weight:bold; text-decoration:none; text-transform:uppercase; color:#ffffff;}
    nav .icon i,
    nav .icon span{color:#ffffff; margin-right:20px;}
    nav ul{width:100%; height:0; display:block; overflow:hidden; top:180px; right:0; background:rgb(0,0,0,0.8); position:fixed; z-index:7000; transition:0.7s;}
    nav ul.open{height:100%;}
    nav ul li{width:100%; height:50px; float:left; padding:15px; box-sizing:border-box; text-align:left; display:block;}      
    nav ul li a{font-size:1.6rem;}
    .breadcrumb{display:none;}
    .arrow{display:none;}
    .padding-top{padding-top:35px;}
    section.slider{height:200px;}
    section .split .products-anchor{display:block;}
    section.intro article{padding:35px 0px;}
    section.content .product-grid{grid-gap:35px;}
    section.content .product-grid .product .info h3{min-height:40px;}
    section.content .product-grid .product .info p{font-size:1.2rem;}
    section.content .product-grid .product .basket{grid-template-columns:60px auto;}
    section.content .filter ol li{margin-bottom:20px;}
    section.content .category{grid-template-columns:1fr; grid-gap:35px;}
    section.content .instruction div.download{padding:15px;}
    section.content .contact{grid-template-columns:1fr; grid-gap:35px}
    section.content .shop .shop-basket .basket-head{grid-template-columns:1fr;}
    section.content .shop .shop-basket .basket-head div:nth-of-type(2),
    section.content .shop .shop-basket .basket-head div:nth-of-type(3){display:none;}
    section.content .shop .shop-basket .basket-product{grid-template-columns:1fr 2fr;}
    section.content .shop .shop-basket .basket-product div{padding:5px; border-bottom:0px;}
    section.content .shop .shop-basket .basket-product .quantity a i{margin-top:5px;}
    section.content .shop .shop-basket .basket-product .description small a{margin-top:15px; display:block;}
    section.content .shop .shop-basket .basket-total{grid-template-columns:auto 125px;}
    section.content .shop .shop-basket .basket-total .empty{display:none;}
    .input-wrapper-submit .button-left input[type=button], 
    .input-wrapper-submit .button-left input[type=submit],
    .input-wrapper-submit .button-right input[type=button],
    .input-wrapper-submit .button-right input[type=submit]{font-size:1.4rem;}  
    section.agenda .grid{grid-template-columns:1fr 1fr;}
    section.agenda .grid h2{grid-column-end:span 2;}


section.event-detail .grid{display: grid; grid-template-columns:1fr; gap:24px;}
section.event-detail .grid .event-overview{display:grid; grid-template-columns:1fr;gap:24px;}
section.event-detail .grid .event-overview .image{width: 100%; height:450px; margin-bottom:24px; display:block;}
section.event-detail .grid .event-overview .image.small{height:200px;}
section.event-detail .grid .event-overview article{grid-area:1/1/1/1;}
    footer .grid{grid-template-columns:1fr; grid-gap:35px; background-size:100%;}
    footer .grid .logo{width:100%;}
    footer .grid .logo img{margin:0px auto;}
    footer .copyright{height:unset; min-height:75px; text-align:center;}
    footer .copyright,
    footer .copyright *{line-height:25px;}
    footer .copyright br{display:block;}
    footer .copyright a:first-of-type,
    footer .copyright a:last-of-type{margin-left:unset;}
    footer .copyright a.right{float:unset;}
}

/*mini*/
@media only screen and (max-width:479px)
{
    header .grid .logo img{width:100%;}
    .padding-top{padding-top:35px;}
    section.intro article{padding:15px 0px;}
    section.intro article p, section.intro article p *{font-size:1.2rem;}
    section.content{padding:15px;}
    section.content .container{padding:0px;}
    section .split{grid-gap:15px;}
    section.content .product-grid,
    section.content .product-grid.two{grid-template-columns:1fr; grid-gap:35px;}
    section.content .product-grid.green{grid-template-columns:repeat(2, 1fr); grid-gap:15px;}
    section.content .product-grid .readmore,
    section.content .product-grid.two .readmore,
    section.content .product-grid.two .about,
    section.content .product-grid.list .readmore{grid-column-end:unset;}
    section.content .product-grid.two .about .switch{display:none;}
    section.content .product-detail .product-order{grid-template-columns:1fr;}
    section.content .product-detail .product-order .product-basket input[type=button]{width:100%;}
    .input-wrapper-submit{grid-template-columns:1fr;}
    .input-wrapper-submit .button-right{grid-area:1/1/1/1;}
    .input-wrapper-submit .button-left{grid-area:2/1/2/1;}
    .input-wrapper-submit .button-left input[type=button], 
    .input-wrapper-submit .button-left input[type=submit], 
    .input-wrapper-submit .button-right input[type=button], 
    .input-wrapper-submit .button-right input[type=submit]{width:100%;}
    section.agenda .grid{grid-template-columns:1fr;}
    section.agenda .grid h2{grid-column-end:unset;}
    section.event-detail .grid .event-overview article{padding:unset;}
    section.event-detail .grid .event-overview .image{width: 100%; height:250px; margin-bottom:24px; display:block;}
section.event-detail .grid .event-overview .image.small{height:100px;}
    footer .grid .links{grid-template-columns:1fr;}
    footer .grid .links ul li, 
    footer .grid .links ul li *{font-size:1.2rem;}
    footer .grid .links ul li{margin-bottom:5px;}
}