/*
######################################
        Media-Queries
###################################### */


@media (max-width: 1600px) {

}

@media (max-width: 1400px) {

}

@media (max-width: 1200px) {
         #topshops .item { width: calc((100% / 6) - 15px); }

}

@media (max-width: 1020px) {
         #header .bar .top .r .k { display: none; }
         #girl { top: 11px; left: calc(50% - 360px); width: 180px; height: 150px; }
         #site .sidebar { width: 300px; }
         #site .sidebar .as { width: 300px !important; height: auto; overflow: hidden; }
         #site .content { width: calc(100% - 300px - 20px); }

         .posting-box .date { width: 30px; height: 60px;  margin: 25px 0px 0px 0px; padding: 5px; font-size: 1.3em; }
         .posting-box .date span { display: block; width: calc(100% - 2px); padding: 8px 5px 6px 5px; margin: -6px 0px 5px -5px; }
         .posting-box .box { width: calc(100% - 40px - 22px); }

         #lexikon a.button { width: 30px; height: 30px; line-height: 30px; font-size: 1.1em; }
         #lexikon .item { width: calc((100% / 3) - 44px) !important; padding: 20px 20px 10px 20px; border-right: 4px var(--main-color) dotted !important; border-top: 4px var(--main-color) dotted !important; }
         #lexikon .item:nth-child(2), #lexikon .item:nth-child(3), #lexikon .item:nth-child(4) { border-top: 0px !important; }
         #lexikon .item:nth-child(3n + 1) { border-right: 0px !important; }
         #lexikon .item a { font-size: 0.8em; }
}

@media (max-width: 920px) {
         #site .sidebar { width: 200px; }
         #site .sidebar .as { width: 200px !important; }
         #site .content { width: calc(100% - 200px - 20px); }

         #girl { left: calc(50% - 375px); }
         #search { left: calc(50% - 270px); }

}

@media (max-width: 800px) {
         #header .bar .top .navi { position: absolute; left: 20px; top: 60px; background: var(--white); padding: 5px 10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
         #header .bar .top .r { display: none; }
         #girl { display: none; }
         #search { left: calc(50% - 240px); }

         #topshops .item { width: calc((100% / 5) - 15px); }

         #site .sidebar { display: none; }
         #site .content { width: calc(100% - 0px - 0px); }

         #footer .l, #footer .r { float: none; display: block; text-align: center; margin: 5px 0px; }

}

@media (max-width: 680px) {
         #header .logo { width: calc(100% - 80px); max-width: 300px; }
         #search { top: 130px; left: 30px; width: calc(100% - 60px); }
         #search form { width: calc(100% - 30px); }

         /*
         #kontaktform form label, #kontaktform form input, #kontaktform form textarea { display: block; float: none; width: calc(100% - 20px); }
         #kommentare form label, #kommentare form input, #kommentare form textarea { display: block; float: none; width: calc(100% - 20px); }
         */
         #scode { margin: 0px 0px 0px 0px; }

         .posting-box .article img.full { width: calc(90% - 0px); border: 0px #ffffff solid; }

         #article .vorteile ul, #article .vorteile .ib { float: none; width: calc(100% - 0px); }
         #article .vorteile .ib { margin-top: 20px; }

         #lexikon .item { width: calc((100% / 2) - 40px) !important; padding: 20px 20px 10px 20px; border-right: 0px var(--main-color) dotted !important; border-top: 0px var(--main-color) dotted !important; }
         #lexikon .item:nth-child(0), #lexikon .item:nth-child(1), #lexikon .item:nth-child(2), #lexikon .item:nth-child(3), #lexikon .item:nth-child(4), #lexikon .item:nth-child(5) { border-top: 0px !important; }
         #lexikon .item:nth-child(2n + 1), #lexikon .item:nth-child(3n + 1) { border-right: 0px !important; }
         #lexikon .item:nth-child(odd) { border-right: 0px !important; }

         #socialmedia_bar, #socialmedia_bar div, #socialmedia_bar div a { height: 40px; }
         #socialmedia_bar div { background-position: center center !important; background-size: 40px 40px !important; }
         #socialmedia_bar div a {  text-indent: -99999px; }
         #socialmedia_bar div.twitter { background-color: #00ACED !important; }
         #socialmedia_bar div.facebook { background-color: #3f67a9 !important; }
         #socialmedia_bar div.mail { background-color: #6b6b6b !important; }
         #socialmedia_bar div.wa { background-color: #70c700 !important; }
         #socialmedia_bar div.all { padding-top: 10px; height: 30px; }
}

@media (max-width: 480px) {
         #header .logo { float:right; max-width: 280px; }
         #header .bar { margin-top: 15px; }
         #search .k, .posting-box .date.k { display: none; }

         .posting-box .box.b { width: calc(100% - 0px - 22px); }
         .posting-box .tags { text-align: center; }
         .posting-box .article { padding: 8px 5px 10px 5px; font-size: 1.1em; line-height: 1.5em; }
         #article .goto { font-size: 0.8em; }

         #lexikon .item a { font-size: 0.8em; }


}