/* /////////////////////////////////
	Daniel Marshall Architects CSS (SCSS)
	by Benek Lisefski
	http://benek.nz
///////////////////////////////// */
/* /////////////////////////////////
	Resets & Fixes
///////////////////////////////// */
* {
  margin: 0;
  padding: 0;
}

article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {
  display: block;
}

audio, canvas, video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-font-smoothing: antialiased;
  -o-font-smoothing: antialiased;
}

b, strong {
  font-weight: bold;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
}

a:active, a:hover, a:focus {
  outline: 0;
}

sub, sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img, a img {
  border: 0;
  -ms-interpolation-mode: bicubic;
}

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

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

textarea {
  resize: none;
}

textarea {
  overflow: hidden;
}

input:focus, select:focus, textarea:focus {
  outline: 0;
}

input[type=search] {
  -webkit-appearance: textfield;
}

::-webkit-search-cancel-button {
  display: none;
}

.gradient {
  filter: none;
}

/* /////////////////////////////////
	Variables
///////////////////////////////// */
/* /////////////////////////////////
	Mixins
///////////////////////////////// */
/* /////////////////////////////////
	Layout Helpers
///////////////////////////////// */
.ir,
ul.social a,
a.benek > span,
.accreditation .nzia,
.accreditation .nzra {
  display: block;
  background-color: transparent;
  border: 0;
  overflow: hidden;
  text-indent: -1000em;
}

.hidden {
  display: none !important;
  visibility: hidden;
}

.clearfix:after,
section:after,
article:after,
.grid:after,
.block-group:after,
.hero-group:after,
.intro-controls:after,
.pub-list li:after,
.text-block .pub-list li:after,
.project-credits:after,
.project-extras:after,
.project-nav:after {
  content: ".";
  display: block;
  height: 0;
  line-height: 0;
  clear: both;
  visibility: hidden;
}

.clearfix,
section,
article,
.grid,
.block-group,
.hero-group,
.intro-controls,
.pub-list li,
.text-block .pub-list li,
.project-credits,
.project-extras,
.project-nav {
  zoom: 1;
  /* for IE */
}

.mobile-only {
  display: none !important;
}

@media (max-width: 557px) {
  .mobile-only {
    display: block !important;
  }
  span.mobile-only {
    display: inline !important;
  }
  .mobile-hide {
    display: none !important;
  }
}

/* /////////////////////////////////
	Large sections & articles
///////////////////////////////// */
body {
  min-width: 320px;
  background: #f1f1f1;
  overflow-x: hidden;
  overflow-y: auto;
}

.wrapper {
  overflow-x: hidden;
}

.content {
  position: relative;
  z-index: 1;
  background: #f1f1f1;
  padding-top: 72px;
  margin-bottom: 455px;
}

.content.has-hero {
  padding-top: 0;
}

div.center {
  position: relative;
  box-sizing: border-box;
  padding: 0 80px;
  margin: 0 auto;
}

section {
  position: relative;
  box-sizing: border-box;
  padding: 110px 0 120px 0;
}

section.white {
  background: #fff;
}

section.hero, section.hero-group, section.project-nav, section.contact {
  padding: 0;
}

section.project-gallery {
  padding-top: 0;
}

article {
  position: relative;
  padding: 110px 0 120px 0;
}

article.no-pad-bottom {
  padding-bottom: 0 !important;
}

@media (min-width: 1024px) and (max-width: 1279px) and (orientation: landscape) {
  .content {
    margin-bottom: 405px;
  }
}

@media (min-width: 558px) and (max-width: 1023px) {
  body {
    -webkit-text-size-adjust: 100%;
  }
  .content {
    padding-top: 112px;
    margin-bottom: 415px;
  }
  div.center {
    padding: 0 60px;
  }
  section {
    padding: 70px 0 80px 0;
  }
  article {
    padding: 70px 0 80px 0;
  }
}

@media (min-width: 558px) and (max-width: 1023px) and (orientation: landscape) {
  .content {
    margin-bottom: 315px;
  }
}

@media (max-width: 557px) {
  body {
    -webkit-text-size-adjust: 100%;
  }
  .content {
    padding-top: 84px;
    margin-bottom: 395px;
  }
  div.center {
    padding: 0 30px;
  }
  section {
    padding: 54px 0 60px 0;
  }
  article {
    padding: 54px 0 60px 0;
  }
}

@media (max-width: 557px) and (orientation: landscape) {
  .content {
    margin-bottom: 375px;
  }
}

/* /////////////////////////////////
	Type
///////////////////////////////// */
@font-face {
  font-family: "Akkurat";
  src: url("../font/Akkurat.eot");
  src: url("../font/Akkurat.eot?#iefix") format("embedded-opentype"), url("../font/Akkurat.woff2") format("woff2"), url("../font/Akkurat.woff") format("woff"), url("../font/Akkurat.ttf") format("truetype"), url("../font/Akkurat.svg#Akkurat") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Akkurat";
  src: url("../font/Akkurat-Bold.eot");
  src: url("../font/Akkurat-Bold.eot?#iefix") format("embedded-opentype"), url("../font/Akkurat-Bold.woff2") format("woff2"), url("../font/Akkurat-Bold.woff") format("woff"), url("../font/Akkurat-Bold.ttf") format("truetype"), url("../font/Akkurat-Bold.svg#Akkurat") format("svg");
  font-weight: bold;
  font-style: normal;
}

body {
  font: normal 13px / 20px Akkurat, arial, sans-serif;
  color: #222;
}

h1 {
  margin: 0;
  font-size: 60px;
  line-height: 72px;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 7px;
  margin-left: -6px;
}

h1.project {
  margin-bottom: 38px;
  color: #ebebeb;
  text-transform: none;
  letter-spacing: 0;
}

h1.article {
  color: #fff;
  font-size: 40px;
  line-height: 52px;
  text-transform: none;
  letter-spacing: 0 !important;
  margin-left: -4px;
}

h1.intro {
  max-width: 620px;
  margin: 60px 0 0;
  font-size: 21px;
  line-height: 30px;
  color: #222;
  text-transform: none;
  letter-spacing: 0 !important;
  margin-left: -1px;
}

h1.invert {
  color: #ebebeb;
}

h2 {
  margin: 0;
  font-size: 28px;
  line-height: 38px;
  margin-left: -2px;
}

h3 {
  max-width: 900px;
  margin: 0;
  font-size: 18px;
  line-height: 26px;
  margin-left: -1px;
}

h3.intro {
  margin-top: 20px;
}

p {
  margin: 22px 0 0 0;
}

label {
  display: block;
  margin: 22px 0 0 0;
  color: #666;
  margin-bottom: 6px;
}

address {
  font-style: normal;
  font-weight: bold;
}

ul {
  list-style-type: none;
  margin: 22px 0 0 0;
}

ul li {
  margin-bottom: 12px;
}

ul.list-simple {
  margin: 0;
}

ul.list-simple li {
  margin-bottom: 0;
  font-weight: bold;
}

ol {
  margin: 22px 0 0 20px;
  text-align: left;
}

ol li {
  margin-bottom: 12px;
}

@media (min-width: 558px) and (max-width: 1023px) {
  h1.intro {
    font-size: 20px;
    line-height: 30px;
  }
  h3.intro {
    font-size: 16px;
    line-height: 24px;
    text-align: justify;
  }
}

@media (max-width: 557px) {
  h1 {
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 4px;
    margin-left: -4px;
  }
  h1.project {
    margin-bottom: 22px;
  }
  h1.article {
    font-size: 30px;
    line-height: 40px;
    margin-left: -3px;
  }
  h1.intro {
    margin-top: 0;
    font-size: 16px;
    line-height: 24px;
    margin-left: -1px;
  }
  h2 {
    font-size: 24px;
    line-height: 34px;
    margin-left: -1px;
  }
  h3 {
    font-size: 16px;
    line-height: 24px;
  }
  h3.intro {
    text-align: left;
  }
}

/* /////////////////////////////////
	Header
///////////////////////////////// */
.header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 100;
  box-sizing: border-box;
  height: 72px;
  padding: 56px 0 46px;
  background-color: transparent;
  border-bottom: solid 1px rgba(34, 34, 34, 0);
  overflow: visible;
  background-clip: padding-box !important;
  transition: opacity ease .3s, border ease .3s, background-color ease .3s;
}

.header .logo {
  float: left;
  transition: all ease .3s;
}

ul.nav {
  float: right;
  margin: 0;
  list-style-type: none;
  transition: all ease .2s;
}

ul.nav li {
  position: relative;
  display: inline-block;
  margin: 0 0 0 32px;
}

ul.nav li a {
  position: relative;
  display: block;
  font-size: 14px;
  line-height: 20px;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 3px;
}

.no-touch ul.nav li a:hover {
  color: #222;
}

.no-touch ul.nav li a:active {
  color: #222;
}

ul.nav li.current a:after {
  content: "";
  position: absolute;
  top: 50%;
  left: -4px;
  right: -3px;
  height: 1px;
  margin-top: -2px;
  background: #222;
  border: solid 1px #f1f1f1;
  background-clip: padding-box !important;
}

ul.nav.inv-strike li.current a:after {
  border-color: #fff;
}

.headroom--pinned ul.nav.inv-strike li.current a:after {
  border-color: #f1f1f1;
}

.headroom--top ul.nav.inv-strike li.current a:after {
  border-color: #fff;
}

.header.inv-logo .logo {
  color: #fff;
}

.header.inv-logo .logo .underscore {
  background: #fff;
}

.header.inv-logo .logo:hover {
  color: #fff;
}

.header.inv-logo .logo:hover .underscore {
  background: #fff;
}

.header.inv-logo.headroom--pinned .logo {
  color: #222;
}

.header.inv-logo.headroom--pinned .logo .underscore {
  background: #222;
}

.header.inv-logo.headroom--pinned .logo:hover {
  color: #222;
}

.header.inv-logo.headroom--pinned .logo:hover .underscore {
  background: #222;
}

.header.inv-logo.headroom--top .logo {
  color: #fff;
}

.header.inv-logo.headroom--top .logo .underscore {
  background: #fff;
}

.header.inv-logo.headroom--top .logo:hover {
  color: #fff;
}

