.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

.videoJSAttachmentPlayer-dimensions {
    width: 100% !important;
}

body
{
    color: #82848d;
    background: #31343f;
}

.btn:focus, .btn:active:focus, .btn.active:focus {
    outline: 0 none;
 }

.nav > li > a:hover, .nav > li > a:focus
{
    background-color: transparent;    
}

.nav-tabs > li > a:hover
{
    border-color: transparent;    
}

::selection
{
    background: #CCCCCC; /* WebKit/Blink Browsers */
}

::-moz-selection 
{
  background: #CCCCCC; /* Gecko Browsers */
}

/* scrollbars */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
    height: 0px;
    display: block;
    background-color: #21232a;
}

::-webkit-scrollbar-button:horizontal:start:decrement,
::-webkit-scrollbar-button:horizontal:end:increment {
    height: 0px;
    display: block;
    background-color: #21232a;
}

::-webkit-scrollbar-track-piece {
    background-color: #21232a;
}

::-webkit-scrollbar-thumb:vertical,
::-webkit-scrollbar-thumb:horizontal {
    background-color: #82848d;
    border: 1px solid #82848d;
    -webkit-border-radius: 0px;
}

/* navbar */

.navbar-brand
{
    padding: 10px 10px;
    line-height: 30px;
}

.navbar .divider-vertical {
    height: 50px;
    margin: 0 4px;
    border-right: 1px solid #3b3f4c;
    border-left: 1px solid #3b3f4c;
}

.navbar-inverse .divider-vertical {
    border-right-color: #3b3f4c;
    border-left-color: #dbdcde;
}

.navbar-default
{
    border: none;    
}

.navbar-default .navbar-nav > li > a {
    color: #c9cace;
}

.navbar-default .navbar-text
{
    color: #c9cace;    
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
    /*background-color: #FFFF00;*/
    color: #eee;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #94969d;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #94969d;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #94969d;
}
:-moz-placeholder { /* Firefox 18- */
  color: #94969d;
}

.headerSearchContainer
{
    float: left; 
    margin-left: 0px; 
    height: 50px; 
    line-height: 50px;
}

/* sidebar */

 body {
    overflow-x: hidden;
    padding-top: 105px;
 }

/* Toggle Styles */

#wrapper 
{
    padding-left: 0;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

#wrapper.toggled {
    /* padding-left: 320px; */
}

#sidebar-wrapper {
    z-index: 1000;
    position: absolute;
    left: 0;
    top: 105px;
    bottom: 0;
    width: 100%;
    /* height: 100%; */
    /* margin-left: -320px; */
    overflow: inherit;
    background: #31343f;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    overflow: hidden;
}

#wrapper.toggled #sidebar-wrapper {
    width: 100%;
    left: -100%;
}

#wrapper.toggled #page-content-wrapper {
    position: absolute;
    margin-right: -100%;
}

#page-content-wrapper {
    width: 100%;
    position: absolute;
    background: #3b3f4c;
    top: 105px;
    bottom: 0;
    left: 0;
    right: 0;
}

/* share user Styles */

#wrapper.shared {
    
}

#wrapper.shared #sidebar-wrapper {
    width: 100%;
    left: -100%;
}

#wrapper.shared #page-content-wrapper {
    position: absolute;
    margin-right: -100%;
}

#wrapper.shared .dvBinListSubHeader .dvBinListSubHeaderSortingSettings {
    display: none;
}

