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

@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-Book.otf') format('opentype');
    font-weight: 400;
}
@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Medium.otf') format('opentype');
    font-weight: 500;
}

@font-face {
    font-family: 'Gotham';
    src: url('fonts/Gotham-Bold.otf') format('opentype');
    font-weight: 600;
}
@font-face {
    font-family: 'Didot';
    src: url('fonts/Didot.ttf') format('opentype');
    font-weight: 600;
}



html{
    scroll-behavior: smooth;
}
body{
    font-family: 'Gotham', sans-serif;
    font-size: 18px; 
    color: #000000;
    font-weight: 300;
    padding-top: 77px;
}

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: #000; text-decoration: none;}

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


/*COMMOM STYLES*/

.fw-bo{font-weight: 600;}
.fw-me{font-weight: 500;}
.fw-re, strong{font-weight: 400;}
.fw-li{font-weight: 300;}
.fw-xl{font-weight: 200;}
.fw-th{font-weight: 100;}


.fs-135{font-size: 135px;}
.fs-88{font-size: 88px;}
.fs-72{font-size: 72px;}
.fs-60{font-size: 60px;}
.fs-54{font-size: 54px;}
.fs-48{font-size: 48px;}
.fs-42{font-size: 42px;}
.fs-36{font-size: 36px;}
.fs-28{font-size: 28px;}
.fs-26{font-size: 26px;}
.fs-24{font-size: 24px;}
.fs-20{font-size: 20px;}
.fs-18{font-size: 18px;}
.fs-17{font-size: 17px;}
.fs-16{font-size: 16px;}
.fs-15{font-size: 15px;}
.fs-13{font-size: 13px;}

.ls-1{letter-spacing: 1px;}
.ls-2{letter-spacing: 2px;}
.ls-3{letter-spacing: 3px;}
.ls-4{letter-spacing: 4px;}
.ls-6{letter-spacing: 6px;}
.ls-10{letter-spacing: 10px;}

.lh-3{line-height: 3;}
.lh-2{line-height: 2;}
.lh-1{line-height: 1;}
.lh-15{line-height: 1.5;}

.mx-1500{max-width: 1500px;}
@media screen and (min-width:768px){
    .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;}

    .border-md-lt{border-left: 1px solid #000;}
  
}

