@media screen and ( max-width: 1000px) {
    .getit #content ul li .info form>.r>.rt>.col {
        float: left;
        width: 100%;
    }
    .getit #content ul li .info form>.r>.rt>.col.button {
        height: 45px;
    }
}

@media screen and ( max-width: 900px) {
    #header,
    #header .center>.r {
        height: 92px;
    }
    #header #logo {
        width: 400px;
        height: 46px;
        background-size: contain;
        background-repeat: no-repeat;
    }
}

@media screen and ( max-width: 768px) {
    .home #content .teaser2>.align>.rt>.col {
        float: left;
        width: 100%;
    }
    .home #content .teaser2>.align>.rt>.col+.col {
        margin-top: 10px;
    }
    .home #content .features .col {
        float: left;
        width: 100%;
    }
    .home #content .features .col1>span+span,
    .home #content .features .col2>span+span {
        display: none;
    }
    .home #content .features .col3 {
        padding-bottom: 28px;
    }
    .home #content .features .flex {
        flex-wrap: wrap;
    }
    .home #content .features .flex>div {
        flex-basis: 100%;
    }
    .home #content .features .flex+.flex div+div {
        margin-top: 10px;
    }
    /* */
    .home #content .teaser .text h3,
    #popup2 .content .text h3 {
        font-size: 18px;
        line-height: 18px;
    }
    .home #content .teaser .text .preview,
    .home #content .teaser .text .full,
    #popup2 .content .text .preview,
    #popup2 .content .text .full {
        font-size: 12px;
        line-height: 16.5px;
    }
    .home #content .teaser .text .more,
    .home #content .teaser .text .less,
    #popup2 .content .text .more,
    #popup2 .content .text .less {
        font-size: 11px;
        background-size: 7px 7px;
        background-position: right 4px;
    }
    /* */
    ul.triple li {
        width: 50%;
    }
    .isadora #content .teaser1 h2 {
        margin-bottom: 7px;
    }
    .isadora #content .teaser1>.align>.rt>.col {
        float: left;
        width: 100%;
    }
    .isadora #content .werkstatt>.align>.rt>.col {
        float: left;
        width: 100%;
    }
    .isadora #content .teaser2>.align>.rt>.col {
        float: left;
        width: 100%;
    }
    .isadora #content .teaser2>.align>.rt>.col+.col {
        margin-top: 33px;
    }
    .isadora #content .features .col {
        float: left;
        width: 100%;
    }
    .isadora #content .features .col1>span+span,
    .isadora #content .features .col2>span+span {
        display: none;
    }
    .isadora #content .features .col3 {
        padding-bottom: 28px;
    }
    .getit #content>.center>.align>.rt>.col {
        float: left;
        width: 100%;
    }
    .getit #content>.center>.align>.rt>.col+.col {
        margin-top: 55px;
    }
    .getit #content .col2 .rt .col2 {
        width: 26%;
    }
    .welcome a.start {
        margin-left: -150px;
        margin-top: -45px;
        width: 300px;
        height: 92px;
        background-size: cover;
    }
    /* */
    .workshop #content .teaser .r.teaser .flex {
        display: block;
    }
    .workshop #content .teaser .r.teaser .flex .col {
        float: left;
        width: 100%;
    }
    .workshop #content .teaser .r.teaser .flex .col+.col {
        margin-top: 15px;
    }
    /* */
    #footer .center {
        display: none;
    }
}

@media screen and ( max-width: 800px) {
    #header,
    #header .center>.r {
        height: 66px;
    }
    #header #logo {
        width: 200px;
    }
    #header .navigation {
        display: none;
        width: 100%;
        z-index: 100;
        bottom: inherit;
        top: 60px;
        background: #ffffff;
    }
    .navigation-show #header .navigation {
        display: block;
    }
    #header .navigation li {
        float: left;
        width: 100%;
    }
    #header .navigation li a {
        float: left;
        display: block;
        height: auto;
        width: auto !important;
        padding-left: 0px !important;
        padding-right: 8px;
        font-size: 31px;
        line-height: 41px;
        text-align: left !important;
    }
    #header .navigation li+li+li+li+li+li+li {
        display: block;
    }
    #header .navigation li:last-child a {
        margin-bottom: -8px;
        padding-bottom: 8px;
        background: #ffffff;
    }
    #header .marker {
        display: none;
    }
    #header a.button {
        display: block;
    }
    #header ul.meta {
        display: none;
    }
    #header .state {
        display: block;
    }
    .navigation-show #header .state {
        display: none;
    }
}

@media screen and ( max-width: 640px) {
    #popup .content .img .info {
        width: 100%;
        top: -72px;
    }
}

@media screen and ( max-width: 568px) {
    ul.triple li {
        width: 100%;
    }
}

@media screen and ( max-width: 400px) {
    body {
        padding-left: 0px;
        padding-right: 0px;
    }
    #header .navigation li a {
        padding-left: 9px !important;
    }
    .welcome a.start {
        margin-left: -100px;
        margin-top: -30px;
        width: 200px;
        height: 61px;
        background-size: cover;
    }
    .getit #content .col1 .rt .col2,
    .getit #content .col2 .rt .col2 {
        display: none;
    }
    #popup>span {
        display: none;
    }
}