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; } }