@font-face {
  font-family: "Inter Regular";
  src: url("font/Inter-Regular-slnt=0.ttf"); 
  url("font/Inter-Regular-slnt=0.ttf");
  font-display: swap;
}
@font-face {
  font-family: "Inter Light";
  src: url("font/Inter-Light-slnt=0.ttf"); 
  url("font/Inter-Light-slnt=0.ttf");
  font-display: swap;
}
@font-face {
  font-family: "Inter Medium";
  src: url("font/Inter-Medium-slnt=0.ttf"); 
  url("font/Inter-Medium-slnt=0.ttf");
  font-display: swap;
}
@font-face {
  font-family: "Inter Semibold";
  src: url("font/Inter-SemiBold-slnt=0.ttf"); 
  url("font/Inter-SemiBold-slnt=0.ttf");
  font-display: swap;
}


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

html,body { width: 100%; height: 100%;   -webkit-overflow-scrolling: touch; }
body {  margin: 0; padding: 0; background-color: #eee; font-family: "Inter Regular", Arial, sans-serif;   }
html { -webkit-text-size-adjust: 100%;  -ms-text-size-adjust: 100%;  }


#portrait_only { display: none; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background-color: #222; z-index: 1000; color: #777; justify-content: center; align-items: center; }
@media screen and (min-width: 320px) and (max-width: 760px) and (orientation: landscape) {
  #portrait_only { display: flex; }
  #portrait_only.vidshow { display: none; }
}

* {
  box-sizing: border-box;
}

.nodisp { display: none; }

.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 */
}


#container { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 89; overflow-x: hidden; overflow-y: auto; transition: all .3s; scroll-behavior: smooth; }
/* 
#container.menuactive { top: 100%; height: 0; overflow: hidden; }
 */
#container.menuactive { overflow: hidden; }

.screen { position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; background-color: #fff; z-index: 1; overflow: auto; }

.screenFront { z-index: 900; }
.screenComing { z-index: 900; transition: all .3s ease-out; }
.screenGoing { z-index: 500; transition: all .5s ease-out; }


div { outline: 0; border: 0; }

.arrow_right_spot, .arrow_right_white { display: inline-block; width: 8px; height: 14px;  }
.arrow_right_spot::after {   
  content: "";
  position: absolute;
  background-size: 100%;
  width: 8px;
  height: 14px;
}





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


p, li, td { font-size: 1rem; line-height: 1.55; }

tr td { padding: 0 0 0 8px; }
tr td:first-of-type { padding: 0; }

a, a:hover { outline: 0; text-decoration: none; color: #000; }

h1 {   font-family: "Inter Light", Arial, sans-serif; font-size: 2.5rem; line-height: 1.15; margin: 0; }

h2 { font-family: "Inter Light", Arial, sans-serif; font-size: 1.7rem; line-height: 1.15;   margin: 0; }
p + h2, ul + h2, table + h2 { margin-top: 28px; }
h2 + table { margin-top: 10px; }

h3 { font-family: "Inter Medium", Arial, sans-serif; font-size: 1.2rem; margin: 0 0 4px 0; }

h4 { font-size: .85rem; line-height: 1.2; margin: 0;  }


ul { margin: 12px 0 0 16px; padding: 0; }

strong { font-family: "Inter Semibold", Arial, sans-serif; font-weight: normal; }
em { font-style: italic;  }



/* ========================================================================
   Main navigation
 ========================================================================== */

#menu_main { position: absolute; top: -100%; left: 0; width: 100%; height: 100%;  background-color: var(--spot-color); color: var(--diapos-color); z-index: 999; overflow: hidden; transition: all .3s;  }
#menu_main_inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding-top: 50px; overflow: auto; z-index: 1;  }
#menu_main_header { position: absolute; top: 0px; width: 100%; height: 50px; padding-top: 22px; display: flex; align-items: center; background-color: var(--spot-color);  border-bottom: 2px solid rgba(0,0,0, 0.25); z-index: 2; }
#menu_main.active { top: 0; height: 100%; }
#menu_main.active #menu_main_header { position: fixed; }


.menu_main_kop { width: calc(100% - 128px); margin-left: 64px; text-align: center;  } 
.menu_main_kop h4 { font-size: 1rem; } 

.menu_main_trigger { width: 64x; cursor: pointer; padding: 0;   }
.menu_main_trigger button span { margin-left: 4px;  }
 

#menu_main ul { list-style: none; margin: 0; padding: 23px 34px; }
#menu_main ul li { width: 100%; margin: 0 0 15px 0; }
#menu_main ul li.indent { padding-left: 34px; }


#menu_start ul { list-style: none; padding: 0; margin: 20px 0 0 0; }
#menu_start ul li { width: 100%; padding: 0 34px; margin: 0 0 15px 0; }
#menu_main ul li a, #menu_main ul li a:hover, #menu_start ul li a, #menu_start ul li a:hover { display: block; width: 100%; color: var(--diapos-color); font-family: "Inter Medium", Arial, sans-serif; font-size: 1.2rem; }
#menu_main ul li a, #menu_main ul li a:hover { color: var(--diapos-color); }
#menu_start ul li a, #menu_start ul li a:hover { color: var(--home-text-color); }
#menu_main ul li a::after {   
	content: "";
	position: absolute;
	right: 34px; 
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='121' fill='%23ffffff'><path d='M15,0 L70,61 L15,121 L0,106 L40,61 L0,15Z '></path></svg>"); 
	background-size: 100%;
	width: 8px;
	height: 14px;
	margin-top: 6px; 
}
#menu_start ul li a::after {   
	content: "";
	position: absolute;
	right: 34px; 
	background-size: 100%;
	width: 8px;
	height: 14px;
	margin-top: 6px; 
}


.taalkeuze { position: relative; text-align: right; font-size: 1.2rem; padding-right: 34px; }
.taalkeuze a, .taalkeuze a:hover { color: var(--diapos-color); }
.taalkeuze a.active { font-family: "Inter Semibold", Arial, sans-serif; }

#startscreen .taalkeuze { padding: 34px; color: var(--home-text-color); }
#startscreen .taalkeuze a, #startscreen .taalkeuze a:hover { color: var(--home-text-color); }





#topbar { position: fixed; top: 0; left: 0; width: 100%; height: 50px; background-color: #eeeeee; z-index: 900; transition: all .3s;  }
#topbar.hidden { left: 100%; }
#topbar.menuactive { position: absolute; }

#topbar_inner { position: absolute; top: 12px; width: 100%; height: 38px; display: flex; align-items: center;   }

