:root
{
	--light:#ffffc8;
	--dark:#00141f;
	--dimm:#828282;
	
	--page-width:1050px;
	--page-padding:10px;
	--spacing:10px;
	--margin:30px;
	--page-header-margin:30px 40px;
	--page-top-margin:55px;
	--section-margin:75px;
	
	--slide-button:26px;
	
	--tagline-type:20px;
	--menu-type:14px;

	--title-type:28px;
	--title-line:32px;
		
	--default-type:20px;
	--default-line:28px;

	--intro-type:26px;
	--intro-line:calc(30/26);

	--small-type:14px;
	--small-line:20px;
	
	--button-type:14px;
	--button-line:23px;
	--header-bar-line:25px;

	--curve:cubic-bezier(.23,.34,.18,1);	
}

html
{
	height:100%;
	
	scroll-behavior: smooth;
}
body
{
	margin:0;
	padding:0;
	height:100%;
	
	font-family:'kobern',sans-serif;
	font-size:var(--default-type);
	line-height:var(--default-line);
	font-weight:normal;
	font-style:normal;

	-webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
	
	background-color:var(--dark);
	color:var(--light);
}
body *
{
	box-sizing: border-box;
  -moz-box-sizing: border-box;
}
.is-hidden
{
	display:none !important;
}
.no-pointer-events
{
	pointer-events:none;
}
.pointer-events
{
	pointer-events:all;
}
.clickable
{
	cursor:pointer;
}
.dimmed
{
	opacity:.4;
}
.no-transition
{
	transition:none !important;
}
.no-scrollbar
{
	scrollbar-width: none; /* FF */
	-ms-overflow-style: none; /* Edge */
}
.no-scrollbar::-webkit-scrollbar
{
	display: none;
}
.flex
{
	display:flex;
}
.flex.center
{
	justify-content: center;
}
.flex-center-vertical
{
	align-items: center;
}
.flex-wrap
{
	flex-wrap:wrap;
}
.flex-break
{
	flex-basis:100%;
	height:0;
}
.clear:after
{
	content:'';
	display:table;
	clear:both;
}
.full-width
{
	width:100% !important;
}
.nowrap
{
	white-space:nowrap;
}
a
{
	color:inherit;
}

.button,
.bar,
form.jf input[type="submit"].button
{
	display:inline-block;
	padding:0 10px;
	border-radius:10px;

	background-color:var(--light);
	color:var(--dark);
	border:1px solid transparent;
	
	text-decoration:none;
	text-transform:uppercase;

	font-family:var(--sans);
	font-size:var(--button-type);
	line-height:var(--button-line);
	
	transition:all .3s ease 0s;

	-webkit-appearance:none;
	-moz-appearance:none;
	-ms-appearance:none;
}
.button.large
{
	font-size:var(--button-large-type);
	line-height:var(--button-large-line);
	padding:0 20px !important;
}
.button.transparent,
.button.cancel
{
	/* background-color:var(--light); */
	color:var(--light);
	background-color:var(--dark);
	border-color:var(--light);
	
}
.button.invert
{
	background-color:var(--light);
	color:var(--dark);
}
.button .social
{
	margin-bottom:-1px
}
.button + .button
{
	margin-left:var(--spacing);
}

.text-accent
{
	color:var(--accent);
}
.sans
{
	font-family:var(--sans);
}
.ellipsis
{
	display:-webkit-box;
  -webkit-box-orient:vertical; 
  -webkit-line-clamp:5;
  overflow: hidden;        
}
.warning
{
	color:var(--alert);
}

/* inverted colorscheme for item pages */

body.item
{
	/* dark on light */
	background-color:var(--light);
	color:var(--dark);
}

body.item .button,
body.item form.jf input[type="submit"].button
{
	/* background-color:var(--light); */
	color:var(--light);
	background-color:var(--dark);
	border-color:var(--dark);
	
}
body.item .button.transparent
{
	color:var(--dark);
	background-color:var(--light);
	border-color:var(--dark);

}
body.about,
body.about .button.transparent
{
	background-color:var(--dimm);
}

/* header, menu */

header
{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	padding:var(--page-header-margin);
	display:flex;
	justify-content: space-between;
	
	z-index:1000;
}
header nav
{
	line-height: 1;
}
header .button
{
	margin-bottom:var(--spacing);
}


/* layout */