@media only screen and (min-width : 480px) {
    .headerSearchContainer {
        flex: 1 1 auto;
        overflow-x: auto;
        overflow-y: hidden;
    }

    .navBarMenuContainer {
        flex: 0 0 auto;
    }

    .header-container {
        display: flex;
        justify-content: space-between;
    }

    body {
        padding-top: 50px;
    }

    #wrapper {
        padding-left: 320px;
    }

        #wrapper.toggled {
            padding-left: 0;
        }

    #sidebar-wrapper {
        width: 320px;
        top: 50px;
    }

    /*
    #wrapper.toggled #sidebar-wrapper {
        width: 0;
    }
*/


    #page-content-wrapper {
        position: absolute;
        top: 50px;
        bottom: 0;
        left: 0;
        right: 0;
        padding-left: 320px;
    }

    #wrapper.shared #page-content-wrapper {
        padding-left: 0px !important;
    }

    /*
    #wrapper.toggled #page-content-wrapper {
        position: absolute;
        margin-right: 0;
        padding-left: 0;
    }
*/

    #dvAssetList {
        left: 320px !important;
    }

    #wrapper.shared #dvAssetList {
        left: 0px !important;
    }


    /* thumbnail mode */
    .thumbnailMode .dvAssetListItemContainer {
        border: 2px solid transparent;
        float: left;
        height: 240px;
        margin-bottom: 36px;
        margin-right: 36px;
        overflow: hidden;
        width: 200px;
        background-color: rgba(76, 80, 92, 0.55);
        position: relative;
        text-align: left;
    }

        .thumbnailMode .dvAssetListItemContainer.centerThumbnailItem {
            float: none !important;
            margin: 8px !important;
            display: inline-block;
        }

    .thumbnailMode .dvAssetListImageContainer {
        height: 150px;
        overflow: hidden;
        position: relative;
        width: 200px;
        text-align: center;
    }

    .thumbnailMode .imgAssetListImage {
        height: 150px;
        width: 200px;
    }

    .thumbnailMode .imgBinImage {
        height: 110px;
        width: 135px;
        margin-top: 22px;
    }

    .thumbnailMode .dvAssetListObjectName {
        font-size: 13px;
        color: #dbdcde;
        height: 40px;
        overflow: hidden;
    }

        .thumbnailMode .dvAssetListObjectName a {
            color: #dbdcde;
            text-decoration: none;
        }

    .thumbnailMode .dvAssetListBinName {
        font-size: 13px;
        color: #dbdcde;
        overflow: hidden;
        text-align: center;
    }

        .thumbnailMode .dvAssetListBinName a {
            color: #dbdcde;
            text-decoration: none;
        }

    .thumbnailMode .dvAssetListDetailContainer {
        font-size: 11px;
        color: #82848d;
        overflow: hidden;
        padding: 10px;
        min-height: 100px;
        /*cursor: pointer;*/
        /*background-color: rgba(76, 80, 92, 0.55);*/
    }

    .thumbnailMode .dvAssetListAssetDescriptionContainer {
        background-color: #333;
        border: 1px solid #555;
        display: none;
        font-size: 12px;
        min-height: 50px;
        overflow: hidden;
        padding: 2px;
        position: absolute;
        white-space: pre-line;
        width: 160px;
        z-index: 1000;
    }

    .thumbnailMode .dvAssetListOptionsContainer {
        display: none;
        border-top: 1px solid #444;
        height: 30px;
        margin-top: 5px;
    }

    .thumbnailMode .dvAssetListBinDescription {
        text-align: center;
        margin-top: 4px;
    }

    .thumbnailMode .lbDuration {
        text-align: center;
        position: absolute;
        bottom: 4px;
        right: 6px;
        background: #21232a;
        padding: 3px;
        font-size: 11px;
        font-weight: bold;
        border-radius: 2px;
        color: #ebebeb;
    }

    .thumbnailMode .dvCustomIconsContainer {
        position: absolute;
        left: 4px;
        top: 4px;
    }

    .thumbnailMode > .dvAssetListItemContainer.selectedItem > .dvAssetListHoverContainer 
    {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        height: 150px;
        width: 200px;
        overflow: hidden;
        background-color: rgba(17, 18, 21, 0.7);
        text-align: justify;
        padding: 44px 12px;
        z-index: 100;
    }

    .thumbnailMode > .dvAssetListItemContainer > .dvAssetListHoverContainer {
        display: none;
    }

    .thumbnailMode .dvAssetListHoverContainer > div {
        width: 50px;
        display: inline-block;
        vertical-align: top;
        text-align: center;
        /* IE fix. */
        *display: inline;
        zoom: 1;
        cursor: pointer;
    }

        .thumbnailMode .dvAssetListHoverContainer > div:hover {
            opacity: 0.7;
        }

    .thumbnailMode .dvAssetListHoverContainer:after {
        content: "";
        width: 100%;
        display: inline-block;
    }

    .thumbnailMode .dvAssetListHoverContainer > div > a {
        display: block;
        height: 40px;
        line-height: 40px;
        cursor: pointer;
    }

    .thumbnailMode .dvAssetListHoverContainer > div > span {
        font-size: 9px;
        font-weight: bold;
        color: #dbdcde;
    }

    .thumbnailMode .selectedItem {
        border: 2px solid #ffcc25;
    }

    .detailMode .selectedItem {
        outline: 1px solid #ffcc25;
    }

    .thumbnailMode .imgThumbnail {
        position: relative;
        width: 200px;
        height: 150px;
        overflow: hidden;
    }

        .thumbnailMode .imgThumbnail img {
            position: absolute;
            left: 50%;
            top: 50%;
            height: 100%;
            width: auto;
            -webkit-transform: translate(-50%,-50%);
            -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
        }

    .thumbnail img.portrait {
        width: 100%;
        height: auto;
    }


    /*------------------*/



    /* TileMode */

    .tileMode .dvAssetListItemContainer {
        position: relative;
        background-color: rgba(76, 80, 92, 0.55);
        clear: both;
        margin-bottom: 32px;
        border: 2px solid transparent;
        padding: 5px;
        overflow: hidden;
    }

    .tileMode .dvAssetListImageContainer {
        float: left;
        width: 200px;
        height: 150px;
        margin-right: 10px;
        overflow: hidden;
        position: relative;
        text-align: center;
    }

    .tileMode .imgAssetListImage {
        width: 160px;
        height: 120px;
    }

    .tileMode .imgBinImage {
        height: 110px;
        width: 135px;
        margin-top: 22px;
    }

    .tileMode .dvAssetListObjectName {
        font-size: 18px;
    }

        .tileMode .dvAssetListObjectName a {
            color: #dbdcde;
            text-decoration: none;
            font-size: 15px;
        }

    .tileMode .dvAssetListBinName {
        font-size: 15px;
        color: #dbdcde;
        overflow: hidden;
    }

        .tileMode .dvAssetListBinName a {
            color: #dbdcde;
            text-decoration: none;
        }

    .tileMode .dvAssetListDetailContainer {
        color: #9f9f9f;
        overflow: hidden;
        font-size: 11px;
    }

    tileMode .dvAssetListAssetDescriptionContainer {
        font-size: 12px;
        margin-top: 10px;
        overflow: hidden;
        white-space: pre-line;
    }

    tileMode .dvAssetListOptionsContainer {
        display: block;
        height: 30px;
    }

    .thumbnailMode .dvAssetListBinDescription {
        text-align: center;
        margin-top: 4px;
    }

    .tileMode .lbDuration {
        text-align: center;
        position: absolute;
        bottom: 4px;
        right: 6px;
        background: #21232a;
        padding: 3px;
        font-size: 11px;
        font-weight: bold;
        border-radius: 2px;
        color: #ebebeb;
    }

    .tileMode .dvCustomIconsContainer {
        position: absolute;
        top: 4px;
        left: 4px;
    }

    .tileMode > .dvAssetListItemContainer.selectedItem > .dvAssetListHoverContainer 
    {
        display: block;
        position: absolute;
        height: 150px;
        width: 200px;
        overflow: hidden;
        background-color: rgba(17, 18, 21, 0.7);
	    text-align: justify;
	    padding: 44px 12px;
	    z-index: 100;
    }

    .tileMode > .dvAssetListItemContainer > .dvAssetListHoverContainer {
        display: none;
    }

    .tileMode .dvAssetListHoverContainer > div {
	    width: 50px;
	    display: inline-block;
	    vertical-align: top;
	    text-align: center;

	    /* IE fix. */
	    *display: inline;
	    zoom: 1;
	    cursor: pointer;
    }
    
    .tileMode .dvAssetListHoverContainer > div:hover 
    {
        opacity: 0.7;
    }

    .tileMode .dvAssetListHoverContainer:after {
	    content: "";
	    width: 100%;
	    display: inline-block;
    }

    .tileMode .dvAssetListHoverContainer > div > a {
        display: block;
        height: 40px;
        line-height: 40px;
        cursor: pointer;
    }

    .tileMode .dvAssetListHoverContainer > div > span {
        font-size: 9px;
        font-weight: bold;
        color: #dbdcde;
    }	
	
	.tileMode .selectedItem
    {
        border: 2px solid #ffcc25;
    }

    .tileMode .imgThumbnail {
        position: relative;
        width: auto;
        height: 100%;
        overflow: hidden;
    }
    
    .tileMode .imgThumbnail img {
        position: absolute;
        left: 50%;
        top: 50%;
        height: 100%;
        width: auto;
        -webkit-transform: translate(-50%,-50%);
            -ms-transform: translate(-50%,-50%);
                transform: translate(-50%,-50%);
    }
    
    .thumbnail img.portrait {
        width: 100%;
        height: auto;
    }


    /************************/
    
    #dvAssetList 
    {
        padding: 20px !important;
        padding-top: 5px !important;
    }
    
    .dvBinListHeader 
    {
        padding: 0 20px !important;    
    }
    
    .dvBinListSubHeader 
    {
        padding: 0 20px !important;    
    }

    /*
    .imgThumbnail {
        position: relative;
        width: 200px;
        height: 150px;
        overflow: hidden;
    }
    
    .imgThumbnail img {
        position: absolute;
        left: 50%;
        top: 50%;
        height: 100%;
        width: auto;
        -webkit-transform: translate(-50%,-50%);
            -ms-transform: translate(-50%,-50%);
                transform: translate(-50%,-50%);
    }
    */
    .thumbnail img.portrait {
        width: 100%;
        height: auto;
    }
    
    #dvUploadItemsContainer {
        display: none;
        background-color: transparent;
        position: fixed;
        bottom: 20px;
        right: 20px;
        width: 400px;
        z-index: 1000;
        overflow: auto;
    }
    
    /* detail page */

    .dvDetailPageContent
    {
        position: relative;
        height: 500px;
    }

    .dvDetailPageAssetContainer
    {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        background: #111215; 
        width: 70%;   
        
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    .dvDetailPageHeader
    {
        height: 50px;
        background: #4c505c;
    }

    .dvMetadataContainer
    {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;   
        width: 30%;
        background: #21232a;    
        overflow: hidden;
        overflow-y: auto;
        
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    .dvDetailPageContent.toggled .dvMetadataContainer
    {
        right: -30%;
        
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    .dvDetailPageContent.toggled .dvDetailPageAssetContainer
    {
        width: 100%;
        
        -webkit-transition: all 0.5s ease;
        -moz-transition: all 0.5s ease;
        -o-transition: all 0.5s ease;
        transition: all 0.5s ease;
    }

    /* ------------------ */
    
    .lbObjectName
    {
        line-height: 50px;
        font-size: 17px;
        color: #dbdcde;
        padding-left: 18px;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;   
    }

    .lbFileSize
    {
        line-height: 50px;
        font-size: 13px;
        color: #82848d;
    }

    .lbFileStatus {
        line-height: 50px;
        font-size: 13px;
        color: #82848d;
    }

    #dvDetailPageTitle
    {
        padding-left: 10px;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 50px;
    }
    
    #dvDetailPageHeaderButtons
    {
        float: right;
        line-height: 50px;
        margin-left: 20px;
        margin-right: 10px;
    }
    
    #dvAssetContainer
    {
        background: #30333D;
        height: 450px;
        margin: 0 auto;
        position: relative;
    }
    
    #dvDurationContainer
    {
        float: left;
        width: 230px;
        height: 46px;
        margin-top: 8px;
        padding-left: 6px;
        border-left: none;
        line-height: 46px;
        text-indent: 10px;
        border-right: none;
        border-bottom: none
    }

    #dvDurationContainer.medicalViewer {
        line-height: 18px !important;
        font-family: monospace; 
    }

    #dvSliderContainer
    {
        margin-left: 270px;    
    }
    
    .dvMarkerHeader
    {
        float: left;
        width: 270px;
        height: 44px;
        border: 1px solid #16171c;
        overflow: hidden;
        line-height: 44px;
        text-indent: 8px;
        background: #363a46;
    }
    
    .dvMarkerTemplate
    {
        /*border: 2px solid transparent;*/
        margin-left: 270px;
        height: 44px;
        background: #2b2e38;
    }

    #dvMarkers
    {
        padding: 0px 6px;
    }
    
    .dvMarkerHeaderHandle
    {
        float: left;
        height: 44px;
        width: 4px;    
    }
    
    .selected .dvMarkerHeader
    {
        background: #4c505c;    
    }

    .selected .dvMarkerTemplate
    {
        background: #3b3f4c;     
    }
    
    .lbFileSizeDelimiter
    {
        padding: 0 8px;    
    }
    
    #imgLogo
    {
        width: 40%;
    }
    
    .categoryAssets
    {
        overflow: hidden;
        height: 260px;
        margin: 8px;    
    }
    
    .categoryAssets .lbAssetListMessage
    {
        line-height: 260px;            
    }
    
    .dvDefaultPageContainer {
        float: none;
        border-radius: 4px;
        padding-bottom: 60px;
        padding-top: 60px;
    }
    
    .dvOtherAssetsContainer
    {
        clear: both;
        position: absolute;
        top: 500px;
        right: 0;
        left: 0;
        background: #3b3f4c;
    }
    
    .dvOtherAssetsContainer .lbOtherAssets
    {
        text-indent: 8px;
    }
    
    #dvOtherAssets
    {
        height: 260px;
        overflow: hidden;    
    }
    
    .navBarMenuContainer
    {
        margin-right: 0px;    
    }

    .headerSearchbox
    {
        float: left;
        border: none;
        background: none;
        margin-left: 16px;
        outline: none;
        color: #94969d;
        line-height: 50px;
        height: 50px;
    }

    .navBarHeader
    {
        height: 50px !important;
    }

    .logo-container {
        width: 320px;
        flex: 0 0 auto;
    }

    .menu-toggle {
        display: none !important;
    }
}


/* center tabs */
.nav-tabs > li, .nav-pills > li 
{
    font-size: 11px;
    font-weight: bold;
    float:none;
    display:inline-block;
    *display:inline; /* ie7 fix */
    *zoom:1; /* hasLayout ie7 trigger */
}

.nav-tabs, .nav-pills {
    text-align:center;
    background: #3b3f4c;
    border-bottom: none;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus
{
    color: #dbdcde;
    background-color: transparent;        
    border: none;
    border-bottom: 2px solid #ffcc25;
}

.nav-tabs > li > a
{
    color: #94969d;
    height: 50px;
    line-height: 30px;
}

.nav > li > a
{
    padding-left: 5px;
    padding-right: 5px;    
}

/* project explorer tree view */

ul.dynatree-container
{
    background-color: transparent !important;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

.libraryProjectNode
{
    color: #4D9CF4 !important;
    font-weight: bold;
}

.archiveProjectNode________
{
    font-size: 16px !important;
    font-weight: bold;
    color: #70737c !important;
}




.dvTreeviewContainer {
    bottom: 92px;
    left: 0;
    margin-top: 2px;
    min-height: 100px;
    overflow: hidden;
    /* padding-bottom: 10px; */
    position: absolute;
    right: 0;
    top: 50px;
}

#dvProjectExplorerFooter 
{
    display: none;
    border-top: 1px solid #494949;
    bottom: 0;
    height: 150px;
    left: 0;
    margin-top: 2px;
    overflow: hidden;
    padding-top: 5px;
    position: absolute;
    right: 0;
}

/*
.dropdown-menu {
  left: 50%;
  right: auto;
  text-align: center;
  transform: translate(-50%, 0);
}
*/

#cmbSortField
{
    height: 200px;
    overflow: auto;    
}

.dropdown-menu > li > a
{
    /*font-size: larger;    */
    cursor: pointer;
}

.dropdown-menu > li > a:hover
{
    background: #ffcc25;
}

.cmbSortField
{
    background: transparent;    
    border: 1px solid #4c505c !important;
    color: #a5a7ad;
    outline: none !important;
}

.cmbSortField:hover,
.cmbSortField:visited,
.cmbSortField:active
.cmbSortField:focus
{
    color: #fff !important;
    outline: none !important;
    border: 1px solid #4c505c !important;
    background: transparent !important;    
}

.cmbSortField span
{
    color: #a5a7ad !important;
}

.cmbSortField:hover span
{
    color: #fff !important;
}

.dropdown-toggle 
.dropdown-toggle:active,
.dropdown-toggle:focus, 
.dropdown-toggle:hover
{
    outline: none !important;    
}

.bootstrap-select .dropdown-toggle:focus
{
    outline: none !important;    
}

/* scrollbars */
.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar-button:start:decrement,
.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar-button:end:increment {
    height: 0px;
    display: block;
    background-color: #eee;
}

.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar-button:horizontal:start:decrement,
.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar-button:horizontal:end:increment {
    height: 0px;
    display: block;
    background-color: #eee;
}

.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar-track-piece {
    background-color: #eee;
}

.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar-thumb:vertical,
.bootstrap-select.btn-group .dropdown-menu.inner::-webkit-scrollbar-thumb:horizontal
{
    background-color: #aaa;
    border: 1px solid #aaa;
    -webkit-border-radius: 0px;
}



.cmbSortField:hover, .cmbSortField:focus, .cmbSortField:active, .cmbSortField.active, .open > .dropdown-toggle.cmbSortField {
    background: transparent;
    color: #a5a7ad;
}

.cmbSortField:active, .cmbSortField.active {
    background: transparent;
    color: #a5a7ad;
}

.icon-up-arrow { 
  background-image: url("Images/up-arrow.png");
  background-position: center center; 
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-down-arrow { 
  background-image: url("Images/down-arrow.png");
  background-position: center center; 
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-add-bin { 
  background-image: url("Images/add-bin.png");
  background-position: center center; 
  background-size: 18px 18px;
  height: 20px; 
  width: 20px;
  background-repeat: no-repeat;
}

.icon-more { 
  background-image: url("Images/more.png");
  background-position: center center; 
  background-size: 14px 3px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-metadata { 
  background-image: url("Images/metadata.png");
  background-position: center center; 
  background-size: 8px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-download-asset { 
  background-image: url("Images/download_asset.png");
  background-position: center center; 
  background-size: 14px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-adobe { 
  background-image: url("Images/adobe.png");
  background-position: center center; 
  background-size: 14px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-select-file { 
  background-image: url("Images/select-file.png");
  background-position: center center; 
  background-size: 12px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-download { 
  background-image: url("Images/download.png");
  background-position: center center; 
  background-size: 14px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-upload { 
  background-image: url("Images/upload.png");
  background-position: center center; 
  background-size: 14px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-thumbnail-mode { 
  background-image: url("Images/thumbnail-mode.png");
  background-position: center center; 
  background-size: 14px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-tile-mode { 
  background-image: url("Images/tile-mode.png");
  background-position: center center; 
  background-size: 14px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-detail-mode { 
  background-image: url("Images/detail-mode.png");
  background-position: center center; 
  background-size: 14px 14px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-settings { 
  background-image: url("Images/settings.png");
  background-position: center center; 
  background-size: 24px 24px;
  height: 24px; 
  width: 24px;
  background-repeat: no-repeat;
}

.icon-filter {
    background-image: url("Images/filter.png");
    background-position: center center;
    background-size: 28px 28px;
    height: 28px;
    width: 28px;
    background-repeat: no-repeat;
}

.icon-filter.active {
    background-image: url("Images/filter-active.png") !important;
}

.icon-menu { 
  background-image: url("Images/menu-icon.png");
  background-position: center center; 
  background-size: 22px 17px;
  height: 22px; 
  width: 17px;
  background-repeat: no-repeat;
}

.binSortingSettingsContainer
{
    height: 90px; 
    position: absolute; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    border-top: solid 1px #3b3f4c;    
}

/* div arrow */
.arrow_box {
	/*position: relative;*/
	background: #transparent;
	border: 1px solid #3b3f4c;
}
.arrow_box:after, .arrow_box:before {
	bottom: 100%;
	left: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.arrow_box:after {
	border-color: rgba(0, 0, 0, 0);
	border-bottom-color: transparent;
	border-width: 8px;
	margin-left: -8px;
}
.arrow_box:before {
	border-color: rgba(59, 63, 76, 0);
	border-bottom-color: #3b3f4c;
	border-width: 8px;
	margin-left: -8px;
}

.lbBinSortingSettings
{
    color: #a5a7ad;
    opacity: 0.4;
    font-size: 11px;
    font-weight: bold;
}


/* asset list */

.dvBinListHeader {
    background-color: #4c505c;
    border-bottom: 1px solid #494949;
    display: block;
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
}


/* btn-bin-header */
.btn-bin-header,
.btn-bin-header:focus { 
  color: #A5A7AD; 
  background-color: #3B3F4C; 
  border-color: #3B3F4C; 
} 
 
.btn-bin-header:hover, 
.btn-bin-header.active, 
.open .dropdown-toggle.btn-bin-header { 
  color: #A5A7AD; 
  background-color: #262931 !important;
  border-color: #3B3F4C !important; 
} 
 
.btn-bin-header:active, 
.btn-bin-header.active, 
.open .dropdown-toggle.btn-bin-header { 
  background-image: none !important;
  background-color: #3B3F4C !important;
} 
 
.btn-bin-header.disabled, 
.btn-bin-header[disabled], 
fieldset[disabled] .btn-bin-header, 
.btn-bin-header.disabled:hover, 
.btn-bin-header[disabled]:hover, 
fieldset[disabled] .btn-bin-header:hover, 
.btn-bin-header.disabled:focus, 
.btn-bin-header[disabled]:focus, 
fieldset[disabled] .btn-bin-header:focus, 
.btn-bin-header.disabled:active, 
.btn-bin-header[disabled]:active, 
fieldset[disabled] .btn-bin-header:active, 
.btn-bin-header.disabled.active, 
.btn-bin-header[disabled].active, 
fieldset[disabled] .btn-bin-header.active { 
  background-color: #3B3F4C; 
  border-color: #3B3F4C; 
} 
 
.btn-bin-header .badge { 
  color: #3B3F4C; 
  background-color: #A5A7AD; 
}

/* upload button */

.binlist_fileinput-button {
    -moz-user-select: none;
    overflow: hidden;
    position: relative;
}

.binlist_fileinput-button input {
    cursor: pointer;
    direction: ltr;
    font-size: 200px;
    margin: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.dvBinListSubHeader {
    display: block;
    height: 50px;
    line-height: 50px;
    padding: 0 10px;
    background: #3b3f4c;
}

.dvBinlistInfo
{
    overflow: hidden;
}

#lbBinlistInfo
{
    font-size: 20px;
    color: #94969d;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    width: 100%;
    overflow: hidden;
}

#dvAssetList {
    bottom: 0;
    float: left;
    left: 0px;
    overflow: auto;
    padding: 10px;
    padding-top: 5px;
    position: absolute;
    right: 0;
    top: 100px;
}

.rotate-screen-container {
    display: none;
}

@media only screen and (max-height : 400px) and (orientation: landscape) {
    html:has(div.vjs-fullscreen) {
        height: initial !important;
    }

    body:has(div.vjs-fullscreen) {
        height: initial !important;
        padding: initial !important;
    }

    .mainContainer:has(div.vjs-fullscreen) {
        display: block !important;
    }
    
    body:has(div.vjs-fullscreen) .rotate-screen-container {
        display: none !important;
    }

    html {
        height: 100%;
        background: #31343f;
    }

    body {
        height: 100%;
        padding: 0;
    }

    .mainContainer {
        display: none;
    }

    .rotate-screen-container {
        display: flex;
        height: 100%;
        justify-content: center;
        align-items: center;
    }

    .rotate-screen-container > span {
        font-size: 30px;
        text-align: center;
    }
}

@media only screen and (max-width : 479px) {
    .defaultPageFooter {
        display: block;
    }

    .navBarMenuContainer {
        position: fixed;
        top: 0;
        right: 0;
    }

    .navBarHeader {
        height: 100px !important;
    }

    .navbar-collapse .nav > .divider-vertical {
        display: none;
    }

    .headerSearchContainer {
        float: none;
        padding-left: 5px;
        padding-right: 5px;
        height: 50px;
        margin-left: 0px;
        line-height: 50px;
        clear: both;
        border-top: 1px solid #3b3f4c;
    }

    /* thumbnail mode */

    .thumbnailMode .dvAssetListItemContainer {
        border: 2px solid transparent;
        height: 188px;
        margin-bottom: 36px;
        overflow: hidden;
        /*width: 200px;*/
        background-color: rgba(76, 80, 92, 0.55);
        position: relative;
        text-align: left;
    }

    .thumbnailMode .dvAssetListImageContainer {
        overflow: hidden;
        position: relative;
        text-align: center;
    }

    .thumbnailMode .imgAssetListImage {
        width: 100%;
    }

    .thumbnailMode .imgBinImage {
        height: 110px;
        width: 135px;
        margin-top: 10px;
    }

    .thumbnailMode .dvAssetListObjectName {
        font-size: 13px;
        color: #dbdcde;
        height: 20px;
        overflow: hidden;
    }

        .thumbnailMode .dvAssetListObjectName a {
            color: #dbdcde;
            text-decoration: none;
        }

    .thumbnailMode .dvAssetListBinName {
        font-size: 13px;
        color: #dbdcde;
        overflow: hidden;
        text-align: center;
    }

        .thumbnailMode .dvAssetListBinName a {
            color: #dbdcde;
            text-decoration: none;
        }

    .thumbnailMode .dvAssetListDetailContainer {
        font-size: 11px;
        color: #82848d;
        overflow: hidden;
        padding: 10px;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(33, 33, 33, 0.7);
        /*cursor: pointer;*/
    }

    .thumbnailMode .dvAssetListAssetDescriptionContainer {
        background-color: #333;
        border: 1px solid #555;
        display: none;
        font-size: 12px;
        min-height: 50px;
        overflow: hidden;
        padding: 2px;
        position: absolute;
        white-space: pre-line;
        width: 160px;
        z-index: 1000;
    }

    .thumbnailMode .dvAssetListOptionsContainer {
        display: none;
        border-top: 1px solid #444;
        height: 30px;
        margin-top: 5px;
    }

    .thumbnailMode .dvAssetListBinDescription {
        text-align: center;
        margin-top: 4px;
    }

    .thumbnailMode .lbDuration {
        text-align: center;
        position: absolute;
        bottom: 6px;
        right: 6px;
        background: #21232a;
        padding: 3px;
        font-size: 11px;
        font-weight: bold;
        border-radius: 2px;
        color: #ebebeb;
        z-index: 999;
    }

    .thumbnailMode .dvCustomIconsContainer {
        position: absolute;
        left: 4px;
        top: 4px;
    }

    .thumbnailMode .dvAssetListHoverContainer {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        overflow: hidden;
        background-color: rgba(17, 18, 21, 0.7);
        text-align: justify;
        padding: 60px 45px;
        z-index: 100;
    }

    .thumbnailMode .dvAssetListHoverContainer > div {
        width: 50px;
        display: inline-block;
        vertical-align: top;
        text-align: center;
        /* IE fix. */
        *display: inline;
        zoom: 1;
        cursor: pointer;
    }

        .thumbnailMode .dvAssetListHoverContainer > div:hover {
            opacity: 0.7;
        }

    .thumbnailMode .dvAssetListHoverContainer:after {
        content: "";
        width: 100%;
        display: inline-block;
    }

    .thumbnailMode .dvAssetListHoverContainer > div > a {
        display: block;
        height: 40px;
        line-height: 40px;
        cursor: pointer;
    }

    .thumbnailMode .dvAssetListHoverContainer > div > span {
        font-size: 9px;
        font-weight: bold;
        color: #dbdcde;
    }

    .thumbnailMode .selectedItem {
        border: 2px solid #ffcc25;
    }

    .detailMode .selectedItem {
        outline: 1px solid #ffcc25;
    }

    .thumbnailMode .imgThumbnail {
        position: relative;
        width: auto;
        height: 188px;
        overflow: hidden;
    }

        .thumbnailMode .imgThumbnail img {
            position: absolute;
            left: 50%;
            top: 50%;
            height: auto;
            width: 100%;
            -webkit-transform: translate(-50%,-50%);
            -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
        }

    .thumbnail img.portrait {
        width: 100%;
        height: auto;
    }


    /*------------------*/

    /* TileMode */

    .tileMode .dvAssetListItemContainer {
        position: relative;
        background-color: rgba(76, 80, 92, 0.55);
        clear: both;
        margin-bottom: 32px;
        border: 2px solid transparent;
        padding: 5px;
        overflow: hidden;
    }

    .tileMode .dvAssetListImageContainer {
        float: left;
        width: 120px;
        height: 90px;
        margin-right: 10px;
        overflow: hidden;
        position: relative;
        text-align: center;
    }

    .tileMode .imgAssetListImage {
        width: 160px;
        height: 120px;
    }

    .tileMode .imgBinImage {
        height: 74px;
        width: 90px;
        margin-top: 8px;
    }

    .tileMode .dvAssetListObjectName {
        font-size: 18px;
    }

        .tileMode .dvAssetListObjectName a {
            color: #dbdcde;
            text-decoration: none;
            font-size: 15px;
        }

    .tileMode .dvAssetListBinName {
        font-size: 15px;
        color: #dbdcde;
        overflow: hidden;
    }

        .tileMode .dvAssetListBinName a {
            color: #dbdcde;
            text-decoration: none;
        }

    .tileMode .dvAssetListDetailContainer {
        color: #9f9f9f;
        overflow: hidden;
        font-size: 11px;
    }

    tileMode .dvAssetListAssetDescriptionContainer {
        font-size: 12px;
        margin-top: 10px;
        overflow: hidden;
        white-space: pre-line;
    }

    tileMode .dvAssetListOptionsContainer {
        display: block;
        height: 30px;
    }

    .thumbnailMode .dvAssetListBinDescription {
        text-align: center;
        margin-top: 4px;
    }

    .tileMode .lbDuration {
        text-align: center;
        position: absolute;
        bottom: 4px;
        right: 6px;
        background: #21232a;
        padding: 3px;
        font-size: 11px;
        font-weight: bold;
        border-radius: 2px;
        color: #ebebeb;
    }

    .tileMode .dvCustomIconsContainer {
        position: absolute;
        top: 4px;
        left: 4px;
    }

    .tileMode .dvAssetListHoverContainer {
        display: none;
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        overflow: hidden;
        background-color: rgba(17, 18, 21, 0.7);
        text-align: justify;
        padding: 24px 48px;
        z-index: 100;
    }

    .tileMode .dvAssetListHoverContainer > div {
        width: 50px;
        display: inline-block;
        vertical-align: top;
        text-align: center;
        /* IE fix. */
        *display: inline;
        zoom: 1;
        cursor: pointer;
    }

        .tileMode .dvAssetListHoverContainer > div:hover {
            opacity: 0.7;
        }

    .tileMode .dvAssetListHoverContainer:after {
        content: "";
        width: 100%;
        display: inline-block;
    }

    .tileMode .dvAssetListHoverContainer > div > a {
        display: block;
        height: 40px;
        line-height: 40px;
        cursor: pointer;
    }

    .tileMode .dvAssetListHoverContainer > div > span {
        font-size: 9px;
        font-weight: bold;
        color: #dbdcde;
    }

    .tileMode .selectedItem {
        border: 2px solid #ffcc25;
    }

    .tileMode .imgThumbnail {
        position: relative;
        width: auto;
        height: 90px;
        overflow: hidden;
    }

        .tileMode .imgThumbnail img {
            position: absolute;
            left: 50%;
            top: 50%;
            height: 100%;
            width: auto;
            -webkit-transform: translate(-50%,-50%);
            -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
        }

    .thumbnail img.portrait {
        width: 100%;
        height: auto;
    }


    /************************/

    .navbar-header {
        padding: 0;
    }

    #dvUploadItemsContainer {
        display: none;
        background-color: transparent;
        position: fixed;
        bottom: 20px;
        right: 5%;
        width: 90%;
        z-index: 1000;
        overflow: auto;
    }

    /* detail page */

    .dvDetailPageContent {
        position: relative;
        height: 250px;
    }

    .dvDetailPageAssetContainer {
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        background: #111215;
    }

    .dvDetailPageHeader {
        height: 50px;
        background: #4c505c;
    }

    .dvMetadataContainer {
        display: none;
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        width: 100%;
        background: #21232a;
        overflow: hidden;
        overflow-y: auto;
        z-index: 100;
    }

    .dvDetailPageContent.toggled {
        position: absolute;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        height: auto;
    }

        .dvDetailPageContent.toggled .dvMetadataContainer {
            display: block;
        }

        .dvDetailPageContent.toggled .dvDetailPageAssetContainer {
            /*padding-right: 0;    */
            display: none;
        }

    /* ------------------ */

    .lbObjectName {
        float: left;
        font-size: 16px;
        color: #dbdcde;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }

    .lbFileSize {
        float: left;
        font-size: 13px;
        color: #82848d;
        clear: left;
    }

    .lbFileStatus {
        float: left;
        font-size: 13px;
        color: #82848d;
        margin-left: 4px;
    }

    #dvDetailPageTitle {
        padding-left: 10px;
    }

    .lnkUp {
        margin-right: 8px;
    }

    #dvDetailPageHeaderButtons {
        float: right;
        line-height: 50px;
        /*width: 50px;*/
        margin-left: 20px;
        margin-right: 10px;
    }

    #dvAssetContainer {
        background: #000;
        height: 200px;
        margin: 0 auto;
        position: relative;
    }

    #dvDurationContainer {
        border: 1px solid #3b3f4c;
        height: 55px;
        margin-top: 0px;
        padding-left: 6px;
        border-left: none;
        border-top: none;
        line-height: 55px;
        text-indent: 10px;
    }

    #dvSliderContainer {
        margin-left: 0px;
    }

    .dvMarkerHeader {
        float: left;
        width: 10px;
        height: 44px;
        border: 1px solid #16171c;
        overflow: hidden;
        line-height: 44px;
        text-indent: 8px;
        background: #363a46;
    }

    .dvMarkerTemplate {
        /*border: 2px solid transparent;*/
        margin-left: 9px;
        height: 44px;
        background: #2b2e38;
    }

    #dvMarkers {
        padding: 0;
    }

    .dvMarkerHeaderHandle {
        float: left;
        height: 44px;
        width: 8px;
    }

    .selected .dvMarkerHeader {
        width: 100%;
    }

    .selected .dvMarkerTemplate {
        display: none;
    }

    .lbFileSizeDelimiter {
        display: none;
    }

    #imgLogo {
        width: 60%;
    }

    .categoryAssets {
        margin-top: 16px;
    }

    .categoryAssets .lbAssetListMessage {
        display: inline-block;
        margin-top: 40px;
        margin-bottom: 60px;
    }

    .dvDefaultPageContainer {
        float: none;
        border-radius: 4px;
        padding-bottom: 60px;
        padding-top: 0px;
    }

    .dvOtherAssetsContainer {
        clear: both;
        position: absolute;
        top: 250px;
        right: 0;
        left: 0;
        margin: 8px;
        background: #3b3f4c;
    }

    .toggled .dvOtherAssetsContainer {
        display: none;
    }

    .headerSearchbox {
        float: left;
        border: none;
        background: none;
        margin-left: 16px;
        outline: none;
        color: #94969d;
        line-height: 50px;
        height: 50px;
    }

    .detail-page-info-container {
        margin-top: 6px;
    }

    #dvDynamicSearchViewContainer {
        overflow-x: auto;
        width: 100%;
        -ms-overflow-style: none; /* IE and Edge */
        scrollbar-width: none; /* Firefox */
    }

    #dvDynamicSearchViewContainer::-webkit-scrollbar {
        display: none;
    }

    .menu-toggle {
        display: initial !important;
    }
}



/*advanced search*/

.dvAdvancedSearchContainer
{
    min-height: 100px;
    /*margin: 10px;    */
    /*border: 1px solid #444444;*/
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: auto;
    margin-right: 6px;
}

.dvAdvancedSearchRow {
    clear: left;
    border: 1px solid #434753;
    position: relative;
    width: 90%;
    padding: 10px;
    margin: 4px auto;
}

.dvAdvancedSearchRow input
{
    display: block;
    clear: both;
    width: 95%;    
    color: #4c505c;
    font-size: 12px;
    font-weight: 500;
    padding: 4px;
    margin: 6px auto;
    background: #ececec;
    border: solid 1px transparent;
}

.advancedsearchautocomplete_box {
    margin-top: 2px;
    background-color: #ececec;
    border: 1px solid #666;
    display: none;
    max-height: 120px;
    overflow: auto;
    position: absolute;
    width: 150px;
    z-index: 10000;
}

.advancedsearchautocomplete_box ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
    text-align: left;
}

.advancedsearchautocomplete_box ul li {
    display: block;
    padding: 4px;
}

.advancedsearchautocomplete_box ul li a {
    color: #4c505c !important;
    display: block;
    color: #4c505c;
    font-size: 12px;
    font-weight: 500;
    line-height: normal !important;
    overflow: hidden;
    padding: 4px;
    text-decoration: none !important;
}

.advancedsearchautocomplete_box ul li a:hover 
{
    background: #ffcc25;
}

#dvadvancedSearchFieldsContainer
{
    clear: both;    
    margin-top: 20px;
}

.btnAdvancedSearchRemoveCriteria
{
    position: absolute;
    right: -11px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}

.addNewCriteriaContainer
{
    margin-top: 20px; 
    text-align: center    
}

#btnAddNewCriteria
{
    width: 90%;
    background: transparent;
    color: #dbdcde;
    font-weight: bold;
    font-size: 11px;  
    border: solid 1px #434753;
    padding: 10px;   
}

#btnAdvancedSearch
{
    width: 90%;
    background: #348ee8;
    color: #ebebeb;
    font-weight: bold;
    font-size: 16px;  
    padding: 10px;   
    border: none;
}

.advancedSearchToggleSection
{
    margin-top: 20px;
    padding-left: 5%;
}

.advancedSearchToggleSection a
{
    color: #348ee8;
    font-size: 13px;
    cursor: pointer;
    margin-right: 6px;
}

.advancedSearchToggleSection a:hover
{
    color: #348ee8;
}

.dvAdvancedSearchCriteriaContainer {
    /*margin: 10px;*/
    margin-bottom: 20px;
}

.dvAdvancedSearchTitleContainer {
    font-size: 11px !important;
    color: #9F9F9F !important;
}

.dvAdvancedSearchOptions {
    border: 1px solid #444444;
    padding-top: 6px;
    padding-bottom: 6px;
    margin-top: 4px;
    padding-left: 12px;
}

#dvSearchOptionsContainer
{
    padding: 5%;    
}

.chkAdvancedSearchFields {
    font-size: 12px !important;
    color: #9F9F9F !important;
    border: 1px solid #444444;
    padding-top: 6px;
    padding-bottom: 6px;
    margin-top: 4px;
    padding: 0;
    padding-top: 6px;
    padding-bottom: 6px;
    list-style-type: none;
    padding-left: 12px;
    padding-right: 12px;
}

.chkAdvancedSearchFields::after {
    content:"";
    display:block;
    clear:both;
}

.chkAdvancedSearchFields li
{
    float: left;
    margin-right: 20px;
}

/*
.chkAdvancedSearchFields tr{
    display:inline-block;
    margin-right:20px;
}​

.chkAdvancedSearchFields tr label{
    margin-left:5px;
}

.chkAdvancedSearchFields tr * {
    vertical-align: middle;
    cursor: pointer;    
}
*/

.dvSearchLanguage {
    border: 1px solid #444444;
    padding-top: 6px;
    padding-bottom: 6px;
    margin-top: 4px;
    padding-left: 12px;
}

.dvAdvancedSearchTree
{
    border: 1px solid #444444;
    padding-left: 8px;
    margin-top: 4px;
}

.dvAdvancedSearchTree span.dynatree-icon
{
    display: none !important;    
}

span.dynatree-checkbox
{
    margin-top: -1px !important;    
}

/*---------------*/






/* Custom checkbox button */

/*
    Hide the original radios and checkboxes
    (but still accessible)

    :not(#foo) > is a rule filter to block browsers
                 that don't support that selector from
                 applying rules they shouldn't

*/
input[type='checkbox'] {

    /* Hide the input, but have it still be clickable */
    opacity: 0;
    display: none;
    float: left;
    width: 18px;
}

input[type='checkbox'] + label {
    margin: 0;
    clear: none;

    /* Left padding makes room for image */
    padding: 5px 0 4px 24px;

    /* Make look clickable because they are */
    cursor: pointer;

    background: url("Images/check-bt-uncheck.png") left center no-repeat;
}

/*
    Change from unchecked to checked graphic
*/
input[type='checkbox']:checked + label {
    background-image: url("Images/check-bt-check.png");
}

/* ------------------- */



/* Custom radio button */

/*
    Hide the original radios and checkboxes
    (but still accessible)

    :not(#foo) > is a rule filter to block browsers
                 that don't support that selector from
                 applying rules they shouldn't

*/
input[type='radio'] {

    /* Hide the input, but have it still be clickable */
    opacity: 0;
    display: none;
    float: left;
    width: 18px;
}

input[type='radio'] + label {
    margin: 0;
    clear: none;

    /* Left padding makes room for image */
    padding: 5px 0 4px 24px;

    /* Make look clickable because they are */
    cursor: pointer;

    background: url("Images/radio-bt-unselect.png") left center no-repeat;
}

/*
    Change from unchecked to checked graphic
*/
input[type='radio']:checked + label {
    background-image: url("Images/radio-bt-select.png");
}

/* ------------------- */

/* modal popup */

.modal-header {
    padding:9px 15px;
    border-bottom:1px solid #4c505c;
    background-color: #4c505c;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
     border-top-left-radius: 5px;
     border-top-right-radius: 5px;
 }
 
 .modal-backdrop {
    background-color: #fff;
}

.close 
{
    color: #fff;
    font-size: 26px;
    font-weight: normal;
    opacity: 1;
}

.modal-title {
    color: #fff;
}

.modalTextbox
{
    width: 100%;
    border: 1px solid #c9cace;    
    padding: 5px;
}

.modalButton {
    color: #dbdcde;
    background: #3b3f4c;
    margin-left: 2px;
    margin-right: 2px;
}

.modalButton:hover, .modalButton:focus, .modalButton:active, .modalButton.active
{
    color: #fff;
}

.vertical-alignment-helper {
    display:table;
    height: 100%;
    width: 90%;
    margin-left: 5%;
    pointer-events:none; /* This makes sure that we can still click outside of the modal to close it */
}
.vertical-align-center {
    /* To center vertically */
    display: table-cell;
    vertical-align: middle;
    pointer-events:none;
}
.modal-content {
    /* Bootstrap sets the size of the modal in the modal-dialog class, we need to inherit it */
    width:inherit;
    height:inherit;
    /* To center horizontally */
    margin: 0 auto;
    pointer-events: all;
}

/* ------------------- */


/* Upload popup */




#dvUploadItemsHeader {
    border-bottom: 1px solid #666;
    overflow: hidden;
    width: 100%;
    height: 20px;
    line-height: 20px;
}

.dvUploadItemsContainer {
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px;
    overflow: hidden;
    display: inline-block;
    display: block;
}

.dvUploadItemsContainerHeader {
    padding: 9px 15px;
    border-bottom: 1px solid #4c505c;
    background-color: #21232a;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    cursor: pointer;
}

.dvUploadItemsContainerHeaderDesc {
    color: #fff;
    font-size: 15px;
    margin: 0;
    line-height: 1.42857143;
}

.dvUploadItemsContainerHeaderTargetDesc {
    color: #fff;
    font-size: 15px;
    margin: 0;
    line-height: 1.42857143;
}

.btnCancelUploadSection {
    cursor: pointer;
    float: right;
    color: #fff;
    font-size: 26px;
    font-weight: normal;
    margin-top: -6px;
}

.dvUploadItemsContainerContent 
{
    background: #fff;
    max-height: 250px;
    overflow: hidden;
    overflow-y: auto;
}

.uploadItemContainer {
    position: relative;
    border-bottom: 1px solid #dbdcde;
    padding: 10px 15px;
}

.uploadItemContainer.copytoDownloadWorking.waiting {
    background-color: #ffffaa;
}

.uploadItemContainer.copytoDownloadWorking.copying {
    background-color: #ffffaa;
}

.uploadItemContainer.copytoDownloadWorking.cancelled {
    background-color: #cccccc;
}

.uploadItemContainer.copytoDownloadWorking.error {
    background-color: #ffbbbb;
}

.uploadFileName {
    display: block;
    overflow: hidden;
    white-space: nowrap;
    font-size: 14px;
    color: #4c505c;
}

.lbUploadProgress 
{
    float: left;
    overflow: hidden;
    white-space: nowrap;
    font-size: 12px;
    color: #94969d;
}

.uploadDescContianer {
    margin-right: 50px;
}

.uploadDescContianer::after {
    content:"";
    display:block;
    clear:both;
}

.dvUploadItemsContainerMetadata {
    min-width: 350px;
    float: left;
    height: auto;
    border-left: 1px solid #2b2e31;
}

.btnUploadCancel 
{
    float: left;
    width: 15px;
    height: 12px;
    background: url('images/uploadicons.png') no-repeat;
    cursor: pointer;
    margin-left: 8px;
}

.uploadWorking .btnUploadCancel{
    height: 16px;
    background-position: 0 -12px;
}

.copytoDownloadWorking .btnUploadCancel{
    height: 16px;
    background-position: 0 -12px;
}

/* ------------------- */

.lbSelectedItemSummary {
    margin-left: 8px;
    color: #ffcc25;
    font-size: 14px;
    font-weight: bold;
}

.lbClipboardItemSummary {
    margin-left: 8px;
    color: #348ee8;
    font-size: 14px;
    font-weight: bold;
}

.autocomplete_selectedItem
{
    background-color: #ffcc25 !important;
}


/* file copy items */

/*

#dvUploadItemsContainer
{
    display: none;
    background-color: #333;
    position:fixed; 
    bottom: 20px; 
    right: 440px; 
    width: 400px; 
    height: 200px; 
    border: 1px solid #666;
    z-index: 9999;
    overflow: auto;
}

#dvFileCopyItemsContainer
{
    display: none;
    background-color: #333;
    position:absolute; 
    bottom: 20px; 
    right: 20px; 
    width: 400px; 
    height: 200px; 
    border: 1px solid #666;
    z-index: 9999;
    overflow: auto;
}

#dvFileCopyItemsContainer ul
{
    list-style: none;
    padding: 10px;
    margin: 0;
    position: absolute;
    top: 20px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    overflow-y: scroll;        
}

#dvFileCopyItemsContainer ul li
{
    font-size: 12px;
}

#dvFileCopyItemsContainer ul li.waiting
{
    color: #CCCCCC;
}

#dvFileCopyItemsContainer ul li.copying
{
    color: #00CC00;
}

#dvFileCopyItemsContainer ul li.finished
{
    color: #BBBBBB;
}

#dvFileCopyItemsContainer ul li.cancelled
{
    color: #666666;
}

#dvFileCopyItemsContainer ul li.error
{
    color: #FF0000;
}

.fileCopyItemCancel
{
    margin-left: 5px;
    cursor: pointer;    
}

#dvFileCopyItemsHeader
{
    border-bottom: 1px solid #666;
    overflow: hidden;
	width: 100%;
	height: 20px;
	line-height: 20px;
}

#dvUploadItemsHeader
{
    border-bottom: 1px solid #666;
    overflow: hidden;
	width: 100%;
	height: 20px;
	line-height: 20px;
}

#lnkClearFinishedFileCopyItems
{
    float: left;
    font-size: 12px;
    cursor: pointer;
    color: #ccc;
    margin-left: 10px;
}

#lnkCloseFileCopyItems, #lnkCloseUploadItems
{
    float: right;
    font-size: 12px;
    cursor: pointer;
    color: #ccc;
    margin-right: 10px;
}

.fileCopyItemAlternate
{
    background-color: #404040;    
}

*/

/* ------------------ */

.btnCancelAllCopyToLocation {
    cursor: pointer;
    float: right;
    color: #fff;
    font-size: 26px;
    font-weight: normal;
    margin-top: -6px;
}

#btnClearCopyToLocation {
    cursor: pointer;
    float: right;
    color: #fff;
    font-size: 15px;
    font-weight: normal;
    margin-right: 10px;
    margin-top: 1px;
}

#btnClearCopyToLocation : hover {
    color: #ddd;
}

.uploadTargetPath
{
    clear: both;
    font-size: 12px;    
}

#dvCopyToLocationItems
{
    display: none;    
}

#dvAssetListPopup
{
    display: none !important;    
}

.dvLoginPageContainer
{
    float: none;
    background: #fff;
    border-radius: 4px;    
    padding-top: 20px;
    padding-bottom: 20px;
}

.dvProjectListHeader
{

}

.lbSelectProject
{
    font-size: 18px;
    color: #4c505c;
    margin-top: 20px;    
    text-align: center;
}

.btnSelectProject
{
    width: 90%;
    background: #3b3f4c;
    color: #dbdcde;
    font-size: 16px;  
    padding: 10px;   
    border: none;
}

.btnSelectProject:focus, .btnSelectProject:active:focus, .btnSelectProject.active:focus, .btnSelectProject:hover
{
    background: #54596B !important;
    color: #dbdcde !important;
}

.projectListDataList {
    width: 100%;
    text-align: center;
}

.dvProjectListItems
{
    margin-top: 24px;    
    width: 100%;
}

.projectListItem
{
    padding-bottom: 10px;    
}

.loginFooter 
{
    margin-top: 20px;
    bottom: 0;
    width: 100%;
    height: 60px;
    text-align: center;
    color: #82848d;
    font-size: 13px;
}

.loginFooter a
{
    color: #82848d !important;       
}

.btnSelectLanguage
{
    background: none;
    color: #82848d;
    font-size: 13px;
    font-weight: bold;
    padding: 10px;   
    border: none;
    margin-right: 4px;
    margin-left: 4px;
}

.btnSelectLanguage:focus, .btnSelectLanguage:active:focus, .btnSelectLanguage.active:focus, .btnSelectLanguage:hover
{
    background: #54596B !important;
    color: #dbdcde !important;
}

.selectedLanguage
{
    background: #4c505c !important;
    color: #fff !important;
}

.dvLanguageListContainer
{
    position: absolute;
    right: 20px;
    top: 20px;    
}

.tbLogin
{
    margin-top: 24px;
    width: 100%;
}

.tbLogin tr td
{
    padding: 4px;    
}

.tbLogin tr td input
{
    text-align: center;
}

.btnLogin
{
    width: 100%;
    background: #348ee8;
    color: #ebebeb;
    font-weight: bold;
    font-size: 16px;  
    padding: 14px;   
    border: none;
}

.btnCancel
{
    width: 100%;
    background: #82848d;
    color: #ebebeb;
    font-weight: bold;
    font-size: 16px;  
    padding: 14px;   
    border: none;
}

.btnCancel:hover
{
    background: #999;
    color: #ebebeb;
}

.btnLogin:focus, .btnLogin:active:focus, .btnLogin.active:focus, .btnLogin:hover
{
    background: #539FEC;
    color: #ebebeb;
}

.dvEmptyList
{
    padding: 40px 20px;    
    text-align: center;
}

.dvLogoutPageContainer {
    float: none;
    border-radius: 4px;
    margin-top: 10%;
    margin-bottom: 10%;
    padding-bottom: 20px;
}

.dvLogoutMessage {
    border-radius: 4px;
    background: #3b3f4c;
    margin-top: 30px;
    padding: 30px;
    text-align: center;
    color: #dbdcde;
    font-size: 14px;
}

.defaultPageNav a
{
    color: #c9cace !important;
    font-size: 12px;
    font-weight: bold;
    margin-top: 7px;
}

.defaultPageNav a:hover
{
    color: #EAEAEC !important;
    font-size: 12px;
    font-weight: bold;
}

.defaultPageNav .username
{
    color: #c9cace !important;
    font-size: 12px;
    margin-top: 7px;
    position: relative;
    display: block;
    padding: 10px 12px;
}

.divider-vertical-defaultPageNav {
    height: 20px;
    margin: 15px 9px;
    border-right: 1px solid #4c505c;
    border-left: 1px solid #4c505c;
}

.loginPageContainer
{
    padding-top: 5%;    
}







/* default page search box */

.searchBoxContainer
{
    margin-top: 50px;    
    margin-bottom: 16px;
}

.stylish-input-group .input-group-addon{
    background: white !important; 
}
.stylish-input-group .form-control{
	border-right:0; 
	box-shadow:0 0 0; 
	border-color:#ccc;
	font-size: 18px;
	height: 48px;
}
.stylish-input-group button{
    border:0;
    background:transparent;
}

/* -------------------- */


.defaultPageFooter 
{
    position: fixed;
    margin: 10px auto;
    bottom: 10px;
    left: 10px;
    right: 10px;
    text-align: center;
    color: #82848d;
    font-size: 13px;
}

.defaultPageFooter a
{
    color: #82848d !important;       
}

.scrtabs-tabs-fixed-container
{
    height: 52px !important;    
}

.scrtabs-tab-scroll-arrow
{
    color: #ffcc25;
    padding-top: 18px;
    height: 50px;
    border: none;    
}

.dvMetaDataContainer .nav > li > a
{
    width: 100px;
}

.scrtabs-tab-container
{
    height: 50px;    
}



/* metadata */

.grdMetaDataAll
{
    width: 100%;
}

.dvMetadataItems
{
    margin-top: 10px;
}

.grdMetaDataALL_text_box
{
	width: 97%;	
}

.grdMetaDataALL_memo_box
{
	width: 97%;
	border-style: solid;
	border-width: 1px;
	border-color: #000000;
}

.grdMetaDataAll input[type='text']
{
	border: 1px solid #666;
	color: #fff;
	background-color: transparent;
	margin-right: 2px;
	width: 90%;
	padding: 4px;
}

.grdMetaDataAll input[type='text']:focus
{
    outline: none;
}

.grdMetaDataAll select
{
	border-style: solid;
	border-width: 1px;
	border-color: #666;
	width: 100%;
	background-color: #222;
	color: #fff;
}

.grdMetaDataAll textarea
{
	border: solid 1px #666;
	background-color: transparent;
	color: #fff;
	width: 100%;
	font-size: 10pt;
}

.grdMetaDataAll table
{
	width: 100%;
}

.grdMetaDataAll td
{
	border-style: none;
	font-size: 13px;
	padding: 8px;
	border-bottom: 1px solid rgba(59, 63, 76, 0.6);
}

.grdMetaDataAll table td input[type='button']
{
    border: solid 1px #000000;
    margin-right: 10px;
    cursor: pointer;
}

.grdMetaData_label_cell
{
	width: 30%;	
	white-space: nowrap;
	color: #ddd !important;
	border: none !important;
}

.grdMetaData_label_cell_readonly
{
	width: 30%;	
	white-space: nowrap;
	color: #94969d !important;
	border: none !important;
}

.grdMetaData_header_row
{
    border-bottom: 4px solid #3b3f4c;
	white-space: nowrap;
	font-size: 13px;
	font-weight: bold;
	text-align: left;
	padding-left: 10px;
	height: 30px;
}

.grdMetaData_header_row th img
{
    margin-left: 4px;    
    margin-top: -2px;
}

.grdMetaData_title_header_row
{
	white-space: nowrap;
	font-weight: bold;
	text-align: left;
	padding-left: 10px;
}

.grdMetaData_title_header_row img
{
	cursor: pointer;
	float: right;
	margin-right: 5px;
}

.grdMetaData_title_header_row input[type='image']
{
	cursor: pointer;
	float: right;
	margin-right: 5px;
}

.grdMetaData_title_header_row span
{
	float: left;
    margin-left: 8px;
}

.grdMetaData_header_row a
{
	color: #ddd;
	text-decoration: none;
}

.grdMetaData_header_row a:hover
{
	color: #eee;
}

.grdMetaData_header_row_updateAll
{
	text-decoration: none;
	float: right;
}

.grdMetadata_header_rowPanel
{
    float: left;
}

.lnkEditMetadata {
    color: #ddd;
    cursor: pointer;
    white-space: pre-wrap;
    display: block;
}

.grdMetaData_editable
{
    
}

.grdMetaData_editable table td
{
    border: none !important;
    padding-left: 0 !important;
}

.basicInfoValueCell
{
    color: #ddd !important;
}

/* ---------------------- */

.btnMetadataSave
{
    background: #348ee8;
    color: #ffffff;
    padding: 4px 20px;   
    border: none;
}

.btnMetadataCancel
{
    background: #3b3f4c;
    color: #ffffff;
    padding: 4px 20px;   
    border: none;
}

#dvMarkerContainer
{
    position: relative;
    background: #2b2e38;  
    overflow: hidden;
}

#dvPlayerControls
{
    height: 64px;    
    line-height: 64px;
    background: #31343f;
    text-align: center;
}

.lbBI_objectName
{
    margin: 8px;
    font-size: 16px;    
}

.lbBI_subInfo
{
    margin: 8px;
}

.btn-player-controls {
    color: #A5A7AD;
    background-color: #262931;
    border-color: #262931;
    margin-right: 4px;
    margin-left: 4px;
}

.btn-player-controls:focus, .btn-player-controls:active:focus, .btn-player-controls.active:focus, .btn-player-controls:hover {
    background: #262931;
    border-color: #262931;
}

.icon-add-marker { 
  background-image: url("Images/marker.png");
  background-position: center center; 
  background-size: 12px 18px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-add-region { 
  background-image: url("Images/region.png");
  background-position: center center; 
  background-size: 15px 18px;
  height: 14px; 
  width: 14px;
  background-repeat: no-repeat;
}

.icon-forward { 
  background-image: url("Images/forward.png");
  background-position: center center; 
  background-size: 20px 18px;
  height: 14px; 
  width: 20px;
  background-repeat: no-repeat;
}

.icon-backward { 
  background-image: url("Images/backward.png");
  background-position: center center; 
  background-size: 20px 18px;
  height: 14px; 
  width: 20px;
  background-repeat: no-repeat;
}

.icon-next-frame { 
  background-image: url("Images/next-frame.png");
  background-position: center center; 
  background-size: 16px 18px;
  height: 14px; 
  width: 16px;
  background-repeat: no-repeat;
}

.icon-previous-frame { 
  background-image: url("Images/previous-frame.png");
  background-position: center center; 
  background-size: 16px 18px;
  height: 14px; 
  width: 16px;
  background-repeat: no-repeat;
}

.icon-play { 
  background-image: url("Images/play.png");
  background-position: center center; 
  background-size: 14px 18px;
  height: 14px; 
  width: 16px;
  background-repeat: no-repeat;
}

.icon-pause { 
  background-image: url("Images/pause.png");
  background-position: center center; 
  background-size: 14px 18px;
  height: 14px; 
  width: 16px;
  background-repeat: no-repeat;
}

#dvSaveScreenShotProgress
{
    margin-top: 20px;    
}

.updatePatientHeader
{
    background: #4c505c;
    height: 62px;
    line-height: 62px;
    font-size: 22px;
    color: #fff;
    padding-left: 22px;
}

.tbUpdatePatientCriterias
{
}

.tbUpdatePatientCriterias tr td
{
    padding: 8px;
}

.tbUpdatePatientCriteriaLabel
{
    font-size: 14px;
    font-weight: bold;
    color: #3b3f4c;    
}

.btnUpdatePatient
{
    background: #3b3f4c;
    color: #dbdcde;
    font-size: 14px;  
    padding: 10px;   
    border: none;
}

.btnUpdatePatient:hover
{
    color: #EDEEEF;
}

.patients_grid > tbody > tr > th, .patients_grid > tbody > tr > td
{
    border-top: none !important;        
}

.dvEmptyPatientList
{ 
	width: 100%;
	height: 100px;
	line-height: 100px;
	text-align: center;
	vertical-align: middle;	
}

.btnUpdatePatientSearch
{
    background: #3b3f4c;
    color: #dbdcde;
    font-size: 18px;  
    font-weight: bold;
    padding: 15px 15px;   
    border: none;
    height: 80px !important;
    margin-top: 20px;
}

.btnUpdatePatientSearch:hover
{
    color: #EDEEEF;
}

.dvUpdatePatientCriteriaContainer > div
{
    margin-top: 20px;    
}

.dvMarkerInOutTemplate
{
    position: relative;
    border: 1px solid #16171c;
}

.dvMarkerInOutTemplate .dvMarkerRegion
{
    position: absolute;
    top: 0;
    bottom: 0;
    background-color: rgba(230, 145, 40, 0.2);
}

.dvRegularMarkerTemplate
{
    position: relative;
    border: 1px solid #16171c;
    overflow: hidden;
}

.dvRegularMarkerTemplate .dvMarkerRegion
{
    position: absolute;
    top: 0;
    bottom: 0;
    border-left: 1px dashed #09be78;
}

.dvMarkInOutTemplate
{
    position: relative;
    border: 1px solid #16171c;
}

.dvMarkInOutTemplate .dvMarkerRegion
{
    position: absolute;
    top: 0;
    bottom: 0;
    background-color: rgba(52, 142, 232, 0.2);
}

.dvMarkerTemplateContainer.selected
{
    /*border: 2px solid yellow;*/
}

.selected.dvRegularMarker .dvMarkerHeader
{
    border-top-color: #09be78;
    border-bottom-color: #09be78;
}

.selected.dvRegularMarker .dvMarkerTemplate
{
    border-top-color: #09be78;
    border-bottom-color: #09be78;
}

.selected.dvMarkInOut .dvMarkerHeader
{
    border-top-color: #09be78;
    border-bottom-color: #09be78;
}

.selected.dvMarkInOut .dvMarkerTemplate
{
    border-top-color: #09be78;
    border-bottom-color: #09be78;
}

.selected.dvMarkInOut .dvMarkerHeader
{
    border-top-color: #348ee8;
    border-bottom-color: #348ee8;
}

.selected.dvMarkInOut .dvMarkerTemplate
{
    border-top-color: #348ee8;
    border-bottom-color: #348ee8;
}

.selected.dvInOutMarker .dvMarkerHeader
{
    border-top-color: #e69128;
    border-bottom-color: #e69128;
}

.selected.dvInOutMarker .dvMarkerTemplate
{
    border-top-color: #e69128;
    border-bottom-color: #e69128;
}

.selected .dvMarkerHeader .dvMarkerButtonsContainer
{
    display: block;
}

#dvSliderLine
{
    position: absolute;
    height: 50px;
    left: 100px;
    width: 100px;
    border: 1px dashed white;           
    border-top: none;
    border-bottom: none;
    top: -10px;
}

.removeRightBorder
{
    border-right: none !important;
}

.dvSliderLineContainer
{
    padding: 0px 6px;    
    visibility: hidden;
}


/*
.irs {
    height: 50px;
    background: transparent;
}

.irs-line
{
    height: 60px;
    top: 25px;
    background: transparent;    
}
*/

.thick-bar
{
    height: 75px;    
    position: relative;
}

.thick-bar .irs-line {
    /* Omer: bu 2 satir kalkarsa aradaki tiklama alani daraliyor. */
    /*
    height: 54px;
    top: -24px;
    border-top: 1px solid #3b3f4c;
    */
    
    height: 28px;
    top: 2px;
    
    
}

.irs-grid
{
    background: #000;
    bottom: 5px;
    border-top: 1px solid #3b3f4c;
}

.thick-bar .irs-line span
{
    display: none;    
}

.slider-no-bar .irs-line
{
    display: none;
}

.dvMarkInOut .dvMarkerHeaderHandle
{
    background-color: #348ee8;
}

.dvInOutMarker .dvMarkerHeaderHandle
{
    background-color: #e69128;
}

.dvRegularMarker .dvMarkerHeaderHandle
{
    background-color: #09be78;
}

.dvCurrentTimeContainer
{
    color: #888;
    font-size: 14px;
    font-weight: bold;
}

#lbCurrentTime
{
    color: #ffcc25;
}

#lbCurrentRecordTime 
{
    color: #ffcc25;
}

#dvMarkersSliderContainer
{
    visibility: hidden;    
}

.icon-marker-delete { 
    background-image: url("Images/marker-delete.png");
    background-position: center center; 
    background-size: 14px 14px;
    height: 14px; 
    width: 14px;
    background-repeat: no-repeat;
}

.icon-marker-download { 
    background-image: url("Images/marker-download.png");
    background-position: center center; 
    background-size: 14px 14px;
    height: 14px; 
    width: 14px;
    background-repeat: no-repeat;
}

.icon-cut { 
    background-image: url("Images/cut-24.png");
    background-position: center center; 
    background-size: 18px 18px;
    height: 19px; 
    width: 18px;
    background-repeat: no-repeat;
}

.icon-marker-edit { 
    background-image: url("Images/marker-edit.png");
    background-position: center center; 
    background-size: 14px 14px;
    height: 14px; 
    width: 14px;
    background-repeat: no-repeat;
}

.dvMarkerButtonsContainer
{
    display: none;
}

.dvMarkerDescription
{
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.dvInOutMarker .dvMarkerDescription
{
    color: #e69128;
}

.dvRegularMarker .dvMarkerDescription
{
    color: #09be78;
}

.dvMarkerDescriptionTime
{
    color: #82848d;
    font-size: 9px;
}

.dvMarkerDescriptionContainer
{
    margin-top: 8px;
    padding-left: 8px;
    overflow: hidden;  
}

.dvMarkerDescriptionContainer p
{
    margin: 0;
}

.dvMarkerGroupDescriptionContainer
{
    margin-top: -4px;
    padding-left: 4px;
    overflow: hidden;  
}

.dvMarkerGroupDescriptionContainer p
{
    margin: 0;
}

.dvMarkerTemplateContainer 
{
    clear: both;    
}

.txtEditMarkerTimeCode
{
    display: block;
    padding: 0px 12px;
    font-size: 26px;
    font-weight: bold;
    color: #4c505c;
    border: none;
    border-bottom: 1px dashed #21232a;
    width: 170px;
}

.lbEditMarkerDialog
{
    font-size: 11px;
    font-weight: bold;       
    color: #a5a7ad;
    text-indent: 12px;
}

.txtEditMarkerDescription
{
    background-color: #ededee;
    display: block;
    padding: 4px 12px;
    width: 100%;
}

.modal-header.model-edit-regular-marker
{
    background: #09be78;
    border-color: #09be78;
}

.modal-header.model-edit-inout-marker
{
    background: #e69128;
    border-color: #e69128;        
}

.modal-header.model-edit-mark-inout
{
    background: #348ee8;
    border-color: #348ee8;                
}

/* Trimmer Popup*/

.downloadProgress_lbHeader {
    font-size: 14px;
    color: #4c505c;
}

.downloadProgress_dvContainer {
    width: 100%;
    height: 5px;
    background-color: #4c505c;
    margin-top: 8px;
    margin-bottom: 8px;
}

.downloadProgress_dvProgress
{
	margin-top: 3px;
	width: 0%;
	height: 5px;
	background-color: #00CC99;
}

.downloadProgress_lbStatus
{
    font-size: 14px;
    color: #94969d;
	white-space: normal;
}

.downloadProgress_cancelButton
{
	cursor: pointer;
	float: right;
	font-size: 14px;
	text-decoration: none;
	color: #4a90e2;
}

.downloadProgress_openFolderButton
{
	font-size: 8pt;
	color: #fff;
	text-decoration: underline;
}

.trimProgress_downloadLink {
    color: #dbdcde;
    background: #3b3f4c;
}

.downloadProgress_lbTitle
{
    font-size: 18px;
    color: #ffffff;    
    background: #09be78;
    display: block;
    padding: 12px;
}

.icon-download-trimmed-part { 
    background-image: url("Images/download-trimmed-part.png");
    background-position: left center; 
    background-size: 20px 20px;
    height: 20px; 
    width: 20px;
    background-repeat: no-repeat;
}

.icon-send-to-parent { 
    background-image: url("Images/send-to-parent.png");
    background-position: center center; 
    background-size: 20px 20px;
    height: 20px; 
    width: 20px;
    background-repeat: no-repeat;
}

.icon-send-to-pacs { 
    background-image: url("Images/send-to-pacs.png");
    background-position: center center; 
    background-size: 20px 20px;
    height: 20px; 
    width: 20px;
    background-repeat: no-repeat;
}

.trimmer-button
{
    text-decoration: none;
    line-height: 24px;    
    padding-left: 0 !important;
    margin-right: 8px;
}

.trimmer-button span
{
    line-height: 20px;
    font-family: inherit;    
    float: left;
    margin-right: 8px;
}

.downloadProgress_dvButtonsContainer
{
    margin-top: 14px;    
}

/* -------------------------- */

.klaus
{
    margin-top: 8px !important;
    height: 20px;    
}

.fancybox-skin
{
    background: #444;    
}

.btn-add-bin
{
    padding-top: 5px;
    padding-bottom: 1px;
}

/* AssetDetailList */
/*--------------------------------------------------*/

.assetDetailList
{
	width:100%;	
	border: solid 1px #494949;
	white-space: nowrap;
	font-size: 11px;
	clear: both;
	color: #9f9f9f;
	background: #444855;
}

.assetDetailList tr
{
	white-space: nowrap;	
	/*
	border-right: 0px;
	border-top: 0px;
	border-left: 0px;
    */
	border: 2px solid #3b3f4c;
	padding-left: 10px;
	padding-right: 10px;
	font-size: 11px;
	font-weight: normal;
	outline: 1px solid transparent;
}

.assetDetailList td
{
	white-space: nowrap;
	font-size: 14px;
	color: #82848d;
	height: 44px;
	line-height: 44px !important;
	vertical-align: middle !important;
	padding: 0 8px !important;
}

.assetDetailList td a:hover
{
    color: #dbdcde !important;
}

.cmbDetailModeOptions li a:hover
{
    color: #262626 !important;
}

.assetDetailList th
{
	background-color: #4c505c;
	font-size: 13px;
	font-weight: bold;
	text-align: left;
	height: 36px;
	line-height: 36px;
	/*
	padding-top: 8px;
	padding-bottom: 8px;
    */
}

.assetDetailList th a[fieldID='1009']
{
	padding-left: 4px !important;
}


.assetDetailList th a
{
    color: #c9cace;
    cursor: pointer;
}

.assetDetailList th a:hover
{
    text-decoration: none;
}

.assetDetailList th img
{
    vertical-align: middle;
    margin-left: 8px;
}

/*
.assetDetailList_alternate
{
	background-color: #333;
	white-space: nowrap;
}
*/

.assetDetailList tr:not(:first-child):hover {
    /*cursor: pointer;*/
    background-color: rgba(76, 80, 92, 0.95);
    /*color: #ddd;*/
}

.assetDetailList_checkbox_header_cell
{
    width: 32px !important;    
}

.assetDetailList_buttons_header_cell
{
    width: 32px !important;    
}

.detailMode .dvAssetListDetailModeIconsContainer {
    height: 30px;
    float: right;
    margin: 0 0;
    white-space: nowrap;
}

.dvAssetListIconsContainer {
    height: 30px;
    float: right;
    margin: 0 0;
    /* max-width: 126px; */
}

.dvAssetListOptionsContainerHelper {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.table-responsive
{
    border: none !important;
}

.assetDetailList td[fieldID='1009']
{
    min-width: 200px;    
}

.lnkDetailModeObjectName
{
    color: #dbdcde;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    display: block;
}

.lnkDetailModeObjectName:hover
{
    text-decoration: none;
}



/*******************************/


/* select2 */

.select2-container--default .select2-selection--single
{
    background-color: transparent !important;    
    border: 1px solid #4c505c !important;
    color: #a5a7ad !important;
    outline: none !important;
}

.select2-container .select2-selection--single
{
    height: 34px !important;    
}

.select2-container--default .select2-selection--single .select2-selection__arrow
{
    height: 34px !important;    
}

.select2-container--default .select2-selection--single .select2-selection__rendered 
{
    color: #a5a7ad !important;
    text-align: center;
    height: 34px !important;
    line-height: 34px !important;
}

/*********************/

.dvFieldContainer
{
    margin-bottom: 16px;    
}

.lbFieldTitle
{
    display: block;
    font-size: 11px;
    font-weight: bold;    
    margin-bottom: 4px;
}

.textAreaMandatoryMetadata {
    background-color: transparent;
    display: block;
    padding: 4px;
    width: 100%;
    border: 1px solid #c9cace;
}

.mandatoryMetadata
{
    border: 1px solid #c9cace;
}

.inputDateField
{
    width: 100px;    
}

.inputDateTimeField
{
    width: 160px;    
}

.mandatoryMetadataError
{
    background: #FFDDDD;
}

.dicomPopupCriteriaContainer
{
    border: solid 1px #f1f1f2;
}

/* Attachments */

.dvAttachmentsContainer
{
    padding: 8px;
}

.dvAttachmentItemContainer {
    float: left;
    height: 124px;
    margin-bottom: 18px;
    margin-right: 18px;
    overflow: hidden;
    width: 138px;
    background-color: rgba(76, 80, 92, 0.55);
    position: relative;
}

.dvAttachmentImageContainer {
    height: 97px;
    overflow: hidden;
    position: relative;
    width: 138px;
    text-align: center;
}

.imgAttachmentThumbnail {
    position: relative;
    width: 138px;
    height: 97px;
    overflow: hidden;
}

.imgAttachmentThumbnail img {
    position: absolute;
    left: 50%;
    top: 50%;
    height: auto;
    width: 100%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
}

.dvAttachmentObjectName
{
    height: 28px;
    line-height: 28px;
    padding-left: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    padding-right: 8px;
}

.lbAttachmentName
{
    font-size: 10px;
    font-weight: 500;
    color: #dbdcde;       
}

.dvAttachmentHoverContainer {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    height: 97px;
    width: 138px;
    overflow: hidden;
    background-color: rgba(17, 18, 21, 0.7);
    text-align: justify;
    padding: 22px 12px;
    z-index: 100;
    text-align: center;
}

.dvAttachmentHoverContainer > div {
    width: 50px;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    zoom: 1;
    cursor: pointer;
}

.dvAttachmentHoverContainer > div > a {
    display: block;
    height: 40px;
    line-height: 40px;
    cursor: pointer;
}

.dvAttachmentHoverContainer > div > a > img {
    height: 20px;
}

.dvAttachmentHoverContainer > div > span {
    font-size: 9px;
    font-weight: bold;
    color: #dbdcde;
}

/****************/

.navBarHeader
{
    background-color: #21232a;    
}

.lnkSearch
{
    color: #777;
    float: left;
    margin-left: 4px;
    cursor: pointer;
}

.dvAdvancedSearchCriteriaContainer label
{
    font-size: 13px;
    color: #dbdcde;
    font-weight: normal;
}

@media only screen and (min-width : 480px)
{
    #dvAssetContainer .video-js
    {
        height: 450px;
        width: 100%;
        margin: 0 auto;
        background-color: #3b3f4c !important;
    }

    #dvAssetContainer.multiviewerContainer
    {
        height: 270px !important;
        overflow: auto;
    }

    #dvAssetContainer.multiviewerContainer .video-js
    {
        float: left;
        height: 248px !important;
        width: 440px !important;
        margin: 0 auto;
        background-color: #3b3f4c !important;
    }

    #dvAssetContainer.multiviewerContainer .dvPlayerContainer 
    {
        margin: 8px;
        display: inline-block;
    }

}


@media only screen and (max-width : 479px) 
{
    #dvAssetContainer .video-js
    {
        height: 200px;    
        width: 100%;
        margin: 0 auto;
        background-color: #3b3f4c !important;
    }
}

.center-text
{
    text-align: center;    
}

#dvAssets
{
    margin-top: 16px;    
}

.categoryHeader
{
    background: transparent;    
}

.btnCategoryMore
{
    width: 100%;
    background: transparent;
    color: #BDBEC1;
    font-size: 14px;
    border: solid 1px #434753;
    padding: 8px;
}

.btnCategoryMore:hover
{
    background: #3F4352;
    color: #BDBEC1;
    border: solid 1px #434753;
}

.scrtabs-tab-scroll-arrow:hover
{
    background: transparent;    
}

.lbOtherAssets
{
    color: #dbdcde;
    font-size: 21px !important;
}

.dvMultivieverHeader
{
    background: #4c505c;    
    padding: 8px;
}

.dvMultiviewerSliderContainer
{
    
}

.btnMultiviewerButton
{
    background: #3b3f4c;
    color: #dbdcde;
    font-weight: bold;
    font-size: 12px;  
    padding: 10px;   
    border: none;
}

.dvCameraContainer
{
    float: left;
    margin: 8px;
}

#dvCameraSection
{
    overflow: hidden;
}

.lbCameraTitle
{
    font-size: 21px;
    color: #dbdcde;    
}

#dvMultiviewerError
{
    display: none;    
}

.lbPlayerError{
    position: absolute;
    top: 50px;
    margin: 0 auto;
    width: 100%;
    text-align: center;
    font-size: 30px;
}

@media only screen and (min-width : 480px)
{
    #dvImageAssetContainer 
    {
        text-align: center;
        line-height: 450px;
        background-color: #434753;
    }
            
    #dvImageAssetContainer img
    {
        max-height: 400px;    
    }
}

@media only screen and (max-width : 479px) 
{
    #dvImageAssetContainer
    {
        line-height: 200px;
    }
            
    #dvImageAssetContainer img
    {
        height: 200px;    
    }
}

/* Black and white video */
.grayscale-video {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}

.icon-goto-asset { 
    background-image: url("Images/gotoparent.png");
    background-position: left center; 
    background-size: 20px 20px;
    height: 20px; 
    width: 20px;
    background-repeat: no-repeat;
}

#dvGotoAssetContainer {
    display: none;
    margin-top: 20px;    
}

.dvCategoriesTree {
    padding-left: 8px;
    position: absolute;
    top: 50px;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
}

.dvCategoriesTree span.dynatree-icon
{
    display: none !important;    
}

.dvCategoriesHeader {
    border-bottom: 1px solid #3b3f4c;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 50px;
    overflow: hidden;
    line-height: 50px;
    padding-left: 12px;
    padding-right: 12px;
    text-overflow: ellipsis;   
    white-space: nowrap;
}

.dvGroupMarkersRegion .dvRegularMarkerItem {
    position: absolute;
    top: 0;
    bottom: 0;
    border-left: 1px dashed #09be78;
    cursor: pointer;
}

.dvGroupMarkersRegion .dvRegularMarkerItem.selected {
    border-left: 2px dashed #ff9d14 !important;
}

.dvGroupMarkersRegion .dvRegularMarkerItem.found {
    border-left: 1px dashed #ffff00;
}

.dvGroupMarkersRegion .dvInOutMarkerItem
{
    position: absolute;
    top: 0;
    bottom: 0;
    background-color: rgba(100, 100, 100, 0.2);
    cursor: pointer;
}

.dvGroupMarkersRegion .dvInOutMarkerItem.selected
{
    background-color: rgba(100, 100, 100, 0.4);
}

.markerApproved {
    background-color: rgba(230, 145, 40, 0.2) !important;
}

.markerApproved.selected {
    background-color: rgba(230, 145, 40, 0.4) !important;
}

.icon-marker-approve { 
    background-image: url("Images/marker-approved.png");
    background-position: center center; 
    background-size: 14px 14px;
    height: 14px; 
    width: 14px;
    background-repeat: no-repeat;
}

.groupedMarkersContainer {
    position: absolute !important;
    left: 0;
    right: 0;
    bottom: 0;
    top: 564px;
}

.groupedMarkersContainer .dvMarkerHeader {
    height: 32px;
    line-height: 32px;
}

.groupedMarkersContainer .dvMarkerTemplate {
    height: 32px;
    margin-left: 0 !important;
}

.groupedMarkersContainer #dvMarkers {
    position: absolute;
    top: 132px;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: scroll;    
}

.groupedMarkersContainer #dvSliderContainer {
    margin-right: 8px;
    margin-left: 0 !important;
}

.icon-zoom-in { 
  background-image: url("Images/zoom-in.png");
  background-position: center center; 
  background-size: 18px 18px;
  height: 18px; 
  width: 18px;
  background-repeat: no-repeat;
}

.icon-zoom-out { 
  background-image: url("Images/zoom-out.png");
  background-position: center center; 
  background-size: 18px 18px;
  height: 18px; 
  width: 18px;
  background-repeat: no-repeat;
}

.icon-zoom-reset { 
  background-image: url("Images/zoom-reset.png");
  background-position: center center; 
  background-size: 18px 18px;
  height: 18px; 
  width: 18px;
  background-repeat: no-repeat;
}

.icon-grayscale { 
  background-image: url("Images/black-white.png");
  background-position: center center; 
  background-size: 18px 18px;
  height: 18px; 
  width: 18px;
  background-repeat: no-repeat;
}

.icon-loop-enabled { 
  background-image: url("Images/loop-enabled.png");
  background-position: center center; 
  background-size: 18px 18px;
  height: 18px; 
  width: 18px;
  background-repeat: no-repeat;
}

.icon-loop-disabled { 
  background-image: url("Images/loop-disabled.png");
  background-position: center center; 
  background-size: 18px 18px;
  height: 18px; 
  width: 18px;
  background-repeat: no-repeat;
}

.headerButton {
    background-size: 15px 15px !important;
    height: 15px !important;
    width: 15px !important;
}

.grdMetaData_header_row th
{
	color: #ddd;
	text-decoration: none;
	padding-left: 8px;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .dvMarkerButtonsContainer .btn {
        padding: 6px 6px !important;
    }
}

.basicInfoValueCell.actions {
    border: none !important;
}

.basicInfoValueCell.actions button {
    border: none !important;
}

.triggerCountsLabelHeaderRow {
    background: #3b3f4c;
}

.triggerCountsLabelHeaderRow td {
    width: 25%;
    color: #ddd !important;
}

.triggerCountsLabelHeader {
    
}

.triggerCountsHeader {
    text-align: center;
}

.triggerCountsLabelCell
{
	width: 25%;	
	white-space: nowrap;
	color: #94969d !important;
	border: none !important;
}

.triggerCountsValueCell
{
    width: 25%;
	white-space: nowrap;
	color: #94969d !important;
    border-bottom: 1px solid rgba(59, 63, 76, 0.6);
}

.triggerListLabelHeaderRow {
    background: #3b3f4c;
}

.triggerListLabelHeaderRow td {
    color: #ddd !important;
}

.triggerReportHeader {
    text-align: center;
}

.triggerReportLabelCell
{
	white-space: nowrap;
	color: #94969d !important;
	border: none !important;
}

.triggerReportValueCell
{
    vertical-align: top;
	white-space: nowrap;
	color: #94969d !important;
    border-bottom: 1px solid rgba(59, 63, 76, 0.6);
}

.triggerReportDescriptionCell
{
    white-space: pre-line;
	color: #94969d !important;
    border-bottom: 1px solid rgba(59, 63, 76, 0.6);
}

.triggerReportGroupNameCell
{
    vertical-align: top;
    white-space: pre-line;
	color: #94969d !important;
    border-bottom: none !important;
}

.triggerReportGroupSeperator td {
    background: #3b3f4c;
    padding: 0 !important;
    height: 4px;
}

.dynamicSearchView {
    
}

#dvDynamicSearchViewContainer {
    display: flex;
    padding: 8px 2px;
    float: left;
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}

#dvDynamicSearchViewContainer::-webkit-scrollbar {
    display: none;
}

#dvDynamicSearchViewContainer input {
    background: transparent;
    border: solid 1px #3b3f4c;
    width: 150px;
    height: 34px;
    line-height: 30px;
    padding-left: 4px;
    padding-right: 4px;
    margin-right: 4px;   
}

