/* Styling for the select element */
select {
    appearance: none; /* Remove default styling */
    padding: 10px; /* Add padding for better appearance */
    font-size: 16px; /* Set font size */
    border: 1px solid #ccc; /* Add border */
    border-radius: 5px; /* Add border radius */
    background-color: #ffffff; /* Set background color */
    width: 200px; /* Set width */
    outline: none; /* Remove outline */
    cursor: pointer; /* Change cursor to pointer */
    transition: border-color .3s; /* Add transition for border color */
}

/* Styling for the options within the select */
select option {
    padding: 10px; /* Add padding for better appearance */
    font-size: 16px; /* Set font size */
    transition: .3s ease-in-out;
}

/* Styling for the select when it's open */
select:focus, select:hover {
    border-color: #007bff; /* Change border color when focused */
}