*{margin:0px;padding:0px;}
.clearboth{clear: both;}
.invisible{display: none;}
.nodecoration{text-decoration: none;}
.valider{border: 2px solid black;font-family:Arial, Helvetica, sans-serif; font-size:11px;font-weight: bold;background-color: white; cursor: pointer; }


.typo2{font-family: Tahoma, Arial;}
.typo{font-family: Verdana, Arial, Helvetica, sans-serif; }
.gras{font-weight: bold;}

.vert{color: #3faa2a}
.rose{color: #ff1aec}
.bleu{color: #1025aa}
.orange{color: #ff9a09}
.gris{color:#474747;}
.blanc{color:#FFFFFF;}
.rouge{color:#b94343;}

.typo0{font-size:1%;}
.typo6{font-size: 6px;}
.typo10{font-size:10px;}
.typo11{font-size:11px;}
.typo12{font-size:12px;}
.typo14{font-size:14px;}
.typo15{font-size:15px;}
.typo16{font-size:16px;}
.typo18{font-size:18px;}

.gauche{float: left;}
.droite{float: right;}

.center{text-align:center;}


body {
	margin: 0px;
	padding: 0px;
	background-color: #000000;
	text-align:center;
}

#dilat{
	margin-left: auto;
	margin-right: auto;
	text-align:left;
    width: 1000px;
}

#page{
	background-color: transparent;
    height: 667px;
	text-align:left;	
}
.sur_nav{margin-top: 20px; margin-bottom: 5px;}
.sur_nav a {text-decoration: none;}
.sur_nav a:hover{text-decoration: underline;}


.logo{margin-top: 7px;}
.fond_allee {background-image: url(../imgs/fond_allee.jpg)}
.fond_arbre {background-image: url(../imgs/fond_arbre.jpg)}
.fond_plage {background-image: url(../imgs/fond_plage.jpg)}
.fond_touquet{background-image: url(../imgs/fond_touquet.jpg)}
.fond_skatepark{background-image: url(../imgs/fond_skatepark.jpg)}
.fond_noir{background-image: url(../imgs/fond_noir.jpg)}
.fond_auvergne{background-image: url(../imgs/fond_auvergne.jpg)}
.fond_croix{background-image: url(../imgs/fond_croix.jpg)}
.fond_moi{background-image: url(../imgs/fond_moi.jpg)}
.fond_aurore{background-image: url(../imgs/fond_aurore.jpg)}
.fond_port_c{background-image: url(../imgs/fond_port_c.jpg)}
.fond_roi{background-image: url(../imgs/fond_roi.jpg)}
.fond_ocean{background-image: url(../imgs/fond_ocean.jpg)}
.fond_lac{background-image: url(../imgs/fond_lac.jpg)}
.fond_vertical{background-image: url(../imgs/fond_vertical.jpg)}
.fond_estampe{background-image: url(../imgs/fond_estampe.jpg)}
.fond_jungle{background-image: url(../imgs/fond_jungle.jpg)}
.fond_concept{background-image: url(../imgs/fond_concept.jpg)}


/* Le menu de gauche */
#menu ul {
	float: left;
	padding-top: 530px;
	list-style-type: none ;
}
#menu ul li
{
	clear:both;
	float:left;
	position: relative ;
	background-color:white;
}
#menu ul li a {
  display: block;
	width: 120px;  
	color: black; 
	background-color: transparent;
	text-decoration: none; 
	font-weight: bold;
	height: 18px;
	padding-top: 3px;
	border-bottom: 1px solid black;
  }
#menu ul li a:hover {color: #D73247;}
#menu ul li ul
{
	list-style-type: none ;
	display: none;
	/* le position absolute indique que la position est absolue par rapport au contenant */
	position: absolute ;
	margin:0px;
	margin-top:-21px;
	margin-left:120px;
	padding:0px 0px 0px 0px ;
	background-color: #FFF;
	z-index:5000;
}
#menu ul li ul li
{
	display:inline;
	margin:0px;
	padding:0px;
	border: 0px;
	/* ce float none permet d'annuler l'héritage du float left précédent */
	float: none ;
	/* permet de contrebalancer l'héritage précédent */
	text-align: left ;
}

#menu ul li ul li a{
	display: block;
	width: 140px;  
	color: black; 
	background-color: white;
	text-decoration: none; 
	height: 18px;
	padding-top: 3px;
	border-bottom: 1px solid black;
	border-left: 4px solid #DFDBF0;
}
#menu ul li ul li a:hover{
	color: #00578D;
	background-color: #DFDBF0;
}


.faible {
	filter:alpha(opacity=25);
	-moz-opacity:0.25;
	opacity: 0.25;
}

.fort{
	filter:alpha(opacity=90);
	-moz-opacity:0.90;
	opacity: 0.90;
}

#textes{
	float: left;
	margin-top: 130px;
	padding-left: 6px;
	width: 798px;
	height: 498px;
	
	text-align: justify;
	overflow-x : hidden; 
}
#textes a{color: black}
#textes a:hover{text-decoration: none;}

.c_orange{background-image: url(../../blog/imgs/c_orange.gif); background-position: 133px 2px; background-repeat: no-repeat}
.c_noir{background-image: url(../../blog/imgs/c_noir.gif); background-position: 133px 2px; background-repeat: no-repeat}
.c_rouge{background-image: url(../../blog/imgs/c_rouge.gif); background-position: 133px 2px; background-repeat: no-repeat}
.c_rose{background-image: url(../../blog/imgs/c_rose.gif); background-position: 133px 2px; background-repeat: no-repeat}
.c_bleu{background-image: url(../../blog/imgs/c_bleu.gif); background-position: 133px 2px; background-repeat: no-repeat}
.c_vert{background-image: url(../../blog/imgs/c_vert.gif); background-position: 133px 2px; background-repeat: no-repeat}
.c_jaune{background-image: url(../../blog/imgs/c_jaune.gif); background-position: 133px 2px; background-repeat: no-repeat}
.c_bleuclair{background-image: url(../../blog/imgs/c_bleuclair.gif); background-position: 133px 2px; background-repeat: no-repeat}

.faible {
	filter:alpha(opacity=45);
	-moz-opacity:0.45;
	opacity: 0.45;
	
	background-image: url(../../imgs/fond.jpg);
	background-repeat: repeat-y;
	background-position: 297px 0px;
}

.fort{
	filter:alpha(opacity=95);
	-moz-opacity:0.95;
	opacity: 0.95;

	background-image: url(../../imgs/fond.jpg);
	background-repeat: repeat-y;
	background-position: 297px 0px;
}


#textes{
	float: left;
	margin-top: 90px;
	padding-left: 116px;
	width: 708px;
	height: 498px;
	
	overflow-y:auto;
	overflow-x : hidden;
	text-align: justify;
}
#textes a{color: black}
#textes a:hover{text-decoration: none;}

.image{float: left; padding-left: 35px; margin-top: 10px;}
.cadre_image{border: 4px solid white; border-bottom: 8px solid white;}
.para{
	float:right;
	width: 490px;
	margin: 10px;
	background-color: white;
}
.para p {margin-right: 10px; margin-left: 10px;}

.pointille{height: 1px; width: 250px; border-top: 1px dashed gray; margin-left: 110px}