/* Par Yann & Marty & Clément*/
*
{
font-family:Arial;
}
header {/* concerne toute l'entête*/
	background-color: rgba(0,59,86);
}
nav {
  background-color: silver;
  float: left;  /* le menu est à gauche de la page*/
  width: 18%;   /* prend 15% de la page en largeur*/
}
body {
	background-color: rgba(48,48,48)
}
html{
	scroll-behavior: smooth;	
}
section {
  padding: 0px; /* pas de marge à l'intérieur du bloc section, on peut aussi ne rien écrire.*/
  background-color: silver;
  margin-left: 20%;/* marge de 20% à droite à l'extérieur du bloc section.*/
  margin-right: 5%;
  position: relative;  /* les positionnements et les dimensions sont relatifs au bloc section et plus sur toute la page*/
}
section article {
  background-color: rgba(0,59,86);
  margin-right: 17%;/* marge de 17% à gauche à l'extérieur du bloc article.*/
  text-align: justify /* le texte prend toute la largeur du bloc*/
}
section aside {
  background-color: rgba(0,59,86);
  position: absolute;/* place l'élément n'importe dans le bloc section que si le bloc section est défini par sa position relative(par défaut en haut à gauche)*/
  /* top et right vont avec la propriété position: absolute: */
  top: 10px;/* laisse 10 pixel au dessus du block se positionne à droite avec un espace de 1%*/
  right: 1%;/* le block se positionne à droite avec un espace de 1%*/
  width: 15%;/* prend 15% de la largeur du bloc section*/
}
footer {
  font-family: Arial,Helvetica,sans-serif;
  font-size: 0.75em;    /* taille du texte */
  text-align: right;   /* alignement du texte à droite*/
  background-color: rgba(0,59,86);
 
}
a
{
color: rgba(0, 127, 255);
}
banniere
{
position:absolute; top:80px; left:7px;
}
	/* Mise en page du texte */
p
{
color: White;
}
ul
{
list-style:inside ;/* considère les puces dans le paragraphe pour l'affichage, */
}

h1 {
font-weight:Bold;
color: White;
}

h2 {
font-style:Italic;
text-decoration:Underline;
}
     /* Navbar */
*
{
font-family:Arial;
}	  
.topnav {
  overflow: hidden;
}	  
/* Style the navigation bar */
.navbar {
  width: 100%;
  background-color: #555;
  overflow: auto;
}

/* Navbar links */
.navbar a {
  float: left;
  text-align: center;
  padding: 12px;
  color: white;
  text-decoration: none;
  font-size: 17px;
}

/* Navbar links on mouse-over */
.navbar a:hover {
  background-color: #000;
}

/* Current/active navbar link */
.active {
  background-color: rgba(0,59,86);   /* Bouton menu */
}

/* Barre de Recherche*/
.topnav {
  overflow: hidden;
}
.topnav .search-container {
  float: right;
}
.topnav input[type=text] {
  padding: 6px;
  margin-top: 8px;
  font-size: 17px;
  border: none;
}
.topnav .search-container button {
  float: right;
  padding: 6px 10px;
  margin-top: 8px;
  margin-right: 16px;
  background: #ddd;
  font-size: 17px;
  border: none;
  cursor: pointer;
}
.topnav .search-container button:hover {
  background: #ccc;
}
@media screen and (max-width: 600px) {
  .topnav .search-container {
    float: none;
  }
  .topnav input[type=text], .topnav .search-container button {
    float: none;
    display: block;
    text-align: left;
    width: 100%;
    margin: 0;
    padding: 14px;
  }
  .topnav input[type=text] {
    border: 1px solid #ccc;  
  }
/* Fin du css de la barre de recherche */
}

<div