/* Grundeinstellungen */

body {font-family: Arial, Helvetica, sans-serif; overflow-x: hidden; }
a {text-decoration: none}
a:hover {text-decoration: underline}
h1 {font-size: 120%; color: #003D7C;}
h2 {font-size: 120%;  font-weight: normal}
h2 a {color: #0066CC; text-decoration: none}
h2 a:hover {color: #0066CC; text-decoration: underline}
h3 {font-size: 200%; color: #0066CC}
h4 {font-size: 200%; color: #0066CC}
h5 {font-size: 380%; color: #FFFFFF; text-shadow: 3px 3px 4px #000; font-weight: bold; display: block;
        -webkit-margin-before: 0px;
    -webkit-margin-after:0px;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    font-weight: bold;}

img {
    max-width: 100%;
    height: auto;
}

.clr { clear: both;}

li {
   display: inline-block;
}

label.open-menu-label {
		display: none;
	}

ul, menu, dir {
    display: block;
    list-style-type: none;
    -webkit-margin-before: 0px;
    -webkit-margin-after: 0px;
    -webkit-margin-start: 0px;
    -webkit-margin-end: 0px;
    -webkit-padding-start: 0px;
}

/* Anpassungen Checkbox+Label (Button) */

input#open-menu {
	display: none;visibility: hidden
}

input[type=checkbox]:checked ~ navi {
    display: block;visibility: hidden
}



/* Ger�st */



#kopf { width: 100%;
    height: 150px;
	background: #003D7C }


#ende { width: 100%;
    height: 150px;
	background: #003D7C }


#haupttext 	 { padding:10px; max-width: 100%; }

#spalten {  max-width: 100%; }

#content {text-shadow: 0.5px 0.5px 1px #666666; text-align: left;
padding: 1% 20px 20px 1%;
	width: 30%;
	min-height: 125px;
	float: left;
; color: #666666

}

#middle {min-height: 125px;
	width: 30%;
	float: left;
	text-align: left;
	text-shadow: 0.5px 0.5px 1px #666666;
padding: 1% 20px 20px 1%;
	;color: #666666
}

#right {
	width: 30%;
	min-height: 125px;
	display: inline-block;
	;
padding: 1% 20px 20px 1%;
color: #666666
}

#spaltenu { padding-top:20px; max-width: 100%; }

#contentu {text-shadow: 0.5px 0.5px 1px #666666; text-align: left;
padding: 1% 20px 20px 1%;
	width: 30%;
	height: auto;
	float: left;
; color: #000000

}

#middleu {text-shadow: 0px 0px 1px #666666; height: auto;
	width: 30%;
	float: left;
	text-align: left;
padding: 1% 20px 20px 1%;
	;color: #000000
}

#rightu {
	width: 30%;
	height: auto;
	display: inline-block;
	text-align: right;
padding: 1% 20px 20px 1%;
color: #000000; text-shadow: 0px 0px 1px #666666;
}



#linie { }
#fusslinie {z-index: 10; text-align: right; background-color: #cccccc ;  line-height: 30px;height: 30px; width: 100%;}
.fuss {vertical-align: middle; display: inline-block;  font-size: 80%; padding-right: 20px}
#fusslinie a { color: #FFFFFF; text-decoration: none}
#fusslinie a:hover { color: #FFFFFF; text-decoration: underline}

#anschrift { position:absolute; color: #FFFFFF; top: 50px; left: 180px}

#seitentitel { padding-top:10px;padding-bottom:10px;text-align: left;font-size: 200%; text-shadow: 0.5px 0.5px 1px #999999; font-weight: bold; color: #003D7C; }

#zwischentitel { padding-top:50px;padding-bottom:50px;text-align: left;font-size: 150%; color: #FFFFFF; text-shadow: 0px 0.5px 0.5px #999999; font-weight: bold; color: #003D7C; }

#seitentext { text-align: left;font-size: 120%; color: #FFFFFF; text-shadow: 0.5px 0.5px 0.5px #cccccc; color: #999999; }