#dvDynamicSearchViewContainer button {
    background: #3b3f4c;
    border: solid 1px #3b3f4c;
    height: 34px;
    line-height: 30px;
    padding-left: 4px;
    padding-right: 4px;
    margin-right: 4px;   
}

#dvDynamicSearchViewContainer button:hover {
    background: #484a52;
}

#dvDynamicSearchViewContainer button:focus, button:active, button:active:focus {
    outline: 0 none;
}

#dvSimpleSearchViewContainer {
    float: left;
}

#dvDynamicSearchViewContainer.defaultPage {
    display: block !important;
    margin: 40px 0;
    background: #4c505c;
    border-radius: 8px;
    box-shadow: 0 1px 1px 0 rgb(46 89 110 / 22%);
    margin-bottom: 16px;
    padding: 30px;
    float: none;
    text-align: center;
}

#dvDynamicSearchViewContainer.defaultPage input {
    border: solid 1px #111;
}

#dvDynamicSearchViewContainer.defaultPage button {
    background: #111;
    margin: 4px 0;
}

#btnApproveAsset.approved {
    background: #339966;
    color: #eee;
}

#btnApproveAsset.approved:hover {
    background: #24a866 !important;
}

.lnkSendToPACSMenuItem.sent {
    background: #339966;
    color: #eee;
}

