body {
    background:#efdec1;
    font-size: 14px;
    font-family:Verdana, sans-serif;
    width:210px;
    height:300px;
    margin:0;
    padding:10px;

}

.quiz {
position:relative;
}

#maru {
position:absolute;
width:160px;
height:160px;
top:-20px;
left:130px;
border-radius:200px;
transition:.5s;
border:solid 30px rgba(255,0,0,0.5) ;
display:none;
}

.judge {
padding:0;
margin:0;
position:absolute;
width:190px;
height:190px;
top:40px;
left:3px;
display:none;
}

.maruvisible, .batsuvisible {
display:block!important;
}

.signboard {
margin:0;
padding:0;
display:flex;
user-select:none;
width:210px;
}

#today {
}

.signboard > div {
margin:0;
padding:0;
}

.title {
font-size:20px;
font-weight:bold;
width:110px;
text-align:right;
}

.container {
    display:flex;
    width:220px;
    margin:0px auto;
    border-radius:4px;
    position:relative;
}

#question {
    background:#efdec1;
    border-radius:4px;   
    font-weight: bold;
    font-size:90px;
    line-height:80px;
    margin:0px 10px;
    padding:5px 10px 10px 10px;
    width:160px;
    height:80px;
    text-align:center;
}

#choices {
    border-radius:4px;
    list-style:none;
    padding:7px;
    margin:0px;
    width:180px;
    user-select:none;
}

#choices > li {
    background:white;
    border:1px solid #ccc;
    border-radius:4px;
    padding:5px;
    margin-bottom:7px;
    cursor:pointer;
    text-align:center;
}

#choices > li:hover {
    background-color:#f5f5f5;
}

#choices > li.correct {
    background:#d4edda;
    border-color:#c3e6cb;
    color:#155724;
    font-weight:bold;
}

#choices > li.wrong {
    background:#f8d8da;
    border-color:#f5c6cb;
    color:#721c24;
    font-weight:bold;
}