*, *:before, *:after {-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box}

/*      GERUEST    
.divlogo {width:800px; height:168px; margin: 15px 0 0 28px; z-index:55; position: absolute}   */


html {height: 101%}

.bildtopzecke {max-width: 100%;  height: auto}

.pic01 {margin: 0px 10px 10px 20px; float: right;}

.soci-mitte {margin: 5px; text-align: center;}

.italic {font-style: italic;}

body {margin:0 auto; 
margin-top: 42px;
background:  url(px/hg-gr-bl1.jpg) repeat-x ;
background-color:#D5EFFC; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:14px;
font-style:normal;
-moz-hyphens: auto;
-ms-hyphens: auto;
-webkit-hyphens: auto;
-epub-hyphens: auto;
hyphens: auto}

#huelle {position: relative; margin:0 auto; max-width: 925px;
-moz-box-shadow: 0 0 7px #888;
-webkit-box-shadow: 0 0 7px #888;
box-shadow: 0 0 7px #888}

.columnsContainer, header {position: relative; margin:0 auto; max-width: 925px; background-color: #FFF; }

.rightColumn {padding: 40px 50px 30px 40px; line-height:26px; color:#000;}

.leftColumn {padding: 44px 20px 20px 40px; text-align: right;
line-height:18px; color:#000}

.nacho {padding:0px 10px; float:right; font-size:11px; color: #929292; text-decoration: underline}

.footer {position: relative; margin:0 auto; max-width: 925px;}
.footertxt {text-align: center; padding: 5px; font-size:10px; color:#969696}
.footertxt  a:hover {text-decoration: none}
.fgrau {color:#6C6C6C}


.linie {border-bottom:1px dashed #B2B2B2;width:100%}


/*      SCHRIFT       font-family: 'Boogaloo', cursive;
    font-family: 'Kanit', sans-serif;
    font-family: 'Nunito', sans-serif;  */

#zeckenbiss {max-width: 100%; height: auto; background: url(px/hg-top.gif) no-repeat; }   

#mdl {font-family: 'Oswald', sans-serif;
font-size: 40px; font-weight: bold; line-height: 40px; color: #333;
text-align: right;
padding: 75px 0px 0px 0px;
width: 93%;
height:180px;
z-index:1;
position:absolute;
text-shadow: 3px 3px 5px #FFF; }

.einblendung  {display:none;}

h1 {text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:16px;
font-style:normal; font-weight: bold; line-height:26px; color:#333;  padding: 0; margin: 0}

h2 {text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:14px;
font-style:normal; font-weight: bold; line-height:26px; color:#000;  padding: 0; margin: 0}

h3 {text-align: left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:14px;
font-style:normal; font-weight: bold; line-height:26px; color:#000;  padding: 0; margin: 0}

.nav {list-style: none; margin-left: 0; margin-bottom: 0; padding-left: 0}


/*      LINKS     */

a:link {color: #074898; padding: 5px 0px; text-decoration: underline}
a:visited {color:#074898; text-decoration: none}
a:hover {color: #074898; font-weight: bold; padding: 5px 0px; text-decoration: none}
a:active {color:#074898; font-weight: bold; text-decoration: none}
a:focus {color:#074898; text-decoration: none}



@media screen and (min-width: 42em) 
{
.rightColumn {margin-left: 19em}
.leftColumn {position: absolute; top: 0; left: 0; width: 19em; text-align: left; }
}


/*  ----------------------------------------------- 950 px bis 700 px -----------------------------------------------  */

@media screen and (max-width: 950px) 
{

body {margin:0 auto; margin-top: 0px;}

#mdl {font-size: 40px; line-height: 40px; padding: 45px 0px 0px 0px; height:140px;}

.leftColumn {padding: 34px 15px 20px 25px; line-height:18px;}

.rightColumn {padding: 30px 30px 30px 25px; line-height:26px;}
}

/*  ----------------------------------------------- 500 px bis 700 px -----------------------------------------------  */

@media screen and (max-width: 700px) 
{

#mdl {font-size: 30px; line-height: 20px; padding: 40px 0px 0px 0px; height:110px;}

  .leftColumn {padding: 30px 15px 20px 20px; text-align: left;
line-height:16px;}

   .rightColumn {padding: 26px 30px 30px 30px; line-height:26px;}

}


/*  ----------------------------------------------- 370 px bis 500 px -----------------------------------------------  */

@media screen and (max-width: 500px) 
{

#mdl {font-size: 25px; line-height: 10px; padding: 30px 0px 0px 0px; height: 80px;}

   .rightColumn {padding: 26px 20px 30px 20px; line-height:26px;}

}


/*  ----------------------------------------------- M A X 370PX -----------------------------------------------  */

@media screen and (max-width: 370px) 
{

#mdl {font-size: 20px; line-height: 5px; padding: 20px 0px 0px 0px; height: 60px;}

  .leftColumn {padding: 30px 10px 20px 10px; text-align: left; line-height:16px;}

   .rightColumn {padding: 26px 10px 30px 15px; line-height:26px;}
}



