/********************************************* CSS LOTRO Ekis *********************************/
/***************************************** colleen@jeuxonline.info ****************************/

/* Reset CSS DEBUT */
  body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
    margin:0;
    padding:0;
  }
  table {
    border-collapse:collapse;
    border-spacing:0;
  }
  fieldset,img { 
    border:0;
  }
  address,caption,cite,code,dfn,em,strong,th,var {
    font-style:normal;
    font-weight:normal;
  }
  ol,ul {
    list-style:none;
  }
  caption,th {
    text-align:left;
  }
  h1,h2,h3,h4,h5,h6 {
    font-size:100%;
    font-weight:normal;
  }
  q:before,q:after {
    content:'';
  }
  abbr,acronym { border:0;
  }
  a{outline: none;}
/* Reset CSS FIN */

/* pointillés autour des éléments avec liens sur firefox */
:focus{-moz-outline-style: none;}


* {	margin: 0; padding: 0; }

body {
	background:url("images/bg.jpg") no-repeat /*fixed*/ center 30px #000000;
	height: 100%;
	width: 100%;
	color:#FFFFFF;
	font-family:Arial, Verdana, Helvetica, sans-serif;
	font-size:12px;
}

img {
  margin:0;
}

div#global {
  position:relative;
  width:1058px;
  height:1562px;
  left:50%;
  margin-left:-529px;
  overflow:visible !important;
  overflow:hidden;
}
/***************** HEADER ************************/
div#header {
  width:1058px;
  height:391px;
  float:left;
  background:url("images/header.jpg") no-repeat transparent;
}
  div#header h1 a {
    display:block;
    width:1058px;
    height:296px;
  }
  div#header h1 {
    text-indent:-9000px;
  }
div#pub {
  position:absolute;
  top:240px;
  left:50%;
  margin-left:-234px;
  text-align:center;
}
/****************** MENU H **************************/
div#header ul {
	float: left;
}
div#menuhaccueil { width:84px; height:20px; background:url("images/menu_accueil.png") no-repeat transparent; }
div#menuh li:hover div#menuhaccueil { background:url("images/menu_accueil_over.png") no-repeat transparent; }
div#menuhaccueil a {
  display:block;
  width:84px;
  height:20px;
}
div#menuh1 { width:121px; height:20px; background:url("images/menu_actualites.png") no-repeat transparent; }
div#menuh li:hover div#menuh1 { background:url("images/menu_actualites_over.png") no-repeat transparent; }
div#menuh2 { width:134px; height:20px; background:url("images/menu_introduction.png") no-repeat transparent; }
div#menuh li:hover div#menuh2 { background:url("images/menu_introduction_over.png") no-repeat transparent; }
div#menuh3 { width:134px; height:20px; background:url("images/menu_personnage.png") no-repeat transparent; }
div#menuh li:hover div#menuh3 { background:url("images/menu_personnage_over.png") no-repeat transparent; }
div#menuh4 { width:79px; height:20px; background:url("images/menu_social.png") no-repeat transparent; }
div#menuh li:hover div#menuh4 { background:url("images/menu_social_over.png") no-repeat transparent; }
div#menuh5 { width:149px; height:20px; background:url("images/menu_environnement.png") no-repeat transparent; }
div#menuh li:hover div#menuh5 { background:url("images/menu_environnement_over.png") no-repeat transparent; }
div#menuh6 { width:140px; height:20px; background:url("images/menu_communaute.png") no-repeat transparent; }
div#menuh li:hover div#menuh6 { background:url("images/menu_communaute_over.png") no-repeat transparent; }
div#menuh7 { width:134px; height:20px; background:url("images/menu_autour_du_jeu.png") no-repeat transparent; }
div#menuh li:hover div#menuh7 { background:url("images/menu_autour_du_jeu_over.png") no-repeat transparent; }

div#menuh {
	position: relative;
	padding-top: 45px;
	padding-left: 35px;
	height: 38px;
	color: #272425;
	z-index: 100;
}
div#menuh ul {
	list-style: none;
}
div.menuopen {
  width:278px;/* -20px de padding*/
  height:233px;/* -20px de padding*/
  background:url("images/sous_menu.png") no-repeat transparent;
  padding:10px;
}
div.menuopen li {
	background:url("images/puce.png") no-repeat transparent;
	text-indent: 20px;/**/
	font-size:13px;/**/
	font-weight:bold;
}
li.sousmenu,
li.sousmenu1,
li.sousmenu2,
li.sousmenu3 {
  height:17px;
}
/*li.sfhover {
    overflow:hidden;
}*/
div#menuh ul li ul li a {
	width: 247px;
	text-decoration: none;
	color: #272425;
}
div#menuh ul li ul li a:hover {
	color: #ffffff;
}
div#menuh ul li ul li {
	width: 247px;
	text-decoration: none;
	color: #000000;
}
div#menuh li {
	float: left;
}
div#menuh li ul {
	position: absolute;
	width: 247px;
	left: -999em;
}
div#menuh li:hover ul,
div#menuh li.sfhover ul {
	left: -999em;
}
div#menuh li:hover ul,
div#menuh li.sfhover ul {
	left: auto; /* Repositionnement normal */
	min-height: 0; /* Corrige un bug sous IE */	
}

