/*17.03.2019 .dropbtn + sticky 
/*22.08.2018 .aside z-index: -1; Überlappt mit Tabelle*/ 
/*21.08.2018 Testversion 
Info box .aside background weggenommen
a und a: hover angepasst
header Schrift weiss

*/
/*Staand 22.07.2017, bei .footer min-width rausgenommen */
body{
background-color: rgb(255, 255, 210);/* Eierschale/ocker hschall.de*/
background-image: url(20170402LinksgespiegeltBluetenCut._jpg);
/*background-size: cover;*/
/*color: #ffffff;*/
/*max-width: 800px;*/
}
* {
    box-sizing: border-box;
}


.Inhalt {
color: #ddd;
box-shadow: 0 1px 3px rgba(0,0,0,0.12);
 padding:10px/200px/10px/200px;
 /*max-width: 600px;*/
 align-self: center;
}
.row::after {
    content: "";
    clear: both;
    display: block;
}
[class*="col-"] {
    float: left;
    padding: 10px;
}
    /*sticky*/
html {
    font-family: Arial, Helvetica, sans-serif;
    align-self: center;
}

div.sticky, p.sticky, button.sticky {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
/*z-index: 300;
  padding: 5px;
  background-color: #e8caca;
  border: 2px solid #AF4C50;*/
}

.header {
   /* background-color: #5588ee;
    background-color: #0099cc;
    color: #ffffff;*/
   /* color: rgb(255, 255, 210);*/
   
    color: #662200;
;
    padding: 15px;
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);        
/*max-width: 600px;*/
}
.header h1 {
line-height: 100%;
/*color: white;*/


}
.header a {
/* color: rgb(120, 200, 150);*/
text-decoration: ;
color: #44a;

}
.header a:hover {
/*
font-weight: bolder;
*/
color: #d693a1; /* Blütenfarbe */
/*background-color: #009;  Himmelfarbe */
}
/*
.menu a {
padding: 8px;
    margin-bottom: 7px;
    background-color :#33b5e5;
    color: #ffffff;
    color: yellow;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}

*/
/*
 ul {
    list-style-type: square;
    margin: 0;
    padding: 0;
}
*/
.menu {
    padding: 8px;
    margin-bottom: 7px;
    background-color :#33b5e5;
    color: #ffffff;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    float: left;
}

/*
a:hover {
    background-color: #ffffff;
    background-color: #333399;

color:#33b5a5;
    
    
}
*/
/*03.07.2017 Warnungen im Zusammenhang mit <pre class="rot"></pre>*/
.rot {
color:red;
}
.braun{
color:#822;
}

.aside b {
color: white;
/*
position: relative;
z-index: -1;
padding: 15px;
color: #0077aa; /*Farbe vom Background Header etwas dunkler*/
/*color: #ffffff; Farbe vom Background Header etwas dunkler*/
/*text-align: left;
font-size: 15px;
*/
/*    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);*/
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.1);


}
.aside a:hover{
/*
background-color: #105070;/*petrol hschall.de passend zu #FAFAa0
background-color: #0099cc;
*/


}
.aside a {
/*font-weight: bold; 21.08.2018 raus*/
/*
color: #bbaaaa;
color: #a64;
*/
}
.footer {
/*    background-color: #0099cc;
    background-color: #005577;
    background-color: #003050;
    color: #ffffff;
    text-align:left;
    font-size: 11px;
    padding: 0px;
    position: absolute;
    position: bottom; /*07.01.19 endlich ganz unten*/
    
    width: 100%;
  
    /*min-width: 651px; raus am 22.07.2017*/
    /*margin-left: 0px;*/
/*    margin-right:15px;*/
/*position:absolute;
bottom:0px;*/
       
}
.footer a {
/*
color: rgb(255, 255, 210);
float: left;
text-decoration: none;
*/
}
.footer a:hover {
/*
background-color: #0055cc;
font-weight: bold;
color: #ffffff;
*/
}
/* For mobile phones: */
[class*="col-"] {
    width: 100%;
}
[class*="footer-col*"] {
    width: 100d%;
    align-self: center;
}
.footerCol-3 .footerCol-m-3{
float: auto;
width: 25%;
}
@media only screen and (max-width: 539px) {
    /* For mobiles Hjö: */
/*21.08.2018 Test Infobox soll bündig sein*/
.aside { padding: 0px; box-shadow: none; }
}

