/*#region These line for fix design of all browsers, my reset.css */
@font-face {
    font-family: NotoSans;
    src: url(../../fonts/NotoSans-Regular.ttf);
}

@font-face {
    font-family: NotoSansMedium;
    src: url(../../fonts/NotoSans-Medium.ttf);
}


* {
    font-family: NotoSans;
    font-size: 9pt;
}

.dxgvControl *, .dxpgControl *, .dxeBase {
    font: 8pt NotoSans !important;
    color: #3c5569;
}

body {
    overflow: auto;
    margin: 0;
    padding: 0;
    height: auto !important;
    height: 100%;
    width: 100%;
    min-height: 600px;
    min-width: 1000px;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    background: none repeat scroll 0 0 #FBFBFB !important;
}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video, input, textarea {
    margin: 0;
    padding: 0;
    white-space: normal;
    word-wrap: break-word;
    text-wrap: normal;
}

select {
    word-wrap: normal;
}



html {
}

#upUpdatePanel {
    height: 100%;
}

#fMainForm {
    height: 100%;
}

textarea {
    height: 60px;
    width: 180px;
    font-weight: normal;
    white-space: pre-line;
    overflow: auto;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

fieldset, img {
    border: 0;
}

address, caption, cite, code, dfn, em, strong, th, var {
}

ol, ul {
    list-style: none;
}

caption, th {
    text-align: left;
}

h1 {
    font-size: 24pt;
}

h2 {
    font-size: 18pt;
}

h3 {
    font-size: 14pt;
}

h4 {
    font-size: 12pt;
}

h5 {
    font-size: 10pt;
}

h6 {
    font-size: 8pt;
}

q:before, q:after {
    content: '';
}

abbr, acronym {
    border: 0;
}

input[type="image"]:hover {
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 147, 188, 0.88);
    -moz-box-shadow: 0px 0px 5px 0px rgba(0, 147, 188, 0.88);
    box-shadow: 0px 0px 5px 0px rgba(0, 147, 188, 0.88);
}

/*#endregion */

/*#region My Global Styles */

.pageContent {
    width: 100%;
}

.clear {
    clear: both;
    height: 0px;
}

.importantDisplayBlock {
    display: block !important;
}

.importantDisplayInline {
    display: inline !important;
}

.displayNone {
    display: none;
}

.hiddenPanel {
    overflow: hidden;
    display: block;
    margin: 10px 0px 10px 0px;
}

.floatToLeft {
    float: left;
}

.alignToLeft {
    text-align: left;
}

.floatToRight {
    float: right;
}

.floatToLeftWithRightPadding {
    float: left;
    padding-right: 5px;
}

.alignToRight {
    text-align: right;
}

div.marginVertical {
    margin-top: 5px !important;
    margin-bottom: 5px !important;
}

div.marginHorizontal {
    margin-left: 5px !important;
    margin-right: 5px !important;
}

div.marginVertical2 {
    margin-top: 10px !important;
    margin-bottom: 10px !important;
}

div.marginHorizontal2 {
    margin-left: 10px !important;
    margin-right: 10px !important;
}

div.marginVertical3 {
    margin-top: 15px !important;
    margin-bottom: 15px !important;
}

div.marginHorizontal3 {
    margin-left: 15px !important;
    margin-right: 15px !important;
}

div.contentPadding {
    padding: 5px !important;
}

.autoMargin {
    margin: auto;
}

.noMargin {
    margin: 0px !important;
}

.noVerticalMargin {
    margin-top: 0px !important;
    margin-bottom: 0px !important;
}

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

.autoPadding {
    padding: auto;
}

.noPadding {
    padding: 0px !important;
}

.noVerticalPadding {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

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

.noMarginNoPadding {
    margin: 0px !important;
    padding: 0px !important;
}

.overflowAuto {
    overflow: auto;
}

div.likeColumn {
    float: left;
    margin: 5px;
    overflow: visible;
}

div.likeColumnNoMargin {
    float: left;
    overflow: visible;
}

    div.likeColumn span, div.likeColumnNoMargin span {
        position: relative;
        top: 4px;
    }

    div.likeColumn select, div.likeColumn input[type="text"], div.likeColumnNoMargin select, div.likeColumnNoMargin input[type="text"] {
        position: relative;
        top: 2px;
    }

div.smallFont {
    font-size: 11px !important;
}

.softBorder {
    border: 1px solid #DDDDDD;
}

.darkBorder {
    border: solid grey thin;
    padding: 4px;
}

.whiteFont {
/*    color: white;
    background-color: #35B1FF;*/
}

/*#endregion */

/*#region First Load */

.pageContent {
    width: 100%;
    display: none;
}

#pageLoading {
    min-height: 2048px;
    width: 100%;
    text-align: center;
}

    #pageLoading .loading-bar-spinner {
        z-index: 10002;
        margin: 0 auto;
        margin-top: 200px;
        width: 128px;
        height: 128px;
    }

        #pageLoading .loading-bar-spinner .spinner-icon {
            width: 128px;
            height: 128px;
            border: solid 10px transparent;
            border-top-color: #29d;
            border-left-color: #29d;
            border-radius: 50%;
            -webkit-animation: loading-bar-spinner 400ms linear infinite;
            -moz-animation: loading-bar-spinner 400ms linear infinite;
            -ms-animation: loading-bar-spinner 400ms linear infinite;
            -o-animation: loading-bar-spinner 400ms linear infinite;
            animation: loading-bar-spinner 400ms linear infinite;
        }

/*#endregion */

/*#region Header */

.header {
    width: 100%;
    display: inline-block;
    padding: 10px 25px;
    background-color: #ebf0f0;
}

.headerLeft {
    float: left;
    text-align: left;
    margin-right: 50px;
}

.topMenuContainer {
    float: left;
    display: inline-table;
}

.headerRight {
    float: right;
    text-align: right;
}

#notificationWrapper {
    position: absolute;
    right: 440px;
    top: 13px;
    width: 35px;
    height: 35px;
}

.testSite {
    color: #F00;
    font-size: 28px;
    left: 50%;
    position: fixed;
    top: 0px;
    z-index: 1000;
    width: 150px;
    margin-left: -75px;
    text-align: center;
}

.headerInformaitons {
    float: left;
}

.lbSecurityOfPersonelDataURL {
    Color: White;
    float: left;
    margin: 9px;
}
.txtDX {
    position: absolute;
    top: -100px;
    left: -100px;
    width: 1px;
    height: 1px;
}
/*.headerInformaitons .headerInformaitonsContent {
    color: #EEE;
    width: 120px;
    display: table;
    height: 56px;
    overflow: auto;
    padding: 2px;
    text-align: left;
    vertical-align: middle;
    float: left;
    margin: 0 auto;
}*/
.profileIcon {
    float: left;
    display: flex;
    margin-right: 45px;
    width: 270px;
    text-align: left;
}

    .profileIcon span, .profileIcon span b {
        font-family: NotoSans;
    }

.openProfile {
    color: #3C5569 !important;
}

    .openProfile img {
        margin: 0 7px 0 0
    }

.exit {
    background: url(../../images/logout.png) no-repeat;
    width: 35px;
    height: 35px;
    background-size: contain;
    border: none;
    outline: none;
    float: right;
}

.headerInformaitons .headerInformaitonsContent #userInformationPanel {
    display: block;
    position: absolute;
    top: 65px;
    right: 5px;
    padding: 10px;
    background-color: #222;
    -webkit-box-shadow: 2px 2px 12px rgba(161, 161, 161, 0.6);
    -moz-box-shadow: 2px 2px 12px rgba(161, 161, 161, 0.6);
    box-shadow: 2px 2px 12px rgba(161, 161, 161, 0.6);
    border: 1px solid #888;
    border-color: #888 !important;
    z-index: 1002
}

