/*---------------------------------------

  RESPONSIVE STYLES               

-----------------------------------------*/

@media screen and (min-device-width: 2500px) and (max-device-width: 2600px) { 

.main_banner .carousel-container {

    display: flex;

    align-items: center;

    position: absolute;

     bottom: auto; 

    top: 25%;

    left: 4%;

    right: 50px;

    width: 35%;

    }

    .mv_bg {

    padding: 115px;

   }

   #hero .carousel-item {

    background-size: cover;

    background-position: top center;

    background-repeat: no-repeat;

   }

   .align-center {

    position: absolute;

    top: -22%;

    bottom: -442px;

    left: 52%;

    right: 0;

    margin: auto;

/*    height: 6%;*/

  }

  .about {

    background-image: url(../img/images/about_bg.png);

    background-repeat: no-repeat;

    background-position: top;

    position: relative;

    margin-top: -62px;

    z-index: 99;

    height: auto;

    background-size: 100% 45%;

   }

   .facts_pos {

    position: absolute;

    top: 0;

    right: 0;

    z-index: 999;

    text-align: center;

    left: 0%;

   }

   .background {

    height: 50vh;

    }



    .main_banner {

    background-repeat: no-repeat;

    height: 700px;

    margin-top: 90px;

    background-size: 100%;

    }



}



@media screen and (min-device-width: 1901px) and (max-device-width: 2000px) { 

    .background {

    height: 60vh!important;

    }

    .circular .numb {

    font-size: 14px;

    }

    .main_banner .carousel-container {

    display: flex;

    align-items: center;

    position: absolute;

     bottom: auto; 

    top: 35%;

    left: 50px;

    right: 50px;

    width: 35%;

    }

    .mv_bg {

    padding: 115px;

   }

   .about {

    background-image: url(../img/images/about_bg.png);

    background-repeat: no-repeat;

    background-position: top;

    position: relative;

    margin-top: -65px;

    z-index: 99;

    height: auto;

    background-size: 100%;

    }

    #hero .carousel-item {

    background-size: cover;

    background-position: top center;

    background-repeat: no-repeat;

    }

    .align-center {

    position: absolute;

    top: -22%;

    bottom: -316px;

    left: 53%;

    right: 0;

    margin: auto;

    /* height: 6%; */

    }

    .bdr_bottom {

    content: '';

    position: absolute;

    left: 51%;

    transform: translateX(-50%);

    width: 100%;

    max-width: 1010px;

    bottom: -5px;

    height: 4px;

    background: linear-gradient(to right, #68d366 0%, #68d366 41%, #68d366 10%, rgb(21 213 110 / 85%) 18%, #00b2c9 64%, #00b2c9 100%);

    /* background: #68d366; */

    }

    .facts_pos {

    position: absolute;

    top: 0;

    z-index: 999;

    text-align: center;

    left: 0%;

    right: 0;

    }

    .main_banner {

    background-repeat: no-repeat;

    height: 700px;

    margin-top: 90px;

    background-size: 100%;

    }

}





@media screen and (min-device-width: 1600px) and (max-device-width: 1900px) { 

    .background {

    height: 60vh!important;

    }

    .circular .numb {

    font-size: 14px;

    }

    .main_banner .carousel-container {

    display: flex;

    align-items: center;

    position: absolute;

     bottom: auto; 

    top: 35%;

    left: 50px;

    right: 50px;

    width: 35%;

    }

    .mv_bg {

    padding: 115px;

   }

   .about {

    background-image: url(../img/images/about_bg.png);

    background-repeat: no-repeat;

    background-position: top;

    position: relative;

    margin-top: -65px;

    z-index: 99;

    height: auto;

    background-size: 100%;

    }

    #hero .carousel-item {

    background-size: cover;

    background-position: top center;

    background-repeat: no-repeat;

    }

    .align-center {

    position: absolute;

    top: -22%;

    bottom: -316px;

    left: 58%;

    right: 0;

    margin: auto;

/*    height: 6%;*/

    }

    .bdr_bottom {

    content: '';

    position: absolute;

    left: 51%;

    transform: translateX(-50%);

    width: 100%;

    max-width: 1010px;

    bottom: -5px;

    height: 4px;

    background: linear-gradient(to right, #68d366 0%, #68d366 41%, #68d366 10%, rgb(21 213 110 / 85%) 18%, #00b2c9 64%, #00b2c9 100%);

    /* background: #68d366; */

    }

    .facts_pos {

    position: absolute;

    top: 0;

    z-index: 999;

    text-align: center;

    left: 0%;

    right: 0;

    }

    .main_banner {

    background-repeat: no-repeat;

    height: 620px;

    margin-top: 90px;

    background-size: 100%;

    }

}

