@font-face {
    font-family: 'Acumin Variable Concept'; 
    src: url('fonts/AcuminVariableConcept.otf') format('opentype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Light.eot');
    src: url('fonts/Gotham-Light.eot?#iefix') format('embedded-opentype'),
        url('fonts/Gotham-Light.woff2') format('woff2'),
        url('fonts/Gotham-Light.woff') format('woff'),
        url('fonts/Gotham-Light.ttf') format('truetype'),
        url('fonts/Gotham-Light.svg#Gotham-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Bold.eot');
    src: url('fonts/Gotham-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/Gotham-Bold.woff2') format('woff2'),
        url('fonts/Gotham-Bold.woff') format('woff'),
        url('fonts/Gotham-Bold.ttf') format('truetype'),
        url('fonts/Gotham-Bold.svg#Gotham-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Medium.eot');
    src: url('fonts/Gotham-Medium.eot?#iefix') format('embedded-opentype'),
        url('fonts/Gotham-Medium.woff2') format('woff2'),
        url('fonts/Gotham-Medium.woff') format('woff'),
        url('fonts/Gotham-Medium.ttf') format('truetype'),
        url('fonts/Gotham-Medium.svg#Gotham-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham Book';
    src: url('fonts/Gotham-Book.eot');
    src: url('fonts/Gotham-Book.eot?#iefix') format('embedded-opentype'),
        url('fonts/Gotham-Book.woff2') format('woff2'),
        url('fonts/Gotham-Book.woff') format('woff'),
        url('fonts/Gotham-Book.ttf') format('truetype'),
        url('fonts/Gotham-Book.svg#Gotham-Book') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Black.eot');
    src: url('fonts/Gotham-Black.eot?#iefix') format('embedded-opentype'),
        url('fonts/Gotham-Black.woff2') format('woff2'),
        url('fonts/Gotham-Black.woff') format('woff'),
        url('fonts/Gotham-Black.ttf') format('truetype'),
        url('fonts/Gotham-Black.svg#Gotham-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Myriad Pro';
    src: url('fonts/MyriadPro-Regular.eot');
    src: url('fonts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/MyriadPro-Regular.woff2') format('woff2'),
        url('fonts/MyriadPro-Regular.woff') format('woff'),
        url('fonts/MyriadPro-Regular.ttf') format('truetype'),
        url('fonts/MyriadPro-Regular.svg#MyriadPro-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Bold.eot');
    src: url('fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans-Bold.woff2') format('woff2'),
        url('fonts/OpenSans-Bold.woff') format('woff'),
        url('fonts/OpenSans-Bold.ttf') format('truetype'),
        url('fonts/OpenSans-Bold.svg#OpenSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans.eot');
    src: url('fonts/OpenSans.eot?#iefix') format('embedded-opentype'),
        url('fonts/OpenSans.woff2') format('woff2'),
        url('fonts/OpenSans.woff') format('woff'),
        url('fonts/OpenSans.ttf') format('truetype'),
        url('fonts/OpenSans.svg#OpenSans') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Black.eot');
    src: url('fonts/Roboto-Black.eot?#iefix') format('embedded-opentype'),
        url('fonts/Roboto-Black.woff2') format('woff2'),
        url('fonts/Roboto-Black.woff') format('woff'),
        url('fonts/Roboto-Black.ttf') format('truetype'),
        url('fonts/Roboto-Black.svg#Roboto-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Regular.eot');
    src: url('fonts/Poppins-Regular.eot?#iefix') format('embedded-opentype'),
        url('fonts/Poppins-Regular.woff2') format('woff2'),
        url('fonts/Poppins-Regular.woff') format('woff'),
        url('fonts/Poppins-Regular.ttf') format('truetype'),
        url('fonts/Poppins-Regular.svg#Poppins-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

.gotham{font-family: 'Gotham';}
.poppins{font-family: 'Poppins';}
/* light-blue - #0693F7 */


html{
    scroll-behavior: smooth;
}
body{
   /* font-family: 'Poppins', sans-serif;*/
   font-family: Gotham Book;
    font-size: 18px; 
    font-weight: 400;
    color: #000;
    line-height: 1.3;
    letter-spacing: 0.8px;
    padding-top: 88px;
}

a{-webkit-transition: all 0.42s ease-out; -moz-transition: all 0.42s ease-out; -o-transition: all 0.42s ease-out; -ms-transition:  all 0.42s ease-out; transition: all 0.42s ease-out; text-decoration:none;}
a:hover{color: #AB7E18; text-decoration: none;}

::placeholder { color: 000; opacity: 1; }
:-ms-input-placeholder { color: 000;}
::-ms-input-placeholder { color: 000;}

/*COMMOM STYLES*/

.bg-grey{background-color: #656565!important; }
.bg-brand{background-color: rgb(0,117,123);}
.bg-black{background-color: #000;}
.bg-light{background-color: rgb(240 240 240)!important}
.bg-lightgrey{background-color: rgb(128 130 133 / 36%)!important}
.bg-darkgrey{background-color: rgb(80,81,80)!important}
.btn-brand{background-color: rgb(0,117,123);  transition: all 0.52s ease-out; color: #FFF; font-size: 16px; padding: 7px 15px; display: inline-block; border: 0;}
.btn-brand:hover{background-color: #ffffff; color: rgb(0,117,123)!important; }
.btn-submit{background-color: rgb(102,172,176);  transition: all 0.52s ease-out; color: #FFF; font-size: 20px;font-weight: 500;font-family: 'Gotham'; padding: 12px 48px; display: inline-block; border: 0;}
.btn-submit:hover{background-color: #ffffff; color: rgb(0,117,123)!important; }
.btn-grey{background-color: rgb(80,81,80);margin-left: .5rem;  transition: all 0.52s ease-out; color: #FFF; font-size: 20px; font-weight:700; padding: 15px 23px; display: inline-block; border: 0;}
.text-brand{color:rgb(0,70,71)!important;}
.text-black{color:#000!important;}
.text-green{color: #004647!important;}
.text-darkgrey{color:rgb(80,81,80)!important}
.text-vio{color: rgb(96,83,91);}
.has-bg{background-position: center; background-size: cover; }
.lh-1-7{line-height: 1.7;}
.lh-2{line-height: 2;}
 .lifestyle li{padding-bottom: 15px;}
.img-linked{
    -webkit-transition: all 0.42s ease-out;
    -moz-transition: all 0.42s ease-out;
    -o-transition: all 0.42s ease-out;
    -ms-transition:  all 0.42s ease-out;
    transition: all 0.42s ease-out;
}
.img-linked:hover{
    transform: scale(.96);
    cursor: pointer;
}
.text-linked{color: inherit;}
/* .text-linked:hover{color: inherit;} */

.fw-li{font-weight: 300;}
.fw-re{font-weight: 400;}
.fw-me{font-weight: 500;}
.fw-sb{font-weight: 600;}
.fw-bo, strong{font-weight: 700;}


.fs-12{font-size: 12px;}
.fs-14{font-size: 14px;}
.fs-16{font-size: 16px;}
.fs-18{font-size: 18px;}
.fs-20{font-size: 20px;}
.fs-21{font-size: 21px;}
.fs-22{font-size: 22px;}
.fs-24{font-size: 24px;}
.fs-28{font-size: 28px;}
.fs-30{font-size: 30px;}
.fs-32{font-size: 32px;}
.fs-34{font-size: 34px;}
.fs-36{font-size: 36px;}
.fs-40{font-size: 40px;}
.fs-45{font-size:45px;}
.fs-50{font-size: 50px;}
.fs-56{font-size: 56px;}
.fs-70{font-size: 70px;}


.ls-2{letter-spacing: 2px;}
.ls-5{letter-spacing: 5px;}

.accordion_head{font-size: 29px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;  }
.accordion_head:hover{cursor: pointer;}
.accordion_head .plusminus{background-color: #656565; color: #FFF; width: 40px;  height: 40px; text-align: center;}
.accordion_body{display: none; border-bottom: 1px solid #656565!important; border-top: 1px solid #656565; }

.customList li{margin-bottom: 15px; margin-left: -10px;}

.bg-nav {
    background-color: #004647;
}
.pull-right{float:right;}
.home{background: white;padding-bottom: 35px;}
    .btn-arrow{color: #fff;
        background-color: #0693F7;
        border-color: #0693F7;
        padding: 7px 15px;
        font-size: 14px;}
.arrow{
    position: absolute;
    bottom: 5%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.arrow span{
    display: block;
    width: 30px;
    height: 30px;
    border-bottom: 5px solid #FFF;
    border-right: 5px solid #FFF;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 2s infinite;
}
.arrow span:nth-child(2){
    animation-delay: -0.2s;
}                  
@keyframes animate {
    0%{
        opacity: 0;
        transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(45deg) translate(20px,20px);
    }
}
  
/*Carousel Gallery*/
.carousel-gallery{
	/* margin: 50px 0; */
  padding: 0 10px;
}

.carousel-gallery .swiper-slide{
			display: block;
			width: 100%;
			height: 280px;
			border-radius: 4px;
			overflow: hidden;
			position: relative;
			/* -webkit-box-shadow: 3px 2px 20px 0px rgba(0,0,0, .2);
      -moz-box-shadow: 3px 2px 20px 0px rgba(0,0,0, .2);
      box-shadow: 3px 2px 20px 0px rgba(0,0,0, .2); */
    }
    .carousel-gallery .swiper-slide a:hover .image .overlay{opacity: 1;}
    .carousel-gallery .image{
		width: 100%;
		height: 100%;
		background-size: cover;
         background-position: center center;
    }
              
    .carousel-gallery .image	.overlay
    {
		width: 100%;
		height: 100%;
		background-color: rgba(20,20,20, .8);
		text-align: center;
		opacity: 0;	
		-webkit-transition: all .2s linear; 
          -o-transition: all .2s linear; 
          transition: all .2s linear;
     }
     .carousel-gallery .image	.overlay em{
		color: #fff;
		font-size: 26px;
		position: relative;
        top: 50%; 
         -webkit-transform: translateY(-50%); 
          -ms-transform: translateY(-50%); 
          -o-transform: translateY(-50%); 
          transform: translateY(-50%);
          display: inline-block;
		}
        .carousel-gallery .swiper-pagination{
		position: relative;
		bottom: auto;
		text-align: center;
		margin-top: 25px;
    }
    .carousel-gallery .swiper-pagination-bullet{
			-webkit-transition: all .2s linear; 
      -o-transition: all .2s linear; 
      transition: all .2s linear;
        }
        .carousel-gallery  .swiper-pagination-bullet:hover{
				opacity: .7;
			}

            .carousel-gallery	.swiper-pagination-bullet .swiper-pagination-bullet-active{
				background-color: #d63031;
				transform: scale(1.1, 1.1)
			}
		
	

/*# Carousel Gallery*/

/*Carousel Gallery1*/
.carousel-gallery1{
	/* margin: 50px 0; */
  padding: 0 10px;
}

.carousel-gallery1 .swiper-slide{
			display: block;
			width: 100%;
			height: 350px;
			border-radius: 4px;
			overflow: hidden;
			position: relative;
			-webkit-box-shadow: 3px 2px 20px 0px rgba(0,0,0, .2);
      -moz-box-shadow: 3px 2px 20px 0px rgba(0,0,0, .2);
      box-shadow: 3px 2px 20px 0px rgba(0,0,0, .2);
    }
    .carousel-gallery1 .swiper-slide a:hover .image .overlay{opacity: 1;}
    .carousel-gallery1 .image{
		width: 100%;
		height: 100%;
		background-size: cover;
         background-position: center center;
    }
              
    .carousel-gallery1 .image	.overlay
    {
		width: 100%;
		height: 100%;
		background-color: rgba(20,20,20, .8);
		text-align: center;
		opacity: 0;	
		-webkit-transition: all .2s linear; 
          -o-transition: all .2s linear; 
          transition: all .2s linear;
     }
     .carousel-gallery1 .image	.overlay em{
		color: #fff;
		font-size: 26px;
		position: relative;
        top: 50%; 
         -webkit-transform: translateY(-50%); 
          -ms-transform: translateY(-50%); 
          -o-transform: translateY(-50%); 
          transform: translateY(-50%);
          display: inline-block;
        }
        

/* Navigation */
 .img-logo {
    width: 183px;
    /* position: absolute;
    top: 12px; */
}
#topNavigation .-link{display: inline-block; color: #FFF; padding: 10px 15px; font-size: 18px;}
#topNavigation .-link:hover{color: #000;}

/* 
#welcomeSlider .carousel-item{ background-repeat: no-repeat; background-position: center; background-size: cover; width: 100%; height: calc(100vh - 255px);} 
 background-color: rgba(255,255,255, .7);

*/
#welcomeSlider .carousel-indicators{margin-bottom: 2.5rem;}
#welcomeSlider .carousel-indicators li{width: 10px; height: 10px; opacity: 0.5;margin-right: 8px;margin-left: 8px;}
#welcomeSlider .carousel-indicators .active{background-color: #ffffff;opacity: 1;}
/* #welcomeSlider .carousel-indicators{opacity: 0.6;} */
#welcomeSlider #slide1{background-image: url('../images/hero/slider-1.jpg');}
#welcomeSlider #slide2{background-image: url('../images/hero/slider-2.jpg');}
#welcomeSlider #slide3{background-image: url('../images/hero/slider-3.jpg');}

#welcomeSlider .caption{transform: translate(-50%, -50%);font-weight: 700;text-align: center;top:50%;left:50%;line-height: 1.7;width: 60%;  position: absolute; color: #FFF;  z-index: 99; font-size: 40px; padding: 40px 30px 40px; text-shadow: 2px 2px 5px #333;}
#welcomeSlider .caption span{font-family: 'Gotham'; font-weight: bold;}
#welcomeSlider .caption p{font-size: 40px;font-weight: 100;margin-top:10px ;margin-bottom:35px ;line-height: 1.6;}
#welcomeSlider .caption a{background-color: rgb(232 52 59)!important;text-shadow: none;
    color: white;font-size: 20px;padding: 15px 20px;
    border-radius: 15px;}
#welcomeSlider .btn-wrapper {position: absolute; left: 0; bottom: 80px; z-index: 95; width:100%; text-align: center;}
/* #welcomeSlider .btn-brand {border: 4px solid #FFF; font-size: 19px; padding: 10px 15px; } */

#map{width: 100%; height: 650px;}
.img-gal-thumb:hover,.activeImg{filter: grayscale(1);}
footer{background-color: #00757B; padding: 30px;}
footer .img-logo{width: 230px;}
.ren-wrap {
    min-height:158px;
}
    .green-button{background-color: #004647;
        transition: all 0.52s ease-out;
        color: #FFF;
        font-size: 20px;
        padding: 15px 23px;
        display: inline-block;
        border: 0;margin-bottom: .5rem!important;}
#registrationForm .form-control{border: none; border-radius: 0; margin-bottom: 50px; font-size: 26px; font-weight: 300;padding: 1.3rem .75rem;border-bottom: 1px solid white;
    background: none;}
    #registrationFormhome .form-control{border: none; border-radius: 0;  font-size: 15px; font-weight: 300;
        color: rgb(128,130,133);}
#registrationForm .form-control:focus{outline: none;  box-shadow: none;}
#registrationFormhome .form-control:focus{outline: none;  box-shadow: none;}
#registrationForm .form-control::placeholder { color: white; opacity: 1; font-weight: 400; }
#registrationForm .form-control:-ms-input-placeholder { color: #ffffff;}
#registrationForm .form-control::-ms-input-placeholder { color: #ffffff;}
#registrationFormhome .form-control::placeholder { color: rgb(128,130,133); opacity: 1; font-weight: 400; }
#registrationFormhome .form-control:-ms-input-placeholder { color: rgb(128,130,133);}
#registrationFormhome .form-control::-ms-input-placeholder { color:  rgb(128,130,133);}
#registrationFormhome  select {
    display: block;
   line-height: 1.3;
    padding: .6em 1.4em .5em .8em!important;
    margin: 0;
    font-weight: 300;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    color: rgb(128,130,133);
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%236D470F%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat, repeat;
    background-position: right .7em top 50%, 0 0;
    background-size: .65em auto, 100%;
}
textarea{background: rgb(255 255 255 / 67%)!important;border-bottom: none!important;border-radius: 30px!important;padding-left: 2rem!important;}
.nav-wraper {
    max-width: 100%;
    margin: 0 auto;
    background-color: #fff;
    z-index: 9999;
}
     .nav-link {
        display: inline-block;
    color: white;
    font-size: 15px;
    font-weight: bold;
    padding: 2.21rem 1rem;
    }
    .nav{padding-bottom: 4rem;}
    .dropdown-menu .activeNav{color:#0693F7;}
    .dropdown-toggle::after{display: none;}
    #topNavigation{height: 90px;
        max-width: 100%;
    padding: 0;
        background-color: #050404;}
    #topNavigation .nav-link:hover {
        color: #ffffff;
    }
    #topNavigation .dropdown-menu {
        font-size: 16px;
        padding: 10px;
        transition: all .25s ease-in-out;
        margin-top: 40px;
        position: absolute;
  background-color: #fff;
  min-width: 150px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.5);/*Adds a drop shadow*/
  z-index: 1;
  border-radius: 0;
    }
    .dropdown-menu:before {
        content:''; 
    position: absolute; 
    top: 0;
    left: 22%;
    margin-left: -15px;
    margin-top:-15px; 
    width: 0;
    z-index:1;
    height: 0;
    border-bottom: solid 15px #FFF; 
    border-left: solid 17px transparent; 
    border-right: solid 17px transparent;
    -webkit-filter: drop-shadow(0px 0px 0px rgba(0,0,0,.5));
    filter: drop-shadow(0px 0px 0px rgba(0,0,0,.5));
      } 
      .activeNav{background: #004647;}
    .navbar-nav .dropdown-menu {
        position: static;
        float: none;
    }
    .dropdown-menu.show {
        display: block;
    }
    .open>.dropdown-menu {
        display: block;
    }
    .dropdown-item{padding: .40rem 1rem;}
    
    
    .dropdown-item:focus, .dropdown-item:hover {
        color: #0693F7;
         background-color: white;
    }
    .card{border: none;}
    .navbar-toggler {
        color: rgba(0,0,0,.5);
        border-color: #ffffff;
    }
    /* .navbar{padding: 2.5rem 0;} */
.bg{
    background-image: url(../images/bg.png);
    background-size: cover;
}
.centered {
    position: absolute;
    top: 57%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 34.66%;
    padding-right: 3rem!important;
    padding-left: 3rem!important;
    padding-top: 1.5rem!important;
    padding-bottom: 3rem!important;
}
.centered h3{font-size: 70px;}
.centered p{padding-right: 3rem!important;
    padding-left: 3rem!important;}
.centered-homes {
    position: absolute;
    bottom: 0px;
    right: 20%;
    top: 0px;
    width: 33%;
    padding-right: 0rem!important;
    padding-left: 0rem!important;
    padding-top: 1rem!important;
    padding-bottom: 1.9rem!important;
    background-color: #ffffffc7;
}
.centered-homes h3{font-size: 48px;text-align:left;font-weight: 300;font-family: 'Gotham';color: #004647;padding-top: 2.3rem;padding-left: 2rem;padding-bottom: 1rem;}
.centered-homes ul {list-style-type: none;font-size: 22px;padding-right: 2rem;text-indent: -1.5em;padding-left: 4rem;}
    .centered-homes ul li{padding-bottom: 17px;}
    .centered-homes ul li span{font-size: 26px;font-weight: 900;color: #004647; font-family: 'Gotham';}
    /* .centered-homes ul li:last-child{padding-bottom: 0px;} */
    .modal-content{background: none;border: none;}
    #sideNav{position: fixed; top: 55%; right: 12px; z-index: 89; display: block;}
    #sideNav .nav-register{padding: 14px 15px;;  background-color: #005839;  transform: rotate(-90deg); top: -123px; position: absolute; width: 170px; left: -57px;}
    #sideNav .nav-register:hover{background-color: #535850; }
    #sideNav .nav-register a{color: #FFF; font-weight: 500; display: block; }
    
    .btn-close{opacity:1;background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;}
    .modal-header{border-bottom: none;}
    .modal{top:30%}
    .modal-body{padding: 0rem;}
    #hero {
        background-image: url(/images/inside-hero.jpg);
    }
    #hero-home {
        background-image: url(/images/hero-home.jpg);
    }
    #hero-community {
        background-image: url(/images/hero-community.png);
    }
    #hero-lifestyle {
        background-image: url(/images/hero-lifestyle.png);
    }
    #hero-reason {
        background-image: url(/images/hero-reason.png);
    }
    #hero-contact {
        background-image: url(/images/hero-contact.png);
    }
    #hero-blog {
        background-image: url(/images/hero-blog.jpg);
    }
    #hero-thankyou {
        background-image: url(/images/hero-thankyou.jpg);
    }
    .hero {
        height: 50vh;
        position: relative;
        width: 100%;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .hero-caption {
        position: absolute;
    left: 50%;
    /* width: 100%; */
    top: 80%;
    line-height: 1;
    color: #fff;
    text-align: center;
    text-shadow: 2px 2px 5px #1a1a1a;
    font-weight: bold;
    font-family: 'Gotham';
    font-size: 60px;
    transform: translate(-50%, -50%);
    letter-spacing: 3px;
    }
    .hero-caption span{font-size: 24px;font-family: 'gotham';font-weight: 500;text-transform: uppercase;}
    .img-plus {
        position: absolute;
        right: 12px;
    bottom: 24px;
    }
.btn-home{border: 1px solid black;
    border-radius: 14px;
    padding: 25px 35px;
    font-size: 20px;
    letter-spacing: .5px;
    color: #ffffff;
    background-color: black;
    font-size: 22px;
    font-weight: 500;}
    .btn-home:hover{color:#0693F7}
.pr-5{padding-right: 3rem;}
.pl-5{padding-left: 3rem;}
.pr-6{padding-right: 4rem;}
.pl-6{padding-left: 4rem;}
.py-6{padding-left: 4rem;padding-right: 4rem;}
hr{opacity: 1;}
.text-right{text-align: right;}

.home-3 p{font-size: 20px;padding-left: 2.5rem;padding-right: 2.5rem;line-height: 1.5;}
    #welcomeCarousel .carousel-item {
        height: calc(74vh - 70px);
        width: 100%;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        animation-name: homepagehero;
        animation-duration: 7s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
      }
      #welcomeCarousel #hero-1 {
        background-image: url("/images/hero-1.jpg");
      }
      #welcomeCarousel #hero-2 {
        background-image: url("/images/hero/slider-2.jpg");
      }
      #welcomeCarousel #hero-3 {
        background-image: url("/images/hero/slider-3.jpg");
      }
      #welcomeCarousel #hero-4 {
        background-image: url("/images/hero/slider-4.jpg");
      }
      .content-desktop {display: block;}
      .content-mobile {display: none;}
.body-height {
    min-height:51vh;
}    
.img-circle{position: absolute;
    left: 50%;
    top: 55%;
    transform: translate(-50%, -50%);
    width: 110px;}
    .swiper-pagination-bullet{width: 20px!important;border-radius: 0!important;}
    .swiper-pagination-bullet-active{background: rgb(128,130,133)!important;}
    .bg-com {
        background-image: url(/images/bg-com.jpg);
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        height: 50vh;
        /* min-height: 200px; */
        position: relative;
    }



    .contact{padding-left: 3rem;}
    .contact h3{font-size: 32px; color:rgb(0,117,123);font-family: 'gotham'; font-weight: 500;padding-bottom: 20px; padding-top: 20px;}
    .contact h4{font-size: 28px;font-family: 'gotham'; font-size: bold;padding-bottom: 20px;}
    .contact h5{font-size: 24px;font-family: 'gotham'; font-weight: 500;}
    .contact h5 a{color: black;}
b{font-family: 'Gotham';}
    .overlay {
        position:absolute;
        top:50%;
        left:50%;
        z-index:1;
        text-align: center;
        width: 48%;
        transform: translate(-50%, -50%);
    }
#welcome video{position:relative;
    z-index:0;}

    .overlay h3{font-size: 70px;color: white;padding-top: 1rem;padding-bottom: 1rem;line-height: 1;}
    .overlay h5{font-size: 39px;color: white;font-family: 'Gotham'; font-weight: 500;padding-bottom: 3rem;}
    .overlay h5 span{font-size: 49px;font-family: 'Gotham'; font-weight: bold;}

    .btn-register-now{
        padding: 20px 30px;
        font-size: 20px;
        letter-spacing: .5px;
        color: #ffffff;
        background-color: #f70f30;
        font-weight: 500;
    font-family: 'Gotham';
    }
.vision h1{font-family: 'Gotham';
font-weight: 300;color:rgb(0,70,71);text-align: center;}
.vision p span{font-family: 'Gotham';font-weight: bold;}
.vision p{font-size: 20px;}
.vision .flex-item-right p{padding-left: 3rem;}
.vision .flex-item-left p{padding-right: 3rem;}

.container-menu {
    max-width: 1320px;
}

.flex {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;
}
.flex-item-left {
    flex: 50%;
}
.flex-item-right {
    flex: 50%;
}

.home-blog h3{font-family: 'Gotham'; font-weight: bold;font-size: 30px;color: rgb(0,117,123);padding-left: 1.5rem}
.home-blog h6{font-size: 20px;padding-bottom: 1rem;padding-left: 1.5rem}
.home-blog p{padding-left: 1.5rem;line-height: 1.6;}
.register h2{font-family: 'Gotham';font-weight: bold;font-size: 52px;color: white;padding-top: 1rem;padding-bottom: 1rem;}
.register h6{font-size: 22px;color: white;}
.choose-home h2{font-size: 70px;font-family: 'Gotham'; font-weight: 300;color: rgb(0,70,71);;text-align: center;}
.homes-detail a{font-size: 40px;color: #004647}
.homes-detail h6{font-size: 26px;padding-top: 0rem;}
.homes-detail{padding-top: 1rem;}

.home-detail h3{font-size: 44px;color: #004647}
.home-detail h6{font-size: 28px;padding-top: 0rem;}
.home-detail{padding-top: 1rem;}
.home-detail .btn-dwld{background-color: #004647;
    transition: all 0.52s ease-out;
    color: #FFF;
    font-size: 20px;
    padding: 15px 23px;
    display: inline-block;
    border: 0;margin-bottom: .5rem!important;}
.money h2{font-size: 76px;font-family: 'Acumin Variable Concept';text-align: center;color: white;padding-top: 2.5rem;
    padding-bottom: 1rem;}
.money .bg{background-color: #245F63;}
.money h3{font-size: 60px;font-family: 'Gotham';font-weight: bold;color: #00757B; padding-bottom: 1rem;}
.money h4{font-size: 32px;font-family: 'Gotham';font-weight: bold;padding-bottom: .5rem;}
.money p{padding-bottom: 1rem;}
.money .btn{background-color: #245F63;
    transition: all 0.52s ease-out;
    color: #FFF;
    font-size: 20px;
    padding: 15px 30px;
    display: inline-block;
    border: 0;}

      .zoom-area
      {
          width: 804px;
          position: relative;
          cursor: none
      }
      /* for create magnify glass */
      .large
      {
          width: 300px;
          height: 300px;
          position: absolute;
          border-radius: 100%;
      
          /* for box shadow for glass effect */
          box-shadow: 0 0 0 7px rgba(255, 255, 255, 0.85), 
          0 0 7px 7px rgba(0, 0, 0, 0.25), 
          inset 0 0 40px 2px rgba(0, 0, 0, 0.25);
          
          /*for hide the glass by default*/
          display: none;
      }
      .small
      {
          display: block;
      }
      .bancroft p{padding-bottom: 1rem;line-height: 1.7;}
.ame ul li{padding-bottom: 20px;}
.ame ul{font-size: 22px;}
.reason{border:20px solid rgb(204 204 204)}
 
.reason ul{font-size: 22px;list-style-type: none;padding-left: 6rem;}
.reason ul li{padding-bottom: 2.5rem;padding-right: 4rem;position: relative;padding-left: 1.5rem;line-height: 40px;}
.reason ul li span{font-size: 32px;font-family: 'Gotham';font-weight: bold; position: absolute;background: #004647;color: white; padding: 0px 16px;margin-right: 4rem;height: 53px;width: 53px;
    --size: 52px;
        left: calc(-1 * var(--size) - 10px);
        line-height: var(--size);
        width: var(--size);
        height: var(--size);}
.reason ul li:first-child span{padding: 0px 19px;}
.reason ul li:last-child span{padding: 0px 9px;}
.reason ul li:last-child {padding-bottom: 0rem;}
.reason ul li ul{list-style: disc;}
.reason ul li ul li{padding-bottom: 0;}

.popup-box {
    position: fixed;
    right: 12px;
    bottom: 14px;
    z-index: 99;
    transition: all .15s ease-in-out;
    background: white;
}
.popup-box #closeBtn {
    position: absolute;
    right: -10px;
    top: -10px;
}
.navbar{padding-top: 0;}
.scroll-wrapper{position: absolute; left: 0; top: 0; height: calc(70vh - 70px); width: 100%; display: flex; justify-content: center; align-items: flex-end; z-index: 9;}

.arrow{
    position: absolute;
    bottom: 19%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.arrow span{
    display: block;
    width: 30px;
    height: 30px;
    border-bottom: 5px solid #FFF;
    border-right: 5px solid #FFF;
    transform: rotate(45deg);
    margin: -10px;
    animation: animate 2s infinite;
}
.arrow span:nth-child(2){
    animation-delay: -0.2s;
}
.arrow span:nth-child(3){
    animation-delay: -0.4s;
}

@keyframes animate {
    0%{
        opacity: 0;
        transform: rotate(45deg) translate(-20px,-20px);
    }
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        transform: rotate(45deg) translate(20px,20px);
    }
}














    @media screen and (max-width: 767px){
        .fs-12{font-size: 12px;}
         .fs-16{font-size: 16px;}
         .fs-34{font-size: 28px;}
         .fs-50{font-size: 40px;}
         .fs-56{font-size: 46px;}
         .fs-70{font-size: 50px;}
         .fs-36 {
            font-size: 24px;
        }
     }
     
     @media screen and (max-width: 576px){
         .fs-12{font-size: 12px;}
         .fs-16{font-size: 16px;}
         .fs-34{font-size: 22px;}
         .fs-50{font-size: 32px;}
         .fs-56{font-size: 35px;}
         .fs-70{font-size: 45px;}
         .fs-36 {
            font-size: 18px;
        }
     }

 
 
 
 
     @media (min-width:1630px) and (max-width:1850px){
                    .centered-homes {width: 41%;}              
     }
     @media (min-width:1515px) and (max-width:1629px){
                    .centered-homes {width: 47%;}
                    .centered-homes ul li {
                        padding-bottom: 15px;
                    }
                    .centered-homes h3 {
                        font-size: 45px;padding-top: 1.3rem;}
                        .bg-com{height: 43vh;}
                        #welcomeSlider .caption{width:70% ;}
     }
 
@media (min-width:1300px) and (max-width:1515px){
    .centered {
        top: 39%;
    }
    .centered p{padding-right: 0rem!important;
        padding-left: 0rem!important;}
        .centered-homes{width: 50%;}
        .centered-homes h3{font-size: 40px;padding-top: 0rem;}
        .centered-homes ul{
            font-size: 20px;}
            .centered-homes ul li {
                padding-bottom: 15px;
            }
            .centered-homes ul li span{
                font-size: 21px;
            }
            .bg-com{height: 39vh;}
            #welcomeSlider .caption{width:80% ;}
            #welcomeCarousel .carousel-item {
                height: calc(63vh - 70px);}
    }
    @media (min-width:200px) and (max-width:1181px){
        .nav{padding-bottom: 1rem;}
        .nav-link {
            padding: .5rem 1rem;
        }
    }
    @media (min-width:993px) and (max-width:1299px){
        .centered {
            top: 62%;
            padding-right: 0.5rem!important;
    padding-left: 0.5rem!important;
    padding-top: .5rem!important;
    padding-bottom: 1.5rem!important;
        }
        .centered h3{font-size: 35px;}
        .centered p{padding-right: 0rem!important;
            padding-left: 0rem!important;}
            .centered-homes{width: 55%;}
            .centered-homes h3{font-size: 30px;padding-top: 0rem;padding-bottom: 0rem;}
        .centered-homes ul{
            font-size: 17px;}
            .centered-homes ul li {
                padding-bottom: 7px;
            }
            .centered-homes ul li span{font-size: 20px;}
            
            .overlay{width: 77%;}
            .overlay h3{font-size: 50px;}
            .overlay h5{font-size: 30px;}
            .bg-com{height: 28vh;}
            #welcomeSlider .caption{width:95% ;font-size: 25px;}
            #welcomeCarousel .carousel-item {
                height: calc(49vh - 70px);}
        }

@media screen and (max-width: 992px){
    .navbar-toggler-icon {background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgb(255, 255,255)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
    }
    .flex {
        flex-direction: column;
      }
    .navbar-toggler:focus, .navbar-toggler:active {
        outline: none;
        box-shadow: none;
      }
      .fs-20{font-size: 17px;}
      body{font-size: 16px;}
      .register h6{font-size: 19px;}
      .register h2{font-size: 40px;}
      .choose-home h2{font-size: 45px;}
      .homes-detail a{font-size: 35px;}
      .ame ul{font-size: 19px;}
      #topNavigation .dropdown-menu {text-align: center;}
      .swap{flex-direction: column-reverse!important;}      
    .content-desktop {display: none!important;}
.content-mobile {display: block!important;}
    .dotborder-left{background-image: none;}
    .border-left-black{border: none;}
    .activeNav span{border-top: none;}
    .nav-link span {
        padding: 3px 0;
    }
    .bg-home {
        height: 50vh!important;
    }
    .centered{position: relative;transform: none;width: 100%;left: 0;}
    .centered-homes{position: relative;transform: none;width: 100%;left: 0;border-radius: 0;}
    
            .centered-homes h3{font-size: 35px;text-align: center;}
        .centered-homes ul{
            font-size: 16px;text-align: center;}
            .centered-homes ul li {
                padding-bottom: 15px;
            }
            
            .flex-item-right, .flex-item-left {
                flex: 100%;
            }
            .swap {
                flex-direction: column-reverse!important;
            }
            .pl-0{
                padding-left: 1rem!important;
            }
            .pr-0 {
                padding-right: 1rem!important;
            }
            .vision .flex-item-right p{padding-left: 0rem;padding-top: 1rem;}
            .vision .flex-item-left p{padding-right: 0rem;padding-top: 1rem;}
            .overlay{width: 100%;}
            .overlay h3{font-size: 30px;}
            .overlay h5{font-size: 20px;}
.overlay img{width: 300px;}
.home-blog h3{padding-top: 2rem;}
.hero{height: 32vh;}
.hero-caption{font-size: 33px;top: 70%;}
.hero-caption span{font-size: 20px;}
#topNavigation .navbar-collapse {
    width: 100%;
    background-color: black;
    padding-top: 15px;
    left: 0;
}
.vision p {
    font-size: 17px;
}
    .img-logo {
        width: 93px;
    }
    #topNavigation .navbar {
        background-color: black;
    }
    .zoom-area {
        width: 350px;}

        .reason ul {
            font-size: 17px;
            padding-left: 4rem;
        }
        .reason ul li {
            padding-bottom: 2rem;
            padding-right: 0rem;
            padding-left: 1rem;
            line-height: 20px;
        }
        .reason ul li span {
            font-size: 27px;
            padding: 0px 13px;
            margin-right: 3rem;
            --size: 42px;
        }
        .reason ul li:first-child span {
            padding: 0px 16px;
        }
        .reason ul li:last-child span {
            padding: 0px 6px;
        }
        .money h2{font-size: 45px;}
        .money h3{font-size: 40px;}
        .bg-com{height: 20vh;}

        .contact h3{font-size: 25px; }
        .contact h4{font-size: 20px;}
        .contact h5{font-size: 17px;}
        .scroll-wrapper{display: none;}
        .carousel-inner{overflow: visible;}
                        #welcomeSlider .caption{position: relative;font-size: 20px;color: black;width: 100%;top: 20%;text-shadow:none}
                        #welcomeCarousel .carousel-item {
                            height: calc(49vh - 70px);}
                            #welcomeSlider .caption p{font-size: 23px;}
                            #welcomeSlider{margin-bottom: 10rem;}
                       
    }

    @media screen and (max-width: 860px){
        #welcomeCarousel .carousel-item {
        height: calc(42vh - 70px);}
        #welcomeSlider .caption{top: 35%;}
    }


