.fokus .cancelled { display: inline-block; background: #AA0101; color: #FFFFFF; border-radius: 2px; padding: 2px 5px; font-size: .875em; }
.fokus .dows { display: table; }
.fokus .dows .dow { display: table-row; }
.fokus .dows .dow > span { display: table-cell; }
.fokus .dows .dow > span:not(:last-child) { padding-right: 2rem; }
.fokus .dows .dow .name { white-space: nowrap; width: 20%; }
.fokus .dows .dow .forenoon:empty:after, .fokus .dows .dow .afternoon:empty:after { content: '-'; opacity: .5; }
.fokus .dows .dow .forenoon, .fokus .dows .dow .afternoon { }

.fokus.preview .event
{
	position: relative;
	display: block;
	overflow: hidden;
	margin: 0 0 1.5rem 0;
	min-height: 5rem;
}
.csc-header + .fokus.preview
{
	margin-top: 1rem;
}
.fokus.preview .event a
{
	text-decoration: none;
	color: inherit;
}
.fokus.preview .event a:hover
{
	color: #AA0101;
}

.fokus.preview .media
{
	position: absolute;
	width: 5rem;
}

.fokus.preview .image
{
	position: relative;
	display: block;
	overflow: visible;
	width: 100%;
	text-align: center;
}

.fokus.preview .image img
{
	background: #F0F0F0;
	max-width: 5rem;
	max-height: 5rem;
}

.fokus.preview .text
{
	padding: 0 0 0 90px;
}

.fokus.preview .text .title
{
	font-weight: bold;
}

.fokus.preview .text .title,
.fokus.preview .text .location
{
	display: block;
}

.fokus.preview .text .location:before
{
	display: none;
}

.fokus.preview .date:after
{
	content: ', ';
}


.fokus.preview-large { display: flex; flex-flow: column nowrap; }
.fokus.preview-large .event { position: relative; overflow: hidden; display: flex; flex-flow: column; width: 100%; box-sizing: border-box; }
.fokus.preview-large .event:not(:last-child) { padding-bottom: 3rem; border-bottom: 1px solid #EEEEEE; margin-bottom: 3rem; }

.fokus.preview-large .meta { display: flex; flex-flow: row wrap; justify-content: flex-start; font-weight: bold; color: #888888; }
.fokus.preview-large .meta > *:not(:last-child):after { content: '|'; opacity: .5; margin: 0 .5rem; }
.fokus.preview-large .time { }
.fokus.preview-large .date { }
.fokus.preview-large .location:before { display: none; }
.fokus.preview-large .title { font-weight: bold; font-size: 1.75em; margin-bottom: .25em; }
.fokus.preview-large .subtitle { font-weight: bold; font-size: 1.25em; margin-bottom: .25em; }
.fokus.preview-large .title + .subtitle { margin-top: -.375em; }
.fokus.preview-large .media:not(:empty) { margin-bottom: .5em; }
.fokus.preview-large .media .image { position: relative; display: flex; justify-content: flex-start; align-items: center; overflow: hidden; max-height: 680px; }
.fokus.preview-large .media .image img { max-width: 100%; max-height: 100%; object-fit: cover; }
.fokus.preview-large .description { margin-bottom: 1em; }

.fokus.preview-large .data > span { display: flex; flex-flow: row nowrap; }
.fokus.preview-large .data > span:not(:last-child) { margin-bottom: .5rem; }
.fokus.preview-large .data > span b { min-width: 8rem; }
.fokus.preview-large .data > span b:after { content: ': '; }
.fokus.preview-large .data > span b + * { word-break: break-word; }

.fokus.preview-large .ticket-link { margin-top: 1rem; }
.fokus.preview-large .ticket-link b { display: none; font-size: 0; text-indent: -99rem; overflow: hidden; }
.fokus.preview-large .ticket-link a i { margin-left: -.25rem; padding-right: .25rem; }
.fokus.preview-large .ticket-link a span { }

@media only screen and (max-width: 979px) {
	.fokus.preview-large .media .image { display: block; max-height: none; max-width: 440px; }
	.fokus.preview-large .media .image img { object-fit: cover; }
}

@media (max-width: 1459px) {
	.fokus.preview-large .media .image { max-height: 440px; }
}

@media (max-width: 640px) {
	.fokus.preview-large .data > span { display: flex; flex-flow: column nowrap; }
}



.fokus .button,
.fokus .button:hover {
	position: relative;
	display: inline-block;
	margin: .25rem 0 0 0;
	padding: .25rem .75rem;
	border-radius: 3px;
	border: 1px solid #AA0101;
	color: #FFFFFF !important;
	background: #AA0101;
	font-size: 0.95rem;
	transition: color 0.3s ease, background 0.3s ease, border-color 0.3s ease;
	cursor: default;
	text-decoration: none;
	align-self: flex-start;
}
.fokus .button:hover {

	text-decoration: none;
	cursor: pointer;
}
