﻿*
{
	margin:0;
	padding:0;
	font-family:"Trebuchet Ms";
}
a img
{
	border:0;
}

body
{
	background:#212121;
}
.conteneur
{
	width:880px;
	position:relative;
	margin:0 auto;
}
.conteneur .header
{
	width:880px;
	height:131px;
	background:transparent url(header.png) repeat;
	position:relative;
}
.conteneur .header .logo
{
	position:absolute;
	top:54px;
	left:2px;
}
.conteneur .header .headerlinks
{
	position:absolute;
	right:0;
	top:86px;
}
.conteneur .header .headerlinks a
{
	color:#b7b7b7;
	font:400 12px "Trebuchet Ms";
	padding:0 5px;
	border-right:1px solid #b7b7b7;
}
.conteneur .header .headerlinks a.last
{
	border:0;
}
.conteneur .nav
{
	width:882px;
	height:102px;
	position:relative;
	overflow:visible;
}
.conteneur .nav a
{
	position:relative;
	margin:0 2px;
	text-decoration:none;
	display:block;
	width:170px;
	height:100px;
	float:left;
	cursor:pointer;
}
.conteneur .nav a.pj
{
	border:1px solid #448fc7;
	background:url("menu-pages-annexes.jpg")  no-repeat;
}
.conteneur .nav a.abrisol
{
	border:1px solid #f2ab01;
	background:url("menu-pages-annexes.jpg") -170px 0 no-repeat;
}
.conteneur .nav a.landru
{
	border:1px solid #e9e701;
	background:url("menu-pages-annexes.jpg") -340px 0 no-repeat;
}
.conteneur .nav a.heral
{
	border:1px solid #93a504;
	background:url("menu-pages-annexes.jpg") -510px 0 no-repeat;
}
.conteneur .nav a.deco
{
	border:1px solid #858585;
	background:url("menu-pages-annexes.jpg") -680px 0 no-repeat;
}
.conteneur .nav .pj:hover
{
	border:1px solid #b7b7b7;
	background:url("menu-pages-annexes.jpg") 0 -100px no-repeat;
}
.conteneur .nav .abrisol:hover
{
	border:1px solid #b7b7b7;
	background:url("menu-pages-annexes.jpg") -170px -100px  no-repeat;
}
.conteneur .nav .landru:hover
{
	border:1px solid #b7b7b7;
	background:url("menu-pages-annexes.jpg") -340px -100px  no-repeat;
}
.conteneur .nav .heral:hover
{
	border:1px solid #b7b7b7;
	background:url("menu-pages-annexes.jpg") -510px -100px  no-repeat;
}
.conteneur .nav .deco:hover
{
	border:1px solid #b7b7b7;
	background:url("menu-pages-annexes.jpg") -680px -100px  no-repeat;
}
.conteneur .nav a span
{
	display:none;
}
.conteneur .main
{
	width:880px;
	/*background:transparent url(footer.png) no-repeat;*/
	position:relative;
	margin:15px 0 0;
	padding:1em 1em 0;
}
.baspage
{
	font:400 10px/2em arial;
	display:block;
	text-align:center;
	color:#b7b7b7;
	position:relative;
	width:100%;
	margin:1em 0 0;
}

/*---------------------- Formulaire de contact -----------------------*/
.fondcontact
{
	background:#2f2f2f url("titre-contact.png") top left no-repeat;
	left:-1em;
	position:relative;
	top:-1em;
	padding:100px 0 0;
}

#form1
{
	width:700px;
	position:relative;
	margin:0em 2em 0em;
	padding:0 2em 1em;
}
label
{
	padding:0 10px 0 0;
	color:#fff;
	text-align:right;
	/*font:400 16px/20px "Trebuchet Ms";*/
	font:normal 400 11px/20px "Trebuchet Ms";
	display:block;
	width:150px;
	float:left;
	margin:0.5em 0;
}
#o_nom,
#prenom,
#o_email,
#o_telephone_1,
#telephone_2,
#adresse,
#o_ville,
#code_postal,
#questions
{
	display:block;
	width:150px;
	float:left;
	border:2px solid #2f2f2f;
	/*font:400 16px/20px "Trebuchet Ms";*/
	font:normal 400 11px/20px "Trebuchet Ms";
	display:block;
	background:#ccc;
	margin:0.5em 0;
}
#chx1,
#chx2,
#chx3,
#chx4,
#chx5
{
	float:left;
	font:normal 400 11px "Trebuchet Ms";
	margin:0.5em 30px 0 0;
	border:2px solid #2f2f2f;
}
#devis,
#documentation
{
	float:left;
	font:normal 400 11px "Trebuchet Ms";
	margin:0.5em 30px 0 0;
	border:2px solid #2f2f2f;
}
#documentation
{
	margin:0.5em 210px 0 0;
}
#form1 p
{
	color:#fff;
	display:block;
	float:left;
	width:700px;
	border-bottom:1px dotted #fff;
	margin:1em 0 ;
}
#questions
{
	margin:0.5em 0 1em;
	position:relative;
	width:460px;
}

