/*********/
/*************************************************************************************************************************************/
/*********/
/* ROOT */
:root,
.elementor-kit-6 {
    --lightyellow: var(--e-global-color-primary);
    --darkblue: var(--e-global-color-secondary);
    --text: var(--e-global-color-text);
    --accent: var(--e-global-color-accent);
    --natuurcamping: var(--e-global-color-db6485e);
    --brasserie: var(--e-global-color-5b38dde);
    --tiny-houses: var(--e-global-color-728753e);
    --activiteiten: var(--e-global-color-8f44c58);
    --white: var(--e-global-color-3cbce3a);
    --trans: var(--e-global-color-0e7dc08);
    --iconblue: var(--e-global-color-cc08f95);
    --iconred: var(--e-global-color-87ceb6c);
    --iconyellowlight: var(--e-global-color-36b984b);
    --iconyellowdark: var(--e-global-color-30b2435);
    --hovergrey: var(--e-global-color-8245131);
	--cubix: cubic-bezier(.8,0,.4,1);
    --cubixslow: cubic-bezier(.55,0,0,1);
}
@media (max-width:767px) {
	.e-con,
    :root {
		--def:clamp(300px, calc(24.57vw + 231.55px), 420px);/*320px @ 360 : 420px @ 767*/
		--small:clamp(290px, calc(19.66vw + 209.24px), 360px); /*280px @ 360 : 360px @ 767*/
		--wide:clamp(300px, calc(63.88vw + 90.02px), 580px); /*320px @ 360 : 580px @ 767*/
	}
}
/* WP ADMIN BAR */
/* Hide all */
body:not(.webadmin) #wpadminbar li {
    display: none !important;
}
/* Admin top menu */
body:not(.webadmin) #wpadminbar li#wp-admin-bar-site-name,
body:not(.webadmin) #wpadminbar li#wp-admin-bar-my-account,
body:not(.webadmin) #wpadminbar li#wp-admin-bar-logout {
    display: inherit !important;
}
/*********/
/*************************************************************************************************************************************/
/*********/
/* HTML,BODY */
body,
html {
    overflow-x: hidden !important;
}
body {
    position:relative;
}
body.page:not(.home),
body.wp-singular:not(.home):not(.single-activiteiten):not(.single-brasserie):not(.single-natuurcamping):not(.single-tiny-houses) {
    background-color: var(--darkblue);
}
/* clears the ‘X’ from search input Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    filter: grayscale(100%) invert(1) brightness(200%);
}
/* Hide content if it has no data, from ACF shortcode function brro_data */
[brro_data="no-content"] {
	display:none!important;
}

/* Hide elements bases on class or screensize */
.only {
	display:none!important;
}
.only.single-post {
	display: inherit!important;
}
@media (min-width:1180px) {
    .only.desk {
        display:inherit!important;
    }
    .only.mob:not(.desk),
    .only.tab:not(.desk) {
        display:none!important;
    }
}
@media (min-width:768px) and (max-width:1179px) {
    .only.tab {
        display:inherit!important;
    }
    .only.mob:not(.tab),
    .only.desk:not(.tab) {
        display:none!important;
    }
}
@media (max-width:767px) {
    .only.mob {
        display:inherit!important;
    }
    .only.desk:not(.mob),
    .only.tab:not(.mob) {
        display:none!important;
    }
}



/*********/
/*************************************************************************************************************************************/
/*********/
/* ELEMENTOR EDITOR */
/* Captcha inline */
.elementor-field-type-recaptcha_v3.recaptcha_v3-inline {
    height: 5px;
    margin-bottom: 0px !important;
    opacity: 0;
    visibility: hidden;
}
/* HTML show if has script */
.elementor-editor-active .elementor-widget-html:not(.hidejs) script {
    display: block;
    max-height: 30px;
    border: 4px solid red;
    overflow: hidden;
    font-size: 10px;
    line-height: 12px;
}
/* Highlight spacer */
.elementor-editor-active .elementor-spacer {
    background: grey;
    opacity: 0.2;
}
/* Highlight empty widget */
.elementor-editor-active .elementor-element.elementor-widget-empty .elementor-widget-empty-icon {
    border: 4px solid red;
}
/*********/
/*************************************************************************************************************************************/
/*********/
/* HEADER */
#verderweglogo svg {
    width: clamp(395px, 33.47vw, 536px)!important;
    height: auto;
}
#verderweglogo {
    overflow: hidden;
}

