/*!
Theme Name: Barebones
Theme URI: https://benchmark.co.uk/barebones
Author: Benchmark Studios
Author URI: https://benchmark.co.uk/
Description: A lightweight and skeletal WordPress boilerplate theme for HTML5 and beyond
Version: 3.X
License: MIT
License URI: https://mit-license.org/
Text Domain: barebones
*/
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
    width: 100%
}

.container:before, .container:after {
    content: " ";
    display: table
}
.section.section--services .image_class .custom_portfoio_wrapper img {
    width: 40%;
}

.container:after {
    clear: both
}

.row {
    list-style: none;
    margin-left: -24px
}

.row:not(.row--flex):before, .row:not(.row--flex):after {
    content: " ";
    display: table
}

.row:not(.row--flex):after {
    clear: both
}

.row.row--gutterless {
    margin-left: 0
}

.row.row--flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.row.row--marginbottom {
    margin-bottom: 24px
}

.col {
    float: left;
    padding-left: 24px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.row--gutterless .col {
    padding-left: 0
}
h2.site-sub-title-section-wrap {
    font-size: 18px;
}
@media only screen and (min-width: 1024px) {
    .col--lg-offset-0 {
        margin-left: 0%
    }

    .col--lg-1 {
        width: 8.33333%
    }

    .row--flex .col--lg-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        max-width: 8.33333%;
        width: auto;
        float: none
    }

    .col--lg-offset-1 {
        margin-left: 8.33333%
    }

    .col--lg-2 {
        width: 16.66667%
    }

    .row--flex .col--lg-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        max-width: 16.66667%;
        width: auto;
        float: none
    }

    .col--lg-offset-2 {
        margin-left: 16.66667%
    }

    .col--lg-3 {
        width: 25%
    }

    .row--flex .col--lg-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        max-width: 25%;
        width: auto;
        float: none
    }

    .col--lg-offset-3 {
        margin-left: 25%
    }

    .col--lg-4 {
        width: 33.33333%
    }

    .row--flex .col--lg-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        max-width: 33.33333%;
        width: auto;
        float: none
    }

    .col--lg-offset-4 {
        margin-left: 33.33333%
    }

    .col--lg-5 {
        width: 41.66667%
    }

    .row--flex .col--lg-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        max-width: 41.66667%;
        width: auto;
        float: none
    }

    .col--lg-offset-5 {
        margin-left: 41.66667%
    }

    .col--lg-6 {
        width: 50%
    }

    .row--flex .col--lg-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        max-width: 50%;
        width: auto;
        float: none
    }

    .col--lg-offset-6 {
        margin-left: 50%
    }

    .col--lg-7 {
        width: 58.33333%
    }

    .row--flex .col--lg-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        max-width: 58.33333%;
        width: auto;
        float: none
    }

    .col--lg-offset-7 {
        margin-left: 58.33333%
    }

    .col--lg-8 {
        width: 66.66667%
    }

    .row--flex .col--lg-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        max-width: 66.66667%;
        width: auto;
        float: none
    }

    .col--lg-offset-8 {
        margin-left: 66.66667%
    }

    .col--lg-9 {
        width: 75%
    }

    .row--flex .col--lg-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        max-width: 75%;
        width: auto;
        float: none
    }

    .col--lg-offset-9 {
        margin-left: 75%
    }

    .col--lg-10 {
        width: 83.33333%
    }

    .row--flex .col--lg-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        max-width: 83.33333%;
        width: auto;
        float: none
    }

    .col--lg-offset-10 {
        margin-left: 83.33333%
    }

    .col--lg-11 {
        width: 91.66667%
    }

    .row--flex .col--lg-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        max-width: 91.66667%;
        width: auto;
        float: none
    }

    .col--lg-offset-11 {
        margin-left: 91.66667%
    }

    .col--lg-12 {
        width: 100%
    }

    .row--flex .col--lg-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        max-width: 100%;
        width: auto;
        float: none
    }

    .col--lg-offset-12 {
        margin-left: 100%
    }
}

@media only screen and (min-width: 769px) and (max-width: 1023px) {
    .col--md-offset-0 {
        margin-left: 0%
    }

    .col--md-1 {
        width: 8.33333%
    }

    .row--flex .col--md-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        max-width: 8.33333%;
        width: auto;
        float: none
    }

    .col--md-offset-1 {
        margin-left: 8.33333%
    }

    .col--md-2 {
        width: 16.66667%
    }

    .row--flex .col--md-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        max-width: 16.66667%;
        width: auto;
        float: none
    }

    .col--md-offset-2 {
        margin-left: 16.66667%
    }

    .col--md-3 {
        width: 25%
    }

    .row--flex .col--md-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        max-width: 25%;
        width: auto;
        float: none
    }

    .col--md-offset-3 {
        margin-left: 25%
    }

    .col--md-4 {
        width: 33.33333%
    }

    .row--flex .col--md-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        max-width: 33.33333%;
        width: auto;
        float: none
    }

    .col--md-offset-4 {
        margin-left: 33.33333%
    }

    .col--md-5 {
        width: 41.66667%
    }

    .row--flex .col--md-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        max-width: 41.66667%;
        width: auto;
        float: none
    }

    .col--md-offset-5 {
        margin-left: 41.66667%
    }

    .col--md-6 {
        width: 50%
    }

    .row--flex .col--md-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        max-width: 50%;
        width: auto;
        float: none
    }

    .col--md-offset-6 {
        margin-left: 50%
    }

    .col--md-7 {
        width: 58.33333%
    }

    .row--flex .col--md-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        max-width: 58.33333%;
        width: auto;
        float: none
    }

    .col--md-offset-7 {
        margin-left: 58.33333%
    }

    .col--md-8 {
        width: 66.66667%
    }

    .row--flex .col--md-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        max-width: 66.66667%;
        width: auto;
        float: none
    }

    .col--md-offset-8 {
        margin-left: 66.66667%
    }

    .col--md-9 {
        width: 75%
    }

    .row--flex .col--md-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        max-width: 75%;
        width: auto;
        float: none
    }

    .col--md-offset-9 {
        margin-left: 75%
    }

    .col--md-10 {
        width: 83.33333%
    }

    .row--flex .col--md-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        max-width: 83.33333%;
        width: auto;
        float: none
    }

    .col--md-offset-10 {
        margin-left: 83.33333%
    }

    .col--md-11 {
        width: 91.66667%
    }

    .row--flex .col--md-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        max-width: 91.66667%;
        width: auto;
        float: none
    }

    .col--md-offset-11 {
        margin-left: 91.66667%
    }

    .col--md-12 {
        width: 100%
    }

    .row--flex .col--md-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        max-width: 100%;
        width: auto;
        float: none
    }

    .col--md-offset-12 {
        margin-left: 100%
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
    .col--sm-offset-0 {
        margin-left: 0%
    }

    .col--sm-1 {
        width: 8.33333%
    }

    .row--flex .col--sm-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        max-width: 8.33333%;
        width: auto;
        float: none
    }

    .col--sm-offset-1 {
        margin-left: 8.33333%
    }

    .col--sm-2 {
        width: 16.66667%
    }

    .row--flex .col--sm-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        max-width: 16.66667%;
        width: auto;
        float: none
    }

    .col--sm-offset-2 {
        margin-left: 16.66667%
    }

    .col--sm-3 {
        width: 25%
    }

    .row--flex .col--sm-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        max-width: 25%;
        width: auto;
        float: none
    }

    .col--sm-offset-3 {
        margin-left: 25%
    }

    .col--sm-4 {
        width: 33.33333%
    }

    .row--flex .col--sm-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        max-width: 33.33333%;
        width: auto;
        float: none
    }

    .col--sm-offset-4 {
        margin-left: 33.33333%
    }

    .col--sm-5 {
        width: 41.66667%
    }

    .row--flex .col--sm-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        max-width: 41.66667%;
        width: auto;
        float: none
    }

    .col--sm-offset-5 {
        margin-left: 41.66667%
    }

    .col--sm-6 {
        width: 50%
    }

    .row--flex .col--sm-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        max-width: 50%;
        width: auto;
        float: none
    }

    .col--sm-offset-6 {
        margin-left: 50%
    }

    .col--sm-7 {
        width: 58.33333%
    }

    .row--flex .col--sm-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        max-width: 58.33333%;
        width: auto;
        float: none
    }

    .col--sm-offset-7 {
        margin-left: 58.33333%
    }

    .col--sm-8 {
        width: 66.66667%
    }

    .row--flex .col--sm-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        max-width: 66.66667%;
        width: auto;
        float: none
    }

    .col--sm-offset-8 {
        margin-left: 66.66667%
    }

    .col--sm-9 {
        width: 75%
    }

    .row--flex .col--sm-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        max-width: 75%;
        width: auto;
        float: none
    }

    .col--sm-offset-9 {
        margin-left: 75%
    }

    .col--sm-10 {
        width: 83.33333%
    }

    .row--flex .col--sm-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        max-width: 83.33333%;
        width: auto;
        float: none
    }

    .col--sm-offset-10 {
        margin-left: 83.33333%
    }

    .col--sm-11 {
        width: 91.66667%
    }

    .row--flex .col--sm-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        max-width: 91.66667%;
        width: auto;
        float: none
    }

    .col--sm-offset-11 {
        margin-left: 91.66667%
    }

    .col--sm-12 {
        width: 100%
    }

    .row--flex .col--sm-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        max-width: 100%;
        width: auto;
        float: none
    }

    .col--sm-offset-12 {
        margin-left: 100%
    }
}

