/****************************************/
/* auteur: SamRay1024
/* theme jebulle version 1
/* Date de cr�ation: 17/02/2004
/* Derni�re MAJ : 20/03/2004
/* Bubulles Cr�ations - jebulle.net
/****************************************/

/* pour toute la page */
* {
    font-family: verdana, arial, sans-serif;
    color: #000000;
    font-size: 95%;
}

/* balise body */
body {
    background-color: #7A82C0;
    margin: 0px;
    padding: 0px;
    text-align: center; /* centrage sous IE */
}

a {
    text-decoration: none;
    font-size: 100%;
}

a:hover {
    text-decoration: none;
    font-weight: bold;
    color: #993300;
}

/* cadre du site hors pied de page */
#site {
    padding: 0px;
    margin: auto;  
    width: 803px;
    padding-bottom: 60px;
}

    #site hr {
        clear: both;
        width: 100%;
        visibility: hidden;
    }

/**/
/* classes associ�es � l'entete du site avec les boutons */
/**/

/* entete de page - logo */
#entete	{
    background-image: url(images/entete.jpg);
    background-repeat: no-repeat;
    height: 103px;
    width: 803px;
    margin: auto;
    padding: 0px;
    text-align: left;	/* remet le menu g�n�ral � droite sous IE (a cause du text-align center general pour le centrage sous IE */
}
    /* placement du menu g�n�ral dans l'entete (superposition sur l'image) */
    #entete .boutons {
        position: absolute;
        margin: 0px;
        padding: 0px;
        margin-left: 54px;
        margin-top: 81px;
    }

        /* texte des boutons */
        #entete .boutons h4 {
            margin: 0px;
            padding: 0px;
            font-weight: normal;
            font-size: 80%;	
        }
    
    /* design bouton gauche */
    #entete .boutons .boutond {
        float: left;
        background-image: url(images/bouton_gauche.jpg);
        background-repeat: no-repeat;
        width: 95px;
        height: 22px;
        margin: 0px;
        padding: 0px;
        padding-top: 4px;
        text-align: center;
    }

    /* design boutons centraux */
    #entete .boutons .bouton {
        float: left;
        background-image: url(images/bouton.jpg);
        background-repeat: no-repeat;
        width: 85px;
        height: 22px;
        margin: 0px;
        padding: 0px;
        padding-top: 4px;
        text-align: center;
    }
       
    /* design bouton droit */     
    #entete .boutons .boutonf {
        float: left;
        background-image: url(images/bouton_droit.jpg);
        background-repeat: no-repeat;
        width: 89px;
        height: 22px;
        margin: 0px;
        padding: 0px;
        padding-top: 4px;
        text-align: center;
    }
    
        /* survol des boutons */
        #entete .boutons .boutond:hover, .bouton:hover, .boutonf:hover {
            position: relative;
            top: 1px;
        }	

/* FIN ENTETE */
/**/

/**/
/* classes associ�es aux menus */
/**/

/* conteneur global qui contient tous les menus */
#menus {
    float: left;
    margin: 0px;
    padding: 0px;
    margin-top: 5px;	/* decale vers le bas pour aligner le titre sur le titre des news */
    font-size: 100%;
    text-align: left;	/* n�cessaire pour se replacer � gauche � cause du centrage sous IE */
}

    /* conteneur d'un seul menu */
    #menus .menu {
        margin-top: 10px;	/* espace les menus de 10px sur la hauteur */
        padding: 0px;
    }
    
        /* titre d'un menu */	
        #menus .menu .menuTitre {
            background-image: url(images/menu_entete.jpg);
            background-repeat: no-repeat;
            width: 182px;
            height: 19px;
            margin: 0px;
            padding: 0px;   
        }
	
        /* permet de d�caler le texte du titre sans padding qui pose probl�me entre IE et mozilla */	
      	#menus .menu h4 {
            margin: 0px;
            padding: 0px;
            margin-left: 35px;
        }
	 
        /* classe sp�ciale pour le logo de l'hebergeur pour centrer */
        #menus .menu .webdy {
            background-image: url(images/menu_corps.jpg);
            background-repeat: repeat-y;
            margin: 0px;	
            padding: 0px;
            text-align: center;
        }
        
        /* enl�ve le border de l'image */
        #menus .menu .webdy img {
            border-width: 0px;
        }

        /* configuration de la liste */
        #menus .menu ul {
            background-image: url(images/menu_corps.jpg);
            background-repeat: repeat-y;
            margin: 0px;	
            padding: 0px;
        }      
        
        /* configuration des elements de la liste */
        #menus .menu li {
            text-align: left;
            margin: 0px;
            padding: 0px;
            margin-left: 9px;
            list-style: none;
        }
    
            #menus .menu li a:hover{
                position: relative;
                left: 1px;
            }
           
        /* pied du menu */		
        #menus .menu .pied {
            background-image: url(images/menu_pied.jpg);
            background-repeat: no-repeat;
            margin-left: 1px;
        }
