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

body 
{   margin:0;
	background:url(../images-prog/arriere-bleu-gauffre.jpg) repeat-x;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	min-width:900px;
    width:expression(document.body.clientWidth >= 910? "900px": "auto" );
	}
	
p, h1,h2,h3,h4,h5,h6,td,tr {
	font-family: Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#000;
	
		}
		
h1,h2,h3,h4,h5,h6 
{
	font-weight: normal;
}
h1 {
	font-size:25px;
}
h2 {font-size:18px;}
h3 {font-size:16px;}
h4 {font-size:14px;}
	
a img { border:none; margin:0;
}
a:hover img { border:none; margin:0;
}


#page-conteneur {
	width:90%;
	min-width:800px;
	height:100%;
	margin: 0 auto 100px auto;
	padding: 0;
	overflow:visible;
	background:url(../images-prog/arriereplan-gristransp.png);
	-moz-border-radius: 10px 10px 0 0;
	-webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0.6);
}

#page {
	padding:20px;
	background:white url(../images-prog/bgsidebar.jpg) repeat-y scroll right center;
	min-height:600px;
	position: relative;
}



#index-conteneur {width:100%; margin:0; padding:0;}





img#txt-pierrot {
	position:absolute;
	top:-30px;
	z-index: 99;
	right: 499px;

}
img#txt-etsesamis {
	position:absolute;
	top:-10px;
	z-index:98;
	right: 200px;

}

img#photo-incline {
	float: right;
	margin: -90px -50px 0 0;

}
img#photo-gauche {
	float: left;
	margin: -80px 0 0 -80px;
	border: 1px solid #ccc;

}


h2.light {
	color: #000;
}

div#entete {
	position:relative;
	height: 150px;
	width: 100%;
	margin: 0;
	padding: 0;
	background:url(../images-prog/arriere-entete.jpg) repeat-x;
	border-bottom: 1px solid #000;
	-moz-border-radius: 10px 10px 0 0;
}

img#etsesamis {
	position:absolute;
	right:1px;
	bottom:-2px;
}

div#revele-ombre {
	width:99.4%;
	margin:0 auto;
	background: #fff;
	border-left: 1px solid #ccc;
	border-right: 1px solid #ccc;
	padding: 0;
	-moz-border-radius: 10px 10px 0 0;
}

div#menu {
	background-color:#000000;
	height: 40px;
	overflow: hidden;
}
div#menu a.liens1 {
	font-size:20px;
	color:#ccc;
	display: inline;
	width: auto;
	text-decoration:none;
}
div#menu a.liens2 {
	font-size:12px;
	color:#fff;
	margin: 0 2px;
	text-decoration:none;
}

div#menu a.liens1:hover { color:#FFFFFF; }


div#menu a.liens2:hover { color:#99CC00; cursor:default;}

div#menu-gauche {
	float:left;
	width:auto;
	margin-left: 10px;
}
div#menu-droite{
	float:right;
	width:auto;
	margin-right: 10px;
}

div#sous-menu {
	padding: 5px 0;
	background: url(../images-prog/backgd-greytransp.png);
	font-size: 17px;
}
div#sous-menu a{
	color:#333333;
	margin: 0 5px;
	}

div#sous-menu a.premier{
	margin-left:20px;
	}
div#sous-menu a:hover{
color:green;
}


div#sous-menu span{
	margin: 0 0 0 25px;
	font-family: Arial, Helvetica, sans-serif;
	font: 11px;
	}
	


div#sous-menu-galerie {
	padding: 5px 0;
	background: url(../images-prog/backgd-greytransp.png);
	font-size: 14px;
}
div#sous-menu-galerie a{
	color:#333333;
	margin: 0 5px;
	}

div#sous-menu-galerie a.premier{
	margin-left:20px;
	}
div#sous-menu-galerie a:hover{
color:green;
}


div#sous-menu-galerie span{
	margin: 0 0 0 20px;
	font-family: Arial, Helvetica, sans-serif;
	font: 11px;
	}










div.clearboth {clear:both;}


