:root{--primary-color:#0284c7;
    --grey:#6b7280;
    --secondary-color:#fef08a;
}
.head {
    background-color: var(--primary-color);
    padding: 2%;
    text-align: center;
    font-family:Verdana, Geneva, Tahoma, sans-serif;
}
textarea{
    border: 1px solid black;
    height: 5vh;
    width: 60%;
    margin: 2% 10% 2% 16%;
    padding: 2%;
    text-align: center;
    background-color: var(--secondary-color);
    border-radius: 1rem;
}
#error-div{
    display: block;
    margin: 2% 9% 2% 9%;           
}
#text-output{
    border: 1px solid black;
    height: 5vh;
    width: 60%;
    margin:2% 10% 2% 16%;
    padding: 2%;
    text-align: center;
    color:var(--grey);
    background-color: var(--secondary-color);
    border-radius: 1rem;
}
.nav {
    text-align: center;
}
#interpret-btn{
    display:block;
    margin: 1% 20% 1% 45%;
    padding: 0.5%;
    background-color:var(--secondary-color);
    font-family:Verdana, Geneva, Tahoma, sans-serif;
    font-size: large;
    border-radius:1rem;
    cursor: pointer;
}
.foot {
    background-color: var(--primary-color);
    text-align: center;
    padding: 2%;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}
.image{
    width: 200px;
    height: 100px;
    border-radius:2rem;
}