.catnav{
  position: fixed;
  margin: 50px;
  margin-left: 95vw;
  margin-top: 36%;
}
.catnav a{
  text-decoration: none;
  color: rgba(248, 154, 110, 0.3);
  font-size: 20px;
  -webkit-transition: 0.4s;
}
.catnav a:hover{
  color: #F29C71;
  transition: 0.4s;
}
.catnav li{
  margin-bottom: 20px;
}
.catnav a:target{
  color: #F29C71;
  transition: 0.4s;
}
h4{
  position: relative;
  margin-left: 21vw;
  margin-top: 5vh;
}
.backH{
  margin-left: 21vw;
  margin-top: 14vh;
}
.catTitles{
  display: flex;
  flex-direction: row;
}
.secflex{
  display: flex;
  flex-direction: column;
}
section{
  height: inherit;
}

/* 64 */
.bloc64{
  color: white;

  position: absolute;
  width: 35%;
  background: rgba(231, 185, 69, 0.9);
  margin-top: 5%;
  margin-left: 25%;
  z-index: 20;
  padding: 3%;
}
.catimg{
  position: relative;
  width: 60%;
  margin-top: 17%;
  margin-left: 20%;
  z-index: 19;
}
#sxte{
  margin-bottom: 10%;
}

/* CODE */
.blocCode{
  color: white;

  position: relative;
  width: 35%;
  background: rgba(121, 171, 183, 0.9);
  margin-left: 25%;
  z-index: 20;
  padding: 3%;
}
#chillout{
  margin-bottom: 10%;
}
#chillout .catimg{
  margin-top: -2%;
}

/* HBW */
.blocHbw{
  color: white;

  position: relative;
  width: 35%;
  background: rgba(248, 154, 110, 0.9);
  margin-left: 25%;
  z-index: 20;
  padding: 3%;
}

#hbw{
  margin-bottom: 10%;
}
#hbw .catimg{
  margin-top: -2%;
}

/* KIKIRITZ */
.blocKiki{
  color: white;

  position: relative;
  width: 35%;
  background: rgba(6, 46, 84, 0.9);
  margin-left: 25%;
  z-index: 20;
  padding: 3%;
}
#kiki{
  margin-bottom: 10%;
}
#kiki .catimg{
  margin-top: -2%;
}

/* ILLU PERSO */
.blocIllu{
  color: white;

  position: relative;
  width: 35%;
  background: rgba(231, 185, 69, 0.9);
  margin-left: 25%;
  z-index: 20;
  padding: 3%;
}
#illupers{
  margin-bottom: -7%;
}
#illupers .catimg{
  margin-top: -2%;
}


@media screen and (max-width: 953px) {
  /* INITIALISATION */
  .BGcat{
    width: 50%;
    margin-left: 25%;
  }
  .catnav{
    margin-left: 92vw;
    margin-top: 10%;
    z-index: 992;
  }
  .backH{
    margin-top: 6vh;
  }
  /* 64 */
  .bloc64{
    width: 80%;
    margin-top: 13vh;
    margin-left: 6vw;
    padding: 5%;
  }
  .catimg{
    width: 95%;
    margin-top: 35vh;
    margin-left: 2vw;
  }
  /* CODE */
  .blocCode{
    width: 80%;
    margin-top: 13vh;
    margin-left: 6vw;
    padding: 5%;
  }
  /* HBW */
  .blocHbw{
    width: 80%;
    margin-top: 13vh;
    margin-left: 6vw;
    padding: 5%;
  }
  /* Kikiritz */
  .blocKiki{
    width: 80%;
    margin-top: 13vh;
    margin-left: 6vw;
    padding: 5%;
  }
  /* Illu perso */
  .blocIllu{
    width: 80%;
    margin-top: 13vh;
    margin-left: 6vw;
    padding: 5%;
  }
}