body {
    background-color: black;
    font-family: trebuchet ms;
    font-size: 1rem;
    color: #2B2B2B;
    /* overflow: hidden; */
    user-select: none;
}

#container {
    display: grid;
    justify-items: center;
    align-items: center;
    text-align: justify;
    background-color: white;
    margin: 0 auto;
    transform: translate(0, 1vh); 
}

.link:hover {
    cursor: pointer;
    text-shadow: 1px 1px 3px gray;
}
#title{    
    font-size: 3em;
}

#hanzi-text{
    padding: 0 1em;
    font-weight: bold;
}
#pinyin-text{
    padding: 0 2em;
    font-weight: bold;
}

#illustration > img {
    max-width: 100%;
    height: auto;
}

#english-text{
    padding: 0 2em 0 1em;
    font-weight: bold;
}
#prev{
    font-size: 3em;
    cursor: pointer;
}
#prev:hover {
 text-shadow: 1px 1px 3px gray;
}
#next:hover{
 text-shadow: 1px 1px 3px gray;
}
#pinyin-word{
    width: 100%;
    text-align: center;
    /* outline: thin solid red; */
}
#hanzi-word{
    font-size: 5em;
    width: 100%;
    height: 100%;
    text-align: center;
    /* outline: thin solid red; */
}
#english-word{
    width: 100%;
    text-align: center;
    /* outline: thin solid red; */
}
#next{
    font-size: 3em;
    cursor: pointer;
}
#strokes{
    text-align: center;
}
.hanzi-image > img{
    max-width: 50%;
    max-height: 50%;
}