#btnRestore {
    margin-left: 8px;
}

.system_logs_grid_selected {
    background: #dbdcde;
}

input::-ms-clear, input::-ms-reveal {
    display: none;
}

.lbMarkerGroupName {
    margin-left: 4px;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .dvMarkerActionsContainer .btn {
        padding: 6px 6px !important;
    }
}

.dvMarkerActionsContainer {
    display: none;
}

.selectedRegularMarkerTriggerName {
    color: #09be78;
}

.selectedInOutMarkerTriggerName {
    color: #e69128;
}

div.groupedMarkersContainer::-webkit-scrollbar {
    height: 20px;
}

.flex-title {
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 1%;
    display: flex;
}

.detail-page-info-container {
    flex-grow: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 1%;
}

#dvAttachmentPlayer {
    overflow: hidden;
}

#dvSharedItemsList {
    max-height: 200px;
    overflow-y: auto;
}

.icon-copy { 
  background-image: url("Images/copy.png");
  background-position: center center; 
  background-size: 22px 22px;
  width: 22px;
  height: 22px; 
  background-repeat: no-repeat;
}

#btnCopyShareLink {

}

.sharedLinkTextBox {
    height: 40px;
}

.mosItemTextBox {
    
}

/* Prevent the text contents of draggable elements from being selectable. */
[draggable] {
  -moz-user-select: none;
  -khtml-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  /* Required to make elements draggable in old WebKit */
  -khtml-user-drag: element;
  -webkit-user-drag: element;
}