/* sous-sous-menu1 */
div#menuh ul li ul li.sousmenu1:hover div.sousmenu1,
div#menuh ul li ul li.sousmenu1.sfhover div.sousmenu1 {
    display:block;
}
div.sousmenu1 {
  display:none;
  position:relative;
  width:283px;/*298-5-10*/
  height:243px;/*253*/
  background:url("images/sous_menu.png") repeat-y transparent;
  left:150px;
  top:-20px;
  padding:5px;
  padding-left:10px;
}
/*div#menuh ul li ul li.sousmenu1:hover div.sousmenu1 ul.ulsousmenu1 {
    position:relative;
    left:0px;
    top:0px;
}*/
/**/

div#menuh ul li ul li.sousmenu1.sfhover div.sousmenu2 {
  display:none;
}

/* sous-sous-menu2 */
div#menuh ul li ul li.sousmenu2:hover div.sousmenu2,
div#menuh ul li ul li.sousmenu2.sfhover div.sousmenu2 {
    display:block;
}
div.sousmenu2 {
  display:none;
  position:relative;
  width:288px;/*298*/
  height:243px;/*253*/
  background:url("images/sous_menu.png") repeat-y transparent;
  left:150px;
  top:-20px;
  padding:5px;
}
/*div#menuh ul li ul li.sousmenu2:hover div.sousmenu2 ul.ulsousmenu2 {
    position:relative;
    left:0px;
    top:0px;
}*/
/**/


/********************************** Sous le menuH ****************************************/
div#site {  
  width:1058px;
  float:left;
}
/************************** MenuV ************************/
div#menuv {
  width:283px;
  float:left;
}
  div#menuv li a,
  div#menuv li a:visited,
  div#menuv li a:active {
    color:#272425;
    text-decoration:none;
    font-weight:bold
  }
  div#menuv li a:hover {
    color:#FFFFFF;
  }

  div#menuv div#telecharger {
    width:283px;
    height:81px;
    float:right;
    background:url("images/telecharger.jpg") no-repeat transparent;
  }
  div#telecharger a {
    display:block;
    width:235px;
    height:76px;
    float:right;
    margin-right:11px;
  }
  div#menuv div#rss {
    width:283px;
    height:78px;
    float:right;
    background:url("images/rss.jpg") no-repeat transparent;
  }
  div#menuv div#apparence {
    width:283px;
    height:87px;
    float:right;
    background:url("images/apparence.jpg") no-repeat transparent;
    overflow:hidden;
  }
    div#icon_apparence { margin-top:25px; margin-right:65px;}
    div#designbleu_on, div#designrouge_on, div#designbleu_off, div#designrouge_off {
      width:62px;
      height:61px;
      float:right;
    }
    div#designbleu_on { background:url('images/design_bleu_on.png') transparent; }
    div#designbleu_off { background:url('images/design_bleu_off.png') transparent; }
    div#designbleu_off:hover { cursor:pointer; }
    div#designrouge_on { background:url('images/design_rouge_on.png') transparent; }
    div#designrouge_off { background:url('images/design_rouge_off.png') transparent; }
    div#designrouge_off:hover { cursor:pointer; }
    
  div#menuv div#info_classes {
    width:283px;
    height:480px;
    float:right;
    background:url("images/info_classes.jpg") no-repeat transparent;
  }
    div#icon_classes {
      width:203px;
      height:450px;
      float:left;
      padding-left:60px;
      padding-top:30px;
      /*margin-left:60px;
      margin-right:20px;
      margin-top:30px;
      background-color:deeppink;*/
    }
    a.url_classe {
      display:block;
      width:87px;
      height:87px;
    }
    div#icon_camb { background:url('images/icon_classes_camb.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_camb:hover { background:url('images/icon_classes_camb_on.png') no-repeat; }
    div#icon_cap { background:url('images/icon_classes_cap.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_cap:hover { background:url('images/icon_classes_cap_on.png') no-repeat; }
    div#icon_chp { background:url('images/icon_classes_chp.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_chp:hover { background:url('images/icon_classes_chp_on.png') no-repeat; }
    div#icon_chs { background:url('images/icon_classes_chs.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_chs:hover { background:url('images/icon_classes_chs_on.png') no-repeat; }
    div#icon_gard { background:url('images/icon_classes_gard.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_gard:hover { background:url('images/icon_classes_gard_on.png') no-repeat; }
    div#icon_gdr { background:url('images/icon_classes_gdr.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_gdr:hover { background:url('images/icon_classes_gdr_on.png') no-repeat; }
    div#icon_mds { background:url('images/icon_classes_mds.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_mds:hover { background:url('images/icon_classes_mds_on.png') no-repeat; }
    div#icon_mn { background:url('images/icon_classes_mn.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_mn:hover { background:url('images/icon_classes_mn_on.png') no-repeat; }
    div#icon_sent { background:url('images/icon_classes_sent.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_sent:hover { background:url('images/icon_classes_sent_on.png') no-repeat; }
    div#icon_mons { background:url('images/icon_classes_mons.png') no-repeat; width: 87px; height:87px; float:left; margin:0 13px 2px 0; }
    div#icon_mons:hover { background:url('images/icon_classes_mons_on.png') no-repeat; }

    div#title_camb { background:url('images/title_camb.png') no-repeat; width: 168px; height:27px; float:middle; margin:0 auto; }
    div#title_cap { background:url('images/title_cap.png') no-repeat; width: 132px; height:27px; float:middle; margin:0 auto; }
    div#title_chp { background:url('images/title_chp.png') no-repeat; width: 130px; height:29px; float:middle; margin:0 auto; }
    div#title_chs { background:url('images/title_chs.png') no-repeat; width: 124px; height:26px; float:middle; margin:0 auto; }
    div#title_gard { background:url('images/title_gard.png') no-repeat; width: 111px; height:29px; float:middle; margin:0 auto; }
    div#title_gdr { background:url('images/title_gdr.png') no-repeat; width: 239px; height:29px; float:middle; margin:0 auto; }
    div#title_mds { background:url('images/title_mds.png') no-repeat; width: 226px; height:27px; float:middle; margin:0 auto; }
    div#title_mn { background:url('images/title_mn.png') no-repeat; width: 141px; height:26px; float:middle; margin:0 auto; }
    div#title_sent { background:url('images/title_sent.png') no-repeat; width: 142px; height:26px; float:middle; margin:0 auto; }
    div#title_mons { background:url('images/title_mons.png') no-repeat; width: 131px; height:24px; float:middle; margin:0 auto; }


    div#icon_camb:hover ul.info_classe,
    div#icon_cap:hover ul.info_classe,
    div#icon_chp:hover ul.info_classe,
    div#icon_chs:hover ul.info_classe,
    div#icon_gard:hover ul.info_classe,
    div#icon_gdr:hover ul.info_classe,
    div#icon_mds:hover ul.info_classe,
    div#icon_mn:hover ul.info_classe,
    div#icon_sent:hover ul.info_classe,
    div#icon_mons:hover ul.info_classe {
      display:block;
    }
    
    ul.info_classe {
      display:none;
      position:relative;
      width:283px;/*298-5-10*/
      height:243px;/*253*/
      background:url("images/sous_menu.png") repeat-y transparent;
      left:87px;
      top:-67px;
      padding:5px;
      padding-left:10px;
      z-index:1;
    }
       
  div#menuv div#animations {
    width:213px;/* -70 */
    height:83px;/* -60 */
    float:right;
    background:url("images/animations.jpg") no-repeat transparent;
    padding:40px 20px 20px 50px;
    line-height:18px;
    overflow:hidden;
  }
  div#animations li,
  div#derniers_articles li {
    background:url("images/puce.png") no-repeat transparent;
    text-indent: 20px;/**/
    font-size:13px;/**/
    font-weight:bold;
    color:#272425;
  }
  div#menuv div#recherche {
    width:213px;/*-70*/
    height:26px;/*-48*/
    float:right;
    background:url("images/recherche.jpg") no-repeat transparent;
    padding:28px 20px 20px 50px;
    overflow:hidden;
  }
  
  div.jol_recherche_container {}
    div.jol_recherche_formulaire_container {}
      form.jol_recherche_formulaire {}
        div.jol_recherche_formulaire_interieur {}
          input.jol_recherche_terme {
            width:150px;
            height:28px;
            font-size:14px;
            font-weight:bold;
          }
          input.jol_recherche_submit {
            background:url("images/btn_ok.png") no-repeat center 2px transparent;
            width:38px;
            height:37px;
            border:none;
            color:#FFFFFF;
            font-weight:bold;
          }
          input.jol_recherche_submit:focus {
            background:url("images/btn_ok_on.png") no-repeat center 2px transparent;
            width:38px;
            height:37px;
            border:none;
            color:#FFFFFF;
            font-weight:bold;
          }
    #googleSearchUnitIframe {
      background-color:transparent;
    }
    
  div#menuv div#derniers_articles {
    width:213px;/*-70*/
    height:96px;/*-60*/
    float:right;
    background:url("images/derniers_articles.jpg") no-repeat transparent;
    padding:35px 20px 25px 50px;
    line-height:17px;
    overflow:hidden;
  }
  
