/*==========  Desktop First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
    .footer-menu-wrapper .footer-menu {
        flex-direction: column;
        align-items: flex-start;
    }

    .contacts-content {
        flex: 1 1 65%;
    }
    
    .products-list .product-card {
        flex: 1 1 50%;
        max-width: 49%;
    }

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
    .header .header_menu {
        position: fixed;
        top: 0;
        left: -999px;
        height: 100%;
        max-width: 320px;
        width: 100%;
        z-index: 1000;
        background: #fff;
        flex-direction: column;
        padding: 15px;
        margin: 0;
        opacity: 0;
        visibility: hidden;
        transition: all .30s;
    }

    .header .header_menu.active {
        visibility: visible;
        opacity: 1;
        left: 0;
        transition: all .30s;
    }


    .close-mob-menu {
        position: absolute;
        top: 15px;
        right: 15px;
        cursor: pointer;
    }

    .mob-logo img {
        width: 130px;
        height: auto;
    }


    .mob-menu-social {
        margin-top: 32px;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        gap: 8px;
    }

    .mob-menu-social a {
        background: #000;
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 48px;
        width: 48px;
        border-radius: 50%;
        transition: all .30s;
    }

    .mob-menu-social a:hover {
        transition: all .30s;
        background: #EB824B;
    }

    .mob-menu-social a:hover svg path {
        stroke: #fff !important;
    }

    .close-mob-menu,
    .mob-logo {
        display: block;
    }

    .mob-menu-social {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
    }

    .menu-black-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.26);
        z-index: 999;
        display: none;
    }

    .header_buttons-mob-menu {
        display: block;
    }

    .header_buttons-mob-menu button {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
        background: #fff;
        border: none;
        outline: none;
        cursor: pointer;
    }

    .header_buttons-mob-menu button svg {
        height: 32px;
        width: 32px;
    }

    .top-home__top {
        flex-direction: column;
    }

    .top-home__top > div {
        flex: 1 1 100%;
    }

    .top-home__top-banner {
        max-width: 100%;
    }

    .category-banners__list {
        flex-wrap: wrap;
    }

    .category-banners__list a {
        flex: 1 1 48%;
    }

    .catalog-list .item .description h3 {
        font-size: 18px;
    }

    .form-block__img {
        display: none;
    }

    .footer-big-logo {
        margin-bottom: -30px;
    }

    .footer-menu-wrapper {
        flex: 1 1 30%;
    }

    .why-select-us__list {
        flex-wrap: wrap;
    }

    .why-select-us__list .item {
        flex: 1 1 45%;
    }

    .promo-list__list article .promo-list__list-article-info .text h2 {
        font-size: 16px;
    }

    .promo-list__list article .promo-list__list-article-info {
        padding: 8px;
    }

    .promo-list__list article .promo-list__list-article-info .img img {
        height: 32px;
        width: 32px;
    }

    .promo-single__wrapper {
        flex-direction: column-reverse;
    }

    .contacts-wrapper {
        flex-direction: column;
    }
    
    .products-filter {
        position: fixed;
        top: 0;
        left: -999px;
        background: #fff;
        max-width: 300px;
        height: 100%;
        z-index: 1000;
        border-radius: 0;
        overflow: auto;
        visibility: hidden;
        opacity: 0;
        transition: all .30s;
    }
    .products-filter.active {
        visibility: visible;
        opacity: 1;
        left: 0;
        transition: all .30s;
    }
    .open-filter {
        display: -webkit-flex;
        display: -moz-flex;
        display: -ms-flex;
        display: -o-flex;
        display: flex;
    }
    .products-list {
        flex: 1 1 100%;
    }
}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
    .our-results-wrapper {
        flex-wrap: wrap;
    }

    .our-results-wrapper .left {
        flex: 1 1 100%;
    }

    .our-results-wrapper .right {
        flex: 1 1 100%;
        padding-top: 40px;
        padding-left: 0;
    }

    .our-results-wrapper .right .text {
        margin-top: 18px;
    }

    .work-steps-slider__item {
        flex-wrap: wrap;
    }

    .work-steps-slider__item .text {
        margin-top: 24px;
    }

    .work-steps-slider__item .text p {
        margin-top: 8px;
    }

    .ready-to-work {
        margin-top: 40px;
    }

    .ready-to-work__img {
        display: none;
    }

    .ready-to-work__content {
        padding: 24px;
    }

    .work-steps {
        padding: 40px 0;
    }

    .help-banner {
        padding: 80px 0;
        margin-top: 80px;
    }

    .our-work {
        margin-top: 40px;
    }

    .our-results-wrapper .left {
        padding-top: 40px;
    }

    .out-results {
        margin-top: 40px;
        padding-bottom: 40px;
    }

    .why-select-us {
        padding: 40px 0;
    }

    .designers-banner {
        padding: 80px 0;
    }

    .designers-banner__content {
        padding: 24px;
    }

    .catalog {
        padding: 40px 0;
    }

    .catalog-list {
        flex-wrap: wrap;
    }

    .form-block {
        padding: 40px 0;
    }

    .footer-big-logo {
        margin-bottom: -22px;
    }

    .footer-wrapper {
        padding: 24px;
    }

    .footer-contacts .phone {
        font-size: 24px;
    }

    .footer-bottom .footer-bottom__menu {
        flex-direction: column;
    }

    .help-banner__content {
        padding: 24px;
    }

    .promo-list__list article {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .about-page-wrapper {
        flex-direction: column;
    }

    .designers-page-wrapper {
        flex-direction: column;
    }
    .single-product-wrapper {
        flex-direction: column;
    }
    .single-product-wrapper .slider {
        flex: 1 1 100%;
        max-width: 100%;
    }
    .single-product-features {
        flex-wrap: wrap;
    }
    .single-product-features .item {
        flex: 1 1 45%;
    }
    .single-product-content {
        flex-direction: column-reverse;
    }
}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
    .header .header_buttons .header_buttons-cta {
        display: none;
    }

    .products-slider-block__head .head-title {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
    }

    .products-slider-block__head {
        align-items: flex-end;
    }

    .products-slider {
        margin-top: 16px;
    }

    .help-banner__content .buttons {
        flex-direction: column;
    }

    .our-work__head {
        flex-direction: column;
    }

    .our-work-slider {
        margin-top: 16px;
    }

    .our-results-wrapper .left .list .item {
        padding: 16px 16px 0;
    }

    .our-results-wrapper .left .list .item p {
        font-size: 16px;
    }

    .ready-to-work__content .buttons {
        flex-direction: column;
    }

    .designers-banner__content .buttons {
        flex-direction: column;
    }

    .footer-big-logo {
        margin-bottom: -15px;
    }

    .footer-top {
        flex-direction: column;
    }

    .our-results-wrapper .left h3 {
        margin-top: 32px;
        font-size: 86px;
    }

    .our-results-wrapper .left p {
        font-size: 16px;
    }

    .top-home__top-slider .slider-buttons-wrapper {
        padding: 8px;
        bottom: 8px;
        left: 8px;
        width: calc(100% - 16px);
    }

    .top-home__top-slider .slider-buttons-wrapper .slider-content .img img {
        width: 36px;
        height: 36px;
    }

    .top-home__top-slider .slider-buttons div {
        width: 36px;
        height: 36px;
    }

    .top-home__top-banner {
        padding: 24px;
    }

    .promo-single__wrapper-content h1 {
        font-size: 24px;
    }

    .breadcrumbs {
        flex-wrap: wrap;
    }

    .contacts-form {
        padding: 24px;
    }

    .page-404-wrapper__content {
        padding: 24px;
    }

    .page-404-wrapper__content h2 {
        font-size: 88px;
        letter-spacing: 3px;
    }
    .page-404 {
        margin-top: 48px;
    }
    .thx-page-wrapper {
        padding: 24px;
    }
    .thx-page {
        margin-top: 48px;
    }
    .products-list .product-card {
        flex: 1 1 100%;
        max-width: 100%;
    }
    .product-card {
        height: auto; 
    }
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {}


/*==========  Mobile First Method  ==========*/

/* Custom, iPhone Retina */
@media only screen and (min-width : 320px) {}

/* Extra Small Devices, Phones */
@media only screen and (min-width : 480px) {}

/* Small Devices, Tablets */
@media only screen and (min-width : 768px) {}

/* Medium Devices, Desktops */
@media only screen and (min-width : 992px) {}

/* Large Devices, Wide Screens */
@media only screen and (min-width : 1200px) {}
