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

.sidebar-logo img {
    height: 40px;
    width: auto;
}

#side-btns-affix {
    overflow: hidden;
}

.react-player-active {
    position: absolute;
    top: 10px;
    left: 0px;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    overflow: hidden;

}


/*.reportGrid:focus {*/
/*    background-color: yellow !important;*/
/*    border: 2px solid #36648B;*/
/*}*/
/*.reportGrid:active {*/
/*    background-color: orange !important;*/
/*    border: 2px solid #36648B;*/
/*}*/

#top-navbar {
    padding-right: 0px !important;
}

.report-header-right-section-btn {
    color: #222 !important;
    cursor: pointer;

}

.report-header-right-section-btn:hover {
    color: #6c94af !important;
}


.back-to-home-arrow {

    color: #222 !important;
    cursor: pointer;

}

.back-to-home-arrow:hover {
    color: #fff !important;
    background-color: #36648B !important;
}


.report-header-right-section-btn-active {
    background-color: #36648B !important;
    color: #fff !important;;
}

.report-header-right-section-btn-active:hover {
    color: #fff !important;;
}

.report-header-right-section-btn-active span:hover {
    color: #fff !important;;
}

.playBtn {
    background-color: #2D4BB6;
    cursor: pointer;
    height: 66px;
    width: 15%;
    border-radius: 10px;
    left: 42.5%;
    bottom: 42%;
    transition: all ease-in-out .3s;
    position: absolute
}

@media (max-width: 991px) {
    .playBtn {
        right: 32%;
        bottom: 27%;
    }
}


.playBtn:hover {
    background-color: #6c94af;
}


@media (min-width: 768px) {
    .side-btns-affix {
        display: block;
        width: 13%;
        position: fixed;
        left: 8.5rem;
        top: 25%;
        height: 100px;
        text-align: center;
        padding: 0;
    }

    .dropzoneSideBtn {
        height: 100%;
    }
}

@media (max-width: 767px) {
    .side-btns-affix {
        display: none;
    }
}

.errorMessage {
    font-size: 14px;
    width: 100%;
    textAlign: center;
    color: #881910;
    margin: 0px;
    margin-right: 10px

}

.welcomeMessage {
    color: #36648B;

}

.svg-icon {
    width: 25px;
    height: auto;
}

.dataTables-svg-icon {
    text-align: center;
    width: 35px;
    height: auto;
}

.dataTables-svg-icon-large {
    text-align: center;
    width: 35px;
    height: auto;
}

.itemViewerLargeThumb img {
    text-align: center;
    width: 140px;
    height: auto;
    filter: drop-shadow(0 0 2px #d7d5d5);
}

.itemViewerLargeThumb span {
    font-size: 20px;
}

.itemViewerCompanyFolder {
    margin-bottom: 1.5rem !important;
}


.itemViewerSmallThumb img {
    text-align: center;
    width: 80px;
    height: auto;
    filter: drop-shadow(0 0 2px #d7d5d5);
}

.svg-box-shadow {
    filter: drop-shadow(0 0 5px #d7d5d5);
}


.itemViewerLargeThumb span {
    font-size: 15px;
}

#dataTable tr {
    cursor: pointer;
    text-align: center !important;
}

#dataTable tbody > tr:hover {
    color: #36648B;
    text-decoration: underline;
}


.dataTablesFolderActive {
    background-color: rgba(99, 183, 255, 0.16) !important;
}

.dataTablesFolderHover {
    background-color: rgba(99, 183, 255, 0.3) !important;
}

@keyframes dataTablesDropComplete {
    from {
        background-color: rgba(66, 255, 144, 0.3)
    }
    to {
        background-color: #fff;
    }
}

.dataTablesDropComplete {
    animation-name: dataTablesDropComplete;
    animation-duration: 2s;
}

.text-gateway-blue {
    color: #36648B !important;
}

.bg-gateway-blue {
    background-color: #36648B !important;
}

.bg-gateway-blue-secondary {
    background-color: #4e779b !important;
}

.reverseBtn {
    position: absolute;
    /* top: 2px; */
    z-index: 10;
    left: 20px;
}

.ajaxOverlay {
    position: absolute;
    background-color: #fff;
    /*top:0;*/
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

.spinner-border {
    margin-top: auto;
    margin-bottom: auto;
}

.dz-preview {
    display: none !important;
}

#progress-bar-container {
    display: none;
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #fff;
    z-index: 10000;
}

#progress-bar-container-thumbnail {
    display: none;
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #fff;
    z-index: 10000;
}

.progress {
    text-align: center;
    margin-left: 10px;
    margin-right: 10px;
    height: 2rem;
}

.progress-text {
    position: absolute;
    text-align: center;
    font-size: 20px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    color: #fff;

}

.progress-bar {
    height: 100% !important;
}

.vAlign {
    position: relative !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.vAlign25 {
    position: relative !important;
    top: 25% !important;
    transform: translateY(-25%) !important;
}

.bar {
    position: absolute;
    height: 10px;
    width: 25%;
    max-height: 100%;
    max-width: 100%;
    position: fixed;
    top: 50%;
    left: 37.5%;
    border-radius: 25px;
    background-color: rgba(87, 161, 224, 0.28);
}

@media (max-width: 767px) {

    .bar {
        left: 15%;
        width: 70%;
    }
}

.in {
    animation: fill 1.5s linear 1;
    height: 100%;
    background-color: #36648B;
    border-radius: 25px;
}


@keyframes fill {
    0% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

.rdt_TableHeader {
}

.gVZomo {
    overflow: hidden !important;
    min-height: 300px;
!important;
}

.cpRjbT {
    max-height: 60vh !important;
}

.no-line-break {
    white-space: nowrap;
}

.itemDrag {
    flex-grow: 1;
    margin: 10px;
}

.item-container {
    display: flex;
    flex-direction: column;
}

.tileContainer {
    min-height: 75vh;
}

.item-list {
    display: flex;
}


.rce-container-input {
    height: 100% !important;
}

.rce-input rce-input-textarea {
    height: 100% !important;
}


.message-board-input-container {
    flex: 4 !important;

}

.rce-container-mlist message-list {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.message-board-input-container textarea {
    height: 100% !important;
}

.message-board-input-container .rce-input-buttons {
    height: 100% !important;
}

.message-board-input-container button {
    height: 100% !important;
}

.rce-mbox-title {
    pointer-events: none !important;
}

.rce-container-mbox {
    position: relative;
    padding-top: 10px;
    padding-bottom: 10px;
}

.rce-mbox-left-notch {
    fill: #fff !important;
}

.rce-container-input {
    border-top: 2px solid #e3e6f0 !important;
}

.rce-input-buttons {
    margin: 0px !important;
}

.message-board-input-container button {
    border-radius: 0px !important;
    font-weight: 600 !important;
}


.message-list .data-source-row-avatar-container .data-source-row-avatar {
    border-radius: 50%;
}

.message-list {
    padding-left: 10px;
    padding-right: 10px;
    flex: 20 !important;
}

.taskInfoMessage {
    max-width: 400px !important;
}

/* Style the container with a rounded border, grey background and some padding and margin */
.messengerRightTopContainer {


    border-radius: 5px;
    padding: 8px;
    margin: 8px 0;
}

/* Clear floats after containers */
.messengerRightTopContainer::after {
    content: "";
    clear: both;
    display: table;
}

/* Float images inside the container to the left. Add a right margin, and style the image as a circle */
.messengerRightTopContainer img {
    float: left;
    margin-right: 20px;
    border-radius: 50%;
}

/* Increase the font-size of a span element */
.messengerRightTopContainer span {
    font-size: 14px;
    margin-right: 15px;
}

/* Add media queries for responsiveness. This will center both the text and the image inside the container */
@media (max-width: 500px) {
    .messengerRightTopContainer {
        text-align: center;
    }

    .messengerRightTopContainer img {
        margin: auto;
        float: none;
        display: block;
    }
}

.message-list {
    height: 70% !important;
}

.centerDiv {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 2rem;
}

.boxShadowFull {
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.boxShadowFullCoactBlue {
    -webkit-box-shadow: 0 0 10px rgba(54, 100, 139, 0.52);
    box-shadow: 0 0 10px rgba(54, 100, 139, 0.52);
}

.rdrDateRangePickerWrapper {
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
    border: 1px solid #36648B !important;

}

.boxShadowFullDeep {
    -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .2);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .2);
}

.boxShadowBottom {
    box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);
    -webkit-box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);
}

.boxShadowBottomLight {
    box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.15);
    -webkit-box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.11);
}


.boxShadowBottomHeavy {
    box-shadow: 0 7px 7px 0px rgba(215, 213, 213, 0.93);
    -webkit-box-shadow: 0 7px 7px 0px rgba(215, 213, 213, 0.93);

}

.boxShadowTop {
    box-shadow: 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
    -webkit-box-shadow: 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
}

.boxShadowTopHeavy {
    box-shadow: 0 -5px 5px -5px rgb(171, 169, 169);
    -webkit-box-shadow: 0 -5px 5px -5px rgb(171, 169, 169);
}

.boxShadowTopInset {
    box-shadow: inset 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
    -webkit-box-shadow: inset 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
}

.boxShadowLeft {
    box-shadow: -1px 0px 1px 1px rgba(215, 213, 213, 0.44);
}

/*.boxShadowTop{*/
/*    -webkit-box-shadow: 0 4px 2px -2px #d7d5d5;*/
/*    box-shadow: 0 4px 2px -2px #d7d5d5;*/
/*}*/

.kpi-tracker-search-select-container {
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;

}

.kpi-tracker-search-select__menu {
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;

}

.kpi-tracker-search-select__control::-webkit-scrollbar {

    width: 0px !important;

    display: none !important;
}

.kpi-tracker-search-select__control {

    -ms-overflow-style: none !important; /* IE and Edge */
    scrollbar-width: none !important; /* Firefox */
}

.kpi-tracker-search-select__indicators {
    display: none !important;
}


#customScrollBar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3) !important;
}

#customScrollBar::-webkit-scrollbar {
    width: 5px !important;
    height: 10px !important;
    background-color: #F5F5F5 !important;
}

#customScrollBar::-webkit-scrollbar-thumb {
    background-color: rgba(160, 160, 160, 0.55) !important;
}

.customScrollBar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(194, 194, 194, 0.3) !important;
}

.customScrollBar::-webkit-scrollbar {
    width: 5px !important;
    height: 10px !important;
    background-color: #F5F5F5 !important;
}

.customScrollBar::-webkit-scrollbar-thumb {
    background-color: rgba(160, 160, 160, 0.55) !important;
}

.messenger-user-items {
    border: none;
    background-color: transparent;
    color: #6c94af;
    font-size: 125%;
    cursor: pointer;
}

.messenger-user-items:hover {
    color: #36648B
}

.data-source-rows-container {
    background-color: #f6f6f6;
    border-bottom: 1px solid rgba(0, 0, 0, .05) !important;
    border-top: 1px solid transparent;
}

.data-source-rows-container {
    background-color: #f6f6f6;
    border-bottom: 1px solid rgba(0, 0, 0, .05) !important;
    border-top: 1px solid transparent;
}

.data-source-row {
    min-width: 0px !important;
}

.data-source-row-avatar img {
    background-color: transparent !important;
    width: 10px;
}

.data-source-row-avatar {
    display: inline-block;
}


.data-source-row-body {
    margin-left: 15px;
    display: inline-block;
    border-bottom: 0px solid #fff !important;
}

.rce-container-input {
    background-color: rgba(245, 245, 245, 0.34) !important;
}

.data-source-row-body--bottom-status span {
    background-color: #36648B !important;
    padding: 2px !important;
}

.messengerUserSearch {
    flex: 1 1;
    height: 40px;
    padding: 0 5px;
    border: none;
    border-radius: 5px;
    color: #333;
    font-size: 14px;
    box-sizing: border-box;
    outline: none;
}

.videoCallActionBtn {
    display: inline-block;
    border-radius: 40%;
    box-shadow: 0px 0px 2px #888;
    width: 50px;
    height: 50px;
    /*padding-top: 15px;*/
    cursor: pointer;
    padding: 0.5em 0.6em;
    margin-top: 12px;
    margin-left: 8px;
    margin-right: 8px;
    font-size: 20px;
    color: #fff;
    background-color: #36648B;


    /*background-color: #36648B;*/
    /*color: #fff;*/
    /*display: inline;*/
    /*width: 100px;*/
    /*height: 100px;*/
    /*border-radius: 50%;*/
    /*text-align: center;*/
    /*line-height: 70px;*/
    /*vertical-align: middle;*/
    /*padding: 10px;*/
    /*margin-left:8px;*/
    /*margin-right: 8px;*/
    /*font-size: 28px;*/
    /*cursor:pointer;*/
}

.react-confirm-alert-body {
    text-align: center !important;
}

.react-confirm-alert-body h1 {
    font-weight: 600 !important;
    font-size: 20px !important;
}

.react-confirm-alert-button-group {

    justify-content: center !important;
}

.react-confirm-alert-button-group > button {

    background-color: #36648B !important;
}

.notifications-bl {
    padding-left: 0px !important;
}

.notifications-br {
    padding-right: 0px !important;
}

.notification-success {
    background-color: #36648B !important;
    border-top: 1px solid #0c4d8b !important;
    color: #fff !important;
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
    -webkit-box-shadow: 0 0 10px #888 !important;
    box-shadow: 0 0 10px #888 !important;

}

.notification-success > h4 {
    color: #fff !important;
}


.notification-dismiss {
    background-color: #fff !important;
    color: #36648B !important;
}


.dot {
    height: 25px;
    width: 25px;
    border-radius: 50%;
    display: inline-block;
}

.green {
    color: #78AB46 !important;
}

.red {
    color: #881910 !important;
}

.backgroundRed {
    background-color: #881910 !important;

}

.yellow {
    color: #E5E500 !important;
}

.orange {
    color: #e87d1d !important;
}

.img-profile-folder {
    position: absolute !important;
    left: 20% !important;
    width: 60px !important;
    height: auto;

}

@media (max-width: 769px) {

    .img-profile-folder {
        left: 30% !important;

    }
}

#sharedFolderController-tab-tools.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff !important;
}

#sharedFolderController-tab-chat.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff !important;
}

#sharedFolderController-tab-users.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff !important;
}

#sharedFolderController-tab-settings.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff;
}

#projectViewSelector-tab-list.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#projectViewSelector-tab-calendar.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#projectViewSelector-tab-board.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}


#projectViewSelector-tab-info.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#projectViewSelector-tab-settings.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#taskListController-tab-users.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}

#taskListController-tab-milestones.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff;
}

#taskListController-tab-info.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}

#taskListController-tab-activity.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    /*border-bottom: 1px solid #36648B;*/
    color: #fff !important;
}

#taskListController-tab-settings.active {
    background-color: #36648B;
    /*border-top: 1px solid #36648B;*/
    /*border-left: 1px solid #36648B;*/
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}

#taskListController-tab-files.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}


#search-tab-users.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}


#search-tab-files.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}


#search-tab-projects.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}


#search-tab-tasks.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}

.activeTab {
    /*background-color: #36648B;*/
    /*border-top: 1px solid #36648B;*/
    /*border-left: 1px solid #36648B;*/
    /*border-right: 1px solid #36648B;*/
    /*border-bottom: 1px solid #36648B;*/
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #36648B !important;
}

/*.activeTab {*/
/*    background-color: #36648B;*/
/*    border-top: 1px solid #36648B;*/
/*    border-left: 1px solid #36648B;*/
/*    border-right: 1px solid #36648B;*/
/*    border-bottom: 1px solid #36648B;*/
/*    border-top-left-radius: 5px;*/
/*    border-top-right-radius: 5px;*/
/*    color: #fff !important;*/
/*}*/

.activeTab:hover {
    color: #36648B !important;
}

.activeCollapseItem {
    color: #36648B !important;
    background-color: #fff !important;
}

#react-confirm-alert {
    z-index: 99999999;
}

.cursor {
    cursor: pointer !important;
}

.taskDropdownBtn {
    background-color: transparent !important;
    border: none !important;
    color: inherit !important;
    border-bottom: 1px solid #e3e6f0 !important;
    border-radius: 0px !important;
    /*padding: 2px 10px 2px 10px !important;*/
}