/**/

/**/
/* Cadres des news */
/**/

/* conteneur des news */
#articles {
    float: right;
    margin: 0px;
    padding: 0px;
    font-size: 100%;
    text-align: left;
}

/* news */
#articles .article {
    margin-top: 10px;
    padding: 0px;
}
	
/* entete de la news */
#articles .article .newsEntete {
    background-image: url(images/news_entete.jpg);
    background-repeat: no-repeat;
    width: 608px;
    height: 34px;
    margin: 0px;
    padding: 0px;
}
        
/* classe pour les news r�centes (seule l'image change) */
#articles .article .newsREntete {
    background-image: url(images/news_recente_entete.jpg);
    background-repeat: no-repeat;
    width: 608px;
    height: 34px;
    margin: 0px;
    padding: 0px;
}
            
/* texte dans l'entete de news (date & auteur) */
#articles .article .newsEntete h3, .newsREntete h3 {
    font-weight: normal;		
    font-size: 90%;
    margin: 0px;
    padding: 0px;
    margin-left: 60px;
    padding-top: 7px;
}
            
/* corps de la news (titre + texte) */
#articles .article .newsCorps {
    background-image: url(images/news_corps.jpg);
    background-repeat: repeat-y;
    width: 608px;
    margin: 0px;
    padding: 0px;
}

/* contenu */
#articles .article .newsCorps .newsText {
    width: 568px;
    text-align: justify;
    margin-left: 20px;
    margin-right: 20px;
    padding: 0px;
    padding-bottom: 10px;
}

/* titre */
#articles .article .newsCorps .newsText h2 {
    margin: 0px;
    padding: 0px;
    position: relative;
    height: 52px;
    line-height: 44px;
    border-bottom:	1px dotted black;
    font-size: 13px;
}

/* image rubrique dans le titre */
#articles .article .newsCorps .newsText h2 img {
	position: absolute;
	right: 0px;
}

    
/* texte */
#articles .article .newsCorps .newsText p {
    font-size: 100%;
	text-align: justify;
}
			
#articles .article .newsPied {
    background-image: url(images/news_pied.jpg);
    background-repeat: no-repeat;
    width: 608px;
    height: 8px;
    margin: 0px;
    margin-left: 5px;
    padding: 0px;
}
            
#articles .article .newsCorps .newsText .artSrces {
	margin: 0px;
	padding: 2px;
	margin-top: 10px;
	background-color: #bbf;
	border: 1px dotted #7A82C0;
	font-size: 100%;
}

/* liens de navigation dans les archives */
#navigation {
    font-size: 80%;
    text-align: center;
}
/**/

/**/
/* conteneur des commentaires */
/**/

/* le conteneur qui contient tous les commentaires */
#commentaires {
	margin-left: 5px;
	padding: 10px;
	background-color: #bec2e2;
	border: 1px solid #000;
	width: 592px;
}

/* hack pour IE (cette merde...) */
html>body #commentaires {
  width: 570px;
}

/* le titre du conteneur qui contient tous les commentaires */
#commentaires h2 {
	margin: 0px;
	padding: 0px;
	text-align: center;
	margin-bottom: 7px;
}

/* le conteneur d'un commentaire */
#commentaires .commentaire {
	margin: 0px;
	padding: 0px;
	padding-bottom: 5px;
}

