@charset "UTF-8";

/******************************************************************************************************/

/* Dans ce fichier, j'ai comparé et groupé les styles communs à ces 2 CSS de RESET : Yahoo + Steaw    */

/******************************************************************************************************/





/******************************************************************************************************/

/* Yahoo RESET */

/******************************************************************************************************/

html{color:#000; background:#FFF;}

body,div,/**/dl,dt,dd,/*ul,ol,li,*/h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,table,td,th{margin:0; padding:0;}

/*li{margin-left:2.5em;}*//* en 2% : bien pour l'alignement des puces */

ul,ol{margin-top:0; margin-bottom:0;}/* Je vais plutôt enlever simplement les marges par défaut qui sont "en trop" */

/*	>>> Steaw ne le fait pas pour : button,select */

table{border-collapse:collapse; border-spacing:0;}/* border:none; >> déjà trop spécifique */

td,th{empty-cells:show;}

fieldset,img{border:0;}

/*	>>> A adapter spécifiquement : fieldset{border:1px solid #F88; margin:20px; padding:10px;}*/

/*address,button,caption,cite,code,dfn,em,input,optgroup,option,select,strong,textarea,th,var{font:inherit;}*/

  address,button,caption,cite,code,dfn,   input,optgroup,option,select,       textarea,th,var{font:inherit;}

/*	>>> Steaw fait plus simple (trop?) :

  address       ,caption,cite,code,dfn                                                   ,var{font-style:normal; font-weight:normal;}

	>>> Et je pense qu'il a raison CAR autant utiliser le style par défaut de ces balises qui sont bien faites pour cela !

	>>> Notamment :

 	   >> Ne pas reseter le style des em & strong : sinon on devra le redéfinir complêtement !

	   >> IDEM pour les styles des balises suivantes :

del,ins{text-decoration:none;}

sup,sub{vertical-align:baseline;}

	   >> Par contre, comme souvent, il conviendrait d'adapter à la charte graphique leur style par défaut : par exemple : */

del{text-decoration:line-through; color:#DDD;}

ins{text-decoration:blink; color:#DD0;}

sup,sub{line-height:0;}/* FIX : to force the line height to be "normal" (et non pas agrandie à cause de ces 2 élts qui dépassent naturellement de la ligne) */

mark{background-color:#F99;}

/*

	>>> Yahoo le fait directement sur les éléments de liste :

li{list-style:none;}

	>>> Steaw le fait sur les listes (il compte donc sur l'héritage des li pour que ça s'applique) :

ul,ol{list-style:none;}

	>>> MAIS je trouve ça bizarre d'enlever par défaut les puces/numéros des listes (ordonnée ou non) !

	>>> DONC j'enlève tous les RESETs associés qu'ils avaient faits sur les listes : cf. ul,ol,li (mais PAS sur les dl,dt,dd CAR ces listes n'ont pas de puces) */

caption,th{text-align:left;}

/*

h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}

	>>> IDEM ici aussi : autant définir leur style spécifiquement à la charte graphique (ce reset ne sert donc pas à grand chose) */

h1,h2,h3,h4,h5,h6{font-family:Arial,Helvetica,sans-serif; color:#D00; font-weight:normal;}

	h1{font-size:44px;}

	h2{font-size:34px;}

	h3{font-size:26px;}

	h4{font-size:20px;}

	h5{font-size:16px;}

	h6{font-size:14px;}

q:before,q:after{content:'';}/* citation courte + inline + incluse entre 2 guillemets (") par défaut */

/*abbr,acronym{border:0; font-variant:normal;}*/

abbr,acronym{border:0; border-bottom:1px dotted; border-color:inherit; font-variant:normal;}

/* Par défaut : border-bottom:1px dotted; >> ce qui sera souhaitable ds la plupart des utilisations (car c'est ce qui symbolisera que c'est bien une abréviation ou un acronyme)

     >> Je trouve donc qu'on perd le sens de ces 2 balises si on supprime ce soulignement en pointillé !

	 >> Par contre, ça peut être l'occasion de définir la couleur qu'on veut pour ce soulignement en pointillé ! */

legend{color:#000;}/* because legend doesn't inherit in IE */

/******************************************************************************************************/





/******************************************************************************************************/

/* Steaw RESET et son CSS de base (à adapter si besoin) */

/******************************************************************************************************/

/* Le socle commun */

/*	La plupart des propriétés qui lui sont appliquées sont transmises à ses descendants

	Par contre, certaines balises n'héritent pas du body. Il faut alors redéfinir ces mêmes valeurs pour d'autres sélecteurs. */

body{background:#fff;}

/* line-height : LA meilleure solution est de la définir en "number value" (=valeur sans unité) : entre 1.2 (valeur normale) et 1.5 (valeur recommandée) */

body,button,input,select,textarea{font-family:Arial,Helvetica,sans-serif; font-size:12px; line-height:1.2; color:#333;}

button,input,select,textarea{vertical-align:middle;}/* solution pb. d'alignement */



/* Balise nécessaire en HTML5 */

/*

header{background:url(body.png) repeat center top; border-bottom:1px solid #eee; display:block; padding:40px 0; text-align:center; text-shadow:0 1px white;}

>>> Style à redéfinir selon le besoin ! (Il n'est pas forcément nécessaire de le redéfinir dans tous les cas, notamment pour tous les TAG header !)

*/



/* Les liens */

/* cursor:pointer => utile pour les cas où il ne s'affiche plus */

/* color:#cf3529 => définit une couleur par défaut pour les liens : 2 points de vue possible :

	 > soit on voit cela nécessaire afin de garantir le respect par tous les liens de leur couleur définie dans la charte graphique >>> Ce qui est le CAS GENERAL !!!

	 > soit cela parait gênant quand on souhaiterait plutôt qu'ils prennent la couleur du texte qui le contient >>> CAS trés spécifique à mon avis !!! */

a{cursor:pointer; text-decoration:none; color:#f00;}

/*a{cursor:pointer; text-decoration:underline; position:relative;}*/

/* => c'est ce qu'il utilise en réel + avec : */

/*a:active{top:1px;}*//* afin de créer un décalage lors du choix du lien (marche avec position:relative) */

/*a:visited{color:#0f0;}*//* pas indispensable (pour les menus notamment) mais peut s'avérer pratique */

a:hover{text-decoration:underline;}



/* Des classes utilisées à foison */

.wrap{margin:0 auto; position:relative; width:980px;}/* pour centrer un bloc */

/*.wrap{margin:0 auto; min-width:800px;}*//* => c'est ce qu'il utilise en réel */

.cl,.cr,.cb{display:block !important; float:none !important; height:0 !important;}

.cl{clear:left;}

.cr{clear:right;}

.cb{clear:both;}

/******************************************************************************************************/