:root {

/*    --primary: #1E60AA;*/

    --primary: #8e7861;

    --secondary: #FF4917;

    --light: #EDF1FC;

    --dark: #262626;

    --text-black:#3b3a3a;

    --red:#ff0707;

    

}

.custom-text-secondary

{

    color: var(--red);

}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6

{

    color: #000;

}

.custom-bg-dark

{

    background-color: #000;

}

.fw-medium {

    font-weight: 600 !important;

}



.back-to-top {

    position: fixed;

    display: none;

    right: 45px;

    bottom: 45px;

    z-index: 99;

    background-color: var(--red);

    border: 1px solid var(--red);

    color: #fff;

}





/*** Spinner ***/

#spinner {

    opacity: 0;

    visibility: hidden;

    transition: opacity .5s ease-out, visibility 0s linear .5s;

    z-index: 99999;

}



#spinner.show {

    transition: opacity .5s ease-out, visibility 0s linear 0s;

    visibility: visible;

    opacity: 1;

}



.text-end

{

    color: var(--text-black);

    font-size: 13px;

}



.text-end .fa-phone

{

    transform: rotate(130deg);

}

/*** Button ***/

.btn {

    font-weight: 600;

    transition: .5s;

}

.custom-btn-primary

{

    background-color: var(--red);

    color: #fff;

   

}

.custom-btn-secondary

{

    background-color:#000;

    color: #fff;

  

}

.btn.btn-primary,

.btn.btn-secondary {

    color: #FFFFFF;

}



.btn-square {

    width: 38px;

    height: 38px;

}



.btn-sm-square {

    width: 32px;

    height: 32px;

}



.btn-lg-square {

    width: 48px;

    height: 48px;

}



.btn-square,

.btn-sm-square,

.btn-lg-square {

    padding: 0;

    display: flex;

    align-items: center;

    justify-content: center;

    font-weight: normal;

}





/*** Navbar ***/

.top-bar {

    height: 55px;

    padding: 0 4rem;

    background: #fff;

}



.nav-bar {

    position: absolute;

    padding: 0 4.75rem;

    transition: .5s;

    z-index: 9999;

    background-color: transparent;

}

.navbar-brand img

{

    width: 130px;

}

.navbar-brand h2 

{

    color:#fff!important;

    position: relative;

}

.navbar-brand h2:after 

{

       content: '';

    background-color: #a97300;

    width: 8px;

    height: 8px;

    position: absolute;

    bottom: 8px;

    /* right: 5px; */

    margin-left: 5px;

}

nav 

{

    border-radius: 0px 0px 30px 30px;

/*    border: 3px solid #ddd;*/

    border-top: 0px;

    background-color:#282828 !important;

}



.nav-bar.sticky-top {

    position: sticky;

    padding: 0;

    z-index: 9999;

    border-radius: 0px 0px 25px 25px;

}



.navbar .dropdown-toggle::after {

    border: none;

    content: "\f107";

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    vertical-align: middle;

    margin-left: 8px;

}



.navbar-light .navbar-nav .nav-link {

    margin-right: 30px;

    padding: 0px 0;

    color: #fff;

    font-size: 14px;

    font-weight: 600;

    text-transform: uppercase;

    outline: none;

}



.navbar-light .navbar-nav .nav-link:hover,

.navbar-light .navbar-nav .nav-link.active {

    color:var(--red);

    font-weight: bolder;

}



@media (max-width: 991.98px) {

    .nav-bar {

        padding: 0;

    }



    .navbar-light .navbar-nav .nav-link  {

        margin-right: 0;

        padding: 10px 0;

    }



    .navbar-light .navbar-nav {

        margin-top: 1rem;

        padding-top: 1rem;

        border-top: 1px solid #EEEEEE;

    }

}



@media (min-width: 992px) {

    .navbar .nav-item .dropdown-menu {

        display: block;

        border: none;

        margin-top: 0;

        top: 150%;

        opacity: 0;

        visibility: hidden;

        transition: .5s;

    }



    .navbar .nav-item:hover .dropdown-menu {

        top: 100%;

        visibility: visible;

        transition: .5s;

        opacity: 1;

    }

}





