@font-face {
    font-family: 'EcoWorldSerif';
    src: url('../fonts/EcoWorldSerif-Bold.woff') format('woff'),
         url('../fonts/EcoWorldSerif-Bold.otf') format('opentype');
    font-style: normal;
}

@font-face {
    font-family: 'Poppins-Regular';
    src:url('../fonts/Poppins-Regular.woff') format('woff'),
    url('../fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
body {
	background:#fff;
	font-family:'Poppins-Regular';
}

#specs.modal {
	background:rgba(0,0,0,0.9);
}

#specs .modal-header {
	padding:0;
	border-bottom:0
}

#specs .modal-body {
padding:0
}

.modal-header .close {
    
}

#specs .close {
    float: right;
    font-size: 1.5rem;
    font-weight: 300;
    line-height: 1;
    color: #fff;
    text-shadow: none;
    opacity: 1;
	padding: 0;
    margin: 0;
	
}

#specs .modal-dialog {
	width:100vw;
	height:100vh;
	max-width:100vw;
	margin:0;
	
}

#specs .modal-content {
	background:transparent;
}

.specsimage {
	width:calc(100vw - 60px);
	max-width:1200px;
}

.closebuttoncontainer {
	max-width:1200px;margin:auto;width:100%;
	padding-right:30px;
}

.container {
    position: relative;
    max-width: 1400px;
}

#hanaapartmentdetails {
	background:url('img/bg-second_v2.jpg');background-size:100%;background-repeat:no-repeat;
}


