.header {
  background-color: #ff0000;
  color: cyan;
  text-align: center;
  font-size: 4em;
  padding: 1em;
  transition: padding 0.3s;
}

.header:hover {
  padding: 2em;
}

.header > p {
  margin-top: 0;
  margin-bottom: 0;
}

.wishes {
  font-size: 1.8em;
  padding: 1em;
  width: 70vw;
  transition: width 0.3s;
  background-color: cyan;
  text-align: center;
}

.image {
  width: 30vw;
  transition: width 0.3s;
  background-color: yellow;
}

.image > img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  transition: width 0.3s height 0.3s;
}

.image:hover {
  width: 40vw;
}

.image:hover ~ .wishes {
  width: 60vw;
}

.wishes:hover {
  width: 75vw;
}

.wishes:hover ~ .image {
  width: 25vw;
}

.container {
  display: flex;
  width: 100vw;
  height: 20em;
  justify-content: center;
}

.bottom {
  background-color: #5555ff;
  color: white;
  font-size: 1.5em;
  padding: 1em;
  margin-top: 9%;
}

body {
  margin: 0;
}