@font-face {
  font-display: swap; 
  font-family: 'Garnett';
  font-style: normal;
  font-weight: 400;
  src: url('font2/Garnett-Regular.otf') format('opentype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Garnett';
  font-style: normal;
  font-weight: 100;
  src: url('font2/Garnett-Light.otf') format('opentype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Garnett';
  font-style: normal;
  font-weight: 500;
  src: url('font2/Garnett-Medium.otf') format('opentype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Garnett';
  font-style: normal;
  font-weight: 600;
  src: url('font2/Garnett-Semibold.otf') format('opentype'); 
}

@font-face {
  font-display: swap; 
  font-family: 'Affairs';
  font-style: normal;
  font-weight: 400;
  src: url('font2/Affairs-Regular.otf') format('opentype'); 
}




/* ========================================================================
   Base
 ========================================================================== */

:root {
	--geel: #eeed95;
	--oranje: #ff6231;
	--tekstoranje: #f94a13;
	--lichtblauw: #b3cbd6;
	--groen: #004e40;
	--beige: #e8dacb;
	--donkerblauw: #003b5d;
	--antraciet: #2e2e2e;
}


* {
  box-sizing: border-box;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video { margin: 0; padding: 0; border: 0; }


html,body { width: 100%; height: 100%; overscroll-behavior-y: none; -webkit-overflow-scrolling: touch; }
body {  margin: 0; padding: 108px 0 0 0;  overflow-x: hidden;  }
body.noscroll { overflow-y: hidden;  }
body.beige { 
  background: -webkit-linear-gradient(var(--beige), var(--antraciet) 50%);
  background: -o-linear-gradient(var(--beige) 50%, var(--antraciet) 50%);
  background: -moz-linear-gradient(var(--beige) 50%, var(--antraciet) 50%);
  background: linear-gradient(var(--beige) 50%, var(--antraciet) 50%);
}
body.geel { 
  background: -webkit-linear-gradient(var(--geel), var(--antraciet) 50%);
  background: -o-linear-gradient(var(--geel) 50%, var(--antraciet) 50%);
  background: -moz-linear-gradient(var(--geel) 50%, var(--antraciet) 50%);
  background: linear-gradient(var(--geel) 50%, var(--antraciet) 50%);
 }
body.groen { 
  background: -webkit-linear-gradient(var(--groen), var(--antraciet) 50%);
  background: -o-linear-gradient(var(--groen) 50%, var(--antraciet) 50%);
  background: -moz-linear-gradient(var(--groen) 50%, var(--antraciet) 50%);
  background: linear-gradient(var(--groen) 50%, var(--antraciet) 50%);
}
body.lichtblauw { 
  background: -webkit-linear-gradient(var(--lichtblauw), var(--antraciet) 50%);
  background: -o-linear-gradient(var(--lichtblauw) 50%, var(--antraciet) 50%);
  background: -moz-linear-gradient(var(--lichtblauw) 50%, var(--antraciet) 50%);
  background: linear-gradient(var(--lichtblauw) 50%, var(--antraciet) 50%);
}
body.antraciet { background-color: var(--antraciet); }
html { -webkit-text-size-adjust: 100%;  -ms-text-size-adjust: 100%; scroll-behavior: smooth; font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 62.5%; }


.landscape_only { display: none; }
@media screen and (max-width: 1023px) and (orientation: landscape) {
  .portrait_only { display: none; }
  .landscape_only { display: block; }
}

.phone-only, .mobile-only, .nodisp, .phonebreak { display: none; }
.nodisp-phone { }

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Opera and Firefox */
}

a { color: inherit; text-decoration-color: var(--oranje);  -webkit-text-decoration-color: var(--oranje); }
p a { text-decoration-color: inherit;  -webkit-text-decoration-color: inherit; }
a.diapos { color: #fff; }
a.navlink { display: block; color: var(--oranje); text-decoration: none; font-size: 3rem; line-height: 4rem; }
a.navlink-alt { color: var(--altoranje); }
a.navlink-small { font-size: 2rem; line-height: 3.9rem; }

a.lv_dflt { display: block; font-size: 3rem; color: var(--tekstoranje); text-decoration: none; }
a.lv_dflt_500 { font-weight: 500; }

.kopmenu a, .voetmenu a { color: var(--tekstoranje); text-decoration: none; font-size: 2rem; line-height: 3.9rem; } 
.voetmenu a span { display: inline-block; padding-left: 0; transition: padding-left .3s; }
.voetmenu a:hover span { padding-left: 6px; } 

:focus {
  outline: none;
}

::-moz-focus-inner {
  border: 0;
}

.fixed_background { position: fixed; top: 108px; left: 0px; width: 100vw; height: 400px;  }
.fixed_background_home { height: 100svh; }

#page_content { position: relative; z-index: 2; min-height: 100%; }
#page_content.beige { background-color: var(--beige); }
#page_content.donkerblauw { background-color: var(--donkerblauw); }
#page_content.geel { background-color: var(--geel); }
#page_content.groen { background-color: var(--groen); }
#page_content.lichtblauw { background-color: var(--lichtblauw); }

#mobile_margin { z-index: 2; height:1px; overflow: hidden; }

@media screen and (max-width: 1400px) {
	body {  padding: 138px 0 0 0; }
	.fixed_background { top: 138px;  }
}

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

@media screen and (max-width: 1023px) {
	body {  padding: 70px 0 0 0; }
	.fixed_background { top: 70px;  }
}
@media screen and (max-width: 750px) {
	.phone-only, .mobile-only, .nodisp { display: block; }
	.phonebreak { display: inline; }
	.nodisp-phone { display: none; }
	.voetmenu a { line-height: 4.2rem; } 
	a.lv_dflt { font-size: 2.4rem; line-height: 2.8rem;  }
}



/* ========================================================================
   Grid
 ========================================================================== */
 
section { position: relative; width: 100%; background-color: inherit; z-index: 1; }
section.beige { background-color: var(--beige); }
section.donkerblauw { background-color: var(--donkerblauw); }
section.geel { background-color: var(--geel); }
section.groen { background-color: var(--groen); }
section.lichtblauw { background-color: var(--lichtblauw); }



.container { width: 100%; padding: 0 30px; display: grid; grid-template-columns: repeat(8, 1fr); column-gap: 20px; max-width: 1512px; margin: 0px auto;   }
.pagvoet_phone { }

.grid_dense { grid-auto-flow: dense; }


.span-1-2 { grid-column: 1 / span 2; }
.span-1-3 { grid-column: 1 / span 3; }
.span-1-4 { grid-column: 1 / span 4; }
.span-1-5 { grid-column: 1 / span 5; }
.span-1-6 { grid-column: 1 / span 6; }
.span-1-7 { grid-column: 1 / span 7; }
.span-1-8 { grid-column: 1 / span 8; }

.span-2-3 { grid-column: 2 / span 2; }
.span-2-5 { grid-column: 2 / span 4; }
.span-2-6 { grid-column: 2 / span 5; }
.span-2-7 { grid-column: 2 / span 6; }
.span-2-8 { grid-column: 2 / span 7; }

.span-3-4 { grid-column: 3 / span 2; }

.span-4-5 { grid-column: 4 / span 2; }
.span-4-6 { grid-column: 4 / span 3; }
.span-4-7 { grid-column: 4 / span 4; }
.span-4-8 { grid-column: 4 / span 5; }

.span-5-6 { grid-column: 5 / span 2; }
.span-5-8 { grid-column: 5 / span 4; }

.span-6-7 { grid-column: 6 / span 2; }

.span-7-8 { grid-column: 7 / span 2; }


.subcols-2 { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 20px; }
.subcols-2-laptop { }
.subscols-2-fw { grid-column: 1 / span 2; }



.phonespan-1-2 {}
.phonespan-1-1 {}
.phonespan-2-1 {}

.tabletspan-1-8 {}
.tabletspan-1-4 {}
.tabletspan-5-8 {}

.laptopspan-1-8 {}

.footerphonespan-1-1 {}

.row-1-2 { grid-row: 1 / span 2; }
.row-2-3 { grid-row: 2 / span 2; }


.span-1-4 .scrollsticky { height: auto; position: sticky; top: 143px; padding-bottom: 20rem; }
.span-1-8 .scrollsticky { height: auto; position: sticky; top: 184px; }

.menukolbeeld { width: 80%; margin-top: 12rem;}
.menukolbeeld_clear_mt { margin-top: 0;}

@media screen and (max-width: 1200px) {
	.laptopspan-1-8 { grid-column: 1 / span 8; }
	.laptopspan-1-8 .scrollsticky { padding-bottom: 0; }
	.subcols-2-laptop { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 20px; }
}

@media screen and (max-width: 1023px) {
	.tabletspan-1-8 { grid-column: 1 / span 8; }
	.tabletspan-1-4 { grid-column: 1 / span 4; }
	.tabletspan-5-8 { grid-column: 5 / span 8; }
	.tabletspan-1-8 .scrollsticky { height: auto; position: relative; top: auto; padding-bottom: 6rem;}
}

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

	.container { padding: 0 14px; grid-template-columns: 1fr 1fr; }
	
	.span-1-2 {  }
	.span-1-3 {  }
	.span-1-4 {  }
	.span-1-5 {  }
	.span-1-6 {  }
	.span-1-7 {  }
	.span-1-8 {  }

	.span-2-3 {  }
	.span-2-5 {  }
	.span-2-6 {  }
	.span-2-7 {  }
	.span-2-8 {  }

	.span-3-4 {  }

	.span-4-5 {  }
	.span-4-6 {  }
	.span-4-7 {  }
	.span-4-8 {  }

	.span-5-6 {  }
	.span-5-8 {  }

	.span-6-7 {  }

	.span-7-8 {  }

	.subcols-2 {  }
	.subscols-2-fw {  }

	.phonespan-1-2 { grid-column: 1 / span 2; }
	.phonespan-1-1 { grid-column: 1 / span 1; }
	.phonespan-2-1 { grid-column: 2 / span 1; }
	
	.tabletspan-1-8 {}
	.tabletspan-1-4 {}
	.tabletspan-5-8 {}
	
	.laptopspan-1-8 {}

	
	.span-1-4 .scrollsticky, .span-1-8 .scrollsticky { height: auto; position: relative; top: auto; padding-bottom: 0;}
	.tabletspan-1-8 .scrollsticky { padding-bottom: 3rem;}
	
	.pagvoet_phone { display: flex; flex-direction: column; }
	.voetmenu, .voetbeeld { width: 100%; }
	.voetbeeld { order: 0; }
	.voetmenu { order: 1; margin: 12rem 0 4.1rem 0; }
	
	
}


@media screen and (max-width: 600px) {
	.footerphonespan-1-1 { grid-column: 1 / span 2; }
	.fsmicons.footerphonespan-1-1 { margin: 1rem 0 2rem 0; }
}


/* ========================================================================
   Typography
 ========================================================================== */

h1 { font-family: Affairs, serif; font-weight: 400; font-size: 8.2rem; line-height: 1.9; letter-spacing: -.3px;  }
.lead h1 { font-size: 5rem; line-height: 5.2rem; margin-bottom: 3rem; }
.span-1-4 h1 { line-height: 9rem; max-width: 90%; }
.span-1-8 h1 { line-height: 9rem;  }
h1.kop { font-family: Garnett, Arial, sans-serif; font-size: 9.6rem; line-height: 9.6rem; font-weight: 500; }

h3 { font-family: Garnett, Arial, sans-serif; font-weight: 500; font-size: 3rem; line-height: 3.6rem; }

h6 { font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.6rem; line-height: 2rem; color: var(--geel); }




p, td { font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3.2rem; }
.lead p { font-family: Affairs, serif; font-size: 3.2rem; line-height: 4.3rem; }
.span-1-4 p { max-width: 90%; }
.caption p { font-size: 1.4rem; line-height: 1.9rem; max-width: 75%;  }

ul.indent { margin: 5px 0 3rem 0; list-style: none; }
ul.indent li { font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3rem; margin-left: 37px; }
ul.indent li::before { content: '•'; font-weight: 100; margin-left: -22px; padding-right: 15px; }

ol { margin: 5px 0 3rem 0;  }
ol li { font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3rem; margin: 0 0 10px 20px;  padding-left: 20px; }


.phonebreak { }


@media screen and (max-width: 1400px) {
	h1, .span-1-4 h1 { font-size: 6.4rem; line-height: 7rem; }
	h3 { font-size: 2.4rem;  line-height: 2.8rem; margin-bottom: 1rem; }
}

@media screen and (max-width: 750px) {
	.span-1-4 h1 { max-width: 100%;   }
	.span-1-8 h1 { line-height: 4.2rem;  }
	h1.kop { font-size: 6rem; line-height: 6rem;  }
	
	h3 { font-size: 1.95rem; line-height: 2.5rem; }
	
	
	p { font-size: 1.8rem; line-height: 2.6rem; }
	.lead p { font-family: Affairs, serif; font-size: 2.6rem; line-height: 3.5rem; }
	.span-1-4 p { max-width: 100%; }

	ul.indent { margin: 0 0 2.4rem 0; list-style: none; }
	ul.indent li { font-size: 1.8rem; line-height: 2.6rem; margin-left: 27px; }
	ul.indent li::before { margin-left: -15px; padding-right: 9px; }

}

@media screen and (max-width: 600px) {
	h1 { font-size: 4rem; line-height: 4.2rem; }
	.span-1-4 h1 { font-size: 4rem; line-height: 4.2rem;   }

}

 /*  Diapositive
 ========================================================================== */

#page_content.diapos h1, #page_content.diapos h2, #page_content.diapos h3, #page_content.diapos p, #page_content.diapos li, #page_content.diapos .expo_nav a.active { color: #fff; }



/* ========================================================================
   Margins & Paddings
 ========================================================================== */
 

 /*  Grid margins
 ========================================================================== */

section.mb_dflt { padding-bottom: 12rem; }

article.container { padding: 30px; }
article:first-of-type  { padding-top: 35px; }
article:first-of-type.pagtitelcontainer  { padding-top: 50px; }

.span-5-8 > div { margin-bottom: 6rem; }
.span-5-8 > div.mb20 { margin-bottom: 2rem; }
.span-5-8 > div.mb40 { margin-bottom: 4rem; }
.span-5-8 > div.pag_lead { margin-bottom: 2rem; }
.span-5-8 > div.nieuws_lead { margin-bottom: 6rem; }
.span-5-8 > div.nieuwsitem { margin-bottom: 1.7rem; }
.span-5-8 > div.lv_dflt { margin: 5.5rem 0 2.5rem 0; }

.mt_dflt { margin-top: 2.6rem; }
.mt10 { margin-top: 1rem; }
.mt14 { margin-top: 1.4rem; }
.mt22 { margin-top: 2.2rem; }
.mt66 { margin-top: 6.6rem; }

.phone_gridgap { }

.linkblok { margin: 1rem 0 6rem 0; }

.pag_lead { padding-top: 3.3rem; }

img + div.caption { margin-top: 1rem; }


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

	section.mb_dflt { padding-bottom: 0; }

	article.container { padding: 14px; }
	.span-5-8 > div, .span-5-8 > div.mb20, .span-5-8 > div.mb40 { margin-bottom: 1.2rem; }
	.span-5-8 > div.pag_lead { margin-bottom: 3rem; }
	.span-5-8 > div.nieuws_lead, .span-5-8 > div.locatie { margin-bottom: 6rem; }
	.span-5-8 > div.nieuwsitem { margin-bottom: 1.7rem; }
	.span-5-8 > div.lv_dflt { margin: 5.5rem 0 2.5rem 0; }
	
	.phone_gridgap { margin-left: 18px; }
	
	.linkblok { margin: 0; }
	.voetmenu .mt10 { margin: 0; }


}


 /*  Type margins
 ========================================================================== */
 
.span-1-4 h1 { margin-bottom: 3rem; }
.span-1-4 h1.header-1-8, .span-1-8 h1 { margin-bottom: 3rem; }

.kopmenu h3 { margin: 3.5rem 0 1rem 0; }

p { margin-bottom: 3rem; }
.pag_lead p { margin-bottom: 0; }

table + p { margin-top: 3rem; }

@media screen and (max-width: 750px) {
	h1 { margin: 3rem 0 6rem 0;}
	.span-1-4 h1 { margin-bottom: 4.6rem; }
	p { margin-bottom: 2.4rem; }
	.voetmenu h3 { margin-bottom: 1rem; }
}

/* ========================================================================
   Images
 ========================================================================== */
 
section.hero_fw img { width: 100%; object-fit: cover; aspect-ratio: 2 / 1; overflow: hidden; }


.hero_container { display: block; position: relative; width: 100%; height: 67vw; max-height: 1000px; overflow: hidden !important; }
.hero { display: block; position: absolute; width: 100%; aspect-ratio: 1.66 / 1;  transition: max-height 1s; overflow: hidden !important; -webkit-transition-delay: .3s; transition-delay: .3s; }
.hero img {width: 100%; aspect-ratio: 1.66 / 1; object-fit: cover; transform: scale(.96); opacity: 0; transition: all 1s; -webkit-transition-delay: .3s; transition-delay: .3s; }
.hero.open img { transform: scale(1); opacity: 1;  }
.hero.open img.bottom { position: absolute; bottom: 0;  }


article img { width: 100%; object-fit: cover; overflow: hidden; }
.locatie_img img { aspect-ratio: 718 / 508; }
.expo_home_img img { aspect-ratio: 1 / 1; }
.agenda_home_img img { aspect-ratio: 348 / 266; }

.expotegel_img img { aspect-ratio: 716 / 530; }
.agendategel_img img { aspect-ratio: 4 / 3; }


.derdenlogo img { width: 150px; }


@media screen and (max-width: 750px) {
	.agenda_home_img img { aspect-ratio: 1 / 1; }
}




/* ========================================================================
   Header
 ========================================================================== */

header { position: fixed; width: 100vw; height: 108px; top: 0; z-index: 99; background-color: var(--geel); }

#logodiv, #menudiv { position: relative; height: 100%; }
#logodiv { grid-column: 1 / span 3; }
#menudiv { grid-column: 4 / span 5; }
#logodiv a, #menudiv a { text-decoration:none; }

#hamburgerdiv, #logodiv .logo { display: none; }

#logodiv .woordmerk h2 { font-weight: 500; font-size: 5rem; line-height: 1; letter-spacing: -.2px;  margin-top: 36px; }




@media screen and (max-width: 1400px) {
	header {  height: 138px;  }
	#logodiv { grid-column: 1 / span 2; }
	#menudiv { grid-column: 3 / span 6; }
	#logodiv .woordmerk h2 { margin-top: 24px; }
}
@media screen and (max-width: 1140px) {
	#logodiv .woordmerk h2 { font-size: 4.6rem; }
}
@media screen and (max-width: 1023px) {
	header {  height: 70px;  }
	#logodiv { grid-column: 1 / span 7; }
	#menudiv { display: none; }
	#logodiv .woordmerk h2 { font-size: 3.2rem; margin-top: 20px; }
	#hamburgerdiv { display: grid; grid-column: 8 / span 1; padding-top: .7rem; }
}
@media screen and (max-width: 445px) {
	#logodiv .woordmerk h2 { font-size: 3rem;  }
}
@media screen and (max-width: 355px) {
	#logodiv .woordmerk h2 { font-size: 2rem; margin-top: 24px;  }
}

/* ========================================================================
   Navigation
 ========================================================================== */


#menudiv nav ul { list-style: none; width: 100%; display: flex; justify-content: space-between; }
#menudiv nav ul li { margin-top: 60px; }
#menudiv nav ul li a { font-weight: 500; font-size: 2rem; line-height: .8;  }
#menudiv nav ul li a:hover, #menudiv nav ul li a.active, #menudiv nav ul li a.selected { color: var(--oranje); }
#menudiv.submenuactive nav ul li a.selected:not(.active) { color: #000; }

#submenu { position: fixed; top: 108px; width: 100%; background-color: var(--geel); box-shadow: 0 1px 8px -2px rgba(0,0,0,.4); max-height: 0px; overflow: hidden !important; z-index: 98; transition: max-height .5s; -webkit-transition-delay: 250ms; transition-delay: 250ms;  }
#submenu.active { max-height: 1000px; }
#submenu nav { grid-column: 4 / span 5; } 
#submenu nav ul { position: absolute; top: 0; list-style: none; display: block; opacity: 0; transition: opacity .2s;  }
#submenu nav ul.active { opacity: 1; }
#submenu nav ul.submenuLast { float: right; margin-right: 30px; text-align: right; width: 100%; display: none; }
#submenu nav ul.submenuLast.active { display: block; }
#submenu nav ul li { margin-top: 0; }
#submenu nav ul li a { font-weight: 500; font-size: 2rem; line-height: 4rem; text-decoration: none;  }
#submenu nav ul li a:hover, #menudiv nav ul li a.active { color: var(--oranje); }


#taaldiv { position: absolute; right: 16px; top:6px; }
#phonemenu_taaldiv { position: absolute; right: 0px; top:0px; }
.otherlang a { opacity: 0; transition: opacity .3s; }
.otherlang a.visible { opacity: 1; }

#taaldiv a, #phonemenu_taaldiv a { font-family: Garnett, Arial, sans-serif; display: flex; align-items: center; width: 40px; padding-top: 10px; font-size: 1.4rem; font-weight: 500; line-height: 1rem; text-decoration: none;  }
#taaldiv a span, #phonemenu_taaldiv .curlang a span { margin: -.4rem 0 0 .2rem; }
#taaldiv .otherlang a, #phonemenu_taaldiv .otherlang a { color: var(--tekstoranje);  }

.tabmenu { width: 100%; height: 65px; display: flex; border-bottom: 1px solid #000; padding-bottom: 7.4rem; margin-bottom: 6rem; }
.tabmenu a { font-size: 3rem; font-weight: 500; line-height: 3.6rem; color: var(--tekstoranje); text-decoration: none; margin-right: 18px; }
.tabmenu a.active { color: #000; }

#phonemenu, #phonemenu_inner { display: none; }


@media screen and (max-width: 1400px) {
	#submenu {  top: 130px;  }
	#submenu nav { grid-column: 3 / span 6; } 
}

@media screen and (max-width: 1023px) {
	#submenu { display: none; }
	#phonemenu { position: fixed; top: 70px; display: block; width: 100vw; height: 100svh; padding: 14px; background-color: var(--geel); opacity: 0; z-index: -2; transition: all .5s;  }
	#phonemenu.active { opacity: 1; z-index: 98; }
	#phonemenu_inner { position: relative; display: block; height: 100%; overflow: auto; }
	#phonemenu ul { list-style: none; width: 100%;  }
	#phonemenu ul.phonemenu_legal { margin-top: 3rem;  }
	#phonemenu ul li a { font-weight: 500; font-size: 2rem; line-height: 4rem; text-decoration: none;  }
	#phonemenu ul.phonemenu_legal li a { font-size: 1.5rem; line-height: 2rem;  }
/* 
	#phonemenu ul li a.active, #phonemenu ul li a.selected { color: var(--oranje); }
 */
	#phonemenu ul li a.active span { display: none; }

	#phonemenu_main { margin-top: 7.4rem; }
	#phonemenu_main ul li { margin-bottom: .5rem; }
	#phonemenu_main_logo { margin-top: 6rem; }
	
	#phonemenu_main_back { position:absolute; top: 0; display: none; font-weight: 500; font-size: 2rem; cursor: pointer; }

	#phonemenu_sub { position:absolute; top: 12rem; left: 3.3rem; padding-bottom: 80px; display: none;  }
	#phonemenu_sub ul li { margin-bottom: .5rem; }
	#phonemenu_sub div { display: none;  }
	
	
	

	#taaldiv {  display: none;  }
}

@media screen and (max-width: 750px) {
.tabmenu { display: block; padding-bottom: 5rem; margin-bottom: 4rem; height: auto; }
.tabmenu a { display: block; width: 100%; font-size: 2rem; line-height: 2.6rem;  }
}
@media screen and (max-width: 355px) {
	#phonemenu ul li a { font-size: 1.65rem;  }
}

 /*  Diapositive
 ========================================================================== */

.tabmenu.diapos { border-bottom: 1px solid #fff; }
.tabmenu.diapos a.active { color: #fff; }



 /*  Hamburger
 ========================================================================== */

/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
.hamburger {
  padding: 15px 0;
  display: inline-block;
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible; }
  .hamburger:hover {
    opacity: 0.7; }
  .hamburger.is-active:hover {
    opacity: 0.7; }
  .hamburger.is-active .hamburger-inner,
  .hamburger.is-active .hamburger-inner::before,
  .hamburger.is-active .hamburger-inner::after {
    background-color: #000; }

.hamburger-box {
  width: 40px;
  height: 24px;
  display: inline-block;
  position: relative; }

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px; }
  .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
    width: 40px;
    height: 4px;
    background-color: #000;
    position: absolute;
    transition-property: transform;
    transition-duration: 0.15s;
    transition-timing-function: ease; }
  .hamburger-inner::before, .hamburger-inner::after {
    content: "";
    display: block; }
  .hamburger-inner::before {
    top: -10px; }
  .hamburger-inner::after {
    bottom: -10px; }


/*
   * Squeeze
   */
.hamburger--squeeze .hamburger-inner {
  transition-duration: 0.075s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--squeeze .hamburger-inner::before {
    transition: top 0.075s 0.12s ease, opacity 0.075s ease; }
  .hamburger--squeeze .hamburger-inner::after {
    transition: bottom 0.075s 0.12s ease, transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--squeeze.is-active .hamburger-inner {
  transform: rotate(45deg);
  transition-delay: 0.12s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
  .hamburger--squeeze.is-active .hamburger-inner::before {
    top: 0;
    opacity: 0;
    transition: top 0.075s ease, opacity 0.075s 0.12s ease; }
  .hamburger--squeeze.is-active .hamburger-inner::after {
    bottom: 0;
    transform: rotate(-90deg);
    transition: bottom 0.075s ease, transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1); }



/* ========================================================================
   Tables
 ========================================================================== */

.toegangtabel { margin: 1.5rem 0 8rem 0;  border-top: 1px solid var(--antraciet); }
.toegangtabel div { display: flex; padding: 1rem 0; align-items: center; border-bottom: 1px solid var(--antraciet); }
.toegangtabel span { font-size: 2rem; font-weight: 500; }
.toegangtabel span.label { width: calc(100% - 17rem); } 
.toegangtabel span.tarief { width: 10rem; text-align: right; } 
.toegangtabel span.prijs { display: inline-block; width: 5.6rem; text-align: right; } 

@media screen and (max-width: 750px) {
	.toegangtabel { margin: 1.5rem 0 0 0; }
	.toegangtabel span { font-size: 1.8rem; font-weight: 500; }
	.toegangtabel span.label { width: calc(100% - 10rem); } 
}



table { width: 100% !important; max-width: 100% !important; }
table colgroup { display: none; }

table.faux13 tr { display: grid; grid-template-columns: 1fr 3fr; gap: 24px; }
table.faux11 tr { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
table.faux21 tr { display: grid; grid-template-columns: 2fr 1fr; gap: 24px; }

table.faux13 td, table.faux11 td, table.faux21 td { vertical-align: top; }

@media screen and (max-width: 1200px) {
	table.faux13 tr { grid-template-columns: 1fr 2fr; }
}
@media screen and (max-width: 170px) {
	table.faux13 tr, table.faux21 tr  { grid-template-columns: 1fr 1fr; }
}

/* ========================================================================
   Home
 ========================================================================== */
 


#home_hero { position: relative; width: 100vw; height: calc(100svh - 108px); background: transparent; }
#tagline { position: absolute; bottom: 3.2rem; color: #fff; } 
#tagline h1 { color: #fff; font-size: 9rem; line-height: 9rem; } 


@media screen and (max-width: 1400px) {
	#home_hero { height: calc(100svh - 138px);  }
}
@media screen and (max-width: 1200px) {
	#tagline h1 { font-size: 7rem; line-height: 7rem; } 
}
@media screen and (max-width: 1023px) {
	#home_hero { height: calc(100svh - 70px);  }
	#tagline h1 { font-size: 5rem; line-height: 5rem; } 
}
@media screen and (max-width: 750px) {
	.fixed_background_home { background: var(--groen) url('../img/home_hero_mobile.jpg') center center no-repeat; background-size: cover; }
	#tagline { position: absolute; bottom: 0;  } 
	#tagline h1 { font-size: 4rem; line-height: 4rem; } 
}



#home_locaties h1, #home_locaties p { color: #fff;  }
.locatie_intro p { margin: 1.5rem 0; }
.locatie_lv a { font-size: 3rem; font-weight: 500; line-height: 4rem; color: var(--geel); text-decoration: none; }

@media screen and (max-width: 750px) {
	.locatie_intro p { font-size: 1.4rem; line-height: 2.1rem; margin: 1.2rem 0; }
	.locatie_lv a { font-size: 2rem; line-height: 2rem; }
}


.expo_home a { text-decoration: none;  }
.expo_home_img { width: 100%; aspect-ratio: 1/1; overflow: hidden; }
.expo_home_img img { transition: all .5s; }
.expo_home:hover img { transform: scale(1.04); }
.expo_home_cap { font-size: 1.6rem; line-height: 2rem; padding-top: 1.7rem;  }
.expo_home_titel { font-size: 2.8rem; font-weight: 500; line-height: 3.6rem; padding-top: .2rem; }
.expo_home_lv { font-size: 1.6rem; line-height: 1.6rem; color: var(--tekstoranje); padding-top: .8rem;  }
.home_nutezien_lv a { font-size: 3rem; line-height: 4rem; font-weight: 500; color: var(--tekstoranje); text-decoration: none;  }
@media screen and (max-width: 750px) {
	.expo_home_cap { font-size: 1.4rem; line-height: 2.1rem;  }
	.expo_home_titel { font-size: 2rem; line-height: 2.5rem; padding-top: .2rem; }
	.expo_home_lv { font-size: 1.2rem; line-height: 2.2rem; padding-top: 0;  }
	.home_nutezien_lv a { display: inline-block; font-size: 2rem; line-height: 2rem; margin-top: 6rem;  }
}



#home_agenda h1, #home_agenda p { color: #fff;  }
.agenda_home { display: grid; grid-template-columns: repeat(2, 1fr); column-gap: 20px; }
.agenda_home_cap { font-size: 1.6rem; line-height: 2rem; color: #fff; }
.agenda_home_titel { font-family: Affairs, serif; font-weight: 400; font-size: 3.6rem; line-height: 3rem; color: #fff; padding: 1rem 0; }
.agenda_home_lv a { font-size: 1.9rem; line-height: 3rem; color: var(--geel); text-decoration: none;  }
.home_agenda_lv a { font-size: 3rem; font-weight: 500; line-height: 4rem; color: var(--geel); text-decoration: none; }
@media screen and (max-width: 1200px) {
	.agenda_home { display: block; width: 100%; padding-bottom: 4.8rem; }
	.agenda_home_img { width: 100%; aspect-ratio: 1.3/1; overflow: hidden; }
	.agenda_home_cap { font-size: 1.4rem; line-height: 2.1rem; padding-top: .8rem;  }
	.agenda_home_titel { font-size: 2.2rem; line-height: 2.6rem; padding-top: 0; }
	.agenda_home_lv a { font-size: 1.2rem; line-height: 1rem; padding-top: 0;  }
	.home_agenda_lv a { display: inline-block; font-size: 2rem; line-height: 2rem; margin-top: 1.2rem;  }
}
@media screen and (max-width: 750px) {
	.agenda_home { display: block; width: 100%; padding-bottom: 4.8rem; }
	.agenda_home_img { width: 100%; aspect-ratio: 1/1; overflow: hidden; }
	.agenda_home_cap { font-size: 1.4rem; line-height: 2.1rem; padding-top: .8rem;  }
	.agenda_home_titel { font-size: 2rem; line-height: 2.6rem; padding-top: 0; }
	.agenda_home_lv a { font-size: 1.2rem; line-height: 1rem; padding-top: 0;  }
	.home_agenda_lv a { display: inline-block; font-size: 2rem; line-height: 2rem; margin-top: 1.2rem;  }
}

.nieuws_home { border-top: 1px solid #000;  padding-top: 2.8rem; margin-bottom: 2.1rem; }
.nieuws_home_cap { font-size: 1.6rem; line-height: 2rem; }
.nieuws_home_titel { font-family: Affairs, serif; font-weight: 400; font-size: 3.6rem; line-height: 3.8rem; padding: 1rem 0 2rem 0; }
.nieuws_home_intro p { margin-bottom: 2rem; }
.nieuws_home_lv a { font-size: 1.9rem; line-height: 1rem; color: var(--tekstoranje); text-decoration: none;  }
.home_nieuws_lv { margin-top: 5rem; }
.home_nieuws_lv a { font-size: 3rem; font-weight: 500; line-height: 4rem; color: var(--tekstoranje); text-decoration: none; }
@media screen and (max-width: 750px) {
	.nieuws_home { padding-top: 2rem; padding-bottom: 1rem; }
	.nieuws_home_cap { font-size: 1.4rem; line-height: 2.1rem;  }
	.nieuws_home_titel { font-size: 2.2rem; line-height: 2.6rem; padding-top: 0; }
	.nieuws_home_intro p { font-size: 1.4rem; line-height: 2.1rem; margin-bottom: .4rem; }
	.nieuws_home_lv a { font-size: 1.2rem; line-height: 2.2rem; padding-top: 0;  }
	.home_nieuws_lv { margin-top: 2rem; }
	.home_nieuws_lv a { display: inline-block; font-size: 2rem; line-height: 2rem; margin-top: 0;  }
}



/* ========================================================================
   Expositions
 ========================================================================== */


.span-1-4 .expotegel, .span-5-8 .expotegel { margin-bottom: 6rem; }
.expotegel { width: 100%; }
.expotegel_img { width: 100%; aspect-ratio: 716 / 530; overflow: hidden; }
.expotegel_img img { transition: all .3s; }
.expotegel:hover img { transform: scale(1.04); }
.expotegel a { text-decoration: none; }
.expotegel_cap { font-size: 1.9rem; line-height: 2.3rem; font-weight: 500; padding: 1rem 0;  }
.expotegel_titel { font-size: 4.8rem; line-height: 5.8rem; font-weight: 500;padding-bottom: 1.8rem;  }
.expotegel_intro p { margin: 0 0 1rem 0; }
.expotegel_lv { font-size: 3rem; line-height: 4rem; font-weight: 500; color: var(--tekstoranje); text-decoration: none; }

.expo_header { margin: 5.7rem 0 3.2rem 0; }
.expo_header_titel h1 { font-family: Garnett, Arial, sans-serif; font-size: 9.6rem; line-height: 10.8rem; font-weight: 500; margin-bottom: 1.8rem; }
.expo_header_specs { font-size: 3rem; line-height: 3.6rem; font-weight: 500; }

@media screen and (max-width: 1023px) {
	.expo_header_titel h1 { font-size: 5rem; line-height: 5rem;  }
	.expotegel_titel { font-size: 3.2rem; line-height: 3.6rem;  }
	.expotegel_lv { font-size: 2.2rem; line-height: 3rem;  }
}

@media screen and (max-width: 750px) {
	.expo_header { margin: 3rem 0; }
	.expo_header_titel h1 { font-size: 4rem; line-height: 4rem;  }
	.expo_header_specs { font-size: 2.6rem; line-height: 3rem;  }
	.expotegel_titel { font-size: 3.2rem; line-height: 4rem;  }
	.expotegel_lv { font-size: 2rem; line-height: 2.4rem;  }
}

/* ========================================================================
   Activities
 ========================================================================== */

.agendamaand {font-size: 4.8rem; line-height: 5.8rem; color: #fff; height: 8.9rem; }

.agendategel { width: 100%; display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; margin-bottom: 6rem; padding-top: 2.9rem; border-top: 1px solid #fff; }

.agendategel_specsimg { width: 100%; display: grid; grid-template-columns: 2fr 3fr; column-gap: 20px;  }
.agendategel_img { max-width: 90%;  }

.agendategel_specs { font-size: 1.9rem; line-height: 3rem; color: #fff; }
.agendategel_datum { font-size: 3rem; line-height: 3.5rem; }
.agendategel_intro p { margin-bottom: 1rem; }
.agendategel_titel h2 { font-family: Affairs, serif; font-size: 6.4rem; line-height: 7.2rem; margin: -1rem 0 .5rem 0;  }
.agendategel_lv a { font-size: 3rem; line-height: 3.9rem; color: var(--geel); }

.agendategel_info { display: grid; grid-template-rows: 6fr 1fr; row-gap: 0; color: #fff;  }

.agenda_header_titel h1 { margin-bottom: 2.4rem; }
.agenda_header_specs { font-size: 3rem; line-height: 3.6rem; font-weight: 500; color: #fff; }

.agenda_hero_container { display: block; position: relative; width: 100%; aspect-ratio: 1.66 / 1; overflow: hidden; }
.agenda_hero { display: block; position: absolute; width: 100%; }
.agenda_hero img { width: 100%; aspect-ratio: 1.66 / 1; object-fit: cover; }

.agenda_item { margin-top: .5rem; }


@media screen and (max-width: 1199px) {
	.agendategel { grid-template-columns: 3fr 5fr; }
	.agendategel_specsimg { display: block; }
	.agendategel_img { max-width: 300px; margin-top: 3rem; }
	.agendategel_titel h2 { font-size: 5rem; line-height: 5.4rem;  }
	.agendategel_lv a { font-size: 2.4rem; line-height: 2.8rem; }

}

@media screen and (max-width: 750px) {
	.agendategel_specs { font-size: 1.6rem; line-height: 2.5rem; }
	.agendategel_datum { font-size: 2rem; line-height: 2.9rem; }
	.agendategel_img { display: none; }
	.agendategel_titel h2 { font-size: 3rem; line-height: 3rem;  }
	.agenda_header_specs { font-size: 2rem; line-height: 3rem; margin: 3rem 0; }
}

@media screen and (max-width: 499px) {
	.agendategel { display: block; }
	.agendategel_info { margin-top: 3rem;  }

}



/* ========================================================================
   News
 ========================================================================== */

.nieuwsitem { width: 100%; border-top: 1px solid #000; padding-top: 1.6rem; }
.nieuwsitem_cap { font-size: 1.6rem; line-height: 2rem; padding-bottom: 1rem;  }
.nieuwsitem_titel h2 { font-family: Affairs, serif; font-size: 3.6rem; line-height: 4rem;  font-weight: 400; padding-bottom: 2rem; }
.nieuwsitem_intro p { margin-bottom: 1.1rem; }
.nieuwsitem a.lv_dflt { font-size: 1.9rem; }

.nieuws_header_titel h1 { font-family: Affairs, serif; font-size: 5rem; line-height: 5.4rem; padding-top: .5rem;  }



/* ========================================================================
Vacancies
 ========================================================================== */

.vacature_info { display: grid; grid-template-columns: 20rem 1fr; column-gap: 24px; }
.vacature_info div { font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3rem; margin-bottom: 0; }

.vacature_titel h1 { font-family: Affairs, serif; font-size: 5rem; line-height: 5.4rem;  }



/* ========================================================================
Educatie
 ========================================================================== */

.edu_pakket { border-top: 1px solid #000; padding-top: 2rem; font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3rem;  }
.edu_groep { font-size: 1.6rem; line-height: 2rem;  margin-bottom: 1.6rem; }

.edu_trigger { cursor: pointer; }
.edu_trigger span {  font-weight: 500; font-size: 1.9rem; line-height: 3rem; color: var(--tekstoranje); }



.edu_pakket_tekst { max-height: 0px; overflow: hidden !important; transition: max-height .5s; padding-top: 1rem; }
.edu_pakket_tekst_active { max-height: 5000px; }

.edu_pakket_tekst ul { margin: 5px 0 3rem 0; list-style: none; }
.edu_pakket_tekst ul li { font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3rem; margin-left: 20px; }
.edu_pakket_tekst ul li::before { content: '•'; font-weight: 100; margin-left: -22px; padding-right: 15px; }



/* ========================================================================
Verhuur
 ========================================================================== */

.verhuur_pakket { border-top: 1px solid #000; padding-top: 2rem; font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3rem;  }
.verhuur_groep { font-size: 1.6rem; line-height: 2rem;  margin-bottom: 1.6rem; }

.verhuur_trigger { cursor: pointer; }
.verhuur_trigger span {  font-weight: 500; font-size: 1.9rem; line-height: 3rem; color: var(--tekstoranje); }



.verhuur_pakket_tekst { max-height: 0px; overflow: hidden !important; transition: max-height .5s; padding-top: 1rem; }
.verhuur_pakket_tekst_active { max-height: 5000px; }

.verhuur_pakket_tekst ul { margin: 5px 0 3rem 0; list-style: none; }
.verhuur_pakket_tekst ul li { font-family: Garnett, Arial, sans-serif; font-weight: 400; font-size: 1.9rem; line-height: 3rem; margin-left: 20px; }
.verhuur_pakket_tekst ul li::before { content: '•'; font-weight: 100; margin-left: -22px; padding-right: 15px; }




/* ========================================================================
  Footer
 ========================================================================== */

footer { z-index: -1; position: fixed; bottom: 0px; width: 100vw; height: auto; background-color: var(--antraciet);   }
footer.indom { z-index: 2; position: relative; }

#footer_info { background-color: var(--oranje); padding: 30px 0; }
#footer_info_specs { position: relative; width: 100%; height: 100%; display: grid; grid-template-rows: calc(50% - 17px) calc(50% - 17px) 34px; row-gap: 0; }

#footer_info_specs_contact { position: relative; width: 100%; display: grid; grid-template-columns: 1fr 2fr; column-gap: 20px; padding-bottom: 24px; }

#footer_info_specs_contact div { display: flex; align-items: flex-end; font-size: 1.6rem; line-height: 2rem; }

#footer_social_media  { display: grid;  grid-template-columns: 2fr 1fr; column-gap: 20px; font-size: 1.6rem; line-height: 2rem; }
#footer_social_media .fsmicons { display: flex; height: 100%; align-items: center; }
#footer_social_media .fsmicons div { margin-right: 26px;  }

#footer_links { padding: 30px 0; background-color: var(--antraciet);   }
#footer_links ul { margin: .4rem 0 0 0; padding: 0; list-style: none; }
#footer_links ul li a { color: #fff; font-size: 1.4rem; line-height: 2.6rem; text-decoration: none; }

@media screen and (max-width: 1023px) {
	footer { position: relative; }
	#footer_info { padding: 14px 14px 6px 14px; }
	#footer_info .span-1-4 { margin-bottom: 3.7rem; }
	#footer_info_specs { display: block; }
	#footer_info_specs_contact, #footer_social_media { grid-template-columns: 1fr 1fr; max-width: 700px;  }
	#footer_info_specs_contact div { font-size: 1.4rem; line-height: 2.1rem; }
	#footer_social_media  { font-size: 1.4rem; line-height: 2.1rem; }
	#footer_social_media div { display: block; }
	#footer_social_media div div { display: inline-block; margin-right: 26px;  }
	#footer_links { padding: 14px 0; }
	#footer_links .phonespan-1-1 { padding: .5rem 0 3rem 14px; }
	#footer_links .phonespan-2-1 { padding: .5rem 0 3rem 0; }
	#footer_links h6 { font-size: 1.8rem; line-height: 2.6rem; }
}


/* ========================================================================
   Snippet: Cookiebar
 ========================================================================== */



#cookiebar { position: fixed; display: none; left: 0; bottom: 0; width: 100%; height: 60px; padding: 8px 12px; background-color: var(--geel); z-index: 10000; font-size: 1rem; display: grid; grid-template-columns: 5fr 1fr 1fr; gap: 20px; box-shadow: 0 4px 8px rgba(0, 0, 0, .4); box-sizing: border-box; }

#cookiebar div { display: flex; align-items: center; }
#cookiebar div.jcc { justify-content: center; }

a.allcookies { display: flex; align-items: center; justify-content: center; width: 90px; height: 30px; font-weight: 600; background-color: #326c69; color: #fff; border-radius: 8px; text-decoration: none; }

#cookieselect { position: fixed; left: 0; bottom: 0px; width: 100%; height: 40px; padding: 8px 12px; background-color: #fff; z-index: 10000; font-size: 1rem; display: grid; grid-template-columns: 1fr 2fr; gap: 20px; box-shadow: 0 4px 8px rgba(0, 0, 0, .4); transition: bottom .5s; box-sizing: border-box; }
#cookieselect.active { bottom: 60px; }
#cookieselect div.jr { text-align: right; }
#cookieselect span { white-space: nowrap; }


@media screen and (max-width: 900px) {
	#cookiebar { height: 90px; }
	#cookieselect { height: 90px; grid-template-columns: 2fr 1fr; }
	#cookieselect.active { bottom: 90px; }
	#cookieselect div.jr { text-align: left; }
	#cookieselect span { display: block; }
}

@media screen and (max-width: 590px) {
	#cookiebar { height: 140px; grid-template-columns: 4fr 1fr; grid-template-rows: 1fr 1fr; grid-row-gap: 0; }
	#cookiebar div:first-of-type { grid-row: 1 / span 2; }
	a.allcookies { margin-top: 18px; }
	#cookieselect { height: 90px; grid-template-columns: 2fr 1fr; }
	#cookieselect.active { bottom: 140px; }
}