.header.inv-logo.headroom--top .logo:hover .underscore {
  background: #fff;
}

.header.inv-nav ul.nav li a {
  color: #fff;
}

.no-touch .header.inv-nav ul.nav li a:hover {
  color: #fff;
  opacity: .75;
}

.no-touch .header.inv-nav ul.nav li a:active {
  color: #fff;
}

.header.inv-nav.headroom--pinned ul.nav li a {
  color: #222;
}

.no-touch .header.inv-nav.headroom--pinned ul.nav li a:hover {
  color: #222;
  opacity: 1;
}

.no-touch .header.inv-nav.headroom--pinned ul.nav li a:active {
  color: #222;
}

.header.inv-nav.headroom--top ul.nav li a {
  color: #fff;
}

.no-touch .header.inv-nav.headroom--top ul.nav li a:hover {
  color: #fff;
  opacity: .75;
}

.no-touch .header.inv-nav.headroom--top ul.nav li a:active {
  color: #fff;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .header {
    height: 112px;
  }
  .header .logo {
    float: none;
  }
  .header.inv-logo .logo,
  .header.inv-nav .logo {
    color: #fff;
  }
  .header.inv-logo .logo .underscore,
  .header.inv-nav .logo .underscore {
    background: #fff;
  }
  .header.inv-logo .logo:hover,
  .header.inv-nav .logo:hover {
    color: #fff;
  }
  .header.inv-logo .logo:hover .underscore,
  .header.inv-nav .logo:hover .underscore {
    background: #fff;
  }
  .header.inv-logo ul.nav li a,
  .header.inv-nav ul.nav li a {
    color: #fff;
  }
  .no-touch .header.inv-logo ul.nav li a:hover, .no-touch
  .header.inv-nav ul.nav li a:hover {
    color: #fff;
    opacity: .75;
  }
  .no-touch .header.inv-logo ul.nav li a:active, .no-touch
  .header.inv-nav ul.nav li a:active {
    color: #fff;
  }
  .header.inv-logo.headroom--pinned .logo,
  .header.inv-nav.headroom--pinned .logo {
    color: #222;
  }
  .header.inv-logo.headroom--pinned .logo .underscore,
  .header.inv-nav.headroom--pinned .logo .underscore {
    background: #222;
  }
  .header.inv-logo.headroom--pinned .logo:hover,
  .header.inv-nav.headroom--pinned .logo:hover {
    color: #222;
  }
  .header.inv-logo.headroom--pinned .logo:hover .underscore,
  .header.inv-nav.headroom--pinned .logo:hover .underscore {
    background: #222;
  }
  .header.inv-logo.headroom--pinned ul.nav li a,
  .header.inv-nav.headroom--pinned ul.nav li a {
    color: #222;
  }
  .no-touch .header.inv-logo.headroom--pinned ul.nav li a:hover, .no-touch
  .header.inv-nav.headroom--pinned ul.nav li a:hover {
    color: #222;
    opacity: 1;
  }
  .no-touch .header.inv-logo.headroom--pinned ul.nav li a:active, .no-touch
  .header.inv-nav.headroom--pinned ul.nav li a:active {
    color: #222;
  }
  .header.inv-logo.headroom--top .logo,
  .header.inv-nav.headroom--top .logo {
    color: #fff;
  }
  .header.inv-logo.headroom--top .logo .underscore,
  .header.inv-nav.headroom--top .logo .underscore {
    background: #fff;
  }
  .header.inv-logo.headroom--top .logo:hover,
  .header.inv-nav.headroom--top .logo:hover {
    color: #fff;
  }
  .header.inv-logo.headroom--top .logo:hover .underscore,
  .header.inv-nav.headroom--top .logo:hover .underscore {
    background: #fff;
  }
  .header.inv-logo.headroom--top ul.nav li a,
  .header.inv-nav.headroom--top ul.nav li a {
    color: #fff;
  }
  .no-touch .header.inv-logo.headroom--top ul.nav li a:hover, .no-touch
  .header.inv-nav.headroom--top ul.nav li a:hover {
    color: #fff;
    opacity: .75;
  }
  .no-touch .header.inv-logo.headroom--top ul.nav li a:active, .no-touch
  .header.inv-nav.headroom--top ul.nav li a:active {
    color: #fff;
  }
  ul.nav {
    float: none;
    margin-top: 20px;
  }
  ul.nav li {
    margin: 0 32px 0 0;
  }
}

@media (max-width: 557px) {
  .header {
    height: 84px;
    padding: 36px 0 26px;
  }
  .header .logo {
    float: none;
  }
  .header.inv-logo .logo,
  .header.inv-nav .logo {
    color: #fff;
  }
  .header.inv-logo .logo .underscore,
  .header.inv-nav .logo .underscore {
    background: #fff;
  }
  .header.inv-logo .logo:hover,
  .header.inv-nav .logo:hover {
    color: #fff;
  }
  .header.inv-logo .logo:hover .underscore,
  .header.inv-nav .logo:hover .underscore {
    background: #fff;
  }
  .header.inv-logo ul.nav li a,
  .header.inv-nav ul.nav li a {
    color: #fff;
  }
  .no-touch .header.inv-logo ul.nav li a:hover, .no-touch
  .header.inv-nav ul.nav li a:hover {
    color: #fff;
    opacity: .75;
  }
  .no-touch .header.inv-logo ul.nav li a:active, .no-touch
  .header.inv-nav ul.nav li a:active {
    color: #fff;
  }
  .header.inv-logo.headroom--pinned .logo,
  .header.inv-nav.headroom--pinned .logo {
    color: #222;
  }
  .header.inv-logo.headroom--pinned .logo .underscore,
  .header.inv-nav.headroom--pinned .logo .underscore {
    background: #222;
  }
  .header.inv-logo.headroom--pinned .logo:hover,
  .header.inv-nav.headroom--pinned .logo:hover {
    color: #222;
  }
  .header.inv-logo.headroom--pinned .logo:hover .underscore,
  .header.inv-nav.headroom--pinned .logo:hover .underscore {
    background: #222;
  }
  .header.inv-logo.headroom--pinned ul.nav li a,
  .header.inv-nav.headroom--pinned ul.nav li a {
    color: #222;
  }
  .no-touch .header.inv-logo.headroom--pinned ul.nav li a:hover, .no-touch
  .header.inv-nav.headroom--pinned ul.nav li a:hover {
    color: #222;
    opacity: 1;
  }
  .no-touch .header.inv-logo.headroom--pinned ul.nav li a:active, .no-touch
  .header.inv-nav.headroom--pinned ul.nav li a:active {
    color: #222;
  }
  .header.inv-logo.headroom--top .logo,
  .header.inv-nav.headroom--top .logo {
    color: #fff;
  }
  .header.inv-logo.headroom--top .logo .underscore,
  .header.inv-nav.headroom--top .logo .underscore {
    background: #fff;
  }
  .header.inv-logo.headroom--top .logo:hover,
  .header.inv-nav.headroom--top .logo:hover {
    color: #fff;
  }
  .header.inv-logo.headroom--top .logo:hover .underscore,
  .header.inv-nav.headroom--top .logo:hover .underscore {
    background: #fff;
  }
  .header.inv-logo.headroom--top ul.nav li a,
  .header.inv-nav.headroom--top ul.nav li a {
    color: #fff;
  }
  .no-touch .header.inv-logo.headroom--top ul.nav li a:hover, .no-touch
  .header.inv-nav.headroom--top ul.nav li a:hover {
    color: #fff;
    opacity: .75;
  }
  .no-touch .header.inv-logo.headroom--top ul.nav li a:active, .no-touch
  .header.inv-nav.headroom--top ul.nav li a:active {
    color: #fff;
  }
  ul.nav {
    float: none;
    margin-top: 12px;
    margin-right: -20px;
  }
  ul.nav li {
    margin: 0 19px 0 0;
  }
  ul.nav li a {
    font-size: 11px;
    letter-spacing: 1px;
  }
}

/* /////////////////////////////////
	Fixed or hidden header when scrolling - using headroom.js
///////////////////////////////// */
.header.headroom--unpinned {
  position: fixed;
  padding: 26px 0;
  opacity: 0;
}

.header.headroom--pinned {
  position: fixed;
  padding: 26px 0;
  background-color: rgba(241, 241, 241, 0.9);
  border-bottom: solid 1px rgba(34, 34, 34, 0.08);
  opacity: 1;
}

.header.headroom--top {
  position: absolute !important;
  padding: 56px 0 46px;
  background-color: transparent;
  border-bottom: solid 1px rgba(34, 34, 34, 0) !important;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .header.headroom--unpinned {
    height: 52px;
    padding: 16px 0;
  }
  .header.headroom--unpinned .logo {
    position: relative;
    top: -38px;
  }
  .header.headroom--unpinned ul.nav {
    margin-top: -20px;
  }
  .header.headroom--pinned {
    height: 52px;
    padding: 16px 0;
  }
  .header.headroom--pinned .logo {
    position: relative;
    top: -38px;
  }
  .header.headroom--pinned ul.nav {
    margin-top: -20px;
  }
  .header.headroom--top {
    height: 112px !important;
    padding: 56px 0 46px !important;
  }
  .header.headroom--top .logo {
    top: 0;
  }
  .header.headroom--top ul.nav {
    margin-top: 20px;
  }
}

@media (max-width: 557px) {
  .header.headroom--unpinned {
    height: 44px;
    padding: 12px 0;
  }
  .header.headroom--unpinned .logo {
    position: relative;
    top: -32px;
  }
  .header.headroom--unpinned ul.nav {
    margin-top: -20px;
  }
  .header.headroom--pinned {
    height: 44px;
    padding: 12px 0;
  }
  .header.headroom--pinned .logo {
    position: relative;
    top: -32px;
  }
  .header.headroom--pinned ul.nav {
    margin-top: -20px;
  }
  .header.headroom--top {
    height: 84px !important;
    padding: 36px 0 26px !important;
  }
  .header.headroom--top .logo {
    top: 0;
  }
  .header.headroom--top ul.nav {
    margin-top: 12px;
  }
}

/* /////////////////////////////////
	FOOTER
///////////////////////////////// */
.footer {
  position: fixed;
  z-index: 0;
  left: 0;
  right: 0;
  bottom: 0;
  box-sizing: border-box;
  height: 455px;
  padding: 123px 0 120px;
  background: #222;
  color: #9b9b9b;
}

