@media (min-width:991px) {
    :root {
        --bs-body-font-size: 18px
    }
    .Banner .Text span{
        background-color: transparent;
    }
}

@media (max-width:992px) {
    .ProductList .ProdctListItem {
        flex-wrap: wrap;
        justify-content: center;
    }

    
}

@media (min-width: 577px) and (max-width: 992px) {
    .intro {
        height: auto;
        padding: 120px 0;
    }

    .intro .row {
        height: auto;
    }

    .intro img {
        width: 100%;
        margin: 0;
    }

    .intro h1 {
        font-size: 3rem;
    }

    .intro p {
        font-size: 1.7rem;
    }

    .intro .CTA {
        display: flex;
        flex-direction: column;
    }

    .timerCOunt {
        width: 100%;
        margin: 0;
    }

    .ProductList .ProductVIdeo {
        width: 100%;
    }

    .ProductList .ProdctListItem {
        flex-wrap: wrap;
    }

    .ProductList .ProdctListItem li {
        width: 33.3%;
    }

    .ProductList .ProdctListItem li a {
        margin: 0 0 13px 0;
    }
}

@media screen and (max-width: 578px) {
    header img {
        width: 60px;
    }

    .intro {
        height: auto;
        padding: 71px 0 60px 0;
    }

    .intro .row {
        height: auto;
        flex-direction: column-reverse;
    }

    .intro img {
        width: 70%;
        margin: 0 15%;
    }

    .intro h1 {
        font-size: 3rem;
        margin: 22px 0 0 0;
    }

    .intro p {
        font-size: 1.6rem;
    }

    .intro .CTA {
        flex-direction: column;
    }

    .intro .CTA li:last-child a {
        float: right;
        margin: -13px 0 0 0;
        font-size: 17px;
    }

    .timerCOunt {
        width: 100%;
        margin: 0;
    }

    .Banner .Text {
        position: relative;
        margin: 0 0 180px 0;
    }

    .Banner img {
        position: absolute;
        left: 0;
        width: 100%;
        bottom: 0;
    }

    .Banner .Text h3 {
        font-size: 19px;
    }

    .Banner .Text h2 {
        font-size: 2rem;
    }

    .Banner .Text .cta {
        /* margin: 0 0 18px 0; */
        padding: 8px 30px;
    }

    .ProductList .ProductVIdeo {
        width: 100%;
    }

    .ProductList .ProdctListItem li {
        width: 50%;
    }

    footer img {
        margin: 0 calc(50% - 30px);
    }

    footer .cp {
        text-align: center;
        width: 100%;
        float: right;
    }

    .ProductList h2 {
        font-size: 2rem;
    }

    .ProductList .ProdctListItem li a {
        margin: 0 0 13px;
        font-size: 14px;
    }

    .ProductList {
        padding: 30px 0;
    }

    .ListOFBuyList {
        flex-wrap: wrap;
    }

    .ListOFBuyList li {
        width: 50%;
        float: right;
    }

    .Timer .timerBox .CTA {
        width: 180px;
        text-align: center;
        float: right;
        margin: 18px calc(50% - 90px) 0;
    }

    footer .instagram {
        float: none;
    }

    footer .instagram img {
        margin: 0;
    }

    .hide_in_mobile {
        display: none;
    }

    .hide_in_desktop {
        display: block;
    }
}