/* ################################################### WIDTH 1300px ################################################### */
@media only screen and (max-width: 1700px){

.w1600{
width: 90%;
}

}

/* ################################################### WIDTH 1500px ################################################### */
@media only screen and (max-width: 1500px){

.fs_2_5 {
font-size: 1.8em;
}

}

/* ################################################### WIDTH 1300px ################################################### */
@media only screen and (max-width: 1300px){

.w1200{
width: 90%;
}

.w50, #video .w35, #video .w60{
width:100%;	
}

.col_50.dis_fle, #video .w1600.dis_fle{
display: block;
}

#video .w60{
padding-top:5vh;
}

.w50 .w70{
width: 90%;
}

}

/* ################################################### WIDTH 1100px ################################################### */
@media only screen and (max-width: 1100px){

body{
font-size: 16px;
}

.fs_3_vw {
font-size: 5vw;
}

.pt_25{
padding-top: 17vh;
}

.pt_15{
padding-top: 10vh;
}

.pt_7_5{
padding-top: 5.5vh;
}

.pt_5{
padding-top: 3.75vh;
}

.pt_2_5{
padding-top: 2vh;
}

.pt_2{
padding-top: 1.5vh;
}

.pt_1{
padding-top: 0.75vh;
}

.pb_25{
padding-bottom: 17vh;
}

.pb_15{
padding-bottom: 10vh;
}

.pb_5{
padding-bottom: 3.75vh;
}

.pb_2_5{
padding-bottom: 2vh;
}

.pb_1{
padding-bottom: 0.75vh;
}

.w30{
width: 100%;
}

.w21{
width: 42%;
}

#brillen .w100.dis_fle{
gap: 2vh 0vw;
}

.w30:nth-child(2){
padding:5vh 0;
}

.col_30 .dis_fle{
display: block;
}

}

/* ################################################### WIDTH 900px ################################################### */
@media only screen and (max-width: 900px){

.w800{
width: 90%;
}

.play_button{
width: 100px;
height: 100px;
background-size: 120% auto;
background-position: center;
}

}

/* ################################################### WIDTH 800px ################################################### */
@media only screen and (max-width: 800px){

.w475{
width: 100%;
}

.w475:nth-child(2){
padding-top: 5vh;
}

header nav{
display: none;
}

header .mr_a {
width: 100%;
margin: 0px auto;
text-align: center;
}

header .mr_a img{
height: 45px;
}

.nav_button{
display: block;
}

.nav_rep.dis_fle{
display: flex;
}

#filialen .dis_fle, footer .dis_fle{
display: block;
}

#filialen picture{
overflow: hidden;
}

#filialen picture img{
width: 170vw;
margin-left: -35%;
}

footer{
text-align: center;
}

footer .ml_a{
padding-top: 1vh;
}

}

/* ################################################### WIDTH 700px ################################################### */
@media only screen and (max-width: 700px){

body{
font-size: 15px;
}

}

/* ################################################### WIDTH 600px ################################################### */
@media only screen and (max-width: 600px){

.play_button{
width: 70px;
height: 70px;
}

#filialen picture img{
width: 200vw;
margin-left: -50%;
}

}

/* ################################################### WIDTH 500px ################################################### */
@media only screen and (max-width: 500px){

body{
font-size: 14px;
}

.fs_3_vw {
font-size: 7vw;
}

.fs_2_5 {
font-size: 1.6em;
}

.pt_25{
padding-top: 12vh;
}

.pt_15{
padding-top: 5vh;
}

.pt_7_5{
padding-top: 3.75vh;
}

.pt_5, #video .w60, .w475:nth-child(2), .w21{
padding-top: 2.5vh;
}

.pt_2_5{
padding-top: 1vh;
}

.pt_2{
padding-top: 1vh;
}

.pt_1{
padding-top: 0.5vh;
}

.pb_25{
padding-bottom: 12vh;
}

.pb_15{
padding-bottom: 5vh;
}

.pb_5{
padding-bottom: 3.75vh;
}

.pb_2_5{
padding-bottom: 1vh;
}

.pb_1{
padding-bottom: 0.5vh;
}

#intro .b20{
bottom: 15%;
}

.swiper-container .swiper-slide {
padding-bottom: 60px;
}

.swiper-pagination-bullet {
width: 9px;
height: 9px;
}

.swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0px 6px;
}

.w30:nth-child(2){
padding:2.5vh 0;
}

.w21{
width: 100%;
display: block;
}

#brillen .w100.dis_fle{
gap: 0vh 0vw;
}

}

/* ################################################### WIDTH 400px ################################################### */
@media only screen and (max-width: 400px){

body{
font-size: 13px;
}

}
