/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* Grundeinstellungen */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
*{
 margin: 0; padding: 0; border: 0;
 box-sizing: border-box;
}

div, p, h1, h2, h3, ul, ol, td, th, span, li{
 font-family: Calibri,Arial,Tahoma,Verdana,Sans;
 color: #000;
}

body{
 padding: 3%;
 background-color: #FFF;
 font-size: 120%;
 line-height: 1.4;
 overflow-y: scroll;
 text-align: center; /* für die alten IEs */
}

img{
 max-width: 100%;
 max-height: 100%;
 vertical-align: top;
}

p, li, dd{
 -webkit-hyphens: auto;
 -ms-hyphens: auto;
 -moz-hyphens: auto;
 hyphens: auto;
}

a{
 color: #FF0000;
 -webkit-hyphens: none;
 -ms-hyphens: none;
 -moz-hyphens: none;
 hyphens: none;
}
a:link{text-decoration: none;}
a:visited{text-decoration: none;}
a:hover{text-decoration: underline;color: #000080;}
a:active{text-decoration: none;}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* DIVs */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
#Gesamt{
 width: 100%; max-width: 800px;
 margin: 0 auto;
 padding-bottom: 2rem;
 background-color: #ABB7E0;
 border: solid 0 #ABB7E0;
 box-shadow: 0 0 0.6rem #AAA;
}
#Gesamt:after{
 content: "";
 display: table;
 clear: left;
}

#Kopf{
 padding: 5%;
 text-align: left;
 background-color: #FFF;
}

#Foto{
 width: 100%;
}

#Inhalt{
 width: 100%;
 margin-top: 5%;
 text-align: left;
 border: solid 0 #000;
}

#Fuss{
 width: 100%;
 margin-top: 0.5rem;
 text-align: center;
}
#Fuss p {
 margin-right: 0;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* Navigationsmenü */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
#Kopfnavi{
 display: table;
 width: 100%;
 background-color: #000080;
 text-align: left;
}
#Kopfnavi ul, #Kopfnavi ul li{
 list-style: none;
 display: table-cell;
 text-align: left;
}
#Kopfnavi ul li{
 margin-right: 0.3rem;
 border-right: solid 0.3em #ABB7E0;
}
#Kopfnavi ul li:first-child{
 border-left: solid 0.3rem #ABB7E0;
}

/*Navigationsmenü*/
a.menu1, a.menu1aktiv{
 display:block;
 text-align: center;
 padding: 0.5rem 1rem;
 color: #FFF;
 text-decoration: none;
}

a.menu1:link{text-decoration: none;}
a.menu1:visited{text-decoration: none;}
a.menu1:hover{background-color: #ABB7E0;}
a.menu1:active{text-decoration: none;}

a.menu1aktiv{
 background-color: #ABB7E0;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* Abstand links */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
#Kopf, #Kopfnavi, #Inhalt{
 padding-left: 20%;
}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* Formate */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.Hervorhebung{
 width: 110%;
 margin-left: -10%;
 padding-left: 10%;
 padding-right: 0;
 padding-top: 5%;
 padding-bottom: 5%;
 background-color: #FFF;
 border: solid 0 #000;
 border-top-left-radius: 9em;
 border-bottom-left-radius: 9em;
}

h1, h2, h3{
 font-weight: bold;
 font-size: 1.2rem;
}
h1{
 font-size: 3em;
 line-height: 1;
 padding-top: 0.3rem;
 color: #000080;
}

h2{
 margin: 2rem 0 0 0;
 color: #FF0000;
}

h3{
 margin: 1.5rem 0 0 0;
}

p, ul, ol{
 margin-top: 0.4rem;
 margin-right: 20%;
}
ul li{
 margin-left: 1rem;
}

li b, p b, td b, th b, dt{
 font-weight: bold;
 color: #000080;
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/* Anpassungen */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

@media screen and (max-width: 800px) {
#Kopf, #Kopfnavi, #Inhalt{
 padding-left: 17%;
}
}


@media screen and (max-width: 720px) {
h1{
 font-size: 2.2rem;
 -webkit-hyphens: auto;
 -ms-hyphens: auto;
 -moz-hyphens: auto;
 hyphens: auto;
}
#Kopf, #Kopfnavi, #Inhalt{
 padding-left: 15%;
}
}


@media screen and (max-width: 660px) {
#Kopfnavi{
 padding-left: 0;
}
#Kopfnavi ul, #Kopfnavi ul li{
 list-style: none;
 display: block;
 text-align: left;
}
#Kopfnavi ul li{
 margin-right: 0;
 border-right: solid 0 #ABB7E0;
 border-bottom: solid 0.3rem #ABB7E0;
}
#Kopfnavi ul li:first-child{
 border-left: solid 0 #ABB7E0;
}
h1{font-size: 1.7rem;}
.Hervorhebung{
 width: 115%;
 margin-left: -15%;
 padding-left: 15%;
}
}


@media screen and (max-width: 660px) {
.Hervorhebung{
 width: 110%;
 margin-left: -10%;
 padding-left: 10%;
 border-top-left-radius: 1rem;
 border-bottom-left-radius: 1rem;
}
}