/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Merienda);
@import url(https://fonts.googleapis.com/css?family=Arimo);

body {
  color:#884c10;
  font-size:120%;
  font-family:'Merienda',Arimo,Helvetica;
  margin-top:0;
  }
#content {
  border:0px solid red;
  max-width:1200px;
  text-align:center;
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:flex;
  margin:0 auto;
  }
#main {
  border:0px solid blue;
  max-width:840px;
  min-width:240px;
  margin:0 auto;
  // margin-top:60px;
  // padding:1em;
  flex: 1; /* Force l'étirement */
  }

#nav_left, #nav_right {
  border:0px solid yellow;
  width:180px;
  padding-top:1em;
  }
#menus {
  width:100%;
  text-align:center;
  }
#menu, #cards, #form {
  text-align:left;
  background-color:#ecffff;
  border:1px solid #884c10;
  // border-radius:24px 0 0 24px;
  margin-top:13px;
  margin-bottom:16px;
  padding:1ch;
  padding-top:16px;
  padding-bottom:16px;

  height:640px;
  overflow-y: auto;
  }
#cards {
  text-align:center;
  // border-radius:0 24px 24px 0;
  // direction: rtl;
  }
.liste {
  font-size : 70%;
  margin-left:2ch;
  text-indent:-2ch;
  }

img {
  vertical-align:bottom;
  }
img#carte {
  max-width:800px;
  max-height:640px;
  box-shadow: 8px 8px 32px #4e4032;
  }
.info {
  color:#000;
  font-family:'Arimo',Arimo,Helvetica;
  }
.tb { /* pour les images créées par le thumbnail_maker */
  border-radius:6px;
  }

.pic { /* si le nombre d'images dépasse la largeur disponible il y a un retour à la ligne toujours centré */
  display:inline-block;
  position:relative; /* ajouté le 5 janvier 2015 pour permettre de plaquer une icône google sur une miniature */
  border:1px solid #804000;
  padding:2px;
  margin-bottom:4px;
  margin-right:4px;
  border-radius:6px;
  background-color:white;
  }
.pic:hover {
  background-color:yellow;
}

a {
  color:#804000;
  font-weight:bold;
  text-decoration:none;
  cursor:pointer;
  }
a:hover {
  color:#0040FF;
  text-decoration:underline;
  }
a:visited .pic {
  background-color:#ffff00;
  }
a:visited .tb { /* ne fonctionne pas */
  opacity:0.2;
  }

p {
  font-family:'Arimo',Arimo,Helvetica;
  color:black;
  text-align:justify;
  }

.subt {
  font-size:smaller;
  font-style:italic;
  }
em {
  font-size:80%;
  }

#tooltip {
  position:absolute;
  visibility:hidden;
  max-width:64ch;
  text-align:left;
  background-color:#ecffff;
  padding:4px;
  font-weight:bold;
  border:1px solid #804000;
  border-radius:4px;
  z-index:9999;
  }