/* Règles génériques */
body {margin: 0; padding: 0;}

form, fieldset {border: 0; margin: 0; padding: 0;}
img {border: 0;}
li {list-style-position: outside;  list-style-type: none;}
legend {display: none;}


/* styles */
p, a, label, input, li {font: normal 0.9em "Trebuchet MS", "sans-serif"; color: #000;}



h1 {margin: 0;}
h2 {display: none;}

td {vertical-align: top;}
input.checkbox {display: inline !important; margin: 0 !important; padding: 0 !important; background: none  !important; width: auto !important;}

body {background: #00329B url(img/bg/background.jpg); text-align: center;}

span.greenBig {font: bold 1.4em "Trebuchet MS", "sans-serif"; color: #00B805;}
br.clear {clear: both;}

/* Placement */
#body {background: url(img/bg/bd.gif) 10px 0 repeat-y; border-left: 10px solid #000; border-right: 10px solid #000; padding: 20px 0 0 130px; min-height:600px;}
* html #body {height:600px;}
#table1 {width: 100%;}

#container {width: 884px; margin: 15px auto; position: relative; text-align: left; padding: 0 0 0 100px;}
#header {width: 883px; height: 174px; background: url(img/bg/banniere_hippocampe.gif) no-repeat;}
#header h1 {display: none;}

/* Menu */
#menu {width: 210px; height: 440px; position: absolute; top: 150px; left: 0; margin: 0; padding: 0;}
#menu li { background: url(img/bg/mBulle1.gif) no-repeat; width: 170px; height: 77px; margin: 0 0 0 40px;}
#menu span {display: none;}
#menu li.big {background: url(img/bg/mBulle2.gif) no-repeat; width: 210px; height: 87px; margin: 0;}
#menu a {display: block; height: 77px; text-align: center;}
#menu .mLink1 {background: url(img/menu/mlink1.gif) 45px 25px no-repeat;}
#menu .mLink2 {background: url(img/menu/mlink2.gif) 10px 29px no-repeat;}
#menu .mLink3 {background: url(img/menu/mlink3.gif) 32px 25px no-repeat;}
#menu .mLink4 {background: url(img/menu/mlink4.gif) 22px 25px no-repeat;}
#menu .mLink5 {background: url(img/menu/mlink5.gif) 45px 25px no-repeat;}


/* footer */
#footer {clear: both; margin: 0 0 15px 0;}
#footer div {height: 12px; background: url(img/bg/bottom.gif) bottom no-repeat; font-size: 0;}
#footer .content {clear: both; width: 100%; text-align: center; padding: 20px 0 0 0;}
#footer .content, #footer a {color: #fff; background: #000; font: normal 0.9em Arial, sans-serif;}


/* Blocs */
.bloc1 h3, .bloc2 h3, .bloc3 h3, .bloc4 h3, .bloc5 h3, .bloc6 h3, .bloc7 h3, .bloc8 h3, .bloc9 h3, .bloc10 h3, .bloc11 h3 {height: 29px; font: bold 0.97em "Trebuchet MS", "sans-serif"; color: #fff; padding: 8px 0 0 10px; margin: 0; letter-spacing: 0.05em;}
.bloc1 .content, .bloc2 .content, .bloc3 .content, .bloc4 .content, .bloc5 .content, .bloc6 .content, .bloc7 .content, .bloc8 .content, .bloc9 .content, .bloc10 .content, .bloc11 .content {padding: 10px;}
.bloc1 .end, .bloc2 .end, .bloc3 .end, .bloc4 .end, .bloc5 .end, .bloc6 .end, .bloc7 .end, .bloc8 .end, .bloc9 .end, .bloc10 .end, .bloc11 .end {height: 37px;}
.bloc1 p, .bloc2 p, .bloc3 p, .bloc4 p, .bloc5 p, .bloc6 p, .bloc7 p, .bloc8 p, .bloc9 p, .bloc10 p, .bloc11 p {margin: 0 0 5px 0;}
.bloc1 .content img, .bloc2 .content img, .bloc3 .content img, .bloc4 .content img, .bloc5 .content img, .bloc6 .content img, .bloc7 .content img, .bloc8 .content img, .bloc9 .content img, .bloc10 .content img, .bloc11 .content img {border: 2px solid #000;}
.bloc1 .readnext, .bloc2 .readnext, .bloc3 .readnext, .bloc4 .readnext, .bloc5 .readnext, .bloc6 .readnext, .bloc7 .readnext, .bloc8 .readnext, .bloc9 .readnext, .bloc10 .readnext, .bloc11 .readnext {font-weight: bold;}

.bloc1 {width: 412px;}
.bloc1 h3 {background: url(img/blocs/01-jaune.gif) no-repeat;}
.bloc1 .content {background: url(img/blocs/01-bg.gif) repeat-y;}
.bloc1 .end {background: url(img/blocs/01-end.gif) no-repeat;}
.center {text-align: center;}

.bloc2 {width: 412px;}
.bloc2 h3 {background: url(img/blocs/01-vert.gif) no-repeat;}
.bloc2 .content {background: url(img/blocs/01-bg.gif) repeat-y;}
.bloc2 .end {background: url(img/blocs/01-end.gif) no-repeat;}

.bloc3 {width: 282px;}
.bloc3 h3 {background: url(img/blocs/02-bleu.gif) no-repeat;}
.bloc3 .content {background: url(img/blocs/02-bg.gif) repeat-y;}
.bloc3 .end {background: url(img/blocs/02-end.gif) no-repeat;}
.bloc3 .content img {float: left; margin: 0 10px 0 0;}

.bloc4 {width: 710px; padding-bottom: 10px;}
.bloc4 h3 {background: url(img/blocs/03-bleu.gif) no-repeat;}
.bloc4 .content {background: url(img/blocs/03-bg.gif) repeat-y;}
.bloc4 .end {background: url(img/blocs/03-end.gif) no-repeat;}

.bloc5 {width: 710px; padding-bottom: 10px;}
.bloc5 h3 {background: url(img/blocs/03-vert.gif) no-repeat;}
.bloc5 .content {background: url(img/blocs/03-bg.gif) repeat-y;}
.bloc5 .end {background: url(img/blocs/03-end.gif) no-repeat;}

.bloc6 {width: 710px; padding-bottom: 10px;}
.bloc6 h3 {background: url(img/blocs/03-jaune.gif) no-repeat;}
.bloc6 .content {background: url(img/blocs/03-bg.gif) repeat-y;}
.bloc6 .end {background: url(img/blocs/03-end.gif) no-repeat;}

.bloc7 {width: 347px; padding-bottom: 10px;}
.bloc7 h3 {background: url(img/blocs/04-bleu.gif) no-repeat;}
.bloc7 .content {background: url(img/blocs/04-bg.gif) repeat-y;}
.bloc7 .end {background: url(img/blocs/04-end.gif) no-repeat;}

.bloc8 {width: 347px; padding-bottom: 10px;}
.bloc8 h3 {background: url(img/blocs/04-vert.gif) no-repeat;}
.bloc8 .content {background: url(img/blocs/04-bg.gif) repeat-y;}
.bloc8 .end {background: url(img/blocs/04-end.gif) no-repeat;}

.bloc9 {width: 347px; padding-bottom: 10px;}
.bloc9 h3 {background: url(img/blocs/04-rouge.gif) no-repeat;}
.bloc9 .content {background: url(img/blocs/04-bg.gif) repeat-y;}
.bloc9 .end {background: url(img/blocs/04-end.gif) no-repeat;}

.bloc10 {width: 347px; padding-bottom: 10px;}
.bloc10 h3 {background: url(img/blocs/04-bleu2.gif) no-repeat;}
.bloc10 .content {background: url(img/blocs/04-bg.gif) repeat-y;}
.bloc10 .end {background: url(img/blocs/04-end.gif) no-repeat;}

.bloc11 {width: 710px; padding-bottom: 10px;}
.bloc11 h3 {background: url(img/blocs/03-vert2.gif) no-repeat;}
.bloc11 .content {background: url(img/blocs/03-bg.gif) repeat-y;}
.bloc11 .end {background: url(img/blocs/03-end.gif) no-repeat;}


/* page inscription */
#inscription #links {margin: 0; padding: 0;}
#inscription #links a {display: block; width: 123px; height: 19px; background: url(img/bg/onglet.gif) no-repeat; font-weight: bold; color: #fff; text-align: center; text-decoration: none; padding: 4px 0 0 0; float: left; margin: 0 10px 0 0; filter:alpha(opacity=50); moz-opacity:0.5; khtml-opacity: 0.5; opacity: 0.5;}
#inscription #links a.disabled {filter:alpha(opacity=50); moz-opacity:0.5; khtml-opacity: 0.5; opacity: 0.5;}
#inscription #links a.enabled {filter:alpha(opacity=100); moz-opacity:1; khtml-opacity: 1; opacity: 1;}
#inscription .content form {clear: both; background: url(img/divers/inscriptionForm.gif) no-repeat; padding: 10px; display: none;}
#inscription input {width: 266px; height: 19px; border: 0; background: url(img/divers/input1.gif) no-repeat; float: left; padding: 1px 4px;}
#inscription label {width: 200px; display: block; float: left; text-align: right; padding: 0 10px 0 0;}
#inscription .content div {height: 20px; clear: both; margin: 0 0 10px 0;}
#inscription div.default input {width: auto; height: auto; border: 0; background: none; float: none; padding: 0;}
#inscription .content form div {font: normal 0.9em "Trebuchet MS", "sans-serif"; color: #000;}
#inscription .content .btn_submit {width: 130px; height: 33px; font: bold 1.02em "Trebuchet MS", "sans-serif"; color: #fff; text-align: center; background: url(img/btn/00-bleu.gif) no-repeat; margin: 10px 0 20px 0; cursor: pointer;}
#inscription label.missing, #inscription div.missing { background-color:red; }
#inscription textarea {width: 263px; line-height: auto;}
#inscription div.divCheckBox label {width: auto;}

/* Page résultats */
#resultats #blocs {position: absolute; margin: 0; padding: 0; top: 250px; right: -40px;}
#resultats #blocs li {margin: 0 0 10px 0;}
#resultats #blocs a {display: block; width: 169px; height: 55px; background: url(img/divers/bloc1.gif) no-repeat; font: bold 1em "Trebuchet MS", "sans-serif"; color: #fff; text-decoration: none; text-align: center; padding: 10px 0 0 0;}

#resultats table {width: 595px;}
#resultats table thead th.title {height: 33px; background: url(img/bg/01-thead.gif) no-repeat; font: bold 1.02em "Trebuchet MS", "sans-serif"; color: #fff; padding: 0 0 0 10px; margin: 0; text-align: left;}
#resultats table thead th {background: url(img/bg/01-th.gif) top right no-repeat; font: bold 0.95em "Trebuchet MS", "sans-serif"; color: #0733BB; text-align: center; padding: 5px 5px;}
#resultats table tbody td, #resultats table tbody th {background: url(img/bg/01-td1.gif) top right no-repeat; font: normal 0.8em "Trebuchet MS", "sans-serif"; color: #3F3F3F; text-align: center; padding: 5px 5px;}
#resultats table tbody th {font-weight: bold;}
#resultats table .line1 td, #resultats table .line1 th {background: url(img/bg/01-td1.gif) top right no-repeat;}
#resultats table .line2 td, #resultats table .line2 th {background: url(img/bg/01-td2.gif) top right no-repeat;}


/* Page concours */
#concours p {margin: 0 0 15px 0;}
#concours big {font: bold 1.4em "Trebuchet MS", "sans-serif"; color: #00B805;width: 470px; height: 50px; /*background: url(img/divers/grostitre.gif) no-repeat*/; display: block; float: left;}
#concours big span {display: block;}
#concours .bloc6 {margin-bottom: 6px;}
#concours .bloc6 .content {height: 300px;}
#concours .normal .content {height: auto;}
#concours .normal .logos {}
#concours .bloc8 {margin-left: 15px;}
#concours .bloc7 .content, #concours .bloc8 .content {height: 50px;}
#concours .bloc7 a, #concours .bloc8 a {font: bold 1.2em "Trebuchet MS", "sans-serif"; color: #00B805;}

#concours .image {float: left; displtay: block; margin: 0 10px 0 0;}
#concours .content div {float: left; width: 470px;}

#concours .btn1, #concours .btn2, #concours .btn3 {width: 310px; height: 32px; display: block; margin: 0 0 5px 0;}
#concours .btn1 span, #concours .btn2 span, #concours .btn3 span {display: none;}
#concours .btn1 {background: url(img/contenu/btn_presentation.gif) no-repeat;}
#concours .btn2 {background: url(img/contenu/btn_reglement.gif) no-repeat;}
#concours .btn3 {background: url(img/contenu/btn_realiserbd.gif) no-repeat;}


/* Page membres */
#membres .bloc9 {margin-bottom: 6px;}
#membres .bloc10 {margin-left: 15px;}
#membres .bloc9 .content, #membres .bloc10 .content {height: 255px !important; height: 310px;}
#membres .content ul {margin: 0; padding: 0;}
#membres .content li {margin: 0 0 5px 0; clear: both;} 
#membres .content li strong {display: block; width: 150px; float: left; margin: 0 0 5px 0;}
#membres .content li span {display: block; width: 170px; float: left; margin: 0 0 5px 0;}


/* Page contact */
#contact form div {background: url(img/bg/line.gif) bottom repeat-x; clear: both; margin: 0 0 10px 0; padding: 0 0 5px 0;}
#contact form p {width: 200px; float: left; margin: 0 10px 0 0; font: bold 1.1em "Trebuchet MS", "sans-serif"; color: #0733BB;}
#contact form input {float: left; border: 1px solid #000; padding: 2Px; width: 472px;}
#contact form span {display: block; clear: both;}
#contact .content .btn_submit {width: 130px; height: 33px; border: 0; clear: both; float: right; font: bold 1.02em "Trebuchet MS", "sans-serif"; color: #fff; text-align: center; background: url(img/btn/00-bleu.gif) no-repeat; margin: 10px 0 20px 0; cursor: pointer;}
#contact form textarea {border: 1px solid #000; padding: 2Px; width: 460px;}
#contact div.missing input, #contact div.missing textarea { background-color:red; }

/* Page actu */
#actualites .content img {float: left; border: 2px solid #000; margin: 0 5px 0px 0;}
#actualites .clear {clear: both;}

/* Popups */
#popup {background-position: -600px 0; background-repeat: repeat-y; background-color: #00329B; padding: 20px; text-align: left; border: 5px solid #000;}
#popup h1 {color: #F7921C; font: bold 2em "Trebuchet MS", "sans-serif"; margin: 0;}
#popup h2 {color: #fff; font: bold 1.5em "Trebuchet MS", "sans-serif"; display: block; margin: 0;}
#popup p {color: #fff; text-align: justify;} 



/* Login */
#login {width: 210px; height: 161px; background: url(img/bg/login.png) 0 0 no-repeat; position: absolute; top: 555px; left: 0; }
#login legend {display: none;}
#login form, #contact #login form {margin: 19px 17px 17px 17px;}
#login form span {display: none;}
#login label {height: 12px; border: 1px solid red; display: block; margin: 0 0 4px 0; border: 0;}
#login input, #inscription #login input, #contact #login input  {border: 0; width: 120px; height: 20px; background: url(img/divers/input.gif) 0 0 no-repeat;}

#login .loginLabel label, #contact #login .loginLabel label {width: 83px; height: 12px; background: url(img/divers/identifiant.gif) 0 0 no-repeat; float: none; padding: 0;}
#login .loginLabel input, #contact #login .loginLabel input {padding: 3px 5px 8px 5px;}

#login .loginPassword, #contact #login .loginPassword {width: 125px; float: left;}
#login .loginPassword label, #contact #login .loginPassword label {width: 98px; height: 12px; background: url(img/divers/motdepasse.gif) 0 0 no-repeat;}
#login .loginPassword input, #contact #login .loginPassword input {padding: 3px 5px 0px 5px;}


#login .loginSubmit button, #contact #login .loginSubmit button {width: 38px; height: 38px; border: 0; margin: 8px 0 0 6px; cursor: pointer; outline: none; background: url(img/divers/login_ok.jpg) 0 0 no-repeat;}
#login .loginSubmit button span, #contact #login .loginSubmit button span {display: none;}

#login p, #contact #login p {margin: 5px 0 0 0; font-size: 12px;}

#contact #login form div {background: none; margin: 0; padding: 0; clear: none;}
#contact #login form p {width: auto; float: none; margin: 5px 0 0 0; font: normal 12px "Trebuchet MS", "sans-serif"; color: #000;}
#contact #login form input {float: none; border: 0; padding: 3px 5px 8px 5px;; width: auto;}
#contact #login form span {display: none;}

html>body#inscription #login .loginSubmit button {margin: 39px 0 0 1px;} /* Gecko */
*+html #inscription #login .loginSubmit button {margin: 8px 0 0 6px;} /* IE7 */
* html #login .loginSubmit button {margin-left: -2px;} /* IE6 */

/* Bugs */
html>body #body {background-position: 0 0;}


/* IE6 */
*html #contact #login .loginSubmit button {margin-left: -8px;}
*html #login {width: 220px; top: 564px; background: url(img/bg/login.gif) 0 0 no-repeat;}