@media (max-width: 1919px) {
    #dankeabschluss{
        margin: -1px auto auto 0;
        width: 100%;
        background-color: #027145;
        height: calc(99.9vh - 55vw);
    }
}


@media (max-width: 1680px) {
    html {
        font-size: 9px;
        line-height: 125%;
    }

    h1 {
        line-height: 105%;
        font-size: 3.2vw;
    }

    h2 {
        font-size: 2.5vw;
        line-height: 115%;
    }

    #dancer1 {
        bottom: -12vw;
        max-width: 32vw;
        left: -2vw;
    }

    #dancer2 {
        right: 2vw;
        bottom: 8vw;
        max-width: 28vw;
    }
}


@media (max-width: 1600px) {
    #zitrone1 {
        right: 0;
        top: 50px;
        width: 13vw;
    }

    #mandarine1 {
        left: 0;
        bottom: -88px;
        width: 14vw;
    }

    #mandarine2 {
        position: absolute;
        right: 0;
        top: 0px;
        width: 13.7vw;
    }

    #zitrone2 {
        position: absolute;
        left: 0;
        bottom: 210px;
        width: 13vw;
    }
}


@media (max-width: 1420px) {
    /*#sogehtsrow {
        padding: 10vw 8% 6vw 8%;
    }*/
    .stepsnr {
        position: absolute;
        width: 5.5vw;
    }

    .stepsnr#nr1 {
        top: 16%;
        left: -1.7%;
    }

    .stepsnr#nr2 {
        left: 7%;
        bottom: -8%;
    }

    .stepsnr#nr3 {
        top: 20%;
        right: 5%;
    }

    #step1_bubbles {
        width: 7.5vw;
        left: -10.4%;
        bottom: 11%;
    }

    #step3_bubbles {
        width: 7.5vw;
        right: -19.7%;
        bottom: -6%;
    }

    p#sogehtsinfos {
        max-width: 80%;
    }
}


@media (max-width: 1320px) {

    body {
        font-size: 19px;
        line-height: 135%;
    }

    #footer .trenner {
        display: none;
    }

    #footer a {
        display: block;
        float: none;
        text-align: right;
        padding: 5px 15px;
        margin: 2px 0;
    }

    #footer #footernavlist a {
        display: block;
        float: none;
        text-align: left;
        padding: 5px 15px;
        margin: 2px 0;
    }

    #zitrone1 {
        right: 0;
        top: 260px;
        width: 13vw;
    }

    #step2col svg {
        max-width: 12vw
    }

    #step3col svg {
        max-width: 9.8vw
    }
}


@media (max-width: 1280px) {
    h1 {
        line-height: 105%;
        font-size: 38px;
    }

    h2 {
        font-size: 28px;
        line-height: 115%;
    }
}

@media (max-width: 1120px) {
    #steprow {
        bottom: 22%;
    }

    p.steps_text {
        margin-top: -12px;
    }
}


@media (max-width: 1100px) {
    .smallcol {
        padding-left: 4%;
        padding-right: 4%;
    }

    ul#mainnav li.textlink a {
        padding: 10px 11px 4px 11px;
        font-size: 16px;
        line-height: 110%;
    }

    /*    #mitmachenrow {
            background-image: url(../img/bz/hg_teilnahme.jpg);
            background-repeat: no-repeat;
            background-position: center top;
            background-size: 125% 100%;
        }*/
    #produkteinner {
        height: 60vw;
        transform: scale(0.8);
    }

    #pfeillinks {
        left: calc(50% - 33vw);
    }

    #pfeilrechts {
        right: calc(50% - 33vw);
    }
}


