﻿.popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 1;
}
.popup-content {
    background-color: #fff;
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}

/* Close button */
.close-btn {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 24px;
    cursor: pointer;
}

@media (max-width: 372px) {


    .pregli-guide-web {
        width: 18vw !important;
        height: 18vw !important;
    }
}

.pregli-guide-web {
    width: 8vw !important;
    height: 8vw !important;
}

@media (max-width: 1500px) {

    .pregli-guide-web {
        width: 12vw !important;
        height: 12vw !important;
    }
}

@media (max-width: 575px) {

    .pregli-guide-web {
        width: 16vw !important;
        height: 16vw !important;
    }
}


/* Input and button styles */
form {
    margin-top: 20px;
}


.close-btn:hover {
    color: red;
}
.iconswidth{
    width:70px !important;
}
button[type="submit"]:hover {
    background-color: #0055cc;
}

.div-padding {
    padding: 15.4vw 0 0 0;
}

.titles {
    font-size: 3vw;
    color: #1FB150;
}

.maintitles {
    color: #FFFFFF;
}

.mainsubtitle {
    font-size: 1.7vw;
    color: #FFFFFF;
}

.subtitles {
    font-size: 1.5vw;
    color: #0B1B58;
}

.subtitleslast {
    font-size: 1.5vw;
    color: #0B1B58;
    line-height: 1.4;
}

.playstoreimg {
    width: 12vw;
}

.techsacare-footer {
    display: none !important;
}

a {
    text-decoration: none !important;
}

body {
    background-color: white !important;
}
/* Base styles for the hero section */
.banner img {
    width: 100%;
}

.centered-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.text-left {
    text-align: left;
}

.text-center {
    text-align: center;
}

.col-md-8 {
    display: flex;
    justify-content: center;
    align-items: center;
}

/*.footer {*/
   /* background-color: #fff;
    color: #333333;
    padding: 20px 0;
    text-align: center;*/
    /*margin-bottom: 10vw;
}*/

/*.footer-left {
    text-align: left;
    padding-left: 200px;*/ /* Small distance from the left side */
/*}

.footer-right {
    text-align: right;
    padding-right: 200px;*/ /* Small distance from the right side */
/*}*/

.lineheightheading {
    line-height: 1.1;
}

.follow-text {
    margin-right: 10px; /* Small gap between text and icons */
}