.taskDropdownBtn:hover {
    color: #6c94af !important;
}


.addTaskBtn {
    background-color: rgba(234, 236, 244, 0.57) !important;
    border-radius: 10px !important;
    min-width: 40px !important;
    border: 1px solid rgba(234, 236, 244, 0.74) !important;

}

.addTaskBtn:hover {
    background-color: #36648B !important;
    border-radius: 10px !important;
    min-width: 40px !important;
    border: 1px solid #e3e6f0 !important;

}

.itemSelectedButton {
    background-color: transparent !important;
    color: inherit !important;
    border: 1px solid #e3e6f0 !important;
    border-radius: 2px !important;

    padding: 2px 10px 2px 10px !important;
}

.itemSelectedButton:hover {
    background-color: #36648B !important;
    color: #fff !important;
    fill: #fff !important;
    border: 1px solid #fff !important;
    border-radius: 2px !important;
    /*padding: 2px 10px 2px 10px !important;*/
}

.task-Completed {
    color: #fff;
    background-color: #78AB46;
    border-color: #78AB46
}

.task-In-Progress {
    color: #fff;
    background-color: #F5A800;
    border-color: #F5A800
}

.AssignedBtn {
    color: #fff;
    background-color: #96ab94 !important;
    border-color: #687967 !important;
}

.AssignedBtn:hover {
    color: #fff;
    background-color: #78AB46 !important;
    border-color: #78AB46 !important;
}

.inProgressBtn {
    color: #fff;
    background-color: rgba(113, 77, 0, 0.48) !important;
    border-color: rgba(113, 77, 0, 0.48) !important;
}

.inProgressBtn:hover {
    color: #fff;
    background-color: #F5A800 !important;
    border-color: #F5A800 !important;
}

.inProgressBtnLight {
    color: #fff;
    background-color: rgba(212, 153, 27, 0.48) !important;
    border-color: rgba(113, 77, 0, 0.48) !important;
}

.inProgressBtnLight:hover {
    color: #fff;
    background-color: #F5A800 !important;
    border-color: #F5A800 !important;
}

.task-Accepted {
    color: #fff;
    background-color: #36648B;
    border-color: #36648B;
}

.task-Declined {
    color: #fff;
    background-color: #881910;
    border-color: #881910;
}

.task-Overdue {
    color: #fff;
    background-color: #881910;
    border-color: #881910;
}

.task-Proposed-new-time {
    color: #fff;
    background-color: #36648B;
    border-color: #36648B;
}

.task-Assigned {
    color: #fff;
    background-color: #36648B;
    border-color: #36648B;
}

.task-Unassigned {
    color: #fff;
    background-color: #222;
    border-color: #222;
}

.rbc-current-time-indicator {
    display: none
}

.rbc-event {
    padding: 0px !important;
    border-radius: 5px !important;
}

.rbc-overlay {
    min-width: 320px !important;
}

.rbc-addons-dnd .rbc-addons-dnd-resize-ew-anchor {
    top: 9px !important;
}

.react-contextmenu--visible {
    background-color: #1f3a50;
    color: #fff;
    padding: 15px;
    border-radius: 10px;
    cursor: pointer;
}

.date-picker {
    font-weight: 400;
    border: 0px;
    display: inline-block;
    color: inherit;
    text-align: left;
}

.input-error {
    color: #881910 !important;
    text-decoration: line-through;
    font-weight: 600;
}

input.cursor.date-picker.input-error {
    text-align: center !important;
}

.rce-mbox {

    background-color: #fff !important;
    max-width: 414px !important;
    min-width: 225px !important;
    padding-top: 10px;
    /*background-color: #f9f9f9 !important;*
}

.rce-mbox-file {
    overflow: hidden
}

.rce-mbox-file-added-container {
    padding-bottom: 15px !important;
    cursor: pointer !important;
}

.rce-mbox-left-notch {
    fill: rgb(243, 246, 248) !important;
    /*fill: #f9f9f9 !important;*/
}

.rce-mbox.rce-mbox-right {
    background-color: #e6effe !important;
}

.rce-mbox-right-notch {
    fill: #e6effe !important;
}

.status-pill {
    cursor: default !important;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 10rem;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
}

.tag-pill {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 10rem;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    margin-left: 10px;
    line-height: 1.5;
}

.filterDropdownContainer {
    max-height: 65vh !important;
    overflow-y: auto;
}


.filterSearch {
    background-color: rgba(245, 245, 245, 0.34);
    height: 40px;
    border-radius: 0px;
    width: 100%;
    border: 0px;
    padding: 0 5px;
    color: #333;
    font-size: 14px;
}

.filter-active {
    background-color: #36648B !important;
    color: #fff !important;

}

.white {
    color: #fff !important;
}

.rbc-month-row {
    cursor: pointer;
}

.jdZEYg {
    background-color: rgb(245, 245, 245) !important;
}

.hide-backblaze {
    height: 0px !important;
    border: 0px !important;
}

.itemSortDropdown {
    left: -100px !important;
}


.masterFolder {
    margin-left: 25px
}

.indentFolder {
    margin-left: 50px
}

.css-bdjl4r {
    color: rgba(0, 0, 0, 0.1) !important
}

.emoji-mart-bar {
    display: none;
}

@media (max-width: 576px) {
    .xs-hide {
        display: none;
    }
}

@media (max-width: 767px) {
    .md-hide {
        display: none;
    }
}

@media (min-width: 576px) {
    .desktop-hide {
        display: none;
    }
}

@media (max-width: 992px) {
    .sm-desktop-hide {
        display: none
    }
}


@media (max-width: 767px) {
    .mobile-hide {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .messengerOverlay {
        top: 4.375rem;
        left: 0rem;
    }
}

@media (max-width: 767px) {
    .messengerOverlay {
        left: 0rem;
        top: 4.375rem;
    }

}

.data-source-container {
    overflow-x: hidden !important;
    width: 100%;
}

@media (max-width: 767px) {
    .data-source-row-body--top-title {
        font-size: 100% !important;
    }

    .data-source-row-body--bottom-title {
        font-size: 80% !important;
    }
}

@media (max-width: 767px) {
    .rightContainerTopContent h2 {
        font-size: 18px !important;
        padding-top: 10px;
    }
}

@media (max-width: 564px) {
    .rightContainerTopContent h2 {
        font-size: 14px !important;
        padding-top: 0px;
    }

    #chatUserImageCircle {
        height: 30px !important;
    }

    .messenger-user-items {
        padding: 0px !important;
    }
}

.data-source-row {
    min-width: 0px !important;
}

.ReactTags__selected {
    margin: 10px;

}

.tag-wrapper {
    cursor: pointer !important;
    overflow-wrap: break-word;
    background-color: #f1f1f1;
    color: #36648B;
    padding: 5px;
    margin: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 2px #d7d5d5;
    box-shadow: 0 0 2px #d7d5d5;
    border: 1px solid #d1d3e2;
}

.ReactTags__tagInput {
    margin-top: 15px;
}

.ReactTags__tagInputField {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
    -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.milestone-date-picker {
    margin-top: 14px;
    background-color: transparent;
    /*float:right*/
}

.suggestionsClass {
}

.suggestionsClass li {
    display: inline-block;
    list-style-type: none;
    cursor: pointer !important;
    overflow-wrap: break-word;
    background-color: #f1f1f1;
    color: #36648B;
    padding: 5px;
    margin: 8px;

    border-radius: 4px;
    -webkit-box-shadow: 0 0 2px #d7d5d5;
    box-shadow: 0 0 2px #d7d5d5;
    border: 1px solid #d1d3e2;
}

.activeSuggestionClass li {
    border: 1px solid #36648B !important;
}

.activeSuggestionClass {
    background-color: #36648B !important;
    color: #fff !important;
}

.rbc-toolbar-label {
    text-align: left !important;
    font-weight: 600;
    color: #36648B;
    /*text-align:left !important;*/
}

.react-datepicker__input-container {
    /*width:50%;*/
}

.react-confirm-alert-overlay {
    z-index: 10030 !important;
}

.border-none {
    border: 0px !important;
}

@media (max-width: 767px) {
    .md-border-none {
        border: 0px !important;

    }

}

.fullScreenRemoteVideo {
    z-index: 99999999;
    height: 100%;
    width: 100%;
    left: 0px;
    top: 0px;
    position: fixed;
    background-color: #22222269;
}

.remoteVideo {
    height: 100%;
    z-index: 500000;
}

.fullScreenLocalVideo {

    width: 200px;
    height: 150px;
    box-shadow: 0px 0px 10px #626262;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 99999999999;

}

.localVideo {
    width: 200px;
    height: 150px;
    box-shadow: 0px 0px 10px #626262;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 500001;
}

.fullScreenVideoController {

    z-index: 99999999;
    position: fixed;
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -5px;
    right: 25%;
    left: 50%;
    margin-left: -150px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;

}

.hideVideoController {
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    z-index: 500002;
    position: absolute;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -76px;
    right: 25%;
    left: 50%;
    margin-left: -180px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;
}


.hideFullScreenVideoController {

    z-index: 99999999;
    position: fixed;
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -76px;
    right: 25%;
    left: 50%;
    margin-left: -150px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;

}

.videoController {
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    z-index: 500002;
    position: absolute;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -5px;
    right: 25%;
    left: 50%;
    margin-left: -180px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;
}

.fullScreenLocalVideoOverlay {

    width: 200px;
    height: 150px;
    box-shadow: 0px 0px 10px #626262;
    position: fixed;
    left: 0px;
    top: 0px;
    color: #fff;
    background-color: #36648B;
    z-index: 299999999999;
    cursor: pointer;

}

.localVideoOverlay {
    cursor: pointer;
    width: 200px;
    height: 150px;
    color: #fff;
    box-shadow: 0px 0px 10px #626262;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: #36648B;
    z-index: 500002;

}

.fullScreenVideoHeader {
    position: absolute;
    margin-left: -150px;
    width: 300px;
    left: 50%;
    top: 2%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #fff;
    z-index: 99999999;
}

.videoHeader {
    position: absolute;
    width: 300px;
    left: 50%;
    top: 5%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #fff;

}


.pointer {
    cursor: pointer !important;
}

.activeSidebarLink {
    color: #fff !important;
}

.gDriveFolderTile:hover {
    background-color: #36648B;
    color: #fff;
}


.gDriveItemTile:hover {
    -webkit-box-shadow: 0 0 10px #36648B;
    box-shadow: 0 0 10px #36648B;
}

.gDriveItemSelected {
    -webkit-box-shadow: 0 0 10px #78AB46;
    box-shadow: 0 0 10px #78AB46;
}

@media (max-width: 991px) {
    .lg-md-hide {
        display: none;
    }
}

@media (max-width: 1200px) {
    .lg-hide {
        display: none;
    }
}

.showAddFileBtn {
    background-color: #6c94af
}

.showAddFileBtn:hover {
    background-color: #36648B
}

.google-drive-return:hover {
    text-decoration: none !important;
}

.google-drive-return-btn {
    background-color: #6c94af;
}

.google-drive-return-btn:hover {
    background-color: #36648B;
}

.dropHover {
    border: 2px dashed rgba(0, 0, 0, 0.125);
}

.dropHover:hover {
    border: 2px dashed #36648B;
}

.dropHoverComplete {
    border: 2px dashed #78AB46;
}

.picker-dialog {
    z-index: 10004 !important;
}

.picker-dialog-bg {
    z-index: 10003 !important;
}

.no-rce-hover:hover {
    background-color: #fff !important;

}

.activeTaskController {

    background-color: rgb(240, 244, 252) !important;
    border: 1px solid #36648B !important;
}


.unreadComment {
    background-color: #fff;
    animation-name: color;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

.unreadCommentTaskController {
    background-color: rgb(249, 249, 249);
    animation-name: color;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

@keyframes color {
    0% {
        background-color: #fff;
    }
    50% {
        background-color: #e5efff;
    }
    100% {
        background-color: #fff;
    }
}

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

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

.Aligner {

    display: flex;
    align-items: center;
    justify-content: center;
}

.Aligner-item {
    max-width: 50%;
}

.Aligner-item--top {
    align-self: flex-start;
}

.Aligner-item--bottom {
    align-self: flex-end;
}

@media (max-width: 992px) {
    .medium-scroll {
        overflow-y: scroll !important;

    }
}

@media (min-width: 993px) {
    .medium-scroll {
        overflow-y: hidden !important;

    }
}

.project-select:hover {
    background-color: rgba(229, 239, 255, 0.5);
}

.project-select-alt:hover {
    background-color: #f9f9f9;
}

.commentTabContentParent .tab-content {
    overflow-x: hidden !important;
}

.onHoverLink {
    color: #626262;
}

.onHoverLink:hover {
    color: #6c94af;
}

@media (max-width: 767px) {
    #projectCompletion {
        border-left: 0px !important;
    }
}

@media (max-width: 767px) {
    .userDashboardName {
        font-size: 16px;
        color: #36648B !important
    }
}

.outsideDoughnutP {
    font-size: 15px;
}

.doughnutP {
    position: absolute;
    top: 30px;
    margin-left: -10px;
    width: 100%;
    height: 20px
}

.doughnutSpan1 {
    font-size: 24px;
}

.doughnutSpan2 {
    display: block;
    font-size: 10px
}

.outsideDoughnutDiv {
    padding-top: 45px;
}

@media (max-width: 1200px) {
    .outsideDoughnutP {
        font-size: 12px;
    }

    .outsideDoughnutDiv {
        padding-top: 35px;
    }

    .doughnutP {
        top: 17px;
    }

    .doughnutSpan1 {
        font-size: 16px;
    }

    .doughnutSpan2 {
        font-size: 8px
    }
}

@media (max-width: 991px) {

    .outsideDoughnutDiv {
        padding-top: 45px;
    }

    .outsideDoughnutP {
        font-size: 15px;
    }

    .doughnutP {
        top: 34px;
    }

    .doughnutSpan1 {
        font-size: 24px;
    }

    .doughnutSpan2 {
        font-size: 10px
    }
}


.form-control-bottom-only {
    /*border-left: 0px !important;*/
    /*border-top: 0px !important;*/
    /*border-right: 0px !important;*/
    /*border-radius: 0px !important;*/
}

.formLabel {
    font-size: 14px;
    padding: 0.5rem
}

.description-form-control {
    border: 1px solid #d1d3e2 !important;
}


.btn {
    border-radius: 2px;
}

.rounded-circle {
    border-radius: 50% !important;
}

.admin-dashboard-avatar {
    margin-top: -1px !important;
}

.noBorderRadius {
    border-radius: 0px !important;
}


.noBackgroundHoverChange:hover {
    backgroundColor: #fff !important;
}

#dropdown-basic {
    border-radius: 0px !important;
}

.searchBtn {
    border-radius: 0px !important;
    background-color: #fff;
    color: #36648B;
    border-bottom: 1px solid #d1d3e2;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
}

.closeSearchBtn {
    color: #fff;
    padding: 2px;
    border-radius: 50%;

}


.closeSearchBtn:hover {
    /*background-color: #eaecf4;*/
    background-color: rgba(234, 236, 244, 0.57);
    color: #fff !important;
}

.folder-mobile-action-btns {

    height: 2.5rem;
    width: 2.5rem;
    background-color: rgba(234, 236, 244, 0.57);
}

.folder-mobile-action-btns:hover {
    background-color: #36648B;
}

.folder-mobile-action-btns-nav {

    height: 2.5rem;
    width: 2.5rem;
    background-color: rgba(120, 171, 70, 0.27);
}

.folder-mobile-action-btns-nav:hover {
    background-color: rgba(120, 171, 70, 0.52);
}

.rce-mbox-text {
    font-size: 13px !important;
}

.rce-mbox-time {
    font-size: 10px !important;
}

.fileAddedCommentBody {
    padding-right: 10px;
    max-width: 400px !important;
    background-color: #4e779b !important;
    color: #fff
}

.fileAddedCommentBody:hover {
    background-color: #36648B !important;
}

.borderBottom {
    border-bottom: 1px solid rgb(227, 230, 240) !important;
}

.borderRight {
    border-right: 1px solid rgb(227, 230, 240) !important;
}

.borderTop {
    border-top: 1px solid rgb(227, 230, 240) !important;
}

.borderLeft {
    border-left: 1px solid rgb(227, 230, 240) !important;
}


.settingsTile {
    cursor: pointer;
    margin-top: -5px;
    width: 33.33%;
    height: 33.33%;
    text-align: center;
    overflow: hidden;
    display: inline-block;

    color: rgb(175, 178, 188);
}

.settingsTile:hover {
    background-color: rgba(218, 222, 234, 0.12);
    color: #36648B;
}

.settingsTileContent {
    margin: 0px;
    padding-right: 5px;
    padding-left: 5px;
    padding-top: 30px
}

.settingTileContentLink:hover {
    color: #36648B !important;
}

@media (max-width: 767px) {
    .settingsTileContent {
        padding-top: 45px;
        font-size: 16px !important;
    }
}

@media (max-width: 450px) {
    .settingsTileContent {
        padding-top: 45px;
        font-size: 10px !important;
    }
}

.settingsTileContentSmall {
    margin: 0px
}

.settingsTileContentSmall {
    margin: 0px
}


.data-source-row-body--bottom {
    color: rgb(147, 150, 158) !important;
}

.data-source-row-body--bottom-title {
    color: rgb(147, 150, 158) !important;
}

.nav-link.active {
    color: #36648B !important;
    border-bottom: 2px solid #36648B;
}

/*#commentContainer::-webkit-scrollbar {*/
/*    width: 8px !important;*/
/*    height: 5px !important;*/
/*    background-color: #d5d5d5 !important;*/
/*}*/
/*#commentContainer::-webkit-scrollbar-thumb {*/
/*    !*background: #36648B !important;*!*/
/*  }*/

#messagesContainer::-webkit-scrollbar {
    width: 7px !important;
    height: 10px !important;
    background-color: #d5d5d5 !important;
}

