/*  */
/* Les styles qui suivent correspondent aux styles utilisés dans la quasi-totalité des différents sites web que j'ai développés */
/* Ces différents styles sont agrégés ici pour des raisons de facilité de maintenance */
/* La légèreté relative de l'ensemble permet de n'utiliser qu'un fichier de base, même si ce fichier doit parfois être recopié en différents emplacements */
/* du fait de l'obligation, pour certains site, de faire référence à une feuille de style interne au site (et non seulement une feuille en ligne */
/* Dans le cas d'ajout de styles nouveaux, il convient donc de mettre à jour l'ensemble des feuilles de style jumelles en ligne et hors ligne */
/* Par priorité, on peut considérer que la feuille présente dans emmanueldion.com/styles/style1.css est l'instance la plus officielle et la plus urgente à maintenir */
/*  */

 
/*  Styles de base   */

body {color: black; background-color:white; font: 100%; font-family: Optima, Palatino, serif; max-width:535px; margin-left: auto; margin-right: auto; text-align:justify;}

h1,h2,h3,h4,h5,h6,.listeh3 {font-family: Futura, Helvetica, Arial, sans-serif}

h1 {font-family: , sans serif; color: black; text-align:center;font-size: 150%;font-weight:100;
 border-top:25px solid grey; padding-top: 20px; padding-bottom: 10px;}
h2 {color: black; text-align:left;font-size: 110%;font-weight:100;background-color: whitesmoke;
 border-top:1px solid black; border-left:0px;border-right:0px;border-bottom:1px solid grey; padding-top: 10px; padding-bottom: 10px; padding-left: 5px;padding-right: 5px; margin-top: 50px;}
