body {
    background-color: #FFFFFF;
}

.header-icons .new.nav-link.text {
    font-size: 12px;
    color: var(--primary-bg-color);
    line-height: 13px;
    width: auto;
    padding: 10px;
    text-align: left;
}

.padding-zero{
    padding: 0px !important;
}
.two-col-tree-nav{
    width: 480px ;/*!important*/
    top: 64px;
    position: fixed;
    height: 100%;
    padding: 10px;

    color: #14112d;
    max-height: 100%;
    z-index: 1024;
    background: white;
    -webkit-box-shadow: 10px 0px 14.72px 0px rgb(154 154 204 / 10%);
    box-shadow: 10px 0px 14.72px 0px rgb(154 154 204 / 10%);
    border-right: 1px solid #ededf5;
    min-height: calc(100vh - 114px);
    margin-bottom: 0 !important;

    -webkit-transition: margin-left 320ms ease;
    -o-transition: margin-left 320ms ease;
    transition: margin-left 320ms ease;

    overflow: scroll !important;
}

/*#tree-structur .two-col-tree-nav{*/

#tree-structur , .two-col-tree-nav, .app-content{
    border-right:4px solid #ececec;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

ul#tree2 {
    padding-left: 0;
}

.tooltip {
    z-index: 10800;
}

.dataTables_wrapper .selected2 {
    background: var(--primary02);
    font-weight: 700;
    cursor: pointer;
}

.dataTables_filter, .dataTables_info { display: none; }

.table-dynamic .dataTables_filter, .table-dynamic .dataTables_info { display: block; }

.table thead th, .table thead td {
    text-transform: none;
}

.table-passive thead th {
    background-color: var(--primary04);
    padding: 3px;
    font-weight: 600;
    font-size: 11px;
}

@media (min-width: 992px) {
    /*add .app.sidenav-toggled .two-col-tree-nav*/
    .app.sidenav-toggled .two-col-tree-nav {
        margin-left: 80px;
    }
    /*80 to 320*/
    .app.sidenav-toggled .app-content {

    }
    .app.sidenav-toggled .app-content-tree {
        margin-left: 560px;
    }
    .app.sidenav-toggled .app-content-notree {
        margin-left: 80px;
    }
}

@media (min-width: 992px) {
    /*add two-col-tree-nav*/
    .two-col-tree-nav {
        margin-left: 240px;
    }
    .app-content {

    }
    .app-content-tree {
        /*edit Yaroslav S 240 to 480*/
        margin-left: 720px;
    }
    .app-content-notree {
        /*edit Yaroslav S 240 to 480*/
        margin-left: 240px;
    }
}
/*#m-a-content, , .main-content{*/

/*}*/

.ui-datepicker {
    z-index: 100000000 !important;
}
/*----------*/
.dragobj, li{
    cursor: pointer;
    user-select: none
}
.tree {
    width: max-content;
}
.tree:focus {
    outline: none;
}
.tree li {
    padding: 0.4em 0.6em;
    line-height: 1em;
    color: #1a1630;
    position: relative;
    border: none;
    margin: 3px 0;
    border-radius: 5px;
}

.tree li i {
    margin-right: 5px;
    font-weight: bold;
    font-size: 13px;
    /* padding-top: 10px; */
    line-height: 1;
}

.tree li i.info {
    margin-right: 0;
    color: #4ec2f0;
}

.tree ul li:last-child:before {
    background: #fff;
    height: auto;
    top: 1em;
    bottom: 0;
}

.tree ul li:before {
    content: "";
    display: block;
    width: 18px;
    height: 0;
    border-top: 1px solid var(--primary-color);
    margin-top: -1px;
    position: absolute;
    top: 12px;
    left: -10px;
}

.tree ul li.extra:before {
    content: "";
    display: block;
    width: 18px;
    height: 0;
    border-top: none;
    margin-top: -1px;
    position: absolute;
    top: 12px;
    left: -10px;
}

.tree ul:before {
    content: "";
    display: block;
    width: 0;
    position: absolute;
    top: 0;
    bottom: 0;
    left: -10px;
    border-left: 1px solid var(--primary-color);
}

