/*
    20 juillet 2007
    echavanon@neptune.fr
    FPI - CSS
    Front end
*/

@import url(basic.css);
@import url(utils.css);
/*  ----------------------------------------------------------------------------
    ARCHITECTURE
*/

html, body {
	height: 100%;
	padding:0;
	margin:0;
    background:#5DA2CC url(background/image_fond_large.jpg) repeat-x left 60px;
}

#conteneur{
	position: relative;
		/* permet au bloc de servir de référent pour
		   ses descendants positionnés en absolu */
	min-height: 100%;
    padding:0;
    width:900px;
    text-align: left; /* on rétablit l'alignement normal du texte */
    margin:0 auto;
    color:#1F1F1F;

}


div#conteneur #banniere_menu {
	margin-top: 0; /* évite tout risque de fusion des marges */
}
div#conteneur #footer {
	margin-bottom: 0; /* évite tout risque de fusion des marges */
}

/* --- PIED DE PAGE --- */
div#fake_footer {
	position: absolute;
	bottom: 0; left: 0;
	width: 100%;
		/* pour que le bloc prenne toute la largeur du bloc de référence
		   Note : le bloc de référence est le plus proche ancêtre positionné
		   en relatif ou en absolu */
	height: 1px;
}


#left_slot{
    padding:0 0 0  20px;
    margin:0;
    width:180px;
    float:left;
}

#main_slot{
    background:url(background/bg_top.gif) no-repeat 110px 0px;
    padding:44px 0 0 0; /* Pour placer l'image du dessus flash */
    width:750px;
    margin-left:210px;
}

#banniere_menu
{
    width:100%;
    height:40px;
    margin:0;
    margin-top: -12px; /* ??? Pkoi on a ce décalage ? */
    background: url(background/bandeau_menu_haut.png) repeat-x top center;
}

#contenu{
	/*background:#fff;*/
}



/* -----------------
    Petits HTML générique
*/
h1{
    margin:0 0 20px 0;
    color:#FF743E;
    padding:0 0 5px 0;
    border-bottom:1px solid #CCCCCC;
}


#logo_top{
	margin:40px 0px 5px 0px;	
}

/* -----------------
    MENU
*/


#menu
{	
	margin: 0;
	padding: 0;
	position:relative;
	height:40px;
	top:0;
	width:900px;
	left:50%;
	margin-left:-450px;
	text-align: left;
    background: url(background/logo-haut.png) no-repeat 10px 13px;
    font-weight:bold;
}

#menu li
{	
	float: left;
	list-style: none;
	position:relative;
	    z-index:50;
}



#menu li a
{	
	display: block;
	background: none;
	padding: 14px 12px 10px 12px;
	text-decoration: none;
	min-width: 45px;
	text-align:center;
	color: #E7ECF0;
	font-size: 14px;
	white-space: nowrap;
	text-shadow:0 1px 1px #112331;
	height:16px;
	z-index:50;
}

#menu li a.context{
    font-weight:bold;
}

#menu li a:hover, #menu li a.hovered
{	
	background: #5F94BF;
}

#menu li ul
{	
	margin: 0;
	padding: 0;
    left:0px;
	top:40px;
	position: absolute;
	z-index:500;
	/*visibility: hidden;*/
	display:none;
	/*
	opacity:0.95;
	-moz-opacity:0.95;
	 filter : alpha(opacity=95);*/
}

#menu li ul li
{	
	float: none;
	display: inline;
}

#menu li ul li a
{ width: auto;
	/*background: #74A6CF;*/
	background: #C2DBEF;
	color: #112331;
	font-size: 12px;
	text-align: left;
	padding: 4px 30px 4px 10px;
	text-shadow:none;
}

#menu li ul li a:hover
{	
	background: #C2DBEF;
	text-decoration: underline;
}




/*

	FIN MENU

*/


/*
    Listings---
*/

table.tablelist{
    margin-top:10px;
}

table.tablelist dt span.link{
    padding-right:10px;
    display:block;
    float:left;
}

table.tablelist td.link{
    padding:0 5px;
}

table.tablelist td.libelle{
    color:#6F6F6F;
    font-size:11px;
}

table.tablelist td.libelle span{
    display:block;
    font-size:12px;
    color:#2E8F27;
    font-weight:bold;
    padding:0 0 2px 0;
}


/* -----------------------------------------------------------------------------
    Boite de login espace membres
*/
#membres_area{
    color:#E0E9EF;
    padding:6px 0px 0px 3px;
    height:18px;
    width:100%;
    font-size: 9px;
    background:url(background/bandeau_haut_membre.png) repeat-x top center;
}

#membres_area div{
	text-align: left;
	width: 900px;
	padding:0;
	margin: auto;
	text-align:left;
	padding-left:100px;
	z-index:5;
}

