body.lang
{
    background-color: #222;
    color: #DDD;
    font-family: 'Tahoma';
}

nav {
    border: 4px ridge #71abce;
}

nav ul {
    display: flex;
    justify-content: space-around;
    list-style: none;
    margin: 0.5rem 0 0.75rem;
    padding-left: 0;
}

nav ul a {
    color: #EEE;
    font-size: 1.5rem;
    text-decoration: none;
}

nav ul a:visited {
    color: #EEE;
}

.prompt {
    text-align: center;
}
.prompt img {
    max-width: 300px;
}
h2.character {
    font-size: 6rem;
    font-weight: 200;
    text-align: center;
    margin: -12px 0 0;
}
.kana {
    width: 100%;
    text-align: center;
}
#Canvas {
    background-color: #DDD;
    margin: 1rem 0;
    touch-action: none;
    width: 300px;
    height: 300px;
}
.reveal-btn {
    display: block;
    font-size: 2rem;
    margin: 2rem auto;
    width: 80%;
}
#wordAnswer {
    opacity: 0;
}
#wordAnswer.show {
    opacity: 1;
    transition: opacity 0.5s;
}
.translation {
    font-size: 0.6rem;
    margin-top: 10rem;
}
.score-btn {
    display: block;
    font-size: 1.5rem;
    margin: 2.5rem 0;
    width: 100%;
}
.score-btn[value="5"] {
    background-color: #AFA;
}
.score-btn[value="1"] {
    background-color: #FFA;
}
.score-btn[value="0"] {
    background-color: #FFF;
}
.score-btn[value="-1"] {
    background-color: #AAA;
}
.score-btn[value="-5"] {
    background-color: #FAA;
}



.dictionary-list dd
{
    margin: 0 0 0 2rem;
}

.dictionary-list dt:not(:first-of-type)
{
    margin-top: 1rem;
}
