/* GENERAL */

* {
margin: 0;
padding: 0;
}

body {
font-family: Arial, sans-serif;
font-size: 1em;
background: rgb(153,204,255) url("/img/fond-bleu.gif") ; /*  couleur de fond assortie ý l'image de fond */
background-repeat:repeat-y;
background-position:center;
}

#conteneur {
position: relative;
width: 1000px;
margin: auto;
margin-top: 0px;
margin-bottom: 0px;
}

/*--------------------------------------- */
/*--PARTIES COMMUNES A TOUTES LES PAGES-- */
/*--------------------------------------- */
/* TITRE ET LOGO */

div#header-prof {
position:absolute;
top:0;
left:0;
width: 690px ;
height: 133px ;
margin-left: 169px ;
margin-top: 10px ;
margin-bottom: 8px ;
background: url("/img/bannieres-prof/prof-okashi-banniere-animee.gif") center bottom no-repeat ;
z-index: 3;
}

div#header-club {
position:absolute;
top:0;
left:0;
width: 690px ;
height: 133px ;
margin-left: 169px ;
margin-top: 10px ;
margin-bottom: 8px ;
background: url("/img/bannieres-prof/banniere-cosplay-club-animee.gif") center bottom no-repeat ;
z-index: 3;
}

h1#titre {
visibility: hidden
}

div#logo {
position:absolute;
top:7px;
left:0;
}
img#img_logo {width: 160px ; height: 160px;}

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

div#gauche {
position: absolute;
top:0;
left:0;
width: 160px;
padding-top: 180px;
}

.menugauche {
list-style-type: none;
margin-left: 7px;
}
.menugauche li {
margin-bottom: 5px;
}
.menugauche li a {
display: block ;
width: 150px;
height: 44px;
color: #000000;
line-height: 3 ;
padding: 0px ;
font-family: arial, sans-serif ;
font-style: italic ;
font-weight: bold ;
background-color: #FFFFFE ;
font-size: 11pt ;
text-align: center ;
text-decoration: none;
background: url("/img/menu-blanc.gif") no-repeat ;
}
.menugauche li a:hover {
background: url("/img/menu-gris.gif") no-repeat ;
color: #000000; /* pour I.E. qui sinon affiche une police blanche */
}

/* lignes a inserer, avec l'id qui lui correspond, dans chaque page figurant au menu
.li#j-et-t a {
background: url("/img/menu-gris.gif") no-repeat ;
}
 */

#cosplay-club-membres, #cosplay-club-gperso, #cosplay-club-images, #cosplay-club-messages, #cosplay-club-aide {
display:none;
}

#cosplay-club-membres a, #cosplay-club-gperso a, #cosplay-club-images a, #cosplay-club-messages a, #cosplay-club-aide a {
margin-left:20px;
width: 130px;
height: 30px;
line-height: 2 ;
background: url("/img/menu-blanc-02.gif") no-repeat ;
}

#cosplay-club-membres a:hover, #cosplay-club-gperso a:hover, #cosplay-club-images a:hover, #cosplay-club-messages a:hover, #cosplay-club-aide a:hover {
background: url("/img/menu-gris-02.gif") no-repeat ;
color: #000000; /* pour I.E. qui sinon affiche une police blanche */
} 

.credits {
font-family: arial, sans-serif ;
color: rgb(0,102,0);
font-size: 10pt ;
font-style: italic ;
font-weight: bold ;
margin-top:0px;
margin-bottom:0px;
margin-left: 15px;
margin-right:0px;
}

.rouge {
color:#993366;
font-weight: bold;
}

.w3c {
margin-left: 40px ;
margin-top: 30px ;
margin-bottom:0px;
margin-right:0px;
}

.w3c img {
border: none;}

/*------------------------------- */
/* CENTRE */

div#contenu {
position:absolute;
top:150px;
left:0;
width: 692px ; 
margin-left: 159px;
margin-top: 8px;
margin-bottom: 20px;
padding: 10px;
padding-top: 0;
z-index: 3;
}

div#contenu2 {           /* pour les pages d'image, sans entete */
position:absolute;
top:3px;
left:0;
width: 692px ; 
margin-left: 159px;
margin-top: 8px;
margin-bottom: 20px;
padding: 10px;
padding-top: 0;
z-index: 3;
}

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

div#publicite1 {
position: absolute;
top:0px;
left:870px;
width: 120px;
height:120px;
margin-top: 0px;
font-size: 11pt;
}

.connex a {
font-family: arial, sans-serif ;
color: #cc0000;
font-style: italic ;
font-weight: bold ;
text-decoration: none;
}