#seitentextsimpel { text-align: left;font-size: 100%; color: #000000; }

#klicktext { text-align: left;font-size: 80%; color: #000000; padding-bottom: 10px; padding-top: 10px}


#titel { text-align: right;font-size: 380%; color: #FFFFFF; text-shadow: 3px 3px 4px #000; font-weight: bold; position:absolute; color: #FFFFFF; top: 50%; right: 15%}

#untertitel { text-align: right;font-size: 180%; color: #FFFFFF; text-shadow: 3px 3px 4px #000; position:absolute; color: #FFFFFF; top: 60%; right: 15%}


.schaltflaeche {background-color: #FF9900; height:50px; border-radius: 10px;}

#inhalt { height: auto; max-width: 100%; padding-top: 40px; padding-right: 15px; padding-bottom: 15px; padding-left: 15px; border-color: black black #CCCCCC; border-style: solid; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 5px; border-left-width: 0px}





/* Navigation */

#navigation {float: right}
.navi { display: inline-block; height: 150px; border: #FFFFFF; border-style: solid; border-top-width: 0px!important; border-right-width: 0px!important; border-bottom-width: 0px!important; border-left-width: thin; padding-left: 50px; padding-right: 50px;line-height:150px;  }
.navi a{color: #FFFFFF; text-decoration: none}
.navi a:hover {color: #FFFFFF; text-decoration: underline}
#navi {position:absolute; top: 0px;}

#navigationende {float: right}
.naviende { display: inline-block; height: 150px; border: #FFFFFF; border-style: solid; border-top-width: 0px!important; border-right-width: 0px!important; border-bottom-width: 0px!important; border-left-width: thin; padding-left: 50px; padding-right: 50px;line-height:150px;  }
.naviende a{color: #FFFFFF; text-decoration: none}
.naviende a:hover {color: #FFFFFF; text-decoration: underline}
#naviende {position:absolute; top: 0px;}

#listenlinie {width: 100%;}
.liste { display: inline-block;width: 250px; padding-right: 10px; padding-bottom: 35px;}
.listeoben {}
.listeunten {padding-top: 10px;text-align: center;font-size: 100%; text-shadow: 0.5px 0.5px 0.5px #cccccc; color: #666666;}
.listeunten a{color: #666666; text-shadow: 0px 0.5px 0.5px #cccccc;}
.listeunten a:hover {color: #666666;}

/* Bilder */

#bildlauf {overflow: hidden;;}


#bild {position: relative;  z-index: -15;

     background-image: url(../img/bild1.jpg);
     background-size: cover;
     height: 44%; width: 100%;
     overflow: hidden;;}


#bild1 { position: absolute;
      z-index: -5;
top: 312px;
     background-image: url(../img/bild1.jpg);
     background-size: cover;
     height: 45%; width: 100%;
     overflow: hidden;
	-webkit-animation-name: move-bild; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 60s; /* Chrome, Safari, Opera */
    animation-name: move-bild;
    animation-duration: 60s;
	-webkit-animation-delay: 5s;
    animation-delay: 5s;

}


#bild2 { position: absolute;
      z-index: -6;
top: 312px;
     background-image: url(../img/bild2.jpg);
     background-size: cover;
     height: 45%; width: 100%;
     overflow: hidden;
	-webkit-animation-name: move-bild; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 70s; /* Chrome, Safari, Opera */
    animation-name: move-bild;
    animation-duration: 70s;
	-webkit-animation-delay: 20s;
    animation-delay: 20s;

}

#bild3 { position: absolute;
      z-index: -7;
top: 312px;
     background-image: url(../img/bild3.jpg);
     background-size: cover;
     height: 45%; width: 100%;
     overflow: hidden;
	-webkit-animation-name: move-bild; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 80s; /* Chrome, Safari, Opera */
    animation-name: move-bild;
    animation-duration: 80s;
	-webkit-animation-delay: 30s;
    animation-delay: 30s;

}

#bild4 { position: absolute;
      z-index: -8;
top: 312px;
     background-image: url(../img/bild4.jpg);
     background-size: cover;
     height: 45%; width: 100%;
     overflow: hidden;


}

#bild5 { position: absolute;
     z-index: -9;

     background-image: url(../img/bild1.jpg);
     background-size: cover;
     height: 45%; width: 100%;
     overflow: hidden;
	-webkit-animation-name: move-bild; /* Chrome, Safari, Opera */
    -webkit-animation-duration: 100s; /* Chrome, Safari, Opera */
    animation-name: move-bild;
    animation-duration: 100s;
	-webkit-animation-delay: 50s;
    animation-delay: 50s;

}




@-webkit-keyframes move-bild {
    from {
        left: 0px;
    }
    50% {
        transform: translateX(800%)
    }
    to {
        left: 0px;
    }
}
@keyframes move-bild {
    from {
        left: 0px;
    }
    60% {opacity: 0.3;

    }
    to {
        transform: translateX(800%);
    }
}

.referenzfotos {padding-right: 10px; padding-bottom: 10px;}

/* Microsoft */

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    .navi {position:relative; top: -16px;list-style-position: inside; list-style-type: none; padding-top: 0px; padding-bottom: 0px;display: inline-block; height: 150px !important; border: #FFFFFF; border-style: solid; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: thin; padding-left: 50px; padding-right: 50px;  }

#bild {position: relative;  z-index: -15;


     background-size: cover;
     height: 42%; width: 100%;
     overflow: hidden;}

.referenzfotos {padding-right: 10px; max-width: 250px; height: auto;}

img referenzfotos  {max-width: 250px; height: auto;}

#fusslinie {z-index: 10; text-align: right; background-color: #cccccc ;  line-height: 30px;height: 30px; width: 100%!important; padding: 0px}

}
@supports (-ms-ime-align:auto){
    .navi { display: inline-block; height: 140px !important; border: #FFFFFF; border-style: solid; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: thin; padding-left: 50px; padding-right: 50px;  line-height: 140px; }

}

/* Fuer 1280px oder weniger */
@media screen and (max-width: 1280px) {


body {font-family: Verdana, Arial, Helvetica, sans-serif; text-align: center; margin-bottom: 0px, padding-bottom: 0px}

h1 {font-size: 100%;}
h2 {font-size: 100%; color: #666666; font-weight: normal}
h5 {font-size: 1%;}

a {
    text-decoration: none;
}


img {
    max-width: 90%;
    height: auto;
}

ul, menu, dir {
    display: block;
    list-style-type: none;
    -webkit-padding-start: 0px;
}

li {
    display: list-item;
    text-align: -webkit-match-parent;
}

table {

}

/* Ger�st */



#kopf { width: 98%;
    height: 100px;
	background: #003D7C }

#ende { visibility: hidden; width: 0%;
    height: 0px;
    background: #ffffff;  }


#bild {height: 0; width: 0; overflow: hidden;; visibility: hidden; }
#bild1 {height: 0; width: 0; overflow: hidden;; visibility: hidden; }
#bild2 {height: 0; width: 0; overflow: hidden;; visibility: hidden; }
#bild3 {height: 0; width: 0; overflow: hidden;; visibility: hidden; }
#bild4 {height: 0; width: 0; overflow: hidden;; visibility: hidden; }

#bild5 {height: 0; width: 0; overflow: hidden;; visibility: hidden; }



#spalten {  max-width: 98%; }

#content {text-align: center;
text-shadow: 0px 0px 0px;
padding: 10px 5px;
	width: 100%;
	height: auto;
	float: left;
; border-style: none;
; background-color: #CCCCCC

}

#middle {height: auto;
text-shadow: 0px 0px 0px;
	width: 100%;
	float: left;
	text-align: center;
padding: 10px 5px;
	border-style: none;
}

#right {
	width: 98%;
	height: auto;
	display: inline-block;
	text-align: center;
padding: 10px 5px;
	border-style: none;
; background-color: #FFFFFF
}


#spaltenu { padding-top:20px; }

#contentu {display: inline-block; text-align: center;
padding: 1% 20px 20px 1%;
	width: 100%;
	height: auto;
	text-shadow: 0px 0px 0px ; color: #000000

}

#middleu {display: inline-block; height: auto;
	width: 100%;
	text-shadow: 0px 0px 0px;
	text-align: center;
padding: 1% 20px 20px 1%;
	;color: #000000
}

#rightu {
	width: 100%;
	height: auto;
	display: inline-block;
	text-align: center;
padding: 1% 20px 20px 1%;
color: #000000;;
}


