@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;200;300;400;500;600;700;800;900&display=swap');
body{
    font-family: 'Montserrat', sans-serif;
}
#hero{
    position:relative;
    min-height:100vh;
    width:100%;
    height:auto;

}
#header{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index: 1000;
    padding:25px 0;
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100;Neutral+Density */
    background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
#header.dark-header{
    position:fixed;
    left:0;
    right:0;
    top:0;
    padding:5px 0;
    background:rgba(16,66,109,0.8);
   
}

.logo{
    display:block;
    width:120px;
    height:120px;
    top:0;
    bottom:0;
    left:0;
    position:absolute;
    margin:auto;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
#header.dark-header .header-container .logo{
    width:60px;
    height:60px;
}
.header-container{
    position:relative;
    padding:30px 350px 30px 120px;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;

}
#header.dark-header .header-container{
    padding:10px 350px 10px 120px;
}
a,a:hover,button{
    color:#000;
    text-decoration: none !important;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
.header-menu-list{
    text-align:right;
    margin:0;
    padding:0;
    list-style: none;
}
.header-menu-list li{

    display:inline-block;
}
.header-menu-list li a{
    text-transform: uppercase;
    color:#fff;
    font-size:0.8rem;
    font-weight: 600;
    padding:15px 25px;
    display:block;
}
.header-menu-list li a:hover{
    color:rgba(255,255,255,0.7);
}
.header-menu-list li a.active,.header-menu-list li a.active:hover{
    color:#f7BD7E;
}
.normal-icon{
    font-size:1.4rem;
    vertical-align: middle;
    line-height: 1;
}
.big-icon{
    font-size:1.7rem;
    vertical-align: middle;
    line-height: 1; 
}
.monster-icon{
    font-size:2.6rem;
    vertical-align: middle;
    line-height: 1; 
}
.make-reservation{
    color:#000;
    background:#f7bd7e;
    padding:15px 30px;
    border-radius: 30px;
    text-transform: uppercase;
    font-size:0.8rem;
    font-weight: 600;
    line-height: 1;
    position:absolute;
    display:inline-block;
    right:70px;
    top:0;
    bottom:0;
    margin:auto;
    height:45px;
    width:255px;
    text-align: center;
    border:0;
}
.make-reservation .hidden-mobile{
    margin-left:5px;
    display:inline-block;
}
.make-reservation:hover,.main-btn:hover{
    color:#000;
    background:#dda972;
}
.lang-selection{
    position:absolute;
    right:0;
    top:0;
    bottom:0;
    height:45px;
    margin:auto;
}
.lang-selection .dropdown-toggle{
    font-size:0.8rem;
    text-transform: uppercase;
    font-weight: 600;
    height:45px;
    padding:15px 10px;
    display:inline-block;
    color:#fff;
    line-height:1 ;
    width:60px;
    text-align: center;
}
.btn:focus,.btn.active:focus,.form-control:focus{
    box-shadow:0 0 0 .2rem rgba(0,123,255,0)
}
.lang-selection .dropdown-menu{
    width:60px;
    left:0;
    right:0;
    min-width: 60px;
    padding:0;
    overflow: hidden;
}
.lang-selection .dropdown-menu .dropdown-item{
    padding:0.25rem 1rem;
    font-size:0.8rem;
    font-weight: 600;
    text-align: center;
}
.lang-selection .dropdown-menu .dropdown-item:hover,.lang-selection .dropdown-menu .dropdown-item:focus{
    background:#10426D;
    color:#fff;
}
.burger-menu{
    position:absolute;
    display:none;
    width:40px;
    height:40px;
    color:#fff;
    cursor:pointer;
    top:0;
    bottom:0;
    margin:auto;
    right:0;
    text-align:center;
    padding:7px 0;
}
.main-btn{
    color:#000;
    background:#f7bd7e;
    padding:12px 30px;
    border-radius: 30px;
    text-transform: uppercase;
    font-size:0.8rem;
    font-weight: 600;
    line-height: 1;
    display:inline-block;
    text-align: center;
    border:0;
}
.thin{
    font-weight: 300;
}
.normal{
    font-weight: 400;
}
.medium{
    font-weight: 500;
}
.bold {
    font-weight: 600;
}
.extra-bold{
    font-weight: 700;
}
.black{
    font-weight: 800;
}
.hero-title{
    color:#fff;
    font-size:3.6rem;
    font-weight: 300;
    margin-bottom:1.5rem;
}
.hero-description{
    line-height: 1.7;
    color:#fff;
    font-weight: 300;
}
.form-group-icon {
    position:relative;
}
.white-label{
    font-weight: 500;
    font-size:0.8rem;
    color:#fff;
}
.white{
    color:#fff;
}
.form-icon{
    color:#fff;
    display:block;
    width:22px;
    height:22px;
    position:absolute;
    top:0;
    bottom:0;
    margin:auto;
    left:10px;
    pointer-events: none;
}
#bookingSearch input{
    border:1px solid #fff;
    color:#fff;
    cursor:pointer;
    background:rgba(255,255,255,0.2);
}
.form-control-with-icon{
    padding-left:40px;
    font-size:0.9rem;
    background:transparent;
    color:#fff;
}
.form-control{
    height:40px;
}
.datepicker--day-name {
    color: #172c99;
}
.datepicker--cell.-current- {
    color:#172c99;
    background:rgba(90,150,108,0.1);
}
.datepicker--cell.-selected-, .datepicker--cell.-selected-.-current-,.datepicker--cell.-selected-.-current-:hover,.datepicker--cell.-selected-:hover {
    background: #172c99;
}
#bookingSearch input:focus{
    background:#172c99;
    border-color:#172c99;
}

