@import url("https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200..1000;1,200..1000&family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap");

:root {
  --primaryyellow: #f8aa00;
  --primaryorange: #e08823;
  --primarybluedark: #273157;
  --primarybluelight: #3d476f;
  --bluelight: #3c5ab9;
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  font-family: "Mulish", sans-serif;
}

li,
a,
button,
input,
label,
span {
  font-family: "Mulish", sans-serif;
}

body {
  scroll-behavior: smooth;
}

section {
  overflow-x: hidden;
}

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgb(158, 158, 158);
  border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--primarybluelight);
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--primarybluedark);
}

/* Header */
.hero-header {
  /*display: flex;*/
  width: 100%;
  /*overflow: visible;*/
}

/* Logo section */
.hero-header .logo-section {
  flex: 0 0 200px;
  display: flex;
  justify-content: end;
  align-items: center;
  background: white;
  z-index: 2;
}

.hero-header .logo-section img {
  width: 100px;
  padding: 4px;
}

.hero-header .banner-section {
  position: relative;
  /*flex: 1;*/
  /*display: flex;*/
  flex-direction: column;
}

.hero-header .menu-sec-1 {
  /*flex: 1;*/
  /*background: linear-gradient(90deg,*/
  /*    var(--primaryyellow) 0%,*/
  /*    var(--primaryorange) 100%);*/
  background: linear-gradient(0deg, #FFD145 0%, #FFD145 100%);
  /*clip-path: polygon(11% 0%, 100% 0%, 100% 100%, 9% 100%);*/
  display: flex;
  align-items: center;
  justify-content: space-around;
  color: #fff;
  font-size: 1.25rem;
  width:100%;
  padding:10px 5px;
}

.hero-header .menu-sec-2 {
      /*flex: 1;*/
      /*background: linear-gradient(180deg, var(--primarybluedark) 0%, var(--primarybluelight) 100%);*/
      /*clip-path: polygon(9% 0%, 100% 0%, 100% 100%, 7% 100%);*/
      display: flex;
      align-items: center;
      justify-content: space-around;
      gap: 50px;
      color: #fff;
      font-size: 19px;
      padding: 7px 5px;
      background:#fff;
      width:100%;
}

.menu-sec-1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
}

.menu-sec-1 ul {
  padding: 0;
  margin: 0;
  display: flex;
  gap: 30px;
  color: var(--primarybluedark);
  font-size: 16px;
  font-weight: 700;
}

.menu-sec-1 ul li {
  list-style: none;
}

.menu-sec-1 ul li a {
  text-decoration: none;
  color: #273157;
}

.menu-sec-1 ul li a:hover {
  color: #fff;
}
.menu-sec-2 img{
    width:90px;
}
.menu-sec-2 .nav-ul li a {
  text-decoration: none;
  color:#273157;
  font-size: 16px;
  font-weight: 600;
  position:relative;
}

.menu-sec-2 .nav-ul li a:hover {
  color: #ffbc2b;
}
.menu-sec-2 .nav-ul li a i{
    font-size: 12px;
}

.social-header {
  display: grid;
  grid-template-columns: repeat(4,1fr);
  gap: 20px;
}

.social-header a {
  color: var(--primarybluedark);
}

.social-header a:hover {
  color: #fff;
}

.menu-sec-2 {
  display: flex;
}

.menu-sec-2 .nav-ul {
  padding: 0;
  margin: 0;
  display: flex;
  justify-content: space-around;
  gap: 45px;
  align-items: center;
}

.menu-sec-2 .nav-ul li {
  list-style: none;
  position:relative;
}
.menu-sec-2 .nav-ul li .sub-menu{
    display:none;
    position: absolute;
    background-color: #fff;
    width: 300px;
    padding: 20px; 
    left: 0; 
    top: 30px; 
    z-index: 9999; 
    box-shadow: 0 5px 10px rgba(0,0,0,0.1); 
    border-radius: 5px; 
}
.menu-sec-2 .nav-ul li:hover .sub-menu{
    display:block;
}
.sub-menu li{
   color: #000;
    font-size: 16px;
    list-style: none;
    margin-bottom: 15px;
}


.menu-sec-2 .nav-ul li a {
  position: relative;
  padding-bottom: 5px; /* Add some space for the border */
  text-decoration: none;
  transition: all 0.3s ease;
}

.menu-sec-2 .nav-ul li a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 1px;
  background-color: #273157;
  transition: width 0.3s ease;
}

.menu-sec-2 .nav-ul li a:hover::after {
  width: 100%;
}

/* For the active menu item if needed */
.menu-sec-2 .nav-ul li a.active::after {
  width: 100%;
}



