/* styles.css */
body {
    font-family: sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f0f0f0;
    color: #333;
}

header {
    background-color: #ddd;
    padding: 20px;
    text-align: center;
}

main {
    padding: 20px;
}

footer {
    background-color: #ddd;
    padding: 20px;
    text-align: center;
}

#explorer {
    margin-bottom: 20px;
}

#filters {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}

#search-input {
    width: 200px;
    padding: 5px;
}

#dinosaur-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 10px;
}