/*** Header ***/

.header-carousel .container,

.page-header .container {

    position: relative;

    padding: 45px 0 45px 35px;

    border-left: 15px solid #FFFFFF;

}



.header-carousel .container::before,

.header-carousel .container::after,

.page-header .container::before,

.page-header .container::after {

    position: absolute;

    content: "";

    top: 0;

    left: 0;

    width: 100px;

    height: 15px;

    background: #FFFFFF;

}



.header-carousel .container::after,

.page-header .container::after {

    top: 100%;

    margin-top: -15px;

}



@media (max-width: 768px) {

    .header-carousel .owl-carousel-item {

        position: relative;

        min-height: 500px;

    }

    nav 

    {

        background-color: #fff!important;

    }

    .navbar-light .navbar-toggler {

    color: #000!important;

    }

    .navbar-light .navbar-nav .nav-link

    {

        color: #000!important;

    }

    .navbar-light .navbar-toggler

    {

        color: #fff;

    }

    

    .header-carousel .owl-carousel-item img {

        position: absolute;

        width: 100%;

        height: 100%;

        object-fit: cover;

    }



    .header-carousel .owl-carousel-item h5,

    .header-carousel .owl-carousel-item p {

        font-size: 14px !important;

        font-weight: 400 !important;

    }



    .header-carousel .owl-carousel-item h1 {

        font-size: 30px;

        font-weight: 600;

    }

}



.header-carousel .owl-nav {

    position: absolute;

    top: 50%;

    right: 8%;

    transform: translateY(-50%);

    display: flex;

    flex-direction: column;

}



.header-carousel .owl-nav .owl-prev,

.header-carousel .owl-nav .owl-next {

    margin: 7px 0;

    width: 45px;

    height: 45px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #FFFFFF;

    background: transparent;

    border: 1px solid #FFFFFF;

    border-radius: 45px;

    font-size: 22px;

    transition: .5s;

}



.header-carousel .owl-nav .owl-prev:hover,

.header-carousel .owl-nav .owl-next:hover {

    background: var(--primary);

    border-color: var(--primary);

}



.page-header {

    background: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)), url(../img/bg.jpg) center center no-repeat;

    background-size: cover;

}



.breadcrumb-item + .breadcrumb-item::before {

    color: var(--light);

}





/*** Facts ***/

.fact {

    background: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)), url(../img/bg.jpg) center center no-repeat;

    background-size: cover;

}





/*** Service ***/

.service-top img {

    transition: .5s;

}
.service-top .bg-light
{
    height:300px;
}
.left-bar

{



    background-color: var(--red);

}

.service-box p

{

    overflow: hidden;

text-overflow: ellipsis;

display: -webkit-box;

-webkit-line-clamp: 3;

-webkit-box-orient: vertical;

}

.service-box h4 

{

    height: 65px;

}

.service-top:hover img {

    transform: scale(1.1);

}



.service-carousel .owl-dots {

    margin-top: 24px;

    display: flex;

    align-items: flex-end;

    justify-content: center;

}



.service-carousel .owl-dot {

    position: relative;

    display: inline-block;

    margin: 0 5px;

    width: 15px;

    height: 15px;

    background: var(--primary);

    border: 5px solid var(--light);

    transition: .5s;

}



.service-carousel .owl-dot.active {

    background: var(--light);

    border-color: var(--primary);

}





/*** Booking ***/

.video {

    position: relative;

    padding: 8rem 0 12rem 0;

    background: linear-gradient(rgba(0, 0, 0, .4), rgba(0, 0, 0, .4)), url(../img/carousel-1.jpg) center center no-repeat;

    background-size: cover;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

}



.video .btn-play {

    position: relative;

    box-sizing: content-box;

    display: block;

    width: 32px;

    height: 44px;

    border-radius: 50%;

    border: none;

    outline: none;

    padding: 18px 20px 18px 28px;

    margin-bottom: 4rem;

}



.video .btn-play:before {

    content: "";

    position: absolute;

    z-index: 0;

    left: 50%;

    top: 50%;

    transform: translateX(-50%) translateY(-50%);

    display: block;

    width: 100px;

    height: 100px;

    background: #FFFFFF;

    border-radius: 50%;

    animation: pulse-border 1500ms ease-out infinite;

}