#messagesContainer::-webkit-scrollbar-thumb {
    background: #36648B !important;
}

.clientMiniMessenger {
    background-color: #36648B;
    color: #fff;
}

.clientMiniMessenger:hover {
    background-color: #4e779b;
    color: #fff;
}

.taskHeader {
    background-color: #36648B;
    color: #fff;
}

.taskHeader:hover {
    background-color: #4e779b;
    color: #fff;
}

.closeMiniMessenger {
    color: #fff;
}

.closeMiniMessenger:hover {
    color: #F5A800
}

.closeTaskController {
    color: #fff !important;
}

.closeTaskController:hover {
    color: #F5A800 !important;
}

commentContainer::-webkit-scrollbar {
    width: 16px !important;
    border: 5px solid white !important;

}

commentContainer::-webkit-scrollbar-thumb {
    background-color: #b0b0b0 !important;
    background-clip: padding-box !important;
    border: 0.05em solid #eeeeee !important;
}

commentContainer::-webkit-scrollbar-track {
    background-color: #bbbbbb !important;
}

/* Buttons */
commentContainer::-webkit-scrollbar-button:single-button {
    background-color: #bbbbbb !important;
    display: block !important;
    border-style: solid !important;
    height: 13px !important;
    width: 16px !important;
}

/* Up */
commentContainer::-webkit-scrollbar-button:single-button:vertical:decrement {
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #555555 transparent !important;
}

commentContainer::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
    border-color: transparent transparent #777777 transparent !important;
}

/* Down */
commentContainer::-webkit-scrollbar-button:single-button:vertical:increment {
    border-width: 8px 8px 0 8px;
    border-color: #555555 transparent transparent transparent !important;
}

commentContainer::-webkit-scrollbar-button:vertical:single-button:increment:hover {
    border-color: #777777 transparent transparent transparent !important;
}

.taskInfoMessageStandard {
    background-color: #36648B !important;
}

.taskInfoMessageInProgress {
    background-color: #F5A800 !important;
}

.noBorder {
    border-bottom: 0px solid #fff !important;
    border-top: 0px solid #fff !important;
    border-left: 0px solid #fff !important;
    border-right: 0px solid #fff !important;
}

#toolbar-container {
    display: none !important;
    background-color: #222 !important;
}


.nav-link.active.white-text {
    color: #fff !important;
}

.ReactModal__Overlay {
    z-index: 99999999 !important;
}

#accordionSidebar {
    padding-right: 0px !important;
}

.react-datepicker-wrapper {
    width: 100%
}

.width100 {
    width: 100% !important;
}

.rdw-list-dropdown {
    z-index: 0 !important;
}

.modal-xl .modal-content {

    margin: 20px !important;
    width: 100vw !important;
    height: calc(100vh - 40px) !important;
}

.modal-xl {
    max-width: 100% !important;
    margin: 0px !important;
}


.btn-small {
    font-size: 12px;
}

.btn-cancel {
    border-color: #881910;
    color: #881910;
    background-color: #fff;
}

.btn-cancel:hover {
    color: #fff;
    border-color: #881910;
    background-color: #881910;
}

.btn-input-cancel {

    color: #fff;
    border-color: #881910;
    background-color: #881910;
}

.btn-input-cancel:hover {
    color: #fff;
    border-color: rgba(136, 25, 16, 0.77);
    background-color: rgba(136, 25, 16, 0.77);
}


.btn-delete-image {
    border-color: #881910;
    color: #fff;
    background-color: #881910;
}

.btn-delete-image:hover {
    color: #fff;
    border-color: #a1352c;
    background-color: #a1352c;
}

.btn-alt {
    color: #36648B;
    border-color: #36648B;
    background-color: #fff;
}


.btn-alt:hover {
    color: #fff;
    border-color: #45749c;
    background-color: #45749c;
}

.btn-complete {
    color: #fff !important;
    border-color: #78AB46 !important;
    background-color: #78AB46 !important;
}


.btn-complete:hover {
    color: #fff !important;
    border-color: #9eb488 !important;
    background-color: #9eb488 !important;
}


.modalSubHeader {
    padding: 1rem;
}

.modalSubBody {
    flex: 1;
}

.modal-xl .modal-header {
    min-width: 1100px !important;
}

.createReportIndicator {

    letter-spacing: 0.5px;
    font-size: 14px;
    cursor: pointer;
    position: relative;
    display: inline-block
}

.createReportIndicator:hover {
    opacity: 1 !important;
}


.lightGreyBackground {
    background-color: #ececec !important;
}

.templateContainer {
    /*margin-top: 20px;*/
    padding: 1.8rem;
}

.deletedMessageContainer {
    color: #36648B;
    margin-top: -75px;
    border: 0px solid #fff;
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    padding: 1.8em;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
}

.pdfDownloadingContainer {
    color: #36648B;
    margin: auto;
    border: 0px solid #fff;
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    padding: 1.8em;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
}

.middleText {
    margin: auto;
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}

.templateCard {

    overflow: hidden;
    position: relative;
    display: flex;
    /*width: auto !important;*/
    /*min-width: 280px;*/
    height: 280px !important;
    text-align: center;
    align-items: center;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 6px 0px;
    padding: 0.2em;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
    border-color: rgb(255, 255, 255);
}

.adminDashboardTemplateCard {

    overflow: hidden;
    position: relative;
    display: flex;
    /*width: auto !important;*/
    min-width: 255px;
    max-width: 255px;
    height: 165px !important;
    text-align: center;
    align-items: center;
    padding: 0.2em;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 3px;
    border-style: solid;
    border-color: #f6f6f6;
}

.adminDashboardTemplateCard:hover {
    box-shadow: rgb(54, 100, 139) 0px 0px 6px 0px;
}

.adminDashboardAccountTileCard {

    overflow: hidden;
    position: relative;
    display: flex;
    /*width: auto !important;*/
    height: 155px !important;
    text-align: center;
    align-items: center;
    padding: 0.2em;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 3px;
    border-style: solid;
    border-color: #f6f6f6;
}

.adminDashboardAccountTileCard:hover {
    box-shadow: rgb(54, 100, 139) 0px 0px 6px 0px;
}


.tidyModalLeftBody {
    padding: 2rem;
    background-color: rgb(240, 243, 244);
}

.lightBlueBackground {
    background-color: rgb(240, 243, 244)
}

.tidyModalFormContainer {
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 6px 0px;
    padding: 1.8em;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
    border-color: rgb(255, 255, 255);
}


.templateCard:hover {
    box-shadow: rgb(54, 100, 139) 0px 0px 6px 0px;
}


.backgroundImageSelectorContainer {
    margin-top: 40px;
}

.backgroundImageSelector {
    border: 0px solid #fff !important;
    overflow: hidden;
    position: relative;
    display: flex;
    width: auto !important;
    height: 240px !important;
    text-align: center;
    align-items: center;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 6px 0px;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}


.dataSourceAnimationContainer {
    position: relative;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}

.dashboardPreferences {
    display: flex;
    flex-direction: column;
    padding-bottom: 2.5em;
    height: 100%;
    align-self: center;
    justify-self: center;
    margin: auto;
}


.modalForm {
    display: flex;
    flex-direction: column;
    max-width: 60em;
    padding-top: 30px;
    padding-bottom: 2.5em;
    height: 100%;
    width: 40em;
    align-self: center;
    justify-self: center;
    margin: auto;
    font-size: 14px;
}

.dataSourceSelection {
    border-left: 4px solid #e3e6f0
}

.dataSourceSelection:hover {
    border-left: 4px solid #36648B
}


.report-date-selector {
    font-family: "Inter" !important;
    background: rgb(239, 242, 247);
    position: relative;
    z-index: 2;
    height: 50px;
    width: 620px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 10px;
}

.rdrCalendarWrapper {
    z-index: 2;
}

.rdrDateRangeWrapper {
    z-index: 2;
}

.rdrDefinedRangesWrapper {
    z-index: 2;
}

.report-grid {
    height: 100%;
    width: 100%;
}

.reportControlPanel {
    font-family: "Inter" !important;
    opacity: 1;
    z-index: 2;
    width: 120px;
    overflow: visible;
    position: fixed;
    top: 7rem;
    padding-top: 5px;
    padding-bottom: 70px;
    background-color: #36648B;
    text-align: center;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.reportControlPanel:hover {
    opacity: 1;
}

.reportControlPanelMinimiseBtn {

    position: absolute;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    bottom: 10px;
    right: -28px;
    width: 30px;
    cursor: pointer;
    background-color: #36648B;
}

.viewAsClientBtn {
    z-index: 2;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 9.5rem;
    left: 78px;
    background-color: #36648B;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}


.viewAsClientBtn:hover {
    border-radius: 50%;
    opacity: 1;
}


.undoChangeBtn {
    z-index: 2;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 9.5rem;
    left: 20px;
    background-color: #626262;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}


.undoChangeBtn:hover {
    border-radius: 50%;
    opacity: 1;
}

.undoChangeBtn:active {
    background-color: #626262;
    border: 1px solid #626262;
}


.redoChangeBtn {
    z-index: 2;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 9.5rem;
    left: 78px;
    background-color: #626262;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.redoChangeBtn:hover {
    border-radius: 50%;
    opacity: 1;
}

.redoChangeBtn:active {
    background-color: #626262;
    border: 1px solid #626262;
}


.zoomInValue {
    position: fixed;
    top: 10.2rem;
    font-size: 12px;
    color: #626262;
    right: 105px;
}

.zoom-report-btn {
    background-color: #fff;
    color: rgb(120, 136, 150);
    cursor: pointer;
}

.dark-grey-hover {
    cursor: pointer
}

.dark-grey-hover:hover {
    background-color: rgb(120, 136, 150);
    color: #fff;
}

.zoomInBtn {

    z-index: 4;
    width: 35px;
    height: 35px;
    position: fixed;
    top: 9.5rem;
    right: 25px;
    background-color: #36648B;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.zoomInBtn:hover {
    border-radius: 50%;
    opacity: 1;
}

.zoomOutBtn {

    z-index: 4;
    width: 35px;
    height: 35px;
    position: fixed;
    top: 9.5rem;
    right: 65px;
    background-color: #36648B;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.zoomOutBtn:hover {
    border-radius: 50%;
    opacity: 1;
}

.saveReport {

    z-index: 5;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 5.5rem;
    right: 20px;
    background-color: #78AB46;
    border-radius: 4px;
    /*opacity: 0.4;*/
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.saveReport:hover {
    opacity: 1;
    background-color: #9cc96f;
}

.mildHoverSaveBtnBackground:hover {
    /*background-color: #eaecf4;*/
    background-color: #87b15e !important;
    /*background-color: rgba(235, 235, 235, 0.16) !important;*/
}

.mildHoverSaveBtnBackground {
    opacity: 1;
    /*background-color: #6c94af !important;*/
    /*background-color: rgba(235, 235, 235, 0.16) !important;*/
}

.noNameReportBtn {
    z-index: 10;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 5.5rem;
    right: 135px;
    background-color: #881910;
    border-radius: 50%;
    opacity: 1;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: not-allowed;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}


.reportToolBtn {

    position: fixed;
    top: 5.5rem;
    left: 20px;
}

.reportToolBtn:hover {
    border-radius: 50%;
    opacity: 1;
}


.tileNameSpan {
    font-size: 8px;
    position: absolute;
    left: 5px;
    bottom: 5px;
    opacity: 0.8;
}


.textToolBar {
    border-left: 3px dashed rgb(227, 230, 240) !important;
    border-top: 3px dashed rgb(227, 230, 240) !important;
    border-bottom: 3px dashed rgb(227, 230, 240) !important;
    position: absolute;
    width: 118px;
    left: -130px;
    top: -4px;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.textToolBar-active {
    /*border-left: 3px dashed #36648B !important;*/
    /*border-top: 3px dashed #36648B !important;*/
    /*border-bottom: 3px dashed #36648B !important;*/
    position: absolute;
    width: 118px;
    left: -130px;
    top: -4px;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.commentsToolBar-active {
    /*border-left: 3px dashed #36648B !important;*/
    /*border-top: 3px dashed #36648B !important;*/
    /*border-bottom: 3px dashed #36648B !important;*/
    position: absolute;
    width: 118px;
    left: 0px;
    top: -4px;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.editorWrapper {
    width: 100%;
    height: 100%;
}

.editorTextArea {
    width: 100%;
    height: 100%;
}

.commentsEditorWrapper {
    width: 100%;
    height: 100%;
    min-height: 600px;
}

.commentsEditorTextArea {
    padding: 5px;
    margin-left: 130px;
    width: calc(100% - 130px);
    min-height: 600px;
    height: 100%;
}

.commentsEditorInFocus {
    margin-left: 0px !important;
    width: 100% !important;
}

.editorWrapperAddTask {
    width: 100%;
    height: 100%;
    /*overflow-y:auto;*/
    min-height: 350px;
    max-height: 350px;
    border: 1px solid rgb(227, 230, 240) !important;
}

.editorTextAreaAddTask {
    max-height: 280px;
    overflow-y: auto;
    padding: 10px;
}

.editorInFocus {
    position: relative;
    z-index: 99;
    background-color: inherit;
}

.DraftEditor-root {
    margin-top: -15px;
}

.public-DraftEditorPlaceholder-root {

    margin-left: 25% !important;
    width: 50% !important;
    text-align: center;
    font-size: 12px !important;
    top: 35% !important;
}

.rdw-editor-main {
    height: 99% !important;
}

.react-confirm-alert-button-custom > button {
    outline: none;
    display: inline-block;
    padding: 6px 18px;
    border-radius: 5px;
    font-size: 12px;
    cursor: pointer;
    width: 120px;
}

.rdw-color-picker {
    z-index: 3;
    opacity: 1;
    width: 100% !important;
    overflow: visible;
    display: flex;
    align-items: center;
    margin-bottom: 6px;
    position: relative;
    flex-wrap: wrap;
}

.rdw-option-wrapper {
    width: 100% !important;
}

.rdw-inline-dropdown {
    width: 100% !important;
}

.rdw-emoji-wrapper {
    width: 100% !important;
}

.rdw-dropdown-wrapper .rdw-fontsize-dropdown {
    width: 100% !important;
}

.rdw-fontsize-dropdown {
    min-width: 40px;
    width: 100%;
}

.rdw-fontsize-wrapper {
    width: 100%;
}

.rdw-list-dropdown {
    width: 100% !important;
    margin-bottom: 6px !important;
}

.rdw-link-wrapper {
    width: 100% !important;
    margin-bottom: 6px !important;
}

.rdw-history-wrapper {
    width: 100%;
}

.coact-blue-color {
    color: #36648B !important;
    opacity: 1 !important;
}

.headerTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 26px;
    text-align: center;
}

.editableNumberTitleTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 14px;
    text-align: center;
}

.fileTileText::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 14px;
    text-align: center;
}


.linkTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 26px;
    text-align: center;
}

.linkTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 26px;
    text-align: center;
}

.public-DraftStyleDefault-block {
    margin: 0.75em 0 !important;
}

.gantt-container {
    overflow-y: hidden !important;
    overflow-x: scroll !important;
}

.gantt .bar-progress {
    fill: rgba(54, 100, 139, 0.47) !important;
}

.gantt .bar-label.big {

    font-weight: 600;
    text-anchor: start;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {

    opacity: 1;

}


.changeImageHoverBtn {
    cursor: pointer;
}

.changeImageHoverBtn:hover {
    -webkit-box-shadow: 0 0 0 1px #36648B, 0 4px 6px #36648B;
    box-shadow: 0 0 0 1px #36648B, 0 4px 6px #36648B;

}


/*!* Chrome, Safari, Edge, Opera *!*/
/*.noNumberArrows::-webkit-outer-spin-button,*/
/*input::-webkit-inner-spin-button {*/
/*    -webkit-appearance: none;*/
/*    margin: 0;*/
/*}*/

/*!* Firefox *!*/
/*.noNumberArrows {*/
/*    -moz-appearance: textfield;*/
/*}*/


.middleAlign {
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    padding: 1rem;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}

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


.topRight {
    position: absolute;
    right: 10px;
    top: 10px
}

.noBorderBottom {
    border-bottom: 0px solid #fff !important;
}


#openfalseColorPicker {
    display: inline-block;
}

#openColorPicker {
    display: inline-block;
}


.colorPalettePicker {
    z-index: 3 !important;
    position: absolute !important;
}

#colorPalettePickerTd .colorPalettePicker {
    right: 0px !important;
}

