
@font-face {
	font-family: "Trade Gothic";
	src: url(fonts/tradegothic/TradeGothicLTStd.ttf);
}
@font-face {
	font-family: "Trade Gothic Light";
	src: url(fonts/tradegothic/TradeGothicLTStd-Light.ttf);
}
@font-face {
	font-family: "Trade Gothic Bold";
	src: url(fonts/tradegothic/TradeGothicLTStd-Bd2.ttf);
}
@font-face {
	font-family: "Trade Gothic Bold Condensed";
	src: url(fonts/tradegothic/TradeGothicLTStd-BdCn20.ttf);
}
@font-face {
	font-family: "Noto Sans Kannada";
	src: url(fonts/notosanskannada/NotoSansKannada-Regular.ttf);
}
@font-face {
	font-family: "Noto Sans Kannada Bold";
	src: url(fonts/notosanskannada/NotoSansKannada-Bold.ttf);
}
@font-face {
	font-family: "Baloo Tamma";
	src: url(fonts/balootamma/BalooTamma2-Regular.ttf);
}
@font-face {
	font-family: "Baloo Tamma Bold";
	src: url(fonts/balootamma/BalooTamma2-Bold.ttf);
}

:root{

	--cA: #45AB76;
	--cPA: #FFFFFF;
	
	--c0: #F2EBD9;
	--c1: #ebe4d2;
	--c2: #e1d7c3;
	--c3: #808080;
	--c4: #404040;
	--c5: #161012;

	
	--regular: "Trade Gothic", sans-serif;
	--bold: "Trade Gothic Bold", sans-serif;
	
	--green: #45AB76;
	--orange: #F3864A;
	--blue: #1690D0;
	--red: #F26D65;
	--yellow: #F8C028;
	--purple: #E583B5;

	
	

	
/* 
	--offset: 0vw;
	--move-initial: calc(-25% + var(--offset));
	--move-final: calc(-50% + var(--offset)); */


}
html{
	
	/* font-size: clamp(12px, 0.9vw + 5.49px, 24px); */
	font-size: clamp(12px, 0.65vi + 7.3px, 24px);
	/* font-size: clamp(12px, 0.22vi + 10.43px, 16px); */
	
	
	height: 100%;
	width: 100%;
	overscroll-behavior-x: none;
	overscroll-behavior-y: none;
	/* overscroll-behavior-block: none; */
	overflow: hidden;
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
	-webkit-tap-highlight-color: transparent;
	/* background-color: var(--c0); */
}
body{
	font-family: var(--regular);
	
	margin: 0px;
	overscroll-behavior-x: none;
	overscroll-behavior-y: none;
	/* overscroll-behavior-block: none; */
	/* touch-action: none; */
	position: relative;
	/* height: 100%; */
	overflow: hidden;
	width: 100%;
	height: 100%;
	/* text-transform: uppercase; */
	color: var(--c5);
	
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
	-webkit-tap-highlight-color: transparent;
	/* text-decoration-thickness: 0.2rem; */
	/* text-underline-offset: 0.1rem; */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	background-color: var(--c0);
	/* will-change: background-color;
	transition-property: background-color;
	transition-duration: 0.666666s;
	transition-timing-function: cubic-bezier(0.99, 0.0, 0.5, 0.99); */
	/* font-size: clamp(0.75rem, 0.6207rem + 0.8621vw, 2rem); */
}
b{
	font-family: var(--bold);
	font-weight: normal;
}
strong{
	font-family: var(--bold);
	font-weight: normal;
}
@keyframes hextorect {
	0%   {clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%); width: 2.5rem; height: 2.5rem;}
	33%  {clip-path: polygon(0% 0%, 100% 0%, 100% 50%, 100% 100%, 0% 100%, 0% 50%); width: 2.5rem; height: 2.5rem;}
	100% {clip-path: polygon(0% 0%, 100% 0%, 100% 50%, 100% 100%, 0% 100%, 0% 50%); width: 33vw; height: 8rem;}
}
#banner{
	font-family: var(--bold);
	/* padding: 0px 1rem; */
	/* margin-right: 1rem; */
	
	position: absolute;
	right: 1rem;
	top: 4rem;
	/* height: 20vh; */
	/* width: 100%; */
	justify-content: flex-start;
	align-items: stretch;
	flex-direction: column;
	gap: 1rem;
	font-size: 0.8rem;
	width: fit-content;
	max-width: 33vw;
	color: var(--c0);
	/* background-color: #019879; */
	/* mix-blend-mode: difference; */
	/* text-align: center; */
	/* width:8.5rem; */
	/* height: 1.25rem; */
	/* clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%); */
	/* clip-path: polygon(0.25rem 0%, calc(100% - 0.25rem) 0%, 100% 0.25rem, 100% calc(100% - 0.25rem), calc(100% - 0.25rem) 100%, 0.25rem 100%, 0% calc(100% - 0.25rem), 0% 0.25rem); */
	transition: 
		clip-path 0.5s,
		/* width 0.3s 0.2s; */
}
#banner > div{
	padding: 0.8rem;
	/* width: fit-content; */
	/* text-transform: uppercase; */
	cursor: pointer;
}
#banner > div > *{
	pointer-events: none;
}
#banner:hover{
	/* clip-path: polygon(0% 0%, 100% 0%, 100% 50%, 100% 100%, 0% 100%, 0% 50%); */
	/* width: 33vw; */
	/* transition: 
		width 0.3s,
		clip-path 0.2s 0.3s; */
	/* align-items: flex-start; */
	/* animation-name: hextorect; */
	/* animation-duration: 0.5s; */
	/* animation-iteration-count: 1; */
	/* animation-fill-mode: forwards; */
}
#message{
	font-family: var(--bold);
	padding: 1rem;
	position: absolute;
	left: 0;
	bottom: 0rem;
	height: 33vh;
	width: 100%;
	justify-content: center;
	align-items: center;
	color: var(--c5);
	mix-blend-mode: difference;
	text-align: center;
	box-sizing: border-box;
}
#instructions{
	display: flex; 
	justify-content: center; 
	align-items: center;
	padding: 1rem;
	box-sizing:border-box;
	position: absolute;
	bottom: 3rem;
	width: 100%;
	opacity:0.75;
	transition:1s;
	border-radius:1rem;
}
#page{
	font-family: var(--bold);
	display: block;
	/* position: fixed; */
	/* top: 0px;
	left: 0px; */
	width: 100%;
	height: 100%;
	/* padding: 0px 1rem; */
	box-sizing: border-box;
	/* background-color: rgba(255,255,255,0.05); */
	color: var(--c5);
	/* -webkit-text-stroke-width: 0.25px;
  	-webkit-text-stroke-color: var(--c0); */
	font-size: 1rem;
	display: grid;
	grid-template-columns: 1fr;
	/* grid-template-rows: 33% auto 1fr; */
	grid-template-rows: 0.4fr 0.1fr 1fr 0.25fr 0.25fr;
	place-items: start start;
	position: relative;
	/* mix-blend-mode: difference; */
	/* display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start; */
	/* color: var(--c5); */
	/* mix-blend-mode: screen; */
	/* backdrop-filter: blur(10px); */
}
#page > h2{
	user-select: none;
}
/* #page > p{ */
#label_exhibit_blurb{
	max-width: 45rem;
	/* display: -webkit-box;
	-webkit-line-clamp: 8;
	-webkit-box-orient: vertical;
	overflow: hidden; */
	/* font-size: 0.75rem; */
	/* line-height: 1.1; */
	/* text-shadow: 0px 0px 1rem #ffffff; */
	user-select: none;
}
mark{
	background-color: transparent;
	color: var(--c0);
	/* color: var(--c5); */
}
#cap{
	position: absolute;
	/* display: none; */
	font-family: var(--bold);
	font-size: 0.8rem;
	top: 0px;;
	bottom: 0rem;
	left: 0rem;
	width: 100%;
	display: grid;
	grid-template-columns: 0.01fr 1fr 0.01fr;
	/* flex-direction: row; */
	/* justify-content: center;
	align-items: center; */
	place-items: center start;
	/* height: 33%; */
	padding: 3rem 1rem;
	box-sizing: border-box;
	user-select: none;
	/* color: white; */

}
#exhibit_names{
	position: absolute;
	display: grid;
	grid-area: 1 / 1 / 2 / 2;
	place-items: start center;
	padding: 1rem;
	scrollbar-width: none;
	/* max-height: calc(100% - 8rem); */
	max-height: 100%;
	width: 100%;
	overflow: scroll;
	box-sizing: border-box;
	/* z-index: -1; */
	/* background-color: var(--c2	); */

}
/* #exhibit_names > div{
	place-content: center;
	align-items: center;
} */
.exhibit_names_list{
	/* position: absolute; */
	/* bottom: 0px; */
	/* left: 0px; */
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	/* max-height: 28rem; */
	/* width: 33rem; */
	padding: 0rem 0px;
	box-sizing: border-box;
	transition: 0.5s;
	/* transition-timing-function: ease-in-out; */
	max-width:100%;
	width:100%;
	overflow-x: hidden;
	/* background-color: #edf5ff10; */
	/* border-radius: 1rem;
	border: 1px solid #edf5ff40; */
}
.exhibit_names_list_kn{
	position: absolute;
	/* bottom: 0px; */
	/* left: 0px; */
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	max-height: 28rem;
	/* width: 36rem; */
	padding: 0.5rem 0px;
	box-sizing: border-box;
	background-color: var(--c1);
	border-radius: 1rem;
}
#exhibit_names > div > span{
	padding: 0.2rem 0.5rem;
	white-space: nowrap;
	color: var(--c5);
	cursor: pointer;
}
#exhibit_themes{
	position: relative;
	display: grid;
	place-items: end center;
}
#exhibit_themes > div{
	position: absolute;
	/* bottom: 0px; */
	/* left: 0px; */
	display: flex;
	flex-direction: column;
	background-color: var(--c1);
}
#exhibit_themes > div > span{
	padding: 0.2rem 0.5rem;
	white-space: nowrap;
	color: var(--c5);
	cursor: pointer;
}
.exhibitListItem{
	transition:0.1s;
	border-radius: 2rem;
	white-space: nowrap;
}
/* .exhibitListItem:hover{
	background-color: var(--cA);
} */
.accent_highlight{
	background-color: var(--cA);
}
#exhibit_themes > div > span:hover{
	color: var(--c0);
	background-color: var(--cA);
}
#back_button{
	/* position: absolute;
	bottom: 1rem;
	right: 1rem; */
	cursor: pointer;
}
#birdseye{
	/* position: absolute;
	bottom: 1rem;
	right: 1rem; */
	cursor: pointer;
	user-select: none;
}
/* div::selection{
	color: var(--background-highlight-color);
	background-color: var(--c1);
	text-shadow: none;
}
p::selection{
	color: var(--background-highlight-color);
	background-color: var(--c1);
	text-shadow: none;
}
span::selection{
	color: var(--background-highlight-color);
	background-color: var(--c1);
	text-shadow: none;
} */
img{
	display: block;
}
#back{
	height: 100%;
	width: 100%;
}
canvas{
	
	background-color: black;
	display: block;
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	/* background-color: black; */
}
#imgcanvas, #Cimgcanvas{
	background-color: #00000000;
}
/* .glass{
	background: #F2EBD960;
	border-radius: 16px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
	backdrop-filter: blur(6.8px);
	-webkit-backdrop-filter: blur(6.8px);
	border: 1px solid rgba(255, 255, 255, 0.44);
} */
.glass{
	/* From https://css.glass */
	/* background: rgba(255, 255, 255, 0.36); */
	background: #F2EBD9F0;
	
	border-radius: 16px;
	box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2);
	/* backdrop-filter: blur(6.8px); */
	/* -webkit-backdrop-filter: blur(6.8px); */
	border: 1px solid rgba(255, 255, 255, 0.44);
}