@media (max-width: 991px) {
    #inforow .col-xs-12{
        padding: 0 8% 1% 8%;
    }
    #steprow {
        background: #027145;
        position: static;
        background-image: url(../img/25/bizzl_studis_steps_mobile_bottom.jpg);
        background-repeat: no-repeat;
        background-position: center 100.5%;
        background-size: 100%;
        padding: 20px 0 100px 0;
        top: -130px;
        left: 0;
        margin-bottom: 80px;
    }


    .stepsimg {
        display: inline-block;
        margin: 4rem auto 0px auto;
        width: 210px;
        max-width: 80%;
    }

    .stepsnr#nr1 {
        width: 60px;
        top: 6%;
        left: calc(50% - 130px);
    }

    .stepsnr#nr2 {
        width: 60px;
        top: 6%;
        left: calc(50% - 130px);
    }

    .stepsnr#nr3 {
        width: 60px;
        top: 6%;
        left: calc(50% - 130px);
        right: auto;
    }

    #step1_bubbles {
        width: 83px;
        left: calc(50% - 179px);
        bottom: 11%;
    }

    #step3_bubbles {
        width: 77px;
        right: calc(50% - 174px);
        bottom: 9%;
    }

    p#sogehtsinfos {
        margin: 8% 0 9% 0;
        display: inline-block;
        max-width: 965px;
        font-size: 15px;
        line-height: 122%;
    }
    p.steps_text {
        margin: 0 auto 3rem auto;
    }
    #step2col svg {
        max-width: 16vw
    }

    #step3col svg {
        max-width: 12.8vw
    }
    #dancer1 {
        bottom: -4vw;
        max-width: 38vw;
        left: -2vw;
    }


    .bubble-wrap {
        width: 620px;
        max-width: 40.29vw;
        position: absolute;
        left: 56%;
        bottom: 2%;
        background: url(../img/bubble_versuch1.png) top center no-repeat;
        background-size: 100%;
        padding: 4.9% 0% 15% 2.5%;
        aspect-ratio: 1 / 1;
    }
    #teaserbubblewrap h3 {
        font-size: 3vw;
        line-height: 105%;
        margin-bottom: 1.042vw;
        margin-top: 4vw;
    }
    #teaserbubblewrap p {
        font-size: 1.45vw;
        line-height: 138%;
    }
}

/* 991 */


@media (max-width: 880px) {
    ul#mainnav li#logoinnavbar {
        width: 113px;
    }

    ul#mainnav li.textlink a {
        padding: 10px 9px 4px 9px;
        font-size: 15px;
        line-height: 110%;
    }

    #chartholder {
        margin: 0 auto 100px 29%;
    }

    #mandarine2 {
        top: 166px;
    }
}


