@font-face {
  font-family: "icomoon";
  src: url("../fonts/icomoon.eot?jzjcrr");
  src: url("../fonts/icomoon.eot?jzjcrr#iefix") format("embedded-opentype"),
    url("../fonts/icomoon.ttf?jzjcrr") format("truetype"),
    url("../fonts/icomoon.woff?jzjcrr") format("woff"),
    url("../fonts/icomoon.svg?jzjcrr#icomoon") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"],
[class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "icomoon" !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-youtube:before {
  content: "\e900";
}

.icon-whatsapp:before {
  content: "\e901";
}

.icon-user:before {
  content: "\e902";
}

.icon-type:before {
  content: "\e903";
}

.icon-twitter-x:before {
  content: "\e904";
}

.icon-time:before {
  content: "\e905";
}

.icon-search:before {
  content: "\e906";
}

.icon-rupee:before {
  content: "\e907";
}

.icon-right-arrow:before {
  content: "\e908";
}

.icon-prev:before {
  content: "\e909";
}

.icon-plus:before {
  content: "\e90a";
}

.icon-phone-bold:before {
  content: "\e90b";
}

.icon-phone:before {
  content: "\e90c";
}

.icon-next:before {
  content: "\e90d";
}

.icon-minus:before {
  content: "\e90e";
}

.icon-mail:before {
  content: "\e90f";
}

.icon-location-pin:before {
  content: "\e910";
}

.icon-location-mark .path1:before {
  content: "\e911";
}

.icon-location-mark .path2:before {
  content: "\e912";
  margin-left: -1em;
  color: rgb(255, 255, 255);
}

.icon-linked-in:before {
  content: "\e913";
}

.icon-link:before {
  content: "\e914";
}

.icon-left-arrow:before {
  content: "\e915";
}

.icon-instagram:before {
  content: "\e916";
}

.icon-facebook:before {
  content: "\e917";
}

.icon-edit:before {
  content: "\e918";
}

.icon-dropdown:before {
  content: "\e919";
}

.icon-download:before {
  content: "\e91a";
}

.icon-close:before {
  content: "\e91b";
}

.icon-category:before {
  content: "\e91c";
}

.icon-calender:before {
  content: "\e91d";
}

.icon-back-tick:before {
  content: "\e91e";
}

:root {
  --primary-font: "Syne", serif;
  --Secondary-font: "Marcellus", serif;
  --third-font: "Cinzel", serif;
  --number-font: "Inter", sans-serif;
  --black: #000;
  --black-100: #071c35;
  --black-200: #455568;
  --white: #fff;
  --gray-100: #e2e2e3;
  --gray-200: #939393;
  --gray-300: #c3c3c3;
  --gray-400: #f8f9fb;
  --gray-500: #f3f5f8;
  --gray-600: #e6e8ec;
  --gray-700: #e5e7ec;
  --orange: #f7941d;
  --orange-100: #ff8c00;

  --transition: all 0.5s ease-in-out;
}

html {
  font-size: 0.534vw;
  font-family: var(--primary-font);
}

body {
  position: relative;
  color: var(--blue);
  font-family: var(--primary-font);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2.6rem;
  background-color: var(--white);
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
}

img,
svg {
  max-width: 100%;
  height: auto;
}

ul,
ol {
  margin: 0;
  padding: 0;
}

ul li {
  list-style-type: none;
  list-style-position: inside;
}

ol li {
  list-style-type: inherit;
  list-style-position: inside;
}

figure,
address,
blockquote {
  margin: 0;
  padding: 0;
}

input:focus,
textarea:focus {
  outline: none;
  box-shadow: none;
  background-color: var(--white);
}

body.admin-bar .main-header .navigation-bar {
  margin-top: 32px;
}

/* ================== USER FOR SAFRI auto Complete field off ============================== */
input::-webkit-contacts-auto-fill-button {
  visibility: hidden;
  display: none !important;
  pointer-events: none;
  position: absolute;
  right: 0;
}

/* Button Style Start */
.btn-primary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 5rem;
  padding: 0.5rem 1.8rem;
  font-family: var(--primary-font);
  color: var(--black);
  text-transform: uppercase;
  background-color: transparent;
  letter-spacing: 1px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  border-radius: 0.2rem;
  border: 0.1rem solid var(--black-100);
  transition: var(--transition);
}

.btn-primary:hover,
.btn-primary:focus {
  color: var(--white);
  outline: none;
  box-shadow: none;
  border-color: var(--orange);
  background-color: var(--orange);
}

.btn-secondary {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 5rem;
  padding: 0.5rem 1.6rem;
  font-family: var(--primary-font);
  color: var(--black-100);
  text-transform: uppercase;
  background-color: var(--white);
  letter-spacing: 1px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  border-radius: 0.2rem;
  border: none;
  transition: var(--transition);
}

.btn-secondary:hover,
.btn-secondary:focus {
  color: var(--white);
  outline: none;
  box-shadow: none;
  background-color: var(--orange);
}

/* Button Style End */

/* Common Style Start */
.common-header {
  text-align: center;
  margin-bottom: 7rem;
}

.common-header .common-small-text {
  color: var(--gray-200);
  font-family: var(--primary-font);
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 1.8rem;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  margin-bottom: 1rem;
}

.common-header .common-header-icon span {
  display: inline-block;
  color: var(--orange);
  font-size: 1.5rem;
  margin-bottom: 0;
}

.common-header .common-header-text {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.8rem;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  margin-bottom: 2rem;
}

.common-header p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  line-height: 2.8rem;
  font-weight: 400;
}

.formcontrol-wrapper {
  position: relative;
}

.formcontrol,
.formcontrol-select {
  width: 100%;
  height: 100%;
  background-color: var(--white);
  color: var(--black-100);
  font-family: var(--number-font);
  /* text-transform: uppercase; */
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 4rem;
  padding: 1rem 3rem;
  padding-left: 5rem;
  border-radius: 0;
  border: none;
  transition: var(--transition);
}

.formcontrol:focus,
.formcontrol-select:focus {
  outline: none;
  box-shadow: none;
  border-color: var(--orange) !important;
}

.textarea-control {
  resize: none;
  height: 11.4rem !important;
}

.formcontrol-select {
  text-transform: uppercase;
}

.formcontrol-select span.current {
  display: block;
  width: 100%;
  overflow: hidden;
}

.formcontrol-select .list {
  max-height: 25rem;
  overflow-y: auto;
  padding: 1rem 1.6rem;
  width: 100%;
  transform: scale(0.75) translateY(0px);
}

.formcontrol-select .option {
  white-space: normal;
  padding: 0 1rem;
  font-size: 1.2rem;
  line-height: 1.8rem;
  min-height: auto;
  /*scrollbar-color: #f7941d rgba(255, 255, 255, 0.8);
  scrollbar-width: thin; */
}

.formcontrol-select .option:not(:last-of-type) {
  margin-bottom: 1.5rem;
}

.formcontrol-select .list::-webkit-scrollbar {
  width: 0.6rem;
}

.formcontrol-select .list::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background-color: var(--orange);
}

.formcontrol-select:after {
  border-bottom: 0.2rem solid var(--black);
  border-right: 0.2rem solid var(--black);
  height: 0.8rem;
  width: 0.8rem;
  right: 1.5rem;
}

.formcontrol-select.open:after {
  -webkit-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.formcontrol-select:active,
.formcontrol-select:hover {
  border-color: var(--black);
}



.swiper-pagination-bullet {
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  opacity: 1;
  background: var(--black-200);
  transition: var(--transition);
}

.swiper-pagination-bullet-active {
  color: var(--white);
  background: var(--orange) !important;
}

/* Common Style End */
/* Semibanner Style Start */
.semibanner-area {
  height: 66rem;
  position: relative;
  overflow: hidden;
  background-color: var(--blue100);
}

.semibanner-area.project-pages {
  overflow: visible;
}

.semibanner-image::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 23.8rem;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, #000 100%);
}

.semibanner-image::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 62.86%, #000 100%);
}

.semibanner-area.project-pages .semibanner-image::before {
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 62.86%, #000 85%);
}

.semibanner-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.semibanner-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.semibanner-text {
  position: relative;
  z-index: 1;
  width: 100%;
  min-height: 66rem;
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: flex-start;
}

.semibanner-text-heading {
  position: relative;
  color: var(--white);
  font-family: var(--Secondary-font);
  font-size: 4.8rem;
  font-weight: 400;
  line-height: 6.4rem;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 1.4px;
  margin-bottom: 10.5rem;
}

.search-term {
  display: block;
  font-size: 2.4rem;
  text-transform: none;
}

.semibanner-text-heading::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 117.3rem;
  width: 100%;
  height: 22.3rem;
  border-radius: 117.3rem;
  background: rgba(0, 0, 0, 0.7);
  filter: blur(100px);
  z-index: -1;
}

.semibanner-area .search-content {
  bottom: -2.7rem;
  border: none;
}

/* Semibanner Style End */

/* Swiper Navigation Style Start */

.swiper-button-next {
  right: 0;
  width: 2rem;
  height: 3.5rem;
}

.swiper-button-prev {
  left: 0;
  width: 2rem;
  height: 3.5rem;
}

.swiper-button-next:after {
  /* content: "\e908"; */
  content: "\e90d";
  font-family: "icomoon";
  position: absolute;
  font-size: 3rem;
  font-weight: 700;
  line-height: normal;
  color: var(--gray-300);
  transition: var(--transition);
}

.swiper-button-next:hover:after {
  color: var(--black);
}

.swiper-button-prev:after {
  /* content: "\e915"; */
  content: "\e909";
  font-family: "icomoon";
  position: absolute;
  font-size: 3rem;
  font-weight: 700;
  line-height: normal;
  color: var(--gray-300);
  transition: var(--transition);
}

.swiper-button-prev:hover:after {
  color: var(--black);
}

.swiper-button-lock {
  /* display: block; */
}

/* Swiper Navigation Style End */
/* Swiper Pagination Style Start */

/* Swiper Pagination Style End */

/* Header Style Start */
.main-header {
  position: relative;
  z-index: 40;
}

.navigation-bar {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  transition: var(--transition);
}

.navigation-bar.navigation-fixed {
  background-color: var(--black);
  z-index: 20;
}

.navigation-bar .nav-inner-wrap {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  position: relative;
  padding: 3.2rem 0 1rem;
  transition: var(--transition);
}

.navigation-bar.navigation-fixed .nav-inner-wrap {
  padding: 2rem 0 1rem;
}

/* .navigation-bar.navigation-fixed .logo-block img {
  width: 21.5rem;
} */
.navigation-bar .logo-block {
  display: inline-block;
  width: 21.5rem;
}

.navigation-bar .logo-block img {
  width: 100%;
  display: inline-block;
  transition: var(--transition);
}

.main-nav {
  display: flex;
  align-items: center;
  gap: 4.4rem;
}

.main-nav.openSearch ul.nav-list {
  opacity: 0;
  visibility: hidden;
}

.main-nav ul.nav-list {
  display: flex;
  align-items: center;
  gap: 4.4rem;
  transition: var(--transition);
}

.main-nav ul.nav-list a {
  position: relative;
  display: flex;
  align-items: baseline;
  color: var(--gray-100);
  z-index: 2;
}

.main-nav ul.nav-list .menu-item-has-children-text {
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.8rem;
  text-transform: uppercase;
  transition: var(--transition);
}

.main-nav ul.nav-list a span {
  font-size: 1.4rem;
  margin-right: 0.8rem;
  transition: var(--transition);
}

.main-nav ul.nav-list a:hover span {
  color: var(--orange);
}

.menu-item-visit {
  font-family: var(--primary-font);
  font-size: 1.8rem;
  line-height: 1.8rem;
  font-weight: 500;
  text-transform: uppercase;
  background-color: var(--white);
  border-radius: 0.2rem;
  padding: 1rem 1.8rem;
  color: var(--black-100) !important;
  transition: none !important;
  /* transition: all 0.3s ease-in-out !important; */
}

.menu-item-visit strong {
  font-weight: 600;
  margin-right: 0.4rem;
  /* transition: all 0.3s ease-in-out !important; */
  /* transition: var(--transition); */
}

.menu-item-visit:hover {
  background-color: var(--orange);
  color: var(--white) !important;
}

.menu-item-visit:hover strong {
  color: var(--white);
}

.main-nav.openSearch ul.nav-list {
  opacity: 0;
  visibility: hidden;
}

.search-wrap {
  position: relative;
  display: flex;
  align-items: center;
  gap: 2rem;
}

.search-icon span {
  font-size: 1.4rem;
  color: var(--white);
}

.search-block {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 100%;
  height: 4rem;
  z-index: 1;
}

.main-nav.openSearch .search-block input {
  width: 50rem;
  padding: 0.6rem;
  padding-left: 3.6rem;
}

.search-block input {
  width: 0rem;
  height: 100%;
  margin-right: 2.5rem;
  background-color: var(--white);
  font-family: var(--primary-font);
  color: var(--black);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.5rem;
  padding: 0;
  border: none;
  transition: var(--transition);
}

.search-block input::placeholder {
  font-family: var(--primary-font);
  color: var(--black);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.58rem;
}

.search-block span {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 1.2rem;
  font-size: 1.4rem;
  color: var(--black);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition);
}

.main-nav.openSearch .search-block span {
  opacity: 1;
  visibility: visible;
}

.toggle-box {
  position: relative;
}

.toggle {
  cursor: pointer;
  overflow: hidden;
  width: 3rem;
  height: 3rem;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.line-toggle {
  position: absolute;
  display: block;
  width: 2.5rem;
  height: 0.4rem;
  transition: var(--transition);
}

.line-toggle:first-child {
  background: var(--orange);
  transform: translateY(-4px) translateX(2px);
  width: 2.5rem;
  height: 0.4rem;
  transition-delay: 0s;
}

.line-toggle:last-child {
  background: var(--white);
  transform: translateY(4px) translateX(-2px);
  width: 2.5rem;
  height: 0.4rem;
  transition-delay: 0s;
}

.toggle.activate .line-toggle:first-child {
  transform: translateY(0) translateX(0) rotate(45deg);
  transition-delay: 0.1s;
}

.toggle.activate .line-toggle:last-child {
  transform: translateY(0) translateX(0) rotate(314deg);
  transition-delay: 0.1s;
}

.nav_overlay {
  display: none;
  position: fixed;
  width: calc(100% - 57.5rem);
  height: 100%;
  left: 0;
  top: 0;
  background-color: transparent;
  z-index: 50;
}

body.menu_open .nav_overlay {
  display: block;
}

.overlay {
  height: 100%;
  width: 57.5rem;
  position: fixed;
  z-index: 1;
  top: 0;
  right: -100%;
  background: rgba(7, 28, 53, 0.95);
  overflow-x: hidden;
  transition: var(--transition);
  z-index: 2;
}

.overlay.active {
  right: 0rem;
}

.overlay-content {
  position: relative;
  width: 100%;
  height: calc(100% - 14.5rem);
  overflow-x: hidden;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-top: 14.5rem;
  padding: 0rem 3rem 6rem 7rem;
  scrollbar-color: #f7941d rgba(255, 255, 255, 0.8);
  scrollbar-width: thin;
}

.overlay-content::-webkit-scrollbar {
  width: 0.6rem;
}

.overlay-content::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background-color: var(--orange);
}


.overlay-links {
  display: flex;
  flex-direction: column;
  align-items: start;
  justify-content: start;
}

.overlay-links .primary-menu-container {
  width: 100%;
}

.overlay-links ul {
  width: 100%;
}

.overlay-links ul li {
  width: 100%;
  position: relative;
}

.overlay-links ul li:not(:last-of-type) {
  margin-bottom: 2.8rem;
}

.overlay-links ul li a {
  position: relative;
  display: block;
  width: 100%;
  font-family: var(--primary-font);
  color: var(--white);
  font-size: 3rem;
  font-weight: 400;
  line-height: 3.6rem;
  /*padding-right: 4rem;*/
  transition: var(--transition);
}

.overlay-links ul li a:hover {
  color: var(--orange);
}

.overlay-links ul li.active a {
  margin-bottom: 0rem;
  color: var(--orange);
}

.overlay-links ul li ul li.menu-item-has-children {
  padding-right: 4rem;
  position: relative;
  min-width: 20rem;
}

.overlay-links ul li ul li a {
  position: relative;
  font-family: var(--primary-font);
  color: var(--white);
  font-size: 2rem;
  font-weight: 400;
  line-height: 3.4rem;
  cursor: pointer;

}

.overlay-links ul li.current-menu-ancestor a,
.overlay-links ul li.current-menu-item a {
  color: var(--orange);
}

.overlay-links ul li.current-menu-ancestor ul li a,
.overlay-links ul li.current-menu-item ul li a {
  color: var(--white);
}

.overlay-links ul li .sub-menu {
  display: none;
  margin-bottom: 2.8rem;
  padding-top: 0.8rem;
  margin-left: 2rem;
}

.overlay-links ul li.submenu-active .sub-menu {
  display: block;
}