body
{
	padding:var(--page-padding);
}
.page-centered
{
	position:relative;
	margin:auto;
	max-width:var(--page-width);
}
.page
{
	padding-bottom:var(--section-margin);
}
.page-centered .logo
{
	margin:var(--page-top-margin) 0 var(--section-margin) 0;
	text-align:center;
}
.page-centered .tagline
{
	margin:var(--section-margin) 0;
	font-size:var(--tagline-type);
	line-height:1.2;
}

.page-network
{
	/* margin-top:90px; */
}
.network .page > .head
{
	height:60px;
}

.column
{
	width:calc((100% - var(--spacing)) / 2);
}
section
{
	position:relative;
}


/* page header */

.page > .head
{
/* 
	position:sticky;
	top:var(--page-top-margin);
 */
	margin-bottom:30px;
	z-index:1999;
}
.page > .head:empty
{
	display:none !important;
}


/* highlights */

.highlights .navigation
{
	margin-top:var(--margin);
}
.highlights a.more
{
	display:block;
	margin:var(--spacing) 0;
}
.highlights .cms-inline-media,
.highlights .slides
{
	aspect-ratio: 16/9 !important;
}


/* grids */

.grid
{
	flex-wrap:wrap;
	justify-content:space-between;
}
.grid .item
{
	position:relative;
	
	flex-basis:calc((100% - var(--spacing)) / 2);
	margin-right:var(--spacing);

	text-decoration:none;

	word-break: break-word;
	overflow-wrap: break-word;
}
.grid .item:empty
{
	display:none;
}
.grid .item.no-bottom-margin
{
	margin-bottom:0;
}
.grid a.item:hover
{
	background-color:var(--light);
	color:var(--dark);
}

.grid .item .media
{
	aspect-ratio:16/9;
	background-color:rgba(0,0,0,.1);
}
.grid .item .media img
{
	display:block;
	width:100%;
	aspect-ratio:16/9;
	object-fit: cover;
	transition: opacity .6s ease 0s;
	opacity:0;
}
.grid .item .media:not(.in-view) img
{
	opacity:0 !important;
}
.grid .item .meta
{
	margin-top:5px;
}
.grid .item h2
{
	margin:.5em 0;
  -webkit-line-clamp:2;
}
.grid .item .short
{
  -webkit-line-clamp:5;
}


/* news */

.grid.news
{
	justify-content:flex-start;
}
.grid.news:first-child .item
{
	flex-basis:100%;
	margin-right:0;
}
.grid.news .item:nth-child(even)
{
	margin-right:0;
}


/* typo / article */

.title,
h2,
form.jf h2
{
	font-size:var(--title-type);
	font-weight:700;
	line-height: var(--title-line);
}
.title.regular
{
	font-weight:400;
}
.title.section
{
	border-top:1px solid var(--dark);
	margin-top:var(--page-padding-y);
	padding-top:.75em;
}
.subtitle,
.intro,
blockquote
{
	font-size:var(--intro-type);
	line-height:var(--intro-line);
}
sup
{
	font-size:.7em;
	line-height:.8;
}

.meta
{
	font-family: courier;
	font-size:12px;
	line-height:1.5;
}

.issue-color
{
	display:inline-block;
	width:8px;
	height:8px;
	margin-right:4px;
}

h1:not(:hover) .edit
{
	/* display:none; */
}
h1 .edit,
h2 .edit
{
	margin-left:10px;
	font-size:12px;
	font-weight:normal;
	line-height:18px;
	cursor:pointer;
	vertical-align: text-top;
	
}
article h1
{
	margin-top:0;
}
blockquote
{
	margin:1em auto;
	max-width:50%;
	text-align:center;
	border-top:1px solid var(--dark);
	border-bottom:1px solid var(--dark);
}
.callout
{
	margin:1em auto;
	padding:.8em;
	max-width:62.5%;
	border:1px solid var(--dark);
}
section > h2
{
	margin-top:0;
}

.page-width,
hr
{
	width:calc(100vw - (var(--page-padding) * 2));
	margin-left:min(0px, calc(((100vw - var(--page-width)) / -2) + var(--page-padding)));
}

hr
{
	margin-top:var(--section-margin);
	margin-bottom:var(--section-margin);
	
  border: none;
  height: 3px;
  
  /* custom dotted line */

  background-image: radial-gradient(circle, var(--dimm) 1.5px, transparent 1.5px);
  background-size: 8px 3px;
  background-repeat: repeat-x;
}



