/* baseline */
@font-face{ font-family:'Roboto Slab'; src:url('roboto-slab-v9-latin-700.woff2') format('woff2'), url('roboto-slab-v9-latin-700.woff') format('woff'); font-weight:700; font-style:normal; font-display:swap; }
@font-face{ font-family:'Roboto Slab'; src:url('roboto-slab-v9-latin-regular.woff2') format('woff2'), url('roboto-slab-v9-latin-regular.woff') format('woff'); font-weight:400; font-style:normal; font-display:swap; }
html { font:normal 400 16px 'Roboto Slab', serif; height:100%; background-color:#fff; }
body { box-sizing:border-box; min-height:100%; margin:0; padding:0; }
a { color:black; }
h1 { color:#ff7f00; margin:0; }
.visuallyhidden { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }

/* default styles*/
header { background-color:#111; background:radial-gradient(ellipse at center,#333 0,#111 67%); padding:6rem 1rem; text-align:center; margin-bottom:1rem; }
	header p { color:white; max-width:500px; margin:1rem auto 0;}
.schedule { display:block; margin:2rem; }
	.schedule > * { width:100%; }
		h2 { margin-top:3rem; }
		.slot { margin-bottom:2rem; }
			.info { }
				.info summary { text-decoration:underline dashed; color:#e06f00; cursor:pointer; }
				.info[open] summary { color:black; text-decoration:none; }
					.info h3 { display:inline; }
					.info br { margin-bottom:1rem; }
			.performer { }
				.performer ul { list-style-type:none; margin:0; padding:0; display:inline; }
					.performer li { display:inline; position:relative }
			.tools { list-style-type:none; margin:0; padding:0; margin-top:.5rem; }
				.tools li { display:inline; position:relative; padding-right:.5rem; }
					.tools li a { }
			.location { }
			.time { display:none; }

footer { background-color:#111; padding:1rem; margin-top:4rem; color:white; }
	footer a { padding:0 .5rem; color:white; }

/* table view */
@media all and (min-width:700px) {
.schedule { display:flex; flex-wrap:wrap; margin:5rem 2rem 3rem; padding:0; border:solid 1px black; }
	.schedule > * { box-sizing:border-box; flex-grow:1; margin:0; padding:1rem; list-style:none; border:solid 1px black; width:25%; }
	.schedule > .stretch { width:75%; text-align:center; font-weight:normal; font-size:1.2rem; }
		h2 { margin-top:0; text-align:center; }
		.slot { position:relative; }
			.info { }
			.performer { }
			.slot.first .location { position:absolute; top:-3rem; left:0; width:100%; text-align:center; font-weight:bold; font-size:1.5rem; }
			.slot:not(.first) .location { border:0; clip:rect(0 0 0 0); height:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; width:1px; }
			.time { }
}

/* presentation mode */
.presentation { padding-top:1rem; padding-bottom:.5rem; color:#fff; }
.presentation header { background:none; padding:0; }
	.presentation h1 { font-size:1.2rem; color:#ff7f00; width:25%; }
	.presentation h1::before { content:'https://'; opacity:.7; }
.presentation .schedule { margin-top:1rem; border-color:white; }
	.presentation .schedule > * { border-color:white; }
						.presentation .performer a { text-decoration:none; color:inherit; }
			.presentation .tools { display:none; }
			.presentation .info summary { list-style:none; text-decoration:none; color:#fff; max-height:4.8rem; overflow:hidden; transition:color 2s; }
			.presentation .slot.updated .info summary { color:#e06f00; transition:color .25s; }
			.presentation .info p { display:none; }