.tree ul ul {
    margin-left: 1.2em;
}

.tree-header {
    position: fixed;
    width: inherit;
    z-index: 10;
}

.tree-container {
    padding-top: 30px;
}

/*
.tree ul li:not(.branch) {
    padding-left: 2em;
}
.tree ul li:not(.branch):before {
    width: 32px;
}

 */

.treeempty {
    height: 13px;
    width: 13px;
    border:1px solid var(--primary-color);
    border-radius: 50%;
    display: inline-block;
}

.treeextra {
    height: 14px;
    width: 14px;
    background-color: #9c351c;
    border-radius: 50%;
    display: inline-block;
}

/*----------*/
.tabs-info{
    padding-top: 10px;
}
.tabs-info-buttons{
    padding-top: 10px;
}
/*-------*/
.container {
    position: relative;
    margin-top: 60px;
    /*margin-left: 60px;
    margin-right: 60px;*/
    padding-bottom: 10px;
    min-height: 500px;
    background: #eee;
    box-shadow: 0px 0px 10px 2px #bbb;
}

.container h3 {
    position: absolute;
    border: 0;
    margin: 0;
    padding: 0;
    padding-top: 14px;
    height: 44px;
    width: 400px;
    text-indent: 80px;
    background: #4af;
    border-radius: 2px;
    box-shadow: 0px 0px 0px 2px #29f;
    pointer-events: none;
    margin-left: 0px;
    width: 100%;
    background: white;
    box-shadow: 0px 2px 0px 1px #9bf;
}

.route {
    position: relative;
    list-style-type: none;
    border: 0;
    margin: 0;
    padding: 0;
    top: 0px;
    margin-top: 0px;
    max-height: 100% !important;
    width: 100%;
    /*background: #bcf;*/
    border-radius: 2px;
    /*z-index: -1;*/
}

.route span {
    position: absolute;
    top: 20px;
    left: 20px;
    -ms-transform: scale(2);
    /* IE 9 */

    -webkit-transform: scale(2);
    /* Chrome, Safari, Opera */

    transform: scale(2);
    z-index: 10px;
}

.route span.title {
    display: inline-flex;
    position: relative;
    top: 0;
    left: 0;
    border: 0;
    margin: 0;
    padding: .2em .5em;
    /* padding-top: 14px; */
    /* height: 44px; */
    /* width: 400px; */
    /* text-indent: 80px; */
    /* background: #4af; */
    /* border-radius: 2px; */
    /* box-shadow: 0px 0px 0px 2px #29f; */
    -ms-transform: none;
    -webkit-transform: none;
    /* pointer-events: none; */
}

.route span.title a {
    pointer-events: all;
}

.first-title { margin-left: 10px; }

.space {
    position: relative;
    list-style-type: none;
    border: 0;
    margin: 0;
    padding: 0;
    /* margin-left: 70px; */
    /* width: 60px; */
    /* top: 68px; */
    /* padding-bottom: 68px; */
    height: 100%;
    z-index: 1;
}

.first-space { margin-left: 10px; }

.table th, .table td {
    padding: .2em;
}

table.dataTable thead th, table.dataTable thead td {
    background-color: var(--primary04);
    padding-top: .4em;
    padding-bottom: .4em;
    padding-left: .4em;
    font-size: 11px;
    font-weight: 700;
}

.table th, .table td {
    font-size: 12px;
}

table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc {
    background-color: var(--primary03);
}