.video .btn-play:after {

    content: "";

    position: absolute;

    z-index: 1;

    left: 50%;

    top: 50%;

    transform: translateX(-50%) translateY(-50%);

    display: block;

    width: 100px;

    height: 100px;

    background: #FFFFFF;

    border-radius: 50%;

    transition: all 200ms;

}



.video .btn-play img {

    position: relative;

    z-index: 3;

    max-width: 100%;

    width: auto;

    height: auto;

}



.video .btn-play span {

    display: block;

    position: relative;

    z-index: 3;

    width: 0;

    height: 0;

    border-left: 32px solid var(--primary);

    border-top: 22px solid transparent;

    border-bottom: 22px solid transparent;

}



@keyframes pulse-border {

    0% {

        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1);

        opacity: 1;

    }



    100% {

        transform: translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);

        opacity: 0;

    }

}



#videoModal {

    z-index: 99999;

}



#videoModal .modal-dialog {

    position: relative;

    max-width: 800px;

    margin: 60px auto 0 auto;

}



#videoModal .modal-body {

    position: relative;

    padding: 0px;

}



#videoModal .close {

    position: absolute;

    width: 30px;

    height: 30px;

    right: 0px;

    top: -30px;

    z-index: 999;

    font-size: 30px;

    font-weight: normal;

    color: #FFFFFF;

    background: #000000;

    opacity: 1;

}



.bootstrap-datetimepicker-widget.bottom {

    top: auto !important;

}



.bootstrap-datetimepicker-widget .table * {

    border-bottom-width: 0px;

}



.bootstrap-datetimepicker-widget .table th {

    font-weight: 500;

}



.bootstrap-datetimepicker-widget.dropdown-menu {

    padding: 10px;

    border-radius: 2px;

}



.bootstrap-datetimepicker-widget table td.active,

.bootstrap-datetimepicker-widget table td.active:hover {

    background: var(--primary);

}



.bootstrap-datetimepicker-widget table td.today::before {

    border-bottom-color: var(--primary);

}

.font-color

{

    color:var(--red);

}

/*** About ***/

.text-justify

{

    text-align: justify;

}

.abt-img img:nth-child(2)

{

    border-top: 3px solid;

    border-right: 3px solid;

}

/*** Team ***/

.team-item img {

    transition: .5s;

}



.team-item:hover img {

    transform: scale(1.1);

}



.team-item .team-text {

    height: 90px;

    overflow: hidden;

}



.team-item .team-text .bg-light,

.team-item .team-text .bg-primary {

    position: relative;

    height: 90px;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-direction: column;

    transition: .5s;

}



.team-item .team-text .bg-primary {

    flex-direction: row;

}



.team-item:hover .team-text .bg-light {

    margin-top: -90px;

}



.team-item .team-text .bg-primary .btn {

    color: var(--primary);

    background: #FFFFFF;

}



.team-item .team-text .bg-primary .btn:hover {

    color: #FFFFFF;

    background: var(--secondary)

}





/*** Testimonial ***/

.testimonial-carousel .owl-item .testimonial-text,

.testimonial-carousel .owl-item.center .testimonial-text * {

    position: relative;

    transition: .5s;

}



.testimonial-carousel .owl-item.center .testimonial-text {

    background: var(--primary) !important;

}



.testimonial-carousel .owl-item.center .testimonial-text * {

    color: #FFFFFF !important;

}



.testimonial-carousel .owl-item .testimonial-text::after {

    position: absolute;

    content: "";

    width: 0;

    height: 0;

    left: 50%;

    bottom: -30px;

    transform: translateX(-50%);

    border: 15px solid;

    border-color: var(--light) transparent transparent transparent;

    transition: .5s;



}



.testimonial-carousel .owl-item.center .testimonial-text::after {

    border-color: var(--primary) transparent transparent transparent;

}



