

/*---- MOBILE----*/
/*@media only screen and (min-width : 320px) and (max-width: 479px){
#header {width:100%;position:fixed;z-index:1995;}

#logo, #topnav {float:none}
#logo {position: absolute;
display: block;
width: 100%;
z-index: 1750;
margin: 0 auto;
text-align: center;
height: 40px;
background-color: #000;
top: 31px;
padding-top: 22px;}

#topnav {margin: 0 auto;
text-align: center;
position: absolute;
top: 0px;
background-color: #000;
width: 100%;
border-bottom: 1px solid #fff;
height: 30px;}

#nav {position:relative;background:none; margin:0; height:auto;}
#main-menu {width:100%}
#container {margin:0 auto;margin-top:100px;}	
#anzeige .info {
 top:20px;
}
#anzeige .info h3 {font-size: 1.8rem;}
.swiper-container {height:350px;}
.box-contact01 {margin-top:20px;width:100%;}
#flexbox {display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
width:95%;
}

.box-03, .box-02, .box-01, .box-05, .box-contact01, .box-banner01 {width:100% !important;}



H4 {font-size: 1.8rem;
line-height: 3rem;margin-left:6px;}

.sm, .sm ul, .sm li {text-align:center !important;}
.sm-blue a, .sm-blue a:hover, .sm-blue a:focus, .sm-blue a:active {padding-right:0px !important;}



}*/


@media only screen and (min-width : 320px) and (max-width: 479px){
#header {max-width:100%;}

#logo, #topnav {float:none}
#logo {    position: absolute;
    display: block;
    width: 100%;
    z-index: 1750;
    text-align: center;
    background-color: #000;
    top: 30px;
    _padding-top: 22px;
    padding-top: 12px;
    border-top: 1px solid #fff;
height: 60px;
}

#topnav {margin: 0 auto;
text-align: center;
position: absolute;
top: 10px;
width: 80%;
height: 40px;
z-index: 1999;}

#nav {position: absolute;margin: 0;top: 0px;right: 20px;}

.header__container {position: absolute;right: 25px;top: -10px;}
.header__container {max-width: 90%;margin: 0 auto;display: flex;align-items: center;justify-content: space-between;padding:0;}
.header__menu {top: 30px;position: relative;z-index: 1900;}


#main-menu {width:100%}
#container {margin:0 auto;margin-top:100px;}	
#anzeige .info {top:10px;}
#anzeige .info h3 {font-size: 1.0em;}

.swiper-container {height:350px;}
.box-contact01 {margin-top:20px;width:100%;}

#flexbox {display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
width:95%;
}

.box-03, .box-02, .box-01, .box-05, .box-contact01, .box-banner01 {width:100% !important;}
.box-01, .box-contact01, .box-banner02, box-v {margin: .9em 0 .9em 0;}

H4 {font-size: 1.8rem;line-height: 3rem;margin-left:6px;}

#info  {display:none;}
#box-t img {width:auto; height:auto;}
.box-t {top: 100px;}
.box-t h3 {font-size:2.0em;padding:2%;}
}




@media screen and (min-width: 480px) and (max-width: 599px) {

#header, #main-menu, #container, .footerbox {max-width:100%;}
#anzeige .info {
 top:35px;
}
#anzeige .info h3 {font-size: 1.8rem;}
.swiper-container {height:350px;}
#header {width:100%;position:fixed;z-index:1995;}
#logo, #topnav {float:none}
#logo {position: absolute;
display: block;
width: 100%;
z-index: 1750;
margin: 0 auto;
text-align: center;
_height: 40px;
height: 60px;
background-color: #000;
top: 31px;
_padding-top: 22px;
padding-top: 12px;
}

#topnav {margin: 0 auto;
text-align: center;
position: absolute;
top: 0px;
background-color: #000;
width: 100%;
border-bottom: 1px solid #fff;
height: 30px;}
#nav {position:relative;background:none; margin:0; height:auto;}#main-menu {width:100%}
.box-contact01 {margin-top:20px;}
#flexbox {display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: column;
flex-direction: column;
width:95%;
}
.box-03, .box-02, .box-01, .box-05 {width:100%}