table.dataTable.spaceSave {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

table.dataTable {
    margin-top: 0 !important;
}

table.table-bordered.dataTable th, table.table-bordered.dataTable td {
    padding-left: 0.3rem;
}

table.table-bordered.dataTable th:first-child, table.table-bordered.dataTable td:first-child {
    padding-left: 0.5rem;
}

.btn-icon2 {
    position: relative;
    width: 24px;
    height: 24px;
    padding-left: 0.2rem;
    padding-right: 0.2rem;
}

.btn-icon i {
    font-size: .9rem;
}

.btn-icon i.sec {
    position: absolute;
    right: .1rem;
    top: .4rem;
    font-size: .6rem;
}

.btn-save {
    color: #fff !important;
    background-color: var(--button-save);
    border-color: transparent;
}

.btn-save:hover {
    background-color: var(--button-save-hover);
}

.btn-new {
    color: #000 !important;
    background-color: var(--button-new);
    border-color: transparent;
}

.btn-new:hover {
    background-color: var(--button-new-hover);
}

.btn-delete {
    color: #000 !important;
    background-color: var(--button-delete);
    border-color: transparent;
}

.btn-delete:hover {
    background-color: var(--button-delete-hover);
}


.btn-edit {
    color: #000 !important;
    background-color: var(--button-edit);
    border-color: transparent;
}

.btn-edit:hover {
    background-color: var(--button-edit-hover);
}


.btn-assign {
    color: #000 !important;
    background-color: var(--button-assign);
    border-color: transparent;
}

.btn-assign:hover {
    background-color: var(--button-assign-hover);
}


.btn-neutral {
    color: #000 !important;
    background-color: var(--button-neutral);
    border-color: transparent;
}

.btn-neutral:hover {
    background-color: var(--button-neutral-hover);
}


.side-menu__item i {
    font-size: 18px;
    line-height: 0;
    margin-right: 10px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    border-radius: 2px;
    text-align: center;
    color: #7b8191;
    fill: #7b8191;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.side-menu__item i.typcn:before {
    font-size: 20px;
    margin-top: -10px;
}

@media (min-width: 992px) {
    .app.sidebar-mini.sidenav-toggled .side-menu .side-menu__item i {
        line-height: 19px;
    }

    .app.sidebar-mini.sidenav-toggled-open .side-menu .side-menu__item i {
        line-height: 19px;
        margin-right: 12px;
    }
}
.app.sidenav-toggled .side-menu .side-menu__item i {
    margin-right: 0;
    margin-left: 0;
}

.side-menu__item:hover .side-menu__item i {
    color: var(--primary-bg-color) !important;
    fill: var(--primary-bg-color) !important;
}

.dataTables_wrapper .dataTables_filter label {
    display: inline-block;
}



.gutter {
    background-color: #eee;
    background-repeat: no-repeat;
    background-position: 50%;
}

.gutter.gutter-vertical {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAFAQMAAABo7865AAAABlBMVEVHcEzMzMzyAv2sAAAAAXRSTlMAQObYZgAAABBJREFUeF5jOAMEEAIEEFwAn3kMwcB6I2AAAAAASUVORK5CYII=');
}

.gutter.gutter-horizontal {
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAeCAYAAADkftS9AAAAIklEQVQoU2M4c+bMfxAGAgYYmwGrIIiDjrELjpo5aiZeMwF+yNnOs5KSvgAAAABJRU5ErkJggg==');
}

.split-overt {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

.split-overb {
    overflow-y: auto !important;
    overflow-x: auto !important;
}

.btn-icon-sm {
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    border: 1px solid #AAAAAA80;
}

.btn-icon-smw {
    width: 40px;
}

.btn-icon-sm i {
    line-height: 0;
    font-size: .9rem;
}

.main-content .container, .main-content .container-fullscreen {
    padding-left: 0px;
    padding-right: 12px;
}

.tab-menu-heading {
    font-size: 12px;
    line-height: 1.3;
    margin-top: 0;
}

.tabs-menu-body {
    padding: 0;
}

.tabcontainer {
    overflow-y: auto;
    overflow-x: hidden;
}

.tabs-style-2 li .nav-link.active {
    /*box-shadow: inset 0 5px 5px var(--info-color);*/
    background-color: #768f96;
    color: #fff;
}

.tabs-style-2 .main-nav-line .nav-link.active {
    background-color:var(--info-color);
    color: #fff;
}

.tabs-style-2 .nav.panel-tabs li {
    border-top: 1px solid var(--info-color) !important;
    border-right: 1px solid var(--info-color) !important;
}

.tabs-style-2 ul.nav.panel-tabs {
    background-color: #e1eae8;
}

.tabs-style-2 .main-nav-line .nav-link {
    padding: 0.7rem 1rem;
}

.toast-header {
    border-radius: unset;
    min-height: 33px;
}

.form-control {
    color: #424e3f;
}

.form-control-xs {
    height: 24px;
    padding: 0.25rem 0.5rem;
    font-size: 0.7rem;
    line-height: 1.5;
    border-radius: 0.1rem;
}

.main-toggle.policy {
    width: 100px;
    height: 25px;
    background-color: #d6d6e6;
    padding: 2px;
    position: relative;
    overflow: hidden;
}

.main-toggle.policy span {
    position: absolute;
    top: 3px;
    bottom: 3px;
    left: 3px;
    display: block;
    width: 20px;
    background-color: #fff;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.main-toggle.policy span::before,
.main-toggle.policy span::after {
    position: absolute;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    color: #fff;
    top: 2px;
    line-height: 1.38;
}

.main-toggle.policy span::before {
    content: "allow";
    left: -45px;
}

.main-toggle.policy span::after {
    content: "disallow";
    right: -59px;
}

.main-toggle.policy.on {
    background-color: var(--primary-bg-color) !important;
}

.main-toggle.policy.on span {
    left: 77px;
}

.tags-reassigner {
    position: absolute;
    padding: .5rem .5rem 0 .5rem;
    left: 10px;
    bottom: 20px;
    z-index: 9000;
    box-shadow: 0 0 10px rgba(80, 80, 80, 0.5);
}

.modal-content {
    border: 2px solid var(--info-color);
    border-radius: 8px;
    outline: 0;
    box-shadow: 5px 5px 20px #00000080;
}

.modal-header {
    padding: .5rem .8rem;
    border-bottom: 1px solid #ededf5;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.modal-body {
    padding: .8rem;
}

.modal-footer {
    border-top: 1px solid #e9ecef;
    padding: .5rem .8rem;
    background-color: var(--info-color-transparent);
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

.modal:nth-of-type(even) {
    /*z-index: 100000010 !important;*/
}
.modal-backdrop.show:nth-of-type(even) {
    /*z-index: 100000011 !important;*/
}

.dialogtree {
    overflow-y: auto !important;
    overflow-x: auto !important;
    height: 40vh;
    border-right: 2px solid var(--info-color);
    width: 33.33333333%;
}

.dialogtreesave {
    overflow-y: auto !important;
    overflow-x: auto !important;
    height: 40vh;
    border-right: 2px solid var(--info-color);
    width: 50%;
}

.dialogtree60 {
    overflow-y: auto !important;
    overflow-x: auto !important;
    height: 60vh;
    border-right: 2px solid var(--info-color);
    width: 50%;
}

.dialogtree.multisource {
    height: calc(40vh - 40px);
}

.btn-icon {
    padding: 4px;
}

.toolbar__icon {
    width: 20px;
    height: 20px;
    color: #FFF !important;
    fill: #FFF !important;
}

#ui_notifIt {
    z-index: 100000010;
}

.richText .richText-editor {
    font-size: 15px;
}

.main-footer {
    padding: 0.3rem !important;
}

.main-footer .container-fluid {
    font-size: 12px;
}

input.form-control {
    border-color: #888888;
}

input.form-control:required {
    background-color: rgba(246, 187, 187, 0.25);
}
input.form-control:focus:invalid {
    border-color: #f34343;
}
input.form-control:focus:valid {
    border-color: #24d5b8;
}

textarea.form-control {
    border-color: #888888;
}

textarea.form-control:required {
    background-color: rgba(246, 187, 187, 0.25);
}
textarea.form-control:focus:invalid {
    border-color: #f34343;
}
textarea.form-control:focus:valid {
    border-color: #24d5b8;
}

.form-select {
    border-color: #888888;
}

.form-select:required {
    background-color: rgba(246, 187, 187, 0.25);
}
.form-select:focus:invalid {
    border-color: #f34343;
}
.form-select:focus:valid {
    border-color: #24d5b8;
}

label {
    font-weight: 600;
}

.select2-container--default .select2-selection--single {
    border: 1px solid #888888 !important;
    padding: 5px;
}

.select2-container .select2-selection--single {
    height: 40px;
}

.select2-results {
    pointer-events: all;
}

.select2-selection--multiple .select2-selection__choice {
    background-color: var(--primary-color) !important;
    color: #FFFFFF !important;
    border-radius: 2px !important;
    padding-right: 15px !important;
}

.select2-selection--multiple .select2-selection__choice__remove {
    top: 0px !important;
    left: unset !important;
    right: 2px !important;
    color: #fcbbbb !important;
    opacity: 0.9 !important;
}

.select2-selection--multiple .select2-selection__choice__remove:hover {
    color: #ffffff !important;
}

.sweet-overlay {
    z-index: 100000000 !important;
}

.sweet-alert {
    z-index: 100000999 !important;
}
.swal2-container {
    z-index: 100000000 !important;
}

.swal2-modal {
    z-index: 100000999 !important;
}
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-confirm) {
    background-color: var(--primary-color);
}
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-deny) {
    background-color: var(--button-delete);
}
div:where(.swal2-container) button:where(.swal2-styled):where(.swal2-cancel) {
    background-color: var(--button-neutral);
}


.ui-sortable-helper {
    background: #FFAA00;
}
.modal-footer button {
    z-index: 99;
}
.feature .project {
    width: 40px;
    height: 40px;
    border: 1px solid #AAAAAA;
    border-radius: 8px;
}
.feature.box {
    position: relative;
}
.feature .project.halfbigger {
    width: 80px;
    height: 40px;
    border: 1px solid #AAAAAA;
    border-radius: 16px;
    /*margin-top: 30px;*/
    font-size: 22px;
}
.feature .project.bigger {
    width: 80px;
    height: 80px;
    border: 1px solid #AAAAAA;
    border-radius: 16px;
    /*margin-top: 30px;*/
    font-size: 30px;
}
.feature .hint {
    position: absolute;
    right: 0;
    top: 0;
}

.crossed {
    background:
        linear-gradient(to top left,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,0) calc(50% - 0.8px),
        rgba(0,0,0,1) 50%,
        rgba(0,0,0,0) calc(50% + 0.8px),
        rgba(0,0,0,0) 100%),
        linear-gradient(to top right,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,0) calc(50% - 0.8px),
        rgba(0,0,0,1) 50%,
        rgba(0,0,0,0) calc(50% + 0.8px),
        rgba(0,0,0,0) 100%);
    background-size: 10px;
    background-repeat: no-repeat;
}
.equaled {
    background:
        linear-gradient(to top,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,0) calc(50% - 0.8px),
        rgba(0,0,0,1) 50%,
        rgba(0,0,0,0) calc(50% + 0.8px),
        rgba(0,0,0,0) 100%),
        linear-gradient(to top,
        rgba(0,0,0,0) 0%,
        rgba(0,0,0,0) calc(65% - 0.8px),
        rgba(0,0,0,1) 65%,
        rgba(0,0,0,0) calc(65% + 0.8px),
        rgba(0,0,0,0) 100%);
    background-size: 10px;
    background-repeat: no-repeat;
}

