/* ChatGPT 3.5 */

      .carousel {
        position: relative;
        width: 100%;
        height: 100%;
        overflow: hidden;
      }

      .carousel-image {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        transition: opacity 1s ease-in-out;
      }

      .carousel-image.active {
        opacity: 1;
      }

      .carousel-controls {
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        justify-content: center;
        align-items: center;
      }

      .carousel-control {
        margin: 0 10px;
        padding: 10px 20px;
        border: none;
        border-radius: 20px;
        background-color: #fff;
        color: #333;
        font-size: 16px;
        cursor: pointer;
        transition: background-color 0.3s ease-in-out;
      }

      .carousel-control:hover {
        background-color: #333;
        color:white;
      .carousel-control:focus {
        outline: none;
      }