.progressbar-wrapper {
    position: relative;
    z-index: 1;
    background-color: lightgray;
    color: #252830;
    border-radius: 4px;
    overflow: hidden;
}

.progressbar-wrapper-na {
    position: relative;
    z-index: 1;
    background-color: #f5f5f5;
    color: #c1c1c1;
}

.progressbar-container {
    display: flex;
    height: 20px;
    position: relative;
    border-radius: 4px;
    overflow: hidden;
}

.progressbar {
    z-index: -1;
}

.progressbar-danger {
    background-color: #e64759;
    font-weight: bold;
}

.progressbar-warning {
    background-color: #e4d836;
    font-weight: bold;
}

.progressbar-success {
    background-color: #1bc98e;
    font-weight: bold;
}

.progressbar-info {
    background-color: #1997c6;
    font-weight: bold;
}

.progress-text {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-weight: bold;
    z-index: 1;
}

.progressbar-text {
    color: white;
    font-style: italic;
    font-size: x-small;
}

.progressbar-percent-text {
    color: white;
    font-weight: bold;
}

.progressbar-statcard {
    padding: 0px !important;
    line-height: 1 !important;
}

.progressbar-last {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

/* ======================== START PartialUserSaveFilterSharedConfigurationComponent ============================= */

.sharedCfgHeaderRow {
    margin-top: 25px;
}

    .sharedCfgHeaderRow h4 {
        padding-left: 10px;
    }

    .sharedCfgHeaderRow .col-md-6:nth-of-type(2) {
        padding: 0;
    }

.autocompleteSharedCfgDropdownInputWrapper {
    margin-bottom: 10px;
}

#mainSharedCfgDropdownWrapper {
    display: none;
    width: 1000px;
    position: fixed;
    z-index: 99999;
    top: calc(50% - 438px);
    left: calc(50% - 500px);
}

.filterNameSharedCfgComponent {
    width: 100%;
    border-radius: 6px;
    padding: 10px;
}

.filterNameSharedCfgComponentWrapper {
    border-bottom: 1px solid lightgrey;
    padding-bottom: 25px;
    margin-top: 25px;
}

.autocompleteSharedCfgDropdownInput {
    width: 100%;
    border-radius: 6px;
    padding: 10px;
}

.wrapperOfSideSharedCfgDropdown {
    display: flex;
}

.sideSharedCfgDropdownWrapper {
    padding: 10px;
    width: 50%;
}

    .sideSharedCfgDropdownWrapper:nth-of-type(2) ul {
        height: 453px;
    }

.universalUlSharedCfgDropdown {
    overflow: auto;
    height: 400px;
    margin: 0;
    padding: 10px;
    border: 1px solid #d5d5d5;
    border-radius: 10px;
}

.liUniversalSharedCfgDropdown {
    list-style: none;
    border-bottom: 1px solid lightgrey;
    cursor: pointer;
    font-weight: 400;
    font-size: 16px;
    padding: 5px;
}

    .liUniversalSharedCfgDropdown:hover {
        background-color: lightgray;
    }

.liSharedCfgDropdownSelected {
    color: white;
    background-color: #1CA8DD;
}

.errorWrapper {
    border: 1px solid red;
    padding: 5px;
    color: red;
    background-color: rgba(255, 108, 119, 0.4);
}

.filterCreatedSucessfully {
    padding: 20px;
    text-align: center;
    display: none;
    position: fixed;
    z-index: 9999999999999;
    top: calc(50% - 70px);
    left: calc(50% - 170px);
}

#popupBackgroundCover {
    top: 0;
    display: none;
    background-color: RGBA(0,0,0,0.52);
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 99999;
    left: 0;
}

/* ======================== END PartialUserSaveFilterSharedConfigurationComponent ============================= */

/*===================== START PartialSearchSavedFiltersComponent css =============================*/

#collapseFiltersTaskSummary {
    margin-bottom: 10px;
}

