.tdFontWeight {
    font-weight: 700;
}

.artistImage {
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    object-fit: cover;
}

.undecidedOption {
    background-color: rgb(247, 210, 132);
    color: rgba(120, 53, 15, 1);
}

.yesOption {
    background-color: rgb(142, 236, 177);
    color: rgba(20, 83, 45, 1);
}

.noOption {
    background-color: rgb(255, 170, 170);
    color: rgba(254, 226, 226, 1);
}

.optionClass {
    background-color: rgba(229, 231, 235, 1);
    color: rgba(17, 24, 39, 1);
}

.normalTextColor {
    color: rgba(17, 24, 39, 1);
}

.suspended.normalTextColor {
    color: rgb(154, 158, 167);
}

.suspended img {
    opacity: 0.4;
    filter: alpha(opacity=40); /* msie */
}

.flexShrinkZero {
    flex-shrink: 0;
}

.timeCell {
    width: auto;
    flex-grow: 1;
}

.firstCell {
    width: calc((1rem * 20));
}

.lastCell {
    width: calc(3.5rem + (1rem * 20));
}

.trClass {
    width: calc(3.5rem + (1rem * 20));
    padding-bottom: 1rem;
}

.overviewContainer {
    margin: auto;
    justify-content: center;
    max-width: 56rem;
    margin-top: 4rem;
    margin-bottom: 4rem;
    transition: all 300ms ease-in-out;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.overviewHeader {
    padding-left: 20px;
    padding-right: 20px;
    font-size: 2.5rem;
    font-weight: 400;
    font-family: 'HammerEight';
}

.dropdownOptions {
    transition: visibility 0s, opacity 150ms ease-in-out;
}

.optionSelected {
    background-color: rgb(214, 214, 214);
    color: rgb(31 41 55);
    cursor: pointer;
}

.optionSelected:hover {
    background-color: rgb(175, 175, 175);
    color: rgb(3 7 18);
}

.optionSelected.hoveredOption {
    background-color: rgb(175, 175, 175);
    color: rgb(3 7 18);
}

.optionUnselected {
    color: rgb(55 65 81);
    cursor: pointer;
}

.optionUnselected:hover {
    background-color: rgb(233, 233, 233);
    color: rgb(31 41 55);
}

.optionUnselected.hoveredOption {
    background-color: rgb(233, 233, 233);
    color: rgb(31 41 55);
}

.closed {
    opacity: 0;
    visibility: hidden;
}

.svgDropdownColor {
    color: rgb(156 163 175);
}

.topDropdownDiv {
    width: 6.875rem;
}

.tableHeader {
    max-width: 56rem;
    display: flex;
    justify-content: space-between;
}

.tableHeaderSpaceFiller {
    width: 2.5rem;
}

.buttonDropdown {
    touch-action: none;
}

.filteredRow {
    display: none;
}

.filterGroupLabels {
    padding-left: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.25rem;
    color: rgb(55 65 81);
}

.largerFont {
    font-size: 1rem;
    line-height: 2rem;
}

.dropdownDescription {
    display: none;
}

.svgMarginFix {
    margin-left: -.25rem;
}

/* Customize the label (the container) */
.filterCheckboxContainer {
    display: block;
    position: relative;
    padding-left: 3rem;
    padding-bottom: 0.5rem;
    padding-top: 0.5rem;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    color: rgb(55 65 81);
}

.filterCheckboxContainer:hover {
    background-color: rgb(233, 233, 233);
    color: rgb(31 41 55);
}

.filterCheckboxContainer.hoveredOption {
    background-color: rgb(233, 233, 233);
    color: rgb(31 41 55);
}

.unknownFilter .unknown {
    display: none;
}

.yesFilter .yes {
    display: none;
}

.noFilter .no {
    display: none;
}

.alphaFilter .alpha {
    display: none;
}

.bravoFilter .bravo {
    display: none;
}

.haciendaFilter .hacienda {
    display: none;
}

.heinekenFilter .heineken {
    display: none;
}

.indiaFilter .india {
    display: none;
}

.limaFilter .lima {
    display: none;
}

.xrayFilter .xray {
    display: none;
}

.fridayFilter .friday {
    display: none;
}

.saturdayFilter .saturday {
    display: none;
}

.sundayFilter .sunday {
    display: none;
}

.tableClass {
    border-collapse: separate;
    border-spacing: 0 1rem;
}

/* Hide the browser's default checkbox */
.filterCheckboxContainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}

/* Create a custom checkbox */
.checkmark {
    font-size: 0.5rem;
    position: absolute;
    top: 0.5rem;
    left: 1rem;
    height: 1.25rem;
    width: 1.25rem;
    background-color: #eee;
    border-radius: .375rem
}

/* On mouse-over, add a grey background color */
.filterCheckboxContainer:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.filterCheckboxContainer input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.filterCheckboxContainer input:checked ~ .checkmark:after {
    display: block;
}

/* Style the checkmark/indicator */
.filterCheckboxContainer .checkmark:after {
    left: 0.45rem;
    top: 0.275rem;
    width: 0.375rem;
    height: 0.675rem;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
} 

@media (hover: none) {
    .overviewContainer {
        margin-top: 0.5rem;
        margin-bottom: 0.5rem;
    }
}

@media (min-width: 640px) {
    .dropdownDescription {
        display: block;
    }
    .svgMarginFix {
        margin-left: 0;
    }
    .lastCell {
        width: auto;
    }
    .trClass {
        width: auto;
        padding-bottom: 0;
    }
    .largerFont {
        font-size: 1rem;
        line-height: 1.5rem;
    }
    .dropdownOptions {
        right: 0;
    }
    .tableHeaderSpaceFiller {
        width: 26rem;
    }
}