/* Feuille de style principale du site morice33. Cette feuille doit être commune aux deux versions du site */




  body { 
    color: rgb(102, 51, 0);
/*    color: rgb(0, 0, 0);*/
/*    background-color: rgb(255, 255, 204);*/
    background-color: rgb(255, 255, 230);
	/* en système décimal :  100 100 90 ("fond site" dans canvas) */
    /*background-color: rgb(0, 0, 0);*//* Si Macron décide d’assassiner Bachar */
    text-align: justify;
    direction: ltr;
    }

  p { text-indent: 20pt;
    text-rendering : optimizeLegibility; /* Ceci permet d'assurer automatiquement la ligature, même quand elle n'est pas codée en dur
    (mais ne marche qu'avec certains navigateurs, c'est pourquoi je laisse les ligatures en dur dans mon site)*/
    
    /* Ceci est censé faire des césures : on va bien voir !*/
    /* En tout cas miracle, sous firefox ça marche !!! */
    -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -o-hyphens: auto;
  hyphens: auto;
    }

  h2 { 
    /*font-family: "Georgia","Garamond","times new roman",serif;*/
  font-family: "Trebuchet MS", "lucida", helvetica, sans-serif ;
    color: rgb(102, 51, 0);
/*    background-color: rgb(255, 255, 230);*/
    text-align: left;
    font-size: 18pt;
    font-weight: bold;
    margin-top: 0.5em;
    }

  h2 a {
    text-decoration: none ;
    color: rgb(102, 51, 0);
    font-style: italic ;
  }

h3 {
  font-family: "Trebuchet MS", "lucida", helvetica, sans-serif ;
    color: rgb(102, 51, 0);
    text-align: left;
    font-weight: bold;
  font-size: 14pt ;
}

  h3 a {
    text-decoration: none ;
  }
  
  h4 {
    font-family: "LinLibertine", Georgia, serif;
  font-size: 14pt ;
  }

  ul { 
  list-style: none;
/* Dernière solution en date : mettre une image du tiret que l'on trace naturellement dans les autres navigateurs */
    list-style-position: inside;
    }

/* Ceci fonctionne sur tous les navigateurs sauf IE : tirets à la place des disques (typo française) */
ul li:before {
  margin-right: 1mm ;
  content: "\002013" ; 
}

small, sub, sup { font-size: .83em ; }
sub { 
  vertical-align: sub ;
  line-height: .0em; /* 0.8em*/
} 
sup { 
  vertical-align: super ;
  line-height: .0em; /* 0.8em*/ 
} 

  img { border: 5px solid rgb(102, 51, 0);
    }
	
  a:link { color: rgb(255, 102, 102);
    }

  a:visited { color: rgb(255, 102, 0);
    }

  a:hover { color: rgb(255, 0, 0);
    text-decoration: none;
    }

/* Classe  externe ou dehors : il n'y a pas de différence, exceptée que le script perl de modification
rajouter une info-bulle sur les liens de classe externe et pas ceux de dehors (mettre dehors quand
l'info-bulle ne fonctionne pas)
*/
  a.externe:link, a.dehors:link { color: rgb(153, 0, 0);
    }

  a.externe:visited, a.dehors:visited { color: rgb(255, 153, 102);
    }

  .externe, .dehors {  }
  
  /* classe pour les liens morts */
  
  .externe_m, a.externe_m, .externe_m:link, a.externe_m:link,
  .dehors_m, a.dehors_m, .dehors_m:link, a.dehors_m:link{
    /* color:Silver ;*/
    /*color:SlateGrey ;*/
    color: rgb(179,153,128) ;
    font-style: oblique;
    text-decoration: underline ;
  }
  
  .ensembleboutons {
     text-align: center ;
     padding-bottom: 20px ;
     /*margin-top: -40px ;*/
    line-height: 42px ;
  }

  input.bouton, a.bouton:link, a.bouton:visited  { 
    /*font-family: Georgia, "Garamond", "Bookman Old Style", Bookman, "New Century Schoolbook", "Bookman Antiqua", Palatino, "Utopia", "New York", "Times New Roman", Times, serif;    */
    font-family: "LinLibertine", Georgia, serif;

    font-size: 14pt;

    font-weight: bold;
    color: rgb(51, 51, 51) /*! important*/;    
    }
    
    


  input.bouton:hover, a.bouton:hover { 
    border-color: rgb(255, 153, 0);
    font-weight: bold;
    background-color: rgb(102, 255, 255);
    color: rgb(255, 0, 0);
    }

  .bouton { 
    border: 2px solid rgb(102, 0, 0);
    padding: 5px;
    text-align: center;
    background-color: rgb(192, 192, 192);
    font-weight: bold;
    text-decoration: none;
    color: rgb(51, 51, 51);
    cursor: pointer;
    white-space: nowrap;
	
	/*arrondir les coins : premier nombre pour le haut-gauche et le bas-droite, second nombre pour les atures coins*/
      -moz-border-radius: 6px 6px;
      -webkit-border-radius:6px 6px;
       border-radius:6px 6px;
    }
    /* Je ne sais pas pourquoi on doit faire ça ! -> que pour Firefox semble-t-il*/
    /*
    input.bouton {
      padding: 4px; 
    }
    */
    

  ul.courte_liste { 
    text-align: left;
/*    list-style-type: disc;
    list-style-image: none;*/
    list-style: none; 
    list-style-position: inside;
    position: relative;
    margin-left: -0.5em;
    padding-left: 1em;
    }