.deleteSavedFilterButton {
    color: #f34f4f;
    display: inline-block;
    font-size: 16px;
    padding: 10px;
    background-color: white;
    border: 1px solid #f34f4f;
    border-radius: 100px;
    margin-left: 10px;
    float: right;
}

    .deleteSavedFilterButton:hover {
        color: white;
        background-color: #f34f4f;
    }

#mainDropdownWrapperUSF {
    display: none;
    width: 1000px;
    position: fixed;
    z-index: 9999999999999;
    top: calc(50% - 322px);
    left: calc(50% - 500px);
}

#filterNameUSFComponent {
    width: 100%;
    border-radius: 6px;
    border: 1px solid lightgrey;
    padding: 10px;
}

#filterNameUSFComponentWrapper {
    border-bottom: 1px solid lightgrey;
    padding-bottom: 25px;
    margin-top: 25px;
}

.autocompleteDropdownInputUSF {
    width: 100%;
    border-radius: 6px;
    padding: 10px;
}

.autocompleteWrapperUSF {
    margin-top: 25px;
}

.filterListWrapperUSF {
    overflow: auto;
    height: 400px;
    margin: 0;
    padding: 0px;
    border: 1px solid #d5d5d5;
    border-radius: 10px;
}

.inputCustomStyle {
    border: 1px solid #1CA8DD;
}

.liUniversalUSFDropdown {
    display: flex;
    justify-content: space-between;
    list-style: none;
    border-bottom: 1px solid lightgrey;
    cursor: pointer;
    font-weight: 400;
    font-size: 16px;
    padding: 5px;
    height: 59px;
    direction: row;
    align-items: center;
}

    .liUniversalUSFDropdown:hover {
        background-color: lightgray;
    }

.liUSFDropdownSelected {
    color: white;
    background-color: #1CA8DD;
}

.usfSection {
    margin-top: 25px;
}

.popupBG {
    top: 0;
    display: none;
    background-color: RGBA(0,0,0,0.52);
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 9999999999999999;
    left: 0;
}

#popupBackgroundCoverUSF {
    top: 0;
    display: none;
    background-color: RGBA(0,0,0,0.52);
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 99999;
    left: 0;
}

#showPopupButtonWrapper {
    margin-top: 10px;
}

.lds-dual-ring {
    display: inline-block;
    width: 80px;
    height: 80px;
}

.lds-dual-ring-position {
    position: absolute;
    top: calc(50% - 32px);
    left: calc(50% - 32px);
}

.lds-dual-ring:after {
    content: " ";
    display: block;
    width: 64px;
    height: 64px;
    margin: 8px;
    border-radius: 50%;
    border: 6px solid rgb(20, 160, 213);
    border-color: rgb(20, 160, 213) transparent rgb(20, 160, 213) transparent;
    animation: lds-dual-ring 1.2s linear infinite;
}

@keyframes lds-dual-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/*========================= END PartialSearchSavedFiltersComponent css ========================*/

/*==========for fixed column scrolling of schedule table*@ .table-scroll==============*/ {
    position: relative;
    /*max-width: 600px;*/
    margin: auto;
    overflow: hidden;
    /*border: 1px solid #000;*/
}

.table-wrap {
    width: 100%;
    overflow: auto;
}

.table-scroll table {
    width: 100%;
    margin: auto;
    border-collapse: separate;
    border-spacing: 0;
}

.table-scroll th, .table-scroll td {
    padding: 5px 10px;
    /*border: 1px solid #000;*/
    /*background: #252830;*/
    /*white-space: nowrap;*/
    vertical-align: top;
}

.clone {
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none;
}

    .clone th, .clone td {
        visibility: hidden
    }

    .clone td, .clone th {
        border-color: transparent
    }

    .clone tbody th {
        visibility: visible;
        color: red;
    }

    .clone .fixed-side {
        /*border: 1px solid #000;*/
        background: #ffffff;
        visibility: visible;
    }

    .clone thead, .clone tfoot {
        /*background: transparent;*/
    }

.well-greybackground {
    background-color: #f5f5f5;
}

