html{
    scroll-behavior:smooth;
}
.pg-logo{
    display:block;
    position:absolute;
    top:50%;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    width:30%;
    transform:translateY(-50%);
}
.pg-logo img{
    width:100%;
}
.form-pop{
width:400px;
padding:10px;
box-sizing:border-box;
background-color:#010f0d;
height:135px;
color:#b77153;
position:fixed;
z-index:25;
display:none;
margin:auto;
text-align:center;
left:calc(50% - 200px);
top:calc(50% - 67.5px);
border:2px solid #b77153;
}
.form-pop h4{
cursor:pointer;
}


.vid{
    position: absolute;
    top:0;
  width: 100%;
  height: 100vh;
 overflow:hidden;
}
.fullvid{
   position:absolute;
    top:-20%;
    left:-5%;
    width:110%;
    height:140%;
}

.tint{
    position:absolute;
    width:100%;
    height:100%;
    top:0;
    background-color:rgba(0,0,0,0.2);
}
.section-1{ 
    text-align:center;
     background:url(Images/floorplan-1.jpg);
    background-size:120%;
    background-color:white;
    color:#d6d4d0;
    background-color:white;
    
}
.section-1 p{
     padding:75px 20%;
     max-height:20vh;
     font-size:16px;
    line-height:24px;
    word-spacing:2px;
    margin:0;
}
.section-1 p:after{
    content:"";
    display:block;
    height:4px;
    width:90px;
    background-color:#B77153;
    margin:auto;
    margin-top:20px;
}
.sec-1-c{
    width:100%;
    height:100vh;
    overflow:hidden;
    position:relative;
    //background:url(Images/1_penthouse.jpg);
    //background-attachment:fixed;
    //background-size:100%;
}
#para-img-3{
    // position:absolute;
    //left:0;
    //top:-200px;
    width:100%;
    height:100%;
}
#para-img-1,#para-img-2,#para-img-4{
    top:-400px;
    height:auto;
    width:100%;
}
.section-2{
    padding:7% 12%;
    background:url(Images/sectiona-1.jpg);
    background-size:100%;
    background-color:white;
    color:#d6d4d0;
   
}
.p-big{
    font-size:60px;
    font-family:'georgia italic';
    margin:0;
    color:#B77153;
}
.p-bord{
    border-left:1px solid #B77153;
    margin-left:20px;
    padding-left:25px;
}
.p-big:after{
    content:"";
    display:block;
    height:4px;
    width:90px;
    background-color:#B77153;
    margin-top:5px;
}
.p-small{
    font-weight:600;
    color:#B77153;
    margin-top:0;
    margin-bottom:0;
}
.p-desc{
    font-size:1.2em;
    width:100%;
    font-size:16px;
    line-height:24px;
    word-spacing:2px;
}
.p-link{
    margin-top:40px;
    margin-bottom:0;
    font-size:17px;
    color:#B77153;
    text-decoration:none;
}
@keyframes dai{
    to{
        height:0;
    }
}
.ddai{
    animation:dai 0.5s linear forwards; 
}
@keyframes anim2{
    0%{
        height:70px;
    }
    50%{
        height:0px;
    }
    100%{
        height:70px;
    }
}
.arrow{
    width:2px;
    height:70px;
    background-color:#B77153;
    position:absolute;
    bottom:0;
    left:50%;
    transform:translateX(-50%);
    z-index:8;
    transition:all 0.5s linear ;
    animation:anim2 4s ease-out infinite;
}

.section-3{
    height:100vh;
    width:100%;
    position:relative;
    overflow:hidden;
    //background-size:100%;
}

.section-4{
    padding:7% 12%;
     background:url(Images/Banana.jpg);
    background-size:100%;
    background-color:white;
    color:#d6d4d0;
    
}
.section-5{
    padding:7% 12%;
     background:url(Images/sectionaa-1.jpg);
    background-size:100%;
    background-color:white;
    color:#d6d4d0;
    
}
.section-6,.section-7{
    position:relative;

}
.slider-2{
    width:100%;
}
.slide-2-cont{
    position:relative;
}
.slider-2 .slick-slide img{
    height:100vh;
    width:100%;
    margin:auto;
}
.left, .right{
    position:absolute;
    top:40%;
    z-index:3;
    cursor:pointer;
    margin: 0 20px;
}