.material-symbols-outlined{
	font-size: 2rem;
	vertical-align: middle;
	font-variation-settings:
	'FILL' 0,
	'wght' 400,
	'GRAD' 0,
	'opsz' 48
}

.material-symbols-outlined.bold{
	font-size: 2rem;
	vertical-align: middle;
	font-variation-settings:
	'FILL' 0,
	'wght' 700,
	'GRAD' 0,
	'opsz' 48
}

.material-symbols-sharp {
	vertical-align: middle;
	font-variation-settings:
	'FILL' 1,
	'wght' 400,
	'GRAD' 0,
	'opsz' 24
}

.material-symbols-filled{
	font-size: 2rem;
	vertical-align: middle;
	font-variation-settings:
	'FILL' 1,
	'wght' 400,
	'GRAD' 0,
	'opsz' 48
}
.material-symbols-outlined.colored{
	color: var(--cA);
	/* border: 0.1rem solid var(--cA); */
	/* background-color: var(--cA); */
}


.glbackground{
	display: flex;
	justify-content: center;
	align-items: center;
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	/* z-index: -3; */
}
#cover{
	background-color: transparent;
	/* z-index: -1; */
}
#back{
	position: fixed;
	/* width: 1024px;
	height: 512px; */
	/* transform: translate(50%, 50%); */
}
#svg{
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	font-size: 12px;
	outline: none;
	/* visibility: hidden; */
	/* z-index: -2; */
}
svg:focus { outline: none; }
svg > text{
	max-width: 480px;
}
svg > path{
	stroke-width: 6px;
	pointer-events: none;
	/* stroke:hsl(0, 0%, 100%); */
}
.expoly{
	cursor: pointer;
}
main{
	display: block;
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	overflow: hidden;
	/* padding: 2rem; */
	box-sizing: border-box;
	/* touch-action: none; */
	/* clip-path: inset(3.4rem 0px 0px 0px); */
	transition-duration: 1s;
	/* mix-blend-mode: difference; */
	/* mix-blend-mode: screen; */
	/* z-index: 0; */
	overscroll-behavior-x: none;
	overscroll-behavior-y: none;
	overscroll-behavior-block: none;
}
@keyframes pulse {
	0% {opacity: 0;}
	50% {opacity: 1;}
	100% {opacity: 0;}
}
  
