/*================================================================================
	Item Name: Stack - Responsive Admin Theme
	Version: 1.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */
.col-xs-5ths,
.col-sm-5ths,
.col-md-5ths,
.col-lg-4ths {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

#appendlistemailsearch li {
    padding: 10px;
    border: 1px solid #babfc7;
    border-top: none;
}

    #appendlistemailsearch li a {
        display: block
    }

.NotifyPush {
    z-index: 99999 !important;
    box-shadow: 2px 4px 20px -4px rgb(0 0 0 / 10%) !important;
    padding: 15px !important;
    border: 1px solid #dadada !important;
    position: absolute !important;
    top: 60px !important;
    display: none;
    right: 5px !important;
    background-color: #ffe770 !important;
    border-radius: 10px !important;
}

.col-xs-5ths {
    width: 20%;
    float: left;
}
/*.vertical-overlay-menu .main-menu, .vertical-overlay-menu.menu-hide .main-menu {
    left: -767px;
}
*/
.heading-elements-toggle {
    display: none
}

@media (min-width: 768px) {
    .col-sm-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 992px) {
    .col-md-5ths {
        width: 20%;
        float: left;
    }
}

@media (min-width: 1200px) {
    .col-lg-4ths {
        width: 20%;
        float: left;
    }
}

.modal-header h5 {
    float: left
}

.table thead, .modal-header, .table-fixed thead {
    background-image: linear-gradient(to right, #00B5B8 0%,#10C888 100%);
    background-repeat: repeat-x;
    color: #FFF;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
}

.item img {
    vertical-align: top !important;
}

.m-r-10 {
    margin-right: 10px
}

.m-r-5 {
    margin-right: 5px
}

.table-hover > tbody > tr:hover {
    background-color: #ddefea;
    color: #000;
}

.color-black {
    opacity: 1;
}

.color-black-hover {
    opacity: 0.6;
}

.table-fixed {
    width: 100%;
}

    .table-fixed tbody {
        height: 400px;
        overflow-y: auto;
        width: 100%;
    }

    .table-fixed thead,
    .table-fixed tbody,
    .table-fixed tr,
    .table-fixed td,
    .table-fixed th {
        display: block;
    }

    .table-fixed thead {
        width: 100%;
        float: left;
    }

    .table-fixed tbody td {
        float: left;
    }

    .table-fixed thead tr th {
        float: left;
    }

*::-webkit-scrollbar-track {
}

*::-webkit-scrollbar {
    width: 5px;
    background-color: #F5F5F5;
    height: 5px
}

*::-webkit-scrollbar-thumb {
    background-color: #404E6780;
}

.list-group {
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
}
/*--list plan Home--*/
.widget-timeline .timeline-items {
    padding: 1.1rem 0;
    list-style: none;
    position: relative;
}

    .widget-timeline .timeline-items.timeline-icon-success:before {
        background-color: #16d39a;
    }

    .widget-timeline .timeline-items:before {
        position: absolute;
        content: '';
        left: -37px;
        top: 17px;
        box-shadow: 1px 2px 6px 0 rgba(25, 42, 70, 0.3);
        border-radius: 50%;
        background-color: #00b5b8;
        height: 13px;
        width: 13px;
        z-index: 2;
    }

    .widget-timeline .timeline-items:not(:last-child):after {
        position: absolute;
        content: '';
        width: 1px;
        background: #dfe3e7;
        left: -31px;
        top: 22px;
        height: 100%;
    }

    .widget-timeline .timeline-items .timeline-time {
        float: right;
        color: #babfc7;
        font-size: .9rem;
    }

    .widget-timeline .timeline-items .timeline-title {
        line-height: 1.2;
        font-family: "Montserrat", Georgia, "Times New Roman", Times, serif;
        font-weight: 500;
    }

    .widget-timeline .timeline-items .timeline-subtitle {
        margin-bottom: .5rem;
        color: #babfc7;
        font-size: 13px;
    }

    .widget-timeline .timeline-items.timeline-icon-danger:before {
        background-color: #ff7588;
    }

    .widget-timeline .timeline-items.timeline-icon-warning:before {
        background-color: #ffa87d;
    }

    .widget-timeline .timeline-items.timeline-icon-info:before {
        background-color: #2dcee3;
    }

.loadding {
    height: 20px;
    width: 100%;
    text-align: center;
    margin-top: -20px;
    opacity: 0.6
}
/*--list plan Home--*/

.text-left {
    text-align: left !important;
}

.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}