@media only screen and (max-width: 480px) {
    .col--xs-offset-0 {
        margin-left: 0%
    }

    .col--xs-1 {
        width: 8.33333%
    }

    .row--flex .col--xs-1 {
        -ms-flex-preferred-size: 8.33333%;
        flex-basis: 8.33333%;
        max-width: 8.33333%;
        width: auto;
        float: none
    }

    .col--xs-offset-1 {
        margin-left: 8.33333%
    }

    .col--xs-2 {
        width: 16.66667%
    }

    .row--flex .col--xs-2 {
        -ms-flex-preferred-size: 16.66667%;
        flex-basis: 16.66667%;
        max-width: 16.66667%;
        width: auto;
        float: none
    }

    .col--xs-offset-2 {
        margin-left: 16.66667%
    }

    .col--xs-3 {
        width: 25%
    }

    .row--flex .col--xs-3 {
        -ms-flex-preferred-size: 25%;
        flex-basis: 25%;
        max-width: 25%;
        width: auto;
        float: none
    }

    .col--xs-offset-3 {
        margin-left: 25%
    }

    .col--xs-4 {
        width: 33.33333%
    }

    .row--flex .col--xs-4 {
        -ms-flex-preferred-size: 33.33333%;
        flex-basis: 33.33333%;
        max-width: 33.33333%;
        width: auto;
        float: none
    }

    .col--xs-offset-4 {
        margin-left: 33.33333%
    }

    .col--xs-5 {
        width: 41.66667%
    }

    .row--flex .col--xs-5 {
        -ms-flex-preferred-size: 41.66667%;
        flex-basis: 41.66667%;
        max-width: 41.66667%;
        width: auto;
        float: none
    }

    .col--xs-offset-5 {
        margin-left: 41.66667%
    }

    .col--xs-6 {
        width: 50%
    }

    .row--flex .col--xs-6 {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        max-width: 50%;
        width: auto;
        float: none
    }

    .col--xs-offset-6 {
        margin-left: 50%
    }

    .col--xs-7 {
        width: 58.33333%
    }

    .row--flex .col--xs-7 {
        -ms-flex-preferred-size: 58.33333%;
        flex-basis: 58.33333%;
        max-width: 58.33333%;
        width: auto;
        float: none
    }

    .col--xs-offset-7 {
        margin-left: 58.33333%
    }

    .col--xs-8 {
        width: 66.66667%
    }

    .row--flex .col--xs-8 {
        -ms-flex-preferred-size: 66.66667%;
        flex-basis: 66.66667%;
        max-width: 66.66667%;
        width: auto;
        float: none
    }

    .col--xs-offset-8 {
        margin-left: 66.66667%
    }

    .col--xs-9 {
        width: 75%
    }

    .row--flex .col--xs-9 {
        -ms-flex-preferred-size: 75%;
        flex-basis: 75%;
        max-width: 75%;
        width: auto;
        float: none
    }

    .col--xs-offset-9 {
        margin-left: 75%
    }

    .col--xs-10 {
        width: 83.33333%
    }

    .row--flex .col--xs-10 {
        -ms-flex-preferred-size: 83.33333%;
        flex-basis: 83.33333%;
        max-width: 83.33333%;
        width: auto;
        float: none
    }

    .col--xs-offset-10 {
        margin-left: 83.33333%
    }

    .col--xs-11 {
        width: 91.66667%
    }

    .row--flex .col--xs-11 {
        -ms-flex-preferred-size: 91.66667%;
        flex-basis: 91.66667%;
        max-width: 91.66667%;
        width: auto;
        float: none
    }

    .col--xs-offset-11 {
        margin-left: 91.66667%
    }

    .col--xs-12 {
        width: 100%
    }

    .row--flex .col--xs-12 {
        -ms-flex-preferred-size: 100%;
        flex-basis: 100%;
        max-width: 100%;
        width: auto;
        float: none
    }

    .col--xs-offset-12 {
        margin-left: 100%
    }
}

/*! locomotive-scroll v4.1.0 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */
html.has-scroll-smooth {
    overflow: hidden
}

html.has-scroll-dragging {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.has-scroll-smooth body {
    overflow: hidden
}

.has-scroll-smooth [data-scroll-container] {
    min-height: 100vh
}

[data-scroll-direction="horizontal"] [data-scroll-container] {
    white-space: nowrap;
    height: 100vh;
    display: inline-block;
    white-space: nowrap
}

[data-scroll-direction="horizontal"] [data-scroll-section] {
    display: inline-block;
    vertical-align: top;
    white-space: nowrap;
    height: 100%
}

.c-scrollbar {
    position: absolute;
    right: 0;
    top: 0;
    width: 11px;
    height: 100%;
    -webkit-transform-origin: center right;
    -ms-transform-origin: center right;
    transform-origin: center right;
    -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
    transition: opacity 0.3s, -webkit-transform 0.3s;
    -o-transition: transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s;
    transition: transform 0.3s, opacity 0.3s, -webkit-transform 0.3s;
    opacity: 0
}

.c-scrollbar:hover {
    -webkit-transform: scaleX(1.45);
    -ms-transform: scaleX(1.45);
    transform: scaleX(1.45)
}

.c-scrollbar:hover, .has-scroll-scrolling .c-scrollbar, .has-scroll-dragging .c-scrollbar {
    opacity: 1
}

[data-scroll-direction="horizontal"] .c-scrollbar {
    width: 100%;
    height: 10px;
    top: auto;
    bottom: 0;
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1)
}

[data-scroll-direction="horizontal"] .c-scrollbar:hover {
    -webkit-transform: scaleY(1.3);
    -ms-transform: scaleY(1.3);
    transform: scaleY(1.3)
}

.c-scrollbar_thumb {
    position: absolute;
    top: 0;
    right: 0;
    background-color: black;
    opacity: 0.5;
    width: 7px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    margin: 2px;
    cursor: -webkit-grab;
    cursor: grab
}