.con-btn {
  padding: 12px 25px;
  border-radius: 20px;
  background: linear-gradient(180deg, #273157 0%, #273157 100%);
  text-decoration: none !important;
  color: #fff;
  font-weight: 600;
  font-size: 16px;
  transition: 0.3s ease-in-out;
  border: 2px solid #273157;
}

.con-btn:hover {
  border: 2px solid #2e385f;
  background: transparent;
  color: #2e385f;
}

/* Hide on desktop */
.mobile-header,
.mobile-menu {
  display: none;
}

/* Hamburger icon */
.hamburger {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding: 12px;
}

.hamburger .bar {
  width: 25px;
  height: 3px;
  background-color: #333;
  transition: 0.3s;
}

/* Mobile menu panel */
.mobile-menu {
  position: fixed;
  /* Makes it work with overflow hidden */
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  background: #242d51;
  color: white;
  z-index: 9999;
  display: none;
  flex-direction: column;
  padding: 20px;
  overflow-y: auto;
}

/* Header inside mobile menu */
.menu-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

/* Close icon */
.close-icon {
  font-size: 24px;
  cursor: pointer;
  color: white;
}

/* Mobile nav list */
.mobile-menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mobile-menu ul li {
  border-bottom: 1px solid #444;
}

.mobile-menu ul li a {
  display: block;
  padding: 15px 10px;
  color: white;
  text-decoration: none;
  font-size: 18px;
}

.mobile-menu ul li a:hover {
  background: #384466;
}



.mobile-menu .dropdown {
  display: none;
  list-style: none;
  padding-left: 15px;
  background: transparent;
}
.mobile-menu .dropdown a{
    font-size:16px;
}
.mobile-menu .has-dropdown.open > .dropdown {
  display: block;
}

/* Optional - for visual styling */
.mobile-menu a {
  display: block;
  padding: 10px;
  text-decoration: none;
  color: #333;
}

/*.mobile-menu .has-dropdown > a::after {*/
/*  content: " ▼";*/
/*  font-size: 12px;*/
/*}*/






/* Banner Section */
.hero-banner {
  background: url(../images/banner-new.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 80px 0px;
  position:relative;
  z-index:10;
}

.hero-banner-container {
  display: flex;
  align-items: center;
}

.banner-sec-left ul {
  display: flex;
  color: #fff;
  gap: 50px;
}

.banner-sec-left ul li::marker {
  color: var(--primaryyellow);
}

.hero-banner .banner-head {
  color: #fff;
  font-size: 45px;
  font-weight: 700;
  margin-left: -20px;
}

.before-stroke {
  position: relative;
}

.hero-banner .before-stroke::before {
  content: "";
  background-image: url(../images/Union.png);
  position: absolute;
  left: -62px;
  top: 10px;
  width: 100%;
  height: 180px;
  background-repeat: no-repeat;
}

.hero-banner .banner-para {
  color: #fff;
  font-size: 17px;
  font-weight: 400;
  margin-top: 25px;
  margin-bottom: 10px;
  margin-left: -20px;
}

.banner-btns {
  display: flex;
  align-items: center;
  gap: 30px;
  margin-left: -20px;
}

.explore-button {
  margin-top: 20px;
}

.explore-button a {
  padding: 12px 25px;
  border-radius: 50px;
  background: linear-gradient(90deg, #f1ab1f 0%, #e08823 48.94%);
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  border: 2px solid transparent;
  transition: 0.3s ease-in-out;
}

.explore-button a:hover {
  background: transparent;
  border: 2px solid var(--primaryorange);
  transition: 0.3s ease-in-out;
}

@keyframes animate-pulse {
  0% {
    box-shadow: 0 0 0 0 var(--primaryyellow), 0 0 0 0 var(--primaryyellow);
  }

  40% {
    box-shadow: 0 0 0 20px rgba(255, 109, 74, 0), 0 0 0 0 var(--primaryyellow);
  }

  80% {
    box-shadow: 0 0 0 20px rgba(255, 109, 74, 0),
      0 0 0 30px rgba(255, 109, 74, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
  }
}

.play-button {
  margin-top: 20px;
}

.play-button img {
  width: 45px;
  margin-right: 10px;
  animation: animate-pulse 3s linear infinite;
  cursor: pointer;
  border-radius: 40px;
}

.play-button a {
  padding: 15px 25px;
  border-radius: 50px;
  background-color: transparent;
  text-decoration: none;
  color: #fff;
  font-size: 22px;
  font-weight: 600;
}

.enquiry-form {
  border-radius: 18px;
  border: 1px solid #b9bcc5;
  background: #fefefe;
  padding: 25px 20px 10px 20px;
}

.enquire-form-heading {
  color: #343f67;
  font-size: 25px;
  font-weight: 800;
  margin: 15px;
}

.form-sections {
  text-align: center;
}

.form-sections input {
  border-radius: 25px;
  border: 1px solid #e9edf9;
  background: #f8f8f8;
  height: 55px;
  margin-bottom: 12px;
  width: 100%;
  padding: 10px;
}

.form-sections textarea {
  border-radius: 25px;
  border: 1px solid #e9edf9;
  background: #f8f8f8;
  margin-bottom: 20px;
  width: 100%;
  padding: 10px;
}

.schedule-button {
  margin-top: 15px;
}

.schedule-button a {
  padding: 15px 25px;
  border-radius: 50px;
  background: #3c5ab9;
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  border: 2px solid transparent;
}

.schedule-button a:hover {
  border: 2px solid #3c5ab9;
  background: transparent;
  color: #3c5ab9;
}

/* Counter Section */
.counter-section {
  padding: 50px 0px;
}

.counter-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  text-align: center;
  gap: 7%;
}

.count {
  text-align: center;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: #273157;
  font-size: 80px;
  font-weight: 800;
  text-transform: capitalize;
  color: transparent;
}

.counter-inner1 p {
  color: #6e6e6e;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
}

.counter-inner2 p {
  color: #6e6e6e;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
}

.counter-inner3 p {
  color: #6e6e6e;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
}

.counter-inner4 p {
  color: #6e6e6e;
  text-align: center;
  font-size: 20px;
  font-weight: 700;
}

/* Animation */
@keyframes scrollLoop {
  0% {
    transform: translateY(150px);
  }

  50% {
    transform: translateY(0);
  }

  100% {
    transform: translateY(150px);
  }
}

@keyframes scrollLoop2 {
  0% {
    transform: translateY(100px);
  }

  50% {
    transform: translateY(10px);
  }

  75% {
    transform: translateY(50px);
  }

  100% {
    transform: translateY(100px);
  }
}

@keyframes scrollLoop3 {
  0% {
    transform: translateY(150px);
  }

  25% {
    transform: translateY(100px);
  }

  50% {
    transform: translateY(0px);
  }

  75% {
    transform: translateY(80px);
  }

  100% {
    transform: translateY(150px);
  }
}

.counter-inner1 {
  position: relative;
}

.counter-inner1::after {
  position: absolute;
  background-repeat: no-repeat;
  content: "";
  height: 153px;
  top: 0;
  right: -35px;
  border: 1px solid var(--primaryyellow);
}

.counter-inner1::before {
  position: absolute;
  content: "";
  border-radius: 50px;
  width: 10px;
  animation: scrollLoop 3s linear infinite;
  top: 0;
  height: 10px;
  right: -39px;
  background: var(--primaryyellow);
}

.counter-inner2 {
  position: relative;
}

.counter-inner2::after {
  position: absolute;
  background-repeat: no-repeat;
  content: "";
  height: 153px;
  top: 0;
  right: -35px;
  border: 1px solid var(--primaryyellow);
}

.counter-inner2::before {
  position: absolute;
  content: "";
  border-radius: 50px;
  width: 10px;
  animation: scrollLoop2 4s linear infinite;
  top: 0;
  height: 10px;
  right: -39px;
  background: var(--primaryyellow);
}

.counter-inner3 {
  position: relative;
}

.counter-inner3::after {
  position: absolute;
  background-repeat: no-repeat;
  content: "";
  height: 153px;
  top: 0;
  right: -35px;
  border: 1px solid var(--primaryyellow);
}

.counter-inner3::before {
  position: absolute;
  content: "";
  border-radius: 50px;
  width: 10px;
  animation: scrollLoop3 5s linear infinite;
  top: 0;
  height: 10px;
  right: -39px;
  background: var(--primaryyellow);
}

/* Who we are  */
.who-we-are {
  padding: 40px 20px 30px 20px;
  position: relative;
}

.who-we-are::after {
  -webkit-text-stroke-width: 1.13px;
  -webkit-text-stroke-color: rgba(39, 49, 87, 0.11);
  font-size: 100px;
  font-weight: 800;
  text-transform: uppercase;
  content: "About us";
  position: absolute;
  right: -9%;
  top: 30%;
  transform: rotate(90deg);
  color: transparent;
}

.who-we-are-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.who-left {
  position: relative;
}

.who-left img {
  width: 100%;
}

.counter-left {
  position: absolute;
  background: linear-gradient(180deg, #273157 0%, #313c62 100%);
  padding: 10px;
  z-index: 1;
  right: 7%;
  border-radius: 9px;
  text-align: center;
  color: #fff;
}

.counter-left p {
  font-size: 18px;
  font-weight: 700;
  margin: 0;
}

.counter-left h5 {
  font-size: 40px;
  font-weight: 800;
}

.who-right {
  margin-left: 6%;
}

.small-head {
  color: #f8aa00;
  font-size: 20px;
  font-weight: 800;
  text-transform: uppercase;
}

.main-head {
  color: #273157;
  font-size: 40px;
  font-weight: 700;
}

.who-right-p {
  color: #515151;
  font-size: 18px;
  font-weight: 500;
}

#tsum-tabs {
  margin-top: 30px;
}

#tsum-tabs h1 {
  padding: 50px 0;
  font-weight: 400;
  text-align: center;
}

#tsum-tabs p {
  margin: 0 0 20px;
  line-height: 1.5;
}

#tsum-tabs main {
  margin: 0 auto;
  background: #fff;
}

#tsum-tabs section {
  display: none;
  padding: 20px 0 0;
}

#tsum-tabs input {
  display: none !important;
}

#tsum-tabs label {
  display: inline-block;
  /* margin: 0 0 -1px; */
  padding: 9px 50px;
  font-weight: 600;
  text-align: center;
  border: 1px solid transparent;
  position: relative;
  cursor: pointer;
  transition: 0.5s ease-in-out;
  border-radius: 33px;
  background: #f0f0f0;
}

#tsum-tabs input:checked+label {
  color: #ffffff !important;
  background-color: #f8aa00;
  border-radius: 33px;
}

#tsum-tabs input:checked+label::after {
  position: absolute;
  bottom: -29px;
  height: 0;
  width: 0;
  left: 40%;
  transform: rotate(180deg);
  border: 15px solid transparent;
  border-bottom-color: #f8aa00;
  content: "";
}

#tsum-tabs #tab1:checked~#content1,
#tsum-tabs #tab2:checked~#content2,
#tsum-tabs #tab3:checked~#content3 {
  display: block;
}

.who-we-cta {
  margin-top: 30px;
}

.who-we-cta a {
  border-radius: 50px;
  background: #424f7e;
  padding: 12px 30px;
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  border: 2px solid transparent;
  transition: 0.3 ease-in-out;
}

.who-we-cta a:hover {
  border: 2px solid #424f7e;
  background: transparent;
  color: #424f7e;
}

.who-we-cta a:hover svg path {
  fill: #424f7e;
}

/* SERVICES */
.hover-adds-cl {
  position: relative;
  padding: 3rem 0 3rem;
  margin: 0px 20px 0px 20px;
  border-radius: 10px;
}

.hover-adds-cl .section-title .section-title-big::before {
  position: absolute;
  -webkit-text-stroke-width: 1.13px;
  -webkit-text-stroke-color: rgba(255, 255, 255, 0.14);
  font-size: 100px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: transparent;
  content: "Services";
  left: 32%;
  top: -20%;
}

.section-title-big {
  margin-top: 30px;
}

.hover-adds-cl .section-title {
  position: absolute;
  z-index: 22;
  margin: 0 auto;
  left: 0;
  right: 0;
  top: 10%;
}

.hover-adds-cl .section-title .small-head,
.hover-adds-cl .section-title .main-head {
  color: #fff;
}

.hover-adds-cl .container-fluid {
  padding: 0 !important;
}

.hover-adds-cl .tg_background_list_wrapper {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: flex;
  background: #000;
  margin-bottom: 20px;
  border-radius: 20px;
}

.tg_background_list_wrapper.four_cols .tg_background_list_column {
  -webkit-box-flex: 0;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%;
}

.tg_background_list_wrapper .tg_background_list_column {
  position: relative;
  z-index: 2;
}

.tg_background_list_column {
  min-height: 750px;
  position: relative;
}

.tg_background_list_title .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 100%;
  padding-top: 20%;
  color: #e9e9e9;
  font-size: 16px;
  font-weight: 500;
  left: 0;
  transition: all 0.5s;
  transition: all 0.5s linear;
}

.tg_background_list_content .overlay .explore {
  border-radius: 56px;
  border: 0.8px solid #f8aa00;
  color: #f8aa00;
  font-size: 15px;
  font-weight: 600;
  padding: 7px 20px;
}

