@font-face {
    font-family: "fonteproglyrics";
 src : url("materiel_prog/aston/Aston_Script.ttf")
format('truetype');
 /*src:url("materiel_prog/leva/LevaBlackshear.ttf")format('truetype');*/
    font-weight: bold;
    font-style: normal;
    }

body{background-color:DarkBlue;
display:flex;
justify-content:center;
}

.corps{background-color:white;
width:950px;
border:solid;
flex: 0 1 950px;
display:flex;
flex-wrap:wrap;
}

.home a{color:magenta;
font-family:fonteproglyrics;
font-size:18px;
 }

.home a:hover{color:lime}

.entete{flex:0 1 950px;
background-color:#FFF8DC;
/*position:sticky;*/
top:0;
}

header{max-width:950px;
display:flex;
flex-wrap:nowrap;
flex:1 1 950px;
justify-content:space-between;
background-color:#FFF8DC;
position:sticky;
border-bottom:solid}


.photogroupe{width:300px;
border:double;
background-color:#FFF8DC;
font-size:14px;
display:inline-block;
text-align:center;
}
.photogroupe img{vertical-align:bottom;}

.infogroupe{display:grid;
grid-template-columns: 1fr  1fr 1fr;
grid-column-gap:15px;
background-color:#FFF8DC;
padding-bottom:5px;
padding-left:20px;
flex:0 1 950px;}

/*.album{display:inlineblock}*/

.nom_album{font-size:48px;
text-align:center;
margin-bottom:10px;
}

.lienvert  a:link{text-decoration:none;color:black}
.lienvert  a:visited{color:black}
.lienvert  a:hover{color:lime}

.titre{font-style:italic;
vertical-align:middle;
display:inline-block}

/*sert dans fichers de groupes, d'album et morso donc reste en général*/
.cadretitre{
display:flex;
justify-content:space-around ;/*par défaut. Est ajuster pour les  morso*/
flex:1 1 950px;
font-size:28px;
margin:auto;
text-align:center;
/*height:50px ;
line-height:50px;*/
background-color: Coral;
border-bottom:solid;
padding:.7rem
}

.lyrics{font-size:16px;
padding:2em
}

.aucentre{text-align:center}

.gras{font-weight:bold}

/* les deux suivant servent pour les photos de groupe  et toutes les colonnes droites*/
figure{margin:0px;
font-size:.88rem;
}

figcaption{text-align:center}

.colgauche{flex: 1 0 25%;
display:flex;
flex-direction:column;
/*justify-content:space-between*/
}

.hautgauche{height:60px;
/*flex-grow:1;*/
display:flex;
justify-content:space-between}

.coldroite{flex: 1 0 25%;
}

.hautdroite{height:60px;
display:flex;
justify-content:space-between;
margin-top:-.8rem;
margin-left:.5rem}

/*style pour le lecteur figure partout*/
.defilement-conteneur {
  overflow: hidden;
  white-space: nowrap;
  box-sizing: border-box;
  width: 50%;
  background: Darkblue;
  padding: 10px 0;
}

.defilement-texte {
  display: inline-block;
  padding-left: 100%;
  animation: defiler 15s linear infinite;
}

@keyframes defiler {
  0% { transform: translate(0, 0); }
  100% { transform: translate(-100%, 0); }
}