/*======================================================================================== 
start:  GENERAL 
========================================================================================  */
html {
    min-height: 100vh;
    overflow: auto;
}

body {
    font-size: 13px;
    font-family: Roboto,arial,sans-serif;
    margin: 0px;
    padding: 0px;
    color: #333;
    /*height: 256px;*/
    /*position: relative;*/
    min-height: 100vh;
}

.globalDCMColor {
    background: #1C5280;
}

.globalFontSize {
    font-size: 13px !important;
}

#FormMain {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

#HeaderPanel {
    background-size: 100% 100% !important;
    background-color: #1a1f25;
    border-bottom: none !important;
    background-repeat: no-repeat;
    max-height: 120px;
}

.loginDefaultColor {
    background-color: #1f477a;
}


h1, h2, h3, h4, h5, h6, legend {
    font-size: 1.5em;
    color: #004577;
    font-variant: small-caps;
    text-transform: none;
    margin-bottom: 0px;
}


h1 {
    font-size: 1.6em;
    padding-bottom: 0px;
    margin-bottom: 0px;
}

h2 {
    font-size: 1.5em;
    font-weight: 600;
}

h3 {
    font-size: 1.2em;
}

h4 {
    font-size: 1.1em;
}

    h4.control-title {
        text-transform: uppercase;
        margin: 0;
    }

h5, h6 {
    font-size: 1em;
}


.canvas-banner-logo {
    margin-top: 0 !important;
}


.MainNavigation {
    margin-top: -1px !important;
}

    .MainNavigation li {
        border: 0px solid #aaa !important;
    }

#MainContentCenter {
    margin-top: -2px !important;
    min-height: 827px;
    border: none !important;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

    #MainContentCenter #ctlSearchView {
        flex-grow: 1;
        display: flex;
    }

center {
    width: 100%; /* Ensure full width */
    display: flex;
    flex-grow: 1;
}

#tbNav nav {
    margin-right: 0px !important;
    width: 206px !important;
    border: none !important;
}

    #tbNav nav ul li a {
        border-left: 1px solid #aaa !important;
    }

.active ul li a span {
    border-bottom: 1px solid #aaa !important;
}

#tbNav nav ul li.first a {
    border-left: none !important;
}

#tbNav nav ul li a span {
    border-bottom: 1px solid #aaa !important;
}
/*======================================================================================== 
end:  GENERAL
========================================================================================  */
/*======================================================================================== 
start:  TEXT
========================================================================================  */
.title-filename {
    color: #020e65 !important;
    font-weight: bold;
}

.title-count {
    color: gray !important;
    display: block;
}


/*======================================================================================== 
end:  TEXT
========================================================================================  */
/*======================================================================================== 
start:  IMAGE
========================================================================================  */
.img-thumbnail {
    display: inline-block;
    cursor: pointer;
    height: 85px;
    width: 100px;
}

    .img-thumbnail img {
        max-height: 85px;
        max-width: 100px;
        border-width: 0px;
    }

/*======================================================================================== 
start:  IMAGE
========================================================================================  */

/*======================================================================================== 
start:  CONTAINER
========================================================================================  */

.main-container {
    /*padding-bottom: 20px;*/
    height: auto;
    overflow: hidden;
    width: 100%;
}


#mainDiv {
    width: 100%;
    background-color: #fff;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
    display: flex;
    flex-direction: column;
    /*flex-grow: 1;*/
}

.viewer-img-container-asset {
    border: 1px solid #aaa;
    text-align: center;
    /*width: 920px;*/
    /*height: 700px;*/
    height: inherit;
    background-color: #F7F7F7;
    /*display: table-cell !important;*/
    vertical-align: middle;
    margin: 0 !important;
}


    .viewer-img-container-asset img {
        width: auto;
        height: auto;
        max-width: 900px;
        max-height: inherit;
    }

    .viewer-img-container-asset .image-doc {
        width: 640px;
        height: 450px;
    }


    .viewer-img-container-asset frame {
        width: 640px;
        height: 450px;
    }


.viewer-img-container-playlist {
    border: 1px solid #aaa;
    text-align: center;
    width: 710px;
    height: 510px;
}

    .viewer-img-container-playlist .image-doc {
        width: 710px;
        height: 510px;
    }

    .viewer-img-container-playlist img {
        width: auto;
        height: auto;
        max-width: 710px;
        max-height: 510px;
    }

    .viewer-img-container-playlist frame {
        width: 710px;
        height: 510px;
    }


.control-border {
    border: 1px solid #aaa;
}


#video-player-container {
    height: 100%;
    display: grid;
    grid-template-rows: 1fr min-content;
}

#tr-video-container {
    height: 700px;
}
/*======================================================================================== 
end:  GENERAL
========================================================================================  */
/*======================================================================================== 
start:  TABS 
========================================================================================  */
.main-container-tabs {
    border: 0 !important;
    background: none !important;
}

/*.ui-tabs-panel .ui-widget-content .ui-corner-bottom {
    border:1px solid gray !important;
}

.ui-state-default a {
    border: 1px solid #aaa;
    _background: black;
    text-decoration: none;
}

.ui-state-default a {
    color: white !important;
}

.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
    color: yellow !important;
}*/

/*======================================================================================== 
ends:  TABS 
========================================================================================  */

/*======================================================================================== 
start:  PLAYLIST 
========================================================================================  */
.playlist-carousel {
    border: 1px solid gray !important;
    height: 568px;
    width: 280px;
    padding: 2px !important;
}

    .playlist-carousel .divImg {
        clear: both;
    }

.playlist-list-container {
    border: 1px solid gray !important;
    height: 568px;
    width: 550px;
    padding: 2px !important;
}

.tab-playlist-viewer {
    width: 710px;
    height: 568px;
    border: 1px solid gray !important;
    padding: 2px !important;
}

.playlist-list-item {
    height: 120px;
}

.playlist-header input[type=text] {
    width: 240px;
    height: 24px;
    margin-left: 8px;
}

.playlistname {
    color: white;
    font-size: 14px;
    padding-top: 6px;
}


.hiliteDivImg {
    background-color: lightblue;
    padding: 6px;
}



/*Carousel*/
.playlist-carousel-container {
    width: 278px;
    height: 568px;
    overflow-y: scroll;
    overflow-x: hidden;
}

#CarouselPlaylist .playlist-carousel-container li {
    margin: 2px;
    width: 250px;
    height: 80px;
}

    #CarouselPlaylist .playlist-carousel-container li .divImg {
        width: 65px;
        cursor: pointer;
    }

/*#CarouselPlaylist .carouselPlaylist li .playlistname {
            margin: 2px 0px;
            margin-left: 72px;
        }

            #CarouselPlaylist .carouselPlaylist li .playlistname .editable {
                color: #e2e68e;
            }

    #CarouselPlaylist .carouselPlaylist .removePlaylistCarousel {
        color: #e24344;
    }*/


/*liststyle*/

.liststyle {
    height: 568px;
    overflow-y: auto;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
}

    .liststyle li {
        margin: 1px;
        cursor: pointer;
    }

        .liststyle li:nth-child(odd) {
            background: #ddd;
        }

        .liststyle li a {
            color: #e2e68e;
        }

    .liststyle .highlightPlayListItem {
        background: rgba(240, 250, 0, .2) !important;
    }

    .liststyle .left-cell, .liststyle .right-cell {
        display: table-cell;
    }

    .liststyle .right-cell {
        vertical-align: top;
        text-align: left;
        width: 100%;
        padding-left: 20px;
    }

    .liststyle .thumbnail {
        display: inline-block;
        cursor: pointer;
    }

    .liststyle .title-ref {
        color: gray;
        font-size: 13px;
        font-family: Tahoma;
        display: inline-block;
        text-decoration: none;
    }

    .liststyle .title-author {
        color: white;
        font-size: 13px;
        display: inline-block;
        text-decoration: none;
        margin: 2px auto;
    }

    .liststyle .removeLink {
        text-align: end;
        margin-right: 20px;
    }











/*======================================================================================== 
ends:  PLAYLIST 
========================================================================================  */





#appSettings {
    border-style: solid;
    border-color: white;
    border-width: 1px;
    width: 900px;
    margin: 0 auto;
    padding: 35px;
    margin-bottom: 150px;
}

.settingRow {
    margin-bottom: 20px;
}

.settingLabel {
    float: left;
    width: 60px;
}

.settingField {
    width: 300px;
}

#functionality {
    margin-top: 30px;
    color: #858587;
}

table#cphBody_ctlAdminConfiguration_GridViewDisplay tr:nth-child(odd) {
    background-color: #424242;
}

table#cphBody_ctlAdminConfiguration_GridViewDisplay th, table#cphBody_ctlAdminConfiguration_GridViewDisplay td {
    border: 1px solid #656565;
}

table#cphBody_ctlAdminConfiguration_GridViewDisplay th {
    background-color: #000;
}


#userprofileDiv {
    margin-top: 78px;
    margin-right: 5px;
    color: yellow;
    height: 20px;
}


.relativeparent {
    position: relative;
}

.refreshpage {
    position: absolute;
    right: 2px;
}

    .refreshpage img {
        width: 30px;
        height: 28px;
    }

#AssetUpload {
    margin-left: 7%;
    text-align: left;
}

/*------------------------------------ Users page ------------------------------------*/
#Users {
    margin-left: 7%;
    text-align: left;
}

    #Users .link-menu {
        margin-top: 20px;
    }

/*======================================================================================== 
start:  RESET VIEW 
========================================================================================  */

#resetPasswordView {
    width: 550px;
    /*height: 270px;*/
    margin: 100px auto 315px auto;
    /*border: solid 2px #787878;*/
    text-align: center;
}

    #resetPasswordView table td.tdTitle {
        text-align: center;
        height: 30px;
        vertical-align: middle;
        font-size: 12px;
        font-weight: bold;
        background-color: #c0c0c0;
        color: black;
    }

    #resetPasswordView table {
        font-size: 11px;
        width: 100%;
    }

        #resetPasswordView table td {
            padding: 4px 10px 4px 4px;
            padding-right: 0px;
            text-align: right;
        }

            #resetPasswordView table td.tdTop {
                vertical-align: top;
            }

    #resetPasswordView .bluebutton {
        margin-left: 10px;
    }


    #resetPasswordView .divUser {
        text-align: left !important;
        font-weight: bold;
    }

/*======================================================================================== 
start:  RESET VIEW 
========================================================================================  */

