/****************************************************************/
/* 1. IMPORT DES FEUILLES DE STYLES */
/****************************************************************/

/* Import de la feuille de styles de base */
@import url(imports/base.css);
/* Import du thème de couleur */
@import url(imports/Yishan_cs.css);


/****************************************************************/
/* 2. PARAMETRES DU TEXTE */
/****************************************************************/

/* 2.1 Ceci fixe la famille de police par défaut */
.pun, .pun INPUT, .pun SELECT, .pun TEXTAREA, .pun OPTGROUP {
    font-family: Georgia, "Times New Roman", Times, serif
}

.pun H3, .pun H4 {font-family: "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif; }

.pun {font-size: 12px; line-height: 160%}
.pun th {line-height: normal}

/* iewin font size only - to allow iewin to zoom. do not remove comments \*/
* html .pun {font-size: 72.75%}
/* end ie win font size */

/* Règle la taille de la police pour ces tableaux parce que IE l'exige */
.pun TABLE, .pun INPUT, .pun SELECT, .pun OPTGROUP, .pun TEXTAREA, DIV.postmsg P.postedit {font-size: 1em}

/* 2.2 Règle la taille de la police pour le texte préformaté c.-à-d. dans des boîtes de code */
.pun PRE {font-family: monaco, "Bitstream Vera Sans Mono", "Courier New", courier, monospace}

/* 2.3 Taille de police pour des titres */
.pun H2 {font-size: 1.3em;}
.pun H3 {font-size: 1.2em;}
.pun H4 {font-size: 1.1em;}

TD.tcl H3, DIV.forminfo H3 {font-size: 1.2em;}

/* 2.4 texte plus gros pour les objets particuliers */
DIV.postmsg P {line-height: 1.4}
DIV.postleft DT {font-size: 1.1em}
.pun PRE {font-size: 1.2em}

/* 2.5 texte en gras */
.pun H2, DIV.postleft DT, DIV.postmsg H4, TD.tcl H3, DIV.forminfo H3, P.postlink, DIV.linkst LI,
DIV.linksb LI, DIV.postlinksb LI, .blockmenu LI, #brdtitle H1, .pun SPAN.warntext, .pun P.warntext {font-weight: bold}

/* 2.6 Réglage du texte de l'entête */
#brdtitle {
	text-align: center;
}
#brdtitle H1 {
	margin-top: 10px;
	font-size: 2em;
	line-height: 1.4em;
	font-weight: normal;
	text-transform: uppercase;
	letter-spacing: .2em;
}
#brdtitle P {
	margin-bottom: 10px;
	font-family: "Trebuchet MS", Trebuchet, Arial, Helvetica, sans-serif;
	font-size: 1em;
	text-transform: uppercase;
	letter-spacing: .2em;
}

/****************************************************************/
/* 3. LIENS */
/****************************************************************/

/* 3.1 Enlève le soulignement pour les liens en en-tête, les liens et les menus verticaux */
.blockpost DT A:link, .blockpost DT A:visited, .blockpost H2 A:link,
.blockpost H2 A:visited, .postlink A:link, .postlink A:visited, .postfootright A:link, .postfootright A:visited,
.blockmenu A:link, .blockmenu A:visited {
    text-decoration: none
}

/* 3.2 Souligne au passage de la souris (ou hover en anglais) pour des liens dans les en-têtes et dans le menu principal */
.blockpost H2 A:hover {text-decoration: underline}


/****************************************************************/
/* 4. LARGEUR ET MODÈLE DE BORDURE */
/****************************************************************/

/* 4.1 Par défaut les bordures sont solides (forment un trait plein) et font 1 pixel */
DIV.box, .pun TD, .pun TH, .pun BLOCKQUOTE, DIV.codebox, DIV.forminfo, DIV.blockpost LABEL {
    border-style: solid;
    border-width: 1px;
	border-top: none;
	border-left: none;
}

#puntal_sidebar DIV.box {
	border: none;
}


/* 4.3 Bordures pour les cellules des tableaux */
.pun TD, .pun TH {
    border-bottom: none;
    border-right: none
}

.pun .tcl {
	border-left: none
}

/* 4.4 Réglage spécial pour les fieldsets afin de prévenir les défauts d'IE */
DIV>FIELDSET {
    border-style: solid;
    border-width: 1px
}