.has-scroll-dragging .c-scrollbar_thumb {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

[data-scroll-direction="horizontal"] .c-scrollbar_thumb {
    right: auto;
    bottom: 0
}

* {
    background-color: transparent;
    border: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font: inherit;
    margin: 0;
    padding: 0
}

html {
    background-color: white;
    font-size: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    text-rendering: optimizeLegibility
}

input, select, textarea, button {
    color: inherit;
    display: inline-block
}

input[disabled], select[disabled], textarea[disabled], button[disabled] {
    cursor: not-allowed
}

button {
    cursor: pointer
}

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

table th, table td {
    text-align: left
}

@media only screen and (min-width: 1024px) {
    .visible-lg {
        display: block !important
    }
}

@media only screen and (min-width: 1024px) {
    .hidden-lg {
        display: none !important
    }
}

@media only screen and (min-width: 769px) and (max-width: 1023px) {
    .visible-md {
        display: block !important
    }
}

@media only screen and (min-width: 769px) and (max-width: 1023px) {
    .hidden-md {
        display: none !important
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
    .visible-sm {
        display: block !important
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
    .hidden-sm {
        display: none !important
    }
}

@media only screen and (max-width: 480px) {
    .visible-xs {
        display: block !important
    }
}

@media only screen and (max-width: 480px) {
    .hidden-xs {
        display: none !important
    }
}

.alignleft, .float-left {
    float: left
}

img .alignleft, img .float-left {
    margin-right: 24px
}

.alignright, .float-right {
    float: right
}

img .alignright, img .float-right {
    margin-left: 24px
}

.aligncenter, .float-center {
    display: block;
    margin-left: auto;
    margin-right: auto
}

img .aligncenter, img .float-center {
    margin-bottom: 24px
}

.clearfix:before, .clearfix:after {
    content: " ";
    display: table
}

.clearfix:after {
    clear: both
}

.row--v-align-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.align-text-left {
    text-align: left
}

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

.align-text-center {
    text-align: center
}

.visible-on-mobile {
    display: none !important
}

@media screen and (max-width: 768px) {
    .visible-on-mobile {
        display: block !important
    }
}

.visible-on-tablet {
    display: none !important
}

@media screen and (max-width: 1040px) {
    .visible-on-tablet {
        display: block !important
    }
}

@media screen and (max-width: 768px) {
    .visible-on-tablet {
        display: none !important
    }
}

@media screen and (max-width: 1040px) {
    .visible-on-desktop {
        display: none !important
    }
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0
}

.pointer-none {
    pointer-events: none
}

.flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.items-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.justify-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.full-height {
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh
}

.full-width {
    width: 100%
}

.sticky-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    margin-bottom: 96px
}

.fade-on-load {
    display: none
}

.blog-posts {
    padding: 48px 0
}

.relative {
    position: relative
}

body {
    color: #444;
    font-family: "Proxima Nova", sans-serif;
    line-height: 1.5;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none;
    background-color: #fff;
    font-size: 16px;
    font-size: 1rem
}

body.noscroll {
    overflow: hidden
}

h1, h2, h3, h4, h5, h6, p, hr, ul, ol, dl {
    margin-bottom: 24px
}

h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child, hr:last-child, ul:last-child, ol:last-child, dl:last-child {
    margin-bottom: 0
}

a {
    color: #444;
    text-decoration: none;
    -webkit-transition: color 250ms;
    -o-transition: color 250ms;
    transition: color 250ms
}

a:hover {
    color: #F8AC2A
}

a[href^="tel"] {
    font-size: inherit;
    font-family: inherit;
    color: inherit;
    text-decoration: none;
    font-style: inherit
}

a[href^="tel"]:hover {
    color: #F8AC2A
}

hr {
    height: 1px;
    background-color: #444
}

.grid {
    display: grid;
    grid-gap: 24px
}

@media screen and (max-width: 768px) {
    .grid {
        grid-gap: 12px
    }
}

@media only screen and (min-width: 1024px) {
    .grid.grid--lg-1x {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .grid.grid--lg-2x {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .grid.grid--lg-3x {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .grid.grid--lg-4x {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .grid.grid--lg-5x {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .grid.grid--lg-6x {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }
}

@media only screen and (min-width: 769px) and (max-width: 1023px) {
    .grid.grid--md-1x {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .grid.grid--md-2x {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .grid.grid--md-3x {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .grid.grid--md-4x {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .grid.grid--md-5x {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .grid.grid--md-6x {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
    .grid.grid--sm-1x {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .grid.grid--sm-2x {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .grid.grid--sm-3x {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .grid.grid--sm-4x {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .grid.grid--sm-5x {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .grid.grid--sm-6x {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }
}

@media only screen and (max-width: 480px) {
    .grid.grid--xs-1x {
        grid-template-columns: repeat(1, minmax(0, 1fr))
    }

    .grid.grid--xs-2x {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    .grid.grid--xs-3x {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .grid.grid--xs-4x {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

    .grid.grid--xs-5x {
        grid-template-columns: repeat(5, minmax(0, 1fr))
    }

    .grid.grid--xs-6x {
        grid-template-columns: repeat(6, minmax(0, 1fr))
    }
}

@font-face {
    font-family: 'Big Caslon';
    src: url("fonts/BigCaslon-Medium.woff2") format("woff2"), url("fonts/BigCaslon-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Brown';
    src: url("fonts/Brown-Regular.woff2") format("woff2"), url("fonts/Brown-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Superior Title TRIAL';
    src: url("fonts/SuperiorTitleTRIAL-Black.woff2") format("woff2"), url("fonts/SuperiorTitleTRIAL-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Superior Title Web';
    src: url("fonts/SuperiorTitleWeb-Black.woff2") format("woff2"), url("fonts/SuperiorTitleWeb-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: 'Proxima Nova';
    src: url("fonts/ProximaNova-Regular.woff2") format("woff2"), url("fonts/ProximaNova-Regular.woff") format("woff");
    font-weight: normal;
    font-style: normal;
    font-display: swap
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: top
}

.is-fluid {
    display: block;
    width: 100%;
    height: auto
}

.fixed {
    position: fixed;
    z-index: 2
}

.position-relative {
    position: relative
}

.absolute {
    position: absolute
}

.fixed-center {
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.scaled-image {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 100%;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 0
}

.home .scaled-image {
    z-index: 3
}

.scaled-image img, .scaled-image .scale-video {
    position: absolute;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    width: 100vw;
    height: 100vh;
    max-width: unset
}

@media screen and (max-width: 480px) {
    .scaled-image .scale-video {
        width: 100%
    }
}

.will-scale {
    will-change: width, height
}

*:focus {
    outline: 0
}

input, select, textarea {
    background-color: #fff;
    border: solid 1px #444;
    -webkit-border-radius: 0;
    border-radius: 0;
    color: #444;
    line-height: 36px;
    height: 36px;
    padding: 0 12px;
    width: 100%
}

input[type="checkbox"], input[type="radio"] {
    background: transparent;
    border: 0;
    line-height: normal;
    height: auto;
    width: auto
}

input[type="file"] {
    line-height: normal;
    height: auto;
    padding: 6px 12px
}

input[type="submit"] {
    -webkit-border-radius: 0;
    border-radius: 0
}

input[disabled] {
    background-color: whitesmoke;
    cursor: not-allowed
}

select {
    line-height: normal;
    padding: 0;
    padding-left: 12px
}

textarea {
    min-height: 96px;
    overflow: auto;
    vertical-align: top;
    resize: vertical
}

.form--inline .form__group {
    display: inline-block
}

.form .form__group {
    display: block;
    margin-bottom: 24px
}

.form .form__group .form__label {
    display: block;
    margin-bottom: 12px
}

#vfbField12, #vfbField3 {
    margin-bottom: 24px
}

#vfbField12 .vfb-control-label, #vfbField3 .vfb-control-label {
    margin-bottom: 12px;
    font-family: "Proxima Nova", sans-serif;
    font-size: 20px;
    font-size: 1.25rem
}

#vfbField2 {
    margin-bottom: 24px
}

#vfbField2>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#vfbField2 .vfb-checkbox {
    width: 25%;
    padding-left: 15px;
    display: block;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

#vfbField2 .vfb-checkbox input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0
}

#vfbField2 .vfb-checkbox .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 25px;
    width: 25px;
    background-color: #eee
}

#vfbField2 .vfb-checkbox:hover input~.checkmark {
    background-color: #ccc
}

#vfbField2 .vfb-checkbox input:checked~.checkmark {
    background-color: #000
}

#vfbField2 .vfb-checkbox .checkmark:after {
    content: "";
    position: absolute;
    display: none
}

#vfbField2 .vfb-checkbox input:checked~.checkmark:after {
    display: block
}

#vfbField2 .vfb-checkbox .checkmark:after {
    left: 50%;
    top: 50%;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 3px 3px 0;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg)
}

@media screen and (max-width: 1040px) {
    #vfbField2 .vfb-checkbox {
        width: 100%
    }
}

#vfbField2 label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    font-size: 18px;
    font-size: 1.125rem;
    margin-bottom: 0
}

.vfb-fieldType-text .vfb-form-control, .vfb-fieldType-email .vfb-form-control, .vfb-fieldType-textarea .vfb-form-control, .vfb-fieldType-select .vfb-form-control {
    background-color: #E5E5E5;
    -webkit-border-radius: 0;
    border-radius: 0;
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.vfb-fieldType-text .vfb-form-control:focus, .vfb-fieldType-email .vfb-form-control:focus, .vfb-fieldType-textarea .vfb-form-control:focus, .vfb-fieldType-select .vfb-form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
    border: none
}

.vfb-fieldType-text ::-webkit-input-placeholder, .vfb-fieldType-email ::-webkit-input-placeholder, .vfb-fieldType-textarea ::-webkit-input-placeholder, .vfb-fieldType-select ::-webkit-input-placeholder {
    text-transform: uppercase
}

.vfb-fieldType-text ::-moz-placeholder, .vfb-fieldType-email ::-moz-placeholder, .vfb-fieldType-textarea ::-moz-placeholder, .vfb-fieldType-select ::-moz-placeholder {
    text-transform: uppercase
}

.vfb-fieldType-text ::-ms-input-placeholder, .vfb-fieldType-email ::-ms-input-placeholder, .vfb-fieldType-textarea ::-ms-input-placeholder, .vfb-fieldType-select ::-ms-input-placeholder {
    text-transform: uppercase
}

.vfb-fieldType-text ::placeholder, .vfb-fieldType-email ::placeholder, .vfb-fieldType-textarea ::placeholder, .vfb-fieldType-select ::placeholder {
    text-transform: uppercase
}

.vfb-fieldType-select {
    width: 50%
}

.vfb-fieldType-select select {
    text-transform: uppercase
}

@media screen and (max-width: 768px) {
    .vfb-fieldType-select {
        width: 100%
    }
}

.vfb-fieldType-text .vfb-form-control, .vfb-fieldType-email .vfb-form-control, .vfb-fieldType-textarea .vfb-form-control {
    padding-top: 12px;
    padding-bottom: 12px
}

.vfb-fieldType-text label, .vfb-fieldType-email label, .vfb-fieldType-textarea label {
    display: none
}

.vfb-fieldType-submit {
    margin-bottom: 48px
}

.vfb-fieldType-submit .btn-primary {
    background-color: #000;
    color: #fff;
    -webkit-border-radius: 0;
    border-radius: 0;
    text-transform: uppercase;
    padding-top: 12px;
    padding-bottom: 12px;
    border: 0
}

.vfb-fieldType-submit .btn-primary:hover {
    background-color: #F8AC2A
}

.vfb-fieldType-toggle {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 48px;
    gap: 12px;
    font-size: 13px;
    font-size: .8125rem;
    max-width: 400px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.vfb-fieldType-toggle>div:first-child {
    width: 80px
}

.vfb-col-12, .vfb-col-6 {
    padding-left: 7.5px;
    padding-right: 7.5px
}

@media screen and (max-width: 768px) {
    .vfb-col-12, .vfb-col-6 {
        padding: 0
    }
}

.input-toggle {
    position: relative;
    overflow: hidden;
    width: 70px;
    min-height: 38px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid #999;
    margin-top: 6px
}

.input-toggle input.toggle__handle {
    display: none
}

.input-toggle.input-toggle--off .toggle__group {
    left: -100%
}

.input-toggle .toggle__group {
    position: absolute;
    width: 200%;
    top: 0px;
    bottom: 0px;
    left: 0px;
    -webkit-transition: left .3s;
    -o-transition: left .3s;
    transition: left .3s
}

.input-toggle .toggle__group .toggle {
    position: absolute;
    top: 0;
    bottom: 0;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    margin: 0;
    color: #fff;
    width: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-weight: bold
}

.input-toggle .toggle__group .toggle:hover {
    cursor: pointer
}

.input-toggle .toggle__group .toggle.toggle--on {
    left: 0;
    background: #000
}

.input-toggle .toggle__group .toggle.toggle--on.active~.toggle__handle {
    left: 46%
}

.input-toggle .toggle__group .toggle.toggle--off {
    background: #999;
    right: 0
}

.input-toggle .toggle__group .toggle.toggle--off.active+.toggle__handle {
    left: 54%
}

.input-toggle .toggle__group .toggle__handle {
    position: relative;
    margin: 0 auto;
    padding: 0 5px;
    height: 100%;
    background: #fff;
    display: inline-block;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

ul, ol {
    margin-left: 24px
}

li>ul, li>ol {
    margin-bottom: 0
}

.list--unstyled, .list--services, .list--categories {
    margin-left: 0;
    list-style: none
}

.list--services {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-family: "Superior Title Web", Helvetica, Arial, sans-serif
}

.list--categories {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-transform: uppercase;
    font-family: "Proxima Nova", sans-serif
}

.list--categories li {
    text-transform: uppercase;
    padding: 0 12px 0 0
}

.list--categories li:after {
    display: inline-block;
    content: '|';
    margin-left: 12px
}

.list--categories li:last-child:after {
    display: none
}

@media screen and (max-width: 1040px) {
    .list--categories li {
        font-size: 11px;
        font-size: .6875rem
    }
}

.list--vertical li {
    margin-bottom: 12px
}

.list--social {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.list--social li {
    margin: 0 12px
}

.list--social li rect, .list--social li path, .list--social li circle {
    -webkit-transition: fill 250ms;
    -o-transition: fill 250ms;
    transition: fill 250ms
}

.list--social li:hover rect, .list--social li:hover path, .list--social li:hover circle {
    fill: #F8AC2A
}

.header__navigation .list--social rect, .header__navigation .list--social path, .header__navigation .list--social circle {
    fill: #fff
}

h1, h2, h3, h4, h5, h6, strong {
    font-weight: bold
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: "Superior Title Web", Helvetica, Arial, sans-serif
}

em {
    font-style: italic
}

small {
    font-size: .75em
}

h1, .h1 {
    font-size: 66px;
    font-size: 4.125rem;
    line-height: 1.1em
}

@media screen and (max-width: 480px) {
    h1, .h1 {
        font-size: 50px;
        font-size: 3.125rem
    }
}

@media screen and (max-width: 1040px) {
    .section--hero h1, .section--hero .h1 {
        font-size: 40px;
        font-size: 2.5rem
    }
}

@media screen and (max-width: 768px) {
    .section--hero h1, .section--hero .h1 {
        font-size: 30px;
        font-size: 1.875rem
    }
}

@media screen and (max-width: 480px) {
    .section--hero h1, .section--hero .h1 {
        font-size: 24px;
        font-size: 1.5rem
    }
}

h2, .h2 {
    font-size: 47px;
    font-size: 2.9375rem;
    line-height: 1.1em
}

h3, .h3 {
    font-size: 50px;
    font-size: 3.125rem;
    line-height: 1.1em;
    margin-bottom: 0.25em
}

@media screen and (max-width: 480px) {
    h3, .h3 {
        font-size: 30px;
        font-size: 1.875rem
    }
}

h4, .h4 {
    font-size: 31px;
    font-size: 1.9375rem;
    line-height: 1.1em;
    font-weight: 400;
    font-family: "Big Caslon", Georgia, "Times New Roman", Times, serif
}

@media screen and (max-width: 480px) {
    h4, .h4 {
        font-size: 24px;
        font-size: 1.5rem
    }
}

.small {
    font-size: 12px;
    font-size: .75rem
}

.subtitle, .section.section--testimonials .quote-attribution {
    font-size: 12px;
    font-size: .75rem;
    font-family: "Proxima Nova", sans-serif;
    text-transform: uppercase;
    font-weight: 400;
    margin: 0 0 5px 0
}

@media screen and (max-width: 1040px) {
    .subtitle, .section.section--testimonials .quote-attribution {
        font-size: 14px;
        font-size: .875rem
    }
}

.blog-title {
    font-size: 23px;
    font-size: 1.4375rem;
    font-family: "Big Caslon", Georgia, "Times New Roman", Times, serif;
    font-weight: 400
}

.colour-base {
    color: #444
}

.colour-dark {
    color: #323A3D
}

.colour-white {
    color: white
}

.colour-brand {
    color: #F8AC2A
}

.colour-brand-alt, .list--services li.active, .section--services-list .list a:hover {
    color: #576CE9
}

.will-fade {
    -webkit-transition: opacity 0.8s ease-in-out;
    -o-transition: opacity 0.8s ease-in-out;
    transition: opacity 0.8s ease-in-out
}

.fadeout {
    opacity: 0
}

.margin-auto {
    margin: auto
}

.mb-1 {
    margin-bottom: 24px
}

.sticky-container {
    position: relative
}

.sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    width: 100%;
    height: 100vh;
    overflow-x: hidden
}

.sticky .horizontal {
    position: absolute;
    height: 100vh;
    will-change: transform
}

.sticky .horizontal .cards {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    height: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.sticky .horizontal .cards .card {
    position: relative;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media screen and (max-width: 1040px) {
    .sticky:not(.sticky--mobile) .horizontal {
        position: relative;
        width: 100%
    }
}

@media screen and (max-width: 1040px) {
    .sticky:not(.sticky--mobile) .horizontal .cards {
        -ms-flex-flow: wrap;
        flex-flow: wrap
    }
}

@media screen and (max-width: 1040px) {
    .sticky:not(.sticky--mobile) .horizontal .cards .card {
        width: 100%;
		max-width: 100%;
        margin-bottom: 24px;
        padding: 0 24px
    }
}

@media screen and (max-width: 1040px) {
    .sticky:not(.sticky--mobile) {
        height: auto
    }

    .sticky:not(.sticky--mobile) .horizontal, .sticky:not(.sticky--mobile) .cards {
        height: auto !important
    }
}

.will-slide {
    will-change: transform;
    -webkit-transition: -webkit-transform 3000ms ease-in-out;
    transition: -webkit-transform 3000ms ease-in-out;
    -o-transition: transform 3000ms ease-in-out;
    transition: transform 3000ms ease-in-out;
    transition: transform 3000ms ease-in-out, -webkit-transform 3000ms ease-in-out
}

.bg-brand, .section.section--testimonials .clients__background {
    background-color: #576CE9;
    color: #fff;
    background: -webkit-linear-gradient(45deg, #576ce9 0%, #75f6f9 75%);
    background: -o-linear-gradient(45deg, #576ce9 0%, #75f6f9 75%);
    background: linear-gradient(45deg, #576ce9 0%, #75f6f9 75%)
}

.bg-info {
    background-color: #DBDCDF
}

.bg-grey {
    background-color: #fff
}

.bg-dark-grey {
    background-color: #000
}

.item--delay-fade {
    opacity: 0;
    -webkit-transform: translateY(5%);
    -ms-transform: translateY(5%);
    transform: translateY(5%);
    -webkit-transition: opacity .75s ease, -webkit-transform .75s ease;
    transition: opacity .75s ease, -webkit-transform .75s ease;
    -o-transition: opacity .75s ease, transform .75s ease;
    transition: opacity .75s ease, transform .75s ease;
    transition: opacity .75s ease, transform .75s ease, -webkit-transform .75s ease
}

.item--delay-fade.item--visible {
    opacity: 1;
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%)
}



.btn {
    background-color: #F8AC2A;
    color: #fff;
    border: 1px solid transparent;
    display: inline-block;
    padding: 6px 24px;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: auto;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    text-transform: uppercase
}

.btn::-moz-focus-inner {
    border: 0;
    padding: 0
}

.btn:hover {
    text-decoration: none;
    background-color: #fff;
    color: #F8AC2A;
    border-color: #F8AC2A
}

.btn.is-disabled, .btn:disabled {
    pointer-events: none;
    opacity: .65
}

.btn--inverse {
    background-color: #fff;
    color: #F8AC2A;
    border: 1px solid #F8AC2A
}

.btn--inverse:hover {
    background-color: #F8AC2A;
    color: #fff;
    border-color: transparent
}

.btn--block {
    display: block;
    width: 100%
}

.btn--block+.btn--block {
    margin-top: 6px
}

.btn--link {
    background-color: transparent;
    color: #F8AC2A
}

.btn--ghost {
    border: 1px #fff solid;
    background-color: transparent
}

.btn--ghost:hover {
    border-color: #fff;
    background-color: #fff;
    color: #444
}

.btn--dark {
    border: 1px #323A3D solid;
    background-color: transparent;
    color: #323A3D
}

.btn--dark:hover {
    border-color: #323A3D;
    background-color: #323A3D;
    color: #fff
}

.nav-burger {
    position: fixed;
    top: 20px;
    right: 24px;
    z-index: 5;
    width: 100px;
    -webkit-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out
}

.header--white .nav-burger svg path, .header--white .nav-burger svg rect {
    fill: #fff !important
}

@media screen and (max-width: 1280px) {
    .nav-burger {
        margin-top: 8px
    }
}

.nav-burger__line {
    display: block;
    width: 35px;
    height: 3px;
    background-color: #444;
    margin: 8px auto;
    -webkit-transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    transition: all 250ms ease-in-out
}

.nav-burger.open .nav-burger__line:nth-child(2) {
    opacity: 0
}

.nav-burger.open .nav-burger__line:nth-child(1) {
    -webkit-transform: translateY(11px) rotate(45deg);
    -ms-transform: translateY(11px) rotate(45deg);
    transform: translateY(11px) rotate(45deg)
}

.nav-burger.open .nav-burger__line:nth-child(3) {
    -webkit-transform: translateY(-11px) rotate(-45deg);
    -ms-transform: translateY(-11px) rotate(-45deg);
    transform: translateY(-11px) rotate(-45deg)
}

.header--white .nav-burger__line {
    background-color: #fff
}

.nav {
    list-style: none;
    margin: 0
}

.nav>li:last-child {
    margin-right: 0
}

.nav>li>a {
    display: block
}

ul.nav--header {
    text-align: left;
    margin-bottom: 40px
}

ul.nav--header li {
    display: block;
    font-size: 25px;
    font-size: 1.5625rem;
    text-transform: uppercase;
    color: white;
    font-family: "Big Caslon", Georgia, "Times New Roman", Times, serif;
    line-height: 1.995;
    text-align: center;
    font-family: "Superior Title Web", Helvetica, Arial, sans-serif;
    text-transform: lowercase
}

ul.nav--header li .sub-menu {
    margin: 0
}

ul.nav--header li a {
    color: inherit
}

ul.nav--header li a:hover {
    color: #F8AC2A
}

ul.nav--header li.current-menu-item [aria-current] {
    color: #F8AC2A
}

@media screen and (max-width: 1040px) {
    ul.nav--header li {
        font-size: 20px;
        font-size: 1.25rem
    }
}

.alert {
    padding: 24px;
    margin-bottom: 24px;
    border: 1px solid transparent
}

.alert>p, .alert>ul {
    margin-bottom: 0
}

.alert>p+p {
    margin-top: 24px
}

.alert.alert--success {
    color: #5CB85C;
    border-color: #5CB85C
}

.alert.alert--info {
    color: #DBDCDF;
    border-color: #DBDCDF
}

.alert.alert--warning {
    color: #F0AD4E;
    border-color: #F0AD4E
}

.alert.alert--danger {
    color: #D9534F;
    border-color: #D9534F
}

.section--letters {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#letters-drop, #letters-followup {
    position: absolute;
    width: calc(100% - 50px);
    height: calc(100vh - 50px);
    text-align: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    text-align: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    color: #fff;
    pointer-events: none
}

#letters-drop .letters-separator, #letters-followup .letters-separator {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    height: .7vmin
}

#letters-followup {
    opacity: 0
}

.animate, .reset {
    position: fixed;
    top: 0;
    padding: 5px;
    z-index: 999;
    color: white;
    pointer-events: all
}

.animate {
    left: 0
}

.reset {
    right: 0
}

.animate-letter-back {
    -webkit-transform: translate3d(0, 0, 0) rotate(0) !important;
    transform: translate3d(0, 0, 0) rotate(0) !important;
    -webkit-transition: 0.7s cubic-bezier(0.66, 0.14, 0.25, 1);
    -o-transition: 0.7s cubic-bezier(0.66, 0.14, 0.25, 1);
    transition: 0.7s cubic-bezier(0.66, 0.14, 0.25, 1);
    will-change: transform
}

.soster-o svg {
    width: 35px;
    margin: 0 2px;
    vertical-align: middle
}

@media screen and (max-width: 1040px) {
    .soster-o svg {
        width: 22px
    }
}

@media screen and (max-width: 768px) {
    .soster-o svg {
        width: 16px
    }
}

.scroll-down {
    position: absolute;
    left: 50%;
    bottom: 20px;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.scroll-down a {
    text-transform: uppercase;
    font-family: "Proxima Nova", sans-serif;
    font-size: 17px !important;
    font-size: .75rem;
    letter-spacing: 0.07em;
    height: 19px;
    pointer-events: none;
    overflow: hidden;
    display: block;
    -webkit-font-smoothing: auto;
    font-weight: bold;
}

.scroll-down a:hover {
    text-decoration: none
}

.scroll-down a span {
    display: block;
    -webkit-animation: roll 3s infinite;
    animation: roll 3s infinite
}

.scroll-down a {
    color: #ffffff;
}

.scroll-down .section__scroll__line:after {
    background-color: #fff;
}

.scroll-down .section__scroll__line {
    height: 36px;
    overflow: hidden;
    display: block;
    margin-top: 12px
}

.scroll-down .section__scroll__line:after {
    content: '';
    width: 1px;
    height: 100%;
    display: block;
    margin: 0 auto;
    -webkit-animation: scroll 3s infinite .5s;
    animation: scroll 3s infinite .5s
}


@media screen and (max-width: 1040px) {
    .scroll-down {
        position: absolute
    }
}

.scroll-down.scroll-down--black {
    opacity: 0;
    -webkit-transition: opacity 500ms ease-in-out;
    -o-transition: opacity 500ms ease-in-out;
    transition: opacity 500ms ease-in-out
}

.scroll-down.scroll-down--black.is-inview {
    opacity: 1
}

.scroll-down.scroll-down--black a {
    color: #000
}

.scroll-down.scroll-down--black .section__scroll__line:after {
    background-color: #000
}

@-webkit-keyframes roll {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0
    }

    25%, 50%, 75% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0
    }
}

@keyframes roll {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%);
        opacity: 0
    }

    25%, 50%, 75% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }

    100% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%);
        opacity: 0
    }
}

@-webkit-keyframes scroll {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    25%, 50%, 75% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

@keyframes scroll {
    0% {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }

    25%, 50%, 75% {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }

    100% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

/* custom css for scroll down by MP */

/*.scroll-down {
    background: rgb(0 0 0 / 0.5);
    padding: 10px;
}*/
/*.scroll-down a span:before {
    right: 4px;
    content: "\f078";
    top: 0;
    font-size: 18px;
    position: absolute;
    font-family: "Font Awesome 5 free";
    font-weight: 900;
}*/
/*.scroll-down a span {
    padding-right: 30px;
}*/
.scroll-down a {
    color: #ffffff;
}

/*  */
.page-scroll-wrap {
    position: absolute;
    width: 100%;
    height: 220px;
    background-image: linear-gradient(180deg, #f8fbff03 0%, #000000c2 100%);
}


.modal {
    display: none;
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: rgba(87, 108, 233, 0.8);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10
}

.modal .modal__close {
    position: absolute;
    top: -10px;
    right: 0;
    text-transform: uppercase;
    font-family: "Big Caslon", Georgia, "Times New Roman", Times, serif;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    transform: translateY(-100%)
}

.modal .modal__close:hover a {
    color: #fff
}

.modal .modal__content {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 600px;
    max-width: calc(100% - 24px);
    background-color: #fff;
    padding: 24px 0;
    border: 1px #444 solid
}

.modal .modal__content p {
    font-size: 13px;
    font-size: .8125rem
}

@media screen and (max-width: 1040px) {
    .modal .modal__content img {
        display: none
    }
}

.slick-slider {
    position: relative;
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list {
    position: relative;
    overflow: hidden;
    display: block;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-track, .slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.slick-track:before, .slick-track:after {
    content: "";
    display: table
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    display: none
}

[dir="rtl"] .slick-slide {
    float: right
}

.slick-slide img {
    display: block
}

.slick-slide.slick-loading img {
    display: none
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.slick-arrow.slick-hidden {
    display: none
}

.slick-loading .slick-list {
    background: #fff url("ajax-loader.html") center center no-repeat
}

@font-face {
    font-family: "slick";
    src: url("fonts/slick.html");
    src: url("fonts/slickd41d.html?#iefix") format("embedded-opentype"), url("fonts/slick-2.html") format("woff"), url("fonts/slick-3.html") format("truetype"), url("fonts/slick-4.html#slick") format("svg");
    font-weight: normal;
    font-style: normal
}

.slick-prev, .slick-next {
    position: absolute;
    display: block;
    height: 40px;
    width: 20px;
    line-height: 0px;
    font-size: 0px;
    cursor: pointer;
    color: transparent;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    padding: 0;
    border: none;
    outline: none;
    -webkit-transition: opacity 250ms;
    -o-transition: opacity 250ms;
    transition: opacity 250ms;
    -webkit-background-size: contain;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat
}

@media screen and (max-width: 1040px) {
    .slick-prev, .slick-next {
        height: 20px;
        width: 10px
    }
}

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
    opacity: 1
}

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {
    opacity: .25
}

.slick-prev:before, .slick-next:before {
    font-family: "slick";
    font-size: 20px;
    line-height: 1;
    color: #fff;
    opacity: .75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-prev {
    left: -35px;
    background-image: url("img/chevron-left.svg")
}

[dir="rtl"] .slick-prev {
    left: auto;
    right: -35px
}

@media screen and (max-width: 1040px) {
    .slick-prev {
        left: -35px
    }
}

.slick-next {
    right: -35px;
    background-image: url("img/chevron-right.svg")
}

[dir="rtl"] .slick-next {
    left: -35px;
    right: auto
}

@media screen and (max-width: 1040px) {
    .slick-next {
        right: -35px
    }
}

.slick-dotted.slick-slider {
    margin-bottom: 30px
}

.slick-dots {
    position: absolute;
    bottom: -25px;
    list-style: none;
    display: block;
    text-align: center;
    padding: 0;
    margin: 0;
    width: 100%
}

.slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer
}

.slick-dots li button {
    border: 0;
    background: transparent;
    display: block;
    height: 20px;
    width: 20px;
    outline: none;
    line-height: 0px;
    font-size: 0px;
    color: transparent;
    padding: 5px;
    cursor: pointer
}

.slick-dots li button:hover, .slick-dots li button:focus {
    outline: none
}

.slick-dots li button:hover:before, .slick-dots li button:focus:before {
    opacity: 1
}

.slick-dots li button:before {
    position: absolute;
    top: 0;
    left: 0;
    content: "•";
    width: 20px;
    height: 20px;
    font-family: "slick";
    font-size: 6px;
    line-height: 20px;
    text-align: center;
    color: #000;
    opacity: .25;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.slick-dots li.slick-active button:before {
    color: #000;
    opacity: .75
}

.section {
    position: relative;
    min-height: 100vh
}

.section.hidden {
    display: none !important
}

.section.section--postbanner {
    background-color: #fff
}

.section.section--services {
    height: auto;
    z-index: 2
}

@media screen and (max-width: 1040px) {
    .section.section--services {
        padding-top: calc(50vh - 75px)
    }
}

.section.section--services .service {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 55vw;
    max-width: 970px;
    position: relative;
    text-align: center;
    padding: 0 48px
}

.section.section--services .service:nth-child(2n) {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}

.section.section--services .service:nth-child(2n) .service__content {
    margin: 0 0 48px 0
}

@media screen and (max-width: 1040px) {
    .section.section--services .service:nth-child(2n) .service__content {
        margin: 48px 0
    }
}

@media screen and (max-width: 1040px) {
    .section.section--services .service:nth-child(2n) {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
}

.section.section--services .service .service__content, .section.section--services .service .service__overlay {
    opacity: 0;
    -webkit-transition: opacity 0.8s ease-in-out, -webkit-transform 0.8s ease-in-out;
    transition: opacity 0.8s ease-in-out, -webkit-transform 0.8s ease-in-out;
    -o-transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
    transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
    transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out, -webkit-transform 0.8s ease-in-out
}

.section.section--services .service.active .service__content, .section.section--services .service.active .service__overlay {
    opacity: 1;
    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%)
}

.section.section--services .service a:not(.btn) {
    color: #F8AC2A;
    text-decoration: underline
}

.section.section--services .service a:not(.btn):hover {
    text-decoration: none
}

.section.section--services .service video {
    width: 100%
}

.section.section--services .service__wrapper {
    opacity: 0;
    -webkit-transition: opacity 0.8s 250ms;
    -o-transition: opacity 0.8s 250ms;
    transition: opacity 0.8s 250ms
}

.section.section--services .service__wrapper img, .section.section--services .service__wrapper iframe {
    width: 100%
}

@media screen and (max-height: 740px) {
    .section.section--services .service__wrapper img, .section.section--services .service__wrapper iframe {
        max-width: 80vh
    }
}

.section.section--services .card:first-child .service__wrapper {
    -webkit-transition: none;
    -o-transition: none;
    transition: none
}

.section.section--services.active-section .service__wrapper {
    opacity: 1
}

.section.section--services .service__wrapper {
    position: relative
}

.section.section--services .service__overlay {
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: opacity 250ms ease-in-out;
    -o-transition: opacity 250ms ease-in-out;
    transition: opacity 250ms ease-in-out
}

.section.section--services .service__content {
    margin: 48px 0 0 0;
    -webkit-transition: opacity 250ms ease-in-out;
    -o-transition: opacity 250ms ease-in-out;
    transition: opacity 250ms ease-in-out;
    -webkit-transform: translateY(10%);
    -ms-transform: translateY(10%);
    transform: translateY(10%)
}

@media screen and (max-width: 1040px) {
    .section.section--services .service__content {
        margin: 48px 0
    }
}

.section.section--services .service__caption {
    font-family: "Big Caslon", Georgia, "Times New Roman", Times, serif;
    font-size: 31px;
    font-size: 1.9375rem
}

.section.section--services .services__navigation {
    display: none;
    text-align: center;
    width: 100%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: fixed;
    bottom: 48px
}

@media screen and (max-height: 740px) {
    .section.section--services .services__navigation {
        display: none !important
    }
}

@media screen and (max-width: 1040px) {
    .section.section--services {
        padding-bottom: 24px
    }
}

.section.section--clients {
    background-color: #fff;
    height: 200vh
}

.section.section--clients .clients__title {
    width: 100%
}

.section.section--clients .clients__logos {
    position: fixed;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    top: 0;
    width: 100%;
    height: 100%;
    padding: 96px 0
}

@media screen and (max-height: 740px) {
    .section.section--clients .clients__logos {
        padding-bottom: 50px
    }
}

.section.section--clients .logos {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: auto;
    opacity: 0;
    -webkit-transition: opacity 500ms;
    -o-transition: opacity 500ms;
    transition: opacity 500ms;
    gap: 10px;
    pointer-events: none;
    max-width: 1200px;
    margin: auto;
    padding: 0 24px
}

@media screen and (max-width: 1040px) {
    .section.section--clients .logos {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

    .section.section--clients .logos:nth-child(4) {
        display: none
    }
}

.section.section--clients .logos.visible {
    opacity: 1
}

.section.section--clients .logos .logo {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 5px 10px;
    width: auto;
    text-align: center
}

@media screen and (max-height: 740px) {
    .section.section--clients .logos .logo {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

.section.section--clients .testimonials {
    opacity: 0;
    -webkit-transition: opacity 500ms;
    -o-transition: opacity 500ms;
    transition: opacity 500ms
}

.section.section--clients .testimonials.visible {
    opacity: 1
}

.section.section--clients .logos:nth-child(1), .section.section--clients .testimonials:nth-child(1) {
    -webkit-transition-delay: .25s;
    -o-transition-delay: .25s;
    transition-delay: .25s
}

.section.section--clients .logos:nth-child(2), .section.section--clients .testimonials:nth-child(2) {
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s
}

.section.section--clients .logos:nth-child(3), .section.section--clients .testimonials:nth-child(3) {
    -webkit-transition-delay: .75s;
    -o-transition-delay: .75s;
    transition-delay: .75s
}

.section.section--clients .logos:nth-child(4), .section.section--clients .testimonials:nth-child(4) {
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s
}

.section.section--clients blockquote {
    margin-bottom: 12px
}

@media screen and (max-width: 1040px) {
    .section.section--clients blockquote {
        font-size: 16px;
        font-size: 1rem
    }
}

.section.section--team {
    color: #fff;
    background-color: #000
}

.section.section--team .sticky-container {
    z-index: 2
}

.section.section--team .sticky {
    overflow: hidden
}

.section.section--team .team__navigation {
    display: none;
    position: relative;
    z-index: 11
}

.section.section--team .team__label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: fixed;
    z-index: 11;
    width: 100%;
    bottom: 48px;
    text-align: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    pointer-events: none
}

@media screen and (max-height: 740px) {
    .section.section--team .cards {
        margin-top: 20px;
        height: 70%
    }
}

.section.section--team .card {
    padding: 0 12px
}

@media screen and (max-height: 740px) {
    .section.section--team .card {
        height: 63%
    }
}

.section.section--team .card img {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    -webkit-transition: -webkit-filter 250ms;
    transition: -webkit-filter 250ms;
    -o-transition: filter 250ms;
    transition: filter 250ms;
    transition: filter 250ms, -webkit-filter 250ms
}

@media screen and (max-height: 740px) {
    .section.section--team .card img {
        height: 100%
    }
}

.section.section--team .card:hover img {
    -webkit-filter: grayscale(0%);
    filter: grayscale(0%)
}

.section.section--team .horizontal {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.section.section--team .members {
    display: grid;
    height: auto;
    gap: 24px 0
}

.section.section--team .members .members__row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.section.section--team .members .members__row:nth-child(2) {
    margin-left: 200px
}

.section.section--hero {
    position: fixed;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    z-index: 4;
    width: 100%;
    overflow: hidden
}

.section.section--hero .container {
    width: 100%
}

.section.section--scaledservice {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    pointer-events: none
}

.section.section--blog {
    padding: 48px 0;
    z-index: 12;
    background-color: #DBDCDF
}

.section.section--blog .section__footer {
    padding: 24px 0
}

.section.section--blog .sticky-title {
    padding: 50vh 0;
    z-index: 2
}

.section.section--blog .blog-posts {
    position: relative;
    z-index: 2
}

.section.section--blog .blog-posts .item--delay-fade:nth-child(even) {
    -webkit-transition-delay: 250ms;
    -o-transition-delay: 250ms;
    transition-delay: 250ms
}

@media screen and (max-width: 1040px) {
    .section.section--blog .blog-posts .item--delay-fade {
        -webkit-transition-delay: 0s !important;
        -o-transition-delay: 0s !important;
        transition-delay: 0s !important
    }
}

.section.section--blog .blog__viewmore {
    margin-top: 75px
}

.section.section--contact {
    background-color: #fff;
    z-index: 13
}

.section.section--contact .full-height {
    height: auto;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.section.section--contact .contact__logo {
    max-width: 194px;
    margin: 0 auto 48px auto
}

.section.section--contact [data-animation="logo"] {
    margin: auto;
    width: 310px
}

.section.section--contact .section__footer {
    position: absolute;
    bottom: 0;
    width: 100%;
    font-size: 12px;
    font-size: .75rem;
    padding: 24px 0
}

@media screen and (max-width: 1040px) {
    .section.section--contact .section__footer {
        position: relative
    }

    .section.section--contact .section__footer .full-height {
        height: calc(100vh - 375px)
    }

    .section.section--contact .section__footer .col {
        text-align: center;
        margin: 24px 0
    }
}

.section.section--contact .contact__content {
    width: 100%;
    padding: 120px 0
}

.section.section--posts {
    padding: 288px 0
}

@media screen and (max-width: 1040px) {
    .section.section--posts {
        padding: 144px 0
    }
}

.section.section--posts .sticky-title {
    top: 50%
}

.section.section--posts .title {
    padding-bottom: 96px
}

.section.section--posts .item--delay-fade:nth-child(even) {
    -webkit-transition-delay: 250ms;
    -o-transition-delay: 250ms;
    transition-delay: 250ms
}

.section.section--testimonials {
    height: 200vh;
    background-color: #000
}

.section.section--testimonials blockquote {
    color: #75F6F9;
    margin-bottom: 24px;
    font-family: "Superior Title Web", Helvetica, Arial, sans-serif;
    line-height: 1.75em
}

@media screen and (max-width: 1040px) {
    .section.section--testimonials blockquote {
        font-size: 16px;
        font-size: 1rem;
        line-height: 1.5em
    }
}

.section.section--testimonials .quote-attribution {
    color: #fff;
    font-size: 16px;
    font-size: 1rem
}

.section.section--testimonials .testimonials__fixed {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: fixed;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    top: 0;
    width: 100%;
    height: 100vh;
    padding: 96px 0;
    opacity: 0;
    -webkit-transition: opacity 500ms;
    -o-transition: opacity 500ms;
    transition: opacity 500ms
}

.section.section--testimonials .testimonials__fixed.visible {
    opacity: 1
}

@media screen and (max-height: 740px) {
    .section.section--testimonials .testimonials__fixed {
        padding-bottom: 50px
    }
}

.section.section--testimonials .clients__background {
    position: fixed;
    top: 0;
    width: 0;
    height: 100%;
    left: 50%;
    z-index: 1;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

body.blog .section, body.category .section, body.error404 .section {
    padding: 288px 0
}

body.blog, body.category {
    background-color: #DBDCDF
}

.blog-tile {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 24px;
    color: #444;
    background-color: #fff;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.blog-tile img {
    -webkit-transition: opacity 250ms;
    -o-transition: opacity 250ms;
    transition: opacity 250ms
}

.blog-tile:hover {
    color: #444
}

.blog-tile:hover img {
    opacity: 0.85
}

@media screen and (max-width: 1040px) {
    .blog-tile {
        background-color: transparent
    }
}

.blog-overlay {
    position: absolute;
    background-color: rgba(255, 255, 255, 0.75);
    width: 400px;
    max-width: 80%;
    padding: 24px;
    z-index: 2
}

@media screen and (max-width: 1040px) {
    .blog-overlay {
        position: relative;
        background-color: transparent;
        padding: 24px 0
    }
}

.next-post a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #444 !important;
    text-decoration: none !important
}

.next-post a:hover {
    text-decoration: none
}

.next-post a:after {
    content: '';
    background: url("../img/arrow.png") center center no-repeat;
    height: 70px;
    width: 112px;
    display: inline-block;
    margin-left: 24px
}

#service-content {
    padding: 24px 0;
    max-width: 400px
}

@media screen and (max-width: 1040px) {
    #service-content {
        min-height: 270px;
        margin: auto
    }
}

.post__title {
    position: relative;
    z-index: 2;
    margin-bottom: 120px
}

@media screen and (max-width: 1040px) {
    .post__title {
        text-align: center;
        padding: 0 12px
    }
}

.section__bg {
    opacity: 0;
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 0;
    -webkit-transition: opacity 250ms;
    -o-transition: opacity 250ms;
    transition: opacity 250ms
}

.section__bg.active {
    opacity: 1
}

@media screen and (max-width: 768px) {
    .section--services-list .full-height {
        height: auto;
        padding: 144px 0 48px 0
    }

    .section--services-list .scroll-down {
        display: none
    }
}

.case-studies .section.section--banner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    padding-bottom: 140px;
    text-align: center;
    color: white
}

.case-studies .section.section--services {
    background-color: white
}

.case-studies .section.section--services .cards .card .service__caption {
    color: #323A3D
}

.case-studies .section.section--services .cards .card .service__caption p {
    font-size: 18px;
    font-size: 1.125rem
}

.newsletter-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px #444 solid;
    padding: 5px 0;
    font-size: 12px;
    font-size: .75rem
}

.newsletter-form input {
    border: none;
    padding: 0
}

.newsletter-form button rect, .newsletter-form button path {
    -webkit-transition: fill 250ms;
    -o-transition: fill 250ms;
    transition: fill 250ms
}

.newsletter-form button:hover rect, .newsletter-form button:hover path {
    fill: #F8AC2A
}

iframe {
    width: 100%;
}