/*
 * VARIABLES AND FONTS
 */

:root {
	--awesome-white:   255, 255, 255;
	--awesome-black:    20,   0,   0;
	--awesome-green:    48, 255, 167;
	--awesome-turqois:  55, 214, 219;
	--scrap-width:  13.125rem;
	--scrap-height:  2.750rem;
}

@font-face {
	font-family: "FaroWeb-Lucky";
	font-weight: 400;
	font-style: normal;
	src: url("../fonts/FaroWeb-RegularLucky.woff") format("woff");
	font-display: fallback;
}

@font-face {
	font-family: "FaroWeb-Lucky";
	font-weight: 700;
	src: url("../fonts/FaroWeb-BoldLucky.woff") format("woff");
	font-display: swap;
}

@font-face {
	font-family: "SabonB1";
	font-weight: 400;
	font-style: normal;
	src: url("../fonts/SabonB1-Roman.otf") format("opentype");
	font-display: swap;
}

/*
 * GLOBALS
 */

* {
	box-sizing: border-box;
}

html {
	font-size: 16px;
}

@media (max-width: 64rem) {
	html {
		font-size: 15px;
	}
}

@media (max-width: 48rem) {
	html {
		font-size: 14px;
	}
}

@media (max-width: 30rem) {
	html {
		font-size: 13px;
	}
}

body {
	width: 100%;
	margin: 0;
	padding: 0;
	font-family: 'FaroWeb-Lucky', sans-serif;
	font-weight: 400;
	font-size: 1.2rem;
	color: rgb(var(--awesome-black));
}

/*
 * GENERAL TEXT CONTENT
 */

a {
	color: inherit;
	text-decoration: none;
	border: none;
}

p {
	line-height: 1.4;
}

p a {

	border-bottom: 2px solid rgb(var(--awesome-green));
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'FaroWeb-Lucky', sans-serif;
	font-weight: 700;
}

h1 em, h2 em, h3 em, h4 em, h5 em, h6 em {
	display: inline;
	font-style: inherit;
	background: linear-gradient(0deg,
			rgba(var(--awesome-green),0) 4%,
			rgba(var(--awesome-green),1) 4%,
			rgba(var(--awesome-green),1) 28%,
			rgba(var(--awesome-green),0) 28%);
}

h1 {
	font-size: 3.375rem;
	margin: 2rem 0;
	margin-left: -4.5rem; /* 72px */
}

@media (max-width: 64rem) {
	h1 {
		margin-left: 0;
	}
}

h2 {
	font-size: 2.125rem;
}

h3 {
	font-size: 1.625rem;
}

h4 {
	font-size: 1.375rem;
}

h5, h5 {
	font-size: 1.2rem;
}

/*
 * 1024px = 64rem
 *  768px = 48rem
 *  640px = 40rem
 *  480px = 30rem
 *  320px = 20rem
 */

@media (max-width: 48rem) {
	h1 {
		font-size: 3.125rem;
	}
	h2 {
		font-size: 2rem;
	}
	h3 {
		font-size: 1.5rem;
	}
	h4 {
		font-size: 1.25rem;
	}
}

@media (max-width: 40rem) {
	h1 {
		font-size: 2.875rem;
	}
	h2 {
		font-size: 1.875rem;
	}
	h3 {
		font-size: 1.375rem;
	}
}

@media (max-width: 30rem) {
	h1 {
		font-size: 2.5rem;
	}
	h2 {
		font-size: 1.75rem;
	}
	h3 {
		font-size: 1.25rem;
	}
}

@media (max-width: 20rem) {
	h1 {
		font-size: 2.25rem;
	}
	h2 {
		font-size: 1.625rem;
	}
}

/*
 * Prevent oversized images from exploding the layout
 */

section img {
	max-width: 100%;
}

/*
 * BUTTONS
 */

.button {
	display: block;
	padding: 1rem 2.5rem;
	cursor: pointer;
	text-align: center;
	font-family: 'FaroWeb-Lucky';
	font-weight: 700;
	font-size: 1.5rem;
	color: rgb(var(--awesome-black));
	background-color: rgb(var(--awesome-green));
	border: none;
}

.button:hover {
	color: rgb(var(--awesome-white));
	background-color: rgb(var(--awesome-turqois));
}

/*
 * MAIN ELEMENTS
 */

.content {
	position: relative;
	max-width: 105rem;     /* 1680px */
	min-width: 20rem;      /*  320px */
	margin: auto;
	padding: 2rem 12.5rem; /* 200px left/right */
}

@media (max-width: 64rem) {
	.content {
		padding: 2rem;
	}
}

.module {
	position: relative;
	margin-bottom: 8rem;
	background: rgb(var(--awesome-white));
}

@media (max-width: 48rem) {
	.module {
		margin-bottom: 6rem;
	}
}

@media (max-width: 30rem) {
	.module {
		margin-bottom: 4rem;
	}
}

/*
 * HEADER (for non-modular pages only)
 */

header h1 {
	margin-left: 0;
}