/* 4.5 Bordure spécifiques à l'entete et au pied de page*/
DIV#brdheader, DIV#brdtitle, DIV#brdwelcome, DIV#brdfooter {
    border-style: solid;
    border-width: 1px;
}

DIV#brdheader DIV.box, DIV#userbox DIV.box, DIV#brdfooter DIV.box {
	border: none; /* on retire les bordures */
}

/****************************************************************/
/* 5. ESPACEMENT VERTICAL ET DE LA PAGE */
/****************************************************************/

/* 5.1 Marge des pages */

HTML, BODY {margin: 0; padding: 0}
#punwrap {margin:12px 20px}

/* 5.2 Crée un espace vertical entre les éléments du tableau de bord (marges) */
DIV.blocktable, DIV.block, DIV.blockform, DIV.block2col, #postreview {margin-bottom: 12px}
#punindex DIV.blocktable, DIV.blockpost {margin-bottom: 6px}
DIV.block2col DIV.blockform, DIV.block2col DIV.block {margin-bottom: 0px}

/* 5.3 Supprime l'espace au-dessus des breadcrumbs (infos qui indiquent l'emplacement exact d'une page au sein d'une arborescence) et des liens qui ont une marge supérieure négative */
DIV.linkst, DIV.linksb {margin-top: -12px}
DIV.postlinksb {margin-top: -6px}

/* 5.4 Mets un espace de 12px au-dessus de la boîte d'information du forum sur la page d'index parce que les tableaux de catégorie ont un espace de seulement 6px sous eux  */
#brdstats {margin-top: 12px}


/****************************************************************/
/* 6. ESPACEMENT AUTOUR DU CONTENU */
/****************************************************************/

/* 6.1 Remplissage par défaut des éléments principaux */
DIV.block DIV.inbox, DIV.blockmenu DIV.inbox {padding: 3px 6px}
.pun P, .pun UL, .pun DL, DIV.blockmenu LI, .pun LABEL, #announce DIV.inbox DIV {padding: 3px 0}
.pun H2 {padding: 4px 6px}

/* 6.2 Espacement spécial pour divers éléments */
.pun H1 {padding: 3px 0px 0px 0}
#brdtitle P {padding-top: 0px}
DIV.linkst {padding: 8px 6px 3px 6px}
DIV.linksb, DIV.postlinksb {padding: 3px 6px 8px 6px}
#brdwelcome, #brdfooter DL A, DIV.blockmenu LI, DIV.rbox INPUT  {line-height: 1.4em}
#viewprofile DT, #viewprofile DD {padding: 0 3px; line-height: 2em}

/* 6.4 Crée un espacement horizontal pour divers éléments */
DIV.rbox INPUT, DIV.blockform P INPUT  {margin-right: 12px}

/* 6.5 Espacement entre les deux boites de l'entête */
DIV#brdtitle {
	margin: 5px;
}


/****************************************************************/
/* 7. ESPACEMENT POUR LES TABLEAUX */
/****************************************************************/

.pun TH, .pun TD {padding: 4px 6px}
.pun TD P {padding: 5px 0 0 0}


/****************************************************************/
/* 8. ESPACEMENT POUR LES POSTS */
/****************************************************************/

/* 8.1 Remplissage autour des colonnes gauches et droites dans viewtopic */
DIV.postleft DL, DIV.postright {padding: 6px}

/* 8.2 Espacement supplémentaires pour contacter le posteur et pour son avatar */
DD.usercontacts, DD.postavatar {margin-top: 5px}
DD.postavatar {margin-bottom: 5px}

/* 8.3 Espacement supérieur supplémentaire pour les signatures pour "édité par" */
DIV.postsignature, DIV.postmsg P.postedit {padding-top: 15px}

/* 8.4 Espacement pour les boîtes de code et de citation */
DIV.postmsg H4 {margin-bottom: 10px}
.pun BLOCKQUOTE, DIV.codebox {margin: 5px 15px 15px 15px; padding: 8px}

/* 8.5 Remplissage pour les liens d'action (ex : Poster une réponse) et l'indicateur en ligne dans viewtopic */
DIV.postfootleft P, DIV.postfootright UL, DIV.postfootright DIV {padding: 10px 6px 5px 6px}

/* 8.6 Ceci est l'entrée visuelle des modérateurs pour supprimer plusieurs sujets */
DIV.blockpost INPUT, DIV.blockpost LABEL {
    padding: 3px;
    display: inline
}

P.multidelete {
    padding-top: 15px;
    padding-bottom: 5px
}

