/* 
2.4 Content
    2.4.1 Map
    2.4.2 ROOMS
    2.4.3 GALLERY
    2.4.4 NEW
    2.4.5 EVENTS
    2.4.6 SCROLL TOP
    2.4.7 TESTIMONIALS
    2.4.8 BEST
    2.4.9 ABOUT 
    2.4.10 BODY-PAGE
    2.4.11 BANNER-TEMS
    2.4.12 BODY-ROOM 
    2.4.13 CHECK-OUT 
    2.4.14 RESTAURANTS
    2.4.15 CONTACT
    2.4.16 BLOG
    2.4.17 SIDEBAR
    2.4.18 WIDGETSEARCH
    2.4.19 POST
    2.4.20 NAVIGATION
    2.4.21 VIDEO
    2.4.22 COMMENT
    2.4.23 AttRACTIONS
    2.4.24 SECTION-TEAM
    2.4.25 RESERVATION
    2.4.26 DATEPICKER
    2.4.27 PRODUCT
    2.4.28 GUEST-BOOK */

/*   2.4.1 Map */

.section-map-v4 {
  margin-bottom: -10px;
  iframe {
    width: 100%;
    border: none;
  }
}

.section-map {
  height: 470px;
  position: relative;
  iframe {
    width: 100%;
    border: none;
  }
}

#map {
  height: 685px;
  width: 100%;
  @media (max-width: 1200px) {
    height: 500px;
  }
  @media (max-width: 992px) {
    height: 410px;
  }
  @media (max-width: 768px) {
    height: 320px;
  }
}

/*2.4.2 ROOMS*/

.rooms {
  text-align: center;
  padding-top: 60px;
  padding-bottom: 60px;
  background: #f2f2f2;
  &.rooms-v2 {
    .outline {
      margin-top: 22px;
      margin-bottom: 30px;
    }
    .wrap-rooms {
      .wrap-box {
        margin-left: 15px;
        margin-right: 15px;
        @media (max-width: $screen-xs) {
          margin-left: 0;
          margin-right: 0;
        }
        &:hover {
          .img-item {
            img {
              @include transition;
            }
          }
        }
        .box-img {
          overflow: hidden;
          display: block;
          .rooms-content {
            position: absolute;
            bottom: 12%;
            left: 50%;
            transform: translate(-50%, 70%);
            right: 50%;
            width: 100%;
            height: 100%;
            z-index: 99;
            @media (max-width: $screen-xs) {
              bottom: 0%;
            }
            @media (max-width: 768px) and(min-width: 600px) {
              transform: translate(-50%, 65%);
            }
            .sky-h4 {
              font-size: 25px;
    color: #fff;
    font-weight: 500;
    margin-bottom: 5px;
    line-height: 30px;
            }
            .price {
              font-weight: 500;
              font-size: 16px;
              color: #fff;
            }
          }
          .img-item {
            position: relative;
            overflow: hidden;
            img {
              @include transition;
            }
            &:before {
              bottom: 0;
              left: 0;
              right: 0;
              top: 50%;
              position: absolute;
              content: "";
              pointer-events: none;
              background-color: transparent;
              background: -webkit-gradient(
                linear,
                left top,
                left bottom,
                from(transparent),
                to(rgba(5, 5, 5, 0.6))
              );
              background: -webkit-linear-gradient(
                top,
                transparent,
                rgba(5, 5, 5, 0.6)
              );
              background: -moz-linear-gradient(
                top,
                transparent,
                rgba(5, 5, 5, 0.6)
              );
              background: -ms-linear-gradient(
                top,
                transparent,
                rgba(5, 5, 5, 0.6)
              );
              background: -o-linear-gradient(
                top,
                transparent,
                rgba(5, 5, 5, 0.6)
              );
              z-index: 9;
            }
          }
        }
        .content {
          padding: 22px 25px 28px;
          @media (max-width: 768px) and(min-width: 600px) {
            padding: 10px;
          }
          @media (max-width: 480px) {
            padding: 22px 5px 28px;
          }
          p {
            font-weight: 300;
            font-size: 16px;
          }
          .bottom-room {
            overflow: hidden;
            margin-top: 20px;
            ul {
              padding: 0;
              li {
                position: relative;
                font-size: 14px;
                width: calc(50% - 0%);
                vertical-align: middle;
                font-weight: 400;
                color: #959595;
                border-right: 1px solid #ececec;
                border-bottom: 1px solid #ececec;
                float: left;
                list-style: none;
                text-align: left;
                padding: 13px 0 15px 17px;
                @media (min-width: 992px) and(max-width: 1200px) {
                  padding-left: 35px;
                }
                @media (min-width: 768px) and(max-width: 991px) {
                  font-size: 12px;
                }
                img {
                  width: auto;
                  display: inline-block;
                  padding-right: 6px;
                  position: relative;
                  vertical-align: inherit;
                }
                &:nth-child(2),
                &:nth-child(4) {
                  border-right: none;
                }
                &:nth-child(3),
                &:nth-child(4) {
                  border-bottom: none;
                }
              }
            }
          }
        }
      }
    }
  }
  &.rooms-v3 {
    padding-top: 40px;
    @media (max-width: 991px) {
      padding-bottom: 30px;
    }
    .wrap-rooms .owl-dots {
      opacity: 0;
    }
    .outline {
      margin-top: 22px;
      margin-bottom: 30px;
    }
  }
  &.rooms-v4 {
    padding-bottom: 55px;
  }
  .title-room {
    color: #232323;
    @extend .sky-h2;
  }
  .outline {
    width: 100%;
    height: 25px;
    background: url("../img/icon-our.png") no-repeat center center;
    margin-top: 10px;
  }
  .wrap-rooms {
    margin-top: 25px;
    .item {
      margin-top: 20px;
    }
    .wrap-box {
      &.wrap-box-v4 {
        position: relative;
        overflow: hidden;
        display: block;
        transform: scale(1, 1);
        margin-left: 0px;
        margin-right: 0px;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        &:hover {
          .box-img {
            img {
              transform: none;
            }
          }
          .rooms-content {
            overflow: hidden;
            opacity: 0;
            transition: all 0.7s ease-in-out;
          }
          .content {
            opacity: 1;
            .wrap-content {
              margin-top: 0px;
              transition: all 0.8s ease-in-out;
              opacity: 1;
            }
          }
        }
        .rooms-content {
          position: absolute;
          bottom: 0;
          background: #fff;
          width: 100%;
          transition: all 0.7s ease-in-out;
          opacity: 1;
          @media (min-width: 992px) and(max-width: 1200px) {
            padding-bottom: 0;
            padding-top: 0;
            .sky-h4 {
              font-size: 21px;
            }
          }
          @media (min-width: 768px) and(max-width: 992px) {
            padding-bottom: 10;
            padding-top: 10;
          }
        }
        .content {
          bottom: 0%;
          position: absolute;
          left: 0;
          right: 0;
          background-color: rgba(20, 19, 19, 0.85);
          overflow: hidden;
          width: 100%;
          height: 100%;
          opacity: 0;
          -webkit-transition: all 0.7s ease-in-out;
          -moz-transition: all 0.7s ease-in-out;
          -ms-transition: all 0.7s ease-in-out;
          -o-transition: all 0.7s ease-in-out;
          transition: all 0.7s ease-in-out;
          .wrap-content {
            @include transition;
            margin-top: 60px;
            opacity: 0;
            @media (max-width: 480px) {
              top: 50%;
              position: absolute;
              transform: translate(0%, -50%);
            }
          }
          p {
            font-size: 14px;
            font-weight: 300;
            color: #fff;
          }
          .bottom-room {
            margin-top: -10px;
            padding: 23px 35px 25px 35px;
            ul {
              li {
                color: #c9c9c9;
                border-right: 1px solid #c9c9c9;
                border-bottom: 1px solid #c9c9c9;
                font-size: 11px;
                padding: 5px 0px 10px 13px;
              }
            }
          }
          .rooms-content1 {
            .sky-h4 {
              color: #fff;
              text-transform: uppercase;
              margin-bottom: 6px;
            }
            .price {
              color: #8e7037;
              font-size: 16px;
              font-weight: 500;
            }
          }
          .btn {
            font-size: 14px;
            color: #c9c9c9;
            font-weight: 400;
            height: 43px;
            width: 163px;
            line-height: 30px;
            background: transparent;
            border: 1px solid white;
            @media (max-width: 1200px) {
              height: 35px;
              width: 140px;
              line-height: 21px;
              margin-top: 0;
            }
            &:hover {
              background: $color-hover;
              border: 1px solid $color-hover;
              color: #fff;
            }
          }
        }
      }
      background: white;
      margin-bottom: 30px;
      @include transition-3;
      &:hover {
        -webkit-box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.15);
        box-shadow: 0px 0px 12px 3px rgba(0, 0, 0, 0.15);
        .rooms-content {
          .sky-h4 {
            color: $color-hover;
          }
        }
        .box-img {
          img {
            transform: scale(1.1);
            @include transition-3;
          }
        }
      }
      .rooms-content {
        padding-bottom: 25px;
        padding-top: 15px;
        text-transform: uppercase;
        cursor: pointer;
        .price {
          color: #8e7037;
          font-size: 16px;
          font-weight: 500;
          letter-spacing: 1px;
        }
      }
      .box-img {
        position: relative;
        overflow: hidden;
        img {
          @include transition-3;
        }
      }
    }
    .owl-nav {
      display: none;
    }
    .owl-dots {
      margin-top: 2px;
      display: block;
      .owl-dot {
        width: 8px;
        height: 8px;
        display: inline-block;
        border-radius: 100%;
        border: 2px solid #555555;
        margin: 0px 3px;
        &.active {
          background: #555555;
        }
      }
    }
    .owl-carousel {
      &.owl-grab {
        cursor: auto;
      }
    }
  }
  .rooms-p {
    color: #ababab;
    font-weight: 300;
    font-size: 16px;
    width: 48%;
    margin: 0 auto;
    margin-top: 15px;
  }
}

/*2.4.3 GALLERY */
.events {
  padding-top: 30px;
  padding-bottom: 50px;
}
.gallery-our {
  background: #f2f2f2 !important;
  text-align: center;
  background: url("../images/Home-1/bg-gallery.jpg");
  padding-top: 40px;
  padding-bottom: 40px;
  &.wrap-gallery-restaurant {
    background: none;
    padding-bottom: 50px;
    .gallery-restaurant {
      margin: auto;
      .gallery_product {
        padding: 0 15px;
        margin-bottom: 30px;
      }
      ul {
        margin-bottom: 35px;
        @media (max-width: $screen-xs-max) {
          margin-bottom: 25px;
          margin-top: 35px;
        }
        li {
          &.active > a {
            border: 1px solid transparent;
            color: #fff;
            background: #8e7037;
            &:hover,
            &:focus {
              color: #fff;
              background-color: #8e7037;
              border: 1px solid transparent;
              cursor: pointer;
            }
          }
          a {
            font-weight: 600;
            color: $color-black;
            margin: 0px 5px;
            font-size: 16px;
            padding: 6px 18px;
            border: 1px solid transparent;
            @media (max-width: $screen-xs-max) {
              margin: 0;
              font-size: 14px;
            }
            @media (max-width: $screen-xs) {
              padding: 6px 10px;
            }
            &:hover,
            &:focus {
              background: $color-hover;
              outline: none;
              color: #fff;
              border: 1px solid transparent;
            }
          }
        }
      }
    }
  }
  .gallery {
    margin: 0 160px;
    .title-gallery {
      @extend .sky-h2;
      color: #fff;
    }
    .h2-rooms {
      color: #000;
      font-size: 36px;
    }
    .nav-tabs {
      display: inline-block;
      border: none;
      margin-bottom: 30px;
      margin-top: 25px;
      li {
        &.active > a {
          border: 1px solid #8e7037;
          color: #8e7037;
          background: transparent;
          &:hover,
          &:focus {
            color: #8e7037;
            background-color: 0;
            border: 1px solid #8e7037;
            cursor: pointer;
          }
        }
        a {
          margin: 0px 8px;
          color: #ababab;
          font-size: 16px;
          font-family: "Poppins", sans-serif;
          font-weight: 500;
          -webkit-border-radius: 0px;
          border-radius: 0px;
          padding: 6px 13px;
          &:hover,
          &:focus {
            background: 0;
            outline: none;
            color: #8e7037;
            border: 1px solid transparent;
          }
        }
      }
    }
    .outline {
      width: 100%;
      height: 25px;
      background: url("../images/Home-1/icon-our.png") no-repeat center center;
      margin-top: 20px;
    }
    .gallery-title {
      font-size: 48px;
      color: #232323;
      text-align: center;
      font-weight: 400;
      font-family: "Playfair Display", serif;
      position: relative;
    }
    .gallery_product {
      padding: 0;
      .wrap-box {
        .box-img {
          width: 100%;
          height: 100%;
        }
        position: relative;
        display: block;
        overflow: hidden;
        text-align: center;
        cursor: pointer;
        transition: all 4s ease-in-out;
        &:hover .gallery-box-main {
          overflow: visible;
          opacity: 1;
          transform: translate(-50%, -50%);
        }
        & img {
          transition: all 0.3s ease-in-out;
          width: 101%;
          max-width: 101%;
          height: 100%;
          display: block;
        }
        &:hover img {
          transform: scale(1.2);
          opacity: 0.8;
        }
        .gallery-box-main {
          position: absolute;
          top: 50%;
          left: 50%;
          overflow: hidden;
          opacity: 0;
          transition: all 0.4s ease-in-out;
          transform: translate(-340%, -49%);
          .gallery-icon {
            transition: all 0.3s ease-in-out;
            .ion-ios-plus-empty {
              font-size: 40px;
              width: 60px;
              height: 60px;
              background: #ffffff;
              display: inline-block;
              border-radius: 100%;
              line-height: 60px;
              color: #8e7037;
              border: 1px solid #ffffff;
              &:hover {
                background: transparent;
                color: #fff;
                border: 1px solid #ffffff;
              }
            }
          }
          .gallery-content {
            .gallery-box-h4 {
              font-family: "Poppins", sans-serif;
              font-size: 18px;
              color: #fff;
              font-weight: 400;
              text-transform: uppercase;
              letter-spacing: 1px;
            }
            .gallery-box-p {
              color: #e09300;
              font-family: "Playfair Display", serif;
              font-style: italic;
              font-size: 15px;
              margin-top: -8px;
            }
          }
        }
      }
    }
    .btn-our {
      margin-top: 60px;
      width: 200px;
      height: 44px;
      -webkit-border-radius: 0px;
      border-radius: 0px;
      color: #ffffff;
      font-family: "Poppins", sans-serif;
      font-weight: 500;
      font-size: 14px;
      line-height: 30px;
      border: 2px solid #ffffff;
      letter-spacing: 2px;
      outline: none;
      background: transparent;
      &:hover {
        color: #ffffff;
        text-shadow: none;
        background: #8e7037;
        border: 1px solid #8e7037;
      }
      &:focus {
        color: #fff;
        background: #8e7037;
        outline: none;
        border: 1px solid #8e7037;
      }
    }
  }
  &.gallery_1 {
    padding-top: 25px;
    padding-bottom: 50px;
    @media (max-width: $screen-xs-max) {
      padding-bottom: 20px;
      padding-top: 0;
    }
    .wrap-box-1 {
      position: relative;
      overflow: hidden;
      display: block;
      &:hover {
        .box-img {
          img {
            transform: scale(1.1);
            @include transition-3;
          }
          p {
            overflow: visible;
            opacity: 1;
            @include transition-3;
            bottom: 0;
          }
          &:before {
            opacity: 1;
            overflow: visible;
            @include transition;
          }
        }
      }
      .box-img {
        p {
          position: absolute;
          bottom: -30%;
          padding: 0px 25px 6px 25px;
          text-align: left;
          color: #fff;
          font-size: 18px;
          line-height: 23px;
          opacity: 0;
          overflow: hidden;
          @include transition-3;
          max-width: 260px;
        }
        img {
          width: 100%;
          @include transition-3;
        }
        &:before {
          bottom: 0;
          left: 0;
          right: 0;
          top: 35%;
          position: absolute;
          content: "";
          pointer-events: none;
          background-color: transparent;
          background: -webkit-gradient(
            linear,
            left top,
            left bottom,
            from(transparent),
            to(rgba(5, 5, 5, 0.6))
          );
          background: -webkit-linear-gradient(
            top,
            transparent,
            rgba(5, 5, 5, 0.6)
          );
          background: -moz-linear-gradient(
            top,
            transparent,
            rgba(5, 5, 5, 0.6)
          );
          background: -ms-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
          background: -o-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
          opacity: 0;
          overflow: hidden;
          @include transition;
        }
      }
    }
  }
  &.gallery_2 {
    @media screen and (max-width: 768px) {
      padding-top: 0px;
      padding-bottom: 50px;
      .gallery-cat {
        .list-inline {
          li {
            line-height: 35px;
            padding: 0;
          }
          margin-bottom: 20px;
        }
      }
    }
    padding-top: 55px;
    padding-bottom: 75px;
    .gallery-content {
      margin-top: -13px;
    }
  }
}

