.infoadmin1 {text-transform: uppercase;}
.infoadmin2 {text-transform: lowercase; font-weight: bold; color:#5F5A54;}

.fondfiche {
  width: 390px;
  background: #603E4E;
  border: 4px double #ebdadc;
}

.titrefiche {
  font-family: 'Arizonia';
  font-size: 35px;
  color: #becc97;
  text-align: center;
  margin-top: 2px;
  text-shadow: 0px 0px 1px #baba98;
  font-weight: 100!important;
transition: all 0.6s;
-o-transition-transition: all 0.6s;
-webkit-transition-duration: all 0.6s;
-moz-transition-duration: all 0.6s;
-ms-transition-duration: all 0.6s;
}
.titrefiche:hover {letter-spacing: 1.5px;}

.soustitrefiche {
  font-family: 'Vollkorn';
  font-size: 12px;
  color: #cbbfa4;
  text-shadow: none;
}

.iconfiche {
  width: 100px;
  height: 100px;
  border: 2px solid #ebdadc;
  filter: grayscale(100%);
-moz-filter: grayscale(100%);
-ms-filter: grayscale(100%);
-o-filter: grayscale(100%);
-webkit-filter: grayscale(100%);
transition: all 1s;
-o-transition-transition: all 1s;
-webkit-transition-duration: all 1s;
-moz-transition-duration: all 1s;
-ms-transition-duration: all 1s;
}
.iconfiche:hover {
filter: grayscale(0%);
-moz-filter: grayscale(0%);
-ms-filter: grayscale(0%);
-o-filter: grayscale(0%);
-webkit-filter: grayscale(0%);
border-radius: 50px;
}
.avatarfiche {
  width: 100px;
  height: 160px;
  border: 2px solid #ebdadc;
  opacity: 0.7;
  transition: all 1s;
-o-transition-transition: all 1s;
-webkit-transition-duration: all 1s;
-moz-transition-duration: all 1s;
-ms-transition-duration: all 1s;
}
.avatarfiche:hover {opacity: 1;}

.titretable {
  font-family: 'Vollkorn';
  font-size: 15px;
  line-height: 18px;
  color: #cbbfa4;
  text-shadow: none;
  text-align: center;
  margin-top: 2px;
  font-weight: 100;
  text-transform: uppercase;
  transition: all 0.6s;
-o-transition-transition: all 0.6s;
-webkit-transition-duration: all 0.6s;
-moz-transition-duration: all 0.6s;
-ms-transition-duration: all 0.6s;
}
.titretable:hover {color:#becc97; letter-spacing: 1.5px;}

.infotable_1 {
  background: #f9f9fa;
  border: 2px solid #ebdadc;
}

.infotable_2 {
  font-family: 'arial';
  font-size: 10px;
  color: #000000;
  line-height: 12px;
  text-align: justify;
}

.imgfiche {
  width: 370px;
  border: 2px solid #ebdadc;
  margin: 3px;
  opacity: 0.7;
  transition: all 1s;
-o-transition-transition: all 1s;
-webkit-transition-duration: all 1s;
-moz-transition-duration: all 1s;
-ms-transition-duration: all 1s;
}
.imgfiche:hover {opacity: 1;}

.fondfiche_2 {
  width: 200px;
  background: #603E4E;
  border: 4px double #ebdadc;
}

.imgfiche_2 {
  width: 180px;
  border: 2px solid #ebdadc;
  margin: 3px;
opacity: 0.7;
  transition: all 1s;
-o-transition-transition: all 1s;
-webkit-transition-duration: all 1s;
-moz-transition-duration: all 1s;
-ms-transition-duration: all 1s;
}
.imgfiche_2:hover {opacity: 1;}


#blocava {
    position: relative;
    width:125px;
    height:200px;
    border: 2px solid #ebdadc; /* La vilaine bordure rouge */
    overflow:hidden; /* Permet de cacher ce qui dépasse */
}

.imgbloc {
    background:white; /* le bg  de la div qui contient l'avatar */
    position:absolute; /* Laissez comme ceci */
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:100%;/* Laissez comme ceci */
    height:100%;/* Laissez comme ceci */
    z-index:1;/* La position par rapport à l'autre div qui contient les infos */
    -webkit-transition:all 0.5s;/* Laissez comme ceci */
    -moz-transition:all 0.5s;/* Laissez comme ceci */
    -o-transition:all 0.5s;/* Laissez comme ceci */
    -ms-transition:all 0.5s;/* Laissez comme ceci */
    transition:all 0.5s;/* Laissez comme ceci */
}

#blocava:hover > .imgbloc {
  margin-top:200px;
opacity:0;
  -webkit-transition:all 1s;/* Laissez comme ceci */
    -moz-transition:all 1s;/* Laissez comme ceci */
    -o-transition:all 1s;/* Laissez comme ceci */
    -ms-transition:all 1s;/* Laissez comme ceci */
    transition:all 1s;/* Laissez comme ceci */}

.infosbloc {
    background: #FDFDFC; /* le bg  de la div qui contient les infos*/
    position:absolute;/* Laissez comme ceci */
  padding: 2px;
  overflow:auto;
  font-size:11px;
  text-align: justify;
    top:0;/* Laissez comme ceci */
    left:0;/* Laissez comme ceci */
    width:100%;/* Laissez comme ceci */
    height:100%;/* Laissez comme ceci */
    z-index:0;/* La position par rapport à l'autre div qui contient les infos (ici en dessous)*/
    opacity:0;/* on met l'opacité à zero pour un effet stylé ;) */
        -webkit-transition:all 0.5s;/* Laissez comme ceci */
    -moz-transition:all 0.5s;/* Laissez comme ceci */
    -o-transition:all 0.5s;/* Laissez comme ceci */
    -ms-transition:all 0.5s;/* Laissez comme ceci */
    transition:all 0.5s;/* Laissez comme ceci */
}

#blocava:hover > .infosbloc {
  opacity:1;/* Lorsque la souris passe sur la div #englob, on augmente l'opacité des infos */
  margin-left:0px;/* et on décale cette div à 0px (position par défaut) */
}
/***FIN MSG***/