html {
	scroll-behavior: smooth;
}

body {
  margin: 0px;
  background-color: #eeeeee;
  font-family: Tahoma;
}

nav ul {
list-style: none;
display: flex;
background-color: #CD325CB3;      /*#0182ab;*/
justify-content: center;
}

nav a {
	color: #fff;
	text-decoration: none;
	text-transform: uppercase;
	padding: 20px;
}

nav a:hover {
	background-color: #fff;
	color: #CD325CB3;
}

header {
  background-color: #32cda361;
  padding: 20px;
  display: flex;
  align-items: center;
}

#citation {
  border-top: 2px solid #CD325CB3;
  padding-top: 10px;
}

footer {
  background-color: #32CDA361;   /*lightblue*/
  padding: 20px;
  text-align: center;
}

img {
  background-color: white;
  border-radius: 100%;
  border: 8px solid #CD325CB3;
  box-shadow: 4px 5px 5px #888;
  margin-right: 20px;
  width: 150px;
}

h2, h3, h4 {
	text-transform: uppercase;
  color: black;
	font-family: 'Quicksand', sans-serif;
}

#formations, #experiences, #coordonnees, #skills, #interets {
	background-color: #ffffff;
	padding: 20px;
	margin-bottom: 20px;
	width: 80%;
	margin: 20px auto;
	box-shadow: 5px 5px 5px #bbbbbb;
	text-align: justify;
}

.barre {
  margin-bottom: 10px;
	width: 200px;
	height: 15px;
	background-color: #dddddd;
	border-radius: 10px;
}

.barreRemplissage {
	width: 80%;
	height: 100%;
	background-color: #CD325CB3;      /*#0182ab;*/
	border-radius: 10px;
}

#contenu {
  background-color: #eeeeee;
  }