.pulse{
	  animation-name: pulse;
	  animation-duration: 5s;
	  animation-iteration-count: infinite;
	  animation-direction: normal;
	  animation-timing-function: ease-in;
	  animation-fill-mode: forwards;
}
.dim{
	opacity: 0.333;
	background-color: rgba(0,0,0,1);
}
p{
	
	/* color: var(--c1); */
}
a{
	color: inherit;
	/* text-decoration: none; */
	/* display: block; */
}
#detailed_feedback{
	color: var(--c5);
}
#detailed_feedback:hover{
	color: var(--cA);
}
.starIcon{
	fill: dimgray;
}
.starIcon > *{
	pointer-events: none;
}
.starIconYellow{
	fill: gold;
}
.starIcon:hover{
	fill: gold;
	cursor: pointer;
}
.starIcon:hover{
	fill: goldenrod;
	cursor: pointer;
}
.starIcon:has(~ :hover) {
	fill: goldenrod;
}
#mediaPlayer, #songPlayer{
	/* display: flex; */
	font-family: var(--bold);
	flex-direction: row;
	align-items: center;
	gap: 0.5rem;
	will-change: transform;
	transition-property: transform;
	transition-timing-function: ease;//cubic-bezier(0.0, 0.0, 0.5, 0.99);
	transition-duration: 0.5s;
}
#mediaPlayer > p, #songPlayer > p{
	display: block;
	color: var(--c0);
	margin: 0;
}
/* .audioProgress{
	background-color: rgba(32, 32, 32, 0.5);
	width: 50%;
	height: 4px;
	padding: 0.25rem;
	background-clip: content-box;
} */
#audioProgress{
	/* background-color: var(--c0); */
	/* background-color: rgba(32, 32, 32, 0.5); */
}
.mediaPlayerControl{
	display: block;
	fill: var(--c0);
	cursor: pointer;
}
a:hover{
	color: var(--cA);
}
#intro{
	position: fixed;
	/* width: 100%;
	height: 100%; */
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	/* color: var(--c1); */
	background-color: transparent;
	/* var(--overlay-color); */
	/* transition-duration: 1s; */
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	align-items: center;
	justify-items: center;
	padding: 1rem;
	box-sizing: border-box;
	/* display: none; */
}
#opening{
	font-family: var(--bold);
	/* grid-area: 2 / 1 / 2 / 2; */
	color: var(--c5);
	text-align: center;
}
#enterButton{
	/* position: absolute;
	bottom: 24px;
	right: 24px; */
	/* cursor: pointer; */
	font-size: 16rem;
	/* grid-area: 3 / 1 / 3 / 2; */
	
}
#progress{
	position: fixed;
	bottom: 0px;
	left: 0px;
	height: 4px;
	/* background-color:rgba(0,255,0,0.5); */
	background-color: var(--cA);
	width: 100px;
	display: none;
}
#loader
/* .heading{
	
	margin: 0px;
	font-size: 2rem;
	text-transform: uppercase;
	line-height: 1.4rem;
	color: var(--text-inverted-color);
} */
#menupipe{
	display: block;
}
menu{
	/* padding: 8rem 0px 0rem 1rem; */
	margin: 0px;
	/* position: absolute;
	top: 0px;
	left: 0px; */
	/* bottom: 0px;
	right: 0px; */
	box-sizing: border-box;
	/* display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: 1fr; */
	/* flex-direction: column;
	justify-content: center;
	align-items: flex-start; */
	/* z-index: 2; */
	padding: 0px;
	display: flex;
}
.toggle{
	display: block;
}
ul{
	padding: 0px;
	margin: 0px;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	gap: 1rem;
	/* grid-area: 1/2/2/3;
	place-self: end center; */
}
li{
	font-family: var(--bold), sans-serif;
	list-style: none;
	cursor: pointer;
	font-size: 1.0rem;
	/* color: var(--c3); */
	width: fit-content;
	width: -moz-fit-content;
	overflow: hidden;
	white-space: nowrap;
	user-select: none;
	margin: 0px 0rem;
	/* text-transform: uppercase; */
}
li > span{
	display: inline-block;
	will-change: transform;
	transition-property: transform;
	transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
	transition-duration: 0.33s;
	pointer-events: none;
}
li:hover{
	/* font-variation-settings: "wght" 700; */
	/* color: var(--c5); */
	text-decoration: underline;
}
menu > ul > a, menu > ul > p{
	/* text-align: right; */
}

header{
	font-family: var(--bold), sans-serif;
	font-size: 1rem;
	/* line-height: 0.75; */
	/* letter-spacing: -0.1rem; */
	/* position: absolute;
	top: 0rem;
	left: 0rem; */
	/* padding: 1rem; */
	/* color: var(--c0); */
	/* color: black; */
	cursor: pointer;
	user-select: none;
	/* font-feature-settings: "liga"off; */
	
	/* background-color: red; */
}
header > span{
	display: inline-block;
	overflow: hidden;
}
header > span > span{
	display: inline-block;
	will-change: transform;
	transition-property: transform;
	transition-timing-function: cubic-bezier(0.0, 0.5, 0.2, 0.99);
	transition-duration: 0.99s;
}
header > span#name{
	cursor: pointer;
}
#count{
	position: absolute;
	font-size: 4rem;
	top: 0rem;
	right: 0rem;
	padding: 1rem;
	color: var(--c5);
	user-select: none;
	line-height: 0.75;
	/* vertical-align: top; */
}
#count_current{
	font-size: 4rem;
}
#count_max{
	font-size: 1rem;
	font-family: var(--bold);
	/* vertical-align: top; */
}
#nav_indicators{
	position: absolute;
	top: 0rem;
	right: 0rem;
	height: 100%;
	padding: 1rem;
	margin-top: calc(-1rem - 2px);
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 0.5rem;
	cursor: pointer;
	will-change: gap;
	transition-property: gap;
	transition-duration: 0.333s;
	transition-timing-function: cubic-bezier(0.0, 0.0, 0.5, 0.99);
}
#nav_indicators:hover > .nav_indicator:not(:first-child){
	opacity: 1;
}
.nav_indicator:first-child:hover{
	opacity: 1;
}
.nav_indicator{
	height: 2px;
	width: 1rem;
	background-color: var(--c5);
	opacity: 0.25;
	will-change: opacity;
	transition-property: opacity;
	transform-origin: center center;
	transition-duration: 0.5s;
	/* padding: 0.25rem 0px;
	background-clip: content-box; */
	/* cursor: pointer; */
}

.nav_indicator:nth-child(1){
	height: 1rem;
	background-color: transparent;
	box-shadow: inset 0px 0px 0px 2px var(--c5);
	/* opacity: 0.5; */
	cursor: pointer;
}

/* .nav_indicator:hover{
	opacity: 1.0;
} */
#scroll_indicator{
	/* transform: rotate() */
	font-size: 0.8rem;
	position: absolute;
	bottom: 0rem;
	right: 0rem;
	/* height: 100%; */
	
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	text-transform: uppercase;
	color: var(--c3);
	writing-mode: vertical-rl;
	text-orientation: mixed;
	overflow: hidden;
}
#scroll_indicator > span{
	will-change: transform;
	transition-property: transform;
	transition-timing-function: cubic-bezier(0.0, 0.0, 0.5, 0.99);
	transition-duration: 0.5s;
	padding: 1rem;
	box-sizing: border-box;
}
#label_exhibit_theme{
	text-transform: uppercase;
	font-size: 0.8rem;
	color: var(--cA);
}
#label_exhibit_name{
	
	font-family: var(--bold);
	font-size: 3rem;
	font-weight: normal;
	text-transform: uppercase;
	line-height: 1;
	text-align: center;
	/* background-blend-mode: difference; */
	/* color: white; */
	/* padding: 0rem 0rem;
	margin: 4rem 0rem 6rem 0rem; */
	/* padding: 12rem 1rem 2rem 1rem; */
	/* margin:0px 0px 1rem 0px; */

}
#feedbackPanel{
	will-change: transform;
	transition-property: transform;
	transition-timing-function: cubic-bezier(0.0, 0.0, 0.5, 0.99);
	transition-duration: 0.5s;
}
.head{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	display: flex;
	justify-content: center;
	align-items: center;
}
h1{
	font-family: var(--bold);
	font-size: 4rem;
	font-weight: normal;
	text-transform: uppercase;
	line-height: 1;
	/* padding: 0rem 0rem;
	margin: 4rem 0rem 6rem 0rem; */
	padding: 12rem 1rem 2rem 1rem;
	margin:0px 0px 1rem 0px;
	background-color: var(--c1);
}
h2{
	font-family: var(--bold);
	margin: 0px;
	font-size: 2rem;
	font-weight: normal;
	text-transform: uppercase;
	/* line-height: 1; */
}
h6{
	font-family: var(--bold);
	font-size: 1rem;
	font-weight: normal;
	font-family: var(--bold);
	text-transform: uppercase;
	margin:0px;
	/* line-height: 1; */
}
/* nav{
	position: absolute;
	top: 15px;
	left: 15px;
	width: 100%;
	
	overflow: scroll;
	font-size: 1rem;
	
	transition-property: left;
	transition-duration: 1s;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
nav::-webkit-scrollbar {
	display: none;
} */
div.select{
	/* margin: 0px 6px 0px 0px; */
	color: hsl(0,0%,50%);
	width: fit-content;
	width: -moz-fit-content;
	cursor: pointer;

	display: flex;
	flex-direction: row;
}
#knowing{
	visibility: hidden;
}
div.select > label{
	/* padding: 3px; */
	box-sizing: border-box;
	display: block;
	cursor: pointer;
	text-transform: uppercase;
	white-space: nowrap;
	padding-right: 24px;
}
div.options{
	/* position: absolute; */
	z-index: 1;
	width: fit-content;
	width: -moz-fit-content;
	text-transform: uppercase;
	white-space: nowrap;
	cursor: pointer;
	position: relative;
}
div.option{
	/* padding: 3px; */
	padding-right: 24px;
	color: rgba(255,255,255,0.333);
}
.pulled{
	display: none;
}
.dropped{
	/* display: block; */
	display: flex;
	flex-direction: row;
}
div.option:hover{
	color: hsl(0,0%,50%);
}
.details{
	position: fixed;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: 15px 30px 15px 0px;
	top: 0px;
	right: 0px;
	width: 50vw;
	box-sizing: border-box;
	height: 100%;
	/* max-width: 480px; */
	/* background-color: rgba(0,0,0, 0.2); */
	background-color: transparent;
	transition-property: opacity;
	transition-duration: 1.0s;
	/* transition-timing-function: ease-out; */
	/* cubic-bezier(0.9, 0.0, 0.1, 1.0) */
	color: hsl(0,0%,67%);
}