.media {
    display: flex;
    /*padding: 20px;*/
}

.list-group-item .media {
    display: block;
    /*padding: 20px;*/
}
/*.media h5 {font-size:13px;}*/
.flex-1 {
    flex: 0 0 20%;
    width: 20%;
    float: left;
    padding: 10px;
}

.nav-link, .cursor-point {
    cursor: pointer
}

/*-------------Calendar Timeline---------------*/
#calendar {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    width: 100%;
    margin: 0 auto;
    height: 570px;
    max-width: 400px;
    overflow: hidden;
}

.header {
    height: 50px;
    width: 100%;
    /*background: rgba(66, 66, 66, 1);*/
    text-align: center;
    position: relative;
    z-index: 100;
}

    .header h1 {
        margin: 0;
        padding: 0;
        font-size: 20px;
        line-height: 50px;
        font-weight: 100;
        letter-spacing: 1px;
    }

.left, .right {
    position: absolute;
    width: 0px;
    height: 0px;
    border-style: solid;
    top: 50%;
    margin-top: -7.5px;
    cursor: pointer;
}

.left {
    border-width: 7.5px 10px 7.5px 0;
    border-color: transparent rgba(160, 159, 160, 1) transparent transparent;
    left: 20px;
}

.right {
    border-width: 7.5px 0 7.5px 10px;
    border-color: transparent transparent transparent rgba(160, 159, 160, 1);
    right: 20px;
}

.month {
    /*overflow: hidden;*/
/*    opacity: 0;
*/}

    .month.new {
        -webkit-animation: fadeIn 1s ease-out;
        opacity: 1;
    }

    .month.in.next {
        -webkit-animation: moveFromTopFadeMonth .4s ease-out;
        -moz-animation: moveFromTopFadeMonth .4s ease-out;
        animation: moveFromTopFadeMonth .4s ease-out;
        opacity: 1;
    }

    .month.out.next {
        -webkit-animation: moveToTopFadeMonth .4s ease-in;
        -moz-animation: moveToTopFadeMonth .4s ease-in;
        animation: moveToTopFadeMonth .4s ease-in;
        opacity: 1;
    }

    .month.in.prev {
        -webkit-animation: moveFromBottomFadeMonth .4s ease-out;
        -moz-animation: moveFromBottomFadeMonth .4s ease-out;
        animation: moveFromBottomFadeMonth .4s ease-out;
        opacity: 1;
    }

    .month.out.prev {
        -webkit-animation: moveToBottomFadeMonth .4s ease-in;
        -moz-animation: moveToBottomFadeMonth .4s ease-in;
        animation: moveToBottomFadeMonth .4s ease-in;
        opacity: 1;
    }

.week, .day_timeline {
    background: #6E83AB;
}

.day_timeline {
    display: inline-block;
    width: 14%;
    padding: 10px;
    text-align: center;
    vertical-align: top;
    cursor: pointer;
    position: relative;
    z-index: 100;
}

    .day_timeline.other {
        color: rgba(255, 255, 255, .3);
    }

    .day_timeline.today {
        /*color: rgba(156, 202, 235, 1);*/
        border: 1px solid #FFFFFF50;
        border-radius: 2px;
    }

.day-name {
    font-size: 9px;
    text-transform: uppercase;
    margin-bottom: 5px;
    color: rgba(255, 255, 255, .5);
    letter-spacing: .7px;
}

.day-number {
    font-size: 24px;
    letter-spacing: 1.5px;
    color: rgba(255, 255, 255, 1);
}


.day_timeline .day-events {
    list-style: none;
    margin-top: 3px;
    text-align: center;
    height: 12px;
    line-height: 6px;
    overflow: hidden;
}

    .day_timeline .day-events span {
        vertical-align: top;
        display: inline-block;
        padding: 0;
        margin: 0;
        width: 5px;
        height: 5px;
        line-height: 5px;
        margin: 0 1px;
    }

.blue {
    background: rgba(156, 202, 235, 1);
}

.orange {
    background: rgba(247, 167, 0, 1);
    color: rgba(247, 167, 0, 1) !important;
}

.green {
    background: rgba(153, 198, 109, 1);
}

.yellow {
    background: rgba(249, 233, 0, 1);
}