.expandRow {
    height: 40px;
    background-color: #f6f6f6;
    width: 100%;
    position: relative;
}

.expandRowWithDescription {
    background-color: #f6f6f6;
    width: 100%;
    position: relative;
}

.expandRowWithDescription h5 {
    font-size: 14px;
}

.expandChevron {
    position: absolute;
    right: 10px;
    height: 50%;
    top: 25%;
    bottom: 25%;
}

.expandedTopChevron {
    position: absolute;
    top: 10px;
    right: 10px;
}

.expandedRowWithDescriptionChevron {
    position: absolute;
    top: 16px;
    right: 10px;
}

.expandContent {
    padding-right: 20px;
    cursor: pointer;
    font-size: 12px;
    padding: 10px;
    padding-right: 20px;
    padding-left: 15px;
    position: relative;
    z-index: 2;
    border: 1px solid #ececec;
    /*box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);*/
    /*-webkit-box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);*/
}

.expandContent:hover {
    border: 1px solid #6c94af !important;
}

.configurationTdLabel {
    cursor: default;
    width: 50%;
    color: #a1a3ac;
}

.configurationTdLabel p {
    color: #a1a3ac;
}

.configurationTdChanger {
    cursor: default;
    vertical-align: middle;
}

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

.sidebar-logo img {
    height: 40px;
    width: auto;
}

#side-btns-affix {
    overflow: hidden;
}

@media (min-width: 768px) {
    .side-btns-affix {
        display: block;
        width: 13%;
        position: fixed;
        left: 8.5rem;
        top: 25%;
        height: 100px;
        text-align: center;
        padding: 0;
    }

    .dropzoneSideBtn {
        height: 100%;
    }
}

@media (max-width: 767px) {
    .side-btns-affix {
        display: none;
    }
}

.errorMessage {
    font-size: 14px;
    width: 100%;
    textAlign: center;
    color: #881910;
    margin: 0px;
    margin-right: 10px

}

.welcomeMessage {
    color: #36648B;

}

.svg-icon {
    width: 25px;
    height: auto;
}

.dataTables-svg-icon {
    text-align: center;
    width: 35px;
    height: auto;
}

.dataTables-svg-icon-large {
    text-align: center;
    width: 35px;
    height: auto;
}

.itemViewerLargeThumb img {
    text-align: center;
    width: 140px;
    height: auto;
    filter: drop-shadow(0 0 2px #d7d5d5);
}

.itemViewerLargeThumb span {
    font-size: 20px;
}

.itemViewerCompanyFolder {
    margin-bottom: 1.5rem !important;
}


.itemViewerSmallThumb img {
    text-align: center;
    width: 80px;
    height: auto;
    filter: drop-shadow(0 0 2px #d7d5d5);
}

.svg-box-shadow {
    filter: drop-shadow(0 0 5px #d7d5d5);
}


.itemViewerLargeThumb span {
    font-size: 15px;
}

#dataTable tr {
    cursor: pointer;
    text-align: center !important;
}

#dataTable tbody > tr:hover {
    color: #36648B;
    text-decoration: underline;
}


.dataTablesFolderActive {
    background-color: rgba(99, 183, 255, 0.16) !important;
}

.dataTablesFolderHover {
    background-color: rgba(99, 183, 255, 0.3) !important;
}

@keyframes dataTablesDropComplete {
    from {
        background-color: rgba(66, 255, 144, 0.3)
    }
    to {
        background-color: #fff;
    }
}

.dataTablesDropComplete {
    animation-name: dataTablesDropComplete;
    animation-duration: 2s;
}

.text-gateway-blue {
    color: #36648B !important;
}

.bg-gateway-blue {
    background-color: #36648B !important;
}

.bg-gateway-blue-secondary {
    background-color: #4e779b !important;
}

.reverseBtn {
    position: absolute;
    /* top: 2px; */
    z-index: 10;
    left: 20px;
}

.ajaxOverlay {
    position: absolute;
    background-color: #fff;
    /*top:0;*/
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1000;
}

.spinner-border {
    margin-top: auto;
    margin-bottom: auto;
}

.dz-preview {
    display: none !important;
}

#progress-bar-container {
    display: none;
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #fff;
    z-index: 10000;
}

#progress-bar-container-thumbnail {
    display: none;
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: #fff;
    z-index: 10000;
}

.progress {
    text-align: center;
    margin-left: 10px;
    margin-right: 10px;
    height: 2rem;
}

.progress-text {
    position: absolute;
    text-align: center;
    font-size: 20px;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    color: #fff;

}

.progress-bar {
    height: 100% !important;
}

.vAlign {
    position: relative !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
}

.vAlign25 {
    position: relative !important;
    top: 25% !important;
    transform: translateY(-25%) !important;
}

.bar {
    position: absolute;
    height: 10px;
    width: 25%;
    max-height: 100%;
    max-width: 100%;
    position: fixed;
    top: 50%;
    left: 37.5%;
    border-radius: 25px;
    background-color: rgba(87, 161, 224, 0.28);
}

@media (max-width: 767px) {

    .bar {
        left: 15%;
        width: 70%;
    }
}

.in {
    animation: fill 1.5s linear 1;
    height: 100%;
    background-color: #36648B;
    border-radius: 25px;
}


@keyframes fill {
    0% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}

.rdt_TableHeader {
}

.gVZomo {
    overflow: hidden !important;
    min-height: 300px;
!important;
}

.cpRjbT {
    max-height: 60vh !important;
}

.itemDrag {
    flex-grow: 1;
    margin: 10px;
}

.item-container {
    display: flex;
    flex-direction: column;
}

.tileContainer {
    min-height: 75vh;
}

.item-list {
    display: flex;
}


.rce-container-input {
    height: 100% !important;
}

.rce-input rce-input-textarea {
    height: 100% !important;
}

.data-source-row-avatar img {
    background-color: transparent !important;
    width: 10px;
}

.data-source-row-avatar {
    display: inline-block;
}

.taskInfoMessage {
    max-width: 400px !important;
}

/* Style the container with a rounded border, grey background and some padding and margin */
.messengerRightTopContainer {


    border-radius: 5px;
    padding: 8px;
    margin: 8px 0;
}

/* Clear floats after containers */
.messengerRightTopContainer::after {
    content: "";
    clear: both;
    display: table;
}

/* Float images inside the container to the left. Add a right margin, and style the image as a circle */
.messengerRightTopContainer img {
    float: left;
    margin-right: 20px;
    border-radius: 50%;
}

/* Increase the font-size of a span element */
.messengerRightTopContainer span {
    font-size: 14px;
    margin-right: 15px;
}

/* Add media queries for responsiveness. This will center both the text and the image inside the container */
@media (max-width: 500px) {
    .messengerRightTopContainer {
        text-align: center;
    }

    .messengerRightTopContainer img {
        margin: auto;
        float: none;
        display: block;
    }
}


.centerDiv {
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 2rem;
}

.boxShadowFull {
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.boxShadowFullCoactBlue {
    -webkit-box-shadow: 0 0 10px rgba(54, 100, 139, 0.52);
    box-shadow: 0 0 10px rgba(54, 100, 139, 0.52);
}

.rdrDateRangePickerWrapper {
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
    border: 1px solid #36648B !important;

}

.boxShadowFullDeep {
    -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .2);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .1), 0 4px 6px rgba(0, 0, 0, .2);
}

.boxShadowBottom {
    box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);
    -webkit-box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);
}

.boxShadowBottomLight {
    box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.15);
    -webkit-box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.11);
}


.boxShadowBottomHeavy {
    box-shadow: 0 7px 7px 0px rgba(215, 213, 213, 0.93);
    -webkit-box-shadow: 0 7px 7px 0px rgba(215, 213, 213, 0.93);

}

.boxShadowTop {
    box-shadow: 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
    -webkit-box-shadow: 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
}

.boxShadowTopHeavy {
    box-shadow: 0 -5px 5px -5px rgb(171, 169, 169);
    -webkit-box-shadow: 0 -5px 5px -5px rgb(171, 169, 169);
}

.boxShadowTopInset {
    box-shadow: inset 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
    -webkit-box-shadow: inset 0 -5px 5px -5px rgba(215, 213, 213, 0.44);
}

.boxShadowLeft {
    box-shadow: -1px 0px 1px 1px rgba(215, 213, 213, 0.44);
}

/*.boxShadowTop{*/
/*    -webkit-box-shadow: 0 4px 2px -2px #d7d5d5;*/
/*    box-shadow: 0 4px 2px -2px #d7d5d5;*/
/*}*/


/*
 *  STYLE 4
 */

#customScrollBar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3) !important;
}

#customScrollBar::-webkit-scrollbar {
    width: 5px !important;
    height: 10px !important;
    background-color: #F5F5F5 !important;
}

#customScrollBar::-webkit-scrollbar-thumb {
    background-color: rgba(160, 160, 160, 0.55) !important;
}

.customScrollBar::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(194, 194, 194, 0.3) !important;
}

.customScrollBar::-webkit-scrollbar {
    width: 5px !important;
    height: 10px !important;
    background-color: #F5F5F5 !important;
}

.customScrollBar::-webkit-scrollbar-thumb {
    background-color: rgba(160, 160, 160, 0.55) !important;
}

.messenger-user-items {
    border: none;
    background-color: transparent;
    color: #6c94af;
    font-size: 125%;
    cursor: pointer;
}

.messenger-user-items:hover {
    color: #36648B
}

.data-source-rows-container {
    background-color: #f6f6f6;
    border-bottom: 1px solid rgba(0, 0, 0, .05) !important;
    border-top: 1px solid transparent;
}

.data-source-row-body {
    margin-left: 15px;
    display: inline-block;
    border-bottom: 0px solid #fff !important;
}

.rce-container-input {
    background-color: rgba(245, 245, 245, 0.34) !important;
}

.data-source-row-body--bottom-status span {
    background-color: #36648B !important;
    padding: 2px !important;
}

.messengerUserSearch {
    flex: 1 1;
    height: 40px;
    padding: 0 5px;
    border: none;
    border-radius: 5px;
    color: #333;
    font-size: 14px;
    box-sizing: border-box;
    outline: none;
}

.videoCallActionBtn {
    display: inline-block;
    border-radius: 40%;
    box-shadow: 0px 0px 2px #888;
    width: 50px;
    height: 50px;
    /*padding-top: 15px;*/
    cursor: pointer;
    padding: 0.5em 0.6em;
    margin-top: 12px;
    margin-left: 8px;
    margin-right: 8px;
    font-size: 20px;
    color: #fff;
    background-color: #36648B;


    /*background-color: #36648B;*/
    /*color: #fff;*/
    /*display: inline;*/
    /*width: 100px;*/
    /*height: 100px;*/
    /*border-radius: 50%;*/
    /*text-align: center;*/
    /*line-height: 70px;*/
    /*vertical-align: middle;*/
    /*padding: 10px;*/
    /*margin-left:8px;*/
    /*margin-right: 8px;*/
    /*font-size: 28px;*/
    /*cursor:pointer;*/
}

.react-confirm-alert-body {
    text-align: center !important;
}

.react-confirm-alert-button-group {

    justify-content: center !important;
}

.react-confirm-alert-button-group > button {

    background-color: #36648B !important;
}

.notifications-bl {
    padding-left: 0px !important;
}

.notifications-br {
    padding-right: 0px !important;
}

.notification-success {
    background-color: #36648B !important;
    border-top: 1px solid #0c4d8b !important;
    color: #fff !important;
    border-top-right-radius: 10px !important;
    border-bottom-right-radius: 10px !important;
    -webkit-box-shadow: 0 0 10px #888 !important;
    box-shadow: 0 0 10px #888 !important;

}

.notification-success > h4 {
    color: #fff !important;
}


.notification-dismiss {
    background-color: #fff !important;
    color: #36648B !important;
}


.dot {
    height: 25px;
    width: 25px;
    border-radius: 50%;
    display: inline-block;
}

.green {
    color: #78AB46 !important;
}

.red {
    color: #881910 !important;
}

.backgroundRed {
    background-color: #881910 !important;

}

.yellow {
    color: #E5E500 !important;
}

.img-profile-folder {
    position: absolute !important;
    left: 20% !important;
    width: 60px !important;
    height: auto;

}

@media (max-width: 769px) {

    .img-profile-folder {
        left: 30% !important;

    }
}

#sharedFolderController-tab-tools.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff !important;
}

#sharedFolderController-tab-chat.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff !important;
}

#sharedFolderController-tab-users.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff !important;
}

#sharedFolderController-tab-settings.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: #fff;
}

#projectViewSelector-tab-list.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#projectViewSelector-tab-calendar.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#projectViewSelector-tab-board.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}


#projectViewSelector-tab-info.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#projectViewSelector-tab-settings.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #fff !important;
}

#taskListController-tab-users.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}

#taskListController-tab-milestones.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff;
}

#taskListController-tab-info.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}

#taskListController-tab-activity.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    /*border-bottom: 1px solid #36648B;*/
    color: #fff !important;
}

#taskListController-tab-settings.active {
    background-color: #36648B;
    /*border-top: 1px solid #36648B;*/
    /*border-left: 1px solid #36648B;*/
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}

#taskListController-tab-files.active {
    background-color: #36648B;
    border-top: 1px solid #36648B;
    border-left: 1px solid #36648B;
    border-right: 1px solid #36648B;
    border-bottom: 1px solid #36648B;
    color: #fff !important;
}


#search-tab-users.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}


#search-tab-files.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}


#search-tab-projects.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}


#search-tab-tasks.active {
    background-color: #4e779b;
    border-top: 1px solid #4e779b;
    border-left: 1px solid #4e779b;
    border-right: 1px solid #4e779b;
    border-bottom: 1px solid #4e779b;
    border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    color: #fff !important;
}

.activeTab {
    /*background-color: #36648B;*/
    /*border-top: 1px solid #36648B;*/
    /*border-left: 1px solid #36648B;*/
    /*border-right: 1px solid #36648B;*/
    /*border-bottom: 1px solid #36648B;*/
    /*border-top-left-radius: 5px;*/
    /*border-top-right-radius: 5px;*/
    color: #36648B !important;
}