.tg_background_list_content .overlay .explore:hover {
  border: 0.8px solid #fff;
}

.tg_background_list_title .overlay h3 {
  color: #e9e9e9;
  font-size: 16px !important;
  font-weight: 500;
  border: none;
  margin: 5px 0px 20px 0px;
}

.tg_background_list_column:hover .tg_background_list_title .overlay {
  top: 0px;
  padding-top: 35%;
}

.tg_background_list_column:hover .tg_background_list_title {
  transform: translateY(-120px) !important;
}

.tg_background_list_wrapper .tg_background_list_column .tg_background_list_content {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: flex-end;
  padding: 40px;
  color: #fff;
}

.tg_background_list_wrapper .tg_background_list_content .tg_background_list_title {
  transition: transform 0.8s ease-in-out;
  transform: translateY(0px);
}

.our-works .tg_background_list_title {
  text-align: center;
}

.tg_background_list_column a {
  text-decoration: none;
}

.tg_background_list_wrapper .tg_background_list_column div.tg_background_list_content .tg-title-h3 {
  color: #acadb2;
  font-size: 23px;
  font-weight: 700;
  border-top: 1px solid #fff;
  padding-top: 10px;
}

.tg_background_list_wrapper .tg_background_img.hover {
  opacity: 1;
  visibility: visible;
  -ms-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -o-transform: scale(1.05);
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

.tg_background_list_wrapper .tg_background_img {
  transition-duration: 500ms;
}

.tg_background_list_wrapper .tg_background_img {
  visibility: hidden;
  opacity: 0;
  transition: all 1s;
}

.tg_background_list_wrapper .tg_background_img,
.tg_background_list_wrapper .tg_background_list_overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 0;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}

.resident-img {
  background-image: url("../images/home-services-1.png");
}

.commercial-img {
  background-image: url("../images/home-services-2.png");
}

.industrial-img {
  background-image: url("../images/home-services-3.png");
}

.interior-img {
  background-image: url("../images/home-services-4.png");
}

.other-serv-img {
  background-image: url("../images/home-services-5.png");
}

.serv-exp-btn {
  margin-top: -20px;
  z-index: 11;
  position: absolute;
  left: 40%;
}

.serv-exp-btn a {
  text-decoration: none;
  color: #273157;
}

.serv-exp-btn-a1 {
  color: #273157;
  font-size: 20px;
  font-weight: 700;
  padding: 18px 20px;
  background: #fff;
  border-radius: 50px;
  text-align: center;
  text-decoration: none;
}

.serv-exp-btn-a1 i {
  background: #424f7e;
  color: #fff;
  padding: 8px 10px;
  border-radius: 33px;
  font-size: 16px;
}