.details > p{
	margin: 6px 0px;
	transition-duration: 0.5s;
	max-width: 720px;
}
/* .details > .heading{
	font-size: 1.5rem;
	color: hsl(0,0%,67%);
	margin: 4px 0px 0px 0px;
} */
.details > a{
	/* position: absolute;
	bottom: 15px;
	right: 15px; */
	float: right;
}
article{
	position: fixed;
	top: 1rem;
	right: 1rem;
	bottom: 1rem;
	left: 33%;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-y;
	scrollbar-width: none;
	-ms-overflow-style: none;
	background-color: var(--c2);
	color: var(--c5);
	/* border-left: solid 2px var(--c0); */
	/* clip-path: polygon(2rem 0, 100% 0, 100% 100%, 0 100%, 0 2rem); */
	padding: 4rem 1rem 5rem 1rem;

	will-change: transform, background-color;
	transition-property: transform, background-color;
	transition-duration: 1.0s, 2.0s;
	transition-timing-function: cubic-bezier(0.25,0.5,0.0,0.99);

	/* transform: translateX(100%);
	will-change: transform;
	transition-property: transform;
	transition-duration: 1.0s;
	transition-timing-function: cubic-bezier(0.5, 0.0, 0.75, 0.99);
	transition-timing-function: ease-in-out; */
	
}

article::-webkit-scrollbar {
	display: none;
	scrollbar-width: 0px;
}

article > *{
	overflow: auto; /* or scroll */
	scrollbar-width: none; /* Firefox */
	-ms-overflow-style: none; /* IE 10+ */
}
article > *::-webkit-scrollbar {
	display: none;
	scrollbar-width: 0px;
}

.hide{
	opacity: 0;
}
.show{
	opacity: 1;
}
.toggle{
	display: flex;
}
section{
	/* padding-top: 3rem; */
	padding-bottom: 3rem;
	margin: 0px;
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	/* background-color: var(--c5); */
	/* touch-action: none; */
	box-sizing: border-box;

	/* will-change: opacity;
	transition-property: opacity;
	transition-duration: 1.0s; */
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-y;
	scrollbar-width: none;
	-ms-overflow-style: none;
	/* color: var(--c5); */
	/* mix-blend-mode: difference; */

}
iframe{
	touch-action: none;
}
iframe > *{
	touch-action: none;
}
.clickable:hover{
	opacity:0.5;
	cursor: pointer;
}
.clickable > *{
	/* pointer-events: none; */
}
#heading{
	will-change: opacity;
	transition-property: opacity;
	/* transition-duration: 0.5s; */
}
.exhibit{
	position: fixed;
	top: 3.4rem;
	left: 1rem;
	bottom: 2rem;
	right: 1rem;
	touch-action: none;
	/* background-color: hsl(0, 0%, 15%); */
	/* padding: 45px; */
	box-sizing: border-box;
	/* transition-duration: 1s; */
	/* z-index: 0; */
	display: flex;
	justify-content: center;
	align-items: center;
}
#exhibits{
	/* display: grid;
	grid-template-columns: repeat(6, 1fr);
	grid-template-rows: repeat(4, minmax(0, 1fr));
	gap: 1rem;
	
	box-sizing: border-box;
	padding: 3.4rem 1rem 45px 1rem;
	grid-template-areas: 	"a b c d e f"
							"g h i j k l"
							"m n o p q r"
							"s t u v w x"; */
	right: 3rem;
	bottom: 0px;
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	will-change: opacity;
	transition-property: opacity;
	transition-duration: 0.5s;
	opacity: 0;
}
#exhibits > div{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-end;
	grid-area: 1/1/2/2;
	height: 100%;
	gap: 0.5rem;
}
.exhibitName{
	font-family: var(--bold);
	font-size: 1rem;
	cursor: pointer;
	white-space: nowrap;
	color: var(--c5);
	opacity: 0.5;
	text-align: right;
	line-height: 1;
	user-select: none;
	will-change: opacity;
	transition-property: opacity;
	transition-duration: 0.5s;
	/* text-transform: uppercase; */
	/* transform: translate(33vw, 0px); */
}
.exhibitName:hover{
	/* color: var(--c5); */
	opacity: 1;
}
#exhibitName{
	/* position: absolute;
	top: 0px;
	left: 0px; */
	grid-area: 2 / 2 / 4 / 6;
	place-self: center;
	font-size: 3rem;
	z-index: 100;
	pointer-events: none;
	color: var(--c5);
	display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	height: 4rem;
	overflow: hidden;
	white-space: nowrap;
}
.opacity_full{
	opacity: 1;
}
#exhibitName > span{
	grid-area: 1 / 1 / 2 / 2;
	/* transition-duration: 0.5s; */
	place-self: center;
}
#exhibits > .exhibitThumbnail {
	position: relative;
	width: 100%;
	height: 100%;
	transition-property: opacity;
	/* , max-height; */
	transition-duration: 1s;
	/* opacity: 0.67; */
	cursor: pointer;
	overflow: hidden;
	/* place-self: center; */
	/* display: flex;
	justify-content: center;
	align-items: center;
	object-fit: cover; */
}
.zeroHeight{
	/* max-height: 0px; */
	opacity: 0;
}
.fullHeight{
	/* max-height: 100%; */
	opacity: 0.5;
}
#exhibits > .exhibitThumbnail:hover {
	opacity: 1;
	/* height: 100%; */
}
#exhibits > .exhibitThumbnail > img{
	width: 100%;
	height: 100%;
	/* min-height: 100%; */
	pointer-events: none;
	object-fit: cover;
	object-position: center;

	/* background-size: cover;
	background-repeat: no-repeat;
	background-position: center; */
	
}
.upcoming{
	/* cursor: pointer; */
	/* transition: 0.5s; */
}
.upcoming > img{
	filter: grayscale(100%);
	transition: 0.5s;
	background-color: var(--c0);

}
.upcoming:hover{
	/* background-color: var(--c1); */
}
.upcoming > p > span:nth-Child(2){
	font-size: 2rem;
}
.upcoming:hover > p > span:nth-Child(2){
	color: var(--cA);
}
.upcoming:hover > img{
	filter: grayscale(0%);
}
.upcoming > *{
	/* pointer-events: none; */
}

#programmesList{
	box-sizing: border-box;
	margin: 0rem 0px 2rem 0px;
	padding: 0px;
	display: flex;
	flex-direction: column;
}

section::-webkit-scrollbar {
	display: none;
}