.overlay-links ul li .sub-menu-toggle {
  position: absolute;
  top: 0;
  right: 0;
  line-height: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  border: none;
  transition: var(--transition);
  width: 3.7rem;
  height: 3.7rem;
  z-index: 2;
}

.overlay-links ul li.active .sub-menu-toggle {
  top: 0.5rem;
}

.overlay-links ul li .sub-menu-toggle span {
  font-size: 1.8rem;
  line-height: normal;
  color: var(--white);
  cursor: pointer;
  transition: var(--transition);
}

.overlay-links ul li .sub-menu-toggle span svg,
.overlay-links ul li .sub-menu-toggle span img {
  display: none;
}

.overlay-links ul li .sub-menu-toggle span.icon-minus {
  display: none;
  font-size: 0.4rem;
  color: var(--orange);
}

.overlay-links ul li.submenu-active .sub-menu-toggle span.icon-minus {
  display: block;
}

.overlay-links ul li .sub-menu-toggle span.icon-plus {
  display: block;
}

.overlay-links ul li.submenu-active .sub-menu-toggle span.icon-plus {
  display: none;
}

.overlay-links ul li.current-menu-ancestor .sub-menu-toggle span {
  color: var(--orange);
}


.overlay-links ul li .sub-menu li .sub-menu-toggle {
  position: absolute;
  top: 0;
  right: 0;
  padding: 1rem;
  font-size: 0;
  width: 3rem;
  height: 3.4rem;
  border: none;
  outline: none;
}

.overlay-links ul li .sub-menu li .sub-menu-toggle span {
  border: solid var(--white);
  border-width: 0 0.2rem 0.2rem 0;
  padding: 0.5rem;
  transform: rotate(-45deg);
  display: block;
  font-size: 0;
  transition: 0.6s;
}

.overlay-links ul li .sub-menu li.li_active .sub-menu-toggle.active span {
  transform: rotate(45deg);
  border-color: var(--orange);
}

.overlay-links ul li .sub-menu li.current-menu-ancestor .sub-menu-toggle span {
  border-color: var(--orange);
}

.overlay-links ul li .sub-menu li .overlay-links ul li .sub-menu a {
  position: relative;
  display: flex;
  font-family: var(--primary-font);
  color: var(--white);
  font-size: 2rem;
  font-weight: 400;
  line-height: 3.4rem;
  width: fit-content;
  cursor: pointer;
  transition: var(--transition);
}

.overlay-links ul li .sub-menu li {
  margin: 0 !important;
  width: max-content;
  margin-top: 0.8rem !important;
}

.overlay-links ul li .sub-menu li.current-menu-ancestor a,
.overlay-links ul li .sub-menu li.current-menu-item a,
.overlay-links ul li .sub-menu li.li_active a,
.overlay-links ul li .sub-menu li:hover a,
.overlay-links ul li .sub-menu li.submenu-open.active a:hover {
  color: var(--orange);
  padding-left: 2.5rem;
}

.overlay-links ul li .sub-menu a::after {
  content: "\e91e";
  font-family: "icomoon";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--orange);
  font-size: 0rem;
  margin-right: 0rem;
  padding-top: 0rem;
  transition: var(--transition);
}

.overlay-links ul li .sub-menu li.current-menu-ancestor a::after,
.overlay-links ul li .sub-menu li.current-menu-item a::after,
.overlay-links ul li .sub-menu li:hover a::after,
.overlay-links ul li .sub-menu li.li_active a::after,
.overlay-links ul li .sub-menu li.submenu-open.active a:hover::after {
  font-size: 1rem;
}

.overlay-links ul li .sub-menu li .sub-menu {
  display: none;
  padding-left: 0;
  margin-bottom: 0.5rem;
  transform: translateX(0);
  transition: var(--transition);
  margin-left: 0;
}

/* .overlay-links ul li .sub-menu li:hover .sub-menu,
.overlay-links ul li .sub-menu li.submenu-open .sub-menu {
  display: none;
} */

.overlay-links ul li .sub-menu li.li_active .sub-menu {
  display: block;
  transform: translateX(4.5rem);
}

.overlay-links ul li .sub-menu li .sub-menu li {
  margin: 0 !important;
  width: max-content;
}

.overlay-links ul li .sub-menu li .sub-menu li a {
  position: relative;
  font-family: var(--primary-font);
  color: var(--white);
  font-size: 2rem;
  font-weight: 400;
  line-height: 3.4rem;
  cursor: pointer;
  transition: var(--transition);
}

.overlay-links ul li .sub-menu li .sub-menu li.current-menu-ancestor a,
.overlay-links ul li .sub-menu li .sub-menu li.current-menu-item a,
.overlay-links ul li .sub-menu li .sub-menu li.li_active a,
.overlay-links ul li .sub-menu li .sub-menu li a:hover {
  padding-left: 2.5rem;
  color: var(--orange);
}

.overlay-links ul li .sub-menu li .sub-menu li a::after {
  content: "\e91e";
  font-family: "icomoon";
  position: absolute;
  top: 0;
  left: 0;
  color: var(--orange);
  font-size: 0rem;
  margin-right: 0rem;
  padding-top: 0rem;
  transition: var(--transition);
}

.overlay-links ul li .sub-menu li .sub-menu li.current-menu-ancestor a::after,
.overlay-links ul li .sub-menu li .sub-menu li.current-menu-item a::after,
.overlay-links ul li .sub-menu li .sub-menu li.li_active a::after,
.overlay-links ul li .sub-menu li .sub-menu li a:hover::after {
  font-size: 1rem;
}

.overlay .icon-close {
  position: absolute;
  top: 3.4rem;
  right: 3rem;
  font-size: 2.5rem;
  line-height: 2.5rem;
  color: var(--white);
  z-index: 1;
  transition: var(--transition);
}

.overlay .icon-close:hover {
  color: var(--orange);
}

.overlay .social-nav {
  justify-content: start;
  gap: 1.4rem;
  margin-top: 2rem;
}

.overlay .social-nav li a {
  display: inline-block;
  font-size: 1.8rem;
  line-height: 1.8rem;
  padding: .5rem .8rem;
}

.overlay .social-nav span {
  display: inline-block;
  font-size: 0;
}

.overlay .social-nav span::before {
  font-size: 1.8rem;
  color: var(--white);
  transition: var(--transition);
}

.overlay .social-nav span::before:hover {
  color: var(--orange);
}

/* Header Style End */

/* Banner Style Start */
.banner-area {
  height: 100vh;
  position: relative;
}

.banner-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallerySlider {
  position: relative;
  height: 100%;
  width: 100%;
}

.gallerySlider-prev,
.gallerySlider-next {
  display: flex;
}

.gallerySlider .swiper-slide {
  position: relative;
}

.gallerySlider .swiper-slide::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 23.8rem;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, #000 100%);
}

.gallerySlider .swiper-slide::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 62.86%, #000 85%);
  z-index: 10;
}

.gallerySlider .video-wrap,
.gallerySlider .image-wrap {
  height: 100%;
  position: relative;
}

.gallerySlider .image-wrap figure {
  height: 100%;
}

.gallery-banner-text-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gallery-banner-text {
  position: relative;
  color: var(--gray-100);
  font-family: var(--Secondary-font);
  font-size: 4.8rem;
  font-weight: 400;
  line-height: 6.4rem;
  text-transform: uppercase;
  text-align: center;
  letter-spacing: 1.4px;
  z-index: 0;
}

.gallery-banner-text::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 117.3rem;
  height: 22.3rem;
  border-radius: 117.3rem;
  background: rgba(0, 0, 0, 0.7);
  filter: blur(100px);
  z-index: -1;
}

.gallerySlider .thumb-text-box {
  display: none;
  position: relative;
  padding: 2.8rem 4rem;
  transform: none;
  height: fit-content;
  text-align: center;
  z-index: 0;
}

.gallerySlider .thumb-text-box::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 40rem;
  width: 100%;
  height: 20rem;
  border-radius: 117.3rem;
  background: rgba(0, 0, 0, 0.7);
  filter: blur(100px);
  z-index: -1;
}

.gallerySlider .thumb-main-text {
  color: var(--white);
  font-family: var(--Secondary-font);
  font-size: 2.8rem;
  font-weight: 400;
  line-height: 3.4rem;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  margin-bottom: 0.6rem;
}

.gallerySlider .thumbs-description {
  opacity: 1;
  visibility: visible;
  color: var(--gray-100);
  font-family: var(--primary-font);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 3rem;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  margin-bottom: 1.5rem;
}

.gallerySlider .explore-btn {
  opacity: 1;
  visibility: visible;
  display: inline-block;
  background-color: var(--orange);
  padding: 1.1rem 2rem;
  color: var(--black);
  text-transform: uppercase;
  font-family: var(--primary-font);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.8rem;
  letter-spacing: 0.5px;
  transition: var(--transition);
}

.gallerySlider .explore-btn:hover {
  background-color: var(--black);
  color: var(--white);
}

.banner-area .swiper-container {
  position: relative;
}

.thumbSlider-next {
  top: auto;
  bottom: 5.6rem;
  right: 12rem;
  width: 1.2rem;
}

.thumbSlider-prev {
  top: auto;
  bottom: 5.6rem;
  left: auto;
  right: 16rem;
  width: 1.2rem;
}

.thumbSlider-prev::after,
.thumbSlider-next::after {
  font-size: 3rem;
  font-weight: 700;
}

.thumbSlider-prev:hover::after,
.thumbSlider-next:hover::after {
  color: var(--orange);
}

.thumbSlider {
  position: absolute;
  bottom: 8.6rem;
  left: 0;
  z-index: 1;
  width: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

.thumbSlider .swiper-slide {
  width: 20%;
  height: 20rem;
  cursor: pointer;
}

.thumbSlider .swiper-slide-thumb-active .thumb-text-box {
  transform: translateY(0%);
  background: linear-gradient(270deg,
      rgba(0, 0, 0, 0) 23.13%,
      rgba(0, 0, 0, 0.7) 121.77%);
}

.thumbSlider .swiper-slide-thumb-active .thumb-text-box::after {
  background: linear-gradient(90deg, #f7941d 35%, rgba(247, 148, 29, 0) 100%);
}

.thumbSlider .swiper-slide-thumb-active .thumb-text-box {
  transform: translateY(0%);
  background: linear-gradient(270deg,
      rgba(0, 0, 0, 0) 23.13%,
      rgba(0, 0, 0, 0.7) 121.77%);
}

.thumbSlider .swiper-slide-thumb-active .thumbs-description,
.thumbSlider .swiper-slide-thumb-active .explore-btn {
  opacity: 1;
  visibility: visible;
}

.thumb-text-box {
  position: relative;
  padding: 2.8rem 4rem;
  transform: translateY(40%);
  transition: var(--transition);
  height: 100%;
}

.thumb-text-box::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0.1rem;
  background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, 0) 100%);
}