/* agenda */

.agenda > .heading
{
	font-size:var(--intro-type);
	margin:40px 0 15px 0;
}
.agenda-list
{
	margin-bottom:calc(var(--spacing) * 2);
	/* min-height:calc(100vh - 200px - var(--page-padding-y)); */
}
.agenda-list hr,
.agenda-list + hr
{
	margin:0;
	height:0;
	border:none;
	border-top:1px solid var(--dimm);
	width:100%;
	background:none;
}
.agenda-list + hr
{
	margin-bottom:var(--spacing);
}
.header.bar
{
	display:block;
	border-radius:0;
	line-height: var(--header-bar-line);
}
.button.tickets
{
	font-weight:bold;
}
.event
{
	position: relative;
	width:100%;
	text-decoration:none;
	padding:var(--spacing) 0;
	/* align-items: center; */
	transition:background-color .3s ease 0s;
}
.event:hover
{
	background-color:var(--light);
	color:var(--dark);
}
.event:hover .button
{
	background-color:var(--dark);
	color:var(--light);
	/* transition:none; */
}
.event.past
{
	/* opacity:.5; */
}
.event .media
{
	width:160px;
	min-width: 160px;
	aspect-ratio:16/9;
	transition:opacity .6s ease 0s;
	flex-grow:0;
}
.event .media img
{
	display:block;
	width:100%;
	height:100%;
	/* aspect-ratio: 16/9; */
	object-fit:cover;
}
.event .media:not(.in-view)
{
	opacity:0;
}
.event section
{
	padding:0 10px;
	flex:1;
	min-width:0; /* this makes the ellipsis work */
}
.event section > *
{
	overflow:hidden;
	white-space:nowrap;
	text-overflow:ellipsis;
}
.event section .info
{
	font-size:var(--small-type);
	line-height: var(--small-line);
}
.event section .info .label,
.event-info .label
{
	color:var(--dimm);
}


.event h2
{
	margin:.1em 0;
	/* margin:-.15em 0 .4em 0; */
}
.event .button
{
	align-self:center;
}

.event-info 
{
	margin:var(--spacing) 0;
}
.event-info .venue
{
	font-size:var(--intro-type);
	font-weight:bold;
	/* --intro-line:calc(30/26); */

}
.event-info + .button.tickets
{
	margin-bottom:30px;
}

.event-title
{
	margin:1em 0;
	font-size:var(--title-type);
	line-height: var(--title-line);
}
.event-title 	.line-up
{
	font-weight: normal;
}


.body.agenda .intro .button
{
	margin-top:30px;
	font-weight:bold;
}
.body.agenda .intro
{
	margin-bottom:30px;
}



/* media */

.cms-inline-media
{
	position:relative;
}
.cms-inline-media-thumb,
article .cms-inline-media:not(:has(.slide))
{
	display:none;
}

article .cms-inline-media.left,
article .cms-inline-media.right
{
	width:calc((100% - var(--spacing))/2);
}
article .cms-inline-media.left
{
	float:left;
	margin-right:var(--spacing);
}
article .cms-inline-media.right
{
	float:right;
}
article .cms-inline-media.right + *
{
	clear:both;
}
article .cms-inline-media
{
	margin-bottom:2em;
	--slides-scale:100%;
}
article .cms-inline-media:not(.right)
{
	clear:left;
}
.cms-inline-media[data-caption]::after
{
	content:attr(data-caption);
	display:block;
	width:var(--slides-scale);
	margin:auto;

	
	font-size:12px;
	font-family: courier;
	

	min-height:1.5em;
}
.slides
{
	position:relative;
	margin:auto;
	/* width:100%; */
	max-height:var(--media-max-height);
	aspect-ratio: auto;
}
.slides .slide
{
	/* max-height:var(--media-max-height); */
	transition:opacity .6s ease 0s;
}
.slides .slide img
{
	margin:auto;
}
.slides .slide.single img
{
	width:100%;
}
.slides
{
	aspect-ratio:auto;
}
.slides .arrow
{
	position:sticky;
	top:50%;
	
/* 
	display:flex;
	align-items:center;
	z-index:auto;
 */
	
	text-align:center;
	padding:0;
	
	border-radius:50%;
	
	
	min-width:var(--slide-button);	
	height:var(--slide-button);

	cursor:pointer;
	
	color:var(--light);
/* 
	background-color:var(--light);
	color:var(--dark);
 */
}
.slides .arrow svg
{
	pointer-events:none;
}
.slides .arrow.prev
{
	right:calc(100% - 10px);
	transform:translate(100%,calc(var(--spacing) * -1));
}
.slides .arrow.prev svg
{
	/* transform:rotate(90deg); */
}
.slides .arrow.next
{
	right:10px;
	transform:translateY(calc(var(--spacing) * -1));
}
.slides .arrow.next svg
{
	transform:rotate(180deg);
}
.slides + .navigation
{
	display:none;
}
.slides + .navigation .dot
{
	border-radius:3px;
	background-color:var(--light);
}
.slides .slide .embed-wrapper
{
	/* width:100%; */
	max-width:100%;
	max-height:var(--media-max-height);
	
	overflow:hidden;
	flex-shrink:0;
	background-size:cover;
	background-position:center;
}
.slides .slide.single .embed-wrapper
{
	margin:auto;
	height:100%;
}
.slides .slide:not(.in-view)
{
	opacity:0;
}

