@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');
@font-face {
    font-family: 'TeXGyreAdventor';
    src: url('../fonts/TeXGyreAdventor-Italic.eot');
    src: url('../fonts/TeXGyreAdventor-Italic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TeXGyreAdventor-Italic.woff2') format('woff2'),
        url('../fonts/TeXGyreAdventor-Italic.woff') format('woff'),
        url('../fonts/TeXGyreAdventor-Italic.ttf') format('truetype'),
        url('../fonts/TeXGyreAdventor-Italic.svg#TeXGyreAdventor-Italic') format('svg');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TeXGyreAdventor';
    src: url('../fonts/TeXGyreAdventor-Bold.eot');
    src: url('../fonts/TeXGyreAdventor-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TeXGyreAdventor-Bold.woff2') format('woff2'),
        url('../fonts/TeXGyreAdventor-Bold.woff') format('woff'),
        url('../fonts/TeXGyreAdventor-Bold.ttf') format('truetype'),
        url('../fonts/TeXGyreAdventor-Bold.svg#TeXGyreAdventor-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'TeXGyreAdventor';
    src: url('../fonts/TeXGyreAdventor-BoldItalic.eot');
    src: url('../fonts/TeXGyreAdventor-BoldItalic.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TeXGyreAdventor-BoldItalic.woff2') format('woff2'),
        url('../fonts/TeXGyreAdventor-BoldItalic.woff') format('woff'),
        url('../fonts/TeXGyreAdventor-BoldItalic.ttf') format('truetype'),
        url('../fonts/TeXGyreAdventor-BoldItalic.svg#TeXGyreAdventor-BoldItalic') format('svg');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'TeXGyreAdventor';
    src: url('../fonts/TeXGyreAdventor-Regular.eot');
    src: url('../fonts/TeXGyreAdventor-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TeXGyreAdventor-Regular.woff2') format('woff2'),
        url('../fonts/TeXGyreAdventor-Regular.woff') format('woff'),
        url('../fonts/TeXGyreAdventor-Regular.ttf') format('truetype'),
        url('../fonts/TeXGyreAdventor-Regular.svg#TeXGyreAdventor-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

/** =+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+ HOMEPAGE START =+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+=+ */


/** ****** Color Scheme ****** **/
:root {
    --clr-primary: #EAEEED;
  
    --clr-white: #ffffff;
    --clr-white-200: #E6E6E6;
    --clr-black: #000000;
    --clr-black-100: #131313;
    --clr-black-200: #242424;
    --clr-black-300: #3c3c3c;
  
    --ff-primary: 'TeXGyreAdventor';
    --ff-body:   "Jost", sans-serif;
  }
  
  /** ****** CSS Resets ****** **/
  *,
  *::before,
  *::after {
    box-sizing: border-box;
  }
  
  * {
    padding: 0;
    margin: 0;
    font: inherit;
  }
  
  ul,
  ol {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
  }
  
  html:focus-within {
    scroll-behavior: smooth;
  }
  
  a:focus,
  a:hover {
    outline: none;
  }
  
  a {
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
    text-decoration: none;
  }
  
  a:hover {
    text-decoration: none;
    -webkit-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
  }
  
  body {
    font-family: var(--ff-body);
    text-rendering: optimizeSpeed;
    font-size: 16px;
    line-height: 1.5;
  }
  
  p {
    font-weight: 400;
    margin-bottom: 0;
    color: var(--clr-black-300);
    font-size: 16px;
    line-height: 30px;
  }
  
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    font-family: var(--ff-primary);
    margin-bottom: 0;
  }
  
  img,
  picture,
  svg {
    max-width: 100%;
    display: block;
  }
  
  /** ****** Utility Classes ******* */

  
  .fixed-top {
    background-color: var(--clr-black-200) !important;
    position: fixed !important;
  }
  

  .overlay::before {
    position: absolute;
    content: '';
    width: 100%;
    height: 100%;
    background-color: rgba(27, 27, 27, 0.72);
    z-index: 0;
    backdrop-filter: blur(190px);
    top: 0;
    left: 0;
    opacity: 0.72;
  }
  
  .bg-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1
  }
  
  .bg-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center
  }
  
  [class^=section__] {
    position: relative;
    z-index: 3
  }
  
  /* Theme Classes */
  .bg-gradient {
    background-image: linear-gradient(238deg, #0a1e22 0%, #3C3C3C 100%) !important;
  }
  .bg-primary {
    background-color: var(--clr-primary) !important;
  }
  .clr-text {
    color: var(--clr-black-200);
  }
  
  /** ****** Custom Properties ******* */
  .custom-pad {
    padding: 70px 0;
  }
  
  .custom-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: transparent;
    color: var(--clr-white);
    border: none;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 0px 30px;
    height: 50px;
    border-radius: 0px;
    position: relative;
    text-transform: uppercase;
    transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
    letter-spacing: 1.05px;
    font-family: var(--ff-primary);
   position: relative;
   
  }
  .custom-button.black{
    color: #000;
  } 
  .custom-button.black:hover{color: #000;}
  .custom-button.black::before{
    border-top: 1px solid #000;
    border-bottom: 1px solid #000;
  }
  .custom-button.black::after{
    border-left: 1px solid #000;
    border-right: 1px solid #000;
  }
  .custom-button::before{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 108%;
    height: 103%;
    border-top: 1px solid rgba(255, 255, 255, 1);
    border-bottom: 1px solid rgba(255, 255, 255, 1);
    content: '';
    transform: translate(-50%,-50%);
  }
  .custom-button::after{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 102%;
    height: 125%;
    border-left: 1px solid rgba(255, 255, 255, 1);
    border-right: 1px solid rgba(255, 255, 255, 1);
    content: '';
    transform: translate(-50%,-50%);
  }
  

  
  .cb-white:hover {
    background-color: var(--clr-accent);
    color: var(--clr-white);
  }
  
  .custom-button_form {
    background-color: transparent;
    padding: 0;
    font: inherit;
    /* add custom-button fonts */
    color: inherit;
    /* add custom-button color */
    text-transform: inherit;
    /* add custom-button text-transform */
    border: none;
  }
  
  .custom-heading {
    margin-bottom: 20px;
    border-bottom: 1px solid rgba(213, 213, 213, 1);
  }
  
  .custom-heading h2 {
    font-size: 46px;
    line-height: 1.2;
    font-weight: 400;
    position: relative;
    text-transform:capitalize;
   color: #000;
   padding-bottom: 15px;
  }
  
  .custom-heading h2 span {
   display: block;
  }
  
  .custom-heading h6 {
    font-size: 22px;
    color: var(--clr-white);
    text-transform: uppercase;
    line-height: 26px;
    font-family: var(--ff-body);
    font-weight: 400;
  }
  
  /* header css start */
  .header_sec{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    padding: 15px 0;
    z-index: 999;
  }
  .header_sec.fixed-top{background: rgba(44, 44, 44, 1);}
  .main_header_wrap{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .main_header-right{
    position: relative;

  }
  .main_header-right ul{
    display: flex;
    align-items: center;
    justify-content: end;
    gap: 10px;
  }
  .sticky_socialbox{
    position: fixed;
    left: 0;
    bottom: 45%;
    z-index: 99;
    background: #242424;
    padding: 20px 5px;
  }
   .sticky_socialbox ul li a{
    width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: rgba(255, 255, 255, 1);
	
/*   border: 1px solid rgba(255, 255, 255, 1); */
  margin: 8px;
  mix-blend-mode: difference;
   }
.sticky_socialbox ul li {
	overflow:hidden;
}
.sticky_socialbox ul li a img{
	transform: scale(1);
  transition: all 0.5s ease-in-out;
}
.sticky_socialbox ul li a:hover img{
	transform: scale(1.2);
  transition: all 0.5s ease-in-out;
}
   .main_header_wrap .navbar-nav li{
    margin:0 10px ;
   }

   .main_header_wrap .navbar-nav li a{
    font-family: var(--ff-body);
    color: rgba(255, 255, 255, 1);
    font-size: 17px;
    line-height: 24px;
    padding: 0 !important;
    position: relative;
   }
.main_header_wrap .navbar-nav li a:hover{
	color: #cfa446;
}
.main_header_wrap .navbar-nav li.current_page_item a{
		color: #cfa446;
}
   .main_header_wrap .navbar-nav li a::before{
    position: absolute;
  background-color: #cfa446;
  height: 2px;
  width: 0%;
  bottom: -4px;
  left:0px;
  content: "";
   }
   .main_header_wrap .navbar-nav li a:hover::before {
    width: 100%;
    transition: 0.3s all;
  }
  .main_header_wrap .navbar-nav li.current_page_item a::before {
    width: 100%;
    transition: 0.3s all;
  }

   /* /banner_sec */
.banner_sec{position: relative; width: 100%;}
.banner_img{position: relative; width: 100%;}
.banner_img img{width: 100%; height: 800px ; object-fit: cover;}

.banner_img::before{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(360deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.7) 100%);
 z-index:5;
}
.banner-wrap{
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
    width: 100%;
}
.banner_cont{
    position: relative;
    z-index: 999;
}

  .banner_cont h2 {
    font-size: 35px;
    line-height: 45px;
    color: #fff;
    font-weight: 400;
    margin-bottom: 20px;
}
.banner_slider .swiper-pagination{
    right: 30px;
  width: fit-content;
  left: inherit;
  transform: rotate(-90deg);
top: 50%;
color: #fff;
height: 100px;
  gap: 30px;

}
.banner_slider .swiper-pagination span{color: #fff; font-size:  20px;}

.about_sec{
    position: relative;
    width: 100%;

}

.about_leftpart{
    position: relative;
    width: 100%;
    margin-top: 25px;
}
.about_leftpart-img3{
    position: relative;
    margin: auto auto 0;
    width: 80%;
    height: 300px;
    overflow: hidden;
    object-fit: cover;
}
.about_leftpart img{
    border-radius: 10px;
  object-position: center;
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.about_leftpart-img1{
    position: absolute;
    width: 40%;
    top: 0;
    left: 0;
}
.about_leftpart-img2{
    position: absolute;
    width: 50%;
    top: 40px;
    right: 0;
}

.about_right-box{
    display: flex;
    align-items: center;
    flex-wrap: wrap;


}
.about_right-box .tab_manu{
    width: 40%;
}
.about_right-box #tabs-contents{width: 60%;}
.about_right-box .tab-content{padding-left: 15px; transition: 10s ease-out;}
.about_right-box .tab_manu li{
   margin-bottom: 15px;
}
.about_right-box .tab_manu li a{
    font-size: 20px;
    color: #000;
    font-weight: 500px;
    border-bottom: 1px transparent; font-family: var(--ff-primary);
}
.about_right-box .tab_manu li.active a{border-bottom: 1px solid #000;}
.about_right-box .tab-content p{
 color: rgba(142, 142, 142, 1);

}
.about_rightpart{
    position: relative;
    padding-left: 25px;
}
.about_progress .progress_bar_item {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between;
}
.about_progress{margin-top: 20px;}
.about_progress .item_bar{display: block; width: 100%; background: rgba(220, 220, 220, 1); height: 6px; }
.about_progress{margin-bottom: 10px;}
.about_progress .progress_bar_item .cell{
    font-size: 20px;
    font-weight: 500;
    color: #000;
    font-family: var(--ff-primary);
    margin-bottom: 8px;
}
.about_progress .item_bar .progress{
    height: 6px;
    background: rgba(30, 30, 30, 1);
}

.home_ctapart{
    position: relative;
    width: 100%;
    background-attachment: fixed !important;
    padding: 50px 0;
    height: 400px;
    background-size: cover !important;
    background-repeat: no-repeat;
    background-color: rgb(0, 0, 0) !important;
}
.home_ctapart::before {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  background-color: #00000038;
  top: 0;
  left: 0;
  z-index: 0;
}
.home_ctapart-wrap{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 9;
    width: 100%;
 
}
.home_ctapart-wrap h1{
    font-size: 48px;
    line-height: 56px;
    background: transparent;
    -webkit-text-stroke: 1px #fff;
    -webkit-text-fill-color: transparent;
    font-weight: 700;
    margin-bottom: 20px;
}
.services_sec{
    position: relative;
    width: 100%;
    overflow: hidden;
}
.services_leftpart{
    position: relative;
    height: 100%;
    overflow: hidden;
}
.services_leftpart .services_box img{height: 416px !important;}
.services_box{
    position: relative;
    display: flex;
    align-items: center;
    border-radius: 10px;
    overflow: hidden;
    height: 100%;
}
.services_box::before{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: rgba(0, 0, 0, 0.2);
 z-index:5;
}
.services_box img{
    width: 100%;
    position: relative;
    height: 200px;
    object-fit: cover;
}
.services-cont{
    position: absolute;
    left: 0;
    bottom: -50px;
    padding: 20px;
    width: 100%;
    z-index: 99;
    background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgb(0 0 0) 100%);
    height: 0;transition: all 0.5s ease-in-out;
    display: flex;
  align-items: end;
}
.services_leftpart .services-cont img{ height: auto !important;}
.services-cont img{width: auto; height: auto !important;}
.services_box:hover .services-cont{height: 50%;transition: all 0.3s ease-in-out; bottom: 0;}
.services-cont h4, .services-cont a{
    font-size: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    color: #fff;
}
.services_right{
    display: flex;
    gap: 10px;
    flex-direction: column;
    position: relative;
    overflow: hidden;
}
.services_right .services-cont{bottom: 0;}
.timeline_slider-wrapper{
  position: relative;
  width: 100%;
  margin-top: 25px;
}
.services_right li{margin-bottom: 15px;}
.services_right li:last-child{margin-bottom: 0;}
  
  .timeline_box{position: relative;}
  .timeline_box::before{
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(270deg, rgba(30, 30, 30, 0.5) 0%, #000000 100%);
    z-index: 3;
  }
.timeline_box-wrap{
  position: absolute;
  left: 100px;
  top:50%;
  transform: translateY(-50%);
  z-index: 9;
  width: 100%;
}
.timeline_box-wrap h3{
  font-size: 42px;
    line-height: 1.5;
    font-weight: 700;
    position: relative;
    text-transform: capitalize;
    color: #fff;
    margin-bottom: 20px;
}

.timeline_slider .swiper-pagination{
  left: 5%;
  top: 42%;
  transform: rotate(90deg);
  width: 130px;
  height: 100px;

}
.timeline_slider .swiper-pagination-bullet{
  width: 10px;
  height: 10px;
  background: #fff;
  position: relative;
  margin: 6px;
  padding: 4px;
  opacity: 1;
  border-radius: 50%;
}
.timeline_slider .swiper-pagination-bullet.swiper-pagination-bullet-active{
  background: url(../images/star.svg) no-repeat 0 0;
  width: 15px;
  height: 15px;
  filter: brightness(0) saturate(100%) invert(82%) sepia(100%) saturate(44%) hue-rotate(2deg) brightness(111%) contrast(111%);
 margin: -3px auto;
 background-size: 100%, 100%;
 padding: 0;
}

.thumbnail_slider{
  position: absolute;
    right: 15%;
    width: 250px;
    top: 50%;
    height: 200px;
    transform: translateY(-50%);
    padding-top:30px;
}
.timeline_box{width: 100%;height: 100%;}
.timeline_box img{width: 100%; height:400px; object-fit: cover;}

.thumbnail_slider .swiper-pagination{
  top: 0px !important;
    color: #fff;
    font-size: 22px;
}
.timeline_slider .swiper-button-next, .timeline_slider .swiper-button-prev{
    border: 1px solid #fff;
    padding: 0px;
    color: #fff;
     width: 30px;
    right: 12%;
    top: 58%;
}
.timeline_slider .swiper-button-prev{
  left: inherit;
  top: 45%;
}

/* vision_sec */
.vision_sec{
  position: relative;
  width: 100%;
  background: url(../images/vision_bg.png) no-repeat bottom right;
  background-size: 400px;
}
.vision_wrap{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  overflow: hidden;
}

.vision_box{
  position: relative;
  width: 25%;
padding: 20px;
text-align: center;
}
.vision_icon{
  width: 120px;
  height: 120px;
  border-radius: 100%;
  background: #F2F2F2;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
}
.vision_icon img{width: 50px;}
.vision_box span{
  width: 40px;
  height: 40px;
  border-radius: 100%;
  background: #00000080;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  position: absolute;
    top: 0;
    left: 54%;
}
.vision_box h4{
  color: #000;
  font-weight: 400;
  font-size: 24px;
  margin-bottom: 10px;
  height: 58px;
}
.vision_text{
  margin-top: 25px;
  padding:10px 20px;
  border: 1px solid #F2F2F2;
  width: fit-content;
}
.vision_text p a{color: var(--clr-black-300);font-weight: 700;}
.vision_wrap .scrollright{position: absolute;width: 800px; top: 75px; transform: translateX(-50%); left: 50%;}
.vision_wrap .scrollright::before {
	width: 800px ; height: 2px; position: absolute; left: 0;  margin: 0 auto ; overflow: hidden;background: linear-gradient(to bottom, #0d0d0d 50%, rgb(13 13 13 / 0%) 50%); animation: progress 8s linear infinite;
  top: 0;
  z-index: 111;
 content: '';
}
@keyframes progress {
  0% {
    width: 0;

  }
  
  50% {
    width:800px;
  }
  
  100% {
    width: 100%;
   
  }
}

.vision_wrap .vision_box:first-child .scrolldown{display: none;}

.interior_process-sec{
  position: relative;
  width: 100%;
}
.interior_process-cont{padding-bottom: 80px;}
.interior_process-box{
  padding: 12px;
  position: relative;
  width: 100%;
 background: #F8F8F8;
 border-radius: 10px;
}
.interior_process-img{
 border: 1px solid #F8F8F8;
 margin-bottom: 12px;
}
.interior_process-box h4{
  color: #000;
  font-weight: 400;
  font-size: 24px;
  margin-bottom: 10px;
  height: 60px;
}
.interior_process-box span{
  display: block;
  padding-bottom: 8px;
  font-size: 16px;
  color: #000;
}
.interior_process-sec .col-md-3:nth-child(even) .interior_process-box{
  margin-top: -50px;
}
.interior_process-box::before{
  position: absolute;
  left: -40px;
  top: 56%;
  width: 61px;
  height: 1px;
  content: '';
  background: #F8F8F8;
  transform: rotate(-52deg);
  z-index: -1;
}
.interior_process-sec .col-md-3:first-child .interior_process-box::before{
  display: none;
}
.interior_process-sec .col-md-3:nth-child(3) .interior_process-box::before{
  transform: rotate(52deg);
  top: 44%;
}
.elevate_counter-sec{
  position: relative;
  width: 100%;
}
.elevate_counter-img{
  position: relative;
  width: 100%;
}
.elevate_counter-img img{
  position: relative;
  width: 100%;
  height: 400px;
  object-fit: cover;
}
.elevate_counter-img::before{
  position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    background: linear-gradient(270deg, rgba(30, 30, 30, 0.5) 0%, #000000 100%);
  z-index: 3;
}
.elevate_counter-wrap{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 9;
  width: 100%;
}
.elevate_counter-wrap h2{
  color: #fff;
}
.elevate_counter-wrap p{
  color: #fff;
}
.elevate_counter-wrapper{
  padding-top: 20px;
  display: flex;
  align-items: center;
  width: 100%;
  flex-wrap: wrap;
  justify-content: space-between;
}
.elevate_counter-box{
  display: flex;
  align-items: center;
  width: 33%;
  gap: 10px;
}
.elevate_counter-box p{
  display: inline-block;
  font-size: 80px;
    line-height: 80px;
    background: transparent;
    -webkit-text-stroke: 1px #fff;
    -webkit-text-fill-color: transparent;
    font-weight: 700;

  display: flex;
  justify-content: space-between;
}


.elevate_counter-box h5{
  font-size: 20px;
  color: #fff;
  display: flex;
  gap: 10px;
  align-items: center;
}


.masters_design-sec{
  position: relative;
  width: 100%;
}
.masters_design-text{padding-bottom:80px ;}
.masters_design-box{
  position: relative;
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
}
.masters_design-box img{width: 100%;}
.masters_design-cont{position: absolute; left: 0;background: rgba(0, 0, 0, 0.7);
  padding: 12px;
  bottom: 0;
  opacity: 0;transition: all 0.5s ease-in-out;
  width: 100%;
}
.masters_design-box:hover .masters_design-cont{transition: all 0.5s ease-in-out;
  opacity: 1;
}
.masters_design-cont h4 span{display: block; padding-top: 5px; font-size: 18px;}
.masters_design-cont h4{
  color: #fff;
  font-weight: 400;
  font-size: 24px;
  font-family: var(--ff-body);
}
.masters_design-sec .col-md-3:nth-child(even) .masters_design-box{
  margin-top: -50px;
}
.testimonial-sec{
  position: relative;
  width: 100%;
  background-color: var(--clr-black-100);
}
.testimonial-bg{width: 100%; position: relative;}
.testimonial-bg::before{
  background: rgba(0, 0, 0, 0.45);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: '';
  z-index: 1;
}

.testimonial-bg img{width: 100%; height: 600px; object-fit: cover;}

.testimonial-wrap{
  position: absolute;
  width: 100%;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  z-index: 9;
}
.testimonial_img{width: 100%; border-radius: 10px; overflow: hidden;}
.testimonial-cont{
  position: relative;
  padding-left: 30px;
}
.testimonial-cont h4{
  color: #fff;
  font-weight: 400;
  font-size: 30px;
  margin-bottom: 15px;
}
.testimonial-cont p{
 font-style: italic;
 color: #fff;
 margin-bottom: 15px;
}
.testimonial-cont h6{
  display: flex;
  gap: 10px;
  color: #fff;
  font-weight: 400;
  font-size: 20px;
  align-items: center;
}
.testimonial-cont h6 span{
  width: 80px;
  height: 1px;
  background: #fff;
}

.testimonial-slider .swiper-button-next, .testimonial-slider .swiper-button-prev {
  border: 1px solid #fff;
  padding: 3px;
  color: #fff;
  font-size: 20px;
  right: 0%;
  top: inherit;
  bottom: 8%;
  width: 50px;
}
.testimonial-slider .swiper-button-prev {
    left: inherit;
    bottom: 8%;
    margin-right: 60px;
}


.works_sec{
  position: relative;
 width: 100%;
 background: url(../images/works-bg1.png) no-repeat bottom right;
 background-size: 400px;
}

.works_wrap{
  margin-top: 25px;
}
.works_wrap-left{
  position: relative;
  background: url(../images/works-bg2.png) no-repeat bottom right rgba(248, 248, 248, 1);
  background-size: 300px;
padding: 20px;
border-radius: 10px;
height: 100%;
}
.works_wrap-left li{
  display: flex;
  align-items: center;
  gap: 15px;
}
.works_wrap-left li span {
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background: rgba(232, 232, 232, 0.71);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 18px;
    font-weight: 500;
    flex: 0 0 auto;
    opacity:1 ;
}
.works_wrap-left li a{
  font-size: 24px;
  color: #000;
  font-weight: 500;
  border-bottom: 1px transparent;
  font-family: var(--ff-primary);
  padding: 12px;
  border-radius: 5px;
}
.works_wrap-left li a p{line-height: 22px;display: none;}

.works_wrap-left li.active span {
  opacity: 1;
  background: rgba(0, 0, 0, 0.71);
}
.works_wrap-left li.active a {
  background: #fff;
}
.works_wrap-left li.active a p {
  display: block;
}
.latest_news-sec{
  position: relative;
  width: 100%;
}
.latest_news-box{
  position: relative;
  width: 100%;
  text-align: center;
}
.latest_news-img{
  width: 100%;
  position: relative;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 20px;
}

.oak__hero-controls{
  position:relative;
  left: 8px;
  bottom: 65px;
  width: 50px;
  height: 50px;
  border-radius: 100%;
  background: #fff;
  padding: 10px;
	z-index:99;
}
.latest_news-box span{
  color: rgba(158, 158, 158, 1);
  text-transform: capitalize;
  font-size: 16px;
}
.latest_news-box h4{
  color: #000;
  font-size: 20px;
  color: #000;
  font-weight: 500;
  font-family: var(--ff-primary);
}
.map-sec{position: relative; width: 100%;}
.map_img iframe{position: relative; width: 100%; height: 450px; object-fit: cover; filter: grayscale(1);display: block; border: none;}

.map_content-wrap{
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  width: 100%;

}



.map_img{position: relative;}
.map_content-box{
  padding: 30px 20px;
  box-shadow: 4px 3px 7px -5px rgba(0, 0, 0, 0.25);
  background: #fff;
  border-radius: 10px;
}

.map_content-box h4{
  font-size: 24px;
  color: #000;
  font-weight: 500;
  font-family: var(--ff-primary);
  border-bottom: 1px solid #000;
  margin-bottom: 15px;
  padding-bottom: 5px;
  width: fit-content;
}

.map_content-box p{
  color: rgba(142, 142, 142, 1);
  font-size: 18px;
}
.map_content-box li{margin-bottom: 12px;}
.map_content-box li a{
  color: rgba(142, 142, 142, 1);
}

.footer_sec{
  position: relative;
  width: 100%;
  background:  rgba(44, 44, 44, 1);
}
.top-footer{
  position: relative;
  width: 100%;
}

.footer_left{
  position: relative;
  width: 100%;
  padding-right: 30px;
}
.footer_logo{
  position: relative;
  margin-bottom: 15px;
}
.footer_left p{
  color: #fff;
}
.footer_left-form{
  position: relative;
  margin-top: 20px;
}
.footer_left-form input[type=email]{
  padding: 10px 60px 10px 10px;
 width: 100%;
 outline: none;
 border: none;
 border-bottom: 1px solid #fff;
 font-size: 16px;
 color: #fff;
 background: transparent;
}
.footer_left-form input[type=email]::placeholder{
  color: #fff;
  opacity: 1;
}
.footer_left-form input[type=submit]{
  background: url(../images/right-arrow.png) no-repeat 0 0;
  outline: none;
  border: none;
  width: 38px;
  text-indent: -99px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);

}
.footer_box input, .footer_box textarea, .footer_box select{
  border-width: 0px 0px 1px 0px !important;
  border-color: #fff !important;
  background-color: transparent;
  border-radius: 0;
  height: 50px;
  padding: 5px 0;
  color: #fff;
  outline: none;
  font-size: 16px;
  color: #fff;
  width: 100%;
}
.footer_box textarea{

  resize: none;
}
.footer_box input::placeholder, .footer_box textarea::placeholder, .footer_box select::placeholder{color: #fff; opacity: 1;}
.footer_box input[type=submit]{
  border: none;
  position: relative;
  z-index: 11;
}

.footer_box h4{
  font-size: 24px;
  color: #fff;
  font-weight: 500;
  font-family: var(--ff-primary);
  margin-bottom: 15px;
  text-transform: uppercase;
}
.footer_box li a{
  color: #fff;
  font-size: 16px;
  text-transform: capitalize;
}
.footer_box li{
  margin-top: 12px;
}
.footer_mid{
 display: flex;
 flex-wrap: wrap;
 width: 100%;
justify-content: space-between;
padding-right: 30px;

}
.footer-butoom{
  position: relative;
  width: 100%;

}
.footer-butoom_box{
  position: relative;
  width: 100%;
  border-top: 1px solid #fff;
  text-align: center;
  padding: 20px 0;
}
.footer-butoom_box p{color: #fff;}
.footer-butoom_box p a{color: #fff;}

.swiper-button-next::after, .swiper-button-prev::after{
  display: none;
}
.main_header-right .custom-button span{
  width: 20px;
  margin-left: 10px;
  transform: rotate(-48deg);
  padding-bottom: 15px;

}
.main_header-right .custom-button{display: flex; align-items: center;}
.footer_box .custom-button .wpcf7-spinner{position: absolute;}

  
  /* imnner page */
  .innerbanner_img{
    position: relative;
	  background-color: #000;
    min-height: 30vh;
  }
.inner-banner{background: rgba(44, 44, 44, 1);}
.innerbanner_img img{ width:100%}
  .innerbanner_img::before{
    background: linear-gradient(356.77deg, rgba(0, 0, 0, 0) 2.67%, rgba(0, 0, 0, 0.7) 99.44%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    content: '';
    z-index: 1;
  }
.banner_cont .breadcrumb{display: flex; gap: 10px; align-items: center; justify-content: center;}
.banner_cont .breadcrumb a,  .banner_cont .breadcrumb li{color: #fff; font-size: 16px; line-height: 20px;} 
.banner_cont .breadcrumb a {
  position: relative;
  padding-right: 15px;
}
.banner_cont .breadcrumb a::before{
  position: absolute;
  content: '';
  top: 54%;
  right: 0;
  width: 10px;
  height: 2px;
  transform: translateY(-50%);
  background: #fff;
}
.inner-banner .banner-wrap{top: 54%;}
.about_behind-left p{margin-bottom: 20px;}

.about_founder-cont{padding-bottom:25px;}
.about_founder .about_behind-left{padding-left:20px;}
.about_behind-left h3{
  font-size: 40px;
  line-height: 1.2;
  font-weight: 400;
  position: relative;
  text-transform: capitalize;
  color: #000;
  padding-bottom: 15px;

}
.about_ctapart::before{
  background: rgba(0, 0, 0, 0.45);
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  content: '';
  z-index: 1;
}


.journey_sec{
  position: relative;
  width: 100%;
}

.journey_wrap{
  position: relative;
  width: 100%;
  padding-top: 25px;
  display: flex;
  flex-wrap: wrap;
}
.journey-card{
  position: relative;
  width: 100%;
  width: 33.33%;
  display: flex;
  flex-direction: column;
}
.journey-img img{border-radius: 10px; width: 100%;}
.journey-img{padding:  0 0 20px;border-bottom: 1px solid rgba(213, 213, 213, 1);}
.journey-card-cont{position: relative; padding: 20px 15px 0 ; text-align: center;height: 216px;}
.journey-card-cont h4{
  font-size: 20px;
  line-height: 1.2;
  font-weight: 400;
  position: relative;
  text-transform: capitalize;
  color: #000;
  padding-bottom: 15px;
}
.journey-card-cont span{
  width: 20px;
  height: 20px;
  background: #000;
  border-radius: 50%;
  display: inline-block;
  position: absolute;
  top: -11px;
}
.journey-card-cont{margin-bottom: 10px;}
.journey-card-cont h6{
  color: var(--clr-black-300);
  font-size: 16px;
  line-height: 30px;
}
.journey-card:nth-child(even){ flex-direction: column-reverse;}
.journey-card:nth-child(even) .journey-card-cont{ padding: 0 15px 20px ;}
.journey-card:nth-child(even) .journey-img{padding:  20px 0 0;border-bottom:inherit; border-top: 1px solid rgba(213, 213, 213, 1);}
.journey-card:nth-child(even) .journey-card-cont span{bottom: -20px; top: inherit;}




.livable-progress {
  width: 100px;
  height: 100px;
  font-size: 30px;
  border-radius: 50%;
  overflow: hidden;
  position: relative;

  text-align: center;
  line-height: 200px;
}



.livable-progress .title {
  background: rgba(217, 217, 217, 1);
  border: 8px solid #fff;
  position: absolute;
  width: 100%;

  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  text-align: center;
  height: 100%;
  border-radius: 100%;
  align-content: center;
}
.livable-progress .title h6{
  color: #000;
  font-size: 22px;
}


.livable-progress .left, .livable-progress .right {
  width: 50%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  border: 2px solid rgba(50, 50, 50, 1);
  border-radius: 100px 0px 0px 100px;
  border-right: 0;
  transform-origin: right;

}

.livable-progress .left {animation: load1 1s linear forwards;}

.progress:nth-of-type(2) .right, .livable-progress:nth-of-type(3) .right {animation: load2 .5s linear forwards 1s;}

.livable-progress:last-of-type .right, .livable-progress:first-of-type .right {animation: load3 .8s linear forwards 1s;}

@keyframes load1 {
  0% {transform: rotate(0deg);}

  100% {transform: rotate(180deg);}
}

@keyframes load2 {
  0% {z-index: 100;transform: rotate(180deg);}

  100% {z-index: 100;transform: rotate(270deg);}
}

@keyframes load3 {
  0% {z-index: 100;transform: rotate(180deg);}

  100% {
      z-index: 100;transform: rotate(315deg);}
}
.livable_spaces-left-wrap{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  gap: 15px;
  justify-content: space-between;
  padding-top: 25px;
}
.livable_spaces-left-box{
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 48%;
  gap: 15px;
 align-items: center;
}
.livable_spaces-left-box h5{
  font-size: 20px;
  color: #000;
  font-family: var(--ff-primary);
  font-weight: 500;
  width: 50%;
  line-height: 30px;
  text-transform: capitalize;
}

.livable_spaces-sec{
  position: relative;
  width: 100%;
}
.livable_spaces-right{position: relative; width: 100%;}
.wrapper{
  width: 100%;
  height: 360px;
  position: absolute;
  left: 0;
  top: 0;
  overflow: hidden;
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
  border-radius: 15px;

}


.before-after-slider {
  position: relative;
  overflow: hidden;
  width: 100%;
  border-radius: 0;
}

.before-after-slider img {
  max-width: unset;
  border-radius: 0;
  height: 100%;
  width: 100%
}

.before-after-slider__after-image {
  display: block
}

.before-after-slider__before-image {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 50%;
  height: 100%
}

.before-after-slider__resizer {
  position: absolute;
  top: 0;
  left: 50%;
  display: flex;
  width: 2px;
  height: 100%;
  align-items: center;
  background: #fcfcfc;
  -ms-touch-action: pan-y;
  touch-action: pan-y
}

.before-after-slider__resizer svg {
  position: absolute;
  width: 2.5rem !important;
  height: 2.5rem;
  padding: .5rem;
  border: 2px solid #fcfcfc;
  margin: 0 0 0 -1.75rem;
  background: #fff;
  border-radius: 50%;
  color: #000;
  left: 10px;
  cursor: pointer
}
.before-after-slider__resizer img{
  width: 35px;
  left: -15px;
  position: absolute;
  height: auto;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  cursor: ew-resize;
}
/* Our image information */
.wrapper .before,
.wrapper .after {
  width:100%;
  height:100%;
  background-repeat:no-repeat;
  background-color: white;
  background-size: cover;
  background-position: center;
  position: absolute;
  top:0;
  left:0;
  pointer-events:none;
  overflow: hidden;
}

.content-image{
  height:100%;
}

.wrapper .after{
  width:125px;
}

.wrapper .scroller{
  width: 50px;
  height:50px;
  position: absolute;
  left:100px;
  top:50%;
  transform:translateY(-50%);
  border-radius:50%;
  background-color: transparent;
  opacity:0.9;
  pointer-events:auto;
  cursor: pointer;
}

.wrapper .scroller:hover{
  opacity:1;
}

.wrapper .scrolling{
  pointer-events:none;
  opacity:1;

}

.wrapper .scroller__thumb{
  width:100%;
  height:100%;
  padding:5px;
}

.wrapper .scroller:before,
.wrapper .scroller:after{
  content:" ";
  display: block;
  width: 5px;
  height: 9999px;
  position: absolute;
  left: 50%;
  margin-left: -3.5px;
  z-index: 30;
  transition:0.1s;
}
.wrapper .scroller:before{
  top:100%;
}
.wrapper .scroller:after{
  bottom:100%;
}

/* If you want to cahnge the colors, make sure you change the fill in the svgs to match */
.wrapper .scroller{
  border: 5px solid #fff;
}
.wrapper .scroller:before,
.wrapper .scroller:after{
  background: #fff;
}



.contact_page-sec{
  position: relative;
  width: 100%;
}
.contact_page-box{
  position: relative;
  width: 100%;
  padding: 25px 20px;
  background: rgba(247, 247, 247, 1);
  border-radius: 10px;
  height: 100%;
}
.contact_page-icon{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 15px;
  padding-bottom: 15px;
  margin-bottom: 15px;
  border-bottom: 1px solid rgba(185, 185, 185, 1);
}
.contact_page-icon span{
  background: rgba(0, 0, 0, 0.5);
 width: 50px;
 height: 50px;
 border-radius: 50%;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 25px;
 color: #fff;
}
.contact_page-icon h6{
 color: #000;
 font-size: 20px;
 font-weight: 500;
 font-family: var(--ff-primary);
}
.contact_page-box li{
 margin-bottom: 10px;
 font-size: 16px;
 line-height: 26px;
 color: rgba(142, 142, 142, 1);
}
.contact_page-box li a{ color: rgba(142, 142, 142, 1);}

.contact_page-form-sec{
  position: relative;
  width: 100%;
}
.contact_page-img{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
}
.contact_page-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.contact_page-form-left h2{
  color: #fff;
}
.contact_page-form-left p{
  color: #fff;
}
.contact_page-form-left ul{display: flex; gap: 15px; margin-top: 20px;}
.contact_page-form-left ul li a {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  color: rgba(255, 255, 255, 1);
  border: 1px solid rgba(255, 255, 255, 1);
}
.contact_page-form{
  padding: 20px;
  position: relative;
  background: rgba(0, 0, 0, 0.5);

}


.contact_page-form input, .contact_page-form textarea, .contact_page-form select {
  border-width: 0px 0px 1px 0px !important;
  border-color: #fff !important;
  background-color: transparent;
  border-radius: 0;
  height: 50px;
  padding: 5px 0;
  color: #fff;
  outline: none;
  font-size: 16px;
  color: #fff;
  width: 100%;
}
.contact_page-form input[type="submit"] {
  border: none;
  position: relative;
  z-index: 11;
}
.contact_page-form input::placeholder, .contact_page-form textarea::placeholder, .contact_page-form select::placeholder {
  color: #fff;
  opacity: 1;
}
.contact_page-form .wpcf7-spinner{position: absolute;}

/* services page */
.services_inner-sec{
  position: relative;
  width: 100%;
}
.services_inner-cont{
  padding-bottom: 30px;
}

.services_inner-text{
  position: relative;

}
.services_inner-text p{
  padding-bottom: 20px;
}

.portfolio-tab{
  position: relative;
  width: 100%;
  text-align: center;
 padding: 30px 0;
}

.portfolio-tab ul{
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center;
  align-items: center;
}
.portfolio_box{
  position: relative;
  
}
.load-more-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: transparent;
  color: #000;
  border: 1px solid #000;
  font-size: 14px !important;
  font-weight: 500 !important;
  padding: 0px 30px;
  height: 50px;
  border-radius: 0px;
  text-transform: uppercase;
  transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
  letter-spacing: 1.05px;
  font-family: var(--ff-primary);
  position: relative;
}
.portfolio_box img{width: 100%; height: 400px; object-fit: cover; border-radius: 10px;}
.portfolio-tab ul li a{
  font-size: 18px;
  color: rgba(158, 158, 158, 1);
  font-weight: 500px;
  border: 1px transparent;
  font-family: var(--ff-primary);
  padding: 5px 15px;
}
.portfolio-tab ul li.active a{
  border: 1px solid #000;
  color: #000;
}
.portfolio_box-cont li{
display: flex;
gap: 10px;
font-size: 18px;
color:#fff;
font-weight: 600px;
margin-bottom: 5;
}
.portfolio_box-cont li p{
  color:#fff;
font-weight: 600px;
margin-bottom: 0;
font-size: 18px;
}
.portfolio_box-cont li:last-child{margin-bottom: 0;}
.portfolio_box-cont {padding: 15px 45px 15px 15px; border: 1px solid #fff; position: absolute; left: 50% ;bottom: 20px; width: 95%; transform: translateX(-50%); border-radius: 10px; opacity: 0;transition: all 0.5s ease-in-out;z-index: 1;}
.portfolio_box-cont .portfolio_icon{
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  background: rgba(255, 255, 255, 1);
  color: #111;
  border-radius: 5px;
  position: absolute;
  right: 11px;
  bottom: 10px
}
.portfolio_box-cont li img{width: 16px; height: 17px; margin-top: 5px;}
.portfolio_box::before{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom,rgba(0,0,0,0) 0%,rgb(0 0 0) 100%);
  content: '';
  opacity: 0;
  transition: all 0.5s ease-in-out;
  z-index: 1;
}
.portfolio_box:hover::before{
 opacity: 1;
}
.portfolio_box:hover .portfolio_box-cont{opacity: 1;}

.career_page-left{
  position: relative;
  width: 100%;
  
}
.career_page-left h3{
  font-size: 40px;
  line-height: 1.2;
  font-weight: 700;
  position: relative;
  text-transform: capitalize;
  color: #000;
  padding-bottom: 15px;
}

.career_form .form-control {
  border-width: 0px 0px 1px 0px !important;
  border-color: hsla(0, 0%, 62%, 1) !important;
  background-color: transparent;
  border-radius: 0;
  height: 50px;
  padding: 5px 0px;
  color:#000;
  outline: none;
  font-size: 16px;
  width: 100%;
}
.career_form .form-control:focus{box-shadow: none;}
.career_form input[type="file"]{
  margin:  20px 0;
}
.career_form input[type="submit"]{
  background: transparent;border: none !important;
  position: relative;
  z-index: 9;
}
.career_form ::file-selector-button {
  padding: 5px;
}
.career_form .wpcf7-response-output{border: 1px solid #000;}


.portfolio_innerSlider-wrap {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  display: flex;
  gap: 15px;

}
.portfolio_innerSlider {
  display: flex;
  width: 100%;
  height: 100vh; 

}
.portfolio_innerSlider-item {
  position: relative;
  flex: 0 0 33.33%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.portfolio_innerSlider-item img {
  width: 100%;
  height: 100vh; 
  object-fit: cover;
  transition: transform 0.3s ease-in-out;
}
.portfolio_innerSlider-item:hover img {
  transform: scale(1.05);
}
.portfolio_innerSlider-link{width: 100%; border-radius: 10px; overflow: hidden;}
.portfolio_inner-bottom{
  position: relative;
}
.portfolio_inner-bottom ul{
  display: flex;
  align-items: center;
 flex-wrap: wrap;
gap: 20px;
padding-top: 35px;

}
.portfolio_inner-bottom ul li{display: flex; gap: 10px;align-items: center;}
.portfolio_inner-bottom ul li p{
  color: rgba(130, 130, 130, 1);
  font-weight: 600px;
  margin-bottom: 0;
  font-size: 18px;
}
.portfolio_inner-bottom ul li img{
  filter: brightness(0) saturate(100%) invert(38%) sepia(98%) saturate(14%) hue-rotate(323deg) brightness(106%) contrast(86%);
}
.custom-button .wpcf7-spinner{position: absolute;}
.contact_page-form-sec .contact_page-form .wpcf7-response-output {color: #fff;}
.portfolio-inner-header{position: relative; background: url(../images/portfolio_inner-bg.png) no-repeat  0 0 ; width: 100%;}

.about_behind-right img{width: 100%;}
.about_behind-righ{border-radius: 10px; overflow: hidden;}

.header-popup .contact_page-form{background: none;}

.header-popup .contact_page-form input, .header-popup .contact_page-form textarea, .header-popup .contact_page-form select {
  border-width:  1px !important;
  border-color: #000 !important;
  background-color: transparent;
  border-radius: 0;
  height: 50px;
  padding: 5px 10px;
  color: #000;
  outline: none;
  font-size: 16px;
  width: 100%;
}
.header-popup .contact_page-form textarea{height: 100px; resize: none;}

.header-popup .contact_page-form input::placeholder, .header-popup .contact_page-form textarea::placeholder{color: #000; opacity: 1;}

.blog_details-sec{
 position: relative;
 width: 100%;
}
.blog_details-left{
  position: relative;
  width: 100%;
}

.blog_details-img{
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 15px;
}
.blog_details-img img{
  width: 100%;
}

.blog_details-left h2, .blog_details-left h1, .blog_details-left h3 .blog_details-left h4, .blog_details-left h5{
 margin-bottom: 15px;
}
.blog_details-left p{
  margin-bottom: 12px;
  line-height: 28px;
}
.blog_details-left p a{color: #000;}
.blog_details-left li{
  font-weight: 400;
  margin-bottom: 0;
  color: var(--clr-black-300);
  font-size: 16px;
  padding-left: 15px;
  margin-bottom: 10px;
  position: relative;
}
.blog_details-left li::before{
  position: absolute;
  left: 0;
  top:8px;
  width: 8px;
  height: 8px;
  border-radius: 50px;
  background-color: #000;
  content: '';
}
.blog_details-right {
  position: sticky;
  width: 100%;
  top: 115px;
}
.blog_details-search{
  padding: 10px;
  border-radius: 10px;
  background: rgba(244, 244, 244, 1);
  margin-bottom: 15px;
}
.blog_details-search input{
  border: none !important;
  background-image: url(../images/search-blog.png) ;
  border-radius: 0;
  padding: 10px 30px 10px 10px;
  font-size: 16px;
  color: #000;
  width: 100%;
  background-size: 20px;
  background-color: #fff;
  background-position: right 10px center;
  background-repeat: no-repeat;
}
.blog_details-right h4{
  font-size: 24px;
  font-weight: 600;
  line-height: 28px;
  color: #000;
}

.blog_details-categories li a{
  padding: 12px 0;
  font-size: 16px;
  color: rgba(158, 158, 158, 1);
  display: flex;
  justify-content: space-between;
  gap: 10px;
  border-bottom: 1px solid rgba(158, 158, 158, 1);
  transition: all 0.4s ease-in-out;
}
.blog_details-categories li a:hover{color: #000;}
.blog_details-categories ul{margin-top: 12px;}
.blog_details-form{
  background: rgba(244, 244, 244, 1);
  padding: 15px;
  border-radius: 10px;
  margin-top: 20px;
}
.blog_details-form form{padding-top: 20px;}
.blog_details-form input, .blog_details-form textarea, .blog_details-form select{
  border: 1px solid rgba(158, 158, 158, 1);
  background-color: transparent;
  border-radius: 0;
  padding: 10px;
  outline: none;
  font-size: 16px;
  color: #000;
  width: 100%;
}
.blog_details-form textarea{
 height: 80px;
  resize: none;
}
.blog_details-form input::placeholder, .blog_details-form textarea::placeholder, .blog_details-form select::placeholder{color: rgba(158, 158, 158, 1); opacity: 1;}
.blog_details-form input[type=submit]{
  border: none;
  position: relative;
  z-index: 11;
}
.blog_details-form .custom-button::before {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}
.blog_details-form .custom-button::after {

  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.blog_details-tag{
  position: relative;
  padding-top: 20px;
}
.blog_details-tag ul{
  padding-top: 15px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.blog_details-tag  li a{
  padding: 5px 12px;
  font-size: 16px;
  color: rgba(158, 158, 158, 1);
  border: 1px solid rgba(158, 158, 158, 1);
  border-radius: 5px;
  display: inline-block;
}

.blog_details-postsec{
  position: relative;
  width: 100%;
}
.blog_details-post-wrap{
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 15px;
  justify-content: space-between;
}
.blog_details-post-box{
  position: relative;
  width: 48%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.blog_details-post-img{
  width: 200px;
  height: 200px;
  border-radius: 100%;
 overflow: hidden;
}
.blog_details-post-img img{width: 100%; height: 100%; object-fit: cover;}
.blog_details-post-cont{
  flex: 1 0 auto;
  width: 50%;
  padding-left: 15px;
}
.blog_details-post-cont span{
  color: rgba(158, 158, 158, 1);
  font-size: 14px;
  display: block;
  margin-bottom: 10px;
}
.blog_details-post-cont a{
  display: flex;
  gap: 10px;
  
}
.blog_details-post-cont a img{height: 19px;
  padding-top: 10px;}
.blog_details-post-cont h4{
  font-size: 20px;
  color: #000;
}

.blog_details-post-bt{
  position: relative;
  padding-top: 25px;
}
.blog_details-post-bt h6{
  font-size: 20px;
  color: #000;
  margin-bottom: 25px;
}
.blog_details-post-bt-box{
  position: relative;
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
}
.blog_details-post-bt-box img{width: 100%;}
.blog_details-post-bt-box::before{
  position: absolute;
  top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 content: '';
 background: rgba(0, 0, 0, 0.45);

}
.blog_details-post-bt-box h5{
  font-size: 22px;
  color: #fff;
  position: absolute;
  left: 50%;
  top: 50%;
transform: translate(-50%,-50%);
padding: 15px;
z-index: 9;
width: 100%;
text-align: center;
line-height: 28px;
}

.banner_cont .breadcrumb li:last-child a::before {display: none;}
.header-popup .custom-button::before {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}
.header-popup .custom-button::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 102%;
  height: 125%;
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.header-popup .btn-close{
	position: absolute;
  right: 20px;
  top: 20px;
	z-index:99;
}

.career_form .custom-button::before {
  border-top: 1px solid #000;
  border-bottom: 1px solid #000;
}
.career_form .custom-button::after { 
  border-left: 1px solid #000;
  border-right: 1px solid #000;
}
.works_wrap .accordion-item{border: none; border-bottom: 1px solid rgba(213, 213, 213, 1);}
.works_wrap .accordion-item:last-child{border-bottom: inherit;}
.works_wrap .accordion-button:focus{box-shadow: inherit;}
.works_wrap  .accordion-button span{
  width: 30px;
  height: 30px;
  border-radius: 100%;
  background: rgba(232, 232, 232, 0.71);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 16px;
  font-weight: 500;
  flex: 0 0 auto;
  opacity: 1;
  margin-right: 10px;
}
.works_wrap .accordion-button:not(.collapsed) span{
  opacity: 1;
  background: rgba(0, 0, 0, 0.71);
}
.works_wrap  .accordion-button{
  padding: 10px 0;
  font-size: 16px;
  
}
.works_wrap .accordion-body{padding: 10px 0 ;}
.works_wrap .accordion-body .works_wrap_images{margin-bottom: 10px;}
.works_wrap .accordion-button:not(.collapsed){background: none; color: #000;}

.abin__img {
  overflow: hidden;
  background-color: #eee;
  width: 100%;
}
.abin__img-reveal {
  visibility: hidden;
  position: relative;
  overflow: hidden;
}
.abin__img-reveal.reveal-right img {
  transform-origin: right;
}
.abin__img-reveal img {
  transform-origin: left;
}
.services_box .abin__img  .abin__img-reveal img{width: 100%; max-width: 100% !important;} 
.gray_bg-thim{background: rgba(248, 248, 248, 1);}
.latest_news-video-slider .latest_news-img video{ width: 100%; object-fit: cover;border-radius: 10px;}
.top-footer.custom-pad{padding-bottom: 35px !important;}
.kenburns-top {
	-webkit-animation: kenburns-top 5s ease-out both;
	        animation: kenburns-top 5s ease-out both;
}
.abin__img-reveal-img img{width:100% !important; max-width:100% !important;}
.abin__img-reveal-img{width:100% ; }
.abin__video-reveal video{height: 600px; width: 100%; object-fit: cover;}


.text-primary {
  --bs-text-opacity: 1;
  margin: 0 auto !important;
  color: #000 !important;
}
.btn-primary{background-color: #000 !important;
  border-color: #000 !important;}
.border-primary{
  border-color: rgba(213, 213, 213, 1) !important;
}

.footer_box .wpcf7 form.invalid .wpcf7-response-output{
  border-color: #fff !important;
  color: #fff !important;
  margin: 12px 0 0 !important;
  border-width: 1px;
}


.high-on-er .icon-list li {
  position:relative
}
.high-on-er .icon-list li:before {
  position: absolute;
  left: 0px;
  top: 12px;
  width: 8px;
  height: 8px;
  border-radius: 50px;
  background-color: rgb(0, 0, 0);
  content: "";
}
.high-on-er .icon-list li a {
  font-size:16px;
  font-weight:400;
  padding-left:20px;
  line-height:28px;
  color:rgb(0, 0, 0);
}
.high-on-e  h4 {
  color:rgb(0, 0, 0);
  font-size:28px;
  font-weight:600
}
.high-on-er p {
  padding:8px 0
}

.footer_left-form form.invalid .wpcf7-response-output{
  border-color: #fff !important;
  color: #fff !important;
  margin: 12px 0 0 !important;
  border-width: 1px;
}
.blog_details-search .search-results-list li{margin-top: 15px;}
.blog_details-search .search-results-list li a{display: flex; align-items: center; }
.blog_details-search .search-results-list li a .search-result-image{width: 40%;}
.blog_details-search .search-results-list li a .search-result-title{width: 60%; padding-left: 12px;color: var(--clr-black-300);
  font-size: 16px;}
  .blog_details-search .search-results-list li a .search-result-image img{height: 100px; object-fit: cover;}

.blog_details-sec .banner_cont .breadcrumb a::before {
  position: absolute;
  content: '';
  top: 54%;
  right: 0;
  width: 10px;
  height: 2px;
  transform: translateY(-50%);
  background: #000;
}
.blog_details-sec .banner_cont .breadcrumb{justify-content:start;}
.blog_details-sec .banner_cont .breadcrumb a, .blog_details-sec .banner_cont .breadcrumb li {
	color: #000;
}


.floating_btn a{
  text-decoration:none;
}
.floating_btn {
  position: fixed;
  bottom: 30px;
  right: 30px;
  width: 100px;
  height: 100px;
  display: flex;
  flex-direction: column;
  align-items:center;
  justify-content:center;
  z-index: 1000;
}

@keyframes pulsing {
  to {
    box-shadow: 0 0 0 30px rgba(232, 76, 61, 0);
  }
}

.floating_btn .contact_icon {
  background-color: #42db87;
  color: #fff;
  width: 60px;
  height: 60px;
  font-size:30px;
  border-radius: 50px;
  text-align: center;
  box-shadow: 2px 2px 3px #999;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translatey(0px);
  animation: pulse 1.5s infinite;
  box-shadow: 0 0 0 0 #42db87;
  -webkit-animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
  font-weight: normal;
  font-family: sans-serif;
  text-decoration: none !important;
  transition: all 300ms ease-in-out;
}