/*--------------------------------------------------------------------------------
    CSS - Feuille de style générale
    projet: 	Pepe Gaffner
    modifie le: 2009-08-10
--------------------------------------------------------------------------------*/

/*----- STYLES DE BASE -----*/
/*--- Général ---*/
html {font-size: 100%;}
body {margin: 0; padding: 0; font-family: Arial, Helvetica, "Liberation Sans", FreeSans, sans-serif; font-size: .8em; line-height: 1.4; color: #53002b; background-color: #fff;}

/*--- Titres ---*/
h1, h2, h3, h4, h5, h6 {margin: 0; font-style: normal; }
h1 {font-size: 1.75em; color: #0099FF; margin: 0.3em 0em;}
h2 {font-size: 1.5em; color: #0099FF; margin: 0.3em 0em;}
h3 {font-size: 1.25em;}
h4 {font-size: 0.9em; font-weight: normal;}

/*--- Listes ---*/
ul, ol {margin: 0; padding: 0;}
ul li, ol li { list-style: none;}

/*--- Paragraphes ---*/
p {margin: 0;}
address {margin: .75em 0; font-style: normal;}

/*--- Liens ---*/
a, a:link, a:visited {text-decoration: none; color: #000; font-weight: bold;}
a:hover, a:focus, a:active {color: black; text-decoration: underline;}
a img { border: none;}

/*--- Divers éléments de type en-ligne ---*/
em { font-style: italic;}
strong { font-weight: bold;}

/*--- Formulaires ---*/
form, fieldset {margin: 0; padding: 0; border: none;}
input, button, select { vertical-align: middle;} /* Solution au pb. d'alignement */

/*--- Tableaux ---*/
table {margin: 0; border: 0px solid gray; border-collapse: collapse; border-spacing: 0;}
table td, table th {padding: 4px; border: 0px solid #ccc; vertical-align: top; text-align: left;}

/*----- MISE EN PAGE -----*/
#wrapper {position: relative; width: 840px; margin: 10px auto 0;}

/*--- Header ---*/
#header {position: relative; top: 0px; left: 10px; height: 160px;}
#header h1 {margin: 0px;}

/*--- Navigation principale ---*/
#wrapper-billet {position: absolute; left: 10px; top: 160px; width: 500px; margin: 0px; color: #000; padding: 0px;}
#wrapper-menu   {position: absolute; left: 518px; top: 160px; width: 310px; margin: 0px; color: #000; border-left: 3px dotted #0099FF; padding: 0px 0px 0px 5px;}

/* Encart principal */
.encart-billet {position: relative; width: 500px; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 3px dotted #0099FF; }
.encart-billet p.commentaires {float: right; padding: 0px; font-size: 0.85em;}
.encart-billet p.com-message {float: left; display: block; width: 480px; margin: 5px 0px 0px; padding: 5px 5px 0px 20px; font-size: 0.9em; border-bottom: 0px solid #0099FF;}
.encart-billet p.com-indication {float: left; display: block; width: 480px; margin: 5px 0px; padding: 0px 5px 0px 20px; font-size: 0.85em; border-bottom: 1px dashed #0099FF; text-align: right; line-height: auto; font-style: italic;}
.encart-billet p.com-reponse {float: left; display: block; width: 480px; margin: 5px 0px 0px; padding: 5px 5px 0px 20px; font-size: 0.9em; border-bottom: 0px solid #0099FF; background-color: #94DCFF;}

#formulaire-login div {display: block; float: left; width: 490px; border: 1px solid #0099FF; margin: 0px; padding: 10px 5px; }
#cadre_connect {display: block; position: relative; height: 25px; background-color: #0099FF; border: 1px solid #0099FF; margin: 5px 6px; padding: 5px 5px; color: #fff; line-height: 0.8em; font-weight: bold; }
#cadre_connect a.oubli { position: absolute; top: 17px; left: 500px; background: url(../images/tick-liens-membre.jpg) no-repeat 0 2px; padding-left: 15px; text-transform: uppercase; font-size: 0.9em;}
#formulaire-login div.simple {float: left; display: block; position: relative; width: 220px; height: 90px; background-color: #fff; border: 1px solid #0099FF; margin: 5px; padding: 5px; text-align: center;}
#formulaire-login h4 {float: left; width: 490px; height: 28px; margin: 0px; padding: 5px 6px; line-height: 1.0em; font-weight : bold; font-size: 1em;}

.popup {position: absolute; width: 490px; height: 200px; z-index: 99999; margin-top: 100px; padding: 10px; border: 2px solid #0099FF; background: #FFFFFF;}
.popup_close {display: block; position: relative; left: 470px; height: 0px; width: 21px; height: 21px; background: #FFFFFF;}
.popup_connect {display: block; position: relative; height: 25px; background-color: #0099FF; border: 1px solid #0099FF; margin: 5px 6px; padding: 5px 5px; color: #fff; line-height: 0.8em; font-weight: bold; }
.popup_connect a { position: absolute; top: 17px; left: 500px; background: url(../images/tick-liens-membre.jpg) no-repeat 0 2px; padding-left: 15px; text-transform: uppercase; font-size: 0.9em;}
div.popup_login {float: left; display: block; position: relative; width: 220px; height: 90px; background-color: #fff; border: 1px solid #0099FF; margin: 5px; padding: 5px; text-align: center;}
h4.popup_login  {float: left; width: 490px; height: 28px; margin: 0px; padding: 5px 6px; line-height: 1.0em; font-weight : bold; font-size: 1em;}

/*--- Sidebar ---*/
#sidebar {float: left; position: relative; padding-bottom: 20px;}
#sidebar h1 {width: 300px; font-size: 1.5em; background:#0099ff; color: #FFFFFF; margin: 0em; padding: 4px 0px; text-align: center;}
.sidebar-cadre a { color: #000;}
.sidebar-cadre p { font-weight: normal; margin-bottom: 5px;}
.sidebar-cadre p.commentaires2 {float: right; display: block; padding: 0px; font-size: 0.85em;}

/*--- Complément ---*/

/*--- Footer ---*/
#footer {
	clear: both;
	background: url(../images/bg-footer.jpg) no-repeat top center;
	position: relative;
	height: 150px;
}
img#logo-footer {
	position: absolute;
	top: 40px;
	left: 150px;
}
ul#menu-footer li, ul#liens-footer li {	display: inline;}
ul#menu-footer li a, ul#liens-footer li a {	font-weight: bold;}
#footer a:hover { text-decoration: underline;}
ul#menu-footer {
	position: absolute;
	top: 50px;
	left: 260px;
}
ul#menu-footer li {	padding-right: 20px;}
ul#liens-footer {
	position: absolute;
	top: 70px;
	left: 260px;
}
ul#liens-footer li {
	color: #a5a5a5;
	font-size: 0.9em;
}
ul#liens-footer li a { color: #a5a5a5;}

/*--- cc ---*/
ul#liens-footer2 { position: absolute; top: 90px; left: 260px;}
ul#liens-footer2 li { color: #a5a5a5; font-size: 0.9em;}
ul#liens-footer2 li a { color: #a5a5a5;}
ul#liens-footer3 { position: absolute; top: 115px; left: 0px;}
ul#liens-footer3 li { color: #c4c4c4; font-size: 0.9em; float: left; padding: 2px 5px;}
ul#liens-footer3 li a { color: #c4c4c4;}
/*--- /cc ---*/


/*--- redirect ---*/
#redirection {width: 500px;	height: 301px; margin: 50px auto 0; padding: 0; font-size: 1.2em; text-align: center; font-weight: bold; background: url(../images/cadre_redirect.png) no-repeat 0 0;}