*, *:before, *:after {
	  margin: 0; padding: 0;
	  -webkit-box-sizing: border-box;
	  -moz-box-sizing: border-box;
	  box-sizing: border-box;
	}

body { width: 100%; margin: 0; padding: 0; font-family: objektiv-mk1, sans-serif;
	font-weight: 300;
	font-style: normal; font-size: 1.25rem; color: black; box-sizing: content-box; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; position: absolute; }



/* Header und Navigation Start */

#header { position: absolute; width: 100%; z-index: 10; }
#header.mobile { display: none; }

#header_top { width: 90%; margin: 0 auto; margin-top: 1rem; }
#wrapper_top_left { float: left; margin-top: 1.2rem; font-family: objektiv-mk3, sans-serif;
	font-weight: 700;
	font-style: normal; font-size: 1.5rem; line-height: 1.9rem;}
#wrapper_top_left i { font-family: objektiv-mk1, sans-serif; font-weight: 300; font-size: 1.3rem; }
#wrapper_top_right { float: right; height: 100px; margin-top: 0.2rem; }
#wrapper_top_right img { width: 100%; }

#navi_start.nav { width: 80%; margin: 0 auto; margin-top: 4rem; }
.nav { list-style: none; font-family: "arvo", serif; font-weight: 700; font-style: normal; color: #ff5135; }
#navi_start.nav .level-1 { font-size: 4rem; }
.nav a { color: #ff5135; text-decoration: none }	
.nav a:hover { text-decoration: underline }

#wrapper_top_right div.logo { height: 90px; width: 90px; float: right; }
#wrapper_top_right div.logo img { width: 100%; height: auto; }

#button_kursplan { position: absolute;
	left: 6%;
	top: 112%;
	rotate: -15deg;
	z-index: 11;
	width: 125px;
	height: 125px; background: url("../../files_extra/navi/Button_Kursplan_hellgrau.png") no-repeat center; background-size: contain ; }


/* Navigation Top Dropdown Start*/

.dropdown div { display: none; position: absolute; }
li.dropdown:hover .dropdown-content { display: inline-block; }
.dropdown div ul { margin-block-start: 0; margin-block-end: 0; max-width: 900px; }
.dropdown div ul li.level-2 { display: inline-block; white-space: nowrap; margin-bottom: 0; }
.dropdown ul li.level-2:first-of-type { margin-top: 0; margin-left: 2rem; margin-bottom: -2rem; }
.dropdown ul li.level-2 { padding-left: 0.6rem; }
.dropdown ul li.level-2 a, .nav ul { font-size: 2rem; }
#navi_start .dropdown ul li.level-2:first-of-type::before { content: ""; font-size: 4rem; margin-bottom: 0; }
.dropdown ul li.level-2 a span { padding: 0; margin-bottom: 0; }

.nav li.level-1.dropdown:hover::after { content: " /"; }
.nav li.level-2::after { content: " / "; font-size: 2rem; }
.nav li.level-2:last-of-type::after { content: ""; font-size: 2rem; }




/* Header und Navigation Content*/

.body_content #header { position: fixed; width: 100%; height: 88px;z-index: 10; background-color: #ff5135; }
.body_content #header.mobile { display: none; }
.body_content #header.mobile #wrapper_top_left { position: relative; z-index: 100; }
.body_content #header.mobile #wrapper_top_right { 
position: fixed;
width: 80%; right: 5%;
margin-top: 0rem; }

.body_content #header_top { margin-top: 1rem;  }
.body_content #wrapper_top_left { margin-top: 0.5rem;
	font-size: 1.5rem;
	line-height: 1.2rem; }
.body_content #wrapper_top_left a { color: black; text-decoration: none; }
.body_content #wrapper_top_left i { font-size: 1.2rem; line-height: 2rem; }
.body_content #wrapper_top_right { margin-top: 0; }
.body_content #wrapper_top_right img { }

.body_content #wrapper_top_right div.logo { position: relative; z-index: 100; height: 70px; width: 70px; float: right; margin-top: -0.5rem; }

#navi_content.nav { margin: 0 auto; margin-top: 0.8rem; padding-right: 1rem; float: left; }
#navi_content.nav { list-style: none; font-family: "arvo", serif; font-weight: 700; font-style: normal; font-size: 1.5rem; }
#navi_content.nav a { color: white; text-decoration: none }	
#navi_content.nav a:hover { color: black; }
#navi_content.nav .level-1 a:hover { border-bottom: 2px solid black; padding-bottom: 2px; }
#navi_content.nav li.level-1.current>a, #navi_content.nav li.level-1.parent>a { border-bottom: 2px solid black; padding-bottom: 2px; color: black; } 