header .content {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.modular header {
	position: absolute;
	top: 0;
	right: 0;
	z-index: 2;
}

/*
 * LANGSWITCHER
 */

.langswitcher {
	list-style: none;
	margin: 0.375rem 0;
	padding: 0;	
	display: flex;
}

.langswitcher li {
	font-size: 1rem;
	padding: 0 0.5rem;
}

.langswitcher li:first-child {
	border-right: 1px solid rgb(var(--awesome-black));
}

.langswitcher .active {
	font-weight: bold;
}

/*
 * FOOTER
 */

footer section {
	position: relative;
	margin-bottom: 8rem;
	background: rgb(var(--awesome-white));
}

footer .contact .content {
	display: flex;
	justify-content: space-between;
}

footer .logo,
footer .contact-us,
footer .find-us {
	margin: 1rem;
}

footer h1 {
	font-size: 2.7rem;
	margin-top: 1rem;
}

footer .contact-us,
footer .find-us {
	font-size: 1.25rem;
}

footer h2 {
	font-size: 1.25rem;
}

footer .meta {
	margin-bottom: 0;
	text-align: center;
	font-size: 0.8rem;
}

footer .meta-nav,
footer .social-media {
	list-style: none;
	list-style-type: " — ";
	padding: 0;
	display: flex;
	justify-content: center;
}

footer .meta-nav li,
footer .social-media li {
	margin-left: 0.875rem;
	border-bottom: 2px solid rgb(var(--awesome-green));
}

footer .meta-nav li:first-child,
footer .social-media li:first-child {
	list-style: none;
}

@media (max-width: 48rem) {
	footer section {
		margin-bottom: 6rem;
	}

	footer .contact .content {
		flex-direction: column;
	}
}

@media (max-width: 30rem) {
	footer section  {
		margin-bottom: 4rem;
	}
}
/*
 * MODULES
 */

.modular .main-content {
	display: none;
}

.modular .page-content {
	z-index: 1;
}

.modular .module-content {
	z-index: 1;
}

/*
 * MODULE: flyer
 */

.modular-flyer {
	display: flex;
	height: 100vh;
	margin: 0;
	background: none;
}

.modular-flyer .module-content {
	display: grid;
	grid-template-rows: 1fr 1fr 1fr;
	grid-template-columns: 4fr 4fr 1fr
}

.modular-flyer .flyer-title {
	grid-row: 1;
	grid-column: 1;
	margin: 0;
}

.modular-flyer .flyer-main {
	grid-row: 1 / 4;
	grid-column: 2;
}

.modular-flyer .flyer-main p {
	text-align: right;
	font-weight: bold;
	font-size: 12rem;
	line-height: 1;
	margin: 0;
	padding: 0;
}

.modular-flyer .flyer-tagline {
	grid-row: 1 / 4;
	grid-column: 3;
}

.modular-flyer .flyer-tagline p {
	transform: rotate(-90deg);
}

.modular-flyer .flyer-sticker {
	grid-row: 2;
	grid-column: 1;
	translate: rotate(-30deg);
}

.modular-flyer .flyer-sticker p {
	display: block;
	width: 10rem;
	height: 10rem;
	line-height: 10rem;
	border-radius: 50%;
	color: #fff;
	font-weight: bold;
	background: #000;
	text-align: center;
	vertical-align: middle;
}

.modular-flyer .flyer-detail {
	grid-row: 3;
	grid-column: 1;
}

.modular-flyer .arrow-down-button {
	display: none;
}

/*
 * MODULE: hero
 */

.modular-hero {
	display: flex;
	height: 100vh;
	margin: 0;
	background: none;
	text-align: center;
}

.modular-hero .content {
	/* max-width: 50rem; */
	position: relative;
	max-width: 64rem;
	height: 100%;
	padding: 0 2rem;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background: none;
	border: none;
}

.modular-hero .page-content {
	flex: 1 1 auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.modular-hero img {
	max-width: 10rem;
	height: auto;
}	

.modular-hero h1 {
	display: initial;
	margin: 0 0 1.75rem 0;
	color: inherit;
	font-size: 9.375rem;
	line-height: 1;
	background: none;
}

.modular-hero h2 {
	margin: 0.75rem 0 2.5rem 0;
	font-size: 2.75rem;
	text-shadow: 0 0 1rem rgb(var(--awesome-white)),
			0 0 0.5rem rgb(var(--awesome-white)),
			0 0 0.25rem rgb(var(--awesome-white));
}

.modular-hero h3 {
	font-size: 2.375rem;
	margin: 0.75rem 0 3rem 0;
}

.modular-hero p {
	max-width: 50rem;
	margin: 0.75rem 0 4rem 0;
	font-weight: 700;
	text-shadow: 0 0 1rem rgb(var(--awesome-white)),
			0 0 0.5rem rgb(var(--awesome-white)),
			0 0 0.25rem rgb(var(--awesome-white));
}

.modular-hero .arrow-down-button {
	display: none;
	margin: 1rem 0;
}

.modular-hero .sticker {
	display: flex;
	align-items: center;
	position: absolute;
	top: 20%;
	right: -7%;
	width: 9rem;
	height: 9rem;
	font-weight: bold;
	font-size: 1.875rem;
	background-color: rgb(var(--awesome-green));
	border-radius: 50%;
	transform: rotate(-23deg);
}

.modular-hero .sticker span::before {
	content: "> ";
}

@media (max-width: 40rem) {
	.modular-hero h1 {
		margin-bottom: 2rem;
		font-size: 5.75rem;
	}

	.modular-hero h2 {
		margin-bottom: 2rem;
		font-size: 1.75rem;
	}
	
	.modular-hero h3 {
		font-size: 1.625rem;
	}

	.modular-hero p {
		margin-bottom: 2rem;
	}

	.modular-hero .sticker {
		width: 8rem;
		height: 8rem;
		right: -3%;
		font-size: 1.75rem;
	}
}

@media (max-width: 30rem) {
	.modular-hero .sticker {
		width: 7rem;
		height: 7rem;
		right: 1.5%;
		font-size: 1.5rem;
	}
}

@media (max-width: 20rem) {
	.modular-hero h1 {
		margin-bottom: 1rem;
		font-size: 4.5rem;
	}

	.modular-hero h2 {
		margin-bottom: 1rem;
		font-size: 1.5rem;
	}

	.modular-hero h3 {
		font-size: 1.125rem;
	}
	
	.modular-hero p {
		margin-bottom: 1rem;
	}

	.modular-hero .button {
		padding: 0.75rem 2rem;
		font-size: 1.2rem;
	}

	.modular-hero .sticker {
		width: 6rem;
		height: 6rem;
		right: 3%;
		font-size: 1.375rem;
	}
}

/*
 * MODULE: columns
 */

.modular-columns .module-content {
	display: flex;
	justify-content: space-between;
	/* flex-wrap: wrap; */
}

.modular-columns .column {
	display: flex;
	margin: 1rem;
	flex-direction: column;
	align-items: center;
}

@media (max-width: 48rem) {
	.modular-columns .module-content {
		flex-direction: column;
		align-items: flex-start;
	}
}

.modular-columns .body > :first-child {
	margin-top: 0;
}

.modular-columns .body > :last-child {
	margin-bottom: 0;
}

/*
 * MODULE: plan
 */

.modular-plan .module-content {
	display: flex;
	justify-content: center;
}

.modular-plan .core,
.modular-plan .additional {
	display: flex;
	margin: 1rem;
	justify-content: center;
	align-items: center;
	font-size: 1.25rem;
	font-weight: bold;
}

.modular-plan .core {
	width: 30rem;
	height: 30rem;
	min-width: 30rem;
	min-height: 30rem;
	text-align: center;
	background-image: url(../images/blasen-omg.svg);
	background-size: contain;
	background-repeat: no-repeat;
	animation-duration: 20s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-name: plan-revolve-cw;
}

.modular-plan .core .text {
	display: flex; 
	width: 15rem;
	height: 15rem;
	padding: 1rem;
	align-items: center;
	color: rgb(var(--awesome-white));
	background: rgb(var(--awesome-black));
	border-radius: 50%;
	animation-duration: 20s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-name: plan-revolve-ccw;
}

.modular-plan .additional .text::before {
	content: " ";
	display: inline-block;
	width: 1.5rem;
	height: 1.5rem;
	border-radius: 50%;
	margin-right: 1rem;
	background: rgb(var(--awesome-green));
}

@media (max-width: 48rem) {
	.modular-plan .core {
		width: 24rem;
		height: 24rem;
		min-width: 24rem;
		min-height: 24rem;
	}
	.modular-plan .core .text {
		width: 12rem;
		height: 12rem;
	}
}

@media (max-width: 40rem) {
	.modular-plan .additional:first-of-type {
		display: none;
	}
}

@media (max-width: 30rem) {
	.modular-plan .core {
		width: 20rem;
		height: 20rem;
		min-width: 20rem;
		min-height: 20rem;
		margin: 0.5rem;
	}
	.modular-plan .core .text {
		width: 10rem;
		height: 10rem;
	}
	.modular-plan .additional {
		margin: 0.5rem;
	}
}

@media (max-width: 24rem) {
	/*
	.modular-plan .additional {
		display: none;
	}
	*/
	.modular-plan .module-content {
		flex-wrap: wrap;
	}
}

@keyframes plan-revolve-cw {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

@keyframes plan-revolve-ccw {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(-360deg);
	}
}

/*
 * MODULE: collage7
 */

.modular-collage7 .module-content {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: 1fr 1fr 1fr;
	gap: 1rem;
}

.modular-collage7 .image.i1 {
	grid-column: 1;
	grid-row: 1/3;
}

.modular-collage7 .image.i2 {
	grid-column: 2;
	grid-row: 1;
}

.modular-collage7 .image.i3 {
	grid-row: 2;
	grid-column: 2;
}

.modular-collage7 .image.i4 {
	grid-column: 3;
	grid-row: 1/3;
}

.modular-collage7 .image.i5 {
	grid-column: 1;
	grid-row: 3;
}

.modular-collage7 .image.i6 {
	grid-column: 2;
	grid-row: 3;
}

.modular-collage7 .image.i7 {
	grid-column: 3;
	grid-row: 3;
}

.modular-collage7 .image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

@media (max-width: 64rem) {
	.modular-collage7 .module-content {
		gap: 0.75rem;
	}
}

@media (max-width: 48rem) {
	.modular-collage7 .module-content {
		gap: 0.5rem;
	}
}

@media (max-width: 30rem) {
	.modular-collage7 .module-content {
		gap: 0.25rem;
	}
}

/*
 * MODULE: call-to-action
 * MODULE: eventbrite-button
 * MODULE: howto
 */

.modular-call-to-action,
.modular-eventbrite-button,
.modular-howto {
	color: rgb(var(--awesome-black));
	background: rgb(var(--awesome-green));
}

.modular-call-to-action p,
.modular-eventbrite-button p {
	font-size: 1.5rem;
	/* font-family: 'FaroWeb-Lucky', sans-serif; */
	font-weight: 700;
}

.modular-call-to-action .content,
.modular-eventbrite-button .content {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-top: 0.75rem;
	padding-bottom: 0.75rem;
}

@media (max-width: 64rem) {
	.modular-call-to-action .content,
	.modular-eventbrite-button .content {
		flex-direction: column;
	}
}

.modular-call-to-action .page-content,
.modular-eventbrite-button .page-content,
.modular-call-to-action .module-content,
.modular-eventbrite-button .module-content {
	margin: 0 2rem;
}

.modular-call-to-action .button,
.modular-eventbrite-button .button {
	padding: 0.75rem 1.5rem;
	border: 0.25rem solid rgb(var(--awesome-black));
}

.modular-call-to-action .button:hover,
.modular-eventbrite-button .button:hover {
	/* border: 0.25rem solid rgb(var(--awesome-white)); */
	border: none;
	margin: 0.25rem;
}

/*
 * MODULE: howto (and events because it contains howto as well, don't ask)
 */

.modular-howto .module-content,
.event-howto {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.modular-howto .step,
.event-howto .step {
	flex: 1 1 0;
	margin: 1rem;
	text-align: center;
}

.modular-howto .number,
.event-howto .number {
	display: flex;
	justify-content: center;
}

.modular-howto .number span,
.event-howto .number span {
	display: flex;
	width: 6rem;
	height: 6rem;
	justify-content: center;
	align-items: center;
	font-size: 3rem;
	font-weight: bold;
	background: rgb(var(--awesome-green));
	border: 4px solid rgb(var(--awesome-black));
	border-radius: 50%;
}

.modular-howto .head h4 {
	margin: 1rem 0;
}

.modular-howto .body,
.event-howto .body {
	font-size: 1rem;
}

@media (max-width: 64rem) {
	.modular-howto .module-content,
	.event-howto {
		flex-direction: column;
	}

	.modular-howto .step,
	.event-howto .step {
		margin: .5rem;
	}
	
	.modular-howto .number span,
	.event-howto .number span {
		width: 4rem;
		height: 4rem;
		font-size: 2rem;
	}
}

/*
 * MODULE: schedule
 */

.modular-schedule .page-content h2,
.modular-schedule .page-content h3 {
	margin-left: -4.5rem;	
}

.modular-schedule .entry {
	display: flex;
	margin: 6rem 0;
}

.modular-schedule .datetime {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-right: 3rem;
	border-right: 0.8rem solid rgb(var(--awesome-green));
	flex: 0 0 16rem;
}

.modular-schedule .datetime h1 {
	margin: 0;
}

.modular-schedule .datetime span {
	display: block;
	line-height: 0.8;
	white-space: nowrap;
	font-weight: 700;
}

.modular-schedule .datetime .to {
	display: none;
}

.modular-schedule .datetime .end::before {
	content: "";
	display: inline-block;
	width: 2.5rem;
	height: 0.8rem;
	margin: 0 0.175rem 0.5rem 0.75rem;
	background: rgb(var(--awesome-green));
}

.modular-schedule .details {
	padding-left: 3rem;
}

.modular-schedule .details .title {
	margin: 1rem 0 0.25rem 0;
}

.modular-schedule .details .subtitle {
	margin-top: 0.25rem;
	font-family: 'FaroWeb-Lucky', sans-serif;
	font-weight: 400;
}

@media (max-width: 64rem) {
	.modular-schedule .page-content h2,
	.modular-schedule .page-content h3 {
		margin: 0;
	}
}

@media (max-width: 40rem) {
	.modular-schedule .entry {
		flex-direction: column;
		margin: 2rem 0
	}
	.modular-schedule .datetime {
		display: block;
		flex: 1 1 auto;
		padding: 0;
		border: none;
	}
	.modular-schedule .datetime span {
		display: initial;
		line-height: initial;
	}
	.modular-schedule .datetime .to {
		display: initial;
		color: rgb(var(--awesome-green));
	}
	.modular-schedule .datetime .end::before {
		display: none;
	}
	.modular-schedule .details {
		padding: 0;
	}
}

/*
 * MODULE: program
 */

.modular-program img:first-child {
	box-shadow: 40rem 4rem 0 rgb(var(--awesome-green));
}

.modular-program .entry {
	display: flex;
	margin: 6rem 0;
}

.modular-program .head {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-right: 1.5rem;
	border-right: 0.8rem solid rgb(var(--awesome-green));
	flex: 0 0 25%;
}

.modular-program .head h1 {
	margin: 0;
	line-height: 1;
}

.modular-program .body {
	padding-left: 3rem;
}

@media (max-width: 90rem) {
	.modular-program .head {
		flex: 0 0 33%;
	}
}

@media (max-width: 40rem) {
	.modular-program .entry {
		flex-direction: column;
		margin: 2rem 0
	}

	.modular-program .head {
		display: block;
		flex: 1 1 auto;
		padding: 0;
		border: none;
	}

	.modular-program .body {
		padding: 0;
	}
}

/*
 * MODULE: video 
 */

.modular-video .module-content {
	position: relative;
	overflow: hidden;
	padding-top: 56.25%;
}

.modular-video iframe,
.modular-video .yt-embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	max-width: 100%;
	border: 0;
}

/*
 * MODULE: iframe
 */

.modular-iframe .module-content {
	display: flex;
	justify-content: center;
}

.modular-iframe iframe {
	max-width: 100%;
}

/*
 * MODULE: video-list
 */

.modular-video-list .page-content h2,
.modular-video-list .page-content h3 {
	margin-left: -4.5rem;	
}

.modular-video-list .video-teaser {
	display: flex;
	justify-content: space-between;
	margin: 4rem 0;
}

.modular-video-list .video-teaser .title {
	margin-bottom: 0.25rem;
}

.modular-video-list .video-teaser .subtitle {
	margin-top: 0.25rem;
}

.modular-video-list .video-teaser ul {
	padding-left: 1.2rem;
	/* list-style-type: "- "; */
}

.modular-video-list .video-teaser .description {
	margin-right: 1rem;
	min-width: 31rem;
}

.modular-video-list .video-teaser .video {
	width: 31rem;
	margin-left: 1rem;
	flex-shrink: 0;
}

.modular-video-list .video-teaser iframe {
	display: block;
	max-width: 100%;
	margin: 0 auto;
}

@media (max-width: 80rem) {
	.modular-video-list .video-teaser {
		flex-direction: column-reverse;
	}

	.modular-video-list .page-content h2,
	.modular-video-list .page-content h3 {
		margin: 0;
	}

	.modular-video-list .video-teaser .description,
	.modular-video-list .video-teaser .video {
		width: 100%;
		margin: 0;
	}
}

/*
 * MODULE: feature / lightslider
 */

.modular-feature .content,
.modular-lightslider .content {
	display: flex;
}

.modular-feature .page-content,
.modular-lightslider .page-content {
	flex: 1;
	margin-right: 1.25rem;
}

.modular-feature .module-content,
.modular-lightslider .module-content {
	flex: 1;
	margin-left: 1.25rem;
}

.modular-feature .module-content img {
	display: block;
	max-width: 100%;
}

@media (max-width: 64rem) {
	.modular-feature .content,
	.modular-lightslider .content {
		flex-direction: column-reverse;
	} 

	.modular-feature .page-content,
	.modular-feature .module-content,
	.modular-lightslider .page-content,
	.modular-lightslider .module-content {
		flex: initial;
		margin: 0;
	}
}

.lSSlideOuter .lSPager.lSpg > li.active a {
	background-color: rgb(var(--awesome-green)) !important;
}

.howto-content .event-howto {
	list-style: none;
	display: flex;
	background: rgb(var(--awesome-green));
}

.howto-content .event-howto .step::before {
	border: 2px solid rgb(var(--awesome-black));
	border-radius: 50%;
	display: block;
	width: 6rem;
	height: 6rem;
	line-height: 6rem;
	text-align: center;
}

.howto-content .event-howto .step-1::before {
	content: "1";
}

.howto-content .event-howto .step-2::before {
	content: "2";
}

.howto-content .event-howto .step-3::before {
	content: "3";
}

/*
 * MODULE: people / formats / contact / columns / testimonials
 */

.modular-people .module-content,
.modular-formats .module-content,
.modular-testimonials .module-content {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin: 0 -2rem;
}

.modular-contact .content {
	display: flex;
}

.modular-contact .page-content {
	margin-right: 1rem;
}

.modular-contact .module-content {
	min-width: 33%;
	margin-left: 1rem;
	flex-shrink: 0;
}

@media (max-width: 48rem) {
	.modular-contact .content {
		flex-direction: column;
	}

	.modular-contact .page-content,
	.modular-contact .module-content {
		margin: 1rem 0;
	}
}

.modular-people .person,
.modular-formats .format,
.modular-contact .contact,
.modular-testimonials .testimonial {
	margin: 2rem;
	text-align: center;
	flex: 0 1 calc(33% - 4rem);
	min-width: 12.5rem;
}

.modular-formats .format {
	text-align: left;
}

.modular-formats .format .title {
	border-bottom: .375rem solid rgb(var(--awesome-black));
}

.modular-people .person img,
.popup .person img,
.modular-contact .contact img,
.modular-columns .column img {
	width: 12.5rem;
	height: 12.5rem;
	border-radius: 50%;
}

.modular-formats .format img {
	width: 6rem;
	height: 6rem;
}

.modular-people .name,
.modular-contact .name {
	margin: 1.25rem 0;
}

.modular-people .details span,
.modular-contact .details span {
	display: block;
}

@media (max-width: 30rem) {
	.modular-people .person,
	.modular-contact .contact {
		min-width: 10rem;
	}

	.modular-people .person img,
	.modular-contact .contact img {
		width: 10rem;
		height: 10rem;
	}
}

.modular-people .bio {
	display: none;
}

.modular-people .person .image.interactive,
.modular-people .person .name.interactive {
	cursor: pointer;
}

.modular-testimonials .testimonial {
	min-width: 20rem;
	padding: 1rem;
	margin-top: 3rem;
	border: 4px solid rgb(var(--awesome-black));
	word-break: break-word;
}

.modular-testimonials .testimonial .head {
	margin-top: -2.5rem;
}

.modular-testimonials .testimonial .head .title {
	display: inline-block;
	padding: 1rem;
	margin: 0;
	background: rgb(var(--awesome-green));
}

.modular-testimonials .testimonial .head img {
	width: 8rem;
	height: auto;
	margin-top: -2.5rem;
	border-radius: 50%;
}

.modular-testimonials .testimonial .body blockquote {
    font-size: 125%;
}

/*
 * MODULE: logo-wall
 */

.modular-logo-wall .module-content {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	margin: -2rem;
}

.modular-logo-wall .logo {
	width: 16rem;
	height: 16rem;
	margin: 2rem;
	flex: 0 1 auto;
}

.modular-logo-wall .logo a {
	display: block;
	width: 100%;
	height: 100%;
}

.modular-logo-wall .logo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media (max-width: 30rem) {
	.modular-logo-wall .logo {
		width: 10rem;
		height: 10rem;
	}
}

@media (max-width: 20rem) {
	.modular-logo-wall .logo {
		width: 8rem;
		height: 8rem;
	}
}

/*
 * PAGE: contentflow
 */

.contentflow .contentflow {
	margin-top: -4rem;
}

.contentflow .contentflow .content,
.contentflow .youtube .content {
	padding-top: 0;
}

.contentflow .contentflow .stream,
.contentflow .youtube .stream,
.contentflow .youtube .chat {
	width: 100%;
	position: relative;
	padding-top: 56.25%;
}

.contentflow .contentflow .stream {
	padding-top: 100%;
}

.contentflow .contentflow iframe,
.contentflow .youtube iframe {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	background-color: transparent;
	border: 0;
}

/*
 * YT-EMBED
 */

.yt-embed {
	position: relative;
	cursor: pointer;
	overflow: hidden;
}

.yt-embed a {
	display: flex;
	width: 100%;
	height: 100%;
	align-items: center;
	justify-content: center;
}

.yt-embed a svg {
	opacity: 0.8;
	z-index: 1;
}

.yt-embed img {
	display: block;
	width: 100%;
	height: auto;
}

.yt-blur img {
	filter: blur(0.125rem);
}

.yt-embed .embed-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*
 * FORMS
 */

.form .form-content {
	margin-top: 4rem;
}

.form form {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-evenly;
}

.form form .form-label {
	display: none;
}

.form form .form-field,
.form form .buttons {
	width: 100%;
	max-width: 40rem;
	margin: 0.5em;
}

.form form .form-field input,
.form form .form-field textarea {
	width: 100%;
	padding: 1em;
	border: none;
	border-radius: 0;
	background: #dfdfdf;
}

.form form .button {
	width: 80%;
	margin: auto;
	padding: 0.75rem 1rem;
}

.form form .events,
.form form .events + div .checkboxes {
	display: none;
}

/*
 * GREEN BACKGROUND BOX
 */

.modular-feature::after,
.modular-lightslider::after {
	content: "";
	display: block;
	width: 45%;
	height: 75%;
	background: rgb(var(--awesome-green));
	position: absolute;
	z-index: 0;
	right: 0;
}

.modular-feature::after {
	bottom: 0;
}

.modular-lightslider::after {
	top: 0;
}

/*
 * PEOPLE POP-UP (LIGHTBOX)
 */

.popup {
	position: fixed;
	width: 100vw;
	height: 100vh;
	padding: 0;
	margin: 0;
	overflow: hidden;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	/* background: rgba(var(--awesome-black),0.8); */
	 background: rgba(var(--awesome-white),0.8);
	z-index: 100;
}

.popup .person {
	display: flex;
	max-width: 64rem;
	max-height: 100vh;
	margin: 2rem;
	padding: 2.5rem;
	overflow: auto;
	flex-direction: column;
	align-items: center;
	background: rgb(var(--awesome-white));
}

.popup .details {
	text-align: center;
}

.popup .person .bio {
	display: block;
}

.popup .person .name {
	margin: 1.25rem 0;
}

.popup .person .position,
.popup .person .company,
.popup .person .email,
.popup .person .phone {
	display: none;
}

.popup .close-button {
	position: absolute;
	top: 2rem;
	right: 2rem;
	padding: 0.5rem 1rem;
	border: none;
	background: rgb(var(--awesome-turqois));
	cursor: pointer;
}

/*
 * CONFETTI
 */

#confetti {
	position: fixed;
	top: 0;
	width: 100%;
	height: 100vh;
	z-index: -1;
	overflow: hidden;
}

.scrap {
	position: absolute;
	width: var(--scrap-width);
	height: var(--scrap-height);
	z-index: -1;
	background: rgb(var(--awesome-turqois));

	will-change: transform;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

@media (max-width: 48rem) {
	.scrap {
		width: calc(0.75 * var(--scrap-width));
		height: calc(0.75 * var(--scrap-height))
	}
}

@media (max-width: 30rem) {
	.scrap {
		width: calc(0.5 * var(--scrap-width));
		height: calc(0.5 * var(--scrap-height));
	}
}

.scrap.ltr {
	left: calc(-1 * var(--scrap-width)); /* left of visible screen area */
}

.scrap.rtl {
	left: calc(100vw + var(--scrap-width)); /* right of visible screen area */
}

.scrap.ttb {
	top: calc(-1 * var(--scrap-width));
}

.scrap.btt {
	top: calc(100vh + var(--scrap-width));
}

/*
 * scrap speeds
 */

.scrap.speed-0 {
	animation-duration: 96s;
}

.scrap.speed-1 {
	animation-duration: 48s;
}

.scrap.speed-2 {
	animation-duration: 24s;
}

/*
 * scrap sizes/types
 */

.scrap.type-0 {
}

.scrap.type-1 {
	filter: blur(0.25rem);
}

.scrap.type-2 {
	filter: blur(0.5rem);
	background: rgba(var(--awesome-turqois), 0.75);
}

.scrap.type-3 {
	filter: blur(1.5rem);
	background: rgba(var(--awesome-turqois), 0.5);
}

/*
 * horizontal scraps (left-to-right, right-to-left)
 */

.scrap.ltr-0 {
	animation-name: scrap-ltr-0;
}
.scrap.ltr-1 {
	animation-name: scrap-ltr-1;
}
.scrap.ltr-2 {
	animation-name: scrap-ltr-2;
}
.scrap.ltr-3 {
	animation-name: scrap-ltr-3;
}
.scrap.ltr-4 {
	animation-name: scrap-ltr-4;
}
.scrap.ltr-5 {
	animation-name: scrap-ltr-5;
}

.scrap.rtl-0 {
	animation-name: scrap-rtl-0;
}
.scrap.rtl-1 {
	animation-name: scrap-rtl-1;
}
.scrap.rtl-2 {
	animation-name: scrap-rtl-2;
}
.scrap.rtl-3 {
	animation-name: scrap-rtl-3;
}
.scrap.rtl-4 {
	animation-name: scrap-rtl-4;
}
.scrap.rtl-5 {
	animation-name: scrap-rtl-5;
}

/*
 * vertical scraps (top-to-bottom, bottom-to-top)
 */

.scrap.ttb-0 {
	animation-name: scrap-ttb-0;
}
.scrap.ttb-1 {
	animation-name: scrap-ttb-1;
}
.scrap.ttb-2 {
	animation-name: scrap-ttb-2;
}
.scrap.ttb-3 {
	animation-name: scrap-ttb-3;
}
.scrap.ttb-4 {
	animation-name: scrap-ttb-4;
}
.scrap.ttb-5 {
	animation-name: scrap-ttb-5;
}

.scrap.btt-0 {
	animation-name: scrap-btt-0;
}
.scrap.btt-1 {
	animation-name: scrap-btt-1;
}
.scrap.btt-2 {
	animation-name: scrap-btt-2;
}
.scrap.btt-3 {
	animation-name: scrap-btt-3;
}
.scrap.btt-4 {
	animation-name: scrap-btt-4;
}
.scrap.btt-5 {
	animation-name: scrap-btt-5;
}

/*
 * scrap animations
 */

@keyframes scrap-ltr-0 {
	to {
		transform: translate3d(calc(100vw + var(--scrap-width)), 20vh, 0) rotate(270deg);
	}
}

@keyframes scrap-ltr-1 {
	to {
		transform: translate3d(calc(100vw + var(--scrap-width)), 40vh, 0) rotate(360deg);
	}
}

@keyframes scrap-ltr-2 {
	to {
		transform: translate3d(calc(100vw + var(--scrap-width)), 60vh, 0) rotate(450deg);
	}
}

@keyframes scrap-ltr-3 {
	to {
		transform: translate3d(calc(100vw + var(--scrap-width)), -20vh, 0) rotate(-270deg);
	}
}

@keyframes scrap-ltr-4 {
	to {
		transform: translate3d(calc(100vw + var(--scrap-width)), -40vh, 0) rotate(-360deg);
	}
}

@keyframes scrap-ltr-5 {
	to {
		transform: translate3d(calc(100vw + var(--scrap-width)), -60vh, 0) rotate(-450deg);
	}
}

@keyframes scrap-rtl-0 {
	to {
		transform: translate3d(calc(-100vw - 2 * var(--scrap-width)), 20vh, 0) rotate(270deg);
	}
}

@keyframes scrap-rtl-1 {
	to {
		transform: translate3d(calc(-100vw - 2 * var(--scrap-width)), 40vh, 0) rotate(360deg);
	}
}

@keyframes scrap-rtl-2 {
	to {
		transform: translate3d(calc(-100vw - 2 * var(--scrap-width)), 60vh, 0) rotate(450deg);
	}
}

@keyframes scrap-rtl-3 {
	to {
		transform: translate3d(calc(-100vw - 2 * var(--scrap-width)), -20vh, 0) rotate(-270deg);
	}
}

@keyframes scrap-rtl-4 {
	to {
		transform: translate3d(calc(-100vw - 2 * var(--scrap-width)), -40vh, 0) rotate(-360deg);
	}
}

@keyframes scrap-rtl-5 {
	to {
		transform: translate3d(calc(-100vw - 2 * var(--scrap-width)), -60vh, 0) rotate(-450deg);
	}
}

@keyframes scrap-ttb-0 {
	to {
		transform: translate3d(20vw, calc(100vh + 2 * var(--scrap-width)), 0) rotate(270deg);
 	}
}

@keyframes scrap-ttb-1 {
	to {
		transform: translate3d(40vw, calc(100vh + 2 * var(--scrap-width)), 0) rotate(360deg);
 	}
}

@keyframes scrap-ttb-2 {
	to {
		transform: translate3d(60vw, calc(100vh + 2 * var(--scrap-width)), 0) rotate(450deg);
 	}
}

@keyframes scrap-ttb-3 {
	to {
		transform: translate3d(-20vw, calc(100vh + 2 * var(--scrap-width)), 0) rotate(-270deg);
 	}
}

@keyframes scrap-ttb-4 {
	to {
		transform: translate3d(-40vw, calc(100vh + 2 * var(--scrap-width)), 0) rotate(-360deg);
 	}
}

@keyframes scrap-ttb-5 {
	to {
		transform: translate3d(-60vw, calc(100vh + 2 * var(--scrap-width)), 0) rotate(-450deg);
 	}
}

@keyframes scrap-btt-0 {
	to {
		transform: translate3d(20vw, calc(-100vh - 2 * var(--scrap-width)), 0) rotate(270deg);
	}
}

@keyframes scrap-btt-1 {
	to {
		transform: translate3d(40vw, calc(-100vh - 2 * var(--scrap-width)), 0) rotate(360deg);
	}
}

@keyframes scrap-btt-2 {
	to {
		transform: translate3d(60vw, calc(-100vh - 2 * var(--scrap-width)), 0) rotate(450deg);
	}
}

@keyframes scrap-btt-3 {
	to {
		transform: translate3d(-20vw, calc(-100vh - 2 * var(--scrap-width)), 0) rotate(-270deg);
	}
}

@keyframes scrap-btt-4 {
	to {
		transform: translate3d(-40vw, calc(-100vh - 2 * var(--scrap-width)), 0) rotate(-360deg);
	}
}

@keyframes scrap-btt-5 {
	to {
		transform: translate3d(-60vw, calc(-100vh - 2 * var(--scrap-width)), 0) rotate(-450deg);
	}
}

/*
 * BLOG
 */

#blog-listing .content {
/*	display: flex; */
}

.blog-teaser {
	margin: 2rem 0;
	padding: 2rem;
	background: rgb(var(--awesome-white));
}

.blog-teaser .header {
	display: flex;
	align-items: center;
}

.blog-teaser .header .datetime {
	border-bottom: 0.5rem solid rgb(var(--awesome-green));
	margin-right: 1rem;
}

.blog-teaser .body {
	display: flex;
}

.blog-teaser .image {
	/* margin-top: -4.375rem; */
	margin-left: 1rem;
}

.blog-teaser .button {
	display: inline-block;
}

.blog-entry {
	margin-bottom: 8rem;
	background: rgb(var(--awesome-white));
}


@media (max-width: 48rem) {
	#blog-listing .content {
		padding: 2rem 1rem;
	}

	.blog .button,
	.item .button {
		padding: 0.75rem 2rem;
		font-size: 1.375rem;
	}
}

