/*
Theme Name: Roald Craenen v2
Author: Roald Craenen
Author URI: https://www.roaldcraenen.nl/
Version: 2.0
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl.html
*/

@font-face {
    font-family: 'Trend HM Sans One';
    src: url('fonts/TrendHMSansOne.woff2') format('woff2'),
        url('fonts/TrendHMSansOne.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
	font-family: "Trend HM Sans W00 One";
	src: url("fonts/0bd61c6387a00ab2c677fa0784e9dce8.eot"); /* IE9*/
	src: url("fonts/0bd61c6387a00ab2c677fa0784e9dce8.eot?#iefix") format("embedded-opentype"), /* IE6-IE8 */
		url("fonts/0bd61c6387a00ab2c677fa0784e9dce8.woff2") format("woff2"), /* chrome、firefox */
		url("fonts/0bd61c6387a00ab2c677fa0784e9dce8.woff") format("woff"), /* chrome、firefox */
		url("fonts/0bd61c6387a00ab2c677fa0784e9dce8.ttf") format("truetype"), /* chrome、firefox、opera、Safari, Android, iOS 4.2+*/
		url("fonts/0bd61c6387a00ab2c677fa0784e9dce8.svg#Trend HM Sans W00 One") format("svg"); /* iOS 4.1- */
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

:root{
	--animate-delay: 0.2s;
	--boxshadow:0 0 20px rgba(0,0,0,0.1);
	--boxshadow_hover:0 0 40px rgba(0,0,0,0.2);
	--default-transition:all 150ms;

	--zwart:#000;
	--wit:#FFF;
	--donker-grijs:#5e5e5e;
	--grijs:#ccc;
	--goud:#A89736;

	--font-trend:'Trend HM Sans W00 One';
	--font-crimson:'Crimson Pro';
}

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}.clear{clear:both}
html,body{width:100%;font-family:var(--font-crimson), serif;font-weight:300;font-size:16px;color:var(--zwart);line-height:1.5em;letter-spacing:0.5px;}
b,strong{font-weight:700}
em,i{font-style:italic}
img{max-width:100%;height:auto;}
a img{border:none;text-decoration:none}
a{color:var(--goud);text-decoration:underline;}
a:hover{color:var(--goud);text-decoration:none}
h1,h2,h3,h4,.subtitel,.kop{line-height:1em;font-weight:200;font-family:var(--font-trend);text-transform:uppercase;}
h1 a,h2 a,h3 a,h4 a,.subtitel a,.kop a{color:#000;text-decoration:underline;}
h1{margin:0 0 30px 0;font-size:45px;line-height:1.2;}
h2{margin:0 0 30px 0;font-size:40px;letter-spacing:1.5px;}
h3{margin:0 0 30px 0;font-size:25px;letter-spacing:1.5px;}
h4{margin:0 0 15px 0;font-size:18px;letter-spacing:1.5px;}

p{margin:5px 0 20px 0}
p:first-of-type{margin-top:0;}
p:last-of-type{margin-bottom:0;}
i.padding-left{padding-left:10px;}
i.padding-right{padding-right:10px;}
input:focus,textarea:focus,button:focus {outline:0;}
.wp-caption{max-width:100%}
p + ul{margin-top:30px;}

/* 404 */
.notfound{min-height: 400px;padding: 60px 0;}
.notfound h1{color: var(--zwart);margin-bottom: 10px;}
.notfound h2{color: var(--zwart);}
.notfound p{line-height: 1.5;margin: 20px 0 30px 0;}
.notfound .notfound-return{text-decoration: none;color: var(--zwart);font-size: 14px;display: block;width: max-content;transition: 200ms all ease-in-out;transform: translateX(0);}
.notfound .notfound-return:hover{transform: translateX(-5px);}

/* General */
/* .bodywrapper{overflow-x:hidden;position:relative;width:100%;} */
.underline a{position:relative;text-decoration:none;transition:var(--default-transition);display: inline-flex;width: fit-content;}
.underline a:after{content:"";background-image:url("images/lijn.svg");position:absolute;left:0;bottom:-20px;height:8px;width:100%;background-size:cover;}
.underline a:hover{filter: drop-shadow(3px 3px 2px #000);color:#000}
:is(h1,h2,h3,h4,h5).fs-52{font-size:35px;}
.blok{padding:60px 0;position:relative;}
.blok .container{position:relative;z-index:2;}
.blok-top{padding:90px 0 0 0}
.blok-bottom{padding:0 0 160px 0}
.subtitel{font-size:18px;margin:-30px 0 30px 0;letter-spacing:1.5px;}
.kop{font-size:14px;margin:-30px 0 30px 0;letter-spacing:1.5px;}
.spacing{letter-spacing:1px;}
.transition{transition:all 100ms ease-in-out;}
.transition.schaduw{box-shadow:0 0 20px rgba(0,0,0,0.1);}
.up:hover{transform:translateY(-3px);}
.pointer:hover{cursor:pointer;}
.schaduw:hover{box-shadow:0 0 40px rgba(0,0,0,0.2);}
.spacing{letter-spacing:1px;}
.objectfit_ie{background-size:cover;background-position:50%;}
.objectfit_ie img{width:100%;height:100%;object-fit:cover;display:block;}
.compat-object-fit img{opacity:0;}
.grecaptcha-badge{display:none;}
.fa-input {font-family:'Font Awesome 5 Pro',sans-serif;}
.ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.cta{padding:20px 30px;background:var(--blauw);color:#fff;font-size:16px;font-weight:700;text-decoration:none;display:inline-block;border-radius:10px;border:none;line-height:1em;}
.cta:hover,.cta:focus{background:var(--blauw);color:#fff}
.cta.brown{background-color:var(--grijs);}
.gradient{position:relative;}
.gradient .container{position:relative;z-index:1;}
.gradient:before{content:"";position:absolute;width:50%;height:100%;background: rgb(0,0,0);background: linear-gradient(90deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);top:0;left:0;}
.clickable:hover{cursor:pointer;}

.margin-top-300{margin-top:90px;}
.margin-top-400{margin-top:90px;}

/* Links & btn's */
.link{font-size:16px;color:#000;text-decoration:none;font-weight:700;position:relative;}
.link:hover{color:#000}
.link:before{content:"";width:0;height:2px;background:#000;position:absolute;left:0;bottom:0;transition:all 0.3s ease-out;}
.link:hover:before{width:100%;}

.btn,.glf-button{border:2px solid #000;padding:10px 10px 10px 10px;text-decoration:none;border-radius:0;font-size:14px;text-transform:uppercase;color:#000;transition:var(--default-transition) ;background:transparent !important;font-family:var(--font-trend);line-height:1.5 ;border-radius:0 ;margin:0 }
.mac-os .btn,.mac-os .glf-button{padding:10px;/*padding:10px 10px 5px 10px*/}
.btn:is(:hover,.active){color:#fff;background:#000 !important;border-color:#000;}
.btn.m-100{width:100%;text-align:center;}
.glf-button{border:2px solid #000;padding:5px 10px 10px 10px !important;text-decoration:none;border-radius:0;font-size:14px !important;text-transform:uppercase;color:#000;transition:var(--default-transition) !important;background:transparent !important;font-family:var(--font-trend) !important;line-height:1.5 !important;border-radius:0 !important;margin:0 !important;font-weight:400 !important;}
.glf-button:is(:hover,.active){color:#fff;background:#000 !important;border-color:#000;}

/* Top */
.top{padding:30px 0 0 0;font-family:var(--font-trend);position:absolute;width:100%;color:#fff;z-index:999;font-size:16px;text-transform:uppercase;}
.top a{color:#fff;text-decoration:none;transition:var(--default-transition);}
.navbar-toggler:hover,.top a:hover{filter: drop-shadow(3px 3px 2px #000);}

/* Nav */
.navigation{background-color:#1a171b}
.navbar{margin-bottom:0;padding:0}
.navbar-toggler{border:none;background:url("images/hamburger.svg");width:24px;height:22px;background-size:contain;margin-left:10px;background-repeat:no-repeat;}
.navbar-toggler .icon-bar{background-color:#fff !important;height:3px}
.navbar-collapse{background-color:#fff;z-index:1;position:relative;margin-top:0px;border:none;text-align:left;padding:0;margin-left: -12px;margin-right: -12px;}

/* Animate hamburger */
.navbar-toggler:focus{box-shadow: none;}
.navbar-toggler .icon-bar{width:22px;transition:all 0.2s;display:block;margin-bottom:5px;}
.navbar-toggler .top-bar{transform:translateY(8px) rotate(45deg);transform-origin:center}
.navbar-toggler .middle-bar{opacity:0;transform:translateX(5px)}
.navbar-toggler .bottom-bar{transform:translateY(-8px) rotate(-45deg);transform-origin:center;margin-bottom:0;}
.navbar-toggler.collapsed .top-bar{transform:rotate(0);}
.navbar-toggler.collapsed .middle-bar{opacity:1;transform:translateX(0px)}
.navbar-toggler.collapsed .bottom-bar{transform:rotate(0);}

/* WPML */
.wpml .wpml-ls{width:auto;}
.wpml .wpml-ls-legacy-dropdown a{padding:10px 0;background-color:transparent;border:none;color:#fff}
.wpml .wpml-ls-legacy-dropdown a:is(:hover,:focus),.wpml .wpml-ls-legacy-dropdown .wpml-ls-current-language:hover > a{color:#fff;background:transparent;border:none}
.wpml .wpml-ls-legacy-dropdown a span{vertical-align: initial;}
.wpml .wpml-ls-legacy-dropdown a.wpml-ls-item-toggle:after{content:"\f0d7";border:none;font-family:"Font Awesome 6 Pro";font-weight:700;top:10px;}
.wpml .wpml-ls-legacy-dropdown .wpml-ls-sub-menu{border:none;text-align:left;background:rgba(255,255,255,0.2);border-radius:4px;left:-14px;transition:var(--default-transition);transform:translateY(10px);}
.wpml .wpml-ls-legacy-dropdown a.js-wpml-ls-item-toggle:hover + .wpml-ls-sub-menu,.wpml .wpml-ls-legacy-dropdown .wpml-ls-sub-menu:hover{transform:translateY(0);}
.wpml .wpml-ls-legacy-dropdown .wpml-ls-sub-menu a{padding:15px}

/* Offcanvas */
.offcanvas{background:url("images/marmer-textuur-zwart.jpg") no-repeat 50% 0%;background-size:cover;color:#fff;font-family:var(--font-trend);font-size:25px;text-transform:uppercase;}
.offcanvas,.offcanvas.offcanvas-start{width:100%;}
.offcanvas a{color:#fff;text-decoration:none;}
.offcanvas-header{padding-top:30px;}
.offcanvas-header .lang{font-size:16px;}
.offcanvas-header .logo{height:50px;display:inline-flex;}
.offcanvas-header .btn-close{color:#fff}
.offcanvas-header .close{background-image:url("images/x.svg");width:24px;height:24px;background-size:contain;background-repeat:no-repeat;}
.offcanvas-body{}
.offcanvas-body ul.nav{margin-top:-100px;}
.offcanvas-body li a{padding:20px 0 10px 0;display:inline-block;line-height:1;border-bottom:2px solid transparent;transition:var(--default-transition);margin-bottom:15px;position:relative;color:#fff}
.offcanvas-body :is(li a:hover,li.current-menu-item a){filter: drop-shadow(2px 2px 2px #c4c4c4);}

/* Header */
.header{width:100%;height:670px;background-size:cover;background-position:50% 50%;position:relative;}
.home .header{height:100vh;}
.header:before{content:"";width:100%;height:100%;background-color:rgba(0,0,0,0.4);position:absolute;}
.header video{}
.header .container,.header .container .row{height:100%;}
.header h1{color:#fff}

/* Koffies */
.koffies .img{padding:30px}
.marmer{position:relative;}
.marmer:before{background:url("images/marmer-textuur.jpg") no-repeat 50% 0%;background-size:cover;content:"";top:0;right:0;bottom:0;left:0;position:absolute;opacity:0.25;background-attachment: unset;}

/* Menu */
:is(.menu,.verhaal,.galerij-wrapper) .galerij{position:relative;height:50vh;}
:is(.menu,.verhaal,.galerij-wrapper) .galerij img{position:absolute;object-fit:cover;width:100%;height:100%}

/*.menu .galerij img:nth-child(1){top:0px;left:3%;width:33%;height:45%;z-index:4;}
.menu .galerij img:nth-child(2){top:90px;left:33%;width:50%;height:80%;z-index:2;}
.menu .galerij img:nth-child(3){bottom:0;right:0px;width:20%;height:70%;z-index:3;}
.menu .galerij img:nth-child(4){bottom:0;left:0px;width:50%;height:45%;z-index:1;}*/

.menu :is(.galerij, .lbox) a{position: absolute;}
.menu :is(.galerij, .lbox) a:nth-child(1){top:0px;left:3%;width:33%;height:45%;z-index:4;}
.menu :is(.galerij, .lbox) a:nth-child(2){top:90px;left:33%;width:50%;height:80%;z-index:2;}
.menu :is(.galerij, .lbox) a:nth-child(3){bottom:0;right:0px;width:20%;height:70%;z-index:3;}
.menu :is(.galerij, .lbox) a:nth-child(4){bottom:0;left:0px;width:50%;height:45%;z-index:1;}
.menu :is(.galerij, .lbox) a img{width: 100%;height: 100%;}

.lbox a{pointer-events: none;}

/* Verhaal */
.verhaal .galerij img:nth-child(1){top:100px;left:3%;width:75%;height:70%;z-index:2;}
.verhaal .galerij img:nth-child(2){top:0;right:0;width:25%;height:90%;z-index:1;}
.verhaal .galerij img:nth-child(3){bottom:0;left:10%;width:40%;height:40%;z-index:3;}

/* Over ons */
.galerij-wrapper{margin-top:90px;}
.odd .mt-190{margin-top:190px;}
.galerij-wrapper.odd .galerij img:nth-child(1){top:100px;left:3%;width:75%;height:70%;z-index:1;}
.galerij-wrapper.odd .galerij img:nth-child(2){top:0px;right:0;width:35%;height:100%;z-index:2;}
.galerij-wrapper.even .galerij img:nth-child(1){top:100px;left:3%;width:75%;height:70%;z-index:2;}
.galerij-wrapper.even .galerij img:nth-child(2){top:0px;right:0;width:35%;height:100%;z-index:1;}

/* Menu */
.menu{}
.menu .specials h2{margin-bottom:75px;}
.menu .specials h3{margin-bottom:30px;}
.menu .items{}
.menu .items .row{}
:is(.menu .items .row,.reg_menu .accordion-body) h4{margin:0 0 5px 0}
:is(.menu .items,.reg_menu .accordion-body) .row + .row{margin-top:20px;}
:is(.menu .items,.reg_menu .accordion-body) small{font-size:16px;line-height:24px;display:block;}

.reg_menu #accordion-drinks .icoon{}
.reg_menu #accordion-drinks .icoon .col-3 h4{position:relative;}
.reg_menu #accordion-drinks .icoon .col-3 h4:before{content:"";position:absolute;top:-30px;left:0;right:0;margin:0 auto;width:20px;height:20px;background-position:50% 100%;}
.reg_menu #accordion-drinks .icoon .col-3 h4:last-of-type:before{width:30px; height:30px;top:-35px;}
.reg_menu #accordion-drinks .icoon.koffie .col-3 h4:before{background-image:url('./images/icoon-koffie.svg');}
.reg_menu #accordion-drinks .icoon.sap .col-3 h4:before{background-image:url('./images/icoon-sap.svg');}

/* Vestigingen */
.filter{}
.filter ul{list-style:none;margin:0;padding:0}
.filter ul li{display:inline-block;margin-top:10px;}
.filter ul li + li{margin-left:10px;}
.filter ul li a{}

.plaatsen{margin-top:90px;}
.plaatsen .plaats{border-bottom:3px solid var(--grijs);}
.plaatsen .plaats h3{ -webkit-text-stroke:2px #000;color:var(--zwart);margin:25px 0 30px 0}
.plaatsen .plaats .item{border-top:3px solid var(--grijs);padding:30px 0}

.vestiging-part{}
.vestiging-part .img{aspect-ratio:4/3;}
.vestiging-part .img img{}
/* .mac-os .vestiging-part .img img::before{float: left;padding-top: 75%;content: "";}
.mac-os .vestiging-part .img img::after{display: block;content: "";clear: both;} */
.vestiging-part .txt{position:relative;height:100%;}
.vestiging-part .txt h4{color:var(--zwart)}
.vestiging-part .txt .adres{font-size:16px;line-height:1.5;vertical-align:top;}
.vestiging-part .txt .openingstijden{font-size:16px;line-height:1.5;vertical-align:top;margin-top:30px;}
.vestiging-part .txt .btn{width:100%;text-align:center;margin-top:30px;}

.page-template-franchise .img{height:auto;width:calc(100% + 24px);margin:0 0 60px -12px}

.adres{}
.maps.mobile{height:250px;margin-left:-12px;width:calc(100% + 24px);}
:is(.adres,.openingstijden) h3{margin-bottom:15px;word-break:break-word;}
.openingstijden :is(b,span){width:200px;display:inline-block;}
.openingstijden span + span{text-align:right}

.single-vestigingen .order{color:#fff;background:#000;padding:60px 12px;width:calc(100% + 24px);margin-left:-12px;}
.single-vestigingen .order :is(a,.glf-button){color:#fff;border-color:#fff;font-size:14px;padding:10px;}
.mac-os .single-vestigingen .order :is(a,.glf-button){padding:10px 10px 5px 10px}
/* .single-vestigingen .order .bestellen + :is(a,.glf-button),.glf-button + .glf-button{margin-left:25px !important;} */ 
.single-vestigingen .order .bestellen{position:relative;}
.single-vestigingen .order ul{list-style:none;margin:0;padding:0;background-color:#fff;opacity:0;position:absolute;width:calc(100vw - 24px);border:2px solid #000;transform:translateY(10px);transition:var(--default-transition);z-index: -1;}
.single-vestigingen .order .active ul{opacity:1;transform:translateY(-2px);z-index:1;}
.single-vestigingen .order .active .btn{border-color:#000;background-color:#fff !important;color:#000;border-bottom-color:#fff;position:relative;z-index:2;}
.single-vestigingen .order .btn i{transition:all 150ms;transform:rotate(0deg);}
.single-vestigingen .order .active .btn i{transform:rotate(180deg);}

.single-vestigingen .order ul li{}
.single-vestigingen .order ul li a{padding:15px 30px;display:block;}
.single-vestigingen .order ul li a img{max-height:24px;}

.instagram .sbi_follow_btn a{border:2px solid #000 !important;padding:5px 10px 10px 10px !important;text-decoration:none;border-radius:0 !important;font-size:14px !important;text-transform:uppercase;color:#000 !important;transition:var(--default-transition) ;background:transparent !important;font-family:var(--font-trend);line-height:1.5;margin:0 !important;vertical-align:unset !important;}
.mac-os .instagram .sbi_follow_btn a{padding:10px 10px 5px 10px !important}
.instagram .sbi_follow_btn a:hover{color:#fff !important;background:#000 !important;border-color:#000 !important;box-shadow:none !important;}
.instagram #sb_instagram .sbi_follow_btn a{border:2px solid #000 !important}
.instagram .img img{aspect-ratio:1/1;object-fit:cover;width: 100%;}

/* Vacatures accordion */
#accordionGroup{width:100%;}
.accordion-item{border:none;background-color:transparent;border-top:3px solid var(--grijs) !important;}
.accordion-header{padding:0;border:none;}
.accordion-button{background-color:transparent;padding:25px 0 30px 0;text-decoration:none;color:var(--donker-grijs);display:block;}
.accordion-button span{display:block;font-size:14px;}
.accordion-button span + span{font-size:20px;margin-top:5px;}
.accordion-body{padding:20px 0 10px 0;font-size:16px;}
.accordion-body .contact{margin-top:-30px;}
.accordion-body a.btn + a.btn{margin-left:30px;}
.accordion-button:not(.collapsed){background-color:transparent;border:none;color:var(--donker-grijs);box-shadow:none;}
/* .accordion-button:after{content:"\e59e";font-family:'Font Awesome 6 Pro';background:none;width:auto;height:auto;font-weight:300;color:var(--donker-grijs);position:absolute;right:0;top:38px;font-weight:400;font-size:20px;background:none !important;} */
.accordion-button:before{position:absolute;right:0;background:none;content:"";width:22px;height:2px;background-color:var(--donker-grijs);top:45px;}
.accordion-button:after{position:absolute;right:0;background:none;content:"";width:22px;height:2px;background-color:var(--donker-grijs);transform: rotate(-90deg);transform-origin: 50% 50%;top:45px;}
.accordoin-button:not(.collapsed):after{content:"";background:none;}

/* Menu accordion */
.reg_menu{background-color:#000;color:#fff;padding:75px 0;position:relative;z-index:2;}
.reg_menu .accordion-item{color:#fff;border:none !important;}
.reg_menu .accordion-header{position:relative;border-bottom:1px solid #fff;}
.reg_menu .accordion-header a.accordion-button{padding-left:40px;}
.reg_menu .accordion-header a.accordion-button:hover{cursor:pointer;}
.reg_menu .accordion-button{color:#fff;font-size:20px;}
.reg_menu .accordion-button:before{position:absolute;left:0;right:auto;background:none;content:"";width:22px;height:2px;background-color:#fff;top:35px}
.reg_menu .accordion-button:after{position:absolute;left:0;right:auto;background:none;content:"";width:22px;height:2px;background-color:#fff;transform: rotate(-90deg);transform-origin: 50% 50%;top:35px;}
.reg_menu .accordion-button:not(.collapsed):after{transform:rotate(0deg);}
.reg_menu .accordion-button:after{color:#fff}
.reg_menu + .galerij-wrapper{margin-top:-45px;position:relative;z-index:1;}

/* Contact */
.contact h3{font-size:30px;margin:0 0 30px 0;text-transform:uppercase;}
.contact p + h3{margin-top:40px}
.contact a i{color:var(--zwart)}
.contact .wpcf7{margin-bottom:60px}

/* Footer */
.footer{background:url("images/marmer-textuur-zwart.jpg") no-repeat 50% 50%;color:#fff;background-size:cover;font-family:var(--font-trend);font-size:18px;}
.footer .logo{margin-top:0;display:block;height:50px;}
.social{font-size:20px;}
.footer .social a,.social a{color:#fff;width:40px;height:40px;text-align:center;display:inline-block;}
.social a + a{margin-left:10px;}
.footer a,.copyright a{color:#fff;text-decoration:none}
.copyright{font-size:10px;}
.footer ul.footernav{list-style:none;margin:0;padding:0}
.footer ul.footernav li{list-style-type:none;}
.footer ul.footernav li a{font-size:14px;line-height:2.5;}

/* Contact form */
.wpcf7-form{margin-top:40px}
.wpcf7-form table{width:100%}
.wpcf7-form .wpcf7-form-control-wrap{position:relative;}
.wpcf7-form .field{display:block;margin-bottom:20px}
.wpcf7-form strong{margin-bottom:5px;display:block;font-weight:700;}
.wpcf7-form .telefoonnummer input{width:200px}
.wpcf7-form td{padding-bottom:20px}
.wpcf7-form :is(input[type="date"],input[type="text"],input[type="number"],input[type="email"],input[type="url"],input[type="tel"],select,textarea){margin:0 0 10px 0;padding:10px;border:1px solid var(--zwart);width:100%;color:var(--zwart);background-color:var(--blauw-licht);border-radius:5px;}
.wpcf7-form select{
-webkit-appearance: none !important;
-moz-appearance: none !important;
width: 100%;
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAUCAMAAACtdX32AAAAdVBMVEUAAAD///8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAhMdQaAAAAJ3RSTlMAAAECAwQGBwsOFBwkJTg5RUZ4eYCHkJefpaytrsXGy8zW3+Do8vNn0bsyAAAAYElEQVR42tXROwJDQAAA0Ymw1p9kiT+L5P5HVEi3qJn2lcPjtIuzUIJ/rhIGy762N3XaThqMN1ZPALsZPEzG1x8LrFL77DHBnEMxBewz0fJ6LyFHTPL7xhwzWYrJ9z22AqmQBV757MHfAAAAAElFTkSuQmCC);
background-position: 100%;
background-repeat: no-repeat;
}
select.wpcf7-not-valid,input.wpcf7-not-valid,textarea.wpcf7-not-valid{border:1px solid #ff0000 !important}
.wpcf7-form :is(input[type="text"],input[type="email"],input[type="number"],input[type="tel"],input[type="text"],textarea)::placeholder{color: var(--zwart) !important;}
.wpcf7-validation-errors{border:2px solid #ff0000 !important;margin:0 0 20px 0 !important;color:#ff0000 !important;padding:10px !important}
span.wpcf7-not-valid-tip{font-size:12px;position:absolute;top:calc(50% - 6px);right:40px;line-height:1;pointer-events:none;}
div.wpcf7-response-output{margin-top:30px !important;background-color:rgba(152,27,30,0.1);padding:10px 20px !important}
.wpcf7 form.invalid .wpcf7-response-output{background-color:rgba(255,185,0,0.1);}
.wpcf7 form.sent .wpcf7-response-output{background-color:rgba(70,180,80,0.1);}
#wpcf7-f57-p20-o1 .versturen{margin-bottom:0}

/* Contact form validation */


/* Default Wordpress */
.entry-content td{padding-right:20px}
.alignleft{float:left;margin-right:20px}
.alignright{float:right;margin-left:20px}
.aligncenter{clear:both;display:block;margin:0 auto 20px}
blockquote{font-style:italic;border-left:4px solid #e1001a;padding-left:10px}

/* IE fixes */
.widget-area{width:100%}
.table-striped>tbody>tr:nth-of-type(odd){background-color:rgba(255,255,255,0.1);}
.table>tbody>tr>td{border:none;}
video{height:100%;object-fit:cover;object-position:center;width:100%;}
.video-container {position: relative;padding-bottom: 56.25%;padding-top: 30px; height: 0; overflow: hidden;margin-bottom:30px}
.video-container iframe,.video-container object,.video-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
iframe[name='google_conversion_frame'] {font-size: 0 !important;height: 0 !important;line-height: 0 !important;margin-top: -13px;width: 0 !important;}

/* Responsive oembed */
.embed-container {position: relative;padding-bottom: 56.25%;height: 0;overflow: hidden;max-width: 100%;height: auto;} 
.embed-container iframe,.embed-container object,.embed-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

/* Paddings & Margins */
.p-15{padding: 15px 0;}
.p-30{padding: 30px 0;}
.p-60{padding: 60px 0;}
.p-75{padding: 75px 0;}
.p-90{padding: 45px 0;}
.p-165{padding: 165px 0;}

/* v2 - Nav */
.top a .logo{height: 50px;}

/* v2 - Offcanvas */
.offcanvas-header .logo{height: 50px !important;}
.offcanvas-body ul.nav{margin-top: -50px;}
.offcanvas-header .logo{height: unset;}
.offcanvas-body li a{padding: 10px 0;margin-bottom: 10px;}
.offcanvas-header, .offcanvas-body{padding-left: 0;padding-right: 0;}

/* v2 - Cookiepagina */
.cookie-content h2{font-size: 24px;margin:30px 0 20px 0;}
.cookie-content h3{font-size: 22px;margin:30px 0 20px 0;}
.cookie-content h4{font-size: 20px;margin:30px 0 20px 0;}

/* v2 - Vestigingspagina */
.single-vestigingen #orderlist li a{transition: var(--default-transition);display: flex;align-items:center;padding:20px !important;}
.single-vestigingen .order ul{width: 100%;min-width: calc(100% + 150px);max-width: 400px;}
.single-vestigingen .order h3, .single-vestigingen .svww, .single-vestigingen .adres{word-break:break-word;}
.single-vestigingen #sb_instagram #sbi_images{margin:24px 0 20px 0 !important;}
.single-vestigingen #sb_instagram #sbi_images .sbi_item{margin-bottom: 20px !important;}

.single-vestigingen .order .active ul{z-index: 10;border-top: none;}

/* v2 - Franchise */
.long-img{height: unset !important;}

/* v2 - Galerij */
@media(max-width: 767px){
	/*.menu .galerij img:nth-child(1){top: 0px;left: 0;width: 80%;height: 45%;z-index: 4;}
	.menu .galerij img:nth-child(2){top: 50px;left: unset;right: 0;width: 50%;height: 47%;z-index: 4;}
	.menu .galerij img:nth-child(3){bottom: 50px;right: unset;left: 25px;width: 40%;height: 60%;z-index: 4;}
	.menu .galerij img:nth-child(4){bottom: 0;left: unset;right: 25px;width: 70%;height: 40%;z-index: 1;}*/

	.menu .galerij a:nth-child(1){top: 0px;left: 0;width: 80%;height: 45%;z-index: 4;}
	.menu .galerij a:nth-child(2){top: 50px;left: unset;right: 0;width: 50%;height: 47%;z-index: 4;}
	.menu .galerij a:nth-child(3){bottom: 50px;right: unset;left: 25px;width: 40%;height: 60%;z-index: 4;}
	.menu .galerij a:nth-child(4){bottom: 0;left: unset;right: 25px;width: 70%;height: 40%;z-index: 1;}

	.verhaal .galerij img:nth-child(1){top: 50px;left: 0;width: 80%;height: 55%;z-index: 2;}
	.verhaal .galerij img:nth-child(2){top: 100px;right: 0;width: 40%;height: 70%;z-index: 2;}
	.verhaal .galerij img:nth-child(3){bottom: 0;left: 20%;width: 35%;height: 55%;z-index: 3;}
}

/* 06-2023 */
#gifty-container{z-index:999 !important;}

/* ------------------------------ Media Queries ------------------------------ */
@media (min-width: 481px) {
	.single-vestigingen #sb_instagram #sbi_images{margin-left: -10px !important;margin-right: -10px !important;width: calc(100% + 20px);}
	.single-vestigingen #sb_instagram #sbi_images .sbi_item{padding-left: 10px !important;padding-right: 10px !important;}
}
@media (min-width: 576px) {
	/* v2 - Vestigingspagina */
	.single-vestigingen .order{width: 100vw;left: calc((100vw - 540px) / -2);position: relative;padding-left:calc((100vw - 540px + 24px)/2);padding-right: calc((100vw - 540px + 24px)/2);}
}
/*@media(min-width: 576px) and (max-width: 991px){
	.single-vestigingen .order{width:calc(100vw - 9px);}
}*/
@media (min-width: 768px) {
	.p-90{padding: 75px 0;}
	.p-30-90{padding: 30px 0 75px 0;}
	.p-60-90{padding: 60px 0 75px 0;}
	.p-60-66{padding: 60px 0 51px 0;}

	/* Parallax boontjes */
	/*.parallax{background-size:cover;z-index:999;}
	.boon{background-image:url("images/boon.png");width:90px;height:120px;filter:blur(8px);position:absolute;top:200px;left:-45px}
	.boon.bottom{bottom:5%;top:initial}
	.bonen{background-image:url("images/bonen.png");width:calc(500px / 2);height:350px;filter:blur(8px);position:absolute;top:60%;right:0}*/

	/* v2 - Offcanvas */
	.offcanvas-header .logo{height: 50px !important;}
	.offcanvas-body ul.nav{margin-top: -100px;}
	.offcanvas-header .logo{height: unset;}
	.offcanvas-body li a{padding: 20px 0 10px 0;margin-bottom: 15px;}

	/* v2 - Vestigingspagina */
	.single-vestigingen .order{left: calc((100vw - 720px) / -2);padding-left:calc((100vw - 720px + 24px)/2);padding-right:calc((100vw - 720px + 24px)/2);}
}
@media (max-width: 991px) {
	.marmer::before{background-attachment: scroll;background-size: contain;}
}
@media (min-width: 992px) {
	html,body{font-size:30px;}
	:is(h1,h2,h3,h4,h5).fs-52{font-size:52px;}
	
	.p-90{padding: 90px 0;}
	.p-30-90{padding: 30px 0 90px 0;}
	.p-60-90{padding: 60px 0 90px 0;}
	.p-60-66{padding: 60px 0 66px 0;}

	/* .offcanvas{width:500px !important;} */
	img{max-width:100%;height:auto}
	h1,h2,h3,h4,.subtitel,.kop{line-height:1em;font-weight:200;font-family:var(--font-trend);text-transform:uppercase;}
	h1{font-size:120px;margin:0 0 30px 0;}
	h2{font-size:80px;margin:0 0 30px 0;letter-spacing:1.5px;}
	h3{font-size:35px;margin:0 0 30px 0;letter-spacing:1.5px;}
	h4{font-size:30px;margin:0 0 30px 0;letter-spacing:1.5px;}
	.subtitel{font-size:30px;letter-spacing:1.5px;}
	.kop{font-size:20px;letter-spacing:1.5px;}
	.top{padding:45px 0 0 0;font-size:25px;}
	.offcanvas-body li a{padding:10px 0 10px 0;margin-bottom:15px;font-size:50px;}

	/* Links & btn's */
	.link{font-size:30px;}
	/* .btn,.glf-button{padding:5px 20px 10px 20px;font-size:20px;} */
	.btn,.glf-button{padding:10px 20px 10px 20px;font-size:20px;font-weight:200;}
	/* .mac-os .btn,.mac-os .glf-button{padding:10px 20px 5px 20px} */
	.mac-os .btn,.mac-os .glf-button{padding:10px 20px 10px 20px}
	.btn.m-100{width:auto;text-align:inherit}
	.glf-button{padding:5px 20px 10px 20px !important;font-size:20px !important;}

	.margin-top-300{margin-top:300px;}
	.margin-top-400{margin-top:400px;}
	.blok{padding:160px 0}
	.blok-top{padding:160px 0 0 0}

	/*.boon{width:256px;height:334px;left:-100px}
	.bonen{width:calc(835px / 2);height:689px;right:0}*/

	.filter ul li + li{margin-left:15px;}
	:is(.menu,.verhaal,.galerij-wrapper) .galerij{position:relative;height:100vh;}
/*	.maps iframe{width:calc(100% + (100vw - 960px + 28px) / 2)}*/
	.maps iframe{width:calc(100% + (100vw - 960px + 6px) / 2)}
	
	.vestiging-part .txt .adres{font-size:20px;}
	.vestiging-part .txt .openingstijden{font-size:22px;margin:0}
	.vestiging-part .txt .btn{position:absolute;right:0;bottom:0;margin:0;text-align:inherit;width:auto;}
	
	.menu .specials h3{margin-bottom:75px;}
	.reg_menu .accordion-header a.accordion-button{padding-left:60px;}
	/* .accordion-button:after{top:25px;font-size:30px;} */
	.accordion-button:before{top:40px;}
	.accordion-button:after{top:40px;font-size:30px;}
	.accordion-button span{display:inline-block;font-size:30px;}
	.accordion-button span + span{font-size:30px;margin:0 0 0 10px;}
	.accordion-body{padding:50px 0 30px 0;font-size:25px;}
	:is(.menu .items,.reg_menu .accordion-body) small{font-size:20px;line-height:22px;display:block;}
	:is(.menu .items,.reg_menu .accordion-body) .row + .row{margin-top:30px;}
	.reg_menu .accordion-button{font-size:40px;}
	.reg_menu .accordion-button:before{top:45px}
	.reg_menu .accordion-button:after{top:45px;}

	.galerij-wrapper.odd .galerij img:nth-child(2){top:-100px;}

	.page-template-franchise .img{height:100%;width:100%;margin:0}

	.single-vestigingen .order{background:rgba(0,0,0,0.5);padding: 60px;width:100%;margin:0}
	/* .single-vestigingen .order :is(a,.glf-button){padding:5px 20px 10px 20px !important;font-size:20px !important;} */
	.single-vestigingen .order :is(a,.glf-button){padding:10px 20px 10px 20px !important;font-size:18px !important;}
	/* .mac-os.single-vestigingen .order :is(a,.glf-button){padding:10px 20px 5px 20px !important;} */
	.mac-os.single-vestigingen .order :is(a,.glf-button){padding:10px 20px 10px 20px !important;}
	.single-vestigingen .order ul{width:415px;}
	:is(.adres,.openingstijden) h3{margin-bottom:25px;}

	.footer .logo{height:auto}
	.footer ul.footernav li{display:inline-block;}
	.footer ul.footernav li a{font-size:18px;line-height:1.5;}
	.footer ul.footernav li + li{margin-left:30px;}

	/* v2 - Nav */
	.top a .logo{height: auto;}

	/* v2 - Offcanvas */
	.offcanvas-header .logo{height: auto !important;}
	.offcanvas-header{padding-top: 45px;}
	.offcanvas-header .lang{font-size: 25px;}

	/* v2 - Cookiepagina */
	.cookie-content h2{font-size: 32px;margin:50px 0 30px 0;}
	.cookie-content h3{font-size: 30px;margin:50px 0 30px 0;}
	.cookie-content h4{font-size: 28px;margin:50px 0 30px 0;}

	/* v2 - Vestigingspagina */
	.single-vestigingen #orderlist li a:hover{background: #ededed;}
	.single-vestigingen .order{width:calc(100% + 80px);left: -80px;padding-left:unset;padding: 60px;}

	.single-vestigingen #sb_instagram #sbi_images{margin-top:44px !important;margin-bottom:40px !important;}

	/* v2 - Vestigingen archief */
	.vestiging-part .img-col .img{height: 100%;width: 100%;}
	.vestiging-part .txt .info-row .info-col{margin-top: 30px;}
	.vestiging-part .txt .info-row .btn{position: relative;}
}
@media (min-width: 1200px) {
/*	.maps iframe{width:calc(100% + (100vw - 1140px + 28px) / 2)}*/
	.maps iframe{width:calc(100% + (100vw - 1140px + 6px) / 2)}
	.koffies .img{width:calc(100% + (100vw - 1140px + 28px - 60px) / 2)}
	.page-template-franchise .img{width:calc(100% + (100vw - 1140px + 28px - 60px) / 2);margin-left:calc((100vw - 1140px + 28px - 60px) / -2);}

	/* v2 - Vestigingspagina */
	.single-vestigingen .order{width:100%;left: unset;}
}
@media (min-width: 1400px) {
/*	.maps iframe{width:calc(100% + (100vw - 1320px + 28px) / 2)}*/
	.maps iframe{width:calc(100% + (100vw - 1320px + 6px) / 2)}
	.koffies .img{width:calc(100% + (100vw - 1320px + 28px - 60px) / 2)}
}
@media (min-width: 1600px) {
	.reg_menu{max-width:1600px;box-shadow:0 0 20px 0 rgba(0,0,0,0.5);margin:0 auto;padding:90px 0}
}

/* Font sizes */
@media(min-width: 375px) and (max-width: 1920px) {
	html{font-size: 16px;}
/*	h1, h2, h3, h4{word-break: break-word;}*/

	h1{font-size: clamp( 2.8rem, 1.67rem + 4.85vw, 7.5rem );}
	h2{font-size: clamp( 2.2rem, 1.5rem + 2.91vw, 5rem);}
	/* h2 small{} */
	h3, .offcanvas-body li a{font-size: clamp( 1.6rem, 1.41rem + 0.65vw, 2.2rem );}
	h4{font-size: clamp( 1.125rem, 0.95rem + 0.78vw, 1.875rem );}
	p,select{font-size: clamp( 1rem, 0.78rem + 0.9vw, 1.875rem );line-height:1.5em;}
	/* small text */
	.btn{font-size: clamp( 0.875rem, 0.78rem + 0.39vw, 1.25rem );}
}



/* Toegevoegd door Die Jongens */ 
.order .opties{
	display: flex;
	flex-wrap: wrap;
	column-gap: 25px;
	row-gap: 15px;
}
.order .bestellen,
.single-vestigingen .order :is(a, .glf-button) {
  flex: 1 1 calc(50% - 12.5px);
}
.order .bestellen a{
	height: 100%;
	width: 100%;
}
.opties .glf-button{
	padding:10px !important;
}