/*
dtp
*/
    @media screen and (max-width: 4000px){

        :root{
            
            --page-toppadding:                          83px;

            --padding-xs: 								4px; 
            --padding-s: 								9px;
            --padding-m: 								12px;
            --padding-l: 								20px;
            --padding-xl: 								24px;
            --padding-xxl: 								52px;
            --padding-xxxl: 							72px;
            --padding-menu: 							1.7vw;

            --padding-top-contentblock-none:            0px;
            --padding-top-contentblock-small:           39px;
            --padding-top-contentblock-medium:          78px;
            --padding-top-contentblock-large:           176px;
    
            --font-xs: 									11px;
            --lineheight-xs:                            16px;
            
            --font-s: 									12px;
            --lineheight-s:                             16px;
            
            --font-n: 									14px;
            --lineheight-n:                             20px;
            
            --font-m: 									15px;
            --lineheight-m:                             24px;

            --font-l: 									16px;
            --lineheight-l: 							24px;
            
            --font-xl: 									19px;
            --lineheight-xl: 							32px;

            --font-xxl: 								25px;
            --lineheight-xxl: 							34px;
            
            --font-xxxl: 								29px;
            --lineheight-xxxl: 							34px;
            
            --font-xxxxl: 								38px;
            --lineheight-xxxxl: 						44px;
            
            --font-hero: 								46px; 
            --lineheight-hero: 						    50px;

            --font-contentblock-rubik:                  18px;
            --lineheight-contentblock-rubik:            30px;
            
            --font-contentblock-karla:                  17px;
            --lineheight-contentblock-karla:            26px;

            --font-reis:                                17px; 
            --lineheight-reis:                          25px;
    
            --hero-height: 						        88vh;
            --hero-home-height: 				        86vh;
            --hero-narrow-height: 				        43vh;
            --hero-half-height: 				        43vh;

            --map-height: 						        95vh;
            --menu-height:                              112px;
            --filter-width:                             270px;
            --summary-menu-height:                      70px;
            
        }

        body{
            padding-top:                                var(--menu-height); 
            transition:                                 padding-top 520ms;     
        }

        .menu-height{
            height:                                     var(--menu-height); }
        
        .summary-menu-height{
            height:                                     var(--summary-menu-height); }

        .hmbrgr{
            position:                                   absolute; 
            display:                                    none;
            z-index:                                    999999;
            top:                                        15px;
            right:                                      32px; }
        .hmbrgr-icon{
            font-size:                                  23px;
        }

        .nav-menu-container{
            display:                                    block; 
            position:                                   fixed;
            z-index:                                    99999;
            left:                                       0px;
            top:                                        0px;
            transition:                                 top 520ms;
            width:                                      100%;
            border-bottom:                              1px solid #e8e8e8;
            -webkit-box-shadow:                         0px 10px 34px 0px rgba(0,0,0,0.08);
            -moz-box-shadow:                            0px 10px 34px 0px rgba(0,0,0,0.08);
            box-shadow:                                 0px 10px 34px 0px rgba(0,0,0,0.08);
            background-color:                           #FFF;
        }

        .mobile-menu-hidden, 
        .mobile-menu-visible{
            position:                                   fixed;
            left:                                       0;
            top:                                        -110vh;
            z-index:                                    99998;
            background-color:                           #FFF;
            color:                                      var(--base-color);
            transition:                                 top 820ms; }

        .mobile-menu-visible{
            top:                                        var(--menu-height); }

        .dtp-menu, 
        .mobile-header,
        .dtp-menu-hidden, 
        .mobile-header-hidden{ 
            width:                                      100%;
            height:                                     var(--menu-height);
        }
        
        .dtp-menu-hidden, 
        .mobile-header-hidden{ 
            height: 0px;
            overflow: hidden;
        }

        .search-bar,
        .search-bar-hidden{
            opacity:                                    1;
            background-color:                           var(--orange);
            color:                                      var(--white);
            border-top:                                 0px solid #FFF;
            height:                                     28px;
            margin-bottom:                              34px;
            transition:                                 all 60ms;
            backface-visibility:                        hidden;
        }
        .search-bar-hidden{
            opacity:                                    0;
            height:                                     0px;
            padding:                                    0px;
            margin-bottom:                              0px;
            transition:                                 all 60ms;
        }
        .search-bar-hidden div:nth-child(1){
            opacity:                                    0;
            transition:                                 all 120ms;
            backface-visibility:                        hidden;
        }
        .search-bar div:nth-child(1){
            opacity:                                    1;
            transition:                                 all 120ms; 
            transition-property:                        opacity;
            transition-delay:                           120ms;
        }

        .search-box{
            width:                                      52%;
            min-width:                                  526px;
            margin-top:                                 14px;
        }

        .quicklinks{
            font-size: var(--font-n);
            font-weight: var(--font-medium);
        }

        .quicklinks .quicklink{
            background-color: var(--orange);
            border-bottom: 1px solid var(--light-salmon);
            padding: 11px 14px;
            transition: 320ms all ease;
        }
        .quicklinks .quicklink:first-child{
            -webkit-border-top-left-radius: 7px;
            -webkit-border-top-right-radius: 7px;
            -moz-border-radius-topleft: 7px;
            -moz-border-radius-topright: 7px;
            border-top-left-radius: 7px;
            border-top-right-radius: 7px;
        }
        .quicklinks .quicklink:last-child{
            -webkit-border-bottom-right-radius: 7px;
            -webkit-border-bottom-left-radius: 7px;
            -moz-border-radius-bottomright: 7px;
            -moz-border-radius-bottomleft: 7px;
            border-bottom-right-radius: 7px;
            border-bottom-left-radius: 7px;
            border-bottom: none;
        }

        .quicklinks .quicklink a{
            color: var(--real-white);
            text-decoration: none;
        }
        .quicklinks .quicklink:hover{
            background-color: var(--salmon);
            transition: 320ms all ease;
        }

        .filterpanel-filtergroup{
            background-color: var(--light-grey);
            padding: 11px 12px 21px 14px;
            border-radius: 8px;
            border: 1px solid #F4F4F4;
        }

        .filterpanel-title{
            font-size: var(--font-xl);
            font-weight: var(--font-medium);
            color: var(--dark-blue);
            background-color: var(--white);
            display: inline-block;
        }

        .mobile-header{ 
            display:                                    none; 
        }
        
        .hide-on-dtp, 
        .hide-on-tbl, 
        .hide-on-smp{                               
            display:                                    inline-block;  }
        
        .hide-on-dtp{                               
            display:                                    none;  }      
            
        .centered,
        .centered-narrow,
        .centered-narrower,
        .centered-narrowest,                           
        .centered-narrower-to-wide {                    margin: 0 auto; }

        .centered {                                     width: 95vw;  }
        .centered-narrow {                              width: 82vw;  } 
        .centered-narrower,
        .centered-narrower-to-wide {                    width: 61vw;  }
        .centered-narrowest {                           width: 54vw; max-width: 810px;  }
        .centered-search {                              
            width:                                      50vw;  
            max-width:                                  620px; 
            padding-top:                                0vh;
            transition:                                 width 420ms ease-in-out;
        }

        .text-left-to-center{                           text-align: left;  }

        .grid-2-columns,
        .grid-2-columns-dense,
        .grid-2-columns-overview,
        .grid-2-columns-content, 
        .grid-2-columns-40-60{
            display:                                    grid;
            grid-template-columns:                      repeat(2, 1fr); }

        .grid-2-columns{
            column-gap:                                 10vw;
            row-gap:                                    14vh; }
        
        .grid-2-columns{
            column-gap:                                 10vw;
            row-gap:                                    14vh; }

        .grid-2-columns-dense{
            column-gap:                                 0px;
            row-gap:                                    0px; }

        .grid-2-columns-overview{
            column-gap:                                 16px;
            row-gap:                                    16px; }

        .grid-2-columns-content{
            column-gap:                                 24px;
            row-gap:                                    24px; }
        
        .grid-2-columns-40-60{
            grid-template-columns:                      30% 70%;
            column-gap:                                 24px;
            row-gap:                                    24px; }

        .grid-3-columns,
        .grid-3-columns-overview,
        .grid-3-columns-highlight{
            display:                                    grid;
            grid-template-columns:                      repeat(4, 1fr); }

        .grid-3-columns{
            column-gap:                                 7vw;
            row-gap:                                    3vh; }

        .grid-3-columns-overview{
            column-gap:                                 24px;
            row-gap:                                    24px; }
        
        .grid-3-columns-highlight{
            column-gap:                                 24px;
            row-gap:                                    24px; }
        
        .grid-3-columns-highlight > div:first-child{
            grid-column:                                1 / 3; }

        .grid-4-columns,
        .grid-4-columns-dense{
            display:                                    grid;
            grid-template-columns:                      repeat(4, 1fr); }

        .grid-4-columns{
            column-gap:                                 7vw;
            row-gap:                                    3vh; }

        .grid-5-columns,
        .grid-5-columns-overview{
            display:                                    grid;
            grid-template-columns:                      repeat(5, 1fr); }

        .grid-5-columns{
            column-gap:                                 7vw;
            row-gap:                                    3vh; }

        .grid-5-columns-overview{
            column-gap:                                 32px;
            row-gap:                                    32px; }

        .grid-mosaic-1 { 
            grid-area:                                  l-img; 
            -webkit-border-top-left-radius:             8px; 
            -webkit-border-bottom-left-radius:          8px;
            -moz-border-radius-topleft:                 8px; 
            -moz-border-radius-bottomleft:              8px; 
            border-top-left-radius:                     8px; 
            border-bottom-left-radius:                  8px; }

        .grid-mosaic-2 { 
            grid-area:                                  s-img1; 
            -webkit-border-top-left-radius:             0px; 
            -webkit-border-top-right-radius:            0px; 
            -moz-border-radius-topleft:                 0px; 
            -moz-border-radius-topright:                0px;  
            border-top-left-radius:                     0px; 
            border-top-right-radius:                    0px; }

        .grid-mosaic-3 { 
            grid-area: s-img2; 
            -webkit-border-top-right-radius:            8px; 
            -moz-border-radius-topright:                8px; 
            border-top-right-radius:                    8px; }

        .grid-mosaic-4 { 
            grid-area:                                  s-img3; 
            -webkit-border-top-left-radius:             0px; 
            -webkit-border-top-right-radius:            0px; 
            -moz-border-radius-topleft:                 0px;
            -moz-border-radius-topright:                0px;  
            border-top-left-radius:                     0px; 
            border-top-right-radius:                    0px; }
        
        .grid-mosaic-5 { 
            grid-area:                                  s-img4; 
            -webkit-border-bottom-right-radius:         8px; 
            -moz-border-radius-bottomright:             8px; 
            border-bottom-right-radius:                 8px; }
    
        .grid-mosaic {
            display:                                    grid;
            gap:                                        3px;
            height:                                     65vh;
            max-height:                                 480px;
            grid-template-areas:                        'l-img s-img1 s-img2'
                                                        'l-img s-img3 s-img4';  }
        .grid-infosessie-tiles{
            display:                                    grid;
            grid-template-columns:                      repeat(4, 1fr); 
        }      
        .infosessie-teaser-1,
        .infosessie-teaser-2,
        .infosessie-teaser-3,
        .infosessie-teaser-4{
            display:                                    block;
        }  

        .ga-url {                                       grid-area: url; font-size: 16px; font-weight: var(--font-medium); padding-right: var(--padding-xs); }
        .ga-date {                                      grid-area: date; font-size: 15px; font-family: var(--font-karla); font-weight: var(--font-medium); color: var(--color-dark-grey); }
        .ga-days {                                      grid-area: days; font-size: var(--font-m); font-family: var(--font-karla); font-weight: var(--font-medium); color: var(--color-dark-grey); text-align: right; }
        .ga-price {                                     grid-area: price; font-size: var(--font-m); font-family: var(--font-karla); font-weight: var(--font-medium); color: var(--color-dark-grey); text-align: right; font-variant-numeric: tabular-nums; }
        .ga-status {                                    grid-area: status; font-size: 15px; font-family: var(--font-karla); font-weight: var(--font-bold); color: var(--turquoise); padding-left: var(--padding-s); text-align: right; }
        .ga{ 
            display:                                    grid; 
            gap:                                        0px;
            padding:                                    7px 16px 7px 30px;
            row-gap:                                    0px;
            grid-template-areas:                        'date url days price status';
            grid-template-columns:                      82px 4fr 82px 76px 2fr;
            border-bottom:                              1px solid var(--soft-grey);
            overflow:                                   auto;
            background-color:                            #f8f8f8;
        }
        .ga:nth-child(even){
            background-color:                            #fff;
        }   

        .ga-cta-button1{                                grid-area: cta-button1; text-align: right; height: 62px; padding-top: 24px; }
        .ga-cta-button2{                                grid-area: cta-button2; text-align: left;  height: 62px; padding-top: 24px; }
        .ga-cta-buttons{
            display:                                    grid;
            column-gap:                                 24px;
            row-gap:                                    0px;
            grid-template-areas:                        'cta-button1 cta-button2';
            grid-template-columns:                      1fr 1fr;
            overflow:                                   auto;
        }

        .ga-hero-reisformule{                           grid-area: hero-reisformule; text-align:left; }
        .ga-hero-dagen{                                 grid-area: hero-dagen; text-align:right; }
        .ga-hero-vertrekdata{                           grid-area: hero-vertrekdata; text-align:left; }
        .ga-hero-prijsquote{                            grid-area: hero-prijsquote; text-align:right; }
        .ga-hero-summary{
            display:                                    grid;
            grid-template-areas:                        'hero-reisformule hero-dagen' 'hero-vertrekdata hero-prijsquote';
            grid-template-columns:                      4fr 2fr;
            row-gap:                                    4px;
        }

        .ga-input-timeslot{                             grid-area: input-timeslot; }
        .ga-input-sessie-select{                        grid-area: input-sessie-select; }
        .ga-input-infosessie-programma{
            display:                                    grid;
            grid-template-areas:                        'input-timeslot input-sessie-select';
            grid-template-columns:                      182px 1fr;
            row-gap:                                    0px;
        }


        .ga-reisoverzicht-tc-titel{                     grid-area: reisoverzicht-titel; padding-right:var(--padding-xl); }
        .ga-reisoverzicht-tc-count{                     grid-area: reisoverzicht-count; }
        .ga-reisoverzicht-tc{ 
            display:                                    inline-grid;
            grid-template-areas:                        'reisoverzicht-titel reisoverzicht-count';
            grid-template-columns:                      1fr 1fr;
            padding-bottom:                             var(--padding-l);
        }


        .ga-summary-logo{                                grid-area: sum-logo; }
        .ga-summary-location{                            grid-area: sum-location; }
        .ga-summary-name{                                grid-area: sum-name; overflow: hidden; max-height: 28px; }
        .ga-summary-location-name{                       grid-area: sum-location-name; overflow: hidden; max-height: 28px; } 
        .ga-summary-program{                             grid-area: sum-program; }
        .ga-summary-price{                               grid-area: sum-price; text-align: right; }
        .ga-summary-dates{                               grid-area: sum-dates; text-align: right; } 
        .ga-summary-infosessies{                         grid-area: sum-infosessies; text-align: right; } 
        .ga-summary{ 
            display:                                    grid;
            grid-template-areas:                        'sum-logo sum-location-name sum-price sum-program sum-dates';
            grid-template-columns:                      100px 1fr 200px 150px 110px;
        }
        .ga-summary-met-infosessies{ 
            display:                                    grid;
            grid-template-areas:                        'sum-logo sum-location-name sum-price sum-program sum-dates sum-infosessies';
            grid-template-columns:                      100px 1fr 200px 150px 110px 98px;
        }
        .ga-summary-location{                           display: none; }
        .ga-summary-name{                               display: none; }


        .ga-input-reizigers{                            grid-area: input-reizigers; }
        .ga-input-aantal-reizigers{                     grid-area: input-aantal-reizigers; }
        .ga-input-vertrekdatum-titel{                   grid-area: input-vertrekdatum-titel; }
        .ga-input-vertrekdatum-selector{                grid-area: input-vertrekdatum-selector; }
        .ga-input-firstname{                            grid-area: input-firstname; }
        .ga-input-lastname{                             grid-area: input-lastname; }
        .ga-input-birthdate{                            grid-area: input-birthdate; }
        .ga-input-street{                               grid-area: input-street; }
        .ga-input-housenumber{                          grid-area: input-housenumber; }
        .ga-input-bus{                                  grid-area: input-bus; }
        .ga-input-postalcode{                           grid-area: input-postalcode; }
        .ga-input-city{                                 grid-area: input-city; }
        .ga-input-country{                              grid-area: input-country; }
        .ga-input-tel{                                  grid-area: input-tel; }
        .ga-input-email{                                grid-area: input-email; }
        .ga-input-business{                             grid-area: input-business; }
        .ga-input-contactperson{                        grid-area: input-contactperson; }
        .ga-selector{                                   grid-area: input-selector; }
        .ga-space{                                      grid-area: input-space; }
        .ga-selector-output{                            grid-area: input-selector-output; }

        .ga-input-reizigers{ 
            display:                                    grid;
            grid-template-areas:                        'input-reizigers input-aantal-reizigers';
            grid-template-columns:                      1fr 1fr;
            column-gap:                                 0px;
            row-gap:                                    var(--padding-s);
        }
        .ga-input-vertrekdatum{ 
            display:                                    grid;
            grid-template-areas:                        'input-vertrekdatum-titel input-vertrekdatum-selector';
            grid-template-columns:                      1fr 1fr;
            column-gap:                                 0px;
            row-gap:                                    var(--padding-s);
        }
        .ga-input-travelagency{ 
            display:                                    grid;
            grid-template-areas:                        'input-business input-contactperson';
            grid-template-columns:                      1fr 1fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }
        .ga-input-personal{ 
            display:                                    grid;
            grid-template-areas:                        'input-firstname input-lastname input-birthdate';
            grid-template-columns:                      2fr 2fr 1fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }
        .ga-input-personal-brief{ 
            display:                                    grid;
            grid-template-areas:                        'input-firstname input-lastname input-postalcode';
            grid-template-columns:                      2fr 2fr 1fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }
        .ga-input-personal-names{ 
            display:                                    grid; 
            grid-template-areas:                        'input-firstname input-lastname';
            grid-template-columns:                      1fr 1fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }
        .ga-input-selector{ 
            display:                                    grid;
            grid-template-areas:                        'input-selector input-space input-selector-output';
            grid-template-columns:                      1fr 10px 1fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }
        .ga-input-address1{ 
            display:                                    grid;
            grid-template-areas:                        'input-street input-housenumber input-bus';
            grid-template-columns:                      3fr 1fr 1fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }
        .ga-input-address2{ 
            display:                                    grid;
            grid-template-areas:                        'input-postalcode input-city input-country';
            grid-template-columns:                      1fr 2fr 1fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }
        .ga-input-communication{ 
            display:                                    grid;
            grid-template-areas:                        'input-email input-tel';
            grid-template-columns:                      3fr 2fr;
            column-gap:                                 var(--padding-s);
            row-gap:                                    var(--padding-s);
        }


        .width-80-to-100pct{
            width:                                     80%;  }
        
        .page-topmargin{                                
            margin-top:                                 var(--page-topmargin); }

        .hero,
        .hero-half,
        .hero-quarter{
            width:                                      100%;
        }

        .hero{                                          height: calc(89vh - var(--menu-height)); }
        .hero-half{                                     height: calc(50vh); }
        .hero-quarter{                                  height: calc(30vh); }

        .hero-with-alert{
            width:                                      100%;
            height:                                     calc(94vh - var(--menu-height) - 48px);
        }

        .hero-home{
            width:                                      100%;
            height:                                     calc(94vh - var(--menu-height));
        }
        
        .hero-home-with-alert{
            width:                                      100%;
            height:                                     calc(94vh - var(--menu-height) - 48px);
        }
        
        .hero-narrow{
            width:                                      100%;
            height:                                     calc(100vh - var(--menu-height) - var(--padding-l));
        }

        .hero-land-tag{
            margin-right:                               55px; 
            position:                                   absolute;
            right:										0; 
            bottom:										0; 
            transform-origin:							bottom right; 
            transform: 									rotate(90deg) translateX(100%); 
            -moz-transform:								rotate(90deg); 
            -webkit-transform:							rotate(90deg); 
            -o-transform:								rotate(90deg); 
            -ms-transform:								rotate(90deg);
            background:                                 rgb(0, 0, 0,0);
            background:                                 -moz-linear-gradient(90deg, rgba(0, 0, 0, 0), rgba(0,0,0,0.5));
            background:                                 -webkit-linear-gradient(90deg, rgb(0, 0, 0, 0), rgba(0,0,0,0.5));
            background:                                 linear-gradient(90deg, rgb(0, 0, 0, 0), rgba(0,0,0,0.5));
            filter:                                     progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#000000",GradientType=1);
            padding:                                    16px 24px;
        }

        .hero-tags{
            margin-top:                                 24px;
            margin-right:                               24px;
        }
        
        .opaque-dark{
            background-color:                           #000;
            opacity:                                    0.64;
        }

        .summary-menu, 
        .summary-menu-hidden{
            position:                                   fixed;
            z-index:                                    999999;
            left:                                       0px;
            top:                                        0px;
            transition:                                 top 820ms;
            width:                                      100%; 
            height:                                     var(--summary-menu-height);
            background-color:                           var(--base-color);
            }
        .summary-menu-hidden{                           top: calc(-1* var(--summary-menu-height)); }
        
        .lightbox {
            position:                                   fixed;
            z-index:                                    999998;
            left:                                       0px;
            top:                                        0px;
            width:                                      100vw; 
            height:                                     100vh;  }
            
        .lightbox-container {
            position:                                   fixed; 
            z-index:                                    999997;
            left:                                       0px;
            top:                                        calc( var(--summary-menu-height) );
            height:                                     calc(100vh - var(--summary-menu-height));  
            width:                                      100vw; }
        
        .lightbox-nav-close {
            position:                                   fixed; 
            z-index:                                    999996;
            right:                                      3vw;
            top:                                        60px;
            height:                                     70px;
            width:                                      60px;  }
        
        .lightbox-nav-left {
            position:                                   fixed; 
            z-index:                                    999996;
            left:                                       3vw;
            top:                                        var(--summary-menu-height);
            width:                                      60px; 
            height:                                     calc(100vh - var(--summary-menu-height));  }
        
        .lightbox-nav-right {
            position:                                   fixed; 
            z-index:                                    999996;
            right:                                      3vw;
            top:                                        var(--summary-menu-height);
            width:                                      60px; 
            height:                                     calc(100vh - var(--summary-menu-height));  }

        .lightbox-nav-close-button{
            width:                                      32px;
            height:                                     32px;
            border-radius:                              50%;
            border:                                     2px solid var(--white);
            background-color:                           var(--base-color);
            color:                                      var(--white);
            font-size:                                  var(--font-l);
            text-align:                                 center; }

        .lightbox-nav-left-button, .lightbox-nav-right-button{
            width:                                      60px;
            height:                                     60px;
            border-radius:                              50%;
            color:                                      var(--white);
            font-size:                                  var(--font-xxxl);
            text-align:                                 center;
        }
        
        
        .lightbox-image-container,
        #lightbox-image-container {
            width:                                      70vw;  
            height:                                     80vh; }
        
        .lightbox-image-container img {
            object-fit:                                 contain;
            height:                                     66vh; 
            width:                                      auto; }

        .lightbox-opaque {
            position:                                   absolute;
            z-index:                                    999994;
            left:                                       0px;
            top:                                        0px;
            background-color:                           var(--base-color);
            opacity:                                    1;
            width:                                      100vw; 
            height:                                     100vh;  }

        .mapbox-container{ 
            width:									    100vw; 
            height: 								    calc( 100vh - var(--summary-menu-height)); 
            position:                                   relative; }
            
        .mapbox-overlay{ 
            z-index:                                    100;
            position:                                   absolute;
            top:                                        0px;
            right:                                      0px;
            width:									    100vw; 
            height: 								    calc( 100vh - var(--summary-menu-height)); 
        }
        
        .mapbox-programma{
            width:                                      100vw;
            overscroll-behavior:                        auto;
            overflow-x:                                 hidden;
        }
        
        .mapbox-programma-scroller{
            width:                                      100%;
            max-width:                                  604px;
        }
        
        .mapbox{ 
            z-index:                                    99;
            position:                                   absolute;
            top:                                        0px;
            left:                                       0px;
            width:									    100%; 
            height: 								    var(--map-height); 
            border:									    none !important;
            outline: 								    none !important;
            outline: 								    0px solid transparent;  }
            
        .desktop-only{                                  display: inline-block;  }      
        .desktop-tablet-only{                           display: inline-block;  }      
        .tablet-only{                                   display: none;  }      
        .mobile-only{                                   display: none;  }    
        
        .prijsscenario-header-desktop-tablet-only{      display: block; }
        .prijsscenario-header-mobile-only{              display: none; }

        .width-fractional-to-full{                      width: 45%; }

        .album-scroll-h{ 
            width:										100%; 
            height: 									47vh; 
            overflow: 									hidden;  }
            
        .album-scroll-container{ 
            display:                                    block;
            width:										100%; 
            height: 									calc(47vh + 40px); /* 40px to hide the scrollbar*/ 
            overflow-y: 								hidden; 
            overflow-x: 								scroll; 
            scroll-behavior:                            smooth;
            -webkit-overflow-scrolling:					touch;
            transition-duration:                        2000ms;
            white-space: 								nowrap;  }

        .album-image-container{
            height:                                     47vh;  }

        .album-image{
            object-fit:                                 cover;
            height:                                     47vh;
            width:                                      auto; }
        
        .album-nav-left-container{
            position:                                   absolute;
            top:                                        0px;
            left:                                       0px;
            width:                                      62px;
            height:                                     47vh;
        }
        .album-nav-left{
            width:                                      48px;
            height:                                     48px;
            border-radius:                              50%;
            background-color:                           var(--white);
            color:                                      var(--base-color);
            font-size:                                  var(--font-xl);
            display: 									flex; 
            justify-content: 							center; 
            align-items: 								center;
            -webkit-box-shadow:                         0px 0px 18px -6px rgba(0,0,0,0.73); 
            box-shadow:                                 0px 0px 18px -6px rgba(0,0,0,0.73);
        }
        .album-nav-left:hover{
            -webkit-box-shadow:                         0px 0px 18px -6px rgba(0,0,0,0.89); 
            box-shadow:                                 0px 0px 18px -6px rgba(0,0,0,0.89);  }
        
        .album-nav-right-container{
            position:                                   absolute;
            top:                                        0px;
            right:                                      0px;
            width:                                      62px;
            height:                                     47vh;
        }
        .album-nav-right{
            width:                                      48px;
            height:                                     48px;
            border-radius:                              50%;
            background-color:                           var(--white);
            color:                                      var(--base-color);
            font-size:                                  var(--font-xl);
            display: 									flex; 
            justify-content: 							center; 
            align-items: 								center;
            -webkit-box-shadow:                         0px 0px 18px -6px rgba(0,0,0,0.73); 
            box-shadow:                                 0px 0px 18px -6px rgba(0,0,0,0.73);
        }
        .album-nav-right:hover{
            -webkit-box-shadow:                         0px 0px 18px -6px rgba(0,0,0,0.89); 
            box-shadow:                                 0px 0px 18px -6px rgba(0,0,0,0.89);  }
        
        .left-white-gradient{
            width:                                      20vw;
            position:                                   absolute;
            top:                                        0px;
            left:                                       0px;
            background:                                 rgb(255,255,255);
            background:                                 linear-gradient(90deg, rgba(255,255,255,0.9990371148459384) 0%, rgba(255,255,255,0) 30%);  }
        
        .right-white-gradient{
            width:                                      5vw;
            position:                                   absolute;
            top:                                        0px;
            right:                                      0px;
            background:                                 rgb(255,255,255);
            background:                                 linear-gradient(-90deg, rgba(255,255,255,0.9990371148459384) 0%, rgba(255,255,255,0) 30%);  }
        
        .input-search-container,
        .input-search-container-shaking{
            -webkit-border-radius:                      11px;
            -moz-border-radius:                         11px;
            border-radius:                              11px;
            background-color:                           #FFF;
            -webkit-box-shadow:                         0px 0px 22px 0px rgba(0,0,0,0.22); 
            box-shadow:                                 0px 0px 22px 0px rgba(0,0,0,0.22);
            padding:                                    var(--padding-l);  
            padding-right:                              var(--padding-l); 
            padding-left:                               var(--padding-m);  }

        .input-search-container-shaking{
            animation-name:                             horizontal-shake;
            animation-iteration-count:                  1;
            animation-duration:                         300ms;
        }
        
        .search-results-pane{
            display:                                    block;
            position:                                   absolute;
            top:                                        50px;
            right:                                       0px;
            background-color:                           #FFF;
            -webkit-border-radius:                      11px;
            -moz-border-radius:                         11px;
            border-radius:                              11px;
            -webkit-box-shadow:                         0px 0px 22px 0px rgba(0,0,0,0.15); 
            box-shadow:                                 0px 0px 22px 0px rgba(0,0,0,0.15);
            padding-top:                                var(--padding-m);
            padding-bottom:                             0px; }

        .input-search{
            font-family:                                var(--font-rubik);
            font-weight:                                var(--font-semibold); 
            border:                                     0px;
            color:                                      var(--orange2);
            font-size:                                  28px;
            letter-spacing:                             -0.017em; 
            text-align:                                 left;
            width:                                      100%;
            padding-left:                               var(--padding-m);
            outline:                                    none;  }
        
        .input-search::placeholder{
            font-weight:                                var(--font-medium); 
            color:                                      var(--orange2); 
            opacity:                                    0.80; 
        }

        .border-rounded-top-s{                    
            -webkit-border-top-left-radius:             4px;
            -webkit-border-top-right-radius:            4px;
            -moz-border-radius-topleft:                 4px;
            -moz-border-radius-topright:                4px;
            border-top-left-radius:                     4px;
            border-top-right-radius:                    4px; }

        .border-rounded-s{                    
            border-radius:                              4px;  }

        .teaser-image{
            width:                                      100%;
            aspect-ratio:                               4/3;
        }

        .grid-teasers{
            display:                                    grid;
            row-gap:                                    var(--padding-xl);
            grid-template-columns:                      repeat(5, 1fr);    
            column-gap:                                 18px;      
        } 
        .grid-teasers .grid-group{
            display: contents;
        }
        .teaser-in-de-kijker-1,
        .teaser-in-de-kijker-2,
        .teaser-in-de-kijker-3,
        .teaser-in-de-kijker-4,
        .teaser-in-de-kijker-5{
            display:                                    block;
        }
        
        .teaser-items-width-5{ width: 100%; }
        .teaser-items-width-4{ width: 80%; min-width: 1560px; }
        .teaser-items-width-3{ width: 60%; min-width: 1170px; }
        .teaser-items-width-2{ width: 40%; min-width: 780px; }
        .teaser-items-width-1{ width: 20%; min-width: 390px; }
        .teaser-items-width-5 .grid-teasers,
        .teaser-items-width-4 .grid-teasers,
        .teaser-items-width-3 .grid-teasers,
        .teaser-items-width-2 .grid-teasers,
        .teaser-items-width-1 .grid-teasers{
            display:                                    grid;
            row-gap:                                    var(--padding-xl);
            column-gap:                                 18px;        
        }
        .teaser-items-width-5 .grid-teasers{                  grid-template-columns: repeat(5, 1fr);  }
        .teaser-items-width-4 .grid-teasers{                  grid-template-columns: repeat(4, 1fr);  }
        .teaser-items-width-3 .grid-teasers{                  grid-template-columns: repeat(3, 1fr);  }
        .teaser-items-width-2 .grid-teasers{                  grid-template-columns: repeat(2, 1fr);  }
        .teaser-items-width-1 .grid-teasers{                  grid-template-columns: repeat(1, 1fr);  }


        .filter-container{
            position: sticky; 
            top: var(--menu-height);
            flex-shrink: 0;
            height: 100vh;
            width: var(--filter-width);
            border-right: 1px solid var(--soft-grey);
            background-color: var(--real-white);
            overflow-y: scroll;
            scrollbar-width: none;
            -webkit-box-shadow: 10px 0px 18px 0px rgba(0,0,0,0.04);
            -moz-box-shadow: 10px 0px 18px 0px rgba(0,0,0,0.04);
            box-shadow: 10px 0px 18px 0px rgba(0,0,0,0.04);
        }

        .filter-container-padding-left{
            padding-left: var(--filter-width);
        }
        
        .filter-min-height{
            min-height: calc(100vh - var(--menu-height));
        }

        .filter-container::-webkit-scrollbar{
            display: none;
            width: 5px;
        }

        .filter-container::-webkit-scrollbar-thumb{
            background:#D9D9D9;
            border-radius: 2px;
        }

        .filter-container::-webkit-scrollbar-track{
            background: #f1f1f1;
        }

        .filter-toggle{
            display:                                    none; }
        
        .filter-panel{
            width:                                      100vw;
            height:                                     100vh;
            overflow-y:                                 auto;
            -webkit-box-shadow: 						0px 0px 40px 0px rgba(0,0,0,0.12); 
            -moz-box-shadow: 							0px 0px 40px 0px rgba(0,0,0,0.12); 
            box-shadow: 								0px 0px 40px 0px rgba(0,0,0,0.12); 
        }
        .filter-panel-hidden, 
        .filter-panel-visible{
            position:                                   fixed;
            top:                                        0;
            left:                                       -120vw;
            width:                                      90vw;
            z-index:                                    99999;
            background-color:                           #FFF;
            transition:                                 left 720ms; }

        .filter-panel-visible{
            left:                                       0vh;
            transition:                                 left 720ms; }
        
        .filter-apply-hidden, 
        .filter-apply-visible{
            position:                                   fixed;
            left:                                       0px;
            z-index:                                    999;
            bottom:                                     -50vh;
            transition:                                 bottom 620ms; }

        .filter-apply-visible{
            bottom:                                     0px;
            transition:                                 bottom 620ms; }

        a.subscribe-button-rounded:link,
        a.subscribe-button-rounded:active,
        a.subscribe-button-rounded:visited,
        a.subscribe-button-rounded:hover{ 
            background-color: 							var(--orange2);
            font-family: 								var(--font-karla); 
            font-size: 									21px; 
            font-weight: 								var(--font-semibold); 
            letter-spacing: 							-0.022em;
            color: 										var(--white);
            text-decoration: 							none; 
            padding:	 								20px 34px; 
            -webkit-border-radius: 						20px; 
            -moz-border-radius: 						20px;  
            border-radius: 								20px; 
            transition: 								all 440ms; 
        }
            
        a.subscribe-button-rounded:hover{ 
            background-color: 							var(--orange2);
            color: 									    var(--white); 
            padding:	 								20px 44px; 
            text-decoration: 							none; 
            transition: 								all 440ms;  
        }

        .subscribe-button-rounded-disabled{ 
            display:                                    inline-block;
            background-color: 							var(--disabled-grey);
            font-family: 								var(--font-karla); 
            font-size: 									21px; 
            font-weight: 								var(--font-semibold); 
            letter-spacing: 							-0.022em;
            color: 										var(--white);
            text-decoration: 							none; 
            padding:	 								20px 34px; 
            -webkit-border-radius: 						20px; 
            -moz-border-radius: 						20px;  
            border-radius: 								20px; 
        }


        .alerts-visible,
        .alerts-hidden{
            max-height: auto;
            transition: max-height 1ms ease-in;
        }
        .alerts-hidden{
            max-height: 0;
            overflow:hidden;
            transition: max-height 1ms ease-in;
        }
          
        .alert-msg .text-wrapper {
            position: relative;
            display: inline-block;
            padding-top: 0.1em;
            padding-right: 0.05em;
            padding-bottom: 0.15em;
        }
        
        .alert-msg .line {
            opacity: 0;
            position: absolute;
            left: 0;
            height: 100%;
            width: 3px;
            background-color: #fff;
            transform-origin: 0 50%;
        }
        
        .alert-msg .line1 { 
            top: 0; 
            left: 0;
        }
        
        .alert-msg .letter {
            display: inline-block;
            line-height: 1em;
        }

        .alert-container{
            display: grid;
            grid-template-rows: 0fr;
            transition: grid-template-rows 1ms;
        }
        .alert-container div:first-child{
            display: block;
        }
        .alert-container.open{
            grid-template-rows: 1fr;
        }
        .alert-container.open div:first-child{
            display: block;
        }
        .alert-container div:first-child{
            overflow: hidden;
        }

        .reveal-y{
            position:                   relative;
            transform:                  translateY(74px);
            opacity:                    0.1;
            transition:                 960ms all ease;
        }
        .reveal-y.visible{
            transform:                  translateY(0);
            opacity:                    1;
        }
        
        .reveal-infosessie-agenda{
            position:                   relative;
            transform:                  translateY(-44px);
            opacity:                    0;
            transition:                 60ms all ease;
        }
        .reveal-infosessie-agenda.visible{
            transform:                  translateY(0);
            opacity:                    1;
        }

        .banner-progressbar{
            position: absolute;
            bottom: 6%;
            left: 14px;
            width: 0;
            height: 1px;
            background-color: #FFF;
            opacity: 0.5;
            transition: width 999ms linear;
        }

        a.CTA-button:link,
        a.CTA-button:active,
        a.CTA-button:visited,
        a.CTA-button:hover{
            background-color: 							var(--orange);
            font-family: 								var(--font-karla); 
            font-size: 									21px; 
            font-weight: 								var(--font-semibold); 
            letter-spacing: 							-0.022em;
            color: 										var(--white);
            text-decoration: 							none; 
            padding:	 								18px 34px; 
            -webkit-border-radius: 						20px; 
            -moz-border-radius: 						20px;  
            border-radius: 								20px; 
            transition: 								all 440ms; 
        }
        a.CTA-button:hover{ 
            background-color: 							var(--orange2);
            color: 									    var(--white); 
            padding:	 								18px 44px; 
            text-decoration: 							none; 
            transition: 								all 440ms;  
        }

        a.CTA-ghost-button:link,
        a.CTA-ghost-button:active,
        a.CTA-ghost-button:visited,
        a.CTA-ghost-button:hover,
        a.CTA-grey-ghost-button:link,
        a.CTA-grey-ghost-button:active,
        a.CTA-grey-ghost-button:visited,
        a.CTA-grey-ghost-button:hover{
            background-color: 							#FFF;
            font-family: 								var(--font-karla); 
            font-size: 									21px; 
            font-weight: 								var(--font-semibold); 
            letter-spacing: 							-0.022em;
            color: 										var(--orange2);
            text-decoration: 							none; 
            padding:	 								18px 34px; 
            -webkit-border-radius: 						20px; 
            -moz-border-radius: 						20px;  
            border-radius: 								20px; 
            border: 									1px solid var(--orange);
            transition: 								all 340ms; 
        } 
        a.CTA-ghost-button:hover,
        a.CTA-grey-ghost-button:hover{ 
            color: 									    var(--orange2); 
            border: 									1px solid var(--orange2);
            padding:	 								18px 44px; 
            text-decoration: 							none; 
            transition: 								all 340ms;  
        } 
        a.CTA-grey-ghost-button:link,
        a.CTA-grey-ghost-button:active,
        a.CTA-grey-ghost-button:visited,
        a.CTA-grey-ghost-button:hover{
            color: 										var(--medium-grey);
            border: 									1px solid var(--medium-grey);

        }

        a.CTA-link:link,
        a.CTA-link:active,
        a.CTA-link:visited,
        a.CTA-link:hover{
            font-family: 								var(--font-karla); 
            font-size: 									22px; 
            font-weight: 								var(--font-medium); 
            letter-spacing: 							-0.036em;
            color: 										var(--orange2);
            text-decoration: 							none; 
            padding-bottom:                             5px;
            border-bottom: 								3px solid var(--orange);
            transition: 								all 140ms; 
        }
        a.CTA-link:hover{ 
            color: 							            var(--orange);
            border-bottom: 								1px solid var(--orange);
            text-decoration: 							none; 
            transition: 								all 140ms;  
        }
        
        a.CTA-sublink:link,
        a.CTA-sublink:active, 
        a.CTA-sublink:visited,
        a.CTA-sublink:hover{
            font-family: 								var(--font-karla); 
            font-size: 									17px; 
            font-weight: 								var(--font-semibold); 
            letter-spacing: 							-0.032em;
            color: 										var(--orange);
            text-decoration: 							none;
            padding-bottom:                             3px;
            border-bottom:                              1px solid var(--salmon);
            transition: 								all 140ms; 
        }
        a.CTA-sublink:hover{ 
            text-decoration: 							none;
            border-bottom:                              2px solid var(--orange);
            transition: 								all 140ms;  
        }
        
        .accordion-title{
            font-size:                                  var(--font-xl);
            line-height:                                130%;
            color:                                      var(--orange); 
            font-weight:                                var(--font-semibold);
            padding:                                    var(--padding-m) var(--padding-s);
            border-bottom:                              1px solid var(--soft-grey);
        }
        .accordion-title:hover,
        .accordion-title.active{
            cursor:                                     pointer; 
            background-color:                           var(--soft-grey);
        }
        .accordion-panel{
            display:                                    none;
            font-size:                                  var(--font-m);
            line-height:                                140%;
            padding:                                    0 var(--padding-l) var(--padding-l) 0;
            color:                                      var(--dark-grey);
            background-color:                           var(--white);
        }
        .accordion-panel.active{ 
            display:                                    block;
            background-color:                           var(--soft-grey);
            padding:                                    var(--padding-s) var(--padding-xl) 24px 0;
        }
        .accordion-panel a:link,
        .accordion-panel a:visited,
        .accordion-panel a:hover,
        .accordion-panel a:active{
            color:                                      var(--dark-grey);
            text-decoration:                            none;
            border-bottom:                              1px solid var(--dim-grey);
        }

        .reisoverzicht-padding-left{
            padding-left: var(--padding-xl);
        }

    }


    @media screen and (max-width: 2030px){

        .grid-5-columns-overview{
            grid-template-columns:                      repeat(4, 1fr); }

        .grid-teasers{
            grid-template-columns:                      repeat(4, 1fr);                    
        } 
        .teaser-in-de-kijker-5{
            display:                                    none;
        }

        .margin-neg-l{ 									margin-left: calc(var(--padding-l)*-1); }
        .margin-neg-xl{ 								margin-left: calc(var(--padding-xl)*-1); }
        .margin-neg-xxl{ 								margin-left: calc(var(--padding-xxl)*-1); }
    

    }


    @media screen and (max-width: 2005px){

        .grid-5-columns-overview{
            grid-template-columns:                      repeat(3, 1fr); }
        
        .teaser-items-width-5{ width: 100%; }
        .teaser-items-width-5 .grid-teasers{                  grid-template-columns: repeat(4, 1fr);  }
    
    }

    
    @media screen and (max-width: 1780px){

        .teaser-items-width-4{ width: 100%; min-width: auto; }
    
    }


    @media screen and (max-width: 1690px){ 

        .centered-narrower-to-wide {                   width: 100vw; }

        .grid-teasers{
            grid-template-columns:                      repeat(3, 1fr);                    
        } 
        .teaser-in-de-kijker-4,
        .teaser-in-de-kijker-5{
            display:                                    none;
        }

        .teaser-items-width-4 .grid-teasers{                  grid-template-columns: repeat(3, 1fr);  }

    }


    @media screen and (max-width: 1400px){ 

        .centered-narrower-to-wide {                    width: 100vw; }
        .teaser-items-width-5 .grid-teasers{            grid-template-columns: repeat(3, 1fr);  } 

        .teaser-items-width-3{ width: 100%; min-width: auto; }
        .teaser-items-width-3 .grid-teasers{                  grid-template-columns: repeat(3, 1fr);  }
    
    }


    @media screen and (max-width: 1366px){

        :root{

            --page-toppadding:                          63px;

            --padding-xs: 								6px;
            --padding-s: 								9px;
            --padding-m: 								12px;
            --padding-l: 								18px;
            --padding-xl: 								24px;
            --padding-xxl: 								58px;
            --padding-xxxl: 							62px;
            --padding-menu: 							25px;

            --font-xs: 									11px;
            --lineheight-xs:                            16px;
            
            --font-s: 									12px;
            --lineheight-s:                             16px;
            
            --font-n: 									14px;
            --lineheight-n:                             20px;
            
            --font-m: 									16px;
            --lineheight-m:                             24px;

            --font-l: 									16px;
            --lineheight-l: 							24px;
            
            --font-xl: 									19px;
            --lineheight-xl: 							31px;
    
            --hero-height: 						        86vh;
            --hero-home-height: 				        86vh;
            --hero-narrow-height: 				        43vh;
            --hero-half-height: 				        43vh;

            --map-height: 						        95vh;
        }

        .desktop-only{                              display: none;  }
        .desktop-tablet-only{                       display: inline-block;  }
        .tablet-only{                               display: inline-block;  }
        .mobile-only{                               display: none;  }

    }


    @media screen and (max-width: 1316px){

        :root{
            --menu-height:                              74px;
        }

        .hmbrgr, 
        .mobile-header{                                 display: block; }
        .dtp-menu{                                      display: none; }

        .ga-summary{ 
            grid-template-areas:                        'sum-logo sum-name sum-program sum-dates';
            grid-template-columns:                      100px 1fr 150px 110px;
        }
        .ga-summary-met-infosessies{ 
            grid-template-areas:                        'sum-logo sum-name sum-program sum-dates sum-infosessies';
            grid-template-columns:                      100px 1fr 150px 110px 98px;
        }
        .ga-summary-name{                               display: block; }
        .ga-summary-location-name{                      display: none; }
        .ga-summary-price{                              display: none; }

        .hero{
            height:                                     calc(86vh - var(--menu-height));
        }

        .hero-with-alert{
            width:                                      100%;
            height:                                     calc(85vh - var(--menu-height) - 68px);
        }
    
    }


    @media screen and (max-width: 1290px){

        .grid-teasers{
            grid-template-columns:                      repeat(2, 1fr);                    
        } 
        .teaser-in-de-kijker-3,
        .teaser-in-de-kijker-4,
        .teaser-in-de-kijker-5,
        .teaser-in-de-kijker-6{
            display:                                    none;
        }

        .grid-infosessie-tiles{
            display:                                    grid;
            grid-template-columns:                      repeat(3, 1fr); 
        }      
        .infosessie-teaser-4{
            display:                                    block;
        }  

        .centered,
        .centered-narrow, 
        .centered-narrower, 
        .centered-narrowest {                       
            width:                                      90vw;
        }

    }


    @media screen and (max-width: 1130px){

        .grid-3-columns-highlight{
            grid-template-columns:                      repeat(3, 1fr);
        }

        .teaser-items-width-3 .grid-teasers,
        .teaser-items-width-4 .grid-teasers, 
        .teaser-items-width-5 .grid-teasers{                  grid-template-columns: repeat(2, 1fr);  }
        
        .ga-summary{  
            grid-template-areas:                        'sum-logo sum-name sum-program sum-dates';
            grid-template-columns:                      100px 1fr 150px 110px;
        }
        .ga-summary-location{                           display: none; }
        .ga-summary-price{                              display: none; }
            
    }


    @media screen and (max-width: 1000px){
        
        .grid-3-columns-highlight{
            grid-template-columns:                      repeat(2, 1fr);
        }

        .hero-land-tag{
            width:                                      100vw;
            margin-right:                               0; 
            left:										0; 
            top:										0; 
            height:                                     55px;
            transform-origin:							auto;
            transform: 									none;
            -moz-transform:								none;
            -webkit-transform:							none;
            -o-transform:								none;
            -ms-transform:								none;
            background:                                 -moz-linear-gradient(90deg, rgba(0, 0, 0, 0.5), rgba(0,0,0,0));
            background:                                 -webkit-linear-gradient(90deg, rgb(0, 0, 0, 0.5), rgba(0,0,0,0));
            background:                                 linear-gradient(90deg, rgb(0, 0, 0, 0.5), rgba(0,0,0,0));
            filter:                                     progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#000000",GradientType=1);
        }

        .hero-tags{ 
            margin-top:                                 -11px;
            margin-right:                               0px;
        }

        .margin-neg-l{ 									margin-left: 0; }
        .margin-neg-xl{ 								margin-left: 0; }
        .margin-neg-xxl{ 								margin-left: 0; }

        .input-search{
            font-size:                                  26px;
        }
    
    }
    

    @media screen and (max-width: 912px){

        :root{

            --padding-xs: 								6px;
            --padding-s: 								9px;
            --padding-m: 								12px;
            --padding-l: 								18px;
            --padding-xl: 								24px;
            --padding-xxl: 								58px;
            --padding-xxxl: 							62px;
            --padding-menu: 							29px;
    
            --font-xs: 									11px;
            --lineheight-xs:                            16px;
            
            --font-s: 									12px;
            --lineheight-s:                             16px;
            
            --font-n: 									14px;
            --lineheight-n:                             20px;
            
            --font-m: 									16px;
            --lineheight-m:                             24px;

            --font-l: 									17px;
            --lineheight-l: 							24px;
            
            --font-xl: 									19px;
            --lineheight-xl: 							31px;
            
            --font-xxxl: 								29px;
            --lineheight-xxxl: 							34px;
    
            --hero-height: 						        86vh;
            --hero-home-height: 				        86vh;
            --hero-narrow-height: 				        43vh;
            --hero-half-height: 				        43vh;

            --map-height: 						        95vh;
            
        }

        .reisoverzicht-padding-left{
            padding-left: 0;
        }

        .centered,
        .centered-narrow, 
        .centered-narrower, 
        .centered-narrowest {                       
            width:                                      87vw;
        }

        .centered-search{
            width:                                      93vw;
            max-width:                                  640px;
            transition:                                  width 420ms ease-in-out;
        }
        
        .text-left-to-center{                           text-align: left; }

        .grid-3-columns, 
        .grid-3-columns-overview,
        .grid-4-columns,
        .grid-5-columns, 
        .grid-5-columns-overview{
            grid-template-columns:                      repeat(2, 1fr);
        }

        .grid-mosaic-1 { 
            grid-area:                                  l-img; 
            -webkit-border-top-left-radius:             8px;  
            -webkit-border-top-right-radius:            8px; 
            -moz-border-radius-topleft:                 8px; 
            -moz-border-radius-topright:                8px; 
            border-top-left-radius:                     8px; 
            border-top-right-radius:                    8px; 
            -webkit-border-bottom-left-radius:          0px;  
            -moz-border-radius-bottomleft:              0px; 
            border-bottom-left-radius:                  0px; }
        
        .grid-mosaic-2 { 
            grid-area:                                  s-img1; 
            -webkit-border-top-left-radius:             0px; 
            -webkit-border-top-right-radius:            0px; 
            -moz-border-radius-topleft:                 0px; 
            -moz-border-radius-topright:                0px;  
            border-top-left-radius:                     0px; 
            border-top-right-radius:                    0px;  }
        
        .grid-mosaic-3 { 
            grid-area:                                  s-img2; 
            -webkit-border-top-left-radius:             0px; 
            -webkit-border-top-right-radius:            0px; 
            -moz-border-radius-topleft:                 0px; 
            -moz-border-radius-topright:                0px;  
            border-top-left-radius:                     0px; 
            border-top-right-radius:                    0px;  }
        
        .grid-mosaic-4 { 
            grid-area:                                  s-img3;  
            -webkit-border-bottom-left-radius:          8px; 
            -moz-border-radius-bottomleft:              8px; 
            border-bottom-left-radius:                  8px; }
        
        .grid-mosaic-5 { 
            grid-area:                                  s-img4; 
            -webkit-border-bottom-right-radius:         8px; 
            -moz-border-radius-bottomright:             8px; 
            border-bottom-right-radius:                 8px; }
        
        .grid-mosaic {
            display:                                    grid;
            grid-template-areas:                        'l-img l-img'
                                                        's-img1 s-img2'
                                                        's-img3 s-img4';
            gap:                                        3px;
            height:                                     65vh;  }

        .hide-on-tbl{                               
             display:                                   none;  }   

        .filter-container{
            display:                                    none; }
        
        .filter-toggle{
            display:                                    block; }


        .grid-infosessie-tiles{
            display:                                    grid;
            grid-template-columns:                      repeat(2, 1fr); 
        }      
        .infosessie-teaser-3,
        .infosessie-teaser-4{
            display:                                    block;
        }  

        .teaser-items-width-2{ width: 100%; min-width: auto; }

        .ga-summary{ 
            grid-template-areas:                        'sum-logo sum-program sum-dates';
            grid-template-columns:                      100px 1fr 110px;
        }
        .ga-summary-location{                           display: none; }
        .ga-summary-price{                              display: none; }
        .ga-summary-name{                               display: none; }

    }


    @media screen and (max-width: 871px){

        :root{

            --padding-xs: 								6px;
            --padding-s: 								9px;
            --padding-m: 								12px;
            --padding-l: 								18px;
            --padding-xl: 								24px;
            --padding-xxl: 								58px;
            --padding-xxxl: 							62px;
            --padding-menu: 							29px;
    
            --font-xs: 									11px;
            --lineheight-xs:                            16px;
            
            --font-s: 									12px;
            --lineheight-s:                             16px;
            
            --font-n: 									14px;
            --lineheight-n:                             20px;
            
            --font-m: 									16px;
            --lineheight-m:                             24px;

            --font-l: 									17px;
            --lineheight-l: 							24px;
            
            --font-xl: 									19px;
            --lineheight-xl: 							31px;
            
            --font-xxxl: 								29px;
            --lineheight-xxxl: 							34px;

            --font-hero: 								34px;
            --lineheight-hero: 						    44px;
    
            --hero-height: 						        78vh;
            --hero-home-height: 				        68vh;
            --hero-narrow-height: 				        34vh;
            --hero-half-height: 				        34vh;
            
            --map-height: 						        95vh;
            
        }

        .text-left-to-center{                           text-align: center; }

        .centered,
        .centered-narrow, 
        .centered-narrower, 
        .centered-narrowest {                       
            width:                                      90vw;
            max-width:                                  740px;
        }
        
        .grid-2-columns, 
        .grid-2-columns-dense, 
        .grid-2-columns-overview,
        .grid-2-columns-content,
        .grid-2-columns-40-60{
            grid-template-columns:                      repeat(1, 1fr); }
        
        .grid-3-columns, 
        .grid-3-columns-overview,
        .grid-3-columns-highlight,
        .grid-4-columns,
        .grid-5-columns, 
        .grid-5-columns-overview{
            grid-template-columns:                      repeat(2, 1fr); }

        .width-80-to-100pct{                            width: 100%; }

        .prijsscenario-header-desktop-tablet-only{      display: none; }
        .prijsscenario-header-mobile-only{              display: block; }

        .width-fractional-to-full{                               width: 100%; }

        .lightbox-image-container,
        #lightbox-image-container {
            width:                                      100vw;  
            height:                                     70vh; }
        
        .lightbox-image-container img {
            object-fit:                                 contain;
            height:                                     66vh; 
            width:                                      auto; }
        
        .lightbox-nav-left-button, .lightbox-nav-right-button{
            width:                                      60px;
            height:                                     60px;
            border-radius:                              50%;
            color:                                      var(--white);
            font-size:                                  var(--font-xxxl);
            text-align:                                 center;
        }
        
    }


    @media screen and (max-width: 724px){

        .ga-hero-reisformule{                           text-align: center; }
        .ga-hero-dagen{                                 text-align: center; }
        .ga-hero-vertrekdata{                           text-align: center; }
        .ga-hero-prijsquote{                            text-align: center; }
        .ga-hero-summary{
            display:                                    grid;
            grid-template-areas:                        'hero-reisformule' 'hero-dagen' 'hero-vertrekdata' 'hero-prijsquote';
            grid-template-columns:                      1fr;
            row-gap:                                    var(--padding-xxs);
        }

        .ga-cta-button1{                                text-align: center; }
        .ga-cta-button2{                                text-align: center; }
        .ga-cta-buttons{
            column-gap:                                 0px;
            row-gap:                                    4px;
            grid-template-areas:                        'cta-button1' 'cta-button2';
            grid-template-columns:                      1fr;
            overflow:                                   auto;
        }


    }


    @media screen and (max-width: 674px){
 
        .grid-teasers{
            grid-template-columns:                      repeat(1, 1fr);                    
        } 
        .teaser-in-de-kijker-2,
        .teaser-in-de-kijker-3,
        .teaser-in-de-kijker-4,
        .teaser-in-de-kijker-5,
        .teaser-in-de-kijker-6{
            display:                                    none;
        }

        .teaser-items-width-1,
        .teaser-items-width-2{ width: 100%; min-width: auto; }
        .teaser-items-width-2 .grid-teasers,
        .teaser-items-width-3 .grid-teasers,
        .teaser-items-width-4 .grid-teasers,
        .teaser-items-width-5 .grid-teasers{                  grid-template-columns: repeat(1, 1fr);  }


        .mapbox-programma-scroller{
            width:                                      100%;
            max-width:                                  100%;
        }


        .ga-date {                                      text-align: left; }
        .ga-status {                                    text-align: left; padding-left: 0px; }
        .ga-price {                                     text-align: left; }
        .ga-days {                                      text-align: left; }
        .ga{
            grid-template-areas:                        'url url' 'date status' 'days price';
            grid-template-columns:                      1fr 1fr;
            row-gap:                                    0px;
        }

        .ga-input-reizigers{ 
            display:                                    grid;
            grid-template-areas:                        'input-reizigers' 'input-aantal-reizigers';
            grid-template-columns:                      1fr;
            column-gap:                                 0px;
        }
        .ga-input-vertrekdatum{ 
            display:                                    grid;
            grid-template-areas:                        'input-vertrekdatum-titel' 'input-vertrekdatum-selector';
            grid-template-columns:                      1fr;
            column-gap:                                 0px;
        }
        .ga-input-travelagency{ 
            display:                                    grid;
            grid-template-areas:                        'input-business' 'input-contactperson';
            grid-template-columns:                      1fr;
            column-gap:                                 0px;
        }
        .ga-input-personal{ 
            display:                                    grid;
            grid-template-areas:                        'input-firstname' 'input-lastname' 'input-birthdate';
            grid-template-columns:                      1fr;
            column-gap:                                 0px;
        }
        .ga-input-personal-brief{ 
            display:                                    grid;
            grid-template-areas:                        'input-firstname' 'input-lastname' 'input-postalcode';
            grid-template-columns:                      1fr;
            column-gap:                                 0px;
        }
        .ga-input-personal-names{ 
            display:                                    grid;
            grid-template-areas:                        'input-firstname' 'input-lastname';
            grid-template-columns:                      1fr;
            column-gap:                                 0px;
        }
        .ga-input-selector{ 
            display:                                    grid;
            grid-template-areas:                        'input-selector' 'input-space' 'input-selector-output';
            grid-template-columns:                      1fr;
            column-gap:                                 0px;
        }
        .ga-input-address1{ 
            display:                                    grid;
            grid-template-areas:                        'input-street' 'input-housenumber' 'input-bus';
            grid-template-columns:                      1fr;
        }
        .ga-input-address2{ 
            display:                                    grid;
            grid-template-areas:                        'input-postalcode' 'input-city' 'input-country';
            grid-template-columns:                      1fr;
        }
        .ga-input-communication{ 
            display:                                    grid;
            grid-template-areas:                        'input-tel' 'input-email';
            grid-template-columns:                      1fr;
        }
        .ga-input-infosessie-programma{
            grid-template-areas:                        'input-timeslot' 'input-sessie-select';
            grid-template-columns:                      1fr;
        }

        .ga-reisoverzicht-tc-count{                     padding-bottom: var(--padding-l); }
        .ga-reisoverzicht-tc{ 
            grid-template-areas:                        'reisoverzicht-titel' 'reisoverzicht-count';
            grid-template-columns:                      1fr;
            padding-bottom:                             0px;
        }

        .hero-tags{
            margin-top:                                 48px;
        }

        .search-box{
            min-width:                                  100%;
        }


    }


    @media screen and (max-width: 526px){

        .grid-infosessie-tiles{
            display:                                    grid;
            grid-template-columns:                      repeat(1, 1fr); 
        }      
        .infosessie-teaser-2,
        .infosessie-teaser-3,
        .infosessie-teaser-4{
            display:                                    block;
        } 

        .ga-summary-met-infosessies{  
            grid-template-areas:                        'sum-logo sum-name sum-program sum-dates';
            grid-template-columns:                      100px 1fr 150px 110px;
        }
        .ga-summary-infosessies{                        display: none; }

        .teaser-items-width-1{ width: 100%; }

    }


    @media screen and (max-width: 480px){

        :root{

            --padding-xs: 								6px;
            --padding-s: 								9px;
            --padding-m: 								12px;
            --padding-l: 								18px;
            --padding-xl: 								24px;
            --padding-xxl: 								58px;
            --padding-menu: 							29px;
    
            --font-xs: 									11px;
            --lineheight-xs:                            16px;
            
            --font-s: 									12px;
            --lineheight-s:                             16px;
            
            --font-n: 									14px;
            --lineheight-n:                             20px;
            
            --font-m: 									16px;
            --lineheight-m:                             24px;

            --font-l: 									17px;
            --lineheight-l: 							24px;
            
            --font-xl: 									18px;
            --lineheight-xl: 							31px;

            --font-xxl: 								22px;
            --lineheight-xxl: 							29px;
            
            --font-xxxl: 								29px;
            --lineheight-xxxl: 							34px;

            --font-xxxxl: 								33px; 
            --lineheight-xxxxl: 						38px;
    
            --hero-height: 						        88vh;
            --hero-home-height: 				        68vh;
            --hero-narrow-height: 				        34vh;
            --hero-half-height: 				        34vh;
            
            --map-height: 						        95vh;
            
        }

        .desktop-only{                                  display: none;  }
        .desktop-tablet-only{                           display: none;  }
        .tablet-only{                                   display: none;  }
        .mobile-only{                                   display: inline-block;  }

        .grid-2-columns, 
        .grid-2-columns-dense, 
        .grid-2-columns-overview,
        .grid-2-columns-content,
        .grid-2-columns-40-60,
        .grid-3-columns, 
        .grid-3-columns-overview,
        .grid-3-columns-highlight,
        .grid-4-columns,
        .grid-5-columns, 
        .grid-5-columns-overview{
            grid-template-columns:                      repeat(1, 1fr); }

        .grid-3-columns-highlight > div:first-child{
            grid-column:                                1 / 1; }

        .hero-home{
            width:                                      100%;
            height:                                     calc(86vh - var(--menu-height));
        }
        
        .hero-home-with-alert{
            width:                                      100%;
            height:                                     calc(86vh - var(--menu-height) - 48px);
        }

        a.subscribe-button-rounded:link,
        a.subscribe-button-rounded:active,
        a.subscribe-button-rounded:visited,
        a.subscribe-button-rounded:hover{ 
            font-size: 									18px; 
        }
            
        a.subscribe-button-rounded:hover{ 
            font-size: 									18px; 
        }

        a.CTA-button:link,
        a.CTA-button:active,
        a.CTA-button:visited,
        a.CTA-button:hover{
            width:                                      100%;
            font-size: 									18px; 
        }
        a.CTA-button:hover{ 
            width:                                      100%;
            font-size: 									18px; 
        }

        a.CTA-ghost-button:link,
        a.CTA-ghost-button:active,
        a.CTA-ghost-button:visited,
        a.CTA-ghost-button:hover{
            width:                                      100%;
            font-size: 									18px; 
        }
        a.CTA-ghost-button:hover{ 
            width:                                      100%;
            font-size: 									18px; 
        }
    
    

    }