.footer .monogram {
  float: left;
  margin-bottom: 114px;
}

.footer p {
  clear: left;
  margin: 0;
}

.footer a.email {
  position: absolute;
  top: 0;
  right: 440px;
  display: inline-block;
  margin-top: 18px;
  float: right;
  font-size: 18px;
  line-height: 24px;
  font-weight: bold;
  color: #fff !important;
  border-bottom: solid 1px rgba(255, 255, 255, 0);
}

.no-touch .footer a.email:hover {
  border-bottom: solid 1px rgba(255, 255, 255, 0.24);
}

ul.social {
  float: right;
  margin: 0 -20px 0 0;
}

ul.social li {
  display: inline-block;
  margin: 0 2px;
}

ul.social a {
  height: 60px;
  width: 60px;
  border-radius: 50%;
}

ul.social a.houzz {
  background: transparent url("/img/icons/social-houzz.svg") no-repeat center center;
}

ul.social a.archipro {
  background: transparent url("/img/icons/social-archipro.svg") no-repeat center center;
}

ul.social a.facebook {
  background: transparent url("/img/icons/social-facebook.svg") no-repeat center center;
}

ul.social a.instagram {
  background: transparent url("/img/icons/social-instagram.svg") no-repeat center center;
}

ul.social a.pinterest {
  background: transparent url("/img/icons/social-pinterest.svg") no-repeat center center;
}

.no-touch ul.social a:hover {
  background-color: #343434;
}

.no-touch ul.social a:active {
  background-color: #f1f1f1;
}

a.benek {
  margin: 0;
  color: #9b9b9b !important;
}

a.benek > span {
  display: inline-block;
  width: 43px;
  height: 11px;
  margin-right: 4px;
  background: transparent url("/img/benek.svg") no-repeat center center;
  transition: all ease .2s;
}

.no-touch a.benek:hover {
  color: #c1c1c1 !important;
}

.no-touch a.benek:active {
  color: #9b9b9b !important;
}

@media (min-width: 1024px) and (max-width: 1279px) and (orientation: landscape) {
  .footer {
    height: 405px;
    padding: 103px 0 100px;
  }
}

@media (min-width: 558px) and (max-width: 1023px) {
  .footer {
    height: 415px;
    padding: 83px 0 80px;
  }
  .footer .monogram {
    margin-bottom: 74px;
  }
  .footer a.email {
    position: static;
    right: 0;
    float: right;
  }
  ul.social {
    float: none;
    clear: left;
    margin: 0 0 12px -22px;
  }
}

@media (min-width: 558px) and (max-width: 1023px) and (orientation: landscape) {
  .footer {
    height: 315px;
    padding: 53px 0 40px;
  }
  .footer .monogram {
    margin-bottom: 44px;
  }
}

@media (max-width: 557px) {
  .footer {
    height: 395px;
    padding: 63px 0 40px;
  }
  .footer .monogram {
    float: none;
    margin-bottom: 34px;
  }
  .footer a.email {
    position: static;
    right: 0;
    float: none;
    margin: 0 0 46px 0;
  }
  ul.social {
    float: none;
    clear: left;
    margin: 0 0 14px -15px;
  }
  ul.social li {
    margin: 0;
  }
  ul.social a {
    width: 50px;
    height: 50px;
  }
}

@media (max-width: 557px) and (orientation: landscape) {
  .footer {
    height: 375px;
    padding: 53px 0 30px;
  }
}

/* /////////////////////////////////
	Grids
///////////////////////////////// */
.grid {
  position: relative;
  z-index: 0;
  width: 100%;
}

.grid.grid-home {
  margin-top: 13.04348%;
  margin-bottom: -4.34783%;
}

.grid.grid-masonry {
  margin-top: 8.69565%;
  margin-bottom: -4.34783%;
}

.grid.grid-news {
  margin-top: 8.69565%;
  margin-bottom: -4.34783%;
}

.grid.grid-gallery {
  margin-top: 8.69565%;
  margin-bottom: -4.34783%;
}

.in-article .grid.grid-gallery {
  margin-top: 0;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .grid {
    width: calc(100% + 40px);
    margin-left: -20px;
    margin-right: -20px;
  }
  .grid.grid-home {
    margin-top: 17.64706%;
    margin-bottom: -5.88235%;
  }
  .grid.grid-masonry {
    margin-top: 11.76471%;
    margin-bottom: -5.88235%;
  }
  .grid.grid-news {
    margin-top: 11.76471%;
    margin-bottom: -5.88235%;
  }
  .grid.grid-gallery {
    margin-top: 11.76471%;
    margin-bottom: -5.88235%;
  }
}

@media (max-width: 557px) {
  .grid {
    width: calc(100% + 20px);
    margin-left: -10px;
    margin-right: -10px;
  }
  .grid.grid-home {
    margin-top: 21.42857%;
    margin-bottom: -10.71429%;
  }
  .grid.grid-masonry {
    margin-top: 21.42857%;
    margin-bottom: -10.71429%;
  }
  .grid.grid-news {
    margin-top: 21.42857%;
    margin-bottom: -10.71429%;
  }
  .grid.grid-gallery {
    margin-top: 21.42857%;
    margin-bottom: -10.71429%;
  }
}

/* /////////////////////////////////
	Block Group
///////////////////////////////// */
.block-group {
  position: relative;
  z-index: 0;
}

.block-group.bump-up1 {
  margin-top: -4.34783%;
}

.block-group.bump-up2 {
  margin-top: -8.69565%;
}

.block-group.bump-up3 {
  margin-top: -13.04348%;
}

.block-group.bump-up4 {
  margin-top: -17.3913%;
}

.block-group.bump-up5 {
  margin-top: -21.73913%;
}

.block-group.bump-down1 {
  margin-top: 4.34783%;
}

.block-group.bump-down2 {
  margin-top: 8.69565%;
}

.block-group.bump-down3 {
  margin-top: 13.04348%;
}

.block-group.bump-down4 {
  margin-top: 17.3913%;
}

.block-group.bump-down5 {
  margin-top: 21.73913%;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .block-group.bump-up1 {
    margin-top: -5.88235%;
  }
  .block-group.bump-up2 {
    margin-top: -11.76471%;
  }
  .block-group.bump-up3 {
    margin-top: -17.64706%;
  }
  .block-group.bump-up4 {
    margin-top: -23.52941%;
  }
  .block-group.bump-up5 {
    margin-top: -29.41176%;
  }
  .block-group.bump-down1 {
    margin-top: 5.88235%;
  }
  .block-group.bump-down2 {
    margin-top: 11.76471%;
  }
  .block-group.bump-down3 {
    margin-top: 17.64706%;
  }
  .block-group.bump-down4 {
    margin-top: 23.52941%;
  }
  .block-group.bump-down5 {
    margin-top: 29.41176%;
  }
}

@media (max-width: 557px) {
  .block-group.bump-up1 {
    margin-top: 0;
  }
  .block-group.bump-up2 {
    margin-top: 0;
  }
  .block-group.bump-up3 {
    margin-top: 0;
  }
  .block-group.bump-up4 {
    margin-top: 0;
  }
  .block-group.bump-up5 {
    margin-top: 0;
  }
  .block-group.bump-down1 {
    margin-top: 0;
  }
  .block-group.bump-down2 {
    margin-top: 0;
  }
  .block-group.bump-down3 {
    margin-top: 0;
  }
  .block-group.bump-down4 {
    margin-top: 0;
  }
  .block-group.bump-down5 {
    margin-top: 0;
  }
}

/* /////////////////////////////////
	Block
///////////////////////////////// */
a.block,
figure.block {
  position: relative;
  z-index: 0;
  display: block;
  margin-bottom: 8.69565%;
  transition: none !important;
}

@media (min-width: 558px) and (max-width: 1023px) {
  a.block,
  figure.block {
    margin-bottom: 11.76471%;
  }
}

@media (max-width: 557px) {
  a.block,
  figure.block {
    margin-bottom: 21.42857%;
  }
}

a.block .label,
figure.block .label {
  max-width: 620px;
  margin: 24px 0 0 0;
  transition: all ease .3s;
}

a.block .label strong,
figure.block .label strong {
  display: inline-block;
  font-weight: bold;
  margin-right: 12px;
}

a.block .label em,
figure.block .label em {
  display: inline-block;
  font-style: normal;
  color: #666;
}

a.block .summary,
figure.block .summary {
  max-width: 620px;
  margin: 14px 0 0 0;
}

a.block .caption,
figure.block .caption {
  max-width: 620px;
  margin: 24px 0 0 0;
}

a.block.full,
figure.block.full {
  width: 100%;
}

a.block.xl,
figure.block.xl {
  width: 88.4058%;
}

a.block.xl-h,
figure.block.xl-h {
  width: 65.21739%;
  width: calc(65.21739% + 60px);
}

a.block.lg,
figure.block.lg {
  width: 65.21739%;
}

a.block.md,
figure.block.md {
  width: 47.82609%;
}

a.block.md-sm,
figure.block.md-sm {
  width: 42.02899%;
}

a.block.sm,
figure.block.sm {
  width: 30.43478%;
}

a.block.xs,
figure.block.xs {
  width: 30.43478%;
}

@media (min-width: 558px) and (max-width: 1023px) {
  a.block.full,
  figure.block.full {
    width: 100%;
  }
  a.block.xl,
  figure.block.xl {
    width: 100%;
  }
  a.block.xl-h,
  figure.block.xl-h {
    width: 58.82353%;
    width: calc(58.82353% + 30px);
  }
  a.block.lg,
  figure.block.lg {
    width: 82.35294%;
  }
  a.block.md,
  figure.block.md {
    width: 47.05882%;
  }
  a.block.md-sm,
  figure.block.md-sm {
    width: 47.05882%;
  }
  a.block.sm,
  figure.block.sm {
    width: 47.05882%;
  }
  a.block.xs,
  figure.block.xs {
    width: 35.29412%;
  }
}