/* //////////////////  switch-1  //////////////// */
/* //////////////////  switch-1  //////////////// */
.onoffswitch {
    position: relative;
    width: 30px;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select: none;

}
.onoffswitch-checkbox {
    display: none;
}
.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    height: 15px;
    padding: 0;
    line-height: 16px;
    border: 1px solid #CCCCCC;
    border-radius: 15px;
    background-color: #FFFFFF;
    transition: background-color 0.3s ease-in;
}
.onoffswitch-label:before {
    content: "";
    height: 16px;
    display: block;
    width: 17px;
    margin: 0px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 13px;
    border: 1px solid #CCCCCC; border-radius: 15px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch-checkbox:checked + .onoffswitch-label {
    background-color: var(--primary-color);
}
.onoffswitch-checkbox:checked + .onoffswitch-label, .onoffswitch-checkbox:checked + .onoffswitch-label:before {
    border-color: var(--primary-color);
}
.onoffswitch-checkbox:checked + .onoffswitch-label:before {
    right: 0px;
}

/* //////////////////  switch-2  //////////////// */
.onoffswitch2 {
    position: relative;
    width: 30px;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select: none;

}
.onoffswitch2-checkbox {
    display: none;
}
.onoffswitch2-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    height: 15px;
    padding: 0;
    line-height: 16px;
    border: 1px solid #CCCCCC;
    border-radius: 15px;
    background-color: #FFFFFF;
    transition: background-color 0.3s ease-in;
}
.onoffswitch2-label:before {
    content: "";
    height: 16px;
    display: block;
    width: 17px;
    margin: 0px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 13px;
    border: 1px solid #CCCCCC; border-radius: 15px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch2-checkbox:checked + .onoffswitch2-label {
    background-color: var(--primary-color);
}
.onoffswitch2-checkbox:checked + .onoffswitch-label2, .onoffswitch2-checkbox:checked + .onoffswitch2-label:before {
    border-color: var(--primary-color);
}
.onoffswitch2-checkbox:checked + .onoffswitch2-label:before {
    right: 0px;
}

