@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap");

@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Allison&display=swap");

@import url("https://fonts.googleapis.com/css2?family=Comfortaa:wght@300;400;500;600;700&display=swap");



:root {

  --darkblue: #060508;

  --purple: #181225;

  --orange: #f26a40;

  --lightorange: #f7f1f0;

  --lightyellow: #fadc6f;

}



body {

  color: #191919;

  font: 400 14px "Montserrat", sans-serif;

  overflow-x: hidden;

}



.body-overflow{

  overflow: hidden;

}



ul {

  padding-left: 0;

  margin-bottom: 0;

}



a:hover {

  text-decoration: none;

}



button:focus {

  outline: none;

}



img {

  width: 100%;

  display: block;

}



.container-fluid {

  padding-left: 40px;

  padding-right: 40px;

}



/* Landing page */

.landingpage{

  position: fixed;

  left: 0;

  top: 0;

  height: 100%;

  width: 100%;

  background: #fff;

  display: none;

  z-index: 999999999999999;

  transition: all 2s ease;

}



.landingpage.vanish{

  left: 101%;

  pointer-events: none;

}



.landing-section{

  width: 100%;

  height:100%;

  text-align: center;

  position: relative;

}



.skipBtn{

  position: absolute;

  right: 10px;

  top: 10px;

  display: inline-block;

  padding: 10px 20px;

  text-transform: uppercase;

  color: #fff;

  background: var(--purple);

  font-size: 13px;

  letter-spacing: 1px;

  cursor: pointer;

  transition: all 300ms ease-in-out;

  z-index: 9;

}



.skipBtn:hover{

  background: var(--orange);

  color: #fff;

  border-color: var(--orange);

}

.landing-img,

.landing-img video{

  position: absolute;

  width: 100%;

  height: 100%;

  left: 0;

  top: 0;

  z-index: 1;

}



.landing-img{

  transition: all 1s ease;

  

}

.landing-img video{

  object-fit: cover;

}



.landing-img.go{

  top: 100%;

}

/* Landing page */



/*header*/

.header {

  width: 100%;

  float: left;

  position: fixed;

  top: 0;

  padding:0 1%;

  z-index: 9999;

  transition:all 300ms ease-in-out;

}



.header .mainHeader{

	display:flex;

	align-items:center;

	justify-content: space-between;

}



.logo {

	width:210px;

	height:auto;

	margin: 5px 0;

	float: left;

	position: relative;

	min-height: 1px;

	transition:all 300ms ease-in-out;

}



.logo img{

	height:auto;

	transition:all 300ms ease-in-out;

}



.apralogo{

	width:140px;

	transition:all 300ms ease-in-out;

}



.header .mainHeader .navi > ul{

	display:flex;

	align-items:center;

}



.header .mainHeader .navi > ul > li{

	margin:0 2px;

	position:relative;

}



.header .mainHeader .navi > ul > li > a{

	color:#fff;

	padding:10px 14px;

	font-size:15px;

	text-transform:uppercase;

	font-weight:500;

	display:flex;

	align-items:center;

	justify-content:center;

	transition:all 300ms ease-in-out;

	position:relative;

	z-index:1;

}



.header .mainHeader .navi > ul > li:hover > a{

	color:#ee3338;

}



.header .mainHeader .navi > ul > li > a::before{

	content:'';

	position:absolute;

	left:0;

	top:0;

	width:100%;

	height:100%;

	background:#fff;

	transform:scaleY(0);

	transition:all 300ms ease-in-out;

	border-radius:4px;

	z-index:-1;

}



.header .mainHeader .navi > ul > li:hover > a::before{

	transform:scaleY(1);

}



.header .mainHeader .navi > ul > li.crmBtn a{

	padding:10px 15px;

	background:#bda588;

	color:#000;

	border-radius:5px;

	font-size:13px;

	font-weight:500;

}



.header .mainHeader .navi > ul > li.crmBtn a:hover{

	background:#fff;

}



.header .mainHeader .navi > ul > li.crmBtn a:before{

	display:none;

}



.header .mainHeader .navi > ul li a i{

	margin-left:5px;

	font-size:12px;

	transition:all 300ms ease-in-out;

}



.header .mainHeader .navi > ul li:hover > a i{

	transform:rotate(180deg);

}



.header .mainHeader .navi ul li .dropdown{

	position:absolute;

	width:260px;

	padding-top:13px;

	left:calc(50% - 130px);

	z-index:2;

	opacity:0;

	visibility:hidden;

	transform:translateY(30px);

	transition:all 300ms ease-in-out;

	pointer-events:none;

}



.header .mainHeader .navi ul li:hover .dropdown{

	opacity:1;

	visibility:visible;

	transform:translateY(0);

	pointer-events:auto;

}



.header .mainHeader .navi ul li .dropdown ul{

	width:100%;

	float:left;

	padding:5px 20px;

	background:#f36e47;

	border-radius:5px;

	box-shadow:1rem 1rem 3rem rgba(0,0,0,0.16);

	position:relative;

}



.header .mainHeader .navi ul li .dropdown ul li{

	width:100%;

	float:left;

}



.header .mainHeader .navi ul li .dropdown ul li a{

	display:block;

	padding:15px 0;

	color:#fff;

	border-bottom:1px solid rgba(0,0,0,0.19);

	transition:all 300ms ease;

	text-align:center;

	letter-spacing:2px;

	text-transform: uppercase;

    font-size: 12px;

}



.header .mainHeader .navi ul li .dropdown ul li:last-child a{

	border-bottom:none;

}



.header .mainHeader .navi ul li .dropdown ul li:hover a{

	letter-spacing:0px;

	font-weight:600;

}



.filter-white{

	filter:brightness(50);

}



.filter-invert{

	filter:invert(1);

}



.header.fixed{

	background:#000;

  border-bottom: 1px solid rgba(255,255,255,0.08);

}



.header.fixed .logo{

	width: 130px;

    height: 50px;

    overflow: hidden;

}



.header.fixed .logo img{

	width:124px;

}



.header.fixed .apralogo{

	width:60px;

}



.header.fixed .navi ul li a{

	font-size:12px;

	letter-spacing:normal;

	padding:6px 10px;

}



.header.fixed .navi ul li a img{

	width:40px;

}



.menuBtn{

	width:60px;

	float:left;

	cursor:pointer;

	overflow:hidden;

	display: none;

  align-items: center;

	justify-content:center;

	transition:all 300ms ease-in-out;

}



.menuBtn div{

	position:relative;

	width:50px;

	display:inline-block;

	vertical-align:middle;

	border-radius:50%;

	transition:all 300ms ease-in-out;

}



.menuBtn div::before{

  content: 'Menu';

  color: #fff;

  text-transform: uppercase;

  text-align: center;

  font-size: 12px;

  width: 100%;

  display: block;

  letter-spacing: 2px;

}



.menuBtn.closeMenuBtn div::before{

  content: 'Close';

  margin-bottom: 4px;

}



.menuBtn span{

	width:100%;

	height:1px;

	float:right;

	background:#fff;

	margin:5px 0;

	position:relative;

	right:0;

	-webkit-transition:400ms ease-in-out all;

	transition:400ms ease-in-out all;

}



.menuBtn.closeMenuBtn span#menuLine1{

	-webkit-transform:rotate(45deg) translate(12px, 4px);

	transform:rotate(45deg) translate(12px, 4px);

}



.menuBtn.closeMenuBtn span#menuLine2{

	-webkit-transform:rotate(-45deg) translate(-5px, -5px);

	transform:rotate(-45deg) translate(-5px, -5px);

}



.mbMenuContainer{

	position:fixed;

	left:0;

	right:0;

	top:0;

	bottom:0;

	z-index:999;

	display:none;

}



.mbMenuContainer .mbMenu{

	position:relative;

	height:100%;

	width:100%;

	padding:10px 0;

	margin-right:-1px;

	overflow:auto;

	display:flex;

	justify-content:center;

	align-items:center;

  flex-direction: column;

	background: rgb(0 0 0 / 90%);

  backdrop-filter: blur(10px);

}



.mbMenuContainer .mbMenu ul{

	margin:0;

}



.mbMenuContainer .mbMenu ul li{

	padding:15px 0;

}



.mbMenuContainer .mbMenu .mblist > ul > li > a{

	display:flex;

	align-items:center;

  justify-content: center;

	color:#fff;

	transition:all 300ms ease-in-out;

  font-size: 7vw;

  font-weight: 100;

  letter-spacing: 2vw;

  text-transform: uppercase;

}



.mbMenuContainer .mbMenu .mblist > ul > li:hover > a,

.mbMenuContainer .mbMenu .mblist > ul li a:focus{

    color: var(--orange);

}