.topbar_homelink { width: 80px; padding-left: 24px;  font-size: .9rem; cursor: pointer; }
.topbar_homelink::before {   
  content: "";
  position: absolute;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='121' fill='%23000000'><path d='M10,0 L70,61 L10,121 L0,111 L50,61 L0,10Z '></path></svg>"); 
  background-size: 100%;
  width: 12px;
  height: 21px;
  margin-left: -17px;
  transform: rotate(180deg);
}
.topbar_title { position: relative; display: block; width: calc(100% - 190px); font-family: "Inter Semibold", Arial, sans-serif; font-size: 1rem; text-align: center; padding: 0; margin: 0 auto; white-space: nowrap; overflow: hidden; 
background: -webkit-linear-gradient(right, rgba(0,0,0,0), rgba(0,0,0,1) 10% );
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.topbar_menutrigger { width: 80px; cursor: pointer;  }
.topbar_menutrigger button { margin-left: 34px;  }

.topbar_menutrigger.filteractive { width: 50px;   }
.topbar_menutrigger.filteractive button { margin-left: 4px;  }


/* ========================================================================
   Filter navigation
 ========================================================================== */

#menu_filters { position: absolute; top: -100%; left: 0; width: 100%; height: 100%;  background-color: rgba(0,0,0,.6); z-index: 998; overflow: hidden; transition: all .3s;  }
#menu_filters.active { top: 0; height: 100%; }
#menu_filters_header { position: absolute; top: 0; left: 0; width: 100%; height: 50px; z-index: 999; }
#menu_filters_inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 50px 30px; overflow: hidden; z-index: 1;  }
#menu_filters_block { position: relative; width: 100%; height: 100%; background-color: #eeeeee; padding: 18px; overflow: auto; }
.menu_filters_kop { display: block; font-family: "Inter Regular", Arial, sans-serif; font-size: 1.4rem; line-height: 1.3; margin-bottom: 24px; }
#menu_filters_but { display: block; width: 100%; padding-top: 24px; margin-bottom: 40px; }

.topbar_filtertrigger { display: none;  width: 40px; height: 30px; cursor: pointer; }
.menu_filters_closer { position: absolute; top: 15px; right: 50px; width: 40px; height: 30px; cursor: pointer; }
#filterpop { display: none; position: absolute; top: 70px; right: 20px; width: 170px; min-height: 120px; padding: 1rem; border-radius: 12px; font-family: "Inter Regular", Arial, sans-serif; color: #fff; font-size: 1.1rem; background-color: var(--spot-color); box-shadow: 2px 2px 8px #888888; z-index: 998; }

#filterpop:before { content: ""; position: absolute; right: 38px; top: -15px; width: 0; height: 0; border-top: none; border-right: 10px solid transparent; border-left: 10px solid transparent; border-bottom: 15px solid var(--spot-color); }

.filterrow { display: flex; font-family: "Inter Regular", Arial, sans-serif; font-size: 1rem; line-height: 1.2; margin-bottom: 14px; align-items: center; }
.filtercheck { width: 22px; height: 22px; background-color: #eee; border: 1px solid #000; cursor: pointer; margin-right: 14px; }
.filtercheckactive { background-color: var(--spot-color);  }
.filternaam { font-family: "Inter Medium", Arial, sans-serif; font-size: 1rem; line-height: 1.2; }


/* ========================================================================
   QR code scanner
 ========================================================================== */


#scanner_container { position: relative; width: 80%; min-height: 220px; margin: 80px 0 0 10%; overflow: hidden; background-color: #d0d0d0; display: none; }

#scannerspinner { position: relative; width: 100%; height: 100%; }


.lds-ring {
  display: inline-block;
  position: absolute;
  width: 80px;
  height: 80px;
  left: 50%;
  margin: -110px 0 0 -40px;
}
.lds-ring div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width: 64px;
  height: 64px;
  margin: 4px;
  border: 4px solid #333;
  border-radius: 50%;
  animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* ========================================================================
   Splash screen
 ========================================================================== */


#splash { z-index: 999; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-color: #c0b7af; overflow: hidden; }
#splash.hidden { display: none; }

#splashlogo { position: absolute; top: 50%; left: 50%; width: 124px; height: 124px; margin: -117px 0 0 -62px; color: #fff;  font-size: 80px; text-align: center; }
#splashlogo span {display: block; width: 100%; font-size: 20px; }
#splashlogo span.loader {display: block; width: 100%; font-size: 50px; margin-top: 40px; }



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

#startscreen { left: 0%; height: 100%; overflow: hidden; background-color: var(--home-color);  }
#startscreen.screenComing { overflow: auto;  }
#startscreen.toLeft { left: -100%; height: 100%; overflow: hidden;  }
#startscreen.screen { padding: 0; }


#header_home { position: relative; width: 100%; height: 220px;  }
#header_home_logo img { width: 100%; height: auto; }

#kop_home { position: relative; display: flex; width: 100%; min-height: 80px; padding: 0 34px; align-items: center; }
#kop_home h1 { font-size: 1.7rem; color: var(--home-text-color); }



#expopanel_home { display: grid; width: 100%; grid-template-columns: 1fr 40px; grid-gap: 0; color: var(--expopanel-text-color); background-color: var(--expopanel-color); }
#expopanel_home > div { display: flex; align-items: center; }
#expopanel_home div div { padding: 10px 14px 10px 34px; }
#expopanel_home p { width: 90%; margin: 0; }
#expopanel_home h3 { font-size: 1.5rem; }



/* ========================================================================
   Museum: Info page & Extra URLs
 ========================================================================== */


#infoscreen { left: 120%; height: 100%; overflow: hidden; background-color: #fff; }
#infoscreen.toCenter { left: 0; overflow: auto;  }
#infoscreen.toLeft { left: -100%; overflow: hidden;  }

#infoscreen_content { padding: 65px 35px 45px 35px; }

#infoscreen_content h2 { font-size: 1.5rem; letter-spacing: -.5px; }

#infoscreen ul { list-style: none; }
#infoscreen ul li { margin-top: 26px; }
#infoscreen ul li:first-of-type { margin-top: 16px; }
#infoscreen ul li::before { content: "\2022"; margin-left: -16px; padding-right: 7px; color: var(--spot-color); }

#infoscreen a {  font-family: "Inter Semibold", Arial, sans-serif; color: var(--spot-color); border-bottom: 1px solid var(--spot-color); }


.extrapanel  { position: relative; margin-top: 10px; width: calc(100% + 70px); margin-left: -35px; background-color: #eee; }
.extrapanel_inner  { padding: 17px 35px; }
.extrapanel_inner h2 { font-family: "Inter Medium", Arial, sans-serif; font-size: 1.3rem; line-height: 1.1; margin-bottom: 12px; }
.extrapanel_inner h6 { font-family: "Inter Light", Arial, sans-serif; margin: 0 0 12px 0; font-size: .7rem;    } 
.extrapanel_inner span { font-family: "Inter Light", Arial, sans-serif; margin: 0 0 6px 0; font-size: .7rem;  color: var(--spot-color);   } 
.extrapanel_inner .tourpanel__link { margin: 0; position: relative; display: flex; align-items: center; font-size: 1.1rem; color: var(--spot-color); cursor: pointer; width: 100%; } 
.extrapanel_inner .tourpanel__link::after {   
	content: "";
	position: absolute;
	right: 0px;
	background-size: 100%;
	width: 8px;
	height: 13px;
	margin-top: 3px;
}

.extrapanel_inner .tourpanel__link-mixed { margin-bottom: 12px; }
.extrapanel_inner .tourpanel__link-index { margin-top: 12px; }
span.indexicon { display: inline-block; width: 20px; height: 20px; border-radius: 10px; margin-right: 6px; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%23ffffff' stroke-width='1'><path d='M5,7 L9,7Z M11,7 L15,7Z M5,10 L9,10Z M11,10 L15,10Z M5,13 L9,13Z M11,13 L15,13Z'></path></svg>");  overflow:hidden; }

/* ========================================================================
   Tours: Overview page
 ========================================================================== */
 
 


#toursscreen { position: relative; left: 120%; height: 100%; overflow: hidden; background-color: #eee; }
#toursscreen.toCenter { left: 0; overflow: auto;  }
#toursscreen.toLeft { left: -100%; overflow: hidden;  }
#toursscreen.screen { padding: 50px 0 0 0; }

#toursscreen_loading { position: absolute; top: 0; width: 100%; height: 100%; display: none; align-items: center; justify-content: center; background-color: #fff; z-index: 2; font-size: .75rem; } 

.tourpanel { position: relative; display: flex; width: 100%; margin-top: 10px; cursor: pointer; background-color: #fff; }
.tourpanel:first-of-type { margin-top: 24px; }
.tourpanel_img { width: 110px; height: 160px; background-color: #ccc; }
.tourpanel_content { width: calc( 100% - 110px); height: 160px; padding: 10px 20px;  }
.tourpanel_titles { position: relative; height: 120px; overflow: hidden;  }
.tourpanel_titles h6 { font-family: "Inter Light", Arial, sans-serif; margin: 0 0 6px 0; font-size: .7rem;    } 
.tourpanel_titles h6 span {color: var(--spot-color);   } 

.tourpanel_content h2, .tourpanel_v2_inner h2 { font-family: "Inter Medium", Arial, sans-serif; font-size: 1.5rem; line-height: 1.1; margin: 0; }
.tourpanel_content h5, .tourpanel_v2_inner h5 { font-family: "Inter Light", Arial, sans-serif; font-size: .9rem; line-height: 1.3; margin: 0; padding: 6px 12px 0 0; color: #868686; }
.tourpanel_content h6 { margin: 0; font-size: .8rem; color: var(--spot-color); } 
.tourpanel_content h6::after {   
	content: "";
	position: absolute;
	background-size: 100%;
	width: 5px;
	height: 9px;
	margin: 4px 0 0 5px; 
}


.tourpanel_v2  { position: relative; margin-top: 10px; padding: 17px 35px; background-color: #fff; }
.tourpanel_v2_inner { position: relative; display: grid; grid-gap: 12px; grid-template-columns: 94px 1fr; grid-template-rows: 1fr auto;  }
.tourpanel_v2_inner .tourpanel_img { width: 94px; height: 120px; }
.tourpanel_v2_inner .tourpanel_titles { width: 100%; height: auto;  }
.tourpanel_v2_inner .tourpanel_links { grid-column: span 2;  }
.tourpanel_v2_inner .tourpanel__link { margin: 0; position: relative; display: flex; align-items: center; font-size: 1.1rem; color: var(--spot-color); cursor: pointer; width: 100%; } 
.tourpanel_v2_inner .tourpanel__link::after {   
	content: "";
	position: absolute;
	right: 0px;
	background-size: 100%;
	width: 8px;
	height: 13px;
	margin-top: 3px;
}
span.fulltouricon { display: inline-block; width: 20px; height: 20px; border-radius: 10px; margin-right: 6px; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%23ffffff' stroke-width='1'><path d='M4,7 L16,7Z M4,10 L16,10Z M4,13 L16,13Z'></path></svg>");  overflow:hidden; }
.tourpanel_v2_inner .tourpanel__link-mixed { margin-bottom: 12px; }
.tourpanel_v2_inner .tourpanel__link-index { margin-top: 12px; }
span.indexicon { display: inline-block; width: 20px; height: 20px; border-radius: 10px; margin-right: 6px; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%23ffffff' stroke-width='1'><path d='M5,7 L9,7Z M11,7 L15,7Z M5,10 L9,10Z M11,10 L15,10Z M5,13 L9,13Z M11,13 L15,13Z'></path></svg>");  overflow:hidden; }

/* ========================================================================
   Exposition: Theme/room index page
 ========================================================================== */


#exposcreen { left: 120%; height: 100%; overflow: hidden; background-color: #fff; }
#exposcreen.toCenter { left: 0; overflow: auto;  }
#exposcreen.toLeft { left: -100%; overflow: hidden;  }
#exposcreen.screen { padding: 50px 0 0 0; }

#exposcreen_header { position: relative; display: grid; grid-gap: 0; grid-template-columns: 94px 1fr; padding: 20px 35px; }
#exposcreen_content { position: relative; padding: 0 35px 20px 35px; }

#exposcreen_header_img { width: 94px; height: 121px; }
#exposcreen_header_title { padding-left: 12px; }
#exposcreen_header_title h6 { margin: 0 0 6px 0; font-size: .7rem; color: var(--spot-color);   } 

#exposcreen ul { list-style: none; margin: 0;  }
#exposcreen ul li { margin-top: 21px; }
#exposcreen ul li:first-of-type { margin-top: 6px; }

#exposcreen ul li a { display: block; width: 100%; font-family: "Inter Semibold", Arial, sans-serif; font-size: 1.2rem; line-height: 1; margin: 0; padding-right: 20px;  }
#exposcreen ul li a span { display: block; width: 100%; font-family: "Inter Regular", Arial, sans-serif; font-size: .85rem; color: var(--spot-color); margin-bottom: 4px; }

#exposcreen ul li a::after {   
	content: "";
	position: absolute;
	right: 34px; 
	background-size: 100%;
	width: 8px;
	height: 14px;
	margin-top: 6px; 
}

#exposcreen hr { width: 100%; border: 0; height: 1px; background: #333; } 

#exposcreen .audioitem_theme { position: relative; display: block; font-family: "Inter Semibold", Arial, sans-serif; margin-bottom: 2rem; }
#exposcreen .audioitem_theme_room { font-size: 1rem; margin: 6px 0 3px 0; }
#exposcreen .audioitem_theme_title { font-size: 1.9rem; margin-bottom: 6px;  }
#exposcreen .audioitem_theme_link { font-family: "Inter Regular", Arial, sans-serif;font-size: .85rem;  }
#exposcreen .audioitem_works { width: 100%;  display: flex;  flex-direction: row; flex-wrap: wrap;   }

#exposcreen .indexitem_theme { position: relative; display: block; font-family: "Inter Semibold", Arial, sans-serif; margin-bottom: 1.1rem; }
#exposcreen .indexitem_theme_room { font-size: 1rem; margin: 6px 0 3px 0; }
#exposcreen .indexitem_works { width: 100%;  display: flex;  flex-direction: row; flex-wrap: wrap;   }



/* ========================================================================
   Exposition: Theme/room page: Text and works
 ========================================================================== */


#themescreen { left: 120%; height: 100%; overflow: hidden; background-color: #fff; }
#themescreen.toCenter { left: 0; overflow: auto;  }
#themescreen.toLeft { left: -100%; overflow: hidden;  }
#themescreen.screen { padding: 50px 0 0 0; }

#themescreen_hero { position: relative; width: 100%; height: 35%; overflow: hidden; background: #fff; }
#themescreen_hero img { width: 100%; height: auto; }

#themescreen_title { position: relative; padding: 24px 35px 14px 35px; }
#themescreen_title h1 { font-family: "Inter Medium", Arial, sans-serif; font-size: 2.1rem; line-height: 1.1; letter-spacing: -.5px; margin: 0; }
#themescreen_title_target { display: inline-block; position: absolute; margin-top: -80px;  }

#themescreen_content { position: relative; width: 100%; min-height: 265px;  }

#themescreen_text { position: absolute; top: 0; left:0; width: 100%; opacity: 1; display: block; z-index: 2; padding: 0 35px 60px 35px; transition: opacity .3s ease-out;  }
#themescreen_text.hiding { z-index: 1; opacity: 0; }
#themescreen_text.hidden { display: none; }
#themescreen_text.covered { overflow: hidden; }
#themescreen_text.audioscreen { padding: 0 35px 100px 35px; }

#themescreen_text img { width: 100%; height: auto; margin-bottom: 10px; }
#themescreen_text p + img { margin-top: 10px; }

a.audiolink { display: flex; width: 100%; height: 20px; align-items: center; color: var(--spot-color);  }
#exposcreen a.audiolink { align-items: flex-start;   }
span.audioicon { display: inline-block; width: 20px; height: 20px; border-radius: 10px; margin-right: 6px; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox=\"-8 -8 40 40\" fill='%23ffffff' fill-rule='evenodd'><path d='M14.667 0v2.747c3.853 1.146 6.666 4.72 6.666 8.946 0 4.227-2.813 7.787-6.666 8.934v2.76C20 22.173 24 17.4 24 11.693 24 5.987 20 1.213 14.667 0zM18 11.693c0-2.36-1.333-4.386-3.333-5.373v10.707c2-.947 3.333-2.987 3.333-5.334zm-18-4v8h5.333L12 22.36V1.027L5.333 7.693H0z'></path></svg>");  overflow:hidden; }
.dialpad_row span.audioicon { width: 37px; height: 37px;  }
a.audiolink.diapos { color: var(--diapos-color);  }

a.extlink {  color: var(--spot-color); position: relative; display: block; width: 100%; font-family: "Inter Semibold", Arial, sans-serif; font-size: .9rem; margin-bottom: 24px; padding-left: 34px; }
.extlink_vid_icon { position: absolute; top: 0px; left: 0px; width: 30px; height: 30px; }


.next_theme { margin-top: 30px; padding-bottom: 24px; width: 100%; }
a.next_theme_link { display: block; width: 100%; padding-right: 20px; }
.next_theme_room { display: block; width: 100%; font-family: "Inter Regular", Arial, sans-serif; font-size: .85rem; color: var(--spot-color);  }
.next_theme_title { font-family: "Inter Semibold", Arial, sans-serif; font-size: 1.2rem;  }
a.next_theme_link::after {   
	content: "";
	position: absolute;
	right: 34px; 
	background-size: 100%;
	width: 8px;
	height: 14px;
	margin-top: 6px; 
}


#themescreen_works { position: absolute; top: 0; left:0; width: 100%; opacity: 1; display: flex;  flex-direction: row; flex-wrap: wrap; z-index: 2; padding: 18px 35px 60px 35px; transition: opacity .3s ease-out;  }
#themescreen_works.hiding { z-index: 1; opacity: 0; }
#themescreen_works.hidden { display: none; }
#themescreen_works.covered { overflow: hidden; }

.panel { display: block; width: calc(50% - 8px); margin-bottom: 27px; cursor: pointer; }
.panel:nth-of-type(even) { margin-left: 16px; }
.panel_thumb { display: block; min-width: 142px; height: 156px;  }
.panel_thumb_container { position: relative; width: 100%; height: 146px; }
.panel_thumb_container img { width: auto; max-width: 100%; height: auto; max-height: 100%; }
.panel_thumb_audio_icon, .panel_thumb_video_icon { position: absolute; top: 4px; left: 4px; width: 20px; height: 20px; border-radius: 10px; }
.panel_thumb_video_icon_ml { left: 28px; }
.panel_nr { font-family: "Inter Medium", Arial, sans-serif; font-size: 1.7rem; line-height: 1; margin: 0; color: var(--spot-color); }
.panel_nr:first-of-type { margin-top: 6px; }
.panel_info { display: block; width: 100%; padding-top: 8px; font-size: .85rem; line-height: 1.3; }
.panel_nr + .panel_info { padding-top: 4px; }
.panel_info span { color: var(--spot-color); }



#themescreen_subnav, #themescreen_audiotour  { z-index: 3; position: absolute; display: flex; bottom: 0px; left: 0%; width: 100%; height: 60px; background-color: #e8e8e8; transition: all .3s;  }
#themescreen.toCenter #themescreen_subnav, #themescreen.toCenter #themescreen_audiotour { position: fixed;  bottom: 0px; left: 0; } 
#themescreen.toLeft #themescreen_subnav, #themescreen.toLeft #themescreen_audiotour { left: -100%; } 
#themescreen.toCenter #themescreen_subnav.menuactive { position: absolute; bottom: 0px; }
.themescreen_subnav_but { display: flex; width: 50%; height: 60px; justify-content: center; align-items: center; font-size: 1.05rem; color: #848484; }
a.themescreen_subnav_but_active { color: var(--diapos-color); background-color: var(--spot-color); }
a.themescreen_subnav_but_dimmed span { display: none; }

#themescreen_subnav_text::before {   
	content: "";
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='70' stroke='%23848484' stroke-width='8'><path d='M0,4 L70,4Z M0,22 L50,22Z M0,40 L70,40Z M0,58 L50,58Z'></path></svg>"); 
	background-size: 100%;
	width: 16px;
	height: 16px;
	margin-right: 6px; 
}
#themescreen_subnav_text.themescreen_subnav_but_active::before {   
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='70' fill='none' stroke='%23ffffff' stroke-width='8'><path d='M0,4 L70,4Z M0,22 L50,22Z M0,40 L70,40Z M0,58 L50,58Z'></path></svg>"); 
}
#themescreen_subnav_text.themescreen_subnav_but_dimmed::before {   
	background-image: none; 
}
#themescreen_subnav_works::before {   
	content: "";
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='48' fill='none' stroke='%23848484' stroke-width='4'><path d='M2,2 L68,2 L68,46 L2,46Z M10,10 L60,10 L60,38 L10,38Z'></path></svg>"); 
	background-size: 100%;
	width: 22px;
	height: 15px;
	margin-right: 6px; 
}
#themescreen_subnav_works.themescreen_subnav_but_active::before {   
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='48' fill='none' stroke='%23ffffff' stroke-width='4'><path d='M2,2 L68,2 L68,46 L2,46Z M10,10 L60,10 L60,38 L10,38Z'></path></svg>"); 
}
#themescreen_subnav_works.themescreen_subnav_but_dimmed::before {   
	background-image: none; 
}


#themescreen_audiotour  { z-index: 4; height: 92px; display: none; }
#themescreen_audiotour audio  { width: 100%;  }



/* ========================================================================
   Exposition: Work details page
 ========================================================================== */


#itemscreen { z-index: 990; position: fixed; top: 100%; left: 0; height: 0px; overflow: hidden; background-color: #3c3c3c; color: #fff; transition: all .3s ease-out;  }
#itemscreen.toCenter { position: fixed; top: 0; height: 100%; overflow: auto;  }
#itemscreen.screen { padding: 50px 35px; }
#itemscreen.covered { overflow: hidden; }

#itemscreen a.extlink {  color: var(--diapos-color); }


#item_topbar { position: absolute; top: 0; left: 0; display: flex; align-items: center; width: 100%; height: 50px; padding-top: 22px; background-color: #3c3c3c; border-bottom: 1px solid #707070; z-index: 2;  }
#item_topbar.active { position: fixed; }

.item_topbar_trigger { display: flex; width: 40px; cursor: pointer; padding: 4px 0 0 10px; text-align: left;   }
.item_topbar_trigger button span { margin-right: 4px;  }

.item_topbar_kop { display: flex; width: calc(100% - 80px); margin-left: 40px;  } 
.item_topbar_kop h4 { font-size: 1rem; width: calc(100% - 80px); text-align: center;  } 

#item_contents { width: 100%; margin-top: 20px;  padding-bottom: 40px; }

#item_caption { width: 100%; line-height: 1.3; }
#item_caption.numbered { display: grid; grid-gap: 20px; grid-template-columns: auto 1fr; }
.item_nr { font-family: "Inter Medium", Arial, sans-serif; font-size: 1.7rem; }


#item_img { width: 100%; margin: 47px 0 16px 0; max-height: 2000px;  }
#item_img.hidden { display: none; }



.item_credits { display: block; font-size: .85rem; line-height: 1.2; color: #bcbcbc; }
.item_credits_top { margin-bottom: 16px; }
.item_credits_bot { margin: 16px 0 32px 0; }

#item_text a, #item_text a:hover { color: #fff; text-decoration: underline; }

#item_text img { width: 100%; height: auto; margin-bottom: 10px; }
#item_text p + img { margin-top: 10px; }


#item_offline { position:relative; display: none; }


#item_botbar { position: absolute; bottom: 0px; left: 1px; display: flex; width: calc(100% - 2px); height: 60px; background-color: #3c3c3c; border: 1px solid #707070; z-index: 2;  }
#itemscreen.toCenter #item_botbar { position: fixed; }
#item_botbar_prev, #item_botbar_next {  display: flex; width: 50%; height: 60px; align-items: center; justify-content: center; cursor: pointer;  }
#item_botbar_prev { border-right:  1px solid #707070; }


.feature { display: block; margin-bottom: 24px; }
.feature_titel { font-size: 1.3rem; line-height: 1.5; }
.feature_cap { font-size: .9rem; }

.feature_img img { width: 100%; margin: 12px 0 16px 0; max-height: 2000px;  }
.feature_img_caption { font-size: .8rem; line-height: 1.2; margin-bottom: 16px; }



/* ========================================================================
   Dialpad
 ========================================================================== */
 
body.dialpadactive #themescreen_text, body.dialpadactive #themescreen_works { padding-bottom: 160px; }
body.dialpadactive #exposcreen_content { padding-bottom: 210px; }


#dialpad_trigger { display: none; position: fixed; bottom: 100px; right: 25px; z-index: 988; width:84px; height: 84px; border-radius: 50%; background-color:  var(--spot-color); cursor: pointer; box-shadow: rgba(149, 157, 165, 0.4) 0px 8px 24px; padding-top: 12px; text-align: center; }
.dialpad_inner { display: block; width: 100%; }
.dialpad_row { line-height: 1;   }
.dialpad_row span { font-size: .85rem; color: #fff; }
.dialpad_inner_numbers .dialpad_row span { padding: 0 4px; }


#dialpadscreen { z-index: 989;  position: fixed; top: 100%; left: 0; height: 0px; overflow: hidden; background-color: #fff; transition: all .3s ease-out; border-radius: 25px 25px 0px 0px;  }
#dialpadscreen.toCenter { position: fixed; top: 110px; height: 100%; overflow: auto; box-shadow: rgba(0, 0, 0, .2) 0px -6px 12px;   }
#dialpadscreen.screen { padding: 25px 35px; }
#dialpad_annul { color:  var(--spot-color); font-size: .9rem; }
#dialpad_title { display: block; width: 100%; margin-top: 10px; font-family: "Inter Medium", Arial, sans-serif; font-size: 2.1rem; line-height: 1.1; letter-spacing: -.5px; }
#dialpad_fout { position: absolute; display: none; width: 100%; left: 0px; top: 120px; font-family: "Inter Medium", Arial, sans-serif; font-size: .9rem; line-height: 1.1; color:  #bbb; text-align: center; }
#dialpad_prep, #dialpad_display { position: absolute; width: 100%; left: 0px; top: 112px; font-family: "Inter Medium", Arial, sans-serif; font-size: 2.1rem; line-height: 1.1; letter-spacing: -.5px; color:  var(--spot-color); text-align: center; }
#dialpad_display { display: none; }
#dialpad_audioicon span.audioicon { position: absolute; left: 50%; margin-left: -55px; top: 112px; width: 37px; height: 37px;  }
#dialpad_numbers { position: absolute; display: block; left:50%; top: 170px; width: 270px;   margin-left: -135px;}
.dialpad_numberrow { display: flex; }
.dialpad_numberrow div, .dialpad_numberrow a { display: flex; width: 80px; height: 80px; margin-bottom: 10px; margin-right: 15px; justify-content: center; align-items: center; }
.dialpad_numberrow .dpnumber { border-radius: 50%; background-color: #ededed; font-size: 2.1rem; }
.dialpad_numberrow .dplast { margin-right: 0; }
.dialpad_numberrow .dialpadzoek { border-radius: 50%; font-size: 1.4rem; color: #fff;  background-color: var(--spot-color); }
.dialpad_numberrow .dialpadzoekinactive { color: #ededed; background-color: #fff; }
#dialpadbackspace span { display: block; width: 100%; height: 100%; }



/* ========================================================================
   Exposition: Audio files
 ========================================================================== */


#audioscreen { z-index: 991; position: fixed; top: 100%; left: 0; height: 0px; overflow: hidden; background-color: #eaeaea; color: #000; transition: all .3s ease-out;  }
#audioscreen.toCenter { position: fixed; top: 0; height: 100%; overflow: auto;  }
#audioscreen.screen { padding: 50px 35px; }

#audio_topbar { position: absolute; top: 0; left: 0; display: flex; align-items: center; width: 100%; height: 50px; padding-top: 22px; background-color: #eaeaea; border-bottom: 1px solid #707070; z-index: 2;  }
#audio_topbar.active { position: fixed; }

.audio_topbar_trigger { display: flex; width: 40px; cursor: pointer; padding: 4px 0 0 10px; text-align: left;   }
.audio_topbar_trigger button span { margin-right: 4px;  }

.audio_topbar_kop { display: flex; width: calc(100% - 80px);  } 
.audio_topbar_kop h4 { font-size: 1rem; width: 100%; text-align: center;  } 

#audio_contents { position: relative; width: 100%; margin-top: 20px;  padding-bottom: 40px; }

#audio_title { font-family: "Inter Medium", Arial, sans-serif; font-size: 1.6rem; line-height: 1.1; letter-spacing: -.5px; margin: 0; height: 176px; }

#audio_playpause { position: relative; display: block; width: 70px; height: 70px;  margin: 0px auto; }
#audio_play { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; cursor: pointer; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='70' fill='%23ffffff' stroke='none'><path d='M25,20 L50,35 L25,50Z'></path></svg>"); }
#audio_pause { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; cursor: pointer; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='70' fill='%23ffffff' stroke='none'><path d='M25,20 L33,20 L33,50 L25,50Z M38,20 L46,20 L46,50 L38,50Z'></path></svg>"); }





#audio_contents input[type=range] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding: 0;
  width: 100%;
  height: 22px;
  cursor: pointer;
  display: block;
}
#audio_contents input[type=range]:focus {
  outline: none;
}
#audio_contents input[type=range][disabled] {
  opacity: 0.3;
  cursor: default;
}

#audio_contents input::-webkit-slider-runnable-track {
  box-sizing: border-box;
  width: 100%;
  height: 4px;
  background: #fff;
  border-radius: 100px;
  margin: 11px 0;
}
#audio_contents input::-moz-range-track {
  box-sizing: border-box;
  width: 100%;
  height: 4px;
  background: #fff;
  border-radius: 100px;
  margin: 11px 0;
}
#audio_contents input::-ms-track {
  box-sizing: border-box;
  width: 100%;
  height: 4px;
  background: #fff;
  border-radius: 100px;
  color: transparent;
  padding: 11px 0;
  background: transparent;
  border-color: transparent;
}
#audio_contents input::-ms-fill-lower,
#audio_contents input::-ms-fill-upper {
  box-sizing: border-box;
  width: 100%;
  height: 4px;
  background: #fff;
  border-radius: 100px;
}
#audio_contents input::-ms-fill-lower {
  background: #60cd18;
}

