@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
body {
      line-height: 1.7;
      text-align: center;
      margin: 0;
      /* padding: 40px 20px; */
      max-width: auto;
    }
    h1, h2, h3 {
      color: #222;
    }

    h2, h3{
        text-align: left;
    }
    h1 {
        text-align: center;
    }
    h3{
        color: green;
    }

    .carousel-container {
      position: relative;
      overflow: hidden;
      max-width: 300px;
      margin: auto;
    }

    .carousel-track {
      display: flex;
      transition: transform 0.6s ease-in-out;
    }

    .carousel-slide {
      min-width: 100%;
      box-sizing: border-box;
    }

    .carousel-slide img {
      width: 300px;
      height: auto;
      display: block;
    }

    .carousel-button {
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      background: rgba(0, 0, 0, 0.5);
      color: white;
      border: none;
      font-size: 2rem;
      padding: 10px;
      cursor: pointer;
      z-index: 10;
    }

    .carousel-button.prev {
      left: 10px;
    }

    .carousel-button.next {
      right: 10px;
    }

    @media (hover: none) {
      .carousel-button {
        display: none;
      }
    }
    li {
        text-align: left;
    }