@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Thin.ttf') format('truetype');
    font-weight: 200;
}
@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Light.ttf') format('truetype');
    font-weight: 300;
}
@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Regular.ttf') format('truetype');
    font-weight: 400;
}

@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Bold.ttf') format('truetype');
    font-weight: 500;
}

@font-face {
    font-family: 'Roboto';
    src: url('fonts/Roboto-Black.ttf') format('truetype');
    font-weight: 600;
}


@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Light.otf') format('opentype');
    font-weight: 300;
}

@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Light.otf') format('opentype');
    font-weight: 400;
}

@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Medium.otf') format('opentype');
    font-weight: 700;
}




body{
    font-family: 'Roboto', sans-serif;
    font-size: 18px; 
    color: #000;
    font-weight: 400;
}


.ff-go{font-family: 'Gotham', sans-serif; }

.fw-bo, strong{font-weight: 500;}

.fw-me{font-weight: 700;}
.fw-li{font-weight: 300;}

.fs-12{font-size: 12px;}
.fs-25{font-size: 25px;}
.fs-30{font-size: 30px;}
.fs-47{font-size: 47px;}
.fs-60{font-size: 60px;}

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


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

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

/*COMMOM STYLES*/

.bg-grey{background-color: #484c4c!important; }
.bg-brand{background-color: #00998D;}
.bg-green{background-color: #80B63F;}

.btn-brand{background-color: #00998D;  transition: all 0.32s ease-out; color: #FFF; font-family: 'Roboto', sans-serif; font-weight: 500; font-size: 15px; padding: 15px 25px; letter-spacing: 7px; border: 0; width: 100%; text-align: center; display: block;}
.btn-brand:hover{background-color: #ececec; color: #00998D!important;}

.text-brand{color:#00998D!important;}
.text-black{color:#000!important;}
.text-grey{color:#666666!important;}

.has-bg{background-position: center; background-size: cover; }
.has-border{border: 1px solid #A3A3A3;}

.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(.95);
    cursor: pointer;
}

.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; }

@media screen and (min-width: 1600px){
    .container{max-width: 1550px;}
}

@media screen and (max-width: 991px){
    body{font-size: 18px; }
    .fs-30{font-size: 28px;}
    .fs-47{font-size: 36px;}
    .fs-60{font-size: 50px;}

    .ls-2{letter-spacing: 1px;}
    .ls-5{letter-spacing: 3px;}
    .ls-10{letter-spacing: 7px;}
}

@media screen and (max-width: 767px){
    body{font-size: 17px; }
    .fs-30{font-size: 26px;}
    .fs-47{font-size: 32px;}
    .fs-60{font-size: 40px;}

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

@media screen and (max-width: 767px){
    body{font-size: 16px; }
    .fs-30{font-size: 24px;}
    .fs-47{font-size: 28px;}
    .fs-60{font-size: 20px;}
}



/* Navigation */

.nav-logo{position: absolute; left: 0; top: 0; z-index: 99; background-color: #FFF; } 

#hero-wrapper {
     height: 100vh; 
    width: 100%;
     position: relative; 
    overflow: hidden;
     min-height: 650px;
    z-index: 90;
}
#hero-video {
     min-width: 100%;
    min-height: 100%;
    height: auto;
    width: auto;
    position: absolute;
    left: 50%;
    top: 50%; 
    width: 100%;
     transform: translate(-50%, -50%);
    z-index: -10; 
}

#hero-wrapper .caption{
     position: absolute; bottom: 0; left: 0;  
    background-color: rgba(163, 163, 163, .8); padding: 20px 20px; width: 100%;}
#hero-wrapper .caption h1{color: #FFF; font-size: 45px; max-width: calc(100% - 425px);}

#hero-wrapper  #registrationForm{position: absolute;bottom:0;right: 0; z-index: 95; background-color: #FFF; padding: 10px 10px 0 10px; width: 425px;}


.customCarousel .title{
   color: #FFF;
    position: absolute;
    top: 15%;
    width: 100%;
    font-size: 58px;
    font-family: 'Roboto', sans-serif;
    font-weight: 500;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 5px;
    height: auto;
}
.customCarousel .caption{
   position: relative;
   left:0;
   bottom: 0;
   width: 100%;
   max-width: 100%;
   background-color: #FFF;
   border: 1px solid #A3A3A3;
   padding: 7px;
   z-index:1;
} 
.customCarousel.caption p{
   font-size: 16px;
   margin-bottom: 0;
}

.customCarousel .carousel-control-next, .customCarousel .carousel-control-prev{
    opacity: 1;
    width: 94px;
    z-index:2;

}
.customCarousel .carousel-control-next-icon, 
.customCarousel .carousel-control-prev-icon{
   width: 94px;
    height: 94px;
    background-color: #FFF;
    background-size: auto;
    border-bottom: 5px solid transparent;
}
.customCarousel .carousel-control-next-icon{
   background-image: url('../images/misc/next.png');
}
.customCarousel .carousel-control-prev-icon {
   background-image: url('../images/misc/prev.png');
}
#bostwick .caption, #jefferson .caption{
    right: 0;
    bottom: 0;
    z-index: 99;
    font-size: 15px;
    color: #ffffff;
    background-color: #00998D;
    padding: 4px 10px;
}
#bostwick .carousel-control-next-icon, 
#bostwick .carousel-control-prev-icon,
#jefferson .carousel-control-next-icon,
#jefferson .carousel-control-prev-icon{
   width: 40px;
    height: 40px;
    background-color: #FFF;
    background-size: auto;
    border-bottom: 1px solid transparent;
}
#bostwick .carousel-control-next-icon,
#jefferson .carousel-control-next-icon{
   background-image: url('../images/misc/next.png');
}
#bostwick .carousel-control-prev-icon,
#jefferson .carousel-control-prev-icon {
   background-image: url('../images/misc/prev.png');
}
#bostwick .carousel-control-next, 
#bostwick .carousel-control-prev, 
#jefferson .carousel-control-next, 
#jefferson .carousel-control-prev{
width: 6%;
}

.carousel-registerbtn{
    top: 118px;
    right: 0px;
    z-index: 89;
    /* width: 50px; */
    background: #80B63F;
    color: white;
    /* display: block; */
    writing-mode: vertical-rl;
    position: relative;
    padding: 10px;}
.text-section{position: absolute; bottom: 0; left: 0; height: 200%; width: calc(100% - .5rem); display: flex; align-items: center; margin-left:.25rem!important; margin-right:.25rem!important; font-size: 26px;}

.btn-ammTab{margin-bottom: 3px; transition: all .45s ease-in-out;}
.btn-ammTab:hover{cursor: pointer; background-color: #00998D;}
.ammenitiesRow{display: none;}
#naturalLifestyle{display: block;}

#map{width: 100%; height: 800px;}


.legend{display: flex; text-align: center; width: 100%; justify-content: center;}
.legend-wrapper{width: 150px; display: block;}
.legend-wrapper:hover{cursor: pointer;}
.legend-lable{font-size: 16px; margin-top: 14px;}

footer .img-footer-logo{width: 200px;}
.logo-social{filter: grayscale(1); width: 26px; height: auto;}

footer .scroll-up-down{
    transition: all .5s ease-in-out;
    background-color: #FFF;
    position: fixed;
    right: 100px;
    bottom: -100px;
    z-index: 999;
}
#intro {
    position: fixed;
    top: 0;
    left: 0;background-color: #fff;
    z-index: 199;height: 100vh;width: 100%;
    display: flex;
    align-items: center 
}

        @media screen and (max-width: 1599px){
            .carousel-registerbtn {
                top: 76px;}
        }

@media screen and (max-width: 1299px){
     #hero-wrapper{height: auto;}
    #hero-video { position: relative; top: inherit; left: inherit; width: 100%;  max-width: 100%; transform: none;}
    #hero-wrapper #registrationForm{position: relative; max-width: 100%; margin: 0 auto;}
    .hero-video-wrapper{position: relative;}
    #hero-wrapper .caption{padding: 15px; bottom: 5px;}
    #hero-wrapper .caption h1{font-size: 40px; max-width: 100%;}

    .customCarousel .carousel-item .title{font-size: 30px; top: 5%; letter-spacing: 2px;}
    .customCarousel .carousel-item .caption{max-width: 100%; position: relative; padding: 5px;}
    .customCarousel .carousel-control-next, 
    .customCarousel .carousel-control-prev{ width: 74px; align-items:flex-start; top:250px;}
     
     .text-section{font-size: 18px;}
     .btn-ammTab{height: 70px;}
     .carousel-registerbtn{top: 55px;padding: 8px;}
}

@media screen and (max-width: 991px){
    .img-nav-logo{width: 200px;}
    /* .carousel-registerbtn{display: none;} */
  
   #hero-wrapper .caption h1{font-size: 30px;}

    
    .text-section{width: 100%; position: relative; height: auto; margin-left: 0!important; margin-right: 0!important;}

    .customCarousel .carousel-item .title{font-size: 20px;}
    .customCarousel .carousel-control-next,
    .customCarousel .carousel-control-prev{ width: 44px; top:150px;}

    .legend-lable{font-size: 13px; }
    .legend-wrapper img{width: 50px; height: auto;}

}
@media screen and (max-width: 767px){
    .img-nav-logo{width: 150px;}
    #hero-wrapper .caption{position: relative; bottom: 5px;  background-color: rgba(163, 163, 163, .9);}
    #hero-wrapper .caption h1{font-size: 20px;}
    .customCarousel .carousel-control-next, 
    .customCarousel .carousel-control-prev{  width: 34px; top:70px;}
   
    
    .btn-ammTab{height: auto}
    .text-section{font-size: 17px;}
    .w-xs-50{width: 50%!important; padding: 2px; float: left;}

    .legend{display: inline-block;}
    .legend-wrapper{width: 30.33%; float: left;;}
    .legend-wrapper img{width: 35px; height: auto;}
    .legend-lable{font-size: 11px; }

    footer .img-footer-logo{width: 120px;}
    
}

@media screen and (max-width: 576px){
    .img-nav-logo{width: 100px;}

    #hero-wrapper .caption h1{font-size: 14px; max-width: 100%;}
   
    .customCarousel .carousel-control-next, 
    .customCarousel .carousel-control-prev{ top:50px;}
    .customCarousel .carousel-item .title{font-size: 16px;}
    .text-section{font-display: 16px;}
    #bostwick .caption, #jefferson .caption{font-size: 12px;}
}
@media screen and (max-width: 420px){
    .carousel-registerbtn {
        top: 50px;
        padding: 5px;
        font-size: 12px;
    }

}

#registrationForm .img-logo{width: 215px;}
#registrationForm {font-family: 'Roboto', sans-serif;}
#registrationForm .disclaimer{font-size: 9px; font-weight: 300; text-transform: uppercase;}
#registrationForm .form-control{border-radius: 0; border:none; background-color: #E2E2E2; margin-bottom: 24px;}
#registrationForm .form-control::placeholder { color: #495057; opacity: 1;  font-weight: 300; font-size: 15px; letter-spacing: 2px;}
#registrationForm .form-control:-ms-input-placeholder { color: #495057;  font-weight: 300; font-size: 15px;}
#registrationForm .form-control::-ms-input-placeholder { color: #495057;  font-weight: 300; font-size: 15px;}
#registrationForm  select {
    display: block;
   line-height: 1.3;
    padding: .6em 1.4em .5em .8em;
    margin: 0;
    font-weight: 300; font-size: 15px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    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%23000000%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%;
}
#registrationForm label{color: #495057;font-weight: 300; font-size: 15px;letter-spacing: 2px;text-transform: uppercase;}
.hero-video-wrapper .scroll-wrapper{position: absolute; left: 0; top: 0; height: calc(100vh - 70px); width: 100%; display: flex; justify-content: center; align-items: flex-end; z-index: 9;}

.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;
}
.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: 1499px){
    #registrationForm .form-control{margin-bottom: 15px;}
    #registrationForm .form-control::placeholder {  font-size: 13px;}
#registrationForm .form-control:-ms-input-placeholder { font-size: 13px;}
#registrationForm .form-control::-ms-input-placeholder{font-size: 13px;}
#registrationForm select{font-size: 13px;}
}


#preloader {
  background-color: #fff;
  display: table;
  height: 100%;
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 9999;
}
#spinner {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}
#spinner img {
max-width: 150px;
}
#preloader #disable-preloader {
  display: block;
  position: absolute;
  right: 30px;
  bottom: 30px;
}