/*Navbar*/
.navbar {
    z-index: 1038;
}

.navbar-reolli {
    background-color: #193048;
    border-color: #193048;
}

.navbar-brand > img {
    margin-right: 10px;
    display: block;
    width: 20px;
}

.navbar-login {
    width: max-content;
	padding: 10px;
}

.navbar-login .section {
    width: 200px;
    display: inline-block;
    vertical-align: text-top;
}

.navbar-login-session {
    /* padding: 10px; */
    padding-bottom: 0px;
    padding-top: 0px;
}

.navbar-right .dropdown-menu {
    min-width: 200px;
}

    .navbar-right .dropdown-menu li i {
        color: #337ab7;
    }

.navbar-right .divider + li i {
    color: #d9534f;
}

.icon-size {
    font-size: 87px;
}

.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-brand,
.navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-brand:focus, .navbar-default .navbar-brand:hover {
    color: #fff;
}

.navbar-login a:hover {
    text-decoration: none;
}

/*Hamburger*/

.ham {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform 400ms;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.hamRotate.active {
    transform: rotate(45deg);
}

.hamRotate180.active {
    transform: rotate(180deg);
}

.line {
    fill: none;
    transition: stroke-dasharray 400ms, stroke-dashoffset 400ms;
    stroke: #fff;
    stroke-width: 5.5;
    stroke-linecap: round;
}

.ham8 {
    width: 40px;
    margin-top: 5px;
}

    .ham8 .top {
        stroke-dasharray: 40 160;
    }

    .ham8 .middle {
        stroke-dasharray: 40 142;
        transform-origin: 50%;
        transition: transform 400ms;
    }

    .ham8 .bottom {
        stroke-dasharray: 40 85;
        transform-origin: 50%;
        transition: transform 400ms, stroke-dashoffset 400ms;
    }

    .ham8.active .top {
        stroke-dashoffset: -64px;
    }

    .ham8.active .middle {
        transform: rotate(90deg);
    }

    .ham8.active .bottom {
        stroke-dashoffset: -64px;
    }

/*Hamburger Menu*/

.panel-default {
    border-color: transparent;
    box-shadow: 0px 0px 20px rgba(153, 153, 153, 0.2);
}

.nav-stacked > li {
    border-bottom: 1px solid #efefef;
}

    .nav-stacked > li:last-child {
        border: none;
    }

#collapse_estimate .list-group {
    margin: 0;
}

    #collapse_estimate .list-group .list-group-item {
        border: none;
        border-left: 4px solid transparent;
    }

        #collapse_estimate .list-group .list-group-item a {
            margin-left: 60px;
        }

#collapse_estimate .list-group-item:hover {
    border-left: 4px solid #3a72ad;
}

#collapse_estimate .list-group-item:first-child {
    border-radius: 0;
}

#collapse_estimate .list-group-item a {
    color: #444;
    text-decoration: none;
    display: block;
}

#menu {
    background: #fff;
    position: fixed;
    top: 0;
    left: 0;
    margin-top: 51px;
    margin-bottom: 0;
    width: 300px;
    height: calc(100vh - 50px);
    overflow: hidden;
    z-index: 1049;
}

    #menu ul.nav.nav-pills {
        margin-bottom: 20px;
    }

    #menu .sidebar-item a i {
        min-width: 17px;
        text-align: center;
    }

.header-menu {
    border-top: 1px solid #efefef;
    margin-top: 10px;
    margin-bottom: 0;
    color: #193048;
    padding: 10px 0;
}

.menu-dropdown .fa-chevron-left {
    transition: .3s transform ease-out;
    transform: rotate(-90deg)
}

.menu-dropdown.collapsed .fa-chevron-left {
    transform: none;
}

#menu .nav > li > a {
    padding: 7px 15px;
}

.nav > li > a {
    color: #444;
    transition: .3s ease-out;
}

    .nav > li > a:focus,
    .nav > li > a:hover {
        text-decoration: none;
        background-color: #3a72ad;
        color: #fff;
        border-radius: 0;
    }

/*.nav > li > a.submenu {
    padding: 10px 15px 10px 40px;
}*/

/*Issue type setting Modal*/

.issue-setting-modal .modal-dialog {
    position: relative;
    top: 50%;
    margin-top: -80px;
}

/*Scenario details Modal*/

.add-edit-modal span.e-input-focus > input.name {
    background-color: #ff00000f !important;
    padding-left: 7px !important;
}

.modal-scenario-detail .modal-body {
    font-size: 13px;
    padding-top: 2px;
}

.modal-scenario-detail .modal-dialog,
.modal-resizable .modal-dialog {
    width: 1000px;
    position: relative;
    top: 50%;
    margin-top: -270px;
}

.modal-resizable-sm .modal-dialog {
    width: 700px;
    position: relative;
    top: 50%;
    margin-top: -270px;
}

.modal-scenario-detail.expanded .modal-dialog {
    top: auto;
}

.modal-scenario-detail .nav.nav-tabs,
.reolli-tabs .nav.nav-tabs {
    border: none;
}

.modal-scenario-detail .nav > li > a,
.reolli-tabs .nav > li > a {
    padding: 4px 14px;
    border: none;
    border-bottom: 3px solid transparent;
    transition: none;
}

    .modal-scenario-detail .nav > li > a:hover,
    .reolli-tabs .nav > li > a:hover {
        background: none;
        color: inherit;
        border: none;
        border-bottom: 3px solid rgba(25, 48, 72, 0.5);
        border-radius: 0;
    }

.modal-scenario-detail .nav > li.active > a,
.reolli-tabs .nav > li.active > a {
    border: none;
    border-bottom: 3px solid #193048;
}

.modal-scenario-detail .header-details-tab {
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 10px;
    font-weight: 600;
    margin-top: 0;
    font-size: 14px;
}

.modal-scenario-detail .details-top-section {
    margin-bottom: 5px;
}

.modal-scenario-detail .header-section {
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 10px;
}

.modal-scenario-detail .header-left-section {
    position: relative;
    top: 5px;
}

.modal-scenario-detail .form-group {
    margin-bottom: 5px;
}

.modal-scenario-detail .attachments-view-icons {
    margin-top: 10px;
}

.modal-scenario-detail #attachments-grid-view .grid-view-img {
    height: 114px;
}

.modal-scenario-detail #attachments-grid-view {
    border-top: 1px solid #efefef;
    padding-top: 10px;
}

#upload-attachment-btn {
    margin-right: 5px;
}

[id^=upload-attachment-btn] {
    margin-right: 5px;
}

.modal-scenario-detail .author-name {
    font-weight: 600;
}

.modal-scenario-detail .post-date {
    color: #929292;
}

