@charset "UTF-8";
/* CSS Document */

/* Balise universelle tous les caractères auront ces propriétés par défaut */
* {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	margin: 0;
	padding: 0;
	color: #666666;
}

/* Corps du site */
body { width: 980px; margin: 0 auto;position:relative; }

/* Le style des listes à puce */
li { list-style-type: none; }

/* La couleur de fond des images, des liens, des formulaires et des éléments de formulaire contenus à l'intérieur de la 
balise href */
a, img, fomr, fieldset{ background: none; border: none; font-size: 1rem; color:#FF0000;}


/* Propriété des titres h1 */
h1 {
	background-color: #78af00;
	font-variant: small-caps;
	margin-bottom: 5px;
	color: #FFFFFF;
	padding: 2px 0 2px 10px;
}

/* Marges des titres h1 et des images contenues à l'intérieur des titres */
h1 img {
	margin-right:5px;
	vertical-align: middle;
}

h2 {
	color:#333333;
	font-weight: bold;
	font-size: 0.8em;
	padding: 10px 0;
}

/* Propriété des caractères des titres h2 et des balises span contenues à l'intérieur des titres h2 */
h2 span {
	color:#333333;
	font-weight: bold;
	padding-left: 10px;
}

/* dimension des caracères des paragraphes */
p {
	font-size: 0.75em;
}

/* Couleur, style, hauteur, largeur des caractères des paragraphes et des liens (balises href) à l'intérieur des paragraphes */
p a {
	 color:  #007cc7;
	/* color:#FF9900;*/
	 font-weight: bold;
	 font-size: 0.9em;
	 font-style: italic;
	 text-decoration: underline; 
}

/* Annule l'action d'un flottant ce qui permet de placer le texte (ou autre) en dessous du flottant et non à côté (classe) */
.clear {
	clear: both;
}

td {padding:10px;}

/* Propriétés des input de formulaires (classe) */
.input {
	height: 16px;
	padding: 0 5px;
	font-style: italic;
	border: #666666 solid 1px;
	background-color: #FFFFFF;
	font-size: 0.7em;
	padding-top: 2px;
}

/* Propriété des boutons 1 (classe)*/
.button1 {
	background: url(images/button1.gif) repeat-x;
	border: solid 1px #4d7100;
	height: 20px;
	padding: 0 5px;
	color: #FFFFFF;
	font-weight: bold;
	font-size: 0.8em;
}

/* Propriété des boutons 2 (classe) */
.button2 {
	
	height: 20px;
	padding: 0 5px;
	color: #333333;
	font-weight: bold;
	font-size: 0.7em;
	float: right;
	margin-right: 10px;
}

/* Propriété des blockquote */
blockquote {
	margin: 0 30px;
	font-size: 1,5em;
	font-style: Italic;
	}

/* HEADER */

/* Propriété de l'entête (classe), couleur de fond, largeur, hauteur et marge (ID) */
#header {
	/*background-color:#5F8CA3;*/
	background-color:#FF9900;
	width: 980px;
	height: 50px;
	margin: 5px 0 2px 0;
}

/* Transforme l'entête et les balises href contenues à l'intérieur de l'entête en block
Définition des marges, de la couleur, des polices de caractères et la hauteur de ligne (ID) */
#header a {
	display: block;
	padding: 10px 0 0 30px;
	color: #FFFFFF;
	font-size: 1.1em;
	font-weight: bold;
	line-height: 16px;
}

/* Décoration des textes de l'entête et des balises href à l'intérieur de l'entête (classe) */ 
#header a { text-decoration: none; }

#header a span {
	/* Couleur et style de l'écriture dans l'entête (ASTID Assitance Techinique... etc.) */
	font-size: 0.7em;
	color: #FFFFFF;
	font-style: italic;
	font-weight: normal;
}

/* HEADER END */

/* ----------------- pour le menu ---------------- */

nav ul /* met la liste à puce du menu sans puce et dans le sens horizontal */
	{
		 padding:0; /* marges intérieures */
		 margin:0 0 2px 0; /* marges extérieures haut:0, droite:0, bas:2, gauche:0 */
		 margin-bottom:5em /* marges extérieures bas */
		 list-style-type:none;
	 }
li /* on met une marge de 2 pixels pour écarter chaque élément du menu de son voisin */
	{
		 margin-left:2px;
		 float:left; /*pour IE*/
 	}
	
/* Le display:block va permettre de donner une largeur fixe et identique à chaque item.
pour ne pas qu'ils s'empilent les uns sur les autres, on déclare les différents élément flottants à gauche float:left ce qui va permettre aux items suivants d'aller se mettre... à droite
Comme MSIE ne fait rien comme tout le monde, cet attribut doit être aussi déclaré pour les items seuls.
Reste à déclarer l'aspect du bouton : sa taille (width) ; sa couleur de fond (background-color) ; la couleur du texte, son aspect, et son positionnement dans le bouton (color ; text-decoration ; text-align ; padding) ; l'aspect des bordures (border-width ; border-style ; border-color). */
ul li a 
	{
		 display:block;
		 float:right;   
		 width:auto;
		 /* background-color: #78af00;*/ /* Couleur de fond = vert */
		 background-color: #F90; /* Couleur des fonds = orange */
		 height: 30px;
		 line-height: 30px;
		 padding-top: 2px;
		 border-bottom: #4d7100 solid 1px;
		 border-top: #8fd100 solid 1px;
		 color: #FFFFFF;
		 font-variant: small-caps;
		 text-align: right;
		 padding-right: 20px;
		 padding-left: 10px;
		 font-size: 0.8em;
		 text-decoration: none;
		 /*pour avoir un effet "outset" avec IE :*/
		 border-color:#DCDCDC #696969 #696969 #DCDCDC;
 	}

