@charset "utf-8";

@import url("//hello.myfonts.net/count/36b3f3");





/*
 * Webfonts
 * ----------------------------------------- */

@font-face {
  font-family: 'tt-wellingtons';
  font-weight: 500;
  src: url('../fonts/36B3F3_3_0.eot');
  src: url('../fonts/36B3F3_3_0.eot?#iefix') format('embedded-opentype'),
       url('../fonts/36B3F3_3_0.woff2') format('woff2'),
       url('../fonts/36B3F3_3_0.woff') format('woff'),
       url('../fonts/36B3F3_3_0.ttf') format('truetype');
}

@font-face {
  font-family: 'tt-wellingtons';
  font-weight: 500;
  font-style: italic;
  src: url('../fonts/36B3F3_2_0.eot');
  src: url('../fonts/36B3F3_2_0.eot?#iefix') format('embedded-opentype'),
       url('../fonts/36B3F3_2_0.woff2') format('woff2'),
       url('../fonts/36B3F3_2_0.woff') format('woff'),
       url('../fonts/36B3F3_2_0.ttf') format('truetype');
}

@font-face {
  font-family: 'tt-wellingtons';
  font-weight: 700;
  src: url('../fonts/36B3F3_0_0.eot');
  src: url('../fonts/36B3F3_0_0.eot?#iefix') format('embedded-opentype'),
       url('../fonts/36B3F3_0_0.woff2') format('woff2'),
       url('../fonts/36B3F3_0_0.woff') format('woff'),
       url('../fonts/36B3F3_0_0.ttf') format('truetype');
}

@font-face {
  font-family: 'tt-wellingtons';
  font-weight: 700;
  font-style: italic;
  src: url('../fonts/36B3F3_1_0.eot');
  src: url('../fonts/36B3F3_1_0.eot?#iefix') format('embedded-opentype'),
       url('../fonts/36B3F3_1_0.woff2') format('woff2'),
       url('../fonts/36B3F3_1_0.woff') format('woff'),
       url('../fonts/36B3F3_1_0.ttf') format('truetype');
}

@font-face {
  font-family: 'tt-wellingtons';
  font-weight: 800;
  src: url('../fonts/36B788_0_0.eot');
  src: url('../fonts/336B788_0_0.eot?#iefix') format('embedded-opentype'),
       url('../fonts/36B788_0_0.woff2') format('woff2'),
       url('../fonts/36B788_0_0.woff') format('woff'),
       url('../fonts/36B788_0_0.ttf') format('truetype');
}





/*
 * Resets
 * ----------------------------------------- */

html,
body {
  margin: 0;
}

h1, h2, h3,
p,
ul, li,
blockquote  {
  margin: 0;
  padding: 0;
}

ul {
  list-style-type: none;
}

:focus {
  outline: none;
}

a {
  text-decoration: none;
  outline: none;
  cursor: pointer;
}

a img {
  border: 0;
}

img,
video {
  width: 100%;
}

 ::-moz-selection {
  background-color: #d9d9d9;
}

 ::selection {
  background-color: #d9d9d9;
}

line,
rect,
path,
polyline,
polygon {
  stroke-miterlimit: 10;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2px;
}





/*
 * Basics
 * ----------------------------------------- */

html {
  font-size: 16px;
}

@media all and ( max-width: 900px ) {
  html {
    font-size: 14px;
  }
}


@media all and ( max-width: 480px ) {
  html {
    font-size: 14px;
  }
}


body {
  text-rendering: optimizeLegibility;
   -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-family: 'tt-wellingtons', sans-serif;
  font-weight: 400;
  line-height: 1.75;
  color: #000;
  font-size: 1.125rem;
}

body.is-fixed {
  position: fixed;
}



/*
 * Layout
 * ----------------------------------------- */

.project {
  position: relative;
  margin-top: 100px;
  margin-bottom: 180px;
}

.project:first-of-type {
  margin-top: 0;
}

@media all and ( max-width: 920px ) {
  .project {
    margin-top: 80px;
    margin-bottom: 150px;
  }
}

@media all and ( max-width: 780px ) {
  .project {
    margin-top: 60px;
    margin-bottom: 120px;
  }
}

@media all and ( max-width: 640px ) {
  .project {
    margin-top: 50px;
  }
}

.row,
.row-full-width {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 80%;
  max-width: 1320px;
  margin: 0 auto;
}

.row-full-width {
  width: 100%;
  max-width: 100%;
  display: inline-block;
  line-height: 0;
}

@media all and ( max-width: 1280px ) {
  .row {
    width: 90%;
  }
}

.row:after {
  content: ' ';
  display: table;
}

.col {
  margin-right: 1.5%;
  margin-left: 1.5%;
  box-sizing: border-box;
/*   background: rgba( 0,0,0, .2 ); */
}

.col-1  { flex-basis: calc(   9.09% - 3% ); }
.col-2  { flex-basis: calc(  18.18% - 3% ); }
.col-3  { flex-basis: calc(  27.27% - 3% ); }
.col-4  { flex-basis: calc(  36.36% - 3% ); }
.col-5  { flex-basis: calc(  45.45% - 3% ); }
.col-6  { flex-basis: calc(  54.54% - 3% ); }
.col-7  { flex-basis: calc(  63.63% - 3% ); }
.col-8  { flex-basis: calc(  72.72% - 3% ); }
.col-9  { flex-basis: calc(  81.81% - 3% ); }
.col-10 { flex-basis: calc(  90.9%  - 3% ); }
.col-11 { flex-basis: calc( 100%    - 3% ); }

.offset-col-1   { margin-left: calc(  9.09% + 1.5% ); }
.offset-col-2   { margin-left: calc( 18.18% + 1.5% ); }
.offset-col-3   { margin-left: calc( 27.27% + 1.5% ); }
.offset-col-4   { margin-left: calc( 36.36% + 1.5% ); }
.offset-col-5   { margin-left: calc( 45.45% + 1.5% ); }
.offset-col-6   { margin-left: calc( 54.54% + 1.5% ); }
.offset-col-7   { margin-left: calc( 63.63% + 1.5% ); }
.offset-col-8   { margin-left: calc( 72.72% + 1.5% ); }

.pt-0 { padding-top: 0; }
.pt-1 { padding-top: calc( 1rem * .25 ); }
.pt-2 { padding-top: calc( 1rem * .5  ); }
.pt-3 { padding-top: calc( 1rem * 1   ); }
.pt-4 { padding-top: calc( 1rem * 1.5 ); }
.pt-5 { padding-top: calc( 1rem * 3   ); }
.pt-6 { padding-top: calc( 1rem * 4.5 ); }
.pt-7 { padding-top: calc( 1rem * 6   ); }
.pt-8 { padding-top: calc( 1rem * 9   ); }

