section{
  margin: 0 3vw 0 3vw;
}

/* ENTETE */
          h1{
            margin:0;
            font-size: 70px;
            font-family: system-ui;
          }

          /*BLOCKHEADR*/
          .welcome{
            display: flex;
          }

          /* Cases supérieures */
          .presentation{
            flex:1 1 60%;
            margin: 5vh;
            font-family: system-ui;
          }

          /* Cases supérieures */
          .texte{
            font-size: 18px;
            margin: 5vh;
            font-family: system-ui;
          }

          /* CV */
          .rectangle{
            margin-top: 2vh;
            padding:1.5vh;
            border:2px solid black;
            font-size: 22px;
            font-family: system-ui;
            font-weight: bold;

          }

/* PROJETS ACCUEIL */
          /* Conteneur des projets */
          .projets{
            display: flex;
          }

          /* projets */
          .contenu{
            flex: 1 1 20%;
            margin: 5vh;
            border:2px solid black;
            display: block;
            flex-wrap: wrap;
            max-width: 30vw;
          }

          /* Informations projets */
          .entete{
            width:100%;
            display: block;
            display: flex;
            border-bottom: 2px solid black;
          }

          /* Taille de la banière gauche */
          .gauche{
            flex:1 1 20px;
          }

          /* Numéro de la sous partie */
          .type{
            background-color: white;
            border-bottom:2px solid black;
            padding: 1vh;
            font-size: 24px;
            font-family: system-ui;
          }

          /* Titre de la partie */
          .year{
            background-color: white;
            padding: 1vh;
            font-size: 24px;
            font-family: system-ui;
          }

          /* Taille de la bannière droite */
          .droite{
            background-color:white;
            display: flex;
            flex:1 1 30px;
            border-left:2px solid black;
            padding: 1vh;
            font-size: 25px;
            font-style: italic;
            font-weight: bold;
            font-family: system-ui;
            align-items: center;
            padding-left: 2vh;
          }



          /* photo projet */
          .image{
            display: flex;
            flex-wrap: wrap;
            background-color: white;
            padding: 2vh;
          }


/* PROJETS PAGES */
          /* projets */
          .accueil{
            display: flex;
            background-color:white;
            border-right:2px solid black;
            border-bottom:2px solid black;
            border-left:2px solid black;
            text-align: center;
            padding:2vh;
            font-family: "Helvetica", sans-serif;
            font-size: 25px;
            font-style: italic;
          }

          /* projets */
          .titre-projet{
            display: flex;
            background-color:white;
            border:2px solid black;
            text-align: center;
            padding:2vh;
            font-family: "Helvetica", sans-serif;
            font-weight: bold;
            font-size: 25px;
          }

          .type-de-projet{
            border-right:2px solid black;
            border-left:2px solid black;
            border-bottom:2px solid black;
            background-color: white;
            flex: 7;
            width: 100%;
            padding: 2vh;
            font-family: "Helvetica", sans-serif;
            font-size: 20px;
          }

          /* Pour les légendes */
          .date-de-creation{
            flex: 1;
            width: 100%;
            background-color: white;
            border-bottom:2px solid black;
            border-right:2px solid black;
            padding: 2vh;
            font-family: "Helvetica", sans-serif;;
            font-size: 20px;
            text-align:right;
          }

          .materiel{
            border-right:2px solid black;
            border-left:2px solid black;
            border-bottom:2px solid black;
            background-color: white;
            flex: 6;
            width: 100%;
            padding: 2vh;
            font-family: "Helvetica", sans-serif;
            font-size: 20px;
          }

          /* Pour les légendes */
          .couleurs{
            flex: 3;
            text-align:right;
            width: 100%;
            background-color: white;
            border-bottom:2px solid black;
            border-right:2px solid black;
            padding: 2vh;
            font-family: "Helvetica", sans-serif;;
            font-size: 20px;
          }

          .labeur{
            border-right:2px solid black;
            border-left:2px solid black;
            border-bottom:2px solid black;
            background-color: white;
            flex: 4;
            width: 100%;
            padding: 3vh;
            font-family: "Helvetica", sans-serif;;
            font-size: 20px;
          }

          /* Pour les légendes */
          .paratexte{
            flex: 6;
            width: 100%;
            background-color: white;
            border-bottom:2px solid black;
            border-right:2px solid black;
            padding: 1vh;
          }

          .precedent{
            border-bottom:2px solid black;
            border-left:2px solid black;
            border-right:2px solid black;
            background-color: white;
            width: 50%;
            font-family: "Helvetica", sans-serif;
            font-size: 20px;
            padding: 2vh;
          }

          /* Pour les légendes */
          .suivant{
            text-align:right;
            border-bottom:2px solid black;
            border-right:2px solid black;
            width: 50%;
            background-color: white;
            font-family: "Helvetica", sans-serif;;
            font-size: 20px;
            padding: 2vh;
            }

            a, a:hover, a:visited, a:active{
  	           color:#000;
  	            text-decoration:none;
              }