/************************************ A droite du menuV ****************************************/
div#centre {
  width:775px;
  float:left;
  overflow:hidden;
}
div#centre a,
div#centre a:visited,
div#centre a:hover,
div#centre a:active {
  color:#FFFFFF;
  font-weight:bold
}
  div#forums {
    width:775px;
    height:161px;/*(236-54-21)*/
    float:left;
    background:url("images/forums.jpg") no-repeat transparent;
    /*padding: 54px 75px 21px 27px;*/
    padding-top: 54px;
    padding-left:27px;
    padding-bottom:21px;
    line-height:26px;
    font-weight:bold;
    font-size:11px;
  }
    div#last-actu {
      width:330px;
      height:161px;
      float:left;
      overflow:hidden;
      margin-right:13px;
    }
    div#last-forum {
      width:330px;
      height:161px;
      float:left;
      overflow:hidden;
    }
    div#forums a,
    div#forums a:visited,
    div#forums a:active {
      color:#FFFFFF;
      text-decoration:none;
    }/**/
    
hr {
  background: url("images/separateur.png") repeat scroll 0 0 transparent;
  border: medium none;
  clear: both;
  height: 10px;
  margin-top:10px;
  margin-bottom:10px;
}
strong {
  font-weight:bold;
}
th,td {
padding:2px;
}
div#actualites table, div#article table {
  margin:20px auto;
  border:solid 1px #000;
  border-collapse:collapse;
  background-color: #850000;
}
div#actualites th, div#actualites td,
div#article th, div#article td {
  padding:2px;
  border:solid 1px #000;
}
div.corps h2,
div#article_content h2,
div.corps_article h2 {
  font-size:18px;
  font-weight:bold;
  margin-bottom:20px;
  line-height:20px;
  /*margin-top:15px;*/
  height:auto;
}
div.corps h3,
div#article_content h3,
div.corps_article h3 {
  font-weight:bold;
  font-size:16px;
  margin-bottom:10px;
  margin-top:15px;
  margin-left:30px;
  height:auto;
}
div.corps h4,
div#article_content h4,
div.corps_article h4 {
  font-size:15px;
  font-weight:bold;
  margin-bottom:20px;
  margin-left:60px;
  margin-top:15px;
  height:auto;
}
div#actus ul,
div#article ul {
      margin-left:20px;
      margin-bottom:15px;
  list-style:inside;
      list-style:disc inside;
}
div#actus ul ul,
div#article ul ul {
      margin-left:25px;
      margin-bottom:8px;
      margin-top:5px;
  list-style:inside;
      list-style:circle inside;
}
div#actus ul ul ul,
div#article ul ul ul {
      margin-left:25px;
      margin-bottom:8px;
      margin-top:5px;
  list-style:inside;
      list-style:square inside;
}

