.navbar-fixed-left {
    height: 100%;
    position: fixed;
    z-index: 1000;
}

#navBottom {
    background-color: #8F5099;
    height: 40px;
    z-index: 1001;
}

#navTop {
    background-color: #42B38F;
    z-index: 1001;
}

#navLeft {
    background-color: #474F59;
}

#navLeft ul:first-of-type {
    height: 8rem !important;
}

#navLeft ul:nth-last-of-type(2) {
    height: 12rem !important;
}

@media (min-width: 1200px) {
    #eventsList,
    #eventsLegend,
    #eventsStat,
    #statTable,
    #chartsPage,
    #cahierCharges,
    #detailEvent {
        padding-left: 19.5rem !important;
    }
    #navLeft {
        min-width: 16.5rem;
        max-width: 235px !important;
    }
    #eventsList .text-overflow {
        max-width: 22vw;
    }
}

@media (max-width: 1199px) {
    #eventsList,
    #eventsLegend,
    #eventsStat,
    #statTable,
    #chartsPage,
    #cahierCharges,
    #detailEvent {
        padding-left: 10rem !important;
    }
    #navLeft {
        min-width: 8rem;
    }
    #eventsList .text-overflow {
        min-width: 15rem !important;
        width: 22vw !important;
    }
}

#naLeft ul {
    height: 24rem;
}

#eventTable_wrapper {
    max-height: 100%;
}

#greyStripe {
    background-color: #474F592E;
}

@media(max-width: 575px) {
    .notif-card .card-header {
        height: 4rem !important;
        margin: 0 2rem !important;
    }
    .notif-card .card-header div {
        height: 100%;
    }
    #eventsStat #accordionNotifs {
        height: 40rem;
    }
}

@media(min-width: 576px) {
    .dashboard-card {
        min-height: 24rem;
    }
    #greyStripe #eventsStat #accordionNotifs {
        height: 15rem;
    }
    #infos #eventsStat #accordionNotifs {
        height: 18rem;
    }
    #sideBarNumbersBuyer [id^="chartFactAndSavings"] .dashboard-card,
    #sideBarNumbersBuyer [id^="chartbudgetAndFact"] .dashboard-card {
        min-height: 15rem;
        height: 14.5vw;
        max-height: 24vh;
    }
    #sideBarNumbersBuyer [id^="chartRealCost"] .dashboard-card {
        min-height: 15rem;
        height: 14.5vw;
        max-height: 24vh;
    }
    #sideBarNumbersBuyer [id^="chartFactAndSavings"] .dashboard-card>div,
    #sideBarNumbersBuyer [id^="chartbudgetAndFact"] .dashboard-card>div {
        max-width: 28rem !important;
    }
    #sideBarNumbersBuyer [id^="chartRealCost"] .dashboard-card>div {
        max-width: 28rem !important;
    }
}

.dashboard-card {
    border: 1px solid #42B38F;
    border-radius: 0.5rem;
    background-color: white;
}

.dashboard-card div:first-of-type h3,
#chartsPage .dashboard-card h3:first-of-type,
.dashboard-card-title {
    color: #42B38F;
    font-family: 'Play', sans-serif;
    font-weight: bold;
    border-bottom: 1px solid #42B38F;
    height: 3.5rem !important;
    width: 90% !important;
}

#toolBar h4 {
    color: #474F59;
    font-size: 16px;
}

#toolBar a.active {
    background: #8F5099 0% 0% no-repeat padding-box;
    border: 1px solid #8F5099;
    border-radius: 10px;
    font-size: 13px;
}

#budget {
    width: 6rem;
}

#complementDemande .bootstrap-select {
    width: 10rem;
}

.nav-link.left {
    font-family: 'Play';
    color: #FFFFFF !important;
    font-size: 1.5rem;
    text-transform: uppercase;
}

.nav-link.left span {
    min-width: 10rem;
}

.nav-link.left::after {
    content: "\2303";
    display: inline-block;
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    color: #FFFFFF;
    width: 1.5rem;
    height: 1.5;
    line-height: 1.5;
    font-size: 1.5rem;
    font-weight: bolder;
    margin-left: auto;
    margin-top: auto;
    margin-bottom: auto;
}

.nav-link.left:focus,
.nav-link.left:hover,
.nav-link.left.active,
#navlist li:hover {
    font-family: 'Play';
    color: #42B38F !important;
    background-color: #FFFFFF;
    font-size: 1.5rem;
    text-transform: uppercase;
}

#navlist li {
    padding: 0 0 !important;
}

.nav-link.left:focus::after,
.nav-link.left:hover::after,
.nav-link.left.active::after {
    content: "\2303";
    display: inline-block;
    -webkit-transform: rotate(270deg) translateY(0.5rem);
    transform: rotate(270deg) translateY(0.5rem);
    color: #42B38F;
    width: 1.5rem;
    height: 1.5;
    line-height: 1.5;
    font-size: 1.5rem;
    font-weight: bolder;
    margin-left: auto;
}

.nav-item.left .nav-link {
    border-top: 0.2rem solid #FFFFFF;
}

.nav-item.left {
    height: 6rem;
}

.nav-item.left:last-of-type .nav-link {
    border-top: 0.2rem solid #FFFFFF;
    border-bottom: 0.2rem solid #FFFFFF;
}

.nav-item.left.active {
    background-color: #FFFFFF;
    color: #42B38F;
}

