.lazy-load{opacity: 0;transition: opacity 0.5s ease-in-out;}
.lazy-load[src]{opacity: 1;}
.lazy-bg {
    min-height: 300px; /* Adjust height as needed */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;  /* Initially hidden */
    transition: opacity 0.5s ease-in-out;
}
.lazy-bg.loaded {opacity: 1;}
.btn_color{color: black !important;}
.text_holding{padding-top: 14px; text-align: center;}
.title_tank{margin-left: 15px; }
.pic_holder {height: 320px !important;}
.social_links {
   padding: 10px;
   display: flex;
   gap: 15px; 
   justify-content: center; 
}
.blog-section .date{
    font-weight: 400;
    color: #4f4f4f;
}

.features-section-s2 .grid {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 0px;
  border: 1px solid #ddd;
  border-radius: 10px;
  background: #03a9f40f;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  height: 300px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}

.features-section-s2 .grid:hover {
  transform: scale(1.05);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}

.features-section-s2 .grid img {
  margin-bottom: 10px;
  transition: transform 0.3s ease;
  z-index: 2;
}

.features-section-s2 .grid h3 {
    font-size: 18px;
    margin: 5px 0;
    color: #1e325b;
    z-index: 2;
    padding-bottom: 45px;
}

.features-section-s2 .grid p {
  font-size: 14px;
  color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  background: rgb(61 61 61 / 92%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px;
  height: 100%; 
  width: 100%; 
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  z-index: 3;
  overflow-y: auto;
}

.features-section-s2 .grid:hover img,
.features-section-s2 .grid:hover h3 {
  transform: translateY(-10px);
  z-index: 1;
}

.features-section-s2 .grid:hover p {
  opacity: 1;
  visibility: visible;
}


.service-single-content ol{
    padding-left:15px;
}
.service-single-section .service-single-content ul{
    padding-left:15px;
    list-style: disc;
}
.service-single-section .service-single-content ul li {
    padding-left: 0px;
}
.social_links a {
   padding: 10px;
   text-decoration: none;
   color: #fff; 
   transition: color 0.3s ease;
}
.social_links a:hover {
   color: #007bff;
}
.social_links span {
   font-size: 20px; 
}
.home_description{
  width: 100%;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 16;
  -webkit-box-orient: vertical;
}
.read_btn a{
   color:#ff5e15 !important;
}
.read_btn a:hover{
   color:#ff5e14 !important;
}
.recent_img{
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   width: 100%;
   height: 300px !important;
}
.theme_color{
   color:#ff5e15 !important;
}
.bg_theme{
   background-color: #ff5e15 !important;
}
.bg_theme:after{background-color: #ff5e15 !important;}

.dummy1 .dummy2 a:before{
   background-color: #ff5e15 !important;
}
.dummy2 .current a {
    color: #ff5e15 !important;
}
.dummy1 .dummy2 .current a {
    color: #ff5e15 !important;
}
.dummy1 .dummy2 .dummy3 a:hover {
    color: red !important;
}
.dummy1 .bg_theme:before{background: #ff5e15 !important;}
.bg_theme .hovering:after{color: red !important;}
.theme h2:before,.theme h2:after{background:#ff5e15 !important; }


.blog-sidebar .recent-post-widget .post .recent_post_bD img{
    border-radius: 0% !important;
}
.blog-sidebar .widget h3:before {
    background-color: #ff5e15;
    width: 4px;
    height: 16px;
    position: absolute;
    left: 0;
    top: 1px;
}
.preloader{
   background-color:#ff5e15 !important; 
}
.contact-pg-section .office-info:before {
    background-color: #ff5e15;
 }
 .img_bg{
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   width: 100%;
   height: 100%;
}
.footer_description{
  width: 100%;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
}
.header-style-2 .navbar-brand img {
    max-width: 240px;
}
.header-style-1 .navbar-brand, .header-style-2 .navbar-brand {
  margin-top: 0px;
}
.blog_title{
  width: 100%;
  overflow: hidden;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
   .infra_description ul{
      padding-left:40px !important;
   }
   .infra_description p{
      margin-top:1.6rem !important;
      margin-bottom:0.2rem !important;
   }
 .text-justify.whyChoose_description ol{
   padding-left: 15px;
}
.text-justify.aboutUs_description ul{
padding-left: 20px;
}
.home_description.about_page ul li {
   padding-left: 0;
   }
   .text-justify.whyChoose_description ol{
   padding-left: 15px;
   }
   .ellipse {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
   }
.blog-dest{
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
label#name-error, label#email-error , label#subject-error , label#mobile_number-error{
    display: none !important;
}   
.has-error small.help-block {
   color: red;
   font-size: 13px;
}
.has-error input.error{
   border-color: red;
}


/* Gallery */
.services-block-three {
    flex-wrap: wrap;
}
.related-image{
  margin-bottom: 10px !important;
  padding-top: 15px !important;
}
.services-block-three .col-xl-4, 
.services-block-three .col-lg-4, 
.services-block-three .col-md-6, 
.services-block-three .col-sm-12 {
    flex: 0 0 auto;
}

.img-box:hover .view-cls {
    visibility: visible;
}
.gallery_box {
    display: block;
    position: relative;
}
.gallery-img {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 67%;
    background-size: 100%;
    background-position: center;
}
.gallery-img .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    transition: opacity 0.3s ease;
}
.img-fluid {
    max-width: 100%;
}
.gallery_box:hover .overlay {
    opacity: 1;
}
.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background-color:#DF6512;
    color: white !important;
    display: flex;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s;
    text-align: center;
    padding: 10px 15px;
    width: 100%;
    height: auto;
}
.image-container:hover .overlay {
    opacity: 1;
}
.overlay p{
    color:white !important;
}
.view-cls {
    visibility: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #fff;
    font-size: 20px;
}
.img-box:hover .view-cls {
    visibility: visible;
}


/** header **/

.whatsappBtn {
  position: fixed;
  bottom:68px;
  right: 30px;
  width: 50px !important;
  height: 50px !important;
  z-index: 99;
  background-color: #0ba90b;
  font-size:27px;
  border-radius: 50%;
  color: #fff;
  box-shadow: 0px 0px 9px #00000094;
}
.whatsappBtn i{
    display: inline-block;
    background-color:#0BA90B;
    color: white;
    text-align: center;
    font-size: 27px;
    width: var(--btn-size, 50px) !important;
    height: var(--btn-size, 50px) !important;
    line-height: var(--btn-size, 50px) !important;
    z-index: 2;
    border-radius: inherit;
    position: relative;
    transition: all ease .8s;
}
.callBtn {
  position: fixed;
  bottom: 127px;
  right: 30px;
  width: 50px !important;
  height: 50px !important;
  z-index: 99;
  background-color: #2196f3;
  font-size: 25px;
  border-radius: 50%;
  color: #fff;
  box-shadow: 0px 0px 9px #00000094;
}
.callBtn i{
    display: inline-block;
    background-color:#2196F3;
    color: white;
    text-align: center;
    font-size: 21px;
    width: var(--btn-size, 50px) !important;
    height: var(--btn-size, 50px) !important;
    line-height: var(--btn-size,45px) !important;
    z-index: 2;
    border-radius: inherit;
    position: relative;
    transition: all ease .8s;
    padding-top:4px;
}
/* TAB VIEW */
@media (max-width: 991px) {
    .site-header .navbar-header button {
        background-color: #1f325b;
        width: 35px;
        height: 30px;
        border: 0;
        padding: 5px 10px;
        outline: 0;
        position: absolute;
        right: -4px;
        top: 14px !important;
        z-index: 20;
    }
    .about-us-section .about-image, .about-us-section-s2 .about-image {
        display: inline-block;
    }
}

/* MOBILE VIEW */
@media only screen and (max-width: 767px) 
{
    .site-header #navbar>ul>li{
        float: left;
        width: 100%;
    }
    .site-header #navbar>ul>li .sub-menu li{
        float: left;
        width: 100%;
    }
    .whatsappBtn {
      position: fixed;
      bottom:63px;
      right: 10px;
      width: 45px !important;
      height: 45px !important;
      z-index: 99;
      background-color: #0ba90b;
      font-size:24px;
      border-radius: 50%;
      color: #fff;
      box-shadow: 0px 0px 9px #00000094;
    }
    .whatsappBtn i{
        display: inline-block;
        background-color:#0BA90B;
        color: white ;
        text-align: center;
        font-size: 24px;
        width: var(--btn-size, 45px) !important;
        height: var(--btn-size, 45px) !important;
        line-height: var(--btn-size, 45px) !important;
        z-index: 2;
        border-radius: inherit;
        position: relative;
        transition: all ease .8s;
    }
    .callBtn {
      position: fixed;
      bottom: 116px;
      right: 10px;
      width: 45px !important;
      height: 45px !important;
      z-index: 99;
      background-color: #2196f3;
      font-size: 24px;
      border-radius: 50%;
      color: #fff;
      box-shadow: 0px 0px 9px #00000094;
    }
    .callBtn i{
        display: inline-block;
        background-color:#2196F3;
        color: white;
        text-align: center;
        font-size: 20px;
        width: var(--btn-size, 45px) !important;
        height: var(--btn-size, 45px) !important;
        line-height: var(--btn-size,36px) !important;
        z-index: 2;
        border-radius: inherit;
        position: relative;
        transition: all ease .8s;
        padding-top:4px;
    }
    .about_page ul li{padding-left: 0px !important;}
    .header-style-1 .topbar, .header-style-2 .topbar{
        display: block !important;
        padding: 2px 0 10px;
        padding-bottom: 2px;
    }
    .header-style-1 ul, .header-style-2 ul{
        width: 100%;
        float: left;
        display: block;
    }
    .header-style-1 .contact-info ul li, .header-style-2 .contact-info ul li{
        width: 50%;
        float: left !important;
        font-size: 13px;
    }
    .header-style-1 .contact-info ul li, .header-style-2 .contact-info ul li:nth-child(3){
        display: none;
    }
    .hero-style-2 {
        height: 310px !important;
        min-height: 300px !important;
    }
    .hero-slider .slide-title h2 {
        background-color: #1e325b;
        text-shadow: 1px 1px 2px #000000bf;
        font-size: 22px;
        padding: 7px 5px 10px 7px;
        text-transform: uppercase;
        font-weight: 500;
    }
    .hero-slider .container{
        margin-top: -214px;
        width: 100%;
        padding: 0px;
    }
    .hero-slider .slide-text p{
        background: #ffffff6b;
        font-size: 13px;
        padding: 2px 5px;
        margin-top: -13px;
        color: #1e325b;
    }
    .theme-btn, .theme-btn-s2, .submit-btn {
        padding: 8px 11px;
        font-size: 12px;
        display: none;
    }
    .header-style-2 .navbar-brand img {
        max-width: 190px;
    }
    .header-style-2 .navigation{
        padding-top:0px;
    }
    .features-section-s2{
        margin: 30px 0;
    }
    .about-us-section-s2{
        padding-top:0px !important;
    }
    .site-footer .lower-footer .copyright{
        margin-bottom:0px;
    }
    #infra-owl.owl-carousel .owl-item img {
        width: 100%;
        height: 300px!important;
        object-fit: cover;
        object-position: center;
    }
    .features-section-s2 .grid{
        height: 230px;
    }
}
@media (max-width: 1200px) {
    .contact-btn .theme-btn{
        padding: 15px 25px 15px 17px !important;
    }
}
