/* Importation de la police Open Sans */

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700,600,300,800);
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    transition: background-color 5000s ease-in-out 0s;
}

::selection {
    color: #fff;
    background: #cf0b5d;
}

::-moz-selection {
    color: #fff;
    background: #cf0b5d;
}

.relative {
    position: relative;
}
    
.marge14px {
    margin-bottom: 14px;
}

* {
    font-family: 'Lexend Deca', sans-serif;
    -webkit-font-smoothing: antialiased !important;
}

.tooltip-inner {
    white-space: nowrap;
    max-width: none;
}

.filterBtn {
    padding-left: 5px;
    padding-right: 5px;
}

html {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
}

button:focus,
input:focus,
select:focus,
textarea:focus {
    outline: 0;
}

input:required {
    box-shadow: none;
}

label {
    margin-bottom: 8px;
}

table tr,
table td {
    white-space: nowrap;
}

input[type='text'],
input[type='email'],
input[type='password'] {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

button,
html input[type='button'],
input[type='reset'],
input[type='submit'] {
    -webkit-appearance: button;
    appearance: button;
}

input[type='text'] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

input[type='button'],
input[type='submit'] {
    cursor: pointer;
}

input[type='search'] {
    -webkit-appearance: textfield;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    appearance: textfield;
}

input[type='search']::-webkit-search-cancel-button,
input[type='search']::-webkit-search-decoration {
    -webkit-appearance: none;
}

button,
input,
optgroup,
select,
textarea,
html input[type='button'],
input[type='reset'],
input[type='submit'],
button[disabled],
html input[disabled],
button::-moz-focus-inner,
input::-moz-focus-inner,
input[type='checkbox'],
input[type='radio'],
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button,
input[type='search'],
input[type='search']::-webkit-search-cancel-button,
input[type='search']::-webkit-search-decoration {
    border: none;
    background-image: none;
    background-color: transparent;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

input[type='text'] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

.navbar {
    padding: 8px !important;
    position: static !important;
    position: sticky !important;
    position: -webkit-sticky !important;
    position: -moz-sticky !important;
    position: -ms-sticky !important;
    position: -o-sticky !important;
    top: 0;
    background: white;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    -ms-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    -o-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}

.fixed-top {
    z-index: 12 !important;
}

.navbar.navbar-toggleable-md.navbar-light.bg-faded.fixed-top {
    background-color: #fff;
}

#demarcheSelector {
    display: flex;
    flex-direction: column;
}

#demarcheSelectorWrapper {
    display: flex;
    align-items: center;
    cursor: pointer;
}

#demarcheSelector img {
    width: 40px;
    height: auto;
    padding-right: 8px;
}

#demarcheSelectorDropdown {
    display: none;
    position: absolute;
    top: 60px;
    background: white;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
    cursor: pointer;
}

#demarcheSelectorDropdown a {
    display: block;
    color: #313131;
    text-decoration: none;
    padding: 8px 12px;
}

#demarcheSelectorDropdown a:hover {
    background: #eee;
}

.justify-content-center {
    justify-content: center;
}

.modal-body,
.modal-footer {
    background: white;
}

.modal-footer {
    display: flex;
    justify-content: flex-end;
    padding: 15px;
}

.modal-title {
    text-align: center;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .divDemarcheContainer {
        display: inline-block;
        width: 24.75%;
    }
}

#newTarifUtilisateur_btn {
    margin-top: 0 !important;
    cursor: pointer;
}

.titleH6 {
    display: flex;
    justify-content: center;
}

@media (max-width: 550px) {
    .titleH6 {
        text-align: center ;
    }
}

.highlight {
    color: #D10666;
}

.divDemarcheContainer {
    display: table;
    text-align: center;
    align-items: center;
    background: #fff;
    border: 1px solid #dedede;
    cursor: pointer;
    color: #313131;
    transition: 0.3s all ease-in-out;
}

.divDemarcheContainer:hover {
    border-color: #cf0b5d;
}

.divDemarcheContainerH {
    height: 60px;
}



.divDemarcheContainer a {
    color: inherit;
}
.divDemarcheContainerActif {
    background: #cf0b5d !important;
    color: white !important;
    border: none !important;
}

.divDemarcheContainerActif > a {
    color: white !important;
}


.demarcheContainer {
    background: white;
    border-radius: 15px;
    margin: 10px;
    transition: all 0.3s ease;
    width: 285px;
    text-align: center;
    position: relative;
    display: inline-block;
    vertical-align: top;
    padding: 10px 20px;
}

.demarcheContainerActif {
    background: #d64c70;
}

.demarcheContainer:hover {
    cursor: pointer;
    box-shadow: 0px 5px 10px 0px #00000021 !important;
    transform: translate(0px, -5px) !important;
}

.docPageMainHeader_menu_titre container h1 {
    color: black;
}



/* Section solution */

/* Solutions */

#solutions {
    display: flex;
    flex-direction: column;
    padding-top: 60px;
    padding-bottom: 60px;
    background-color: #F7F7F7;
  }
  
  #solutions h2 {
    color: #2F2E41 !important;
    text-align: center;
    font-size: 2.5rem;
    font-weight: 600;
    margin: 0 0 50px 0;
  }
  
  #solutions > div {
    width: -webkit-fill-available;
  
  }
  
  #solutions > div #liste-solutions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 60px;
    
  }
  
  /* gpt */
  #solutions div > #liste-solutions > .block-solution {
    display: flex;
    flex-direction: row;
    background-color: #FFFFFF;
    border: 1px solid #D4D4D4;
    border-radius: 24px;
    align-items: stretch; 
  }
  
  /* gpt */
  #solutions div > #liste-solutions > .block-solution > .block-left,
  #solutions div > #liste-solutions > .block-solution > .block-right {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding-left: 30px;
    align-items: flex-start;
  }
  /* fin gpt */
  
   #solutions div > #liste-solutions > .block-solution > .block-left{
   padding-bottom: 15px;
   
  } 
  
  
  #solutions div > #liste-solutions > .block-solution > .block-right{
    padding-left: 0 !important;
    
   } 
  
  
  #solutions div > #liste-solutions > .block-solution > .block-left > h1 {
    font-size: 3.5rem;
    font-weight: 600;
    text-decoration: none;
  }
  
  
  .subtxt {
    margin-top: -20px;
    margin-bottom: 30px;
    opacity: 0.7;
    font-weight: 600;
  }
  
  #solutions div > #liste-solutions > .block-solution > .block-left > a {
    display: flex;
    justify-content: center;
    font-size: 1.3rem;
    font-weight: 600;
    text-decoration: none;
    color: white;
    background-color: var(--rose-color);
    padding: 18px;
    border-radius: 12px;
    white-space: nowrap;
    box-shadow: rgba(207, 11, 93, 0.2) 0 3px 8px;
  
  }
  
  #solutions div > #liste-solutions > .block-solution > .block-left > p {
   opacity: 0.6;
   font-weight: 600;
   
  }
  
  #solutions div > #liste-solutions > .block-solution > .block-left > p > svg {
    height: 15px;
    width: 15px;
  }
  
  .txt-bottom{
    font-size: 1.3rem;
    margin-top: 50px;
  }
  
  #solutions div > #liste-solutions > .block-solution > .block-left > .liste-confiance {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    
  }
  
  .liste-confiance {
    gap: 10px;
  }
  
  #solutions div > #liste-solutions > .block-solution > .block-left > .liste-confiance > .confiance {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px;
    background-color: #FFFFFF;
    border: 1px solid #D4D4D4;
    border-radius: 10px;
  }
  
  #solutions div > #liste-solutions > .block-solution > .block-left > .liste-confiance > .confiance > img {
    
    width: 45px;
    height: 45px;
  }
  
  
  #solutions div > #liste-solutions > .block-solution > .block-right  img {
    position: relative;
    bottom: 0;
    width: auto;
    max-width: 100%;
    height: auto;
    object-fit: cover;
    margin-top: auto;
  }
  /* Fin solutions  */

/* FIn de Section solution */

/* Section étapes */



/* Fin section étapes */



/* Responsive Styles */
@media (max-width: 640px) {
    .container {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .demarcheContainer {
        align-content: center;
        width: 95%;
        margin: 10px 0;
    }

    .docPageMainHeader_menu_titre container {
        font-size: 20%;
        font-weight: 20%;
    }
}

@media (max-width: 470px) {
    .docPageMainHeader_menu_titre container {
        font-size: 1.2em;
        font-weight: 100;
    }
}


.texteDemarche {
   margin-top: 3px;
}

@media screen and (max-width: 493px) {
    .pictoDemarche {
        padding: 0px 0px !important;
        padding-top: 6px !important; 
    }

    .texteDemarche {
        display: flex;
        justify-content: center !important;
        align-content: center;
        align-items: center;
    }
}


@media (max-width: 325px) {
    .container {
        display: flex;
        flex-direction: column !important;
        align-items: center;
    }
}

#helpAreaTxtSaisieManuelle:hover {
    text-decoration: underline;
}

.pictoDemarche {
    text-align: center;
    position: relative;
    transition: 0.3s top ease-in-out;
    top: 0px;
    margin-bottom: 5px;
    padding-top: 6px !important;
}



#containerConnection {
    padding-left: 180px;
    padding-right: 180px;
}

@media screen and (max-width: 770px) {
    #containerConnection {
        padding-left: 5%;
        padding-right: 5%;
    }
}

.logo-side {
    float: left;
    margin-bottom: 5px;
}


.demarcheContainerActif {
    background: #d64c70;
}

.demarcheContainer:hover {
    cursor: pointer;
    box-shadow: 12px 12px 0px 1px rgb(0, 0, 0);
    transform: translate(-10px, -10px);
}

.docPageMainHeader_menu_titre container h1 {
    color: black;
}

@media (max-width: 640px) {
    .container {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .demarcheContainer {
        width: 100%;
        margin: 10px 0;
    }

    .docPageMainHeader_menu_titre container {
        font-size: 20%;
        font-weight: 20%;
    }
}

@media (max-width: 470px) {
    .docPageMainHeader_menu_titre container {
        font-size: 1.2em;
        font-weight: 100;
    }
}

@media (max-width: 325px) {

    .container {
        display: flex;
        flex-direction: column !important;
        align-items: center;
    }
}

@media (min-width: 769px) { 
    .correctPaddingDemandeDeDuplicata {
        padding-top:5px; padding-bottom:29px;
    }

    .correctPaddingDeclarationDachat {
        padding-bottom:33.5px;
    }

    .correctPaddingChangementDeNom {
        padding-bottom:31.5px;
    }

    .correctPaddingVehiculeDeCollection {
    padding-bottom:28.5px;
    }
}

@media (max-width: 450px) {

    .autrDemarcheCorrectionPadding {
        padding-top: 8px;
    }

   .texteDemarche {
        text-align: center;
        align-items: center;
        margin: 0 auto;
    }

    .titre {
        text-align: center;
        margin: 0 auto;
    }
    
    .container {
        flex-direction: column; 
    }

    .texteDemarche {
        font-weight: 800;
    }   
}

@media (max-width: 788px) {
    #docPageMainWrapper {
       /* display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important; */
        gap: 10px !important; 
        width: 100% !important;
        margin: 0 auto !important;
    }

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


    .mainIcon {
        display: none !important;
    }

    .pictoDemarche {
        display: none;
    }
    
    .demarcheContainer {
        min-width: 0; 
        box-sizing: border-box; 
        font-weight: 800 !important;
        padding: 20px 20px;
    }

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

    .pictoDemarcheC {
        display: none;
    }
    
    .texteDemarche span {
      padding-top: 0px;
    }

    .texteDemarche span {
        font-size: 1rem;
    }

    .titleH6 {
        font-size: 10px !important;
    }

    .docPageMainHeader_menu_titre {
        font-size: 20px !important;
    }
}


@media (max-width: 788px) {
    .texteDemarche span {
        font-size: 0.9rem;
    }
}

@media (max-width: 400px) {
    #docPageMainWrapper {
        width: 90% !important;
    }
}

#helpAreaTxtSaisieManuelle:hover {
    text-decoration: underline;
}

.pictoDemarche {
    text-align: center;
    position: relative;
    transition: 0.3s top ease-in-out;
    top: 0px;

}

#containerConnection {
    padding-left: 180px;
    padding-right: 180px;
}

@media screen and (max-width: 770px) {
    #containerConnection {
        padding-left: 5%;
        padding-right: 5%;
    }
}

#fullAcc2 .boxTitle,
#fullAcc2 .boxTitle b {
    font-size: 16px !important;
    font-weight: bold;
}

.example.flr {
    color: #cd0b5d !important;
    margin-left: 4px;
}

.webui-popover-acc2 {
    border-radius: 0px !important;
}

#titre_acc1_immat {
    cursor: pointer;
}

#fullAcc1 .acc-body {
    padding-bottom: 0px !important;
}

#modalSelectionAutreDemarche .modal-dialog {
    width: 800px;
    max-width: 90%;
    margin: auto;
    margin-top: 130px;
}

.pictoEtape2,
#pictoPanier {
    width: 50px;
}

#container-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 20px;
}

.modalAjoutICG {
    display: none;
}

.modalAjoutICG .modal-header {
    background-color: #cf0b5d;
    color: white;
}

tbody .form-control {
    border-radius: 0px !important;
}

.modalAjoutICG .modal-body .row .form-control {
    margin-bottom: 5px;
}

.modalAjoutICG .modal-body .row .control-label {
    padding-top: 5px;
}

.modalAjoutICG .modal-header h4 {
    margin: auto;
}

.modalAjoutICG .modal-footer button {
    cursor: pointer;
}

#aproposCoordonnees {
    margin-bottom: 30px;
}

.texteNormalEnGrisClair {
    color: #9d9d9d;
}

.sendMail {
    display: flex;
    justify-content: center;
    align-items: center;
}

.sendMail1 {
    background-color: #797979;
}

.sendMail2 {
    background-color: #797979;
}

.sendMail3 {
    background-color: #797979;
}

.sendMail4 {
    background-color: #797979;
}

.delete {
    background-color: #202020;
}

#searchUser,
#searchNomCommercant {
    position: absolute;
    width: calc(100% - 6px);
    background: white;
    z-index: 1;
    box-shadow: 0px 2px 3px 0px #8e8e8e;
}

#envoidoc-main-wrapper {
    min-height: calc(100vh - 328px);
    display: flex;
    align-items: center;
}

.searchUser-item,
.searchNomCommercantItem {
    width: 100%;
    padding: 8px 16px;
    cursor: pointer;
}

.searchUser-item:hover,
.searchNomCommercantItem:hover {
    background-color: #f1f1f1;
}

#paiementEffectue {
    border: 1px solid #535353;
    background-color: #fff;
    margin-right: 16px;
    font-family: inherit;
}

#notif-gestion {
    display: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
}

#notif-documents,
#notif-accuse {
    display: visible;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    position: absolute;
    right: 5px;
    top: calc(50% - 8px);
}

#notif-documents:hover {
    cursor: pointer;
}

.n-urgent {
    background-color: #cf085f;
    box-shadow: 0 0 10px 1px #cf085f;
}

.n-urgent-buraliste {
    background-color: #cf085f;
    box-shadow: 0 0 10px 1px #cf085f;
}

.blink_me {
    animation: blinker 0.5s linear infinite;
}

.btn-suivi-cg {
    box-shadow: inset 0px 1px 0px 0px #ee5798;
    background: linear-gradient(to bottom, #cf085f 5%, #cf085f 100%);
    background-color: #cf085f;
    border: 1px solid #cf085f;
    display: inline-block;
    cursor: pointer;
    color: #ffffff;
    font-family: Arial;
    font-size: 15px;
    font-weight: bold;
    padding: 6px 24px;
    text-decoration: none;
    text-shadow: 0px 1px 0px #cf085f;
}

.btn-suivi-cg:hover {
    background: linear-gradient(to bottom, #cf085f 5%, #ee5798 100%);
    background-color: #cf085f;
    color: white;
    text-decoration: none;
}

.btn-suivi-cg:active {
    position: relative;
    top: 1px;
}

@keyframes blinker {
    100% {
        opacity: 0;
    }
}

.cn-urgent {
    background-color: #ee9400 !important;
    transition: all 0.2s ease-in-out;
    color: white;
}

.cn-urgent-buraliste {
    background-color: #ee9400 !important;
    transition: all 0.2s ease-in-out;
    color: white;
}

.n-important {
    background-color: #ffb452;
    box-shadow: 0 0 10px 1px #ffb452;
}

.commentaire {
    padding: 8px;
    resize: none;
    width: calc(100% - 32px);
    height: 100px;
    font-family: inherit;
    line-height: 20px;
    box-shadow: 1px 1px 2px 0px #0000005e;
    box-sizing: border-box;
}

.commentaireClient {
    padding: 8px;
    resize: none;
    width: calc(100% - 64px);
    height: 100px;
    font-family: inherit;
    line-height: 20px;
    box-shadow: 1px 1px 2px 0px #0000005e;
    box-sizing: border-box;
}

.borderErrorDemarche {
    border: 2px solid #cf085f !important;
    border-radius: 4px;
    padding: 5px;
}

.texteDemarche {
    width: 100%;
}

#paiementEffectue:hover {
    background-color: #dedede;
}

.etatPaiement {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#partenairePageMainHeader {
    background-image: url(/../../images/partenaire_bg.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#aproposPageMainHeader {
    background-image: url(https://images.pexels.com/photos/323705/pexels-photo-323705.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940);
    height: 180px;
    background-size: cover;
    background-position: center;
}

.changementTitulairePre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementtitulaireSuccess.png) !important;
}

.changementDomicilePre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementdomicileSuccess.png) !important;
}

.acteCessionPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/enregistrementactecessionSuccess.png) !important;
}

.ficheIdentificationPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/ficheidentificationSuccess.png) !important;
}

.vehiculeNeufPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculeneufSuccess.png) !important;
}

.premiereImmatPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/1ereimmat50Success.png) !important;
}

.modifTechniquePre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/modificationtechniqueSuccess.png) !important;
}

.vehiculeImportePre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculeimporteSuccess.png) !important;
}

.declarationAchatPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/declarationachatSuccess.png) !important;
}

.changementAdresseVehiculeLouePre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementadressseSuccess.png) !important;
}

.vehiculeCollectionPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculecollectionSuccess.png) !important;
}

.changementNomPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementnomSuccess.png) !important;
}

.vehciuleImmatAvant90Pre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculeimmatavant90Success.png) !important;
}

.immatTemporairePre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/immatriculationtemporaireSuccess.png) !important;
}

.demandeDuplicataPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/demandeduplicataSuccess.png) !important;
}

.banniereIfcSuccessPre {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/finalisationCommandeIfc.png) !important;
}

.changementTitulaire {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementtitulaireSuccessFin.png) !important;
}

.changementDomicile {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementdomicileSuccessFin.png) !important;
}

.acteCession {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/enregistrementactecessionSuccessFin.png) !important;
}

.ficheIdentification {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/ficheidentificationSuccessFin.png) !important;
}

.vehiculeNeuf {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculeneufSuccessFin.png) !important;
}

.premiereImmat {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/1ereimmat50SuccessFin.png) !important;
}

.modifTechnique {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/modificationtechniqueSuccessFin.png) !important;
}

.vehiculeImporte {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculeimporteSuccessFin.png) !important;
}

.declarationAchat {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/declarationachatSuccessFin.png) !important;
}

.changementAdresseVehiculeLoue {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementadressseSuccessFin.png) !important;
}

.vehiculeCollection {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculecollectionSuccessFin.png) !important;
}

.changementNom {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/changementnomSuccessFin.png) !important;
}

.vehciuleImmatAvant90 {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/vehiculeimmatavant90SuccessFin.png) !important;
}

.immatTemporaire {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/immatriculationtemporaireSuccessFin.png) !important;
}

.demandeDuplicata {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/demandeduplicataSuccessFin.png) !important;
}

.banniereIfcSuccess {
    background-image: url(https://icicartegrise.fr/mail/imagesCommunes/finalisationCommandeIfcFin.png) !important;
}

#successPageMainHeader {
    background-image: url(/../../images/test7.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#newsPageMainHeader {
    background-image: url(/../../images/newsICG.png);
    height: 180px;
}

#mentionsPageMainHeader {
    background-image: url(/../../images/test5.jpg);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#contactPageMainHeader {
    background-image: url(/../../images/test4.png);
    height: 180px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

#faqPageMainHeader {
    background-image: url(/../../images/faqHeaderBackground.jpg);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#backofficePageMainHeader {
    background-image: url(/../../images/gestionnaire_bg.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#backofficePageMainHeader2 {
    background-image: url(/../../images/Group4.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#boxPageMainHeader {
    background-image: url(/../../images/headerBackground.png);
    height: 160px;
}

 #docPageMainHeader {
   /* // background-image: url(/../../images/test3.png);
  //  background-size: cover; */
  background-color: #f2f2f2;
} 

#errorPageMainHeader {
    background-image: url(/../../images/test9.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#cancelPageMainHeader {
    background-image: url(/../../images/test9.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#refusedPageMainHeader {
    background-image: url(/../../images/test9.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#lieuVentePageMainHeader {
    background-image: url(/../../images/bg_header_cg.png);
    height: 180px;
    background-size: cover;
    background-position: center;
}

#faqPageSecondaryHeader {
    background-color: #cf0b5d;
    padding-bottom: 30px;
}

#secondaryHeader_contact,
#secondaryHeader_box,
#secondaryHeader_partenaire,
#secondaryHeader_faq,
#secondaryHeader_mentions {
    background-color: #cf0b5d !important;
    padding-bottom: 15px !important;
    padding-top: 15px !important;
}

#secondaryHeader_apropos {
    display: flex;
    justify-content: center;
    color: black;
    background-color: #cf0b5d !important;
}

#secondaryHeader_faq {
    margin-bottom: 0px;
}

.btn_footer.white:hover {
    cursor: pointer;
    background-color: #ddd;
}

.btn_footer.rose:hover,
#btn_commanderMonPass_homePage:hover {
    cursor: pointer;
    background-color: #863e5d;
}

#btn_nosPointsDeVente:hover {
    cursor: pointer;
    text-decoration: underline;
}

#secondaryHeader_partenaire textarea,
#secondaryHeader_partenaire input[type='email'],
#secondaryHeader_partenaire input[type='password'],
#secondaryHeader_partenaire input[type='text'] {
    max-width: 75%;
    margin: auto;
}

#secondaryHeader_partenaire input[type='submit'] {
    width: 120%;
    margin-left: -10%;
}

#secondaryHeader_partenaire .btn-vmv {
    border-radius: 30px;
}

#partenaire_connexion {
    background-color: white;
}

#partenaire_inscription {
    background-color: #f2f2f2;
}

#partenaire_connexion,
#partenaire_inscription {
    text-align: center;
    padding-top: 30px;
    padding-bottom: 30px;
}

#partenaire_connexion h4,
#partenaire_inscription h4 {
    font-weight: bold;
}

.contactPage .contactPageEnvoyer {
    max-width: 350px;
    border-radius: 30px;
    font-weight: bold;
    font-size: 16px;
}

.contactPage a {
    color: #292b2c;
}

#faqPageSecondaryHeader img {
    padding-bottom: 15px;
}

#docPageSecondaryHeader_faq_illustration,
#docPageSecondaryHeader_box_illustration,
#docPageSecondaryHeader_titulaire_illustration {
    width: 130px;
    position: absolute;
    top: -10px;
    right: 0;
}

#docPageSecondaryHeader_faq_illustration {
    width: 200px;
}

#docPageMainHeader_image {
    width: 30%;
    float: left;
}

#docPageMainHeader_image img {
    height: 250px;
    margin-top: 25px;
}

#docPageMainWrapper {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.divDemarche {
    display: flex;
    flex-direction: column !important;
}

#docPageMainHeader .divDemarcheContainer {
    width: 200px;
    margin-bottom: 32px;
}
.containerPiece {
    flex-wrap: wrap;
}
.panier_item {
    margin-bottom: 8px;
}

.pt25 {
    padding-top: 25px;
}

.nopadding {
    padding: 0px !important;
}

.etape_inactive {
    color: #cccccc;
}

.etape_attente {
    color: #337ab7;
    font-weight: bold;
}

.etape_defaut {
    color: #f0ad4e;
    font-weight: bold;
}

.etape_erreur {
    color: #f0ad4e;
    font-weight: bold;
}

.etape_abandon_commande {
    color: #d9534f;
    font-weight: bold;
}

#divSupprCommande {
    text-align: center;
    color: red;
    font-weight: bold;
    font-size: 12px;
    cursor: pointer;
    margin-bottom: 10px;
}

#commandeProgressBar .progress {
    border-radius: 0px !important;
}

#divSearchNom button,
#divSearchSerie button {
    border-radius: 0px !important;
}

#searchNom {
    width: 200px;
    display: inline-block;
    border-radius: 0px !important;
}

#searchSerie {
    width: 300px;
    display: inline-block;
    border-radius: 0px !important;
}

@-moz-document url-prefix() {
    #helpAreaInputPlaque {
        font-size: 15px !important;
    }
}

@media screen and (min-width: 991px) {
    #btnEnvoieMailManuel {
        width: 400px !important;
    }

    .hiddenOnDesktop {
        display: none !important;
    }
}

@media screen and (max-width: 991px) {
    /* .hiddenOnMobile {
    display: none !important;
  } Léo */
    #docPageMainHeader_menu {
        width: 100%;
    }

    #docPageMainHeader_image,
    #docPageSecondaryHeader_faq_illustration,
    #docPageSecondaryHeader_faq_illustration,
    #docPageSecondaryHeader_titulaire_illustration {
        display: none;
    }

    .pieceDetails {
        max-width: 80% !important;
    }

    #logoAccueil {
        height: 350px !important;
    }

    .texteDemarche {
        font-size: 14px;
        margin-top: 5px;
        width: 100% !important;
    }
}

@media screen and (max-width: 605px) {

    .texteDemarche {
        font-size: 12px;
    }
}

@media screen and (max-width: 405px) {

    .texteDemarche {
        font-size: 10px;
    }
}


.fas_sectionTitle {
    margin-bottom: 30px;
}

.fas_sectionTitle h3 {
    font-size: 26px;
}

.col-md-6 > .faq_icone {
    color: #cd0a5d;
    vertical-align: top;
    width: 10%;
    display: inline-block;
    font-size: 36px;
    margin-right: 10px;
}

.col-md-12 > .faq_icone {
    color: #cd0a5d;
    vertical-align: top;
    width: 5%;
    display: inline-block;
    font-size: 36px;
    margin-right: 10px;
}

.col-md-6 > .faq_texte {
    width: 80%;
    display: inline-block;
}

.col-md-12 > .faq_texte {
    width: 90%;
    display: inline-block;
}

.contactLieux,
.contactHorairesTitre,
.contactHorairesTexte {
    text-align: left;
    font-family: inherit, sans-serif;
}

.contactLieux {
    display: inline-block;
    margin-bottom: 20px;
    font-size: inherit;
}

.contactHoraires {
    padding-bottom: 10px;
    padding-top: 0px;
}

.contactPadding {
    padding-top: 18.5px;
}

.contactHorairesTitre {
    color: #cd0a5d;
}

#ggmap {
    margin-top: 25px;
    width: 400px;
}

@media (max-width: 640px) {
    .contactHoraires {
        margin-left: 0px;
        margin-right: 0px;
    }

    .contactLieux {
        margin-left: 0px;
    }
}

.faq_texte .faq_titre {
    font-weight: bold;
    margin-bottom: 10px;
    text-transform: uppercase;
}

#mail-status,
#devenirPartenaire_mail-status {
    border: 1px solid green;
    padding: 10px;
    background-color: limegreen;
    border-radius: 10px;
    color: white;
    font-weight: bold;
    text-align: center;
}

#devenirPartenaire_mail-status,
#connexion_mail-status {
    width: 75%;
    margin: auto;
    margin-top: 10px;
}

#disconnectDiv {
    display: inline-block;
    margin-left: 10px;
    padding-left: 10px;
    color: #cd0a5d;
    cursor: pointer;
}

#disconnectDiv:hover {
    text-decoration: underline;
}

#faqPageSecondaryHeader h1,
#faqPageSecondaryHeader h2,
#faqPageSecondaryHeader h3,
#secondaryHeader_contact h1,
#secondaryHeader_contact h2,
#secondaryHeader_contact h3,
#secondaryHeader_partenaire h1,
#secondaryHeader_partenaire h2,
#secondaryHeader_partenaire h3,
#secondaryHeader_box h1,
#secondaryHeader_box h2,
#secondaryHeader_box h3,
#secondaryHeader_apropos h1,
#secondaryHeader_apropos h2,
#secondaryHeader_apropos h3,
#secondaryHeader_mentions h1,
#secondaryHeader_mentions h2,
#secondaryHeader_mentions h3,
#secondaryHeader_faq h1,
#secondaryHeader_faq h2,
#secondaryHeader_faq h3,
#docPageSecondaryHeader_box h1,
#docPageSecondaryHeader_box h2,
#docPageSecondaryHeader_box h3,
#docPageSecondaryHeader_titulaire h1,
#docPageSecondaryHeader_titulaire h2,
#docPageSecondaryHeader_titulaire h3,
#docPageSecondaryHeader_faq h1,
#docPageSecondaryHeader_faq h2,
#docPageSecondaryHeader_faq h3,
#docPageSecondaryHeader_domicile h1,
#docPageSecondaryHeader_domicile h2,
#docPageSecondaryHeader_domicile h3,
#docPageSecondaryHeader_situationsParti h1,
#docPageSecondaryHeader_situationsParti h2,
#docPageSecondaryHeader_situationsParti h3 {
    color: white;
}



#faqPageSecondaryHeader h1,
#secondaryHeader_apropos h1,
#secondaryHeader_faq h1,
#secondaryHeader_partenaire h1,
#secondaryHeader_mentions h1,
#secondaryHeader_contact h1 {
    font-weight: bold;
}

#faqPageSecondaryHeader .content {
    text-align: center;
    margin: auto;
}

#faqPageSecondaryHeaderPicture {
    margin-top: -50px;
    height: 130px;
    width: auto;
}

#faqGrayDiv,
.faqGrayDiv {
    background-color: #ebebec;
    padding-top: 50px;
    padding-bottom: 50px;
}

#faqWhiteDiv,
.faqWhiteDiv {
    background-color: #fff;
    padding-top: 50px;
    padding-bottom: 50px;
}

.btn_lieu_white {
    color: #d10666;
    background-color: white;
    padding: 5px;
    width: 250px;
    margin: auto;
    text-align: center;
    font-weight: bold;
    margin-bottom: 5px;
    border-radius: 5px;
    cursor: pointer;
}

.btn_lieu_white:hover {
    background-color: #ddd !important;
}

.texteNormalAccentueEnRose,
.texteNormalAccentueEnRose a {
    font-weight: bold;
    color: #cf0b5d !important;
}

.pieceAFournir {
    margin-top: 25px;
    width: 100%;
}

.pieceNumero {
    float: left;
    margin-right: 10px;
    font-size: 36px;
    color: #cf0b5d;
}

.pieceDetails {
    float: left;
    margin-top: 8px;
    max-width: 90%;
}

.pieceTitle {
    font-weight: bold;
    font-size: 24px;
}

.pieceDesc .fa-chevron-right {
    color: #cf0b5d;
}

.pieceSubTitle {
    font-weight: bold;
    color: #cf0b5d;
}

.pieceDesc {
    margin-top: 10px;
}

.pieceDesc_chevron {
    float: left;
    width: 5%;
}

.pieceDesc_chevronText {
    float: left;
    width: 80%;
}

#pagePieceAFournirTriangle {
    font-size: 70px;
    color: #d4246e;
    float: left;
    margin-left: -100px;
}



.trianglePagePiecesAFournirTriangle {
    font-size: 50px;
    color: #d4246e;
    display: inline-block;
    margin-left: -100px;
}

.docPageMainHeader_menu_titre {
    color: #fff;
    font-size: 36px;
    padding-top: 40px;
    padding-bottom: 16px;
}

.docPageMainHeader_menu_item {
    cursor: pointer;
    padding: 5px;
    padding-left: 20px;
    font-weight: bold;
    border-radius: 5px;
    color: #cf0b5d;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
    margin: 10px;
    background-color: white;
    max-width: 500px;
}

.docPageMainHeader_menu_item svg {
    float: right;
    margin-top: 5px;
}

.docPageMainHeader_menu_item.activate {
    color: #ddd !important;
    cursor: default !important;
}

#docPageMainFooter_menu {
    background-color: #cf0b5d;
    padding-top: 20px;
    padding-bottom: 20px;
    margin-top: 70px;
}

#docPageSecondaryHeader_box,
#docPageSecondaryHeader_faq,
#docPageSecondaryHeader_titulaire,
#docPageSecondaryHeader_domicile,
#docPageSecondaryHeader_situationsParti {
    padding-top: 50px;
    background-color: #cf0b5d;
    padding-bottom: 50px;
}

#docPageSecondaryHeader_box h1,
#docPageSecondaryHeader_faq h1,
#docPageSecondaryHeader_titulaire h1,
#docPageSecondaryHeader_domicile h1,
#docPageSecondaryHeader_situationsParti h1 {
    font-size: 36px;
}

#docPageSecondaryHeader_box h2,
#docPageSecondaryHeader_faq h2,
#docPageSecondaryHeader_titulaire h2,
#docPageSecondaryHeader_domicile h2,
#docPageSecondaryHeader_situationsParti h2 {
    font-size: 20px;
}

.infoEnvoiDoc {
    height: 20px;
}


.pieceTitle {
    display: flex;
    align-items: center;
}

.pieceTitle .example {
    font-size: 15px;
    display: inline-block; 
    margin-left: 20px;
    cursor: pointer;
    color: #0275d8;
    font-weight: normal;
    white-space: nowrap; 
    flex-shrink: 0; 
}

.pieceTitle .example:hover {
    color: #014c8c;
    text-decoration: underline;
}
/* Media query pour masquer le texte à 500px ou moins */
@media (max-width: 500px) {
    .pieceTitle .example {
        font-size: 10px;
    }
}


.popoverDocument a {
    width: auto;
    height: auto;
}

.popoverDocument img {
    width: 320px;
}

#homePage .btn-vmv.btnOkBox {
    border-radius: 0px;
    height: 45px;
    width: 50px;
    cursor: pointer;
}

