:root {
  --a: #040DBF;
  --b: #0F9BF2;
  --c: #5E728C;
  --d: #EBEDF2;
  --e: #F2275D; 
  --f: #fff;
  --g: #D8E4EE;
  --h: #f2f2f2;

  --border-radius-boutons: 5px;
}
body{
  color: var(--c);
  background-image: url(../img/Rectangle\ 26.jpg);
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  background-repeat: no-repeat;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, "Helvetica Neue", Arial, "Noto Sans", sans-serif;
  
}
form{
  background-color: rgba(255, 255, 255, 0.8);
  display: flex;
  flex-direction: column;
  max-width: 381px;
  max-height: 572px;
  align-items: center;
  justify-content: center;
  text-align: left;
  margin-top: 43px;
  padding: 30px;
  border-radius: 10px;
}
img{
  height: 119px;
}
input{
  width: 313px;
  padding: 15px;
  border-radius: var(--border-radius-boutons);
  background-color: var(--d);
  border: none;
}
input:focus{
border: none;  
}
input[type="text"] {
    color: var(--c);
  }

  
input[type="submit"] {  
  text-decoration: none;
  color: var(--d);
  width: 343px;
  font-size: 20px;
  background-color: var(--b);
  margin-top: 10px;
  margin-bottom: 10px;
}

input[type="submit"]:hover { 
cursor: pointer;
}

input[type="checkbox"] {
  background-color: var(--b);
  accent-color: var(--b);
  }
input[type="checkbox"] {
cursor: pointer;
}

div.resterConnecter input{
  width: 20px;
  margin: 0;
}
div.resterConnecter p{
  margin: 0;
  margin-left: 10px;
  width: 313px;
  font-size: 25px;
  margin-bottom: 5px;
}

div{
  display: flex;
}

a{
  text-decoration: none;
  color: var(--c);
  width: 343px;
  font-size: 20px;
}
label{  
  width: 343px;
  margin-top: 10px;
  margin-bottom: 10px;
  font-size: 30px;
}
p{
  width: 325px;
  font-size: 20px;
}

div.boutons{
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
font-size: 15px;
}
.boutons p{  
  color: var(--d);
  background-color: var(--b);
  font-size: 15px;
  width: 313px;
  text-align: center;
  padding: 15px;
  border-radius: var(--border-radius-boutons);
  font-weight: bold;
}

.boutons a{
  color: var(--d);
  background-color: var(--c);
  font-size: 15px;
  width: 313px;
  text-align: center;
  padding: 15px;
  border-radius: var(--border-radius-boutons);
  font-weight: bold;
}