blockquote, div.resume {
  background-color: #850000;
  border: 1px dashed #000000;
  font-style: italic;
  margin-left: 30px;
  margin-right:30px;
  padding: 5px 5px 5px 10px;
}

/******************************** Actualités **********************************/
  div#actus {
    width:775px;
    height:863px;
    float:left;
    background:url("images/actus.jpg") no-repeat transparent;
  }
  div.suite {
  width:106px;
  height:28px;
  }
    div.imgsuite {
      background:url('images/lirelasuite.png') no-repeat transparent;
      width:106px;
      height:28px;
    }

/******************************** Actu Une **********************************/
div#actu_une {
  width:675px;
  height:255px;
  float:left;
  padding-top:25px;
  padding-left:25px;
  padding-bottom:5px;
  padding-right:25px;
}
div#actu_une div.news {
  width:675px;
  height:255px;
  /*overflow:hidden;*/
  font-size:12px;
  font-weight:bold;
}
div#actu_une div.news div.corps {
  width:550px;
  height:175px;
  overflow:hidden;
  float:right:
}
div#actu_une img.freshnews_icone {
  float:left;
  width:83px;
  height:75px;
  /*margin:0px 15px 15px 0px;*/
}
div#actu_une div.suite {
  float:right;
  margin:10px;
  margin-right:28px;
}
div#actu_une h2.titre_news {
  font-size:18px;
  font-weight:bold;
  margin-bottom:16px;
  line-height:22px;
  overflow:hidden;
}

/******************************** Les 4 Actus **********************************/
div#actualites {
  width:710px;
  height:550px;
  float:left;
  padding-top:25px;
  padding-left:15px;
  padding-bottom:25px;
  /*padding-right:20px;*/
  overflow:hidden;
}
div#actualites div.news {
  width:330px;
  height:225px;
  float:left;
  margin-bottom:25px;
  margin-right:25px;
}
div#actualites div.news div.corps {
  width:330px;
  height:180px;
  overflow:hidden;
  /*margin-top:-20px;*/
  float:left;
}
/*div#actualites div.news div.corps {
  width:310px;
  height:120px;
  overflow:hidden;
  margin-top:-20px;
}*/
div#actualites img.freshnews_icone {
  /*position:relative;
  top:-5px;
  left:-10px;
  width:83px;
  height:75px;
  z-index:0;*/
  float:left;
  width:83px;
  height:75px;
}
div#actualites div.suite {
  float:right;
  margin:10px;
  margin-right:20px;
  /*float:right;
  margin-top:45px;
  margin-bottom:10px;*/
}
/******************************** Actu entière **********************************/
/******************************** Article **********************************/
  div#article {
    width:775px;
    height:863px;
    float:left;
    background:url("images/article.jpg") no-repeat transparent;
  }
div#article_content {
  width:625px;
  height:685px;
  float:left;
  padding-top:25px;
  padding-left:25px;
  padding-bottom:25px;
  padding-right:25px;
  margin-top:25px;
  margin-left:25px;
  margin-bottom:25px;
  margin-right:25px;
  overflow:hidden;
  overflow-x: hidden;
  overflow-y: auto;
  /*overflow : -moz-scrollbars-vertical;*/
  /*scrollbar-face-color: red;
  scrollbar-arrow-color: #000000;
  scrollbar-track-color: #000000;
  scrollbar-3dlight-color: #000000;
  scrollbar-darkshadow-color: #000000;*/
  line-height:1.35em;
  }
div#article_content p {
  margin-top:8px;
  margin-bottom:8px;
  text-align:justify;
}
div#article img.freshnews_icone {
  float:left;
  margin-top:-5px;
  margin-left:-10px;
  width:83px;
  height:75px;
}
div#article_content p.freshnews_archives_titre {
  font-weight:bold;
  font-size:15px;
  margin-bottom:10px;
  margin-top:15px;
  text-align:center;
  width:630px;
}
div#article_content p.freshnews_archives_texte {
  text-align:center;
  width:630px;
}
div.vignette {
  float:left;
  /*margin-top:-30px;
  margin-left:-30px;*/
}
div.ariane {
  margin-bottom:30px;
}
div.ariane img {
  margin-left:10px;
  margin-right:10px;
}
div#article_content h1 {
  height:66px;
  margin-top:40px;
}
div#article_content h2.titre_article {
  height:96px;
  margin-top:40px;
}
div.corps_article img {
  margin:5px;
  border:dotted 1px #000000;
  background-color:#990000;
  padding:3px;
}
/*********************************** **************************************/