/* //////////////////  switch-3  //////////////// */
.onoffswitch3 {
    position: relative;
    width: 30px;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select: none;

}
.onoffswitch3-checkbox {
    display: none;
}
.onoffswitch3-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    height: 15px;
    padding: 0;
    line-height: 16px;
    border: 1px solid #CCCCCC;
    border-radius: 15px;
    background-color: #FFFFFF;
    transition: background-color 0.3s ease-in;
}
.onoffswitch3-label:before {
    content: "";
    height: 16px;
    display: block;
    width: 17px;
    margin: 0px;
    background: #FFFFFF;
    position: absolute; top: 0; bottom: 0;
    right: 13px;
    border: 1px solid #CCCCCC; border-radius: 15px;
    transition: all 0.3s ease-in 0s;
}
.onoffswitch3-checkbox:checked + .onoffswitch3-label {
    background-color: var(--primary-color);
}
.onoffswitch3-checkbox:checked + .onoffswitch-label3, .onoffswitch3-checkbox:checked + .onoffswitch3-label:before {
    border-color: var(--primary-color);
}
.onoffswitch3-checkbox:checked + .onoffswitch3-label:before {
    right: 0px;
}
.switch-toggle{
    padding:3px 0;
    font-size: 13px;
}

.side-menu__label {
    white-space: normal;
}