.thumb-main-text {
  color: var(--gray-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
  text-transform: capitalize;
  letter-spacing: 1.4px;
  margin-bottom: 0.6rem;
}

.thumbs-description {
  opacity: 0;
  visibility: hidden;
  color: var(--gray-100);
  font-family: var(--primary-font);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.8rem;
  transition: var(--transition);
}

.explore-btn {
  opacity: 0;
  visibility: hidden;
  display: inline-block;
  background-color: var(--orange);
  border: 0.1rem solid var(--orange);
  border-radius: 0.4rem;
  padding: 1rem 2rem;
  color: var(--black);
  text-transform: uppercase;
  font-family: var(--primary-font);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 3rem;
  letter-spacing: 0.5px;
  margin-top: 2.8rem;
  transition: var(--transition);
}

.explore-btn:hover {
  background-color: var(--white);
  border-color: var(--black-100);
  color: var(--black-100);
}

.swiper-slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.search-content {
  position: absolute;
  bottom: 3rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
  background-color: var(--white);
  margin: 0 auto;
  border-radius: 0.4rem;
  padding-right: 0.4rem;
  border: 0.1rem solid #888;
  max-width: 114.7rem;
  width: 100%;
}

.search-content form {
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.search-content .form-block {
  width: calc(100% - 30rem);
  display: flex;
  align-items: center;
  gap: 1.5rem;
}

.search-content .form-group {
  width: 33.33%;
  position: relative;
  margin: 0;
  padding: 0;
}

.search-content .form-group .formcontrol-wrapper {
  position: relative;
  height: 5.5rem;
}

.search-content .form-group:not(:last-of-type) .formcontrol-wrapper::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -1rem;
  width: 0.1rem;
  height: 2.6rem;
  background: var(--gray-200);
}

.search-content .select-icon {
  position: absolute;
  top: 53%;
  transform: translateY(-50%);
  left: 1.4rem;
  cursor: pointer;
  line-height: 0;
}

.search-content .select-icon span {
  font-size: 1.8rem;
  color: var(--black-100);
}

.search-content button {
  width: 28.5rem;
  min-height: 4.7rem;
  background-color: var(--black-100);
  border: none;
  border-radius: 0.4rem;
  padding: 1rem 1.6rem;
  color: var(--white);
  text-transform: uppercase;
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  letter-spacing: 1.2px;
  transition: var(--transition);
}

.search-content button:hover {
  background-color: var(--orange);
}

.chat-icon {
  position: absolute;
  bottom: 10rem;
  right: 3.4rem;
  z-index: 3;
  width: 6.2rem;
  z-index: 10;
}

.chat-icon img {
  width: 100%;
  height: 100%;
}

.video__buttons {
  position: absolute;
  right: 4rem;
  top: 9rem;
  z-index: 30;
  display: flex;
  align-items: center;
  gap: 1rem;
}

.video__buttons button {
  background-color: var(--white);
  border-radius: 50%;
  height: 6rem;
  width: 6rem;
  border: 0.2rem solid var(--black-100);
  outline: none;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0;
}

.video__buttons button span {
  line-height: 0;
}

.video__buttons button.play-bt span::before {
  content: "" !important;
  font-family: inherit !important;
  display: inline-block;
  background-image: url(../images/play.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 2rem;
  height: 2rem;
}

.video__buttons button.pause-bt span::before {
  content: "" !important;
  font-family: inherit !important;
  display: inline-block;
  background-image: url(../images/pause.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 2rem;
  height: 2rem;
}

.video__buttons button.mute-bt.stop span::before {
  content: "" !important;
  font-family: inherit !important;
  display: inline-block;
  background-image: url(../images/mute.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 2rem;
  height: 2rem;
}

.video__buttons button.mute-bt span::before {
  content: "" !important;
  font-family: inherit !important;
  display: inline-block;
  background-image: url(../images/unmute.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  width: 2rem;
  height: 2rem;
}

/* Banner Style End */

/* About Area Style Start */
.about-us {
  overflow: hidden;
  padding: 12rem 0 11rem;
}

.about-cont-box {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  max-width: 143.7rem;
  margin: 0 auto;
  gap: 4rem;
}

.about-us .image-block {
  width: 50%;
  position: relative;
  padding-right: 4rem;
}

.about-us .image-block figure {
  position: relative;
  overflow: hidden;
}

.about-us .image-block figure img {
  width: 100%;
  height: 100%;
}

.about-us .image-block .shape-block {
  position: absolute;
  top: 3.6rem;
  right: 3rem;
  height: 47.1rem;
  z-index: 2;
}

.about-us .image-block .shape-block svg,
.about-us .image-block .shape-block img {
  width: 100%;
  height: 100%;
}

.about-us .image-block .owner-image {
  position: absolute;
  bottom: -3rem;
  right: 0;
  z-index: 3;
  width: 13rem;
  height: 12.7rem;
  border-radius: 50%;
}

.about-us .image-block .owner-image image {
  width: 100%;
  height: 100%;
}

.about-us .common-header {
  width: 50%;
  text-align: left;
  margin-bottom: 0rem;
}

.about-us .common-header .common-header-icon span {
  margin-left: 2.4rem;
}

.about-us .common-header p {
  margin-bottom: 4rem;
}

/* About Area Style End */

/* Counter Style Start */
.counter-area {
  overflow: hidden;
  padding-bottom: 20rem;
}

.counter-area-mobile {
  display: none;
}

.counter-outer-box {
  max-width: 143.7rem;
  margin: 0 auto;
}

.counter-wrapper {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}

.counter-box {
  position: relative;
  background-color: var(--white);
  padding-left: 2rem;
  min-width: 20rem;
}

.counter-box:first-of-type {
  padding-left: 0;
}

.counter-box:last-of-type {
  padding-right: 0;
}

.counter-outer {
  position: relative;
  z-index: 1;
}

.counter-outer::after {
  content: "";
  position: absolute;
  bottom: 1.1rem;
  right: -100%;
  width: 100%;
  height: 0.1rem;
  background: var(--gray-300);
  z-index: -1;
}

.counter-box:last-of-type .counter-outer::after {
  display: none;
}

.counter-text-wrap {
  width: 100%;
  display: flex;
  align-items: center;
}

.counter-text-wrap span {
  width: 3.5rem;
  color: var(--orange);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.8rem;
}

.counter {
  position: relative;
  z-index: 1;
  width: auto;
  color: var(--orange);
  font-family: var(--third-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 6.2rem;
  letter-spacing: 1.4px;

}

.counter-text {
  width: fit-content;
  background: var(--white);
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 1.8rem;
  padding-right: 2rem;
}

.counterSlider .swiper-button-prev,
.counterSlider .swiper-button-next {
  width: 1.5rem;
  transform: translateY(50%);
}

.counterSlider .swiper-button-prev:after {
  content: "\e909";
  font-size: 2.4rem;
  color: var(--gray-300);
}

.counterSlider .swiper-button-prev:hover:after {
  color: var(--black);
}

.counterSlider .swiper-button-next:after {
  content: "\e90d";
  font-size: 2.4rem;
  color: var(--gray-300);
}

.counterSlider .swiper-button-next:hover:after {
  color: var(--black);
}

/* Counter Style End */

/* Our Business Style Start */

.our-business-area {
  overflow: hidden;
  background-color: var(--gray-400);
  position: relative;
  padding: 11.5rem 0 11rem;
}

.our-business-area .common-header p {
  font-size: 1.7rem;
}

.our-business-area .image-block {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4.7rem 4rem;
}

.business-image-wrap {
  width: calc(50% - 2rem);
  border-radius: 0.5rem;
  overflow: hidden;
  position: relative;
}

.business-image-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, rgba(7, 28, 53, 0) 17.97%, #071c35 100%);
  transition: var(--transition);
}

.business-image-wrap:hover::after {
  background: rgba(7, 28, 53, 0.9);
}

.business-image-wrap img {
  width: 100%;
  height: 100%;
}

.image-overlay-block {
  position: absolute;
  bottom: -5.6rem;
  left: 2.6rem;
  z-index: 1;
  transition: var(--transition);
}

.our-business-area .btn-secondary {
  margin: 3.3rem auto 0;
  opacity: 0;
  visibility: hidden;
  font-size: 1.4rem;
  font-weight: 700;
  padding: 0.5rem 2.3rem;
  transition: var(--transition);
}

.our-business-area .image-title {
  color: var(--white);
  font-family: var(--Secondary-font);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 4rem;
  text-align: center;
}

.our-business-area .business-image-wrap:hover .btn-secondary {
  opacity: 1;
  visibility: visible;
}

.our-business-area .business-image-wrap:hover .image-overlay-block {
  bottom: 50%;
  left: 50%;
  transform: translate(-50%, 50%);
}

/* Our Business Style End */

/* Awards Area Style Start */
.awards-area {
  overflow: hidden;
  padding: 11rem 0;
  position: relative;
}

.awards-area .slide-box {
  min-height: 32.5rem;
}

.award-image {
  width: 25rem;
  height: 21.5rem;
  margin: 0 auto 1rem;
  position: relative;
}

.image-zoom {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(247, 148, 29, 0.7);
  background-image: url(../images/zoom-icon.svg);
  background-position: center;
  background-size: 10%;
  background-repeat: no-repeat;
  transition: var(--transition);
  opacity: 0;
  visibility: hidden;
}

.award-image:hover .image-zoom,
.architect-image:hover .image-zoom,
.projectYoutubeSlider .image-wrap:hover .image-zoom,
.constructionSlider .image-wrap:hover .image-zoom,
.grid-item:hover .image-zoom,
.plans-area-inner .top-tab-content figure:hover .image-zoom {
  opacity: 1;
  visibility: visible;
}

.award-image img {
  object-fit: contain;
}

.award-name-wrap {
  min-height: 11rem;
}

.award-name {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.6rem;
  text-align: center;
  padding: 0 6.5rem;
  text-transform: capitalize;
  margin-bottom: 0.2rem;
}

.award-name span {
  font-family: var(--third-font);
}

.award-name-description {
  min-height: 9rem;
}

.awardee-group {
  position: relative;
  width: fit-content;
  margin: 0 auto;
  color: var(--orange);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
  margin-bottom: 0.4rem;
}

.awardee-group::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -2.5rem;
  width: 2rem;
  height: 0.1rem;
  background: var(--orange);
}

.awardee-group::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: -2.5rem;
  width: 2rem;
  height: 0.1rem;
  background: var(--orange);
}

.awardee-realty {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.6rem;
  text-align: center;
  padding: 0 6.5rem;
  margin-bottom: 1rem;
}

.awardee-year {
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 2rem;
  text-align: center;
  padding: 0 6.5rem;
}

.leaf-right {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}

.leaf-left {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: -1;
}

.awards-area .btn-secondary {
  padding: 0.5rem 2.6rem;
  margin: 7.5rem auto 0;
  background-color: var(--black-100);
  color: var(--white);
  font-size: 1.4rem;
  line-height: 1.8rem;
}

.awards-area .btn-secondary:hover {
  background-color: var(--orange);
}

/* Awards Area Style End */

/* ARCHITECT Area Style Start */
.architect-area {
  overflow: hidden;
  padding: 11rem 0;
  position: relative;
  background-color: var(--gray-500);
}

.architect-area .shape-block {
  position: absolute;
  top: 3.6rem;
  right: 0;
  z-index: 0;
  height: 100rem;
  width: 32rem;
}

.architect-area .container {
  position: relative;
  z-index: 1;
}

.architect-area .shape-block img {
  width: 100%;
  height: 100%;
}

.architect-area .swiper-container {
  position: relative;
}

.architectSwiper {
  position: static;
  max-width: 144rem;
  margin: 0 auto;
}

.architect-area .slide-box {
  position: relative;
  cursor: pointer;
}

.architect-image-zoom {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 0;
  background: rgba(7, 28, 53, 0.7);
  background-image: url(../images/zoom-icon.svg);
  background-position: center;
  background-size: 12%;
  background-repeat: no-repeat;
  transition: var(--transition);
}

.architect-area .slide-box:hover .architect-image-zoom {
  height: 100%;
}

.architect-image {
  position: relative;
  height: 33.7rem;
  background-color: var(--gray-300);
}

.architect-name {
  position: relative;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
  text-align: center;
  padding: 1rem;
  background-color: var(--white);
  transition: var(--transition);
  z-index: 1;
}

.slide-box:hover .architect-name {
  color: var(--white);
  background-color: var(--black-100);
}

.architect-area .btn-secondary {
  padding: 0.5rem 2.6rem;
  margin: 10rem auto 0;
  background-color: var(--black-100);
  color: var(--white);
  font-size: 1.4rem;
  line-height: 1.8rem;
}

.architect-area .btn-secondary:hover {
  background-color: var(--orange);
}

/* ARCHITECT Area Style End */

/* Difference Area Style Start */
.difference-area {
  position: relative;
  overflow: hidden;
  padding: 11.8rem 0 5rem;
  background-color: var(--gray-500);
}

.difference-area .shape-block {
  position: absolute;
  top: 3.6rem;
  right: 0;
  z-index: 0;
  height: 100rem;
  width: 32rem;
}

.difference-area .container {
  position: relative;
  z-index: 1;
}

.difference-area .shape-block img,
.difference-area .shape-block svg {
  width: 100%;
  height: 100%;
}

.difference-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.8rem;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  margin-bottom: 6.4rem;
  padding-left: 4rem;
}

.difference-area .swiper-container {
  position: relative;
}

.differenceItems {
  max-width: 68rem;
  margin: 0 auto;
}

/* .differenceItems-next {
  display: none;
}

.differenceItems-prev {
  display: none;
} */

.difference-area .swiper-button-next.differenceItems-next {
  position: absolute;
}

.difference-area .swiper-button-next.differenceItems-prev {
  position: absolute;
}

.swiper-button-next.differenceItems-next::after,
.swiper-button-prev.differenceItems-prev::after {
  color: #647181;
}

.difference-items-wrap.swiper-wrapper {
  flex-direction: column;
}

.difference-items {
  display: flex;
  align-items: flex-start;
  gap: 4rem;
}

.difference-items:not(:last-of-type) {
  margin-bottom: 3.4rem;
}

.difference-items .icons {
  width: 5.5rem;
  height: 5.5rem;
}

.difference-items .icons img {
  width: 100%;
  height: 100%;
}

.difference-items .text-box {
  width: calc(100% - 9.5rem);
  padding-bottom: 3rem;
}

.difference-items:not(:last-of-type) .text-box {
  border-bottom: 0.1rem solid var(--gray-300);
}

.difference-items-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
  text-transform: capitalize;
  margin-bottom: 0.9rem;
}

.difference-items .text-box p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 3rem;
}

.transform-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 3rem;
  font-weight: 400;
  line-height: 3.8rem;
  text-transform: uppercase;
  letter-spacing: 20px;
  margin-bottom: 2rem;
}

.differenceSlider {
  width: 100%;
  max-width: 79rem;
  margin: 0;
}

.differenceSlider .swiper-slide figure {
  height: 63.6rem;
  position: relative;
}

.differenceSlider .swiper-slide figure::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: 2.2rem solid rgba(255, 255, 255, 0.3);
}

.differenceSlider .swiper-slide figure img {
  width: 100%;
  height: 100%;
}

.difference-area .swiper-btn-wrap {
  position: absolute;
  bottom: 0;
  right: 4.5rem;
  background-color: var(--white);
  width: fit-content;
  height: fit-content;
  display: flex;
  gap: 2rem;
}

.difference-area .differenceSlider-next {
  position: relative;
  margin: 0;
  /* right: 2.4rem;
  top: auto;
  bottom: 0; */
}

.difference-area .differenceSlider-prev {
  position: relative;
  margin: 0;
  /* left: auto;
  right: 9.9rem;
  top: auto;
  bottom: 0; */
}

.difference-area .differenceSlider-next:after {
  font-size: 2rem;
}

.difference-area .differenceSlider-prev:after {
  font-size: 2rem;
}

.transform-items-wrap {
  max-width: 60rem;
}

.transform-short-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
  text-transform: capitalize;
  margin: 3.8rem 0 0.6rem;
}

.transform-description {
  color: #071c35b2;
  font-family: var(--primary-font);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2.7rem;
}

/* Difference Area Style End */

/* Featured Area Style Start */
.featured-area {
  overflow: hidden;
  padding-bottom: 10rem;
}

.featured-area .common-header,
.featured-area .common-header .common-header-text {
  margin-bottom: 0;
}

.flip-back-content-inner {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 1.4rem;
  padding-left: 6rem;
  padding-right: 8rem;
}

.flip-back-content-inner .icon-block span {
  padding-top: 0.5rem;
  display: inline-block;
  font-size: 2.8rem;
  color: var(--white);
}

.flip-back-content-inner .content-block {
  width: calc(100% - 4.2rem);
}

.featured-title {
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 4rem;
  text-transform: capitalize;
}

.featured-address {
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 3rem;
  text-transform: capitalize;
}

.price-box {
  display: flex;
  align-items: center;
  /* justify-content: center; */
  color: var(--white);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
  margin-top: 1.4rem;
}

.price-box span {
  display: inline-block;
  margin: 0 1rem;
  color: var(--orange);
  font-family: var(--number-font);
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 3.5rem;
}