@media (max-width: 767px) {
    #topcol {
        margin-bottom: 0 !important;
    }

    .bubble-wrap {
        width: 92%;
        max-width: 92%;
        padding: 19% 0% 30% 6%;
        position: absolute;
        top: calc(79px + 2.7vw);
        left: 4%;
        height: 110vw;
    }


    #bubble-img-mobile {
        position: absolute;
        top: 101vw;

    }

    #teaserbubblewrap h3 {
        font-size: 5.9vw;
        line-height: 105%;
        margin-bottom: 2vw;
    }

    #teaserbubblewrap h3 br {
        display: none;
    }

    #teaserbubblewrap p {
        font-size: 3.375vw;
        line-height: 121%;
    }
    #dankeabschluss {
        display: none;
    }

    h2 {
        font-size: 3.8vw;
        line-height: 115%;
    }

    #footer {
        padding: 4rem 4% 4rem 4%;
    }

    body {
        font-size: 16px;
        line-height: 135%;
    }

    .langtext li, .langtext p {
        font-size: 16px;
    }

    .size19, p.size19 {
        font-size: 16px
    }


    .mt1rem {
        margin-top: 0.4rem;
    }


    .mb6rem {
        margin-bottom: 3rem;
    }

    .mt4rem {
        margin-top: 2rem;
    }

    .mt6rem {
        margin-top: 3rem;
    }


    .mb8rem {
        margin-bottom: 4rem;
    }

    #zitrone1 {
        right: 0;
        top: 311px;
        width: 14vw;
    }

    #produkterow {
        margin: 7vw auto 2vw auto;
    }

    #produkteouter {
        margin: 1vw auto 0 auto;
        height: 471px;
    }

    #produkteinner {
        height: 50vw;
        transform: scale(0.7);
    }

    #pfeillinks {
        left: calc(50% - 322px);
    }

    #pfeilrechts {
        right: calc(50% - 322px);
    }

    p#linktozuckerfrei {
        transform: translateY(13px);
    }

    #mandarine1 {
        left: 0;
        bottom: -4vw;
        width: 15vw;
    }

    #sogehtsrow {
        background: url(../img/24/hg_sogehts.jpg) no-repeat center top;
        background-size: 1110px 100%;
    }

    .sogehtscol img {
        margin-top: 2rem;
    }

    #sogehtsrow p {
        padding-top: 13px;
    }

    .mb10rem {
        margin-bottom: 0rem;
    }

    #mainbubble {
        max-width: 57vw;
        transform: translateX(5%);
    }

    #teaser_flaschen {
        left: 0.5%;
    }

    #teaser_mandarine {
        max-width: 13.31vw;
        top: 57.3%;
        right: 9.4%;
    }

    #mobile-bg {
        width: 100%;
        background: #027145;
        display: block;
        position: absolute;
        /*top: 33px;*/
        top: 0;
        height: 42px;
        z-index: 1;
    }


    .showxs {
        display: inline-block;
    }

    #keyvisual {
        width: 100vw;
        max-width: 100%;
        transform: translateX(0vw);
    }


    #navrow {
        min-height: 79px;
        position: fixed;
        top: 0;
        background-color: transparent;
        display: block;
        width: 100%;
    }

    .navbar-default .navbar-toggle .icon-bar {
        height: 7px;
        width: 32px;
        margin-bottom: 5px;
        background-color: #006e48;;
        margin-left: 12px;
    }

    #navlogo {
        display: none;
    }

    #navlogoMobil {
        position: absolute;
        right: 20px;
        top: 5px;
        width: 80px;
        z-index: 100;
        display: block;
    }

    #navrow .navbar-default .navbar-collapse {
        box-shadow: none;
        background: #006e48;
        width: 100%;
        padding: 60px 10px 16px 10px;
        transform: translateY(-24px);
        margin-top: 60px;
    }

    ul#mainnav {
        padding: 0px 0 7px 0;
        transform: translateX(0);
    }

    ul#mainnav li.textlink {
        display: block;
        float: none;
        width: 100%;
        text-align: center;
        margin: 8px auto;
    }

    ul#mainnav li.textlink a {
        padding: 7px 12px 7px 12px;
        font-size: 24px;
        line-height: 110%;
        color: #fff;
        font-weight: 700;
    }

    ul#mainnav li.textlink a:hover {
        color: #fff;
    }

    .start #navrow, .switcher #navrow, .impressum #navrow, .faq #navrow, .datenschutz #navrow, .tnb #navrow, .danke #navrow, .ds #navrow {
        margin: 0;
    }


    #inforow .col-xs-12 {
        padding: 0 5%;
    }




    .navbar-default .navbar-toggle {
        background-image: url("../img/mobile_nav_closed.svg");
        height: 24px;
        width: 24px;
        content: '';
        left: 11px;
        top: 8px;
        position: absolute;
        z-index: 40;
        padding: 0;
        margin: 0;
        border: 0;
        border-radius: 0;
    }

    .navopen .navbar-default .navbar-toggle {
        background-image: url("../img/mobile_nav_opened.svg");
    }


    body.start p,
    body.start p.text-left,
    body.start h1.text-left,
    body.start h2.text-left {
        text-align: center !important;
    }


    #footer a {
        display: block;
        text-align: center !important;
    }

    #chartholder {
        margin-left: calc(50% - 150px);
    }

    #zitrone2 {
        bottom: 28px;
    }


    #mitmachenrow h1 {
        margin-top: 7vw;
    }

    #kassenbonrow label#lblbon {
        font-size: 16px;
    }

    label {
        font-size: 14px;
    }

    .size15, p.size15 {
        font-size: 1.1rem;

    }

    .slot-section {
        padding-top: 140px;
    }

    .wave-text {
        top: 10%;
        bottom: auto;
        left: 10%;
        right: 10%;
        width: 80%;

    }

    .bizzl-button {
        padding: 20px 10px;
    }



/*    .bubble-wrap {
        max-width: 40.29vw;
        left: 56%;
        bottom: 2%;
        background: url(../img/bubble_versuch1.png) top center no-repeat;
        background-size: 100%;
        padding: 4.9% 0% 15% 2.5%;
        aspect-ratio: 1 / 1;
    }
    #teaserbubblewrap h3 {
        font-size: 3vw;
        line-height: 105%;
        margin-bottom: 1.042vw;
        margin-top: 4vw;
    }
    #teaserbubblewrap p {
        font-size: 1.45vw;
        line-height: 138%;
    }*/

}

/* 767 */


@media (max-width: 680px) {
    #produkterow {
        margin: 7vw auto 1vw auto;
        z-index: 200;
        position: relative;
    }

    #mandarine1 {
        bottom: -11vw;
        width: 15vw;
    }

    #produkteouter {
        margin: 1vw auto 0 auto;
        height: 471px;
        overflow: hidden;
        max-width: 100%;
    }

    #produkteinner {
        height: 50vw;
        transform: scale(0.55);
    }

    #pfeillinks {
        left: calc(50% - 179px);
        bottom: 8%;
        width: 32px;
    }

    #pfeilrechts {
        right: calc(50% - 179px);
        bottom: 8%;
        width: 32px;
    }

    p#linktozuckerfrei {
        transform: translateY(13px);
    }

    p#sogehtsinfos {
        margin: 8% 0 14% 0;
    }
}