.mbMenuContainer .mbMenu ul li.hasChild a i{

	font-size: 15px;

  margin-left: 18px;

  width: 30px;

  height: 30px;

  line-height: 30px;

  background: var(--orange);

  border-radius: 50%;

  color: #000;

  text-align: center;

  letter-spacing: normal;

}



.mbMenuContainer .mbMenu ul .dropdown{

	display:none;

}



.mbMenuContainer .mbMenu ul .dropdown ul{

	padding:4px 20px;

  background: var(--orange);

}



.mbMenuContainer .mbMenu ul .dropdown ul li{

	padding:0;

	display:block;

}



.mbMenuContainer .mbMenu ul .dropdown ul li a{

	font-weight: 500;

  font-size: 19px;

	padding:16px 0;

	letter-spacing: 3px;

	display:block;

  text-align: center;

  color: #000;

  border-bottom: 1px dashed rgb(0 0 0 / 11%);

  text-transform: uppercase;

  transition: all 300ms ease;

}



.mbMenuContainer .mbMenu ul .dropdown ul li:last-child a{

  border-bottom: none;

}



.mbMenuContainer .mbMenu ul .dropdown ul li a:hover{

	color:#fff;

}



.mbMenuContainer .mbMenu .socialOne{

  width: 90%;

}



.mbMenuContainer .mbMenu .socialOne ul{

  margin-top: 20px;

	padding-top:20px;

  border-top: 1px solid rgb(255 255 255 / 10%);

  display: flex;

  justify-content: center;

}



.mbMenuContainer .mbMenu .socialOne ul li{

	display:block;

  padding:0 15px;

}



.mbMenuContainer .mbMenu .socialOne ul li a{

  color: var(--orange);

	justify-content:center;

	padding:5px;

}



.mbMenuContainer .mbMenu .socialOne ul li a:hover{

	color:#fff;

}



.mbMenuContainer .mbMenu .socialOne ul li a i{

	font-size:14px;

	text-align:center;

}

/*header*/



#banner {

  height: 100vh;

  position: relative;

  background: #000;

  z-index: 1;

}



#banner .carousel-inner,

#banner .carousel-inner .carousel-item {

  position: relative;

  height: 100%;

}



#banner .carousel-inner .carousel-item {

  background: center no-repeat #757c89;

  background-size: cover;

  background-blend-mode: overlay;

  transition-duration: 1s;

  z-index: 1;

}



#banner .carousel-inner .carousel-item::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  /* background: rgba(7, 33, 79, 0.4); */

  z-index: -1;

}



#banner .carousel-inner .carousel-item.no-overlay::before {

  display:none;

}



.carousel-item section {

  display: flex;

  align-items: center;

  justify-content: center;

  height: 100%;

  position: relative;

  z-index: 1;

}



.bannerText {

  text-align: center;

  z-index: 9;

  color: #fff;

  transition: all 400ms ease-in-out;

  transform: translateY(50px);

  text-shadow: 1px 1px 1px #000;

  opacity: 0;

}



.carousel-item.active .bannerText {

  transform: translateY(0px);

  opacity: 1;

}



.banner-projectname {

  font-weight: 100;

  font-size: 2vw;

  margin-bottom: 5px;

  letter-spacing: 2vw;

}



.bannerText h2 {

  font-weight: 100;

  font-size: 6vw;

  font-family: "Allison", cursive;

  letter-spacing: 2px;

  margin-bottom: 5px;

  text-transform: capitalize;

}



.bannerText p {

  font-weight: 200;

  margin-bottom: 0;

  letter-spacing: 1vw;

  font-size: 1.6vw;

  text-transform: uppercase;

}



.scrollDown {

  position: absolute;

  left: calc(50% - 20px);

  bottom: 20px;

  width: 40px;

  cursor: pointer;

  z-index: 9;

  animation: jump 1s ease-in-out infinite;

}



@keyframes jump {

  50% {

    transform: translateY(5px);

  }

}



a.carousel-control-next[href="#banner"],

a.carousel-control-prev[href="#banner"] {

  top: 50%;

  bottom: auto;

  height: 40px;

  width: 40px;

  left: auto;

  right: 10px;

  border: 1px solid rgba(0, 0, 0, 0.3);

  filter: invert(1);

  opacity: 1;

  transition: all 300ms ease-in-out;

}



a.carousel-control-next[href="#banner"]:hover,

a.carousel-control-prev[href="#banner"]:hover {

  filter: invert(0);

  background-color: var(--orange);

  border-color: var(--orange);

}



a.carousel-control-prev[href="#banner"] {

  margin-top: -25px;

}



a.carousel-control-next[href="#banner"] {

  margin-top: 25px;

}



.carousel-control-prev-icon {

  background-image: url(../images/arrow-left.png);

  width: 30px;

  height: 30px;

}



.carousel-control-next-icon {

  background-image: url(../images/arrow-right.png);

  width: 30px;

  height: 30px;

}



.banner-logo {

  position: absolute;

  right: 10px;

  bottom: 20px;

  z-index: 1;

  display: flex;

  align-items: flex-end;

}



.banner-logo img {

  width: 50%;

}



.banner-logo img[alt="apra"] {

  width: auto;

  height: 120px;

  margin-left: 10px;

}



p {

  font-weight: 400;

  line-height: 1.5;

}



p > a {

  color: #bda588;

  font-weight: 500;

}

p > a:hover {

  color: #000;

}



.padding {

  padding-top: 4rem;

  padding-bottom: 4rem;

}



.padding-sm {

  padding-top: 40px;

  padding-bottom: 40px;

}



.heading {

  display: table;

  position: relative;

  margin: 0 auto 40px;

  z-index: 1;

}



.heading h6 {

	color:#191919;

	text-transform:uppercase;

	position:relative;

	padding-left:70px;

	margin-bottom:0px;

}



.heading h6::before{

	content:'';

	position:absolute;

	left:0px;

	top:calc(50% - 1px);

	width:60px;

	height:1px;

	background:#191919;

	z-index:-1;

}



.heading h6.text-white::before{

	background:#fff;

}



.heading h2,

.heading h4,

.heading h5 {

  display: table;

  font-weight: 200;

  color: #000;

}



.heading h2 {

  font-size: 3.5rem;

  text-transform: uppercase;

  letter-spacing: 10px;

}



.heading h4 {

  font-size: 2rem;

}



.heading h5 {

  font: 400 1.4rem "DM Serif Display", serif;

}



.bg-darkblue {

  background-color: var(--darkblue);

}

.bg-purple {

  background-color: var(--purple);

}

.bg-light-orange {

  background-color: var(--lightorange);

}

.bg-orange{background-color: var(--orange);}



.bg-image {

  background: center no-repeat fixed;

  background-size: cover;

  position: relative;

  z-index: 1;

}



.bg-image::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

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

  z-index: -1;

}



.text-serif {

  font-family: "DM Serif Display", serif;

}

.text-cursive {

  font-family: "Allison", cursive;

}



.text-orange{color: var(--orange) !important;}

.text-lightyellow{color: var(--lightyellow) !important;}



.swiper-pagination-bullet {

  transition: all 300ms ease-in-out;

}



.swiper-pagination {

  bottom: 0;

}



.swiper-pagination-bullet-active {

  width: 20px;

  border-radius: 10px;

  background-color: var(--orange);

}



.viewmore{

	float:left;

	width:100%;

	margin-top:30px;

}



.viewmore a{

	position:relative;

	display:flex;

	color:#ee3338;

	align-items:center;

	font-weight:600;

	transition:all 300ms ease-in-out;

}



.viewmore a span{

	margin:0 5px;

}



.viewmore a::before,

.viewmore a::after{

	content:'';

	height:11px;

	width:30px;

	background:url(../images/next.png) center no-repeat;

	background-size:100% 100%;

	transition:all 300ms ease-in-out;

}



.viewmore a::before{

	width:0;

	opacity:0;

}



.viewmore a:hover{

	color:#000;

}



.viewmore a:hover::before{

	opacity:1;

	width:30px;

}



.viewmore a:hover::after{

	opacity:0;

	width:0;

}

.viewmore.white a::before,

.viewmore.white a::after{background-image:url(../images/next-w.png);}

