/* Media Queries  */
@media (max-width: 1460px) {
        .in { width: calc(100% - 60px); padding: 0px 30px; }
         h1 { font-size: 1.7em; }
         h2 { font-size: 1.6em; }
         h3 { font-size: 1.4em; }

         #eyecatcher.bg_main { height: calc(100vw / 2.9166666 - 10px); }
         #pics .item { width: calc(33.3333vw - 10px - 25px); height: calc(33.3333vw - 10px - 25px); max-height: calc(33.3333vw - 10px - 25px); background-color: #FFFFFF; }
}

@media (max-width: 980px) {
         .in { width: calc(100% - 40px); padding: 0px 20px; }
         h1 { font-size: 1.5em; }
         h2 { font-size: 1.4em; }
         h3 { font-size: 1.2em; }

         #vergleich { font-size: 0.9em; width: calc(100% - 10px); padding: 20px 5px 20px 5px; }
         #vergleich .item b { font-size: 1.3em; }
         #vergleich .item .button { font-weight: 500; font-size: 1.2em; padding: 6px 15px 6px 15px; }
}


@media (max-width: 800px) {
         #logo { display: block; width: 100%; text-align: center; }
         #logo img {max-width: 240px; margin: 15px 0px;}
         #navigation .l, #navigation .r { float: none; display: inline-block; margin-top: 5px; }
         #navigation a { display: inline-block; font-size: 1.3em; }
}

@media (max-width: 660px) {
         .in { width: calc(100% - 20px); padding: 0px 10px; }
         #footer .in span { display: block; width: 100%; text-align: center; padding: 10px 0px; }
         #footer .in .l, #footer .in .r { float: none; display: inline-block; }
         #footer .in .l:after { content: " | "; }
         .x { display: none !important; }

         #pics .item { width: calc(50vw - 10px - 25px); height: calc(50vw - 10px - 25px); max-height: calc(50vw - 10px - 25px); }
}

@media (max-width: 560px) {
         #logo { margin: 0px; }
         #logo img {max-width: 200px; margin: 15px 0px;}
         #navigation .l, #navigation .r, #header .navigation { display: none !important; margin: 0px; }
         #menu { display: block; }

         #vergleich .item { margin: 10px 5px; }
         #slider .slider_l, #slider .slider_r {  width: 60px;}
         #slider .slider_content { width: calc(100% - 120px); }
}

@media (max-width: 480px) {

}

@media (max-width: 420px) {
         #pics .item { width: calc(100vw - 10px - 25px); height: calc(100vw - 10px - 25px); max-height: calc(100vw - 10px - 25px); }
}