/*------------------------------------   
START - @@@LOGIN VIEW 
------------------------------------*/
#loginview {
    width: 440px;
    /*height: 240px;*/
    margin: 100px auto 315px auto;
    padding-bottom: 15px;
    border: solid 2px white;
    text-align: center;
}

    #loginview .table {
        display: table;
        border-collapse: collapse;
    }

    #loginview .tablerow {
        display: table-row;
    }

    #loginview .tablecell {
        display: table-cell;
    }

    #loginview .cellTitle {
        width: 440px;
        height: 30px;
        padding-top: 10px;
        text-align: center;
        font-size: 24px;
        font-weight: bold;
    }

    #loginview .cellLock {
        vertical-align: top;
        padding: 20px;
    }

    #loginview .login_inner_table {
        font-size: 11px;
        width: 100%;
        margin: 15px 15px 0 15px;
    }

    #loginview table td {
        padding: 4px 0px;
        text-align: right;
    }

    #loginview .tdError {
        padding: 0, 10px;
    }

        #loginview .tdError span {
            width: 270px;
            color: #fe6868;
        }

    #loginview .tdForgotPassword {
        text-align: right;
        margin-right: 25px;
        font-weight: bold;
    }


.login-view-control .cellTitle span {
    font-size: 24px;
}


.login-view input[type=password] {
    width: 190px;
}

.login-view {
    width: 440px;
    /*height: 240px;*/
    margin: 100px auto 315px auto;
    padding-bottom: 15px;
    border: solid 2px #c0c0c0;
    text-align: center;
}

    .login-view .table {
        display: table;
        border-collapse: collapse;
    }

    .login-view .tablerow {
        display: table-row;
    }

    .login-view .tablecell {
        display: table-cell;
    }

    .login-view .cellTitle {
        width: 440px;
        height: 30px;
        padding-top: 10px;
        text-align: center;
        font-size: 12px;
        font-weight: bold;
        background-color: #c0c0c0;
    }

    .login-view .cellLock {
        vertical-align: top;
        padding: 20px;
    }

    .login-view .login_inner_table {
        font-size: 11px;
        width: 100%;
        margin: 15px 15px 0 15px;
    }

    .login-view table td {
        padding: 4px 0px;
        text-align: right;
    }

    .login-view .tdError {
        padding: 0, 10px;
    }

        .login-view .tdError span {
            width: 270px;
            color: #fe6868;
        }

    .login-view .tdForgotPassword {
        text-align: right;
        margin-right: 25px;
        font-weight: bold;
    }




/**                   **/

/*------------------------------------   
START - @@@FORGOT PASSWORD 
------------------------------------*/
#ucforgotpassword {
    width: 440px;
    /*height: 200px;*/
    margin: 100px auto 315px auto;
    border: solid 2px white;
    text-align: left;
}

    #ucforgotpassword table {
        font-size: 11px;
        width: 100%;
    }

        #ucforgotpassword table td {
            padding: 4px 10px 4px 4px;
            text-align: right;
        }

            #ucforgotpassword table td.tdTitle {
                text-align: center;
                width: 100%;
                height: 30px;
                vertical-align: middle;
                font-size: 12px;
                font-weight: bold;
            }

            #ucforgotpassword table td.tdTop {
                vertical-align: top;
                padding: 20px;
            }

        #ucforgotpassword table .tdRight {
            padding: 0 10px 0 4px !important;
        }

    #ucforgotpassword .tdError {
        padding: 0, 10px;
    }

        #ucforgotpassword .tdError span {
            width: 270px;
            color: #fe6868;
        }


#UserLogin #loginControls {
    margin-top: 50px;
}

#UserLogin .registration {
    /*margin-top: -300px;*/
}

#UserLogin hr {
    width: 70%;
}

#UserLogin #loginparagraph {
    margin-left: 15%;
}

    #UserLogin #loginparagraph .left {
        width: 60%;
    }


#UserLogin table-cell {
    display: inline-block;
}

#UserLogin p {
    font-family: Verdana;
    font-size: 1.2em;
}

/*------------------------------------   
END - @@@LOGIN VIEW
------------------------------------*/

p {
    text-align: justify;
}

/*TermsCondition page*/
#termscondition {
    width: 60%;
    padding: 100px;
}

    #termscondition h4 {
        text-align: left;
        margin-left: 10px;
    }


.pagecontentarea {
    border: 1px solid white;
    padding: 20px;
    margin: 10px;
}

    .pagecontentarea p {
        padding: 10px;
        margin: 10px;
    }

#termscondition .pagecontentarea a {
    margin: -20px 20px;
}

/*About page*/
#about {
    width: 60%;
}

    #about h4 {
        text-align: left;
        margin-left: 10px;
    }

/*Contact page*/
#contactus {
    width: 75%;
}

    #contactus h4 {
        text-align: left;
        margin-left: 30px;
    }

    #contactus .contentarea {
        border: 1px solid white;
        padding: 0 20px;
        margin: 10px 30px;
    }

    #contactus h5 {
        text-align: left;
        margin: 10px;
        font-weight: bold;
    }

#map {
    width: 600px;
    height: 300px;
}

#contactus .left {
    width: 30%;
    padding: 0 15px 15px 55px;
}

#contactus .table-cell-spacing {
    margin: 0 10px;
}

#contactus fieldset {
    border: 0;
    padding: 0 !important;
    margin: 0 !important;
    float: left;
}


#contactus label {
    display: inline-block;
    margin: 2px 0;
    width: 80px;
    vertical-align: top;
}

#contactus input[type=text] {
    width: 280px;
    margin: 5px 5px;
}

#contactus textarea {
    height: 170px;
    width: 278px;
}

#contactus input[type=button] {
    margin: 20px 10px;
}

/*------------------------------------   
START - @@@SEARCH 
------------------------------------*/

#search .searchControl {
    margin: 100px 0;
}

#search .mainlogo {
    margin: 110px auto;
    text-align: center !important;
}

/*------------------------------------   
END - @@@SEARCH 
------------------------------------*/

#registration {
    margin: 50px auto;
}

    #registration fieldset {
        padding: 0 30px;
    }

    #registration #dialog-form {
        width: 600px;
        text-align: left;
    }

    #registration .floatright {
        margin-right: 15px;
    }

#myaccount {
    width: 60%;
    text-align: left;
}

    #myaccount h4 {
        text-align: left;
        margin: 5px 10px;
    }

    #myaccount hr {
        width: 94%;
    }

    #myaccount img {
        height: 120px;
        width: 120px;
    }

    #myaccount .pagecontentarea h4 {
        margin: -5px 0 5px 0;
    }

    #myaccount .pagecontentarea p {
        padding: 5px;
        margin: 5px;
    }

    #myaccount .pagecontentarea a {
        /*float: inherit !important;*/
        margin: 3px;
    }

    #myaccount .dataTables_length {
        display: inline-block !important;
        margin-right: 60%;
    }

    #myaccount .dataTables_filter {
        display: inline-block !important;
    }

    #myaccount .dataTables_info {
        display: inline-block !important;
        margin-right: 65%;
    }

    #myaccount .dataTables_paginate {
        display: inline-block !important;
    }

/*------------------------------------   
START - @@@ASSET 
------------------------------------*/

#Asset {
    /*margin-left: 5%;*/
    /*padding: 6px;*/
    text-align: left;
    margin-top: 10px;
}

    #Asset .center {
        /*margin-top: 10px;*/
    }

    #Asset .uploadarea {
        /*margin-top: 30px;*/
        /*text-align: left;*/
        padding-left: 15px;
    }

    #Asset #headerDiv, #Upload #headerDiv, #CurrentIntelligence #headerDiv {
        display: block;
        margin-top: 5px;
        text-align: center;
    }

    #Asset #viewerBody {
        text-align: left;
        /*min-height: 775px;*/
        height: 775px;
        display: grid;
        grid-template-rows: 1fr min-content;
    }

    #Asset .viewer-img-container-asset div {
        height: inherit;
    }

    #Asset .divClassTabs {
        width: 594px;
        height: auto;
    }

    #Asset .bottomrightcorner {
        margin-left: 540px;
    }

    #Asset .grayHr {
        width: 550px;
    }

.asset-top-left-area {
    /*float: left;*/
}

.asset-top-right-area {
    /*float: right;*/
    /*width: 659px;*/
}

.asset-width-250 {
    width: auto;
    overflow: visible;
}

/*------------------------------------   
END -  @@@ASSET 
------------------------------------*/

#assetAttribute .table-row {
    text-align: left;
}

#assetAttribute .properties {
    height: 46px;
}

/*------------------------------------   
START -  @@@CurrentIntelligence 
------------------------------------*/
#CurrentIntelligence {
    margin-left: 5%;
    text-align: left;
    margin-top: 10px;
}

    #CurrentIntelligence .table-container {
        margin-top: 20px;
    }

    #CurrentIntelligence .addtoplaylist {
        position: absolute;
        right: 0;
        margin-bottom: 10px;
        margin-right: 10px;
        display: inline-block;
    }

    #CurrentIntelligence #divCarousel {
        margin: 5px 25px;
        display: inline-block;
    }

    #CurrentIntelligence .topasset {
        text-align: center;
    }

    #CurrentIntelligence .wordwrap {
        max-width: 260px;
    }

    #CurrentIntelligence .divClassTabs {
        width: 395px;
        height: 256px;
    }

    #CurrentIntelligence .scrollDiv {
        width: 385px;
        height: 190px;
        margin-left: -15px;
        margin-top: -4px;
    }

    #CurrentIntelligence .bottomrightcorner {
        margin-left: 340px;
    }

/*------------------------------------   
END -  @@@CurrentIntelligence 
------------------------------------*/

/*Scrollbar style for UPLOAD control*/
#scroller.scrollbar {
    scrollbar-3dlight-color: gold;
    scrollbar-arrow-color: gray;
    scrollbar-base-color: #2E3134;
    scrollbar-darkshadow-color: gray;
    scrollbar-face-color: #2E3134;
    scrollbar-highlight-color: #2E3134;
    scrollbar-shadow-color: #7f858a;
}

#scroller::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

#scroller::-webkit-scrollbar-button {
    scrollbar-arrow-color: gray;
}

#scroller::-webkit-scrollbar-track {
    background: #7f858a;
}

#scroller::-webkit-scrollbar-track-piece {
    background: #2E3134;
}

#scroller::-webkit-scrollbar-thumb {
    border: 1px solid gray;
}

#scroller::-webkit-scrollbar-corner {
    background: #2E3134;
}

/* Top Assets */
#container-topasset {
    margin-top: 18px;
    padding: 0 27px;
    padding-bottom: 5px;
}

    #container-topasset .dropable {
        float: left;
        position: relative;
        width: 154px;
        height: 124px;
        margin: 3px;
        text-align: center;
    }

        #container-topasset .dropable img {
            width: 154px;
            height: 124px;
            cursor: pointer;
        }

    #container-topasset img.hilite {
        width: 150px;
        height: 120px;
        cursor: pointer;
    }

    #container-topasset .removetop {
        position: absolute;
    }