/* 8.7 S'assure que les paragraphes dans des posts n'obtiennent aucune remplissage */
DIV.postmsg P {padding: 0}


/****************************************************************/
/* 9. ESPACEMENT SPECIAL POUR LES FORMULAIRES */
/****************************************************************/

/* 9.1 Remplissage autour des champs */
DIV.blockform FORM, DIV.fakeform {padding: 20px 20px 15px 20px}
DIV.inform {padding-bottom: 12px}

/* 9.2 Remplissage à l'intérieur des champs */
.pun FIELDSET {padding: 0px 12px 0px 12px}
DIV.infldset {padding: 9px 0px 12px 0}
.pun LEGEND {padding: 0px 6px}

/* 9.3 Pour la boîte d'information au dessus du formulaire d'enregistrement et ailleurs */
DIV.forminfo {
    margin-bottom: 12px;
    padding: 9px 10px
}

/* 9.4 Liens d'aide de BBCode sous les formulaires de post */
UL.bblinks LI {padding-right: 20px}

UL.bblinks {padding-bottom: 10px; padding-left: 4px}

/* 9.5 Positionnement horizontal pour le bouton d'envoi des formulaires */
DIV.blockform P INPUT {margin-left: 12px}


/****************************************************************/
/* 10. INDICATEURS DE STATUTS DES POST */
/****************************************************************/

/* 10.1 Ce sont les indicateurs de statut des post, qui apparaissent à gauche de quelques tableaux : .inew = nouveaux posts, .iredirect = forums de redirection, .iclosed = sujets fermés et .isticky = sujets épinglés.  Par défaut seul .inew est différent du défaut. */
DIV.icon {
    FLOAT: left;
    margin-top: 0.1em;
    margin-left: 0.2em;
    display: block;
    border-width: 0.6em 0.6em 0.6em 0.6em;
    border-style: solid
}

DIV.searchposts DIV.icon {margin-left: 0}

/* 10.2 La class .tclcon est une division à l'intérieur de la première colonne des tableaux qui ont des indicateurs de statuts de posts.  La marge crée l'espace pour les indicateurs de statuts de posts */
TD DIV.tclcon {margin-left: 2.3em}


/****************************************************************/
/* 11. STYLES SPECIFIQUES AU MODELE PUNTAL */
/****************************************************************/

/* En-tete / header */
p#prelude {
	text-indent: -2000px;
}

/* Colone à droite / Column on right */
div#puntal_main {
	width: 100%;
	float: left;
	margin-right: -17em;
	}
div#puntal_content {
	margin-right: 18em;
	padding-right: 1ex;
	}
div#puntal_sidebar {
	width: 17em;
	float: right;
	}

/* Listes colone latérale / Lateral column list */
div#puntal_sidebar li {
	padding-top: 0.2em;
	padding-bottom: 0.2em;
}

/* Titre et infos news / Title & infos news */
h2.news span a { text-decoration: none; }
p.infos{ text-align: right; }

/* Bouton RSS / RSS buton */
a.rss:link, a.rss:visited, a.rss:active {
	color: #fff;
	background: #f90;
	border: 1px outset #f90;
	text-decoration: none;
	padding: 0.1em 0.3em;
	font-size: 85%;
}
a.rss:hover {
	color: #fff;
	border: 1px inset #f90;
}

/* Sous-menu téléchargements / Downloads sub-menu */
#sousmenu ul, #sousmenu li {
	list-style-type: none;
	display: inline;
}
#sousmenu li { margin-right: 12px; }
#sousmenu a:link, #sousmenu a:visited{ text-decoration: none; }
#sousmenu a:hover { text-decoration: underline; }

/* Boite bloc édito / Edito block box */
#editobox div.box { border-width: 1px; }
#editobox div.box p {
	line-height: 150%;
	letter-spacing: 0.08em;
}

/* Boite bloc RSS reader / RSS reader block box */
#rssreaderBox h3 {
    margin-top: 1em;
    font-weight: bold;
}


/* Lexique */
div.lexique dt {
	margin-top: 1em;
}

/* Barre statut MP */
div#mp_bar_ext {
	border: 1px solid #ccc;
	width: 100px;
	height: 10px;
	text-align: left;
}
div#mp_bar_int {
	background-color: #ccc;
	height: 10px;
}

.nombre {
	font-family: Verdana, Arial, Helvetica, sans-serif;
}