.viewmore.white a:hover{color:#fff;}



.readmore {

  width: max-content;

  display: inline-block;

  margin-top: 20px;

}



.readmore a, .readmore button {

  display: inline-block;

  text-align: center;

  padding: 12px 15px;

  min-width: 120px;

  border: 1px dotted rgb(0 0 0 / 34%);

  background: none;

  color: #000;

  font-size: 12px;

  letter-spacing: 1px;

  text-transform: uppercase;

  transition: all 300ms ease-in-out;

}



.readmore.white a, .readmore.white button {

  color: #fff;

  border-color: rgb(255 255 255 / 30%);

}



.readmore a:hover, .readmore button:hover {

  color: #fff;

  background-color: var(--orange);

  border-color: transparent;

}



.viewarrow {

  display: inline-block;

  margin-top: 20px;

}



.viewarrow a {

  color: inherit;

  font-size: 24px;

  padding-right: 20px;

  transition: all 300ms ease-in-out;

}



.viewarrow a:hover {

  color: var(--orange);

  padding-left: 10px;

}



.hm-overviewText h2 {

  font-family: "Comfortaa", cursive;

  font-weight: 300;

  margin-bottom: 60px;

  line-height: 1.5;

}



.hm-overviewText p {

  margin-bottom: 0;

  font-size: 16px;

  line-height: 1.8;

}



.hm-overviewImg section {

  position: relative;

}



#overviewSlider {

  width: 60%;

}



.statsContainer {

  position: absolute;

  width: 50%;

  left: 50%;

  top: 50%;

  transform: translateY(-50%);

  z-index: 1;

}



.statsContainer li {

  width: 100%;

  float: left;

  margin: 3px 0;

}



.statsContainer li > div {

  padding: 20px;

  background-color: #fff;

  box-shadow: -10px 10px 30px rgb(0 0 0 / 7%);

}



.statsContainer li h2 {

  font: 400 20px "Comfortaa", cursive;

  color: var(--orange);

}



.statsContainer li h2 .counter {

  font-size: 2.4rem;

  font-weight: 300;

  margin-right: 5px;

}



.statsContainer li h6 {

  margin-bottom: 0;

  text-transform: uppercase;

  font-size: 12px;

  letter-spacing: 4px;

}



.hm-projectContainer{

  position: relative;

  z-index: 1;

  overflow: hidden;

  background: var(--purple);

  color: #fff;

}



.hm-projectContainer .videoBox{

  -webkit-box-reflect: below 0px linear-gradient(transparent, transparent, rgba(0, 0, 0, 0.10));

}



.videoBox video {

  width: 100%;

  height: 100%;

  object-fit: cover;

  display: block;

}



.hm-projectWrapper .central-logo{

  width: 170px;

}



.hm-projectWrapper .hm-project-text h2{

  font-size: 3.5rem;

  margin-bottom: 20px;

}



.hm-projectWrapper .hm-project-text h5{

  font-weight: 300;

  line-height: 1.5;

  font-size: 18px;

  padding-right: 5%;

}



.hm-projectEverything{

  margin-top: 1rem;

}



.hm-project-icons{

  margin: 4rem 0;

  text-align: center;

}



.hm-project-icons ul, .proj-status ul{

  display: flex;

  justify-content: center;

}



.hm-project-icons ul li, .proj-status ul li{

  flex:1 0 0;

}

.hm-project-icons ul li{

  display: flex;

  justify-content: center;

}



.hm-project-icons ul li:first-child{

  justify-content: flex-start;

}



.hm-project-icons ul li:last-child{

  justify-content: flex-end;

}



.hm-project-icons ul li section{

  position: relative;

  z-index: 1;

  padding: 0 10px;

  font-size: 12px;

  text-transform: uppercase;

}



.hm-project-icons ul li section .img-fluid{

  width: 80px;

  padding: 10px;

  border-radius: 50%;

  border:1px solid rgb(255 255 255 / 10%);

  margin:0 auto 20px;

  position: relative;

}



.hm-project-icons ul li section .img-fluid::before,

.hm-project-icons ul li section .img-fluid::after{

  content: '';

  position: absolute;

  width: 100px;

  top: 48%;

  border-top: 1px solid #2e273c;

}

.hm-project-icons ul li section .img-fluid::before{

  left: 100%;

}

.hm-project-icons ul li section .img-fluid::after{

  right: 100%;

}



.hm-project-icons ul li:first-child section .img-fluid::after,

.hm-project-icons ul li:last-child section .img-fluid::before{

  display: none;

}



.proj-status{

  width: 100%;

  margin:0 auto;

  padding: 20px 0;

  border:1px solid rgb(255 255 255 / 10%);

}



.proj-status ul li{

  display: flex;

  justify-content: center;

  padding: 0 20px;

  border-right: 1px solid rgb(255 255 255 / 10%);

}



.proj-status ul li:last-child{

  border-right: none;

}



.proj-status ul li section{

  display: flex;

  text-align: left;

  align-items: center;

}



.proj-status ul li section .img-fluid{

  width: 50px;

  margin-right: 15px;

}



.proj-status ul li section article span{

  font-size: 11px;

  text-transform: uppercase;

  letter-spacing: 5px;

}



.proj-status ul li section article h4{

  font-weight: 300;

  letter-spacing: 1px;

}



.exploreAll{

  margin-top: 30px;

}



.exploreAll ul{display: flex;}



.exploreAll ul li{

  padding-right:20px;

}



.exploreAll ul li a{

  display: block;

  padding: 10px 25px;

  border-radius: 40px;

  color:#fff;

  border:1px solid rgb(255 255 255 / 10%);

  transition:all 300ms ease-in-out;

}



.exploreAll ul li a:hover{

  background: var(--orange);

  color: #fff;

  border-color: var(--orange);

}



.blogBox {

  height: auto;

}



.blogBox section {

  height: 100%;

  display: flex;

  flex-direction: column;

}



.blogBox section article {

  margin-top: 20px;

  height: 100%;

  padding: 20px;

  background: var(--lightorange);

  transition: all 300ms ease-in-out;

}



.blogBox section:hover article {

  background: #fff;

  box-shadow: 0 1rem 3rem rgb(0 0 0 / 12%);

  transform: translateY(-5px);

}



.blogBox section article h5 {

  margin-bottom: 20px;

  font-size: 16px;

  line-height: 1.5;

}



.blogBox section article h5 a {

  color: var(--orange);

  font-family: "Comfortaa", cursive;

  transition: all 300ms ease-in-out;

}



.blogBox section article h5 a:hover {

  color: #000;

}



.blogBox section article p {

  margin-bottom: 0;

}



.testimonials {

  min-height: 350px;

  padding: 4rem;

  border: 1px dashed #e2e2e2;

  display: flex;

  align-items: center;

  text-align: center;

  justify-content: center;

  position: relative;

  z-index: 1;

}



.testimonials::after {

  content: "";

  position: absolute;

  right: 10px;

  top: 0px;

  width: 100px;

  height: 100px;

  background: url(../images/icons/right-quote.png) center no-repeat;

  background-size: cover;

  z-index: -1;

  opacity: 0.05;

}



.testimBox {

  width: 80%;

  margin: 0 auto;

}



.testimBox p {

  font-weight: 300;

  font-size: 20px;

  font-style: italic;

  line-height: 1.5;

}



.testimBox .testimName {

  font: 300 2.4rem/1 "Allison", cursive;

  letter-spacing: 2px;

  margin-top: 30px;

  color: var(--orange);

}



.carousel-control-next,

.carousel-control-prev {

  width: 8%;

}



/*Footer*/

.footer-area {

  background: var(--purple);

  position: relative;

  z-index: 1;

}



.socialBox {

  width: 100%;

  padding: 10px 4px;

  background-color: var(--orange);

}



.socialBox ul {

  display: flex;

  justify-content: center;

}



.socialBox ul li {

  margin: 0 10px;

}



.socialBox ul li a {

  display: block;

  color: #181225;

  font-size: 16px;

  width: 50px;

  height: 50px;

  line-height: 50px;

  text-align: center;

  border-radius: 50%;

  transition: all 300ms ease-in-out;

  position: relative;

  z-index: 1;

}



.socialBox ul li a::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  border-radius: 50%;

  background-color: #181225;

  z-index: -1;

  transition: all 500ms cubic-bezier(0.11, 0.67, 0.03, 1.94);

  transform: scale(0);

}



.socialBox ul li a:hover::before {

  transform: scale(1);

}



.socialBox ul li a:hover {

  color: var(--orange);

}



.footerBox {

  color: #fff;

}



.footerBox h6 {

  font-size: 18px;

  font-weight: 400;

  text-transform: uppercase;

  letter-spacing: 1px;

  margin-bottom: 25px;

  color: var(--orange);

  position: relative;

}



.footerBox h6::after {

  content: "";

  display: table;

  width: 50px;

  margin-top: 10px;

  border-bottom: 1px solid var(--orange);

}



.footerBox ul li {

  float: left;

  width: 100%;

  margin-bottom: 10px;

}



.footerBox ul li a {

  color: #fff;

  transition: all 300ms ease-in-out;

  position: relative;

  font-size: 13px;

  font-weight: 300;

  padding: 5px 0;

}



.footerBox ul li a:hover {

  color: var(--orange);

}



