.login-account {
    width: 100%;
    min-height: 100vh
}

.login-title {
    margin-bottom: 10px !important
}

.type_compte_icon {
    margin-left: 10px;
    margin-right: 10px;
    cursor: pointer
}

.light.btn-primary g [fill] {
    fill: #fff !important
}

.type_compte_icon .mdi {
    font-size: 80px
}

.login-head {
    margin-top: 20px
}

.custom-label,
.custom-label2 {
    background-color: #fff;
    padding: 2px 5px;
    font-weight: 700;
    z-index: 99;
    transform: translate(-50%, -50%);
    margin-left: 5px;
    margin-top: -6px;
    box-shadow: 2px 2px 5px rgba(0, 0, 0, .3);
    font-size: 12px;
    position: absolute
}

.nav-header .brand-title {
    max-width: 10rem;
    display: block;
}

@media only screen and (max-width: 576px) {
    .nav-header .brand-title {
        max-width: 5.5rem;
    }
}

li.mm-active>a i {
    background: 0 0 !important;
    color: #0c2c4c !important
}

#DZ_W_Contacts_Body1 .user_info {
    margin-left: 10px
}

.deznav .metismenu>li a>i {
    width: auto
}

.chatbox .user_info p,
.chatbox .user_info span {
    text-overflow: visible !important;
    white-space: nowrap;
    overflow: visible !important;
    max-width: 170px
}

.email-list .message .col-mail-2 {
    left: 7.1rem !important
}

.deznav .metismenu ul a {
    padding: 5px 5px 5px 40px
}

.profile .profile-photo {
    margin-top: -15px
}

.custom-label {
    border-radius: 50%
}

.custom-label2 {
    border-radius: 0
}

.button-container,
.button-container:hover {
    background: linear-gradient(to bottom, #a3d179 0, #88ba46 100%)
}

.legend {
    padding: 5px
}

.legend img {
    vertical-align: middle
}

.legend-item {
    font-size: 12px
}

#infoModalLabel .profile-header,
#lieu-rencontre .profile-header,
#trajet-annule-ajax .profile-header {
    display: flex;
    align-items: center
}

#infoModalLabel .profile-info,
#lieu-rencontre .profile-info,
#trajet-annule-ajax .profile-info {
    display: flex;
    flex-direction: column;
    margin-left: 10px;
    padding: 0
}

#infoModalLabel .stars,
#lieu-rencontre .stars {
    margin-top: 5px
}

.covoiturage-trajet .form-check-input {
    width: 1.6rem;
    height: 1.6rem
}

.covoiturage-trajet .form-check-input:checked {
    background-color: #4d9d30;
    border-color: #4d9d30
}

.fc .fc-view-harness {
    width: 100% !important
}

.favorite-button i {
    color: #ccc;
    cursor: pointer
}

.favorite-button.favorited i {
    color: #f39c12
}

.message-single {
    padding-right: 5px
}

.message-single .bg-transparent {
    padding-right: 5px !important
}

.custom-badge {
    position: absolute;
    margin-top: 12px;
    right: 40px
}

@media only screen and (max-width:991px) {
    .fc .fc-view-harness {
        width: 100% !important
    }
}

.nav-header .logo-abbr {
    max-width: 1.6rem
}

@media only screen and (max-width:1400px) {
    .nav-header .logo-abbr {
        max-width: 1.6rem
    }
}

@media only screen and (min-width:48rem) {
    [data-sidebar-style=mini][data-layout=vertical] .deznav .metismenu>li.mm-active>a {
        background: 0 0;
        color: #fff
    }
}

.button-container {
    position: fixed;
    bottom: 30px;
    right: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 1.03125rem;
    transition: width .8s, background-color .8s;
    overflow: hidden;
    cursor: pointer;
    z-index: 1000
}

.button-container:hover {
    width: 180px
}

.button-container svg {
    width: 24px;
    height: 24px;
    fill: white;
    position: absolute;
    left: 10px;
    transition: left .8s
}

.button-container span {
    color: #fff;
    font-size: 15px;
    font-weight: 300;
    text-transform: uppercase;
    margin-left: 30px;
    opacity: 0;
    white-space: nowrap;
    transform: scale(.8);
    transition: opacity .8s, transform .8s
}

.button-container:hover span {
    opacity: 1;
    transform: scale(1)
}

#avis_form .star {
    font-size: 4em;
    color: gray;
    cursor: pointer
}

#avis_form .star.selected {
    color: gold
}

#avis_form input[type=radio] {
    display: none
}

.dataTables_info {
    text-align: center
}

.btn-danger {
    background-color: #ff4343
}

@media (max-width:576px) {
    .type_compte_icon i {
        font-size: 32px !important
    }

    .type_compte_icon span {
        font-size: 12px !important
    }

    .profile-interest .img-fluid {
        max-width: 40%
    }

    li.mm-active>a i {
        color: inherit !important
    }

    table.dataTable>tbody>tr.child ul.dtr-details {
        display: block
    }

    table.dataTable>tbody>tr.child span.dtr-title {
        padding-left: 90px
    }

    table.dataTable>tbody>tr.child ul.dtr-details>li {
        padding: 1em 0
    }

    .paging_simple_numbers.dataTables_paginate {
        text-align: center
    }
}

.profile-interest .img-fluid {
    max-width: 100%;
    height: auto
}

@media (max-width:1200px) {
    .profile-interest .img-fluid {
        max-width: 50%
    }
}

@media (max-width:992px) {
    .profile-interest .img-fluid {
        max-width: 60%
    }
}

@media (max-width:768px) {
    .custom-badge {
        margin-top: 2px;
        right: 34px;
        font-size: .75rem
    }

    .profile-interest .img-fluid {
        max-width: 50%
    }
}

.centered-image {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.btn.btn-info,
.btn.btn-primary,
.btn.btn-secondary,
.btn.btn-success {
    color: #fff;
    background: #0c2c4c !important
}

[data-sidebar-style=full][data-layout=vertical] .menu-toggle .nav-header .brand-title,
[data-sidebar-style=full][data-layout=vertical] .nav-header .brand-title {
    display: block;
    transition: opacity .2s ease-in-out;
    opacity: 1
}

.brand-title.icon-noir {
    transform: scale(.7) translateX(-10px)
}

.brand-title.fade-out {
    opacity: 0
}

.badge-warning{
background-color: #DC3545 !important;
}

.alert-danger{
background-color: #DC3545 !important;
color: #ffffff !important;
}

.alert-warning{
background-color: #DC3545 !important;
color: #ffffff!important;
}

.bg-dark {
background-color: #0C2C4C !important;
}

#payerCB{
border: 1px solid #ffffff !important;
}

.subject{
line-height: normal !important;
}
.preloader{
    display: none !important;
}