.embed-wrapper iframe
{
	width:100%;
	height:100%;
  object-fit: cover;
}

#zoom
{
	position:fixed;
	inset:0 var(--spacing);
	z-index:2000;
	
}
#zoom .slides
/* 
#zoom .slides .slide,
#zoom .slides .slide .embed-wrapper
 */
{
	max-height:calc(100vh - 80px);	
}
#zoom .cms-inline-media
{
	margin-top:var(--slides-valign);
}

#zoom .fill.fade
{
	position:absolute;
	inset:0;
	opacity:.89;
	z-index:-1;
	
}
.cms-inline-media.placeholder
{
	visibility: hidden;
}

.downloads 
{
	flex-direction: column;
	align-items: flex-start;
}
.downloads > .button
{
	margin-bottom:10px !important;
}


/* form */

form.jf
{
	margin:0;
	--row-spacing:15px;
	--accent:var(--dimm);
	font-family: var(--sans);
	/* font-size:var(--small-type); */
}
.about form.jf
{
	--accent:var(--light);
}
form.jf .header.bar
{	
	margin:30px 0 var(--spacing) 0;
}

form.jf.inline input,
form.jf.inline textarea,
form.jf.inline select,
form.jf.inline label.input
{
	/* margin-bottom:0; */
	border-radius:0;
}
form.jf div.check
{
	border:none;
}
form.jf svg.icon.expand,
form.jf svg.icon.locked
{
	top:2.4em;
}
form.jf em.guide
{
	color:var(--dimm);
	opacity:1;
	margin-top:.4em;
	line-height:1.5;
}




/* responsive layouts */


@media (max-width:900px)
{
	:root
	{
		--page-header-margin:15px 10px;
		--page-top-margin:70px;
		--spacing:5px;

	}
	
	header
	{
		flex-wrap:wrap;
	}

	/* single column layout */
	
	

	.grid .item
	{
		flex-basis:100%;
		margin-right:0;
		margin-bottom:var(--section-margin);
	
	}
	.articles hr
	{
		display:none;
	}
	.grid .item::after
	{
		content:'';
		display: block;
		width:100%;
		margin-top:var(--section-margin);
		height:3px;
		background-image: radial-gradient(circle, var(--dimm) 1.5px, transparent 1.5px);
		background-size: 8px 3px;
		background-repeat: repeat-x;
	}

	
	.event
	{
		flex-wrap:wrap;
		padding:10px 0;
	}
	.event .media
	{
		width:calc(240 / 900 * 100vw);
		min-width:0;
	}
	
	.grid.related .item
	{
  	flex-basis: calc((100% - var(--spacing)) / 2);	
  }
  .grid.related .item:nth-child(2n)
  {
  	margin-right:0;
  }
}


@media (max-width:500px)
{
	.event .media
	{
		min-width: 100%;
/* 
		width:120px;
		min-width:120px;
 */
	}
	.event section
	{
		flex-basis: 100%;
		padding:10px 0;
	}
	.event .button
	{
		margin:0 auto 10px auto;
	}

	.grid.alternating .item:not(:nth-child(3n + 1)) h2,
	.grid.related .item h2
	{
		font-size:calc(.75 * var(--title-type));
	}
	
	blockquote
	{
		max-width: 80%;
	}

}