/* --------------------------------- FONTS -------------------------------- */
/* --------------------------------- COLOURS ----------------------------- */
/** Boldly original blue/green palette **/
/** Boldly multi-colour palette       **/
/** Boldly grayscale palette          **/
/*111*/
/*333*/
/*666*/
/*CCC*/
/** Mixing and matching colours       **/
/** Colours for buttons and alerts    **/
/* --------------------------------- MIXIN -------------------------------- */
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff4949+0,2e99ff+100 */
.grid::after {
  content: "";
  display: block;
  clear: both; }

[class^='col-'] {
  float: left; }

.col-1of12 {
  width: 8.33333%; }

.col-2of12 {
  width: 16.66666%; }

.col-3of12 {
  width: 25%; }

.col-4of12 {
  width: 33.33333%; }

.col-5of12 {
  width: 41.66666%; }

.col-6of12 {
  width: 50%; }

.col-7of12 {
  width: 58.33333%; }

.col-8of12 {
  width: 66.66666%; }

.col-9of12 {
  width: 75%; }

.col-10of12 {
  width: 83.33333%; }

.col-11of12 {
  width: 91.66666%; }

.col-12of12 {
  width: 100%; }

.col-1of10 {
  width: calc(100% / 10); }

.col-2of10 {
  width: calc(100% / 10 * 2); }

.col-3of10 {
  width: calc(100% / 10 * 3); }

.col-4of10 {
  width: calc(100% / 10 * 4); }

.col-5of10 {
  width: calc(100% / 10 * 5); }

.col-6of10 {
  width: calc(100% / 10 * 6); }

.col-7of10 {
  width: calc(100% / 10 * 6); }

.col-8of10 {
  width: calc(100% / 10 * 6); }

.col-9of10 {
  width: calc(100% / 10 * 9); }

.col-10of10 {
  width: calc(100% / 10 * 10); }

/* ----------------- SCALING DOWN ----------------- */
#nav-main > .grid .logo-container,
#nav-main > .grid .menu-toggle {
  z-index: 100; }

#nav-main > .grid .menu-container {
  -webkit-transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
  -moz-transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
  -ms-transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
  transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
  visibility: hidden;
  padding: 0;
  opacity: 0;
  width: 100%;
  height: 0vh;
  position: absolute;
  top: 0;
  left: 0; }

#nav-main.open > .grid .menu-container {
  visibility: visible;
  width: 100%;
  height: 100vh;
  background-color: #FFF;
  opacity: 1; }
  #nav-main.open > .grid .menu-container .btn.btn-nav {
    border-radius: 0;
    color: #0F0A0A;
    font-size: 2rem;
    background: transparent; }
    #nav-main.open > .grid .menu-container .btn.btn-nav.active {
      color: #FF5252 !important; }
    #nav-main.open > .grid .menu-container .btn.btn-nav:hover {
      background-color: #ff5252;
      color: #0F0A0A !important; }
#nav-main.open > .grid .menu-toggle svg {
  stroke: #0F0A0A; }
#nav-main.open #site-logo a {
  color: #0F0A0A !important;
  z-index: 9999; }

.btn.btn-nav {
  margin: 0;
  padding: 2rem 1.25rem;
  font-size: 1rem;
  text-align: center;
  color: inherit;
  border: none;
  border-radius: 0;
  display: block; }

@media (max-width: 115rem) {
  #directors {
    max-width: 80rem; }

  #projects {
    max-width: 80rem; }

  #gallery {
    max-width: 80rem; }

  #project-container {
    max-width: 80rem; } }
@media (max-width: 72.8125em) {
  #work {
    overflow: visible; }
    #work .project-snippet .snippet-body {
      left: 90%; }
    #work .project-snippet.right .snippet-body {
      left: -10%; }
    #work .project-snippet:hover .snippet-body {
      left: 95%; }
    #work .project-snippet:hover.right .snippet-body {
      left: -15%; }

  .gallery-container.active {
    overflow: visible; }
    .gallery-container.active .scroll-gallery {
      width: auto; }
      .gallery-container.active .scroll-gallery .gallery-section {
        display: block;
        margin-bottom: 4em; }
  .gallery-container .gallery-nav {
    visibility: hidden;
    position: absolute;
    left: -9999em; }

  #projects {
    padding: 2em 0; }

  section.subpage-banner .subpage-banner-container {
    padding: 1.5rem;
    padding-top: 8rem; } }
