/*


      ___|         |
     |       _ \   |   _ \    __|  __|
     |      (   |  |  (   |  |   \__ \
    \____| \___/  _| \___/  _|   ____/



*/
/* Grays
-------------------------------------------------- */
/* Colors
-------------------------------------------------- */
/* General
-------------------------------------------------- */
/* Color Application
-------------------------------------------------- */
/* Breakpoints
* mainly from http://callmenick.com/post/maintainable-responsive-web-design-with-sass
* usage:
    @include break(0, sm) { // break
    @include break(sm) { // use this for min width declarations
    @include break(sm, lg) { // use this for min and max-width declarations
-------------------------------------------------- */
/*
    Dimensions for easier responsive styling
*/
:root {
  --gutterInt: 15;
  --columnInt: 49;
  --pageWidthInt: 414;
  --gutter: calc(var(--gutterInt) / var(--pageWidthInt) * 100vw);
  --column: calc(var(--columnInt) / var(--pageWidthInt) * 100vw);
}
@media (min-width: 48em) {
  :root {
    --gutterInt: 100;
    --columnInt: 51;
    --pageWidthInt: 1920;
  }
}

/* Gutters
-------------------------------------------------- */
/* Sizes
-------------------------------------------------- */
/* Margins
-------------------------------------------------- */
#footer-address p, .uk-button-large, p, .uk-text-lead, #footer #footer-newsletter .uk-form-large, h2,
.uk-h2,
h3,
.uk-h3,
.posts-template h2, .uk-heading-medium p, .uk-nav-primary > li > a {
  font-family: din-2014, sans-serif;
}

/* Fonts
* underlying structure from https://www.smashingmagazine.com/2015/06/responsive-typography-with-sass-maps/
-------------------------------------------------- */
/* build sizes
-------------------------------------------------- */
/* build font sizes
* start with style, then greek size group name, then two sizes for mobile and desktop
-------------------------------------------------- */
.uk-nav-primary > li > a {
  font-size: 15.4736842105vw;
  line-height: 1;
}
@media (min-width: 48em) {
  .uk-nav-primary > li > a {
    font-size: 4.375vw;
  }
}

.uk-heading-medium p {
  font-size: 5.7894736842vw;
  line-height: 1;
}
@media (min-width: 48em) {
  .uk-heading-medium p {
    font-size: 3.0208333333vw;
  }
}

#footer #footer-newsletter .uk-form-large, h2,
.uk-h2,
h3,
.uk-h3,
.posts-template h2 {
  font-size: 5.0526315789vw;
  line-height: 1;
}
@media (min-width: 48em) {
  #footer #footer-newsletter .uk-form-large, h2,
.uk-h2,
h3,
.uk-h3,
.posts-template h2 {
    font-size: 1.7708333333vw;
  }
}

p, .uk-text-lead {
  font-size: 4.4210526316vw;
  line-height: 1;
}
@media (min-width: 48em) {
  p, .uk-text-lead {
    font-size: 1.6666666667vw;
  }
}

.uk-button-large {
  font-size: 4.2105263158vw;
  line-height: 1;
}
@media (min-width: 48em) {
  .uk-button-large {
    font-size: 1.5625vw;
  }
}

#footer-address p {
  font-size: 3.3684210526vw;
  line-height: 1;
}
@media (min-width: 48em) {
  #footer-address p {
    font-size: 1.1979166667vw;
  }
}

.random,
.another {
  color: brown;
}
.random .another,
.another .another {
  color: red;
}