.pb-0 { padding-bottom: 0; }
.pb-1 { padding-bottom: calc( 1rem * .25 ); }
.pb-2 { padding-bottom: calc( 1rem * .5  ); }
.pb-3 { padding-bottom: calc( 1rem * 1   ); }
.pb-4 { padding-bottom: calc( 1rem * 1.5 ); }
.pb-5 { padding-bottom: calc( 1rem * 3   ); }
.pb-6 { padding-bottom: calc( 1rem * 4.5 ); }
.pb-7 { padding-bottom: calc( 1rem * 6   ); }
.pb-8 { padding-bottom: calc( 1rem * 9   ); }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: calc( 1rem * .25 ); }
.mt-2 { margin-top: calc( 1rem * .5  ); }
.mt-3 { margin-top: calc( 1rem * 1   ); }
.mt-4 { margin-top: calc( 1rem * 1.5 ); }
.mt-5 { margin-top: calc( 1rem * 3   ); }
.mt-6 { margin-top: calc( 1rem * 4.5 ); }
.mt-7 { margin-top: calc( 1rem * 6   ); }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: calc( 1rem * .25 ); }
.mb-2 { margin-bottom: calc( 1rem * .5  ); }
.mb-3 { margin-bottom: calc( 1rem * 1   ); }
.mb-4 { margin-bottom: calc( 1rem * 1.5 ); }
.mb-5 { margin-bottom: calc( 1rem * 3   ); }
.mb-6 { margin-bottom: calc( 1rem * 4.5 ); }
.mb-7 { margin-bottom: calc( 1rem * 6   ); }





@media all and ( max-width: 1120px ) {

  .lg-col-1  { flex-basis: calc(   9.09% - 3% ); }
  .lg-col-2  { flex-basis: calc(  18.18% - 3% ); }
  .lg-col-3  { flex-basis: calc(  27.27% - 3% ); }
  .lg-col-4  { flex-basis: calc(  36.36% - 3% ); }
  .lg-col-5  { flex-basis: calc(  45.45% - 3% ); }
  .lg-col-6  { flex-basis: calc(  54.54% - 3% ); }
  .lg-col-7  { flex-basis: calc(  63.63% - 3% ); }
  .lg-col-8  { flex-basis: calc(  72.72% - 3% ); }
  .lg-col-9  { flex-basis: calc(  81.81% - 3% ); }
  .lg-col-10 { flex-basis: calc(  90.9%  - 3% ); }
  .lg-col-11 { flex-basis: calc( 100%    - 3% ); }

  .lg-offset-col-0   { margin-left: calc(     0% + 1.5% ); }
  .lg-offset-col-1   { margin-left: calc(  9.09% + 1.5% ); }
  .lg-offset-col-2   { margin-left: calc( 18.18% + 1.5% ); }
  .lg-offset-col-3   { margin-left: calc( 27.27% + 1.5% ); }
  .lg-offset-col-4   { margin-left: calc( 36.36% + 1.5% ); }
  .lg-offset-col-5   { margin-left: calc( 45.45% + 1.5% ); }
  .lg-offset-col-6   { margin-left: calc( 54.54% + 1.5% ); }
  .lg-offset-col-7   { margin-left: calc( 63.63% + 1.5% ); }
  .lg-offset-col-8   { margin-left: calc( 72.72% + 1.5% ); }

  .lg-pt-0 { padding-top: 0; }
  .lg-pt-1 { padding-top: calc( 1rem * .25 ); }
  .lg-pt-2 { padding-top: calc( 1rem * .5  ); }
  .lg-pt-3 { padding-top: calc( 1rem * 1   ); }
  .lg-pt-4 { padding-top: calc( 1rem * 1.5 ); }
  .lg-pt-5 { padding-top: calc( 1rem * 3   ); }
  .lg-pt-6 { padding-top: calc( 1rem * 4.5 ); }
  .lg-pt-7 { padding-top: calc( 1rem * 6   ); }

  .lg-pb-0 { padding-bottom: 0; }
  .lg-pb-1 { padding-bottom: calc( 1rem * .25 ); }
  .lg-pb-2 { padding-bottom: calc( 1rem * .5  ); }
  .lg-pb-3 { padding-bottom: calc( 1rem * 1   ); }
  .lg-pb-4 { padding-bottom: calc( 1rem * 1.5 ); }
  .lg-pb-5 { padding-bottom: calc( 1rem * 3   ); }
  .lg-pb-6 { padding-bottom: calc( 1rem * 4.5 ); }
  .lg-pb-7 { padding-bottom: calc( 1rem * 6   ); }

  .lg-mt-0 { margin-top: 0; }
  .lg-mt-1 { margin-top: calc( 1rem * .25 ); }
  .lg-mt-2 { margin-top: calc( 1rem * .5  ); }
  .lg-mt-3 { margin-top: calc( 1rem * 1   ); }
  .lg-mt-4 { margin-top: calc( 1rem * 1.5 ); }
  .lg-mt-5 { margin-top: calc( 1rem * 3   ); }
  .lg-mt-6 { margin-top: calc( 1rem * 4.5 ); }
  .lg-mt-7 { margin-top: calc( 1rem * 6   ); }

  .lg-mb-0 { margin-bottom: 0; }
  .lg-mb-1 { margin-bottom: calc( 1rem * .25 ); }
  .lg-mb-2 { margin-bottom: calc( 1rem * .5  ); }
  .lg-mb-3 { margin-bottom: calc( 1rem * 1   ); }
  .lg-mb-4 { margin-bottom: calc( 1rem * 1.5 ); }
  .lg-mb-5 { margin-bottom: calc( 1rem * 3   ); }
  .lg-mb-6 { margin-bottom: calc( 1rem * 4.5 ); }
  .lg-mb-7 { margin-bottom: calc( 1rem * 6   ); }

  .lg-halign-center {
    justify-content: center;
  }

  .lg-valign-center {
    align-items: center;
  }

}





