Settings.module.css

.main{
  height: 100vh;
  width: 100vw;
  background-color: #F3F3F3;
}

.header{
  display: flex;
  width: 80%;
  border-bottom: 2px solid rgb(235,239,242);
}
.head{
  margin: 2% 8%;
}
.container{
  display: flex;
  flex-direction: column;
  width: 78%;
  height: 72vh;
  align-items: center;
  margin-left: 300px;
  background-color: #fff;
}

.form {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  width: 50%;
justify-content: space-evenly;
  padding: 20px;
}

.form input {
  background: #FFFFFF;
  border: 1px solid #326E9C;
  border-radius: 6px;
  padding: 2%;
  outline: none;
  width: 90%;
  height: 5%;
}

.button {
  padding: 1.3% 3%;
  gap: 10px;
  width: 200px;
  background: #3A3E9C;
  border-radius: 5px;
  border: none;
  color: white;
  cursor: pointer;
  transition-duration: 0.3s;
  transition-timing-function: linear;
}
.button:hover {
  background-color: #2980b9;
}

.button:active {
  background-color: #3498db;
}

.disabled {
  pointer-events: none;
  opacity: 0.5;
  user-select: none;
}

.modalContainer{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background-color: #fff;
  border-radius: 4px;
}

.deleteAccount {
  background-color: red;
}

.deleteAccount:hover {
  background-color: rgba(255, 0, 0, 0.792);
}


.buttonsConfirmation{
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 4%;
}

.right{
  margin-left: 10%;
}

.paragraphe {
  font-size: 17px;
  font-weight: 600;
  text-decoration: underline;
}

.p2 {
  text-decoration: none;
}