*{
	margin:0;
	padding:0;
}

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
      }

.clearfix {display: inline-block;}
/* Hides from IE-mac */
 * html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

img {
	border: none;
}

/*<<<<<<<<<<<<<<<<<<<<<<<< Blocs généraux>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

body {
	background-color: #fff;
	background-image: url(images/fond-body.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

#conteneur {
	position: relative;
	width: 970px;
	margin: 0 auto;
	background-color:#FFFFFF;
	background-image: url(images/fond-global.jpg);
	background-repeat: repeat-y;
}

#bandeau {
	height: 274px;
	background-image: url(images/bandeau.jpg);
	background-repeat: no-repeat;
}

#contenu {
	background-image: url(images/fond-contenu.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	padding: 20px 45px 10px 55px;
	min-height: 800px;
}

#pied {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
	height: 101px;
	background-image: url(images/fond-pied-de-page.jpg);
	background-repeat: no-repeat;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< Titres et Paragraphes>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

h1 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 23px;
	color: #FFF;
	margin-top: 5px;
	text-align: center;
	background-color: #898989;
	padding: 10px;
	width: 519px;
}

h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #306;
}

h3 {
	font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 11px;
	color: #FF6600;
}

h4 {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 10px;
	color: #666;
}

p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	margin-right: 10px;
}


a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #333;
	text-decoration: none;
}

a:hover {
	color:#B63C3C;
	text-decoration: underline;
}

ul {
	white-space: normal;
	padding-left: 20px;
}

li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666;
	padding: 0;
	list-style-type: square;
	list-style-position: outside;
	margin: 0;
	line-height: 15px;
}

hr {
	color: #CCC;
	background-color: #CCC;
	height: 1px;
	border: 0;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<< BIDULES >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

.icone {
	margin-bottom: -3px;
	
}

.float {
	float: right;
	padding-left: 50px;
}

.float-illustration {
	float: right;
	padding-left: 10px;
}

.fleche{
	vertical-align: top;
}

.centrer {
	
	text-align: center;
}

.bloc-accueil {
	height: 215px;
}

.end-float{
	clear: both;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<< ENCART >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

#encart {
	width: 280px;
	text-align: left;
	float: right;
	padding-left: 50px;
	padding-bottom: 25px;
}

#encart p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000;
	padding: 0;
	margin: 0;
}

#encart h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #006;
}

#encart h2 #ss-h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
}

#encart h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
}

#encart a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #000;
	text-decoration: underline;
}

#encart a:hover {
	color: #036;
	font-weight: bold;
}

/*_______________________coordonnées______________________________ */

#encart #coordonnees {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000;
	width: 100%;
	margin-top: 25px;
	height: 122px;
	background-image: url(images/fond-encart.jpg);
	background-repeat: no-repeat;
	padding-left: 8px;
	padding-top: 10px;
}

#encart #coordonnees hr {
	margin-right: 11px;
}

#encart #coordonnees table {
	font-size: 10px;
}

#encart #coordonnees td {
	width: 50%;
	
}

/* __________________________LIENS_______________________________________ */


.liens p{
	font-size: 9px;
	text-align: left;
}

.liens img {
	margin-bottom: -4px;
	
}

#liens-gauche {
	width: 160px;
	font-size: 14px;
}

#liens-droit{
	float: right;
	width: 120px;
	right: 0px;
	font-size: 14px;
}

#lien-graphisme {
	text-align: center;
}

#lien-graphisme img {
	margin-bottom: -4px;

}


/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< Accueil >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

#accueil-droit {
	float: right;
	width: 250px;
	text-align: justify;	
}

#accueil-gauche {
	width: 250px;
	text-align: justify;
	float: left;
}

.accueil h2 {
	background-color: #CCC;
	text-align: center;
	padding: 5px;
}

.illustration-accueil {
	text-align: center;	
}

.accueil img {
	padding: 10px;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< Tarifs >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

.tarif-multimedia {
	width: 150px;
	height: 100px;
	text-align: center;
	padding: 10px 10px 10px 30px;
	background-image: url(images/tarif-multimedia.jpg);
	background-repeat: no-repeat;
	float: right;
	background-position: right top;
}

.tarif-multimedia h2 {
	font-size: 25px;
	font-family: "Arial Black", Gadget, sans-serif;
	color: #FFF;
}

.tarif-multimedia h3 {
	font-size: 14px;
	font-family: "Arial Black", Gadget, sans-serif;
	color: #FFF;
}

.bloc-tarif-multimedia {
	height : 160px;
}







/*___________________________TARIFS PAO____________________________________*/

#tarif-pao-droite {
	float: right;
}

.tarif-pao
{
	width : 410px;
	text-align: center;
	padding: 0px 5px 10px 5px;
	border: 1px solid #000;
}

.tarif-pao h3 {
	background-color: #C63;
	color: #FFF;
	padding: 10px;
	margin: 0px -5px 0px -5px;
}

#fond-tarif {
	padding: 10px 20px 0px 20px;
}

#fond-tarif h4 {
	color: #898989;
	font-size: 13px;
	font-family: "Arial Black", Gadget, sans-serif;
	background-color: none;
}

#fond-tarif h2 {
	color: #000;
	font-size: 18px;
	font-family: "Arial Black", Gadget, sans-serif;
}

#fond-tarif p {
	color: #898989;
	font-size: 11px;
	font-family: "Arial Black", Gadget, sans-serif;
}