@media (max-width: 40rem) {
	#blog-listing .content {
		padding: 2rem 0;
	}

	.blog header .content,
	.item header .content {
		flex-direction: column;
	}

	.blog-teaser .header {
		flex-direction: column;
		align-items: initial;
	}

	.blog-teaser .image {
		display: none;
	}
}

/* MODULE events */

.modular-festiwall .event .interactive {
	user-select: none;
	cursor: pointer;
}

.modular-festiwall .event-ctrl {
	padding: 1em;
	border-bottom: 0.25em solid rgb(var(--awesome-black));
}

.modular-festiwall .event-ctrl ul {
	display: flex;
	list-style: none;
	justify-content: center;
}

.modular-festiwall .event-ctrl li {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0 1em;
	cursor: pointer;
	user-select: none;
}

.modular-festiwall .event-ctrl span {
	color: #898080;
}

.modular-festiwall .event-ctrl .active span {
	color: rgb(var(--awesome-black));
}

.modular-festiwall .event-ctrl span {
	margin: 0 0.5em;
}

.modular-festiwall .event-ctrl .schedule span {
	order: 2;
}

.modular-festiwall .event-list {
	margin: 0 -2rem;
}

.modular-festiwall .event-list.grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.modular-festiwall .event {
	margin: 2rem;
}

