/* CSS Document by Black meridian 2 */
/* site.com 2010 */


/* ------------------------------------------------------------------------ */
/* >>>>>>>>>>>>>   aide couleurs                                       <<<< */
/* ------------------------------------------------------------------------ */

/* Colors Help {}*/

/* ------------------------------------------------------------------------ */
/* >>>>>>>>>>>>>   generalites                                         <<<< */
/* ------------------------------------------------------------------------ */

HTML{font-size: 100%; font-weight:normal;}

/* La taille de base sera de 10px avec les valeurs par defaut de police du navigateur */

body{background:#000; color:#FFF;font: 0.625em/1em Arial, "Times New Roman", Times, serif;width:100%;position:relative;overflow-x:hidden}

h1,h2,h3,h4,h5,h6 {font-weight:normal}

input, select, textarea{font-size: 100%;font-family:arial;}

/* ------------------------------------------------------------------------- */
/* >>>>>>>>>>>>>   classe                                       <<<<<<<<<<<< */
/* ------------------------------------------------------------------------- */

.opacite {
     background-color: rgb(0, 0, 0); /* #000 */
     background-color: rgba(0, 0, 0, 0.5); /*  #000 50% */
}

.displaynone {display:none}
.clear {clear:both}
.textright {text-align:right;}
.textleft {text-align:left;}
.wrapperContent {overflow:hidden;}

strong{font-weight:bold;}
em {font-style:italic;}
	
.inlineblock {
	display:-moz-inline-stack;/* firefox 1 et 2 */ /* l'élément en display: -moz-inline-stack, doit avoir un seul enfant */
	display: inline-block;
}

#page {background:url(images/fond-xy_v02.png) 10px 10px repeat;position:relative;width:100%;z-index:100;}
#aside_page {width:720px;padding:0;overflow:hidden;position:absolute;top:0;height:100%;background:url(images/fond-xy_v02.png) 10px 10px repeat;z-index:110;}

#main  { padding:0;overflow:auto;height:100%;padding:10px 0 0 10px;}

a          { color: #fff;text-decoration: none; }
a:link     { color: #fff; }
a:visited  { color: #fff }
a:focus    { color: #fff; }
a:hover    { color: #fff;text-decoration: underline; }
a:active   { color: #000; }





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

/* >>>>>>>>>>>>>   entete                                       <<<<<<<<<<<< */

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



#header h1,
#header h2 { display:none }


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

/* >>>>>>>>>>>>>    footer                                      <<<<<<<<<<<< */

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

#footer {clear:both;background:#000;width:100%;margin:10px 0 0 0;padding:5px 0 15px 0;}
#footer p {font-size:1.2em; line-height:1.2em;padding:0 10px 0 25px;margin:0 0 10px 0;}





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

/* >>>>>>>>>>>>>    HOme                                        <<<<<<<<<<<< */

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





body.template4 #main .boxpetit {float:left;width:150px;height:150px;margin:10px;border:5px solid #000;overflow:hidden;}

body.template4 #main .boxpetit.annee {width:120px;height:80px;padding:65px 5px 5px 25px;margin:10px;border:5px solid #000;border:5px solid #000;}

body.template4 #main .boxmoyen {float:left;width:330px;height:150px;margin:10px;border:5px solid #000;overflow:hidden;}

body.template4 #main .boxgrand {float:left;width:510px;height:150px;margin:10px;border:5px solid #000;overflow:hidden;}

body.template4 #main .boxmoyen#logo {border-bottom:0 none;overflow:visible}
body.template4 #main .boxmoyen#logo a {position:relative;top:-5px;}


body.template4 #main .boxpetit h2 {width:120px;padding:5px 15px;}

body.template4 #main .boxmoyen h2 {width:300px;padding:5px 15px;}

body.template4 #main .boxgrand h2 {width:480px;padding:5px 15px;}


body.template4 #main .boxpetit p.image {width:150px;}

body.template4 #main .boxmoyen p.image {width:330px;}

body.template4 #main .boxgrand p.image {width:510px;}


body.template4 #main .liste1produit {background:url(images/ajax-loader.gif) no-repeat center center;position:relative;}


body.template4 #main .liste1produit a.linkSite {display:block;position:absolute;top:0;left:0;z-index:10;height:150px;overflow:hidden;text-indent:-999em;}

body.template4 #main .boxpetit a.linkSite {width:150px;}
body.template4 #main .boxmoyen a.linkSite {width:330px;}
body.template4 #main .boxgrand a.linkSite {width:510px;}


body.template4 #main .liste1produit h2 {text-transform:uppercase;position:relative;font-size:1.3em;line-height:1.2em;color:#fff;display:none;background:url(images/fond-h4Trans330.png) repeat;}
:root body.template4 #main .liste1produit h2 {background:none;background-color:rgba(0,0,0,0.6);}

body.template4 #main .liste1produit h2 a {display:block;position:absolute;top:0;left:0;width:100%;height:100%;}

body.template4 #main .liste1produit p.image {overflow:hidden;height:150px;position:absolute;top:0;left:0;}

body.template4 #main .liste1produit p.image a {display:block}

/*body.template4 #main .liste1produit p.liens {position:absolute;bottom:0;right:0;display:none}
body.template4 #main .liste1produit p.liens a {font-size: 1.3em;padding:5px 10px;margin-left:2px;display:block;float:left;background-color:rgba(0,0,0,0.6);}
*+html body.template4 #main .liste1produit p.liens a {background:#000 }*/

/*hover*/

body.template4 #main .liste1produit h2 {z-index:3;border-bottom:1px solid #000;}
body.template4 #main .liste1produit h2.hover,
body.template4 #main .liste1produit h2:hover  {border-color:#fff;cursor:pointer;background:#000;}
:root body.template4 #main .liste1produit h2.hover,
:root body.template4 #main .liste1produit h2:hover {background-color:rgba(0,0,0,0.8);}

body.template4 #main .liste1produit h2 a:hover {text-decoration:none}

body.template4 #main .liste1produit h2 span {position:absolute;right:15px;bottom:-10px;background:url(images/btn-home-hover.png);display:block;width:20px;height:20px;}
body.template4 #main .liste1produit h2.hover span,
body.template4 #main .liste1produit h2:hover span {background-position:0 -20px}

body.template4 #main .liste1produit p.liens {z-index:3;}

body.template4 #main .liste1produit p.imageHover {overflow:hidden;height:150px;position:absolute;top:0;left:0;width:510px;z-index:2;}

body.template4 #main .liste1produit p.imageHover a {display:block;}



/*date*/

body.template4 #main h1 span {background:url(images/spritesChiffres_v02.png) 0 0 no-repeat;width:18px;height:0;padding-top:28px;overflow:hidden;float:left;display:block;margin:0 4px 0 0;}

body.template4 #main h1 strong {display:none}


body.template4 #main h1 span.n0 {background-position:-1px -6px;width:19px;}

body.template4 #main h1 span.n1 {background-position:-4px -46px;width:11px;}

body.template4 #main h1 span.n2 {background-position:-1px -86px;}

body.template4 #main h1 span.n3 {background-position:-1px -126px;}

body.template4 #main h1 span.n4 {background-position:-1px -166px;}

body.template4 #main h1 span.n5 {background-position:-1px -206px;}

body.template4 #main h1 span.n6 {background-position:-1px -246px;}

body.template4 #main h1 span.n7 {background-position:-1px -286px;}

body.template4 #main h1 span.n8 {background-position:-1px -326px;}

body.template4 #main h1 span.n9 {background-position:-1px -366px;}

body.template4 #main h1 span.n10 {background-position:0 -406px;margin:0 0 0 13px;width:15px;}

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

/* >>>>>>>>>>>>>   1 projet                                     <<<<<<<<<<<< */

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



body.template3 #main .boxpetit,
body.template3 #main .box1 {float:left;width:150px;height:150px;margin:10px;border:5px solid #000;overflow:hidden;}

body.template3 #main .boxmoyen,
body.template3 #main .box2 {float:left;width:330px;height:150px;margin:10px;border:5px solid #000;overflow:hidden;}

body.template3 #main .boxgrand,
body.template3 #main .box3 {float:left;width:510px;height:150px;margin:10px;border:5px solid #000;overflow:hidden;}

body.template3 #main .box4 {float:left;width:690px;height:150px;margin:10px;border:5px solid #000;overflow:hidden;}


body.template3 #main .boxpetit.parent,
body.template3 #main .box1.parent, 
body.template3 #main .boxmoyen.parent,
body.template3 #main .box2.parent,
body.template3 #main .boxgrand.parent,
body.template3 #main .box3.parent, 
body.template3 #main .box4.parent {margin:0;border:0 none;}

body.template3 #main .boxpetit.parent,
body.template3 #main .box1.parent {width:180px;}

body.template3 #main .boxmoyen.parent,
body.template3 #main .box2.parent {width:360px;}

body.template3 #main .boxgrand.parent,
body.template3 #main .box3.parent {width:540px;}

body.template3 #main .box4.parent {width:720px;}


body.template3 #main .blanc {background:#fff;color:#000;}

body.template3 #main .boxpetit .blanc,
body.template3 #main .box1 .blanc {width:110px;height:110px;padding:20px}

body.template3 #main .boxmoyen .blanc,
body.template3 #main .box2 .blanc {width:280px;height:110px;padding:20px}

body.template3 #main .boxgrand .blanc,
body.template3 #main .box3 .blanc {width:470px;height:110px;padding:20px}



body.template3 #main .ligne2 {height:330px;}
body.template3 #main .ligne3 {height:540px;}




body.template3 #main  h3 {}

body.template3 #main  h3 span {display:none}


body.template3 #main h4 {display:none}

body.template3 #main #wrapper {clear:left;}



body.template3 #main #retour {position:relative;overflow:visible}/*float */
body.template3 #main #retour a {background:url(images/fleche-retour.png) no-repeat 20px center;width:179px;height:179px;text-indent:-9999em;font-size:2.1em;text-transform:uppercase;line-height:1em;margin:0;display:block;overflow:hidden;position:absolute;top:-14px;left:-14px;}
body.template3 #main #retour a:hover {background-image:url(images/fleche-retour-hover.png);background-color:#1a1a1a;}

body.template3 #main #projet {clear:both;}


*+html body.template3 #main #text {float:none;}/*ie7*/

body.template3 #main #text p {font-size:1.3em;line-height:1.3em;margin-bottom:10px;}
body.template3 #main #text p strong {font-weight:bold;}
body.template3 #main #text p a {color:#000;text-decoration:underline}
body.template3 #main #text p a:hover {background:#d9d9d9;color:#000;}

body.template3 #main #details dl,
body.template3 #main #prestations dl {padding:5px;}

body.template3 #main #details dt,
body.template3 #main #prestations dt  {color:#fff;text-transform:uppercase;font-weight:normal;font-size:1.4em;line-height:1.1em;margin:0 0 10px 0;}
body.template3 #main #details dd {font-size:1.2em;line-height:1.1em;margin-bottom:25px;}
body.template3 #main #details dd a {color:#fff;}

body.template3 #main #prestations dd {font-size:1.2em;line-height:1.1em;padding-left:17px;background:url(images/checkbox.png) no-repeat left 2px;margin:0 0 4px 0;}


body.template3 #main #head .blanc{padding:20px 15px;width:120px;position:relative;}
body.template3 #main #head h1 {color:#000;font-size:1.4em;margin:0 0 7px 0;text-transform:uppercase;line-height:1.1em;}
body.template3 #main #head h2 {color:#000;font-size:1.2em;margin:0 0 5px 0;font-style:italic;line-height:1.1em;}
body.template3 #main #head p {color:#000;font-size:1.4em;text-transform:uppercase;line-height:1.1em;padding:0;border-top:1px solid #000;width:150px;position:absolute;left:0;bottom:0;}
body.template3 #main #head p a {display:block;color:#000;padding:10px 27px 10px 0;text-align:center;background:url(images/fleche-noir.png) no-repeat 125px center;}
body.template3 #main #head p a:hover {background-image:url(images/fleche-noir-fond-gris.png);background-color:#d9d9d9;text-decoration:none}
body.template3 #main #head p .inactive {display:block; padding:10px 17px; background-color:#d9d9d9; cursor:default;}

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

/* >>>>>>>>>>>>>   cadre simple                                 <<<<<<<<<<<< */

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


body.template10 #main  h3 {}

body.template10 #main  h3 span {display:none}


body.template10 #main h4 {display:none}


body.template10 #main #text { padding:0; left:15px; margin:33px 0 0 15px; padding-bottom:89px; width:690px;  background:#000;float:none; font-size:1.3em;line-height:1.3em;}/*float */

body.template10 #main #text .valider { border:1px #FFF solid }

body.template10 #main #text p {margin-bottom:15px;}

body.template10 #main #text p a {text-decoration:underline;color:#fff;}

body.template10 #main #text p a:hover {color:#CCCCCC;}



