body {
	background-image: url(fond.jpg);
	background-attachment: fixed;
	background-color: black;
	background-repeat: no-repeat;
	background-position: center;
	margin: 0;
	padding: 0;
}
#bloc_page {
	margin: 0 auto;
	min-width:600px;
	max-width: 1024px;
}

/* =========================================================================== */
/*									EN TETE									   */
/* =========================================================================== */

header {
	height: 206px; 
	margin-top: 10px;
	margin-bottom: 10px;
	background-color: rgb(199,176,232);
	padding: 1px;
}
#img_header {
	background-image: url(ban.jpg);
	background-repeat: no-repeat;
	margin: 10px;
	padding: 10px;
	padding: 30px 10px 10px;
	height: 100px;
	color: rgb(72,47,112);
	text-align: right;
	font-size: 87px;
	font-family: Vivaldi, VivaldiItalic;
	font-weight: bold;
}

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on March 31, 2012 */
@font-face {
    font-family: 'VivaldiItalic';
    src: url('vivaldii-webfont.eot');
    src: url('vivaldii-webfont.eot?#iefix') format('embedded-opentype'),
         url('vivaldii-webfont.woff') format('woff'),
         url('vivaldii-webfont.ttf') format('truetype'),
         url('vivaldii-webfont.svg#VivaldiItalic') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* ------------- UItoTop jQuery Plugin 1.1 */
/* ------------- http://www.mattvarone.com/web-design/uitotop-jquery-plugin/ */

/*<![CDATA[*/
#toTop {
	display:none;
	text-decoration:none;
	position:fixed;
	bottom:20px;
	right:20px;
	overflow:hidden;
	width:51px;
	height:51px;
	border:none;
	text-indent:-999px;
	background-image: url(uitotop.png);
	background-repeat: no-repeat;
	background-position: left top;
	z-index: 900000;
}
#toTopHover {
	background:url(uitotop.png) no-repeat left -51px;
	width:51px;
	height:51px;
	display:block;
	overflow:hidden;
	float:left;
	opacity: 0;
	-moz-opacity: 0;
	filter:alpha(opacity=0);
}
#toTop:active, #toTop:focus {
	outline:none;
}
/*]]>*/

/* =========================================================================== */
/*									  MENUS									   */
/* =========================================================================== */

nav {
	cursor: pointer;
}

/* ---------------------------------------------- Menu principal haut de page */

nav#menu_haut {
	font-family: Arial, Verdana, serif;
	display: block;
	height: 30px;
	background-image: linear-gradient(rgb(129,103,176),rgb(63,33,97)); /* Norme W3C */
	background-image:-moz-linear-gradient(rgb(129,103,176),rgb(63,33,97)); /* Firefox */
	background-image:-webkit-gradient(linear, rgb(129,103,176),rgb(63,33,97)); /* Chrome, Safari */
	background-image:-o-linear-gradient(rgb(129,103,176),rgb(63,33,97)); /* Opera */
	background-image:-ms-linear-gradient(rgb(129,103,176),rgb(63,33,97)); /* IE */
	color:thistle;
}
nav#menu_haut ul {
	list-style-type: none;
	float:right;
	margin:0;
	padding:0;
	width:auto;
}
nav#menu_haut li {
	display:block;
	float:left;
	margin: 0 1px 0 0;
	height: 24px;
	padding: 6px 20px 0;
}
nav#menu_haut li:hover {
    color: white;
}

/* --------------------------------------------------- Sous-Menu haut de page */

nav.sous_menu_haut {
	width: 605px;
	margin: auto;
	text-align: center;
	font-family: Arial, Verdana, serif;
	font-size: 10px;
}
nav.sous_menu_haut ul {
    list-style-type: none;
	padding: 0;
	margin: 1px 0 0;
}
nav.sous_menu_haut li {
    display: inline-block;
    padding: 0 20px;
	border-right: 1px solid rgb(63,33,97);
}
nav.sous_menu_haut a {
    color: rgb(63,33,97);
    text-decoration: none;
	text-transform: uppercase;
}
nav.sous_menu_haut a:hover {
    color: white;
}

/* ---------------------------------------------------- Menu principal droite */

