html {
font-size: 16px;
background-color: #1D3C58;
padding: 0px;
}

body {
padding: 0px;
margin: 0px;
font-family: Arial, sans-serif;
}

#Alles {
font-size: 16px;
color: #79A4CA;
padding: 0px;
text-align: center;
width: 100%;
/* TESTEN */
border: 0px solid #FFFFFF;
}

.Titeltext {
font-size: 24px;
/* berechnete Groesse */
/* font-size: calc(0.8rem + 1.5vw); */
color: #79A4CA;
padding: 0px;
margin: 25px 0px 10px 0px;
text-align: center;
width: 100%;
}

.Ueberschrift {
font-size: 24px;
/* berechnete Groesse */
/* font-size: calc(0.8rem + 1.5vw); */
color: #79A4CA;
padding: 0px;
margin: 25px 0px 10px 0px;
text-align: center;
width: 100%;
}

.Fusstext {
font-size: 20px;
/* berechnete Groesse */
/* font-size: calc(0.3rem + 1.2vw); */
color: #79A4CA;
padding: 0px;
margin: 35px 0px;
text-align: center;
width: 100%;
}


#Advent0 {
position: relative;
top: 0px;
left: 0;
margin: auto;
padding: 0;
width: 100%;
/* TESTEN */
border: 0px solid #FF007F;
height: auto;
}


#Advent0 .links {
position: absolute;
top: 0px;
left: 0;
padding: 0;
width: 25%;
height: 100%;
max-height: 100%;
overflow: hidden;
/* testen */
border: 0px solid #FFFF00;
}

#Advent0 .mitte {
top: 0px;
left: 0;
margin: auto;
padding: 0;
width: auto;
border: 0px solid #FF00FF;
}


#Advent0 .rechts {
position: absolute;
top: 0px;
right: 0;
margin: auto;
padding: 0;
width: 25%;
/* testen */
border: 0px solid #00FF5F;
height: 100%;
max-height: 100%;
overflow: hidden;
}


#Advent1 {
z-index: 1;
position: relative;
top: 0px;
left: 0;
margin: auto;
padding: 0;
width: 100%;
/* max-width: 60%; */
max-width: 800px;
height: calc(vh * 66.66);
border: 0px solid #AF00FF;
}


#AdventGrafik {
z-index: 2;
position: relative;
top: 0;
left: 0;
margin: 0;
padding: 0;
}

#AdventGrafik img {
border-radius:20px;
}

#Advent2 {
z-index: 3;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
border: 0px solid #00BF00;
}


#Advent2 .AdventText {
padding: 30px 10px;
text-align: center;
margin: auto;
width: 90%;
color: #EFEFEF;
font-family: Arial, sans-serif;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
/* berechnete Groesse */
/* font-size: calc(0.3rem + 3.5vw); */
}



@media (min-width:601px){
#Advent2 .AdventText {
font-size: 18px;
}
}

@media (min-width:801px){
#Advent2 .AdventText {
font-size: 20px;
}
}

@media (min-width:1001px){
#Advent2 .AdventText {
font-size: 26px;
}
}




#Advent2 table {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}

#Advent2 td {
width: 16.66%;
height: 25%;
margin: 0;
padding: 0;
text-align: center;
}

#Advent2 a {
text-decoration: none;
font-size: calc(0.5rem + 4vw);
}

.TagLinkxxx {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}

.TagLink {
display: inline-block;
height: 50%;
width: 50%;
border: 1px solid transparent;
}

#Advent2 .tag {
font-size: calc(0.3rem + 2.0vw);
background-color: rgba(255, 255, 255, 0.0);
padding: 15px 15px;
border-radius: 10%;

/* Ziffernfarbe */
color: #19495F;
/* Rand ? */
border: 0px solid #8D8400;
transition: all 0.5s linear;
}

#Advent2 .TagLink .transp {
background-color: rgba(255, 255, 255, 0.05);
}



#Advent2 a:hover .tag, #Advent2 .TagLink a:focus .tag {
color: #B4F1FC;
border: 0px solid #B4F1FC;
background-color: rgba(50, 85, 117, 0.5);
}



/*
Die Farben der Ziffern kann (auch einzeln) angepasst werden
css-Klasse entsprechend eintragen
<span class="tag rot"> <span class="tag blau">
Transparenz der Hintergrundfarbe von 0.0 bis 1.0
*/

#Advent2 .TagLink .rot {
color: #FF0000;
background-color: rgba(255, 255, 255, 0.4);
}

#Advent2 .TagLink .drot {
color: #BF0000;
background-color: rgba(255, 255, 255, 0.5);
}

#Advent2 .TagLink .blau {
color: #3F00FF;
background-color: rgba(255, 255, 255, 0.5);
}

#Advent2 .TagLink .hblau {
color: #00AFFF;
background-color: rgba(255, 255, 255, 0.5);
}

#Advent2 .TagLink .gelb {
color: #FFDF00;
background-color: rgba(255, 255, 255, 0.5);
}

#Advent2 .TagLink .grau {
color: #5F5F5F;
background-color: rgba(255, 255, 255, 0.5);
}

#Advent2 .TagLink .schwarz {
color: #000000;
}


.button {
background-color: #4B6C87;
border: none;
color: #7BB2DE;
padding: 10px 30px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
border-radius: 10px;
transition-duration: 0.6s;
}

.button:hover {
background-color: #6285A2;
color: white;
}