/*Animations*/
.fadeinleft {
    opacity:0;
    transform: translateX(200px);
    transition: all 1.3s ease-out;
}

.fadeinright{
    opacity: 0;
    transform: translateX(-200px);
    transition: all 0.8s ease-out;
}

.fadeindown{
    opacity: 0;
    transform: translateY(-100px);
    transition: all 1.2s ease-out;
}

.fade-in{
    opacity:0;
    transition: all 1.3s ease-in;
}

.active-left,.active,.active-right,.active-down{
    opacity:1;
    transform: translateX(0);
    transform: translateY(0);
}



.fadein{
opacity: 0;
}   


/* End Animations*/

html,body
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
}

body{
    background-color: #fafafa;
}

h1,h2,h3,h4,h5,h6{
    font-family: 'Old Standard TT';
}

p{
    font-family: 'Poppins';
}

.navbar{
    background-color: transparent!important;
    box-shadow: none;
    padding: 20px 0px;
}

.navbar li{
    margin: 0px 10px;
}

.navbar li a{
    color: white;
    font-family: 'poppins';
    font-weight: 400;
    font-size: 18px;
    border-bottom: 2px solid transparent;
}

.navbar li a:hover{
    border-bottom: 2px solid #eeba1d;
    color: white;
}


.navbar li a.active{
    color: white!important;
    border-bottom: 2px solid #eeba1d;
    color: white;
}

#head-home{
    background: url('../img/almare-head.jpg')rgba(0, 0, 0, 0.40);
    height: 90vh;
    display: flex;
    align-items: center;
    text-align: center;
    background-size: cover;
    background-repeat:no-repeat;
    background-blend-mode: multiply;
    margin-top: -10vh;
    z-index: 100;
}

.book-btn{
    background-color: #967f35;
    padding: 12px 40px;
    color: white;
    border-radius: 0px;
    font-family: 'Poppins';
    font-weight: 600;
    font-size: 15px;
}

.book-btn:hover{
    background-color: #ccaf5e;
    color: white;
}


.owl-carousel-stats{
    margin-top: 60px;
    margin-left: 100px;background-color: white;
    padding: 15px 40px;
    width: 140%;
    padding-top: 25px;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
}


#rooms-home{
    background-color: #222222;
    
}

.room-card{
    border-radius: 0px;
    
}

#banner-home{
    background: url('../img/almare-banner.jpg')rgba(0, 0, 0, 0.45);
    background-attachment: center;
    height: 35vh;
    background-size: cover;
    background-repeat: no-repeat;
    background-blend-mode: multiply;
    display: flex;
    align-items: center;
    color: white;
}

 .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(255,255,255, 0.5)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
  }



  #room-head{
    height: 30vh;
    display: flex;
    align-items: center;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 60px -12px inset, rgba(0, 0, 0, 0.3) 0px 18px 36px -18px inset;
  }


@media only screen and (max-width: 687px) {
    .navbar {
      background-color: rgb(65, 52, 33)!important;
    }

    .owl-carousel-stats{
        width: 100%!important;
        margin-left: 0px!important;
    }
  }