.modular-festiwall .grid .event {
	display: flex;
	flex: 0 1 calc(18.75rem);
	flex-direction: column;
	text-align: center;
	background: rgb(var(--awesome-green));
}

.modular-festiwall .grid .event .image {
	width: 300px;
	height: 200px;
	overflow: hidden;
}

.modular-festiwall .grid .event .image img {
	display: block;
	min-width: 100%;
	min-height: 100%;
	object-fit: cover;
}

.modular-festiwall .grid .event .datetime {
	display: none;
}

.modular-festiwall .grid .title {
	margin: 0.5em 0;
	font-size: 1.375rem;
} 

.modular-festiwall .grid .subtitle {
	margin: 0.5em 0;
	font-size: 1.4rem;
	font-weight: normal;
}

.modular-festiwall .grid .body {
	padding: 0.5em 1em;
	flex-grow: 1;
}

.modular-festiwall .grid .description {
	display: none;
}

.modular-festiwall .grid .details {
	padding: 0.5em 1em;
}

.modular-festiwall .grid .details ul {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	font-size: 0.75em;
	justify-content: space-evenly;
	align-items: baseline;
}

.modular-festiwall .grid .details .format, 
.modular-festiwall .grid .details .topics, 
.modular-festiwall .grid .details .label {
	display: none;
}