/* Navigation Top Dropdown Content*/
#navi_content.nav li { display: inline-block; margin-right: 1.5rem; }
#navi_content.nav .dropdown div { display: none; position: absolute; max-width: 240px; }
#navi_content.nav li.dropdown:hover .dropdown-content { display: block; }
#navi_content.nav .dropdown div ul { padding-left: 0; }
#navi_content.nav .dropdown div ul li.level-2 { display: block; white-space: pre-wrap; margin-bottom: 0.5rem; }
#navi_content.nav .dropdown ul li.level-2:first-of-type { margin-top: 2.4rem; }
#navi_content.nav .dropdown ul li.level-2 { margin-left: -1rem; }
#navi_content.nav .dropdown ul li.level-2 a { display: inline-block; font-size: 1rem; background: #ff5135; padding: 0.5rem 0.5rem 0.6rem 0.5rem; }
#navi_content.nav li.level-2.current>a span { color: black; } 
#navi_content.nav .dropdown ul li.level-2 { font-size: 1rem; }

#navi_content.nav .level-2 a:hover { border-bottom: 0; }
/*#navi_content.nav .level-2 a:hover span { border-bottom: 2px solid black; padding-bottom: 1.5px; }*/


#navi_content.nav li.level-1.dropdown:hover::after { content: none; }
#navi_content.nav li.level-2::after { content: none; }



/* Hamburger */	
#wrapper_hamburger { position: absolute; right: 8%; display: inline-block; float: left; margin-right: 1.5rem; font-size: 1.5rem; }
#wrapper_hamburger_navi_top { display: block; margin-top: 0.25rem; }
		
.hamburger { position: absolute; right: 0; height: 50px; width: 50px; background: url("../../files_extra/navi/closed_schwarz_breit.png") center; background-size: contain; background-repeat: no-repeat; cursor: pointer; cursor: grabpointer; z-index: 200; }
.hamburger_x { position: absolute; right: 0; height: 50px; width: 50px; background: url("../../files_extra/navi/open_schwarz_breit.png") center; background-size: contain; background-repeat: no-repeat; cursor: pointer; cursor: grabpointer; z-index: 200; }

.overlay { display: none; position: fixed; top: 0;
left: 0; z-index: 96; width: 100%; height: 100%; background: rgba(255, 255, 255, 0.8); }

	
/* Hamburger droppi */
#wrapper_hamburger_navi_top_droppi { display: inline-block; position: relative; z-index: 98; }
#navi_top_hamburger { display: none; 
	padding-top: 0; padding-bottom: 0; 
	text-align: right;
	}	
	
#navi_top_hamburger li { display: block; margin-top: 2rem; list-style: none; } 
#navi_top_hamburger li:first-of-type { margin-top: 5rem; }
#navi_top_hamburger a { text-decoration: none; color: white; background: #ff5135; padding: 0.3rem 0.5rem 0.4rem 0.5rem; }
#navi_top_hamburger a:hover { color: black; cursor: grabpointer; }	

#navi_top_hamburger .dropdown div { display: block; position: relative; margin-top: 0.4rem; }
#navi_top_hamburger .dropdown div ul { margin-block-start: 0; margin-block-end: 0; max-width: none; }

#navi_top_hamburger li.dropdown:hover .dropdown-content { display: block; }
#navi_top_hamburger .dropdown div ul li.level-2 { display: inline; white-space: pre-wrap; margin-bottom: 0.2rem; }
#navi_top_hamburger .dropdown ul li.level-2:first-of-type { }
#navi_top_hamburger .dropdown ul li.level-2 { margin-left: -1rem; }
#navi_top_hamburger .dropdown ul li.level-2 a { display: inline-block; white-space: nowrap; font-size: 1rem; background: #ff5135; padding: 0.3rem 0.5rem 0.4rem 0.5rem; margin-left: 1rem; margin-top: 0.4rem; }
#navi_top_hamburger li.level-2.current>a span { color: black; } 
#navi_top_hamburger .dropdown ul li.level-2, #navi_top_hamburger .dropdown ul li.level-2 a, .nav #navi_top_hamburger ul { font-size: 1rem; }

#navi_top_hamburger .level-2 a:hover { color: black; border-bottom: 0; }

#navi_top_hamburger  li.level-1.dropdown:hover::after { content: none; }
#navi_top_hamburger  li.level-2::after { content: none; font-size: 2rem; }
#navi_top_hamburger  li.level-2:last-of-type::after { content: none; font-size: 2rem; }




/* Slider */
#slider_start { position: relative;
	top: 0; left: 0;
	width: 100%;
	padding-bottom: 4rem;
	z-index: 1; opacity: 0.6; 
	overflow: hidden; }
	
.rslides {
	position: relative;
	list-style: none;
	overflow: hidden;
	width: 100%;
	padding: 0;
	margin: 0; }
	
.rslides li {
	 -webkit-backface-visibility: hidden;
	  position: absolute;
	  display: none;
	  width: 100%;
	  left: 0;
	  top: 0;
	  }
	
.rslides li:first-child {
	  position: relative;
	  display: block;
	  float: left;
	  }
	