.gallery-isotope {
  @media screen and (max-width: 1200px) {
    &.col-3 {
      .item-isotope,
      .item-size {
        width: 33.33333% !important;
      }
    }
    &.col-4 {
      .item-isotope,
      .item-size,
      .width-33 {
        width: 33.33333% !important;
      }
    }
  }
  @media screen and (max-width: 768px) {
    /* GALLERY */
    &.col-3 {
      .item-isotope,
      .item-size {
        width: 50% !important;
      }
    }
    &.col-4 {
      .item-isotope,
      .item-size,
      .width-33 {
        width: 50% !important;
      }
    }
  }
  @media screen and (max-width: 480px) {
    /* GALLERY */
    &.col-3 {
      .item-isotope,
      .item-size {
        width: 100% !important;
      }
    }
    &.col-4 {
      .item-isotope,
      .item-size,
      .width-33 {
        width: 100% !important;
      }
    }
  }
  .item-isotope {
    float: left;
    margin-top: 30px;
    padding-left: 15px;
    padding-right: 15px;
  }
  &.col-3 {
    .item-isotope,
    .item-size {
      width: 25%;
    }
  }
  &.col-4 {
    .item-isotope,
    .item-size {
      width: 25%;
    }
    .width-50 {
      width: 50%;
    }
    .width-25 {
      width: 25%;
    }
    .item-isotope {
      margin-top: 30px;
    }
  }
}

/* 2.4.4 NEW */

.news {
  &.news-v3 {
    padding-bottom: 75px;
  }
  &.news-v4 {
    padding-bottom: 100px;
  }
  .line {
    width: 170px;
    height: 1px;
    background: #8e7037;
    margin-top: 20px;
    margin-bottom: -9px;
  }
  .line-v2 {
    width: 170px;
    height: 2px;
    background: #8e7037;
    margin-top: 20px;
    margin-bottom: -10px;
    margin-left: 0;
  }
  .new-title {
    @extend .sky-h2;
    color: #232323;
    position: relative;
  }
  padding-top: 70px;
  padding-bottom: 95px;
  .title-news {
    font-size: 45.71px;
    color: #232323;
    font-family: "Playfair Display", serif;
  }
  .line-news {
    width: 170px;
    height: 1px;
    background: #8e7037;
  }
  .substance {
    margin-top: 50px;
    border-left: 1px solid #ebebeb;
    padding-left: 25px;
    .date {
      .day {
        font-size: 45px;
        font-family: "Playfair", serif;
        color: #898989;
        display: inline-block;
        padding-right: 7px;
        font-weight: 400;
      }
      .year {
        color: #898989;
        font-size: 14px;
        display: inline-block;
        margin-left: 5px;
        line-height: 20px;
        border-left: 1px solid #ebebeb;
        padding-left: 16px;
        letter-spacing: 1px;
        font-weight: 500;
      }
    }
    .text {
      margin-top: 8px;
      margin-bottom: 22px;
      a {
        color: #232323;
        font-size: 26px;
        font-weight: 400;
        &:hover {
          text-decoration: none;
          color: $color-hover;
        }
      }
    }
    .read-more {
      font-size: 13px;
      color: #8e7037;
      font-weight: 300;
      &:hover {
        text-decoration: none;
        color: $color-hover;
      }
    }
  }
}

/* 2.4.5 EVENTS */

.events {
  &.events-v3 {
    margin-top: 60px;
    @media (max-width: 767px) {
      margin-top: 25px;
    }
  }
  &.events-v4 {
    margin-bottom: -30px;
    .events-item {
      margin-bottom: 30px;
      position: relative;
      .v4 {
        font-size: 48px;
      }
      img {
        z-index: -1;
      }
      &:before {
        bottom: 0;
        left: 0;
        right: 0;
        top: 50%;
        position: absolute;
        content: "";
        pointer-events: none;
        background-color: transparent;
        background: -webkit-gradient(
          linear,
          left top,
          left bottom,
          from(transparent),
          to(rgba(5, 5, 5, 0.6))
        );
        background: -webkit-linear-gradient(
          top,
          transparent,
          rgba(5, 5, 5, 0.6)
        );
        background: -moz-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
        background: -ms-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
        background: -o-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
        z-index: 1;
      }
      .content-v4 {
        bottom: -58%;
        text-align: left;
        left: 8%;
      }
    }
  }
  .line-v2 {
    margin: auto;
    width: 300px;
    height: 2px;
    background: #8e7037;
    margin-top: 22px;
    margin-bottom: 45px;
  }
  margin-top: 33px;
  .owl-carousel {
    margin-top: 40px;
    .owl-nav {
      display: flex;
      position: absolute;
      right: 15px;
      top: -105px;
      .owl-prev {
        &:hover:before {
          background: url("../images/Home-1/even-l-icon-color.png") no-repeat;
        }
        font-size: 0;
        &:before {
          content: "";
          background: url("../images/Home-1/even-l-icon.png") no-repeat;
          position: absolute;
          width: 17px;
          height: 30px;
          margin-left: -40px;
        }
      }
      .owl-next {
        font-size: 0;
        &:before {
          content: "";
          background: url("../images/Home-1/even-r-icon.png") no-repeat;
          position: absolute;
          width: 17px;
          height: 30px;
        }
        &:hover:before {
          background: url("../images/Home-1/even-l-icon-color1.png") no-repeat;
        }
      }
    }
  }
  .line {
    width: 300px;
    height: 1px;
    background: #8e7037;
    margin-top: 22px;
    margin-bottom: 45px;
  }
  .events-title {
    color: #232323;
    @extend .sky-h2;
  }
  .events-item {
    &:before {
      background: -webkit-gradient(
        linear,
        left top,
        left bottom,
        from(transparent),
        to(rgba(5, 5, 5, 0.6))
      );
      background: -webkit-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
      background: -moz-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
      background: -ms-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
      background: -o-linear-gradient(top, transparent, rgba(5, 5, 5, 0.6));
      bottom: 0;
      left: 0;
      right: 0;
      top: 50%;
      position: absolute;
      content: "";
      pointer-events: none;
      z-index: 1;
    }
    position: relative;
    text-align: center;
    overflow: hidden;
    display: block;
    cursor: pointer;
    img {
      @include transition-3;
    }
    &:hover {
      img {
        transform: scale(1.2);
        @include transition-3;
      }
    }
    .events-content {
      position: absolute;
      bottom: -73%;
      width: 100%;
      height: 100%;
      z-index: 1;
      a {
        &:hover {
          text-decoration: none;
        }
      }
      .sky-h3 {
        @media (max-width: 1199px) {
          font-size: 27px;
        }
      }
    }
  }
}

.section-event-restaurant {
  padding-top: 73px;
  padding-bottom: 73px;
  background: url("../images/Restaurants/Restaurants-60.jpg") no-repeat center
    center;
  background-size: cover;
  .event-restaurant {
    .event-restaurant_header {
      color: #fff;
      margin-top: 50px;
      padding-right: 20px;
      .icon {
        font-size: 50px;
      }
      h2 {
        text-transform: uppercase;
        font-size: 36px;
        color: #fff;
        font-weight: bold;
        line-height: 1;
        margin-top: 10px;
        margin-bottom: -4px;
      }
      p {
        margin-bottom: 0;
        font-size: 16px;
        margin-top: 20px;
      }
    }
    .event-restaurant_content {
      list-style: none;
      padding-left: 0;
      margin-bottom: 0;
      li {
        overflow: hidden;
        margin-top: 45px;
        &:first-child {
          margin-top: 0;
        }
        .event-date {
          width: 70px;
          padding: 5px 0;
          margin-right: 30px;
          float: left;
          border: 2px solid #fff;
          display: block;
          text-align: center;
          color: #fff;
          font-size: 16px;
          text-transform: uppercase;
          line-height: 1;
          strong {
            display: block;
            font-weight: 600;
            font-size: 34px;
            margin-bottom: 5px;
          }
        }
        .text {
          overflow: hidden;
          h2 {
            color: #fff;
            font-size: 18px;
            text-transform: uppercase;
            font-weight: 600;
            line-height: 1.4em;
            margin-top: -3px;
            margin-bottom: 0px;
          }
          a {
            color: #fff;
            display: inline-block;
            margin-top: 5px;
            font-size: 13px;
            &:hover {
              color: $color-hover;
              text-decoration: none;
            }
          }
        }
      }
    }
  }
}

/* 2.4.6 SCROLL TOP*/

.scrollToTop {
  width: 42px;
  height: 42px;
  position: fixed;
  bottom: 5%;
  left: 2%;
  display: none;
  font-size: 40px;
  background: #f27235;
  color: #ebebeb;
  border-radius: 3px;
  text-align: center;
  line-height: 42px;
  z-index: 999;
  &:hover {
    color: #fff;
  }
  &:focus {
    color: #fff;
  }
}

/*2.4.7 TESTIMONIALS*/

.testimonials {
  background: url("../images/testimonial/Testimonials.jpg");
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  text-align: center;
  position: relative;
  width: 100%;
  &.testimonials-v2 {
    background: url("../images/Home-2/Testimonials-bg.jpg");
    background-size: cover;
    background-position: center center;
    background-attachment: fixed;
    position: relative;
    text-align: left;
    width: 100%;
    color: white;
    .testimonials-h {
      .owl-dots {
        text-align: center;
      }
      .testimonials-img {
        margin-right: 10px;
        float: right;
        border-radius: 100%;
        overflow: hidden;
        img {
          -webkit-border-radius: 50%;
          border-radius: 50%;
        }
      }
      .content-testimonials {
        padding-right: 5%;
        .line {
          border-left: 2px solid #88949e;
          color: white;
          padding-left: 15px;
          background: 0;
          margin-left: 15px;
        }
        .testimonials-pp {
          position: relative;
          margin-top: 23px;
          margin-bottom: 12%;
          &:before {
            content: "​‌“​‌";
            font-size: 40px;
            font-family: "Montserrat", sans-serif;
            vertical-align: middle;
            margin-right: 5px;
            line-height: 0;
            padding-top: 10px;
            position: relative;
          }
          &:after {
            content: "”";
            font-size: 40px;
            font-family: "Montserrat", sans-serif;
            line-height: 0px;
            vertical-align: middle;
            margin-left: 5px;
            padding-top: 10px;
            position: relative;
            top: 2px;
          }
        }
      }
      .testimonials-content {
        top: 35%;
      }
    }
  }
  .testimonials-h {
    min-height: 480px;
    position: relative;
    background: rgba(0, 0, 0, 0.75);
    &.testimonials-v3 {
      background: rgba(6, 6, 14, 0.87);
      opacity: 1;
    }
    .testimonials-content {
      position: absolute;
      top: 14%;
      width: 100%;
      .img-testimonials {
        display: inline-block;
        min-width: 115px;
        min-height: 115px;
        margin-bottom: 30px;
        border-radius: 100%;
        img {
          max-width: 100%;
          text-align: center;
          border-radius: 100%;
        }
      }
      .owl-nav {
        display: none;
      }
      .owl-dot {
        width: 8px;
        height: 8px;
        display: inline-block;
        border-radius: 100%;
        border: 2px solid white;
        margin: 0px 3px;
        &.active {
          background: white;
        }
      }
      .owl-carousel {
        cursor: col-resize;
        &.owl-grab {
          cursor: auto;
        }
      }
      .testimonials-p {
        font-weight: 300;
        font-size: 16px;
        color: #fff;
        padding: 0px 8%;
        margin-bottom: 26px;
        span {
          font-family: "Montserrat", sans-serif;
          font-size: 40px;
          line-height: 0;
          position: relative;
          top: 12px;
        }
      }
      .testimonials-p1 {
        font-weight: 400;
        font-size: 14px;
        color: #fff;
        margin-top: -4px;
        margin-bottom: 42px;
      }
    }
  }
}

/* 2.4.8 BEST */

.best {
  /*margin-top:100px;*/
  margin-bottom: 60px;
  text-align: center;
  .wrap-best {
    -webkit-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0 3px 20px rgba(0, 0, 0, 0.05);
    box-shadow: 0 3px 20px rgba(0, 0, 0, 0.05);
    margin-bottom: 30px;
    padding: 25px 0px;
    text-transform: uppercase;
    img {
      margin: 0 auto;
    }
  }
}

/* 2.4.9 ABOUT  */
.about {
  margin-top: 60px;
  margin-bottom: 220px;
}
.about {
  &.about-v2 {
    text-align: center;
    margin-bottom: 210px;
    .line-v2 {
      width: 100px;
    }
    .about-img-v3 {
      overflow: hidden;
      img {
        @include transition;
      }
      &:hover {
        img {
          transform: scale(1.1, 1.1);
          @include transition;
        }
      }
    }
    .about-img {
      float: none;
      left: -55px;
      position: relative;
      .img-1 {
        img {
          box-shadow: 0px 0px 8px #f0f0f0;
        }
        .img-2 {
          position: absolute;
          top: 16%;
          right: -11%;
          box-shadow: none;
          left: initial;
        }
      }
    }
    .about-p,
    .about-p1 {
      font-size: 16px;
    }
  }
  &.about-v3 {
    margin-bottom: 60px;
  }
  &.about-v4 {
    margin-bottom: 6rem;
    img {
      width: 100%;
    }
    .img-v4 {
      margin-top: 50px;
      @media (max-width: 767px) {
        display: none;
      }
    }
  }
  .line {
    width: 250px;
    height: 1px;
    background: #8e7037;
    margin-top: 20px;
    margin-bottom: 45px;
  }

  .about-title {
    @extend .sky-h2;
    color: #232323;
    position: relative;
    margin-top: 0;
  }
  .about-p {
    color: #333;
    font-size: 16px;
    font-weight: 300;
    margin-top: 0px;
    padding-right: 50px;
  }
  .about-p1 {
    color: #333;
    font-size: 16px;
    font-weight: 300;
    margin-top: 30px;
    margin-bottom: 55px;
    padding-right: 70px;
  }
  .read-more {
    color: #232323;
    font-size: 12px;
    font-weight: 600;
    border: 2px solid #232323;
    padding: 9px 27px;
    &:hover {
      text-decoration: none;
      background: #8e7037;
      border: 2px solid #8e7037;
      color: #fff;
    }
  }
  .about-img {
    float: right;
    .img-1 {
      position: relative;
      .img-2 {
        position: absolute;
        top: 50%;
        left: -15%;
        box-shadow: -4px 4px 20px 0px #f0f0f0;
      }
      .img-3 {
        position: absolute;
        top: 84%;
        left: 27%;
        box-shadow: 0px 5px 20px 0px #f0f0f0;
      }
    }
  }
}

.section-about {
  /*  background-color: #fff; */
  padding-bottom: 70px;
  padding-top: 45px;
  @media (max-width: 767px) {
    padding-top: 20px;
    padding-bottom: 35px;
  }
  .wrap-about {
    margin-top: -40px;
    .about-item {
      margin-top: 45px;
    }
  }
}

.about-item {
  overflow: hidden;
  &.about-right {
    .img {
      float: right;
      width: 100%;
    }
    .text {
      float: right;
      padding-left: 0;
      padding-right: 100px;
      margin-top: 55px;
    }
  }
  .img {
    img {
      width: 100%;
    }
    .owl-pagination {
      display: none;
    }
  }
  .text {
    padding-left: 40px;
    margin-top: 35px;
    padding-right: 52px;
    h2 {
      line-height: 1.2em;
      font-size: 36px;
      color: $color-gray;
    }
    .desc {
      margin-top: 20px;
      color: #333333;
      font-size: 15px;
      @media (max-width: 767px) {
        font-size: 14px;
      }
      p {
        line-height: 1.5em;
        margin: 0;
      }
    }
  }
  &:hover {
    .img:before {
      opacity: 0.9;
    }
  }
}

/* 2.4.10 BODY-PAGE*/