@media screen and (min-device-width: 1380px) and (max-width: 1599px) {

    .facts_pos {

    position: absolute;

    top: 0;

    z-index: 999;

    text-align: center;

    left: 0;

    right: 0;

    }

    .background {

    height: 80vh;

    }

    .about {

    background-size: contain;

   }

   .bdr_bottom {

    content: '';

    position: absolute;

    left: 51%;

    transform: translateX(-50%);

    width: 100%;

    max-width: 1015px;

    bottom: -5px;

    height: 4px;

    background: linear-gradient(to right, #68d366 0%, #68d366 41%, #68d366 10%, rgb(21 213 110 / 85%) 18%, #00b2c9 64%, #00b2c9 100%);

    /* background: #68d366; */

   }

   .mv_bg {

    padding: 115px;

    }

    .main_banner .carousel-container {

    top: 0;

    }

    .circular .numb {

    font-size: 14px;

    }

    #hero .carousel-item {

    background-size: cover;

    background-position: top center;

    background-repeat: no-repeat;

    }

    .align-center {

    position: absolute;

    top: -41%;

    bottom: -453px;

    left: 60%;

    right: 0;

    margin: auto;

/*    height: 6%;*/

    }

    .main_banner {

    height: 525px!important;

    

    }

  

}



@media (max-width:1366px) and (min-height:768px){
    .navbar a, .navbar a:focus {
        font-size: 16px !important;
    }
.align-center {

    position: absolute;

    top: -22%;

    bottom: -240px;

    left: 41%;

    right: 0;

    margin: auto;

/*    height: 6%;*/

}

#hero {

  width: 100%;

  height: 80vh;

  background-color: rgba(4, 12, 21, 0.8);

  overflow: hidden;

  position: relative;

}

.about {

   

    margin-top: -65px;

   

}

}

@media (max-width:1025px) and (min-height:1365px){

#hero {

    height: 45vh!important;

    }

}



@media (max-width:1025px) and (max-height:600px){



.background {

    height: 115vh!important;

}

.align-center {

    position: absolute;

    top: -22%;

    bottom: -300px!important;

    left: 55%!important;

    right: 0;

    margin: auto;

}



}



@media (max-width:1280px){

.our-project-wrapper .project-card{

    height: 335px;

}

}



@media (max-width:1025px){



    #footer .footer-top .footer-links ul li {

    white-space: break-spaces;

    padding: 6px 0;

    display: flex;

    align-items: baseline;

    font-family: "Poppins", sans-serif;

    align-items: center;

    }



    #footer .footer-top .footer-links ul a {

    color: #201f1f;

    transition: 0.3s;

    display: inline-block;

    line-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;

    }



    .facts_pos {

    left: 2%;

    }

    .pulse-effect {

    top: 11%;

    left: 33%;

    }

    .testimonials .testimonial-wrap {

    /* padding-left: 90px; */

    width: 500px;

    margin: auto;

    }

    .main_banner .carousel-container {

    display: flex;

    align-items: center;

    position: relative;

    bottom: 0;

    top: 150px;

    left: 13px;

    right: 50px;

    width: 44%;

    }

    .main_banner {

    background-repeat: no-repeat;

    height: 380px;

    margin-top: 90px;

    background-size: 100%;

    }

    .mv_bg {

    background-image: url(../img/db_circle.png);

    background-size: 100%;

    background-position: center;

    background-repeat: no-repeat;

    margin: 20px;

    padding: 25px 34px;

    }

    .circular .numb {

    font-size: 13px;

    }

    .value_wrap {

    height: 380px;

    }

    .inners_item {

    width: 400px;

    padding: 34px;

    background-color: #f8f9fa;

    margin: auto;

    }

    #hero {

    height: 80vh;

    }

    .section-title_abt h3 {

    font-size: 30px;

    }

    .section-title_abt h3 span {

    font-size: 60px;

    }

    .section-title_abt {

    padding: 15px 20px;

    }

    .install_process .section-title_facts h2 span {

    font-size: 60px;

    }

    .install_process .section-title_facts h2 {

        font-size: 30px;

    }

    .srvice_heading span {

        font-size: 60px;

    }

    .srvice_heading {

        font-size: 30px;

    }

    .facts_txt {

    height: 350px;

    }

    .background {

    height: 84vh;

    }

    .about_card .inner_card_txt {

    padding: 20px 10px;

    text-align: justify;

    }

    .align-center {

    position: absolute;

    top: -22%;

    bottom: -240px;

    left: 55%;

    right: 0;

    margin: auto;

   

    }

    .about_card .carrd_inner_img img {

    height: 200px;

    }



    .thought_wrapper .circle-img {

    height: 230px;

    width: 100%;

    /* overflow: hidden; */

    /* border-left: 6px solid #02934f; */

    position: relative;

    border-radius: 50%;

    /* margin: auto; */

    padding: 5px;

    z-index: 3;

    background-color: #ffffff;

}

    



