header, footer, section, aside, nav, article { 
	display: block;
    }
body {
    background-color: whitesmoke;
    font-size: 100%;
    font-family: Helvetica, SunSans-Regular, Sans-Serif;
    color: black;
    }
pre, code {
    font-size: 1.3em;
    }
a {
    color: aqua;
    text-decoration: none;
    }
a:visited {
    color:#0099ff;
    }
a:hover {
    color:#888;
    }
a:active {
    color:#000000;
    }
h1{
    font-size:2.5em;
   
    font-weight: 100;
    color:#fff;
    margin: 0em;
    }

h2 {
    font-size:1.563em;
    text-shadow: 1px 1px 5px grey;
    font-weight: 100;
    color:#444444;
    margin: 0em;
    padding:1.25em;
    text-align: left;
    }    
h3 {
    font-size:1em;
    font-weight: normal;
    color:#fff;
    }
h4{
    font-size:1.2em;
    font-weight: 100;
    color:#444444;
    margin: 0em;
    padding-top:1.25em;
    padding-left: 1.25em;
    font-weight: 100;
    color:#666;
   
    }

h5 {
    font-size:1.563em;
    text-shadow: 1px 1px 5px grey;
    font-weight: 100;
    color:#fff;
    margin: 0em;
    padding:0em;
    padding-top:1.5em;
    text-align: center;
    }   
h6 {
    font-size:1.563em;
    
    font-weight: 100;
    color:#666;
    margin: 0em;
    padding:0em;
    padding-top:0.5em;
    text-align: center;
    } 
h7 {
    
    font-size:1.563em;
   
    font-weight: 100;
    color:#666;
    margin: 0em;
    padding:1.25em;
    text-align: left;
    }      
    
img{
    width: 90%;
    height: auto;
    max-width: 100%;
    border:none;
    
    }
p, pre{
    line-height:1.25em;
    font-weight: 100;
    color:#444444;
    margin: 0em;
    padding:1.5em;
    }
.eins {
    text-shadow: 1px 1px 5px black;
    margin: 5px;
}
.dark {
    text-shadow:none;
    padding:0em;
}  
.middle {
    vertical-align: middle;
}
.left {
    text-align: left;
}
.justify {
    text-align:justify;
}
.right {
    float:right;
    text-align: right;
}
.auto {
    height: 100%;
    width: 100%;
    vertical-align: middle;
    text-align: center;
}
.center {
    text-align: center;
}    
/* ---------- header, content, footer width -------------- */
.inner{
    margin: 0 auto;
    padding: 5px;
    max-width: 1000px;
    min-width:700px;
    
    }
/* ----------header for logo-------------- */
header {
    background: rgb(20, 184, 255);
    width: 100%;
    height: 150px;
    position: absolute;
    position: fixed ! important;
    left: 0;
    top: 0;
    border-bottom:1px solid #666;
    border-top:1px solid #666;
    overflow: visible;
    
    }
header img {
    float: left;
    width: 250px;
    height: 120px;
    margin: 10px; 
    }

/* ----------------- content--------------------- */

.content{
    position: absolute;
    width: 100%;
    top: 151px;
    bottom: 100px;
    left: 0px;
    right: 0px;
    z-index:-1;
}

/*.overlap {
    background-color: #0099ff;
    position: relative;
    width: 100%;
    max-height: 25%;
    opacity: 0.5;   
    top: 0px;
    left: 0;
    z-index: 1;
    
    }
*/
.blog{
    width: 100%;  
    border:1px solid #666;
    padding: 5px;
    margin:5px;
    }
div.container{
    background-color: whitesmoke;
    display: block;
    position: relative;
    width: 95%;
    margin: 0 auto;
    padding: 20px 20px 60px 20px;
    
    top: 0px;
    left: 0;
    }
.text {
    background-color: #fff;
    top: 0;
    left:0;
    margin-bottom: 5px;
    padding:5px;
    text-align:justify;
    }
.impressum{
    background-color: #fff;
    top: 0;
    left:0;
    margin-bottom: 5px;
    padding:5px;
    text-align:center;
}
.kontakt {
    background-color:#fff;
    float: left;
    top: 0;
    left:0;
    width:400px;
    height:400px;
    
    margin-right: 20px;
    margin-bottom:20px;
   
    
}
#bgimage{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
   
    background-image: URL("bghome.jpg");
    background-size: cover; 
    background-position: center top; 
    
    background-repeat: no-repeat;
    }
