/******************************************************
    Smaller than 1400px
*******************************************************/

@media screen and (max-width: 1400px) {

    /*** Hero Section Three Styling ***/

    #hero-section-three {
        height: 676px;
    }

    #hero-section-three .hero-text {
        width: 630px;
    }

    #hero-section-three .hero-text h1 {
        font-size: 59px;
        line-height: 77px;
    }

    /*** Featured Categories Section Styling ***/

    #featured-categories .category-item {
        width: 398px;
        height: 658px;
    }

    /*** Newsletter Section Styling ***/

    .newsletter-content #email {
        width: 280px;
    }

    /*** Reviews Section Styling ***/

    .reviews-section .review-item {
        width: 328px;
        padding: 60px 34px;
    }

    /*** Gallery Section Styling ***/

    .qshop-gallery-item {
        width: 235px;
    }

    /*** Footer Info Styling ***/

    .footer-info-item::after {
        margin: 0 56px;
    }

}

/******************************************************
    Smaller than 1200px
*******************************************************/

@media screen and (max-width: 1200px) {

    /*** Hero Section Two Styling ***/

    #hero-section-two .hero-text h1 {
        font-size: 66px;
        line-height: 92px;
    }

    #hero-section-two .hero-text p {
        max-width: 440px;
        margin-top: 16px;
        font-size: 19px;
        line-height: 25px;
    }

    /*** Hero Section Three Styling ***/

    @keyframes hero-text-slide-in-right-76 {
        from {
            right: -70px;
            opacity: 0;
        }
        to {
            right: 66px;
            opacity: 1;
        }
    }

    #hero-section-three {
        height: 540px;
    }

    #hero-section-three .hero-text {
        right: 66px;
        width: 530px;
        animation: hero-text-slide-in-right-76 1s ease-out;
    }

    #hero-section-three .hero-text h1 {
        font-size: 51px;
        line-height: 65px;
    }

    #hero-section-three .cta-wrap {
        left: 66px;
        width: 269px;
    }

    /*** Featured Category Section Styling ***/

    #featured-categories .category-item {
        width: 318px;
        height: 520px;
    }

    /*** Newsletter Section Styling ***/

    .newsletter-content #email {
        width: 162px;
    }

    .wrapper.newsletter-section,
    .reviews-section.wrapper,
    .blog-section.wrapper,
    .faq-section.wrapper {
        margin-bottom: 94px;
    }
    
    /*** Reviews Section Styling ***/

    .reviews-section .review-item {
        width: 248px;
        padding: 48px 34px;
    }

    /*** FAQs Section Styling ***/

    .faq-question {
        font-size: 17px;
    }

    /*** Gallery Section Styling ***/

    .qshop-gallery-item {
        width: 187px;
        height: 256px;
    }

    .qshop-gallery-item:nth-child(2n) {
        height: 290px;
    }

    /*** Footer Info Styling ***/

    .footer-info-item {
        font-size: 15px;
    }

    .footer-info-item::after {
        margin: 0 26px;
    }

}

/******************************************************
    Smaller than 960px
*******************************************************/