H4 {font-size: 2rem;
line-height: 3rem;margin-left:6px;}
}



@media screen and (min-width: 600px) and (max-width: 767px) {
	#header, #main-menu, #container, .footerbox {max-width:100%;}

#anzeige .info {
 top:55px;
}
#anzeige .info h3 {font-size: 2.3rem;}
.swiper-container {height:350px;}
#header {width:100%;position:fixed;z-index:1995;}
#logo, #topnav {float:none}
#logo {position: absolute;
display: block;
width: 100%;
z-index: 1750;
margin: 0 auto;
text-align: center;
_height: 40px;
height: 60px;
background-color: #000;
top: 31px;
_padding-top: 22px;
padding-top: 12px;
}

#topnav {margin: 0 auto;
text-align: center;
position: absolute;
top: 0px;
background-color: #000;
width: 100%;
border-bottom: 1px solid #fff;
height: 30px;}
#main-menu {width:100%}
.box-contact01 {margin-top:20px;}
#flexbox {display: -webkit-flex;
display: -ms-flexbox;
display: flex;

width:95%;
}
.box-03, .box-02, .box-05 {width:100%}
.box-01, .box-05 {width:45%;}
H4 {font-size: 2rem;
line-height: 3rem;margin-left:6px;}

}




@media only screen and (min-width: 768px) and (max-width: 960px) {
/*	#header, #main-menu, #container, .footerbox {max-width:90%;}*/

#anzeige .info {
 top:50px;
}
#anzeige .info h3 {font-size: 2.9rem;}

.sm-blue a {white-space:unset !important;}

#main-menu {width:100%}
.box-contact01 {margin-top:20px;}
#flexbox {display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-ms-flex-direction: row;
flex-direction: row;
width:95%;
}
.box-03, .box-02 {width:100%}

H4 {font-size: 2rem;
line-height: 3rem;margin-left:6px;}
.mask .headline-box {font-size: unset;}

}

@media only screen and (min-width: 961px) and (max-width: 1024px) {
/*#header, #main-menu, #container, .footerbox {max-width: 90%;}*/

#anzeige .info {
 top:60px;
}
#anzeige .info h3 {font-size: 3.4rem;}
.sm-blue a, .sm-blue a:hover, .sm-blue a:focus, .sm-blue a:active {font-size:11px!important;}
.mask .headline-box {font-size: unset;}
}

@media only screen and (min-width: 1024px) and (max-width: 1250px) {
/*#header, #main-menu, #container, .footerbox {max-width: 90%;}*/
.head1 H3 {font-size: 0.75rem;line-height:115%;}
.head1 H3 {font-size: 1.6rem;line-height:115%;}
.mask .headline-box {font-size: unset;}


@media only screen and (min-width: 1251px) and (max-width: 1350px) {

#anzeige .info {
 top:100px;
}
#anzeige .info h3 {font-size: 4.5rem;}
}



@media only screen and (min-width: 1351px) and (max-width: 1450px) {
#anzeige .info {
 top:100px;
}
#anzeige .info h3 {font-size: 5rem;}
}

@media only screen and (min-width: 1451px) and (max-width: 1550px) {
#anzeige .info {
 top:100px;
}
#anzeige .info h3 {font-size: 5.5rem;}
}

@media only screen and (min-width: 1551px) and (max-width: 1650px)  {
#anzeige .info {
 top:100px;
}
#anzeige .info h3 {font-size: 6rem;}
}

@media only screen and (min-width: 1651px) and (max-width: 1750px)  {
#anzeige .info {
 top:100px;
}
#anzeige .info h3 {font-size: 6.5rem;}
}

@media only screen and (min-width: 1751px) and (max-width: 2700px)  {
#anzeige .info {
 top:100px;
}
#anzeige .info h3 {font-size: 7rem;}
}