.modal-scenario-detail .thumbnail {
    position: relative;
    display: inline-block;
    margin-left: 17px;
    width: 180px;
}

    .modal-scenario-detail .thumbnail:nth-child(5n+1) {
        margin-left: 0px;
    }

    .modal-scenario-detail .thumbnail:last-child {
        margin: 0;
        margin-left: 17px;
    }


    .modal-scenario-detail .thumbnail img {
        margin: 0 auto;
    }

.modal-scenario-detail .thumbnail-img {
    font-size: 16px;
    background-color: #f7f7f7;
    padding: 5px;
}

    .modal-scenario-detail .thumbnail-img .fas {
        font-size: 114px;
    }

        .modal-scenario-detail .thumbnail-img .fas.fa-file-pdf {
            color: #b60706;
        }

        .modal-scenario-detail .thumbnail-img .fas.fa-file-word {
            color: #285498;
        }

        .modal-scenario-detail .thumbnail-img .fas.fa-file-excel {
            color: #207347;
        }

        .modal-scenario-detail .thumbnail-img .fas.fa-file-powerpoint {
            color: #d04626;
        }

.modal-scenario-detail .thumbnail .thumbnail-overlay {
    display: none;
    position: absolute;
    background-color: rgba(0, 0, 0, 0.54);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    transition: all .3s ease-out;
}

.modal-scenario-detail .thumbnail:hover .thumbnail-overlay {
    display: block;
}

    .modal-scenario-detail .thumbnail:hover .thumbnail-overlay .btns-action {
        position: relative;
        top: 50%;
        margin-top: -13px;
    }

.modal-scenario-detail .thumbnail .thumbnail-overlay i {
    cursor: pointer;
    font-size: 24px;
    color: #c3c3c3;
}

    .modal-scenario-detail .thumbnail .thumbnail-overlay i:hover {
        color: #fff;
    }

.modal-scenario-detail .caption h4 {
    margin-top: 0px;
    font-size: 14px;
}

.modal-scenario-detail .btn-new-attachment {
    display: inline-block;
    margin-top: 5px;
}

.modal-scenario-detail #attachments-grid-view .thumbnail h5 {
    margin: 10px 0;
}

.modal-scenario-detail [id^=attachments-grid-view] .thumbnail h5 {
    margin: 10px 0;
}

.modal-scenario-detail #attachments-grid-view .thumbnail .author-avatar i {
    vertical-align: middle;
}

.modal-scenario-detail [id^=attachments-grid-view] .thumbnail .author-avatar i {
    vertical-align: middle;
}

.modal-scenario-detail .scenario-id {
    color: #555;
}

.modal-scenario-detail .modal-header input.editable-field {
    font-size: 18px;
    font-weight: 600;
}

    .modal-scenario-detail .modal-header input.editable-field.e-control {
        font-size: 16px;
        font-weight: 500;
    }

.modal .modal-header .item-id {
    line-height: 29px;
}

.modal-scenario-detail .header-left-section .e-input-group {
    margin: -5px 0 0 0;
}

.modal-scenario-detail .comment-count {
    cursor: pointer;
    line-height: 14px;
}

/* .modal-scenario-detail .counter-date {
    position: absolute;
    right: 85px;
    top: -3px;
} */

/* Setting position along with the suggested date input element... */
.modal-scenario-detail .counter-date {
    position: absolute;
    right: 18px;
    top: 27px;
}
.modal-scenario-detail .badge {
    width: 18px;
    font-size: 10px;
    line-height: 18px;
    height: 18px;
}

/* .modal-scenario-detail .show-btns .e-input-group {
    width: 60% !important;
} */

.e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left).e-disabled {
    background: none;
}

.modal-scenario-detail #attachments-tab .e-upload {
    min-height: 320px;
}

.modal-scenario-detail [id^=attachments-tab] .e-upload {
    min-height: 320px;
}

/*Add Edit Modal*/

.add-edit-modal .collapsed .fas.fa-chevron-up {
    transform: rotate(180deg);
}

.add-edit-modal .section-related .fas.fa-chevron-up {
    transition: .3s all ease-out;
}

.add-edit-modal .panel .section-related {
    cursor: pointer;
}

.add-edit-modal .panel .panel-collapse .panel-body {
    padding: 0;
}

/*Add Bussiness Partner Modal*/

.modal-add-bussiness-partner .modal-dialog {
    width: 800px;
}

.modal-add-bussiness-partner .flex .form-group {
    flex: 1 1;
}

/*Add Timesheet Task Modal*/

.modal-add-timesheet-task .modal-body {
    min-height: 250px;
}

/*Description Modal*/

#description-popup .e-richtexteditor.e-rte-tb-expand.e-rte-fixed-tb-expand {
    overflow: unset;
}

/*Email Modal*/
div#email-body.e-richtexteditor.e-rte-tb-expand.e-rte-fixed-tb-expand {
    overflow: inherit;
}

.email-modal .noborder .e-input-group:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
.email-modal .e-input-group.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap,
.email-modal .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left),
.email-modal .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap,
.email-modal .e-float-input.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap,
.email-modal .e-float-input.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap {
    border-color: #eaeaea;
}

.email-modal .section-scroll {
    position: relative;
    overflow: hidden;
    height: 280px;
}

/*gaps*/
.gaps-grid-wrapper {
    min-height: calc(100vh - 162px);
}
/*Scenarios*/
.scenarios-grid-wrapper {
    min-height: calc(100vh - 162px);
}

    .scenarios-grid-wrapper#scenarios-grid {
        position: relative;
        height: 100%;
    }

    .scenarios-grid-wrapper .add-groups {
        position: absolute;
        text-align: center;
        left: 50%;
        top: 50%;
        margin-top: -150px;
        margin-left: -108px;
    }

    .scenarios-grid-wrapper .fas.fa-layer-group,
    .fas.fa-layer-group,
    .scenarios-grid-wrapper .edit-todo .fas.fa-list-ul {
        color: #0378d5 !important;
    }

    .scenarios-grid-wrapper .fas.fa-clipboard-list.green,
    .fas.fa-clipboard-list.green {
        color: #4d841d !important;
    }

.yellow {
    color: orange !important;
}

.comment-count a {
    text-decoration: none;
    color: #555 !important;
}

.scenarios-grid-wrapper .e-treecell .fas,
.todos-grid-wrapper .edit-todo .fas,
.gaps-grid-wrapper .edit-gap .fas {
    margin-right: 5px;
}

/*Common*/

body {
    font-family: 'Segoe UI VSS (Regular)','Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    font-size: 13px;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0;
}

label {
    font-size: 11px;
    color: #777;
    margin: 0;
}

.checkbox-inline,
.radio-inline {
    font-size: 13px;
}

.oneline {
    white-space: nowrap;
}