/* Utilities
-------------------------------------------------- */
.uk-section {
  padding-top: 5.2vw;
  padding-bottom: 5.2vw;
}
@media (max-width: 47.9em) {
  .home-template .uk-section {
    padding-top: 2.6vw;
    padding-bottom: 2.6vw;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  .home-template .uk-section {
    padding-top: 2.6vw;
    padding-bottom: 2.6vw;
  }
}
@media (min-width: 48em) {
  .uk-section {
    padding-top: 2.6vw;
    padding-bottom: 2.6vw;
  }
}

.uk-container {
  padding-right: 6.5vw;
  padding-left: 6.5vw;
}
@media (min-width: 48em) {
  .uk-container {
    padding-right: 5.2vw;
    padding-left: 5.2vw;
  }
}

.uk-grid-large > *,
.uk-grid-column-large {
  margin-left: -6.5vw;
}
@media (min-width: 48em) {
  .uk-grid-large > *,
.uk-grid-column-large {
    margin-left: -5.2vw;
  }
}
.uk-grid-large > * > [class^=uk-width],
.uk-grid-column-large > [class^=uk-width] {
  padding-left: 6.5vw;
}
@media (min-width: 48em) {
  .uk-grid-large > * > [class^=uk-width],
.uk-grid-column-large > [class^=uk-width] {
    padding-left: 5.2vw;
  }
}
.uk-grid-large > * [class^=uk-margin-large-top],
.uk-grid-column-large [class^=uk-margin-large-top] {
  margin-left: 6.5vw !important;
}
@media (min-width: 48em) {
  .uk-grid-large > * [class^=uk-margin-large-top],
.uk-grid-column-large [class^=uk-margin-large-top] {
    margin-top: 5.2vw !important;
  }
}

a.uk-link-text,
.uk-link-text a,
.uk-link-toggle .uk-link-text {
  color: #707070;
  background: none;
}
a.uk-link-text:hover,
.uk-link-text a:hover,
.uk-link-toggle .uk-link-text:hover {
  text-decoration: underline;
  text-underline-offset: 5px;
}

.uk-lightbox {
  background-color: rgba(0, 0, 0, 0.8);
}

.uk-lightbox-toolbar {
  background-color: transparent;
}

/* Overrides
 * overwrites Mimar theme settings
-------------------------------------------------- */
.uk-logo img {
  width: 27.2946859903vw !important;
}
@media (min-width: 48em) {
  .uk-logo img {
    width: 12.7vw !important;
  }
}

.uk-heading-medium p {
  line-height: 1.275862069;
  margin-bottom: calc(var(--gutter));
}

@media (max-width: 47.9em) {
  h2,
.uk-h2,
h3,
.uk-h3,
.posts-template h2 {
    margin: calc(var(--gutter)) 0;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  h2,
.uk-h2,
h3,
.uk-h3,
.posts-template h2 {
    margin: calc(var(--gutter)) 0;
  }
}

.uk-text-lead {
  line-height: 1.3125;
}

.uk-button-large {
  padding: calc(var(--gutter) * 0.7) calc(var(--gutter) * 0.75);
}
@media (min-width: 48em) {
  .uk-button-large {
    padding: calc(var(--gutter) * 0.19) calc(var(--gutter) * 0.25);
  }
}

.uk-button-primary {
  border: 1px solid #0668b0;
  letter-spacing: 0.25vw;
  background-color: transparent;
  font-weight: 300;
  text-transform: uppercase;
}

@media (max-width: 47.9em) {
  .uk-offcanvas-bar {
    padding: 0 calc(var(--gutter) * 2) calc(var(--gutter) * 2);
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  .uk-offcanvas-bar {
    padding: 0 calc(var(--gutter) * 2) calc(var(--gutter) * 2);
  }
}
.uk-offcanvas-bar .uk-container {
  padding: calc(var(--gutter) / 2) 0 0;
}

#footer #footer-newsletter .uk-form-large {
  height: 11.4vw;
}
@media (min-width: 48em) {
  #footer #footer-newsletter .uk-form-large {
    height: 3.8vw;
  }
}

.uk-lightbox-items > * > * {
  max-width: calc(100vw - var(--gutter));
  max-height: calc(100vh - var(--gutter));
}

.uk-lightbox-toolbar {
  z-index: 10;
}

.uk-lightbox-button {
  background-color: transparent;
}

@media (max-width: 47.9em) {
  div[data-mobileorder="-2"] {
    order: -2 !important;
  }
  div[data-mobileorder="-1"] {
    order: -1 !important;
  }
  div[data-mobileorder="0"] {
    order: 0 !important;
  }
  div[data-mobileorder="1"] {
    order: 1 !important;
  }
  div[data-mobileorder="2"] {
    order: 2 !important;
  }
  div[data-mobileorder="3"] {
    order: 3 !important;
  }
  div[data-mobileorder="4"] {
    order: 4 !important;
  }
  div[data-mobileorder="5"] {
    order: 5 !important;
  }
  div[data-mobileorder="6"] {
    order: 6 !important;
  }
  div[data-mobileorder="7"] {
    order: 7 !important;
  }
  div[data-mobileorder="8"] {
    order: 8 !important;
  }
  div[data-mobileorder="9"] {
    order: 9 !important;
  }
  div[data-mobileorder="10"] {
    order: 10 !important;
  }
  div[data-mobileorder="11"] {
    order: 11 !important;
  }
  div[data-mobileorder="12"] {
    order: 12 !important;
  }
  div[data-mobileorder="13"] {
    order: 13 !important;
  }
  div[data-mobileorder="14"] {
    order: 14 !important;
  }
  div[data-mobileorder="15"] {
    order: 15 !important;
  }
  div[data-mobileorder="16"] {
    order: 16 !important;
  }
  div[data-mobileorder="17"] {
    order: 17 !important;
  }
  div[data-mobileorder="18"] {
    order: 18 !important;
  }
  div[data-mobileorder="19"] {
    order: 19 !important;
  }
  div[data-mobileorder="20"] {
    order: 20 !important;
  }
  div[data-mobileorder="21"] {
    order: 21 !important;
  }
  div[data-mobileorder="22"] {
    order: 22 !important;
  }
  div[data-mobileorder="23"] {
    order: 23 !important;
  }
  div[data-mobileorder="24"] {
    order: 24 !important;
  }
  div[data-mobileorder="25"] {
    order: 25 !important;
  }
  div[data-mobileorder="26"] {
    order: 26 !important;
  }
  div[data-mobileorder="27"] {
    order: 27 !important;
  }
  div[data-mobileorder="28"] {
    order: 28 !important;
  }
  div[data-mobileorder="29"] {
    order: 29 !important;
  }
  div[data-mobileorder="30"] {
    order: 30 !important;
  }
  div[data-mobileorder="31"] {
    order: 31 !important;
  }
  div[data-mobileorder="32"] {
    order: 32 !important;
  }
  div[data-mobileorder="33"] {
    order: 33 !important;
  }
  div[data-mobileorder="34"] {
    order: 34 !important;
  }
  div[data-mobileorder="35"] {
    order: 35 !important;
  }
  div[data-mobileorder="36"] {
    order: 36 !important;
  }
  div[data-mobileorder="37"] {
    order: 37 !important;
  }
  div[data-mobileorder="38"] {
    order: 38 !important;
  }
  div[data-mobileorder="39"] {
    order: 39 !important;
  }
  div[data-mobileorder="40"] {
    order: 40 !important;
  }
  div[data-mobileorder="41"] {
    order: 41 !important;
  }
  div[data-mobileorder="42"] {
    order: 42 !important;
  }
  div[data-mobileorder="43"] {
    order: 43 !important;
  }
  div[data-mobileorder="44"] {
    order: 44 !important;
  }
  div[data-mobileorder="45"] {
    order: 45 !important;
  }
  div[data-mobileorder="46"] {
    order: 46 !important;
  }
  div[data-mobileorder="47"] {
    order: 47 !important;
  }
  div[data-mobileorder="48"] {
    order: 48 !important;
  }
  div[data-mobileorder="49"] {
    order: 49 !important;
  }
  div[data-mobileorder="50"] {
    order: 50 !important;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  div[data-mobileorder="-2"] {
    order: -2 !important;
  }
  div[data-mobileorder="-1"] {
    order: -1 !important;
  }
  div[data-mobileorder="0"] {
    order: 0 !important;
  }
  div[data-mobileorder="1"] {
    order: 1 !important;
  }
  div[data-mobileorder="2"] {
    order: 2 !important;
  }
  div[data-mobileorder="3"] {
    order: 3 !important;
  }
  div[data-mobileorder="4"] {
    order: 4 !important;
  }
  div[data-mobileorder="5"] {
    order: 5 !important;
  }
  div[data-mobileorder="6"] {
    order: 6 !important;
  }
  div[data-mobileorder="7"] {
    order: 7 !important;
  }
  div[data-mobileorder="8"] {
    order: 8 !important;
  }
  div[data-mobileorder="9"] {
    order: 9 !important;
  }
  div[data-mobileorder="10"] {
    order: 10 !important;
  }
  div[data-mobileorder="11"] {
    order: 11 !important;
  }
  div[data-mobileorder="12"] {
    order: 12 !important;
  }
  div[data-mobileorder="13"] {
    order: 13 !important;
  }
  div[data-mobileorder="14"] {
    order: 14 !important;
  }
  div[data-mobileorder="15"] {
    order: 15 !important;
  }
  div[data-mobileorder="16"] {
    order: 16 !important;
  }
  div[data-mobileorder="17"] {
    order: 17 !important;
  }
  div[data-mobileorder="18"] {
    order: 18 !important;
  }
  div[data-mobileorder="19"] {
    order: 19 !important;
  }
  div[data-mobileorder="20"] {
    order: 20 !important;
  }
  div[data-mobileorder="21"] {
    order: 21 !important;
  }
  div[data-mobileorder="22"] {
    order: 22 !important;
  }
  div[data-mobileorder="23"] {
    order: 23 !important;
  }
  div[data-mobileorder="24"] {
    order: 24 !important;
  }
  div[data-mobileorder="25"] {
    order: 25 !important;
  }
  div[data-mobileorder="26"] {
    order: 26 !important;
  }
  div[data-mobileorder="27"] {
    order: 27 !important;
  }
  div[data-mobileorder="28"] {
    order: 28 !important;
  }
  div[data-mobileorder="29"] {
    order: 29 !important;
  }
  div[data-mobileorder="30"] {
    order: 30 !important;
  }
  div[data-mobileorder="31"] {
    order: 31 !important;
  }
  div[data-mobileorder="32"] {
    order: 32 !important;
  }
  div[data-mobileorder="33"] {
    order: 33 !important;
  }
  div[data-mobileorder="34"] {
    order: 34 !important;
  }
  div[data-mobileorder="35"] {
    order: 35 !important;
  }
  div[data-mobileorder="36"] {
    order: 36 !important;
  }
  div[data-mobileorder="37"] {
    order: 37 !important;
  }
  div[data-mobileorder="38"] {
    order: 38 !important;
  }
  div[data-mobileorder="39"] {
    order: 39 !important;
  }
  div[data-mobileorder="40"] {
    order: 40 !important;
  }
  div[data-mobileorder="41"] {
    order: 41 !important;
  }
  div[data-mobileorder="42"] {
    order: 42 !important;
  }
  div[data-mobileorder="43"] {
    order: 43 !important;
  }
  div[data-mobileorder="44"] {
    order: 44 !important;
  }
  div[data-mobileorder="45"] {
    order: 45 !important;
  }
  div[data-mobileorder="46"] {
    order: 46 !important;
  }
  div[data-mobileorder="47"] {
    order: 47 !important;
  }
  div[data-mobileorder="48"] {
    order: 48 !important;
  }
  div[data-mobileorder="49"] {
    order: 49 !important;
  }
  div[data-mobileorder="50"] {
    order: 50 !important;
  }
}
.uk-margin-small-top {
  margin-top: calc(var(--gutter) / 2) !important;
}
@media (min-width: 48em) {
  .uk-margin-small-top {
    margin-top: calc(var(--gutter) / 8) !important;
  }
}

.uk-margin-top {
  margin-top: calc(var(--gutter) / 4) !important;
}

.uk-margin-medium-top {
  margin-top: calc(var(--gutter) / 4) !important;
}

.uk-margin-medium-bottom {
  margin-top: calc(var(--gutter) / 4) !important;
}

@media (max-width: 47.9em) {
  .uk-grid + .uk-grid-large,
.uk-grid + .uk-grid-row-large,
.uk-grid-large > .uk-grid-margin,
.uk-grid-row-large > .uk-grid-margin,
* + .uk-grid-margin-large {
    margin-top: calc(var(--gutter) * 2);
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  .uk-grid + .uk-grid-large,
.uk-grid + .uk-grid-row-large,
.uk-grid-large > .uk-grid-margin,
.uk-grid-row-large > .uk-grid-margin,
* + .uk-grid-margin-large {
    margin-top: calc(var(--gutter) * 2);
  }
}

.uk-margin-bottom {
  margin-bottom: calc(var(--gutter) / 4) !important;
}

/* Image Element
-------------------------------------------------- */
[class*=uk-width-] [class*=uk-inline] {
  display: block;
}
[class*=uk-width-] img {
  width: 100%;
  max-width: unset;
}

/* Header
-------------------------------------------------- */
#page-header {
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
  background-color: transparent;
}
@media (max-width: 47.9em) {
  #page-header {
    margin-top: calc(var(--gutter));
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #page-header {
    margin-top: calc(var(--gutter));
  }
}

.uk-navbar .uk-navbar-toggle-icon svg {
  filter: drop-shadow(0px 0px 5px #000);
}

.uk-navbar-toggle {
  color: white;
}
.uk-navbar-toggle:hover {
  color: #0668b0;
}

.uk-navbar-toggle-icon svg {
  width: 40px;
  height: 40px;
}
.uk-navbar-toggle-icon rect {
  height: 1px;
}

#header-logo {
  background-color: rgba(255, 255, 255, 0.85);
  position: relative;
  --offset: 1.2;
  padding: calc(var(--gutter) / var(--offset)) calc(var(--gutter) / var(--offset)) calc(var(--gutter) / var(--offset)) 0;
}
@media (min-width: 48em) {
  #header-logo {
    --offset: 4;
    padding: calc(var(--gutter) / var(--offset)) calc(var(--gutter) / var(--offset)) calc(var(--gutter) / var(--offset)) 0;
  }
}
#header-logo:after {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  bottom: 0;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.85);
}