.body-page {
  background: url("../images/404page/404page.jpg") no-repeat center center;
  width: 100%;
  text-align: center;
  background-size: cover;
  position: relative;
  &.page-v1 {
    background: url("../images/Login/login.jpg") no-repeat center center;
    background-size: cover;
    .content {
      max-width: 450px;
      width: 100%;
      padding-top: 290px;
      @media (max-width: 480px) {
        padding-top: 120px;
        padding-bottom: 15px;
      }
      .sky-h3 {
        font-family: "Poppins", Arial, sans-serif;
      }
      .p-v1 {
        font-size: 18px;
        font-weight: 400;
        font-family: "Poppins", Arial, sans-serif;
        margin-top: 17px;
        margin-bottom: 48px;
        color: #fff;
        line-height: 23px;
      }
      .form-control {
        width: 430px;
        height: 43px;
        background: transparent;
        border: 2px solid white;
        -webkit-border-radius: 0px;
        border-radius: 0px;
        color: #fff;
        padding-left: 17px;
        padding-right: 17px;
        margin: 0 auto;
        &::placeholder {
          color: white;
          font-size: 14px;
          font-weight: 400;
          font-family: "Poppins", Arial, sans-serif;
        }
      }
      .btn {
        margin-bottom: 28px;
        margin-top: 15px;
        width: 200px;
        height: 42px;
        background: transparent;
        border: 2px solid white;
        -webkit-border-radius: 0px;
        border-radius: 0px;
        color: white;
        font-size: 16px;
        font-weight: 600;
        &:hover {
          background: #8e7037;
          border: 1px solid #8e7037;
        }
      }
      p {
        font-size: 14px;
        color: #fff;
      }
      .field-icon {
        top: 14px;
        position: absolute;
        z-index: 2;
        color: white;
        cursor: pointer;
        right: 4%;
      }
    }
  }
  &.page-v2 {
    .content {
      max-width: 560px;
    }
    .btn {
      margin-top: 7px !important;
    }
  }
  &.page-v3 {
    background: url("../images/404page/Comming.jpg") no-repeat center center;
    .content {
      width: 100%;
      max-width: 100%;
      padding-top: 325px;
      padding-bottom: 280px;
      background-size: cover;
      @media (max-width: 768px) {
        padding-top: 40%;
        padding-bottom: 20%;
      }
      .h1-v3 {
        font-size: 72px;
        font-family: "Poppins", Arial, sans-serif;
        font-weight: 700;
        word-spacing: 5px;
        color: #fff;
        margin-bottom: 20px;
      }
      .h3-v3 {
        font-size: 34px;
        font-weight: 400;
        font-family: "Poppins", Arial, sans-serif;
        margin-bottom: 35px;
        margin-top: -10px;
        color: #fff;
      }
      .p-v3 {
        font-size: 20px;
        color: #fff;
      }
      .pp-v3 {
        color: #c4c4c4;
        font-size: 20px;
      }
      .wrap {
        margin: 27px 0;
        #timer {
          border: 2px solid #fff;
          display: inline-block;
          .padding {
            padding-right: 105px;
            &:last-child {
              padding: 0px;
              padding-right: 15px !important;
            }
          }
          padding: 0;
          #days {
            font-size: 50px;
            color: #fff;
            font-weight: 600;
          }
          #hours {
            font-size: 50px;
            color: #fff;
            font-weight: 600;
            position: relative;
            &:before {
              left: -25%;
              top: 53%;
              width: 4px;
              height: 4px;
              content: "";
              position: absolute;
              background: #fff;
            }
            &:after {
              width: 4px;
              height: 4px;
              content: "";
              position: absolute;
              background: #fff;
              top: 45%;
              left: -25%;
            }
          }
          #minutes {
            font-size: 50px;
            color: #fff;
            font-weight: 600;
            position: relative;
            &:before {
              left: -21%;
              top: 53%;
              width: 4px;
              height: 4px;
              content: "";
              position: absolute;
              background: #fff;
            }
            &:after {
              width: 4px;
              height: 4px;
              content: "";
              position: absolute;
              background: #fff;
              top: 45%;
              left: -21%;
            }
          }
          #seconds {
            font-size: 50px;
            color: #fff;
            font-weight: 600;
            position: relative;
            &:before {
              left: -50%;
              top: 56%;
              width: 4px;
              height: 4px;
              content: "";
              position: absolute;
              background: #fff;
            }
            &:after {
              width: 4px;
              height: 4px;
              content: "";
              position: absolute;
              background: #fff;
              top: 43%;
              left: -50%;
            }
          }
          div {
            display: inline-block;
            line-height: 1;
            padding: 23px;
            font-size: 40px;
          }
          span {
            display: block;
            font-size: 20px;
            color: white;
            font-weight: 400;
            font-family: "Poppins", Arial, sans-serif;
            text-transform: uppercase;
            margin-top: 10px;
          }
        }
      }
      .v3-icon {
        a {
          display: inline-block;
          border: 2px solid #c4c4c4;
          color: #c4c4c4;
          font-size: 16px;
          height: 30px;
          width: 30px;
          line-height: 26px;
          text-align: center;
          margin: 3px 7px 0 7px;
          -webkit-border-radius: 100%;
          -moz-border-radius: 100%;
          border-radius: 100%;
          -webkit-transition: all 0.3s ease;
          -moz-transition: all 0.3s ease;
          -ms-transition: all 0.3s ease;
          -o-transition: all 0.3s ease;
          &:hover {
            border: 2px solid #fff;
            color: #fff;
          }
        }
      }
    }
  }
  .content {
    padding-top: 287px;
    padding-bottom: 340px;
    max-width: 580px;
    margin: 0 auto;
    @media (max-width: 480px) {
      padding-top: 110px;
      padding-bottom: 60px;
    }
    .form-group {
      position: relative;
      width: auto;
      display: inline-block;
      @media (max-width: 480px) {
        display: block;
      }
    }
    .no-padding {
      padding: 0;
    }
    .page404 {
      font-size: 178px;
      font-weight: 300;
      letter-spacing: 6px;
      color: #fff;
    }
    .h3-404 {
      font-size: 27px;
      font-weight: 400;
      margin-top: -30px;
      margin-bottom: 37px;
      color: #fff;
    }
    .p-404 {
      color: #cccccc;
      font-size: 18px;
      &.size {
        font-size: 16px;
      }
      a {
        color: #fff;
        font-weight: 600;
      }
      a:hover {
        text-decoration: none;
        color: $color-hover;
      }
    }
    .navbar-form {
      margin-top: 43px;
      margin-bottom: 20px;
      border: none;
      -webkit-box-shadow: none;
      box-shadow: none;
      @media (max-width: 480px) {
        margin-top: 15px;
      }
      .form-control {
        width: 372px;
        height: 42px;
        padding-left: 20px;
        border-radius: 0px;
        background: transparent;
        border: 2px solid white;
        color: #fff;
        &::placeholder {
          color: white;
          font-size: 14px;
          font-weight: 400;
          font-family: "Poppins", Arial, sans-serif;
        }
      }
      .btn {
        width: 124px;
        height: 42px;
        -webkit-border-radius: 0px;
        border-radius: 0px;
        background: transparent;
        border: 2px solid white;
        color: #fff;
        font-weight: 600;
        letter-spacing: 1px;
        margin-left: 10px;
        box-shadow: none;
        @media (max-width: 480px) {
          margin-left: 0 !important;
          margin-top: 10px;
        }
        &:hover {
          background: #8e7037;
          border: 1px solid #8e7037;
        }
      }
    }
  }
}

/*2.4.11 BANNER-TEMS*/

.banner-tems {
  padding-top: 160px;
  padding-bottom: 40px;
  background: url("../images/Reservation/header.jpg") no-repeat;
  background-size: cover;
  background-position: center;
  &.bg-restaurants {
    background: url("../images/Restaurants/Restaurants.jpg") no-repeat;
    background-size: cover;
    background-position: center;
  }
  .banner-content {
    h2 {
      font-size: 36px;
      font-weight: 700;
      color: white;
      text-transform: uppercase;
      font-family: "Poppins", sans-serif;
      letter-spacing: 2px;
    }
    p {
      font-size: 16px;
      color: white;
      font-weight: 300;
    }
  }
}

/* 2.4.12 BODY-TEMS*/

.body-tems {
  padding-bottom: 69px;
  margin-top: 78px;
  @media (max-width: 767px) {
    padding-bottom: 40px;
    margin-top: 55px;
  }
  .wrap-content {
    color: #333;
    margin-top: -72px;
    .title-h3 {
      font-size: 24px;
      font-weight: 700;
      text-transform: uppercase;
      margin-top: 38px;
      margin-bottom: 23px;
      @media (max-width: 767px) {
        font-size: 20px;
      }
    }
    .p-tems {
      font-size: 15px;
      margin: 0;
      @media (max-width: 767px) {
        font-size: 14px;
      }
    }
    ul {
      font-size: 15px;
      margin-top: 15px;
      padding-left: 15px;
      li {
        padding-left: 18px;
      }
    }
    h6 {
      font-size: 16px;
      font-weight: 700;
      margin-top: 25px;
      margin-bottom: 15px;
    }
  }
}

/*2.4.13 BODY-ROOM */

.body-room-1 {
  padding-bottom: 85px;
  @media (max-width: 767px) {
    padding-bottom: 40px;
  }
  .room-wrap-1 {
    .room-item-1 {
      position: relative;
      margin-top: 45px;
      @media (max-width: 767px) {
        margin-top: 27px;
      }
      h2 {
        text-transform: uppercase;
        font-size: 26px;
        font-weight: bold;
        @media (max-width: $screen-xs-max) {
          font-size: 20px;
        }
        a {
          color: #333;
          &:hover {
            color: #8e7037;
            text-decoration: none;
          }
        }
      }
      .img {
        position: relative;
        margin-top: 25px;
        overflow: hidden;
        img {
          width: 100%;
          @include transition-3;
        }
      }
      .content {
        color: #333;
        font-weight: 400;
        font-size: 14px;
        margin-top: 15px;
        p {
          margin-bottom: 0;
          font-weight: 400;
          line-height: 1.5em;
          font-size: 14px;
        }
        ul {
          font-size: 0;
          padding-left: 0;
          margin-bottom: 0;
          margin-top: 15px;
          li {
            position: relative;
            padding-left: 20px;
            font-size: 14px;
            width: calc(50% - 14%);
            display: inline-block;
            vertical-align: top;
            margin: 3px 0;
            font-weight: 400;
            color: #232323;
            &:before {
              width: 5px;
              height: 5px;
              background-color: #232323;
              content: "";
              position: absolute;
              top: 8px;
              left: 0;
              -webkit-border-radius: 100%;
              border-radius: 100%;
            }
          }
        }
      }
      .bottom {
        border-top: 1px solid #e4e4e4;
        border-bottom: 1px solid #e4e4e4;
        overflow: hidden;
        padding: 10px 0;
        margin-top: 20px;
        .price {
          display: inline-block;
          color: #898989;
          font-size: 14px;
          line-height: 1;
          .amout {
            color: #333333;
            font-weight: bold;
            font-size: 26px;
            margin-left: 5px;
          }
        }
        .btn {
          float: right;
          color: #fff;
          font-size: 12px;
          width: 127px;
          height: 38px;
          background: #8e7037;
          line-height: 25px;
          border-radius: 0px;
          font-weight: 600;
          &:hover {
            border: 2px solid #8e7037;
            background: transparent;
            color: #8e7037;
          }
        }
      }
      &:hover {
        .img {
          img {
            transform: scale(1.1);
            @include transition-3;
          }
        }
      }
    }
  }
}