.social-icon {
    width: 50px;
    height: 50px;
    margin-right: 10px; /* Small gap between icons */
}
/* Centered text and image styles */
.centered-text, .centered-image {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

.centered-text-First {
    display: flex;
    justify-content: end;
    align-items: start;
    height: 100%;
    padding-right: 69px;
}

/* Radial gradient background for the container */
.container-new {
    background: radial-gradient(circle at 0% 100%, #CDFFCB 0%, #FFF3F1 60%, #FAFAFA 100%);
    padding: 2vw;
}

ul li {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

.centered-text ul li {
    display: flex !important;
    align-items: start !important;
}

.h-50 {
    height: 50px !important;
}

.BannerOne {
    background-image: url('/image/WeightTracker/karvoimagenew.png');
    background-size: cover;
    background-repeat: no-repeat;
    height: 47vw
}

.div2icons {
    width: 4vw;
}

.textpaddingsec5 {
    padding-top: 7.5vw;
}

.img-size {
    width: 1.5vw;
    padding-top: 0.3vw;
    margin-right: 1vw;
}

.tickimg-size {
    width: 2vw;
    padding-top: 0.1vw;
    margin-right: 1vw;
}




@media (max-width: 2000px) {
    .div-padding {
        padding: 15vw 0 0 0;
    }

    .maintitles {
        font-size: 4vw;
    }

    .titles {
        font-size: 4vw;
    }

    .mainsubtitle {
        font-size: 2vw;
    }

    .subtitles {
        font-size: 2vw;
    }

    .subtitles {
        font-size: 1.9vw;
    }
}

@media (max-width: 1700px) {
    .div-padding {
        padding: 15.3vw 0 0 6vw;
    }

    .playstoreimg {
        width: 15vw;
    }
}

@media (max-width: 1500px) {
    .div-padding {
        padding: 15.3vw 0 0 9vw;
    }
}

@media (max-width: 1400px) {
    .div-padding {
        padding: 15.3vw 0 0 7vw;
    }
}

@media (max-width: 1300px) {
    .div-padding {
        padding: 15.3vw 0 0 9vw;
    }
}

@media (max-width: 1200px) {
    .div-padding {
        padding: 15.3vw 0 0 6vw;
    }
    .iconswidth {
        width: 70px !important;
    }
    .subtitlesfirst {
        font-size: 1.73177vw;
    }
}

@media (max-width: 1100px) {
    .div-padding {
        padding: 15.3vw 0 0 7vw;
    }
}

@media (max-width: 992px) {

    .div-padding {
        padding: 15.3vw 0 0 0;
    }

    .ImageSize {
        height: 300px !important;
    }

    .playstoreimg {
        width: 16vw;
    }

    .div2icons {
        width: 5vw;
    }

    .heading1 {
        font-size: 3.5vw;
    }

    .text1 {
        font-size: 2vw;
    }
}

@media (max-width: 883px) {
    .div-padding {
        padding: 15.3vw 0 0 5vw;
    }
    .iconswidth {
        width: 60px !important;
    }
}

@media (max-width: 383px) {
}

@media (max-width: 767px) {
    .BannerOne {
        background-image: url('/image/WeightTracker/heromob.png') !important;
        background-size: cover !important;
        height: 166vw !important;
    }
}

@media (max-width: 767px) {

    .lineheightheading {
        line-height: 1;
    }
    .iconswidth {
        width: 80px !important;
    }

    .playstoreimg {
        width: 40vw;
        margin-top: 5vw;
    }

    .titles {
        font-size: 9vw;
    }

    .textpaddingsec5 {
        padding-top: 0vw;
    }

    .mainsubtitle {
        font-size: 4.98vw;
    }

    .subtitles {
        font-size: 5.5vw;
    }

    .div2icons {
        width: 12vw;
        margin-top: 6vw;
        margin-bottom: 2vw;
    }

    .subtitleslast {
        font-size: 6vw;
        line-height: 1.1;
    }

    .SecondLastDivImg {
        text-align: center !important;
        padding-left: 0 !important;
    }

    .container-new {
        background: radial-gradient(circle at 0% 100%, #CDFFCB 0%, #FFF3F1 85%, #FAFAFA 100%);
        padding: 1vw 0;
    }

    .centered-text-First {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        height: 100% !important;
        padding-right: 0 !important;
    }

    .Weight-Tracker-Size {
        color: #77B624 !important;
    }

    .size {
        padding-right: 10px;
    }

    .Weight-Tracker-Size br {
        display: none;
    }

    .ot {
        text-align: center !important;
    }

    .div-padding {
        padding: 22vw 0 0 0;
        text-align: center;
    }

    .heading1 {
        font-size: 6vw;
    }

    .text1 {
        font-size: 3vw;
    }

    .btn-hide {
        display: none !important;
    }

    .btn-show {
        text-align: center;
        display: block !important;
    }

    .mobtrackimg {
        margin-top: 5vw;
        position: relative !important;
        margin-bottom: -70vw;
    }

    .container-new1 {
        padding-bottom: 30vw !important;
        margin-bottom: 45vw;
    }

    .img-size {
        width: 5vw;
        padding-top: 1vw;
        margin-right: 2vw;
    }

    .tickimg-size {
        width: 6vw;
        padding-top: 0.7vw;
        margin-right: 2vw;
    }
}

@media (max-width: 699px) {
    .titles {
        font-size: 7vw;
    }

    .mainsubtitle {
        font-size: 5.466vw;
    }

    .subtitles {
        font-size: 6vw;
    }

    .leafimg {
        left: -3vw;
    }
}

@media (max-width: 680px) {
    .img-main-div {
        margin-top: 46vw !important;
    }
}

@media (max-width: 608px) {
    .img-main-div {
        margin-top: 53vw !important;
    }
}

@media (max-width: 575px) {
    .iconswidth {
        width: 60px !important;
    }
}
@media (max-width: 508px) {
    .img-main-div {
        margin-top: 45vw !important;
    }
}

@media (max-width: 508px) {
    .img-main-div {
        margin-top: 58vw !important;
    }
}

@media (max-width: 480px) {
    .img-main-div {
        margin-top: 52vw !important;
    }
}

@media (max-width: 400px) {
    .img-main-div {
        margin-top: 62vw !important;
    }
}

@media (max-width: 347px) {
    .img-main-div {
        margin-top: 84vw !important;
    }
    .iconswidth {
        width: 18vw !important;
    }
    .playstoreimg {
        width: 50vw;
    }
}

@media (max-width: 286px) {
    .img-main-div {
        margin-top: 105vw !important;
    }
}

@media (min-width: 767px) {

    .ImageSize {
        height: 386px !important;
    }
}



@media (max-width: 550px) {
    .heading1 {
        font-size: 8vw;
    }

    .text1 {
        font-size: 4vw;
    }

    .fs-4-smallscreens {
        font-size: calc(1.275rem + .3vw) !important;
    }
}

@media (min-width: 400px) {
    .heroo2 {
        height: 450px !important;
    }
}

@media (max-width: 575px) {
}

@media (max-width: 480px) {
}

@media (min-width: 300px) {
}

@media (max-width: 353px) {
    .Folloe-Us {
        font-size: 14px !important;
        padding-right: 0.5rem !important;
    }
}

@media (max-width: 400px) {
    .heroo2 {
        height: 400px !important;
    }
}

@media (max-width: 372px) {
    .heroo2 {
        height: 372px !important;
    }
}

@media (max-width: 345px) {
    .heroo2 {
        height: 345px !important;
    }
}

@media (max-width: 325px) {
    .heroo2 {
        height: 325px !important;
    }
}

@media (max-width: 312px) {

    .heroo2 {
        height: 312px !important;
    }
}

@media (max-width: 275px) {

    .heroo2 {
        height: 275px !important;
    }
}

@media (max-width: 250px) {
    .heroo2 {
        height: 250px !important;
    }
}

.centered-content h2, .centered-content p {
    margin: 34px 0;
}