body {
background-color:black;
font-family:sans-serif;
margin:0;
overflow:hidden;
padding:0
}
    .carousel-container {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin-top: 2rem;
    }
    .carousel-banner {
      font-weight: bold;
      margin-bottom: 1rem;
    }
    .carousel {
      display: flex;
      align-items: center;
      gap: 1rem;
    }
    .arrow {
      font-size: 2rem;
      cursor: pointer;
      color: white;
      user-select: none;
    }
    .card {
      min-width: 150px;
      padding: 1rem;
      border-radius: 8px;
      text-align: center;
      background: #f0f0f0;
      opacity: 0.5;
      transition: opacity 0.3s, transform 0.3s;
    }
    .card.active {
      background: #e0f0ff;
      opacity: 1;
      transform: scale(1.05);
    }
    .description {
      background: lightgreen;
      padding: 1rem;
      border-radius: 8px;
      box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    }
    .description h2 {
      margin-top: 0;
    }
    ul {
      list-style: none;
      padding: 0;
    }
    li {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      margin-bottom: 0.5rem;
    }
    .done {
      color: green;
      text-decoration: line-through;
    }
    .icon {
      font-size: 1.2em;
    }
    .navbar {
background-color:var(--bg-light);
overflow:hidden;
width:100%
}

.navbar a {
align-content:center;
color:lightgreen;
float:left;
font-size:17px;
height:34px;
overflow:hidden;
padding:0;
text-align:center;
text-decoration:none;
width:20%
}

.navbar a.active {
background-color:black;
color:lightgreen
}

@media screen and (max-width: 500px) {
.navbar a {
display:block;
float:none;
text-align:left;
width:100%
}
}

#container {
display:flex;
gap:2rem;
padding:1rem
}
.dropdown {
float:right;
overflow:hidden
}

.dropdown .dropbtn {
background-color:inherit;
border:none;
color:lightgreen;
font-family:inherit;
font-size:16px;
height:34px;
margin:0;
outline:none;
width:40px
}

.navbar a:hover,.dropdown:hover .dropbtn {
background-color:darkolivegreen
}

.dropdown-content {
background-color:black;
box-shadow:0 8px 16px 0 lightgreen;
display:none;
position:absolute;
right:0px;
width:100px;
z-index:1
}

.dropdown-content a {
background-color:var(--bg-light);
color:lightgreen;
display:block;
float:left;
padding-right:6px;
text-align:center;
text-decoration:none;
width:100%
}

.dropdown-content a:hover {
background-color:darkolivegreen;
border-width:1px
}

.dropdown:hover .dropdown-content {
display:block
}