#audio_contents input::-webkit-slider-thumb {
  box-sizing: border-box;
  border: 6px solid var(--spot-color);
  height: 24px;
  width: 24px;
  border-radius: 100px;
  background: var(--spot-color);
  cursor: pointer;
  -webkit-appearance: none;
          appearance: none;
  transform: translateY(-50%);
  margin-top: 2px;
  position: absolute;
  left: 0;
}
#audio_contents input::-moz-range-thumb {
  box-sizing: border-box;
  border: 6px solid var(--spot-color);
  height: 24px;
  width: 24px;
  border-radius: 100px;
  background: var(--spot-color);
  cursor: pointer;
  position: absolute;
  left: 0;
}
#audio_contents input::-ms-thumb {
  box-sizing: border-box;
  border: 6px solid var(--spot-color);
  height: 24px;
  width: 24px;
  border-radius: 100px;
  background: var(--spot-color);
  cursor: pointer;
  position: absolute;
  left: 0;
}



#audio_scrubbar_bubble {
  background: var(--spot-color);
  color: white;
  font-size: 10px;
  width: 40px;
  padding: 4px 0;
  text-align: center;
  position: absolute;
  border-radius: 4px;
  left: 0;
  margin-top: -35px;
  transform: translateX(-50%);
  visibility: hidden;
}
#audio_scrubbar_bubble.dragging { visibility: visible; }
#audio_scrubbar_bubble::after {
    content: '';
    position: absolute;
    left: calc(50% - 2px);
    top: 100%;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid var(--spot-color);
    clear: both;
}




