@import url('https://fonts.googleapis.com/css2?family=Indie+Flower&display=swap');
html,
body {
  height: 100%;
  margin: 0;
  box-sizing: border-box;
}

#wrap {
    height: 500px;
}

h1 {
  font-family: 'Indie Flower', cursive;
  font-size: 120px;
  text-align: center;
  color: rgb(13, 129, 19);
  /* text-transform: uppercase; */
}

img.london {
  display: block;
  position: absolute;
  filter: grayscale(100%);
  width: 250px;
  height: 500px;
  object-fit: cover;
  top: 80px;
  left: calc(50% - 125px);
  transition: all 1.5s;
  z-index: -1;
}

#wrap:hover img.london{
  filter: grayscale(0%);
}

#first {
  transform: rotate(-250deg);
}

#second {
  transform: rotate(250deg);
}

#wrap:hover #first {
    transform: translate(500px);
}

#wrap:hover #second {
    transform: translate(-500px);
}