#bookingSearch input::-webkit-input-placeholder { /* Edge */
    color: #fff;
  }
  
#bookingSearch input:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #fff;
  }
  
#bookingSearch input::placeholder {
    color: #fff;
  }
  .scroll-down-object{
      position:absolute;
      height:20px;
      width:120px;
      left:0;
      right:0;
      margin:auto;
      bottom:70px;
      display:block;
      pointer-events: none;
  }
  .scroll-down-text{
      font-size:0.6rem;
      text-transform: uppercase;
      color:rgba(255,255,255,0.5);
      display:block;
      text-align: center;
  }
  .scroll-down-object:before{
      content:"";
      background:#d4d4d4;
      position:absolute;
      top:40px;
      left:0;
      right:0;
      margin:auto;
      width:2px;
      height:100px;
  }
  #home-about{
      background:#fff;
      padding-top:80px;
  }
  .subtitle{
      color:rgba(0,0,0,0.35);
      font-size:1.2rem;
      font-weight: 300;
  }
  .section-title{
      font-weight: 400;
  }
  .section-subtitle{
      font-weight: 400;
      margin-bottom:1rem;
      
      line-height: 1.4 !important;
  }
  .about-image{
      position:relative;
      width:50%;
  }
  .about-info{
      width:50%;
      padding:150px 150px;
      background:#fff;
  }
  .outline-btn{
    color:rgba(37,37,37,0.7);
    background:transparent;
    padding:12px 30px;
    border-radius: 30px;
    text-transform: uppercase;
    font-size:0.8rem;
    font-weight: 600;
    line-height: 1;
    display:inline-block;
    text-align: center;
    border:1px solid rgba(37,37,37,0.7);
  }
  .outline-btn:hover{
    color:rgba(37,37,37,1);
    border:1px solid rgba(37,37,37,1);
  }
  .play-video{
      background:#10426D;
      width:200px;
      height:300px;
      display:block;
      position:absolute;
      top:0;
      bottom:0;
      right:-100px;
      margin:auto;
  }
  .video-line{
      width:2px;
      top:120px;
      bottom:80px;
      background:rgba(255,255,255,0.8);
      position:absolute;
      left:0;
      right:0;
      margin:auto;
  }
  .video-text{
      position:absolute;
      left:10px;
      right:10px;
      display:block;
      text-transform: uppercase;
      font-size:0.8rem;
      text-align: center;
      bottom:40px;
  }
  .video-icon{
      display:block;
      border-radius: 50%;
      position:absolute;
      left:0;
      right:0;
      width:48px;
      height:48px;
      border:2px solid rgba(255,255,255,0.6);
      margin:auto;
      top:50px;
      text-align: center;
      color:rgba(255,255,255,0.8);
      padding:9px 0;
  }
  .play-video:hover{
      background:#0d375a;
  }
  .play-video:hover .video-icon{
    border:2px solid rgba(255,255,255,1);
    color:rgba(255,255,255,1);
  }
  .description-text{
      line-height: 1.7;
      color:rgba(0,0,0,0.65);
  }
  .room-header{
      background:#f0f0f0;
  }
  .room-header-content{
      padding:50px 0 50px 80px;
      position:relative;
  }
  .room-header-content img{
      position:absolute;
      width:70px;
      height:70px;
      top:0;
      left:0;
      bottom:0;
      margin:auto;
  }
  .room-box{
      display:block;
      width:33.33%;
      height:400px;
      background:#10426D;
      position:relative;
      overflow: hidden;
  }
  .room-image{
      position:absolute;
      left:0;
      top:0;
      right:0;
      bottom:0;
      z-index: 10;
      -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
  }
  .room-caption{
      position:absolute;
      left:0;
      right:0;
      bottom:0;
      padding:50px 100px 50px 50px;
      /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.65+100 */
        background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%); /* FF3.6-15 */
        background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
      z-index:20;
      color:#fff;
      -webkit-transition: all 300ms ease;
      -moz-transition: all 300ms ease;
      -ms-transition: all 300ms ease;
      -o-transition: all 300ms ease;
      transition: all 300ms ease;
  }
  .room-box:hover .room-caption{
    padding:50px 100px 100px 50px;
  }
  .room-box .description-text {
      color:#fff;
  }
  .room-box-arrow{
      width:42px;
      height:42px;
      border:2px solid rgba(255,255,255,0.2);
      display:block;
      border-radius: 50%;
      text-align: center;
      padding:8px 0;
      position:absolute;
      right:50px;
      bottom:50px;
      margin:auto;
  }
  .оutline-white-btn{
      border-color:rgba(255,255,255,0.5) !important;
      color:#fff !important;
  }
  .room-box .outline-btn{
      position:absolute;
      left:50px;
      bottom:-150px;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      filter: alpha(opacity=0);
      -moz-opacity: 0;
      -khtml-opacity: 0;
      opacity: 0;
      
  }
  .room-box:hover  .room-caption .outline-btn{
      bottom:50px;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      filter: alpha(opacity=100);
      -moz-opacity: 1;
      -khtml-opacity: 1;
      opacity: 1;
      -webkit-transition: all 500ms ease;
      -moz-transition: all 500ms ease;
      -ms-transition: all 500ms ease;
      -o-transition: all 500ms ease;
      transition: all 500ms ease;
  }
  .room-box:hover .room-image{
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    -khtml-opacity: 0.5;
    opacity: 0.5;
    
  }
  .footer-top{
      padding:120px 0;
      background:#fffbea;
  }
  .footer-bottom{
      padding:30px 0;
      background:#fff;
  }
  .copyright{
      font-size:0.8rem;
      color:rgba(0,0,0,0.75);
  }