.left img, .right img{
    height:60px;
}
.right{
    right:0;
}
.img-area{
    position:absolute;
    bottom:20px;
    left:0;
    width:100%;
}
.img-area ul{
    display:block;
    margin:auto;
    padding-left:0;
    text-align:center;
    font-size:20px;
    color:white;
    font-family:din-light;
}
.img-area ul li{
    list-style:none;
    text-decoration:none;
    display:inline-block;
    margin:10px 4%;
    vertical-align:top;
    cursor:pointer;
}
.img-area ul li:nth-child(1){
    color:#B77153;
    font-weight:bold;
}
.plan-legend{
position:absolute;
top:7%;
opacity:0;
transition:all 0.3s ease-in-out;
//transform:translateY(-50%);
}
.plan-legend p{
    color:#d6d4d0;
    font-size:13px;
    line-height:15px;
}
.plan-legend span{
    color:#B77153;
    font-weight:700;
}
.plan-legend-2{
    //position:absolute;
    //top:0;
    //padding-left:20px;
    //left:0;
    padding-bottom:10px;
    font-size:13px;
    font-family:din-next-lt-pro;
}
#plan-leg-1{
    left:0;
    padding-left:20px;
   
}
#plan-leg-2{
    right:0;
    padding-right:20px;
    text-align:right;
}
.spec-leg{
    color:#B77153!important;
}
.info-icon{
    position:absolute;
    top:75%;
    left:68%;
    transform:translateX(-50%);
    width:20px;
    cursor:pointer;
    z-index:3;
}
.sec-wing{
    position:absolute;
    bottom:20px;
    z-index:2;
    width:100%;
    display:none;
}
.p-wing{
    display:inline-block;
    font-size:25px;
    color:white;
    padding:10px 65px;
}
.slider{
    width:100%;
    height:100vh;
    overflow:hidden;
}
.slick-prev{
    left:25px!important;
    z-index:2;
}
.slick-next{
    right:25px!important;
    z-index:2;
}
.slider .slick-slide{
    width:100%;
}
.slider .slick-slide img{
    height:100vh;
    width:100%;
}
.slick-dots{
    bottom:7px!important;

}
.slick-dots li button:before{
    color:white!important;
    font-size:8px!important;
}
.slick-dotted.slick-slider{
    margin-bottom:0!important;
}
.section-7{
    background:url(Images/floorplan-1.jpg);
    background-size:100%;
    box-sizing:border-box;
   
}
.plan-head{
    width:100%;
    height:80vh;
    box-sizing:border-box;
    padding:40px 17% 30px 17%;
    margin:auto;
}
.plan-head img{
    height:100%;
    width:auto;
    display:block;
    margin:auto;
}
.plan-wing{
    text-align:center;
    margin:auto;
     padding-bottom:50px;
}

.p-wing-it{
     display:inline-block;
    font-size:20px;
    opacity:0.7;
    color:#d6d4d0;
    padding:3px 20px;
    cursor:pointer;
    letter-spacing:1px;
   margin-bottom:0;
    margin-top:0;
}
.p-wing-it:nth-child(1){
    color:#B77153;
}

