.notfound {
 

  width: 100%;
  float: left;

  .loader-container {
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    background: white;
    background-color: transparent;
    z-index: 1;
    top: 0px;
    opacity: 80%;
    left: 0px;
  }

  .spinner {
    width: 20rem;
    height: 10rem;
    border: 8px solid;
    border-color: #3d5af1 transparent #3d5af1 transparent;
    border-radius: 50%;
    animation: spin-anim 1.2s linear infinite;
    background-color: red;
    color: black;
  }

  .mysy_spinner {
    border-radius: 5px;
    //border: 1px solid #d5d8dc;
    opacity: 100%;
  }


  @media only screen and (max-width: 600px) {
    .nom_prenom {
      font-family: "DM Sans", "sans-serif";
      font-size: medium;
      font-weight: bold;
      text-align: center;
      margin-bottom: 1rem;
    }

    .img_logo {
      display: block;
      max-width: 40%;
      border-radius: 20rem;
      border: 0.1rem solid black;
      height: 40%;
      width: 40%;
      margin-left: 20%;
      margin-right: auto;
    }

    .img_ok {
      width: 5%;
    }

    .containerBox {
      position: relative;
      display: inline-block;
    }

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

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

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

    .okUpdateData {
      font-size: small;
      color: green;
      font-style: italic;
    }

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

    .div_mobile {
   //   position: relative;
      top: 7rem;
      z-index: 1;
      width: 100%;
      height: 100%;
      //margin: 0.3rem;
      margin-left: auto;
      margin-right: auto;
    }

    .pieddepage {
      z-index: 50;
      width: 100%;
      float: left;
      top: calc(100vh - 150px);
      position: absolute;


    }

    .block_entete {
      margin-top: 3rem;
      width: 100%;
      float: left;
      border: none;
      background: var(--Beige, #FFF5DA);
    }

    .block_centrer {
      margin: auto;
      width: 100%;
      float: left;
      //margin-top: 2rem;
      // border: 3px solid #73AD21;
      padding: 10px;
    }

    .Background-header {
      // position: absolute;
      width: 100%;
      height: 3rem;
      left: 0px;

      background: var(--Beige, #FFF5DA);
    }

    .display_screen_600_901 {
      width: 100%;
      float: left;
      padding: 5px;
      min-height: 70vh;
      margin-left: 0pc;
      padding-top: 5rem;
    }
  }

  @media only screen and (min-width: 601px) and (max-width: 991px) {
    .nom_prenom {
      font-family: "DM Sans", "sans-serif";
      font-size: medium;
      font-weight: bold;
      text-align: center;
      margin-bottom: 1rem;
    }

    .img_logo {
      display: block;
      max-width: 50%;
      border-radius: 20rem;
      border: 0.1rem solid black;
      height: 50%;
      width: 50%;
      margin-left: auto;
      margin-right: auto;
    }

    .containerBox {
      position: relative;
      display: inline-block;
    }

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

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

    .div_row_droite {
      float: right;
      //border:0px solid black;
      border-width: 0.01rem;
      width: 60%;
      border-radius: 1rem;
      text-align: left;
      font-family: "DM Sans", "sans-serif";
      font-size: medium;
    }

    .okUpdateData {
      font-size: small;
      color: green;
      font-style: italic;
    }

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

    .img_ok {
      width: 5%;
    }

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

    .pieddepage {
      z-index: 50;
      width: 100%;
      float: left;
      top: calc(100vh - 150px);
      position: absolute;
    }


    .block_entete {
      height: 6rem;
      float: left;
      border: none;
    }

    .block_centrer {
      margin: auto;
      width: 100%;
      //  border: 3px solid #73AD21;
      padding: 10px;
    }

    .Background-header {
      position: absolute;
      width: 100%;
      height: 100px;
      left: 0px;

      background: var(--Beige, #FFF5DA);
    }
  }

  @media only screen and (min-width: 992px) and (max-width: 1199px) {
    .nom_prenom {
      font-family: "DM Sans", "sans-serif";
      font-size: large;
      text-align: center;
      margin-bottom: 1rem;
      font-weight: bold;
    }

    .img_logo {
      display: block;
      max-width: 50%;
      border-radius: 20rem;
      border: 0.1rem solid black;
      height: 50%;
      width: 50%;
      margin-left: auto;
      margin-right: auto;
    }

    .containerBox {
      position: relative;
      display: inline-block;
    }

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

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

    .div_row_droite {
      float: right;
      //border:0px solid black;
      border-width: 0.01rem;
      width: 69%;
      border-radius: 1rem;
      text-align: left;
      font-family: "DM Sans", "sans-serif";
      font-size: large;
    }

    .okUpdateData {
      font-size: medium;
      color: green;
      font-style: italic;
    }

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

    .img_ok {
      width: 5%;
    }

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


    .pieddepage {
      z-index: 50;
      width: 100%;
      float: left;
      top: calc(100vh - 150px);
      position: absolute;
    }

    .block_entete {
      height: 8rem;
      float: left;
      border: none;
    }

    .block_centrer {
      margin: auto;
      width: 95%;
      //   border: 3px solid #73AD21;
      padding: 10px;
    }

    .Background-header {
      position: absolute;
      width: 100%;
      height: 100px;
      left: 0px;

      background: var(--Beige, #FFF5DA);
    }
  }

  @media only screen and (min-width: 1200px) {
    .nom_prenom {
      font-family: "DM Sans", "sans-serif";
      font-size: larger !important;
      text-align: center;
      margin-bottom: 1rem;
      font-weight: bold;
    }

    .img_logo {
      display: block;
      max-width: 50%;
      border-radius: 20rem;
      border: 0.1rem solid black;
      height: 50%;
      width: 50%;
      margin-left: auto;
      margin-right: auto;
    }

    .containerBox {
      position: relative;
      display: inline-block;
    }

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

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

    .div_row_droite {
      float: right;
      //border:0px solid black;
      border-width: 0.01rem;
      width: 69%;
      border-radius: 1rem;
      text-align: left;
      font-family: "DM Sans", "sans-serif";
      font-size: x-large;
    }

    .okUpdateData {
      font-size: large;
      color: green;
      font-style: italic;
    }

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


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

    .pieddepage {
      z-index: 50;
      width: 100%;
      float: left;
      top: calc(100vh - 150px);
      position: absolute;
    }

    .img_ok {
      max-width: 5%;
    }

    .block_entete {
      height: 10rem;
      float: left;
      border: none;
    }

    .block_centrer {
      margin: auto;
      width: 100%;
      padding: 10px;
      max-width: 1400px !important;
    }


    .Background-header {
      position: absolute;
      width: 100%;
      height: 150px;
      left: 0px;
      background: var(--Beige, #FFF5DA);
    }
  }


  // end media
  .display_screen_600_901 {
    width: 95%;
    margin-left: 5%;
    float: left;
    padding: 10px;
    min-height: 70vh;
    padding-top: 10rem;
  }

  .text_welcome{
    margin-top: 2rem;
  }
}