@media screen and (max-width: 960px) {

    /*** Hero Section Two Styling ***/

    #hero-section-two {
        height: 458px;
    }

    #hero-section-two .hero-text {
        position: absolute;
        top: 100px;
        width: 426px;
        padding-top: 0;
    }

    #hero-section-two .hero-text h1 {
        font-size: 38px;
        line-height: 58px;
    }

    #hero-section-two .hero-text p {
        max-width: 293px;
        font-size: 17px;
        line-height: 23px;
    }

    /*** Hero Section Three Styling ***/

    #hero-section-three {
        height: 366px;
        margin-bottom: 88px;
    }

    #hero-section-three .hero-text {
        bottom: 137px;
        text-align: center;
    }

    #hero-section-three .hero-text h1 {
        margin-bottom: 10px;
        font-size: 35px;
        line-height: 47px;
    }

    #hero-section-three .hero-text p {
        font-size: 20px;
        line-height: 26px;
    }

    #hero-section-three .cta-wrap {
        left: 0;
        right: 0;
        bottom: 53px;
        margin: 0 auto;
    }

    #hero-section-three .hero-call-to-action-text {
        display: none;
    }

    /*** Large Product Section Styling ***/

    .large-product-section .product-details {
        padding: 64px 40px;
    }

    /*** Featured Category Section Styling ***/

    #featured-categories .category-item {
        width: 214px;
        height: 344px;
    }

    /*** Newsletter Section Styling ***/

    .wrapper.newsletter-section {
        height: auto;
        text-align: center;
    }

    .newsletter-col {
        width: 100%;
        float: none;
    }

    .newsletter-content {
        box-sizing: border-box;
        padding: 42px 36px 52px;
    }

    .newsletter-content-wrap {
        margin: 0;
    }

    .newsletter-content #email,
    .newsletter-content input[type="submit"] {
        box-sizing: border-box;
        width: 100%;
        text-align: center;
    }

    /*** Reviews Section Styling ***/

    .reviews-section .review-item {
        width: 272px;
        padding: 42px 25px 36px;
    }

    .reviews-section .review-item:nth-child(odd) {
        margin-right: 5px;
    }

    .reviews-section .review-item:nth-child(even) {
        margin-right: 0;
    }

    .reviews-section .review-image {
        width: 70px;
        height: 70px;
    }

    .reviews-section .review-item-2::before,
    .reviews-section .review-item-4::before,
    .reviews-section .review-item-5::before {
        background-image: none;
    }

    .reviews-section .review-item-3::after {
        left: unset;
        bottom: unset;
        right: 0;
        top: 0;
        background-image: url('../images/review-corner-right-top.svg');
    }

    .reviews-section .review-item-3::before {
        right: 0;
        bottom: 0;
        background-image: url('../images/review-corner-right-bottom.svg');
    }

    .reviews-section .review-item-4::before {
        left: 0;
        bottom: 0;
        background-image: url('../images/review-corner-left-top.svg');
    }

    .reviews-section .review-item-4::after {
        left: 0;
        bottom: 0;
        background-image: url('../images/review-corner-left-bottom.svg');
    }

    .reviews-section .review-item-5::after {
        left: 0;
        top: 0;
        background-image: url('../images/review-corner-left-top.svg');
    }

    .reviews-section .review-item-5::after {
        left: unset;
        right: 0;
        background-image: url('../images/review-corner-right-top.svg');
    }

    /*** FAQ Section Styling ***/

    .faq-section.wrapper {
        width: 650px;
    }

    /*** Blog Section Styling ***/

    .blog-section .medium-post {
        margin-bottom: 68px;
    }

    .blog-section .medium-post:last-child {
        margin-bottom: 0;
    }

    .blog-section .post-title {
        font-size: 26px;
        line-height: 36px;
    }

    /*** Gallery Section Styling ***/

    .qshop-gallery-item, .qshop-gallery-item:nth-child(2n) {
        width: 319px;
        height: 340px;
        margin-bottom: 6px;
    }

    .qshop-gallery-item:nth-child(even) {
        margin-right: 0;
    }

    .qshop-gallery-item:nth-child(5) {
        display: none;
    }

    /*** Footer Info Styling ***/

    .footer-info {
        padding-top: 80px;
        text-align: center;
    }

    .footer-info-item {
        display: inline-block;
        height: 70px;
        margin-right: 30px;
        float: none;
        line-height: 30px;
    }

    .footer-info-icon {
        height: 30px;
    }

    .footer-info-item::after {
        display: none;
    }

    .footer-info-icon img {
        max-width: 30px;
    }

}

/******************************************************
    Smaller than 700px
*******************************************************/