#Submit
{
	position:relative;
	clear:both;
	display:block;
	margin:1em auto;
	/*font:400 18px/20px "Trebuchet Ms";*/
	font:normal 400 11px/20px "Trebuchet Ms";
	color:#fff;
	background:#666;
	border:1px outset #999;
	padding:0 1em;
	
}
#form1 small
{
	border-top:1px solid #999;
	padding:0.5em;
	display:block;
	float:none;
	clear:both;
	font:400 11px "Trebuchet Ms";
	color:#ccc;
}
#etat_mail 
{
	font-size: medium;
	margin: 0  0 1em;
	font-weight: bold;
	text-align:center;
	color:#000;
	clear:both;
	float:left;
	width:700px;
}
.requis
 {
	border: 2px solid #f00 !important;
}
.error 
{
	border:2px solid #f00;	
	background:#ffbfbf;
}
.ok
{
	border:2px solid #0c0;	
	background:#bfffbf;
}
	
/*---------------------- plan de site -----------------------*/
.conteneur .main ol
{
	/*height:400px;*/
	position:relative;
	height:550px;
	margin-top:-30px;
	margin-left:-1em;
}
.conteneur .main ol,
.conteneur .main ol li
{
	list-style-type:none;
}
.conteneur .main ol li
{
	/*padding:0 0 0 5px;*/
	width:172px;
	float:left;
	background:#2f2f2f;
	height:550px;
	margin:0 2px;
}
.conteneur .main ol li ul li
{
	width:auto;
	height:auto;
	float:none;
	border-bottom:1px solid #2f2f2f;
}
.conteneur .main ol li img
{
	margin:0.5em 0;
}
.conteneur .main ol li ul
{
	padding: 0 0 0 2px;
}
.conteneur .main ol li ul li
{
	padding: 0 0 0 5px;
}
.conteneur .main ol li ul li span span
{
	font-style:italic;
}
.conteneur .main ol li,
.conteneur .main ol li ul li a
{
	color:#fff;
	font:normal 400 11px/20px "Trebuchet Ms";
	text-decoration:none;
}
.conteneur .main ol li ul li a
{
	display:block;
}
.conteneur .main ol li ul li a:hover
{
	text-decoration:underline;
}
.conteneur .main ol li h1 span
{
	font:italic 700 14px/24px "Trebuchet Ms";
	padding:1em 0 0;
	text-transform:uppercase;
	text-decoration:underline;
	visibility:hidden;
}
.conteneur .main ol li.pj h1
{
	color: #448fc7;
}
.conteneur .main ol li.abrisol h1
{
	color: #f2ab01;
}
.conteneur .main ol li.landru h1
{
	color: #e9e701;
}
.conteneur .main ol li.heral h1
{
	color: #93a504;
}
.conteneur .main ol li.deco h1
{
	color: #858585;
}
.conteneur .main ol li.pj h1 span
{
	color: #448fc7;
}
.conteneur .main ol li.abrisol h1 span
{
	color: #f2ab01;
}
.conteneur .main ol li.landru h1 span
{
	color: #e9e701;
}
.conteneur .main ol li.heral h1 span
{
	color: #93a504;
}
.conteneur .main ol li.deco h1 span
{
	color: #858585;
}
/*---------------------- Mentions légales / coordonnées -----------------------*/

