body{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  
}

.container{
  width: 100%;
  height: 100vh;
  background: #222;
}

img{
  width: 100vw;
  }

.debu{
  content: 100px; 
}

br{
  height: 50px;
}

.caca img{
  width: 20vw;
}

@keyframes wherethefuck {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

@keyframes whythefuck {
  0% {
    rotate: 0deg;
  }
  100% {
    rotate: 10deg;
  }
}

.tonkk:hover{
transition-duration: 1s;
animation-name:whythefuck;
animation-name:wherethefuck;
animation-fill-mode: both;

}


.caca img:hover{
  width: 19vw;
  
}


.caca img:hover{
  width: 19vw;
  
}


.container input {
  display: none;
  opacity: 0;
}

#tonkk{
  display: block;
}

.container img {
  width: 20vw;
  transition: 1s;
  cursor: help;
}

.container input:checked + img {
  transform: scale(0.8);
  opacity: 0;
  rotate: 20deg;
  width: 16vw;
}