#payCardWrapper {
    max-width: 500px;
    margin: 0 auto;
    background-color: #fff;
}

.inputLabel {
    margin-bottom: 8px;
    margin-top: 16px;
    color: #555555;
}

.infoBlock {
    width: 100%;
    border: 1px solid #dedede;
    background: #fff;
    font-family: inherit;
    padding: 8px 16px;
}

.active {
    border: 2px solid #cf0b5d !important;
}

.radio_select {
    transition: border 0.3s ease-in-out;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #eee;
    background-color: #fff;
    cursor: pointer;
    height: 42px;
}

.radio_select:hover,
.radio_select:focus,
.radio_select:active {
    border-color: #cf0b5d;
}

.radio_select input {
    height: 0px;
    width: 0px;
    visibility: collapse;
}

#acc_4_sexe,
#acc_4_lieu_naissance {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 16px;
}

#acc_4_extension {
    width: 100%;
    height: 42px;
    border: 1px solid #dedede;
    font-family: inherit;
}

#acc_4_sexe_f:checked {
    background: #cd0a5d;
}

#container-gestion {
    background: #f1f1f1;
    position: sticky;
    top: 124px;
    z-index: 2;
    box-shadow: 1px 1px 2px 0px #0000005e;
}

#container-gestion-buraliste {
    background: #f1f1f1;
    top: 109px;
    z-index: 2;
    box-shadow: 1px 1px 2px 0px #0000005e;
    padding-left: 0;
    padding-right: 0;
}

.readonlyInput {
    width: 100%;
    border: none;
    background: inherit;
    font-family: inherit;
    color: inherit;
}

#prixCommande {
    color: #cf0b5d;
    font-weight: bold;
}

#idTransactionCopy {
    display: inline-block;
    position: absolute;
    right: 4px;
    cursor: pointer;
}

.pieceAFournir.expections {
    border: 1px solid #cf0b5d;
    border-radius: 20px;
    padding: 20px;
    width: 100%;
}

.texteAvecUnChevron {
    margin-left: 30px;
}

.texteAvecUnRond svg,
.texteAvecUnChevron svg {
    color: #cf0b5d;
    margin-right: 4px;
}

.actualiteEnCoursContainer .row {
    margin-top: 40px;
    margin-bottom: 30px;
}

.actualiteEnCoursContainer {
    border-bottom: 5px solid #cf0b5d;
}

.actualiteEnCoursContainer img {
    max-width: 100% !important;
}

#divArticle img,
.actualiteEnCoursContainer img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    max-height: 100% !important;
    margin-bottom: 10px;
}

.voirPlusArticleBtn {
    background-color: #cf0b5d;
    color: white;
    width: 300px;
    margin: auto;
    margin-bottom: 20px;
    padding: 10px;
    border-radius: 5px;
    cursor: pointer;
}

.voirPlusArticleBtn:hover {
    font-weight: bold;
}

.divImgActu,
.imgApercu {
    height: 130px;
    width: 100%;
    height: auto;
    margin-bottom: 20px;
    background-repeat: no-repeat;
    background-size: 100px;
    background-size: cover;
    background-position: top;
    border: 1px SOLID GRAY;
}

.imgApercu {
    height: auto;
    max-height: 130px;
    object-fit: cover;
}

.divImgActu {
    height: 130px;
}

#divArticle {
    margin-bottom: 50px;
    margin-top: 20px;
}

#divPictoTexte1,
#divPictoTexte4 {
    padding-top: 15px;
}

#divPictoTexte1,
#divPictoTexte2,
#divPictoTexte3,
#divPictoTexte4 {
    min-width: 150px;
}

#divPictoImage4 {
    padding-top: 10px;
}

@media screen and (max-width: 768px) {
    #logoSidebar {
        display: none !important;
    }

    #divArticle img {
        width: 100% !important;
        margin-bottom: 20px;
    }

    .col-md-6 > .faq_icone,
    .col-md-12 > .faq_icone {
        width: 10%;
        margin-right: 0;
    }

    .col-md-6 > .faq_texte,
    .col-md-12 > .faq_texte {
        width: 78%;
        margin-bottom: 20px;
        word-wrap: break-word;
    }

    .removeBrInMobileDiv br {
        display: none;
    }

    #texteDroiteImage {
        padding-top: 50px;
    }

    .hiddenInMobile {
        display: none !important;
    }

    .centerInMobile {
        text-align: center;
    }

    #divPicto1,
    #divPicto2,
    #divPicto3,
    #divPicto4 {
        margin-top: 5px;
        margin-bottom: 5px;
    }

    #docPageSecondaryHeader_faq h1 {
        font-size: 26px;
    }

    #docPageSecondaryHeader_faq h2 {
        font-size: 18px;
    }

    #docPageSecondaryHeader_faq {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    #boutonSuiviCG {
        flex-direction: column-reverse;
        align-items: center;
        gap: 16px;
    }
}

@media screen and (max-width: 450px) {
    .col-md-6 > .faq_icone,
    .col-md-12 > .faq_icone {
        margin-right: 10px;
    }
}

@media screen and (max-width: 350px) {
    .col-md-6 > .faq_icone,
    .col-md-12 > .faq_icone {
        margin-right: 20px;
    }
}

#raz:hover {
    background: #940742;
}

#raz {
    margin-left: 5px;
    cursor: pointer;
    font-family: 'Lexend Deca', sans-serif;
    text-transform: uppercase;
    color: white;
    background: #cf0b5d;
    border: none;
}

#logo {
    max-width: 160px;
}

hr.noBorder {
    border: 0;
    margin: 5px;
}

#imgFlyer {
    height: 100%;
}

#imgFlyerContainer {
    text-align: center;
    height: 70%;
    margin-top: 50px;
}

#verificationBoxContainer {
    text-align: right;
}

.headerFirstRow {
    background-image: url('/../../images/homepageHeaderBackground.jpg');
}

.header-gris {
    background-color: #f3f3f3;
}

.header-blanc {
    background-color: #fff;
    padding-bottom: 20px;
    padding-top: 20px;
}

#imgCGInfo {
    height: 100px;
}

#info-covid {
    position: relative;
    display: flex;
    justify-content: center;
    background-color: #cf0b5d33;
}

#info-covid span {
    padding: 16px;
}

#close-info-covid {
    position: absolute;
    right: 0;
    cursor: pointer;
}

#premierBandeauGaucheTop {
    margin-top: 80px;
    text-align: center;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

#premierBandeauGaucheTop h1 {
    font-family: inherit;
    font-size: 26px;
    line-height: 40px;
    font-weight: 900;
}

#premierBandeauGaucheTop h3 {
    display: inline;
    color: #cf0b5d;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans',
        'Helvetica Neue', sans-serif;
    font-size: 33px;
    font-weight: bold;
}

#premierBandeauDroiteTop {
    text-align: center;
}

#premierBandeau {
    max-width: 1180px;
}

.maxWidth1180 {
    max-width: 1180px;
}

#secondBandeau {
    padding-top: 20px;
    padding-bottom: 20px;
    background-color: #f0f0f0;
    text-align: center;
    max-width: 1180px;
}

#secondBandeau img {
    width: 75px;
}

.btn_accueil {
    color: #ffffff;
    background: #cf0b5d;
    cursor: pointer;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans',
        'Helvetica Neue', sans-serif;
}

.btn_accueil2 {
    color: #cf0b5d;
    background: #ffffff;
    cursor: pointer;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans',
        'Helvetica Neue', sans-serif;
}

.traitSousTitre.rose {
    border-color: #d10666;
}

.traitSousTitre {
    width: 200px;
    height: 1px;
    border-style: solid;
    border-width: 2px;
    margin: auto;
    margin-top: 65px;
    margin-bottom: 20px;
}

.alignCenter {
    text-align: center;
}

#imgMethode2 {
    width: 70%;
    color: #ddd;
    margin-bottom: 10px;
}

.titreBandeauTop {
    padding-top: 26px;
    text-align: center;
}

.titreBandeauTop h2 {
    font-size: 26px;
    padding-top: 26px;
}

.fontFamilyHome {
    padding-right: 10px;
    padding-left: 10px;
}

.row {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.nav-item {
    background-color: #705b64;
    border-radius: 6px;
    margin-left: 20px;
    margin-right: 20px;
    margin-top: 3px;
    transition: background-color 1s;
}

.nav-item:hover {
    background-color: #ea076b;
}

.nav-link {
    color: white !important;
    text-align: center;
}

.nav-hamburger {
    z-index: 1;
}

.paragraph__head {
    color: black;
}

#info-prix {
    position: relative;
    display: inline-flex;
    align-items: center;
    color: black;
}

#info-prix-show {
    opacity: 0;
    position: absolute;
    white-space: nowrap;
    color: #2f2f2f;
    font-size: 15px;
    background: #fff;
    padding: 2px 16px;
    margin-left: 16px;
    left: -140px;
    bottom: -50px;
    box-shadow: 1px 2px 6px 0px #00000040;
    transition: opacity 0.2s ease-in-out;
}

#kits-icg {
    max-width: 200px;
    margin: 50px 0px;
    width: 100%;
    height: 100%;
}

#info-prix-val {
    color: #cf0b5d;
    border-bottom: 2px solid #cf0b5d;
    padding: 4px;
}

.flex_container {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: flex-end;
    align-content: center;
    height: 100%;
}

#home_zoneBlanche {
    padding-top: 40px;
}

#home_zoneGrise {
    background-color: #ebebeb;
    padding-top: 80px;
    margin-top: -50px;
}

#home_zoneRose {
    background-color: #d10666;
    padding-bottom: 20px;
    padding-top: 40px;
}

#flux {
    padding-top: 50px;
}

#home_zoneFooter {
    background-color: #000;
    border-top: 4px solid #cf0b5d;
}

.flux_title {
    font-weight: bold;
}

#home_title {
    font-size: 26px;
    text-align: center;
}

#home_title.rose {
    color: #d10666;
}

#home_title.gris {
    color: #393939;
}

#home_title.blanc {
    color: #fff;
}

.traitSousTitre {
    width: 200px;
    height: 1px;
    border-style: solid;
    border-width: 2px;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 20px;
}

.traitSousTitre.rose {
    border-color: #d10666;
}

.traitSousTitre.blanc {
    border-color: white;
}

.traitsPointillesADroite {
    border-right: 2px #8c8e8f dashed;
}

.titreCommercant {
    color: white;
    font-weight: bold;
    text-align: center;
    font-size: 20px;
}

.sousTitreCommercant {
    margin-top: 10px;
    color: white;
    font-size: 16px;
    text-align: center;
}

.verticalAlign {
    display: table-cell;
    vertical-align: middle;
}

.imgCommercant,
.imgCommercant2 {
    text-align: center;
    padding: 16px;
}

.imgCommercant img {
    height: 84px;
    margin-bottom: 20px;
}

.imgCommercant2 img {
    height: 64px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.kit {
    display: flex;
}

.img-kit {
    height: 100px;
    width: auto;
    user-select: none;
    -webkit-user-drag: none;
}

.select-kit {
    margin-left: 32px;
}

#middle-kit {
    border-style: solid;
    border-width: 0px 1px;
    border-color: #dedede;
}

#error-kit {
    display: none;
    color: #ff1e00;
    background-color: #ffcbc4;
}

#success-kit {
    display: none;
    color: #148d14;
    background-color: #dfffdf;
}

#load {
    display: none;
}

.imgMini {
    width: 40px;
    padding-bottom: 10px;
}

.divAccueilImg {
    background-image: url('../images/logo_accueil.png');
}

.btnMediumRose {
    background-color: #cf0b5d !important;
    color: rgb(238, 238, 238) !important;
    text-align: center;
    padding: 10px 15px;
    font-size: 24px;
    vertical-align: middle;
    margin-top: 10px;
    border-color: #cf0b5d;
    border-style: solid;
    border-width: 2px;
    display: inline-block;
}

.btnMedium {
    background-color: #cf0b5d !important;
    color: rgb(238, 238, 238) !important;
    text-align: center;
    width: 100%;
    padding: 10px;
    font-size: 24px;
    vertical-align: none;
    margin-top: 10px;
}

.btnMedium:active .imgMini,
.btnMedium:hover .imgMini {
    content: url('../images/picto_panierb.png');
}

.btnOuiNon {
    border-color: #fff !important;
    border-style: solid !important;
    border-width: 3px !important;
    width: 45% !important;
}

.PsousTitre {
    padding-top: 15px;
    font-size: 20px;
    text-align: center;
    font-weight: 800;
}

.pink {
    color: #cf0b5d;
}

.Pdescription {
    padding-top: 15px;
    font-size: 20px;
    line-height: 21px;
}

.pieceDesc,
#icgCestQuoiTexte {
    font-size: 16px;
}

.titre-accueil-h3 {
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
    line-height: 24px;
}

#icgDevenirPartenaire {
    background-color: #202020;
    padding-bottom: 48px;
}

#btn_devenirPartenaire_homePage {
    color: #fff;
    background-color: #cf0b5d;
    padding: 5px;
    width: 250px;
    margin: auto;
    text-align: center;
    font-size: 21px;
    margin-top: 10px;
    margin-bottom: 50px;
    position: relative;
    cursor: pointer;
}

#btn_devenirPartenaire_homePage::before {
    content: '';
    position: absolute;
    width: 100%;
    margin-bottom: 4px;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: white;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

#btn_devenirPartenaire_homePage:hover::before {
    visibility: visible;
    -webkit-transform: scaleX(0.6);
    transform: scaleX(0.6);
}

#btn_nosPointsDeVente {
    padding: 5px;
    margin: auto;
    text-align: center;
    font-weight: bold;
    margin-bottom: 50px;
    border-radius: 5px;
    background-color: #393939 !important;
    color: white;
    width: 50%;
    float: left;
    margin-top: 12px;
    min-width: 200px;
}

.btn_footer {
    padding: 5px;
    width: 100%;
    margin: auto;
    text-align: center;
    font-weight: bold;
    margin-bottom: 5px;
    border-radius: 5px;
}

.btn_footer:first-child {
    margin-top: 30px;
}

.btn_footer.white {
    color: #d10666;
    background-color: white;
}

.btn_footer.rose {
    color: #fff;
    background-color: #d10666;
}

.btn_cancel {
    padding-top: 10px;
    padding-bottom: 10px;
    border-radius: unset;
}

.div_cancel {
    margin-top: 90px;
    margin-bottom: 90px;
}

.pjDefaut {
    margin-left: 15px;
}

#avisUtilisateurSatisfait,
#avisUtilisateurNonSatisfait {
    height: 0px;
    width: 0px;
}

.input-date {
    padding: 6px 10px;
    border: 1px solid #eee;
}

input[type='date']::-webkit-inner-spin-button,
input[type='date']::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.mailOverview {
    padding: 8px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.mailOverview:hover {
    background-color: #dedede;
}

.closeWindow {
    color: #fff;
    cursor: pointer;
    text-align: right;
}

.closeWindow:hover {
    text-decoration: underline;
}

#mailPreviewWrapper {
    position: fixed;
    background: #0009;
    width: 100vw;
    height: 100vh;
    z-index: 99;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

#clientFilters {
    margin-top: 20px;
}

#btn_commanderMonPass_homePage {
    padding: 5px;
    width: 400px;
    margin: auto;
    text-align: center;
    font-weight: bold;
    border-radius: 5px;
    color: #fff;
    background-color: #d10666;
    margin-bottom: 60px;
}

.bottom_footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    height: 48px;
    background: #000;
}

.bottom_footer span {
    color: #c4c4c4;
}

.footer_item {
    justify-self: center;
}

.icone_footer {
    padding: 8px 0px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
}

.reseauxSociaux {
    display: flex;
    align-items: center;
    gap: 15px;
}

.logo_footer[href*="facebook"] { font-size: 14px;}
.logo_footer[href*="instagram"] { font-size: 17px;}
.logo_footer[href*="google"] { font-size: 15px;}

.logo_footer > svg {
    transition: color 200ms;
}

.logo_footer:hover > svg {
    color: #cf0b5d !important;
}

.logo_footer img {
    width: 30px;
    aspect-ratio: 1;
}

.lien_footer img,
.lien_footer2 img {
    width: 30px;
}

.titre_footer {
    color: white;
    text-transform: uppercase;
}

#bottom-footer {
    background: #000;
}

.span_footer,
.lien_footer a {
    color: rgb(134, 134, 134);
}

.lien_footer,
.span_footer {
    margin-bottom: 10px;
}

.lien_footer a:hover {
    color: white;
}

#logo-ministere {
    height: 160px;
    user-select: none;
    -webkit-user-drag: none;
}

.logo_Footer {
    margin-bottom: 30px;
    text-align: center;
}

.telephone_footer {
    color: white;
}

#home_zoneFooter .col-md-4:nth-child(3) {
    text-align: right;
    padding-top: 25px;
}

.horairesFooter {
    margin-top: 10px;
    color: #fff;
    text-align: center;
    padding-right: 100px;
}

.footerCentreGauche {
    padding-top: 20px;
}

.footerCentreDroite {
    padding-top: 35px;
    font-size: 15.5px;
    text-decoration: none;
    color: #fff;
}

.footerDroite {
    text-align: left;
}

.telephoneFooter {
    color: #fff;
    font-size: 16px;
    padding-left: 50px;
    padding-top: 30px;
}