.moduleIcon {
    float: left;
    margin: 0 15px 0 0;
    width: 35px;
    height: 35px;
    display: flex;
    vertical-align: middle;
    text-align: center;
    background: transparent url("../images/modules.png") no-repeat;
    cursor: pointer;
}

.headerInformaitons .headerInformaitonsContent #modulesPanel {
    display: none;
    position: absolute;
    top: 65px;
    right: 16%;
    background-color: #ebf0f0;
    box-shadow: 0px 2px 7px rgb(60 85 105 / 50%);
    border: 1px solid #3c5569;
    z-index: 1006;
}

.developerInformation {
    float: left;
    margin: 5px 70px 0 0;
}

.availableModules {
    margin: 0 auto;
    width: 100%;
}

    .availableModules input {
        display: none;
    }

    .availableModules label {
        cursor: pointer;
        margin: 0;
        width: 100%;
        font-weight: normal;
    }

        .availableModules label span {
            margin-top: 5px;
            font-family: 'NotoSans';
            width: 100%;
            float: left;
            font-size: 13px;
            color: #3c5569;
        }

        .availableModules label img {
            width: 45px;
        }

    .availableModules td {
        padding: 15px 5px;
        width: 125px;
        text-align: center;
    }

    .availableModules tr {
        border-bottom: 1px solid #3C5569;
    }

        .availableModules tr:last-child {
            border-bottom: 0px;
        }

.developerInformationButton {
    border: none;
}
/*#endregion */
/*#region Footer */
div.footerCounts {
    background: transparent url(../images/messenger.png) no-repeat scroll 4px 8px / 20px auto;
    cursor: pointer;
    height: 35px;
    width: 220px;
    color: white;
    display: table-cell;
    vertical-align: middle;
    padding-left: 20px;
}

.footerContent {
    left: 0px;
    bottom: 0px;
    position: fixed;
    width: 100%;
    height: 33px;
    z-index: 1000;
    background: #009343;
}

.footerProject {
    float: right;
    padding: 10px 5px 0px 0px;
}

    .footerProject .labelProject {
    }

    .footerProject a {
        text-decoration: none;
        color: #ffffff;
    }

    .footerProject img {
        text-decoration: none;
        height: 30px;
        margin-top: -8px;
        margin-bottom: -10px;
    }

.footerContent .footerVersion {
    color: white;
    float: left;
    height: 26px;
    margin-left: 10px;
    margin-top: 10px;
}

.footerHelpButton {
    float: left;
    background: url(../images/footerHelp.png) no-repeat;
    cursor: pointer;
    height: 26px;
    margin-left: 5px;
    margin-top: 4px;
    width: 26px;
    background-size: contain;
}

#myAlertBarController {
    position: fixed;
    bottom: 18px;
    color: white;
    left: 5px;
    z-index: 1000;
}

/*#endregion */

/*#region Notification */

.headerNotificationOk {
    float: left;
    background: url("../images/notificationOk.png") no-repeat;
    width: 35px;
    height: 35px;
    text-align: center;
    cursor: pointer;
}

#notificationPanel {
    display: none;
    position: absolute;
    top: 35px;
    min-height: 60px;
    max-height: 300px;
    overflow-y: auto;
    background: white;
    border: 1px solid #ccc;
    z-index: 99999;
    box-shadow: 0 2px 8px rgba(0,0,0,0.25);
}

.headerNotificationNotOk {
    float: left;
    background: url("../images/notificationNotOk.png") no-repeat;
    width: 35px;
    height: 35px;
    text-align: center;
}

.headerNotificationDisabled {
    float: left;
    background: url("../images/notificationDisabled.png") no-repeat;
    width: 35px;
    height: 35px;
    text-align: center;
}

div.headerNotificationCounts {
    width: 30px;
    height: 30px;
    font-size: 11px !important;
    color: #fff;
    position: absolute;
    top: -6px;
    right: -6px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f00023;
    border-radius: 100%;
    border: 2px solid #ebf0f0;
    padding:0 !important
}

#myNotificationController {
    position: absolute;
    top: 15px;
    right: 440px;
}

#notificationPanel {
    width: 350px !important;
    z-index: 10000;
    position: relative;
    top: 10px;
    display: none;
    text-align: left;
    left: -260px;
    border-radius: 0;
}

    #notificationPanel span.containerHeaderText {
        display: block;
        float: left;
        width: 300px;
        line-height: normal;
        text-align: center;
    }

div.headerNotificationOk div.headerNotificationCounts {
    cursor: default !important;
}

.notificationPanelInner {
    padding: 8px;
    font-weight: bold;
    text-align: center;
    border-bottom: 1px solid #ddd;
}

.notification-item {
    padding: 10px;
    border-bottom: 1px solid #ddd;
    cursor: pointer;
    color: #24445c;
    font-size: 13px;
}

.pnlNoNotification {
    padding: 12px;
    text-align: center;
    color: #777;
}

div.alertsMain {
    float: left;
    width: 324px;
    overflow-y: auto;
    height: 307px;
}

div.alertsItem {
    clear: both;
    width: 100%;
    background-color: rgba(100, 100, 100, 0.1);
    background-image: url("../images/wait.png");
    background-position: 8px center;
    background-repeat: no-repeat;
    margin-bottom: 5px;
}

a.alertsItem {
    color: black;
    font-size: 10pt;
    padding: 5px 5px 7px 20px;
    text-decoration: none;
    cursor: pointer;
    cursor: hand;
}

div.archiveAll {
    text-align: center;
    width: 324px;
}

a.archiveAll {
    cursor: pointer;
        color: #3c5569;
    font-weight: bold;
}

.headerNotificationOk #notificationPanel {
/*    border-color: #006600 !important;*/
   /*  height: 366px;*/
}

    .headerNotificationOk #notificationPanel .contanierPanelHeader {
        height: 30px;
        padding: 5px 0;
    }

    .headerNotificationOk #notificationPanel .contanierPanelContent {
        background-color: #ebf0f0;
    }

.headerNotificationNotOk #notificationPanel {
    border-color: #660000 !important;
}

    .headerNotificationNotOk #notificationPanel .contanierPanelHeader {
        background-color: #CC0000;
        border-color: #CC0000;
    }

    .headerNotificationNotOk #notificationPanel .contanierPanelContent {
        background-color: rgba(255, 0, 0, 0.4);
    }

div.enableLiteMode {
    border-top: 1px solid #006600 !important;
}

a.enableLiteMode {
    cursor: pointer;
    color: #3c5569;
    font-weight: bold;
}

/*#endregion */

/*#region Mini Scheduler */

div.miniSchedulerMain {
    float: left;
    width: 324px;
    overflow-y: auto;
    height: 307px;
    padding: 2px;
    border-left: solid 1px #555555;
}

div.currentTime {
}

div.miniScheduleItem {
    text-align: left;
    clear: both;
    width: 100%;
    background-color: rgba(100, 100, 100, 0.1);
    background-image: url("../images/wait.png");
    background-position: 2px center;
    background-repeat: no-repeat;
    margin-top: 5px;
}

    div.miniScheduleItem .miniSchedulerTimeDiff {
        padding: 0px 5px 0px 20px;
        float: left;
        font-size: 10pt;
        font-weight: bold;
    }

a.miniScheduleItem {
    color: black;
    font-size: 10pt;
    text-decoration: none;
    cursor: pointer;
    cursor: hand;
}

div.showMyScheduler {
    text-align: center;
    width: 324px;
}

a.showMyScheduler {
    cursor: pointer;
    color: #3c5569;
    font-weight: bold;
}

#mySchedulerPanel {
    display: none;
    position: fixed;
    top: 100px;
    left: 10%;
    width: 80%;
    z-index: 100;
}

