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

.split {
  display: flex;
  flex-flow: row nowrap;
  justify-content: center;
  align-content: center;
}

.split > div {
  width: calc(50% - 2px);
  height: calc(90vh);
  margin: 1px;
  text-align: center;
  background: #fff  0 0 repeat 200px 200px;
}

.split > div p {
  background: #fff;
}

.split > div.gif {
  background: #fff 0 0/200px 200px url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/729148/starry-sky%5B1%5D.gif);
}

.split > div.svg {
  background: #fff 0 0/200px 200px url(../img/starry-night.svg);
}

.split > div > img {
  height: 100%;
  display: none;
}