.well-border-filters {
    border: 1px solid #eee;
    box-shadow: 2px 2px 5px 2px rgba(0, 0, 0, 0.05);
    border-radius: 10px;
}

.well-border {
    border: 1px solid #eee;
    box-shadow: 5px 5px 10px 5px rgba(0, 0, 0, 0.05);
    background-color: #fff !important;
    border-radius: 10px;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 15px;
    padding-right: 15px;
}

.bg-draft {
    background: lightgray;
    color: #1a1919;
    font-weight: bold;
}

.label-draft {
    background-color: lightgray;
}

.instructions-text-light {
    color: #A9ACB7;
    font-style: italic;
    font-size: small;
}

.instructions-text {
    color: #A9ACB7;
    font-style: italic;
    font-size: small;
}

.instructions-text-warning {
    color: orangered;
    font-style: italic;
    font-size: small;
}

.instructions-text-primary {
    color: #1CA8DD;
    font-style: italic;
    font-size: small;
}

.instructions-text-theme {
    color: white;
    font-style: italic;
    font-size: x-small;
}

.instructions-header-light {
    color: #A9ACB7;
}

.instructions-header {
    color: #A9ACB7;
}

.table-cell-formula {
    background-color: #F3F1F1;
}

.table-edit-locked {
    color: black;
    border-color: lightgray;
    background-color: #F3F1F1;
    float: left;
}

.table-edit {
    float: left;
    border-color: lightgray;
}

#overlay {
    position: relative;
    display: none;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.2);
    z-index: 1000;
    cursor: wait;
}

.vertical-horizontal-center {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.signup-page-background {
    background: #1CA8DD !important;
    color: #fff;
    /*height: 100vh;*/
    min-height: 100vh;
}

.signup-page-list {
    font-size: 20px;
    color: #fff;
}

.title-icon {
    font-size: 40px;
    /*color: #1CA8DD;*/
    color: gray;
}

.title-icon-sm {
    font-size: 20px;
    /*color: #1CA8DD;*/
    color: gray;
}

.modal {
    /*must be applied after bootstrap.css*/
    overflow-y: auto;
}

.required-cell-bg-danger {
    background-color: #f8d7da;
}

.required-cell-bg-success {
    background-color: #d4edda;
}

img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

.name-value-pair > h5, .name-value-pair > p {
    display: inline-block;
    padding-right: 10px;
    margin-bottom: 0;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
}

.name-value-pair {
    display: flex;
    align-items: baseline;
}

    .name-value-pair h5 {
        flex: 0 0 200px;
    }

}

.table-hover-schedule-modal > tbody > tr:hover {
    background-color: #f5f5f5 !important;
}

.clickable {
    cursor: pointer;
}
/**/
.center-columns {
    display: flex;
    justify-content: center;
}

.thumbnail-img-background {
    background-image: url('../images/blurred-thumbnail.png');
    background-repeat: no-repeat;
    background-size: cover;
    max-width: 100px;
    min-height: 50px;
}

.dl-horizontal dt, .dl-horizontal dd {
    white-space: normal;
}

.no-padding {
    padding-left: 0;
    padding-right: 0;
}

#sortableContainer .row {
    cursor: move;
}
@media (max-width: 992px) {
    #sortableContainer .row {
        cursor: default;
    }
}

.table-div-allow-overflow {
    overflow: visible !important;
}

/* Equipment Schedule Import */
.equipment-type-match-badge {
    background-color: #5cb85c;
    color: white;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 12px;
    margin-left: 5px;
}

.equipment-type-new-badge {
    background-color: #5bc0de;
    color: white;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 12px;
    margin-left: 5px;
}

.equipment-match-info-box {
    margin-bottom: 15px;
    padding: 10px;
    border-left: 3px solid #5cb85c;
    background-color: #f9f9f9;
}

.equipment-no-match-info-box {
    margin-bottom: 15px;
    padding: 10px;
    border-left: 3px solid #5bc0de;
    background-color: #f9f9f9;
}