* Raender */



*  { margin:0; padding:0; border:none;}



html {overflow-y: scroll;box-sizing: border-box;}



*, :before, :after { box-sizing: inherit; }



html {margin:2px auto; }



html, body {max-width:65em;}



header, footer {margin: 0;}



body, footer, header {padding:1em;}



aside, acrticle {padding:0.5em;height:100%;}



header {margin-bottom: 1em; }



footer {margin-top: 1em; }



article {margin-right: 1em; }



/* aside, article, html, body {background-image: url('images/hintergr2klein.gif');} */




body {display:-webkit-flex; display: -moz-flex;display: flex; -moz-flex-flow: row wrap; -webkit-flex-flow: row wrap; flex-flow: row wrap; background-color:#FFFFDD;}



aside a,  aside,  header,  footer, icooben a, .bilder, fragen a {-webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em; border: 2px solid; text-decoration:none;}



.logo {-webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; border: 1px solid roaylblue; text-decoration:none;vertical-align:middle;height:50px;background:transparent;}

    

.emblem {border: 0px none; text-decoration:none;vertical-align:middle;max-width:90%;}

    

.buchst {-webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; border: 1px solid roaylblue; display:inline-block; width:2.2em; height:1.7em; padding-top:5px; margin:0.3em;}

    

.anmeldbild {-webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; border: 1px solid roaylblue; padding:5px; margin:0.3em; background:orange;}

    

.anfbild {-webkit-border-radius: 0.5em; -moz-border-radius: 0.5em; border-radius: 0.5em; border: 1px solid royalblue; max-width:90%;}

    


icooben {max-width: 95%; line-height:1.1; text-align:center;}



icooben a, fragen a {vertical-align: middle; text-align:center; }




/* Mobile first - alle Dokument-Bloecke bekommen 100% Breite */



header, icooben, innen1, innen2, article, footer, aside {-moz-flex: 1 100%; -webkit-flex: 1 100%; flex: 1 100%;}



footer, header {background: royalblue; border-color: orange; display:-moz-flex; display:-webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap;}



innen1 *, innen2 *, article *, aside *{-moz-flex: 1 1 0%; -webkit-flex: 1 1 0%; flex: 1 1 0%;}



icooben *, footer * {-moz-flex: 1 1 0%; -webkit-flex: 1 1 0%; flex: 1 1 0%;  -moz-justify-content: space-between; -webkit-justify-content: space-between; justify-content: space-between;}

icooben {margin: auto;}



innen1 {display:block; vertical-align: top;}



innen2 {display:block; vertical-align: top;margin-left: 10%;}



.bilder {border: 2px solid gold; max-width:12em;margin: 2px auto; padding:1px auto;}



drunter {clear:both; display:block;}

icooben a {margin: 0.2em; padding: auto; min-height:2.5em; }



footer {-moz-order: 4; -webkit-order: 4; order: 4;}



icooben a {width:7.7em; display:inline-block;}



header div {min-width:8em;}



/* Large screens */



@media all and (min-width: 45em) {

     article {-moz-flex: 5 1 0%; -webkit-flex: 5 1 0%; flex:5 1 0%;}



     aside {-moz-flex: 1 1 0%; -webkit-flex: 1 1 0%; flex: 1 1 0%;}



     innen2 {text-align:right;}

     h1 {text-align:center;}

     innen1 {display:inline-block; max-width:70%;}



     innen2 {display:inline-block; max-width:29%; margin-left:0;}



    .bilder {max-width:80%;}

}

@media all and (max-width: 35em) {

     header,  footer {display:inline-block;}



     header div, footer div {margin:0; padding:0.5em;}

 

    header div {min-width:1%}



     innen1, innen2, icooben, drunter, aside, article {display:inline-block; min-width:1%;}

}


/*  Farben  */



footer, header {background-color:royalblue;}



.buchst, icooben a, #menu a, fragenkatalog a  {background: linear-gradient(white, yellow 150%); text-decoration:none; font-weight:normal; }



h1, h2  {color:orange;}

 

body, p, td, li, h3, h4, h5 {color:darkblue;}

 

/*  Links   */



* { text-decoration:none;}



a:visited {color:blue; text-decoration:none; font-weight:normal; }



a:link, a:active, a:focus  {color:darkblue; text-decoration:none; font-weight:normal; }



a:hover {color:royalblue; text-decoration:none; font-weight:normal; }



footer a:hover {color:orange; text-decoration:none; font-weight:normal; }



icooben a:hover, icooben > a, icooben, fragen, fragen a { text-decoration:none;}



icooben a:hover, fragen a:hover {background:royalblue; color:gold;border-color:darkblue;text-decoration:none;}



#menu a:hover {display:block;background:royalblue;background-color:royalblue; color:gold;border-color:darkblue; text-decoration:none; font-weight:normal; }



p, td {margin-left:10px;}



article ul, article li {margin-left:15px;}





/*  Aufzaehlung  */



*  {list-style:none;}



li { list-style-image: url('images/blue.gif');}

aside li  {list-style:none;}




/*  Linie  */



hr {border: none;border-top:1px solid blue; height: 2px; margin: 0 auto;color: blue;background: gold;}



.linie {margin: 0 auto; max-width:70%;}




/*  Schrift  */



*, body {font-family: "Times New Roman", Times, Verdana; font-size:1em;line-height:1.3;}



h1, h2, h3  {font-weight:bold;}

 

article, p, td, li, innen1 {font-size:1.05em;}



aside li {font-size:1em;}



h1, h2 {font-size:2em; }



h3, h4 {font-size:1.2em; }



#menu {padding:0; margin:0 auto; }



#menu li a {display:block; width:100%; text-align:center;line-height:1;margin:0.5em auto;padding: 0.4em;border:2px solid orange; text-decoration:none; font-weight:normal; }



.trennung {-ms-hyphens:auto; -moz-hyphens:auto; -webkit-hyphens:auto; hyphens:auto;}



.bih {border:0px none;}



innen1 td {border-bottom: thin solid blue; border-collapse: collapse;}



innen1 th {background: linear-gradient(transparent, royalblue 170%); }



/* innen1 th {-webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em;border:0.01px solid blue;}  */



innen1 th, innen1 td {padding: 0.2em; margin:0.2em;}





/* markierung der aktuellen seite im menue */


#s1 #k1 a,

#s2 #k2 a,

#s3 #k3 a,

#s4 #k4 a,

#s6 #k6 a,

#s5 #k5 a,

#s7 #k7 a,

#s8 #k8 a,

#s9 #k9 a,

#s10 #k10 a,

#s31 #k3 a,

#s32 #k3 a,

#s35 #k3 a,

#s41 #k4 a{ background:blue;color:gold;border-color:darkblue; text-decoration:none; font-weight:normal; }





/* markierung der aktuellen seite oben */


#s1 #k1, #o32 #k32, #o42 #k42, #o44 #k44, #o46 #k46, #o55 #k55, #o51 #k51, #o52 #k52, #o54 #k54, #o56 #k56, #o101 #k101, #o103 #k103, #o106 #k106 { background:blue;color:gold;border-color:darkblue; text-decoration:none; font-weight:normal; }





/* markierung der aktuellen seite im footer */


#su1 #u1,

#su2 #u2,

#su3 #u3,

#su4 #u4 {-webkit-border-radius: 1em; -moz-border-radius: 1em; border-radius: 1em;background:blue;color:gold;border-color:darkblue; text-decoration:none; font-weight:normal; }}





/* fuer Cookie popup */





#cookiedingsbums a {color:#000; text-decoration:none;}



#cookiedingsbums a:hover {text-decoration:underline;}



#cookiedingsbums div {padding:5px;}





#cookiedingsbums { 

  display: block;

  z-index: 100;

  position: fixed;

  top: 0px;

  left: 0px;

  min-height: 30px;

  padding: 1px;

  margin: 0;

  width: 100%;

  color: #555;

  border: 1px solid blue;

  background: #d6e0eb;

  background: -moz-linear-gradient(top, #d6e0eb 0%, #f2f6f9 100%); 

  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#d6e0eb), color-stop(100%,#f2f6f9)); 

  background: -webkit-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); 

  background: -o-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%);

  background: -ms-linear-gradient(top, #d6e0eb 0%,#f2f6f9 100%); 

  background: linear-gradient(to bottom, #d6e0eb 0%,#f2f6f9 100%); 

  text-align:center; 

}