.body-room-2 {
  padding: 50px 0px;
  @media (max-width: 767px) {
    padding: 30px 0px;
  }
  .wrap-room2 {
    .img,
    .img1 {
      &:after {
        bottom: 0;
        left: 0;
        right: 0;
        top: 50%;
        position: absolute;
        content: "";
        opacity: 0;
        pointer-events: none;
        background-color: transparent;
        background: -webkit-gradient(
          linear,
          left top,
          left bottom,
          from(transparent),
          to(#1e1818)
        );
        background: -webkit-linear-gradient(top, transparent, #1e1818);
        background: -moz-linear-gradient(top, transparent, #1e1818);
        background: -ms-linear-gradient(top, transparent, #1e1818);
        background: -o-linear-gradient(top, transparent, #1e1818);
        @include transition-3;
        overflow: hidden;
      }
    }
    &:hover {
      .img,
      .img1 {
        &:after {
          opacity: 0.7;
          @include transition-3;
          overflow: visible;
        }
      }
    }
    margin-bottom: 100px;
    &:last-child {
      margin-bottom: 0;
    }
    .img {
      position: relative;
      &:before {
        content: "";
        display: block;
        position: absolute;
        width: 40px;
        top: 37px;
        bottom: 43px;
        right: 0px;
        background-color: #fff;
        z-index: 2;
        @include transition-3;
      }
      img {
        width: 100%;
      }
    }
    .img1 {
      position: relative;
      &:before {
        content: "";
        display: block;
        position: absolute;
        width: 40px;
        top: 37px;
        bottom: 43px;
        background-color: #fff;
        z-index: 2;
        @include transition-3;
      }
      img {
        width: 100%;
      }
    }
    .text {
      padding-top: 36px;
      h2 {
        font-size: 36px;
        &:hover {
          color: $color-hover;
        }
      }
      h5 {
        margin-bottom: 35px;
        margin-top: 20px;
      }
      p {
        color: #898989;
        font-size: 15px;
        b {
          color: #333333;
          font-weight: 600;
          font-size: 15px;
        }
      }
      .view-dateails {
        margin-top: 20px;
        width: 118px;
        @media (max-width: 767px) {
          margin-top: 10px;
        }
      }
    }
  }
}

.body-room-3 {
  .wrap-room-3 {
    padding-bottom: 40px;
    padding-top: 10px;
    @media (max-width: 767px) {
      padding: 0;
      padding-bottom: 40px;
    }
    .wrap-item {
      &:hover {
        .img1,
        .img2 {
          transform: scale(1.2, 1.2);
          @include transition;
        }
        .img {
          &:before {
            opacity: 0.7;
            @include transition-3;
            overflow: visible;
          }
        }
      }
      margin-top: 40px;
      @media (max-width: $screen-xs) {
        margin-top: 30px;
      }
      .img {
        position: relative;
        &:before {
          bottom: 0;
          left: 0;
          right: 0;
          top: 50%;
          position: absolute;
          content: "";
          opacity: 0;
          pointer-events: none;
          background-color: transparent;
          background: -webkit-gradient(
            linear,
            left top,
            left bottom,
            from(transparent),
            to(#1e1818)
          );
          background: -webkit-linear-gradient(top, transparent, #1e1818);
          background: -moz-linear-gradient(top, transparent, #1e1818);
          background: -ms-linear-gradient(top, transparent, #1e1818);
          background: -o-linear-gradient(top, transparent, #1e1818);
          @include transition-3;
          overflow: hidden;
        }
      }
      .text-room-3 {
        margin-left: 69px;
        margin-right: 69px;
        position: relative;
        .img1 {
          float: left;
          margin-top: 60px;
          margin-right: 70px;
          @include transition;
        }
        .img2 {
          float: right;
          margin-top: 60px;
          margin-left: 70px;
          @include transition;
        }
        .text {
          overflow: hidden;
          padding: 8px 20px 0 27px;
          background-color: #fff;
          position: relative;
          -webkit-transform: translateY(-60px);
          -moz-transform: translateY(-60px);
          -ms-transform: translateY(-60px);
          -o-transform: translateY(-60px);
          width: 530px;
          float: left;
          .line {
            width: 70px;
            margin-top: 80px;
            height: 2px;
            background: #333;
          }
          .view-dateails {
            margin-top: 25px;
            width: 119px;
            position: relative;
            @media (max-width: 767px) {
              margin-top: 10px;
            }
          }
          h2 {
            font-size: 36px;
            &:hover {
              color: $color-hover;
            }
          }
          h5 {
            font-size: 14px;
            margin-top: 10px;
            margin-bottom: 33px;
          }
          p {
            color: #898989;
            font-size: 15px;
            font-weight: 400;
            b {
              font-weight: 600;
              color: #333;
            }
          }
        }
      }
    }
  }
}

.body-room-4 {
  padding-top: 50px;
  padding-bottom: 95px;
  @media (max-width: 767px) {
    padding-top: 30px;
    padding-bottom: 40px;
  }
  .wrap-room-4 {
    .wrap-item {
      .img1 {
        position: relative;
        overflow: hidden;
        img {
          @include transition;
        }
      }
      &:hover {
        .img1 {
          overflow: hidden;
          img {
            transform: scale(1.2, 1.2);
            @include transition;
          }
        }
        .img {
          &:before {
            opacity: 0.7;
            @include transition-3;
            overflow: visible;
          }
        }
      }
      .img {
        position: relative;
        &:before {
          bottom: 0;
          left: 0;
          right: 0;
          top: 50%;
          position: absolute;
          content: "";
          opacity: 0;
          pointer-events: none;
          background-color: transparent;
          background: -webkit-gradient(
            linear,
            left top,
            left bottom,
            from(transparent),
            to(#1e1818)
          );
          background: -webkit-linear-gradient(top, transparent, #1e1818);
          background: -moz-linear-gradient(top, transparent, #1e1818);
          background: -ms-linear-gradient(top, transparent, #1e1818);
          background: -o-linear-gradient(top, transparent, #1e1818);
          @include transition-3;
          overflow: hidden;
        }
      }
      margin-bottom: 100px;
      &:last-child {
        margin-bottom: 0px;
      }
      .text-room-4 {
        &.room-right {
          padding-right: 0px;
          margin-right: -30px;
          margin-left: 0px;
        }
        padding-left: 0px;
        margin-left: -30px;
        .text {
          padding: 25px 60px 85px 100px;
          .view-dateails {
            margin-top: 15px;
            width: 119px;
            position: relative;
          }
          h2 {
            font-size: 36px;
          }
          h5 {
            font-size: 14px;
            margin-top: 20px;
            margin-bottom: 33px;
          }
          p {
            color: #898989;
            font-size: 15px;
            font-weight: 400;
            b {
              font-weight: 600;
              color: #333;
            }
          }
        }
      }
    }
  }
}

.body-room-5 {
  padding-top: 50px;
  padding-bottom: 35px;
  @media (max-width: 767px) {
    padding-top: 30px;
    padding-bottom: 0px;
  }
  .wrap-room-5 {
    .wrap-item {
      position: relative;
      overflow: hidden;
      display: block;
      margin-bottom: 30px;
      background-position: 50% 50%;
      background-size: cover;
      background-repeat: no-repeat;
      &:before {
        position: absolute;
        pointer-events: none;
        content: "";
        z-index: 0;
        top: 50%;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(21, 21, 21, 0);
        background: -webkit-gradient(
          linear,
          left top,
          left bottom,
          from(rgba(21, 21, 21, 0)),
          to(rgba(21, 21, 21, 0.7))
        );
        background: -webkit-linear-gradient(
          top,
          rgba(21, 21, 21, 0),
          rgba(21, 21, 21, 0.7)
        );
        background: -moz-linear-gradient(
          top,
          rgba(21, 21, 21, 0),
          rgba(21, 21, 21, 0.7)
        );
        background: -ms-linear-gradient(
          top,
          rgba(21, 21, 21, 0),
          rgba(21, 21, 21, 0.7)
        );
        background: -o-linear-gradient(
          top,
          rgba(21, 21, 21, 0),
          rgba(21, 21, 21, 0.7)
        );
      }
      &:hover {
        .text-hover {
          position: absolute;
          top: 0px;
          background: rgba(255, 255, 255, 0.94);
          width: 100%;
          height: 100%;
          opacity: 1;
          border: 2px solid #3d3b38;
          display: visible;
          transform: scale(1, 1);
          @include transition;
          right: 0;
          left: 0;
          bottom: 0;
        }
      }
      .text-room-5 {
        position: absolute;
        bottom: 28px;
        left: 50px;
        h2 {
          color: $color-white;
        }
        h5 {
          color: $color-white;
          font-size: $font-size-base;
        }
      }
      .text-hover {
        display: hidden;
        opacity: 0;
        position: absolute;
        top: 0px;
        right: 0;
        transform: scale(0.9, 0.9);
        border: 2px solid #3d3b38;
        @include transition;
        .text {
          padding: 16px 47px;
          .view-dateails {
            margin-top: 15px;
            width: 119px;
            &:hover {
              background: #fff;
            }
          }
          h2 {
            font-size: 30px;
          }
          h5 {
            font-size: 14px;
            margin-top: 10px;
            margin-bottom: 33px;
          }
          p {
            color: #898989;
            font-size: 15px;
            font-weight: 400;
            b {
              font-weight: 600;
              color: #333;
            }
          }
        }
      }
    }
  }
}

.body-room-6 {
  padding-top: 50px;
  padding-bottom: 25px;
  @media (max-width: 767px) {
    padding-top: 30px;
    padding-bottom: 0px;
  }
  .wrap-room-6 {
    .wrap-item {
      position: relative;
      overflow: hidden;
      display: block;
      margin-bottom: 30px;
      background-position: 50% 50%;
      background-size: cover;
      background-repeat: no-repeat;
      overflow: hidden;
      img {
        @include transition;
      }
      .img {
        &:before {
          content: "";
          position: absolute;
          background: -webkit-gradient(
            linear,
            left top,
            left bottom,
            from(rgba(21, 21, 21, 0)),
            to(rgba(21, 21, 21, 0.7))
          );
          background: -webkit-linear-gradient(
            top,
            rgba(21, 21, 21, 0),
            rgba(21, 21, 21, 0.7)
          );
          background: -moz-linear-gradient(
            top,
            rgba(21, 21, 21, 0),
            rgba(21, 21, 21, 0.7)
          );
          background: -ms-linear-gradient(
            top,
            rgba(21, 21, 21, 0),
            rgba(21, 21, 21, 0.7)
          );
          background: -o-linear-gradient(
            top,
            rgba(21, 21, 21, 0),
            rgba(21, 21, 21, 0.7)
          );
          height: 100%;
          width: 100%;
          z-index: 1;
          @include transition;
          opacity: 0;
          overflow: hidden;
        }
      }
      &:hover {
        .img {
          position: relative;
          @include transition;
          img {
            transform: scale(1.1, 1.1);
            @include transition;
            background-color: rgba(21, 21, 21, 0);
            opacity: 0.9;
          }
          &:before {
            height: 100%;
            width: 100%;
            opacity: 1;
            overflow: visible;
            @include transition;
          }
        }
      }
      .text {
        position: absolute;
        top: 0;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.8);
        opacity: 0.9;
        left: 0px;
        max-width: 470px;
        padding: 12px 30px 30px 30px;
        z-index: 2;
        .view-dateails {
          margin-top: 15px;
          width: 119px;
          &:focus {
            color: $color-white;
          }
          &:hover {
            background: #fff;
            color: #8e7037;
          }
        }
        h2 {
          font-size: 32px;
          color: $color-white;
        }
        h5 {
          font-size: 14px;
          margin-top: 10px;
          margin-bottom: 22px;
          color: #8e7037;
        }
        p {
          color: $color-white;
          font-size: 15px;
          font-weight: 400;
          b {
            font-weight: 600;
            color: $color-white;
          }
        }
        ul {
          padding-left: 14px;
          margin-top: 17px;
          li {
            font-size: 14px;
            color: $color-white;
            font-weight: 500;
            line-height: 1.9;
            padding-left: 10px;
          }
        }
      }
      .text-1 {
        position: absolute;
        top: 0;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.8);
        opacity: 0.9;
        right: 0px;
        max-width: 470px;
        padding: 12px 30px 30px 30px;
        z-index: 2;
        .view-dateails {
          margin-top: 15px;
          width: 119px;
          &:focus {
            color: $color-white;
          }
          &:hover {
            background: #fff;
            color: #8e7037;
          }
        }
        h2 {
          font-size: 32px;
          color: $color-white;
        }
        h5 {
          font-size: 14px;
          margin-top: 10px;
          margin-bottom: 22px;
          color: #8e7037;
        }
        p {
          color: $color-white;
          font-size: 15px;
          font-weight: 400;
          b {
            font-weight: 600;
            color: $color-white;
          }
        }
        ul {
          padding-left: 14px;
          margin-top: 17px;
          li {
            font-size: 14px;
            color: $color-white;
            font-weight: 500;
            line-height: 1.9;
            padding-left: 10px;
          }
        }
      }
    }
  }
}

/* 2.4.14 CHECK-OUT  */

.check-out {
  h2 {
    font-weight: 700;
    @media (max-width: $screen-xs-max) {
      font-size: 20px;
    }
  }
  padding-bottom: 60px;
  padding-top: 38px;
  @media (max-width: 767px) {
    padding-bottom: 60px;
  }
  .check-p {
    color: #898989;
    font-size: $font-size-base;
    font-weight: 400;
    margin-bottom: 17px;
    a {
      color: $color-black;
      font-weight: 600;
      &:hover {
        text-decoration: none;
      }
    }
  }
  .check-left {
    label {
      margin-bottom: 7px;
      color: $color-black;
      font-weight: 500;
    }
    a {
      line-height: 26px !important;
      text-decoration: none;
      &:hover {
        text-decoration: none;
      }
    }
    .color {
      color: $color-black !important;
      font-size: 14px;
    }
    .ion-chevron-down {
      color: $color-gray;
      float: right;
    }
    .dropdown-menu {
      z-index: 1;
      width: 100%;
      border-radius: 0px;
      padding: 10px 0px;
      border: 2px solid white;
      cursor: pointer;
      .active {
        background: #8e7037;
        color: #fff;
      }
      li {
        padding: 7px 13px;
        &:hover {
          background: #8e7037;
          color: #fff;
        }
      }
    }
    .form-group {
      span {
        color: #ff0000;
      }
      textarea {
        height: 85px;
      }
    }
    .form-control {
      border: 2px solid $color-gray;
      border-radius: 0px;
      height: 42px;
      line-height: 37px;
      margin-bottom: 15px;
      &::placeholder {
        color: $color-black;
        font-weight: 400;
        font-size: $font-size-base;
      }
    }
    p {
      color: #000;
      font-size: 16px;
      margin-top: 15px;
      margin-bottom: 30px;
    }
    .click {
      color: #898989;
      font-size: 14px;
      font-weight: 400;
      height: auto;
      a {
        color: #232323;
        font-weight: 600;
      }
    }
    .b {
      margin-bottom: 22px;
      padding-left: 10px;
      input {
        margin-top: 6px;
        margin-left: -30px;
      }
    }
  }
  .col-lg-offset-1 {
    margin-left: 5.6%;
  }
  .col-lg-5 {
    width: 44.3%;
  }
  .check-right {
    .checkout_cart {
      margin-bottom: 33px;
      margin-top: 25px;
      border: 2px solid $color-gray;
      padding: 15px 30px 25px 30px;
      .cart-item {
        overflow: hidden;
        margin-top: 20px;
        position: relative;
        .img {
          width: 100px;
          float: left;
          position: relative;
          margin-right: 20px;
          img {
            width: 100%;
          }
          &:before {
            bottom: 0;
            left: 0;
            right: 0;
            top: 50%;
            position: absolute;
            content: "";
            opacity: 0;
            z-index: 10;
            pointer-events: none;
          }
        }
        .text {
          margin-right: 15px;
          overflow: hidden;
          a {
            font-weight: 600;
            color: $color-black;
            font-size: 14px;
            text-transform: uppercase;
            &:hover {
              color: $color-hover;
              text-decoration: none;
            }
          }
          p {
            margin: 0;
            font-weight: 400;
            font-size: 14px;
            span {
              display: block;
            }
            b {
              font-size: 16px;
            }
          }
        }
        .remove {
          position: absolute;
          top: 0;
          right: 0;
          color: #a7a7a7;
          &:hover {
          }
        }
        &:hover {
          .img:before {
            opacity: 0.5;
            top: 0;
          }
        }
      }
    }
    .checkout-cartinfo {
      span {
        display: inline-block;
        min-width: 195px;
        font-weight: 500;
      }
      p {
        margin-bottom: 15px;
        color: #000;
        font-size: 20px;
        font-weight: 700;
        @media (max-width: $screen-xs-max) {
          font-size: 16px;
        }
        strong {
          color: #ee242a;
        }
      }
    }
    .checkout-option {
      margin-bottom: 32px;
      margin-top: 30px;
      .card {
        display: inline;
        .img-responsive {
          display: inline-block;
        }
      }
      .margin-bottom {
        margin-bottom: 22px;
      }
      label {
        font-weight: 500;
        font-size: 15px;
        color: $color-black;
        padding-left: 30px;
        input {
          margin-top: 6px;
          margin-left: -30px;
        }
        span {
          font-size: 12px;
          font-weight: 400;
          margin-top: 5px;
          display: block;
        }
        &.padding-right {
          padding-right: 20px;
        }
      }
      img {
        padding-left: 6px;
        cursor: pointer;
      }
    }
    .checkout-btn {
      width: 213px;
      height: 54px;
      font-size: 16px;
      color: $color-white;
      background: #8e7037;
      line-height: 40px;
      border-radius: 0px;
      font-weight: 600;
      &:hover {
        border: 2px solid #8e7037;
        background: transparent;
        color: #8e7037;
      }
    }
  }
}

/* 2.4.15 RESTAURANTS */

.body-restaurant {
  padding-bottom: 95px;
  padding-top: 40px;
  @media (max-width: 767px) {
    padding: 30px 0;
  }
  .restaurant-lager {
    margin-top: -40px;
    .restaurant_content {
      margin-top: 40px;
      .hr {
        margin-top: 45px;
        height: 1px;
        width: 100%;
        @media (max-width: $screen-xs) {
          margin-top: 25px;
        }
        &:before {
          width: 50%;
          content: "";
          height: 1px;
          float: left;
          background-color: #red;
          background-image: -webkit-gradient(
            linear,
            left top,
            right top,
            from(#fff),
            to(#e3e3e3)
          );
          background-image: -webkit-linear-gradient(left, #fff, #e3e3e3);
          background-image: -moz-linear-gradient(left, #fff, #e3e3e3);
          background-image: -ms-linear-gradient(left, #fff, #e3e3e3);
          background-image: -o-linear-gradient(left, #fff, #e3e3e3);
        }
        &:after {
          float: right;
          background-color: #red;
          background-image: -webkit-gradient(
            linear,
            left top,
            right top,
            from(#e3e3e3),
            to(#fff)
          );
          background-image: -webkit-linear-gradient(left, #e3e3e3, #fff);
          background-image: -moz-linear-gradient(left, #e3e3e3, #fff);
          background-image: -ms-linear-gradient(left, #e3e3e3, #fff);
          background-image: -o-linear-gradient(left, #e3e3e3, #fff);
          width: 50%;
          content: "";
          height: 1px;
        }
      }
      .restaurant_title {
        .heading {
          font-size: 36px;
          font-weight: 700;
          color: $color-black;
          font-family: $font-family-Poppins;
          @media (max-width: $screen-xs) {
            font-size: 25px;
          }
        }
        .time {
          color: #898989;
          font-size: 18px;
          margin-top: -8px;
          display: block;
        }
      }
      .content-restaurant {
        margin-top: 20px;
        .restaurant_item {
          margin-top: 30px;
          @media (max-width: 767px) {
            margin-top: 5px;
          }
          &:hover {
            img {
              transform: scale(1.1, 1.1);
              opacity: 0.7;
              @include transition;
            }
          }
          .img {
            overflow: hidden;
            img {
              @include transition;
              width: 100%;
            }
          }
          .text {
            h2 {
              font-size: 18px;
              text-transform: uppercase;
              font-weight: 600;
              margin-bottom: 7px;
              a {
                color: #444444;
                &:hover,
                &:focus {
                  text-decoration: none;
                  color: $color-hover;
                }
              }
            }
            .desc {
              color: #444;
              margin-bottom: 0;
              font-size: 15px;
              margin-top: 5px;
              line-height: 1.4em;
            }
            .price {
              font-size: 30px;
              margin-bottom: 0;
              margin-top: 10px;
              color: $color-hover;
              font-weight: 600;
            }
          }
        }
      }
    }
  }
}

.body-restaurant-1 {
  padding-bottom: 30px;
  padding-top: 20px;
  @media (max-width: 767px) {
    padding-bottom: 0;
  }
  .restaurant_title {
    .heading {
      @extend .heading;
      font-size: 36px;
      @media (max-width: $screen-xs) {
        font-size: 25px;
      }
    }
    .time {
      font-size: 18px;
      @extend .time;
    }
  }
  .wrap-content {
    .restaurant_content {
      margin-bottom: 55px;
      .restaurant_item {
        margin-top: 30px;
        overflow: hidden;
        &:hover {
          img {
            transform: scale(1.1, 1.1);
            @include transition;
            opacity: 0.7;
          }
        }
        .img {
          float: left;
          width: 120px;
          margin-right: 30px;
          position: relative;
          overflow: hidden;
          img {
            width: 100%;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
            @include transition;
          }
        }
        .text {
          padding-right: 60px;
          position: relative;
          overflow: hidden;
          margin-top: 5px;
          h2 {
            font-size: 18px;
            text-transform: uppercase;
            font-weight: 600;
            margin-top: 0;
            a {
              color: #444444;
              &:hover,
              &:focus {
                text-decoration: none;
                color: $color-hover;
              }
            }
          }
          .desc {
            color: #444;
            margin-bottom: 0;
            font-size: 15px;
            margin-top: 5px;
            line-height: 1.4em;
          }
          .price {
            text-align: right;
            font-size: 18px;
            line-height: 1.428em;
            position: absolute;
            top: 0;
            right: 0;
            margin-bottom: 0;
            line-height: 1;
            color: $color-hover;
            font-size: 18px;
            font-weight: 600;
          }
        }
      }
    }
  }
}

.body-restaurant-2 {
  text-align: center;
  padding-top: 45px;
  padding-bottom: 50px;
  @media (max-width: 767px) {
    padding-bottom: 0;
  }
  .restaurant_item {
    .wrap_item {
      &:hover {
        img {
          transform: scale(1.1, 1.1);
          @include transition;
          opacity: 0.8;
        }
      }
    }
    .img {
      float: left;
      width: 110px;
      margin-right: 30px;
      position: relative;
      overflow: hidden;
      img {
        @include transition;
        overflow: hidden;
        width: 100%;
      }
      .sales {
        font-family: "Montserrat", sans-serif;
        font-size: 12px;
        position: absolute;
        top: 0;
        background: #f9b82c;
        color: $color-white;
        padding: 5px 7px;
        left: 0;
      }
    }
    .text {
      padding-right: 60px;
      position: relative;
      overflow: hidden;
      margin-top: 5px;
      margin-bottom: 32px;
      h2 {
        font-size: 18px;
        text-transform: uppercase;
        font-weight: 600;
        margin-top: 0;
        a {
          color: #444444;
          &:hover,
          &:focus {
            text-decoration: none;
            color: $color-hover;
          }
        }
      }
      .desc {
        color: #444;
        margin-bottom: 0;
        font-size: 15px;
        margin-top: 5px;
        line-height: 1.4em;
      }
      .price {
        text-align: right;
        font-size: 18px;
        line-height: 1.428em;
        position: absolute;
        top: 0;
        right: 0px;
        margin-bottom: 0;
        line-height: 1;
        color: $color-hover;
        font-size: 18px;
        font-weight: 600;
        span {
          display: block;
        }
        .del {
          margin-top: 9px;
          color: #999;
          text-decoration: line-through;
        }
      }
    }
  }
  .time {
    margin-top: 4px;
    font-size: 16px;
    font-weight: 400;
  }
  .product {
    text-align: initial;
  }
  .shape {
    width: 100%;
  }
  .nav-tabs {
    display: block;
    border-bottom: 2px solid #e7e7e7;
    margin-bottom: 25px;
    margin-top: 10px;
    li {
      width: 25%;
      &.active > a {
        color: #8e7037;
        background: transparent;
        border: none;
        position: relative;
        &:before {
          content: "";
          position: absolute;
          background: 0;
          outline: none;
          color: #8e7037;
          border-bottom: 2px solid #8e7037;
          border-top: transparent;
          border-left: transparent;
          border-right: transparent;
          border-bottom: 2px solid #8e7037;
          @include transition;
          width: 100%;
          bottom: -1px;
          left: 0;
          opacity: 1;
          overflow: visible;
        }
        &:hover,
        &:focus {
          background: 0;
          outline: none;
          color: #8e7037;
          border-top: transparent;
          border-left: transparent;
          border-right: transparent;
          &:before {
            @include transition;
            width: 100%;
            opacity: 1;
            overflow: visible;
          }
        }
      }
      a {
        color: $color-black;
        font-size: 23px;
        font-family: "Poppins", sans-serif;
        font-weight: 700;
        -webkit-border-radius: 0px;
        border-radius: 0px;
        padding: 6px 13px;
        border: none;
        margin: 0;
        padding-bottom: 23px;
        position: relative;
        &:before {
          content: "";
          position: absolute;
          background: 0;
          outline: none;
          color: #8e7037;
          border-bottom: 2px solid #8e7037;
          border-top: transparent;
          border-left: transparent;
          border-right: transparent;
          border-bottom: 2px solid #8e7037;
          @include transition;
          overflow: hidden;
          opacity: -1;
          width: 0%;
          bottom: -1px;
          left: 0;
        }
        &:hover,
        &:focus {
          background: 0;
          outline: none;
          color: #8e7037;
          border-top: transparent;
          border-left: transparent;
          border-right: transparent;
          &:before {
            @include transition;
            width: 100%;
            opacity: 1;
            overflow: visible;
          }
        }
      }
    }
  }
}

.body-restaurant-3 {
  background: url("../images/Restaurants/Restaurants-47.jpg") no-repeat center
    center;
  padding: 50px 0px;
  background-size: cover;
  .reservation {
    position: relative;
    z-index: 9;
    max-width: 770px;
    margin-left: auto;
    margin-right: auto;
    padding: 25px 70px;
    &:after {
      content: "";
      display: block;
      position: absolute;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.87);
      opacity: 0.9;
      top: 0;
      left: 0;
      z-index: -1;
    }
    h2 {
      text-transform: uppercase;
      color: #fff;
      font-weight: bold;
      margin: 0;
      line-height: 1;
      text-align: center;
    }
    .reservation_form {
      margin-top: 40px;
      .form-control {
        &.wrap-box {
          height: 42px;
          width: 100%;
          background: transparent;
          border: 2px solid white;
          border-right: none;
          color: #fff;
          font-size: 12px;
          font-weight: 400;
          -webkit-box-shadow: none;
          box-shadow: none;
          padding-right: 0;
          &::placeholder {
            color: #fff;
          }
        }
        -webkit-border-radius: 0px;
        border-radius: 0px;
      }
      .input-group-addon {
        border-radius: 0px;
        background: transparent;
        color: white;
        border: 2px solid white;
        border-left: none;
        padding-left: 0;
      }
      .awe-input {
        border: 2px solid #fff;
        background-color: transparent;
        width: 100%;
        color: #fff;
        height: 42px;
        padding-left: 14px;
        padding-right: 14px;
        font-weight: 400;
        &::placeholder {
          font-size: 12px;
          font-weight: 400;
          color: #fff;
        }
      }
      .dropdown {
        .form-control {
          color: #fff;
          height: 42px;
          background: transparent;
          border: 2px solid white;
          border-radius: 0;
          font-size: 12px;
          line-height: 27px;
          text-decoration: none;
          .color {
            color: #fff;
          }
        }
        .dropdown-menu {
          border: none;
          min-width: 100%;
          border-radius: 0px;
          li {
            padding: 5px 15px;
            &:hover {
              background: $color-hover;
              color: #fff;
            }
          }
        }
        .ion-chevron-down {
          float: right;
          color: #fff;
        }
      }
      .awe-teaxtarea {
        margin-top: 20px;
        background-color: transparent;
        width: 100%;
        border: 2px solid #fff;
        color: #fff;
        height: 135px;
        padding: 14px;
        padding-top: 10px;
        vertical-align: middle;
        resize: none;
        &::placeholder {
          color: #fff;
        }
      }
      .btn {
        width: 189px;
        height: 42px;
        font-size: 16px;
        margin-top: 20px;
        &:hover {
          background: #fff;
        }
      }
    }
  }
}

/*  2.4.16 CONTACT */

.section-contact {
  padding-top: 30px;
  padding-bottom: 65px;
  @media (max-width: 767px) {
    padding-top: 0px;
    padding-bottom: 40px;
  }
  .contact {
    .text {
      margin-top: 15px;
      h2 {
        text-transform: uppercase;
        font-weight: bold;
        font-size: 28px;
        color: $color-black;
        @media (max-width: 767px) {
          font-size: 20px;
        }
      }
      p {
        margin-top: 30px;
        font-size: 15px;
        line-height: 1.428em;
        @media (max-width: 767px) {
          font-size: 14px;
          margin-top: 15px;
        }
      }
      ul {
        list-style: none;
        padding-left: 0;
        margin-bottom: 0;
        margin-top: 30px;
        li {
          padding: 4px 0;
          .fa {
            color: #8e7037;
            font-size: 17px;
            width: 8%;
          }
        }
      }
    }
    .contact-form {
      .field-textarea {
        padding-top: 7px;
      }
      .field-text,
      .field-textarea {
        height: 42px;
        border: 2px solid $color-black;
        width: 100%;
        margin-top: 15px;
        padding-left: 15px;
        padding-right: 15px;
        &::placeholder {
          color: $color-black;
          font-size: 14px;
          font-weight: 400;
          font-family: $font-family-Poppins;
        }
        &:focus {
          border: 2px solid $color-hover;
        }
      }
      .field-textarea {
        resize: none;
        height: 210px;
      }
      .btn {
        margin-top: 15px;
        width: 200px;
        font-size: 16px;
        height: 42px;
        width: 200px;
      }
    }
  }
}

/* 2.4.17 BLOG */

.section-blog {
  padding-bottom: 95px;
  padding-top: 5px;
  .post {
    .wrap {
      .timer {
        padding: 0 30px !important;
      }
      position: absolute;
      background: #997e4a;
      bottom: 5%;
      text-align: center;
      opacity: 0.9;
      left: 0;
      div {
        display: inline-block;
        line-height: 1;
        padding: 15px;
      }
      span {
        display: block;
        font-size: 12px;
        color: white;
        font-weight: 400;
        text-transform: uppercase;
        margin-top: 5px;
      }
      #hours,
      #days,
      #minutes,
      #seconds {
        font-size: 30px;
        color: $color-white;
        font-weight: 600;
      }
    }
  }
  &.blog-detail {
    padding-bottom: 125px;
    .hover-zoom-1 {
      img {
        @include transition;
      }
      &:hover img {
        opacity: 0.8;
        @include transition;
      }
    }
    .share-tag {
      margin-left: 100px;
      margin-top: 31px;
      border-top: 1px solid #cacaca;
      padding-top: 15px;
      i {
        padding: 0px 8px;
        font-size: 14px;
      }
      span {
        padding-right: 23px;
      }
      a {
        color: $color-gray;
        font-size: 12px;
        font-weight: 500;
        &:hover {
          color: $color-hover;
          text-decoration: none;
        }
      }
    }
  }
}

.blog-content {
  .widget_search {
    margin-top: 40px;
  }
  &.events-content {
    .post .entry-footer {
      margin-top: 15px;
    }
  }
  .post {
    margin-top: 40px;
    @media (max-width: $screen-xs) {
      margin-top: 25px;
    }
  }
  .page-navigation {
    margin-top: 60px;
  }
  .comments,
  .comment-respond {
    margin-left: 100px;
  }
}

/* 2.4.18 SIDEBAR */

.sidebar {
  margin-right: 70px;
  .widget {
    margin-top: 40px;
    .widget-title {
      font-size: 18px;
      margin-top: 0;
      margin-bottom: 20px;
      font-weight: bold;
      text-transform: uppercase;
    }
    ul {
      list-style: none;
      padding-left: 0;
      margin-bottom: 0;
    }
    &.widget_check_availability {
      background-color: #f1f1f1;
      .widget-title {
        margin: 0;
        font-size: 16px;
        text-align: center;
        color: #333333;
        line-height: 50px;
        font-weight: 700;
      }
      .check_availability {
        padding: 0 20px 30px 20px;
        border-top: 1px solid #e4e4e4;
        .check_availability_title {
          margin-top: 25px;
          font-size: 14px;
          text-transform: uppercase;
          font-weight: bold;
          color: $color-hover;
          &:before {
            content: "";
            display: inline-block;
            height: 10px;
            border-left: 2px solid $color-hover;
            margin-right: 10px;
          }
        }
        .check_availability-field {
          margin-top: 15px;
          .date {
            width: 100%;
          }
          .form-control {
            color: #898989;
            width: 100%;
          }
          .wrap-box {
            -webkit-border-radius: 0;
            border-radius: 0;
            border: none;
            height: 30px;
            font-weight: 300;
          }
          .input-group-addon {
            border-radius: 0;
            background: transparent;
            border: none;
            position: absolute;
            z-index: 11;
            right: 13px;
            top: 7%;
            height: 30px;
            color: $color-hover;
            .fa-calendar {
              color: #919191;
            }
          }
          label {
            display: block;
            font-weight: bold;
            font-size: 12px;
            margin-bottom: 10px;
            color: #333333;
            text-transform: uppercase;
          }
          .awe-calendar-wrapper {
            width: 100%;
            .awe-calendar {
              background-color: #fff;
              border-width: 0;
              height: 30px;
              line-height: 30px;
              color: #898989;
              font-weight: 500;
            }
          }
          .bootstrap-select.btn-group.awe-select {
            width: 100%;
            .dropdown-toggle {
              background-color: #fff;
              height: 30px;
              border-width: 0;
              line-height: 20px;
              -webkit-box-shadow: none;
              box-shadow: none;
              -webkit-border-radius: 0;
              border-radius: 0;
              &:focus {
                outline: none !important;
              }
              .filter-option,
              .caret {
                color: #898989;
              }
            }
            .dropdown-menu {
              -webkit-border-radius: 0;
              border-radius: 0;
              border: none;
              ul {
                li {
                  a {
                    padding: 7px 10px;
                    outline: none;
                    color: #898989;
                    font-size: 14px;
                    font-weight: 500;
                    &:hover,
                    &:focus {
                      background: $color-hover;
                      color: white;
                    }
                  }
                }
              }
            }
          }
        }
        .check_availability_group {
          padding-left: 70px;
          position: relative;
          &:after {
            display: table;
            content: "";
            clear: both;
          }
          .label-group {
            position: absolute;
            left: 0;
            bottom: 5px;
            font-weight: bold;
            font-size: 12px;
            text-transform: uppercase;
          }
          .check_availability-field_group {
            margin-left: -4px;
            margin-right: -4px;
          }
          .check_availability-field {
            width: 50%;
            padding-left: 10px;
            padding-right: 10px;
            float: left;
          }
        }
        .btn-room {
          margin-top: 30px;
          width: 100%;
          font-size: 14px;
          color: $color-white;
          background: $color-hover;
          height: 40px;
          max-width: 260px;
          margin-right: auto;
          margin-left: auto;
          display: block;
          &:hover {
            border: 2px solid $color-hover;
            background: transparent;
            color: $color-hover;
          }
        }
      }
      &.widget-1 {
        margin-top: 30px;
      }
    }
    .widget-deal {
      cursor: w-resize;
      .item {
        position: relative;
        &:after {
          content: "";
          left: 0;
          top: 0;
          right: 0;
          bottom: 0;
          position: absolute;
          pointer-events: none;
        }
        .img {
          position: relative;
          img {
            width: 100%;
          }
        }
        .text {
          text-align: center;
          position: absolute;
          bottom: 30px;
          left: 0;
          right: 0;
          padding: 0 10px;
          z-index: 10;
          h2 {
            color: $text-color;
            font-size: 20px;
            text-transform: uppercase;
            margin: 0;
            font-weight: normal;
            font-weight: 600;
          }
          .price {
            color: $text-color;
            font-weight: 600;
            font-size: 39px;
            margin-bottom: 0;
            line-height: 1;
            margin-top: 5px;
          }
          .btn {
            margin-top: 13px;
            font-size: 12px;
            color: $text-color;
            width: 110px;
            height: 35px;
            border: 2px solid $text-color;
            background: transparent;
            line-height: 20px;
            &:hover {
              border: 2px solid $color-hover;
              background: $color-hover;
            }
          }
        }
      }
      .owl-nav {
        display: none;
      }
      .owl-dots {
        position: absolute;
        right: 15px;
        bottom: 5px;
        .owl-dot {
          width: 8px;
          height: 8px;
          display: inline-block;
          border-radius: 100%;
          border: 2px solid white;
          margin: 0px 3px;
          &.active {
            background: white;
          }
        }
      }
    }
    &.widget_categories {
      ul {
        margin-top: -7px;
        li {
          a {
            color: #333333;
            display: inline-block;
            padding: 7px 0;
          }
          &:hover > a {
            color: $color-hover;
            text-decoration: none;
          }
        }
      }
    }
    &.widget_upcoming_events {
      ul {
        margin-top: -10px;
        li {
          overflow: hidden;
          padding: 10px 0;
          .event-date {
            text-align: center;
            display: block;
            width: 70px;
            height: 68px;
            float: left;
            padding: 5px 10px;
            font-size: 16px;
            color: #000;
            margin-right: 20px;
            line-height: 1;
            border: 2px solid #232323;
            strong {
              margin-bottom: 3px;
              display: block;
              font-size: 34px;
              font-weight: 400;
            }
          }
          .text {
            margin-top: 5px;
            overflow: hidden;
            a {
              font-weight: bold;
              text-transform: uppercase;
              color: #000;
              &:hover {
                color: $color-hover;
                text-decoration: none;
              }
            }
            .date {
              display: block;
              color: #444444;
              margin-top: 5px;
              width: 100%;
            }
          }
        }
      }
    }
    &.widget_recent_entries {
      ul {
        margin-top: -7px;
        li {
          overflow: hidden;
          padding: 10px 0;
          &:hover {
            img {
              transform: scale(1.1, 1.1);
              opacity: 0.8;
              @include transition;
            }
          }
          .img {
            float: left;
            width: 70px;
            width: 70px;
            margin-right: 20px;
            overflow: hidden;
            img {
              width: 100%;
              @include transition;
            }
          }
          a {
            text-transform: uppercase;
            font-weight: bold;
            color: #000;
            &:hover {
              color: $color-hover;
              text-decoration: none;
            }
          }
          .date {
            display: block;
            color: #444444;
            margin-top: 5px;
          }
        }
      }
    }
    &.widget_tag_cloud {
      .tagcloud {
        font-size: 0;
        margin-top: -10px;
        a {
          font-size: 12px;
          font-weight: 500;
          display: inline-block;
          padding: 5px 13px;
          margin-right: 10px;
          margin-top: 10px;
          border: 2px solid $color-black;
          color: $color-black;
          &:hover {
            color: $color-white;
            background: $color-hover;
            text-decoration: none;
            border: 2px solid $color-white;
          }
        }
      }
    }
    &.widget_social {
      .widget-social {
        font-size: 0;
        margin-top: -10px;
        a {
          font-size: 18px;
          margin-top: 10px;
          display: inline-block;
          width: 32px;
          height: 32px;
          margin-right: 25px;
          text-align: center;
          line-height: 30px;
          color: $color-hover;
          -webkit-border-radius: 100%;
          border-radius: 100%;
          border: 2px solid $color-hover;
          &:hover {
          }
        }
      }
    }
  }
  .reservation-room-selected {
    .content-room,
    .total {
      padding: 20px;
      &.border-top {
        border-top: 1px solid #e4e4e4;
        padding-top: 15px;
      }
    }
    .room {
      font-weight: 600;
      color: #333;
      margin-bottom: 5px;
      span {
        font-size: 12px;
        font-weight: 400;
        padding-left: 20px;
      }
      &.room-1 {
        font-size: 12px;
        color: #acacac;
      }
    }
    .room1 {
      font-weight: 600;
      color: #333;
      margin-bottom: 3px;
      span {
        font-weight: 600;
        color: #8e7037;
        float: right;
      }
    }
    a {
      color: #8e7037;
      font-size: 12px;
      text-decoration: underline;
    }
  }
  .total {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    &.total-3 {
      background: $color-hover;
      color: #fff;
      span {
        color: #fff;
      }
    }
    span {
      color: #8e7037;
      font-size: 18px;
      float: right;
    }
  }
}

/* 2.4.19 WIDGETSEARCH */

.widgetsearch {
  position: relative;
  border: 2px solid #232323;
  font-size: 14px;
  &:before {
    content: "\f002";
    font-family: "FontAwesome";
    position: absolute;
    right: 15px;
    font-size: 18px;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -moz-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    -o-transform: translate(0, -50%);
  }
  .input-text {
    width: 100%;
    height: 50px;
    line-height: 50px;
    padding-right: 50px;
    border-width: 0;
    background-color: #fff;
    color: #333;
    font-weight: 500;
    padding-left: 15px;
    &::placeholder {
      color: #333333;
    }
  }
  .input-submit {
    display: none;
  }
}

/* 2.4.20 POST */

.post {
  position: relative;
  .entry-media {
    position: relative;
    .hover-zoom {
      overflow: hidden;
      display: block;
      &:hover {
        img {
          opacity: 0.8;
          @include transition;
        }
      }
    }
    img {
      @include transition;
      width: 100%;
    }
    .count-date {
      background-color: rgba(225, 189, 133, 0.85);
      position: absolute;
      right: 0;
      bottom: 0;
      z-index: 20;
      color: #fff;
      padding: 15px 30px;
      span {
        font-size: 30px;
        display: inline-block;
        text-align: center;
        padding: 0px 10px;
        line-height: 1;
        span {
          display: block;
          font-size: 12px;
          text-transform: uppercase;
          margin-top: 5px;
        }
      }
    }
    .post-format {
      position: absolute;
      display: block;
      color: #fff;
      text-align: center;
      top: 50%;
      left: 50%;
      font-size: 50px;
      line-height: 1;
      pointer-events: none;
      transform: translate(-50%, -50%);
      width: 64px;
      height: 64px;
      background: url("../images/Blog/Shape-101.png") no-repeat scroll 0 0;
    }
    .posted-on {
      position: absolute;
      bottom: -23px;
      left: 0;
      border: 2px solid #232323;
      text-align: center;
      color: #000;
      font-size: 16px;
      text-transform: uppercase;
      line-height: 1;
      width: 70px;
      height: 70px;
      padding: 10px;
      -webkit-transform: translate(0, 100%);
      -moz-transform: translate(0, 100%);
      -ms-transform: translate(0, 100%);
      -o-transform: translate(0, 100%);
      strong {
        display: block;
        font-weight: 600;
        font-size: 34px;
      }
    }
    .owl-pagination {
      display: none;
    }
  }
  .entry-header {
    margin-top: 20px;
    padding-left: 100px;
    h2 {
      font-weight: bold;
      margin: 0;
      font-size: 18px;
      line-height: 23px;
      @media (max-width: 767px) {
        font-size: 16px;
      }
      a {
        text-transform: uppercase;
        color: $gray-base;
        &:hover,
        &:focus {
          color: $color-hover;
          text-decoration: none;
        }
      }
    }
    .entry-meta {
      margin-top: 10px;
      margin-bottom: 0;
    }
  }
  &.post-single {
    .entry-header {
      h2 {
        font-weight: bold;
        margin: 0;
        font-size: 22px;
        text-transform: uppercase;
        @media (max-width: 767px) {
          font-size: 16px;
        }
      }
    }
  }
  .entry-meta {
    font-size: 14px;
    color: #9e9e9e;
    &:before {
      content: "";
      font-size: 10px;
      position: relative;
      top: -1px;
      margin-right: 10px;
      border-left: 2px solid #232323;
    }
    .posted-on {
      display: none;
    }
    .entry-categories:before,
    .entry-comments-link:before {
      content: "-";
      padding: 0 2px;
    }
    .entry-tags {
      margin-left: 20px;
      .screen-reader-text {
        color: #444444;
        margin-right: 5px;
      }
    }
    a {
      color: #9e9e9e;
      &:hover {
        color: $color-hover;
        text-decoration: none;
      }
      .entry-author-name {
        font-weight: bold;
        color: #444444;
        &:hover {
          color: $color-hover;
        }
      }
    }
  }
  .entry-content {
    color: #444444;
    font-size: 15px;
    margin-top: 12px;
    padding-left: 100px;
    @media (max-width: 767px) {
      font-size: 14px;
    }
    p {
      line-height: 1.5em;
      margin-bottom: 0;
    }
    a {
      color: #0072bc;
      text-decoration: underline;
      &:hover {
        color: $color-hover;
      }
    }
    blockquote {
      border: 2px solid #232323;
      padding: 17px 40px;
      margin: 0;
      p {
        color: #444;
        font-style: italic;
        font-size: 14px;
        position: relative;
        &::before {
          content: "“";
          font-family: "Montserrat";
          font-size: 28px;
          font-style: inherit;
          font-weight: 700;
          vertical-align: middle;
          padding-right: 10px;
          line-height: 0;
        }
        &:after {
          content: "”";
          font-size: 28px;
          font-style: inherit;
          font-family: "Montserrat";
          font-weight: 700;
          padding-top: 5px;
          vertical-align: middle;
          padding-left: 5px;
          line-height: 0;
        }
      }
    }
    h2 {
      margin-bottom: 15px !important;
      font-weight: 700;
      font-size: 18px;
    }
  }
  .entry-footer {
    padding-left: 100px;
    margin-top: 30px;
    @media (max-width: $screen-xs) {
      margin-top: 15px;
    }
  }
  &:hover {
    .entry-media:before {
      opacity: 0.7;
      top: 0;
    }
  }
  &.post-single {
    .entry-content {
      color: #444444;
      margin-top: 20px;
      font-size: 15px;
      @media (max-width: 767px) {
        font-size: 14px;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6 {
        text-transform: uppercase;
        margin-bottom: 10px;
      }
      .wp-caption {
        max-width: 100%;
      }
      .aligncenter {
        margin-left: auto;
        margin-right: auto;
      }
      .alignleft {
        float: left;
        margin-right: 20px;
      }
      .alignright {
        float: right;
        margin-left: 20px;
      }
      p {
        margin-bottom: 0;
        em {
          font-size: 13px;
          line-height: 1.4em;
          color: #6e6e6e;
        }
      }
    }
  }
}

/* 2.4.21 NAVIGATION */

.page-navigation {
  margin-top: 75px;
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
  font-size: 0;
  @media (max-width: $screen-xs) {
    margin-top: 50px;
  }
  li {
    display: inline-block;
    font-size: 15px;
    margin-right: 20px;
    vertical-align: middle;
    a {
      color: #444444;
      font-weight: 500;
      font-size: 15px;
      &:hover {
        color: $color-hover;
        text-decoration: none;
      }
    }
    &.first,
    &.last {
      a {
        font-size: 23px;
        display: block;
        width: 23px;
        height: 23px;
        line-height: 22px;
        text-align: center;
        &:hover {
        }
      }
    }
    &.first {
      margin-right: 40px;
    }
    &.last {
      margin-left: 18px;
    }
    &.current-page {
      a {
        color: $color-hover;
      }
    }
  }
}

/* 2.4.22 VIDEO */

.section-video {
  .btn-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: all 0.3s;
    background: url("../images/Blog/Shape-101.png");
    width: 64px;
    height: 64px;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .modal-video {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    transform: scale(2);
    transition: all 0.5s;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    z-index: 999;
    iframe {
      position: relative;
      top: 150px;
      width: 700px;
      max-width: 90%;
      display: block;
      margin: 0 auto;
      border: none;
      .ytp-autohide .ytp-watermark {
        display: none !important;
      }
    }
    &.opened {
      visibility: visible;
      opacity: 1;
      transform: scale(1);
    }
  }
  &:hover {
    .btn-play {
      width: 70px;
      height: 70px;
      background: url("../images/Blog/Shape-1101.png");
      background-repeat: no-repeat;
      background-size: cover;
      z-index: 2;
    }
  }
}

.video-v4 {
  iframe {
    border: none;
  }
}

/*  2.4.23 COMMENT */

.comments {
  margin-top: 10px;
  border-top: 1px solid #cacaca;
  padding-top: 15px;
  .comment-title {
    font-weight: bold;
    text-transform: uppercase;
  }
  .commentlist {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    li {
      position: relative;
      padding-left: 90px;
      margin-top: 25px;
      @media (max-width: $screen-xs) {
        padding-left: 60px;
      }
      .comment-body {
        border-bottom: 1px solid #cacaca;
        padding-bottom: 25px;
        overflow: hidden;
        .comment-avatar {
          position: absolute;
          width: 70px;
          display: block;
          top: 5px;
          left: 0;
          border-radius: 50%;
          overflow: hidden;
          img {
            width: 100%;
          }
          @media (max-width: $screen-xs) {
            width: 50px;
          }
        }
        .comment-subject {
          margin: 0;
          font-size: 14px;
          color: #444444;
          font-weight: bold;
        }
        p {
          color: #444444;
          font-size: 15px;
          line-height: 1.428em;
          margin-bottom: 0;
          margin-top: 10px;
          @media (max-width: $screen-xs-max) {
            font-size: 14px;
          }
        }
        .comment-meta {
          float: left;
          margin-top: 20px;
          color: #898989;
          a {
            color: #444;
            font-weight: bold;
            text-transform: capitalize;
            &:hover {
              color: $color-hover;
              text-decoration: none;
            }
          }
        }
        .action {
          float: right;
          margin-top: 18px;
          .btn {
            min-width: inherit;
            margin-left: 10px;
            height: 27px;
            width: 63px;
            font-weight: 600;
            font-size: 12px;
            line-height: 12px;
            color: $color-black;
            background: transparent;
            border: 2px solid #000;
            &:hover {
              color: $color-hover;
              border: 2px solid $color-hover;
            }
          }
        }
        .children {
          overflow: hidden;
          clear: both;
          list-style: none;
          padding-left: 0;
          li:last-child .comment-body {
            padding-bottom: 0;
            border-width: 0;
          }
        }
      }
      &:last-child .comment-body {
        border-bottom-width: 0;
        padding-bottom: 0;
      }
    }
  }
}

.comment-respond {
  border-top: 1px solid #cacaca;
  margin-top: 50px;
  padding-top: 20px;
  .comment-reply-title {
    text-transform: uppercase;
    color: #000;
    font-size: 18px;
    margin: 0;
    font-weight: bold;
  }
  .comment-form {
    margin-top: 10px;
    .row {
      margin-left: -10px;
      margin-right: -10px;
      [class*="col-"] {
        padding-left: 10px;
        padding-right: 10px;
      }
    }
    .field-text,
    .field-textarea {
      width: 100%;
      border: 2px solid #000;
      padding: 0 15px;
      margin-top: 15px;
      height: 43px;
      &::placeholder {
        color: $color-black;
      }
      &:focus {
        border: 2px solid $color-hover;
      }
    }
    .field-textarea {
      resize: none;
      height: 200px;
      padding: 10px 15px;
      line-height: 1.428em;
    }
    .btn {
      font-size: 14px;
      padding-left: 20px;
      padding-right: 20px;
      margin-top: 20px;
      font-weight: 600;
      border: 2px solid #000;
      color: $color-black;
      background: transparent;
      &:hover {
        color: $color-hover;
        border: 2px solid $color-hover;
      }
    }
  }
}

/* 2.4.24 AttRACTIONS */

.section-attractions {
  padding-bottom: 80px;
  @media (max-width: 767px) {
    padding-bottom: 50px;
  }
  .attraction {
    padding-top: 60px;
    margin-top: -60px;
    .attraction_sidebar {
      background-color: #f1f1f1;
      margin-top: 60px;
      .attraction_heading {
        color: #333333;
        font-size: 16px;
        text-transform: uppercase;
        font-weight: bold;
        border-bottom: 1px solid #e4e4e4;
        padding: 15px 20px;
        text-align: center;
        position: relative;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
        .attraction-icon-drop {
          display: none;
          float: right;
          position: absolute;
          right: 20px;
          font-size: 20px;
          top: 50%;
        }
      }
      .attraction_sidebar-content {
        padding-left: 20px;
        padding-right: 20px;
        padding-bottom: 25px;
        .attraction_title {
          color: #fff;
          background: $color-hover;
          font-size: 12px;
          text-transform: uppercase;
          font-weight: bold;
          margin-top: 30px;
          height: 40px;
          line-height: 43px;
          padding: 0 20px;
          i {
            margin-right: 15px;
            font-size: 16px;
          }
        }
        .bootstrap-select.attraction_select.awe-select {
          width: 100%;
          margin-top: 20px;
          .btn {
            background-color: #fff;
            height: 40px;
            border-width: 0;
            line-height: 20px;
            -webkit-box-shadow: none;
            box-shadow: none;
            -webkit-border-radius: 0;
            border-radius: 0;
            padding-left: 18px;
            &:focus {
              outline: none !important;
            }
            .filter-option,
            .caret {
              color: #898989;
            }
          }
          .dropdown-menu {
            -webkit-border-radius: 0;
            border-radius: 0;
            border: none;
            width: 100%;
            ul {
              li {
                a {
                  padding: 7px 10px;
                  outline: none;
                  color: #898989;
                  font-size: 14px;
                  font-weight: 400;
                  &:hover,
                  &:focus {
                    background: $color-hover;
                    color: white;
                  }
                }
              }
            }
          }
        }
        .attraction_location {
          list-style: none;
          padding-left: 0;
          margin-top: 25px;
          margin-bottom: 0;
          li {
            color: #898989;
            font-weight: 400;
            position: relative;
            padding-left: 25px;
            margin-top: 14px;
            &:first-child {
              margin-top: 0;
            }
            i {
              color: #333333;
              position: absolute;
              left: 0;
              line-height: 24px;
            }
            a {
              color: #898989;
              &:hover,
              &:focus {
                color: $color-hover;
                text-decoration: none;
                outline: none;
              }
            }
          }
        }
      }
    }
  }
  .attraction_detail {
    margin-top: 60px;
    .attraction_detail-title {
      color: #333333;
      text-transform: uppercase;
      font-weight: bold;
      font-size: 20px;
      @media (max-width: 767px) {
        font-size: 16px;
      }
      i {
        color: $color-hover;
        margin-right: 20px;
      }
    }
    ul {
      color: #333;
      font-size: 14px;
      font-weight: 500;
      line-height: 1.4em;
      list-style: none;
      padding-left: 0;
      margin-bottom: 0;
      margin-top: 20px;
      li {
        margin-top: 10px;
        span {
          font-weight: bold;
          text-transform: uppercase;
          margin-right: 20px;
        }
        a {
          color: $color-hover;
          text-decoration: none;
        }
      }
    }
  }
  .attraction_content {
    border-top: 1px solid #e4e4e4;
    padding-top: 7px;
    color: #898989;
    font-size: 14px;
    margin-top: 26px;
    .attraction_content-title {
      text-transform: uppercase;
      color: #333;
      font-size: 20px;
      margin-bottom: 17px;
      font-weight: bold;
      @media (max-width: 767px) {
        font-size: 16px;
      }
    }
    p {
      margin-bottom: 0;
      line-height: 1.5em;
      font-size: 14px;
      b {
        color: #333;
        font-weight: 600;
      }
      a {
        text-decoration: underline;
        font-weight: 600;
        color: $color-hover;
      }
    }
    .aligncenter,
    .alignleft {
      text-align: center;
      overflow: hidden;
      &:hover {
        img {
          transform: scale(1.1, 1.1);
          @include transition;
          opacity: 0.8;
        }
      }
      img {
        @include transition;
      }
    }
    .alignright {
      float: right;
      margin-left: 30px;
    }
    .alignleft {
      float: left;
      margin-right: 30px;
      width: 100%;
    }
  }
}

.section-statistics {
  padding-top: 55px;
  padding-bottom: 80px;
  background: url("../images/About/about-2.jpg") no-repeat;
  background-size: cover;
  background-position: center center;
  background-attachment: fixed;
  text-align: center;
  position: relative;
  width: 100%;
  &:before {
    background: #363635;
    content: "";
    position: absolute;
    z-index: 9;
    width: 100%;
    height: 100%;
    top: 0px;
    right: 0;
    left: 0;
    bottom: 0;
    opacity: 0.6;
  }
  .statistics {
    z-index: 99;
    position: relative;
    .col {
      position: relative;
      &:before {
        top: 35%;
        right: 0;
        bottom: 0;
        position: absolute;
        content: "";
        border-right: 1px solid #a5a4a4;
      }
      &:last-child:before {
        border: none;
      }
    }
  }
  .item {
    margin-top: 45px;
    text-align: center;
    color: #fff;
    font-size: 18px;
    text-transform: uppercase;
    position: relative;
    .count {
      font-size: 60px;
      font-weight: 500;
      color: #fff;
      display: block;
      line-height: 1.3em;
    }
  }
  .heading {
    color: $color-white;
    font-size: 36px;
    text-transform: uppercase;
  }
}

/* 2.4.25 SECTION-TEAM*/

.section-team {
  background-color: #fff;
  padding-bottom: 75px;
  padding-top: 41px;
  .heading {
    color: $color-gray;
    text-transform: uppercase;
    font-size: 36px;
    @media (max-width: $screen-xs) {
      font-size: 25px;
    }
  }
  .sub-heading {
    color: $color-gray;
    font-size: 20px;
  }
}

.team_item {
  margin-top: 70px;
  position: relative;
  &:before {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -25px;
    margin: auto;
    width: 0;
    content: "";
    border-bottom: 1px solid #f1f1f1;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
  }
  &:hover {
    .img {
      img {
        @include transition;
        transform: scale(1, 1);
      }
    }
    &:before {
      width: 100%;
    }
  }
  .img {
    max-width: 200px;
    overflow: hidden;
    margin: auto;
    position: relative;
    border-radius: 100%;
    -moz-border-radius: 100%;
    -webkit-border-radius: 100%;
    -ms-border-radius: 100%;
    -o-border-radius: 100%;
    img {
      width: 100%;
      @include transition;
      transform: scale(1.1, 1.1);
    }
  }
  .text {
    margin-top: 35px;
    h2 {
      margin: 0;
      font-size: 20px;
      font-weight: bold;
      text-transform: uppercase;
      color: #444;
      &:hover {
        color: $color-hover;
      }
    }
    span {
      color: #898989;
      font-size: 16px;
      display: block;
      margin-top: 7px;
    }
    p {
      margin-top: 15px;
      margin-bottom: 0;
      color: #30373b;
      line-height: 1.5em;
      font-size: 15px;
    }
    .team-share {
      font-size: 0;
      margin-top: 23px;
      a {
        font-size: 18px;
        display: inline-block;
        color: #898989;
        margin: 0 13px;
        &:hover {
          color: $color-hover;
        }
      }
    }
  }
  &:hover {
    &:before {
      width: 100%;
    }
    .img {
      &:before {
      }
      img {
      }
    }
  }
}

.counter {
  background-color: #eaecf0;
  text-align: center;
}

.employees,
.customer,
.design,
.order {
  margin-top: 70px;
  margin-bottom: 70px;
}

.counter-count {
  font-size: 18px;
  background-color: #00b3e7;
  border-radius: 50%;
  position: relative;
  color: #ffffff;
  text-align: center;
  line-height: 92px;
  width: 92px;
  height: 92px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  display: inline-block;
}

/*  2.4.26 RESERVATION */

.section-reservation-page {
  padding-bottom: 50px;
  padding-top: 20px;
  .col-lg-offset-1 {
  }
  @media (max-width: 992px) {
    padding-bottom: 40px;
  }
  .sidebar {
    margin-right: 0;
    .check_availability_title {
      font-weight: 600 !important;
      &:before {
        content: "\f363" !important;
        font-family: "Ionicons";
        border-left: none !important;
      }
    }
    .check_availability-field {
      label {
        font-weight: 600 !important;
      }
    }
    .check_availability_group {
      .label-group {
        font-weight: 600 !important;
      }
    }
    .widget-title {
      font-weight: 600 !important;
    }
  }
}

.reservation_step {
  ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    font-size: 0;
    text-align: center;
    border-bottom: 1px solid #e4e4e4;
    li {
      display: inline-block;
      font-size: 15px;
      position: relative;
      margin: 0px 25px;
      @media (max-width: $screen-xs-max) {
        display: block;
        margin: 0;
      }
      &:before {
        content: "";
        left: 0;
        right: 0;
        bottom: -1px;
        height: 2px;
        position: absolute;
        background-color: transparent;
        width: 0;
        @include transition-3;
      }
      a {
        color: #333;
        display: block;
        padding: 15px 0;
        font-size: 14px;
        span {
          font-weight: bold;
          font-size: 16px;
        }
      }
      &.active,
      &:hover {
        &:before {
          background: $color-hover;
          width: 100%;
          @include transition-3;
        }
      }
    }
  }
}

.reservation-date {
  margin-top: 30px;
  background: #f1f1f1;
  ul {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    padding: 20px 20px;
    li {
      color: #333;
      font-size: 12px;
      overflow: hidden;
      font-weight: 500;
      padding: 5px 0;
      span:last-child {
        float: right;
        font-weight: 600;
      }
    }
  }
}

.reservation-room-selected {
  background-color: #f1f1f1;
  margin-top: 45px;
  &.selected-4 {
    margin-top: 30px;
  }
  .reservation-room-seleted_item {
    padding: 20px 20px 20px 20px;
    border-bottom: 1px solid #e4e4e4;
    &:last-child {
      border-bottom-width: 0;
    }
    h6 {
      display: inline-block;
      vertical-align: middle;
      font-size: 14px;
      text-transform: uppercase;
      font-weight: 600;
      margin: 0 20px 0 0;
      line-height: 1.428em;
    }
    .reservation-option {
      display: inline-block;
      font-size: 12px;
      font-weight: 400;
    }
    .reservation-room-seleted_name {
      overflow: hidden;
      margin-top: 10px;
      h2 {
        text-transform: uppercase;
        font-size: 12px;
        font-weight: 600;
        margin-right: 80px;
        float: left;
        margin: 0;
        a {
          color: $color-hover;
          &:hover {
          }
        }
      }
      .reservation-amout {
        float: right;
        font-weight: bold;
        font-size: 14px;
      }
      &.has-package h2 {
        font-size: 16px;
        a {
        }
      }
    }
    .reservation-room-seleted_change {
      color: #898989;
      font-size: 12px;
      font-style: italic;
      text-decoration: underline;
      display: inline-block;
      margin-top: 7px;
      &:hover {
      }
    }
    .reservation-room-seleted_package {
      border-top: 1px solid #e4e4e4;
      margin-top: 15px;
      padding-top: 5px;
      ul {
        list-style: none;
        padding-left: 0;
        margin-bottom: 0;
        padding-bottom: 2px;
        margin-top: 5px;
        li {
          color: #333;
          font-size: 12px;
          overflow: hidden;
          font-weight: 400;
          padding: 5px 0;
          span:last-child {
            float: right;
            font-weight: 600;
            text-transform: uppercase;
          }
        }
        + ul {
          border-top: 1px solid #e4e4e4;
          padding-top: 8px;
          border-bottom: 1px solid #e4e4e4;
          padding-bottom: 8px;
        }
      }
    }
    .reservation-room-seleted_total-room {
      color: #333;
      font-size: 14px;
      font-weight: 600;
      text-transform: uppercase;
      padding-top: 15px;
      padding-bottom: 10px;
      .reservation-amout {
        float: right;
        color: $color-hover;
      }
    }
    &.reservation_disable {
      background-color: #f1f1f1;
      h6 {
        opacity: 0.4;
        font-size: 12px;
      }
      span {
        opacity: 0.3;
      }
    }
  }
  .reservation-room-seleted_current {
    overflow: hidden;
    color: #fff;
    padding: 15px 20px 13px 40px;
    background: $color-hover;
    h6 {
      margin-top: 0;
      margin-bottom: 10px;
      font-size: 14px;
      text-transform: uppercase;
      font-weight: 600;
      line-height: 1.428em;
      position: relative;
      color: #fff;
      &:before {
        content: "\f0da";
        font-family: "FontAwesome";
        left: -20px;
        position: absolute;
        font-size: 12px;
        font-weight: normal;
      }
    }
    span {
      font-size: 13px;
      font-weight: 400;
    }
    &.reservation-bg_blue {
      color: #fff;
    }
  }
  .reservation-room-seleted_total {
    padding: 20px 20px;
    overflow: hidden;
    font-size: 16px;
    font-weight: 600;
    background: $color-hover;
    color: #fff;
    label {
      font-weight: 600;
      text-transform: uppercase;
      margin: 0;
    }
    .reservation-total {
      font-size: 16px;
      font-weight: 600;
      float: right;
    }
  }
}

.reservation-sidebar {
  padding-top: 10px;
}

.reservation-heading {
  font-size: 16px;
  color: #333333;
  margin-top: 0px;
  line-height: 30px;
  text-transform: uppercase;
  padding: 12px 20px;
  font-weight: 600;
  text-align: center;
  border-bottom: 1px solid #e4e4e4;
  margin-bottom: 0;
}

.reservation-sidebar_availability {
  padding: 0 20px 20px 20px;
  margin-top: 30px;
  .reservation-heading {
    margin-left: -20px;
    margin-right: -20px;
  }
  .check_availability_title {
    margin-top: 20px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
  }
  .check_availability-field {
    margin-top: 15px;
    label {
      display: block;
      font-size: 12px;
      margin-bottom: 7px;
      text-transform: uppercase;
    }
    .awe-calendar-wrapper {
      width: 100%;
      .awe-calendar {
        background-color: #fff;
        border-width: 0;
        height: 30px;
        line-height: 30px;
        color: #898989;
        font-weight: 500;
      }
    }
    .bootstrap-select.btn-group.awe-select {
      width: 100%;
      .dropdown-toggle {
        background-color: #fff;
        height: 30px;
        border-width: 0;
        line-height: 30px;
        .filter-option,
        .caret {
          color: #898989;
          font-weight: 500;
        }
      }
      .dropdown-menu ul li a {
        padding: 7px 10px;
      }
    }
  }
  .check_availability_group {
    padding-left: 70px;
    position: relative;
    &:after {
      display: table;
      content: "";
      clear: both;
    }
    .label-group {
      position: absolute;
      left: 0;
      bottom: 5px;
      font-weight: bold;
      font-size: 12px;
      text-transform: uppercase;
    }
    .check_availability-field_group {
      margin-left: -4px;
      margin-right: -4px;
    }
    .check_availability-field {
      width: 50%;
      padding-left: 4px;
      padding-right: 4px;
      float: left;
    }
  }
}

.reservation_content {
  padding-bottom: 20px;
  margin-top: 45px;
  margin-left: 70px;
  @media (max-width: $screen-sm-max) {
    margin-left: 0;
  }
  &.bg-gray {
    background: #f1f1f1;
  }
  &:before,
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

.reservation-calendar_custom {
  .reservation-calendar_title {
    text-align: center;
    color: #333333;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 600;
    margin: 0;
    padding-top: 7px;
    padding-bottom: 16px;
    position: relative;
    border-bottom: 1px solid #e4e4e4;
    .reservation-calendar_corner {
      display: block;
      text-align: center;
      color: #cbcbcb;
      font-size: 35px;
      position: absolute;
      top: -20%;
      &:hover {
        color: #333333;
      }
      &.reservation-calendar_prev {
        left: 0;
      }
      &.reservation-calendar_next {
        right: 0;
      }
    }
  }
  .reservation-calendar_tabel {
    width: 100%;
    vertical-align: middle;
    text-align: center;
    table-layout: fixed;
    margin-top: 15px;
    font-family: "Hind", sans-serif;
    font-size: 12px;
    font-weight: 700;
    color: #333333;
    th {
      text-transform: uppercase;
      text-align: center;
      font-size: 12px;
      padding-top: 10px;
      padding-bottom: 10px;
    }
    td {
      background-color: #fff;
      background-clip: content-box;
      padding: 3px;
      &.active {
        background-color: $color-hover;
        a {
          small,
          span {
            color: #fff;
          }
        }
      }
      a {
        position: relative;
        display: block;
        padding-top: 90%;
        font-size: 12px;
        border: 2px solid transparent;
        &:hover {
          border: 2px solid $color-hover;
        }
        &:before {
          left: 0;
          right: 0;
          bottom: 0;
          top: 0;
          content: "";
          border: 2px solid transparent;
          position: absolute;
        }
        small {
          position: absolute;
          top: 5px;
          right: 10px;
          font-size: 12px;
          font-family: "Hind", sans-serif;
          color: #333333;
          font-weight: 500;
        }
        span {
          position: absolute;
          top: 50%;
          left: 50%;
          font-family: "Hind", sans-serif;
          color: #333333;
          font-weight: 500;
          -webkit-transform: translate(-50%, 3px);
          -moz-transform: translate(-50%, 3px);
          -ms-transform: translate(-50%, 3px);
          -o-transform: translate(-50%, 3px);
          @media (max-width: 480px) {
            font-size: 8px;
          }
        }
        &:hover:before {
        }
      }
      &.current-select {
        a {
          color: #fff;
        }
      }
    }
  }
}

.reservation-room {
  .reservation-room_item {
    margin-top: 45px;
    &:first-child {
      margin-top: 0;
    }
  }
}

.reservation-room_item {
  overflow: hidden;
  .reservation-room_name {
    text-transform: uppercase;
    font-weight: bold;
    margin: 0;
    font-size: 26px;
    @media (max-width: 767px) {
      font-size: 20px;
    }
    a {
      color: #333;
      &:hover {
        color: $color-hover;
      }
    }
  }
  .reservation-room_img {
    float: left;
    margin-right: 30px;
    width: 370px;
    margin-top: 25px;
    @media (min-width: 992px) and(max-width: 1200px) {
      float: none;
      width: 100%;
    }
    @media (min-width: 768px) and(max-width: 991px) {
      float: none;
      width: 100%;
    }
    @media (max-width: 767px) {
      float: none;
      width: 100%;
    }
    img {
      width: 100%;
    }
  }
  .reservation-room_text {
    overflow: hidden;
    margin-top: 25px;
    .reservation-room_desc {
      color: #333333;
      p {
        margin-bottom: 0;
        font-size: 14px;
        b {
        }
      }
      ul {
        padding-left: 18px;
        margin-bottom: 0;
        margin-top: 15px;
        li {
          padding: 3px 0;
          font-size: 14px;
          padding-left: 8px;
        }
      }
    }
    .reservation-room_view-more {
      display: inline-block;
      clear: both;
      margin-top: 10px;
      font-size: 12px;
      font-weight: 300;
      margin-bottom: 25px;
      text-decoration: underline;
      color: #333;
      font-style: italic;
      &:hover {
        color: $color-hover;
      }
    }
    .reservation-room_price {
      display: inline-block;
      vertical-align: middle;
      color: #898989;
      font-size: 14px;
      margin: 0;
      line-height: 1;
      .reservation-room_amout {
        font-weight: bold;
        color: #333333;
        font-size: 30px;
      }
    }
    .btn {
      margin-left: 35px;
      height: 35px;
      width: 124px;
      font-weight: 700;
      color: #333;
      background: transparent;
      border: 2px solid #333;
      line-height: 20px;
      &:hover {
        background: $color-hover;
        border: 2px solid $color-hover;
        color: white;
      }
    }
  }
  .reservation-room_package {
    clear: both;
    margin-top: 30px;
    .reservation-room_package-more {
      display: block;
      color: #333333;
      font-size: 12px;
      font-weight: bold;
      text-transform: uppercase;
      padding: 15px 30px;
      background-color: #f1f1f1;
      &:after {
        content: "\f067";
        font-family: "FontAwesome";
        float: right;
        font-size: 12px;
      }
      &[aria-expanded="true"] {
        &:after {
          content: "\f068";
        }
      }
    }
  }
}

.reservation-package_item {
  overflow: hidden;
  padding: 20px 30px;
  background-color: #fbfbfb;
  .reservation-package_img {
    float: left;
    width: 100px;
    margin-right: 30px;
    @media (max-width: 480px) {
      float: none;
      width: 100%;
    }
    img {
      width: 100%;
    }
  }
  .reservation-package_text {
    overflow: hidden;
    padding-right: 130px;
    position: relative;
    min-height: 72px;
    @media (max-width: 480px) {
      padding-right: 0;
      margin-top: 15px;
    }
    h4 {
      text-transform: uppercase;
      font-weight: bold;
      font-size: 14px;
      margin: 0;
      a {
        color: #333;
        &:hover {
          color: $color-hover;
        }
      }
    }
    p {
      color: #898989;
      font-size: 12px;
      margin-bottom: 0;
      margin-top: 10px;
      b {
      }
    }
    .reservation-package_book-price {
      position: absolute;
      right: 0;
      top: 0;
      @media (max-width: 480px) {
        position: initial;
        margin-top: 10px;
        .reservation-package_price {
          float: right;
        }
      }
      .reservation-package_price {
        color: #333333;
        text-align: right;
        .amout {
          font-weight: bold;
          font-size: 20px;
          line-height: 1;
        }
      }
      .btn {
        padding: 5px 10px;
        min-width: inherit;
        font-size: 10px;
        margin-top: 5px;
        color: #333;
        font-weight: 700;
        background: transparent;
        border: 2px solid #333;
        height: 30px;
        line-height: 15px;
        width: 100px;
        &:hover {
          color: #fff;
          background: $color-hover;
          border: 2px solid $color-hover;
        }
      }
    }
  }
  &:hover,
  &.current-select {
    background-color: #f1f1f1;
  }
}

.reservation-chosen-message {
  background-color: #f1f1f1;
  text-align: center;
  padding-bottom: 45px;
  padding-top: 80px;
  @media (max-width: $screen-xs-max) {
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 45px;
  }
  h4 {
    font-weight: bold;
    text-transform: uppercase;
    margin: 0;
    font-size: 20px;
    color: #333;
  }
  p {
    color: #898989;
    font-size: 14px;
    margin-top: 20px;
    margin-bottom: 0;
  }
  .btn {
    width: 150px;
    color: #fff;
    padding: 10px;
    height: 40px;
    margin-top: 30px;
    line-height: 17px;
  }
}

.reservation-billing-detail {
  max-width: 570px;
  @media (max-width: 1200px) {
    max-width: 100%;
  }
  .reservation-login {
    margin-bottom: 0;
    color: #898989;
    a {
      font-weight: 600;
      color: #232323;
      font-family: "Poppins", sans-serif;
      &:hover {
        color: $color-hover;
      }
    }
  }
  h4 {
    color: #000;
    text-transform: uppercase;
    margin-top: 30px;
    margin-bottom: 0;
    padding-bottom: 10px;
    font-weight: bold;
    letter-spacing: 5px;
    font-size: 30px;
    @media (max-width: 480px) {
      font-size: 24px;
    }
  }
  label {
    color: #232323;
    font-size: 12px;
    text-transform: uppercase;
    display: block;
    margin-top: 20px;
    margin-bottom: 10px;
    sup {
      color: #ff0000;
      font-size: 13px;
      line-height: 0px;
      top: 0px;
      left: 4px;
    }
    &.label-radio {
      .input-radio {
        margin: 0;
        display: inline-block;
        vertical-align: middle;
        margin-right: 15px;
      }
    }
  }
  .bootstrap-select.awe-select.btn-group {
    width: 100%;
    .btn {
      border: 2px solid #e4e4e4;
      font-weight: 400;
      height: 43px;
      -webkit-border-radius: 0;
      border-radius: 0;
      padding: 0px 20px;
      background: transparent;
      -webkit-box-shadow: none;
      box-shadow: none;
      outline: none;
      font-size: 14px;
      &:hover,
      &:focus {
        background-color: transparent;
        outline: none !important;
      }
      .filter-option,
      .caret {
        color: #333;
      }
    }
    .dropdown-menu {
      -webkit-border-radius: 0;
      border-radius: 0;
      li {
        &.selected {
          a {
            background-color: $color-hover;
            color: #fff;
          }
        }
        a {
          padding: 7px 20px;
          &:hover {
            background: $color-hover;
            color: #fff;
          }
        }
      }
    }
  }
  .input-text,
  .input-textarea {
    border: 2px solid #e4e4e4;
    width: 100%;
    font-size: 14px;
    color: #333333;
    font-weight: normal;
    height: 43px;
    -webkit-border-radius: 0;
    border-radius: 0;
    padding: 20px;
    &::placeholder {
      color: #333;
    }
  }
  .input-textarea {
    height: 85px;
  }
  .reservation-code {
    background-color: #333333;
    color: #ffffff;
    font-size: 14px;
    padding: 15px 20px;
    margin-top: 35px;
    a {
      color: #fff;
      font-weight: 600;
      &:hover {
        color: $color-hover;
      }
    }
  }
  .option-bank {
    list-style: none;
    padding-left: 0;
    margin-bottom: 0;
    padding-top: 10px;
    li {
      position: relative;
      padding-left: 30px;
      margin-top: 25px;
      a {
        padding-right: 6px;
        display: inline-block;
        @media (max-width: 580px) {
          img {
            max-width: 33px;
          }
        }
      }
      .label-radio {
        font-size: 14px;
        margin: 0 40px 0 0;
        display: inline-block;
        @media (max-width: 580px) {
          display: block;
        }
        .input-radio {
          position: absolute;
          top: 4px;
          left: 0;
        }
      }
      p {
        font-size: 11px;
        margin-bottom: 0;
        margin-top: 5px;
      }
      &:last-child .label-radio .input-radio {
        top: 7px;
      }
    }
  }
  .btn4 {
    font-weight: 700;
    font-size: 14px;
    margin-top: 40px;
    width: 170px;
    height: 48px;
    &:hover {
      border: 2px solid $color-hover;
    }
  }
}

/* 2.4.27 DATEPICKER */

.datepicker.dropdown-menu {
  font-family: $font-family-Poppins !important;
  z-index: 99 !important;
  min-width: 239px !important;
  border: none !important;
  -webkit-border-radius: 0 !important;
  border-radius: 0 !important;
  td {
    border: 1px solid transparent !important;
    -webkit-border-radius: 0;
    border-radius: 0;
    &.day {
      padding: 5px 10px;
    }
  }
}

.datepicker table tr td.day:hover,
.datepicker table tr td.day.focused {
  border: 1px solid $color-hover !important;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  background: transparent;
}

.datepicker table tr td.active.active {
  background: $color-hover !important;
  -webkit-border-radius: 0px;
  border-radius: 0px;
  border: 1px solid transparent !important;
}

.datepicker {
  padding: 0 !important;
}

.table-condensed {
  border-collapse: initial;
  border-spacing: 0px;
  .today {
    background-color: #f27235 !important;
    background-image: none !important;
    color: white !important;
    &:hover {
      background-color: #f27235 !important;
      color: white !important;
    }
  }
  thead {
    tr {
      .prev,
      .datepicker-switch,
      .next {
        background: #f27235 !important;
        -webkit-border-radius: 0;
        border-radius: 0;
        color: #fff;
        padding: 10px 0px;
      }
      .prev,
      .next {
        font-size: 0;
      }
      .datepicker-switch {
        text-transform: uppercase;
        font-family: "Poppins", sans-serif;
        font-weight: 600;
        vertical-align: middle;
      }
      .prev:before {
        content: "«";
        display: inline-block;
        font-family: Ionicons;
        font-size: 20px;
        vertical-align: middle;
      }
      .next:before {
        content: "»";
        display: inline-block;
        font-family: Ionicons;
        font-size: 20px;
        vertical-align: middle;
      }
      .dow {
        background: #c45723;
        -webkit-border-radius: 0;
        border-radius: 0;
        color: #fff;
        font-family: "Poppins", sans-serif;
        font-weight: 600;
        padding: 6px 0px;
        text-transform: uppercase;
        font-size: 12px;
      }
    }
  }
}

/* 2.4.28 PRODUCT */

.section-product-detail {
  padding-bottom: 100px;
  @media (max-width: 767px) {
    padding-bottom: 60px;
  }
}

.product-detail_book {
  background-color: #f1f1f1;
  .product-detail_total {
    padding: 20px 30px;
    text-align: center;
    h6 {
      font-size: 12px;
      font-weight: bold;
      margin-top: 10px;
      color: #333;
    }
    .price {
      margin-bottom: 0;
      margin-top: 10px;
      color: #898989;
      font-size: 18px;
      line-height: 1;
      .amout {
        font-weight: bold;
        font-size: 40px;
        color: #333;
      }
    }
  }
  .product-detail_form {
    border-top: 1px solid #e4e4e4;
    padding: 0 30px 27px 30px;
    .sidebar {
      margin: 0;
      .widget {
        margin-top: 25px;
      }
      .check_availability {
        padding: 0;
        border: none;
        .check_availability-field {
          margin-top: 23px;
          .btn {
            font-weight: 400;
            padding: 0px 12px;
          }
          i {
            color: #898989;
          }
        }
      }
    }
    .btn-product {
      width: 100%;
      font-weight: bold;
      font-size: 14px;
      padding: 10px;
      height: 45px;
      text-transform: uppercase;
      line-height: 20px;
      margin-top: 30px;
    }
  }
}

.product-detail_tab {
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid #e4e4e4;
  border-bottom: 1px solid #e4e4e4;
  padding-bottom: 20px;
}

.product-detail_tab-header {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;
  margin-right: 70px;
  @media (max-width: 992px) {
    margin-right: 0;
  }
  li {
    border-bottom: 2px solid #e4e4e4;
    position: relative;
    @media (max-width: 992px) {
      text-align: center;
      a {
        display: block !important;
      }
    }
    a {
      padding: 20px 25px 10px 0;
      color: #232323;
      text-transform: uppercase;
      font-weight: bold;
      position: relative;
      display: inline-block;
      &:before {
        height: 2px;
        content: "";
        width: 0;
        position: absolute;
        left: 0;
        bottom: -2px;
        background: $color-hover;
        @include transition-3;
      }
    }
    &.active a,
    &:hover a {
      color: $color-hover;
      &:before {
        width: 100%;
        @include transition-3;
      }
    }
  }
}

.product-detail_tab-content {
  padding-top: 15px;
  position: relative;
  &:before {
    border-left: 1px solid #e4e4e4;
    content: "";
    position: absolute;
    left: -30px;
    top: 0;
    bottom: 0;
    @media (max-width: 992px) {
      border: none;
    }
  }
}

.product-detail_amenities,
.product-detail_overview {
  font-size: 14px;
  font-weight: 400;
  color: #333;
  h5 {
    font-size: 18px;
    font-weight: bold;
    line-height: 25px;
    @media (max-width: $screen-xs) {
      font-size: 14px;
    }
  }
  p {
    font-size: 14px;
    margin-bottom: 0;
  }
  h6 {
    text-transform: uppercase;
    color: #333;
    font-weight: bold;
    font-size: 14px;
    margin-top: 37px;
  }
  ul {
    padding-left: 17px;
    margin-bottom: 0;
    margin-top: 5px;
    li {
      padding: 4px 0;
      padding-left: 10px;
    }
  }
}

.product-detail_package {
  .product-package_item {
    padding: 25px 0;
    border-bottom: 1px solid #e4e4e4;
    @media (max-width: 480px) {
      .text {
        padding-right: 0;
        .product-package_price {
          position: initial;
          .price {
            margin-top: 10px;
            vertical-align: middle;
            display: inline-block;
            margin-right: 5px;
          }
        }
      }
    }
    &:first-child {
      padding-top: 0;
    }
    &:last-child {
      border-bottom: 0;
    }
  }
}

.product-package_item {
  overflow: hidden;
  .img {
    float: left;
    width: 100px;
    margin-right: 30px;
    img {
      width: 100%;
    }
  }
  .text {
    overflow: hidden;
    padding-right: 170px;
    position: relative;
    min-height: 70px;
    h4 {
      text-transform: uppercase;
      font-weight: bold;
      font-size: 14px;
      margin: 0;
      a {
        color: #333;
        &:hover {
          color: $color-hover;
        }
      }
    }
    p {
      color: #333;
      font-size: 13px;
      line-height: 1.428em;
      margin-bottom: 0;
      margin-top: 10px;
      b {
      }
    }
    .product-package_price {
      position: absolute;
      right: 0;
      top: 0;
      .price {
        color: #898989;
        font-size: 12px;
        margin: 0;
        text-align: right;
        .amout {
          font-weight: 700;
          font-size: 20px;
          color: #333;
        }
      }
      .btn {
        margin-top: 10px;
        font-size: 10px;
        font-weight: bold;
        text-transform: uppercase;
        color: #333;
        background: transparent;
        border: 2px solid #333;
        height: 30px;
        line-height: 27px;
        width: 100px;
        padding: 0;
        &:hover {
          background: $color-hover;
          color: #fff;
          border: 2px solid $color-hover;
        }
      }
    }
  }
}

.product-detail_rates {
  padding-bottom: 20px;
  @media (max-width: 768px) {
    -ms-overflow-y: auto;
    overflow-y: auto;
    table {
      width: 720px !important;
      th {
        font-size: 11px !important;
      }
    }
  }
  table {
    width: 100%;
    th {
      font-size: 12px;
      font-family: "Montserrat", sans-serif;
      text-transform: uppercase;
      font-weight: bold;
      background-color: #f1f1f1;
      padding: 15px 20px;
      @media (min-width: 992px) and(max-width: 1200px) {
        font-size: 11px;
      }
      @media (min-width: 768px) and(max-width: 991px) {
        font-size: 11px;
      }
    }
    td {
      padding: 15px 20px;
      border-bottom: 1px solid #e4e4e4;
      vertical-align: top;
      h6 {
        text-transform: uppercase;
        font-size: 14px;
        font-family: "Hind", sans-serif;
        font-weight: bold;
      }
      ul {
        padding-left: 0;
        margin-bottom: 0;
        list-style: none;
        margin-top: 10px;
        li {
          padding: 2px 0;
          color: #898989;
          font-family: "Hind", sans-serif;
          font-weight: 500;
        }
      }
      .price {
        font-family: "Montserrat", sans-serif;
        font-size: 14px;
        margin-bottom: 0;
        font-weight: 400;
      }
    }
  }
}

.calendar_custom {
  max-width: 390px;
  @media (max-width: 768px) {
    max-width: 100%;
  }
  .calendar_title {
    text-align: center;
    color: #333;
    font-size: 14px;
    text-transform: uppercase;
    margin: 0;
    font-weight: 600;
    padding-top: 15px;
    padding-bottom: 15px;
    position: relative;
    border-bottom: 1px solid #e4e4e4;
    margin-left: 3px;
    margin-right: 3px;
    .calendar_corner {
      display: block;
      width: 24px;
      height: 24px;
      text-align: center;
      color: #cbcbcb;
      position: absolute;
      line-height: 0px;
      font-size: 35px;
      top: 5px;
      &:hover {
        color: #333;
      }
      &.calendar_prev {
        left: 0;
      }
      &.calendar_next {
        right: 0;
      }
    }
  }
  .calendar_tabel {
    width: 100%;
    vertical-align: middle;
    text-align: center;
    table-layout: fixed;
    th {
      text-transform: uppercase;
      text-align: center;
      color: #333;
      font-size: 12px;
      padding-top: 10px;
      padding-bottom: 10px;
      font-weight: bold;
      font-family: "Hind", sans-serif;
    }
    td {
      background-color: #fff;
      background-clip: content-box;
      padding: 3px;
      a {
        position: relative;
        display: block;
        padding-top: 100%;
        color: #333;
        font-size: 12px;
        &:before {
          left: 0;
          right: 0;
          bottom: 0;
          top: 0;
          content: "";
          border: 1px solid #333;
          position: absolute;
        }
        &:hover:before {
          border: 1px solid $color-hover;
        }
        small {
          position: absolute;
          top: 5px;
          right: 10px;
          font-size: 12px;
        }
        span {
          position: absolute;
          top: 60%;
          left: 50%;
        }
      }
      &.not-available {
        background-color: #333;
        a {
          color: #fff;
        }
      }
    }
  }
}

.product-detail_calendar-wrap {
  .calendar_status {
    margin-top: 30px;
    span {
      color: #333333;
      font-size: 12px;
      font-weight: 400;
      padding: 0 10px;
      &:before {
        width: 20px;
        height: 20px;
        border: 1px solid #333;
        display: inline-block;
        vertical-align: middle;
        content: "";
        margin-right: 10px;
      }
      &.not-available {
        &:before {
          background-color: #333;
        }
      }
    }
  }
}

.product-detail {
  padding-top: 30px;
  &.margin {
    margin-top: 15px;
    @media (max-width: 767px) {
      margin: 0;
    }
  }
  .product-detail_title {
    font-weight: bold;
    margin: 0;
    font-size: 22px;
    line-height: 1;
    text-transform: uppercase;
    @media (max-width: 767px) {
      font-size: 19px;
    }
  }
  .product-detail_item {
    margin-top: 30px;
  }
}

.product-detail_item {
  position: relative;
  .img {
    position: relative;
    img {
      width: 100%;
    }
  }
  .text {
    margin-top: 20px;
    h2 {
      font-size: 19px;
      font-weight: bold;
      margin: 0;
      text-transform: uppercase;
      @media (min-width: 992px) and(max-width: 1200px) {
        font-size: 17px;
      }
      a {
        color: #333;
        &:hover {
          color: $color-hover;
        }
      }
    }
    ul {
      color: #898989;
      margin-top: 10px;
      font-size: 14px;
      margin-bottom: 0;
      color: #333333;
      padding-left: 0;
      list-style: none;
      @media (min-width: 992px) and(max-width: 1200px) {
        font-size: 12px;
        li {
          i {
            font-size: 14px;
            width: 25px;
          }
        }
      }
      li {
        padding: 4px 0;
        i {
          font-size: 16px;
          width: 30px;
          display: inline-block;
        }
      }
    }
    .btn {
      font-size: 10px;
      margin-top: 20px;
      font-weight: bold;
      background: transparent;
      border: 2px solid #333333;
      color: #333;
      line-height: 19px;
      width: 100px;
      height: 35px;
      &:hover {
        background: $color-hover;
        border: 2px solid $color-hover;
        color: #fff;
      }
    }
  }
}

/*2.4.29 GUEST-BOOK  */

.section-guest-book {
  padding-top: 50px;
  padding-bottom: 60px;
  @media (max-width: 768px) {
    padding-top: 10px;
    padding-bottom: 50px;
  }
  .guest-book {
    .guest-book_head {
      background-size: cover;
      overflow: hidden;
      .text {
        max-width: 660px;
        width: auto;
        margin-left: auto;
        margin-right: auto;
        h2 {
          color: #333;
          font-weight: bold;
          font-size: 40px;
          text-transform: uppercase;
          letter-spacing: 5px;
          line-height: 52px;
          font-family: "Poppins", sans-serif;
          @media (max-width: 768px) {
            font-size: 30px;
            letter-spacing: 2px;
          }
          @media (max-width: 480px) {
            font-size: 20px;
            letter-spacing: 0px;
            line-height: 35px;
          }
        }
        p {
          color: #898989;
          font-size: 15px;
          line-height: 1.7em;
          margin-bottom: 0;
          margin-top: 20px;
          @media (max-width: $screen-xs) {
            margin-top: 0px;
          }
          @media (max-width: $screen-xs-max) {
            font-size: 14px;
          }
        }
        .btn {
          font-size: 14px;
          height: 42px;
          width: 220px;
          margin-top: 40px;
          font-weight: 700;
          line-height: 28px;
          @media (max-width: $screen-xs) {
            margin-top: 25px;
          }
          &:focus {
            color: $color-hover;
            background: transparent;
            border: 2px solid $color-hover;
            outline: none;
          }
        }
        .modal {
          overflow-x: hidden;
          overflow-y: scroll;
          &.in {
            .modal-dialog {
              -webkit-transform: translate(0, 25%);
              -ms-transform: translate(0, 25%);
              -o-transform: translate(0, 25%);
              transform: translate(0, 25%);
            }
          }
          .modal-dialog {
            max-width: 370px;
            margin: 0 auto;
            .modal-content {
              padding: 35px;
              border-radius: 0;
              text-align: initial;
              background: #f1f1f1;
              .modal-header {
                .close {
                  font-size: 40px;
                  position: absolute;
                  top: 0px;
                  right: 10px;
                  color: $color-hover;
                  opacity: 1;
                }
                .modal-title {
                  color: #333333;
                  font-size: 26px;
                  text-transform: uppercase;
                  font-weight: bold;
                  line-height: 1.3em;
                  text-align: center;
                  margin-top: -5px;
                  letter-spacing: 2px;
                }
              }
              .modal-header,
              .modal-body,
              .modal-footer {
                padding: 0;
                border: none;
                .btn {
                  width: 100%;
                }
                p {
                  margin-top: 15px;
                }
                .form-group {
                  margin-bottom: -9px;
                  margin-top: 30px;
                  .form-control {
                    height: 38px;
                    border-radius: 0;
                    margin-top: 20px;
                    border: none;
                    box-shadow: none;
                    color: #898989;
                  }
                }
              }
            }
          }
        }
      }
    }
    .guest-book_content {
      margin-top: 40px;
      @media (max-width: $screen-xs) {
        margin-top: 0px;
      }
      .guest-book_mansory {
        .item {
          padding: 0 15px;
        }
      }
      .page-navigation {
        @media (max-width: 480px) {
          .first {
            margin-right: 20px;
          }
          li {
            margin-right: 15px;
          }
          .last {
            margin-left: 5px;
            margin-right: 0;
          }
        }
      }
      .guest-book_item {
        position: relative;
        cursor: pointer;
        &:before,
        &:after {
          content: "";
          display: block;
          position: absolute;
          z-index: 1;
          pointer-events: none;
          top: -2px;
          right: -2px;
          bottom: -2px;
          left: -2px;
          -webkit-transform: scale(0);
          -moz-transform: scale(0);
          -ms-transform: scale(0);
          -o-transform: scale(0);
          @include transition;
        }
        &:before {
          border-right: 2px solid #e1bd85;
          border-bottom: 2px solid #e1bd85;
          -webkit-transform-origin: bottom right;
          -moz-transform-origin: bottom right;
          -ms-transform-origin: bottom right;
          -o-transform-origin: bottom right;
        }
        &:after {
          border-left: 2px solid #e1bd85;
          border-top: 2px solid #e1bd85;
          -webkit-transform-origin: top left;
          -moz-transform-origin: top left;
          -ms-transform-origin: top left;
          -o-transform-origin: top left;
        }
        &:hover {
          &:before,
          &:after {
            -webkit-transform: scale(1);
            -moz-transform: scale(1);
            -ms-transform: scale(1);
            -o-transform: scale(1);
          }
          .avatar {
            img {
              transform: scale(1.1, 1.1);
              @include transition;
            }
          }
        }
        margin-top: 30px;
        text-align: center;
        padding: 25px 35px 25px 35px;
        background: #f9f9f9;
        @media (max-width: 768px) {
          padding: 1px 5px 25px 5px;
          p {
            font-size: 13px;
          }
        }
        .avatar {
          width: 60px;
          height: 60px;
          margin-left: auto;
          margin-right: auto;
          margin-top: 20px;
          overflow: hidden;
          position: relative;
          border-radius: 100%;
          img {
            transform: scale(1, 1);
            @include transition;
          }
        }
        h2 {
          margin-top: 30px;
          font-size: 20px;
          text-transform: uppercase;
          color: #444444;
          font-weight: 600;
          font-family: "Poppins", sans-serif;
          letter-spacing: 4px;
        }
        p {
          color: #333;
          font-size: 15px;
          margin-top: 15px;
          margin-bottom: 0;
        }
        span {
          display: block;
          color: #898989;
          font-size: 14px;
          font-weight: 400;
          text-transform: capitalize;
          margin-top: 20px;
          b {
            color: #444444;
            font-weight: 600;
            text-transform: uppercase;
          }
        }
      }
    }
  }
}

@media only screen and (max-width: 767px) {
  .rooms {
    padding-top: 0;
  }
}
