body {
  font-family: 'Raleway', sans-serif;
  font-size: 90%;
  margin: 0;
  overflow-x: hidden;
}
body > header {
  padding: 2em;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  margin-top: 0;
}
a {
  color: #9c340e;
  font-weight: bold;
  text-decoration: none;
  transition: color 0.4s;
}
a:hover {
  color: #227682;
}
li {
  list-style-type: none;
  margin-bottom: 0.5em;
}
ul,
ol {
  padding-left: 0;
}
main {
  display: block;
  position: absolute;
  top: 6em;
  left: 13em;
  right: 0;
  padding-bottom: 2em;
  min-height: 100%;
}
main section h1:after {
  content: '';
  display: block;
  height: 3px;
  margin-top: 5px;
  background: -webkit-linear-gradient(left, #ce7415, #fff);
  background: linear-gradient(to right, #ce7415, #fff);
}
main article:not(.project):not(.all-projects):not(.book) ul {
  padding-left: 2em;
  text-indent: -2em;
}
main p,
main li {
  line-height: 1.4em;
}
article:not(.project):not(.all-projects) {
  margin-right: 6em;
  max-width: 800px;
}
article:not(.project):not(.all-projects) img {
  box-sizing: border-box;
  margin-left: 3em;
  margin-bottom: 3em;
  max-width: 40%;
}
article:not(.project):not(.all-projects):not(.book) h1 {
  margin-bottom: 1em;
}
section {
  margin-bottom: 2em;
}
nav {
  position: absolute;
  top: 6em;
}
nav ul {
  margin: 0;
  text-transform: lowercase;
  line-height: 1.5em;
  font-size: 1.1em;
}
header:nth-of-type(1) h1 {
  color: #000;
}
#top-triangles {
  position: absolute;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: -5;
}
#bottom-triangles {
  position: absolute;
  right: 0;
  -webkit-transform: translate(50%, -75%);
  z-index: -5;
}
.project .photos {
  position: absolute;
  top: 0;
  right: 5em;
  max-width: 35%;
}
.project .photos img {
  max-width: 100%;
  margin-bottom: 1em;
  border: 1px rgba(0,0,0,0.1) solid;
}
.project header,
.project section:not(.photos) {
  width: 50%;
}
.book header h1, .project header h1 {
  margin-bottom: 0.2em;
}
.book header h2, .project header h2 {
  font-size: 1.2em;
  font-style: italic;
  float: left;
}
.book header p, .project header p {
  float: right;
  margin-top: 0;
}
.project header+ * {
  clear: both;
}
.book header:after, .project header+ *:before {
  content: '';
  display: block;
  height: 3px;
  transform: translateY(-0.5em);
  background: linear-gradient(to right, #ce7415, transparent);
}
.project .credits li {
  padding-left: 200px;
  text-indent: -200px;
  overflow: hidden;
  text-overflow: ellipsis;
}
.project .credits strong {
  display: inline-block;
  width: 200px;
  text-indent: 0;
}
.all-projects h1 {
  margin-bottom: 1em;
}
.all-projects li {
  background-size: cover;
  background-position: center;
  width: 15em;
  height: 15em;
  margin: 0 2em 2em 0;
  display: inline-block;
  vertical-align: top;
  position: relative;
  overflow: hidden;
  transition: filter 0.5s;
  transition: -webkit-filter 0.5s;
  filter: grayscale(60%) brightness(125%);
  -webkit-filter: grayscale(60%) brightness(125%);
}
.all-projects li:hover {
  filter: grayscale(0%) brightness(100%);
  -webkit-filter: grayscale(0%) brightness(100%);
}
.all-projects li:hover p {
  bottom: 10%;
}
.all-projects li p {
  background: rgba(255,255,255,0.9);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  box-shadow: 0 0 7px rgba(0,0,0,0.4);
  padding: 1em;
  box-sizing: border-box;
  margin: 0;
  transition: bottom 0.5s;
}
.homepage {
  overflow: hidden;
}
.homepage canvas#top-triangles {
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}
.book-item {
  display: inline-block;
  vertical-align: top;
  width: 350px;
  margin-bottom: 2em;
}
.book-details p {
  margin: 0;
  margin-bottom: 0.3em;
  text-indent: -1em;
  padding-left: 1em;
}
.all-books .books-list .book-item img {
  margin: 0;
  margin-top: 1.5em;
  width: auto;
  max-width: none;
}
.book .book-cover {
  float: right;
}
.book header {
  overflow: hidden;
}
.book header:after {
  clear: both;
}
.book section p .book-image {
    margin: 0;
    margin-top: 2em;
    max-width: none;
    max-height: 400px;
}