.m-0 {
    margin: 0;
}
.mt-1 {
    margin-top: 5px;
}

.mt-2 {
    margin-top: 10px;
}

.mt-3 {
    margin-top: 15px;
}

.mr-1 {
    margin-right: 5px;
}

.mr-2 {
    margin-right: 10px;
}

.mr-3 {
    margin-right: 15px;
}

.mr-4 {
    margin-right: 20px;
}

.mb-1 {
    margin-bottom: 5px;
}

.mb-2 {
    margin-bottom: 10px;
}

.mb-3 {
    margin-bottom: 15px;
}

.ml-1 {
    margin-left: 5px;
}

.ml-2 {
    margin-left: 10px;
}

.ml-3 {
    margin-left: 15px;
}

.p-0 {
    padding: 0;
}

.p-1 {
    padding: 5px;
}

.pt-2 {
    padding-top: 10px;
}

.hidden {
    display: none;
}

.flex {
    display: flex;
}

.grow-1 {
    flex-grow: 1;
}

.grow-100 {
    flex-grow: 100;
}

.hide {
    display: none;
}

.mandatory {
    display: none;
    color: #d9534f;
}

    .mandatory.show {
        display: inline-block !important;
    }

.link-danger,
.link-danger:hover,
.link-danger:focus {
    color: #d9534f;
}

.link-success,
.link-success:hover,
.link-success:focus {
    color: #5cb85c;
}

.link-info,
.link-info:hover,
.link-info:focus {
    color: #5bc0de;
}

.ss-content {
    overflow-x: hidden;
}

.wrapper {
    margin-top: 70px;
    min-height: calc(100vh - 70px);
}

.badge {
    border-radius: 24px;
    display: inline-block;
    width: 24px;
    position: relative;
    line-height: 24px;
    text-align: center;
    padding: 0;
    height: 24px;
    color: #fff;
}

.status-open,
.status-new {
    background-color: #656363;
}

.status-assigned,
.status-assigned-to-developer {
    background-color: #f3ae4b;
}

.status-inprogress,
.status-in-progress {
    background-color: #199efd;
}

.status-passed {
    background-color: #479E47;
}

.status-approved {
    background-color: #2ACE55;
}

.status-completed {
    background-color: #25B74A;
}

.status-awaiting-resolution {
    background-color: #f0ad4e;
}

.status-failed {
    background-color: #e15249;
}

.status-failed-ete {
    background-color: #9e1414;
}
.status-rejected {
    background-color: #E56961;
}

.status-converted-to-gap {
    background-color: #25B74A;
}

.status-converted {
    background-color: #3481f4;
}

.status-soft-failed{ 
    background-color: #e15249;
}

.status-converted-to-gap {
    background-color: #25B74A;
}

.status-not-applicable {
    background-color: #9399ff;
}

.status-overdue {
    background-color: #ff000094;
}

.status-cannottest {
    background-color: #f7a56c;
}

.status-onhold {
    background-color: #b561f5;
}

.status-cancelled {
    background-color: #ff4d4d;
}

.status-in-development {
    background-color: #5F7AE3;
}

.status-ready-for-uat {
    background-color: #2ACE55;
}

.status-uat-in-progress {
    background-color: #2843B1;
}

.status-uat-completed {
    background-color: #25B74A;
}

.status-closed {
    background-color: #3481f4;
}

.text-truncate {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}

.error {
    border-color: #f00;
}

.author-avatar {
    width: 24px;
    height: 24px;
    background-color: #eee;
    border-radius: 14px;
}

    .author-avatar img {
        width: 100%;
        border-radius: 16px;
    }

    .author-avatar i {
        width: 100%;
        vertical-align: middle;
        border-radius: 16px;
    }

.add-groups > .icon {
    font-size: 100px;
    line-height: 120px;
    color: #888;
}

.modal.expanded .modal-dialog {
    width: 100%;
    margin: 0 0 0 0;
}

.modal .modal-header,
.modal .modal-footer {
    padding: 5px 15px;
}

.modal.expanded .modal-content {
    height: calc(100vh);
    border-radius: 0;
}

.modal.expanded .modal-footer {
    padding: 5px 15px;
    position: fixed;
    bottom: 0;
    width: 100%;
}

.expand-modal, .expand-popup {
    font-size: 12px;
    margin-top: 3px !important;
    margin-right: 8px;
}


.modal-scenario-detail .section-header i {
    display: none;
    font-size: 12px;
    position: absolute;
    right: 10px;
    top: 4px;
    cursor: pointer;
}

    .modal-scenario-detail .section-header i.email-all-comments, .modal-scenario-detail .section-header i.expand-comment-section {
        display: inline-block;
    }

.modal-scenario-detail .section-header:hover i {
    display: inline-block;
}

.section-header {
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 10px;
    position: relative;
}

.section-general.expanded {
    position: absolute;
    background: #fff;
    top: 0;
    bottom: 0;
    left: 15px;
    right: 15px;
    z-index: 2;
}

.error-validation {
    border-bottom: 2px solid #e3165b !important;
    border-radius: 0;
}

.noborder .e-input-group, .e-input-group.e-control-wrapper {
    margin-bottom: 0px;
}

    .noborder .e-input-group:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left), .e-input-group.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-input-group.e-control-wrapper:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left), .e-input-group.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-float-input.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap, .e-float-input.e-control-wrapper.e-float-icon-left:not(.e-success):not(.e-warning):not(.e-error) .e-input-in-wrap {
        border-color: transparent;
    }

    .noborder .e-input-group:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled):not(.e-float-icon-left), .e-input-group.e-control-wrapper:hover:not(.e-success):not(.e-warning):not(.e-error):not(.e-disabled):not(.e-float-icon-left) {
        border-color: #eaeaea;
    }

.noborder .e-ddl.e-input-group.e-control-wrapper .e-ddl-icon::before {
    color: #afabab;
}

.no-border .e-input-group .sf-ddl ~ .e-input-group-icon {
    display: none;
}

.no-border .e-input-group .sf-ddl ~ .e-input-group-icon {
    display: none;
}

.no-border .e-input-group:hover .sf-ddl ~ .e-input-group-icon {
    display: block;
}

.nopadding {
    padding: 0;
}

.attachments-view-icons a {
    text-decoration: none;
    color: inherit;
    padding: 0px 5px;
    text-align: center;
    font-size: 16px;
    min-width: 24px;
    display: inline-block;
}

    .attachments-view-icons a.active {
        background-color: #efefef;
    }

.dropdown-toggle.up .caret {
    transform: rotate(180deg);
}

.dropdown-toggle.up ~ .dropdown-menu {
    bottom: 100%;
    top: auto;
    left: auto;
    right: 0;
}

