body {
    min-height: 100vh;
    width: 35em;
    margin: 0 auto;
    font-family: Tahoma, Verdana, Arial, sans-serif;
    background-color: #b2afa3;
    background-image: url('img/telclops2.png');
    background-size: contain;
    background-position: bottom right;
    background-repeat: no-repeat;
    --link-color: #226f95;
}

header {
    display: flex;
}

header div {
    flex-grow: 1;
}

#active-players {
    display: inline;
}

header img {
    margin-top: 1ex;
    height: 20ex;
}

.collapse-button {
    display: none !important;
}

.collapse-button-label {
    cursor: pointer;
}

.collapse-button-label > *::before {
    display: inline-block;
    font-weight: bold;
    content: '›';
    transition: transform .25s;
}

.collapse-button:checked + .collapse-button-label > *::before {
    transform: rotate(90deg) translate(6px, -6px);
}

.collapse-content {
    margin-top: 0;
    max-height: 0px;
    overflow: hidden;
    transition: max-height .25s ease-in-out;
}

.collapse-button:checked + .collapse-button-label + .collapse-content {
    max-height: 100vh;
}

#telclops {
    position: absolute;
    bottom: 0;
    right: 0;
    max-width: 100%;
    max-height: 75%;
    z-index: -1;
    opacity: .25;
}


.back-btn {
    transform: scaleX(0.5);
    display: inline-block;
}