.details-box {
  margin-top: 1.4rem;
  padding-top: 1.4rem;
  border-top: 0.1rem solid rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.details-box-extended {
  margin-top: 2rem;
}

.details-box-extended .details-heading,
.details-box-extended .deatils-info p span {
  display: block;
  margin-bottom: 1rem;
}

.details-box-extended .deatils-info {
  max-height: 100px;
  overflow-y: auto;
  scrollbar-color: var(--orange) rgb(0, 0, 0, 0.2);
  scrollbar-width: thin;
}

.details-box-extended .deatils-info::-webkit-scrollbar {
  width: 0.4rem;
}

.details-box-extended .deatils-info::-webkit-scrollbar-thumb {
  background-color: var(--orange);
  cursor: pointer;
}

.details-box-extended .deatils-info::-webkit-scrollbar-track {
  background: rgb(0, 0, 0, 0.2);
}

.details-heading {
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
}

.deatils-info {
  color: var(--white);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 2.8rem;
  transition: var(--transition);
}

.featured-area .btn-secondary {
  margin-top: 7rem;
  padding: 0.5rem 2.2rem;
}

.feature-image-text {
  display: inline-block;
  margin-top: 2.8rem;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 4rem;
  transition: var(--transition);
}

.feature-image-text:hover {
  color: var(--orange);
}

.featuredSlider {
  padding-top: 7rem;
  padding-bottom: 11rem;
}

.featured-area .swiper-button-next {
  right: calc(50% - 40px);
  top: auto;
  bottom: 0;
}

.featured-area .swiper-button-prev {
  left: calc(50% - 40px);
  top: auto;
  bottom: 0;
}

.featured-area .box-item {
  position: relative;
  -webkit-backface-visibility: hidden;
}

.flip-box {
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  height: 60rem;
  perspective: 2500px;
  -webkit-perspective: 2500px;
}

.flip-box img {
  width: 100%;
  height: 100%;
}

.flip-box-front,
.flip-box-back {
  background-size: cover;
  background-position: center;
  border-radius: 5px;
  -ms-transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  -webkit-transition: transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  border-radius: 0.5rem;
  overflow: hidden;
}

.flip-box-front {
  position: relative;
  height: 100%;
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box:hover .flip-box-front {
  -ms-transform: rotateY(-180deg);
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -ms-transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box:hover .flip-box-back {
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.flip-box .flip-box-back-content {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-perspective: inherit;
  perspective: inherit;
  z-index: 2;
  transform: translateY(-50%) translateZ(60px) scale(1);
  -webkit-transform: translateY(-50%) translateZ(60px) scale(1);
  -ms-transform: translateY(-50%) translateZ(60px) scale(1);
  width: 100%;
  height: 100%;
  background: rgba(7, 28, 53, 0.9);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.flip-box .flip-box-back-content .image-title {
  position: relative;
  bottom: 0rem;
  left: 0rem;
}

.featured-mobile-address {
  display: none;
  position: absolute;
  bottom: 2rem;
  left: 1.5rem;
  background-color: var(--white);
  border-radius: 0.2rem;
  padding: 0.3rem 1rem;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.6rem;
}

.featured-sold-wrap {
  position: absolute;
  top: 0;
  left: 0;
  /* width: 31%;
  background-color: #ff0000;
  padding: 0;
  transform: rotate(-45deg);
  transform-origin: top left; */
}

/* .featured-sold-text {
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 2rem;
  font-weight: 400;
  line-height: 3.6rem;
  text-transform: uppercase;
  text-align: center;
} */

.featured-loop.project-sold-out .details-item.unit_status .deatils-info {
  color: #ff0000;
  line-height: 3.8rem;
  background: var(--white);
  padding: 0 0.8rem;
  border-radius: 0.8rem;
}

.project-items.project-sold-out .details-item.unit_status .deatils-info {
  color: #ff0000;
  line-height: 3.8rem;
  background: var(--white);
  padding: 0 0.8rem;
  border-radius: 0.8rem;
}

/* Featured Area Style End */

/* Footer Area Style Start */

.contact-wrapper {
  background: linear-gradient(to right,
      #f8f9fb 0%,
      #f8f9fb 50%,
      #f3f5f8 50%,
      #f3f5f8 100%);
  height: 100%;
  width: 100%;
  padding: 11rem 0;
  padding-bottom: 8rem;
}

.footer-contact-box {
  display: flex;
  align-items: flex-start;
}

.contact-wrapper .common-header {
  margin-bottom: 5.5rem;
}

.contact-wrapper .common-header .common-small-text {
  color: var(--black-100);
}

.form-wrapper,
.contact-wrap {
  width: 50%;
}

.contact-box {
  width: 100%;
  min-width: 44.5rem;
  margin: 0 auto;
}

.form-box {
  width: 100%;
  max-width: 61.2rem;
  margin: 0 auto;
}

.formcontrol-wrapper br {
  display: none !important;
}

.form-box .form-group {
  width: 100%;
  margin-bottom: 2.6rem;
}

.form-box .form-group .formcontrol {
  font-family: var(--number-font);
  color: var(--black-100);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.8rem;
  height: 4.4rem;
  padding-left: 2rem;
  padding-right: 4rem;
  border-radius: 2px;
  /* box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.05); */
}

.form-box .form-group .select-wrap {
  height: 4.4rem;
}

.form-box .form-group .formcontrol-select {
  padding-left: 2rem;
}

.form-box .form-group .formcontrol-select span.current {
  position: relative;
  right: 0;
  top: 0;
  transform: none;
  font-family: var(--number-font);
  color: var(--black-100);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.8rem;
}

.form-box .form-group input::placeholder,
.form-box .form-group textarea::placeholder {
  font-family: var(--primary-font);
  color: rgba(7, 28, 53, 0.75);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.8rem;
  text-transform: uppercase;
}

.form-box .form-group i {
  position: absolute;
  top: 1.2rem;
  right: 1.4rem;
  color: var(--black-100);
  font-size: 1.6rem;
  pointer-events: none;
}

.form-box .form-group .textareacontrol-wrapper i {
  top: 1.4rem;
  transform: none;
}

.bottom-group {
  display: flex;
  align-items: flex-start;
  gap: 2.5rem;
}

.form-box .form-group .checkbox-wrapper span {
  display: inline-block;
  position: relative;
  top: 0;
  transform: none;
  right: 0;
  font-family: var(--primary-font);
  color: #455567;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1.8rem;
}

/* .checkbox-wrapper input {
  padding: 0;
  height: initial;
  width: initial;
  margin-bottom: 0;
  display: none;
  cursor: pointer;
}
.checkbox-wrapper label {
  position: relative;
  padding-left: 3rem;
  cursor: pointer;
  font-family: var(--primary-font);
  color: var(--black);
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.8rem;
}
.form-group label:before {
  content: "";
  position: absolute;
  top: 0rem;
  left: 0rem;
  -webkit-appearance: none;
  background-color: transparent;
  border: 0.1rem solid var(--black);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05),
    inset 0px -15px 10px -12px rgba(0, 0, 0, 0.05);
  width: 2rem;
  height: 2rem;
  border-radius: 0.4rem;
  display: inline-block;
  vertical-align: middle;
  cursor: pointer;
}
.checkbox-wrapper input:checked + label:after {
  content: "";
  display: block;
  position: absolute;
  top: 0.3rem;
  left: 0.7rem;
  width: 0.6rem;
  height: 1.2rem;
  border: solid var(--black);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
} */

.form-box .btn-secondary {
  padding: 0.5rem 2.4rem;
  margin-top: 3rem;
  background-color: var(--black-100);
  color: var(--white);
  font-size: 1.8rem;
}

.form-box .btn-secondary:hover {
  background-color: var(--orange);
}

.address-area-name {
  font-family: var(--Secondary-font);
  color: var(--black-100);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 4rem;
  text-align: center;
  margin-bottom: 0.8rem;
}

.contact-box .address-filed,
.contact-box .call-info,
.contact-box .mail-deatils,
.contact-box a {
  display: block;
  text-align: center;
  font-family: var(--number-font);
  color: var(--black-100);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2.7rem;
  transition: var(--transition);
}

.contact-box a {
  display: inline-block;
  padding: 0.5rem 0.8rem;
}

.contact-box a:hover {
  color: var(--orange);
}

.contact-box .address-filed {
  margin-bottom: 2.5rem;
}

.social-nav {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.2rem;
  margin-top: 5.8rem;
}

.social-nav span {
  font-size: 0;
}

.social-nav span::before {
  font-size: 1.7rem;
  color: var(--black-100);
  transition: var(--transition);
}

.social-nav a:hover span::before {
  color: var(--orange);
}

.footer-logo-wrap {
  /* margin-top: 6.2rem; */
  display: flex;
  align-items: center;
  gap: 0 18.8rem;
  padding: 4.1rem 0;
}

.footer-logo-block {
  width: 25.5rem;
  height: 6.5rem;
}

.footer-logo-block a,
.footer-logo-block img {
  /* margin-top: 6.2rem; */
  display: block;
  height: auto;
  width: 100%;
}

.footer-nav-wrap {
  width: calc(100% - 44.3rem);
}

.footer-nav {
  width: 100%;
  column-count: 5;
  column-gap: 1.6rem;
}

.footer-nav li.current-menu-item a {
  color: var(--orange);
}

.footer-nav a {
  display: inline-block;
  font-family: var(--primary-font);
  color: var(--black-100);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2.7rem;
  transition: var(--transition);
}

.footer-nav a:hover {
  color: var(--orange);
}

.footer-copyright-wrap {
  background-color: var(--gray-400);
  border-top: 0.1rem solid var(--gray-600);
}

.footer-bottom-text {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7.6rem;
}

.footer-bottom-text p,
.footer-bottom-text a {
  font-family: var(--primary-font);
  color: var(--black-100);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.7rem;
  text-align: center;
}

.footer-bottom-text p {
  padding: 1.9rem 0;
}

.footer-bottom-text span {
  font-family: var(--number-font);
}

.footer-bottom-text p.side-border {
  position: relative;
}

.footer-bottom-text p.side-border:after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: -3.8rem;
  width: 0.2rem;
  height: calc(100% - 1.2rem);
  border-left: 0.2rem solid var(--gray-700);
}

.footer-bottom-text a {
  font-weight: 500;
  transition: var(--transition);
}

.footer-bottom-text a:hover {
  color: var(--orange);
}

.footer-bottom-text p img {
  width: 3.1rem;
  height: 2.6rem;
  margin: 0 1rem 0 1.4rem;
}

.newsletter-area {
  border-bottom: 0.1rem solid var(--gray-600);
}

.newsletterbox {
  padding: 10.5rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2rem;
}

.newsletter-heading {
  font-family: var(--Secondary-font);
  color: var(--black-100);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 4rem;
  margin-bottom: 0.5rem;
}

.newsletter-text {
  font-family: var(--primary-font);
  color: #071c35b2;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.7rem;
}

.newsletterbox .left-wrap {
  position: relative;
  padding-left: 8.5rem;
  width: calc(100% - 63.6rem);
}

.newsletterbox .left-wrap::after {
  content: "";
  position: absolute;
  top: 0rem;
  left: -3.6rem;
  width: 10.8rem;
  height: 9.3rem;
  background-image: url(../images/mail-image.svg);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
}

.newsletterbox .right-wrap {
  width: 100%;
  max-width: 61.6rem;
}

.newsletterbox .formcontrol {
  height: 5.6rem;
  border: 0.1rem solid var(--gray-300);
  border-radius: 0.4rem;
  padding: 1rem 2.3rem;
  padding-right: 18rem;
  font-family: var(--number-font);
  color: var(--black-300);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.8rem;
}

.newsletterbox .formcontrol:focus {
  outline: none;
  box-shadow: none;
  border-color: var(--black) !important;
}

.newsletterbox .formcontrol::placeholder {
  text-transform: uppercase;
  font-family: var(--primary-font);
  color: var(--black-200);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.8rem;
}

.newsletterbox .btn-primary {
  position: absolute;
  top: 0;
  right: 0;
  height: 5.6rem;
  font-size: 1.8rem;
  padding: 0.5rem 2.1rem;
  border-radius: 0 0.4rem 0.4rem 0;
  color: var(--white);
  background-color: var(--black-100);
}

.newsletterbox .btn-primary:hover {
  background-color: var(--orange);
  border-color: var(--orange);
  color: var(--black);
}

/* Footer Area Style End */

/* *************************** Jquery UI Datepicker Start **************************** */
.ui-datepicker {
  background: var(--white);
  border-radius: 15px;
  width: fit-content;
}

.ui-datepicker-header {
  height: 5rem;
  border-radius: 10px;
  color: #ffffff;
  background: var(--black-100);
  margin-bottom: 0rem;
}

.ui-datepicker-prev,
.ui-datepicker-next {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  text-indent: 9999px;
  border-radius: 100%;
  cursor: pointer;
  overflow: hidden;
  margin-top: 1.2rem;
}

.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
  display: none;
}

.ui-datepicker-prev:after {
  transform: rotate(45deg);
}

.ui-datepicker-next:after {
  transform: rotate(-135deg);
}

.ui-datepicker-prev:after,
.ui-datepicker-next:after {
  content: "";
  position: absolute;
  top: 0.6rem;
  display: block;
  width: 0.8rem;
  height: 0.8rem;
  border-left: 0.2rem solid var(--white);
  border-bottom: 0.2rem solid var(--white);
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
  border-color: transparent;
  background: transparent;
}

.ui-datepicker .ui-datepicker-prev-hover {
  left: 0.2rem;
}

.ui-datepicker .ui-datepicker-next-hover {
  right: 0.2rem;
}

.ui-datepicker td span,
.ui-datepicker td a {
  text-align: center;
}

.ui-datepicker-title {
  height: 100%;
  text-align: center;
  font-size: 1.6rem;
}

.ui-datepicker .ui-datepicker-title {
  line-height: 4.2rem;
}

.ui-datepicker-calendar {
  width: 100%;
  text-align: center;
}

.ui-datepicker-calendar thead tr th span {
  display: block;
  width: 4rem;
  color: var(--black-100);
  margin-bottom: 0.5rem;
  font-size: 1.2rem;
}

.ui-state-default {
  display: block;
  text-decoration: none;
  color: var(--orange);
  line-height: 4rem;
  font-size: 1.2rem;
}

.ui-state-default:hover {
  color: var(--white);
  background: var(--black-100);
  transition: all 0.25s cubic-bezier(0.7, -0.12, 0.2, 1.12);
}

.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  border: 0.1rem solid var(--orange);
  background: var(--orange);
  color: var(--white);
}

.ui-state-active {
  color: var(--white);
  background: var(--black-100);
}

.ui-datepicker-unselectable .ui-state-default {
  color: var(--gray-200);
  border: 0.2rem solid transparent;
}

/* *************************** Jquery UI Datepicker End **************************** */

/* *************************** Jquery UI Timepicker Start **************************** */
.ui-timepicker-standard a {
  font-family: var(--primary-font);
  color: var(--black-100);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.8rem;
}

.ui-timepicker-standard .ui-state-hover {
  background-color: var(--black-100);
  border: none;
  color: var(--white);
}

/* *************************** Jquery UI Timepicker End **************************** */

/* Spitting Css */
.words .char {
  overflow: hidden;
  color: transparent;
}

.words .char:before,
.words .char:after {
  visibility: visible;
  color: var(--black-100);
  transition: transform 0.5s cubic-bezier(0.9, 0, 0.2, 1);
  transition-delay: calc(0.2s + (0.02s * (var(--char-index))));
}

.words .char:before {
  color: var(--black-100);
  transition-delay: calc(0.02s * (var(--char-index)));
}

.footer-nav li a:hover .char:before {
  transition-delay: calc(0.2s + (0.02s * (var(--char-index))));
  color: var(--orange);
}

.footer-nav li a:hover .char:after {
  transition-delay: calc(0.02s * (var(--char-index)));
  color: var(--orange);
}

.words .char:before {
  transform: translateY(-100%);
}

.footer-nav li a:hover .char:before {
  transform: translateY(0%);
}

.footer-nav li a:hover .char:after {
  transform: translateY(100%);
}

.footer-nav li.current-menu-item a .words .char:before {
  transform: none;
  color: var(--orange);
}

.footer-nav li.current-menu-item a .words .char:after {
  color: var(--orange);
}

.footer-nav li.current-menu-item a:hover .char:after {
  display: none;
  color: var(--orange);
}

/* Magnific Popup Image Title Start*/

.mfp-bottom-bar {
  background-color: var(--white);

}

.mfp-title {
  padding-right: 6rem;
}

.mfp-title figcaption {
  font-family: var(--primary-font);
  color: var(--black-100);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 2.2rem;
  padding: 0;
  margin-right: 2rem;
  padding: 0.5rem 2rem;
  padding-right: 0;
}

.mfp-counter {
  top: 0.8rem;
  right: 1.4rem;
  font-family: var(--primary-font);
  color: var(--black-100);
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 1.6rem;
  text-align: right;
}

.mfp-close {
  right: -6rem !important;
  cursor: pointer !important;
  background-color: var(--white) !important;
  border-radius: 50% !important;
  height: 4.8rem !important;
  width: 4.8rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: var(--black-100) !important;
  font-size: 3rem !important;
  padding: 0 !important;
  opacity: 1 !important;
  transition: var(--transition);
}

.mfp-close:hover {
  color: #ff0000 !important;
}

/* Magnific Popup Image Title End */

/* Project Items Style Start */
.project-list {
  padding: 12.2rem 0 11.5rem;
}

.project-buttons {
  justify-content: center;
  margin-bottom: 8.4rem;
}

.ongoing,
.completed {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  min-height: 4.7rem;
  min-width: 18.3rem;
  padding: 0.5rem;
  font-family: var(--primary-font);
  color: var(--black-100);
  background-color: var(--gray-500);
  text-transform: uppercase;
  letter-spacing: 1px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  border-radius: 4.5rem;
  transition: var(--transition);
}

.ongoing:hover,
.completed:hover,
.ongoing.active,
.completed.active {
  color: var(--white);
  background-color: var(--black-100);
}

.project-item-wrap,
.project-buttons {
  display: flex;
  align-items: center;
  gap: 6.6rem 4rem;
  flex-wrap: wrap;
}

.project-item-wrap {
  align-items: flex-start;
}

.project-items {
  width: calc(50% - 2rem);
}

.project-items .btn-secondary {
  margin-top: 4rem;
  padding: 0.5rem 2.2rem;
}

.project-item-wrap .no_reuslt {
  width: 100%;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 3rem;
  text-align: center;
}

/* Project Items Style End */

/* Project Details Banner Style Start */
.project-banner-area {
  height: 100vh;
  position: relative;
}

.project-banner-area .video__buttons {
  top: 9rem;
}

.banner-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.project-banner-wrap img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.project-banner-wrap {
  position: relative;
  height: 100%;
}

.project-banner-wrap::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 23.8rem;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0) 0%, #000 100%);
}

.project-banner-wrap::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 70%;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 62.86%, #000 85%);
  z-index: 10;
}

.project-banner-wrap .video-wrap,
.project-banner-wrap .image-wrap {
  height: 100%;
  position: relative;
}

.project-banner-wrap .image-wrap figure {
  height: 100%;
}

.project-banner-text-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: auto;
  z-index: 10;
}

.project-banner-inner-text-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.project-banner-text-wrap figure img {
  width: fit-content;
}

.project-banner-upper-desc {
  position: relative;
  margin-bottom: 6.5rem;
  text-align: center;
}

.project-banner-upper-desc::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 117.3rem;
  /* width: 100%;
  max-width: 117.3rem; */
  height: 22.3rem;
  border-radius: 117.3rem;
  background: rgba(0, 0, 0, 0.7);
  filter: blur(100px);
  z-index: -1;
}

.project-banner-upper-desc .price-box {
  justify-content: center;
}

.featured-address {
  font-size: 1.6rem;
  line-height: 3.5rem;
  margin: 1.6rem 0 0.7rem;
  color: var(--orange);
}

.project-banner-lower-desc {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 0.1rem solid #c3c3c338;
  padding: 2.6rem 0;
}

.project-banner-lower-desc.single-completed-project {
  justify-content: center;
}

.single-hide {
  display: none !important;
}

.project-banner-lower-desc span,
.hira-box,
.architect-box {
  color: var(--white);
  font-family: var(--number-font);
  font-size: 2.2rem;
  font-weight: 400;
  line-height: 1.8rem;
}

.hira-box,
.architect-box {
  display: flex;
  align-items: center;
  position: relative;
}

.project-banner-lower-desc span a,
.hira-box a,
.architect-box {
  display: inline-block;
  color: var(--white);
  text-decoration: underline;
  transition: var(--transition);
}

.hira-box a {
  margin-left: 0.8rem;
}

.architect-box {
  text-decoration: none;
}

.project-banner-lower-desc span:hover a,
.hira-box a:hover {
  color: var(--orange);
}

.project-banner-lower-desc .hira-box i,
.project-banner-lower-desc .architect-box i {
  cursor: pointer;
  margin-left: 1rem;
  display: inline-block;
  border-radius: 50%;
  padding: 0.6rem;
  background: var(--orange);
  font-size: 1rem;
  color: var(--black-100);
  transition: var(--transition);
}

.project-banner-lower-desc .hira-box i:hover,
.project-banner-lower-desc .architect-box i:hover {
  background: var(--white);
}

.hira-extra-info,
.architect-extra-info {
  display: none;
  position: absolute;
  top: -13rem;
  left: 0;
  /* max-width: 30rem; */
  width: 100%;
  border-radius: 0.5rem;
  background: var(--white);
  box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.1);
  padding: 1rem 2rem;
}

.hira-extra-info .icon-close,
.architect-extra-info .icon-close {
  position: absolute;
  top: -1rem;
  right: -0.8rem;
  width: 3rem;
  height: 3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--orange);
  border-radius: 50%;
  font-size: 0.9rem;
  color: var(--white);
  cursor: pointer;
  transition: var(--transition);
}

.hira-extra-info .icon-close:hover,
.architect-extra-info .icon-close:hover {
  background: var(--black-100);
}

.hira-extra-wrap,
.architect-extra-wrap {
  overflow: auto;
  min-height: 10rem;
  max-height: 10rem;
  scrollbar-color: #071c35 rgb(0, 0, 0, 0.2);
  scrollbar-width: thin;
}

.hira-extra-wrap::-webkit-scrollbar,
.architect-extra-wrap::-webkit-scrollbar {
  width: 0.4rem;
}

.hira-extra-wrap::-webkit-scrollbar-thumb,
.architect-extra-wrap::-webkit-scrollbar-thumb {
  background-color: var(--black-100);
  cursor: pointer;
}

.hira-extra-wrap::-webkit-scrollbar-track,
.architect-extra-wrap::-webkit-scrollbar-track {
  background: rgb(0, 0, 0, 0.2);
}

.hira-extra-info ul li,
.architect-extra-info ul li {
  position: relative;
  padding-left: 2rem;
}

