body {font-family: "Inter", sans-serif;overflow-x: hidden;}
.br-20 {border-radius: 20px;overflow: hidden;}
.br-30 {border-radius: 30px;overflow: hidden;}
video {width: 100%;height: 100%;object-fit: cover;}
h1, h2 {font-family: "Michroma", sans-serif;}
.common-section {padding: 100px 0;}
.common-top-section {padding-top: 100px;}

p{color:#425C64;}
.realestate-page a svg {transition: all 0.3s ease-in;}
.realestate-page a:hover svg {transition: all 0.3s ease-in;}

/* white logo for dark banner */
#whitelogo-header .whitelogo .sitelogo, #whitelogo-header .homemenulogo {display: block;}
#whitelogo-header .innermenulogo, #whitelogo-header .menulogo {display: none;}
#whitelogo-header .inquiremenubtn:hover {color: #fff;border: solid 2px transparent;background: #534644;}

.menu-open#whitelogo-header .homemenulogo {display: none;}
.menu-open#whitelogo-header .innermenulogo {display: block;}



/* white logo fixed at top */
#whitelogo-header.sticky-header .whitelogo .sitelogo, #whitelogo-header.sticky-header .homemenulogo {display: none;}
#whitelogo-header.sticky-header .innermenulogo, #whitelogo-header.sticky-header .menulogo {display: block;}
#whitelogo-header.sticky-header .navbar-dark .navbar-nav .nav-link {color: #534644;}
#whitelogo-header.sticky-header .inquiremenubtn {color: #fff;border: solid 2px transparent;background: #534644;}
#whitelogo-header.sticky-header .inquiremenubtn:hover {color: #fff;border: solid 2px transparent;background: #d9d3ca;}

.realestate-page #Header {background-image: url(../images/realestate/realestate-banner-bg.png);background-attachment: fixed;height: auto; background-size: cover !important;}
.realestate-banner {position: relative;}
.realestate-banner h1 {text-align: right;font-size: 72px;text-transform: uppercase;padding-top: 65px;margin-bottom: -10px;}
.realestate-banner > * , .realestate-banner p{color: #fff;}
.realestate-banner .line {right: 0;position: absolute;top: 35px;}
.realestate-banner .custom-container {width: 65%;margin: 0 auto;gap: 65px;}
.realestate-banner .banner-image {mix-blend-mode: soft-light;}
.realestate-banner .right-box {width: 50%;margin-top: 50px;}
.realestate-banner .right-box h2{font-size: 42px;margin-bottom: 30px;text-transform: uppercase}
.realestate-banner .right-box p{font-size: 24px;text-align: justify;}

.about-realestate h2 {font-size: 36px;margin-bottom: 40px;text-transform: capitalize;color: #222E32;}
.about-realestate .inner-content {gap: 60px;}
.about-realestate .inner-content .con-box {width: 50%;text-align: justify;}

ul.tech-stack {gap: 25px;border:1px solid #E6F4FF;border-radius: 20px;;padding: 12px 28px;background-color: transparent;}
ul.tech-stack li img {width: 40px;}
.about-project p , .about-project p a {font-size: 20px;color: #000;letter-spacing: 0;}
.about-project h3 {font-size: 30px;font-weight: 400;margin-bottom: 20px;color: #000;letter-spacing: 2%;text-transform: uppercase; font-family: "Oxanium", sans-serif;}
.about-project .app-logo {margin-bottom: 30px;}
.about-project p a svg {width: 20px;height: 20px;margin-left: 5px;}
.about-realestate .inner-content .img-box img {height: 100%;object-fit: cover;}

.about-project p.subtitle {font-weight: 400;color: #425C64;}

.realestate-services {background-color: #F6F6F6;}
.realestate-services h2 {font-size: 32px; text-align: center;margin-bottom: 50px;color: #222E32;font-family: "Oxanium", sans-serif;text-transform: uppercase;}
.realestate-services .common-service-box {background-color: transparent;border:1px solid #9EB9BF;border-radius: 60px;padding: 50px 40px;height: 490px;width: 520px;margin: 0 30px;}
.realestate-services .common-service-box h3 {font-size: 26px;margin-bottom: 20px;font-family: "Inter", sans-serif;letter-spacing: 0;}
.realestate-services .common-service-box p {font-size: 20px;margin-bottom: 0;}

.ovvy .left-box {width: 40%;z-index: 1;position: relative;}
.ovvy .left-box ul.tech-stack {width: 76%;}
.ovvy .img-box {position: relative;}
.ovvy .object {position: absolute;z-index: -1;top: 0;left: -140px;}

.residally .inner-container {gap: 17px;}
.residally .right-box .upper-box {margin-bottom: 17px;}
.residally .right-box {width: 50%;}
.residally .right-box .upper-box {background: linear-gradient(284deg, #013644 12.52%, #0B3F4D 57.94%, #001D24 91.07%);padding: 100px;}
.residally .right-box .lower-box {background: linear-gradient(217deg, #001D24 1.97%, #001D24 26.75%, #0B3F4D 63.45%, #013644 101.11%);padding: 50px 0;}
.residally .left-box {width: 50%;display: flex;justify-content: center;align-items: center;background:linear-gradient(217deg, #031C22 4.61%, #0B3F4D 45.31%, #3E5D66 74.8%, #91A3A8 101.11%);}
.residally .left-box .swiper-container {width: 45%;height: 530px;}
.residally .about-project p.subtitle , .residally .about-project h3 , .residally .about-project a, .residally .about-project p {color: #fff;}
.residally ul.tech-stack {width: 50%;border: 1px solid #1F576D;}
.residally .slider-title {font-size: 28px;position: relative;margin-right: -40px;font-weight: 200;color: #fff;z-index: 2;text-shadow: 2px 2px 5px #2b2b2bf5;}
.residally .swiper-slide {position: relative;box-shadow: 0 15px 50px rgba(0, 0, 0, 0.2);border-radius: 28px;user-select: none;}
.residally .swiper-slide img {position: absolute;inset: 0;width: 100%;height: 100%;object-fit: cover;}
.residally .swiper-cards .swiper-slide {transform-origin: center bottom;-webkit-backface-visibility: hidden;backface-visibility: hidden;overflow: hidden;}

.homer .color-box .about-project{background: linear-gradient(284deg, #013644 12.52%, #0B3F4D 57.94%, #001D24 91.07%);text-align: center;padding: 30px 30px 0 30px;width: 68%;margin: 0 auto;}
.homer .app-img {margin-bottom: -30px;}
.homer ul.tech-stack { width: 27%;margin: 0 auto; margin-top: 50px;margin-bottom: 0;}

.listing-desc {background-image: url(../images/realestate/ld-bg.png);background-size: cover;background-attachment: fixed}
.listing-desc  ul.tech-stack {width: 38%;border: 1px solid #1F576D;}
.listing-desc .about-project h3, .listing-desc .about-project p, .listing-desc .about-project p a , .homer h3{color: #fff;}
.listing-desc .left-box {width: 40%;}


/* Responsive CSS Real-Estate indutry */
@media screen and (min-width: 2560px) {
    .realestate-banner .right-box {margin-top: 90px;}
    .residally .left-box .swiper-container {width: 40%;height: 650px}
    .residally ul.tech-stack {width: 35%}
    .residally .right-box .lower-box {padding: 100px 0;}
    .homer .color-box .about-project {padding-top: 65px;}
    .homer .app-img {margin-bottom: -45px;}
    .ovvy .left-box ul.tech-stack {width: 57%;}
    .about-realestate .inner-content .con-box {width: 53%;}

}

@media screen and (max-width: 1919px) {
    .listing-desc .img-box {text-align: right;}
    .listing-desc .about-project .app-logo {width: 60%;}
    .listing-desc .img-box img {width: 70%;}
    .homer .color-box .about-project { width: 70%;}
    .homer .app-img {width: 80%;}
    .residally .right-box .upper-box {padding: 60px 50px;}
    .residally .about-project .app-logo {width: 200px;}
    .about-project h3 { font-size: 26px}
    .about-realestate h2 {font-size: 30px;}
    .ovvy .about-project .app-logo {width: 150px;}
    .ovvy .object {top: 50px;left: -110px;width: 245px;}
    .ovvy .img-box {width: 60%;}
    .realestate-services .common-service-box {border-radius: 40px;padding: 30px 35px;height: 450px;margin: 0 25px;}
    .realestate-banner h1 {font-size: 64px;}
    .realestate-banner .right-box h2 {font-size: 38px;}
    .realestate-banner .right-box p {font-size: 22px;}
    .listing-desc .left-box {width: 34%;}
    .listing-desc .img-box {padding-top: 30px;}
    .about-project p, .about-project p a {  font-size: 18px;}
    .listing-desc ul.tech-stack {width: 48%;}
    .homer ul.tech-stack {width: 40%;}
    .residally .left-box .swiper-container {height: 480px;}
    .ovvy .left-box {width: 35%;}
    .ovvy .left-box ul.tech-stack {width: 83%;}



}
@media screen and (max-width: 1599px) {
    .residally .left-box .swiper-container {width: 46%;height: 440px;}
    .realestate-banner h1 {font-size: 52px;}
    .realestate-banner .right-box {width: 52%;margin-top: 70px;}
    .realestate-banner .right-box h2 {font-size: 32px;}
    .realestate-banner .right-box p {font-size: 20px;}
    .about-realestate .inner-content .con-box {width: 75%;}
    .homer .color-box .about-project {width: 83%;}
    .listing-desc .left-box {width: 50%;}
    .listing-desc .img-box img {width: 75%;}
    .residally .about-project .app-logo {width: 190px;}
    .residally ul.tech-stack {width: 59%;}
    .about-realestate h2 {font-size: 24px;}
    .realestate-banner .right-box {width: 31%;}
}


@media screen and (max-width: 1439px) {
    .residally .left-box .swiper-container {width: 43%;height: 380px;}
    .residally .swiper-slide {border-radius: 16px;}
    .residally ul.tech-stack {width: 61%;}
    .residally .right-box .lower-box img {width: 80%;}
    .about-project p, .about-project p a {font-size: 16px;line-height: 24px;}
    .ovvy .left-box {width: 53%;}
    .ovvy .object {top: 0;width: 225px;left: -75px;} 
    .ovvy .img-box {padding-top: 50px;width: 75%;}
    .realestate-banner .right-box {width: 56%;}
    .realestate-banner .right-box p {font-size: 18px;}
    .realestate-banner h1 {font-size: 50px;}
    .realestate-banner .line {width: 83%;}
    .about-realestate .inner-content {gap: 50px;}
    .about-realestate .inner-content .con-box {width: 71%;}
    .common-section {padding: 80px 0;}
    .realestate-services .common-service-box {width: 490px;height: 415px;}
    .realestate-services .common-service-box p {font-size: 18px;}
    .realestate-banner .right-box h2 {font-size: 30px;}
    ul.tech-stack {gap: 15px;border-radius: 14px;}
    .about-project h3 {font-size: 24px;}
    .residally .left-box .swiper-container {width: 48%;height: 425px;}
    .homer .app-img {width: 76%;}
    .homer ul.tech-stack {width: 35%;}


   
}

@media screen and (max-width: 1365px) {
    .realestate-banner .custom-container {width: 70%;}
    .realestate-services .common-service-box {width: 460px;height: 490px;border-radius: 32px;}
    .realestate-services .common-service-box h3{font-size: 24px;}
    .realestate-services .common-service-box img {width: 80px;}
    
    
}

@media screen and (max-width: 1279px) {
    .listing-desc .left-box {width: 63%;}
    .listing-desc .img-box {padding-top: 0;}
    .about-project h3 {font-size: 22px;}
    .residally .left-box .swiper-container {width: 50%;height: 315px;}
    .residally .right-box .lower-box {padding: 35px 0;}
    .realestate-banner h1 {font-size: 42px;margin-bottom: 20px;}
    .realestate-banner .right-box {margin-top: 40px;}
    .realestate-banner .custom-container {width: 75%;gap: 35px;}
    .realestate-banner .right-box h2 {font-size: 26px;}
    .realestate-banner .right-box p {font-size: 16px;line-height: 24px;}
    .realestate-banner .line {width: 75%;}
    .common-section {padding: 40px 0;}
    .about-realestate h2 {font-size: 20px;}
    .about-realestate .inner-content {gap: 35px;}
    .realestate-services .common-service-box {width: 450px;height: 415px;border-radius: 24px;margin: 0 20px;}
    .realestate-services .common-service-box img {width: 70px;}
    .ovvy .left-box {width: 68%;}
    .residally .right-box .upper-box {margin-bottom: 12px}
    .residally .inner-container {gap: 12px;}
    .residally ul.tech-stack {width: 80%;}
    .whitelogo .navbar-dark .navbar-nav .nav-link::before {background: #534644;}
    
}

@media screen and (max-width: 1023px) {
    .residally .inner-container, .about-realestate .inner-content {flex-direction: column;}
    .residally .right-box, .residally .left-box , .about-realestate .inner-content .con-box{width: 100%;}
    .residally .right-box .upper-box {margin-bottom:0;}
    .residally .left-box {padding: 50px 0;}
    .residally .left-box .swiper-container {width: 35%;height: 350px;}
    .residally ul.tech-stack {width: 50%;margin: 0 auto;}
    .ovvy .container {flex-direction: column;flex-wrap: wrap;}
    .ovvy .left-box {width: 100%;text-align: center;}
    .residally .right-box .upper-box {text-align: center;}
    .realestate-banner h1 {font-size: 32px;padding-top: 50px;}
    .realestate-banner .custom-container {width: 83%;}
    .realestate-banner .right-box {margin-top: 20px;}
    .realestate-banner .right-box {width: 75%;}
    .realestate-banner .right-box h2 {font-size: 22px;}
    .realestate-services .common-service-box {width: 420px;height: 340px;border-radius: 20px;margin: 0 15px;}
    .realestate-services h2 {font-size: 26px;margin-bottom: 20px;}
    .ovvy .left-box ul.tech-stack {width: 55%;margin: 0 auto;background-color: #fff;}
    .realestate-services .common-service-box p {font-size: 16px;line-height: 24px;}
    .ovvy .object {top: -35px;width: 185px;left: -60px;}
    .ovvy .img-box {width: 90%;padding-top: 30px;}
    .residally .inner-container {gap: 0;}
    .residally .left-box {background: linear-gradient(-217deg, #031C22 4.61%, #0B3F4D 45.31%, #3E5D66 74.8%, #4E7B88 101.11%);}
    .homer .app-img {width: 85%;}
    .homer .color-box .about-project {width: 100%;}
    .homer ul.tech-stack {width: 55%;margin-top: 40px;}
    .listing-desc .container {flex-wrap: wrap;}
    .listing-desc .left-box {width: 100%;text-align: center;}
    .listing-desc .img-box  {text-align: center;}
    .realestate-page #Header {background-position: 34%;}
    .about-realestate h2 {font-size: 18px;margin-bottom: 20px;}
    .about-realestate .inner-content {gap: 20px;}
    .listing-desc ul.tech-stack {width: 30%;margin: 0 auto;}
    .homer .about-project .app-logo {width: 200px;}
    

}

@media screen and (max-width: 767px) {
    .realestate-banner .custom-container {flex-direction: column;gap: 15px;}
    .realestate-banner .right-box {width: 100%;text-align: center;}
    .realestate-banner .banner-img-box {order: 2;}
    .realestate-banner .line {width: 85%;}
    .realestate-banner h1 {font-size: 24px;padding-top: 85px;text-align: center;}
    .realestate-banner .right-box p {text-align: center;}
    .realestate-banner .line {top: 60px;}
    .ovvy .img-box {width: 100%;}
    .ovvy .left-box ul.tech-stack {width: 68%;}
    ul.tech-stack li img {width: 35px;}
    .residally .left-box .swiper-container {height: 300px;}
    .residally .slider-title {font-size: 24px;}
    .homer .app-img {width: 100%;}
    .homer ul.tech-stack {width: 68%;}
    .listing-desc .about-project .app-logo {width: 55%;}
    .listing-desc ul.tech-stack {width: 38%}
    .listing-desc .img-box img {width: 80%;}
    .listing-desc {background-position: center;}
    .residally ul.tech-stack {width: 55%;}
    .about-project .app-logo {margin-bottom: 15px}

    
    
}

@media screen and (max-width:639px) {
    .common-section {padding: 30px 0;}
    .residally .right-box .upper-box {padding: 30px;}
    .about-project h3 {font-size: 20px;}
    .residally ul.tech-stack {width: 70%;}
    .residally .right-box .lower-box img {width: 90%;}
    .residally .left-box .swiper-container {height: 275px;width: 48%;}
    .homer .about-project .app-logo {width: 170px;}
    .about-project h3 {margin-bottom: 12px;}
    .realestate-banner h1 {margin-bottom: 5px;}
    .realestate-banner .right-box h2 {margin-bottom: 15px;}
    .realestate-banner h1 {font-size: 22px;}
    .realestate-banner .right-box h2 {font-size: 18px;}
    .residally .left-box .swiper-container {height: 385px;width: 65%;}
    .residally .about-project .app-logo {width: 150px;}
    .about-project h3 {font-size: 18px;}
    .ovvy .about-project .app-logo {width: 120px;}
    .residally .left-box {flex-direction: column;}
    .residally .slider-title {text-align: center;font-size: 22px;margin-right: 0;}
}   

@media screen and (max-width: 479px) {
    .realestate-banner h1 { font-size: 20px;}
    .realestate-banner .right-box h2 {font-size: 16px;}
    p , .realestate-services .common-service-box p {font-size: 14px;line-height: 22px;}
    .realestate-services .common-service-box {padding: 20px 25px;width: 350px;height: 325px;}
    .realestate-services .common-service-box h3 {margin-bottom: 10px;font-size: 22px;}
    .realestate-services .common-service-box img {width: 60px;}
    .ovvy .object {top: -59px;width: 220px;left: -5px;}
    .ovvy .left-box ul.tech-stack , .residally ul.tech-stack {width: 100%;}
    .residally .left-box .swiper-container {height: 300px}
   
}