@import url('https://fonts.googleapis.com/css2?family=Edu+QLD+Hand:wght@400..700&display=swap');

* {
  font-family: "Edu QLD Hand", cursive;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.navbar {
  width: 7%;
  height: 100vh;
  position: fixed;
  z-index: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-evenly;
  box-shadow: 0 0 2px 1px lightslategray;
  text-transform: capitalize;

  & a {
    text-decoration: none;
    padding: 4px 0;

    &:hover {
      border-bottom: 3px solid #E85D39;
      border-bottom-left-radius: 10px;
      transition: all 0.20s linear;
    }
  }

  &>.menu a {
    display: block;
    margin-top: 60px;
    /* width: 100%; */
    text-decoration: none;
  }

  /* hamberger button */
  /* 
  &>.show-menuBtn {
    position: absolute;
    top: 0%;
    right: 0%;

    & .fa-solid {
      font-size: 30px;
    }
  } */
}

/* index style */
.homeHeroSec {
  width: 93%;
  height: 100vh;
  float: right;
  display: flex;
  position: relative;
  background-image: url("image/man-2264825_1920.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  color: #ffffff;

  & ul {
    position: absolute;
    left: 15%;
    top: 20%;
    list-style: none;

    & li {
      margin-top: 40px;
    }

    & li:nth-child(1) p {
      color: #F05E3D;
      font-weight: 500;
    }

    /* heading */
    & li:nth-child(2) h1 {
      font-weight: 600;
      font-size: 60px;
      word-spacing: 10px;
    }

    & li:nth-child(3) {
      font-weight: 500;
      word-spacing: 10px;
      word-break: break-all;
      word-wrap: break-word;
    }

    /* button a */
    & li:nth-child(4) a {
      padding: 8px 35px;
      color: #fff;
      background-image: linear-gradient(to right, #EC4256, #F57433);
      text-decoration: none;
      font-weight: 600;
      text-transform: capitalize;
      word-spacing: 5px;
    }
  }
}

/* home < about story */
.about-storySec {
  width: 93%;
  height: 550px;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;

  &>.stori-video,
  .story-content {
    width: 40%;
    height: 400px;
  }

  &>.story-content {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px 40px;

    & ul {
      list-style: none;

      & li {
        margin-top: 10px;
      }

      & li:nth-child(1) h1 {
        font-weight: 600;
        font-size: 40px;
        word-spacing: 10px;
      }

      & li:nth-child(2),
      li:nth-child(3) {
        color: #6B6B6B;
        font-weight: 500;
      }

      & li:nth-child(4) a {
        padding: 8px 35px;
        color: #fff;
        background-image: linear-gradient(to right, #EC4256, #F57433);
        text-decoration: none;
        font-weight: 600;
        text-transform: capitalize;
        word-spacing: 5px;
      }

      & li:nth-child(4) {
        padding: 20px 0px;
      }
    }
  }
}

/* home < strategies yoga workout section */
.yoga-sec {
  width: 93%;
  height: 550px;
  float: right;
  display: flex;

  &>.yoga-img,
  .yoga-card {
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
  }

  &>.yoga-card {
    background-image: linear-gradient(to right, #1E1E1E 50%, #141414 50%);

    & .yogaCard1 {
      width: 50%;
      height: 50%;
      list-style: none;
      padding: 30px 50px;
      line-height: 2;

      & li:nth-child(2) h2 {
        font-weight: 700;
        color: #ffff;
        font-size: 20px;
      }

      /* paragraph */
      & li:nth-child(3) {
        font-weight: 500;
        color: #BDBDBD;
      }
    }
  }

  &>.yoga-img img {
    width: 100%;
    height: 100%;
  }
}

/* home < classes section unlimited  */
.classes-sec {
  width: 93%;
  height: auto;
  float: right;
  padding: 50px 30px;

  & h1 {
    text-align: center;
    padding: 40px 0px;
  }

  &>.classCon {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    justify-content: center;
    align-items: center;

    & .classCard:nth-child(2) {
      background-image: url("image/blog-2.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard:nth-child(3) {
      background-image: url("image/blog-3.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard:nth-child(4) {
      background-image: url("image/blog-5.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard:nth-child(5) {
      background-image: url("image/blog-2.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard:nth-child(6) {
      background-image: url("image/blog-1.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard:nth-child(7) {
      background-image: url("image/blog-2.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard:nth-child(8) {
      background-image: url("image/blog-3.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard:nth-child(9) {
      background-image: url("image/blog-5.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .classCard {
      background-image: url("image/man-2604149_1280.jpg");
      background-repeat: no-repeat;
      background-size: cover;
      width: 25%;
      height: 250px;
      display: flex;
      align-items: end;

      & .classfooter {
        width: 100%;
        height: 80px;
        background-color: rgba(0, 0, 0, 0.5);
        padding: 5px 30px;
        line-height: 1.5;
        color: #fff;
        text-transform: capitalize;

        & h2 {
          font-size: 20px;
        }

        & span .fa-solid {
          color: #E85D39;
          font-size: 14px;
          margin-right: 5px;
        }

        & span {
          font-size: 13px;
          font-weight: 500;
        }
      }

    }


  }
}

/* home < about expert trainers sec */

.expertTriner-sec {
  width: 93%;
  height: 700px;
  float: right;
  padding: 50px 0px;
  background-color: #F5F5F5;

  & h1 {
    text-align: center;
    padding: 20px 0px;
  }

  &>.expert-can {
    width: 100%;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;

    & .expert-card:nth-child(2) {
      background-image: url("image/trainer-2.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .expert-card:nth-child(3) {
      background-image: url("image/trainer-3.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
    }

    & .expert-card {
      width: 25%;
      height: 350px;
      background-image: url("image/trainer-1.jpg.webp");
      background-repeat: no-repeat;
      background-size: cover;
      position: relative;
      background-color: #fff;

      &:hover>.expert-footer {
        height: 250px;
        box-shadow: 0 5px 10px 4px #D9D9D9;
      }


      &>.expert-footer {
        transition: height 0.40s linear;
        width: 80%;
        height: 90px;
        position: absolute;
        text-align: center;
        left: 50%;
        top: 120%;
        transform: translate(-50%, -120%);
        background-color: #fff;
        overflow: hidden;
        padding: 0px 10px;
        box-shadow: 0 2px 3px 1px #D9D9D9;

        & ul {
          list-style: none;
          line-height: 2;

          & li:nth-child(1) h2 {
            font-size: 20px;
          }

          & li:nth-child(2) p {
            color: #F05E3D;
            font-weight: 500;
            margin-top: 10px;
          }

          & li:nth-child(3) {
            color: #6B6B6B;
            font-weight: 400;
          }

          /* hover icon */
          & li:nth-child(4) .fa-brands:hover {
            color: #E85D39;

            /* background-image: linear-gradient(to right, #EC4256, #F57433) ; */

          }
        }

        & ul li:nth-child(4) .fa-brands {
          font-size: 18px;
          margin-left: 15px;
          cursor: pointer;
          transition: all 0.30s linear;
        }
      }
    }


  }
}

/* home < stories section  */
.story-sec {
  width: 93%;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 50px 0px;



  &>.story-slide {
    overflow: hidden;

    & h1 {
      text-align: center;
      font-weight: 600;
      font-size: 35px;
      word-spacing: 10px;
      text-transform: uppercase;
    }

    width: 80%;
    position: relative;

    & .story-card {
      width: 300%;
      display: flex;
      flex-wrap: nowrap;
      justify-content: start;
      align-items: center;
      padding: 0px 20px;


      & .storyCardSlide {
        text-align: center;
        list-style: none;
        line-height: 1.8;
        padding: 20px;
      }

      & .storyCardSlide li:nth-child(1) {
        font-size: 18px;
        color: #000;
        font-weight: 500;
      }

      & .storyCardSlide li:nth-child(3) h2 {
        font-size: 20px;
        text-transform: capitalize;
      }

      & .storyCardSlide li:nth-child(4) {
        color: #E85D39;
        text-transform: capitalize;
      }

      & .storyCardSlide li:nth-child(2) {
        margin-top: 40px;
      }

      & .storyCardSlide li:nth-child(2) img {
        width: 100px;
        border-radius: 50%;
        outline-style: dotted;
        outline-color: tomato;
        outline-width: 4px;
      }
    }

    & .story-slideBtn {
      width: 100%;
      display: flex;
      top: 50%;
      transform: translateY(-50%);
      position: absolute;
      justify-content: space-between;

      & .leftbtn,
      .rightbtn .fa-solid {
        font-size: 30px;
        cursor: pointer;
      }
    }

  }


}

/* about get training sec */
.training-about{
  width: 93%;
  height: 500px;
  float: right;
  display: flex;
  justify-content: center;
  overflow: hidden;
  background-image: url("./image/weights-3942914_1280.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  color: #fff;
  background-position: 0 -100px;
  padding: 300px 0px;

  &> .training_card {
    width: 50%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;

    & ul {
      padding-left: 130px;
      line-height: 3;
      list-style: none;

      & li:nth-child(1) h1 {
        font-weight: 600;
        font-size: 35px;
        word-spacing: 10px;
        text-transform: uppercase;
      }

      & li:nth-child(2) p {
        font-weight: 500;
        word-spacing: 5px;
      }
    }
  }

  &> .training_card:nth-child(1) ul li:nth-child(3) a {
    padding: 8px 35px;
    color: #fff;
    background-image: linear-gradient(to right, #EC4256, #F57433);
    text-decoration: none;
    font-weight: 600;
    text-transform: capitalize;
    word-spacing: 5px;
  }

  &> .training_card:nth-child(1) ul li:nth-child(3) {
    margin-top: 40px;
  }

  &> .training_card:nth-child(2) img {
    width: 400px;
    margin-left: -200px;
  }

}

/* index get training sec */



























/* home < membership plan */
.membership-con {
  width: 93%;
  height: 550px;
  float: right;

  & h1 {
    text-align: center;
    padding: 20px 0px;
  }

  &>.member-box {
    display: flex;
    justify-content: center;
    gap: 25px;

    &>.member-card {
      width: 25%;
      text-align: center;
      box-shadow: 0 0 20px 1px slategrey;
      background-color: #fff;
      z-index: 3;
    }

    &>.member-card ul {
      list-style: none;
      line-height: 2.7;
      padding-bottom: 40px;

      & li:nth-child(even) {
        color: #000000;
        font-weight: 500;
      }

      & li:nth-child(odd) {
        color: #6B6B6B;
      }

      & li:nth-child(2) sub {
        color: #6B6B6B;
        font-size: 16px;
      }

      & li:nth-child(2) {
        color: #E85D39;
        font-size: 30px;
        font-weight: 600;
        margin-top: 20px;
      }
    }

    &>.member-card ul li:nth-child(1)::after {
      content: "";
      position: absolute;
      border-width: 10px;
      border-style: groove;
      border-color: #F46B3B transparent transparent transparent;
      left: 45%;
      top: 100%;
      transform: translate(-45% -100%);
    }

    &>.member-card ul li:nth-child(1) {
      position: relative;
      padding: 10px 0px;
      background-image: linear-gradient(to right, #EC4256, #F57433);
      color: #ffff;
      text-transform: uppercase;
      font-size: 15px;
    }

    &>.member-card ul li:nth-child(11) a {
      padding: 8px 35px;
      text-decoration: none;
      font-weight: 600;
      text-transform: capitalize;
      word-spacing: 5px;
      /* how to add gradient */
      border: 1px groove transparent;
      border-image: linear-gradient(to right, #ED4851, #F47036) 8 stretch;


      color: #000000;
      transition: all 0.30s linear;

      &:hover {
        background-image: linear-gradient(to right, #ED4851, #F47036);
        color: #ffff;
        border: transparent;
      }
    }


  }

}

/* home < classes register form sec */

.register-con {
  width: 93%;
  float: right;
  padding: 250px 10px 100px 10px;
  display: flex;
  justify-content: center;
  background-color: #F5F4F4;

  &>.regForm {
    box-shadow: 0 0 8px 0 slategrey;
  }

  &>.regForm:nth-child(1) {
    width: 50%;
    height: 400px;
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 0px 140px;
    background-color: #fff;

    & form ul li {
      line-height: 4;
      list-style: none;
    }

    & form ul li:nth-child(3) input {
      width: 100%;
      cursor: pointer;
      background-image: linear-gradient(to right, #EC4256, #F57433);
      padding: 8px 0;
      text-transform: capitalize;
      font-weight: 500;
      color: #ffff;
      border: transparent;
      font-size: 16px;
    }

    & p {
      font-size: 15px;
      font-weight: 500;
      color: #6B6B6B;
      word-spacing: 1px;
    }


  }



  &>.regForm:nth-child(2) {
    width: 20%;
    height: 400px;

    & img {
      width: 100%;
      height: 100%;
    }
  }
}

/* home < latest blog sec */

.latest-blog {
  width: 93%;
  float: right;
  padding: 70px;

  & h1 {
    font-weight: 600;
    font-size: 35px;
    word-spacing: 10px;
    text-transform: uppercase;
    text-align: center;
    padding: 30px 0;
  }

  &>.blgCardCon {
    display: flex;
    justify-content: center;
    gap: 25px;
    flex-wrap: wrap;

    &>.blog-card {
      width: 350px;

      & ul li:nth-child(2) {
        color: #6B6B6B;

        & span {
          color: #E85D39;
          margin-left: 10px;
        }
      }
    }

    &>.blog-card ul li {
      list-style: none;
    }

    &>.blog-card img {
      width: 350px;
    }
  }
}

/* home < 7 dayd trial sec */
.trial-sec {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 93%;
  float: right;
  /* padding: 50px; */

  &>.trialCard {
    width: 50%;
    height: 350px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;

    & ul li:nth-child(1) h5 {
      color: #E85D39;
      text-transform: uppercase;
      font-weight: 500;
      word-spacing: 4px;
    }

    & ul li:nth-child(2) h2 {
      font-size: 40px;
    }

    & ul li:nth-child(4) a {
      padding: 8px 35px;
      color: #fff;
      background-image: linear-gradient(to right, #EC4256, #F57433);
      text-decoration: none;
      font-weight: 600;
      text-transform: capitalize;
      word-spacing: 5px;
    }
  }

  &>.trialCard:nth-child(1) {
    background-image: url("image/woman-6888634_1280.jpg");
    background-repeat: no-repeat;
    background-size: cover;
  }

  &>.trialCard:nth-child(2) {
    background-image: url("image/body-8049570_1280.jpg");
    background-repeat: no-repeat;
    background-size: cover;
  }

  &>.trialCard:nth-child(1) ul li {
    list-style: none;
    line-height: 2.9;
  }

  &>.trialCard:nth-child(1) ul li:nth-child(4) {
    padding: 10px 30px;
  }

  &>.trialCard:nth-child(2) ul li {
    list-style: none;
    line-height: 2.9;
  }

  &>.trialCard:nth-child(2) ul li:nth-child(4) {
    padding: 10px 30px;
  }
}

/* nav footer  section */
.navFooterPage {
  width: 93%;
  float: right;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 50px 0px;
  gap: 40px;
  background-color: #000;
  color: #fff;

  &>.navFooter {
    width: 85%;
    border: inherit;
  }

  &>.navFooter:nth-child(1) {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* gap: 20px; */
    list-style: none;

    & li h4 {
      color: #E85D39;
    }

    & ul li {
      line-height: 3;
    }


  }

  &>.navFooter:nth-child(2) {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 20px;
    background-image: url("../gym/image/abs-1203880_1280.jpg");
    background-repeat: no-repeat;
    background-position: -150px -400px;
    padding: 20px 0px;
    list-style: none;
    color: black;

    & li:nth-child(1) h2 {
      color: #E85D39;
    }

    & li:nth-child(2) input {
      vertical-align: middle;
      width: 200px;
      height: 40px;
      /* text-transform: capitalize; */
      padding-left: 10px;
    }

    & li:nth-child(2) button {
      vertical-align: middle;
      width: 60px;
      height: 40px;
      line-height: 40px;
      font-size: 20px;
      color: #ffffff;
      background-image: linear-gradient(to right, #EC4256, #F57433);
      cursor: pointer;
      border: transparent;
    }
  }

  &>.navFooter:nth-child(3) {
    display: flex;
    align-items: center;
    justify-content: space-around;
    gap: 20px;
    list-style: none;

    & li:nth-child(1) span:hover {
      color: #E85D39;
      cursor: pointer;
    }

    & li:nth-child(2) a,
    li:nth-child(3) a {
      color: #fff;
      text-decoration: none;
    }

    & li:nth-child(4) .fa-brands {
      font-size: 20px;
      border-radius: 50%;
      width: 40px;
      height: 40px;
      line-height: 40px;
      color: #ffff;
      background-color: rgb(43, 44, 45);
      margin-right: 3px;

      &:hover {
        background-image: linear-gradient(to right, #EC4256, #F57433);

      }
    }
  }
}

/* about home < back sec */
.aboutHomeSec {
  width: 93%;
  height: 300px;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("./image/blog-3.jpg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;

  & ul {
    list-style: none;
    text-align: center;

    & li:nth-child(1) h1 {
      font-weight: 600;
      font-size: 50px;
      word-spacing: 10px;
      text-transform: uppercase;
    }

    & li:nth-child(2) a {
      color: #fff;
      text-transform: capitalize;
      font-weight: 500;
      text-decoration: none;
    }

    & li:nth-child(2) span {
      color: #aaa8a8;
      text-transform: capitalize;
      font-weight: 500;
    }
  }
}

/* blog home < back sec */
.blogHomeSec {
  width: 93%;
  height: 300px;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("./image/blog-2.jpg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;

  & ul {
    list-style: none;
    text-align: center;

    & li:nth-child(1) h1 {
      font-weight: 600;
      font-size: 50px;
      word-spacing: 10px;
      text-transform: uppercase;
    }

    & li:nth-child(2) a {
      color: #fff;
      text-transform: capitalize;
      font-weight: 500;
      text-decoration: none;
    }

    & li:nth-child(2) span {
      color: #aaa8a8;
      text-transform: capitalize;
      font-weight: 500;
    }
  }
}

/* class home < back sec*/
.classHomeSec {
  width: 93%;
  height: 300px;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("./image/man-2604149_1280.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;

  & ul {
    list-style: none;
    text-align: center;

    & li:nth-child(1) h1 {
      font-weight: 600;
      font-size: 50px;
      word-spacing: 10px;
      text-transform: uppercase;
    }

    & li:nth-child(2) a {
      color: #fff;
      text-transform: capitalize;
      font-weight: 500;
      text-decoration: none;
    }

    & li:nth-child(2) span {
      color: #aaa8a8;
      text-transform: capitalize;
      font-weight: 500;
    }
  }
}

/* contact home < back sec */
.contactHomeSec {
  width: 93%;
  height: 300px;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("./image/blog-3.jpg.webp");
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;

  & ul {
    list-style: none;
    text-align: center;

    & li:nth-child(1) h1 {
      font-weight: 600;
      font-size: 50px;
      word-spacing: 10px;
      text-transform: uppercase;
    }

    & li:nth-child(2) a {
      color: #fff;
      text-transform: capitalize;
      font-weight: 500;
      text-decoration: none;
    }

    & li:nth-child(2) span {
      color: #aaa8a8;
      text-transform: capitalize;
      font-weight: 500;
    }
  }
}

/* gallery home < back sec */
.galleryHomeSec {
  width: 93%;
  height: 300px;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  background-image: url("./image/man-2264825_1920.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;

  & ul {
    list-style: none;
    text-align: center;

    & li:nth-child(1) h1 {
      font-weight: 600;
      font-size: 50px;
      word-spacing: 10px;
      text-transform: uppercase;
    }

    & li:nth-child(2) a {
      color: #fff;
      text-transform: capitalize;
      font-weight: 500;
      text-decoration: none;
    }

    & li:nth-child(2) span {
      color: #aaa8a8;
      text-transform: capitalize;
      font-weight: 500;
    }
  }
}



/* about < auto number animation  */
.autoNumAnime {
  width: 93%;
  height: 300px;
  height: 300px;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;

  & ul {
    width: 80%;
    height: 250px;
    background-image: linear-gradient(to right bottom, #EC3E59, #F67732);
    display: flex;
    gap: 200px;
    list-style: none;
    justify-content: center;
    align-items: center;

    & li h1 {
      font-size: 60px;
    }
  }
}

/* about < award section */
.award-sec {
  width: 93%;
  height: auto;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 50px;

  &>.award {
    width: 50%;
    height: 400px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: 2.5;

    & ul {
      list-style: none;

      & li:nth-child(1) h1 {
        font-weight: 600;
        font-size: 35px;
        word-spacing: 10px;
        text-transform: uppercase;
      }

      & li:nth-child(2),
      li:nth-child(3) {
        color: #6B6B6B;
        font-weight: 500;
      }
    }
  }

  &>.award:nth-child(1) {
    padding: 0 5px 0 90px;
  }
}

/* classes timetable */
.timetableSec {
  width: 93%;
  height: auto;
  float: right;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 40px;
  padding: 50px 0px;

  & h1 {
    text-align: center;
    text-transform: uppercase;
    word-spacing: 4px;
  }

  & ul {
    text-align: center;
    list-style: none;

    & li:nth-child(1) button:nth-child(1) {
      color: #E85D39;
    }

    & button {
      border: none;
      background-color: transparent;
      cursor: pointer;
      margin: 0 30px;
      text-transform: uppercase;
      font-size: 13px;
    }
  }

  &>table {
    border: 1px solid #F0F0F0;
    border-collapse: collapse;
    box-shadow: 0 0 2px 0 #d1cfcf;


    & td {
      width: 9%;
      height: 90px;
      border: 1px solid #F0F0F0;
      text-align: center;
      padding: 4px;
    }

    & th {
      padding: 15px 0px;
      background-color: #F0F0F0;
      text-transform: uppercase;
      font-size: 13px;
    }

    /* table td hover */
    & .hover {
      padding: 15px 4px;

    }

    & .hover:hover {
      background-image: linear-gradient(to right, #EC4256, #F57433);
      /* background-color: transparent; */
      color: #fff;
      transition: all 2s;



      & h4,
      p,
      span {
        color: #ffff;
      }
    }


    & tr:nth-child(2) h4,
    tr:nth-child(3) h4,
    tr:nth-child(4) h4,
    tr:nth-child(5) h4,
    tr:nth-child(6) td h4 {
      color: #E85D39;
      text-transform: uppercase;
      font-size: 13px;

    }

    & tr:nth-child(2) span,
    tr:nth-child(3) span,
    tr:nth-child(4) span,
    tr:nth-child(5) span,
    tr:nth-child(6) td span {
      text-transform: capitalize;
      font-size: 13px;
      color: #6B6B6B;
      font-weight: 500;
    }
  }



}

/* gallery sec */
.gallery-sec {
  width: 93%;
  height: auto;
  float: right;
  display: flex;
  justify-content: center;
  flex-direction: column;

  & ul {
    padding: 50px 0px;
    list-style: none;
    display: flex;
    justify-content: center;
    gap: 40px;

    & li:nth-child(1) button {
      color: #E85D39;
    }



    &>li button {
      cursor: pointer;
      background-color: transparent;
      border: none;
      font-weight: 600;
      text-transform: uppercase;
      font-size: 15px;
      word-spacing: 5px;
    }
  }

  &>.gallery-grid {
    width: 80%;
    height: auto;
    border: inherit;
    padding: 30px;
    margin: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 30px;

    & .img:nth-child(1),
    .img:nth-child(6) {
      width: 500px;
    }

    & .img:nth-child(1) img,
    .img:nth-child(6) img {
      width: 100%;
      height: 100%;
    }

    & .img:nth-child(2) img {
      width: 100%;
      height: 100%;
    }

    & .img:nth-child(4) img,
    .img:nth-child(5) img {
      width: 100%;
      height: 100%;
    }

    & .img {
      width: 250px;
      height: 400px;
    }

    & .img:nth-child(3) {
      display: flex;
      flex-direction: column;
      gap: 25px;

      & .mini {
        width: 100%;
        height: 50%;

        & img {
          width: 100%;
          height: 100%;
        }
      }
    }

  }
}


/* contact < map location */
.map-con {
  width: 93%;
  height: 600px;
  float: right;
}

/* contact <  comment sec */

.comment-sec {
  width: 93%;
  height: auto;
  float: right;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 50px;
  padding: 50px 0px;

  &>.comment h3 {
    font-size: 20px;
    text-transform: uppercase;
    font-weight: 700;
    padding-bottom: 20px;
  }

  & .comment:nth-child(2) ul {
    list-style: none;
    line-height: 5;
  }

  & .comment:nth-child(1) ul li h4 {
    color: #6B6B6B;
  }

  & .comment:nth-child(1) ul li {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;


    & .fa-solid {
      font-size: 30px;
      border: 1px solid rgb(188, 179, 179);
      border-radius: 50%;
      width: 60px;
      height: 60px;
      line-height: 60px;
      color: #E85D39;
    }
  }

  & .comment:nth-child(2) form ul li:nth-child(1) input {
    width: 300px;
    height: 40px;
    padding-left: 20px;
    font-weight: 500;
    word-spacing: 10px;
  }

  /* text area */
  & .comment:nth-child(2) form ul li:nth-child(2) textarea {
    width: 600px;
    /* height: 150px; */
    font-weight: 500;
    word-spacing: 5px;
  }

  & .comment:nth-child(2) form ul li:nth-child(3) button {
    padding: 8px 35px;
    color: #fff;
    background-image: linear-gradient(to right, #EC4256, #F57433);
    text-decoration: none;
    font-weight: 600;
    text-transform: capitalize;
    word-spacing: 5px;
    cursor: pointer;
    border: transparent;


  }
}