/* definit le comportement couleurs du menu  selon la 'id' appliquée au 'body' */
body#actualites a.actualites, body#articles a.articles,body#carriere a.carriere,body#galerie a.galerie,body#contact a.contact,
body#liens a.liens,body#alaffiche a.alaffiche,body#prochainement a.prochainement,body#archives a.archives,body#vdf a.vdf,body#livredor a.livredor,body#rechercher a.rechercher,body#galerieamis a.galerieamis,body#eleves a.eleves
 {  font-size:14px; font-weight:bold; color:#ff0000; }

body#actualites a.actualites:hover, body#articles a.articles:hover, body#carriere a.carriere:hover,body#galerie a.galerie:hover,body#contact a.contact:hover,
body#liens a.liens:hover,body#alaffiche a.alaffiche:hover,body#prochainement a.prochainement:hover,body#archives a.archives:hover,body#livredor a.livredor:hover,body#rechercher a.rechercher:hover,
body#vdf a.vdf:hover,body#galerieamis a.galerieamis:hover,body#eleves a.eleves:hover
 {  font-size:14px; font-weight:bold; color:#B3CEE3; }


body#actualites a.pierre,body#articles a.pierre,body#carriere a.pierre,body#galerie a.pierre, body#contact a.pierre,
body#liens a.pierre,body#vdf a.pierre,body#livredor a.pierre,body#rechercher a.pierre
{  color: #B3CEE3;}

body#alaffiche a.amis,body#prochainement a.amis,body#archives a.amis,body#eleves a.eleves,body#galerieamis a.amis 
{ color: #B3CEE3; }


/* fin*/

table.style1 {
	width:65%;
	margin:0 auto;
	padding:2px;
	text-align:left;
	border: 1px solid #666;
}
table.style1 tr th {padding:10px 0 30px 5px; text-align:center;}
table.style1 tr td {
	padding:1px 0 0 5px;
	width:50%;
}
table.style1 tfoot { text-align:center; padding-top:30px;}
table.style1 thead { padding-bottom:20px;}


table.interface {
	width:auto;
	margin:0 auto;
	padding:2px;
	text-align:center;
	border: 1px double #ccc;
	
}
table.interface tr th {padding:10px 0 30px 5px; text-align:center;}


table.interface tr td {
	padding:10px 0;
	margin:0;
	width:50%;
border-top:1px solid #ccc;
    border-bottom: 1px solid #ccc;
	font-size:15px;
	background-color:#F8F8F8;
}
table.interface tfoot { text-align:center; padding-top:30px;}
table.interface thead { padding-bottom:20px;}
table.interface img { border:1px solid #000; width:80px;}



div.info {
	width:75%;
	margin:0 auto 50px auto;
	padding: 10px 30px 30px 30px;
	border: 1px solid #ccc;
	background:#E9E9E9;
}

div.info img {
float:left; margin:0px 20px 0px 10px;
}


div#info {
	width:75%;
	margin:0 auto 50px auto;
	padding: 10px;
	border: 1px solid #ccc;
	background:#E9E9E9;
}



table.vdf {
	background-color: #F0F0FF;
	border:1px solid #ccc;
	padding:10px;
	margin:0 auto;
	width: 500px;
	height: auto;
}

.champvide {
	background-color:#FFC6C6;
}

.attention {color:red; font-weight:bold;}

span#averttotal { font-size:14px; font-weight:bold;}

.nb {font-size:9px;}

div#fondvdf {
	background:url(../images-prog/arriere-form.jpg) no-repeat;
	width: 900px;
	margin: 0 auto;
	padding: 293px 0 50px 0;
}
div#login {
	width: 60%;
	margin: 50px auto 400px auto;
	padding: 30px;
	text-align: center;
	background-color: #FBFBFF;
	border: 1px solid grey;
	position: relative;
}

div#couvrelogin {
	margin:0;
}


div#interface {
	width: 100%;
}

div.interface-commandesvdf {
	width: 100%;
	margin:0 auto;
	border:2px solid grey;
	background: #fff;
	overflow: auto;
	padding:5px;
}



table.commandesvdf tr td{
border:1px solid #ccc;
}

table.commandesvdf tr td{
margin:0;
	padding: 3px;
}

.effectue { font-weight:bold; color:#76AD03;}



/* pour la chronologie de Pierre*/
div.categorie{
	width:100px;
	float:left;
	margin:0 10px!important;
	text-align:center;
}

div.theatre span{color:red; font-weight:bold;}
div.cinema span{color: navy;font-weight:bold;}
div.television span{color:green;font-weight:bold;}
div.voix span{color:purple;font-weight:bold;}
div.radio span{color:#993300;font-weight:bold;}

div.theatre,
div.cinema,
div.television,
div.voix,
div.radio { margin:0 ; padding:10px;}

div#theatre,div#cinema,div#television,div#voix,div#radio 
{
 border:1px dashed black;
}


body#carriere div#liste div {
	margin:50px 0; width:90%;
}

div#pieddepage {
	margin:0;
	background-color:#0B3110;
	padding: 6px 10px;
	color: white;
	font-size: 10px;
	text-align: center;
}
div#pieddepage a, div#pieddepage a:visited {
	color:#ABF98A;
}
div#liste {
	border: 1px solid #333;
	padding-left:40px;
	background: #EFEFEF;
}