@media (max-width: 557px) {
  a.block.full,
  figure.block.full {
    width: 100%;
    width: calc(100% + 40px);
  }
  a.block.xl,
  figure.block.xl {
    width: 100%;
    width: calc(100% + 20p);
  }
  a.block.xl-h,
  figure.block.xl-h {
    width: 100%;
    width: calc(100% + 20px);
  }
  a.block.lg,
  figure.block.lg {
    width: 100%;
  }
  a.block.md,
  figure.block.md {
    width: 89.28571%;
  }
  a.block.md-sm,
  figure.block.md-sm {
    width: 82.14286%;
  }
  a.block.sm,
  figure.block.sm {
    width: 82.14286%;
  }
  a.block.xs,
  figure.block.xs {
    width: 82.14286%;
  }
}

a.block.left-out,
figure.block.left-out {
  float: left;
  margin-left: -80px;
}

a.block.left-out p,
figure.block.left-out p {
  margin-left: 40px;
}

a.block.left,
figure.block.left {
  float: left;
}

a.block.left-1,
figure.block.left-1 {
  float: left;
  margin-left: 4.34783%;
}

a.block.left-2,
figure.block.left-2 {
  float: left;
  margin-left: 8.69565%;
}

a.block.left-3,
figure.block.left-3 {
  float: left;
  margin-left: 13.04348%;
}

a.block.left-4,
figure.block.left-4 {
  float: left;
  margin-left: 17.3913%;
}

a.block.left-5,
figure.block.left-5 {
  float: left;
  margin-left: 21.73913%;
}

a.block.left-6,
figure.block.left-6 {
  float: left;
  margin-left: 26.08696%;
}

a.block.right-out,
figure.block.right-out {
  float: right;
  margin-right: -80px;
}

a.block.right-out p,
figure.block.right-out p {
  margin-right: 40px;
}

a.block.right,
figure.block.right {
  float: right;
}

a.block.right-1,
figure.block.right-1 {
  float: right;
  margin-right: 4.34783%;
}

a.block.right-2,
figure.block.right-2 {
  float: right;
  margin-right: 8.69565%;
}

a.block.right-3,
figure.block.right-3 {
  float: right;
  margin-right: 13.04348%;
}

a.block.right-4,
figure.block.right-4 {
  float: right;
  margin-right: 17.3913%;
}

a.block.right-5,
figure.block.right-5 {
  float: right;
  margin-right: 21.73913%;
}

a.block.right-6,
figure.block.right-6 {
  float: right;
  margin-right: 26.08696%;
}

a.block.center,
figure.block.center {
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 558px) and (max-width: 1023px) {
  a.block.left-out,
  figure.block.left-out {
    margin-left: -40px;
  }
  a.block.left-1,
  figure.block.left-1 {
    margin-left: 5.88235%;
  }
  a.block.left-2,
  figure.block.left-2 {
    margin-left: 5.88235%;
  }
  a.block.left-3,
  figure.block.left-3 {
    margin-left: 5.88235%;
  }
  a.block.left-4,
  figure.block.left-4 {
    margin-left: 5.88235%;
  }
  a.block.left-5,
  figure.block.left-5 {
    margin-left: 5.88235%;
  }
  a.block.left-6,
  figure.block.left-6 {
    margin-left: 5.88235%;
  }
  a.block.right-out,
  figure.block.right-out {
    margin-right: -40px;
  }
  a.block.right-1,
  figure.block.right-1 {
    margin-right: 5.88235%;
  }
  a.block.right-2,
  figure.block.right-2 {
    margin-right: 5.88235%;
  }
  a.block.right-3,
  figure.block.right-3 {
    margin-right: 5.88235%;
  }
  a.block.right-4,
  figure.block.right-4 {
    margin-right: 5.88235%;
  }
  a.block.right-5,
  figure.block.right-5 {
    margin-right: 5.88235%;
  }
  a.block.right-6,
  figure.block.right-6 {
    margin-right: 5.88235%;
  }
}

@media (max-width: 557px) {
  a.block.left-out,
  figure.block.left-out {
    margin-left: -20px;
  }
  a.block.left-out p,
  figure.block.left-out p {
    margin-left: 20px;
  }
  a.block.left-1,
  figure.block.left-1 {
    margin-left: 0;
  }
  a.block.left-2,
  figure.block.left-2 {
    margin-left: 0;
  }
  a.block.left-3,
  figure.block.left-3 {
    margin-left: 0;
  }
  a.block.left-4,
  figure.block.left-4 {
    margin-left: 0;
  }
  a.block.left-5,
  figure.block.left-5 {
    margin-left: 0;
  }
  a.block.left-6,
  figure.block.left-6 {
    margin-left: 0;
  }
  a.block.right-out,
  figure.block.right-out {
    margin-right: -20px;
  }
  a.block.right-out p,
  figure.block.right-out p {
    margin-right: 20px;
  }
  a.block.right-1,
  figure.block.right-1 {
    margin-right: 0;
  }
  a.block.right-2,
  figure.block.right-2 {
    margin-right: 0;
  }
  a.block.right-3,
  figure.block.right-3 {
    margin-right: 0;
  }
  a.block.right-4,
  figure.block.right-4 {
    margin-right: 0;
  }
  a.block.right-5,
  figure.block.right-5 {
    margin-right: 0;
  }
  a.block.right-6,
  figure.block.right-6 {
    margin-right: 0;
  }
  a.block.left.mob-switch,
  figure.block.left.mob-switch {
    float: right;
  }
  a.block.left-1.mob-switch,
  figure.block.left-1.mob-switch {
    float: right;
    margin-left: 0;
  }
  a.block.left-2.mob-switch,
  figure.block.left-2.mob-switch {
    float: right;
    margin-left: 0;
  }
  a.block.left-3.mob-switch,
  figure.block.left-3.mob-switch {
    float: right;
    margin-left: 0;
  }
  a.block.left-4.mob-switch,
  figure.block.left-4.mob-switch {
    float: right;
    margin-left: 0;
  }
  a.block.left-5.mob-switch,
  figure.block.left-5.mob-switch {
    float: right;
    margin-left: 0;
  }
  a.block.left-6.mob-switch,
  figure.block.left-6.mob-switch {
    float: right;
    margin-left: 0;
  }
  a.block.right.mob-switch,
  figure.block.right.mob-switch {
    float: left;
  }
  a.block.right-1.mob-switch,
  figure.block.right-1.mob-switch {
    float: left;
    margin-right: 0;
  }
  a.block.right-2.mob-switch,
  figure.block.right-2.mob-switch {
    float: left;
    margin-right: 0;
  }
  a.block.right-3.mob-switch,
  figure.block.right-3.mob-switch {
    float: left;
    margin-right: 0;
  }
  a.block.right-4.mob-switch,
  figure.block.right-4.mob-switch {
    float: left;
    margin-right: 0;
  }
  a.block.right-5.mob-switch,
  figure.block.right-5.mob-switch {
    float: left;
    margin-right: 0;
  }
  a.block.right-6.mob-switch,
  figure.block.right-6.mob-switch {
    float: left;
    margin-right: 0;
  }
}

a.block.bump-up1,
figure.block.bump-up1 {
  margin-top: -4.34783%;
}

a.block.bump-up2,
figure.block.bump-up2 {
  margin-top: -8.69565%;
}

a.block.bump-up3,
figure.block.bump-up3 {
  margin-top: -13.04348%;
}

a.block.bump-up4,
figure.block.bump-up4 {
  margin-top: -17.3913%;
}

a.block.bump-up5,
figure.block.bump-up5 {
  margin-top: -21.73913%;
}

a.block.bump-down1,
figure.block.bump-down1 {
  margin-top: 4.34783%;
}

a.block.bump-down2,
figure.block.bump-down2 {
  margin-top: 8.69565%;
}

a.block.bump-down3,
figure.block.bump-down3 {
  margin-top: 13.04348%;
}

a.block.bump-down4,
figure.block.bump-down4 {
  margin-top: 17.3913%;
}

a.block.bump-down5,
figure.block.bump-down5 {
  margin-top: 21.73913%;
}

@media (min-width: 558px) and (max-width: 1023px) {
  a.block.bump-up1,
  figure.block.bump-up1 {
    margin-top: -5.88235%;
  }
  a.block.bump-up2,
  figure.block.bump-up2 {
    margin-top: -11.76471%;
  }
  a.block.bump-up3,
  figure.block.bump-up3 {
    margin-top: -17.64706%;
  }
  a.block.bump-up4,
  figure.block.bump-up4 {
    margin-top: -23.52941%;
  }
  a.block.bump-up5,
  figure.block.bump-up5 {
    margin-top: -29.41176%;
  }
  a.block.bump-down1,
  figure.block.bump-down1 {
    margin-top: 5.88235%;
  }
  a.block.bump-down2,
  figure.block.bump-down2 {
    margin-top: 11.76471%;
  }
  a.block.bump-down3,
  figure.block.bump-down3 {
    margin-top: 17.64706%;
  }
  a.block.bump-down4,
  figure.block.bump-down4 {
    margin-top: 23.52941%;
  }
  a.block.bump-down5,
  figure.block.bump-down5 {
    margin-top: 29.41176%;
  }
}

@media (max-width: 557px) {
  a.block.bump-up1,
  figure.block.bump-up1 {
    margin-top: 0;
  }
  a.block.bump-up2,
  figure.block.bump-up2 {
    margin-top: 0;
  }
  a.block.bump-up3,
  figure.block.bump-up3 {
    margin-top: 0;
  }
  a.block.bump-up4,
  figure.block.bump-up4 {
    margin-top: 0;
  }
  a.block.bump-up5,
  figure.block.bump-up5 {
    margin-top: 0;
  }
  a.block.bump-down1,
  figure.block.bump-down1 {
    margin-top: 0;
  }
  a.block.bump-down2,
  figure.block.bump-down2 {
    margin-top: 0;
  }
  a.block.bump-down3,
  figure.block.bump-down3 {
    margin-top: 0;
  }
  a.block.bump-down4,
  figure.block.bump-down4 {
    margin-top: 0;
  }
  a.block.bump-down5,
  figure.block.bump-down5 {
    margin-top: 0;
  }
}

/* /////////////////////////////////
	Blockquote
///////////////////////////////// */
blockquote {
  margin-bottom: 8.69565%;
}

blockquote h3 {
  text-align: justify;
}