.pinMenuButton {
    position: absolute;
    right: 0px;
    top: 0px;
    padding: 2px 4px !important;
    background: transparent;
}

.icon-locked { 
    background-image: url("Images/lock.png");
    background-position: center center; 
    background-size: 18px 18px;
    height: 18px; 
    width: 18px;
    background-repeat: no-repeat;
}

.icon-unlocked { 
    background-image: url("Images/lock_open.png");
    background-position: center center; 
    background-size: 18px 18px;
    height: 18px; 
    width: 18px;
    background-repeat: no-repeat;
}

.dvEditMenuContainer .dropdown-menu {
    left: -120px;
}

#dicomWorklistPopup button, #dicomWorklistPopup input, #dicomWorklistPopup a {
    font-weight: bold !important;
}

.ui-datepicker-title {
    color: #000;
}

/* Vertical Timeline */

.dvTimeline {

    position: relative;
    padding: 0 30px;
    margin: 0 auto;
    max-width: 375px;
}

.dvTimeline::before {
    content: '';
    position: absolute;
    top: 0;
    height: 100%;
    left: 25px;
    width: 4px;
    background: #06bdcf;
    opacity: 0.5;
}

@media only screen and (min-width: 1170px) {
    .dvTimeline {
        /*
        margin-top: 3em;
        margin-bottom: 3em;
        */
    }

    .dvTimeline::before {
        left: 50%;
        margin-left: -2px;
    }
}

