@charset "UTF-8";

body {
    /*  distance entre le menu et le premier titre*/
}

.container-nav {
  width: 100%;
  margin: auto;
  padding-bottom: 10px;
}

.nav-img { margin-top: -20px; margin-left: 140px; }

.imgsize{ width:390px; }

.nav-h-menu { padding-top: 3px; }

.navbar{
  background-color:#0060a9;
  height: 157px;
}

.deuxieme {
padding-top: 0px; 
 padding-left: 613px;
 padding-bottom: 20px;
}

.nav-item {
  padding-top: 0px;
  max-width: 450px;
  background-color:#0060a9;
}

.nav-separateur {
  font-size: 19px;
  color: white;
  font-weight: none;
  float: left;
  display: block;
  text-align: center;
  padding: 10px 18px;
  border-radius: 4px;
  text-decoration: none;
 }

.nav-menu {
  font-size: 18px;
  color: white;
  font-weight: none;
  float: left;
  display: block;
  text-align: center;
  padding: 10px 18px;
  border-radius: 4px;
  text-decoration: none;
 }

 .nav-menu:hover, .nav-menu:active {
  background-color: #054b80; 
  color: white;
  text-decoration: none;
   }

   .nav-menu-form {
    font-size: 16px;
    color: white;
    font-weight: none;
    float: left;
    display: block;
    text-align: center;
    padding: 12.5px 18px;
    border-radius: 4px;
    text-decoration: none;
    background-color:#0060a9;
   }
  
   .nav-menu-form:hover, .nav-menu-form:active {
    background-color: #054b80; 
    color: white;
    text-decoration: none;
     }

.enter {
  display: none;
}
.efface { /*  affiche l'info */
  display: unset;
}

.barre {
  font-size: 15px;
  padding-left: 17px;
  padding-right: 17px; 
  
 }
.nav-barre {
  padding-top: 34px;
  color: #d4d3d3;
 }
.nava {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
}

.nava-li {
float: right;
}

.nava-li a {
display: block;
padding: 8px;
background-color: white;
}

.navo {
font-size: 14.5px;
color: black;
padding-left: 10px;
float: right;
}

.navo:hover, .navo:active {
color: red;
text-decoration: none;
}


     .container-footer {
      width: 75%;
      margin: auto;
      padding-bottom: 10px;
      padding-top: 5px;
    }
    .separator-footer {
      border: 0.5px solid #979696;
      width: 100%;
      margin-bottom: 15px;
      margin-top: 30px;
    }

    .footer{
      background-color:#0060a9;
      color: white;
      padding-bottom: 70px;
      padding-top: 70px;
    }
    .nav-link-footer{
    text-align: right;
    }
    .nav-link-footer a{
      color: white;
      font-size: 14px;
    }
    
    .nav-link-footer a:hover, .nav-link-footer a:active {
      color: rgb(194, 194, 194);
      text-decoration: none;
    }
    
    .nav-copy {
      font-size: 14px;
      display: block;
      text-align: right;
      color: white;
    }

    .slogan{
      font-size: 18px;
      text-align: center;
      font-weight: 500;
      padding-top: 40px;
    }
    
    .adresse, .footer-links, .nav-copy {
      line-height: 20px;
      }
    
    .adresse {
      color: rgb(156, 156, 156);
      text-align: right;
      font-size: 14px;
    }
    
    
    
    .info-form-footer {
        display: block;
        padding-bottom: 10px;
    }

    
/* --------------------- DÉBUT MENU DÉROULANT ------------------ */


/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
  z-index: 4;
}

/* Show the dropdown menu on hover */
.dropdown:hover {
  display: block;
}

/* --------------------- FIN MENU DÉROULANT ------------------ */

.container-home {
  width: 75%;
  margin: auto;
  padding-bottom: 10px;
  padding-top: 5px;
}

.container-image {
  width: 65%;
  margin: auto;
  padding-bottom: 10px;
  padding-top: 5px;
}
.container-connection {
  width: 60%;
  margin: auto;
  margin-top: 50px;
  padding-bottom: 120px;
  padding-top: 5px;
}

.form-chekbox {
  margin-top: -31px;
  margin-left: 165px;
}

.container-connection h2 {
  padding-bottom: 20px;
}

.container-section2 {
  width: 80%;
  margin: auto;
  padding-bottom: 130px;
}

.container-formulaire {
  width: 100%;
}

.texte-ferme {
  text-align: left; 
  padding-top: 2px;
  padding-bottom: 40px;
  margin-left: 10px; 
  font-size: 12px; 
  color: #0060a9;
}

.text-title {
  font-size: 30px;
  font-weight: bold;
  text-align: center; 
  color: #000000;
}

    .connect {
      margin: 15px 0px;
      box-sizing: border-box;
    }

    .connect input[type=email], .connect input[type=password], .connect input[type=text] {
      width: 100%;
      font-size: 20px;
      max-width: 500px;
      padding: 12px;
      margin: 0px 0 0px 0;
      border: 1px solid #ccc;
      border-radius: 4px;
      display: inline-block;
      background: #ffffff;
      resize: vertical;
    } 

    .oublie {
      margin-top: -23.5px;
      margin-left: 340px;
    }

    .form-button {
      margin-top:30px;
    }

    .form-button button{
      width: 280px;
      padding: 10px 20px; 
      font-size: 22px;
    }
    
    .title-button{
      font-size: 36px;
      font-weight: 500;
      padding-bottom: 15px;
    }

.tableau {
  padding-bottom: 70px;
  border-radius: 5px;
}

table {
  border-collapse: collapse;
  width: 100%;
}

th {
  background-color:#0060a9;
  color: white;
  font-size: 18px;
  text-align: left;
  padding: 15px;
}

td {
  text-align: left;
  padding: 15px;
  border-bottom: 1px solid #ddd;
  text-decoration: none;
}

tr:hover {
  background-color:#d1d1d1;
}

.pagination {
  padding-top: 15px;
  margin-left: 10px;
  border-radius: 5px;
}

.b-form {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 2px 10px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  margin-top: -0px;
  margin-left: 10px;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
  cursor: pointer;
  border-radius: 6px;
}

.b-form:hover, .b-form:active {
  background-color: rgb(54, 126, 56);
  text-decoration: none;
}

.head-collaborateur {
  padding-top: 20px;
  padding-bottom: 10px;
  color: #4d4d4d;
}

.controls {
  margin: 15px 0px;
  box-sizing: border-box;
}

.controls input[type=email], .controls input[type=password], .controls input[type=text] {
  width: 100%;
  font-size: 20px;
  max-width: 725px;
  padding: 12px;
  margin: 0px 0 0px 0;
  border: 1px solid #ccc;
  border-radius: 4px;
  display: inline-block;
  background: #ffffff;
  resize: vertical;
}

textarea {
  width: 100%;
  height: 150px;
  padding: 12px;
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 4px;
  background-color: #ffffff;
  font-size: 20px;
  resize: none;
}
.contact{
  padding-top:40px;
  font-size: 38px;
  font-weight: 500;
}

.titre{
  font-size: 30px;
  font-weight: 500;
}

.titre2{
  font-size: 40px;
  font-weight: 500;
  color: #4d4d4d;
  padding-bottom: 5px;
  padding-top: 40px;
}

.enter { display: none; } /*  applique le enter */
.efface2 { display: initial; } /*  efface info */