.details {
    position: relative;
    width: 420px;
    height: 75px;
    background: rgba(164, 164, 164, 1);
    margin-top: 5px;
    border-radius: 4px;
}

    .details.in {
        -webkit-animation: moveFromTopFade .5s ease both;
        -moz-animation: moveFromTopFade .5s ease both;
        animation: moveFromTopFade .5s ease both;
    }

    .details.out {
        -webkit-animation: moveToTopFade .5s ease both;
        -moz-animation: moveToTopFade .5s ease both;
        animation: moveToTopFade .5s ease both;
    }

.arrow {
    position: absolute;
    top: -5px;
    left: 50%;
    margin-left: -2px;
    width: 0px;
    height: 0px;
    border-style: solid;
    border-width: 0 5px 5px 5px;
    border-color: transparent transparent rgba(164, 164, 164, 1) transparent;
    transition: all 0.7s ease;
}

/*.events {
    height: 75px;
    padding: 7px 0;
    overflow-y: auto;
    overflow-x: hidden;
}*/

.events.in {
    -webkit-animation: fadeIn .3s ease both;
    -moz-animation: fadeIn .3s ease both;
    animation: fadeIn .3s ease both;
}

.events.in {
    -webkit-animation-delay: .3s;
    -moz-animation-delay: .3s;
    animation-delay: .3s;
}

.details.out .events {
    -webkit-animation: fadeOutShrink .4s ease both;
    -moz-animation: fadeOutShink .4s ease both;
    animation: fadeOutShink .4s ease both;
}

.events.out {
    -webkit-animation: fadeOut .3s ease both;
    -moz-animation: fadeOut .3s ease both;
    animation: fadeOut .3s ease both;
}

.event {
    font-size: 16px;
    line-height: 22px;
    letter-spacing: .5px;
    padding: 2px 16px;
    vertical-align: top;
}

    .event.empty {
        color: #eee;
    }

.event-category {
    height: 10px;
    width: 10px;
    display: inline-block;
    margin: 6px 0 0;
    vertical-align: top;
}

.event span {
    display: inline-block;
    padding: 0 0 0 7px;
}

.legend {
    /*position: absolute;*/
    bottom: 0;
    width: 100%;
    height: 30px;
    background: rgba(60, 60, 60, 50);
    line-height: 30px;
    z-index: 99999
}

.entry {
    position: relative;
    padding: 0 0 0 25px;
    font-size: 13px;
    display: inline-block;
    line-height: 30px;
    background: transparent;
}

    .entry:after {
        position: absolute;
        content: '';
        height: 5px;
        width: 5px;
        top: 12px;
        left: 14px;
    }

    .entry.blue:after {
        background: rgba(156, 202, 235, 1);
    }

    .entry.orange:after {
        background: rgba(247, 167, 0, 1);
    }

    .entry.green:after {
        background: rgba(153, 198, 109, 1);
    }

    .entry.yellow:after {
        background: rgba(249, 233, 0, 1);
    }

/* Animations are cool!  */
@-webkit-keyframes moveFromTopFade {
    from {
        opacity: .3;
        height: 0px;
        margin-top: 0px;
        -webkit-transform: translateY(-100%);
    }
}

@-moz-keyframes moveFromTopFade {
    from {
        height: 0px;
        margin-top: 0px;
        -moz-transform: translateY(-100%);
    }
}

@keyframes moveFromTopFade {
    from {
        height: 0px;
        margin-top: 0px;
        transform: translateY(-100%);
    }
}

@-webkit-keyframes moveToTopFade {
    to {
        opacity: .3;
        height: 0px;
        margin-top: 0px;
        opacity: 0.3;
        -webkit-transform: translateY(-100%);
    }
}

@-moz-keyframes moveToTopFade {
    to {
        height: 0px;
        -moz-transform: translateY(-100%);
    }
}

@keyframes moveToTopFade {
    to {
        height: 0px;
        transform: translateY(-100%);
    }
}

@-webkit-keyframes moveToTopFadeMonth {
    to {
        opacity: 0;
        -webkit-transform: translateY(-30%) scale(.95);
    }
}

@-moz-keyframes moveToTopFadeMonth {
    to {
        opacity: 0;
        -moz-transform: translateY(-30%);
    }
}

@keyframes moveToTopFadeMonth {
    to {
        opacity: 0;
        -moz-transform: translateY(-30%);
    }
}

@-webkit-keyframes moveFromTopFadeMonth {
    from {
        opacity: 0;
        -webkit-transform: translateY(30%) scale(.95);
    }
}

