html,
body {
width: 100%;
height: auto;
margin: 0;
padding: 0;
overflow-x: hidden;
scroll-behavior: smooth;
}
body {
position: relative;
// font-size: 14px;
line-height: 24px;
color: #000;
-webkit-font-smoothing: antialiased;
padding-top: 90px;
font-family: 'Poppins', sans-serif;
// background-image:url(../images/black_bg.jpg)
background-color: #000;
// @media @max575 {
// padding-top: 164px;
// }
}
@max360: ~"(max-width: 360px)";
@max414: ~"(max-width: 414px)";
@max575: ~"(max-width: 575px)";
@max767: ~"(max-width: 767px)";
@max768: ~"(max-width: 767px)";
@max991: ~"(max-width: 991px)";
@max1199: ~"(max-width: 1199px)";
@max1200: ~"(max-width: 1200px)";
@max1366: ~"(max-width: 1366px)";
#colors() {
primary: #000;
secondary: #eab13a;
white: #ffffff;
black: #000000;
grey: #e9e9e9;
}
a {
cursor: pointer;
}
.font-s12 {
font-size: 11px;
}
.subheading {
display: inline-block;
position: relative;
color: #colors[secondary];
font-size: 40px;
// font-weight: bold;
margin-bottom: 0;
font-family: 'Merriweather', serif;
text-align: center;
@media @max575 {
font-size: 30px;
}
}
.list-head {
display: inline-block;
position: relative;
color: #colors[secondary];
font-size: 24px;
font-family: 'Montserrat', sans-serif;
border-bottom: 1px solid #373952;
@media @max575 {
font-size: 18px;
}
}
/****************************** navbar ****************************************/
nav .navbar-nav .nav-link,
nav .navbar-brand {
color: #colors[white];
// img {
// width: 190px;
// }
}
.navbar-toggler{
color: #000;
color: #fff;
}
.navbar-brand{
@media @max991{
margin-right: 25rem;
}
@media @max768{
margin-right: 17rem;
}
@media @max575{
margin-right: 11rem;
}
@media @max414{
margin-right: 5.5rem;
}
@media @max360{
margin-right: 4rem;
}
}
nav {
-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;
transition: all 1s ease-in-out;
// height: 80px;
// height: 100px;
box-shadow: 0px 0px 10px 0px #b3b3b326;
background: #colors[primary];
// background-size: cover;
// background-image: url("../images/gallery/bg2.jpg");
// background-position: top center;
// @media @max767 {
// height: auto;
// }
button.btn.popup-btn {
background: #colors[secondary];
color: #colors[white];
}
.container-fluid {
@media @max991 {
display: flex;
justify-content: end !important;
}
}
}
@media @max991{
.navbar-collapse{
border-top: 1px solid #colors[secondary];
text-align: center;
button{
margin:0 auto;
}
}
}
.nav-item {
padding: 0px;
font-weight: 500;
font-size: 16px;
}
.navbar-nav .active>.nav-link,
.navbar-nav a.nav-link.active,
.navbar-nav .nav-link.show,
.navbar-nav .show>.nav-link {
color: #colors[white];
}
// .navbar {
// @media @max575 {
// padding: 2rem 0;
// }
// }
.navbar-nav {
>li {
>a:hover,
>a:active,
>a:focus {
//border-bottom: 2px solid #colors[secondary];
color: #colors[secondary] !important;
}
}
}
//end .navbar-nav
.callback {
input.form-control {
border-color: #colors[primary];
;
}
input#submit {
font-size: 14px;
background: #colors[primary];
;
color: #colors[white];
font-weight: bold;
border-color: #colors[primary];
;
@media @max767 {
font-size: 14px;
}
}
}
/****************************** home ****************************************/
#about-us {
background-size: cover;
// clip-path: polygon(0 0, 50% 0, 50% 100%, 0% 100%);
// padding: 100px 0;
// background:#colors[primary];
// color: #colors[white];
// h3{
// color: #colors[white];
// }
.about {
// background-size: cover;
// background: rgba(0, 0, 0, 0.8);
// background-repeat: repeat;
// background-position: top center;
@media @max767 {
text-align: justify !important;
}
ul {
font-size: 18px;
li {
padding-bottom: 8px;
}
}
// img{
// width: 60px;
// }
}
.img-icon{
width: 50px;
}
h5{
color: #colors[white];
}
p{
line-height: 30px;
color: #fff;
}
.aboutConfig {
img {
padding-bottom: 15px;
width: 50px;
@media @max414{
padding-bottom: 0;
width: 36px;
}
}
p {
padding: 5px 0;
// border-right: 2px solid #colors[primary];
margin-bottom: 0;
font-size: 22px;
font-family: 'Montserrat', sans-serif;
font-weight: 500;
@media @max767 {
font-size: 18px;
}
}
h6 {
color: #colors[secondary];
b {
font-size: 28px;
font-family: 'Montserrat', sans-serif;
font-weight: 500;
}
padding: 5px 0;
// border-right: 2px solid #colors[primary];
margin-bottom: 0;
@media @max1199 {
b {
font-size: 24px;
}
}
@media @max767 {
b {
font-size: 24px;
}
font-size: 16px;
margin-bottom: 0;
}
}
sup {
font-size: 12px;
font-weight: bold;
// color: #colors[white];
@media @max767 {
bottom: 5px;
}
}
.col-lg-3 {
padding: 0px;
@media @max991 {
margin-bottom: 30px;
&:nth-child(2) h6,
&:nth-child(2) p,
{
border-right: none;
}
}
div {
&:first-child {
// background: #be95524d;
background: #9977304d;
padding: 10px 0;
border-top: 3px solid #colors[primary];
margin-bottom: 10px;
}
}
&:last-child h6,
&:last-child p {
border-right: none;
}
}
}
}
#specification {
// background: #colors[primary];
// color: #colors[white];
// background: #0000000d;
.card-title {
margin-bottom: 0;
color: #colors[primary];
&:hover{
text-decoration:none;
}
}
.subheading {
// padding-left: 22px;
// color: white;
img {
width: 70px;
}
p {
font-size: 25px;
margin-top: 10px;
}
}
span {
font-weight: bold;
font-size: 18px;
}
li {
font-size: 16px;
line-height: 24px;
padding-bottom: 7px;
}
.ame-img {
text-align: center;
img {
width: 60px;
}
}
.amibg-left {
width: 50%;
position: absolute;
z-index: -9;
opacity: 0.2;
top: 0;
left: 0;
}
.amibg-right {
width: 40%;
position: absolute;
z-index: -9;
opacity: 0.2;
top: 0;
right: 0;
}
.card{
background-color: #e4e5e7;
border: 1px solid #ffffff35;
}
.card-header{
border-bottom: 1px solid #colors[primary];
background: url(../images/up.png) no-repeat calc(100% - 10px) center;
background-size: 16px;
cursor: pointer;
font-size: 18px;
&.collapsed {
background-image: url(../images/down.png);
}
}
.card-body{
padding: 1.25rem 0;
}
}
#gallery {
.col-sm-4,
.col-sm-8 {
// margin-bottom: 30px;
margin-bottom: 5px;
@media @max575{
margin-bottom: 1px;
}
img{
border: 1px solid #colors[primary];
}
.blur{
filter: blur(1px);
}
}
}
#floor-plan {
.col-sm-4,
.col-sm-8 {
margin-bottom: 30px;
// margin-bottom: 5px;
img{
border: 1px solid #colors[primary];
}
.blur{
filter: blur(1px);
}
}
}
// #gallery {
// // background: #colors[grey];
// img{
// border: 1px solid #888;
// }
// .nav-tabs {
// justify-content: center;
// border: none !important;
// }
// .nav-tabs .nav-item.show .nav-link,
// .nav-tabs .nav-link.active {
// color: #fff !important;
// background-color: #colors[primary] !important;
// border: 1px solid #colors[primary];
// }
// .nav-tabs .nav-link:focus,
// .nav-tabs .nav-link:hover {
// color: #fff !important;
// background: #colors[primary] !important;
// border: 1px solid #colors[primary];
// }
// .nav-tabs .nav-link {
// // background: #colors[secondary] !important;
// // color: #fff !important;
// width: auto;
// border: 1px solid #colors[secondary];
// border-radius: 5px;
// margin: 20px 5px;
// cursor: pointer;
// @media @max767 {
// margin: 10px 0;
// padding: 5px 8px;
// }
// }
// .nav-item {
// @media @max767 {
// padding: 0px 3px !important;
// }
// }
// .tab-content {
// .col-sm-3 {
// margin: 20px 0;
// }
// }
// button.owl-next,
// .owl-prev {
// outline: none;
// span {
// font-size: 59px;
// font-family: initial;
// }
// }
// }
#amenities {
// background-color: #colors[primary];
img {
width: 60px;
margin-bottom: 5px;
@media @max575{
width:35px;
}
}
.col-sm-4 {
margin-bottom: 15px;
}
.amenities-slider{
padding: 50px 0 0;
}
.aminity-img{
img{
margin-left: 70px;
@media @max575{
width:50px;
margin-left: 60px;
}
}
p{
padding-top: 15px;
font-size: 14px;
font-weight: 400;
text-align: center;
}
}
.heading {
padding-left: 22px;
img {
width: 70px;
}
p {
font-size: 25px;
margin-top: 10px;
}
}
ul {
li {
font-size: 16px;
line-height: 28px;
text-transform: uppercase
}
}
.amibg-left {
width: 50%;
position: absolute;
z-index: -9;
opacity: 0.2;
top: 0;
left: 0;
}
.amibg-right {
width: 40%;
position: absolute;
z-index: -9;
opacity: 0.2;
top: 0;
right: 0;
}
.amenities-inner {
// box-shadow: 0 0 10px 0 #00000012;
padding: 10px 0;
margin-bottom: 20px;
border-radius: 10px;
@media @max575{
margin-bottom: 0;
}
p{
margin-bottom: 0;
color: #fff;
@media @max575{
font-size: 12px;
}
}
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
color: #fff;
background-color: #colors[primary];
border-color: #dee2e6 #dee2e6 #fff;
}
.nav-tabs .nav-link {
border: 0;
// border-top-left-radius: .25rem;
// border-top-right-radius: .25rem;
border-radius: 5px;
background-color: #fff;
cursor: pointer;
@media @max360{
font-size: 14px;
}
}
}
.floor{
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
color: #fff;
background-color: #colors[primary];
border-color: #dee2e6 #dee2e6 #fff;
}
.nav-tabs .nav-link {
border: 0;
// border-top-left-radius: .25rem;
// border-top-right-radius: .25rem;
border-radius: 5px;
background-color: #fff;
cursor: pointer;
@media @max360{
font-size: 14px;
}
}
}
#location {
// background: #808081;
// color: #colors[white];
.border-right {
border-right: 1px solid #colors[secondary] !important;
}
img {
border: 1px solid #colors[secondary];
}
.heading {
margin-bottom: 5px;
}
.accordion .fa {
margin-right: 0.5rem;
}
.accordion button,
.accordion button:hover,
.accordion button:focus {
text-decoration: none;
}
.card-header {
// border: 1px solid #colors[secondary];
border: 1px solid #808080;
background: transparent;
// margin: 25px;
margin-bottom: 5px;
margin-top: 0;
margin-right: 0;
padding: 7px 20px;
@media @max767 {
margin: 0px;
margin-bottom: 5px;
}
.btn {
font-weight: 600;
}
}
.card-body {
padding: 10px 20px;
border: 1px solid #808080;
// border: 1px solid #colors[black];
border-top: none;
// margin: 25px;
margin-top: -5px;
margin-bottom: 5px;
color: #colors[black];
margin-right: 0;
@media @max767 {
margin: 0px;
margin-top: -5px;
margin-bottom: 5px;
}
}
.card-title {
margin-bottom: 0.75rem;
font-size: 16px;
font-weight: 600;
color: #colors[primary];
}
.card {
// padding-left: 25px;
//background: #808081;
border: none;
// background-color: #e4e5e7;
@media @max767 {
padding-left: 0px;
}
}
.accordion .card-header:before {
font-family: "FontAwesome";
content: "\f068";
float: right;
// margin-left: -70px;
border: 2px solid #colors[primary];
padding: 0 10px;
color: #colors[primary];
@media @max767 {
float: right;
}
}
.accordion .card-header.collapsed:before {
content: "\f067";
color: #colors[primary];
}
.subheading {
color: #colors[primary];
}
}
#contact-us {
.row{
background:linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0.7)), url(../images/gallery/Gallery-pic3.jpg) rgba(0, 0, 0, 0.5);
background-size: cover;
// background-attachment: fixed;
background-position:top;
}
#contact-form {
// background: url(../images/gallery/Gallery-pic1.jpg) rgba(0, 0, 0, 0.5);
// background-size: cover;
// background-attachment: fixed;
// background-position: 50% 17%;
height: 550px;
.contact {
background-size: cover;
// background: rgba(0, 0, 0, 0.7);
background-repeat: repeat;
background-position: top center;
height: 550px;
padding: 5% 10% !important;
@media @max767 {
padding: 3% 7% !important;
}
}
p {
color: #colors[white] !important;
}
h3 {
color: #colors[white] !important;
}
.subheading:before {
content: "";
background-color: #colors[white];
}
.subheading:after {
content: "";
background-color: #colors[white];
}
.input-container {
display: -ms-flexbox;
/* IE10 */
display: flex;
width: 100%;
margin-bottom: 15px;
}
.icon {
padding: 5px;
background: #colors[primary];
color: #colors[white];
min-width: 50px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
font-size: 24px;
}
.input-field {
width: 100%;
padding: 10px;
outline: none;
}
.input-field:focus {
border: 2px solid #colors[primary];
}
/* Set a style for the submit button */
.btn {
background-color: #colors[primary];
color: #colors[white];
padding: 10px 20px;
border: none;
cursor: pointer;
// width: 100%;
opacity: 0.9;
text-align: center;
margin: auto;
display: flex;
}
.btn:hover {
opacity: 1;
}
}
}
/****************************** Footer ****************************************/
.fixed-footer {
position: fixed;
bottom: 0px;
left: 0px;
right: 0px;
z-index: 999;
.col-6 {
padding: 0px !important;
border-left: 1px solid #fff;
}
.fixed_contact2 {
text-align: center;
color: #colors[white];
text-decoration: none;
font-size: 16px;
background-color: #colors[secondary];
padding: 8px 0px !important;
font-size: 20px;
font-weight: bold;
@media @max575{
font-size: 16px;
}
}
.fixed_contact1 {
text-align: center;
color: #colors[white];
text-decoration: none;
font-size: 16px;
background-color: #25d366;
padding: 8px 0px !important;
font-size: 16px;
font-weight: bold;
i {
font-weight: bold;
}
}
}
.reach {
position: fixed;
right: 15px;
bottom: 15px;
border: none;
padding: 5px 20px;
// font-weight: 600;
font-size: 20px;
background: #colors[primary];
color: #colors[white];
border: 2px solid #fff;
cursor: pointer;
outline: none !important;
// transform: rotate(-90deg);
z-index: 999999;
@media @max767 {
display: none;
}
}
#footer {
// background-color: #colors[primary];
background:url(../images/bg.png);
a,
p,
h6,
h4,h5 {
color: #colors[white];
}
.project-by {
.Logo1 {
// width: 210px;
@media @max767 {
// width: 100%;
}
}
.Logo2 {
// width: 210px;
@media @max767 {
// width: 70%;
}
@media @max575{
width:90px;
}
}
.Logo3 {
width: 200px;
@media @max767 {
width: 45%;
}
}
.col-sm-4 {
border-right: 1px solid #6c6c6c2b;
&:last-child {
border-right: none;
}
}
}
.footer {
background-color: #colors[white];
p {
margin-bottom: 0px;
color: #colors[black] !important;
}
}
}
/****************************** Mobile ****************************************/
@media @max767 {
.pt15 {
padding-top: 15px;
}
.mb41 {
margin-bottom: 41px;
}
.item {
// pointer-events: none;
}
}
.main-btn-circle {
position: relative;
margin: 0;
font-family: "Roboto", sans-serif;
color: #fffff0;
background-color: #colors[primary];
text-transform: uppercase;
font-size: 25px;
letter-spacing: 1px;
outline: none;
cursor: pointer;
z-index: 100;
}
.main-btn-circle {
height: 30px;
width: 30px;
-webkit-border-radius: 50%;
border-radius: 100%;
line-height: 30px;
-webkit-transition: box-shadow 0.3s;
-o-transition: box-shadow 0.3s;
transition: box-shadow 0.3s;
}
.main-btn-rect {
position: relative;
display: block;
padding: 8px 35px;
margin: 0px auto;
font-size: 18px;
background-color: #colors[primary];
color: #fff;
}
.popup .fade-out {
position: absolute;
top: 3px;
right: 3px;
text-align: center;
font-size: 11px;
font-weight: bold;
}
.main-btn-circle:hover {
-webkit-box-shadow: inset 2px 1px 0px 20px rgba(255, 255, 240, 0.2);
-moz-box-shadow: inset 2px 1px 0px 20px rgba(255, 255, 240, 0.2);
box-shadow: inset 2px 1px 0px 20px rgba(255, 255, 240, 0.2);
}
.popup {
position: fixed;
top: 100%;
width: 100%;
height: 100%;
z-index: 10001;
.input-container {
display: -ms-flexbox;
/* IE10 */
display: flex;
width: 100%;
margin-bottom: 15px;
}
.icon {
padding: 5px;
background: #colors[primary];
color: #colors[white];
min-width: 50px;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
font-size: 24px;
}
.input-field {
width: 100%;
padding: 10px;
outline: none;
border: 1px solid #colors[primary];
color: #777;
}
.input-field:focus {
border: 2px solid #colors[primary];
}
/* Set a style for the submit button */
.btn {
background-color: #colors[primary];
color: #colors[white];
padding: 10px 20px;
border: none;
cursor: pointer;
// width: 100%;
opacity: 0.9;
text-align: center;
margin: auto;
display: flex;
}
.btn:hover {
opacity: 1;
}
}
.popup.active {
top: 0;
// background-color: rgba(3, 3, 3, 0.98);
background-color: rgba(43, 59, 108, 0.8);
transition: background-color 0.6s, opacity 0.6s;
}
.popup .popup-content {
position: absolute;
top: 50%;
left: 50%;
// max-height: 615px;
max-height: 590px;
// max-height: 568px;
min-width: 300px;
margin-top: 150px;
padding: 25px;
background-color: #fffff0;
color: #070000;
-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12),
0 1px 2px rgba(0, 0, 0, 0.24);
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transition: margin 0.6s;
-webkit-transition: margin 0.6s;
-moz-transition: margin 0.6s;
-o-transition: margin 0.6s;
}
.popup.active .popup-content {
margin-top: 0px;
}
.new-anim-sec {
margin-top: -30px;
.col-lg-3 {
border-right: 1px solid #0000001c;
@media @max991 {
margin-top: 30px;
}
@media @max575 {
border: 0;
}
&:last-child {
border-right: 0;
}
&:nth-child(2) {
@media @max991 {
border-right: 0;
}
}
}
.new-anim-box-dtl p {
font-size: 18px;
padding-top: 10px;
margin-bottom: 0;
@media @max991 {
font-size: 16px;
}
}
}
.walkthrough-vdo {
padding: 50px 0 100px;
@media @max575 {
padding: 50px 0 0;
}
iframe {
// height: 315px;
@media @max575 {
height: 200px;
}
}
}
.project-part {
@media @max767 {
border-right: 0px !important;
border-bottom: 1px solid #dee2e6;
}
}
.aminitis-img{
width: 100% !important;
}
button{
margin: 0;
padding: 0;
background: none;
border: none;
border-radius: 0;
outline: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
.slide-arrow{
position: absolute;
top: 36%;
margin-top: -15px;
}
.prev-arrow{
left: -40px;
width: 0;
height: 0;
border-left: 0 solid transparent;
border-right: 15px solid #757575;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
@media @max575{
left:0;
}
}
.next-arrow{
right: -40px;
width: 0;
height: 0;
border-right: 0 solid transparent;
border-left: 15px solid #757575;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
@media @max575{
right:0;
}
}
button:focus {
outline: none;
}
.img-icon-1{
width:40px !important;
padding-bottom:20px !important;
@media @max414{
padding-bottom:8px !important;
width:36px !important;
}
}
.sheak i{
animation: headShake 0.9s linear 1s infinite alternate;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
/* Firefox */
input[type=number] {
-moz-appearance: textfield;
}
.enq-now {
background-color: #colors[primary];
color: #ffffff;
font-weight: 500;
}
.btn:focus{
box-shadow: none;
}
.tz-gallery {
margin-bottom: 0px;
text-align: center;
.photos {
margin-bottom: 24px;
// display: none;
a {
position: relative;
img {
padding: 10px;
border: 1px solid #ececec;
transition: all 0.5s;
width: 100%;
}
.zoom-icon {
position: absolute;
top: -20px;
right: 41%;
img {
border: none;
display: none;
transition: all 0.5s ease-in-out;
width: 64px;
@media only screen and (max-width: 767px) {
width: 52px;
}
}
@media only screen and (max-width: 767px) {
top: -18px;
right: 38%;
}
}
&:hover img {
opacity: 0.5;
}
&:hover .zoom-icon img {
display: block;
opacity: 1;
}
}
}
.load-btn {
padding: 15px;
font-size: 18px;
color: #fff;
background-color: #707072;
.right {
width: 32px;
margin-right: 16px;
@media only screen and (max-width: 767px) {
width: 26px;
margin-right: 10px;
}
}
.right-change {
width: 32px;
margin-right: 16px;
display: none;
@media only screen and (max-width: 767px) {
width: 26px;
margin-right: 10px;
}
}
&:hover {
color: #000;
text-decoration: none;
}
&:hover .right {
display: none;
}
&:hover .right-change {
display: inline;
}
@media only screen and (max-width: 767px) {
font-size: 16px;
}
}
// @media only screen and (max-width: 767px) {
// margin-bottom: 40px;
// }
// @media only screen and (max-width: 414px) {
// margin-bottom: 30px;
// }
}
.baguetteBox-button {
background-color: transparent !important;
}
#baguetteBox-overlay .full-image img {
@media only screen and (max-width: 767px) {
width: 75% !important;
}
}
#accordian .card-header{
position: relative;
}
.accordion-button::after {
content: "\f107";
font-family: 'FontAwesome';
font-weight: 900;
position: absolute;
right: 20px;
top: 17px;
font-size: 18px;
}
.accordion-button.collapsed::after {
content: "\f106";
font-family:'FontAwesome';
font-weight: 900;
// float: right;
}
.card{
margin-bottom: 10px;
}
.card-body{
ul{
margin-bottom: 0;
}
}
.blur{
filter: blur(2px);
}
.abt-developer{
background-color: #colors[black];
}
.abt-dev-main{
background-color: #colors[black];
}
.cntr-main{
.cntr{
text-align: center;
margin-bottom: 40px;
@media @max575{
// margin-bottom: 0;
}
h4{
font-size: 35px;
font-weight: 700;
color: #colors[secondary];
@media @max575{
font-size: 26px;
}
}
p{
font-size: 20px;
text-transform: uppercase;
color: #fff;
margin-bottom: 0;
@media @max575{
font-size: 16px;
}
}
}
@media @max767{
.cntr{
border-right: 0;
padding-bottom: 20px;
}
}
@media @max575{
.cntr{
padding-bottom: 0;
}
}
}
/* ===== Beige Pattern Background ===== */
.hinjawadi-section{
padding:90px 0 0;
background-color:#efe6d6;
/* geometric pattern */
background-image:
linear-gradient(30deg, #e3d9c6 12%, transparent 12.5%, transparent 87%, #e3d9c6 87.5%, #e3d9c6),
linear-gradient(150deg, #e3d9c6 12%, transparent 12.5%, transparent 87%, #e3d9c6 87.5%, #e3d9c6),
linear-gradient(30deg, #e3d9c6 12%, transparent 12.5%, transparent 87%, #e3d9c6 87.5%, #e3d9c6),
linear-gradient(150deg, #e3d9c6 12%, transparent 12.5%, transparent 87%, #e3d9c6 87.5%, #e3d9c6),
linear-gradient(60deg, #e7decd 25%, transparent 25.5%, transparent 75%, #e7decd 75%, #e7decd),
linear-gradient(60deg, #e7decd 25%, transparent 25.5%, transparent 75%, #e7decd 75%, #e7decd);
background-size:40px 70px;
background-position:0 0, 0 0, 20px 35px, 20px 35px, 0 0, 20px 35px;
}
/* Heading */
.location-header h1{
font-size:52px;
letter-spacing:3px;
color:#000;
font-weight:600;
}
.location-header h2{
font-size:34px;
font-weight:400;
margin-top:10px;
color:#1c1c1c;
}
/* Blue bar */
.connectivity-bar{
margin-top:50px;
background:linear-gradient(to bottom, #000, #000);
color:#fff;
padding:28px 20px;
font-size:24px;
line-height:1.7;
letter-spacing:.5px;
border-bottom:1px solid #colors[secondary];
}
.connectivity-bar span{
margin:0 18px;
opacity:.7;
}
/* Mobile */
@media(max-width:768px){
.location-header h1{ font-size:36px; }
.location-header h2{ font-size:22px; }
.connectivity-bar{
font-size:16px;
padding:20px;
}
.connectivity-bar span{
margin:0 10px;
}
}
.investor-value{
background:#0b0b0b;
color:#fff;
padding:100px 0;
}
/* title */
.title{
font-size:46px;
color:#d4a646;
font-weight:500;
line-height:1.2;
margin-bottom:20px;
}
/* description */
.desc{
font-size:18px;
color:#dcdcdc;
line-height:1.7;
}
/* building */
.building{
max-height:520px;
}
/* benefit cards */
.benefits{
margin-top:70px;
}
.benefit-card{
background:#121212;
border:1px solid #2a2a2a;
padding:28px 24px;
margin-bottom:25px;
height:100%;
transition:.3s;
}
.benefit-card h4{
color:#d4a646;
font-size:20px;
margin-bottom:8px;
}
.benefit-card p{
color:#cfcfcf;
font-size:15px;
}
.benefit-card:hover{
border-color:#d4a646;
transform:translateY(-5px);
}
/* mobile */
@media(max-width:768px){
.title{font-size:32px;}
.desc{font-size:16px;}
.building{margin-top:40px;}
}
.advantage-content{
color:#fff;
}
.advantage-list{
list-style:none;
padding-left:0;
position:relative;
margin-left:40px;
}
/* vertical line */
.advantage-list:before{
content:"";
position:absolute;
left:-23px;
top:5px;
bottom:5px;
width:2px;
background:#cfcfcf;
}
/* items */
.advantage-list li{
position:relative;
margin-bottom:26px;
font-size:18px;
color:#ddd;
}
/* dots */
.advantage-list li:before{
content:"";
position:absolute;
left:-27px;
top:7px;
width:10px;
height:10px;
background:#fff;
border-radius:50%;
border:2px solid #cfcfcf;
}
@media(max-width:991px){
.gold-heading{
font-size:34px;
text-align:center;
}
.advantage-content{
text-align:center;
}
.advantage-list{
margin-left:0;
padding-left:0;
}
.advantage-list:before{
display:none;
}
.advantage-list li:before{
display:none;
}
}
.capital-section{
background:#000;
padding:100px 0;
color:#fff;
}
/* heading */
.capital-title{
color:#d4a437;
font-size:46px;
margin-bottom:70px;
font-weight:500;
}
.capital-title span{
letter-spacing:2px;
}
/* outer border */
.capital-box{
border:1px solid #b8963f;
}
/* image blocks */
.capital-img img{
width:100%;
height:260px;
object-fit:cover;
}
/* text blocks */
.capital-text{
background:#050505;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
min-height:260px;
}
.capital-inner{
padding:30px 20px;
}
.number{
width:70px;
height:70px;
background:#e9e2d3;
color:#000;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-weight:600;
font-size:24px;
margin:0 auto 20px;
}
.capital-text p{
color:#e5e5e5;
line-height:1.6;
font-size:16px;
}
/* responsive */
@media(max-width:991px){
.capital-title{
font-size:34px;
}
.capital-img img,
.capital-text{
height:auto;
min-height:220px;
}
}
.investor-section{
background:#000;
color:#fff;
margin-bottom:50px;
}
/* layout */
.investor-wrapper{
position:relative;
}
.investor-side{
position:relative;
// min-height:650px;
display:flex;
align-items:center;
padding:00px 20px;
justify-content: center;
}
/* background images */
// .left-side{
// background:url("left.jpg") center/cover no-repeat;
// }
// .right-side{
// background:url("right.jpg") center/cover no-repeat;
// }
/* dark overlay */
.investor-side::before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(to top, rgba(0,0,0,0.95) 20%, rgba(0,0,0,0.45) 70%, rgba(0,0,0,0.2) 100%);
}
.content{
position:relative;
max-width:650px;
}
/* heading */
.investor-side h2{
font-size:38px;
margin-bottom:25px;
font-weight:500;
color:#e2d1a3;
}
/* points grid */
.points{
display:grid;
grid-template-columns:1fr 1fr;
gap:18px;
}
.point{
background:#e6d8b8;
color:#000;
padding:16px 18px;
border-radius:8px;
font-size:15px;
line-height:1.4;
}
/* center divider */
.center-line{
position:absolute;
left:50%;
top:0;
bottom:0;
width:1px;
background:#caa84b;
transform:translateX(-50%);
}
/* responsive */
@media(max-width:991px){
.center-line{ display:none; }
.investor-side{
min-height:auto;
padding:10px 20px;
}
.points{
grid-template-columns:1fr;
}
.investor-side h2{
font-size:20px;
text-align: center;
}
}