Code fiche Madelle

/*Fiches Diverses*/
/* Bloc principal */
.monBloc {
  position: relative; /* important ! */
  overflow: hidden; /* cache tout ce qui dépasse du bloc. Si vous voulez que votre volet dépasse, retirez cette ligne */
  width: 500px; /* largeur du bloc */
  height: 150px; /* hauteur du bloc */
  background-color: rgba(26,26,26,0.4);
  border:2px solid #1A1A1A;
  box-shadow:0px 0px 3px black;
  text-align:justify; 
}

/* Bloc de recouvrement */
.blocVolet {
  position: absolute; /* positionnement absolu (important) */
  top: 0; /* (important) */
  left: 0; /* (important) */
  width: 500px; /* largeur du bloc (identique au bloc principal) */
  height: 150px; /* hauteur du bloc (identique au bloc principal) */
  background: green; /* couleur de fond */
  /* réglage de la transition */
  -webkit-transition: all 1s linear;
  -moz-transition: all 1s linear;
  -ms-transition: all 1s linear;
  -o-transition: all 1s linear;
  transition: all 1s linear;
}

/* Changement au survol */
.monBloc:hover > .blocVolet {
  left: 500px; /* le bloc se décalera vers la gauche de 500px; (largeur du bloc) */
}
.CadreCarnet { border:solid 2px #1A1A1A; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px black; width:130px; text-align:center;}
.CadreCarnet2 { border:solid 2px #1A1A1A; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px black; width:500px; text-align:justify;padding:10px;}

.TitreTab {font-weight:bolder;text-shadow:0px 0px 3px black; text-align:center;}
.TitreTab2 {font-weight:bolder;text-shadow:0px 0px 3px black; text-align:justify;}
.CadreTab {
  border-left:10px solid #1A1A1A; border-bottom:5px double #1A1A1A; border-right:10px solid #1A1A1A;
  width:560px; background-color: rgba(26,26,26,0.4);  box-shadow:0px 0px 5px black;
}
.BordureTab{width:560px; background-color:#1A1A1A; height:10px;box-shadow:0px 0px 5px black;}
.CadreDescTab { border-right:2px solid #1A1A1A;padding:3px;text-align:justify;height:350px;}
.CadreUtilTab { padding:3px;text-align:justify;height:350px;}
.CadreContexte { border:solid 3px #1A1A1A; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px black; width:560px;}
.BordureContexte { display: block; width: 100%; border-bottom: 3px solid #1A1A1A; margin-top: 100px; margin-bottom: -115px;}
.CadreIcoCon { display: block; width: 150px; height: 150px; border: 4px solid #1A1A1A; box-shadow:0px 0px 3px black;border-radius:100px;margin: 10px;background-image:url(http://img4.hostingpics.net/pics/773811Hlo.png);}
.CadreIcoCon2 { display: block; width: 150px; height: 150px; border: 4px solid #1A1A1A; box-shadow:0px 0px 3px black;border-radius:100px;margin: 10px;background-image:url(http://img4.hostingpics.net/pics/912907Humain.png);}
.CadreIcoCon3 { display: block; width: 150px; height: 150px; border: 4px solid #1A1A1A; box-shadow:0px 0px 3px black;border-radius:100px;margin: 10px;background-image:url(http://img4.hostingpics.net/pics/949692Liares.png);}
.PetitCadreCon { background-color: rgba(26,26,26,0.4); width: 450px; padding: 5px; border: 3px solid #1A1A1A; text-align:justify;}
.CadreTitreFicheDiv {
  background-color:#1A1A1A;
  box-shadow:0px 0px 3px black;
  width:100%;
  left:0px; right:0px;
}
.CadreIcoDiv {
  border:5px solid #1A1A1A;
  background-color:#1A1A1A;
  width: 550px; height:200px;
  box-shadow: 0px 0px 3px black;
}
.TexteDiv {
  text-align:justify;
  width:560px;
}
.CadreTitreFichePj {
  background-color:#1A1A1A;
  box-shadow:0px 0px 3px black;
  width:560px;
}
.CadrePj {
  border-bottom:solid 2px #1A1A1A;
  border-left:solid 2px #1A1A1A;
  border-right:solid 2px #1A1A1A;
  background-color: rgba(26,26,26,0.4);
  box-shadow:0px 0px 3px black;
  width:560px;
  text-align:justify;
}
.TitreLienPj {
  font-family:TrebuchetMS;
  font-size:18px;
  text-shadow: 0px 0px 5px black;
  text-align:justify;
}
.EspacePj { width: 400px; overflow: auto; padding: 8px; font: 14px calibri; text-align:justify;}
.CadreIcoPj {
  border: 1px solid #1A1A1A;
  box-shadow: 0px 0px 5px black;
  width:100px; height:100px;
}
.CadrePredefRec { border:solid 2px #1A1A1A; width:550px; height:550px; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px #614040;}
.CadrePredefAnc { border:solid 2px #1A1A1A; width:550px; height:550px; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px #009F3C;}
.CadrePredefHel { border:solid 2px #1A1A1A; width:550px; height:550px; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px #044476;}
.CadrePredefArv { border:solid 2px #1A1A1A; width:550px; height:550px; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px #960014;}
.CadrePredefPar { border:solid 2px #1A1A1A; width:550px; height:550px; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px #C7B22A;}
.CadrePredefNam { border:solid 2px #1A1A1A; width:550px; height:550px; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px #25B89B;}
.CadrePredefLia { border:solid 2px #1A1A1A; width:550px; height:550px; background-color: rgba(26,26,26,0.4); box-shadow: 0px 0px 5px #912B85;}
.BordurePredef1 { background-color:#1A1A1A;height:20px;width:550px;box-shadow:0px 0px 3px black;width:550px;}
.TitrePredef {font-family:TrebuchetMS;padding:5px;text-align:center;}
.EspacePredef { width:350px; height:70px; padding:5px; overflow:auto; font-size:11px; text-align:justify;}
.EspacePredef2 { width:500px; height:100px; padding:5px; overflow:auto; font-size:11px; text-align:justify;}
.CadreIcoPredef { border:solid 2px #1A1A1A; width:150px; height:300px; box-shadow: 0px 0px 3px black;}

.CadreEvent {
  border-left:10px solid #1A1A1A;
  border-right:10px solid #1A1A1A;
  width:550px;
  text-align:justify;
  background-color: rgba(26,26,26,0.4);
  box-shadow:0px 0px 5px black;
}
.ImgEvent1 {
  background-image:url(http://img11.hostingpics.net/pics/619313imgEvent.png);
  background-repeat;
  height:150px;
  border-bottom:10px solid #1A1A1A;
}
.ImgEvent2 {
  background-image:url(http://img11.hostingpics.net/pics/849263ImgEvent1.png);
  background-repeat;
  height:150px;
  border-top:10px solid #1A1A1A;
}
.BordureEvent {
  width:550px;
  height:10px;
  background-color:#1A1A1A;
}
.TitreEvent {
  font-family: 'Shadows Into Light', cursive;
  font-size: 25px;
  text-align:center;
  text-shadow:3px 3px 3px black;
}
.SousTitreEvent {
  text-shadow:0px 0px 3px black;
}
.CadrePres {
  border:solid 3px #1A1A1A;
  width:560px;
  background-color: rgba(26,26,26,0.4);
  box-shadow: 0px 0px 5px black;
}
.CadreTitreFichePres {
  background-color:#1A1A1A;
  box-shadow:0px 0px 3px black;
  width:560px;
}
.TitrePres {
  font-family:TrebuchetMS;
  font-size:35px;
  text-shadow: 0px 0px 5px black;
  text-align:center;
}
.TitrePres2 {
  font-family:TrebuchetMS;
  font-size:25px;
  text-shadow: 3px 3px 3px #1A1A1A;
  text-align:center;
}
.CadreIcoPres {
  border: 1px solid #1A1A1A;
  box-shadow: 0px 0px 5px black;
}
.EspacePres {
  width: 500px; height: 220px; overflow: auto; padding: 5px; font: 14px calibri; text-align:justify;
}
.EspacePres2 {
  width: 500px; height: 380px; overflow: auto; padding: 5px; font: 14px calibri; text-align:justify;
}