@-moz-keyframes moveFromTopFadeMonth {
    from {
        opacity: 0;
        -moz-transform: translateY(30%);
    }
}

@keyframes moveFromTopFadeMonth {
    from {
        opacity: 0;
        -moz-transform: translateY(30%);
    }
}

@-webkit-keyframes moveToBottomFadeMonth {
    to {
        opacity: 0;
        -webkit-transform: translateY(30%) scale(.95);
    }
}

@-moz-keyframes moveToBottomFadeMonth {
    to {
        opacity: 0;
        -webkit-transform: translateY(30%);
    }
}

@keyframes moveToBottomFadeMonth {
    to {
        opacity: 0;
        -webkit-transform: translateY(30%);
    }
}

@-webkit-keyframes moveFromBottomFadeMonth {
    from {
        opacity: 0;
        -webkit-transform: translateY(-30%) scale(.95);
    }
}

@-moz-keyframes moveFromBottomFadeMonth {
    from {
        opacity: 0;
        -webkit-transform: translateY(-30%);
    }
}

@keyframes moveFromBottomFadeMonth {
    from {
        opacity: 0;
        -webkit-transform: translateY(-30%);
    }
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }
}

@-moz-keyframes fadeIn {
    from {
        opacity: 0;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
}

@-webkit-keyframes fadeOut {
    to {
        opacity: 0;
    }
}

@-moz-keyframes fadeOut {
    to {
        opacity: 0;
    }
}

@keyframes fadeOut {
    to {
        opacity: 0;
    }
}

@-webkit-keyframes fadeOutShink {
    to {
        opacity: 0;
        padding: 0px;
        height: 0px;
    }
}

@-moz-keyframes fadeOutShink {
    to {
        opacity: 0;
        padding: 0px;
        height: 0px;
    }
}

@keyframes fadeOutShink {
    to {
        opacity: 0;
        padding: 0px;
        height: 0px;
    }
}
/*-------------Calendar Timeline---------------*/
/* Grouped card statistics */
/*------------------------*/
.grouped-multiple-statistics-card .card-icon .customize-icon {
    background-color: #f5f7fa;
}

.grouped-multiple-statistics-card .heading-text {
    font-size: 1.9rem;
    letter-spacing: 2px;
}

.grouped-multiple-statistics-card .sub-heading {
    color: #babfc7;
}

.grouped-multiple-statistics-card .inc-dec-percentage small {
    color: #babfc7;
    white-space: nowrap;
}

/* Tracking and total sales chart */
/*-------------------------------*/
.tracking-stats-chart .body-header-title {
    letter-spacing: 2px;
}

.tracking-stats-chart .body-header-subtitle span {
    color: #babfc7 !important;
}

.tracking-stats-chart .card-tabs .nav-link {
    line-height: 1.5;
}

    .tracking-stats-chart .card-tabs .nav-link.active {
        color: #00b5b8;
        border-bottom: 2px solid #98a4b8;
        border-radius: 0;
        background-color: transparent;
    }

.tracking-stats-chart .top-content i {
    font-size: 2.8rem;
}

.tracking-stats-chart .tracking-list li {
    border: none !important;
}

    .tracking-stats-chart .tracking-list li .tracking-task {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

.apexcharts-tooltip {
    height: 28px;
    display: flex;
    justify-content: center;
    align-items: center;
}

    .apexcharts-tooltip .apexcharts-tooltip-series-group:last-child {
        padding-bottom: 0;
    }

/* Sales statistics donut chart */
/*-----------------------------*/
.statistics-chart-data {
    width: 60%;
}

    .statistics-chart-data .collection {
        white-space: nowrap;
    }

/* Information time tracking chart */
/*--------------------------------*/
.info-time-tracking-title .icon-settings {
    font-size: 1.3rem;
}

.info-time-tracking-content .leading-para {
    color: #98a4b8;
}

/* Latest update card */
/*-------------------*/
.latest-update-tracking .latest-updated-item {
    white-space: nowrap;
    line-height: 1;
}

    .latest-update-tracking .latest-updated-item .list-group-item-icon {
        font-size: 1.3rem;
    }

    .latest-update-tracking .latest-updated-item .update-profit,
    .latest-update-tracking .latest-updated-item .latest-update-item-name {
        color: #626e82;
    }

/* Media query for min-width: 1200px to max-width: 1500px */
/*-------------------------------------------------------*/
@media (min-width: 1200px) and (max-width: 1500px) {
    .card-icon {
        margin-right: 1.5rem !important;
    }

        .card-icon i {
            font-size: 2rem !important;
        }

    .stats-amount {
        margin-right: 1.6rem !important;
    }

        .stats-amount h3 {
            font-size: 1.5rem !important;
            white-space: nowrap;
        }

        .stats-amount .sub-heading {
            white-space: nowrap;
            margin-bottom: 0rem !important;
        }

    .inc-dec-percentage small {
        white-space: nowrap;
    }
}

/* Media query for max-width: 1200px */
/*-----------------------------------*/
@media (max-width: 1200px) {
    .grouped-multiple-statistics-card .col-lg-6:nth-child(2) {
        border: 0px solid !important;
    }
}

/* Media query for max-width: 768px */
/*----------------------------------*/
@media (max-width: 768px) {
    .grouped-multiple-statistics-card .col-lg-6:nth-child(1) {
        border: 0px solid !important;
    }

    .grouped-multiple-statistics-card .col-lg-6:nth-child(3) {
        border: 0px solid !important;
    }
}

/* Media query for 1400px and up */
/*-------------------------------*/
@media (min-width: 1400px) {
    .latest-update-tracking .card {
        max-height: 239px !important;
        overflow: hidden;
    }

        .latest-update-tracking .card .latest-update-heading {
            height: 4.3rem;
        }

        .latest-update-tracking .card .latest-update-tracking-list {
            height: 181px !important;
        }

    .info-time-tracking {
        max-height: 239px !important;
    }
}

/* Media query for IE 11 */
/*-----------------------*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */
    .info-time-tracking-content #general_task_radial_bar_chart {
        margin-top: 2rem;
    }

    .info-time-tracking-content .stats-content .leading-para,
    .info-time-tracking-content .task-content .leading-para {
        word-break: break-all !important;
        width: 100%;
    }

    .info-time-tracking-content .task-content {
        flex-basis: 500px;
    }

    .info-time-tracking-content .stats-content {
        flex-basis: 200px;
    }
}