.uk-nav-primary > li > a {
  margin-bottom: calc(var(--gutter) / 4);
}

.uk-open > .uk-offcanvas-reveal,
.uk-offcanvas-bar {
  width: 100vw;
}
@media (min-width: 48em) {
  .uk-open > .uk-offcanvas-reveal,
.uk-offcanvas-bar {
    width: calc(var(--gutter) * 4 + var(--column) * 3);
  }
}

.uk-offcanvas-flip.uk-offcanvas-container-animation {
  left: 0;
}

.uk-offcanvas-close {
  top: calc(var(--gutter) * 1.5);
  right: calc(var(--gutter) * 1.5);
}
.uk-offcanvas-close svg {
  width: 40px;
  height: 40px;
}
@media (min-width: 48em) {
  .uk-offcanvas-close {
    top: 2.6vw;
    right: calc(var(--gutter) / 1);
  }
}

.uk-offcanvas-bar {
  background-color: rgba(6, 104, 176, 0.9);
}
.uk-offcanvas-bar a {
  text-decoration: none;
  background: none;
}

.uk-offcanvas-container .uk-navbar-toggle {
  display: none;
}

#main-menu-inner {
  display: flex;
  height: 100%;
  flex-direction: column;
  justify-content: space-between;
}
@media (max-width: 47.9em) {
  #main-menu-inner {
    margin-top: calc(var(--column) + var(--gutter) * 3);
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #main-menu-inner {
    margin-top: calc(var(--column) + var(--gutter) * 3);
  }
}

