@media (max-width: 767px) {
    /* Required to query Viewpoints from js */
    body:before {
        content: "xs";
    }

    div.topbar .header-topnav li {
        margin-right: 0;
        margin-left: 0;
    }

    div.topbar div#topbar.topbar-collapse {
        width: 100%;
    }

    #breadCrumbsContainer .indikator {
        margin-top: 5px;
        font-size: 2vw;
        line-height: 2.5vw;
    }

    .shopProductAnsicht .item-detail h1 {
        font-size: 6vw;
    }

    .shopPaymentMethodAnsicht h1,
    .shopMeinkontoOverviewAnsicht h1,
    .shopRegisterAnsicht h1,
    .shopLoginAnsicht h1,
    .shopCheckoutAnsicht h1,
    .shopPayAnsicht h1,
    .shopMeinkontoOrderDetailsAnsicht h1,
    .shopMeinkontoDataAnsicht h1,
    .filterPreset-description h1,
    .seitenEintrag h1 {
        font-size: 5vw;
    }

    #checkout-summary > .row > div,
    .shopPayAnsicht > .row > div,
    #customerDataForm > .row > div,
    #paymentMethodForm > div,
    .myaccount .row > div,
    .item-detail .row > div,
    #shippingAddressForm > div {
        padding: 0;
    }

    #checkout-steps {
        margin-bottom: 0;
    }

    #checkout-steps ul.names {
        position: absolute;
        left: 0;
        width: 100%;
        margin-top: -103px;
    }

    #checkout-steps ul.names li.step {
        display: block;
        width: 80%;
        text-align: center;
        position: relative;
        left: calc(6% + 20px);
        margin: 5px 0 0 0!important;
    }

    #checkout-steps ul.bullets {
        height: 58px;
        width: 2px;
    }

    #checkout-steps ul.bullets li.step {
        left: 0;
        margin: 0 0 7px -4px;
        width: 10px;
        height: 10px;
    }

    #checkout-steps ul.bullets li.step_1 {
        margin-top: 2px;
    }

    #shoppingCartHeadline a {
        font-size: 0.75em;
        line-height: 2em;
    }

    .table-shoppingCart-itemList .shoppingCart-item label,
    #checkout-summary-itemList tbody tr label,
    .orders .items .itemlist-small tbody tr label {
        font-size: 8px;
        display: block;
    }

    .table-shoppingCart-itemList .shoppingCart-item td,
    #checkout-summary-itemList td,
    .orders .items .itemlist-small td {
        width: 100%;
        text-align: center;
    }

    .table-shoppingCart-itemList .shoppingCart-item .image,
    .table-shoppingCart-itemList .shoppingCart-item .title,
    #checkout-summary-itemList tbody tr .image,
    #checkout-summary-itemList tbody tr .itemTitle,
    .orders .items .itemlist-small tbody tr .image,
    .orders .items .itemlist-small tbody tr .itemTitle {
        display: table;
    }

    .table-shoppingCart-itemList .shoppingCart-item .image,
    #checkout-summary-itemList tr .image,
    .orders .items .itemlist-small tr .image {
        width: 35vw;
        margin: 0 auto;
    }

    .table-shoppingCart-itemList .shoppingCart-item .title ,
    #checkout-summary-itemList tr .itemTitle,
    .orders .items .itemlist-small tr .itemTitle  {
        margin: 8px 0;
    }

    .table-shoppingCart-itemList .shoppingCart-item .title a,
    #checkout-summary-itemList tr .itemTitle a{
        margin: 4px;
    }

    .table-shoppingCart-itemList .shoppingCart-item .quantity,
    #checkout-summary-itemList .quantity {
        display: table-cell;
    }

    .table-shoppingCart-itemList .shoppingCart-item .listpricePerUnit,
    .table-shoppingCart-itemList .shoppingCart-item .totalPrice,
    #checkout-summary-itemList tbody tr .pricePerUnit,
    #checkout-summary-itemList tbody tr .total,
    .orders .items .itemlist-small tbody tr .pricePerUnit,
    .orders .items .itemlist-small tbody tr .total {
        display: block;
        margin: 0;
        white-space: nowrap;
    }

    .table-shoppingCart-itemList .shoppingCart-item .quantity a,
    #checkout-summary-itemList tbody tr .quantity a {
        display: block;
    }

    .table-shoppingCart-itemList .shoppingCart-item .delete {
        text-align: right;
        width: 30px;
    }

    .table-shoppingCart-itemList .shoppingCart-item .listpricePerUnit,
    #checkout-summary-itemList tbody tr .pricePerUnit,
    .orders .items .itemlist-small tbody tr .pricePerUnit {
        margin-top: 70%;
    }

    .table-shoppingCart-itemList .shoppingCart-item .totalPrice,
    #checkout-summary-itemList tbody tr .total,
    .orders .items .itemlist-small tbody tr .total {
        margin-bottom: 70%;
    }

    .shopMeinkontoOverviewAnsicht .box,
    .myaccount .orders .infos,
    .myaccount .orders .status,
    .myaccount .orders .shipping,
    .myaccount .orders .items,
    .myaccount .orders .rating {
        padding: 15px;
    }

    #container_klarnaPayNow,
    #container_klarnaPayLater,
    #container_klarnaPayOverTime {
        width: auto;
        max-width: 400px;
    }

    .notifyWhenAvailable .btn {
        width: auto;
        padding: 1em 4px;
        font-size: 0.65em;
    }

    #itemlist-filter .filter-header {
        font-size: 4vw;
    }

    #filterChevron {
        display: inline;
        font-size: 4vw;
    }

    .renderBanner .renderItems-1 .renderItem {
        left: 10px;
        width: 94%;
        height: 12%;
        top: 5vw;
    }

    #renderItem-1 .title {
        border-top: 1px solid #fff;
        border-bottom: 1px solid #fff;
        color: #fff;
        padding: 5px 0;
        display: inline;
        font-size: 1.5em;
    }

    .renderBanner .renderItems-1 .renderItem .itemTitle {
        text-align: right;
        left: auto;
        top: 10vw;
        position: absolute;
        right: 0;
        border: none;
        width: 100%;
        line-height: 1.1em;
    }

    .renderBanner .renderItems-1 .renderItem .itemPrice {

    }

    .renderBanner .renderItems-1 .btn-goToOffer {
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background: none;
        color: transparent;
    }

    .renderBanner .renderItems-1 .renderItem .itemPrice {
        display: none;
    }

    .renderBanner .renderItems-1 .sticker {
        position: absolute;
        left: 5%;
        top: 50%;
        font-size: 1.5em;
        width: 6em;
        height: 6em;
        transform: rotate(-15deg);
        background: #ff921e;
    }
    .renderBanner .renderItems-1 .sticker-inner {
        width: 5.5em;
        height: 5.5em;
        padding-top: 1.8em;
        line-height: 1em;
    }

    .renderBanner .renderItems-1 .sticker-inner span:first-child {
        margin-top: 3px;
        font-size: 1.4em;
    }

    .renderBanner .renderItems-1 .sticker-inner span:last-child {
        font-size: 0.333em;
        display: inline-block;
    }
    .renderBanner .renderItems-1 .sticker-inner span a {
        color: inherit;
    }

    .item-detail .sticker-backagain .sticker-inner {
        font-size: 0.7em;
    }

    .myaccount .orders .payLink {
        margin-left: 20px;
    }

    .carousel .renderItems-1 .renderItem .title {
        width: auto;
        font-size: 4vw!important;
    }

    .carousel .renderItems-1 .sticker,
    .shopProductAnsicht .item-detail .sticker {
        font-size: 7.5vw;
        width: 30vw;
        height: 30vw;
        border-radius: 20vw;
    }

    .shopProductAnsicht .item-detail .sticker,
    .shopProductAnsicht .item-detail.has3dImage .sticker {
        left: 3vw!important;
    }

    .carousel .renderItems-1 .sticker-inner,
    .shopProductAnsicht .item-detail .sticker-inner {
        width: 27.5vw;
        height: 27.5vw;
        padding-top: 10vw;
        line-height:3vw;

        border-radius: 17.5vw;
        left: 1.2vw;
        top: 1.2vw;
        border: 0.5vw solid white;
    }
    .itemlist-item {
        padding: 0;
    }

    #overlayNotify .overlay-inner,
    #quickOrderOverlay-inner {
        left: 0;
        margin-left: 0;
        background: #fff;
        width: 100%;
        padding: 20px;
    }

    .overlay-fullscreen.ageCheckOverlay .overlay-inner {
        height: auto;
    }

    #overlayNotify.overlay-fullscreen.ageCheckOverlay .overlay-inner .title {
        margin-top: 0;
    }

    .item-detail .product-price .priceBlock .price {
        font-size: 10vw;
    }

    .item-detail .product-price .priceDetails .undiscountedPrice {
        font-size: 5vw;
        line-height: 7vw;
    }

    .item-detail .product-price .priceDetails .basePrice {
        font-size: 4vw;
    }

    .item-detail .product-details .nav li a {
        font-size: 2.4vw;
        margin-right: 1vw;
        padding: 2vw 3vw;
    }

    .carousel .renderItems-1 .sticker-inner span:first-child {
        margin-top: 1.5px;
        font-size: 6vw;
    }

    .carousel .renderItems-1 .sticker-inner span:last-child {
        font-size: 1.4vw;
        padding: 10px 5px;
    }


    .aboutus h1 {
        width: auto;
        font-size: 8vw;
    }

    .hotspot .body,
    .mario .body,
    .block-description {
        font-size: 4vw;
    }

    html.preventMobileScroll .bigspirits #top-nav .search .btn-quickOrder,
    html.preventMobileScroll .bigspirits #top-nav .search .btn-pricelistDownload {
        width:100%!important;
        border: none;
    }

    #preislisten {
        margin: 1.5em;
    }

    .pricelist-create-select,
    .pricelist-create-settings {
        width: 100%;
    }
    #pricelistform .btn {
        width: 100%;
    }

    .fullheight #filterChevron {
        height: 60px!important;
        font-size: 2.25rem!important;
        padding: 1.45rem;
    }

    .fullheight #filterChevron span {
        font-size: 1.5rem;
    }

    #itemlist-filter.fullheight {
        bottom: 60px;
    }

    .bigspirits .overlayText {
        min-height: 0;
    }

    .bigspirits .mouseoverText ul {
        font-size: 3.5vw;
    }

    .show-xs {
        display: block !important;
    }
    .show-lg,
    .show-md,
    .show-sm {
        display: none !important;
    }

    .video-aboutus .overlayText {
        margin-top: 40vh;
        margin-left: 5vw;
        width: auto;
        font-size: 2vw;
    }
}

@media (max-width: 400px) {
    .table-shoppingCart-itemList .shoppingCart-item .listpricePerUnit,
    #checkout-summary-itemList tbody tr .pricePerUnit,
    .orders .items .itemlist-small tbody tr .pricePerUnit {
        margin-top: 70%;
    }

    .table-shoppingCart-itemList .shoppingCart-item .totalPrice,
    #checkout-summary-itemList tbody tr .total,
    .orders .items .itemlist-small tbody tr .total {
        margin-bottom: 70%;
    }
}

@media (max-width: 300px) {
    .searchbar-logo img {
        height: calc(19vw - 18px);
        margin-top: calc(9px - 9.5vw + 20px);
    }
}