/*    kalpana*/



.about .content h5 {

    font-size: 21px !important;

   

}

.product_slider .owl-carousel .owl-item img{

    width: 95%;

    height:315px;

}



.btn-learn-more{

    left: 15% ;

    top: -21px;

}

.fof h3 {

    font-size: 137px;

  

}

.product_slider .owl-carousel .owl-prev {

    position: absolute;

    left: -27px;

    top: 32%;

    font-size: 57px!important;

}



.product_slider .owl-carousel .owl-next {

    position: absolute;

    right: -27px;

    top: 32%;

    font-size: 57px!important;

}

.hero{

    height: 380px;

    margin-top: 90px;

}

.hero-content h1 {

    font-size: 27px;

}

}

@media screen and (max-width: 991px) {

    #hero {

    height: 50vh!important;

    }

    .about .content h5 {

    padding: 30px 20px;

    }

    .card_box .mt-4{

        margin-top: 0px!important;

    }

    .card_box {

    margin-top: 0px;

    }

    .pulse-effect {

    top: 13%;

    left: 33%;

    }

    .about_card {

    height: 600px;

    }

    .water_magement_sec.mt-4 {

    margin-top: 0rem!important;

    }

    .shapes_des {

   

    display: none;

    }

    .shapes_des_3rd {

        display: none;

    }

    .shapes_des_4th {

        display: none;

    }

    .bdr_bottom {

        display: none;

    }

    .gradient-box {

    padding: 15% 0em;

   

    }



    .background {

    height: 1160px;

    }

    .facts .icon-box {

    margin-top: 30px;

    }

    

   .rain_water{

    width: 100%;

    overflow: hidden;

    }

    #hero .carousel-container {

    width: 50%;

    }

    #hero p {

    font-size: 25px;

    margin:0;

    }

    .testimonials .testimonial-wrap {

    /* padding-left: 90px; */

    width: 100%;

    }

    .facts_pos {

    left: 11%;

    }

    #hero .carousel-control-next-icon, #hero .carousel-control-prev-icon {

    display: none;

    }



    #hero .carousel-container {

    text-align: left;

    top: 74px;

    left: 5px;

    }



    .main_banner {

    background-repeat: no-repeat;

    height: 300px;

    background-size: cover;

    width: 100%;

    }

    .main_banner .carousel-container {

    display: flex;

    align-items: center;

    position: relative;

    bottom: 0;

    top: 82px;

    left: 10px;

    right: 50px;

    width: 50%;

    }

    .main_banner h2 {

    color: #00c7d4;

    margin: 0;

    font-size: 30px;

    font-weight: 400;

    font-family: 'black_ocean_threeregular';

    letter-spacing: 4px;

    }

    .main_banner p {

    -webkit-animation-delay: 0.4s;

    animation-delay: 0.4s;

    color: #fff;

    margin-top: 0px;

    font-size: 18px;

    line-height: 35px;

    }

    .circular {

    height: 100px;

    width: 100px;

    /* background: #c8c7cc; */

    position: relative;

    transform: scale(2);

    margin: 0 auto;

    margin-block: 40px;

    margin-bottom: 60px;

    }

    .circular .numb {

    font-size: 10px;

    }



    .mv_bg {

    background-image: url(../img/db_circle.png);

    background-size: 100%;

    background-position: center;

    background-repeat: no-repeat;

    margin: 20px;

    padding: 10px 20px;

    }



    .mv_image {

    width: 40px;

    height: 40px;

    text-align: center;

    margin: auto;

    border-radius: 50%;

    border: 5px solid #00a3bd;

    padding: 2px;

    background: #00a3bd;

    }



    .MV_parent h1 {

    color: #00b0fd;

    display: inline-block;

    position: relative;

    /* width: fit-content; */

    margin: auto;

    font-size: 20px;

     padding: 2px; 

    transition: 0.5s ease all;

    }

    .MV_parent p {

    padding: 10px;

    line-height: 16px;

    font-family: 'Open Sans';

    font-size: 10px;

    color: grey;

    text-align: center;

    }

    .MV_parent {

    /* box-shadow: 1px 1px 6px -1px #00b0fd; */

    padding: 2px;

    margin: 40px;

    transition: 0.5s ease all;

    }

    .value_wrap {

    height: 450px;

    }

    .about_us {

    padding-block: 0px;

    }

    .section-title_abt h3 {

    font-size: 30px;

    }

    .section-title_abt h3 span {

    font-size: 60px;

    }

    .section-title_abt {

    padding: 15px 20px;

    }

    .install_process .section-title_facts h2 span {

    font-size: 60px;

    }

    .install_process .section-title_facts h2 {

        font-size: 30px;

    }

    .srvice_heading span {

        font-size: 60px;

    }

    .srvice_heading {

        font-size: 30px;

    }

    #hero .carousel-item {

    background-size: cover;

    background-position: top center;

    background-repeat: no-repeat;

    }

    .error {

    width: 100%!important;

    }



    .thought_wrapper .circle-img {

    height: 165px;

    width: 100%;

   

    position: relative;

    border-radius: 50%;

    /* margin: auto; */

    padding: 5px;

    z-index: 3;

    background-color: #ffffff;

    }



    .thought_wrapper .circle-img::before {

    position: absolute;

    content: " ";

    height: 100px;

    width: 100px;

    bottom: -4px;

    right: 43px;

    border-radius: 13px;

    opacity: 0.3;

    background: #00924e;

    z-index: -1;

    }

    

    img.wrappedimg {

    float: left;

    margin: 15px;

    width: 100%;

    }

    .hero{

        height: 300px;

        margin-top: 90px;

    }