h2.titre_news {
  font-size:18px;
  font-weight:bold;
  margin-bottom:6px;
  height:22px;
  overflow:hidden;
}
h2.titre_actualite {
  font-size:18px;
  font-weight:bold;
  margin-bottom:20px;
  line-height:20px;
}
h2.titre_news a,  
h2.titre_news a:active,  
h2.titre_news a:visited,  
h2.titre_news a:hover,
h2.titre_actualite a,  
h2.titre_actualite a:active,  
h2.titre_actualite a:visited,  
h2.titre_actualite a:hover {
  color:#FFFFFF;
  text-decoration:none;
}
div.corps p {
  font-size:12px;
  font-weight:bold;
  margin-bottom:10px;
}

div.accroche {
  font-style:italic;
  margin-bottom:15px;
}

.RP
{
  margin: 5px 25px 15px 15px;
  background: url(http://jolstatic.fr/lotro/site-v3/images/frise5.png) repeat-y;
  padding: 12px 40px 12px 40px;
  clear: both;
  font-style:italic;
  text-align:justify;
  color:maroon;
  font-size:1.1em;
  line-height:1.5em;
  text-align: justify; 
  font-weight:normal; 
  /*border: 2px outset darkgray; */
  background-position: 0px 50%; 
  width: 500px;
}

.RP .source
{
	display:block;
	text-align:right;
	font-weight:bold;
	font-style:normal;
}
.trad {
  color:#eddf50;
}
/************************************* Crédits ************************************/
#credits {
  font-size:9px;
  color:#edd686;
  text-shadow:-2px 0 #000000, 0 2px #000000, 2px 0 #000000, 0 -2px #000000;
  line-height:11px;
  text-align:center;
  margin-top:15px;
  float:left;
  width:600px;
}
div#centre div#credits a {
  text-decoration:none;
  color:#edd686;
  font-size:9px;
  text-shadow:-2px 0 #000000, 0 2px #000000, 2px 0 #000000, 0 -2px #000000;
  line-height:11px;
}
/***************** Tags - Container des tags ***************/
div.jol_actus_tags {
    background-image:       url('images/tag.gif');
    background-repeat:      no-repeat;
    background-position:    0 50%;
    margin:                 0;
    min-height:             15px;
    padding:                0 0 0 20px;
}

/**
 *  Tags - Liste des tags
 */
div.jol_actus_tags ul.jol_actus_tags_liste {
    list-style-type:    none;
    margin:             0;
    padding:            0;
}

/**
 *  Tags - Tag
 */
div.jol_actus_tags li.jol_actus_tags_tag {
    display:            inline;
    padding-right:      5px;
}

/**
 * Tags - Séparateur
 */
div.jol_actus_tags li.jol_actus_tags_tag:after {
    content:    ',';
}
div.jol_actus_tags li.jol_actus_tags_tag_dernier:after {
    content:    '';
}


/**
 * Pages - Container
 */
div.jol_actus_pages {
    color:  #999;
    margin: 10px 0;
}

/**
 * Pages - Liste des pages
 */
div.jol_actus_pages ul.jol_actus_pages_liste {
    margin:     0;
    /*margin-left:     -30px;*/
    padding:    0;
    padding-top:495px !important;
    padding-top:0px;
    text-align: left;
}

/**
 * Pages - Page
 */
div.jol_actus_pages li.jol_actus_page {
    list-style-type:    none;
    display:            inline;
    padding-bottom:     1px;
    margin-right:       15px;
}

/********************************** Pagination ******************************/
div.jol_actus_pages li.jol_actus_page_separateur { }

/**
 * Pages - Lien vers une page
 */
div.jol_actus_pages a.jol_actus_page_lien {
    /*border:             1px solid #9aafe5;*/
    color:              #2e6ab1;
    padding:            2px 5px;
    text-decoration:    none;
    text-shadow:-2px 0 #000000, 0 2px #000000, 2px 0 #000000, 0 -2px #000000;
}

/**
 * Pages - Lien vers une page (survolé ou actif)
 */
div#actualites div.jol_actus_pages a.jol_actus_page_lien:hover,
div#actualites div.jol_actus_pages a.jol_actus_page_lien:active {
    /*border:             1px solid #00468C;*/
    color:              #800000;
}

/**
 * Pages - Lien vers la page courante
 */
div#actualites div.jol_actus_pages a.jol_actus_page_lien_actif,
div#actualites div.jol_actus_pages a.jol_actus_page_lien_actif:hover {
    /*background-color:   #2e6ab1;*/
    color:              #b41600;
    border-color:       #2b66a5;
    font-weight:        bold;
    cursor:             default;
}

/**
 * Pages - Lien vers la page précédente ou suivante
 */
div.jol_actus_pages a.jol_actus_page_lien_suivprec {
    color:              #00468C;
    font-weight:        bold;
}
div.jol_actus_pages a.jol_actus_page_lien_suivprec:hover {
    color:              #00468C
}

/**
 * Pages - Liens désactivés
 */
div#actualites div.jol_actus_pages a.jol_actus_page_lien_desactive,
div#actualites div.jol_actus_pages a.jol_actus_page_lien_desactive:hover {
    /*border-color:       #ccc;*/
    color:              #444444;
    cursor:             default;
    font-weight:        normal;
}
div#pages {
  position: relative;
  left:235px;
  top:-50px;
  width:82px;
  height:27px;
  background:url('images/pages.png') center top transparent;
}