.rsFooter {
    text-align: center;
    padding-top: 20px;
}

.mailLogoFooter {
    padding-top: 5px;
}

.grandTriangleBlanc {
    float: right;
    position: absolute;
    top: 50px;
    right: -21px;
}

.numero1ou3Flux {
    float: right;
    position: absolute;
    top: 0px;
    right: -34px;
}

.numero2ou4Flux {
    float: left;
    position: absolute;
    top: 0px;
    left: -34px;
}

#flux1Liste {
    padding-left: 24px;
    margin-bottom: 5px;
}

.flux_subTitle.linkRose a,
.flux_subTitle.linkRose {
    cursor: pointer;
    color: #d10666 !important;
    font-weight: bold;
}

#flux1Liste li {
    font-size: 100%;
    display: list-item;
    list-style-image: url('../images/checkboxRose.png');
}

.flux2 .col-md-8,
.flux4 .col-md-8 {
    text-align: right;
}

.flr {
    float: right;
}

.fll {
    float: left;
}

.cpointer {
    cursor: pointer;
}

.margin {
    margin-left: 2%;
    margin-right: 2%;
    margin-top: 2%;
}

.page-header {
    display: block;
    margin-left: auto;
    margin-right: auto;
    color: #ea076b;
    font-size: 28px;
    font-weight: bold;
    border-radius: 2px;
    border-bottom: 3px solid #ea076b;
}

.page-header i {
    vertical-align: baseline;
}

.header-box {
    background-image: url('../images/carte_grise_fond_rvb.jpg');
    background-size: cover;
}

.tel {
    margin-top: 64px;
    padding: 2%;
    background-color: #ea076b;
    color: white;
    margin-bottom: 20%;
    text-align: center;
}

.main-photo {
    width: 100%;
    border: 2px solid black;
}

.image-responsive {
    width: 100%;
    height: auto;
}

.top-footer {
    height: 50px;
    background-color: rgb(255, 255, 255);
}

.bottom-footer {
    min-height: 55px;
    height: auto;
}

.btn-footer {
    padding: 1%;
    margin-top: 6%;
    margin-bottom: 6%;
    margin-left: 5px;
    margin-right: 5px;
    width: 90%;
    border-radius: 20px;
    background-color: #604e56;
    text-align: center;
}

.btn-footer:hover {
    background-color: #ea076b;
}

.btn-footer a {
    color: white;
}

.btn-footer a:hover {
    color: white;
    text-decoration: none;
}

.btn-vmv.grey {
    background-color: #717171;
    cursor: pointer;
}

.btnPasDeBox {
    padding: 10px;
    padding-left: 50px;
    padding-right: 50px;
    width: 400px;
    margin: auto;
    text-align: center;
    font-weight: bold;
    border-radius: 5px;
    color: #fff;
    background-color: #d10666;
    margin-bottom: 60px;
}

.btnBackOffice {
    padding: 10px;
    margin: auto;
    text-align: center;
    color: #fff;
    background-color: #cf0b5d;
    margin-bottom: 60px;
    cursor: pointer;
    transition: all 0.3s ease-in-out;
    font-family: 'Lexend Deca', sans-serif;
}

.menuLienRose {
    background-color: #d10666;
    border: 1px solid #d10666;
    padding-left: 5px;
    padding-right: 5px;
    margin-left: 9px !important;
}

.menuLienRose a {
    color: #fff !important;
}

@media screen and (max-width: 769px) {
    .menuLienRose {
        margin-top: 10px;
    }

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

    #btn_Vehicule_Collection_Popup {
        padding-top: 9px !important;
    }

    #btn_ChangementDeNomDDM_Popup {
        padding-top: 9px !important;
    }

}

#chgmNom {
    padding-bottom: 0px;
}


.menuLienBlanc {
    border: 1px solid #d10666;
    padding-left: 5px;
    padding-right: 5px;
}

#menulienblanc__id {
    margin-left: 12px !important;
}

.menuLienBlanc a {
    color: #d10666 !important;
}

#backofficeMainWrapper {
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
}

#backofficeSideMenuMainWrapper {
    background-color: #2e2e2e;
    color: #a3a3a3;
    padding: 24px 0px;
}

#backofficeSideMenuInnerWrapper {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
    white-space: nowrap;
}

.backofficeMenuItem {
    padding: 16px;
    padding-right: 64px;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.backofficeMenuItem:hover {
    color: #fff;
}

.backofficeMenuItem:hover .backofficeMenuIcon {
    fill: #fff;
}

.backofficeMenuItemActive {
    color: #fff;
    background-color: #cf0b5d;
}

.backofficeMenuItemActive .backofficeMenuIcon {
    fill: #fff;
}

.backofficeMenuIcon {
    fill: #a3a3a3;
    margin-right: 16px;
    transition: all 0.2s ease-in-out;
}

#backofficeContentMainWrapper {
    padding: 0px 10px;
    width: 100%;
}

.h100 {
    height: 100%;
}

#container-page {
    display: inline-block;
}

#container-enable-filtres {
    display: none;
    width: 100%;
}

@media screen and (min-width: 768px) {
    #divFilterCommercant > * {
        height: 100%;
    }
}

#selectDate {
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    justify-content: space-between;
}

.up {
    transform: rotate(180deg);
}

.upArrow {
    transform: rotate(180deg);
    transition: all 0.5s ease-in-out;
}

.downArrow {
    transform: rotate(180deg);
    transition: all 0.3s ease-in-out;
}

#numeroFormule {
    text-transform: uppercase;
}

@media only screen and (max-width: 767px) {
    #filtreCommandes > *, #divFilterCommercant > * {
        margin-bottom: 8px;
    }

    #container-page {
        display: block;
        margin: 8px 0px;
    }

    #container-enable-filtres {
        display: block;
    }

    .br__align {
        display: flex !important;
    }
}

.input-filter {
    display: inline-block;
    font-family: inherit;
    color: inherit;
    padding: 4px 8px;
    width: 150px;
    border: solid 1px rgb(118 118 118);
}

.select {
    padding: 4px 8px;
    font-family: inherit;
}

.select-orange {
    color: white;
    background-color: #ee9400;
}

#containerCaseFinalise,
#containerCaseSemaine,
#containerCaseBureau,
#containerCaseBannette,
#containerCaseDefaut,
#containerCaseAnts {
    display: none;
}

.qs {
    margin-right: 24px;
}

.qs-container {
    width: fit-content;
    background: #fffad3;
    padding: 8px 32px;
}

.btn-white {
    border: 1px solid #c5c5c5;
    padding: 4px 8px;
    font-family: inherit;
    background: white;
    transition: all 0.2s ease-in-out;
}

.btn-orange {
    border: 1px solid #c5c5c5;
    padding: 4px 8px;
    font-family: inherit;
    background: #ee9400;
    color: white;
    transition: all 0.2s ease-in-out;
}

.btn-white:hover {
    background-color: #dedede;
}

.btn-abandon {
    background-color: rgb(255, 73, 73);
    color: white;
    border: none;
    font-family: inherit;
    padding: 8px 16px;
    transition: 0.2s ease-in-out;
}

.btn-abandon:hover {
    background-color: rgb(221, 47, 47);
}

.btn-valider {
    background-color: #5cb85c;
    color: white;
    border: none;
    font-family: inherit;
    padding: 0px 20px;
    transition: 0.2s ease-in-out;
    display: inline-flex;
    align-items: center;
    border-radius: 4px;
}

.btn-valider:hover {
    background-color: rgb(46, 148, 46);
}

.btn-grey {
    background-color: #494949;
    color: white;
    border: none;
    font-family: inherit;
    padding: 8px 16px;
    transition: 0.2s ease-in-out;
}

.btn-grey:hover {
    background-color: #2c2c2c;
}

.btn-alert {
    background-color: rgb(238, 148, 0);
    color: white;
    border: none;
    font-family: inherit;
    padding: 8px 16px;
    transition: 0.2s ease-in-out;
}

.btn-alert:hover {
    background-color: rgb(189, 116, 0);
}

.unfoldTableCommande,
.titleTable {
    transition: all 0.2s ease-in-out;
    margin: 36px 0px;
}

.unfoldTableCommande {
    display: flex;
    display: -ms-flexbox;
    display: -webkit-flex;
    justify-content: space-between;
}

.inputSuivi {
    width: 100%;
    font-family: inherit;
    padding-left: 8px;
}

.infoBulle {
    padding-left: 5px;
    position: relative;
    cursor: help;
}

.infoBulle:hover::after {
    content: attr(aria-label);
    position: absolute;
    top: -2.4em;
    left: 60%;
    transform: translateX(-50%);
    z-index: 1;
    white-space: nowrap;
    padding: 5px 14px;
    background: #cf0b5d;
    color: #fff;
    font-weight: normal;
    border-radius: 4px;
}

.infoBulle[aria-label]:hover::before {
    content: '▼';
    position: absolute;
    top: -1em;
    left: 60%;
    transform: translateX(-50%);
    font-size: 20px;
    color: #cf0b5d;
}

#btnFiltrerCommandes {
    display: flex;
    justify-content: center;
    gap: 8px;
    padding: 0px 50px;
}

div.filtreCommande > div:first-child {
    width: 100%;
    display: flex;
    justify-content: space-between;
}

#pageNumber {
    text-align: center;
    width: 42px;
    font-family: inherit;
}

.unfoldTableCommande:hover {
    color: #cf0b5d;
}

.backofficeTableMainWrapper {
    width: 100%;
    border-bottom: 1px solid #dedede;
}

#recapMensuel .backofficeTableMainWrapper {
    max-width: 600px;
}

.table-layout-fixed {
    table-layout: fixed;
}

.backofficeTableInput {
    display: block;
    width: 100%;
    background-color: transparent;
    border: none;
    cursor: inherit;
    font-family: inherit;
    color: inherit;
    pointer-events: none;
    -webkit-text-fill-color: #000;
    opacity: 1;
}

.backofficeHR {
    width: 100%;
    margin: 0px;
}

.backofficeTableTR {
    cursor: pointer;
    border-top: 1px solid #dedede;
}

.backofficeTableTR:hover {
    background-color: #dedede !important;
}

.backofficeTableTR:hover .backofficeTableInput {
    background-color: transparent;
}

.backofficeTableTR:nth-child(odd) {
    background-color: rgb(246, 246, 246);
}

.backofficeTableTitle,
.backofficeTableTitle th {
    background-color: #cf0b5d;
    color: #fff;
}

.backofficeTableTD {
    border-style: solid;
    border-width: 0px 1px;
    border-color: #dedede;
    padding: 8px !important;
    cursor: pointer;
}

.backofficeTableTH {
    padding: 8px;
    font-weight: 100;
}

.backofficeTableButton {
    width: 100%;
    border: none;
    background-color: inherit;
}

.containerPdfListeGlobale {
    overflow-y: auto;
    max-height: 500px;
}

.containerPdfListeGlobale thead th {
    position: sticky;
    top: 0;
}

#tablePdfListeGlobale .backofficeTableTD {
    cursor: auto;
}

#loading-text,
#loading-text-upload {
    display: none;
    text-align: center;
}

#loading-text-upload-time {
    border-bottom: 1px solid;
    padding-bottom: 2px;
}

#uploadDossier {
    display: none;
}

#uploadDossier + label {
    background-color: #fff;
    border: 1px solid #9a9a9a;
    padding: 2px 8px;
    margin: 0px;
    cursor: pointer;
    transition: 0.2s ease-in-out;
}

#uploadDossier + label:hover {
    background-color: #dedede;
    border-color: #6b6b6b;
}

#uploadFileClient {
    display: none;
}

.editFileName {
    background-color: #4681ff;
    cursor: pointer !important;
}

.deleteFile {
    background-color: #202020;
    cursor: pointer !important;
}

.cmdDossierAbandonne {
    background-color: #ff000094 !important;
}

.cmdDossierDefaut {
    background-color: #ee9400 !important;
}

.cmdTraitementDossier {
    background-color: #007eff7d !important;
}

.cmdDossierFinalise {
    background-color: #13aa0ab8 !important;
}

#aFaireMaCG {
    position: relative;
}

#aFaireMaCG::before {
    content: '';
    position: absolute;
    width: 100%;
    margin-bottom: 4px;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: white;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

#aFaireMaCG::after {
    display: none;
}

#aFaireMaCG:hover::before {
    visibility: visible;
    -webkit-transform: scaleX(0.9);
    transform: scaleX(0.9);
}

#aFaireMaCG img {
    width: 15px;
    aspect-ratio: 1;
}

#navbarNav {
    padding: 0px;
    justify-content: flex-end;
    margin-top: 10px;
}

@media (min-width: 770px) {
    #navbarNav {
        width: 100%;
    }
}

@media (min-width: 767px) {
    #filtreCommandes {
        display: flex !important;
        flex-wrap: wrap;
        height: max-content;
    }

    #divFilterCommercant {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center;
        height: max-content;
    }

}

@media (min-width: 991px) {
    #navbarNav {
        width: 420%;
    }
}

#navbarNav ul {
    margin-bottom: 10px !important;

    margin-top: 35px;
}

.btnOkBox {
    font-size: 16px;
    padding: 13px;
    padding-bottom: 10px;
    margin-left: -4px;
}

.flux2 .row,
.flux4 .row {
    padding-left: 25px;
}

.flux1 .row,
.flux3 .row {
    padding-right: 25px;
}

.inputBox {
    text-align: center;
    height: auto;
    width: auto;
    margin-top: 140px;
    float: right;
}

.inputBox span {
    position: relative;
    display: inline-block;
}

.gate {
    display: inline-block;
    width: 420px;
    padding: 10px 0 10px 15px;
    font-family: 'Open Sans', sans;
    font-weight: 400;
    color: #377d6a;
    background: #efefef;
    border: 0;
    border-radius: 3px;
    outline: 0;
    text-indent: 65px;
    transition: all 0.3s ease-in-out;
}

.gate::-webkit-input-placeholder {
    color: #efefef;
    text-indent: 0;
    font-weight: 300;
}

.gate + label {
    display: inline-block;
    position: absolute;
    top: 0;
    left: 0;
    padding: 10px 15px;
    text-shadow: 0 1px 0 rgba(19, 74, 70, 0.4);
    background: #373737;
    color: white;
    transition: all 0.4s ease-in-out;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
    transform-origin: left bottom;
    z-index: 99;
}

.gate + label:before,
.gate + label:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: 3px;
    background: #373737;
    color: white;
    transform-origin: left bottom;
    transition: all 0.4s ease-in-out;
    pointer-events: none;
    z-index: -1;
}

.gate + label:before {
    background: rgba(3, 36, 41, 0.2);
    color: white;
    z-index: -2;
    right: 20%;
}

span:nth-child(2) .gate {
    text-indent: 85px;
}

span:nth-child(2) .gate:focus,
span:nth-child(2) .gate:active {
    text-indent: 0;
}

.gate:focus,
.gate:active {
    color: #377d6a;
    text-indent: 0;
    background: #fff;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px;
}

.gate:focus::-webkit-input-placeholder,
.gate:active::-webkit-input-placeholder {
    color: #aaa;
}

.gate:focus + label,
.gate:active + label {
    transform: rotate(-66deg);
    border-radius: 3px;
}

.gate:focus + label:before,
.gate:active + label:before {
    transform: rotate(10deg);
}

#menuContact {
    position: absolute;
    font-size: 15px;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans',
        'Helvetica Neue', sans-serif;
    font-weight: bold;
    text-align: center;
}

#menuContactMail {
    margin-left: 15px;
    display: inline-block;
}

#menuContactMail a {
    text-decoration: none;
    color: #393939;
}

@media screen and (max-width: 640px) {
    .btn-vmv {
        font-size: 16px;
    }
}

@media screen and (max-width: 576px) {
    .navbar-brand {
        font-size: 16px;
    }
}

#btnHomeHeader {
    padding: 15px 20px !important;
    position: relative;
}

#btnHomeMain {
    position: relative;
}

#btnHomeHeader::before,
#btnHomeMain::before {
    content: '';
    position: absolute;
    width: 100%;
    margin-bottom: 10px;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: white;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

#btnHomeHeader:hover::before,
#btnHomeMain:hover::before {
    visibility: visible;
    -webkit-transform: scaleX(0.8);
    transform: scaleX(0.8);
}

#btnHomeMain:hover::before {
    -webkit-transform: scaleX(0.45);
    transform: scaleX(0.45);
}

.helpAreaBlueBox {
    display: flex;
    justify-content: space-around;
    flex-direction: column;
    align-items: center;
    background: #096fca;
    height: 100%;
    width: 32px;
    color: white;
    text-align: center;
}

#helpAreaValider {
    height: 48px;
    background: #cd0a5d;
    color: white;
    border: none;
    font-size: 16px;
    cursor: pointer;
    width: 100%;
}

#helpAreaValider::before {
    content: '';
    position: absolute;
    width: 100%;
    margin-bottom: 10px;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: white;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

#helpAreaValider:hover::before {
    visibility: visible;
    -webkit-transform: scaleX(0.38);
    transform: scaleX(0.38);
}

.tac {
    text-align: center;
}

