/* RESPONSIVE CSS
-------------------------------------------------- */
/* lg ------- */

@media (min-width: 1200px) {
    .modal {
        margin-top: -35px;
    }
    .modal-dialog {
        width: 980px;
    }
}
/* md ------- */

@media (min-width: 992px) and (max-width: 1199px) {
    .ds_link {
        font-size: 11px;
        line-height: 13px;
        letter-spacing: 1.3px;
    }
    .datenschutz {
        margin-top: -1110px;
        margin-left: 710px;
        z-index: 100;
    }
    .datenschutz_zutaten {
        position: absolute;
        margin-top: -1110px;
        margin-left: 150px;
        z-index: 4;
    }
    .stoerer_werbung {
        margin-top: -980px;
        margin-left: 800px;
    }
    .stoerer_werbung img {
        width: 150px;
    }
    .bretter {
        margin-top: -40px;
    }
    .kachel1 {
        margin-top: -1450px;
        margin-left: -370px;
    }
    .kachel2 {
        margin-top: -1450px;
        margin-left: 940px;
    }
    .tisch {
        margin-top: -630px;
        margin-left: 190px;
    }
    .glocke {
        margin-top: -980px;
        margin-left: 680px;
    }
    .glocke01 {
        margin-top: 0px;
        margin-left: 0px;
    }
    .glocke01 img {
        width: 45%;
    }
    .glocke02 {
        margin-top: -13px;
        margin-left: 0px;
    }
    .glocke02 img {
        width: 18%;
    }
    .hopfen {
        margin-top: -665px;
        margin-left: 160px;
    }
    .phone {
        margin-top: -695px;
        margin-left: 250px;
    }
    .phone1 {
        position: relative;
        margin-top: 0px;
        margin-left: 0px;
    }
    .phone2 {
        margin-top: -90px;
    }
    .bierglaeser {
        margin-top: -670px;
        margin-left: 580px;
    }
    .bierglas01 {
        margin-top: -70px;
        margin-left: -60px;
    }
    .bierglas01 img {
        width: 40%;
    }
    .bierglas02 {
        margin-top: -30px;
        margin-left: 10px;
    }
    .bierglas02 img {
        width: 40%;
    }
    .bierglas03 {
        margin-top: -55px;
        margin-left: 70px;
    }
    .bierglas03 img {
        width: 50%;
    }
    .bierglas04 {
        margin-top: -100px;
        margin-left: -80px;
    }
    .bierglas04 img {
        width: 40%;
    }
    .bierglas05 {
        margin-top: -43px;
        margin-left: 0px;
    }
    .bierglas05 img {
        width: 40%;
    }
    .bierglas06 {
        margin-top: -74px;
        margin-left: 50px;
    }
    .bierglas06 img {
        width: 50%;
    }
    .bilderrahmen {
        margin-top: -585px;
        margin-left: 225px;
        z-index: 3;
    }
    .buecher {
        margin-top: -410px;
        margin-left: 663px;
        z-index: 2;
    }
    .buecher img {
        width: 50%;
    }
    .buecher01 {
        margin-top: -110px;
        margin-left: -35px;
    }
    .buch01 {
        margin-top: -125px;
        margin-left: -40px;
    }
    .bengel {
        margin-top: -840px;
        margin-left: 410px;
        z-index: 4;
    }
    .bengel02 {
        margin-top: -725px;
        margin-left: 350px;
        z-index: 4;
    }
    .bengel03 {
        margin-top: -885px;
        margin-left: 400px;
    }
    .bengelKoerper02 img {
        width: 77%;
    }
    .bengel04 {
        margin-top: -730px;
        margin-left: 60px;
    }
    .bengelKoerper04 img {
        width: 90%;
    }
    .bengel05 {
        margin-top: -865px;
        margin-left: 260px;
    }
    .bengelKoerper05 img {
        width: 90%;
    }
    .bengelNews {
        margin-top: -630px;
        margin-left: 545px;
    }
    .bengelKoerperNews img {
        width: 60%;
    }
    .bengelKopfNews {
        margin-top: -465px;
        margin-left: 105px;
    }
    .bengelHandLiNews {
        margin-top: 0px;
        margin-left: 50px;
    }
    .bengelHandLiNews img {
        width: 35%;
    }
    .bengelHandReNews {
        margin-top: -180px;
        margin-left: -190px;
    }
    .bengelHandReNews img {
        width: 30%;
    }
    .bengelImpressum {
        margin-top: -690px;
        margin-left: 420px;
    }
    .bengelKoerperImp img {
        width: 60%;
    }
    .bengelKopfImp {
        margin-top: -464px;
        margin-left: 40px;
    }
    .bengelKopfImp img {
        width: 40%;
    }
    .bengelHandLiImp {
        margin-top: -29px;
        margin-left: 75px;
    }
    .bengelHandLiImp img {
        width: 12%;
    }
    .bengelKopf01 {
        margin-top: -425px;
        margin-left: 83px;
    }
    .bengelKopf01 img {
        width: 100%;
    }
    .bengelKopf02 {
        margin-top: -456px;
        margin-left: 197px;
    }
    .bengelKopf02 img {
        width: 95%;
    }
    .bengelAugen01 {
        margin-top: -253px;
        margin-left: -55px;
        z-index: 5;
    }
    .bengelAugen02 {
        margin-top: -283px;
        margin-left: -70px;
    }
    .bengelAugen03 {
        margin-top: -260px;
        margin-left: 15px;
    }
    .bengelAugen01 img,
    bengelAugen02 img {
        width: 16%;
    }
    .bengelAugen03 img {
        width: 16%;
    }
    .bengelArmLi01 {
        margin-top: 45px;
        margin-left: 85px;
    }
    .bengelArmLi01 img {
        width: 30%;
    }
    .bengelHandRe01 {
        margin-top: -170px;
        margin-left: -270px;
    }
    .bengelHandRe01 img {
        width: 11%;
    }
    .bengelHandLi01 {
        margin-top: -60px;
        margin-left: -20px;
    }
    .bengelHandLi02 {
        margin-top: 55px;
        margin-left: -20px;
    }
    .bengelHandLi03 {
        margin-top: 50px;
        margin-left: 50px;
    }
    .bengelHandLi01 img,
    .bengelHandLi02 img,
    .bengelHandLi03 img {
        width: 34%;
    }
    .maischholz01 {
        margin-top: -190px;
        margin-left: -160px;
    }
    .maischholz01 img {
        width: 34%;
    }
    .maischholz02 {
        margin-top: -730px;
        margin-left: 532px;
    }
    .maischholz02 img {
        width: 80%;
    }
    .maischholz03 {
        margin-top: -715px;
        margin-left: 497px;
    }
    .maischholz03 img {
        width: 83%;
    }
    .fass {
        margin-top: -580px;
        margin-left: 556px;
    }
    .spruch01 .heading {
        font-size: 22px;
        line-height: 22px;
        font-weight: normal;
        color: #000;
    }
    .spruch01 {
        margin-top: -155px;
        margin-left: 40px;
    }
    .spruch01 .lead {
        font-family: 'ProbaPro-Reg', sans-serif;
        font-weight: 200;
        font-size: 13px;
        line-height: 14px;
        color: #000;
    }
    .spruch02 .heading {
        font-size: 22px;
        line-height: 22px;
        font-weight: normal;
        color: #000;
    }
    .spruch02 {
        margin-top: -445px;
        margin-left: 140px;
    }
    .spruch02 .lead {
        font-family: 'ProbaPro-Reg', sans-serif;
        font-weight: 200;
        font-size: 13px;
        line-height: 14px;
        color: #000;
    }
    .spruch03 .heading {
        font-size: 22px;
        line-height: 22px;
        font-weight: normal;
        color: #000;
    }
    .spruch03 {
        margin-top: -213px;
        margin-left: 80px;
    }
    .spruch03 .lead {
        font-family: 'ProbaPro-Reg', sans-serif;
        font-weight: 200;
        font-size: 13px;
        line-height: 14px;
        color: #000;
    }
    .spruch04 .heading {
        font-size: 22px;
        line-height: 22px;
        font-weight: normal;
        color: #000;
    }
    .spruch04 {
        margin-top: -213px;
        margin-left: 80px;
    }
    .spruch04 .lead {
        font-family: 'ProbaPro-Reg', sans-serif;
        font-weight: 200;
        font-size: 13px;
        line-height: 14px;
        color: #000;
    }
    .copy01 .heading {
        font-size: 22px;
        line-height: 22px
    }
    .copy01 .lead {
        font-size: 14px;
        line-height: 16px
    }
    .copy01 {
        margin-top: -495px;
        margin-left: 40px;
    }
    .copy02 {
        margin-top: -330px;
        margin-left: 40px;
    }
    .copy03 {
        margin-top: -440px;
        margin-left: 40px;
    }
    .copy04 {
        height: 240px;
        margin-top: -450px;
        margin-left: 50px;
    }
    .copy02 .heading {
        font-size: 22px;
        line-height: 22px;
    }
    .copy02 .lead {
        font-size: 13px;
        line-height: 14px;
    }
    .impSlimscroll {
        padding-right: 30px;
    }
    .copyNews .space {
        margin-top: 40px;
    }
    .impSlimscrollMd {
        padding-right: 20px;
    }
    .sprechblase01 {
        margin-top: -890px;
        margin-left: 230px;
    }
    .sprechblase01 img {
        width: 95%;
    }
    .sprechblase02 {
        margin-top: -1370px;
        margin-left: 540px;
    }
    .sprechblase02 img {
        width: 60%;
    }
    .sprechblase03 {
        margin-top: -1410px;
        margin-left: -5px;
    }
    .sprechblase03 img {
        width: 60%;
    }
    .rollo01 {
        margin-top: -1535px;
        margin-left: -10px;
    }
    .rollo02 {
        margin-top: -1610px;
        margin-left: 400px;
    }
    .rollo03 {
        margin-top: -1570px;
        margin-left: 195px;
    }
    .rolloNews {
        margin-top: -1655px;
        margin-left: 195px;
    }
    .copyNews {
        height: 410px;
        margin-top: -580px;
        margin-left: 50px;
    }
    .wolke01 {
        margin-top: -1630px;
        margin-left: -70px;
    }
    .wolke01 img {
        width: 85%;
    }
    .homeLink {
        margin-top: -780px;
        margin-left: 470px;
        width: 150px;
    }
    .homeLink img {
        width: 140px;
        height: 350px;
    }
    .homeLinkImp {
        margin-top: -800px;
        margin-left: 670px;
    }
    .homeLinkImp img {
        width: 130px;
        height: 320px;
    }
    .kontaktLink {
        margin-top: -700px;
        margin-left: 270px;
    }
    .kontaktLink img {
        width: 100px;
        height: 100px;
    }
    .storyLink {
        margin-top: -580px;
        margin-left: 250px;
    }
    .storyLink img {
        width: 160px;
        height: 160px;
    }
    .sortenLink {
        margin-top: -700px;
        margin-left: 580px;
    }
    .sortenLink img {
        width: 110px;
        height: 100px;
    }
    .modal {
        margin-top: -35px;
    }
    .modal-dialog {
        width: 800px;
    }
    .bierdeckel img {
        width: 19%;
    }
    .fensterkleber img {
        width: 49%;
    }
    .aufsteller img {
        width: 24%;
    }
    .postkarten img {
        width: 49%;
    }
}
/* sm ------- */

