@charset "utf-8";
/* CSS Document */
html { scroll-behavior: smooth;}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box;  box-sizing: border-box; }
body { font-family: 'montserratregular'; font-size: 14px;}
 
/* HEADER
========================================================================*/
header { position:absolute; left:6%; top:0; z-index:9; background: #29235c; padding:40px 30px 40px 30px}
header .logo{}
header .logo img{ width:142px}
.reraWrap{ position:absolute; right:20px; top:20px;}
.reraWrap .reralogo{ float:left;}
.reraWrap .reralogo img{}
.reraWrap .reraText{ font-size:9px; margin-left:5px; margin-top:2px; line-height:10px; color:#fffefe; float:left;}
/* BANNER
========================================================================*/
.bannerWrap{ display: grid; grid-template-columns: 67% 33%; }
.bannerWrap .banner{ position:relative;}
.bannerWrap .banner img{ width:100%;}
.bannerWrap .banner img.desktopBanner{display:block;}
.bannerWrap .banner img.mobileBanner{ display:none;}
.bannerWrap .bannerTag{ position:absolute; left:9%; bottom:80px;}
.bannerWrap .bannerTag h3{ font-size:70px; line-height:74px; color:#ffffff;font-family: 'montserratsemi_bold'; margin-bottom:20px; text-shadow: 3px 2px 4px rgba(0,0,0,0.3);}
.bannerWrap .bannerTag .tagline{font-size:24px; line-height:32px; color:#ffffff;  font-family: 'montserratregular'; margin-bottom:30px;}
.bannerWrap .bannerTag .knowMore{}
.bannerWrap .bannerTag .knowMore a{font-size:20px; line-height:28px; border:1px solid #ffffff; padding:10px 40px; color:#ffffff;  font-family: 'montserratregular'; display:inline-block;transition:0.5s;}
.bannerWrap .bannerTag .knowMore a:hover{ background:#ffffff; color:#29235c; transition:0.5s;}

.bannerWrap .formWrap{ background:#29235c;display: table;vertical-align: middle; width: 100%;}
.bannerWrap .formWrap .formInner{ padding:0 40px; display: table-cell; vertical-align: middle; width: 100%;}
.bannerWrap .formWrap .formInner h3{ font-size:30px; line-height:32px; color:#ffffff; text-align:center; margin-bottom:30px;font-family: 'montserratsemi_bold';}
.bannerWrap .formWrap .formInner iframe{ width:100%; height:530px;}
.inputBox{ position:relative; margin-bottom:20px;}
.error_msg{ position:absolute; left:0; bottom:-22px; font-size:13px; color:#da0707;}
.inputBox input{ width:100%; padding:15px 15px; border:1px solid #9a97b2; color:#ffffff;  font-family: 'montserratlight'; font-size:14px; background:none;}
.inputBox select{ width:100%; padding:15px 15px; border:1px solid #9a97b2; color:#ffffff;  font-family: 'montserratlight'; font-size:14px; background:none;}
.inputBox select option{ color:#000000;}
.inputBox textarea{ width:100%; padding:15px 15px; border:1px solid #9a97b2; color:#ffffff;  font-family: 'montserratlight'; font-size:14px; background:none;}
.inputBox .formError { color: #ff0000; font-weight: normal; font-size: 14px;
    position: absolute;}
.inputSubmit{ margin-top:40px;}
.inputSubmit input{ width:100%; font-size:20px; text-align:center; padding:15px 0; text-transform:uppercase; color:#ffffff; border:2px solid #ffffff; font-family: 'montserratbold'; transition: 0.5s;}
.inputSubmit input:hover{ background:#ffffff; color:#29235c; transition: 0.5s;}

.thankMsg{ font-size:18px; line-height:28px; color:#ffffff; text-align:center;font-family: 'montserratlight';}  
 
/*
=======================================================================*/
.aboutWrap{padding:40px 0;}
.aboutWrap .aboutInner{ width:90%; margin:0 auto; } 
.aboutWrap .aboutInner .aboutLeft{ width:50%; float:left;} 
.aboutWrap .aboutInner .aboutLeft ul{ margin-top:10px;}
.aboutWrap .aboutInner .aboutLeft ul li{ margin-bottom:2px; width:48%; float:left;}
.aboutWrap .aboutInner .aboutLeft ul li:nth-child(even){ margin-left:4%;}
.aboutWrap .aboutInner .aboutLeft h2{ text-transform:uppercase; color:#29235c;}  
.aboutWrap .aboutInner .aboutRight{ width:42%; float:left; margin-left:8%;}   
.aboutWrap .aboutInner .aboutRight ul{}   
.aboutWrap .aboutInner .aboutRight ul li{ font-size:18px; color:#ffffff; text-transform:uppercase; overflow:hidden; background:#0c9ed9; padding:10px 20px; margin-bottom:10px;}   
.aboutWrap .aboutInner .aboutRight ul li span{ font-size:12px; display:inline-block; float:right; font-family: 'montserratregular';line-height: 30px;} 
.aboutWrap .aboutInner .aboutRight ul li:last-child{ margin-bottom:0;}  
 
   
/* Gallery
========================================================================*/
.galleryWrap{ position:relative; padding:60px 0; background:#f5f5f5;}
.galleryWrap .gallerySliderWrap{position:relative; width:91%; float:right;}
.galleryWrap .gallerySliderWrap .galleryBox{ margin-right:20px;}
.galleryWrap .gallerySliderWrap .galleryBox img{ width:100%;}
.galleryWrap .gallerySliderWrap .galleryBox span{ display:block; text-transform:uppercase; margin:5px 0;}
.galleryWrap .slick-arrow{ position:absolute; top:50%; width:73px; height:59px; border:none; z-index:9; overflow:hidden; text-indent:-1000px; margin-top:-40px;}
.galleryWrap .slick-prev.slick-arrow{background:url("../images/left-arrow.png") no-repeat center/cover; left:10px;}
.galleryWrap .slick-next.slick-arrow{ background:url("../images/right-arrow.png") no-repeat center/cover; right:10%;}
.galleryWrap .slick-arrow.slick-disabled{ display:none !important;} 
   


.lgacyWrap{ margin:60px 0;}
.lgacyWrap .lgacyInner{ width:80%; margin:0 auto; text-align:center;}
.lgacyWrap .lgacyInner h2{ color:#29235c;}
.lgacyWrap .lgacyInner ul{ margin-top:40px;}
.lgacyWrap .lgacyInner ul li{ width:23%; margin:0 1%; float:left; background:#0c9ed9; padding:40px 0;}
.lgacyWrap .lgacyInner ul li .num{ color:#ffffff; font-size:40px; line-height:40px; margin-bottom:10px;font-family: 'montserratbold';}
.lgacyWrap .lgacyInner ul li .text{ color:#ffffff;}

/* Floor Plans
=======================================================================*/
.floorplanWrap{ background:#31bebe;}
.floorplanWrap .floorplanInner{ width:auto; padding:50px 60px;  margin:0 auto;}
.floorplanWrap .floorplanInner .floorplanLeft{ float:left;width:70%; font-size:38px; line-height:54px; color: #ffffff;}
.floorplanWrap .floorplanInner .floorplanRight{ float:left; width:26%; margin-left:4%; }
.floorplanWrap .floorplanInner .floorplanRight a{ display:block; text-align:center; border:1px solid #ffffff; text-transform:uppercase; color:#ffffff; font-size:20px; padding:10px 0; font-family: 'montserratbold'; transition: 0.5s;}
.floorplanWrap .floorplanInner .floorplanRight a:hover{ background:#ffffff; color:#31bebe; transition: 0.5s;}

/* FOOTER
========================================================================*/
footer { background: #0e1232; padding: 40px 0; font-size: 14px; color: #b0b0b2; }
.bottomWrap{ width:90%; margin:0 auto; border-bottom:1px solid #0c9ed9; padding-bottom:40px; margin-bottom:40px;}
.bottomWrap .bottomBox{ width:33%; float:left; text-align:center;}
.bottomWrap .bottomBox.firstBox img{ display:none;}
.bottomWrap .bottomBox .button{ margin-top:40px;}
.bottomWrap .bottomBox .button.callButton{}
.bottomWrap .bottomBox .button.enquireButton{}
.bottomWrap .bottomBox .button a{ font-size:18px; padding:10px 40px; text-transform:uppercase; color:#ffffff; border:1px solid #ffffff;}
.bottomWrap .bottomBox .button a:hover{ background:#0c9ed9; color:#ffffff;transition: 0.5s;}

.bottomWrap .bottomBox .ramalogo{}
.bottomWrap .bottomBox .ramalogo img{ max-width:50%;}

.footerWrap{width:90%; margin:0 auto;}
.footerWrap .addBox{ width:50%; float:left; font-size:12px; position:relative;}
.footerWrap .addBox h4{ font-size:14px; text-transform:uppercase; margin-bottom:15px;}
.footerWrap .addBox.addBoxLeft{  text-align:left;}
.footerWrap .addBox.addBoxLeft:after{ position:absolute; right:0; top:0; width:1px; height:100%; background:#0c9ed9; content:"";}
.footerWrap .addBox.addBoxRight{ text-align:right;}
.footerWrap .addBox.addBoxRight ul{}
.footerWrap .addBox.addBoxRight ul li{ width:49%; float:left; padding-left:15px; font-size:18px; line-height:24px;}
.footerWrap .addBox.addBoxRight ul li:nth-child(even){ margin-left:2%;}

#loader{display: none; position: fixed; top: 0; background: rgba(0,0,0,0.8); z-index: 99999; height: 100%; width: 100%;text-align: center;}
#loader img{width: auto; height: 62px; position: absolute; top: 30%;}
.modal-title {width: 100%; text-align: center;color: #000000;}
/* HEADINGS
========================================================================*/
h1, h2, h3, h4, h5, h6 { }
h1 { }
h2 { font-size:48px; line-height:48px; color:#000000;  font-family: 'montserratbold'; margin-bottom:30px;text-transform:uppercase;}
h3 { }
h4 { }
h5 { }
h6 { }
p { margin-top: 10px; }
p:first-child { margin: 0; }
/* FORM
========================================================================*/
label { }
input, textarea, select { font-size: 14px; background: none; border: 1px solid #dadada; padding:12px; margin: 0; }
input:focus, textarea:focus { border-color: #f1f1f1; background: none; }
::-webkit-input-placeholder {color: #f6f6f6;}
:-ms-input-placeholder { color: #f6f6f6;}
::placeholder { color: #f6f6f6;}


/* Slick Slider
========================================================================*/
.slick-slider{position:relative; display:block; -moz-box-sizing:border-box;  box-sizing:border-box; -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; 	user-select:none; -webkit-touch-callout:none; -khtml-user-select:none; -ms-touch-action:pan-y; touch-action:pan-y; -webkit-tap-highlight-color:transparent;}
.slick-list{position:relative; display:block; overflow:hidden; margin:0; padding:0;}
.slick-list:focus{outline:none;}
.slick-list.dragging{cursor:pointer; cursor:hand;}
.slick-slider .slick-track, .slick-slider .slick-list{-webkit-transform:translate3d(0, 0, 0); -moz-transform:translate3d(0, 0, 0); -ms-transform:translate3d(0, 0, 0);  -o-transform:translate3d(0, 0, 0); transform:translate3d(0, 0, 0);}
.slick-track{position:relative; top:0; left:0; display:block;}
.slick-track:before, .slick-track:after{display:table; content:'';}
.slick-track:after{clear:both;}
.slick-loading .slick-track{visibility:hidden;}
.slick-slide{display:none; float:left; height:100%; min-height:1px;}
[dir='rtl'] .slick-slide{float:right;}
.slick-slide img{display:block;}
.slick-slide.slick-loading img{display:none;}
.slick-slide.dragging img{pointer-events:none;}
.slick-initialized .slick-slide{display:block;}
.slick-loading .slick-slide{visibility:hidden;}
.slick-vertical .slick-slide{display:block; height:auto; border:1px solid transparent;}
.slick-arrow.slick-hidden {display:none;}

/* Font Family
=======================================================================*/
@font-face {
    font-family: 'roboto_slabbold';
    src: url('fonts/robotoslab-bold_0-webfont.eot');
    src: url('fonts/robotoslab-bold_0-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotoslab-bold_0-webfont.woff') format('woff'),
         url('fonts/robotoslab-bold_0-webfont.ttf') format('truetype'),
         url('fonts/robotoslab-bold_0-webfont.svg#roboto_slabbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'roboto_slabregular';
    src: url('fonts/robotoslab-regular-webfont.eot');
    src: url('fonts/robotoslab-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/robotoslab-regular-webfont.woff') format('woff'),
         url('fonts/robotoslab-regular-webfont.ttf') format('truetype'),
         url('fonts/robotoslab-regular-webfont.svg#roboto_slabregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'montserratbold';
    src: url('fonts/montserrat-bold-webfont.eot');
    src: url('fonts/montserrat-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-bold-webfont.woff') format('woff'),
         url('fonts/montserrat-bold-webfont.ttf') format('truetype'),
         url('fonts/montserrat-bold-webfont.svg#montserratbold') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'montserratregular';
    src: url('fonts/montserrat-regular-webfont.eot');
    src: url('fonts/montserrat-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-regular-webfont.woff') format('woff'),
         url('fonts/montserrat-regular-webfont.ttf') format('truetype'),
         url('fonts/montserrat-regular-webfont.svg#montserratregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'montserratsemi_bold';
    src: url('fonts/montserrat-semibold-webfont.eot');
    src: url('fonts/montserrat-semibold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-semibold-webfont.woff') format('woff'),
         url('fonts/montserrat-semibold-webfont.ttf') format('truetype'),
         url('fonts/montserrat-semibold-webfont.svg#montserratsemi_bold') format('svg');
    font-weight: normal;
    font-style: normal;

}
@font-face {
    font-family: 'montserratlight';
    src: url('fonts/montserrat-light-webfont.eot');
    src: url('fonts/montserrat-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/montserrat-light-webfont.woff') format('woff'),
         url('fonts/montserrat-light-webfont.ttf') format('truetype'),
         url('fonts/montserrat-light-webfont.svg#montserratlight') format('svg');
    font-weight: normal;
    font-style: normal;
}