.hira-extra-info ul li::after,
.architect-extra-info ul li::after {
  content: "";
  position: absolute;
  top: 0.8rem;
  left: 0;
  width: 0.6rem;
  height: 0.6rem;
  background: var(--orange);
}

.hira-extra-info ul li a,
.architect-extra-info ul li {
  display: inline-block;
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2rem;
}

.architect-extra-info ul li {
  display: list-item;
}

.hira-extra-info ul li:not(:last-of-type) a,
.architect-extra-info ul li:not(:last-of-type) {
  margin-bottom: 1.5rem;
}

/* Project Details Banner Style End */
/* Project About Area Style Start */

.project-about-area {
  overflow: hidden;
  padding: 7.8rem 0 20rem;
}

.project-about-area .common-header p {
  max-width: 157.5rem;
  margin: 0 auto 5rem;
}

.call-area {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 2rem;
  margin-bottom: 2.6rem;
}

.call-area .call-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.7rem;
  height: 4.7rem;
  border: 0.2rem solid var(--black-100);
  border-radius: 50%;
  transition: var(--transition);
}

.call-area span {
  font-size: 2.1rem;
  color: var(--black-100);
  transition: var(--transition);
}

.call-area .call-btn:hover {
  border-color: var(--orange);
}

.call-area .call-btn:hover span {
  color: var(--orange);
}

.visit-btn {
  font-size: 1.4rem;
  min-height: 4.7rem;
  padding: 0.5rem 2.2rem;
  color: var(--white);
  background-color: var(--black-100);
}

.project-about-area .swiper-button-next,
.project-about-area .swiper-button-prev {
  transform: translateY(50%);
}

.project-about-area .swiper-button-prev:after {
  content: "\e909";
  font-size: 2.4rem;
  color: var(--gray-300);
}

.project-about-area .swiper-button-prev:hover:after {
  color: var(--black);
}

.project-about-area .swiper-button-next:after {
  content: "\e90d";
  font-size: 2.4rem;
  color: var(--gray-300);
}

.project-about-area .swiper-button-next:hover:after {
  color: var(--black);
}

.project-details-box {
  padding: 1.7rem 1rem;
  width: fit-content;
  margin: 0 auto;
  text-align: center;
}

.project-details-heading {
  color: var(--orange);
  font-family: var(--number-font);
  font-size: 2.2rem;
  font-weight: 400;
  line-height: 2.6rem;
  margin-bottom: 1rem;
}

.project-details-heading p:not(:last-of-type) {
  margin-bottom: 1rem;
}

.project-details-info {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 3rem;
}

.projectDetailsSwiper {
  max-width: 135rem;
  margin: 0 auto;
}

.projectDetailsSwiper-pagination {
  display: none;
}

.project-about-area .swiper-button-next,
.project-about-area .swiper-button-prev {
  display: flex;
}

/* .projectDetailsSwiper .swiper-wrapper {
  justify-content: center;
} */

.project-details-loop {
  position: relative;
}

.project-details-loop:not(:first-of-type):after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 0.1rem;
  height: 100%;
  background: var(--gray-300);
}

/* Project About Area Style End */
/* Project Amenities Area Style Start */

.project-amenities {
  overflow: hidden;
}

.project-amenities .common-header {
  margin-bottom: 2.7rem;
}

/*============================================================*/

.tabs-nav {
  max-width: 144rem;
  margin: 0 auto 2.2rem;
  border-bottom: 0.1rem solid #c3c3c380;
}

.tabs-nav ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 8rem;
}

.tabs-nav a {
  position: relative;
  display: inline-block;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 1.8rem;
  padding-bottom: 1rem;
  transition: var(--transition);
}

/* Active tab */
.tabs-nav li.active a {
  font-weight: 700;
}

.tabs-nav li.active a::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background: var(--black-100);
}

/* Tab content */

/* Hide all but first content div */
.tabs-content .tab-content-items {
  position: relative;
}

.tabs-content .tab-content-items:not(:first-child) {
  display: none;
}

.tab-content-items .tab-accordion-heading {
  display: none;
  position: relative;
  padding: 1.5rem;
  cursor: pointer;
  color: #7c7c7e;
  text-align: center;
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 3rem;
  padding-right: 3rem;
  border: 0.1rem solid #7c7c7e;
}

.tab-content-items .tab-accordion-heading::after {
  content: "\e919";
  font-family: "icomoon";
  position: absolute;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  right: 1rem;
  font-size: 0.8rem;
  line-height: normal;
  color: #7c7c7e;
  transition: var(--transition);
}

.tab-content-items .tab-accordion-heading.active::after {
  transform: translateY(-50%) rotate(180deg);
}

.tab-content-section .swiper-container {
  position: relative;
}

.tabs-content .projectAmenitiesImageGallerySlider .project-amenities-image-slide-image {
  height: 86.8rem;
  position: relative;
}

.projectAmenitiesIconGallerySlider {
  width: 92%;
  margin-top: 5.5rem;
}

.project-amenities-icon-slide-image {
  height: 6rem;
  margin-bottom: 1.6rem;
}

.tabs-content .projectAmenitiesIconGallerySlider .project-amenities-slide-loop svg {
  width: 100%;
  height: 100%;
}

.tabs-content .projectAmenitiesIconGallerySlider .figure-text {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.7rem;
  text-align: center;
}

.tabs-content .projectAmenitiesImageGallerySlider-prev,
.tabs-content .projectAmenitiesImageGallerySlider-next {
  width: 6.3rem;
  height: 6.3rem;
  background-color: var(--white);
  border-radius: 50%;
  box-shadow: 0px 0px 32px 0px rgba(0, 0, 0, 0.15);
}

.tabs-content .projectAmenitiesImageGallerySlider-prev {
  left: 2rem;
}

.tabs-content .projectAmenitiesImageGallerySlider-next {
  right: 2rem;
}

.tabs-content .projectAmenitiesImageGallerySlider-prev::after,
.tabs-content .projectAmenitiesImageGallerySlider-next::after {
  font-size: 1.5rem;
  color: var(--gray-200);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.tabs-content .projectAmenitiesImageGallerySlider-prev:hover::after,
.tabs-content .projectAmenitiesImageGallerySlider-next:hover::after {
  color: var(--black-100);
}

.projectAmenitiesIconGallerySlider-pagination {
  display: none;
}

/* Project Amenities Area Style End */

/* Project NEIGHBOURHOOD Area Style Start */

.project-neighbourhood {
  padding: 15rem 0;
}

.project-neighbourhood .common-header {
  margin-bottom: 6.2rem;
}

.map-block {
  position: relative;
}

.map-block iframe {
  width: 100%;
  height: 79.2rem;
}

.map-content {
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: 36rem;
  height: auto;
  border-radius: 0.5rem;
  background-color: var(--white);
  overflow: hidden;
  padding: 3.5rem 2.2rem 3rem 3rem;
}

.map-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3.2rem;
  margin-bottom: 1.1rem;
}

.map-address {
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.4rem;
  margin-bottom: 2.8rem;
}

.key-convenience-spots {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 2.7rem;
  text-transform: uppercase;
  text-decoration: underline;
  margin-bottom: 3rem;
}

.View-larger-map {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 0.7rem;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 2.8rem;
  transition: var(--transition);
}

.View-larger-map div {
  display: inline-block;
  line-height: 0;
}

.View-larger-map div span {
  color: var(--black-100);
  font-size: 3.3rem;
  transition: var(--transition);
}

.View-larger-map:hover {
  color: var(--orange);
}

.View-larger-map:hover div span {
  color: var(--orange);
}

.map-whole-outer {
  /* width: fit-content; */
  margin-bottom: 3.6rem;
}

.map-infobox {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  /* max-width: 29rem;
  padding-right: 5.8rem; */
  max-height: 20.5rem;
  overflow: auto;
  scrollbar-color: #071c35 rgb(0, 0, 0, 0.2);
  scrollbar-width: thin;
}

.map-infobox::-webkit-scrollbar {
  width: 0.4rem;
}

.map-infobox::-webkit-scrollbar-thumb {
  background-color: var(--black-100);
  cursor: pointer;
}

.map-infobox::-webkit-scrollbar-track {
  background: rgb(0, 0, 0, 0.2);
}

.map-info-item {
  display: inline-block;
  width: 50%;
  text-align: center;
  position: relative;
  padding: 1.8rem 1rem 1.2rem;
  cursor: pointer;
}

.map-info-item:nth-of-type(odd):before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 10rem;
  height: 0.1rem;
  background: rgb(0, 0, 0, 0.2);
}

.map-info-item:nth-of-type(even):before {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 10rem;
  height: 0.1rem;
  background: rgb(0, 0, 0, 0.2);
}

.map-info-item:nth-last-child(-n + 2):before {
  display: none;
}

.map-info-item:nth-of-type(odd)::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 0.1rem;
  height: 84%;
  background: rgb(0, 0, 0, 0.2);
}

.map-info-heading {
  color: var(--black-100);
  font-family: var(--third-font);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 4rem;
  margin-bottom: 0.5rem;
  transition: var(--transition);
}

.map-info-item:hover .map-info-heading {
  color: var(--orange);
}

.map-info-text {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.7rem;
  transition: var(--transition);
}

.map-info-item:hover .map-info-text {
  color: var(--orange);
}

.map-extra-info {
  position: relative;
  border-radius: 0.5rem;
  background: var(--white);
  box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.1);
  padding: 1rem 2rem 3rem;
}

.map-extra-info .icon-close {
  position: absolute;
  top: -1rem;
  right: -0.8rem;
  background: var(--black-100);
  border-radius: 50%;
  font-size: 0.9rem;
  color: var(--white);
  padding: 0.9rem;
  cursor: pointer;
  transition: var(--transition);
}

.map-extra-info .icon-close:hover {
  background: var(--orange);
}

.map-extra-wrap {
  overflow: auto;
  max-height: 20rem;
  scrollbar-color: #071c35 rgb(0, 0, 0, 0.2);
  scrollbar-width: thin;
}

.map-extra-wrap::-webkit-scrollbar {
  width: 0.4rem;
}

.map-extra-wrap::-webkit-scrollbar-thumb {
  background-color: var(--black-100);
  cursor: pointer;
}

.map-extra-wrap::-webkit-scrollbar-track {
  background: rgb(0, 0, 0, 0.2);
}

.map-extra-info-heading {
  color: var(--orange);
  font-family: var(--third-font);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 4rem;
  padding-bottom: 0.4rem;
  border-bottom: 0.1rem solid rgba(0, 0, 0, 0.2);
  margin-bottom: 1.8rem;
}

.map-extra-info ul li {
  position: relative;
  padding-left: 2rem;
}

.map-extra-info ul li::after {
  content: "";
  position: absolute;
  top: 0.8rem;
  left: 0;
  width: 0.6rem;
  height: 0.6rem;
  background: var(--orange);
}

.map-extra-info ul li a {
  display: inline-block;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2rem;
}

.map-extra-info ul li:not(:last-of-type) a {
  margin-bottom: 1.5rem;
}

/* Project NEIGHBOURHOOD Area Style End */

/* Project Video Area Style Start */
.project-video {
  padding-bottom: 11rem;
}

.project-video .common-header {
  margin-bottom: 3.5rem;
}

.project-tab-buttons {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4rem;
  margin-bottom: 7.5rem;
}

.project-video .active {
  display: block;
}

.project-video .hide {
  display: none;
}

.project-tab-buttons li a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.7rem;
  text-transform: uppercase;
  padding: 0.5rem 3.5rem;
  border-radius: 4.5rem;
  background-color: var(--gray-500);
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  text-align: center;
  letter-spacing: 1.2px;
  transition: var(--transition);
}

.project-tab-buttons li a:hover,
.project-tab-buttons li a.activelink {
  background-color: var(--black-100);
  color: var(--white);
}

.project-tab-content .list {
  display: none;
}

.project-tab-content .list.active {
  display: block;
}

.youtube-wrapper {
  max-width: 128rem;
  margin: 0 auto;
  height: 72rem;
}

.youtube-image {
  height: 72rem;
  position: relative;
}

.youtube-image figure,
.youtube-image figure img {
  height: 100%;
  width: 100%;
}

.youtube-image a {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 1rem 2.3rem;
  background-color: var(--white);
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 2.4rem;
  text-align: center;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  transition: var(--transition);
}

.youtube-image a:hover {
  background-color: var(--black-100);
  color: var(--white);
}

.projectYoutubeSlider,
.constructionSlider {
  width: 95%;
  margin: 0;
  margin-left: auto;
  margin-bottom: 3.3rem;
}

.projectYoutubeSlider.full-width,
.constructionSlider.full-width {
  width: 100%;
}

.projectYoutubeSlider.full-width .swiper-slide:last-of-type,
.constructionSlider.full-width .swiper-slide:last-of-type {
  margin-right: 0 !important;
}

.projectYoutubeSlider .image-wrap,
.constructionSlider .image-wrap,
.projectYoutubeSlider .youtube-slide-wrapper {
  display: block;
  height: 54.6rem;
  position: relative;
}

.projectYoutubeSlider .image-wrap figure,
.constructionSlider .image-wrap figure {
  height: 100%;
  position: relative;
}

.projectYoutubeSlider .image-wrap figure img,
.constructionSlider .image-wrap figure img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.projectYoutubeSlider .image-wrap figure::after,
.constructionSlider .image-wrap figure::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg,
      rgba(0, 0, 0, 0) 62.86%,
      rgba(0, 0, 0, 0.63) 100%);
}

.projectYoutubeSlider .image-wrap figcaption,
.constructionSlider .image-wrap figcaption {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
  text-transform: capitalize;
  background: var(--black);
  padding: 1.3rem 3.4rem;
}

.project-video .swiper-button-next {
  position: relative;
  right: 0;
  width: 6rem;
  margin: 0;
  margin-left: auto;
}

.project-video .swiper-button-prev {
  position: relative;
  left: 0;
  width: 6rem;
  margin: 0;
  margin-left: auto;
  margin-top: -3.5rem;
  margin-right: 7.6rem;
}

.youtube-popup-items {
  display: block;
  height: 72rem;
  position: relative;
}

.youtube-popup-items img {
  height: 100%;
  width: 100%;
}

.youtube-popup-items span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(1);
  color: #ff0000;
  font-size: 6.2rem;
  transition: var(--transition);
}

.youtube-popup-items span:hover {
  transform: translate(-50%, -50%) scale(1.2);
}

.project-btn {
  width: fit-content;
  min-width: 57.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 2.5rem auto 0;
  padding: 2rem 2.5rem 2rem 3rem;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 3.4rem;
  font-weight: 400;
  line-height: 4rem;
  text-transform: capitalize;
  transition: var(--transition);
  border: 0.2rem solid var(--black-100);
}

.project-btn:hover {
  background-color: var(--black);
  color: var(--white);
}

.project-btn span {
  margin-left: 3rem;
  color: var(--black-100);
  font-size: 3.7rem;
  transition: var(--transition);
}

.project-btn:hover span {
  color: var(--white);
}

.justify-content-middle {
  justify-content: center !important;
}

/* Project Video Area Style End */

/* Project Customer Area Style Start */
.customer-portal {
  padding-bottom: 10.5rem;
padding-top: 11rem;
}

.customer-wrap {
  position: relative;
  height: 33.8rem;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.customer-wrap figure {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.customer-wrap figure img {
  width: 100%;
  height: 100%;
}

.customer-content {
  position: relative;
  z-index: 1;
  text-align: center;
  padding-right: 10.8rem;
}

.customer-wrap-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.2rem;
  margin-bottom: 2.7rem;
  text-transform: uppercase;
}

.customer-btn {
  display: inline-block;
  padding: 1.8rem 4rem;
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 1.4rem;
  font-weight: 700;
  line-height: 1.8rem;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  border-radius: 0.2rem;
  background-color: var(--black-100);
  transition: var(--transition);
}

.customer-btn:hover {
  background-color: var(--orange);
  color: var(--white);
}

.faq-area {
  padding-bottom: 11rem;
}

.faq-area .accordion-area {
  max-width: 135.2rem;
  margin: 0 auto;
}

.accordion-area .set {
  border-bottom: 0.1rem solid var(--gray-300);
  padding: 0;
  transition: var(--transition);
}

.accordion-area .set:first-of-type {
  border-top: 0.1rem solid var(--gray-300);
}

.accordion-area .set.active {
  padding-bottom: 4.3rem;
}

.accordion-area .set a {
  position: relative;
  display: inline-block;
  width: 100%;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
  padding: 3.5rem 0;
  padding-right: 5rem !important;
  transition: var(--transition);
}

.accordion-area .set a::after {
  content: "\e90a";
  font-family: "icomoon";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  font-size: 1.7rem;
  line-height: normal;
  color: var(--black-100);
}

.accordion-area .set a.active::after {
  content: "\e90e";
  font-family: "icomoon";
  font-size: 0.3rem;
}

.accordion-area .set.active a {
  padding: 1.8rem 0 3.7rem;
}

.accordion-area .content {
  display: none;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 3rem;
  overflow: hidden;
  overflow-x: auto;
  scrollbar-color: #071c35 rgb(0, 0, 0, 0.2);
  scrollbar-width: thin;
}

.accordion-area .content::-webkit-scrollbar {
  width: 0.4rem;
}

.accordion-area .content::-webkit-scrollbar-thumb {
  background-color: var(--black-100);
  cursor: pointer;
}

.accordion-area .content::-webkit-scrollbar-track {
  background: rgb(0, 0, 0, 0.2);
}

.accordion-area .content p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 3rem;
  margin-bottom: 1.2rem;
}