@media only screen and (min-width: 540px) {
    /* For tablets: */
    .col-m-1 {width: 8.33%;}
    .col-m-2 {width: 16.66%;}
    .col-m-3 {width: 25%;}
    .col-m-4 {width: 33.33%;}
    .col-m-5 {width: 41.66%;}
    .col-m-6 {width: 50%;}
    .col-m-7 {width: 58.33%;}
    .col-m-8 {width: 66.66%;}
    .col-m-9 {width: 75%;}
    .col-m-10 {width: 83.33%;}
    .col-m-11 {width: 91.66%;}
    .col-m-12 {width: 100%;}
    .footerCol-m-3 {width: 25%}

@media only screen and (min-width: 868px) {
    /* For desktop: */
    .col-1 {width: 8.33%;}
    .col-2 {width: 16.66%;}
    .col-3 {width: 25%;}
    .col-4 {width: 33.33%;}
    .col-5 {width: 41.66%;}
    .col-6 {width: 50%;}
    .col-7 {width: 58.33%;}
    .col-8 {width: 66.66%;}
    .col-9 {width: 75%;}
    .col-10 {width: 83.33%;}
    .col-11 {width: 91.66%;}
    .col-12 {width: 100%;}
    .footerCol-3 {width: 25%}
}
}
[class*="footer-col*"] {
    width: 25%;
}
.footerCol-3 .footerCol-m-3{
float: auto;
}




/* Style The Dropdown Button */
.dropbtn {
    background-color: #504CAF;
    background-color: #0055F0;/*strahlendes blau*/
    background-color: #0030A0;/*dunkles blau 04.05.2017*/
    color: white;
    padding: 8px;
    font-size: 14px;
    font-weight: bold;
    /*border: none;*/
    border-right: 5em;
    cursor: pointer;
    min-width:80px;
    width: 100%;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}
.dropbtn:hover{
color:#990;
} 

/* The container <div> - needed to position the dropdown content */
.dropdown {
    position: relative;
    display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9a9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1; 
}

/* Links inside the dropdown */
.dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {background-color: #333390;
/*.dropdown-content a:hover {background-color: #4466af;*/
color: white;
font-weight: bolder;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
    display: block;
}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {
    background-color: #3e418e;
}
/*Tabelle wg Zebratabelle Anfang*/
table {
    border-collapse: collapse;
    width: 100%;
    overflow: auto;
    border-top: 30px;    
}
#Tabelle {
overflow: auto;

}

table:before {
font-size: 0.3em;
content: ".......2019.......";

}
th, td {
    text-align: left;
    
    padding: 4px;
    vertical-align: top;
    /*font-family: courier;
    font-weight: bold;*/
    font-size: 0.9em;    
}

tr:nth-child(odd){background-color:  rgb(240,255,255)}
/* Zebratabelle Ende */





@media print{
body {
font-size: 0.8em;/*30.09.2018 kleiner Drucken*/
}
/* 23.09.2016: Neue divs class etc rteilweise ok..*/
/*29.05.2015 Inhalt steht falsch, soll nach links [] wo schrauben? Container? body?*/
/* Container muss hier noch rein wg Rand vom Inhalt*/


#container {
min-width:400px;
padding: 0px;
line-height: auto;

}

.header {
display: none;
}
.TopNav {
display: none; /*allg. Links*/
}
.row {
display: none;
}
p {line-height: 0.9em;

}
.Inhalt  {
    color:#ffa;
    background-color:#fff;
    list-style-type: none;
    
    /*font-size: 0.8em;*/
  }

  #Navigation {
  display: none;
}
.menu {
display: none;
}
/*
.footer{
display: none;
}*/
#dropdown {
display: none;
}
  

 /*
  .footer a,p {
  display: none;
}
*/
.aside {
/*min-width:400px;*/
float: left;
line-height: auto;
font-size: 0.8em;
padding: 0em;
margin-top: 0em;
box-shadow: none;
background-color:none;

        /*left: 2%;*/

       /* margin: 5px auto;*/

}
.aside p {
line-height: 100%;
}

.dropdown {
display: none;
}

}
  /*Ende media print*/