.modular-festiwall .details li {
	padding-left: 1em;
	background-repeat: no-repeat;
	background-size: 0.75em;
	background-position: 0 center;
}

.modular-festiwall .details .date {
	background-image: url(../images/programm_datum.svg);
}

.modular-festiwall .details .time {
	background-image: url(../images/programm_uhrzeit.svg);
}

.modular-festiwall .details .place {
	background-size: 0.625em;
	background-image: url(../images/programm_location.svg);
}

.modular-festiwall .sub-now {
	display: none;
}

.modular-festiwall .grid .sub {
	padding: 1em 0;
	text-align: right;
	background: rgb(var(--awesome-white));
	user-select: none;
}

.modular-festiwall .sub label {
	cursor: pointer;
	padding-left: 2em;
	background-repeat: no-repeat;
	background-size: 1.25em;
	background-position: 0 center;
	background-image: url(../images/programm_slideroff.svg);
}

.modular-festiwall .sub label.checked {
	background-image: url(../images/programm_slideron.svg);
}

.modular-festiwall .schedule .event {
	display: grid;
	grid-template-columns: 1.5fr 3fr auto;
	grid-template-rows: auto auto 1fr;
}

.modular-festiwall .schedule .image {
	grid-column: 3;
	grid-row: 1;
	width: 300px;
	height: 200px;
	overflow: hidden;
}

