:root
{
    --sidebar-width: max(25vw, 300px);
    --content-width: calc(100vw - var(--sidebar-width));
}

html, body
{
    background-attachment: fixed;
    background-position: center;
    background-size: cover;
    font-size: small;
}

#content
{
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    height: calc(85vh - 52px);
    width: 100vw;
}

body.show-sidebar #content
{
    width: calc(var(--content-width) - max(1vw, 25px));
}

#sidebar
{
    margin-left: var(--content-width);
    display: none !important;
    width: 0;
    max-height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    position: fixed;
    top: 0;
}

.members .member a
{
    min-width: unset !important;
}

.members .member:not(:first-of-type)
{
    margin-left: -15px !important;
}

.modal .members
{
    margin-bottom: unset !important;
}

.modal .members .member:not(:first-of-type)
{
    margin-left: unset !important;
}

body.show-sidebar #sidebar
{
    width: var(--sidebar-width);
    display: block !important;
}

.list-container
{
    flex: 0 0 275px;
    pointer-events: none;
}

.list
{
    background-color: #ececec;
    pointer-events: all;
}

.list p
{
    margin: unset;
}

.list-items
{
    max-height: 80vh;
    overflow-y: auto;
    scrollbar-width: thin;
}

.list-card
{
    background-color: #fcfcfc;
    cursor: pointer;
}

.list-card p
{
    font-size: small;
}

.modal-container .modal
{
    overflow-y: auto;
}

.modal
{
    background: rgba(0,0,0,.35);
}

@media (min-width: 576px)
{
    .modal-dialog
    {
        max-width: max(40vw, 750px);
    }
}

.label
{
    padding: .25rem .5rem;
    margin: .125rem;
    font-weight: bold;
    font-size: small;
}

.modal .label
{
    padding: .75rem 1rem;
    margin: .125rem .25rem;
}

.label.green {
    background-color: #61bd4f;
}

.label.yellow {
    background-color: #f2d600;
}

.label.orange {
    background-color: #ff9f1a;
}

.label.red {
    background-color: #eb5a46;
}

.label.purple {
    background-color: #c377e0;
}

.label.blue {
    background-color: #0079bf;
}

.label.sky {
    background-color: #ff78cb;
}

.label.lime {
    background-color: #00c2e0;
}

.label.pink {
    background-color: #51e898;
}

.label.black {
    background-color: #344563;
}

.font-weight-bold {
	font-weight: bold;
}

#fileImporter {
	padding: .75rem;
	margin: .75rem;
	border-radius: 5px;
	background: white;
}