.sp-original-input-container .sp-add-on .sp-colorize {
    margin-left: 0px !important;
    width: calc(100%) !important;
    margin-top: 0px !important;
    height: calc(100%) !important;
}


.project-layout .edit-layout-button {
    padding: 0.5rem;
    position: fixed;
    top: .7rem;
    z-index: 201;
    left: 0rem;
    transition: .3s !important;
    white-space: normal;
    max-width: 64px;
    color: dimgray;
}

body.edit-layout .project-layout .edit-layout-button {
    display: none;
}

.project-layout .edit-layout-button > div {
    font-size: .7rem;
    display: none;
    white-space: normal;
    font-weight: bold;
}

body.edit-layout .project-layout .edit-layout-button > div {
    display: block;
}

.project-layout .edit-project-button > div {
    font-size: .7rem;
}

body.edit-layout .project-layout .edit-layout-button {
    color: #0d6efd;
}
/*body.show-layout-menu .project-layout .edit-layout-button {
    left: 2.5rem;
    top: 0.1rem;
}*/
.project-layout-menu-buttons2 {
    display: none;
    align-items: center;
    flex-direction: column;
    /*display: flex;
    position: absolute;
    top: 0;
    left: 5rem;*/
    z-index: 201;
    padding-top: 17px;
    transition: .3s;
    width: 0px;
    overflow: hidden;
    border-right: solid 1px black;
    /*margin-left: -1px;
    margin-right: -1px;*/
}

/*body.dark-mode .project-layout-menu-buttons2 {
    background-color: rgba(20,20,20,1);
    background-color: rgba(0,0,0,.7);
    background-color: black;
}
*/
body.show-layout-menu .project-layout-menu-buttons2 {
    display: flex;
    width: 69px;
    overflow-y:auto;
    /*border-right: solid 1px rgba(100,100,100,.3);*/
}


.project-layout-menu-buttons {
    display: none;
    align-items: center;
    flex-direction: column;
    /*display: flex;
    position: absolute;
    top: 0;
    left: 5rem;*/
    overflow-y: auto;
    overflow-x: hidden;
    max-width: 4.5rem;
    min-width: 4.5rem;
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
}

body.edit-layout .project-layout-menu-buttons {
    display: flex;
    z-index: 201;
    padding-top: 13px;
    transition: .3s;
}
/*
body.dark-mode.show-layout-menu .project-layout-menu-buttons {
    background-color: black;
}*/

.project-layout-menu-buttons > button {
    padding: .5rem;
    white-space: normal;
    font-size: .7rem;
    width: 100%;
    /* max-width: 72px;
    width: 72px;*/
    /* height: 73px;*/
    /*border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;*/
}
/*.project-layout-menu-buttons > button > div {
    display:none;    
}*/
.project-layout-menu-buttons .select-project-button .fa-sitemap {
    font-size: 19px;
    margin-bottom: 7px;
}

.project-layout-menu-buttons > button.selected {
    opacity: 1 !important;
    background-color: rgba(20,20,20,1);
    background-color: rgba(0,0,0,.7);
    background-color: black;
    background: #0d6efd;
    border-right: solid 1px rgba(20,20,20,1);
    /* position: relative;
    left: -2px;*/
}

/*.has-select-all .app-navigation-subitems .app-navigation-item a {
    margin-left: -0.5rem;
}*/
/*.app-navigation-subitems .app-navigation-item > a .app-navigation-icon {
    display: none !important;
}*/

.project-layout-menu {
    font-family: 'Montserrat', sans-serif;
}

.project-layout-menu-content {
    width: 100%;
    height: 100%;
    display: none;
    width: 417px;
    background: black;
}
body.show-layout-menu .project-layout-menu-content {
    display:block;
}

.media-item-artwork .delete-icon-button {
    color: red;
    position: absolute;
    right: 0.3rem;
    top: 0.3rem;
}

body.dark-mode .project-layout-menu-content {
    /*background-color: rgba(20,20,20,1);
    background-color: rgba(0,0,0,.7);
    background-color: black;
    border-right: solid 1px rgba(100,100,100,.3);*/
}

.project-layout-menu .project-layout-menu-content-view {
    width: 100%;
    height: 100%;
}

.project-layout-menu .form-window-content {
    text-align: left;
    height: 100%;
}

body.light-mode .project-layout-menu {
    color: black;
    background-color: white;
}

body.dark-mode .project-layout-menu {
    color: white;
    /*background-color: rgba(20,20,20,1);*/ 
}

body.light-mode .project-layout-menu .form-window-content {
    color: black;
    background-color: white;
}

body.dark-mode .project-layout-menu .form-window-content {
    color: white;
    background-color: inherit;
}

body.light-mode .project-layout-menu .form-window-content {
    color: black;
    background-color: white;
}

body.dark-mode .project-layout-menu .form-window-content {
    color: white;
    background-color: inherit;
}

body.dark-mode .form-window-content .form-window-header {
    border-bottom: solid 1px rgba(100,100,100,.3);
}

body.light-mode .form-window-content .form-window-header button {
}

body.dark-mode .form-window-content .form-window-header button {
    color: white;
}

body.dark-mode .form-window-content > .content {
    background-color: inherit;
}

body.dark-mode .form-window-content .app-form-field-label {
    color: lightgray !important;
}
.form-window-content .app-form-field-label {
    padding-top:5px;
}

body.dark-mode #metadata-section textarea[disabled], body.dark-mode #metadata-section textarea[readonly] {
    color: #666 !important;
    background-color:transparent !important;
}

.project-layout-menu-content {
    position: relative;
}

    .project-layout-menu-content .loading-content {
        position: absolute;
        /*position: fixed;*/
        left: 0;
        top: 0;
        right: 0;
        background-color: rgba(0,0,0,.7);
        z-index: 5;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .project-layout-menu-content.save-all .loading-content {
        position: fixed;
    }

.project-layout .pad-top {
    padding-top: 1rem;
}

.project-layout .pad-top-sm {
    padding-top: .5rem;
}

.project-layout .pad-bottom {
    padding-bottom: 1rem;
}

.project-layout .form-window-fields-section {
    margin-bottom: 7px;
}

.project-layout .form-window-fields-section-header {
    display: flex;
    border-bottom: solid 1px #444;
    margin-bottom: 1rem;
    align-items: baseline;
    margin-left: 3px;
    margin-right: 3px;
}

.project-layout .form-window-fields-section.slim-header .form-window-fields-section-header {
    margin-bottom: .5rem;
}

.project-layout .form-window-fields-section-header label {
    text-transform: uppercase;
    font-size: .8rem !important;
    font-weight: bold;
    white-space: nowrap;
    flex: 1;
    margin-bottom: 5px;
    color: whitesmoke;
}

.form-window-fields-section .form-window-fields-section-header button {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 4px;
}

.project-layout .form-window-fields-section-header button i {
    font-size: .8rem !important;
    position: relative;
}
/*
.form-window-fields-section.is-hiding .form-window-fields-section-header button i {
    transform: rotateZ(180deg);
    position: relative;
    left: 0px;
    top: 0px;
    transition: .2s;
}
*/
.project-layout .form-window-fields-section-body {
    position: relative;
}

.project-layout .form-window-fields-section-body .subsection-options {
    padding-top: 12px;
    margin-left: 3px;
}

.project-layout .form-window-fields-section-body .subsection-noItems {
    margin-left: 0 !important;
}

.project-layout .form-window-fields-section-body header button {
    margin: .5rem;
    margin-bottom: 0;
}

    .project-layout .form-window-fields-section-body header button i.fa-plus {
        font-size: 1.1rem !important;
        position: relative;
        left: 2px;
    }

    .project-layout .form-window-fields-section-body header button i.fa-trash {
        font-size: 1rem !important;
    }

.project-layout .form-window-fields-section-body .library header {
    display: flex;
    align-items: flex-end;
    margin-bottom: 5px;
    margin-right: 5px;
    margin-left: 3px;
}

.project-layout .form-window-content .app-navigation-item .app-navigation-icon {
    display: none;
}

.project-layout .form-window-content .app-navigation-items.app-navigation-subitems {
    border: solid 1px #444;
    border-radius: 5px;
    max-height: 400px;
    overflow: auto;
    min-height: 40px;
    padding: 0rem;
}

.project-layout .form-window-content > .content > .container > .library {
    padding-top: 1rem;
}

    .project-layout .form-window-content > .content > .container > .library .subsection {
        margin-bottom: 1rem;
    }

    .project-layout .form-window-content > .content > .container > .library header {
        display: flex;
        flex: 1;
        padding: 0.2rem 1.4rem;
        align-items: end;
    }

        .project-layout .form-window-content > .content > .container > .library header label {
            font-size: .8rem;
            padding-bottom: 5px;
            /* padding-left: 3px; */
            user-select: none;
            /* padding-left: 5px; */
            text-transform: uppercase;
            font-size: .7rem !important;
            font-weight: 500;
            white-space: nowrap;
            flex: 1;
        }

body.dark-mode .project-layout .form-window-content > .content > .container > .library header label {
    color: lightgray !important;
}

body.light-mode .project-layout-menu .form-window-content .form-window-header {
    color: black;
    background-color: white;
}

body.dark-mode .project-layout-menu .form-window-content .form-window-header {
    color: white;
    background-color: inherit;
}

body.light-mode .form-window-content .form-window-header .form-window-title {
    color: black;
}

body.dark-mode .form-window-content .form-window-header .form-window-title {
    color: white;
}


.project-layout-menu .form-window-actions {
    flex-wrap: wrap;
}

.project-layout-menu .form-window-body .project-layout-menu button {
    margin-bottom: 0;
}

.project-layout .form-window-content > .content > .container {
    width: 100%;
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 0;
}

    .project-layout .form-window-content > .content > .container > .library {
        width: 100%;
        display: flex;
        flex-direction: column;
        flex: 1;
    }

.project-layout-menu .form-window-content .app-navigation-item {
    flex: 1;
    display: flex;
}

.project-layout-page-category-items {
    display: flex;
    flex-direction: column;
    color: white;
    flex: 1;
}

.media-selection-icons {
    display: none;
    position: absolute;
    right: unset;
    top: -2.5rem;
}

body.edit-layout .media-selection-icons {
    display: flex;
}

.media-selection-icons button {
    padding: .5rem;
}

.media-selection-icons i {
    font-size: 20px !important;
}

.media-selection-icons .edit-icon-button {
    color: cornflowerblue;
}

.media-selection-icons .delete-icon-button {
    color: red;
}

.project-layout .add-category-button-container {
    padding: 0.5rem;
    display: none;
    margin-left: 4rem;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
}

body.edit-layout .project-layout .add-category-button-container {
    display: block;
}

.project-layout .project-category {
    padding: 2rem 0rem;
    padding-top: 0;
    padding-bottom: 0;
}

body.edit-layout .project-layout .project-category {
    padding-top: 2rem;
}

.project-layout-page-category-menu-item-container {
    position: relative;
    display: flex;
    align-items: baseline;
    transition: .3s;
    padding: 1.5rem 3.5rem;
    padding-top: 0px;
    padding-bottom: 0px;
}

.project-layout-page-category-menu-item {
    display: flex;
    align-items: baseline;
    opacity: 1;
}

.project-layout-page-category-menu-item-label {
    letter-spacing: 1px;
    font-size: 1.8rem;
    font-weight: 600;
    color: #E5E5E5;
}

.project-layout-page-category-menu-item:hover .project-layout-page-category-menu-item-label {
    color: white;
}

.project-layout-page-category-menu-item-link {
    display: flex;
    align-items: baseline;
    position: relative;
}

.project-layout-page-category-menu-item-link-label {
    transition: .5s;
    font-size: 1.2rem;
    padding-left: 1rem;
    opacity: 0;
    text-transform: uppercase;
}

.project-layout-page-category-menu-item:hover .project-layout-page-category-menu-item-link-label {
    opacity: 1;
}

.project-layout-page-category-menu-item-link-icon {
    transition: .5s;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    position: absolute;
    left: 0rem;
    top: 4px;
    font-size: 1rem;
}

.project-layout-page-category-menu-item:hover .project-layout-page-category-menu-item-link-icon {
    opacity: 1;
    left: 9.5rem;
}

.project-category-section-menu {
    display: flex;
    align-items: center;
    background-color: rgba(100,100,100,.1);
}

.project-category-section-menu-item-container {
    padding: 1px;
}

.project-category-section-menu-item {
    width: 1.5rem;
    height: 0.2rem;
    background-color: rgba(100,100,100,.3);
    border: solid 1px rgba(100,100,100,.3);
    padding: 1px;
}

.project-category-section-menu-item-container.selected {
    opacity: 1 !important;
}

    .project-category-section-menu-item-container.selected .project-category-section-menu-item {
        background-color: rgba(100,100,100,.5);
        border: solid 1px rgba(100,100,100,.5);
    }

.project-layout-page-category-container {
    display: flex;
    position: relative;
    align-items: center;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
    /*overflow:hidden;*/
}

    .project-layout-page-category-container .slprev, .project-layout-page-category-container .slnext {
        display: flex !important;
        position: sticky;
        top: unset;
        margin: 0;
        padding: 4rem 1rem;
    }

    .project-layout-page-category-container .slprev {
        position: absolute;
        top: 0;
        left: 0;
        height: 295px;
        padding-top: 0;
        padding-bottom: 0;
        align-items: center;
    }

    .project-layout-page-category-container .slnext {
        position: absolute;
        top: 0;
        right: 0;
        height: 295px;
        padding-top: 0;
        padding-bottom: 0;
        align-items: center;
    }

    .project-layout-page-category-container .loader-io {
        flex: 1;
    }

.project-category-section {
    flex: 1;
    display: flex;
    align-items: center;
    padding-left: 3.5rem;
}

.media-selection {
    /* transition: .3s;*/
    border-radius: 5px;
    margin-right: 2px;
    margin-left: 2px;
    position: relative;
    width: 295px;
    height: 295px;
    /*box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);*/
}

    .media-selection.slow-transition {
        transition: none !important;
        z-index: 201;
    }
    /*.media-selection.is-ready {
    cursor: pointer;
    
}*/
    .media-selection.is-ready:hover,
    .media-selection.is-ready:focus,
    .media-selection.has-playback {
        transform: scale(1.1);
        z-index: 10;
    }

    /*.media-selection.fixed-window {
        transform: translateX(50%) !important;
        overflow: auto;
    }*/
    /*.media-selection.is-ready {
    background-color: transparent !important;
    box-shadow:none;
}*/
    .media-selection .image {
        background: rgba(50,50,50,.2);
        background: #1A1A1A;
        /*border: solid 1px #1A1A1A;*/
        overflow: hidden;
        position: relative;
        width: 295px;
        height: 295px;
        /*box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);*/
        border-radius: 5px;
        display: flex;
    }

    .media-selection.is-ready:hover .image,
    .media-selection.is-ready:focus .image {
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
    }

    .media-selection.selected .image {
        background: rgba(100,100,100,.2);
        background: #242424;
    }

    .media-selection img {
        object-fit: contain;
        width: 100%;
        height: 100%;
        z-index: 3;
        transition: .3s;
    }

    .media-selection.fixed-window > .image.pad-image img {
        margin-top: 1rem;
        padding-bottom: 5.5rem;
    }

    .media-selection.fixed-window > image.contain-data img {
        margin-top: 0rem;
        padding-bottom: 0rem;
        position: absolute;
        width: unset;
        height: unset;
        bottom: 7rem;
        left: 2rem;
        max-width: 26rem;
    }

    .media-selection.has-playback > .image img {
        opacity: 0 !important;
        pointer-events: none;
    }

    .media-selection > .image.no-image > img {
        display: none !important;
    }

    .media-selection .background-image {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        pointer-events: none;
        filter: blur(30px);
        transform: scale(1.1);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: 0% 0%;
        opacity: .7;
        WIDTH: 100%;
        transition: .3s;
    }

    .media-selection.fixed-window > .image.contain-data .background-image {
        pointer-events: initial;
        transform: none;
        filter: none;
        opacity: 1;
    }

    .media-selection.has-playback > .image .background-image {
        opacity: 0 !important;
    }

    .media-selection > .image.no-image span {
        display: block;
    }

    .media-selection > .image span {
        font-size: 1.6rem;
        white-space: normal;
        color: #fff;
        padding: 5px;
        display: none;
    }

    .media-selection > .image .play-container {
        opacity: 0;
        transition: .1s;
    }

    .media-selection.is-ready:hover > .image .play-container,
    .media-selection.is-ready:focus > .image .play-container,
    .media-selection.has-playback > .image .play-container,
    .media-selection.fixed-window > .image .play-container {
        opacity: 1;
    }

    .media-selection > .image .play {
        position: absolute;
        left: 10px;
        bottom: 10px;
        font-size: 1.4rem;
        border-radius: 10px;
        /*box-shadow: 0 0 10px 1px rgb(0 0 0 / 30%);*/
        opacity: .7;
        transition: .3s;
        z-index: 5;
        display: none;
    }

    .media-selection.is-ready:hover > .image .play,
    .media-selection.is-ready:focus > .image .play,
    .media-selection.has-playback > .image .play {
        display: flex;
    }

    .media-selection.fixed-window > .image .play {
        display: none !important;
    }

    .media-selection > .image .info-container {
        opacity: 0;
        transition: .1s;
    }

    .media-selection.fixed-window > .image .info-container {
        display: none !important;
    }

    .media-selection.is-ready:hover > .image .info-container,
    .media-selection.is-ready:focus > .image .info-container,
    .media-selection.has-playback > .image .info-container {
        opacity: 1;
    }

    .media-selection > .image .info {
        position: absolute;
        right: 10px;
        bottom: 10px;
        font-size: 1.4rem;
        border-radius: 10px;
        /*box-shadow: 0 0 10px 1px rgb(0 0 0 / 30%);*/
        opacity: .7;
        transition: .3s;
        z-index: 5;
        display: none;
    }

    .media-selection.is-ready:hover > .image .info,
    .media-selection.is-ready:focus > .image .info,
    .media-selection.has-playback > .image .info {
        display: flex;
    }


    .media-selection > .image .close-container {
        opacity: 0;
        transition: .1s;
    }

    .media-selection.is-ready:hover > .image .close-container,
    .media-selection.is-ready:focus > .image .close-container,
    .media-selection.has-playback > .image .close-container,
    .media-selection.fixed-window > .image .close-container {
        opacity: 1;
    }

    .media-selection > .image .close {
        position: absolute;
        right: 10px;
        top: 10px;
        font-size: 1.4rem;
        border-radius: 10px;
        /* box-shadow: 0 0 10px 1px rgb(0 0 0 / 30%);*/
        opacity: .7;
        transition: .3s;
        z-index: 5;
        display: none;
    }

    .media-selection.fixed-window > .image .close {
        display: flex;
    }

    .media-selection > .wrapper .container {
        position: relative;
        padding-top: 10px;
        padding-left: 10px;
        padding-right: 7px;
        padding-bottom: 10px;
        transition: all .1s;
        /* min-height: 58px; */
        cursor: pointer;
        background-color: black;
        /*border: solid 1px #1A1A1A;*/
        width: 100%;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);
        border-radius: 5px;
        opacity: 0;
        pointer-events: none;
        border-top-left-radius: 0px;
        border-top-right-radius: 0px;
        margin-top: -1px;
    }

    .media-selection.fixed-window > .wrapper .container {
        opacity: 1;
        pointer-events: initial;
        box-shadow: none;
        background-color: transparent;
        cursor: default;
        height: 100%;
        box-shadow: none;
        margin-top: -5px;
        padding-left: 2rem;
        padding-right: 2rem;
        font-size: 2rem;
        padding-top: 0;
        margin-top: 0rem;
        top: -2rem;
        position: absolute;
        line-height: 1.1;
    }

    .media-selection.fixed-window > .wrapper {
        box-shadow: -20px -20px 40px 40px inherit;
        box-shadow: -20px -20px 75px 91px inherit;
        box-shadow: -20px -20px 50px 66px inherit;
        position: relative;
        z-index: 5;
    }

    .media-selection.is-ready:hover > .wrapper .container,
    .media-selection.is-ready:focus > .wrapper .container,
    .media-selection.has-playback > .wrapper .container {
        opacity: 1;
        pointer-events: initial;
    }

    .media-selection > .wrapper .container .name {
        font-size: 1.1rem;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .media-selection.fixed-window > .wrapper .container .name {
        font-size: 2.4rem;
        white-space: normal;
    }

    .media-selection > .wrapper .container .name2 {
        font-size: 1.6rem;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .media-selection > .wrapper .container .name3 {
        font-size: 1.4rem;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    .media-selection > .wrapper .container .info {
        font-size: .8rem;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding-top: 2px;
    }

    .media-selection.fixed-window > .wrapper .container .info {
        display: none;
    }

    .media-selection iframe {
        position: absolute;
    }

/*.media-selection.fixed-window {
        border-radius: 6px;
        border-color: transparent;
        background: inherit;
        color: white;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);
        position: fixed;
        overflow: hidden;
        top: 2rem;
        width: 850px;
        max-width: 80%;
        height: 97vh;
        max-height: 100% !important;
        border-bottom-left-radius: 0px;
        border-bottom-right-radius: 0px;
        z-index: 201 !important;
        overflow: auto;
    }
*/
.project-layout-curtain {
    display: none;
    position: fixed;
    z-index: 200;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,.7);
    opacity: 0;
    pointer-events: none;
    transition: .3s;
}

    .project-layout-curtain.show {
        display: flex;
    }

    .project-layout-curtain.reveal {
        opacity: 1;
        pointer-events: initial;
    }

.media-selection.fixed-window > .image {
    width: 100% !important;
    height: 55% !important;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    margin-bottom: 0.5rem;
}

.media-selection.fixed-window .background-gradient {
    background: linear-gradient(to top,inherit,transparent 50%);
}

.media-selection-info {
    display: none;
    position: absolute;
    left: 0;
    top: 73%;
}

.media-selection.fixed-window .media-selection-info {
    display: flex;
    position: absolute;
    left: 0;
    right: 0;
    top: 80%;
    padding-left: 2rem;
    padding-right: 2rem;
    z-index: 10;
    top: unset;
    bottom: 3rem;
}

.media-selection.fixed-window .media-selection-data {
    width: 100%;
}

.media-selection-actions {
    display: flex;
    align-items: center;
    z-index: 5;
}

    .media-selection-actions .button-play {
        border-radius: 5px;
        color: black;
        background-color: white;
    }

        .media-selection-actions .button-play label {
            font-size: 1.4rem !important;
        }

    .media-selection-actions .button-love {
        font-size: 2rem;
        margin-left: 0.7rem;
        margin-right: 0.5rem;
    }

    .media-selection-actions .button-like {
        font-size: 2rem;
        margin-left: 0rem;
        margin-right: 0rem;
    }

.media-selection .container .header {
    display: none;
}

.media-selection.fixed-window .container .header {
    display: flex;
    align-items: center;
    font-size: 1.2rem;
    padding-bottom: 0.5rem;
    padding-top: 0.5rem;
}

.media-selection.fixed-window .container .header-item {
    margin-left: 0rem !important;
    margin-right: 1rem !important;
    display: flex;
    align-items: center;
}

    .media-selection.fixed-window .container .header-item.rating label {
        border: solid 1px rgba(100,100,100.3);
        padding: 0.1rem 0.3rem;
        font-size: 1rem;
    }

    .media-selection.fixed-window .container .header-item.quality label {
        border: solid 1px rgba(100,100,100.3);
        padding: 0.1rem 0.3rem;
        font-size: .9rem;
        padding-top: 0.2rem;
        letter-spacing: 1px;
        border-radius: 5px;
    }

.media-selection .media-selection-description {
    display: none;
}

.media-selection.fixed-window .media-selection-description {
    display: block;
}

    .media-selection.fixed-window .media-selection-description > label {
        font-size: 1.2rem;
        line-height: 1.4;
        padding-top: 0.5rem;
        color: lightgray;
    }

.subsection .app-form-field {
    padding-bottom: .3rem;
}

.media-selection.fixed-window .app-form-edit-field.name .app-form-field {
    background-color: transparent;
}

.media-selection.fixed-window .app-form-edit-field.name .app-form-field-input {
    font-size: 2rem;
    background-color: transparent;
    color: inherit;
    padding: 0.5rem !important;
    border-color: rgba(100,100,100,.5) !important;
}

.media-selection.fixed-window .media-selection-description .app-form-field {
    background-color: transparent;
    height: 200px;
}

.media-selection.fixed-window .media-selection-description .app-form-field-input {
    font-size: 1.4rem;
    line-height: 1.4;
    background-color: transparent;
    color: inherit;
    padding: 0.5rem !important;
    border-color: rgba(100,100,100,.5) !important;
}

.media-selection.fixed-window .media-selection-description .app-form-field-input {
    font-size: 1.4rem;
    line-height: 1.4;
    background-color: transparent;
    color: inherit;
    padding: 0.5rem !important;
    border-color: rgba(100,100,100,.5) !important;
}

.media-selection-subitems {
    display: none;
}

.media-selection.fixed-window .media-selection-subitems {
    display: block;
}

.media-selection-subitems-header {
    padding-top: 2rem;
    border-bottom: solid 1px rgba(100,100,100,.3);
    margin-bottom: 1.6rem;
    padding-bottom: 0.7rem;
    display: flex;
    align-items: end;
}

.media-selection-subitems-header-title {
    font-size: 1.8rem;
    flex: 1;
}

.media-selection-subitems-header-selector-item {
    font-size: 1.2rem;
    background-color: rgb(30,30,30);
    padding: 0.7rem 1rem;
    border: solid 1px rgba(100,100,100,.3);
    cursor: pointer;
    border-radius: 5px;
    transition: .3s;
}

    .media-selection-subitems-header-selector-item:hover {
        background-color: rgb(40,40,40);
    }

    .media-selection-subitems-header-selector-item label {
        padding-right: 2rem;
    }

body.dark-mode .media-selection .app-button {
    background: rgba(100,100,100, .5);
    border-color: rgba(100,100,100, .5);
}

    body.dark-mode .media-selection .app-button:hover {
        background: rgb(100,100,100);
        border-color: rgb(100,100,100);
    }

    body.dark-mode .media-selection .app-button:focus {
        background: rgb(80,80,80);
        border-color: rgb(80,80,80);
    }

    body.dark-mode .media-selection .app-button:active {
        background: rgb(40,40,40);
        border-color: rgb(40,40,40);
    }



.project-quick-access-list {
}

.project-quick-access-items {
}

.project-quick-access-item {
    display: flex;
    overflow: hidden;
    position: relative;
    padding: 1.5rem 1rem;
    border-radius: 5px;
    background-color: transparent;
    transition: .3s;
    align-items: center;
    margin-bottom: .5rem;
}

.project-quick-access-item-index-container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem 2.5rem;
    font-size: 2rem;
    width: 50px;
    min-width: 50px;
    padding-right: 3rem;
    padding-left: 2rem;
}

.project-quick-access-item-index {
}

.project-quick-access-item-image-container {
    width: 200px;
}

.project-quick-access-item-image {
    max-width: 150px;
    max-height: 150px;
    transition: .3s;
}

.project-quick-access-item-background-image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    filter: blur(30px);
    transform: scale(1.1);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0% 0%;
    opacity: .7;
    z-index: -1;
    WIDTH: 100%;
    height: 100%;
    background-color: black;
}

.project-quick-access-item-data-container {
    padding-left: 1rem;
}

.project-quick-access-item-title-container {
    display: flex;
}

.project-quick-access-item-title {
    font-size: 1.4rem;
    padding: 0.5rem 0rem;
    flex: 1;
    padding-top: 0;
}

.project-quick-access-item-info {
}

.project-quick-access-item-message {
    min-height: 7px;
    max-height: 5rem;
    overflow: auto;
}

.project-quick-access-item-image-container {
    position: relative;
}

.project-quick-access-item-icon-container {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 3rem;
    transition: .3s;
    opacity: 0;
}

.project-quick-access-item:hover .project-quick-access-item-icon-container {
    opacity: 1;
}

.project-quick-access-item:active .project-quick-access-item-icon-container {
    opacity: .7;
    transition-duration: 0;
}

.project-quick-access-item:hover .project-quick-access-item-image {
}

.project-quick-access-item:active .project-quick-access-item-image {
    opacity: 1;
    transition-duration: 0;
}

.project-quick-access-item .add-icon-button {
    opacity: .7;
    transition: .3s;
}

.project-quick-access-item:hover .add-icon-button {
    opacity: 1;
}

.project-quick-access-item:active .add-icon-button {
    opacity: .8;
    transition-duration: 0;
}

.project-quick-access-item:active,
.project-quick-access-item.selected {
    background-color: #333;
}

.project-quick-access-item-icons {
    display: flex;
    position: absolute;
    top: 0;
    right: 1rem;
}

.library-item .project-quick-access-item-icons {
    top: .5rem;
}

.project-quick-access-item-icons button {
    margin: .5rem;
}

    .project-quick-access-item-icons i {
        font-size: 20px !important;
    }

    .project-quick-access-item-icons .edit-icon-button {
        color: cornflowerblue;
    }

    .project-quick-access-item-icons .delete-icon-button {
        color: red;
    }

.project-layout .project-quick-access-item-icons {
    display: none;
    position: absolute;
    top: -1rem;
    right: unset;
}

body.edit-layout .project-layout .project-quick-access-item-icons {
    display: flex;
    display:none;
}
/*body.edit-layout .project-layout .project-quick-access-item-icons button {
    padding:0px;
}*/
.project-layout .project-quick-access-item-icons i {
    font-size: 14px !important;
}

.project-layout .project-layout-header-logo-image-container .project-quick-access-item-icons {
    top: -27px !important;
    right: unset !important;
}



.media-selection-spacer {
    display: none;
}

.media-selection.fixed-window .media-selection-spacer {
    display: block;
    height: 5rem;
    width: 100%;
}

.project-category-section-list {
}

.media-selection-subitems {
}

.media-selection-subitem {
    display: flex;
    overflow: hidden;
    position: relative;
    padding: 1.5rem 1rem;
    background-color: transparent;
    transition: .3s;
    align-items: flex-start;
    margin-bottom: .5rem;
    border-bottom: solid 1px rgba(100,100,100,.3);
}

.media-selection-subitem-index-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 1rem 2.5rem;
    font-size: 1.6rem;
    width: 50px;
    min-width: 50px;
    padding-right: 1rem;
    padding-left: 1rem;
    text-shadow: -1px 1px 2px rgb(0, 0, 0);
    color: whitesmoke;
}

.media-selection-subitem-index {
}

.media-selection-subitem-image-container {
    width: 150px;
    max-width: 150px;
    min-width: 150px;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

.media-selection-subitem-image {
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);
    border: solid 1px rgba(100,100,100,.3);
}

.media-selection-subitem-data-container {
    padding-left: 1rem;
}

.media-selection-subitem-title-container {
    display: flex;
    align-items: baseline;
}

.media-selection-subitem-title {
    font-size: 1.4rem;
    padding: 0.5rem 0rem;
    flex: 1;
    padding-top: 0;
    text-shadow: -1px 1px 2px rgb(0, 0, 0);
}

.media-selection-subitem-info {
    font-size: 1rem;
}

.media-selection-subitem-message {
    min-height: 7px;
    max-height: 10rem;
    overflow: auto;
    font-size: 1rem;
    line-height: 1.4;
    color: lightgray;
}

.media-selection-subitem-image-container {
    position: relative;
}

.media-selection-subitem-icon-container {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    transition: .3s;
    opacity: 0;
    text-shadow: -1px 1px 2px rgb(0, 0, 0);
}

.media-selection-subitem:hover .media-selection-subitem-icon-container {
    opacity: .5;
}

.media-selection-subitem:active .media-selection-subitem-icon-container {
    opacity: .5;
    transition-duration: 0;
}

.media-selection-subitem:hover .media-selection-subitem-image {
}

.media-selection-subitem:active .media-selection-subitem-image {
    opacity: 1;
    transition-duration: 0;
}

.media-selection-subitem .add-icon-button {
    opacity: .7;
    transition: .3s;
}

.media-selection-subitem:hover .add-icon-button {
    opacity: 1;
}

.media-selection-subitem:active .add-icon-button {
    opacity: .8;
    transition-duration: 0;
}

.media-selection-subitem:active,
.media-selection-subitem.selected {
    background-color: #333;
    border-radius: 5px;
}

.media-selection-subitem-icons {
    display: flex;
    position: absolute;
    top: 0;
    right: 1rem;
}

    .media-selection-subitem-icons button {
        padding: .5rem;
    }

    .media-selection-subitem-icons i {
        font-size: 20px !important;
    }

    .media-selection-subitem-icons .edit-icon-button {
        color: cornflowerblue;
    }

    .media-selection-subitem-icons .delete-icon-button {
        color: red;
    }

.project-layout .media-selection-subitem-icons {
    display: none;
    position: absolute;
    top: -1.5rem;
    right: 0rem;
}

body.edit-layout .project-layout .media-selection-subitem-icons {
    display: flex;
}
/*body.edit-layout .project-layout .media-selection-subitem-icons button {
    padding:0px;
}*/
.project-layout .media-selection-subitem-icons i {
    font-size: 14px !important;
}

.project-layout .project-layout-header-logo-image-container .media-selection-subitem-icons {
    top: -27px !important;
    right: unset !important;
}

.media-selection.fixed-window::-webkit-scrollbar {
    width: 4px !important;
    height: 4px !important;
}

.media-selection-subitem-details {
    display: none;
}
.app-navigation-subitems .app-navigation-item > a .app-navigation-spinner {
    margin-left: 0.5rem;
    margin-right: 0.2rem;
    padding: 0;
    background-color: transparent;
}

.form-window-content .app-navigation-subitems .app-navigation-item > a .app-navigation-icon {
    margin-right: 0.5rem !important;
    margin-left: 0.75rem;
    /* display: none;*/
    display: flex;
    justify-content: center;
    align-items: center;
}
/*
.form-window-content .app-navigation-item .button-edit {
    margin-left:1rem;
    margin-right:.5rem;
}
.form-window-content .app-navigation-item .button-delete {
    margin-left: .5rem;
    margin-right: 1rem;
}
*/
.form-window-content .app-navigation-item a .app-navigation-icon > span {
    position: relative;
    top: 3px;
}

.media-item-artwork img {
    object-fit: contain;
    width: 100%;
    height: 100%;
    max-height: 200px;
    max-width: 200px;
}

/*
.project-layout .form-window-fields-section-body header button.refresh-button {
    margin-left: .9rem;
}
*/
.app-sharing-content-buttons {
    display: flex;
    align-items: center;
    position: absolute;
    right: 1rem;
    top: 1rem;
    right: 10rem;
    top: -10rem;
    transition: .3s;
}

body.edit-layout .app-sharing-content-buttons {
    top: -2px;
}

.app-sharing-content-button {
    display: flex;
    align-items: center;
    padding: .3rem 1rem;
    border: solid 1px #0069D9;
    background-color: #0069D9;
    background-color: #1C1C22;
    border-color: #1C1C22;
    color: white;
    margin-left: 0rem;
    margin-right: 0rem;
    white-space: nowrap;
    cursor: pointer;
}

    .app-sharing-content-button:first-of-type {
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }

    .app-sharing-content-button:last-of-type {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .app-sharing-content-button > div {
        flex: 1;
        padding-right: 5px;
    }

    .app-sharing-content-button > i {
        padding: 5px;
        cursor: pointer;
    }





#search-wrapper {
    /*width:330px;*/
    flex: 1;
    background-color: #F5F5F5;
    /*border:solid 1px #c6c6c6;*/
    display: flex;
    flex-direction: column;
    color: #404040;
    font-size: 16px;
    border-top: none;
}

    #search-wrapper > .header {
        padding: 10px 20px;
        display: flex;
        padding-top: 0px;
    }

    #search-wrapper .tab-page > .header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-bottom: 10px;
        margin: 0 15px 5px 15px;
        border-bottom: solid 1px #d9d9d9;
        margin-bottom: 0;
    }

    #search-wrapper .actions .buffer {
        width: 40px;
    }

    #search-wrapper .actions {
        display: flex;
        flex-direction: column;
        padding-bottom: 10px;
    }

.app-header #search-wrapper .actions button {
    font-size: .7rem;
    border: solid 1px #b3b3b3;
    background-color: #fff;
    border-radius: 5px;
    padding: 1px 5px;
    padding-top: 3px;
    padding-bottom: 3px;
    margin-top: 5px;
}

    .app-header #search-wrapper .actions button:hover {
        color: #0069D9;
        border-color: #0069D9;
    }

    .app-header #search-wrapper .actions button:active {
        color: #fff;
        background-color: #0069D9;
    }

#search-wrapper .tab-page > section {
    overflow-y: auto;
    flex: 1;
    text-align: left;
}

#search-wrapper .item-count {
    color: #9a9aa2;
    font-size: .8rem;
    padding-bottom: 4px;
}


#search-wrapper .header .title {
    display: flex;
    flex-direction: column;
    text-align: left;
}

#search-wrapper section.main {
    flex: 1;
    display: flex;
    flex-direction: column;
    /*text-align:left;*/
}

/*#search-wrapper .label {
    font-size: .95em;
}
*/
#search-wrapper .media-no-items {
}

    #search-wrapper .media-no-items.hide {
        display: none;
    }

    #search-wrapper .media-no-items .media-item {
        justify-content: center;
        font-size: .75em;
    }

#search-wrapper .media-items {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 14px;
    cursor: default;
    margin-top: .5rem;
}

    #search-wrapper .media-items > li {
        margin-bottom: .5rem;
    }

#search-wrapper .media-item {
    display: flex;
    align-items: center;
    padding: 5px;
    position: relative;
    border-top: solid 1px transparent;
    border-bottom: solid 1px transparent;
    padding-top: 7px;
    padding-bottom: 7px;
    padding-left: 10px;
    width: 100%;
    cursor: default !important;
}

    #search-wrapper .media-item.hide {
        display: none;
    }

#search-wrapper .selected .media-item {
    color: #fff;
    background-color: #0069D9;
}

#search-wrapper .media-item .library-item-details {
    font-size: .7rem;
    /* text-align: right;*/
    display: none;
}

    #search-wrapper .media-item .library-item-details button {
        margin-left: 5px;
        margin-right: 5px;
    }

#search-wrapper .media-item .playback-indicator {
    width: 10px;
    padding-left: 3px;
    padding-right: 3px;
    display: none;
}

    #search-wrapper .media-item .playback-indicator img {
        display: none;
    }

#search-wrapper .media-item.playing .playback-indicator img {
    display: block;
}

#search-wrapper .media-item .artwork {
    margin-right: .7rem;
    margin-left: 0rem;
    max-width: 120px;
    box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
    /*border: solid 1px #D3D3D3;*/
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
}

#search-wrapper .media-item .artwork-list {
    position: relative;
    z-index: 5;
    margin-right: .7rem;
    left: -2px;
    top: -2px;
}

    #search-wrapper .media-item .artwork-list img {
        max-width: 120px;
        /*box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);*/
        border: solid 1px #D3D3D3;
    }

    #search-wrapper .media-item .artwork-list.single-image img {
        box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
    }

    #search-wrapper .media-item .artwork-list img.before {
        left: 3px;
        top: 3px;
        z-index: -1;
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #eee;
    }

    #search-wrapper .media-item .artwork-list.double-image img.before {
        box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
    }

    #search-wrapper .media-item .artwork-list.single-image img.before {
        display: none;
    }

    #search-wrapper .media-item .artwork-list img.after {
        left: 6px;
        top: 6px;
        z-index: -2;
        box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #eee;
    }

    #search-wrapper .media-item .artwork-list.double-image img.after {
        display: none;
    }

    #search-wrapper .media-item .artwork-list.single-image img.after {
        display: none;
    }

#search-wrapper .media-item .media-info {
    flex: 1;
    text-align: left;
    width: 29rem;
    line-height:normal;
}

    #search-wrapper .media-item .media-info span {
        margin-right: 3px;
    }

        #search-wrapper .media-item .media-info span:last-child {
            margin-right: 0;
        }

    #search-wrapper .media-item .media-info .big {
        font-size: 1rem;
        white-space: nowrap;
        overflow-x: hidden;
        text-overflow: ellipsis;
        overflow: hidden;
        padding: 1px;
        /*max-width: 275px;*/
       /* max-width: 460px;*/
    }

    #search-wrapper .media-item .media-info .small {
        font-size: .9rem;
        /*color: dimgray;*/
        padding: 1px;
        padding-top: 3px;
        white-space: nowrap;
        overflow-x: hidden;
        text-overflow: ellipsis;
        overflow: hidden;
      /*  max-width: 275px;*/
    }

#search-wrapper .media-item.selected .media-info .small {
    color: inherit;
}

#search-wrapper .media-item .media-info .big .time {
    padding-left: 7px;
    font-size: .7em;
    color: dimgray;
    padding-top: 3px;
}

#search-wrapper .media-item .media-info .name, .media-item .media-info .album-name {
}

#search-wrapper .media-item .media-info > section {
    color: #9a9aa2;
}

#search-wrapper .media-item.selected .media-info > section {
    color: #fff;
}

#search-wrapper .media-item .remove-button {
    position: absolute;
    left: 2px;
    top: 20px;
    font-size: 1.1em;
    background-color: #d0d0d0;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    cursor: pointer;
}

#search-wrapper .media-item.selected .remove-button {
    background-color: #999;
}

#search-wrapper .media-item .remove-button .glyph {
    position: absolute;
    left: 2.5px;
    top: -3px;
    -webkit-user-select: none;
    user-select: none;
}

#search-wrapper .media-item .default {
    display: none;
}

#search-wrapper .no-items .media-item .default {
    display: block;
}

#search-wrapper .media-item .context-menu-button {
    position: absolute;
    right: 10px;
    top: 25px;
    font-size: 1.2em;
    width: 15px;
    height: 15px;
    color: #0069D9;
    display: none !important;
}

#search-wrapper .media-item.selected .context-menu-button {
    color: #fff;
}

#search-wrapper .media-item .context-menu-button .glyph {
    position: absolute;
    left: 1.5px;
    top: -6px;
    -webkit-user-select: none;
    user-select: none;
    display: none !important;
}

#search-wrapper .media-item .hover-button {
    display: none;
}

#search-wrapper .media-item:hover .hover-button {
    display: none !important;
}

#search-wrapper .media-item .hover-button.selected {
    display: none !important;
}

#search-wrapper .media-item:hover .hover-button:hover, .media-item:hover .hover-button.open {
}

#search-wrapper .media-item.selected .hover-button:hover, .media-item.selected:hover .hover-button.open {
    color: #fff;
}


#search-wrapper .media-item .cache-state {
    /*position: absolute;*/
    z-index: 5;
    /* display: flex; */
    /* flex: 1; */
    /*width: 200px;*/
    display: block;
    margin-right: 10px;
    position: relative;
    top: 0px;
    padding-top: 5px;
}

#search-wrapper .media-item.caching .cache-state {
    display: block;
}

#search-wrapper .media-item.temp-cached .cache-state {
    display: block;
}

#search-wrapper .media-item.perm-cached .cache-state {
    display: block;
}

#search-wrapper .media-item .cache-state .container {
    display: none;
    flex-direction: column;
}

#search-wrapper .media-item.caching .cache-state .container {
    display: flex;
}

#search-wrapper .media-item .cache-state .container .message {
    font-size: 9px;
    /*color: black;*/
    padding-bottom: 2px;
}

#search-wrapper .selected .media-item .cache-state .container .message {
    /* color:lightgray;*/
}

#search-wrapper .media-item .cache-state .container .progress {
    height: 4px;
    width: 100%;
    border: solid 1px lightgray;
    display: flex;
}

    #search-wrapper .media-item .cache-state .container .progress .percent {
        background-color: cornflowerblue;
    }

#search-wrapper .media-item .cache-state .cached-container {
    display: flex;
    flex-flow: column;
    align-items: flex-end;
}


    #search-wrapper .media-item .cache-state .cached-container .uncached {
        display: flex;
        font-size: 12px;
        color: gray;
        text-align: right;
        cursor: pointer;
    }

#search-wrapper .media-item.temp-cached .cache-state .cached-container .uncached {
    display: none;
}

#search-wrapper .media-item.perm-cached .cache-state .cached-container .uncached {
    display: none;
}

#search-wrapper .media-item.caching .cache-state .cached-container .uncached {
    display: none;
}

#search-wrapper .media-item.pre-cache .cache-state .cached-container .uncached {
    display: none;
}

#search-wrapper .media-item.selected .cache-state .cached-container .uncached {
    color: #fff;
}


#search-wrapper .media-item .cache-state .cached-container .caching {
    display: none;
    font-size: 12px;
    color: #1d8cf8;
    text-align: right;
    cursor: pointer;
}

#search-wrapper .media-item.temp-cached .cache-state .cached-container .caching {
    color: #1d8cf8;
}

#search-wrapper .media-item.perm-cached .cache-state .cached-container .caching {
    color: green;
}

#search-wrapper .media-item.pre-cache .cache-state .cached-container .caching {
    display: flex;
}

#search-wrapper .media-item.selected .cache-state .cached-container .caching {
    color: #fff;
}


#search-wrapper .media-item .cache-state .cached-container .cached {
    display: none;
    font-size: 12px;
    color: #1d8cf8;
    text-align: right;
    cursor: pointer;
}

#search-wrapper .media-item.temp-cached .cache-state .cached-container .cached {
    display: flex;
}

#search-wrapper .media-item.perm-cached .cache-state .cached-container .cached {
    display: flex;
    color: green;
}

#search-wrapper .media-item.pre-cache .cache-state .cached-container .cached {
    display: none !important;
}

#search-wrapper .media-item.caching .cache-state .cached-container .cached {
    display: none !important;
}

#search-wrapper .media-item.selected .cache-state .cached-container .cached {
    color: #fff;
}



#search-wrapper .app-header-info {
    display: none;
    flex: 1;
    justify-content: center;
    padding-top: 0px;
}

#search-wrapper .app-header-tab {
    padding-left: 10px;
    padding-right: 10px;
    border: solid 1px silver;
    background-color: rgb(221, 221, 221);
    padding-top: 3px;
    padding-bottom: 3px;
    text-align: center;
    font-size: .75em;
    transition: .2s ease-in-out;
}

    #search-wrapper .app-header-tab:hover {
        background-color: silver;
    }

    #search-wrapper .app-header-tab.select {
        background-color: #0069D9;
        border-color: #0069D9;
        color: white;
    }

    #search-wrapper .app-header-tab.left {
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
        border-right: none;
    }

    #search-wrapper .app-header-tab.right {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        border-left: none;
    }

#search-wrapper .section-header-label {
    font-size: 1rem;
    padding: .5rem;
    padding-bottom: 5px;
    padding-top: 0;
    padding-left:1rem;
    display:none;
}

#search-wrapper .section-header-info {
    padding: .5rem 0;
    font-size: .8rem;
    font-style: italic;
    /*padding-top:10px;*/
    display: none;
}

#search-wrapper.no-items .section-header-info {
    display: block;
}

#search-wrapper.is-searching .section-header-info {
    display: block;
}

#search-wrapper .has-items .section-header-info {
    display: block;
    padding: 0;
}

#search-wrapper .section-header-info > span.more-items {
    color: royalblue;
    text-decoration: underline;
    font-style: normal;
}

#search-wrapper .section-header-info > span.all-items {
    font-style: normal;
}

#search-wrapper .section-header-info > span.all-items {
    font-style: normal;
}

#search-wrapper .section-items {
}

#search-wrapper .section-item {
}

#search-wrapper .section-container {
    padding-top: 10px;
    padding-left: 0px;
}

.loading-content .loading-container {
    padding-top: 5px;
    display: flex;
    align-items: center;
    font-style: italic;
}
.loading-content.static {
    position: absolute;
    background-color: rgba(0,0,0,.3);
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    z-index:100;
}
    .loading-content .loading-container label {
        padding-left: 5px;
        padding-top: 2px;
    }



#search-queue-container {
    display: none;
    opacity: 1;
    color: #fff;
    text-align: center;
    margin: 5px 0;
    border-radius: 5px;
    position: absolute;
    z-index: 15001;
    top: 48px;
    left: 0px;
    border: solid 0px lightgray;
    /*border-left:none;
    border-right:none;*/
    box-shadow: 0px 3px 6px 2px rgba(163, 157, 163, 0.25);
    margin-bottom: 3px;
    background-color: #1C1C22;
}

body.light-mode #search-queue-container {
    background-color: whitesmoke;
}
body.dark-mode #search-queue-container {
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
    box-shadow: 0 16px 38px -12px rgb(0 0 0 / 56%), 0 4px 25px 0 rgb(0 0 0 / 12%), 0 8px 10px -5px rgb(0 0 0 / 20%);
}

    #search-queue-container.show {
        display: flex;
        opacity:1;
    }

    #search-queue-container.reveal {
        opacity: 1;
    }

#search-queue-container .before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    /* At the top of the tooltip */
    left: 50%;
    right: unset;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #1C1C22 transparent;
    pointer-events: none;
}


#search-wrapper .main > .header {
    display: flex;
    /*align-items: center;*/
    justify-content: space-between;
    /*padding-bottom: 8px;*/
    margin: 0 15px 5px 15px;
    border-bottom: solid 1px #d9d9d9;
    margin-bottom: 0;
    align-items: baseline;
    padding-left: 0.5rem;
}

#search-wrapper .main section.content {
    overflow-y: auto;
    overflow-x: hidden;
    flex: 1;
    text-align: left;
    min-width: 400px;
    max-height: 450px;
    min-height: 450px;
    padding-left: 0px;
    padding-bottom: 10px;
}

#search-wrapper .item-count {
    color: #9a9aa2;
    font-size: .7rem;
}


#search-wrapper header .title {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

#search-wrapper header .description {
    padding-left: 4px;
}

#search-wrapper section.main {
    flex: 1;
    display: flex;
    flex-direction: column;
}

#search-wrapper .tab-page {
    opacity: 0;
}

    #search-wrapper .tab-page.show {
        opacity: 1;
    }

#search-wrapper header .title {
    color: #404040;
    margin-bottom: 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
}

#search-wrapper .label {
    font-size: 1.2rem;
    /* padding-top: 1px; */
    text-align: left;
    padding-left: 0px;
    padding-top: 5px;
}

#search-wrapper .section-header-info .showMoreLink {
    display: none;
}

#search-wrapper.no-items .section-header-info .showMoreLink {
    display: block;
    padding-top: 3px;
    font-size: .9rem;
}

#search-wrapper .section-header-info .loading-status {
    display: none;
}

#search-wrapper.is-searching .section-header-info .loading-status {
    display: block;
}

#search-wrapper.is-searching .section-header-info .showMoreLink {
    display: none;
}

#search-wrapper .section-header-info .loading-container {
    justify-content: center;
}



#search-wrapper {
    background-color: unset;
    color: white;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

    #search-wrapper .item-count {
        color: white;
    }

    #search-wrapper header .title {
        color: white;
    }

/*.app-form-field-autocomplete-selection {
    max-height: 500px;
    height: 500px;
}*/

    .app-form-field-autocomplete-selection .form-window-body {
        padding-left: 0rem;
        padding-right: 0rem;
        flex: 1;
        display: flex;
        flex-direction: column;
        padding: 0px;
    }

#search-wrapper .main section.content {
    min-width: 30.5vw;
    max-height: unset;
    overflow: unset;
    min-height: unset;
    overflow: auto;
    position: relative;
}
.form-window-content #search-wrapper {
    margin-left: 0rem; 
    margin-right: 0rem;
}
.form-window-content #search-wrapper .main section.content {
    min-width: unset;
    overflow-x: hidden;
}

.form-window-content .form-window-footer {
    margin-left: .5rem;
    margin-right: .5rem;
    padding-bottom: 0;
    margin-bottom: 0.5rem;
}

.media-field-search .app-page-row-textbox > .media-item .artwork {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);
}

#search-queue-container {
    display: none;
}

#search-wrapper .main > .header {
    border-color: rgba(100,100,100,.3);
}

.app-search-content-button-icon-down {
    display: none;
}

#search-wrapper .content-items {
    position: absolute;
    width: 100%;
}

.media-field-search {
    display: flex;
    flex-direction: column;
    flex: 1;
    width: 100%;
}

    .media-field-search .form-window-content .content > .container {
        display: flex;
        flex-direction: column;
        flex: 1;
        max-width:100%;
    }

    .media-field-search .media-item {
        display: flex;
    }



    .media-field-search .app-page-row-textbox > .media-item {
        display: flex;
        align-items: center;
        padding: 5px;
        position: relative;
        border-top: solid 1px transparent;
        border-bottom: solid 1px transparent;
        padding-top: 7px;
        padding-bottom: 7px;
        padding-left: 10px;
        width: 100%;
        cursor: default !important;
    }

        .media-field-search .app-page-row-textbox > .media-item.hide {
            display: none;
        }

#search-wrapper .selected .media-item {
    color: #fff;
    background-color: #0069D9;
}

.media-field-search .app-page-row-textbox > .media-item .library-item-details {
    font-size: .7rem;
    /* text-align: right;*/
    display: none;
}

    .media-field-search .app-page-row-textbox > .media-item .library-item-details button {
        margin-left: 5px;
        margin-right: 5px;
    }

.media-field-search .app-page-row-textbox > .media-item .playback-indicator {
    width: 10px;
    padding-left: 3px;
    padding-right: 3px;
    display: none;
}

    .media-field-search .app-page-row-textbox > .media-item .playback-indicator img {
        display: none;
    }

.media-field-search .app-page-row-textbox > .media-item.playing .playback-indicator img {
    display: block;
}

.media-field-search .app-page-row-textbox > .media-item .artwork {
    margin-right: .7rem;
    margin-left: 0rem;
    max-width: 68px;
    box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
    /*border: solid 1px #D3D3D3;*/
}

.media-field-search .app-page-row-textbox > .media-item .artwork-list {
    position: relative;
    z-index: 5;
    margin-right: .7rem;
    left: -2px;
    top: -2px;
}

    .media-field-search.app-page-row-textbox > .media-item .artwork-list img {
        max-width: 60px;
        /*box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);*/
        border: solid 1px #D3D3D3;
    }

    .media-field-search .app-page-row-textbox > .media-item .artwork-list.single-image img {
        box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
        box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);
    }

    .media-field-search .app-page-row-textbox > .media-item .artwork-list img.before {
        left: 3px;
        top: 3px;
        z-index: -1;
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #eee;
    }

    .media-field-search .app-page-row-textbox > .media-item .artwork-list.double-image img.before {
        box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
    }

    .media-field-search .app-page-row-textbox > .media-item .artwork-list.single-image img.before {
        display: none;
    }

    .media-field-search .app-page-row-textbox > .media-item .artwork-list img.after {
        left: 6px;
        top: 6px;
        z-index: -2;
        box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
        content: "";
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: #eee;
    }

    .media-field-search .app-page-row-textbox > .media-item .artwork-list.double-image img.after {
        display: none;
    }

    .media-field-search .app-page-row-textbox > .media-item .artwork-list.single-image img.after {
        display: none;
    }

.media-field-search .app-page-row-textbox > .media-item .media-info {
    flex: 1;
    text-align: left;
}

    .media-field-search .app-page-row-textbox > .media-item .media-info span {
        margin-right: 3px;
    }

        .media-field-search .app-page-row-textbox > .media-item .media-info span:last-child {
            margin-right: 0;
        }

    .media-field-search .app-page-row-textbox > .media-item .media-info .big {
        font-size: 1rem;
        white-space: nowrap;
        overflow-x: hidden;
        text-overflow: ellipsis;
        overflow: hidden;
        padding: 1px;
        max-width: 275px;
    }

    .media-field-search .app-page-row-textbox > .media-item .media-info .small {
        font-size: .9rem;
        /*color: dimgray;*/
        padding: 1px;
        padding-top: 3px;
        white-space: nowrap;
        overflow-x: hidden;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 275px;
    }

.media-field-search .app-page-row-textbox > .media-item.selected .media-info .small {
    color: inherit;
}

.media-field-search .app-page-row-textbox > .media-item .media-info .big .time {
    padding-left: 7px;
    font-size: .7em;
    color: dimgray;
    padding-top: 3px;
}

.media-field-search .app-page-row-textbox > .media-item .media-info .name, .media-item .media-info .album-name {
}

.media-field-search .app-page-row-textbox > .media-item .media-info > section {
    color: #9a9aa2;
}

.media-field-search .app-page-row-textbox > .media-item.selected .media-info > section {
    color: #fff;
}

.media-field-search .app-page-row-textbox > .media-item .remove-button {
    position: absolute;
    left: 2px;
    top: 20px;
    font-size: 1.1em;
    background-color: #d0d0d0;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    cursor: pointer;
}

.media-field-search .app-page-row-textbox > .media-item.selected .remove-button {
    background-color: #999;
}

.media-field-search .app-page-row-textbox > .media-item .remove-button .glyph {
    position: absolute;
    left: 2.5px;
    top: -3px;
    -webkit-user-select: none;
    user-select: none;
}

.media-field-search .app-page-row-textbox > .media-item .default {
    display: none;
}

#search-wrapper .no-items .media-item .default {
    display: block;
}

.media-field-search .app-page-row-textbox > .media-item .context-menu-button {
    position: absolute;
    right: 10px;
    top: 25px;
    font-size: 1.2em;
    width: 15px;
    height: 15px;
    color: #0069D9;
    display: none !important;
}

.media-field-search .app-page-row-textbox > .media-item.selected .context-menu-button {
    color: #fff;
}

.media-field-search .app-page-row-textbox > .media-item .context-menu-button .glyph {
    position: absolute;
    left: 1.5px;
    top: -6px;
    -webkit-user-select: none;
    user-select: none;
    display: none !important;
}

.media-field-search .app-page-row-textbox > .media-item .hover-button {
    display: none;
}

.media-field-search .app-page-row-textbox > .media-item:hover .hover-button {
    display: none !important;
}

.media-field-search .app-page-row-textbox > .media-item .hover-button.selected {
    display: none !important;
}

.media-field-search .app-page-row-textbox > .media-item:hover .hover-button:hover, .media-item:hover .hover-button.open {
}

.media-field-search .app-page-row-textbox > .media-item.selected .hover-button:hover, .media-item.selected:hover .hover-button.open {
    color: #fff;
}


.media-field-search .app-page-row-textbox > .media-item .cache-state {
    /*position: absolute;*/
    z-index: 5;
    /* display: flex; */
    /* flex: 1; */
    /*width: 200px;*/
    display: block;
    margin-right: 10px;
    position: relative;
    top: 0px;
    padding-top: 5px;
}

.media-field-search .app-page-row-textbox > .media-item.caching .cache-state {
    display: block;
}

.media-field-search .app-page-row-textbox > .media-item.temp-cached .cache-state {
    display: block;
}

.media-field-search .app-page-row-textbox > .media-item.perm-cached .cache-state {
    display: block;
}

.media-field-search .app-page-row-textbox > .media-item .cache-state .container {
    display: none;
    flex-direction: column;
}

.media-field-search .app-page-row-textbox > .media-item.caching .cache-state .container {
    display: flex;
}

.media-field-search .app-page-row-textbox > .media-item .cache-state .container .message {
    font-size: 9px;
    /*color: black;*/
    padding-bottom: 2px;
}

#search-wrapper .selected .media-item .cache-state .container .message {
    /* color:lightgray;*/
}

.media-field-search .app-page-row-textbox > .media-item .cache-state .container .progress {
    height: 4px;
    width: 100%;
    border: solid 1px lightgray;
    display: flex;
}

    .media-field-search .app-page-row-textbox > .media-item .cache-state .container .progress .percent {
        background-color: cornflowerblue;
    }

.media-field-search .app-page-row-textbox > .media-item .cache-state .cached-container {
    display: flex;
    flex-flow: column;
    align-items: flex-end;
}


    .media-field-search .app-page-row-textbox > .media-item .cache-state .cached-container .uncached {
        display: flex;
        font-size: 12px;
        color: gray;
        text-align: right;
        cursor: pointer;
    }

.media-field-search .app-page-row-textbox > .media-item.temp-cached .cache-state .cached-container .uncached {
    display: none;
}

.media-field-search .app-page-row-textbox > .media-item.perm-cached .cache-state .cached-container .uncached {
    display: none;
}

.media-field-search .app-page-row-textbox > .media-item.caching .cache-state .cached-container .uncached {
    display: none;
}

.media-field-search .app-page-row-textbox > .media-item.pre-cache .cache-state .cached-container .uncached {
    display: none;
}

.media-field-search .app-page-row-textbox > .media-item.selected .cache-state .cached-container .uncached {
    color: #fff;
}


.media-field-search .app-page-row-textbox > .media-item .cache-state .cached-container .caching {
    display: none;
    font-size: 12px;
    color: #1d8cf8;
    text-align: right;
    cursor: pointer;
}

.media-field-search .app-page-row-textbox > .media-item.temp-cached .cache-state .cached-container .caching {
    color: #1d8cf8;
}

.media-field-search .app-page-row-textbox > .media-item.perm-cached .cache-state .cached-container .caching {
    color: green;
}

.media-field-search .app-page-row-textbox > .media-item.pre-cache .cache-state .cached-container .caching {
    display: flex;
}

.media-field-search .app-page-row-textbox > .media-item.selected .cache-state .cached-container .caching {
    color: #fff;
}


.media-field-search .app-page-row-textbox > .media-item .cache-state .cached-container .cached {
    display: none;
    font-size: 12px;
    color: #1d8cf8;
    text-align: right;
    cursor: pointer;
}

.media-field-search .app-page-row-textbox > .media-item.temp-cached .cache-state .cached-container .cached {
    display: flex;
}

.media-field-search .app-page-row-textbox > .media-item.perm-cached .cache-state .cached-container .cached {
    display: flex;
    color: green;
}

.media-field-search .app-page-row-textbox > .media-item.pre-cache .cache-state .cached-container .cached {
    display: none !important;
}

.media-field-search .app-page-row-textbox > .media-item.caching .cache-state .cached-container .cached {
    display: none !important;
}

.media-field-search .app-page-row-textbox > .media-item.selected .cache-state .cached-container .cached {
    color: #fff;
}


.app-form-field-media {
}

    .app-form-field-media .app-form-field-autocomplete-container {
    }

    .app-form-field-media .app-form-field-media-item {
        padding: 0.5rem;
        flex: 1;
        /*  padding-right: 3rem;*/
        padding-top: 0px;
        border: solid 1px #444;
        border-top: none;
        border-bottom-left-radius: 3px;
        border-bottom-right-radius: 3px;
        min-height: 100px;
        padding-top: 0.5rem;
    }
    .app-form-field-media.hide-item .app-form-field-media-item {
        display:none;
    }

    .app-form-field-media .app-form-field-autocomplete-search-button {
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0px;
        height: unset;
    }

    .app-form-field-media .app-form-field-autocomplete-search-button.clear-button {
        right: 2.5rem;
    }

body.dark-mode .app-form-field-media .app-form-field-autocomplete-search-button {
   /* background: #444;
    border-color: #444;*/
    color: #fff;
}

.app-form-field-media #search-wrapper .main > .header {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}

.app-form-field-media .app-form-field-autocomplete-container input {
    flex: 1;
    padding-right: 5.5rem !important;
}

.app-form-field-media .app-form-field-autocomplete-container:focus,
.app-form-field-media .app-form-field-autocomplete-container.focused {
    border-color: #0d6efd !important;
}

.app-form-field-media textarea {
    background-color: transparent !important;
}

    .app-form-field-media textarea:focus,
    .app-form-field-media textarea.focused {
        border-color: #0d6efd !important;
    }

.app-form-field-media .app-form-field-autocomplete-container input::placeholder {
    font-style: italic;
}

.app-form-field-media #search-wrapper section.main {
    padding-top: .5rem;
}

.app-form-field-media .app-page-row-textbox > .no-item-selected {
    padding-top: 0.5rem;
    font-style: italic;
    display:none;
}

.subsection textarea::placeholder {
    font-style: italic;
    color: gray !important;
    font-size: 80%;
}

.subsection .publish-url input::placeholder {
    font-style: italic;
    color: gray;
    font-size: 80%;
}



.app-form-field-media #search-wrapper .media-item .artwork {
    box-shadow: 0 1px 2px rgba(0, 0, 0, 7%), 0 2px 4px rgba(0, 0, 0, 7%), 0 4px 8px rgba(0, 0, 0, 7%), 0 8px 16px rgba(0, 0, 0, 7%), 0 16px 32px rgba(0, 0, 0, 7%), 0 32px 64px rgba(0, 0, 0, 7%);
}

.app-form-field-media .form-window-content {
    width: 100%;
}
.form-window .app-form-field-media .form-window-content {
    max-width: 100%;
    width: 100% !important;
    max-height: 100%;
    height: 100% !important;
}
.form-window #search-wrapper {
    margin:0;
}

.app-form-field-media .app-form-field-autocomplete-selection {
    max-height: 70vh;
    height: 50vh;
    left:.1rem;
    right:.1rem;
}

.app-form-field-media .media-field-search .media-item {
    display: block;
}

.app-form-field-media #search-wrapper .content {
    max-height: 300px;
}

.app-form-field-autocomplete-container {
    /*border-color: #444 !important;
    border-color: rgba(100,100,100,.5) !important;*/
    /*background-color: transparent !important;
    border:solid 1px silver;*/
}

#search-queue-container::before {
    display: none !important;
}

.app-search-content-button {
    border-color: rgba(100,100,100,.3);
    background-color: transparent;
    color: white;
    margin-top: 1rem !important;
    margin-right: 1rem !important;
    margin-left: 1rem !important;
    margin-bottom: 0.5rem !important;
    display: none;
}


.media-field-search .form-window-content .form-window-footer {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.app-form-field-media-item .media-item > .media-item-artwork {
    text-align: center;
    position:relative;
}

.app-form-field-media-item .media-item > .media-info {
    text-align: center;
}


.project-layout-menu .app-navigation-item a label {
    /*line-height: 35px;*/
    font-size: 1rem;
}
.selected .btn.text-info {
    color:white;
}
.select-project-item.app-navigation-item a .app-navigation-icon > .app-image {
    max-width: 36px;
    max-height: 36px;
    max-width: 48px;
    max-height: 48px;
    border: solid 1px black;
    border-radius: 4px;
}
.select-project-item.app-navigation-item .app-navigation-subitems .app-navigation-item > a .app-label {
    margin-left: .5rem;
}
/*.select-project-item.app-navigation-item > a .app-label {
    margin-left: .5rem;
    font-size: 1.4rem;
}*/
.project-layout-menu .app-navigation-subitems .app-navigation-item > a .app-label {
    margin-left: -1rem;
}
.project-layout-menu .has-select-all .app-navigation-subitems .app-navigation-item > a .app-label {
    margin-left: .5rem !important;
}






.project-layout-menu-buttons2 > button {
    padding: .5rem;
    max-width: 72px;
    white-space: normal;
    font-size: .7rem;
    width: 72px;
    height: 73px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
}

.project-layout-menu-buttons2 > button.selected {
    opacity: 1 !important;
    background-color:black;
    background: #0d6efd;
}

body.show-layout-menu .project-layout-menu-buttons2 {
    display: flex;
    display: none;
}

/*body.edit-layout .body-container {
    margin-left: 4rem;
}

body.show-layout-menu .body-container {
    margin-left: 70rem;
}
*/
body.can-edit .app-project-header:not(.sm) {
    /*todo:add-back-in;*/
    padding-left: 3.3rem;
    padding-right: 1rem;
}
body.edit-layout .app-project-header:not(.sm) {
    padding-left: 0rem;
}

/*
body.edit-layout .header {
    padding-left: 5rem;
}

body.show-layout-menu .header {
    padding-left: 35rem;
     padding-right: 2rem;
}*/
body.edit-layout #main-screen {
    left: 4.5rem;
}
body.show-layout-menu #main-screen {
    left: 30rem;
}
body.edit-layout .project-base-screen {
    left: 4.5rem;
    /*width: calc(100% - 4.5rem);*/
}
body.show-layout-menu .project-base-screen {
    left: 30rem;
    /*width: calc(100% - 30rem);*/
}

body.can-edit .dms-on-demand.fullscreen .dms-on-demand-actions {
    /*todo: add-back-below;*/
    /*padding-left: 3rem;
    padding-right: .5rem;*/
    /*padding-left: .7rem;*/
    /*padding-right: 0rem;*/
}
/*
body.edit-layout .dms-on-demand.fullscreen .dms-on-demand-actions {
    padding-left: 1rem;
}*/
@media only screen and (max-width: 800px) {

    body.edit-layout .dms-on-demand.fullscreen .dms-on-demand-actions {
        padding-left: 0rem;
        padding-right: 1.5rem;
    }
}


body.show-layout-menu .dms-on-demand.fullscreen .dms-on-demand-actions {
    /* padding-left: 31rem;*/
    /* padding-right: 2rem;*/
}

/*body.show-layout-menu .footer {
    padding-left: .5rem;
}
body.edit-layout .footer {
    padding-left: 2rem;
    padding-right: 1rem;
}
body.show-layout-menu .footer {
    padding-left: 20rem;
    padding-right: 15rem;
}*/

body.edit-layout .dms-on-demand .app-project-header {
    padding-left: 0rem;
}

body.show-layout-menu .dms-on-demand .app-project-header {
    padding-left: .5rem;
}

body.show-layout-menu .dms-on-demand .app-project-footer {
    padding-left: 0rem;
}

/*
body.edit-layout .dms-on-demand.fullscreen .dms-on-demand-form-container {
    left: 4.3rem;
    width: calc(100% - 4.3rem);
}

body.show-layout-menu .dms-on-demand.fullscreen .dms-on-demand-form-container {
    left: 35rem;
    width: calc(100% - 35rem);
}
*/
/*@media only screen and (max-width: 800px) {

    body.edit-layout .dms-on-demand.fullscreen .dms-on-demand-form-container {
        left: 0;
        width: 100%;
    }
}
*/
.dms-on-demand.content-screen .dms-on-demand-selection-container {
    width: 100%;
    height: 100%;
}


.app-form-table.upload-table .card-description-label {
    font-size: 1.4rem;
}
body.dark-mode .app-form-table.upload-table .card-description-label {
    color: white !important;
}
.app-form-table.upload-table .card-description-span {
    font-size: 0.9rem;
    text-transform: uppercase;
    line-height: 1.5;
    padding-top: .5rem;
    padding-bottom: 5px;
}
.app-form-table.upload-table .card-description-container {
    flex-direction: column;
    align-items: flex-start !important;
    margin-bottom: .5rem !important;
    margin-left: -1rem;
    padding-left: 1rem;
}
body.dark-mode .app-form-table.upload-table .card-description-span {
    color: #999;
}
.upload-section .card-table .table-container.card-body {
    padding-top: 0;
}
.app-view.upload-section .card-description-container .card-description-label {
    padding-bottom: .5rem;
}

.dms-on-demand.content-screen .dms-on-demand-selection-sections {
    flex-direction: column;
    display:block;
    max-width: 100%;
    width: 100%;
    padding: 0rem 0rem;
    padding-top:.5rem;
    padding-right:0;
    flex:1;
    order:1;
}
.dms-on-demand.content-screen .dms-on-demand-selection-sections .action-buttons {
    display: flex;
    padding: 0 0.5rem;
    margin-bottom: 1rem;
}
.upload-section-files {
    border-top: solid 1px rgba(100,100,100,.3);
    display: flex;
    flex-direction: column;
    flex: 1;
    /*margin-left: -1.5rem;
    margin-right: -1.5rem;*/
}
.upload-section-files-spinner {
    font-size: 3rem;
    text-align: center;
    padding-bottom: 1rem;
    padding-right: 1rem;
    padding-left: 1rem;
}
.upload-section-files-no-item {
    font-size: 1.4rem;
    padding: 1rem .1rem;
    padding-bottom: .5rem;
    color: #999;
    padding-left: 1rem;
    padding-top: 0;
}
.upload-files .upload-section-files-no-item {
    padding: 1rem;
}
.upload-section-files-items-window {
    position: fixed;
    right: 11rem;
    transition: .2s ease-in-out;
    height: 0vh;
    bottom: 0px;
    width: 30vw;
    right: 11rem;
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border: solid 1px #444;
    background-color:black;
    z-index: 5002;
}
.upload-section-files-items-window.processing {
    height: 4vh;
}
.upload-section-files-items-window.show {
    height: 70vh;
}
.upload-section-files-items-window.hide {
    height: 0vh !important;
}
.upload-section-files-items {
    /* flex: 1;*/
    position: relative;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
}
/*.list-view-body.no-items .upload-section-files-items {
    display:none;
}*/
.upload-section-file {
    position: relative;
    padding: 1rem;
    font-size: 1.6rem;
    border: solid 1px rgba(100,100,100,.3);
    margin: 1rem;
    border-radius: 5px;
    padding-left: 0;
    padding-right: 0;
    margin-left: 0;
    margin-right: 0;
}
.upload-section-file:first-of-type {
    margin-top:0px !important;
}
.upload-section-file-info {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
   /*justify-content: flex-end;*/
}
.upload-section-file-field {
    padding: 1rem;
}
.upload-section-file-select {
    display:none;
}
.upload-section-file-select input {
    height: 18px;
    width: 18px;
    outline: none;
    position: relative;
    top: 3px;
}
.upload-section-file-image {
    padding: 0;
    /*padding-left: 1rem;
    padding-right: 1rem;*/
    position: relative;
    background: black;
		color:whitesmoke;
}
.upload-section-file-image img {
    max-width: 160px;
    max-height: 160px;
    max-width: 163px;
    max-height: 90px;
    max-width: 212px;
    max-height: 90px;
}
.upload-section-file-image video {
    max-width: 160px;
    max-height: 160px;
    max-width: 163px;
    max-height: 90px;
    max-width: 212px;
    max-height: 90px;
}
.upload-section-file-image i {
    font-size: 3rem;
    padding: 0 !important;
}
.upload-section-file-name {
    flex: 1;
}
.upload-section-file-type {

}
.upload-section-file-size {

}
.upload-section-file-status {

}
.upload-section-file-percent-container {
    position: absolute;
    bottom: 0px;
    left:0px;
    height: 2px;
    width: 100%;
    display:flex;
    align-items:center;
}
.upload-section-file-percent {
    flex: 1;
    height: 2px;
}
.upload-section-file-percent.commit {
    flex: .2;
}
.needs-transcoding .upload-section-file-percent {
    flex: 33%;
}
.needs-transcoding .upload-section-file-percent.commit {
    flex: 33%;
}
.upload-section-file-percent-data {
    height: 2px;
    width: 0%;
    left: 0px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.upload-section-file-percent-upload {
    background-color: #0d6efd;
    border-color: #0d6efd;
}
.upload-section-file-percent-transcode {
    background-color: goldenrod;
    border-color: goldenrod;
}
.upload-section-file-percent-commit {
    background-color: purple;
    border-color: purple;
}
.upload-section-file-percent-container.error .upload-section-file-percent-upload,
.upload-section-file-percent-container.error .upload-section-file-percent-transcode,
.upload-section-file-percent-container.error .upload-section-file-percent-commit {
    background-color: firebrick;
    border-color: firebrick;
}
.upload-section-file-percent-container.success .upload-section-file-percent-upload,
.upload-section-file-percent-container.success .upload-section-file-percent-transcode,
.upload-section-file-percent-container.success .upload-section-file-percent-commit {
    background-color: forestgreen;
    border-color: forestgreen;
}
.modal {
    z-index: 99999;
}

.upload-section-file-buttons .btn .material-icons {
    font-size: 1.8rem !important;
}

.upload-section-file-image {
    width: 195px;
    text-align: center;
    width: 163px;
    text-align: center;
    height: 90px;
    overflow: hidden;
    margin-left: .5rem;
}
.upload-section-file-image .thumbnail {
   /* position:relative;*/ 
    display: flex;
    align-items: center; 
    height: 100%;
}
.upload-section-file-image .thumbnail .preview {
    opacity:.8;
    cursor:pointer;
    transition:.2s;
    display:none
}
.upload-section-file-image .thumbnail.can-preview .preview {
    display:block;
}
.upload-section-file-image .thumbnail .preview:hover {
    opacity:1;
}
.upload-section-file-image .thumbnail .preview:active {
    opacity:.7;
}
.upload-section-file-image .thumbnail .preview .bkgd {
    position: absolute;
    background-color: #373737;
    opacity: .3;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}
.upload-section-file-image .thumbnail .preview .ctnr {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.upload-section-file-image .thumbnail .preview .ctnr i {
    color: whitesmoke;
    position: relative;
    top: -1px;
    font-size: 2rem;
}
.upload-section-file-buttons {
   padding-right:1rem;
    text-align:center;
    display:flex;
}
.upload-section-file-buttons button {
    margin-left: 1rem;
    margin-right: 1rem;
}

.upload-section-file-status {
    position: absolute;
    bottom: 0;
    right: 0;
    font-size: .8rem;
    padding: .3rem .5rem;
}
.upload-section-file.focused {
    border-left: solid 1px rgba(100,100,100,.7);
    border-right: solid 1px rgba(100,100,100,.7);
}
.upload-section-file.selected {
    border-color: #0d6efd;
    background: rgba(100,100,100,.3);
}

.upload-section-file-image > i {
    position: absolute;
    left: 0px;
    top: .1rem;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 500;
}


.drop-background {
    /* position: absolute;*/
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-content: center;
    user-select: none;
    pointer-events: none;
    padding: 2rem 1rem;
    padding-top: 3rem;
    text-align: center;
    /*  height: 70%;*/
}
.drop-background-container {
    display: flex;
    flex-direction: column;
    /* flex: 1; */
    justify-content: center;
    align-items: center;
    opacity: .5;
}
.drop-background-container i {
    padding-bottom:1.5rem;
    font-size: 5rem;
}
.drop-background-container label {
    text-transform:uppercase;
    font-size: 3rem;
}


.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    outline: 0
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: .5rem;
    pointer-events: none
}

.modal.fade .modal-dialog {
    transition: transform .3s ease-out;
    transform: translate(0,-50px)
}

/*@media (prefers-reduced-motion:reduce) {
    .modal.fade .modal-dialog {
        transition: none
    }
}*/

.modal.show .modal-dialog {
    transform: none
}

.modal.modal-static .modal-dialog {
    transform: scale(1.02)
}

.modal-dialog-scrollable {
    height: calc(100% - 1rem)
}

    .modal-dialog-scrollable .modal-content {
        max-height: 100%;
        overflow: hidden
    }

    .modal-dialog-scrollable .modal-body {
        overflow-y: auto
    }

.modal-dialog-centered {
    display: flex;
    align-items: center;
    min-height: calc(100% - 1rem)
}

.modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    pointer-events: auto;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 5px;
    outline: 0;
    box-shadow: 7px 7px 7px 0px rgba(0,0,0,.1);
}
body.dark-mode .modal-content {
    background-color: #1C1C22;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1040;
    width: 100vw;
    height: 100vh;
    background-color: #000
}

    .modal-backdrop.fade {
        opacity: 0
    }

    .modal-backdrop.show {
        opacity: .5
    }

.modal-header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1rem;
    border-bottom: 1px solid #dee2e6;
    border-top-left-radius: calc(.3rem - 1px);
    border-top-right-radius: calc(.3rem - 1px);
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

    .modal-header .btn-close {
        padding: .5rem .5rem;
        margin: -.5rem -.5rem -.5rem auto
    }

.modal-title {
    margin-bottom: 0;
    line-height: 1.5
}

.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem
}

.modal-footer {
    display: flex;
    flex-wrap: wrap;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    padding: .75rem;
    border-top: 1px solid #dee2e6;
    border-bottom-right-radius: calc(.3rem - 1px);
    border-bottom-left-radius: calc(.3rem - 1px);
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

    .modal-footer > * {
        margin: .25rem
    }

@media (min-width:576px) {
    .modal-dialog {
        max-width: 500px;
        margin: 1.75rem auto
    }

    .modal-dialog-scrollable {
        height: calc(100% - 3.5rem)
    }

    .modal-dialog-centered {
        min-height: calc(100% - 3.5rem)
    }

    .modal-sm {
        max-width: 300px
    }
}

@media (min-width:992px) {
    .modal-lg, .modal-xl {
        max-width: 800px
    }
}

@media (min-width:1200px) {
    .modal-xl {
        max-width: 1140px
    }
}

.modal-fullscreen {
    width: 100vw;
    max-width: none;
    height: 100%;
    margin: 0
}

    .modal-fullscreen .modal-content {
        height: 100%;
        border: 0;
        border-radius: 0
    }

    .modal-fullscreen .modal-header {
        border-radius: 0
    }

    .modal-fullscreen .modal-body {
        overflow-y: auto
    }

    .modal-fullscreen .modal-footer {
        border-radius: 0
    }

@media (max-width:575.98px) {
    .modal-fullscreen-sm-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0
    }

        .modal-fullscreen-sm-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0
        }

        .modal-fullscreen-sm-down .modal-header {
            border-radius: 0
        }

        .modal-fullscreen-sm-down .modal-body {
            overflow-y: auto
        }

        .modal-fullscreen-sm-down .modal-footer {
            border-radius: 0
        }
}

@media (max-width:767.98px) {
    .modal-fullscreen-md-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0
    }

        .modal-fullscreen-md-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0
        }

        .modal-fullscreen-md-down .modal-header {
            border-radius: 0
        }

        .modal-fullscreen-md-down .modal-body {
            overflow-y: auto
        }

        .modal-fullscreen-md-down .modal-footer {
            border-radius: 0
        }
}

@media (max-width:991.98px) {
    .modal-fullscreen-lg-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0
    }

        .modal-fullscreen-lg-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0
        }

        .modal-fullscreen-lg-down .modal-header {
            border-radius: 0
        }

        .modal-fullscreen-lg-down .modal-body {
            overflow-y: auto
        }

        .modal-fullscreen-lg-down .modal-footer {
            border-radius: 0
        }
}

@media (max-width:1199.98px) {
    .modal-fullscreen-xl-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0
    }

        .modal-fullscreen-xl-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0
        }

        .modal-fullscreen-xl-down .modal-header {
            border-radius: 0
        }

        .modal-fullscreen-xl-down .modal-body {
            overflow-y: auto
        }

        .modal-fullscreen-xl-down .modal-footer {
            border-radius: 0
        }
}

@media (max-width:1399.98px) {
    .modal-fullscreen-xxl-down {
        width: 100vw;
        max-width: none;
        height: 100%;
        margin: 0
    }

        .modal-fullscreen-xxl-down .modal-content {
            height: 100%;
            border: 0;
            border-radius: 0
        }

        .modal-fullscreen-xxl-down .modal-header {
            border-radius: 0
        }

        .modal-fullscreen-xxl-down .modal-body {
            overflow-y: auto
        }

        .modal-fullscreen-xxl-down .modal-footer {
            border-radius: 0
        }
}

.modal {
    display: none;
    transition: .2s;
    opacity:0;
}
body.dark-mode .modal {
    background-color: rgba(0,0,0,.7);
}
.modal.show {
    display: block;
}
.modal.fade-in {
    opacity:1;
}
.modal .modal-dialog {
    transition:.2s;
}
.modal .modal-title {
    justify-content: center;
    flex: 1;
}
.modal .modal-header button.close {
    position: absolute;
    right: 1rem;
    padding: 0;
    background-color: transparent;
}
body.dark-mode .modal .form-check label {
    line-height: 17px;
    color: white;
    color: #aaa;
    font-weight: 400;
    font-size: 1.2em !important;
}
body.light-mode .modal .form-check label {
    /* line-height: 17px; */
    color: white;
    color: gray;
    font-weight: 400;
    font-size: 1.2em !important;
    display: flex;
    align-items: center;
    padding: .5rem 0rem;
}

body.light-mode .modal .form-check label .form-check-input {
    margin-right:.5rem;
}

.modal .modal-body .form-group .row .form-check-input-label {
    padding-left:1.5rem;
}
body.dark-mode .modal .modal-body .form-group .row .form-check-input-label {
    color:white;
}
/*body.dark-mode .modal .modal-content {
    background-color:#181818;
}*/
.modal .modal-body .form-group .row {
    padding: 1rem 0;
}
.modal .modal-body p {
    line-height: 1.4;
}

.links-container {
    display: flex;
    padding-bottom: 1rem;
    align-items: baseline;
}
.links-title-label {
    margin: 0;
    font-size: 2rem;
    font-weight: 300;
    margin-right: 4rem;
    position: relative;
    top: 1px;
}
.links-info-container {
}
.links-info-label {
    text-transform: none;
    color: lightgray;
    font-size: 1.2rem;
}
body.light-mode .links-info-label {
    color: darkgray;
}
.links-info-count {
    padding-right: 8px;
    text-transform: none;
    font-size: 1.2rem;
}
.links-warning-label {
    line-height: 1.6;
    text-transform: uppercase;
    font-size: .7rem;
    letter-spacing: 3px;
    padding-bottom: 7px;
    font-size: 1.4rem;
}






#lookup-metadata-window {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.7);
    z-index: 5002;
    display: flex;
    flex-direction: column;
   /* overflow: auto;*/
}
#lookup-metadata-section {
    flex: 1;
    display: flex;
    flex-direction:column;

}
#lookup-metadata-section .search-section .card-header {
    
    padding: 0.75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, 0.03);
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
    padding: 1rem 0rem;
    margin-bottom: 0;
    padding-top: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
    background: transparent;
    display: flex;
    padding: 0.75rem 2.75rem;
}
body.dark-mode #lookup-metadata-section .search-section .card-header {
    color: #ffffff;
    margin-top:-1rem;
}
#lookup-metadata-section .card .card-header.card-header-primary .card-icon,
#lookup-metadata-section .card .card-header.card-header-primary .card-text,
#lookup-metadata-section .card .card-header.card-header-primary:not(.card-header-icon):not(.card-header-text) {
    box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(100 100 100 / 40%);
}
#lookup-metadata-section .card .card-header.card-header-primary .card-icon i {    
    font-size: 1.4rem;
}
/*
#lookup-metadata-section .card .card-header-primary .card-icon,
#lookup-metadata-section .card .card-header-primary .card-text,
#lookup-metadata-section .card .card-header-primary:not(.card-header-icon):not(.card-header-text),
#lookup-metadata-section .card.bg-primary,
#lookup-metadata-section .card.card-rotate.bg-primary .front,
#lookup-metadata-section .card.card-rotate.bg-primary .back {
    background: linear-gradient( 60deg, #7b1fa2, #913f9e);
}*/

#lookup-metadata-section .card [class*="card-header-"] .card-icon,
#lookup-metadata-section .card [class*="card-header-"] .card-text {
    border-radius: 0.1875rem;
    background-color: #444;
    padding: 0.9375rem;
    margin-top: -5px;
    margin-right: 0.9375rem;
    float: left;
    display:none;
}
body.light-mode #lookup-metadata-section .card [class*="card-header-"] .card-icon {
    background: linear-gradient(#EEEEEE, #CFCFCF);
    border-color: silver;
    color: gray;
    box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(100 100 100 / 40%);
}
#lookup-metadata-section .card .card-header.card-header-icon .card-title,
#lookup-metadata-section .card .card-header.card-header-text .card-title {
    color: #999 !important;
}
#lookup-metadata-section .card .card-header.card-header-icon .card-title,
#lookup-metadata-section .card .card-header.card-header-text .card-title {
    margin-top: 15px;
    color: #3C4858;
    margin-bottom: 3px;
    font-size: 2rem;
}
#lookup-metadata-section .card .card-header.card-header-icon h4,
#lookup-metadata-section .card .card-header.card-header-text h4 {
    font-weight: 300;
}
#lookup-metadata-section .card-table .card-title.flex {
    flex: 1;
}
body.dark-mode #lookup-metadata-section .card .card-title {
    color: #ffffff;
}
#lookup-metadata-section .card .card-header .card-title {
    color: #999;
    white-space:nowrap;
}
#lookup-metadata-section .card .totalRecords {
    display: flex;
    align-items: center;
    margin-top: 15px;
    margin-bottom: 3px;
    margin-left: 5px;
    margin-right: 45px;
    font-size: 1.125rem;
    line-height: 1.4em;
}
#lookup-metadata-section .card .recordCount {
    padding-left: 5px;
    padding-right: 5px;
}
#lookup-metadata-section .card .totalRecordsLabel {
    color: #999;
    white-space:nowrap;
}
#lookup-metadata-section .card-title {
    margin-bottom: 0.75rem;
}

#lookup-metadata-section .search-section {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: whitesmoke;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    border-radius: 5px;
    font-size: .875rem;
    box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 20%), 0 1px 5px 0 rgb(0 0 0 / 12%);
    margin: 1rem;
    margin-top: 1rem;
    /*padding: 0rem 1.5rem;*/
   /* padding-bottom: 1rem;
    padding-bottom: 1rem;*/
    margin-bottom: 1rem;
    display: flex;
    flex-direction: column;
    flex: 1;
}
body.dark-mode #lookup-metadata-section .search-section {
    background: #1C1C22 !important;
    background-color: rgb(29, 33, 37) !important;
}
#lookup-metadata-section .search-section .views {
    flex: 1;
    display: flex;
    flex-direction: column;
}
#lookup-metadata-section .search-section .views .view {
    flex:1;
    display: flex;
    flex-direction: column;
}
#lookup-metadata-section .search-section .views .view .list-view-container {
    flex:1;
    display: flex;
    flex-direction: column;
}
#lookup-metadata-section .search-section .views .view .list-view-container .list-view-body {
    flex:1;
    display: flex;
    flex-direction: column;
    position: relative;
    margin:0;
}
#lookup-metadata-section .search-section .views .view .list-view-container .list-view-body .list-view-no-items {
    flex:1;
    display: none;
    flex-direction: column;
}
.flex-column-1 {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.lookup-metadata-section-header {
    text-align: right;
}
.lookup-metadata-section-close-button {
    font-size: 2rem;
    background-color: transparent;
    border: solid 1px transparent;
    outline: 0 !important;
    opacity: .8;
    transition: .2s;
    position: absolute;
    top: 13px;
    right: 39px;
    z-index: 1;
    color: red;
}
body.dark-mode .lookup-metadata-section-close-button {
    color: white;
}
.lookup-metadata-section-close-button:hover {
    opacity: 1;
}
.lookup-metadata-section-close-button:active {
    opacity:.9;
}

td.center .app-form-field.form-check {
    justify-content: center;
}

#lookup-metadata-section .app-form-field.form-check .app-form-field-label {
    margin-left: 3px;
}
#lookup-metadata-section .fields-section {
    padding: 0 1.5rem;
    /* border-top: solid 1px #2A2A30; */
    border-bottom: solid 1px #2A2A30;
    padding-top: 10px;
    padding-bottom: 10px;
}
body.light-mode #lookup-metadata-section .fields-section {
    border-bottom: solid 1px lightgray;
}
#lookup-metadata-section .app-form-field {
    display: flex;
    align-items: center;
    flex-direction: row;
    flex: 1;
    padding-bottom: 10px;
    white-space: nowrap;
}
#lookup-metadata-section .flex-row.justify-start .app-form-field {
    flex: unset !important;
    padding-bottom:0px;
}
#lookup-metadata-section .flex-row.justify-start .app-form-field:not(.discNumber, .seasonNumber) label {    
    min-width: 0px;
    padding-left: 1.5rem;
}
#lookup-metadata-section.movie .flex-row.justify-start .app-form-field.year label {
    min-width: 105px;
    padding-left: unset;
}
/*#lookup-metadata-section .app-form-field.select {
        justify-content:center !important;
    }*/
#lookup-metadata-section .app-form-field.select input[type=checkbox] {
    margin-left: 22px !important;
}
    #lookup-metadata-section .app-form-field > label {
        padding-left: 5px;
        text-transform: uppercase;
        font-size: .7rem !important;
        font-weight: 700;
        color: #999;
        padding-right: 1rem;
        padding-bottom: 0 !important;
        margin-bottom: 0px;
        text-align: right;
        min-width: 105px;
    }
    #lookup-metadata-section button .app-form-field label {
        color:white;
    }
#lookup-metadata-section .card-views {
    display:flex;
    flex-direction:column;
    flex:1;
}
/*#lookup-metadata-section .search-button {
    font-size: .7rem;
    padding: .6rem 1.2rem;
    padding: 9px 15px !important;
    margin: 0;
    margin-left: 10px;
    margin-right: 10px;
    text-transform: uppercase;
    position: relative;
    top: -1px;
}*/
#lookup-metadata-section .app-form-field-select select {
    max-width: 150px;
    min-width: 150px;
}
/*body.light-mode #lookup-metadata-section .app-form-field-select select {
    color: dimgray;
}*/
#lookup-metadata-section .app-form-field-number input {
    max-width: 150px;
}
#lookup-metadata-section .app-form-field-text.show {
    display: none;
}
#lookup-metadata-section.show .app-form-field-text.show {
    display: flex;
}
#lookup-metadata-section .app-form-field-number.seasonNumber {
    display: none;
}
#lookup-metadata-section.show .app-form-field-number.seasonNumber {
    display: flex;
}
#lookup-metadata-section .app-form-field-number.episodeNumber {
    display: none;
}
#lookup-metadata-section.show .app-form-field-number.episodeNumber {
    display: flex;
}
#lookup-metadata-section .app-form-field-text.album {
    display: none;
}
#lookup-metadata-section.album .app-form-field-text.album {
    display: flex;
}
#lookup-metadata-section .app-form-field-text.artist {
    display: none;
}
#lookup-metadata-section.album .app-form-field-text.artist {
    display: flex;
}
#lookup-metadata-section .app-form-field-number.discNumber {
    display: none;
}
#lookup-metadata-section.album .app-form-field-number.discNumber {
    display: flex;
}
#lookup-metadata-section .app-form-field-number.trackNumber {
    display: none;
}
#lookup-metadata-section.album .app-form-field-number.trackNumber {
    display: flex;
}
#lookup-metadata-section .app-form-field-text.discogsId {
    display: none;
}
#lookup-metadata-section .app-form-field-text.discogsId input {
    max-width:150px;
}
#lookup-metadata-section.album .app-form-field-text.discogsId {
    display: flex;
}
#lookup-metadata-section .app-form-field-text.imdbId {
    display: none;
}
#lookup-metadata-section .app-form-field-text.imdbId input {
    max-width:150px;
}
#lookup-metadata-section.movie .app-form-field-text.imdbId {
    display: flex;
}
#lookup-metadata-section.show .app-form-field-text.imdbId {
    display: flex;
}
#lookup-metadata-section .footer {
    /*padding: 0rem 1.5rem;
    border-top: solid 1px #2A2A30;
    padding-top: 10px;*/
   /* position: absolute;*/
   flex:1;
    bottom: 0;
    right: 0;
}
#lookup-metadata-section .labelResults {
    display: flex;
    flex: 1;
    align-items: flex-end;
    font-size: 1.5rem;
}
#lookup-metadata-section .list-view-no-items-container {
    min-height: 100px;
    justify-content: center;
    align-items: center;
    align-content: center;
    display: flex;
    flex: 1;
    font-size: 1.4rem;
    text-transform: uppercase;
    color: #999;
    /*    border-top: solid 1px #2A2A30;
    border-bottom: solid 1px #2A2A30;*/
    margin: 0 1.5rem;
    margin-bottom: 1rem;
    margin-top: 1rem;
}
#lookup-metadata-section .md-form-group .md-label-static {
    font-size: .8rem !important;
    font-weight: 500;
}
#lookup-metadata-section .form-checkbox {
    padding-left: 3px;
    padding-top: 5px;
    padding-bottom: 3px !important;
}
#lookup-metadata-section .form-check-label {
    /*color: #999 !important;*/
    font-size: .9rem !important;
}

#lookup-metadata-section .force-update {
    display: none;
    margin-left: 6.5rem;
    padding-left: 1.5rem !important;
}
#lookup-metadata-section .force-update.show {
    display: unset;
}
#lookup-metadata-section .buttonSearch {
    /* margin-top: .7rem; */
    /* margin-bottom: 1.2rem; */
    /* margin-left: 105px; */
    margin-left: 15px;
    padding: 9px 15px !important;
    margin: 0;
    margin-left: 15px;
}


#lookup-metadata-section .metadata-item-header-select .form-checkbox {
    width: 80px;
    padding-left: 35px;
}
#lookup-metadata-section .list-view-no-items-image {
    display: none;
}
#lookup-metadata-section .list-view-body.loading-items .list-view-no-items-image {
    display: unset;
}
#lookup-metadata-section .list-view-body.loading-items .list-view-no-items,
#lookup-metadata-section .list-view-body.no-items .list-view-no-items {
    display: flex !important;
}
#lookup-metadata-section .list-view-body.loading-items .list-view-groups,
#lookup-metadata-section .list-view-body.no-items .list-view-groups {
    display: none;
}
#lookup-metadata-section .list-view-groups {
    /* border-top: solid 1px #2A2A30;
    border-bottom: solid 1px #2A2A30;
    margin-bottom: 1rem;*/
    /*margin-left: 1.5rem;
    margin-right: 1.5rem;*/
    display: flex;
    flex: 1;
   /* flex-direction: column;*/
    overflow: auto;
    /*height: 800px;*/
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin-bottom: 1rem;
    padding-bottom: 1rem;
}

#lookup-metadata-section .metadata-item-container {
    padding: 7px;
    margin: 7px;
    padding-top: 0;
    padding-bottom: 10px;
}

/*body.can-edit .header-menu {
    top: 4rem;
}*/
body.edit-layout .header-menu {
    left: 4.5rem;
}
/*body.edit-layout .footer {
    left: 2.5rem;
}
*/
#lookup-metadata-section .metadata-item {
    padding: 7px;
    /* background-color: #0069D9; */
    margin: 0px;
    /* background-color: rgb(221, 221, 221); */
    transition-property: background-color;
    transition: .1s ease-in-out;
    /* border-radius: 3px; */
    /* opacity: .4; */
    border: 1px solid transparent;
    /*flex:1;*/
    padding-bottom: 0px;
    width:100%;
}
body.light-mode #lookup-metadata-section .metadata-item.select {
    background-color: rgba(154,181,213,.1);
    border: 1px solid #0d6efd;
}
body.dark-mode #lookup-metadata-section .metadata-item.select {
    border: 1px solid #0d6efd;
    background-color: rgba(100,100,100,.3);
}
#lookup-metadata-section .metadata-item-body {
    display: flex;
}
body.dark-mode #lookup-metadata-section .metadata-item-body {
    color: #fff;
}
#lookup-metadata-section .metadata-item-header {
    display: flex;
    padding-right: 15px;
    flex: 1;
    padding-left: 1.5rem !important;
}
#lookup-metadata-section .metadata-item-header-select {
    padding-top: 13px;
    padding-right: 23px;
    padding-left: 4px;
}
#lookup-metadata-section .metadata-item-header-select input {

}

#lookup-metadata-section .metadata-item-header-info-container {
    display: flex;
    flex-direction: column;
}
#lookup-metadata-section .metadata-item-header-info {
    padding-top: 10px;
    padding-left: 10px;
    flex: 1;
}
#lookup-metadata-section .metadata-item-header-info-album {
    padding-top: 5px;
}
#lookup-metadata-section .metadata-item-header-info-show {
    padding-top: 5px;
}
#lookup-metadata-section .metadata-item-header-info-name {
    font-size: 1.4rem;
    font-weight: 500;
}
#lookup-metadata-section .metadata-item-header-info-description {
    font-size: .9rem;
    /*text-align: justify;*/
    padding-top: 5px;
    padding-bottom: 15px;
    padding-right: 40px;
    flex: 1;
    display: none;
    line-height:1.4;
}
#lookup-metadata-section .metadata-item-header-info-description.show {
    display:flex;
}
#lookup-metadata-section .metadata-item-header-info-src {
    font-size: .9rem;
    padding-top: 5px;
    color: blue;
    cursor: pointer;
}
#lookup-metadata-section .metadata-item-header-info-rated {
    padding-left: 5px;
}
#lookup-metadata-section .metadata-item-image {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1rem 2rem;
    padding-bottom:0;
}
#lookup-metadata-section .metadata-item-image img {
    max-width: 360px !important;
    max-height: 360px !important;
}
#lookup-metadata-section .metadata-item-trailer {
    margin-top: 10px;
    font-size: 1rem;
}
#lookup-metadata-section .metadata-item-imdb {
    margin-top: 5px;
    font-size: 1rem;
}
#lookup-metadata-section .metadata-item-discogs {
    margin-top: 5px;
    font-size: 1rem;
}

#lookup-metadata-section .metadata-item-footer {
    padding-top: 0px;
    padding-left: 10px;
    /*height: 20px;*/
    /* position: relative;
    top: -15px;*/
}
#lookup-metadata-section .metadata-item-spinner {
    display: flex;
    align-items: center;
}
    #lookup-metadata-section .metadata-item-spinner .loader {
        /* width: 14px; */
        /* height: 14px; */
        top: -2px;
        margin-right: 5px;
        min-width: unset;
        max-width: unset;
        min-height: unset;
        max-height: unset;
        top: 0;
        margin: 0;
        margin-right: 5px;
    }
    #lookup-metadata-section .metadata-item-spinner .status {
        font-size: .9rem;
        padding-left: 5px;
        padding-right: 5px;
    }
body.dark-mode #lookup-metadata-section .metadata-item-spinner .status {
    color: #fff;
}
#lookup-metadata-section .metadata-item-getItems {
    font-size: 1.1rem;
}
body.dark-mode #lookup-metadata-section .metadata-item-getItems {
    color: #9c27b0;
    color: white;
    margin-bottom:.5rem;
}
#lookup-metadata-section .metadata-item-getItems i {
    padding-right:10px;
}
#lookup-metadata-section .metadata-item-header-select .app-form-field-checkbox input[type=checkbox] {
    width: 20px;
    height: 20px;
    border-color: rgba(96, 100, 119, 0.5);
}
#lookup-metadata-section .metadata-item-header-info-year-container {
    font-size: .9rem;
    padding-top: 7px;
    padding-bottom: 7px;
    display: flex;
}
#lookup-metadata-section .metadata-item-footer-container {
    display: flex;
    align-items: center;
    padding: .5rem;
    padding-left: 46px;
}
#lookup-metadata-section .metadata-item-header-info-year {
    display: flex;
}

#lookup-metadata-section .metadata-item-header-info-seperator {
    height: 2px;
    border: 1px solid darkgray;
    border-radius: 100px;
    background-color: darkgray;
    width: 2px;
    align-self: center;
    margin-left: 7px;
    margin-right: 2px;
    position: relative;
    top: -1px;
    display: flex;
}

#lookup-metadata-section .metadata-item-header-info-duration {
    padding-left: 5px;
    display: flex;
}

#lookup-metadata-section .metadata-item-header-info-rating-stars {
    display: none;
    padding-top: 1px;
    padding-bottom: 8px;
}

#lookup-metadata-section .metadata-item-header-info-rating-star {
    padding-left: 1px;
    padding-right: 1px;
}

#lookup-metadata-section .metadata-item-header-info-rating-star-image {
    min-width: 13px;
    min-height: 13px;
    background-image: url(/site/images/rating_sm.png);
    background-position-x: 0px;
    background-position-y: 0px;
    background-repeat: no-repeat;
    background-size: cover;
    background-size: 13px;
    cursor: pointer;
    transition: .2s;
}

    #lookup-metadata-section .metadata-item-header-info-rating-star-image:hover {
        background-image: url(/site/images/rating_sm_selected.png);
    }

    #lookup-metadata-section .metadata-item-header-info-rating-star-image.selected {
        background-image: url(/site/images/rating_sm_selected.png);
    }


#lookup-metadata-section .metadata-item-header-info-rating-container {
    display: flex;
    font-size: .75rem;
    padding-bottom: 5px;
    display: none;
}
#lookup-metadata-section .metadata-item-header-info-rating-count {
}
#lookup-metadata-section .metadata-item-header-info-rating {
    padding-left: 5px;
}
#lookup-metadata-section .metadata-item-header-info-imdb {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
    #lookup-metadata-section .metadata-item-header-info-imdb.show {
        display: flex;
    }

#lookup-metadata-section .metadata-item-header-info-imdb-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}

#lookup-metadata-section .metadata-item-header-info-imdb-info {
}
#lookup-metadata-section .metadata-item-header-info-artist {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
    #lookup-metadata-section .metadata-item-header-info-artist.show {
        display: flex;
    }

#lookup-metadata-section .metadata-item-header-info-artist-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}

#lookup-metadata-section .metadata-item-header-info-artist-info {
}
#lookup-metadata-section .metadata-item-header-info-discogs {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
    #lookup-metadata-section .metadata-item-header-info-discogs.show {
        display: flex;
    }

#lookup-metadata-section .metadata-item-header-info-discogs-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}

#lookup-metadata-section .metadata-item-header-info-discogs-info {
}
#lookup-metadata-section .metadata-item-header-info-artists {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
    #lookup-metadata-section .metadata-item-header-info-artists.show {
        display: flex;
    }

#lookup-metadata-section .metadata-item-header-info-artists-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}

#lookup-metadata-section .metadata-item-header-info-artists-info {
}
#lookup-metadata-section .metadata-item-header-info-trackArtists {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
#lookup-metadata-section .metadata-item-header-info-trackArtists.show {
    display: flex;
}

#lookup-metadata-section .metadata-item-header-info-trackArtists-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}

#lookup-metadata-section .metadata-item-header-info-trackArtists-info {
}
#lookup-metadata-section .metadata-item-header-info-genre {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color:white;
}
#lookup-metadata-section .metadata-item-header-info-genre.show {
    display: flex;
}

#lookup-metadata-section .metadata-item-header-info-genre-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}

#lookup-metadata-section .metadata-item-header-info-genre-info {
}
#lookup-metadata-section .metadata-item-header-info-category {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}

    #lookup-metadata-section .metadata-item-header-info-category.show {
        display: flex;
    }

#lookup-metadata-section .metadata-item-header-info-category-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}

#lookup-metadata-section .metadata-item-header-info-category-info {
}
#lookup-metadata-section .metadata-item-header-info-cast {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
    #lookup-metadata-section .metadata-item-header-info-cast.show {
        display: flex;
    }
#lookup-metadata-section .metadata-item-header-info-cast-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}
#lookup-metadata-section .metadata-item-header-info-cast-info {
}
#lookup-metadata-section .metadata-item-header-info-director {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
    #lookup-metadata-section .metadata-item-header-info-director.show {
        display: flex;
    }
#lookup-metadata-section .metadata-item-header-info-director-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}
#lookup-metadata-section .metadata-item-header-info-director-info {

}
#lookup-metadata-section .metadata-item-header-info-writer {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
#lookup-metadata-section .metadata-item-header-info-writer.show {
    display: flex;
}
#lookup-metadata-section .metadata-item-header-info-writer-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}
#lookup-metadata-section .metadata-item-header-info-writer-info {

}
#lookup-metadata-section .metadata-item-header-info-composer {
    font-size: .9rem;
    padding-bottom: 5px;
    display: none;
    color: white;
}
#lookup-metadata-section .metadata-item-header-info-composer.show {
    display: flex;
}
#lookup-metadata-section .metadata-item-header-info-composer-label {
    padding-right: 5px;
    width: 115px;
    text-align: right;
}
#lookup-metadata-section .metadata-item-header-info-composer-info {

}

#lookup-metadata-section .metadata-item-extra-images {
    padding-bottom:5px;
}

#lookup-metadata-section .metadata-item-extra-images-header {
    text-align: right;
}

#lookup-metadata-section .metadata-item-extra-images-header-label {
    padding-right: 15px;
    font-size: 1rem;
    display: inline-block;
}

.has-images #lookup-metadata-section .metadata-item-extra-images-header-label {
    color: blue;
    text-decoration: underline;
    cursor: pointer;
}

#lookup-metadata-section .metadata-item-extra-images-items {
    display: none;
}

#lookup-metadata-section .metadata-item-extra-images-items.show {
    display: block;
}

#lookup-metadata-section .metadata-item-subtitles {
    /*flex-direction:column;
    display:flex;*/
    width: 100%;
    margin-top: .2rem;
    margin-left: 18px;
    margin-right: 18px;
    max-width:98%;
}
body.light-mode #lookup-metadata-section .metadata-item-subtitles.table {
    background-color: inherit !important;
}
body.dark-mode #lookup-metadata-section .metadata-item-subtitles {
    color: white !important;
}
#lookup-metadata-section .metadata-item-subtitles th {
    border-top: none !important;
}
#lookup-metadata-section .metadata-item-subtitles td {
    border-top:none !important;
    border-bottom: solid 1px lightgray;
}
body.dark-mode #lookup-metadata-section .metadata-item-subtitles td {
    border-bottom: solid 1px #2A2A30;
}
#lookup-metadata-section .metadata-item-subtitles td .form-checkbox {
    padding-left: 10px;
}
#lookup-metadata-section .metadata-item-subtitles tr:last-of-type td {
    border-bottom: none;
}
#lookup-metadata-section .metadata-item-subtitles th, #lookup-metadata-section .metadata-item-subtitles td {
    padding: 10px 10px;
    vertical-align: middle !important;
    text-align: left;
    white-space: nowrap;
    padding: 0px !important;
}
td.metadata-item-subtitles-row-foreignPartsOnly {
    width:100px;
}
#lookup-metadata-section .metadata-item-subtitles a {
    font-weight: 700;
}
#lookup-metadata-section .metadata-item-subtitles a:hover {
    font-weight:700;
    text-decoration:none;
}
#lookup-metadata-section .metadata-item-subtitles-row {
    /*display:flex;*/
}
#lookup-metadata-section .metadata-item-subtitles .form-field label {
    /*display:flex;*/
}
#lookup-metadata-section .metadata-item-subtitles-row label {
    text-align: center;
    min-width: unset;
    text-transform: uppercase;
    font-size: .8rem;
}
body.light-mode #lookup-metadata-section .metadata-item-subtitles-row label {
    color: #999;
}
#lookup-metadata-section .metadata-item-subtitles-row.header {
    margin-top: 6px;
    margin-bottom: 4px;
    background: linear-gradient(to bottom, lightgray, gainsboro);
    border: solid 1px silver;
}
body.dark-mode #lookup-metadata-section .metadata-item-subtitles-row.header {
    background-color: #9c27b0;
    border: solid 1px #9c27b0;
    background: #444;
    border-color: #444;
    border-color: rgba(0,0,0,.3);
    background-color: rgba(0,0,0,.3);
}
#lookup-metadata-section .metadata-item-subtitles-row > div {
    white-space: nowrap;
    overflow: hidden;
    font-size: 16px;
    padding: 5px 15px;
}
#lookup-metadata-section .metadata-item-subtitles-row.header > div {
    font-size: 14px;
}
#lookup-metadata-section .metadata-item-subtitles-row-select {
    width:21px;
}
#lookup-metadata-section .metadata-item-subtitles-row-encoding {
    width:75px;
}
#lookup-metadata-section .metadata-item-subtitles-row-format {
    width: 75px;
}
#lookup-metadata-section .metadata-item-subtitles-row-fps {
    width: 100px;
}
#lookup-metadata-section .metadata-item-subtitles-row-hd {
    width: 75px;
}
#lookup-metadata-section .metadata-item-subtitles-row-hearing-impared {
    width: 125px;
}
#lookup-metadata-section .metadata-item-subtitles-row-language {
    width: 100px;
}
#lookup-metadata-section .metadata-item-subtitles-row-score {
    width: 100px;
}
#lookup-metadata-section .metadata-item-subtitles-row-points {
    width: 100px;
}
#lookup-metadata-section .metadata-item-subtitles-row-rating {
    width: 75px;
}
#lookup-metadata-section .metadata-item-subtitles-row-last-time-stamp {
    width: 100px;
}
#lookup-metadata-section .metadata-item-subtitles-row-year {
    width: 75px;
}
#lookup-metadata-section .metadata-item-subtitles-row-view {
    width: 94px;
}
#lookup-metadata-section .list-view-subtitles-container {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    padding: 1.5rem;
    display: none;
    background: linear-gradient(#12121A, #121216) !important;
    color: white;
    z-index:1200;
}
#lookup-metadata-section .subtitles .list-view-subtitles-container {
    display: block !important;
}
#lookup-metadata-section .list-view-subtitles-close {
    position: fixed;
    right: 3rem;
    color: red;
    font-size: 2.4rem;
}
#lookup-metadata-section .list-view-subtitles {
    user-select: text;
    font-size: 1.4rem;
}
#lookup-metadata-section button.metadata-item-trailer {
    margin: 0px !important;
    padding: 3px 5px;
    padding-top: 10px;
    font-size: 1.7rem;
    /*position: relative;
    top: -15px;*/
    width: fit-content;
}


.media-fields .card-icon {
    padding: 0;
}
.media-fields .card-icon.has-image i {
    display:none;
}
.media-fields .card-icon img {
    max-width: 150px;
    max-height: 80px;
}
.media-fields .subtitles-footer {
    display:flex;
}
.media-fields .subtitles_useSubtitleDelay {
    padding-left: 0px !important;
    padding-bottom: 0 !important;
}
.media-fields .form-tab-table section.subtitle-delay {
    flex-direction: column;
    padding: 5px !important;
}
.media-fields section.subtitle-delay .subtitles_subtitleDelay .form-group {
   /* padding-bottom: 0 !important;*/
    left: -3px;
}
.media-fields section.subtitle-delay .subtitles_subtitleDelay .form-group .md-label-static {
    display:none !important;
}
.form-tab-table.subscriptions .actions {
    padding-top: 0;
    padding-bottom: 0;
}

.media-section h4.card-title {
    user-select:text;
}
.media-section .card-table .table-container.card-body {
    overflow:visible;
}
.media-section .card-table .table-container.card-body .table {
    background: linear-gradient(#12121A, #121216) !important;
}
.media-fields .card-table .table-container.card-body .table .md-form-group.select { 
    padding-right: 0px !important;
}



.media-fields > .app-form-footer,
.app-form-fields > .app-form-footer {
    flex-direction: column;
}
.media-fields .row,
.app-form-fields .row {
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
}
.media-fields .app-field-row,
.app-form-fields .app-field-row {
    display: flex;
    flex-wrap: wrap;
    flex: 1;
}
.media-fields .app-field-row .column.primary,
.app-form-fields .app-field-row .column.primary {
    flex:1;
}
.media-fields .app-field-row .column.aside,
.app-form-fields .app-field-row .column.aside {
    flex:.2;
}

.app-field-row .column .app-form-field-date,
.app-field-row .column .app-form-field-time {
    max-width: unset;
}


.media-fields .subtitle-options .subtitleDelay .app-form-field-label {
    display:none !important;
}

/*body.light-mode .media-fields .app-form-body {
    color: gray;
}*/
body.dark-mode .media-fields .app-form-body {
    color: white;
}
.media-fields section .column {
    padding-bottom: 1rem;
}
.media-fields .media-data {
    padding: 1em;
    padding-top:0;
    display: flex;
    flex-wrap: wrap;
}
.media-fields.summary > .media-data {
    padding-top: 1rem;
}
.media-fields .file-data {
    padding: 1em;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    flex-wrap: wrap;
    /*    flex-direction: column;*/
}
.app-form-field-description {
    justify-content: left;
    flex-direction: row;
    display: flex;
    margin-bottom: 5px;
    padding-bottom: 0px;
    -webkit-user-select: none;
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: center;
    padding-bottom: 5px;
}
.app-form-field-description .app-label {    
    /* font-weight: 600; */
    font-size: 1em;
    display: block;
    color: white;
    display: flex;
    flex-direction: column;
    min-width: 180px;
    text-align: right;
    text-transform: uppercase;
    padding-right: 10px;
    text-align: right !important;
    color: lightgray;
    font-size: 1rem;
    font-weight:500;
}
.app-form-field-description .app-span {
    min-width: 350px;
    flex: 1;
    display: flex;
    font-size: 1rem;
}
.summary.media-fields .app-form-field-description .app-span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.app-view .summary.media-fields .app-label-span {
    max-width: 600px;
    overflow: hidden;
}


.media-section {
    display: flex;
    flex-direction: column;
    flex: 1;
}
.media-fields.preview {    
    display: flex;
    flex-direction: column;
    flex: 1;
}
.media-fields.preview .app-form-content {    
    display: flex;
    flex-direction: column;
    flex: 1;
}
.media-fields.preview .app-form-body {   
    flex: 1;
    display: flex;
    flex-direction: column;
}
.media-fields.preview .app-tab-view {  
    flex: 1;
    display: flex;
    flex-direction: column;
}
.media-fields .app-tab-view.preview .app-field-group {  
    flex: 0;
}
.media-fields .app-tab-view.preview .preview-container {
    flex: 1;
    position: relative;
    border: solid 1px black;
    margin-bottom: .5rem;
    margin-left: .5rem;
    margin-right: .5rem;
}

.media-fields .app-tab-view.options .preview-link {

    font-size: 2rem;
    position: absolute;
    bottom: -30px;
    padding: 0;
    right: -1px;
    z-index:10;
    color:white;
}
body.light-mode .media-fields .app-tab-view.options .preview-link {
    color:red;
}
.media-fields .app-tab-view.options .comments {
    padding-bottom: 8px;
    padding-top: 3px;
}

.media-fields .app-tab-item .fa-credit-card {    
    font-size: 21px;
    padding-top: 2px;
    padding-right: 8px;
}
.media-fields .html-display {
    padding: .7rem .5rem;
    border: solid 1px lightgray;
    border-radius: 5px;
    height: 100%;
    color: whitesmoke;
    font-size: 1.2rem;
}
.media-fields .html-display p {
    margin-bottom: 0px !important;
}

.media-section .app-form-fields > .app-form-header {
    display:flex;
}

.metadata-window {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.7);
    background-color: rgba(20,20,20,0.7);
    z-index: 5002;
    display: flex;
    flex-direction: column;
    /* overflow: auto;*/
    font-family: 'Montserrat', sans-serif;
}
body.show-checkout-page .metadata-window,
body.show-subscribe-page .metadata-window {
    display: none;
}
body.show-metadata .metadata-window {
    display: flex;
}
/*body.playback .metadata-window {
    display: none;
}*/
body.force-metadata .metadata-window {
    display: flex !important;
}
.metadata-window.dmsProjectLibraryMetadataWindow {
    z-index: 5003;
}
#UploadWindow.metadata-window {
    z-index: 499;
}


#metadata-section {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    /*justify-content: flex-end;*/
}

    #metadata-section .search-section {
        position: relative;
        display: flex;
        flex-direction: column;
        min-width: 0;
        word-wrap: break-word;
        background-color: white;
        background-clip: border-box;
        border: 1px solid rgba(0, 0, 0, 0.125);
        border-radius: 5px;
        font-size: .875rem;
        box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 20%), 0 1px 5px 0 rgb(0 0 0 / 12%);
        margin: 1rem;
        margin-top: 1rem;
        padding: 0rem 1.5rem;
        /* padding-bottom: 1rem;
    padding-bottom: 1rem;*/
        margin-bottom: 0rem;
        display: flex;
        flex-direction: column;
        flex: 1;
        padding: 0;
        border: transparent;
        max-height: 97vh;
        overflow: hidden;
        width:80%;
    }
body.dark-mode #metadata-section .search-section {
    background: #1C1C22 !important;
}
#metadata-section .search-section .views {
    flex: 1;
    display: flex;
    flex-direction: column;
}
#metadata-section .search-section .views .view {
    flex:1;
    display: flex;
    flex-direction: column;
}
#metadata-section .search-section .views .view .list-view-container {
    flex:1;
    display: flex;
    flex-direction: column;
}
#metadata-section .search-section .views .view .list-view-container .list-view-body {
    flex:1;
    display: flex;
    flex-direction: column;
    position: relative;
    margin:0;
}
#metadata-section .search-section .views .view .list-view-container .list-view-body .list-view-no-items {
    flex:1;
    display: none;
    flex-direction: column;
}
.flex-column-1 {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.metadata-section-header {
    text-align: right;
}
.metadata-section-close-button {
    font-size: 2rem;
    font-size: 1.8rem;
    background-color: transparent;
    border: solid 1px transparent;
    outline: 0 !important;
    opacity: .8;
    transition: .2s;
    position: absolute;
    top: -3px;
    top: 1.5rem;
    right: 12%;
    z-index: 1;
    color: red;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
}
body.dark-mode .metadata-section-close-button {
    color: white;
}
.metadata-section-close-button:hover {
    opacity: 1;
}
.metadata-section-close-button:active {
    opacity:.7;
}

#metadata-section .app-form-field.form-check .app-form-field-label {
    margin-left: 0px;
}
#metadata-section .fields-section {
    padding: 0 1.5rem;
    /* border-top: solid 1px #2A2A30; */
    border-bottom: solid 1px #2A2A30;
    padding-top: 10px;
    padding-bottom: 10px;
}
body.light-mode #metadata-section .fields-section {
    border-bottom: solid 1px lightgray;
}
#metadata-section .app-form-footer .app-form-buttons {
    padding-bottom: 1rem;
    margin-left: 1rem;
    margin-right: 1rem;
    border-top: 1px solid rgba(100,100,100, .5);
    margin-top: 0.5rem;
    padding-top: 13px;
}
#metadata-section .app-form-body {
    padding: 0rem .5rem;
    /*overflow: hidden;*/
    width:100%;
}
#metadata-section .app-form-body.large-padding-bottom {
    padding-bottom: 10rem;
}
#metadata-section .app-tabs ul {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    justify-content: center;
}
#metadata-section .app-form-footer {
    padding-left: 1rem;
    padding-right: 1rem;
}
/*#metadata-section .table-view .app-form-footer {
    border-top: solid 1px rgba(100,100,100,.3);
}*/
#metadata-section .table-view .app-form-footer .app-paginator {
    border-top: none;
}
.app-view.table-view .table img {
    max-width: 80px;
    max-height: 45px;
    min-height: 45px;
    object-fit: contain;
}
.app-view.table-view .table .svg-icon {
    max-width: 80px;
    max-height: 45px;
    min-height: 45px;
    object-fit: contain;
}
#metadata-section .app-tab-view .app-form-footer {
    flex-direction: row;
    justify-content: flex-end;
}
#metadata-section .app-view.summary .app-form-content {
    align-items: center;
}
#metadata-section .app-view.summary .app-tabs {
    margin-bottom: 1.8rem;
    width:100%;
}
#metadata-section .app-view.mediaItems-table {
    height: 100%;
    flex: unset;
    height: auto;
    margin-left: .5rem !important;
    min-height: 180px;
}
#metadata-section .app-view.mediaItems-table .app-form-footer .app-form-buttons {    
    margin: 0 !important;
    padding: 0 !important;
    border: none;
}
#metadata-section .app-view.mediaItems-table img {
    max-height:60px; 
}
#metadata-section .app-view.mediaItems-table td.thumbnail {
    padding-bottom: .5rem !important;
    padding-top: .25rem !important;
}
#metadata-section .app-view.mediaItems-table .app-form-footer  {
    padding-left: 0rem;
    padding-right: 0rem;
}

#metadata-section .app-form-live-status {
    position:absolute;
    bottom:.5rem;
    right:1.5rem;
}
#metadata-section .app-form-live-status-container {
    position: relative;
    display:flex;
    align-items:center;
}
#metadata-section .app-form-live-status-label {
    color: white;
    font-weight: 400;
    text-shadow: 0px 1px 2px rgb(0 0 0);
    /* animation: textPulse .3s linear infinite; */
    font-size: 3rem;
}

#metadata-section .app-form-live-status-indicator {
    background-color: red;
    border-radius: 100%;
    animation: statusIndicator 3s infinite;
    margin-right: 1rem;
    height: 1rem;
    width: 1rem;
    border: solid 1px firebrick;
    box-shadow: 0px 0px 10px rgb(255 0 0);
}

@keyframes statusIndicator {
    0% {
        border: solid 1px rgb(255, 49, 49);
        box-shadow: 0px 0px 50px rgb(255 0 0);
    }

    25% {
        border: solid 1px rgb(255, 25, 25);
        box-shadow: 0px 0px 25px rgb(255 0 0);
    }

    50% {
        border: solid 1px rgb(255, 0, 0);
        box-shadow: 0px 0px 0px rgb(255 0 0);
    }

    75% {
        border: solid 1px rgb(255, 25, 25);
        box-shadow: 0px 0px 25px rgb(255 0 0);
    }

    100% {
        border: solid 1px rgb(255, 49, 49);
        box-shadow: 0px 0px 50px rgb(255 0 0);
    }
}


#metadata-section .upload-section-file-status {
    color: white;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    padding-right: 1rem;
    font-size: 1.2rem;
}
#metadata-section .upload-section-files-spinner {
    font-size: 4rem;
    text-align: center;
    padding-bottom: 1rem;
    position: absolute;
    right: 4rem;
    color: white;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
}





.app-form-image-background {
    position: absolute;
    top: -20px;
    left: -10px;
    z-index: 0;
    right: -20px;
    height: 150%;
    -webkit-filter: blur(15px);
    filter: blur(30px);
    transform: scale(1.1);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50% 50%;
    transition: .2s;
    opacity:.7;
}
.app-form-labels .app-form-label {
    padding-bottom:0px;
}
.app-form-labels .app-form-label.label1 {
    font-size: 1.25rem;
    letter-spacing: 1px;
    color: white;
}

.app-form-labels .app-form-label.label2 {
    font-size: .9rem;
    color: whitesmoke;
   /* padding-top: 5px;*/
    line-height: 1.5;
}
body.dark-mode .list-view-header-data2 {
    color: whitesmoke;
}

.app-form-labels .app-form-label.label3 {
    font-size: .9rem;
    color: whitesmoke;
   /* padding-top: 5px;*/
    line-height: 1.5;
}
body.dark-mode .list-view-header-data3 {
    color: whitesmoke;
}

.app-form-labels .app-form-label.label4 {
    font-size: .9rem;
    color: whitesmoke;
   /* padding-top: 5px;*/
    line-height: 1.5;
}
body.dark-mode .list-view-header-data4 {
    color: whitesmoke;
}

.app-form-labels .app-form-label.label5 {
    font-size: .9rem;
    color: whitesmoke;
   /* padding-top: 5px;*/
    line-height: 1.5;
}
body.dark-mode .list-view-header-data5 {
    color: whitesmoke;
}

.app-form-labels .app-form-label.label6 {
    font-size: .9rem;
    color: whitesmoke;
   /* padding-top: 5px;*/
    line-height: 1.4;
}
body.dark-mode .list-view-header-data6 {
    color: whitesmoke;
}


.app-form-labels {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
}

.input-group {
    display:flex;
}
.app-tab-view .table-container .table {
    width: calc(100% - 2px);
}
.app-view.mediaPurchases-table {
    height: 100%;
}
.app-view.mediaHistory-table {
    height: 100%;
}
.app-view.trailer {
    height: 100%;
}

#search-wrapper .actions button {
    font-size: .7rem;
    padding: 1px 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    margin-top: 5px;
    justify-content: center;
}

/*#search-wrapper .actions button:hover
{
    color: #0069D9;
    border-color: #0069D9;
}

#search-wrapper .actions button:active
{
    color: #fff;
    background-color: #0069D9;
}

#search-wrapper .actions button.select
{
    color: #fff;
    background-color: #0069D9;
    border-color: #0069D9;
}*/

.app-navigation-seperator {
    height: 1px;
    min-height: 1px;
    background-color: lightgray;
    margin-left: 20px;
    margin-right: 20px;
}

body.dark-mode .app-navigation-seperator {
    background-color: rgba(180, 180, 180, 0.3);
}

.app-navigation-seperator.logo {
    margin: 0;
    height: 2px;
    background-image: linear-gradient( 90deg, #752877 0%, #ff5860 100%);
    background-image: linear-gradient( 90deg, #752877 0%, #ff5860 60%, #1C6688 100%);
    -webkit-box-shadow: 0 0 20px 0 rgb(255 88 96 / 50%);
    box-shadow: 0 0 20px 0 rgb(255 88 96 / 50%);
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0 !important;
    margin: 0;
    max-height: 2px;
    overflow: hidden;
}


body.edit-layout .slide-show {
    left: 4.5rem;
}
body.show-layout-menu .slide-show {
    left: 35rem;
}
body.edit-layout .slide-show .slprev {
    left: 4.5rem;
}
body.show-layout-menu .slide-show .slprev {
    left: 35rem;
}
body.edit-layout .slide-show .pitch-links {
    left: 4.5rem;
}
body.show-layout-menu .slide-show .pitch-links {
    left: 35rem;
}

.dms-on-demand.admin-screen .app-search-content-button {
    display: flex;
    font-size: 2rem;
    align-items: baseline;
    margin-top: 0 !important;
}
.dms-on-demand.admin-screen .app-search-content-button input {
    font-size: 2.4rem;
    color: white;
    letter-spacing: .1rem;
    width: 100%;
    margin-left: 0.7rem;
    margin-bottom: 0;
    padding-bottom: 0;
}
.dms-on-demand.admin-screen .app-project-footer {
    position: initial;
}

.dms-on-demand.admin-screen .dms-on-demand-selection-container {
    padding-bottom: 0px;
    flex-direction: column;
    flex-wrap: nowrap;
    margin-top: 0.5rem;
}
.dms-on-demand.content-screen .sections-container-mediaItemTypes {
    flex-direction: row;
    padding: 0;
}
.dms-on-demand.content-screen .sections-container-playlists {
    flex-direction: row;
    padding: 0;
}
.dms-on-demand.content-screen .sections-container-channels {
    flex-direction: row;
    padding: 0;
}
.sections-container-search .links-container {
    padding-left: 1rem;
}
.sections-container-bridge .links-container {
    padding-left: 1rem;
}
.sections-container-bridge #search-keys .input-searches-options button.input-searches-option-clear {
    color:#0d6efd;
}
.sections-container-bridge #search-keys .input-searches-options button.input-searches-option-clear:hover,
.sections-container-bridge #search-keys .input-searches-options button.input-searches-option-clear:focus {
    color: white;
}
/*.sections-container-search {
    flex-direction: row;
}*/
.sections-container-analytics{
    flex-direction: row;
}
.sections-container-reports {
    flex-direction: row;
}
.sections-container-bridge {
    flex-direction: row;
}
.sections-container-reports .sections-tab {
    width: 20rem;
}
.sections-container-bridge .sections-tab {
    width: 20rem;
}

.dashboard-cards .dashboard-chart-item {
    padding-right: 0 !important;
    padding-left: 0 !important;
    display: flex;
    padding-top: 0rem;
}
@media (min-width: 768px) {
    .col-md-4 {
        flex: 0 0 33.33333% !important;
        max-width: 33.33333% !important;
    }
}
.col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto {
    position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}
@media (min-width: 768px) {
    .col-md-4 {
        flex: 0 0 auto;
        width: 33.33333333%;
    }
}
.dashboard-cards {
    display: flex;
    flex-wrap: wrap;
    border-top: solid 1px rgba(100,100,100,.3);
    padding-top: 0.5rem;
    margin-left: -1rem;
}
.dashboard-cards .dashboard-chart-item {    
    padding-right: 0 !important;
    padding-left: 0 !important;
    display: flex;
    padding-top: 0rem;
}
.dashboard-section .card .card-body {
    color: #8b92a9;
    position: relative;
    display:flex;
}

.dashboard-section .card .card-body,
.dashboard-section .card .card-footer {
    padding: 0.9375rem 1.25rem;
}

.dashboard-section .card-body {
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem;
    color: #202940;
}


.dashboard-section .card {
    margin: 1.875rem auto;
    box-shadow: 0 2px 2px 0 rgb(0 0 0 / 14%), 0 3px 1px -2px rgb(0 0 0 / 20%), 0 1px 5px 0 rgb(0 0 0 / 12%);
    font-size: .875rem;
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 520px;
    word-wrap: break-word;
    background-color: black;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, 0.125);
    font-size: .875rem;
    margin: 1rem;
    color: white;
    margin-top: 2.5rem;
    border-radius: 5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
}

@media (min-width: 768px) {
    .col-md-4 {
        flex: 0 0 33.33333% !important;
        max-width: 33.33333% !important;
    }
}

.dashboard-section .ct-chart svg > g {
    width: 100% !important;
}
.dashboard-chart-subscribers .card-header {
    background-image: linear-gradient( -20deg, #fc6076 0%, #ff9a44 100%) !important;
    /*background-image: linear-gradient(-20deg, #c79081 0%, #dfa579 100%) !important;
    background-color: #FF9A8B !important;
    background-image: linear-gradient(20deg, #FF9A8B 0%, #FF6A88 55%, #FF99AC 100%) !important;*/

    background: #F13F60 !important;
    background: linear-gradient( 20deg, #F13F60, #CF3E75) !important;
}

.dashboard-chart-purchases .card-header {
    background-image: linear-gradient( -20deg, #fc6076 0%, #ff9a44 100%) !important;
    background: #00B4DB !important;
    background: -webkit-linear-gradient(to right, #0083B0, #00B4DB) !important;
    background: linear-gradient( 20deg, #0083B0, #00B4DB) !important;
}
/*.dashboard-chart-revenue .card-header {
    background-image: linear-gradient( -20deg, #fc6076 0%, #ff9a44 100%) !important;
    background-image: linear-gradient(-20deg, #c79081 0%, #dfa579 100%) !important;
    background-color: #FBAB7E !important;
    background-image: linear-gradient(20deg, #FBAB7E 0%, #F7CE68 100%) !important;
}*/
.dashboard-chart-media .card-header {
    background-color: #a7a6cb !important;
    background-image: linear-gradient(-20deg, #a7a6cb 0%, #8989ba 100%) !important;
}
/*.dashboard-chart-views .card-header {
    background-image: linear-gradient(-20deg, #845EC2 0%, #A178DF 100%) !important;
    background-color: #A9C9FF !important;
    background-image: linear-gradient(20deg, #A9C9FF 0%, #FFBBEC 100%) !important;
}*/

.dashboard-section .card .card-body {
    color: #8b92a9;
    position: relative;
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.25rem;
    padding-top: 1rem;
    padding-bottom: .7rem;
    color: #202940;
}
.dashboard-section .card .card-body {
    padding: 0.9375rem 1.25rem;
}
.dashboard-section .card .card-footer {
    padding: 1rem !important;
    border-top: 1px solid rgba(181, 181, 181, 0.1);
}
.dashboard-section .card .card-footer .stats {
    display: flex;
    align-items: center;
}
.dashboard-section .card .card-footer .stats i {
    padding-right: .5rem;
    font-size: 26px !important;
}
.dashboard-section .card .card-actions {
}

.dashboard-section .card .card-footer .stats .material-icons {
    position: relative;
    top: 0px;
    font-size: 1rem;
    margin-right: 0px;
    margin-left: 3px;
    font-size: 1.125rem;
}
.dashboard-section .card .card-footer .stats label {
    font-size: 1rem;
    flex: 1;
    color: white;
    opacity:1;
}
.dashboard-section .card .card-body .card-category,
.dashboard-section .card .card-body .card-title {
    color: white;
}
.dashboard-section .card .card-body .card-category {
    font-size: 1.6em;
    color: white;
    margin: 0;
}
.dashboard-section .card .card-body .card-category label {
    
    font-size: 14px;
    color: white;
    opacity:1;
}
.dashboard-section .card .card-body .card-category i {
    margin-right: .5rem;
}
body.dark-mode .dashboard-section .card .card-title {
    color: #ffffff;
}
.flex-1 {
    flex: 1;
}
.dashboard-section .card-title-container {
    padding-bottom: 1.5rem;
}
.dashboard-section .card-title {
    margin-bottom: 5px;
    font-size: 1.4rem;
    color: white !important;
    font-size: 1.125rem;
    line-height: 1.4em;
}
.dashboard-section .card .card-header {
    padding: .5rem 1rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
    border-radius: 5px;
    margin: 0rem 1rem;
    margin-top: -2rem;
    padding: 0.9375rem;
    padding-top: 1rem;
    padding-bottom: 0;
    padding-left: 2rem;
    padding-right: 2rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
}
.dashboard-section .card.card-chart .ct-chart .ct-grid {
    stroke: rgba(255, 255, 255, 0.2);
}
.dashboard-section .ct-chart .ct-grid {
    stroke: rgba(181, 181, 181, 0.1);
    stroke-width: 1px;
    stroke-dasharray: 2px;
}
.dashboard-section .ct-grid {
    stroke: rgba(0, 0, 0, 0.2);
    stroke-width: 1px;
    stroke-dasharray: 2px;
}
.dashboard-section .card .card-header.card-header-primary .card-icon,
.dashboard-section .card .card-header.card-header-primary .card-text,
.dashboard-section .card .card-header.card-header-primary:not(.card-header-icon):not(.card-header-text) {
    box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(156 39 176 / 40%);
}
.dashboard-section .card .card-header-primary .card-icon,
.dashboard-section .card .card-header-primary .card-text,
.dashboard-section .card .card-header-primary:not(.card-header-icon):not(.card-header-text),
.dashboard-section .card.bg-primary,
.dashboard-section .card.card-rotate.bg-primary .front,
.dashboard-section .card.card-rotate.bg-primary .back {
    background: linear-gradient( 60deg, #7b1fa2, #913f9e) !important;
}
.dashboard-section .dashboard-chart-media .card-header {
    background-color: #a7a6cb;
    background-image: linear-gradient( -20deg, #a7a6cb 0%, #8989ba 100%);
}
.dashboard-section .card .card-header.card-header-rose .card-icon,
.dashboard-section .card .card-header.card-header-rose .card-text,
.dashboard-section .card .card-header.card-header-rose:not(.card-header-icon):not(.card-header-text) {
    box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(233 30 99 / 40%);
}

.dashboard-section .card .card-header-rose .card-icon,
.dashboard-section .card .card-header-rose .card-text,
.dashboard-section .card .card-header-rose:not(.card-header-icon):not(.card-header-text),
.dashboard-section .card.bg-rose,
.dashboard-section .card.card-rotate.bg-rose .front,
.dashboard-section .card.card-rotate.bg-rose .back {
    background: linear-gradient( 60deg, #ec407a, #d81b60) !important;
}
.dashboard-section .card .card-header.card-header-success .card-icon,
.dashboard-section .card .card-header.card-header-success .card-text,
.dashboard-section .card .card-header.card-header-success:not(.card-header-icon):not(.card-header-text) {
    box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(76 175 80 / 40%);
}

.dashboard-section .card .card-header-success .card-icon,
.dashboard-section .card .card-header-success .card-text,
.dashboard-section .card .card-header-success:not(.card-header-icon):not(.card-header-text),
.dashboard-section .card.bg-success,
.dashboard-section .card.card-rotate.bg-success .front,
.dashboard-section .card.card-rotate.bg-success .back {
    background: linear-gradient( 60deg, #288c6c, #4ea752) !important;
}
.dashboard-section .card .card-header.card-header-warning .card-icon,
.dashboard-section .card .card-header.card-header-warning .card-text,
.dashboard-section .card .card-header.card-header-warning:not(.card-header-icon):not(.card-header-text) {
    box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(255 152 0 / 40%);
}

.dashboard-section .card .card-header-warning .card-icon,
.dashboard-section .card .card-header-warning .card-text,
.dashboard-section .card .card-header-warning:not(.card-header-icon):not(.card-header-text),
.dashboard-section .card.bg-warning, .card.card-rotate.bg-warning .front,
.dashboard-section .card.card-rotate.bg-warning .back {
    background: linear-gradient( 60deg, #f5700c, #ff9800) !important;
}


.dashboard-section .card .card-header.card-header-rentals .card-icon,
.dashboard-section .card .card-header.card-header-rentals .card-text,
.dashboard-section .card .card-header.card-header-rentals:not(.card-header-icon):not(.card-header-text) {
    box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(76 175 80 / 40%);
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.14),0 7px 10px -5px rgba(64,64,64,.4);
}

.dashboard-section .card .card-header-rentals .card-icon,
.dashboard-section .card .card-header-rentals .card-text,
.dashboard-section .card .card-header-rentals:not(.card-header-icon):not(.card-header-text),
.dashboard-section .card.bg-rentals,
.dashboard-section .card.card-rotate.bg-rentals .front,
.dashboard-section .card.card-rotate.bg-rentals .back {
    background: linear-gradient( 60deg, #288c6c, #4ea752) !important;
    background: linear-gradient( 195deg,#323a54,#1a2035) !important;
}


.dashboard-section .card .card-header.card-header-info .card-icon,
.dashboard-section .card .card-header.card-header-info .card-text,
.dashboard-section .card .card-header.card-header-info:not(.card-header-icon):not(.card-header-text) {
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%) !important;
}

.dashboard-section .card .card-header-info .card-icon,
.dashboard-section .card .card-header-info .card-text,
.dashboard-section .card .card-header-info:not(.card-header-icon):not(.card-header-text),
.dashboard-section .card.bg-info,
.dashboard-section .card.card-rotate.bg-info .front,
.dashboard-section .card.card-rotate.bg-info .back {
    background: linear-gradient( 20deg, #0083B0, #00B4DB) !important;
}


.dashboard-section .card.card-chart .ct-chart .ct-series-a .ct-bar {
    stroke-width: 10px;
}

.dashboard-section .card.card-chart .ct-chart .ct-series-a .ct-bar,
.dashboard-section .card.card-chart .ct-chart .ct-series-a .ct-line,
.dashboard-section .card.card-chart .ct-chart .ct-series-a .ct-point,
.dashboard-section .card.card-chart .ct-chart .ct-series-a .ct-slice-donut {
    stroke: rgba(255, 255, 255, 0.8);
    fill: rgba(255, 255, 255, 0.8);
}

.dashboard-section .ct-chart .ct-series-a .ct-point,
.dashboard-section .ct-chart .ct-series-a .ct-line,
.dashboard-section .ct-chart .ct-series-a .ct-bar,
.dashboard-section .ct-chart .ct-series-a .ct-slice-donut,
.dashboard-section .ct-chart .ct-series-a .ct-slice-pie,
.dashboard-section .ct-chart .ct-series-a .ct-slice-donut-solid,
.dashboard-section .ct-chart .ct-series-a .ct-area {
    stroke: #00bcd4;
}

.dashboard-section .ct-chart .ct-bar {
    fill: none;
    stroke-width: 10px;
}

.dashboard-section .ct-series-a .ct-point,
.dashboard-section .ct-series-a .ct-line,
.dashboard-section .ct-series-a .ct-bar,
.dashboard-section .ct-series-a .ct-slice-donut {
    stroke: #d70206;
}

.dashboard-section .ct-bar {
    fill: none;
    stroke-width: 10px;
}
.dashboard-section .card.card-chart .ct-chart .ct-label {
    color: rgba(255, 255, 255, 0.7);
}

.dashboard-section .ct-chart-bar .ct-label.ct-horizontal.ct-end {
    align-items: flex-start;
    justify-content: center;
    text-align: center;
    text-anchor: start;
}

.dashboard-section .ct-label.ct-horizontal.ct-end {
    align-items: flex-start;
    justify-content: flex-start;
    text-align: left;
    text-anchor: start;
}

.dashboard-section .ct-chart .ct-label {
    fill: rgba(0, 0, 0, 0.4);
    color: #8b92a9;
    display: flex;
}

.dashboard-section .ct-chart-line .ct-label,
.dashboard-section .ct-chart-bar .ct-label {
    display: block;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    left: 10px;
    position:relative;
}
.dashboard-section .ct-chart .ct-label.ct-vertical {
    position: relative;
    top: 15px;
}
.dashboard-section .ct-label {
    fill: rgba(0, 0, 0, 0.4);
    color: rgba(0, 0, 0, 0.4);
    font-size: 1rem;
    line-height: 1;
}
.sections-page.dashboard .section-header {
    padding-left: 1rem;
    padding-bottom: 1rem;
    font-size: 1.4rem;
}
.sections-page.dashboard .section-row {
    padding: 0;
    margin: 0;
}
.dashboard-section {
    position: absolute;
    overflow: auto;
}

/*.sections-page.revenue {
    flex: 1;
    height: 100%;
    display: flex;
    flex-direction: column;
    padding-bottom: 0;
    padding-right: 0;
}*/
.sections-page.revenue .app-body-container {
   /* flex: 1;*/
    border-top: solid 1px rgba(100,100,100,.3);
    margin-top: 1rem;
    padding-top: 1rem;
    position: relative;
    /* overflow: auto;*/
    flex: 1;
}
.sections-page.revenue .media-data {
    display: flex;
    flex-wrap: wrap;
    flex: 1;
    margin-left: -.5rem;
    /*margin-right: -1rem;*/ 
    overflow: auto;
    position: absolute;
}
    .sections-page.revenue .media-data .column {
        margin: 1rem;
        border: solid 1px rgba(100,100,100,.1);
        padding: 1.5rem 2rem;
        border-radius: 5px;
        flex: 1;
        display: flex;
        flex-direction: column;
        line-height: 1.4;
        box-shadow: 7px 7px 7px 0px rgb(0 0 0 / 10%);
        box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
        background-color: rgba(0,0,0,.7);
        text-shadow: -1px 1px 2px rgb(0 0 0);
        text-shadow: 0px 1px 1px rgb(0 0 0);
    }
.sections-page.revenue .media-data .column.totals {
    background: linear-gradient( 60deg, #288c6c, #4ea752);
}
.sections-page.revenue .media-data .column.subscribed.monthly {
    background: linear-gradient(20deg, #F13F60, #CF3E75);
}
.sections-page.revenue .media-data .column.subscribed.yearly {
    background: linear-gradient( 20deg, #0083B0, #00B4DB);
}
.sections-page.revenue .media-data .column.purchase {
    background: linear-gradient( 60deg, #7b1fa2, #913f9e);
}
.sections-page.revenue .media-data .column.rented {
    background: linear-gradient( 195deg,#323a54,#1a2035)
}
/*.sections-page.revenue .section-row {
    border-top: solid 1px rgba(100,100,100,.3);
    padding-top: 1rem;
    margin-top: 0.5rem;
}
.sections-page.subscribers .section-row {
    border-top: solid 1px rgba(100,100,100,.3);
    padding-top: 1rem;
    margin-top: 0.5rem;
}*/
.sections-page > section {
    display: flex;
    flex-direction: column;
    flex: 1;
    /*padding-bottom: 1rem;*/
}
.uppercase {
    text-transform:uppercase;
}
.app-form-field-data-header {
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    font-weight: bold;
    font-size: 1.4rem;
    white-space: nowrap;
    padding-bottom: 0.5rem;
}
.app-form-field-data {
    font-size: 1.2rem;
    padding-bottom:3px;
}
/*.app-form-field-data.fees {
    color: rgb(255, 171, 21);    
}
.app-form-field-data.positive {
    color:green;  
}*/
.app-form-field-data.total {
    border-top: solid 1px rgba(0,0,0,.3);
    padding-top: 0.5rem;
    margin-top: 0.2rem;
}
.app-form-field-data .app-label {
    display: flex;
    flex-direction: column;
    min-width: 180px;
    text-align: right;
    text-transform: uppercase;
    padding-right: 10px;
    text-align: right !important;
    opacity: 1;
}
.app-form-field-data .app-span {
    display: flex;
    flex:1;
    text-transform: uppercase;
    padding-right: 10px;
}
.column.subscribed .app-label {
    min-width: 265px;
}
.column.rented .app-label {
    min-width: 192px;
}
.column.purchase .app-label {
    min-width: 229px;
}
.column.usage .app-label {
    min-width: 149px;
}
.column.totals .app-label {
    min-width: 271px;
}
.column .app-form-field-data {
    flex-wrap: nowrap;
}
.column .app-label {
    text-transform: none !important;
    white-space: nowrap;
    text-align: left !important;
}
.sections-page section button.download-button {
    font-size: 1rem;
    color: #0d6efd;
    text-decoration: underline;
    opacity: 1 !important;
}
.revenue-summary {
    padding: 1rem;
    /* width: 100%; */
    background-color: black;
    background-clip: border-box;
    /* border: 1px solid rgba(0, 0, 0, 0.125); */
    /* border-radius: 0.25rem; */
    /* font-size: .875rem; */
    /* margin: 1rem; */
    color: white;
    /* margin-top: 2.5rem; */
    border-radius: 5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
    margin: 1rem;
    margin-left: 1REM;
    margin-top: 0;
    MARGIN-RIGHT: 1rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    background: linear-gradient(to bottom, #0d6efd 0%,#7db9e8 100%);
    border-bottom: 1px solid rgba(0,0,0,.125);
    align-items: center;
    display: flex;
    flex-direction: column;
}
.revenue-summary-title-container {
}
.revenue-summary-title {
    font-size: 2.4rem;
    font-weight: bold;
}
.revenue-summary-project-container {
    display:flex;
    padding:.5rem;
}
.revenue-summary-date-container {
    display: flex;
    padding: .5rem;
}
.revenue-summary-lastStatement {
}
.revenue-summary-dateRange {
    padding-left:2rem;
    padding-right:2rem;
}
.revenue-summary-nextStatement {
}
.revenue-summary-totals-container {
    display:flex;
}
.revenue-summary-totalPayout-container {
}
.revenue-summary-totalPayout {
    font-size:3rem;
}
.revenue-summary-totalPayout.payout {
    color: #0d6efd;
}
.revenue-summary-totalPayoutLabel {
    font-size: 1rem;
    padding-left: 2rem;
}
.subscribers-summary .revenue-summary-totalPayoutLabel {
    padding-left:0;
}
.purchases-summary .revenue-summary-totalPayoutLabel {
    padding-left: 0;
}
.products-summary .revenue-summary-totalPayoutLabel {
    padding-left: 0;
}
.revenue-summary-totalFees-container {
    padding-left: 3rem;
    padding-right: 3rem;
}
.revenue-summary-totalFees {
    font-size: 3rem;
}
.revenue-summary-totalFees.fees {
    color: rgb(255, 171, 21);
}
.revenue-summary-totalFeesLabel {
    font-size: 1rem;
    padding-left: 2rem;
}
.subscribers-summary .revenue-summary-totalFeesLabel {
    padding-left: 0;
}
.purchases-summary .revenue-summary-totalFeesLabel {
    padding-left: 0;
}
.products-summary .revenue-summary-totalFeesLabel {
    padding-left: 0;
}
.revenue-summary-totalAmount-container {
}
.revenue-summary-totalAmount {
    font-size: 3rem;
}
.revenue-summary-totalAmount.positive {
    color:limegreen;
}
.revenue-summary-totalAmountLabel {
    font-size: 1rem;
    padding-left: 2rem;
    display:flex;
}
.subscribers-summary .revenue-summary-totalAmountLabel {
    padding-left:1rem;
}
.purchases-summary .revenue-summary-totalAmountLabel {
    padding-left: 1rem;
}


.dashboard-map-widget {
    height: 300px;
    width: 500px;
    text-align: end;
}
.jvectormap-legend-cnt-h {
    bottom: 0;
    right: 0;
}
.jvectormap-legend-cnt-v {
    top: 0;
    right: 0;
}

.jvectormap-legend-cnt {
    position: absolute;
}
.jvectormap-zoomin {
    top: 10px;
}
.jvectormap-zoomout {
    top: 30px;
}
.jvectormap-zoomin, .jvectormap-zoomout {
    width: 10px;
    height: 10px;
}
.jvectormap-goback, .jvectormap-zoomin, .jvectormap-zoomout {
    position: absolute;
    left: 10px;
    border-radius: 5px;
    background: #292929;
    padding: 3px;
    color: #fff;
    cursor: pointer;
    line-height: 10px;
    text-align: center;
    box-sizing: content-box;
}
.jvectormap-container {
    width: 100%;
    min-width:300px;
    height: 100%;
    min-height:200px;
    position: relative;
    overflow: hidden;
    touch-action: none;
}
.dashboard-map {
    padding: 1rem;
    /* width: 100%;*/
    background-color: black;
    background-clip: border-box;
    /*  border: 1px solid rgba(0, 0, 0, 0.125);*/
    /* border-radius: 0.25rem;*/
    /* font-size: .875rem; */
    /* margin: 1rem; */
    color: white;
    /* margin-top: 2.5rem; */
    border-radius: 5px;
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
    margin: 1rem;
    margin-left: 1REM;
    margin-top: 0;
    MARGIN-RIGHT: 1.9rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    background: linear-gradient(to bottom, #0d6efd 0%,#7db9e8 100%);
    border-bottom: 1px solid rgba(0,0,0,.125);
}
.dashboard-map-title-container {
    display: flex;
}
.dashboard-map-icon {
    border-radius: 5px;
    background-color: #999;
    padding: 15px;
    margin-top: -20px;
    margin-right: 15px;
    float: left;
    box-shadow: 0 4px 20px 0 rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(76 175 80 / 40%);
    background: linear-gradient( 60deg,#66bb6a,#43a047);
    display: none;
}
.dashboard-map-title {
    padding-left:1rem;
    font-size:2rem;
    font-weight:bold;
}
.dashboard-map-item-container {
    display: flex;
    justify-content: space-between;
}
.dashboard-map-countries-container {
    margin-right:2rem;
}
.dashboard-map-container {

}
.dashboard-map-countries {
    padding: 1rem 0;
    position: relative;
    flex: 1;
}
.dashboard-map-countries table {
    width:100%;
}
.dashboard-map-countries table.scrollable {    
    overflow: auto;
    position: absolute;
}
.dashboard-map-countries table th {
    border-bottom: solid 1px rgba(100,100,100,.3);
    text-transform: uppercase;
    font-size: 1rem;
    padding: .5rem 1rem;
}
.dashboard-map-countries table td {
    font-size: 1rem;
    padding: .5rem 1rem;

}
.dashboard-map-countries table td.center,
.dashboard-map-countries table td.center > div,
.dashboard-map-countries table th.center{
    text-align:center;    
}
.dashboard-map-countries table td.right,
.dashboard-map-countries table td.right > div,
.dashboard-map-countries table th.right{
    text-align:right;
}
.dashboard-subscriber-actions {
    display:flex;
}
.dashboard-subscriber-actions button {
    margin: 0 1rem;
}

.dashboard-subscriber-error .warning {
    color: goldenrod;
}
.dashboard-subscriber-error .ok {
    color:green;
}
.dashboard-subscriber-error .error {
    color: red;
}
.dashboard-subscriber-artwork {
    text-align: center;
}
.dashboard-subscriber-artwork img {
    max-width: 125px;
    max-height: 125px;
}
.app-tab-view.product {
    flex-direction: row;
    position: relative;
    overflow: hidden;
    justify-content: center;
}
.app-tab-view.product .app-form-field-image-container {
 /*   border-color: transparent !important;
    padding: 0;*/
    min-width: 400px;
}
.app-tab-view.product .app-form-field-image-container .app-form-field-img {
    max-width:500px;
    max-height:300px;
}
.app-tab-view.product .product-info {
    flex:1;
    display:flex;
}
.app-tab-view.product .product-pricing {
    flex:1;
}
.app-tab-view.product .product-data {
    flex: 1;
    margin: 0.25rem;    
}
.app-tab-view.product .product-image {
    flex: 1;
    margin: 0.25rem;    
}
.app-tab-view.product .app-form-field-textarea.productDescription textarea {
    min-height: 150px;
}
.app-tab-view.product .app-form-field-textarea.productTitle textarea {
    min-height: 50px;
}
.app-tab-view.product .app-form-actions {    
    display: flex;
   /* margin-top: -10px;*/
    padding-bottom: 10px;
}
.sections-container-user .app-icon-span.verified {
    color: green;
    padding-top: 0.5rem;
    font-size: 1rem;
}
.sections-container-user .app-button-icon.edit {
    font-size: 1rem;
    color: #0d6efd;
    padding-left: 1rem;
}
.sections-container-user .email-field-body {
    font-size: 1.6rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.sections-container-user .email-field-body label {
    opacity: 1;
}
.sections-container-user .login-email input {
    font-size: 1.6rem;
    min-width: 700px;
}
.sections-container-analytics .sections-page {
    padding-top:0rem;
}




#views .view.library  {
    height: 100%;
}


#views .view.library .container {
    flex: 1;
    display: flex;
    overflow: hidden;
    height:100%;
    position:relative;
}

    #views .view.library .container > .display {
        flex: 1;
        display: flex;
        overflow: hidden;
        position: absolute;
        right: 0;
        left: 0;
        top: 0;
        bottom: 0;
    }


.sections-container .splitter {
    width: 1px;
    /* background-color: #d0d0d0;*/
    cursor: ew-resize !important;
    position: relative;
}

.sections-container .splitter-helper {
    z-index: 10;
    position: absolute;
    left: -5px;
    right: -5px;
    top: 0px;
    bottom: 0px;
    cursor: ew-resize !important;
    display: flex;
}

    .sections-container .splitter-helper.hidden {
        display: none;
    }


#views .view.library section {
    overflow: auto;
}

    #views .view.library section.hidden {
        display: none;
    }

    #views .view.library section.library {
      /*  background-color: whitesmoke;*/
        color: rgb(83, 79, 91);
        /*font-weight:bold;*/
        width:100%;
        margin-left:5px;
    }

        #views .view.library section.library .subsection {
            display: flex;
            flex-direction: column;
            padding-bottom: 0px;
            width:100%;
        }

            #views .view.library section.library .subsection > label {
                color: rgb(120, 118, 119);
                font-size: .7em;
                display: flex;
                align-items: center;
                flex: 1;
                padding: 5px 10px;
                padding-left: 12px;
                padding-bottom: 3px;
            }

            #views .view.library section.library .subsection.drop > button {
                border-bottom: 2px solid black;
            }

            #views .view.library section.library .subsection > button .expand {
                transition: transform linear 100ms;
                padding: 3px;
                padding-right: 0px;
                position: relative;
                top: -1px;
                color: white;
                padding-left: 5px;
                padding-right: 5px;
            }

                #views .view.library section.library .subsection > button .expand.expanded {
                    transform: rotate(90deg) translateY(2px) translateX(-1px);
                }

            #views .view.library section.library .subsection > button .expand .svg-icon {
                width: 6px;
                height: auto;
            }

            #views .view.library section.library .subsection > label .name {
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
                font-size: 1em;
                color: white;
                flex: 1;
                text-align: left;
            }

            #views .view.library section.library .subsection .items {
                display: flex;
                flex-direction: column;
                flex: 1;
            }

                #views .view.library section.library .subsection .items.hide {
                    display: none;
                }

                #views .view.library section.library .subsection .items .item {
                    display: flex;
                    flex-direction: column;
                    flex: 1;
                    /*overflow:hidden;*/
                }

                    #views .view.library section.library .subsection .items .item.is-hidden {
                        display: none;
                    }

                    #views .view.library section.library .subsection .items .item > button {
                        display: flex;
                        align-items: center;
                        flex: 1;
                        /*cursor: default;*/
                        font-size: 1rem;
                        padding: 10px;
                        padding-left: 17px;
                        color: white;
                        /*border-radius: 3px;*/
                    }

                    #views .view.library section.library .subsection .items .item > button {
                        padding-left: 10px;
                    }

                    #views .view.library section.library .subsection .items .item.drop > button {
                        border-bottom: 2px solid white;
                    }

                    #views .view.library section.library .subsection .items .item > button:hover {
                        background-color: rgba(100,100,100,.1);
                    }

                    #views .view.library section.library .subsection .items .item.hilite-drop > button {
                        background-color: rgba(100,100,100,.1);
                    }

                #views .view.library section.library .subsection .items .hilite.item > button {
                    background-color: rgba(100,100,100,.1);
                }

                #views .view.library section.library .subsection .items .select.item > button {
                    background-color: rgba(100,100,100,.7) !important;
                    color: white !important;
                    background: #0d6efd !important;
             /*       box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(76 175 80 / 40%) !important;*/
                    border-right-width: 3px;
                }
                #views .view.library section.library .subsection .items .item:not(.select) > button:hover {
                    background-color: rgb(50,50,50) !important;
                    opacity: 1;
                    border-right-color: #0d6efd;
                }
            #views .view.library section.library .subsection > button {
                padding:10px;
            }
            #views .view.library section.library .subsection > button.context-menu {
                background-color: rgba(100,100,100,.7) !important;
                color: white !important;
            }


            #views .view.library section.library .subsection.select > button {
                background-color: rgba(100,100,100,.7) !important;
                color: white !important;
                background: #0d6efd !important;
                /*box-shadow: 0 4px 20px 0px rgb(0 0 0 / 14%), 0 7px 10px -5px rgb(76 175 80 / 40%) !important;*/
                border-right-width: 3px;
            }
            #views .view.library section.library .subsection:not(.select) > button:hover {
                background-color: rgb(50,50,50) !important;
                opacity: 1;
                border-right-color:  #0d6efd;
            }
            body.light-mode #views .view.library section.library .subsection:not(.select) > button:hover {
                background-color: rgba(154, 181, 213, .2) !important;
                opacity: 1;
                border-right-color:  #0d6efd;
            }

                #views .view.library section.library .subsection .items .context-menu.item > button {
                    background-color: rgba(100,100,100,.7) !important;
                    color: white !important;
                }

                    #views .view.library section.library .subsection .items .context-menu.item > button.selected {
                        background-color: #1C1C22 !important;
                    }

                #views .view.library section.library .subsection .items .item > button > .icon-container {
                    width: 0;
                    min-width: 18px;
                    display: flex;
                    justify-content: center;
                }
                #views .view.library section.library .subsection .items .item.no-item > button .icon-container {
                    margin-left: 5px;
                }
                #views .view.library section.library .subsection .items .item > button .icon {
                    min-width: 28px;
                    max-width: 28px;
                    max-height: 56px;
                }

                    #views .view.library section.library .subsection .items .item > button .icon.hide {
                        display: none;
                    }

                #views .view.library section.library .subsection .items .item > button .icon-container .svg-container {
                    flex: 1;
                    min-width: 28px;
                    max-width: 28px;
                    max-height: 28px;
                    display: flex;
                }

                    #views .view.library section.library .subsection .items .item > button .icon-container .svg-container svg {
                        flex: 1;
                        min-width: 28px;
                        max-width: 28px;
                        min-height: 28px;
                        max-height: 28px;
                    }

                #views .view.library section.library .subsection .items .item > button .name {
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                    margin-left: .8rem;
                }

                /*#views .view.library section.library .resize .subsection .items .item>button {
    cursor: ew-resize;
}

#views .view.library section.library.resize {
    cursor: ew-resize;
}*/

            #views .view.library section.library .subsection .items .item .expand {
                /*width: auto !important;
    text-align: right;
    padding-right: 5px;
    font-weight: bold;
    cursor: pointer;
    transition: transform linear 100ms;
    margin-left: -3px;
    font-size: .8em;*/
                width: 12px;
                text-align: right;
                /*  font-weight: bold;*/
                cursor: pointer;
                transition: transform linear 100ms;
                font-size: .8em;
                margin-left: -7px;
                margin-right: .5rem;
                padding: 5px;
            }
.tab-container #views .view.library section.library .subsection .items .item .expand {
    margin-left: 7px;
    margin-right: 0rem;
}
#views .view.library section.library .subsection .items .item .expand.nonvisible {
    visibility: hidden;
}

                    #views .view.library section.library .subsection .items .item .expand.expanded {
                        transform: rotate(90deg) translateY(0px) translateX(-4px);
                    }

                    #views .view.library section.library .subsection .items .item .expand .svg-icon {
                        width: 6px;
                        height: 6px;
                    }
.tab-container #views .view.library section.library .subsection .items .item .expand .svg-icon {
    width: 10px;
    height: 10px;
}

                        #views .view.library section.library .subsection .items .item .expand .svg-icon .shape-fill {
                            fill: black;
                            stroke: black;
                        }
.tab-container #views .view.library section.library .subsection .items .item .expand .svg-icon .shape-fill {
    fill: #fff;
    stroke: #fff;
}

#views .view.library section.library .subsection .items .item.select > button .expand .svg-icon .shape-fill {
    fill: #fff;
    stroke: #fff;
}

                /*#views .view.library section.library.resize .subsection .items .item>button {
    cursor: ew-resize !important;
}

#views .view.library section.library.resize .subsection .items .item {
    cursor: ew-resize !important;
}*/

                #views .view.library section.library .subsection .items .item .items {
                    display: none;
                    flex-direction: column;
                    flex: 1;
                }

                    #views .view.library section.library .subsection .items .item .items.expanded {
                        display: flex;
                    }


    /*#views .view.library section.library .subsection > .items .item .items .item>button
{
    padding:2px 10px 2px 26px;
}*/


    /*##hovercolor #289552*/

    #views .view.library section.content {
        flex: 1;
    }



#library-information-bar {
    max-height: 22px;
    min-height: 22px;
    background: linear-gradient(to bottom, #e4e5e5 0, #d9d9d9 100%);
    border: solid 1px #d0d0d0;
    text-overflow: ellipsis;
    overflow: hidden;
    display: flex;
    justify-content: center;
    font-size: .75em;
    align-items: center;
    border-color: rgba(0,0,0, .05);
}

    #library-information-bar.hidden {
        max-height: 0px;
        min-height: 0px;
        border-top: none;
    }

.playback #library-information-bar {
    display: none;
}

.fullscreen #library-information-bar {
    display: none;
}



.view.list {
    display: flex !important;
    flex: 1 !important;
    overflow: auto;
    margin-left: 0px;
    position: relative;
    height:100%;
}

.view.hidden {
    display: none;
}

.view.list .loader-container {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}

.drag-image {
    position: absolute;
    opacity: 0;
    left: -1000px;
    top: -1000px;
}

    .drag-image > div {
        position: relative;
        width: 100%;
        height: 100%;
    }

        .drag-image > div img {
            position: absolute;
            max-width: 180px;
            max-height: 180px;
        }

    .drag-image .drag-square {
        position: absolute;
        background-color: #0D7AFF;
        border: solid 1px #0D7AFF;
        padding: 10px;
        left: 44px;
        top: 50px;
        color: white;
    }

.list-view-container {
    display: none;
    flex-direction: column;
    flex: 1;
    overflow: hidden;
    position: relative;
}

    .list-view-container.show {
        display: flex;
    }

.list-view-header {
    display: flex;
    /*max-height: 115px;
    min-height: 115px;*/
    /*  background-color: whitesmoke;*/
    border-bottom: solid 1px rgba(100,100,100,.3);
    align-items: center;
    position: relative;
    /*   border-color: rgba(0,0,0, .05);*/
    min-height: 200px;
    overflow: auto;
}
/*.clients .list-view-header {
    padding-top:6px;
}*/

.list-view-header-left-container {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}

.list-view-header-item-container {
    display: flex;
    align-items: center;
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
    height:100%;
}
.upload-files .list-view-header-item-container {
    display: flex;
    height:unset;
    flex-direction: column;
    align-items: baseline;
    padding: 0 1rem;
}
.upload-files .links-warning-label {
    padding-left:.6rem;
}

.list-view-header-links {
    /*position: absolute;
    top: .5rem;
    left: .5rem;*/
    font-size: .9rem;
    padding: 10px;
    padding-top: 3px;
    padding-bottom: 3px;
    z-index: 5;
    display: flex;
    align-items: baseline;
}

    /*.clients .list-view-header-links {
    top: 10px;
}*/

    .list-view-header-links a {
        margin-left: .3rem;
        margin-right: .3rem;
        color: #373737;
    }

        .list-view-header-links a.html-link {
            margin-left: 1rem;
            margin-right: 0;
            cursor: pointer;
            opacity: .8;
            transition: .2s;
            color:white;
        }

            .list-view-header-links a.html-link:hover {
                opacity: 1;
            }

            .list-view-header-links a.html-link:active {
                opacity: .8;
            }

    .list-view-header-links i {
        font-size: .5rem;
        color: whitesmoke;
        margin-left: 0.5rem;
        margin-right: 0.5rem;
    }

    .list-view-header-links a > i {
        color: white;
        position: relative;
        top: 0px;
        margin-left: 0px;
        font-size: .9rem;
    }

.no-info .list-view-header {
    max-height: 0px;
    min-height: 0px;
    border-bottom: none;
    overflow: hidden;
}

.list-view-header-artwork {
    display: flex;
    /* width: 115px; */
    /* height: 115px; */
    align-items: center;
    justify-content: center;
    padding-left: 35px;
    padding-right: 15px;
}

.list-view-header-images {
    display: flex;
}

.client-item .list-view-header-images {
    top: .5rem;
    position: relative;
    transform: scale(.9);
}

.client-item .list-view-header-artwork {
    padding-right: 0px !important;
}

.client-item .list-view-header-data {
    padding-top: .5rem;
}

.list-view-header-img,
.list-view-header-svg {
    max-height: 100px;
    max-width: 100px;
    /*border: solid 1px lightgray;
    box-shadow: 0px 3px 6px 2px rgba(163, 157, 163, 0.3);*/
}

.list-view-header-img {
    box-shadow: 0px 3px 6px 2px rgba(163, 157, 163, 0.3);
    box-shadow: 7px 7px 7px 0px rgb(0 0 0 / 10%);
}

.default-artwork .list-view-header-img {
    box-shadow: none;
}

.list-view-header-img.default-artwork {
    box-shadow: none;
}

.playlists .list-view-header-img {
    box-shadow: none;
}

.channels .list-view-header-img {
    box-shadow: none;
}

.clients .list-view-header-img {
    box-shadow: none;
}

.list-view-header-img.hide {
    display: none;
}

.device .list-view-header-img {
    border: none;
}

.device-folder .list-view-header-img {
    border: none;
}

.list-view-header-images svg {
    width: 100%;
    max-height: 85px;
}

.list-view-header-data1 {
    font-size: 1.25em;
    letter-spacing: 1px;
}

.list-view-header-data2 {
    font-size: .75em;
 /*   color: gray;*/
    padding-top: 5px;
}

.list-view-header-data3 {
    font-size: .75em;
   /* color: gray;*/
    padding-top: 5px;
}

.list-view-header-data4 {
    font-size: .75em;
    /*color: gray;*/
    padding-top: 5px;
}

.list-view-header-data > div:empty {
    padding-top: 0;
}

.list-view-header-search {
    /* padding: 0px 15px;
    border-left: solid 1px lightgray;
    margin: 1rem;*/
    font-size: .9rem;
    flex: 1;
    display: flex;
  /*  position: absolute;*/
    /* transition: .75s;*/
    right: -600px;
    transition:.3s;
    /*background-color: whitesmoke;*/
    padding: 10px;
    padding-bottom: 5px;
    padding-right: 0;
    padding-left: 0;
    /*z-index: 5;*/
}
/*.list-view-container.reports .list-view-header-search {
    right: -1091px;
}*/
.list-view-header-search-options {
    justify-content: space-between;
    display: flex;
    /*flex-direction: column;*/
    position: relative;
    flex: 1;
    align-items: flex-end;
    justify-content: end;
}
.list-view-header-search-options button {
    margin:.5rem 1rem;     
}

.list-view-header-search-options-details {
    /*width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    border: 1px solid gray;*/
}
/*.list-view-header-search-options-details-dot {
    width: 1px;
    height: 1px;
    border: 2px solid;
    border-radius: 100px;
    background-color: gray;
    color: gray;
}*/

.show-search-options .list-view-header-search {
    right: -1px;
}

.sortBy-search-options .list-view-header-search {
    right: -1px;
}
/*.show-search-options .list-view-container.analytics .list-view-header-search {
    right: unset;
    left: 122px;
    top: 13px;
}*/
.list-view-header-search-field {
    display: flex;
    align-items: center;
    padding-bottom: 5px;
}

    .list-view-header-search-field span {
        padding-right:.5rem;
        min-width: 68px;
        text-align: right;
        white-space:nowrap;
    }

.list-view-header-search-thumbnails {
    display: flex;
    justify-content: space-between;
    padding-top: 2px;
}

.list-view-header-search-thumbnails-container {
    position: relative;
    left: -17px;
    display: flex;
    align-items: center;
}

.list-view-header-search-subfolders-container {
    position: relative;
    left: -9px;
    display: flex;
    align-items: center;
    padding-top: 5px;
}

.list-view-header-search-checkbox {
    display: flex;
    justify-content: space-between;
    padding-top: 2px;
}

.list-view-header-search-checkbox-container {
    position: relative;
    left: -14px;
    display: flex;
    align-items: center;
}

.list-view-header-search-data {
    padding-right: 20px;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.list-view-header-search-data-1 {
    border-left: solid 1px lightgray;
    padding-left: 10px;
    margin-left: 10px;
    border-color: rgba(100,100,100, .3);
}
/*.list-view-container.analytics .list-view-header-search-data-1 {
    border-left: none;
}
*/
.list-view-header-search-data-2 {
    /* padding-top: 17px;*/
    order: 1;
}

.list-view-header-search-actions {
   /* position: absolute;*/
    right: 21px;
    bottom: 21px;
    display: flex;
    align-items: baseline;
}

.list-view-header-search input[type=text] {
    min-width: 175px !important;
}

.list-view-header-search-actions button {
    margin-left: 5px;
}

.list-view-header-search-data-3 {
    /* padding-top: 17px;*/
}

.list-view-header-search-data-4 {
    /* padding-top: 17px;*/
    order: 2;
}

.list-view-header-search-data-5 {
    /* padding-top: 17px;*/
    order: 3;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.list-view-header-search-data-2 .list-view-header-search-field span {
    min-width: 131px;
}

.list-view-header-search-data-3 .list-view-header-search-field span {
    min-width: 45px;
}

.list-view-container.reports .list-view-header-search-data-2 .list-view-header-search-field span {
    min-width: 54px;
}
/*.list-view-container.reports .list-view-header-search-data-3 .list-view-header-search-field span {
    min-width: 71px;
}*/
.list-view-container.reports .list-view-header-search-data-4 .list-view-header-search-field span {
    min-width: 29px;
}

.list-view-container.reports .list-view-header-search-data-5 .list-view-header-search-field span {
    min-width: 78px;
}

.list-view-container.reports .list-view-header-search-subfolders-container {
    left: 0px;
}

.list-view-container.reports .list-view-header-search-checkbox-container {
    left: 0px;
}

.list-view-container.reports .list-view-header-search-actions {
    /*bottom: 10px;*/
    bottom: unset;
    padding-top: 2px;
}

.list-view-header-search-field select {
    font-size: inherit !important;
}

.list-view-header-search-field input[type="checkbox"] {
    position: relative;
    top: -1px;
}
.list-view-container.reports .list-view-header-search-field input[type="checkbox"] {
    order:1;
}
.list-view-container.reports .app-form-field.form-check .app-form-field-label {
    padding-left: 0px;
    padding-right: .5rem;
    text-transform: none;
    font-size: .9rem !important;
}


.list-view-container.clients .list-view-header-search-checkboxes .list-view-header-search-field input[type="checkbox"] {
    order: 1;
}

.list-view-container.clients .list-view-header-search-checkboxes .list-view-header-search-subfolders {
    padding-right: 11px;
}

.list-view-container.clients .list-view-header-search-checkboxes {
    padding-right: 12px;
}

.list-view-container.clients .list-view-header-search-checkboxes .app-form-field.form-check .app-form-field-label {
    padding-left: 0px;
    padding-right: .5rem;
    text-transform: none;
    font-size: .9rem !important;
}

.list-view-header-search-show-non-streamable {
    padding-top: 5px;
}

.list-view-header-search-header {
    color: whitesmoke;
    padding: 5px;
    position: relative;
    top: -6px;
    left: 15px;
}

    .list-view-header-search-header span {
        font-size: .5rem;
        text-transform: uppercase;
        letter-spacing: 2px;
    }

.list-view-header-search-show {
    padding: 5px;
    height: fit-content;
}

.show-search-options .list-view-header-search-show {
    display: none;
}

.list-view-header-search-hide {
    padding: 5px;
    height: fit-content;
    display: none;
}

.show-search-options .list-view-header-search-hide {
    display: block;
}

.list-view-header-search-data-4 .list-view-header-search-checkbox span {
    min-width: 90px;
}

.list-view-body {
    display: flex;
    flex-direction: column;
    overflow: auto;
    flex: 1;
    /*width: calc(100% - 1px);*/
    position: relative;
}
.list-view-body.upload {
    overflow:visible;    
}

/*.list-view-body.item-details {
    overflow:unset;
}*/

.list-view-loading-button {
    display: none;
    color: red;
    cursor: pointer;
    opacity: .7;
    transition: .3s ease-in-out;
}

    .list-view-loading-button:hover {
        opacity: 1;
    }

    .list-view-loading-button:active {
        opacity: .9;
        transition: none;
    }

.list-view-groups {
    display: flex;
    flex: 1;
  /*  background-color: white;*/
    flex-wrap: wrap;
    /*overflow:auto;*/
    align-content: flex-start;
    /*height:100%*/
    /*padding-left: 1px;
    padding-top: 1px;*/
    /*justify-content: space-around;*/
}
.view.list .list-view-groups {
    position: absolute;
}

.group-lists .list-view-groups {
    display: block !important;
    flex-wrap: nowrap;
}

.group-lists .list-view-groups-top {
    width: 100%;
}

.group-lists .list-view-groups-bottom {
    width: 100%;
}

.list-view-container.channels .list-view-groups {
    flex-wrap: nowrap;
}

.list-view-container.channels .list-view-groups.force-wrap {
    flex-wrap: wrap;
}


.list-view-body.group-lists {
    flex-direction: column;
}

.item-details .list-view-groups {
    display: none;
}

.no-items .list-view-groups {
    display: none;
}

.not-ready .list-view-groups {
    display: none;
}

.show-schedule .list-view-groups {
    display: none;
}

.sortBy-schedule .list-view-groups {
    display: none;
}
/*.loading-items .list-view-groups {
    display:none;
}
.loading-items .list-view-group-list {
    display: none;
}*/

.list-view-group {
    display: flex;
    flex-direction: column;
    padding: 5px !important;
    border: solid 1px transparent !important;
    position: relative;
    cursor: default !important;
    z-index: 3;
    height:fit-content;
}

    .list-view-group.is-hidden {
        display: none;
    }

    .list-view-group.is-filtered {
        display: none;
    }

.show-streamable-files .list-view-group.non-streamable-file {
    display: none;
}

.show-non-streamable-files .list-view-group.streamable-file {
    display: none;
}

.show-missing-files .list-view-group.non-missing-file {
    display: none;
}

.show-files-in-cloud .list-view-group.file-not-in-cloud {
    display: none;
}

.show-files-not-in-cloud .list-view-group.file-in-cloud {
    display: none;
}

.show-audio .list-view-group:not(.audio) {
    display: none;
}

.show-video .list-view-group:not(.video) {
    display: none;
}

.show-images .list-view-group:not(.image) {
    display: none;
}

.show-urls .list-view-group:not(.url) {
    display: none;
}

.show-subtitles .list-view-group:not(.subtitles) {
    display: none;
}

.list-view-group.device, .list-view-group.device-folder {
    display: flex !important;
}

.list-view-group.show-always {
    display: flex !important;
}

.list-view-group.expander {
    display: none;
    flex-direction: row;
    position: relative;
    overflow: hidden;
    border-top: solid 1px lightgray !important;
    border-bottom: solid 1px lightgray !important;
    width: calc(100% + 1px);
    margin-left: -1px;
    margin-right: -1px;
    max-height: 0;
}

    .list-view-group.expander > .image {
        position: absolute;
        top: 0;
        left: 0;
        /* z-index: 0; */
        right: 0;
        bottom: 0;
        background-color: black;
    }

        .list-view-group.expander > .image .background {
            position: absolute;
            top: 0;
            left: 0;
            /* z-index: 0; */
            right: 0;
            bottom: 0;
            -webkit-filter: blur(15px);
            filter: blur(30px);
            transform: scale(1.1);
            background-repeat: no-repeat;
            background-size: cover;
            background-position: 0% 30%;
            opacity: .7;
        }

/*.show-groups .list-view-group {
    display: flex;
}*/
.list-view-group.show {
    display: flex !important;
}

.loading .list-view-group {
    display: none;
}

.group-lists .list-view-group {
    flex-direction: row;
}

.groups .list-view-group:hover {
}

/*.group-lists .list-view-group.select {
    background-color: #333;
    border: 1px solid #333;
}*/
.groups .list-view-group.select .list-view-group-item {
    background-color: rgb(40, 46, 51);
    border: solid 1px #0d6efd;
    /*background-color: rgba(154, 181, 213, .2);
    border: 1px solid #94ADCB;*/
}

.list-view-group.expanded {
    display: none;
    width: 100%;
    height: auto;
    flex-direction: row;
    background-color: rgb(221, 221, 221);
    margin: 0px;
    padding: 0px;
    height: 0px;
    border: 0px;
    backface-visibility: hidden;
}

.groups .list-view-group.expanded {
    display: flex;
    margin-top: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
    height: auto;
}

.groups .list-view-group.hide {
    display: none;
}


.list-view-group-item {
    display: flex;
    flex-direction: column;
    cursor: default;
    align-items: baseline;
    /*padding: 5px;
    padding-bottom: 10px;*/
    overflow: hidden;
    text-overflow: ellipsis;
    /*transition-property: background-color;
    transition: .2s;*/
    border: 1px solid transparent;
    backface-visibility: hidden;
    position: relative;
    border-radius: 5px;
    box-shadow: 0px 3px 6px 2px rgb(163 157 163 / 31%);
    color: black;
    margin-top: 10px;
    margin-left: 10px;
    padding: 0;
    padding-bottom: 0.5rem;
    align-items:center;
}
body.dark-mode .list-view-group-item {
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
}

.list-view-group.needs-approval .list-view-group-item {
/*    border-color: rgba(255, 171, 21, .7);*/
}

.expanded .list-view-group-item {
    order: 2;
}

/*.resize .list-view-group-item {
    cursor: ew-resize;
}*/

.button-list {
    text-align:right;
}
.list-view-header-search-details {
    color: #0069D9;
    padding: 0.5rem;
    position: relative;
    top: 2px;
    margin: 0 0.2rem;
}
body.dark-mode .list-view-header-search-details {
    color: #0d6efd;
}
.list-view-header-search-details i {
    font-weight: normal;
    font-size: 1.4rem;
}
.list-view-group.is-missing .list-view-group-item-image {
    opacity:.2;
}

.list-view-details {
    display: flex;
    flex: 1;
    /*background-color: white;*/
    flex-wrap: wrap;
    /*overflow:auto;*/
    align-content: flex-start;
    /*height:100%*/
    /*padding-left: 1px;
    padding-top: 1px;*/
    /*justify-content: space-around;*/
    position: absolute;
    width: 100%;
    height: 100%;
}
.app-view .app-form-table {
    position: relative;
    width: 100%;
    height: 100%;
}
.app-view .table-container.absolute {
    overflow: auto;
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.list-view-group-item-image {
    width: 260px;
    height: 260px;
    text-align: center;
    /* padding-top: 10px;
    padding-bottom: 10px;*/
    /*overflow: hidden;*/
    position: relative;
    display: flex;
    justify-content: center;
    /* padding-top: 5px;
    padding-bottom: 10px;*/
    overflow: hidden;
    background-color: black;
    margin-bottom: 10px;
   /* padding-bottom: 10px;*/
}
.default-artwork .list-view-group-item-image {
    background: linear-gradient(to bottom, #0d6efd 0%,#7db9e8 100%);
    /*background: white;*/
    border-bottom: solid 1px lightgray;
    background: transparent;
    border-bottom: solid 1px rgba(100,100,100,.3);
}
.default-artwork-gradient .list-view-group-item-image {
    background: linear-gradient(to bottom, #0d6efd 0%,#7db9e8 100%);
    /*background: white;*/
}
.groups .list-view-group-item-image > div > .preview {
    display:none !important;
}
.list-view-group-item-image-background {
    position: absolute;
    top: 0;
    left: 0;
    /* z-index: 0; */
    right: 0;
    bottom: 0;
    -webkit-filter: blur(15px);
    filter: blur(30px);
    transform: scale(1.1);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 0% 0%;
    opacity: .7;
    /* NOTE: this was turned off in the player for safari because it seemed to be giving hell on perforamnce and hardly ever visible */
    display: none;
}
.default-artwork .list-view-group-item-image-background {
    display:none;
}
.channels .list-view-group-item-image-background,
.playlists .list-view-group-item-image-background {
    display: none;
}
.channels .list-view-group-item-image,
.playlists .list-view-group-item-image {
    background-color: transparent;
    border-bottom: solid 1px rgba(100,100,100,.3);
}
.channels .list-view-group-item-image img,
.playlists .list-view-group-item-image img {
    box-shadow:none !important;    
}
.expander .list-view-group-item-image {
    width: 360px;
    height: 360px;
}

.artwork-size-0 .list-view-group-item-image {
    display: none;
}

.artwork-size-1 .list-view-group-item-image
{
    width: 20px;
    height: 20px;
}

.artwork-size-2 .list-view-group-item-image
{
    width: 38px;
    height: 38px;
}

.artwork-size-3 .list-view-group-item-image
{
    width: 56px;
    height: 56px;
}

.artwork-size-4 .list-view-group-item-image
{
    width: 74px;
    height: 74px;
}

.artwork-size-5 .list-view-group-item-image
{
    width: 92px;
    height: 92px;
}

.artwork-size-6 .list-view-group-item-image
{
    width: 110px;
    height: 110px;
}

.artwork-size-7 .list-view-group-item-image
{
    width: 128px;
    height: 128px;
}

.artwork-size-8 .list-view-group-item-image
{
    width: 146px;
    height: 146px;
}

.artwork-size-9 .list-view-group-item-image
{
    width: 164px;
    height: 164px;
}

.artwork-size-10 .list-view-group-item-image
{
    width: 180px;
    height: 180px;
}


.list-view-group-item-image-area
{
}

.list-view-group-item-image > div > div
{
    position: relative;
}
.list-view-group-item-image2 {
    display: flex;
    align-items: center;
    justify-content: center;
    /*height: -webkit-fill-available;*/
    z-index: 1;
}
.list-view-group-item-image2 .svg svg {
    width: 100%;
    max-height: 125px;
}

.list-view-group-item-image img {
    max-width: 260px;
    max-height: 260px;
    /*border: solid 1px #D3D3D3;*/
    /*backface-visibility: hidden;*/
    vertical-align: middle;
    border-color: transparent;
    box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
}
.list-view-group-item-image img.hide {
    display:none;
}
body.dark-mode .list-view-group-item-image img {
    box-shadow: none;
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
}
.default-artwork .list-view-group-item-image img {
    box-shadow: none !important;
    position: relative;
    top: 0.5rem;
    padding: 0.5rem;
}
.expander .list-view-group-item-image img {
    max-width: 360px;
    max-height: 360px;
}

.artwork-size-0 .list-view-group-item-image, .artwork-size-0 .list-view-group-item-image img
{
    display: none;
}

.artwork-size-1 .list-view-group-item-image, .artwork-size-1 .list-view-group-item-image img
{
    max-width: 20px;
    max-height: 20px;
}

.artwork-size-2 .list-view-group-item-image, .artwork-size-2 .list-view-group-item-image img
{
    max-width: 38px;
    max-height: 38px;
}

.artwork-size-3 .list-view-group-item-image, .artwork-size-3 .list-view-group-item-image img
{
    max-width: 56px;
    max-height: 56px;
}

.artwork-size-4 .list-view-group-item-image, .artwork-size-4 .list-view-group-item-image img
{
    max-width: 74px;
    max-height: 74px;
}

.artwork-size-5 .list-view-group-item-image, .artwork-size-5 .list-view-group-item-image img
{
    max-width: 92px;
    max-height: 92px;
}

.artwork-size-6 .list-view-group-item-image, .artwork-size-6 .list-view-group-item-image img
{
    max-width: 110px;
    max-height: 110px;
}

.artwork-size-7 .list-view-group-item-image, .artwork-size-7 .list-view-group-item-image img
{
    max-width: 128px;
    max-height: 128px;
}

.artwork-size-8 .list-view-group-item-image, .artwork-size-8 .list-view-group-item-image img
{
    max-width: 146px;
    max-height: 146px;
}

.artwork-size-9 .list-view-group-item-image, .artwork-size-9 .list-view-group-item-image img
{
    max-width: 164px;
    max-height: 164px;
}

.artwork-size-10 .list-view-group-item-image, .artwork-size-10 .list-view-group-item-image img
{
    max-width: 180px;
    max-height: 180px;
}


.list-view-group .artwork-list
{
    position: relative;
    z-index: 5;
    margin-right: .7rem;
    left:-2px;
    top:-2px;
}

.list-view-group .artwork-list img
{
    /*box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);*/
    border: solid 1px #D3D3D3;
    max-width: 160px;
    max-height: 160px;
    box-shadow:none;
}

    .list-view-group .artwork-list.single-image img
    {
        box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
    }

.list-view-group .artwork-list img.before
{
    left: 3px;
    top: 3px;
    z-index: -1;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #eee;
    box-shadow:none;
}

    .list-view-group .artwork-list.double-image img.before
    {
        box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
    }

    .list-view-group .artwork-list.single-image img.before
    {
        display: none;
    }

.list-view-group .artwork-list img.after
{
    left: 6px;
    top: 6px;
    z-index: -2;
    box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #eee;
}

.list-view-group .artwork-list.double-image img.after
{
    display: none;
}

    .list-view-group .artwork-list.single-image img.after {
        display: none;
    }

.artwork-size-1 .artwork-list img {
    max-width: 6px;
    max-height: 6px;
}

.artwork-size-2 .artwork-list img {
    max-width: 18px;
    max-height: 18px;
}

.artwork-size-3 .artwork-list img {
    max-width: 36px;
    max-height: 36px;
}

.artwork-size-4 .artwork-list img {
    max-width: 54px;
    max-height: 54px;
}

.artwork-size-5 .artwork-list img {
    max-width: 72px;
    max-height: 72px;
}

.artwork-size-6 .artwork-list img {
    max-width: 90px;
    max-height: 90px;
}

.artwork-size-7 .artwork-list img {
    max-width: 108px;
    max-height: 108px;
}

.artwork-size-8 .artwork-list img {
    max-width: 126px;
    max-height: 126px;
}

.artwork-size-9 .artwork-list img {
    max-width: 144px;
    max-height: 144px;
}

.artwork-size-10 .artwork-list img {
    max-width: 160px;
    max-height: 160px;
}

.app-form-labels {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0)
}

.expanded .list-view-group-item-image
,[class*="artwork-size-"] .expanded .list-view-group-item-image {
    max-width: 256px;
    max-height: 256px;
    display:block;
    width: 256px;
    height: 256px;
    padding-bottom: 0px;
    padding-top: 8px;
}

.expanded .list-view-group-item-image img 
,[class*="artwork-size-"] .expanded .list-view-group-item-image img {
    max-width: 256px;
    max-height: 256px;
    display:inline;
    max-width: 256px;
    max-height: 256px;
    backface-visibility: hidden;
}

.list-view-group-item-fileName {
    white-space: nowrap;
    font-size: .8rem;
    padding-top: 0px;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 260px;
    padding: 2px 0px;
    white-space: normal;
    line-height: 1rem;
    display: none;
}
.show-fileName .device-file .list-view-group-item-fileName {
    display: block;
}
.sortBy-fileName .device-file .list-view-group-item-fileName {
    display: block;
}

.list-view-container.channels .list-view-groups:not(.force-wrap) .list-view-group {
    padding: 0px !important;
    /*border-right: solid 1px lightgray !important;*/
    border: none !important;
}
.list-view-container.channels .list-view-groups:not(.force-wrap) .list-view-group-item {
    margin: 5px;
    /* border-right-color: lightgray;*/
}
.list-view-group-time {
    height: 20px;
    background-color: whitesmoke;
    width: 100%;
    text-align: left;
    margin: 0px;
    font-size: .7rem;
    display: flex;
    align-items: center;
    color: gray;
    /* background-color: #0d6efd; */
    width: 100%;
    text-align: center;
    margin: 0px;
    font-size: .8rem;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    border-bottom: 1px solid #94ADCB;
    background-color: #94ADCB !important;
    background-color: #0069D9 !important;
    position: relative;
}
.list-view-group-time span {
    padding:2px 5px;
}

.list-view-group-item-time {
    white-space: nowrap;
    font-size: .7rem;
    padding-top: 0px;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 260px;
    padding: 2px 0px;
    white-space: normal;
    line-height: 1rem;
    order: 99;
    color: gray;
    color: #FFAB15;
    font-size: .9rem;
    padding-top: 7px;
}
.channels .list-view-group-item-time {
    display: block;
}
.show-startTime .list-view-group-item-time {
    display: block;
    order: 0;
    color: #FFAB15;
    font-family: 'Nunito Medium', sans-serif;
    opacity: 1;
    text-transform: uppercase;
    font-size:.8rem;
}

.list-view-group-item-on-now {
    display: none;
    color: #FFAB15;
    /*    font-weight: bold;*/
    font-family: 'Nunito Medium', sans-serif;
    opacity: 1;
    text-transform: uppercase;
}
.list-view-group-item-on-now-spacer {
    display: none;
    margin-left: 5px;
    margin-right: 9px;
}
.list-view-group.on-now .list-view-group-item-on-now-spacer{
    display:block;
}
.list-view-group.on-now .list-view-group-item-on-now {
    display:block;
}
/*.list-view-group.on-now .list-view-group-time > span {
    display:none;
}*/
.list-view-group-item-position {
    display: none;
    position: absolute;
    bottom: -1px;
    left: 0;
    height: 2px;
    background-color: #FFAB15;
    border-top-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.list-view-group.on-now .list-view-group-item-position {
    display: block;
}
.list-view-group-item-sortOrder {
    white-space: nowrap;
    font-size: .8rem;
    padding-top: 0px;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 260px;
    padding: 2px 0px;
    white-space: normal;
    line-height: 1rem;
    display: none;
    order: 99;
    color: black;
}
/*body.dark-mode .list-view-group-item-sortOrder {
    color:whitesmoke;
}
*/
.playlists .list-view-group-item-sortOrder {
    display: block;
}

.show-sortOrder .list-view-group-item-sortOrder {
    /*font-size: .8rem;*/
    color: unset;
    order: unset;
    display: block;
    color: #FFAB15;
    font-family: 'Nunito Medium', sans-serif;
    opacity: 1;
    text-transform: uppercase;
}
.sortBy-sortOrder .list-view-group-item-sortOrder {
    /*font-size: .8rem;*/
    color: unset;
    order: unset;
}

.list-view-group-item-data1 {
    white-space: nowrap;
    font-size: 1.2rem;
    padding-top: 0px;
    /*text-align: left;*/
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 260px;
    padding: 3px 10px;
    white-space: normal;
}
.show-fileName .device-file .list-view-group-item-data1 {
    white-space: nowrap;
    font-size: 1.2rem;
    padding-top: 3px;
    /*text-align: left;*/
    text-overflow: ellipsis;
    max-width: 260px;
    overflow: hidden;
    color: black;
    padding: 2px 0px;
    line-height: initial;
}
.sortBy-fileName .device-file .list-view-group-item-data1 {
    white-space: nowrap;
    font-size: 1.2rem;
    padding-top: 3px;
    /*text-align: left;*/
    text-overflow: ellipsis;
    max-width: 260px;
    overflow: hidden;
    color: black;
    padding: 2px 0px;
    line-height: initial;
}

body.dark-mode .list-view-group-item-data1 {
    color: whitesmoke;
}

/*.clients .list-view-group-item-data1 {
}*/

/*.list-view-group.select .list-view-group-item-data1 {
    white-space: normal !important; 
}*/

.list-view-group-item-data2 {
    white-space: nowrap;
    font-size: .9rem;
   /* text-align: left;*/
    text-overflow: ellipsis;
    max-width: 260px;
    overflow: hidden;
    color: black;
    padding: 2px 10px;
}
body.dark-mode .list-view-group-item-data2 {
    color:whitesmoke;
}

.list-view-group-item-data3 {
    white-space: nowrap;
    font-size: .9rem;
    padding-top: 0px;
    /*text-align: left;*/
    text-overflow: ellipsis;
    max-width: 260px;
    overflow: hidden;
    color: black;
    padding: 2px 10px;
}
body.dark-mode .list-view-group-item-data3 {
    color: whitesmoke;
}

.list-view-group-item-data4 {
    white-space: nowrap;
    font-size: .9rem;
    padding-top: 0px;
   /* text-align: left;*/
    text-overflow: ellipsis;
    max-width: 260px;
    overflow: hidden;
    color: black;
    padding: 2px 10px;
}
body.dark-mode .list-view-group-item-data4 {
    color: whitesmoke;
}

.list-view-group-item-data5 {
    white-space: nowrap;
    font-size: .9rem;
    padding-top: 0px;
  /*  text-align: left;*/
    text-overflow: ellipsis;
    max-width: 260px;
    overflow: hidden;
    color: black;
    padding: 2px 10px;
}
body.dark-mode .list-view-group-item-data5 {
    color: whitesmoke;
}

.group-lists .list-view-group-item-data1 {
    display: none;
}

.group-lists .list-view-group-item-data2 {
    display: none;
}

.group-lists .list-view-group-item-data3
{
    display: none;
}

.list-view-group-item-process {
    display: none;
    white-space: nowrap;
    font-size: .8rem;
    text-align: center;
    text-overflow: ellipsis;
    width: 75%;
    overflow: hidden;
    color: gray;
    padding: 0;
    height: 3px;
    margin: 0 0rem;
    position: absolute;
    bottom: 3px;
    border-radius: 5px;
}
.list-view-group.processing .list-view-group-item-process {
    display: flex;
    flex-direction: column;
}
.list-view-group-item-process-bkgd {
    height: 4px;
    /* border-color: rgba(5, 114, 206, 0.1); */
    width: 100%;
    /* overflow: hidden; */
    /* border-radius: 6px; */
    flex: 1;
    /* border: solid 1px #1A86CF; */
    display: flex;
    background-color: rgba(100,100,100,.3);
    border-radius: 5px;
}
.list-view-group-item-process-bkgd-complete {
    background-color: rgba(5, 114, 206, 0.5);
    background-color: #0d6efd;
    /* background-color: #1A86CF; */
    height: 6px;
    /* opacity: .4; */
    transition: .3s;
    border: solid 1px rgba(100,100,100,.3);
    position: relative;
    top: -1px;
    left: -2px;
    border-radius: 5px;
}
.list-view-group-item-process-bkgd-incomplete {
    height: -webkit-fill-available;
}
.list-view-group-item-process-bkgd-value {
    display: none;
}

.list-view-group-list {
    display: none;
    flex: 1;
}

.expander .list-view-group-list {
    display: flex;
    flex: 1;
    background-color: black;
}

.group-lists .list-view-group-list {
    display: block;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
}

.device .list-view-group-item-image img {
    box-shadow:none;
}

.device-folder .list-view-group-item-image img {
    box-shadow: none;
}



.list-view-group-list-header {
    display: flex;
    padding-left: 3px;
    padding-bottom: 3px;
    padding-top: 2px;
    border-bottom: solid 1px lightgray;
    margin-bottom: 5px;
}

.list-view-group-list-header-playback-indicator {
    width: 10px;
    padding-left: 3px;
}

.playing .list-view-group-list-header-playback-indicator {
    background: url('/site/images/playbackIndicator.png');
    background-repeat: no-repeat;
    background-position-x: 3px;
    background-position-y: 3px;
}

.list-view-group-list-header-data1 {
}

.list-view-group-list-header-data2 {
    font-size: .85em;
    align-self: center;
    color: #484848;
    padding-top: 1px;
}

.list-view-group-list-header-data-seperator {
    display: none;
    background-color: #484848;
    border: solid 1px #484848;
    border-radius: 100px;
    height: 2px;
    width: 2px;
    opacity: .7;
    align-self: center;
    margin-left: 6px;
    margin-right: 5px;
}

    .list-view-group-list-header-data-seperator.show {
        display: block;
    }

.list-view-group-list-header-options {
}

.list-view-group-list-header-love {
}

.list-view-group-list-header-duration {
    flex: 1;
    text-align: right;
    font-size: .8em;
    align-self: center;
    padding-top: 1px;
    padding-right: 10px;
}

.list-view-group-list-items {
    display: none;
    flex-direction: column;
}

    .list-view-group-list-items.show {
        display: flex;
    }

    .list-view-group-list-items.hide {
        display: none;
    }

.list-view-group-list-item {
    display: flex;
}

    .list-view-group-list-item:active {
        background-color: rgba(154, 181, 213, .2);
        /*font-weight: bold;*/
    }

    .list-view-group-list-item.select {
        background-color: rgba(154, 181, 213, .2);
        /*font-weight: bold;*/
        /*border-left: 1px solid #94ADCB;
    border-right: 1px solid #94ADCB;*/
    }

        .list-view-group-list-item.select:first-of-type {
            /*border-top: 1px solid #94ADCB;*/
        }

        .list-view-group-list-item.select:last-of-type {
            /*border-bottom: 1px solid #94ADCB;*/
        }

.list-view-group-list-item-container {
    display: flex;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: .8em;
    cursor: default;
    flex: 1;
}

.single .list-view-group-list-item-container {
    display: none;
}

.list-view-group-list-item-playback-indicator {
    width: 10px;
    padding-left: 3px;
}

.playing .list-view-group-list-item-playback-indicator {
    background: url('/site/images/playbackIndicator.png');
    background-repeat: no-repeat;
    background-position-x: 3px;
    background-position-y: 3px;
}

.list-view-group-list-item-trackNumber {
    padding-right: 10px;
    text-align: right;
    width: 15px;
}

.single .list-view-group-list-item-trackNumber {
    display: none;
}

.list-view-group-list-item-name {
    flex: 1;
}

.list-view-group-list-item-duration {
    padding-right: 10px;
    text-align: right;
}

.loading-items .list-view-loading-items {
    display: flex;
}

.loading-items-container {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index:1;
}

.list-view-loading-items {
    display: none;
    flex: 1;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
    padding: 0px;
    z-index: 3;
    /*pointer-events:none;*/
}

.loading-items-background {
    /*background-color: whitesmoke;*/ /*#d1e3f7;*/
    background-color: rgba(0, 0, 0, .3);
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
}

.list-view-body.v-scroll .loading-items {
    right: 19px;
}

.list-view-body.h-scroll .loading-items {
    bottom: 43px;
}

.view.list .loading-items-container {
    display: flex;
    flex-direction: column;
    flex: 1;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

    .view.list .loading-items-container .loading-image {
        display: none;
        margin-right: 6px;
    }

.view.list loading-items-container .loading-image img {
    max-width: 250px;
}


.view.list .loading-items-container .cancel {
    display: none;
    background-color: transparent;
    border: none;
    height: 18px;
}

    .view.list .loading-items-container .cancel .circle-x {
        height: 17px;
        width: 17px;
    }

        .view.list .loading-items-container .cancel .circle-x .circle {
            fill: #9e9e9e;
        }

        .view.list .loading-items-container .cancel .circle-x .x {
            stroke: #fff;
        }

    .view.list .loading-items-container .cancel:hover .circle-x .circle {
        fill: red;
    }

    .view.list .loading-items-container .cancel:hover .circle-x .x {
        stroke: #fff;
    }

    .view.list .loading-items-container .cancel:active,
    .view.list .loading-items-container .cancel:focus {
        outline: none;
    }

.view.list .loading-items-container .cancel {
    background-color: #616161;
    border: none;
    border-radius: 50%;
    opacity: .5;
    text-transform: lowercase;
    color: #fff;
}

    .view.list .loading-items-container .cancel:hover {
        opacity: 1;
    }

    .view.list .loading-items-container .cancel:focus {
        outline: none;
        opacity: 1;
    }

.current-item {
    padding-top: 5px;
    font-size: .85em;
    display: none;
}

.list-view-no-items {
    display: none;
    flex: 1;
    overflow: auto;
}

.no-items .list-view-no-items {
    display: flex;
    justify-content: center;
}

.not-ready .list-view-no-items {
    display: flex;
    justify-content: center;
}

.loading-items .list-view-no-items {
    display: none !important;
}

.list-view-no-items-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
}

.list-view-no-items-image {
    position: relative;
    top: -20px;
}

    .list-view-no-items-image img {
        max-width: 250px;
        /*box-shadow: 0px 3px 6px 2px rgba(163, 157, 163, 0.5);*/
    }

        .list-view-no-items-image img.hide {
            display: none;
        }

    .list-view-no-items-image .svg-container svg {
        width: 250px;
        max-width: 250px;
        min-width: 250px;
    }

.list-view-no-items-label {
    font-size: 1.6rem;
   /* color: gray;*/
    /* font-weight: bold; */
    /*position: relative;
    top: -10px;*/
}

    .list-view-no-items-label a {
        text-decoration: underline;
        color: blue;
        cursor: pointer;
    }

.list-view-no-items-options {
    display: none;
    position: relative;
    right: -100px;
    top: 12px;
    color: goldenrod;
    z-index: 5;
    font-size: 2.6rem;
}

.list-view-no-items.is-missing .list-view-no-items-options {
    display: block;
}

.list-view-items {
    display: none;
    flex: 1;
}

.list-view-hilite {
    position: absolute;
    z-index: 1;
    background-color: rgba(154, 181, 213, .5);
    border: 1px solid #94ADCB;
}

.item-details .list-view-items {
    display: flex;
    flex: 1;
    position: relative;
}

#playerControls.audio .player-data-info {
    display: none;
}

.no-items .list-view-items {
    display: none;
}

/*.loading-items .list-view-items {
    display:none;
}*/

.list-view-columns {
    display: none;
}

.item-details .list-view-details {
    overflow: auto;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.item-details .list-view-columns {
    display: flex;
    position: sticky;
    top: 0;
    z-index: 2;
}

.no-items .list-view-details {
    display: none !important;
}

.no-items .list-view-columns {
    display: none;
}

/*.loading-items .list-view-columns {
    display:none;
}*/

.list-view-column {
}

    .list-view-column.last {
        flex: 1;
    }

    .list-view-column.hidden {
        display: none;
    }

.list-view-column-menu {
    overflow: auto;
}

.list-view-column-item {
    border-right: solid 1px lightgray;
    border-bottom: solid 1px lightgray;
    padding: 3px;
    padding-left: 5px;
    padding-right: 5px;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1) 0%, rgba(246, 246, 246, 1) 47%, rgba(237, 237, 237, 1) 100%);
    white-space: nowrap;
    display: flex;
}

    .list-view-column-item.sortable:hover {
        background: linear-gradient(to bottom, rgba(237, 237, 237, 1) 100%, rgba(246, 246, 246, 1) 47%, rgba(255, 255, 255, 1) 0%);
    }

    .list-view-column-item.sortable:active {
        background: linear-gradient(to bottom, rgba(254, 254, 254, 1) 0%, rgba(209, 209, 209, 1) 49%, rgba(226, 226, 226, 1) 100%);
    }

/*.list-view-column.resize
    {
        cursor: ew-resize !important;
    }*/

.first .list-view-column-item {
    padding-right: 0;
}

.last .list-view-column-item {
    border-right: none;
}

.list-view-column-item-sort {
    padding-left: 7px;
    padding-right: 3px;
    position: relative;
    top: 3px;
    font-size: .6rem !important;
    display: none !important;
}

.list-view-column.sort-up .list-view-column-item-sort {
    display: inline-block !important;
    top: 5px;
}

.list-view-column.sort-down .list-view-column-item-sort {
    display: inline-block !important;
    top: 1px;
}

.list-view-column-items {
    display: flex;
    flex-direction: column;
}

.list-view-no-items-link {
    text-decoration: underline;
    color: blue;
}

.list-view-item {
    padding: 2px;
    /*max-height:22px;
    height:22px;*/
    overflow: hidden;
    border-bottom: solid 1px lightgray;
}

    .list-view-item.select {
        /*background-color: #e0eff9;*/
        color: #fff;
        background-color: #0069D9;
    }

.list-view-item-last {
    flex: 1;
}

.list-view-column-item-name {
    padding: 1px;
    padding-top: 3px;
    font-size: .7em;
    flex: 1;
}

.list-view-item-name {
    font-size: .7em;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    /*padding-top: 2px;*/
    display: flex;
    align-items: center;
    position: relative;
}

    .list-view-item-name.artwork {
        justify-content: center;
    }

    .list-view-item-name img {
        max-width: 60px;
        /*margin: 1rem;
    margin-top: .5rem;*/
        box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
        border-style: none;
        backface-visibility: hidden;
        vertical-align: middle;
        border: solid 1px lightgray;
    }

    .list-view-item-name img {
        box-shadow: none !important;
        border-color: transparent !important;
    }

    .list-view-item-name span {
        padding: 3px;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

.list-view-item.right .list-view-item-name {
    flex-direction: row-reverse;
}

.show-wizard i {
    font-size: 1.4rem;
    padding-bottom: 5px;
}

#views .view.library section.library .subsection .loading-container {
    display: none;
    align-items: center;
    flex: 1;
    cursor: default;
    font-size: .9rem;
    padding: 5px 10px;
    padding-left: 23px;
    padding-top: 10px;
    padding-bottom: 10px;
    color: white;
}

#views .view.library section.library .subsection.media-item-type .loading-container {
    padding-left: 36px;
}

#views .view.library section.library .subsection.playlists .loading-container {
    padding-left: 36px;
}

#views .view.library section.library .subsection .loading-container.show {
    display: flex;
}

.loading-container .loading-image {
    margin-right: .2rem;
}


/* Loading indicator */

.loader, .loading-spinner {
    /*border: 1px solid darkgray;*/
    /* Light grey */
    border-top: 1px solid #0079CB;
    /* Blue */
    border-radius: 100%;
    width: 16px;
    height: 16px;
    min-width: 16px;
    min-height: 16px;
    max-width: 16px;
    max-height: 16px;
    animation: spin 1s linear infinite;
}
.loading-container.xl .loading-spinner {    
    width: 32px;
    height: 32px;
    min-width: 32px;
    min-height: 32px;
    max-width: 32px;
    max-height: 32px;
}
.loading-container .loading-label {
    margin-left:.25rem;
}
.loading-container.xl .loading-label {
    font-size: 2rem;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

.listViewLoadingTime {
    display: flex;
    font-size: 8px;
    position: relative;
    top: 14px;
    margin-left: 1px;
   /* color: gray;*/
    letter-spacing: 1px;
}

.listViewLoadingProgress {
    display: flex;
    width: 180px;
    position: relative;
    /*left: -15px;*/
    /* top: -1px; */
}

.progress-bar-ex, .listViewLoadingProgressBar
{
    height: -webkit-fill-available;
    width: 100%;
    border-radius:100px;
}

.progress-bar-ex-incomplete, .listViewLoadingProgressBarIncomplete
{
    height: -webkit-fill-available;
}

.progress-bar-ex-complete, .listViewLoadingProgressBarComplete {
    background-color: #0d6efd;
    /*background-color: #1A86CF;*/
    height: -webkit-fill-available;
    width: 0%;
    /*opacity: .4;*/
    transition: .3s;
}

.progress-bar-ex .value
,.listViewLoadingProgressBarValue {
    display: none;
}

.view.list .loading-items-container .progress {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    /* margin-right: 10px; */
    /* width: 300px; */
    /* min-width: 30%; */
    flex: 1;
    width: 100%;
}

.progress-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}

.progress-bar-ex-container {
    height: 4px;
    width: 100%;
    border: solid 1px rgba(100,100,100,.3);
    border-radius: 5px;
}

.progress-bar-ex-container .progress-bar-ex {
    height: 4px !important;
    background-color: rgba(100,100,100,.3);
    border-radius: 5px;
}
.progress-bar-ex-container .progress-bar-ex-complete {
    background-color: #0d6efd !important;
}
.progress-bar-ex-container .progress .description {
    padding-top: 1px;
    font-size: .9rem;
    width: 30%;
    padding: 3px;
    opacity: 1;
}
.loading-items-container .progress-label {
    min-width: 250px;
}

.list-view-loading-footer {
}


.list-view-loading-footer-button 
{
    font-size: .7em;
    position: relative;
    left: 10px;
    top: 0px;
}


/* -- Known Skin Icons styling -- */

.check .shape-fill {
    fill: #000;
}

.group-lists .shape-fill.light {
    fill: #D4D4D4;
}

.group-lists .shape-fill.dark {
    fill: #676767;
}

.groups .shape-fill.light {
    fill: #D4D4D4;
}

.groups .shape-fill.dark {
    fill: #676767;
}

.groups .shape-fill.line.dark {
    fill: none;
    stroke: #676767;
}

.single-music-note .shape-fill {
    fill: #676767;
}

.film-strip .shape-fill.background {
    fill: #676767;
}

.film-strip .shape-fill.dot,
.film-strip .shape-fill.frame {
    fill: #E1E1E1;
}

.music-note .shape-fill {
    fill: #676767;
}

.playlist-folder .bottom {
    fill: #D1D1D1;
}

.playlist-folder .top {
    fill: #EFEFEF;
}

.playlist-folder .shape-outline {
    fill: #676767;
}

.svg-icon.playlist .shape-fill {
    fill: #676767;
}

.tv .screen {
    fill: #E1E1E1;
}

.tv .border,
.tv .stand {
    fill: #676767;
}

.smart-playlist .shape-fill {
    fill: #676767;
}

.clock .shape-fill {
    fill: none;
    stroke: #616161;
}

.custom-library .shape-fill.light {
    fill: #D4D4D4;
}

.custom-library .shape-fill.dark {
    fill: #676767;
}

.custom-library .shape-fill.line.dark {
    fill: none;
    stroke: #676767;
}

.user .shape-fill {
    fill: #676767;
}

/*.library .subsection .item.select .music-note .shape-fill,
.library .subsection .item.select>button .playlist .shape-fill,
.library .subsection .item.select>button .smart-playlist .shape-fill {
    fill: #fff;
}
*/
.library .subsection .item .film-strip,
.svg-container .film-strip {
    width: 16px;
    height: 17px;
    max-height: initial;
    max-width: initial;
}
/*
.library .subsection .item.select .film-strip .shape-fill.background {
    fill: #fff;
}

.library .subsection .item.select .film-strip .shape-fill.dot,
.library .subsection .item.select .film-strip .shape-fill.frame {
    fill: #0069D9;
}*/

.library .subsection .item .tv,
.svg-container .tv {
    width: 18px;
    height: 13px;
    max-height: initial;
    max-width: initial;
}

/*.library .subsection .item.select .tv .screen {
    fill: #519FFC;
}

.library .subsection .item.select .tv .border,
.library .subsection .item.select .tv .stand {
    fill: #fff;
}

.library .subsection .item.select .playlist-folder .bottom {
    fill: none;
}

.library .subsection .item.select .playlist-folder .top {
    fill: none;
}

.library .subsection .item.select .playlist-folder .shape-outline {
    fill: #fff;
}

.library .subsection .item.select .custom-library .dark {
    fill: #fff;
}

.library .subsection .item.select .custom-library .line {
    stroke: #fff;
}

.library .subsection .item.select .custom-library .light {
    fill: #519FFC;
}

.library .subsection .item.select .clock .shape-fill {
    stroke: #fff;
    fill: #519FFC;
}
*/

/* -- End known Skin Icons styling -- */

.list-view-group-list-item-year-container {
    display: flex;
}

.list-view-group-list-item-year {}

.list-view-group-list-item-duration {}

.list-view-group-list-item-rating-container {
    display: flex;
}

.list-view-group-list-item-rating {}

.list-view-group-list-item-rating-count {}

.list-view-group-list-item-cast {
    display: flex;
}

.list-view-group-list-item-cast-label {}

.list-view-group-list-item-cast-info {}

.list-view-group-list-item-director {
    display: flex;
}

.list-view-group-list-item-director-label {}

.list-view-group-list-item-director-info {}

.list-view-group-list-item-writer {
    display: flex;
}

.list-view-group-list-item-writer-label {}

.list-view-group-list-item-writer-info {}

.list-view-group-list-item-composer {
    display: flex;
}

.list-view-group-list-item-composer-label {}

.list-view-group-list-item-composer-info {}

/* scroll list styles */

.scroll-list .scroll-item > div
{
    display:none;
} 

/* groups */
.groups .scroll-list .scroll-item.visible > .list-view-group-item
{
    display:flex;
} 

/* group-lists */
.group-lists .scroll-list .scroll-item.visible > div
{
    display:flex;
}

.list-view-header-search-options button.list-view-header-search-details {
    font-size: 1.4rem;
    /* color: #0069D9;*/
    color: white;
    margin: .5rem;
    /*opacity: 1 !important;*/
    top: 12px;
}
/*#views .view.library section.library .subsection .items .item.no-items > button .icon-container {
    margin-left:2px;
}*/
#views .view.library section.library .subsection .items .item.no-items .expand {
    display:none;
}
#views .view.library section.library .subsection .items .item .expander {
    min-width: 8px !important;
    max-width: 8px !important;
    display: none;
}
#views .view.library section.library .subsection .items .item.no-items .expander {
    display: block;
}
#views .view.library section.library .subsection .items .item.no-items .expand {
    /*min-width: 6px !important;
    max-width: 6px !important;*/
}
#views .view.library section.library .subsection .items .item.no-items .expand > i {
    display:none;
}

.list-view-container.clients .list-view-footer
{
    display:none;
}

#miniplayer-window 
{
    display:none;
}

.list-view-group-item-name {
    position: absolute;
    /* transform: translate(50%, 50%); */
    /* left: 0; */
    /* top: 0; */
    /* right: 0; */
    /* bottom: 0; */
    display: flex;
    justify-content: center;
    align-items: center;
    color: white;
    font-size: 2rem;
    max-width: 260px;
    height: 100%;
    overflow: hidden;
    white-space: normal;
}
.list-view-group-item-options {
    display: none;
    align-items: center;
    flex: 1;
    width: 100%;
    justify-content: space-around;
    height: 36px;
    min-height: 36px;
    padding-bottom: 0.5rem;
    padding-top: 0.2rem;
}
.list-view-group.upload-file .list-view-group-item-options {
    display: flex;
}
.list-view-group.device-file .list-view-group-item-options {
    display: flex;
}
.list-view-group.device-folder .list-view-group-item-options {
    display: flex;
}
.list-view-group.device .list-view-group-item-options {
    display: flex;
}
.list-view-group-item-options-right {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 150%;
}
.list-view-group-item-options-right > button {
    margin-left: .4rem;
    margin-right: .4rem;
}
.list-view-group-item-options-left {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:150%;
}
.list-view-group-item-options-left > button {
    margin-left: .4rem;
    margin-right: .4rem;
}
    /*.list-view-group.Url .list-view-group-item-options {
    display:none;
}*/
.list-view-group-item-options .is-missing {
    color: goldenrod;
    font-size: .9rem;
    margin-left: 0.3rem;
    margin-right: 0.3rem;
}
.list-view-group-item-options .in-cloud {
    color:#0D7AFF;
    /*display:none;*/
}
.list-view-group-item-options .in-cloud i {  
    font-size: 18px;
    position: relative;
    top: 2px;
    margin-right: 2px;
}
.list-view-group-item-options .processing {
    color: lightgray;
    font-size: 75%;
    margin-left: 0.3rem;
    margin-right: 0.3rem;
}
.list-view-group.in-cloud .list-view-group-item-options .in-cloud {
    display: none;
}
.list-view-group-item-options .in-cloud.ok {
    color:green;
}
.list-view-group-item-options .in-cloud.error {
    color:red;
}
.list-view-group-item-options .has-highdef {
    color: white;
    margin-left: .3rem;
    margin-right: .3rem;
}
.list-view-group-item-options .has-highdef i {
    font-size: 22px;
    position: relative;
    top: 3px;
}
.list-view-group-item-options .has-standarddef {
    color: white;
    margin-left: .3rem;
    margin-right: .3rem;
}
.list-view-group-item-options .has-standarddef i {
    font-size: 22px;
    position: relative;
    top: 3px;
}
.list-view-group-item-options .has-subtitles {
    color: white;
    margin-left: .1rem !important;
    margin-right: .1rem !important;
}
.list-view-group-item-options .has-subtitles i {
    font-size: 25px;
    position: relative;
    top: 2px;
}
.list-view-group-item-options .encrypted {
    color: goldenrod;
    color: #FFAB15;
    margin-left: .3rem;
    margin-right: .3rem;
}
.list-view-group-item-options .encrypted i {
    position: relative;
    top: 2px;
    font-size: 19px;
}
.list-view-group-item-options .has-preview {
    margin-left: .3rem;
    margin-right: .3rem;
    color: red;
}
.list-view-group-item-options-left .loader-container {
    padding-top: 4px;
    padding-left: 3px;
}
.list-view-group-item-options .needs-approval {
    margin-left: .3rem !important;
    margin-right: .3rem !important;
}
.list-view-group-item-options .needs-approval i {
    position: relative;
    top: 2px;
    font-size: 19px;
    color: #FFAB15 !important;
}

.option-checkboxes {
    display: flex;
    padding-left: 1rem;
    padding-bottom: 1rem;
}
.option-checkbox-column.column1 {
    padding-right: 4rem;
}
.app-form-view-message {
    font-size: 1.6rem;
    justify-content: center;
    display: flex;
    padding: 1rem;
    padding-bottom: 0;
}
.app-form-header .app-form-image-container > button {
    opacity:1 !important;
}
.app-form-header .app-button-fade {
    opacity: 1 !important;
}
.app-tab-view > .container {
    display: flex;
    flex-direction: column;
    margin-left: auto;
    margin-right: auto;
}
.app-tab-view > .container .media-data {
    padding-bottom: 1rem;
    display: flex;
}
.app-tab-view > .container .file-data {
    padding-bottom: 1rem;
    display: flex;
}
.app-tab-view.summary > .container .column .app-label {
    text-align: right !important;
    min-width: 205px;
}
.app-form-field-description {
    flex-wrap: nowrap;
}
.field-group.error .content .value {
    color: red !important;
}
.field-group.connected .content .value {
    color:green !important;
}
.field-group.not-connected .content .value {
    color: red !important;
}

.app-tab-view.summary > .container .column .app-label {
    color: lightgray !important;
}
.app-tab-view.summary .app-form-field-description .app-span {
    color: white !important;
    max-width: 350px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.list-view-container.reports .list-view-header input[type=text] {
    width: 100px;
}

.list-view-report {
    display: flex;
    flex-direction: column;
    flex: 1;
   /* margin: 1rem;*/
   height:100%;
}
.list-view-report-header {
    margin-bottom: 1.5rem;
    display: none;
}
.list-view-report-info {
    margin: .2rem;
    display: flex;
    font-size: 90%;
    /* font-weight: bold;*/
    margin-top: 1rem;
    margin-bottom: .5rem;
    font-size: 90%;
}
.list-view-report-date {
    margin-bottom: 0rem;
    display:flex;
}
.list-view-report-date-title {
    margin-right:.5rem;
}
.list-view-report-dates {
    display: flex;
}
.list-view-report-dates-seperator {
    flex:1;
}
.list-view-report-dates-export {
    color: #0d6efd;
    padding-right: 1rem;
}
.list-view-report-dates-title {
    display:none;
}
.list-view-report-dates-from {
    display: flex;
    margin-left: 2rem;
}
.list-view-report-dates-from-title {
    margin-right: .5rem;
}
.list-view-report-dates-to {
    display: flex;
    margin-left: 2rem;
}
.list-view-report-dates-to-title {
    margin-right: .5rem;
}
.list-view-report-dates-count {
    display: flex;
    margin-left: 2rem;
}
.list-view-report-dates-count-title {
    margin-right: .5rem;
}
.list-view-report-body {
    /*padding-right: 1rem;*/
   /* position: absolute;*/
    left: 10px;
    bottom: 10px;
    right: 10px;
    top: 40px;
    height:100%;
}
.list-view-report-body img {
    max-height: 50px;
    max-width: 50px;
    display: block;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0px 3px 6px 2px rgb(163 157 163 / 31%);
    box-shadow: 7px 7px 7px 0px rgba(0,0,0,.1);
}
.list-view-report-body img.default-artwork {
    box-shadow:none;
}
.list-view-report-body table {
    width: 100%;
   /* border-bottom: solid 1px lightgray;*/
}
.list-view-report-body tr {
  /*  border-left: solid 1px lightgray;
    border-right: solid 1px lightgray;
    background-color: whitesmoke;*/
    white-space:nowrap;
}
.list-view-report-body tr:nth-child(even) {
    background-color: rgba(100,100,100,.3);
}
.list-view-report-body tr.select {    
    background-color: #0069D9 !important;
    color: white !important;
}
    .list-view-report-body td {
        font-size: 80%;
        padding: .5rem 1rem;
        white-space: nowrap;
    }
    .list-view-report-body td.no-records {
        font-size: 100%;
        
    }
.list-view-report-body span {
    pointer-events:none;
}
.list-view-report-body thead {
    border: solid 1px #444;
    border-bottom: none;
}
.list-view-report-body thead tr {
    background-color: rgba(100,100,100,.3);    
    border: solid 1px rgba(100,100,100,.3);
    border-bottom: none;
}
.list-view-report-body thead td {
    padding: .5rem 1rem;
    /*font-size: 75%;*/
   /* font-weight: bold;*/
    text-transform: uppercase;
}
.list-view-report-body iframe {
    width: 100%;
    height: 100%;
    background-color:whitesmoke;
}
.list-view-container.reports .list-view-header-search-code {
    font-size: 1rem;
    /*position: absolute;*/
    bottom: 0px;
    right: 37px;
}
.list-view-container.reports .list-view-header-search-code i {
    font-size: .95rem;
}
.list-view-container.reports .list-view-header-search-columns {
  /*  position: absolute;*/
    bottom: 0px;
    right: 0px;
}
.list-view-container.reports .list-view-header-search-columns i {
    font-size: 1rem;
}
.list-view-container.reports .list-view-header-search-download {
/*    position: absolute;*/
    bottom: 0px;
    right: 75px;
}
.list-view-container.reports .list-view-header-search-download i {
    font-size: .95rem;
}
.list-view-container.reports .list-view-header-img {
    box-shadow:none !important;
}

.new-version-available {
    display: none;
}

.report-columns-window {
    flex-direction:column;
}
.report-columns-window.message-box .app-header {
    margin-bottom:0px !important;
}
.report-columns-window.show {
    display: flex !important;
}
.report-columns-container {
    flex: 1;
}
.report-columns-content {
    display: flex;
    /* height: 100%; */
    /* padding-left: 15px; */
    /* padding-right: 15px; */
  /*  position: absolute;*/
    right: 15px;
    left: 15px;
    bottom: 45px;
    top: 200px;
}
.report-columns-content-from-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    height: 69vh;
    overflow: auto;
}
.report-columns-content-from-header {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: rgba(100,100,100,.3);
    border: solid 1px rgba(100,100,100,.3);
    border-bottom: none;
}
.report-columns-content-from-header input {
    margin: 5px;
    margin-left: 5px;
    margin-top: 5px;
    cursor: pointer;
}
.report-columns-content-from-header .form-check .form-check-input {
    margin-left: 5px !important;
    margin-top: 5px !important;
}
.report-columns-content-from {
    /*background-color: white;*/
    flex: 1;
    display: flex;
    flex-direction: column;
    border: solid 1px rgba(100,100,100,.7);
    overflow: auto;
}
.report-columns-content-item {
    text-align: left;
    color: white !important;
    border-bottom: solid 1px rgba(100,100,100,.3) !important;
    opacity: .9 !important;
    padding: 5px 5px !important;
    font-size: .9rem;
    display: flex;
    align-items: center;
}
.report-columns-content-item:not(.canEdit):hover {
    background-color:rgba(100,100,100,.5) !important;
}
.report-columns-content-item:not(.canEdit).selected {
    background-color:rgba(100,100,100,.7) !important;
}
.report-columns-content-item input {
    margin-right:5px;
    cursor:pointer;
}
.report-columns-content .app-form-field.app-form-field-checkbox.form-check {
    padding-right: 0.5rem !important;
}
.report-columns-content-actions {
    display: flex;
    flex-direction: column;
    padding: 2px;
    padding-top: 8%;
}
.report-columns-content-actions button {
    margin: 0.5rem 1rem;
    font-size: 2rem;
}
.report-columns-content-to-container {
    flex: 1;
    display: flex;
    flex-direction: column;
    position: relative;
    height: 69vh;
}
.report-columns-content-to-header {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: rgba(100,100,100,.3);
    border: solid 1px rgba(100,100,100,.3);
    border-bottom: none;
}
.report-columns-content-to-header input {
    margin: 5px;
    margin-left: 5px;
    margin-top: 5px;
    cursor: pointer;
}
.report-columns-content-to-header .form-check .form-check-input {
    margin-left: 5px !important;
    margin-top: 5px !important;
}
.report-columns-content-to {
   /* background-color: white;*/
    flex: 1;
    display: flex;
    flex-direction: column;
    border: solid 1px rgba(100,100,100,.7);
    overflow: auto;
}
.report-columns-footer .form-buttons {
    padding: 8px 17px !important;
    margin-top: 3px !important;
    padding-bottom: 9px !important;
}
.window-gripper {
    position: absolute;
    right: 1px;
    bottom: 1px;
    transform: rotate( -90deg );
    /* padding-right: 3px; */
    opacity: .7;
    cursor:pointer !important;
}
.window-gripper-row {
    display:flex;
    cursor:inherit;
}
.window-gripper-row-item {
    background-color: gray;
    border: solid 1px gray;
    border-radius: 100%;
    margin: 1px;
    cursor: inherit;
}

.list-view-body.reports .list-view-groups {
    width: 100%;
    height: 100%;
}
.list-view-header-search-subfolders {
    padding-top:5px;
}
.app-form-table.reportFiles-table {
    flex: 1;
}

.tab-container {
    display: flex;
    flex: 1;
}
.tab-container .tab-button {
    display: flex;
    align-items:center;
    padding: 1rem 1.5rem;
    width: 100%;
    align-items: center;
    /*justify-content: flex-end;*/
    transition:.2s;
}
.tab-container .tab-button.selected {
    background-color: rgba(100,100,100,.3);
    color: #FFAB15;
    color: #0d6efd;
    color:white;
    opacity: 1 !important;
    
}
.tab-container .tab-page {
    flex:1;
}
.tab-container .tab-label {
    margin-left:.5rem;
}
.tab-container .tab-buttons {
    border-right: solid 1px rgba(100,100,100,.3);
    /* padding: 0.5rem;*/
    justify-content: initial;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    background: linear-gradient( +90deg, rgba(0,0,0,.3), transparent) !important;
}

.app-player-content-menu {
    padding: 0rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px rgba(100,100,100,.3) !important;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%) !important;
    border-radius: 5px;
    left: -195px;
    top: 54px;
    display: none;
    opacity: 0;
    transition: .1s;
    transition-property: opacity;
    cursor: default;
}
.app-player-content-menu.show {
    display: flex;
}
.app-player-content-menu.reveal {
    opacity: 1;
}
.app-player-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent  rgba(100,100,100,.3) transparent;
}

/*.app-form-buttons .app-button.sortType {
    padding-left:10px;
    padding-right:10px;
    position:relative;
    left:-5px;
    border-left:none;
}*/
/*.app-form-buttons .app-button.sortType .app-label {
    display:none;
}
*/
.app-form-buttons .app-button.sortType i {
    padding-right:0px;
}

.app-upload-content-menu {
    display: flex;
    padding: .5rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px lightgray;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    border-radius: 5px;
    left: -10px;
    /*left: -283px;
    top: -1px;*/
}

.app-upload-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 80px;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}

.app-upload-content-menu-section {
    /*padding-right: 1rem;
    padding-left: 0.5rem;
    width: 285px;*/
    white-space: nowrap;
}

.app-upload-content-menu-item-label {
    font-size: 1rem;
    border-bottom: solid 1px dimgray;
    padding-bottom: 0rem;
    margin-bottom: 0.5rem;
    font-weight: 700;
    padding: 5px 5px;
}
.app-upload-content-menu-items {
    display: flex;
    flex-direction: column;
    align-items: baseline;
}
.app-upload-content-menu-item-link {
    padding: 5px 10px;
    padding-right: 2rem;
    transition: .2s;
    text-align: left;
    border-radius: 5px;
    display: flex;
    align-items: center;
    color: gray;
    width: 100%;
}
.app-upload-content-menu-item-link:hover,
.app-upload-content-menu-item-link:focus {
    background-color:rgba(0,0,0,.1);
}
.app-upload-content-menu-item-link:active {
    background-color:rgba(0,0,0,.3);
    color:white;
}
.app-upload-content-menu-item-link i {
    padding-right:.5rem;
    width: 38px; 
    text-align: center;
}
.app-upload-content-menu-item-link span {
    flex:1;
    color:black;
}


.app-help-content-menu {
    display: flex;
    padding: 1rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px lightgray;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    border-radius: 5px;
    left: -283px;
    top: -1px;
}
.app-help-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 324px;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}

.app-menu-icons-bar ul {
    display: flex;
    align-items: center;
}

.app-help-content-menu-section {
    padding-right: 1rem;
    padding-left: 0.5rem;
    white-space: nowrap;
    width: 285px;
}

.app-help-content-menu-item-label {
    font-size: 1rem;
    border-bottom: solid 1px dimgray;
    padding-bottom: 0rem;
    margin-bottom: 0.5rem;
    font-weight: 700;
    padding: 5px 5px;
}
.app-help-content-menu-items {
    display: flex;
    flex-direction: column;
    align-items: baseline;
}
.app-help-content-menu-item-link {
    padding: 5px 5px;
    width: 100%;
    transition: .2s;
    text-align: left;
    border-radius: 5px;
}
.app-help-content-menu-item-link:hover,
.app-help-content-menu-item-link:focus {
    background-color:rgba(0,0,0,.1);
}
.app-help-content-menu-item-link:active {
    background-color:rgba(0,0,0,.3);
    color:white;
}

.app-project-header .up-next-queue {
    margin-right:1rem;
}
.app-project-header .up-next-queue .media-status-queue {    
    font-size: 1.4rem;
    padding: 1.1rem;
    position: relative;
    top: 4px;
}

.media-status-volume {
    color: white;
    margin: 0.5rem 0.9rem;
    font-size: 1.4rem;
    position: relative;
    top: 4px;
    width: 55px;
    text-align: center;
    left: 5px;
}
.media-status-volume-container {
    position:relative;
}
.app-volume-content-menu {
    padding: 0rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px rgba(100,100,100,.3);
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    border-radius: 5px;
    left: -57px;
    top: 54px;
    display: none;
    opacity: 1;
    transition: .1s;
    transition-property: opacity;
    cursor: default;
    width: 200px;
    z-index: 5;
    padding-left: 5px;
    padding-right: 10px;
}
.app-volume-content-menu.show {
    display: flex;
}
.app-volume-content-menu.reveal {
    opacity: 1;
}
.app-volume-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent  rgba(100,100,100,.3) transparent;
}
.app-volume-content-menu .volume-bar-container {    
    width: 100%;
    display: flex;
    align-items: center;
}
.app-volume-content-menu .volume-bar-container .mute-icon {
    padding: 5px;
    font-size: 1.2rem;
    padding-right: 0;
}



.media-status-sort-container {
    position:relative;
}
.app-sort-content-menu {
    padding: 0rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px rgba(100,100,100,.3);
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    /*border-radius: 5px;*/
    /* left: -74px;
    top: 54px;*/
    display: none;
    opacity: 1;
    transition: .1s;
    transition-property: opacity;
    cursor: default;
    z-index: 5;
    /*    width: 200px;
    padding-left: 5px;
    padding-right: 10px;*/
}
.app-sort-content-menu.show {
    display: flex;
}
.app-sort-content-menu.reveal {
    opacity: 1;
}
/*.app-sort-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}*/



#player-bar {
    display: flex;
    flex-direction: column;
    align-items: baseline;
    justify-content: space-between;
    max-width: 500px;
    /*height: 200px;*/
}
body.dark-mode #player-bar {
    background-color: #282828;
}
body.light-mode #player-bar {
    background-color: whitesmoke;
}

#player-bar .playback-info {
    display: flex;
    /* align-items: center;*/
    flex: .29;
    padding: 10px;
}

#player-bar .playback-info .media-art {
    max-width: 150px;
    max-height: 150px;
    margin-right: 15px;
}
    
#player-bar .playback-info .description
{
    white-space: nowrap;
    overflow:hidden;
    text-overflow: ellipsis;
    max-width:260px;
}
body.dark-mode #player-bar .playback-info .description {
    color: rgba(255,255,255, 1);
}

#player-bar .playback-info .supplemental-info {
    font-size: 1rem;
    opacity: .9;
}

#player-bar .playback-info .supplemental-info2
{
    overflow:hidden;
    text-overflow: ellipsis;
    font-size:.9rem;
    opacity:.9;
}

#player-bar .playback-info .supplemental-info3
{
    overflow:hidden;
    text-overflow: ellipsis;
    font-size:.9rem;
    opacity:.9;
}

#player-bar .playback-info .supplemental-info4 {
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: .9rem;
    opacity: .9;
}

#player-bar .player-controls {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    padding-bottom:.5rem;
}

#player-bar .player-controls .player-buttons
{
    display:flex;
    justify-content: center;
    padding:5px;
    padding-top: 10px;
}

#player-bar .player-controls .player-buttons button
{
    margin-left:20px;
    margin-right:20px;
}
body.dark-mode #player-bar .player-controls .player-buttons button {
    color: white;
}

#player-bar .player-controls .player-buttons .play-pause-toggle {
    align-items: center;
    justify-content: center;
    display: flex;
    font-size: 34px;
}
body.dark-mode #player-bar .player-controls .player-buttons .play-pause-toggle {
    color: white;
}


#player-bar .player-controls .player-buttons .play-pause-toggle .play > i {
    
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}
#player-bar .player-controls .player-buttons .play-pause-toggle .play > i > i {
    position: absolute;
    font-size: 13px;
    left: 1px;
    right: -2px;
    top: 11px;
    bottom: 0;
}
#player-bar .player-controls .player-buttons .play-pause-toggle .play > i i.pause {
    right: 1px;
    display:none;    
}
#player-bar .player-controls.playing .player-buttons .play-pause-toggle .play > i i.play {
    display: none;
}
#player-bar .player-controls.playing .player-buttons .play-pause-toggle .play > i i.pause {
    display: initial;
}


#player-bar #position 
{
    display: flex;
    max-height: 20px;
    margin: 0 auto;
    width: 100%;
    align-items: center;
    cursor: pointer;
    padding: 5px 10px;
}
#player-bar #position .completed 
{
    font-size:.7em;
    width:50px;
    padding-right:10px;
    text-align:right;
    flex: .1;
}
body.dark-mode #player-bar #position .completed {
    color: white;
}
#player-bar #position .uncompleted {
    font-size: .7em;
    width: 50px;
    padding-left: 10px;
    flex: .12;
}
body.dark-mode #player-bar #position .uncompleted {
    color: white;
}
#player-bar #position .level {
    display: flex;
    flex: 1;
    min-height: 1px;
    max-height: 15px;
    /* position: relative;
    top: -1px;*/
    cursor: pointer;
    align-items:center;
    position: relative;
    left: 5px;
}
#player-bar #position .level .on 
{ 
    display:flex;
    background-color: #b3b3b3;
    border-radius: 5px;
    height: 4px;
    width: 0%;
    z-index:1;
}
#player-bar #position:hover .level .on
{ 
    background-color: #1bd665;
}
#player-bar #position .level .selector {
    display: none;
    background: #999;
    min-width: 11px;
    min-height: 11px;
    max-width: 11px;
    max-height: 11px;
    position: relative;
    left: -5px;
    z-index: 5;
    border-radius: 50%;
    transition: .20s;
    position: relative;
    left: -5px;
}

body.dark-mode #player-bar #position .level .selector {
    background: white;
}
    
#player-bar #position:hover .level .selector
{ 
    display:flex;
}
#player-bar #position .level .selector:active 
{
    background: linear-gradient(#B1B1B1, #D9D9D9);
}
    
#player-bar #position .level .selector.select 
{
    background: linear-gradient(#B1B1B1, #D9D9D9);
}
    
#player-bar #position .level .off 
{ 
    display:flex;
    flex:1;
    height:4px;
    background-color: #404040;
    border-radius: 5px;
    position: relative;
    left: -5px;
}

#player-bar #misc-controls
{
    display: none;
    align-items: center;
    justify-content: space-between;
    width:100%;
    padding:10px;
}

#player-bar #misc-controls .closedCaptioning {    
    padding: 5px;
    margin-right: 20px;
}

#player-bar #misc-controls .fullscreen {    
    padding: 5px;
    margin-left: 10px;
}

#player-bar #misc-controls .pictureInPicture {    
    padding: 5px;
    margin-left: 10px;
    transform: rotateZ(90deg);
}


#player-bar #volume-bar-container {
    justify-content: flex-end;
    max-width: 200px;
    min-width: 100px;
}

#player-bar .volume-speaker 
{
    color: white;
}
#player-bar .volume-bar 
{
    display: flex;
    flex: 1;
    align-items: center;
    margin:0;
    padding:0;
}
#player-bar .volume-bar .track
{
    display:flex;
    height:2px;
    flex:1;
    cursor:pointer;
    padding: 5px;
}
    #player-bar .volume-bar .track .on {
        display: flex;
        background-color: #b3b3b3;
        height: 4px;
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        align-self: center;
        z-index: 1;
        /*position: relative;
    left:5px;*/
    }
#player-bar .volume-bar:hover .track .on 
{
    background-color: #1bd665;
}
    #player-bar .volume-bar .track .off {
        display: flex;
        background-color: #404040;
        height: 4px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        align-self: center;
        /*position: relative;
    left:-5px;*/
        flex: 1;
    }
#player-bar .volume-bar .track .thumb 
{
    display: none;
    width: 11px;
    height: 11px;
    min-width: 11px;
    min-height: 11px;
    border-radius: 10px;
    align-self: center;
    z-index: 5;
    /*position: relative;
    left: -5px;
    top: -1px;*/
    transition: ease-in-out;
    background-color: #999;
}
body.dark-mode #player-bar .volume-bar .track .thumb {
    background-color: white;
}
#player-bar .volume-bar:hover .track .thumb 
{
    display: flex;
}
#player-bar .volume-bar .track .thumb:active 
{
    background-color:gainsboro;
}
#player-bar .volume-bar .track .thumb.resize 
{
    background-color:gainsboro;
}

#player-bar .misc-controls .svg-icon
{
    width:16px;
    height:auto;
}

#player-bar .misc-controls .speech-subtitles
{
    margin-right:20px;
}

#player-bar .misc-controls .speech-subtitles .shape-fill
{
    fill:none;
}
#player-bar .misc-controls .speech-subtitles:hover .shape-fill
{
    stroke:#fff;
}

#player-bar .misc-controls .expanding-arrows:hover .shape-fill
{
    stroke:#fff;
}


.tab-page-container {
    padding-left: 0.5rem;
}
.tab-page-container #views .view.library section.library .subsection .items .item > button {    
    flex: 0;
}
.tab-page-container #views .view.library section.library .subsection > header {
    position:initial;
    padding: 0.7rem;
    padding-bottom:.2rem;
    color:white;
    text-align:left;
}
.tab-page-container #views .view section .subsection .items .item > button .icon-container {
    margin-left: 1.2rem;
}
.tab-pages {
    flex:1;
}
.tab-page-container {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.tab-page-container #views .view.library section.library .subsection .items .item > button {
    background-color:transparent !important;
}
.tab-page-container #views .view.library section.library .subsection .items .select.item > button {
    background-color:transparent !important;
}
.tab-page-container #views .view.library section.library .subsection .items .item > button:hover {
    background-color:transparent !important;
}
.form-window-header.app-form-fields {
    margin: 0;
    padding: 0;
    position: relative;
}
.form-window-header.app-form-fields .app-form-header {
    flex: 1;
    padding: 1rem;
    margin-bottom:0;
}
.form-window-header.app-form-fields > button {
    position: absolute;
    right: 0;
}
.tab-page-container > .content {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
}
.tab-page-container > .content > #views {
    
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    flex: 1;
}
.tab-page-container .option-checkboxes {
    padding-top: .5rem;
    padding-bottom: 0.5rem;
}
.tab-page-container .option-checkboxes .app-form-field.form-check {
    padding: 0.2rem 0 !important;
}
.tab-page-container .option-fields {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    padding-top: 0.3rem;
}
.sections-tabs-footer button {
    padding: 0.5rem;
    color: #0d6efd;
    /*  font-size: 80%;*/
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
}
.sections-tabs-footer > a {
    display: flex;
    white-space: nowrap;
    user-select: unset;
    flex:1;
}
.sections-tabs-footer button:focus,
.sections-tabs-footer button:active,
.sections-tabs-footer button:hover,
.sections-tabs-footer button.selected{
    color: white;
}
.sections-tabs-footer button label {
    margin-left:.5rem;
}
.app-view.client-fields .app-tab-view.settings {
    max-width: 100%;
    /* justify-content: center; */
    /* align-items: center; */
    margin-left: auto;
    margin-right: auto;
    width: 40%;
    min-width:200px;
}
.app-view.client-fields .app-tab-view.settings .app-button {
    width:min-content;
}
.column .app-label-span .image-container {
    min-width: 350px;
    flex: 1;
}
.column .app-label-span .image-container img {
    max-height:120px;
}
.summary_certificateInfo {
    align-items:baseline !important;
}
.app-tab-view.logs {
    height: 100%;
}
.console.logs-items {
    background-color: black;
    color: green;
    padding: 1rem;
    border-radius: 5px;
    overflow: auto;
    height: 100%;
    width: 100%;
    margin-top: 1rem;
}
.console.logs-items .log-item {
    padding: 0 .2rem;
    display: flex;
    font-size: 1.2rem;
    line-height: 1.6;
    white-space: nowrap;
}
.media-status-play-container {
    position:relative;
}
.media-status-play-container .media-status-play {
    padding-right: 1.5rem;
    padding-left: 1rem;
    font-size: 1.4rem;
    top: 4px;
    position: relative;
}

.client-search-container {
    display: flex;
    flex-direction: column;
    flex: 1;
    position: relative;
    padding: 0 1.5rem;
}

.client-search-message {
    padding-top: 1rem;
    font-size: 1.6rem;
    padding-bottom: 1rem;
}

.client-search-loader {
   /* position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    justify-content: center;
    align-items: center;
    display: flex;
    background-color: rgba(0,0,0,.6);
    z-index: 1;*/
}

.app-tab-view .app-table thead tr {
    text-align: left;
    font-size: 1.4rem;
    background-color: rgba(100,100,100,.3);
    white-space: nowrap;
}
.app-tab-view .app-table thead th {
    padding:.5rem 1rem;
}

.app-tab-view .app-table tbody tr {
    text-align: left;
    font-size: 1.2rem;
    border-bottom: solid 1px rgba(100,100,100,.3);
}

.app-tab-view .app-table tbody td {
    padding: .5rem 1rem;
    vertical-align: baseline;
}
.drivers-header-label {
    font-size: 1.6rem;
    padding-bottom: 0.2rem;
}
.installedFiles-header-label {
    font-size: 1.6rem;
    padding-bottom: 0.2rem;
    padding-top: 1rem;
}

#views .view.library section.library .subsection .items .item.no-items button > .icon-container {
    margin-left: 5px;
}

.app-view.media-fields .app-tab-view.summary > div,
.app-view.media-fields .app-tab-view.input .media-fields {
    margin-left: auto;
    margin-right: auto;
}
.app-view.media-fields .app-tab-view.input .event-fields {
    margin-left: auto;
    margin-right: auto;
    min-width: 60%;
}
.app-view.media-fields .app-tab-view.summary .column .app-label,
.app-view.media-fields .app-tab-view.input .column .app-label {
    text-align: right !important;
}
#metadata-section .app-view.summary .app-tabs {
    margin-bottom:1rem;
}
#metadata-section .app-view.summary .format-data {
    padding-bottom: 1.8rem;
}
#metadata-section .app-view.input .format-data {
    padding-bottom: 1rem;
}
.sections-tabs-footer {
    display: flex;
    justify-content: space-evenly;
}

#winform-menu-bar {
   /* background-color: whitesmoke;
    color: #1C1C22;*/
    padding: 0;
    padding-bottom: 0;
/*    border-right: solid 1px #d0d0d0;
    border-left: solid 1px #d0d0d0;
*/    padding: 3px;
   /* border-bottom: solid 1px #d0d0d0;*/ 
   /* border-color: rgba(0,0,0, .05);*/
}
#winform-menu-bar.hidden
{
    display:none;
}
#winform-menus
{
    padding:0;
    margin:0;
    font-size:.8rem;
    color:whitesmoke;
    list-style: none;
}

#winform-menus .winform-menu
{
    display:inline-block;
    padding:7px;
    cursor:default;
    position:relative;
    padding-top:3px;
    padding-bottom:3px;
}
#winform-menus .winform-menu:hover
{
    background-color:#858585;
    color:white;
}
#winform-menus .winform-menu:hover > .title
,#winform-menus .winform-menu.selected > .title
{
    color:#fff;
}
#winform-menus .winform-menu.selected
{
    background-color:#676767;
    color:white;
}
#winform-menus .winform-menu:last-of-type
{
    margin-right:0;
}
#winform-menus .winform-menu:first-of-type
{
    margin-left:0;
}











#control-panel {
    display: none;
    background: linear-gradient(to bottom, #e6e6e6 0, #d0d0d0 100%);
    /*  border-bottom: solid 1px #d0d0d0;*/
    display: flex;
    height: 50px;
    /*overflow: hidden;*/
    transition: .2s;
    /*  height: 45px;
    min-height: 45px;
    max-height: 45px;*/
}
/*.dms-on-demand:not(.bridge) #control-panel {
    display: none !important;
}*/
#control-panel.hide {
    height: 0px;
}
body.dark-mode #control-panel {
    color: #3f3f3f;
    color: white;
    background: #191919;
    background: #131313;
    background: #181818;
}

/*#app-container.fullscreen #control-panel {
    display: none !important;
}*/
/*body.playback #control-panel {
    display: none !important;
}
*/
#media-controls {
    /*padding:0 5px;*/
    display: flex;
    justify-content: space-between;
    flex: 7.3;
}

#media-controls.has-media {
    flex: 6.5;
}

#media-controls .alignment-container {
    display: flex;
    padding-left: 5px;
}
#media-controls .alignment-container .logo {
    display: flex;
    align-items: center;
    justify-content: center;
}
#media-controls .alignment-container .logo img {
    max-height: 27px;
    padding-left: 12px;
}



#control-buttons {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 91px;
    padding-bottom: 2px;
    margin-left: -0.3rem;
}

#control-buttons .control-button {
    display: inline-block;
    vertical-align: middle;
    cursor:pointer;
}

    #control-buttons .control-button .shape-fill {
        fill: #fff;
        stroke: #fff;
    }

#control-buttons .control-button.play-pause-toggle > div.hide { 
    display:none;
}


#control-buttons .skip-back .svg-icon {
    width: 20px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
}

#control-buttons .skip-back.enabled .shape-fill {
    fill: #fff;
    stroke: #fff;
}
body.dark-mode #control-buttons .skip-back.enabled .shape-fill {
    fill: whitesmoke;
    stroke: whitesmoke;
}
#control-buttons .skip-back.enabled:active .shape-fill {
    fill: #616161;
    stroke: #616161;
}

#control-buttons .play-pause-toggle .play,
#control-buttons .play-pause-toggle .pause {
    display: none;
}

#control-buttons .play-pause-toggle .play.show,
#control-buttons .play-pause-toggle .pause.show {
    display: block;
}

#control-buttons .play-pause-toggle .svg-icon {
    width: 19px;
    height: 22px;
}

#control-buttons .play-pause-toggle.enabled .shape-fill {
    fill: #fff;
    stroke: #fff;
}
body.dark-mode #control-buttons .play-pause-toggle.enabled .shape-fill {
    fill: whitesmoke;
    stroke: whitesmoke;
}

#control-buttons .play-pause-toggle.enabled:active .shape-fill {
    fill: #fff;
    stroke: #fff;
}

#control-buttons .play-pause-toggle .play {
    margin-left: 3px;
    margin-top: 1px;
}

#control-buttons .play-pause-toggle .pause {
    margin-top: 2px;
}

#control-buttons .skip-forward .svg-icon {
    width: 20px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
}

#control-buttons .skip-forward.enabled .shape-fill {
    fill: #2c2c2c;
    stroke: #2c2c2c;
}
body.dark-mode #control-buttons .skip-forward.enabled .shape-fill {
    fill: whitesmoke;
    stroke: whitesmoke;
}
#control-buttons .skip-forward.enabled:active .shape-fill {
    fill: #616161;
    stroke: #616161;
}

#speaker-controls {
    padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    margin: 0;
}


@media only screen and (max-width: 1200px) {

    #speaker-controls {
        margin: 0 20px;
    }

}

#media-status-bar {
    flex: 10;
    background: linear-gradient(to bottom, #f1f1f1 0, #e6e6e6 100%);
    /*border:solid 1px #cecece;*/
    border-top: none;
    border-bottom: none;
    display: flex;
    justify-content: space-between;
    cursor: default;
}
body.dark-mode #media-status-bar {
    background: none;
}

#media-status-bar .svg-icon .shape-fill {
    fill: #646464;
}

#media-status-bar.media .media-art {
    width: auto;
    /*height: 45px;*/
    /*max-width: 45px;*/
    height:100%
}


@media only screen and (max-width: 800px) {

    #media-status-bar .media-art {
        display: none;
    }
}

.icon-checkbox.love {
    position: relative;
    top: -2px;
}
#media-status-bar.no-media .media-art {
    display: none;
}

#media-status-bar.media .artrela-logo {
    display: none;
}

.library-group-details .name .playback-info {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

#media-status-bar .playback-info {
    flex: 1;
    display: flex;
    flex-direction: column;
    position:relative;
}

#media-status-bar .playback-info .main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    flex: 1;
    margin-bottom: 0px;    
    min-height: 42px;
    max-height: 42px;
    overflow:hidden;
}

#media-status-bar .playback-info .left {
    margin-left: 5px;
    min-width: 35px;
    align-self: flex-start;
    padding-top: 2px;
}

#media-status-bar .playback-info .left .icons {
    display: flex;
    align-items:center;
    margin-bottom: 3px;
}
/*#control-panel.url #media-status-bar .playback-info .left .icons {
    display:none;
}*/
/*#control-panel.url #media-status-bar .playback-info .left .playback-time {
    display: none;
}*/

    #media-status-bar .playback-info .left .minimize
    {
        display:none;
        height: 15px;
        width: auto;
        margin-right: 7px;
        transform: scale(.8);
    }
#media-status-bar .playback-info .left .minimize:hover .shape-fill {
    fill: #1d8cf8;
}

    #media-status-bar .playback-info .left .shuffle {
        height: 9px;
        width: auto;
        transform: scale(.95);
        cursor:pointer;
    }
#media-status-bar .playback-info .left .shuffle:hover .shape-fill
,#media-status-bar .playback-info .left .shuffle.selected .shape-fill
{ 
    fill: #1d8cf8;
}


#media-status-bar.no-media .playback-info .left .playback-time {
    display: none;
}

#media-status-bar.no-media .playback-info .description {
    display: none;
}

#media-status-bar .playback-info .description {
    margin-top: 5px;
    margin-left: 10px;
    margin-right: 7px;
    flex: 1;
}
#media-status-bar .playback-info .description > .title {
    font-size:12px;
    text-align: center;
   /* color: #3f3f3f;*/
    margin-top: 2px;
    margin-bottom: 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#media-status-bar .playback-info .description .supplemental-info {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: center;
    margin-bottom: 2px;
    margin-top:2px;
}

#media-status-bar.buffering .playback-info .description .supplemental-info {
    display:none;
}

@media only screen and (max-width: 700px) {
    #media-status-bar .playback-info .description .supplemental-info {
        display: none;
    }
}

#media-status-bar .playback-info .description .supplemental-info2 {
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: center;
}

#media-status-bar.buffering .playback-info .description .supplemental-info2 {
    display: none;
}

@media only screen and (max-width: 700px) {
    #media-status-bar .playback-info .description .supplemental-info2 {
        display: none;
    }
}

#media-status-bar .playback-info .description .field-group.buffer-progress 
{
    display:none;
    flex-direction: row;
}
#media-status-bar.buffering .playback-info .description .field-group.buffer-progress 
{
    display:flex;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .title
{
    margin-right:5px;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content {
    display:flex;
    flex-direction: row;
    align-items: center;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content progress {
    -webkit-appearance: none;
    height: 5px;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content .display {
    margin-right:10px;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content progress::-webkit-progress-bar {
    background-color: #ccc;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content progress::-webkit-progress-value {
    background-color: #1d8cf8;
}

#media-status-bar .playback-info .right {
    /*min-width: 50px;*/
    /*margin-right: 5px;
    align-self: flex-start;
    padding-top: 4px;*/ 
    margin-right: 5px;
    min-width: 35px;
    align-self: flex-start;
}

#media-status-bar .playback-info .right .icons {
    /*display: flex;
    justify-content: flex-end;
    margin-bottom: 5px;*/
    /*padding-top: 2px;*/
}
#media-status-bar .playback-info .right .icons .love span {
    font-size: 17px;
    padding: 2px 5px;
    padding-left: 0;
    margin-right: 5px;
    cursor: pointer;
    position: relative;
    top: 3px;
}
body.light-mode #media-status-bar .playback-info .right .icons .love span {
    color: dimgray;
}
#media-status-bar .playback-info .right .icons .up-next-queue span {
    font-size: 23px;
    color: gray;
}
#media-status-bar .playback-info .right .icons .up-next-queue {    
    position: relative;
    top: -2px;
    padding-right: 5px;
}

   

#media-status-bar .playback-info .right .remaining-time {
    text-align: right;
    /* padding-right: 2px; */
    /* padding-top: 2px; */
    position: absolute;
    right: 10px;
    bottom: 9px;
}

#control-panel.no-time #media-status-bar .playback-info .right .remaining-time {
    display:none;
}

#media-status-bar.no-media .playback-info .right .remaining-time {
    display: none;
}

#app-container .winform-options-button {
display:none;
}
/* begin position-level */
#media-status-bar #position-level {
    display: flex;
    /* flex: 1; */
    /* min-height: 7px; */
    /* max-height: 7px; */
    /* align-items: center; */
    cursor: pointer;
    position: relative;
    /*top: 5px;*/
    padding-left: 0px;
    padding-right: 0;
    margin-left: -1px;
    margin-right: -1px;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    right: 0;
}
#media-status-bar #position-level .position-level-bkgd {
    
    position: absolute;
    left: 0;
    right: 0;
    top: -4px;
    bottom: -4px;
}
#media-status-bar .icons button.repeat-button .material-icons {
    font-size: 14px;
    padding: 5px 5px;
    padding-left: 0;
}
body.light-mode #media-status-bar .icons button.repeat-button .material-icons {
    color: dimgray;
}
#media-status-bar .icons button.repeat-button.selected .material-icons {
    background-color: #0d6efd;
}
#media-status-bar .icons button.shuffle-button .material-icons {
    font-size: 14px;
    padding: 5px 5px;
    /* padding-left: 0; */
}
body.light-mode #media-status-bar .icons button.shuffle-button .material-icons {
    color: dimgray;
}
.icons button.shuffle-button.selected .material-icons {
    background-color: #0d6efd;
}
/*
.playback-time {
    /* padding-left: 2px; */
    /* padding-top: 2px; */
/*position: absolute;
    bottom: 0;
    left: 7px;
    bottom: 5px;
}
*/

.no-media #media-status-bar #position-level {
    display: none;
}

#media-status-bar #position-level-on {
    display: flex;
    background-color: #FFAB15;
    position: relative;
    height: 2px;
    top: 0px;
    width: 1px;
   /* box-shadow: 1px 1px 15px 1px #ffab15;*/
}

#media-status-bar #position-level-selector {
    display: flex;
    background: #FFAB15;
    width: 0px;
    height: 0px;
    position: relative;
    top: 0px;
    z-index: 10;
    border: solid 1px #FFAB15;
    transition: .20s;
}

#media-status-bar #position-level-selector.hide {
    display: none;
}

/*#media-status-bar #position-level-selector:active {
    background: linear-gradient(#B1B1B1, #D9D9D9);
}

#media-status-bar #position-level-selector.select {
    background: linear-gradient(#B1B1B1, #D9D9D9);
}*/

#media-status-bar #position-level-off {
    display: flex;
    flex: 1;
    height: 2px;
    position: relative;
    top: 0px;
    background-color: transparent;
}


/* end position-level */


.list-view-status {
    text-align: left;
    flex: 1;
    font-size: .9rem;
    display:none;
}

.media-status-play {
    color: whitesmoke;
    margin: 0.5rem;
    font-size: 1.6rem;
    position: relative;
    top: 3px;
    margin-right: 0.6rem;
    margin-left: 1rem;
}

.app-menubar-item.project .app-menubar-item-label {
    max-width: 200px;
    text-overflow: ellipsis;
    overflow: hidden;
}

.media-status-play-container {
    position: relative;
}
.app-player-content-menu {
    padding: 0rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px #eef1f2 !important;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%) !important;
    border-radius: 5px;
    left: -196px;
    top: 54px;
    display: none;
    opacity: 0;
    transition: .1s;
    transition-property: opacity;
    cursor: default;
}
.app-player-content-menu.show {
    display: flex;
}
.app-player-content-menu.reveal {
    opacity: 1;
}
.app-player-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}

/*.app-form-buttons .app-button.sortType {
    padding-left:10px;
    padding-right:10px;
    position:relative;
    left:-5px;
    border-left:none;
}*/
/*.app-form-buttons .app-button.sortType .app-label {
    display:none;
}
*/
.app-form-buttons .app-button.sortType i {
    padding-right:0px;
}

.app-upload-content-menu {
    display: flex;
    padding: .5rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px lightgray;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    border-radius: 5px;
    left: -10px;
    /*left: -283px;
    top: -1px;*/
}

.app-upload-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 80px;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}

.app-upload-content-menu-section {
    /*padding-right: 1rem;
    padding-left: 0.5rem;
    width: 285px;*/
    white-space: nowrap;
}

.app-upload-content-menu-item-label {
    font-size: 1rem;
    border-bottom: solid 1px dimgray;
    padding-bottom: 0rem;
    margin-bottom: 0.5rem;
    font-weight: 700;
    padding: 5px 5px;
}
.app-upload-content-menu-items {
    display: flex;
    flex-direction: column;
    align-items: baseline;
}
.app-upload-content-menu-item-link {
    padding: 5px 10px;
    padding-right: 2rem;
    transition: .2s;
    text-align: left;
    border-radius: 5px;
    display: flex;
    align-items: center;
    color: gray;
    width: 100%;
}
.app-upload-content-menu-item-link:hover,
.app-upload-content-menu-item-link:focus {
    background-color:rgba(0,0,0,.1);
}
.app-upload-content-menu-item-link:active {
    background-color:rgba(0,0,0,.3);
    color:white;
}
.app-upload-content-menu-item-link i {
    padding-right:.5rem;
    width: 38px; 
    text-align: center;
}
.app-upload-content-menu-item-link span {
    flex:1;
    color:black;
}


.app-help-content-menu {
    display: flex;
    padding: 1rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px lightgray;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    border-radius: 5px;
    left: -283px;
    top: -1px;
}
.app-help-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 324px;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}

.app-menu-icons-bar ul {
    display: flex;
    align-items: center;
}

.app-help-content-menu-section {
    padding-right: 1rem;
    padding-left: 0.5rem;
    white-space: nowrap;
    width: 285px;
}

.app-help-content-menu-item-label {
    font-size: 1rem;
    border-bottom: solid 1px dimgray;
    padding-bottom: 0rem;
    margin-bottom: 0.5rem;
    font-weight: 700;
    padding: 5px 5px;
}
.app-help-content-menu-items {
    display: flex;
    flex-direction: column;
    align-items: baseline;
}
.app-help-content-menu-item-link {
    padding: 5px 5px;
    width: 100%;
    transition: .2s;
    text-align: left;
    border-radius: 5px;
}
.app-help-content-menu-item-link:hover,
.app-help-content-menu-item-link:focus {
    background-color:rgba(0,0,0,.1);
}
.app-help-content-menu-item-link:active {
    background-color:rgba(0,0,0,.3);
    color:white;
}


.media-status-volume {
    color: white;
    margin: 0.5rem;
    font-size: 1.6rem;
    position: relative;
    top: 3px;
    width: 55px;
    text-align: center;
    left: 5px;
}
.media-status-volume-container {
    position:relative;
}
.app-volume-content-menu {
    padding: 0rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px lightgray;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    border-radius: 5px;
    left: -63px;
    top: 54px;
    display: none;
    opacity: 1;
    transition: .1s;
    transition-property: opacity;
    cursor: default;
    width: 200px;
    z-index: 5;
    padding-left: 5px;
    padding-right: 10px;
}
.app-volume-content-menu.show {
    display: flex;
}
.app-volume-content-menu.reveal {
    opacity: 1;
}
.app-volume-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}
.app-volume-content-menu .volume-bar-container {    
    width: 100%;
    display: flex;
    align-items: center;
}
.app-volume-content-menu .volume-bar-container .mute-icon {
    padding: 5px;
    font-size: 1.2rem;
    padding-right: 0;
}



.media-status-sort-container {
    position:relative;
}
.app-sort-content-menu {
    padding: 0rem;
    align-items: baseline;
    line-height: 1.4;
    position: absolute;
    background-color: white;
    border: solid 1px lightgray;
    box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%);
    /*border-radius: 5px;*/
    /* left: -74px;
    top: 54px;*/
    display: none;
    opacity: 1;
    transition: .1s;
    transition-property: opacity;
    cursor: default;
    z-index: 5;
/*    width: 200px;
    padding-left: 5px;
    padding-right: 10px;*/
}
.app-sort-content-menu.show {
    display: flex;
}
.app-sort-content-menu.reveal {
    opacity: 1;
}
/*.app-sort-content-menu::before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
}*/


#miscellaneous-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    flex: 7.5;
}
#control-panel .app-user-content-button-icon {
    margin: 0;
    font-size: 2.2rem;
}

#winform-controls {
    margin-right: 0px !important;
    align-self: flex-start;
}

#account-menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 4px !important;
    margin-left: 20px !important;
    margin-right: 20px !important;
    cursor: pointer;
}

#account-menu .user {
    height: 15px;
    width: 15px;
    margin-right: 5px;
}

#account-menu .user .shape-fill.head{
    fill:none;
    stroke:#404040;
}
#account-menu:hover .user .shape-fill.head{
    stroke:#0D7AFF;
}
#account-menu:hover .user .shape-fill.body{
    fill:#0D7AFF;
}
#account-menu:active .user .shape-fill.head{
    stroke:#616161;
}
#account-menu:active .user .shape-fill.body{
    fill:#616161;
}
#account-menu.select .user .shape-fill.head{
    stroke:#0D7AFF !important;
}
#account-menu.select .user .shape-fill.body{
    fill:#0D7AFF !important;
}
#account-menu.logged-in .user .shape-fill.head{
    stroke:#0D7AFF !important;
}
#account-menu.logged-in .user .shape-fill.body {
    fill: #0D7AFF !important;
}

#account-menu .hidden .svg-icon {
    display: none;
}

#account-menu .hidden #account-menu .user {
    display: none;
}

#account-menu #userEmail {
    color: #404040;
    margin-right: 5px;
    font-size: 14px;
}

#account-menu .icon-chevron-down {
    width: 7px;
    height: 7px;
}

#account-menu .user .shape-fill,
#account-menu .icon-chevron-down .shape-fill {
    fill: #404040;
}

#search-menu {
    flex: 1;
    max-width: 350px;
    padding-right: 10px;
    position: relative;
}
@media only screen and (max-width: 550px) {
    #search-menu {
        display:none;
    }
}

@media only screen and (max-width: 1700px) {
    .app-search-content-button {
         border: none !important; 
        background-color: transparent !important;
        color:white !important;
        margin-right:0 !important;
        padding-right:0 !important;
    }
    .app-search-content-button .icons {
        font-size: 140%;
    }
    .app-search-content-button input {
        display:none;
    }
    .app-header-panel .up-next-queue {
        margin-right:1rem !important;
    }
}

@media only screen and (max-width: 1550px) {
    .app-menubar ul li.help {
        display:none;
    }
    .app-logo-link a {
        padding-right: 0 !important;
    }
}

@media only screen and (max-width: 1400px) {

    .app-breadcrumb-info {
        display: none;
    }
    .app-menubar ul li.analytics {
        display: none;
    }
}


@media only screen and (max-width: 1300px) {
    .app-menubar ul li.content {
        display: none;
    }
}
@media only screen and (max-width: 1200px) {
}

@media only screen and (max-width: 1150px) {
    .app-menubar ul li.upload {
        display: none;
    }
}
@media only screen and (max-width: 950px) {
    .media-status-volume-container {
        display: none;
    }
}
@media only screen and (max-width: 850px) {
    .media-status-play-container {
        display: none;
    }
}
@media only screen and (max-width: 820px) {
    .up-next-queue {
        display: none;
    }
}
@media only screen and (max-width: 750px) {
    .app-search-content-button {
        display: none !important;
    }
}







#search-menu.hidden {
    display: none;
}

#search-menu .search-box {
    background-color: #fff;
    border: solid 1px silver;
    border-radius: 5px;
    min-height: 22px;
    display: flex;
    align-items: center;
    white-space: nowrap;
   /* z-index: 1000;
    position: relative;*/
}

body.dark-mode #search-menu .search-box {
    border-radius:15px;
}
#search-menu.showing-search .search-box {
    z-index: 50000;
    position: sticky;
}

#search-menu .search-box.focused {
    border: solid 5px #99c0e9;
    box-shadow: rgba(0, 0, 0, .2) 0 0 5px 1px inset;
}

#search-menu .icons {
    margin: 0 5px;
    margin-top: 2px;
    cursor:pointer;
}

#search-menu .icon-magnifying-glass {
    transform: scaleX(-1);
    width: 12px;
    height: 12px;
}

#search-menu .icon-chevron-down {
    width: 7px;
    height: 7px;
    margin-right: 3px;
    margin-bottom: 3px;
}

#search-menu .icon-magnifying-glass .shape-fill,
#search-menu .icon-chevron-down .shape-fill {
    fill: #757575;
}

#search-menu .search-box input[type="search"] {
    margin: 0;
    padding: 0;
    border: none;
    font-size: 13px;
    flex: 1;
    margin-right: 10px;
    margin-top: 0px;
    color: #484848;
    width: 100%;
    padding: .3rem;
}
 
#search-menu .search-box input[type="search"]:focus {
    outline: none;
}

#winform-controls {
    margin-left: 10px;
}

body.dark-mode #search-menu .search-box input[type="search"] {
    padding: .2rem;
    min-width: 220px;
}
.nav-area #search-menu .search-box input[type="search"] {
    padding: .2rem;
    min-width: 220px;
}





#up-next-queue-container {
    display: none;
    opacity: 1;
    background-color: #F5F5F5;
    color: #fff;
    text-align: center;
    margin: 5px 0;
    border-radius: 5px;
    position: absolute;
    z-index: 15001;
    top: 36px;
    left: 0px;
    border: solid 0px lightgray;
    /*border-left:none;
    border-right:none;*/
    box-shadow: 0px 3px 6px 2px rgba(163, 157, 163, 0.25);
    margin-bottom: 3px;
}
body.dark-mode #up-next-queue-container {
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
    box-shadow: 0 16px 38px -12px rgb(0 0 0 / 56%), 0 4px 25px 0 rgb(0 0 0 / 12%), 0 8px 10px -5px rgb(0 0 0 / 20%);
}
body.dark-mode #up-next-wrapper {
    color: white;
}
#up-next-queue-container .before {
    display: block;
    content: " ";
    position: absolute;
    bottom: 100%;
    /* At the top of the tooltip */
    left: 50%;
    right: unset;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #1C1C22 transparent;
    pointer-events: none;
}

.app-header-panel .up-next-queue {
    margin: 0px 1.5rem;
    margin-top: 3px;
}

.app-header-panel .up-next-queue .media-status-queue {
    color: white;
    font-size: 1.6rem;
    opacity: 1 !important;
}
/*.app-header-panel .up-next-queue .media-status-queue.has-items {
    color: #0d6efd;
}
*/
body.playback #up-next-queue-container::before {
    display: block;
    content: " ";
    position: absolute;
    top: 100%;
    left: unset;
    right: 56px;
    margin-left: 0px;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #F5F5F5 transparent;
    transform: rotate(180deg);
}
body.playback .video #up-next-queue-container::before {
    right: 130px;
}

.library #up-next-queue-container {
    top: 40px;
    right: 302px;
    left: unset;
    bottom: unset;
}
.playback #up-next-queue-container {
    top: unset;
    right: 20px;
    left: unset;
    bottom: 60px;
}

#up-next-queue-container.show {
    display: flex;
}



#up-next-wrapper {
    /*width:330px;*/
    flex: 1;
    /* background-color: #F5F5F5;*/
    /*border:solid 1px #c6c6c6;*/
    display: flex;
    flex-direction: column;
    font-size: 16px;
    border-top: none;
    border-radius: 5px;
    /*box-shadow: 7px 7px 7px 0px rgb(0 0 0 / 10%);*/
    background-color: #1C1C22;
}

/*.playback #up-next-wrapper {
    flex-direction: column-reverse;
}*/

#up-next-wrapper > header {
    padding: 5px;
    display: flex;
    padding-top: 0px;
}

#up-next-wrapper .tab-buttons
{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

#up-next-wrapper .tab-buttons .tab-button
{
    padding: 5px 10px;
    border-radius: 5px;
    margin-right: 5px;
    font-size: 12px;
  /*  font-weight: bold;*/
}

#up-next-wrapper .tab-buttons .tab-button:hover
{
    background-color: #d7d7d7;
}

#up-next-wrapper .tab-buttons .tab-button.selected
{
    background-color: #2687fb;
    color: #fff;
}

    #up-next-wrapper .tabs
    {
        display: flex;
        flex-direction: column;
        flex: 1;
    }
#up-next-wrapper .tabs .tab-page
{
    display: none;
}

#up-next-wrapper .tabs .tab-page.selected
{
    display: block;
}

    #up-next-wrapper .tabs .tab-page.show
    {
        display: flex;
        flex-direction: column;
        flex: 1;
    }

#up-next-wrapper .tab-page > header
{
    display: flex;
    /*align-items: center;*/
    justify-content: space-between;
    padding-bottom: 8px;
    margin: 0 15px 5px 15px;
    border-bottom: solid 1px #d9d9d9;
    border-bottom: solid 1px rgba(100,100,100,.3);
    margin-bottom:0;
    min-height:82px;
    margin-bottom: 5px;
    padding-bottom: 8px;
}
/*.playback #up-next-wrapper .tab-page > header {
    margin-top: 5px;
    border-bottom-color:transparent;
}*/
#up-next-wrapper .tab-page.cache > header {
    padding-top: 4px;
    padding-bottom: 1rem;

}

#up-next-wrapper .actions {
    display: flex;
    flex-direction: column;
}

#up-next-wrapper .actions .buffer
{
    width: 40px;
}

    #up-next-wrapper .actions button {
        font-size: .7rem;
        padding: 1px 10px;
        padding-top: 3px;
        padding-bottom: 3px;
        margin-top: 5px;
        justify-content: center;
    }

/*#up-next-wrapper .actions button:hover
{
    color: #0069D9;
    border-color: #0069D9;
}

#up-next-wrapper .actions button:active
{
    color: #fff;
    background-color: #0069D9;
}

#up-next-wrapper .actions button.select
{
    color: #fff;
    background-color: #0069D9;
    border-color: #0069D9;
}*/

    #up-next-wrapper .tab-page > section {
        overflow-y: auto;
        flex: 1;
        text-align: left;
        min-width: 25vw;
        /*max-width: 420px;
        max-height: 450px;
        min-height: 450px;*/
    }

    #up-next-wrapper .content-loading-container {
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 10px;
        font-style: italic;
    }
    #up-next-wrapper .content-loading-container label {
        padding-left:5px;
    }

    #up-next-wrapper .item-count
    {
        color: #9a9aa2;
        font-size: .8em;
        padding-bottom: .3rem;
    }


    #up-next-wrapper header .title
    {
        display: flex;
        flex-direction: column-reverse;
        justify-content:center;
    }

    #up-next-wrapper header .description {
        margin:0px !important;
    }

    #up-next-wrapper header .current-storage {
        /*margin-bottom: 5px;*/
        margin-top: 6px;
    }

    #up-next-wrapper header .available-storage {
        /*margin-bottom: 7px;*/
        margin-top: 10px;
    }

#up-next-wrapper section.main
{
    flex: 1;
    display: flex;
    flex-direction: column;
}
#up-next-wrapper .tab-page {
    display:none;
}
#up-next-wrapper .tab-page.show {
    display:block;
}
/*.playback #up-next-wrapper .tab-page {
    display: flex;
    flex-direction: column;
    flex-flow: column-reverse;
}*/

#up-next-wrapper .label {
    font-size: 1.6em;
    /* padding-top: 1px; */
    text-align: left;
    padding-left: 5px;
    /*padding-top: 2px;*/
}

#up-next-wrapper .media-no-items
{
}

#up-next-wrapper .media-no-items.hide
{
    display: none;
}

#up-next-wrapper .media-no-items .media-item
{
    justify-content: center;
    font-size: .75em;
}

    #up-next-wrapper .media-items
    {
        list-style: none;
        padding: 0;
        margin: 0;
        font-size: 14px;
        cursor: default;
        margin-top: .5rem;
    }

    #up-next-wrapper .queue-item {
        min-height: 80px;
        /*display: none;*/
    }

    #up-next-wrapper .media-items > li
    {
        margin-bottom: .5rem;
    }

    #up-next-wrapper .media-item
    {
        display: flex;
        flex-direction:column;
        align-items: baseline;
        padding: 5px;
        position: relative;
        border-top: solid 1px transparent;
        border-bottom: solid 1px transparent;
        padding-top: 7px;
        padding-bottom: 10px;
        padding-left:0px;
        width:100%;
        cursor:default !important;
    }

#up-next-wrapper .media-item.hide {
    display: none;
}

#up-next-wrapper .selected .media-item {
    color: #fff;
    background-color: #0069D9;
}

#up-next-wrapper .selected .media-item
{
    color: #fff;
    background-color: #0069D9;
}

#up-next-wrapper .media-item > .container {
    display: flex;
    align-items: center;

}
#up-next-wrapper .media-item .footer {
    display: flex;
    flex-direction:column;
    width: 100%;
    /*position: absolute;
    bottom: -2px;
    left: 92px;
    width: calc(100% - 113px);*/
    /*position: absolute;
    bottom: 6px;
    right: 6px;*/
    /*position: absolute;
    bottom: 8px;
    right: 0px;*/
}

#up-next-wrapper .media-item .library-item-details {   
   display:none;
   justify-content:flex-end;
}

#up-next-wrapper .media-item .library-item-details button {
    margin-left: 5px;
    margin-right: 5px;
    color: #444444;
}

#up-next-wrapper .media-item .playback-indicator
{
    width: 10px;
    padding-left: 3px;
    padding-right: 3px;
    display:none;
}

#up-next-wrapper .media-item .playback-indicator img
{
    display: none;
}

#up-next-wrapper .media-item.playing .playback-indicator img
{
    display: block;
}

#up-next-wrapper .media-item .artwork
{
    margin-right: .7rem;
    margin-left: 0rem;
    max-width: 90px;
    box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
    /*border: solid 1px #D3D3D3;*/
}
body.dark-mode #up-next-wrapper .media-item .artwork {
    box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
}

#up-next-wrapper .media-item.default-artwork .artwork {
    box-shadow: none !important;
}

#up-next-wrapper .media-item .artwork-list
{
    position: relative;
    z-index: 5;
    margin-right: .7rem;
    left:-2px;
    top:-2px;
}

#up-next-wrapper .media-item .artwork-list img
{
    max-width: 60px;
    /*box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);*/
    border: solid 1px #D3D3D3;
}

    #up-next-wrapper .media-item .artwork-list.single-image img
    {
        box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.31);
    }

#up-next-wrapper .media-item .artwork-list img.before
{
    left: 3px;
    top: 3px;
    z-index: -1;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #eee;
}

    #up-next-wrapper .media-item .artwork-list.double-image img.before
    {
        box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
    }

    #up-next-wrapper .media-item .artwork-list.single-image img.before
    {
        display: none;
    }

#up-next-wrapper .media-item .artwork-list img.after
{
    left: 6px;
    top: 6px;
    z-index: -2;
    box-shadow: 0 5px 8px 0 rgba(0,0,0,0.1),0 3px 10px 0 rgba(0,0,0,0.1) !important;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #eee;
}

#up-next-wrapper .media-item .artwork-list.double-image img.after
{
    display: none;
}

#up-next-wrapper .media-item .artwork-list.single-image img.after
{
    display:none;
}

#up-next-wrapper .media-item .media-info
{
    flex:1;
    text-align:left;
}

#up-next-wrapper .media-item .media-info span
{
    margin-right: 3px;
}

#up-next-wrapper .media-item .media-info span:last-child
{
    margin-right: 0;
}

    #up-next-wrapper .media-item .media-info .big {
        font-size: 1rem;
        white-space: nowrap;
        overflow-x: hidden;
        text-overflow: ellipsis;
        overflow: hidden;
        padding: 1px;
        max-width: 300px;
    }

    #up-next-wrapper .media-item .media-info .small {
        font-size: .8rem;
        /*color: dimgray;*/
        padding: 1px;
        padding-top: 3px;
        white-space: nowrap;
        overflow-x: hidden;
        text-overflow: ellipsis;
        overflow: hidden;
        max-width: 300px;
    }

#up-next-wrapper .media-item.selected .media-info .small {
    color: inherit;
}

#up-next-wrapper .media-item .media-info .big .time
{
    padding-left: 7px;
    font-size: .7em;
    color: dimgray;
    padding-top: 3px;
}

    #up-next-wrapper .media-item .media-info .name, .media-item .media-info .album-name {
         font-weight: bold;
        /*font-family: 'Nunito Medium', sans-serif;*/
    }

#up-next-wrapper .media-item .media-info > section
{
    color: #9a9aa2;
}

#up-next-wrapper .media-item.selected .media-info > section
{
    color: #fff;
}

#up-next-wrapper .media-item .remove-button
{
    position: absolute;
    left: 2px;
    top: 20px;
  /*  font-weight: bold;*/
    font-size: 1.1em;
    background-color: #d0d0d0;
    border-radius: 50%;
    width: 15px;
    height: 15px;
    cursor: pointer;
}

#up-next-wrapper .media-item.selected .remove-button
{
    background-color: #999;
}

#up-next-wrapper .media-item .remove-button .glyph
{
    position: absolute;
    left: 2.5px;
    top: -3px;
    -webkit-user-select: none;
    user-select: none;
}

#up-next-wrapper .media-item .default
{
    display: none;
}

#up-next-wrapper .no-items .media-item .default
{
    display: block;
}

#up-next-wrapper .media-item .context-menu-button
{
    position: absolute;
    right: 10px;
    top: 25px;
    font-size: 1.2em;
    width: 15px;
    height: 15px;
    color: #0069D9;
    display:none !important;
}

#up-next-wrapper .media-item.selected .context-menu-button
{
    color: #fff;
}

    #up-next-wrapper .media-item .context-menu-button .glyph
    {
        position: absolute;
        left: 1.5px;
        top: -6px;
        -webkit-user-select: none;
        user-select: none;
        display: none !important;
    }

#up-next-wrapper .media-item .hover-button
{
    display: none;
}

    #up-next-wrapper .media-item:hover .hover-button
    {
        display: none !important;
    }

    #up-next-wrapper .media-item .hover-button.selected
    {
        display: none !important;
    }

#up-next-wrapper .media-item:hover .hover-button:hover, .media-item:hover .hover-button.open
{
}

#up-next-wrapper .media-item.selected .hover-button:hover, .media-item.selected:hover .hover-button.open
{
    color: #fff;
}


#up-next-wrapper .media-item .cache-state {
    /*position: absolute;*/
    z-index: 5;
    /* display: flex; */
    /* flex: 1; */
    /*width: 200px;*/
    /*display: block;*/
    /*margin-right:10px;
    margin-left:85px;*/
    /*position: relative;
    top: 16px;*/
    padding-top:0px;
}

#up-next-wrapper .media-item.caching .cache-state {
    position: absolute;
    display:block;
    right: 10px;
    bottom: 11px;
}

#up-next-wrapper .media-item.temp-cached .cache-state {
    display:block;
}
#up-next-wrapper .media-item.perm-cached .cache-state {
    display:block;
}

#up-next-wrapper .media-item .footer-container {
    flex-direction: column;
    align-items: unset;
    margin-top: 10px;
    padding-left: 15px;
    padding-right: 10px;
}
#up-next-wrapper .media-item .cache-state .container {
    display: none;
    flex-direction: column;
    align-items: flex-end;
}
#up-next-wrapper .media-item.caching .cache-state .container {
    display: flex;
}
#up-next-wrapper .media-item .cache-state .container .message {
    font-size: 9px;
    /*color: black;*/
    padding-bottom: 2px;
    margin-right:2px;
}
#up-next-wrapper .selected .media-item .cache-state .container .message {
   /* color:lightgray;*/
    
}
#up-next-wrapper .media-item .cache-state .container .progress {
    height: 2px;
    width: 100%;
    border: solid 1px lightgray;
    display: flex;
}
#up-next-wrapper .media-item .cache-state .container .progress .percent {
    background-color: #0069D9;
}

/*#up-next-wrapper .media-item .cache-state .cached-container .cache-button {
    position: relative;
    top: -1px;
}*/
#up-next-wrapper .media-item .cache-state .cached-container .uncached {
    display: flex;
    font-size: 12px;
    color: gray;
    text-align: right;
    cursor: pointer;
}
#up-next-wrapper .media-item.temp-cached .cache-state .cached-container .uncached {
   display: none;
}
#up-next-wrapper .media-item.perm-cached .cache-state .cached-container .uncached {
   display: none;
}
#up-next-wrapper .media-item.caching .cache-state .cached-container .uncached {
   display: none;
}
#up-next-wrapper .media-item.pre-cache .cache-state .cached-container .uncached {
   display: none;
}
#up-next-wrapper .media-item.selected .cache-state .cached-container .uncached {
    color: #fff;
}


#up-next-wrapper .media-item .cache-state .cached-container .caching {
    display: none;
    font-size: 12px;
    color: #1d8cf8;
    text-align: right;
    cursor: pointer;
}
#up-next-wrapper .media-item.temp-cached .cache-state .cached-container .caching {
    color: #1d8cf8;
}
#up-next-wrapper .media-item.perm-cached .cache-state .cached-container .caching {
    color: green;
}
#up-next-wrapper .media-item.pre-cache .cache-state .cached-container .caching {
   display: flex;
}
#up-next-wrapper .media-item.selected .cache-state .cached-container .caching {
    color: #fff;
}


#up-next-wrapper .media-item .cache-state .cached-container{
    display:flex;
}

#up-next-wrapper .media-item .cache-state .cached-container .cached {
    display: none;
    font-size: 12px;
    color: #1d8cf8;
    text-align: right;
    cursor: pointer;
}
#up-next-wrapper .media-item.temp-cached .cache-state .cached-container .cached {
   display: flex;
}
#up-next-wrapper .media-item.perm-cached .cache-state .cached-container .cached {
   display: flex;
    color: green;
}
#up-next-wrapper .media-item.pre-cache .cache-state .cached-container .cached {
   display: none !important;
}
#up-next-wrapper .media-item.caching .cache-state .cached-container .cached {
   display: none !important;
}
#up-next-wrapper .media-item.selected .cache-state .cached-container .cached {
    color: #fff;
}

#up-next-wrapper .media-item .library-item > .cache-container {
     margin-bottom: 0 !important;
}


#up-next-wrapper .media-item .footer .library-item .cache-container {
    order: 1;   
    position: relative;
    top: 3px;
    margin-top: 0px;
    width:100%;
}

#up-next-wrapper .app-header-info
{
    display: flex;
    flex: 1;
    justify-content: center;
    padding-top: 5px;
}

#up-next-wrapper .app-header-tab
{
    padding-left: 10px;
    padding-right: 10px;
    border: solid 1px silver;
    background-color: rgb(221, 221, 221);
    padding-top: 3px;
    padding-bottom: 3px;
    text-align: center;
    font-size: .75em;
    transition: .2s ease-in-out;
}

body.dark-mode #up-next-wrapper .app-header-tab {
    background: rgba(100,100,100, .7);
    border-color: rgba(100,100,100, .5);
    color: white;
}

#up-next-wrapper .app-header-tab:hover
{
    background-color: silver;
}

body.dark-mode #up-next-wrapper .app-header-tab:hover {
    background: #0d6efd;
    border-color: #0d6efd;
}

#up-next-wrapper .app-header-tab.select
{
    background-color: #0069D9;
    border-color: #0069D9;
    color: white;
}

body.dark-mode #up-next-wrapper .app-header-tab.select {
    background-color: #0d6efd;
    border-color: #0d6efd;
    color: white;
}

#up-next-wrapper .app-header-tab.left {
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-right: none;
}

#up-next-wrapper .app-header-tab.right {
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border-left: none;
}

#up-next-wrapper .section-header-label
{
    font-size: 1rem;
    padding: .5rem;
    padding-bottom: 0;
    padding-top:0;
}

#up-next-wrapper .section-header-info
{
    padding: .5rem;
    font-size: .8rem;
    font-style:italic;
    padding-top:0;
}
    #up-next-wrapper .section-header-info > span.more-items
    {
        color: royalblue;
        text-decoration: underline;
        font-style: normal;
    }

    #up-next-wrapper .section-header-info > span.all-items
    {
        font-style: normal;
    }
#up-next-wrapper .section-header-info > span.all-items
{
    font-style:normal;
}
#up-next-wrapper .section-items {
    display:flex;
    flex-direction:column;
}

#up-next-wrapper .loading-container
{
    display: flex;
    align-items: center;
    font-style: italic;
}

#up-next-wrapper header {
    margin-top:3px;
    margin-left:0px;
    margin-right:7px;
    padding-bottom: 0px;
}
/*.playback #up-next-wrapper header {
    margin-top: 5px;
    padding-bottom: 1px;
}
.playback #up-next-wrapper .tab-page > section {
    border-bottom: solid 1px lightgray;
}*/
#up-next-wrapper header > .title {
    color: #404040;
    color:white;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 12px;
    /*margin-bottom: 2px;*/ 
    margin-top: 2px;
}

.playback-icon {
    color: #1d8cf8;
    font-size: 12px;
    margin-left: 0px;
    margin-right: 0px;
    position: relative;
    top: -2px;
    left: 3px;
    display:none;
}
.playing .playback-icon {
    display: block;
    opacity: 1;
}
.selected .playback-icon {
    color:#fff;
}
#up-next-wrapper .playback-icon {
   /* position:unset;*/
    padding-left:5px;
    padding-right:5px;
}
/*#up-next-wrapper .media-item .container > .image {
    margin-left: 1.5rem;
}*/
#up-next-wrapper .playing .media-item .container > .image {

}

.storage-count {
    display: flex;
    flex-direction: column;
    font-size: .7rem;
    padding-bottom: 3px;
}
.storage-count .value {
    padding-bottom: 5px;
}
.storage-count .description {
    padding-bottom: 5px;
}



/* media-status-queue */

.media-status-queue {
    /*position: relative;
    top: 5px;
    left: -5px;*/
    cursor: pointer;
}

.media-status-queue.no-media {
    padding-top: 5px;
    padding-right: 5px;
}

.media-status-queue.has-items {
    top: 2px;
    left: 0px;
}

.media-status-queue-line {
    display: flex;
    padding-bottom: 2px;
}

.media-status-queue-line-left {
    width: 2px;
    height: 1px;
    background-color: #777777;
    /*transition: .2s ease-in-out;*/
}

.media-status-queue-line-left:hover {
    background-color: #1d8cf8;
}

.media-status-queue-line-left:active {
    background-color: #1d8cf8;
}

.media-status-queue.selected .media-status-queue-line-left {
    background-color: #1d8cf8;
}

.has-items .media-status-queue-line-left {
    background-color: #1d8cf8;
}

.add-item .media-status-queue-line-left {
    background-color: #1d8cf8;
}

.media-status-queue-line-right {
    width: 13px;
    height: 1px;
    margin-left: 2px;
    background-color: #777777;
    /*transition: .2s ease-in-out;*/
}

.media-status-queue-line-right:hover {
    background-color: #1d8cf8;
}

.media-status-queue-line-right:active {
    background-color: #1d8cf8;
}

.media-status-queue.selected .media-status-queue-line-right {
    background-color: #1d8cf8;
}

.has-items .media-status-queue-line-right {
    background-color: #1d8cf8;
}

.add-item .media-status-queue-line-right {
    background-color: #1d8cf8;
}

.media-status-queue-line-right.arrow-right {
    position: relative;
    top: 4px;
    width: 12px;
}

.media-status-queue-line-left-arrow-right {
    width: 0;
    height: 0;
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 3px solid #777777;
    z-index: 1;
    position: relative;
}
.media-status-queue-line-left-arrow-right:hover {
    border-left-color: #1d8cf8;
}

.media-status-queue-line-left-arrow-right:active {
    border-left-color: #1d8cf8;
}

.media-status-queue.selected .media-status-queue-line-left-arrow-right {
    border-left-color: #1d8cf8;
}

.has-items .media-status-queue-line-left-arrow-right {
    border-left-color: #1d8cf8;
}

.add-item .media-status-queue-line-left-arrow-right {
    border-left-color: #1d8cf8;
}


#media-controls .svg-icon.apple-halfbox {
    margin-right: 3px;
}

#media-controls .svg-icon.apple-halfbox .shape-fill,
#media-controls .svg-icon.delta-down .shape-fill {
    fill: #4f4f4f;
}

#control-buttons {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 91px;
padding-bottom:2px;
}

#control-buttons .control-button {
    display: inline-block;
    vertical-align: middle;
    cursor:pointer;
}

#control-buttons .control-button .shape-fill {
    fill: #9f9f9f;
    stroke: #9f9f9f;
}

#control-buttons .control-button.play-pause-toggle > div.hide { 
    display:none;
}


#control-buttons .skip-back .svg-icon {
    width: 20px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
}

#control-buttons .skip-back.enabled .shape-fill {
    fill: #2c2c2c;
    stroke: #2c2c2c;
}
#control-buttons .skip-back.enabled:active .shape-fill {
    fill: #616161;
    stroke: #616161;
}

#control-buttons .play-pause-toggle .play,
#control-buttons .play-pause-toggle .pause {
    display: none;
}

#control-buttons .play-pause-toggle .play.show,
#control-buttons .play-pause-toggle .pause.show {
    display: block;
}

#control-buttons .play-pause-toggle .svg-icon {
    width: 19px;
    height: 22px;
}

#control-buttons .play-pause-toggle.enabled .shape-fill {
    fill: #2c2c2c;
    stroke: #2c2c2c;
}

#control-buttons .play-pause-toggle.enabled:active .shape-fill {
    fill: #616161;
    stroke: #616161;
}

#control-buttons .play-pause-toggle .play {
    margin-left: 3px;
    margin-top: 1px;
}

#control-buttons .play-pause-toggle .pause {
    margin-top: 2px;
}

#control-buttons .skip-forward .svg-icon {
    width: 20px;
    height: 14px;
    display: inline-block;
    vertical-align: middle;
}

#control-buttons .skip-forward.enabled .shape-fill {
    fill: #2c2c2c;
    stroke: #2c2c2c;
}
#control-buttons .skip-forward.enabled:active .shape-fill {
    fill: #616161;
    stroke: #616161;
}

#speaker-controls {
    padding: 0 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    margin: 0;
}


@media only screen and (max-width: 1200px) {

    #speaker-controls {
        margin: 0 20px;
    }

}

/*#speaker-controls .volume-bar 
{
  -webkit-appearance: none;
  width: 100%;
  margin: 4.5px 0;
  padding:0 3px;
  background-color:transparent;
  max-width:200px;
}
#speaker-controls .volume-bar:focus
{
  outline: none;
}
#speaker-controls .volume-bar::-webkit-slider-runnable-track
{
  width: 100%;
  height: 4px;
  box-shadow: 1px 1px 1px rgba(0,0,0,.4) inset;
  background: #ababab;
  border-radius: 5px;
  border: 0 solid rgba(1, 1, 1, 0);
}
#speaker-controls .volume-bar::-webkit-slider-thumb
{
    height: 15.515152px;
    width: 15.515152px;
    -webkit-appearance: none;
    background-image:url(/site/images/svgs/apple.volume.thumb.svg);
    background-repeat:no-repeat;
    margin-top: -5px;
    margin-left:-1px;
}
#speaker-controls .volume-bar::-webkit-slider-thumb:active
{
    background-image:url(/site/images/svgs/apple.volume.thumb.active.svg);
}*/


/* added to center volume in header */

#control-panel #volume-bar-container {
    justify-content: center;
    display: flex;
    flex: 1;
}

#control-panel .volume-bar {
    display: none;
    flex: 1;
    /*cursor: pointer;*/
    /*width:100px;*/
    -webkit-appearance: none;
    width: 100%;
    margin: 4.5px 0;
    padding: 0 3px;
    background-color: transparent;
    justify-content: center
}

#control-panel .volume-bar.show {
    display: flex;
}

#control-panel .volume-bar div {
    /*cursor: default;*/
}

#control-panel .volume-bar-area {
    display: flex;
    /*height: 2px;
    flex: 1;*/
    cursor: pointer;
    max-width: 160px;
    min-width: 75px;
    height: 15px;
    width: 100%;
}

#control-panel .volume-bar-area-on {
    display: flex;
    border: solid 1px gray;
    background-color: gray;
    height: 2px;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    align-self: center;
    border-top: inset 1px darkgray;
    border-left: inset 1px darkgray;
    position: relative;
    left: 7px;
    cursor: pointer;
   /* border:none;*/
}

#control-panel .volume-bar-area-off {
    display: flex;
    border: solid 1px darkgray;
    background-color: darkgray;
    height: 2px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    align-self: center;
    position: relative;
    border-top: inset 1px lightgray;
    border-right: inset 1px gray;
    flex: 1;
    cursor: pointer;
    /*border: none;*/
}

#control-panel .volume-bar-area-ball {
    display: flex;
    border: solid 1px gray !important;
    width: 14px;
    height: 14px;
    min-width: 14px;
    min-height: 14px;
    background-color: white !important;
    border-radius: 10px;
    align-self: center;
    z-index: 5;
    position: relative;
    left: 2px;
    cursor: pointer;
    transition: .3s;
    /*box-shadow: 0px 3px 6px 2px rgba(163,157,163,0.25);*/
}

#control-panel .volume-bar-area-ball:active {
    background-color: gainsboro !important;
    cursor:pointer !important;
}

#control-panel .volume-bar-area-ball.resize {
    background-color: gainsboro !important;
    cursor:pointer !important;
}

#media-status-bar {
    flex: 10;
    background: linear-gradient(to bottom, #f1f1f1 0, #e6e6e6 100%);
    /*border:solid 1px #cecece;*/
    border-top: none;
    border-bottom: none;
    display: flex;
    justify-content: space-between;
    cursor: default;
}

#media-status-bar .svg-icon .shape-fill {
    fill: #646464;
}

#media-status-bar.media .media-art {
    width: auto;
    height: 45px;
    /*max-width: 45px;*/
}


@media only screen and (max-width: 800px) {

    #media-status-bar .media-art {
        display: none;
    }
}

#media-status-bar.no-media .media-art {
    display: none;
}

#media-status-bar.no-media .artrela-logo {
    width: 38px;
    height: 38px;
    align-self: center;
    background-image: url(/site/icons/logo.png);
    background-size: contain;
    opacity: .2;
    transition-duration: 3s;
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

#media-status-bar.media .artrela-logo {
    display: none;
}

#media-status-bar .playback-info {
    flex: 1;
    display: flex;
    flex-direction: column;
}

#media-status-bar .playback-info .main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 11px;
    flex: 1;
    margin-bottom: 0px;    
    min-height: 43px;
    max-height: 43px;
}

#media-status-bar .playback-info .left {
    margin-left: 5px;
    min-width: 35px;
    align-self: flex-start;
    padding-top: 5px;
}

#media-status-bar .playback-info .left .playback-time {
    position: relative;
    top: 1px;
}
#media-status-bar .playback-info .left .icons {
    display: flex;
    align-items: center;
    margin-bottom: 7px;
}
/*#control-panel.url #media-status-bar .playback-info .left .icons {
    display:none;
}*/
/*#control-panel.url #media-status-bar .playback-info .left .playback-time {
    display: none;
}*/

    #media-status-bar .playback-info .left .minimize
    {
        display:none;
        height: 15px;
        width: auto;
        margin-right: 7px;
        transform: scale(.8);
    }
#media-status-bar .playback-info .left .minimize:hover .shape-fill {
    fill: #0D7AFF;
}

    #media-status-bar .playback-info .left .shuffle {
        height: 9px;
        width: auto;
        transform: scale(.95);
        cursor:pointer;
    }
#media-status-bar .playback-info .left .shuffle:hover .shape-fill
,#media-status-bar .playback-info .left .shuffle.selected .shape-fill
{ 
    fill: #0D7AFF;
}


#media-status-bar.no-media .playback-info .left .playback-time {
    display: none;
}

#media-status-bar.no-media .playback-info .description {
    display: none;
}

#media-status-bar .playback-info .description {
    margin-top:0px;
    margin-left:10px;
    margin-right:7px;
}
#media-status-bar .playback-info .description > .title {
    font-weight: bold;
   /* font-family: 'Nunito Medium', sans-serif;*/
    font-size:12px;
    text-align: center;
   /* color: #3f3f3f;*/
    padding-bottom: 2px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#media-status-bar .playback-info .description .supplemental-info {
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: center;
    padding-bottom: 2px;
    padding-top:2px;
    max-height:24px;
}

#media-status-bar.buffering .playback-info .description .supplemental-info {
    display:none;
}

@media only screen and (max-width: 700px) {
    #media-status-bar .playback-info .description .supplemental-info {
        display: none;
    }
}

#media-status-bar .playback-info .description .supplemental-info2 {
    /*white-space: nowrap;*/
    text-overflow: ellipsis;
    overflow: hidden;
    text-align: center;
}

#media-status-bar.buffering .playback-info .description .supplemental-info2 {
    display: none;
}

@media only screen and (max-width: 700px) {
    #media-status-bar .playback-info .description .supplemental-info2 {
        display: none;
    }
}

#media-status-bar .playback-info .description .field-group.buffer-progress 
{
    display:none;
    flex-direction: row;
}
#media-status-bar.buffering .playback-info .description .field-group.buffer-progress 
{
    display:flex;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .title
{
    margin-right:5px;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content {
    display:flex;
    flex-direction: row;
    align-items: center;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content progress {
    -webkit-appearance: none;
    height: 5px;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content .display {
    margin-right:10px;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content progress::-webkit-progress-bar {
    background-color: #ccc;
}

#media-status-bar .playback-info .description .field-group.buffer-progress .content progress::-webkit-progress-value {
    background-color: #0D7AFF;
}

#media-status-bar .playback-info .right {
    margin-right: 5px;
    /*min-width: 50px;*/
    align-self: flex-start;
    padding-top: 0px;
}

#media-status-bar .playback-info .right .icons {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0px;
}

    #media-status-bar .playback-info .icons .repeat {
        height: 11px;
        width: auto;
        margin-left: 1px;
        margin-right: 6px;
        transform: scale(.80);
        position: relative;
        left: -2px;
        cursor:pointer;
    }
#media-status-bar .playback-info .icons .repeat:hover .shape-fill
,#media-status-bar .playback-info .icons .repeat.selected .shape-fill {
    fill: #0D7AFF;
}#media-status-bar .playback-info .icons .repeat.single .shape-fill {
    fill: red !important;
}

#media-status-bar .playback-info .right .icons .love {
    margin-right: 14px;
    cursor: pointer;
    position: relative;
    top: 3px;
}

#media-status-bar .playback-info .right .icons .love.show {
    display:block;
}

#media-status-bar.no-media .playback-info .right .icons .love {
}

#media-status-bar .playback-info .right .icons .love .icon {
    height: 9px;
    width: auto;
}

#media-status-bar .playback-info .right .icons .love .heart-outline .shape-fill {
    stroke: #646464;
}

#media-status-bar .playback-info .right .icons .love:hover .shape-fill,
#media-status-bar .playback-info .right .icons .love .checked .shape-fill {
    fill: #0D7AFF;
    stroke: #0D7AFF;
}

#media-status-bar .playback-info .right .remaining-time {
    text-align: right;
}

#control-panel.no-time #media-status-bar .playback-info .right .remaining-time {
    display:none;
}

#media-status-bar.no-media .playback-info .right .remaining-time {
    display: none;
}

#app-container .winform-options-button {
display:none;
}
/* begin position-level */
#media-status-bar #position-level {
    /*display: flex;*/
    /* flex: 1; */
    /* min-height: 7px; */
    /* max-height: 7px; */
    /* align-items: center; */
    /*cursor: pointer;
    position: relative;
    top: 0px;*/
}
#media-status-bar #position-level .position-level-bkgd {
    
    position: absolute;
    left: 0;
    right: 0;
    top: -4px;
    bottom: -4px;
}

#media-status-bar.no-media #position-level {
    display: none;
}

#media-status-bar #position-level-on {
    display: flex;
    background-color: #0d6efd;
    position: relative;
    height: 2px;
    top: 0px;
    transition-property: box-shadow;
    transition: .2s;
    border-radius: 5px;
}
/*
#media-status-bar #position-level:hover #position-level-on {
    box-shadow: 1px 1px 15px 1px #0d6efd;
}
*/
#media-status-bar #position-level-selector {
    display: flex;
    display: none;
    background: #0d6efd;
    width: 3px;
    height: 6px;
    position: relative;
    top: -2px;
    z-index: 10;
    border: solid 1px #0d6efd;
    transition: .2s;
    border-radius: 5px;
    left: -2px;
}
/*
#media-status-bar #position-level:hover #position-level-selector {
    box-shadow: 1px 1px 15px 1px #0d6efd;
}
*/
#media-status-bar #position-level-selector.hide {
    display: none;
}

#media-status-bar #position-level-selector:active {
    background: linear-gradient(#B1B1B1, #D9D9D9);
}

#media-status-bar #position-level-selector.select {
    background: linear-gradient(#B1B1B1, #D9D9D9);
}

#media-status-bar #position-level-off {
    display: flex;
    flex: 1;
    height: 2px;
    position: relative;
    top: 0px;
    background-color: rgba(100,100,100,.3);
}


/* end position-level */



#search-menu.hidden {
    display: none;
}

#search-menu .search-box {
    background-color: #fff;
    border: solid 1px silver;
    border-radius: 5px;
    min-height: 22px;
    display: flex;
    align-items: center;
    white-space:nowrap;
}

#search-menu .search-box.focused {
    border: solid 5px #99c0e9;
    box-shadow: rgba(0, 0, 0, .2) 0 0 5px 1px inset;
}

#search-menu .icons {
    margin: 0 5px;
    margin-top: 2px;
    cursor:pointer;
}

#search-menu .icon-magnifying-glass {
    transform: scaleX(-1);
    width: 12px;
    height: 12px;
}

#search-menu .icon-chevron-down {
    width: 7px;
    height: 7px;
    margin-right: 3px;
    margin-bottom: 3px;
}

#search-menu .icon-magnifying-glass .shape-fill,
#search-menu .icon-chevron-down .shape-fill {
    fill: #757575;
}

#search-menu .search-box input[type="search"] {
    margin: 0;
    padding: 0;
    border: none;
    font-size: 13px;
    flex: 1;
    margin-right: 10px;
    margin-top: 2px;
    color: #484848;
    width:100%;
}

#search-menu .search-box input[type="search"]:focus {
    outline: none;
}

#winform-controls {
    margin-left: 10px;
}


/* -- UNFINISHED MEDIA BAR SECTION -- */

#media-menu {
    padding: 4px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #676767;
    font-size: 13px;
}

#media-menu.hidden {
    display: none;
}

#media-bar-menu-items {
    padding-top: 5px;
}

.media-bar-menu-item {
    display: flex;
    align-items: center;
    padding-top: 5px;
    padding-bottom: 5px;
}

.media-bar-menu-item input {
    margin-left: 10px;
}

.media-bar-menu-item>div {
    min-width: 16px;
    max-width: 16px;
    display: flex;
    justify-content: center;
    padding-left: 8px;
    padding-right: 8px;
}

.media-bar-menu-item img {
    max-height: 16px;
}

.media-bar-menu-item span {
    padding-right: 20px;
}

.media-bar-menu-item svg {
    width: 100%;
    max-height: 16px;
}



.app-form-container .options-price {
    display: flex;
}
#views .view.library section.library .subsection .loading-container > label {
    margin-left: 3px;
    font-style: italic;
}

.select-project-item .button-edit {
    padding:0 .5rem;
}
.select-project-item .button-delete {
    padding: 0 .5rem;
}

.spacer-container {
    /*margin-left: 3rem;
    margin-right: 3rem;*/
}
.spacer-header {
    font-size: 3rem;
    padding: 2rem 2rem;
    width: 100%;
    text-align: center;
    padding-bottom: 2rem;
    text-shadow: -1px 1px 2px rgb(0, 0, 0);
    font-weight: bold;
    padding-left: 6rem;
    padding-right: 6rem;
}
.project-layout-wizard-buttons {
    display: flex;
    flex-wrap: wrap;
    overflow: auto;
    padding: 0.5rem 1rem;
    justify-content: center;
    overflow: hidden;
}
.wizard-create-project .wizard-welcome-selection .project-layout-wizard-buttons {
    flex-wrap: nowrap;
    overflow: auto;
    /*padding-left: 31rem;*/
    width: 100%;
    border-bottom: solid 1px rgba(100,100,100,.3);
}
.wizard-create-project.wizard-page-sections .wizard-welcome-selection .project-layout-wizard-buttons {
    flex-direction: column;
    /*max-height: 60vh;
    overflow-y: auto;
    flex: 1;*/
}
.wizard-create-project.wizard-page-sections .project-layout-wizard-buttons button img {
    max-height: 28vh;
}
.project-layout-wizard-buttons button {
    padding: 2rem;
    width: 200px;
    height: 200px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.wizard-page.select-project .project-layout-wizard-buttons button {
    width: 400px;
    background-color: rgba(100,100,100,.3);
    margin: 2rem;
    border: solid 1px rgba(100,100,100,.3);
    border-radius: 5px;
}
.project-layout-wizard-buttons button:hover {
    transform: scale(1.05);
}
.project-layout-wizard-buttons button:focus {
    transform: scale(1.05);
}
.project-layout-wizard-buttons button.selected {
    opacity:1 !important;    
 /*   transform: scale(1.1) !important;*/
}
.project-layout-wizard-buttons button i.material-icons {
    font-size:5rem;
}
.project-layout-wizard-buttons button > div {
    font-size:2rem;
    padding-top:.5rem;
    white-space: normal;
}
.project-layout-wizard-buttons button.selected > div {
    color:#0d6efd;
}
.project-layout-wizard-buttons button > div > img {
    max-width:100px;
}
.library-group-wizard-container {
    display: flex;
    flex-wrap: nowrap;
    overflow: hidden;
}
.wizard-page {
    position: absolute;
    flex-direction: column;
    height: 100%;
    width: 100%;
    border-radius: 5px;
    border: solid 1px rgba(100,100,100,.3);
}
.project-layout-wizard-buttons .select-project-button i.fal {
    font-size: 3.8rem;
    padding-bottom: 12px;
    padding-top: 3px;
}

.wizard-create-project .project-layout-wizard-buttons button {
    width:unset;
    height:unset;
}
/*.wizard-create-project .project-layout-wizard-buttons > button {
    margin: 1rem;
    background-color: rgba(100,100,100,.3);
    border-radius: 6px;
}*/
.wizard-create-project.wizard-page-sections .project-layout-wizard-buttons button {
   /* width: 200px;
    height: 200px;*/
   position:relative;
}
.wizard-create-project.wizard-page-sections .project-layout-wizard-buttons button button {
    padding:1rem;
}
.wizard-create-project.wizard-page-sections .app-button {
    margin: 0;
    text-align: center;
    justify-content: center;
    font-size: 1.4rem;
}

.wizard-create-project .project-layout-wizard-buttons button img {
    max-width: 100%;
    max-height: 16vh;
    object-fit: contain;
    border-radius: 5px;
    box-shadow: 7px 7px 7px 0px rgba(0,0,0,.1);
    border: solid 1px dimgray;
    width: 300px;
}
.wizard-create-project .project-layout-wizard-buttons button:focus img {    
    border: solid 1px cornflowerblue;
}

.upload-files .links-container {
    padding-left:.5rem;
}


.app-paginator {
    padding-top: .5rem;
    padding-bottom: 0;
    padding-left: 1rem;
    padding-right: 1rem;
   /* border-top: solid 1px rgba(100,100,100,.3);*/
}
.live-view-footer.app-paginator {
    border-top:none;
}

.sections-container-bridge .sections-tabs {
    box-shadow: 0 16px 38px -12px rgb(0 0 0 / 56%), 0 4px 25px 0 rgb(0 0 0 / 12%), 0 8px 10px -5px rgb(0 0 0 / 20%);
}

#control-panel .media-status-user-container {
    margin-top: 5px;
    margin-right: 25px;
}
#control-panel .control-panel-menu-user {
    right: -12px;
}


/*.wizard-page {
    display:none;
}*/
.project-layout-wizard-content {
    padding: 0 3.5rem;
    font-size: 2rem;
    line-height: 1.4;
    border-top: solid 1px rgba(100,100,100,.3);
    padding-top: 1.5rem;
    color: whitesmoke;
}
.wizard-welcome .project-layout-wizard-buttons {
    padding: 1rem;
}
.wizard-page .select-button-container {
    margin: 0rem 3rem;
    text-align: center;
    font-size: 3rem;
    margin-bottom: 1.5rem;
}
.wizard-page .select-button-container button {
    font-size: 2rem;
    padding: 1rem 1rem;
    width: 100%;
    text-align: center;
    margin-top: 2rem;    
}
.wizard-page .select-button-container button div {
    width:100%;    
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 1px;
}
.wizard-page.wizard-page-create-sections .select-button-container button {
    margin-top: 0;
}
.wizard-page.wizard-page-create-sections .select-button-container {
    margin: 0;
    padding: 0;
}
.wizard-create-project .wizard-welcome-selection .project-layout-wizard-content {
/*    border-top: none;
    padding-top: 0px;*/
}
body.can-edit .library-groups .vail {
    left: 5rem !important;
}
body.edit-layout .library-groups .vail {
    left:35rem !important;
}
.library-groups-navigation {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 5;
}
.library-groups-navigation .prev-button {
    padding-left:1rem;
    padding-top:1rem;
    font-size: 2rem;
}
.library-groups-navigation .close-button {
    position: absolute;
    top: 2px;
    right: 25px;
    font-size: 2rem;
    padding: 0.5rem;
}
.wizard-page .spacer-container {
    display: flex;
    background: linear-gradient(to bottom, #0d6efd 0%,#7db9e8 100%);
    padding-left: 1rem;
    padding-right: 1rem;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: solid 1px rgba(100,100,100,.3);
    position: relative;
}
.wizard-page .spacer-container.pad-bottom {
    padding-bottom:2.5rem;    
}
.wizard-page .spacer-container.column {
    flex-direction:column;    
}
.wizard-page .prev-button {
    font-size: 3rem;
    position: absolute;
    top: 1.5rem;
    padding: 0.5rem;
}
.library-group-details .library-group-details-ex .controls {
    bottom: 0.5rem;
    right: 1rem;
}
.library-group-details .controls .buttons button.add-button label {
    margin-left:.5rem;
}
.library-group-details .controls .buttons.flex-end {
    justify-content:flex-end;
}
.wizard-page {
    display: none;
    opacity: 0;
    transition: .2s;
    transition-property: opacity;
}

.wizard-page.show {
    display: flex;
}

.wizard-page.reveal {
    opacity: 1;
}

.wizard-page.wizard-select-project-name .content-info > div {
    font-size: 2rem;
    padding-top: 0.5rem;
    white-space: normal;
}
.wizard-page.wizard-select-project-name > img {
    max-width: 100%;
    max-height: 155px;
    object-fit: contain;
    border-radius: 6px;
    box-shadow: 7px 7px 7px 0px rgb(0 0 0 / 10%);
    border: solid 1px dimgray;
}
.wizard-page.wizard-select-project-name input  {
    font-size: 2rem !important;    
    font-size: 2.4rem;
    padding: 1rem;
}
.default-content-project-info-container-icon {
    border: none !important;
    box-shadow: none !important;
    max-height: 75px !important;
    position: relative;
    top: -5px;
}
.default-content-project-info-container {
    display: flex;
    padding-right: 2rem;
    justify-content: center;
    align-items: center;
}
.default-content-project-info-container-ex {
    display: flex;
    padding-bottom: 0rem;
    align-items: center;
    padding-left: 0.5rem;
}
.default-content-project-info-container-ex.pad-bottom {
    padding-bottom:2rem;    
}
.app-form-field .pad-top {
    padding-top:2rem;    
}
.default-content-project-info-container-label {
    font-size: 2.2rem;
    font-weight:normal !important;
}
.default-content-project-info-container-step {
    min-width: 35px;
}
.default-content-project-info.icon-info {
    position: relative;
    top: 3px;
}
.project-layout-wizard-content .spacer-header-ex {
    font-size: 1.6rem;
    padding: 0.5rem;
    padding-top: 1.5rem;
    padding-bottom: 0;
}
.project-layout-wizard-content .spacer-header-ex.pad-bottom {    
    padding-bottom: 1rem;
}
.project-layout-wizard-content .spacer-header-ex.nopad-top {    
    padding-top: 0rem;
}
.project-layout-wizard-content .spacer-header-ex2 {
    font-size: 1.6rem;
    padding: 0.5rem;
    padding-top: 1rem;
    padding-bottom: 0;
}
.project-layout-wizard-content .spacer-header-required {
    color: red;
    font-size: .9rem;
    padding-left: 0.7rem;
    padding-top: 0.2rem;
}

.wizard-page.wizard-select-project-icon > img {
    max-width: 100%;
    max-height: 155px;
    object-fit: contain;
    border-radius: 5px;
    box-shadow: 7px 7px 7px 0px rgb(0 0 0 / 10%);
    border: solid 1px dimgray;
}
.default-content-project-info.image-info > div {
    font-weight: bold;
    font-size: 2.2rem;
}
.project-layout-wizard-content .select-project-icon {
    padding-top: 1rem;
}
.project-layout-wizard-content .select-project-icon img {
    max-height:250px;    
}
.project-layout-wizard-content .select-project-icon-buttons {
    display:flex;   
}
.project-layout-wizard-content .default-content-project-info.icon-info img {
    max-height:50px;
}
.wizard-select-project-publishUrl .app-form-select {
    font-size: 2rem !important;
    padding: 1rem;
}
.wizard-select-project-publishUrl .app-form-field-input {
    font-size: 2rem !important;
    padding: 1rem;
}
.wizard-select-project-publishUrl .publishLabel {
    font-style: italic;
    font-weight: bold;
}
.wizard-welcome-message-container {
    display:flex;
}
.wizard-welcome-message-container img {
    DISPLAY: block;
    MAX-HEIGHT: 150PX;
    PADDING-RIGHT: 2REM;    
}
.wizard-welcome-selection {
    overflow: auto;
    flex: 1;
}
.wizard-welcome-selection .library-items {    
   /* max-height: 66vh;*/
    overflow: auto;
}
.wizard-page-create-sections .library-items {
     max-height: 66vh;
}
.wizard-page-sections .wizard-welcome-selection {
    padding-top: 0rem;
}
/*.app-form-fields .app-form-field.form-check.useAsTrailer {
    margin-bottom: 0.5rem !important;
}*/
.app-form-fields .app-form-field.form-check.disableSubscriptionAccess {
    margin-bottom: 0.5rem !important;
}
.app-form-fields .app-form-field.form-check.useAsProduct {
    margin-bottom: 0.5rem !important;
}
.app-form-fields .app-form-field.form-check.useAsEvent {
    margin-bottom: 0.5rem !important;
}
.app-form-container.product-container {
    display: flex;
  /*  margin-right: 10px;*/
}
.app-form-container.product-setup {
    width: 100%;
    overflow: auto;
   /* margin-right: -10px;*/
   max-width:60rem;
}
.app-button.preview-link {
    padding: 0;
}
.app-button.preview-link i {
    font-size:2rem;
}

.app-tab-view.schedule {
    align-items: center;
}
.app-form-container.schedule-setup {
    max-width: 75rem;
    width: 100%;
    padding-top: 1rem;
}
.app-form-container.schedule-setup-ex {
    max-width: 60rem;
    width: 100%;
    padding-top: 0rem;
}
.app-form-container.schedule-setup-ex .app-form-field-date,
.app-form-container.schedule-setup-ex .app-form-field-time {
    max-width:unset;
}


.app-navigation-subitems .svg-container {
    flex: 1;
    min-width: 36px;
    max-width: 36px;
    max-height: 36px;
    display: flex;
}

.app-navigation-subitems .svg-container svg {
    flex: 1;
    min-width: 36px;
    max-width: 36px;
    min-height: 36px;
    max-height: 36px;
}

button.has-adaptiveBitrate i {
    color: rgba(100,100,100,1);
    color: white;
}

.metadata-window button.has-adaptiveBitrate i {
    position: relative;
    top: -1px;
    margin-right: 0px;
    color:whitesmoke;
}

.metadata-window button.encrypted i {
    position: relative;
    top: 0px;
    margin-right: 0px;
    color: #FFAB15 !important;
    font-size: 20px;
}

.subsection .selection-items.show {
    display:flex;
    flex-direction:column;
}

.client-consoles {
    display: flex;
    order: 3;
    height: 184px;
    background-color: black;
    border-top: solid 1px rgba(100,100,100,.3);
    display:none;
}
.client-consoles .logs-items {
}
.list-view-group-item-image2 .svg svg {
    width: 100%;
    max-height: 150px;
    flex: 1;
    vertical-align: middle;
}
.up-next-queue-vail {
    z-index: 500;
    transition:.2s;
    opacity:0;
}
/*.up-next-queue-vail.show {
    opacity: 1;
    opacity: .7 !important;
    opacity: .3 !important;
}*/
.sections-container-analytics .showBilledOnly {
    margin: 0.5rem !important;
}
.admin-screen .sections-page {
    height:unset;
}
.admin-screen .dms-on-demand-loader {
    background-color: rgba(0,0,0,.3);
}
.list-view-body.clients .list-view-group-item-image2 img.default-artwork {
    min-width: 160px;
    min-height: 160px;
}
.admin-screen .sections-page.revenue {
    height:100%;
}
.sections-page.analytics .section-header {
    padding-left: 1.5rem;
    font-size: 1.6rem;
    padding-top: 0.5rem;
}
.revenue-summary-totalMessage {
    padding-top: .7rem;
    font-size: 1rem;
}
.ct-grid-background {
    fill: aliceblue;
}
.stripe-login {
    position: absolute;
    left: 1rem;
    top: 1rem;
    width: calc(100% - 2rem);
    height: calc(100% - 2rem);
    background-color: black;
    border-radius: 5px;
    border: solid 1px rgba(255,255,255,.3);
}

.app-page-row-button {
    display: flex;
    align-items: center;
}


.dmsProjectChannelScheduleItem .media-item .no-item-selected {
    font-style: italic;
    padding: 0.5rem;
    margin-bottom: 2px;
}

.metadata-section .app-form-field-image-container .app-form-field-img {
    box-shadow:none !important;
}
.metadata-section .library-group {
    width: 260px;
    min-width: 260px;
    margin: 0;
    margin-top: 0.5rem;
    margin-bottom: 0.3rem;
}
.metadata-section .library-group .image {    
    width: 260px;
    height: 220px;
}
.metadata-section .library-group img {  
    max-width: 260px;
    max-height: 220px;
}
.dmsProjectLibraryPlaylist .app-form-select {
    width: fit-content !important;
}
.select-short-width .app-form-select {
    padding-right: 5px;
}
.app-form-field.select-short-width {
    max-width: 65px;
}
.smartFilterReleaseFromDate {
    max-width: fit-content;
}
.smartFilterReleaseFromDate .app-form-field-input.datepicker {    
    max-width: 190px;
}
.smartFilterReleaseToDate .app-form-field-input.datepicker {
    max-width: 190px;
}
.app-form-fields .app-form-field.form-check.check-only {
    margin: 0 !important;
    padding: 0 !important;
    position: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 50px;
    margin-right: 0.5rem !important;
}
.smartFilterDayLabel {
    margin: 0 !important;
    padding: 0 !important;
    position: unset;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 55px;
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
    font-size: 16px;
}
.smartFilterPlayCountState {
    max-width: 123px;
}

.form-window .app-form-field-media .app-form-field-autocomplete-selection {
    max-height: unset !important;
    height: unset !important;
    min-height: 1430%;
}

.dashboard-map-countries table .project-icon {
    padding-right:0;
}
.dashboard-map-countries table .dashboard-map-project-icon {
    max-width: 20px;
    max-height: 20px;
}

.dashboard-map-countries table .country-icon {
    padding-right: 0;
}
.dashboard-map-countries table .dashboard-map-country-icon {
    max-width: 20px;
    min-width: 20px;
    max-height: 20px;
    min-height: 20px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    box-shadow: 0px 3px 6px 2px rgba(163, 157, 163, 0.3);
    box-shadow: 7px 7px 7px 0px rgb(0 0 0 / 10%);
}
.form-window-fields-section.disabled {
}
.form-window-fields-section.disabled .app-navigation-items {
    pointer-events: none;
    opacity: .5;
}

.project-versions-controller {
    font-size: .6rem;
    flex: 2;
}
.project-versions-controller > div {
    display: flex;
}
.project-versions-controller label {
    margin-right: .25rem;
}

body.show-admin-page {
    overflow:hidden !important;
}
.library-groups-selected-item.wizard-window.show {
    z-index: 15000 !important;
}
.library-groups-selected-item.wizard-window .app-form-field-image-container {
    min-height: 10rem;
}
.library-groups-selected-item.wizard-window .app-form-field > .drop-down .selected-item,
.library-groups-selected-item.wizard-window .app-form-field > .drop-down .items .item {
    font-size: 2rem !important;
}
.wizard-page .wizard-welcome-selection .spacer-header-ex2 {
    text-align: center;
    font-size: 2rem;
}
.wizard-page .wizard-welcome-selection .spacer-header-ex2.pad-bottom {
    padding-bottom:1rem;    
}

.wizard-page.wizard-select-project-stripeAccount .select-button-container button {
    margin-top: 1rem !important;
}

.dmsProjectAdminUploadSection {
    position: fixed;
    bottom: -3rem;
    right: 100px;
    width: 30%;
    height: 3rem;
    transition: .2s;
    min-width: 450px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border: solid 1px rgba(100,100,100,.3);
    box-shadow: 0 16px 38px -12px rgb(0 0 0 / 56%), 0 4px 25px 0 rgb(0 0 0 / 12%), 0 8px 10px -5px rgb(0 0 0 / 20%);
}
body.has-uploads .dmsProjectAdminUploadSection {
    bottom:0 !important;
}
.dmsProjectAdminUploadSection.expand {
    height:70%;
}
.dmsProjectAdminUploadSection .header {    
    padding: 1rem;
    border-bottom: 1px solid rgba(100,100,100,.3);
}
.wizard-project-section-collect-email .library-items .library-item {
    border-bottom: none;
    margin-bottom: 0.5rem;
    margin-left: 1rem;
    margin-right: 1rem;
}
.wizard-project-section-collect-email .project-layout-wizard-content {
    padding-top: 0rem;
}
.wizard-project-section-collect-email .library-items .library-item > button {
    padding-top: 0;
}
/*.wizard-project-section-collect-email .library-items .library-item.selected-item > button {
    background-color: #333 !important;
}
.wizard-project-section-collect-email .library-items .library-item.selected-item .library-item-details {
    background-color: #333 !important;
}*/

.wizard-project-section-banner .spacer-header {
    padding-bottom: 0rem;
}
.wizard-project-section-collect-email .spacer-header {
    padding-bottom: 0.5rem;
}
.wizard-project-section-collect-email .library-items-ex {
    margin-left: 0rem;
    margin-right: 0rem;
}
.wizard-project-section-carousel .spacer-header {
    padding-bottom: 0rem;
}
.wizard-project-section-carousel .library-items-ex {
    margin-left: 0rem;
    margin-right: 9.5rem;
}
.library-group-details-ex .controls {
    display:flex;
}
.library-items-ex .library-item {
    border-bottom: none !important;
}
/*.wizard-project-section-carousel .wizard-welcome-selection .library-items {
    max-height: 57vh;
}*/
.wizard-project-section-carousel-add .project-layout-wizard-content {
    height: 57vh;
    padding-top:0;
}
.wizard-project-section-carousel-add .library-items-ex .library-item.selected > button {
    background-color:transparent !important;
}
.wizard-project-section-carousel .select-button-container button {
    margin-top: 0rem;
}
.wizard-project-section-carousel .library-item-details .controls {
    height: 15px;
}
.wizard-project-section-carousel-add .drop-target {
    width: 100%;
    height: calc(100% - 0rem);
    display: flex;
    flex-direction: column;
    border: 5px #0d6efd;
    border-style: dashed;
    margin-top: .5rem;
}
.library-items-ex .library-item > button > .container {
    padding-top: 0;
}
.library-group-details .drop-target .image {
    background-color: transparent;
    height: 100%;
}
.library-group-details .drop-target .image .svg {
    font-size: 10rem;
}
.library-group-details .drop-target .image span {
    font-size: 3rem;
}
.wizard-project-section-carousel-add .wizard-welcome-selection .library-items {
    height: 55vh;
    border-top: solid 1px rgba(100,100,100,.3);
    border-bottom: solid 1px rgba(100,100,100,.3);
    margin-bottom: 1rem;
}
.project-layout-wizard-content .drop-container {
    height: 100%;
}
.has-images .project-layout-wizard-content .drop-container {
    position: absolute;
    left: 0;
    top: -10px;
    right: 0;
    bottom: 0;
    z-index: 5;
}
.has-images .project-layout-wizard-content .spacer-header-ex {
    display:none;
}
.has-images .project-layout-wizard-content .drop-target {
    background-color: rgba(0,0,0,.7) !important;
}
.wizard-welcome-selection .controls {
    order: 0;
    position: relative;
    top: 0;
    padding: 1rem;
    margin: 0;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
}
.wizard-welcome-selection .controls .select-files label {
    padding-left:.5rem;
}
.wizard-welcome-selection .controls .select-folder label {
    padding-left:.5rem;
}
.wizard-welcome-selection .app-form-field-autocomplete {
    padding: 0 3.5rem;
    padding-top: 0.5rem;
}

.wizard-welcome-selection .app-form-field-media .app-form-field-media-item {
    min-height: 50vh;
    display: flex;
    flex-direction: column;
}
.wizard-welcome-selection textarea {
    font-size: 1.8rem;
}
.wizard-welcome-selection input[type=text] {
    font-size: 1.8rem !important;
}
.app-form-field-media-item .has-video .drop-target, .app-form-field-media-item .has-image .drop-target {
    border-style: none;
    padding: 0;
    margin:0;
}

.app-form-field-media-item .drop-target .video {
    max-height: 200px;
    max-width: 200px;
    padding: 0;
    margin: 0;
    display: none;
}

.app-form-field-media-item .has-video .drop-target .video {
    display: unset;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    /*border: solid 1px #444;
    border-radius: 6px;*/
}
.app-form-field-media-item .drop-target .image {
 /*   background-color: transparent;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    flex: 1;
    margin: 1rem;
    padding: 1rem;
    border-style: dashed;
    position: absolute;
    top: 2rem;
    margin: 0;
    left: 1rem;
    bottom: 1rem;
    height: unset;
    right: 1rem;
    width: unset;*/
    background-color: transparent;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    flex: 1;
}
.app-form-field-media-item .has-video .drop-target .image {
    display: none;
}
.app-form-field-media-item .drop-target .image .svg {
    font-size: 10rem;
    font-size: 1.6rem;
    margin: 1rem 0;
}
.app-form-field-media-item .drop-target .image span {
    font-size: 3rem;
    font-size: 1.4rem;
    margin-left: 5px;
}
.app-form-field-media-item .drop-container {
    height: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position:relative;
    text-align:center;
}
.app-form-field-media-item .drop-container .spacer-header-ex {
    font-size:1rem;    
   /* position: absolute;
    top: 0;*/
    text-align: left;
    padding: 0 1rem;
}
.app-form-field-media-item .drop-container.has-video .spacer-header-ex {
    display:none;
}
.has-images .app-form-field-media-item .drop-container {
    position: absolute;
    left: 0;
    top: -10px;
    right: 0;
    bottom: 0;
    z-index: 5;
}
.has-images .app-form-field-media-item .spacer-header-ex {
    display: none;
}
.app-form-field-media-item .drop-target {
    height: 100%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: white;
    border: solid;
    margin: 1rem;
    margin-top: .5rem;
    padding: 1rem;
    border-style: dashed;
    /*position: absolute;
    width: 100%;
    height: 100%;*/
}
.has-images .app-form-field-media-item .drop-target {
    background-color: rgba(0,0,0,.7) !important;
}
.app-form-field-media-item .controls {
    order: 0;
    position: relative;
    top: 0;
    padding: 1rem;
    margin: 0;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
}
.app-form-field-media-item .controls .select-files label {
    padding-left:.5rem;
}
.app-form-field-media-item .controls .select-folder label {
    padding-left:.5rem;
}
.library-group-wizard-preview {

}


.select-section-item {
    /* height: fit-content; */
    display: flex;
    flex-direction: column;
    position: relative;
    padding: 1.5rem 1rem;
    padding-right: 0px;
    background-color: transparent;
    transition: none;
    align-items: flex-start !important;
    margin-bottom: 0rem;
    border-bottom: solid 1px rgba(100,100,100,.3);
    margin-left: 1rem;
    margin-right: 1rem;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: .5rem;
    padding-top: 0.5rem;
    flex:1;
}
    .select-section-item .align-items-center {
        align-items: flex-start !important;
    }
    .select-section-item .app-navigation-icon {
        min-width: 250px;
        min-height: 140px !important;
        margin-left: 0.5rem;
        margin-right: 0.5rem;
        min-height: 80px;
        box-shadow: 0 1px 2px rgb(0 0 0 / 7%), 0 2px 4px rgb(0 0 0 / 7%), 0 4px 8px rgb(0 0 0 / 7%), 0 8px 16px rgb(0 0 0 / 7%), 0 16px 32px rgb(0 0 0 / 7%), 0 32px 64px rgb(0 0 0 / 7%);
        border: solid 1px rgba(100,100,100,.3);
        border-radius: 5px;
        overflow: hidden;
        background-size: cover;
    }
.app-navigation-item.select-section-item a {
    width: 100%;
    justify-content: flex-start;
    border-radius: 5px;
}
.app-navigation-item.select-section-item .app-data {
    flex: 1;
    padding-left: 1rem;
}
.app-navigation-item.select-section-item a .app-navigation-icon > .app-image {
    object-fit: contain !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 3;
    transition: .3s;
    max-width: unset;
    max-height: unset;
}
.app-navigation-item.select-section-item a label {
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    font-size: 1.6rem;
    padding: 0.5rem 0rem;
    flex: 1;
    padding-top: 0;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    padding-bottom: 0px;
}

.app-navigation-item.select-section-item a .app-description {
    display: flex;
    flex-direction: column;
    text-align: left;
    /* width: 100%; */
    padding: 1rem 2rem;
    padding-bottom: 0.7rem;
    padding-top: 0.2rem;
    color: whitesmoke;
    /* font-weight: bold; */
    /* font-size: 0.2rem; */
    margin-left: 1px;
    white-space: normal;
    padding: 0;
    margin: 0;
    line-height: 1.4;
    padding-top: 5px;
    font-size: 1.2rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
}

.form-window.select-projectLayout-view {
    z-index:6102;
}

.section-banner .body-header h1 .app-form-field-textarea textarea {
    text-align: center;
    font-weight: bold;
    font-size: 4rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    position: relative;
    top: -.8rem;
    line-height: normal;
}
.section-banner .body-header h2 .app-form-field-textarea textarea {
    text-align: center;
    font-weight: bold;
    font-size: 3.2rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    position: relative;
    top: -.8rem;
    line-height: normal;
}

.dmsProjectLibraryMetadataEventScheduleController {
    padding-top:1rem;
    padding-left:0px;
    position:relative;
    padding-bottom:15px;
}
.dmsProjectLibraryMetadataEventScheduleController .header {
    display:flex;
}
.dmsProjectLibraryMetadataEventScheduleController .title {
    flex:1;
    padding-bottom: 5px;
    padding-left: 3px;
    user-select: none;
    padding-left: 3px;
    text-transform: uppercase;
    font-size: .7rem !important;
    font-weight: 500;
    white-space: nowrap;
    color:white;
    transition:.2s;
}
.dmsProjectLibraryMetadataEventScheduleController.disabled .title {
    color:whitesmoke;
    opacity: .7 !important;
}
.dmsProjectLibraryMetadataEventScheduleController .delete-button {
    flex:1;
    background-color: firebrick;
    border: solid 1px red;
    border-radius: 5px;
    padding: 1px 7px;
    flex: 0;
    height: fit-content;
    position:relative;
    top:4px;
    min-width:32px;
    min-height:32px;
}
.dmsProjectLibraryMetadataEventScheduleController .delete-button i {
    position:relative;
    top:1px;
}
.dmsProjectLibraryMetadataEventScheduleController .copy-button {
    flex:1;
    background-color: #0d6efd;
    border: solid 1px deepskyblue;
    border-radius: 5px;
    padding: 1px 7px;
    flex: 0;
    height: fit-content;
    position:relative;
    top:4px;
    margin-left: .25rem;
    margin-right: .25rem;
    min-width:32px;
    min-height:32px;
}
.dmsProjectLibraryMetadataEventScheduleController .copy-button i {
    position:relative;
    top:1px;
}
.dmsProjectLibraryMetadataEventScheduleController .edit-button {
    flex:1;
    background-color: #0d6efd;
    border: solid 1px deepskyblue;
    border-radius: 5px;
    padding: 1px 7px;
    flex: 0;
    height: fit-content;
    position:relative;
    top:4px;
    margin-left: .25rem;
    min-width:32px;
    min-height:32px;
}
.dmsProjectLibraryMetadataEventScheduleController .edit-button i {
    position:relative;
    top:1px;
}
.dmsProjectLibraryMetadataEventScheduleController .header .add-button {
    position: absolute;
    right: 5px;
    top: -16px !important;
}
.dmsProjectLibraryMetadataEventScheduleController .items {
    border: solid 1px #444;
    color: whitesmoke;
    background-color: transparent;
    padding: 0.5rem;
    border-radius: 6px;
    font-size: 1.1rem;
    min-height: 40px;
    transition:.2s;
}
.dmsProjectLibraryMetadataEventScheduleController.disabled .items {
    background: rgba(100, 100, 100, .1);    
}
.dmsProjectLibraryMetadataEventItemController {
    display:flex;
    align-items:center;
}
.dmsProjectLibraryMetadataEventItemController > div {
    padding-right:7px;
}
.dmsProjectLibraryMetadataEventItemController .app-form-field-datetime {        
    max-width: 300px;
}
.dmsProjectLibraryMetadataEventItemController .app-form-field-select {   
    max-width: 350px;
}
.app-form-field-map {
    width:100%;
    height:200px;
}
.pac-container {
    z-index: 99000 !important;
    display: block !important;
}
body.dark-mode input[type=time] {
    padding: .45rem !important;
}
body.dark-mode input[type=datetime-local] {
    padding: .45rem !important;
}
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
    color: whitesmoke;
}
.dmsProjectLibraryMetadataEventItemController .drop-down .selected-item {
    border: solid 1px #444;
    background-color: transparent;
}


.section-content.has-video .drop-target, .section-content.has-image .drop-target {
    border-style: none;
    padding: 0;
    margin: 0;
}

.card-event .drop-container {
    display: block;
    z-index: 10;
    color: whitesmoke;
}

.card-event .drop-container,
.dms-on-demand .drop-container,
.section-content .drop-container {
    height: 100%;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: absolute;
    /* background-color: red; */
    z-index: 1;
    top: 0;
    right: 0;
    left: 0;
    padding: 3rem;
    display: none;
    top: -1rem;
    padding: 1.5rem;
    display:none;
}
body.can-edit .card-event .drop-container.show,
body.can-edit .dms-on-demand .drop-container.show,
body.can-edit .section-content .drop-container.show {
    display: block;
}
.card-event .drop-container .spacer-header-ex,
.dms-on-demand .drop-container .spacer-header-ex,
.section-content .drop-container .spacer-header-ex {
    font-size: 1rem;
}
.card-event .drop-container.has-video .spacer-header-ex,
.dms-on-demand .drop-container.has-video .spacer-header-ex,
.section-content .drop-container.has-video .spacer-header-ex {
    display: none;
}
.has-images .card-event .drop-container,
.has-images .dms-on-demand .drop-container,
.has-images .section-content .drop-container {
    position: absolute;
    left: 0;
    top: -10px;
    right: 0;
    bottom: 0;
    z-index: 5;
}
.has-images .card-event .spacer-header-ex,
.has-images .dms-on-demand .spacer-header-ex,
.has-images .section-content .spacer-header-ex {
    display: none;
}
.card-event .drop-target,
.dms-on-demand .drop-target,
.section-content .drop-target {
    height: 100%;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    border-color: white;
    border: solid;
    /*margin: 1rem;
    padding: 1rem;*/
    border-style: dashed;
}
.has-images .card-event .drop-target,
.has-images .dms-on-demand .drop-target,
.has-images .section-content .drop-target {
    background-color: rgba(0,0,0,.7) !important;
}

.section-video .logo input {
    text-align: center;
    font-size: 4rem !important;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    position: relative;
    top: 0rem;
}

.section-video .title input {
    text-align: center;
    font-weight: bold;
    font-size: 3.6rem !important;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    position: relative;
    top: 0rem;
}


.section-video .card-message textarea {
    text-align: center;
    font-weight: bold;
    font-size: 3.2rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    position: relative;
    top: -1.5rem;
    min-height: 200px;
}

.section-video .card-message-ex textarea {
    text-align: center;
    font-size: 2.2rem;
    text-shadow: -1px 1px 2px rgb(0 0 0);
    text-shadow: 0px 1px 1px rgb(0 0 0);
    position: relative;
    top: -1.5rem;
    min-height: 400px;
}

.section-products .title h1 textarea {
    text-align: center;
    font-weight: bold;
    font-size: 3.4rem;
    position: relative;
    top: -.5rem;
}

.section-collect-email .title textarea {
    text-align: center;
    font-weight: bold;
    font-size: 3rem;
    color: black !important;
    position: relative;
    top: .1rem;
    min-height: 150px;
}

.section-collect-email .message textarea {
    text-align: center;
    font-size: 1.6rem;
    color: black !important;
    position: relative;
    top: .1rem;
    min-height: 100px;
}

.header-ex .logo input {
    font-size: 1.3rem !important;
    position: relative;
    top: 0rem;
   /* text-transform:uppercase;*/
}

.footer .app-form-field-text {
}
.footer .contact-email input {
    font-size: 1rem !important;
    min-width: 300px;
    text-align: right;
}
.footer .contact-phone input {
    font-size: 1rem !important;
    min-width: 300px;
    text-align: right;
}

.card-event .card-title .app-form-field-input {
    font-weight: bold;
    font-size: 2rem;
    position: relative;
    top: -.1rem;
}
.card-event .card-text1 .app-form-field-input {
    font-size: 2rem;
    position: relative;
    top: -.1rem;
    font-weight: 500;
    font-size: 1.8rem;
}
.card-event .card-text2 .app-form-field-input {
    font-size: 2rem;
    position: relative;
    top: -.1rem;
    font-weight: 500;
    font-size: 1.4rem;
    color: #FFAB15 !important;
}
.card-event .card-text3 .app-form-field-input {
    font-size: 2rem;
    position: relative;
    top: -.1rem;
    font-weight: 500;
    font-size: 1.4rem;
    color: #FFAB15 !important;
}
.card-event .card-text4 .app-form-field-input {
    font-size: 2rem;
    position: relative;
    top: -.1rem;
    font-weight: 500;
    font-size: 1.4rem;
    color: #FFAB15 !important;
}
.card-event .card-price .app-form-field-input {
    font-size: 2rem;
    position: relative;
    top: -.1rem;
}

.section-products .products .card-body .card-edit-date input {
    font-weight: 500 !important;
    font-size: 1.4rem !important;
    color: #FFAB15 !important;
}

#metadata-section .app-form-field.description,
#metadata-section .app-form-field.tagline {
    font-size: 2rem;
}
.app-form-field-media-item .library-group {
    width: 100% !important;
    height: 100% !important;
    cursor:default !important;
}
.app-form-field-media-item .library-group .image {
    width: 100% !important;
    height: 100% !important;
}
.app-form-field-media-item .library-group img {
    max-width:unset !important;
    max-height: unset !important;
}

.app-data-info {
    display: flex;
    align-items: center;
}

.form-window-body .drop-down .items .item {
    opacity:.9;
}

.app-view.channel-fields .app-form-header .app-form-image-container.has-image img,
.app-view.playlist-fields .app-form-header .app-form-image-container.has-image img {
    box-shadow: none;
}

.project-layout-page-info.has-image .project-layout-page-title .app-form-field-input {
    font-size: 2.2rem;
    font-weight: 900;
}
.project-layout-page-info.has-image .project-layout-page-message .app-form-field-input {
    font-size: 2rem;
}

.dms-on-demand.admin-screen .dms-on-demand-actions .dms-on-demand-form-close {
    margin-left: 1.5rem;
}

.app-form-div.label6 {
    padding-top: 7px;
    display: flex;
    z-index: 1;
    position: relative;
    left: 0px;
    align-items:center;
}
.app-form-div.label6.pad-top {
    padding-top: 0px;
    padding-bottom: 3px;
}
.app-form-div.label6 > div {
    margin-right:.5rem;    
}
.app-form-div.label6 > button {
    margin-right:.25rem;       
    text-shadow: -1px 1px 2px rgba(0, 0, 0, .3);
}


.app-tab-view.product .app-form-field-image-container .app-form-field-img {
    object-fit:contain;
}

.media-fields .app-tab-view.description textarea,
.media-fields .app-tab-view.tagline textarea {
    font-size: 1.4rem;
    line-height: 1.4;
}
.media-fields .app-tab-view.preview .preview-container {
    margin-bottom:0 !important;
    overflow:hidden;
}

.form-window-content .media-status-search-input {
    margin-right: 1rem;
    font-size: 1rem;
    margin-top: 0;
    margin-bottom: 0rem;
    position: relative;
    top: -2px;
}
.form-window-content .media-status-search-input input {
    font-size: 1.2rem !important;
}
.list-view-group-item-duration {
    position: absolute;
    right: 1rem;
    bottom: 0.5rem;
    padding: 0.25rem 0.75rem;
    background-color: rgb(0,0,0,.7);
    color: white;
    height: fit-content;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 1;
    border-radius: 6px;
}
/*.app-form-field-media-item .video-container {
    width: 100%;
    height: 100%;
}*/

/*.app-form-field-media-item .drop-container .spacer-header-ex {
    margin-left:1rem;
}
*/
.app-form-field-input.colorpicker {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-left:none !important;
}
.app-form-field-color .sp-original-input-container .sp-add-on {
    border-top-left-radius: 6px !important;
    border-bottom-left-radius: 6px !important;
    border: solid 1px #444;
    border-right: none;
    overflow: hidden;
}
.app-form-field-color .sp-original-input-container .sp-add-on .sp-colorize {
    border-radius: 1px !important;
    border-color: #444;
}
.app-form-field-color.focused .sp-original-input-container .sp-add-on {
    border-color: #0d6efd !important;
}
.project-layout-menu-buttons > button {
    font-size: .6rem;
}
.project-layout-menu-buttons .material-icons {
    font-size: 23px;
}
.form-window .form-window-content {
    font-family: "Montserrat"
}
.project-layout-menu-buttons > button i.fa,
.project-layout-menu-buttons > button i.fad {
    font-size: 18px;
    margin-bottom: 3px;
}

.select-section-item .app-navigation-icon {
    min-width: 250px;
    min-height: 162px !important;
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    box-shadow: none;
    border: none;
    overflow: visible;
    background-size: contain;
    background-repeat: no-repeat;
}
.form-window .form-window-content .content > .container > section ul {
    padding: 0;
}
body.dark-mode .form-window-content .form-window-footer {
    border-color: rgba(100, 100, 100, .3);
}
.subsection.media-item-types .app-navigation-item > .app-anchor.selected .app-data-info .app-button {
    border-color: #0d6efd;
}
.form-window-content .app-navigation-item .button-delete .material-icons {
    font-weight: 700;
}
.form-window-content .app-navigation-item .selected .btn.text-info,
.form-window-content .app-navigation-item .selected .btn.text-danger {
    color: white !important;
}
.form-window-footer .app-icons i.material-icons {
    font-size: 1.4rem !important;
}
.form-window-body .drop-down .items {
    width: 100% !important;
}
.form-window-body .app-form-field.form-check .app-form-field-label {
    padding-left: 8px;
    margin-left: -2px;
}
.app-form-field.form-check .app-form-field-label {
    cursor:pointer;
}
.form-window-body .app-form-field.form-switch .app-form-field-label {
    padding-left: 0.5rem;
}
.drop-down .selected-item {
    min-height: 44px;
}
.form-window-body .drop-down .selected-item {
    border-color: #444 !important;
}
.form-window-body .app-navigation-item > a .app-label {
    margin-left: 0rem !important;
}
.form-window-body .subsection header > .form-check .custom-checkbox {
    top: -16px;
    margin-left: 0px;
}
.form-window-body .subsection.media-item-types .app-navigation-item > .app-anchor > .form-check > .custom-checkbox {
    top: -4px;
}
.form-window-body .subsection header > .app-form-field.form-check .app-form-field-label {
    margin-left: -7px;
}
.form-window-body .project-quick-access-subitem-icons i.material-icons {
    font-size: 24px !important;
    top: 3px;
}
.form-window-body .no-spinner .app-navigation-item > a .app-navigation-spinner {
    margin: 0;
}
.form-window-body .project-quick-access-subitem-icons {
    margin-right: 0.5rem;
}
.form-window-body .subsection .app-navigation-subitems .app-navigation-item > a {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}
.form-window-body a.selected .project-quick-access-subitem-icons .delete-icon-button {
    color: white !important;
}
.form-window-body .app-navigation-item > a .app-label {
    font-size: 1.2rem;
}
.form-window-body .project-layout-menu .form-window-content {
    box-shadow: none !important
}

.navbar-usage-container-ex {
    align-items: center;
    justify-content: center;
    text-align: center;
}
.navbar-usage-container-ex .navbar-usage-info {
    display: flex;
    /* flex-direction: column; */
    align-items: center;
    justify-content: center;
}
.navbar-usage-container-ex .navbar-usage-item {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
    text-align: center;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
}
.navbar-usage-container-ex .navbar-usage-label {
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: center;
    align-items: center;
}
.navbar-usage-container-ex .navbar-usage-item span,
.navbar-usage-container-ex .navbar-usage-item i {
    padding: 0 !important;
    margin: 0 !important;
    width: fit-content;
    font-size:.6rem !important;
    padding-bottom: 2px !important;
}
.navbar-usage-container-ex .navbar-usage-bar {    
    width: 8px;
    height: 100px;
}
.navbar-usage-container-ex .navbar-usage-bar-used,
.navbar-usage-container-ex .navbar-usage-bar-available {  
    width: 8px;
}

.drop-container .delete-icon-button {
    position: absolute;
    right: 0.5rem;
    top: 0.5rem;
    color: red;
    font-weight: 600;
    display:none;
}
.drop-container.has-video .drop-container .delete-icon-button {
    display: block;
}
.drop-container.has-help .drop-container .delete-icon-button {
    display: none !important;
}
.drop-container.no-delete .drop-container .delete-icon-button {
    display: none !important;
}

#metadata-section .search-section.smart-filter .app-form-body {
    padding-bottom:10rem !important;
}

.app-form-field-time-container {
    position:relative;
}
.app-form-field-date-container i,
.app-form-field-time-container i {
    padding: 0.25rem;
    padding-left: 0.75rem;
}
.app-form-field.disabled .app-form-field-date-container i,
.app-form-field.disabled .app-form-field-time-container i {
    opacity: .7 !important;
}
.app-form-field-date-container,
.app-form-field-time-container {
    border: 1px solid rgba(100, 100, 100, .3);
    border-radius: 5px;
    padding: 0 0.5rem;
    margin-right: 0.5rem;
    margin-left: 0.5rem;
    /* background-color: rgba(0, 0, 0, .2); */
    position: relative;
    top: 2px;
    transition: .3s;
    /* width: 20rem; */
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    /* background-color: rgb(0, 0, 0, .3) !important; */
    margin: 0;
    margin-top: 0.75rem;
    margin-bottom: 1.25rem;
    border-color: rgba(100, 100, 100, .5) !important;
    padding-left: 0.75rem;
    margin-right: 0.5rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 0px;
    margin: 0px;
    top: 0px;
}
.app-tab-view.metadata .app-form-field-date,
.app-tab-view.metadata .app-form-field-time {
    max-width:unset;
}
body.dark-mode .app-form-field-label {
    color: white !important;
    transition: .2s;
}
body.dark-mode .light-mode .app-form-field-label {
    color: black !important;
}
.app-form-field-label {
    padding-bottom: 5px;
    padding-left: 3px;
    user-select: none;
    padding-left: 3px;
    text-transform: uppercase;
    font-size: .7rem !important;
    font-weight: 500;
    white-space: nowrap;
}
/*.app-form-field {
    display: flex;
    flex-direction: column;
    padding: 0.5rem 0;
    padding-top: 0;
    padding-bottom: 0.7rem;
    flex: 1;
    position: relative;
}*/
.app-form-fields .app-form-field.form-check {
    margin-bottom: 0.5rem !important;
}
.app-form-field-input.datepicker {
    border:none !important;
}
.app-form-field.useSubtitleDelay,
.app-form-field.subtitleDelay {
    padding-left: 0.75rem !important;
}
#playerControls.trim-time {
    position: relative;
    background: unset;
    padding-top: 0rem;
    padding-bottom: 0.5rem;
}
.app-form-fields .app-form-field.form-check.add-padding {
    padding-left: .75rem !important;
}

.subsection.media-item-body .app-tab-view {
    flex: 1;
    display: flex;
    flex-direction: column;
}
.subsection.media-item-body .app-tab-view .app-form-field.aiImage {
    width: 100%;
    flex: 2;
}
.subsection.media-item-body .app-tab-view .app-form-field.aiModel {
    flex: 0;
}
.app-action-buttons {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 0rem 1rem;
    padding-bottom: 0.5rem;
}

.ai-text-options {
    margin: 0 .1rem;
}
.app-form-field-textarea.aiImage textarea:disabled,
.app-form-field-textarea.aiImage textarea:read-only {
    color: white !important;
    border: solid 1px #444 !important;
    border: solid 1px rgba(100, 100, 100, .5) !important;
    background-color: transparent !important;
}
.app-form-field.ai-max-tokens {
    margin: 0 .5rem;
}
.app-form-field.ai-temperature {
    margin: 0 .5rem;
}
.app-form-field.ai-topP {
    margin: 0 .5rem;
}
.app-form-field.ai-topK {
    margin: 0 .5rem;
}
.app-form-field .info-control {
    font-size: .7rem;
    line-height: 0px;
    max-height: 0px !important;
    position: relative;
    top: 6px;
}
.form-check.useTrimTime .trimStartTime {
    margin-right: 1rem;
    margin-left: 1.5rem;
    max-width: 150px;
}
.form-check.useTrimTime .trimEndTime {
    max-width: 150px;
}
.video-preview-container.trim-time {
    background-color: rgba(0, 0, 0, .8) !important;
}
.subsection.media-item-body .page {
    padding: .5rem;
    padding-top: .25rem;
    font-size: 1.3rem;
}
.subsection.media-item-body .page .page-message {
    color: whitesmoke;
}
.subsection.media-item-body .page .page-options {
    padding-top: 1rem;
}
.app-form-field.form-radio .custom-checkbox .checkmark {
    border-radius: 50%;
}
.subsection.media-item-body .page .page-options .form-radio .app-form-field-label {
    margin: 0;
    font-size: 1rem !important;
    text-transform: none;
    color: inherit !important;
}
.app-form-fields .app-form-field.form-check.useTrimTime .app-button-icon {
    margin-left:1rem;
    padding:.5rem 1rem;
}
.page-position-container {
    display: flex;
    color:whitesmoke;
}
.page-position-container .page-position-label {
    padding-right: .5rem;
}
.subsection.media-item-body .page .page-options .app-button.play,
.subsection.media-item-body .page .page-options .app-button.pause {
    color: whitesmoke;
}
/*#playerControls.trim-time #position-level-buffer {
    display:none;
}*/
.app-view.app-tab-view.trailer #MediaTrimTimeWindow {
    width: 410px;
    position: absolute;
    top: 0;
    bottom: 0;
    height: calc(100% + 14px);
    z-index: 5;
    left: -500px;
    transition: .2s;
    border-radius: 0;
    margin-left: -8px;
    margin-top: 0px;
    background-color: transparent !important;
    text-align: left;
}
.app-view.app-tab-view.trailer #MediaTrimTimeWindow.show {
    left: 0;
}
.app-view.app-tab-view.trailer .app-form-field-media .app-form-field-media-item {
    overflow: hidden;
}
.subsection.media-item-body .page .page-options .form-radio .app-form-field-label {
    white-space: normal !important;
}
.app-form-field-media-item .drop-container .drop-target {
    left:0px;
    transition:.2s;
}
.MediaEventScheduleWindow .app-form-field-media-item .drop-container .drop-target .video-background {
    background-color: black;
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}
.app-form-field-media-item .drop-container .drop-target .video-container {
    display: none;
    position: initial;
}
.app-form-field-media-item .drop-container.has-video .drop-target .video-container {
    display: flex;
}
.app-form-field-media-item .drop-container.has-video.can-show-help .drop-target {
    left: 0rem;
    position: absolute;
    right: 0rem;
}
.app-form-field-media-item .drop-container.has-video.has-help .drop-target {
    left: 410px;
}
.subsection.media-item-body .page .page-options.center {
    text-align:center;
}
.subsection.media-item-body .page .page-options.center .btn.play i.material-icons,
.subsection.media-item-body .page .page-options.center .btn.pause i.material-icons {
    font-size: 8rem;
}
.page-position-container.large {
    font-size: 2rem;
    padding-top: 2rem;
}
.subsection.media-item-body .page .page-options .app-form-field.form-check {
    margin-bottom: 0rem !important;
}

@media only screen and (max-width: 1900px) {

    .subsection.media-item-body .page .page-options.center .btn.play i.material-icons,
    .subsection.media-item-body .page .page-options.center .btn.pause i.material-icons {
        font-size: 5rem;
    }
    .page-position-container.large {
        font-size: 1.4rem;
        padding-top: 1.5rem;
    }
}

.app-view.app-tab-view.trailer #MediaTrimTimeWindow .form-window-header {
    display: none;
}
.app-view.app-tab-view.trailer #MediaTrimTimeWindow > .content {
    margin-top: 1rem !important;
}
#player-events {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    bottom: 0;
    z-index: 601;
    transition: .2s;
    display:none;
}
.preview-player-events-icon-button {
    position: absolute;
    opacity:.3;
}
.preview-player-events-icon-button .material-icons {
    font-size:16px !important;
}
.preview-player-events-icon-button:hover,
.preview-player-events-icon-button:focus {
    opacity: .7 !important;
}
.project-layout .form-window-fields-section

.preview-container.show-player-events .preview-player-events-icon-button {
    opacity: 1;
}
.preview-player-events-data {
    background-color: transparent;
    width: 100%;
    height: 100%;
    flex: 1;
    overflow: hidden;
    padding: .5rem;
}
.preview-container.show-player-events .preview-player-events-data {
    background-color: black;
}
.preview-container.show-player-events #player-events {
    width: 20rem;
    opacity: 1;
}
.preview-container #player {
    transition: .2s;
    width: 100%;
}
.preview-container.show-player-events #player {
    left: 20rem;
    width: calc(100% - 20rem);
}
.preview-player-events-data.project-layout .form-window-fields-section.slim-header {
    padding-top: 1rem;
    display:none;
}
.preview-container.show-player-events .preview-player-events-data.project-layout .form-window-fields-section.slim-header {
    display: block;
}
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .subsection-header header > label {
    white-space:nowrap;
}
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .select-project-item.app-navigation-item > a .app-label {
    font-size: 1rem;
}
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .select-project-item.app-navigation-item > a .app-navigation-spinner {
    display: none;
}
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .subsection.media-item-types .app-navigation-item > .app-anchor {
    transition: .2s;
    outline: none;
    border: none !important;
    flex-wrap: nowrap;
}
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .subsection.media-item-types .app-navigation-item > .app-anchor:hover,
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .subsection.media-item-types .app-navigation-item > .app-anchor:focus, {
    border:none !important;
}
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .app-navigation-item > a:hover,
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .app-navigation-item.select > a,
.preview-player-events-data.project-layout .form-window-fields-section.slim-header .app-navigation-item.selected > a {
    background-color: rgba(200, 200, 200, 0.2);
}
.preview-player-events-data.project-layout .form-window-fields-section-body .library header {
    margin-right: 2px;
}

.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body {
    flex-direction: row;
}

.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-options {
     min-width: 30rem;  
    max-width: 30rem;  
    padding: .5rem;
    padding-right: 2rem; 
    overflow: auto;
    padding-bottom: 20rem;
}

.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-preview{
    padding: 1rem;
    display: flex;
    flex-direction: column;
    width: 100%;
    overflow:hidden;
}
.PlayerInteractiveWindow .app-form-field-image-container .app-form-field-img {
    max-width:20rem;
    object-fit:contain !important;
}
.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-video {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    pointer-events: none;
    transition: 1s;
    -o-transition: 1s;
    -webkit-transition: 1s;
}
.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-video.show {
    opacity: 1;
}
.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-video a {
    padding: 1rem;
    color:white;
    font-size:2rem;
    color: #FFAB15 !important;
}
.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-preview-button {
    position: absolute;
    color: white;
}
.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-preview-button .material-icons {
    font-size:3rem;
}
.PlayerInteractiveWindow .form-window-content .content > .container > section > .media-item-body .interactive-preview-play-position {
    padding: .5rem;
    font-size: 1.4rem;
}

.form-window .form-window-content .content > .container > section > .subsection > header.header {
    display: none !important;
}
.form-window .form-window-content .content > .container {
    padding: 0rem 1rem;
    padding-bottom: 1rem;
}
/*
    TODO: add this back in
body.can-edit.edit-layout .editable-content {
    border: solid 0px transparent;
    transition: .2s;
    padding: 0rem;
}
body.can-edit.edit-layout .editable-content.focused {
    padding: .5rem;
    border-color: #0d6efd;
    border-style: dashed;
    border-width: 6px;
}
body.can-edit.edit-layout .editable-content:hover {
    transition-delay: .3s;
    padding: .5rem;
    border-color: #0d6efd;
    border-style: dashed;
    border-width: 6px;
    cursor: text;
}
*/
.section-products .products .title {
    position: relative;
    left: 0;
    transition: .2s;
    text-align: center;
}
/*body.can-edit.edit-layout .section-products .products .title {
    left: 3.5rem;
}*/

body.mobile-size .dms-on-demand.project-base-screen {
    width: 428px;
    max-width: 428px;
}

.app-form-container.schedule-container .schedule-date-container {
    display:flex;
 /*   padding-bottom:1rem;*/
}
.app-form-container.schedule-container .app-form-field-date:first-of-type {
    margin-right:1rem;
}

body.dark-mode .app-form-field-date-container input.datepicker[disabled], body.dark-mode .app-form-field-date-container input.datepicker[readonly],
body.dark-mode .app-form-field-time-container input[disabled], body.dark-mode .app-form-field-time-container input[disabled] {
    background-color: unset;
}
.app-form-field-time-container .app-form-field-input {
    border: none !important;
}

body.dark-mode .app-form-field-date.disabled .app-form-field-date-container,
body.dark-mode .app-form-field-time.disabled .app-form-field-time-container {
    background: rgba(33, 37, 41, .3);
    background: rgba(100, 100, 100, .1);
}
body.dark-mode .btn-dark.disabled {
    background: rgba(100, 100, 100, .1);
}
.app-form-div.label6 > button.needs-approval {
    margin-left: .3rem !important;
    color: #FFAB15 !important;
}
.app-form-div.label6 > button.needs-approval i {
    font-size: 19px !important;
}
.app-view .app-form-container.app-form-actions {
    padding-bottom:.5rem;
}
.app-tab-view .app-form-field-image-container .app-form-field-img {
    /*THIS IS BEING DONE BECAUSE THE DISPLAYED IMAGE IS DISTORTED IF TOO SMALL AND GIVES BAD IMPRESSION*/
    /*object-fit: none;*/
    /*UNDOING AGAIN BECAUSE IMAGES THAT ARE LARGER THAN AVAILABLE SIZE ARE BEING CUT OFF*/
}
.app-tab-view .app-form-field.app-form-field-textarea.comments .app-form-field-input {
    min-height: 85px;
    padding-top: .5rem !important;
    padding-bottom: .5rem !important;
}
.upload-section-file-buttons .btn.text-info {
    margin-right:.5rem !important;
}
.app-view .app-label-span.app-form-field-descriptioneventChannelState,
.app-view .app-label-span.app-form-field-descriptioneventChannelUrl,
.app-view .app-label-span.app-form-field-descriptioneventChannelKey {
    padding: 0 0.25rem;
    padding-top: .0rem;
    padding-bottom: .0rem;
}
.app-view .app-label-span.app-form-field-descriptioneventChannelState {
    padding-top: .5rem;
}
.app-view .app-label-span.app-form-field-descriptioneventChannelUrl {
    padding-top: .25rem;
}
.app-view .app-label-span.app-form-field-descriptioneventChannelKey {
    padding-top: .25rem;
    padding-bottom: .5rem;
}

.app-form-field-time-menu {
    position: absolute;
    box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .5);
    color: #fff;
    background: inherit;
    border: 1px solid rgba(100, 100, 100, .3);
    top: 45px;
    z-index: 5;
    display: flex;
    max-height: 250px;
    overflow: hidden;
}
.app-form-field-time-menu-items {
    display: flex;
    flex-direction: column;
    max-height: 250px;
    overflow-y: auto;
    overflow-x: hidden;
}
/*.app-form-field-time-menu-items.time-zones {
    display: none;
}*/
.app-form-field-time-menu-item {
    padding: .25rem .75rem;
    border: solid 1px transparent;
    border-radius: 6px;
}
.app-form-field-time-menu-item.selected {
    background-color: #0d6efd !important;
    border-color: #0d6efd;
}
.app-label-span .copy-button {
    margin-left:.5rem;
}
.app-form-fields .app-tab-view.mediaApprovals .app-form-field.form-check {
    flex:1;
}

#metadata-section .app-action-content-buttons {
    position: absolute;
    top: -3px;
    right: 10rem;
}
#metadata-section .app-action-content-buttons .app-group-content-button-label  {
    text-transform: uppercase;
    font-size: .7rem;
}
#metadata-section .app-action-content-buttons .app-group-content-button:last-of-type,
#metadata-section .app-action-content-buttons .app-group-content-button:first-of-type {
    border-top-left-radius:0 !important;
    border-top-right-radius:0 !important;
}
#metadata-section .app-action-content-buttons .app-group-content-button {
    opacity: .7;
    transition:.2s;
}
#metadata-section .app-action-content-buttons .app-group-content-button:hover,
#metadata-section .app-action-content-buttons .app-group-content-button:focus {
    opacity: 1;
    background-color: #0069D9;
    border-color: #0069D9;
}
#metadata-section .app-action-content-buttons .app-group-content-button:active {
    opacity: .9;
    background-color: #0069D9;
    border-color: #0069D9;
}
#metadata-section .app-action-content-buttons .app-group-content-button i {
    margin-right:.25rem;
}

#metadata-section .summary.event-summary {
    height: 100%;
    display: flex;
    flex-direction: column;
}
#metadata-section .app-form-container.event-preview {
    background-color: black;
    text-align: center;
    margin: .5rem;
    flex: 1;
    object-fit: contain;
    position: relative;
}
#metadata-section .app-form-container.event-preview .event-preview-status {
    width: 100%;
    height: 100%;
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events:none;
    z-index:10;
}
#metadata-section .app-form-container.event-preview .event-preview-status-progress-state { 
    font-size: 1.4rem;
}
#metadata-section .app-form-container.event-preview .event-preview-status-progress #playerBufferInfo { 
    display: flex;
    position: unset;
}
#metadata-section .app-form-container.event-preview .event-preview-status-progress #playerBufferInfo .player-buffering { 
    width: 95%;
    overflow: hidden;
}

#metadata-section .app-form-container.event-preview .event-preview-status-delay {
    position: absolute;
    right: .5rem;
    top: .25rem;
    font-size: .9rem;
    /* z-index: 10;*/
    opacity: .8;
}
#metadata-section .app-form-container.event-preview video {
    object-fit: contain;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


.app-form-field-date-container {
    border: 1px solid rgba(100,100,100, .3);
    border-radius: 5px;
    padding: 0 0.5rem;
    margin-right: 0.5rem;
    margin-left: 0.5rem;
    /* background-color: rgba(0,0,0,.2);*/
    position: relative;
    top: 2px;
    transition: .3s;
    /*  width: 20rem;*/
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    /*background-color: rgb(0,0,0,.3) !important;*/
    margin: 0;
    margin-top: 0.75rem;
    margin-bottom: 1.25rem;
    border-color: rgba(100,100,100,.5) !important;
    padding-left: 0.75rem;
    margin-right: 0.5rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 0px;
    margin: 0px;
    top: 0px;
}
.app-form-field-date,
.app-form-field-time {
    max-width: 200px;
}
.app-form-body .app-form-field-date-container {
    max-width: unset;
}
.app-form-body .drop-down .selected-item {
    min-height: 44px;
   /* background-color: rgba(100, 100, 100, .1) !important;*/
}
.app-form-field-date-container input {
    border: none !important;
}
.app-form-field-date-container i {
    padding: 0.25rem;
    padding-left: 0.75rem;
}
.app-form-container.schedule-container {
    padding-top:.25rem;
}
.app-form-container.schedule-setup-ex .app-form-container.schedule-container {
    padding-top: 0rem;
}


.app-form-field-media-container {
    border: 1px solid rgba(100,100,100, .3);
    border-radius: 5px;
    padding: 0 0.5rem;
    margin-right: 0.5rem;
    margin-left: 0.5rem;
    /* background-color: rgba(0,0,0,.2);*/
    position: relative;
    top: 2px;
    transition: .3s;
    /*  width: 20rem;*/
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    /*background-color: rgb(0,0,0,.3) !important;*/
    margin: 0;
    margin-top: 0.75rem;
    margin-bottom: 1.25rem;
    border-color: rgba(100,100,100,.5) !important;
    padding-left: 0.75rem;
    margin-right: 0.5rem;
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    padding: 0px;
    margin: 0px;
    top: 0px;
    max-width: 200px;
    min-height: 44px;
    padding: .5rem;
}
.app-form-body .app-form-field-media-container {
    max-width: unset;
}

input[type=button].app-form-field-input,
button.app-form-field-input {
    text-align: left;
    align-items: flex-start;
}
input[type=button].app-form-field-input:focus,
button.app-form-field-input:focus {
    border-color: #e14eca;
    border-color: #0d6efd !important;
}
.app-form-field-date.focused .app-form-field-date-container,
.app-form-field-time.focused .app-form-field-time-container {
    border-color: #e14eca;
    border-color: #0d6efd !important;
}
.app-form-field-input.app-form-field-media-container {
}
.app-form-field-input.app-form-field-media-container .app-form-field-media-image-container {
    line-height: normal;
}
.app-form-field-input.app-form-field-media-container .app-form-field-media-image-container img {
    max-width:50px;
    max-height:20px;
}
.app-form-field-input.app-form-field-media-container .app-form-field-media-info-container {
    margin-left: .4rem;
    margin-right: .4rem;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 200px;
    overflow: hidden;
    text-align: left;
}
.MediaEventScheduleWindow .app-form-field {
    flex:unset;
}
.MediaEventScheduleWindow .media-event-schedule-fields {
    display:flex;
}
.MediaEventScheduleWindow .media-event-schedule-fields .app-form-field  {
    flex:1;
    margin-right:.5rem;
}
.MediaEventScheduleWindow .media-event-schedule-fields .app-form-field:last-of-type {
    margin-right:0;
}
.MediaEventScheduleWindow .MediaEventScheduleWindow-tabs {
    display:none;
}
.MediaEventScheduleWindow .action-buttons {
    padding: .25rem 0;
}
.MediaEventScheduleWindow .summary.event-summary {
    height: 100%;
    display: flex;
    flex-direction: column;
}
.MediaEventScheduleWindow .app-form-container.event-preview {
    background-color: black;
    text-align: center;
    margin-top: .25rem;
    flex: 1;
    object-fit: contain;
    position: relative;
}
.MediaEventScheduleWindow  .app-form-container.event-preview .event-preview-status {
    width: 100%;
    height: 100%;
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    pointer-events:none;
    z-index:10;
}
.MediaEventScheduleWindow  .app-form-container.event-preview .event-preview-status-progress-state { 
    font-size: 1.4rem;
}
.MediaEventScheduleWindow  .app-form-container.event-preview .event-preview-status-progress #playerBufferInfo { 
    display: flex;
    position: unset;
}
.MediaEventScheduleWindow  .app-form-container.event-preview .event-preview-status-progress #playerBufferInfo .player-buffering { 
    width: 95%;
    overflow: hidden;
}
.MediaEventScheduleWindow  .app-form-container.event-preview .event-preview-status-delay {
    position: absolute;
    right: .5rem;
    top: .25rem;
    font-size: .9rem;
    /* z-index: 10;*/
    opacity: .8;
}
.MediaEventScheduleWindow  .app-form-container.event-preview video {
    object-fit: contain;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.list-view-group .list-view-group-item {
    line-height: normal;
}
.app-tab-view .app-form-field-media .app-form-field-autocomplete-selection {
    left: .5rem;
    right: .5rem;
}
.form-window .app-form-field-media .app-form-field-autocomplete-selection {
    max-height: unset !important;
    height: unset !important;
    min-height: 80%;
    left: 0rem;
    right: 0rem;
    top: 55px;
}
.form-window .media-field-search .form-window-content .content > .container {
    padding-left: 0rem;
    padding-right: 0rem;
}
.form-window #search-wrapper .media-item .media-info .small {
    font-size: .8rem;
}
.form-window #search-wrapper.no-items .section-header-info .showMoreLink {
    padding-left: .5rem;
}
/*.app-form-body #playerControls #position-container {
    margin-top: 1rem;
}*/
.app-form-fields .app-form-field.form-check.useTrimTime {
    display:none;
}
.app-view.trailer {
    padding-bottom: .25rem;
}
.app-form-fields .app-form-field.form-check.useSchedule {
    margin-bottom: 0 !important;
}
.dmsProjectLibraryMetadataEventItemController .app-form-field-date,
.dmsProjectLibraryMetadataEventItemController .app-form-field-time {
    flex: .3;
}
.app-form-field.app-form-field-autocomplete.app-form-field-media {
    flex: 1;
    overflow: hidden;
}
/*.app-form-field.app-form-field-autocomplete.app-form-field-media .app-form-field-media-item {
    background-color:black;
}*/

.player-start-event-now {
    position: absolute;
    z-index: 5000;
    top: 10.25rem;
    left: 1.8rem;
    display: none;
}
/*#player.preview .player-start-event-now {
    display:flex;
}*/

#metadata-section .app-form-field-input.app-form-field-media-container .app-form-live-status {
    position: relative;
    right: unset;
    bottom: unset;
    height: fit-content;
}
#metadata-section .app-form-field-input.app-form-field-media-container .app-form-live-status-indicator {
    margin-right: .5rem;
    height: .5rem;
    width: .5rem;
}
#metadata-section .app-form-field-input.app-form-field-media-container .app-form-live-status-label {
    font-size: 1rem;
}

.event-preview .event-preview-link {
    position: absolute;
    margin: .25rem;
    font-size: .8rem;
    text-decoration: underline;
    cursor: pointer;
    z-index: 100;
    display: none;
}

.player-start-event-now {
    display:none;
}
.player.show-access-code .player-start-event-now {
    display:flex;
}

#MediaEventWindow .app-form-container.schedule-setup {
    max-width: 60rem;
    width: 100%;
    padding-top: 0rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

#MediaEventWindow .app-form-container.schedule-setup.input-setup {
    max-width: 75rem;
    width: 100%;
    padding-top: 0rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

#MediaEventWindow .app-form-container.schedule-data .app-form-field {
    flex: unset;
}
#MediaEventWindow #metadata-section .summary.event-summary {
    height: 100%;
    display: flex;
    flex-direction: column;
}
#MediaEventWindow .app-form-container.schedule-data {
    flex: 1;
    display: flex;
    flex-direction: column;
}
/*#MediaEventWindow .app-view.app-tab-view.input {
    padding-top: 0;
}*/
#MediaEventWindow #metadata-section .app-form-container.event-preview {
    margin: .5rem 0;
}

.app-form-field.urlPath {
    max-width: 125px;
    width: 100px;
    min-width: unset;
}
.url-path-seperator {
    display: flex;
    align-items: center;
    margin-left: .5rem;
    margin-right: .5rem;
    font-size: 1.2rem;
    position: relative;
    top: 7px;
}

#ProjectUserWindow .app-form-header .app-form-image-container {
    min-width: 120px;
    min-height: 120px;
    border: solid 1px transparent;
    border-radius: 100%;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
}
#ProjectUserWindow  .app-form-header .app-form-image-container > div.app-form-initials {
    width: 100%;
    text-align: center;
    color: white;
    font-size: 2.6rem;
}
#ProjectUserWindow  .app-form-header .app-form-image-container > div.app-form-icon {
    display:none;
}


#MediaItemWindow #playerControls #position-level-container {
    position:relative;
}
#MediaItemWindow #playerControls #position-level-selector-lock {
    position: absolute;
    top: -2rem;
    left: -3px;
}
#MediaItemWindow #playerControls #position-level-container.locked {
    cursor: default;
    opacity: .8;
}
#MediaItemWindow #playerControls #position-level-container.locked button {
    cursor: default;
    opacity: .8;
}
#MediaItemWindow #playerControls #position-level-container.locked i {
    color: red;
}
#MediaItemWindow #playerControls #position-level-container.unlocked {
    opacity: 1;
    cursor: pointer;
}
#MediaItemWindow #playerControls #position-level-container.unlocked i {
    color: dodgerblue;
}
#MediaItemWindow .video-preview-container.trim-time {
    bottom: 160px;
}


/*#MediaItemWindow #playerControls #position-level-selector:focus {
    background-color: white !important;
    opacity: 1;*/
    /*transform: scale(1.4);*/
    /*transform: matrix(1.4, 0, 0, 1.4, 0, 0);
}
body:not(.mobile-device) #MediaItemWindow #playerControls #position-level-selector:hover {
    background-color: white;
    opacity: 1;
    transform: matrix(1.2, 0, 0, 1.2, 0, 0);
}
#MediaItemWindow #playerControls #position-level-selector.hide {
    display: none;
}

#MediaItemWindow #playerControls #position-level-selector:active {
    opacity: 1;
    background-color: white !important;*/
    /*border: solid 1px white;*/
/*}

#MediaItemWindow #playerControls #position-level-selector.select {
    opacity: 1;
    background-color: white !important;*/
    /*border: solid 1px white;*/
/*}*/