html {
  box-sizing: border-box; }

*, *::after, *::before {
  box-sizing: inherit; }

/*
	Grid settings
 */
html {
  margin: 0;
  padding: 0;
  border: 0; }

body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, dialog, figure, footer, header, hgroup, nav, section {
  margin: 0;
  padding: 0;
  border: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline; }

article, aside, dialog, figure, footer, header, hgroup, nav, section {
  display: block; }

body {
  line-height: 1.5;
  background: white; }

table {
  border-collapse: separate;
  border-spacing: 0; }

caption, th, td {
  text-align: left;
  font-weight: normal;
  float: none !important; }

table, th, td {
  vertical-align: middle; }

blockquote before, blockquote after, q before, q after {
  content: ''; }

a img {
  border: none; }

b, i {
  display: none; }

/*

	Grid settings
	Based on NEAT (Bourbon) by Thoughtbot
	https://github.com/thoughtbot/neat

 */
.container {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  position: relative;
  min-height: calc(100vh - 80px);
  top: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  z-index: 50; }
  .container::after {
    clear: both;
    content: "";
    display: table; }

.container > section {
  padding-top: 40px; }

.sub-container {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto; }
  .sub-container::after {
    clear: both;
    content: "";
    display: table; }

.col-one {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 7.44167%; }
  .col-one:last-child {
    margin-right: 0; }

.col-two {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 17.72593%; }
  .col-two:last-child {
    margin-right: 0; }

.col-three {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 28.01019%; }
  .col-three:last-child {
    margin-right: 0; }

.col-four {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 38.29445%; }
  .col-four:last-child {
    margin-right: 0; }

.col-five {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 48.57871%; }
  .col-five:last-child {
    margin-right: 0; }

.col-six {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 58.86297%; }
  .col-six:last-child {
    margin-right: 0; }

.col-seven {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 69.14722%; }
  .col-seven:last-child {
    margin-right: 0; }

.col-eight {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 79.43148%; }
  .col-eight:last-child {
    margin-right: 0; }

.col-nine {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 89.71574%; }
  .col-nine:last-child {
    margin-right: 0; }

.col-ten {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 100%; }
  .col-ten:last-child {
    margin-right: 0; }

.col-eleven {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 110.28426%; }
  .col-eleven:last-child {
    margin-right: 0; }

.col-twelve {
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 120.56852%; }
  .col-twelve:last-child {
    margin-right: 0; }

.fill-parent {
  width: 100%; }

.grid-clear {
  margin-right: 0; }

.shift-single {
  margin-left: 10.28426%; }

h1, h2, h3, h4, h5, h6, p {
  padding-top: 9px;
  padding-bottom: 9px; }

h1 {
  font-size: 3em; }

h2 {
  padding-top: 0px;
  font-size: 2em; }

h3 {
  font-size: 1.5em; }

h4 {
  font-size: 1.25em; }

h5 {
  font-size: 1.15em; }

h6 {
  font-size: 1em; }

.italic {
  font-style: italic; }

ul li {
  list-style-type: none;
  display: inline-block; }

html {
  height: 100%; }

body {
  background-color: white;
  font-family: 'PT Sans', sans-serif;
  font-size: 12pt;
  height: 100%; }