@media all and ( max-width: 920px ) {

  .md-col-1  { flex-basis: calc(   9.09% - 3% ); }
  .md-col-2  { flex-basis: calc(  18.18% - 3% ); }
  .md-col-3  { flex-basis: calc(  27.27% - 3% ); }
  .md-col-4  { flex-basis: calc(  36.36% - 3% ); }
  .md-col-5  { flex-basis: calc(  45.45% - 3% ); }
  .md-col-6  { flex-basis: calc(  54.54% - 3% ); }
  .md-col-7  { flex-basis: calc(  63.63% - 3% ); }
  .md-col-8  { flex-basis: calc(  72.72% - 3% ); }
  .md-col-9  { flex-basis: calc(  81.81% - 3% ); }
  .md-col-10 { flex-basis: calc(  90.9%  - 3% ); }
  .md-col-11 { flex-basis: calc( 100%    - 3% ); }

  .md-offset-col-0   { margin-left: calc(     0% + 1.5% ); }
  .md-offset-col-1   { margin-left: calc(  9.09% + 1.5% ); }
  .md-offset-col-2   { margin-left: calc( 18.18% + 1.5% ); }
  .md-offset-col-3   { margin-left: calc( 27.27% + 1.5% ); }
  .md-offset-col-4   { margin-left: calc( 36.36% + 1.5% ); }
  .md-offset-col-5   { margin-left: calc( 45.45% + 1.5% ); }
  .md-offset-col-6   { margin-left: calc( 54.54% + 1.5% ); }
  .md-offset-col-7   { margin-left: calc( 63.63% + 1.5% ); }
  .md-offset-col-8   { margin-left: calc( 72.72% + 1.5% ); }

  .md-halign-center {
    justify-content: center;
  }

  .md-valign-center {
    align-items: center;
  }

  .pt-0 { padding-top: 0; }
  .pt-1 { padding-top: calc( .75rem * .25 ); }
  .pt-2 { padding-top: calc( .75rem * .5  ); }
  .pt-3 { padding-top: calc( .75rem * 1   ); }
  .pt-4 { padding-top: calc( .75rem * 1.5 ); }
  .pt-5 { padding-top: calc( .75rem * 3   ); }
  .pt-6 { padding-top: calc( .75rem * 4.5 ); }
  .pt-7 { padding-top: calc( .75rem * 6   ); }
  .pt-8 { padding-top: calc( .75rem * 9   ); }

  .pb-0 { padding-bottom: 0; }
  .pb-1 { padding-bottom: calc( .75rem * .25 ); }
  .pb-2 { padding-bottom: calc( .75rem * .5  ); }
  .pb-3 { padding-bottom: calc( .75rem * 1   ); }
  .pb-4 { padding-bottom: calc( .75rem * 1.5 ); }
  .pb-5 { padding-bottom: calc( .75rem * 3   ); }
  .pb-6 { padding-bottom: calc( .75rem * 4.5 ); }
  .pb-7 { padding-bottom: calc( .75rem * 6   ); }
  .pb-8 { padding-bottom: calc( .75rem * 9   ); }

  .mt-0 { margin-top: 0; }
  .mt-1 { margin-top: calc( .75rem * .25 ); }
  .mt-2 { margin-top: calc( .75rem * .5  ); }
  .mt-3 { margin-top: calc( .75rem * 1   ); }
  .mt-4 { margin-top: calc( .75rem * 1.5 ); }
  .mt-5 { margin-top: calc( .75rem * 3   ); }
  .mt-6 { margin-top: calc( .75rem * 4.5 ); }
  .mt-7 { margin-top: calc( .75rem * 6   ); }

  .mb-0 { margin-bottom: 0; }
  .mb-1 { margin-bottom: calc( .75rem * .25 ); }
  .mb-2 { margin-bottom: calc( .75rem * .5  ); }
  .mb-3 { margin-bottom: calc( .75rem * 1   ); }
  .mb-4 { margin-bottom: calc( .75rem * 1.5 ); }
  .mb-5 { margin-bottom: calc( .75rem * 3   ); }
  .mb-6 { margin-bottom: calc( .75rem * 4.5 ); }
  .mb-7 { margin-bottom: calc( .75rem * 6   ); }

  .md-pt-0 { padding-top: 0; }
  .md-pt-1 { padding-top: calc( 0.75rem * .25 ); }
  .md-pt-2 { padding-top: calc( 0.75rem * .5  ); }
  .md-pt-3 { padding-top: calc( 0.75rem * 1   ); }
  .md-pt-4 { padding-top: calc( 0.75rem * 1.5 ); }
  .md-pt-5 { padding-top: calc( 0.75rem * 3   ); }
  .md-pt-6 { padding-top: calc( 0.75rem * 4.5 ); }
  .md-pt-7 { padding-top: calc( 0.75rem * 6   ); }

  .md-pb-0 { padding-bottom: 0; }
  .md-pb-1 { padding-bottom: calc( 0.75rem * .25 ); }
  .md-pb-2 { padding-bottom: calc( 0.75rem * .5  ); }
  .md-pb-3 { padding-bottom: calc( 0.75rem * 1   ); }
  .md-pb-4 { padding-bottom: calc( 0.75rem * 1.5 ); }
  .md-pb-5 { padding-bottom: calc( 0.75rem * 3   ); }
  .md-pb-6 { padding-bottom: calc( 0.75rem * 4.5 ); }
  .md-pb-7 { padding-bottom: calc( 0.75rem * 6   ); }

  .md-mt-0 { margin-top: 0; }
  .md-mt-1 { margin-top: calc( 0.75rem * .25 ); }
  .md-mt-2 { margin-top: calc( 0.75rem * .5  ); }
  .md-mt-3 { margin-top: calc( 0.75rem * 1   ); }
  .md-mt-4 { margin-top: calc( 0.75rem * 1.5 ); }
  .md-mt-5 { margin-top: calc( 0.75rem * 3   ); }
  .md-mt-6 { margin-top: calc( 0.75rem * 4.5 ); }
  .md-mt-7 { margin-top: calc( 0.75rem * 6   ); }

  .md-mb-0 { margin-bottom: 0; }
  .md-mb-1 { margin-bottom: calc( 0.75rem * .25 ); }
  .md-mb-2 { margin-bottom: calc( 0.75rem * .5  ); }
  .md-mb-3 { margin-bottom: calc( 0.75rem * 1   ); }
  .md-mb-4 { margin-bottom: calc( 0.75rem * 1.5 ); }
  .md-mb-5 { margin-bottom: calc( 0.75rem * 3   ); }
  .md-mb-6 { margin-bottom: calc( 0.75rem * 4.5 ); }
  .md-mb-7 { margin-bottom: calc( 0.75rem * 6   ); }

}