@media (max-width: 67.5em) {
  #site-logo > .col-8of12,
  #site-logo > .col-4of12 {
    width: 100%; }

  #projects {
    padding: 1rem; }
    #projects .badge {
      font-size: 0.6rem; } }
@media (max-width: 66.875em) {
  #work .btn {
    display: block;
    border-radius: 0;
    margin-bottom: 1rem;
    padding: 1em; }

  #work .col-left {
    padding: 1.5rem; }

  .title-large {
    font-size: 8rem;
    line-height: 8rem; } }
@media (max-width: 62.5em) {
  .fullpage-header h2 {
    font-size: 4em; }
  .fullpage-header .blank img {
    margin-top: 0; }
  .fullpage-header .fullpage-header-cta p {
    font-size: 1rem;
    margin-bottom: 0; }

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

  main {
    padding: 1rem !important; }

  #column-wrap {
    padding: 0; }

  #column-wrap > .grid > .col-2of12 {
    width: 100%;
    padding: 0 1rem; }

  #column-wrap > .grid > .col-8of12 {
    width: 100%; }

  #column-wrap > .grid > .col-10of12 {
    width: 100%; }

  #column-wrap main.main-twocolumn {
    max-width: 100%; }

  #column-wrap.director-column-wrap .subpage-header {
    padding: 0.5rem !important; }

  #sidebar-right .tag-container,
  #sidebar-right .share-links-container {
    text-align: center;
    margin: 0 auto; }

  .subpage-content .panel {
    margin: 0 auto !important;
    max-width: auto; }

  .subpage-feature h2 {
    font-size: 2rem; }

  #sidebar {
    z-index: 100;
    width: 100%;
    padding: 0;
    margin: 0;
    position: fixed;
    bottom: 0;
    left: 0; }
    #sidebar .sidebar-content {
      -webkit-transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
      -moz-transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
      -ms-transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
      transition: all 0.25s cubic-bezier(0.75, 0, 0.23, 1.01);
      background-color: #ff5252;
      height: 0;
      overflow: hidden; }
      #sidebar .sidebar-content ul {
        max-width: 100%;
        margin-top: 4rem; }
      #sidebar .sidebar-content li {
        margin: 0;
        color: #012B2E;
        text-align: center; }
      #sidebar .sidebar-content a {
        display: block;
        padding: 1rem;
        font-size: 2em;
        border: none;
        color: #0F0A0A; }
        #sidebar .sidebar-content a.active {
          color: #FFF; }
        #sidebar .sidebar-content a:hover {
          color: #FFF; }
      #sidebar .sidebar-content.open {
        height: 100vh;
        overflow: scroll;
        bottom: 0; }
        #sidebar .sidebar-content.open li:hover {
          background-color: #0F0A0A; }
        #sidebar .sidebar-content.open .spacer {
          display: none; }
    #sidebar .sidebar-toggle {
      visibility: visible;
      display: inline-block;
      position: fixed;
      bottom: 0; }

  .project .laurels-container .laurel {
    height: 4rem;
    width: 4rem; }

  #project-container [class^='col-'] {
    width: 50%; }
  #project-container .project-results [class^='col-12of12'] {
    width: 100%; }

  #director .basics-container {
    background-color: inherit;
    max-width: 40rem;
    margin: 0 auto; }
    #director .basics-container [class^='col-'] {
      width: 100%;
      margin-bottom: 0; }

  #footer-main .footer-subscribe-form [class^='col-'] {
    width: 50%; }
  #footer-main .footer-subscribe-form .form-actions {
    width: 100%; }
  #footer-main .footer-subscribe-form .btn {
    display: block;
    width: 100% !important; }
  #footer-main .footer-subscribe-form p.signup-cta {
    padding: 0 0.5rem; }

  .subpage-content .post-snippet,
  .subpage-content .post-thumb {
    padding-right: 0; }

  #gallery .col-4of12 {
    width: 100%; } }
