html {scroll-behavior: smooth;

}

body {
	background-color: ##0182ab;
	font-family: arial;

}
nav ul {
list-style:none;
	display: flex;
	background-color: #0182ab;
	padding: 20px;
justify-content:center;

}

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

nav a:hover {
	background-color: #fff;
	color: #0182ab;
}​​

header, footer{
	background: rgb(2,0,36);
  background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(29,9,121,1) 35%, rgba(0,212,255,1) 100%);
	padding-top: 60px;
	padding-bottom: 60px;
}


h1, h2, h3 {
	font-family: 'Roboto', sans-serif;
color: #6925a6;


}
 h1{
	 text-transform:uppercase;
	color:white;

}
strong{
	color:blue
}
span{
	color:blue
}
span{
	color:blue;
}
#Formation, #experiencesPro, #bio, #competences {
	background-color: #ffffff;
	padding: 20px;
	margin-bottom: 20px;
	width: 80%;
	margin: 20px auto;
	box-shadow: 5px 5px 5px #bbbbbb;
}
#bio {
	display: flex;
	align-items: center;
}
#bio p {
text-align: justify;
}
/* Ceci est un commentaire */

#bio img {
	width: 150px;
	height: 150px;
	border-radius: 100%;
	border: 8px solid #bbbbbb;
	box-shadow: 4px 5px 5px #888;
	margin-right: 20px;
}

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

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