@media all and ( max-width: 780px ) {

  .sm-col-1  { flex-basis: calc(   9.09% - 3% ); }
  .sm-col-2  { flex-basis: calc(  18.18% - 3% ); }
  .sm-col-3  { flex-basis: calc(  27.27% - 3% ); }
  .sm-col-4  { flex-basis: calc(  36.36% - 3% ); }
  .sm-col-5  { flex-basis: calc(  45.45% - 3% ); }
  .sm-col-6  { flex-basis: calc(  54.54% - 3% ); }
  .sm-col-7  { flex-basis: calc(  63.63% - 3% ); }
  .sm-col-8  { flex-basis: calc(  72.72% - 3% ); }
  .sm-col-9  { flex-basis: calc(  81.81% - 3% ); }
  .sm-col-10 { flex-basis: calc(  90.9%  - 3% ); }
  .sm-col-11 { flex-basis: calc( 100%    - 3% ); }

  .sm-offset-col-0   { margin-left: calc(     0% + 1.5% ); }
  .sm-offset-col-1   { margin-left: calc(  9.09% + 1.5% ); }
  .sm-offset-col-2   { margin-left: calc( 18.18% + 1.5% ); }
  .sm-offset-col-3   { margin-left: calc( 27.27% + 1.5% ); }
  .sm-offset-col-4   { margin-left: calc( 36.36% + 1.5% ); }
  .sm-offset-col-5   { margin-left: calc( 45.45% + 1.5% ); }
  .sm-offset-col-6   { margin-left: calc( 54.54% + 1.5% ); }
  .sm-offset-col-7   { margin-left: calc( 63.63% + 1.5% ); }
  .sm-offset-col-8   { margin-left: calc( 72.72% + 1.5% ); }

  .sm-halign-center {
    justify-content: center;
  }

  .sm-valign-center {
    align-items: center;
  }

  .sm-pt-0 { padding-top: 0; }
  .sm-pt-1 { padding-top: calc( .75rem * .25 ); }
  .sm-pt-2 { padding-top: calc( .75rem * .5  ); }
  .sm-pt-3 { padding-top: calc( .75rem * 1   ); }
  .sm-pt-4 { padding-top: calc( .75rem * 1.5 ); }
  .sm-pt-5 { padding-top: calc( .75rem * 3   ); }
  .sm-pt-6 { padding-top: calc( .75rem * 4.5 ); }
  .sm-pt-7 { padding-top: calc( .75rem * 6   ); }

  .sm-pb-0 { padding-bottom: 0; }
  .sm-pb-1 { padding-bottom: calc( .75rem * .25 ); }
  .sm-pb-2 { padding-bottom: calc( .75rem * .5  ); }
  .sm-pb-3 { padding-bottom: calc( .75rem * 1   ); }
  .sm-pb-4 { padding-bottom: calc( .75rem * 1.5 ); }
  .sm-pb-5 { padding-bottom: calc( .75rem * 3   ); }
  .sm-pb-6 { padding-bottom: calc( .75rem * 4.5 ); }
  .sm-pb-7 { padding-bottom: calc( .75rem * 6   ); }

  .sm-mt-0 { margin-top: 0; }
  .sm-mt-1 { margin-top: calc( .75rem * .25 ); }
  .sm-mt-2 { margin-top: calc( .75rem * .5  ); }
  .sm-mt-3 { margin-top: calc( .75rem * 1   ); }
  .sm-mt-4 { margin-top: calc( .75rem * 1.5 ); }
  .sm-mt-5 { margin-top: calc( .75rem * 3   ); }
  .sm-mt-6 { margin-top: calc( .75rem * 4.5 ); }
  .sm-mt-7 { margin-top: calc( .75rem * 6   ); }

  .sm-mb-0 { margin-bottom: 0; }
  .sm-mb-1 { margin-bottom: calc( .75rem * .25 ); }
  .sm-mb-2 { margin-bottom: calc( .75rem * .5  ); }
  .sm-mb-3 { margin-bottom: calc( .75rem * 1   ); }
  .sm-mb-4 { margin-bottom: calc( .75rem * 1.5 ); }
  .sm-mb-5 { margin-bottom: calc( .75rem * 3   ); }
  .sm-mb-6 { margin-bottom: calc( .75rem * 4.5 ); }
  .sm-mb-7 { margin-bottom: calc( .75rem * 6   ); }

}