#main-menu-text {
  padding: 0;
}
#main-menu-text p {
  color: white;
}
@media (max-width: 47.9em) {
  #main-menu-text p {
    font-size: 4.8421052632vw;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #main-menu-text p {
    font-size: 4.8421052632vw;
  }
}

/* Footer
-------------------------------------------------- */
#footer {
  background-color: #efefef;
  margin-top: calc(var(--gutter) * 4);
  padding-bottom: calc(var(--gutter) * 4);
}
@media (min-width: 48em) {
  #footer {
    padding-bottom: calc(var(--gutter) / 2);
    margin-top: calc(var(--gutter));
  }
}
@media (max-width: 47.9em) {
  .home-template #footer, .default-template #footer {
    margin-top: calc(var(--gutter) * 2);
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  .home-template #footer, .default-template #footer {
    margin-top: calc(var(--gutter) * 2);
  }
}
@media (max-width: 47.9em) {
  #footer > div > div > div {
    flex-direction: column-reverse;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #footer > div > div > div {
    flex-direction: column-reverse;
  }
}
#footer a {
  text-decoration: none;
  background: none;
  font-weight: 300;
  color: #9a8a7c;
  letter-spacing: 0.05vw;
}
#footer a:hover {
  color: #0668b0;
}
@media (max-width: 47.9em) {
  #footer .uk-logo img {
    width: 42.7536231884vw !important;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #footer .uk-logo img {
    width: 42.7536231884vw !important;
  }
}