header.darkbg #nav-icon .bar { 
    background-color: var(--white)!important;
}
.logo-fill,
header.darkbg.navmenu a svg {
    transition: fill 600ms var(--cubix)!important;
}
header.darkbg .logo-fill, 
.darkblue header .logo-fill,
.turn-hero-white header .logo-fill,
header.darkbg .navmenu a:not(:hover) svg {
    fill: var(--white)!important;
}
header .logo-fill { 
    fill: var(--darkblue);
}
header.darkbg .navmenu a:not(:hover) {
    color: var(--white)!important;
}

#underline {
    width: 55px;
}
#wegrechts {
    transform: translateX(-325.5px);
}
.home #underline,
.home.closed-navpopup header:not(.brro-sticky-effects) #underline,
.open-navpopup #underline {
    animation: wegLine 2s var(--cubix) forwards;
}
.home #wegrechts,
.home.closed-navpopup header:not(.brro-sticky-effects) #wegrechts,
.open-navpopup #wegrechts {
    animation: wegMove 2s var(--cubix) forwards;
    will-change: transform;
}
#underline, #wegrechts {
    transition: width 2s var(--cubix), transform 2s var(--cubix);
    animation-delay: 1s;
}

.home:not(.open-navpopup) header.brro-sticky-effects #underline,
.closed-navpopup #underline {
    animation: wegLineReverse 2s var(--cubix) forwards;
}
.home:not(.open-navpopup) header.brro-sticky-effects #wegrechts,
.closed-navpopup #wegrechts {
    animation: wegMoveReverse 2s var(--cubix) forwards;
}

@media (max-width: 767px) {
    @keyframes wegLine {
        from { width: 55px; }
        to { width: 200px; } /* Adjusted for mobile */
    }
    @keyframes wegMove {
        from { transform: translateX(-325.5px); } 
        to { transform: translateX(-180.5px); } /* Adjusted for mobile */
    }
    @keyframes wegLineReverse {
        from { width: 200px; }
        to { width: 55px; }
    }
    @keyframes wegMoveReverse {
        from { transform: translateX(-180.5px); }
        to { transform: translateX(-325.5px); }
    }
}
@media (min-width: 768px) {
    @keyframes wegLine {
        from { width: 55px; }
        to { width: 381.35px; }
    }
    @keyframes wegMove {
        from { transform: translateX(-325.5px); }
        to { transform: translateX(0px); }
    }
    @keyframes wegLineReverse {
        from { width: 381.35px; }
        to { width: 55px; }
    }
    @keyframes wegMoveReverse {
        from { transform: translateX(0px); }
        to { transform: translateX(-325.5px); }
    }
}
.navburger .elementor-shortcode {
    width: clamp(37px, 3.13vw, 50px) /*45px @ 1440*/;
    height: clamp(37px, 3.13vw, 50px) /*45px @ 1440*/;
    display: flex;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
}
.navburger #nav-icon:after {
    content: '';
    position: absolute;
    z-index: -1;
    top: 50%;
    transform: translateY(-50%);
    width: 0px;
    height: 0px;
    border-radius: 50%;
    transition: width 1200ms var(--cubixslow), height 1200ms var(--cubixslow), background-color 50ms var(--cubix) 1200ms;
    background-color:transparent;
}
.navburger.open #nav-icon:after {
    background-color: var(--darkblue);
    transition: width 1200ms var(--cubixslow), height 1200ms var(--cubixslow), background-color 50ms var(--cubix);
}

@media (orientation: landscape) {
    .navburger.open #nav-icon:after {
        width: 300vw!important;
        height: 300vw!important;
    }
}

@media (orientation: portrait) {
    .navburger.open #nav-icon:after {
        width: 250vh!important;
        height: 250vh!important;
    }
}
header.brro-sticky-effects #nav-icon:after, 
body:not(.home) header .navburger #nav-icon:after  {
    width: clamp(37px, 3.13vw, 50px) /*45px @ 1440*/;
    height: clamp(37px, 3.13vw, 50px) /*45px @ 1440*/;
    background-color: var(--darkblue);
    transition: width 1200ms var(--cubixslow), height 1200ms var(--cubixslow), background-color 50ms var(--cubix);
}
header.brro-sticky-effects .navburger .bar,
body:not(.home) header	.navburger .bar {
    background-color: var(--white)!important;
}
header:not(.brro-sticky-effects):not(.darkbg) .navburger .bar {
    transition: background-color 400ms var(--cubix) 800ms!important;
}