@media (max-width: 59.5em) {
  .social-bar a.social-icon {
    margin: 0.25rem 0.6rem; }

  .production-process-grid .process-section .process-number {
    position: static;
    font-size: 1.5rem;
    font-weight: normal;
    color: #58E065; }

  #projects .badge {
    visibility: hidden; }

  .post-production-options [class^='col-'] {
    width: 100%; } }
@media (max-width: 56.5em) {
  .styleboard-container [class^='col-'] {
    width: 50%; }

  blockquote {
    font-size: 3rem;
    padding-right: 1rem;
    left: 3rem; } }
@media (max-width: 55em) {
  #work .project-snippet-container {
    min-height: 300px; }
  #work .project-snippet {
    max-width: 75%; }

  #project .project-header {
    padding-top: 0; }

  #project .project-container .brand-grid {
    margin: 0 auto !important; }

  #footer-main [class^='col-'] {
    width: 100%; }
  #footer-main .social-container .social-bar {
    padding: 0;
    padding-bottom: 2rem;
    text-align: center; }
  #footer-main .footer-menu-group {
    width: 100%; }
    #footer-main .footer-menu-group ul {
      margin: 0;
      max-width: 100%; }
      #footer-main .footer-menu-group ul li {
        display: block;
        margin: 0;
        text-align: center; }
        #footer-main .footer-menu-group ul li a {
          border: none;
          display: block; }
  #footer-main .legend {
    text-align: center;
    margin: 0;
    margin-top: 2rem; }
    #footer-main .legend:before {
      display: block;
      margin: 0.5rem auto; }

  #footer-menu {
    padding: 1rem; }
    #footer-menu .grid {
      margin: 0;
      padding: 0; } }
@media (max-width: 54.75em) {
  #work .work-section .grid .grid [class^='col-'] {
    width: 50%; }

  #work .work-section .col-left {
    padding: 1rem !important; }

  .flexbox .blog-grid .col-10of12 {
    order: 2;
    width: 100%; }
  .flexbox .blog-grid .col-2of12 {
    order: 1;
    width: 100%;
    margin-bottom: 2em; }
  .flexbox .blog-grid .post-snippet [class^='col-'] {
    width: 100%; }
  .flexbox .blog-grid .post-snippet img {
    margin: 0 auto; }

  .impressum [class^='col-'] {
    width: 100% !important; } }
@media (max-width: 52.5em) {
  .fullpage-header [class^='col-'] {
    width: 100%; }
  .fullpage-header h2, .fullpage-header p {
    margin-left: auto;
    margin-right: auto;
    padding: 0 1rem; }
  .fullpage-header h2 {
    font-size: 3rem; }
  .fullpage-header p {
    font-size: 1.2rem; }
  .fullpage-header .fullpage-header-cta {
    padding: 0;
    padding-bottom: 1rem; }
    .fullpage-header .fullpage-header-cta p {
      visibility: hidden;
      position: absolute; }
    .fullpage-header .fullpage-header-cta .col-6of12 {
      padding-bottom: 0; }

  .gallery .col-4of12 {
    width: 100%; }

  #project .project-container [class^='col-'] {
    width: 100%; }

  #project .project-container .bts-container {
    padding: 1rem;
    margin-top: 2rem; }

  #project .project-container .captions-grid {
    padding: 0; }

  #project .project-container .project-snippet {
    margin: 0;
    margin-bottom: 1.5rem;
    padding: 1rem; }
    #project .project-container .project-snippet p {
      font-size: 1rem;
      padding-left: 0; }

  #project .video-grid {
    width: 100%; }
    #project .video-grid [class^='col-'] {
      width: 100%; }

  #project .project-container .roles-grid .col-variable {
    width: 25%;
    text-align: left; }

  #project .project-container .info-grid {
    padding: 0; }
    #project .project-container .info-grid .pullquote-container {
      min-height: auto;
      padding: 1rem; }
      #project .project-container .info-grid .pullquote-container .container-inner {
        position: static;
        transform: none; }
    #project .project-container .info-grid .callout {
      margin: 4rem 0; }

  #project .project-container .info-grid .pullquote-container .title-large {
    position: static !important;
    transform: none; }

  .flexbox #project .bts-container .captions-grid-container {
    order: 1; }

  .flexbox #project .bts-container .roles-grid {
    order: 2; }

  h1.title-large {
    font-size: 5rem;
    line-height: 5rem; }

  #contact [class^="col-"] {
    width: 100%; } }