@media screen and (max-width: 767px){
    /* #welcomeSlider .carousel-item{ height: 450px;} */
    #welcomeSlider .btn-wrapper{display: none;}
    /* #welcomeSlider .caption{font-size: 24px;  padding: 20px; max-width: 375px;}
    #welcomeSlider .caption p{font-size: 17px;width: 400px;} */
    .img-gal-thumb{width: 23%; margin-top: 5px; text-align: center;}
    #sideNav .navbar-nav .nav-item{text-align: center;}
    #sideNav .navbar-toggler{margin-right: auto!important;
        margin-left: auto!important;}
        .popup-box{display: none;}
                .btn-grey{margin-left: 0;}
                .home-detail h3 {
                    font-size: 34px;}
                    .home-detail h6 {
                        font-size: 25px;}
                        
                        .overlay h3 {
                            font-size: 25px;
                        }
                        .overlay h5 span{font-size: 23px;}
                        
                        .hero {
                            height: 27vh;
                        }
                        #welcomeCarousel .carousel-item {
                            height: calc(35vh - 70px);}
                           
                            #welcomeSlider .caption{top: 50%;font-size: 19px;}
                            .bg-com {
                                height: 17vh;
                            }
 }
 
@media screen and (max-width: 576px){
    
    #topNavigation .-link{padding: 10px 4px; font-size: 14px;}
      
    footer .img-logo{width: 130px;}
            .hero-caption{font-size: 20px;top: 65%;width: 100%;}
            .hero-caption span{font-size: 17px;}
            .home-detail h3 {
                font-size: 30px;}
                .home-detail h6 {
                    font-size: 20px;}
                    .home-detail .btn-dwld{font-size: 16px;}
                    .btn-grey{font-size: 16px;}
                    
                    .overlay h3 {
                        font-size: 16px;padding-bottom: 0rem;padding-top: 0rem;
                    }
                    .overlay h5 span{font-size: 15px;}
                    .overlay h5{font-size: 14px;padding-bottom: 0rem;}
                    .btn-register-now{font-size: 14px;padding: 12px 20px;}
                    .hero {
                        height: 17vh;
                    }
                    #welcomeCarousel .carousel-item {
                        height: calc(29vh - 70px);}
                        #welcomeSlider .caption{top: 58%;font-size: 16px;}
                        .bg-com {
                            height: 12vh;
                        }
}

@media screen and (max-width:400px){
    
    .hero {
        height: 13vh;
    }
   
}
    @media screen and (min-width: 768px)
    {
        
       .dropdown-menu {
             margin-top: 0;
               }
            
            
            .navbar-expand-lg .navbar-nav .nav-item:last-child .nav-link{font-family: 'Gotham';
        font-weight: bold;}
        .mt-md-lg{margin-top: 60px!important;}
        .mb-md-lg{margin-bottom: 60px!important;}
    
        .mt-md-xl{margin-top: 100px!important;}
        .mb-md-xl{margin-bottom: 100px!important;}
        .modal-dialog {
            max-width: 700px;}
    }
    @media screen and (min-width: 992px)
    {
        .text-md-left {
            text-align: left!important;
        }
        /* #topNavigation {
            padding-bottom: 0;
            padding-right: 35px;
        } */
}
@media (min-width: 1400px){
    .container {
        max-width: 1170px;
    }
}