.hero-content h1 {

    font-size: 18px;

} 

.hero-content p {

    font-size: 14px;

    max-width: 600px;

}

.hero-btn {

    padding: 10px 15px;

}

.featured-project-wrapper h2{

    font-size: 30px;

}

.featured-project-wrapper span {

     font-size: 60px; 

}



.project-details-wrapper .project-inner {

    max-height: 100%;

    overflow-y: scroll;

}

.our-project-wrapper h3 {

     font-size: 30px;

}

.our-project-wrapper span {

     font-size: 60px; 

}



.our-project-wrapper .project-card {

    height:100%;

}

.our-project-wrapper .project-card p{

    padding-bottom: 10px;

}

.our-approach-wrapper h3 {

    font-size: 30px;

}

.our-approach-wrapper span {

    font-size: 60px;

}

.our-approach-wrapper .approach-card{

    margin-bottom: 30px;

}

.faq-wrapper h3 {

   font-size: 30px; 

}

.faq-wrapper .highlight {

       font-size: 60px;

}

 

}

/*end 991*/

@media  (max-width:820px){

    .facts_pos {

    left: 7%;

    }

    



}

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

 .facts_pos {

    left: 3%;

    }

    /*.about_card {

    height: 550px;

    }*/

    .tamilnadu-img-wrapper .tamilnadu-img{
        margin-top: 20px;
    }

}

/*767 end*/









/*676*/

@media screen and (max-width: 676px) {

.thought_wrapper .leader_detail {

    margin-inline: 0px;

    text-align: left;

    margin-top: 10px;

}



.city-service{

  padding:10px 0px;

}



.about_service span {

    font-family: 'black_ocean_threeregular';

    font-size: 50px;

}



.about_service h2 {

    color: #4dc7f5;

    font-weight: 400;

    font-size: 45px;

    text-align: center;

    font-size: 25px;

}



.about_service {

    background-color: #e8f9fb;

    padding: 15px 15px;

    border-radius: 8px;

    box-shadow: -2px 1px 10px 3px #e8f9fb;

}

.mob_dis{

    display:none;

}



#graph-new-container {

    height: 350px!important;

}