#fond-tarif hr {
	height: 2px;
	background-color: #000;
	color: #000;
}
	



/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< CONTENU >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */


.ancres a{
	font-size: 9px;
	font-weight: normal;
}






/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< FORMULAIRE >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

#formulaire-client {
	width: 539px;
	padding: 10px 0px 10px 0px;
	background-color: #CCC;
}

#formulaire-client form {
	width: 400px;
	text-align: right;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<< SOUS-MENU >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

#ss-menu a {
	font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-size: 10px;
	color: #898989;
}

#ss-menu img {
	margin-bottom: -4px;
	
}

#ss-menu a:hover {
	font-size: 10px;
	color: #898989;
	text-decoration: underline;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< SOMMAIRE >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

#sommaire {
	text-align: left;
	padding: 11px 10px 0 0;
}
#sommaire a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #FFF;
	text-decoration: none;
}
#sommaire a:hover {
	color: #CFF;
	font-weight: bold;
	font-size: 10px;
}
#sommaire .select {
	color: #CFF;
	font-weight: bold;
	font-size: 10px;
}


/*___________________________________________SOMMAIRE 2__________________________________________ */


#sommaire-ref {
	text-align: right;
	padding: 11px 10px 0 0;
	position: absolute;
	right: 30px;
	top: 0px;
	height: 38px;
}
#sommaire-ref a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 9px;
	color: #FFF;
	text-decoration: none;
}
#sommaire-ref a:hover {
	color: #CFF;
	font-weight: bold;
	font-size: 10px;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< MENU >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */

#menu {
	position: absolute;
	top: 190px;
	left: 25px;
	margin: 0;
	padding: 0;
	height: 38px;
	width: 970px;
	text-align: right;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	z-index: 9000;
	color: #FFF;
}

.menu-services {
	width: 500px;
	height: 110px;
	border: thin solid #000;
	padding-left: 10px;
	padding-bottom: 10px;
	padding-right: 10px;
}

.menu-services h2{
	color: #FFF;
	font-size: 14px;
	background-color: #006;
	padding: 7px;
	margin-top: -1px;
	margin-left: -10px;
	margin-right: -10px;
}

.menu-services img {
	margin-top: 10px;
}

/* <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< PIED DE PAGE >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> */


#pied {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
	height: 101px;
	background-image: url(images/fond-pied-de-page.jpg);
	background-repeat: no-repeat;
}
#sousmenu {
	float: right;
	width: 560px;
	text-align: center;
	padding: 10px 60px 0 10px;
}
#eodys {
	float: left;
	width: 320px;
	text-align: center;
	padding-left: 16px;
	padding-top: 10px;
}
#pied p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #aaa;
	color: #333;
}
#pied a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #aa9;
	text-decoration: none;
}
#pied a:hover {
	color: #f90;
	text-decoration: underline;
}
#pied h3 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #999;
	padding: 0;
	margin: 0;
	font-weight:normal;
}
#pied h2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #999;
	padding: 0;
	margin: 0;
	font-weight:normal;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< PAGE LIENS >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

#liens {
	position:absolute;
	width: 539px;
	height: 500px;
}

#liens a h1{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 23px;
	color: #898989;
	background-color: #FFF;
	margin-top: 5px;
	text-align: center;
	padding: 10px;
	width: 519px;
}

#lien-gauche {
	position: absolute;
	width: 250px;
	padding-left: 10px;
	padding-top: 30px;
}

#detail_lien-gauche {
	margin-left: 20px;
	padding-left: 10px;
	padding-top: 30px;
	padding-bottom: 10px;
	border-left: 1px dashed #898989;
}

#lien-droit {
	position: absolute;
	width: 250px;
	padding-left: 10px;
	padding-top: 30px;
	right: 0px;
}

#detail_lien-droit {
	margin-left: 20px;
	padding-left: 10px;
	padding-top: 0px;
	padding-bottom: 10px;
	border-left: 1px dashed #898989;
}

.detail-plus_lien-droit {
	margin-left: 20px;
	margin-bottom: 30px;
	padding-left: 10px;
	padding-top: 30px;
	padding-bottom: 10px;
	border-left: 1px dashed #898989;
}

/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<FORMULAIRE CONTACT>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/

.formulaire {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #003333;
	padding-left: 6px;
	border: 1px solid #336666;
}
.formulairetext {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	font-weight: bold;
	color: #003333;
}
.gauche{
	float:left;
	padding-right: 5px;
}
.droite{
	float:right;
	padding-left: 5px;
}
a.info {
    position:relative; 
    z-index:24; 
    color:#000;
    text-decoration:none;
}
a.info:hover {
	z-index:25; 
}
a.info span {
	display: none
}
a.info:hover span { 
 	display:block; 
 	position:absolute;
    top:30px; 
	left:0px; 
	width:250px;
    border:1px solid #F4912D;
    background-color:#ffffff; 
    padding:3px;
}
.petitetaille {
	font-size: 10px;
}
.popuphtml{
	position: absolute;
	height: 80px;
	width: 250px;
	top: 350px;
	left: 400px;
	background-color: #eee;
	border: 4px solid #f00;
	background-position: center center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight:bold;
	color: #f00;
	line-height: 20px;
	text-align: center;
	vertical-align: middle;
}
.center {
	text-align:center;
	width: 618px;
	margin: 0;
	padding: 0;
}