.test_drag_drop {

    .step_td {
        border: 1px solid #d5d8dc;
        border-collapse: collapse;
    }

    .parent {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: 1fr;
        grid-column-gap: 0px;
        grid-row-gap: 0px;
        height: 10rem;
    }

    .div1 {
        grid-area: 1 / 1 / 2 / 2;
        background: #9cf;
    }

    .div2 {
        grid-area: 1 / 2 / 2 / 3;
        background: #c8cfd5;
    }

    .div3 {
        grid-area: 1 / 3 / 2 / 4;
    }

    .mainGrid {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        flex-wrap: wrap;
        height: 100vh;
    }

    .header {
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        flex-wrap: wrap;
        background-color: rgb(205, 240, 240)
    }

    .column {
        width: 32vw;
        display: flex;
        flex-direction: column;
        border: 5px solid grey;
        background-color: azure;
        overflow: hidden;
    }

    .card {
        border: 1px solid #d5d8dc;
        background-color: white;
    }

    .card p {
        font-size: 10px;
        width: 30vw;
    }

    .heading {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;

    }

    .addButton {
        position: absolute;
        top: 2.5%;
        left: 0%;
    }

    .addForm {
        height: 50vh;
        width: 50vw;
        background-color: lightblue;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
        position: absolute;
        top: 25%;
        left: 25%;
    }

    .addForm form {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column;
    }

    .test01 {
        font-size: 3rem;
        // color: red;
        font-weight: bold !important;
    }

    .test02 {
        font-size: 5px !important;
        // color: burlywood;
        font-weight: normal;
    }

    .test03 {
        text-align: left !important;
        font-size: x-small;
        //background-color: #464b5e !important;
    }

    .css-hytcpw {
        max-width: 100% !important;
    }

    .tooltip_css {
        //background: #81BC3A;
        z-index: 9999;
    }

    .css-1bcfi89-MuiTreeItem-content .MuiTreeItem-iconContainer {
        font-size: 5px !important;
    }

    .bton_action_server {
        box-shadow: 0 0 5px -1px rgba(0, 0, 0, 0.2);
        display: inline-block;
        text-align: center;
        cursor: pointer;

        background: #d8edfc;
        border-radius: 15px;
        margin-right: 1rem;

        text-align: left;
        border: 1px solid #9cf;
        color: #3b3e40;
        font-family: "DM Sans", "sans-serif";
        font-size: small;
        letter-spacing: 0.1rem;
        font-weight: normal;
        width: 100%;
        padding-left: 10px;
    }

    .modal {
        position: fixed;
        z-index: 9999;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: #464b5e;
        color: white;
        outline: none;
        padding: 3.2rem;
        text-align: center;
    }

    .fc-view-harness {
        height: 35rem !important;
    }

    .Mui-disabled {
   font-family:'DM Sans','Sans-serif';
        font-size: small !important;
        padding: 0px !important;
        padding-left: 5px !important;
    }



    @media screen and (max-width: 600px) {
        .okUpdateData {
            font-size: small;
            color: green;
            font-style: italic;
        }

        .koUpdateData {
            font-size: small;
            color: red;
            font-style: italic;
        }

        .div_row {
            float: left;
            //border: 1px solid #d5d8dc;
            border-width: 0.01rem;
            width: 100%;
            margin-bottom: 1rem;
            border-radius: 1rem;
        }

        .div_row_gauche {

            width: 100%;
            border-radius: 10rem !important;
            text-align: left;

            margin: 0px !important;
            margin-bottom: 0.5rem !important;
            margin-top: 0.5rem !important;
        }

        .div_row_droite {
            width: 100%;
            border-radius: 10rem !important;
            text-align: left;

            margin: 0px !important;
            margin-bottom: 0.5rem !important;
            margin-top: 0.5rem !important;
        }

        .selectsession {
            width: 90%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .titre1_aide_finance {
            margin-top: 1rem;
            font-family: "DM Sans", "sans-serif";
            font-size: medium;
            text-align: center;
            margin-bottom: 0.8rem;
            color: white;
            cursor: pointer;
            font-style: italic;
            background-color: gray;
            font-weight: normal;
        }

        .pieddepage {
            z-index: 50;
            width: 100%;
            float: left;
            margin-top: 12rem;
        }

        .div_mobile {
            position: absolute;
            top: 8rem;
            z-index: 1;
            width: 100%;
        }

        .zone_data {
            width: 95%;
            margin-left: auto;
            margin-right: auto;
        }

        .detail_class_submenu {
            background: #d8edfc;
            border-radius: 15px;
            margin-right: 1rem;
            padding: 0.3rem;
            margin-bottom: 0.5rem;
            width: 10.5rem;
            text-align: center;
            border: 1px solid #9cf;
            color: #3b3e40;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            letter-spacing: 0.1rem;
            font-weight: normal;
            width: 100%;
        }

        .detail_class_submenu:hover:active,
        .detail_class_submenu:hover {
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu:focus {
            //border: 3px dotted green;
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu_data {
            width: 100%;
            min-height: 10rem;
            background-color: #d8edfc;
            padding-left: 5px;
            text-align: left;
            padding: 0;
            border: 0px;
            color: #3b3e40;
            padding-left: 5px;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            border-radius: 10px;
            border: 1px solid;
        }


        .training_caract {
            width: 100%;
            padding: 5px;
            float: left;
        }

        .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input .Mui-disabled {
   font-family:'DM Sans','Sans-serif';
            font: inherit;
            letter-spacing: inherit;
            color: currentColor;
            border: 0;
            box-sizing: content-box;
            background: none;
            background-color: rgba(0, 0, 0, 0);
            margin: 0;
            -webkit-tap-highlight-color: transparent;
            display: block;
            min-width: 0;
            width: 100%;
            -webkit-animation-name: mui-auto-fill-cancel;
            animation-name: mui-auto-fill-cancel;
            -webkit-animation-duration: 10ms;
            animation-duration: 10ms;
            height: 3rem !important;
            padding: 0 !important;
            padding-left: 5px !important;
        }

        .css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input {
            padding: 1px !important;
            padding-right: 1rem !important;
        }

        .selectsession {
            width: 100%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .session_data {
            float: left;
            width: 100%;
            box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            border-radius: 10px;
            margin-top: 10px;
            margin-bottom: 10px;


        }

        .session_caract {
  font-family: DM Sans;
            width: 100%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_caract_comment_2_lines {
            width: 100%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 100% !important;
            height: 2rem !important;
            margin: 5px !important;
        }

        .css-1x5jdm {
            padding: 5px;
        }

        .css-1x5jdmq {
            padding: 6px !important;
            padding-bottom: 0px !important;
        }

        .css-qiwgdb {
            padding: 6px !important;
        }

        .preview_certif {
            display: block;
            width: 100%;
            height: 180px;
            border-radius: 1rem !important;
            margin-top: 1rem !important;
        }

        .hr_break {
            border: 2px solid grey;
        }

        .icon_plus {
            width: 6%;
        }


        .icon_plus_line {
            width: 3%;
        }

        .bton_add_session {
            background: #c8cfd5;
            color: black;
            width: 100%;
        }

        .bton_add_sous_menu {
            background: #c8cfd5;
            color: black;
            width: 100%;
        }

        .bton_import_excel {
            background: #c8cfd5;
            color: black;
            width: 100% !important;
        }

        .div_row_gauche_etendu {
            width: 100%;
        }

        .icon_excel {
            width: 6%;
        }


        .bton_suppr {
            background: transparent;
            color: red;
            border-radius: 5rem;
            font-size: small;
            text-align: center;
            height: 2.5rem;
            width: 100%;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_enreg {
  font-family: DM sans;
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 100%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_edit {
            border-radius: 5rem;
            font-size: small;
            background: black !important;
            text-align: right;
            height: 2.5rem;
            width: 100%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_annule {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 100%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }

        .div_row_gauche_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
        }

        .div_row_droite_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            padding-left: 0.2rem;
        }

        .tips_img_class {
            font-size: smaller;
            font-style: italic;
            margin-left: 1rem !important;
            text-align: left;
            float: left;
            width: 100%;
            padding-right: 10px;
        }

        .img_class_logo {
            display: block;
            width: 128px;
            height: 128px;
            border-radius: 10px !important;
            border: 1px solid #d5d8dc;
            float: left;
        }

        .bton_supprime_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            background: white;
            color: red;
            margin-top: 0.5rem;
            width: 10rem;
            cursor: pointer;
        }

        .bton_supprime_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .bton_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            width: 10rem;
            cursor: pointer;
        }

        .bton_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .tick_ok_ko {
            max-width: 3%;
            cursor: pointer;
            padding-top: 4px;
        }

        .texte_area {
            float: left;
            width: 47% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 1.5rem !important;
        }

        .texte_area_filter {
            float: left;
            width: 100% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin-top: 0px !important;
            margin-bottom: 2px !important;
        }

        .texte_area_filter_value {
            float: left !important;
            width: 100% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;

        }


        .filter_bton_add {
            float: left;
            width: 40% !important;
            font-size: xx-large !important;
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;
            text-align: right;
            cursor: pointer;
        }


        .div_row {
            float: left;
            border-width: 0.01rem;
            width: 100%;

            border-radius: 1rem;
        }

        .div_row_gauche {
            float: left;
            width: 100%;
            border-radius: 1rem;
            text-align: left;
        }

        .div_row_droite {
            float: left;
            width: 100%;
            border-radius: 1rem;
            text-align: left;

        }

        .bton_suppr {
            background: transparent;
            color: red;
            border-radius: 5rem;
            font-size: small;
            text-align: center;
            height: 2.5rem;
            width: 100%;
            margin-left: 10px;
            margin-right: 10px;
            margin-bottom: 1rem !important;
        }

        .bton_enreg {
  font-family: DM sans;
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 100%;
            color: white;
            margin-bottom: 1rem !important;
        }

        .bton_edit {
            border-radius: 5rem;
            font-size: small;
            background: black !important;
            text-align: right;
            height: 2.5rem;
            width: 100%;
            color: white;
            margin-bottom: 1rem !important;
        }

        .bton_annule {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 100%;
            color: black;
            margin-bottom: 1rem !important;
        }


        .css-1t10bd6-MuiFormControl-root-MuiTextField-root fieldset {
            border-color: transparent !important;
            border-radius: 20px !important;
        }

        .disabled_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 100% !important;
            height: 3.5rem !important;

            //border: none !important;
            border-radius: 5px;
            background: white;
            border: solid gainsboro 1px;
            //padding-left: 5px !important;

        }

        .training_caract {
            width: 100%;

            float: left;
        }

        .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input .Mui-disabled {
   font-family:'DM Sans','Sans-serif';
            font: inherit;
            letter-spacing: inherit;
            color: currentColor;
            border: 0;
            box-sizing: content-box;
            background: none;
            background-color: rgba(0, 0, 0, 0);
            margin: 0;
            -webkit-tap-highlight-color: transparent;
            display: block;
            min-width: 0;
            width: 100%;
            -webkit-animation-name: mui-auto-fill-cancel;
            animation-name: mui-auto-fill-cancel;
            -webkit-animation-duration: 10ms;
            animation-duration: 10ms;
            height: 3rem !important;
            padding: 0 !important;
            padding-left: 5px !important;
        }

        .css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input {
            padding: 1px !important;
            padding-right: 1rem !important;
        }

        .block_en_mass {
            width: 100%;
            float: left;
            margin-bottom: 1rem;
        }

        .block_en_mass_select {
            width: 100%;
            float: left;
            margin-bottom: 1rem;
        }

        .block_en_mass_bton_action {
            width: 100%;
            float: left;
            margin-bottom: 1rem;
            padding-top: 0.5rem !important;
        }

        .bton_enreg_dialog {
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 100%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_annule_dialog {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 100%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_supprime_dialog {
            border-radius: 5rem;
            font-size: small;
            background: rgb(224, 89, 89) !important;
            text-align: right;
            height: 2.5rem;
            width: auto;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
            padding-right: 5px;
            padding-left: 5px;
        }

        .DialogContent_width {
            width: 200px !important;
        }
    }

    @media only screen and (min-width: 601px) and (max-width: 991px) {
        .okUpdateData {
            font-size: small;
            color: green;
            font-style: italic;
        }

        .koUpdateData {
            font-size: small;
            color: red;
            font-style: italic;
        }

        .selectsession {
            width: 90%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .titre1_aide_finance {
            margin-top: 1rem;
            font-family: "DM Sans", "sans-serif";
            font-size: medium;
            text-align: center;
            margin-bottom: 0.8rem;
            color: white;
            cursor: pointer;
            font-style: italic;
            background-color: gray;
            font-weight: normal;
        }

        .pieddepage {
            z-index: 50;
            width: 100%;
            float: left;
            margin-top: 12rem;
        }

        .div_mobile {
            position: absolute;
            top: 8rem;
            z-index: 1;
            width: 100%;
        }

        .zone_data {
            width: 95%;
            margin-left: auto;
            margin-right: auto;
        }

        .detail_class_submenu {
            background: #d8edfc;
            border-radius: 15px;
            margin-right: 1rem;
            padding: 0.3rem;
            margin-bottom: 0.5rem;
            width: 11rem;
            text-align: center;
            border: 1px solid #9cf;
            color: #3b3e40;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            letter-spacing: 0.1rem;
            font-weight: normal;
        }

        .detail_class_submenu:hover:active,
        .detail_class_submenu:hover {
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu:focus {
            //border: 3px dotted green;
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu_data {
            width: 100%;
            min-height: 10rem;
            background-color: #d8edfc;
            padding-left: 5px;
            text-align: left;
            padding: 0;
            border: 0px;
            color: #3b3e40;
            padding-left: 5px;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            border-radius: 10px;
            border: 1px solid;
        }

        .disabled_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 90% !important;
            height: 3.5rem !important;
            margin: 5px !important;
            //border: none !important;
            border-radius: 5px;
            background: white;
            border: solid gainsboro 1px;
            //padding-left: 5px !important;
        }

        .training_caract {
            width: 48%;
            padding: 5px;
            float: left;
        }

        .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input .Mui-disabled {
   font-family:'DM Sans','Sans-serif';
            font: inherit;
            letter-spacing: inherit;
            color: currentColor;
            border: 0;
            box-sizing: content-box;
            background: none;
            background-color: rgba(0, 0, 0, 0);
            margin: 0;
            -webkit-tap-highlight-color: transparent;
            display: block;
            min-width: 0;
            width: 100%;
            -webkit-animation-name: mui-auto-fill-cancel;
            animation-name: mui-auto-fill-cancel;
            -webkit-animation-duration: 10ms;
            animation-duration: 10ms;
            height: 3rem !important;
            padding: 0 !important;
            padding-left: 5px !important;
        }

        .css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input {
            padding: 1px !important;
            padding-right: 1rem !important;
        }

        .selectsession {
            width: 90%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .session_data {
            float: left;
            width: 100%;
            box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            border-radius: 10px;
            margin-top: 10px;
            margin-bottom: 10px;


        }

        .session_caract {
  font-family: DM Sans;
            width: 50%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_caract_comment_2_lines {
            width: 50%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 100% !important;
            height: 2rem !important;
            margin: 5px !important;
        }

        .css-1x5jdm {
            padding: 5px;
        }


        .css-1x5jdmq {
            padding: 6px !important;
            padding-bottom: 0px !important;
        }

        .css-qiwgdb {
            padding: 6px !important;
        }

        .preview_certif {
            display: block;
            width: 90%;
            height: 200px;
            border-radius: 1rem !important;
            margin-top: 1rem !important;
        }

        .preview_certif:hover {
            transform: scale(1.3);
            margin-left: 5rem;
        }

        .hr_break {
            border: 3px solid grey;
        }

        .icon_plus {
            width: 6%;
        }


        .icon_plus_line {
            width: 4%;
        }

        .bton_add_session {
            background: #c8cfd5;
            color: black;
            width: 50%;
        }

        .bton_add_sous_menu {
            background: #c8cfd5;
            color: black;
            width: 100%;
        }

        .bton_import_excel {
            background: #c8cfd5;
            color: black;
            width: 65% !important;
        }

        .div_row_gauche_etendu {
            width: 80% !important;
        }

        .icon_excel {
            width: 6%;
        }


        .bton_suppr {
            background: transparent;
            color: red;
            border-radius: 5rem;
            font-size: small;
            text-align: center;
            height: 2.5rem;
            width: 80%;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_enreg {
  font-family: DM sans;
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 80%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_edit {
            border-radius: 5rem;
            font-size: small;
            background: black !important;
            text-align: right;
            height: 2.5rem;
            width: 80%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_annule {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 80%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }

        .div_row_gauche_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
        }

        .div_row_droite_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            padding-left: 0.2rem;
        }

        .tips_img_class {
            font-size: small;
            font-style: italic;
            margin-left: 1rem !important;
            text-align: left;
            float: left;
            width: 100%;
        }

        .img_class_logo {
            display: block;
            width: 168px;
            height: 168px;
            border-radius: 10px !important;
            border: 1px solid #d5d8dc;
            float: left;
        }

        .bton_supprime_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            background: white;
            color: red;
            margin-top: 0.5rem;
            width: 15rem;
            cursor: pointer;
        }

        .bton_supprime_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .bton_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            width: 15rem;
            cursor: pointer;
        }

        .bton_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .tick_ok_ko {
            max-width: 3%;
            cursor: pointer;
            padding-top: 4px;
        }

        .texte_area {
            float: left;
            width: 47% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 1.5rem !important;
        }

        .texte_area_filter {
            float: left;
            width: 40% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;
        }

        .texte_area_filter_value {
            float: left !important;
            width: 40% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;

        }


        .filter_bton_add {
            float: left;
            width: 5% !important;
            font-size: large !important;
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;
            text-align: right;
            cursor: pointer;
            margin-top: 1rem !important;
        }

        .div_row {
            float: left;
            //border: 1px solid #d5d8dc;
            border-width: 0.01rem;
            width: 100%;
            //margin-bottom: 1rem;
            border-radius: 1rem;
        }

        .div_row_gauche {
            float: left;
            // border:1px solid black;
            // border-width:0.01rem;
            width: 45%;
            border-radius: 1rem;
            text-align: left;
        }

        .div_row_droite {
            float: right;
            //border:1px solid black;
            //border-width:0.01rem;
            width: 45%;
            border-radius: 1rem;
            text-align: right;
        }

        .bton_suppr {
            background: transparent;
            color: red;
            border-radius: 5rem;
            font-size: small;
            text-align: center;
            height: 2.5rem;
            width: 40%;
            margin-left: 10px;
            margin-right: 10px;
            min-width: 15rem;
        }

        .bton_enreg {
  font-family: DM sans;
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 40%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
            min-width: 15rem;
        }

        .bton_edit {
            border-radius: 5rem;
            font-size: small;
            background: black !important;
            text-align: right;
            height: 2.5rem;
            width: 40%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
            min-width: 15rem;
        }

        .bton_annule {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 40%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
            min-width: 15rem;
        }


        .css-1t10bd6-MuiFormControl-root-MuiTextField-root fieldset {
            border-color: transparent !important;
            border-radius: 20px !important;
        }


        .training_caract {
            width: 30%;
            padding: 5px;
            float: left;
        }

        .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input .Mui-disabled {
   font-family:'DM Sans','Sans-serif';
            font: inherit;
            letter-spacing: inherit;
            color: currentColor;
            border: 0;
            box-sizing: content-box;
            background: none;
            background-color: rgba(0, 0, 0, 0);
            margin: 0;
            -webkit-tap-highlight-color: transparent;
            display: block;
            min-width: 0;
            width: 100%;
            -webkit-animation-name: mui-auto-fill-cancel;
            animation-name: mui-auto-fill-cancel;
            -webkit-animation-duration: 10ms;
            animation-duration: 10ms;
            height: 3rem !important;
            padding: 0 !important;
            padding-left: 5px !important;
        }

        .css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input {
            padding: 1px !important;
            padding-right: 1rem !important;
        }

        .block_en_mass {
            width: 50%;
            float: left;
            margin-bottom: 1rem;
        }

        .block_en_mass_select {
            width: 45%;
            float: left;
            margin-bottom: 1rem;
        }

        .block_en_mass_bton_action {
            width: 45%;
            float: left;
            margin-bottom: 1rem;
            padding-top: 0.5rem !important;
        }


        .bton_enreg_dialog {
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 80%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_annule_dialog {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 80%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_supprime_dialog {
            border-radius: 5rem;
            font-size: small;
            background: rgb(224, 89, 89) !important;
            text-align: right;
            height: 2.5rem;
            width: auto;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
            padding-right: 5px;
            padding-left: 5px;
        }

        .DialogContent_width {
            width: 500px !important;
        }

    }

    @media only screen and (min-width: 992px) and (max-width: 1199px) {
        .okUpdateData {
            font-size: small;
            color: green;
            font-style: italic;
        }

        .koUpdateData {
            font-size: small;
            color: red;
            font-style: italic;
        }

        .div_row {
            float: left;
            //border: 1px solid #d5d8dc;
            border-width: 0.01rem;
            width: 100%;
            margin-bottom: 1rem;
            border-radius: 1rem;
        }

        .div_row_gauche {
            float: left;
            // border:1px solid black;
            // border-width:0.01rem;
            width: 45%;
            border-radius: 1rem;
        }

        .div_row_droite {
            float: right;
            //border:1px solid black;
            //border-width:0.01rem;
            width: 45%;
            border-radius: 1rem;
            text-align: right;
        }

        .selectsession {
            width: 90%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .titre1_aide_finance {
            margin-top: 1rem;
            font-family: "DM Sans", "sans-serif";
            font-size: medium;
            text-align: center;
            margin-bottom: 0.8rem;
            color: white;
            cursor: pointer;
            font-style: italic;
            background-color: gray;
            font-weight: normal;
        }

        .pieddepage {
            z-index: 50;
            width: 100%;
            float: left;
            margin-top: 12rem;
        }

        .div_mobile {
            position: absolute;
            top: 8rem;
            z-index: 1;
            width: 100%;
        }

        .zone_data {
            width: 95%;
            margin-left: auto;
            margin-right: auto;
        }

        .detail_class_submenu {
            background: #d8edfc;
            border-radius: 15px;
            margin-right: 1rem;
            padding: 0.3rem;
            margin-bottom: 0.5rem;
            width: 11rem;
            text-align: center;
            border: 1px solid #9cf;
            color: #3b3e40;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            letter-spacing: 0.1rem;
            font-weight: normal;
        }

        .detail_class_submenu:hover:active,
        .detail_class_submenu:hover {
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu:focus {
            //border: 3px dotted green;
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu_data {
            width: 100%;
            min-height: 10rem;
            background-color: #d8edfc;
            padding-left: 5px;
            text-align: left;
            padding: 0;
            border: 0px;
            color: #3b3e40;
            padding-left: 5px;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            border-radius: 10px;
            border: 1px solid;
        }

        .disabled_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 90% !important;
            height: 3.5rem !important;
            margin: 5px !important;
            //border: none !important;
            border-radius: 5px;
            background: white;
            border: solid gainsboro 1px;
            //padding-left: 5px !important;
        }

        .training_caract {
            width: 30%;
            padding: 5px;
            float: left;
        }

        .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input .Mui-disabled {
   font-family:'DM Sans','Sans-serif';
            font: inherit;
            letter-spacing: inherit;
            color: currentColor;
            border: 0;
            box-sizing: content-box;
            background: none;
            background-color: rgba(0, 0, 0, 0);
            margin: 0;
            -webkit-tap-highlight-color: transparent;
            display: block;
            min-width: 0;
            width: 100%;
            -webkit-animation-name: mui-auto-fill-cancel;
            animation-name: mui-auto-fill-cancel;
            -webkit-animation-duration: 10ms;
            animation-duration: 10ms;
            height: 3rem !important;
            padding: 0 !important;
            padding-left: 5x !important;
        }




        .css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input {
            padding: 1px !important;
            padding-right: 1rem !important;
        }

        .selectsession {
            width: 90%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .session_data {
            float: left;
            width: 100%;
            box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            border-radius: 10px;
            margin-top: 10px;
            margin-bottom: 10px;


        }

        .session_caract {
  font-family: DM Sans;
            width: 33%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_caract_comment_2_lines {
            width: 33%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }



        .session_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 100% !important;
            height: 2rem !important;
            margin: 5px !important;
        }

        .css-1x5jdm {
            padding: 5px;
        }

        .css-1x5jdmq {
            padding: 6px !important;
            padding-bottom: 0px !important;
        }

        .css-qiwgdb {
            padding: 6px !important;
        }

        .preview_certif {
            display: block;
            width: 90%;
            height: 180px;
            border-radius: 1rem !important;
            margin-top: 1rem !important;
        }

        .preview_certif:hover {
            transform: scale(1.3);
            margin-left: 5rem;
        }

        .hr_break {
            border: 3px solid grey;
        }

        .icon_plus {
            width: 8%;
        }


        .icon_plus_line {
            width: 3%;
        }

        .bton_add_session {
            background: #c8cfd5;
            color: black;
            width: 40%;
        }

        .bton_add_sous_menu {
            background: #c8cfd5;
            color: black;
            width: 100%;
        }

        .bton_import_excel {
            background: #c8cfd5;
            color: black;
            width: 50% !important;
        }

        .div_row_gauche_etendu {
            width: 80%;
        }

        .icon_excel {
            width: 6%;
        }


        .bton_suppr {
            background: transparent;
            color: red;
            border-radius: 5rem;
            font-size: small;
            text-align: center;
            height: 2.5rem;
            width: 65%;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_enreg {
  font-family: DM sans;
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 65%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_edit {
            border-radius: 5rem;
            font-size: small;
            background: black !important;
            text-align: right;
            height: 2.5rem;
            width: 65%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_annule {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 65%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }


        .div_row_gauche_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
        }

        .div_row_droite_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            padding-left: 0.2rem;
        }

        .tips_img_class {
            font-size: small;
            font-style: italic;
            margin-left: 1rem !important;
            text-align: left;
            float: left;
            width: 100%;
        }

        .img_class_logo {
            display: block;
            width: 168px;
            height: 168px;
            border-radius: 10px !important;
            border: 1px solid #d5d8dc;
            float: left;
        }

        .bton_supprime_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            background: white;
            color: red;
            margin-top: 0.5rem;
            width: 15rem;
            cursor: pointer;
        }

        .bton_supprime_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .bton_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            width: 15rem;
            cursor: pointer;
        }

        .bton_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .tick_ok_ko {
            max-width: 3%;
            cursor: pointer;
            padding-top: 4px;
        }

        .texte_area {
            float: left;
            width: 47% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 1.5rem !important;
        }

        .texte_area_filter {
            float: left;
            width: 40% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;
        }

        .texte_area_filter_value {
            float: left !important;
            width: 40% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;

        }


        .filter_bton_add {
            float: left;
            width: 5% !important;
            font-size: xx-large !important;
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;
            text-align: right;
            cursor: pointer;
        }


        .titre1 {
            font-family: "DM Sans", "sans-serif";
            font-size: medium;
            text-align: center;
            margin-bottom: 0.8rem;
            color: white;
            cursor: pointer;
            font-style: italic;
            background-color: gray;
            font-weight: normal;
        }


        .bton_enreg_dialog {
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 80%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_annule_dialog {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 80%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_supprime_dialog {
            border-radius: 5rem;
            font-size: small;
            background: rgb(224, 89, 89) !important;
            text-align: right;
            height: 2.5rem;
            width: auto;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
            padding-right: 5px;
            padding-left: 5px;
        }

        .DialogContent_width {
            width: 500px !important;
        }

    }

    @media only screen and (min-width: 1200px) {
        .okUpdateData {
            font-size: small;
            color: green;
            font-style: italic;
        }

        .koUpdateData {
            font-size: small;
            color: red;
            font-style: italic;
        }

        .div_row {
            float: left;
            //border: 1px solid #d5d8dc;
            border-width: 0.01rem;
            width: 100%;
            //margin-bottom: 1rem;
            border-radius: 1rem;
        }

        .div_row_gauche {
            float: left;
            // border:1px solid black;
            // border-width:0.01rem;
            width: 45%;
            border-radius: 1rem;
        }

        .div_row_droite {
            float: right;
            //border:1px solid black;
            //border-width:0.01rem;
            width: 45%;
            border-radius: 1rem;
            text-align: right;
        }

        .selectsession {
            width: 90%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .titre1_aide_finance {
            margin-top: 1rem;
            font-family: "DM Sans", "sans-serif";
            font-size: medium;
            text-align: center;
            margin-bottom: 0.8rem;
            color: white;
            cursor: pointer;
            font-style: italic;
            background-color: gray;
            font-weight: normal;
        }

        .pieddepage {
            z-index: 50;
            width: 100%;
            float: left;
            margin-top: 12rem;
        }

        .div_mobile {
            position: absolute;
            top: 8rem;
            z-index: 1;
            width: 100%;
        }

        .zone_data {
            width: 95%;
            margin-left: auto;
            margin-right: auto;
        }

        .detail_class_submenu {
            background: #d8edfc;
            border-radius: 15px;
            margin-right: 1rem;
            padding: 0.3rem;
            margin-bottom: 0.5rem;
            min-width: 12rem;
            text-align: center;
            border: 1px solid #9cf;
            color: #3b3e40;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            letter-spacing: 0.1rem;
            font-weight: normal;
        }

        .detail_class_submenu:hover:active,
        .detail_class_submenu:hover {
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu:focus {
            //border: 3px dotted green;
            background-color: #107758;
            color: white;
        }

        .detail_class_submenu_data {
            width: 100%;
            min-height: 10rem;
            background-color: #d8edfc;
            padding-left: 5px;
            text-align: left;
            padding: 0;
            border: 0px;
            color: #3b3e40;
            padding-left: 5px;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            border-radius: 10px;
            border: 1px solid;
        }

        .disabled_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 90% !important;
            height: 3.5rem !important;
            margin: 5px !important;
            //border: none !important;
            border-radius: 5px;
            background: white;
            border: solid gainsboro 1px;
            //padding-left: 5px !important;
        }

        .disabled_style_Dialog {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 100% !important;
            height: 3.5rem !important;
            margin: 5px !important;
            //border: none !important;
            border-radius: 5px;
            background: white;
            border: solid gainsboro 1px;
            //padding-left: 5px !important;
        }

        .session_caract_Dialog {
 font-family: 'DM Sans';
            width: 100%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_caract_Dialog_comment_2_lines {

            width: 100%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }


        .training_caract {
            width: 30%;
            padding: 5px;
            float: left;
        }

        .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input .Mui-disabled {
   font-family:'DM Sans','Sans-serif';
            font: inherit;
            letter-spacing: inherit;
            color: currentColor;
            border: 0;
            box-sizing: content-box;
            background: none;
            background-color: rgba(0, 0, 0, 0);
            margin: 0;
            -webkit-tap-highlight-color: transparent;
            display: block;
            min-width: 0;
            width: 100%;
            -webkit-animation-name: mui-auto-fill-cancel;
            animation-name: mui-auto-fill-cancel;
            -webkit-animation-duration: 10ms;
            animation-duration: 10ms;
            height: 3rem !important;
            padding: 0 !important;
            padding-left: 5px !important;
        }

        .css-11u53oe-MuiSelect-select-MuiInputBase-input-MuiOutlinedInput-input {
            padding: 1px !important;
            padding-right: 1rem !important;
        }

        .selectsession {
            width: 90%;
            height: 3rem;
            font-size: small;
            border-radius: 0px !important;
        }

        .session_data {
            float: left;
            width: 100%;
            box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            -webkit-box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.5);
            border-radius: 10px;
            margin-top: 10px;
            margin-bottom: 10px;


        }



        .session_caract {
  font-family: DM Sans;
            width: 33%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_caract_comment_2_lines {
            width: 33%;
            padding: 5px;
            float: left;
            text-align: left;
            font-size: small;
            margin-bottom: 1rem !important;
        }

        .session_style {
            //background-color: #ECEFF1;
            font-size: small !important;
            color: black;
            width: 100% !important;
            height: 2rem !important;
            margin: 5px !important;
        }

        .preview_certif {
            display: block;
            width: 90%;
            height: 200px;
            border-radius: 1rem !important;
            margin-top: 1rem !important;
        }

        .preview_certif:hover {
            transform: scale(1.4);
            margin-left: 10rem;
        }


        .action_mass {
            border-radius: 5px;
            font-size: small;
            padding: 0.3rem;
            width: 40%;
            background: #81BC3A;
            height: 2.5rem;
        }



        .block_en_mass {
            width: 50%;
            float: left;
            margin-bottom: 1rem;
        }

        .session_open_close {
            cursor: pointer;
            text-align: right;
            font-size: small;
            margin-right: 10px;
        }

        .hr_break {
            border: 5px solid grey;
        }

        .icon_plus {
            width: 8%;
        }

        .icon_plus_line {
            width: 2%;
        }

        .bton_add_session {
            background: #c8cfd5;
            color: black;
            width: 25% !important;
        }

        .bton_add_sous_menu {
            background: #c8cfd5;
            color: black;
            width: 25% !important;
        }

        .bton_import_excel {
            background: #c8cfd5;
            color: black;
            width: 40% !important;
        }

        .div_row_gauche_etendu {
            width: 80%;
        }

        .icon_excel {
            width: 4%;
        }

        .bton_envoyer {
            border-radius: 5px;
            font-size: small;
            padding: 0.3rem;
            width: 60%;
            background: #81BC3A;
        }


        .bton_traiter_en_mass {
            border-radius: 5px;
            font-size: small;
            padding: 0.3rem;
            width: 40%;
            background: #81BC3A;
            margin-left: 5%;
            height: 2.5rem;
            color: white;

        }

        .bton_fermer {
            border-radius: 5px;
            font-size: small;
            padding: 0.3rem;
            width: 60%;
            background-color: white;
            color: #107758 !important;
        }


        .enable_style {
            background-color: #FFFFFF;
        }



        .css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input:invalid {
            padding-top: 5px !important;
            padding-bottom: 5px !important;
            padding-left: 5px !important;
        }

        .css-1t10bd6-MuiFormControl-root-MuiTextField-root fieldset {
            border-color: transparent !important;
            border-radius: 20px !important;
        }

        .bton_emarge {
            border-radius: 5rem;
            height: 2rem !important;
            font-size: 11px;
            padding: 0.5rem;
            background: rgb(129, 188, 58);
            margin-left: 5px;
            margin-right: 5px;
        }

        .css-1x5jdm {
            padding: 5px;
        }


        .css-1x5jdmq {
            padding: 6px !important;
            height: 3rem ! important;
            padding-bottom: 0px !important;
        }

        .css-qiwgdb {
            padding: 6px !important;
        }


        .bton_suppr {
            background: transparent;
            color: red;
            border-radius: 5rem;
            font-size: small;
            text-align: center;
            height: 2.5rem;
            width: 40%;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_enreg {
  font-family: DM sans;
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 40%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_edit {
            border-radius: 5rem;
            font-size: small;
            background: black !important;
            text-align: right;
            height: 2.5rem;
            width: 40%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }

        .bton_annule {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 40%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }



        .div_row_gauche_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
        }

        .div_row_droite_image {
            float: left;
            //border:0px solid black;
            border-width: 0.01rem;
            border-radius: 1rem;
            text-align: left;
            font-family: "DM Sans", "sans-serif";
            font-size: small;
            padding-left: 0.2rem;
        }

        .tips_img_class {
            font-size: small;
            font-style: italic;
            margin-left: 1rem !important;
            text-align: left;
            float: left;
            width: 100%;
        }

        .img_class_logo {
            display: block;
            width: 170px;
            height: 168px;
            border-radius: 10px !important;
            border: 1px solid #d5d8dc;
            float: left;
        }

        .bton_supprime_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            background: white;
            color: red;
            margin-top: 0.5rem;
            width: 15rem;
            cursor: pointer;
        }

        .bton_supprime_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .bton_image_class {
            font-size: small;
            text-align: center;
            margin-left: 0px;
            box-shadow: 1px 1px 10px 1px rgb(0 0 0 / 15%);
            padding: 5px;
            padding-left: 10px;
            padding-right: 10px;
            border: 1px solid rgb(194, 186, 186);
            border-radius: 10px;
            width: 15rem;
            cursor: pointer;
        }

        .bton_image_class:hover {
            box-shadow: 5px 1px 5px 1px rgb(0 0 0 / 25%);
        }

        .tick_ok_ko {
            max-width: 3%;
            cursor: pointer;
            padding-top: 4px;
        }

        .texte_area {
            float: left;
            width: 47% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 1.5rem !important;
        }

        .texte_area_filter {
            float: left;
            width: 40% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;
        }

        .texte_area_filter_value {
            float: left !important;
            width: 40% !important;
            font-size: x-small !important;
            font-family: "DM Sans", "sans-serif";
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;

        }


        .filter_bton_add {
            float: left;
            width: 5% !important;
            font-size: xx-large !important;
            margin: 0.4rem !important;
            margin-top: 0px !important;
            margin-bottom: 2px !important;
            text-align: right;
            cursor: pointer;
        }


        .titre1 {
            font-family: "DM Sans", "sans-serif";
            font-size: medium;
            text-align: center;
            margin-bottom: 0.8rem;
            color: white;
            cursor: pointer;
            font-style: italic;
            background-color: gray;
            font-weight: normal;
        }

        .file_ariane {
            font-size: large;
            font-weight: 600;
            width: 100%;
            text-align: center;
        }

        .css-l4u8b9-MuiInputBase-root-MuiInput-root {
            text-align: left !important;
        }

        .bton_enreg_dialog {
            border-radius: 5rem;
            font-size: small;
            background: #81BC3A !important;
            text-align: center;
            height: 2.5rem;
            width: 80%;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_annule_dialog {
            border-radius: 5rem;
            font-size: small;
            background: lightgray !important;
            text-align: right;
            height: 2.5rem;
            width: 80%;
            color: black;
            margin-left: 10px;
            margin-right: 10px;
        }


        .bton_supprime_dialog {
            border-radius: 5rem;
            font-size: small;
            background: rgb(224, 89, 89) !important;
            text-align: right;
            height: 2.5rem;
            width: auto;
            color: white;
            margin-left: 10px;
            margin-right: 10px;
            padding-right: 5px;
            padding-left: 5px;
        }


        .DialogContent_width {
            width: 500px !important;
        }

    }

    // end media


    .css-md26zr-MuiInputBase-root-MuiOutlinedInput-root {
        height: 3.5rem !important;
    }

    .css-1bp1ao6 {
        height: 3.5rem !important;
    }

    .session_caract_Dialog {
 font-family: 'DM Sans';
        width: 100%;
        padding: 5px;
        float: left;
        text-align: left;
        font-size: small;
        margin-bottom: 1rem !important;
    }

    .session_caract_Dialog_comment_2_lines {

        width: 100%;
        padding: 5px;
        float: left;
        text-align: left;
        font-size: small;
        margin-bottom: 1rem !important;
    }


    .session_caract_Dialog_DatePicker {
        width: 99% !important;
        background-color: #FFFFFF;
    }


    .css-1v4ccyo {
        height: 3.5rem !important;
        font-size: small;
    }

    option {
        font-weight: normal;
        display: block;
        white-space-collapse: collapse;
        text-wrap: nowrap;
        padding: 0px !important;
    }

    .mysy_hr_text {
        border: none;
        border-top: 3px double #333;
        color: #333;
        overflow: visible;
        text-align: center;
        height: 5px;
    }

    .mysy_hr_text:after {
        background: #fff;
        content: 'Détails';
        padding: 0 4px;
        position: relative;
        top: -13px;
    }

    .MuiMenu-paper {
        max-width: 30% !important;
    }

    .separator {
        display: flex;
        align-items: center;
        text-align: center;
        margin-bottom: 0.5rem !important;
    }

    .separator::before,
    .separator::after {
        content: '';
        flex: 1;
        border-bottom: 1px solid #e0e0e0;
    }

    .separator:not(:empty)::before {
        margin-right: .35em;
    }

    .separator:not(:empty)::after {
        margin-left: .35em;
    }

    .MuiSelect-select {
        //height: 3rem !important;

    }


}

.MuiMenu-paper {
    max-width: 30% !important;
}

.tox-statusbar {
    display: none !important;
}




.css-1x5jdmq {
    height: 3rem !important;
    font-size: small;
}

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

.css-9ddj71-MuiInputBase-root-MuiOutlinedInput-root {
font-family: DM Sans !important;
    height: 3.5rem !important;
    font-size: small !important;

}



.react-datepicker__input-container {
    width: 110%;
}

.css-1t8l2tu-MuiInputBase-input-MuiOutlinedInput-input {
    padding-left: 5px !important;
    padding-right: 1rem !important;
}