styles.css

html, body {
  width: 100%;
  height: 100%;
  margin: 0px;
}

canvas {
  position: fixed;
  width: 100%;
  height: 100%;
  z-index: -1;
}

#container {
  color: #CCC;
  margin: 0 10%;
  position: absolute;
}

#container > .row {
  margin-bottom: 8em;
}

#container > .row h2 {
  margin-bottom: 2em;
}

h1, h2, h3 {
  font-weight: 100;
  font-family: 'Merriweather', serif;
}

* {
  font-family: 'Merriweather', serif;
  color: #FFF;
}

img {
  max-width: 100%;
  max-height: 100%;
}

ul {
  padding: 0px;
}

#about, #past_work, #art, #social {
  text-align: center;
}

.about {
  text-align: justify;
}

#about, #past_work {
  margin: 700px auto 2em auto;
}

.project .content {
  margin: 3em 0;
  text-align: center;
}

.art, .social {
  text-align: center;
}

.social .ui.image.black.label {
  margin: 1em;
}

.project, .about, .past_work, .art, .social {
  background: rgba(0,0,0,0.35);
  display: block;
  padding: 2em;
}

.past_work {
  overflow: auto;
}

.past_work .ui.right.floated.bulleted.inverted.list {
  margin-top: 0px;
}

@media only screen and (max-width: 1000px) {
  #about {
    margin: 1000px auto 2em auto !important;
  }

  #past_work {
    margin: 0 auto 2em auto !important;
  }

  .header, .header * {
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }

  .header .right.menu {
    margin-top: 5em;
  }

  .past_work .ui.right.floated.bulleted.inverted.list {
    float: left !important;
  }
}