/*---homepage hero section----*/

.hero {
    background-image: url('../../../Images/Hero-section/herobg4.jpg');
    background-repeat: no-repeat;
    height: 750px;
    background-size: cover;
    background-position: bottom;
}

.hero .row {
    padding: 3rem 10rem;
}

.hero-content-left {
    padding: 0 0 0 4.5rem;
}

.hero-content-right {
    padding: 0 0 0 4.5rem;
}

.hero-content-left h1,
.hero-content-right h1 {
    line-height: 44px;
    font-weight: 300;
}

.hero-content-left h1,
.hero-content-right h1 {
    color: #004e8e;
}


.hero-txt {
    font-size: 14px;
    line-height: 20px;
    color: #878787;
}

.sub-opt {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    margin: .5rem 0;
    background-color: #fff;
    border-radius: 19px;
    box-shadow: 1px 2px 0px 1px #e3e3e3;
    -webkit-box-shadow: 1px 2px 0px 1px #e3e3e3;
    -moz-box-shadow: 1px 2px 0px 1px #e3e3e3;
}

span.sub-txt {
    padding: 10px 20px;
    font-weight: 300;
    font-size: 16px;
    line-height: 20px;
    color: #a3a3a3;
}

a.sub-price {
    background-color: #004e8e;
    padding: 8px 15px 8px 10px;
    border-top-right-radius: 19px;
    border-bottom-right-radius: 19px;
    color: #fff;
    width: 25%;
    text-align: center;
}

a.sub-price:hover {
    text-decoration: none;
    background-color: #007bff;
    transition: background 1s ease-out;
    -webkit-transition: background 1s ease-out;
    -moz-transition: background 1s ease-out;
    -o-transition: background 1s ease-out;
}


.hero-entupo {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    padding: 0rem 0rem 1rem 12.5rem;
}

.entupo-circle {
    background: white;
    padding: 3px;
    border: 5px solid #004e8e;
    border-radius: 100%;
    text-align: center;
}

.entupo-inside {
    background-color: #004e8e;
    padding: 20px;
    border-radius: 100%;
    width: 180px;
    height: 180px;
    display: flex;
    justify-content: center;
    align-items: center;
}

a.hero-entupo-link {
    color: #fff;
    text-align: center;
}

a.hero-entupo-link:hover {
    text-decoration: none;
}

/*---responsive mobile---*/

@media (max-width: 320px) {
    .entupo-inside {
        width: 120px !important;
        height: 120px !important;
    }

    a.hero-entupo-link {
        font-size: 12px!important;
        line-height: 15px!important;
    }
}

@media (min-width: 321px) and (max-width: 500px) {
    .entupo-inside {
        width: 150px!important;
        height: 150px!important;
    }

    a.hero-entupo-link {
        font-size: 15px!important;
        line-height: 20px!important;
    }
}

@media (min-width: 320px) and (max-width: 450px) {
    .hero-content-left h1 {
        font-size: 1.3rem!important;
    }

    .hero-content-right h1 {
        font-size: 1.3rem!important;
    }
}



@media (max-width: 575px) {
    .entupo.row {
        padding: 2rem 0!important;
    }

    .entupo-inside {
        width: 200px;
        height: 200px;
    }

    .hero-entupo {
        justify-content: center;
        padding: 1rem;
    }

    a.hero-entupo-link {
        font-size: 1.2rem;
        line-height: 1.8rem;
    }

    .hero-content-left h1 {
        font-size: 1.6rem;
    }

    .hero-content-right h1 {
        text-align: left !important;
        font-size: 1.6rem;
        padding-left: 0 !important;
    }

    .hero-content-right p.hero-txt.text-right {
        text-align: left !important;
        padding-left: 0 !important;
    }
}


@media (min-width: 576px) and (max-width: 767px) {
    .hero-content-left h1 {
        font-size: 1.8rem;
    }

    .hero-content-right h1 {
        text-align: left !important;
        font-size: 1.8rem;
        padding-left: 0 !important;
    }

    .hero-content-right p.hero-txt.text-right {
        text-align:left!important;
        padding-left: 0!important;
    }
}

@media only screen and (max-width: 767px) and (orientation: portrait) {
    .hero {
        background-image: linear-gradient(to top, #f9fafb, #fefefe, #fcfdfd, #fbfcfc, #fafbfa, #f9fbfa, #f9fafb, #f9f9fa, #f9fafb, #f8fafb, #f8fbfb, #f8faf9);
        height: auto;    
    }
}

@media (max-width: 767px) {
    .hero .row {
        padding: 3rem 0rem 5rem 0rem;
    }


    .hero-content-left {
        margin-bottom: 3rem;
    }

    .hero-content-left,
    .hero-content-right {
        padding: 1rem;
    }

    a.sub-price {
        width: 30%;
    }

}

/*---responsive tablet---*/

@media (min-width: 768px) and (max-width: 899px) {

    .archive .basic-title > span:before,
    .archive .basic-title > span:after {
        width: 5rem;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hero .row {
        padding: 2rem 0rem;
    }

    .hero-content-right,
    .hero-content-left {
        padding: 0 0 0 2.5rem;
    }
}

/*---responsive large screens and other---*/

@media (min-width:992px) and (max-width: 1199px) {
    .hero .row {
        padding: 3rem 5rem;
    }
}

@media (min-width: 2050px) {
    .hero {
        height: 950px;
    }
}