/* Big screen :1200px. */
@media (min-width: 1200px) and (max-width: 1500px) {


}


/* Normal screen :992px. */
@media (min-width: 992px) and (max-width: 1200px) {


    :root{

      
        --f18 : 16px;
        --f19 : 16px;
        --f20 : 17px;
        --f22 : 18px;
        --f24 : 20px;
        --f28 : 22px;
        --f30 : 22px;
        --f32 : 24px;
        --f36 : 26px;
        --f40 : 30px;
        --f48 : 38px;
        --f57 : 47px;
      
      }
      .mb_150 {
        margin-bottom: 100px;
    }
      img.top-Decore {
        max-width: 450px;
    }
      .hero-img {
        right: 0;
    }
    
    .thm_btn {
        padding: 10px 45px;
    }
    
    .thm_btn img {
        max-width: 50px;
    }
    
    .club__img img {
        scale: .8;
    }
    
    .footer-area {
        padding: 90px 0 20px;
    }
}

 
/* Tablet screen :768px. */
@media (min-width: 768px) and (max-width: 991px) {


    :root{

      
        --f18 : 16px;
        --f19 : 16px;
        --f20 : 17px;
        --f22 : 18px;
        --f24 : 20px;
        --f28 : 22px;
        --f30 : 22px;
        --f32 : 24px;
        --f36 : 26px;
        --f40 : 30px;
        --f48 : 38px;
        --f57 : 47px;
      
      }
      .header-area{
    padding: 10px 0;
}
.container{
    max-width: 90%;
}
      .mb_150 {
        margin-bottom: 80px;
    }
      img.top-Decore {
        max-width: 450px;
    }
      .hero-img {
        right: 0;
        text-align: center;
        max-width: 270px;
        margin: auto;
        top: 0;
    }
    
    .thm_btn {
        padding: 10px 45px;
        margin-inline: auto;
    }
    
    .thm_btn img {
        max-width: 50px;
    }
    
    .club__img img {
        scale: .8;
    }
    
    .footer-area {
        padding: 90px 0 40px;
    }

.footer-img {
    text-align: center;
}
    .logo-area {
        max-width: 100px;
    }
    
    .logo-area img.circle-img {
        max-width: 30px;
        right: -30px;
        top: 0px;
    }
    
    .hero-area .row {gap: 70px 0;}
    
    .hero__content {
        text-align: center;
        margin-top: 50px;
    }
    
    .club__content {
        margin: auto;
        text-align: center;
    }
    
    .club__img {
        text-align: center;
    }
    
    .club-area .row {
        flex-direction: column-reverse;
    }
    
    .saving__content {
        margin: auto;
        text-align: center;
        max-width: 80%;
    }
    
    .saving__img {
        margin: auto;
        text-align: center;
        margin-top: 40px;
    }
    
    .saving__img img.tomato-img {
        margin: auto;
    }
    
    .saving__img b {
        margin: 20px auto;
    }
    
    .token__img {
        gap: 80px;
        padding: 0 20px;
    }
    
    .token__content .flex {
        margin-top: 60px;
    }
    
    .about__blk {
        padding-left: 70px;
    }
    
    .footer__nav ul {
        justify-content: center;
        margin-top: -152px;
    }
}

 
/* small screen :320px. */
@media (max-width: 767px) {


    :root{

--f18 : 16px;

--f19 : 16px;

--f20 : 17px;

--f22 : 18px;

--f24 : 20px;

--f28 : 22px;

--f30 : 22px;

--f32 : 24px;

--f36 : 26px;

--f40 : 30px;

--f48 : 38px;

--f57: 40px;

}
      .header-area{
    padding: 10px 0;
}

      .mb_150 {
        margin-bottom: 60px;
    }

.saving-area {
    margin-top: -40px;
}

.title br {
    display: none;
}
      img.top-Decore {
        max-width: 450px;
    }
      .hero-img {
        right: 0;
        text-align: center;
        max-width: 270px;
        margin: auto;
        top: 0;
    }
    
    .thm_btn {
        padding: 9px 28px;
        margin-inline: auto;
        font-size: 17px;
        gap: 15px;
    }

.hero__content p {
    margin-bottom: 20px;
}
    
    .thm_btn img {
        max-width: 30px;
    }
    
    .club__img img {
        scale: .8;
    }
    
    .footer-area {
        padding: 2px 0 40px;
        margin-top: 80px;
    }

.footer-img {
    text-align: center;
    max-width: 260px;
    margin: auto;
    margin-bottom: 30px;
}
    .logo-area {
        max-width: 100px;
    }
    
    .logo-area img.circle-img {
        max-width: 30px;
        right: -30px;
        top: 0px;
    }
    
    .hero-area .row {gap: 70px 0;}
    
    .hero__content {
        text-align: center;
        margin-top: 25px;
    }
    
    .club__content {
        margin: auto;
        text-align: center;
    }

.title span img {opacity: 0;}
    
    .club__img {
        text-align: center;
    }
    
    .club-area .row {
        flex-direction: column-reverse;
    }
    
    .saving__content {
        margin: auto;
        text-align: center;
        max-width: 320px;
    }

.saving__content h5 {
    margin: 25px 0;
}
    
    .saving__img {
        margin: auto;
        text-align: center;
        margin-top: 40px;
    }
    
    .saving__img img.tomato-img {
        margin: auto;
    }
    
    .saving__img b {
        margin: 20px auto;
    }
    
    .token__img {
        gap: 38px;
        padding: 0 10px;
        margin-bottom: 60px;
    }

.token__content h1 {
    max-width: 278px;
    margin-inline: auto;
}
    
    .token__content .flex {
        margin-top: 60px;
        max-width: 350px;
        margin-inline: auto;
    }
    
    .about__blk {
        padding-left: 50px;
        margin-bottom: 0;
        margin-top: 60px;
    }
    
    .footer__nav ul {
        justify-content: center;
        margin-top: -152px;
        gap: 46px;
    }
    img.tomato-t {
        max-width: 80px;
    }
    
    .token__content .flex h1 {
        font-size: 30px;
        word-spacing: 8px;
    }
    
    .token__content .flex img.heart {
        max-width: 270px;
    }
    
    .about__blk h2 img {
        max-width: 27px;
    }
    
    img.left-qt {
        margin-left: -32px;
    }
    
    .about__blk ul {
        max-width: 300px;
    }
    
    .user__blk {
        flex-direction: column;
        text-align: center;
    }
    
    .footer__nav ul li a i {
        max-width: 46px;
        height: 65px;
    }
    
    .footer__nav ul li a {
        font-size: 15px;
    }
    
    .footer-area img.Decore__bg {
        height: 420px;
        object-fit: cover;
        object-position: left;
    }
}
 
/* Large Mobile screen :480px. */
@media only screen and (min-width: 480px) and (max-width: 767px) {
.container {width:450px}
 
}