/*
    @font-face {
font-family: 'Panarema_L';
src: url(/fonts/Panamera-Light.otf) format("otf"),
}

    @font-face {
font-family: 'Panarema_R';
src: url(/fonts/Panamera-Regular.otf) format("otf"),
}
*/

@font-face {
 font-family: "Alegrya";
 src: url("Alegreya-Medium.woff") format("woff");
 }

 @font-face {
  font-family: "Alegrya_it";
  src: url("Alegreya-MediumItalic.woff") format("woff");
  }

.list{
font-family: 'Alegrya';
text-align: left;
margin-left: 20%;
line-height: 0,5;
color: #0c0c0b;
font-size: 24px;
margin-top: 40px;
text-decoration: none;
}

body{
    background-color: #b4b9c2;
  font-family: 'Alegrya',
       letter-spacing: 0px;
}
svg{
  fill: none;
  stroke: #ED495B;
  stroke-width : 6;
 position: relative;
    top: 60px;


}

.phrase{
  color: #0c0c0b;
  line-height: 0,5;
  font-size: 24px;
  font-family: 'Alegrya';
  font-weight: 300;

    position: relative;

    text-align: center;

}

.fond
  {
    font-family: 'Alegrya_it';
    text-decoration: none;
    text-align: left;
    margin-left: 200px;
    line-height: 0,5;
    color: #0c0c0b;
    font-size: 25px;
    margin-top: 40px;


  }



#chips{
  position: relative;
  top: 45px;
  left: 20%;

}


#chips img{
  position: absolute;
  top: 0;
  left: 0;


}

#chips img:first-child{
z-index: -2;
}

#chips img:last-child{
z-index: -1;
}

#compteur{
  text-align: center;
  color: #0c0c0b;
  line-height: 0,5;
  font-size: 24px;
  font-family: 'Alegrya';
  font-weight: 300;




}

#refresh{
  display: none;
  text-align: center;
  color: #0c0c0b;
  line-height: 0,5;
  font-size: 24px;
  font-family: 'Alegrya';
  font-weight: 300;
  cursor: pointer;

  }


.list:hover {
  font-family: 'Alegrya_it';
  cursor: pointer;
}

#fond:hover {
  cursor: pointer;

}