.features h2 {
font-family: 'EcoWorldSerif';
line-height:1;
background: #8F88B7;
background: -webkit-linear-gradient(to bottom, #8F88B7 0%, #4E3781 80%, #473275 100%);
background: -moz-linear-gradient(to bottom, #8F88B7 0%, #4E3781 80%, #473275 100%);
background: linear-gradient(to bottom, #8F88B7 0%, #4E3781 80%, #473275 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
text-transform:uppercase;
font-size:50px;
margin-bottom:0;
}


.thefeaturescontent {
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
padding-top:80px;
}

.thefeatures ul {
padding-left:0
}

.thefeatures ul li {
display:inline-block;
font-size:30px;
padding:5px 60px;
font-family: 'EcoWorldSerif';
font-weight:700;
color:black;
width:30%;
margin:0 10px;
background:url('img/gradientborder.png');
background-position:center center;
background-size:contain;
background-repeat:no-repeat;
}

h3 {
font-family: 'EcoWorldSerif';
}


.font50 {
font-size:50%;
}

.font130 {
font-size:130%;
}

.locatedat {

color:#000000;
max-width:600px;
margin:auto
}

.locatedat h2 {
font-size:35px;
font-weight:700;
}

.locatedat p {
	font-size:20px;
	max-width:425px;
	margin:auto
}

.theblock {
	max-width:1100px;
	font-family:'Poppins-Regular';
	color:#4a4a49
}

.theblock .font100 {
	font-size:100px;
	font-weight:700;
}

.gradienttitle {
	font-size:55px;
	background: #494287;
background: linear-gradient(to right, #494287 0%, #9d99c5 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;

}

.t1 {
	font-size:23px;
	letter-spacing:2px;
	margin-bottom:0;
	color:#4e3684;
	font-weight:700;
	
}

.builtupwrap {
padding:0px 0px;
border-top:2px solid #4e3684;
border-bottom:2px solid #4e3684;
display:inline-block
}

.builtupwrap2 {
padding:0px 0px;
border-top:2px solid #f0a962;
border-bottom:2px solid #f0a962;
display:inline-block
}

.builtup {
	font-size:40px;
	font-weight:700
}

.blackline {
    border-top: 1px solid rgba(0,0,0,1);

}
.theblockbox {
	background:white;
	padding-top:20px;
	border-radius:30px;
	box-shadow: -3px 6px 32px -13px rgba(0,0,0,0.25);
-webkit-box-shadow: -3px 6px 32px -13px rgba(0,0,0,0.25);
-moz-box-shadow: -3px 6px 32px -13px rgba(0,0,0,0.25);
}

.turqoise {
	color:#7ca8b6;
}


.purple {
	color:#4e3684;
}

.orange {
color:#f0a962
}

.gradienthr {
background: rgb(112,181,185);
background: linear-gradient(90deg, rgba(112,181,185,1) 0%, rgba(88,67,135,1) 100%);
height:3px;
border-radius:3px;
margin-top:40px;
margin-bottom:40px;
}

.thefeatures {
padding-bottom:39.36%;
background:url('img/third_v2.jpg');
background-repeat:no-repeat;
background-size:100%;
position:relative;
}

.ebrochure, .specifications{
	border-radius:50px;
	padding:7px 68px;

	color:white!important;
	font-family: 'EcoWorldSerif';
	display:inline-block;
	text-transform:uppercase;
	text-align:center;
	background: rgb(88,69,143);
background: -moz-linear-gradient(90deg, rgba(88,69,143,1) 0%, rgba(126,115,172,1) 50%, rgba(166,165,207,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(88,69,143,1) 0%, rgba(126,115,172,1) 50%, rgba(166,165,207,1) 100%);
background: linear-gradient(90deg, rgba(88,69,143,1) 0%, rgba(126,115,172,1) 50%, rgba(166,165,207,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#58458f",endColorstr="#a6a5cf",GradientType=1);
font-size:25px;
margin-top:50px;
box-shadow: 2px 6px 0px 0px rgba(229,229,229,1);
-webkit-box-shadow: 2px 6px 0px 0px rgba(229,229,229,1);
-moz-box-shadow: 2px 6px 0px 0px rgba(229,229,229,1);
	}
.siteprogress {
padding-top:100px!important;
background:url('img/bg-bottom.png');
background-size:100% 100%;
background-position:top 170px center;
background-repeat:no-repeat;
}

.siteprogressimage {
	max-width:944px;
}

.siteprogress h2 {
	border-radius:50px;
	padding:7px 68px;

	color:white;
	font-family: 'EcoWorldSerif';
	display:inline-block;
	text-transform:uppercase;
	text-align:center;
	background: rgb(88,69,143);
background: -moz-linear-gradient(90deg, rgba(88,69,143,1) 0%, rgba(126,115,172,1) 50%, rgba(166,165,207,1) 100%);
background: -webkit-linear-gradient(90deg, rgba(88,69,143,1) 0%, rgba(126,115,172,1) 50%, rgba(166,165,207,1) 100%);
background: linear-gradient(90deg, rgba(88,69,143,1) 0%, rgba(126,115,172,1) 50%, rgba(166,165,207,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#58458f",endColorstr="#a6a5cf",GradientType=1);
font-size:46px;
	}

.siteprogress p {
padding-top:10px;
padding-bottom:20px;
font-size:20px;
text-transform:uppercase;
}

.masterplan {
	position:relative;
}
footer {
}

.ghr {
width:80px;
height:2px;
margin:auto;
background: #8F88B7;
background: -webkit-linear-gradient(to right, #98c6cb 0%, #7eb8bc 80%, #6f779e 100%);
background: -moz-linear-gradient(to right, #98c6cb 0%, #7eb8bc 80%, #6f779e 100%);
background: linear-gradient(to right, #98c6cb 0%, #7eb8bc 80%, #6f779e 100%);
}

@media (max-width:1399.98px) {
	.thefeatures ul li {

font-size:2vw;

}
}

@media (max-width:1199.98px) {
	.thefeatures ul li {

font-size:1.5vw;

}

	.siteprogressimage {
	max-width:100%;
}
}

@media (max-width:991.98px) {
	
.siteprogress {
padding-top:0px!important;
background:url('img/bg-bottom-mobile.png');
background-size:100% 100%;
background-position:top 170px center;
background-repeat:no-repeat;
}
	
	.thefeatures {
padding-bottom:74.9%;
background:url('img/thirdmobile_v2.jpg');
background-repeat:no-repeat;
background-size:100%;
position:relative;
}

	
	.thefeatures ul li {
		width:100%;
		font-size:4vw;margin:0;
		margin-bottom:4vw;
		
		
	}
	
	.specifications {
	margin-top:5vw;
	margin-bottom:17vw;
	}
	
	.thefeaturescontent {
    padding-top: 5vw;
}
	
	.siteprogress p {
    padding-top: 0px;
  
}
	
	.themap {
		margin-top:80px;
	}
	
	.locatedat {
    color: #000000;
    max-width: 100%;
    margin: auto;
}
	
	.theprice {
	text-align:center;
	
	}
	
	.theprice img {
	width:60vw;
	margin-top:5vw
	}
	
	#hanaapartmentdetails {
	background:white;
}

.features {
	margin-bottom:0;
	border-right:0;
	padding-top:40px;
	padding-bottom:40px;
}

#hannasquarefeatures {
    padding-top: 0px;
    padding-bottom: 80px;
}

	.theblock {
    padding-left: 15px;
    padding-right: 15px;
}

.theblockbox {
padding-top:20px!important;
padding-bottom:5px!important;
margin-bottom:40px;
	box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
border-radius:0;
}



.gradienttitle {
text-align:center;
font-size:8vw;
}

.builtup {
    font-size: 5vw;
    font-weight: 700;
}

.builtupwrap, .builtupwrap2 {

    font-size: 2vw;
}

.theblock .font100 {
    font-size: 11vw;
    margin-bottom:0;
}

.artistimpression {
	font-size:9px!important;
	top:5px!important;
	right:8px!important;
	}
}

@media (max-width:767.98px) {
	
	.closebuttoncontainer {
padding-right:15px;
	
}

	
	.specsimage {
    width: calc(100vw - 30px);
    max-width: 1200px;
}

.mobilekv {
	margin-top:16.2vw;
}

#hannasquarefeatures {
    padding-top: 0px;
    padding-bottom: 0px;
}

.siteprogress h2 {
	padding:9px 49px;
font-size:5vw;
box-shadow: 2px 6px 0px 0px rgba(222,222,225,0.75);
-webkit-box-shadow: 2px 6px 0px 0px rgba(222,222,225,0.75);
-moz-box-shadow: 2px 6px 0px 0px rgba(222,222,225,0.75);
}

.siteprogress {
padding-top:0px!important;
background:url('img/bg-bottom-mobile.png');
background-size:100% 100%;
background-position:top 0 center;
background-repeat:no-repeat;
}


.theblock h2 {
    font-size: 15vw;
}
}

@media (min-width:1191px) {
	.closebuttoncontainer {
	padding-right:0;
	}
}