#bgimage1{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
   
    background-image: URL("ichbg.jpg");
    background-size: cover; 
    background-position: center top; 
    background-repeat: no-repeat;
    }
#bgimage2{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
    
    background-image: URL("leistungen.jpg");
    background-size: cover; 
    background-position: center top; 
    background-repeat: no-repeat;
    }
#bgimage3{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
    
    background-image: URL("bgvereine.jpg");
    background-size: cover; 
    background-position: center top; 
    background-repeat: no-repeat;
    }
#bgimage4{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
    
    background-image: URL("bgblog.jpg");
    background-size: cover; 
    background-position: center top; 
    background-repeat: no-repeat;
    }
.bgimage5{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
    
    background-image: URL("bgkontakt1.jpg");
    background-size: cover; 
    background-position: center top; 
    background-repeat: no-repeat;
    }
.bgimage5:hover{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
    
    background-image: URL("bgkontakt2.jpg");
    background-size: cover; 
    background-position: center top; 
    background-repeat: no-repeat;
    }
 .bgimage6{
    position: relative;
    width: 100%;
    height: 432px;
    opacity: 1;   
    top: 0px;
    left: 0;
    background-image: URL("bgkontakt2.jpg");
    background-size: cover; 
    background-position: center top; 
    background-repeat: no-repeat;
    }
 
/* -----------footer--------------------------- */
footer {
    background: rgb(20, 184, 255);
    
    width: 100%;
    
    position: absolute;
    position: fixed ! Important;
    left: 0;
    bottom: 0;
    border-bottom:1px solid #666;
    border-top:1px solid #666;
    color: #fff;
    overflow: visible;
}



/* ---------table---------- */
table{
    table-layout:fixed;
}
th {
    font-size: 1.5em;
    
}
td{
    font-size:0.8em;
    width:20%;
}
td:nth-child(even){
    font-size:0.8em;
    width:80%;
}
th, td {
    
    padding: 15px;
    text-align: center;    
}
td:nth-child(even):hover{
    font-size:1.5em;
}
/* ---------logos-------------------- */
.logo {
    
    padding:10px;
    margin: 0 auto;
    text-align: center;
    display: block;
}
#logo1 {
    background-color: #fff;
    padding: 10px;
    margin:20px;
    width: 5.75em;
    height: 4em;
}
#logo2 {
    background-color: #fff;
    padding: 10px;
    margin: 20px;
    width: 13em; 
    height: 4em;   
}
/* ---------googleMap---------------- */
#googleMap {
    float:right;
    background-color: #fff;
    
  
    margin-bottom:140px;
    right: 0px;
    top: 0;
    height: 100%;
   
}
/* ---------mobile divices 1024------ */
@media screen and (max-width: 1024px){
    header {
    
    width: 100%;
    height: 140px;
    
    
    }
header img {
    
    width: 195px;
    height: 100px;
    margin: 10px; 
    }
.content{
    
    width: 100%;
    top: 141px;
    bottom: 100px;
    left: 0px;
    right: 0px;
    }
}
/* ---------mobile divices 640------- */
@media screen and (max-width: 1000px){
    #googleMap{
    float:left;
}
}
@media screen and (max-width: 782px){
   
header {
    width: 100%;
    height: 100px;
    }
header img {
  
    width: 156px;
    height: 80px;
    margin: 5px; 
    }
div.container{
   
    position: relative;
    
   
    
    
    top: 0;
    left: 0;
    }
.content{
    
    width: 100%;
    top: 124px;
    bottom: 20px;
    left: 0px;
    right: 0px;
 
}
.kontakt{
    width:300px;
    height: 300px;
}
h1 {
    font-size:1.2em;
    font-weight: normal;
    
    margin: 20px 20px 20px;
    }

h2 {
    font-size:1.0em;
    font-weight: 700;
    padding-left:20px;
    }    
h3 {
    font-size:1.0em;
    font-weight: normal;
    }
p {
    font-size: 1.0em;
    }
}