select {
    width: fit-content !important;
}

.form-control {
    display: inline-block !important;
}

td, th {
    text-align: center;
}

.color-0, .color-1.color-2.color-3 {
    background-color: #ffffff;
}

.color-4 {
    background-color: #fdacfd !important;
}

.color-5 {
    background-color: orange !important;
}

.color-6 {
    background-color: #fb6b6b !important;
}

.color-7 {
    background-color: #f2f28b !important;
}

.color-8 {
    background-color: #90fbfb !important;
}

.color-9 {
    background-color: lightgreen !important;
}

.row-type-retired td, .row-type-retired th {
    background-color: gray !important;
}

.row-type-alt td, .row-type-alt th {
    background-color: lightgray;
    font-size:smaller;
    padding:.25em;
}

.table {
    border-collapse: collapse;
}

.table-sticky thead {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 2;
}

.table-sticky thead > tr > th {
    box-shadow: inset 0px 0px 1px #fff;
    background-color: blueviolet;
    color: #fff;
    font-weight: 500;
}

.table-sticky th {
    padding: .25em;
}

#selected-user-name {
    font-weight: 700;
    color: maroon;
}

#total-timezone td {
    padding: .5em;
    border: 1px solid darkgray;
    width: 3.84%;
    min-width: 3em;
    text-align: center;
}

.last-row {
    border-top: 4px solid #f0c8a5 !important;
}

.role-header-leader{
    background-color:burlywood !important;
}
.role-header-superior {
    background-color: lightsalmon !important;
}
.role-header-officer {
    background-color: lightcoral !important;
}
.role-header-veteran {
    background-color: lightgreen !important;
}
.role-header-soldier {
    background-color: lightpink !important;
}
.role-header-retired {
    background-color: gray !important;
}
.role-header-alt {
    background-color: lightyellow !important;
}

.star {
    position: relative;
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: .9em;
    margin-right: .9em;
    margin-bottom: 1.2em;
    border-right: .3em solid transparent;
    border-bottom: .7em solid red;
    border-left: .3em solid transparent;
    /* Controlls the size of the stars. */
    font-size: 24px;
    &:before, &:after{
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    top: .6em;
    left: -1em;
    border-right: 1em solid transparent;
    border-bottom: .7em solid red;
    border-left: 1em solid transparent;
    transform: rotate(-35deg);
}
    &:after {
        transform: rotate(35deg);
    }
}


.modal-backdrop {
    width: 100%;
    height: 100%;
}

.c-type-header {
    font-size: 1em;
    margin-top: 0px;
   margin-bottom: 0px;
    border-top: 2px solid #eeeeee;
}

.c-type-common,
.c-type-epic,
.c-type-heroic,
.c-type-other,
.c-type-rare,
.c-type-citadel {
    min-width: 4em;
    text-align: center;
    border: 1px solid #336633;
    padding-left: .1em;
    padding-right: .1em;
}


    .c-type-common[data="0"],
    .c-type-epic[data="0"],
    .c-type-heroic[data="0"],
    .c-type-other[data="0"],
    .c-type-rare[data="0"],
    .c-type-citadel[data="0"],
    .c-type-common[data=""],
    .c-type-epic[data=""],
    .c-type-heroic[data=""],
    .c-type-other[data=""],
    .c-type-rare[data=""],
    .c-type-citadel[data=""] {
        background-color: gray !important;
    }

.c-type-common {
    background-color: #ccffcc;
    color: #000000;
}

.c-type-rare {
    background-color: #94adf1;
    color: #000000;
}

.c-type-epic {
    background-color: #d2abf9;
    color: #000000;
}

.c-type-heroic {
    background-color: #f9abab;
    color: #000000;
}

.c-type-citadel {
    background-color: #7df996;
    color: #000000;
}

.c-type-other {
    background-color: #f9edab;
    color: #000000;
}


.c-level {
    font-size: 1em;
    text-align: center;
    font-weight: 600;
}

.c-quantity {
    font-size: 1em;
    text-align: right;
}

.chest-table-name {
    font-weight: 600;
    cursor: pointer;
    text-align: left !important;
    position: sticky;
    left: 0px;
    box-shadow: .1em .1em .5em gray !important;
}

#admin-panel-members td:nth-child(2) {
    cursor: pointer !important;
    text-align: left !important;
}

