/* main section image */
#x1se1{height: 400px;}
/* galley  */
.x1a1{transition: 0.3s;color: white;background: #6ab165;margin: 10px;padding: 15px 0;display: inline-block;width: 22%;text-align: center;}
.x1a1:hover{background: #57840d;transition: 0.3s;}
#x1d2{display: flex;justify-content: space-evenly;margin: 30px 0;}
.x1d4{display: grid;grid-template-columns: repeat(4, 1fr);gap: 10px;}
.x1i1{width: 100%;}

/* accommodation and virtual tour */
#x1d5{border: 1px solid #efefef;padding: 30px;margin-top: -120px;margin-bottom: 70px;background: white;}
#x1d6{display: flex;flex-direction: column;align-items: center;margin: 30px 0;}
.x1p5{color: var(--color-4);padding: 30px 0;line-height: 24px;}
.x1p6{padding: 0 0 30px;}
#x1s5{background: black;height: 4px;padding: 0;width: 130px;}

/* click image view and hover effects */
.x1d10{margin: 5px;overflow: hidden;height: max-content;position: relative;}
.x1i10{width: 100%;transition: all 0.3s ease-in-out;}
.x1i11{width: 25%;}
.x1d10:hover .x1i10{transform: scale(1.3);transition: all 0.3s ease-in-out;}
.x1d10:hover .x1d11{transition: all 0.3s ease-in-out;opacity: 1;}
.x1d11{width: 100%;height: 100%;background: #57840d80;transition: all 0.3s ease-in-out;position: absolute;z-index:1 ;text-align: center;display: flex;justify-content: center;opacity: 0;}


/* slideshow css */
.preview-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
  }
  
  .preview-container img {
    max-width: 80%;
    max-height: 80%;
    object-fit: contain;
  }
  
  .close {
      position: absolute;
      top: 10px;
      right: 10px;
      font-size: 40px;
      color: #fff;
      cursor: pointer;
  }
  #slideshow-container {
      display: none;
      position: fixed;
      z-index: 9999;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background-color: rgba(0, 0, 0, 0.8);
  }
  
  .slideshow {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100%;
      position: relative;
  }
  
  .slideshow-image {
      max-width: 90%;
      max-height: 90%;
      object-fit: contain;
      opacity: 1;
      transition: opacity 0.2s ease;
  }
  .slideshow-image.fade-out {
    opacity: 0;
  }
  
  .prevv,.nextt {position: absolute;top: 50%;transform: translateY(-50%);font-size: 30px;color: #fff;cursor: pointer;}
  .prevv {left: 20px;}
  .nextt {right: 20px;}
  


  /* media query */
  @media screen and (max-width:800px) {
    .x1d4{grid-template-columns: repeat(2, 1fr);}
    .x1a1{width: 45%;}
    #x1d2{flex-wrap: wrap;margin: 0 0 30px;}
    }

  @media screen and (max-width:500px) {
    .x1d4{grid-template-columns: repeat(1, 1fr);}
    #x1d5{margin-top: 0;padding: 15px;margin-bottom: 0;}
    #x1se1{height: 250px;}
    .x1a1{width: 100%;}
    .x1p5{padding: 20px 0;}
    }