.testimonial-carousel .owl-nav {

    position: absolute;

    width: 350px;

    bottom: 100px;

    left: 50%;

    transform: translateX(-50%);

    display: flex;

    justify-content: space-between;

    opacity: 0;

    transition: .5s;

    z-index: 1;

}



.testimonial-carousel:hover .owl-nav {

    width: 300px;

    opacity: 1;

}



.testimonial-carousel .owl-nav .owl-prev,

.testimonial-carousel .owl-nav .owl-next {

    font-size: 30px;

    color: var(--primary);

}



.testimonial-carousel .owl-nav .owl-prev:hover,

.testimonial-carousel .owl-nav .owl-next:hover {

    color: var(--dark);

}





/*** Footer ***/

.footer .btn.btn-social {

    margin-right: 5px;

    width: 35px;

    height: 35px;

    display: flex;

    align-items: center;

    justify-content: center;

    color: var(--light);

    border: 1px solid #FFFFFF;

    border-radius: 35px;

    transition: .3s;

}



.footer .btn.btn-social:hover {

    color: var(--primary);

}



.footer .btn.btn-link {

    display: block;

    margin-bottom: 5px;

    padding: 0;

    text-align: left;

    color: #FFFFFF;

    font-size: 15px;

    font-weight: normal;

    text-transform: capitalize;

    transition: .3s;

}



.footer .btn.btn-link::before {

    position: relative;

    content: "\f105";

    font-family: "Font Awesome 5 Free";

    font-weight: 900;

    margin-right: 10px;

}



.footer .btn.btn-link:hover {

    letter-spacing: 1px;

    box-shadow: none;

}



.footer .copyright {

    padding: 25px 0;

    font-size: 15px;

    border-top: 1px solid rgba(256, 256, 256, .1);

}



.footer .copyright a {

    color: var(--light);

}

/*** Photo Gallery ***/

.tab {

  float: left;

/*  border: 1px solid #ccc;*/

  background-color:var(--red);

  width: 20%;

   min-height: 650px;

}



/* Style the buttons inside the tab */

.tab button {

  display: block;

  background-color: inherit;

  color: #fff;

  padding: 22px 16px;

  width: 100%;

  border: none;

  outline: none;

  text-align: left;

  cursor: pointer;

  transition: 0.3s;

  font-size: 17px;

  border: 1px solid #fff6;

}



/* Change background color of buttons on hover */

.tab button:hover {

  background-color: #0005;

}



/* Create an active/current "tab button" class */

.tab button.active {

  background-color: #282828 !important;

}



/* Style the tab content */

.tabcontent {

display: none;



/*  border: 1px solid #ccc;*/

  width: 100%;

  border-left: none;

  background:#fff;

   min-height: 650px;



}



.tablinks:hover:after {

    background-color: #fc1b1b;

    border: 2px solid #fff;

    box-shadow: 0 0 5px #000;

    opacity: 1;

    transform: translateY(-50%) scale(2);



}

.tab-content-image

{

    padding: 20px;

    width: 80%;

    float: right;

      height: 640px;

    overflow-y: auto;



}



/*photo-gallery*/





.photo-gallery:before {

  content: "";

  position: absolute;

  left: 0;

  right: 0;

  top: 0;

  bottom: 0;

  background: rgba(255, 255, 255, 0.92);

  z-index: 9;

}



.photo-gallery .container {

  position: relative;

  z-index: 10;

  background: #fff;

}



.photo-gallery h1 {

  font-size: 25px;

  color: #111;

  text-align: center;

  font-weight: 700;

  position: relative;

  padding: 15px 0;

}



.section-header h3 {

  font-size: 30px;

  color: var(--main-color);

  text-transform: uppercase;

  text-align: center;

  font-weight: 700;

  position: relative;

  padding-bottom: 15px;

}







img {

  width: 100%;

}



.img-overlay {

  background: rgba(0, 0, 0, 0.7);

  width: 100%;

  height: 100%;

  position: absolute;

  top: 0;

  left: 0;

  display: flex;

  justify-content: center;

  align-items: center;

  opacity: 0;

}



.photo-gallery i {

  color: #fff;

  font-size: 3em;

}



