body {
     overflow-x: hidden;
}

.cards-container {
     justify-content: space-evenly;
     /* height: 100%; */
     flex-wrap: wrap;
     overflow: hidden;
}

.character-info .btn {
     width: 100%;
}

.card {
     background-color: rgba(54, 171, 169, 0.468);
     height: 484px;
     width: 250px;
     margin: 40px 25px;
     text-align: center;
     color: bisque;
     border: none;
     border-radius: 10px;
     gap: 5px;
     z-index: 2;
     backdrop-filter: blur(1.5px);
     border-radius: 30px 5px;
}

.card img {
     border-radius: 10px 10px 0 0;
}

.name {
     font-size: 20px;
     /* font-weight: bold; */
}

.remove-btn {
     border-radius: 0 0 10px 10px;
}

.no-characters {
     font-size: 40px;
     color: var(--text-color);
}

@media screen and (max-width: 576px) {
     .no-characters {
          font-size: 20px;
          margin-top: 0px;
          
     }
}