#membres_area a{
    text-decoration:none;
    color:#E0E9EF;
}
#membres_area a:hover{
    text-decoration: underline;
}
#membres_area span{
	padding:0px 10px;
}

#membres_area input.field, #mini_form_auth input.field{
    color: #333;
    border: none ;
    font-size: 10px;
    padding:0 0 0 3px;
    margin: 0 0 0 10px;
}

#membres_area input.button, #mini_form_auth input.button{
    cursor:pointer;
    margin: 0 0 0 10px;
    border:none;
    background:#FFF;
    font-weight:bold;
}

#membres_area .info, #mini_form_auth .info{
	font-style: normal;
	color:#E0E9EF;
}
#membres_area .info a:hover, #mini_form_auth .info a:hover{
	text-decoration: underline;
}

#mini_form_auth h3{
	color:#fff;
	margin:5px;
	text-shadow:0 1px 1px #112331;
}

#mini_form_auth{
	display:none;
	color:#fff;
	padding:0px;
	background:url(./background/bg_espace_membres_connexion.png) no-repeat 0px -4px;
	position:absolute;
	text-align: left;
	width:278px;
	height:136px;
	top:63px;
	left:50%;
	margin-left:-315px; /*139 - le positionnement voulu*/
	z-index:20;
}
#mini_form_auth table{
	margin:12px auto;
}

/* -----------------------------------------------------------------------------
    Pages de contenu
*/
#page_top{
    background:url(background/haut_page.png) no-repeat 0px 0px;
    height:33px;
    color:#FFF;
    font-size: 18px;
    padding: 0px;
}
#page_top span{
	display:block;
	float:left;
	background:url(background/fond_bouton_titre.png) no-repeat left top;
	padding:7px 30px 4px 30px;
}
#page_top span.rubrique{
	margin-left:40px;
}
/*
#page_bottom{
    background:url(background/bg_page_standard_bottom.png) no-repeat;
    width:745px;
    height:20px;
}
#page_repeat, #espace_membres_repeat{
    background:url(background/bg_page_standard_repeat.png) repeat-y;
    width:745px;
}*/

#page_content h1{
	font-family: "Lucida Grande", Lucida Grande, Verdana, sans-serif;
	height:100px;
	font-size:36px;
	font-weight: normal;
	color:#ffffff;
	background-repeat: no-repeat;
	background-position: top center;
	background-image: none;
	padding: 100px 30px 15px 30px ;
}

#page_content{
	/*margin-top:-12px;*/
	font-family: "Lucida Grande", Lucida Grande, Verdana, sans-serif;
	font-size:12px;
	line-height: 1.6em;
    padding:0px;
    padding-bottom:12px;
    background:#fff;
}
#page_content #page_text{
    width:600px;
    padding-left:20px;
    text-align:justify;
}

#page_content #page_photos{
    margin:20px 10px 0px 10px;
    padding-bottom:20px;
}
#page_content #page_photos a{
    margin:20px 5px;
}

#page_content #page_photos h3{
    color:#fff;
    padding:5px 10px;
    font-weight:normal;
    background:#3F8DD8;
    text-align:right;
}

#page_content #page_fichiers{
    padding:10px;
}

#page_content #page_fichiers table{
    border-collapse:collapse;
    margin:0;
    width: auto !important;
    width:400px;
    min-width:400px;
}
#page_content #page_fichiers table td, #page_content #page_fichiers table th{
    padding:4px;
}
#page_content #page_fichiers table th{
    background:#3F8DD8;
    color:#fff;
}

#page_content #page_fichiers span{
    float:left;
    display:block;
    margin:10px 0;
    letter-spacing:3px;
    color:#ccc;
    font-weight:bold;
    font-size:18px;
}

#page_content #page_text.moyen{
	font-family: "Lucida Grande", Lucida Grande, Verdana, sans-serif;
	font-size:12px;
	line-height: 1.6em;
    width:600px;
}

#page_content #page_text.large{
	font-family: "Lucida Grande", Lucida Grande, Verdana, sans-serif;
	font-size:12px;
	line-height: 1.6em;
    width:870px;
}
#page_content #page_text.large table{
	font-family: "Lucida Grande", Lucida Grande, Verdana, sans-serif;
	font-size:12px;
	line-height: 1.6em;
	width:850px;
}

/* -----------------------------------------------------------------------------
    Rubrique
*/

#rubrique_pages dt, #rubrique_pages dd{
    margin:0;
}

#rubrique_pages dt{
    font-weight:bold;
}

#rubrique_pages dd{
    padding:3px 0 15px 3px;
}

/* -----------------------------------------------------------------------------
    Espace membres
*/
#espace_membres_repeat h1, #espace_membres_repeat p{
    color:#496C91;
}
#espace_membres_repeat table{
    width:660px;
    margin:20px 0 20px 20px;
}