@media (max-width: 47.9em) {
  #footer-logo img {
    padding-right: calc(var(--gutter) * 0.7);
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #footer-logo img {
    padding-right: calc(var(--gutter) * 0.7);
  }
}

@media (max-width: 47.9em) {
  #footer-address {
    margin-left: calc(var(--gutter) * -1);
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #footer-address {
    margin-left: calc(var(--gutter) * -1);
  }
}
#footer-address p {
  line-height: 1.23;
}
@media (max-width: 47.9em) {
  #footer-address p {
    font-size: 3.8947368421vw;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #footer-address p {
    font-size: 3.8947368421vw;
  }
}

@media (max-width: 47.9em) {
  #footer-newsletter {
    margin-bottom: calc(var(--gutter));
  }
  #footer-newsletter .uk-grid-margin {
    margin: 0;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #footer-newsletter {
    margin-bottom: calc(var(--gutter));
  }
  #footer-newsletter .uk-grid-margin {
    margin: 0;
  }
}
#footer-newsletter .uk-form-label {
  font-size: 2.36rem;
  font-weight: 700;
  color: #707070;
}
#footer-newsletter .uk-form-large {
  height: 76px;
  font-size: 2.125rem;
  border: none;
  background-color: white;
}

/* Portfolio page
-------------------------------------------------- */
h2.tracked {
  line-height: 1.2;
}
h2.tracked em {
  letter-spacing: normal;
  color: inherit;
}

