:root{
    --fondo: #222222;
    --texto: #f2f2f2;
    --border: 3px solid #3B4B6A;
    --BorderShadow: 0 0 7px rgb(75, 131, 177);
}

* {
    color: var(--texto);
    background: var(--fondo);
    font-family: Arial;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    margin: 0;
    border-radius: 3em;
    font-family: sans-serif;
}

form {
    width: 90vw;
    height: 90vh;
    gap: 10px;

}

title{
    font-size: 0;
    padding: 0;
    margin: 0;
    color: var(--fondo);

}

input {

    margin: 10px;
    border: var(--border);
    box-shadow: var(--BorderShadow);
}

legend {
    font-size: 9vw;
    margin-bottom: 20px;
}

button {
    width: 40vw;
    height: 7vh;
    margin: 10px;
    background-color:#385288;
}

select{
    text-align: center;
    width: 80vw;
    height: 5vh;
}

@media (min-width: 800px) {


*{
    margin: 0;
    }
form {
    gap: 8px;
}
button{
    width: 20vw;
}

legend{
    font-size: 7vw;
    margin-bottom: 25px;
}

label{
    font-size: 2em ;
}

input{
    width: 30vw;
    height: 6vh;
}



}