.timeline-container {

}

.timeline-container::after {
    content: '';
    display: table;
    clear: both;
}

.timeline-block {
    position: relative;
    margin: 2em 0;
}

.timeline-block:nth-child(even) {
}



.timeline-block:after {
    content: "";
    display: table;
    clear: both;
}

.timeline-block:first-child {
    margin-top: 0;
}

.timeline-block:last-child {
    margin-bottom: 0;
}

@media only screen and (min-width: 1170px) {
    .timeline-block {
        margin: 0;
    }

    .timeline-block:first-child {
        margin-top: 0;
    }

    .timeline-block:last-child {
        margin-bottom: 0;
    }
}

.timeline-img {
    position: absolute;
    top: 8px;
    left: 21px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
}

.timeline-img {
    background: #06bdcf;
}

@media only screen and (min-width: 1170px) {
    .timeline-img {
        width: 12px;
        height: 12px;
        left: 50%;
        margin-left: -6px;
        margin-top: 6px;
        /* Force Hardware Acceleration in WebKit */
        -webkit-transform: translateZ(0);
        -webkit-backface-visibility: hidden;
    }
}

.timeline-content {
    position: relative;
    margin-left: 60px;
    margin-right: 30px;
    background: #333C42;
    border-radius: 2px;
    padding: 1em;
    height: 80px;
}