@media all and ( max-width: 640px ) {

  .xs-col-1  { flex-basis: calc(   9.09% - 3% ); }
  .xs-col-2  { flex-basis: calc(  18.18% - 3% ); }
  .xs-col-3  { flex-basis: calc(  27.27% - 3% ); }
  .xs-col-4  { flex-basis: calc(  36.36% - 3% ); }
  .xs-col-5  { flex-basis: calc(  45.45% - 3% ); }
  .xs-col-6  { flex-basis: calc(  54.54% - 3% ); }
  .xs-col-7  { flex-basis: calc(  63.63% - 3% ); }
  .xs-col-8  { flex-basis: calc(  72.72% - 3% ); }
  .xs-col-9  { flex-basis: calc(  81.81% - 3% ); }
  .xs-col-10 { flex-basis: calc(  90.9%  - 3% ); }
  .xs-col-11 { flex-basis: calc( 100%    - 3% ); }

  .xs-offset-col-0   { margin-left: calc(     0% + 1.5% ); }
  .xs-offset-col-1   { margin-left: calc(  9.09% + 1.5% ); }
  .xs-offset-col-2   { margin-left: calc( 18.18% + 1.5% ); }
  .xs-offset-col-3   { margin-left: calc( 27.27% + 1.5% ); }
  .xs-offset-col-4   { margin-left: calc( 36.36% + 1.5% ); }
  .xs-offset-col-5   { margin-left: calc( 45.45% + 1.5% ); }
  .xs-offset-col-6   { margin-left: calc( 54.54% + 1.5% ); }
  .xs-offset-col-7   { margin-left: calc( 63.63% + 1.5% ); }
  .xs-offset-col-8   { margin-left: calc( 72.72% + 1.5% ); }

  .xs-halign-center {
    justify-content: center;
  }

  .pt-0 { padding-top: 0; }
  .pt-1 { padding-top: calc( .6rem * .25 ); }
  .pt-2 { padding-top: calc( .6rem * .5  ); }
  .pt-3 { padding-top: calc( .6rem * 1   ); }
  .pt-4 { padding-top: calc( .6rem * 1.5 ); }
  .pt-5 { padding-top: calc( .6rem * 3   ); }
  .pt-6 { padding-top: calc( .6rem * 4.5 ); }
  .pt-7 { padding-top: calc( .6rem * 6   ); }
  .pt-8 { padding-top: calc( .6rem * 9   ); }

  .pb-0 { padding-bottom: 0; }
  .pb-1 { padding-bottom: calc( .6rem * .25 ); }
  .pb-2 { padding-bottom: calc( .6rem * .5  ); }
  .pb-3 { padding-bottom: calc( .6rem * 1   ); }
  .pb-4 { padding-bottom: calc( .6rem * 1.5 ); }
  .pb-5 { padding-bottom: calc( .6rem * 3   ); }
  .pb-6 { padding-bottom: calc( .6rem * 4.5 ); }
  .pb-7 { padding-bottom: calc( .6rem * 6   ); }
  .pb-8 { padding-bottom: calc( .6rem * 9   ); }

  .mt-0 { margin-top: 0; }
  .mt-1 { margin-top: calc( .6rem * .25 ); }
  .mt-2 { margin-top: calc( .6rem * .5  ); }
  .mt-3 { margin-top: calc( .6rem * 1   ); }
  .mt-4 { margin-top: calc( .6rem * 1.5 ); }
  .mt-5 { margin-top: calc( .6rem * 3   ); }
  .mt-6 { margin-top: calc( .6rem * 4.5 ); }
  .mt-7 { margin-top: calc( .6rem * 6   ); }

  .mb-0 { margin-bottom: 0; }
  .mb-1 { margin-bottom: calc( .6rem * .25 ); }
  .mb-2 { margin-bottom: calc( .6rem * .5  ); }
  .mb-3 { margin-bottom: calc( .6rem * 1   ); }
  .mb-4 { margin-bottom: calc( .6rem * 1.5 ); }
  .mb-5 { margin-bottom: calc( .6rem * 3   ); }
  .mb-6 { margin-bottom: calc( .6rem * 4.5 ); }
  .mb-7 { margin-bottom: calc( .6rem * 6   ); }

  .xs-pt-0 { padding-top: 0; }
  .xs-pt-1 { padding-top: calc( .6rem * .25 ); }
  .xs-pt-2 { padding-top: calc( .6rem * .5  ); }
  .xs-pt-3 { padding-top: calc( .6rem * 1   ); }
  .xs-pt-4 { padding-top: calc( .6rem * 1.5 ); }
  .xs-pt-5 { padding-top: calc( .6rem * 3   ); }
  .xs-pt-6 { padding-top: calc( .6rem * 4.5 ); }
  .xs-pt-7 { padding-top: calc( .6rem * 6   ); }

  .xs-pb-0 { padding-bottom: 0; }
  .xs-pb-1 { padding-bottom: calc( .6rem * .25 ); }
  .xs-pb-2 { padding-bottom: calc( .6rem * .5  ); }
  .xs-pb-3 { padding-bottom: calc( .6rem * 1   ); }
  .xs-pb-4 { padding-bottom: calc( .6rem * 1.5 ); }
  .xs-pb-5 { padding-bottom: calc( .6rem * 3   ); }
  .xs-pb-6 { padding-bottom: calc( .6rem * 4.5 ); }
  .xs-pb-7 { padding-bottom: calc( .6rem * 6   ); }

  .xs-mt-0 { margin-top: 0; }
  .xs-mt-1 { margin-top: calc( .6rem * .25 ); }
  .xs-mt-2 { margin-top: calc( .6rem * .5  ); }
  .xs-mt-3 { margin-top: calc( .6rem * 1   ); }
  .xs-mt-4 { margin-top: calc( .6rem * 1.5 ); }
  .xs-mt-5 { margin-top: calc( .6rem * 3   ); }
  .xs-mt-6 { margin-top: calc( .6rem * 4.5 ); }
  .xs-mt-7 { margin-top: calc( .6rem * 6   ); }

  .xs-mb-0 { margin-bottom: 0; }
  .xs-mb-1 { margin-bottom: calc( .6rem * .25 ); }
  .xs-mb-2 { margin-bottom: calc( .6rem * .5  ); }
  .xs-mb-3 { margin-bottom: calc( .6rem * 1   ); }
  .xs-mb-4 { margin-bottom: calc( .6rem * 1.5 ); }
  .xs-mb-5 { margin-bottom: calc( .6rem * 3   ); }
  .xs-mb-6 { margin-bottom: calc( .6rem * 4.5 ); }
  .xs-mb-7 { margin-bottom: calc( .6rem * 6   ); }

}

.valign-center {
  align-items: center;
}

.halign-center {
  justify-content: center;
}

.talign-right {
  text-align: right;
}





/*
 * Header
 * ----------------------------------------- */

header {
  position: relative;
}

.top-bar {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 50%;
  transform: translateX( -50% );
  height: 200px;
  font-weight: 500;
}

@media all and ( max-width: 1280px ) {
  .top-bar {
    height: 160px;
  }
}

@media all and ( max-width: 900px ) {
  .top-bar {
    height: 120px;
  }
}

@media all and ( max-width: 640px ) {
  .top-bar {
    display: inline-block;
    margin-top: 20px;
    height: 97px;
  }
}

.site-title {
  text-transform: uppercase;
  letter-spacing: .25em;
}

@media all and ( max-width: 640px ) {
  .site-title {
    font-weight: 800;
    text-align: right;
    flex-basis: 98%;
    margin-right: 0;
  }
}

nav {
  text-align: right;
  font-weight: 700;
}

nav li {
  display: inline-block;
  margin-left: 15px;
}

@media all and ( max-width: 640px ) {
  nav li {
    display: inline-block;
    margin-left: 10px;
  }
}

nav a {
  display: inline-block;
  line-height: 1.8;
  transition: .4s;
  border-bottom: 2px solid transparent;
}

nav a:hover,
nav a.is-active {
  border-bottom-color: #000;
}

nav a.is-active {
  pointer-events: none;
}

footer {
  opacity: .2;
}

footer a {
  display: inline-block;
  line-height: 1.3;
  transition: .4s;
  border-bottom: 2px solid transparent;
}

footer a:hover {
  border-bottom-color: #000;
}

.intro {
  height: 100vh;
  display: flex;
  align-items: center;
  margin-top: 0;
  margin-bottom: 0;
  padding: 210px 0 180px;
  box-sizing: border-box;
}

@media all and ( orientation: portrait ) {
  .intro {
    height: auto;
  }
}

@media all and ( max-width: 1280px ) {
  .intro {
    padding: 170px 0 140px;
  }
}

@media all and ( max-width: 900px ) {
  .intro {
    padding: 130px 0 100px;
  }
}

.row-intro {
  margin-top: 30px;
}

.col-info {
  font-size: calc( 8.3vw * .8 );
  line-height: 1.2;
  font-weight: 700;
}

.col-info-row-2 {
  text-align: right;
}

@media all and ( min-width: 1680px ) {
  .col-info {
    font-size: 111px;
  }
}

@media all and ( max-width: 1280px ) {
  .col-info {
    font-size: calc( 8.3vw * .9 );
  }
}

