@import url('https://fonts.googleapis.com/css?family=Oswald');

body
{
       font-family: Verdana, Arial, sans-serif;
       margin: 0px;
       height: 100%;
       width: 100%;
       padding: 0px;
       background-color:#999999;
}

p
{
        font-size: 12px;
        line-height: 16px;
        text-align: left;
        color: #666666;
        margin:0px;
        margin-bottom:6px;
        clear: left;
}

#text_rechts p
{
        text-align: right;
}

h1
{
        font-family: 'Oswald', sans-serif;
        font-size: 20px;
        line-height: 28px;
        font-weight: normal;
        text-align: left;
        color: #000000;
        margin: 0px 0px 10px 0px;
        padding: 0px;
}

h2
{
        font-family: 'Oswald', sans-serif;
        font-size: 14px;
        line-height: 18px;
        font-weight: normal;
        text-align: left;
        color: #333333;
        margin: 0px;
        padding: 0px;
}

h3
{
        font-family: 'Oswald', sans-serif;
        font-size: 16px;
        line-height: 20px;
        font-weight: normal;
        text-align: left;
        color: #263684;
        margin: 10px 0px 10px 0px;
        padding: 0px;
}

h4
{
        font-size: 12px;
        line-height: 16px;
        text-align: left;
        font-weight: bold;
        color: #263684;
        margin:0px;
        margin-bottom:6px;
}

h5
{
        font-size: 12px;
        line-height: 16px;
        text-align: left;
        font-weight: bold;
        color: #666666;
        margin:0px;
        margin-bottom:6px;
}

a
{
        font-size: 12px;
        line-height: 16px;
        text-decoration: none;
        color: #263684;
        margin: 0px;
}

a:hover
{
        color: #c82a1f;
}

.navi
{
        display: block;
        margin: 8px 0px;
        padding: 0px 0px 0px 32px;
}

.navia
{
        display: block;
        color: #c82a1f;
        margin: 8px 0px;
        padding: 0px 0px 0px 16px;
        border-left: 16px solid #c82a1f;
}

.unavi
{
        display: block;
        font-size: 11px;
        line-height: 14px;
        padding: 2px 0px 3px 47px;
}

.unavia
{
        display: block;
        font-size: 11px;
        line-height: 14px;
        color: #c82a1f;
        padding: 2px 0px 3px 47px;
}

li
{
     font-size: 12px;
     line-height: 18px;
     color: #666666;
     list-style-type: square;
}

ul
{
     margin-top: 0px;
     margin-bottom: 5px;
}

.glo
{
        opacity: 0.5;
}

#mittig {
        position: relative;
        width: 100%;
        margin: 0px auto;
        background-color: #FFFFFF;
}


#kopf {
        position: relative;
        width: 100%;
        text-align: left;}

#logo {
        position: relative;
        width: 22%;
        padding: 18% 0% 0% 3%;
        float: left;
        background: url(../images/hno.jpg) no-repeat center center;}

#bild {
        position: relative;
        width: 75%;
        margin: 0%;
        float: left;
        background-color: #e4e4e4;}

#bauch {
        position: relative;
        width: 100%;}

#navi {
        position: relative;
        width: 23%;
        height: 400px;
        padding: 2% 0% 20% 2%;
        text-align: left;
        float: left;
        background: #e4e4e4 url(../images/linie.gif) repeat-y 12% 0;}

#text {
        position: relative;
        width: 75%;
        padding: 0%;
        float: left; }

#text_halb {
        position: relative;
        width: 44%;
        padding: 2% 3%;
        float: left; }

#text_drittel {
        position: relative;
        width: 28%;
        padding: 2% 2% 1% 3%;
        float: left; }

#text_drittl {
        position: relative;
        width: 28%;
        padding: 0% 2% 0% 3%;
        float: left; }

#text_ganz {
        position: relative;
        width: 94%;
        padding: 2% 3%;
        clear: left; }

#text_links {
        position: relative;
        width: 30%;
        padding: 0% 6% 0% 0%;
        float: left; }

#text_rechts {
        position: relative;
        text-align: right;
        width: 58%;
        padding: 0% 6% 0% 0%;
        float: left; }

#text_grau {
        position: relative;
        width: 44%;
        margin: 1%;
        padding: 2% 2%;
        float: left;
        background-color: #f4f4f4;}

#bilder {
        position: relative;
        width: 94%;
        padding: 1% 3%;
        background-color: #f4f4f4;
        float: left; }

#bild_gross {
        position: relative;
        width: 28%;
        padding: 0% 2% 2% 0%;
        float: left; }

#bilder_klein {
        position: relative;
        width: 70%;
        padding: 0%;
        float: left; }

#bild_klein {
        position: relative;
        width: 17.4%;
        padding: 0% 2% 2% 0%;
        float: left; }

#fuss {
        position: relative;
        width: 100%;
        clear: left;}

#box1 {
        position: relative;
        width: 19%;
        padding: 2% 3%;
        border-top: 5px solid #c82a1f;
        float: left;  }

#box2 {
        position: relative;
        width: 31.5%;
        padding: 2% 3%;
        border-top: 5px solid #fcdb2c;
        float: left;  }

#box3 {
        position: relative;
        width: 31.5%;
        padding: 2% 3%;
        border-top: 5px solid #fcdb2c;
        float: left;  }

.foto {
  position: absolute;
}

.photo {
  position: absolute;
  animation: round 24s infinite;
  opacity: 0;
}

@keyframes round {
  0%  {opacity: 0;}
  25%  {opacity: 1;}
  50% {opacity: 1;}
  75%  {opacity: 0;}
}

img:nth-child(1) {animation-delay: 24s;}
img:nth-child(2) {animation-delay: 16s;}
img:nth-child(3) {animation-delay: 8s;}