#overlay {

  background: rgba(0, 0, 0, 0.7);

  width: 100%;

  height: 100%;

  position: fixed;

  top: 100px;

  left: 0;

  display: flex;

  justify-content: center;

  align-items: center;

  z-index: 999;



  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

}

#overlay2 {

  background: rgba(0, 0, 0, 0.7);

  width: 100%;

  height: 100%;

  position: fixed;

  top: 100px;

  left: 0;

  display: flex;

  justify-content: center;

  align-items: center;

  z-index: 999;



  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

}



.photo-gallery img {

  margin: 0;

  width: 80%;

  height: auto;

  object-fit: contain;

  padding: 5%;

}



 .img-wrapper {

   position: relative;

  border: 2px solid #0002;

  border-radius: 4px;

  margin-bottom: 15px;
  height: 250px;
  object-fit: contain;

}

 .img-wrapper img {

   width: 100%;
   height: 250px;
   object-fit: contain;

}

 .img-overlay {

   background: rgba(0, 0, 0, 0.7);

   width: 100%;

   height: 250px;
   object-fit: contain;

   position: absolute;

   top: 0;

   left: 0;

   display: flex;

   justify-content: center;

   align-items: center;

   opacity: 0;

}

 .img-overlay i {

   color: #fff;

   font-size: 2em;

   cursor: pointer;

}

 #overlay {

   background: rgba(0, 0, 0, 0.7);

   width: 100%;

   height: 100%;

   position: fixed;

   top: 0;

   left: 0;

   display: flex;

   justify-content: center;

   align-items: center;

   z-index: 999;

   -webkit-user-select: none;

   -moz-user-select: none;

   -ms-user-select: none;

   user-select: none;

}

 #overlay img {

   margin: 0;

   width: 80%;

   height: auto;

   object-fit: contain;

   padding: 5%;

}

 #overlay2 img {

   margin: 0;

   width: 80%;

   height: auto;

   object-fit: contain;

   padding: 5%;

}

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

   #overlay img {

     width: 60%;

  }

  #overlay2 img {

     width: 60%;

  }

}

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

    .gallery_wrapper
    {
        display: block!important;
        gap: 2px!important;
    }
    .gallery_item
    {
        margin-bottom: 9px!important;
    }
    .gallery_item img
    {
        height: auto;
    }
.b-img
{
    border-radius: 30px;
    margin-top: 20px;
}
.progress-container-txt
{
    display: block!important;
}
.progress-container::before
{
    left: 20px!important;
    width: 90%!important;
}
.circle {
    width: 50px!important ;
    height: 50px!important;
    font-size: 16px!important;
 }
}
 @media screen and (min-width: 1200px) {

   #overlay img {

     width: 50%;

  }

}

 #nextButton {

   color: #fff;

   font-size: 2em;

   transition: opacity 0.8s;

}

 #nextButton:hover {

   opacity: 0.7;

}

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

   #nextButton {

     font-size: 3em;

  }

}

 #prevButton {

   color: #fff;

   font-size: 2em;

   transition: opacity 0.8s;

}

 #prevButton:hover {

   opacity: 0.7;

}

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

   #prevButton {

     font-size: 3em;

  }

}

 #exitButton {

   color: #fff;

   font-size: 2em;

   transition: opacity 0.8s;

   position: absolute;

   top: 45px;

   right: 15px;

}

 #exitButton:hover {

   opacity: 0.7;

}

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

   #exitButton {

     font-size: 3em;

  }



}



.page-wraper