blockquote h3:before {
  content: open-quote;
  margin-left: -.48em;
}

blockquote h3:after {
  content: close-quote;
}

blockquote p {
  margin: 24px 0 0 0;
}

blockquote p strong {
  display: block;
}

blockquote p em {
  display: block;
  font-style: normal;
  color: #666;
}

blockquote.left {
  width: 42.02899%;
  float: right;
  margin-right: 52.17391%;
}

blockquote.right {
  width: 42.02899%;
  float: left;
  margin-left: 52.17391%;
}

blockquote.center {
  width: 47.82609%;
  margin-left: auto;
  margin-right: auto;
}

@media (min-width: 558px) and (max-width: 1023px) {
  blockquote {
    margin-bottom: 11.76471%;
  }
  blockquote.left {
    float: left;
    width: 58.82353%;
    margin-right: 0;
    margin-left: 10px;
  }
  blockquote.right {
    float: right;
    width: 58.82353%;
    margin-left: 0;
    margin-right: 10px;
  }
  blockquote.center {
    width: 82.35294%;
  }
}

@media (max-width: 557px) {
  blockquote {
    margin-bottom: 21.42857%;
  }
  blockquote h3 {
    text-align: left;
  }
  blockquote.left, blockquote.right, blockquote.center {
    width: auto;
    margin-left: 10px;
    margin-right: 10px;
  }
}

/* /////////////////////////////////
	Image Box
///////////////////////////////// */
.img-box {
  width: 100%;
  background: #e7e7e7;
  overflow: hidden;
}

.img-box.horz {
  position: relative;
}

.img-box.horz:before {
  display: block;
  content: "";
  width: 100%;
  padding-top: 75%;
}

.img-box.horz > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: all ease .4s;
}

.img-box.vert {
  position: relative;
}

.img-box.vert:before {
  display: block;
  content: "";
  width: 100%;
  padding-top: 133.33333%;
}

.img-box.vert > img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  transition: all ease .4s;
}

.img-box > img {
  opacity: 0;
}

.img-box > img.b-loaded {
  opacity: 1;
}

.invert .img-box {
  background: whitesmoke;
}

.img-box.loaded .load-img {
  display: none;
}

/* /////////////////////////////////
	Special caption placements
///////////////////////////////// */
.block .caption.left-out {
  position: absolute;
  top: 33%;
  left: -40%;
  left: calc(-33% - 60px);
  width: 33%;
  text-align: justify;
}

.block .caption.right-out {
  position: absolute;
  top: 33%;
  right: -40%;
  right: calc(-33% - 60px);
  width: 33%;
  text-align: justify;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .block .caption.left-out, .block .caption.right-out {
    position: static;
    top: 0;
    left: 0;
    right: 0;
    width: auto;
    text-align: left;
  }
}

@media (max-width: 557px) {
  .block .caption.left-out, .block .caption.right-out {
    position: static;
    top: 0;
    left: 0;
    right: 0;
    width: auto;
    text-align: left;
  }
}

/* /////////////////////////////////
	Masonry Blocks
///////////////////////////////// */
.grid-masonry a.block.sm,
.grid-masonry figure.block.sm {
  float: left;
  margin-right: 4.34783%;
}

.grid-masonry a.block.sm:nth-child(3n),
.grid-masonry figure.block.sm:nth-child(3n) {
  margin-right: 0;
}

.masonry-gutter {
  display: block;
  width: 4.34783%;
}

.masonry-sizer {
  display: block;
  width: 30.43478%;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .grid-masonry a.block.sm,
  .grid-masonry figure.block.sm {
    margin-right: 5.88235%;
  }
  .grid-masonry a.block.sm:nth-child(3n),
  .grid-masonry figure.block.sm:nth-child(3n) {
    margin-right: 5.88235%;
  }
  .grid-masonry a.block.sm:nth-child(2n),
  .grid-masonry figure.block.sm:nth-child(2n) {
    margin-right: 0;
  }
  .grid-masonry a.block.sm:nth-child(3),
  .grid-masonry figure.block.sm:nth-child(3) {
    margin-top: 0 !important;
  }
  .masonry-gutter {
    width: 5.88235%;
  }
  .masonry-sizer {
    width: 47.05882%;
  }
}

@media (max-width: 557px) {
  .grid-masonry a.block.sm,
  .grid-masonry figure.block.sm {
    width: 100%;
    margin-right: 0;
  }
  .grid-masonry a.block.sm p.label,
  .grid-masonry a.block.sm p.summary,
  .grid-masonry figure.block.sm p.label,
  .grid-masonry figure.block.sm p.summary {
    margin-left: 10px;
    margin-right: 10px;
  }
  .masonry-gutter {
    width: 0%;
  }
  .masonry-sizer {
    width: 82.14286%;
  }
}

/* /////////////////////////////////
	News Blocks
///////////////////////////////// */
.grid-news a.block p.summary {
  text-align: justify;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .grid-news a.block.lg {
    width: 58.82353%;
    width: calc(58.82353% + 40px);
  }
  .grid-news a.block.lg.left {
    margin-left: -40px;
  }
  .grid-news a.block.lg.left p.label,
  .grid-news a.block.lg.left p.summary {
    margin-left: 40px;
  }
  .grid-news a.block.lg.right {
    margin-right: -40px;
  }
  .grid-news a.block.lg.right p.label,
  .grid-news a.block.lg.right p.summary {
    margin-right: 40px;
  }
  .grid-news .block-group a.block.sm:nth-child(3) {
    margin-top: 0 !important;
  }
  .grid-news a.block.sm.bump-up1 {
    margin-top: 0 !important;
  }
  .grid-news a.block.drop {
    display: none;
  }
}

@media (max-width: 557px) {
  .grid-news a.block.lg {
    width: 100%;
    width: calc(100% + 20px);
  }
  .grid-news a.block.lg.left {
    margin-left: -20px;
  }
  .grid-news a.block.lg.left p.label,
  .grid-news a.block.lg.left p.summary {
    margin-left: 20px;
  }
  .grid-news a.block.lg.right {
    margin-right: -20px;
  }
  .grid-news a.block.lg.right p.label,
  .grid-news a.block.lg.right p.summary {
    margin-right: 20px;
  }
  .grid-news a.block.sm {
    width: 100%;
  }
  .grid-news .block-group a.block.sm:nth-child(2) {
    width: 82.14286%;
    float: right;
  }
  .grid-news a.block.drop {
    display: none;
  }
  .grid-news a.block p.summary {
    text-align: left;
  }
}

/* /////////////////////////////////
	Gallery Blocks
///////////////////////////////// */
.grid-gallery .block p.caption {
  text-align: justify;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .grid-gallery .block.md {
    width: 58.82353%;
    width: calc(58.82353% + 40px);
  }
  .grid-gallery .block.md.left {
    margin-left: -40px;
  }
  .grid-gallery .block.md.left p.label,
  .grid-gallery .block.md.left p.summary,
  .grid-gallery .block.md.left a.arrow {
    margin-left: 40px;
  }
  .grid-gallery .block.md.right {
    margin-right: -40px;
  }
  .grid-gallery .block.md.right p.label,
  .grid-gallery .block.md.right p.summary,
  .grid-gallery .block.md.right a.arrow {
    margin-right: 40px;
  }
}

@media (max-width: 557px) {
  .grid-gallery .block.xl {
    width: 100%;
    width: calc(100% + 40px);
    margin-left: -20px;
    margin-right: -20px;
  }
  .grid-gallery .block.xl p.label,
  .grid-gallery .block.xl p.summary,
  .grid-gallery .block.xl p.caption,
  .grid-gallery .block.xl a.arrow {
    margin-left: 20px;
    margin-right: 20px;
  }
  .grid-gallery .block.md {
    width: 89.28571%;
  }
  .grid-gallery .block.md.left {
    margin-left: -20px;
  }
  .grid-gallery .block.md.left p.label,
  .grid-gallery .block.md.left p.summary,
  .grid-gallery .block.md.left a.arrow {
    margin-left: 20px;
  }
  .grid-gallery .block.md.right {
    margin-right: -20px;
  }
  .grid-gallery .block.md.right p.label,
  .grid-gallery .block.md.right p.summary,
  .grid-gallery .block.md.right a.arrow {
    margin-right: 20px;
  }
  .grid-gallery .block p.caption {
    text-align: left;
  }
}

/* /////////////////////////////////
	Text Blocks
///////////////////////////////// */
.text-block {
  position: relative;
  z-index: 0;
  display: block;
}

.text-block.sm {
  width: 30.43478%;
}

.text-block.sm img {
  width: 100%;
}

.text-block.lg {
  width: 65.21739%;
  max-width: 900px;
}

.text-block.left {
  float: left;
}

.text-block.right {
  float: left;
  margin-left: 4.34783%;
}

.text-block.hero-sm {
  margin-top: -160px;
}

.text-block.keep-left {
  margin-bottom: 0;
}

.text-block.bump-up1 {
  margin-top: -4.34783%;
}

.text-block.bump-up2 {
  margin-top: -8.69565%;
}

.text-block.bump-up3 {
  margin-top: -13.04348%;
}

.text-block.bump-up4 {
  margin-top: -17.3913%;
}

.text-block.bump-up5 {
  margin-top: -21.73913%;
}

.text-block.bump-down1 {
  margin-top: 4.34783%;
}

.text-block.bump-down2 {
  margin-top: 8.69565%;
}

.text-block.bump-down3 {
  margin-top: 13.04348%;
}

.text-block.bump-down4 {
  margin-top: 17.3913%;
}

