/* Theme Name: Itawa - Real Estate Responsive HTML Landing Page Template
Author: Rajesh-Doot
Version: 1.0.0
File Description: Main CSS file of the template*/
/**Table of contents**/
/** 1.Common css
2.Header
3.Hero section
4.Apartments list
5.Location Advantages
6.Amenities
7.Floor plans
8.Specification
9.CTA
10.Gallery
11.Location
12.Agents
13.Reviews
14.Other projects
15.Enquire form
16.Footer **/
/**1.Common css**/
/*scrollbar theme*/
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: #e8e8e8;
}
::-webkit-scrollbar-thumb {
background: #530014;
}
::-webkit-scrollbar-thumb:hover {
background: #e2494f;
}
* {
-webkit-font-smoothing: antialiased;
-moz-os-font-smoothing: grayscale;
box-sizing: border-box;
-moz-transition: all 0.5s;
-o-transition: all 0.5s;
-webkit-transition: all 0.5s;
transition: all 0.5s;
padding: 0;
margin: 0;
}
body {
font-family: 'Poppins', sans-serif;
color: #9ACD32;
font-weight: 400;
font-style: normal;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Poppins', serif;
font-weight: 900;
line-height: 2;
}
h1, h2, h3, h4, h5, h6, p, ul {
margin: 0;
padding: 0;
}
p {
font-size: 16px;
font-weight: 400;
line-height: 1.5;
letter-spacing: .1px;
}
ul {
list-style: none;
margin-top: 8px;
}
a:hover {
text-decoration: none;
}
button:focus {
outline: none !important;
}
.padbtm0 {
padding-bottom: 0 !important;
}
.mt45 {
margin-top: 45px;
}
.mt15 {
margin-top: 15px;
}
.pad-tb {
padding-top: 70px;
padding-bottom: 70px;
}
.common-heading {
padding: 0;
text-align: center;
}
.common-heading h2 {
font-size: 50px;
font-weight: 600;
margin-bottom: 8px;
}
.common-heading p {
font-size: 14px;
}
.v-center {
align-self: center;
}
/**2.Header**/
.navbar-toggler {
background-color: #fff;
border: 1px solid #fff;
}
.top-header .sticky {
background: #9ACD32;
-webkit-box-shadow: 0 4px 6px 0 rgba(12, 0, 46, .08);
box-shadow: 0 4px 6px rgba(0,0,0,.1);
}
.top-header .nav-link:hover {
color: #ffffff !important;
}
.top-header .nav-link:hover .nav-number {
color: #861b11 !important;
}
.top-header .nav-link {
font-weight: 600;
font-size: 17px;
color: #000;
}
.top-header .nav-link.active {
color: 861b11 !important;
}
.top-header .nav-link.active:after {
transition: all 0.2s linear 0s;
background: 861b11;
width: 90%;
}
.top-header .nav-link:after {
content: '';
display: block;
height: 2px;
text-align: center;
left: 0;
right: 0;
width: 0;
float: none;
background: #d21402;
transition: width 0.4s ease, background-color 0.4s ease;
-webkit-transform: translateX(0%);
-ms-transform: translateX(0%);
-o-transform: translateX(0%);
transform: translateX(0%);
-webkit-transition: all 0.4s;
-o-transition: all 0.4s;
transition: all 0.4s;
margin: 0px auto 0;
position: relative;
bottom: -4px;
}
.fixed-top {
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 1034;
padding-top: 0;
padding-bottom: 0;
height: 90px;
}
.brand-logo a {
display: block;
}
.header-right ul li:after {
content: "";
position: absolute;
border-right: 1px solid #eee;
height: 30px;
right: -12px;
top: 10px;
}
.header-right ul li:last-child:after {
content: "";
position: absolute;
border-right: 0px solid #eee;
}
/**3.Hero section**/
.hero-section {
position: relative;
overflow: hidden;
background: #d1b398 url(../images/common/bg.png) repeat;
padding-top: 100px;
padding-bottom: 50px;
}
.header-heading {
margin: 0px 50px 0 0;
}
.header-heading h1 {
font-weight: 700;
font-size: 55px;
line-height: 1.3;
margin-bottom: 25px;
}
.header-heading p {
font-size: 18px;
line-height: 1.5;
margin-bottom: 30px;
font-weight: 500;
}
.single-image .item {
border-radius: 8px;
overflow: hidden;
}
.owl-item.active.center .item {
opacity: 1;
-webkit-transform: scale3d(1.0, 1.0, 1);
transform: scale3d(1.0, 1.0, 1);
}
.owl-carousel .owl-dots .owl-dot.active span,
.owl-carousel .owl-dots .owl-dot:hover span {
background: #fff;
transform: translate3d(0px, -50%, 0px) scale(0.7);
transition: all 250ms ease-out 0s;
}
.owl-carousel .owl-dots {
display: inline-block;
width: 100%;
text-align: center;
margin: 20px 0 0 0;
position: absolute;
transition: all 250ms ease-out 0s;
}
.owl-carousel .owl-dots .owl-dot {
display: inline-block;
}
.owl-carousel .owl-dots .owl-dot span {
background: #fff;
display: inline-block;
height: 20px;
margin: 0 2px 5px;
transform: translate3d(0px, -50%, 0px) scale(0.3);
transform-origin: 50% 50% 0;
transition: all 250ms ease-out 0s;
width: 20px;
border-radius: 50%;
}
/**4.Apartments list**/
.project-card-:hover {
box-shadow: 0 0 10px #e6e3e3;
top: -5px;
}
.project-card- {
border-radius: 6px;
overflow: hidden;
background: #fff;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
top: 0px;
position: relative;
}
.project-card img {
width: 100%;
}
.apartments-list {
overflow-x: hidden;
background: #fff;
padding-bottom: 80px;
}
.apartments-list .mt45 {
margin-top: 35px;
}
.apartments-list .owl-stage {
padding-bottom: 10px;
padding-top: 10px;
}
.apartments-list .owl-stage-outer {
position: relative;
}
.project-card {
}
.home-details {
padding: 20px;
border: 1px solid #e8e8ef;
border-radius: 0px 0px 6px 6px;
}
.home-details h3 {
font-weight: 700;
font-size: 18px;
line-height: 1.5;
margin: 0 0 4px 0;
}
.feature-list {
margin: 10px 0 0 0;
color: #0a2233;
}
.feature-list li {
display: inline-block;
padding: 0 15px 0 0;
}
.feature-list li i {
padding: 0 5px 0 0;
font-size: 16px;
}
/**5.Location Advantages**/
.feature-section {
background: url(../images/common/dot.png) #f4f6f8;
}
.feature-image {
border-radius: 6px 6px 6px 50px;
overflow: hidden;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
}
/**6.Amenities**/
.amenities-section {
background: #fff;
}
.amenities-card:hover {
box-shadow: 0 0 10px #e6e3e3;
top: -5px;
}
.amenities-card {
text-align: center;
background: #9ACD32;
border-radius: 6px;
padding: 20px;
margin: 5px 0;
-webkit-box-shadow: 0 3px 6px rgb(91 130 148 / 8%);
box-shadow: 0 3px 6px rgb(91 130 148 / 8%);
top: 0px;
position: relative;
border: 1px solid #231c1e;
cursor: grab;
color: #fff;
}
.amenities-card-icon-section {
width: 70px;
margin: 0 auto 15px;
background: #e0b024;
border-radius: 32% 68% 64% 36% / 39% 58% 42% 61%;
padding: 8px;
}
.amenities-card h3 {
font-weight: 700;
font-size: 18px;
line-height: 1.5;
margin: 0 0 4px 0;
}
.amenities-card p {
font-size: 16px;
}
/**7.Floor plans**/
.floor-plans:hover {
box-shadow: 0 0 10px #e6e3e3;
top: -5px;
}
.floor-plans {
text-align: center;
margin-top: 30px;
border-radius: 6px;
overflow: hidden;
background: #fff;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
top: 0px;
position: relative;
}
.floor-plans h3 {
font-weight: 700;
font-size: 18px;
line-height: 1.5;
padding: 20px;
border: 1px solid #e8e8ef;
border-radius: 0px 0px 6px 6px;
}
.floor-plans a {
display: block;
}
.floor-img {
display: block;
border-radius: 8px;
width: 100%;
border: solid 1px #ccc;
}
.floor-img img {
width: 100%;
}
/**8.Specification**/
.nav-filter {
margin: 45px auto 0px;
display: table;
}
.nav-filter .nav-tabs {
border-bottom: 0px solid #dee2e6;
}
.nav-filter .nav-item .nav-link1.active {
color: #ffffff;
background: #530014;
}
.nav-tabs .nav-item {
margin: 0px 10px 10px 10px;
}
.nav-filter .nav-item .nav-link1 {
color: #0a2233;
line-height: 1;
font-family: Poppins;
padding: 10px 20px;
border: 0;
background: #a61e2229;
border-radius: 6px;
font-size: 15px;
text-align: center;
display: block;
}
.specification-section {
background: #fff;
}
.list-features li {
font-size: 16px;
color: #0a2233;
line-height: 1.5;
background: url(../images/common/2.png);
background-size: 18px;
background-repeat: no-repeat;
background-position: 5px 2px;
padding-left: 30px;
margin-top: 10px;
}
.h4-heading {
font-size: 18px;
font-weight: 700;
margin: 0px 0 20px 0;
}
/**9.CTA**/
.cta-section:before {
content: "";
position: absolute;
background: rgba(10, 34, 51, .9);
height: 100%;
width: 100%;
top: 0;
right: 0;
left: 0;
}
.cta-section {
background: url(../images/common/dots.png);
position: relative;
}
.mt30 {
margin-top: 30px;
}
.mt30a {
margin-top: 30px;
}
.cta-heading p {
font-size: 36px;
font-weight: 800;
color: #ffffff;
line-height: 1.5;
font-family: "Poppins";
}
.cta:hover {
background-color: #0a2233;
color: #fff;
top: -5px;
box-shadow: 0 5px 10px rgba(10, 34, 51, .2);
}
.cta {
font-size: 16px;
font-weight: 400;
font-family: "Poppins";
padding: 0px 40px;
line-height: 40px;
text-align: center;
outline: none;
color: #fff;
background-color: #9ACD32;
border: none;
border-radius: 6px;
display: inline-block;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
top: 0px;
position: relative;
}
.cta:hover {
color: #fff;
}
.mt20 {
margin-top: 12px;
}
.cta-text {
align-self: center;
}
/**10.Gallery**/
.gallery-section {
background: #f4f6f8;
}
.gallery-:hover {
box-shadow: 0 0 10px #e6e3e3;
top: -5px;
}
.gallery- {
position: relative;
top: 0;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
margin: 30px 0 0px 0;
}
.gallery- a img {
display: block;
border-radius: 6px;
}
/**11.Location**/
.location-section iframe {
width: 100%;
height: 300px;
border-radius: 6px;
}
.loc-adlit li {
list-style: none;
padding: 0 0 5px 0;
font-size: 16px;
}
.loc-adlit li span {
list-style: none;
text-align: right;
float: right;
font-weight: bold;
}
/**12.Agents**/
.agent-section {
background: #fff5f5;
}
.agent-photo img {
width: 200px;
border-radius: 6px;
}
/**master plan**/
.masterplan-photo img {
width: 100%;
border-radius: 6px;
}
.social-links- a {
color: #0a2233;
display: inline-block;
line-height: 1;
font-size: 15px;
border: 1px solid #e8e8ef;
padding: 8px;
width: 32px;
height: 32px;
text-align: center;
margin: 0 10px 0px 0;
border-radius: 4px;
}
.social-links- {
margin: 10px 0px 0 0;
}
.agent-details h5 {
margin: 0 0 4px 0;
font-size: 18px;
font-weight: 700;
line-height: 1.5;
}
.agent-details p {
font-size: 16px;
padding: 0 0 10px 0;
}
.agent-details p span {
font-weight: 600;
}
.agent-photo:hover {
box-shadow: 0 0 10px #e6e3e3;
top: -5px;
}
.agent-photo {
text-align: left;
background: #fff;
border-radius: 6px;
padding: 20px;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
position: relative;
top: 0;
border: 1px solid #e8e8ef;
}
.masterplan-photo:hover {
box-shadow: 0 0 10px #e6e3e3;
top: -5px;
}
.masterplan-photo {
text-align: left;
background: #fff;
border-radius: 6px;
padding: 20px;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
position: relative;
top: 0;
border: 1px solid #e8e8ef;
}
/**13.Reviews***/
.reviews-card:hover {
box-shadow: 0 0 10px #e6e3e3;
top: -5px;
}
.reviews-section .owl-carousel .owl-dots {
margin: 5px 0 0 0;
}
.reviews-card span {
font-size: 30px;
color: #530014;
}
.reviews-card {
text-align: center;
/*background: url(../images/common/pricing-bottom-bg.png) #fff;*/
border-radius: 6px;
padding: 30px;
margin: 5px 0;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
position: relative;
top: 0;
border: 1px solid #e8e8ef;
background-position: center bottom;
background-repeat: no-repeat;
background-size: auto;
cursor: grab;
}
.reviews-card img {
/*border-radius: 100px;
max-width: 140px;
margin: 0 auto 15px;*/
}
.reviews-card h4 {
font-size: 18px;
font-weight: 700;
margin: 10px 0 0 0;
}
.reviews-card h4 span {
font-weight: 400;
display: block;
font-size: 16px;
margin: 8px 0 20px 0;
color: #0a2233;
font-family: 'Poppins', sans-serif;
}
.reviews-section {
background: url(../images/common/dot.png);
}
/**14.Other projects**/
.project-logo-section {
background: #f4f6f8;
}
.project-logo img {
margin: 0 auto;
display: block;
}
.opl ul {
overflow: hidden;
}
.opl ul li:before {
content: "";
height: 100%;
top: 0;
left: -1px;
position: absolute;
border-left: 1px solid #e6e6e6;
}
.opl ul li {
width: 20%;
float: left;
position: relative;
padding: 0px 30px;
}
/**15.Enquire form**/
.enquire-form {
background: url(../images/common/buildings.png);
background-repeat: no-repeat;
background-position: center bottom;
}
.cta-heading-2 img {
margin: 0 0 20px 0;
}
.cta-heading-2 {
margin-right: 50px;
}
.cta-heading-2 h2 {
font-weight: 800;
font-size: 30px;
line-height: 1.2;
padding-bottom: 20px;
color: #0a2233;
}
.cta-heading-2 p {
padding-bottom: 20px;
}
.form-block {
background: rgba(255, 255, 255, 0.85);
border-radius: 6px;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
border: 1px solid #fff;
}
.form-block form {
padding: 0px 20px 20px 20px;
}
.form-block input:focus, .form-block textarea:focus {
border: 1px solid #530014;
}
.form-block input {
width: 100%;
height: 46px;
padding: 0px 15px;
margin: 0px 0 10px 0;
border-radius: 6px;
color: #172b43;
font-size: 16px;
outline: none;
background: #fff;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
border: 1px solid #e6e6e6;
}
.form-block textarea {
max-height: 200px;
width: 100%;
padding: 15px;
margin: 0px 0 10px 0;
border-radius: 6px;
color: #172b43;
font-size: 16px;
outline: none;
background: #fff;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
border: 1px solid #e6e6e6;
}
.custom-control-input:checked ~ .custom-control-label::before {
color: #fff;
border-color: #530014;
background-color: #530014;
}
.custom-control-input:focus ~ .custom-control-label::before {
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
}
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
border-color: #ffbc80;
}
.custom-control-label::before {
position: absolute;
top: -1px;
left: -1.5rem;
display: block;
width: 20px;
height: 20px;
pointer-events: none;
content: "";
background-color: #fff;
border: #adb5bd solid 1px;
}
.custom-control-label::after {
position: absolute;
top: -3px;
left: -26px;
display: block;
width: 25px;
height: 25px;
content: "";
background: no-repeat 50%/50% 50%;
}
.custom-control {
margin-bottom: 12px;
margin-top: 8px;
}
.form-block label input {
height: 20px;
width: 20px;
position: relative;
top: 5px;
margin: 0 5px 0 0;
}
.fieldsets label {
position: relative;
top: -10px;
font-size: 14px;
color: #530014;
margin: 0;
padding: 0;
}
.custom-control label {
text-indent: -21px;
padding: 0 0 0 21px;
font-size: 13px;
}
.form-block label a {
color: #000;
}
.form-header {
text-align: center;
padding: 8px 0 10px 0;
margin: 0 0 10px 0;
}
.form-header h2 span {
font-size: 20px;
display: block;
font-weight: 700;
color: #0a2233;
}
.form-header p {
text-align: center;
}
.form-block p.trm {
font-size: 16px;
width: 100%;
text-align: center;
padding: 6px 0;
background: #c4975c;
font-weight: 600;
color: #fff;
}
.form-block p.trm i {
padding: 5px 5px 0 0;
}
.form-block button:hover {
background-color: #0a2233;
}
.form-block button {
font-size: 16px;
font-weight: 400;
font-family: "Poppins";
padding: 0px 40px;
line-height: 40px;
text-align: center;
outline: none;
color: #fff;
background-color: #9ACD32;
border: none;
border-radius: 6px;
width: 100%;
-webkit-box-shadow: 0 3px 6px rgba(91,130,148,.08);
box-shadow: 0 3px 6px rgba(91,130,148,.08);
}
.pl0 {
padding-left: 0 !important;
}
/**16.Footer**/
footer {
background: #ebc37d;
padding: 20px 0 25px 0;
color: #fff;
}
.footer- a img { /*width: 100px;*/
}
footer h3 {
margin-bottom: 25px;
font-size: 20px;
font-weight: 700;
}
.footer- p {
text-align: center;
padding: 25px 0 0 0;
font-size: 12px;
font-weight: 500;
color: #fff;
}
.footer- a {
display: block;
margin: 0 0 5px 0;
}
.footer-block {
padding: 20px 0;
}
.social-links {
text-align: right;
}
.social-links a {
color: #0a2233;
font-size: 25px;
line-height: 1;
}
.footer-address-list li i {
margin: 0 5px 0 0;
}
.copyright {
border-top: 1px solid #787676;
margin: 70px 0 10px;
}
.footer-address-list li {
font-size: 16px;
text-indent: -12px;
padding-left: 25px;
line-height: 35px;
}
.footer-social-media-icons a {
color: #fff;
font-size: 16px;
border: 1px solid #cacaca;
border-radius: 4px;
margin: 0 2px;
width: 35px;
height: 35px;
display: inline-block;
text-align: center;
line-height: 34px;
}
.footer-social-media-icons a.facebook {
background: #0069f7;
border-color: #0069f7;
}
.footer-social-media-icons a.twitter {
background: #00c6f7;
border-color: #00c6f7;
}
.footer-social-media-icons a.instagram {
background: #D62977;
border-color: #D62977;
}
.footer-social-media-icons a.linkedin {
background: #0E72A3;
border-color: #0E72A3;
}
.footer-address-list li a {
color: #fff;
}
.fixed-footer-btns {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index: 111;
}
.fixed-footer-btns a {
width: 50%;
float: left;
height: 40px;
line-height: 40px;
background: #e32222;
color: #fff !important;
text-transform: uppercase;
border-top: 1px solid #fff;
border-right: 1px solid #fff;
text-align: center;
font-size: 12px;
}
@media (min-width: 768px) {
.d-md-none {
display: none !important;
}
}
.table-fill {
border-radius: 3px;
border-collapse: collapse;
margin: auto;
padding: 0px;
width: 100%;
animation: float 5s infinite;
color: #ffffff;
margin-left: 0px;
margin-top: 0px;
margin-bottom: 20px;
}
tr:last-child {
border-bottom: none;
}
tr:first-child {
border-top: solid 1px #b4b4b4;
border-left: solid 1px #b4b4b4;
}
tr {
color: #666B85;
font-size: 16px;
font-weight: normal;
text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
}
th:first-child {
border-top-left-radius: 3px;
}
th {
color: #000000;
background: #ffffff;
border-bottom: 1px solid #b4b4b4;
border-right: 1px solid #b4b4b4;
font-size: 16px;
font-weight: 100;
padding: 0px;
text-align: left;
vertical-align: middle;
height: 40px;
}
td {
border-right: 1px solid #b4b4b4;
vertical-align: middle;
font-weight: 300;
padding-left: 5px;
font-size: 15px;
text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.1);
border-bottom: solid 1px #b4b4b4;
border-left: solid 1px #b4b4b4;
line-height: 50px;
}
tr {
border-top: 1px solid #b4b4b4;
color: #000;
font-size: 16px;
font-weight: normal;
text-shadow: 0 1px 1px rgba(256, 256, 256, 0.1);
line-height: 50px;
}
tr:nth-child(2n+1) td {
border-bottom: 1px solid #b4b4b4;
border-right: 1px solid #b4b4b4;
color: #000;
line-height: 50px;
}
.colspaces {
padding-left: 20%;
}
//@media (min-width: 768px) {
//tr:nth-child(2n+1) td;
{
}
//
}
.navbar-brand {
}
.table-fill a {
text-align: center;
color: #861b11;
font-weight: 800;
}
.cinfo {
color: #fff !important;
background: #861b11;
border-radius: 8px;
}
@media only screen and (max-width: 767px) {
.cinfo {
color: #fff !important;
background: none;
}
}
.fa-whatsapp {
font-size: 35px !important;
color: #fff;
background: linear-gradient(#25d366,#25d366)10px 84%/10px 0px no-repeat, radial-gradient(#25d366 60%,transparent 0);
}
.fa {
display: inline-block;
font: normal normal normal 14px/1 FontAwesome;
font-size: inherit;
text-rendering: auto;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/*-------------------Number Area----------------------------*/
.a_complete .number-area ul {
list-style: none;
}
.a_complete .number-area li {
float: left;
width: 20%;
text-align: center;
margin-top: 20px;
border-right: dashed 1px #d6d6d6;
}
.a_complete .number-area li p {
font-size: 50px;
font-weight: 400;
margin: 0;
line-height: 62px;
color: #9ACD32;
}
.a_complete p {
font-size: 14px;
letter-spacing: 0.5px;
line-height: 28px;
text-align: center;
}
.justify {
text-align: justify;
}
.bg2 {
background: #e2b3a9;
}
h2::before {
content: '';
position: absolute;
display: block;
width: 120px;
height: 1px;
background: #9ACD32;
bottom: 1px;
left: calc(50% - 60px);
}
h2::after {
content: '';
position: absolute;
display: block;
width: 40px;
height: 3px;
background: #ad7664;
bottom: 0;
left: calc(50% - 20px);
}