#espace_membres_repeat th{
    padding:0 0 5px 0;
    border-bottom:1px solid #CCCCCC;
}
/* -----------------------------------------------------------------------------
    Page d'accueil
*/

#accueil_top{
}

#accueil_carte{
	width:600px;
	height:320px;
	float:left;
}

#accueil_content{
    padding:0 5px 0px 40px;
}

#page_actus{
	color:#fff;
    width:268px;
    height:320px;
    overflow:hidden;
    padding:0px;
    margin-left:631px;
    background: url(background/fond_actu.png) no-repeat;
}

#page_actus dl{
    margin:10px 10px 40px 10px;
    /*display:none;*/
}

#page_actus dt, #page_actus dd{
    margin:3px 15px 0 3px ;
    padding:0;
    color:#fff;
    font-size:12px; /* Pour la date ...*/
}

#page_actus dt a{
    color:#F47920;
    font-weight:regular;
    font-size:13px;
    padding-left:5px;
}
#page_actus dd{
    font-size:12px;
    padding-bottom:5px;
    margin-bottom:18px;
    border-bottom:1px dotted #E7ECF0;
}


#page_actus h3{
    text-decoration:none;
    color:#fff;
    margin:0px 10px;
    padding:5px;
}




/* -----------------------------------------------------------------------------
    Page AAPPMA
*/
#page_content.aappma h2, #page_content.aappma h4, #page_content.aappma #infos b{
    color:#35861D;
}

#page_content.aappma h2{
    font-size:14px;
    margin-bottom:2px;
}
#page_content.aappma h4{
    font-size:22px;
    margin:0px 0px 10px 0px;
}
#page_content.aappma h2.presentation{
    color:#DF7B30;
}

#page_content.aappma ul{
	margin-top: 0;
}
#page_content.aappma li{
	/*list-style: none;*/
}


/* -----------------------------------------------------------------------------
    Page bassin
*/

#page_content.bassin h3{
    margin:10px 2px 2px 2px;
    padding:0;
}

#bassin_photo{
    text-align:center;
}

#bassin_photo a{
    text-decoration:none;
}

#bassin_photo a:hover{
    text-decoration:none;
}


/* -----------------------------------------------------------------------------
    Page contact
*/
#courriel_form{
    padding:20px 50px;
}


#courriel_form #send_me{
    padding:3px 10px;
    background:#ffffff;
    color:#FF743E;
    cursor:pointer;
    border:1px solid #FF743E;
}

/* -----------------------------------------------------------------------------
    Page de commande de Permis
*/

#commande table{
    width:100%;
}

#commande th{
    padding:20px 10px 15px 10px;
    text-align:center;
}

#commande th span{
    display:block;
    padding:3px;
    border-bottom:1px solid #CCCCCC;
}
#commande td.label{
    border-left:1px solid #EFFAFF;
    font-size:11px;
    font-weight:bold;
    text-align:right;
    width:150px;
}
#commande #periode td{
    padding-top:10px;
}
#date_vacances span, #date_journaliere span{
    display:block;
}
.small_info{
    font-style:italic;
    font-size:10px;
    padding:15px;
    color:#FF743E;
}

/* -----------------------------------------------------------------------------
    Plan du site
*/

dl#plan-site{
    margin: 0 10px;
}

dl#plan-site dt{
    padding:20px 5px 5px 5px;
    font-weight:bold;
    border-bottom:1px solid #CFCFCF;
}

dl#plan-site dd{
    margin:0;
    padding:0 0 0 10px;
}

dl#plan-site dd dt{
    padding:2px;
    font-weight:normal;
    border-bottom:none;
}

dl#plan-site dd dt a, dl#plan-site dd dt a:link, dl#plan-site dd dt a:visited{
    color:#7F7F7F;
}

dl#plan-site dd dt a:hover{
    color:#FF743E;
}
/* -----------------------------------------------------------------------------
    Footer
*/
#footer{
    font-size:10px;
    text-align:center;
    color:#EFEFEF;
    background:url(background/fond_bas_page.png) no-repeat left top;
    padding-bottom: 20px;
}
#footer p{
	padding-top:6px;
    text-align:center;
}
#footer span.poisson{
    display:inline;
    background:url(background/logo_bas.png) no-repeat left center;
    margin:0;
    padding:0 0 0 20px;
}

#footer a{
    color:#EFEFEF;
    font-weight:bold;
    font-size:11px;
    padding-right:10px;
}

#footer a:hover{
    /*background:#4698AD;*/
}

/*
	GALERIE
*/
#galerie_photos{
	background:#fff;
}
#galerie_photos a{
	margin:7px 13px;
}


/* ----------
    CLASSES GENERALES
*/
p.info a, p.info, .content_info a, .content_info{
    text-decoration:none;
    color:#5E809F;
}
p.info a:hover, .content_info a:hover{
    text-decoration:underline;
}