{

    padding: 50px 0;

    background: linear-gradient(45deg, #0001, #ffcc0736), url(../img/bg1.jpg);

    background-size: cover;

    background-repeat: no-repeat;

    background-position: center center;

    box-shadow: 0px 10px 90px #00000040;

}



/*** service ***/
.left ul
{
    padding-left: 0;
}
.right ul
{
    padding-left: 0;
}
.right ul li
{
    list-style: none;
    border: 1px solid var(--primary);
    border-radius: 30px;
    padding: 14px 20px;
    margin: 10px 0;
    font-weight: bold;
    text-align: center;
}
.left ul li
{
    list-style: none;
    border: 1px solid var(--primary);
    border-radius: 30px;
    padding: 14px 20px;
       margin: 10px 0;
        font-weight: bold;
        text-align: center;
        transition: 0.3s;
}
.left ul li:hover  
{
    background-color: #ff0707;
    color: #fff;
    
}
.right ul li:hover  
{
    background-color: #ff0707;
    color: #fff;
    
}
.serv-center h2 
{
    text-align: center;
    position: absolute;
    z-index: 999;
    right: 0;
    color: #fff;
    bottom: 0;
    right: 0;
    background: #ff0707;
    padding: 20px;
    margin-bottom: 0;
    border: 16px solid #ffffff;
    border-radius: 25px 0px 0px 0px;
    text-shadow: 1px 2px 3px #303030;
}
.serv-center 
{
    position: relative;
    height: 400px;
}
.serv-center img  
{
    height: 100%!important;
    object-fit: cover;
}
.custom-font-style

{

    color: var(--red);

    font-size: 22px;

    font-style: italic;

}

.listof-problem ul

{

    list-style: none;

    margin-top: 20px;

}

.listof-problem ul li 

{

    margin-bottom: 10px;

}

.listof-problem ul li .fas

{

    color: var(--red);

}

.nri-service img  

{

    width: 100%;

}

.nri-service h1

{

    padding-left: 2rem;

}

.solutions-section

{

    text-align: center;

    background-image: url('../img/service-bg2.jpg');

    padding: 60px 0;

    background-repeat: no-repeat;

    background-size: cover;

    background-position: center;

}

.listofdesign

{



    padding: 0;

    margin: 0;

}

.listofdesign li 

{

        list-style: none;

    display: inline-block;

    color:#fff900;

    font-weight: bolder;

    position: relative;

    margin: 0px 10px;

}

.listofdesign li:before  

{

    content: '';

    width: 2px;

    height: 16px;

    background-color: #fff;

    position: absolute;

    right: -13px;

    top: 4px;



}

.listofdesign li:before::last-child()

{

    width: 0px;

}

.effective-communication

{

    margin-top: 80px;

}

.eff-service img   

{

    width: 100%;

}

.eff-service ul

{

    margin-top: 20px;

}

.eff-service ul li 

{

    list-style: none;

    margin-bottom: 10px;

}

.eff-service ul li .fas 

{

    color: green;

}

.box

{

        width: 100%;

    background-color: #0001;

    height: 140px;

    text-align: center;

    display: grid;

    align-items: center;

    justify-content: center;

    padding: 25px 0;

}

.box .fas  

{

    font-size: 30px;

}

.effective-communication-content

{

    width: 80%;

    margin: 0 auto;

}

.btn-whatsapp-pulse {
   background: #25d366;
    color: white;
    position: fixed;
    bottom: 38px;
    right: 108px;
    font-size: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 0;
    height: 0;
    padding: 28px;
    text-decoration: none;
    border-radius: 50%;
    animation-name: pulse;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
    z-index: 99999;
}
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.5);
    }
    80% {
        box-shadow: 0 0 0 14px rgba(37, 211, 102, 0);
    }
}

.btn-whatsapp-pulse-border {
    bottom: 120px;
    right: 20px;
    animation-play-state: paused;
}

.btn-whatsapp-pulse-border::before {
    content: "";
    position: absolute;
    border-radius: 50%;
    padding: 15px;
    border: 5px solid #25d366;
    opacity: 0.75;
    animation-name: pulse-border;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
}