.programmeItem{
	/* display: flex; */
	display: grid;
	/* align-items: center; */
	grid-template-columns: minmax(0px, 1fr) 16rem 12rem;
	grid-template-rows: 1fr;
	/* grid-auto-flow:column; */
	gap: 0rem 1rem;
	/* padding: 0.5rem 1rem; */
	box-sizing: border-box;
	/* font-size: 2rem; */
	/* font-family: var(--medium); */
	place-items: start start;
	padding: 1rem;
	cursor: pointer;
	/* background-color: #FFFFFF08; */
	border-top: 1px solid var(--c5);
	font-family: var(--bold);
	/* background-clip: border-box; */
}
.programmeItem > *{
	pointer-events: none;
}
.programmeItem:hover{
	background-color: var(--cA);
	color: var(--c5);
}
.programmeItem > div:last-child{
	place-self: start end;
}

.programmeItem > div:nth-Child(1){
	padding: 0rem 0px;
	/* white-space: nowrap; */
	text-overflow: ellipsis;
	overflow: hidden;
	user-select: none;
	/* display: flex; */
	/* flex-direction: row; */
	/* align-items: center; */
	/* justify-content: flex-start; */
	gap:0.5rem;
	/* transition: 0.25s; */
	width: 100%;
}
.programmeItem > div:nth-Child(1) > *{
	pointer-events: none;
}




#handbook{
	bottom: 0;
}
#curated{
	display: grid;
	gap: 1rem;
	grid-template-columns: 1fr;
	grid-template-rows: auto 1fr auto 1fr auto 1fr;
	/* grid-template-rows: auto auto auto auto; */
	/* overflow: visible; */
	/* padding-left: 1rem; */
	padding: 2rem 1rem 0px 1rem;
	bottom: 0px;
	height: 100%;
	box-sizing: border-box;
	margin: 0px;
}
#curated > div:nth-child(odd):not(:last-child){
	/* font-family: "Trade Gothic BD", sans-serif; */
	/* margin-bottom: -0.9rem; */
	/* line-height: 0.8rem; */
	/* vertical-align: top; */
}
#curated > div:nth-child(even){
	position: relative;
	height: 100%;
	width: 100%;
	overflow: hidden;
}
.carousel{
	/* overflow: visible; */
	position: relative;
	height: 100%;
	width: 100%;
	display: flex;
	flex-wrap: nowrap;
	flex-direction: row;
	align-items: center;
	overflow-y: visible;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	touch-action: pan-x;
	scrollbar-width: none;
	-ms-overflow-style: none;
	/* padding-left: 3.4rem; */
	/* padding: 0px 1rem; */
	box-sizing: border-box;
	/* margin-left: 3px; */
}
.carousel::-webkit-scrollbar {
	display: none;
}
/* #curated > div:nth-child(even) > div:nth-child(2){
	height: 100%;
	width: 3.4rem;
	display: flex;
	justify-content: center;
	align-items: center;
	box-sizing: border-box;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 100;
	background-color: hsl(0, 0%, 0%);
} */
.carouselNavigation{
	position: absolute;
	top: 0px;
	height: 100%;
	
	z-index: 99;
	display: flex;
	justify-content: center;
	align-items: center;
	/* cursor: url(assets/east_white_24dp.svg); */
	/* cursor: pointer; */
	/* background-color: red; */
	/* mix-blend-mode: invert; */
	
	transition: 1s;
}
.curatedContainer > .carouselNavigation{
	background-color: rgba(0,0,0,0.25);
}
#perspectives > .carouselNavigation{
	background-color: transparent;
}
#perspectives > .carouselNavigation:hover{
	background-color: rgba(255,255,255,0.05);
}
.curatedContainer > .carouselNavigation:hover{
	background-color: rgba(0,0,0,0.5);
}
.carouselNavigation > span{
	pointer-events: none;
}
.carousel > img{
	
	height: calc(100% - 10px);
	/* width: -moz-min-content;
	width: min-content; */
	display: inline-block;
	position: relative;
	margin: 0px 1rem 0px 0px;
	cursor: pointer;
	box-sizing: border-box;
	/* box-sizing: border-box; */
	/* position: relative;
	height: 240px;
	width: fit-content;
	margin: 0px 30px 30px 0px; */
	/* height: 100%; */
	width: auto;
}
/* .carousel > figure >img{
	height: 100%;
	width: auto;
	pointer-events: none;
} */
.carousel > figure > figcaption{
	/* display: none; */
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 3px;
	font-size: 0.8rem;
	text-align: left;
	color: hsl(0, 0%, 6%);
	pointer-events: none;
}
#perspectives{
	bottom: 0px;
	/* padding-left: 1rem; */
	padding-bottom: 2rem;
	/* display: grid;
	grid-template-columns: 1fr;
	grid-template-rows: 1fr;
	justify-items: center;
	align-items: center;
	justify-content: center;
	align-content: center; */
	
}

#floaty{
	position: fixed;
	width: 256px;
	height: 144px;
	bottom: 15px;
	right: 15px;
}
#floaty > img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
button{
	font-family: var(--bold);
	font-size: 1rem;
	color: var(--c5);
	cursor: pointer;
	margin: 0px;
	text-transform: uppercase;
	padding: 0.5rem 1rem;
	border: none;
	width: fit-content;
	background-color: transparent;
	text-decoration: none;
	border: 0.1rem solid var(--c5);
	/* border-radius: 1rem; */
	vertical-align: middle;
	mix-blend-mode: multiply;
	user-select: none;
}
button:hover{
	background-color: var(--c5);
	color:  var(--c0);
	mix-blend-mode: multiply;
}
.button{
	font-family: var(--bold);
	/* font-size: 0.75rem; */
	/* color: var(--primary-color); */
	color: var(--c0);
	cursor: pointer;
	margin: 0px;
	text-transform: uppercase;
	padding: 0.25rem 1rem;
	background-color: var(--c5);
	/* border: 2px solid var(--c5); */
	/* clip-path: polygon(0.5rem 0, 100% 0, 100% 100%, 0 100%, 0 0.5rem); */
	/* clip-path: polygon(20% 0, 80% 0, 100% 50%, 80% 100%, 20% 100%, 0 50%); */
	border-radius: 2rem;
	/* border: 2px solid; */
}
.button:hover{
	color: var(--c5);
	background-color: var(--cA);
	/* border: 2px solid var(--cA); */
}
.button_outline{
	font-family: var(--bold);
	/* font-size: 0.75rem; */
	/* color: var(--primary-color); */
	width: fit-content;
	color: var(--c5);
	cursor: pointer;
	margin: 0px;
	text-transform: uppercase;
	padding: 0.5rem 1rem;
	/* background-color: var(--c5); */
	border: 2px solid var(--c5);
	white-space: nowrap;

	/* clip-path: polygon(0.5rem 0, 100% 0, 100% 100%, 0 100%, 0 0.5rem); */
	/* clip-path: polygon(20% 0, 80% 0, 100% 50%, 80% 100%, 20% 100%, 0 50%); */
	/* border-radius: 2rem; */
	/* border: 2px solid; */
}
.button_outline_selected{
	font-family: var(--bold);
	width: fit-content;
	
	cursor: pointer;
	margin: 0px;
	text-transform: uppercase;
	padding: 0.5rem 1rem;
	color: var(--c0);
	background-color: var(--c5);
	border: 2px solid var(--c5);
	white-space: nowrap;
}
.button_outline:hover{
	color: var(--c0);
	background-color: var(--c5);
	/* border: 2px solid var(--cA); */
}