.accordion-area .set ul li,
.accordion-area .set ol li {
  padding-left: 2rem;
  position: relative;
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.4rem;
}

.accordion-area .set ul li:not(:last-of-type),
.accordion-area .set ol li:not(:last-of-type) {
  margin-bottom: 1.2rem;
}

.accordion-area .set ul li a,
.accordion-area .set ol li a,
.accordion-area .set p a {
  display: inline;
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.4rem;
}

.accordion-area .set ul li a::after,
.accordion-area .set ol li a::after,
.accordion-area .set p a::after {
  display: none;
}

.accordion-area .set ul li a:hover,
.accordion-area .set ol li a:hover,
.accordion-area .set p a:hover {
  color: var(--orange);
}

.accordion-area .set ul li strong,
.accordion-area .set ol li strong {
  font-weight: 600;
}

.accordion-area .set ol {
  padding-left: 0 !important;
}

.accordion-area .set ol li {
  list-style-type: auto;
  padding-left: 0 !important;
}

.accordion-area .set ul li:before {
  content: "\e91e";
  font-family: "icomoon";
  position: absolute;
  top: 0.4rem;
  left: 0;
  font-size: 1.2rem;
  line-height: 1.2rem;
  color: var(--orange);
}

.accordion-area table {
  border: 0.1rem solid #ccc;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  margin-bottom: 2rem;
}

.accordion-area table tr {
  background-color: #f8f8f8;
  border: 0.1rem solid #ccc;
}

.accordion-area table th,
.accordion-area table td {
  border: 0.1rem solid #ccc;
  padding: 1.5rem;
  text-align: center;
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.4rem;
}

.accordion-area table th {
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 3rem;
}

/* Project Customer Area Style End */

/* Project Calculation Area Style Start */
.calculation-area {
  padding-bottom: 0;
  overflow: hidden;
}

.row-child {
  margin: 0 -2.2rem;
}

.row-child .col-md-6 {
  padding: 0 2.2rem;
}

.calculation-left-box {
  height: 100%;
  border: 0.1rem solid #dddddd;
  padding: 6.5rem 5.2rem 6.5rem 4.2rem;
  background-image: url(../images/price-calculator-left-panel-bg.webp);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
}

.calculation-left-box ul {
  height: 37rem;
  margin-bottom: 8rem;
}

.calculation-left-box ul li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 4rem;
}

.calculation-left-box ul li:not(:last-of-type) {
  padding-bottom: 2.8rem;
  border-bottom: 0.1rem solid #c3c3c380;
  margin-bottom: 2.8rem;
}

.calculation-left-box ul li span {
  font-family: var(--third-font);
}

.calculation-left-extended-layout p {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2rem;
  font-weight: 400;
  line-height: 3rem;
}

.calculation-left-extended-layout p:not(:last-of-type) {
  margin-bottom: 2.8rem;
}

.calculation-left-box .notes {
  position: relative;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.7rem;
}

.calculation-left-box .notes::after {
  content: "\e907";
  font-family: "icomoon";
  position: absolute;
  top: -7rem;
  right: 0;
  font-size: 9rem;
  line-height: normal;
  color: var(--black-100);
}

.calculation-right-box {
  height: 100%;
  border: 0.1rem solid #dddddd;
  padding: 6rem 13rem 5rem 11.4rem;
}

.calculation-right-box h2,
.project_no_pricing {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 2rem;
  font-weight: 700;
  line-height: 2.6rem;
  text-transform: uppercase;
  margin-bottom: 2.5rem;
}

.project_no_pricing {
  text-align: center;
  margin: 0 !important;
}

.slider-container label {
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.8rem;
  text-transform: uppercase;
}

.slider-container.loan-input label {
  font-size: 2rem;
  line-height: 2.6rem;
}

.slider-container {
  text-align: left;
  margin-bottom: 2.2rem;
}

.slider-container .input-wrap {
  position: relative;
  line-height: 0rem;
}

.slider-container .input-wrap span {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  color: var(--gray-200);
  font-family: var(--number-font);
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 2rem;
}

.calculation-right-box input[type="range"] {
  width: 100%;
}

.calculation-right-box input[type="text"] {
  width: 100%;
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 2rem;
  font-weight: 700;
  line-height: 2.6rem;
  border: none;
  border-bottom: 0.1rem solid var(--black-100);
  padding: 1rem 3rem 1rem 0;
}

.slider-right-value {
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 2rem;
  text-transform: capitalize;
  margin-bottom: 0.2rem;
  text-align: right;
}

/* Custom Range Slider */
.range-slider {
  position: relative;
  width: 100%;
  height: 4rem;
}

.range-slider_input {
  width: 100%;
  position: absolute;
  top: 50%;
  z-index: 3;
  transform: translateY(-50%);
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 0.4rem;
  opacity: 0;
  margin: 0;
}

.range-slider_input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 100px;
  height: 100px;
  cursor: pointer;
  border-radius: 50%;
  opacity: 0;
}

.range-slider_input::-moz-range-thumb {
  width: 14vmin;
  height: 14vmin;
  cursor: pointer;
  border-radius: 50%;
  opacity: 0;
}

.range-slider_thumb {
  width: 8.5rem;
  height: 4rem;
  border: 0.1rem solid var(--black-100);
  border-radius: 2.5rem;
  background-color: var(--white);
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.4rem;
  font-weight: 600;
  padding: 0.5rem;
  z-index: 2;
}

.range-slider_line {
  height: 0.4rem;
  width: 100%;
  background-color: var(--gray-300);
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  position: absolute;
  border-radius: 0 3rem 3rem 0;
  z-index: 1;
}

.range-slider_line-fill {
  position: absolute;
  height: 0.4rem;
  width: 0;
  background-color: var(--black-100);
  border-radius: 3rem 0 0 3rem;
}

.result sup {
  top: -0.8rem;
  color: var(--gray-200);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2rem;
  margin-left: 0.5rem;
}

.result span {
  font-size: 1.2rem;
}

.emi-amount {
  padding-top: 0.5rem;
  display: inline-block;
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 2rem;
  font-weight: 700;
  line-height: 2.6rem;
}

/* Project Calculation Area Style End */

/* Plans Area Style Start */
.plans-area {
  padding-bottom: 11rem;
}

.plans-area-inner {
  padding: 11rem 0;
  background-color: var(--gray-400);
}

.plans-area-inner .common-header {
  margin-bottom: 3.4rem;
}

.plans-area-inner .top-tab-content figure {
  width: fit-content;
  margin: 0 auto;
  position: relative;
}

.plans-area-inner .top-tab-content figcaption {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  text-align: center;
  text-transform: capitalize;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 3rem;
  margin-top: 2rem;
}

.download-application-kit .project-btn {
  margin: 0 auto 11rem;
}

.plans-area .swiper-container {
  position: relative;
  z-index: 1;
  padding-left: 5rem;
}

.plans-area .swiper {
  position: static;
}

/* .plan-slide-image {
  height: 94.3rem;
} */
.plans-area .swiper-button-prev,
.plans-area .swiper-button-next {
  width: 6.3rem;
  height: 6.3rem;
  background-color: var(--white);
  border-radius: 50%;
  box-shadow: 0px 0px 32px 0px rgba(0, 0, 0, 0.15);
}

.plans-area .swiper-button-prev {
  left: 2rem;
}

.plans-area .swiper-button-next {
  right: -3rem;
}

.plans-area .swiper-button-prev::after,
.plans-area .swiper-button-next::after {
  font-size: 1.5rem;
  color: var(--gray-200);
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.plans-area .swiper-button-prev:hover::after,
.plans-area .swiper-button-next:hover::after {
  color: var(--black-100);
}

.top-tabs {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4rem;
  margin-bottom: 7.5rem;
}

.top-tabs li {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 4.7rem;
  text-transform: uppercase;
  padding: 0.5rem 3.5rem;
  border-radius: 4.5rem;
  background-color: var(--gray-500);
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  text-align: center;
  letter-spacing: 1.2px;
  cursor: pointer;
  transition: var(--transition);
}

.top-tabs li:hover,
.top-tabs li.active {
  background-color: var(--black-100);
  color: var(--white);
}

.top-tab-content {
  display: none;
}

.top-tab-content.active {
  display: block;
}

.plans-area ul.tabs {
  width: 100%;
  display: flex;
  align-items: center;
  /* justify-content: flex-start; */
  justify-content: center;
  flex-wrap: wrap;
  /* gap: 0 25.7rem; */
  gap: 5rem 10rem;
  margin-bottom: 4.6rem;
  border-bottom: 0.1rem solid var(--gray-300);
}

.plans-area ul.tabs li {
  text-transform: capitalize;
  background-color: transparent;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 1.8rem;
  letter-spacing: 0;
  padding-bottom: 1rem;
  position: relative;
  cursor: pointer;
  transition: var(--transition);
}

.plans-area ul.tabs li.active::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0.2rem;
  background: var(--black-100);
}

.plans-area ul.tabs li.active,
.plans-area ul.tabs li:hover {
  background-color: transparent;
  color: var(--black-100);
  font-weight: 700;
}

.plans-area .tab_content {
  display: none;
}

.plans-area .tab_drawer_heading {
  display: none;
}

.plans-area .tab_drawer_heading::after {
  content: "\e919";
  font-family: "icomoon";
  position: absolute;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  right: 1rem;
  font-size: 0.8rem;
  line-height: normal;
  color: #7c7c7e;
  transition: var(--transition);
}

.plans-area .tab_drawer_heading.d_active::after {
  transform: translateY(-50%) rotate(180deg);
}

.inner-tabs {
  display: flex;
  align-items: flex-start;
}

.inner-tabs .inner-tabs-nav {
  width: 27.6rem;
  display: flex;
  align-items: center;
  flex-direction: column;
  margin-bottom: 0px;
  padding-right: 2rem;
  gap: 1.6rem;
}

.inner-tabs-nav li {
  width: 100%;
}

.inner-tabs-nav li a {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-height: 5.8rem;
  color: var(--gray-200);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  text-transform: uppercase;
  background-color: transparent;
  border-radius: 0px 4.5rem 4.5rem 0px;
  padding: 1rem 2.5rem;
  border: 0.1rem solid var(--gray-300);
  transition: var(--transition);
}

.inner-tabs-nav li.active a,
.inner-tabs-nav li:hover a {
  color: var(--white);
  background: var(--black-100);
  border-color: var(--black-100);
}

.inner-tabs-content {
  width: calc(100% - 27.6rem);
  border-left: 0.1rem solid var(--gray-300);
}

.planSwiper .swiper-slide img {
  width: auto;
  height: auto;
}

/* Plans Area Style End */

/* Chairman Area Style Start */
.chairman-area {
  padding-top: 15rem;
  padding-bottom: 11rem;
}

.chairman-container {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 4rem;
}

.chairman-container-left {
  width: calc(40% - 2rem);
}

.chairman-container-right {
  width: calc(60% - 2rem);
}

.chairman-container-right .content-area p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
}

.chairman-container-right .content-area p:not(:last-of-type) {
  margin-bottom: 2.8rem;
}

.chairman-container-right .signature {
  margin: 2rem 0;
}

.chairman-container-right .chairman-name {
  display: block;
  color: var(--orange);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 2.8rem;
}

.chairman-container-right .chairman-designation {
  display: block;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
}

.chairman-container-right .btn-primary {
  margin-top: 9rem;
  padding: 0.5rem 2.6rem;
}

.custom-modal {
  position: fixed;
  overflow: auto;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgb(0 0 0 / 56%);
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  padding: 10rem 3rem 0;
  z-index: 50;
}

.custom-modal-dialog {
  max-width: 124rem;
  width: 100%;
  border-radius: 0px;
  position: relative;
}

.custom-modal-content {
  overflow: hidden;
  max-width: 122.3rem;
  width: 100%;
  background: var(--white);
  padding: 5rem 7.5rem 8rem;
  box-shadow: 10px 10px 30px 0px rgba(0, 0, 0, 0.3);
}

.custom-modal-body {
  display: flex;
  align-items: flex-start;
  gap: 3.5rem;
}

.custom-modal-body figure {
  width: 26.9rem;
  margin-top: 9.5rem;
}

.custom-modal-content-right {
  width: calc(100% - 30.4rem);
}

.custom-modal-content-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.8rem;
  letter-spacing: 1.4px;
  margin-bottom: 3.2rem;
}

.custom-modal-content-heading-mobile {
  display: none;
  text-align: center;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3.2rem;
  letter-spacing: 1.4px;
  text-transform: capitalize;
  margin-bottom: 2.5rem;
}

.custom-modal-body .content-area {
  overflow-y: auto;
  max-height: 56rem;
  padding-right: 6.2rem;
  scrollbar-color: #071c35 #c3c3c3;
  scrollbar-width: thin;
}

.custom-modal-body .content-area::-webkit-scrollbar {
  width: 0.4rem;
}

.custom-modal-body .content-area::-webkit-scrollbar-thumb {
  background-color: var(--black-100);
}

.custom-modal-body .content-area::-webkit-scrollbar-track {
  background: var(--gray-300);
}

.custom-modal-body .content-area p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
}

.custom-modal-body .content-area p:not(:last-of-type) {
  margin-bottom: 2.8rem;
}

.close-modal {
  position: absolute;
  top: -10px;
  right: -10px;
  width: 6.3rem;
  height: 6.3rem;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  border-radius: 50%;
  z-index: 9;
  background-color: var(--white);
  box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.4);
  cursor: pointer;
  transition: var(--transition);
}

.close-modal span {
  color: var(--black-100);
  font-size: 1.4rem;
  transition: var(--transition);
}

.close-modal:hover {
  background-color: var(--orange);
}

.close-modal:hover span {
  color: var(--white);
}

.custom-modal {
  opacity: 0;
  visibility: hidden;
}

body.modal-open .custom-modal {
  opacity: 1;
  visibility: visible;
}

.custom-modal .custom-modal-dialog {
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  -ms-transform: scale(0);
  -o-transform: scale(0);
  transform: scale(0);
}

body.modal-open .custom-modal .custom-modal-dialog {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}

.custom-modal,
body .custom-modal,
body.modal-open .custom-modal .custom-modal-dialog,
body .custom-modal .custom-modal-dialog {
  transition: var(--transition);
}

body.modal-open {
  overflow: hidden;
}

/* Chairman Area Style End */

/* Story About Area Style Start */
.story-about-area .common-header {
  display: none;
}

.story-about-area .image-block {
  position: relative;
  height: 66.5rem;
  overflow: hidden;
  padding-bottom: 5.8rem;
}

.story-about-area .image-block .image-inner-wrap,
.story-about-area .image-block figure {
  position: relative;
  height: 100%;
}

.story-about-area .image-block figure img {
  width: 100%;
  height: 100%;
}

.story-about-area .image-block .image-inner-wrap .shape-block {
  position: absolute;
  bottom: -5.6rem;
  right: -0.5rem;
  height: 47.1rem;
  z-index: 2;
}

.story-about-area .image-block .image-inner-wrap .shape-block img,
.story-about-area .image-block .image-inner-wrap .shape-block svg {
  width: 100%;
  height: 100%;
}

.story-about-area .story-float-header {
  position: absolute;
  bottom: -4rem;
  left: 0;
  background-color: var(--white);
}

.story-about-area .story-float-header .common-header {
  display: block;
  text-align: left;
  margin-bottom: 0;
  padding: 2.8rem 0;
  padding-right: 3.8rem;
}

.story-about-area .story-float-header .common-header .common-header-text {
  margin-bottom: 0;
}

.story-about-area .content-area p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
}

.story-about-area .content-area p:not(:last-of-type) {
  margin-bottom: 2.8rem;
}

.story-about-area .counter-area {
  padding-top: 4.5rem;
}

/* Story About Area Area Style End */

/* Our Journey Area Style Start */
.our-journey-area .common-header,
.our-journey-area .common-header .common-header-text {
  margin-bottom: 0rem;
}

.our-journey-area .swiper-pagination {
  min-height: 24.7rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  bottom: 0;
  top: 0;
  left: 0;
}

.our-journey-area .swiper-pagination::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 100%;
  height: 0.1rem;
  background: #c3c3c3;
}

.our-journey-area .swiper-pagination-bullet {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  margin: 0 !important;
  background-color: #dddddd;
  position: relative;
  z-index: 2;
  opacity: 1;
}

.our-journey-area .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: var(--orange);
}

.our-journey-area .swiper-pagination-bullet-text {
  width: max-content;
  position: absolute;
  top: -4.8rem;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  visibility: hidden;
  text-align: center;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 4rem;
  font-weight: 400;
  line-height: 4rem;
  transition: var(--transition);
}

