body {
    padding-top: 80px;
}

.settings-body {
    padding-top: 0px !important;
}

.subtitles {
    width: 100%;
}

.truncate {
    width: 250px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


.thumbnail {
    position: relative;
    overflow: hidden;    
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    object-fit: cover;
}

.caption-btm {
    background: rgb(40, 40, 40);
    width: 100%;
    height: 38px;
    /*position: absolute;*/
    bottom: 4px;
    color: #fff;
    display: table;    
    margin-bottom: 15px;
}

.caption-btm p {
    /* text-align: center;*/
    display: table-cell;
    vertical-align: middle;
}


.listing-item {
    cursor: pointer;
    height: 35px;
    color: black;
    background: #222222;
    border-radius: 6px;
    padding-top: 7px;
    padding-left: 25px;
    padding-right: 20px;
    margin: 5px;
}

.bg-scheduled {
    background-color: #550000 !important;
}

.text-nowrap {
    white-space: nowrap;
    text-overflow: ellipsis;    
    overflow: hidden;
}

.nowrap {
    max-width: 100%;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.div-no-wrap {
    display: flex;
}

.small-item {
    color: black;    
    border-radius: 6px;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 25px;
    padding-right: 20px;
    margin: 5px;
}

.device-list-item {
    cursor: pointer;
    height: 35px;
    color: black;
    border-radius: 6px;
    padding-top: 7px;
    padding-left: 25px;
    padding-right: 20px;
    margin: 5px;
}

.channel-list-item {
    cursor: pointer;
    height: 70px;
    color: black;
    border-radius: 6px;
    padding-top: 7px;
    padding-left: 15px;
    padding-right: 15px;
    margin: 5px;
}


.device-channels-table {
    table-layout: fixed;
    margin-left: auto;
    margin-right: auto;
    background-color: #222222;
    width: 100%;
    border-color: black;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.device-channels-table th {
    background-color: #333333;
    color: white;
}

.device-channels-table tr {
    color: #A0A0A0;
}

.device-channels-table th, .device-channels-table td {
    padding: 0.45rem;
}

.channelSelected {
    background-color: #333333 !important;
}

.group-selected {
    background-color: #444444 !important;
}

.recording-list-item {
    cursor: pointer;
    min-height: 50px;
    color: black;
    border-radius: 6px;
    padding-top: 7px;
    padding-left: 25px;
    padding-right: 20px;
    padding-bottom: 7px;
    margin: 3px;
    overflow-y: hidden;
}

.recording-grid-item {
    cursor: pointer;
    min-height: calc(width);
}
/*
    .recording-grid-item:after {
        content: '';
        position: absolute;
        top: -1px;
        left: +14px;
        right: +14px;
        bottom: +15px;
        background: linear-gradient(235deg, #772aff, #010615, #2196F3, transparent);
        z-index: -2;
        filter: blur(8px);
    }

    .recording-grid-item:before {
        content: '';
        position: absolute;
        top: -1px;
        left: +14px;
        right: +14px;
        bottom: +15px;
        background: linear-gradient(235deg, #772aff, #010615, #2196F3, transparent);
        z-index: -1;
    }
    */
#scan-results {
    white-space: nowrap;
    overflow-x: hidden;
    height: calc(50vh - 50px);
    overflow-y: auto;
}

.td-condensed {
    padding: 3px !important;
}


.delete-recording {
    width: 20px;
    height: 20px;
    border-radius: 5px;
}

.delete-recording:hover {
    background-color: #FF0000;    
}

.widewrapper {
    width: 100%;
    background-size: cover;
    background-position: center 5%;
}

.common-back-button {
    color: rgba(255, 255, 255, 0.8);
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    padding-left: 4px;
    padding-right: 20px;
    margin-top: -50px;
    margin-bottom: 10px;
}

.details-back-button {
    color: rgba(255, 255, 255, 0.8);
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 4px;
    padding-left: 18px;
    padding-right: 20px;
}

.details-show-header {    
    background-color: rgba(0, 0, 0, 0.8);    
    margin-top: -80px;    
    min-height: 120px;
}

.details-container {
    margin-left: 60px;
    margin-right: 60px;
}

.details-poster {
    margin-top: -75%;
    max-width: 200px;
    border: 2px solid black;
}

.card {
    margin: 3px;
}

.card-header {    
    padding-top: 1px;
    padding-bottom: 1px;
}

.card-body {
    margin-left: 18px;
}

.all-available {
    width: 100% !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    padding-bottom: 5px;
    padding-top: 5px;
}

.fa-trash:hover {
    color: red !important;
}

.extra-vertical {
    padding-top: 3px;
    padding-bottom: 3px;
}

input-dark {
    background-color: #d26c6c;
    color: #FFF;
}

.vjs-default-skin.vjs-paused .vjs-big-play-button {
    display: none;
}



.centered {
    float: none;
    margin-left: auto;
    margin-right: auto;
}


.pad-top-extra {
    padding-top: 10px;
}

.pad-left-extra {
    padding-left: 30px;
}

.pad-right-extra {
    padding-right: 30px;
}

.pad-none {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.pad-left {
    padding-left: 20px;
}

.col-minpad {
    padding: 2px 5px;
}

.margin-top-small {
    margin-top: 4px;
}
.pad-row {
    padding-left: 0px;
    padding-right: 0px;
}

.input-group-text {
    background-color: #666666;
}

.text-secondary {
    color: #777777 !important;
}

#directoryChoices {
    height: 320px;
    max-height: 320px;
    overflow-y: scroll;
    overflow-x: hidden;
}

#directoryBrowser {
    max-height: 400px;
}


.channel-icon {
    max-width: 45px;
    max-height: 40px;
}

.channel-icon-container {
    position: absolute;
    top: 10px;
    right: 26px;    
    max-width: 45px;
    max-height: 40px;
}

.ellipsis {
    text-overflow: ellipsis;    
    white-space: nowrap;
    overflow: hidden;
}

.thumbnail-container {
    background-color: #292b37;       
    overflow: hidden;
}

.no-select {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.form-inline {
    padding-bottom: 5px;
}

.no-pad-right {    
    padding-right: 0px;
}

.no-padding {
    width: 100%;
    padding-right: 0px !important;
    padding-left: 0px !important;
}

.minimal-pad-left {
    padding-left: 5px;
}

.min-padding {
    padding-left: 2px;
    padding-right: 2px;
}

.no-right-pad {    
    padding-right: 0px !important;
}

.details-modal-body {
    min-height: 310px;
}

.cyborg-primary {
    background-color: #0094ff !important;
}

.cursor-pointer {
    cursor: pointer;
}


.details-button {
    background-color: transparent;
    border: 0px;
}


.details-button:hover {
    background-color: #0094ff;
    border: 0px;
}




.focusable {
}

.focusable:focus {
    opacity: 0.8;
    border: 1px solid #000 !important;
    outline: 2px dashed #45c594 !important;
}

.multiselect-selected-text {
    text-align: right;
}

.big-checkbox {
    width: 18px;
    height: 18px;
}

.new-listing {
    background-image: url('images/new.png');
    background-position: right;
    background-repeat: no-repeat;
    background-size: 32px 32px;
}

.new-listing-lg {
    background-image: url('images/new.png');
    background-position: bottom right;
    background-repeat: no-repeat;
    background-size: 40px 40px;
}


.usetwentyfour {
    color: yellow !important;
}

.no-margin {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.btn-small-margin {
    margin: 2px !important;
}

.thumbnail-container .float-button {
    position: absolute;
    top: 6%;
    right: 2%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    background-color: #555;
    color: white;
    font-size: 16px;
    padding: 6px 12px;
    border: none;
    cursor: pointer;
    border-radius: 5px;
    opacity: 0.4;
}

.thumbnail-container .float-button:hover {
    background-color: #0094ff;
    opacity: 1.0;
}

.thumbnail-option {
    background-color: #151515;
    border-radius: 10px;
    padding: 10px;
    margin-bottom: 10px;
}

.artwork-modal-body {
    height: 620px;
    overflow-y: scroll;
}

.artwork-caption {
    width: 100%;    
    bottom: 4px;
    color: #fff;
    display: table;  
    margin-top: 7px;
    margin-bottom: 0px;
}


.artwork-caption p {
    display: table-cell;
    vertical-align: middle;
}

.dropdown-menu {
    background-color: white;    
}

.dropdown-item {
    color: black;   
}

.dropdown-item:hover {
    background-color: #666;
}

.dropdown-item:active {
    background-color: #666;
}

.bs-searchbox {
    border-color: yellow;
}


.bootstrap-select .btn-light {
    background-color: white;
    color: black;
}

.bootstrap-select .btn-light :active {
    background-color: white;
    color: black;
}

.show>.btn-light.dropdown-toggle {
    background-color: white;
    color: black;
}