#myScheduler {
}

#schedulerViewTypePanel {
    position: absolute;
    left: 300px;
    top: 33px;
    z-index: 10;
}

#myScheduler .dx-scheduler-group-header {
    text-align: center;
}

/*#endregion */

/*#region Messenger */

#myMessageController {
    position: fixed;
    right: 110px;
    bottom: 0px;
    height: 36px;
    width: 225px;
    font-size: 20px !important;
    text-align: center;
    z-index: 1000;
}

#messengerUserListPanel {
    height: 350px;
    width: 690px !important;
    z-index: 10000;
    position: relative;
    top: -400px;
    left: -370px;
    display: none;
    text-align: center;
}

.pnlMessengerUserList {
    margin-left: 5px;
    overflow-y: auto;
    height: 307px;
    width: 340px !important;
    float: left;
    border-right: 1px solid #666666;
}

    .pnlMessengerUserList .thereIsNoUser {
        margin: 5px;
    }

    .pnlMessengerUserList .userItem-true, .pnlMessengerUserList .userItem-false {
        clear: both;
        float: left;
        text-align: left;
        width: 99%;
        padding: 4px;
        margin-top: 5px;
        border: 1px solid #666666;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
        cursor: pointer;
        cursor: hand;
    }

    .pnlMessengerUserList .userItem-true {
        background-color: #DBEDFE;
        padding-left: 5px;
        position: relative;
    }

    .pnlMessengerUserList .userItem-false {
        background-color: #E9EAED;
        padding-left: 5px;
        position: relative;
    }

        .pnlMessengerUserList .userItem-true .profilePicture, .pnlMessengerUserList .userItem-false .profilePicture {
            float: left;
            padding-right: 5px;
        }

            .pnlMessengerUserList .userItem-true .profilePicture img, .pnlMessengerUserList .userItem-false .profilePicture img {
                width: 32px;
                height: 32px;
            }

        .pnlMessengerUserList .userItem-true::after, .pnlMessengerUserList .userItem-false::after {
            content: "";
            position: absolute;
            background-image: url("../images/facebook_images.png");
            background-repeat: no-repeat;
            background-size: auto auto;
            width: 21px;
            height: 21px;
            top: 2px;
            right: 2px;
        }

    .pnlMessengerUserList .userItem-true::after {
        background-position: 0px -355px;
    }

    .pnlMessengerUserList .userItem-false::after {
        background-position: 0px -377px;
    }

    .pnlMessengerUserList .userItemRead-true {
        background-color: #FFFFFF;
    }

    .pnlMessengerUserList .userItemRead-false {
    }

    .pnlMessengerUserList .lastLocation {
        color: #666666;
    }

        .pnlMessengerUserList .lastLocation .lastLocationTime {
            font-weight: bold;
        }

        .pnlMessengerUserList .lastLocation .lastLocationTitle {
            font-size: 90%;
        }

.pnlMessengerList {
    overflow-y: auto;
    height: 257px;
    width: 340px !important;
    margin-bottom: 5px;
    float: left;
}

.messageItem-false, .messageItem-true {
    clear: both;
    max-width: 80%;
    padding: 5px;
    position: relative;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border-color: rgba(0, 0, 0, 0.18) rgba(0, 0, 0, 0.18) rgba(0, 0, 0, 0.29);
    border-image: none;
    border-radius: 4px;
    border-style: solid;
    border-width: 1px;
    box-shadow: 0 1px 0 #dce0e6;
    color: #373e4d;
    position: relative;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    white-space: inherit;
    word-wrap: break-word;
}

    .messageItem-false::after, .messageItem-false::before {
        left: 100%;
        width: 9px;
        background-color: #DBEDFE;
    }

    .messageItem-true::after, .messageItem-true::before {
        right: 100%;
        width: 9px;
        background-color: #F6F7F8;
    }

    .messageItem-false::after, .messageItem-true::after {
        background-image: url("../images/facebook_images.png");
        background-repeat: no-repeat;
        background-size: auto auto;
        content: "";
        position: absolute;
        top: 5px;
        background-repeat: no-repeat;
        height: 13px;
    }

    .messageItem-false::after {
        background-position: -25px -241px;
    }

    .messageItem-true::after {
        background-position: -25px -227px;
    }

.messageItem-false {
    float: right;
    text-align: right;
    margin: 5px 12px 0px 5px;
    background-color: #DBEDFE;
    background: -moz-linear-gradient(center top, #C7DEFE, #E7F1FE) repeat scroll 0 0 transparent;
    background: -webkit-gradient(linear, left top, left bottom, from(#C7DEFE), to(#E7F1FE));
    background: -webkit-linear-gradient(center top, #C7DEFE, #E7F1FE);
    background: -ms-linear-gradient(center top, #C7DEFE, #E7F1FE);
    background: linear-gradient(center top, #C7DEFE, #E7F1FE);
    background-image: -o-linear-gradient(top, #C7DEFE, #E7F1FE);
    background-image: linear-gradient(to top, #C7DEFE, #E7F1FE);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#C7DEFE', endColorstr='#E7F1FE',GradientType=0 );
}

.messageItem-true {
    float: left;
    text-align: left;
    margin: 5px 5px 0px 12px;
    background-color: #F6F7F8;
    background: -moz-linear-gradient(center top, #F2F2F2, #FFF) repeat scroll 0 0 transparent;
    background: -webkit-gradient(linear, left top, left bottom, from(#F2F2F2), to(#FFF));
    background: -webkit-linear-gradient(center top, #F2F2F2, #FFF);
    background: -ms-linear-gradient(center top, #F2F2F2, #FFF);
    background: linear-gradient(center top, #F2F2F2, #FFF);
    background-image: -o-linear-gradient(top, #F2F2F2, #FFF);
    background-image: linear-gradient(to top, #F2F2F2, #FFF);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F2F2F2', endColorstr='#FFF',GradientType=0 );
}

.messageItemStatus-0, .messageItemStatus-1 {
    float: right;
    width: 16px;
    height: 16px;
    background-image: url("../images/whatsapp_images.svg");
    background-repeat: no-repeat;
    background-size: auto auto;
    margin-left: 3px;
}

.messageItemStatus-0 {
    background-position: -2734px -2724px;
}

.messageItemStatus-1 {
    background-position: -2750px -2740px;
}

#pnlMessenger #txtMessage {
    height: auto;
    position: absolute;
    bottom: 5px;
    right: 20px;
}

#pnlMessengerFileUpload {
    display: none;
    position: absolute;
    padding: 20px;
    width: 345px;
    height: 326px;
    right: 0px;
    background: rgba(200,200,200,0.8);
}

    #pnlMessengerFileUpload .dropzone {
        padding: 0 !important;
        height: 220px;
        overflow-y: auto;
    }

        #pnlMessengerFileUpload .dropzone .dz-preview {
            margin: 3px !important;
        }

        #pnlMessengerFileUpload .dropzone .dz-details {
            display: none !important;
        }

#btnMessengerSend {
    background-color: #00e676;
    box-shadow: 0 1px 3px rgba(0,0,0,0.4);
    transition: box-shadow 0.08s cubic-bezier(0.4, 0, 0.2, 1);
    cursor: pointer;
    padding: 0;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    margin: 10px auto;
    border: 0;
}

    #btnMessengerSend span {
        margin-left: 4px;
        width: 24px;
        background-image: url("../images/whatsapp_images.svg");
        height: 24px;
        display: inline-block;
        background-repeat: no-repeat;
        background-position: -3674px -3712px;
    }

.messageItem-true img, .messageItem-false img {
    width: 245px;
}

.messageItem-true a, .messageItem-false a {
    padding-left: 25px;
    background-image: url("../images/whatsapp_images.svg");
    min-height: 38px;
    background-repeat: no-repeat;
    background-position: -1022px -1042px;
    display: inline-block;
}

/*#endregion */

/*#region TodoList */

.done-true {
    text-decoration: line-through;
    color: grey;
}

#myTodoController {
    max-height: 250px;
    margin: 15px 0 0 0;
    color: #3c5569;
    overflow: auto;
}

    #myTodoController ul {
        background: url("../images/todolistBackground.png") repeat scroll 0 0 white;
        min-height: 180px;
        padding-bottom: 60px;
        text-align: left;
        margin-top: 5px;
        margin-bottom: 0;
    }

        #myTodoController ul li {
        }

            #myTodoController ul li input {
                float: left;
                margin-left: 8px;
                margin-right: 10px;
                margin-top: 2px;
            }

    #myTodoController span.done-false, #myTodoController span.done-true {
        display: table-row;
        line-height: 18px;
    }

#ctl00_pnlDashBoardTodoList .contanierPanelContent {
    padding: 0px;
    position: relative;
    background-color: white;
}

.padding0 {padding:0 !important;}
.wiHe {
    height: 40px;
    width: 20px;
}


#txtTodoText {
    float: left;
    width: 100% !important;
    margin: 10px 0 0 0 !important;
    height: 30px !important;
}

@media screen and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* For IE */
    #txtTodoText {
        bottom: -200px !important;
    }
}

