ul, li
{
	margin:0;
	padding:0;
	list-style:none;
}
@media all and (min-width:681px)
{
	nav#menu
	{
		width:600px;
		min-height:150px;
		margin-left:40%;
	}
	ul#circle
	{ 
		width:600px;
		min-height:100px;
		display:flex;
	}
	ul#circle li a
	{
		display:block;
		width:70px;
		height:70px;
		margin-left:30px;
		border-radius:100px;
		text-align:center;
		line-height:85px;
		font-family:"Open Sans";
		font-size:20px;
		color:white;
		text-decoration:none;
	}
	ul#circle li a:hover
	{
		background-color:#FBED21;
	}
	ul#classic li
	{ 
		text-align:center;
	}
	ul#classic
	{
		width:600px;
		min-height:40px;
		display:flex;
		margin-top:-20px;
	}
	ul#classic li
	{ 
		width:70px;
		text-align:center;
		margin-left:30px;
		margin-top:0px;
		line-height:70%;
	}
	ul#classic li a
	{
		display:inline;
		color:black;
		text-decoration:none;
		font-size:Open Sans;
		font-size:13px;
		font-weight:regular;
	}
	ul#classic li a:hover
	{
		color:limegreen;
	}
	
	/* ********** Les couleurs MENU 1 *************** */
	ul#circle li:nth-of-type(1) a	{ background-color:#0079A1;}
	ul#circle li:nth-of-type(2) a	{ background-color:#0079A1;}
	ul#circle li:nth-of-type(3) a	{ background-color:#8CC63E;}
	ul#circle li:nth-of-type(4) a	{ background-color:#8CC63E;}

	/* ********** Les couleurs en hover MENU 1*************** */
	ul#circle li:nth-of-type(1) a:hover	{ background-color:#8CC63E;}
	ul#circle li:nth-of-type(2) a:hover	{ background-color:#8CC63E;}
	ul#circle li:nth-of-type(3) a:hover	{ background-color:#0079A1;}
	ul#circle li:nth-of-type(4) a:hover	{ background-color:#0079A1;}

	/* ********** Les couleurs MENU 2 *************** */
	ul#classic li:nth-of-type(1) a	{ color:#0079A1;}
	ul#classic li:nth-of-type(2) a	{ color:#0079A1;}
	ul#classic li:nth-of-type(3) a	{ color:#0079A1;}
	ul#classic li:nth-of-type(4) a	{ color:#0079A1;}

	/* ********** Les couleurs en hover MENU 2*************** */
	ul#classic li:nth-of-type(1) a:hover	{ color:#8CC63E;}
	ul#classic li:nth-of-type(2) a:hover	{ color:#8CC63E;}
	ul#classic li:nth-of-type(3) a:hover	{ color:#8CC63E;}
	ul#classic li:nth-of-type(4) a:hover	{ color:#8CC63E;}

	#hamburger
	{
		display:none;
		width:100%;
		height:50px;
		text-align:center;
	}
}

@media all and (max-width:680px)
{
	#menu
	{
		display:none;
	}
	ul#circle
	{
		display:none;
	}
	ul#classic
	{
		flex-wrap:wrap;
	}
	ul#classic li
	{
		width:100%;
	}
	#hamburger
	{
		display:block;
		text-align:center;
		margin-top:20%;
	}
}