.footer-area .bottom {

  display: flex;

  flex-wrap: wrap;

  justify-content: space-between;

  align-items: flex-end;

  padding: 5rem 0;

}



.footer-area .bottom ul {

  display: flex;

  align-items: center;

}



.membersBox, .rera, .copyright{

  flex:1 0 0;

}



.footer-area .bottom li {

  display: flex;

  padding: 0 15px;

  border-right: 1px solid rgb(255 255 255 / 30%);

}



.footer-area .bottom li:first-child {

  padding-left: 0;

}



.footer-area .bottom li:last-child {

  padding-right: 0;

  border-right: none;

}



.footer-area .membersBox h6 {

  color: #fff;

  font-size: 24px;

  letter-spacing: 2px;

  margin-bottom: 0;

  font-family: "Allison", cursive;

}



.footer-area .membersBox li img {

  width: auto;

  height: 30px;

}



.footer-area .membersBox li img[alt="Credai"] {

  height: 20px;

}



.footer-area .rera{

  justify-content: center;

}



.footer-area .copyright{

  justify-content: flex-end;

}



.footer-area .bottom p {

  color: #fff;

  display: flex;

  font-size: 10px;

  align-items: center;

  text-align: center;

  margin-bottom: 0;

  font-weight: 300;

}



.footer-area .bottom p img {

  width: 20px;

}



.button-top {

  background: var(--orange);

  position: fixed;

  cursor: pointer;

  left: calc(50% - 20px);

  bottom: 10px;

  color: #ffffff;

  font-size: 13px;

  opacity: 0;

  visibility: hidden;

  width: 40px;

  height: 40px;

  line-height: 40px;

  border-radius: 5px;

  text-align: center;

  transition: all 300ms ease-in-out;

  z-index: 99;

}



.button-top:hover {

  background: #f26a40;

}

/*Footer*/



