/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/

.hero-ipredict {
    width: 100%;
    height: 40vh;
    background-size: cover;
    position: relative;
}

    .hero-ipredict .container {
        position: relative;
        padding-top: 18vh;
    }


    .hero-ipredict .hero-intro {
        position: absolute;
        bottom: 0;
    }

    .hero-ipredict:before {
        content: "";
        position: absolute;
        bottom: 0;
        top: 0;
        left: 0;
        right: 0;
    }


@media (max-width: 992px) {
    .hero-ipredict .container {
        /*padding-top: 58px;*/
    }
}

.hero-ipredict h1 {
    margin: 0;
    font-size: 30px;
    font-weight: 500;
    line-height: 5px;
    color: #fff;
    font-family: "Poppins", sans-serif;
    text-align: center;
}

    .hero-ipredict h1 span {
        color: #106eea;
    }

.hero-ipredict p {
    text-align: center;
    color: #fff;
}

.hero-ipredict h2 {
    color: #555555;
    margin: 5px 0 30px 0;
    font-size: 24px;
    font-weight: 400;
}

/*--------------------------------------------------------------
# Intro
--------------------------------------------------------------*/

.intro-ipredict .intro-container .intro-items h2 {
    text-align: center;
    font-weight: 700;
    margin-bottom: 5px;
    font-size: 28px;
    color: #1a356d;
}

.intro-ipredict .intro-main-p {
    font-size: 14px;
    font-weight: 400;
    text-align: center;
}

/*--------------------------------------------------------------
# App-Tab
--------------------------------------------------------------*/
.app-tab .app-tab-body .app-tab-ul {
    margin-left : 250px;
}
.app-tab ul li a {
    text-align: center;
    font-weight: 400;
    font-size: 14px;
    color : #222222;
}
.app-tab ul li  {
    margin : 0 10px 0 10px;
    border : 1px solid rgba(0, 0, 0, 0.1);
    width : 200px;
    border-radius : 5px;
}
/*.app-tab ul li a[type="radio"]:checked  {
    color : #fff;
    background : red;
}*/
@media (max-width: 1199px) {
    .app-tab .app-tab-body .app-tab-ul {
        margin-left: 150px;
    }
}
@media (max-width: 992px) {
    .app-tab .app-tab-body .app-tab-ul {
        margin-left: 0;
    }
}
@media (max-width: 768px) {
    .app-tab .app-tab-body .app-tab-ul {
        margin-left: 100px;
    }
}
/*--------------------------------------------------------------
# Appointment
--------------------------------------------------------------*/
.diabetes .app-img {
    height: 100%;
    width: 100%;
    text-align: center;
}

    .diabetes .app-img img {
        max-height: 100%;
        max-width: 100%;
    }

.diabetes .diabetes-head h3 {
    font-size: 22px;
    color: #222222;
    margin: 0 0 15px 0;
    font-weight: 700;
}

.diabetes .diabetes-p p {
    text-align: justify;
    font-weight: 300;
    font-size: 14px;
}
.diabetes .diabetes-p img {
    width : 100px;
    height : 30px;
}

.diabetes .diabetes-semi-head h3 {
    font-size: 18px;
    color: #222222;
    margin: 0 0 15px 0;
    font-weight: 300;
}



/*--------------------------------------------------------------
# Add-Show-White
--------------------------------------------------------------*/
.add-show-white {
    width: 100%;
    height: 30vh;
    background: #fff;
    background-size: cover;
    position: relative;
}


.add-show-white .add-show-details{
    text-align : center;
}
.add-show-white .add-show-details h3{
    font-size: 18px;
    color: #222222;
    margin: 0 0 15px 0;
    font-weight: 700;
}
.add-show-white .add-show-details p{
    font-size: 12px;
    color: #222222;
    margin: 0 0 15px 0;
    font-weight: 500;
    margin-top : -10px;
}
.add-show-white .add-show-details img{
    width : 100px;
    height : 30px;
}
/*--------------------------------------------------------------
# Feature
--------------------------------------------------------------*/
.feature .feature-body{
    text-align : center;
}
.feature .feature-body .feature-head{
    font-size: 24px;
    color: #222222;
    font-weight: 700;
}