.side-menu .slide .side-menu__item {
    padding: 10px 20px 10px 20px;
}

@media (min-width: 992px) {
    .main-header {
        padding-left: 250px;
    }
}

.f1indicator {
    border-radius: 100%;
    display: inline-block !important;
    width: 10px;
    height: 10px;
    margin-right: 1px;
    border: 1px solid #000;
}
.f1extparamindicator {
    border-radius: 30%;
    display: inline-block !important;
    width: 13px;
    height: 13px;
    margin-right: 1px;
    border: 1px solid #000;
    text-align: center;
}
.f1extparamindicator > span {
    position: relative;
    padding: 1px;
    font-size: 10px;
    line-height: 1;
    pointer-events: none;
    top: -3px;
    left: 0;
    -ms-transform: none;
    -webkit-transform: none;
    transform: none;
}
.f1extparamindicatorsq {
    border-radius: 20%;
    text-align: center;
    display: inline-block !important;
    min-width: 16px;
    height: 16px;
    margin-right: 1px;
    border: 1px solid #000;
}
.f1extparamindicatorsq > span {
    padding: 1px;
    line-height: 1.2;
    pointer-events: none;
}
.dataTable > tbody > tr > td:has(.f1extparamindicatorsq) {
    padding-bottom: 0;
    padding-top: 0;
    line-height: 1;
}
.f1extparamindicatorgd {
    border-radius: 30%;
    display: inline-block !important;
    width: 13px;
    height: 13px;
    margin-right: 1px;
    border: 1px solid #000;
    text-align: center;
}
.f1extparamindicatorgd > span {
    position: relative;
    padding: 1px;
    font-size: 10px;
    line-height: 1;
    pointer-events: none;
    top: -3px;
    left: 0;
    -ms-transform: none;
    -webkit-transform: none;
    transform: none;
}
#cytoscapeNodeDetail .f1extparamindicatorgd {
	position: relative;
	top: 2px;
	margin-right: 5px;
}