@media screen and (max-width: 768px) {
    .btnPasDeBox {
        padding-right: 10px;
        padding-left: 10px;
    }

    #btn_commanderMonPass_homePage {
        max-width: 90%;
    }

    #btn_nosPointsDeVente {
        margin: auto;
        float: inherit;
        margin-top: 20px;
    }

    #flux {
        padding-top: 0px;
    }

    .flux2 .col-md-4 img,
    .flux4 .col-md-4 img {
        margin-top: 15px !important;
    }

    .flux1 .row,
    .flux2 .row,
    .flux3 .row,
    .flux4 .row {
        padding-right: 0px;
        padding-left: 0px;
        padding-top: 140px;
    }

    .traitsPointillesADroite {
        border: none;
    }

    .numero1ou3Flux,
    .numero2ou4Flux {
        position: absolute;
        top: 40px;
        text-align: center;
        margin-left: auto;
        margin-right: auto;
        left: 0;
        right: 0;
    }

    #flux .col-md-4,
    #flux .col-md-8 {
        text-align: center;
    }

    #flux .col-md-8 ul {
        text-align: left;
    }

    #flux .col-md-4 img {
        max-width: 30%;
        margin: auto;
    }

    .gate {
        width: 250px !important;
    }

    .sousTitreCommercant {
        margin-bottom: 20px;
    }

    #menuContact {
        position: static;
    }

    .navbar.navbar-toggleable-md.navbar-light.bg-faded.fixed-top > .container {
        text-align: center;
    }

    #navbarNav ul {
        max-width: 400px !important;
        margin: auto !important;
        padding-left: 0px;
    }

    .grandTriangleBlanc {
        display: none;
    }

    .pieceNumero {
        text-align: center;
    }

    #home_zoneFooter {
        padding-top: 0px;
    }

    .docPageMainHeader_menu_titre {
        font-size: 25px;
        margin-bottom: 5px;
        text-align: center;
    }

    #loader {
        background: #fff;
    }
}

@media screen and (min-width: 991px) {
    #logoAccueil {
        margin-left: 120px;
    }
}

@media screen and (min-width: 991px) and (max-width: 1200px) {
    #menuContact {
        right: 35px;
    }
}

@media screen and (min-width: 1200px) and (max-width: 4000px) {
    #menuContact {
        right: 105px;
    }
}

@media screen and (max-width: 991px) {
    #menuContact {
        position: inherit;
    }

    #imgFlyerContainer,
    .headerGauche {
        display: none;
    }

    #verificationBoxContainer,
    .headerDroite {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
    }

    #verificationBoxContainer .inputBox {
        text-align: center !important;
        float: inherit !important;
        margin: auto;
        margin-top: 150px;
    }

    #texteDroiteImage {
        margin-top: 10px !important;
    }

    #btn_nosPointsDeVente {
        margin-bottom: 80px;
    }

    .besoinDunPaddingTopSurPc {
        padding-top: 5px;
    }
}

.flux1,
.flux2,
.flux3,
.flux4 {
    min-height: 100px;
}

@media screen and (min-width: 991px) {
    .navbar.navbar-toggleable-md.navbar-light.bg-faded.fixed-top #navbarNav ul {
        margin-top: 20px;
    }

    .besoinDunPaddingTopSurPc {
        padding-top: 15px;
    }
}

.btn-vmv:focus {
    outline: none;
}

.btn-vmv:hover {
    color: white;
    background: #920540;
    text-decoration: none;
}

.row-input {
    margin-top: 2%;
    margin-bottom: 10%;
}

.disabled {
    cursor: not-allowed;
}

.btn-mail {
    display: flex;
    align-items: center;
}

.btn-mail:disabled {
    background-color: #ddd;
    border-color: #ddd;
}

.alert-vmv {
    background-color: white;
    border: 1px solid #d2d2d2;
    border-radius: 5px;
    color: #d2d2d2;
    font-size: 18px;
}

.alert-vmv.prix {
    background-color: #373735;
    border: 1px solid #373735;
    border-radius: 5px;
    color: white;
    font-size: 18px;
}

.alert-vmv-inversed {
    background-color: #ea066a;
    border-color: #853f5e;
    color: white;
}

.alert-vmv-light {
    background-color: #863e5d;
    border-color: #462131;
    color: #fff;
}

.alert-vmv-dark {
    background-color: #545454;
    border-color: #2e2328;
    color: #fff;
}

.a-vmv {
    text-decoration: none;
    color: #863e5d;
}

.a-vmv:hover {
    color: #ea066a;
}

.stroke {
    list-style: none;
    text-align: center;
    font-size: 16px;
}

.stroke li {
    display: inline-block;
    margin-left: 5px;
}

.stroke li a {
    display: block;
    padding: 5px;
    text-decoration: none;
    color: #393939;
    font-size: 14px;
}

.stroke li a,
.stroke li a:after,
.stroke li a:before {
    transition: all 0.5s;
}

.stroke li a:hover {
    color: #d10667;
}

.stroke li a {
    position: relative;
}

.stroke li a:after {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    margin-bottom: 4px;
    width: 0%;
    content: '.';
    color: transparent;
    background: #d10667;
    height: 1px;
}

.stroke li a:hover:after {
    width: 100%;
}

.container-input {
    background-color: #ea066a;
    border: 2px solid #ea066a;
    border-radius: 6px;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.input-immat {
    width: 80%;
    text-align: center;
    border-radius: 0px;
    margin-left: auto;
    margin-right: auto;
    line-height: 90%;
    padding: 0;
    font-size: 46px;
    letter-spacing: 4px;
    border: none;
}

.input-immat:focus {
    outline: none;
}

.question {
    font-weight: bold;
    font-size: 26px;
    color: #ea066a;
}

.mailto {
    color: white;
}

.mailto:hover {
    color: white;
}

.alert-effect {
    transition: all 0.8s ease-out;
}

.alert-effect:hover {
    background-color: #ea066a;
    transform: scale(1.2);
    z-index: 1;
}

.text-vmv {
    color: #ea066a;
    font-weight: bold;
}

.accueil {
    font-size: 26px;
}

#videoHomePage {
    width: 100%;
}

#texteDroiteImage {
    margin-top: 75px;
}

#h4DroiteImage {
    font-weight: bold;
    color: #393939;
}

#btn_PointsDeVente_homePage {
    background-color: #393939 !important;
    color: white;
    width: 50%;
    float: left;
    margin-top: 12px;
}

#tableUtilisateurListeGlobale select {
    height: 26px;
    padding: 5px;
    border: none;
    background: none;
    font-size: 12px;
}

#tableUtilisateurListeGlobale button,
#tableClientListeGlobale button,
#tableOperationListeGlobale button {
    height: 26px;
    padding: 4px;
    font-size: 12px;
    cursor: pointer;
}

#tableUtilisateurListeGlobale a.btn {
    color: #fff;
    height: 26px;
    padding: 6px;
    font-size: 12px;
    cursor: pointer;
}

#tablePlaqueListeGlobale td,
#tableUtilisateurListeGlobale td,
#tableClientListeGlobale td,
#tableClientListeGlobale td,
#tableOperationListeGlobale td {
    padding: 0px;
    border: none;
}

#tablePlaqueListeGlobale td input,
#tableUtilisateurListeGlobale td input,
#tableClientListeGlobale td input,
#tableOperationListeGlobale td input {
    padding: 5px;
    border: none;
    background: none;
    font-size: 12px;
}

#tableUtilisateurListeGlobale th,
#tableClientListeGlobale th,
#tablePlaqueListeGlobale th,
#tableOperationListeGlobale th {
    padding: 4px;
    font-size: 13px;
}

#tablePlaqueListeGlobale td input:disabled,
#tableOperationListeGlobale td input:disabled {
    color: #808080;
}

#inputReactivationPass,
#inputDesactivationPass {
    text-align: center;
    font-size: 20px;
}

#btnReactivationPass::placeholder {
    color: #ccc;
}

#btnReactivationPass,
#btnDesactivationPass,
#btnEnvoieMailManuel {
    color: white;
    cursor: pointer;
}

.showOnMAP {
    color: #268bdd;
}

#btn_enregistrerModifUser {
    color: white;
    text-shadow: 0 1px 0 white;
    border-radius: 3px;
    border: 1px solid #ddd;
    box-shadow: 0px 0px 10px #ff0000;
}

#divSearchGlobale {
    text-align: right;
    width: 500px;
    float: right;
    margin-bottom: 20px;
    margin-right: 23px;
}

#divSearchInput {
    width: 90%;
    float: left;
}

#divSearchBtn {
    width: 10%;
    display: inline-block;
    cursor: pointer;
}

#btn_searchUtilisateur {
    width: 100%;
    background-color: white;
    border-color: white;
    border: 1px solid rgba(0, 0, 0, 0.15);
}

#btn_enregistrerModifUtilisateur {
    margin-left: 10px;
    margin-right: 10px;
    color: white;
    cursor: pointer;
}

#btnCopy,
#btnCopy2 {
    cursor: pointer;
    background: none;
    border: none;
}

#btnCopy:hover svg,
#btnCopy2:hover svg {
    color: grey;
}

.inputModifyClient,
.inputModifyVehicule,
.inputModifyCommande,
.inputModify {
    height: 100%;
    width: 100%;
    font-family: inherit;
    padding: 2px 4px;
}

#infoEncaissement label {
    margin-right: 8px;
}

@-webkit-keyframes clignote {
    from {
        background-color: #0b610b;
    }

    to {
        background-color: #01df01;
    }
}

@keyframes clignote {
    from {
        background-color: #0b610b;
    }

    to {
        background-color: #01df01;
    }
}

.blinkingClassForBtnSaveUser {
    -webkit-animation: clignote 0.8s infinite ease-in-out alternate;
    animation: clignote 0.8s infinite ease-in-out alternate;
}

/*  _____   _____   _____   _   _   _____  */
/* |  _  \ /  _  \ |  _  \ | | | | |  _  \ */
/* | |_| | | | | | | |_| | | | | | | |_| | */
/* |  ___/ | | | | |  ___/ | | | | |  ___/ */
/* | |     | |_| | | |     | |_| | | |     */
/* |_|     \_____/ |_|     \_____/ |_|     */

.mfp-bg {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1042;
    overflow: hidden;
    position: fixed;
    background: #0b0b0b;
    opacity: 0.8;
}

.mfp-wrap {
    top: 0px !important;
    left: 0;
    width: 100%;
    height: 100% !important;
    z-index: 1043;
    position: fixed !important;
    outline: none !important;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
}

.mfp-container {
    text-align: center;
    position: fixed;
    width: 100%;
    left: 0;
    padding: 0 8px;
    box-sizing: border-box;
}

.mfp-container:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.mfp-align-top .mfp-container:before {
    display: none;
}

#messagePopup p,
#messagePopupCommercant p,
#messagePopupRenvoiHomePage p {
    font-size: 18px;
}

#messagePopup input[type='checkbox'],
#messagePopupCommercant input[type='checkbox'],
#messagePopupRenvoiHomePage input[type='checkbox'] {
    margin-right: 4px;
}

#messagePopup select,
#messagePopupCommercant select,
#messagePopupRenvoiHomePage select {
    width: 90%;
    border-radius: 3px;
    border: 1px solid #64c5ef;
    height: 30px;
    padding-left: 5px;
}

#messagePopup fieldset,
#messagePopupCommercant fieldset,
#messagePopupRenvoiHomePage fieldset {
    text-align: center;
}

#messagePopup_fermerDemarche {
    display: none;
}

.mfp-content {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 auto;
    text-align: left;
    z-index: 1045;
    background: white;
    width: 100%;
    max-width: 700px;
}

.mfp-commercant {
    max-width: auto !important;
}

#messagePopup,
#messagePopupCommercant {
    display: flex;
    align-items: center;
    justify-content: center;
}

#messagePopupCommercant {
    height: 600px;
}

#messagePopup > h1,
#messagePopupCommercant > h1,
#messagePopupRenvoiHomePage h1 {
    text-transform: capitalize;
    color: #313131;
    font-size: 28px;
    text-align: center;
    margin-top: 5px;
    font-weight: bold;
}

#titrePopupAcc,
#titrePopupAccCommercant {
    color: #313131;
    font-size: 28px;
    font-weight: bold;
    line-height: 48px;
}

#imgPopup,
#imgPopupCommercant,
#imgPopupAlert {
    width: 160px;
    height: auto;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
}

#popupWrapper1,
#popupWrapper1Commercant {
    padding: 32px;
}

#popupWrapper2,
#popupWrapper2Commercant {
    padding: 32px 32px 32px 0px;
}

#popupWrapper2Commercant {
    overflow: auto;
    height: inherit;
    font-size: 18px;
}

#messagePopup fieldset > p,
#messagePopupCommercant fieldset > p,
#messagePopupRenvoiHomePage fieldset > p {
    text-align: center;
}

.selectBy {
    padding: 8px;
    border: 1px solid #dedede;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.selectBy:hover,
.selectBy:focus,
.selectBy:active {
    background-color: #dedede;
}

.selectBy input {
    margin-right: 8px;
}

.selectBy input:checked {
    border-color: #cf0b5d;
    background-color: #cf0b5d !important;
}

.mfp-inline-holder .mfp-content,
.mfp-ajax-holder .mfp-content {
    width: 100%;
    cursor: auto;
}

.mfp-ajax-cur {
    cursor: progress;
}

.mfp-zoom-out-cur,
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
    cursor: -moz-zoom-out;
    cursor: -webkit-zoom-out;
    cursor: zoom-out;
}

.mfp-zoom {
    cursor: pointer;
    cursor: -webkit-zoom-in;
    cursor: -moz-zoom-in;
    cursor: zoom-in;
}

.mfp-auto-cursor .mfp-content {
    cursor: auto;
}

.mfp-close,
.mfp-arrow,
.mfp-preloader,
.mfp-counter {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

.mfp-loading.mfp-figure {
    display: none;
}

.mfp-hide {
    display: none !important;
}

.mfp-preloader {
    color: #ccc;
    position: absolute;
    top: 50%;
    width: auto;
    text-align: center;
    margin-top: -0.8em;
    left: 8px;
    right: 8px;
    z-index: 1044;
}

.mfp-preloader a {
    color: #ccc;
}

.mfp-preloader a:hover {
    color: #fff;
}

.mfp-s-ready .mfp-preloader {
    display: none;
}

.mfp-s-error .mfp-content {
    display: none;
}

button.mfp-close,
button.mfp-arrow {
    overflow: visible;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
    appearance: none;
    display: block;
    outline: none;
    padding: 0;
    z-index: 1046;
    box-shadow: none;
    touch-action: manipulation;
}

button::-moz-focus-inner {
    padding: 0;
    border: 0;
}

.mfp-close {
    width: 44px;
    height: 44px;
    line-height: 44px;
    position: absolute;
    right: 0;
    top: 0;
    text-decoration: none;
    text-align: center;
    opacity: 0.65;
    padding: 0 0 18px 10px;
    color: #fff;
    font-style: normal;
    font-size: 28px;
    font-family: Arial, Baskerville, monospace;
}

.mfp-close:hover,
.mfp-close:focus {
    opacity: 1;
}

.mfp-close:active {
    top: 1px;
}

.mfp-close-btn-in .mfp-close {
    color: #333;
}

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
    color: #fff;
    right: -6px;
    text-align: right;
    padding-right: 6px;
    width: 100%;
}

.mfp-counter {
    position: absolute;
    top: 0;
    right: 0;
    color: #ccc;
    font-size: 12px;
    line-height: 18px;
    white-space: nowrap;
}

.mfp-arrow {
    position: absolute;
    opacity: 0.65;
    margin: 0;
    top: 50%;
    margin-top: -55px;
    padding: 0;
    width: 90px;
    height: 110px;
    -webkit-tap-highlight-color: transparent;
}

.mfp-arrow:active {
    margin-top: -54px;
}

.mfp-arrow:hover,
.mfp-arrow:focus {
    opacity: 1;
}

.mfp-arrow:before,
.mfp-arrow:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 35px;
    margin-left: 35px;
    border: medium inset transparent;
}

.mfp-arrow:after {
    border-top-width: 13px;
    border-bottom-width: 13px;
    top: 8px;
}

.mfp-arrow:before {
    border-top-width: 21px;
    border-bottom-width: 21px;
    opacity: 0.7;
}

.mfp-arrow-left {
    left: 0;
}

.mfp-arrow-left:after {
    border-right: 17px solid #fff;
    margin-left: 31px;
}

.mfp-arrow-left:before {
    margin-left: 25px;
    border-right: 27px solid #3f3f3f;
}

.mfp-arrow-right {
    right: 0;
}

.mfp-arrow-right:after {
    border-left: 17px solid #fff;
    margin-left: 39px;
}

.mfp-arrow-right:before {
    border-left: 27px solid #3f3f3f;
}

.mfp-iframe-holder {
    padding-top: 40px;
    padding-bottom: 40px;
}

.mfp-iframe-holder .mfp-content {
    line-height: 0;
    width: 100%;
    max-width: 900px;
}

.mfp-iframe-holder .mfp-close {
    top: -40px;
}

.mfp-iframe-scaler {
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-top: 56.25%;
}

.mfp-iframe-scaler iframe {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    background: #000;
}

img.mfp-img {
    width: auto;
    max-width: 100%;
    height: auto;
    display: block;
    line-height: 0;
    box-sizing: border-box;
    padding: 40px 0 40px;
    margin: 0 auto;
}

.mfp-figure {
    line-height: 0;
}

