/**********************************************************************************************/
/*********************************** --- GENERAL --- ******"***********************************/
/**********************************************************************************************/
* {
	margin:0 ; 
	padding: 0; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	text-decoration:none;
	font-weight:normal;
}

html 					{height:100%}
body 					{margin:0px;height:100%}
#clear 					{clear:both;height:1px;overflow:hidden;}
img 					{border: none}
a 						{text-decoration: none}
b						{font-weight:bold}

/* navigation */
ul#menu li ul li a 		{border:0}
ul#menu li ul li a:hover{border:0}

/* transparence dans la navigation*/
ul#menu li ul li a		{filter:alpha(opacity=100); -moz-opacity:1; opacity: 1;}
ul#menu li ul li a:hover{filter:alpha(opacity=100); -moz-opacity:1; opacity: 1;}
	
/**********************************************************************************************/
/*********************************** --- COULEURS --- *****************************************/
/**********************************************************************************************/

/************************** DOMINANTE: rouge foncé***************************/
#topmargin, 
body,
form h6					{background-color:#666699;}
none 					{color:#666699;}
none 					{border-top: 1px solid #666699}
#headerbox 				{border-bottom: 1px solid #666699}
none 					{border-left: 1px solid #666699}
none 					{border-right: 1px solid #666699}

/*************************** DOMINANTE II: beige ***************************/
#contentBody,
#content select,
#content textarea		{background-color:#F2F2F2;}
none 					{color:#F2F2F2;}
none 					{border-top: 1px solid #F2F2F2}
none 					{border-bottom: 1px solid #F2F2F2}
none 					{border-left: 1px solid #F2F2F2}
none 					{border-right: 1px solid #F2F2F2}

/*************************** TONIQUE: Rouge foncé II***************************/
#content a:hover 		{background-color:#660000;}
#content a 				{color:#4169E1}
none 					{border-top: 1px solid #660000}
none 					{border-bottom: 1px solid #660000}
none  					{border-left: 1px solid #660000}
none  					{border-right: 1px solid #660000}

/*************************** 3e couleur: Violet ***************************/
ul#menu li a,
ul#menu li ul li a
						{background-color: #990099;}
#content h5,
#titleBar h3,
ul#menu li a:hover,
ul#menu li ul li a:hover
						{color:#990099;}
none 					{border-top: 1px solid #990099}
none  					{border-bottom: 1px solid #990099}
none 					{border-left: 1px solid #990099}
none 					{border-right: 1px solid #990099}

/*************************** 3e couleur II: bleu clair ***************************/
#content .frame,
ul#menu li ul li a:hover,
ul#menu li a:hover,
fieldset
						{background-color: #CCCCFF;}
none 					{color:#CCCCFF;}
none 					{border-top: 1px solid #CCCCFF}
none 					{border-bottom: 1px solid #CCCCFF}
none 					{border-left: 1px solid #CCCCFF}
none 					{border-right: 1px solid #CCCCFF}

/*************************** COMPLEMENT - vert***************************/
none					{background-color:#009900;}
none 					{background-color:#F2FFF2;}
none 					{color:#009900;}
none 					{border-top: 1px solid #009900}
none 					{border-bottom: 1px solid #009900}
none 					{border-left: 1px solid #009900}
none 					{border-right: 1px solid #009900}

/*************************** WHITE ***************************/
none					{background-color: #FFFFFF;}

ul#menu li a,
ul#menu li ul li a,
#content .frame h4,
#content a:hover,
#topmargin a,
#topmargin h2 ,
#content h4,
#content form h6	
						{color:#FFFFFF;}
none 					{border-top: 1px solid #FFFFFF}
none 					{border-bottom: 1px solid #FFFFFF}
none 					{border-left: 1px solid #FFFFFF}
none 					{border-right: 1px solid #FFFFFF}

/*************************** BLACK ***************************/
none 					{background-color: #000000;}
#content p,
#titleBar a,
#content h6		
						{color:#000000;}
#contentBody,
#content select, 
#content textarea,
#content input,
ul#menu li a,
ul#menu li ul li a
						{border-top: 1px solid #000000}
#contentBody,
#content select,
#content textarea,
#content input,
ul#menu li a,
ul#menu li ul li a			
						{border-bottom: 1px solid #000000}
#contentBody,
#content select,
#content textarea,
#content input,
ul#menu li a,
ul#menu li ul li a
						{border-left: 1px solid #000000}
#contentBody,
#content select,
#content textarea,
#content input,
ul#menu li a,
ul#menu li ul li a
						{border-right: 1px solid #000000}

/*************************** GRAY ***************************/
#headerbox
						{background-color:#999999}
none 					{color:#999999}
ul#menu li a:hover,
ul#menu li ul li a:hover	
						{border-top: 1px solid #999999}
ul#menu li a:hover,
ul#menu li ul li a:hover
						{border-bottom: 1px solid #999999}
ul#menu li a:hover,
ul#menu li ul li a:hover
						{border-right: 1px solid #999999}
ul#menu li a:hover,
ul#menu li ul li a:hover
						{border-left: 1px solid #999999}


#content input.radio {background:none;border:none}
#content fieldset {border:none}
/**********************************************************************************************/
/********************************* --- DISPOSITION --- ****************************************/
/**********************************************************************************************/

/* Largeurs + marges horizontales */
#contentBody,
#topmargin
						{width:740px; margin-left:auto;margin-right:auto;}
#topmargin h2 			{margin-right:5px;}
#logobox 				{width:160px;	margin-left: 5px;}
#navigbox 				{margin-left:-160px;}
#titleBar 				{padding-left: 20px;}
#content 				{margin-left: 20px; margin-right:20px; }
#content p, 
#content ol,
#content ul		
						{margin-left: 15px; margin-right:15px;}
#content ol 			{padding-left:5px;}
#content li 			{margin-left:15px;}
#content img 			{margin-left:5px;margin-right:5px;}
#content h4 			{padding-left:12px;width:688px}
#content h5				{margin-left:5px; margin-right:5px}
#content h6				{margin-left:10px; margin-right:10px}
#content form 			{width:100%;}
#content fieldset 		{margin-left:15px;margin-right:15px;padding-left:5px;}
#content legend 		{margin-left:15px;padding-left:5px; padding-right:5px;}
#content input,
#content textarea
						{width:100%;padding-left:3px; padding-right:3px;}
#content select			{width:150px;padding-left:3px; padding-right:3px;}
#content input.button 	{width:75px; padding-left:22px; margin-left:15px;}
#content input.radio	{width:15px;margin-left:5px;margin-right:3px}
#content label.radio	{margin-right:10px;}
#content .columns		{width:100%;}
#content .columns h4 	{width:328px;}
#content .columns img	{margin-left:auto;margin-right:auto}
#content .column_left 	{width:340px;margin-right:10px;}
#content .column_right 	{width:340px;margin-left:10px;}
#content form .column_left,
#content form .column_right
						{width:320px;}
#content form h6		{margin:0;margin-left:15px; padding-left:5px; margin-right:15px;padding-left:5px;}
#content .frame select	{width:100%;}
#content .frame form  	{width:240px;}
#content .frame			{width:250px;margin-left:20px;padding-left:10px;padding-right:10px; }
#content .frame h4 		{width:230px;padding-left:15px;}
#content .frame input.button {margin-left:0px;}
#content .absolute 		{margin-left: auto;margin-right: auto;}
#content .legend 		{}
ul#menu li a 			{margin-right:3px;width:100px}
ul#menu li ul li a 		{width:100px}

/* Hauteurs + marges verticales */
#topmargin 				{height:17px;}
#topmargin h2 			{padding-top:2px;} 
#contentBody 			{min-height:680px;padding-bottom:20px;}
#titleBar 				{padding-top:20px; }
#headerbox 				{height: 100px;}
#logobox 				{margin-top: 5px;height:62px;}
#navigbox 				{margin-top:84px;}
#content 				{margin-top:20px;}
#content p 				{margin-top:7px; margin-bottom:7px;}
#content li 			{padding-top:3px; padding-bottom:3px;}
#content img 			{margin-top:5px;margin-bottom:5px;}
#content h4 			{margin-top:20px;padding-top:1px;margin-bottom:15px;height:16px;}
#content h5 			{margin-top:15px;margin-bottom:10px ;}
#content form 			{margin-top:7px; margin-bottom:15px;}
#content fieldset 		{padding-top:10px;padding-bottom:10px}
#content legend 		{padding-top:2px; padding-bottom:2px;}
#content .columns img	{margin-top:15px;margin-bottom:15px;}
#content form label 	{}
#content label.radio	{}
#content input 			{margin-top:2px; margin-bottom:2px;}
#content input.button	{height:16px}
#content textarea 		{margin-top:2px; margin-bottom:2px;height:100px;padding-top:3px;
							padding-bottom:3px;}
#content select 		{margin-top:2px; margin-bottom:2px; }
#content input.button 	{margin-top:2px; margin-bottom:2px;}
#content input.radio 	{margin-top:2px; margin-bottom:2px;}
#content .column_left 	{height:100% ;}
#content .column_right 	{height:100% ;}
#content .frame 		{padding-top:10px;padding-bottom:10px;margin-bottom: 5px;}
#content .frame h4 		{margin-top:0px; margin-bottom:15px;}
#content .absolute 		{margin-top:20px;margin-bottom:20px;}
#content .legend 		{margin-bottom:30px;}
ul#menu li a			{padding-top:0px;padding-bottom:0px}
ul#menu li ul li a		{margin-top:1px;}



/**********************************************************************************************/
/************************************ --- Texte --- *******************************************/
/**********************************************************************************************/

/* en-tête */
.menu a,
#topmargin h2,
#topmargin a,
#titleBar h3
						{font-family:Arial, Helvetica, sans-serif}
#topmargin h2,
#topmargin a
						{font-size:10px;}
#topmargin a:hover 		{text-decoration:underline;}
#titleBar h3,
#titleBar  a 			{font-size:11px;font-weight:bold}

/* contenu */
#content * 				{text-align:left;font-size:11px;}
#content p 				{text-align:justify;}
#content li 			{text-align:justify;}
#content a:hover 		{text-decoration:underline;}
#content h4,
#content h6 
						{font-size:11px;font-weight:bold;}
#content form h6		{font-size:10px;font-weight:normal;}
#content h5 			{font-size:12px;font-weight:bold ;}
#content label			{font-size:10px;}
#content legend 		{font-size:10px; text-align:right;}
#content input,
#content textarea,
#content select			{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;}
#content input.button	{text-align:left;font-family:Arial, Helvetica, sans-serif;font-size:10px;}
#content .legend 		{text-align:center;font-size:10px;}
#content .center		{text-align:center}
#content .column_left,
#content .column_right 
						{text-align:center}
ul#menu li a			{font-size:12px}
ul#menu li ul li a		{font-size:12px}



/**********************************************************************************************/
/************************************ --- Images --- ******************************************/
/**********************************************************************************************/

/* bannière */
#headerbox 				{background-image:url(metal750_inv.JPG);
							background-repeat:no-repeat;
							background-position: 0px 0px;}
/* logo */
#logobox 				{background-image:url(logo160.jpg);
							background-repeat:no-repeat;}
/* titre niveau 1 */
#content  h4			{background-image:url('h4.PNG');background-repeat:no-repeat;}
#content .columns h4	{background-image:url('h4_column.PNG');background-repeat:no-repeat;}
#content .frame h4		{background-image:url('h4_frame.PNG');background-repeat:no-repeat;}


#content input.button	{background-image:url('button.jpg');background-repeat:no-repeat;background-position: 0px 3px;background-color:transparent;}

/**********************************************************************************************/
/************************************ --- Autres --- ******************************************/
/**********************************************************************************************/


#topmargin h2 			{float:right;} 
#logobox 				{float:left;}
#navigbox 				{float:left;}

#content p.error		{color:#FF0000}
#content img 			{border: 0px solid black}
#content h4 			{clear:both;}
#content label 			{display:block;}
#content label.radio	{display:inline;}
#content select 		{display:block; }
#content input.radio	{display:inline;text-align:left;}
#content input.button 	{display:block;border:none;cursor:pointer}					
#content input.button:active 
						{border:none}							
#content .columns		{display:table;}
#content .column_left	{float:left;display:table-cell;}				
#content .column_right	{float:right;display:table-cell;}

#content .frame			{float:right;border: 1px dotted #999999;clear:both;}
#content fieldset		{border:1px dotted #999999}
#content .frame h4		{border:none;}
#content .absolute 		{display:block;border:none;}


