
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*   ---------------------------------------------------------------------------------------------------------------------------------------------------------  *//*
									 ___  ___     ______     _______      _______         _______  __   ___________  _______    ___   ___     
									/  / /  /    /      |   /       |    /       |       /       ||  | |           ||   ____|   \  \  \  \    
								   /  / /  /    |  ,----'  |   (----`   |   (----`      |   (----`|  | `---|  |----`|  |__       \  \  \  \   
								  /  / /  /     |  |        \   \        \   \           \   \    |  |     |  |     |   __|       \  \  \  \  
								 /  / /  /      |  `----.----)   |   .----)   |      .----)   |   |  |     |  |     |  |____       \  \  \  \ 
								/__/ /__/        \______|_______/    |_______/       |_______/    |__|     |__|     |_______|       \__\  \__\
                                                                                                              
																																	  *//* Image en Code Ascii */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------  */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */


/* Configure le fond du site en noir */

body
{
background:black;
padding:0px;
}

/* Le cadre dans lequel se trouve le contenu du site */

#containeur
{
height:auto;
width:800px;
margin-left:auto;
margin-right:auto;
border:1px #A9A9A9 solid;
}

/* Permet de garder le contenu de la page dans le cadre */

#separe
{
clear:both;
}

/* Configuration de la bannière principale du site */

#bann
{
background:url(images_site/banner.png);
height:130px;
width:800px;
margin-left:auto;
margin-right:auto;
position:relative;
cursor:pointer;
}

/* Créer un block de la taille de la bannière pour executer le lien */

#bann a
{
display:block;
height:130px;
width:800px;
}

/* Configuration de la bannière flash */

#bann-flash
{
margin-left:auto;
margin-right:auto;
position:absolute;
cursor:default;
}

/* Ne met aucune bordure sur toutes les images du site */

a img
{
border:none;
}

/* Configuration des barres du site */
 
.hr
{
margin-left:auto;
margin-right:auto;
height:20px;
width:410px;
clear:both;
border-bottom:1px solid #A9A9A9;
}

/* Configuration de tous les liens du site */

a
{
color:white; 
text-decoration:none;
}

/* Configuration de tous les liens du site lorsqu'ont les survolent */

a:hover
{
color:red; 
text-decoration:none;
}

/* Configure la couleur des liens avec les numéros de pages */

#n a
{
color:red; 
text-decoration:none;
}

/* Configure la couleur des liens avec les numéros de pages au passage de la souris */

#n a:hover
{
color:white; 
text-decoration:none;
}

/* Configuration des liens du menu */

#menu
{
height:20px;
width:auto;
color:white;
font-size:18px;
font-weight:bold;
text-align:center;
margin-top:10px;
padding:5px;
}

/* Configuration des liens du menu lorsqu'il sont inactifs */

#menu a
{
color:white;
text-decoration:none;
}

/* Configuration de la couleur des liens du menu quand on les survolent */

#menu a:hover
{
color:red;
}

/* Configuration du bloc en dessous du menu (sert a placer les éléments des pages correctement) */

#contenu
{
height:auto;
width:780px;
float:left;
color:white;
padding:10px;
text-align:center;
}

/* Contour des titres (cadre) des pages du site (toute la largeur de la page) */

#title_g
{
height:30px;
width:770px;
border:2px #A9A9A9 solid;
font-weight:bold;
font-size:25px;
font-family:"Cataneo BT", sans-serif;
padding-left:5px;
margin-bottom:15px;
text-align:center;
border-radius:15px;
}

/* Configuration du pied de page */

#footer
{
height:15px;
padding:5px;
width:790px;
border:1px #A9A9A9 solid;
border-top:0px;
color:white;
margin-left:auto;
margin-right:auto;
text-align:right;
font-size:11px;
vertical-align:middle;
}

#home
{
text-align:center;
}

#home a:hover
{
opacity:0.65;
}
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*   ---------------------------------------------------------------------------------------------------------------------------------------------------------  *//*
											 ___  ___    __   __   ___________    __    ____   _______    ___   ___     
											/  / /  /   |  \ |  | |   ____\   \  /  \  /   /  /       |   \  \  \  \    
										   /  / /  /    |   \|  | |  |__   \   \/    \/   /  |   (----`    \  \  \  \   
										  /  / /  /     |  . `  | |   __|   \            /    \   \         \  \  \  \  
										 /  / /  /      |  |\   | |  |____   \    /\    / .----)   |         \  \  \  \ 
										/__/ /__/       |__| \__| |_______|   \__/  \__/  |_______/           \__\  \__\
                                                                                
*//* ---------------------------------------------------------------------------------------------------------------------------------------------------------  */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* Contour du titre (cadre) de la page news (taille initial/2) */

/* Configuration du drapeau anglais */

#en
{
background-image:url('images_site/drapeau_en.gif');
background-repeat:no-repeat;
float:right;
height:11px;
width:16px;
margin-top:5px;
}

#en a
{
display:block;
height:11px;
width:16px;
}

/* Configuration du drapeau français */

#fr
{
background-image:url('images_site/drapeau_fr.gif');
background-repeat:no-repeat;
float:right;
height:11px;
width:16px;
margin-top:5px;
}

#fr a
{
display:block;
height:11px;
width:16px;
}

#title
{
height:30px;
width:475px;
border:2px #A9A9A9 solid;
font-weight:bold;
font-size:25px;
font-family:"Cataneo BT", sans-serif;
padding-left:5px;
margin-bottom:15px;
text-align:center;
float:left;
border-radius:15px;
}

#image_projet
{
float:left;
margin-left:20px;
margin-top:74px;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*   ---------------------------------------------------------------------------------------------------------------------------------------------------------  *//*
										 ___  ___     _______  _______     ___       ______          _______    ___   ___     
										/  / /  /    /  _____||   ____|   /   \     |   _  \        /       |   \  \  \  \    
									   /  / /  /    |  |  __  |  |__     /  ^  \    |  |_)  |      |   (----`    \  \  \  \   
									  /  / /  /     |  | |_ | |   __|   /  /_\  \   |      /        \   \         \  \  \  \  
									 /  / /  /      |  |__| | |  |____ /  _____  \  |  |\  \----.----)   |         \  \  \  \ 
									/__/ /__/        \______| |_______/__/     \__\ | _| `._____|_______/           \__\  \__\
																															  
*//* ---------------------------------------------------------------------------------------------------------------------------------------------------------  */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* Permet d'encadrer les images et les textes dans la page gears (créer un cadre (insivible) qui contient l'instrument,son image,son titre,ect) */

.gear
{
float:left;
width:775px;
height:auto;
}

/* Configuration des textes pour les noms des instruments dans la page gears */

.texte
{
float:left;
padding:10px;
margin-left:25px;
text-align:left;
margin-top:17px;
}

/* Configuration du texte dans gears , version decalée à gauche */

.texte1
{
margin-left:70px;
margin-top:17px;
}

/* Configuration du texte dans gears , version centrée */

.texte2
{
margin-left:-20px;
}

/* Configuration du texte dans gears , version decalée à droite */

.texte3
{
margin-left:350px;
margin-top:17px;
}

/* Configuration du texte dans gears , version centrée decalée à droite */

.texte4
{
margin-left:280px;
margin-top:17px;
}

/* Configuration des images dans la page gears a gauche */

.image
{
float:left;
margin-left:25px;
margin-top:17px;
}

/* Configuration des images dans la page gears au centre */

.image1
{
float:right;
margin-right:320px;
margin-top:17px;
}

/* Configuration des images dans la page gears a droite */

.image2
{
float:right;
margin-right:50px;
margin-top:17px;
}

/* Configuration de l'image du piano dans la page gears */

#image3
{
float:left;
margin-top:15px;
}

/* Configuration de l'image du piano2 dans la page gears */

#image4
{
float:left;
margin-left:100px;
margin-top:15px;
}

/* Configuration de la flèche dans la page gears */

#image5
{
float:left;
margin-top:95px;
padding:5px;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*   ---------------------------------------------------------------------------------------------------------------------------------------------------------  *//*
							 ___  ___     ______   ______    __   __   ___________     ___       ______  ___________    ___   ___     
							/  / /  /    /      | /  __  \  |  \ |  | |           |   /   \     /      ||           |   \  \  \  \    
						   /  / /  /    |  ,----'|  |  |  | |   \|  | `---|  |----`  /  ^  \   |  ,----'`---|  |----`    \  \  \  \   
						  /  / /  /     |  |     |  |  |  | |  . `  |     |  |      /  /_\  \  |  |         |  |          \  \  \  \  
						 /  / /  /      |  `----.|  `--'  | |  |\   |     |  |     /  _____  \ |  `----.    |  |           \  \  \  \ 
						/__/ /__/        \______| \______/  |__| \__|     |__|    /__/     \__\ \______|    |__|            \__\  \__\
																																	  
*//* ---------------------------------------------------------------------------------------------------------------------------------------------------------  */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* Formulaire de contact de la page contact */

form
{
margin-left:100px;
}

  /* -------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------ */