@media (max-width: 46.5em) {
  #header-main {
    padding: 0;
    background-color: transparent; }
    #header-main #boldly-logo-svg path {
      fill: #FFF;
      stroke: #FFF; }
    #header-main #boldly-logo-svg:hover path {
      opacity: 0.8; }

  #projects .project {
    width: 100%;
    margin-bottom: 1rem; }
    #projects .project .project-blurb {
      position: static;
      padding: 0;
      opacity: 1;
      overflow: hidden; }
      #projects .project .project-blurb img.logo {
        display: none; }
      #projects .project .project-blurb h3, #projects .project .project-blurb p {
        visibility: visible;
        font-size: 1rem;
        font-weight: bold;
        text-align: center;
        margin: 0.25rem 0; }
      #projects .project .project-blurb .client {
        font-size: 0.8rem;
        font-weight: 100; }
    #projects .project.stills-project {
      margin: 0;
      margin-bottom: 1rem; }
    #projects .project .tags {
      opacity: 1;
      position: static;
      color: inherit;
      padding: 0 1rem;
      margin: 0; }
    #projects .project picture img {
      -webkit-filter: brightness(0.4) grayscale(1);
      -moz-filter: brightness(0.4) grayscale(1);
      -ms-filter: brightness(0.4) grayscale(1);
      filter: brightness(0.4) grayscale(1); }
    #projects .project:hover picture img {
      -webkit-filter: brightness(1) grayscale(0);
      -moz-filter: brightness(1) grayscale(0);
      -ms-filter: brightness(1) grayscale(0);
      filter: brightness(1) grayscale(0); }

  #project .project-container .roles-grid .col-variable {
    width: 33.33333%; }

  .post-snippet h2 {
    font-size: 1.2rem; }
  .post-snippet .snippet-body {
    font-size: 0.9rem; }

  #directors [class^='col-'] {
    width: 100%;
    margin-bottom: 1rem; }

  #director .reel-container .col-6of12 {
    width: 100%; }
  #director .awards-container {
    display: none; }

  .featurefilm-header .video-grid {
    position: static; }

  h1.title-large {
    font-size: 3rem;
    line-height: 3rem; }

  blockquote {
    font-size: 3rem;
    left: 2rem; }
    blockquote::before {
      left: -4rem; } }
@media (max-width: 43.75em) {
  .subpage-feature {
    margin-bottom: 2rem; }
    .subpage-feature [class^='col-'] {
      width: 100%; }
    .subpage-feature .subpage-feature-inner {
      position: static;
      transform: none;
      text-align: center;
      margin: 0 auto; }

  #project .project-container .info-grid .pullquote-container .title-large {
    font-size: 10rem;
    line-height: 8.5rem;
    white-space: pre-wrap; }

  #project .project-footer-nav .post-nav-link .project-tag {
    font-size: 0.8rem; }

  #footer-main .footer-subscribe-form {
    display: hidden; }

  #column-wrap main .col-4of12,
  #column-wrap main .col-6of12,
  #column-wrap main .col-8of12 {
    width: 100%; }
  #column-wrap main .sidebar-snippet {
    width: 33.33333% !important; }

  #work .work-section > .grid > .col-6of12 {
    width: 100%; }

  #work .section-feature {
    padding: 0 1rem; }
  #work .project-snippet-container {
    min-height: auto; }
  #work .project-snippet {
    margin-bottom: 1rem;
    width: 100%; }

  #work-startups {
    visibility: hidden;
    position: absolute;
    left: -9999em; }

  .about-grid .col-2of10 {
    width: 100%;
    position: static; }

  .producers-grid [class^='col-'] {
    width: 100%; }
    .producers-grid [class^='col-'] .thumbnail {
      max-width: 50%;
      margin: 0 auto; }
    .producers-grid [class^='col-'] .badge-large {
      display: block;
      margin: 0 auto;
      padding: 0.5rem;
      font-size: 1.2rem; }
  .producers-grid .social-grid {
    display: none; }

  .client-grid [class^='col-'] {
    width: calc(100% / 3); }
    .client-grid [class^='col-']:nth-child(-n+2) {
      display: none; }

  .vertical-container .vertical-inner {
    position: static;
    text-align: left;
    top: 0;
    left: 0;
    transform: none; }

  #contact .contact-point {
    padding: 1rem;
    margin-bottom: 1rem;
    min-height: 3em;
    text-align: center; }
    #contact .contact-point .abbr {
      visibility: hidden; } }