#audio_scrubbar { position: relative; display: block; width: 100%; max-width: 400px; margin: 50px auto 0 auto; height: 24px; }
#audio_scrubbar_track { position: absolute; top: 50%; margin-top: -1px; display: block; width: 100%; height: 2px; background: #fff; }
#audio_scrubbar_track_lapsed { position: absolute; top: 50%; margin-top: -2px; display: block; width: 10px; height: 4px; background-color: var(--spot-color); z-index: 998; }
#audio_scrubbar_scrubber { position: absolute; top: 0; left: 0; display: block; width: 16px; height:16px; border-radius: 8px; background: transparent; z-index: 999; }

#audio_timer { position: relative; display: block; width: 100%; max-width: 400px; margin: 18px auto 0 auto; height: 13px; }
#audio_lapsed, #audio_duration { position: absolute; top: 0; font-size: .75rem; color: #939393; }
#audio_lapsed { left: 0; }
#audio_duration { right: 0; }


#audio_contents {
  display: block;
  position: relative;
  width: 100%;
  max-width: 400px;
  margin: 40px auto;
}
#audio_contents input[type=range] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  padding: 0;
  width: 100%;
  height: 44px;
  cursor: pointer;
  display: block;
  margin-top: 60px;
  background-color: #eaeaea;
}
#audio_contents input[type=range]:focus {
  outline: none;
}
#audio_contents input[type=range][disabled] {
  opacity: 0.3;
  cursor: default;
}


#audio_contents input::-webkit-slider-runnable-track {
  box-sizing: border-box;
  width: 100%;
  height: 2px;
  background: #a6a6a6;
  border-radius: 100px;
  margin: 22px 0;
}
#audio_contents input::-moz-range-track {
  box-sizing: border-box;
  width: 100%;
  height: 2px;
  background: #a6a6a6;
  border-radius: 100px;
  margin: 22px 0;
}
#audio_contents input::-ms-track {
  box-sizing: border-box;
  width: 100%;
  height: 2px;
  background: #a6a6a6;
  border-radius: 100px;
  color: transparent;
  padding: 22px 0;
  background: transparent;
  border-color: transparent;
}
#audio_contents input::-ms-fill-lower,
#audio_contents input::-ms-fill-upper {
  box-sizing: border-box;
  width: 100%;
  height: 2px;
  background: #a6a6a6;
  border-radius: 100px;
}
#audio_contents input::-ms-fill-lower {
  background: #60cd18;
}
#audio_contents #audio_contentsslider-fill-lower {
  background-color: #60cd18;
  border-radius: 100px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: 4px;
  will-change: width;
}
#audio_contents input::-webkit-slider-thumb {
  box-sizing: border-box;
  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.5);
  border: 6px solid #fff;
  height: 44px;
  width: 44px;
  border-radius: 100px;
  background: var(--spot-color);
  cursor: pointer;
  -webkit-appearance: none;
          appearance: none;
  transform: translateY(-50%);
  margin-top: 2px;
  position: relative;
}
#audio_contents input::-moz-range-thumb {
  box-sizing: border-box;
  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.5);
  border: 6px solid #fff;
  height: 44px;
  width: 44px;
  border-radius: 100px;
  background: var(--spot-color);
  cursor: pointer;
  position: relative;
}
#audio_contents input::-ms-thumb {
  box-sizing: border-box;
  box-shadow: 0px 4px 25px rgba(0, 0, 0, 0.5);
  border: 6px solid #fff;
  height: 44px;
  width: 44px;
  border-radius: 100px;
  background: var(--spot-color);
  cursor: pointer;
  position: relative;
}


#audio_timer {
	margin-top: 24px;
}



#audio_volume { position: relative; display: block; width: 234px; height: 30px; margin: 45px auto; }
#audio_volume_mute, #audio_volume_slider, #audio_volume_full { position: absolute; top: 0; }
#audio_volume_mute { width: 20px; height: 24px; top: 3px; left: 8px; }
#audio_volume_slider { width: 176px; left: 28px; }
#audio_volume_full { width: 30px; height: 24px; top: 3px; left: 214px; }

#audio_volume_track { position: absolute; top: 14px; left: 0; height: 2px; width: 176px; background: #fff; }
#audio_volume_handle { position: absolute; left: 80px; width: 16px; height: 30px; cursor: grab; border-radius: 8px; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='30' fill='none' stroke='%23ffffff' stroke-width='1'><path d='M4,12 L12,12Z M4,15 L12,15Z M4,18 L12,18Z'></path></svg>");  }



#audio_botbar { position: absolute; bottom: 0px; left: 1px; display: flex; width: calc(100% - 2px); height: 42px; background-color: #eaeaea; border: 1px solid #707070; z-index: 2;  }
#audioscreen.toCenter #audio_botbar { position: fixed; }
#audio_botbar_prev, #audio_botbar_next {  display: flex; width: 50%; height: 42px; align-items: center; justify-content: center; cursor: pointer;  }
#audio_botbar_prev { border-right:  1px solid #707070; }



#audiotour_contents { display: grid; width:calc(100% - 70px); margin-left: 35px; grid-template-columns: 56px 1fr; grid-gap: 20px; }

#audiotour_playpause { position: relative; display: block; margin-top: 20px; width: 56px; height: 56px; }
#audiotour_play { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; cursor: pointer; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='56' height='56' fill='%23ffffff' stroke='none'><path d='M18,13 L43,28 L18,43Z'></path></svg>"); }
#audiotour_pause { display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 50%; cursor: pointer; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='56' height='56' fill='%23ffffff' stroke='none'><path d='M18,13 L26,13 L26,43 L18,43Z M31,13 L39,13 L39,43 L31,43Z'></path></svg>"); }

#audiotour_scrubbar { position: relative; display: block; width: 100%; max-width: 400px; margin: 20px auto 0 auto; height: 15px; }
#audiotour_scrubbar_track { position: absolute; top: 50%; margin-top: -1px; display: block; width: 100%; height: 2px; background: #fff; }
#audiotour_scrubbar_track_lapsed { position: absolute; top: 50%; margin-top: -1px; display: block; width: 0px; height: 2px; background-color: var(--spot-color); transition: width .6s; }
#audiotour_scrubbar_scrubber { position: absolute; top: 0; left: 0; display: block; width: 2px; height:15px; background-color: var(--spot-color); transition: left .6s; }

#audiotour_timer { position: relative; display: block; width: 100%; max-width: 400px; margin: 7px auto 0 auto;  }
#audiotour_lapsed, #audiotour_duration { position: absolute; top: 0; font-size: .75rem; color: #939393; }
#audiotour_lapsed { left: 0; }
#audiotour_duration { right: 0; }
#audiotour_min10, #audiotour_plus10 { position: absolute; display: none; width: 50px; height: 20px; top: 20px; font-size: .75rem; color: #939393;  }
#audiotour_min10 { left: 0; }
#audiotour_plus10 { right: 0; text-align: right; }


#audiotour_volume { position: relative; display: block; width: 234px; height: 30px; margin: 45px auto; }
#audiotour_volume_mute, #audiotour_volume_slider, #audiotour_volume_full { position: absolute; top: 0; }
#audiotour_volume_mute { width: 20px; height: 24px; top: 3px; left: 8px; }
#audiotour_volume_slider { width: 176px; left: 28px; }
#audiotour_volume_full { width: 30px; height: 24px; top: 3px; left: 214px; }