.text-block.bump-down5 {
  margin-top: 21.73913%;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .text-block.sm, .text-block.lg {
    width: auto;
  }
  .text-block.sm {
    margin-bottom: 40px;
  }
  .text-block.left, .text-block.right {
    float: none;
    margin-left: 0;
  }
  .text-block.hero-sm {
    float: left;
    width: 35.29412%;
    margin: -120px 40px 40px -20px;
  }
  .text-block.sm.keep-left {
    float: left;
    width: 35.29412%;
    margin: 0 40px 0 0;
  }
  .text-block.lg.keep-right {
    width: calc(58.82353% - 20px);
    float: right;
    margin-left: 0;
  }
  .text-block.bump-up1 {
    margin-top: -5.88235%;
  }
  .text-block.bump-up2 {
    margin-top: -11.76471%;
  }
  .text-block.bump-up3 {
    margin-top: -17.64706%;
  }
  .text-block.bump-up4 {
    margin-top: -23.52941%;
  }
  .text-block.bump-up5 {
    margin-top: -29.41176%;
  }
  .text-block.bump-down1 {
    margin-top: 5.88235%;
  }
  .text-block.bump-down2 {
    margin-top: 11.76471%;
  }
  .text-block.bump-down3 {
    margin-top: 17.64706%;
  }
  .text-block.bump-down4 {
    margin-top: 23.52941%;
  }
  .text-block.bump-down5 {
    margin-top: 29.41176%;
  }
}

@media (max-width: 557px) {
  .text-block.sm, .text-block.lg {
    width: auto;
  }
  .text-block.sm {
    margin-bottom: 40px;
  }
  .text-block.sm.mobile-only {
    margin-top: 40px;
    margin-bottom: 0;
  }
  .text-block.left, .text-block.right {
    float: none;
    margin-left: 0;
  }
  .text-block.hero-sm {
    margin: -100px -10px 40px -10px;
  }
  .text-block.bump-up1 {
    margin-top: 0;
  }
  .text-block.bump-up2 {
    margin-top: 0;
  }
  .text-block.bump-up3 {
    margin-top: 0;
  }
  .text-block.bump-up4 {
    margin-top: 0;
  }
  .text-block.bump-up5 {
    margin-top: 0;
  }
  .text-block.bump-down1 {
    margin-top: 0;
  }
  .text-block.bump-down2 {
    margin-top: 0;
  }
  .text-block.bump-down3 {
    margin-top: 0;
  }
  .text-block.bump-down4 {
    margin-top: 0;
  }
  .text-block.bump-down5 {
    margin-top: 0;
  }
}

/* /////////////////////////////////
	Hovers
///////////////////////////////// */
.no-touch .grid-home a.block {
  -webkit-backface-visibility: hidden;
}

.no-touch .grid-home a.block img {
  filter: grayscale(100%);
  -webkit-backface-visibility: hidden;
}

.no-touch .grid-home a.block img.b-loaded {
  opacity: .5;
}

.no-touch .grid-home a.block .label em {
  margin-right: 19px;
}

.no-touch .grid-home a.block .label:after {
  content: url("/img/icons/arrow-right.svg");
  display: inline-block;
  width: 21px;
  height: 9px;
  vertical-align: top;
  position: relative;
  top: 1px;
  margin-left: -3px;
  margin-right: 4px;
  transition: all ease .3s;
  opacity: 0;
}

.no-touch .grid-home a.block:hover img {
  filter: grayscale(0);
  opacity: 1;
}

.no-touch .grid-home a.block:hover .label:after {
  margin-left: 1px;
  margin-right: 0;
  opacity: 1;
}

.no-touch .grid-projects a.block, .no-touch
.grid-news a.block {
  -webkit-backface-visibility: hidden;
}

.no-touch .grid-projects a.block img, .no-touch
.grid-news a.block img {
  filter: grayscale(100%);
  -webkit-backface-visibility: hidden;
}

.no-touch .grid-projects a.block img.b-loaded, .no-touch
.grid-news a.block img.b-loaded {
  opacity: .5;
}

.no-touch .grid-projects a.block .label em, .no-touch
.grid-news a.block .label em {
  margin-right: 19px;
}

.no-touch .grid-projects a.block .label:after, .no-touch
.grid-news a.block .label:after {
  content: url("/img/icons/arrow-right.svg");
  display: inline-block;
  width: 21px;
  height: 9px;
  vertical-align: top;
  position: relative;
  top: 1px;
  margin-left: -3px;
  margin-right: 4px;
  transition: all ease .3s;
  opacity: 0;
}

.no-touch .grid-projects a.block:hover img, .no-touch
.grid-news a.block:hover img {
  filter: grayscale(0);
  opacity: 1;
}

.no-touch .grid-projects a.block:hover .label:after, .no-touch
.grid-news a.block:hover .label:after {
  margin-left: 1px;
  margin-right: 0;
  opacity: 1;
}

.no-touch .block.related img {
  filter: grayscale(100%);
  -webkit-backface-visibility: hidden;
}

.no-touch .block.related img.b-loaded {
  opacity: .5;
}

.no-touch .block.related .label em {
  margin-right: 19px;
}

.no-touch .block.related .label:after {
  content: url("/img/icons/arrow-right.svg");
  display: inline-block;
  width: 21px;
  height: 9px;
  vertical-align: top;
  position: relative;
  top: 1px;
  margin-left: -3px;
  margin-right: 4px;
  transition: all ease .3s;
  opacity: 0;
}

.no-touch .block.related:hover img {
  filter: grayscale(0);
  opacity: 1;
}

.no-touch .block.related:hover .label:after {
  margin-left: 1px;
  margin-right: 0;
  opacity: 1;
}

/* /////////////////////////////////
	Logo, monogram, loader
///////////////////////////////// */
.logo {
  font-size: 16px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.logo .underscore {
  display: inline-block;
  width: .7em;
  height: 2px;
  margin: 0 2px 0 0;
  background: #222;
  transition: all ease .2s;
}

@media (max-width: 557px) {
  .logo {
    font-size: 13px;
    letter-spacing: 1px;
  }
  .logo .underscore {
    width: .6em;
    margin-right: 1px;
  }
}

.monogram {
  position: relative;
  display: block;
  width: 60px;
  height: 60px;
  font: bold 33px/23px Akkurat, arial, sans-serif;
  text-transform: uppercase;
}

.monogram .d,
.monogram .m,
.monogram .underscore,
.monogram .a {
  position: absolute;
}

.monogram .d {
  left: -3px;
  top: 0;
}

.monogram .m {
  right: -3px;
  top: 0;
}

.monogram .underscore {
  left: -1px;
  bottom: 0;
  display: block;
  width: 18px;
  height: 4px;
  background: #222;
}

.monogram .a {
  right: 1px;
  bottom: 1px;
}

.monogram.invert {
  color: #fff;
}

.monogram.invert .underscore {
  background: #fff;
}

.monogram.animate .underscore {
  animation: dma-blink .8s infinite ease-in-out;
}

@keyframes dma-blink {
  0%, 100% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
}

.load-page {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
}

.load-page .monogram {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -30px 0 0 -30px;
}

.load-img {
  position: absolute;
  top: 40px;
  left: 40px;
}

.load-img .underscore {
  display: block;
  width: 18px;
  height: 4px;
  background: #d2d2d2;
  animation: dma-blink .8s infinite ease-in-out;
}

.block.invert .load-img .underscore {
  background: #e0e0e0;
}

/* /////////////////////////////////
	Common links
///////////////////////////////// */
a:link,
a:visited {
  color: #222;
  text-decoration: none;
  transition: all ease .2s;
}

.no-touch a:link:hover, .no-touch
a:visited:hover {
  color: #000;
  text-decoration: none;
}

.no-touch a:link:active, .no-touch
a:visited:active {
  color: #666;
  text-decoration: none;
}

a.arrow {
  position: relative;
  display: inline-block;
  margin: 60px 0 20px;
  font-size: 18px;
  line-height: 26px;
}

a.arrow:after {
  content: url("/img/icons/arrow-right.svg");
  display: inline-block;
  width: 21px;
  height: 9px;
  vertical-align: top;
  margin-left: 20px;
  margin-right: 4px;
  transition: all ease .3s;
}

.no-touch a.arrow:hover:after {
  margin-left: 24px;
  margin-right: 0;
}

.pagination {
  clear: both;
  margin-bottom: 8.69565%;
  text-align: center;
}

a.underline {
  display: inline-block;
  margin: 0 auto;
  font-size: 18px;
  line-height: 24px;
  text-align: center;
  border-bottom: solid 1px rgba(34, 34, 34, 0.1);
}

.no-touch a.underline:hover {
  padding: 0 2px;
  border-bottom: solid 1px rgba(34, 34, 34, 0.2);
}

@media (min-width: 558px) and (max-width: 1023px) {
  .pagination {
    margin-bottom: 11.76471%;
  }
}

@media (max-width: 557px) {
  a.arrow {
    margin: 40px 0 0;
    font-size: 16px;
    line-height: 24px;
  }
  .pagination {
    margin-bottom: 21.42857%;
  }
  a.underline {
    font-size: 16px;
    line-height: 24px;
  }
}

/* /////////////////////////////////
	Heros
///////////////////////////////// */
.hero-group {
  position: relative;
  z-index: 1;
  background: #fff;
}

.hero-full {
  position: relative;
  z-index: 0;
  width: 100%;
  height: 800px;
  height: 100vh;
  background-color: #222;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.hero-full.hero-top:after {
  content: "";
  display: block;
  position: absolute;
  z-index: 1;
  bottom: 0;
  right: 0;
  left: 0;
  height: 30%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
  visibility: visible !important;
}

.hero-half {
  position: relative;
  z-index: 1;
  width: 50%;
  height: 800px;
  height: 100vh;
  background-color: #222;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.hero-half.left {
  float: left;
}

.hero-half.right {
  float: right;
}

.hero-top:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 25%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.33), transparent);
}

a.hero-caption {
  position: absolute;
  z-index: 2;
  left: 80px;
  bottom: 60px;
  display: block;
  min-height: 25px;
  padding-left: 30px;
  font-size: 18px;
  line-height: 18px;
  color: #fff;
  background: transparent url("/img/icons/arrow-down-inv.svg") no-repeat left 0px;
}

a.hero-caption strong {
  display: inline-block;
  font-weight: bold;
  margin-right: 12px;
}

a.hero-caption em {
  display: inline-block;
  font-style: normal;
  opacity: .75;
}

.no-touch a.hero-caption:hover {
  color: #fff !important;
  background-position: left 4px;
}

.hero-half .hero-caption {
  display: none;
}

.hero-full .center-article {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
}

.hero-full .center-article h1 {
  max-width: 420px;
  margin-bottom: 6.52174%;
}