.connex a:hover {
color: #ffffff;
}

input.champ {
font-size: 0.7em;
}

select {
margin: auto; 
color: #000066;
width: auto;
}

.pub-img-120 {
margin:0;
margin-bottom:15px;
}

.pub-img-120 img{
border-width: 0px;
}

.pub {
display: block ;
margin-top:10px;
margin-bottom:10px;
margin-left:0px;
margin-right:0px;
padding:3px;
border-width: 2px;
border-style: solid;
border-color: rgb(51,102,153);
text-align:center;
color: #000066;
}

.pub2 {
display: block ;
margin-top:10px;
margin-bottom:10px;
margin-left:0px;
margin-right:0px;
padding:3px;
border-width: 2px;
border-style: solid;
border-color: rgb(0,102,0);
color: rgb(0,102,0);
font-style: italic ;
font-weight: bold ;
text-align:center;
}

.pub a {
color: #000066;
text-decoration:none;
}

.pub a:hover {
color: #ffffff;
}

.pub2 a {
color: #006600;
text-decoration:none;
}

.pub2 a:hover {
color: #ffffff;
}


/*------------------------------- */
/* PIED DE PAGE */

div#pied {
display: none;
}

div#pied2 {
margin: 0;
text-align: center;
}

div#pied2 a {
font-family: arial, sans-serif ;
color: rgb(0,102,0);
font-size: 10pt ;
font-style: italic ;
font-weight: bold ;
}

div#pied2 a:hover {
color: #ffffff;
}

/*------------------------------- */
/*--- CONTENU DES PAGES --------- */
/*------------------------------- */

/*--- LIENS --------- */

.lien-gras {
font-family: arial, sans-serif ;
color: #cc0000;
font-style: italic ;
font-weight: bold ;
font-size: 1em ;
text-decoration: none;
}
.lien-maigre {
font-family: arial, sans-serif ;
color: #cc0000;
font-style: italic ;
font-weight: 100 ;
font-size: 1em ;
text-decoration: none;
}
.lien-gras:hover, .lien-maigre:hover {
color: #ffffff;
text-decoration: none;
}

.lien-pub {
font-family: arial, sans-serif ;
font-size: 10pt ;
font-style: italic ;
font-weight: bold ;
}

.lien-pub:hover {
color: #ffffff;
}


/*--- BLOCS DE CONTENU --------- */

.bloc-div {				/* tableau bleu d'affichage du contenu, constitue d'un DIV (= double de .breve defini pour niou!) */
width: 682px ; 			/* contrairement aux tableaux, les div ont le padding et la bordure ý l'exterieur de leur largeur */
margin-bottom: 15px;
padding: 3px;
background-color: rgb(153,204,255) ;
border-width: 1px;
border-style: solid;
border-color: rgb(51,102,153);
text-align:center;
}

.bloc-table {			/* comme .bloc-div mais avec balises TABLE au lieu de DIV */
width: 690px ; 
margin-bottom: 15px;
padding: 3px;
background-color: rgb(153,204,255) ;
border-width: 1px;
border-style: solid;
border-color: rgb(51,102,153);
text-align:center;
}

.largeur-50-pour-100 {				/* attribut cree pour TD dans j-et-t.tpl */
width: 50% ; 
}

.table-auto {	/* Tableau dont les dimensions s'adaptent au contenu */
width: auto;    /* permet de fixer la largeur du tableau au minimum */
margin: auto;   /* permet de centrer le tableau dans son contenant */
padding: 0px;
border-width: 0;
}

.table-auto td {
padding: 3px;
}

.preferences-img {  /* tableau special pour les preferences d'affichage des images */
width: 300px;
margin: auto;  /* permet de centrer le tableau dans son contenant */
margin-top: 40px;
margin-bottom: 30px;
padding: 15px;
border-width: 2px;
border-style: dashed ;
border-color: rgb(51,102,153);
}

.ballon {
height: 800px;
}

/*--- TITRES --------- */

.h2-centre  {
font-family: Arial, sans-serif;
font-size: 1.5em;
color: #000066;
text-align:center;
margin-top:0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
}

.h2-centre-ss-marge  {
font-family: Arial, sans-serif;
font-size: 1.5em;
color: #000066;
text-align:center;
margin:0;
}

.h2-centre-ss-marge-lien  {
font-family: Arial, sans-serif;
font-size: 1.5em;
text-align:center;
margin:0;
}

.h3-centre  {
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
text-align:center;
margin-top:0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
}

/*--- TEXTE --------- */

