@import url('https://fonts.googleapis.com/css2?family=Space+Mono&display=swap');

* {
	-webkit-font-smoothing: antialiased;
}

html, body {
  height: 100%;
  overflow: hidden;
}




@font-face {
	font-family: 'founders_groteskmedium';
	src: url('assets/fonts/foundersgrotesk-medium-webfont.woff2') format('woff2'),
		 url('assets/fonts/foundersgrotesk-medium-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'founders_groteskregular';
	src: url('assets/fonts/foundersgrotesk-regular-webfont.woff2') format('woff2'),
		 url('assets/fonts/foundersgrotesk-regular-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;

}

@font-face {
	font-family: 'founders_grotesksemibold';
	src: url('assets/fonts/foundersgrotesk-semibold-webfont.woff2') format('woff2'),
		 url('assets/fonts/foundersgrotesk-semibold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'founders_grotesk_condensedLt';
	src: url('assets/fonts/foundersgroteskcond-lt-webfont.woff2') format('woff2'),
		 url('assets/fonts/foundersgroteskcond-lt-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'founders_grotesk_x-condenseBd';
	src: url('assets/fonts/foundersgroteskxcond-bold-webfont.woff2') format('woff2'),
		 url('assets/fonts/foundersgroteskxcond-bold-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}


body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-family: 'founders_groteskregular';
	/* font-family: 'Space Mono', monospace; */
	line-height: 1.1rem;	
}

.show {
	/* border: solid 1px red; */
}

h2 {
	display: block;
	font-size: 1.5rem;
	font-size: 2vw;
	margin-block-start: 0;
	margin-block-end: 0;
	margin-inline-start: 0px;
	margin-inline-end: 0px;
	font-weight: bold;
}

h2 button {
	text-transform: uppercase;
	line-height: 0;
}

strong {
	font-family: 'founders_groteskmedium';
	font-weight: normal;
}

/* LAYOUT */

.sitewrapper {
  	display: flex;
  	height: 100vh;
}

#voor,
#door {
	position: relative;
	flex: 50%;
	/* padding: 2rem 3rem; */
}

#door {
	background-color: rgba(255, 255, 255, 1.0);
	padding-top: 6vw;
	overflow-y: scroll;
	overflow-x: hidden;
	padding-left: 0.5vw;
	padding-right: 1.0vw;
}

#voor {	
	/* background-color: rgba(237, 237, 237, 0.9) */
	background-color: #222;
	background-color: #fff;
	overflow-y: scroll;
	overflow-x: hidden;
	padding-top: 4.5vw;
	padding-left: 0.5vw;
	padding-right: 0.5vw;
}

.scrollme {
}

#box-speakers {
	background-color: rgba(255, 255, 255, 1.0);
	height: 100vh;
}

/* #grid-affiches {
	position: fixed;
}

#grid-posters {
	width: 100%;
	height: 100%;
} */

#container {
	position: fixed;
  }
  
  .animated {
	position: absolute;
	display: none;
	top: 0;
	left: 0;
	/* height: 100vh; */
	max-width: 50vw;
  }

/* .affiche {
	padding: 2vw;
}

.caption {
	font-size: 0.8rem;
	font-size: 1vw;
	color: #ddd;
	text-indent: 0;
} */

#logo {
	width: 100%;
}

/* HEADER VOOR & DOOR */


#header-voor,
#header-door {
	display: flex;
	position: fixed;
	overflow: hidden;
	height: 3vw;
}

#header-voor {
	/* border: solid 1px red; */
	background-color: transparent;
	width: 50%;
	right: 0;
	top: 0;

}

#header-door {
	top: 0;
	left: 0;
	width: 50%;

}

#header-voor a,
#header-door a {
	text-transform: uppercase;
	text-decoration: none;
	font-size: 5vw;
	margin-right: -1vw;
	line-height: 1.1vw;
	margin-left: 1vw;
	cursor: default;

}

#header-voor a {
	color: #FFF;
	
}

#header-door a {
	color: #000;
}

footer {
	margin-top: 5vw;
}


/* ACCORDION STUFF */

.accordion {
	--bs-accordion-color: var(--bs-body-color);
	--bs-accordion-bg: var(--bs-body-bg);
	--bs-accordion-transition: color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,border-radius 0.15s ease;
	--bs-accordion-border-color: var(--bs-border-color);
	--bs-accordion-border-width: var(--bs-border-width);
	--bs-accordion-border-radius: var(--bs-border-radius);
	--bs-accordion-inner-border-radius: calc(var(--bs-border-radius) - (var(--bs-border-width)));
	--bs-accordion-btn-padding-x: 1.25rem;
	--bs-accordion-btn-padding-y: 0.5vw;
	--bs-accordion-btn-color: var(--bs-body-color);
	--bs-accordion-btn-bg: var(--bs-accordion-bg);
	--bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	--bs-accordion-btn-icon-width: 1.5vw;
	--bs-accordion-btn-icon-transform: rotate(-180deg);
	--bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
	--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230a58ca'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
	--bs-accordion-btn-focus-border-color: #86b7fe;
	--bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
	--bs-accordion-body-padding-x: 1.25rem;
	--bs-accordion-body-padding-y: 1rem;
	--bs-accordion-active-color: var(--bs-primary-text);
	--bs-accordion-active-bg: var(--bs-primary-bg-subtle);
}

.accordion-body {
	padding-left: 0;
}
.accordion-body p,
p  {
	text-indent: 2vw;
	font-size: 1.3vw;
	line-height: 1.5vw;
}

.accordion-body ul {
	margin-left: 1.4vw;
}
.accordion-body li a {
	font-size: 1.3vw;
	line-height: 1.5vw;
	color: #000;
	opacity: 1.0;
}

.accordion-body li a:hover {
	color: #000;
	opacity: 0.5;
}


.accordion-button {
	position: relative;
	display: flex;
	align-items: center;
	width: 100%;
	padding: var(--bs-accordion-btn-padding-y) 0;
	font-size: 1.5vw;
	color: var(--bs-accordion-btn-color);
	text-align: left;
	background-color: var(--bs-accordion-btn-bg);
	border: 0;
	border-radius: 0;
	overflow-anchor: none;
	transition: var(--bs-accordion-transition);
	opacity: 1.0;
}

.accordion-button:hover {
	opacity: 0.5;

}

.accordion-button:not(.collapsed) {
	color: #000;
	background-color: transparent;
	box-shadow: inset 0 0 0 #000;
}

.accordion-button::after {
	flex-shrink: 0;
	width: 0;
	height: var(--bs-accordion-btn-icon-width);
	margin-left: auto;
	content: "";
	background-image: none;
	transition: var(--bs-accordion-btn-icon-transition);
}

.accordion-item {
	color: #000;
	background-color: transparent;
	border: 1px solid #000;
}


.date {
	position: absolute;
	right: 0;
	display: inline-block;

}

@include media-breakpoint-only(xs) {
	.sitewrapper {
		  display: flex;
		  height: 100vh;
	}
	
	#voor,
	#door {
		position: relative;
		flex: 100%;
		/* padding: 2rem 3rem; */
		overflow-y: scroll;
		overflow-x: hidden;
		padding-left: 2vw;
		padding-right: 2vw;
	}

}
@include media-breakpoint-only(sm) {
	.sitewrapper {
		  display: flex;
		  height: 100vh;
	}
	
	#voor,
	#door {
		position: relative;
		flex: 100%;
		/* padding: 2rem 3rem; */
		overflow-y: scroll;
		overflow-x: hidden;
		padding-left: 2vw;
		padding-right: 2vw;
	}

	}