.rslides img {
	  display: block;
	  height: auto;
	  float: left;
	  width: 100%;
	  border: 0;
	  }
	  
	  
	  
/* Backgrounds */

body.body_start .background { position: absolute; 
	width: 50%; 
	aspect-ratio: 1.18/1;
	bottom: 0;
	right: 0;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/IMG_8347_Arms_Zuschnitt_gespiegelt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }
	
body.body_content.kurse .background { position: fixed;
	width: 100%;
	aspect-ratio: 2.56/1;
	top: 40px;
	right: 0;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/IMG_7960_Arms_Zuschnitt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }		

body.body_content.workshops .background { position: fixed;
	width: 100%;
	aspect-ratio: 1.21/1;
	top: 240px;
	right: 0;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/IMG_1448_Arms_Zuschnitt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }		
	
body.body_content.buehne .background { position: fixed;
	width: 60%;
	aspect-ratio: 2.5/1;
	top: 480px;
	right: -1%;
	rotate: -5deg;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/4W6A0886_Arms_Zuschnitt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }			
body.body_content.buehne .background_zwei { position: fixed;
	width: 40%;
	aspect-ratio: 2.4/1;
	rotate: -3deg;
	top: 65px;
	left: 0;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/4W6A1140_Arms_Zuschnitt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }		
	
body.body_content.miete .background { position: fixed;
	width: 70%;
	aspect-ratio: 1.29/1;
	top: 120px;
	left: 0;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/4W6A1122_Arms_Zuschnitt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }			
	
body.body_content.about .background { position: fixed;
	width: 70%;
	aspect-ratio: 1.42/1;
	top: 70px;
	right: 0;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/IMG_3017_Arms_Zuschnitt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }		
body.body_content.about .background_zwei { 
	position: absolute; 
	width: 60%; 
	aspect-ratio: 0.64/1;
	bottom: 70px;
	left: 0;
	background: url("https://www.bewegungsraum-gaengeviertel.de/site/files_extra/backgrounds/4W6A8041_Arms_Zuschnitt.png") center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -10;
	opacity: 0.2; }			
	
		

.fadeIn_eins {
		  -webkit-animation: fadein 2s; /* Safari, Chrome and Opera > 12.1 */
		   -moz-animation: fadein 2s; /* Firefox < 16 */
			-ms-animation: fadein 2s; /* Internet Explorer */
			 -o-animation: fadein 2s; /* Opera < 12.1 */
				animation: fadein 2s;
	}
	
	@keyframes fadein {
		from { opacity: 0; }
		to   { opacity: 0.2; }
	}
	
	/* Firefox < 16 */
	@-moz-keyframes fadein {
		from { opacity: 0; }
		to   { opacity: 0.2; }
	}
	
	/* Safari, Chrome and Opera > 12.1 */
	@-webkit-keyframes fadein {
		from { opacity: 0; }
		to   { opacity: 0.2; }
	}
	
	/* Internet Explorer */
	@-ms-keyframes fadein {
		from { opacity: 0; }
		to   { opacity: 0.2; }
	}
	
	/* Opera < 12.1 */
	@-o-keyframes fadein {
		from { opacity: 0; }
		to   { opacity: 0.2; }
	}	
		



/* Content */

#content { width: 80%; margin: 0 auto; }	
#content.content_content { padding-top: 12rem; }

body.workshops #content.content_content, body.buehne #content.content_content { padding-top: 6rem; }
body.workshops_einzeln #content.content_content, body.buehne_einzeln #content.content_content, body.veranstaltungen_einzeln #content.content_content, body.workshops.archiv #content.content_content { padding-top: 12rem; }
body.workshops #content.content_content .title:has(h1), body.buehne #content.content_content .title:has(h1) { padding-top: 2rem; position: relative; z-index: 3; }
body.workshops.archiv #content.content_content .title:has(h1) { padding-top: 0; }	

#content a { color: #ff5135; text-decoration: none; font-weight: 400; }	
#content a:hover { text-decoration: underline; }	

#white { position: sticky; top: 4rem; width: 100%; height: 4rem; background: white; margin: 0 auto; z-index: 2; }

.wrappy { padding: 0 0 4rem 0; }  
.wrappy_reduced { padding: 0 0 2rem 0; }  
.wrappy:has(.galerie_single) { margin-top: -1rem; }  
body.basic .wrappy:has(.bild) { padding: 0 0 3rem 0; }  

.container { padding-bottom: 6rem; }
.container.kurse { padding-bottom: 8rem; }
.container:last-of-type { padding-bottom: 3rem; }

#contain_the_container { display: grid; grid-column-gap: 1%;
	grid-template-columns: 24.25% 24.25% 24.25% 24.25%; }
#contain_the_container.mobile { display: none; }
.contain_the_kursplan-container { display: grid; grid-column-gap: 1%;
	grid-template-columns: 13.4285% 13.4285% 13.4285% 13.4285% 13.4285% 13.4285% 13.4285%; width: 112.8%;
	margin-left: -6.4%; }