/* Default Thumbnail */
#container-defaultthumbnail {
    display: table-cell;
    vertical-align: middle;
    height: 450px;
    width: 154px;
}

    #container-defaultthumbnail .dropable img {
        max-width: 154px;
        max-height: 124px;
        width: auto;
        height: auto;
        cursor: pointer;
    }

/* Asset Attribute */

#assetAttribute .table-row {
    text-align: left;
}

#assetAttribute .bottomrightcorner {
    right: 25px !important;
}

.AssetAttributeFontStyle {
    font-family: Arial !important;
}

.grayHr {
    width: 380px;
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #666;
    margin: 1em 0;
    padding: 0;
}

.attributeHeader {
    margin-top: -10px;
}

#parentAttribute {
    position: absolute;
    cursor: pointer;
}

/* Remarks */
#RemarksControl {
    width: 400px;
    height: 204px;
    text-align: center;
    display: block;
    position: relative;
}

#remarksTxt {
    width: 360px;
    height: 146px;
    padding: 0 10px;
    text-align: justify;
    overflow: auto;
}

.remarksTxtBox {
    width: 360px;
    height: 170px;
}

/* AssetViewerInPage */
/*#viewerBody {
    display: inline-block;
    max-width: 640px;
}*/

/*#viewerBody img {
        max-width: 640px;
        max-height: 450px;
        cursor: pointer;
    }*/

#clickDiv {
    /*position: absolute;*/
    z-index: 1;
    margin-top: -40px;
    margin-left: 400px;
    font-size: 16px;
    color: #ff6201;
    font-weight: bold;
    cursor: pointer;
    display: none;
    text-decoration: underline;
}

    #clickDiv:hover {
        text-decoration: none;
    }

/*#imgDiv {
    display: block;
    width: 640px;
    height: 450px;
    text-align: center;
    position: relative;
}

    #imgDiv img {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
    }*/

.text-white {
    text-align: left;
    color: white;
}

.assetViewerWider #viewerBody {
    max-width: 800px;
}

    .assetViewerWider #viewerBody img {
        max-width: 800px;
    }

.assetViewerWider #imgDiv {
    width: 800px;
}

.hideDefaultThumbnail {
    display: none !important;
}

/* SearchControl */
#SearchUserControl {
    /*display: inline-block;*/
}

.searchInput {
    /*width: 600px;
    height: 24px;
    font-size: 18px;*/
}

.searchInputSpeechToText {
    width: 623px;
    height: 24px;
    font-size: 18px;
    /* position: absolute;
    margin-left: -289px;
    text-indent: 20px;*/
    margin-left: 2px;
    margin-top: -10px;
}

.btn-searchCCSpeechToText {
    margin-bottom: 18px;
}

.speedToText-search-icon {
    position: absolute;
    margin-top: 3px;
    z-index: 10;
    /* margin-left: -282px;*/
    color: gray;
    text-indent: -607px;
}

#searching {
    display: inline-block;
    width: 20px;
    height: 20px;
    margin-left: -25px;
}

    #searching img {
        width: 20px;
        height: 20px;
    }

.searchbutton {
    width: 22px;
    padding: 6px 26px;
    margin: -13px 0 !important;
}

.advancedbutton {
    width: 120px;
    font-size: 15px;
}

/*------------------------------------   
START - @@@USERPAGE 
------------------------------------*/

#tabs_CreateMeetings {
    width: 80%;
}

#roomscheduling {
    padding: 30px;
}

    #roomscheduling .left {
        float: left;
        margin-top: 50px;
    }

#search .mainlogo {
    margin: 110px auto;
    text-align: center !important;
}

/*------------------------------------   
END - @@@USERPAGE 
------------------------------------*/

/* attribute page*/
.default-font {
    font-size: 0.8em !important;
}

/* EditAttribute */
#loadingEditAttribute {
    text-align: center;
    margin-top: 15%;
}

    #loadingEditAttribute img {
        display: inline-block;
        width: 35%;
        height: 35%;
    }

    #loadingEditAttribute p {
        margin-left: 300px;
    }

#attributeFields .date, #attributeFields .textarea {
    width: 95%;
    margin-bottom: 15px;
}

#attributeFields select {
    margin-left: 10px;
    margin-bottom: 15px;
}

#attributeFields .textarea, #attributeFields select {
    background: none !important;
}


.wordwrap {
    white-space: pre-wrap; /* CSS3 */
    white-space: -moz-pre-wrap; /* Firefox */
    white-space: -pre-wrap; /* Opera <7 */
    white-space: -o-pre-wrap; /* Opera 7 */
    word-wrap: break-word; /* IE */
}

#Asset .wordwrap {
    max-width: 450px;
}


.playlist-link a {
    text-decoration: none;
}


.removePlaylist {
    position: absolute;
    right: 15px;
}

.propertyName {
    width: 180px;
}

/*------------------------------------  SearchAssetFilter  ------------------------------------*/

.link-menu {
}

ul.list-menu {
    font-size: 15px;
}

ul.list-hr-menu li {
    display: inline;
    list-style: none;
    padding-right: 15px;
}

ul.list-menu li {
    cursor: pointer;
}

    ul.list-menu li a {
        font-size: 13px;
        background: none;
        color: #636161 !important;
        text-decoration: none;
        font-weight: normal !important;
        text-transform: none !important;
    }

        ul.list-menu li a:hover {
            color: #e2e68e;
            text-decoration: none;
        }

        ul.list-menu li a.current-filter {
            color: #e2e68e;
            padding-bottom: 3px;
            border-bottom-width: 2px;
            border-bottom-style: solid;
        }



/*------------------------------------------------- End AdvanceSearch ------------------------------------------------*/

/*---------------------------  SearchAdvanced  ---------------------------------------------*/

#SearchAdvanced select {
    height: 30px;
    width: 180px;
    margin: 2px 0;
}

.searchadvanced-input-text {
    width: 168px;
}

#SearchAdvanced .dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: none !important;
    color: black;
}

#SearchAdvanced .advance_search_grid {
    border: 1px solid white;
    vertical-align: top;
    margin-bottom: 10px;
}

#AdvancedFilterListFirst, #AdvancedFilterListSecond {
    max-width: 1110px;
}

#SearchAdvanced .table-row {
    margin-bottom: 6px;
}



#SearchAdvanced .buttonClear {
    color: white;
    height: 36px;
    width: 100px;
    padding: 8px 20px;
}


#SearchAdvanced .advance_search_footer {
    display: block;
    position: relative;
}

    #SearchAdvanced .advance_search_footer span {
        font-weight: bold;
        font-style: italic;
        font-size: 14px;
        color: blue;
    }


    #SearchAdvanced .advance_search_footer .buttonsearch {
        position: absolute;
        right: 0;
        top: -10px;
        height: 20px;
    }


/*---------------------------  SearchAdvanced  ---------------------------------------------*/

#addFilter {
    display: inline-block;
    margin: 30px 0;
}

#AdvancedFilterList {
    width: 900px;
    text-align: initial !important;
    margin-bottom: 6px;
}


/*Attribute*/

#Asset #assetAttribute {
    height: 450px;
    width: 600px;
}

#assetAttribute {
    width: 400px;
    height: auto;
    text-align: center;
    display: block;
    position: relative;
}

.hideTabs {
    display: none;
}

/*.scrollDiv {
    height: 240px;
    overflow: auto;
}*/

.dvAttribName {
    margin-left: 10px;
}

.dvAttribValue {
    margin-left: 10px;
    margin-bottom: 5px;
}


/* --------------
START - @@@UPLOAD
-----------------*/

#Upload {
    _margin-left: 7%;
    padding: 6px;
    text-align: left;
    margin-top: 10px;
}

    #Upload .center {
        width: 1200px;
        margin: auto;
        margin-top: 10px;
    }

    #Upload #upload-modal {
        margin-top: 60px;
    }


    #Upload .table-row {
        padding-left: 30px;
    }

    #Upload #assetAttribute {
        height: 450px;
        width: 600px;
    }

    #Upload .divClassTabs {
        width: 594px;
        height: auto;
    }

    #Upload .bottomrightcorner {
        margin-left: 540px;
    }

.divClassTabs {
    background: #2e2e33 !important;
    border: 0px solid black;
}

    .divClassTabs .scrollDiv {
        width: 580px;
        height: 294px;
        margin-left: -15px;
        margin-top: -4px;
        overflow-y: scroll;
        overflow-x: hidden;
    }



/* --------------
END - @@@UPLOAD
-----------------*/
/*------------------------------------PLAYLIST------------------------------------*/
#PlayList {
    margin: auto;
    width: 1600px;
    text-align: left;
}

    #PlayList .table-container {
        margin-top: 20px;
    }

    #PlayList #PlaylistTabs .TitleText {
        margin-left: 15px;
    }

    #PlayList #PlaylistTabs .TitleCheckbox {
        margin: 10px;
        position: absolute;
    }

    #PlayList #assetviewer {
        height: 534px;
        width: 680px;
        padding-top: 50px;
        text-align: center;
        border: 1px solid #aaa;
    }

    #PlayList .text-menu {
        text-align: center;
        font-size: 1.2em;
    }

        #PlayList .text-menu a {
            padding-right: 10px;
        }

            #PlayList .text-menu a.active {
                color: yellow;
            }

    #PlayList #processes {
        margin-top: 10px;
    }

    #PlayList .backtosearch {
        margin-left: 0px;
        margin-bottom: 6px;
    }

textarea#additionaltext {
    width: 99%;
    height: 120px;
}
/*------------------------------------PROCESS LIST ------------------------------------*/

#ProcessList {
    margin-left: 9%;
    margin-top: 30px;
    text-align: left;
}

    #ProcessList #ProcessListSubmitControl {
        margin-top: 35px;
    }

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

#Support {
    min-height: 600px;
    /*min-width: 800px;*/
}

/*------------------------------------EXTERNAL PLAYLIST SUBMISSION ------------------------------------*/
#divExternalSubmitPlaylist span.col1 {
    display: inline-block;
    width: 10%;
}

#divExternalSubmitPlaylist span.col2 {
    display: inline-block;
    width: 50%;
}

#divExternalSubmitPlaylist span.col3 {
    display: inline-block;
    width: 30%;
}

#divExternalSubmitPlaylist span.col3-header {
    margin-left: -11px;
}

#playlist-requestList_wrapper {
    max-height: 300px;
    overflow-y: auto;
}

ul#requestList li {
    width: 100%;
}

.sumbit-playlist {
    text-align: right;
    padding-top: 3px;
}




/*DataGrid*/
.dt-container {
    _width: 95%;
    height: 100%;
    font-weight: normal;
    font-size: 14px;
    margin-bottom: 20px;
}



.dataTables_empty {
    visibility: collapse;
}