nav#menu_droite {
   float: left; 
   width: 190px; 
   text-align: left;
   top: 0;
   left: 0;
}
nav#menu_droite ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}
nav#menu_droite li.element_menu  {
	cursor: pointer;
	line-height: 20px;
	font-weight: bold;
	color: thistle;
	background-color: rgb(84,57,136);
	
	margin: 2px;
	margin-top: 10px;
	padding-left: 10px;
}
nav#menu_droite li.element_menu a {
	color: thistle;
	
	text-decoration: none;
	display: block;
	border: 0 none;
	height: 100%;
	text-align: left;
}
nav#menu_droite li.element_menu a:hover  {
	color: white;
}
nav#menu_droite ul.bloc_menu  {	
	margin: 0px 2px;
	padding: 5px;
}
nav#menu_droite ul.bloc_menu li a {
	color: rgb(84,57,136);
	
	text-decoration: none;
	display: block;
	border: 0 none;
	height: 100%;
	text-align: left;
}
nav#menu_droite ul.bloc_menu li a:hover  {
	color: thistle;
}

/* -------------------------------------------------------- Menu pied de page */

#menu_bas {
	margin: auto;
}
#menu_bas ul {
    list-style-type: none;
	margin-top: 4px;
}
#menu_bas li {
    display: inline-block;
    margin: 0 10px;
}
#menu_bas a {
    color: thistle;
    padding-bottom: 3px;
    text-decoration: none;
}
#menu_bas a:hover {
    color: white;
}


/* =========================================================================== */
/*									CORPS									   */
/* =========================================================================== */

section {
   padding: 5px; 
   color: black;
   background-color: white;
   font-size: 14px;
   font-family: Arial, Verdana, serif;
   text-align: justify;
   min-width:600px;
   max-width: 1024px;
   overflow: hidden;
}
article {
	padding-left: 200px;
}
aside{
	padding: 20px;
	margin: 20px;
	font-style:italic;
	background-color: rgb(180,164,200);
	opacity: 0.7;
	filter:alpha(opacity=70);
	-moz-opacity:0.7;
}
h1 {
	font-size: 2em;
	color: rgb(180,164,200);
	border-style:solid;
	border-bottom:5px dotted rgb(180,164,200);
	border-top: 0px;
	border-right: 0px;
	border-left: 0px;
}
h2 {
	font-size: 1.2em;
	color: rgb(104,87,131);
	margin: 10px 0px;
}
a:hover  {
   color: rgb(180,164,200);
}

#myTopBtn {
	display: none;
	position: fixed;
	bottom: 20px;
	right: 30px;
	z-index: 99;
	font-size: 18px;
	border: none;
	outline: none;
	background-color: black;
	color: white;
	cursor: pointer;
	padding: 15px;
	border-radius: 4px;
}
  
#myTopBtn:hover {
	background-color: #555;
}

/* --------------------------------------------------- Presentation des cours */

p.niveau_cours{
	text-decoration: underline;
	padding-top: 20px;
	font-weight: bold;
}
p.niveau1{
	color: Indigo;	
	padding-left: 10px;	
}
p.niveau2{
	color: MidnightBlue;
	padding-left: 20px;
}
p.niveau3{
	color: DarkSlateGray;
	padding-left: 30px;
}
p.niveau4{
	color: CadetBlue;
	padding-left: 40px;
}
table.table_cours{
	border-collapse: collapse;
	border: medium solid black;
	text-align: center;
}
table.table_cours th, table.table_cours td {
	border: thin solid black;
	padding: 3px;
}

/* =========================================================================== */
/*								PIED DE PAGE								   */
/* =========================================================================== */

footer
{
	height: 30px;
	background-image: linear-gradient(rgb(133,104,200),rgb(54,25,83)); /* Norme W3C */
	background-image:-moz-linear-gradient(rgb(133,104,200),rgb(54,25,83)); /* Firefox */
	background-image:-webkit-gradient(linear, rgb(133,104,200),rgb(54,25,83)); /* Chrome, Safari */
	background-image:-o-linear-gradient(rgb(133,104,200),rgb(54,25,83)); /* Opera */
	background-image:-ms-linear-gradient(rgb(133,104,200),rgb(54,25,83)); /* IE */
	font-size: 14px;
	font-family: Arial, Verdana, serif;
	text-align: center;
	margin-top: 7px;
	padding-top: 5px;
}