.icon-minus:before {
    content: url('https://api.iconify.design/simple-line-icons:minus.svg?height=14');
}

.icon-excel:before {
    content: url('/Images/Icons/excel.svg');
}

.icon-filter:before {
    content: url('/Images/Icons/filter.svg');
}
/*https://api.iconify.design/bx:bxs-filter-alt.svg?height=14&color=white*/

.progress_custom {
    display: flex;
    height: 1rem;
    overflow: hidden;
    font-size: 0.75rem;
    background-color: #eee;
    border-radius: 0.25rem;
    height: 20px !important;
    line-height: 20px;
}

.color-leader {
    color: #FF6275
}
.color-great {
    color: #32f304;
}
.color-normal {
    color: #ccc1cccc;
}
.color-weak {
    color: #fc3651;
}
/******************Update UI sprint 8*******************/
.float-right {
    float: right !important;
}

.card-body {
    flex: 1 1 auto;
    min-height: 1px;
    padding: 1.5rem;
    border-radius: 8px;
    border: 0.5px solid #ffffff;
    margin-top:5px;
}

.list-group-item-a {
    border-top: 1px solid #E4E7ED !important;
}

.d-flex {
    display: flex !important;
}

.justify-content-between {
    justify-content: space-between !important;
}
/*kanban*/
.kanban-item[data-border=close]:before {
    background-color: #62FFB5;
}
.kanban-item[data-border=inprogress]:before {
    background-color: #7FE7FF;
}
.kanban-item[data-border=todo]:before {
    background-color: #038387;
}

.kanban-item[data-border=open]:before {
    background-color: #FFE3DA;
}

.kanban-item[data-border=reopen]:before {
    background-color: red;
}

.kanban-item[data-border=review]:before {
    background-color: #FDF688;
}