.arrow_card .section-title_facts h2 {

    font-weight: 500;

    font-size: 30px;

    text-align: center;

    color: #4dc7f5;

}



.arrow_card .section-title_facts h2 span {

    font-weight: 500;

    font-size: 50px;

    font-family: 'black_ocean_threeregular';

    text-align: center;

    color: #4dc7f5;

}



.thought_wrapper .leader-background {

    padding: 20px;

    margin-top:0;

   

}

.heading_left span {

    font-weight: 500;

    font-size: 65px!important;

    font-family: 'black_ocean_threeregular';

    text-align: center;

    color: #4dc7f5;

}

.chart_slice_offering ol, ul {

    padding-left: 20px;

}

.thought_wrapper .circle-img {

    height: auto;

}

.leader_detail .btn-read-more {

    margin-left: 20px;

}

.thought_wrapper .opposite .leader_detail .desig, .leader_detail .desig {

    color: #00c2dd;

    margin-block: 0;

    padding-block: 0px;

    font-size: 15px;

    /* margin-top: 10px; */

    /* line-height: 28px; */

    text-align: center;

}

.about .content h5 {

    font-size: 30px;

    color: #fff;

     padding: 0px; 

    /* float: right; */

    font-weight: 600;

    text-align: center;

}

.thought_leader_wrapper .thought_head span {

    font-family: 'black_ocean_threeregular';

    font-size: 50px;

}



.thought_leader_wrapper .thought_head h2 {

    color: #4dc7f5;

    font-weight: 400;

    font-size: 45px;

    text-align: center;

    font-size: 35px;

}

.product_slider{

    width: 90%;

    margin: 0 auto;

}



.product_slider .owl-carousel .owl-prev {

    position: absolute;

    left: -27px;

    top: 20%;

    font-size: 57px!important;

}



.product_slider .owl-carousel .owl-next {

    position: absolute;

    right: -27px;

    top: 20%;

    font-size: 57px!important;

}

.pulse-effect {

    background: url(../img/retas-logo_1.png) no-repeat;

    background-size: contain;

    height: 100px;

    width: 100px;

    border-radius: 100%;

    position: absolute;

    top: 170px;

    z-index: 99;

     left: auto; 

    right: 10%!important;

}

.numb1::before {

    content: "01";

    position: absolute;

    top: -27px;

    border: 1px solid #000;

    color: #000;

    font-size: 25px;

    padding: 2px 5px;

    right: 21px;

    font-weight: 600;

}



.numb2::before {

    content: "02";

    position: absolute;

    top: -27px;

    border: 1px solid #000;

    color: #000;

    font-size: 25px;

    padding: 2px 5px;

    right: 21px;

    font-weight: 600;

}

.numb3::before {

    content: "03";

    position: absolute;

    top: -27px;

    border: 1px solid #000;

    color: #000;

    font-size: 25px;

    padding: 2px 5px;

    right: 21px;

    font-weight: 600;

}

.numb4::before {

    content: "04";

    position: absolute;

    top: -27px;

    border: 1px solid #000;

    color: #000;

    font-size: 25px;

    padding: 2px 5px;

    right: 21px;

    font-weight: 600;

}

.about_card .carrd_inner_img h5 {

    font-size: 15px;

    text-transform: uppercase;

    height: auto;

    padding: 6px 8px;

    font-weight: 600;

    margin: 10px 0px;

    margin-bottom: 12px;

    color: #444444;

}

.about_card {

    height: auto;

}

.btn-learn-more {

    left: 28%;

}

.water_magement_sec .section-title_facts h2 {

    font-weight: 500;

    font-size: 30px;

    text-align: center;

    color: #4dc7f5;

    margin-bottom: 30px;

}

.shapes_des {

   

    display: none;

}

.shapes_des_3rd {

    display: none;

}

.shapes_des_4th {

    display: none;

}

.bdr_bottom {

    display: none;

}

.gradient-box {

    padding: 14% 0em;

   

}

.facts_txt {

    height: auto;

}

.background {

    height: 1460px;

}

.facts_pos {

   left: 0;

}

.facts .icon-box {

    margin-top: 25px;

}

.sector{

  padding:20px 0;

}

.facts{

  

  padding: 20px 0px;

}