.referenzfotos {display: inline-block;padding-right: 10px; padding-bottom: 10px;}


#suchkasten {position:initial; background-color: #FFFFFF; background: rgba(255,255,255,0.7);height: 340px; width: 98%;top: 0px;
    left: 0px;}
.suchtext  { color: #666666; text-align: center}

#linie { }
#fusslinie {visibility: hidden;text-align: center; position:relative; bottom: 40px;  width: 98%;line-height: 0px;
    height: 0px;}

#anschrift { top: 0px; left: 0px}

#titel { height: 0; width: 0; color: #FFFFFF; visibility: hidden; }

#zwischentitel { padding-top:30px;padding-bottom:30px;font-size: 100%;  font-weight: bold; color: #003D7C; }

#seitentext { text-align: left;font-size: 100%; text-shadow: 0px 0px 0px; color: #999999; }

#seitentitel { padding-top:10px;padding-bottom:10px;text-align: left;font-size: 120%; text-shadow: 0px 0px 0px; font-weight: bold; color: #003D7C; }



#seitentextsimpel { text-align: left;font-size: 100%; color: #000000; }

#klicktext { font-size: 80%; color: #000000; padding-bottom: 10px; padding-top: 10px}

#untertitel  {font-size: 100%;text-align: center; padding-top: 10px; padding-bottom: 10px;text-shadow: 0px 0px 0px;    position: relative;
    color: #000000;
    top: 0%;
    right: 0%; visibility: hidden;}