.enqBtn{position: fixed; left: 20px; bottom: 20px; border-radius: 50%; border: none; outline: none; background-color: var(--orange); color: #fff; display: flex; justify-content: center; align-items: center; width: 60px; height: 60px; font-size: 24px; box-shadow: 0 3px 10px rgb(0 0 0 / 10%); z-index: 99;}

.enqBtn:hover{background-color: #f14b18;}



/* Inside Page */

.insideBanner{

	height: 80vh;

	position: relative;

	overflow: hidden;

	z-index: 1;

	display: flex;

	justify-content: center;

	align-items: center;

	text-align: center;

}



.insideBanner-img{

	width: 100%;

	height: 100%;

	position: absolute;

	top: 0;

	left: 0;

	z-index: -1;

	pointer-events: none;

	background: center no-repeat;

	background-size: cover;

}



.insideBanner-img::before{

	content: '';

	position: absolute;

	left: 0;

	right: 0;

	top: 0;

	bottom: 0;

}



.pageTitle .projectLogo{

	width: 200px;

	margin: 0 auto 20px;

}



.insideHeader{

  position: relative;

  z-index: 9;

  margin-top: -90px;

}



.pageMenu{

  display: flex;

	justify-content: space-between;

  align-items: flex-end;

	border-bottom: 1px solid rgba(0,0,0,0.08);

}



.insideHeader .projectLogo{

	width: 200px;

}



.pageMenu ul{

  flex-grow: 1;

	display: flex;

	justify-content: center;

}



.pageMenu ul li{

	flex:1 0 0;

}



.pageMenu ul li a{

	text-align: center;

	display: block;

	padding: 15px 10px;

	font-size: 11px;

	font-weight: 500;

	text-transform: uppercase;

	color: #000;

	transition: all 300ms ease-in-out;

}



.pageMenu ul li a i{

	display: block;

	margin: 0 auto 10px;

	width: 40px;

	height: 40px;

	line-height: 40px;

	font-size: 15px;

	border-radius: 50%;

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

	color: #ee3338;

	transition: all 300ms ease-in-out;

}



.pageMenu ul li a:hover{

	color: #ee3338;

}



.pageMenu ul li a:hover i{

	background: -webkit-linear-gradient(45deg,#ed2638 0%, #f2653a 100%);

    background: -moz-linear-gradient(45deg,#ed2638 0%, #f2653a 100%);

    background: linear-gradient(45deg,#ed2638 0%, #f2653a 80%);

	color:#fff;

}



.projectOverviewContainer{

	position: relative;

	z-index: 1;

	overflow: hidden;

}



.textContainer{

	width: 100%;

}



.textContainer article h6{

	font-weight: 300;

	font-size: 24px;

	line-height: 1.5;

}



.textContainer article p{

	font-weight: 500;

	line-height: 2;

}



.moreText {

    display: none;

}



.showmore{

	margin-top: 40px;

	width: 100%;

	text-align: center;

}



.showmore button{

	border: none;

	outline: none;

	background: none;

	font-weight: 400;

	font-size: 12px;

	text-transform: uppercase;

	letter-spacing: 3px;

}



.showmore button span{

	display: table;

	margin:10px auto;

	height: 70px;

	width: 1px;

	background: #000;

	position:relative;

	z-index: 1;

}



.showmore button span::before{

	content:'';

	position: absolute;

	bottom: 0;

	width:10px;

	height: 10px;

	border:solid #000;

	border-width:0 1px 1px 0;

}



.showmore button.active{

	color: #ee3338;

}



.showmore button.active span{

	background: #ee3338;

}



.showmore button.active span::before{

	bottom: auto;

	top: 0;

	right: 0;

	border-width:1px 0 0 1px;

	border-color:#ee3338;

}



.projectOverviewImg{

	width: 100%;

	position: relative;

}



.projectOverviewImg #sketch-fg{

	position: absolute;

	bottom: 0;

	z-index: 2;

	opacity: 1;

	animation: sketch 10s linear infinite;

}



@keyframes sketch{

	50%{opacity: 0.7;}

}



.projectOverviewImg #sketch-bg{

	z-index: 1;

}



.somePoints{

	position: absolute;

	top: 0%;

	z-index: 5;

}



.somePoints.left{

	left:5%;

}



.somePoints.right{

	right:5%;

}



.somePoints .points{

	margin:20px 0;

}



.somePoints .points small{

	font-weight: 500;

	text-transform: uppercase;

}



.somePoints .points h4{

	font-size: 16px;

}



.somePoints .points h4 span{

	font-size: 3rem;

	color: #ee3338;

	font-weight: 200;

}



.somePoints.right .points{

	display: flex;

	align-items: center;

}



.somePoints.right .points h5{

	color: #ee3338;

	margin-bottom: 0;

	margin-left: 10px;



}



.highlightsIconContainer{

	display: flex;

	flex-wrap:wrap;

}



.highlightsIconContainer li{

	width: calc(100% / 4);

	padding: 20px 10px;

	text-align: center;

	color: #fff;

	font-size: 13px;

}



.highlightsIconContainer li .img-fluid{

	width: 80px;

	padding: 20px;

	border-radius: 50%;

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

	margin: 0 auto 15px;

}



.highlightSlider, .highlightSlider .carousel-inner, .highlightSlider .carousel-item, .highlightSlider .carousel-item img{

	height: 100%;

}



.highlightSlider .carousel-item img{

	object-fit: cover;

	position: absolute;

	top: 0;

	left: 0;

}



.highlightSlider .carousel-item span{

	position: absolute;

	left: 0;

	bottom: 20px;

	padding: 10px;

	background: #ee3338;

	color: #fff;

	z-index: 2;

}



.featuresContainer{

	background: #eaeaea;

}



.featuresContainer ul{

	padding: 30px 5px;

}



.featuresContainer ul li button{

	background: none;

	border: none;

	outline: none;

	padding: 15px 0;

	border-bottom: 1px solid #ccc;

	display: flex;

	align-items: center;

	width: 100%;

	text-align: left;

	font-weight: 500;

}



.featuresContainer ul li button.active{

	color: #ee3338;

}



.featuresContainer ul li button .img-fluid{

	max-width: 30px;

	margin-right: 10px;

}



.fpBtn, .cuBox{

	margin: 10px;

}



.fpBtn a{

	height: 150px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  text-align: center;

  padding: 10px 25px;

  color: #191919;

  border: 1px solid #e4e4e4;

  font-weight: 600;

  text-transform: uppercase;

  position: relative;

  z-index: 1;

	transition: all 300ms ease-in-out;

	box-shadow: 0 6px 10px rgb(0 0 0 / 10%);

}



.fpBtn a::before{

	content: '';

	width: 60px;

  height: 60px;

	background: url(../images/icons/floorplan.png) center no-repeat #e4e4e4;

	background-size: 32px;

	border-radius: 50%;

  margin-bottom: 12px;

}



.fpBtn a:hover{

	background: -webkit-linear-gradient(45deg,#ed2638 0%, #f2653a 100%);

  background: -moz-linear-gradient(45deg,#ed2638 0%, #f2653a 100%);

  background: linear-gradient(45deg,#ed2638 0%, #f2653a 80%);

	transform: translateY(-5px);

	box-shadow: 0 10px 30px rgba(0,0,0,0.15);

}



.cuBox a .img-fluid{

	border: 1px solid #ccc;

	transition: all 300ms ease-in-out;

}



.cuBox a span{

	display: block;

	color: #ee3338;

	font-size: 16px;

	text-transform: uppercase;

	letter-spacing: 2px;

	text-align: center;

	padding-top: 15px;

	transition: all 300ms ease-in-out;

}



.cuBox a:hover .img-fluid{

	filter: grayscale(1);

}



.cuBox a:hover span{

	color: #191919;

}



.iframBox,

.iframBox iframe{

	width: 100%;

	height: 100%;

}



iframe{

  display: block;

}



.locationAdvantages h5{

	text-transform: uppercase;

	letter-spacing: 10px;

	margin-bottom: 20px;

	font-weight: 400;

}



.locationAdvantages ul{

	padding-right: 20px;

}



.locationAdvantages ul li{

	width: 100%;

	display: flex;

	align-items: baseline;

	padding: 10px 0;

	border-bottom: 1px solid #ccc;

}



.locationAdvantages ul li p{

	margin-bottom: 0;

	font-weight: 500;

}



.locationAdvantages ul li h6{

	font-size: 2rem;

	margin-bottom: 0;

  margin-right: 8px;

	color: #ee3338;

}



.locationAdvantages ul li h6 span{

	font-size: 16px;

}

/* Inside Page */



/*FORM*/

.overlay {

  position: fixed;

  left: 0;

  right: 0;

  top: 0;

  bottom: 0;

  background: rgba(47, 47, 47, 0.95);

  z-index: 9999;

  display: none;

}



.formContainer {

  position: fixed;

  bottom: 0;

  width: 100%;

  z-index: 999;

  padding: 0% 2%;

  border-top: 5px solid #bb9f72;

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

  backdrop-filter: blur(3px);

  border-radius: 5px;

  text-align: center;

}



.formContainer.formContainerShow {

  opacity: 1;

  top: 50%;

}



.formContainer .formClose {

  position: absolute;

  top: 20px;

  right: 20px;

  color: #8c8c93;

  cursor: pointer;

  display: none;

}



.formContainer .formClose:hover {

  color: #9a0407;

}



.formContainer h5 {

  text-align: center;

  color: #fff;

  font-weight: 400;

  font-size: 18px;

  letter-spacing: 3px;

  text-transform: uppercase;

  width: 100%;

  float: left;

  margin-bottom: 25px;

}



.fields {

  position: relative;

  z-index: 9;

  text-align: center;

}



.fields input,

.fields textarea,

.fields select {

  height: 50px;

  width: 100%;

  border: 0;

  border-bottom: 1px solid rgb(255 255 255 / 30%);

  background: none;

  color: #fff;

  padding: 10px 0;

  outline: none;

  -webkit-transition: all 0.2s ease-in-out;

  -moz-transition: all 0.2s ease-in-out;

  -o-transition: all 0.2s ease-in-out;

  -ms-transition: all 0.2s ease-in-out;

  transition: all 0.2s ease-in-out;

}



.fields input:focus,

.fields textarea:focus,

.fields select:focus {

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

}



.fields textarea {

  min-height: 120px;

}



.fields input.send {

  display: block;

  width: 200px;

  margin-top: 20px;

  margin-left: 0;

  float: none;

  background: var(--orange);

  color: #fff;

  border-bottom: 0;

  border-radius: 50px;

  cursor: pointer;

  text-transform: uppercase;

  letter-spacing: 1px;

  padding: 10px;

}



.fields input.send:hover {

  background: #fff;

}



.focus-red:focus {

  box-shadow: 0 0 0 1px red;

  background-color: #fdd4d4 !important;

  color: red !important;

}

.focus-red:focus::-webkit-input-placeholder {

  color: #ffffff;

}

.focus-red:focus::-moz-placeholder {

  color: #ffffff;

}

.focus-red:focus:-ms-input-placeholder {

  color: #ffffff;

}

.focus-red:focus:-moz-placeholder {

  color: #ffffff;

}

/*enquiry*/



/* other pages */

.other-pages-banner{

  height: 50vh;

  float: left;

  background: #000;

  background: linear-gradient(90deg, #000000, #383838);

  display: flex;

  align-items: flex-end;

  padding-bottom: 40px;

}

.other-pages-banner h1{

  font-size: 8vw;

  font-weight: 700;

  color: #fff;

}



.breadcrumb{

	background-color: transparent;

	font-size: 13px;

	font-weight: 500;

}



.breadcrumb li a{

	color: var(--orange);

}



.hm-overviewText h6{

  font-size: 20px;

  font-weight: 400;

  line-height: 1.5;

}



.overstatsBox{

  display: flex;

  justify-content: center;

  color: #fff;

  text-align: center;

}



.overstatsBox section h2{

  font-size: 4vw;

  font-weight: 200;

  color: var(--orange);

}



.overstatsBox section span{

  text-transform: uppercase;

  font-size: 12px;

  letter-spacing: 4px;

  padding-bottom: 5px;

  display: block;

}



.overstatsBox section p{

  text-transform: uppercase;

  font-size: 14px;

  letter-spacing: 2px;

  margin-bottom: 0;

}



.mvBox{

  padding:10px 0;

}



.mvBox section{

  display: flex;

  border: 1px solid rgb(0 0 0 / 10%);

}



.mvBox section .vmhead{

  flex:0 0 25%;

  max-width: 25%;

  text-align: center;

  display: flex;

  justify-content: center;

  align-items: center;

  border-right: 1px solid rgb(0 0 0 / 10%);

}



.mvBox section .vmhead .img-fluid{

  max-width: 50%;

  filter:hue-rotate(330deg);

}



.mvBox section article{

  flex:0 0 75%;

  max-width: 75%;

  padding:30px;

}



.mvBox section article p{

  line-height: 1.8;

  margin-bottom: 0;

}



.coreContainer{

  background-color: #f7f7f7;

}



.coreContainer .row{

  margin-left: -10px;

  margin-right: -10px;

}



.coreBox{

  padding-left: 10px;

  padding-right: 10px;

}



.coreBox section{

  padding:50px 70px 20px 20px;

  position: relative;

  z-index: 1;

  height: 100%;

  background: #fff;

  transition: all 300ms ease-in-out;

}



.coreBox section:hover{

  box-shadow: 0 1rem 3rem rgb(0 0 0 / 10%);

  transform: translateY(-5px);

}



.coreBox section .img-fluid{

  position: absolute;

  right: 10px;

  top: 0px;

  width: 70px;

  z-index: -1;

}



.coreBox section h5{

  font-weight: 700;

}



.contactBox section{

  height: 100%;

  display: flex;

  justify-content: center;

  flex-wrap: wrap;

  border: 1px solid rgb(0 0 0 / 10%);

}



.contactBox section .info-box{

	text-align:center;

	width:50%;

	padding: 20px;

  flex-grow: 1;

}



.contactBox section .info-box:first-child{

  width: 100%;

  border-bottom: 1px solid rgb(0 0 0 / 10%);

}



.contactBox section .info-box:nth-child(2){

  border-right: 1px solid rgb(0 0 0 / 10%);

}



.contactBox section .info-box i{

	text-align:center;

    font-size: 21px;

    color: var(--orange);

    border-radius: 50%;

    border: 2px dotted var(--orange);

    width: 50px;

    height: 50px;

    line-height: 48px;

}

.contactBox section .info-box h3{

    font-size: 18px;

    font-weight: 700;

    margin: 10px 0;

}



.contactBox section .info-box p{

	font-size:16px;

  margin-bottom: 0;

}



.contactBox section .info-box p strong{

	display:inline-block;

	padding-top:10px;

}



.contactBox section .info-box p a{

	color:#191919;

}



.contactBox section .info-box p a:hover{

	color:var(--orange);

}



.contactForm section{

  padding: 30px;

  background: var(--darkblue);

  text-align: center;

  color: #fff;

}



.contactForm section h6{

  text-transform: uppercase;

  font-size: 700;

}



.form-group{

  margin-bottom: 20px;

}



.form-group>div{

  margin-top: 15px;

}



.form-group label{

  margin-bottom: 0;

  font-size: 13px;

  font-weight: 500;

}



.form-control{

  border-radius: 0;

  border: none;

  border-bottom: 1px solid rgb(0 0 0 / 16%);

  background: none;

  outline: none;

  padding-left: 0;

  padding-top: 0;

}



.form-control[readonly]{background: none;}



.form-control:focus{

  box-shadow: none;

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

  background: none;

}





/*Events*/

.eventsContainer .row{

	margin-left:-10px;

	margin-right:-10px;

}



.eventsContainer .eventBox{

	padding:10px;

}



.eventsContainer .eventBox iframe{

	max-height:100%;

	min-height:360px;

}



.eventsContainer .eventBox a,

.eventsContainer .eventBox iframe{

	width:100%;

	position:relative;

	display:block;

	z-index:1;

	overflow:hidden;

}



.eventsContainer .eventBox a:before{

	content:'';

	position:absolute;

	left:0;

	right:0;

	top:0;

	bottom:0;

	background:url(../images/drag.png) center no-repeat rgba(0,0,0,0.40);

	background-size:50px;

	backdrop-filter:blur(9px);

	opacity:0;

	transition:all 300ms ease-in-out;

	z-index:1;

}



.eventsContainer .eventBox a:hover:before{

	opacity:1;

}



.eventsContainer .eventBox a img{

	transition:all 300ms ease-in-out;

}



.eventsContainer .eventBox a:hover img{

	transform:scale(1.1,1.1);

}

/*Events*/



.projectBox{

  display: flex;

  align-items: center;

}

.projectBox .projectImg{

  width: 40%;

}

.projectBox .project-text{

  width: 70%;

  margin-left: -10%;

  position: relative;

  z-index: 1;

  padding:30px;

  background: #fff;

  display: flex;

  align-items: center;

  box-shadow: 0 1rem 3rem rgb(0 0 0 / 10%);

}

.projectBox.flex-row-reverse .project-text{

  margin-left: auto;

  margin-right: -10%;

}

.projectBox .project-text > section{

  width: 70%;

  padding-right: 20px;

}

.projectBox .project-text > section h2{

  font-size: 3rem;

}

.projectBox .project-text aside{

  width: 30%;

  border-left: 1px solid rgb(0 0 0 / 10%);

  padding-left: 20px;

}

.projectBox .project-text aside ul li{

  margin-bottom: 20px;

}

.projectBox .project-text aside ul li:first-child{

  padding: 10px 10px 10px 20px;

  background: #eaeaea;

  border-radius: 40px;

}

.projectBox .project-text aside ul li:last-child{

  margin-bottom: 0px;

}

.projectBox .project-text aside ul li section{

  display: flex;

  align-items: center;

}

.projectBox .project-text aside ul li section .img-fluid{

  width: 45px;

}

.projectBox .project-text aside ul li section article{

  padding-left: 20px;

}

.projectBox .project-text aside ul li section article span{

  font-size: 12px;

}

.projectBox .project-text aside ul li section article h4{

  font-size: 13px;

  text-transform: uppercase;

  margin-bottom: 0;

}

/* other pages */



/* blogs */

.blogpageBox {

  margin-bottom: 50px;

}

.blogpageBox .img-fluid img{

  height: 29vw;

  object-fit: cover;

}



.blogs-heading{

  margin-bottom: 30px;

  position: relative;

}



.blogs-heading::after{

  content: '';

  width: 100px;

  height: 2px;

  background: var(--orange);

  display: block;

}



.blogs-heading h2{

  font: 100 3rem/1.5 'Comfortaa', cursive;

  margin-bottom: 10px;

}



.latest-blogs-sidebar section{

  height: 100%;

  width: 90%;

  margin-right: 0;

  margin-left: auto;

  background: #f1f1f1;

  padding: 20px;

}



.latest-blogs-sidebar section .latestBlogs .img-fluid a{

  display: flex;

  align-items: center;

  padding:20px 0;

  margin: 10px 0;

  border-bottom: 1px solid rgb(0 0 0 / 10%);

  color: inherit;

}



.latest-blogs-sidebar section .latestBlogs .img-fluid:first-child a{

  border-top: 1px solid rgb(0 0 0 / 10%);

}



.latest-blogs-sidebar section .latestBlogs .img-fluid a:hover{

  color: var(--orange);

}



.latest-blogs-sidebar section .latestBlogs .img-fluid img{

  width: 25%;

}



.latest-blogs-sidebar section .latestBlogs .img-fluid span{

  width: 75%;

  padding-left: 10px;

}

/* blogs */

.deliveredContainer .row{

  margin-left: -5px;

  margin-right: -5px;

}



.deliveredContainer .row div[class^=col]{

  padding-left: 5px;

  padding-right: 5px;

}

.deliveredBox{

  margin: 5px 0;

}



.deliveredBox section{

  position: relative;

  z-index: 1;

  color: #fff;

  text-align: center;

}

.deliveredBox section::before{

  content: '';

  position: absolute;

  left: 0;

  bottom: 0;

  width: 100%;

  height: 100%;

  background: linear-gradient(transparent, #000);

  z-index: 0;

}

.deliveredBox section span{

  position: absolute;

  left: 0;

  bottom: 0;

  width: 100%;

  font-size: 13px;

  padding:10px 5px;

  z-index: 1;

}



.list{

  padding-left: 20px;

}



.list li{

  margin: 10px 0;

}



/*transformation Animation*/

.leftTranslate {

  -webkit-transform: translate(-200px, 0);

  transform: translate(-200px, 0);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.rightTranslate {

  -webkit-transform: translate(200px, 0);

  transform: translate(200px, 0);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.topTranslate {

  -webkit-transform: translate(0, -200px);

  transform: translate(0, -200px);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.bottomTranslate {

  -webkit-transform: translate(0, 200px);

  transform: translate(0, 200px);

  opacity: 0;

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.doneTranslate {

  -webkit-transform: translate(0, 0);

  transform: translate(0, 0);

  opacity: 1;

}



.scaleTranslate {

  -webkit-transform-origin: top;

  transform-origin: top;

  -webkit-transform: scaleY(0);

  transform: scaleY(0);

  -webkit-transition: all 1000ms;

  transition: all 1000ms;

}



.doneScale {

  -webkit-transform-origin: top;

  transform-origin: top;

  -webkit-transform: scaleY(1);

  transform: scaleY(1);

}

/*transformation Animation*/



/*responsive*/

@media (max-width: 1200px) {

  .logo{width: 160px;}

  .apralogo{width:80px;}

  .header .mainHeader .navi > ul > li > a{font-size: 13px;}

}



@media (min-height: 1024px) {

  .landing-img video{object-fit: contain; width: 101%; left: -1%;}

}



@media (max-height: 414px) {

  .mbMenuContainer .mbMenu{justify-content: flex-start; padding: 60px 0 20px;}

}



@media (max-width: 1024px) {

  .logo{width: 130px;}

  .apralogo{width:70px;}

  .header .mainHeader .navi > ul > li > a{font-size: 12px; padding: 7px ​11p;}

  #banner{height: 500px;}

  a.carousel-control-next[href="#banner"], a.carousel-control-prev[href="#banner"]{width: 30px; height: 30px;}

  a.carousel-control-prev[href="#banner"]{margin-top: -20px;}

  a.carousel-control-next[href="#banner"]{margin-top: 20px;}

  .carousel-control-prev-icon, .carousel-control-next-icon{width: 20px; height: 20px;}

  .scrollDown{display: none;}

  .bannerText{margin-top: 100px;}

  .banner-projectname{font-weight: 300;}

  .hm-overviewText h2{font-size: 26px; margin-bottom: 30px;}

  .hm-overviewText p{font-size: inherit;}

  #overviewSlider{width: 70%;}

  .statsContainer li > div{padding: 20px 0 20px 15px;}

  .statsContainer li h2{font-size: 16px;}

  .statsContainer li h2 .counter{font-size: 2rem;}

  .statsContainer li h6{font-size: 11px; letter-spacing: 2px;}

  .readmore a{padding: 10px 15px;}

  .hm-projectWrapper .hm-project-text h5{font-size: 16px;}

  .exploreAll ul li a{min-width: 90px; padding: 10px; font-size: 13px; text-align: center;}

  .hm-project-icons ul li section .img-fluid::before, .hm-project-icons ul li section .img-fluid::after{width:60px;}

  .hm-project-icons ul li section{font-size: 11px;}

  .proj-status ul li section .img-fluid{width: 40px;}

  .proj-status ul li section article h4{font-size: 20px;}

  .heading h2{font-size: 3rem;}

  .heading h6{font-size: 14px;}

  .heading h4{font-size: 24px; margin-bottom: 0;}

  .testimonials{min-height: 300px;}

  .testimBox p{font-size: 18px;}

  .testimBox .testimName{font-size: 2rem;}

  .footerBox h6{font-size: 16px;}

  .insideBanner{height: 500px;}

  .insideHeader{margin-top: -45px;}

  .insideHeader .projectLogo{width: 160px;}

  .pageMenu ul{width: calc(50% - 80px);}

  .pageMenu ul li a{padding: 10px 5px;}

  .textContainer article h6{font-size: 22px;}

  .projectOverviewImg #sketch-fg, .projectOverviewImg #sketch-bg{height: 340px; object-fit: cover;}

  .somePoints.right{right: 3%;}

  .small, small{font-size: 75%;}

  .somePoints .points h4 span{font-size: 40px;}

  .somePoints .points h4,.somePoints h6{font-size: 14px;}

  .somePoints.right .points h5{font-size: 18px;}

  .highlightsIconContainer li{padding:10px 5px; font-size: 12px;}

  .highlightsIconContainer li .img-fluid{width: 70px;}

  .featuresContainer ul li button{font-size: 13px;}

  .fpBtn a{padding: 10px 15px; font-size: 13px;}

  .other-pages-banner{height: 350px;}

  .projectBox .project-text{padding: 20px;}

  .projectBox .project-text > section{width: 65%;}

  .projectBox .project-text > section h2{font-size: 34px;}

  .projectBox .project-text aside{width: 35%;}

  .projectBox .project-text aside ul li:first-child{padding-left: 15px;}

  .projectBox .project-text aside ul li section .img-fluid{width: 35px; flex:0 0 35px;}

  .projectBox .project-text aside ul li section article{padding-left: 10px;}

  .projectBox .project-text aside ul li section article h4{font-size: 12px;}

  .hm-overviewText h6{font-size: 17px;}

  .coreBox{padding-top: 10px; padding-bottom: 10px;}

  .coreBox:first-child{padding-top: 0;}

  .coreBox:last-child{padding-bottom: 0;}

  .coreBox section{padding-right: 20px;}

  .coreBox section h5{font-size: 18px;}

  .blogs-heading h2{font-size: 2rem;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid a{font-size: 13px;}

}



@media (max-width: 812px) {

  body{font-size: 13px;}

  .header.fixed .logo{width: 95px; height: 40px;}

  .header.fixed .logo img{width: 100px;}

  .navi{display: none;}

  .menuBtn{display: flex;}

  .hm-overviewImg{margin-top: 40px;}

  #overviewSlider{width: 70%;}

  .hm-projectWrapper .hm-project-text h2{font-size: 3.2rem;}

  .proj-status ul li{padding: 0 10px;}

  .proj-status ul li section .img-fluid{width: 35px; margin-right: 8px;}

  .proj-status ul li section article span{font-size: 10px; letter-spacing: 3px;}

  .proj-status ul li section article h4{font-size: 16px;}

  .hm-project-icons ul li section .img-fluid{width: 65px;}

  .hm-project-icons ul li section .img-fluid::before, .hm-project-icons ul li section .img-fluid::after{width:40px;}

  .readmore a{font-size: 10px;}

  .heading h2{font-size: 2.5rem;}

  .blogBox section article{padding: 15px; margin-top: 15px;}

  .blogBox section article h5{font-size: 13px; margin-bottom: 10px;}

  .footer-area .rera{justify-content: flex-end;}

  .footer-area .copyright{width: 100%; flex:1 0 100%; justify-content: center; margin-top: 30px;}

  .projectOverviewImg{padding-top: 20px;}

  .projectOverviewImg #sketch-fg, .projectOverviewImg #sketch-bg{height: 300px; object-position: 66% bottom;}

  .somePoints .points{margin: 0 0 10px;}

  .highlightsIconContainer li{width: calc(100% / 3);}

  .features-building{padding-top: 0;}

  .featuresContainer{padding: 10px 0 10px 10px;}

  .featuresContainer ul{height: 350px; padding: 0 10px 0 0; overflow: auto;}

  .other-pages-banner{height: 300px;}

  .projectBox .projectImg{width: 60%;}

  .projectBox .project-text{flex-wrap: wrap; width: 50%;}

  .projectBox .project-text > section, .projectBox .project-text aside{width: 100%;}

  .projectBox .project-text > section{padding-right: 0; padding-bottom: 20px;}

  .projectBox .project-text aside{padding-top: 20px; padding-left: 0; border-left: none; border-top: 1px solid rgb(0 0 0 / 10%);}

  .projectBox .project-text aside ul{display: flex; flex-wrap: wrap;}

  .projectBox .project-text aside ul li{flex:1 0 calc(50% - 10px); margin-bottom: 10px; margin-right: 10px;}

  .projectBox .project-text aside ul li:first-child{flex-basis: 100%; margin-right: 0; margin-bottom: 20px;}

  .projectBox .project-text aside ul li:last-child{margin-right: 0;}

}



@media (max-width: 768px) {

  .landing-img video{object-fit: contain; width: 101%; left: -1%;}

  #banner{height: 400px;}

  .hm-projectWrapper .hm-project-text h2{font-size: 3rem;}

  .hm-projectContainer .videoBox{height: 250px;}

  .heading{margin-bottom: 20px;}

  .testimonials{min-height: 250px; padding: 3rem;}

  .testimonials::after{width: 70px; height:70px;}

  .testimBox p{font-size: 15px;}

  .heading h2{font-size: 2rem; letter-spacing: 7px;}

  .insideBanner{height: 450px;}

  .insideBanner-img{width: 130%; left: -30%;}

  .textContainer article h6{font-size: 18px;}

  .projectOverviewImg{padding-top: 0;}

  .somePoints.right{right: auto; left:40%;}

  .projectOverviewImg #sketch-fg, .projectOverviewImg #sketch-bg{height: 400px; object-position: 45% 0;}

  .highlightsWrapper .container-fluid{padding-left: 0;}

  .highlightsContainer .row{margin-left: 0;}

  .highlightsContainer .highlightSliderContainer{padding-left: 0; height: 800px;}

  .highlightsIconContainer li{width: 25%;}

  .highlightsIconContainer li section span br{display: none;}

  .featuresWrapper .row{margin-left: 0;}

  .features-building{padding-left: 0;}

  .featuresContainer ul{display: flex; flex-wrap: wrap; height: auto;}

  .featuresContainer ul li{width: 50%;}

  .locMap{height: 350px; margin-bottom: 40px;}

  .locationAdvantages h5{margin-bottom: 10px;}

  .projectBox .project-text{width: 60%;}

  .projectBox .project-text aside ul li section article span{font-size: 10px; font-weight: 500;}

  .projectBox .project-text aside ul li section article h4{font-size: 11px;}

  .hm-overviewText h6{font-size: 16px;}

  .blogpageBox .img-fluid img{height: 225px;}

  .latest-blogs-sidebar section{width: 100%; padding:15px;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid a{flex-wrap: wrap; font-size: 12px;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid a img{width: 100%;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid span{width: 100%; padding-top: 10px; padding-left: 0;}

}



@media (max-width: 736px) {

  .latest-blogs-sidebar{margin-top: 30px;}

  .latest-blogs-sidebar section .latestBlogs{display: flex; flex-wrap: wrap; border-top: 1px solid rgb(0 0 0 / 10%);}

  .latest-blogs-sidebar section .latestBlogs .img-fluid{width: 50%; padding: 0 10px;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid a{height: 100%; text-align: center;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid a img{height: 150px; object-fit: cover;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid:first-child a{border-top: none;}

}



@media (max-width: 667px) {

  .mbMenuContainer .mbMenu .mblist > ul > li > a{font-size: 5vw;}

  .mbMenuContainer .mbMenu ul .dropdown ul li a{font-size: 14px;}

  .padding{padding-top: 40px; padding-bottom: 40px;}

  .hm-projectContainer .videoBox{height: auto;}

  .hm-projectWrapper .central-logo{margin:30px auto 0;}

  .hm-project-text{text-align: center;}

  .hm-projectWrapper .hm-project-text h5{font-size: 15px; padding-right: 0;}

  .exploreAll ul{justify-content: center;}

  .hm-project-icons ul li section .img-fluid::before, .hm-project-icons ul li section .img-fluid::after{width: 19px;}

  .proj-status ul li section article span{font-size: 8px;}

  .proj-status ul li section article h4{font-size: 14px;}

  .heading h2{font-size: 1.8rem; letter-spacing: 5px;}

  .footerBox h6{font-size: 13px;}

  .footerBox ul li a{font-size: 12px;}

  .footer-area .membersBox h6{font-size: 19px;}

  .footer-area .membersBox li img{height: 25px;}

  .footer-area .membersBox li img[alt="Credai"]{height: 15px;}

  .footer-area .bottom{padding:3rem 0 5rem;}

  .insideHeader{margin-top:-75px; padding: 0 !important;}

  .pageMenu{flex-wrap:wrap; justify-content: center; align-items: flex-start;}

  .insideHeader .projectLogo{order: -1; width:100%; margin-bottom: 10px;}

  .insideHeader .projectLogo img{margin:0 auto; width:160px;}

  .pageMenu ul{width: 50%; border-top: 1px solid rgba(0,0,0,0.08);}

  .pageMenu ul li a{font-size: 10px;}

  .pageMenu ul li a i{width: 35px; height: 35px; line-height: 35px; font-size: 13px;}

  .textContainer article h6{font-size: 16px; font-weight: 400;}

  .showmore button span{height: 50px;}

  .projectOverviewImg{padding-top: 80px;}

  .somePoints.left{left: 8%;}

  .somePoints .points h4, .somePoints h6{font-size: 13px;}

  .somePoints.right{left: auto; right: 8%;}

  .somePoints.right .points h5{font-size: 15px;}

  .projectOverviewImg #sketch-fg, .projectOverviewImg #sketch-bg{height: 360px; object-position: center;}

  .walkthroughWrapper iframe{height: 350px;}

  .fpBtn, .cuBox{margin:0 5px;}

  .fpBtn a{font-size: 12px;}

  .cuBox a span{font-size: 14px;}

  .slick-prev, .slick-next{width: 30px; height: 30px; margin-top: -15px;}

  .slick-prev:before, .slick-next:before{font-size: 13px;}

  .overstatsBox section span{font-size: 10px;}

  .overstatsBox section p{font-size: 13px; letter-spacing: 1px;}

  .mvBox section{flex-wrap: wrap; justify-content: flex-end;}

  .mvBox section .vmhead{border-bottom: 1px solid rgb(0 0 0 / 10%); border-left: 1px solid rgb(0 0 0 / 10%); border-right: none; max-width: 150px; flex: 0 0 150px; padding:20px 0;}

  .mvBox section article{max-width: 100%; flex: 0 0 100%; padding-top: 0;}

}



@media (max-width: 576px) {

  .projectBox{flex-wrap: wrap;}

  .projectBox .project-text > section h2{font-size: 27px;}

  .projectBox .projectImg, .projectBox .project-text{width: 100%;}

  .projectBox .project-text{margin-left: 0;}

  .projectBox.flex-row-reverse .project-text{margin-right: 0;}

}



@media (max-width: 480px) {

}

.mb-slide{display: none; position: absolute; top: 0; left: 0; height: 100%; object-fit: cover;}

@media (max-width: 425px) {

  .logo{width: 100px;}

  .apralogo{width: 50px;}

  .mbMenuContainer .mbMenu .mblist > ul > li > a{font-size: 7vw;}

  .mbMenuContainer .mbMenu ul li.hasChild a i{width: 25px; height: 25px; line-height: 25px;}

  .container-fluid{padding-right: 20px; padding-left: 20px;}

  #banner{height: 550px;}

  .mb-slide{display: block;}

  .bannerText{margin-top: 0; margin-bottom: 100px;}

  .bannerText h1{font-size: 5vw;}

  .bannerText h2{font-size: 9vw;}

  .bannerText p{font-size: 4vw;}

  a.carousel-control-next[href="#banner"], a.carousel-control-prev[href="#banner"]{top: auto; bottom: 10px; right: 50%;}

  a.carousel-control-next[href="#banner"]{margin-top: 0; margin-right: -30px;}

  a.carousel-control-prev[href="#banner"]{margin-top: 0;; margin-right: 10px;}

  .hm-overviewText h2{font-size: 16px; margin-bottom: 20px;}

  .hm-overviewText p{margin-bottom: 1rem;}

  #overviewSlider{width: 80%;}

  .statsContainer{width: 45%; left: 55%;}

  .statsContainer li > div{padding: 20px 10px; text-align: center;}

  .statsContainer li h2{font-size: 14px;}

  .statsContainer li h2 .counter{font-size: 28px;}

  .statsContainer li h6{font-size: 10px; letter-spacing: 4px;}

  .hm-projectWrapper .hm-project-text h5{font-size: 13px;}

  .exploreAll ul li{padding: 0 5px;}

  .exploreAll ul li a{min-width: 110px;}

  .hm-project-icons ul, .proj-status ul{flex-wrap: wrap;}

  .hm-project-icons ul li{flex:1 0 calc(100% / 3);}

  .hm-project-icons ul li:first-child,.hm-project-icons ul li:last-child{justify-content: center;}

  .hm-project-icons ul li section{padding:10px; font-size: 10px;}

  .hm-project-icons ul li section .img-fluid::before, .hm-project-icons ul li section .img-fluid::after{width: 35px;}

  .proj-status{padding: 0;}

  .proj-status ul li{flex:1 0 50%; padding: 10px;}

  .proj-status ul li:nth-child(2){border-right: none;}

  .proj-status ul li:nth-child(3){border-top: 1px solid rgb(255 255 255 / 10%);}

  .heading h2{letter-spacing: 2px;}

  .heading h4{font-weight: 300; font-size: 20px;}

  .testimonials{min-height: 1px; padding: 2rem;}

  .testimBox{width: 100%;}

  .testimBox p{font-size: 13px;}

  .testimBox .testimName{font-size: 22px; margin-top: 20px;}

  .socialBox{padding: 5px 4px;}

  .socialBox ul li a{font-size: 14px; width: 40px; height: 40px; line-height: 40px;}

  .footerBox{margin-bottom: 30px;}

  .footerBox.footerAbout{margin-bottom: 0;}

  .footerBox ul li{width: 50%;}

  .footerBox h6{margin-bottom: 15px;}

  .membersBox{flex: 1 0 100%; margin-bottom: 30px;}

  .footer-area .bottom ul{justify-content: center;}

  .footer-area .membersBox h6{text-align: center;}

  .pageMenu ul{width: 100%;}

  .projectOverviewImg{padding-top: 0;}

  .textContainer article{text-align: justify !important;}

  .textContainer .heading h2 {font-size: 18px; font-weight: 400; letter-spacing: 1px;}

  .somePoints{display: flex; justify-content: space-around; position: static; flex-wrap: wrap;}

  .somePoints.right{text-align: center; margin: 10px 0 30px;}

  .somePoints h6{width: 100%;}

  .somePoints.right .points{justify-content: center; flex-direction: column;}

  .projectOverviewImg #sketch-fg, .projectOverviewImg #sketch-bg{height: 240px;}

  .highlightsIconContainer li{width: 50%;}

  .highlightsContainer .highlightSliderContainer{height: 500px;}

  .featuresContainer ul li button{padding-right: 10px; font-size: 12px;}

  .other-pages-banner{height: 230px;}

  .heading h6{font-size: 12px;}

  .heading h2{font-size: 1.5rem;}

  .locMap{height: 300px;}

  .locationAdvantages ul li h6{font-size: 1.5rem;}

  .project-text p{margin-bottom: 0;}

  .projectBox .project-text aside ul li{flex-basis: 100%; width: 100%; margin-right: 0; margin-bottom: 20px;}

  .hm-overviewText h6{font-size: 14px;}

  .overstatsBox{padding: 15px;}

  .overstatsBox section h2{font-size: 7.5vw;}

  .mvBox section article{padding: 0 15px 15px;}

  .mvBox section .vmhead{max-width: 90px; flex: 0 0 90px; padding: 10px 0;}

  .mvBox section .vmhead .img-fluid{max-width: 70%;}

  .blogs-heading h2{font-size: 20px;}

  .latest-blogs-sidebar section{padding-right: 10px;}

  .latest-blogs-sidebar section .latestBlogs{height: 400px; overflow: auto; padding-right: 10px;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid{width: 100%;}

  .latest-blogs-sidebar section .latestBlogs .img-fluid a{margin: 0;}

  .form-group.col-sm-12{margin-top: 20px;}

  .contactBox section .info-box{width: 100%;}

  .contactBox section .info-box:nth-child(2){border-right: none; border-bottom: 1px solid rgb(0 0 0 / 10%);}

  .contactBox section .info-box h3{font-size: 15px;}

  .contactBox section .info-box p{font-size: 13px;}

}



@media (max-width: 375px) {

  .readmore.mx-auto{width: 100%; text-align: center;}

}



@media (max-width: 360px) {

  .proj-status ul li{flex: 1 0 100%;}

  .proj-status ul li:first-child{border-bottom: 1px solid rgb(255 255 255 / 10%);}

  .readmore a, .readmore button{min-width: 100px; padding:9px 15px;}

}



@media (max-width: 320px) {

  .footerBox{text-align: center;}

  .footerBox h6::after{margin-left: auto; margin-right: auto;}

  .footerBox.footerAbout ul li{width: 100%;}

  .footer-area .bottom{padding-bottom: 6rem;}

  .footer-area .bottom li{padding: 0 6px;}

}