.sector .section-title_facts h2 {

  font-size: 35px;

}

.sector .section-title_facts h2 span {

    font-size: 70px;

}

.facts .section-title_facts h2 {

    font-size: 35px;

}

.facts .section-title_facts h2 span {

    font-size: 70px;

}

.section-title_rewards h2 span {

    font-size: 70px;

}

.section-title_rewards h2 {

    font-size: 35px;

}



.section-title_scarcity h2 span {

    font-size: 50px;

}

.section-title_scarcity h2 {

    font-size: 30px;

}





.testimonials .testimonial-wrap {

    width: 100%;

}

.circle1 {

    display: none;

}

.section-bg {

    overflow: hidden;

}

.align-center {

    display: none;

}

#hero {

    height: 30vh!important;

    margin-top:70px;

}

#header .logo img {

    max-height: 60px;

}

.hero-waves {

    height: 60px;

}

#hero .carousel-control-next-icon, #hero .carousel-control-prev-icon {

    font-size: 14px;

    width: 30px;

    height: 30px;

}

.footer_bg {

    height: auto;

}

.designed_by {

    float: none;

}

#hero .carousel-container {

    text-align: left;

    top: 0;

    left: 5px;

}

#hero p {

    font-size: 12px;

    line-height: 15px;

    margin-bottom:0;

}



#hero h2 {

    font-size: 20px;

}

#hero .carousel-control-next-icon, #hero .carousel-control-prev-icon {

    display: none;

}



.main_banner .carousel-container {

    display: flex;

    align-items: center;

    position: relative;

    bottom: 0;

    top: 60px;

    left: 0px;

    right: 50px;

    width: 58%;

}

.main_banner p {

    -webkit-animation-delay: 0.4s;

    animation-delay: 0.4s;

    color: #fff;

    margin: 0px;

    font-size: 12px;

    line-height: 18px;

}



.main_banner h2 {

    color: #00c7d4;

    margin: 0;

    font-size: 20px;

    font-weight: 400;

    font-family: 'black_ocean_threeregular';

    letter-spacing: 4px;

}

.main_banner {

    background-repeat: no-repeat;

    height: 180px;

    margin-top: 70px;

    background-size: cover;

}



.mv_image {

    width: 40px;

    height: 40px;

    text-align: center;

    margin: auto;

    border-radius: 50%;

    border: 5px solid #00a3bd;

    padding: 2px;

    background: #00a3bd;

}

.MV_parent h1 {

    font-size: 22px;

     padding: 0; 

}

.MV_parent p {

    padding: 15px;

    line-height: 15px;

    font-family: 'Open Sans';

    font-size: 10px;

    color: grey;

    text-align: center;

}

.MV_parent {

    /* box-shadow: 1px 1px 6px -1px #00b0fd; */

    padding: 5px;

    margin: 0;

    transition: 0.5s ease all;

}



.mv_bg {

    margin: 20px;

    padding: 95px 49px;

}

.about_us h2 {

    font-size: 25px;

    color: #00b0fd;

}

.about_us span {

    color: skyblue;

    font-family: 'black_ocean_threeregular';

    font-weight: 500;

    font-size: 33px;

    text-align: center;

    color: #4dc7f5;

    margin: 0px;

}

#main1 {

    text-align: center;

    margin: 5px;

    color: white;

}



.circle{

    margin-top:70px;

}



.heading_milestone span {

    font-size: 45px;

}

.circular .numb {

    font-size: 10px;

}



.heading_core span {

    font-size: 50px;

}

.value_wrap {

    height: auto;

    margin-bottom: 25px;

}

.heading_client span {

    font-size: 45px;

}

.install_process .time-line .dates-wrap .date .date-content {

    visibility: hidden;

    position: absolute;

    width: 320px;

     height: 160px; 

    bottom: 0%;

    margin-bottom: 140px;

    border-radius: 3px;

    transform-origin: 50% 100%;

    transform: scale(0.7);

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0);

}

.install_process .controls {

    display: none;

}

.section-title_abt {

    padding: 15px 20px;

}

.section-title_abt h3 span {

    font-size: 45px;

}

.section-title_abt h3 {

    font-size: 25px;

}

.install_process .section-title_facts h2 span {

    font-size: 45px;

}

.install_process .section-title_facts h2 {

    font-size: 25px;

}

