.bg-off-black {
    background-color: #252424;
}

.mw-10r {
    max-width: 10rem;
}

.mw-20r {
    max-width: 20rem;
}

.mw-25r {
    max-width: 25rem;
}

.mw-30r {
    max-width: 30rem;
}

.mw-40r {
    max-width: 40rem;
}

.w-fc {
    width: fit-content;
}

.h-25vh {
    height: 25vh;
}

.h-50vh {
    height: 50vh;
}

.h-75vh {
    height: 75vh;
}

.h-100vh {
    height: 100vh;
}

.hover-pointer:hover {
    cursor: pointer;
}

.divider {
    display: block;
    background-color: rgba(25,25,25,.75);
    border-radius: 1rem;
    content: '';
    height: .125rem;
}

.btn-dark:focus,
.btn-dark:active,
.btn-dark:focus-visible,
.btn-dark.active {
  background-color: #212529; /* Bootstrap dark */
  border-color: #212529;
  box-shadow: none;
}

.toast-container {
    position: fixed;
    z-index: 9;
    top: 0;
    left: 0;
    margin-top: 3.5rem;
    width: 100%;
    height: calc(100vh - 3.5rem);
    background-color: rgba(0,0,0,0.75);
    pointer-events: auto;
}

.toast-container .card {
    margin-top: 5rem;
}

.no-scrollbar {
    scrollbar-width: none;
}

.form-control:focus,
.form-select:focus {
    border-color: rgb(213, 0, 0);
    box-shadow: 0 0 0 .25rem rgba(213, 0, 0, .33);
}

.form-check-input:checked {
    border-color: rgb(213, 0, 0);
    background-color: rgb(213, 0, 0);

}

.form-check-input:focus {
    box-shadow: 0 0 0 .25rem rgba(213, 0, 0, .33);
}

select {
    overflow: ellipsis;
}

@media (min-width: 1199px) {
    html {
        font-size: 20px;
    }
}