body
{
  background: linear-gradient(#2C889C, white);
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
}
.div_general_content{
  width: 60%;
  height: auto;
  background-color: white;
  margin: auto;
  /*margin-top: 3px;*/
  margin-top: 60px;
  border-radius: 10px / 5px;
  margin-bottom: 40px;
  padding-bottom: 7px;
}
.div_logo{
  display: flex;
  flex-direction: row;
  align-items:center;
  background-color: white; /*black;*/
  width: 100%;
  height: 100px;
  margin: auto;
  border-radius: 10px / 5px;
}
.logo{
  margin-left: 15px;
}
.div_titre
{
  width: 70%;
  margin: auto;
  margin-top: 15px;
  background: linear-gradient(#989088, black);
  padding: 10px;
  text-align: center;
  border-radius: 10px / 5px;
}
.div_titre2
{
  width: 70%;
  margin: auto;
  margin-top: 15px;
  margin-bottom: 16px;
  background: linear-gradient(#989088, black);
  padding: 10px;
  text-align: center;
  border-radius: 10px / 5px;
}
.titre{
  padding: 8px;
  font-family: Verdana, Arial, sans-serif;
  font-size: 18px;
  color: white;
}
.titre2{
  padding: 8px;
  font-family: Verdana, Arial, sans-serif;
  font-size: 14px;
  color: white;
}
.login_form{
  width: 70%;
  height: auto;
  margin: auto;
  background-color: white; /*#EED283;*/
  /*border:1px solid #acadad; /*#DEDDDD; /* #E4E4E4; /*#989088;*/
  border:1px solid #acadad;
  padding: 20px;
  margin-bottom: 20px;
}
.div_input{
  width: 90%;
  background-color: white;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 20px;
  border-radius: 5px;
}
.div_input2{
  display: flex;
  flex-direction: row;
  align-items:center;
  width: 90%;
  background-color: white;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 20px;
  border: 1px #acadad solid;
  border-radius: 5px;
}
.div_input_pwd{
  width: 90%;
  background-color: white;
  border-radius: 5px;
}
.input_area_pwd{
  width: 100%;
  padding: 8px;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #696564;
  border: 1px white solid;
  border-radius: 5px;
}
.div_input_oeil{
  width: 10%;
  background-color: white;
  margin: auto;
}
.input_area{
  width: 100%;
  border: 1px #acadad solid;
  padding: 8px;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: #696564;
  border-radius: 5px;
}
.input_area_code{
  width: 100%;
  border: 1px #acadad solid;
  padding: 8px;
  font-family: Verdana, Arial, sans-serif;
  font-size: 18px;
  font-weight: bolder;
  text-align: center;
  color: #696564;
  border-radius: 5px;
}
.div_msg{
  width: 90%;
  background-color: black;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 20px;
  background-color: #A25D1D;
}
.message{
  width: 100%;
  font-family: Verdana, Arial, sans-serif;
  font-size: 12px;
  color: white;
  padding: 10px;
}
.div_btn_connexion{
  width: 90%;
  height: 40px;
  margin: auto;
  margin-top: 15px;
  background-color: #2C889C;
  border-radius: 5px;
}
.btn_connexion{
  width: 100%;
  height: 40px;
  font-family: Verdana, Arial, sans-serif;
  background-color: #2C889C;
  color:white;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  border-radius: 5px;
}
.div_loader{
  width: 90%;
  background-color: white;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 10px;
  text-align: center;
}
.div_checkbox{
  width: 90%;
  margin: auto;
  margin-top: 10px;
  margin-bottom: 20px;
}
.label_checkbox{
  font-family: Verdana, Arial, sans-serif;
  font-size: 13px;
}

.input_area_pwd:focus-visible
{
    outline: 0;
}
.input_area:focus-visible
{
    outline: 0;
}
.style_oeil
{
  cursor: pointer;
}
.btn_inscription
{
  width: 100%;
  height: 40px;
  font-family: Verdana, Arial, sans-serif;
  background-color: #9e087e; /*#a86f32; /*#920696; /*#2C889C;*/
  color:white;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
  border-radius: 5px;
}

@media screen and (max-width: 780px)
{
  body
  {
    background: linear-gradient(#2C889C, white);
    font-family: Verdana, Arial, sans-serif;
    font-size: 12px;
  }
  .div_general_content{
    width: 100%;
    height: auto; /*530px;*/
    background-color: white;
    margin: auto;
    margin-top: 0px; /*3px;*/
    border-radius: 10px / 5px;
    margin-bottom: 40px;
    padding-bottom: 7px;
  }
  .div_logo{
    display: flex;
    flex-direction: row;
    align-items:center;
    background-color: white;
    width: 100%;
    height: 70px;
    margin: auto;
    /*border-radius: 10px / 5px;*/
  }
  .logo{
    margin-left: 15px;
  }
  .div_titre{
    width: 90%;
    margin: auto;
    margin-top: 10px;
    background-color: #111010;
    padding: 10px;
    text-align: center;
    /*border-radius: 10px / 5px;*/
  }
  .div_titre2{
    width: 90%;
    margin: auto;
    margin-top: 0px;
    background-color: #111010;
    padding: 10px;
    text-align: center;
  }
  .titre{
    padding: 8px;
    font-family: Verdana, Arial, sans-serif;
    font-size: 18px;
    font-weight: bold;
    color: white;
  }
  .login_form{
    width: 90%;
    height: auto;
    margin: auto;
    background-color: white; /*#EED283;*/
    border:1px solid #acadad; /*#acadad; /*#989088;*/
    padding: 20px;
    margin-bottom: 20px;
  }
  .div_input{
    width: 98%;
    background-color: white;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 20px;
    border: 1px #acadad solid;
    border-radius: 5px;
  }
  .div_input2{
    display: flex;
    flex-direction: row;
    align-items:center;
    width: 98%;
    background-color: white;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 20px;
    border: 1px #acadad solid;
    border-radius: 5px;
  }
  .input_area{
    width: 100%;
    border: 1px white solid;
    padding: 8px;
    font-family: Verdana, Arial, sans-serif;
    font-size: 16px;
    color: #696564;
    border-radius: 5px;
  }
  .input_area_pwd{
    width: 100%;
    padding: 8px;
    font-family: Verdana, Arial, sans-serif;
    font-size: 16px;
    color: #696564;
    border: 1px white solid;
    border-radius: 5px;
  }
  .div_msg{
    width: 98%;
    background-color: black;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 20px;
    background-color: #A25D1D;
  }
  .message{
    width: 100%;
    font-family: Verdana, Arial, sans-serif;
    font-size: 14px;
    color: white;
    padding: 10px;
  }
  .div_btn_connexion{
    width: 98%;
    height: 40px;
    margin: auto;
    margin-top: 15px;
    background-color: #2C889C;
    border-radius: 5px;
  }
  .btn_connexion{
    width: 100%;
    height: 40px;
    font-family: Verdana, Arial, sans-serif;
    background-color: #2C889C;
    color:white;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 5px;
  }
  .div_loader{
    width: 90%;
    background-color: white;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    text-align: center;
  }
  .div_input_pwd{
    width: 85%;
    background-color: white;
  }
  .div_input_oeil{
    width: 15%;
    background-color: white;
    margin: auto;
  }
  .titre2{
    padding: 8px;
    font-family: Verdana, Arial, sans-serif;
    font-size: 15px;
    color: white;
  }
  .div_checkbox{
    width: 98%;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 20px;
  }
  .btn_inscription{
    width: 100%;
    height: 40px;
    font-family: Verdana, Arial, sans-serif;
    background-color: #9e087e; /*#a86f32; /*#920696; /*#2C889C;*/
    color:white;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    border-radius: 5px;
  }
}