html{
	scroll-behavior: smooth;
}


body{
	
	margin:0;
	background-color: #eeeeee;
	font-family: tahoma;
	text-align: center;
}

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;
	
}

h2 {
		text-transform: uppercase;
		font-family: 'Dancing Script', cursive;
}
    h1 {
	font-family: arial;
}
	color:blue;
	}
	p{
	color:red;
	font-size:12px;
	}
	strong{
	color:blue;
	}
	span{
	color:green;
		}
		span {
			color:green;
		}
		#formation,#experiencesprofessionnelles,#bio,#competences {
			background-color: #ffffff;
			padding:20px;
			margin-bottom: 20px;
			width: 80%;
			margin:20px auto;
			box-shadow: 0px 0px 13px #bbbbbb;
		}
	#bio img {
		width: 150px;
		border-radius: 100%;
		box-shadow: 0px 0px 13px #bbbbbb;
		border: 8px solid #bbbbbb;
	}
	#bio{
		display: flex;
		align-items: center;
		text-align: center;
		
	}
		.formation {
			margin-left: 20px;
			text-align: center;
			<p>
			2018| PerfectionnementBureautique C2I 
			2016| Perfectionnement Bureautique C2I Niveau 1  
			2013| L2 Droit Université deMontpellier 
			2012| L1 Droit Université deMontpellier 
			</p>
			
			
			
		}
		/* ceci est une remarque 
		#competences{
	background-color:gray;
	padding:20px;
	border:10px dashed black;
}
*/
.barre {
	width: 200px;
	height: 15px;
	background-color: #dddddd;
	border-radius: 10px;
}
.barreremplissage {
	width: 80%;
	height: 100%;
	background-color: #0182ab;
	border-radius: 10px;
}