.button_text{
	font-family: var(--bold);
	/* font-size: 0.75rem; */
	/* color: var(--primary-color); */
	/* color: var(--c5); */
	cursor: pointer;
	margin: 0px;
	text-transform: uppercase;
	padding: 1rem;
	/* border-radius: 2rem; */
	/* border: 2px solid; */

}
.button_text:hover{
	color: var(--cA);
}
.button_text_bright{
	font-family: var(--bold);
	/* font-size: 0.75rem; */
	/* color: var(--primary-color); */
	color: var(--c5);
	cursor: pointer;
	margin: 0px;
	text-transform: uppercase;
	padding: 1rem;
	/* border-radius: 2rem; */
	/* border: 2px solid; */

}
.button_text_bright:hover{
	color: var(--cA);
}
.button_text_dim{
	font-family: var(--bold);
	/* font-size: 0.75rem; */
	/* color: var(--primary-color); */
	color: grey;
	cursor: pointer;
	margin: 0px;
	text-transform: uppercase;
	padding: 1rem;
	/* border-radius: 2rem; */
	/* border: 2px solid; */

}
.button_text_dim:hover{
	color: var(--cA);
}
.bgc1{
	background-color: var(--c1);
}
.hovered{
	/* background-color: transparent; */
}
.hovered:hover{
	background-color: var(--cA);
}
.link{
	
	/* color: var(--c1); */
	cursor: pointer;
	display: block;
	/* margin: 0px; */
	/* font-size: 0.8rem; */
}
.link:hover{
	/* text-decoration: underline; */
	color: var(--cA);
}
.highlight{
	background-color: var(--c5);
	color: var(--c0);
	/* cursor: pointer; */
}
.highlight:hover{
	/* text-decoration: underline; */
}
.underline{
	/* font-family: "Trade Gothic LT Bold", sans-serif; */
	font-weight: 700;
	color: var(--c5);
	cursor: pointer;
}
.underline:hover{
	text-decoration: underline;
}
nav{
	position: absolute;
	width: 100%;
	height: 3rem;
	/* padding: 15px; */
	padding: 1rem;
	box-sizing: border-box;
	/* height: 45px; */
	top: 0px;
	right: 0px;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	will-change: opacity;
	transition-property: opacity;
	transition-duration: 0.5s;
	transition-timing-function: ease-out;
	/* color: var(--c0); */
	/* mix-blend-mode: difference; */
	/* color: var(--c5); */
	/* border-bottom: 1px dotted hsl(0,0%,33%); */
	/* background-color: hsl(0, 0%, 0%); */
	/* transition-property: opacity;
	transition-duration: 1s; */
	/* background-color: hsl(0,0%,6%); */
	/* border-bottom: 1px solid hsl(0, 0%, 20%); */
}
/* .bar > #exhibitTabs, .bar > #curatedTabs{ */

#menuButton{
	cursor: pointer;
	display: none;
	user-select: none;
	position: absolute;
	right: 1rem;
	font-family: var(--bold);
}
#menuButton:hover{
	/* color: hsl(0, 0%, 100%); */
	/* color: rgba(149, 27, 129, 1.0); */
}
#menuButton path{
	transition-duration: 0.5s;
}
#featuredButton{
	background-color: transparent;
	cursor: pointer;
}

/* #filterButton{
	position: fixed;
	top: 60px;
	left: 15px;
} */
#filters{
	/* background-color: rgba(0,0,0, 0.80); */
	/* background-color: var(--background-highlight-color); */
	font-family: var(--bold);
	/* font-size: 0.8rem; */
	margin: 2rem 0px;
	padding: 0px 1rem;
	box-sizing: border-box;
	/* position: fixed;
	top: 0px;
	right: 0px; */
	width: 100%;
	/* height: 50vh; */
	/* touch-action: pan-x; */
	transition-property: color;
	transition-duration: 0.5s;
	/* z-index: 2; */
	display: flex;
	/* grid-template-columns: minmax(0px, 1fr) 16rem 12rem; */
	/* flex-direction: row;
	justify-content: flex-end;
	align-items: flex-end; */
	gap: 1rem;
	z-index: 1x0;
	/* position: absolute; */
}

/* #filters > div > div{
	cursor: pointer;
	white-space: nowrap;
	user-select: none;
} */
.filter{
	/* color: var(--c5); */
	/* font-family: var(--regular); */
	cursor: pointer;
	white-space: nowrap;
	/* padding: 0.1rem 0.5rem; */
	flex-shrink: 0;
	/* border: 0.1rem var(--c5) solid; */
	/* border-radius: 2rem; */
	/* background-color: var(--c1); */
	/* vertical-align:18%; */
}
.filter:hover{
	color: var(--cA);
	/* background-color: var(--cA); */
	/* border: 0.1rem var(--cA) solid; */
}
#share{
	background-color: hsl(0, 0%, 6%);
	padding: 15px;
	box-sizing: border-box;
	position: fixed;
	top: 3.4rem;
	right: 15px;
	/* right: 0px;
	bottom: 0px; */
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
#share > div{
	margin: 0px 0px 6px 0px;
	cursor: pointer;
}
#share > div > a:hover{
	color: hsl(0,100%,100%);
}
#share > #copyLink:hover{
	color: hsl(0,100%,100%);
}
#programmeSelector_label:focus{
	background-color: var(--c1);
}

/* #passwordInput > #passwordInput_label{
	background-color: #ffffff08;
}
#passwordInput > #submitPassButton{
	display: flex;
} */

#pane{
	position: fixed;
	top: 3rem;
	left: 0px;
	bottom: 0rem;
	right: 0px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	padding:0px 1rem 1rem 1rem;
	/* touch-action: none; */
	/* background-color: rgba(32,32,32,0.75); */
}
#paneContent{
	position: relative;
	max-width: 720px;
	background-color: var(--c2);
	/* color: #FFFFFF; */
	margin: auto;
	max-height: 100%;
	overflow: scroll;
	padding: 1rem;
	box-sizing: border-box;
	scrollbar-width: none;
	-ms-overflow-style: none;
}
#paneContent::-webkit-scrollbar {
	display: none;
}
/* .truncatedText::after {
	position: absolute;
	content: "...";
	inset-block-end: 0; 
	inset-inline-end: 0; 
} */
#drawer{
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	width: 100%;
	will-change: transform;
	transition-property: transform;
	transition-duration: 1.0s;
	transition-timing-function: cubic-bezier(0.25,0.5,0.0,0.99);
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	overflow: hidden;
	touch-action: none;
}
#drawerContent{
	/* color: #FFFFFF; */
}
#drawerContainer{
	/* color: #FFFFFF; */
	width: 100%;
}
#drawer > div > div{
	max-height: 100%;
	overflow: scroll;
	width: 100%;
	scrollbar-width: none;
	-ms-overflow-style: none;
	padding: 0rem 1rem 4rem 1rem;
	box-sizing: border-box;
	background-color: var(--c1);
	display: grid;
	/* grid-template-columns: repeat(2,minmax(320px, 1fr)); */
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	position: relative;
}
#drawer > div > div::-webkit-scrollbar {
	display: none;
}
#drawer > div > div > div:nth-child(3){
	grid-column: 1 / span 2;
}
#drawer > div > div > div:nth-child(3) > div{
	display: grid;
	/* grid-template-columns: repeat(2,minmax(320px, 1fr)); */
	grid-template-columns: 1fr 1fr;
	gap: 2rem;
	margin: 2rem 0px;
}

#popup{
	position: fixed;
	top: 0px;
	left: 0px;
	bottom: 0px;
	right: 0px;
	/* will-change: transform;
	transition-property: transform;
	transition-duration: 1.0s;
	transition-timing-function: cubic-bezier(0.25,0.5,0.0,0.99); */
	/* background-color: rgba(0,0,0, 0.67); */
	/* background-color: var(--c5); */
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	touch-action: none;
	padding: 1rem;
	box-sizing: border-box;
}