@media screen and (max-width: 700px) {

    /*** Hero Section Two Styling ***/

    #hero-section-two {
        height: 384px;
        margin-bottom: 63px;
    }

    #hero-section-two .hero-text {
        width: 70%;
        left: 0;
        right: 0;
        margin: 0 auto;
        text-align: center;
    }

    #hero-section-two .hero-text h1 {
        padding: 10px;
        border: none;
        font-size: 27px;
        line-height: 39px;
        word-wrap: normal;
    }

    #hero-section-two .hero-text p,
    #hero-section-two .hero-ratings {
        display: none;
    }

    #hero-section-two .hero-cta-button {
        left: 0;
        right: 0;
        width: 120px;
        margin: 0 auto;
    }

    #hero-section-two .hero-image {
        width: 100%;
    }

    /*** Hero Section Three Styling ***/

    #hero-section-three {
        height: 228px;
        margin-bottom: 65px;
    }

    #hero-section-three .hero-text {
        left: 0;
        right: 0;
        bottom: 88px;
        width: 98%;
    }

    #hero-section-three .hero-text h1 {
        font-size: 23px;
        line-height: 29px;
    }

    #hero-section-three .hero-text p {
        display: none;
    }

    #hero-section-three .cta-wrap {
        bottom: 0;
        width: 100%;
    }

    #hero-section-three .hero-cta-button {
        color: #fff;
        background-color: var(--theme-black);
    }

    #hero-section-three .hero-cta-button:hover {
        background-color: var(--accent-color);
    }

    /*** Featured Products Section Styling ***/

    .wrapper.featured-products {
        margin-bottom: 0;
    }

    /*** FAQs Section Styling ***/

    .faq-section.wrapper {
        width: 320px;
    }

    /*** Large Product Section Styling ***/

    .large-product-section {
        width: 320px;
        height: auto;
        margin-right: auto;
        margin-left: auto;
        margin-bottom: 70px;
    }

    .large-product-section .product-image,
    .large-product-section .product-details {
        width: 100%;
        height: auto;
        float: none;
    }

    .large-product-section .product-details {
        padding: 40px 30px 60px;
    }

    .large-product-section h1 {
        margin-bottom: 4px;
        font-size: 20px;
    }

    .large-product-section .price {
        font-size: 16px;
    }

    .large-product-section .variations {
        margin-bottom: 41px;
    }

    .large-product-section .variations tr {
        line-height: 0;
    }

    .large-product-section .variations label {
        font-size: 12px;
    }

    .large-product-section select {
        width: 200px;
        font-size: 12px;
    }

    .large-product-section .quantity .qty {
        width: 159px;
    }

    .large-product-section .single_add_to_cart_button {
        width: 100%;
        margin-top: 51px;
    }

    /*** Featured Category Section Styling ***/

    #featured-categories {
        margin-bottom: 76px;
    }

    #featured-categories .category-item {
        width: 100%;
        height: 460px;
        margin-right: 0;
        margin-bottom: 3px;
    }

    /*** Reviews & Newsletter Sections Styling ***/

    .newsletter-content h2 {
        font-size: 26px;
    }

    .reviews-section.wrapper .review-item {
        display: none;
    }

    .reviews-section.wrapper .review-item:nth-child(1),
    .reviews-section.wrapper .review-item:nth-child(2),
    .reviews-section.wrapper .review-item:nth-child(3) {
        display: block;
    }

    .reviews-section.wrapper .review-item:nth-child(3) {
        margin-bottom: 0;
    }

    .reviews-section.wrapper, .wrapper.newsletter-section, .faq-section.wrapper {
        margin-bottom: 76px;
    }

    .reviews-section .review-item::before, .reviews-section .review-item::after {
        display: none;
    }

    .reviews-section .review-item {
        width: 100%;
        height: auto;
        padding-bottom: 40px;
        box-sizing: border-box;
        margin-right: 0;
    }

    /*** Blog Section Styling ***/

    .blog-section .post-title {
        font-size: 20px;
        line-height: 28px;
    }

    /*** FAQs & Gallery Sections Styling ***/

    .faq-section.wrapper, .gallery-section.wrapper {
        margin-bottom: 76px;
    }

    .faq-item:last-child {
        margin-bottom: 0;
    }

    /*** Footer Widgets Styling ***/

    .footer-widgets .widget {
        width: 100%;
        margin-right: 0;
        margin-bottom: 50px;
    }

}

/******************************************************
    Smaller than 320px
*******************************************************/

@media screen and (max-width: 320px) {

    /*** Hero Section Three Styling ***/

    #hero-section-three {
        height: 206px;
    }

    /*** Large Product Section Styling ***/

    .large-product-section {
        width: 280px
    }

    .large-product-section .product-details {
        padding: 36px 20px 48px;
    }

    .large-product-section select {
        width: 185px;
    }

    .large-product-section .quantity .qty {
        width: 122px;
    }

    /*** FAQs Section Styling ***/

    .faq-section.wrapper {
        width: 280px;
    }

    .faq-question {
        font-size: 16px;
        line-height: 23px;
    }

    /*** Gallery Section Styling ***/

    .qshop-gallery-item, .qshop-gallery-item:nth-child(2n) {
        width: 100%;
    }

}