.modular-festiwall .schedule .image img {
	display: block;
	min-width: 100%;
	min-height: 100%;
	object-fit: cover;
}

.modular-festiwall .schedule .datetime {
	grid-column: 1;
	grid-row: 1 / 4;
	font-size: 2em;
	font-weight: bold;
	text-align: center;
}

.modular-festiwall .schedule .datetime::after {
	content: "";
	display: block;
	width: 0;
	height: 100%;
	margin-left: 50%;
	border-right: 1rem solid rgb(var(--awesome-green));
}

.modular-festiwall .schedule .datetime .date {
	background: rgb(var(--awesome-white));
}

.modular-festiwall .schedule .datetime .time {
	display: none;
}

.modular-festiwall .schedule .body {
	grid-column: 2;
	grid-row: 1 / 4;
	padding: 0 1rem;
}

.modular-festiwall .schedule .body .title {
	margin: 0;
	font-size: 1.5rem;
}

.modular-festiwall .schedule .body .subtitle {
	margin: 0.5em 0;
	font-size: 1.2rem;
}

.modular-festiwall .schedule .details {
	width: 100%;
	grid-column: 3;
	grid-row: 2;
	padding: .5rem 1.5rem;
	background: rgb(var(--awesome-green));
}

.modular-festiwall .schedule .details ul,
.popup .event .details ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.modular-festiwall .schedule .details li,
.popup .event .details li {
	padding-left: 1.75rem;
	margin: 0.5rem; 
	background-size: .875rem;
}

