.projet:hover{
  /* letter-spacing: 1%; */
opacity: .5;
cursor: pointer;
}

.projet{
  cursor: pointer;
  /* transition: .2s; */
  width: auto;
}

#frame{
  display: none;
  position: fixed;
  width:65vw;
  /* height:100vh; */
  background-color: white;
  border-right: .5px solid black;
  border-bottom: .5px solid black;

  border-top: 0px;
  border-left: 0px;

  top: 0%;
  left: 0%;
  /* transform: translate(-50%, -50%); */

  font-family:sono;
  font-size: .7vw;

  padding: .4vw;

  overflow:hidden
}

.gris{
  opacity: 50%;
}

#a-propos{
  opacity: 50%;
  margin-left: 2vw;
}

#a-propos:hover{
  opacity: 100%;
  cursor: pointer;
}

#retour{
  opacity: 50%;
  margin-left: 2vw;
  text-decoration: none;
  mix-blend-mode: difference;
  color: black;
}

#retour:hover{
  opacity: 100%;
  cursor: pointer;
}

#infos{
  display: none;
  padding: .4vw;
  border-right: .5px solid black;
  position: fixed;
  top: calc(75vh + (.4vw * 2) + .5px);
  left: 0px;
  height: calc(25vh - (.4vw * 4) - .5px);
  width: 65vw;
  background-color: white;
  font-family: sono;
  font-size: .8vw;
  font-weight: 500;
}