#about-images img {
  border-radius: 50%;
}
#about-images em {
  font-weight: normal;
}

p {
  line-height: 1.25;
  color: #707070;
  margin-bottom: calc(var(--gutter) / 4);
}

.default-template .uk-input,
.default-template .uk-textarea {
  border: 2px solid #c1c1c1;
}
@media (max-width: 47.9em) {
  .default-template .uk-grid-margin {
    margin-top: 0;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  .default-template .uk-grid-margin {
    margin-top: 0;
  }
}

/* Home page
-------------------------------------------------- */
.uk-height-viewport {
  height: -webkit-fill-available;
}

.uk-slidenav svg {
  color: #c1c1c1;
}
@media (min-width: 48em) {
  .uk-slidenav {
    width: 30%;
    height: 100%;
  }
  .uk-slidenav-previous {
    cursor: url("/assets/img/left-arrow.png"), default;
  }
  .uk-slidenav-next {
    cursor: url("/assets/img/right-arrow.png"), default;
  }
  .uk-slidenav svg {
    display: none;
  }
}

@media (max-width: 47.9em) {
  .uk-slideshow-items {
    min-height: 90vh !important;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  .uk-slideshow-items {
    min-height: 90vh !important;
  }
}

.uk-grid .uk-section {
  padding: 0;
}

.tracked {
  letter-spacing: 0.05em;
}

a.uk-link-heading {
  color: inherit;
}

@media (max-width: 47.9em) {
  #home-intro {
    margin-bottom: calc(var(--gutter));
  }
  #home-intro .uk-grid-margin {
    margin-top: 0;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #home-intro {
    margin-bottom: calc(var(--gutter));
  }
  #home-intro .uk-grid-margin {
    margin-top: 0;
  }
}

@media (max-width: 47.9em) {
  #recent-projects {
    margin-bottom: calc(var(--gutter) * 2) !important;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #recent-projects {
    margin-bottom: calc(var(--gutter) * 2) !important;
  }
}
@media (max-width: 47.9em) {
  #recent-projects .uk-grid > div:nth-of-type(n+4) {
    display: none;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  #recent-projects .uk-grid > div:nth-of-type(n+4) {
    display: none;
  }
}
#recent-projects .uk-transition-toggle:hover + h3 span {
  color: #0668b0 !important;
}

/* Portfolio page
-------------------------------------------------- */
.posts-template #page-header,
.default-template #page-header {
  position: static;
}
.posts-template .uk-navbar .uk-navbar-toggle-icon svg,
.default-template .uk-navbar .uk-navbar-toggle-icon svg {
  filter: none;
}
.posts-template .uk-navbar-toggle,
.default-template .uk-navbar-toggle {
  color: #0668b0;
}
.posts-template .uk-navbar-toggle:hover,
.default-template .uk-navbar-toggle:hover {
  color: #9a8a7c;
}
.posts-template #header-logo,
.default-template #header-logo {
  padding-top: calc(var(--gutter) / 2);
}
@media (min-width: 48em) {
  .posts-template #header-logo,
.default-template #header-logo {
    padding-top: calc(var(--gutter) / 12);
  }
}

.portfolio-grid-figcaption {
  margin-top: calc(var(--gutter) / 2);
}
@media (min-width: 48em) {
  .portfolio-grid-figcaption {
    margin-top: calc(var(--gutter) / 8);
  }
}