.conteneur .main  .coordonnees
{
	background:#2f2f2f url("http://www.piscineetjardin.com/sqlt/titre-coordonnees.png") top left no-repeat;
	width:880px;
	position:relative;
	top:-1em;
	left:-1em;
	font-family:"Trebuchet Ms";
	padding:100px 0 50px;
	margin:0 0 -1em;
}
.conteneur .main  .coordonnees .holding
{
	position:relative;
	width:600px;
	margin:0 auto;
	background:#4e4e4e;
	padding:1em;
}
.conteneur .main  .coordonnees .holding img
{
	float:left;
	margin:0 1em 0 0;
}
.conteneur .main  .coordonnees .holding p
{
	letter-spacing:0.2em;
	color:#fff;
	font:normal 400 11px/18px "Trebuchet Ms";
	text-decoration:none;
	padding:0 0 0.4em;
}
.conteneur .main  .coordonnees p strong
{
	font:normal 700 14px/20px "Trebuchet Ms";
}
.conteneur .main  .coordonnees p a
{
	color:#fff;
}
.conteneur .main  .coordonnees .holding p small
{
	display:block;
	margin:0.8em 0 0;
	line-height:14px;
}
.conteneur .main  .coordonnees .holding .tel
{
	padding:0 0 0 2em;
	background:url("http://data.piscineetjardin.com/pict/telephone.png") no-repeat;
}
.conteneur .main  .coordonnees .holding .fax
{
	padding:0 0 0 2em;
	background:url("http://data.piscineetjardin.com/pict/fax.png") no-repeat;
}
.conteneur .main  .coordonnees .holding .mail
{
	padding:0 0 0 2em;
	background:url("http://data.piscineetjardin.com/pict/email.png") no-repeat;
}
.conteneur .main  .coordonnees .entites
{
	position:relative;
	width:600px;
	margin:0 auto;
	padding:50px 0 0;
	height:320px;
	clear:both;
}
.conteneur .main  .coordonnees .entites div
{
	width:300px;
	height:160px;
	float:left;
}
.conteneur .main  .coordonnees .entites div p
{
	letter-spacing:0.15em;
	color:#fff;
	font:normal 400 11px/18px "Trebuchet Ms";
	text-decoration:none;
	padding:0 0 0.4em;
}
.conteneur .main  .coordonnees .entites div p strong
{
	font:normal 700 14px/20px "Trebuchet Ms";
	letter-spacing:0.2em;
}
.conteneur .main  .coordonnees .entites div.heral p strong
{
	color:#93a504;
}
.conteneur .main  .coordonnees .entites div.landru p strong
{
	color:#e9e701;
}
.conteneur .main  .coordonnees .entites div.abrisol p strong
{
	color:#f2ab01;
}
.conteneur .main  .coordonnees .entites div p a
{
	color:#fff;
}
.conteneur .main  .coordonnees .entites div p small
{
	display:block;
	margin:0.8em 0 0;
	line-height:14px;
}
.conteneur .main  .coordonnees .entites div .tel
{
	padding:0 0 0 2em;
	background:url("http://data.piscineetjardin.com/pict/telephone.png") no-repeat;
}
.conteneur .main  .coordonnees .entites div .fax
{
	padding:0 0 0 2em;
	background:url("http://data.piscineetjardin.com/pict/fax.png") no-repeat;
}
.conteneur .main  .coordonnees .entites div .mail
{
	padding:0 0 0 2em;
	background:url("http://data.piscineetjardin.com/pict/email.png") no-repeat;
}

.posrel
{
	/*font:400 10px/2em arial;
	display:block;
	text-align:center;
	color:#b7b7b7;
	position:relative;
	width:100%;
	margin:1em 0 0;*/
	position:absolute;
	top:1060px;
	
}