.schaltflaeche {background-color: #FF9900; height:50px; border-radius: 10px;}



/* Navigation */

#navigation {color: #ffffff;
background: none;
    position: absolute;
    z-index: 20;
    height: auto;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif; font-size: large;
 width: 98%; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px
float: right}

#navigation a{

     color: #ffffff; text-decoration: none;

}


#navigation a:hover {
     color: #ffffff; text-decoration: underline;
}

.navi {	width: 100%;display: inline-block; height: 100px !important; border: #FFFFFF;   line-height: 100px; padding-left: 0px;
    padding-right: 0px;}
.navi a{color: #FFFFFF; text-decoration: none}
.navi a:hover {color: #FFFFFF; text-decoration: underline}

#navigationende {visibility: hidden; height: 0px; overflow-x: hidden;}
.naviende {visibility: hidden;height: 0px; line-height:0px;}

#naviende {visibility: hidden;height: 0px; line-height: 0px;}


#listenlinie {width: 100%;}
.liste { display: inline-block;width: 250px; padding-right: 10px; padding-bottom: 35px;}
.listeoben {}
.listeunten {padding-top: 10px;text-align: center;font-size: 100%; color: #666666;}
.listeunten a{color: #666666; }
.listeunten a:hover {color: #666666;}







/* Statische Navigation */

navi {


	}

	navi ul li {


	}

	/** Label wird ausgeblendet **/
	label.open-menu-label {
		display: none;
	}




navi {
	display: none;background: #003D7C
}

navi ul {
 	padding: 0px;
 	margin: 0px;
 	width: 98%;
}

navi ul li {
	list-style: none;
		width: 100%;
	border-style: solid; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px;
	background: #003D7C; /* Alte Browser */

}



/* Anpassungen Checkbox+Label (Button) */


input#open-menu {
	display: none;
}

input[type=checkbox]:checked ~ navi {
    display: block;visibility:visible;
}

label.open-menu-label {
	background: #003D7C;
	cursor: pointer;
	padding-top: 40px;
	border: 0p;
	display: block;

}



}