* {
box-sizing: border-box;
}
html,
body {
font-size: 24px;
line-height: 1.6;
font-family: sans-serif;
background-color: #e6b0aa;
}
#app {
width: 100%;
}
section.recipe {
display: block;
margin: 48px auto;
padding: 32px;
width: 50ch;
border-radius: 0.5rem;
box-shadow: 1px 1px 10px 2px rgba(0, 0, 0, 0.1);
}
.recipe label,
.recipe input,
.recipe textarea {
font-family: sans-serif;
display: block;
width: 100%;
max-width: 100%;
}
input,
textarea,
button {
color: currentColor;
background: none;
border: 1px solid currentColor;
padding: 8px;
font-size: 1rem;
}
button.add {
display: block;
width: 48px;
height: 48px;
margin: 0 auto;
margin-top: 16px;
cursor: pointer;
border-radius: 50%;
}
textarea + textarea {
margin-top: 16px;
}
label {
font-style: italic;
font-size: 19px;
}
.entry + .entry {
margin-top: 32px;
}