.timeline-content:after {
    content: "";
    display: table;
    clear: both;
}

.timeline-content h2 {
    color: rgba(255, 255, 255, 0.9);
    margin-top: 0;
    margin-bottom: 5px;
}

.timeline-content p, .timeline-content .date {
    font-size: 14px;
}

.timeline-content .date {
    color: #4a4a4a; 
    display: inline-block;
}

.timeline-content p {
    margin: 1em 0;
    line-height: 1.6;
}

.timeline-content::before {
    content: '';
    position: absolute;
    top: 6px;
    right: 100%;
    height: 0;
    width: 0;
    border: 7px solid transparent;
    border-right: 7px solid #dbdcde;
}

@media only screen and (min-width: 768px) {
    .timeline-content h2 {
        font-size: 20px;
        font-size: 1.25rem;
    }

    .timeline-content p {
        font-size: 16px;
        font-size: 1rem;
    }

    .timeline-content .read-more, .timeline-content .date {
        font-size: 14px;
    }
}

@media only screen and (min-width: 1170px) {
    .timeline-content {
        color: white;
        margin-left: 0;
        padding: 1.6em;
        width: 44%;
        height: 80px;
        margin: 0;
    }

    .timeline-content::before {
        top: 13px;
        left: 100%;
        border-color: transparent;
        border-left-color: #dbdcde;
    }

    .timeline-content .date {
        position: absolute;
        width: 100%;
        left: 128%;
        top: 8px;
        font-size: 14px;
    }

    .timeline-block:nth-child(even) .timeline-content {
        float: right;
    }

    .timeline-block:nth-child(even) .timeline-content::before {
        top: 13px;
        left: auto;
        right: 100%;
        border-color: transparent;
        border-right-color: #dbdcde;
    }

    .timeline-block:nth-child(even) .timeline-content .read-more {
        float: right;
    }

    .timeline-block:nth-child(even) .timeline-content .date {
        left: auto;
        right: 128%;
        text-align: right;
    }
}

