.visible,
.hidden {
  overflow: hidden;
  /* This container should not have padding, borders, etc. */
}
.visible {
  visibility: visible;
  opacity: 1;
  transition: opacity 2s linear;
}
.hidden {
  visibility: hidden;
  opacity: 0;
  transition: visibility 0s 2s, opacity 2s linear;
}
.visible > div,
.hidden > div {
  /* Put any padding, border, min-height, etc. here. */
}
.hidden > div {
  margin-top: -10000px;
  transition: margin-top 0s 2s;
}