/********************** balise @image *********************************/
div.jol_image {
  margin-right:0px;
  margin-bottom:5px;
  border:dotted 1px #000000;
  background-color:#990000;
  padding:5px;
}
div.jol_image_legende {
  font-size:11px;
  text-align:center;
}
div.jol_image a { background-color: #000; display: block; overflow: hidden; }
div.jol_image img { display: block; margin: 0 auto; padding:0; }
div.jol_image_legende a { background-color: inherit; }

/************************** Galerie d'images ********************************/
/**
 * JOLOO - Module Captures_Galerie
 * 
 * Exemple d'une feuille de styles CSS pour le module Galerie.
 * 
 * @author Guillaume Martin <mind@jeuxonline.info>
 */

/**
 * Container global de la galerie
 */
#jolCapturesGalerie {}

/**
 * Titre principal des pages
 */
div#article div#galerie #jolCapturesGalerie h1 {
  margin:15px 0;
  height:20px;
  font-weight:bold;
  font-size:15px;
  text-align:center;
}

/**
 * Titres de deuxième niveau
 */
#jolCapturesGalerie h2 {}

/**
 * Container du menu de navigation
 */
#jolCapturesGalerie div.navigation {
    /**/background-color:   #990000;
    border-bottom:      1px dotted #fff;
    border-top:         1px dotted #fff;
    padding:            2px 5px;
}

/**
 * Liens du menu de navigation
 */
#jolCapturesGalerie div.navigation a {}

/**
 * Page actuelle
 */
#jolCapturesGalerie div.navigation strong {}

/**
 * === ACCUEIL DE LA GALERIE ===
 */

/**
 * Container des dernières images ajoutées
 */
#jolCapturesGalerie div.dernieres {
    /*background-color:   #990000;
    border:             1px dotted #fff;*/
    padding:            5px;
    margin-bottom:      10px;
    text-align:         center;
}

/**
 * Titre du bloc des dernières images ajoutées
 */
#jolCapturesGalerie div.dernieres div.titre {
    font-weight:        bold;
    margin-bottom:      5px;
}

/**
 * Container des images
 */
#jolCapturesGalerie div.dernieres div.images {}

/**
 * Images du bloc des dernières images ajoutées
 */
#jolCapturesGalerie div.dernieres div.images img {
    border:             1px solid black;
    margin:             0 5px;
}

/**
 * Effet mouseover des images du bloc des dernières images ajoutées
 */
#jolCapturesGalerie div.dernieres div.images img:hover {
    border-color:       #e00;
}

/**
 * Container du lien pour ajouter une image
 */
#jolCapturesGalerie div.ajouter { 
    /*background-color:   #990000;
    border:             1px dotted #fff;*/
    margin-bottom:      10px;
    padding:            2px 5px;
    text-align:         center;
}

/**
 * Lien pour ajouter une image
 */
#jolCapturesGalerie div.ajouter a {
    background-image:   url(http://medias.jeuxonline.info/www/jolfiches/img/ajouter_image.png);
    background-repeat:  no-repeat;
    padding-left:       20px;
    color:              #fff;
}

/**
 * Container de la liste des jeux
 */
#jolCapturesGalerie div.liste_jeux {}

/**
 * Container des informations sur un jeu
 */
#jolCapturesGalerie div.jeu
{
    /*background-color:   #990000;*/
    padding:            5px;
    margin-bottom:      10px;
    padding-bottom:     10px;
}

/**
 * Titre du jeu
 */
#jolCapturesGalerie div.jeu h2 {
    border-bottom:      1px dotted #fff;
    margin:             0 0 10px 0;
}
#jolCapturesGalerie div.jeu h2 a {
    text-decoration:none;
}

/**
 * Vignette d'illustration des galeries
 */
#jolCapturesGalerie div.boite
{
    float:              left;
    width:              100px;
    height:             100px;
    margin-right:       25px;
}

/**
 * Liste des catégories des images
 */
#jolCapturesGalerie div.jeu ul {
    margin:             0;
    padding:            0;
    float:left;
}

/**
 * Elements de la liste des catégories 
 */
#jolCapturesGalerie div.jeu li { }

/**
 * Nombre d'images par catégorie
 */
#jolCapturesGalerie div.jeu span.nb_images {
    font-size:          0.8em;
    color:              #ddd;
}

/**
 * Pour être certain que le container inclus entièrement la vignette
 */
#jolCapturesGalerie div.jeu div.clear {
    clear:              both;
}

/**
 * === GALERIE D'IMAGES ===
 */

/**
 * Tableau container des images de la galerie
 */
#jolCapturesGalerie table.galerie {
    margin:             5px auto 10px auto;
}

/**
 * Cellules du tableau
 */
#jolCapturesGalerie table.galerie td {
    padding:            5px;
    font-size:          0.9em;
    line-height:        0.9em;
}

/**
 * Container des images avec leurs informations
 */
#jolCapturesGalerie div.capture {
    height:             152px;
    /*background-color:   #f3f3f3;*/
    padding:            5px;
    width:              165px;
    text-align:         center;
}

/**
 * Container de l'image
 */
#jolCapturesGalerie div.capture div.image {
    width:              160px;
    height:             120px;
    background-color:   #000000;
    overflow:           hidden;
    border:             1px solid #000;
    margin-bottom:      5px;
    margin-left:        auto;
    margin-right:       auto;
}

/**
 * Effet de mouveover sur l'image
 */
#jolCapturesGalerie div.capture div.image:hover {
    border:             1px solid #e00;
}

/**
 * L'image en elle-même
 */
#jolCapturesGalerie div.capture div.image img {
    border:             0;
}

/**
 * Container du titre de l'image
 */
#jolCapturesGalerie div.capture div.titre { height:14px;}

/**
 * Lien vers le titre de l'image
 */
#jolCapturesGalerie div.capture div.titre a { }

/**
 * Date de prise de vue
 */