.timeline-block {
    margin-top: -4px;
}

.timeLineVideoItemContainer {
    border: solid 1px transparent;
}

.timeLineVideoItemContainer.selected {
    border: solid 4px #4d90e3;
}

.timeLineVideoItemContainer .imgPlay {
    position: absolute;
    width: 36px;
    height: 36px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
}

.listModeItemLink {
    cursor: pointer;
}

.listModeItemLink {
    cursor: pointer;
}

.listModeItemLink .imgPlay {
    visibility: hidden;
}

.listModeItemLink:hover .imgPlay {
    visibility: visible;
}

.timeLineVideoItemContainer .imgThumbnail {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.dvTimeline .lbDuration {
    text-align: center;
    position: absolute;
    top: 6px;
    right: 6px;
    background: #21232a;
    padding: 3px;
    font-size: 11px;
    font-weight: bold;
    border-radius: 2px;
    color: #ebebeb;
}

.dvTimeline .timeline-content-bottom {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: #000000aa;
    height: 20px;
    line-height: 19px;
}

.dvTimeline .timeline-item-record-date {
    color: #fff;
    float: right;
    font-size: 12px;
    padding: 2px;
}

/* ----------------- */

.alert {
    white-space: pre-line !important;
}

.transparentBackground {
    background-color: transparent;
}

.pt10 {
    padding-top: 10px;
}

.mr10 {
    margin-right: 10px;
}

.mr8 {
    margin-right: 8px;
}

.mt8 {
    margin-top: 8px;
}

.mt5 {
    margin-top: 5px;
}

.mr3 {
    margin-right: 3px;
}

.mt22 {
    margin-top: 22px;
}

.mt12 {
    margin-top: 12px;
}

.mt10 {
    margin-top: 10px;
}

.ml0 {
    margin-left: 0px;
}

.w48percent {
    width: 48%;
}

.d-none {
    display: none;
}

.d-flex {
    display: flex;
}

.settingsButton {
    color: #777;
    margin-top: 3px;
    margin-right: 3px;
}

.btn-search-fields-clear {
    padding-left: 8px;
    padding-right: 8px;
}

.fileCatalystDialogContent {
    height: 500px;
    overflow: auto;
    background: white;
}

.detailModeTemplate {
    float: left;
    margin-right: 4px;
    position: relative;
    width: 48px;
    height: 48px;
    overflow: hidden;
}

.detailModeGenericBinImage {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 60%;
    width: auto;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.detailModeAssetImage {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 100%;
    width: auto;
    -webkit-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.text-align-center {
    text-align: center !important;
}

.detailModeOptionsButton {
    color: #777;
    padding: 8px;
    margin-right: 8px;
}

.searchHeaderButton {
    float: left;
    margin-left: 5px;
    cursor: pointer;
}

.searchHeaderButtonText {
    font-size: 1.4em;
    margin-top: 15px;
}

.error-message {
    margin-top: 16px;
    margin-left: 8px;
    margin-right: 8px;
    text-align: center;
    font-size: 22px;
}

.chkSelectAllResults {
    margin-left: 18px;
}

.vjs-text-track-settings .vjs-modal-dialog-content {
    color: #000 !important;
}

.asset-filter-container > li {
    padding: 2px 8px;
}

.dropdown-divider {
    height: 0;
    margin: .5rem 0;
    overflow: hidden;
    border-top: 1px solid #e9ecef;
}

.btn-goto {
    white-space: nowrap;
    color: black;
}

.tab-content.dvMetadataItems {
    padding-left: 8px;
    position: absolute;
    top: 50px;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: auto;
}

.speechItemsContainer .speechSearchItem {
    position: absolute;
    bottom: 0px;
    background-color: rgb(255, 204, 0);
    width: 8px;
    height: 8px;
    cursor: pointer;
    z-index: 100;
    border-radius: 4px;
    margin-left: -4px;
}

.speechItemsContainer .speechItem {
    position: absolute;
    bottom: 0px;
    background-color: rgb(145, 181, 230);
    width: 8px;
    height: 8px;
    cursor: pointer;
    z-index: 90;
    border-radius: 4px;
    margin-left: -4px;
}

.speechItemsContainer {
    position: relative;
    height: 8px;
    margin: 0 6px;
    margin-top: -20px;
}

.lbArchivingNotCompleted {
    color: orange;
    font-weight: bold;
    border: dashed 2px;
    padding: 4px 8px;
}

.lbArchivingNotCompletedListItem {
    color: orange;
    font-weight: bold;
    border: dashed 2px;
    top: 60px;
    left: 4px;
    right: 8px;
    position: absolute;
    background: #333;
    line-height: 32px;
}

.context-menu-list {
    z-index: 9999 !important;
}

.context-menu-layer {
    z-index: 9998 !important;
}

span.dynatree-node.selectedItem > .dynatree-title {
    color: #ffcc25 !important;
}