.feature .feature-body .feature-des{
    font-size: 18px;
    color: #222222;
    font-weight: 300;
}

.feature .feature-body .feature-body-des .f1{
    border : 1px solid rgba(0, 0, 0, 0.1);
    border-radius : 10px;
    position : relative;
    height : 70px;
    margin-bottom : 20px;
}
.feature .feature-body .feature-body-des .f1 .f1-p1{
    width : 80%;
    position : absolute;
    left : 0;
    text-align : right;
    padding : 10px;
    font-size: 14px;
    color: #222222;
    font-weight: 300;
}

.feature .feature-body .feature-body-des .f1 .f1-p2{
    width : 20%;
    color : #fff;
    position : absolute;
    right : 0;
    background : #093d82;
    border-top-right-radius: 10px;
    border-bottom-right-radius : 10px;
    height : 70px;
    font-size: 35px;
    font-weight: 800;
    text-align : center;
    padding-top : 5px;
}


.feature .feature-body .feature-body-des .f2{
    border : 1px solid rgba(0, 0, 0, 0.1);
    border-radius : 10px;
    position : relative;
    height : 70px;
    margin-bottom : 20px;
}
.feature .feature-body .feature-body-des .f2 .f2-p1{
    width : 20%;
    color : #fff;
    position : absolute;
    left : 0;
    background : #093d82;
    border-top-left-radius: 10px;
    border-bottom-left-radius : 10px;
    height : 70px;
    font-size: 35px;
    font-weight: 800;
    text-align : center;
    padding-top : 5px;
}

.feature .feature-body .feature-body-des .f2 .f2-p2{
    width : 80%;
    position : absolute;
    right : 0;
    text-align : left;
    padding : 10px;
    font-size: 14px;
    color: #222222;
    font-weight: 300;
}

/*--------------------------------------------------------------
# Features-Red
--------------------------------------------------------------*/

.feature .feature-body .feature-des{
    font-size: 18px;
    color: #222222;
    font-weight: 300;
}

.feature .feature-body .feature-body-des-red .f1{
    border : 1px solid rgba(0, 0, 0, 0.1);
    border-radius : 10px;
    position : relative;
    height : 70px;
    margin-bottom : 20px;
}
.feature .feature-body .feature-body-des-red .f1 .f1-p1{
    width : 80%;
    position : absolute;
    left : 0;
    text-align : right;
    padding : 10px;
    font-size: 14px;
    color: #222222;
    font-weight: 300;
}

.feature .feature-body .feature-body-des-red .f1 .f1-p2{
    width : 20%;
    color : #fff;
    position : absolute;
    right : 0;
    background : #8B0000;
    border-top-right-radius: 10px;
    border-bottom-right-radius : 10px;
    height : 70px;
    font-size: 35px;
    font-weight: 800;
    text-align : center;
    padding-top : 5px;
}


.feature .feature-body .feature-body-des-red .f2{
    border : 1px solid rgba(0, 0, 0, 0.1);
    border-radius : 10px;
    position : relative;
    height : 70px;
    margin-bottom : 20px;
}
.feature .feature-body .feature-body-des-red .f2 .f2-p1{
    width : 20%;
    color : #fff;
    position : absolute;
    left : 0;
    background : #8B0000;
    border-top-left-radius: 10px;
    border-bottom-left-radius : 10px;
    height : 70px;
    font-size: 35px;
    font-weight: 800;
    text-align : center;
    padding-top : 5px;
}

.feature .feature-body .feature-body-des-red .f2 .f2-p2{
    width : 80%;
    position : absolute;
    right : 0;
    text-align : left;
    padding : 10px;
    font-size: 14px;
    color: #222222;
    font-weight: 300;
}




/*--------------------------------------------------------------
# How Works
--------------------------------------------------------------*/
.how-works .how-works-body{
    text-align : center;
}
.how-works .how-works-body .how-works-head h3 {
    font-size: 24px;
    color: #222222;
    font-weight: 700;
}

.how-works .how-works-body .how-works-des p {
    font-size: 18px;
    color: #222222;
    font-weight: 300;
}

.how-works .how-works-img img {
    max-width: 100%;
    max-height: 100vh;
}