@media (min-width: 558px) and (max-width: 1023px) {
  a.hero-caption {
    left: 60px;
  }
  .hero-half {
    width: 100%;
  }
  .hero-half.left, .hero-half.right {
    float: none;
  }
  .hero-half.hero-top:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    height: 15%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
  }
  .hero-half .hero-caption {
    display: block;
  }
  .hero-top {
    height: 90vh;
  }
  .hero-full .center-article h1 {
    margin-bottom: 60px;
  }
}

@media (max-width: 557px) {
  a.hero-caption {
    left: 30px;
    bottom: 30px;
    right: 30px;
    font-size: 13px;
    line-height: 20px;
    background-position: left 4px;
  }
  a.hero-caption strong, a.hero-caption em {
    display: block;
  }
  .no-touch a.hero-caption:hover {
    background-position: left 8px;
  }
  .hero-half {
    width: 100%;
    height: 500px;
    height: 75vh;
  }
  .hero-half.left, .hero-half.right {
    float: none;
  }
  .hero-half.hero-top {
    height: 90vh;
  }
  .hero-half.hero-top:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    height: 15%;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.5), transparent);
  }
  .hero-half .hero-caption {
    display: block;
  }
  .hero-top {
    height: 90vh;
  }
  .hero-top:before {
    height: 33%;
  }
  .hero-full .center-article h1 {
    margin-bottom: 40px;
  }
}

/* /////////////////////////////////
	Titlebar
///////////////////////////////// */
.titlebar {
  padding: 182px 0 120px 0;
  background: #fff;
}

.titlebar h1 {
  max-width: 600px;
  color: #ebebeb;
}

.titlebar.article {
  padding-bottom: 160px;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .titlebar {
    padding: 182px 0 80px 0;
  }
  .titlebar.article {
    padding-bottom: 120px;
  }
}

@media (max-width: 557px) {
  .titlebar {
    padding: 138px 0 60px 0;
  }
  .titlebar.article {
    padding-bottom: 100px;
  }
}

.in-page-nav {
  margin: 40px -36px 0 0;
}

.in-page-nav li {
  display: inline-block;
  margin-right: 36px;
}

.in-page-nav a {
  color: #666;
}

.no-touch .in-page-nav a:hover {
  color: #000;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .in-page-nav li {
    margin-right: 32px;
  }
}

@media (max-width: 557px) {
  .in-page-nav {
    margin-top: 30px;
    margin-bottom: -10px;
  }
  .in-page-nav li {
    display: block;
    margin: 0 0 10px 0;
  }
}

/* /////////////////////////////////
	Filters
///////////////////////////////// */
.intro-controls {
  position: relative;
  z-index: 1;
}

.intro-controls h3.intro {
  float: left;
  width: 75%;
  width: calc(100% - 320px);
  text-align: justify;
}

.filters {
  position: relative;
  z-index: 1;
  float: right;
  width: 260px;
  margin: 14px 0 0 0;
}

.filters > li {
  position: relative;
  z-index: 0;
  margin: 0;
}

.filters > li > a {
  position: relative;
  z-index: 1;
  display: block;
  height: 39px;
  line-height: 40px;
  border-bottom: solid 1px rgba(34, 34, 34, 0.1);
}

.filters > li > a .default {
  color: #666;
}

.filters > li > a .value {
  color: #222;
  font-weight: bold;
  display: none;
}

.filters > li > a:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 4px;
  border-color: #666 transparent transparent transparent;
  position: absolute;
  right: 20px;
  top: 18px;
}

.no-touch .filters > li > a:hover {
  border-bottom: solid 1px rgba(34, 34, 34, 0.2);
}

.no-touch .filters > li > a:hover:after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border: solid 4px;
  border-color: #222 transparent transparent transparent;
}

.menu {
  position: absolute;
  z-index: 10;
  top: -27px;
  right: -40px;
  left: -40px;
  padding: 27px 40px 40px 40px;
  background: #fff;
  display: none;
}

.filter-header {
  display: block;
  height: 39px;
  line-height: 40px;
  color: #666 !important;
  border-bottom: solid 1px rgba(34, 34, 34, 0.1);
}

.filter-options {
  margin: 16px 0 0 0;
}

.filter-options li {
  margin: 0;
}

.filter-options a {
  display: block;
  height: 30px;
  line-height: 30px;
  color: #666;
}

.no-touch .filter-options a:hover {
  color: #222;
}

.filter-options li.selected a {
  color: #222;
  font-weight: bold;
}

.filters > li.is-open {
  z-index: 1;
}

.filters > li.is-open .menu {
  display: block;
}

.filters > li.has-value > a .default {
  display: none;
}

.filters > li.has-value > a .value {
  display: inline;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .intro-controls h3.intro {
    width: 66%;
    width: calc(100% - 260px);
  }
  .filters {
    width: 200px;
    margin-top: 12px;
  }
}

@media (max-width: 557px) {
  .intro-controls h3.intro {
    float: none;
    width: auto;
  }
  .filters {
    float: none;
    width: auto;
    margin-top: 18px;
  }
  .filters > li > a {
    height: 35px;
    line-height: 36px;
  }
  .menu {
    top: -23px;
    right: -30px;
    left: -30px;
    padding: 23px 30px 30px 30px;
  }
  .filter-header {
    height: 35px;
    line-height: 36px;
  }
}

/* /////////////////////////////////
	Text & Articles
///////////////////////////////// */
.article-meta p {
  margin: 8px 0 0 0;
  color: #666;
}

.hero-sm .article-meta {
  margin-top: 30px;
}

.text-block p,
.text-block ul,
.text-block ol {
  text-align: justify;
}

.text-block > h3 {
  margin-top: 40px;
  text-align: justify;
}

.text-block > *:first-child {
  margin-top: 0;
}

.text-block ul li {
  padding-left: 30px;
  background: transparent url("/img/icons/bullet.svg") no-repeat left 9px;
}

.text-block .light {
  color: #666;
}

.text-block > p > a {
  border-bottom: solid 1px rgba(34, 34, 34, 0.1);
}

.no-touch .text-block > p > a:hover {
  border-bottom: solid 1px rgba(34, 34, 34, 0.2);
}

.img-inline {
  margin: 60px 0;
}

.img-inline img {
  width: 100%;
  height: auto;
}

.img-inline .caption {
  max-width: 600px;
  margin: 20px 0 0 40px;
  color: #666;
  text-align: justify;
}

.img-inline.solo {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.img-inline.bump-up {
  margin-top: -160px;
}

.img-float {
  float: left;
  width: 46.66667%;
  margin: 44px 0 40px -53.33333%;
}

.img-float img {
  width: 100%;
  height: auto;
}

.img-float .caption {
  margin: 20px 0 0;
  color: #666;
  text-align: justify;
}

.img-full {
  margin: 0 80px;
}

.img-full img {
  width: 100%;
  height: auto;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .article-meta h3 {
    font-size: 13px;
    line-height: 20px;
  }
  .article-meta p {
    margin: 0;
  }
  .hero-sm .article-meta {
    margin-top: 20px;
    margin-left: 20px;
  }
  .img-inline {
    margin: 50px -20px;
  }
  .img-inline .caption {
    margin: 20px 20px 0 20px;
  }
  .img-inline.bump-up {
    margin-top: 50px;
  }
  .img-float {
    float: right;
    width: 35.29412%;
    margin: 44px -20px 40px 40px;
  }
  .img-full {
    margin: 0 40px;
  }
}

@media (max-width: 557px) {
  .article-meta {
    margin-bottom: 40px;
  }
  .article-meta h3 {
    font-size: 13px;
    line-height: 20px;
  }
  .article-meta p {
    margin: 0;
  }
  .hero-sm .article-meta {
    margin-top: 20px;
    margin-left: 10px;
  }
  .text-block p,
  .text-block ul,
  .text-block ol,
  .text-block > h3 {
    text-align: left;
  }
  .img-inline {
    margin: 40px -10px;
  }
  .img-inline .caption {
    margin: 20px 10px 0 10px;
    text-align: left;
  }
  .img-inline.bump-up {
    margin-top: 40px;
  }
  .img-float {
    float: none;
    width: auto;
    margin: 40px -10px;
  }
  .img-float .caption {
    margin: 20px 10px 0 10px;
    text-align: left;
  }
  .img-full {
    margin: 0 20px;
  }
}

/* /////////////////////////////////
	List
///////////////////////////////// */
.list-container {
  position: relative;
  padding: 38px 0;
  border-top: solid 1px rgba(34, 34, 34, 0.1);
}

.list-container .more,
.list-container .less {
  display: inline-block;
  margin-top: 1px;
  margin-left: 50px;
  font-weight: bold;
  line-height: 18px;
  border-bottom: solid 1px rgba(34, 34, 34, 0.1);
}

.no-touch .list-container .more:hover, .no-touch
.list-container .less:hover {
  border-bottom: solid 1px rgba(34, 34, 34, 0.2);
}

.list-container .less {
  display: none;
}

.pub-list,
.text-block .pub-list {
  position: relative;
  margin: 0;
  max-height: 300px;
  overflow: hidden;
  text-align: left !important;
}

.pub-list li,
.text-block .pub-list li {
  padding: 0 180px 0 50px;
  margin-bottom: 10px;
  background-image: none;
}

.pub-list .date,
.text-block .pub-list .date {
  display: block;
  float: left;
  margin-left: -50px;
}

.pub-list p,
.text-block .pub-list p {
  float: left;
  margin: 0;
}

.pub-list p strong,
.text-block .pub-list p strong {
  margin-right: 12px;
  font-weight: bold;
}

.pub-list p em,
.text-block .pub-list p em {
  font-style: normal;
  color: #666;
}

.pub-list .project,
.text-block .pub-list .project {
  display: block;
  float: right;
  width: 140px;
  margin-right: -180px;
  color: #666;
}

.pub-list:after,
.text-block .pub-list:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  height: 40px;
  background: linear-gradient(to top, #f1f1f1, rgba(241, 241, 241, 0));
}

.list-container.is-expanded .less {
  display: inline-block;
}

.list-container.is-expanded .more {
  display: none;
}

.list-container.is-expanded .pub-list {
  max-height: 9999999999em;
}

.list-container.is-expanded .pub-list:after {
  display: none;
}

@media (max-width: 557px) {
  .list-container {
    padding: 28px 0;
  }
  .pub-list,
  .text-block .pub-list {
    max-height: 400px;
  }
  .pub-list li,
  .text-block .pub-list li {
    padding-right: 0;
  }
  .pub-list p strong,
  .pub-list p em,
  .text-block .pub-list p strong,
  .text-block .pub-list p em {
    display: block;
  }
  .pub-list .project,
  .text-block .pub-list .project {
    float: left;
    clear: left;
    width: auto;
    margin-right: 0;
  }
}

/* /////////////////////////////////
	Project Details
///////////////////////////////// */
.project-details {
  position: absolute;
  top: 0;
  box-sizing: border-box;
  width: 50%;
  padding: 110px 80px 120px;
  background: #fff;
}

.project-details.left {
  left: 0;
}

.project-details.right {
  right: 0;
}

.project-details.details-top {
  padding-top: 180px;
}

.project-summary {
  margin-bottom: 18px;
}

.project-summary .summary-container {
  position: relative;
  max-width: 800px;
  overflow: hidden;
}

.project-summary .summary-container p:not(.project-meta) {
  text-align: justify;
}

.project-summary .more,
.project-summary .less {
  display: inline-block;
  margin-top: 1px;
  font-weight: bold;
  line-height: 18px;
  border-bottom: solid 1px rgba(34, 34, 34, 0.1);
}

.no-touch .project-summary .more:hover, .no-touch
.project-summary .less:hover {
  border-bottom: solid 1px rgba(34, 34, 34, 0.2);
}

.project-summary .more,
.project-summary .less {
  display: none;
}

.project-summary.restrict-height .summary-container {
  max-height: calc(100vh - 575px);
}

.project-summary.restrict-height .summary-container:after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  height: 40px;
  background: linear-gradient(to top, white, rgba(255, 255, 255, 0));
}