.copyright a{
    display:inline-block;
    padding:0 10px; 
    font-weight: 500;
}
.f-contact-box{
    padding-left:50px;
    border-left:1px solid #ccc;
}
.f-title{
    font-size:0.85rem;
    display:block;
    margin-bottom:20px;
    color:rgba(0,0,0,0.65);
}
.f-list{
    margin:0;
    padding:0;
    list-style: none;
}
.f-list li a{
    font-weight: 600;
    display:block;
    padding:3px 0;
    font-size:0.9rem;
}
.content-header{
    position:relative;
    padding:200px 0 80px 0;
}
.page-title{
    font-weight: 400;
}
.row-small {
    margin:0 -5px;
}
.row-small > div{
    padding:0 5px;
}
.white-opacity{
    color:rgba(255,255,255,0.75);
}
.page-title {
    font-size:2.4rem;
}
.content{
    padding:50px 0;
}
.gray-content{
    background:#f0f0f0;
}
.gray-btn{
    color:#000;
    background:rgba(0,0,0,0.1);
    padding:12px 30px;
    border-radius: 30px;
    text-transform: uppercase;
    font-size:0.8rem;
    font-weight: 600;
    line-height: 1;
    display:inline-block;
    text-align: center;
    border:0;   
}
.green{
    color:#f7bd7e;
}
.about-section{
    margin-top:30px;
}
.room-list-item{
    background:#fff;
    padding-left:25%;
    position:relative;
    margin-bottom:20px;
}
.room-list-item-image{
    position:absolute;
    width:25%;
    left:0;
    top:0;
    bottom:0;
}
.room-list-item-content{
    padding:40px 80px;
}
.rooms-counter{
    background:#10426D;
    padding:10px 10px 10px 50px;
    position:relative;
    color:#fff;
}
.rooms-counter-icon{
    position:absolute;
    left:20px;
    top:0;
    bottom:0;
    margin:auto;
    width:22px;
    height:22px;
    display:block;
}
.tiny-text{
    font-size:0.7rem;
}
.black-70{
    color:rgba(0,0,0,0.7)
}
.period-price{
    display:block;
    font-size:1.6rem;
    font-weight: 700;
}
.period-price-box{
    padding:15px 0;
}
.medium-text{
    font-size:0.9rem;
}
.room-extra{
    width:25%;
    padding:5px 5px 5px 0px;
    position:relative;
    font-size:0.8rem;

}
.room-extra-icon{
    margin-right:5px;
}
.buttons-container{
    margin:15px 0 0 0;
}
.modal-body{
    background:#f0f0f0;
    padding:60px 100px;
}
.modal-header{
    padding:0;
    position:relative;
    border:0;
}
.modal-header-content{
    padding:30px 100px;
    position:relative;
    width:100%;
}
.close-modal{
    position:absolute;
    right:50px;
    width:32px;
    height:32px;
    cursor:pointer;
    text-align: center;
    display:block;
    top:0;
    bottom:0;
    margin:auto;
    padding:2px 0;
}
.modal-header-icon{
    position:absolute;
    left:50px;
    display:block;
    top:0;
    bottom:0;
    height:42px;
    width:42px;
    margin:auto;
}
.c-label,.custom-control-label{
    color:rgba(0,0,0,0.5);
    font-weight: 600;
    display:block;
    font-size:0.9rem;
}
.form-control-white{
    border-color:#fff;
    color:#000;
    font-size:0.9rem;
}
.form-control-white:focus{
    border-color:#fff;
}
.big-btn{
    font-size:0.9rem;
    padding: 15px 30px;
}
.modal-body .custom-control-label::before{
    border-color:#fff;
}
.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #10426D;
    background-color: #10426D;
}
.underline{
    text-decoration: underline !important;
}
.small-btn{
    font-size:0.75rem;
    padding:8px 25px;
}
.contact-box{
    position:relative;
    padding:0 100px;
}
.custom-control-input:focus~.custom-control-label::before{box-shadow:0 0 0 .2rem rgba(0,123,255,0)}
.contact-box-icon{
    position:absolute;
    left:50px;
    top:0;
}
.gallery-box{
    margin:0 -5px;
}
.gallery-item{
    width:calc(25% - 10px);
    margin:0 5px 10px 5px;
    position:relative;
}
.gallery-item-overlay{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    text-align: center;
    background:rgba(16,66,109,0.8);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    -khtml-opacity: 0;
    opacity: 0;
    -webkit-transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
    transition: all 500ms ease;
}
.gallery-item:hover .gallery-item-overlay{
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
}
.content-box-about{
    padding:100px 0;
}
.normal-list{
    margin:0;
    padding:0;
    list-style: none;
}
.normal-list li{
    padding:5px 0 5px 65px;
    font-size:0.9rem;
    font-weight: 600;
    display:block;
    position:relative;
}
.normal-list-icon{
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    margin:auto;
    display:block;
    width:55px;
    height:55px;
}
.normal-list-icon img{
	max-width:100%;
}
.room-item .room-gallery,.room-item .room-information{
    width:50%;
}
.room-gallery{
    cursor: pointer;
}
.room-information{
    padding:100px;
}
.room-capacity{
    background:rgba(16,66,109,0.1);
    margin-top:15px;
}
.room-capacity > div{
    width:50%;
    padding:15px 20px;
}
.room-price{
    font-size:1.4rem;
}
.room-capacity > div:last-child{
    background:rgba(16,66,109,0.1);
}
.room-extras.room-extras-2 .room-extra{
    width:50%;
    
}
@media all and (-ms-high-contrast:none)
    {
    *::-ms-backdrop,
    [data-aos^=fade][data-aos^=fade],[data-aos^=zoom][data-aos^=zoom]{
    opacity: 1;
    }
}
@media (min-width: 1440px){
    .container, .container-lg, .container-md, .container-sm, .container-xl {
        max-width: 1400px;
    }
}
@media(max-width:1200px){
    .container, .container-lg, .container-md, .container-sm {
        max-width:100%;
    }
    .header-menu-list li a{
        padding:15px 15px;
    }
}