/*#endregion */

/*#region Buttons */

.button, .buttonMini {
    height: 21px;
    margin: 5px;
    cursor: pointer;
    display: inline-block;
    font: 13px/100% NotoSans;
    outline: medium none;
    /* padding: 0 5px 1px;*/
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    border: 1px solid #46b8da;
    color: #EEE;
    background: no-repeat 3px, repeat scroll 0 0 #5bc0de;
}

.buttonMini {
    height: 19px;
    min-width: 90px;
    font: 12px/100% Arial, Helvetica, sans-serif;
    padding: 0 3px 0;
    margin: 5px;
}

.button:hover, .buttonMini:hover {-webkit-box-shadow: 0 0 15px 0 rgba(0, 147, 188, 0.88);-moz-box-shadow: 0 0 15px 0 rgba(0, 147, 188, 0.88);box-shadow: 0 0 15px 0 rgba(0, 147, 188, 0.88);color: #FFF;}

.buttonCancel {
    border: 1px solid #f00023 !important;
    background: url(../../images/cancelIcon.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #f00023 !important;
    padding: 8px 15px 8px 30px !important;
    text-shadow: none !important;
    box-shadow: none !important;
    height: auto !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonStop {
    border: 1px solid #f00023 !important;
    background: url(../../images/stop.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #f00023 !important;
    padding: 8px 15px 8px 30px !important;
    text-shadow: none !important;
    box-shadow: none !important;
    height: auto !important;
    margin: 0 0 0 8px !important;
    border-radius: 4px;
}

.buttonSave {
    border: 1px solid #009343 !important;
    background: url(../../images/saveIcon.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.buttonStart {
    border: 1px solid #009343 !important;
    background: url(../../images/start.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    margin: 0 !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.showDocument {
    border: 1px solid #009343 !important;
    background: url(../../images/showDocument.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.buttonCalculate {
    border: 1px solid #009343 !important;
    background: url(../../images/calculate.png) no-repeat #009343 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #ebf0f0 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.buttonViewFilter {
    border: 1px solid #009343 !important;
    background: url(../../images/view_filter.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.buttonDownload {
    border: 1px solid #3C5569 !important;
    background: url(../../images/download.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #3C5569 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.buttonReport {
    border: 1px solid #009343 !important;
    background: url(../../images/reports.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.buttonInvoice {
    border: 1px solid #009343;
    background: url(../../images/invoice_plus.png) no-repeat #009343;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #fff !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonProductAdd {
    border: 1px solid #009343;
    background: url(../../images/product_add.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonShowOffer {
    padding-left: 20px;
    border: 1px solid #4cae4c;
    background: url("../../images/a-search.png") no-repeat 3px, repeat scroll 0 0 #5cb85c;
}

.buttonCloseRecord {
    border: 1px solid #f00022;
    color: #fff !important;
    outline: none;
    margin: 0 !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/basket_closed.png) no-repeat #f00022;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px;
}

.buttonSaveModuleAutoPay {
    border: 1px solid #f00022;
    color: #f00022 !important;
    outline: none;
    margin: 0 !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/automatic_closed.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px;
}

.buttonSaveModuleManuelPay {
    border: 1px solid #f00022;
    color: #f00022 !important;
    outline: none;
    margin: 0 !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/manuel_closed.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px;
}

.buttonAccountClosed {
    border: 1px solid #f00022;
    color: #f00022 !important;
    outline: none;
    margin: 0 10px 0 0 !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/account_closed.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px;
}

.buttonDelete {
    border: 1px solid #f00022;
    color: #fff !important;
    outline: none;
    margin: 0 !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/trashIcon.png) no-repeat #f00022;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px;
}

.buttonClosed {
    border: 1px solid #f00022;
    color: #fff !important;
    outline: none;
    margin: 0 !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/document_closed.png) no-repeat #f00022;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px;
}

.buttonAdd {
    border: 1px solid #3c5569;
    background: url(../../images/button_add.png) no-repeat #ebf0f0 !important;
    padding-left: 27px !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #3c5569 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonImport {
    background: url(../../images/import.png) no-repeat #ebf0f0 !important;
    background-position: 6px center !important;
    padding-left: 27px !important;
    background-size: 14px !important;
    border-radius: 4px;
}

.buttonExport {
    border: 1px solid #009343;
    background: url(../../images/xlsDown.png) no-repeat #009343;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #fff !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonUploading {
    border: 1px solid #ebf0f0;
    background: url(../../images/uploading.png) no-repeat #3c5569;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #fff !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonServiceRun {
    border: 1px solid #ebf0f0;
    background: url(../../images/currency.png) no-repeat #3c5569;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #fff !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonExcelMail {
    border: 1px solid #ebf0f0;
    background: url(../../images/excelMail.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonInvoiceCreated {
    border: 1px solid #009343;
    background: url(../../images/invoice_plus.png) no-repeat #009343;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #fff !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonSend {
    border: 1px solid #009343 !important;
    background: url(../../images/send.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px !important;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.buttonShowInvoices {
    background: url(../../images/view.png) no-repeat 8px #ebf0f0;
    background-size: 14px;
    border: none;
    color: #3C5569 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}
.buttonInvoices {
    background: url(../../images/calc.png) no-repeat 8px #ebf0f0;
    background-size: 14px;
    border: none;
    color: #3C5569 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}
.buttonView {
    background: url(../../images/time-past.png) no-repeat 8px #ebf0f0;
    background-size: 14px;
    border: none;
    color: #009343 !important;
    outline: none;
    margin: 0 0 0 8px !important;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    border-radius: 4px;
}

.btnDeselectAll {
    padding: 9px 15px 9px 30px !important;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/noCheck.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px !important;
    border: none !important;
    outline: none !important;
}

.btnSelectAll {
    padding: 9px 15px 9px 30px !important;
    text-shadow: none !important;
    box-shadow: none !important;
    background: url(../../images/check.png) no-repeat #ebf0f0 !important;
    background-position: 8px center !important;
    background-size: 14px !important;
    border-radius: 4px !important;
    border: none !important;
    outline: none !important;
}

.buttonReload {
    padding-left: 20px;
    background: url("../images/button_reload.png") no-repeat 3px, repeat scroll 0 0 #5bc0de;
}

.buttonMap {
    padding-left: 20px;
    background: url("../images/maps16.png") no-repeat 3px, repeat scroll 0 0 #5bc0de;
}

.buttonCopy {
    border: 1px solid #3c5569;
    background: url(../../images/copy.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #3c5569 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonPrint {
    border: 1px solid #3c5569;
    background: url(../../images/printer.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #3c5569 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonChecked {
    border: 1px solid #009343;
    background: url(../../images/checked.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #009343 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonReject {
    border: 1px solid #f00022;
    background: url(../../images/reject.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #f00022 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonUndecided {
    border: 1px solid #3c5569;
    background: url(../../images/decided.png) no-repeat #ebf0f0;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #3c5569 !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonPdf {
    border: 1px solid #009343;
    background: url(../../images/pdf.png) no-repeat #009343;
    background-position: 8px center !important;
    background-size: 14px !important;
    color: #fff !important;
    outline: none;
    padding: 8px 15px 8px 30px;
    height: auto;
    text-shadow: none !important;
    box-shadow: none !important;
    margin: 0 0 0 10px;
    border-radius: 4px;
}

.buttonUser {
    padding-left: 20px;
    border: 1px solid #4cae4c;
    background: url("../../images/user.png") no-repeat 3px, repeat scroll 0 0 #5cb85c;
}


.btnRrSelect {
    padding: 10px 0 0 5px;
    display: inline-block;
}


.buttonsBulkAction {
    width: 98%;
    text-align: center;
    margin: 0 auto;
    position: relative;
    top: -10px;
}

    .buttonsBulkAction .centerSideBulkAction {
        display: inline;
        margin-bottom: 5px;
    }

    .buttonsBulkAction .centerSideBulkActionFixed {
        left: 0;
        position: fixed;
        top: 35px;
        width: 100%;
    }

.buttonsPanelActions {
    float: left;
    margin: 10px;
    text-align: right;
}

.buttonsPanelAddNew {
    float: right;
    margin: 10px;
    text-align: right;
}

.buttonsPanelSectionActions {
    margin: 10px -10px;
    text-align: right;
    width: 100%;
}

/*#endregion */

/*#region Fade And Loading Panel */

.fadePanel {
    display: block;
    position: fixed;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: black;
    z-index: 10100;
    -moz-opacity: 0.6;
    opacity: .60;
    filter: alpha(opacity=60);
}

.loadingPanel {
    background-color: Black;
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    -moz-opacity: 0.6;
    filter: alpha(opacity=60);
}

.loadingPanelImage {
    background-color: Black;
    background-image: url("../images/loading.gif");
    background-position: center;
    width: 130px;
    height: 130px;
    position: relative;
    left: 45%;
    top: 35%;
}

/*#endregion */

/*#region Error And Information */

.ErrorAndInformationContainer {
    margin-bottom: 5px;
    overflow: visible;
    position: relative;
    width: 100%;
    text-align: center;
}

.ErrorContainer {
    background-color: #F00023;
    background-image: url(../images/messagebox_warning.png);
    background-position: 5px center;
    background-repeat: no-repeat;
    background-size: 18px;
    border: 1px solid #a1031a;
    color: #FFF;
    font-size: 13px;
    padding: 6px 5px 6px 28px;
    position: relative;
    z-index: 99;
    margin: 0 auto 10px auto;
    font-weight: bold;
    border-radius: 4px;
}

.InfoContainer {
    background-color: #009343;
    background-image: url(../images/messagebox_info.png);
    background-position: 5px center;
    background-repeat: no-repeat;
    background-size: 18px;
    border: 1px solid #004f24;
    color: #FFF;
    font-size: 13px;
    padding: 6px 5px 6px 28px;
    position: relative;
    z-index: 99;
    margin: 0 auto 10px auto;
    font-weight: bold;
    border-radius: 4px;
}

}

.closeImagesForEIPanel {
    cursor: pointer;
    margin-right: 2px;
    margin-top: 3px;
}

.noData {
    background-color: #009343;
    background-image: url(../images/messagebox_info.png);
    background-position: 7px center;
    background-repeat: no-repeat;
    background-size: 16px;
    border-top: 2px solid #fff;
    color: #FFF;
    font-size: 13px;
    padding: 7px 2px 6px 28px;
    position: relative;
    z-index: 99;
    margin: 0 auto 10px auto;
    -moz-animation:;
    text-align: center;
    overflow: auto;
}

/*#endregion */

/*#region Page */

.resultDataContent {
    width: 100%;
}

.pnlDataClass {
    overflow-x: auto;
}

div.contentPanel {
    display: inline-block;
    font-size: 12px;
    width: 100%;
    overflow: auto;
}

div.contentPanelWithFilterPanel {
    padding: 5px 55px 0px 55px;
}

div.contentPanel div.contentPanelTitle {
    padding: 7px 15px;
    overflow: auto;
    color: #fff;
    background: #009343;
}

.contentPanelTitle .button {
    background: #ebf0f0;
    border: none;
    outline: none;
    color: #3c5569;
    text-shadow: none;
    box-shadow: none;
    font-family: NotoSans;
    padding: 7px;
    height: auto;
    margin: 0 5px 0 0 !important;
    border-radius: 4px;
}

.contentPanelTitle .dxeButtonEdit {
    border-radius: 4px;
    display: block;
}

.closeImagesForEIPanel {
    cursor: pointer;
    margin-right: 2px;
    float: right;
    width: 18px;
}

div.contentPanel div.contentPanelTitle div.contentPanelHeader {
    float: left;
    font-size: 15px;
    font-weight: normal;
}

div.contentPanel div.contentPanelTitle a {
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
    color: #222222;
}

#ctl00_lblDataHeader {
    padding-right: 20px;
    font-size: 13px !important;
    font-family: NotoSansMedium;
    display: inline-block;
    margin: 5px 0 0 0;
}

#ctl00_ifPrint {
    position: relative;
    left: -1000px;
    top: -1000px;
    height: 10px;
    width: 10px;
    display: none;
}

/*#endregion */

/*#region Special Panel */

div.MyPopUp {
    background-color: #ebf0f0;
    box-shadow: 0px 2px 7px rgb(60 85 105 / 50%);
    border: 1px solid #3c5569;
    border-radius: 7px;
}

.drager {
    cursor: move;
}

.containerHeaderText {
    font-family: NotoSansMedium;
    font-size: 13px;
    color: #009343;
}

table.mini .containerHeaderText {
    font-size: 14px;
}

.contanierPanelHeader {
    vertical-align: middle;
    margin: auto auto auto auto;
}

.contanierClosePanel {
    float: right;
    color: white;
}

.contanierCloseButton, .contanierCloseButtonOfAllwaysOnPage {
    border: medium none;
    padding-right: 15px;
    cursor: pointer;
    cursor: pointer;
    height: 16px;
    float: right;
    color: #FFFFFF
}

.contanierCloseButton {
    background: url("../images/detailClose.png") no-repeat;
    width: 75px;
    height: 25px;
    background-size: 18px;
    background-position: right;
}

.contanierCloseButtonOfAllwaysOnPage {
    background: url("../images/detailClose.png") no-repeat scroll 0px center rgba(0, 0, 0, 0);
    width: 20px;
    height: 20px;
    background-size: contain;
}

.contanierInfoImage {
    position: absolute;
    cursor: pointer;
    top: 9px;
    right: 85px;
}

.contanierContentPanel {
    overflow: auto;
    padding: 7px 5px;
}

.contanierPanelContent {
}

.contanierPanelFixed {
    display: table;
    left: 300px;
    margin: auto;
    overflow: visible;
    position: fixed;
    top: 200px;
    z-index: 1005;
    background-color: #EEE;
    box-shadow: 0 5px 12px rgb(60 85 105 / 50%);
    border-radius: 4px;
}

.contanierPanelFixedStep2 {
    z-index: 9999999999;
}

.contanierPanelFixedStepReport {
    z-index: 1006;
}

.contanierPanelFixedHidden {
    display: none;
    left: -1000px;
    margin: auto;
    overflow: hidden;
    position: fixed;
    top: -1000px;
    z-index: -1000;
}

.alertOfExistUnSavedData {
    position: absolute;
    top: -37px;
    padding: 6px;
    right: 0px;
}

    .alertOfExistUnSavedData::before {
        position: absolute;
        content: "";
        width: 0;
        height: 0;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
        border-top: 10px solid #f5e79e;
        top: 30px;
        right: 2px;
    }

/*#endregion */

/*#region Mini Panel */

.miniPanel {
    float: left;
    margin-bottom: 10px;
}

.miniPanelTitleFlexible {
    margin-bottom: 7px;
    font-weight: bold;
    padding: 5px 5px 5px 7px;
    text-align: left;
    width: 99%;
    font-size: 15px;
    cursor: pointer;
    cursor: hand;
    display: table;
    border-bottom: 1px solid #666666;
}

.miniPanelTitle {
    font-weight: bold;
    padding: 5px 5px 5px 7px;
    text-align: left;
    width: 99%;
    font-size: 15px;
    display: table;
    margin: 5px 0;
}

.miniPanelContent {
    margin-bottom: 10px;
    padding: 5px;
    text-align: left;
    display: inline-block;
    margin-right: 6px;
    border: solid 1px #666;
    box-shadow: 2px 2px 4px #999;
    -moz-box-shadow: 2px 2px 4px #999;
    -webkit-box-shadow: 2px 2px 4px #999;
}

.miniPanelContentWithoutShadow {
    margin-bottom: 10px;
    padding: 5px;
    text-align: left;
    display: inline-block;
    margin-right: 6px;
    border: solid 1px #666;
}

/*#endregion */

/*#region Flexible Panel */

.flexiblePanel {
    height: 30px;
    overflow: hidden;
    width: 100%;
    display: block;
    margin: 10px 0px;
}

.flexiblePanelHeader {
    font-size: 15px;
    font-weight: normal;
    margin-bottom: 5px;
    font-family: NotoSans;
    text-align: left;
    cursor: pointer;
    background: #009343;
    color: #fff;
    display: flex;
    align-items: center;
    padding: 0 10px;
    height: 30px;
    border-radius: 4px;
    border: 1px solid #005627;
}

    .flexiblePanelHeader img {
        float: left;
    }

.flexiblePanelHeaderTitle {
    display: block;
    float: left;
    font-size: 12px;
    font-weight: normal;
    margin-left: 5px;
    position: relative;
    text-align: left;
    cursor: pointer;
    cursor: hand;
    color: #FFF;
}

.flexiblePanel .labelPanel {
    width: 180px;
    margin-left: 4px;
}

.quickEditPanel {
    border: 1px solid #666666;
    display: none;
    padding: 5px;
    height: 0px;
    overflow: hidden;
    margin-bottom: 5px;
}

.showQuickEditPanelButton {
    float: right;
    padding-right: 5px;
}

/*#endregion */

/*#region Soft Table */

table.softTable {
    border-collapse: collapse;
    width: 99%;
    margin: 5px 0.5% 5px 0.5%;
}

    table.softTable tr.softTableTitle {
        font-weight: bold;
        font-style: italic;
    }

    table.softTable tr {
    }

    table.softTable th {
        padding-left: 5px;
        border: 1px solid #AADEFF;
    }

    table.softTable td {
        padding-left: 5px;
        border: 1px solid #AADEFF;
    }

/*#endregion */

/*#region Filter Panel */

#myDashBoardMainFilterController {
    height: 100%;
}

.filterPanelContainer {
    float: left;
    width: 350px;
}

    .filterPanelContainer .contanierContentPanel {
        min-height: 442px;
    }

.filterPanelHidden {
    height: 100%;
    left: -351px;
    position: fixed;
    top: 60px;
    width: 395px;
    z-index: 100;
    background-color: #ebf0f0;
    border-top: 1px solid #009343;
}

.filterPanelToggle {
    float: left;
    height: calc(100vh - 60px);
    width: 45px;
    cursor: pointer;
    border-right: 1px solid #009343;
    border-left: 1px solid #009343;
    text-align: center;
}

.filterPanelContainer .contanierPanelHeader {
    height: auto;
    background: transparent;
}

    .filterPanelContainer .contanierPanelHeader .containerHeaderText {
        height: 40px;
        background-color: #ebf0f0;
        border-bottom: 1px solid #009343;
        display: flex;
        align-items: center;
        padding: 0 15px;
    }

.filterPanelContainer .contanierPanelFixed .contanierPanelHeader .containerHeaderText {
    margin-top: 0px;
}

.filterPanelContainer .contanierContentPanel {
    padding: 10px 5px 0px 10px;
}

.filterPanelToggle .shortcutButton {
    width: 22px;
    margin: 3px 0px;
    cursor: pointer;
}

.filterPanelToggle .shortcutButtonBottom {
}

.filterPanelToggle .filterIcon {
    background: url(../../images/filter.png) no-repeat;
    width: 45px;
    height: 40px;
    background-size: 19px;
    background-position: center;
    margin-bottom: 40px;
}

.filterPanelToggle .filterPanelVerticalText {
    writing-mode: tb-rl;
    color: #3c5569;
    margin: 0;
    font-weight: bold;
    font-size: 15px;
    letter-spacing: 2px;
}

.filterPanelContainer .chartListAndGlobalFilters {
    bottom: 110px;
    position: absolute;
    width: 350px;
    height: 30px;
    overflow: hidden;
    background: #009343;
    left: 0;
}

    .filterPanelContainer .chartListAndGlobalFilters ul.chartList {
        height: 150px;
        width: 100%;
        overflow: auto;
        margin: 0 0 15px 0;
        padding-left: 15px;
        color: #ebf0f0;
    }

.filterPanelContainer span.chartListTitle {
    display: block;
    font-size: 14px !important;
    border-bottom: 1px solid #fff;
    cursor: pointer;
    font-family: NotoSans;
    padding: 5px 0 5px 15px;
    color: #fff;
}

.filterPanelContainer span.chartPropertiesTitle {
    display: block;
    padding-top: 20px;
    font-size: 15px !important;
    border-bottom: 1px solid #EEEEEE;
}

.filterPanelContainer div.filterPin {
    float: left;
    margin-right: 2px;
    background: transparent url("../../images/pin.png") no-repeat scroll 0px 0px / 22px auto;
    width: 22px;
    height: 26px;
}

.filterPanelContainer div.filterPinned {
    float: left;
    margin-right: 2px;
    background: transparent url("../../images/pinned.png") no-repeat scroll 0px 0px / 22px auto;
    width: 22px;
    height: 26px;
}

.filterPanelContainer div.todoPin {
    float: left;
    margin-right: 2px;
    background: transparent url("../../images/pin.png") no-repeat scroll 0px 0px / 22px auto;
    width: 22px;
    height: 26px;
}

.filterPanelContainer div.todoPinned {
    float: left;
    margin-right: 2px;
    background: transparent url("../../images/pinned.png") no-repeat scroll 0px 0px / 22px auto;
    width: 22px;
    height: 26px;
}

#myDashBoardMainFilterController div.dashBoardFilterRow {
    padding: 3px 0px;
    border-bottom: 1px solid #555555;
    display: inline-block;
}

#myDashBoardMainFilterController div.dashBoardFiltersLabel {
    width: 150px;
    float: left;
}

#myDashBoardMainFilterController div.dashBoardFiltersValue {
    width: 180px;
    float: left;
}

    #myDashBoardMainFilterController div.dashBoardFiltersValue select,
    #myDashBoardMainFilterController div.dashBoardFiltersValue input {
        width: 100%;
        color: black;
    }

.filterPanelContainer .chartAndDataButtons {
    margin-bottom: 10px;
}

    .filterPanelContainer .chartAndDataButtons .buttonSelection:first-child {
        -webkit-border-top-left-radius: 8px;
        -webkit-border-bottom-left-radius: 8px;
        -moz-border-radius-topleft: 8px;
        -moz-border-radius-bottomleft: 8px;
        border-top-left-radius: 8px;
        border-bottom-left-radius: 8px;
        margin-right: -4px;
    }

    .filterPanelContainer .chartAndDataButtons .buttonSelection:last-child {
        -webkit-border-top-right-radius: 8px;
        -webkit-border-bottom-right-radius: 8px;
        -moz-border-radius-topright: 8px;
        -moz-border-radius-bottomright: 8px;
        border-top-right-radius: 8px;
        border-bottom-right-radius: 8px;
        margin-left: -4px;
    }

    .filterPanelContainer .chartAndDataButtons .buttonSelection {
        background: #444444;
        height: 30px;
        width: 50%;
        border-color: #000000;
        font-weight: bold;
    }

    .filterPanelContainer .chartAndDataButtons .active {
        background: #666666;
        border-color: #FFFFFF;
    }

/*#endregion */

/*#region Help - Page Bottom Notes Panel */

.pageBottomNotesPanelContainer {
    height: 300px;
    width: 620px;
}

    .pageBottomNotesPanelContainer .contanierContentPanel {
        height: 270px;
        margin: auto;
        overflow-y: auto;
        width: 620px;
        text-align: center;
        padding: 10px 0;
    }

.pageBottomNotesPanelScrollContent {
    width: 600px;
    margin: auto;
    text-align: left;
}

.pageBottomNotesHidden {
    bottom: -400px;
    height: 300px;
    margin-left: 15px;
    position: fixed;
    z-index: 2000;
}

.pageBottomNotesIconDescriptionItem {
    border: 1px solid #888;
    display: flex;
    float: left;
    margin: 1px;
    min-height: 26px;
    padding: 0 5px;
    vertical-align: middle;
    width: 198px;
}

    .pageBottomNotesIconDescriptionItem img {
        height: 16px;
        margin-top: 4px;
        margin-right: 4px;
    }

    .pageBottomNotesIconDescriptionItem span {
        float: right;
        font-size: 8pt;
        line-height: 9pt;
        margin: auto 0 auto auto;
        width: 166px;
    }

.pageBottomInformationIconDescriptionItem {
    border: 1px solid #76d0ff;
    display: flex;
    float: left;
    margin: 1px;
    min-height: 24px;
    padding: 0 5px;
    vertical-align: middle;
    width: 598px;
    clear: both;
}

    .pageBottomInformationIconDescriptionItem img {
        height: 16px;
        margin-top: 4px;
        margin-right: 4px;
    }

    .pageBottomInformationIconDescriptionItem span {
        float: right;
        font-size: 8pt;
        line-height: 9pt;
        margin: auto 0 auto auto;
        width: 560px;
    }

/*#endregion */

/*#region Dashboard */

.dashBoardPanel {
    text-align: center;
}

.dashBoardContent {
    width: 100%;
    padding-bottom: 10px;
}

table.dashBoardZones {
    width: 100%;
}

tr.dashBoardZones {
}

td.dashBoardCenterZone {
    width: 100%;
    text-align: center;
    vertical-align: top;
}

td.dashBoardRightZone {
    width: 350px;
    text-align: center;
    vertical-align: top;
    padding-left: 4px;
}

    td.dashBoardCenterZone .MyPopUp,
    td.dashBoardRightZone .MyPopUp {
        width: auto !important;
        height: auto !important;
        margin-bottom: 4px;
        -webkit-box-shadow: initial;
        -moz-box-shadow: initial;
        box-shadow: initial;
        border-radius: 0;
    }

        td.dashBoardCenterZone .MyPopUp .contanierPanelHeader {
            height: auto
        }

        td.dashBoardCenterZone .MyPopUp .contanierPanelHeader,
        td.dashBoardRightZone .MyPopUp .contanierPanelHeader {
            background-color: #CCC;
        }

        td.dashBoardCenterZone .MyPopUp .contanierPanelContent,
        td.dashBoardRightZone .MyPopUp .contanierPanelContent {
            padding: 5px;
            background-color: #FDFDFD;
        }

        td.dashBoardRightZone .MyPopUp .containerHeaderText {
            color: #000;
        }

        td.dashBoardCenterZone .MyPopUp .containerHeaderText {
            text-align: left;
            padding: 4px 10px;
            background: #3c5569;
            color: #ebf0f0;
            margin: 0;
        }

td.dashBoardCenterZone .MyPopUp {
    width: 100% !important;
}

td.dashBoardRightZone .MyPopUp {
    width: 350px !important;
}

td.dashBoardCenterZone .MyPopUp .contanierPanelContent {
    overflow: auto;
    text-align: center;
}

.flxDasboardh {display: flex;flex-wrap: wrap;position: relative;width: 100%;padding: 20px 10px;background: #ebf0f0;}
.flxDasboardh a {width: 100%;flex: 0 0 calc(15% - 13px);border-right: 1px solid #c1c5c5;padding: 15px;color: #3d5569 !important;text-decoration: none !important;display: flex;align-items: center;text-align: left;}
.flxDasboardh a:last-child {border:none;}
.flxDasboardh a:nth-child(7n) {border:none;}
.flxDasboardh a .lblBold {float: left;width: 100%;font-weight: normal;}
.flxDasboardh a div {margin-right: 10px;position: relative;display: block;}
.flxDasboardh a div img {height:35px;}
.flxDasboardh a div span {font-size: 10px;font-family: NotoSansMedium;position: absolute;right: -5px;top: -10px;background: #3d5569;color: #ebf0f0;width: 28px;height: 28px;text-align: center;line-height: 30px;border-radius: 100%;}
.flxDasboardh a:hover {background: #e1e5e5;}

@media (max-width: 1556px) {
    .flxDasboardh a {
        padding: 20px 5px;
        flex: 0 0 calc(17% - 5px)
    }
    .flxDasboardh a:nth-child(6n) {border:none;}
    .flxDasboardh a:nth-child(7n) {border-right: 1px solid #c1c5c5;}

}

@media (max-width: 1090px) {
    .flxDasboardh a {
        width: 100%;
        height: auto;
        flex: 0 0 calc(34% - 7px);
        padding: 25px 18px;
    }
        .flxDasboardh a:nth-child(3n) {
            border: none;
        }
}



/*#endregion */


/*#region MAPS */
#myChartsController .mapCanvas {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    float: left;
}

#myMiniMapController .mapCanvasMini, #myMiniMapController {
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
}

#myChartsController .mapCanvasContainer2 {
    float: left;
    height: 35%;
    margin-top: 20px;
    padding: 0.5%;
    width: 49%;
}

#myChartsController .mapIconsInfo {
    position: relative;
    width: 300px;
    text-align: center;
    overflow-y: auto;
    margin-left: 5px;
}

    #myChartsController .mapIconsInfo .mapIconsInfoContent {
        width: 100%;
        border: 1px solid #DDDDDD;
        float: left;
        margin: 0px 0px 5px;
        padding: 5px;
    }

        #myChartsController .mapIconsInfo .mapIconsInfoContent img {
            margin: 3px;
            width: 16px;
            height: 22px;
        }

        #myChartsController .mapIconsInfo .mapIconsInfoContent span {
            margin: 5px;
        }

        #myChartsController .mapIconsInfo .mapIconsInfoContent table {
            border: 1px solid #DDDDDD;
        }

            #myChartsController .mapIconsInfo .mapIconsInfoContent table td {
                border: 1px solid #DDDDDD;
            }

/*#endregion */

/*#region Trading */

#myDashBoardController, #myChartsController {margin: 0 auto;}

.tradingChartPannel {
    float: left;
    margin-left: 4px;
    margin-right: 4px;
    margin-bottom: 10px;
    height: 340px;
    border: solid 1px #DDDDDD;
    text-align: center;
    /*
    -webkit-box-flex: 1;      /* OLD - iOS 6-, Safari 3.1-6 !1!
    -moz-box-flex: 1;         /* OLD - Firefox 19- !1!
    -webkit-flex: 1;          /* Chrome !1!
    -ms-flex: 1;              /* IE 10 !1!
    flex: 1;                  /* NEW, Spec - Opera 12.1, Firefox 20+ !1!
*/

    flex-grow: 1;
}

    .tradingChartPannel svg {
        margin: auto;
    }

/*#endregion */

/*#region Keypad */

.informationsButtonsContainer {
    text-align: center;
    margin: 0 auto;
    display: inline-block;
}

.informationsButton {
    display: inline-block;
    margin: 3px 0 3px 5px;
    vertical-align: top;
    width: 60px;
}

    .informationsButton input {
        width: 32px !important;
        height: 32px !important;
    }

/*#endregion */

/*#region Dropzone */

.dropzone {
    padding: 5px 20px;
}

    .dropzone .dz-preview {
        margin: 6px;
    }

        .dropzone .dz-preview .dz-details .dz-filename {
            color: black;
        }

        .dropzone .dz-preview .dz-details {
            padding: 0em;
            padding-top: 2em;
            color: rgba(0,0,0,0.9);
        }

        .dropzone .dz-preview .dz-progress {
            left: 0px;
            top: 7px;
            margin-top: 0px;
            width: 100px;
            margin-left: 10px;
            z-index: 100;
        }

        .dropzone .dz-preview .dz-details .dz-size {
            margin-bottom: 2px;
        }

        .dropzone .dz-preview .dz-error-message {
            top: 145px;
            z-index: 1000;
        }

.UserLoginGeneralDiv {
    float: left;
    width: 100%;
    position: relative;
    height: 100vh;
}

.UserLoginRight {
    background: #ebf0f0;
    float: left;
    width: 50%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 15px;
}

.LoginDiv {
    width: 400px;
    max-width: 100%;
}

.sharedFields, .normalLogin {
    float: left;
    width: 100%;
}

.inputdiv {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 15px;
}

    .inputdiv img {
        position: absolute;
        left: 10px;
        top: 13px;
    }

    .inputdiv .input {
        float: left;
        width: 100%;
        font-family: NotoSans;
        font-size: 14px;
        border: 1px solid #3c5569;
        border-radius: 5px;
        height: 45px;
        padding: 0 0 0 40px;
        color: #3c5569 !important;
        outline: none;
        background: #fff;
    }

        .inputdiv .input::placeholder {
            color: #3c5569 !important;
            font-family: NotoSans;
        }

.btndiv {
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 30px;
}

    .btndiv .buton {
        font-family: NotoSansMedium;
        float: right;
        font-size: 14px;
        border: 1px solid #009343;
        border-radius: 5px;
        padding: 10px 25px;
        color: #009343;
        outline: none;
        background: #fff;
        text-align: center;
    }

    .btndiv .reset {
        font-family: NotoSansMedium;
        float: left;
        font-size: 14px;
        border: 1px solid #3C5569;
        border-radius: 5px;
        padding: 10px 25px;
        color: #EBF0F0;
        outline: none;
        background: #3C5569;
        text-align: center;
    }

.pswdiv {
    float: left;
    width: 100%;
    text-align: center;
}

    .pswdiv a {
        font-family: NotoSans;
        font-size: 14px;
        color: #3c5569;
        text-decoration: underline;
    }
.popUpHeader {
    display: flex;
    align-items: center;
    flex-direction: row-reverse;
    justify-content: space-between;
    padding: 5px 10px;
    background: #3C5569;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.popUpHeader .contanierClosePanel {margin-top:0}
.popUpHeader .containerHeaderText {font-size: 13px;color: #fff;}
.dxeButtonEditSys td.dxic {
    padding: 4px 4px 4px 6px !important;
}

.dxeButtonEdit, .dxeTextBox {
    height: 27px;
}
.dxEditors_edtDropDown {
    background: url(../../images/down-arrow.png) no-repeat;
    width: 17px;
    height: 24px;
    background-position: center;
    background-size: 11px;
}
.dxeButtonEditButton, .dxeSpinLargeIncButton, .dxeSpinLargeDecButton {
    background: none !important;
    border: none !important;
    outline: none !important;
}
.dxtcLite > .dxtc-stripContainer .dxtc-tab, .dxtcLite > .dxtc-stripContainer .dxtc-activeTab {
    border: 1px solid #3c5569;
}
.mrl {
    min-height: 26px;
    width: 20px;
    float: left;
}
.dxgvFilterRow td.dxgv, .dxgvEditFormDisplayRow td.dxgv, .dxgvDetailCell td.dxgv, .dxgvDataRow td.dxgv, .dxgvDetailRow.dxgvADR td.dxgvAIC {
    border-bottom: 1px Solid #3c5569;
    border-right: 1px Solid #3c5569;
    color: #3c5569;
    font-family: NotoSans !important;
}
.dxgvFilterRow, .dxgvDataRowAlt {
    background-color: #ebf0f0;
}
/*#endregion */

.maintenance {background: #fff;width: 50%;height: 100vh;display: flex;align-items: center;justify-content: center;padding: 0 15px;text-align: center;}
.maintenance img {float: left;max-width: 550px;width: 100%;margin-bottom: 35px;}
.maintenance .maintenanceIc strong {display: inline-block;font-size: 35px;color: #3973ff;margin-bottom: 15px;}
.maintenance .maintenanceIc p {margin: 0;font-size: 15px;line-height: 20px;}
.maintenance .maintenanceIc p b {font-size: 15px;}

.cookieseal-banner {position: fixed;z-index: 9999999999;left: 0;right: 0;bottom: 0;background: #ececec;padding: 15px;display: flex;align-items: center;gap: 1em;box-shadow: 0px 0px 5px #000;}
.cookieseal-banner p {margin: 0;font-size: 13px;width: 84%;}
.cookieseal-banner p a {text-decoration: underline;}
.cookieseal-banner-buttons {display: flex;flex: 1 0 0;justify-content: space-between;gap: 1em;}
.cookieseal-banner-popup {background-color: #01834f;border: none;border-radius: 3px;color: #fff;padding: 7px;font-size: 12px;}

.cookiePolicy {position: fixed;background: #000000b5;z-index: 9999999999;display: flex;align-items: center;justify-content: center;width: 100%;height: 100vh;}
.contractContent {width: 50%;background: #fff;max-height: 455px;overflow: scroll;padding: 20px 30px;border-radius: 5px;position: relative;}
.contractContent h5 {float: left;width: 100%;margin: 0 0 5px 0;font-size: 13px;font-family: 'NotoSansMedium';}
.contractContent > strong {font-size:16px;}
.contractContent p {float: left;width: 100%;}
.cancelIcon {position: absolute;border: none;outline: none;right: 0;}

.paddingRevert {padding:revert !important;}
.listStyleCircle {list-style: circle!important}
.pnlProfilePicture {margin-left: 10px; width: 140px; height: 160px; border: 1px solid #00B0FF; display: flex; vertical-align: middle; text-align: center;}
#pnlChangeProfilePicture {display: none; position: absolute; top: 100px; right: 20px;}