@keyframes pulse-border {
    0% {
        padding: 25px;
        opacity: 0.75;
    }
    75% {
        padding: 50px;
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}
.progress-container {
  display: flex;
  justify-content: space-around;
  margin-bottom: 30px;
  max-width: 100%;
  width: 100%;
  position: relative;
}

.progress-container::before {
    content: "";
    background-color: var(--secondary);
    position: absolute;
    top: 50%;
    left: 87px;
    height: 4px;
    width: 78%;
    transform: translateY(-50%);
    z-index: -1;

}

.progress {
  background-color: var(--red);
  position: absolute;
  top: 50%;
  left: 0;
  height: 4px;
  width: 0%;
  transform: translateY(-50%);
  z-index: -1;
  transition: .4s ease;
}

.circle {
     background-color: #282828;
    color: #999;
    border-radius: 50%;
    height: 100px;
    width: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 3px inset #a5a5a5;
    transition: .4s ease;
    font-size: 40px;
}
/*.circle:before
{
    font-family: "Font Awesome 5 Free";
    font-weight: 400;
    content: "\f061";
    position: absolute;
} */
.circle.active {
  border-color: var(--primary);
}
.progress-container-txt:before
{
    background-color: transparent !important;
}
.progress-content
{
    text-align: center;
    margin: 0px 10px;
}
.progress-content h2 
{
    font-weight: 100;
    color: #ff260f;
}
.progress-content p 
{
    font-size: 13px;
}
.wrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 100%;
}

.wrapper .card {
    position: relative;
    width: 280px;
    height: 370px;

    display: flex;
    align-items: flex-end;

    padding: 2rem 1rem;
    background-color: #fff;
    box-shadow: 0px 7px 10px rgba(0, 0, 0, 0.5);
    transition: 0.5s ease-in-out;
}

.wrapper .card:hover {
    transform: translateY(20px);
}

.wrapper .card::before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to bottom, rgba(0, 176, 155, 0.5), rgba(150, 201, 61, 1));
    z-index: 2;
    transition: 0.5s all;
    opacity: 0;
}

.wrapper .card:hover::before {
    opacity: 1;
}

.wrapper .card img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wrapper .card .overlay {
    position: relative;
    z-index: 3;
    color: #fff;
    opacity: 0;
    transform: translateY(30px);
    transition: 0.5s all;
    padding: 30px 0px;
}

.wrapper .card:hover .overlay {
    opacity: 1;
    transform: translateY(30px);
}

.overlay {}

.text-h1 {
    margin: 0;
    color:var(--red);
    font-size: 20px;
}

.text-p {
    letter-spacing: 1px;
    margin-top: 8px;
    margin-bottom: 20px;
}

.link-a {
    padding: 0.5rem 1rem;
    background-color: #fff;
    color: #000;
    cursor: pointer;
    transition: .4s ease-in-out;

}

.link-a:hover {
  box-shadow: 0px 7px 10px rgba(0, 0, 0, 0.5);
}
.service-list ul
{

    padding-left: 0;
}
.service-list
{
border: 1px solid;
border-radius: 30px;
padding: 40px 10px;
height: 100%;
background: #ff0707;
}