.portfolio-link:hover h2 {
  color: #0668b0 !important;
}

/* Project Detail
-------------------------------------------------- */
.project-lead-credits {
  margin-top: calc(var(--gutter));
}
@media (min-width: 48em) {
  .project-lead-credits {
    margin-top: calc(var(--gutter) / 4);
  }
}
.project-lead-credits p,
.project-lead-credits a {
  color: #c1c1c1;
}

.project-header-image {
  -o-object-fit: cover;
     object-fit: cover;
  height: 75vh;
}
@media (min-width: 48em) {
  .project-header-image {
    height: 85vh;
  }
}

#project-gallery {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
@media (min-width: 48em) {
  #project-gallery {
    grid-template-columns: 1fr 1fr 1fr;
    margin-top: -2.1vw;
  }
}
#project-gallery > div {
  padding-left: 6.5vw;
  margin-top: calc(var(--gutter) / 2);
}
@media (min-width: 48em) {
  #project-gallery > div {
    padding-left: 5.2vw;
    margin-top: calc(var(--gutter) / 2);
  }
}
#project-gallery > .uk-grid-margin {
  margin-top: 6.5vw;
}
@media (min-width: 48em) {
  #project-gallery > .uk-grid-margin {
    margin-top: 5.2vw;
  }
}

.vd-width-1 {
  grid-column: span 1;
}

.vd-width-2 {
  grid-column: span 2;
}
@media (min-width: 48em) {
  .vd-width-2 {
    grid-column: span 2;
  }
}

.vd-width-3 {
  grid-column: span 2;
}
@media (min-width: 48em) {
  .vd-width-3 {
    grid-column: span 3;
  }
}

.vd-height-2 {
  grid-row: span 2;
}
@media (min-width: 48em) {
  .vd-height-2 {
    grid-row: span 2;
  }
}

@media (min-width: 48em) {
  .vd-portrait-left-of-small {
    grid-row: span 2;
  }
}

@media (max-width: 47.9em) {
  .vd-portrait {
    grid-row: span 2;
  }
}
@media (min-width: ) and (max-width: 47.9em) {
  .vd-portrait {
    grid-row: span 2;
  }
}
@media (min-width: 48em) {
  #portfolio-grid .vd-portrait-right-of-small + .vd-horizontal-small,
#portfolio-grid .vd-horizontal-small + .vd-horizontal-small,
#portfolio-grid .vd-horizontal-small + .vd-horizontal-right-of-small + .vd-horizontal-small {
    margin-top: 1.7vw !important;
  }
}

/* Helpers
-------------------------------------------------*/
.is-hidden {
  display: none;
}

.is-hidden-important {
  display: none !important;
}

.is-visible {
  display: block !important;
}

.invisible {
  visibility: hidden;
}

.hide-text {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
  height: 0;
}

@media (min-width: 48em) {
  .mobile-only {
    display: none;
  }
}

.no-mobile {
  display: none;
}
@media (min-width: 48em) {
  .no-mobile {
    display: inline-block;
  }
}

.no-mobile-block {
  display: none !important;
}
@media (min-width: 48em) {
  .no-mobile-block {
    display: block !important;
  }
}

.no-mobile-flex {
  display: none !important;
}
@media (min-width: 48em) {
  .no-mobile-flex {
    display: flex !important;
  }
}

.no-mobile-grid {
  display: none !important;
}
@media (min-width: 48em) {
  .no-mobile-grid {
    display: grid !important;
  }
}

@media (min-width: 120em) {
  .tablet-only {
    display: none;
  }
}

.no-tablet-block {
  display: none;
}
@media (min-width: 120em) {
  .no-tablet-block {
    display: block;
  }
}

.is-frozen {
  overflow: hidden;
  width: 100%;
  height: 100%;
  position: fixed;
}

/**
 * Visually hide an element, but leave it available for screen readers
 * @link https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/main.css
 * @link http://snook.ca/archives/html_and_css/hiding-content-for-accessibility
 */
.screen-reader {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

/**
 * Extends the .screen-reader class to allow the element to be focusable when navigated to via the keyboard
 * @link https://github.com/h5bp/html5-boilerplate/blob/master/dist/css/main.css
 * @link https://www.drupal.org/node/897638
 */
.screen-reader-focusable:active,
.screen-reader-focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  white-space: normal;
  width: auto;
}