.bg-lt{background-color: #efefef!important; }
.bg-grey{background-color: #484c4c!important; }
.bg-brand{background-color: #9a8479;}
.bg-dark{background-color: #53575A!important;}

.text-brand{color:#9a8479!important;}
.text-black{color:#000!important;}
.text-lt{color:#e2e2e2!important;}
.text-grey{color:#666666!important;}
.text-dark{color:#53575A!important;}
.text-blue{color:#00468B!important;}



.btn-brand{background-color: #9a8479; border:none; display: inline-block;  transition: all 0.32s ease-out; color: #FFF; font-size: 16px; padding: 10px 15px; letter-spacing: 1.5px; }
.btn-brand:hover{background-color: #484c4c; color: #FFF!important;}

.btn-share{outline:none;  background-image: url('../images/misc/share.png'); background-position: 90% 52%; background-repeat: no-repeat; padding-right: 65px; border: 0;}
.btn-share:hover{background-color: #535850;}
.btn-share:focus {border: none; outline: none; }

.learn-more{letter-spacing: 3px; font-size: 17px; color: #000; font-weight: 400; padding-bottom: 7px; padding-left: 0; border-bottom: 1px solid #000; display: inline-block;}
.learn-more:hover{transform: scale(1.05);}

.text-ul{border-bottom: 1px solid #9a8479;}
.text-uls:hover{border-bottom: 1px solid #9a8479;}

.has-bg{background-position: center; background-size: cover; }


.img-linked{
    -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;
}
.img-linked:hover{
    transform: scale(.96);
    cursor: pointer;
}

.text-linked{color: inherit;}
.text-linked:hover{color: inherit; text-decoration: underline;}

.overlay{width: 100%; height: 100%; left: 0; top: 0; position: absolute; background-color: rgba(154,132,121, .4);transition: all .35s linear;}
.mx-450{max-width: 450px;}

.customList{margin-left: 0px;}
.customList li{margin-bottom: 18px;}


 #sideNav{position: fixed;
  top: 350px;
  right: 0;
  z-index: 89;
  width: 50px;
  display: block;}

#sideNav .btn-social{padding: 11px;}
#sideNav .btn-fb{background-color: #000000;}
#sideNav .btn-ig{background-color: #000000;} 



@media screen and (max-width: 991px){
  body{padding-top: 0px;} 
  .fs-135{font-size: 85px;}
  .fs-72{font-size: 60px;}

}

@media screen and (max-width: 767px){
    .fs-135{font-size: 55px;}
    .fs-88{font-size: 50px;}
    .fs-72{font-size: 48px;}
    #sideNav .navbar-nav .nav-item{text-align: center;}
    #sideNav .navbar-toggler{margin-right: auto!important;}
}

@media screen and (max-width: 576px){
    .fs-135{font-size: 45px;}
    .fs-88{font-size: 40px;}
    .fs-72{font-size: 42px;}
    .fs-60{font-size: 36px;}
    .fs-54{font-size: 34px;}
    .fs-48{font-size: 36px;}
    .fs-42{font-size: 28px;}
    .fs-36{font-size: 24px;}
    .fs-26{font-size: 23px;}
    .fs-24{font-size: 22px;}
    .fs-20{font-size: 18px;}
    .fs-18{font-size: 17px;}
    .fs-17{font-size: 16px;}
    .fs-16{font-size: 15px;}
    .fs-15{font-size: 14px;}
    .fs-13{font-size: 13px;}
}

/* Navigation */

#topNavigation{background-color: #f1f1f1; height: 77px; padding:0 15px;}
#topNavigation .img-logo{position: absolute; right: 50px; top:10px; width: 225px;}
/* 
#topNavigation #nav-toggler{ display: block; } */
#topNavigation #nav-toggler span{ display: block; width: 52px; height: 3px; margin-bottom: 9px; background-color: #7f7f7f; transition: all .25s linear; position: relative;}
#topNavigation #nav-toggler span:first-child{width: 67px;}
.nav-open span:first-child{width: 0!important; opacity: 0!important;}
.nav-open span:nth-child(2){transform:rotate(-225deg)!important;   top: 1px; left: 3px;}
.nav-open span:nth-child(3){transform:rotate(225deg)!important;   top: -10px;  left: 5px;}


#topNavigation .nav-link{font-size: 17px; font-weight: 500; color:#000; padding:0 20px; height: 100%; display: flex; align-items: center;}
#topNavigation .nav-link:hover, #topNavigation  .activeNav{background-color: #998379; color: #FFF!important;}

#topNavigation .dropdown-menu{background-color: #998379; border-radius: 0; border:none;}
#topNavigation .dropdown-item{font-size: 17px; font-weight: 400; color: #FFF;}
#topNavigation .dropdown-item:hover{font-size: 17px; font-weight: 400; color: #000; background-color: transparent;}
#topNavigation .dropdown-toggle::after { content: none; } 

/* .menu-open{overflow: hidden; padding-right: 17px;} */


#topNavigation .menu-wrapper{background-color: #FFF; padding: 25px; width: 100%; max-width: 690px; position: absolute; left: -690px; opacity: 0; transition: all .45s  linear; top: 77px; min-height: 100vh;}
#topNavigation .menu-wrapper  ul{list-style-type: none;}
#topNavigation .menu-wrapper li{margin-bottom: 0;}
#topNavigation .menu-wrapper .sub-menu{font-weight: 400; color: #000;}
#topNavigation .menu-wrapper .sub-menu:hover{color: #666666;}
#topNavigation .menu-wrapper .nav-link{color: #9a8479; font-weight: 500; }
#topNavigation .menu-wrapper .nav-link:hover{color: #666666;}
.menu-show{left: 0!important; opacity: 1!important; transition: all .40s linear;}
#topNavigation .menu-title{color: #FFF; font-weight: 600; letter-spacing: 1px; padding-left: 15px;}


footer{background-color: #efefef; padding: 25px 15px;}
footer .img-logo{width: 185px;}

@media screen and (max-width: 991px){
    
  #topNavigation .navbar-toggler{position: absolute; top: 11px;}
   #topNavigation .navbar-collapse{width: auto; background-color: #f1f1f1;max-width: 95%;  padding: 46px;}
   #topNavigation .nav-link{padding: 10px 15px; color:#998379}
   #topNavigation .nav-link:hover{ background-color: transparent; color: #000!important;}
   #topNavigation .dropdown-menu{display: block; padding-left: 20px; background-color: transparent; color: #000; margin-top: -19px;}
   #topNavigation .dropdown-menu .dropdown-item{color: #000;}
   #topNavigation .dropdown-menu .dropdown-item:hover{color: #9a8479;}
   #topNavigation  .navbar-toggler:focus{outline: none; box-shadow: none;}
}


@media screen and (max-width: 576px){
    #topNavigation .dropdown-item{font-size: 14px;}
   #topNavigation .navbar-collapse{  padding: 35px 10px;}
   #topNavigation .dropdown-menu{display: block; padding-left:0;}
}


@media screen and (max-width: 991px){
    #topNavigation{height: 60px; padding: 17px 2px;}  
    #topNavigation  .fs-36{font-size: 20px;}
    #topNavigation .img-logo{width: 115px; top: 24px; right: 15px;} 
    #topNavigation .menu-wrapper{top: 60px; padding: 20px 0;}
    #topNavigation .menu-title{color: #000;}
}


@media screen and (min-width: 992px){
    #topNavigation  .navbar-nav{height: 77px;}
    #topNavigation .navbar-toggler{display: none;}
   
   #topNavigation  .dropdown:hover .dropdown-menu, .btn-group:hover .dropdown-menu{ display: block; }
   #topNavigation  .dropdown-menu{ margin-top: -3px; }
   #topNavigation .dropdown-item{padding-left: 40px;}
   #topNavigation  .dropdown-toggle{margin-bottom: 2px; }
   #topNavigation  .navbar .dropdown-toggle, .nav-tabs .dropdown-toggle{ margin-bottom: 0;}
}


@media screen and (max-width: 767px){
   
}

@media screen and (max-width: 576px){
    #topNavigation  .fs-36{font-size: 20px;}
}



.hero-section{ padding: 120px 55px 15px ;}
#home .hero-section{background-image: url('../images/misc/bg-nav.png'); background-position: top; background-repeat: repeat-x;  }
.hero-section .lf-block{width: 550px; float: left;}
.hero-section .lf-block h1{font-size: 109px;}
.hero-section .lf-block h2{font-size: 69px;}
.hero-section .rt-block{width: calc(100% - 550px); float:left;}


#heroCarousel .caption{position: absolute; left: 0; top: 100px; background-color: rgba(154,132,121, .81); display: flex; flex-flow: column;  justify-content: center;}
#heroCarousel #Slide2 .caption{top: 50px;}
#heroCarousel .caption h2{font-size: 64px;}

.home-projects .prj-status{top: 0; left: 0; padding: 15px;}
.home-projects .prj-name{left: 0; bottom: 0; padding: 15px; width: calc(100% - 80px);}
.home-projects .btn-explore{right: 0; bottom: 0; background-color: #9a8479; padding: 15px 25px;}
.home-projects:hover .overlay{background-color: rgb(0, 0, 0, .6) ;}

.home-about-us{background-image: url('../images/bg-about-us.png'); background-position: center left; background-size: contain; background-repeat: no-repeat;}

.stay-connected h2{font-size: 140px;}
#registrationForm .form-control{border-radius: 0; border: none; border-bottom: 1px solid #000; margin-bottom: 37px; font-weight: 300;}
#registrationForm .form-control::placeholder { color: #000; opacity: 1; }
#registrationForm .form-control:-ms-input-placeholder { color: #000;}
#registrationForm .form-control::-ms-input-placeholder { color: #000;}

#home{overflow-x: hidden;}
#customCarousel{margin-top: -2px; padding-top: 15px;}
#customCarousel .owl-stage-outer {overflow: visible;}
#customCarousel .owl-item{opacity: .4;}
#customCarousel .owl-item.active{opacity: 1;}
#customCarousel .owl-nav{position: absolute; top: -10px; padding-bottom: 50px;}
#customCarousel .owl-dots{display: none;}
#customCarousel .owl-nav .owl-prev,
#customCarousel .owl-nav .owl-next{width: 46px; height: 30px;}
#customCarousel .owl-nav .owl-prev span,
#customCarousel .owl-nav .owl-next span{display: none;}

#customCarousel .owl-nav .owl-prev{float: left; background-image: url('../images/misc/pr.png');margin-left: 23px;}
#customCarousel .owl-nav .owl-next{float:right; background-image: url('../images/misc/ne.png');}
.modal-dialog-custom{ max-width: 780px !important; }
 

@media screen and (min-width: 992px){
   .img-decor-text{right: -200px; position: relative;}
   .rt-col{border-left: 1px solid #000;}
}

@media screen and (max-width: 991px){
    .hero-section{padding: 20px 15px;}
    .hero-section .lf-block{width: 100%;}
    .hero-section .lf-block h1{font-size: 50px;}
    .hero-section .lf-block h1 br{display: none;}
    .hero-section .rt-block{width: 100%;}

    #heroCarousel .caption,
    #heroCarousel #Slide2 .caption{position: relative; top: 5px;}
    #heroCarousel .caption h2{font-size: 44px;}
    #heroCarousel .caption br{display: none;}

    .home-projects .prj-name{bottom: 55px;}

    .home-projects .btn-explore{position: relative!important;}
    .home-projects .btn-explore br{display: none;}

     #customCarousel .owl-item{opacity: 1; max-width: 50%; margin:  0 auto;}


    .img-g{width: 140px;}
    .img-24{width: 175px;}

    .service-24-hr{flex-flow:column;}

    .stay-connected h2{font-size: 95px; line-height: 1;}

    
}

@media screen and (max-width:767px){   
    #heroCarousel .caption h2{font-size: 34px;}

    .home-projects .prj-name .ls-3{letter-spacing: 1px; font-size: 14px;}
    .home-projects .prj-name .fs-16{font-size: 14px;}
    
    .img-g{width: 90px;}
    .img-24{width: 90px;}

    .stay-connected h2{font-size: 70px;}
    #customCarousel .owl-stage-outer {overflow: hidden;}
    .modal-dialog-custom {
      max-width: 360px !important;
  }
    .modal-content{ max-width: 380px !important; }
}

@media screen and (max-width:576px){   
    #heroCarousel .caption h2{font-size: 28px;}
    .stay-connected h2{font-size: 60px;}

    .home-projects .prj-status .fs-20{font-size: 14px;}
    .home-projects .prj-status .ls-3{letter-spacing: 0;}
    .home-projects .btn-explore {padding: 15px;}

}




/*PROJECTS CSS */
.project-nav-wrapper{width: 250px; float: left;}
.project-content-wrapper{width: calc(100% - 250px); float: left; padding-left: 60px; border-left: 1px solid #000;}


#projectNavigation .navbar-nav {flex-flow: column; margin-left: 5px!important;}
#projectNavigation .nav-item{margin-bottom: 25px; }
#projectNavigation .nav-link{color: #000; font-size: 17px; display: inline-block; padding: 0; transition: all .25s ease-in-out; font-weight: 500; }
#projectNavigation .nav-link:hover{color: #666666;   }
#projectNavigation .activeNav{color: #666666; border-bottom: 1px solid #666666; }
#projectNavigation .dropdown{list-style-type: none; padding: 10px 15px 0;}
#projectNavigation .dropdown li{margin-bottom: 15px;}

.fp-link{color: #000; transition: all .25s linear; display: block;}
.fp-link:hover{ color: #535850; opacity: .87;}

#accordionFloorplans .accordion-item{border:none; border-bottom: 1px solid #484c4c;}
#accordionFloorplans .accordion-button:not(.collapsed){background-color: #FFF;}
#accordionFloorplans .accordion-button:focus {box-shadow: none; border-color: rgba(0,0,0,.125);}

#accordionFloorplans  .accordion-button:not(.collapsed)::after{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash-lg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M2 8a.5.5 0 0 1 .5-.5h11a.5.5 0 0 1 0 1h-11A.5.5 0 0 1 2 8Z'/%3E%3C/svg%3E");}
#accordionFloorplans  .accordion-button::after{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus-lg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 2a.5.5 0 0 1 .5.5v5h5a.5.5 0 0 1 0 1h-5v5a.5.5 0 0 1-1 0v-5h-5a.5.5 0 0 1 0-1h5v-5A.5.5 0 0 1 8 2Z'/%3E%3C/svg%3E");}

.rendering-wrapper { display: block; margin: 0 auto;}
.img-rendering-Wrapper {  float: left;}

.info-box {
    position: absolute;
    z-index: 999;
    background: #FFF;
    padding: 0;
    border: 2px solid #535850;
    display: none;
    transform: translate(-50%, -50%);
    border-radius: 15px;
    transition: all .25s linear;
    font-weight: 600;
    font-size: 20px;
    text-align: center;
}
.info-box img{
	max-width: 100px;
	height: auto;
	border-radius: 15px;
}
.info-box:after, .info-box:before{
	top: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.info-box:after {
	border-color: rgba(255, 255, 255, 0);
	/* border-top-color: #FFF; */
	border-width: 30px;
	margin-left: -30px;
}
.info-box:before{
	border-color: rgba(0, 0, 0, 0);
	border-top-color: #535850;
	border-width: 33px;
	margin-left: -33px;
}
.add-border {
    border-left: .001rem solid #FFF;
    border-right: .001rem solid #FFF;
}
.img-selected {
    filter: opacity(50%) !important;
}

@media screen and (max-width: 991px){
    #projectNavigation {justify-content: end;}
    #projectNavigation .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='rgba(154, 132, 121, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");}
    #projectNavigation .navbar-toggler {border-color: rgba(255,255,255,0);} 
    #projectNavigation  .navbar-toggler:focus, .navbar-toggler:active { outline: none; box-shadow: none;  }

    .project-nav-wrapper{width:100%; float: none;}
    .project-content-wrapper{width:100%; float: none; padding: 0;}
}


/* lightbox */
.column {
    float: left;
    width: 25%;
    padding-top: 25px;
  }
.modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 120px;
    padding-bottom: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: black;
  }
  
  .modal-content {
    position: relative;
    background-color: #fefefe;
    margin: auto;
    padding: 0;
    display:block;
    width: 100%;
    /* max-width: 950px; */
  }
  
  .close {
    color: white;
    position: absolute;
    top: 0px;
    right: 0px;
    font-size: 35px;
    font-weight: bold;
  }
  
  .close:hover,
  .close:focus {
    color: #999;
    text-decoration: none;
    cursor: pointer;
  }
  
  .mySlides {
    display: none;
  }
  
  .cursor {
    cursor: pointer;
  }
  
  .prev,
  .next {
    cursor: pointer;
    position: absolute;
    top: 50%;
    width: auto;
    padding: 16px;
    margin-top: -50px;
    color: white;
    font-weight: bold;
    font-size: 20px;
    transition: 0.6s ease;
    border-radius: 0 3px 3px 0;
    user-select: none;
    -webkit-user-select: none;
  }
  
  .next {
    right: 0;
    border-radius: 3px 0 0 3px;
  }
  
  .prev:hover,
  .next:hover {
    background-color: rgba(0, 0, 0, 0.8);
  }
  
  .caption-container {
    background-color: black;
    color: white;
    font-size:28px;
    font-weight:500;
    padding: 1px 0px;
  }
  
  .demo {
    opacity: 0.6;
  }
  
  .active,
  .demo:hover {
    opacity: 1;
  }
  
  img.hover-shadow {
    transition: 0.3s;
  }
  
  .hover-shadow:hover {
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }

  /* lightbox over*/

  #videoModal    {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1055;
    display: none;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0;
    
  }

    #sharePopUp{z-index: 1099;}
    #videoModal   .modal-content{background-color:transparent;}
    #videoModal   .modal-header{border: none; padding-right: 0;}
    #videoModal   .modal-body{background-image: url('../images/logos/royal-pinehomes-logo.png'); background-position: center; background-repeat: no-repeat; border:5px solid #FFF;}
    #videoModal   .btn-close{color:#FFF; opacity: 1; font-size: 60px; padding-right: 0;}

    .slick-loading .slick-list{
        background: #fff url('../images/misc/loading.gif') center center no-repeat;
    }

    .slick-prev,
    .slick-next{
        position: absolute;
        top: 50%;
        display: block;
        width: 20px;
        height: 35px;
        padding: 0;
        -webkit-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        transform: translate(0, -50%);
        cursor: pointer;
        color: transparent;
        border: none;
        outline: none;
        background: transparent;
    }
    .slick-prev{
        left: -25px;
        background-image: url('../images/misc/prev2.png');
    }

    .slick-next{
        right: -25px;
        background-image: url('../images/misc/next2.png');
    }

    .slider-nav img:hover{cursor: pointer;}
    .slider-nav{width: calc(100% - 43px); margin:  0 auto;}




.customModel{
    z-index: 9999;
    background-color: #0000001f;
}

.custom-model-contant {
    background-color: #fefefe00;
    border: none;
}

.btn-closepopup {
    top: -30px;
    font-size: 20px;
    right: -12px;
    color: #fff;
    opacity: 1;
}

#register-bayview-heights  .bg-light{background-color: #FFF!important; margin-top: 0!important;}
#register-bayview-heights .register-heading{text-align: center;}
#register-bayview-heights .register-wrapper{margin-top: 0px!important;}
#register-bayview-heights .register-logo{position: relative; top: -120px!important; margin-bottom: -80px!important; max-width: 50%;}

@media screen and (min-width: 1599px){
    #popup .modal-dialog {max-width: 1100px!important;}
}