#jolCapturesGalerie div.capture div.date {
    color:              #ddd;
}

/**
 * Navigation entre les pages de la galerie
 */
#jolCapturesGalerie table.pages {
    /*background-color:   #990000;*/
    width:              100%;
    /*border:             1px solid #ddd;*/
}

/**
 * Cellule du tableau de navigation
 */
#jolCapturesGalerie table.pages td {
    padding:            2px 5px;
}

/**
 * Page précédente
 */
#jolCapturesGalerie table.pages td.precedente {
    text-align:         left;
    width:              160px;
    white-space:        nowrap;
}

/**
 * Page suivante
 */
#jolCapturesGalerie table.pages td.suivante {
    text-align:         right;
    width:              160px;
    white-space:        nowrap;
}

/**
 * Liste des pages
 */
#jolCapturesGalerie table.pages td.pages {
    text-align:         center;
}

/**
 * Page sélectionnée
 */
#jolCapturesGalerie table.pages td.pages strong { 
    font-size:          1.2em;
    padding:            0 4px;
}

/**
 * Liens vers les autres pages
 */
#jolCapturesGalerie table.pages td.pages a {
    padding:            0 4px;
}

/**
 * Container des statistiques de la galerie
 */
#jolCapturesGalerie div.stats {
    font-size:          0.9em;
    margin-bottom:      10px;
    margin-top:         10px;
    text-align:         center;
}

/**
 * === AGRANDISSEMENT DES IMAGES ===
 */

/**
 * Container de l'agrandissement d'une image
 */
#jolCapturesGalerie div.agrandissement {}

/**
 * Container de la version 800px de l'image
 */
#jolCapturesGalerie div.agrandissement div.image800 {
    /*border:             1px solid #000;*/
    margin:             0 auto;
    width:              610px;
}

/**
 * Image version 800px
 */
#jolCapturesGalerie div.agrandissement div.image800 img {
    border:             0;
    display:            block;
    margin:             0 auto;
    width:610px;
}

/**
 * Description de l'image
 */
#jolCapturesGalerie div.agrandissement div.description {
    /*background-color:   #f3f3f3;
    border-bottom:      1px solid #ccc;*/
    margin-top:         10px;
    padding:            2px 5px;
    text-align:         center;
    color:#FFF;
}

/**
 * Date de prise de vue
 */
#jolCapturesGalerie div.agrandissement div.date {
    font-size:          0.9em;
    margin-top:         10px;
}

/**
 * Outils de téléchargement et d'affichage de la version originale
 */
#jolCapturesGalerie div.agrandissement div.options {
    /*background-color:   #FFFAE6;
    border:             1px solid #F5D291;*/
    padding:            2px 0;
    margin:             10px auto;
    text-align:         center;
    width:              90%;
}

/**
 * Liste des outils
 */
#jolCapturesGalerie div.agrandissement div.options ul {
    list-style:         none;
    margin:             0 auto;
}

/**
 * Elements de la liste des outils
 */
#jolCapturesGalerie div.agrandissement div.options li {
    float:              left;
    text-align:         center;
    width:              50%;
}

/**
 * Container inline du lien Afficher l'image originale
 */
#jolCapturesGalerie div.agrandissement div.options li span.afficher {
    padding-left:       20px;
    background-image:   url(http://medias.jeuxonline.info/www/jolfiches/img/icone_images.png);
    background-repeat:  no-repeat;
}

/**
 * Container inline du lien Télécharger l'image
 */
#jolCapturesGalerie div.agrandissement div.options li span.telecharger {
    background-image:   url(http://medias.jeuxonline.info/www/jolfiches/img/telecharger.png);
    background-repeat:  no-repeat;
    padding-left:       18px;
}

/**
 * Liens des outils
 */
#jolCapturesGalerie div.agrandissement div.options a {
    color:              #fff;
}

/**
 * Taille de l'image originale
 */
#jolCapturesGalerie div.agrandissement div.options span.taille {
    font-size:          0.9em;
    color:              #ddd;
}

/**
 * Poids de l'image originale
 */
#jolCapturesGalerie div.agrandissement div.options span.poids {
    font-size:          0.9em;
    color:              #ddd;
}

/**
 * Clear
 */
#jolCapturesGalerie div.agrandissement div.options div.clear {
    clear:              both;
}

/**
 * === FORMULAIRE D'AJOUT ===
 */

/**
 * Container du formulaire
 */
#jolCapturesGalerie div.formulaire {}

/**
 * Formulaire
 */
#jolCapturesGalerie div.formulaire form {}

/**
 * Tableau du formulaire
 */
#jolCapturesGalerie table.formulaire {}

/**
 * Ligne standard du formulaire
 */
#jolCapturesGalerie table.formulaire tr { height:20px;}

/**
 * Ligne alternative
 */
#jolCapturesGalerie table.formulaire tr.alt {}

/**
 * Titre des colonnes
 */
#jolCapturesGalerie table.formulaire th {}

/**
 * Cellules du tableau
 */
#jolCapturesGalerie table.formulaire td {}

/**
 * Menus déroulant d'options
 */
#jolCapturesGalerie table.formulaire select {}

/**
 * Options des menus déroulants
 */
#jolCapturesGalerie table.formulaire option {}

/**
 * Champs du formulaire
 */
#jolCapturesGalerie table.formulaire input {}

/**
 * Bouton d'envoi
 */
#jolCapturesGalerie table.formulaire input.envoyer { margin-bottom:10px;}