@media all and ( max-width: 768px ) {
  .col-info {
    font-weight: 800;
    font-size: 11vw;
  }
  .col-info-row-2 {
    text-align: left;
  }
}

@media all and ( max-width: 480px ) {
  .col-info {
    font-size: 12.4vw;
  }
}

.bg {
  display: flex;
  width: 100%;
  justify-content: center;
  line-height: 0;
}

.bg-half {
  position: relative;
}

.bg-half:after {
  content: '';
  position: absolute;
  z-index: -1;
  left: 0;
  top: 0;
  display: inline-block;
  width: 100%;
  height: 33%;
  background: #f8f8f8;
}

.bg-light {
  background: #f8f8f8;
}




/*
 * Typography
 * ----------------------------------------- */

p {
  margin-bottom: 1rem;
}

p:last-of-type {
  margin-bottom: 0;
}

.tags {
  margin-top: 20px;
  font-size: .75rem;
  letter-spacing: .1em;
  line-height: 2;
  font-weight: 700;
}

.caps {
  font-weight: 700;
}

.border-text {
  position: absolute;
  z-index: 1;
  top: -2rem;
  left: .75%;
  transform: rotate( 90deg );
  transform-origin: bottom left;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .25em;
}

.border-text .caps {
  margin-right: .4rem;
}

@media all and ( max-width: 640px ) {
  .border-text {
    position: static;
    display: block;
    transform: rotate( 0 );
    margin-left: 1.5%;
    width: calc( 100% - 3% );
    margin-bottom: 1rem;
  }
}

h1, h2 {
  font-size: 1.125rem;
  font-weight: 700;
}

h3 {
  margin-top: 5rem;
  margin-bottom: 2rem;
  font-weight: 700;
  font-size: 2rem;
}

h3:first-of-type {
  margin-top: 0;
}

h4 {
  margin-top: 3rem;
  margin-bottom: .5rem;
  font-weight: 700;
  font-size: 1.125rem;
}

.primary-description {
  padding-top: 5rem;
  padding-bottom: 8rem;
  font-weight: 500;
}

@media all and ( max-width: 780px ) {

  .primary-description {
    padding-top: 2.75rem;
    padding-bottom: 4rem;
  }

}

.project-fullwidth-bg-intro .primary-description {
  padding-top: 7rem;
}

@media all and ( max-width: 780px ) {

  .project-fullwidth-bg-intro .primary-description {
    padding-top: 4.5rem;
  }

}

.project-uclab .primary-description {
  padding-bottom: 0rem;
}

.secondary-description {
  padding-top: 3rem;
  padding-bottom: 3.25rem;
}




/*
 * Links
 * ----------------------------------------- */

a {
  color: #000;
}

section a {
  display: inline-block;
  border-bottom: 2px solid #c5c5c5;
  line-height: 1.2;
}

section a:hover {
  border-color: #000;
}



/*
 * Transitions & Animations
 * ----------------------------------------- */

a {
  transition: all .3s;
}

