
* {
    margin: 0em;
    padding: 0em;
    box-sizing: border-box;
    border: 0em;
    font-family: sans-serif; 
}

body {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    background: #5E6472;
    max-width: 100vw;
    max-height: 100vh;
}

body header {
    background: #FAF3DD;
    max-width: 100vw;
}

body header nav ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    list-style: none;
    max-width: 100vw;
    margin: 0.4em 0.5em 0.2em 0.5em;
}

body header nav ul img {
    height: 1.7em;
}

#logo {
    height: 3.7em;
    margin: 0em 1.9em 0em 4.4em;
}


#menucontainer:target {
    left: 0;
    transition: all .6s ease;
}

#menucontainer {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    background-color: #FFA69E;
    width: 50vw;
    height: 100vh;
    padding: 2rem 2rem 2rem 1rem;
}

#menucontainer {
    position: fixed;
    left: -80vw;
    top: 0;
    height: 100vh;
    transition: all .6s ease;
    z-index: 999;
}

.x {
    position: absolute;
    background-color: #5E6472;
    left: 40vw;
}

.x a {
    color: #FAF3DD;
    padding: .2em;
    text-decoration: none;
}

#usuario {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    margin-top: 1em;
}

#usuario img { 
    height: 20vw;
    width: 20vw; 
    border-radius: 10em;
}

#usuario h4 {
    color: #5E6472;
    margin-top: .5em;
    margin-bottom: 1.5em;
}

.listamenu {
    list-style: none;
    margin-left: .5em;
    margin-top: .5em;
}

.listamenu li {
    margin-bottom: .6em;
    background-color: #FAF3DD;
    padding: .3em;
}

.listamenu a {
    text-decoration: none;
    color: #5E6472;
}

.contactar {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-content: center;
    max-height: 100vh;
    max-width: 100vw;
    margin: 1em 0em 0em 0em;
}

.contactar section {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    align-items: center;
}

.mensaje select {
    max-width: 90vw;
}

.mensaje input {
    max-width: 90vw;
    max-height: 50vh;
    margin: 1.3em 0em 0.7em 0em;
}

.formulario {
    margin: 0.9em 0em 0.3em 1.3em;
    color: #FAF3DD;
}

.enviar {
    display: flex;
    justify-content: center;
}

.enviar h4 {
    margin: 0.3em 0em 1em 1.3em;
    background: #DB2955;
    padding: 0.7em;
    border-radius: 0.5em;
}

.enviar a {
    text-decoration: none;
    color: #FAF3DD;
}