.section-8{
    width:100%;
    position:relative;
    height:500px;
    overflow:hidden;
    
}
.vid-2 video{
    width:100%;
}
.play-vid{
    height:90px;
    width:90px;
    position:absolute;
    z-index:6;
    left:0;
    right:0;
    top:0;
    bottom:0;
    margin:auto;
    cursor:pointer;
    

}
.section-1ish{
    padding:7% 12%;
    text-align:center;
    color:#000;
    background-color:#efefef;
}
.section-1ish iframe{
    margin:auto;
width:70%;
min-height:300px;
display:block;
margin-top:0;
}
.section-1ish a{
    border:2px solid #b77153;
    color:#b77153;
    padding:5px 10px;
    background-color:#efefef;
    margin:40px 40px 10px;
    display:inline-block;
    width:200px;
    
}
.play-vid img{
    width:100%;
}
.section-9{
    width:25%;
    box-sizing:border-box;
    text-align:center;
    background-color:rgba(0,0,0,0.6);
    padding:25px;
    color:#000;
    box-sizing:border-box;
    position:absolute;
    height:80vh;
    right:50px;
    top:calc(50% + 40px);
    transform:translateY(-50%);
}
.sec-9-cont{
    position:relative;
    
    left:0;right:0;
    margin:auto;
}
.sec-9-p{
    font-family: 'din-light';
    font-weight:bold;
    color:#fff;
    font-size:50px;
    margin-bottom:0;
    margin-top:0;
}
.section-1ish .sec-9-p{
    color:#b77153;
}
.form-m{
    margin:auto;
    padding:0%;
}
.form-m input,select{
    width:100%;
    box-sizing:border-box;
    margin:10px 0;
    height:30px;
    font-size:15px;
    outline:none;
    background-color:rgba(214,212,208,0.5);
    border:none;
    padding:7px 20px;
    border-radius:10px;
    color:#fff;
    font-family:'din-light';
    font-weight:bold;
}
#input4{
    
}
.form-side{
    box-sizing:border-box;
    width:41%!important;
    margin:0 2%!important;
    display:inline-block!important;
    vertical-align:top;
    height:40px;
    font-size:15px;
    outline:none;
    background-color:rgba(214,212,208,0.2);
    border:none;
    padding:5px 20px;
    border-radius:10px;
    color:#d6d4d0;
}
.form-side option{
    background-color:white;
}
option::-webkit-scrollbar{
    width:7px;
}
option::-webkit-scrollbar-track{
    background:transparent;
}
.form-side::-webkit-scrollbar-thumb{
    background-color:#B77153;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: white;
}
::-moz-placeholder { /* Firefox 19+ */
  color: white;
}
:-ms-input-placeholder { /* IE 10+ */
  color: white;
}
:-moz-placeholder { /* Firefox 18- */
  color: white;
}
select{
    color:white;
    padding:7px 16px;
    height:30px;
    width:100%;
    -webkit-appearance:none;
    position:relative;
}
select::after {
    content: '\02C7';
    position: absolute;
    top: 0;
    width: 5px;
    height: 5px;
    right: 10px;
    bottom: 0;
    display:block;
    color:white;
    margin: auto;
    border-style: solid;
    border-width: 5px 5px 0 5px;
    border-color: #a52c2c transparent transparent transparent;
    pointer-events: none;
  }
option{
    color:#121212;
    font-family:din-light;
    font-weight:bold;
}
select:focus{
    color:white;
}
option:nth-child(1){
    color:#d6d4d0;
}
.form-m button{
    display:block;
    font-family:'SD Georgia Light';
    outline:none;
    cursor:pointer;
    border:2px solid #b77153;
    color:#b77153;
    padding:8px 10px;
    background-color:transparent;
    margin:5px auto 10px;
    font-size:16px;
    width:200px;
    font-family:din-light;
    font-weight:bold;
}
a{
    color:white;
    text-decoration:none;
}
.p-sep a{
    display:inline-block;
    padding-top:7px!important;
    margin:10px 5px;
    vertical-align:middle;
    line-height:16px;
    padding:10px 10px 7px 10px;
    border:2px solid #B77153;
    z-index:13;
     font-family:din-next-lt-pro;
     transition:all 0.5s linear;
    text-decoration:none;
    color:#B77153;
    vertical-align:top;
    letter-spacing:2px;
}
.p-sep{
    border:none;
    text-align:right;
    margin:0;
    margin-top:3px;
    top:0;
}
.p-sep-2{
    display:inline-block;
    padding-top:7px!important;
    margin:10px 0px;
    vertical-align:middle;
    line-height:16px;
    padding:10px 10px 7px 10px;
    z-index:13;
     font-family:din-next-lt-pro;
     transition:all 0.5s linear;
    text-decoration:none;
    color:#B77153;
    vertical-align:top;
    letter-spacing:2px;
}
.section-10{
    text-align:center;
    color:white;
    padding:40px 24%;
    background:url('Images/last-1.jpg');
    background-size:100%;
    line-height:1.5em;
}
.section-10 img{
    width:200px;
    margin:auto;
}

.ui-widget-header{
    background-color:#B77153!important;
    color:white!important;
}
.ui-widget-header a{
    color:white!important;
}
.ui-state-active{
    background:lightgray!important;
    color:black!important;
}
.ui-state-default{
    border:none!important;
    background:none;
    text-align:center!important;
}
.ui-state-highlight{
    background-color:#B77153!important;
     color:white!important;
}