.modular-festiwall .schedule .details .format, 
.modular-festiwall .schedule .details .topics {
	display: none;
}

.modular-festiwall .schedule .details .label,
.popup .event .details .label {
	display: none;
}

.modular-festiwall .schedule .sub {
	width: 100%;
	padding: 0.5em;
	grid-column: 3;
	grid-row: 3;
	font-size: 1.4rem;
	text-align: right;
}

.modular-festiwall .form-content {
	margin-top: 4rem;
}

.modular-festiwall form {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-evenly;
}

.modular-festiwall form .form-label {
	display: none;
}

.modular-festiwall form .form-field,
.modular-festiwall form .buttons {
	width: 100%;
	max-width: 40rem;
	margin: 0.5em;
}

.modular-festiwall form .form-field input {
	width: 100%;
	padding: 1em;
	border: none;
	border-radius: 0;
	background: #dfdfdf;
}

.modular-festiwall form .button {
	width: 80%;
	margin: auto;
	padding: 0.75rem 1rem;
}

[data-grav-field-name="data[events]"] {
	display: none;
}

.modular-festiwall form .events,
.modular-festiwall form .events + div .checkboxes {
	display: none;
}

@media (max-width: 80rem) {
	.modular-festiwall .schedule .event {
		grid-template-columns: 0.3fr 3fr auto;
	}

	.modular-festiwall .schedule .datetime {
		font-size: 1.5em;
	}
}

