﻿
@media all and (min-width: 480px) {

    .header-upper {
        padding: 0 18px;
    }

    .sub-category-grid .item-grid {
        grid-template-columns: repeat(auto-fit, minmax(49%,1fr));
        grid-row-gap: 10px !important;
    }

    .product-grid .buttons .wrapper {
        display: flex;
        flex-flow: column;
    }

    .item-box .color-attributes {
        display: block;
    }

    .gallery .picture-thumbs {
        grid-template-columns: 1fr 1fr 1fr 1fr;
    }

    .rental-attributes .datepicker {
        width: 100%;
    }

    .checkout-as-guest-button,
    .checkout-as-guest-button + button {
        min-width: 200px;
    }

    .private-messages-page .date {
        display: table-cell;
    }

    .private-messages-page col.date {
        display: table-column;
    }
}

@media all and (min-width: 768px) {

    /* GLOBAL STYLES */

    .page {
        text-align: left;
    }

    .page-title h1 {
        font-size: 32px;
    }

    .center-1 .page-title {
        padding: 35px 0;
    }

    .center-2 .page-title {
        padding: 30px 0;
    }

    .product-grid .title,
    .topic-block .title,
    .home-page .title {
        padding: 25px 0;
        font-size: 24px;
    }

    .home-page .slider-wrapper {
        padding-top: 25px;
    }

    /* GLOBAL FORMS */

    .inputs .option-list li {
        display: inline-block;
        margin: 5px 10px;
    }

    /* NOTIFICATIONS & POPUPS */

    .eu-cookie-bar-notification .content {
        flex-direction: row;
        justify-content: space-between;
        column-gap: 20px;
    }
    /* HEADER */
    /* HEADER MENU */
    /* FOOTER */

 /*   .footer .newsletter {
        width: 500px;
        margin: auto;
    }

        .footer .newsletter:before {
            content: "";
            position: absolute;
            top: 15px;
            right: -15px;
            bottom: -15px;
            left: 15px;
            z-index: -1;
            border: 1px solid var(--secondary-color);
        }
*/
    .footer-middle {
        padding-top: 80px;
    }

    .footer-blocks {
        display: flex;
        max-width: 1200px;
        margin: auto;
    }

    .footer-block {
        flex: 1 0 25%;
        padding-left: 5%;
    }

        .footer-block .title {
            margin-bottom: 15px;
        }

        .footer-block .list {
            display: block !important;
            height: auto !important;
        }

    .footer-lower {
        position: relative;
        padding: 15px 25px;
    }

    .footer-texts {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .footer-text {
        flex: 1 0 33.333%;
        padding: 0;
    }

        .footer-text.credits {            
            text-align: right;
        }

        .footer-text .txt + .txt {
            margin-left: 15px;
            border-left: 1px solid #bbb;
            padding-left: 15px;
        }

        .footer-text.copyright {
            display: flex;
            text-align: left;
        }

    .footer-block-wrapper {
        display: table;
        width: 100%;
        padding: 0 0 60px;
    }

    .footer-block {
        display: table-cell;
        width: 33.333%;
        /*border-right: 1px solid #333;*/
        vertical-align: top;
    }

        .footer-block:last-child {
            border: none;
        }

        .footer-block .title {
            margin: 0;
            border: none;
            padding-top: 0;
            cursor: default;
        }

            .footer-block .title:before,
            .footer-block .title:after {
                display: none;
            }

        .footer-block .list {
            display: block !important;
            height: auto !important;
            padding: 10px 0 0 !important;
            margin: 0 0 -5px;
        }

    .theme-selector {
        margin-top: 0;
    }

        .theme-selector select {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            margin: auto;
        }

    /* HOMEPAGE INFO PANEL */

    .information-box {
        width: calc(50% - 20px);
    }

    .category-grid .item-grid, .manufacturer-grid .item-grid, .vendor-grid .item-grid, .three-products .product-grid .item-grid,
    .product-grid .item-grid {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-row-gap: 50px;
    }
    .sub-category-grid .item-grid {
        grid-template-columns: repeat(auto-fit,minmax(23.5%,1fr));
        grid-row-gap: 15px !important;
    }

    /* CATEGORY PAGE & GRIDS */

    .product-selectors {
        justify-content: flex-end;
    }

        .product-selectors select {
            min-width: 20px;
            height: 30px;
            line-height: 18px; /*text vertical alignemt*/
            background-color: #fff;
        }

    .product-viewmode {
        display: flex;
        column-gap: 5px;
        align-items: center;
        margin-right: auto;
    }

        .product-viewmode span {
            display: none !important;
        }

        .product-viewmode a {
            padding: 5px;
            font-size: 0;
        }

            .product-viewmode a:before {
                font-size: 20px;
            }

        .product-viewmode .grid:before {
            font-family: 'voyage-icons';
            content: "\e937";
        }

        .product-viewmode .list:before {
            font-family: 'voyage-icons';
            content: "\e939";
        }

        .product-viewmode .selected {
            color: var(--accent-color);
        }

    .product-sorting,
    .product-page-size {
        width: auto;
    }

     .home-page-category-grid .product-grid .item-grid,
    .category-grid .item-grid,
    .manufacturer-grid .item-grid,
    .vendor-grid .item-grid {
        grid-template-columns: 1fr 1fr 1fr;
        grid-row-gap: 50px;
    }

    .sub-category-grid .item-grid {
        grid-template-columns: repeat(auto-fit, minmax(23.5%, 1fr));
        grid-row-gap: 15px !important;
    }

    .home-page-product-grid:not(.nop-jcarousel) .title,
    .home-page .bestsellers:not(.nop-jcarousel) .title {
        margin-bottom: 50px;
    }

    .home-page-product-grid:not(.nop-jcarousel) .item-grid,
    .home-page .bestsellers:not(.nop-jcarousel) .item-grid {
        grid-column-gap: 7.5%;
        grid-row-gap: 60px;
    }

    .home-page-product-grid:not(.nop-jcarousel) .item-box:nth-child(3n+2),
    .home-page .bestsellers:not(.nop-jcarousel) .item-box:nth-child(3n+2) {
        position: relative;
        /* bottom: 40px; */
    }

    .product-list .item-box + .item-box {
        margin-top: 20px;
    }

    .product-list .item-box .product-item {
        display: grid;
        width: 100%;
        grid-template-columns: 32% auto;
        grid-column-gap: 35px;
    }

    .product-list .item-box .picture {
        margin: 0;
    }

    .product-list .item-box .details {
        padding: 25px 0;
    }

    .product-list .item-box .product-title {
        flex-grow: 0;
        margin-bottom: 25px;
        font-size: 14px;
        color: #000;
    }

    .product-list .item-box .description {
        display: block;
    }

    .product-list .item-box .add-info {
        display: block;
        margin-top: 20px;
    }

    .product-list .item-box .buttons {
        margin-top: 30px;
        text-align: left;
    }

    .product-list .product-box-add-to-cart-button {
        vertical-align: middle;
    }

    .product-list .buttons .wrapper {
        display: inline-flex;
        vertical-align: middle;
        position: relative;
        bottom: 1px;
        left: 1px;
    }

    .product-list .add-to-wishlist-button,
    .product-list .add-to-compare-list-button {
        margin-left: 15px;
    }

    /* PRODUCT PAGE */

    .product-essential {
        max-width: none;
        margin-bottom: 40px;
    }

    .gallery {
        float: left;
        width: 46%;
        max-width: none;
        margin-bottom: 0;
        padding-top: 3%;
    }

    .overview {
        float: right;
        width: 51.5%;
        max-width: none;
        padding-top: 3%;
    }

    .product-name.mobile {
        display: none !important;
    }

    .product-name.desktop {
        display: block !important;
        margin: 0 0 30px;
        border-bottom: 1px solid #eee;
        padding: 5px 0 !important;
        text-align: left;
    }

    .price-reviews-wrapper {
        margin-bottom: 0;
        border: none;
    }

        .price-reviews-wrapper .prices,
        .product-reviews-overview {
            justify-content: flex-start;
        }

    .old-product-price,
    .non-discounted-price,
    .prices .product-price {
        margin-left: 0;
    }

    .prices .rental-price {
        text-align: left;
    }

    .product-collateral {
        max-width: none;
    }

    .product-variant-line {
        display: flex;
        column-gap: 30px;
        margin-top: 15px;
    }

    .variant-overview.mobile {
        display: none; /*selector string has no space!*/
    }

    .variant-overview .desktop {
        display: block; /*selector string has space!*/
    }

    .variant-picture {
        align-self: flex-start;
        flex: 0 0 300px;
    }

    .variant-overview {
        flex-grow: 1;
    }

    /* REVIEW PAGE */

    .write-review .review-rating {
        position: relative;
    }

        .write-review .review-rating > label {
            position: absolute;
            left: 0;
            width: auto;
            margin: 0;
        }

    .product-review-item .review-item-head {
        display: flex;
        justify-content: space-between;
        margin: 0 0 15px;
    }

    .product-review-item .review-title {
        max-width: calc(100% - 100px);
        margin-bottom: 0;
    }

    .product-review-item .product-review-box {
        margin-bottom: 0;
    }

    .product-review-item .review-item-content {
        display: flex;
    }

    .product-review-item .review-avatar {
        flex: 0 0 150px;
        max-width: 150px;
        margin: 0 30px 0 0;
    }

    .product-review-item .review-content {
        flex-grow: 1;
    }

    .product-review-item .review-reply {
        margin-top: 10px;
    }

    /* WISHLIST & COMPARE PAGE */

    .wishlist-content .buttons {
        flex-flow: row;
        max-width: none;
        border-bottom: 1px solid #eee;
        padding-bottom: 30px;
    }

    .wishlist-add-to-cart-button {
        margin-left: auto;
    }

    .wishlist-page .share-info {
        margin: 40px 0 0;
    }

    .compare-products-mobile {
        display: none;
    }

    .compare-products-table {
        display: table;
        margin-top: -15px;
        border-top: 1px solid #eee;
    }

    .compare-products-clear-list {
        position: absolute;
        top: 35px;
        right: 5px;
        margin-bottom: 0;
        line-height: 44px;
    }

    /* CONTACT PAGES */

    .contact-page .topic-block,
    .apply-vendor-page .topic-block,
    .email-a-friend-page .title {
        margin-top: -10px;
    }

    /* ACCOUNT PAGES */

    .address-list-page .addresses,
    .order-list-page .order-list,
    .return-list-page .return-list,
    .gdpr-tools-page .gdpr-form {
        grid-template-columns: 49% 49%;
        grid-gap: 25px 2%;
        max-width: 900px;
    }

    /* SHOPPING CART */

    .order-progress li {
        max-width: 120px;
    }

    .order-progress a {
        display: inline-block;
        padding-top: 60px;
        font-size: 18px;
    }

    .cart-options .common-buttons {
        flex-flow: row;
        align-items: center;
        max-width: none;
        border-bottom: 1px solid #eee;
        padding-bottom: 30px;
    }

    .cart-options .tax-shipping-info {
        order: 3; /**/
        flex-grow: 1;
        margin: auto;
    }

    .tax-shipping-info ~ .update-cart-button {
        margin-right: auto;
    }

    .cart-options .estimate-shipping-button {
        order: 4; /**/
        margin-left: auto;
    }

    .cart-options .update-cart-button:before {
        content: "\e91d";
            font-family: 'voyage-icons';
        position: relative;
        bottom: -1px;
        margin-right: 8px;
        font-size: 16px;
    }

    .cart-options .continue-shopping-button:before {
        content: "\e902";
            font-family: 'voyage-icons';
        position: relative;
        bottom: -2px;
        margin-right: 8px;
        font-size: 18px;
    }

    .cart-options .estimate-shipping-button:before {
        content: "\e91e";
            font-family: 'voyage-icons';
        margin-right: 8px;
        font-size: 31px;
    }

    .cart-footer {
        display: flex;
        column-gap: 4%;
    }

    .cart-collaterals {
        flex-grow: 1;
    }

    .checkout-attributes dt {
        margin: 0 0 10px;
        font-family: var(--font-family);
        font-size: 24px;
        color: #000;
    }

    .checkout-attributes dd {
        margin: 0 0 20px;
    }

    .checkout-attributes select {
        width: 100%;
    }

    .cart-collaterals .title {
        margin: 0 0 10px;
        font-size: 24px;
    }

    .coupon-box, .giftcard-box {
        margin-bottom: 0;
    }

        .coupon-box + .giftcard-box {
            margin-top: 20px;
        }

    .cart-footer .totals {
        width: 48%;
        max-width: 480px;
    }

    .cart-footer .totals-txt {
        display: block;
        margin-bottom: 10px;
        font-family: var(--font-family);
        font-size: 24px;
    }

    .terms-of-service {
        max-width: 470px;
        margin-left: 5px;
    }

        .terms-of-service label {
            display: inline-block;
        }

    /* REGISTRATION & LOGIN */

    .registration-page form,
    .customer-block .wrapper {
        padding: 40px 3%;
    }

    .customer-block .guest-button,
    .customer-block .guest-button + input {
        margin: 0 5px;
    }

    /* ACCOUNT PAGES */

    .customer-info-page,
    .address-edit-page,
    .change-password-page,
    .customer-avatar-page,
    .customer-reviews-list,
    .giftcard-balance-page,
    .vendor-info-page {
        padding: 40px 3%;
    }


            .address-list .section:nth-child(even),
            .order-list .section:nth-child(even),
            .request-list .section:nth-child(even),
            .price-match-list.section:nth-child(even) {
                clear: none;
            }

            .address-list .section:last-child,
            .order-list .section:last-child,
            .request-list .section:last-child,
            .price-match-list.section:last-child {
                margin-bottom: 0;
            }

            .address-list .section:only-child,
            .one-address + .section:last-child,
            .order-list .section:only-child,
            .request-list .section:only-child,
            .price-match-list.section:only-child {
                float: none;
                width: auto;
                max-width: 900px;
                margin-left: auto;
                margin-right: auto;
            }

    .one-address + .section:last-child {
        margin-top: -1px;
    }

    .section.recurring-payments {
        float: none;
        width: auto;
    }

    .customer-reviews-page .review-item-head {
        overflow: hidden;
    }

    .customer-reviews-page .review-title {
        float: left;
        max-width: calc(100% - 80px);
    }

    .customer-reviews-page .rating-box {
        float: right;
        margin-top: 5px;
    }

    .gdpr-tools-page .section .info {
        min-height: 75px;
    }

    /* SHOPPING CART */

    .order-progress li {
        width: calc(33.33333% - 3px);
    }

    .cart-options button {
        min-width: 0;
    }

    /* CHECKOUT */

    .checkout-page .address-grid {
        padding: 10px;
    }

    .checkout-page .address-item,
    .checkout-page .enter-address {
        padding: 40px 3%;
    }

    .checkout-page .address-item {
        float: left;
        width: 48%;
        margin: 1% !important;
    }

        .checkout-page .address-item:nth-child(odd) {
            clear: both;
        }

        .checkout-page .address-item:nth-child(even) {
            clear: none;
        }

        .checkout-page .address-item:only-child {
            float: none;
            margin-left: auto !important;
            margin-right: auto !important;
        }

    .checkout-page .new-address {
        max-width: 900px;
        margin: auto;
    }

    .opc .order-summary {
        margin-top: 15px !important;
        overflow: hidden;
    }

    .opc .confirm-tab .buttons {
        margin: 0 0 10px;
    }

    /* ORDER DETAILS */

    .order-review-data,
    .order-details-area,
    .shipment-details-area {
        display: grid;
        grid-template-columns: 49% 49%;
        grid-template-rows: auto auto;
        grid-column-gap: 2%;
        max-width: none;
        text-align: center;
    }

        .order-review-data.full,
        .order-details-area.full,
        .shipment-details-area.full {
            grid-auto-flow: column;
        }

        .order-review-data > div,
        .order-details-area > div,
        .shipment-details-area > div {
            display: flex;
            flex-flow: column;
        }

        .order-review-data ul,
        .order-details-area ul,
        .shipment-details-area ul {
            flex-grow: 1;
        }

    .order-details-page .buttons {
        margin-top: -20px;
    }

    .order-details-page .options {
        text-align: right;
    }

    .order-details-page .totals {
        width: 48%;
        max-width: 410px;
        margin-left: auto;
    }

    /* BLOG & NEWS */

    .new-comment textarea,
    .enter-comment-title {
        max-width: 600px !important;
    }
}