/*.activeTab {*/
/*    background-color: #36648B;*/
/*    border-top: 1px solid #36648B;*/
/*    border-left: 1px solid #36648B;*/
/*    border-right: 1px solid #36648B;*/
/*    border-bottom: 1px solid #36648B;*/
/*    border-top-left-radius: 5px;*/
/*    border-top-right-radius: 5px;*/
/*    color: #fff !important;*/
/*}*/

.activeTab:hover {
    color: #36648B !important;
}

.activeCollapseItem {
    color: #36648B !important;
    background-color: #fff !important;
}

#react-confirm-alert {
    z-index: 99999999;
}

.cursor {
    cursor: pointer !important;
}

.taskDropdownBtn {
    background-color: transparent !important;
    border: none !important;
    color: inherit !important;
    border-bottom: 1px solid #e3e6f0 !important;
    border-radius: 0px !important;
    /*padding: 2px 10px 2px 10px !important;*/
}

.taskDropdownBtn:hover {
    color: #6c94af !important;
}

.dashboardFilterBtn {
    padding-top: 3px;
    background-color: transparent !important;
    border: none !important;
    color: #626262 !important;
    /*padding: 2px 10px 2px 10px !important;*/
}

.dashboardFilterBtn:hover {
    /*font-weight: 600;*/
    /*background-color: #36648B !important;*/
}

.addTaskBtn {
    background-color: rgba(234, 236, 244, 0.57) !important;
    border-radius: 10px !important;
    min-width: 40px !important;
    border: 1px solid rgba(234, 236, 244, 0.74) !important;

}

.addTaskBtn:hover {
    background-color: #36648B !important;
    border-radius: 10px !important;
    min-width: 40px !important;
    border: 1px solid #e3e6f0 !important;

}

.itemSelectedButton {
    background-color: transparent !important;
    color: inherit !important;
    border: 1px solid #e3e6f0 !important;
    border-radius: 2px !important;

    padding: 2px 10px 2px 10px !important;
}

.itemSelectedButton:hover {
    background-color: #36648B !important;
    color: #fff !important;
    fill: #fff !important;
    border: 1px solid #fff !important;
    border-radius: 2px !important;
    /*padding: 2px 10px 2px 10px !important;*/
}

.task-Completed {
    color: #fff;
    background-color: #78AB46;
    border-color: #78AB46
}

.task-In-Progress {
    color: #fff;
    background-color: #F5A800;
    border-color: #F5A800
}

.AssignedBtn {
    color: #fff;
    background-color: #96ab94 !important;
    border-color: #687967 !important;
}

.AssignedBtn:hover {
    color: #fff;
    background-color: #78AB46 !important;
    border-color: #78AB46 !important;
}

.inProgressBtn {
    color: #fff;
    background-color: rgba(113, 77, 0, 0.48) !important;
    border-color: rgba(113, 77, 0, 0.48) !important;
}

.inProgressBtn:hover {
    color: #fff;
    background-color: #F5A800 !important;
    border-color: #F5A800 !important;
}

.inProgressBtnLight {
    color: #fff;
    background-color: rgba(212, 153, 27, 0.48) !important;
    border-color: rgba(113, 77, 0, 0.48) !important;
}

.inProgressBtnLight:hover {
    color: #fff;
    background-color: #F5A800 !important;
    border-color: #F5A800 !important;
}

.task-Accepted {
    color: #fff;
    background-color: #36648B;
    border-color: #36648B;
}

.task-Declined {
    color: #fff;
    background-color: #881910;
    border-color: #881910;
}

.task-Overdue {
    color: #fff;
    background-color: #881910;
    border-color: #881910;
}

.task-Proposed-new-time {
    color: #fff;
    background-color: #36648B;
    border-color: #36648B;
}

.task-Assigned {
    color: #fff;
    background-color: #36648B;
    border-color: #36648B;
}

.task-Unassigned {
    color: #fff;
    background-color: #222;
    border-color: #222;
}

.rbc-current-time-indicator {
    display: none
}

.rbc-event {
    padding: 0px !important;
    border-radius: 5px !important;
}

.rbc-overlay {
    min-width: 320px !important;
}

.rbc-addons-dnd .rbc-addons-dnd-resize-ew-anchor {
    top: 9px !important;
}

.react-contextmenu--visible {
    background-color: #1f3a50;
    color: #fff;
    padding: 15px;
    border-radius: 10px;
    cursor: pointer;
}

.date-picker {
    font-weight: 400;
    border: 0px;
    display: inline-block;
    color: inherit;
    text-align: left;
}

.input-error {
    color: #881910 !important;
    text-decoration: line-through;
    font-weight: 600;
}

input.cursor.date-picker.input-error {
    text-align: center !important;
}

.rce-mbox {

    background-color: #fff !important;
    max-width: 414px !important;
    padding-top: 10px;
    /*background-color: #f9f9f9 !important;*/
}

.rce-mbox-file {
    overflow: hidden
}

.rce-mbox-file-added-container {
    padding-bottom: 15px !important;
    cursor: pointer !important;
}

.rce-mbox-left-notch {
    fill: #fff !important;
    /*fill: #f9f9f9 !important;*/
}

.rce-mbox.rce-mbox-right {
    background-color: #e6effe !important;
}

.rce-mbox-right-notch {
    fill: #e6effe !important;
}

.status-pill {
    cursor: default !important;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 10rem;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
}

.tag-pill {
    display: inline-block;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    border-radius: 10rem;
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    margin-left: 10px;
    line-height: 1.5;
}

.filterDropdownContainer {
    max-height: 65vh !important;
    overflow-y: auto;
}


.filterDropdownItem {
    cursor: pointer;
    display: block;
    width: 100%;
    padding: 0.4rem 0.1rem;
    clear: both;
    font-weight: 400;
    text-align: inherit;
    white-space: nowrap;
    background-color: transparent;
    border: 0;
}

.filterSearch {
    background-color: rgba(245, 245, 245, 0.34);
    height: 40px;
    border-radius: 0px;
    width: 100%;
    border: 0px;
    padding: 0 5px;
    color: #333;
    font-size: 14px;
}

.filter-active {
    background-color: #36648B !important;
    color: #fff !important;

}

.white {
    color: #fff !important;
}

.rbc-month-row {
    cursor: pointer;
}

.jdZEYg {
    background-color: rgb(245, 245, 245) !important;
}

.hide-backblaze {
    height: 0px !important;
    border: 0px !important;
}

.itemSortDropdown {
    left: -100px !important;
}


.masterFolder {
    margin-left: 25px
}

.indentFolder {
    margin-left: 50px
}

.css-bdjl4r {
    color: rgba(0, 0, 0, 0.1) !important
}

.emoji-mart-bar {
    display: none;
}

@media (max-width: 576px) {
    .xs-hide {
        display: none;
    }
}

@media (max-width: 767px) {
    .md-hide {
        display: none;
    }
}

@media (min-width: 576px) {
    .desktop-hide {
        display: none;
    }
}

@media (max-width: 992px) {
    .sm-desktop-hide {
        display: none
    }
}

@media (max-width: 767px) {
    .mobile-hide {
        display: none !important;
    }
}

@media (min-width: 768px) {
    .messengerOverlay {
        top: 4.375rem;
        left: 0rem;
    }
}

@media (max-width: 767px) {
    .messengerOverlay {
        left: 0rem;
        top: 4.375rem;
    }

}


.data-source-container {
    overflow-x: hidden !important;
    width: 100%;
}


.data-source-item {
    background-color: #f6f6f6;
    border-bottom: 1px solid rgba(0, 0, 0, .05) !important;
    border-top: 1px solid transparent;
    position: relative;
    overflow: hidden;
}

.data-source-item-chevron {
    position: absolute;
    top: 10px;
    right: 5px;
    opacity: 0.5;
}

.data-source-item-body {
    padding: 10px;
    min-height: 55px;
    color: #222;
}

.data-source-item-body-content {
    margin-left: 15px;
    display: inline-block;
    border-bottom: 0px solid #fff !important;
}

.data-source-item-body-content--bottom {
    color: rgb(147, 150, 158) !important;
    font-size: 12px;
}

.data-source-item-avatar img {
    background-color: transparent !important;
    width: 10px;
    height: auto;
    margin-bottom: 2px;
    margin-top: -20px;
    width: auto;
    max-width: 18px
}

.data-source-item-avatar {
    display: inline-block;
}

.data-source-item-content {
    margin-left: 15px;
    display: inline-block;
    border-bottom: 0px solid #fff !important;
}

.data-source-item-content-top {
    margin-left: 15px;
    display: inline-block;
    border-bottom: 0px solid #fff !important;
    fontSize: 12px;
    color: #222;
    font-weight: 500;
    margin-top: 5px;
    margin-bottom: 0px;
}

.data-source-selection {
    background-color: #fff;
    padding: 10px;
    min-height: 40px;
    border-left: 4px solid #e3e6f0
}

.data-source-selection h5 {
    padding-top: 2px;
    padding-left: 10px;
    font-size: 12px;
    margin: 0px;
    margin-top: 0px;
}

.data-source-selection:hover {
    border-left: 4px solid #36648B
}

.data-source-selection-remove {
    background-color: #fff;
    padding: 10px;
    min-height: 40px;
    border-left: 4px solid #e3e6f0
}

.data-source-selection-remove:hover {
    border-left: 4px solid #881910
}

.data-source-selection-plus {
    position: absolute;
    top: 35%;
    right: 10px;
}

.data-source-row {
    min-width: 0px !important;
}

.data-source-container {
    overflow-x: hidden !important;
    width: 100%;
}

@media (max-width: 767px) {
    .data-source-row-body--top-title {
        font-size: 100% !important;
    }

    .data-source-row-body--bottom-title {
        font-size: 80% !important;
    }
}

@media (max-width: 767px) {
    .rightContainerTopContent h2 {
        font-size: 18px !important;
        padding-top: 10px;
    }
}

@media (max-width: 564px) {
    .rightContainerTopContent h2 {
        font-size: 14px !important;
        padding-top: 0px;
    }

    #chatUserImageCircle {
        height: 30px !important;
    }

    .messenger-user-items {
        padding: 0px !important;
    }
}

.data-source-row {
    min-width: 0px !important;
}

.ReactTags__selected {
    margin: 10px;

}

.tag-wrapper {
    cursor: pointer !important;
    overflow-wrap: break-word;
    background-color: #f1f1f1;
    color: #36648B;
    padding: 5px;
    margin: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 0 2px #d7d5d5;
    box-shadow: 0 0 2px #d7d5d5;
    border: 1px solid #d1d3e2;
}

.ReactTags__tagInput {
    margin-top: 15px;
}

.ReactTags__tagInputField {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6e707e;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #d1d3e2;
    border-radius: 0.35rem;
    -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
}

.milestone-date-picker {
    margin-top: 14px;
    background-color: transparent;
    /*float:right*/
}

.suggestionsClass {
}

.suggestionsClass li {
    display: inline-block;
    list-style-type: none;
    cursor: pointer !important;
    overflow-wrap: break-word;
    background-color: #f1f1f1;
    color: #36648B;
    padding: 5px;
    margin: 8px;

    border-radius: 4px;
    -webkit-box-shadow: 0 0 2px #d7d5d5;
    box-shadow: 0 0 2px #d7d5d5;
    border: 1px solid #d1d3e2;
}

.activeSuggestionClass li {
    border: 1px solid #36648B !important;
}

.activeSuggestionClass {
    background-color: #36648B !important;
    color: #fff !important;
}

.rbc-toolbar-label {
    text-align: left !important;
    font-weight: 600;
    color: #36648B;
    /*text-align:left !important;*/
}

.react-datepicker__input-container {
    /*width:50%;*/
}

.react-confirm-alert-overlay {
    z-index: 10030 !important;
}

.border-none {
    border: 0px !important;
}

@media (max-width: 767px) {
    .md-border-none {
        border: 0px !important;

    }

}

.fullScreenRemoteVideo {
    z-index: 99999999;
    height: 100%;
    width: 100%;
    left: 0px;
    top: 0px;
    position: fixed;
    background-color: #22222269;
}

.remoteVideo {
    height: 100%;
    z-index: 500000;
}

.fullScreenLocalVideo {

    width: 200px;
    height: 150px;
    box-shadow: 0px 0px 10px #626262;
    position: fixed;
    left: 0px;
    top: 0px;
    z-index: 99999999999;

}

.localVideo {
    width: 200px;
    height: 150px;
    box-shadow: 0px 0px 10px #626262;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 500001;
}

.fullScreenVideoController {

    z-index: 99999999;
    position: fixed;
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -5px;
    right: 25%;
    left: 50%;
    margin-left: -150px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;

}

.hideVideoController {
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    z-index: 500002;
    position: absolute;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -76px;
    right: 25%;
    left: 50%;
    margin-left: -180px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;
}


.hideFullScreenVideoController {

    z-index: 99999999;
    position: fixed;
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -76px;
    right: 25%;
    left: 50%;
    margin-left: -150px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;

}

.videoController {
    display: flex;
    paddingLeft: 15px;
    paddingRight: 15px;
    z-index: 500002;
    position: absolute;
    width: 360px;
    height: 75px;
    color: #36648B;
    background-color: #fff;
    border: 2px solid #36648B;
    bottom: -5px;
    right: 25%;
    left: 50%;
    margin-left: -180px;
    border-top-left-radius: 25px;
    -webkit-border-top-right-radius: 25px;
}

.fullScreenLocalVideoOverlay {

    width: 200px;
    height: 150px;
    box-shadow: 0px 0px 10px #626262;
    position: fixed;
    left: 0px;
    top: 0px;
    color: #fff;
    background-color: #36648B;
    z-index: 299999999999;
    cursor: pointer;

}

.localVideoOverlay {
    cursor: pointer;
    width: 200px;
    height: 150px;
    color: #fff;
    box-shadow: 0px 0px 10px #626262;
    position: absolute;
    left: 0px;
    top: 0px;
    background-color: #36648B;
    z-index: 500002;

}

.fullScreenVideoHeader {
    position: absolute;
    margin-left: -150px;
    width: 300px;
    left: 50%;
    top: 2%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #fff;
    z-index: 99999999;
}

.videoHeader {
    position: absolute;
    width: 300px;
    left: 50%;
    top: 5%;
    transform: translate(-50%, -50%);
    font-size: 20px;
    color: #fff;

}


.pointer {
    cursor: pointer !important;
}

.activeSidebarLink {
    color: #fff !important;
}

.gDriveFolderTile:hover {
    background-color: #36648B;
    color: #fff;
}


.gDriveItemTile:hover {
    -webkit-box-shadow: 0 0 10px #36648B;
    box-shadow: 0 0 10px #36648B;
}

.gDriveItemSelected {
    -webkit-box-shadow: 0 0 10px #78AB46;
    box-shadow: 0 0 10px #78AB46;
}

@media (max-width: 991px) {
    .lg-md-hide {
        display: none;
    }
}

@media (max-width: 1200px) {
    .lg-hide {
        display: none;
    }
}

.showAddFileBtn {
    background-color: #6c94af
}

.showAddFileBtn:hover {
    background-color: #36648B
}

.google-drive-return:hover {
    text-decoration: none !important;
}

.google-drive-return-btn {
    background-color: #6c94af;
}

.google-drive-return-btn:hover {
    background-color: #36648B;
}

.dropHover {
    border: 2px dashed rgba(0, 0, 0, 0.125);
}

.dropHover:hover {
    border: 2px dashed #36648B;
}

.dropHoverComplete {
    border: 2px dashed #78AB46;
}

.picker-dialog {
    z-index: 10004 !important;
}

.picker-dialog-bg {
    z-index: 10003 !important;
}

.no-rce-hover:hover {
    background-color: #fff !important;

}

.activeTaskController {

    background-color: rgb(240, 244, 252) !important;
    border: 1px solid #36648B !important;
}


