#wrapper #content-wrapper #content {
    display: flex;
    flex-direction: column;
}

footer {
    border-top: 1px solid var(--color-light);
}

h1, .h1 {
    font-weight: bold;
}

.navbar {
    z-index: 1;
}

.page-container {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    flex-grow: 1;
}

.brand-logo {
    max-height: 2rem;
}

.card {
    border-color: var(--color-dark);
    border-radius: 1.5rem;
}

.card .card-body {
    padding: 3em;
}

.check-option input[type=radio] {
    width: 0;
    height: 0;
    overflow: visible;
    opacity: 0;
    position: absolute;
    z-index: -1;
}

.check-option input[type=radio] + .btn {
    background-color: transparent;
    color: var(--active-color);
}

.check-option input[type=radio]:not(:disabled):focus + .btn {
    box-shadow: 0 0 0 .2rem rgba(var(--active-color-rgb),.5);
}

.check-option input[type=radio]:checked + .btn {
    background-color: var(--active-color);
    color: #fff;
}

.btn-primary {
    --active-color: var(--color-primary);
    --active-color-rgb: var(--color-primary-rgb);
}

.btn-secondary {
    --active-color: var(--color-secondary);
    --active-color-rgb: var(--color-secondary-rgb);
}

.btn-tertiary {
    --active-color: var(--color-tertiary);
    --active-color-rgb: var(--color-tertiary-rgb);
}

.ratio {
    display: block;
    width: 100%;
    position: relative;
}

.ratio::before {
    content: "";
    display: block;
    width: 100%;
    height: 0;
    padding-top: var(--aspect-ratio, 100%);
}

.ratio img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

img.picture-contain {
    object-fit: contain;
}

.ratio-4-3 {
    --aspect-ratio: 75%;
}

.ratio-16-9 {
    --aspect-ratio: 56.25%;
}

#language-selection-form a {
    cursor: pointer;
}