.hover-container {
      position: relative;
      display: block;
      margin-bottom: 40px;
      margin: 0;
      padding: 0;
    }

    .hover-image-box {
      display: none;
      margin-top: 10px;
      text-align: center;
        margin: 0;
        padding: 0;
    }

    .hover-image-box img {
      max-width: 600px;
      border: 1px solid #ccc;
      box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    }

    .hover-container:hover .hover-image-box {
      display: block;
    }

    /* .hover-text {
      background-color: #f8f8ff;
      padding: 10px;
      border-radius: 6px;
    } */

    /* .caption {
      font-size: 0.9em;
      color: #555;
      margin-top: 5px;
    } */

    @media screen and (max-width: 768px) {
        .hover-image-box img {
            max-width: 400px;
        }
    }