/*---------------------- Page actualites -----------------------*/
#actualites
{
	background:#2f2f2f url("degrade-vertical.png") 570px 0 repeat-y;
	width:880px;
	position:relative;
	top:-1em;
	left:-1em;
	font-family:"Trebuchet Ms";
	padding:0 0 100px;
	margin:0 0 -1em;
}
/*----Partie actualité */
#actualites .gauche
{
	width:570px;
	background:#2f2f2f url("titre-actualite.png") top left no-repeat;
	padding:100px 0 0;
}
#actualites .actu
{
	position:relative;
	padding:0 55px 0 95px;
	margin:0 0 2em;
	text-align:justify;
}
#actualites .actu div
{
	border-bottom-width:1px;
	border-bottom-style:solid;
	border-bottom-color:#fff;
	position:relative;
	padding:0 0 30px;
}
#actualites .actu div h3
{
	font-size:1.3em;
	padding:0 0 0.7em;
}
#actualites .actu div .picto
{
	display:block;
	position:absolute;
	left:-55px;
	top:0;
	width:40px;
	height:40px;
	background-image: url("picto-actualite.png");
}
#actualites .actu div p
{
	font-size:0.9em;
}
/*------------- Perso actu --------------*/
#actualites .PJ div .picto
{
	background-position:0 0;
}
#actualites .PJ div
{
	border-bottom-color:#448fc7;
	color:#448fc7;
}
#actualites .abrisol div .picto
{
	background-position:-40px 0;
}
#actualites .abrisol div
{
	border-bottom-color:#f2ab01;
	color:#f2ab01;
}
#actualites .landru div .picto
{
	background-position:-80px 0;
}
#actualites .landru div
{
	border-bottom-color:#e9e701;
	color:#e9e701;
}
#actualites .heral div .picto
{
	background-position:-120px 0;
}
#actualites .heral div
{
	border-bottom-color:#93a504;
	color:#93a504;
}
#actualites .deco div .picto
{
	background-position:-160px 0;
}
#actualites .deco div
{
	border-bottom-color:#858585;
	color:#858585;
}
/*------------- Perso actu --------------*/
#actualites .actu div p
{
	color:#fff;
}
/*----Partie archives */
#actualites .archives
{
	width:310px;
	position:absolute;
	left:570px;
	top:100px;
	background: url("archives.png") no-repeat;
	padding:55px 0;
}
#actualites .archives .cadre
{
	padding:0 30px;
	color:#9f9f9f;
}
#actualites .archives .cadre .periode
{
	font:700 0.9em "Trebuchet Ms";
}
#actualites .archives .cadre ul
{
	padding:0 0 0 22px;
}
#actualites .archives .cadre ul,
#actualites .archives .cadre ul li
{
	list-style:square;
}
#actualites .archives .cadre ul li a
{
	color:#9f9f9f;
	text-decoration:none;
	font:400 0.8em "Trebuchet Ms";
}
#actualites .archives .cadre ul li a:hover
{
	text-decoration:underline;
}

/*---------------------- Page actualites -----------------------*/
#quisommesnous, #telechargement
{
	width:880px;
	position:relative;
	top:-1em;
	left:-1em;
	font-family:"Trebuchet Ms";
	font-size:0.9em;
	padding:100px 0 50px;
	margin:0 0 -1em;
	color:#fff;
}
#quisommesnous
{
	background:#2f2f2f url("titre-groupe.png") top left no-repeat;
}
#telechargement
{
	background:#2f2f2f url("titre-telechargements.png") top left no-repeat;
}


#quisommesnous div
{
	/*background:#4e4e4e;*/
	margin:0 3em;
	padding:0 2.5em 2.5em;
}
#quisommesnous div h1, #telechargement div h1
{
	padding:0 0 0.5em;
	border-width: 0 0 1px;
	border-style:solid;
	border-color: #fff;
	margin-bottom:0.5em;
}
#quisommesnous div h2, #telechargement div h2,
#quisommesnous div h3, #telechargement div h3,
#quisommesnous div h4, #telechargement div h4
#quisommesnous div h5, #telechargement div h5
{
	padding:0.5em 0 0.2em;
	margin-bottom:0.3em;
}
#quisommesnous div h2, #telechargement div h2
{
	border-width: 0 0 1px;
	border-style:solid;
}
#quisommesnous div .landru, #telechargement div .landru
{
	border-color: #e9e701;
	color: #e9e701;
}
#quisommesnous div .PJ, #telechargement div .PJ
#quisommesnous div .piscine, #telechargement div .piscine
{
	border-color: #448fc7;
	color: #448fc7;
}
#quisommesnous div .heral, #telechargement div .heral
{
	border-color: #93a504;
	color: #93a504;
}
#quisommesnous div .decoration, #telechargement div .decoration
{
	border-color: #acacac;
	color: #acacac;
}
#quisommesnous div .abri, #telechargement div .abri
{
	border-color: #fa7e21;
	color: #fa7e21;
}



#quisommesnous div p, 
{
	padding:0.5em 2em 1em;
}
#quisommesnous a, #telechargement a { color: #fff; font-weight: bold; text-decoration: none; }
#quisommesnous ul {
	list-style: none;
}

/* ##### HOMEPAGE TABLE ##### */
#telechargement .csstable {
	display: table;
	width: 840px;
}
#telechargement .cssrow {
	display: table-row;
}
#telechargement .csscell {
	display: table-cell;
	width: 280px;
	position: relative;
	top: 0px;
}
#telechargement .csscell p {
	background: #4F4F4F;
	height: 150px;
	padding: 10px;
	margin: 3px;
	text-align: center;

}



#telechargement .csscell img {
	height: 100px;
}