#popup > div{
	padding: 2rem;
	box-sizing: border-box;
	width: 100%;
	max-width: 32rem;
	max-height: 90%;
	/* background-color: var(--c5); */
	color: var(--c5);
	/* height: 100%; */
	/* will-change: opacity;
	transition-property: opacity;
	transition-duration: 1.0s;
	transition-timing-function: ease-out; */
	/* clip-path: polygon(2rem 0, 100% 0, 100% 100%, 0 100%, 0 2rem); */
	overflow: auto;
	scrollbar-width: none;
	-ms-overflow-style: none;
	border-radius: 1rem;
	/* border: 0.1rem solid var(--cA); */
}
#popup > div::-webkit-scrollbar {
	display: none;
}
#popup > .exhibitLabel > div{
	margin-bottom: 1rem;
}
#popup > .person > figure{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 0px;
}
#popup > .person > figure > img{
	width: 144px;
	height: 144px;
	flex-shrink: 0;
	/* border-radius: 50%; */
	object-fit: cover;
	margin-right: 1rem;
}
#popup > .person > figure > figcaption{
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 0px;
	margin: 0px;
	padding: 0px;
}
#popup .button_text{
	/* color: var(--c0); */
	padding-bottom: 0px;
}
#popup .button_text:hover{
	color: var(--cA);
}