.search-header-container {
    margin-left: 7%;
    text-align: left;
}

    .search-header-container hr {
        _margin-top: 30px;
    }

    .search-header-container .link-menu {
        margin-top: 20px;
    }

    .search-header-container #lblFilter {
        color: gray;
    }

    .search-header-container .clientNav {
        color: #96bffc;
    }


.searchcontrol-container {
    margin-top: 16px;
}




#SearchAdvanced .tier2 {
    margin-left: 10px;
}


#search .link-menu {
    margin-top: 20px;
}

/*------------------------------------liststyle------------------------------------*/


#processtitle {
    color: #e2e68e;
    font-weight: bold;
}


.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
    cursor: pointer !important;
}


.table-cell-playlist {
    display: table-cell;
    padding: 0 6px;
    vertical-align: top;
}

/************ Carousel *********************/
.container-carousel {
    width: 640px;
    padding: 10px 3px;
    display: inline-block;
}

.carouselList img {
    cursor: pointer;
}

.playlist-name {
    color: white;
    font-size: 14px;
    text-align: center;
    cursor: pointer;
}



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


.divCarouselPlaylist {
    width: 260px;
    height: 610px;
}


    .divCarouselPlaylist .classUlPlaylistShared {
        margin-top: 2px;
        margin-right: 2px;
        width: 260px;
        height: 576px;
        overflow-y: scroll;
        overflow-x: hidden;
    }

        .divCarouselPlaylist .classUlPlaylistShared li {
            margin: 2px;
            width: 250px;
            height: 80px;
        }

            .divCarouselPlaylist .classUlPlaylistShared li .divImg {
                width: 65px;
            }

            .divCarouselPlaylist .classUlPlaylistShared li .playlistname {
                margin: 2px 0px;
                margin-left: 72px;
            }

                .divCarouselPlaylist .classUlPlaylistShared li .playlistname .editable {
                    color: #e2e68e;
                }

        .divCarouselPlaylist .classUlPlaylistShared .removePlaylistCarousel {
            color: #e24344;
        }




#divPermission {
    height: 584px;
    width: 680px;
    margin: 0;
    padding: 0;
    border: 1px solid #aaa;
    position: relative;
}

#spanPlaylistTitle {
    color: #e2e68e;
    font-weight: bold;
    text-align: center;
}


.TargetFolderAssetViewer {
    margin-top: 20px;
}

div.userEdit {
    /*color: white;*/
    display: table;
}

    div.userEdit .col {
        display: table-cell;
        width: 600px;
        margin: 10px 5px;
        vertical-align: top;
    }

    div.userEdit .colspan {
        display: table-caption;
    }

        div.userEdit .colspan input[type=text] {
            width: 79.2%;
        }

    div.userEdit .title {
        display: inline-block;
        width: 150px;
        margin: 6px;
    }

    div.userEdit input[type=text], div.userEdit input[type=password] {
        width: 350px;
    }

    div.userEdit select {
        width: 365px;
    }

    div.userEdit input {
        border-color: none;
    }

        div.userEdit input:invalid {
            border: 1px solid red;
        }

        div.userEdit input:invalid {
            border: 1px solid red;
        }


    div.userEdit #userphoto {
        display: inline-block;
        width: 110px;
        height: 160px;
        vertical-align: top;
        text-align: center;
        margin-left: 15%;
    }

        div.userEdit #userphoto img {
            width: 110px;
            height: 110px;
            border: 1px solid #aaa;
        }

        div.userEdit #userphoto a {
            color: #e2e68e;
            cursor: pointer;
        }

            div.userEdit #userphoto a.disabled {
                color: grey;
                cursor: default;
            }


/*COMMON TEXT STYLING
---------------------------------------------------------------------------*/
.bold {
    font-weight: bold;
}

.upper {
    text-transform: uppercase;
}

.center {
    text-align: center;
}

.block {
    display: block;
}
/*-------------------------------------------------------------------------*/


.loginLockedImage {
    background: url("/assets/img/object/locked.png") no-repeat;
    background-size: 70px 80px;
    width: 65px;
    height: 90px;
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #FFF !important;
}

/*UserGroups
----------------------------------------------------------------------*/
#usergroups .tableLayout {
    border-spacing: 15px;
}

    #usergroups .tableLayout .cell {
        text-align: left;
        vertical-align: top;
    }

#usergroups, #usergroups legend {
    color: white;
}

    #usergroups fieldset label {
        font-size: 1.0em;
        font-family: Calibri;
    }

        #usergroups fieldset label .lblGroup {
            font-weight: bold;
        }

        #usergroups fieldset label .lblTeam {
            font-weight: bold;
        }

    #usergroups fieldset#groupAdmin {
        width: 30%;
        text-align: left;
        padding: 10px 60px;
    }

        #usergroups fieldset#groupAdmin img {
            width: 16px;
        }

        #usergroups fieldset#groupAdmin label {
            margin: 10px 5px;
        }

        #usergroups fieldset#groupAdmin select {
            width: 220px;
        }

        #usergroups fieldset#groupAdmin textarea {
            width: 260px;
            height: 40px;
            margin: 10px;
        }


    #usergroups fieldset#groups label {
        margin: 0 25px 0 15px;
        padding: 10px;
    }

    #usergroups fieldset#users label {
        margin: 0 30px;
        padding: 10px;
    }

    #usergroups fieldset#teams label {
        margin: 0 25px 0 15px;
        padding: 10px;
    }

    #usergroups fieldset#userteam label {
        margin: 0 30px;
        padding: 10px;
    }

    #usergroups .ms-container {
        width: 90%;
        margin: auto;
    }

    #usergroups .custom-header {
        background-color: black;
        text-align: center;
        color: yellow;
    }

    #usergroups #groups .ms-selection, #usergroups #groups .ms-selectable {
        width: 300px;
        height: 300px;
    }

    #usergroups #groups1 .ms-selection, #usergroups #groups1 .ms-selectable {
        width: 300px;
        height: 320px;
    }

    #usergroups #users .ms-selection, #usergroups #users .ms-selectable {
        width: 300px;
        height: 300px;
    }

    #usergroups #teams .ms-selection, #usergroups #teams .ms-selectable {
        width: 300px;
        height: 340px;
    }


    #usergroups .ms-list {
        width: 99%;
        height: 96%;
    }

/*UserGroups -> Add Group Administration modal
----------------------------------------------------------------------*/
#addGroup {
    padding: 0px 30px;
    padding-top: 15px;
    padding-bottom: 50px;
    background-color: #c0c0c0;
    color: white;
    border: 1px solid #aaa;
}

    #addGroup label {
        display: inline-block;
        width: 100px;
    }

    #addGroup input {
        width: 240px;
        margin: 5px;
    }

        #addGroup input.invalid {
            border: 2px solid red;
        }

    #addGroup textarea {
        width: 240px;
        height: 60px;
        margin: 5px;
    }

    #addGroup a {
        margin: 5px;
    }

    #addGroup .right {
        position: absolute;
        right: 30px;
    }

        #addGroup .right:after {
            clear: both;
        }


.lblSelectedUser {
    font-weight: bold;
}
/*----------------------------------------------------------------------*/

#searchresult .thumbnail img {
    /*width: auto !important;
    height: auto !important;*/
}

.aglThumbView {
    width: auto !important;
    height: auto !important;
    max-width: 25px;
    max-height: 20px;
}

#Admin#attributeEditFolder {
    color: #fff;
}


.headerimage {
    height: 110px;
}


.tiers img.list_add {
    height: 20px;
    margin-left: 8px;
    vertical-align: middle;
    margin-top: -3px;
}

.tiers .href-tier {
    margin-left: 20px;
    cursor: pointer;
}

.tiersFolderAction {
    /*margin-left: 5px;*/
    font-size: large;
    /*padding: 5px;*/
}

    .tiersFolderAction:hover {
        background-color: #f5f5f5;
        border-radius: 5px;
    }

.tiersFolderIcon {
    color: black;
    font-size: large;
}

#tiers div.tierClient, div.tier2, div.tier3 {
    /*width: 255px;*/
}

#tiers div.tier2, div.tier3 {
    /*margin-left: -10px;*/
}
/*======================================================================================== 
start:  BACK TO SEARCH  
========================================================================================  */

/* Back to Search */
.backtosearch {
    display: inline-block;
    position: relative;
    _margin-left: -35px;
    /*padding-top: 10px;*/
}

/*======================================================================================== 
end:  BACK TO SEARCH  
========================================================================================  */


/*======================================================================================== 
start:  ADVANCE SEARCH  
========================================================================================  */

#SearchAdvanced .advance_search_header {
    display: block;
    width: 1112px;
    margin-left: 268px;
}

#SearchAdvanced .searchlink {
    margin-left: 440px;
    padding-right: 0px;
}


#SearchAdvanced .table-cell {
    display: table-cell;
    padding: 0 12px;
    vertical-align: top;
}


#AdvanceSearch {
    margin-left: 3%;
    text-align: left;
}

    #AdvanceSearch hr {
        margin-top: 30px;
    }

    #AdvanceSearch .hr-vertical {
        float: left;
        width: 0.3px;
        height: 485px;
        margin-top: 25px;
        margin-left: 18px;
    }

    #AdvanceSearch #btnGo {
        border: 1px solid white;
        display: block;
        width: 30px;
        padding-left: 15px;
        margin-top: 2px;
    }


/*======================================================================================== 
end:  ADVANCE SEARCH
========================================================================================  */
/*======================================================================================== 
start:  CONTROLS  
========================================================================================  */
.btn {
    border: 1px solid #4c4c4c !important;
    border-radius: .30em;
    background: #4c4c4c;
    font-size: 14px;
}

.btn-success {
    background-color: #4CAF50 !important;
    color: white !important;
    padding: 6px 10px;
    border: 0;
    text-decoration: none;
    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5) !important;
    -webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5) !important;
    -moz-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.5) !important;
    border-radius: 3px;
}

.btn-error {
    background-color: #c00f0f;
    color: white;
    padding: 6px 10px;
    border: 0;
    text-decoration: none;
}



/*link*/
.btn-link-primary {
    color: #004577;
    font-weight: bold;
    padding: 2px 30px;
    text-align: center;
    font-size: 14px;
    border-radius: .30em;
    text-decoration: none;
    background-color: white;
}


.btn-link-default {
    border-radius: .30em;
    background: #4c4c4c;
    padding: 5px 26px;
    cursor: pointer;
    color: white;
    text-decoration: none;
    font-weight: bold;
}

.btn-login-default {
    /*font-size:16px;
     width:180px; 
     height:26px;
     display:inline-block;*/
}

.btn-login-text {
    margin-left: 56px;
    padding-top: 16px;
}

.btn-link-error {
    color: #c00f0f !important;
}

.a-image-btn img {
    height: 24px;
    width: 24px;
}

.a-image-btn {
    color: #0078ff !important;
}

    .a-image-btn .text {
        color: #0078ff !important;
        position: absolute;
        margin-top: 6px;
    }

