body {
	background-image: url(dietetique.jpeg);
	background-attachment: fixed;
}

article{
    background: #FFFFFF55;
    border: solid 2px grey;
    margin-top: 10em;
}

/* 99 A0 A1 .. A9 AA AB .. AF B0 B1 B2 .. FF c'est pour le background de la couleur et son opacité on prend en compte de 00 à FF */

article, nav {
  padding: 1em;
  border: solid 2px grey;
  border-radius: 100px;
  padding: 2em;
  font-family : arial;
  
}

nav {
    display: none;
    background-color: beige;
    position: absolute;
    top: 0;
    width: calc(100% - 3em);
    height: 20em;
    font-size: 80%;
    font-weight: bold;
}

header {
	background-color: beige;
    text-align: center;
    color: black;
    border: solid 3px grey;
    border-radius: 50px;
    padding: 1em;
    width: 100%;
    margin: 3em auto 3em auto;
	font-family: arial;
}

section {
    text-align: left;
    background-color: beige;
    border: solid 2px grey;
    border-radius: 50px;
    padding: 4em;
    width: 80%;
    margin: 3em auto 3em auto;
	font-family: arial;
}

h2{
	text-align: center;
}

a:hover {
  color: pink;
}

a {
text-decoration: none;
color: grey;
}




@media screen and (min-width : 800px ) {

article {
  float: right;
  width: 70%;
  margin-top: 1em;
}

nav {
  display: block;
  width: 20%;
  position: fixed;
  margin-top: 25em;

}

header {
    width: 50%;	
}

}

@media print {

nav {
  display: none;
}

}