/* l'entete d'un commentaire */
#commentaires .commentaire .comTete {
	margin: 0px;
	padding: 5px;
	background-color: #bbf; 
	border: 1px solid #000;
}

/* le corps d'un commentaire */
#commentaires .commentaire .comCorps {
	margin: 2px 0px 0px 0px;
	padding: 5px;
	background-color: #ccf;
	border: 1px dotted #000;
}

/* le texte du contenu d'un commentaire */
#commentaires .commentaire .comCorps p {
	margin: 0px;
	padding: 0px;
}

/* le conteneur du formulaire d'ajout de commentaire */
#formComment {
	margin: 5px;
	padding: 10px 50px 10px 50px;
	border: 1px solid #000;
	background-color: #bec2e2;
	text-align: center;
	width: 592px;
}

/* hack pour IE (cette merde...) */
html>body #formComment {
  width: 490px;
}

#formComment .champs {
    text-align: left;
    width: 100%;
}

#formComment textarea, .cadreEdit {
	width: 100%;
	border: 1px solid #aaa;
}

#formComment textarea:focus, .cadreEdit:focus {
	border: 1px solid #000;
}

/**/

/**/
/* classe du pied de page */
/**/
#pied {
    clear: both; 
    background-image: url(images/pied.jpg);
    background-repeat: no-repeat;
    width: 803px;
    height: 31px;
    text-align: center;
    font-size: 80%;
    margin: auto;
    padding: 0px;
}

    #pied p {
        margin: 0px;
        padding: 0px;
        padding-top: 5px;
    }
    
/******************/
/* classes FAQ          */
/******************/

.reponse {
	padding: 10px;
	background-color: #bbf;
	border: 1px dotted #7A82C0;
}

/* informations importantes (erreurs, ...) */
.important {
    font-family: Verdana;
    font-weight: normal;
    font-size: 12px;
    color: #FF0000;
    margin: 10px;
}

/* texte des op�rations r�ussies */
.succes {
    font-family: Verdana;
    font-weight: normal;
    font-size: 12px;
    color: #00AA00;
    margin: 10px;
}

/* pour les images du gestionnaire d'erreur */
.imageDebug {
    vertical-align: middle;
    border: 0px;
}

/* classe qui permet d'etirer un cadre malgre un contenu en flottant */
.spacer {
	clear: both;
}

/* classe d'affichage des images sans bordure */
.image {
	border: 0px;
	vertical-align: middle;
}

/* classe d'affichage des images avec bordure */
.imageBorder {
	border: 1px solid #000;
	vertical-align: middle;
	margin-bottom: 2px;
}

/* images des rubriques */
.imageRub {
	border: 1px solid #000;
	vertical-align: middle;
}

/* classe de la balise de citation de texte */
cite {
	display: block;
	margin: 5px 15px 5px 15px;
	padding: 15px 15px 15px 15px;
	background-color: #ccccdf;
	border: 1px solid #777;
	font-style: italic;
}

/* classe de la balise de code */
code {
	display: block;
	margin: 5px 15px 5px 15px;
	padding: 15px 15px 15px 15px;
	background-color: #ccccdf;
	border: 1px solid #777;
	color: #494;
}

/* fixe la largeur de la premiere colonne du formulaire d'ajout de commentaires*/
.col1 { width: 23%; }
.col2 {
	width: 77%;
}

/*********************************************************************
 * classes de presentation des images dans un article
 */

.gaucheSeule {
	clear: right;
	margin-bottom: 5px;
	border: 0px;
}

.gauche {
	float: left;
	margin: 0px 10px 5px 0px;
	border: 0px;
}

.centre {
	text-align: center;
	border: 0px;
}

.droiteSeule {
	clear: left;
	text-align: right;
	margin: 0px 0px 5px 5px;	
	border: 0px;
}

.droite {
	float: right;
	margin-left: 10px;
	border: 0px;
}

/*
 * Image trop cool pour IE
 */
a#tooCool {
	position: fixed;
	right: 0;
	bottom: 0;
	display: block;
	height: 80px;
	width: 80px;
	background: url(images/too_cool_corner_fr.png) bottom right no-repeat;
	text-indent: -1000em;
	text-decoration: none;
}

a#tooCool:hover { font-weight: normal; }