.our-journey-area .swiper-pagination-bullet.swiper-pagination-bullet-active .swiper-pagination-bullet-text {
  opacity: 1;
  visibility: visible;
}

.year-text {
  text-align: center;
  color: #00000026;
  font-family: var(--Secondary-font);
  font-size: 17rem;
  font-weight: 400;
  line-height: 30rem;
}

.year-content {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6rem;
  height: 53.8rem;
  margin-top: -6rem;
}

.year-content.timeline-half-content .year-left,
.year-content.timeline-half-content .year-right,
.year-content.timeline-half-content .year-middle {
  max-width: 50%;
  width: 50%;
}

.year-left,
.year-right {
  position: relative;
  max-width: 42.3rem;
  width: 100%;
  height: 100%;
  /* display: flex;
  align-items: center; */
  padding-bottom: 2.5rem;
  /* overflow-y: auto;
  padding-right: 1rem; */
}

.year-left .content-area,
.year-right .content-area {
  min-height: auto;
  max-height: 53.8rem;
  position: absolute;
  bottom: 0;
  left: 0;
  overflow-y: auto;
  padding-right: 1rem;
  scrollbar-color: #f7941d rgba(255, 255, 255, 0.8);
  scrollbar-width: thin;
}

.year-left .content-area {
  top: 0;
  padding-top: 6.4rem;
}

.year-left .content-area::-webkit-scrollbar {
  width: 0.6rem;
}

.year-left .content-area::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background-color: var(--orange);
}

.year-right .content-area::-webkit-scrollbar {
  width: 0.6rem;
}

.year-right .content-area::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background-color: var(--orange);
}

.year-content .content-area h2,
.year-content .content-area h3,
.year-content .content-area h4,
.year-content .content-area h5,
.year-content .content-area h6 {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.2rem;
  margin-bottom: 1.5rem;
}

.year-content .content-area h3 {
  font-size: 4.4rem;
  line-height: 5rem;
}

.year-content .content-area h4 {
  font-size: 4.2rem;
  line-height: 4.8rem;
}

.year-content .content-area h5 {
  font-size: 4rem;
  line-height: 4.8rem;
}

.year-content .content-area h6 {
  font-size: 3.8rem;
  line-height: 4.4rem;
}

.year-content .content-area p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
  margin-bottom: 1.5rem;
}

.year-middle figure {
  width: 47.2rem;
  height: 100%;
}

.year-content.timeline-half-content .year-middle figure {
  width: 100%;
  height: 100%;
}

.year-middle figure img {
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Our Journey Area Area Style End */

/* VISIT WEBSITE Area Style Start */
.visit-website-area {
  padding-bottom: 14.7rem;
}

.visit-website-wrap {
  position: relative;
  padding: 2rem 12rem;
  padding-right: 30rem;
  min-height: 22.2rem;
  background-color: var(--black-100);
  display: flex;
  align-items: center;
}

.visit-website-wrap .visit-text {
  color: var(--white);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.2rem;
  text-align: center;
  text-transform: uppercase;
}

.visit-website-wrap a.btn-primary {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 9rem;
  padding: 0.5rem 3.6rem;
  background-color: var(--white);
  color: var(--black-100);
}

.visit-website-wrap a.btn-primary:hover,
.visit-website-wrap a.btn-primary:focus {
  background-color: var(--orange);
  color: var(--white);
}

/* VISIT WEBSITE Area Style End */

/* Our Architect Area Style Start */
.our-architect-area {
  padding-bottom: 11rem;
  overflow: hidden;
}

.our-architect-wrap {
  position: relative;
}

.our-architect-area .storyArchitectSlider .swiper-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.8rem 3rem;
}

.our-architect-area .story-architect-loop {
  width: calc(25% - 2.3rem) !important;
  cursor: pointer;
}

.storyArchitectSlider-next,
.storyArchitectSlider-prev {
  display: none;
}

.our-architect-area .slide-box {
  position: relative;
}

.our-architect-area .slide-box:hover::after {
  height: 23.8rem;
}

.our-architect-area .architect-image-zoom {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 0;
  background: rgba(7, 28, 53, 0.7);
  background-image: url(../images/zoom-icon.svg);
  background-position: center;
  background-size: 12%;
  background-repeat: no-repeat;
  transition: var(--transition);
}

.our-architect-area .slide-box:hover .architect-image-zoom {
  height: 100%;
}

.our-architect-area .architect-image {
  position: relative;
  height: 33.7rem;
  background-color: var(--gray-300);
}

.our-architect-area .architect-image img {
  width: 100%;
  height: 100%;
}

.our-architect-area .architect-name {
  position: relative;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
  text-align: center;
  padding: 1rem;
  background-color: var(--white);
  transition: var(--transition);
  z-index: 1;
}

.our-architect-area .slide-box:hover .architect-name {
  color: var(--white);
  background-color: var(--black-100);
}

.custom-modal-architect-content {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: center;
  margin: 0 auto;
  max-width: 147.8rem;
  width: 100%;
  min-height: 58.3rem;
  background: var(--white);
  box-shadow: 10px 10px 40px 0px rgba(0, 0, 0, 0.1);
}

.custom-modal-architect-content figure {
  width: 45.2rem;
  overflow: hidden;
  height: 58.3rem;
  background-color: var(--gray-300);
}

.custom-modal-architect-content figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.custom-modal-architect-content .custom-modal-content-right {
  width: calc(100% - 45.2rem);
  padding: 6rem 5.5rem 4rem;
  scrollbar-color: #f7941d rgba(255, 255, 255, 0.8);
  scrollbar-width: thin;
}

.custom-modal-architect-content .custom-modal-content-right::-webkit-scrollbar {
  width: 0.6rem;
}

.custom-modal-architect-content .custom-modal-content-right::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background-color: var(--orange);
}

.custom-modal-architect-content .custom-modal-name-heading {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 4.5rem;
  font-weight: 400;
  line-height: 5.2rem;
  letter-spacing: 1.4px;
  margin-bottom: 3rem;
}

.custom-modal-architect-content p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
}

.custom-modal-architect-content p:not(:last-of-type) {
  margin-bottom: 2.8rem;
}

.custom-modal-architect-content .close-modal {
  position: absolute;
  top: -3.5rem;
  right: -3.5rem;
  width: 7.5rem;
  height: 7.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 1;
  border-radius: 50%;
  z-index: 9;
  background-color: var(--black-100);
  box-shadow: 0px 0px 40px 0px rgba(0, 0, 0, 0.4);
  cursor: pointer;
  transition: var(--transition);
}

.custom-modal-architect-content .close-modal span {
  color: var(--white);
  font-size: 1.7rem;
  transition: var(--transition);
}

.custom-modal-architect-content .close-modal:hover {
  background-color: var(--orange);
}

.custom-modal-architect-content .close-modal:hover span {
  color: var(--white);
}

.architecturural-info {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 3rem;
  height: 20rem;
  overflow-y: auto;
  scrollbar-color: #f7941d rgba(255, 255, 255, 0.8);
  scrollbar-width: thin;
}

.architecturural-info::-webkit-scrollbar {
  width: 0.6rem;
}

.architecturural-info::-webkit-scrollbar-thumb {
  border-radius: 1rem;
  background-color: var(--orange);
}

.architecturural-info.four-col .custom-modal-list-wrap {
  width: calc(25% - 0.8rem);
}

.custom-modal-list-wrap {
  width: calc(33% - 0.8rem);
}

.custom-modal-list-name-wrap {
  border-bottom: 0.1rem solid #d9d9d9;
  padding-bottom: 0.8rem;
}

.custom-modal-list-names {
  color: var(--orange);
  font-family: var(--primary-font);
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 2.8rem;
  padding-bottom: 0.8rem;
  border-bottom: 0.1rem solid #d9d9d9;
}

.custom-modal-list {
  padding-top: 1.4rem;
}

.custom-modal-list li {
  color: var(--black-100);
  font-family: var(--number-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 4.4rem;
  list-style-type: disc;
}

.custom-modal-list li::marker {
  margin-right: 10px;
}

/* Our Architect Area Style End */

/* Gallery Area Style Start */
.gallery-area {
  padding: 12rem 0 11.7rem;
}

.gallery-area .project-tab-buttons {
  margin-bottom: 9rem;
}

.gallery-area .project-tab-buttons li a {
  padding: 0.5rem 6rem;
}

.grid {
  max-width: 173.6rem;
  overflow: hidden;
  margin: 0 -1.5rem;
}

.grid-sizer,
.grid-item {
  width: 33.33333333%;
  padding: 0 1.5rem;
}

.grid-item {
  height: auto;
  float: left;
  position: relative;
  overflow: hidden;
  margin-bottom: 3rem;
}

.overlay-text-wrap {
  position: absolute;
  bottom: -100%;
  right: 0;
  width: 100%;
  background: rgba(7, 28, 53, 0.8);
  padding: 2rem 3.5rem;
  transition: var(--transition);
}

.grid-item:hover .overlay-text-wrap {
  bottom: 0;
}

.overlay-text {
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 2.8rem;
  text-align: center;
}

.youtube-container {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4rem;
}

.youtube-item {
  width: calc(33% - 2.2rem);
  height: 31.1rem;
}

.youtube-item .youtube-popup-items {
  height: 100%;
}

.project-link {
  position: absolute;
  right: 1.1rem;
  top: 1.1rem;
  background-color: var(--white);
  border-radius: 50%;
  height: 4.8rem;
  width: 4.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.project-link span {
  font-size: 2rem;
  color: var(--black-100);
}

.project-link:hover span {
  color: var(--orange);
}

/* Gallery Area Style End */

/* Blog Area Style Start */
.blog-list-top-area {
  padding: 12rem 0;
  background: var(--gray-400);
}

.blog-list-top-area-wrap {
  position: relative;
}

.blog-list-top-area-wrap .swiper-button-next {
  right: 7rem;
}

.blog-list-top-area-wrap .swiper-button-prev {
  left: 7rem;
}

.blog-list-top-area .latest-items {
  display: flex;
  align-items: flex-start;
  gap: 8rem;
  margin-bottom: 0;
}

.featured-image-wrap {
  position: relative;
}

.featured-image-text {
  position: absolute;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.9rem 4.5rem 0.9rem 2rem;
  z-index: 0;
}

.featured-image-text::after {
  content: "";
  position: absolute;
  top: -0.2rem;
  left: -0.2rem;
  clip-path: polygon(0 0, 100% 0, 78% 100%, 0% 100%);
  width: 100%;
  height: 100%;
  background: var(--gray-400);
  z-index: -1;
}

.featured-image-text span {
  display: inline-block;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 2rem;
  font-weight: 700;
  line-height: 2.6rem;
}

.blog-list-top-area .latest-items-images {
  width: 100%;
  max-width: 65.7rem;
  height: 32.8rem;
  position: relative;
}

.blog-list-top-area .blog-text-area {
  padding-top: 0;
  width: calc(100% - 73.7rem);
}

.blog-list-top-area .blog-text-area p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.8rem;
}

.blog-list-top-area .latest-items-text {
  margin-bottom: 3rem;
}

.latest-blog {
  padding: 12rem 0 11rem;
}

.latest-blog .row {
  margin: 0 -2rem;
}

.latest-col {
  padding: 0 2rem;
}

.alm-listing {
  margin: 0 -2rem;
  display: flex;
  flex-wrap: wrap;
  padding: 0;
}

.latest-items {
  margin-bottom: 6.6rem;
}

.latest-items-images {
  width: 100%;
  height: 42.4rem;
  overflow: hidden;
  position: relative;
}

.latest-items-images img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: var(--transition);
}

.latest-items:hover img {
  transform: scale(1.2);
}

.blog-text-area {
  padding-top: 3rem;
}

.blog-badge {
  display: inline-block;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.8rem;
  letter-spacing: 0.6px;
  padding: 0.2rem 1.3rem;
  text-transform: uppercase;
  border-radius: 0.2rem;
  background: #ffe6c8;
  margin-bottom: 1.5rem;
  transition: 0.6s;
}

.blog-badge:hover,
.related-items .blog-badge:hover,
.semibanner-area.blog-deatils-banner-area .blog-badge:hover {
  background-color: var(--black);
  color: var(--gray-100);
}

.date-name-info {
  display: flex;
  align-items: center;
  gap: 1.8rem;
  margin-bottom: 1rem;
}

.date-name-info time {
  display: inline-block;
  color: var(--gray-200);
  font-family: var(--Secondary-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.8rem;
  letter-spacing: 0.54px;
}

.date-name-info .icon-back-tick {
  color: var(--orange);
  font-size: 1.8rem;
}

.date-name-info .bloger-name {
  display: inline-block;
  color: var(--gray-200);
  font-family: var(--Secondary-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.8rem;
  letter-spacing: 0.54px;
}

.latest-items-text {
  display: inline-block;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 3.8rem;
  transition: var(--transition);
}

.latest-items:hover .latest-items-text {
  color: var(--orange);
}

.latest-blog .btn-primary {
  padding: 0.5rem 3.8rem;
  margin: 3.4rem auto 0;
  background-color: var(--black-100);
  color: var(--white);
  font-size: 1.2rem;
}

.latest-blog .btn-primary:hover {
  border-color: var(--orange);
  background-color: var(--orange);
}

.alm-btn-wrap {
  padding: 0 !important;
  margin: 0 !important;
}

/* Blog Area Style End */

/* Contact Area Style Start */
.contact-area {
  padding: 12rem 0 11rem;
  background-color: #f8f9fb;
}

.contact-area-inner {
  background-color: #fff;
  box-shadow: 0px 0px 50px 0px rgba(0, 0, 0, 0.03);
  padding: 6rem 14rem;
}

.contact-area .common-header p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
  margin-bottom: 2rem;
}

.contact-area .common-header p a {
  color: var(--black-100);
  transition: var(--transition);
}

.contact-area .common-header p a:hover {
  color: var(--orange);
}

.contact-area .common-header {
  margin-bottom: 11rem;
}

.contact-area .common-header .search-content {
  max-width: 35rem;
  width: 100%;
  position: relative;
  transform: none;
  left: 0;
  bottom: 0;
  border-radius: 0;
  padding: 0;
  margin-bottom: 0;
  margin-top: 5rem;
}

.contact-area .common-header .search-content .form-block,
.contact-area .common-header .search-content .form-group {
  width: 100%;
}

.contact-area .common-header .search-content .formcontrol-select {
  padding: 1rem 3rem;
}

.contact-area .form-box {
  max-width: 100% !important;
}

.contact-form-wrap .form-group {
  position: relative;
  padding: 0;
  margin-bottom: 7rem;
}

.contact-form-label,
.contact-form-label sup {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.5rem;
  font-weight: 400;
  line-height: 3.8rem;
}

.contact-form-label sup {
  color: #ff0000;
  top: 0;
}

.contact-form-wrap .form-box .form-group i {
  position: absolute;
  top: 0.8rem;
  transform: none;
  right: 0;
  color: var(--black-100);
  font-size: 2.6rem;
  pointer-events: none;
}

.contact-form-wrap .form-box .form-group .formcontrol {
  height: 5rem;
  border-bottom: 0.1rem solid #9393933c;
  font-size: 2rem !important;
  font-weight: 400;
  line-height: 3rem;
}

.contact-form-wrap .form-box .form-group .checkbox-wrapper span {
  font-size: 1.8rem;
  line-height: 2.8rem;
  color: var(--black-100);
}

.contact-form-wrap .form-box .btn-secondary {
  min-width: 17.1rem;
  padding: 0.5rem 1.7rem;
  margin: 10.6rem auto 0;
}

.contact-form-wrap .form-box .btn-secondary.verify-btn {
  width: fit-content !important;
  font-family: var(--primary-font);
  color: var(--white);
  text-transform: uppercase;
  background-color: var(--black-100);
  letter-spacing: 1px;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 1.8rem;
  border-radius: 0.2rem;
  border: none;
  transition: var(--transition);
  margin: 1rem 0 !important;
}

.intl-tel-input input {
  font-family: var(--number-font) !important;
}

.verify-input p {
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 3rem;
}

.verify-input p span {
  color: #dc3232;
  font-size: 1.6rem;
}

.verify-input p sup {
  color: #ff0000;
  top: 0;
}

.verify-input p input {
  font-family: var(--primary-font);
  color: var(--black-100);
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 2rem;
  padding-left: 2rem;
  padding-right: 4rem;
  border-radius: 2px;
  height: 3rem;
  border: none;
  border-bottom: 0.1rem solid #9393933c;
}

.verify-input p input:focus {
  outline: none;
  box-shadow: none;
  border-color: var(--orange) !important;
}

.main-footer.contact-footer .contact-wrapper {
  padding: 0;
}

.main-footer.contact-footer .contact-wrapper .container {
  max-width: 100%;
  padding: 0;
}

.main-footer.contact-footer .contact-wrap {
  padding: 5.5rem 0;
}

.footer-map-area {
  width: 50%;
  height: 57rem;
  position: relative;
}

.footer-map-area::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 14rem;
  height: 100%;
  background: linear-gradient(270deg,
      rgba(7, 28, 53, 0.15) 0%,
      rgba(7, 28, 53, 0) 21.33%);
}