input:disabled, select:disabled, textarea:disabled {
    color: gray !important;
    background-color: whitesmoke;
}
/*======================================================================================== 
end:  CONTROLS  
========================================================================================  */

/*======================================================================================== 
start:  TIERS  
========================================================================================  */

.tier-container {
    /*display: table-row;*/
    /*width: 64%;*/
    /*height: auto;*/
    /* background-color: #c0c0c0; */
    color: #333;
    font-size: 13px !important;
}

#dvTiers {
    background-color: #d4d4d4;
    border-radius: 5px;
    padding-top: 5px;
}

.tiers {
    /*display: table-cell;*/
    padding: 0 5px;
    padding-left: 15px;
    padding-bottom: 4px;
    /*width: 799px;*/
}

    .tiers div {
        /*display: inline-block;*/
    }

.tierLbl {
    /*display: inline-block;*/
    display: table-row;
}


/*======================================================================================== 
end:  TIRES
========================================================================================  */
.title-isci {
    font-size: 12px;
    padding-bottom: 5px;
    text-decoration: none;
    cursor: pointer;
    width: 330px;
    overflow: hidden;
    max-height: 30px;
}

    .title-isci:hover {
        text-decoration: underline;
        color: blue;
    }


.title-datetime {
    font-size: 11px;
    padding-bottom: 5px;
    text-decoration: none;
    color: gray;
}



.linkAddToPlayList {
    color: #0078ff !important;
    text-decoration: none;
    cursor: pointer;
}



#jcarousel-pagination2 a {
    margin: 2px 8px;
    font-size: 14px;
    font-weight: bold;
    text-decoration: none;
}



.tf-carousel {
    height: 94px;
}

.tf-carousel-left-arrow {
    float: left;
    margin-top: 22px;
}

.tf-carousel-right-arrow {
    float: right;
    margin-top: 22px;
}



.dataTables_filter {
    margin-bottom: 4px;
}



/*======================================================================================== 
start:  DATATABLE  
========================================================================================  */

.dt-container a {
    color: #0078ff !important;
}


#assetGridList {
    color: #333 !important;
}

.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter, .dataTables_wrapper .dataTables_info, .dataTables_wrapper .dataTables_processing, .dataTables_wrapper .dataTables_paginate {
    color: #4c4c4c !important;
}

table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
    background-color: white;
}

table.dataTable thead tr:not(.zipHeader) {
    _background-color: #4c4c4c;
    background-color: lightslategray;
    color: #fff;
}

table.dataTable tbody tr {
    background-color: white;
}

table.dataTable.display tbody tr.even {
    background-color: #ddd;
}

table.stripe.dataTable tbody tr.odd, table.display.dataTable tbody tr.odd {
    background: white;
}

table.stripe.dataTable tbody tr.odd, table.display.dataTable sorting_1 {
    background: white;
}

table.dataTable.display tbody tr.even:hover {
    background-color: #ddd;
}

table.stripe.dataTable tbody tr.odd, table.display.dataTable tbody tr.odd:hover {
    background: white;
}


.dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #aaa !important;
}




/*======================================================================================== 
end:  DATATABLE
========================================================================================  */



/*======================================================================================== 
start:  MESSAGEBOX
========================================================================================  */



#messageBox {
    width: 380px;
    height: 250px;
    border: 1px solid #aaaaaa;
    text-align: center;
}

    #messageBox .msgBody {
        text-align: left;
        padding-left: 20px;
        margin: 0 auto;
        overflow-y: auto;
    }

    #messageBox input[type=text] {
        width: 70%;
        height: 16px;
    }

    #messageBox #divDiscussion {
        height: 160px;
        width: 360px;
        overflow-y: auto;
    }

    #messageBox ul {
        list-style-type: none;
    }

.nameDate {
    color: black;
    font-weight: bold;
}

.msgBody #sendmessage {
    margin-left: 5px;
}

/*======================================================================================== 
end:  MESSAGEBOX
========================================================================================  */

div.tableLayout {
    display: table;
}

    div.tableLayout .cell {
        display: table-cell;
    }


/*Team*/
#tabviewTeam {
    border-spacing: 15px;
    margin-top: 1%;
}

    #tabviewTeam .teamcrud fieldset {
        width: 90%;
        text-align: left;
    }

    #tabviewTeam .teamcrud .title {
        display: inline-block;
        width: 140px;
        margin: 3px;
    }

    #tabviewTeam .teamcrud select {
        /*width: 334px;*/
        margin: 3px;
    }

    #tabviewTeam .teamcrud input[type="text"] {
        /*width: 320px;*/
        margin: 3px;
    }

    #tabviewTeam .teamcrud textarea {
        height: 50px;
        /*width: 328px;*/
        margin: 3px;
    }

    #tabviewTeam fieldset.groups {
        text-align: left;
    }

        #tabviewTeam fieldset.groups .ms-container {
            width: 100% !important;
            height: 300px;
        }

            #tabviewTeam fieldset.groups .ms-container ul {
                height: 280px;
            }

        #tabviewTeam fieldset.groups .lblSelection {
            margin-left: 73px;
        }

/*RoomManagement*/
#tabviewRoomManagement {
    width: 94%;
    border-spacing: 15px;
    margin-top: 1%;
}

    #tabviewRoomManagement .cell {
        width: 40%;
        padding: 10px;
        vertical-align: top;
        border: 1px solid #aaa;
    }

    #tabviewRoomManagement .cellCRUD fieldset {
        width: 90%;
    }

    #tabviewRoomManagement .cellCRUD .title {
        display: inline-block;
        width: 140px;
        margin: 3px;
    }

    #tabviewRoomManagement .cellCRUD input[type="text"] {
        width: 320px;
        margin: 3px;
    }

    #tabviewRoomManagement fieldset.multi-select {
        text-align: left;
    }

        #tabviewRoomManagement fieldset.multi-select .ms-container {
            width: 100% !important;
            height: 300px;
        }

            #tabviewRoomManagement fieldset.multi-select .ms-container ul {
                height: 280px;
            }

        #tabviewRoomManagement fieldset.multi-select .lblSelection {
            margin-left: 73px;
        }


.cardComponent {
    border: 1px solid #aaa;
    box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;
    background-color: #f7f7f7;
    border-radius: 10px;
    padding: 20px;
}

/*Organization*/
#tabviewOrganization {
    border-spacing: 15px;
    margin-top: 1%;
}

    #tabviewOrganization .organizationcrud fieldset {
        width: 90%;
    }

    #tabviewOrganization .organizationcrud .title {
        display: inline-block;
        width: 120px;
        margin: 3px;
    }

    #tabviewOrganization .organizationcrud input[type="text"] {
        /*width: 344px;*/
        margin: 3px;
    }

    #tabviewOrganization .organizationcrud textarea {
        height: 50px;
        width: 350px;
        margin: 3px;
    }

    #tabviewOrganization fieldset.groups {
        text-align: left;
    }

        #tabviewOrganization fieldset.groups .ms-container {
            width: 100% !important;
            height: 300px;
        }

            #tabviewOrganization fieldset.groups .ms-container ul {
                height: 280px;
            }

        #tabviewOrganization fieldset.groups .lblSelection {
            margin-left: 45px;
        }

/*tabviewGroupManagement*/
#tabviewGroupManagement {
    border-spacing: 15px;
    margin-top: 1%;
}

    #tabviewGroupManagement .groupManagementcrud fieldset {
        width: 90%;
    }

    #tabviewGroupManagement .groupManagementcrud .title {
        display: inline-block;
        width: 120px;
        margin: 3px;
    }

    #tabviewGroupManagement .groupManagementcrud input[type="text"] {
        /*width: 344px;*/
        margin: 3px;
    }

    #tabviewGroupManagement .groupManagementcrud textarea {
        height: 50px;
        width: 350px;
        margin: 3px;
    }

    #tabviewGroupManagement fieldset.groups {
        text-align: left;
    }

        #tabviewGroupManagement fieldset.groups .ms-container {
            width: 100% !important;
            height: 300px;
        }

            #tabviewGroupManagement fieldset.groups .ms-container ul {
                height: 280px;
            }

        #tabviewGroupManagement fieldset.groups .lblSelection {
            margin-left: 45px;
        }

/*tabviewAccessRight*/
#tabviewAccessRight {
    border-spacing: 15px;
    margin-top: 1%;
}


    #tabviewAccessRight .accesscrud fieldset {
        width: 90%;
    }

    #tabviewAccessRight .accesscrud .title {
        display: inline-block;
        width: 120px;
        margin: 3px;
    }

    #tabviewAccessRight .accesscrud input[type="text"] {
        /*width: 344px;*/
        margin: 3px;
    }

    #tabviewAccessRight .accesscrud textarea {
        /*height: 50px;*/
        /*width: 350px;*/
        margin: 3px;
    }

    #tabviewAccessRight fieldset.groups {
        text-align: left;
    }

        #tabviewAccessRight fieldset.groups .ms-container {
            width: 100% !important;
            height: 300px;
        }

            #tabviewAccessRight fieldset.groups .ms-container ul {
                height: 280px;
            }

        #tabviewAccessRight fieldset.groups .lblSelection {
            margin-left: 45px;
        }


/*Job Order*/
#jobOrderDetail {
    /*width: 90%;*/
    border-spacing: 15px;
    margin: 10px 40px;
    text-align: left;
}

    #jobOrderDetail .cell {
        padding: 10px;
        vertical-align: top;
    }

        #jobOrderDetail .cell:first-child {
            width: 33%;
        }

        #jobOrderDetail .cell input[type=search] {
            width: 90%;
            margin-bottom: 10px;
        }

    #jobOrderDetail #search {
        position: relative;
    }

        #jobOrderDetail #search img {
            position: absolute;
            right: 33px;
            top: 1px;
            width: 25px;
        }


    #jobOrderDetail #jobList {
        list-style: none;
        height: 585px;
        overflow-y: auto;
    }


        #jobOrderDetail #jobList li {
            background-color: white;
            padding: 14px;
        }

            #jobOrderDetail #jobList li:nth-child(odd) {
                background-color: whitesmoke;
                padding: 14px;
            }


        #jobOrderDetail #jobList .title {
            font-weight: bold;
            font-size: large;
        }

        #jobOrderDetail #jobList .description {
            width: 90%;
            display: inline-block;
            padding-top: 10px;
        }

        #jobOrderDetail #jobList .select {
            position: relative;
        }

            #jobOrderDetail #jobList .select img {
                cursor: pointer;
                position: absolute;
                margin-left: 350px;
                width: 34px;
                margin-top: -48px;
            }

        #jobOrderDetail #jobList .date {
            text-align: right;
            width: 100%;
            display: inline-block;
        }

    #jobOrderDetail fieldset#jobDetails {
        /*padding: 0 30px;*/
    }

        #jobOrderDetail fieldset#jobDetails input, #jobOrderDetail fieldset#jobDetails textarea {
        }

    #jobOrderDetail fieldset label {
        /*display: inline-block;*/
        /*width: 100px;*/
    }

    #jobOrderDetail .assignedTeam {
        text-align: center;
    }

        #jobOrderDetail .assignedTeam select {
            margin: 0 5%;
            width: 35%;
        }


    #jobOrderDetail .table-modal-saving {
        margin: 20px;
    }