/* Headerup */
header.brro-sticky,
header.brro-sticky .sticky-show {
    -webkit-transition: transform 650ms var(--cubix)!important;
    transition: transform 650ms var(--cubix)!important;
}
header.brro-sticky {
	position:fixed;
    z-index: 99;
}
/* 
*
* If entire sticky header goes up and down
*
*/

header.brro-sticky-effects,
body:not(.home) header {
	transform: translateY(-300px);
}
header.brro-sticky-effects .sticky-show,
body:not(.home) header .sticky-show {
	transform: translateY(300px);
}

/* Mobile nav popper */
header .elementor-shortcode {
    line-height: 0;
}

@media (min-aspect-ratio: 16/9), (max-width: 1179px) {
    #fullscreen-navpopup {
        top: calc(100px + 50%)!important;
    }
}
@media (max-aspect-ratio: 16/9), (min-width: 1180px) {
    #fullscreen-navpopup {
        top: 50%;
    }
}
#fullscreen-navpopup {
    position: fixed;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    height: auto;
    z-index: 9999;
}
#fullscreen-navpopup .popup-content {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: flex-start;
    flex-wrap: wrap;
    gap: clamp(54px, 4.58vw, 73px) /*66px @ 1440*/;
    overflow-y: auto;
    max-height: calc(100vh - 100px);
    width: 100%;
    padding-bottom: 100px;
    box-sizing: border-box;
}
#fullscreen-navpopup .popup-section {
    display: flex;
    flex-direction: column;
    gap: clamp(21px, 1.81vw, 29px) /*26px @ 1440*/;
    align-items: flex-start;
}

@media (max-width: 767px) {
    #fullscreen-navpopup .popup-content {
        width: var(--def)!important;
    }
}
@media (max-width: 1023px) {
    #fullscreen-navpopup .popup-content {
        padding-bottom: clamp(120px, calc(14.74vw + 66.93px), 180px) /*120px @ 360 : 180px @ 767*/;
        flex-direction: column;
        align-items: start;
        justify-content: flex-start;
        flex-wrap: nowrap;
        width: clamp(704px, calc(72.99vw + 143.42px), 1004px) /*704px @ 768 : 1004px @ 1179*/;
        margin: 0 auto;
    }
}

.elementor-location-header {
    z-index: 9998;
    position: relative;
}

/*
 * 
 * Media Queries */

/* Desktop */
@media (min-width:1180px) {
} 
/* Tablet onwards */
@media (min-width:768px) {
} 
/* Tablet only */
@media (min-width:768px) and (max-width:1179px) {
} 
/* Mobile */
@media (max-width:767px) {
}

/*********/
/*************************************************************************************************************************************/
/*********/
/* FOOTER */
/* back to top btn*/
#to-top.not-to-top {
    z-index: -1;
    pointer-events: none;
    opacity: 0;
}
#to-top {
    transition: opacity 600ms ease;
}
#to-top.not-to-top {
    z-index: -1;
    pointer-events: none;
    opacity: 0;
}
#to-top:hover {
	transform:translateY(-12px);
}
#to-top {
    transition: all 600ms ease;
	position:fixed;
	right:12px;
	bottom:12px;
	z-index:9999;
}
@media (min-width:1180px) {
	#to-top {
		width:clamp(72px, 6.11vw, 117px) /*88px @ 1440*/;
		height:clamp(144px, 12.22vw, 235px) /*176px @ 1440*/;
	}
}
@media (max-width:1179px) {
	#to-top {
		width:clamp(54px, calc(8.76vw - 31.27px), 72px) /*72px @ 1179*/;
		height:clamp(108px, calc(17.52vw - 62.54px), 144px) /*144px @ 1179*/;
	}
}

#page-top {
	width:100%;
	position:absolute;
	height:1px;
	margin-bottom:-1px;
	top:-1px;
}