/* Contact Area Style End */

/* Award Area Style Start */
.award-page-area {
  padding: 10rem 0 16rem;
}

.award-page-area .award-image img {
  display: block;
  width: auto;
  height: 100%;
  margin: 0 auto;
}

.award-area-wrap {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 10rem 6.4rem;
}

.award-area-wrap .slide-box {
  width: calc(25% - 4.8rem);
}

.award-slide-box {
  position: relative;
}

.semibanner-area.filter-semi-banner .semibanner-text-heading {
  margin-bottom: 2.8rem;
}

.semibanner-area.filter-semi-banner .search-content {
  position: relative;
  max-width: 40rem;
  width: 100%;
  margin: 0 auto 15rem;
  bottom: 0;
  left: 0;
  transform: none;
  padding: 0;
}

.semibanner-area.filter-semi-banner .search-content .form-block,
.semibanner-area.filter-semi-banner .search-content .form-group {
  width: 100%;
}

.semibanner-area.filter-semi-banner .search-content .form-group .formcontrol-select {
  padding: 1rem 2.2rem;
  padding-right: 4rem;
  font-weight: 700;
}

.semibanner-area.filter-semi-banner .search-content .form-group .formcontrol-select .list {
  max-height: 14rem;
}

.award-page-area .load-more-wrap,
.award-page-area .load-more-btn {
  position: relative;
}

.load-more-btn.loading::before {
  background-color: rgba(0, 0, 0, 0);
  background-image: url(../images/ajax-loader-lg.gif);
  background-position: 50%;
  background-size: 25px 25px;
  height: 100%;
  left: 0;
  margin: 0;
  top: 0;
  width: 100%;
  border-radius: 3px;
  content: "";
  display: inline-block;
  overflow: hidden;
  position: absolute;
  transition: width 0.5s ease-in-out;
  z-index: 0;
  /* background: #fff
    url(<?phpechoget_stylesheet_directory_uri();?>/assets/images/ajax-loader-lg.gif)
    no-repeat 50%; */

  background: #fff url(../images/ajax-loader-lg.gif) no-repeat 50%;
}

.load-more-btn:disabled {
  opacity: 0.15 !important;
}

.load-more-btn:disabled:hover {
  background-color: transparent !important;
  border: 0.1rem solid var(--black-100) !important;
  color: var(--black) !important;
}

/* Award Area Style Start */

.load-more-btn {
  position: relative;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: fit-content !important;
  min-height: 5rem !important;
  padding: 0.5rem 1.8rem !important;
  font-family: var(--primary-font) !important;
  color: var(--black) !important;
  text-transform: uppercase !important;
  background-color: transparent !important;
  letter-spacing: 1px !important;
  font-size: 1.8rem !important;
  font-weight: 700 !important;
  line-height: 1.8rem !important;
  border-radius: 0.2rem !important;
  margin: 5rem auto 0 !important;
  border: 0.1rem solid var(--black-100) !important;
  transition: var(--transition) !important;
}

.load-more-btn:hover,
.load-more-btn:focus {
  color: var(--white) !important;
  outline: none !important;
  box-shadow: none !important;
  border-color: var(--black-100) !important;
  background-color: var(--black-100) !important;
}

.load-more-btn.loading {
  border-color: var(--white) !important;
  background-color: var(--white) !important;
}

.load-more-btn.loading:hover,
.load-more-btn.loading:focus {
  border-color: var(--white) !important;
  background-color: var(--white) !important;
}

/* Blog Details Area Style End */
.semibanner-area.blog-deatils-banner-area {
  min-height: 96.5rem;
}

.semibanner-area.blog-deatils-banner-area .blog-text-area {
  padding-top: 0;
}

.semibanner-area.blog-deatils-banner-area .blog-badge {
  display: block;
  width: fit-content;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.8rem;
  letter-spacing: 1px;
  padding: 0.4rem 1.7rem;
  text-transform: uppercase;
  border-radius: 0.2rem;
  background: var(--orange);
  margin-bottom: 1.4rem;
  transition: 0.6s;
}

.semibanner-area.blog-deatils-banner-area .date-name-info {
  display: flex;
  align-items: center;
  gap: 2.3rem;
  width: fit-content;
  background: white;
  padding: 1.8rem 4.2rem;
  margin: 0;
  margin-bottom: -1.6rem;
  border-radius: 0.2rem;
}

.semibanner-area.blog-deatils-banner-area .date-name-info time {
  display: inline-block;
  color: var(--orange);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.8rem;
  letter-spacing: 1px;
}

.semibanner-area.blog-deatils-banner-area .date-name-info .icon-back-tick {
  color: var(--orange);
  font-size: 1.8rem;
}

.semibanner-area.blog-deatils-banner-area .date-name-info .bloger-name {
  display: inline-block;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.8rem;
  letter-spacing: 1px;
}

.semibanner-area.blog-deatils-banner-area .latest-items-text {
  display: inline-block;
  color: var(--white);
  font-family: var(--Secondary-font);
  font-size: 4.6rem;
  font-weight: 400;
  line-height: 5.2rem;
  margin-bottom: 1.8rem;
}

.news-details-area {
  padding-top: 12rem;
}

.news-details-area .row {
  margin: 0 -2rem;
}

.news-details-area .row .col-md-8,
.news-details-area .row .col-md-4 {
  padding: 0 2rem;
}

.main-content-area h1,
.main-content-area h2,
.main-content-area h3,
.main-content-area h4,
.main-content-area h5,
.main-content-area h6 {
  font-family: var(--Secondary-font);
  color: var(--black);
  font-size: 2.7rem;
  font-weight: 400;
  line-height: 3.3rem;
  margin-bottom: 2rem;
}

.main-content-area h2 {
  font-size: 2.5rem;
}

.main-content-area h3 {
  font-size: 2.3rem;
  line-height: 3rem;
}

.main-content-area h4 {
  font-size: 2.1rem;
  line-height: 2.7rem;
}

.main-content-area h5 {
  font-size: 1.9rem;
  line-height: 2.5rem;
}

.main-content-area h6 {
  font-size: 1.7rem;
  line-height: 2.3rem;
}

.main-content-area p {
  font-family: var(--primary-font);
  color: var(--black-100);
  font-size: 2rem;
  font-weight: 400;
  line-height: 2.8rem;
  margin-bottom: 3rem;
}

.main-content-area ul,
.main-content-area ol {
  margin-bottom: 3rem;
}

.main-content-area ul li,
.main-content-area ol li {
  font-family: var(--primary-font);
  padding-left: 3.2rem;
  position: relative;
  color: var(--black-100);
  font-size: 2rem;
  font-weight: 400;
  line-height: 2.8rem;
  margin-bottom: 1.2rem;
}

.main-content-area ul li a,
.main-content-area ol li a,
.main-content-area p a {
  color: var(--black);
}

.main-content-area ul li a:hover,
.main-content-area ol li a:hover,
.main-content-area p a:hover {
  color: var(--orange);
}

.main-content-area ul li strong,
.main-content-area ol li strong {
  font-weight: 600;
}

.main-content-area ol {
  padding-left: 0 !important;
}

.main-content-area ol li {
  list-style-type: auto;
  padding-left: 0 !important;
}

.main-content-area ul li:before {
  content: "\e91e";
  font-family: "icomoon";
  position: absolute;
  top: 0.4rem;
  left: 0;
  font-size: 1.8rem;
  line-height: 1.8rem;
  color: var(--orange);
}

.blog-sub-content-items img {
  width: auto;
}

.relative-post-header {
  display: inline-block;
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 3.2rem;
  font-weight: 400;
  line-height: 3.8rem;
  margin-bottom: 2.8rem;
  text-transform: uppercase;
}

.related-items {
  display: flex;
  align-items: flex-start;
  gap: 2rem;
}

.related-items:not(:last-of-type) {
  padding-bottom: 2rem;
  margin-bottom: 2rem;
  border-bottom: 0.1rem solid var(--gray-300);
}

.related-image-wrap {
  display: block;
  width: 25.6rem;
}

.related-items .blog-text-area {
  padding: 0;
  width: calc(100% - 27.6rem);
}

.related-items .blog-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 1.2rem;
  letter-spacing: 0.6px;
  padding: 0.7rem 1.6rem;
  text-transform: uppercase;
  border-radius: 0.2rem;
  background: #ffe6c8;
  margin-bottom: 1.5rem;
}

.related-items .date-name-info {
  gap: 0.8rem;
}

.related-items .date-name-info time {
  font-size: 1.2rem;
  font-weight: 600;
  font-family: var(--primary-font);
}

.related-items .date-name-info .bloger-name {
  font-size: 1.2rem;
  font-weight: 500;
  font-family: var(--primary-font);
}

.related-items .date-name-info .icon-back-tick {
  color: var(--orange);
  font-size: 1.4rem;
}

.related-items .latest-items-text {
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 2.4rem;
}

.related-items .latest-items-text:hover {
  color: var(--orange);
}

.news-details-area .nav-links {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 0.1rem solid var(--gray-300);
  padding-top: 5.6rem;
  margin-top: 5rem;
  margin-bottom: 11.6rem;
}

.nav-previous a p,
.nav-next a p {
  display: flex;
  align-items: center;
  gap: 2rem;
  color: var(--gray-200);
  font-family: var(--primary-font);
  font-size: 2.2rem;
  font-weight: 400;
  line-height: 2.8rem;
  transition: var(--transition);
}

.nav-previous a:hover p,
.nav-next a:hover p {
  color: var(--black-100);
}

.nav-previous a p span,
.nav-next a p span {
  color: var(--gray-200);
  font-size: 2.3rem;
  transition: var(--transition);
}

.nav-previous a:hover p span,
.nav-next a:hover p span {
  color: var(--black-100);
}

/* Blog Details Area Style Start */

.semibanner-area.project-listing {
  overflow: visible;
}

.mfp-arrow-right::before {
  content: "\e90d";
  font-size: 4rem;
  color: var(--gray-300);
  font-family: "icomoon" !important;
  line-height: normal;
  margin: 0 !important;
  border: none !important;
  opacity: 1 !important;
}

.mfp-arrow-right::after {
  display: none !important;
}

.mfp-arrow-left::after {
  content: "\e909";
  left: 7rem;
  font-size: 4rem;
  color: var(--gray-300);
  font-family: "icomoon" !important;
  line-height: normal;
  margin: 0 !important;
  border: none !important;
  opacity: 1 !important;
}

.mfp-arrow-left::before {
  display: none !important;
}

.project-search-loop-inner-wrapper,
.post-search-loop-inner-wrapper {
  display: flex;
  align-items: flex-start;
  gap: 6.6rem 4rem;
  flex-wrap: wrap;
  margin-bottom: 10rem;
}

.post-search-loop-inner-wrapper {
  margin-bottom: 2rem;
}

.project-search-loop-inner-wrapper .project-items,
.post-search-loop-inner-wrapper .search-loop {
  width: calc(50% - 2rem);
}

.post-search-loop-inner-wrapper .search-loop .latest-items {
  margin: 0;
}

.com-hed-sm {
  color: var(--black-100);
  font-family: var(--Secondary-font);
  font-size: 2.5rem;
  font-weight: 500;
  line-height: 3rem;
  letter-spacing: 0.6px;
  margin-bottom: 4rem;
}

.no_result {
  width: 100%;
  display: inline-block;
  text-align: center;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 3.5rem;
  font-weight: 600;
  line-height: 4rem;
}

.error-404 {
  padding: 12rem 0;
  text-align: center;
  color: var(--black-100);
  font-family: var(--primary-font);
  font-size: 2.5rem;
  font-weight: 600;
  line-height: 3rem;
}

.back-to-home {
  margin: 5rem auto 0;
}

.back-to-home span {
  font-size: 1.2rem;
  font-weight: 600;
  margin-right: 1rem;
}

.footer__sticky__nav {
  list-style: none;
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 20;
  display: none;
}

.footer__sticky__nav li {
  position: relative;
  margin-bottom: 1rem;
}

.sticky__nav_icon {
  width: 6.7rem;
  height: 6.7rem;
  border-radius: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: #0059e1;
}

.sticky__nav_text {
  position: absolute;
  top: 50%;
  background-color: #0059e1;
  text-transform: uppercase;
  width: fit-content;
  display: flex;
  align-items: center;
  border-radius: 2.5rem;
  padding: 0 1.5rem;
  height: 3.8rem;
  color: #fff;
  letter-spacing: 0.54px;
  font-size: 1.8rem;
  font-family: var(--Secondary-font);
  white-space: nowrap;
  left: auto;
  right: 146%;
  transform: translate(25%, -50%);
  z-index: -1;
  opacity: 0;
  transition: 0.8s;
  visibility: hidden;
}

.sticky__nav_text::after {
  content: "";
  position: absolute;
  right: -13px;
  width: 0;
  height: 0;
  border-top: 8px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 16px solid #0059e1;
  top: 50%;
  transform: translateY(-50%);
}

.footer__sticky__nav li:hover .sticky__nav_text {
  opacity: 1;
  transform: translate(9%, -50%);
  visibility: visible;
}

.inner_com_content {
  padding: 10.2rem 0;
}

.custom-html-sitemap ul li a {
  color: var(--black);
}

.custom-html-sitemap ul li a:hover {
  color: var(--orange);
}

.sitemap_page {
  column-count: 3;
}

.sitemap_loop {
  margin-bottom: 7rem;
}

.sitemap_loop:last-child {
  margin-bottom: 0;
}

.form-group-inner {
  margin-bottom: 2rem;
}

.form-box .form-group-inner .btn-secondary {
  min-height: 4.4rem;
  padding-top: 0;
  padding-bottom: 0;
  margin: 0 !important;
  margin-left: auto !important;
}

.footer-contact-box .form-box .verify-input p input {
  border-bottom: none;
}

.nav-next {
  width: 50%;
  text-align: right;
  margin-left: auto;
  display: flex;
  justify-content: flex-end;
}

.floating-buttons {
  display: none;
  position: fixed;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 30;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding: 1rem;
  background: linear-gradient(0deg, #fff 0%, #fff 100%),
    linear-gradient(135deg, #dadada 100%, #f0f0f0 0%);
  box-shadow: 0px 0px 20px 0px rgba(168, 194, 191, 0.5);
}

.apply-btn,
.call-us-btn {
  width: 100%;
  max-width: 20rem;
  min-height: 4.4rem;
  background-color: var(--black-100);
  border: none;
  border-radius: 1.1rem;
  padding: 1rem 1.6rem;
  color: var(--white);
  font-family: var(--primary-font);
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 2.4rem;
  text-align: center;
  transition: var(--transition);
}

.apply-btn {
  background-color: var(--black-100);
}

.apply-btn:hover {
  background-color: var(--orange);
  color: var(--white);
}

.call-us-btn {
  background-color: var(--orange);
}

.call-us-btn:hover {
  background-color: var(--black-100);
  color: var(--white);
}

/* **************************** Thankyou Page ********************************** */
.page-wrapper {
  position: relative;
  height: 100vh;
  overflow: hidden;
}

.page-wrapper .content-block {
  position: relative;
  width: 100%;
  height: 100%;
}

.page-wrapper .shape-block {
  position: absolute;
  bottom: 0;
  right: 0;
  width: fit-content;
  height: 100%;
}

.page-wrapper .shape-block img,
.page-wrapper .shape-block svg {
  width: 100%;
  height: 100%;
}

.page-wrapper .container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
}

.page-wrapper .content-block .content-block-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
}

.thankyou-logo {
  display: inline-block;
  width: 100%;
  max-width: 40rem;
  margin-bottom: 6rem;
}

.thankyou-logo img,
.thankyou-logo svg {
  width: 100%;
  height: 100%;
}

.inner-content-text-heading {
  color: var(--orange);
  font-size: 19rem;
  line-height: 15rem;
  font-weight: 400;
  font-family: var(--Secondary-font);
  margin-bottom: 3rem;
}

.inner-content-text-heading span {
  color: #184f78;
}

.page-wrapper .content-block .icon-back-tick {
  display: inline-block;
  color: var(--orange);
  font-size: 2.4rem;
  margin-bottom: 5.2rem;
}

.user-name {
  font-family: var(--primary-font);
  color: var(--orange);
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 4.2rem;
  margin-bottom: 2.5rem;
}

.inner-content-text {
  font-family: var(--primary-font);
  font-size: 3rem;
  font-weight: 400;
  line-height: 3.4rem;
  color: #184f78;
  margin-bottom: 6.5rem;
}

.page-wrapper .content-block .btn-primary {
  background-color: #184f78;
  font-family: var(--primary-font);
  font-size: 18px;
  font-weight: 700;
  line-height: 18px;
  color: var(--white);
  letter-spacing: 0.9px;
  padding: 1.5rem 3.7rem;
  border: none;
  text-transform: uppercase;
  margin: 0 auto;
}

.page-wrapper .content-block .btn-primary:hover {
  background-color: var(--orange);
}