/**
 * JOL Module - Lexique
 *
 * Feuille de style exemple pour le module.
 *
 * @author Guillaume Martin <mind@jeuxonline.info>
 */

/**
 * Container du lexique
 */
div.jol_lexique { }

/**
 * Titre de la page
 */
div.jol_lexique h1 { }

/**
 * Container de la liste des derniers ajouts
 */
div.jol_lexique div.jol_lexique_nouveautes {
    background-color:       #FFF2DB;
    border:                 1px solid #F5D291;
    margin-bottom:          10px;
    margin-top:             10px;
    padding:                5px;
}

/**
 * Titre de la liste des derniers ajouts
 */
div.jol_lexique span.jol_lexique_nouveautes_titre {
    font-weight:            bold;
}

/**
 * Liste des derniers ajouts
 */
div.jol_lexique span.jol_lexique_nouveautes_termes {}

/**
 * Lien vers les termes dernièrement ajoutés
 */
div.jol_lexique span.jol_lexique_nouveautes_termes a {
    color:                  #900;
}

/**
 * Container des catégories du lexique
 */
div.jol_lexique div.jol_lexique_categories {
    margin-bottom:          10px;
}

/**
 * Liste des catégories
 */
div.jol_lexique ul.jol_lexique_categories_liste {
    list-style:             none;
    text-align:             center;
}

/**
 * Eléments de la liste des catégories
 */
div.jol_lexique li.jol_lexique_categorie {
    display:                inline;
    padding:                0 50px;
}
div.jol_lexique div.jol_lexique li.jol_lexique_categorie span {}
div.jol_lexique li.jol_lexique_categorie span a {}

/**
 * Catégorie sélectionnée
 */
div.jol_lexique li.jol_lexique_categorie_selectionnee {}
div.jol_lexique li.jol_lexique_categorie_selectionnee span {}
div.jol_lexique li.jol_lexique_categorie_selectionnee span strong {}

/**
 * Container de la liste des lettres
 */
div.jol_lexique div.jol_lexique_lettres {
    margin-top:             15px;
    margin-bottom:          15px;
}

/**
 * Styles spécifiques au container de la liste des lettres du haut
 */
div.jol_lexique div.jol_lexique_lettres_haut {}

/**
 * Styles spécifiques au container de la liste des lettres du bas
 */
div.jol_lexique div.jol_lexique_lettres_bas {}

/**
 * Liste des lettres
 */
div.jol_lexique ul.jol_lexique_lettres_liste {
    list-style:                 none;
    text-align:                 center;
}

/**
 * Les lettres
 */ 
div.jol_lexique li.jol_lexique_lettre {
    background-color:           #eee;
    border-bottom:              1px solid #ccc;
    border-left:                1px solid #f7f7f7;
    border-right:               1px solid #ccc;
    border-top:                 1px solid #f7f7f7;
    display:                    inline;
    padding:                    2px 0;
}
div.jol_lexique li.jol_lexique_lettre:hover {
    background-color:           #FFE795;
}
div.jol_lexique li.jol_lexique_lettre span {}
div.jol_lexique li.jol_lexique_lettre span a {
    padding:                    2px 10px;
    text-decoration:            none;
}
div.jol_lexique li.jol_lexique_lettre span a:hover {
    color: #000;
}

/**
 * Lettre sélectionnée
 */
div.jol_lexique li.jol_lexique_lettre_selectionnee {
    background-color:           #FFE795;
    font-size:                  1.2em;
    padding:                    4px 10px;
}
div.jol_lexique li.jol_lexique_lettre_selectionnee:hover {
    background-color:           #FFE795;
}
div.jol_lexique li.jol_lexique_lettre_selectionnee span {}
div.jol_lexique li.jol_lexique_lettre_selectionnee span strong {}

/**
 * Container de la liste des termes
 */
div.jol_lexique div.jol_lexique_termes {}

/**
 * Liste des termes
 */
div.jol_lexique dl.jol_lexique_termes_liste {}

/**
 * Terme
 */
div.jol_lexique dt.jol_lexique_terme {
    background-color:       #F5F7FF;
    border-left:            5px solid #ccc;
    font-weight:            bold;
    padding:                5px;
}
div.jol_lexique dt.jol_lexique_terme span {}
div.jol_lexique dt.jol_lexique_terme span a {
    text-decoration:        none;
}
div.jol_lexique dt.jol_lexique_terme span a:hover {
    text-decoration:        underline;
}

/**
 * Description
 */
div.jol_lexique dd.jol_lexique_definition {
    background-color:       #ECEEF5;
    border-bottom:          1px solid #ccc;
    border-left:            5px solid #ccc;
    padding:                5px 20px;
    margin:                 0 0 10px 0;
}
div.jol_lexique dd.jol_lexique_definition span {}

/**
 * Lien pour revenir sur l'accueil du lexique
 */
div.jol_lexique div.jol_lexique_retour {
    margin:                 15px 0;
    text-align:             center;
}
div.jol_lexique div.jol_lexique_retour span {}
div.jol_lexique div.jol_lexique_retour span a {}

/**
 * Autres termes de la même catégorie
 */
div.jol_lexique div.jol_lexique_autres {
    font-size:              0.9em;
}
div.jol_lexique div.jol_lexique_autres_titre {
    font-weight:            bold;
}
div.jol_lexique ul.jol_lexique_autres_liste {
    float:                  left;
}
div.jol_lexique li.jol_lexique_autres_mot {}

/**
 * Clear
 */
div.jol_lexique div.jol_lexique_clear {
    clear:                  both;
}


/************* plan du site ******************/