.dropdown-toggle ~ .dropdown-menu .btn {
    text-align: left;
}

.e-input-group input.e-input,
.e-input-group.e-control-wrapper input.e-input {
    min-height: 20px;
}

.ss-content {
    width: calc(100% + 17px);
}

/* Add Scenarios Modal */

#add-scenarios-popup .modal-body, 
#group-add-scenario .modal-body {
    background: #fff;
}

#add-scenarios-popup.expanded .modal-footer, 
#group-add-scenario.expanded .modal-footer {
    position: initial;
    bottom: unset;
    z-index: 1;
    background-color: #fff;
}

#group-add-scenario.expanded .modal-body {
    min-height: auto !important;
    height: calc(100vh - 95px);
    overflow: auto;
}

/* Comments Section */
.scrollable-content {
    position: relative;
    overflow: hidden;
    height: 400px;
}

.expanded .scrollable-content {
    height: calc(100vh - 200px);
}

.scrollable-content-main {
    position: relative;
    overflow: hidden;
    height: 410px;
}

.expanded .scrollable-content-main {
    height: calc(100vh - 200px);
}

.comment-box-padding {
    padding: 5px 15px;
}

.comment-item-left {
    position: absolute;
    top: 0;
    left: 0;
}

.rte-placeholder {
    font-size: 13px !important;
    padding: 5px 15px;
    color: #ccc;
}

.avatar-button {
    background: rgba(248,248,248,1);
    background: rgba(var(--palette-neutral-2,248, 248, 248),1);
    border: 0;
    height: 28px;
    width: 28px;
    margin-top: 4px;
    border-radius: 14px;
    outline: none;
    margin-right: 6px;
}

.avatar-button-image {
    height: 28px;
    width: 28px;
    border-radius: 14px;
}

.comment-item-right {
    margin-left: 40px;
}

.comment-item-wrapper {
    border: 1px solid;
    border-color: rgba(234,234,234,1);
    border-color: rgba(var(--palette-neutral-8,234, 234, 234),1);
    border-radius: 5px;
    padding-top: 8px;
    padding-left: 12px;
    padding-right: 12px;
    overflow-x: hidden;
    margin-right: 1px;
}

.user-display-name {
    margin-right: 5px;
    color: rgba(0,0,0,.55);
    color: var(--text-secondary-color,rgba(0, 0, 0, .55));
    font-weight: bold;
    flex: 1 1 auto;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.comment-timestamp {
    flex: 0 0 100%;
    font-size: 85%;
    color: rgba(0,0,0,.55);
    color: var(--text-secondary-color,rgba(0, 0, 0, .55));
    line-height: 17px;
    white-space: nowrap;
}

.comment-header-right {
    display: none;
}

.comment-item-right.show:hover .comment-header-right {
    display: block;
}

.comment-content {
    color: rgba(0,0,0,.9);
    color: var(--text-primary-color,rgba(0, 0, 0, .9));
    word-wrap: break-word;
    font-size: 14px;
    word-wrap: break-word;
    margin-top: 10px;
    margin-bottom: 20px;
}

.comment-header-left {
    float: left;
}

.comment-header-right {
    float: right;
}

    .comment-header-right .fas {
        cursor: pointer;
    }

.comment-action-icon-color {
    color: #737373;
}

.relative {
    position: relative;
}

.float-right {
    float: right;
}

#comments-section,
.popup-comments-section {
    min-height: 54px;
    border: 1px solid rgb(234, 234, 234);
    border-radius: 5px;
    width: calc(100% - 40px) !important;
}

    #comments-section.e-rte-full-screen {
        margin: 0;
        width: 100% !important;
    }

/*Comments Section Ends*/
/* Engagement row */

.bg-row-top {
    background: #f5f5f5;
    padding: 7px;
    margin: 0 0 15px 0;
}

.form-group-header {
    display: inline-block;
    margin-right: 20px;
}

    .form-group-header .header-row-details {
        padding-left: 7px;
    }

/* Loader */
.loader-overlay {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 2147483647;
    top: 51px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: rgb(238, 238, 238);
    display: block;
}

.section-loader {
    position: relative;
}

    .modal .loader-overlay,
    .section-loader .loader-overlay {
        position: absolute;
    }

.loader-overlay.full {
    top: 0;
}

.loader-overlay.transparent {
    background: rgba(255,255,255,0.98);
}

.lds-ellipsis {
    display: inline-block;
    position: absolute;
    width: 64px;
    height: 64px;
    left: 50%;
    top: 50%;
    margin-left: -32px;
    margin-top: -32px;
}

.loader-section .loader-overlay {
    position: absolute;
}