#audiotour_volume_track { position: absolute; top: 14px; left: 0; height: 2px; width: 176px; background: #fff; }
#audiotour_volume_handle { position: absolute; left: 80px; width: 16px; height: 30px; cursor: grab; border-radius: 8px; background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='30' fill='none' stroke='%23ffffff' stroke-width='1'><path d='M4,12 L12,12Z M4,15 L12,15Z M4,18 L12,18Z'></path></svg>");  }



/* ========================================================================
   Exposition: Video files
 ========================================================================== */

#vidlink_disp { width: 100%;  margin: 8px 0 24px -8px; }
#vidlink_still { width: 100%; min-height: 200px;  }
#vidlink_play { width: 100%;  min-height: 40px; padding: 10px 12px; color: #fff; background-color: var(--spot-color); cursor: pointer; }
#vidlink_play a { display: flex; align-items: center;  color: #fff; }
#vidlink_play .vidplayicon { display: inline-block; width: 32px; height: 32px; border-radius: 50%;  overflow: hidden; background-color: #fff;  }
#vidlink_play .vidplaystr { display: inline-block; width: calc(100% - 32px); padding-left: 10px; font-size: .9rem; }

#videoscreen { z-index: 991; position: fixed; top: 100%; left: 0; height: 0px; overflow: hidden; background-color: #eaeaea; color: #000; transition: all .3s ease-out;  }
#videoscreen.toCenter { position: fixed; top: 0; height: 100%; overflow: auto;  }
#videoscreen.screen { padding: 0; width: 100%; height: 100%; display: flex; align-items: center;  }

#video_topbar { position: absolute; top: 0; left: 0; display: flex; align-items: center; width: 100%; height: 50px; padding-top: 22px; background-color: #eaeaea; border-bottom: 1px solid #707070; z-index: 2;  }
#video_topbar.active { position: fixed; }

.video_topbar_trigger { display: flex; width: 40px; cursor: pointer; padding: 4px 0 0 10px; text-align: left;   }
.video_topbar_trigger button span { margin-right: 4px;  }

.video_topbar_kop { display: flex; width: calc(100% - 80px);  } 
.video_topbar_kop h4 { font-size: 1rem; width: 100%; text-align: center;  } 

#video_contents { position: relative; width: 100%; margin-top: 20px;  padding-bottom: 40px; }

#video_title { font-family: "Inter Medium", Arial, sans-serif; font-size: 2.1rem; line-height: 1.1; letter-spacing: -.5px; margin: 0; height: 176px; }


@media screen and (min-width: 320px) and (max-width: 760px) and (orientation: landscape) {
	#video_topbar { opacity: .6; }
}


@keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}@keyframes plyr-popup{0%{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes plyr-fade-in{from{opacity:0}to{opacity:1}}.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:inherit;font-family:var(--plyr-font-family,inherit);font-variant-numeric:tabular-nums;font-weight:400;font-weight:var(--plyr-font-weight-regular,400);height:100%;line-height:1.7;line-height:var(--plyr-line-height,1.7);max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}.plyr button{font:inherit;line-height:inherit;width:auto}.plyr:focus{outline:0}.plyr--full-ui{box-sizing:border-box}.plyr--full-ui *,.plyr--full-ui ::after,.plyr--full-ui ::before{box-sizing:inherit}.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}.plyr__badge{background:#4a5464;background:var(--plyr-badge-background,#4a5464);border-radius:2px;border-radius:var(--plyr-badge-border-radius,2px);color:#fff;color:var(--plyr-badge-text-color,#fff);font-size:9px;font-size:var(--plyr-font-size-badge,9px);line-height:1;padding:3px 4px}.plyr--full-ui ::-webkit-media-text-track-container{display:none}.plyr__captions{animation:plyr-fade-in .3s ease;bottom:0;display:none;font-size:13px;font-size:var(--plyr-font-size-small,13px);left:0;padding:10px;padding:var(--plyr-control-spacing,10px);position:absolute;text-align:center;transition:transform .4s ease-in-out;width:100%}.plyr__captions span:empty{display:none}@media (min-width:480px){.plyr__captions{font-size:15px;font-size:var(--plyr-font-size-base,15px);padding:calc(10px * 2);padding:calc(var(--plyr-control-spacing,10px) * 2)}}@media (min-width:768px){.plyr__captions{font-size:18px;font-size:var(--plyr-font-size-large,18px)}}.plyr--captions-active .plyr__captions{display:block}.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{transform:translateY(calc(10px * -4));transform:translateY(calc(var(--plyr-control-spacing,10px) * -4))}.plyr__caption{background:rgba(0,0,0,.8);background:var(--plyr-captions-background,rgba(0,0,0,.8));border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:#fff;color:var(--plyr-captions-text-color,#fff);line-height:185%;padding:.2em .5em;white-space:pre-wrap}.plyr__caption div{display:inline}.plyr__control{background:0 0;border:0;border-radius:3px;border-radius:var(--plyr-control-radius,3px);color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:calc(10px * .7);padding:calc(var(--plyr-control-spacing,10px) * .7);position:relative;transition:all .3s ease}.plyr__control svg{display:block;fill:currentColor;height:18px;height:var(--plyr-control-icon-size,18px);pointer-events:none;width:18px;width:var(--plyr-control-icon-size,18px)}.plyr__control:focus{outline:0}.plyr__control.plyr__tab-focus{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}a.plyr__control{text-decoration:none}a.plyr__control::after,a.plyr__control::before{display:none}.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed{display:none}.plyr--full-ui ::-webkit-media-controls{display:none}.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}.plyr__controls .plyr__progress__container{flex:1;min-width:0}.plyr__controls .plyr__controls__item{margin-left:calc(10px / 4);margin-left:calc(var(--plyr-control-spacing,10px)/ 4)}.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:calc(10px / 4);padding-left:calc(var(--plyr-control-spacing,10px)/ 4)}.plyr__controls .plyr__controls__item.plyr__time{padding:0 calc(10px / 2);padding:0 calc(var(--plyr-control-spacing,10px)/ 2)}.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}.plyr__controls:empty{display:none}.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip]{display:none}.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}.plyr__menu{display:flex;position:relative}.plyr__menu .plyr__control svg{transition:transform .3s ease}.plyr__menu .plyr__control[aria-expanded=true] svg{transform:rotate(90deg)}.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}.plyr__menu__container{animation:plyr-popup .2s ease;background:rgba(255,255,255,.9);background:var(--plyr-menu-background,rgba(255,255,255,.9));border-radius:4px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-menu-shadow,0 1px 2px rgba(0,0,0,.15));color:#4a5464;color:var(--plyr-menu-color,#4a5464);font-size:15px;font-size:var(--plyr-font-size-base,15px);margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}.plyr__menu__container::after{border:4px solid transparent;border:var(--plyr-menu-arrow-size,4px) solid transparent;border-top-color:rgba(255,255,255,.9);border-top-color:var(--plyr-menu-background,rgba(255,255,255,.9));content:'';height:0;position:absolute;right:calc(((18px / 2) + calc(10px * .7)) - (4px / 2));right:calc(((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7)) - (var(--plyr-menu-arrow-size,4px)/ 2));top:100%;width:0}.plyr__menu__container [role=menu]{padding:calc(10px * .7);padding:calc(var(--plyr-control-spacing,10px) * .7)}.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}.plyr__menu__container .plyr__control{align-items:center;color:#4a5464;color:var(--plyr-menu-color,#4a5464);display:flex;font-size:13px;font-size:var(--plyr-font-size-menu,var(--plyr-font-size-small,13px));padding-bottom:calc(calc(10px * .7)/ 1.5);padding-bottom:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 1.5);padding-left:calc(calc(10px * .7) * 1.5);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 1.5);padding-right:calc(calc(10px * .7) * 1.5);padding-right:calc(calc(var(--plyr-control-spacing,10px) * .7) * 1.5);padding-top:calc(calc(10px * .7)/ 1.5);padding-top:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 1.5);-webkit-user-select:none;-ms-user-select:none;user-select:none;width:100%}.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}.plyr__menu__container .plyr__control::after{border:4px solid transparent;border:var(--plyr-menu-item-arrow-size,4px) solid transparent;content:'';position:absolute;top:50%;transform:translateY(-50%)}.plyr__menu__container .plyr__control--forward{padding-right:calc(calc(10px * .7) * 4);padding-right:calc(calc(var(--plyr-control-spacing,10px) * .7) * 4)}.plyr__menu__container .plyr__control--forward::after{border-left-color:#728197;border-left-color:var(--plyr-menu-arrow-color,#728197);right:calc((calc(10px * .7) * 1.5) - 4px);right:calc((calc(var(--plyr-control-spacing,10px) * .7) * 1.5) - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--forward.plyr__tab-focus::after,.plyr__menu__container .plyr__control--forward:hover::after{border-left-color:currentColor}.plyr__menu__container .plyr__control--back{font-weight:400;font-weight:var(--plyr-font-weight-regular,400);margin:calc(10px * .7);margin:calc(var(--plyr-control-spacing,10px) * .7);margin-bottom:calc(calc(10px * .7)/ 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 2);padding-left:calc(calc(10px * .7) * 4);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 4);position:relative;width:calc(100% - (calc(10px * .7) * 2));width:calc(100% - (calc(var(--plyr-control-spacing,10px) * .7) * 2))}.plyr__menu__container .plyr__control--back::after{border-right-color:#728197;border-right-color:var(--plyr-menu-arrow-color,#728197);left:calc((calc(10px * .7) * 1.5) - 4px);left:calc((calc(var(--plyr-control-spacing,10px) * .7) * 1.5) - var(--plyr-menu-item-arrow-size,4px))}.plyr__menu__container .plyr__control--back::before{background:#dcdfe5;background:var(--plyr-menu-back-border-color,#dcdfe5);box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 var(--plyr-menu-back-border-shadow-color,#fff);content:'';height:1px;left:0;margin-top:calc(calc(10px * .7)/ 2);margin-top:calc(calc(var(--plyr-control-spacing,10px) * .7)/ 2);overflow:hidden;position:absolute;right:0;top:100%}.plyr__menu__container .plyr__control--back.plyr__tab-focus::after,.plyr__menu__container .plyr__control--back:hover::after{border-right-color:currentColor}.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:calc(10px * .7);padding-left:calc(var(--plyr-control-spacing,10px) * .7)}.plyr__menu__container .plyr__control[role=menuitemradio]::after,.plyr__menu__container .plyr__control[role=menuitemradio]::before{border-radius:100%}.plyr__menu__container .plyr__control[role=menuitemradio]::before{background:rgba(0,0,0,.1);content:'';display:block;flex-shrink:0;height:16px;margin-right:10px;margin-right:var(--plyr-control-spacing,10px);transition:all .3s ease;width:16px}.plyr__menu__container .plyr__control[role=menuitemradio]::after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;transform:translateY(-50%) scale(0);transition:transform .3s ease,opacity .3s ease;width:6px}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::before{background:#00b3ff;background:var(--plyr-control-toggle-checked-background,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)))}.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]::after{opacity:1;transform:translateY(-50%) scale(1)}.plyr__menu__container .plyr__control[role=menuitemradio].plyr__tab-focus::before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover::before{background:rgba(35,40,47,.1)}.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:calc((calc(10px * .7) - 2) * -1);margin-right:calc((calc(var(--plyr-control-spacing,10px) * .7) - 2) * -1);overflow:hidden;padding-left:calc(calc(10px * .7) * 3.5);padding-left:calc(calc(var(--plyr-control-spacing,10px) * .7) * 3.5);pointer-events:none}.plyr--full-ui input[type=range]{-webkit-appearance:none;background:0 0;border:0;border-radius:calc(13px * 2);border-radius:calc(var(--plyr-range-thumb-height,13px) * 2);color:#00b3ff;color:var(--plyr-range-fill-background,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));display:block;height:calc((3px * 2) + 13px);height:calc((var(--plyr-range-thumb-active-shadow-width,3px) * 2) + var(--plyr-range-thumb-height,13px));margin:0;padding:0;transition:box-shadow .3s ease;width:100%}.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none;background-image:linear-gradient(to right,currentColor 0,transparent 0);background-image:linear-gradient(to right,currentColor var(--value,0),transparent var(--value,0))}.plyr--full-ui input[type=range]::-webkit-slider-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px);-webkit-appearance:none;margin-top:calc(((13px - 5px)/ 2) * -1);margin-top:calc(((var(--plyr-range-thumb-height,13px) - var(--plyr-range-track-height,5px))/ 2) * -1)}.plyr--full-ui input[type=range]::-moz-range-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px)}.plyr--full-ui input[type=range]::-ms-track{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;color:transparent}.plyr--full-ui input[type=range]::-ms-fill-upper{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none}.plyr--full-ui input[type=range]::-ms-fill-lower{background:0 0;border:0;border-radius:calc(5px / 2);border-radius:calc(var(--plyr-range-track-height,5px)/ 2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-ms-user-select:none;user-select:none;background:currentColor}.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2));height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-ms-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px);margin-top:0}.plyr--full-ui input[type=range]::-ms-tooltip{display:none}.plyr--full-ui input[type=range]:focus{outline:0}.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}.plyr--full-ui input[type=range].plyr__tab-focus::-webkit-slider-runnable-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr--full-ui input[type=range].plyr__tab-focus::-moz-range-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr--full-ui input[type=range].plyr__tab-focus::-ms-track{outline-color:#00b3ff;outline-color:var(--plyr-tab-focus-color,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));outline-offset:2px;outline-style:dotted;outline-width:3px}.plyr__poster{background-color:#000;background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}.plyr__time{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}.plyr__time+.plyr__time::before{content:'\2044';margin-right:10px;margin-right:var(--plyr-control-spacing,10px)}@media (max-width:calc(768px - 1)){.plyr__time+.plyr__time{display:none}}.plyr__tooltip{background:rgba(255,255,255,.9);background:var(--plyr-tooltip-background,rgba(255,255,255,.9));border-radius:3px;border-radius:var(--plyr-tooltip-radius,3px);bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-tooltip-shadow,0 1px 2px rgba(0,0,0,.15));color:#4a5464;color:var(--plyr-tooltip-color,#4a5464);font-size:13px;font-size:var(--plyr-font-size-small,13px);font-weight:400;font-weight:var(--plyr-font-weight-regular,400);left:50%;line-height:1.3;margin-bottom:calc(calc(10px / 2) * 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px)/ 2) * 2);opacity:0;padding:calc(10px / 2) calc(calc(10px / 2) * 1.5);padding:calc(var(--plyr-control-spacing,10px)/ 2) calc(calc(var(--plyr-control-spacing,10px)/ 2) * 1.5);pointer-events:none;position:absolute;transform:translate(-50%,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;white-space:nowrap;z-index:2}.plyr__tooltip::before{border-left:4px solid transparent;border-left:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-right:4px solid transparent;border-right:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-top:4px solid rgba(255,255,255,.9);border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,rgba(255,255,255,.9));bottom:calc(4px * -1);bottom:calc(var(--plyr-tooltip-arrow-size,4px) * -1);content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr .plyr__control.plyr__tab-focus .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;transform:translate(-50%,0) scale(1)}.plyr .plyr__control:hover .plyr__tooltip{z-index:3}.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;transform:translate(0,10px) scale(.8);transform-origin:0 100%}.plyr__controls>.plyr__control:first-child .plyr__tooltip::before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip::before{left:calc((18px / 2) + calc(10px * .7));left:calc((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7))}.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;transform:translate(0,10px) scale(.8);transform-origin:100% 100%}.plyr__controls>.plyr__control:last-child .plyr__tooltip::before{left:auto;right:calc((18px / 2) + calc(10px * .7));right:calc((var(--plyr-control-icon-size,18px)/ 2) + calc(var(--plyr-control-spacing,10px) * .7));transform:translateX(50%)}.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child.plyr__tab-focus .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{transform:translate(0,0) scale(1)}.plyr__progress{left:calc(13px * .5);left:calc(var(--plyr-range-thumb-height,13px) * .5);margin-right:13px;margin-right:var(--plyr-range-thumb-height,13px);position:relative}.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:calc(13px * -.5);margin-left:calc(var(--plyr-range-thumb-height,13px) * -.5);margin-right:calc(13px * -.5);margin-right:calc(var(--plyr-range-thumb-height,13px) * -.5);width:calc(100% + 13px);width:calc(100% + var(--plyr-range-thumb-height,13px))}.plyr__progress input[type=range]{position:relative;z-index:2}.plyr__progress .plyr__tooltip{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px));left:0}.plyr__progress__buffer{-webkit-appearance:none;background:0 0;border:0;border-radius:100px;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin-top:calc((5px / 2) * -1);margin-top:calc((var(--plyr-range-track-height,5px)/ 2) * -1);padding:0;position:absolute;top:50%}.plyr__progress__buffer::-webkit-progress-bar{background:0 0}.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-webkit-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-moz-transition:width .2s ease;transition:width .2s ease}.plyr__progress__buffer::-ms-fill{border-radius:100px;-ms-transition:width .2s ease;transition:width .2s ease}.plyr--loading .plyr__progress__buffer{animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,rgba(35,40,47,.6) 25%,transparent 25%,transparent 50%,rgba(35,40,47,.6) 50%,rgba(35,40,47,.6) 75%,transparent 75%,transparent);background-image:linear-gradient(-45deg,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 25%,transparent 25%,transparent 50%,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 50%,var(--plyr-progress-loading-background,rgba(35,40,47,.6)) 75%,transparent 75%,transparent);background-repeat:repeat-x;background-size:25px 25px;background-size:var(--plyr-progress-loading-size,25px) var(--plyr-progress-loading-size,25px);color:transparent}.plyr--video.plyr--loading .plyr__progress__buffer{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25))}.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6))}.plyr__volume{align-items:center;display:flex;max-width:110px;min-width:80px;position:relative;width:20%}.plyr__volume input[type=range]{margin-left:calc(10px / 2);margin-left:calc(var(--plyr-control-spacing,10px)/ 2);margin-right:calc(10px / 2);margin-right:calc(var(--plyr-control-spacing,10px)/ 2);position:relative;z-index:2}.plyr--is-ios .plyr__volume{min-width:0;width:auto}.plyr--audio{display:block}.plyr--audio .plyr__controls{background:#fff;background:var(--plyr-audio-controls-background,#fff);border-radius:inherit;color:#4a5464;color:var(--plyr-audio-control-color,#4a5464);padding:10px;padding:var(--plyr-control-spacing,10px)}.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b3ff;background:var(--plyr-audio-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));color:#fff;color:var(--plyr-audio-control-color-hover,#fff)}.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:rgba(193,200,209,.6);background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6)))}.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(35,40,47,.1);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(35,40,47,.1))}.plyr--audio .plyr__progress__buffer{color:rgba(193,200,209,.6);color:var(--plyr-audio-progress-buffered-background,rgba(193,200,209,.6))}.plyr--video{background:#000;overflow:hidden}.plyr--video.plyr--menu-open{overflow:visible}.plyr__video-wrapper{background:#000;height:100%;margin:auto;overflow:hidden;position:relative;width:100%}.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%}.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;left:0;position:absolute;top:0}.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;transform:translateY(-38.28125%)}.plyr--video .plyr__controls{background:linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.75));background:var(--plyr-video-controls-background,linear-gradient(rgba(0,0,0,0),rgba(0,0,0,.75)));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;color:var(--plyr-video-control-color,#fff);left:0;padding:calc(10px / 2);padding:calc(var(--plyr-control-spacing,10px)/ 2);padding-top:calc(10px * 2);padding-top:calc(var(--plyr-control-spacing,10px) * 2);position:absolute;right:0;transition:opacity .4s ease-in-out,transform .4s ease-in-out;z-index:3}@media (min-width:480px){.plyr--video .plyr__controls{padding:10px;padding:var(--plyr-control-spacing,10px);padding-top:calc(10px * 3.5);padding-top:calc(var(--plyr-control-spacing,10px) * 3.5)}}.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;transform:translateY(100%)}.plyr--video .plyr__control.plyr__tab-focus,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b3ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));color:#fff;color:var(--plyr-video-control-color-hover,#fff)}.plyr__control--overlaid{background:#00b3ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b3ff)));border:0;border-radius:100%;color:#fff;color:var(--plyr-video-control-color,#fff);display:none;left:50%;opacity:.9;padding:calc(10px * 1.5);padding:calc(var(--plyr-control-spacing,10px) * 1.5);position:absolute;top:50%;transform:translate(-50%,-50%);transition:.3s;z-index:2}.plyr__control--overlaid svg{left:2px;position:relative}.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{opacity:1}.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:rgba(255,255,255,.25);background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25)))}.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2),0 0 0 3px rgba(255,255,255,.5);box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px rgba(35,40,47,.15),0 0 0 1px rgba(35,40,47,.2)),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,rgba(255,255,255,.5))}.plyr--video .plyr__progress__buffer{color:rgba(255,255,255,.25);color:var(--plyr-video-progress-buffered-background,rgba(255,255,255,.25))}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:fullscreen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}.plyr:fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:-ms-fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-webkit-full-screen video{height:100%}.plyr:-webkit-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-webkit-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-moz-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-moz-full-screen video{height:100%}.plyr:-moz-full-screen .plyr__video-wrapper{height:100%;position:static}.plyr:-moz-full-screen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-moz-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-moz-full-screen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-moz-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr:-ms-fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}.plyr:-ms-fullscreen video{height:100%}.plyr:-ms-fullscreen .plyr__video-wrapper{height:100%;position:static}.plyr:-ms-fullscreen.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen{display:block}.plyr:-ms-fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr:-ms-fullscreen.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr:-ms-fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr--fullscreen-fallback{background:#000;border-radius:0!important;height:100%;margin:0;width:100%;bottom:0;display:block;left:0;position:fixed;right:0;top:0;z-index:10000000}.plyr--fullscreen-fallback video{height:100%}.plyr--fullscreen-fallback .plyr__video-wrapper{height:100%;position:static}.plyr--fullscreen-fallback.plyr--vimeo .plyr__video-wrapper{height:0;position:relative}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}.plyr__ads::after{background:#23282f;border-radius:2px;bottom:10px;bottom:var(--plyr-control-spacing,10px);color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;right:var(--plyr-control-spacing,10px);z-index:3}.plyr__ads::after:empty{display:none}.plyr__cues{background:currentColor;display:block;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin:-var(--plyr-range-track-height,5px)/2 0 0;opacity:.8;position:absolute;top:50%;width:3px;z-index:3}.plyr__preview-thumb{background-color:rgba(255,255,255,.9);background-color:var(--plyr-tooltip-background,rgba(255,255,255,.9));border-radius:3px;bottom:100%;box-shadow:0 1px 2px rgba(0,0,0,.15);box-shadow:var(--plyr-tooltip-shadow,0 1px 2px rgba(0,0,0,.15));margin-bottom:calc(calc(10px / 2) * 2);margin-bottom:calc(calc(var(--plyr-control-spacing,10px)/ 2) * 2);opacity:0;padding:3px;padding:var(--plyr-tooltip-radius,3px);pointer-events:none;position:absolute;transform:translate(0,10px) scale(.8);transform-origin:50% 100%;transition:transform .2s .1s ease,opacity .2s .1s ease;z-index:2}.plyr__preview-thumb--is-shown{opacity:1;transform:translate(0,0) scale(1)}.plyr__preview-thumb::before{border-left:4px solid transparent;border-left:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-right:4px solid transparent;border-right:var(--plyr-tooltip-arrow-size,4px) solid transparent;border-top:4px solid rgba(255,255,255,.9);border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,rgba(255,255,255,.9));bottom:calc(4px * -1);bottom:calc(var(--plyr-tooltip-arrow-size,4px) * -1);content:'';height:0;left:50%;position:absolute;transform:translateX(-50%);width:0;z-index:2}.plyr__preview-thumb__image-container{background:#c1c8d1;border-radius:calc(3px - 1px);border-radius:calc(var(--plyr-tooltip-radius,3px) - 1px);overflow:hidden;position:relative;z-index:0}.plyr__preview-thumb__image-container img{height:100%;left:0;max-height:none;max-width:none;position:absolute;top:0;width:100%}.plyr__preview-thumb__time-container{bottom:6px;left:0;position:absolute;right:0;white-space:nowrap;z-index:3}.plyr__preview-thumb__time-container span{background-color:rgba(0,0,0,.55);border-radius:calc(3px - 1px);border-radius:calc(var(--plyr-tooltip-radius,3px) - 1px);color:#fff;font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px));padding:3px 6px}.plyr__preview-scrubbing{bottom:0;filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}.plyr__preview-scrubbing--is-shown{opacity:1}.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;object-fit:contain;position:absolute;top:0;width:100%}.plyr--no-transition{transition:none!important}.plyr__sr-only{clip:rect(1px,1px,1px,1px);overflow:hidden;border:0!important;height:1px!important;padding:0!important;position:absolute!important;width:1px!important}.plyr [hidden]{display:none!important}


/* ========================================================================
   Forms
 ========================================================================== */

.respform { display: block; width: 100%; margin-to: 24px; }
.respformoffline { background-color: #e0e0e0; padding: 12px; }

.respform label { display: block; width: 100%; font-family: "Inter Regular", Arial, sans-serif; font-size: .85rem; color: var(--spot-color); margin-bottom: 4px; }

input.respfield, input.respfield:focus { display: block; width: 100%; padding: 6px; font-size: .9rem; background-color: #fcfcfc; border-width: 1px; border-color: var(--spot-color); outline: none; }
.respfield.error { border-width: 2px; border-color: #c00; }

.respform textarea { width: 100%; height: 160px; }

#naamdiv, #emaildiv, #reactiediv { display: block; margin-bottom: 1rem; }
#bedankttitel, #bedankttekst { display: none; }

.respform input[type="submit"] { margin: 1rem 0 3rem 0; padding: 12px; border: none; background-color: var(--spot-color); border-radius: 2px; font-family: "Inter Light", Arial, sans-serif; font-size: 1rem; color: #fff; cursor: pointer; }


.reqerror { display: none; width: 100%; font-family: "Inter Regular", Arial, sans-serif; font-size: .85rem; color: #c00;  }
.reqerroractive { display: block;  }

/* ========================================================================
   Buttons
 ========================================================================== */

#ios_install_prompt, #android_back_prompt { display: block; position: absolute; bottom: 5px; left: -120%; width: 98%; margin-left: 1%; z-index: 1001; transition: left .5s; }
#android_back_prompt { z-index: 1002; bottom: 60px;  }
#ios_install_prompt.active, #android_back_prompt.active { left: 0; }
.prompt-message { display: block; width: 100%; padding: 12px; border-radius: 6px; background-color: #f2f8ff; font-size: .8rem; line-height: 1.3; }
.caret-down { display: block; margin: 0px auto; width: 0; height: 0; border-left: 10px solid transparent;border-right: 10px solid transparent; border-top: 10px solid #f2f8ff; }

.ticketbut { display: block; width: 200px; margin: 0px auto; padding: 8px 12px; background-color: var(--spot-color); border: 0; border-radius: 12px; font-family: "Inter Medium", Arial, sans-serif; font-size: 1.2rem; color: var(--diapos-color); cursor: pointer; }


/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */
.hamburger {
  padding: 15px 15px;
  display: flex;
  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: 20px;
    height: 2px;
    background-color: #000;
    border-radius: 2px;
    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: -7px; }
  .hamburger-inner::after {
    bottom: -7px; }

/*
   * Spring
   */
.hamburger--spring .hamburger-inner {
  top: 2px;
  transition: background-color 0s 0.13s linear; }
  .hamburger--spring .hamburger-inner::before {
    top: 10px;
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
  .hamburger--spring .hamburger-inner::after {
    top: 20px;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }

.hamburger--spring.is-active .hamburger-inner {
  transition-delay: 0.22s;
  background-color: transparent !important; }
  .hamburger--spring.is-active .hamburger-inner::before {
    top: 0;
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 10px, 0) rotate(45deg); }
  .hamburger--spring.is-active .hamburger-inner::after {
    top: 0;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 10px, 0) rotate(-45deg); }


#menu_main .hamburger { padding: 0; }
#menu_main .hamburger.is-active .hamburger-inner,
#menu_main .hamburger.is-active .hamburger-inner::before,
#menu_main .hamburger.is-active .hamburger-inner::after {
    background-color: var(--diapos-color); }

#item_topbar .hamburger { padding: 0; }
#item_topbar .hamburger-box { width: 20px; }
#item_topbar .hamburger.is-active .hamburger-inner,
#item_topbar .hamburger.is-active .hamburger-inner::before,
#item_topbar .hamburger.is-active .hamburger-inner::after {
    background-color: #fff; }

#audio_topbar .hamburger { padding: 0; }
#audio_topbar .hamburger-box { width: 20px; }
#audio_topbar .hamburger.is-active .hamburger-inner,
#audio_topbar .hamburger.is-active .hamburger-inner::before,
#audio_topbar .hamburger.is-active .hamburger-inner::after {
    background-color: #000; }

#video_topbar .hamburger { padding: 0; }
#video_topbar .hamburger-box { width: 20px; }
#video_topbar .hamburger.is-active .hamburger-inner,
#video_topbar .hamburger.is-active .hamburger-inner::before,
#video_topbar .hamburger.is-active .hamburger-inner::after {
    background-color: #000; }






/* ========================================================================
   Mejs audioplayer
 ========================================================================== */


/* Accessibility: hide screen reader texts (and prefer "top" for RTL languages).
Reference: http://blog.rrwd.nl/2015/04/04/the-screen-reader-text-class-why-and-how/ */
.mejs__offscreen {
    border: 0;
    clip: rect( 1px, 1px, 1px, 1px );
    -webkit-clip-path: inset( 50% );
            clip-path: inset( 50% );
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal;
}

.mejs__container {
    background: #000;
    box-sizing: border-box;
    font-family: 'Helvetica', Arial, serif;
    position: relative;
    text-align: left;
    text-indent: 0;
    vertical-align: top;
}

.mejs__container * {
    box-sizing: border-box;
}

/* Hide native play button and control bar from iOS to favor plugin button */
.mejs__container video::-webkit-media-controls,
.mejs__container video::-webkit-media-controls-panel,
.mejs__container video::-webkit-media-controls-panel-container,
.mejs__container video::-webkit-media-controls-start-playback-button {
    -webkit-appearance: none;
    display: none !important;
}

.mejs__fill-container,
.mejs__fill-container .mejs__container {
    height: 100%;
    width: 100%;
}

.mejs__fill-container {
    background: transparent;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}

.mejs__container:focus {
    outline: none;
}

.mejs__iframe-overlay {
    height: 100%;
    position: absolute;
    width: 100%;
}

.mejs__embed,
.mejs__embed body {
    background: #000;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%;
}

.mejs__fullscreen {
    overflow: hidden !important;
}

.mejs__container-fullscreen {
    bottom: 0;
    left: 0;
    overflow: hidden;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 1000;
}

.mejs__container-fullscreen .mejs__mediaelement,
.mejs__container-fullscreen video {
    height: 100% !important;
    width: 100% !important;
}

/* Start: LAYERS */
.mejs__background {
    left: 0;
    position: absolute;
    top: 0;
}

.mejs__mediaelement {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}

.mejs__poster {
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 1;
}

:root .mejs__poster-img {
    display: none;
}

.mejs__poster-img {
    border: 0;
    padding: 0;
}

.mejs__overlay {
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
}

.mejs__layer {
    z-index: 1;
}

.mejs__overlay-play {
    cursor: pointer;
}

.mejs__overlay-button {
    background: url('mejs-controls.svg') no-repeat;
    background-position: 0 -39px;
    height: 80px;
    width: 80px;
}

.mejs__overlay:hover > .mejs__overlay-button {
    background-position: -80px -39px;
}

.mejs__overlay-loading {
    height: 80px;
    width: 80px;
}

.mejs__overlay-loading-bg-img {
    -webkit-animation: mejs__loading-spinner 1s linear infinite;
            animation: mejs__loading-spinner 1s linear infinite;
    background: transparent url('mejs-controls.svg') -160px -40px no-repeat;
    display: block;
    height: 80px;
    width: 80px;
    z-index: 1;
}

@-webkit-keyframes mejs__loading-spinner {
    100% {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}

@keyframes mejs__loading-spinner {
    100% {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);
    }
}

/* End: LAYERS */

/* Start: CONTROL BAR */
.mejs__controls {
    bottom: 0;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    left: 0;
    list-style-type: none;
    margin: 0;
    padding: 0 10px;
    position: absolute;
    width: 100%;
    z-index: 3;
}

.mejs__controls:not([style*='display: none']) {
    background: rgba(255, 0, 0, 0.7);
    background: -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.35));
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.35));
}

.mejs__button,
.mejs__time,
.mejs__time-rail {
    font-size: 10px;
    height: 40px;
    line-height: 10px;
    margin: 0;
    width: 32px;
}

.mejs__button > button {
    background: transparent url('mejs-controls.svg');
    border: 0;
    cursor: pointer;
    display: block;
    font-size: 0;
    height: 20px;
    line-height: 0;
    margin: 10px 6px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    text-decoration: none;
    width: 20px;
}

.audioplayer .mejs__button {
    position: relative;
    display: flex; width: 70px; height: 70px;
    align-items: center;
    justify-content: center;
    border-radius: 50%; 
    padding: 30px;
background: var(--spot-color) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='70' height='70' fill='%23ffffff' stroke='none'><path d='M25,20 L50,35 L25,50Z'></path></svg>");
	left: 50%;
    margin-top: -70px;
    margin-left: -40px;
}
.audioplayer .mejs__button > button {
}


/* :focus for accessibility */
.mejs__button > button:focus {
    outline: dotted 1px #999;
}

.mejs__container-keyboard-inactive a,
.mejs__container-keyboard-inactive a:focus,
.mejs__container-keyboard-inactive button,
.mejs__container-keyboard-inactive button:focus,
.mejs__container-keyboard-inactive [role=slider],
.mejs__container-keyboard-inactive [role=slider]:focus {
    outline: 0;
}

/* End: CONTROL BAR */

/* Start: Time (Current / Duration) */
.mejs__time {
    box-sizing: content-box;
    color: #fff;
    font-size: 11px;
    font-weight: bold;
    height: 24px;
    overflow: hidden;
    padding: 16px 6px 0;
    text-align: center;
    width: auto;
}

/* End: Time (Current / Duration) */

/* Start: Play/Pause/Stop */
.mejs__play > button, .audioplayer .mejs__play > button {
    background-position: 0 0;
}

.mejs__pause > button,  {
    background-position: -20px 0;
}

.audioplayer .mejs__pause > button {
   background-position: -3000px 0;
}

.mejs__replay > button, .audioplayer .mejs__replay > button {
    background-position: -160px 0;
}

/* End: Play/Pause/Stop */

/* Start: Progress Bar */
.mejs__time-rail {
    direction: ltr;
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    height: 40px;
    margin: 0 10px;
    padding-top: 10px;
    position: relative;
}

.mejs__time-total,
.mejs__time-buffering,
.mejs__time-loaded,
.mejs__time-current,
.mejs__time-float,
.mejs__time-hovered,
.mejs__time-float-current,
.mejs__time-float-corner,
.mejs__time-marker {
    border-radius: 2px;
    cursor: pointer;
    display: block;
    height: 10px;
    position: absolute;
}

.mejs__time-total {
    background: rgba(255, 255, 255, 0.3);
    margin: 5px 0 0;
    width: 100%;
}

.mejs__time-buffering {
    -webkit-animation: buffering-stripes 2s linear infinite;
            animation: buffering-stripes 2s linear infinite;
    background: -webkit-linear-gradient(135deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
    background: linear-gradient(-45deg, rgba(255, 255, 255, 0.4) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.4) 50%, rgba(255, 255, 255, 0.4) 75%, transparent 75%, transparent);
    background-size: 15px 15px;
    width: 100%;
}

@-webkit-keyframes buffering-stripes {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 30px 0;
    }
}

@keyframes buffering-stripes {
    from {
        background-position: 0 0;
    }
    to {
        background-position: 30px 0;
    }
}

.mejs__time-loaded {
    background: rgba(255, 255, 255, 0.3);
}

.mejs__time-current,
.mejs__time-handle-content {
    background: #c00;
}

.mejs__time-hovered {
    background: #c00;
    z-index: 10;
}

.mejs__time-hovered.negative {
   background: #c00;
}

.mejs__time-current,
.mejs__time-buffering,
.mejs__time-loaded,
.mejs__time-hovered {
    left: 0;
    -webkit-transform: scaleX(0);
        -ms-transform: scaleX(0);
            transform: scaleX(0);
    -webkit-transform-origin: 0 0;
        -ms-transform-origin: 0 0;
            transform-origin: 0 0;
    -webkit-transition: 0.15s ease-in all;
    transition: 0.15s ease-in all;
    width: 100%;
}

.mejs__time-buffering {
    -webkit-transform: scaleX(1);
        -ms-transform: scaleX(1);
            transform: scaleX(1);
}

.mejs__time-hovered {
    -webkit-transition: height 0.1s cubic-bezier(0.44, 0, 1, 1);
    transition: height 0.1s cubic-bezier(0.44, 0, 1, 1);
}

.mejs__time-hovered.no-hover {
    -webkit-transform: scaleX(0) !important;
        -ms-transform: scaleX(0) !important;
            transform: scaleX(0) !important;
}

.mejs__time-handle,
.mejs__time-handle-content {
    border: none;
    cursor: pointer;
    left: 0;
    position: absolute;
    -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
            transform: translateX(0);
    z-index: 11;
}

.mejs__time-handle-content {
    border-radius: 50%;
    width: 18px;
    height: 18px;
    left: -9px;
    top: -4px;
    background: #fff;
    -webkit-transform: scale(0);
        -ms-transform: scale(0);
            transform: scale(0);
}

.mejs__time-rail:hover .mejs__time-handle-content,
.mejs__time-rail .mejs__time-handle-content:focus,
.mejs__time-rail .mejs__time-handle-content:active {
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
}

.mejs__time-float {
    background: #eee;
    border: solid 1px #333;
    bottom: 100%;
    color: #111;
    display: none;
    height: 17px;
    margin-bottom: 9px;
    position: absolute;
    text-align: center;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 36px;
}

.mejs__time-float-current {
    display: block;
    left: 0;
    margin: 2px;
    text-align: center;
    width: 30px;
}

.mejs__time-float-corner {
    border: solid 5px #eee;
    border-color: #eee transparent transparent;
    border-radius: 0;
    display: block;
    height: 0;
    left: 50%;
    line-height: 0;
    position: absolute;
    top: 100%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 0;
}

.mejs__long-video .mejs__time-float {
    margin-left: -23px;
    width: 64px;
}

.mejs__long-video .mejs__time-float-current {
    width: 60px;
}

.mejs__broadcast {
    color: #fff;
    height: 10px;
    position: absolute;
    top: 15px;
    width: 100%;
}

/* End: Progress Bar */


/* Start: Progress Bar Alternatives for Audio Only */


.audioplayer .mejs__container, .audioplayer .mejs__controls:not([style*="display: none"]) {
	background: #eaeaea;
	color: #000;
}


.audioplayer .mejs__time-buffering, .audioplayer .mejs__time-current, .audioplayer .mejs__time-handle,
.audioplayer .mejs__time-loaded, .audioplayer .mejs__time-hovered, .audioplayer .mejs__time-marker, .audioplayer .mejs__time-total {
    height: 1px;
}
        
.audioplayer .mejs__time {
	color: #000;
}

.audioplayer .mejs__time-total {
	background: #333;
	margin-top: 9px;
}
.audioplayer .mejs__time-handle {
	left: -5px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: #c00;
	top: -5px;
	cursor: pointer;
	display: block;
	position: absolute;
	z-index: 2;
	border: none;
}
.audioplayer .mejs__time-handle-content {
	top: 0;
	left: 0;
	width: 12px;
	height: 12px;
	border: 4px solid #c00;
	background: #c00;
}




/* End: Progress Bar Alternatives for Audio Only */



/* Start: Fullscreen */
.mejs__fullscreen-button > button {
    background-position: -80px 0;
}

.mejs__unfullscreen > button {
    background-position: -100px 0;
}

/* End: Fullscreen */

/* Start: Mute/Volume */
.mejs__mute > button, .audioplayer .mejs__mute > button {
    background-position: -60px 0;
}

.mejs__unmute > button, .audioplayer .mejs__unmute > button {
    background-position: -40px 0;
}

.mejs__volume-button {
    position: relative;
}

.mejs__volume-button > .mejs__volume-slider {
    -webkit-backface-visibility: hidden;
    background: rgba(50, 50, 50, 0.7);
    border-radius: 0;
    bottom: 100%;
    display: none;
    height: 115px;
    left: 50%;
    margin: 0;
    position: absolute;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 25px;
    z-index: 1;
}

.mejs__volume-button:hover {
    border-radius: 0 0 4px 4px;
}

.mejs__volume-total {
    background: rgba(255, 255, 255, 0.5);
    height: 100px;
    left: 50%;
    margin: 0;
    position: absolute;
    top: 8px;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 2px;
}

.mejs__volume-current {
    background: rgba(255, 255, 255, 0.9);
    left: 0;
    margin: 0;
    position: absolute;
    width: 100%;
}

.mejs__volume-handle {
    background: rgba(255, 255, 255, 0.9);
    border-radius: 1px;
    cursor: ns-resize;
    height: 6px;
    left: 50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 16px;
}

.mejs__horizontal-volume-slider {
    display: block;
    height: 36px;
    position: relative;
    vertical-align: middle;
    width: 56px;
}

.mejs__horizontal-volume-total {
    background: rgba(50, 50, 50, 0.8);
    border-radius: 2px;
    font-size: 1px;
    height: 8px;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 16px;
    width: 50px;
}

.mejs__horizontal-volume-current {
    background: rgba(255, 255, 255, 0.8);
    border-radius: 2px;
    font-size: 1px;
    height: 100%;
    left: 0;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.mejs__horizontal-volume-handle {
    display: none;
}

/* End: Mute/Volume */

/* Start: Track (Captions and Chapters) */
.mejs__captions-button,
.mejs__chapters-button {
    position: relative;
}

.mejs__captions-button > button {
    background-position: -140px 0;
}

.mejs__chapters-button > button {
    background-position: -180px 0;
}

.mejs__captions-button > .mejs__captions-selector,
.mejs__chapters-button > .mejs__chapters-selector {
    background: rgba(50, 50, 50, 0.7);
    border: solid 1px transparent;
    border-radius: 0;
    bottom: 100%;
    margin-right: -43px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    right: 50%;
    visibility: visible;
    width: 86px;
}

.mejs__chapters-button > .mejs__chapters-selector {
    margin-right: -55px;
    width: 110px;
}

.mejs__captions-selector-list,
.mejs__chapters-selector-list {
    list-style-type: none !important;
    margin: 0;
    overflow: hidden;
    padding: 0;
}

.mejs__captions-selector-list-item,
.mejs__chapters-selector-list-item {
    color: #fff;
    cursor: pointer;
    display: block;
    list-style-type: none !important;
    margin: 0 0 6px;
    overflow: hidden;
    padding: 0;
}

.mejs__captions-selector-list-item:hover,
.mejs__chapters-selector-list-item:hover {
    background-color: rgb(200, 200, 200) !important;
    background-color: rgba(255, 255, 255, 0.4) !important;
}

.mejs__captions-selector-input,
.mejs__chapters-selector-input {
    clear: both;
    float: left;
    left: -1000px;
    margin: 3px 3px 0 5px;
    position: absolute;
}

.mejs__captions-selector-label,
.mejs__chapters-selector-label {
    cursor: pointer;
    float: left;
    font-size: 10px;
    line-height: 15px;
    padding: 4px 10px 0;
    width: 100%;
}

.mejs__captions-selected,
.mejs__chapters-selected {
    color: rgba(33, 248, 248, 1);
}

.mejs__captions-translations {
    font-size: 10px;
    margin: 0 0 5px;
}

.mejs__captions-layer {
    bottom: 0;
    color: #fff;
    font-size: 16px;
    left: 0;
    line-height: 20px;
    position: absolute;
    text-align: center;
}

.mejs__captions-layer a {
    color: #fff;
    text-decoration: underline;
}

.mejs__captions-layer[lang=ar] {
    font-size: 20px;
    font-weight: normal;
}

.mejs__captions-position {
    bottom: 15px;
    left: 0;
    position: absolute;
    width: 100%;
}

.mejs__captions-position-hover {
    bottom: 35px;
}

.mejs__captions-text,
.mejs__captions-text * {
    background: rgba(20, 20, 20, 0.5);
    box-shadow: 5px 0 0 rgba(20, 20, 20, 0.5), -5px 0 0 rgba(20, 20, 20, 0.5);
    padding: 0;
    white-space: pre-wrap;
}

.mejs__container.mejs__hide-cues video::-webkit-media-text-track-container {
    display: none;
}

/* End: Track (Captions and Chapters) */

/* Start: Error */
.mejs__overlay-error {
    position: relative;
}
.mejs__overlay-error > img {
    left: 0;
    max-width: 100%;
    position: absolute;
    top: 0;
    z-index: -1;
}
.mejs__cannotplay,
.mejs__cannotplay a {
    color: #fff;
    font-size: 0.8em;
}

.mejs__cannotplay {
    position: relative;
}

.mejs__cannotplay p,
.mejs__cannotplay a {
    display: inline-block;
    padding: 0 15px;
    width: 100%;
}
/* End: Error */