@keyframes stroemeundspuren-logo {
    0%   { background-color: #6eddc0; }
    4%   { background-color: #6eddc0; }
    19%  { background-color: #9de8b4; }
    31%  { background-color: #9de8b4; }
    44%  { background-color: #bdefac; }
    56%  { background-color: #bdefac; }
    69%  { background-color: #9de8b4; }
    81%  { background-color: #9de8b4; }
    96%  { background-color: #6eddc0; }
    100% { background-color: #6eddc0; }
}

.stroemeundspuren-logo {
  animation-name: stroemeundspuren-logo;
  animation-duration: 5s;
  animation-iteration-count: infinite;
  background-image: url( '../../projects/stroemeundspuren/logo.svg' );
  background-repeat: no-repeat;
  background-position: 38% 35%;
  background-size: auto 60%;
  max-height: 40rem;
  height: 35vw;
  min-height: 20rem;
}

@keyframes nindyaa-patterns {
  0%   { background-image: url( '../../projects/nindyaa/nindyaa-pattern-1.svg' ) }
  14%  { background-image: url( '../../projects/nindyaa/nindyaa-pattern-1.svg' ) }
  25%  { background-image: url( '../../projects/nindyaa/nindyaa-pattern-4.svg' ) }
  39%  { background-image: url( '../../projects/nindyaa/nindyaa-pattern-4.svg' ) }
  50%  { background-image: url( '../../projects/nindyaa/nindyaa-pattern-3.svg' ) }
  64%  { background-image: url( '../../projects/nindyaa/nindyaa-pattern-3.svg' ) }
  75%  { background-image: url( '../../projects/nindyaa/nindyaa-pattern-2.svg' ) }
  89%  { background-image: url( '../../projects/nindyaa/nindyaa-pattern-2.svg' ) }
  100% { background-image: url( '../../projects/nindyaa/nindyaa-pattern-1.svg' ) }
}

.nindyaa-pattern {
  animation-name: nindyaa-patterns;
  animation-duration: 7s;
  animation-iteration-count: infinite;
  background-color: #3a3a3a;
  background-image: url( '../../projects/nindyaa/nindyaa-pattern-1.svg' );
  background-repeat: no-repeat;
  background-position: center center;
  background-size: auto 70%;
  height: 35rem;
}

@media all and ( max-width: 580px ) {
  .nindyaa-pattern {
    background-size: 80% auto;
  }
}






/*
 * Footer
 * ----------------------------------------- */

footer {
  margin-bottom: 50px;
}





/*
 * More info
 * ----------------------------------------- */

.toggle-container {
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  bottom: -5rem;
  margin-bottom: 0;
  background: #fff;
}

.toggle-container:before {
  top:    calc( -25px - 1.5rem );
  height: calc(  25px + 1.5rem );
}

.btn-toggle {
  position: relative;
  cursor: pointer;
  border-bottom: 2px solid #eee;
  pointer-events: none;
}

.btn-toggle:after {
  content: '';
  width: 50px;
  height: 50px;
  margin-top: calc( -25px - 1.5rem );
  border-radius: 100%;
  z-index: 1;
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  border: 1.5rem solid #fff;
  background: #fff;
}

.btn-toggle:before {
  z-index: 3;
  content: '';
  width: 50px;
  height: 50px;
  margin-top: -25px;
  background-image: url( '../img/plus.svg' );
  background-color:  #d7d7d7;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 30%;
  position: absolute;
  margin-left: auto;
  margin-right: auto;
  left: 0;
  right: 0;
  transition: transform .5s ease-in-out;
  border-radius: 100%;
  cursor: pointer;
  pointer-events: all;
}

.btn-toggle:hover:before {
  transform: rotate( 180deg );
}

.btn-toggle-up:before {
  background-image: url( '../img/minus.svg' );
}

.toggle-text-container {
  height: 2rem;
  margin-top: 3rem;
  color: #c8c8c8;
  text-align: center;
  font-weight: 500;
}

.toggle-down {
  width: 100%;
  justify-content: center;
  padding-bottom: 40px;
}




/*
 * Scrolling websites
 * ----------------------------------------- */

.scrolling-website {
  position: relative;
  overflow: hidden;
  width: 100%;
  line-height: 0;
  background-size: 100% auto;
  background-repeat: no-repeat;
}

/* Pseudo element to prevent the scrollable background from flashing at the bottom */
.scrolling-website:before {
  content: '';
  position: absolute;
  width: 100%;
  height: 4px;
  background: #fff;
  left: 0;
  bottom: 0;
}

.bg .scrolling-website:before {
  background: #f8f8f8;
}

.scrolling-website-bg {
  position: absolute;
  top: 7%;
  left: 0;
  width: 100%;
  z-index: -1;
  background-repeat: no-repeat;
  -webkit-backface-visibility: hidden;
  -webkit-transform: translateZ( 0 );
  background-position: center top;
}

.scrolling-website-pad {
  background-size: 85% auto;
}






/*
 * Overlay
 * ----------------------------------------- */

#portfolio {
  overflow: hidden;
}






/*
 * Overlay
 * ----------------------------------------- */

.overlay {
  display: none;
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  overflow-y: scroll;
  background: rgba( 238,238,238, 1 );
  width: 100%;
  height: 100vh;
  -webkit-overflow-scrolling: touch;
}

@media all and ( max-width: 640px ) {
  .overlay {
    z-index: 300;
  }
}

.overlay section {
  position: absolute;
  left: 0;
  top: 0;
  transition: .5s 0s;
  transform: translateX( -10px );
  opacity: 0;
  width: 100%;
  min-height: 100vh;
  height: 100vh;
  overflow: hidden;
  pointer-events: none;
  padding: 160px 0;
  box-sizing: border-box;
}

@media all and ( max-width: 1280px ) {
  .overlay section {
    padding: 120px 0;
  }
}

@media all and ( max-width: 900px ) {
  .overlay section {
    padding: 80px 0;
  }
}

@media all and ( max-width: 660px ) {
  .overlay section {
    padding: 60px 0;
  }
}

.overlay section.is-active {
  transform: translateX( 0 );
  opacity: 1;
  transition: .5s .3s;
  height: auto;
  pointer-events: all;
}

.overlay .row {
  min-height: calc( 100vh - 200px - 200px );
}

@media all and ( max-width: 1280px ) {
  .overlay .row {
    min-height: calc( 100vh - 160px - 160px );
  }
}

@media all and ( max-width: 900px ) {
  .overlay .row {
    min-height: calc( 100vh - 120px - 120px );
  }
}

@media all and ( max-width: 660px ) {
  .overlay .row {
    min-height: calc( 100vh - 90px - 90px );
  }
}

.close-overlay {
  display: block;
  position: fixed;
  right: 25px;
  top: 25px;
  width: 2.5rem;
  height: 2.5rem;
  border: 0;
  z-index: 1000;
  background: #fff;
  border-radius: 100%;
  background-image: url( '../img/close-x.svg' );
  background-size: 50% auto;
  background-position: center center;
  background-repeat: no-repeat;
  box-sizing: border-box;
  transition: .3s;
}

.close-overlay:hover {
  transform: rotate( 90deg );
}

.overlay-services .col {
  display: flex;
  justify-content: space-between;
}

@media all and ( max-width: 780px ) {
  .overlay-services .col {
    flex-wrap: wrap;
    justify-content: center;
  }
}

.overlay-services .inner-col {
  width: 33%;
  margin: 0 20px;
}

.overlay-services .inner-col:first-of-type {
  margin-left: 0;
}

.overlay-services .inner-col:last-of-type {
  margin-right: 0;
}

@media all and ( max-width: 780px ) {
  .overlay-services .inner-col {
    width: 100%;
    margin: 0 !important;
  }
}

.section-services li {
  font-weight: 700;
  margin-bottom: 10px;
}

.section-services li:last-of-type {
  margin-bottom: -4px;
}

.section-services .tags {
  margin-top: -4px;
}



/*
 * SVG
 * ----------------------------------------- */

.svg-stroke {
  stroke: #000;
  transition: .3s;
  stroke-width: 6px;
}





/*
 * Etc.
 * ----------------------------------------- */

iframe {
  border: 0;
  width: 100%;
  border: 1px solid #f0f0f0;
}

.is-visible {
  opacity: 1;
}

.is-invisible {
  opacity: 0;
}





/*
 * Ströme & Spuren
 *
 * Hex – #50d9c7
 * RGB – 80, 217, 199
 *
 */

.project-stroemeundspuren a,
.stroemeundspuren a:hover {
  border-color: #50d9c7;
}

.project-stroemeundspuren .btn-toggle:before {
  background-color: #50d9c7;
}

.project-stroemeundspuren  ::-moz-selection {
  background-color: #50d9c7;
}

.project-stroemeundspuren  ::selection {
  background-color: #50d9c7;
}

@keyframes pulse-stroemeundspuren {
  0%   { box-shadow: 0 0 0 0       rgba( 80, 217, 199, 1 ); }
  50%  { box-shadow: 0 0 0 1.25rem rgba( 80, 217, 199, 0 ); }
  100% { box-shadow: 0 0 0 1.25rem rgba( 80, 217, 199, 0 ); }
}

.project-stroemeundspuren .btn-toggle:before {
  animation: pulse-stroemeundspuren 2.5s infinite cubic-bezier( .66, 0, 0, 1 );
}





/*
 * PUNKTSTRICH
 *
 * Hex – #ffb9a8
 * RGB – 255, 185, 168
 *
 */

.project-punktstrich a,
.punktstrich a:hover,
.punktstrich .is-active a,
.punktstrich .is-active,
.punktstrich .nav-project-circle,
.punktstrich .nav-item:hover .nav-project-circle {
  border-color: #ffb9a8;
}

.project-punktstrich .list:after,
.project-punktstrich .separator-line:after,
.project-punktstrich .btn-toggle:before {
  background-color: #ffb9a8;
}

.project-punktstrich ::-moz-selection {
  background-color: #ffb9a8;
}

.project-punktstrich ::selection {
  background-color: #ffb9a8;
}

@keyframes pulse-punktstrich {
  0%   { box-shadow: 0 0 0 0       rgba( 255, 185, 168, 1 ); }
  50%  { box-shadow: 0 0 0 1.25rem rgba( 255, 185, 168, 0 ); }
  100% { box-shadow: 0 0 0 1.25rem rgba( 255, 185, 168, 0 ); }
}

.project-punktstrich .btn-toggle:before {
  animation: pulse-punktstrich 2.5s infinite cubic-bezier( .66, 0, 0, 1 );
}

.punktstrich-offset-top-minus {
  margin-top: -2.8%;
}

@media all and ( max-width: 640px ) {
  .punktstrich-offset-top-minus {
    margin-top: 0;
  }
}

.scrolling-website-punktstrich {
  margin-top: -10%;
}

@media all and ( max-width: 640px ) {
  .scrolling-website-punktstrich {
    margin-top: 0;
  }
}

.scrolling-website-punktstrich:after {
  content: '';
  position: absolute;
  z-index: -2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
}

.scrolling-website-bg-punktstrich {
  top: 10%;
  height: 557%;
  background-image: url( '../../projects/punktstrich/punktstrich-web-01@2x.jpg' );
}




/*
 * NINDYAA
 *
 * Hex – #aab4fe
 * RGB – 170, 180, 254
 *
 */

.project-nindyaa a,
.nindyaa a:hover {
  border-color: #aab4fe;
}

.project-nindyaa .list:after,
.project-nindyaa .separator-line:after,
.project-nindyaa .btn-toggle:before {
  background-color: #aab4fe;
}

.project-nindyaa ::-moz-selection {
  background-color: #aab4fe;
}

.project-nindyaa ::selection {
  background-color: #aab4fe;
}

@keyframes pulse-nindyaa {
  0%   { box-shadow: 0 0 0 0       rgba( 170, 180, 254, 1 ); }
  50%  { box-shadow: 0 0 0 1.25rem rgba( 170, 180, 254, 0 ); }
  100% { box-shadow: 0 0 0 1.25rem rgba( 170, 180, 254, 0 ); }
}

.project-nindyaa .btn-toggle:before {
  animation: pulse-nindyaa 2.5s infinite cubic-bezier( .66, 0, 0, 1 );
}

.nindyaa-offset-top-minus {
  margin-top: -2.8%;
}

@media all and ( max-width: 640px ) {
  .nindyaa-offset-top-minus {
    margin-top: 0;
  }
}

.scrolling-website-bg-nindyaa {
  height: 528%;
  background-image: url( '../../projects/nindyaa/nindyaa-web-02@2x.jpg' );
}





/*
 * UCLab
 *
 * Hex – #00fa98
 * RGB – 0, 250, 152
 *
 */

.project-uclab a,
.uclab a:hover {
  border-color: #00fa98;
}

.project-uclab .btn-toggle:before {
  background-color: #00fa98;
}

.project-uclab ::-moz-selection {
  background-color: #00fa98;
}

.project-uclab ::selection {
  background-color: #00fa98;
}

@keyframes pulse-uclab {
  0%   { box-shadow: 0 0 0 0       rgba( 0, 250, 152, 1 ); }
  50%  { box-shadow: 0 0 0 1.25rem rgba( 0, 250, 152, 0 ); }
  100% { box-shadow: 0 0 0 1.25rem rgba( 0, 250, 152, 0 ); }
}

.project-uclab .btn-toggle:before {
  animation: pulse-uclab 2.5s infinite cubic-bezier( .66, 0, 0, 1 );
}

.uclab-offset-top-minus {
  margin-top: -5%;
}

@media all and ( max-width: 640px ) {
  .uclab-offset-top-minus {
    margin-top: 0;
  }
}

.project-uclab .fullwidth-bg {
  background: #626262;
}

@media all and ( max-width: 640px ) {

  video {
    width: 150%;
    margin-left: -25%;
  }

}

@media all and ( max-width: 480px ) {

  video {
    width: 200%;
    margin-left: -50%;
    margin-bottom: -10px;
  }

}


/*
 * Irden
 *
 * Hex – #ffa6b8
 * RGB – 236, 98, 84
 *
 */

.project-irden a,
.irden a:hover {
  border-color: #ec6254;
}

.project-irden .btn-toggle:before {
  background-color: #ec6254;
}

.project-irden ::-moz-selection {
  background-color: #ec6254;
}

.project-irden ::selection {
  background-color: #ec6254;
}

@keyframes pulse-irden {
  0%   { box-shadow: 0 0 0 0       rgba( 236, 98, 84, 1 ); }
  50%  { box-shadow: 0 0 0 1.25rem rgba( 236, 98, 84, 0 ); }
  100% { box-shadow: 0 0 0 1.25rem rgba( 236, 98, 84, 0 ); }
}

.project-irden .btn-toggle:before {
  animation: pulse-irden 2.5s infinite cubic-bezier( .66, 0, 0, 1 );
}


.scrolling-website-irden:after {
  content: '';
  position: absolute;
  z-index: -2;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #d6d6d6;
}

.scrolling-website-bg-irden {
  top: 8%;
  height: 557%;
  background-image: url( '../../projects/irden/irden-web-01@2x.jpg' );
}



.scrolling-website-bg-hdsx {
  top: 8%;
  height: 557%;
  background-image: url( '../../projects/hdsx/hdsx-web-02@2x.jpg' );
}



/*
 * COR
 *
 * Hex – #f0ca53
 * RGB – 240, 202, 83
 *
 */

.project-cor a,
.cor a:hover {
  border-color: #f0ca53;
}

.project-cor .btn-toggle:before {
  background-color: #f0ca53;
}

.project-cor ::-moz-selection {
  background-color: #f0ca53;
}

.project-cor ::selection {
  background-color: #f0ca53;
}

@keyframes pulse-cor {
  0%   { box-shadow: 0 0 0 0       rgba( 240, 202, 83, 1 ); }
  50%  { box-shadow: 0 0 0 1.25rem rgba( 240, 202, 83, 0 ); }
  100% { box-shadow: 0 0 0 1.25rem rgba( 240, 202, 83, 0 ); }
}

.project-cor .btn-toggle:before {
  animation: pulse-cor 2.5s infinite cubic-bezier( .66, 0, 0, 1 );
}

.cor-offset-top-minus {
  margin-top: -4%;
}

@media all and ( max-width: 640px ) {
  .cor-offset-top-minus {
    margin-top: 0;
  }
}

.bg-cor {
  background-image: url( '../../projects/cor/cor-konfigurator-bg.jpg' );
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 40% auto;
}




/*
 * Services
 */

.section-services.fullwidth-bg {
  background: #f8f8f8;
}