@media (max-width: 40em) {
  #index-directors {
    visibility: hidden;
    position: absolute;
    left: -9999em; }

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

  #work .project-snippet-container {
    height: auto; }
  #work .project-snippet {
    max-width: 100%;
    position: relative; }
    #work .project-snippet .snippet-body {
      max-width: 100%;
      opacity: 1;
      left: 0 !important; }
      #work .project-snippet .snippet-body span {
        font-size: 0.8rem; }

  #project .casestudy-block .casestudy-text p {
    text-align: left; }

  .post h1 {
    font-size: 3rem;
    line-height: 3rem; }

  .header-paragraph {
    position: static; }

  .subpage-content-lifted {
    position: static; }

  .title-large {
    font-size: 3rem;
    line-height: 3rem; } }
@media (max-width: 37.5em) {
  .fullpage-header .section-inner h1 {
    padding: 1rem;
    font-size: 2rem; }
  .fullpage-header .section-inner p.lead {
    font-size: 1.5em; }

  .index-fullpage-header h1, .index-fullpage-header a, .index-fullpage-header p {
    width: 100%;
    padding: 0; }
  .index-fullpage-header .section-inner {
    width: 100%; }

  .project .laurels-container .laurel:not(:first-child) {
    display: none; }

  #project .video-grid p.lead {
    font-size: 1.5em; }

  #project .callout {
    padding: 0 1rem; }

  .thumbnail-grid .col-3of12 {
    width: 50%; }

  #project .project-tags a {
    display: block; } }
@media (max-height: 35.5em) {
  #about .about-feature p {
    font-size: 1rem; }

  .fullpage-header .fullpage-header-cta p {
    font-size: 1rem;
    margin-bottom: 0; }

  .subpage-feature .subpage-feature-inner h2 {
    font-size: 1.2rem; }
  .subpage-feature .subpage-feature-inner p {
    font-size: 0.9rem; } }
@media (max-width: 34.5em) {
  #work .work-section > .grid > .col-4of12 {
    width: 100%; }

  #projects .project .laurels-container {
    top: 0.5rem; }
    #projects .project .laurels-container .laurel {
      padding: 0.5rem; }

  #project .project-container .roles-grid .col-variable {
    width: 50%; }
    #project .project-container .roles-grid .col-variable p {
      text-align: left; }

  #project .casestudy-block .casestudy-text {
    padding: 1rem; }

  #index-clients {
    padding: 1rem; }
    #index-clients .client-grid img {
      padding: 1rem; } }
@media (max-width: 31.25em) {
  .fullpage-header h2 {
    font-size: 2em; }

  p.lead {
    font-size: 1.25rem; }

  #site-logo {
    font-size: 2rem;
    top: 0; }

  #director-splash .section-inner {
    max-width: 22rem; }

  .subpage-header h1 {
    margin: 2rem 1rem; }

  #director-splash-inner {
    width: 100%; }

  #project .featurefilm-header .pullquote-container h2 {
    font-size: 2.5rem;
    padding: 1rem; }
  #project .scope-container h2,
  #project .scope-container p {
    text-align: left; }
  #project .roles-grid .role {
    text-align: left; }
  #project .stills-content .col-4of12 {
    width: 100%; } }
@media (max-width: 30em) {
  #project .project-footer-nav .post-nav-link {
    font-size: 0.8em;
    padding: 1em; }

  #project .video-grid p.lead {
    font-size: 1.2em; }

  #director .awards-container [class^='col-'] {
    width: 100%; } }
@media (max-width: 28.125em) {
  .thumbnail-grid .col-3of12 {
    width: 100%; }

  #projects .project .laurel {
    display: none; } }

/*# sourceMappingURL=grid.css.map */