.table-modal-saving tr td {
    padding: 4px;
}

#jobOrderDetail .fieldset-settings {
    /*width: 400px;*/
    /*margin: 0px 20px;*/
}

    #jobOrderDetail .fieldset-settings legend {
        color: black;
    }


    #jobOrderDetail .fieldset-settings td {
        padding-left: 10px;
    }







.job_order #divClients {
    width: 94%;
    height: 300px;
    overflow-y: auto;
    padding: 0 20px;
    /*text-align: left;*/
}

    .job_order #divClients .cellImage {
        width: 20%;
    }

    .job_order #divClients figure {
        margin: 0;
    }

    .job_order #divClients input {
        width: 80% !important;
    }

.job_order .addmore {
    text-align: left;
}

.job_order .addmore {
    text-align: left;
}

    .job_order .addmore img {
        width: 20px;
    }


    .job_order .addmore .text {
        position: absolute;
        margin-top: 2px;
    }

.job_order #divError {
    display: inline-block;
    color: red;
}

.job_order .required {
    border: 1px solid red;
}

.job_order #divClients hr {
    width: 96%;
    margin: 5px 0;
    border-top: 1px solid #ccc;
}





label.selectLabel {
    display: block;
    height: 20px;
    text-align: center;
    font-weight: bold;
    margin-top: -15px;
    margin-bottom: 5px;
}

table.dataTable tbody tr.selected {
    background: #a6b3cd !important;
}


.ui-widget-header {
    /*border: 1px solid gray !important;*/
    background-color: #d4d4d4 !important;
}

.ui-state-default .ui-icon {
    background-image: none;
}


.browse-user-photo {
    color: #0078ff !important;
    text-decoration: underline;
}

.saving-status-text {
    color: blue;
}

.calendar-content-new {
    background-color: gray !important;
}


.datatable-selection {
    color: #0078ff !important;
}

.fc-unthemed td.fc-today {
    background-color: #339933 !important;
}


.search-tier-control-main {
    min-height: 750px;
    float: left;
}

.asset-search-filter-page {
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.searchtier_sidebar {
    height: 100%;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.25);
}

.search_content {
    display: table-cell;
    height: 100%;
}

.search-result-image-control-main {
    text-align: center;
    margin: auto;
    margin-top: 20px !important;
}


.search-filter-tiers {
    margin-top: 20px;
}

.search-filter-item-title {
    /*font-size: 14px;*/
    margin-bottom: 10px;
}

.comiseo-daterangepicker-triggerbutton.ui-button {
    min-width: 200px !important;
}

.search-item-view-main {
    /*width:1300px;*/
    margin-left: 50px;
    font-size: 12px;
    flex-grow: 1;
}

.search-taskit-control-container {
    /*width:1100px;*/
    margin-left: 70px;
}

    .search-taskit-control-container ul li {
        list-style-type: none;
        margin-bottom: 40px;
    }

        .search-taskit-control-container ul li a {
            text-decoration: none;
        }

        .search-taskit-control-container ul li .title {
            text-align: left;
            font-size: 14px;
            color: #1a0dab;
            line-height: 1.5;
        }

        .search-taskit-control-container ul li .author {
            text-align: left;
            color: #006621;
            font-size: 12px;
            line-height: 1.5;
        }

        .search-taskit-control-container ul li .description {
            text-align: left;
            color: #545454;
            font-size: 12px;
            line-height: 1.5;
            word-wrap: break-word;
        }

        .search-taskit-control-container ul li .metadata {
            text-align: left;
            color: gray;
        }



.search-all-control-container {
    margin-left: 20px;
}

    .search-all-control-container .detail {
        height: 90px;
    }

        .search-all-control-container .detail .webthumb img {
            width: 125px;
            height: 90px;
        }

        .search-all-control-container .detail .add-playlist {
            float: left;
        }

    .search-all-control-container .col-right {
        float: left;
        padding-left: 50px;
        _padding-top: 20px;
        /*width:850px;*/
    }

    .search-all-control-container ul li {
        list-style-type: none;
        margin-bottom: 20px;
        clear: both;
    }


        .search-all-control-container ul li .title {
            text-align: left;
            font-weight: 400;
            font-size: 14px;
            color: #767676;
            font-family: Arial;
            cursor: pointer;
            color: rgb(26,13,179)
        }

            .search-all-control-container ul li .title:hover {
                color: #1a0dab;
            }

.search-taskit-control-container ul li .navigation {
    color: #545454;
}

.search-all-control-container ul li .description {
    text-align: left;
    color: #545454;
    line-height: 1.4;
    word-wrap: break-word;
    clear: both;
}

.search-control-main-container {
    display: table !important;
    height: 100%;
}

.login-view-control {
    /*margin:221px;*/
    /*width:460px;*/
    /*height:460px;*/
    /*border: 1px solid gray;
    background-color:#F0F3F7;*/
}

    .login-view-control .table {
        margin: 40px;
    }

    .login-view-control .login_inner_table tr {
        margin-top: 50px;
    }

    .login-view-control .login_inner_table tr {
        height: 46px;
    }

.tdError {
    color: red;
}

#tabviewFile .teamcrud fieldset {
    width: 90%;
    text-align: left;
}

#tabviewFile .teamcrud .title {
    display: inline-block;
    width: 140px;
    margin: 3px;
}

#tabviewFile .teamcrud select {
    width: 334px;
    margin: 3px;
}

#tabviewFile .teamcrud input[type="text"] {
    width: 320px;
    margin: 3px;
}

#tabviewFile .teamcrud textarea {
    height: 50px;
    width: 328px;
    margin: 3px;
}

#tabviewFile fieldset.groups {
    text-align: left;
}

    #tabviewFile fieldset.groups .ms-container {
        width: 100% !important;
        height: 300px;
    }

        #tabviewFile fieldset.groups .ms-container ul {
            height: 280px;
        }

    #tabviewFile fieldset.groups .lblSelection {
        margin-left: 73px;
    }


/*TaskItAttribute*/
#tabviewTaskItAttribute {
    /*width: 94%;*/
    border-spacing: 15px;
    margin-top: 1%;
}

    #tabviewTaskItAttribute .teamcrud fieldset {
        width: 90%;
        text-align: left;
    }

    #tabviewTaskItAttribute .teamcrud .title {
        display: inline-block;
        width: 140px;
        margin: 3px;
    }

    #tabviewTaskItAttribute .teamcrud select {
        width: 334px;
        margin: 3px;
    }

    #tabviewTaskItAttribute .teamcrud input[type="text"] {
        width: 320px;
        margin: 3px;
    }

    #tabviewTaskItAttribute .teamcrud textarea {
        height: 50px;
        width: 328px;
        margin: 3px;
    }

    #tabviewTaskItAttribute fieldset.groups {
        text-align: left;
    }

        #tabviewTaskItAttribute fieldset.groups .ms-container {
            width: 100% !important;
            height: 300px;
        }

            #tabviewTaskItAttribute fieldset.groups .ms-container ul {
                height: 280px;
            }

        #tabviewTaskItAttribute fieldset.groups .lblSelection {
            margin-left: 73px;
        }


.ui-state-error {
    background-image: none !important;
    background-color: white !important;
}

#dialog-folder-form {
    overflow: hidden !important;
}






.search-folder-control-container {
    width: 1200px;
    margin-left: 100px;
    height: 540px;
}

    .search-folder-control-container .detail {
        height: 110px;
    }

        .search-folder-control-container .detail .webthumb img {
            width: 150px;
            height: 110px;
        }

        .search-folder-control-container .detail .add-playlist {
            float: left;
        }

    .search-folder-control-container .col-right {
        float: left;
        padding-left: 50px;
        _padding-top: 20px;
        width: 850px;
    }

    .search-folder-control-container ul li {
        list-style-type: none;
        margin-bottom: 20px;
        clear: both;
    }


.item-playlist-added {
    cursor: not-allowed;
    _width: 150px;
    /*float:left;*/
    color: gray;
    line-height: 1.5;
    color: gray !important;
}

    .item-playlist-added .add-image {
        background: url('../assets/img/controls/add-gray.png');
        position: absolute;
        margin-top: 2px;
        background-repeat: no-repeat;
        background-size: 15px;
        width: 20px;
    }

    .item-playlist-added .add-label {
        color: gray;
    }


.item-playlist-add {
    cursor: pointer;
    _width: 150px;
    float: left;
    color: green;
}

    .item-playlist-add .add-image {
        background: url('../assets/img/controls/add_circle_green.png');
        position: absolute;
        margin-top: 2px;
        background-repeat: no-repeat;
        background-size: 15px;
        width: 20px;
    }

.item-qnote-add {
    cursor: pointer;
    _width: 150px;
    /*float:left;*/
}

    .item-qnote-add .add-image {
        background: url('../assets/img/controls/application_default_icon.png');
        position: absolute;
        margin-top: 2px;
        background-repeat: no-repeat;
        background-size: 15px;
        padding-right: 2px;
        width: 20px;
    }

    .item-qnote-add .add-label {
        color: green;
        margin-left: 17px;
        /*float:left;*/
        padding-left: 2px;
    }

.item-qnote-added {
    cursor: not-allowed;
    _width: 150px;
    /*float:left;*/
}

    .item-qnote-added .add-image {
        background: url('../assets/img/controls/application_default_icon.png');
        position: absolute;
        margin-top: 2px;
        background-repeat: no-repeat;
        background-size: 15px;
        width: 20px;
    }

    .item-qnote-added .add-label {
        color: gray;
        /*margin-left:17px;*/
        /*float:left;*/
    }

.item-playlist-add .add-label {
    color: green;
    /*margin-left:17px;
    float:left;*/
    padding-left: 2px;
}




button[disabled], button[disabled]:hover, button[disabled]:active {
    color: white !important;
}

.search-item-result-label {
    float: left;
    color: #808080;
    margin: -30px 0px 20px 43px;
    font-size: 12px;
}

.id-search-item-add-playlist {
    text-align: right;
    /*margin-top: -18px;*/
    margin-right: 2%;
}

.add-edit-image {
    background: url('../assets/img/icon/edit.png');
    position: absolute;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 20px;
}

.item-edit {
    padding-right: 15px;
    float: left;
    cursor: pointer;
}

    .item-edit .add-label {
        padding-left: 25px;
    }