.animate-bg {
    animation: bgcolors 1s infinite;
}

@keyframes bgcolors {
    0% {background-color: green;}
    50% {background-color: white;}
    100% {background-color: green;}
}

.flash-red {
    animation: flash-red-keys 0.5s infinite;
}

.flash-red-tr TD{
    animation: flash-red-white-keys 0.5s infinite;
}

@keyframes flash-red-keys {
0% {background-color: #ff0000;}
50% {background-color: black;}
100% {background-color: #ff0000;}
}

@keyframes flash-red-white-keys {
0% {background-color: #ff0000;}
50% {background-color: #ffffff;}
100% {background-color: #ff0000;}
}

.chest_switch {
    cursor: pointer;
}

#chests-table TD[data-status="i0"],
#chests-table TD[data-status="i1"]{
    background-color: gray !important;
}
#details-modal DIV[data-status="i0"],
#details-modal DIV[data-status="i1"] {
    background-color: black !important;
    color: white !important;
}
#details-modal DIV[data-status="v0"]{
    background-color: gray !important;
}

#chest-status-form-table input,
#chest-status-points-table input{
    text-align: center;
}

.bordered-table-simple{
    border-collapse:collapse;

}
    .bordered-table-simple td,
    .bordered-table-simple th{
        border:1px solid #aaaaaa;
        padding:.25em;
    }

    .bordered-table-simple td:nth-child(1){
        text-align:left;
    }

    .bordered-table-simple tr:hover {
        background-color: yellow;
    }

#r_g_info,
#r_s_info,
#r_m_info
{
    white-space: nowrap !important;
}
    #r_g_info > DIV:nth-child(odd),
    #r_s_info > DIV:nth-child(odd),
    #r_m_info > DIV:nth-child(odd) {
        text-align: left !important;
    }

    #r_g_info > DIV:nth-child(even),
    #r_s_info > DIV:nth-child(even),
    #r_m_info > DIV:nth-child(even) {
        text-align: right !important;
    }


#row-reset > td {
    padding-bottom: 0px;
    vertical-align: bottom;
    border:none !important
}

#row-ancient > td {
    padding-top: 0px !important;
    vertical-align: top;
    border: none !important
}

#row-reset > td:nth-child(17) div {
    background-color: red !important;
    color: black;
    font-weight: 700;
}
    #row-ancient > td > div {
        border-bottom: 1px solid black;
        border-left: 1px solid black;
        border-right: 1px solid black;
        margin-bottom: auto !important;
        margin-top: 0px !important;
        background-color: yellow;
        color: black;
        line-height: 2em;
    }

#row-reset > td > div {
    border-top: 1px solid black;
    border-left: 1px solid black;
    border-right: 1px solid black;
    margin-bottom: 0px !important;
    background-color: black;
    color: white;
    margin-top: auto;
    border-top-left-radius: .5em;
    border-top-right-radius: .5em;
    line-height: 2em;
}
#row-ancient > td:nth-child(1),
#row-reset > td:nth-child(1) {
    vertical-align:middle !important;
    font-size:1em !important
}

/* ancient */
#ancient-week-container input,
.ancient-points-container input {
    background-color: #bef569;
    border: 1px solid black;
}

    #ancient-week-container input:disabled,
    .ancient-points-container input:disabled
{
    background-color: lightgray;
    border: 1px solid #ffffff;
}

#ancient-week-table-1 > tbody td:nth-child(2) {
    text-align: left;
}

#ancient-week-table-1 > tbody td:nth-child(3) {
    text-align: right;
}

.ancient-score-ok TD {
    background-color: lightgreen;
}

.ancient-score-vac TD,
.ancient-score-vacation TD {
    background-color: #c6e3ff;
}

.ancient-score-075 TD {
    background-color: yellow;
}

.ancient-score-low TD {
    background-color: lightcoral;
}

#ancient-week-table-2 > tbody td:nth-child(1) {
    text-align: left;
}

.format-number{
    text-align:right;
}

.table-first-left-others-right > tbody td {
    text-align: right !important;
    min-width:8em;
}
.table-first-left-others-right tbody td:nth-child(1){
    text-align:left !important;
}

.ancient-unpaid TD{
    background-color: lightcoral;
}
.ancient-paid TD{
    background-color: lightgreen;
}