html , body {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    overflow-x: hidden; 
    font-family: "Work Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    font-family: "Montserrat", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    background-color: #f2f2f3;
}

/* annimation */


.fadeinleft {
    opacity: 0;
    transform: translateX(100px);
    transition: all 1s ease-out;
}

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

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

.fadeinup {
    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,
.active-up {
    opacity: 1;
    transform: translateX(0);
    transform: translateY(0);
}

.fadein {
    opacity: 0;
}


/*  */
.btn-1 {
    padding: 10px 25px;
    background-color: white;
    color: #b99470;
    border: 1px solid #b99470;
    font-size: 18px;
    transition-duration: 0.4s;
}

.btn-1:hover {
    opacity: 0.7;
    
}

.btn-1 a {
    text-decoration: none;
    font-size: 15px;
}

.btn-2 {
    padding: 10px 25px;
    background-color: #b99470;
    color: white;
    border: 1px solid white;
    font-size: 18px;
    transition-duration: 0.4s;
}

.btn-2:hover {
    opacity: 0.7;
}

.btn-2 a {
    color: white;
    text-decoration: none;
    font-size: 15px;
}

/*=====INDEX=====*/

.dropdown-menu a:hover {
  background-color: #b99470;
}

/* about home */

.nav-item:hover {
    border-bottom: 2px solid white;
}


#about-home img {
    background: rgba(0, 0, 0, 0.35);
    background-repeat: no-repeat;
    background-size: cover;
    height: 80vh;
    background-blend-mode: multiply;
    align-items: center;
}

#rooms-about {
    background: url(img/473217860.jpg) rgba(0, 0, 0, 0.35);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 80vh;
    background-blend-mode: multiply;
    display: flex;
    align-items: center;
}

#bck-img-home {
    background: url(img/473217895.jpg) rgba(0, 0, 0, 0.35);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    height: 80vh;
    background-blend-mode: multiply;
    display: flex;
    align-items: center;
    padding: 40px 0;
}

/*=====HOME-ROOMS=====*/
#home-rooms h3 {
    font-size: 25px;
    color: black;
}

#home-rooms i {
    font-size: 20px;
    color: #b99470;
}

#home-rooms span {
    color: grey;
    font-size: 18px;
}

#home-rooms p {
    color: black;
    font-size: 18px;
}

/* about apartament */
.dsc-about h2 {
    color: black;
    font-size: 30px;
}

.dsc-about p {
    font-size: 19px;
    color: #82765b;
}

/* apartment */

.rooms-apartment h2 {
    font-size: 40px;
    color: #82765b;
}

.rooms-apartment p {
    font-size: 19px;
    color: #82765b;
}

/* testimonials */

.facilities-card  {
    line-height: 50px;
}

.facilities-card i {
    font-size: 40px;
    color: #b99470;
}

.facilities-card  p {
    font-size: 20px;
    margin-left: 20px;
}

#bck-img {
    background: url("/img/473217926.jpg") rgba(0, 0, 0, 0.35);
    background-size: cover;
    background-repeat: no-repeat;
    height: 50vh;
    background-blend-mode: multiply;
    background-position: center;
}

/*=====ABOUT=====*/

#about-about {
    background: url("/img/473217895.jpg") rgba(0, 0, 0, 0.35);
    background-size: cover;
    background-repeat: no-repeat;
    height: 80vh;
    background-blend-mode: multiply;
    background-position: center;
    display: flex;
    align-items: center;
}

#about-about  h1 {
    font-size: 45px;
    color: white;
}

#about-about h2 {
    font-size: 50px;
    color: #82765b;
}

.about-apartment {
    position: relative;
    top: -50px;
    background-color: #f5f5f5;
    color: #82765b;
    border: 2px solid #82765b;
    padding: 20px 0;
}

#offered .text-header {
    color: #82765b;
    font-size: 30px;
}

#offered .card-text {
    color: #82765b;
    font-size: 20px;
}

/*=====GALLERY=====*/
#about-gallery {
    background: url("/img/473217901.jpg") rgba(0, 0, 0, 0.35);
    background-size: cover;
    background-repeat: no-repeat;
    height: 80vh;
    background-blend-mode: multiply;
    background-position: center;
    display: flex;
    align-items: center;
}

/*=====CONTACT=====*/

#about-contact {
    background: url("/img/473217928.jpg") rgba(0, 0, 0, 0.35);
    background-size: cover;
    background-repeat: no-repeat;
    height: 80vh;
    background-position: center;
    background-blend-mode: multiply;
}

.contact-info h1 {
    font-size: 25px;
}

.contact-info i {
    color: #b99470;
    font-size: 22px;
    margin-right: 15px;
}

.contact-info a {
    font-size: 25px;
    color: grey;
}
.contact-info p {
    font-size: 22px;
    color: grey;
}

.contact-info h5 {
    font-size: 23px;
    color: grey;
}

/*=====NAVBAR=====*/
.nav-item:after {
    border-bottom: 3px solid #82765b;
    transition-duration: 1s ease;
}

/*=====FOOTER=====*/

.contact p {
    font-size: 17px;
}

.contact i {
    font-size: 20px;
    color: #82765b;
}

.contact  a {
    text-decoration: none;
    color: grey;
    font-size: 18px;
}

.copyright h3 {
    color: white;
    font-size: 23px;
}

.nav-footer {
    line-height: 50px;
}

.nav-footer ul li  {
    list-style: none;
}

.nav-footer ul li a {
    font-size: 18px;
    text-decoration: none;
    color: #82765b;
}

@media (max-width:767px) {
    .contact-info {
        padding-left: 30px;
    }

    .contact-info a {
        font-size: 20px;
    }

    .contact-info h5 {
        font-size: 19px;
    }
}