.lds-ellipsis div {
    position: absolute;
    top: 27px;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: #193048;
    animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

    .lds-ellipsis div:nth-child(1) {
        left: 6px;
        animation: lds-ellipsis1 0.6s infinite;
    }

    .lds-ellipsis div:nth-child(2) {
        left: 6px;
        animation: lds-ellipsis2 0.6s infinite;
    }

    .lds-ellipsis div:nth-child(3) {
        left: 26px;
        animation: lds-ellipsis2 0.6s infinite;
    }

    .lds-ellipsis div:nth-child(4) {
        left: 45px;
        animation: lds-ellipsis3 0.6s infinite;
    }

@keyframes lds-ellipsis1 {
    0% {
        transform: scale(0);
    }

    100% {
        transform: scale(1);
    }
}

@keyframes lds-ellipsis3 {
    0% {
        transform: scale(1);
    }

    100% {
        transform: scale(0);
    }
}

@keyframes lds-ellipsis2 {
    0% {
        transform: translate(0, 0);
    }

    100% {
        transform: translate(19px, 0);
    }
}

/* Loader 2 */

.lds-ring {
    display: inline-block;
    position: absolute;
    width: 64px;
    height: 64px;
    left: 50%;
    top: 50%;
    margin-left: -25px;
    margin-top: -50px;
}

    .lds-ring div {
        box-sizing: border-box;
        display: block;
        position: absolute;
        width: 64px;
        height: 64px;
        margin: 8px;
        border: 5px solid #193048;
        border-radius: 50%;
        animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
        border-color: #193048 transparent transparent transparent;
    }

        .lds-ring div:nth-child(1) {
            animation-delay: -0.45s;
        }

        .lds-ring div:nth-child(2) {
            animation-delay: -0.3s;
        }

        .lds-ring div:nth-child(3) {
            animation-delay: -0.15s;
        }

@keyframes lds-ring {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/*Flyover*/

.flyover {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: #fff;
    z-index: 1039;
    overflow-x: hidden;
}

    .flyover.active {
        display: block;
    }

.flyover-header {
    background: #193048;
    color: #fff;
    border-bottom: 1px solid #ccc;
}

    .flyover-header h4 {
        margin: 0;
        float: left;
    }

.flyover-header,
.flyover-body,
.flyover-footer {
    padding: 15px;
}

.flyover .close:focus,
.flyover .close:hover {
    color: #fff;
}

.flyover .close {
    color: #fff;
}

.flyover-body {
    margin-bottom: 64px;
}

    .flyover-body label {
        vertical-align: bottom;
    }

.flyover-footer {
    position: fixed;
    bottom: 0px;
    left: 0;
    right: 0;
    background-color: #efefef;
    z-index: 1;
}

.flyover-subheader {
    float: right;
    margin-right: 30px;
}

    .flyover-subheader label {
        color: #bdbdbd;
    }

.flyover-subheader-content {
    display: inline-block;
}

    .flyover-subheader-content label, .flyover-subheader-content p {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: baseline;
    }

.flyover .flyover-header .close-flyover {
    position: absolute;
    top: 10px;
    right: 30px;
}

/* Popup */
.description-buttons {
    padding-top: 10px;
}

    .description-buttons > button {
        margin-left: 10px;
        outline: none;
    }

/*Modal as right Sidebar*/

.modal.right .modal-dialog {
    position: fixed;
    margin: auto;
    width: 70%;
    max-width: 800px;
    height: 100%;
    -webkit-transform: translate3d(0%, 0, 0);
    -ms-transform: translate3d(0%, 0, 0);
    -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
}

#column-options-modal.right .modal-dialog {
    width: 30%;
    min-width: 300px;
    max-width: 360px;
}

.modal.right .modal-content {
    height: 100%;
    overflow-y: auto;
}

.modal.right .modal-body {
    padding: 15px 15px 80px;
}

.modal.right .modal-dialog {
    right: -320px;
    -webkit-transition: opacity 0.3s linear, right 0.3s ease-out;
    -moz-transition: opacity 0.3s linear, right 0.3s ease-out;
    -o-transition: opacity 0.3s linear, right 0.3s ease-out;
    transition: opacity 0.3s linear, right 0.3s ease-out;
}

.modal.right .modal-dialog {
    right: 0;
}

.modal .modal-header .id {
    display: none;
}

.modal.edit .modal-header .id {
    display: block;
}

.bg-white {
    background-color: #fff !important;
}


/*Issue Tracking*/

.issue-wrapper {
    background-color: #f7f7f7;
    padding: 10px 15px;
    border: 2px solid #ccc;
}

.issue-id {
    font-weight: 600;
    font-size: 16px;
}

.issues-board-wrapper .e-card .card-template .e-card-content .e-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.issues-board-wrapper .e-card .card-template .e-card-content .status {
    font-size: 12px;
    white-space: nowrap;
}

.issues-board-wrapper .e-card .card-template .e-card-footer {
    white-space: nowrap;
    font-size: 12px;
}

.issues-board-wrapper .e-kanban .e-kanban-table.e-content-table .e-content-row td {
    height: calc(100vh - 220px);
}

/*Issue Tracking*/
.tabbable-panel {
    border: 1px solid #eee;
    padding: 10px;
}

/* Issues Flyover Tabs */

.tabbable-line > .nav-tabs {
    border: none;
    margin: 0px;
}

    .tabbable-line > .nav-tabs > li {
        margin-right: 2px;
    }

        .tabbable-line > .nav-tabs > li > a {
            border: 0;
            margin-right: 0;
            color: #737373;
        }

            .tabbable-line > .nav-tabs > li > a > i {
                color: #a6a6a6;
            }

        .tabbable-line > .nav-tabs > li.open, .tabbable-line > .nav-tabs > li:hover {
            border-bottom: 3px solid rgba(25, 48, 72, .5);
        }

            .tabbable-line > .nav-tabs > li.open > a, .tabbable-line > .nav-tabs > li:hover > a {
                border: 0;
                background: none !important;
                color: #333333;
            }

                .tabbable-line > .nav-tabs > li.open > a > i, .tabbable-line > .nav-tabs > li:hover > a > i {
                    color: #a6a6a6;
                }

            .tabbable-line > .nav-tabs > li.open .dropdown-menu, .tabbable-line > .nav-tabs > li:hover .dropdown-menu {
                margin-top: 0px;
            }

        .tabbable-line > .nav-tabs > li.active {
            border-bottom: 3px solid #193048;
            position: relative;
        }

            .tabbable-line > .nav-tabs > li.active > a {
                border: 0;
                color: #333333;
            }

                .tabbable-line > .nav-tabs > li.active > a > i {
                    color: #404040;
                }

.tabbable-line > .tab-content {
    margin-top: -3px;
    background-color: #fff;
    border: 0;
    border-top: 1px solid #eee;
    padding: 15px 0;
}

.portlet .tabbable-line > .tab-content {
    padding-bottom: 0;
}

/* Issues Flyover Tabs */

#confirmation-box-container.e-dialog, #forecast-confirmation-box-container.e-dialog, #nested-confirmation-box-container.e-dialog {
    border-left: solid 4px red;
    box-shadow: 0 12px 25px 5px rgba(0, 0, 0, 0.3);
}

#excel .modal-dialog {
    width: 750px !important;
}

/*Scrollbar*/

.ss-wrapper {
    z-index: 0;
}

/*Error Page*/

#notfound {
    position: relative;
    height: calc(100vh - 70px);
}

    #notfound .notfound {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

.notfound {
    max-width: 520px;
    width: 100%;
    line-height: 1.4;
    text-align: center;
}

    .notfound .notfound-404 {
        position: relative;
        height: 200px;
        margin: 0px auto 20px;
        z-index: -1;
    }

        .notfound .notfound-404 h1 {
            font-family: 'Montserrat', sans-serif;
            font-size: 236px;
            font-weight: 200;
            margin: 0px;
            color: #211b19;
            text-transform: uppercase;
            position: absolute;
            left: 50%;
            top: 50%;
            -webkit-transform: translate(-50%, -50%);
            -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
        }

        .notfound .notfound-404 h2 {
            font-family: 'Montserrat', sans-serif;
            font-size: 28px;
            font-weight: 400;
            text-transform: uppercase;
            color: #211b19;
            background: #fff;
            padding: 10px 5px;
            margin: auto;
            display: inline-block;
            position: absolute;
            bottom: 0px;
            left: 0;
            right: 0;
        }

    .notfound a {
        font-family: 'Montserrat', sans-serif;
        display: inline-block;
        font-weight: 700;
        text-decoration: none;
        color: #fff;
        text-transform: uppercase;
        padding: 13px 23px;
        background: #ff6300;
        font-size: 18px;
        -webkit-transition: 0.2s all;
        transition: 0.2s all;
    }

        .notfound a:hover {
            color: #ff6300;
            background: #211b19;
        }