.kanban-item[data-border=qa]:before {
    background-color: #669AD4;
}
.kanban-item[data-border=inqa]:before {
    background-color: rgba(153, 198, 109, 1);
}
.kanban-item[data-border=verify]:before {
    background-color: #21618C;
}
.kanban-board[data-id=open] .kanban-board-header {
    border-bottom: 3px solid #FFE3DA;
}
.kanban-board[data-id=inprogress] .kanban-board-header {
    border-bottom: 3px solid #7FE7FF;
}
.kanban-board[data-id=todo] .kanban-board-header {
    border-bottom: 3px solid #038387;
}
.kanban-board[data-id=review] .kanban-board-header {
    border-bottom: 3px solid #FDF688;
}
.kanban-board[data-id=qa] .kanban-board-header {
    border-bottom: 3px solid rgba(153, 198, 109, 1);
}
.kanban-board[data-id=inqa] .kanban-board-header {
    border-bottom: 3px solid rgba(153, 198, 109, 1);
}
.kanban-board[data-id=close] .kanban-board-header {
    border-bottom: 3px solid #62FFB5;
}
.kanban-board[data-id=verify] .kanban-board-header {
    border-bottom: 3px solid #21618C;
}
.kanban-item {
    border: 1px solid #dfdfdf;
}
.mr-50, .mx-50 {
    margin-right: 0.5rem !important;
}
/*.kanban-board {margin: 0px !important; margin-left: 5px !important; margin-right: 5px !im;}*/
/*kanban*/
/*.select2{width: 100% !important}*/
.flex-column {
    flex-direction: column !important;
}

.nav-pills .nav-item {
    float: unset;
}

.nav-item i {
    align-self: center;
}

.d-flex {
    display: flex !important;
}

.pl-0, .px-0 {
    padding-left: 0 !important;
}

.pr-0, .px-0 {
    padding-right: 0 !important;
}

.flex-sm-row {
    flex-direction: row !important;
}

.btn-secondary {
    border-color: #626E82 !important;
    background-color: #fff !important;
    color: #404E67;
}

.ml-50, .mx-50 {
    margin-left: 0.5rem !important;
}

.btn-sm, .btn-group-sm > .btn {
    margin: 0.25rem 0.5rem;
    font-size: 0.875rem;
    line-height: 1;
    border-radius: 0.21rem;
}

.p_user {
    border-color: #16D39A !important;
    color: #16D39A
}

.p_task_improvement {
    border-color: #2DCEE3 !important;
    color: #2DCEE3
}

.p_bug {
    border-color: #FF7588 !important;
    color: #FF7588
}

.avatar.avatar-offline i {
    background-color: #babfc7;
}

.badge-priority {
    background-color: #FF8A9A !important
}

.badge-category {
    background-color: #46b0b1 !important
}

.badge-status {
    background-color: #5DADE2 !important
}

.badge-type {
    background-color: #82E0AA !important
}

.badge-estimation {
    background-color: #21618C !important
}

.badge-duedate {
    background-color: #F7DC6F !important;
    color: #000000 !important;
}
/*
    START
*/

.badge-Low {
    background: #36B096 !important
}

.badge-Block {
    background: #b50808 !important
}

.badge-High {
    background: #d20000 !important
}

.badge-Normal {
    background: #ffeb00 !important;
    color: black !important
}

.badge-Open {
    background: #F8BD32 !important;
    color: black !important
}

.badge-Inprogress {
    background: #d687588c !important;
    color: black !important
}

.badge-Close {
    background: #9e6a6a !important;
}

.badge-QA {
    background: #ff99ff !important;
}

.badge-InQA {
    background: #676d04 !important;
}

.badge-Review {
    background: #bfffe4 !important;
    color: black !important
}

.badge-Bug {
    background: #ff0000b8 !important;
}

.badge-Improvement {
    background: #00b8ff !important;
}

.badge-Task {
    background: #004effdb !important;
}
/*
    END
*/
/*priority*/
.badge-8 {
    background-color: #45B39D
}
/*Normal */
.badge-9 {
    background-color: #87909f
}
/*LOW */
.badge-10 {
    background-color: #FF8D60
}
/*HIGH */
.badge-11 {
    background-color: #FF586B
}
/*BLOCK */
/*Status*/
.badge-1 {
    background-color: #922B21
}
/*OPEN */
.badge-2 {
    background-color: #00b5b8
}
/*INPROGRESS */
.badge-3 {
    background-color: #21618C
}
/*QA */
.badge-4 {
    background-color: #21618C
}
/*INQA */
.badge-5 {
    background-color: #922B21
}
/*REOPEN */
.badge-6 {
    background-color: #82E0AA
}
/*CLOSE */
.badge-7 {
    background-color: #00b5b8
}
/*PENDING */
.badge-16 {
    background-color: #21618C
}
/*VERIFY */
.badge-15 {
    background-color: #F7DC6F
}
/*REVIEW */
/*Type*/
.badge-12 {
    background-color: #FF8A9A
}
/*BUG */
.badge-13 {
    background-color: #5DADE2
}
/*IMPROVEMENT */
.badge-14 {
    background-color: #26C0C3
}
/*Task */
/******************Update UI sprint 8*******************/