.unreadComment {
    background-color: #fff;
    animation-name: color;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

.unreadCommentTaskController {
    background-color: rgb(249, 249, 249);
    animation-name: color;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

@keyframes color {
    0% {
        background-color: #fff;
    }
    50% {
        background-color: #e5efff;
    }
    100% {
        background-color: #fff;
    }
}

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

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

.Aligner {

    display: flex;
    align-items: center;
    justify-content: center;
}

.Aligner-item {
    max-width: 50%;
}

.Aligner-item--top {
    align-self: flex-start;
}

.Aligner-item--bottom {
    align-self: flex-end;
}

@media (max-width: 992px) {
    .medium-scroll {
        overflow-y: scroll !important;

    }
}

@media (min-width: 993px) {
    .medium-scroll {
        overflow-y: hidden !important;

    }
}

.project-select:hover {
    background-color: rgba(229, 239, 255, 0.5);
}

.project-select-alt:hover {
    background-color: #f9f9f9;
}

.commentTabContentParent .tab-content {
    overflow-x: hidden !important;
}

.onHoverLink {
    color: #626262;
}

.onHoverLink:hover {
    color: #6c94af;
}

@media (max-width: 767px) {
    #projectCompletion {
        border-left: 0px !important;
    }
}

@media (max-width: 767px) {
    .userDashboardName {
        font-size: 16px;
        color: #36648B !important
    }
}

.outsideDoughnutP {
    font-size: 15px;
}

.doughnutP {
    position: absolute;
    top: 30px;
    margin-left: -10px;
    width: 100%;
    height: 20px
}

.doughnutSpan1 {
    font-size: 24px;
}

.doughnutSpan2 {
    display: block;
    font-size: 10px
}

.outsideDoughnutDiv {
    padding-top: 45px;
}

@media (max-width: 1200px) {
    .outsideDoughnutP {
        font-size: 12px;
    }

    .outsideDoughnutDiv {
        padding-top: 35px;
    }

    .doughnutP {
        top: 17px;
    }

    .doughnutSpan1 {
        font-size: 16px;
    }

    .doughnutSpan2 {
        font-size: 8px
    }
}

@media (max-width: 991px) {

    .outsideDoughnutDiv {
        padding-top: 45px;
    }

    .outsideDoughnutP {
        font-size: 15px;
    }

    .doughnutP {
        top: 34px;
    }

    .doughnutSpan1 {
        font-size: 24px;
    }

    .doughnutSpan2 {
        font-size: 10px
    }
}


/*.form-control {*/
/*    border-radius: 5px !important;*/
/*}*/

.form-control-bottom-only {
    /*border-left: 0px !important;*/
    /*border-top: 0px !important;*/
    /*border-right: 0px !important;*/
    /*border-radius: 0px !important;*/
}

.formLabel {
    font-size: 14px;
    padding: 0.5rem
}

.description-form-control {
    border: 1px solid #d1d3e2 !important;
}

.loginBtn {

    background-color: #417bfb;
}

.btn {
    border-radius: 2px;
}

.rounded-circle {
    border-radius: 50% !important;
}

.noBorderRadius {
    border-radius: 0px !important;
}


.noBackgroundHoverChange:hover {
    backgroundColor: #fff !important;
}

#dropdown-basic {
    border-radius: 0px !important;
}

.searchBtn {
    border-radius: 0px !important;
    background-color: #fff;
    color: #36648B;
    border-bottom: 1px solid #d1d3e2;
    border-top: 0px;
    border-left: 0px;
    border-right: 0px;
}

.closeSearchBtn {
    color: #fff;
    padding: 2px;
    border-radius: 50%;

}


.closeSearchBtn:hover {
    /*background-color: #eaecf4;*/
    background-color: rgba(234, 236, 244, 0.57);
    color: #fff !important;
}

.folder-mobile-action-btns {

    height: 2.5rem;
    width: 2.5rem;
    background-color: rgba(234, 236, 244, 0.57);
}

.folder-mobile-action-btns:hover {
    background-color: #36648B;
}

.folder-mobile-action-btns-nav {

    height: 2.5rem;
    width: 2.5rem;
    background-color: rgba(120, 171, 70, 0.27);
}

.folder-mobile-action-btns-nav:hover {
    background-color: rgba(120, 171, 70, 0.52);
}

.rce-mbox-text {
    font-size: 13px !important;
}

.rce-mbox-time {
    font-size: 10px !important;
}

.fileAddedCommentBody {
    padding-right: 10px;
    max-width: 400px !important;
    background-color: #4e779b !important;
    color: #fff
}

.fileAddedCommentBody:hover {
    background-color: #36648B !important;
}

.borderBottom {
    border-bottom: 1px solid rgb(227, 230, 240) !important;
}

.borderRight {
    border-right: 1px solid rgb(227, 230, 240) !important;
}

.borderTop {
    border-top: 1px solid rgb(227, 230, 240) !important;
}

.borderLeft {
    border-left: 1px solid rgb(227, 230, 240) !important;
}


.settingsTile {
    cursor: pointer;
    margin-top: -5px;
    width: 33.33%;
    height: 33.33%;
    text-align: center;
    overflow: hidden;
    display: inline-block;

    color: rgb(175, 178, 188);
}

.settingsTile:hover {
    background-color: rgba(218, 222, 234, 0.12);
    color: #36648B;
}

.settingsTileContent {
    margin: 0px;
    padding-right: 5px;
    padding-left: 5px;
    padding-top: 30px
}

.settingTileContentLink:hover {
    color: #36648B !important;
}

@media (max-width: 767px) {
    .settingsTileContent {
        padding-top: 45px;
        font-size: 16px !important;
    }
}

@media (max-width: 450px) {
    .settingsTileContent {
        padding-top: 45px;
        font-size: 10px !important;
    }
}

.settingsTileContentSmall {
    margin: 0px
}

.settingsTileContentSmall {
    margin: 0px
}


.data-source-row-body--bottom {
    color: rgb(147, 150, 158) !important;
}

.data-source-row-body--bottom-title {
    color: rgb(147, 150, 158) !important;
}

.nav-link.active {
    color: #36648B !important;
    border-bottom: 2px solid #36648B;
}

/*#commentContainer::-webkit-scrollbar {*/
/*    width: 8px !important;*/
/*    height: 5px !important;*/
/*    background-color: #d5d5d5 !important;*/
/*}*/
/*#commentContainer::-webkit-scrollbar-thumb {*/
/*    !*background: #36648B !important;*!*/
/*  }*/

#messagesContainer::-webkit-scrollbar {
    width: 7px !important;
    height: 10px !important;
    background-color: #d5d5d5 !important;
}

#messagesContainer::-webkit-scrollbar-thumb {
    background: #36648B !important;
}

.clientMiniMessenger {
    background-color: #36648B;
    color: #fff;
}

.clientMiniMessenger:hover {
    background-color: #4e779b;
    color: #fff;
}

.taskHeader {
    background-color: #36648B;
    color: #fff;
}

.taskHeader:hover {
    background-color: #4e779b;
    color: #fff;
}

.closeMiniMessenger {
    color: #fff;
}

.closeMiniMessenger:hover {
    color: #F5A800
}

.closeTaskController {
    color: #fff !important;
}

.closeTaskController:hover {
    color: #F5A800 !important;
}

commentContainer::-webkit-scrollbar {
    width: 16px !important;
    border: 5px solid white !important;

}

commentContainer::-webkit-scrollbar-thumb {
    background-color: #b0b0b0 !important;
    background-clip: padding-box !important;
    border: 0.05em solid #eeeeee !important;
}

commentContainer::-webkit-scrollbar-track {
    background-color: #bbbbbb !important;
}

/* Buttons */
commentContainer::-webkit-scrollbar-button:single-button {
    background-color: #bbbbbb !important;
    display: block !important;
    border-style: solid !important;
    height: 13px !important;
    width: 16px !important;
}

/* Up */
commentContainer::-webkit-scrollbar-button:single-button:vertical:decrement {
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #555555 transparent !important;
}

commentContainer::-webkit-scrollbar-button:single-button:vertical:decrement:hover {
    border-color: transparent transparent #777777 transparent !important;
}

/* Down */
commentContainer::-webkit-scrollbar-button:single-button:vertical:increment {
    border-width: 8px 8px 0 8px;
    border-color: #555555 transparent transparent transparent !important;
}

commentContainer::-webkit-scrollbar-button:vertical:single-button:increment:hover {
    border-color: #777777 transparent transparent transparent !important;
}

.taskInfoMessageStandard {
    background-color: #36648B !important;
}

.taskInfoMessageInProgress {
    background-color: #F5A800 !important;
}

.noBorder {
    border-bottom: 0px solid #fff !important;
    border-top: 0px solid #fff !important;
    border-left: 0px solid #fff !important;
    border-right: 0px solid #fff !important;
}

#toolbar-container {
    display: none !important;
    background-color: #222 !important;
}


.nav-link.active.white-text {
    color: #fff !important;
}

.ReactModal__Overlay {
    z-index: 99999999 !important;
}

#accordionSidebar {
    padding-right: 0px !important;
}

.react-datepicker-wrapper {
    width: 100%
}

.rdw-list-dropdown {
    z-index: 0 !important;
}

.modal-xl .modal-content {

    margin: 20px !important;
    width: 100vw !important;
    height: calc(100vh - 40px) !important;
}

.modal-xl {
    max-width: 100% !important;
    margin: 0px !important;
}


.btn-small {
    font-size: 12px;
}

.btn-cancel {
    border-color: #881910;
    color: #881910;
    background-color: #fff;
}

.btn-cancel:hover {
    color: #fff;
    border-color: #881910;
    background-color: #881910;
}

.btn-alt {
    color: #36648B;
    border-color: #36648B;
    background-color: #fff;
}


.btn-alt:hover {
    color: #fff;
    border-color: #45749c;
    background-color: #45749c;
}

.btn-complete {
    color: #fff !important;
    border-color: #78AB46 !important;
    background-color: #78AB46 !important;
}


.btn-complete:hover {
    color: #fff !important;
    border-color: #9eb488 !important;
    background-color: #9eb488 !important;
}

.btn-complete-alt {
    color: #78AB46 !important;
    border-color: #78AB46 !important;
    background-color: #fff !important;
}


.btn-complete-alt:hover {
    color: #fff !important;
    border-color: #9eb488 !important;
    background-color: #9eb488 !important;
}

.modal-header {
    background-color: #fff;
    color: #222
}

.modalSubHeader {
    padding: 1rem;
}

.modalSubBody {
    flex: 1;
}

.modal-xl .modal-header {
    min-width: 1100px !important;
}

.createReportIndicator {

    letter-spacing: 0.5px;
    font-size: 14px;
    cursor: pointer;
    position: relative;
    display: inline-block
}

.createReportIndicator:hover {
    opacity: 1 !important;
}


.mini-search {
    height: 40px;
    padding: 0 25px;
    padding-left: 50px;
    border: 1px solid rgb(221, 226, 228);
    /*border: 0px solid rgb(221, 226, 228);*/
    border-radius: 20px;
    background-color: rgb(240, 243, 244);
    color: #333;
    font-size: 12px;
    box-sizing: border-box;
    outline: none;
}

.lightGreyBackground {
    background-color: #ececec !important;
}

.templateContainer {
    /*margin-top: 20px;*/
    padding: 1.8rem;
}

.adminDashboardTemplateContainer {
    /*margin-top: 20px;*/
    padding: 10px;
}

.adminDashboardAccountTileContainer {
    /*margin-top: 20px;*/
    padding: 10px;
}

.deletedMessageContainer {
    color: #36648B;
    margin-top: -75px;
    border: 0px solid #fff;
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    padding: 1.8em;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
}

.pdfDownloadingContainer {
    color: #36648B;
    margin: auto;
    border: 0px solid #fff;
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    padding: 1.8em;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
}

.middleText {
    margin: auto;
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}


.tidyModalLeftBody {
    padding: 2rem;
    background-color: rgb(240, 243, 244);
}

.lightBlueBackground {
    background-color: rgb(240, 243, 244)
}

.tidyModalFormContainer {
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    border-bottom: 1px solid #dee2e6 !important;
    box-shadow: rgba(0, 0, 0, 0) 0px 0px 6px 0px;
    padding: 1.8em;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    border-radius: 5px;
    border-width: 2px;
    border-style: solid;
    border-color: rgb(255, 255, 255);
}

.tidyModalAccountSettings {
    height: calc(100% - 60px) !important;
}


.backgroundImageSelectorContainer {
    margin-top: 40px;
}

.backgroundImageSelector {
    border: 0px solid #fff !important;
    overflow: hidden;
    position: relative;
    display: flex;
    width: auto !important;
    height: 240px !important;
    text-align: center;
    align-items: center;
    box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 6px 0px;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}


.dataSourceAnimationContainer {
    position: relative;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}

.dashboardPreferences {
    display: flex;
    flex-direction: column;
    padding-bottom: 2.5em;
    height: 100%;
    align-self: center;
    justify-self: center;
    margin: auto;
}


.modalForm {
    display: flex;
    flex-direction: column;
    max-width: 60em;
    padding-top: 30px;
    padding-bottom: 2.5em;
    height: 100%;
    width: 40em;
    align-self: center;
    justify-self: center;
    margin: auto;
    font-size: 14px;
}

.dataSourceSelection {
    min-height: 40px;
    border-left: 4px solid #e3e6f0;
    position: relative !important;
}

.dataSourceSelection:hover {
    border-left: 4px solid #36648B
}

.report-behind {
    /*min-height: 111vh !important;*/
    padding-bottom: 275px;
    min-width: 100%;
    height: 100% !important;
}

#screenshotReportContentContainer {
    margin-top: -5px !important;
}

.report-date-selector {
    font-family: "Inter" !important;
    background: rgb(239, 242, 247);
    position: relative;
    z-index: 2;
    height: 38px;
    width: 620px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 10px;
}

.rdrCalendarWrapper {
    z-index: 2;
}

.rdrDateRangeWrapper {
    z-index: 2;
}

.rdrDefinedRangesWrapper {
    z-index: 2;
}

.report {
    border-radius: 2px;
    min-height: 648px;
    width: 1100px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 10px;
    margin-bottom: 30px;
}

.report-grid {
    height: 100%;
    width: 100%;
}