h3 {color: black; text-align:left;font-style:italic;font-size: 100%;font-weight:120}
h4 {color: black; text-align:left;font-style:italic;font-size: 100%;font-weight:100}
 

 
/*  Styles supplémentaires   */
.citationsurparagraphe {padding-left:15%;font-size: 80%}
.epigraphe {font-style:italic; font-size: 80%; padding-left:0%; margin:40px;}
.date {text-align:right;font-size: 80%;margin-top: 50px;margin-bottom: 50px;}
.source {text-align:right;font-size: 80%;margin-top: 50px;margin-bottom: 50px;}
.liste1 {text-align:right;font-size: 80%;margin-top: 50px;margin-bottom: 50px;}
.listeh3 {color: black; text-align:left;font-style:italic;font-size: 100%;font-weight:bold; margin-top: -5px}
.listeh4 {color: black; text-align:left;font-size: 100%;font-weight:100; margin-top: -10px}
.image1 {text-align:center; margin-top: 30px}
.legende1 {text-align:center; font-size: 80%; margin-top: -5px}
.extrait1 {text-align:justify;color:grey; font-size: 80%;width:400px;;margin-left: 67px;}
.highlight1 {background-color: #FFFF33} 
.hidden1 {display:none}   

.intertitre1  {color: black; text-align:left;text-decoration: underline;font-size: 120%;font-weight:100}
.textecourt1  {color: black; text-align:left}
.minigauche{text-align:left;font-size: 80%;margin-top: 50px;margin-bottom: 50px;}


/*  Pour les articles  */
.articleh1 {color: black; text-align:center;text-transform :uppercase; font-size: 200%;font-weight:100;
 border-width:25px 0 0 0; border-style:solid; border-color:#464646;padding: 10px 0 3 0}
.articleh2  {color: black; text-align:center;text-transform :uppercase; font-size: 90%;font-weight:bold;background-color: #FBFBFB;
 border-width:1px 0 1 0; border-style:solid; border-color:#EAEAEA;padding: 8px 0 3 0}
.articlesource {font-style:italic; font-size: 80%}
.articlehighlight {background-color: #FFFFAA;line-height:1.3em;border-bottom:1px solid #FFFF00;font-size: 100%} 
.articlecommentsh1 {color: maroon; font-size: 120%; font-weight:bold;font-style:italic}
.articlecomments {color: maroon; font-style:italic}  


/*  Pour la table des matières  */
.retourtable {color: maroon; font-size:80%; text-align:center}  
.table0 {color: black; text-align:center;text-transform :uppercase; font-size: 200%;font-weight:100;
 border-width:25px 0 0 0; border-style:solid; border-color:#464646;padding: 10px 0 0 0}
.tableintro {color: black; text-align:center;font-style:italic;font-size: 100%;padding: 30px 0 0 0;}
.table1 {color: black; text-align:center;text-transform :uppercase; font-size: 120%;font-weight:bold;background-color: #FBFBFB;
 border-width:1px 0 1 0; border-style:solid; border-color:#EAEAEA;padding: 8px 0 3 0}
.table2 {color: black; text-align:center;text-transform :uppercase; font-size: 100%;font-weight:100; padding: 10px 0 10 0}
.table3 {color: black; text-align:center;font-style:italic;font-size: 100%;font-weight:bold; padding: 5px 0 5 0;}
.table4 {color: black; font-size: 90%;text-decoration:underline;font-weight:100; padding: 0px 0 0 80;}
.table5 {color: black; font-size: 80%}


/*  Gestion des liens   "^" signifie "commence par"   "$" signifie "finit par"    "*" signifie "contient quelque part" ; attention à conserver l'ordre  */
/*  Attention, les ":visited" et ":after"doit être collé au "]"sinon ils ne marchent pas  */
/*  De nombreux tests faits en janvier 2012 ont montré que certains navigateurs (IE et Chrome)
ne parvenaient pas à lire correctement les codes suivants: IE ignore les icones, et Chrome les confond pour les balises href*
et ne les passe pas en hyperliens. J'ai choisi de continuer en estimant que Firefox, Opera et Seamonkey
étaient plutôt en avance que l'inverse, mais d'insérer aussi dans chaque page web concernée
des caractères unicode visibles par tous les navigateurs pour être sûr que personne ne manque les liens  */


a[href^="http"]:after  {content: "";background: transparent url('external_link_icon.png') center no-repeat;padding-right: 24px;}
a[href*="wikipedia"]:after {content:"";background: transparent url('wikipedia_icon.png') center no-repeat;padding-right: 24px;}
a[href*="youtube"]:after {content:"";background: transparent url('youtube_icon.png') center no-repeat;padding-right: 24px;}
a[href*="dailymotion"]:after {content:"";background: transparent url('dailymotion_icon.png') center no-repeat;padding-right: 24px;}
a[href*="amazon"]:after {content:"";background: transparent url('amazon_icon.png') center no-repeat;padding-right: 24px;}
a[href^=".."] {color: darkred;text-decoration: none; border-bottom:1px dotted;}
a[href^=".."]:visited  {color: #762020;}
a[href^=".."]:after  {content: "";background: transparent url('internal_link_icon.png') center no-repeat;padding-right: 24px;}
a[href^="../../sources/videos/"]:after  {content: "";background: transparent url('internal_video_icon.png') center no-repeat;padding-right: 24px;}
a[href^="../../sources/audio/"]:after  {content: "";background: transparent url('internal_audio_icon.png') center no-repeat;padding-right: 24px;}
a[href^="../../sources/textes/"]:after  {content: "";background: transparent url('document_icon.png') center no-repeat;padding-right: 24px;}
a[href$=".pdf"]:after {content:"";background: transparent url('pdf_icon.png') center no-repeat;padding-right: 24px;}


 /*  Styles permettant la traduction des styles de Word   */
.Normal,.MsoNormal,.Normalexport {}
.auteur  {color: black; text-align:center;font-style:italic;font-size: 100%;padding: 0px 0 10 0;}
.Appelinterne {color: maroon;text-decoration: none; border-bottom:1px dotted;}
.ReponseinterneCar{color: brown}
.MsoHyperlink {}
.Citationsurparagraphespar {padding-left:8%;font-size: 80%}
.Detail1 {color: darkred;font-size: 100%}
.Detail2 {color: darkred;font-size: 80%}
.Detail3 {color: darkred;font-size: 60%}


/*  Styles permettant l'affichage sélectif principal à l'écran  */
/*  Highlight2 et hidden2 ne sont actifs que dans le cas d'un affichage désigné comme "style avec surlignage" */
.highlight2 {} 
.hidden2 {} 