.project-summary.restrict-height .more {
  display: inline-block;
}

.details-top .project-summary.restrict-height .summary-container {
  max-height: calc(100vh - 575px - 70px);
}

.project-summary.is-expanded .summary-container,
.details-top .project-summary.is-expanded .summary-container {
  max-height: 99999999999em;
}

.project-summary.is-expanded .summary-container:after,
.details-top .project-summary.is-expanded .summary-container:after {
  display: none;
}

.project-summary.is-expanded .less,
.details-top .project-summary.is-expanded .less {
  display: inline-block;
}

.project-summary.is-expanded .more,
.details-top .project-summary.is-expanded .more {
  display: none;
}

.project-meta strong {
  display: inline-block;
  margin-right: 12px;
}

.project-meta em {
  display: inline-block;
  font-style: normal;
  color: #666;
}

.project-credits .list {
  box-sizing: border-box;
  float: left;
  width: 50%;
  padding-right: 40px;
}

.project-credits .list:last-child {
  width: 100%;
}

.project-extras {
  clear: both;
  width: 88.4058%;
  margin: 2.17391% auto;
  text-align: center;
}

.project-extras .list {
  box-sizing: border-box;
  display: inline-block;
  width: 21.86%;
  padding-right: 40px;
  vertical-align: top;
  text-align: left;
}

.project-extras .block.sm.related {
  display: inline-block;
  width: 34.42%;
  margin-bottom: 0;
  text-align: left;
}

.project-extras .block.sm.related label {
  margin-bottom: 14px;
}

.project-nav {
  background: #fff;
}

.project-nav a {
  position: relative;
  box-sizing: border-box;
  display: block;
  width: 49%;
  width: calc(50% - 1px);
  padding: 120px 0 110px 0;
}

.project-nav a figure.block.sm {
  width: 60.86957%;
  margin: 0;
}

.project-nav a:after {
  display: block;
  width: 21px;
  height: 9px;
  position: absolute;
  top: 47%;
  margin-top: -5px;
  transition: all ease .3s;
}

.project-nav a.prev {
  float: left;
}

.project-nav a.prev .block {
  float: left;
}

.project-nav a.prev .block p.label {
  margin-left: 40px;
}

.project-nav a.prev:after {
  content: url("/img/icons/arrow-left.svg");
  right: 60px;
}

.project-nav a.next {
  float: right;
  border-left: solid 2px #f1f1f1;
}

.project-nav a.next .block {
  float: right;
}

.project-nav a.next .block p.label {
  margin-right: 40px;
}

.project-nav a.next:after {
  content: url("/img/icons/arrow-right.svg");
  left: 60px;
}

.no-touch .project-nav a img {
  filter: grayscale(100%);
}

.no-touch .project-nav a img.b-loaded {
  opacity: .5;
}

.no-touch .project-nav a:hover img {
  filter: grayscale(0);
  opacity: 1;
}

.no-touch .project-nav a:hover.prev:after {
  right: 66px;
}

.no-touch .project-nav a:hover.next:after {
  left: 66px;
}

@media (min-width: 558px) and (max-width: 1023px) {
  .project-details {
    position: static;
    width: 100%;
    height: auto;
    padding: 70px 60px 80px;
  }
  .project-details.details-top {
    padding-top: 70px;
  }
  .project-extras {
    width: auto;
    margin: 2.94118% 0;
  }
  .project-extras .list {
    display: block;
    float: left;
    width: 33.3%;
  }
  .project-extras .block.sm.related {
    display: block;
    float: right;
    width: 38.23%;
    margin-top: 11.76471%;
    margin-right: 5.88235%;
  }
  .project-nav a {
    padding: 80px 0 70px 0;
  }
  .project-nav a figure.block.sm {
    width: 70.58824%;
  }
  .project-nav a figure.block.sm p.label > * {
    display: block;
  }
  .project-nav a:after {
    top: 44%;
  }
  .project-nav a.prev:after {
    right: 40px;
  }
  .project-nav a.next:after {
    left: 40px;
  }
  .no-touch .project-nav a:hover.prev:after {
    right: 44px;
  }
  .no-touch .project-nav a:hover.next:after {
    left: 44px;
  }
}

@media (max-width: 557px) {
  .project-details {
    position: static;
    width: 100%;
    height: auto;
    padding: 54px 30px 60px;
  }
  .project-details.details-top {
    padding-top: 54px;
  }
  .project-summary .summary-container p:not(.project-meta) {
    text-align: left;
  }
  .project-credits .list {
    float: none;
    width: 100%;
  }
  .project-extras {
    width: auto;
    margin: 0;
  }
  .project-extras .list {
    display: block;
    float: left;
    width: 100%;
  }
  .project-extras .block.sm.related {
    display: block;
    float: right;
    width: 88.4%;
    margin-top: 10.71429%;
    margin-right: -10px;
  }
  .project-nav a {
    padding: 110px 0 54px 0;
  }
  .project-nav a figure.block.sm {
    width: 90%;
    width: calc(100% - 20px);
  }
  .project-nav a figure.block.sm p.label > * {
    display: block;
  }
  .project-nav a:after {
    top: 60px;
  }
  .project-nav a.prev .block p.label {
    margin-left: 20px;
  }
  .project-nav a.prev:after {
    right: 40px;
  }
  .project-nav a.next .block p.label {
    margin-right: 20px;
  }
  .project-nav a.next:after {
    left: 40px;
  }
  .no-touch .project-nav a:hover.prev:after {
    right: 44px;
  }
  .no-touch .project-nav a:hover.next:after {
    left: 44px;
  }
}

/* /////////////////////////////////
	Contact
///////////////////////////////// */
.contacts {
  box-sizing: border-box;
  float: left;
  width: 33.3%;
  width: calc(33.3% + 40px);
  padding: 110px 80px 120px;
}

.contacts h1 {
  margin-bottom: 50px;
}

.accreditation {
  margin: 50px 0 -20px 0;
}

.accreditation .nzia {
  display: inline-block;
  width: 188px;
  height: 60px;
  margin-right: 40px;
  vertical-align: bottom;
  background: transparent url("/img/nzia.png") no-repeat left top;
  background-size: 100% !important;
}

@media (min--moz-device-pixel-ratio: 1.3), (-o-min-device-pixel-ratio: 2.6 / 2), (-webkit-min-device-pixel-ratio: 1.3), (min-device-pixel-ratio: 1.3), (min-resolution: 1.3dppx) {
  .accreditation .nzia {
    background-image: url("/img/nzia@2x.png");
    background-size: 100% auto;
  }
}

.accreditation .nzra {
  display: inline-block;
  width: 76px;
  height: 71px;
  margin-right: -10px;
  vertical-align: bottom;
  background: transparent url("/img/nzra.svg") no-repeat left top;
  background-size: 100% !important;
}

.map {
  box-sizing: border-box;
  float: right;
  width: 66.7%;
  width: calc(66.7% - 40px);
  height: 720px;
  border-left: solid 2px #f1f1f1;
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .contacts h1 {
    font-size: 40px;
    line-height: 50px;
    letter-spacing: 4px;
    margin-left: -4px;
  }
  .accreditation .nzia {
    width: 125px;
    height: 40px;
    margin-right: 30px;
  }
  .accreditation .nzra {
    width: 50px;
    height: 47px;
  }
}

@media (min-width: 558px) and (max-width: 1023px) {
  .contacts {
    float: none;
    width: auto;
    padding: 70px 60px 80px;
  }
  .contacts h1 {
    margin-bottom: 30px;
  }
  .contacts .list {
    display: inline-block;
    width: 49%;
    vertical-align: top;
  }
  .accreditation {
    margin-top: 60px;
    margin-bottom: 0;
  }
  .map {
    float: none;
    width: auto;
    height: 500px;
    height: 67vw;
    border-top: solid 2px #f1f1f1;
    border-left: 0;
  }
}

@media (max-width: 557px) {
  .contacts {
    float: none;
    width: auto;
    padding: 54px 30px 60px;
  }
  .contacts h1 {
    margin-bottom: 30px;
  }
  .accreditation {
    margin-top: 40px;
    margin-bottom: 0;
  }
  .accreditation .nzia {
    width: 125px;
    height: 40px;
    margin-right: 30px;
  }
  .accreditation .nzra {
    width: 50px;
    height: 47px;
  }
  .map {
    float: none;
    width: auto;
    height: 300px;
    height: 90vw;
    border-top: solid 2px #f1f1f1;
    border-left: 0;
  }
}