.reportControlPanel {
    font-family: "Inter" !important;
    opacity: 1;
    z-index: 2;
    width: 120px;
    overflow: visible;
    position: fixed;
    top: 7rem;
    padding-top: 5px;
    padding-bottom: 70px;
    background-color: #36648B;
    text-align: center;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.reportControlPanel:hover {
    opacity: 1;
}

.reportControlPanelMinimiseBtn {

    position: absolute;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    bottom: 10px;
    right: -28px;
    width: 30px;
    cursor: pointer;
    background-color: #36648B;
}

.shared-report-title {

    left: 15px;
    max-width: 350px;
    min-width: 350px;
    z-index: 9999;
    color: #222;
    height: 50px;
    position: fixed;
    background-color: rgb(246, 246, 246);
    border-radius: 10px;
    border: 1px solid #f6f6f6;
    /*opacity: 0.4;*/
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.left-report-action-btn {

    z-index: 2;
    color: #222;
    width: 50px;
    height: 50px;
    position: fixed;
    background-color: rgb(246, 246, 246);
    border-radius: 2px;
    border: 1px solid #222;
    /*opacity: 0.4;*/
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
}

.left-report-action-btn:hover {
    color: #fff;
    background-color: #6c94af;
    border: 1px solid #6c94af;
    opacity: 1;
}

.left-report-action-btn:active {
    color: #fff;
    background-color: #2b5679;
    border: 1px solid #36648B;
}


.download-shared-report {
    top: 5.5rem;
    right: 20px;
}

.share-shared-report {
    top: 10.5rem;
    right: 20px;
}

.shared-filters-btn {
    top: 15.5rem;
    right: 20px;
}

.addStaticTileBtn {
    background-color: #222;
    top: 5.5rem;
    left: 20px;
}

.add-kpi-btn {
    background-color: #222;
    top: 5.5rem;
    left: 20px;
}


.add-kpi-btn:hover {
    color: #fff;
    background-color: #6c94af;
    border: 1px solid #6c94af;
    opacity: 1;
}

.undoChangeBtn {
    z-index: 2;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 9.5rem;
    left: 20px;
    background-color: #626262;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}


.undoChangeBtn:hover {
    border-radius: 50%;
    opacity: 1;
}

.undoChangeBtn:active {
    background-color: #626262;
    border: 1px solid #626262;
}


.redoChangeBtn {
    z-index: 2;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 9.5rem;
    left: 78px;
    background-color: #626262;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.redoChangeBtn:hover {
    border-radius: 50%;
    opacity: 1;
}

.redoChangeBtn:active {
    background-color: #626262;
    border: 1px solid #626262;
}


.reportControllerBtn {
    position: fixed;
    top: 9.5rem;
    left: 20px;
}

.report-styling-btn {
    position: fixed;
    top: 13.5rem;
    left: 20px;
}

.report-filters-btn {
    position: fixed;
    top: 17.5rem;
    left: 20px;
}

.report-filters-btn-active {
    background-color: #36648B;
    color: #fff;
    position: fixed;
    top: 17.5rem;
    left: 20px;
}

.report-access-management-btn {
    position: fixed;
    top: 17.5rem;
    left: 20px;
}

.report-data-source-management-btn {
    position: fixed;
    top: 21.5rem;
    left: 20px;
}


.shareReportBtn {

    z-index: 4;
    width: 50px;
    height: 50px;
    position: fixed;


    right: 130px;
    top: 5.5rem;
    background-color: #36648B;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.shareReportBtn:hover {
    border-radius: 50%;
    opacity: 1;
}


.noNameReportBtn {
    z-index: 10;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 5.5rem;
    right: 135px;
    background-color: #881910;
    border-radius: 50%;
    opacity: 1;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: not-allowed;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}


.reportToolBtn {

    z-index: 2;
    width: 50px;
    height: 50px;
    position: fixed;
    top: 5.5rem;
    right: 20px;
    background-color: #36648B;
    border-radius: 50%;
    opacity: 0.4;
    display: flex;
    text-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.reportToolBtn:hover {
    border-radius: 50%;
    opacity: 1;
}

.addPresetTileBtn {
    position: fixed;
    top: 9.5rem;
    left: 20px;
}


.tileNameSpan {
    font-size: 8px;
    position: absolute;
    left: 5px;
    bottom: 5px;
    opacity: 0.8;
}


.textToolBar {
    border-left: 3px dashed rgb(227, 230, 240) !important;
    border-top: 3px dashed rgb(227, 230, 240) !important;
    border-bottom: 3px dashed rgb(227, 230, 240) !important;
    position: absolute;
    width: 118px;
    left: -130px;
    top: -4px;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}


.editorWrapper {
    width: 100%;
    height: 100%;
}

.editorTextArea {
    padding: 10px;
}

.editorWrapperAddTask {
    width: 100%;
    height: 100%;
    /*overflow-y:auto;*/
    min-height: 350px;
    max-height: 350px;
    border: 1px solid rgb(227, 230, 240) !important;
}

.editorTextAreaAddTask {
    max-height: 280px;
    overflow-y: auto;
    padding: 10px;
}


.DraftEditor-root {
    margin-top: -15px;
}

.public-DraftEditorPlaceholder-root {

    margin-left: 25% !important;
    width: 50% !important;
    text-align: center;
    font-size: 12px !important;
    top: 35% !important;
}

.rdw-editor-main {
    height: 99% !important;
}

.react-confirm-alert-button-custom > button {
    outline: none;
    display: inline-block;
    padding: 6px 18px;
    border-radius: 5px;
    font-size: 12px;
    cursor: pointer;
    width: 120px;
}

.rdw-color-picker {
    z-index: 3;
    opacity: 1;
    width: 100% !important;
    overflow: visible;
    display: flex;
    align-items: center;
    margin-bottom: 6px;
    position: relative;
    flex-wrap: wrap;
}

.rdw-option-wrapper {
    width: 100% !important;
}

.rdw-inline-dropdown {
    width: 100% !important;
}

.rdw-emoji-wrapper {
    width: 100% !important;
}

.rdw-dropdown-wrapper .rdw-fontsize-dropdown {
    width: 100% !important;
}

.rdw-fontsize-dropdown {
    min-width: 40px;
    width: 100%;
}

.rdw-fontsize-wrapper {
    width: 100%;
}

.rdw-list-dropdown {
    width: 100% !important;
    margin-bottom: 6px !important;
}

.rdw-link-wrapper {
    width: 100% !important;
    margin-bottom: 6px !important;
}

.rdw-history-wrapper {
    width: 100%;
}

.coact-blue-color {
    color: #36648B !important;
    opacity: 1 !important;
}

.headerTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 26px;
    text-align: center;
}

.editableNumberTitleTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 14px;
    text-align: center;
}

.fileTileText::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 14px;
    text-align: center;
}

.editableNumberTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 18px;
    text-align: center;
}

.editableNumberTile input[type="text"]:disabled {
    opacity: 1 !important;
    color: inherit !important;
}

.linkTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 26px;
    text-align: center;
}

.linkTileInput::-webkit-input-placeholder {
    opacity: 0.75;
    color: #9197a3;
    font-size: 26px;
    text-align: center;
}

.public-DraftStyleDefault-block {
    margin: 0.75em 0 !important;
}

.gantt-container {
    overflow-y: hidden !important;
    overflow-x: scroll !important;
}

.gantt .bar-progress {
    fill: rgba(54, 100, 139, 0.47) !important;
}

.gantt .bar-label.big {

    font-weight: 600;
    text-anchor: start;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {

    opacity: 1;

}


.changeImageHoverBtn {
    cursor: pointer;
}

.changeImageHoverBtn:hover {
    -webkit-box-shadow: 0 0 0 1px #36648B, 0 4px 6px #36648B;
    box-shadow: 0 0 0 1px #36648B, 0 4px 6px #36648B;

}


/*!* Chrome, Safari, Edge, Opera *!*/
/*.noNumberArrows::-webkit-outer-spin-button,*/
/*input::-webkit-inner-spin-button {*/
/*    -webkit-appearance: none;*/
/*    margin: 0;*/
/*}*/

/*!* Firefox *!*/
/*.noNumberArrows {*/
/*    -moz-appearance: textfield;*/
/*}*/


.middleAlign {
    position: relative;
    display: flex;
    width: auto !important;
    height: 100% !important;
    text-align: center;
    align-items: center;
    padding: 1rem;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    flex-direction: column;
    align-items: center;
}

.uploadAnImageModalDropzone {
    /*height: calc(100% - 70px) !important;*/
}

.uploadAnImageModalDropzoneImageSelected {
    height: calc(100% - 245px) !important;
}

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


.topRight {
    position: absolute;
    right: 10px;
    top: 10px
}

.noBorderBottom {
    border-bottom: 0px solid #fff !important;
}


#openfalseColorPicker {
    display: inline-block;
}

#openColorPicker {
    display: inline-block;
}

#opentrueColorPicker {
    background-color: #fff;
    z-index: 10;
    position: absolute;
}

#openCPCColorPicker {
    background-color: #fff;
    z-index: 10;
    position: absolute;
}

#openSessionsColorPicker {
    background-color: #fff;
    z-index: 10;
    position: absolute;
}

.colorPalettePicker {
    z-index: 2;
    position: absolute !important;
}

#colorPalettePickerTd .colorPalettePicker {
    right: 0px !important;
}

.expandRowContainer {
    overflow-x: visible;
    height: 100%;
    background-color: rgba(246, 246, 246, 0.47);
    display: block;
    width: 100%;
    position: relative;
    zIndex: 1;
    paddingtp: 1px;
    padding-bottom: 40px;
    overflow-y: auto;
}

.expandRow {
    height: 40px;
    background-color: #f6f6f6;
    width: 100%;
    position: relative;
}

.expandRowWithDescription {
    background-color: #f6f6f6;
    width: 100%;
    position: relative;
}

.expandRowWithDescription h5 {
    font-size: 14px;
}

.expandChevron {
    position: absolute;
    right: 10px;
    height: 50%;
    top: 25%;
    bottom: 25%;
}

.expandedTopChevron {
    position: absolute;
    top: 10px;
    right: 10px;
}

.expandedRowWithDescriptionChevron {
    position: absolute;
    top: 14px;
    right: 10px;
}

.expandContent {
    padding-right: 20px;
    cursor: pointer;
    font-size: 12px;
    padding: 2px;
    padding-right: 20px;
    padding-left: 15px;
    position: relative;
    z-index: 2;
    border: 1px solid #ececec;
    /*box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);*/
    /*-webkit-box-shadow: 0 5px 5px 0px rgba(215, 213, 213, 0.44);*/
}

.expandContent:hover {
    border: 1px solid #6c94af !important;
}

.configurationTdLabel {
    cursor: default;
    width: 50%;
    color: #a1a3ac;
}

.configurationTdLabel p {
    color: #a1a3ac;
}

.configurationTdChanger {
    cursor: default;
    vertical-align: middle;
}

/*#google-visualization-errors-all-1 {*/
/*    display: none !important*/
/*}*/

/*#google-visualization-errors-all-2 {*/
/*    display: none !important*/
/*}*/

/*#google-visualization-errors-all-3 {*/
/*    display: none !important*/
/*}*/

/*#google-visualization-errors-all-4 {*/
/*    display: none !important*/
/*}*/

.react-datepicker-popper {
    z-index: 3 !important;
}

.textUnderline {
    text-decoration: underline;
}

.leftControllerBtn {
    margin-bottom: 20px;
    background-color: rgba(234, 236, 244, 0.57);
    text-align: left;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    height: 2.5rem;
    width: 100%;
}

.leftControllerBtn span {
    font-size: 12px;
    padding-left: 15px;
}

.leftControllerBtn:hover {
    background-color: #36648B;
    color: #fff;
}

.leftController {

    background-color: #f4ece8;
    width: 185px;
    margin-right: 10px;
    min-width: 185px;
    font-size: 12px;
    height: 100%;
    float: left;
    display: inline-block;
    padding-bottom: 1rem;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-right: 1px solid rgb(227, 230, 240);
}

.leftController ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    /*padding-left: 20px;*/
}

.leftController li {
    background-color: #f4ece8;
    color: #222;
    cursor: pointer;
    display: block;
    width: 100%;
}

.left-controller-internal-li {
    cursor: pointer;
    padding-left: 10px;
    display: block;
    width: 100%;
    padding-top: 15px;
    padding-bottom: 15px;
    font-size: 14px;
}

.left-controller-internal-li-content {
    width: 95%;
}

.adminDashboardNavTile {
    position: relative;
    display: flex;
    width: auto !important;
    text-align: center;
    align-items: center;
    padding: 0.24em 0.7em;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    /*flex-direction: column;*/
    align-items: center;
    border-radius: 0px;
    border-width: 2px;
    border-style: solid;
    border-color: rgb(255, 255, 255);
}


.boxShadowRight {
    box-shadow: 3px 0 3px -2px #d7d5d57d;
}

textarea:focus, input:focus {
    outline: none !important;
}

*:focus {
    outline: none !important;
}

.Chart {
    /*overflow: visible !important;*/
}


.react-confirm-alert-body {
    z-index: 999999999 !important;
}

.react-confirm-alert-overlay {

    z-index: 999999999 !important;
}

.minWidth800 {
    min-width: 800px !important;
}

.modal-lg {
    min-width: 800px !important;
}

#disabledDateRangePickerStartDate {

    cursor: pointer !important;
    pointer-events: none !important;
}

#disabledDateRangePickerEndDate {

    cursor: pointer !important;
    pointer-events: none !important;
}

/*#google-visualization-errors-all-1 {*/
/*    display: none !important*/
/*}*/

/*#google-visualization-errors-all-2 {*/
/*    display: none !important*/
/*}*/

/*#google-visualization-errors-all-3 {*/
/*    display: none !important*/
/*}*/

/*#google-visualization-errors-all-4 {*/
/*    display: none !important*/
/*}*/

.react-datepicker-popper {
    z-index: 3 !important;
}

.textUnderline {
    text-decoration: underline;
}


.adminDashboardNavTile {
    position: relative;
    display: flex;
    width: auto !important;
    text-align: center;
    align-items: center;
    padding: 0.24em 0.7em;
    background-color: rgb(255, 255, 255);
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    /*flex-direction: column;*/
    align-items: center;
    border-radius: 0px;
    border-width: 2px;
    border-style: solid;
    border-color: rgb(255, 255, 255);
}


.boxShadowRight {
    box-shadow: 3px 0 3px -2px #d7d5d57d;
}

textarea:focus, input:focus {
    outline: none !important;
}

*:focus {
    outline: none !important;
}

.Chart {
    /*overflow: visible !important;*/
}


.react-confirm-alert-body {
    z-index: 999999999 !important;
}

.react-confirm-alert-overlay {

    z-index: 999999999 !important;
}

.minWidth800 {
    min-width: 800px !important;
}

.modal-lg {
    min-width: 800px !important;
}

#disabledDateRangePickerStartDate {

    cursor: pointer !important;
    pointer-events: none !important;
}

#disabledDateRangePickerEndDate {

    cursor: pointer !important;
    pointer-events: none !important;
}


.rt-tbody {
    /*overflow: visible !important;*/
    overflow-y: scroll;
}

.stickyReactTable {
    position: sticky !important;
    left: 0;
    top: 0;
    z-index: 1;
    background-color: white;
}


.comparisonPeriodSelector {
    border: 0px solid #fff !important;
    position: absolute;
    bottom: -2px;
    cursor: pointer;
    height: 20px;
    width: 20px;
    font-size: 0;
    border: 0;
    background: transparent !important;
    -moz-appearance: none;
    webkit-appearance: none;
}

.comparisonPeriodSelector::-ms-expand {
    /*display: none;*/
}

.comparisonPeriodSelector:hover {
    /*background-color: #eaecf4;*/
    color: #6c94af !important;
    /*background-color: rgba(235, 235, 235, 0.16) !important;*/
}

.resetFilterBtn {
    cursor: pointer;
    background-color: #881910;
    color: #fff;
}

.resetFilterBtn:hover {
    background-color: #b65148;
    color: #fff;
}

.x-circle-cancel-btn {
    cursor: pointer;
    color: #fff;
}

.dateSelectorDropdownPrefix__control {
    z-index: 100 !important;
}

.applyFiltersRefreshDataBtn {
    background-color: #36648B;
    color: #fff;
}

.applyFiltersRefreshDataBtn:hover {
    background-color: #6c94af;
    color: #fff;
}

.blurDiv {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
    /*width: 100px;*/
    /*height: 100px;*/
    /*background-color: #ccc;*/
}

.blur-div-without-height-and-width {
    -webkit-filter: blur(5px);
    -moz-filter: blur(5px);
    -o-filter: blur(5px);
    -ms-filter: blur(5px);
    filter: blur(5px);
    /*background-color: #ccc;*/
}

.rt-tbody {
    position: relative;
}


.StripeElement {
    height: 40px;
    padding: 10px 12px;
    width: 100%;
    color: #32325d;
    background-color: white;
    border: 1px solid transparent;
    border-radius: 4px;

    box-shadow: 0 1px 3px 0 #e6ebf1;
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}

.StripeElement--focus {
    box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
    border-color: #fa755a;
}

.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}


.upgradeBtn {
    cursor: pointer;
    /*transition: 0.5s;*/
    text-align: center;
    border: 1px solid #36648B;
    background-color: #36648B;
    color: #fff;
    border-radius: 5px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 12px;


}


.paymentUpgradeBtn {
    cursor: pointer;
    /*transition: 0.5s;*/
    text-align: center;
    border: 1px solid #78AB46;
    background-color: #78AB46;
    color: #fff;
    border-radius: 5px;
    padding-left: 16px;
    padding-right: 16px;
    font-size: 12px;


}

.paymentUpgradeBtn:hover {
    color: #fff !important;
    border-color: #9eb488 !important;
    background-color: #9eb488 !important;
}

.upgradeBtn:hover {
    border: 1px solid #36648B;
    background-color: #fff;
    color: #36648B;
}

.rt-td {
    white-space: normal !important;
    align-self: center;
}

.pricingTierTab {
    padding: 10px;
    width: 135px;
    height: 100px;
    color: #626262;
    background-color: rgb(226 239 252);
    opacity: 0.65;
    border-radius: 5px;
    display: inline;
    margin-right: 10px;
    margin-top: 5px;
    cursor: pointer;
}

.pricingTierTab:hover {
    opacity: 1;
    color: #fff;
    background-color: #36648B;
}

.activePricingTierTab {
    cursor: pointer;
    padding: 10px;
    width: 135px;
    height: 100px;
    color: #fff;
    background-color: #36648B;
    border-radius: 5px;
    display: inline;
    margin-right: 10px;
    margin-top: -20px;
}

