/* @import "https://fonts.googleapis.com/css?family=Lato";*{margin:0;padding:0}*/
/*@import "https://fonts.googleapis.com/css?family=Roboto:100,100italic,300,300italic,400,400italic,500,500italic,700,700italic,900,900italic&subset=latin,latin-ext";*/
*{margin:0;padding:0}

.abstand{margin:3%}
b{font-weight:400}
article h2 a{font-weight:400;text-decoration:none}
h1{font-size:2rem;font-weight:400;color:#00008b;line-height: 1em; }
main h2{display:block;font-size:1.5em;color:#00008b;-webkit-margin-before:0;-webkit-margin-after:0;-webkit-margin-start:0;-webkit-margin-end:0!important;font-weight:400}
body{background:#fff;width:100%;max-width:100%;min-width:280px;font-family:"open sans",'Lato',sans-serif;
line-height: 1.5em;
-webkit-moz-animation: fadeIn 5s;
-webkit-animation: fadeIn 5s;
animation: fadeIn 5s;
}
   @-webkit-keyframes fadeIn {
        0% { opacity: 0; }
        100% { opacity: 1; }
    }
    @-webkit-moz-keyframes fadeIn {
        0% { opacity: 0; }
        100% { opacity: 1; }
    }
    @keyframes fadeIn {
        0% { opacity: 0; }
        100% { opacity: 1; }
    }
div.wrap{display:table;margin-bottom:0;}
h3 {font-size: 1.2rem; font-weight: 400;color:#00008b;}
#google {background: darkblue; width: 30px;}
.img-responsive{max-width:100%;height:auto}
.img-responsive1{max-width:100%;height:auto}
.kopf{max-width:100%;height:10%}
.news article{margin-bottom:1rem}
#formularchat{width:100%;background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4)}
#formularchat textarea{margin-left:3%;font-size:1rem}
#formularchat .button input{font-size:1.1rem;font-weight:600;color:#fff;width:40%;margin-left:3%;margin-bottom:3%;margin-top:1%;height:20%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:#00008b;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}
#formularchat label{margin-left:3%;line-height:1.5;width:30%;font-size:1.2rem;display:block}
.formular,.formular1{width:100%;padding-top:3em;position:relative}
.formular input{margin:0 0 .6em;padding:.2em .5em;width:60%;height:1.5em;-webkit-border-radius:0 4px 4px 0px/5px 5px 4px 4px;-moz-border-radius:0 4px 4px 0px/0px 0 4px 4px;border-radius:0 4px 4px 0px/5px 5px 4px 4px;background-color:#fff;-webkit-box-shadow:1px 2px 5px rgba(0,0,0,.09);-moz-box-shadow:1px 2px 5px rgba(0,0,0,.09);box-shadow:1px 2px 5px rgba(0,0,0,.09);border:solid 1px #cbc9c9}
.formular select{margin:0 0 .6em -.3em;padding:.2em .5em;width:63%;height:2em;-webkit-border-radius:0 4px 4px 0px/5px 5px 4px 4px;-moz-border-radius:0 4px 4px 0px/0px 0 4px 4px;border-radius:0 4px 4px 0px/5px 5px 4px 4px;background-color:#fff;-webkit-box-shadow:1px 2px 5px rgba(0,0,0,.09);-moz-box-shadow:1px 2px 5px rgba(0,0,0,.09);box-shadow:1px 2px 5px rgba(0,0,0,.09);border:solid 1px #cbc9c9}
.formular textarea{margin:0;padding:0;-webkit-border-radius:0 4px 4px 0px/5px 5px 4px 4px;-moz-border-radius:0 4px 4px 0px/0px 0 4px 4px;border-radius:0 4px 4px 0px/5px 5px 4px 4px;background-color:#fff;-webkit-box-shadow:1px 2px 5px rgba(0,0,0,.09);-moz-box-shadow:1px 2px 5px rgba(0,0,0,.09);box-shadow:1px 2px 5px rgba(0,0,0,.09);border:solid 1px #cbc9c9}
.formular label{line-height:1.5;width:30%;display:block}
.formular input:required + .formular label::before{position:absolute;left:300%;content:"?";color:red}
.formular input:required:valid + .formular label::before{content:"?";color:green}
.formular .button input{ font-size:1.1rem;font-weight:600;color:#fff;width:40%;margin:0;height:20%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:#00008b;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}
.formular .buttonrot input{left: 50%; margin-bottom: 5%; font-size:1.1rem;font-weight:600;color:#fff;width:40%;margin:0;height:20%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:red;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:-1.9rem;;position:relative}
input[type="checkbox"]
 {

 width: 17px;
    height:17px;
  margin-right: .75em;

 }



.button2 input{ font-size:1rem;font-weight:600;color:#fff;width:100%;margin:3%:;height:auto;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:#00008b;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}
#button1 input{padding:.2rem;font-size:1rem;font-weight:600;color:#fff;width:100px;margin:0;height:40%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:#00008b;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}
.button3 input, .button8 input { font-size:1.1rem;font-weight:600;color:#fff;width:40%;margin:0;height:20%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:#00008b;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}

.button4 input{ font-size:1rem;font-weight:600;color:#fff;width:90%;margin-top: 1em;   opacity: 1; cursor: pointer; background-color:#787878;height:auto;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;padding: 2%;transition:all .1s linear 0;top:0;position:relative}
.button5 input{ font-size:1.1rem;font-weight:600;color:#fff;width:40%;margin:0;height:20%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:green;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}
.button6 input{ font-size:1.1rem;font-weight:600;color:#fff;width:40%;margin:0;height:20%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:red;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}
.button7 input{ font-size:1.1rem;color:#fff;margin:0;display:inline;
        padding: 8px;
        letter-spacing: 1px;
        background-color: #749a02;
        -webkit-border-radius:6px;


text-decoration:none;
-webkit-animation: glowIt 2s infinite;
}
  .button8 input {width: 80%;}
 .buttonglow {
        display: inline;
        padding: 8px;
        letter-spacing: 1px;
        background-color: #749a02;
        -webkit-border-radius:6px;
        -webkit-animation: glowIt 2s infinite;
    }
 .buttonglow a:link {color:white; text-decoration:none; font-size:1.1rem;}
  .buttonglow a {color:white; text-decoration:none; font-size:1.1rem;}
  /* .buttonglow a:active {color:white; text-decoration:none; font-size:1.1rem;} */

    @-webkit-keyframes glowIt {
        0% {
            background-color: #749a02;
            -webkit-box-shadow: 0 0 9px #ccc;
        }
        50% {
            background-color: #91bd09;
            -webkit-box-shadow: 0 0 18px #91bd09;
            }
        100% {
            background-color: #749a02;
            -webkit-box-shadow: 0 0 9px #ccc;
        }
    }





.formular .button1 input{font-size:1rem;font-weight:600;color:#fff;width:60%;margin:0;height:20%;display:block;text-decoration:none;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;background-color:#00008b;-webkit-box-shadow:0 3px rgba(58,87,175,.75);-moz-box-shadow:0 3px rgba(58,87,175,.75);box-shadow:0 3px rgba(58,87,175,.75);transition:all .1s linear 0;top:0;position:relative}
.formular .genericon{color:#fff;background:#00008b;margin:0;font-size:1.1em;padding:.2em;border-radius:5px 0 0 5px}
.formular1 .genericon{color:#00008b;margin:0 .3rem 0 0;font-size:1.3rem;padding:.2em}
.artikelinhalt li{margin-left:1em}
.socialmedia h1{padding-left:.5rem}
.tabelle{padding-left:3rem;text-align:right}


#cookie {color:#fff;background-color:#00008b; width: 100%; padding: 0 0 0 1rem;}
#cookie a:visited {color: #fff;}
#cookie a:link {color: #fff;}
#cookie input {color:#fff;background-color:#00008b; cursor: pointer;}
#cookie input:hover {background-color: green;}

/*** SLIDER *****/
 #bildshow {
display: inline;
top: 5rem;
position: relative;
padding: 0 0 2rem; 0;}
.container {
 display: block;
    margin-left: auto;
    margin-right: auto;}

.buttonbildshow input {font-size: 2em;}
  .container {width:1200px;
height: 685px;

        position: relative;   }

.containerlinks {width: 50px;


        left: 0px;
        position: absolute;

      margin-top: 320px;
      text-align: center;

}



 .containerrechts {width: 50px;


        right: 0px;
        position: absolute;


      margin-top:320px;
      text-align: center;

}

.containermitte {

    height:auto;

        right: 5%;
        left: 5%;
        position: absolute;


}
.containermitte1 {
    height:auto;

        right: 5%;
        left: 5%;
        position: absolute;
         opacity: 0;
           -webkit-transition: opacity 5s;
        -moz-transition: opacity 5s;
        -o-transition: opacity 5s;
        transition: opacity 5s; }



#exiliste .genericon {font-size: 1.4rem; color: #00008b;}
#exiliste ul {
list-style: none;  margin-left: 0;
}

#exiliste li {
list-style:none;
margin-left: 0;}





@media screen and (min-width: 1280px){
ul.socialmedia h2{font-size: 2rem; color:#fff;background-color:#00008b}
.formular2{font-size:1.1rem}
#chataus{font-size:1em;min-height:100%;background-color:#fff;border:1px solid;border-color:red;width:10%}
.webinar340{display:none}
.webinar800{display:none}
.webinar1{margin-left:15.6%}
.webinar2{display:none}
.bildalle,{max-width:100%;height:auto}
.bild{max-width:100%;height:auto;margin-bottom:1rem;  box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.3); -webkit-animation: fadeIn 5s; }
.bildfotoblog{max-width:90%;height:auto;margin-bottom:1rem;  box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.3); -webkit-animation: fadeIn 5s; }


.bild1{max-width:100%;height:auto;margin-top:1.9rem}
.rund{width:300px;height:300px;border-radius:150px;margin:2rem 0;align:center}
.rund1{width:200px;height:200px;border-radius:100px;margin:2rem;align:center}
.rund2{width:200px;height:200px;border-radius:100px;margin-left:2rem;align:center}
.rund3{width:80px;height:80px;border-radius:40px;margin:0;align:center}
.linie{border-bottom:1px solid #DDD;width:90%;margin-left:4%}
.liniev{border-left:1px solid #DDD;width:90%}
article h2{text-align:left;font-size:1.5rem;margin:0;padding:0}
.formular,.formular1{background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4);text-decoration:none;padding:.5em;margin-bottom:1rem;margin-right:1rem;font-size:1.1rem;width:95%}
article h1 a{text-align:center;font-size:3rem;text-decoration:none}
article h2{font-size:1.7rem;text-decoration:none;color:#00008b}
#a0{text-align:center;font-size:1.5rem;text-decoration:none}
#a1,#a2,#a3,#a4,#a5,#a6,#a7,#a8,#a9 {font-size:1.1rem}
.a1 {font-size:1.1rem}
article{font-size:1.1rem}
#a{font-size:1rem}
h1{font-size:2rem;font-weight:400;color:#00008b}
.news a{color:#00008b;text-decoration:none}
.news h2{color:#00008b}
.news a:visited{color:#00008b;text-decoration:none}
.semaktuell{background:#eee;border:1px solid #DDD;background:-moz-linear-gradient(top,#EEE,#FFF);background:-webkit-linear-gradient(top,#eee,#fff);background:-ms-linear-gradient(top,#eee,#fff);background:-o-linear-gradient(top,#eee,#fff);box-shadow:1px 2px 4px rgba(0,0,0,.2);border-radius:.5em;padding:.5em}
.semaktuell1{background-color:rgba(188,198,204,0.80);color:#00008b;border-left:2px solid #00008b;top:9rem;position:absolute;right:0;margin-right:.5rem;display:block;width:20em;padding:.4em;text-decoration:none;list-style:none;font-size:.88rem;transition:all .5s}
.semaktuell1 h2{font-size:1.2rem}
.semaktuell1 li{list-style:none;position:relative;padding:0}
.semaktuell1 ul ul{position:absolute;top:0;left:0;display:none;transition:all .5s ease; -webkit-transition:all .5s ease;-moz-transition:all .5s ease;}
.semaktuell1:hover ul{position:relative;display:inline-block;z-index:500;transition:all .5s ease; -webkit-transition:all .5s ease;-moz-transition:all .5s ease;}
.semaktuell1 a:link,a:visited{text-decoration:none;color:#00008b}
.semorte{background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4);text-decoration:none;padding:.5em;margin-bottom:1rem;margin-right:1rem}
.exislide{z-index: -10;background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4);text-decoration:none;}
/* Flippbox */
.zentriert {
width: 220px;
margin-left: auto;
margin-right: auto;
}

.flipbox {
position: relative;
float: left;
height: 400px;
overflow: hidden;
display: inline;
}

.boxhinten {

width: 220px;
height: 400px;
bg-color: red;

           }

.boxvorne {
position: relative;
width: 220px;
height: 400px;
left: -55px;
background: grey;
color: white;
font-size: 1em;
padding: 5px;
 opacity: 0.5;

        left: -230px;
        top: -400px;
 -webkit-transition: all 0.5s;
 -moz-transition: all 0.5s;
-transition: all 0.5s;

}

.flipbox:hover .boxvorne {border-color: blue;
left: 0px;
left: 0px;
opacity: 0.9;
cursor: pointer;
}

  .buttonglow a {color:white; text-decoration:none; font-size:1.1rem;}
  .buttonglow a:visited {color:white; text-decoration:none; font-size:1.1rem;}
   .buttonglow a:active {color:white; text-decoration:none; font-size:1.1rem;}


}


@media screen and (min-width: 800px)and (max-width: 1279px){
ul.socialmedia h2{font-size: 1.8rem; color:#fff;background-color:#00008b}
.formular2{font-size:1.1rem}
textarea{width:90%;height:3%}
.webinar1{margin-left:0;left:-5%}
.webinar2{display:none}
.webinar1280{display:none}
.webinar340{display:none}
.bild{max-width:100%;height:auto}
.bild1{max-width:100%;height:auto;margin-top:1.9rem}
.rund{width:200px;height:200px;border-radius:100px;margin:2rem 0;align:center}
.rund1{width:150px;height:150px;border-radius:75px;margin:2rem 0;align:center}
.rund2{width:150px;height:150px;border-radius:75px;margin-left:2rem;align:center}
.linie{border-bottom:1px solid #DDD;width:90%;margin-left:4%}
.formular,.formular1{background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4);text-decoration:none;padding:.5em;margin-bottom:1rem;margin-right:1rem;font-size:1.1rem;width:95%}
article h1 a{text-align:center;font-size:3rem;text-decoration:none}
article h2{font-size:1.1rem;text-decoration:none;color:#00008b}
#a0{text-align:center;font-size:1.5rem;text-decoration:none}
#a1,#a2,#a3,#a4,#a5,#a6,#a7,#a8,#a9{font-size:1rem}
#a{font-size:.8rem}
h1{font-size:2rem;font-weight:400;color:#00008b}
.semaktuell{background:#eee;border:1px solid #DDD;background:-moz-linear-gradient(top,#EEE,#FFF);background:-webkit-linear-gradient(top,#eee,#fff);background:-ms-linear-gradient(top,#eee,#fff);background:-o-linear-gradient(top,#eee,#fff);box-shadow:1px 2px 4px rgba(0,0,0,.2);border-radius:.5em;padding:.5em}
.semaktuell1{background-color:rgba(188,198,204,0.80);color:#00008b;border-left:2px solid #00008b;top:9rem;position:absolute;right:0;margin-right:.5rem;display:block;width:20em;padding:.4em;text-decoration:none;list-style:none;font-size:.88rem;transition:all .5s}
.semaktuell1 h2{font-size:1.2rem}
.semaktuell1 li{list-style:none;position:relative;padding:0}
.semaktuell1 ul ul{position:absolute;top:0;left:0;display:none}
.semaktuell1:hover ul{position:relative;display:inline-block;z-index:500;transition:all .5s}
.semaktuell1 a:link,a:visited{text-decoration:none;color:#00008b}
.news a{color:#00008b;text-decoration:none}
.news a:visited{color:#00008b;text-decoration:none}
.semorte{background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4);text-decoration:none;padding:.5em;margin-bottom:1rem}
.bildfotoblog{max-width:90%;height:auto;margin-bottom:1rem;  box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.3); -webkit-animation: fadeIn 5s; }
/* Flippbox */
.zentriert {
width: 220px;
margin-left: auto;
margin-right: auto;
}

.flipbox {
position: relative;
float: left;
height: 400px;
overflow: hidden;
display: inline;
}

.boxhinten {

width: 220px;
height: 400px;
bg-color: red;

           }

.boxvorne {
position: relative;
width: 220px;
height: 400px;
left: -55px;
background: grey;
color: white;
font-size: 1em;
padding: 5px;
 opacity: 0.5;

        left: -230px;
        top: -400px;
 -webkit-transition: all 0.5s;
 -moz-transition: all 0.5s;
-transition: all 0.5s;

}

.flipbox:hover .boxvorne {border-color: blue;
left: 0px;
left: 0px;
opacity: 0.9;
cursor: pointer;
}

  .buttonglow a {color:white; text-decoration:none; font-size:1.1rem;}
  .buttonglow a:visited {color:white; text-decoration:none; font-size:1.1rem;}
   .buttonglow a:active {color:white; text-decoration:none; font-size:1.1rem;}

}


@media screen and (min-width: 320px) and (max-width: 799px){
.bildfotoblog{max-width:90%;height:auto;margin-bottom:1rem; margin-left: 5%; box-shadow: 10px 10px 5px rgba(0, 0, 0, 0.3); -webkit-animation: fadeIn 5s; }
.webinar800{display:none}
.webinar1280{display:none}
.webinar3{display:none}
.webinar1{display:none}
.rund{display:none}
.rund1,.rund2{display:none}
.bild{display:none}
.bild1{width:75%;max-width:75%;height:auto;margin-top:1rem}
.news a{color:#00008b;text-decoration:none}
.news a:visited{color:#00008b;text-decoration:none}
/*
.semaktuell1{background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4);text-decoration:none;padding:.5em;margin-bottom:1rem}
.semaktuell1 li,ul{list-style:none}
.semaktuell1 a:link,a:visited{text-decoration:none;color:#00008b}
  */
 .semaktuell1 {display: none;}
article{with:100%}
.news article{background:#f5f5f5;border:1px solid #FFF;border-radius:5px;-moz-border-radius:5px;-webkit-border-radius:5px;box-shadow:1px 2px 4px rgba(0,0,0,.4);text-decoration:none;padding:.5em;margin-bottom:1rem;transition:font .8s;width:100%}
.news article h2{color:#00008b;border-top:0}
.news article[id*="a"] h2 a{text-decoration:none}
.news article h1 a{font-size:1.5rem;text-decoration:none;margin-befor:0;margin-after:0}
.news article[id*="a"]:not(:target) p.artikelinfo,.news article[id*="a"]:not(:target) div.artikelinhalt{display:none}
Zustandsanzeige - \f432= genericon-collapse,Pfeil nach oben .news article[id*="a"]:target h2:before{content:" \25b2";font-family:"Genericons";font-size:16px;vertical-align:middle;-webkit-font-smoothing:antialiased}
ul.socialmedia h2{font-size: 1.5rem; color:#fff;background-color:#00008b}
}
ul.socialmedia{padding:0;color:#fff;background-color:#00008b}
ul.socialmedia > li{display:inline-block;margin-right:1rem;padding-top:.5rem;padding-bottom:.5rem;font-weight:700;padding-top:1rem;ullipadding-left:.5rem}

ul.socialmedia a.genericon{color:#fff;background-color:#00008b}
ul.socialmedia{padding:0 0 0 1rem;color:#fff;background-color:#00008b}
ul.socialmedia > li{display:inline-block;margin-right:1rem;padding-top:.5rem;padding-bottom:.5rem;font-weight:700}
ul.socialmedia a.genericon{color:#fff;background-color:#00008b}


@media screen and (min-width: 800px){
.section{clear:both;padding:0;margin:0}

.col{display:block;float:left;margin:1% 0 1% 1.6%}
.col:first-child{margin-left:0}
.group:before,.group:after{content:"";display:table}
.group:after{clear:both}
.group{zoom:1}
.span_12_of_12{width:100%}
.span_11_of_12{width:91.53%}
.span_10_of_12{width:83.06%}
.span_9_of_12{width:74.6%}
.span_8_of_12{width:66.13%}
.span_7_of_12{width:57.66%}
.span_6_of_12{width:49.2%}
.span_5_of_12{width:40.73%}
.span_4_of_12{width:32.26%}
.span_3_of_12{width:23.8%}
.span_2_of_12{width:15.33%}
.span_1_of_12{width:6.866%}
}


@media only screen and (max-width: 480px){

.col{margin:1% 0}
.span_1_of_12,.span_2_of_12,.span_3_of_12,.span_4_of_12,.span_5_of_12,.span_6_of_12,.span_7_of_12,.span_8_of_12,.span_9_of_12,.span_10_of_12,.span_11_of_12,.span_12_of_12{width:100%}
}
@media screen and (min-width: 768px){
nav[role="navigation"]
div.menubutton{display:none}
div.mobile{display:none}
a.genericon-home{font-size:2rem}
nav{width:16em;height:0;padding:.8em;position:absolute;top:5rem}
nav ul{margin:0;padding:0}
nav li{list-style:none;position:relative;padding:0}
nav ul ul{position:absolute;top:-0;left:16em;font:0/0 serif;z-index:-1;transition:all .5s ease; -webkit-transition:all .5s ease;-moz-transition:all .5s ease;}
nav ul li:hover ul{font:inherit;z-index:auto}
nav a,nav span{display:block;width:12em;padding:.4em;text-decoration:none;font-size:1.2rem;background-color:rgba(188,198,204,0.80);color:#00008b;border-left:2px solid #00008b;left:16em}
nav ul ul a,nav span{border-radius:0}
nav > ul > li{margin:.6em 0 0}
nav a:focus,nav a:hover,nav span{background-color:rgba(188,198,204,0.50);color:#00008b}
li a#aktuell{color:#fff;background-color:gray}
nav span{background-color:rgba(188,198,204,0.8);color:#00008b}
}

@media screen and (min-width: 600px) and (max-width: 767px){nav[role="navigation"] div.menubutton{display:none}
div.mobile{display:none}
a.genericon-home{font-size:2rem}
nav{width:17em;height:0;padding:.8em;position:absolute;top:8rem}
nav ul{margin:0;padding:0}
nav li{list-style:none;position:relative;padding:0}
nav ul ul{position:absolute;top:-0;left:17em;font:0/0 serif;z-index:-1;transition:font .5s}
nav ul li:hover ul{font:inherit;z-index:auto}
nav a,nav span{display:block;width:12em;padding:.4em;text-decoration:none;font-weight:700;font-size:1.2rem;background-color:rgba(188,198,204,0.80);color:#00008b;border-left:2px solid #00008b}
nav ul ul a,nav span{border-radius:0}
nav > ul > li{margin:0}
nav a:focus,nav a:hover,nav span{background-color:rgba(188,198,204,0.50);color:#00008b}
li a#aktuell{color:#fff;background-color:gray}
nav span{background-color:rgba(188,198,204,0.50);color:#00008b}
}

@media screen and (min-width: 320px) and (max-width: 599px){
nav[role="navigation"] div.menubutton{display:block}
body{position:relative;min-width:280px}
div.menubutton{display:block;position:absolute;right:1em;top:1em;z-index:1000}
div.menubutton a{display:block;color:#fff;background:#00008b;background:#00008b;background:#00008b;text-decoration:none;padding:.5em;border-radius:.25em;border-color:#fff;border:1px}
div.menubutton a.shownavlist:after{content:" \25bc";font-size:.7rem}
div.menubutton a.hidenavlist:after{content:" \25b2";font-size:.7rem}
div.menubutton a.hidenavlist{display:none}
nav[role="navigation"]{padding:0 1rem;margin:0;background-color:#07b}
nav[role="navigation"] ul#navlist{max-height:0;overflow:hidden;transition:.25s;list-style-type:none;padding:0;border-radius:0 0 1rem 1rem;margin:0}
nav[role="navigation"] li{display:block;border-bottom:1px solid #ddd}
nav[role="navigation"] li:last-of-type{border-bottom:0}
nav[role="navigation"] ul#navlist >li > a{display:block;text-decoration:none;background-color:#07b;color:#fff;padding:.5em}
nav[role="navigation"] ul#navlist > li > ul >li > a{display:block;text-decoration:none;background-color:#87cefa;color:#fff;padding:.5em;list-style-type:none}
nav[role="navigation"] ul#navlist > li > ul >li{padding:0}
nav[role="navigation"] a:hover,nav[role="navigation"] a:focus{text-decoration:underline}
nav[role="navigation"] li.active a{background:#08c;color:#fff;text-decoration:none}
#menu:target ul#navlist{max-height:100000000em}
#menu:target a.shownavlist{display:none}
#menu:target a.hidenavlist{display:block}
}