@media (max-width: 640px) {

    #kvcol img,
    #kvcol picture{
        width: 100%;
    }

    #inforow h2 br {
        display: none;
    }

    .teaser h2 {
        font-size: 24px;
        line-height: 115%;
    }
}


@media (max-width: 610px) {
    #mitmachenrow h1 br {
        display: none;
    }

    #chartholder {
        width: 138px;
        height: 138px;
        margin-bottom: 13vw;
    }


    p#chartline1 {
        font-size: 13px;
        line-height: 115%;
    }

    p#chartline2 {
        font-size: 28px;
        line-height: 135%;
    }

    p#chartline3 {
        font-size: 13px;
        line-height: 115%;
        min-width: 130px; /* wegen firefox umbrüchen im wort */
    }

    #chartblubber {
        width: 43px;
        right: -30px;
        top: -9px;
    }

    #stoerer {
        width: 120px;
        left: 100%;
        bottom: auto;
        top: -45px;

    }
}


@media (max-width: 560px) {
    #mandarine1,
    #mandarine2,
    #zitrone1,
    #zitrone2 {
        display: none;
    }

    h1 {
        line-height: 105%;
        font-size: 35px;
    }

    h2 {
        font-size: 24px;
        line-height: 115%;
    }

    h3 {
        font-size: 26px;
        line-height: 105%;
        font-weight: 900;
    }

    #mitmachenrow h2 {
        margin: 17vw auto 3vw auto;
        margin-top: calc(6vw + 80px);
    }

    /*
        #navrow .navbar-default .navbar-collapse {
            box-shadow: none;
            background: #fff7d0 url(../img/bz/verlauf.jpg) no-repeat center top;
            background-size: 100% 100%;
            width: 92%;
            margin: 0 auto 0 auto;
            border: 5px solid #fff;
            border-radius: 16px;
            padding: 20px 0px 16px 0px;
            transform: translateY(-24px);
        }*/
}


@media (max-width: 480px) {
    ul#mainnav li.textlink a {
        padding: 4px 12px 4px 12px;
        font-size: 20px;
        line-height: 110%;
    }

    .actionbutton {
        padding: 19px 8vw 21px 8vw;
    }

    #cta1 {
        padding: 15px 12vw 15px 12vw;
    }

    h1 {
        line-height: 105%;
        font-size: 30px;
    }

    h2 {
        font-size: 24px;
        line-height: 115%;
    }

    h3 {
        font-size: 22px;
        line-height: 105%;
        font-weight: 900;
    }

    #pfeillinks {
        left: calc(50% - 70px);
        bottom: 8%;
        width: 28px;
    }

    #pfeilrechts {
        right: calc(50% - 70px);
        bottom: 8%;
        width: 28px;
    }

    #sogehtsrow h1 {
        margin-top: 80px;
    }

    p#sogehtsinfos {
        margin: 8% 0 23% 0;
        font-size: 14px;
        line-height: 113%;
    }

    #chartholder {
        margin-left: calc(50% - 121px);
    }
    #dancer1 {
        bottom: -4vw;
        max-width: 65vw;
        left: -2vw;
    }
    .langtext h3 {
        color: #006e48;
        font-size: 2.1rem;
        line-height: 125%;
        font-weight: 700;
        margin-top: 2.9rem;
    }


    #mainbubble {
        max-width: 99vw;
        transform: translateX(7%);
        left: 20%;
    }

    #teaser_mandarine,
    #teaser_zitrone {
        display: none;
    }
}

@media (max-width: 767px) {
    .schoen-section {

        margin-top: 0%;

    }

    #inforow h1 {
        hyphens: none;
    }

    p.steps_text {
        margin: -1px auto 3rem auto;
    }
    #steprow > div {
        margin-bottom: 1.7vw;
    }
    #step2col svg {
        width: 160px;
        max-width: 40vw;
    }
    #step3col svg {
        width: 140px;
        max-width: 35vw;
    }

    body.danke h3 {
        max-width: 60%;
        margin-left: 20%;
    }

}