/* transition 1 */

img{
    opacity: 0.25;
    transition: opacity 500ms;
}

img:hover{
    opacity: 1;
}

/* challenge */

figure {
  position: relative;
}

figure img {
  position: absolute;
  top: 0;
  left: 0;
}

figure .visible {
  opacity: 1;
}

figure .hidden {
  opacity: 0;
}

figure:hover .hidden {
  opacity: 1;
}
figure:hover .visible {
  opacity: 0;
}

body{
  background-color: lightyellow;
}