.left, .right{
    position:absolute;
    top:40%;
    z-index:3;
    cursor:pointer;
    margin: 0 20px;
}
.left img, .right img{
    height:60px;
}
.right{
    right:0;
}
.left{
opacity:0.3;
}
.popup,.popup-2{
     background-color:rgba(0,0,0,0.7);
     position:fixed;
     height:100vh;
     width:100%;
     box-sizing:border-box;
     padding:5px;
     text-align:center;
color:white;
top:0;
     z-index:75;
     display:none;
}
.popup-in{
    width:70%;
    margin:auto;
    position:absolute;
    height:70vh;
    max-height:80vh;
    padding:20px 40px;
    box-sizing:border-box;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    background-color:#010f0d;
}
.popup button{
    border:2px solid #b77153;
    color:#b77153;
    padding:5px 10px;
    outline:none;
    background-color:transparent;
    margin-top:40px;
    cursor:pointer;
}
.p-in-scroll{
    height:90%;
overflow-y:scroll;
margin:10px;
padding:10px 30px;
}
.pop-in-scroll::-webkit-scrollbar{
    width:12px;
    
}
.pop-in-scroll::-webkit-scrollbar-track {
  background: #f1f1f1; 
}

/* Handle */
.pop-in-scroll::-webkit-scrollbar-thumb {
  background: #888; 
}

/* Handle on hover */
.pop-in-scroll::-webkit-scrollbar-thumb:hover {
  background: #555; 
}
.popup p {
margin : 0;
font-size:16px;
}
.popup a{
color:white;
text-decoration:underline;
}
.popup-close{
width:20px;
height:20px;
position:absolute;
right:10px;
top:4px;
cursor:pointer;
}
.section-10ish{
    background:url('shutterstock_688065598.jpg');
    background-size:100%;
    background-color:#efefef;
    padding:7% 7%;
    text-align:center;
    color:white;
}
.feature-n img{
    width:50%;
}
.feature-n{
    display:inline-block;
    width:23%;
    margin:5px 5%;
    vertical-align:top;
    text-align:center;
}
.slider-2 p{
    color:white;
    position:absolute;
    bottom:20px;
    left:0px;
    padding:10px 20px 10px 40px;
    font-size:25px;
    background-color:rgba(0,0,0,0.7);
    text-transform:uppercase;
}
.slider p{
    font-size:25px;
    color:white;
    position:absolute;
    font-weight:bold;
    background-color:rgba(0,0,0,0.5);
    padding:10px 20px 10px 40px;
    bottom:20px;
}

.section-bank{
    padding:70px 90px;
    text-align:center;
        color:#b77153;
min-height:60vh;
}
.section-bank-p{
    font-family: 'SD Georgia Light';
    color:#B77153;
    font-size:50px;
margin-bottom:20px;
text-align:center;

}
.bank-img{
    display:inline-block;
    width:20%;
    margin:10px;
}