/* OUR WORKS */
.our-works {
  padding: 80px 0px;
  background: url(../images/our-works-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

.our-works::before {
  content: "";
  background: url(../images/ou-works-side.png);
  position: absolute;
  top: 0;
  left: 0px;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
}

.our-works-container::before {
  -webkit-text-stroke-width: 1.13px;
  -webkit-text-stroke-color: rgba(39, 49, 87, 0.11);
  font-size: 100px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: transparent;
  content: "Projects";
  position: absolute;
  left: 20%;
  top: 1%;
}

.tab-section {
  position: relative;
}

.our-works .tab-block {
  margin: auto;
  margin-top: -35px;

  .tab-mnu {
    display: flex;
    list-style: none;
    justify-content: flex-end;
    gap: 20px;

    &:after {
      content: "";
      display: table;
      clear: both;
    }

    li {
      box-sizing: border-box;
      float: left;
      background-color: #f6faff;
      border: 1px solid #e7a618;
      font-size: 16px;
      font-weight: 600;
      color: #273157;
      text-align: center;
      padding-top: 13px;
      padding-bottom: 13px;
      cursor: pointer;
      border-radius: 50px;
      padding: 13px 22px;

      &:not(:last-child) {
        border-radius: 50px;
        padding: 13px 22px;
      }

      &:hover:not(.active) {
        border: 1px solid #e7a618;
        background: #f6faff;
      }
    }

    .active {
      background-color: #e7a618;
      color: #273157;
      font-size: 16px;
      font-weight: 600;
      cursor: default;
    }
  }

  .tab-cont {
    color: #000;

    .tab-pane {
      padding: 20px 0px;
    }
  }
}

.projects-swiper {
  overflow: hidden;
}

.projects-swiper .swiper-pagination {
  position: absolute;
}

.projects-swiper .swiper-wrapper {
  margin: 20px 0px 50px 0px;
}

.projects-swiper .swiper-slide {
  border-radius: 15px;
  border: 1px solid #b2b2b2;
  background: #fff;
  padding: 15px;
  margin-right: 15px !important;
}

.projects-swiper .swiper-slide img {
  width: 100%;
}

.projects-swiper .swiper-pagination-bullet {
  width: 25px;
  border-radius: 5px;
  height: 5px;
}

.projects-swiper .swiper-pagination-bullet-active {
  background: #313c62;
}

.projects-swiper .swiper-card-heading {
  color: #273157;
  font-size: 20px;
  font-weight: 700;
  margin-top: 20px;
}

.projects-swiper .loc-butoon-sec {
  display: flex;
  justify-content: space-between;
}

.projects-swiper .loc-butoon-sec p {
  color: #898989;
  font-size: 14px;
}

.projects-swiper .loc-butoon-sec a {
  color: #273157;
  font-size: 14px;
}

/* Built quality cta sec */
.built-quality-section {
  background: url(../images/build-quality-bg.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 70px 0px;
}

.built-quality-content {
  padding: 70px 40px;
  border-radius: 38px;
  background: linear-gradient(270deg,
      rgba(39, 49, 87, 0) 0%,
      rgba(85, 106, 189, 0.13) 100%);
}

.built-quality-content h3 {
  color: #fff;
  font-size: 40px;
  font-weight: 700;
}

.get-started-button {
  margin-top: 50px;
}

.get-started-button a {
  padding: 15px 25px;
  border-radius: 50px;
  background: linear-gradient(90deg, #f1ab1f 0%, #e08823 48.94%);
  text-decoration: none;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  border: 2px solid transparent;
  transition: 0.3s ease-in-out;
}

.get-started-button a:hover {
  border: 2px solid var(--primaryorange);
  /* color: var(--primaryorange); */
  background: transparent;
}

/* How Works */
.how-it-works {
  padding: 70px 0px;
}

.how-it-works-container .small-head,
.how-it-works-container .main-head {
  text-align: center;
}

.how-it-works-container {
  position: relative;
}

.how-it-works-container::before {
  -webkit-text-stroke-width: 1.13px;
  -webkit-text-stroke-color: rgba(39, 49, 87, 0.11);
  font-size: 100px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: transparent;
  content: "Process";
  position: absolute;
  left: 30%;
  top: -5%;
}

.how-it-works .works-timeline {
  margin-top: 30px;
}

.how-it-works .works-timeline .timeline-individual {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  align-items: center;
}

.how-it-works .works-timeline .timeline-individual h5 {
  color: #273157;
  font-size: 30px;
  font-weight: 700;
}
.timeline-individual img{
  width: 90%;
}

.how-it-works .works-timeline .timeline-individual .steps::before {
  content: "";
  width: 20px;
  background: #273157;
  height: 1px;
  border-left: 1px solid black;
  transform: rotateX(329deg);
  position: absolute;
  margin-left: -28px;
  top: 11px;
}

.timeline-individual .left-align {
  position: relative;
}

.timeline-individual .right-align {
  position: relative;
}

.timeline-individual .right-align p,
.timeline-individual .right-align h5 {
  margin-right: 30px;
}

.timeline-individual .right-align::before {
  position: absolute;
  content: "";
  /* background-image: url(../images/line-timeline.png); */
  background-repeat: no-repeat;
  background-size: contain;
  right: 0;
  height: 100%;
  top: 0;
  /* width: 2px; */
  border: 1px solid #232b48;
}

.timeline-individual .left-align::before {
  position: absolute;
  content: "";
  /* background-image: url(../images/line-timeline.png); */
  background-repeat: no-repeat;
  background-size: contain;
  left: -10%;
  height: 100%;
  top: 0;
  /* width: 2px; */
  border: 1px solid #232b48;
}

.how-it-works .works-timeline .timeline-individual .right-align {
  text-align: right;
}

/* Why brick by brick */
.why-brick-section {
  background-image: url(../images/why-brick-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  margin: 0px 25px 40px 25px;
  padding: 70px 0px;
  border-radius: 30px;
}

.why-brick-container .small-head,
.why-brick-container .main-head {
  color: #fff;
}

.circle-section {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  margin-top: 50px;
}

.circles-individual {
  padding: 80px 25px;
  border-radius: 50%;
  border: 1px solid rgba(119, 128, 160, 0.48);
  text-align: center;
  margin-right: -20px;
  transition: 0.4s ease-in-out;
  cursor: pointer;
}

.circles-individual .circle-front {
  z-index: 1;
}

.circles-individual .circle-front p {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  text-transform: capitalize;
  margin: 6px;
}

.circle-back {
  display: none;
}

.circle-back p {
  color: #fff;
  margin: 0;
  font-size: 18px;
}

.circles-individual:hover {
  background-color: #e69e00;

  .circle-front {
    display: none;
  }

  .circle-back {
    display: block;
  }
}

/* Typology */
.typology-section .gradient-section {
  background: linear-gradient(180deg,
      rgba(255, 255, 255, 0.73) 0%,
      rgba(217, 239, 250, 0.87) 79.25%,
      #d9effa 152.7%);
  height: 50px;
  margin-bottom: -2px;
}

.typology-section img {
  width: 100%;
}

/* Our Gallery */
.our-gallery {
  padding: 30px 0px 40px 0px;
}

.our-gallery-container .small-head,
.our-gallery-container .main-head {
  text-align: center;
}

.our-gallery-container {
  position: relative;
}

.our-gallery-container::before {
  -webkit-text-stroke-width: 1.13px;
  -webkit-text-stroke-color: rgba(39, 49, 87, 0.11);
  font-size: 100px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: transparent;
  content: "Gallery";
  position: absolute;
  left: 30%;
  top: -65px !important;
}

/*start portfolio*/
.our-gallery-container .portfolio {
  margin-top: 40px;
}

.our-gallery-container .portfolio p {
  color: rgba(255, 255, 255, 0.6);
  margin: 20px 40px;
  letter-spacing: 1px;
  line-height: 1.5em;
}

/*start tabs*/
.our-gallery-container .portfolio input[type="radio"] {
  display: none;
}

.our-gallery-container .portfolio .tabs label {
  display: inline-block;
  text-align: center;
  padding: 5px 16px;
  margin-bottom: 20px;
  cursor: pointer;
  color: #565656;
  font-size: 16px;
  font-weight: 600;
}

.our-gallery-container .portfolio .tabs .all {
  display: none;
  transform-origin: 10% 50%;
}

.our-gallery-container .portfolio .tabs .content {
  margin-bottom: 15px;
  margin-top: 15px;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
}

.our-gallery-container .portfolio .tabs .content img {
  height: 250px;
    width: 100%;
    object-fit: cover;
}

.our-gallery-container .portfolio input[id="all"]:checked~.content .all {
  display: block;
  animation: animateTabe 1s;
}

.our-gallery-container .portfolio input[id="websiteDesign"]:checked~.content .websiteDesign {
  display: block;
  animation: animateTabe 1s;
}

.our-gallery-container .portfolio input[id="PHOTOGRAPHY"]:checked~.content .PHOTOGRAPHY {
  display: block;
  animation: animateTabe 1s;
}

.our-gallery-container .portfolio input[id="graphicDesign"]:checked~.content .graphicDesign {
  display: block;
  animation: animateTabe 1s;
}

.our-gallery-container .portfolio input[type="radio"]:checked+label {
  color: #273157;
  cursor: default;
  border-bottom: 3px solid #f8aa00;
}

.our-gallery-container .portfolio .tabs .overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 100%;
  padding-top: 10%;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  background: rgba(0, 0, 0, 0.5);
  left: 0;
  transition: all 0.5s;
  transition: all 0.5s linear;
}

.our-gallery-container .portfolio .tabs .all .content:hover .overlay {
  top: 0;
}

.our-gallery-container .portfolio .tabs .overlay span {
  padding: 2px 8px;
  border: 1px solid #fff;
  border-radius: 3px;
  cursor: pointer;
}

.our-gallery-container .portfolio .tabs .overlay span:hover {
  background: #5cc05c;
  border-color: #5cc05c;
}

@keyframes animateTabe {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.classic-list {
  list-style-type: none;
}

/* Clients */
.our-clients {
  padding: 20px 20px 60px 20px;
}

.our-clients-container .small-head,
.our-clients-container .main-head {
  text-align: center;
}

.cliswiper {
  overflow: hidden;
  margin-top: 40px;
}

.cliswiper .swiper-slide {
  text-align: center;
  font-size:17px;
}

.clients-logo-section {
  margin-top: 40px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
  gap: 30px;
  text-align: center;
}

.logo-individual p {
  color: #262f52;
  font-size: 16px;
  font-weight: 600;
  margin-top: 10px;
}

/* Testimonials */
.testimonial-section {
  background-image: url(../images/testimonial-bg.png);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 70px 0px;
  position: relative;
}

.testimonial-section::before {
  -webkit-text-stroke-width: 1.13px;
  -webkit-text-stroke-color: rgba(39, 49, 87, 0.11);
  font-size: 100px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: transparent;
  content: "Testimonials";
  position: absolute;
  left: 19%;
  top: 0%;
}

.testi-swiper {
  overflow: hidden;
}

.testi-swiper .swiper-pagination {
  position: unset;
}

.testi-swiper .swiper-horizontal>.swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal {
  /* position: absolute; */
  bottom: 0 !important;
}

.testi-swiper .swiper-wrapper {
  margin: 20px 0px 20px 0px;
}

.testi-swiper .swiper-slide {
  border-radius: 15px;
  border: 1px solid #dedede;
  background: #fff;
  padding: 15px;
  margin-right: 15px !important;
}

.testi-swiper .swiper-slide img {
  width: 100%;
}

.testi-video {
  position: relative;
}

.testi-swiper .testi-video .testi-play-btn {
  position: absolute;
  left: 35%;
  top: 30%;
  cursor: pointer;
}

.testi-swiper .testi-video .testi-play-btn img {
  width: 60px;
}

.testi-swiper .swiper-pagination-bullet {
  width: 25px;
  border-radius: 5px;
  height: 5px;
}

.testi-swiper .swiper-pagination-bullet-active {
  background: #313c62;
}

.testi-swiper .testi-card-heading {
  color: #313c62;
  font-size: 25px;
  font-weight: 700;
  margin-top: 20px;
}

.testi-swiper .swiper-slide .star-img {
  width: 100px;
}

/* Faq section */
.faq-section {
  padding: 60px 0px;
}

.faq-toggle-section {
  margin-top: 50px;
  display:flex;
}

.faq-section-container p,
.faq-section-container h4 {
  text-align: center;
}

.faq-section .accordion__wrapper {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
}

.faq-section .accordion__title {
  text-align: center;
  margin-bottom: 4rem;
}

.faq-section .accordion__header {
  /* border-radius: 50px 50px 45px 50px; */
  /* background: #273157; */
  border-radius: 50px;
  background: #d4e2f5;
  cursor: pointer;
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-left:18px;
}

.faq-section .accordion__question {
  /* color: #fff; */
  color: #3a425f;
  font-size: 17px;
  font-weight: 700;
  margin: 0;
}

.faq-section .accordion__icon {
  width: 2.2rem;
  height: 2.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  /* color: #fff; */
  color: #3a425f;
  flex-shrink: 0;
}

.faq-section .accordion__content {
  overflow: hidden;
  height: 0;
  transition: 0.4s ease-in-out;
}

.faq-section .accordion__answer {
  color: #00384f;
  padding: 10px;
  text-align: left;
}

/* Network */
.our-network {
  padding: 0px 0px 60px 0px;
}

.our-network-container .small-head,
.our-network-container .main-head {
  text-align: center;
}

/* Get Quote */
.get-quote-section {
  background: url(../images/get-quote-bg1.png);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 35px 20px;
}

.get-quote-section .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.left-sec-quote p {
  color: #fff;
  font-size: 35px;
  font-weight: 700;
}

.right-sec-quote a {
  border-radius: 50px;
  background: linear-gradient(90deg, #273157 0%, #1b2754 48.94%);
  box-shadow: 0px 5px 26.9px 0px rgba(27, 34, 60, 0.44);
  padding: 10px 30px;
  color: #fff;
  text-decoration: none;
  border: 2px solid transparent;
  transition: 0.3s ease-in-out;
}

.right-sec-quote a:hover {
  border: 2px solid #fff;
  background: transparent;
}

/* Footer */
.footer-section {
  background: url(../images/footer-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 60px 0px 15px 0px;
}

.footer-container {
  display: flex;
  /* grid-template-columns: 1fr 1fr 1fr 1fr; */
  justify-content: space-between;
  /* align-items: center; */
  gap: 0px;
}

.foo-logo-sec img {
  width: 110px;
}

.foo-logo-sec h5 {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
}

.foo-logo-desc {
  color: #bcbcbc;
  font-size: 16px;
  font-weight: 700;
  margin-top: 20px;
}

.follow-sec {
  display: flex;
  gap: 24px;
  margin-top: 15px;
}

.follow-sec svg {
  border: 1px solid white;
  padding: 10px;
  border-radius: 12px;
}

.follow-sec svg:hover {
  border: 1px solid var(--primaryorange);
}

.footer-section .quick-links h5 {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
}

.footer-section .quick-links .quick-menu ul {
  color: #e5e5e5;
  font-size: 16px;
  font-weight: 600;
  padding: 0px;
  margin: 0;
}

.footer-section .quick-links .quick-menu ul li {
  list-style: none;
  margin-bottom: 15px;
  position: relative;
}

.footer-section .quick-links .quick-menu ul li a:hover::before {
  content: "";
  background-image: url(../images/Vector.png);
  background-repeat: no-repeat;
  position: absolute;
  width: 100%;
  height: 100%;
  left: -16px;
  top: 6px;
  transition: 0.3s ease-in-out;
}

.footer-section .quick-links .quick-menu ul li a {
  color: #e5e5e5;
  font-size: 16px;
  text-decoration: none;
}

.footer-section .quick-links .quick-menu ul li a:hover {
  color: var(--primaryyellow);
  margin-left: 5px;
  transition: 0.3s ease-in-out;
}

.footer-section .service-links h5 {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
}

.footer-section .service-links .service-menu ul {
  color: #e5e5e5;
  font-size: 16px;
  font-weight: 600;
  padding: 0px;
  margin: 0;
}

.footer-section .service-links .service-menu ul li {
  list-style: none;
  margin-bottom: 15px;
  position: relative;
}

.footer-section .service-links .service-menu ul li a {
  color: #e5e5e5;
  font-size: 16px;
  text-decoration: none;
}

.footer-section .service-links .service-menu ul li a:hover {
  color: var(--primaryyellow);
  margin-left: 5px;
  transition: 0.3s ease-in-out;
}

.footer-section .service-links .service-menu ul li a:hover::before {
  content: "";
  background-image: url(../images/Vector.png);
  background-repeat: no-repeat;
  position: absolute;
  width: 100%;
  height: 100%;
  left: -16px;
  top: 6px;
  transition: 0.3s ease-in-out;
}

.footer-section .location-sec h5 {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  margin-bottom: 20px;
}

.footer-section .location-sec .address-sec ul {
  color: #e5e5e5;
  font-size: 16px;
  font-weight: 600;
  padding: 0px;
  margin: 0;
}

.footer-section .location-sec .address-sec ul li {
  list-style: none;
  margin-bottom: 15px;
  display: flex;
    gap: 15px;
    align-items: center;
}

.footer-section .location-sec .address-sec ul li a {
  color: #e5e5e5;
  font-size: 16px;
  text-decoration: none;
  display: flex;
    gap: 10px;
    align-items: start;
    justify-content: space-between;
}

.footer-section .location-sec .address-sec ul li a:hover {
  color: var(--primaryyellow);
  transition: 0.3s ease-in-out;
}

.copyright-area {
  margin-top: 35px;
  border-top: 1px solid #4e5b8f;
}

.copyright-area-r1 {
  margin-top: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.copyright-text p {
  color: #fff;
  margin: 0;
}

.design-company a {
  color: #fff !important;
  text-decoration: none;
}

.design-company-a1 {
  font-size: 7px;
}

.design-company-a {
  display: block;
  text-align: center;
  font-size: 16px;
  letter-spacing: 1px;
  position: relative;
  margin-top: -6px;
}

/* After Footer */
.after-footer {
  background-color: #f6faff;
  padding: 40px 0px 20px 0px;
}
@keyframes animate-pulse-whatsapp {
  0% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.4), 0 0 0 0 rgba(37, 211, 102, 0.4);
  }

  40% {
    box-shadow: 0 0 0 20px rgba(37, 211, 102, 0), 0 0 0 0 rgba(37, 211, 102, 0.4);
  }

  80% {
    box-shadow: 0 0 0 20px rgba(37, 211, 102, 0),
      0 0 0 30px rgba(37, 211, 102, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(37, 211, 102, 0.4), 0 0 0 30px rgba(37, 211, 102, 0);
  }
}


.whatsapp-section img{
    width: 60px;
    position: fixed;
    bottom: 25px;
    right: 25px;
    z-index: 9999;
    animation: animate-pulse-whatsapp 3s linear infinite;
    border-radius:40px;
}

.after-foo-loc {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 20px;
}

.after-foo-loc a {
  color: #515151;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
}

.after-foo-loc a:hover {
  color: #1c233d;
}

.after-footer .first-para {
  color: #515151;
  font-size: 18px;
  font-weight: 600;
}

/* ABOUT PAGE */

.about-banner {
  background: url(../images/about-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.about-banner .container {
  display: flex;
  justify-content: center;
}

.about-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.about-banner-heading p,
.about-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}

.purpose-section {
  background: url(../images/purpose-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 70px 0px;
}

.purpose-section .small-head,
.purpose-section .main-head {
  text-align: center;
}

.purpose-section-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  margin-top: 60px;
}

.purpose-section-container .card {
  border: none;
}

.purpose-section-container .card .card-title {
  color: #273157;
  font-size: 24px;
  font-weight: 700;
}

.purpose-section-container .card .card-title span {
  color: #f8aa00;
  font-size: 24px;
  font-weight: 700;
}

.purpose-section-container .card .card-text {
  color: #515151;
  font-size: 16px;
  font-weight: 500;
  margin: 5px 0px;
}

.purpose-section-container .card .card-text span {
  color: #303030;
  font-size: 16px;
  font-weight: 700;
}

.purpose-section-container .card .card-body1 {
  padding: 15px 15px;
}

.purpose-section-container .card .card-body2 {
  padding: 15px 15px;
}

.purpose-section-container .card .card-body3 {
  padding: 15px 15px;
}

.purpose-section-container .card .card-body1 {
  position: relative;
}

.purpose-section-container .card .card-body1::before {
  position: absolute;
  content: "";
  background: url(../images/purpose-icon1.png);
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
  bottom: 73px;
  left: 0;
}

.purpose-section-container .card .card-body2 {
  position: relative;
}

.purpose-section-container .card .card-body2::before {
  position: absolute;
  content: "";
  background: url(../images/purpose-icon2.png);
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
  bottom: 73px;
  left: 0;
}

.purpose-section-container .card .card-body3 {
  position: relative;
}

.purpose-section-container .card .card-body3::before {
  position: absolute;
  content: "";
  background: url(../images/purpose-icon3.png);
  background-repeat: no-repeat;
  height: 100%;
  width: 100%;
  bottom: 73px;
  left: 0;
}

/* WHy brick about page */
.why-brick-section-about {
  background-image: url(../images/why-brick-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 70px 0px;
}

/* Video Section */
.about-video-section {
  padding: 70px 0px;
  position: relative;
}

.about-video-section img {
  width: 100%;
}

#myVideo {
  right: 0;
  bottom: 0;
  width: 100%;
  height: 500px;
  object-fit: cover;
}

#myBtn {
  border: none;
  background: transparent;
  cursor: pointer;
  position: absolute;
  top: 40%;
  left: 44%;
  padding: 0;
}

#myBtn img {
  width: 80px;
  height: 80px;
}

/* Work Together */
.work-together-section {
  padding: 80px 0px;
  background: url(../images/abt-prefooter.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  overflow: visible;
  margin-top: 40px;
}

.work-together-section::before {
  content: "";
  position: absolute;
  background-image: url(../images/work-together-img.png);
  background-repeat: no-repeat;
  width: 623px;
  height: 474px;
  z-index: 22;
  top: -27%;
  right: 0px;
  left: auto;
  background-size: cover;
}

.work-together-container {
  display: flex;
}

.work-together-section .get-quote-btn {
  border-radius: 50px;
  background: linear-gradient(90deg, #273157 0%, #1b2754 48.94%);
  padding: 15px 33px;
  color: #fff;
  text-decoration: none;
  border: 2px solid transparent;
  transition: 0.3s ease-in-out;
}

.work-together-section .get-quote-btn:hover {
  color: #1b2754;
  border: 2px solid #1b2754;
  background: transparent;
}

.work-together-section .get-quote-btn:hover svg path {
  fill: #1b2754;
}

.work-together-section .work-text p {
  color: #5b5b5b;
  font-size: 18px;
  font-weight: 600;
  margin: 30px 0px;
}


/*Institution we work*/
.work-together-section-insti {
  padding: 80px 0px;
  background: url(../images/abt-prefooter.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  overflow: visible;
  margin-top: 40px;
}

.work-together-section-insti::before {
  content: "";
  position: absolute;
  background-image: url(../images/institute-serv-cta.png);
  background-repeat: no-repeat;
  width: 400px;
  height: 474px;
  z-index: 22;
  top: -27%;
  right: 0px;
  left: auto;
  background-size: cover;
}

.work-together-container-insti {
  display: flex;
}

.work-together-section-insti .get-quote-btn {
  border-radius: 50px;
  background: linear-gradient(90deg, #273157 0%, #1b2754 48.94%);
  padding: 15px 33px;
  color: #fff;
  text-decoration: none;
  border: 2px solid transparent;
  transition: 0.3s ease-in-out;
}

.work-together-section-insti .get-quote-btn:hover {
  color: #1b2754;
  border: 2px solid #1b2754;
  background: transparent;
}

.work-together-section-insti .get-quote-btn:hover svg path {
  fill: #1b2754;
}

.work-together-section-insti .work-text p {
  color: #5b5b5b;
  font-size: 18px;
  font-weight: 600;
  margin: 30px 0px;
}


/*Commercial we work*/
.work-together-section-comm {
  padding: 80px 0px;
  background: url(../images/abt-prefooter.png);
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
  overflow: visible;
  margin-top: 40px;
}

.work-together-section-comm::before {
  content: "";
  position: absolute;
  background-image: url(../images/comm-serv-cta.png);
  background-repeat: no-repeat;
  width: 400px;
  height: 474px;
  z-index: 22;
  top: -27%;
  right: 0px;
  left: auto;
  background-size: cover;
}

.work-together-container-comm {
  display: flex;
}

.work-together-section-comm .get-quote-btn {
  border-radius: 50px;
  background: linear-gradient(90deg, #273157 0%, #1b2754 48.94%);
  padding: 15px 33px;
  color: #fff;
  text-decoration: none;
  border: 2px solid transparent;
  transition: 0.3s ease-in-out;
}

.work-together-section-comm .get-quote-btn:hover {
  color: #1b2754;
  border: 2px solid #1b2754;
  background: transparent;
}

.work-together-section-comm .get-quote-btn:hover svg path {
  fill: #1b2754;
}

.work-together-section-comm .work-text p {
  color: #5b5b5b;
  font-size: 18px;
  font-weight: 600;
  margin: 30px 0px;
}



/* Services Page */

.services-banner {
  background: url(../images/services-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.services-banner .container {
  display: flex;
  justify-content: center;
}

.services-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.services-banner-heading p,
.services-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}

/* Awesome services */

.awesome-services {
  padding: 70px 0px 40px 0px;
}

.awesome-services-container .small-head,
.awesome-services-container .main-head {
  text-align: center;
}

.awesome-services-container {
  position: relative;
}

.awesome-services-container::before {
  -webkit-text-stroke-width: 1.13px;
  -webkit-text-stroke-color: rgba(39, 49, 87, 0.11);
  font-size: 100px;
  font-weight: 900;
  letter-spacing: 1.8px;
  text-transform: uppercase;
  color: transparent;
  content: "Services";
  position: absolute;
  left: 30%;
  top: -65px !important;
}
.serv-sec{
    margin: 40px 0px;
}

.awesome-services .serv-sec .services-1 {
  margin: 20px 0px;
}
.awesome-services .serv-sec .services-2 .row{
  /*margin: 20px 0px;*/
  justify-content:center;
}


.serv-sec .serv-individual-heading {
  color: #fff;
  font-size: 22px;
  font-weight: 700;
  margin: 0;
  transform: translateY(0px);
  transition: 0.3s ease-in-out;
}

.serv-sec .head-border {
  border-bottom: 2px solid #f8aa00;
  width: 50px;
  transform: translateY(0px);
  transition: 0.3s ease-in-out;
}

.serv-sec .overlay-btn a {
  color: #dfdfdf;
  font-size: 15px;
  font-weight: 600;
  border-radius: 99px;
  border: 1px solid #fff;
  text-decoration: none;
  padding: 9px 15px;
}

.serv-sec .serv-individual1 {
  background: url(../images/serv-img-1.png);
  background-repeat: no-repeat;
  background-size: cover;
  flex-direction: column;
  justify-content: flex-end;
  display: flex;
  border-radius: 3px;
  height: 350px;
  padding: 20px 20px 10px 20px;
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual1 .overlay-btn {
  display: none;
}

.serv-sec .serv-individual1:hover .overlay-btn {
  display: block;
  transform: translateY(-10px);
}

.serv-sec .serv-individual1:hover .serv-individual-heading {
  transform: translateY(-50px);
}

.serv-sec .serv-individual1:hover .head-border {
  transform: translateY(-50px);
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual2 {
  background: url(../images/serv-img-2.png);
  background-repeat: no-repeat;
  background-size: cover;
  flex-direction: column;
  justify-content: flex-end;
  display: flex;
  border-radius: 3px;
  height: 350px;
  padding: 20px 20px 10px 20px;
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual2 .overlay-btn {
  display: none;
}

.serv-sec .serv-individual2:hover .overlay-btn {
  display: block;
  transform: translateY(-10px);
}

.serv-sec .serv-individual2:hover .serv-individual-heading {
  transform: translateY(-50px);
}

.serv-sec .serv-individual2:hover .head-border {
  transform: translateY(-50px);
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual3 {
  background: url(../images/serv-img-3.png);
  background-repeat: no-repeat;
  background-size: cover;
  flex-direction: column;
  justify-content: flex-end;
  display: flex;
  border-radius: 3px;
  height: 350px;
  padding: 20px 20px 10px 20px;
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual3 .overlay-btn {
  display: none;
}

.serv-sec .serv-individual3:hover .overlay-btn {
  display: block;
  transform: translateY(-10px);
}

.serv-sec .serv-individual3:hover .serv-individual-heading {
  transform: translateY(-50px);
}

.serv-sec .serv-individual3:hover .head-border {
  transform: translateY(-50px);
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual4 {
  background: url(../images/serv-img-4.png);
  background-repeat: no-repeat;
  background-size: cover;
  flex-direction: column;
  justify-content: flex-end;
  display: flex;
  border-radius: 3px;
  height: 350px;
  padding: 20px 20px 10px 20px;
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual4 .overlay-btn {
  display: none;
}

.serv-sec .serv-individual4:hover .overlay-btn {
  display: block;
  transform: translateY(-10px);
}

.serv-sec .serv-individual4:hover .serv-individual-heading {
  transform: translateY(-50px);
}

.serv-sec .serv-individual4:hover .head-border {
  transform: translateY(-50px);
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual5 {
  background: url(../images/serv-img-5.png);
  background-repeat: no-repeat;
  background-size: cover;
  flex-direction: column;
  justify-content: flex-end;
  display: flex;
  border-radius: 3px;
  height: 350px;
  padding: 20px 20px 10px 20px;
  transition: 0.3s ease-in-out;
}

.serv-sec .serv-individual5 .overlay-btn {
  display: none;
}

.serv-sec .serv-individual5:hover .overlay-btn {
  display: block;
  transform: translateY(-10px);
}

.serv-sec .serv-individual5:hover .serv-individual-heading {
  transform: translateY(-50px);
}

.serv-sec .serv-individual5:hover .head-border {
  transform: translateY(-50px);
  transition: 0.3s ease-in-out;
}

/* Detail Service page  */
.detail-top-section {
  padding: 50px 0px;
}

.detail-top-section-container {
  display: flex;
  justify-content: center;
  align-items: center;
}

.detail-top-section-container img {
  width: 100%;
}

.detail-top-section-container .detail-top-right {
  display: grid;
  gap: 20px;
}

.detail-top-section-container .detail-top-right img {
  width: 90%;
}

.description-section {
  padding: 0px 20px 40px 20px;
}

.description-section-container {
  display: flex;
  justify-content: space-between;
  align-items: start;
  gap: 30px;
}

.description-section-container .descrip-right h4 {
  color: #273157;
  font-size: 32px;
  font-weight: 700;
}

.description-section-container .descrip-right p {
  color: #4a4a4a;
  font-size: 18px;
  font-weight: 400;
}

.description-section-container .descrip-right ul {
  padding: 0;
  margin: 0;
  list-style: none;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.description-section-container .descrip-right ul li {
  margin-bottom: 20px;
  color: #1e1e1e;
  font-size: 16px;
  font-weight: 600;
}

.description-section-container .descrip-right ul li img {
  width: 30px;
  margin-right: 8px;
}

.description-section-container .descrip-left {
  border-radius: 5px;
  border: 1px solid #484848;
  background: #fff;
  padding: 20px;
}

.description-section-container .descrip-left h4 {
  color: #1b2754;
  font-size: 26px;
  font-weight: 700;
}

.description-section-container .descrip-left ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.description-section-container .descrip-left ul li {
  color: #191919;
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.description-section-container .descrip-left ul li a{
    text-decoration:none;
    color: #191919;
}

.description-section-container .descrip-left hr {
  border-top: 1px solid #adadad;
}

/* Spec section */
.specification-section {
  background-image: url(../images/spec-bg.png);
  padding: 60px 0px;
  background-size: cover;
  background-repeat: no-repeat;
}

.specification-sec-container .small-head {
  text-align: center;
}

.specification-sec-container .main-head {
  text-align: center;
  color: #ffffff;
}

.descTabs-wrapper {
  margin: auto;
  width: 100%;
}

.descTabs li p {
  margin: 0;
  margin-top: 10px;
  text-align: center;
  font-size: 22px;
  font-weight: 600;
}

.descTabs-wrapper .descTabs {
  list-style: none;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 50px;
  margin-top: 40px;

  li {
    cursor: pointer;
    padding: 15px 35px;
    text-align: center;
    border-bottom: 2px solid #ddd;
    background-color: transparent;
    transition: 0.25s;
    color: #ffffff;

    &:hover {
      border-color: #b6b6b6;
      color: #f8aa00;
      background-color: transparent;
    }

    &.active {
      border-color: #f8aa00;
      color: #f8aa00;
      background-color: transparent;
    }
  }
}

.descTabs li:hover svg path {
  fill: #f8aa00 !important;
}

.descTabs li.active svg path {
  fill: #f8aa00 !important;
}

.descTabs-wrapper .descTabs-content {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  padding: 40px 35px;
  margin-top: 30px;
  margin-bottom: 30px;
  border-radius: 32px;
  background: #273157;

  h2 {
    margin-top: 10px;
    color: #f8aa00;
    font-size: 26px;
    font-weight: 700;
  }

  p {
    color: #eaeaea;
    font-size: 18px;
    font-weight: 400;
  }
}

.descTabs-content .tab-content-left img {
  width: 100%;
}

/* latest tech */
.latest-tech-section {
  padding: 60px 0px;
}

.latest-tech-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
}

.latest-tech-container .latest-tech-left h3 {
  color: #273157;
  font-size: 35px;
  font-weight: 700;
}

.latest-tech-container .latest-tech-left p {
  color: #4a4a4a;
  font-size: 18px;
  font-weight: 400;
}

.latest-tech-left .latest-icon-sec {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 20px;
}

.latest-tech-left .latest-icon-sec img {
  width: 60px;
}

.latest-tech-left .latest-icon-sec h5 {
  color: #273157;
  font-size: 23px;
  font-weight: 700;
}

.latest-tech-left .latest-icon-sec p {
  color: #4a4a4a;
  font-size: 17px;
  font-weight: 400;
  margin: 0;
}

.latest-tech-container .latest-tech-right img {
  width: 100%;
}

/* Contact Page */


.contact-banner {
  background: url(../images/contact-bg-banner.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.contact-banner .container {
  display: flex;
  justify-content: center;
}

.contact-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.contact-banner-heading p,
.contact-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}


.fst-contact-secc {
  padding: 50px 20px 20px 20px;
}
.fst-contact-secc .container{
    display:grid;
     grid-template-columns: repeat(3,1fr);
    gap: 20px;
}

#con-fst-columbutton {
  padding: 7px 85px;
  background-color: #424f7e;
  border-color: #424f7e;
  border-radius: 40px;
  padding-right: 95px;
}

.fst-con-buttondiv {
  margin-top: 40px;
}

.fst-con-buttondiv-3 {
  margin-top: 15px;
}

.con-fst-h5 {
  color:#FFFFFF70;
  font-weight: 600;
  margin-top: 20px;
  font-size: 18px;
}

.con-se-h5 {
  color: #555555;
  font-family: Mulish;
}

.con-icon-imgg {
  width: 100%;
}

.con-fst-colum-div {
    display: flex;
    align-items: center;
    justify-content: start;
   padding: 30px 0px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.14);
    
}
.con-fst-icondiv{
    text-align: end;
}
.con-se-ataga {
  text-decoration: none !important;
  color: #fff !important;
  font-size: 16px;
}

.con-se-atag:hover {
  text-decoration: none;
  color: #fff;
}

.contact-sec-form-mapsection {
  padding: 30px 0px 50px 0px;
  background: url('../images/contact-bg.png');
  background-repeat: no-repeat;
    background-size: cover;
}
.contact-sec-form-mapsection .row{
    align-items:stretch;
}
.contact-info-section{
    border-radius: 20px;
    background: #2E385F;
    border-left: 6px solid #F8B200;
    align-content: start;
    padding: 50px 20px;
}
.contact-leave-message-section{
    border-radius: 40px;
    background: #F7F7F7;
    padding: 30px;
}

.form-left-topheading {
  color: #273157;
  font-weight: 600;
  font-size:35px;
}

.left-forminput {
  margin-top: 16px;
  border-radius: 30px;
  padding: 10px;
  height: 60px;
  padding-left: 15px;
  outline-color: #cedbee;
  width:100%;
  border: 1px solid #d4d4d4;
}

.left-forminput-mess {
  margin-top: 16px;
  border-radius: 30px;
  padding: 10px;
  /* height: 150px; */
  padding-left: 15px;
  outline-color: #cedbee;
  width: 100%;
  resize:none !important;
  border: 1px solid #d4d4d4;
}

.left-forminput-file{
    width: 90%;
    margin-top: 20px;
    margin-bottom: 20px;
}
.file-upload-field .wpcf7-form-control-wrap{
   padding: 20px;
    border: 1px dashed #d4d4d4; 
}
.left-forminput-ema {
  width: 100%;
  margin-top: 16px;
  border-radius: 30px;
  padding: 10px;
  height: 60px;
  padding-left: 15px;

  outline-color: #cedbee;

  border: 1px solid #d4d4d4;
}

.left-forminput-lastname {
  margin-left: 15px;
  margin-top: 16px;
  border-radius: 30px;
  padding: 10px;
  height: 60px;
  padding-left: 15px;
  border: 1px solid #d4d4d4;
  outline-color: #cedbee;
}

.left-formsubmit-button {
  margin-top: 20px;
}

#leftform-button {
  background-color: white;
  color: #1b2754;
  border: 1px solid #1b2754;
  padding: 7px 2px;
  border-radius: 30px;
  font-weight: 600;
  font-family: Mulish;
}

.con-leftside-mapp {
  /*padding: 20px;*/
  /*border-radius: 20px;*/
}

.con-leftside-mapp iframe {
  /*border-radius: 20px;*/
  /*width: 99%;*/
}

.con-button-form {
  width: 27%;
  margin-left: 9px;
}

.leftform-button{
    padding: 15px 25px !important;
    border-radius: 50px !important;
    background: #3c5ab9 ;
    text-decoration: none;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    border: 2px solid transparent;
}
.leftform-button:hover {
    border: 2px solid #3c5ab9;
    background: transparent;
    color: #3c5ab9;
     transition: 0.3s ease-in-out;
}
.form-sections textarea {
    border-radius: 25px;
    border: 1px solid #e9edf9;
    background: #f8f8f8;
    margin-bottom: 20px;
    width: 100%;
    padding: 10px;
    height: 100px;
    resize: none;
}
.schedule-button-a {
    padding: 15px 25px !important;
    border-radius: 50px !important;
    background: #3c5ab9 !important;
    text-decoration: none;
    color: #fff;
    width: 82% !important;
    font-size: 18px;
    font-weight: 600;
    border: 2px solid transparent !important;
}

.schedule-button-a:hover {
  border: 2px solid #3c5ab9 !important;
  background: transparent !important;
  color: #3c5ab9;
}


/*Gallery Page*/
.gallery-plugin-section{
    padding:50px 0px;
    overflow-y:hidden;
}




/* NRI PAGE */
.nri-about {
  padding: 40px 20px 50px 20px;
  position: relative;
}

.nri-about-container {
  display: flex;
  justify-content: center;
  align-items: center;
}


.nri-why-choose {
  padding: 70px 0px;
  background: #232b48;
}

.nri-why-choose .small-head {
  text-align: center;
  margin-bottom: 50px;
}

.nri-why-choose .container {}

.nri-why-choose-row {
  display: flex;
  gap: 20px;
  justify-content: center;
  margin-bottom: 25px;
}

.nri-choose-box-individual {
  background: transparent;
  border-radius: 10px;
  padding: 25px;
  border: 0.3px solid white;
  text-align: center;
}

.nri-choose-box-individual h5 {
  color: #f5f5f5;
  font-weight: 700;
  font-size: 18px;
}

.nri-choose-box-individual p {
  color: #f5f5f5;
  margin-bottom: 0px;
  font-size: 15px;
}


.nri-process-section {
  padding: 50px 0px;
}

.nri-timeline-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.nri-process-container .small-head {
  text-align: center;
}

.nri-process-container .main-head {
  text-align: center;
}

.nri-process-container .who-right-p {
  text-align: center;
  width: 70%;
  margin: auto;
}

.nri-process-timeline {
  position: relative;
  margin: 50px 0;
}

.nri-process-timeline-line {
  position: absolute;
  left: 20px;
  top: 0;
  bottom: 0;
  width: 2px;
  background-color: #e0e0e0;
  background: linear-gradient(45deg, transparent, black, transparent);
  transform: translateX(-50%);
}

.nri-process-timeline-item {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
  position: relative;
}

.nri-process-timeline-number {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid #e0e0e0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 500;
  z-index: 2;
  margin-right: 20px;
  flex-shrink: 0;
  transform: unset;
}

.nri-process-timeline-content {
  flex: 1;
  margin-left: 60px;
  margin-top: -40px;
  padding-top: 10px;
}

.nri-process-timeline-content h2 {
  font-size: 20px;
  margin-bottom: 10px;
  color: #333;
  font-weight: 700;
}

.nri-process-timeline-content p {
  color: #666;
  font-size: 16px;
  margin-bottom: 15px;
  max-width: 100%;
}

.nri-process-timeline-image {
  width: calc(100% - 60px);
  height: 180px;
  background-color: #f5f5f5;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 60px;
  margin-top: 20px;
  flex-shrink: 0;
}

.nri-process-timeline-image img {
  max-width: 100%;
  max-height: 100%;
}

.nri-process-right img {
  width: 100%;
}


.communication-section {
  padding: 10px 0px 50px 0px;
}

.communication-section-1 {
  display: flex;
  align-items: center;
  margin-bottom:30px;
  gap: 30px;
    justify-content: center;
}

.communication-section-1 img {
  width: 100%;
}
.communication-section-1 h4{
    font-size: 24px;
    color: #273157;
    font-weight: 700;
}

.communication-section-2 {
  display: flex;
  align-items: center;
  gap: 30px;
    justify-content: center;
}

.communication-section-2 img {
  width: 100%;
}
.communication-section-2 h4{
    font-size: 24px;
    color: #273157;
    font-weight: 700;
}



.reimage-section {
  padding: 40px 0px 50px 0px;
}

.reimage-section .small-head {
  text-align: center;
}

.reimage-box-row-1 {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  margin-top: 50px;
}

.reimage-box-row-1 .box-individual {
  border-top: 3px solid #232b48;
  background-color: #f5f5f5;
  padding: 30px;
}

.reimage-box-row-1 .box-individual>h6 {
  font-size: 20px;
  font-weight: 700;
}

.reimage-box-row-1 .box-individual p {
  font-size: 15px;
}


/*NRI END*/




.commercial-banner {
  background: url(../images/commercial-banner.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.commercial-banner .container {
  display: flex;
  justify-content: center;
}

.commercial-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.commercial-banner-heading p,
.commercial-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}



.residence-banner {
  background: url(../images/residence-banner.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.residence-banner .container {
  display: flex;
  justify-content: center;
}

.residence-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.residence-banner-heading p,
.residence-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}


.institution-banner {
  background: url(../images/institution-banner.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.institution-banner .container {
  display: flex;
  justify-content: center;
}

.institution-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.institution-banner-heading p,
.institution-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}



.industrial-banner {
  background: url(../images/institution-banner.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.industrial-banner .container {
  display: flex;
  justify-content: center;
}

.industrial-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.industrial-banner-heading p,
.industrial-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}



.interior-banner {
  background: url(../images/interior-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.interior-banner .container {
  display: flex;
  justify-content: center;
}

.interior-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.interior-banner-heading p,
.interior-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}

.other-services-banner {
  background: url(../images/other-serv-bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 400px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 30px;
}

.other-services-banner .container {
  display: flex;
  justify-content: center;
}

.other-services-banner-heading h1 {
  color: #fff;
  font-size: 50px;
  font-weight: 800;
  text-transform: capitalize;
}

.other-services-banner-heading p,
.other-services-banner-heading a {
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 600;
  text-transform: capitalize;
  text-decoration: none;
}



/*Contact Tab Form*/

.contact-tab-block{
  width:100%;
  margin:20px 0px 0px 0px;
  .tab-head{
    display:flex;
    list-style:none;
    padding: 0;
    margin: 0;
     border-radius: 84px;
     background: #FFF;
    &:after{
      content:'';
      display:table;
      clear:both;
    }
    li{
      box-sizing:border-box;
      float:left;
      /*background-color: #e8e7e7;*/
      color:#000;
      width:100%;
      text-align:center;
      padding-top:13px;
      padding-bottom:13px;
      cursor:pointer;
      &:hover:not(.active){
        border-radius: 99px;
        color: #fff;
        background: #273157;
        border-bottom:1px solid #000;
        cursor:pointer;
      }
    }
    .active{
       border-radius: 99px;
       background: #273157;
        color:#fff;
        border-bottom:1px solid #000;
      cursor:pointer;
      }
  }
  
  .contact-tab-content{
    box-sizing:border-box;
    border-top:1px solid white;
    background-color:transparent;
    color:#000;
    .contact-tab-pane{
      padding:20px 10px;
    }
  }
    
}


 

/*Home services swiper*/

.home-swiper-services{
    position:relative;
    padding:50px 20px;
    background: #f6faff;
}
.home-swiper-services .services-swiper{
    margin: 30px 0px 0px 0px;
}
.home-swiper-services .services-swiper .swiper-slide .card{
    border:none;
    padding:10px;
    border-radius:5px;
    box-shadow: 1px 1px 37px 1px #4f4c4c38;
    background: #fff;
}
.home-swiper-services .services-swiper .swiper-slide .explore{
    color:#F8AA00;
}
.home-swiper-services .services-swiper .swiper-pagination-bullets.swiper-pagination-horizontal{
     bottom: 15px !important;
}


/* Resident tab section */
.resident-compare-table-section{
	    padding: 10px 0px 50px 0px;
}
.resident-compare-table-section h3{
  color: #273157;
  font-size: 35px;
  font-weight: 700;
  margin-bottom: 50px;
  text-align: center;
}

.resi-tabs {
  margin: 0 auto;
}

.resi-tabs ul {
  padding: 0;
  width: 50%;
  margin: 0 auto;
}


.resi-tabs-nav li {
  float: left;
  width: 33.33%;
  list-style: none;
}

.resi-tabs a {
  border-radius: 84px;
  background: #F6F8FF;
  color: #000;
  display: block;
  padding: 10px 0;
  text-align: center;
  text-decoration: none;
  list-style: none;
  outline: none;
}

.resi-tabs a:hover {
  background: #273157;
  color: #ffff;
  text-decoration: none;
}

.resi-tab-active a {
  background: #273157;
  border-bottom-color: transparent;
  color: #ffff;
  cursor: default;
  text-decoration: none;
}

.resi-tabs-stage {
  clear: both;
  padding-top: 40px;
}

.resi-tabs .resi-tabheading {
  font-size: 20px;
}

.resi-tabgrid-head {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  justify-content: space-between;
  column-gap: 30px;
  row-gap: 20px;
}

.resi-grid-individual {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 10px;
  border: 1px solid #CBE1FE;
  background: #F8F9FF;
  border-left: 4px solid #939DDA;
  padding: 15px 21px;
}

.resi-grid-left p {
  color: #242424;
  font-size: 20px;
  font-weight: 600;
  margin: 0;
}

.resi-grid-right p {
  color: #1D2E6B;
  text-align: right;
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}



/* carousel two rows */
.carousel-afterGallery{
	padding: 0px 0px 50px 0px;
	position:relative;
}
.swiper-containermultiCols {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
}
.swiper-containermultiCols .swiper-pagination{
position:unset;
}

.swiper-containermultiCols .swiper-slide {
  text-align: center;
  background: #fff;
}

.two-rows-slide {
  display: grid;
  grid-template-rows: repeat(2, auto);
}

.two-rows-slide .item {
  padding: 10px;
}
.two-rows-slide img{
	width:100%;
	height: 200px;
  object-fit: cover;
}


			.comparison-listing-table .comp-head{
				 color: #273157;
			  font-size: 35px;
			  font-weight: 700;
			  margin-bottom: 50px;
			  text-align: center;
			}
            .comparison-listing-table {
                padding: 0px 10px 50px 10px;
            }
.panel-group .panel-title{
	font-size:18px;
	background: #dae2ff9e;
    padding: 10px;
    border-radius: 5px;
}
            .panel-group a {
                color: unset;
                text-decoration: none;
				font-weight: 600;
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
            }
			.panel-group .panel-title:hover{
				background: #f8aa00;
			}
            .panel-default .table {
                margin-bottom: 0
            }

            .panel-default .table>tbody>tr>td {
                padding: 15px
            }

            .comparison-individual {
                box-shadow: 0px 0px 7px 1px #afafaf24;
                margin-bottom: 30px;
            }
			.comparison-individual .panel-group{
				padding: 15px;
			}

            .package-head {
                background: #273157;
                text-align: center;
                color: #F6F8FF;
                padding: 15px 5px;
                margin-bottom: 10px;
            }

            .package-head div {
                display: none;
            }

            .package-head h3 {
                margin: 0px;
                font-size: 20px;
                font-weight: 600;
            }

            .package-head h3:after {
/*                 content: '';
                width: 50px;
                height: 1px;
                background: #F6F8FF;
                display: block;
                margin: 5px auto; */
            }

            .package-head h2 {
                font-size: 40px;
                font-weight: 900;
                letter-spacing: 1px;
                margin: 0px;
                line-height: 50px;
            }

            .package-head h2 small {
                font-size: 50%;
                letter-spacing: 0px;
                color: #000;
                font-weight: 300;
            }
			.panel-title svg{
			font-size:15px;
			}
			.panel-body{
				margin-left: 15px;
				 font-size: 18px;
			}