footer svg {
    width: clamp(129px, 10.97vw, 176px);
    height: auto;
}
svg .footer-logo,
body.darkbg svg .footer-logo {
	fill: var(--lightyellow);
}
body.lightbg svg .footer-logo {
	fill: var(--darkblue);
}


/*********/
/*************************************************************************************************************************************/
/*********/
/* SECTIONS/CONTAINERS */

/*********/
/*************************************************************************************************************************************/
/*********/
/* Loops */

/*********/
/*************************************************************************************************************************************/
/*********/
/* TEXT STYLES */
/* Active navigation links

a.current-page-open {
    
}

*/

.default-a a:hover {
    color: var(--activiteiten)!important;
}
.custom-post-verderweg .default-a a:hover{
    color: var(--lightyellow)!important;
}


/* buttons */
.verderweg-buttons {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    gap: clamp(16px, 3.47vw, 56px);
    flex-wrap: wrap;
}

.verderweg-button a.elementor-button:hover,
a.verderweg-button:hover {
    background-color: var(--hovergrey)!important;
    color: var(--lightyellow)!important;
}
.verderweg-button .elementor-button,
a.verderweg-button {
    display: inline-flex!important;
    justify-content: center!important;
    align-items: center!important;
    flex-shrink: 0!important;
    transition: all 300ms var(--cubix)!important;
    background-color: var(--lightyellow);
    color: var(--darkblue);
    line-height: 100%!important;
    /* small button default */
    min-height: clamp(37px, 3.13vw, 50px) /*45px @ 1440*/!important;
    border-radius: clamp(25px, 2.08vw, 33px)!important;
    padding: 0px clamp(17px, 1.46vw, 23px) 2px clamp(17px, 1.46vw, 23px)!important;
    font-family: var(--e-global-typography-text-font-family), Sans-serif!important;
    font-size: var(--e-global-typography-text-font-size)!important;
    font-weight: var(--e-global-typography-text-font-weight)!important;
    text-transform: lowercase!important;
    font-style: var(--e-global-typography-text-font-style)!important;
    text-decoration: var(--e-global-typography-text-text-decoration)!important;
    letter-spacing: var(--e-global-typography-text-letter-spacing)!important;
    
}
.verderweg-button.xl a.elementor-button,
a.verderweg-button.xl {
    min-height: clamp(61px, 5.21vw, 83px) /*75px @ 1440*/!important;
    border-radius: clamp(31px, 2.60vw, 42px) /*37.5px @ 1440*/!important;
    padding: 0px clamp(25px, 2.15vw, 34px) /*31px @ 1440*/!important;
    font-family: var(--e-global-typography-6e041ab-font-family), Sans-serif!important;
    font-size: var(--e-global-typography-6e041ab-font-size)!important;
    font-weight: var(--e-global-typography-6e041ab-font-weight)!important;
    line-height: var(--e-global-typography-6e041ab-line-height)!important;
    letter-spacing: var(--e-global-typography-6e041ab-letter-spacing)!important;
    text-transform: none!important;
}
/* Offscreen post title */
.offscreen {
	position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
    z-index:-1;
}
/*********/
/*************************************************************************************************************************************/
/*********/
/* All single sub pages */
body.custom-post-verderweg footer .footer-logo,
body.custom-post-verderweg footer #adres *,
body.custom-post-verderweg footer #voorwaarden-route a:not(:hover) {
    fill: var(--darkblue)!important;
    color: var(--darkblue)!important;
}
body.custom-post-verderweg #content-blocks h1,
body.custom-post-verderweg #content-blocks h2,
body.custom-post-verderweg #content-blocks h3,
body.custom-post-verderweg #content-blocks h4,
body.custom-post-verderweg #content-blocks h5,
body.custom-post-verderweg #content-blocks h6,
body.custom-post-verderweg #content-blocks p,
body.custom-post-verderweg #content-blocks .content-text,
body.custom-post-verderweg #content-blocks label {
    color: #000!important;
}
/* Natuurcamping */
body.single-natuurcamping {
    background-color: var(--natuurcamping);
}
/* Brasserie */
body.single-brasserie {
    background-color: var(--brasserie);
}
/* tiny-houses */
body.single-tiny-houses {
    background-color: var(--tiny-houses);
}
/* Activiteiten */
body.single-activiteiten {
    background-color: var(--activiteiten);
}