#popup > .curated > figure{
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 0px;
}
#popup > .curated > figure > img{
	/* width: 144px; */
	height: 144px;
	flex-shrink: 0;
	/* border-radius: 50%; */
	/* object-fit: cover; */
	margin: 0px 1rem 0px 0px;
}
/* #popup > .curated > p{
	margin: 1rem 0px;
} */
/* #popup > .curated > figure > figcaption{
	color: hsl(0, 0%, 100%);
} */
#warning{
	position: fixed;
	bottom: 1rem;
	right: 1rem;
	font-size: 0.8rem;
	padding: 0.5rem;
	width: 33rem;
	text-align: justify;
	border: 1px var(--c1) solid;
	box-sizing: border-box;
	max-width: 75%;
	cursor: pointer;
}
#warning > a:hover{
	text-decoration: underline;
}
.marquee {
	position: absolute;
	bottom: 0rem;
	height: 2rem;
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
	left: 3.4rem;
	width: calc(100vw - 3.4rem);
	overflow: hidden;
	cursor: default;
	/* pointer-events: none; */
	/* mix-blend-mode: color-burn; */

}
.marquee_text {
	width: fit-content;
	width: -moz-fit-content;
	display: flex;
	position: relative;
	transform: translate3d(var(--move-initial), 0, 0);
	animation: marquee 20s linear infinite;
	/* animation-play-state: paused; */
	/* opacity: 0;
	transition: opacity 0.1s; */
}
.marquee_text:hover{
	/* animation: marquee 25s linear infinite; */
	animation-play-state: paused;
}
.marquee span {
	white-space: nowrap;
	font-size: 1rem;
	padding: 0 3.4rem;
	/* color: var(--c5); */
	/* font-weight: 900;
	line-height: 1.15; */
}
@keyframes marquee {
	0% {
		transform: translate3d(var(--move-initial), 0, 0);
	}

	100% {
		transform: translate3d(var(--move-final), 0, 0);
	}
}
footer{
	position: absolute;
	width: 100%;
	box-sizing: border-box;
	bottom: 0px;
	left: 0px;
	
	/* background-color: red; */
	/* height: 2rem; */
}
footer > div{
	box-sizing: border-box;
	padding: 1rem;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
footer > div > span{
	cursor: pointer;
}
#footer_navigation{
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
footer > span{
	/* cursor: pointer;
	font-size: 0.8rem;
	color: var(--palette-c-hex); */
}
.socials{
	font-family: var(--bold);
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
	align-items: center;
	/* position: absolute; */
	/* bottom: 0px; */
	/* right: 1rem; */
	/* width: 3.4rem; */
	/* height: 3rem; */
	gap: 1rem;
}
.socials > div{
	/* padding: 15px 0px; */
	/* margin-right: 1rem; */
	cursor: pointer;
	/* height: 1.7rem; */
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.socials > div > img{
	opacity: 0.8;
	pointer-events: none;
}
.socials > div:hover > img{
	opacity: 1;
}
.socials > div >svg{
	fill: var(--c5);
	pointer-events: none;
}
.socials > div:hover > svg{
	fill: var(--c5);
}
.logo{
	cursor: pointer;
}
.logo > *{
	pointer-events: none;
}
.logo:hover > svg > circle, .logo:hover > svg > rect{
	/* fill: var(--c5); */
}
.tool{
	cursor: pointer;
	width:1.5rem;
	height: 1.5rem;
}
.tool > *{
	pointer-events: none;
}
.tool > svg{
	fill:var(--c3);
}
.tool:hover > svg{
	fill:var(--c5);
}
#tip{
	position: fixed;
	top: 0px;
	left: 0px;
	padding: 0.25rem;
	background-color: var(--c0);
	color: var(--c5);
	font-size: 0.75rem;
	user-select: none;
	/* border: 1px solid hsl(0, 0%, 80%); */
}
.chip{
	cursor:pointer; 
	margin-left: 1rem; 
	background-color: var(--c5); 
	color: var(--c0); 
	padding: 0px 0.75rem; 
	white-space: nowrap;
	border-radius: 1rem;
}
.padded{
	padding-left: 1rem;
	padding-right: 1rem;
}
.padded > *{
	/* max-width: 768px;
	margin-left: auto;
	margin-right: auto;  */
}
.block{
	width: 100%;
	position: relative;
	padding-left: 1rem;
	padding-right: 1rem;
	margin-bottom: 2rem;
	box-sizing: border-box;
	/* padding-bottom: 2rem; */
}
/* .block > h6:nth-child(1){
	margin-top: 0px;
} */
.block_list{
	display: grid;
	grid-template-columns: 1fr;
	/* grid-template-columns: repeat(4, minmax(120px, 1fr)); */
	grid-template-rows: auto;
	gap: 2rem;
	grid-auto-rows: fit-content;
	width: 100%;
	margin-bottom: 2rem;
	padding-left: 1rem;
	padding-right: 1rem;
}
.block_flex{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 2rem;
	width: 100%;
	margin-bottom: 2rem;
	padding-left: 1rem;
	padding-right: 1rem;
}
.block_row{
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	/* grid-auto-columns: max-content; */
	/* grid-template-columns: repeat(4, minmax(120px, 1fr)); */
	grid-template-rows: 1fr;
	gap: 1rem;
	grid-auto-rows: fit-content;
	width: 100%;
	margin-bottom: 2rem;
	padding-left: 1rem;
	padding-right: 1rem;
	box-sizing: border-box;
}
.block_row > img{
	/* aspect-ratio: 2/1; */
	object-fit: cover;
	width: 100%;
}
.figure.v1{
	grid-column: span 1;
}
.figure.v2{
	grid-column: span 2;
}
.figure.w1{
	grid-row: span 1;
}
.figure.w2{
	grid-row: span 2;
}
.block_grid{
	position: relative;
	display: grid;
	/* grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); */
	/* grid-auto-columns: max-content; */
	/* grid-template-columns: repeat(4, minmax(120px, 1fr)); */
	grid-template-rows: auto;
	grid-auto-flow: dense;
	gap: 1rem;
	grid-auto-rows: fit-content;
	width: 100%;
	margin-bottom: 2rem;
	/* place-items: center center; */
	/* place-items: center center; */
	padding-left: 1rem;
	padding-right: 1rem;
	box-sizing: border-box;
}
section > div > .block_grid{
	padding-left: 0rem;
	padding-right: 0rem;
}

.block_grid > img{
	width: 100%;
}
.block_grid .figure{
	gap: 0.5rem;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 0px;
	cursor: pointer;
	width: 100%;
}
.block_grid .figure > img{
	width: 100%;
	object-fit: cover;
	object-position: center top;
}
.block_grid .thumbnail{
	gap: 0.5rem;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	margin: 0px;
	cursor: pointer;
	width: 100%;
}
.block_grid .thumbnail > *{
	pointer-events: none;
}
.block_grid .thumbnail > img{
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	object-position: center top;
}
.block_text_link{
	position: relative;
	padding: 1rem;
	box-sizing: border-box;
	min-height: 20vh;
	font-family: var(--bold);
	font-size: 1.5rem;
	color: var(--c5);
	background-color: var(--cP);
	cursor: pointer;
}
.block_text_link:hover{
}

.spacer{
	height: 2rem;
}

section > div:first-child{
	margin-top: 3rem 0px;
	/* padding-left: 1rem;
	padding-right: 1rem; */
	box-sizing: border-box;
}

.tile{
	padding: 1rem; box-sizing: border-box; width: 100%; background-color: #FFFFFF08;
	cursor: pointer;
}
.tile > h6{
	opacity: 1;
}
.tile > *{
	pointer-events: none;
}
.tile:hover{
	background-color: var(--cA);
	color: var(--c0);
}
.tile:hover > h6{
	opacity: 1;
}
.stretch{

}
.slideRightParent{
	background-color: transparent;
	/* transition-property: background-color, color, font-family;
	transition-duration: 0.5s, 0.01s 0.5s; */
	/* transition: background-color 0.5s, color 0.01s, font-family 0.5s;
	transition-timing-function: ease-out; */
}
.slideRight{
	
	place-self: start start;
	/* direction: ltr;
	width: 0%;
	text-align: right;
	white-space: nowrap;
	transition: 0.5s; */
	/* transition-timing-function: ease-out; */
}
.slideRightParent:hover{
	background-color: var(--cA);
	color: var(--c0);
	font-family: var(--bold);
}
.slideRightParent:hover > .slideRight{
	/* width: 100%;
	direction: ltr;   */
}
#toast{
	position: fixed;
	bottom: 0rem;
	left: 0rem;
	padding: 0px;
	/* background-color: #026b4e; */
	display: grid;
	grid-template-columns: auto auto;
	grid-template-rows: 1fr;
	/* gap: 2rem; */
	place-items: center start;
	max-width: 480px;
	color: var(--cW);
}
#toast > button{
	border: none;
	padding: 0px;
}
@media only screen and (max-width: 1024px){
	article{
		left: 33%;
	}
	#cap{
		grid-template-columns: 0.01fr 1fr 0.01fr;
	}
}
@media only screen and (max-width: 960px){
	.aboutContent > .noteVideo{
		display: grid;
		grid-template-rows: auto auto;
		grid-template-columns: 1fr;
		gap: 2rem;
	}
	/* #exhibit_names > div{ */
	.exhibit_names_list1{
		/* position: absolute; */
		/* bottom: 0px; */
		/* left: 0px; */
		display: flex;
		flex-wrap: nowrap;
		flex-direction: column;
		/* max-height: 26rem; */
		width: auto;
		padding: 4rem 0px;
		box-sizing: border-box;
		/* background-color: var(--c1); */
		overflow: scroll;
		/* display: none; */
		border-radius: 1rem;
	}
	.exhibit_names_list_kn{
		position: absolute;
		/* bottom: 0px; */
		/* left: 0px; */
		display: flex;
		flex-wrap: nowrap;
		flex-direction: column;
		max-height: 26rem;
		width: auto;
		padding: 0.5rem 0px;
		box-sizing: border-box;
		background-color: var(--c1);
		overflow: scroll;
		display: none;
		border-radius: 1rem;
	}
	#exhibit_names > div > div{
		/* padding: 0.2rem 0.5rem; */
		/* white-space: nowrap; */
		/* color: var(--c5); */
		/* cursor: pointer; */
		text-align: center;
	}
}
@media only screen and (max-width: 720px){
	#menupipe{
		display: none;
	}
	menu{
		position: fixed;
		top: 1rem;
		right: 1rem;
		margin: 0px;
		justify-content: flex-end;
		align-items: flex-start;
		/* mix-blend-mode: normal !important; */
	}
	.stretch{
		bottom: 1rem;
		left: 1rem;
	}
	.toggle{
		display: none;
	}
	#menuButton{
		display: block;
	}
	ul{
		padding: 0px;
		margin: 0px;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 0.5rem;
		padding: 1rem;
		margin: 0px;
		width: 8rem;
		background-color: var(--c1);
		/* color:var(--c5); */
	}
	li{
		font-family: var(--bold), sans-serif;
		list-style: none;
		cursor: pointer;
		font-size: 1.0rem;
		/* color: var(--c3); */
		width: fit-content;
		width: -moz-fit-content;
		overflow: hidden;
		white-space: nowrap;
		user-select: none;
		margin: 0px 0rem;
		/* text-transform: uppercase; */
	}
	li > span{
		display: inline-block;
		will-change: transform;
		transition-property: transform;
		transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94);
		transition-duration: 0.5s;
		pointer-events: none;
	}
	/* .upcoming > p > span:nth-Child(1){
		line-height: 3.5rem;
	} */
	.upcoming > p > span:nth-Child(2){
		font-size: 1.25rem;
	}
	article{
		left: 1rem;
	}
	.details > p:nth-Child(3), .details > p:nth-Child(4){
		display: none;
	}
	form{
		gap: 1rem;
	}
	
	#page > p{
		/* max-width: 45rem; */
		display: -webkit-box;
		-webkit-line-clamp: 8;
		-webkit-box-orient: vertical;
		overflow: hidden;
		/* font-size: 0.75rem; */
		/* line-height: 1.1; */
		/* text-shadow: 0px 0px 1rem #ffffff; */
		/* user-select: none; */
	}
	
}
@media only screen and (max-width: 640px){
	h1{
		font-size: 3rem;
	}
	#compressButton{
		display: none;
	}
	.overlay{
		padding: 4rem 1rem 1.7rem 1rem;
	}
	#exhibits > .exhibitThumbnail{
		/* opacity: 0.99; */
	}
	.fullHeight{
		/* max-height: 100%; */
		opacity: 0.99;
	}
	
	#programmesList > .programmeItem > div:nth-child(2){
		padding: 0px;
	}
	.programmeItem{
		/* grid-template-columns: minmax(0px, 1fr) 12rem; */
		grid-template-columns: 1fr;
		grid-template-rows: auto auto;
	}
	.programmeItem > div:nth-Child(3){
		/* font-family: var(--regular); */
		padding-top: 1rem;
		place-self: start start;
	}
	.programmeItem > div:nth-Child(2){
		display: none;
	}
	#filters{
		grid-template-columns: minmax(0px, 1fr) 0rem 6rem;
	}
	/* #filters > div:nth-Child(2){
		display: none;
	} */
	#drawer > div > div{
		grid-template-columns: 1fr;
	}
	#drawer > div > div > div:nth-child(3){
		grid-column: 1 / span 1;
	}
	#drawer > div > div > div:nth-child(3) > div{
		grid-template-columns: 1fr;
	}
	article{
		left: 0rem;
		top: 0rem;
		right: 0rem;
		bottom: 0rem;
		border-radius: 0px;
	}
}
@media only screen and (max-width: 400px){
	html{
		font-size: 13px;
	}
	#popup{
		/* justify-content: flex-start; */
		/* align-items: center; */
	}
}

@media (max-aspect-ratio: 4/3) {
	#exhibitName{
		grid-area: 3 / 1 / 5 / 5;
	}
	#exhibits{
		grid-template-columns: repeat(4, 1fr);
		grid-template-rows: repeat(6, minmax(0, 1fr));
		gap: 1rem;
		bottom: 0px;
		box-sizing: border-box;
		padding: 3.4rem 1rem 45px 1rem;
		grid-template-areas: 	"a b c d"
								"e f g h"
								"i j k l"
								"m n o p"
								"q r s t"
								"u v w x";
	}
}
@media (max-aspect-ratio: 4/5) {
	#exhibitName{
		display: none;
	}
	#exhibits{
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: repeat(8, minmax(0, 1fr));
		gap: 1rem;
		bottom: 0px;
		box-sizing: border-box;
		padding: 3.4rem 1rem 45px 1rem;
		grid-template-areas: 	"a b c"
								"d e f"
								"g h i" 
								"j k l"
								"m n o" 
								"p q r"
								"s t u" 
								"v w x";
	}
}