html,
body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-align: center;
  color: white;
  font-family: sans-serif;
}
h1 {
  text-shadow: 4px 4px 4px rgb(0, 0, 0, 0.3);
}

body {
  background: #f63;
}

.flake {
  position: absolute;
  width: 100px;
  height: 100px;
  background-size: cover;
}

.flake1 {
  background-image: url("https://assets.codepen.io/32887/flake1.svg");
}

.flake2 {
  background-image: url("https://assets.codepen.io/32887/flake2.svg");
}

.flake3 {
  background-image: url("https://assets.codepen.io/32887/flake3.svg");
}

.flake4 {
  background-image: url("https://assets.codepen.io/32887/flake4.svg");
}

body {
  background: #ed213a; /* fallback for old browsers */
  background: -webkit-linear-gradient(
    to right,
    #93291e,
    #ed213a
  ); /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(
    to right,
    #93291e,
    #ed213a
  ); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}