.mfp-figure:after {
    content: '';
    position: absolute;
    left: 0;
    top: 40px;
    bottom: 40px;
    display: block;
    right: 0;
    width: auto;
    height: auto;
    z-index: -1;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    background: #444;
}

.mfp-figure small {
    color: #bdbdbd;
    display: block;
    font-size: 12px;
    line-height: 14px;
}

.mfp-figure figure {
    margin: 0;
}

.mfp-bottom-bar {
    margin-top: -36px;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    cursor: auto;
}

.mfp-title {
    text-align: left;
    line-height: 18px;
    color: #f3f3f3;
    word-wrap: break-word;
    padding-right: 36px;
}

.mfp-image-holder .mfp-content {
    max-width: 100%;
}

.mfp-gallery .mfp-image-holder .mfp-figure {
    cursor: pointer;
}

.modalDoc {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 8px;
    grid-row-gap: 8px;
}

@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
    .mfp-img-mobile .mfp-image-holder {
        padding-left: 0;
        padding-right: 0;
    }

    .mfp-img-mobile img.mfp-img {
        padding: 0;
    }

    .mfp-img-mobile .mfp-figure:after {
        top: 0;
        bottom: 0;
    }

    .mfp-img-mobile .mfp-figure small {
        display: inline;
        margin-left: 5px;
    }

    .mfp-img-mobile .mfp-bottom-bar {
        background: rgba(0, 0, 0, 0.6);
        bottom: 0;
        margin: 0;
        top: auto;
        padding: 3px 5px;
        position: fixed;
        box-sizing: border-box;
    }

    .mfp-img-mobile .mfp-bottom-bar:empty {
        padding: 0;
    }

    .mfp-img-mobile .mfp-counter {
        right: 5px;
        top: 3px;
    }

    .mfp-img-mobile .mfp-close {
        top: 0;
        right: 0;
        width: 35px;
        height: 35px;
        line-height: 35px;
        background: rgba(0, 0, 0, 0.6);
        position: fixed;
        text-align: center;
        padding: 0;
    }
}

@media all and (max-width: 900px) {
    .mfp-arrow {
        -webkit-transform: scale(0.75);
        transform: scale(0.75);
    }

    .mfp-arrow-left {
        -webkit-transform-origin: 0;
        transform-origin: 0;
    }

    .mfp-arrow-right {
        -webkit-transform-origin: 100%;
        transform-origin: 100%;
    }

    .mfp-container {
        padding-left: 6px;
        padding-right: 6px;
    }
}

@media screen and (min-width: 991px) {
    #bandeauTemplate1TextCourt,
    #bandeauTemplate2TextCourt,
    #bandeauTemplate3TextCourt,
    #bandeauTemplate4TextCourt {
        display: none;
    }

    #messagePopup_fermerMobile {
        display: none !important;
    }

    #bandeauTemplate1,
    #bandeauTemplate2,
    #bandeauTemplate3,
    #bandeauTemplate4 {
        display: inline-block;
    }

    #bandeauTemplate1TextLong,
    #bandeauTemplate2TextLong,
    #bandeauTemplate3TextLong,
    #bandeauTemplate4TextLong {
        margin-top: 20px;
        margin-left: 90px;
        margin-bottom: 15px;
        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans',
            'Helvetica Neue', sans-serif;
        font-size: 15px;
    }

    #bandeauTemplate1Picto img {
        width: 75px;
    }

    #bandeauTemplate2Picto img {
        width: 80px;
    }

    #bandeauTemplate3Picto img {
        width: 80px;
        margin-top: 2px;
    }

    #bandeauTemplate4Picto img {
        width: 75px;
        margin-top: 15px;
    }
}

@media screen and (max-width: 991px) {
    #bandeauTemplate {
        padding-bottom: 100px;
    }

    #bouttons_reglement {
        padding: 8px 0px !important;
        justify-content: space-around;
        align-content: space-around;
        flex-flow: column wrap;
    }

    #bandeauTemplate1TextLong,
    #bandeauTemplate2TextLong,
    #bandeauTemplate3TextLong,
    #bandeauTemplate4TextLong {
        display: none;
    }

    #bandeauTemplate1TextCourt,
    #bandeauTemplate2TextCourt,
    #bandeauTemplate3TextCourt,
    #bandeauTemplate4TextCourt {
        margin-top: 56px;
        font-size: 13px;
    }

    #bandeauTemplate1Picto img {
        width: 50px;
    }

    #bandeauTemplate2Picto img {
        width: 55px;
    }

    #bandeauTemplate3Picto img {
        width: 55px;
        margin-top: 2px;
    }

    #bandeauTemplate4Picto img {
        width: 50px;
        margin-top: 10px;
    }

    #premierBandeauGaucheTop {
        position: absolute;
        z-index: 10;
    }

    #premierBandeauGaucheTop b {
        font-size: 24px;
    }

    #premierBandeauDroiteTop {
        height: 400px;
        opacity: 0.2;
        filter: alpha(opacity=50);
        z-index: 5;
    }
}

#selectTypeAchat,
#moyenPaiement,
#idTransaction {
    border: none;
    background-color: inherit;
    padding: 1px;
    margin: 0px;
    font-family: inherit;
    color: inherit;
    left: 0px;
    position: absolute;
}

#bandeauTemplate1Picto,
#bandeauTemplate2Picto,
#bandeauTemplate3Picto,
#bandeauTemplate4Picto {
    position: absolute;
}

#bandeauTemplate {
    background-color: #f3f3f3;
    padding-bottom: 20px;
    padding-top: 20px;
}

#logoAccueil {
    height: 375px;
    -webkit-user-drag: none;
}

@media screen and (max-width: 991px) {
    #bandeauTemplate1,
    #bandeauTemplate2,
    #bandeauTemplate3,
    #bandeauTemplate4 {
        width: 25%;
        text-align: center;
    }

    #bandeauTemplate {
        padding-left: 0px;
    }

    #btnHomeHeader {
        width: 90%;
    }
}

#btnHomeHeader,
.btnMedium,
#p1 {
    cursor: pointer;
}

@media screen and (max-width: 320px) {
    #btnHomeHeader {
        width: 90%;
    }
}

@media screen and (max-width: 375px) {
    body {
        overflow-x: hidden;
    }
}

.colorRose.numImmat {
    text-transform: uppercase;
}

#helpAreaHeader,
#helpAreaContent {
    width: 100%;
}

#helpAreaHeader {
    position: fixed;
    bottom: 0px;
    text-align: center;
    background-color: #cf0b5d;
    z-index: 111;
    height: 48px;
    padding-top: 12px;
    color: white;
}

#helpAreaHeader:hover {
    cursor: pointer;
}

#helpAreaHeader img {
    height: 26px;
    float: right;
    padding-right: 17px;
    margin-top: -3px;
}

#helpAreaContent {
    position: fixed;
    font-size: 13px;
    bottom: -340px;
    text-align: left;
    background-color: #fdfdfd;
    z-index: 111;
    height: 340px;
    color: #000;
    border-left: 1px solid #cf0b5d;
    border-right: 1px solid #cf0b5d;
}

#helpAreaContent .content {
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 15px;
}

#helpAreaContacterNous {
    background-color: #cf0b5d;
    color: #fff;
    width: 80%;
    margin: auto;
    height: 40px;
    border-radius: 4px;
    padding-top: 8px;
    font-size: 16px;
    text-align: center;
}

#divGestionCommandes {
    color: var(--rose-color);
    padding-top: 30px;
}

#divGestionCommandes h3 {
    font-weight: 600;
    margin: 0px;
    padding: 0;
}

#tableCommandesListeGlobale input[name="selectDefaut"] {
    font-family: inherit;
    padding: 3px 6px;
    border: solid 1px rgb(118 118 118);
}

.back:hover {
    background: #b5004c !important;
}

#btn_retourBack, #btn_ajoutCommande {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    background-color: #cf0b5d !important;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
}

.next,
.back {
    cursor: pointer;
    padding: 0px 20px;
    height: 48px;
    background-color: #cf0b5d !important;
    color: white;
    font-family: inherit;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: 0.2s background ease-in-out;
}

.next span {
    margin-right: 4px;
    position: relative;
}

.next > span::before {
    content: '';
    position: absolute;
    width: 100%;
    margin-bottom: -1px;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: white;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.next:hover > span::before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.next-white {
    cursor: pointer;
    padding: 0px 20px;
    height: 48px;
    background-color: #fff;
    color: #313131;
    font-family: inherit;
    border: 1px solid #dedede;
    display: inline-flex;
    align-items: center;
    transition: background 0.3s ease-in-out;
}

.next-white span {
    margin-right: 4px;
    position: relative;
}

.next-white > span::before {
    content: '';
    position: absolute;
    width: 100%;
    margin-bottom: -1px;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #313131;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.next-white:hover > span::before {
    visibility: visible;
    -webkit-transform: scaleX(1);
    transform: scaleX(1);
}

.next-white svg {
    padding-top: 2px;
    position: relative;
    transition: left 0.3s ease-in-out;
    left: 0px;
}

.next-white:hover svg {
    left: 6px;
}

.previous {
    cursor: pointer;
    padding: 0px 20px;
    height: 48px;
    background-color: transparent;
    color: #313131;
    font-family: inherit;
    border: 1px solid #dedede;
    display: inline-flex;
    align-items: center;
    transition: background 0.3s ease-in-out;
}

.previous span {
    margin-left: 4px;
    position: relative;
}

.previous > span::before {
    content: '';
    position: absolute;
    width: 100%;
    margin-bottom: -1px;
    height: 1px;
    bottom: 0;
    left: 0;
    background-color: #313131;
    visibility: hidden;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: all 0.3s ease-in-out 0s;
    transition: all 0.3s ease-in-out 0s;
}

.previous:hover > span::before {
    visibility: visible;
    -webkit-transform: scaleX(1.1);
    transform: scaleX(1.1);
}

.next svg {
    padding-top: 2px;
    position: relative;
}

.previous svg {
    padding-top: 2px;
    position: relative;
}

.input_label {
    display: flex;
    align-items: flex-end;
    text-transform: uppercase;
    color: #313131;
    font-weight: 100;
}

.input_label::placeholder {
    font-weight: normal;
}

.option_select {
    cursor: pointer;
    font-family: inherit;
    height: 42px;
    width: 100%;
    border-radius: 0px;
    color: #313131;
    background: #fff;
    border: 1px solid #dedede;
    padding-left: 10px;
    transition: all 0.3s ease-in-out;
}

.option_select:hover,
.option_select:focus,
.option_select:active {
    border-color: #cf0b5d;
}

.option_select option {
    font-family: inherit;
}

.text_input {
    cursor: text;
    font-size: 16px;
    width: 100%;
    border-radius: 0px;
    font-family: inherit !important;
    height: 42px;
    color: #313131;
    border: none;
    padding: 0px 0px 0px 16px;
    border: 1px solid #dedede;
    -webkit-box-shadow: inset 0px 0px 0px 0px #cf0b5d00;
    -moz-box-shadow: inset 0px 0px 0px 0px #cf0b5d00;
    box-shadow: inset 0px 0px 0px 0px #cf0b5d00;
    transition: all 0.3s ease-in-out;
}

.text_input:focus {
    -webkit-box-shadow: inset 0px -4px 0px 0px #cf0b5d;
    -moz-box-shadow: inset 0px -4px 0px 0px #cf0b5d;
    box-shadow: inset 0px -4px 0px 0px #cf0b5d;
}

#helpAreaContacterNous:hover,
#helpAreaTxtSaisieManuelle:hover {
    cursor: pointer;
}

#partenaireInscription input,
#partenaireContact input,
#partenaireContact textarea,
#icgContact input,
#icgContact textarea,
#icgContact select {
    border-radius: 0px;
    font-family: inherit;
}

#cookiePopup {
    margin-bottom: 48px;
    width: 100%;
    position: fixed;
    bottom: 0;
    display: flex;
    justify-content: space-between;
    padding: 0px 16px;
    align-items: center;
    background: white;
    border-top: 1px solid #dedede;
    flex-wrap: wrap;
    z-index: 110;
    display: none;
}

#cookiePopupWrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0px;
    width: 100%;
}

#cookiePopup button {
    background: none;
    border: 1px solid #313131;
    padding: 6px 8px;
    cursor: pointer;
}

#cookiePopup button:hover {
    background: #dedede;
}

@media screen and (min-width: 768px) {
    #demarche .mfp-content {
        position: relative;
        display: inline-block;
        vertical-align: middle;
        margin: 0 auto;
        text-align: left;
        z-index: 1045;
        background: white;
        width: 100%;
        max-width: 900px;
    }

    #demarche .mfp-container {
        top: 100px !important;
    }

    #helpAreaHeader,
    #helpAreaContent {
        width: 300px;
        right: 10px;
    }

    #cookiePopup {
        width: calc(100% - 310px) !important;
        height: 50px;
        margin-bottom: 0px;
        flex-wrap: nowrap;
    }

    #cookiePopupWrapper {
        padding: 0px !important;
        width: auto !important;
    }
}

#helpAreaHeader2 {
    display: none !important;
}

.btnDefautCommande {
    width: 280px;
    margin: 5px 0;
}

.titreGestionCommande {
    padding: 10px 10px;
    background-color: #cf0b5d;
    color: white;
    text-transform: uppercase;
}

#pageNumber {
    border: 1px solid #dedede;
}

#container-page-first,
#container-page-last {
    display: inline-flex;
    cursor: pointer;
}

#container-page-first:hover,
#container-page-last:hover {
    text-decoration: underline;
}

#page-previous,
#page-next {
    padding: 0px 16px;
    cursor: pointer;
}

#page-previous:hover,
#page-next:hover {
    text-decoration: underline;
}

#page-previous svg {
    margin-right: 4px;
}

#page-next svg {
    margin-left: 4px;
}

.divPagination {
    padding: 10px 10px;
    text-align: center;
    margin-bottom: 15px;
}

.divPagination button {
    background-color: #fff;
    border: 1px solid #fff;
    border-bottom: 1px solid #ececec;
    cursor: pointer;
    margin: 0 2px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.divPagination button:hover {
    border: 1px solid #aaa;
}

#gestion-unfold {
    text-align: center;
    transition: all 0.2s ease-in-out;
}

#gestion-unfold:hover {
    background-color: inherit;
    filter: brightness(0.9);
}

#gestion-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
}

#gestion-inner td {
    padding: 8px;
}

.iframeGestionCommande {
    border: none;
    width: 100%;
    height: 250px;
}

.iframeGestionCommandeEtapeFinale {
    border: none;
    width: 100%;
}

#pjEtapeFinale {
    width: 0.1px;
    height: 0.1px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    z-index: -1;
}

.txtBarre {
    text-decoration: line-through;
}

.modal-body {
    padding: 15px 0px !important;
}

#modalElement {
    padding: 15px !important;
}

.emailSpinner {
    display: none;
    background-color: white;
    border: none !important;
}

#filtrerCommandes {
    background: #cd0a5d;
    color: white;
    border: none;
    cursor: pointer;
    font-family: inherit;
    padding: 8px 12px;
}

@media screen and (max-width: 991px) AND (orientation: landscape) {
    #helpAreaHeader,
    #helpAreaContent {
        display: none !important;
    }

    #helpAreaHeader2 {
        display: block !important;
        position: fixed;
        text-align: center;
        background-color: #cf0b5d;
        z-index: 111;
        height: 50px;
        padding-top: 15px;
        color: white;
        width: 100%;
    }
}

#tablePaniersAbandonnesListeGlobale td,
#tableCommandesAbandonneesListeGlobale td,
#tableCommandesTermineesListeGlobale td,
#tableCommandesEnCoursListeGlobale td,
#tableCommandesSimuleesListeGlobale td {
    padding: 0px;
}

#tablePaniersAbandonnesListeGlobale th,
#tableCommandesAbandonneesListeGlobale th,
#tableCommandesTermineesListeGlobale th,
#tableCommandesEnCoursListeGlobale th,
#tableCommandesSimuleesListeGlobale th {
    padding: 8px;
    font-weight: 100;
}

#tablePaniersAbandonnesListeGlobale td .form-control,
#tablePaniersAbandonnesListeGlobale th .form-control,
#tableCommandesAbandonneesListeGlobale td .form-control,
#tableCommandesAbandonneesListeGlobale th .form-control,
#tableCommandesEnCoursListeGlobale td .form-control,
#tableCommandesEnCoursListeGlobale th .form-control,
#tableCommandesSimuleesListeGlobale td .form-control,
#tableCommandesSimuleesListeGlobale th .form-control,
#tableCommandesTermineesListeGlobale td .form-control,
#tableCommandesTermineesListeGlobale th .form-control {
    padding: 0.4rem;
}

#tablePaniersAbandonnesListeGlobale button,
#tableCommandesAbandonneesListeGlobale button,
#tableCommandesTermineesListeGlobale button,
#tableCommandesEnCoursListeGlobale button,
#tableCommandesSimuleesListeGlobale button {
    cursor: pointer;
}

#tableDetailCommande td,
#tableDetailCommande th,
#tablePaniersAbandonnesListeGlobale td,
#tablePaniersAbandonnesListeGlobale th,
#tableDetailCommandeVehicule td,
#tableDetailCommandeVehicule th,
#tableDetailCommandeClient td,
#tableDetailCommandeClient th,
#tableDetailPaiement td,
#tableDetailPaiement th,
#tableDetailPartenaire td,
#tableDetailPartenaire th,
#tableDetailOptions td,
#tableDetailOptions th {
    padding: 3px;
}