@media(max-width:1024px){
    .header-menu{
        position:absolute;
        top:65px;
        left:-15px;
        right:-15px;
        background:#10426D;
        padding:15px;
        display:none;
    }
    .visible-menu .header-menu{
        display:block;
    }
    .header-menu li a{
        padding:5px 15px;
    }
    .hidden-mobile{
        display:none  !important;
        
    }
    .make-reservation{
        width:45px;
        padding: 10px 10px !important;
        right:100px;
        text-align: center;
        display: block !important;
    }
    .lang-selection{
        right:40px;
    }
    .burger-menu{
        display:block;
    }

    .header-container ,#header.dark-header .header-container {
        padding: 20px 120px 20px 100px;
        height:60px;
    }

    #header{
        padding:5px 0;
        background: rgba(0,0,0,0.75);
    }
    #header .header-container .logo {
        width: 60px;
        height: 60px;
    }
    .header-menu-list li a.active, .header-menu-list li a.active:hover{
        color:#fff;
    }
    .header-menu-list li{
        width:100%;
        display:block;
    }
    .header-menu-list{
        text-align: left;
    }
    .visible-menu .burger-menu i:before{
        content: "\f00d";
    }
    .hero-title{
        font-size:2.4rem;
    }

    .about-image,.about-info {
        width: 100%
    }
    .about-image{
        height:500px;
    }
    .play-video{
        left:0;
        right:0;
        margin:auto;
        top:initial;
        bottom:-75px;
        height:220px;
    }
    .about-info{
        padding:110px 30px 50px 30px;
        height:auto !important;
    }
    .room-header-content{
        padding:20px 0 20px 80px;
    }
    .room-header .text-right{
        text-align: left !important;
    }
    .room-caption{
        padding: 50px 60px 30px 20px;
    }
    .room-box:hover .room-caption{
        padding:50px 60px 80px 20px;
    }
    .room-box .outline-btn{
        left:20px;
    }
    .room-box-arrow{
        right:20px;
    }
    .room-caption h3{
        font-size:1.4rem;
    }
    .gallery-item {
        width: calc(33.33% - 10px);
    }
    .room-list-item-image{
        position:relative;
        left:initial;
        right:initial;
        top:initial;
        bottom:initial;
        height:300px;
        width:100%;
    }
    .room-list-item{
        padding:0;
    }
    .room-list-item-content {
        padding: 15px;
    }
    .room-gallery{
        width:100% !important;
        height:300px;
        position:absolute;
        left:0;
        top:0;
        right:0;
    }
    .room-information{
        width:100% !important;
        padding:30px 15px ;
    }
    .room-item{
        display:block !important;
        position:relative;
        padding-top:300px;
    }
}
@media(max-width:768px){
    .room-box {
        width: 100%;
        height:350px;
    }
    .f-contact-box{
        margin-top:30px;
        border:0;
        padding:0;
    }
    .footer-top {
        padding: 60px 0;
    }
    .content-header {
        padding: 100px 0 20px 0;
    }
    .section-title{
        font-size:1.4rem;
    }
    .content-box-about{
        padding:0px 0 50px 0;
    }
    .about-info {
        padding: 110px 15px 50px 15px;
    }
    .contact-box{
        padding:40px 0 0 0;
    }
    .contact-box-icon {
        position: absolute;
        left: 0px;
        top: 0;
    }
    .gallery-item {
        width: calc(50% - 10px);
    }
    .page-title{
        font-size:2rem;
    }
    .content-header h5{
        font-size:1rem;
        margin:0;
    }
    .modal-title{
        font-size:1.2rem;
    }
    .modal-body {
        background: #f0f0f0;
        padding: 30px 50px;
    }
    .modal-header-content {
        padding: 15px 60px;
    }
    .modal-header-icon{
        left:15px;
    }
    .close-modal{
        right:15px;
    }
    .hero-title {
        font-size: 1.8rem;
    }
    .hero-description {
        font-size:0.85rem;
    }
	.room-extra {
		width: 100%;
	}
}