.activePricingTierTab:hover {
    opacity: 1;
    color: #fff;
    background-color: #5883a8;
}

.currentPricingTierTab {

    /*pointer-events: none !important;*/
    cursor: pointer;
    padding: 10px;
    width: 135px;
    height: 100px;
    color: #fff;
    background-color: #765C97;
    border-radius: 5px;
    display: inline;
    margin-right: 10px;
    margin-top: -20px;
}

.currentPricingTierTab:hover {
    /*opacity:1;*/
    /*color: #fff;*/
    /*background-color: #36648B;*/
}

.quill {
    height: 100%;
    width: 100%;
}

.ql-container {
    font-family: inherit !important;
    /*background-color: #fff;*/
}


#toolbar-container .ql-font span[data-label="Sans Serif"]::before {
    font-family: "Sans Serif";
}

#toolbar-container .ql-font span[data-label="Inconsolata"]::before {
    font-family: "Inconsolata";
}

#toolbar-container .ql-font span[data-label="Roboto"]::before {
    font-family: "Roboto";
}

#toolbar-container .ql-font span[data-label="Mirza"]::before {
    font-family: "Mirza";
}

#toolbar-container .ql-font span[data-label="Montserrat"]::before {
    font-family: "Montserrat";
}

#toolbar-container .ql-font span[data-label="Acta Display"]::before {
    font-family: "Acta Display";
}

#toolbar-container .ql-font span[data-label="Aktiv Grotesk"]::before {
    font-family: "Aktiv Grotesk";
}

#toolbar-container .ql-font span[data-label="Sanchez"]::before {
    font-family: "Sanchez";
}

#toolbar-container .ql-font span[data-label="Poppins"]::before {
    font-family: "Poppins";
}

#toolbar-container .ql-font span[data-label="Raleway"]::before {
    font-family: "Raleway";
}

#toolbar-container .ql-font span[data-label="Arial"]::before {
    font-family: "Arial";
}

#toolbar-container .ql-font span[data-label="Verdana"]::before {
    font-family: "Verdana";
}

#toolbar-container .ql-font span[data-label="Manrope"]::before {
    font-family: "Manrope";
}

#toolbar-container .ql-font span[data-label="Inter"]::before {
    font-family: "Inter";
}

#toolbar-container .ql-font span[data-label="Lato"]::before {
    font-family: "Lato";
}

#toolbar-container .ql-font span[data-label="Tahoma"]::before {
    font-family: "Tahoma";
}

#toolbar-container .ql-font span[data-label="Arial"]::before {
    font-family: "Arial";
}

#toolbar-container .ql-font span[data-label="Impact"]::before {
    font-family: "Impact";
}

#toolbar-container .ql-font span[data-label="Georgia"]::before {
    font-family: "Georgia";
}

#toolbar-container .ql-font span[data-label="Lucida Sans Unicode"]::before {
    font-family: "Lucida Sans Unicode";
}

#toolbar-container .ql-font span[data-label="Trebuchet MS"]::before {
    font-family: "Trebuchet MS";
}

#toolbar-container .ql-font span[data-label="PT Serif"]::before {
    font-family: "PT Serif";
}

#toolbar-container .ql-font span[data-label="Times New Roman"]::before {
    font-family: "Times New Roman";
}

/* Set content font-families */

.ql-font-inconsolata {
    font-family: "Inconsolata";
}

.ql-font-tahoma {
    font-family: "Tahoma";
}

.ql-font-arial {
    font-family: "Arial";
}

.ql-font-georgia {
    font-family: "Georgia";
}

.ql-font-poppins {
    font-family: "Roboto";
}

.ql-font-poppins {
    font-family: "Lato";
}

.ql-font-inter {
    font-family: "Inter";
}

.ql-font-impact {
    font-family: "Impact";
}

.ql-font-manrope {
    font-family: "Manrope";
}

.ql-font-lucida {
    font-family: "Lucida Sans Unicode";
}

.ql-font-trebuchet {
    font-family: "Trebuchet MS";
}

.ql-font-roboto {
    font-family: "Poppins";
}

.ql-font-raleway {
    font-family: "Raleway";
}

.ql-font-ptserif {
    font-family: "PT Serif";
}

.ql-font-timesnewroman {
    font-family: "Times New Roman";
}

.ql-font-montserrat {
    font-family: "Montserrat";
}

.ql-font-acta {
    font-family: "Acta Display";
}

.ql-font-verdana {
    font-family: "Verdana";
}

.ql-font-aktiv {
    font-family: "Aktiv Grotesk";
}

.ql-font-sanchez {
    font-family: "Sanchez";
}

.ql-font-mirza {
    font-family: "Mirza";
}

.ql-font-arial {
    font-family: "Arial";
}


.textEditorInFocus {
    z-index: 2;
}

.ql-bubble .ql-tooltip-editor input[type=text] {
    text-align: center;
    left: 0px;
}

.staticQuillToolbar {
    position: absolute;
}

.ql-toolbar {
    position: relative !important;
}

.ql-editor {

    background-color: inherit !important;
}

.width100 {
    width: 100% !important;
}

.ReactTable .-pagination {
    box-shadow: 0 0 0px 0 rgba(0, 0, 0, 0.1) !important;
}

.dateRangePicker {
    cursor: pointer !important;
}

.dateSelectorDropdownPrefix__indicator {
    cursor: pointer !important;
}

.dateSelectorDropdownPrefix__menu {
    margin-top: 2px !important;
    cursor: pointer !important;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}

.dateSelectorDropdown {
    cursor: pointer !important;
    color: #626262;
    font-weight: 600;
    text-align: center;
    height: 100% !important;
}

.dateSelectorDropdownPrefix__menu {
    min-width: 350px !important;
}

.dateSelectorDropdownPrefix__single-value {
    cursor: pointer !important;
    text-align: center;
    width: 100%;
    color: #626262 !important;
}

@media (max-width: 992px) {
    .dateSelectorDropdownPrefix__value-container {
        display: none !important;
    }
}

@media print {
    .pageBreakAlways {
        page-break-after: always;
    }

    .breakAlways {
        break-after: right;
    }
}

.pageBreakAlways {
    page-break-after: always !important;
}

.floatNone {
    float: none !important;
}

.displayBlock {
    display: block !important;
}

.public-url-form-control {
    border-top-right-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
}


.coact-table {
    border: 0px solid #fff !important;
    font-weight: 500;
}

.preset-table-tile .rt-tfoot {
    background-color: #f6f6f6 !important;
}


.fixed-header .rt-head {
    background-color: #fff !important;

}

.fixed-header .rt-tr {
    background-color: #fff !important;

}

.fixed-header .rt-thead {
    width: 100%;
    max-width: calc(100% - 240px);
    min-width: 100px;
    background-color: #fff;
    position: fixed !important;
    top: 140px !important;
    z-index: 9;
    height: 31px;

}

.fixed-header .rt-tbody {
    padding-top: 120px !important;
}

.report-version-table {
    text-align: center !important;

}

.report-version-table .rt-thead {
    display: none !important;
}

.coact-table .rt-thead .rt-th, .coact-table .rt-thead .rt-td {
    border: 0px solid #fff;
    border-bottom: 2px solid #f6f6f6;
}

.coact-table .rt-thead.-header {
    box-shadow: 0 0px 0px 0 #dee6ef !important;
}


.coact-table.-highlight .rt-tbody .rt-tr:not(.-padRow):hover {
    cursor: pointer;
    background: #f8f9fb !important;
    color: #417bfb;
    border-radius: 20px;
}


.coact-table .rt-thead .rt-th, .coact-table .rt-thead .rt-td {
    /*border-right: 0px solid #fff !important;*/
}

.coact-table .rt-tbody .rt-tr-group {
    border-bottom: 0px solid #fff !important;
}

.ReactTable .rt-tbody .rt-td {
    border-right: 0px solid #fff !important;
}


.preset-table-tile .rt-thead .rt-th {
    font-size: 10px !important;
}

.coact-table .rt-tbody .rt-td {
    border-right: 0px solid #fff !important;
}

.coact-table .rt-thead {
    margin-bottom: 15px !important;
}

.coact-table .rt-tr {
    min-height: 42px !important;
    border-radius: 16px;
}

.coact-table .rt-thead .rt-tr {
    height: 32px !important;

}


.numberCircle {
    border-radius: 50%;
    width: 50px;
    height: 50px;
    padding: 8px;
    background: #fff;
    border: 2px solid #417bfb;
    color: #417bfb;
    text-align: center;
    font-size: 20px;
}


.report-menu-dropdown {

    width: 250px;
    z-index: 1000;
    font-family: Inter;
    position: fixed;
    top: 55px;
    background-color: #fff;
    color: #626262;
    right: 10px;
    padding: 0.5rem 0;
    border-radius: 10px;
    border: 1px solid #e3e6f0;
    border-bottom: 6px solid #36648B !important;
    font-size: 14px;

}

.droppable-tile {
    border-radius: 2px;
    height: 55px;
    overflow: hidden;
    width: 100%;
    padding: 4px 10px;
    border: 2px dashed rgb(98 98 98 / 38%);
    cursor: grab;
}

.droppable-tile:hover {
    border-radius: 0px !important;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
    border: 2px dashed #36648B;
}

.droppable-tile:active {
    cursor: grabbing;
    border-radius: 0px !important;
    border: 2px dashed #36648B;
}

.react-tooltip-container {
    opacity: 1 !important;
}


.react-feather-tile-icon {
    border: 1px solid #626262;
    border-radius: 10px;
    padding: 4px;
}

.refresh-tile-btn-active {
    cursor: pointer;
    background-color: #36648B;
    color: #fff;
    position: absolute;
    top: 40px;
    right: 8px;
    border-radius: 15px;
}

.refresh-tile-btn-inactive {
    cursor: pointer;
    background-color: #fff;
    color: #000;
    position: absolute;
    top: 40px;
    right: 8px;
    border-radius: 15px;
}

.refresh-tile-btn-active:hover {
    background-color: #6c94af;
    color: #fff;
}

.refresh-tile-btn-inactive:hover {
    background-color: #6c94af;
    color: #fff;
}

.react-feather-tile-icon-with-margin {
    margin-right: 10px;
    margin-top: -4px;
    border: 1px solid #626262;
    border-radius: 10px;
    padding: 4px;
}

.tile-type-select-row {
    position: relative;
    cursor: pointer;
    color: #626262;
    border: 1px solid #e3e6f0;
    margin-top: 20px;
    height: 40px;
    width: 100%;
    text-align: center;
}

.tile-type-select-row:hover {
    border: 1px solid #36648B;
    color: #36648B;
}

.tile-type-select-row-active {
    position: relative;
    /*position:absolute;*/
    /*top:76px;*/
    background-color: #fff !important;
    z-index: 2;
    cursor: pointer;
    color: #78AB46;
    border: 1px solid #78AB46;
    margin-top: 20px;
    height: 40px;
    width: 100%;
    text-align: center;
}

.tile-type-select-row-active:hover {
    border: 1px solid #78AB46;
    color: #78AB46;
}


.data-source-selected-row {
    min-height: 40px;
    overflow: hidden;
    width: 95%;
    margin-left: 2.5%;
    margin-top: 15px;
    margin-bottom: 15px;
    position: relative;
    padding-left: 40px;
    padding-right: 40px;
    cursor: pointer;
    border: 1px solid #78AB46;
}

.data-source-selected-row:hover {
    border: 1px solid #881910;
    color: #881910;
}

.combination-data-source-selected-tile {
    cursor: pointer;
    padding: 2px;
    border-radius: 2px;
    border: 1px solid #fff;
}

.combination-data-source-selected-tile:hover {
    border: 1px solid #881910;

}

.delete-hover-btn {
    cursor: pointer;
}

.delete-hover-btn:hover {
    color: #881910
}

.collapse-configuration-row {
    cursor: pointer;
    height: 49px;
    position: relative;
}

.collapse-configuration-row:hover {
    color: #36648B !important;
}

.collapse-configuration-row:hover h5 {
    color: #36648B !important;
}

.collapse-configuration-row-chevron {
    position: absolute;
    right: 20px;
    top: 6px;
}

.expanded-configuration-header:hover {
    color: #36648B !important;
}

.expanded-configuration-header:hover {
    cursor: pointer;
    color: #36648B !important;
}

.facebook-ads-preview-container iframe {
    border-radius: 4px;
    -webkit-box-shadow: 0 0 10px #d7d5d57d;
    box-shadow: 0 0 10px #d7d5d57d;
}


.preset-table-tile .rt-tr-group:nth-of-type(even) {
    background: rgba(246, 246, 246, 0.55);
    border-top: solid 1px rgba(0, 0, 0, 0.05);

}

.report-version-table .rt-tr-group:nth-of-type(even) {
    background: rgba(246, 246, 246, 0.55);
    border-top: solid 1px rgba(0, 0, 0, 0.05);

}

.report-version-table .rt-tr-group:nth-of-type(odd) {
    background: rgba(246, 246, 246, 0.55);
    border-top: solid 1px rgba(0, 0, 0, 0.05);

}

.preset-table-tile .rt-tr {
    align-items: center !important;

}

.preset-table-tile .rt-thead {
    font-weight: 600;
}

.preset-table-tile-modern-styling .rt-thead.-header {
    box-shadow: none !important;
}

.preset-table-tile-modern-styling .rt-td {
    border-right: 3px solid #fcfcfc !important;
}

.preset-table-tile-modern-styling .rt-thead .rt-th {
    border-right: 3px solid #fcfcfc !important;
    padding: 10px 5px !important;
}
.preset-table-tile-modern-styling .rt-thead .rt-resizable-header-content {

    white-space: break-spaces !important;
}

.preset-table-tile-modern-styling .rt-tbody .rt-td {
    border-right: 3px solid #fcfcfc !important;
    padding: 10px 5px !important;
}

.preset-table-tile-modern-styling .rt-thead .rt-th.-sort-desc, .preset-table-tile-modern-styling .rt-thead .rt-td.-sort-desc {
    box-shadow: inset 0 -1px 0 0 rgb(0 0 0 / 30%) !important;
}

.preset-table-tile-modern-styling .rt-thead .rt-th.-sort-asc, .preset-table-tile-modern-styling .rt-thead .rt-td.-sort-asc {
    box-shadow: inset 0 1px 0 0 rgb(0 0 0 / 30%) !important;
}

.preset-table-tile-modern-styling .rt-tr-group:nth-of-type(even) {
    background-color: #f1f1ef !important;
}

.preset-table-tile-modern-styling .rt-tbody .rt-tr-group {
    border-bottom: 0px solid #fff !important;
}

/*.preset-table-tile-modern-styling .rt-thead .rt-th.-cursor-pointer, .preset-table-tile-modern-styling .rt-thead .rt-td.-cursor-pointer {*/
/*    cursor: pointer;*/
/*    background-color: #000 !important;*/
/*    color: #fff !important;*/
/*    text-transform: uppercase;*/
/*}*/

.twitter-picker {
    background-color: #f6f6f6 !important;
}


.curved-input-container {
    margin-left: 2.5%;
    margin-right: 2.5%;
    background-color: #e9ecef;
    border-radius: 0.25rem;
    border: 1px solid rgba(0, 0, 0, 0.125);
}

.curved-input-header {
    padding: 20px;
    background-color: #e9ecef;
    border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.curved-input-footer {
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    padding: 20px;
    background-color: #e9ecef;
}

.curved-input-body {
    padding: 20px;
    background-color: #fff;
}

.curved-delete-container {
    margin-left: 2.5%;
    margin-right: 2.5%;
    background-color: #881910;
    border-radius: 0.25rem;
    border: 1px solid #881910;
}

.curved-delete-header {
    padding: 20px;
    color: #fff !important;
    background-color: #881910;
    border-bottom: 1px solid #881910;
}

.curved-delete-header p {
    color: #fff !important;
}

.curved-delete-footer {
    border-top: 1px solid #881910;
    padding: 20px;
    background-color: #881910;
}

.curved-delete-body {
    padding: 20px;
    background-color: #fff;
}

/*#report-tabs-container {*/
/*    z-index:5 !important;*/
/*}*/
#top-navbar {
    z-index: 6 !important;
}

.kpi-tile-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.preset-table-tile .rt-tbody {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}


.preset-table-tile-modern-styling .rt-tbody {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}