*, *:before, *:after {-webkit-box-sizing: border-box; /* Safari/Chrome, andere WebKit-Browser */-moz-box-sizing: border-box; /* Firefox, andere Gecko-Browser */box-sizing: border-box; /* Opera/IE 8+ */}
*, *:before, *:after {-webkit-box-sizing: border-box; /* Safari/Chrome, andere WebKit-Browser */-moz-box-sizing: border-box; /* Firefox, andere Gecko-Browser */box-sizing: border-box; /* Opera/IE 8+ */}
html    { font-size: 100%; overflow-x: hidden}
body { font-size: 0.9em; font-family: 'aleoregular', Verdana, sans-serif }
body { background-color: #febcbd ; margin: 0; padding: 0; }
#page-wrapper { background-color: white }
p { color: #6e6e6e; font-size: 1.6em; font-family: 'aleoregular', Verdana, sans-serif ; line-height: 1.6em; }
a:link { color: #f80000; text-decoration: none; outline-style: none }
a:visited { color: #f00; text-decoration: none; outline-style: none  }
a:hover, a:focus, a:active { color: #febcbd }
li { color:#6e6e6e }

h1 { color: black; font-size: 3em; font-weight: bold; line-height: 1.3em; margin: 30px 0 -10px 0; padding: 0; max-width: 350px; }
.jahreszahl { font-size: 4.5em; line-height: 0.8em; color: red; margin-bottom: 15px;  }
.archivtitel { font-size: 2.3em; line-height: 1.2em; margin-top: px; margin-bottom: -10px }
.serviceheadline { margin-top: -40px;  }
h2 { color: red; font-size: 2.2em; font-weight: bold; line-height: 1.2em; margin-bottom: 0; margin-top: 30px;  }
.vorstand { margin-bottom: 25px;  }
h2.fsi { color: #febcbd; font-size: 2.4em;  }
h3 { color: #000; font-size: 1.4em; font-weight: bold; line-height: 1.6em; margin-bottom: 20px; }
.veranstaltungszeit { font-size: 2.5em; line-height: 1.3em; margin-top: 32px; }
.vzs  {  display: none }
.vzt  { display: block }
h4 { color: #6e6e6e; font-size: 1.2em; line-height: 1.6em; font-weight: normal; margin-top: 20px; margin-left: 0px; margin-bottom: 20px; }
h5 { color: #f80000; font-size: 1.2em; line-height: 1.6em; font-weight: normal; margin-bottom: -10px; }
h6 { color: #ff1648; font-size: 1.4em; font-weight: bold; margin-top: 10px; margin-left: 0px; margin-bottom: -10px; }

h1.veranstaltungstitel { font-size: 2.5em; line-height: 1.2em; color: red; margin-top: -10px; margin-bottom: 10px }
h2.veranstaltungsuntertitel { font-size: 2em; font-style: italic; line-height: 1.2em; color: black; margin-top: 0; margin-bottom: 20px }
h2.newstitel { font-size: 2.5em; line-height: 1.2em; margin-top: 0px; margin-bottom: 10px }
h3.newsuntertitel { font-size: 2em; font-style: italic; line-height: 1.2em; margin-top: px; margin-bottom: px }
h4.hauptveranstaltungtitel { color: #f80000; font-weight: ; font-size: 1.4em; line-height: 0.9em; margin-bottom: px }
.gastkurzinfo { color: #f80000; font-weight: ; font-size: 2em; line-height: 1.5em; margin-bottom: 20px }
h4.pro { color: black; font-weight: bold; font-size: 1.8em;  }
hr { margin-top: 30px; margin-bottom: 30px; }



.container { display: block; width: 100%; background-color: white; box-sizing: border-box; padding-left: 20px; padding-bottom: 30px; margin: auto; align-items: start }	
.container-header, .container-footer { display: block; max-width: 1350px; padding-right: 40px; margin: auto;}	

.spalte_l { width: calc(60% - 52px); border-right: none;}
.spalte_l ul	{ margin-bottom: 10px; list-style: none; }
.spalte_l li { font-size: 1.4em; line-height: 1.6em; letter-spacing: 0.01em }
.spalte_l img { max-width: 100%; }
.spalte_r { width: 30%; max-width: 100%; margin-top: -10px; padding-bottom: 20px; margin-left: 0px; margin-right: 10px; }
.spalte_r p { font-size: 1.4em; line-height: 1.6em; letter-spacing: 0.01em }
.spalte_r li { font-size: 1.3em; line-height: 1.6em; letter-spacing: 0.01em; list-style: none; margin-left: -40px; }
.spalte_r ul	{ margin-bottom: 5px; list-style: none; }
.spalte_r img { width:100%; }
.spalte_l, .spalte_r { width: 95%; margin-bottom: }


#text { padding-bottom: 20px }
#text img { width: 100%; padding-bottom: 20px }
#text li { color: #6e6e6e; font-size: 1.4em; line-height: 1.6em; margin-bottom: 0; list-style: none; display: block; }
#text p { margin-bottom: 0  }

.margintop  { margin-top: 20px }
.pdf  { font-size: 1em; }
img.abstand { margin-top: 30px; }
.up { margin-top: 10px }

.small  { font-size: 1em;}
.vereinlist  { padding-bottom: 10px; margin-left: -40px }

input  { font-size: 1em; width: 300px; height: 20px; margin-bottom: 30px; cursor: ; padding: 5px 5px 5px 10px; border: solid 1px #febcbd; display: block; }
.dank { font-size: 1.2em; line-height: 1.6em; font-style: italic  }
.abmeldung { font-size: 1.1em; line-height: 1.6em; margin-top: 40px }
.gefoerdert { font-size: 1em; line-height: 1.4em; margin-bottom: 30px }
.ssgefoerdert { font-size: 1em; line-height: 1.4em; margin-top: -10px; padding-bottom: 30px }
.margintop { margin-top: 20px }

.kl { font-style: italic }
.eventlink { margin-top: px }

.arrow { font-size: 1.6em; line-height: 1.1em; padding-left: 10px }
.sn { margin-bottom: 15px }
.table-row { display: flex; color: #333333; margin-right: 20px; margin-bottom: 10px; padding-bottom: 15px; border-bottom: 1px  solid #f80000 }

/*.table-cell {flex: 1}*/
.table-row-calendar { display: block;}	
.date-cell { font-size: 2em; line-height: em; color: #014344; font-weight: bold; padding-top: 10px; text-align: left; box-sizing: border-box;}
.letter-cell { font-size: 3.6em; max-width: 100px; color: #f80000; line-height: 1.6em; font-weight: bold; padding-right: 10px; flex: 0 0 50px; text-align: left; box-sizing: border-box;}
.text-cell { font-size: 1.6em; line-height: 1.6em; padding-top: 10px}


#gaeste { padding-top: 20px; }

audio { width: 80%; max-width: 300px; margin-left: px ; margin-top: 20px; margin-bottom: 10px; padding: 0 ; background-color: white; border-radius: 8px }

.video-wrapper { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 800px; margin: 0 auto }
.video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;}	

#archivjahre button { background-color: hsl(0deg 70% 89%); color: #ff1648; padding: 8px 12px; text-align: center; text-decoration: none; display: inline-block; font-family: "Courier New", Courier, Monaco, monospace; letter-spacing: 0.02em; font-size: 1.3em; margin: 2px; border: solid 1px hsl(0deg 70% 89%); border-radius: 4px; cursor: pointer; margin-right: 10px}
#archivjahre a { color:  #ff1648 }
#archivjahre button:hover {  border: solid 1px #ff1648; color: #ff1648; background-color: white; }
#archivjahre .button-active  { background-color: white; border: solid 1px #ff1648; color:#ff1648;  cursor: default }

#ausschank { width: 100%; background-color: yellow; margin-top: 40px}
#ausschank ul { margin-left: 30px; padding-top: 20px; padding-bottom: 20px; padding-right: 20px }
#ausschank li { list-style: none; display: block; margin-bottom: 5px; }
#ausschank li:first-child { font-size: 3em; font-weight: bold; color: red}
#ausschank li:nth-child(2) { font-size: 2.5em; line-height: 1.4em; font-weight: bold; color: black}
#ausschank li:nth-child(3) { font-size: 2.5em; font-weight: bold; color:red; padding-bottom: 10px}
#ausschank li:nth-child(4) { font-size: 1.6em; color: royalblue}


@media screen and (min-width:40em) 
{
h1 { max-width: 100% }

.vzs  {  display: inline }
.vzt  { display: inline }

.table-row-calendar { display: flex;}
.date-cell { font-size: 1.7em; line-height: 1.6em; padding-top: 0; padding-right: 40px; flex: 0 0 200px; text-align: right; }
.text-cell { font-size: 1.7em; padding-top: 0 }
.letter-cell { font-size: 3.2em; line-height: 1.05em; max-width: 100px; padding-top: 0; flex: 0 0 250px; }

#ausschank { width: 350px }

.rowFlex {
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	margin-left: 0px;
  }

.container { display: flex; flex-wrap: wrap; flex-direction: row;}

 /* .container { flex-direction: column; padding-left: 20px; }*/
  .spalte_l, .spalte_r { width: 100%; margin-left: 0; margin-right: 0; margin-top: 10px;}
  .spalte_l { border-right: none; }	

}
@media screen and (min-width:55em) 
{
	
}
@media screen and (min-width:63em) 
{
/*
#header { height: 65px; margin-bottom: 0px; position: relative;	}

.container { max-width: 1350px; padding-top: 10px; padding-left: 35px }
*/		

.rowFlex { margin-top: 20px;}	

.flexContainer { display: flex; justify-content: space-between; align-items: flex-start; width: 100%; padding-right: 30px; }	
.spalte_r {max-width: 350px; padding-left: 20px; margin-right: 0;}
.spalte_r img { width: 75%;}
.spalte_l { width: calc(67% - 52px); max-width: 800px;}
.spalte_l img { width: 75%;}	
}

@media screen and (min-width:72em) 
{
h1 { font-size: 4em; margin-top: 20px; }
.serviceheadline { margin-top: 20px;  }
.jahreszahl { line-height: 1.4em; margin-left: 16px; margin-bottom: 0;  }
h2 { font-size: em;  }
h3.veranstaltungszeit { margin-top: 60px; }

}
@media screen and (min-width:80em) 
{

}