.modal-content {
    border-radius: 10px;
    border-color: #474F59;
    background-color: #FFFFFF;
}

.modal-header h2 {
    color: #42B38F;
    font-family: 'Play', sans-serif;
    font-weight: bold;
}

.modal-body {
    background-color: #42B38F33;
}

.bootstrap-tagsinput {
    height: 4rem;
    max-width: 100%;
    line-height: 1.5rem;
    cursor: text;
    box-shadow: none;
    background-color: rgba(255, 255, 255, 0);
}

#demandeProjet .bootstrap-tagsinput {
    height: 10rem;
    overflow: auto !important;
}

.modal-footer {
    background-color: #42B38F;
}

.modal-footer .btn {
    width: 100px;
}

.pac-container {
    z-index: 1051 !important;
}

#eventsList h4,
#eventsStat h4 {
    text-transform: uppercase;
    font-family: 'Play', sans-serif;
    font-weight: bold;
    font-size: 16px;
    color: #8F5099;
}

#eventsList .toolbar label {
    font-weight: bold;
}

#eventsList .toolbar a {
    color: #474F59;
    opacity: 1;
    font-size: 1.5em;
}

#eventsList .toolbar a.active {
    color: #474F59;
    opacity: 0.3;
    font-size: 1.5em;
}

#eventsList th.text-nowrap.text-center.green-text-large.border-bottom.border-top-0.border-success {
    letter-spacing: 1.76px;
    color: #42B38F;
    font-family: 'Lato', sans-serif;
    font-size: 11px;
    font-weight: bold;
    height: 2rem;
}

#eventsList tr {
    font-size: 13px;
}

#eventsList .table td {
    border-top: 5px solid #5EBE9F40 !important;
    padding-top: 0% !important;
    padding-bottom: 0% !important;
    padding-right: 20px !important;
    height: 2rem !important;
}

#eventsList .table tr {
    border-top: none !important;
}

#eventsList .table tr:first-of-type td {
    border-top: none !important;
}

#eventsList tr>td:first-of-type {
    font-weight: bold;
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:before,
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
    content: "" !important;
}

.editButtons {
    width: 60px;
}

button[id^="abandonner"] {
    background-color: rgba(255, 255, 255, 0) !important;
}

.yellow-cell {
    background-color: #FEDD35;
    border: 0.2rem solid #FFFFFF;
}

.blue-cell {
    background-color: #3DC9FF;
    border: 0.2rem solid #FFFFFF;
}

.orange-cell {
    background-color: #FFB404;
    border: 0.2rem solid #FFFFFF;
}

.green-cell {
    background-color: #30DE64;
    border: 0.2rem solid #FFFFFF;
}

.red-cell {
    background-color: #F94E48;
    border: 0.2rem solid #FFFFFF;
}

#eventsLegend li div {
    width: 6vw;
    max-width: 6rem;
    height: 1.5rem;
}

.black-text-condensed {
    font-weight: bold;
    font-stretch: condensed;
}

.form-control[readonly] {
    background-color: #fff;
}

.green-card {
    background-color: #FFFFFF99;
    border: 2px solid #42B38F;
    border-radius: 16px;
    margin: 1rem 0.5rem;
}

.bootstrap-select.form-control {
    height: auto;
    background-color: rgba(255, 255, 255, 0);
}

#accordionNotifs .notif-card .card-header div {
    background-color: rgba(255, 255, 255, 0) !important;
}

#accordionNotifs button div::after {
    height: 100% !important;
    display: inline-block;
    -webkit-transform: translateY(0.3rem);
    transform: translateY(0.3rem);
    content: "\2303";
    font-size: 1rem;
}

#accordionNotifs button.collapsed div::after {
    height: 100% !important;
    content: "\2303";
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    font-size: 1rem;
}

.badge-success {
    top: 0.4rem;
    right: 0.2rem;
    text-align: center;
    vertical-align: middle;
    width: 3rem;
    height: 3rem;
    line-height: 2rem;
    padding-top: 0.4rem;
    z-index: 2;
}

#eventsStat .badge-success {
    top: -2rem;
}

.news-card {
    border: 1px solid #42B38F;
    border-radius: 1.5rem 1.5rem 1.2rem 1.2rem;
}

.news-card .card-header {
    border: 1px solid #42B38F;
    border-radius: 1.2rem 1.2rem 0% 0%;
}

.notif-card .card-header {
    border: 1px solid #474F59;
    background-color: #FFFFFF;
    border-radius: 0.5rem !important;
    height: 1.7rem;
}

.notif-card .card-header button:hover {
    color: #FFFFFF !important;
    background-color: #42B38F !important;
}

.notif-card .card-body {
    max-height: 8rem;
}

[id^="badgeNew"] {
    cursor: pointer;
    bottom: 0rem;
    right: 1rem;
}

#sendDates {
    width: auto;
}

#dureeAcces {
    width: 4.5rem;
}

.modal-info .modal-body {
    background-color: #CFECE3;
}

#eventsStat div:first-of-type .dashboard-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#eventsDashboard #eventsStat div:first-of-type .dashboard-card:first-of-type div {
    max-width: 22rem !important;
    margin-left: auto;
    margin-right: auto;
    margin-top: auto;
}

#demandeProjet .bootstrap-tagsinput .badge {
    max-width: 100%;
    white-space: normal !important;
}

#eventTable_wrapper {
    width: calc(100% - 1rem) !important;
    max-width: calc(100% - 1rem) !important;
}