@import "fonts.css";
*,html { margin: 0px; padding: 0px; text-decoration: none; border: 0px; outline: none; }
html { height: 100%; }
body { color: #000; font-family: 'Open Sans', Calibri, Verdana, Arial, Helvetica, sans-serif; font-size: 16px; font-weight: 400; background: #D3D3D3; height: 100%;
}

@media (max-width: 959px) {
#main { position: relative; min-height: 100%; margin: 0 auto; }
#startseite { padding-bottom: 80px !important; }
#startseite #left { position: relative; padding: 60px 20px 30px 20px; max-width: 380px; margin: auto; }
#left img { width: 100%; height: auto; }
#startseite #name { padding-left: 20px; margin-bottom: 20px; font-size: clamp(2rem, 9vw, 2.5rem); font-weight: 500; text-align: center; }
#startseite #wdo { padding-left: 20px; }
.vita { text-align: center; }
#left a { color: #000; font-size: 24px; }

#startseite #galerien { position: relative; font-size: 24px; max-width: 600px; margin-left: 20px; margin-right: 20px; }
#startseite #galerien a { color: #000; }
.t1 { text-align: right; padding-right: 30px; }
.t2 { text-align: right; padding-right: 30px; }
.t3 { padding-right: 30px; }
#galerien img { width: 100%; height: auto; }

#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 50px; background: #B2B2B2; }
#footer p { text-align: center; font-size: 16px; font-weight: 500; padding-top: 10px; padding-bottom: 10px; color: #126b76; }
#footer a:link, #footer a:visited { color: #126b76; }
#footer a:hover, #footer a:focus { color: #2B2D99; }
#footer span { color: #000; }
#footer .nomobil { display: none; }

/* Mobilmenue */
nav { position: absolute; right: 0px; top: 0px; width: 100%; }
#hauptmenue {position: relative; width: 100%; background: none; z-index: 5000;}
.navbar-toggle { position: absolute; top: 20px; right: 20px; cursor: pointer; width: 51px; height: 31px; background: url(../designpics/bt_menue.png) no-repeat; z-index: 1200; }
.navbar-toggle span { display: none; }
#hauptmenue ul {list-style-type: none; margin-left: 0; }
#hauptmenue ul li {list-style-type: none; list-style-image: none; width: 100% !important;}
#hauptmenue li a:link, #hauptmenue li a:visited {background: #FFF; border-bottom: 1px solid #126b76; display: block; width: auto; max-width: 100%; padding: 15px 40px; color: #3F3F3E; font-size: 22px; font-weight: 400;}
#hauptmenue li a:hover, #hauptmenue li a:focus {background: #F2F2F2; border-bottom: 1px solid #126b76; color: #3F3F3E; font-size: 22px; font-weight: 500;}
.hm1 { background: #FFF; padding: 20px 0px; color: #3F3F3E; font-size: 22px; font-weight: 400;}
#hauptmenue ul li:hover .hm1 {background: #F2F2F2; font-weight: 400;} /*      Submenue allgemein   */
ul.sub-menu {position: relative; display: none; border-bottom: 1px solid #126b76;}
ul.sub-menu li a:link, ul.sub-menu li a:visited {color: #3F3F3E; font-size: 22px !important; border: none !important; padding: 8px 8px 8px 60px !important;}
ul.sub-menu li a:hover, ul.sub-menu li a:focus {color: #3F3F3E; font-size: 22px; font-weight: 400; border: none !important;} /*   	LEVEL TWO   */
ul.dropdown ul {width: 100%; position: relative; z-index: 40;}
.closed {display: none;} /* Speziell für Hauptmenüpunkt mit Submenü */
#hauptmenue li a:link[id*="hmnu-"] {background: white url(../designpics/arrow_smartmenue2.png) no-repeat center right !important;}
#hauptmenue li a:active[id*="hmnu-"] {background: white url(../designpics/arrow_smartmenue.png) no-repeat center right !important;}



}
@media (min-width: 960px) and (max-width: 1199px) {

#main { position: relative; min-height: 100%; margin: 0 auto; }
#hauptmenue { display: none; }
#startseite { padding-bottom: 80px !important; }
#startseite #left { padding-top: 30px; padding-left: 30px; max-width: 370px; }
#startseite #name { padding-left: 20px; margin-bottom: 20px; font-size: 40px; font-weight: 500; }
#startseite #wdo { padding-left: 20px; }
.vita { text-align: center; }
#left a { color: #000; font-size: 24px; }

#startseite #galerien { position: absolute; top: 60px; right: 30px; font-size: 24px; }
#startseite #galerien img { max-width: 220px; height: auto; }
#startseite #galerien a { color: #000; }
.t1 { text-align: right; padding-right: 30px; }
.t2 { text-align: right; padding-right: 30px; }
.t3 { padding-right: 30px; }

#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 50px; background: #B2B2B2; }
#footer p { text-align: center; font-size: 16px; font-weight: 500; padding-top: 10px; padding-bottom: 10px; color: #126b76; }
#footer a:link, #footer a:visited { color: #126b76; }
#footer a:hover, #footer a:focus { color: #2B2D99; }
#footer span { color: #000; }

}
@media (min-width: 1200px) {

#main { position: relative; min-height: 100%; margin: 0 auto; }
#hauptmenue { display: none; }
#startseite { padding-bottom: 80px !important; }
#startseite #left { padding-top: 30px; padding-left: 30px; max-width: 370px; }
#startseite #name { padding-left: 20px; margin-bottom: 20px; font-size: 39px; font-weight: 500; }
#startseite #wdo { padding-left: 20px; }
.vita { text-align: center; }
#left a { color: #000; font-size: 24px; }

#startseite #galerien { position: absolute; top: 30px; right: 10%; font-size: 24px; }
#startseite #galerien a { color: #000; }
.t1 { text-align: right; padding-right: 30px; }
.t2 { text-align: right; padding-right: 30px; }
.t3 { padding-right: 30px; }

#footer { position: absolute; width: 100%; left: 0px; bottom: 0px; height: 50px; background: #B2B2B2; }
#footer p { text-align: center; font-size: 18px; font-weight: 500; padding-top: 10px; padding-bottom: 10px; color: #126b76; }
#footer a:link, #footer a:visited { color: #126b76; }
#footer a:hover, #footer a:focus { color: #2B2D99; }
#footer span { color: #000; }

}