@media all and (max-width : 1024px) and (orientation : portrait){
   .plan-head img{
       width:100%;
       height:auto;
   }

.pg-logo{
display:none;
width:90%;
}
.arrow{
    bottom:unset;
    top:calc(100vh - 80px);
}
.banner-slider{
    display:none;
}
.vid{
        display:none;
    }
    .header{
        background:url(Images/Facade.jpg) no-repeat;
        background-size:100%;
        background-position:top center;
        height:100%;
    }
    .pg-logo {
       
    }
    .slider-2 p{
        bottom:5px;
        font-size:18px;
    }
    .section-1{
       height:100%;
       background-size:auto 100%;

    }
    .section-1 p{
        max-height:100%;
        padding:50px 10%;
    }
    .section-10ish{
        background:url('shutterstock_688065598.jpg');
        background-position: center center;
-webkit-background-size: auto 100%;
-moz-background-size: cover;
-o-background-size: cover;
background-size: auto 100%;
    }
.sec-1-c{
height:50vh;
}
.sec-9-p{
        font-size:35px;
    }
.section-3{
        height:50vh;
    }
    .section-1ish a{
        margin:40px 0 10px;
    }
.slider,.slider-2{
        height:100%;
    }
    .slider .slick-slide img,.slider-2 .slick-slide img{
        height:100%;
    }
.section-2,.section-4,.section-5{
        background-size:auto 100%;
        padding:10% 10%;
    }
 .section-7{
        height:100%;
    }
.plan-head{
height:100%;
width:100%;
padding:40px 0px;
}
.plan-head img{
width:100%;
height:auto;
}
.info-icon{
display:none;
}
.p-wing-it{
font-size:14px;
}

.section-9{
        position:relative;
        background-size:auto 100%;
        right:0;
        width:100%;
        margin-top:100vh;
        
        transform:translateY(0);
        height:unset;
    }
    .sec-9-cont{
        position:static;
        top:0;
        transform:translateY(0%);
        height:100%;
    }
.section-10{
        background-size:auto 100%;
        padding:10% 10%;
        
}
.section-1ish{
    padding:10%;
}
.sec10-p{
    text-align:justify;
    text-align-last:center;
}
.popup-close{
width:30px;
height:30px;
right:10px;
top:2px;
cursor:pointer;
}
.section-1ish iframe{
    width:95%;
    min-height:250px;
    margin-bottom:30px;
}
 .popup p{
font-size:12px;
}
   .form-m{
       width:80%;
   }
    .form-m input,#input4,select{
        width:100%;
        display:block;
        
        box-sizing:border-box;
    }
   .section-9 p{
       line-height:1.4em;
   }
   .plan-legend{
bottom:10px;
position:initial;
display:none;
}
.plan-legend-1,.plan-legeng-2{
font-size:10px;
}
.feature-n{
    
    width:80%;
    
}
.popup-p{
    font-size:18px;
}
.popup-in{
    width:90%;
    padding:20px;
    overflow:hidden;
}
.section-bank{
padding:70px 10%;
height:80%;
overflow:scroll;
}
.bank-img{
width:90%;
}
}
@media all and (max-width : 1024px) and (orientation : landscape)
{
    .bank-img{
width:40%;
}
    .vid{
        display:none;
    }
    .header{
        background:none;
        background-size:100%;
        background-position:center 90px;
        height:100%;
    }
    .arrow{
    bottom:unset;
    top:calc(100vh - 80px);
}
    .pg-logo {
       opacity:0;
    }
    .plan-legend p{
    font-size:8px;
    line-height:normal;
}
    .section-1{
       height:100%;
       background-size:auto 100%;
    }
    .section-1 p{
        max-height:100%;
        padding:50px 10%;
        
    }
    .sec-1-c{
        height:100vh;
        
    }
   #para-img-1,#para-img-2,#para-img-3{
}
    .section-2,.section-4,.section-5{
        background-size:100% 100%;
        padding:10% 10%;
    }
    .p-big{
        font-size:50px;
    }
    .section-6{

    }
    .section-3{
        height:100vh;
    }
    .slider{
        height:100%;
    }
    .slider .slick-slide img{
        height:100%;
    }
    .sec-wing{
        bottom:0;
    }
    .p-desc{
        width:85%;
        text-align:justify;
    }
    .sec-9-p{
        font-size:35px;
    }
    .p-wing{
        font-size:10px;
    }
    .section-7{
        height:100%;
    }
    .plan-head{
        height:auto;
        padding:5%;
    }
    .plan-head img{
        width:auto;
        height:70vh;
    }
    .p-wing-it{
    font-size:10px;
    padding:3px 5px;
}
.plan-legend p{
    font-size:8px;
    line-height:normal;
}
    .section-8{
        height:auto;
    }
    .section-9{
        position:relative;
        height:100%;
        background-size:auto 100%;
        width:100%;
        left:0;
        top:0;
        transform:translateY(0);
    }
    .sec-9-cont{
        position:static;
        top:0;
        transform:translateY(0%);
        height:100%;
    }
    .form-m{
        width:80%;
    }
   
.popup{
max-width:100vw;
}
.popup p{
font-size:12px;
}
 .name-input{
width:345px!important;
}  
.slider p{
    font-size:18px;
}
#p-slide-1{
    bottom:40px;
}
#p-slide-2{
    bottom:30px;
}
#p-slide-3{
    bottom:140px;
}
}