.popover {
    z-index: 1030;
    border-color: #808080;
}

.bs-popover-start > .popover-arrow::after {
    border-left-color: #000000;
}

.btn-group .SumoSelect {
    color: #000 !important;
    font-size: 0.7rem;
}

.btn-group .SumoSelect > .CaptionCont {
    height: 24px;
    line-height: 24px;
    border-radius: 0;
    min-width: 200px;
}

.btn-group .SumoSelect > .SelectBox {
    padding: 2px;
}


.stv-radio-buttons-wrapper {
    clear: both;
    display: inline-block;
}

.stv-radio-button {
    position: absolute;
    left: -100vw;
    top: 0;
}
.stv-radio-button + label {
    float: left;
    padding: 0.5em 1em;
    cursor: pointer;
    margin-right: -1px;
    color: #fff;
    background-color: var(--primary-color);
}
.stv-radio-button.small + label {
    font-size: 0.6rem;
    margin-bottom: 0;
}
.stv-radio-button + label:first-of-type {
    border-radius: 0.7em 0 0 0.7em;
}
.stv-radio-button + label:last-of-type {
    border-radius: 0 0.7em 0.7em 0;
}
.stv-radio-button:checked + label {
    background-color: var(--button-new);
}

.stv-radio-button.standard:checked + label {
    background-color: var(--button-new);
    color: #000;
}

.stv-radio-button.negative:checked + label {
    background-color: var(--button-delete);
}

.stv-radio-button.negative:disabled + label {
    background-color: var(--button-neutral);
}
.stv-radio-button.default:checked + label {
    background-color: var(--button-edit);
}

.stv-radio-button.default:disabled + label {
    background-color: var(--button-neutral);
}

.sth-radio-buttons-wrapper {
    clear: both;
    display: inline-block;
}

.sth-radio-button {
    position: absolute;
    left: -100em;
    top: 0;
}
.sth-radio-button + label {
    float: left;
    padding: 1em 0.5em;
    cursor: pointer;
    margin-bottom: -1px;
    color: #fff;
    background-color: var(--primary-color);
}
.sth-radio-button + label:first-of-type {
    border-radius: 0.7em 0.7em 0 0;
}
.sth-radio-button + label:last-of-type {
    border-radius: 0 0 0.7em 0.7em;
}
.sth-radio-button:checked + label {
    background-color: var(--button-new);
}
.sth-radio-button.negative:checked + label {
    background-color: var(--button-delete);
}

.sth-radio-button.negative:disabled + label {
    background-color: var(--button-neutral);
}
.sth-radio-button.default:checked + label {
    background-color: var(--button-edit);
}

.sth-radio-button.default:disabled + label {
    background-color: var(--button-neutral);
}
@media (min-width: 1200px) {
    .modal-xxl {
        max-width: 1140px !important;
    }
}

@media (min-width: 1600px) {
    .modal-xxl {
        max-width: 1540px !important;
    }
}

.backdrop-thru {
    pointer-events: none;
}

.datatable-loader {
    display: none;
    position: absolute;
    width: 100%;
    height: auto;
    background-color: #FFFFFF99;
    text-align: center;
    padding-top: 60px;
    z-index: 10;
}

.dialog-loader {
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FFFFFF99;
    text-align: center;
    padding-top: 100px;
    z-index: 10;
}

.placeholder {
    background-color: transparent;
    line-height: 150%;
    color: var(--primary-color) !important;
}

.ellipsis-popover {
    font-size: 1.2em;
    background-color: var(--button-save-hover);
}

