.thumbnail-image {
    width: 150%;
    aspect-ratio: 4 / 3; /* Maintain the aspect ratio */
    object-fit: cover;
    border-radius: 0.625rem; /* 10px */
}

.card {
    padding: 0.9375rem; /* 15px */
    transition: transform 0.3s ease;
}

.card:hover {
    transform: translateY(-0.3125rem); /* -5px */
}

.search-container {
    margin: 3.125rem auto; /* 50px */
    max-width: 43.75rem; /* 700px */
}

.search-bar {
    display: flex;
    align-items: center;
    border-radius: 1.875rem; /* 30px */
    padding: 0.3125rem 0.9375rem; /* 5px 15px */
    background-color: #fff;
    box-shadow: -0.625rem 0.625rem 0.125rem rgba(255, 134, 200, 0.97); /* -10px 10px 2px */
}

.search-bar input {
    border: none;
    outline: none;
    flex-grow: 1;
    font-size: 1.25rem; /* 20px */
    color: #333;
    border-radius: 1.875rem; /* 30px */
    margin: 0.9375rem; /* 15px */
}

.search-bar input::placeholder {
    color: #aaa;
    font-size: 1.25rem; /* 20px */
}

.search-bar button {
    border: none;
    background: none;
    outline: none;
    padding: 0.3125rem; /* 5px */
    cursor: pointer;
    color: #ff69b4;
}

.search-bar button:hover {
    color: #ff1493;
}

/* Remove grey hover effect for dropdown items */
.button-none {
    background-color: transparent !important; /* Remove background color */
    color: inherit !important; /* Keep the text color unchanged */
}