.contain_the_kursplan-container.mobile { display: none; }
.contain_the_kursplan-container a div div { text-decoration: none; }
#content .contain_the_kursplan-container a:hover { text-decoration: none; }

	
	
.teasertext { overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical; 
  hyphens: auto; hyphenate-limit-chars: auto 5 4; }
.text.continue { font-size: 1rem; color: #ff5135; }

.container.teaser .bild { aspect-ratio: 2/3; overflow: hidden; display: flex; 
	justify-content: center; align-items: center; }
.container.teaser .veranstaltungstyp { font-family: "arvo", serif;
	font-weight: 700; font-style: normal; font-size: 0.8rem; color: #333; margin-bottom: 0.2rem; }
.container.teaser .veranstaltungstyp .date { font-size: 0.75rem; }
	

.container .title { margin-bottom: 0.2rem; }
.container.teaser .title { margin-bottom: 0.5rem; display: none; }
.container .date { font-size: 1rem; }
.container .date.date_top { margin-bottom: 0.2rem; font-size: 1rem; }

.kurse #contain_the_container .container { padding-bottom: 1rem; color: black; hyphens: auto; }
.kurse #contain_the_container .container_inner { background: rgb(107, 203, 172); padding: 1rem; }
.kurse #contain_the_container a:hover .container_inner { background: #ff5135; }

.container.kurse .galerie { margin-top: 2rem; }

.container.kursplan { background: rgba(255,81,53, 0.4);
	padding: 0.5rem; font-size: 1rem; margin-bottom: 1rem;
	hyphens: none; cursor: default; }
.container.kursplan:hover { background: #ff5135; cursor: default; }

.container.kursplan .kurszeit { font-size: 0.8rem; color: black; }
.container.kursplan:hover .kurszeit { color: black; }
.container.kursplan .trainer { color: black; padding-bottom: 0.5rem; }
.container.kursplan .notiz { font-size: 0.8rem; font-family: objektiv-mk3, sans-serif; font-weight: 700; font-style: normal; background-color: #ff5135; color: black; display: inline; line-height: 0.9rem;}
.container.kursplan:hover .notiz { background-color: rgb(107, 203, 172); color: black; }
.container.kursplan .title, #content .container.kursplan .title p a { font-family: "arvo", serif; font-weight: 700; font-style: normal; font-size: 1rem; color: black; margin-block-end: 0.5rem; }
#content .container.kursplan .title p a:hover { text-decoration: underline; cursor: pointer; }
.container.kursplan.leer, .container.kursplan.leer:hover { background: none; cursor: default; }


/* Kursplan see through */
body.kursplan .container.kursplan { border: 2px solid rgb(107, 203, 172); background: none;
	padding: 0.5rem; font-size: 1rem; margin-bottom: 1rem;
	hyphens: auto; cursor: pointer; }
body.kursplan .container.kursplan:hover { border: 2px solid #ff5135; background: none; cursor: pointer; }
body.kursplan .container.kursplan.leer, body.kursplan .container.kursplan.leer:hover { border: 0; cursor: default; }
body.kursplan .container.kursplan:hover .kurszeit { color: #ff5135; }

	
.container.workshops, .container.buehne { padding-bottom: 1rem; margin-bottom: 2rem;}
.container.workshops .bild, .container.buehne .bild { aspect-ratio: 3/2; overflow: hidden; display: flex; justify-content: center; align-items: center; }	

.contain_the_archiv-container { display: grid; grid-column-gap: 1%; grid-row-gap: 1rem; grid-template-columns: 24.25% 24.25% 24.25% 24.25%; }
.container.archiv {
  width: 100%;
  max-width: 800px;
  perspective: 1000px;
  overflow: hidden;
  padding-bottom: 0rem;
}

/* Diese Div sorgt für das Seitenverhältnis */
.ratio-wrapper {
  position: relative;
  width: 100%;
  aspect-ratio: 2 / 3;
}

.flip {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.8s ease;
}

.flip:hover {
  transform: rotateY(180deg);
}

.bild.archiv,
.text.archiv {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
}

.bild.archiv img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.text.archiv {
  transform: rotateY(180deg);
  background: #ff5135;
  color: white;
  text-align: center;
}

.container.archiv .text h2 {
  width: 96%;
  text-align: center;
}


.linke_spalte { width: 48%; margin-right: 4%; float: left; }
.rechte_spalte { width: 48%; float: right; }
.rechts_zwei_drittel { width: 66%; float: right; }
.links_zwei_drittel { width: 66%; float: left; }

.absatz { margin-bottom: 2rem; }
.teaser .absatz { margin-bottom: 0.8rem; }
.absatz_kl { margin-bottom: 1rem; }
.bild { width: 100%; }
.bild.rechts_drittel { float: left; width: 30%; margin-left: 4%; padding-top: 0.3rem; }
.bild.links_drittel { float: left; width: 30%; margin-right: 4%; padding-top: 0.3rem; }
.bild img { width: 100%; }
.container.teaser .bild img, .container.archiv .bild img { height: 100%; width: auto; }
.container.workshops .bild img, .container.buehne .bild img { width: 100%; height: auto; }
.bildunterschrift { font-size: 0.8rem; text-align: start; padding-top: 0.2rem; }

.text ul li, .text ol li { list-style-position: inside; }
.text p { padding-bottom: 0.5em; line-height: 1.9rem; }
.text li { line-height: 1.9rem; }
.text p:last-of-type { padding-bottom: 0em; }
.kurztext { margin-top: 2rem; }
.kurztext.absatz_kl { margin-top: 1rem; }
body.workshops_einzeln .kurztext.absatz_kl { margin-top: 0; }
.zusatzinfos { margin-top: 2rem; }
.kurse .zusatzinfos { padding-top: 2rem; border-top: 2px solid #333333; }

table, .text table, .text table p { width: 100%; font-size: 1rem; line-height: 1.5rem; } 
table, th, td { border: 1px solid #333333 !important; -webkit-border-horizontal-spacing: 0 !important; -webkit-border-vertical-spacing: 0 !important;} 
td { padding: 8px 8px 10px 8px; }

.trennlinie { border-top: 2px solid #333333; }

.galerie_single { float: left; height: 200px; width: auto; margin-right: 1%; margin-top: 1rem; }
.galerie_single img { height: 100%; width: auto; }

.activator::after { content: "weitere Infos …"; color: #ff5135; }
.activator.activated::after { content: "weitere Infos … / close"; color: #ff5135; }
.activator { cursor: pointer; color: #ff5135; font-weight: 400; }
.activator:hover { cursor: pointer; text-decoration: underline; }
.hidden { display: none; margin-top: 2rem; margin-bottom: 1rem; padding-bottom: 2rem; border-bottom: 2px solid #333333; }
.workshops_einzeln .hidden, .buehne_einzeln .hidden, .veranstaltungen_einzeln .hidden { margin-top: 2rem; margin-bottom: 0; padding-bottom: 0; border-bottom: 0; }


/* Slider Teaser auf Startseite / Slick-Slider */

#slider_teaser {  width: 100%; margin: 0 auto; }
#contain_the_container.content_slider { margin-left: -10px; margin-right: -10px; display: block; }
#contain_the_container.content_slider .container { padding:15px; }
#contain_the_container.content_slider .container img { width: auto; height: 100%; }


/* Zeitleiste */

#zeitleiste { display: flex; position: sticky; top: 8rem; background: #ff5135; color: black; margin-bottom: 3rem; padding: 1rem; justify-content: space-between; font-family: "arvo", serif; font-weight: 700; font-style: normal; }
#content .monat a { font-weight: 700; }
#content #zeitleiste .monat a, #content #zeitleiste .monat { color: rgb(255, 189, 180); }
#content #zeitleiste .monat a:hover { color: rgb(255, 189, 180); text-decoration: none; }
#content #zeitleiste .monat a, #content #zeitleiste .monat, #content #zeitleiste .monat a:hover, #content #zeitleiste div.monat:hover, #content #zeitleiste span.monat:hover { pointer-events: none; cursor: default; }
#content #zeitleiste .monat.superactive a { color: white}
#content #zeitleiste .monat.superactive a:hover { color: black; text-decoration: none; }
#content #zeitleiste .monat.superactive a, #content #zeitleiste .monat.superactive a:hover, #content #zeitleiste .monat.superactive:hover, #content #zeitleiste .monat.superactive.current:hover { pointer-events: auto; cursor: pointer; }
#content #zeitleiste .monat.current { border: 2px solid rgb(255, 189, 180); padding-inline: 0.5rem; margin-top: -2px; }
#content #zeitleiste .monat.superactive.current { border: 2px solid white; }
#content #zeitleiste .monat.superactive.current:hover { border: 2px solid black; }
#content #zeitleiste .monat.superactive.current:hover a { color: black}
div.month h2 { display: none; }
div.month h2:first-of-type { display: block; color: #333333; }



/* Schriftstandards */
.text { font-size: 1.15rem; letter-spacing: -0.3px; text-align: justify; }
table { text-align: left; }
.text h2, .text h3 { letter-spacing: 0; text-align: left; }
.text.teasertext, .text.teasertext p { font-size: 1rem; line-height: 1.5rem; }
h1 { font-family: "arvo", serif;
	font-weight: 700;
	font-style: normal; font-size: 3rem; color: #ff5135; margin-block-end: 2rem; }
.workshops h1, .buehne h1 { margin-block-end: 2.5rem; }	
.megatitle h1 { font-family: objektiv-mk3, sans-serif; font-weight: 700; font-style: normal; font-size: 1.5rem; line-height: 1.9rem; color: black; }
/* .content_content h1 { color: rgb(107, 203, 172); } */
h2 { font-family: "arvo", serif;
	font-weight: 700;
	font-style: normal; font-size: 1.5rem; color: #ff5135; margin-block-start: 0px; margin-block-end: 1.5rem; }
.container .title h2 { margin-block-end: 0; }	
.content_content h2 { color: #333333; }
.kurse_einzeln .content_content h2, .workshops_einzeln .content_content h2, .buehne_einzeln .content_content h2, .veranstaltungen_einzeln .content_content h2 { color: #ff5135; }
.content_content .title.subhead h2 { font-size: 1.5rem; }
.content_content .activator:hover .title h2 { color: #ff5135; }
.kurse .content_content .teaser h2 { color: #333333; }
div.month .title h2 { color: #333333; }
.container.archiv h2 { color: white; margin-block-end: 0rem; }
.container.workshops h2, .container.buehne h2 { font-size: 1.5rem; }
h3 { font-family: "arvo", serif;
	font-weight: 700;
	font-style: normal; font-size: 1.3rem; color: #333333; margin-block-start: 0.5rem; margin-block-end: 0.5rem; }
i , em { font-style: italic; }
strong, b { font-family: objektiv-mk3, sans-serif; font-weight: 700; font-style: normal; color: #333333}
.med { font-family: objektiv-mk3, sans-serif; font-weight: 400; font-style: normal; }
.anthrazit { color: #333333; }
.green { color: rgb(26, 184, 142); }
.container.kursplan.weekday { font-family: "arvo", serif;
	font-weight: 700; font-style: normal; font-size: 1.3rem; color: #333333; }
	
.clear { clear: both; }



/* Footer */
#footer { width: 100%; padding-top: 4rem; position: static; }
#wrapper_bottom { width: 90%; margin: 0 auto; position: relative; border-top: 2px solid #ff5135; }

#navigation_bottom_right.nav_footer{ padding-top: 1rem; padding-bottom: 1rem; float: right; font-size: 1.3rem; }
#navigation_bottom_right div { display: inline-block; margin-left: 1.5rem; }
#footer li { list-style: none; } 
#footer a { text-decoration: none; } 
#footer.footer a { color: #ff5135; }
#footer a:hover { text-decoration: underline; }






/* große Ausgabegeräte */
@media screen and (min-width: 1440px) { 
  #header_top, #content, #wrapper_bottom { width: 1280px; }
  #navi_start.nav { width: 1080px; }
  
  .rslides { height: 760px; }
  }
  
/* sehr große Ausgabegeräte */
@media screen and (min-width: 1880px) { 
  
  .rslides { height: 640px; }
 
  .dropdown div ul { max-width: 1200px;  }
  
  #button_kursplan { left: 8%; top: 100%; }
  
  }
  
  
  
  
/* kleiner werdende Ausgabegeräte */
@media screen and (max-width: 1296px) { 
	
	#navi_content.nav { font-size: 1rem; margin-top: 1.2rem; }
	#navi_content.nav li { margin-right: 0.8rem; }
	#navi_content.nav .dropdown div ul li.level-2 { margin-bottom: 0.3rem; }

}
  


  @media screen and (max-width: 1240px) { 
  
  #navi_start.nav { margin-top: 2rem; }
  #navi_start.nav .level-1 {  font-size: 3.6rem; }
  #navi_start.nav .dropdown ul li.level-2 a, #navi_start.nav ul { font-size: 1.8rem; }
  #navi_start .dropdown ul li.level-2:first-of-type::before { font-size: 3.6rem; }
  
  #button_kursplan { top: 110%; }
  
  .container.kursplan { hyphens: auto; }
  
}  


@media screen and (max-width: 1060px) { 
  
  .body_content #header { display: none; }
  .body_content #header.mobile { display: block; position: fixed; width: 100%; height: 88px;z-index: 10; background-color: #ff5135; }
	
  #navi_start.nav { margin-top: 1rem; }
  #navi_start.nav .level-1 {  font-size: 2.8rem; }
  #navi_start.nav .dropdown ul li.level-2 a, #navi_start.nav ul { font-size: 1.5rem; }
  #navi_start .dropdown ul li.level-2:first-of-type::before { font-size: 2.8rem; }
  
  #button_kursplan { width: 120px; height: 120px; }
	
  body.body_content.workshops .background { 
  width: 170%;
  top: 180px;
  }		
  
  #content.content_content { padding-top: 10rem; }
  body.workshops #content.content_content, body.buehne #content.content_content { padding-top: 4rem; }
  body.workshops_einzeln #content.content_content, body.buehne_einzeln #content.content_content, body.veranstaltungen_einzeln #content.content_content, body.workshops.archiv #content.content_content { padding-top: 10rem; }
  body.workshops #content.content_content .title:has(h1), body.buehne #content.content_content .title:has(h1) {
	padding-top: 2rem; }
  body.workshops.archiv #content.content_content .title:has(h1) { padding-top: 0; }	
	
  .contain_the_archiv-container { display: grid; grid-column-gap: 1%; grid-template-columns: 32.6% 32.6% 32.6%; }	
}
	
	  
  
@media screen and (max-width: 880px) { 
  
  #navi_start.nav { margin-top: 0.5rem; }
  #navi_start.nav .level-1 {  font-size: 2.2rem; }
  #navi_start.nav .dropdown ul li.level-2 a, #navi_start.nav  ul { font-size: 1.1rem; }
  #navi_start .dropdown ul li.level-2 { padding-left: 0.3rem; }
  #navi_start .dropdown ul li.level-2:first-of-type::before { font-size: 2.2rem; }
  #navi_start .dropdown ul li.level-2:first-of-type { margin-left: 1rem; padding-left: 0.6rem; }
  #navi_start.nav ul li.level-2::after { font-size: 1.1rem; }
  
  body.body_start .background { 
   	  width: 80%; }	
  body.body_content.kurse .background { 
 	  width: 120%;
 	  top: 60px; }		
  body.body_content.buehne .background { 
	  width: 80%;
	  top: 360px; }			
  body.body_content.buehne .background_zwei { display: none; }	
  body.body_content.miete .background { 
	  width: 98%;
	  top: 260px; }			
  body.body_content.about .background { 
	  width: 70%;
	  top: 70px;
	  right: 0; }		
  body.body_content.about .background_zwei { 
	  width: 60%; 
	  bottom: 90px;
	  left: 0; }		
	  
  .contain_the_kursplan-container { display: none; }
	  .contain_the_kursplan-container.mobile { display: block; width: 100%; margin-left: 0; }
	  .contain_the_kursplan-container.mobile a:has(.leer) { display: none; }
	  .contain_the_kursplan-container.mobile div:has(.leer) { display: none; }
	  .contain_the_kursplan-container.mobile .weekday { margin-top: 3rem; }
	  .contain_the_kursplan-container.mobile .weekday:first-of-type { margin-top: 0; }
	  .container.kursplan { width: 100%; }	  		
  
  .wrappy { padding: 0 0 4rem 0; }
  .wrappy_reduced { padding: 0 0 2rem 0; }  
	
  .linke_spalte { width: 100%; margin-right: 0; float: none; padding-bottom: 1rem; }
  .rechte_spalte { width: 100%; float: none; }
  
  .monat { font-size: 1.1rem; }
  .text.blau { padding-top: 3rem; }
	
	}  
	
	
@media screen and (max-width: 800px) { 
	  
	#slider_start { }  	
	.rslides { width: 110%; left: -5%;}
	
	#navigation_bottom_right.nav_footer { font-size: 1.2rem; }
	}
	
	
@media screen and (max-width: 720px) { 
	  
	  #slider_start { }
	  .rslides { width: 120%; left: -10%;}
	  
	  #wrapper_hamburger { right: 9.5%; }
	  
	  .wrappy { padding: 0 0 3rem 0; }
	  .wrappy_reduced { padding: 0 0 2rem 0; }  
	  
	  .contain_the_archiv-container { display: grid; grid-column-gap: 2%; grid-template-columns: 49% 49%; }	
	  
	  #white { }
		
		#zeitleiste {
		display: flex;
		overflow-x: scroll;
		width: 126%;
		margin-left: -13%;
		margin-bottom: 3rem;
		padding: 1rem;
		justify-content: space-between;
		white-space: nowrap;
		}
		.monat { margin-left: 1.6rem; }
		.monat:first-of-type { margin-left: 0.1rem; }
	  
	  .galerie_single { height: 120px; margin-right: 1%;
	  margin-top: 0.8rem; }
	  
	  h1 { font-size: 2.4rem; margin-block-end: 2rem; }
	  .workshops h1 { margin-block-end: 2.5rem; }	
	  h2 { font-size: 1.4rem; margin-block-start: 0px; margin-block-end: 1.5rem; }
	  .container .title h2 { margin-block-end: 0; }	
	  .container.workshops h2, .container.buehne h2 { font-size: 1.2rem; }
	  .content_content .title.subhead h2 { font-size: 1.2rem; }
	  h3 { font-size: 1.2rem; margin-block-start: 0.5rem; margin-block-end: 0.5rem; }
		
	}  	
	
	
@media screen and (max-width: 640px) { 
	
	  #slider_start { }
	  .rslides { width: 130%; left: -15%;}
	  
	  .body_content #wrapper_top_left { margin-top: 0.75rem;
	  font-size: 1.2rem; line-height: 1rem; }
	  .body_content #wrapper_top_left i { font-size: 1.1rem; line-height: 1.8rem; }
	  #wrapper_hamburger { right: 10.5%; }
	  
	  #content.content_content { padding-top: 8rem; }
	  
	  body.workshops #content.content_content, body.buehne #content.content_content { padding-top: 4rem; }
	  body.workshops_einzeln #content.content_content, body.buehne_einzeln #content.content_content, body.veranstaltungen_einzeln #content.content_content, body.workshops.archiv #content.content_content { padding-top: 8rem; }
	  body.workshops #content.content_content .title:has(h1), body.buehne #content.content_content .title:has(h1) {
	  padding-top: 0rem; }
	  
	  #white { top: 2rem; }
	  #zeitleiste { top: 6rem; }
	  
	  .rechts_zwei_drittel { width: 100%; float: none; margin-top: 1rem; }
	  .links_zwei_drittel { width: 100%; float: none; }
	  .bild.rechts_drittel { width: 100%; float: none; margin-top: 1rem; margin-left: 0; }
	  .bild.links_drittel { width: 100%; float: none; margin-right: 0; }	
	  
	  .text { font-size: 1.2rem; }
	  .text.blau { padding-top: 2rem; }	
	}  		
	

@media screen and (max-width: 610px) { 
	  
	  .body_start #wrapper_top_left { width: 80%; margin-top: 1.9rem; font-size: 1.2rem; line-height: 1.3rem; }
	  .megatitle h1 { font-size: 1.2rem; line-height: 1.3rem; }
	  .body_start #wrapper_top_left i { font-size: 1.2rem; line-height: 2rem; }
		
	  #wrapper_hamburger { right: 0; margin-right: 0; float: none; }
	  
	  .body_content #wrapper_top_right div.logo { height: 70px; width: 70px; float: right; margin-top: -0.5rem; margin-right: 60px; }
	  
	  .body_start .dropdown div ul { max-width: 400px; }
	  
	  #navigation_bottom_right.nav_footer { font-size: 1.1rem; }
	}  		
	
	
@media screen and (max-width: 580px) { 
	  
	  #slider_start { }
	  .rslides { width: 156%; left: -28%;}
	  
	  .body_start #wrapper_top_left { width: 65%; margin-top: 1rem; }
	  .body_start #wrapper_top_left i { font-size: 1rem; line-height: 1.6rem; }
	  
	  #wrapper_hamburger { right: 0; margin-right: 0; float: none; }
	  
	  .body_content #wrapper_top_left { margin-top: 0.75rem; font-size: 1.1rem; line-height: 1rem; }
		.body_content #wrapper_top_left i { font-size: 1.0rem; line-height: 1.6rem; }
	  
	  .body_content #wrapper_top_right div.logo { height: 70px; width: 70px; float: right; margin-top: -0.5rem; margin-right: 60px; }
	  
	  
	  #slider_teaser {  display: none; }
	  
	  .body_start div.trennlinie { display: none; }
	  .body_start .wrappy.aktuelles {  display: none; }
	  #contain_the_container.mobile { display: block; }
	  .container.teaser { padding-bottom: 4rem; }
	  
	  h1 { font-size: 2rem; }
	}  			
	

@media screen and (max-width: 500px) { 
	
	  #slider_start { }
	  .rslides { width: 170%; left: -35%;}
	  #button_kursplan { width: 95px; height: 95px; }
	  
	  .body_start #wrapper_top_left { margin-top: 0.45rem; }
	  .body_start #wrapper_top_right { height: 80px; }
	  .body_start #wrapper_top_right div.logo { height: 70px; width: 70px; }
	  .body_start .dropdown div ul {
	  max-width: 310px; }
	  .body_start .dropdown ul li.level-2 { padding-left: 0rem; }
	  .dropdown ul li.level-2:first-of-type { padding-left: 0.6rem; }
	  
	  .body_content #header.mobile { height: 75px; }
	  .body_content #header_top { margin-top: 0.5rem; }
	  .body_content #wrapper_top_right div.logo { display: none; }
	  .body_content #header.mobile #wrapper_top_right { width: 90%; }
	  #navi_top_hamburger .dropdown ul li.level-2, #navi_top_hamburger .dropdown ul li.level-2 a, .nav #navi_top_hamburger ul { font-size: 0.85rem; }
	  
	  
	  #navi_start.nav .dropdown div ul li.level-2 { white-space: pre-wrap; }
	  
	  #wrapper_hamburger { font-size: 1.3rem; }
	  #navi_top_hamburger li { margin-top: 1.5rem; }
	  
	}  		
	
	
@media screen and (max-width: 440px) { 
	
	  #slider_start { }
	  .rslides { width: 180%; left: -40%;}
	  
	  .body_start #wrapper_top_left i { font-size: 0.8rem; line-height: 1.4rem; }
	  
	  .body_content #wrapper_top_left { width: 80%; margin-top: 0.25rem; }
	  
	  #navigation_bottom_right.nav_footer { font-size: 1rem; }
	}  				
	
	
@media screen and (max-width: 400px) { 
	
	  #slider_start { }
	  .rslides { width: 200%; left: -50%;}
	  
	  #button_kursplan { top: 104%; }
	  
	  .text { text-align: left; }
	}  				
	
			
  