.error-message {
    position: absolute;
    bottom: 0;
    width: 100%;
    text-align: center;
    background-color: #ff00000d;
    padding: 5px 0;
}

/*Change Password Page*/

body.empty-page {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    background: #f4f4f4 url(../../img/login-bg.jpg) no-repeat center bottom;
    background-size: cover;
    background-attachment: fixed;
}

.img-logo {
    margin: 0px auto;
    display: table;
    width: 180px;
}

.form-signin {
    width: 360px !important;
    margin: 0 auto;
}

    .form-signin .panel-box {
        padding: 15px 35px 30px;
    }

    .form-signin .panel-wrapper {
        position: relative;
        background-color: #fff !important;
        float: left;
        width: 100%;
        border-radius: 6px;
        -webkit-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
        -moz-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
        box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
        max-height: 365px;
        overflow: auto;
    }

    .form-signin h6 {
        font-size: 17px;
        margin-bottom: 25px;
        text-transform: uppercase;
        text-align: center;
        font-weight: bold;
    }

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

.form-signin .btn-primary {
    background: #64C468;
    border-color: #64C468;
    padding: 10px !important;
}

/*Add issue Popup*/

.modal.add-issue.expanded .modal-dialog {
    margin: 38px 0 0 0;
}

/*Add User Popup*/

#addorg .nav-tabs > li.active > a,
#addorg .nav-tabs > li.active > a:focus,
#addorg .nav-tabs > li.active > a:hover {
    background-color: #f7f7f7;
}

#addorg .nav > li > a:focus,
#addorg .nav > li > a:hover {
    background-color: #f9f9f9;
    color: inherit;
}

#addorg .nav + .tab-content {
    padding: 10px;
    border: 1px solid #ddd;
    border-top: none;
}

/*Swimlanes*/

.e-treeview {
    white-space: normal;
}

    .e-treeview .e-list-icon, .e-treeview .e-list-img {
        display: unset;
        float: left;
        margin: 4px 0 0 5px;
    }

    .e-treeview .e-list-text {
        display: block;
        margin-left: 18px;
    }

    .e-treeview .e-list-item.e-level-2.e-active, .e-treeview .e-list-item.e-hover {
        position: relative;
    }

        .e-treeview .e-list-item.e-level-2.e-active > .e-fullrow,
        .e-treeview .e-list-item.e-level-2.e-hover > .e-fullrow {
            height: 100%;
        }

    .e-treeview .e-list-icon + .e-list-text, .e-treeview .e-list-img + .e-list-text {
        padding: 0 20px 0 10px;
        word-break: break-word;
    }

/*Dashboard Tiles*/

.dashboard-tiles {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.flex-container {
    display: flex;
    background: #fff;
    justify-content: space-between;
    padding: 10px 0;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
}

.flex-item {
    flex: 1 1 auto;
    min-width: 12.5%;
    border-right: 1px solid #ccc;
    position: relative;
}

.icon-tile {
    font-size: 75px;
}

    .icon-tile.p-bar {
        font-size: 16px;
    }

        .icon-tile.p-bar > div {
            left: 50% !important;
            margin-left: -50px;
        }

.tile-dashboard {
    padding: 15px;
    text-align: center;
    top: 50%;
    position: absolute;
    width: 100%;
    transform: translateY(-50%);
}
/* .tile-dashboard h5 {
    font-size: 20px;
} */

.flex-item:last-child {
    border-right: none;
}

/*Master data Sidebar*/

.accordion-toggle .fa {
    margin-top: 3px;
}

.list-group-item {
    border: none;
}

    .list-group-item:hover {
        background-color: #f7f7f7;
    }

    .list-group-item > a {
        text-decoration: none;
        color: inherit;
        margin-left: 15px;
    }

#timesheet-tasks-grid .e-summaryrow {
    height: 30px;
}

#timesheet-tasks-tasks-grid {
    margin-bottom: 10px;
}

#timesheet-tasks-grid {
    margin-top: 10px;
}

/*Admin Settings Page*/

.admin-settings .section-left, .admin-settings .section-right {
    float: left;
}

.admin-settings .section-left {
    min-width: 20%;
}

.admin-settings .section-right {
    width: 80%;
}

.admin-settings .header-main {
    padding: 20px 15px;
    border: 1px solid #efefef;
}


.admin-settings .section-right .header-main {
    border-left: none;
}

.admin-settings .navbar-admin-settings .nav-pills > li > a {
    border-radius: 0;
}

.admin-settings .nav {
    border: 1px solid #efefef;
    border-top: none;
}

.admin-settings .navbar-admin-settings .nav-stacked > li + li {
    margin-top: 0;
}

.admin-settings .tab-wrapper {
    padding: 10px 15px;
}

#organizationalCalendar .panel-heading a {
    color: inherit;
    text-decoration: none;
}

#organizationalCalendar .panel-heading {
    border-bottom: 1px solid #ddd;
}

    #organizationalCalendar .panel-heading + .panel-collapse > .list-group,
    #organizationalCalendar .panel-heading + .panel-collapse > .panel-body {
        border-top: none;
    }

    #organizationalCalendar .panel-heading a h4 i {
        transition: transform .3s ease-out;
    }

    #organizationalCalendar .panel-heading a.collapsed h4 i {
        transform: rotate( 90deg );
    }

/*Switch Account*/

.item-org {
    border-bottom: 1px solid #ccc;
    display: block;
    padding: 15px 35px 30px;
}

    .item-org:hover {
        background-color: #f7f7f7;
    }


/*Organization Settings Page*/

.section-related.collapsed .fas.fa-chevron-down {
    transform: rotate(-90deg);
}

.section-related .fas.fa-chevron-down {
    transition: .3s all ease-out;
    cursor: pointer;
}

/* Hide spreadsheets add button from forcast spreadsheet */
#forecast-spreadsheet .e-add-sheet-tab.e-btn.e-css.e-flat.e-icon-btn {
    display: none;
}

.modal.expanded #forecast-spreadsheet_sheet_panel, .modal.expanded #change-order-forecast-spreadsheet_sheet_panel {
    height: 390px !important
}

#forecast-spreadsheet_sheet_panel, #change-order-forecast-spreadsheet_sheet_panel {
    height: 330px !important;
}


/*User Profile*/