.service-list ul li  
{
    list-style: none;
    padding: 10px 5px;
    color: #fff;
    margin-bottom: 5px;
    border-bottom: 1px solid var(--text-black) ;
    margin: 10px 20px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
      transition: 0.3s;
      cursor: pointer;

}
.service-list ul li:hover 
{
    letter-spacing: 1.2px;
}
.service-list ul li span  
{
    transform: rotate(45deg);
    background: #fff;
    border-radius: 50%;
    width: 25px;
    height: 25px;
    color: #000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.serv-left img 
{
    width: 100%;
    height: 290px;
}
.servic-cat
{
    margin: 80px 0;
}


/*--====== Gallery Section ======--*/
 #gallery {
     padding-top: 2rem;
     padding-bottom: 2rem;
}
 .container {
     max-width: 1440px;
     margin-left: auto;
     margin-right: auto;
     padding-left: 0.75rem;
     padding-right: 0.75rem;
}
/* Filterable Gallery */
 .gallery_tabs {
     background-color: inherit;
     display: flex;
     flex-wrap: wrap;
     justify-content: space-evenly;
     row-gap: 0.8rem;
     padding: 1.2rem;
    /*border-radius: 0px 50px 0px 50px;
     box-shadow: var(--box-shadow);
    */
}
 .gallery_tabs li {
    list-style: none;
     padding: 0.7rem 2rem;
/*     border-radius: 0px 20px 0px 20px;*/
     font-size: 0.95rem;
     text-shadow: 3px 2px 2px rgba(0, 0, 0, 0.5);
     text-transform: uppercase;
     color: #fff;
     background-color:#000;
/*     background-image:linear-gradient(315deg, #e1e3e4 0%, #ff0707 74%);*/
     box-shadow: 5px 2px 5px #666665;
     cursor: pointer;
     transition: all 0.3s ease;
}
 .gallery_tabs li.active, .gallery_tabs li:hover {
     background-color:#ff0707;
/*     background-image: linear-gradient(315deg, #e1e3e4 0%, salmon 74%);*/
     color: #fff;
}
 .gallery_tabs li.active {
     background-color: #ff0707;
}
 .gallery_tabs li.active:hover {
     background-color: #ff0707;
/*     background-image: linear-gradient(315deg, #e1e3e4 0%, #b621fe 74%);*/
}
 .gallery_wrapper {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 1rem;
     margin-top: 4rem;
}
 @media (max-width: 768px) {
     .gallery_wrapper {
         grid-template-columns: repeat(3, 1fr);
         gap: 0.5rem;
    }
}
 .gallery_item {
/*     border-radius: 0px 50px 0px 50px;*/
     box-shadow: 5px 5px 5px #666665;
     cursor: pointer;
     overflow: hidden;
}
/* when the gallery_item has 'show' class */
 .gallery_item.show {
     animation: fadeIn 0.4s ease-in;
}
 @keyframes fadeIn {
     0% {
         opacity: 0;
    }
     100% {
         opacity: 1;
    }
}
/* when the gallery_item has 'hide' class */
 .gallery_item.hide {
     display: none;
}
 .gallery_item img {
     transition: transform 0.3s ease;
     height: 230px;
     object-fit: cover;
}
 .gallery_item:hover img {
     transform: scale(1.1);
}
/* Lightbox */
 .lightbox {
     position: fixed;
     top: 0;
     left: 0;
     z-index: 995;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.6);
     overflow-x: hidden;
     overflow-y: auto;
     pointer-events: none;
     visibility: hidden;
     opacity: 0;
     transition: visibility 0.3s ease, opacity 0.3s ease;
}
/* when the lightbox is open */
 .lightbox.open {
     pointer-events: all;
     visibility: visible;
     opacity: 1;
}
 .lightbox_wrapper {
     display: grid;
     place-items: center;
     min-height: calc(100% - 3rem);
     margin: 1.5rem;
}
 @media (max-width: 575.98px) {
     .lightbox_wrapper {
         margin: 0.5rem;
         min-height: calc(100% - 1rem);
    }
}
 .lightbox_content {
     box-shadow: var(--box-shadow);
     max-width: 700px;
     width: 100%;
/*     border-radius: 0px 50px 0px 50px;*/
     text-align: center;
     overflow: hidden;
     transform: scale(0);
     transition: transform 0.5s ease;
}
/* when Lightbox is open then lightbox-content will... */
 .lightbox.open .lightbox_content {
     transform: scale(1);
}
/* lightbox-close-btn */
 .lightbox_close {
     position: absolute;
     top: 25vh;
     right: 3vw;
     z-index: 999999;
     width: 40px;
     height: 40px;
     display: flex;
     flex-direction: column;
     justify-content: center;
     cursor: pointer;
     overflow: hidden;
}
 .lightbox_close span {
     width: 100%;
     height: 3px;
     margin-top: -1.5px;
     margin-bottom: -1.5px;
     background-color: #ddd;
     opacity: 0.7;
     transition: opacity 0.3s ease;
}
 .lightbox_close:hover span {
     opacity: 1;
}
 .lightbox_close span:first-child {
     transform: rotate(45deg);
}
 .lightbox_close span:last-child {
     transform: rotate(-45deg);
}
 .lead {
     font-size: 1.5rem;
     font-weight: 300;
}
 .container {
     margin: 50px auto 0 auto;
     max-width: 960px;
}
.lightbox_prev, .lightbox_next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0,0,0,0.5);
  color: #fff;
  border: none;
  cursor: pointer;
  padding: 10px;
  font-size: 18px;
}

.lightbox_prev {
  left: 10px;
}

.lightbox_next {
  right: 10px;
}

.why .overflow-hidden img 
{
    height: 200px!important;
    object-fit: cover!important;
}