#numeroCommandeHeader {
    text-transform: uppercase;
}

#tablePaniersAbandonnesListeGlobale,
#pageSelectorContainerPaniersAbandonnes,
#tableCommandesTermineesListeGlobaleWrapper,
#tableCommandesAbandonneesListeGlobale,
#pageSelectorContainerCommandesAbandonnees {
    display: none;
}

.p-relative {
    position: relative;
}

.copied {
    display: none;
    color: #fff;
    background: #2b2b2b;
    font-size: 14px;
    text-transform: uppercase;
    position: absolute;
    top: 40px;
    left: -7px;
    white-space: nowrap;
    z-index: 99;
    padding: 2px;
}

.iframeGestionCommandeInternal form {
    margin: 0px;
}

#helpAreaWrapper {
    box-sizing: border-box;
    height: 48px;
    width: 100%;
    display: flex;
}

#helpAreaInputPlaque {
    text-align: center;
    border: 1px solid #eee;
    border-radius: 0px;
    text-transform: uppercase;
    font-size: 32px;
    color: #313131;
    font-family: inherit;
    width: calc(100% - 64px);
    line-height: 32px;
}

#helpAreaInputPlaque::placeholder {
    color: #ccc;
}

.footer_sub_wrapper {
    padding: 28px 0px;
}

@media (min-width: 576px) {
    .modal-dialog {
        max-width: 800px;
    }
}

#modalTarifUtilisateur #tableTarifUtilisateur td:last-child {
    display: flex;
}

#selDem {
    background-image: url('../images/bgSelDem.png');
    background-size: cover;
    height: 100%;
}

#selDemTitle {
    color: white;
    font-size: 48px;
    font-weight: bold;
    text-align: center;
    padding-top: 80px;
}

#selDemInner {
    width: 100%;
    display: flex;
    justify-content: center;
    margin: 64px 0px;
}

#selDemWrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-column-gap: 80px;
}

.selDemItem {
    padding: 16px;
    max-width: 300px;
    background: #eee;
    transition: all 0.2s ease-in-out;
}

.selDemItem:hover {
    background: white;
}

.selDemItem img {
    text-align: center;
    width: 80px;
    height: auto;
}

.selDemItem a {
    color: white !important;
}

.selDemImg {
    padding: 16px 0px;
    display: flex;
    justify-content: center;
}

@media screen and (max-width: 769px) {
    .navbar-brand {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .commercantIconeContainer {
        padding: 0px;
    }

    .bottom_footer {
        height: auto !important;
        padding: 16px 0px;
    }

    .footer_item {
        width: 100%;
        margin-bottom: 16px;
    }

    .footer_item_icone {
        display: none;
    }

    .footer_item_rens {
        display: none;
    }

    .footer_sub_wrapper {
        padding-top: 16px;
    }

    #messagePopup,
    #messagePopupCommercant {
        flex-wrap: wrap;
        padding: 8px;
    }

    #messagePopupCommercant {
        height: auto !important;
    }

    #popupWrapper2Commercant {
        height: 60vh;
    }

    #popupWrapper1 {
        padding: 16px 0px !important;
    }

    #popupWrapper2,
    #popupWrapper2Commercant {
        padding: 0px !important;
        text-align: center;
    }

    #popupWrapper2Commercant {
        text-align: left;
    }

    #imgPopupCommercant {
        width: 100px !important;
    }

    #imgPopup {
        width: 100px !important;
    }

    .titreDoc {
        font-weight: bold !important;
        color: white !important;
    }

    .modalDoc {
        grid-template-columns: 1fr;
    }

    #partenairePageMainHeader,
    #aproposPageMainHeader,
    #newsPageMainHeader,
    #successPageMainHeader,
    #mentionsPageMainHeader,
    #contactPageMainHeader,
    #faqPageMainHeader,
    #boxPageMainHeader {
        height: 100px;
    }

    #docPageMainHeader .divDemarcheContainer {
        width: 100%;
        margin-bottom: 0px;
    }

    #ggmap {
        margin-top: 25px;
        width: 100% !important;
    }

    #backofficeMainWrapper {
        flex-direction: column;
    }

    #backofficeContentMainWrapper {
        padding: 0px;
    }
}

.justify-template {
    justify-content: center;
}

@media screen and (max-width: 991px) {
    .justify-template {
        justify-content: space-around;
    }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {
    #logoSidebar {
        display: none !important;
    }

    .commercantIconeContainer {
        padding: 0px;
    }

    .footer_item_icone {
        display: none;
    }

    .footer_item_rens {
        display: none;
    }

    .footer_item {
        width: fit-content;
        margin-bottom: 0px;
    }

    .footer_sub_wrapper {
        padding: 24px 0px;
    }

    #popupWrapper2Commercant {
        height: 60vh;
    }

    /* Styles par défaut avec grille */


    /* Media query pour enlever la grille dès 1200px */


        #docPageMainHeader .divDemarcheContainer {
            width: 100%;
        }

        #ggmap {
            margin-top: 25px;
            width: 100% !important;
        }
}

.info-prix {
    text-transform: uppercase;
    font-weight: bolder;
}

.purple__text {
    color: #cf0b5d;
}

button,
li,
input,
select,
textarea,
.resultRechercheField,
.btnBackOffice,
#div_acc_4_societe,
#div_acc_4_particulier,
.divDemarche,
.divDemarcheContainer,
.label_flottant.form-control,
.OuiNonPlaque.container-check,
.div_acc_5,
.div_acc_5_sms,
.previous,
.next {
    border-radius: 4px !important;
   
}

#span_acc_2_box {
    margin-right: 5px;
}

.next.mt-2.contactPageEnvoyer {
    margin-top: 30px !important;
}

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

#helpAreaHeader {
    border-radius: 4px 4px 0 0 !important;
}

.svg__container {
    position: absolute;
}

.svg__head {
    position: absolute;
    width: 20rem;
    left: -11rem;
    top: -4.5rem;
}

#premierBandeauGaucheTop {
    margin-top: 130px;
}

.mfp-content {
    border-radius: 4px;
}

#btnDefaut2 {
    background: rgb(0, 128, 0);
}

.text__draw {
    position: absolute;
    left: 22.8px;
    z-index: -1;
}

.text__draw__active {
    filter: invert(71%) sepia(78%) saturate(1%) hue-rotate(355deg) brightness(100%) contrast(99%);
    opacity: 0.4;
    z-index: 5;
}

#fullAcc1 {
    border-top: 8px solid #ddd;
}

.navbar__top {
    background: #2e2e2e;
    color: #fff;
    display: flex;
    height: 77px;
    align-items: center;
    justify-content: center;
    padding: 20px 0;
    display: none;
}

#span_acc_5_prixTotal,
#text__pink {
    color: #ea066a;
}

@media screen and (min-width: 991px) {
    div[class^='col-md-12'] {
        padding: 0;
    }
}

@media screen and (max-width: 1500px) {
    
    .text__draw {
        position: absolute;
        left: 18.5px;
    }

    .text__draw__active {
        left: 18.5px;
    }
}

@media screen and (max-width: 1199px) {
    .text__draw {
        display: none;
    }

    .text__draw__active {
        display: none;
    }

    .navbar__top {
        display: none !important;
    }

    #fullAcc1 {
        border-top: 8px solid #ddd !important;
    }

    #fullAcc1_title {
        display: none !important;
    }

    .title__coord {
        display: none;
    }

    .panier_item {
        height: 15px;
    }

    .div_acc_5_paiement_choix {
        height: 80px;
    }
}

@media screen and (max-width: 1550px) {
    .btnimmat {
        display: none !important;
        visibility: hidden !important;
    }

    .btdupli {
        display: none !important;
        visibility: hidden !important;
    }   
}

@media screen and (max-width: 991px) {
    .svg__head {
        display: none;
    }

    #client_connexion {
        padding-top: 30px !important;
    }

    #fullAcc1 {
        border-top: 0px solid #ddd;
    }

    @keyframes anim-rotate {
        0% {
            transform: rotate(0);
        }

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

    .spinner {
        display: inline-block;
        font-size: 4em;
        height: 1em;
        line-height: 1;
        animation: anim-rotate 2s infinite linear;

        filter: invert(14%) sepia(63%) saturate(6429%) hue-rotate(326deg) brightness(85%) contrast(98%);
    }

    #fin_loading_popup {
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
    }

    .spinner--steps {
        animation: anim-rotate 1s infinite steps(8);
    }

    .spinner--steps2 {
        animation: anim-rotate 1s infinite steps(12);
    }

    #container-gestion {
        top: 70px;
    }
}

@media screen and (max-width: 1199px) {
    .sp_nb {
        padding: 3px 9px;
        color: #cf0b5b;
        background: #fff;
    }
}

#messagePopup_fermerMobile {
    display: none !important;
}

.br__align {
    display: none;
}

@media screen and (min-width: 1234px) and (max-width: 1460px) {
    #checkDemarche1,
    #checkDemarche2,
    #checkDemarche3 {
        display: none;
    }
}

@media screen and (max-width: 530px) {
    #checkDemarche1,
    #checkDemarche2,
    #checkDemarche3 {
        display: none;
    }
}

#spinnerReduction {
    display: none;
}

.divOuiNonPaiementProfil20 {
    position: relative;
    left: 10px;
}

@media screen and (max-width: 426px) {
    .responsiveSuccess {
        align-items: flex-end;
        justify-content: flex-start;
    }

    #description_etapes {
        display: none !important;
    }

    #sp1,
    #sp2,
    #sp3,
    #sp4,
    #sp5 {
        z-index: -99999;
    }
}

@media screen and (min-width: 530px) and (max-width: 991px) {
    .phraseContactQuestions {
        position: relative !important;
        left: 35% !important;
    }
}

@media screen and (min-width: 767px) and (max-width: 991px) {
    .phraseContact {
        position: relative !important;
        left: 10% !important;
    }

    .phraseContactQuestions {
        position: relative !important;
        left: 35% !important;
    }
}

@media screen and (min-width: 1201px) and (max-width: 4000px) {
    .stroke {
        width: 100%;
        display: inline-flex;
        justify-content: center;
    }
}

@media screen and (min-width: 770px) and (max-width: 1200px) {
    .stroke {
        width: 100%;
        display: inline-flex;
        justify-content: center;
    }
}

#teteMenu {
    padding: 20px;
    border-radius: 10px 10px 0 0;
    background: #d10667 !important;
}

#sousMenu {
    padding: 20px;
}

@media screen and (max-width: 500px) {
    #teteMenu {
        border-radius: 0 !important;
    }
}

#firstPartLink {
    padding: 16px;
}

.docPageMainHeader_menu_titre h1 {
    color: black;
}

.navbar-brand {
    display: contents;
    padding-top: 0.205rem;
    padding-bottom: 0.25rem;
    margin-right: 10rem;
    font-size: 1.25rem;
    line-height: inherit;
    white-space: nowrap;
}

.h1,
h1 {
    justify-content: center;    
    /* color: rgb(255, 255, 255); */
}

.btn-success {
    margin-top: 10px;
}

input.btn.btnBackOffice {
    font-weight: bold;
    color: #fff;
    background-color: #cf0b5d;
}

input.btn-success {
    color: #fff;
    background-color: #5cb85c;
    border-color: #5cb85c;
}

.btn-warning {
    margin-top: 10px;
    margin-left: 10px;
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

@media screen and (min-width: 1050px) and (max-width: 1300px) {
    #receptionDossier, .mobileRecep {
        display: none;
    }
}

@media screen and (max-width: 1049px) {
    .mobileDateCreation,
    .mobileNumeroSerie,
    #receptionDossier,
    .mobileRecep {
        display: none;
    }
}

@media screen and (min-width: 769px) {
    #headerMobile,
    #centrerBtnCommander {
        display: none;
    }
}

@media screen and (max-width: 768px) {
    #headerDesktop {
        display: none;
    }

    #commanderKitsMobile {
        width: 70%;
    }

    #commanderKits {
        display: none;
    }

    #tableauCommande {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    #commanderKitsMobile {
        padding: 0px 100px;
    }
}

.containerTablePadding {
    padding: 0 15px !important;
}

#boutonSuiviCG {
    display: flex;
    justify-content: space-evenly;
    width: 100%;
    margin-bottom: 50px;
}

#ajouterCommandeManuel {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(500px, 1fr));
    grid-gap: 30px;
    grid-auto-flow: dense;
    margin: 30px 30px 30px 30px;
}

#premierBlocAjoutCommande {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 30px;
}

#infoCommande {
    height: 100%;
}

.containerUploadFichier {
    display: flex;
}

#inputTexteCommentaire {
    border: 1px solid rgba(76, 76, 76, 0.5);
    border-width: 1px 0;
    border-radius: 0 !important;
    padding: 0 10px;
}

#containerAjoutFichierCommentaire {
    background: #cf0b5d;
    width: 110px !important;
    margin: 0;
    border-radius: 0 6px 6px 0;
}

#containerTextFichierCommentaire,
#containerEnvoiDoc {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 2px 10px;
    color: #fff;
    gap: 5px;
    cursor: pointer;
}

#containerEnvoiDoc {
    display: none;
}

#iconeDocumentCommentaire {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px 16px;
    background: #f1f1f1;
    border: 1px solid rgba(76, 76, 76, 0.5);
    border-radius: 6px 0 0 6px;
    cursor: pointer;
}

#ajoutDocumentCommentaire {
    font-weight: 200 !important;
}

#envoiDocumentCommentaire {
    font-weight: 200 !important;
}

#iconeCommentaireClientPoubelle {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#submitUploadFileClient {
    cursor: pointer;
    border: none;
    background: none;
    color: #fff;
    font-weight: 600;
    padding: 0px;
    margin: 0 !important;
}

#containerInfoClientTop {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
}

#containerInfoTop {
    text-align: center;
}

#nomClientTop {
    font-weight: bold;
    font-size: 21px;
}

.moduleGestionUtilisateur {
    padding: 12px 20px;
    background: #fff;
    border-radius: 4px;
    margin: 16px;
    filter: drop-shadow(0px 0px 4px rgba(0, 0, 0, 0.1));
}

.moduleGestionUtilisateurTitre {
    display: flex;
    justify-content: space-between;
    font-weight: bold;
    font-size: 19px;
    cursor: pointer;
}

.modal-header {
    border-radius: 14px 14px 0 0;
}

.modal-content {
    border-radius: 16px;
}

.modal-footer {
    border-radius: 0 0 14px 14px;
}

.boutonFermer {
    background: none;
    border: none;
    color: #fff;
    font-size: 21px;
}

.ouvert {
    background: red;
}

.svgTitreContainer {
    display: none;
}

.containerDropdown {
    position: relative;
    width: fit-content;
    cursor: pointer;
}

.labelDropdown {
    position: absolute;
    font-size: 15px;
    left: 12px;
    top: 12px;
    color: grey;
    opacity: 0.8;
    pointer-events: none;
}

.selectDropdown {
    padding: 30px 130px 9px 11px;
    font-weight: 600;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: 1px solid #dedede;
    transition: 0.3s;
}

.selectDropdown:focus {
    border: 1px solid var(--rose-color);
    transition: 0.3s;
}

.flecheDropdown {
    position: absolute;
    display: flex;
    height: 35%;
    align-items: center;
    top: 50%;
    transform: translateY(-50%);
    right: 8px;
    border-left: 2px rgba(179, 179, 179, 0.5) solid;
    width: 30px;
    pointer-events: none;
}

.svgDropdown {
    width: 34px;
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.containerInput {
    position: relative;
    padding: 0;
}

.inputInput {
    font-weight: 600;
    padding: 28px 0 8px 0px;
    border: 1px solid #dedede !important;
    transition: 0.4s;
    padding-left: 10px;
}

.inputInput:focus {
    border: 1px solid var(--rose-color);
}

.labelInput {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 10px;
    transition: 0.4s;
    cursor: text;
}

.inputInput:focus + .labelInput {
    left: 10px;
    top: 10px;
    font-size: 15px;
    color: grey;
    transition: 0.4s;
    transform: translateY(0);
}

.inputInput:not([value='']):not(:focus) + .labelInput {
    left: 10px;
    top: 10px;
    font-size: 15px;
    color: grey;
    transition: 0.4s;
    transform: translateY(0);
}

#containerCoordonnees {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 16px;
}

#div_acc_4_particulier {
    grid-column: 1 / span 2;
}

#div_acc_4_societe {
    grid-column: 3 / span 2;
}

.sa-button-container {
    display: -webkit-flex !important;
    display: flex !important;
    -webkit-justify-content: center !important;
    justify-content: center !important;
}

.sa-button-container .cancel {
    -webkit-order: 2 !important;
    order: 2 !important;
}

.sa-button-container .sa-confirm-button-container {
    -webkit-order: 1 !important;
    order: 1 !important;
}

.swal2-file:focus,
.swal2-input:focus,
.swal2-textarea:focus {
    border: 1px solid #d9d9d9 !important;
    box-shadow: none !important;
}

.swal2-styled.swal2-default-outline:focus {
    box-shadow: none !important;
}

.swal-button {
    border: none;
    background-color: #cf0b5d;
    cursor: pointer;
}