/* Pour fignoler le tout, on définit l'aspect que prendra ce même bouton lors du survol de la souris (ul li a:hover). */
ul li a:hover 
	{
		 background-color:#D3D3D3;
		 border-color:#696969 #DCDCDC #DCDCDC #696969;
 	} 

/* -------------- fin du menu ----------- */

/* MENU */

#menu {
	height: 150px;
	width: 980px;
	margin-bottom: 2px !important;
	margin-bottom: 0px;
}

#menu img {
	float: left;
}


/* MENU END */

/* Début de l'animation du logo */

@-ms-keyframes pirouetteM7
	{
	0%{-ms-transform:rotateY(0.00deg);}
	100%{-ms-transform:rotateY(360.00deg);}
	}
	
@-moz-keyframes pirouetteM7
	{
	0%{-moz-transform:rotateY(0.00deg);}
	100%{-moz-transform:rotateY(360.00deg);}
	}
	
@-webkit-keyframes pirouetteM7
	{
	0%{-webkit-transform:rotateY(0.00deg);}
	100%{-webkit-transform:rotateY(360.00deg);}
	}
	
@-o-keyframes pirouetteM7{
	0%{-o-transform:rotateY(0.00deg);}
	100%{-o-transform:rotateY(360.00deg);}
	}
	
@keyframes pirouetteM7
	{
	0%{transform:rotateY(0.00deg);}
	100%{transform:rotateY(360.00deg);}
	}
	
[id$='M7'] [id$='M7']
	{
	-ms-transform:none;
	-moz-transform:none;
	-webkit-transform:none;
	-o-transform:none;
	transform:none;
	-ms-animation:;
	-moz-animation:;
	-webkit-animation:;
	-o-animation:;
	animation:;
	}
	
[id$='M7']
	{
	-ms-animation:pirouetteM7 5000ms linear 0ms infinite normal none;
	-moz-animation:pirouetteM7 5000ms linear 0ms infinite normal none;
	-webkit-animation:pirouetteM7 5000ms linear 0ms infinite normal none;
	-o-animation:pirouetteM7 5000ms linear 0ms infinite normal none;
	animation:pirouetteM7 5000ms linear 0ms infinite normal none;
	}	
	
/* Fin de l'animation du logo */

/* CONTENT */

#content {
	width: 980px;
	background:url(images/left_bg.gif) repeat-y;

}

#citation {
	font-size: 1em;
	color: #0066FF;
	font-style: italic;
	font-weight:bold;
}

.spanCitation {
	font-size: 1em;
	color: #0066FF;
	font-style: italic;
	font-weight:bold;
}

#left_content {
	float: left;
	width: 220px;
	padding-left: 2px;
	
	
}

#content_right {
	float: left;
	width: 658px;
	margin-left: 2px;
}

.block2 {
	float: left;
	width: 325px;
} 


.block p, .block h2, .block ul, .block input, .block2 p, .block2 h2, .block2 ul, .block2 input {
	margin: 0 10px;
}

.block p, .block2 p {
	padding-bottom: 10px;
}

.block .img, .block2 .img {
	float: left;
	border: #78af00 solid 2px;
	margin: 4px 10px 0 10px;
}

.block p.border, .block2 p.border {
	border-bottom: #78af00 solid 1px;
}

.block input, .block2 input {
	margin-bottom: 5px;
}



#resol {
	text-align:left;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	position:fixed;
	-position:absolute;
	font-size: 10px;
	width:230px;
	top:0px;
	left:1280px;
	margin:0 auto;
	background:#bfc6d9;
	text-align:center;
} 

#resol h1 {
	background:none;
	font-size: 15px;
	letter-spacing:3px;
	padding:0px;
	margin:0px;
	border: 0px;
} 

#resol h2 {
	font-size:10px;
	letter-spacing:3px;
	padding:0px;
	margin:0px;
	border:0px;
	background:none;
}



/* CONTENT END */

/* FOOTER */

#footer {
	margin-top: 2px;
	/*background-color: #007cc7;*/
	background-color: #FF9900;
	width: 980px;
	height: 30px;
	color: #FFFFFF;
	-margin-bottom:30px;
}

#footer p {
	color: #FFFFFF;
	font-size: 0.7em;
	padding: 10px;
	font-weight: bold;
	text-align:center;
}

#footer a {
	font-size: 0.7em;
	color: #FFFFFF;
	font-weight: bold;
}

#footer_terms {
width: 100%; bottom: 0px; left: 0px; position: absolute; height: 40px; 
}
#footer_terms h1 {
	padding: 60px 0px 0px 0px; 
	color: #c6c6c6;
	text-align:right;
	border:0px;
	font-variant:normal;font-size: 0.8em;font-weight: normal;
	text-decoration:none;background: none;
}

#footer_terms a  { text-decoration: underline;}

#footer_terms strong,#footer_terms a {
	color: #c6c6c6;
	font-weight: normal;
	background: none;
}

#holder {
	min-height: 100%; position: relative; margin:0 auto;
}

/* FOOTER END*/