.srvice_heading span {

    font-size: 45px;

}

.srvice_heading {

    font-size: 25px;

}

.product_slider .owl-carousel .owl-item img {

    display: block;

    width: 100%;

    height: 170px;

}

.fof img {

    height: 100px!important;

}

.fof h3 {

    font-size: 100px!important;

    color: skyblue;

}

.error {

    width: 100%!important;

}

.about_card .carrd_inner_img img {

    height: 350px;

}

.section-title h2 {

    text-align: end;

}

.section-title h2::after {

    right: 40%;

}



.hero-btn {

    background: #00b7f6;

    color: #fff;

    padding: 10px 12px;

    font-size: 10px;

}



.hero{

    height: 180px;

    margin-top: 70px;

}

.hero-content h1 {

font-size:12px;

margin-top: 0px;

margin-bottom: 10px;

}

.hero-content p {

    font-size: 10px;

    margin-bottom: 7px;

}

.featured-project-wrapper h2{

    font-size: 25px;

}

.featured-project-wrapper span {

     font-size: 33px; 

}

.featured-project-wrapper .annual-saving p {

    font-size: 13px;

}

.project-details-wrapper .project-value {

    font-size: 12px;

}

.project-details-wrapper .project-label {

    font-size: 13px;

}

.project-details-wrapper .project-inner {

    max-height: 100%;

    overflow-y: scroll;

}

.our-project-wrapper h3 {

     font-size: 25px;

}

.our-project-wrapper span {

     font-size: 33px; 

}



.our-project-wrapper .project-card {

    height: 100%;

}

.our-project-wrapper .project-card p{

    padding-bottom: 10px;

}

.our-approach-wrapper h3 {

    font-size: 25px;

}

.our-approach-wrapper span {

    font-size: 33px;

}

.our-approach-wrapper .approach-card{

    margin-bottom: 30px;

}

.faq-wrapper h3 {

   font-size: 25px; 

}

.faq-wrapper .highlight {

       font-size: 33px;

}

.faq-wrapper .faq-question {

    font-size: 13px;

}

.faq-wrapper .custom-faq .accordion-body {

    font-size: 13px;

}
/* #footer .footer-top .footer-links ul a{
    display: contents; 
} */

}



@media (min-width:500px) and (max-width:600px){

#hero {

    height: 40vh!important;

    }

.mv_bg {

    margin: 20px;

    padding: 69px 49px;

    background-size: 70%;

}

.MV_parent {

    padding: 10px 83px;

    

}

.main_banner {

    height: 200px;

}

.main_banner .carousel-container {

    width: 42%;

}

.thought_wrapper .circle-img {

    height: 250px;

    width: 100%;

    position: relative;

    border-radius: 50%;

    /* margin: auto; */

    padding: 5px;

    z-index: 3;

    background-color: #ffffff;

}

}





@media screen and (max-width: 380px) {

   .mv_bg {

    margin: 20px;

    padding: 70px 49px;

} 

.background {

    height: 1580px;

}

}

@media screen and (max-width: 320px) {

.background {

    height: 1700px;

}

.main_banner h2 {

    color: #00c7d4;

    margin: 0;

    font-size: 15px;

    font-weight: 400;

    font-family: 'black_ocean_threeregular';

    letter-spacing: 4px;

}

.MV_parent p {

    padding: 5px 6px;

    line-height: 14px;

    font-family: 'Open Sans';

    font-size: 9px;

    color: grey;

    text-align: center;

}

.mv_image {

    width: 40px;

    height: 40px;

    text-align: center;

    margin: auto;

    border-radius: 50%;

    border: 5px solid #00a3bd;

    padding: 2px;

    background: #00a3bd;

}

.mv_bg {

    margin: 20px;

    padding: 35px 49px;

}

.install_process .time-line .dates-wrap .date .date-content {

    visibility: hidden;

    position: absolute;

    width: 300px;

    height: 160px;

    bottom: 0%;

    margin-bottom: 140px;

    border-radius: 3px;

    transform-origin: 50% 100%;

    transform: scale(0.7);

    box-shadow: 0 10px 30px rgba(0, 0, 0, 0);

}



.main_banner {

    background-repeat: no-repeat;

    height: 160px;

    margin-top: 90px;

    background-size: cover;

}

.hero{

height: 160px;

margin-top: 90px;

}

}