.biggerpopover {
    background-color: var(--primary04);
    max-width: 400px;
    width: 400px;
}

.note-editor p {
    margin-bottom: .5rem;
}

hr.in-form {
    height: 1px !important;
    color: var(--primary-color) !important;
}

.flex-shrink-1 {
     margin-bottom: 0px;
}

.overflow-v {
    overflow: visible !important;
}

.grid-table-container {
    width: 70%;
    overflow-x: scroll;
    margin-left: 30%;
    overflow-y: visible;
    padding: 0;
}

.grid-table {
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
}

.grid-table td, .grid-table th {
    white-space: nowrap;
    height: 2.5em;
    position: relative;
}

.grid-table th.vertical {
    text-align: center;
    white-space: nowrap;
    /*writing-mode: vertical-lr;*/
    height: auto;
}

.grid-table select {
    width: 100%;
}

.grid-table th.vertical:before {
    content: '';
    display: inline-block;
    vertical-align: middle;
}

.grid-table th.rpc_thx {
    height: 3.5em;
}

.grid-table th.rpc_thx1 {
    color: #FFFFFF;
    background-color: #888888;
    text-align: center;
}

.grid-table th.rpc_thx2 {
    color: #FFFFFF;
    background-color: #A0A0A0;
}

.grid-table th.rpc_thy {
    background-color: #FFFFFF;
}

.grid-table .rpc_hint {
    position: absolute;
    right: 5px;
    top: 5px;
}

.grid-table th.scor_thx {
    height: 3.5em;
}

.grid-table th.scor_thx1 {
    color: #FFFFFF;
    background-color: #888888;
    text-align: center;
}

.grid-table th.scor_thx2 {
    color: #FFFFFF;
    background-color: #A0A0A0;
}

.grid-table th.scor_thy {
    background-color: #FFFFFF;
}

.grid-table .scor_hint {
    position: absolute;
    right: 5px;
    top: 5px;
}

.grid-table .headcol {
    position: absolute;
    width: 29%;
    left: 15px;
    top: auto;
    overflow-x: auto;
    border-top-width: 1px;
    /*only relevant for first row*/
    margin-top: -1px;
    /*compensate for top border*/
}

.grid-table .headcol:before {
    content: '';
}

.grid-table .long {
    letter-spacing: 1em;
}

input[type="color"]::-moz-color-swatch {
  border: none;
}

input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 0;
  border-radius: 0;
}

input[type="color"]::-webkit-color-swatch {
  border: none;
}

.cyNodeIcon {
	color: black;
}

.fe_form_icon_input ul.icons-list {
	white-space: nowrap;
	overflow-x: auto;
	display: block;
}

.fe_form_icon_input li {
	 display: inline-block;
	 margin-bottom: 0.25em;
}

.fe_form_icon_input .selected {
	border-color: #758f96;
	color: #758f96;
}

.dropzone {
    border: 2px dashed #999;
    border-radius: 12px;
    padding: 28px;
    text-align: center;
    cursor: pointer;
    user-select: none;
}
.dropzone.dragover { border-color: #333; background: #f5f5f5; }
.ok { color: #0a7a0a; }
.err { color: #b00020; }
.small { font-size: 12px; color: #666; }

.exoptmodule.opt-highlight,
.optmodule.opt-highlight{
    background: rgba(25, 135, 84, 0.01);
    border: 1px solid rgba(25, 135, 84, 0.10);
    border-radius: .5rem;
    padding: .75rem .75rem;
    margin-bottom: .75rem;
}

.exoptmodule.opt-flash,
.optmodule.opt-flash{
    animation: optFlash 1.0s ease-in-out 2;
}
@keyframes optFlash{
    0%   { box-shadow: 0 0 0 rgba(25,135,84,0); }
    50%  { box-shadow: 0 0 0.9rem rgba(25,135,84,.35); }
    100% { box-shadow: 0 0 0 rgba(25,135,84,0); }
}

.tabs-scroll{
    max-height: calc(50vh - 220px);
    overflow-y: auto;
    overflow-x: hidden;
}