@import url(https://fonts.googleapis.com/css?family=Raleway:100,300,400,600,700);
@import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500);

html, body, ul, li, p, a, h1, h2, h3, h4, h5, h6, div, span, input, label, input[type="radio"]  {margin:0; padding:0; outline:none}
* {-moz-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box}
input[type='number'] {-moz-appearance:textfield}
::-webkit-input-placeholder {opacity:1}
:-moz-placeholder {opacity:1}
::-moz-placeholder {opacity:1}
:-ms-input-placeholder {opacity:1}
select, input[type='submit'] {-webkit-appearance:none; -moz-appearance:none; appearance:none; font-family:'Raleway', sans-serif}

html, body {height:100%}
body, input, textarea {font-family:'Raleway', sans-serif}
.main-container {width:1240px; margin:0 auto; position:relative}
.clear {clear:both}
a {text-decoration:none}
ul, li {list-style:none}

.g-recaptcha {transform:scale(0.76); -webkit-transform:scale(0.76); -moz-transform:scale(0.76); -o-transform:scale(0.76); -ms-transform:scale(0.76); transform-origin:0 0; -webkit-transform-origin:0 0; -moz-transform-origin:0 0; -o-transform-origin:0 0; -ms-transform-origin:0 0}

.enquiry {position:fixed; top:150px; right:-274px; z-index:999999; transition:right 0.3s ease-out}
.enquiry.active {right:0}
.enquiry a {position:absolute; margin-left:-45px; text-decoration:none}
.enquiry form {width:274px; padding:25px 22px 15px; background:rgba(0,0,0,0.9)}
.enquiry input[type="text"], .enquiry input[type="email"], .enquiry input[type="number"], .enquiry select {width:100%; height:30px; line-height:30px; border:1px solid #727272; margin-bottom:15px; background:none; color:#fff; padding:0 15px; font-size:15px}
.enquiry input[type="submit"] {background:#d7c129; width:93px; height:34px; border:0; text-transform:uppercase; font-size:15px; font-weight:500}
.enquiry textarea {width:100%; height:70px; border:1px solid #727272; font-size:15px; padding:5px 15px; color:#fff; background:none; resize:none; margin-bottom:10px}
.enquiry p {color:#fff; font-size:14px; line-height:18px; margin-bottom:12px; font-weight:300}
.enquiry .heading {font-size:20px; border-top:1px solid #727272; font-weight:400; margin-top:15px; padding-top:12px; text-transform:uppercase}
.enquiry p a {position:relative; margin:0; display:block; color:#fff; font-size:18px; font-weight:400; line-height:24px}
.enquiry .close {margin:-20px 0 0 230px; font-family:"Arial"; color:#fff}
.enquiry select {width:100%; color:#999; background: url(../images/arrow-s.png) center right 10px no-repeat; padding-left:10px}

.banner {background:url(../images/altimo/banner.jpg) bottom center no-repeat; margin:20px; width:calc(100% - 40px); height:calc(100vh - 40px); min-height:580px; position:relative}
.banner .left {float:left}
.banner .left a:nth-child(1) {background:#eceae3; width:80px; height:80px; text-align:center; float:left; padding-top:20px}
.banner .left a:nth-child(2) {background:url(../images/altimo/call.png) top 5px left no-repeat; color:#7d7d7d; font-size:20px; font-weight:200; font-family:'Roboto', sans-serif; padding-left:20px; margin:20px 0 0 25px; float:left}
.banner .left a:nth-child(3) {width:28px; height:28px; background:url(../images/altimo/fb.png) no-repeat; float:left; margin:19px 5px 0 10px}
.banner .left a:nth-child(4) {width:28px; height:28px; background:url(../images/altimo/insta.png) no-repeat; float:left; margin-top:19px}
.banner .right {margin:15px; width:90px; z-index:99999999; position:absolute; right:10px}
.banner .logo {display:block; margin:50px auto 0}
.banner .divider {width:360px; height:1px; background:rgba(0,0,0,0.2); margin:30px auto}
.banner p {color:#2b2b2b; font-size:21px; text-align:center}
.banner > a img {position:absolute; display:block; left:50%; margin-left:-35px; bottom:130px}

.banner ul {width:205px; position:absolute; bottom:30px; left:50%; margin-left:-103px}
.banner ul li {display:inline-block; width:100px; line-height:18px; text-align:center}
.banner ul li img {display:block; margin:0 auto 10px; width:25px}
.banner ul li img:nth-of-type(2) {display:none}
.banner ul li b {display:block}

.location {background:url(../images/altimo/texture.jpg); padding:30px 0}
.location .left {float:left; width:49.95%; overflow:hidden}
.location .right {float:right; width:50.05%; overflow:hidden}
.location .right h2 {margin:95px 0 0 50px}
.location .left h2 {margin:30px 50px 0 0}
.location img {display:block}
.location .map {margin-top:30px; float:right}
.location h2 {font-size:39px; font-weight:100; color:#fff}
.location em {width:80px; height:2px; background:#e2e0d6; display:block; margin-top:25px}
.location p {color:#fefefe; font-size:19px; font-weight:100; margin-bottom:25px; margin-top:10px; line-height:26px}
.location .left p {margin-right:50px}
.location p b {color:#fff; font-weight:600}

.amenities {background:#e3e1d7; padding:25px; margin-bottom:20px}
.amenities h2 {color:#232122}
.amenities ul li {float:left; margin-left:15px; margin-top:15px; width:calc(20% - 12px)}
.amenities ul li img {width:100%}
.amenities ul li:nth-child(1), .amenities ul li:nth-child(6) {margin-left:0}

.gallery {margin-top:20px}
.gallery i {text-align:right; font-size:13px; color:#373737; display:block; margin-top:10px}
.gallery ul li a {position:relative; display:block}
.gallery ul li a b {position:absolute; width:100%; height:100%; display:block}
.gallery ul li a:hover b {background:url(../images/zoom-bg.png) center}

.location ul.details {margin:35px 0 0 35px; float:left}
.location ul.details li a {border:1px solid #6b6865; margin-top:-1px; width:160px; line-height:38px; height:38px; font-size:14px; font-weight:600; padding:0 10px; color:#909090; display:block}
.location ul.details li a:hover, .location ul.details li a.active {border:1px solid #d7c129; background:#d7c129; color:#1d1d1d}
.location ul.details li a:hover i, .location ul.details li a.active i {width:12px; height:34px; background:url(../images/altimo/arrow.png) no-repeat; display:block; float:right; margin-right:-23px}
.location ul.amenities.open {width:calc(100% - 195px); float:left; margin-left:0; padding-left:30px; border:1px solid #6b6865; border-left:0; margin-top:34px; min-height:223px; padding-top:20px; display:none; padding-right:20px}
.location ul.amenities.open.apt-fea {display:block}
.location h4 {background:#e0ded4; width:100%; font-size:29px; color:#373737; font-weight:300; padding:65px 120px; text-align:center}
.downloads {border:1px dashed rgba(224,222,212,0.3); margin-top:25px}
.downloads h2 {width:50%; float:left; margin:30px 0; text-align:center}
.downloads a {font-size:28px; font-weight:100; color:#fff; border:1px solid #fff; border-radius:30px; padding:0 60px 0 30px; line-height:50px; height:50px; display:inline-block; margin:25px 0 0 100px; background:url(../images/altimo/download.png) center right 30px no-repeat}

.conditions {text-align:right; font-size:13px; font-weight:100; display:block; margin-top:5px; color:#fff}
.conditions i {font-weight:bold; font-size:16px; font-style:normal}

.footer {text-align:center}
.footer > img {display:block; margin:60px auto 20px; max-width:80%}
.footer p {color:#e0ded4; font-size:13px; font-weight:300}
.footer p:first-of-type {font-size:17px; margin-top:50px}
.footer em {margin:0 auto}
.footer > div > a {color:#e0ded4; font-size:17px;  display:block; background:url(../images/altimo/mail.png) left calc(50% - 115px) center no-repeat; padding-left:30px}
.footer .copyright {margin-top:-28px}
.footer .copyright a {color:#e0ded4}
.footer .copyright span {margin:0 8px}

@media screen and (min-width:1400px) {
.banner .logo {margin-top:180px}
}

@media screen and (max-width:1240px) {
.main-container {width:calc(97% - 50px); margin-left:3%; margin-right:50px}
}

@media screen and (max-width:1150px) {
.banner {background-size:auto 170%}
}

@media screen and (max-width:1150px) and (orientation:portrait) {
.banner .logo {padding-top:350px}
}

@media screen and (max-width:1065px) {
.banner {margin:0; width:100%; height:100vh}
.banner .left {float:none; position:fixed; z-index:9999; background:#e3e0d7; width:100%}
.banner .right {position:fixed; margin-top:5px}
.banner .logo {margin-top:0; padding-top:150px}
.banner .left a:nth-child(1) {height:60px; padding-top:10px; width:60px}
.banner {background-size:auto 155%}

.banner ul {bottom:20px}
.banner > a img {bottom:110px}
}

@media screen and (max-width:1065px) and (orientation:portrait) {
.banner {background-position:bottom right -670px; background-size:auto 1150px}
}

@media screen and (max-width:1100px) {
.location .right h2 {margin-top:70px}
.location h4 {padding:60px}
.banner .view {right:inherit; left:40px}
}

@media screen and (max-width:820px) {
.location .right h2 {font-size:35px; margin-top:30px; margin-left:0; margin-bottom:30px}
.location .left, .location .right {float:none; width:100%}
.location .left img, .location .right img {width:100%}
.location .left h2 {margin-right:0}
.location .left p {margin-right:0}

.amenities ul li {width:calc(33.3% - 10px)}
.amenities ul li:nth-child(4), .amenities ul li:nth-child(7) {margin-left:0}
.amenities ul li:nth-child(5) {margin-left:15px}

.downloads a {margin:25px 0 0 5%}
}

@media screen and (max-width:700px) {
.banner {background:url(../images/altimo/banner.jpg) bottom right -450px no-repeat; background-size:1500px auto}
}

@media screen and (max-width:600px) {
.main-container	{width:calc(95% - 50px); margin-left:5%}

.amenities ul li {width:calc(50% - 8px)}
.amenities ul li:nth-child(3), .amenities ul li:nth-child(5) {margin-left:0}
.amenities ul li:nth-child(4) {margin-left:15px}

.location h4 {padding:30px}

.downloads h2 {float:none; width:100%; margin:20px 0}
.downloads a {margin:-5px auto 20px; display:table}
}

@media screen and (max-width:500px) {
.banner .logo {width:150px}
.banner .divider {width:170px; margin-bottom:15px}
.banner {background-size:1450px auto}
.banner p {font-size:18px}

.location h4 {font-size:24px}
.banner {min-height:550px}

.banner .right {display:none}
}

@media screen and (max-width:450px) {
.amenities ul li {width:100%; margin-left:0 !important}
}

@media screen and (max-width:400px) {
.main-container	{width:calc(93% - 50px); margin-left:7%}

.banner .logo {margin:0 0 0 40px; padding-top:100px}
.banner > a img {left:80px; margin-left:0}

.banner ul {left:10px; margin-left:0}

.banner .divider {margin:30px 0 15px 30px}
.banner p {margin-left:15px; width:200px}
.banner p br {display:none}
.banner .left {height:80px}
.banner .left a:nth-child(1) {width:60px; height:60px; background:none; padding-top:30px}
.banner .left a:nth-child(1) img {width:40%}
.banner .left a:nth-child(2) {float:none; width:180px; display:block; margin-top:5px; position:absolute; right:25px; margin-top:8px}
.banner .left a:nth-child(3) {position:absolute; top:25px; right:63px}
.banner .left a:nth-child(4) {position:absolute; top:25px; right:33px}

.location .right h2 {font-size:26px}

.location h4 {padding:20px}
.footer p {line-height:18px}
.footer .copyright {margin-top:-20px}
}