.swal-text {
    text-align: center;
}

.swal-button:not([disabled]):hover {
    background-color: #cf0b5d;
}

.swal-button:focus {
    box-shadow: none;
}

.label-Button {
    background-color: #cf0b5d;
}

#email {
    text-transform: lowercase;
}

#immat {
    border: solid 1px rgb(118 118 118);
}

#nom {
    border: solid 1px rgb(118 118 118);
}

#numPass {
    border: solid 1px rgb(118 118 118);
}

@-moz-document url-prefix() {
    select {
        border: none;
        border-radius: none;
        border: 1px solid rgb(118 118 118);
        border-radius: 5px;
    }
}

#inputFileContact {
    border: 1px solid #dedede;
    border-radius: 6px 0 0 6px !important;
    padding: 0 10px;
}

@media screen and (max-width: 1473px) {
    .Choix {
        font-size: 0;
    }

    .Choix::after {
        content: 'Choisissez';
        font-size: initial;
    }
}

.mwFilter {
    max-width: 100%;
    margin-top: 15px;
    margin-bottom: 15px;
}

@media screen and (max-width: 815px) {
    #receptionDossier {
        font-size: 0px;
    }

    #receptionDossier::after {
        font-size: initial;
        content: 'Réceptionné ?';
    }
}

@media screen and (max-width: 766px) {
    .w-1001 {
        width: 100%;
    }

    #nom #immat {
        border: solid 1px rgb(118 118 118);
    }

    #suiviCarteGrise div #filtreCommandes span select {
        width: 100% !important;
    }

    #suiviCarteGrise div #divFilterCommercant span select {
        width: 100% !important;
    }
}

@media screen and (min-width: 767px) {
    #nom #immat {
        width: 180px !important;
        border: solid 1px rgb(118 118 118);
    }

    #selectMonth {
        width: 145px !important;
    }

    #selectYear {
        width: 80px !important;
    }

    #selectEtat {
        width: 255px !important;
    }

    #btnFiltrerCommandes {
        width: 100px !important;
    }
}

.nextseconnect {
    cursor: pointer;
    padding: 0px 20px;
    height: 48px;

    color: black;
    font-family: inherit;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: 0.2s background ease-in-out;
}

@media screen and (max-width: 414px) {
    #btn_retourBack {
        font-size: 0;
        margin-bottom: 10px !important;
        width: 200px;
    }

    #btn_retourBack::before {
        font-size: initial;
        content: 'Retour au back-office';
    }

    #btn_ajoutCommande {
        font-size: 0;
        width: 200px;
    }

    #btn_ajoutCommande::before {
        font-size: initial;
        content: 'Commande Manuel. +';
    }

    #immat {
        width: 200px !important;
    }

    #nom {
        width: 100% !important;
    }

    #typeAchat {
        width: 200px !important;
    }

    #numPass {
        width: 200px !important;
    }

    #raz {
        width: 200px !important;
    }

    #pass {
        width: 100% !important;
    }

    #prix {
        width: 100% !important;
    }

    #btnFiltrerCommandes {
        width: 200px !important;
    }

    #btnFiltrerCommandesSupprimees {
        width: 200px !important;
    }

    #supprimerSelection {
        width: 200px !important;
    }

    #selectMoisAnnee {
        display: flex !important;
        flex-direction: column;
        align-items: flex-start;
    }

    #moisAnneeSelect {
        padding-top: 10px !important;
        padding-bottom: 30px;
        height: 80px !important;
    }

    #suiviCarteGrise div #filtreCommandes span input,
    #suiviCarteGrise div #filtreCommandes span select {
        width: 100% !important;
    }

    #suiviCarteGrise div #filtreCommandes span.filterBtn {
        text-align: center;
    }
}

.filtreCommande {
    margin-top: 10px;
    margin-left: 0.5vw;
    margin-right: 0.5vw;
    border: solid 1px rgb(118 118 118);
    border-radius: 4px;
    min-width: 210px;
    max-width: 210px;
}

.filtreCommande:first-child {
    margin-left: 0;
}

.filtreCommande > button {
    width: 100%;
    justify-content: space-between;
}

#filtresGestionCommandes {
    display: flex;
    align-items: stretch;
    border-right-width: 50px;
    justify-content: flex-start;
    height:100%
}

#filtresGestionCommandes > #filtreCommandes {
    gap: 8px;
}

#filtresGestionCommandes .filtreCommande {
    margin: 0;
    background-color: rgb(246, 246, 246) !important;
}

#filtresGestionCommandes #afficherFiltres {
    text-wrap: nowrap;
    cursor: pointer;
    margin-left: 5px;
    flex: 2;
    color: #cf0b5d;
}

#selectDay,
#selectDay2 {
    width: max-content !important;
}

#selectMonth,
#selectMonth2 {
    width: max-content !important;
}

#selectYear,
#selectYear2 {
    width: max-content !important;
}

#selectDayReception,
#selectDayReception2 {
    width: max-content !important;
}

#selectMonthReception,
#selectMonthReception2 {
    width: max-content !important;
}

#selectYearReception,
#selectYearReception2 {
    width: max-content !important;
}

#selectDayEnd,
#selectDayEnd2 {
    width: max-content !important;
}

#selectMonthEnd,
#selectMonthEnd2 {
    width: max-content !important;
}

#selectYearEnd,
#selectYearEnd2 {
    width: max-content !important;
}

@media screen and (min-width: 992px) {

    .docPageMainHeader_menu_titre h1 {
        display: flex;
       justify-content: center; 
    }

    #maintenanceMode {
        position: fixed;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 91%;
        z-index: 11;
        background: linear-gradient(135deg, #8c0e43 20%, #cf0b5d);
    }

    #maintenanceModeTexte {
        text-align: center;
        max-width: 55%;
        color: white;
        z-index: 2;
    }

    #maintenanceModeTitre {
        font-size: 5.5vw;
    }

    #maintenanceModePhrase {
        font-size: 1.6vw;
        padding-top: 5%;
    }

    #maintenanceModeRemerciements {
        font-size: 1vw;
        padding-top: 7%;
    }

    #maintenanceModeLogo {
        display: flex;
        position: absolute;
        width: 100%;
        justify-content: flex-end;
        bottom: 0;
        z-index: 1;
    }

    #logoMaintenanceMode {
        width: 25%;
    }
}

@media screen and (max-width: 992px) {

    .docPageMainHeader_menu_titre h1 {
        display: flex;
       justify-content: center; 
    }
    
    #maintenanceMode {
        position: fixed;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 94%;
        z-index: 11;
        background: linear-gradient(180deg, #8c0e43 20%, #cf0b5d);
    }

    #maintenanceModeTexte {
        text-align: center;
        max-width: 100%;
        color: white;
        z-index: 2;
        padding-top: 20em;
    }

    #maintenanceModeTitre {
        font-size: 9vw;
    }

    #maintenanceModePhrase {
        font-size: 3vw;
        padding-top: 5%;
    }

    #maintenanceModeRemerciements {
        font-size: 2vw;
        padding-top: 7%;
    }

    #maintenanceModeLogo {
        display: flex;
        position: absolute;
        width: 100%;
        justify-content: center;
        top: 0;
        z-index: 1;
    }

    #logoMaintenanceMode {
        width: 50%;
    }
}

@media screen and (max-width: 770px) {
    #maintenanceMode {
        position: fixed;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 94%;
        z-index: 11;
        background: linear-gradient(180deg, #8c0e43 20%, #cf0b5d);
    }

    #maintenanceModeTexte {
        text-align: center;
        max-width: 100%;
        color: white;
        z-index: 2;
        padding-top: 15em;
    }

    #maintenanceModeTitre {
        font-size: 11vw;
    }

    #maintenanceModePhrase {
        font-size: 4vw;
        padding-top: 5%;
    }

    #maintenanceModeRemerciements {
        font-size: 3vw;
        padding-top: 7%;
    }

    #maintenanceModeLogo {
        display: flex;
        position: absolute;
        width: 100%;
        justify-content: center;
        top: 0;
        z-index: 1;
    }

    #logoMaintenanceMode {
        width: 50%;
    }
}

@media screen and (max-width: 415px) {
    #maintenanceMode {
        position: fixed;
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        width: 100%;
        height: 91%;
        z-index: 11;
        background: linear-gradient(180deg, #8c0e43 20%, #cf0b5d);
    }

    #maintenanceModeTexte {
        text-align: center;
        max-width: 100%;
        color: white;
        z-index: 2;
        padding-top: 10em;
    }

    #maintenanceModeTitre {
        font-size: 12vw;
    }

    #maintenanceModePhrase {
        font-size: 4vw;
        padding-top: 5%;
    }

    #maintenanceModeRemerciements {
        font-size: 3vw;
        padding-top: 7%;
    }

    #maintenanceModeLogo {
        display: flex;
        position: absolute;
        width: 100%;
        justify-content: center;
        top: 0;
        z-index: 1;
    }

    #logoMaintenanceMode {
        width: 60%;
    }
}

#div-AllVideo {
    display: flex;
    justify-content: center;
}

#div-AllVideo .div-video {
    display: flex;
    flex-direction: column;
    margin: 5rem;
}

#div-AllVideo .div-video h4 {
    margin-bottom: 1.7rem;
}

#div-AllVideo .div-video video,
#div-AllVideo .div-video h4 {
    align-self: center;
    text-align: center;
}

#div-textNosTutos {
    background-color: rgb(230, 230, 230);
    border-radius: 5px;
    text-align: center;
    margin: 1rem;
    padding: 1.3rem;
}

@media screen and (max-width: 1292px) {
    #div-AllVideo {
        display: flex;
        justify-content: center;
        flex-direction: column;
    }

    #div-AllVideo .div-video video {
        width: 80%;
    }
}

@media screen and (max-width: 769px) {
    #div-AllVideo {
        display: flex;
        justify-content: center;
        flex-direction: column;
    }

    #div-AllVideo .div-video video {
        width: 100%;
    }
}

.sendMailInvoice {
    cursor: pointer;
}

button {
    cursor: pointer;
}

.trashSvg {
    position: absolute;
    top: 0;
    right: 0;
    width: 7%;
    filter: opacity(0.5);
    transform: translate(-50%, 50%);
    transition: filter 0.2s ease-in-out;
    cursor: pointer;
}

.trashSvg:hover {
    filter: opacity(1);
}

.itemTextQteAuto {
    width: 60%;
    height: 3rem;
    margin-top: 10px;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10px;
    font-size: 18px;
    border-bottom: 1px solid gray;
}

.itemTextQteAuto:hover {
    background-color: #cf0b5d;
    color: white;
}

.markerCounter {
    position: relative;
}
.markerCounter::before {
    content: attr(data-num);
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #cf0b5d;
    color: white;
    display: grid;
    place-items: center;
    float: left;
    margin-top: 10px;
    margin-right: 10px;
}

.arrowRight::after {
    content: '';
    display: inline-block;
    margin-left: 10px;
    width: 8px;
    height: 8px;
    border-right: solid 2px white;
    border-top: solid 2px white;
    transform: rotateZ(45deg);
}

@media screen and (max-width: 480px) {
    .btnMapPartenaires {
        display: none;
    }
}

#identiteSelector p {
    text-wrap: nowrap;
}

#identiteSelector input {
    width: 100%;
    margin-bottom: 20px;
}

#dateSelector p {
    display: inline-block;
    margin-left: 5px;
    margin-bottom: 10px;
}

#dateSelector > div:not(:first-child) {
    margin-top: 20px;
}

.dateSelectorContainers {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.dateSelectorContainers:not(:last-child) {
    margin-bottom: 10px;
}

.dateSelectorContainers > select {
    border-width: 0 0 1px 0;
    border-radius: 0 !important;
}

.userFilesTitle {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
    margin-bottom: 0.5rem;
}

.userFilesTitle h4 {
    margin: 0;
}

.fileWrapper {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
}

.fileWrapper .file {
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    padding: 5px;
    background-color: #cbcbcb;
    border-radius: 5px;
    display: flex;
    justify-content: space-between;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
}

.fileWrapper .file:hover {
    background-color: #cf0b5d;
    color: white;
}

.fileWrapper .file:hover a {
    color: white;
}

.fileWrapper .file a::before {
    content: '';
    display: inline-block;
    height: 100%;
    aspect-ratio: 1;
    background-size: contain;
    background-repeat: no-repeat;
    margin-right: 5px;
}

.fileWrapper .file a {
    text-decoration: none;
    color: black;
    display: flex;
    align-items: center;
    transition: all 0.2s ease-in-out;
}

.file.pdf a::before {
    background-image: url('/images/pdf.png');
}

.file.zip a::before {
    background-image: url('/images/zip.png');
}

.file.png a::before {
    background-image: url('/images/image.png');
}

.file.other a::before {
    background-image: url('/images/other.png');
}

.file .remove {
    margin-left: 5px;
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    width: 20px;
}

.file .remove svg {
    width: 90%;
    height: 90%;
}

.headerCommandesLBDB {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.headerCommandesLBDB .filtres {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.filtreDates {
    display:flex; 
    gap: 10px; 
    align-items: center;
}

.filtreCommandeLBDB {
    margin-left: 50px;
}

.filtreCommandeLBDB input {
    width: 150px;
    padding: 6px 10px 5px 10px;
}

.bouttonFiltrer {
    display: flex;
    width: 100%;
    justify-content: left;
    margin-left: 100px;
}

#divPageGlobal {
    display: flex;
    justify-content: center;
    gap: 20px;
    font-weight: bold;
    font-size: large;
}

#divPageGlobal span:hover {
    text-decoration: underline;
    cursor: pointer;
}

.ListeCommandes {
    --main-color: #cf0b5d;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;

    background-color: #f5f5f5;
    padding: 20px;
    border-radius: 5px;
    /* max-height: 50vh;
    overflow-y: scroll; */
}

.ListeCommandes::-webkit-scrollbar {
    width: 10px;
    background-color: #f5f5f5;
}
.ListeCommandes::-webkit-scrollbar-thumb {
    background-color: var(--main-color);
    border-radius: 5px;
}

.ListeCommandes .commande {
    --padding: 1rem;
    /* --main-color: #0275d8; */
    display: grid;
    grid-template-columns: 0fr 0.8fr 0.3fr 0.5fr 0.3fr 0.1fr;
    background-color: white;
    width: 100%;
    padding: var(--padding);
    border-radius: 5px;
    border: 1px solid var(--main-color);
    gap: 60px;
}

.ListeCommandes .commande a {
    color: var(--main-color);
}

.ListeCommandes .commande > * {
    place-items: center;
    width: 100%;
    height: 100%;
    position: relative;
    text-align: center;

    display: flex;
    justify-content: center;
    align-items: center;
}
.ListeCommandes .commande > :nth-child(n + 2):before {
    content: '';
    position: absolute;
    top: calc(var(--padding) * -1);
    left: -30px;
    height: calc(100% + var(--padding) * 2);
    border-left: 1px solid var(--main-color);
}

#modalCommandePrio {
    background-color: #fff;
    padding: 10px;
    width: 300px;
    height: 70px;
    display: flex;
    visibility: hidden;
    z-index: 100;
    gap: 5px;
    border-radius: 6px;
    align-items: center;
    box-shadow: 8px 11px 13px 0px rgba(0, 0, 0, 0.25);
}

#modalCommandePrio select {
    flex: 5;
    height: 100%;
    border-radius: 3px;
    border: 1px solid #b9b9b9;
}

#modalCommandePrio button {
    flex: 1;
    height: 100%;
    border-radius: 3px;
    aspect-ratio: 1;
    background-color: #acacac;
    border: none;
    cursor: not-allowed;
}

#modalCommandePrio button svg {
    width: 80%;
    aspect-ratio: 1;
}

#modalCommandePrio button.valide {
    background-color: #72d476;
    cursor: pointer;
}

#modalCommandeNonTraite {
    background-color: #fff;
    padding: 10px;
    width: 300px;
    height: 70px;
    display: flex;
    visibility: hidden;
    z-index: 100;
    gap: 5px;
    border-radius: 6px;
    align-items: center;
    box-shadow: 8px 11px 13px 0px rgba(0, 0, 0, 0.25);
}

#modalCommandeNonTraite select {
    flex: 5;
    height: 100%;
    border-radius: 3px;
    border: 1px solid #b9b9b9;
}

#modalCommandeNonTraite button {
    flex: 1;
    height: 100%;
    border-radius: 3px;
    aspect-ratio: 1;
    background-color: #acacac;
    border: none;
    cursor: not-allowed;
}

#modalCommandeNonTraite button svg {
    width: 80%;
    aspect-ratio: 1;
}

#modalCommandeNonTraite button.valide {
    background-color: #72d476;
    cursor: pointer;
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(29rem / 3);
}

#colonneValeurVilleNaissance,
#colonneValeurAdresse,
#colonneValeurCodePostal,
#colonneValeurVille
{
    position: relative;
}

#div-autoCompletionAdresse-input-colonneValeurVilleNaissance,
#div-autoCompletionAdresse-input-colonneValeurAdresse,
#div-autoCompletionAdresse-input-colonneValeurCodePostal,
#div-autoCompletionAdresse-input-colonneValeurVille {
    position: absolute;
    top: -2px;
    left: calc(100% + 10px);
    max-height: 145px; overflow: auto;
}