div#texte-accueil {
	margin:20px 20px 60px 440px;
	padding: 40px;
	background-color: #F3FCFE;
	border: 1px solid #E4E4A5;
	-moz-border-radius:3em 1em;
	-webkit-border-radius:1em;
	color: #333;
}


div#texte-accueil h4{
	padding:0;
}

div#texte-accueil h1{
	color:#111;
 }
 
div#texte-accueil h4{
	color:#333;
 }


div.javashow {display:none;}

div#temp{
	width:500px;
	height:300px;
	border:1px solid green;
	margin: 30px;
}
div #rechercher {
background-color:#E7EFF5;
width:90%;
margin:20px auto;
border: 2px solid #333;
padding:15px;
}

div#titres-accueil {
	margin:10px auto 20px auto;
	height: 120px;
	overflow: auto;
	background-color:#F4F8FB;
	font-size:13px;
	border: 1px dashed #999;
	padding: 15px;
	width: 80%;
	}
div#titres-accueil p{
	margin:3px;
}

div#titres-accueil a{ color:#333;}
div#titres-accueil a:hover {color:#006600;}
div#titres-accueil a:visited{ color:#666;}

div.titres {
	margin: 30px auto;
	height: 150px;
	overflow: auto;
	width:80%;
	background-color:#E7EFF5;
	font-size:13px;
	padding:15px;
	border: 2px solid #333;
	}
div.titres p{ margin:3px 0;}

div.titres a{ color:#000; font-size:17px;}
div.titres a:hover {color:#006600;}
div.titres a:visited{ color:#666;}


#remplacement {
	width: 80px;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent url(/images-prog/tableauexcel.gif) no-repeat center center;
	text-indent: -1000em;
	cursor: pointer; /* hand-shaped cursor */
	cursor: hand; /* for IE 5.x */
	height: 100px;
	
}


div.galerie { text-align:center; margin:10px 0; }
h2.galerie { text-align:center; padding:0; margin:0; margin: 25px 0 5px 0;}

a.galerie img {margin:0; }
table.galerie { margin:0 auto;}
table.galerie tr td {padding:20px;}


div.texte-accueil {
	margin:50px auto 0 auto;
	background-color: #F9F9F9;
	padding: 3px 0;
	text-align: center;
	border: 2px solid #666;
	width: 60%;
}
div.texte-accueil div.conteneur{
	width:90%;
}


div.texte-accueil p{
	font-size:15px;
}

div.liens,div.liens2  {
	margin-top:30px;
	width: 50%;
	float:left;
	text-align:center;
}
div.liens2 { }

a.toutesphotos1,a.toutesphotos2 {
height:35px; width:80%;
text-align:center;
 background-color:#C7EFC9;
 text-decoration:none;
  color:#000000;
   margin:20px 0;}

a.toutesphotos2 { background-color:#F1E2ED; }


a.toutesphotos1:hover,a.toutesphotos2:hover {
background-color:#165421; color:#fff;
}
a.toutesphotos2:hover {
	background-color:#8A0000;
	color:#fff;
}

/* MEU ACCORDEON */

#pleah {
	font: 18px Arial, Helvetica, sans-serif;
	width: 100%;
	height: 40px;
	overflow: hidden;
	position: relative;
	color: #999999;
	float: right;
}
#pleah div {
	height: 40px;
	position: absolute;
}
#pleah div h2 {
	display: block;
	float: left;
	text-align: center;
	width: 120px;
	height: 30px;
	margin: 0 10px 0 0;
	cursor: pointer;
	overflow: hidden;
	color: #fff;
}

#pleah div.active h2 { background:url(../images-prog/tri.gif) center right no-repeat; 
}



#pleah div h2 span {
}
#pleah div p {
	display: block;
	color: white;
	margin: 0;
}

#pleah #acc1 {
	background:#000;
	top: 6px;
}
#pleah #acc1 h2 {
	color:#fff;
}

#pleah #acc2 {
	background:#000;
	width: 1200px;
	top: 6px;
}
#pleah #acc2 h2 {
	color: #fff;
}


/* ************fin************ */
span.bull { position:relative; top:2px; left:2px;}
