style.css

/* Fonts from Google Fonts - more at https://fonts.google.com */
@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,700');
@import url('https://fonts.googleapis.com/css?family=Merriweather:400,700');

body {
  background-color: white;
  font-family: "Open Sans", sans-serif;
  padding: 5px 25px 35px 25px;
  font-size: 18px;
  margin: 0;
  color: #444;
  background: #efefef;
}

h1 {
  font-family: "Merriweather", serif;
  font-size: 32px;
}


h2 {
  padding: 10px 15px;
  color: #666;
  font-weight: 400;
  background: white;
  margin: 30px 0 0 0;
}

.stage {
  position: relative;
  width: 100%;
  height: 350px;
  background: white;
}

.stage img {
  height: 60px;
  position: absolute;
}

.stage .brick {
  color: white;
  font-weight: bold;
  font-size: 25px;
  text-align: center;
  text-shadow: 0px 2px 0px rgba(0,0,0,.3);
  padding-top: 15px;
  box-sizing: border-box;
  position: absolute;
  height: 60px;
  min-width: 50px;
}

.yellow {
  background: url(img/yellow.svg) repeat;
}

.blue {
  background: url(img/blue.svg) repeat;
}

.pink {
  background: url(img/pink.svg) repeat;
}

.green {
  background: url(img/green.svg) repeat;
}

.black {
  background: url(img/black.svg) repeat;
}

.purple {
  background: url(img/purple.svg) repeat;
}

.brown {
  background: url(img/brown.svg) repeat;
}

.brick purple {
  font-family: 'Mali', cursive;
}