html{
	background-color : #B7BCBC; 
	/* C6C3DA B7BCBC*/
	/* background-image: linear-gradient(60deg, #808080, #ffffff); */
}
body{
	padding:0px;
	margin : 0px;
	font-family:Verdana;
	/* border: solid 2px red; */
}
#ruban {
	height : 30px;
	position:relative;
	overflow:hidden;
}
#par_{
	position : absolute;
	top:5px;
	right:-980px;
	bottom:0px;
	margin : 0px;
	padding : 0px;
	color:#ffffff;
	/* color : #0000b3; */
	font-size:16px;
	width :980px;
} 
body header{
	padding:0px;
	margin : 0px;
}
#sec2, #menu, #corps{
	width:1200px;
	margin: auto;
}
header img{
	width : 200px;
	height : 100px;
}
header h1{
	font-family:Brush Script Std, Brush Script MT, cursive;
	font-size:50px;
	/* border : 2px solid blue; */
}
header img, header h1{
	display : inline-block;
	vertical-align : middle;
}
/* #menu > li, #menu > li li{
	width : 200px;
	position: relative;
	display : inline-block; 
	vertical-align : top; 
	border : 2px solid red;
}
#menu > li:hover, #menu > li li{
	display : inline;
}
#menu > li li{
	display:none;
} */

nav, #ruban {
	/* background-color : #f90606; */
	background-color : #75151e;
}
#menu a{
	  display:block;
	  color:#ffffff;
	  text-decoration:none;
	  width: auto; 
  }
  
  #menu > li {
	position: relative;
	display:inline-block;
	width: 150px;
	padding: 6px 15px;
	/* background-color: #009; */
	/* background-color:#001450; */
	/* background-image: linear-gradient(#009, #00ffff 20%, #009 80%,#00ffff); */
}
#menu > li li { 
	background: transparent none; 
	width: 450px; 
	padding:6px 15px;
	}
#menu > li li a { color: #444; }
#menu > li li:hover { background:#eee; }
#menu > li:first-child {
	/* border-right: 1px solid #777; */
	border-radius: 8px 0 0 8px;
}
#menu > li + li {
	border-left: 1px solid #aaa;
	/* border-right: 1px solid #777; */
}
#menu > li:last-child {
	border-right: 0px;
	/* border-left: 1px solid #aaa; */
	border-radius: 0 8px 8px 0 ;
}
#menu > li:hover {
	background-color: #999;
	background-image: linear-gradient(#ccc, #aaa 50%, #999 50%,#bbb);
}
/* (presque) fin de la partie positionnement/déco */
/* dans cette déclaration, on fixe le max-height */
#menu ul {
	position: absolute;
	top: 2em; left: 0; 
	max-height:0em;	
	margin: 0; padding: 0;
	background-color: #ddd;
	background-image: linear-gradient(#fff,#ddd);
	overflow: hidden;
	transition: 1s max-height 0.3s;
	border-radius: 0 0 8px 8px;
	z-index:1;
}
/* ici on change la valeur de max-height au :hover */
#menu > li:hover ul {
	/* à adapter, le minimum est le meilleur mais voyez large 😉 */
	max-height: 26em;
}

#corps{
	background-color:#E8E4F0;
	border-radius: 5px;
}
#footer{
	height:100px;
	background-color : #75151e;
	color:#ffffff;
}

#footer aside{
    position:relative;
    top:50px;
}

#footer img{
	width:12px;
	height:12px;
	float:left;
}
#footer p{
	font-size:12px;
	margin:0px; 
}