.avatar-wrapper {
    position: relative;
    height: 200px;
    width: 200px;
    margin: 50px auto;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 1px 1px 15px -5px black;
    transition: all .3s ease;
}

    .avatar-wrapper:hover {
        transform: scale(1.05);
        cursor: pointer;
    }

        .avatar-wrapper:hover .profile-pic {
            opacity: .5;
        }

    .avatar-wrapper .profile-pic {
        height: 100%;
        width: 100%;
        transition: all .3s ease;
    }

    .avatar-wrapper i {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        position: absolute;
        font-size: 190px;
        background: #ecf0f1;
        color: #34495e;
        text-align: center;
        z-index: 1;
    }

    .avatar-wrapper #image {
        position: relative;
        background: #f5f5f5;
        width: 100%;
        top: 50%;
        transform: translateY(-50%);
    }

    .avatar-wrapper .upload-button {
        position: absolute;
        top: 0;
        left: -17px;
        height: 100%;
        width: 100%;
        z-index: 3;
    }

        .avatar-wrapper .upload-button .fa-arrow-circle-up {
            position: absolute;
            font-size: 234px;
            top: -17px;
            left: 0;
            text-align: center;
            opacity: 0;
            transition: all .3s ease;
            color: #34495e;
        }

        .avatar-wrapper .upload-button:hover .fa-arrow-circle-up {
            opacity: .9;
        }

    .avatar-wrapper .img-wrapper {
        background-color: #efefef;
        width: 200px;
        height: 200px;
        z-index: 2;
        position: relative;
    }

.add-user-profile-pic.avatar-wrapper {
    height: 100px;
    width: 100px;
    margin: 25px auto;
}

    .add-user-profile-pic.avatar-wrapper i {
        font-size: 90px;
    }

    .add-user-profile-pic.avatar-wrapper .upload-button .fa-arrow-circle-up {
        font-size: 120px;
        top: -10px;
        left: 7px;
    }

#issues-grid tr.e-emptyrow > td {
    width: 200px;
}

#columns-listbox {
    padding: 5px 15px;
    font-size: 13px;
}

#scheduler-legend {
    margin-bottom: 0;
    margin-top: 10px;
}

ul#scheduler-legend > li {
    display: inline-block;
    margin-right: 10px;
}

    ul#scheduler-legend > li.my {
        display: inline-block;
        margin-right: 0px;
        position: relative;
    }

    ul#scheduler-legend > li:before {
        content: "";
        height: 10px;
        width: 10px;
        display: inline-block;
        margin-right: 5px;
    }

    ul#scheduler-legend > li.my:before {
        content: "";
        position: absolute;
        top: -1px;
        height: 20px;
        width: 6px;
        display: inline-block;
        margin-right: 5px;
    }

    ul#scheduler-legend > li.planned:before {
        background: #3f51b5;
    }

    ul#scheduler-legend > li.confirmed:before {
        background: #99d161;
    }

    ul#scheduler-legend > li.cancelled:before {
        background: #d74242;
    }

    ul#scheduler-legend > li.completed:before {
        background: #479e47;
    }

    ul#scheduler-legend > li.planned.my:before {
        background: #a3b1ff;
        left: 0px;
    }

    ul#scheduler-legend > li.confirmed.my:before {
        background: #3d7900;
        left: 4px;
    }

    ul#scheduler-legend > li.cancelled.my:before {
        background: #e6aeae;
        left: 8px;
    }

    ul#scheduler-legend > li.completed.my:before {
        background: #92d492;
        left: 12px;
    }

    ul#scheduler-legend > li.completed.my {
        padding-left: 20px;
    }

.e-excel-ascending {
    display: none;
}


.e-excel-descending {
    display: none;
}


.e-excel-separator {
    display: none;
}
.add-notification-color {
    background: #d3e9f9;
}

/************** Login Page *****************/

body.empty-page {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    background: #f4f4f4 url(../images/login-bg.jpg) no-repeat center bottom;
    background-size: cover;
    height: 100vh;
    background-attachment: fixed;
}

.empty-page .wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    padding-bottom: 20px;
    transform: translate(-50%,-50%);
    min-height: auto;
    margin-top: auto;
}

.form-signin {
    width: 360px !important;
    margin: 0 auto;
}

.empty-page .panel {
    margin-bottom: 25px !important;
}

.empty-page .panel-default {
    border: none;
}

.empty-page .panel.panel-logo {
    border-radius: 6px !important;
    -webkit-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
}

.form-signin .panel-box {
    padding: 15px 35px 30px;
    background-color: #fff !important;
    float: left;
    width: 100%;
    border-radius: 6px;
    -webkit-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
    box-shadow: 0px 0px 13px 0px rgba(0,0,0,0.1);
}

.form-signin .panel-body {
    padding: 15px;
    background: #ffffff;
}

.form-signin .panel.panel-logo .panel-body {
    border-radius: 6px !important;
}

.img-logo {
    margin: 0px auto;
    display: table;
    width: 180px;
}

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

.form-signin .form-control {
    position: relative;
    font-size: 16px;
    height: auto !important;
    padding: 10px !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box !important;
    padding-left: 10px !important;
    font-size: 13px !important;
}

.input-form .form-control {
    background-color: #ffffff;
    background-image: none;
    background-clip: padding-box;
    border: none !important;
    box-shadow: none;
    border: 1px solid #d4d4d4 !important;
    border-radius: 4px !important;
}

.form-signin input[type="password"] {
    margin-bottom: 0px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    width: 100%;
}

.form-signin .checkbox {
    font-weight: normal;
    padding-left: 20px;
}

.form-signin a.link {
    color: #3a8586;
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
    font-size: 13px;
}

.form-signin .btn-primary {
    background: #64C468;
    border-color: #64C468;
    padding: 10px !important;
}

.copy {
    position: absolute;
    font-size: 12px;
    color: #333;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    bottom: 0;
    margin-bottom: 20px;
}

.form-signin .checkbox label {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    padding-left: 5px;
    font-size: 13px;
}

.login-anch {
    color: #333;
    font-size: 13px;
    margin-top: 8px;
    display: block;
    text-align: center;
}

/***************** Scroll Css **********************/

.ss-scroll {
    background-color: rgba(0, 0, 0, 0.3);
    opacity: 1;
}

.issue-fields-container .issue-fields-layout {
    z-index: 0;
}

/***************** Help Page Css **********************/

.sidebar-help p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #999;
}

.sidebar-help a,
.sidebar-help a:hover,
.sidebar-help a:focus {
    text-decoration: none;
    transition: all 0.3s;
}

.sidebar-help .navbar {
    padding: 15px 10px;
    background: #fff;
    border: none;
    border-radius: 0;
    margin-bottom: 40px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}

.sidebar-help .navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}

.sidebar-help .line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

.wrapper-inner {
    display: flex;
    align-items: stretch;
    margin-top: -20px;
    min-height: calc(100vh - 50px);
}