.add-download-image {
    background: url('/images/Download_button.jpg');
    position: absolute;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 25px;
}

.asset-download {
    /*width: 270px;*/
    background-color: #FBFBFB;
    /*padding-left: 10px;*/
    float: right;
    border-style: solid;
    border-color: #eeeeee;
    border-width: 1px;
    padding: 5px 10px;
    min-height: 32px;
    position: relative;
    z-index: 99;
}

.item-download {
    padding-right: 15px;
    float: left;
    cursor: pointer;
}

    .item-download .add-label {
        padding-left: 30px;
    }

.asset-list-refresh {
    cursor: pointer;
    width: 80px;
    background-color: lightslategray;
    height: 28px;
    padding-top: 5px;
    position: absolute;
    margin-left: 306px;
    color: white;
    border-radius: 3px;
    z-index: 1;
}

/*.asset-refresh-image{
    background:url('../assets/img/controls/btn-refresh.png');
    position:absolute;
    margin-left: -20px;
    background-repeat: no-repeat;
    background-size: 100%;
    width: 17px;
    padding-bottom: 3px;
    margin-top: 1px;
}*/

/*Folder Explorer*/

#asset-list-file-explorer-showBtn {
    text-align: left;
    margin-top: 40px;
    margin-left: -1.2rem
}

    #asset-list-file-explorer-showBtn span:hover {
        cursor: pointer;
        background-color: #eee;
    }

    #asset-list-file-explorer-showBtn span {
        border: 1px solid #ccc;
        width: 10px;
        font-family: "Font Awesome 5 Free";
        background-color: #f9f9f9;
        border-radius: 0 5px 5px 0;
        padding: 10px;
    }

        #asset-list-file-explorer-showBtn span::before {
            content: "\f07b";
            padding-right: 3px;
        }

        #asset-list-file-explorer-showBtn span::after {
            content: "\f101";
            font-weight: 900;
            font-size: 0.85em;
        }


#asset-list-file-explorer {
    background-color: #f9f9f9;
    border-radius: 0 0 5px 0;
    border: 1px solid #ccc;
    margin: 0px -0.5rem;
    margin-top: 35px;
    text-align: left;
    min-width: 200px;
    position: relative;
}

    #asset-list-file-explorer #hideBtn {
        position: absolute;
        right: -1px;
        padding: 0 5px;
        z-index: 50;
        margin-top: -20.5px;
        background-color: #f9f9f9;
        border: 1px solid #ccc;
        border-bottom: none;
        border-radius: 5px 5px 0 0;
        cursor: pointer;
    }

        #asset-list-file-explorer #hideBtn:hover {
            background-color: #eee;
        }

        #asset-list-file-explorer #hideBtn::before {
            font-family: "Font Awesome 5 Free";
            content: "\f100";
            font-weight: 900;
            font-size: 0.85em;
        }

    #asset-list-file-explorer #expand-to-target-folder {
        cursor: pointer;
        position: absolute;
        top: 8px;
        right: 8px;
        padding: 0 5px;
        border: 1px dotted;
        border-radius: 5px;
        z-index: 50;
    }

        #asset-list-file-explorer #expand-to-target-folder:hover {
            background-color: #eee;
        }

#asset-list-folder-tree {
    position: relative;
    padding-top: 10px;
}

    #asset-list-folder-tree ul {
        list-style: none;
        position: relative;
        left: 13px;
        font-size: 100%;
        width: 93%;
    }

        #asset-list-folder-tree ul li {
            padding: 0.13em;
            overflow: hidden;
            text-overflow: ellipsis;
        }

            #asset-list-folder-tree ul li .folder-list-item:hover {
                cursor: pointer;
            }

            #asset-list-folder-tree ul li.selected .folder-list-item {
                font-weight: 700;
                background-color: #add8e6;
                padding: 0 2px 2px 0;
                border-radius: 3px;
            }

            #asset-list-folder-tree ul li .folder-list-item::before {
                font-family: "Font Awesome 5 Free";
                content: "\f07b";
                padding-right: 4px;
                font-weight: 500;
            }

            #asset-list-folder-tree ul li .right-clicked,
            #asset-list-folder-tree ul li .context-menu-active,
            #asset-list-folder-tree ul li .folder-list-item:hover {
                background-color: #dfdfdf;
                padding: 0 2px 2px 0;
                border-radius: 3px;
            }

            #asset-list-folder-tree ul li .folder-list-item-navigate {
                cursor: pointer;
                padding: 2px;
            }

                #asset-list-folder-tree ul li .folder-list-item-navigate::before {
                    font-family: "Font Awesome 5 Free";
                    content: "\f054";
                    font-weight: 900;
                    padding-right: 6px;
                    vertical-align: middle;
                    font-size: 80%;
                }

            #asset-list-folder-tree ul li.expanded .folder-list-item-navigate::before {
                content: "\f078";
            }

            #asset-list-folder-tree ul li.empty .folder-list-item-navigate::before {
                visibility: hidden;
            }

/*Folder Explorer End*/

/*VIDEO ANALYTIC*/

.video-analytic .active {
    background-color: #FEF33D;
}

.video-analytic {
    height: inherit;
    overflow-y: scroll;
    width: 654px;
}

    .video-analytic span.content {
        text-align: left !important;
        float: left;
        margin-left: 10px;
    }

    .video-analytic span.time {
        font-weight: bold;
        text-align: left !important;
        float: left;
        margin-left: 10px;
        padding: 2px;
    }

    .video-analytic .thumbnail img {
        width: 100px;
        width: 80px;
    }

    .video-analytic tr {
        cursor: pointer;
    }


/*CLOSE CAPTION*/


.close-caption .active {
    background-color: #FEF33D;
}

.close-caption {
    height: inherit;
    overflow-y: scroll;
    /* width: 654px; */
}

    .close-caption span.content {
        text-align: left !important;
        float: left;
        margin-left: 10px;
    }

    .close-caption span.time {
        font-weight: bold;
        text-align: left !important;
        float: left;
        margin-left: 10px;
        padding: 2px;
    }


    .close-caption tr {
        cursor: pointer;
    }


.menu_link {
    /*display: inline;*/
    float: left;
}


.search-paging-item {
    margin-top: 20px;
    margin-left: 0px;
    clear: both;
}

#imgAdd {
    height: 20px;
    margin-bottom: -3px;
}

.table-form-fielset_style1 {
    height: auto;
}


.searchFilterText {
    display: flex;
    padding-left: 110px;
}

/*  ----------------------------------------------------------------------------------- */
/* DROP DOWN*/
.videoDurationBox {
    background-color: black;
    color: white;
    width: fit-content;
    /* height: 0px; */
    border-radius: 10px;
    padding: 0 4px;
    position: absolute;
    font-size: x-small;
    bottom: 6px;
    right: 5px;
}

.videoIconOnThum {
    position: absolute;
    /*top: 33%;
    right: 33%;*/
    color: white;
    font-size: xx-large;
    -webkit-text-fill-color: white; /* Will override color (regardless of order) */
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: black;
}

.linkedIcon {
    position: absolute;
    bottom: 10px;
    left: 3px;
    color: white;
    font-size: large;
    -webkit-text-fill-color: white;
    -webkit-text-stroke-width: 1px;
    -webkit-text-stroke-color: black;
}



.gridList_dropbtn {
    padding: 2px 10px;
    font-size: 20px;
    border: none;
    cursor: pointer;
}

.gridList_dropdown {
    position: relative;
    display: inline-block;
}

.gridList_dropdown-content {
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
    right: 20px;
    bottom: 0px;
}

    .gridList_dropdown-content a {
        color: black;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

        .gridList_dropdown-content a:hover {
            background-color: #f1f1f1
        }

/* .gridList_dropdown:hover .gridList_dropdown-content { */
/* display: block; */
/* } */

.gridList_dropdown:hover {
    background-color: #d1d1d1;
}


.hrefInsideDropdown {
    text-align: left;
    color: black;
}

.addedItemOnMenu {
    cursor: not-allowed !important;
    float: none !important;
    color: gray !important;
}

.assetRowSelected {
    background-color: lightblue !important;
}

#assetGridList_posted tbody td, #assetGridList_posted thead th {
    border: none;
    border-bottom: solid #EAEAEA 1px;
}

#assetGridList_posted tbody tr {
    cursor: pointer;
}

    #assetGridList_posted tbody tr:hover {
        background-color: #e3e3e3;
    }

#assetGridList_posted tbody td {
    padding: 12px 18px;
}

#assetGridList_posted thead th {
    background-color: white;
    color: #5c5c5c;
    font-weight: bold;
}

.alignLeftText {
    text-align: left;
    /*padding-left: 25px !important;*/
}

.datatableHeaderIcon {
    margin-right: 10px;
}

.editIcon {
    color: green;
}

.assetPageIcons {
    font-size: medium;
}

.removeDefaultLinkStyle {
    color: black;
    text-decoration: none;
}

.menu_item_x {
    border: 1px solid #D8D8D8;
    border-radius: 2px;
    position: relative;
}

    .menu_item_x > div {
    }

    .menu_item_x:hover {
        border-left: 5px solid #e60000;
        background-color: gainsboro;
    }

    .menu_item_x > div[sec="header"] {
        color: black;
        /*font-family: 'Carme', sans-serif;*/
        text-align: left;
        font-size: 14px;
        font-weight: 600;
    }

    .menu_item_x > div[sec="warning"] {
        color: #605E5C;
        /*font-family: 'Carme', sans-serif;*/
        font-size: 12px;
        height: 20px;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .menu_item_x > div[sec="detail"] {
        color: #605E5C;
        /*font-family: 'Orienta', sans-serif;*/
        font-size: 12px;
        text-align: left;
    }

    .menu_item_x > div[sec="dt_tm"] {
        /*font-style: italic;*/
        color: #005A9E;
        font-size: 10px;
        margin-top: 2px;
        text-align: left;
    }

    .menu_item_x > .actions-container {
        display: flex;
        justify-content: space-between;
        font-size: 10px;
        color: #666;
    }

        .menu_item_x > .actions-container > .latest-action {
            text-align: left;
        }

        .menu_item_x > .actions-container > .latest-action-time-ago {
            text-align: right;
        }


#taskitNoti_List {
    isolation: isolate;
    width: 300px;
    float: left;
    overflow-y: auto;
    height: 76px;
    scrollbar-face-color: #000000 !important;
    scrollbar-shadow-color: #2D2C4D !important;
    scrollbar-highlight-color: #7D7E94 !important;
    scrollbar-3dlight-color: #7D7E94 !important;
    scrollbar-darkshadow-color: #2D2C4D !important;
    scrollbar-track-color: #7D7E94 !important;
    scrollbar-arrow-color: #C1C1D1 !important;
}