ul.courte_liste li:before {

  margin-right: 1mm ;

  content: "\002013" ; 

}

  a.note_info_bulle { border-bottom: 1px dashed rgb(255, 0, 0);
    color: rgb(51, 51, 51);
    }

  .note_info_bulle {}

  .sbulle, .sbulle_c { 
    border: 2px solid rgb(255, 0, 0);
    padding: 4px;
    background: rgb(255, 255, 204) none repeat scroll 0% 50%;
/*
    -moz-background-clip: initial;
    -moz-background-origin: initial;
    -moz-background-inline-policy: initial;
*/
    position: absolute;
    visibility: hidden;
    font-size: medium ;
  }
  .sbulle p, .sbulle_c p, .sbulle ul li {
    font-size: medium ;
  }
    .sbulle {
      text-align: left;
     }
      /* 2/11/2025 : ajout des césures */
   .sbulle, .sbulle p {
  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -o-hyphens: auto;
  hyphens: auto;

    }
    .sbulle_c {
      text-align: center;
    }
    
   .sbulle span, .sbulle_c span {
     font-weight: bold ;
     text-align: center ;
   }
   
   /* cf note Nasredding Hodja Asie centrale : */
   .sbulle img, .sbulle_c img {
     border-width: 1px ;
   }

.arabe, .arabe-c {
  font-family: "times new roman", serif ;
  direction: rtl;
}
.arabe {
  font-size: larger ;
}

.arabe-c {
  font-size: 24pt;
  text-align: center ;
}


  .faux_lien { color: rgb(255, 102, 102);
    text-decoration: underline;
    cursor: pointer;
    }





p.lettrine {
  text-indent: 0pt;
}

p.lettrine:first-letter {
  float: left ;
  font: bold 2.5em/0.9em "LinLibertine", Georgia, "Times new Roman", Times, serif ;

  color: rgb(0, 0, 0) ;
  border: 1px solid #990000;
  background-color: rgb(255,255,204) ;
  margin: 1px ;
  margin-right: 5px ;
  margin-top: 2px ;
  margin-bottom: 0px ;
  padding: 1px ;
}

p.lettrine span {
  font-variant: small-caps ;
}

/* Ancienne méthode (en fait il n'est plus nécessaire de préciser : <span class="slettrine"> */
.slettrine {
  font-variant: small-caps ;
}

/* PRECISIONS A APPORTER POUR IE UNIQUEMENT. WARUM ?*/  /* -> voir le fichier couleurs_ie.css */

/* Espaces fines insécables ! 
http://www.developpez.net/forums/d606257/php/langage/regex/gestion-espaces-fines-insecables/ */
.fine { font-size: 30%; }

p.lettrine span .fine {
  font-variant: normal ;
}

p.continuation {
  text-indent: 0pt;
}

/* le style cl_personne n'a pas été repris*/

/*  infos bulles */
img.imgh_info_bulle, img.imgv_info_bulle { 
  border: 2px solid rgb(102, 51, 0);
}
 
img.imgh_info_bulle {
  width: 300px ;
  aspect-ratio: 3/2 ;
  /*height: 200px ;*/
}

img.imgv_info_bulle {
  width: 200px ;
  aspect-ratio: 2/3 ;
  /*height: 300px ;*/
}


/* Ne JAMAIS mettre les images d’une info bulle sur deux lignes 
 → sauf que cela ne semble pas fonctionner */
/*
div#a_image_b.sbulle_c, div#a_image_bv.sbulle_c, div#a_image_2bh.sbulle_c, div#a_image_2bv.sbulle_c, div#a_image_3b.sbulle_c {
  overflow-x: clip !important ;
}*/

 /* Ceci nécessaire pour que l'espacement ressemble à l'ancien site (mais pourquoi donc ?) */
form {
   padding-top: 2mm ;
   padding-bottom: 2mm ;
}

/* Entrées pour la table de la page des extrémités (utilisée aussi pour d’autre tables comme celle des culminances) */
table.extremites {
  text-align: left; width: 100%; border-spacing: 2px; border-collapse: separate; 
  vertical-align: top; padding: 1px;
  text-overflow: clip;
  white-space: wrap;
}
table.extremites, .extremites th, .extremites td {
  border: 1px solid;
  text-overflow: clip;
  white-space: wrap;
}

@media screen and (max-width: 1100px) {
  table.extremites, .extremites th, .extremites td {
    font-size: 12pt ;
  }
}

@media screen and (max-width: 1060px) {
  table.extremites, .extremites th, .extremites td {
    font-size: 10pt ;
  }
}

@media screen and (max-width: 885px) {
  table.extremites, .extremites th, .extremites td {
    font-size: 8pt ;
  }
}

@media screen and (max-width: 750px) {
  table.extremites, .extremites th, .extremites td {
    /* On réagrandit car le menu a maintenant disparu */
    font-size: 10pt ;
  }
}

/* en-tête : résumé des sorties À travers Paris */
.a-travers-paris, .a-travers-paris p {
  font-size: medium;
  padding-left: 5mm;
  padding-right: 5mm;
}