.sidebar-help {
    min-width: 250px;
    max-width: 250px;
    background: #19304899;
    position: fixed;
    transition: all 0.3s;
    margin-left: -15px;
    border-right: 1px solid #ccc;
    height: calc(100vh - 50px);
    box-shadow: 0 0 6px 1px #ccc;
}

    .sidebar-help a,
    .sidebar-help a:hover,
    .sidebar-help a:focus {
        color: #fff;
    }

    .sidebar-help.active {
        margin-left: -265px;
    }

    .sidebar-help .sidebar-header {
        padding: 20px;
        background: #6d7fcc;
    }

    .sidebar-help ul.components {
        padding: 20px 0;
        height: calc(100vh - 50px);
        overflow: hidden;
        overflow-y: auto;
    }

    .sidebar-help ul p {
        color: #fff;
        padding: 10px;
    }

    .sidebar-help ul li a {
        padding: 10px;
        font-size: 1.1em;
        display: block;
        color: #fff;
    }

        .sidebar-help ul li ul li.active > a,
        .sidebar-help ul li a:hover {
            color: #193048;
            background: #fff;
        }

    .sidebar-help a[aria-expanded="true"].help-menu {
        color: #fff;
        background: #193048cc;
    }

    .sidebar-help a[data-toggle="collapse"] {
        position: relative;
    }

    .sidebar-help a[aria-expanded="false"].help-menu::before,
    .sidebar-help a[aria-expanded="true"].help-menu::before {
        content: '\e259';
        display: block;
        position: absolute;
        right: 20px;
        font-family: 'Glyphicons Halflings';
        font-size: 0.6em;
    }

    .sidebar-help a[aria-expanded="true"].help-menu::before {
        content: '\e260';
    }

    .sidebar-help ul ul a {
        font-size: 0.9em !important;
        padding-left: 30px !important;
        background: #19304899;
        color: #fff;
    }

    .sidebar-help a.download {
        background: #fff;
        color: #7386D5;
    }

    .sidebar-help a.article,
    .sidebar-help a.article:hover {
        background: #6d7fcc !important;
        color: #fff !important;
    }

    .sidebar-help ~ #content {
        padding: 20px;
        transition: all 0.3s;
        font-size: 16px;
        color: #777;
        margin-left: 250px;
    }

        .sidebar-help ~ #content.collapsed {
            margin-left: 0;
        }

        .sidebar-help ~ #content ol {
            padding-left: 15px;
        }

            .sidebar-help ~ #content ol.roman > li {
                list-style: lower-roman;
                /*margin-left: 30px;*/
                font-size: 14px;
            }

            .sidebar-help ~ #content ol.alpha > li {
                list-style: lower-alpha;
                font-size: 14px;
            }

        .sidebar-help ~ #content img {
            box-shadow: 0 0 6px 1px #ccc;
        }

        .sidebar-help ~ #content h3,
        .sidebar-help ~ #content h4 {
            color: #444;
        }



    .sidebar-help #sidebarCollapse {
        position: absolute;
        right: -30px;
        top: 0;
        z-index: 1;
    }

.btn-sidebar-help {
    background-color: #758391;
    color: #fff;
    font-size: 14px;
    padding: 2px 4px;
}

.sidebar-help .btn.btn-sidebar-help.focus,
.sidebar-help .btn.btn-sidebar-help:focus,
.sidebar-help .btn.btn-sidebar-help:hover {
    color: #fff;
    background-color: #2b4057;
}

#accordionhelp > li > a {
    border-bottom: 1px solid #ffffff80;
}

    #accordionhelp > li > a[aria-expanded="true"] {
        border-bottom: none;
    }


.gif {
    position: relative;
}

.gif-overlay {
    display: none;
    width: 900px;
    background: #f5f5f5;
    height: 100%;
    position: absolute;
    z-index: 1;
}

.btn.gif-button {
    position: absolute;
    top: 50%;
    left: 50%;
    border-radius: 50%;
    width: 70px;
    height: 70px;
    margin-top: -35px;
    margin-left: -35px;
    background-color: #fff;
    border: 1px dotted #777;
    letter-spacing: 2px;
}

.gif-overlay.active {
    display: block;
}

.modal.expanded {
    padding-right: 0 !important;
    padding-left: 0 !important;
}
a.SCRTaskTitle{
    color: #000000;
    cursor: default;
} 
.SCRTaskTitle:hover{
    text-decoration: none !important;
}

.modal-resizable.expanded .modal-dialog {
    top: auto;
}
.modal-resizable-sm.expanded .modal-dialog {
    top: auto;
}

.check-box {
    margin-top: 23px;
}

.img-overlay {
    position: absolute;
    inset: 0;
    z-index: 9999;
    background: rgb(0 0 0 / 50%);
    overflow: auto;
}
    .img-overlay i {
        position: absolute;
        top: 5%;
        right: 5%;
        font-size: 34px;
        color: #fff;
        cursor: pointer;
    }

    .img-overlay img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        max-width: -webkit-fill-available;
        cursor: zoom-in;
        transition: .3s all ease-out;
    }

    .img-overlay .zoomed-in {
        transform: translate(-50%, -50%) scale(1.5);
        cursor: zoom-out;
    }

#select-timesheet-model {
    width: 400px
}

.gridbutton-delete:disabled {
    pointer-events: none;
}
button#issue-task-counter, button#my-issue-task-counter {
    font-weight: 500;
}
button#selected-issue-task-counter {
    font-weight: 500;
}
.ej-ddl-main-item {
    line-height: 25px;
    display: block;
}
.ej-ddl-sub-item {
    position: relative;
    font-size: 10px;
    display: block;
    line-height: normal;
    color: #c0c0c0;
    margin-bottom: 5px;
}

/*************Media Queries**************/

@media screen and (min-width: 1400px) {
    .modal-scenario-detail .modal-dialog,
    .modal-resizable .modal-dialog {
        width: 1200px;
    }

    .modal-resizable-sm .modal-dialog {
        width: 1000px;
    }

    .modal-scenario-detail .modal-dialog,
    .modal-resizable .modal-dialog {
        margin-top: -300px;
    }

    .scrollable-content-main {
        height: 460px;
    }
}

@media screen and (min-width: 1600px) {
    .modal-scenario-detail .modal-dialog,
    .modal-resizable .modal-dialog {
        width: 1400px;
    }

    .modal-resizable-sm .modal-dialog {
        width: 1000px;
    }

    .modal-scenario-detail .modal-dialog,
    .modal-resizable .modal-dialog {
        margin-top: -326px;
    }

    .scrollable-content-main {
        height: 510px;
    }
}

@media screen and (min-width: 1900px) {
    .modal-scenario-detail .modal-dialog,
    .modal-resizable .modal-dialog {
        width: 1700px;
    }

    .modal-scenario-detail .modal-dialog,
    .modal-resizable .modal-dialog {
        margin-top: -348px;
    }

    .scrollable-content-main {
        height: 550px;
    }
}