@media (max-width: 64rem) {
	.modular-festiwall .schedule .event {
		grid-template-columns: 2fr auto;
	}

	.modular-festiwall .schedule .image {
		grid-column: 2;
		grid-row: 1;
	}

	.modular-festiwall .schedule .body {
		grid-column: 1;
		grid-row: 1/4;
	}

	.modular-festiwall .schedule .datetime {
		display: none;
	}

	.modular-festiwall .schedule .details {
		grid-column: 2;
		grid-row: 2;
	}
	
	.modular-festiwall .schedule .sub {
		grid-column: 2;
		grid-row: 3;
	}
}

@media (max-width: 40rem) {
	.modular-festiwall .schedule .event {
		grid-template-columns: 1fr;
	}

	.modular-festiwall .schedule .image {
		display: none;
	}

	.modular-festiwall .schedule .details {
		grid-column: 1;
		grid-row: 2;
	}

	.modular-festiwall .schedule .body {
		grid-column: 1;
		grid-row: 1;
	}

	.modular-festiwall .schedule .sub {
		grid-column: 1;
		grid-row: 3;
	}

	.modular-festiwall .schedule .sub {
		grid-column: auto;
	}
}

.popup .event {
	display: grid;
	grid-template-columns: .6fr .4fr;
	grid-template-rows: auto minmax(0,1fr) auto;
	row-gap: 2rem;
	column-gap: 2rem;
	max-width: 50rem;
	max-height: 100vh;
	margin: 2rem;
	padding: 2.5rem;
	overflow: auto;
	background: rgb(var(--awesome-white));
	border: 1px solid rgb(var(--awesome-black));
}

.popup .event .image {
	grid-column: 1 / 3;
}

.popup .event .image img {
	width: 100%;
}

.popup .event .datetime {
	display: none;
}

.popup .event .body {
	grid-row: 2;
}

.popup .event .title {
	margin-top: 0;
	font-size: 1.8rem;
}

.popup .event .subtitle {
	font-size: 1.4rem;
}

.popup .event .details {
	grid-row: 2;
	padding: 1.5rem;
	background: rgb(var(--awesome-green));
	text-align: left;
}

.popup .event .details li {
	padding-left: 1.5rem;
	background-repeat: no-repeat;
	background-size: 1rem;
	background-position: 0 center;
}

.popup .event .details .date {
	background-image: url(../images/programm_datum.svg);
}

.popup .event .details .time {
	background-image: url(../images/programm_uhrzeit.svg);
}

.popup .event .details .place {
	background-image: url(../images/programm_location.svg);
	background-size: .825rem;
	background-position: .12rem;
}

.popup .event .details .format,
.popup .event .details .topics {
	display: none;
}

.popup .event .details::before {
	content: "Details";
	padding: .25rem;
	background: rgb(var(--awesome-green));
}

.popup .event .details ul::before {
	content: "";
	display: block;
	width: 100%;
	border-top: 0.2rem solid black;
	margin-top: -0.875rem;
	margin-bottom: 2rem;
}

.popup .event .sub {
	grid-row: 3;
	grid-column: 2;
	text-align: center;
}

.popup .event .sub label {
	display: none;
}

.popup .event .sub .sub-now {
	width: 100%;
	display: block;
	color: white;
	background: rgb(var(--awesome-black));
}

@media (max-width: 40rem) {
	.popup .event {
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto auto;
		row-gap: 1rem;
		column-gap: 1rem;
		padding: 1rem;
	}

	.popup .event .image {
		grid-column: 1;
	}

	.popup .event .details {
		grid-row: 3;
	}

	.popup .event .sub {
		grid-column: 1;
		grid-row: 4;
	}
}