/*KienNB Edit Full UI*/

.btn_Search_Project {
    padding-right: 10px !important
}

#listeditproject {
    display: none
}

#titleeditproject:hover #listeditproject {
    display: block;
    margin-top: -3px !important;
}

#imageproject {
    width: 80%;
    height: 100%;
}

.select2-container--default {
    height: 40px;
    /*overflow:scroll*/
}

.select2-selection__choice {
    margin-bottom: 3px;
}

.logo {
    width: 100px
}

/*#hr_compare_display {
    top: 160px !important;
    left: 200px !important;
    position: absolute !important;
}*/
@media screen and (max-width: 320px) {
    .brand-logo {
        display: none
    }

    #keySearch {
        width: 80% !important;
    }

    #HomeProjectType {
        width: 80% !important;
    }

    .select2-container--default {
        width: 150px
    }


    #btn_click {
        float: right !important;
        position: absolute !important;
        left: 7px !important;
        top: 60px !important;
    }

    .sub_modal {
        width: 262px;
    }
}

@media screen and (max-width: 375px) {
    /**/
    #keySearch {
        width: 85% !important;
    }

    #HomeProjectType {
        width: 85% !important;
    }

    .select2-container--default {
        width: 150px;
    }

    #btn_click {
        float: right !important;
        position: absolute !important;
        left: 7px !important;
        top: 60px !important;
    }
}

@media screen and (max-width: 425px) {
    /**/
    #imageproject {
        width: 30%
    }

    .main-menu {
        /*z-index:-1;*/
    }

    .respon {
        width: 300px;
        background: #fff;
    }

    #btn_click {
        float: right !important;
        position: absolute !important;
        left: 7px !important;
        top: 60px !important;
    }
}

@media screen and (max-width: 768px) {
    #btnsummaryFilter {
        float: right
    }

    #keySearch {
        width: 90% !important;
    }

    #HomeProjectType {
        width: 90% !important;
    }

    #btn_click {
        float: right !important;
        position: absolute !important;
        left: 7px !important;
        top: 60px !important;
    }
}

@media screen and (max-width: 1024px) {
    /**/
    #keySearch {
        width: 78% !important;
    }

    #HomeProjectType {
        width: 78% !important;
    }
    /*
    .select2-container--default {
        width: 40% 
    }*/
    .kanban-board {
        width: 100% !important;
        margin-top: 10px !important;
    }

    .img_login {
        width: 100%;
    }

    .nav-item > .nav-link > span {
        /*display:none*/
    }

    .control-chart {
        /*display:none*/
    }

    #btn_click {
        float: right;
        position: absolute;
        right: -140px;
        top: 10px;
    }
}

@media screen and (min-width: 1366px) {
    #keySearch {
        width: 78% !important;
    }

    #HomeProjectType {
        width: 78% !important;
    }
}

@media screen and (min-width: 1024px) {
    /**/


    .select2-container--default {
        width: 250px !important;
        margin-top: 10px !important;
    }
}

@media screen and (min-width: 1440px) {
    /**/
    #keySearch {
        width: 86% !important;
    }

    #HomeProjectType {
        width: 86% !important;
    }
}

@media screen and (max-width: 1440px) {
    /**/

}

@media screen and (max-width: 2560px) {
    /**/
    #hr_chart_category_backlog {
        margin-top: 20px;
        margin-bottom: 10px;
    }
}



.navbar-header {
    z-index: 9
}

.sub-menu {
    display: none;
    border-radius: 3px;
}

.UserName:hover .sub-menu {
    display: block;
    position: absolute;
    background: #fff;
    border-top: 1px solid #ccc1cccc;
    z-index: 999999
}

.sub-menu a {
    padding: 10px 30px;
}

.Mail:hover .sub-menu {
    display: block !important;
    width: 320px;
    padding: 0;
    position: absolute;
    background: #fff;
    border-top: 1px solid #ccc1cccc;
    z-index: 999999;
    top: 55px;
}