@media (min-width: 768px) and (max-width: 991px) {
    .ds_link {
        font-size: 10px;
        line-height: 12px;
        letter-spacing: 1.1px;
    }
    .datenschutz {
        margin-top: -850px;
        margin-left: 535px;
        z-index: 100;
    }
    .datenschutz_zutaten {
        position: absolute;
        margin-top: -850px;
        margin-left: 110px;
        z-index: 4;
    }
    .stoerer_werbung {
        margin-top: -750px;
        margin-left: 610px;
    }
    .stoerer_werbung img {
        width: 110px;
    }
    .bretter {
        margin-top: -30px;
    }
    .kachel1 {
        margin-top: -1098px;
        margin-left: -280px;
    }
    .kachel2 {
        margin-top: -1103px;
        margin-left: 721px;
    }
    .tisch {
        margin-top: -480px;
        margin-left: 150px;
    }
    .glocke {
        margin-top: -760px;
        margin-left: 525px;
    }
    .glocke01 {
        margin-top: 0px;
        margin-left: 0px;
    }
    .glocke01 img {
        width: 45%;
    }
    .glocke02 {
        margin-top: -13px;
        margin-left: 0px;
    }
    .glocke02 img {
        width: 18%;
    }
    .hopfen {
        margin-top: -505px;
        margin-left: 130px;
    }
    .phone {
        margin-top: -525px;
        margin-left: 200px;
    }
    .phone1 {
        position: relative;
        margin-top: 0px;
        margin-left: 0px;
    }
    .phone2 {
        margin-top: -66px;
    }
    .bierglaeser {
        margin-top: -470px;
        margin-left: 440px;
    }
    .bierglas01 {
        margin-top: -45px;
        margin-left: -60px;
    }
    .bierglas01 img {
        width: 30%;
    }
    .bierglas02 {
        margin-top: -54px;
        margin-left: -12px;
    }
    .bierglas02 img {
        width: 30%;
    }
    .bierglas03 {
        margin-top: -45px;
        margin-left: 37px;
    }
    .bierglas03 img {
        width: 45%;
    }
    .bierglas04 {
        margin-top: -60px;
        margin-left: -60px;
    }
    .bierglas04 img {
        width: 30%;
    }
    .bierglas05 {
        margin-top: -47px;
        margin-left: 0px;
    }
    .bierglas05 img {
        width: 30%;
    }
    .bierglas06 {
        margin-top: -38px;
        margin-left: 40px;
    }
    .bierglas06 img {
        width: 45%;
    }
    .bilderrahmen {
        margin-top: -445px;
        margin-left: 180px;
    }
    .buecher {
        margin-top: -280px;
        margin-left: 511px;
    }
    .buecher img {
        width: 45%;
    }
    .buecher01 {
        margin-top: -110px;
        margin-left: -35px;
    }
    .buch01 {
        margin-top: -87px;
        margin-left: -40px;
    }
    .bengel {
        margin-top: -634px;
        margin-left: 316px;
    }
    .bengel02 {
        margin-top: -550px;
        margin-left: 270px;
    }
    .bengel03 {
        margin-top: -667px;
        margin-left: 311px;
    }
    .bengel04 {
        margin-top: -560px;
        margin-left: 60px;
    }
    .bengel05 {
        margin-top: -650px;
        margin-left: 205px;
    }
    .bengelKoerper02 img {
        width: 75%;
    }
    .bengelKoerper04 img {
        width: 90%;
    }
    .bengelKoerper05 img {
        width: 90%;
    }
    .bengelNews {
        margin-top: -480px;
        margin-left: 420px;
    }
    .bengelKoerperNews img {
        width: 60%;
    }
    .bengelKopfNews {
        margin-top: -352px;
        margin-left: 75px;
    }
    .bengelHandLiNews {
        margin-top: 7px;
        margin-left: 30px;
    }
    .bengelHandLiNews img {
        width: 35%;
    }
    .bengelHandReNews {
        margin-top: -140px;
        margin-left: -140px;
    }
    .bengelHandReNews img {
        width: 30%;
    }
    .bengelImpressum {
        margin-top: -510px;
        margin-left: 310px;
    }
    .bengelKoerperImp img {
        width: 55%;
    }
    .bengelKopfImp {
        margin-top: -324px;
        margin-left: 29px;
    }
    .bengelKopfImp img {
        width: 37%;
    }
    .bengelHandLiImp {
        margin-top: -19px;
        margin-left: 55px;
    }
    .bengelHandLiImp img {
        width: 10%;
    }
    .bengelKopf01 {
        margin-top: -312px;
        margin-left: 60px;
    }
    .bengelKopf01 img {
        width: 100%;
    }
    .bengelKopf02 {
        margin-top: -334px;
        margin-left: 148px;
    }
    .bengelKopf02 img {
        width: 90%;
    }
    .bengelAugen01 {
        margin-top: -188px;
        margin-left: -42px;
    }
    .bengelAugen02 {
        margin-top: -210px;
        margin-left: -52px;
    }
    .bengelAugen03 {
        margin-top: -194px;
        margin-left: 15px;
    }
    .bengelAugen01 img,
    .bengelAugen02 img,
    .bengelAugen03 img {
        width: 16%;
    }
    .bengelArmLi01 {
        margin-top: 35px;
        margin-left: 58px;
    }
    .bengelArmLi01 img {
        width: 30%;
    }
    .bengelHandRe01 {
        margin-top: -125px;
        margin-left: -195px;
    }
    .bengelHandRe01 img {
        width: 12%;
    }
    .bengelHandLi01 {
        margin-top: -40px;
        margin-left: -20px;
    }
    .bengelHandLi02 {
        margin-top: 50px;
        margin-left: -20px;
    }
    .bengelHandLi03 {
        margin-top: 40px;
        margin-left: 40px;
    }
    .bengelHandLi01 img,
    .bengelHandLi02 img,
    .bengelHandLi03 img {
        width: 30%;
    }
    .maischholz01 {
        margin-top: -140px;
        margin-left: -120px;
    }
    .maischholz01 img {
        width: 34%;
    }
    .maischholz02 {
        margin-top: -545px;
        margin-left: 408px;
    }
    .maischholz02 img {
        width: 80%;
    }
    .maischholz03 {
        margin-top: -540px;
        margin-left: 384px;
    }
    .maischholz03 img {
        width: 84%;
    }
    .fass {
        margin-top: -439px;
        margin-left: 430px;
    }
    .spruch01 .heading {
        font-size: 20px;
        line-height: 20px;
    }
    .spruch01 {
        margin-top: -145px;
        margin-left: 45px;
    }
    .spruch01 .lead {
        font-size: 12px;
        line-height: 13px;
    }
    .spruch02 {
        margin-top: -200px;
        margin-left: 200px;
    }
    .spruch03 {
        margin-top: -215px;
        margin-left: 85px;
    }
    .spruch04 {
        margin-top: -190px;
        margin-left: 85px;
    }
    .spruch02 .heading,
    .spruch03 .heading,
    .spruch04 .heading,
    .copy01 .heading,
    .copy03 .heading,
    .copy04 .heading,
    .copyNews .heading {
        font-size: 20px;
        line-height: 20px;
    }
    .spruch02 .lead,
    .spruch03 .lead,
    .spruch04 .lead,
    .copy01 .lead,
    .copy04 .lead,
    .copyNews .lead {
        font-size: 13px;
        line-height: 14px;
    }
    .copyNews .impHeading {
        font-size: 13px;
        line-height: 15px;
    }
    .copy03 .lead {
        font-size: 12px;
        line-height: 14px;
    }
    .copy01 .heading {
        font-size: 16px;
        line-height: 18px
    }
    .copy01 .lead {
        font-size: 11px;
        line-height: 13px
    }
    .slimscroll {
        padding-right: 20px;
    }
    .copy01 {
        margin-top: -390px;
        margin-left: 20px;
    }
    .copy02 {
        margin-top: -310px;
        margin-left: 14px;
    }
    .copy03 {
        margin-top: -350px;
        margin-left: 20px;
    }
    .copy04 {
        height: 190px;
        margin-top: -370px;
        margin-left: 20px;
    }
    .copy02 .heading {
        font-size: 22px;
        line-height: 22px;
    }
    .copy02 .lead {
        font-size: 13px;
        line-height: 14px;
    }
    .copyNews .space {
        margin-top: 30px;
    }
    .impSlimscrollSm {
        padding-right: 20px;
    }
    .sprechblase01 {
        margin-top: -690px;
        margin-left: 140px;
    }
    .sprechblase01 img {
        width: 90%;
    }
    .sprechblase02 {
        margin-top: -1190px;
        margin-left: 400px;
    }
    .sprechblase02 img {
        width: 55%;
    }
    .sprechblase03 {
        margin-top: -1200px;
        margin-left: -35px;
    }
    .sprechblase03 img {
        width: 50%;
    }
    .rollo01 {
        margin-top: -1275px;
        margin-left: -10px;
    }
    .rollo02 {
        margin-top: -1260px;
        margin-left: 300px;
    }
    .rollo03 {
        margin-top: -1285px;
        margin-left: 149px;
    }
    .rolloNews {
        margin-top: -1400px;
        margin-left: 150px;
    }
    .copyNews {
        height: 310px;
        margin-top: -450px;
        margin-left: 20px;
    }
    .wolke01 {
        margin-top: -1370px;
        margin-left: -160px;
    }
    .wolke01 img {
        width: 65%;
    }
    .homeLink {
        margin-top: -580px;
        margin-left: 360px;
    }
    .homeLink img {
        width: 100px;
        height: 250px;
    }
    .homeLinkImp {
        margin-top: -590px;
        margin-left: 500px;
    }
    .homeLinkImp img {
        width: 100px;
        height: 220px;
    }
    .kontaktLink {
        margin-top: -530px;
        margin-left: 220px;
    }
    .kontaktLink img {
        width: 70px;
        height: 70px;
    }
    .storyLink {
        margin-top: -450px;
        margin-left: 200px;
    }
    .storyLink img {
        width: 120px;
        height: 120px;
    }
    .sortenLink {
        margin-top: -530px;
        margin-left: 440px;
    }
    .sortenLink img {
        width: 80px;
        height: 70px;
    }
    .modal {
        margin-top: -35px;
    }
    .modal-dialog {
        width: 680px;
    }
}
/* xs ------- */

@media (max-width: 767px) {
    body {
        background-color: #fff;
    }
    .heading {
        font-size: 24px;
        line-height: 26px;
    }
    .lead {
        font-size: 14px;
        line-height: 18px;
    }
    .copyNewsSpace {
        margin-top: 60px;
    }
    .space30 {
        margin-top: 30px;
    }
}