/* =============================================================================================== */
/* 
	Abschnitte
*/
/* =============================================================================================== */

.abschnitt {
	position: relative;
	left: 50%;
	width: calc(100vw);
	margin-left: calc(-50vw);
}

/*
@media only screen and (min-width: 680px) {
	.abschnitt {
		width: calc(100vw - 15px);
		margin-left: calc(-50vw + 7.5px);
	}
	.MacOS .abschnitt {
		width: 100vw;
		margin-left: -50vw;
	}
}
*/
.abschnitt__content {
	max-width: calc(836px + 40px);
	width: 100%;
	margin: 0 auto;
	left: 50%;
	padding:  30px 20px;
}
.startseite .abschnitt__content {max-width: calc(1196px + 40px);} 


.abschnitt__content > *:first-child {margin-top: 0px; padding-top: 0px;}
.abschnitt__content > *:last-child {margin-bottom: 0px; padding-bottom: 0px;}



/* =============================================================================================== */
/* 
	Buttons
*/
/* =============================================================================================== */

.button {
	display: inline-block;
	padding: 7px 10px 8px 10px;
	min-width: 180px;
	
	font-size: 24px;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
	color: #FFFFFF;
	border: 1px solid #3D4658;
	background-color: #3D4658;
}

.button-transparent {background-color: transparent; color: #3D4658;}
.bg-dunkel .button-transparent {color: #FFFFFF; border-color: #FFFFFF;}

.button-weisserrahmen {border-color: #FFFFFF;}


.hover .button, .button:hover, .button:focus, .button:active {color: #3D4658; border-color: #3D4658; background-color: #FFFFFF; text-decoration: none;} 

.button-links {float: left;}
.button-rechts {float: right;}

form .button {margin-top: 28px;}


/* =============================================================================================== */
/* 
	Boxen
*/
/* =============================================================================================== */

.box-content {padding: 20px; overflow: hidden;}

/* Abstände erstes und letztes Element in Box-Content */
.box-content > *:first-child {margin-top: 0px;}
.box-content > *:last-child  {margin-bottom: 0px;}

/* Abstände erstes und letztes Element in Grid innerhalb Box-Content */
.box-content > .ym-grid > div > *:first-child {margin-top: 0px;}
.box-content > .ym-grid > div > *:last-child  {margin-bottom: 0px;}


/* einfacher 2-Spalter */
.kkrt2spalt .ym-g50.ym-gl {width: calc(50% - 10px); margin-right: 10px;}
.kkrt2spalt .ym-g50.ym-gr {width: calc(50% - 10px); margin-left: 10px;}


/* Toggle Box */
.toggle-box {margin-bottom: 14px;}
.toggle-box.box-content {padding: 5px 20px;}
.toggle-box-header * {margin: 0px;}
.toggle-box-header i {float: right; margin-top: 5px;}
.toggle-box-content {margin-top: 14px;}
.toggle-box-content > *:last-child  {margin-bottom: 0px;}

/* Personen Box */
.box_person {}
.box_person h2, .box_person h3 {text-align: left; margin-bottom: 7px;}
.box_person .bezeichnung {font-size: 125%;}



/* =============================================================================================== */
/* 
	KKRT2018 Kopf
*/
/* =============================================================================================== */
.kkrt2018-header {
	position: relative;
	text-align: center;
	color: #FFFFFF;
}


/* =============================================================================================== */
/* 
	Bereichsauswahl
*/
/* =============================================================================================== */

/* vertikale Zentrierung des Inhalts */
.bereichsauswahl {
	display: flex;
	align-items: center;
	position: relative;
	padding: 0 50px;
}

.bereichsauswahl .content {
	width: 100%;
	z-index: 1;
}

/* Default, wenn es eigentlich gar keine Bereichsauswahl gibt */
.bereichsauswahl {
	padding-top: 42px;
	background-repeat: no-repeat;
	background-size: cover;
}

.bereichsauswahl-aktiv {
	min-height: 620px;
	background-position: center center;
	background-image_: url('./images/kopfbild-einstieg.jpg');
}


.bereichsauswahl-inaktiv {
	min-height: 225px;
	background-position: center center;
	background-image: url('./images/kopfbild-default.png');
}


/* spezielle Anpassungen der Formular-Elemente */
.bereichsauswahl label {font-weight: 600; font-size: 1.2EM;}
.bereichsauswahl select {width: auto; max-width: 100%;}



/* DEV SLIDER */
.bereichsauswahl-slider-slide {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
}

.bereichsauswahl-aktiv-top, .bereichsauswahl-aktiv-top .bereichsauswahl-slider-slide {
	background-position: center top;
}

.bereichsauswahl-slider-slide {
	background-image: none;
}
.bereichsauswahl-slider-slide.move {
	transform: translate(-100%);
}

/* =============================================================================================== */
/* 
	Bildwechsler (slick)
*/
/* =============================================================================================== */

.slick-class .slick-dots {margin: 0; bottom: auto; top: -28px;}
.slick-class .slick-dots button::before {font-size: 16px;}

.slick-class .slick-prev, .slick-slider .slick-next {height: 100%; top: 0; width: 6%; text-align: center;}
.slick-class .slick-prev:before, .slick-slider .slick-next:before {font-family: Font Awesome\ 5 Pro; font-size: 60px; content: "\f053"; text-shadow: 0 0 5px #5A5A5A; color: rgba(255,255,255,0.5);}
.slick-class .slick-next:before {content: "\f054";}
.slick-class .slick-prev:hover:before, .slick-slider .slick-next:hover:before {color: #FFFFFF;}

.slick-class .slide-container {height: auto;}
.slick-prev, .slick-next {z-index: 1;}

.slick-class .slide-container .box-content {padding: 0;}

.slick-class .slide-container img {width: 100%; height: auto;}

@media screen and ( min-width: 761px ) {
	.slick-class {padding: 20px;}
	.slick-class .image-container, .slick-class .text-container {width: calc(50% - 10px);}
	.slick-class .image-container {margin-left: 10px;}
	.slick-class .text-container {margin-right: 10px;}
	.slick-class .slide-container.slick-slide {display: flex; flex-direction: row; align-items: center;}
}
@media screen and ( max-width: 760px ) {
	.slick-class .slick-prev:before, .slick-class .slick-next:before {font-size: 36px;}
	.slick-class .box-content {width: 100%;}
	.slick-class .text-container {margin: 20px 0;}
	
	.slick-class .slide-container.slick-slide {display: flex; flex-direction: column-reverse;}
}


/* =============================================================================================== */
/* 
	Iconlinks
*/
/* =============================================================================================== */

.iconlinks {position: absolute; right: 0; top: 0px; font-weight: 600; z-index: 1;}
.iconlinks i {font-size: 32px; vertical-align: sub;}

.iconlinks a {display: block; overflow: hidden; padding-top: 8px;}
.iconlinks a, .iconlinks i {width: 50px; height: 50px;}
.iconlinks .iconlinks-li-1 a {width: auto; padding-right: 15px;}

.iconlinks a.noicon {padding-left: 20px;}

.iconlinks li {border-radius: 5px 0 0 5px; margin-top: 5px !important; float: right; clear: right;}


/* =============================================================================================== */
/*
	LinkExternalVideo
*/
/* =============================================================================================== */

.LinkExternalVideo {position: relative; display: block; line-height: 0;}
.LinkExternalVideo img {width: 100%; height: auto;}
.LinkExternalVideo i {
	position: absolute;
	font-size: 50px;
	top: calc(50% - 25px);
	left: calc(50% - 25px);

	background-color: rgba(220, 220, 220, 0.7);
	color: #666666;
	padding: 10px 20px;
	border-radius: 5px;
}
.LinkExternalVideo:hover i {color: #333333;}

/* =============================================================================================== */
/* 
	Quicklinks
*/
/* =============================================================================================== */

.quicklinks ul {display: flex;}

.quicklinks__li {
	width: 25%;
	text-align: center;
	
	border-style: solid;
	border-color: #FFFFFF;
	border-width: 2px 2px 2px 0;
}
.quicklink-li-4 {border-right-width: 0;}

.quicklinks__li__a {display: block; font-size: 24px; padding: 22px 0;}

@media screen and ( max-width: 760px ) {
	/* Quicklinks alle untereinander */
	.quicklinks ul {display: block;}
	.quicklinks__li {width: 100%; border-width: 1px 0 1px 0;}
	.quicklink-li-livestream {border-top-width: 2px;}
	.quicklink-li-4 {border-bottom-width: 2px;}
}

@media screen and ( max-width: 480px ) {
	.quicklinks__li {width: 100%; border-right-width: 0;}
}

.quicklink-li-livestream {background-color: #084A97;}
@media screen and ( max-width: 760px ) {
	.quicklinks .quicklink-li-livestream__icon, .quicklink-li-livestream__text {display: none;}
}

@media screen and ( min-width: 761px ) {
	.quicklink-li-livestream {
		position: absolute;
		left: 0;
		top: 143px;
		z-index: 1;
		width: auto;
		
		text-align: left;
		line-height: 1.2;
		border-width: 0;
	}
	.quicklinks-li-a-livestream {padding: 5px 20px 10px 75px;}
	.quicklink-li-livestream__icon {position: absolute; left: 0px; top: 5px; font-size: 55px; margin: 5px 10px 0;}
	.quicklink-li-livestream__head {font-weight: 700;}
	.quicklink-li-livestream__text {display: block; font-size: 15px; margin-top: -20px;}
}

/* =============================================================================================== */
/* 
	Daisy Award
*/
/* =============================================================================================== */

@media screen and ( min-width: 761px ) {
	.daisyaward-li{
		position: fixed;
		left: 20px;
		bottom: 20px;
		z-index: 1;
	}
	
	.daisyaward-a img {width: 12VW; height: auto;}
}



/* =============================================================================================== */
/* 
	KKRT2018 Fusslinks
*/
/* =============================================================================================== */

.kkrt2018-fusslinks {color: #FFFFFF; font-size: 16px;}

.kkrt2018-fusslinks h3 {font-size: 16px; text-transform: uppercase; text-align: left; margin-bottom: 14px;}
.kkrt2018-fusslinks a {display: block;}
.kkrt2018-fusslinks a:hover {color: #FFFFFF; text-decoration: underline;}
.kkrt2018-fusslinks h3, .kkrt2018-fusslinks a {padding-left: 5px;}


.kkrt2018-fusslinks.socialmedia {text-align: center;}
.kkrt2018-fusslinks.socialmedia li {display: inline-block; padding: 5px;}
.kkrt2018-fusslinks.socialmedia i {font-size: 35px;}

.kkrt2018-fusslinks.legalnotes {text-align: center; margin: 1EM;}
.kkrt2018-fusslinks.legalnotes a {display: inline-block;}