#ul_notification2 {
    border: solid 1px #038387;
    position: fixed
}

    #ul_notification2:before {
        content: "";
        position: absolute;
        right: 110px;
        top: -10px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 10px 10px 10px;
        border-color: transparent transparent #e0e0e0 transparent;
        z-index: 9998;
    }

    #ul_notification2:after {
        content: "";
        position: absolute;
        right: 112px;
        top: -8px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 8px 8px 8px;
        border-color: transparent #de0f0f00 #e80b0b transparent;
        z-index: 9999;
    }

#ul_notification {
    border: solid 1px #038387;
    position: fixed
}

    #ul_notification:before {
        content: "";
        position: absolute;
        right: 152px;
        top: -10px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 10px 10px 10px;
        border-color: transparent transparent #038387 transparent;
        z-index: 9998;
    }

    #ul_notification:after {
        content: "";
        position: absolute;
        right: 154px;
        top: -8px;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 0 8px 8px 8px;
        border-color: transparent #de0f0f00 #e80b0b transparent;
        z-index: 9999;
    }


.Notify:hover .sub-menu {
    display: block !important;
    width: 320px;
    padding: 0;
    position: absolute;
    background: #fff;
    border: 1px solid #ccc1cccc;
    z-index: 999999;
    top: 55px;
}

.kanban-drag {
    height: 96% !important;
    overflow: scroll
}
/*Sonct update css select 2*/
.select2-infor {
    float: left;
    font-style: italic;
    font-size: 11px;
    padding: 6px 0px !important;
}
/*Sonct update css select 2*/

/*.select2-dropdown--below{
    margin-top:-10px;
    margin-left:4px
}*/
.avatar {
    text-align: center;
    width: 30px;
    height: 30px;
    overflow: hidden;
    border: 1px solid #00b5b8;
    background: #009087;
    color: white;
}

.media-object {
    width: 100% !important;
    height: 100% !important;
}

.avatar-online > img {
    width: 100% !important;
    height: 100% !important;
}

.select2-selection--single, .select2-search__field {
    outline: none
}

.header-navbar .navbar-container ul.nav li .list-group {
    max-height: max-content !important;
}

#SearchTestManagerment:hover #SearchTestManagerment {
    display: block
}

.kanban-container .kanban-board {
    background-color: rgba(255,255,255,0.3) !important;
    /*border: 1px solid #f1d1b5 !important;*/
}

.kanban-drag {
    scrollbar-width: none;
}

.cusor:hover {
    cursor: pointer
}

#SearchTestManagerment {
    border-radius: 40px;
    border: 1px solid #038387;
    width: 300px;
}

@media screen and (max-width:1024px) {
    #SearchTestManagerment {
        max-width: 170px;
    }
}

@media screen and (max-width:425px) {
    #SearchTestManagerment {
        max-width: 100% !important;
    }
}


.bd_act_home {
    font-size: 90%;
    border: 1px solid #ffeba0;
    border-radius: 5px;
    padding: 5px;
    font-weight: bold;
    color: #0ba9ac;
}
.bold-12-pink {
    color: #FF7588;
    font-size: 12px;
    font-weight: bold;
}
.bold-12-green {
    color: #00B5B8;
    font-size: 12px;
}
/**
    Google translate
*/
.fixed-con {
    z-index: 9724790009779558 !important;
    background-color: #f7f8fc;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: auto;
}

.VIpgJd-ZVi9od-aZ2wEe-wOHMyf {
    z-index: 9724790009779 !important;
    top: 0;
    left: unset;
    right: -5px;
    display: none !important;
    border-radius: 50%;
    border: 2px solid gold;
}

.VIpgJd-ZVi9od-aZ2wEe-OiiCO {
    width: 80px;
    height: 80px;
}
/*hide google translate link | logo | banner-frame */
.goog-logo-link, .gskiptranslate, .goog-te-gadget span, .goog-te-banner-frame, #goog-gt-tt, .goog-te-balloon-frame, div#goog-gt- {
    display: none !important;
}

.goog-te-gadget {
    color: transparent !important;
    font-size: 0px;
}

.goog-text-highlight {
    background: none !important;
    box-shadow: none !important;
}

/*google translate Dropdown */
#google_translate_element{
    padding-top:6px;
}
#google_translate_element select {
    background: #f6edfd;
    color: #383ffa;
    border: none;
    border-radius: 3px;
    padding: 6px 8px
}
.dv-bodyfooter {
    position: fixed;
    bottom: 5px;
    z-index: 9;
    width: 99%;
    background: #0a879b;
    padding: 10px;
    border-radius: 5px;
}