section {
  padding: 0 20px;
  margin-bottom: 40px;
  float: left;
  display: block;
  margin-right: 2.84259%;
  width: 100%; }
  section:last-child {
    margin-right: 0; }
  section:nth-child(odd) h2::before {
    background-color: rgba(30, 242, 241, 0.8); }
  section:nth-child(even) h2::before {
    background-color: rgba(246, 5, 10, 0.8); }
  section h2 {
    font-weight: bold; }
  section h2:before {
    display: block;
    width: 100px;
    height: 10px;
    content: "";
    margin-bottom: 15px; }
  section img.geoffrey {
    border-radius: 10px;
    width: 100%; }
  section:nth-child(odd) a {
    border-bottom: 1px solid #f6050a; }
  section:nth-child(even) a {
    border-bottom: 1px solid #1ef2f1; }
  section p {
    font-family: 'Lora', serif; }

section.portfolio h2::before {
  background-color: rgba(246, 5, 10, 0.8); }
section.portfolio a {
  border-bottom: 1px solid #1ef2f1; }

section.contact a {
  margin-right: 15px; }

a, a:visited, p, li {
  color: #646464;
  text-decoration: none; }

em {
  font-style: italic; }

input.accesscode {
  padding: 5px;
  height: 30px;
  font-size: 10pt;
  border: 1px solid #afafaf; }

input[type="submit"] {
  padding: 5px;
  background-color: white;
  height: 30px;
  font-size: 10pt;
  border: 1px solid #646464;
  margin-left: 20px;
  cursor: pointer;
  margin-right: 15px; }

span.error {
  color: #f6050a; }

header {
  height: 80px;
  width: 100%;
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  border-bottom: 1px solid #afafaf;
  background-color: white; }
  header .badge {
    position: relative; }
  header .name {
    display: block;
    float: left;
    font-family: 'Cantarell', sans-serif;
    font-size: 1.2rem;
    line-height: 80px;
    margin-left: 30px;
    text-shadow: -4px -4px 0.5px rgba(30, 242, 241, 0.25), 4px 4px 0.5px rgba(246, 5, 10, 0.25);
    text-transform: uppercase; }
  header .cube {
    position: relative;
    float: left;
    height: 100%;
    width: 45px;
    transform-style: preserve-3d;
    top: 30px;
    left: 35px;
    transform: rotateX(-15deg) rotateY(-15deg); }
  header .cube div {
    position: absolute;
    width: 20px;
    height: 20px;
    text-indent: 100%;
    overflow: hidden;
    border: 1px solid #646464; }
  header .back {
    transform: translateZ(-10px) rotateY(180deg); }
  header .right {
    transform: rotateY(-270deg) translateX(10px);
    transform-origin: top right; }
  header .left {
    transform: rotateY(270deg) translateX(-10px);
    transform-origin: center left; }
  header .top {
    transform: rotateX(-90deg) translateY(-10px);
    transform-origin: top center; }
  header .bottom {
    transform: rotateX(90deg) translateY(10px);
    transform-origin: bottom center; }
  header .front {
    transform: rotateY(0) translateZ(10px); }
  header nav {
    float: left;
    margin-left: 40px; }
    header nav ul {
      height: 80px; }
      header nav ul li {
        height: 100%;
        width: 65px;
        margin-left: 20px;
        position: relative; }
        header nav ul li a {
          text-transform: uppercase;
          color: #646464;
          display: block;
          height: 100%;
          line-height: 80px;
          font-size: 0.8rem;
          letter-spacing: 2px; }
        header nav ul li a::after {
          background: rgba(100, 100, 100, 0.6);
          position: absolute;
          top: 60px;
          left: 0;
          content: '';
          width: 100%;
          height: 1px;
          opacity: 0;
          -webkit-transition: opacity 0.4s, -webkit-transform 0.4s;
          -moz-transition: opacity 0.4s, -moz-transform 0.4s;
          transition: opacity 0.4s, transform 0.4s;
          -webkit-transform: translateY(-5px);
          -moz-transform: translateY(-5px);
          -ms-transform: translateY(-5px);
          -o-transform: translateY(-5px);
          transform: translateY(-5px); }
        header nav ul li a:hover::after, header nav ul li a:focus::after {
          opacity: 1;
          -webkit-transform: translateY(0px);
          -moz-transform: translateY(0px);
          -ms-transform: translateY(0px);
          -o-transform: translateY(0px);
          transform: translateY(0px); }

.thumb {
  width: 70%;
  margin: 0 auto;
  text-align: center;
  cursor: pointer;
  color: #FFF;
  background-size: cover;
  background-position: center center;
  position: relative;
  margin-bottom: 20px;
  padding: 60px; }
  .thumb.small {
    float: left;
    display: block;
    margin-right: 2.84259%;
    width: 22.86806%;
    height: 150px;
    line-height: 150px; }
    .thumb.small:last-child {
      margin-right: 0; }
  .thumb:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 50; }
  .thumb.blue {
    background-color: #0e7272; }
  .thumb.blue:hover {
    background-color: rgba(14, 114, 114, 0.85); }
  .thumb.red {
    background-color: #760205; }
  .thumb.red:hover {
    background-color: rgba(118, 2, 5, 0.85); }
  .thumb span {
    position: relative;
    z-index: 100;
    display: block;
    font-size: 2em; }
    .thumb span.description {
      font-size: 1.25em; }
    .thumb span.open {
      font-size: 0.75em;
      margin-top: 20px; }

.study {
  position: relative;
  display: none; }
  .study .close {
    background-image: url('../images/close.png');
    background-position: right center;
    position: relative;
    right: 0;
    top: 0;
    height: 30px;
    text-align: right;
    font-size: 12pt;
    line-height: 30px;
    background-repeat: no-repeat;
    padding-right: 50px;
    cursor: pointer;
    margin-bottom: 40px; }
  .study .properties {
    margin-bottom: 20px;
    border-bottom: 1px solid #646464; }
    .study .properties div {
      font-size: 0.9em;
      font-family: 'PT Sans', sans-serif;
      margin-bottom: 15px; }
      .study .properties div span {
        font-weight: bold;
        text-transform: uppercase;
        display: inline-block;
        width: 100px;
        vertical-align: top;
        color: #646464; }
      .study .properties div ul {
        display: inline-block;
        padding-left: 1em; }
      .study .properties div li {
        padding-left: 1em; }
  .study figure {
    display: block;
    text-align: center;
    margin: 20px auto 38px auto; }
    .study figure img {
      max-height: 400px;
      max-width: 100%;
      display: block;
      margin: 20px auto; }
    .study figure figcaption {
      font-size: 10pt;
      font-style: italic; }
  .study ul {
    margin: 0px 0px 15px 10px;
    list-style: square outside none; }
    .study ul li {
      list-style: square outside none;
      display: list-item;
      margin-bottom: 10px; }

.gallery {
  height: 375px;
  width: 100%;
  text-align: center;
  position: relative; }
  .gallery img {
    margin: 0 auto;
    display: none;
    max-width: 85%;
    max-height: 355px; }
    .gallery img:first-child {
      display: block; }
  .gallery .arrow-left, .gallery .arrow-right {
    position: absolute;
    width: 38px;
    height: 98px;
    top: 50%;
    margin-top: -49px;
    cursor: pointer; }
  .gallery .arrow-left {
    left: 0;
    background-image: url('../images/arrow-left.png');
    display: none; }
  .gallery .arrow-right {
    right: 0;
    background-image: url('../images/arrow-right.png'); }

@media screen and (max-width: 800px)  {
  header {
    height: 100px; }
    header .cube {
      float: right;
      margin-right: 45px;
      top: 40px; }
    header .name {
      line-height: 50px;
      font-size: 1rem;
      margin-left: 15px; }
    header nav {
      margin-left: 15px;
      clear: left; }
      header nav ul {
        height: 40px; }
        header nav ul li:first-child {
          margin-left: 0px; }
        header nav ul li a {
          line-height: 40px; }
        header nav ul li a::after {
          display: none; } }

@media screen and (max-width: 800px)  {
  .container {
    top: 100px;
    min-height: calc(100vh - 100px); } }

@media screen and (max-width: 800px)  {
  section .col-eight, section .col-two {
    float: left;
    display: block;
    margin-right: 7.42297%;
    width: 100%; }
    section .col-eight:last-child, section .col-two:last-child {
      margin-right: 0; }
  section .col-nine {
    float: left;
    display: block;
    margin-right: 7.42297%;
    width: 73.14426%; }
    section .col-nine:last-child {
      margin-right: 0; }
  section .col-one {
    float: left;
    display: block;
    margin-right: 7.42297%;
    width: 19.43277%; }
    section .col-one:last-child {
      margin-right: 0; }
  section .col-two.photo {
    display: none; }
  section .shift-single {
    margin-left: 0%; } }

@media screen and (max-width: 800px)  {
  .thumb {
    float: left;
    display: block;
    margin-right: 7.42297%;
    width: 100%;
    height: 125px;
    line-height: 125px;
    margin-bottom: 20px; }
    .thumb:last-child {
      margin-right: 0; } }
@media screen and (max-width: 800px)  {
  .thumb.small {
    float: left;
    display: block;
    margin-right: 7.42297%;
    width: 100%;
    height: 90px;
    line-height: 90px;
    margin-bottom: 20px; }
    .thumb.small:last-child {
      margin-right: 0; } }

@media screen and (max-width: 800px)  {
  .study figure img {
    width: 100%; } }

@media screen and (max-width: 800px)  {
  .gallery {
    height: 275px;
    margin-bottom: 20px; }
    .gallery img {
      max-height: 200px; }
    .gallery .arrow-left, .gallery .arrow-right {
      top: auto;
      bottom: 0;
      margin: 0 auto;
      height: 49px;
      width: 19px;
      background-size: 19px 49px; }
    .gallery .arrow-left {
      left: calc(50% - 40px); }
    .gallery .arrow-right {
      right: calc(50% - 40px); } }

@media screen and (max-width: 800px)  {
  .properties .col-eight {
    float: left;
    display: block;
    margin-right: 7.42297%;
    width: 100%; }
    .properties .col-eight:last-child {
      margin-right: 0; }
  .properties .col-two {
    float: left;
    display: block;
    margin-right: 7.42297%;
    width: 100%; }
    .properties .col-two:last-child {
      margin-right: 0; } }