p {	/* = texte_normal */
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
text-indent: 0px;
text-align:justify;
margin-top:0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
}

.txt-gauche  {
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
text-indent: 0px;
text-align:left;
margin-top:0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
}

.txt-droite  {
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
text-indent: 0px;
text-align:right;
margin-top:0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
}

.txt-justifie  {	/* = texte_normal */
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
text-indent: 0px;
text-align:justify;
margin-top:0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
}

.txt-centre  {
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
text-indent: 0px;
text-align:center;
margin-top:0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
}

.liste {
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
margin-left:55px;
margin-right:20px;
margin-top:5px;
margin-bottom:5px;
text-align:left;
}

.item {
font-family: Arial, sans-serif;
font-size: 1em;
color: #000066;
text-align:justify;
margin-left:0px;
margin-right:0px;
margin-top:0px;
margin-bottom:5px;
}

.gras {
font-weight: bold;
}

.relief {		/* vert gras */
color: rgb(0,102,0);
font-weight: bold;
}

.relief2 {		/* rouge sombre gras */
color: #993366;
font-weight: bold;
}

.cache {
display:none;
}

/*--- INFOBULLES --------- */

a.info{
position:relative;
/* margin-left:5px;
margin-right:5px; */
z-index:24;
/* color:#000; */
color: #cc0000;
text-decoration:none
}

a.info:hover{
background:none;
color: #ffffff;
z-index:25;
/* background-color:#FFF */
}

a.info span{
display: none;
}

a.info:hover span{
display:block;
position:absolute;
top:2em; left:-6em; width:15em;
border:1px solid #000;
background-color:#f4f5e0;
color:#000;
text-align: justify;
/* font-weight:none; */
padding:5px;
}

.bulle {
display:block;
position:absolute;
border:1px solid #000;
background-color: rgb(51,153,255) ;
top:160px;left:450px;width:320px;
color:#000;
text-align: justify;
/* font-weight:none; */
padding:5px;
}

/*--- IMAGES --------- */

#thepic {
border-width: 5px;
border-style: solid;
border-color: white;
margin-left:15px;
margin-right:15px;
}

.imagette {
text-decoration: none;
border-width: 3px;
border-style: solid;
border-color: white;
}

.img-droite {
float:right;
margin-top: 0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
text-decoration: none;
border-width: 4px;
border-style: solid;
border-color: white;
}

.img-gauche {
float:left;
margin-top: 0px;
margin-bottom:10px;
margin-left:20px;
margin-right:20px;
text-decoration: none;
border-width: 4px;
border-style: solid;
border-color: white;
}

.img-centre {
margin-top: 0px;
margin-bottom:10px;
margin-left:8px;
margin-right:8px;
text-decoration: none;
border-width: 4px;
border-style: solid;
border-color: white;
}

/* ----------------------------*/
/* Pages Message  */

table.table_messages {
width:690px;
border-width:1px;
border-style:solid;
border-collapse: collapse;
background-color:rgb(153,204,255);
font-family: Arial, sans-serif;
font-size: 0.75em;
color: #000066;
text-align:center;
}

table.table_messages th {
border: 1px solid ;
border-color: #000066;
padding:2px;
font-size:1.2em;
color: rgb(0,102,0);
}

/*
table.table_messages tr {
background-color: rgb(153,204,255);
margin:2px;
}
*/


table.table_messages .non_lu {
color: #993366;
}

table.table_messages td {
margin:12px;
padding:3px;
border: 1px solid ;
border-color: #000066;
}

.table_messages .nom {
width:25%;
}

.table_messages .date {
width:20%;
}

.table_messages .select {
width:3%;
}

div#contenu .table_messages a {
font-size: 1em;
color: #000066;
}

div#contenu .table_messages a:hover {
font-size: 1em;
color: #ffffff;
}

ul.menu_club {
font-family: Arial, sans-serif;
color: #000066;
list-style-type: none;
width: 100%; /* precision pour Opera */
margin-top:0px;
margin-bottom:5px;
margin-left:auto;
margin-right:auto;
text-align: center;
}

div#contenu ul.menu_club li {
display:inline;
font-size: 11pt;
margin-left:5px;
margin-right:5px;
}

div#contenu2 ul.menu_club li {
display:inline;
font-size: 11pt;
margin-left:5px;
margin-right:5px;
}

div#contenu ul.statut {
width: 450px;
height: 150px;
margin-top:20px;
margin-bottom:40px;
text-align:left;
color: #000066;
}

div#contenu ul.statut li  {
color: #000066;
margin-left:35px;
margin-right:10px;
margin-top:5px;
margin-bottom:15px;
}