body{
    background:linear-gradient(#dff5df,#b9e4b9);
    font-family:sans-serif;
    color:#234;
}

.card{
    max-width:800px;
    margin:40px auto;
    background:white;
    padding:40px;
    border-radius:30px;
    box-shadow:0 0 20px rgba(0,0,0,.15);
}

h1 {
    text-align:center;
    color:#2f8f2f;
    font-size: clamp(24px, 8vw, 48px);
    white-space: nowrap;
    margin-top: 0;
}

a {
    color:#0a0;
}

.marimo{
    text-align:center;
}

.info{
    line-height:2;
    font-size:18px;
}

.start{
    display:block;
    width:300px;
    margin:40px auto;
    padding:20px;
    border:none;
    border-radius:999px;
    background:#43a047;
    color:white;
    font-size:24px;
    cursor:pointer;
}

.start:hover{
    background:#388e3c;
}

.passers{
    width:100%;
    border-collapse:collapse;
    margin-top:20px;
}

.passers th{
    background:#4caf50;
    color:white;
    padding:8px;
}

.passers td{
    border:1px solid #ccc;
    padding:8px;
    background:white;
}

.choice {
    width: 100%;
    margin: 10px 0;
    padding:12px 12px;
    font-size: 24px;
    text-align: left;
    background: #080;
    color: white;
    border-radius: 16px;
}

.choice:hover {
    background: #0b0;
}

#quizForm.sending .choice {
    pointer-events: none;
    color: transparent;
}

.question
{
    margin: 16px 0;
    font-size: 18px;
}

.progress
{
    text-align: right;
}

.book-link{
    display:inline-flex;
    flex-direction:column;
    align-items:center;

    text-decoration:none;
    color:#333;

    width:224px;
}

.book-link img{
    width:224px;
    height:auto;

    display:block;

    border-radius:8px;
    box-shadow:0 4px 12px rgba(0,0,0,.2);
}

.book-title{
    width:100%;
    margin-top:0;
    padding:10px;
    box-sizing:border-box;
    background:#f5f5f5;
    border-radius:0 0 8px 8px;
    text-align:center;
    font-weight:bold;
    font-size:14px;
}

footer {
    margin: 24px 0;
    text-align: center;
}

ins.adsbygoogle {
    margin: 24px 0;
}

.success{
    margin: 24px 0;
    padding: 24px 20px;
    text-align: center;
    background: linear-gradient(
        135deg,
        #fdfcf4,
        #fff8d8
    );

    border: 4px solid #c9a227;
    border-radius: 20px;
    color: #0f5c2e;
    font-size: 1.4rem;
    font-weight: bold;
    line-height: 1.8;

    box-shadow:
        0 6px 20px rgba(0,0,0,.15),
        inset 0 0 20px rgba(255,255,255,.6);

    position: relative;
}