#GroupBoxX {
    border: 1px solid #ccc !important;
    border-radius: 16px;
    width: 200px;
    margin-left: 5%;
}

#context_menux {
    display: none;
}


.styled-table {
    border-collapse: collapse;
    margin: 25px 0;
    font-size: 0.9em;
    font-family: sans-serif;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);
    max-width: 95%;
    border-width: 1px;
    border-style: solid;
}

    .styled-table thead tr {
        background-color: cornflowerblue;
        color: #ffffff;
        text-align: center;
    }

    .styled-table th,
    .styled-table td {
        padding: 12px 15px;
        width: 100%;
    }

    .styled-table tbody tr {
        border-bottom: 1px solid #dddddd;
    }

        .styled-table tbody tr:nth-of-type(even) {
            background-color: #f3f3f3;
        }

        .styled-table tbody tr:last-of-type {
            border-bottom: 2px solid #009879;
        }

        .styled-table tbody tr.active-row {
            font-weight: bold;
            color: #009879;
        }


#tablexyz {
    font-family: Arial, Helvetica, sans-serif !important;
    border-collapse: collapse !important;
    width: 100% !important;
}

    #tablexyz td, #tablexyz th {
        border: 1px solid #b0bdcf !important;
        padding: 8px !important;
    }

    #tablexyz tr:nth-child(even) {
        background-color: #f2f2f2 !important;
    }

    #tablexyz tr:hover {
        background-color: #e1dada !important;
    }

    #tablexyz th {
        padding-top: 12px !important;
        padding-bottom: 12px !important;
        text-align: left !important;
        background-color: #b0bdcf !important;
        color: white !important;
    }


/* Scroll BAR Design */
::-webkit-scrollbar-track {
    /*-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);*/
    background-color: #F5F5F5;
    border-radius: 10px;
}

::-webkit-scrollbar {
    max-width: 7px;
    background-color: #F5F5F5;
    height: 7px;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
    background-color: #DCDCDC;
}

.item-map-marker {
    cursor: pointer;
    float: left;
    color: blue;
    clear: both;
}

.image-tab-map-marker {
    position: absolute;
    bottom: 0;
}

.esri-basemap-gallery__item-container {
}

    .esri-basemap-gallery__item-container .esri-basemap-gallery__item {
        margin: 0;
        padding: 12px;
        border-bottom: 1px solid #dddddd;
    }

        .esri-basemap-gallery__item-container .esri-basemap-gallery__item:first-child {
            margin-top: 0;
        }

    .esri-basemap-gallery__item-container .esri-basemap-gallery__item-thumbnail {
        display: none;
    }

    .esri-basemap-gallery__item-container .esri-basemap-gallery__item-title {
        font-size: 0.9rem;
    }

.hidden {
    visibility: hidden !important;
}

#rfs-viewer-container {
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.25);
    height: 827px;
    overflow-y: auto;
}

.rfs-viewer-item {
    text-align: left;
}

.rfs-viewer-item-title {
    cursor: pointer;
    background: #DDDDDD;
    padding: 7px 20px;
    font-weight: bold;
    border-bottom: 2px solid #AAA;
}

    .rfs-viewer-item-title:hover {
        background: #CCCCCC;
    }

    .rfs-viewer-item-title .expandIcon::before {
        font-family: Font Awesome\ 5 Free;
        font-weight: 900;
        content: "\f054";
        float: right;
        font-size: small;
    }

    .rfs-viewer-item-title.expanded .expandIcon::before {
        content: "\f078";
    }

.rfs-viewer-item-content {
    padding: 0 !important;
}

.rfs-viewer-item-list {
    list-style: none;
}

    .rfs-viewer-item-list .menu_item_x {
        cursor: pointer;
        padding: 2px 10px;
        margin: 0;
    }

    .rfs-viewer-item-list .selected {
        background: gainsboro;
        border-left: 5px solid #e60000;
    }

    .rfs-viewer-item-list .menu_item_x:not(.selected):hover {
        background: gainsboro;
        border: 1px solid gainsboro;
    }

    .rfs-viewer-item-list li .rfs-item-title {
        font-weight: bold;
    }

#dashboard-map-container {
    position: relative;
}

#dashboard-taskit-iframe {
    position: relative;
}

.dashboard-map-btn {
    position: absolute;
    top: 45%;
    background: #fff;
    width: 27px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 2px solid #ccc;
}

.hide-map {
    left: 0;
    border-radius: 0 5px 5px 0;
    border-left: none;
}

.show-map {
    right: 0;
    border-radius: 5px 0 0 5px;
    border-right: none;
}

#layerListContainer {
    position: absolute;
    right: 15px;
    bottom: 59px;
}

    #layerListContainer .icon {
        height: 32px;
        width: 32px;
        background: #fff;
        display: flex;
        flex-flow: row nowrap;
        justify-content: center;
        align-items: center;
        cursor: pointer;
        padding: 7px;
        margin: 0;
        font-size: 14px;
        box-shadow: 0px 1px 2px 0px;
        transition: background-color 125ms ease-in-out;
    }

        #layerListContainer .icon:hover {
            background-color: #f3f3f3;
        }

        #layerListContainer .icon img {
            opacity: 65%;
        }

#layerList {
    display: none;
    background: #fff;
    padding: 10px;
    text-align: left;
    box-shadow: 0px 1px 2px 0px;
    width: 300px;
    min-height: 32px;
    max-height: 400px;
    overflow-y: scroll;
}

    #layerList .close-icon {
        position: absolute;
        top: 2px;
        right: 10px;
    }

        #layerList .close-icon::before {
            font-family: Font Awesome\ 5 Free;
            font-weight: 900;
            content: "\f00d";
            opacity: 75%;
            cursor: pointer;
        }

    #layerList .layer-title {
        display: flex;
        align-items: center;
        padding-bottom: 5px;
    }

    #layerList .layer-item {
        display: flex;
        padding-bottom: 5px;
        align-items: center;
        padding-left: 25px;
    }

    #layerList label {
        padding-left: 5px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

    #layerList input[type="checkbox"] {
        cursor: pointer;
    }

    #layerList .expand-icon::before {
        font-family: Font Awesome\ 5 Free;
        font-weight: 900;
        content: "\f0da";
        padding: 5px;
        margin-left: -5px;
        cursor: pointer;
    }

    #layerList .layer-container.expanded .expand-icon::before,
    #layerList .drm-container.expanded > .layer-title .expand-icon::before {
        content: "\f0d7";
    }

    #layerList .sk-chasing-dots {
        width: 20px;
        height: 20px;
        margin-top: 20px;
    }

.drm-layers-container {
    margin-left: 12px;
}

.fa-times-thin:before {
    content: '\00d7';
    cursor: pointer;
}

.h-100 {
    height: 100%;
}

#divSearchResultControl,
#divSearchResultVideoControl,
#divSearchResultImageControl {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.selected-item {
    outline: 3px solid #c8c7c1;
}

#previewView {
    text-align: start;
    position: fixed;
    top: 35px;
    right: 0;
    z-index: 10;
    height: 100%;
    background-color: #F0F0F0;
    border: 1px solid #c5c5c5;
}

    #previewView .preview-resize-handle {
        width: 3px;
        cursor: ew-resize;
        background-color: none;
        position: absolute;
        top: 0;
        left: -1px;
        bottom: 0;
    }

    #previewView #asset-preview-container ul {
        padding: 10px;
    }

        #previewView #asset-preview-container ul li {
            text-align: left;
            display: block;
            list-style: none;
            font-weight: bold;
            font-size: 14px;
        }

            #previewView #asset-preview-container ul li ul {
                display: block;
                margin: 15px;
                padding: 0px;
            }

                #previewView #asset-preview-container ul li ul li {
                    font-weight: normal;
                }

    #previewView #preview-panel-header {
        padding: .5em;
        display: flex;
        align-items: center;
    }

        #previewView #preview-panel-header #preview-panel-filename {
            font-weight: bold;
            font-size: 1.3em;
            word-break: break-word;
            margin-right: 5px;
        }

.preview-panel-actions {
    margin-left: auto;
    display: flex;
    gap: 0.5em;
    white-space: nowrap;
    align-items: center;
}

    .preview-panel-actions .preview-panel-btn {
        font-weight: bold;
        padding: .5rem;
        outline: 1px solid #aaa;
        border-radius: 5px;
        cursor: pointer;
    }

#previewView #asset-preview-container {
    padding: 0.5rem;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    background: #FBFBFB;
    border-radius: 5px;
}

    #previewView #asset-preview-container img {
        height: 100%;
        max-width: 100%;
        object-fit: contain;
    }

    #previewView #asset-preview-container video {
        max-width: 100%;
        max-height: 80vh;
        object-fit: contain;
    }

#previewView .close-btn {
    width: 27px;
    height: 27px;
    padding: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    margin-left: 5px;
}

    #previewView .close-btn:hover {
        background: #d1d1d1;
        border-radius: 8px;
    }



.search-result-limit-control {
    float: right;
    margin-right: 80px;
    display: flex;
    align-items: center;
    gap: 5px;
}

.search-preview-taskit-preview-content {
    width: 100%;
    font-size: 0.9rem;
}

    .search-preview-taskit-preview-content hr {
        width: 100%;
        font-size: 0.9rem;
        display: block;
    }

#multiSelectDropdown {
    display: none;
    background-color: #f9f9f9;
    width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
}

    #multiSelectDropdown a {
        color: #0078ff !important;
        padding: 12px 16px;
        text-decoration: none;
        display: block;
    }

        #multiSelectDropdown a:hover {
            background-color: #f1f1f1;
        }

/*VAPI chat box style*/
.vapi-btn {
    /*this is to disable bounce animation*/
    transform: none !important;
}

.vapi-chat-box {
    position: absolute;
    background: #fff;
    width: 400px;
    height: 500px;
    border: 2px solid #ccc;
    border-radius: 5px;
    padding: 5px;
    display: flex;
    flex-flow: column;
}

.vapi-chat-transcript-container {
    padding: 5px;
    border-radius: 5px;
    flex-grow: 1;
    overflow: auto;
}

.vapi-chat-input-container {
    display: flex;
    gap: 5px;
    padding: 5px;
}

.vapi-chat-send-button {
    background: #92b3ff;
    border: none !important;
}

.chat-message-container {
    border: 1px solid #ccc;
    border-radius: 5px;
    width: 100%;
    padding: 5px;
    margin: 5px 0;
}

    .chat-message-container.assistant {
        background: #fbf7e7;
    }

    .chat-message-container.user {
        background: #e7f1fb;
    }

.chat-message-sender {
    font-size: 0.7em;
    color: #777;
    font-weight: bold;
}

.chat-message {
    font-size: 0.9em;
    color: #333;
    margin-top: 5px;
}

.chat-timestamp {
    font-size: .75em;
    color: #888;
    text-align: end;
    font-style: italic;
}