@charset "UTF-8";
html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%
}
body {
margin: 0
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
display: block
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline
}
audio:not([controls]) {
display: none;
height: 0
}
[hidden],
template {
display: none
}
a {
background-color: transparent
}
a:active,
a:hover {
outline: 0
}
abbr[title] {
border-bottom: 1px dotted
}
b,
strong {
font-weight: bold
}
dfn {
font-style: italic
}
h1 {
font-size: 2em;
margin: .67em 0
}
mark {
background: #ff0;
color: #000
}
small {
font-size: 80%
}
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline
}
sup {
top: -0.5em
}
sub {
bottom: -0.25em
}
img {
border: 0
}
svg:not(:root) {
overflow: hidden
}
figure {
margin: 1em 40px
}
hr {
box-sizing: content-box;
height: 0
}
pre {
overflow: auto
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0
}
button {
overflow: visible
}
button,
select {
text-transform: none
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
cursor: pointer
}
button[disabled],
html input[disabled] {
cursor: default
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0
}
input {
line-height: normal
}
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
padding: 0
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto
}
input[type="search"] {
-webkit-appearance: textfield;
box-sizing: content-box
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none
}
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: .35em .625em .75em
}
legend {
border: 0;
padding: 0
}
textarea {
overflow: auto
}
optgroup {
font-weight: bold
}
table {
border-collapse: collapse;
border-spacing: 0
}
td,
th {
padding: 0
}
@media print {
* {
text-shadow: none !important;
color: #000 !important;
background: transparent !important;
box-shadow: none !important
}
a,
a:visited {
text-decoration: underline
}
a[href]:after {
content: " (" attr(href) ")"
}
abbr[title]:after {
content: " (" attr(title) ")"
}
a[href^="javascript:"]:after,
a[href^="#"]:after {
content: ""
}
pre,
blockquote {
border: 1px solid #999;
page-break-inside: avoid
}
thead {
display: table-header-group
}
tr,
img {
page-break-inside: avoid
}
img {
max-width: 100% !important
}
p,
h2,
h3 {
orphans: 3;
widows: 3
}
h2,
h3 {
page-break-after: avoid
}
select {
background: #fff !important
}
.navbar {
display: none
}
.table td,
.table th {
background-color: #fff !important
}
.btn>.caret,
.dropup>.btn>.caret {
border-top-color: #000 !important
}
.label {
border: 1px solid #000
}
.table {
border-collapse: collapse !important
}
.table-bordered th,
.table-bordered td {
border: 1px solid #ddd !important
}
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
-webkit-tap-highlight-color: rgba(255, 255, 255, 0)
}
*:before,
*:after {
box-sizing: border-box
}
*:focus {
outline: 0
}
html,
:root {
color: #1e1e1e;
font-family: 'aktiv-grotesk', sans-serif;
font-size: 100%;
font-size: 1em;
line-height: 1.75;
-webkit-text-size-adjust: none;
-ms-text-size-adjust: none;
text-size-adjust: none;
text-rendering: optimizeLegibility;
-webkit-font-feature-settings: "liga" 1, "onum" 0, "kern" 1;
font-feature-settings: "liga" 1, "onum" 0, "kern" 1;
-webkit-font-kerning: normal;
font-kerning: normal;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
background-color: #fff
}
@media (-webkit-min-device-pixel-ratio: 1.5),
only screen and (min--moz-device-pixel-ratio: 1.5),
only screen and (min-device-pixel-ratio: 1.5),
only screen and (-webkit-min-device-pixel-ratio:144),
only screen and (min-resolution:144dppx) {
html,
:root {
-webkit-font-smoothing: subpixel-antialiased;
-moz-osx-font-smoothing: auto
}
}
@media (min-width: 960px) {
html,
:root {
font-size: 112.5%;
font-size: 1.125em
}
}
body {
top: 0 !important;
overflow-x: hidden;
overflow-y: scroll;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
main {
position: relative;
width: 100%
}
figure {
margin: 0
}
img {
max-width: 100%
}
img:not(.b-lazy) {
height: auto
}
img.b-lazy,
img [data-lazy] {
height: auto
}
.tab-list img.b-lazy {
height: initial
}
hr {
height: 0;
width: 5rem;
margin: 2rem auto;
border: 0;
height: 2px;
background: #1e1e1e
}
button {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased
}
.b-lazy {
opacity: 0;
-webkit-transition: opacity .3s ease-in;
transition: opacity .3s ease-in
}
.b-lazy.b-loaded,
.b-lazy.b-error {
opacity: 1
}
.image-wrapper {
background: #fff;
width: 100%
}
.image-wrapper img {
width: 100%;
display: block
}
.b-lazy,
[data-lazy] {
max-width: 100%
}
#main-wrap {
max-width: 100%;
overflow: hidden
}
.plax {
background-position: 50% 0;
background-size: auto 120%;
background-repeat: no-repeat;
height: 0;
padding-bottom: 100%;
position: relative;
-webkit-transition: none !important;
transition: none !important
}
@media (min-width: 720px) {
.no-touchevents .plax {
height: 0;
padding-bottom: 80%;
background-attachment: fixed;
background-position: 50% 50%;
background-size: cover
}
}
@media (min-width: 960px) {
.no-touchevents .plax {
height: 0;
padding-bottom: 60%
}
}
@media (min-width: 1200px) {
.no-touchevents .plax {
height: 0;
padding-bottom: 40%
}
}
.touchevents .plax {
padding-bottom: 100%;
background-position: 50% 50% !important;
background-size: cover
}
.container {
margin-right: auto;
margin-left: auto;
padding-left: 25px;
padding-right: 25px
}
@media (min-width: 600px) {
.container {
width: 600px
}
}
@media (min-width: 720px) {
.container {
width: 720px
}
}
@media (min-width: 960px) {
.container {
width: 960px
}
}
@media (min-width: 1200px) {
.container {
width: 1200px
}
}
.container-fluid {
margin-right: auto;
margin-left: auto;
padding-left: 25px;
padding-right: 25px
}
.row {
margin-left: -25px;
margin-right: -25px
}
.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
position: relative;
min-height: 1px;
padding-left: 25px;
padding-right: 25px
}
.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12 {
float: left
}
.col-xs-12 {
width: 100%
}
.col-xs-11 {
width: 91.66666667%
}
.col-xs-10 {
width: 83.33333333%
}
.col-xs-9 {
width: 75%
}
.col-xs-8 {
width: 66.66666667%
}
.col-xs-7 {
width: 58.33333333%
}
.col-xs-6 {
width: 50%
}
.col-xs-5 {
width: 41.66666667%
}
.col-xs-4 {
width: 33.33333333%
}
.col-xs-3 {
width: 25%
}
.col-xs-2 {
width: 16.66666667%
}
.col-xs-1 {
width: 8.33333333%
}
.col-xs-pull-12 {
right: 100%
}
.col-xs-pull-11 {
right: 91.66666667%
}
.col-xs-pull-10 {
right: 83.33333333%
}
.col-xs-pull-9 {
right: 75%
}
.col-xs-pull-8 {
right: 66.66666667%
}
.col-xs-pull-7 {
right: 58.33333333%
}
.col-xs-pull-6 {
right: 50%
}
.col-xs-pull-5 {
right: 41.66666667%
}
.col-xs-pull-4 {
right: 33.33333333%
}
.col-xs-pull-3 {
right: 25%
}
.col-xs-pull-2 {
right: 16.66666667%
}
.col-xs-pull-1 {
right: 8.33333333%
}
.col-xs-pull-0 {
right: auto
}
.col-xs-push-12 {
left: 100%
}
.col-xs-push-11 {
left: 91.66666667%
}
.col-xs-push-10 {
left: 83.33333333%
}
.col-xs-push-9 {
left: 75%
}
.col-xs-push-8 {
left: 66.66666667%
}
.col-xs-push-7 {
left: 58.33333333%
}
.col-xs-push-6 {
left: 50%
}
.col-xs-push-5 {
left: 41.66666667%
}
.col-xs-push-4 {
left: 33.33333333%
}
.col-xs-push-3 {
left: 25%
}
.col-xs-push-2 {
left: 16.66666667%
}
.col-xs-push-1 {
left: 8.33333333%
}
.col-xs-push-0 {
left: auto
}
.col-xs-offset-12 {
margin-left: 100%
}
.col-xs-offset-11 {
margin-left: 91.66666667%
}
.col-xs-offset-10 {
margin-left: 83.33333333%
}
.col-xs-offset-9 {
margin-left: 75%
}
.col-xs-offset-8 {
margin-left: 66.66666667%
}
.col-xs-offset-7 {
margin-left: 58.33333333%
}
.col-xs-offset-6 {
margin-left: 50%
}
.col-xs-offset-5 {
margin-left: 41.66666667%
}
.col-xs-offset-4 {
margin-left: 33.33333333%
}
.col-xs-offset-3 {
margin-left: 25%
}
.col-xs-offset-2 {
margin-left: 16.66666667%
}
.col-xs-offset-1 {
margin-left: 8.33333333%
}
.col-xs-offset-0 {
margin-left: 0
}
@media (min-width: 720px) {
.col-sm-1,
.col-sm-2,
.col-sm-3,
.col-sm-4,
.col-sm-5,
.col-sm-6,
.col-sm-7,
.col-sm-8,
.col-sm-9,
.col-sm-10,
.col-sm-11,
.col-sm-12 {
float: left
}
.col-sm-12 {
width: 100%
}
.col-sm-11 {
width: 91.66666667%
}
.col-sm-10 {
width: 83.33333333%
}
.col-sm-9 {
width: 75%
}
.col-sm-8 {
width: 66.66666667%
}
.col-sm-7 {
width: 58.33333333%
}
.col-sm-6 {
width: 50%
}
.col-sm-5 {
width: 41.66666667%
}
.col-sm-4 {
width: 33.33333333%
}
.col-sm-3 {
width: 25%
}
.col-sm-2 {
width: 16.66666667%
}
.col-sm-1 {
width: 8.33333333%
}
.col-sm-pull-12 {
right: 100%
}
.col-sm-pull-11 {
right: 91.66666667%
}
.col-sm-pull-10 {
right: 83.33333333%
}
.col-sm-pull-9 {
right: 75%
}
.col-sm-pull-8 {
right: 66.66666667%
}
.col-sm-pull-7 {
right: 58.33333333%
}
.col-sm-pull-6 {
right: 50%
}
.col-sm-pull-5 {
right: 41.66666667%
}
.col-sm-pull-4 {
right: 33.33333333%
}
.col-sm-pull-3 {
right: 25%
}
.col-sm-pull-2 {
right: 16.66666667%
}
.col-sm-pull-1 {
right: 8.33333333%
}
.col-sm-pull-0 {
right: auto
}
.col-sm-push-12 {
left: 100%
}
.col-sm-push-11 {
left: 91.66666667%
}
.col-sm-push-10 {
left: 83.33333333%
}
.col-sm-push-9 {
left: 75%
}
.col-sm-push-8 {
left: 66.66666667%
}
.col-sm-push-7 {
left: 58.33333333%
}
.col-sm-push-6 {
left: 50%
}
.col-sm-push-5 {
left: 41.66666667%
}
.col-sm-push-4 {
left: 33.33333333%
}
.col-sm-push-3 {
left: 25%
}
.col-sm-push-2 {
left: 16.66666667%
}
.col-sm-push-1 {
left: 8.33333333%
}
.col-sm-push-0 {
left: auto
}
.col-sm-offset-12 {
margin-left: 100%
}
.col-sm-offset-11 {
margin-left: 91.66666667%
}
.col-sm-offset-10 {
margin-left: 83.33333333%
}
.col-sm-offset-9 {
margin-left: 75%
}
.col-sm-offset-8 {
margin-left: 66.66666667%
}
.col-sm-offset-7 {
margin-left: 58.33333333%
}
.col-sm-offset-6 {
margin-left: 50%
}
.col-sm-offset-5 {
margin-left: 41.66666667%
}
.col-sm-offset-4 {
margin-left: 33.33333333%
}
.col-sm-offset-3 {
margin-left: 25%
}
.col-sm-offset-2 {
margin-left: 16.66666667%
}
.col-sm-offset-1 {
margin-left: 8.33333333%
}
.col-sm-offset-0 {
margin-left: 0
}
}
@media (min-width: 960px) {
.col-md-1,
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6,
.col-md-7,
.col-md-8,
.col-md-9,
.col-md-10,
.col-md-11,
.col-md-12 {
float: left
}
.col-md-12 {
width: 100%
}
.col-md-11 {
width: 91.66666667%
}
.col-md-10 {
width: 83.33333333%
}
.col-md-9 {
width: 75%
}
.col-md-8 {
width: 66.66666667%
}
.col-md-7 {
width: 58.33333333%
}
.col-md-6 {
width: 50%
}
.col-md-5 {
width: 41.66666667%
}
.col-md-4 {
width: 33.33333333%
}
.col-md-3 {
width: 25%
}
.col-md-2 {
width: 16.66666667%
}
.col-md-1 {
width: 8.33333333%
}
.col-md-pull-12 {
right: 100%
}
.col-md-pull-11 {
right: 91.66666667%
}
.col-md-pull-10 {
right: 83.33333333%
}
.col-md-pull-9 {
right: 75%
}
.col-md-pull-8 {
right: 66.66666667%
}
.col-md-pull-7 {
right: 58.33333333%
}
.col-md-pull-6 {
right: 50%
}
.col-md-pull-5 {
right: 41.66666667%
}
.col-md-pull-4 {
right: 33.33333333%
}
.col-md-pull-3 {
right: 25%
}
.col-md-pull-2 {
right: 16.66666667%
}
.col-md-pull-1 {
right: 8.33333333%
}
.col-md-pull-0 {
right: auto
}
.col-md-push-12 {
left: 100%
}
.col-md-push-11 {
left: 91.66666667%
}
.col-md-push-10 {
left: 83.33333333%
}
.col-md-push-9 {
left: 75%
}
.col-md-push-8 {
left: 66.66666667%
}
.col-md-push-7 {
left: 58.33333333%
}
.col-md-push-6 {
left: 50%
}
.col-md-push-5 {
left: 41.66666667%
}
.col-md-push-4 {
left: 33.33333333%
}
.col-md-push-3 {
left: 25%
}
.col-md-push-2 {
left: 16.66666667%
}
.col-md-push-1 {
left: 8.33333333%
}
.col-md-push-0 {
left: auto
}
.col-md-offset-12 {
margin-left: 100%
}
.col-md-offset-11 {
margin-left: 91.66666667%
}
.col-md-offset-10 {
margin-left: 83.33333333%
}
.col-md-offset-9 {
margin-left: 75%
}
.col-md-offset-8 {
margin-left: 66.66666667%
}
.col-md-offset-7 {
margin-left: 58.33333333%
}
.col-md-offset-6 {
margin-left: 50%
}
.col-md-offset-5 {
margin-left: 41.66666667%
}
.col-md-offset-4 {
margin-left: 33.33333333%
}
.col-md-offset-3 {
margin-left: 25%
}
.col-md-offset-2 {
margin-left: 16.66666667%
}
.col-md-offset-1 {
margin-left: 8.33333333%
}
.col-md-offset-0 {
margin-left: 0
}
}
@media (min-width: 1200px) {
.col-lg-1,
.col-lg-2,
.col-lg-3,
.col-lg-4,
.col-lg-5,
.col-lg-6,
.col-lg-7,
.col-lg-8,
.col-lg-9,
.col-lg-10,
.col-lg-11,
.col-lg-12 {
float: left
}
.col-lg-12 {
width: 100%
}
.col-lg-11 {
width: 91.66666667%
}
.col-lg-10 {
width: 83.33333333%
}
.col-lg-9 {
width: 75%
}
.col-lg-8 {
width: 66.66666667%
}
.col-lg-7 {
width: 58.33333333%
}
.col-lg-6 {
width: 50%
}
.col-lg-5 {
width: 41.66666667%
}
.col-lg-4 {
width: 33.33333333%
}
.col-lg-3 {
width: 25%
}
.col-lg-2 {
width: 16.66666667%
}
.col-lg-1 {
width: 8.33333333%
}
.col-lg-pull-12 {
right: 100%
}
.col-lg-pull-11 {
right: 91.66666667%
}
.col-lg-pull-10 {
right: 83.33333333%
}
.col-lg-pull-9 {
right: 75%
}
.col-lg-pull-8 {
right: 66.66666667%
}
.col-lg-pull-7 {
right: 58.33333333%
}
.col-lg-pull-6 {
right: 50%
}
.col-lg-pull-5 {
right: 41.66666667%
}
.col-lg-pull-4 {
right: 33.33333333%
}
.col-lg-pull-3 {
right: 25%
}
.col-lg-pull-2 {
right: 16.66666667%
}
.col-lg-pull-1 {
right: 8.33333333%
}
.col-lg-pull-0 {
right: auto
}
.col-lg-push-12 {
left: 100%
}
.col-lg-push-11 {
left: 91.66666667%
}
.col-lg-push-10 {
left: 83.33333333%
}
.col-lg-push-9 {
left: 75%
}
.col-lg-push-8 {
left: 66.66666667%
}
.col-lg-push-7 {
left: 58.33333333%
}
.col-lg-push-6 {
left: 50%
}
.col-lg-push-5 {
left: 41.66666667%
}
.col-lg-push-4 {
left: 33.33333333%
}
.col-lg-push-3 {
left: 25%
}
.col-lg-push-2 {
left: 16.66666667%
}
.col-lg-push-1 {
left: 8.33333333%
}
.col-lg-push-0 {
left: auto
}
.col-lg-offset-12 {
margin-left: 100%
}
.col-lg-offset-11 {
margin-left: 91.66666667%
}
.col-lg-offset-10 {
margin-left: 83.33333333%
}
.col-lg-offset-9 {
margin-left: 75%
}
.col-lg-offset-8 {
margin-left: 66.66666667%
}
.col-lg-offset-7 {
margin-left: 58.33333333%
}
.col-lg-offset-6 {
margin-left: 50%
}
.col-lg-offset-5 {
margin-left: 41.66666667%
}
.col-lg-offset-4 {
margin-left: 33.33333333%
}
.col-lg-offset-3 {
margin-left: 25%
}
.col-lg-offset-2 {
margin-left: 16.66666667%
}
.col-lg-offset-1 {
margin-left: 8.33333333%
}
.col-lg-offset-0 {
margin-left: 0
}
}
.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
content: " ";
display: table
}
.clearfix:after,
.container:after,
.container-fluid:after,
.row:after {
clear: both
}
.center-block {
display: block;
margin-left: auto;
margin-right: auto
}
.pull-right {
float: right !important
}
.pull-left {
float: left !important
}
.hide {
display: none !important
}
.show {
display: block !important
}
.invisible {
visibility: hidden
}
.text-hide {
font: 0/0 a;
color: transparent;
text-shadow: none;
background-color: transparent;
border: 0
}
.hidden {
display: none !important;
visibility: hidden !important
}
.affix {
position: fixed
}
::-moz-selection {
color: #668db9
}
::selection {
color: #668db9
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 1;
margin: 3.5rem 0 1.75rem 0
}
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
margin-top: 0
}
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
color: #1e1e1e
}
h1 a:hover,
h2 a:hover,
h3 a:hover,
h4 a:hover,
h5 a:hover,
h6 a:hover {
color: #ffbc2e
}
h1 {
font-size: 2.5rem
}
.section-title {
color: #ffbc2e;
font-size: 16px;
font-weight: 700;
text-transform: uppercase;
letter-spacing: .075rem
}
h2 {
font-size: 2rem
}
#intro h2 {
font-size: 3.333333rem
}
h3 {
font-size: 1.75rem
}
h4 {
font-size: 1.25rem
}
h5 {
font-size: 1.125rem
}
h6 {
font-size: 1rem
}
p {
margin: 1.75rem 0
}
p:first-child,
p:last-of-type {
margin-top: 0
}
p:last-child {
margin-bottom: 0
}
a {
color: #ffbc2e;
text-decoration: none
}
a:hover {
color: #1e1e1e
}
a:focus {
outline: 0
}
a:hover,
a:active {
outline: 0
}
.arrowlink {
color: #ffbc2e;
font-size: 14px;
font-weight: 700;
letter-spacing: .075rem;
text-transform: uppercase;
display: inline-block
}
.arrowlink:after {
font-size: 14px;
line-height: 24px;
content: "\e903";
font-family: '_dgicons';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
float: right;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin-left: 4px;
-webkit-transition: all .15s ease;
transition: all .15s ease
}
.arrowlink:hover {
color: #ffbc2e
}
.arrowlink:hover:after {
-webkit-transform: translateX(4px);
-ms-transform: translateX(4px);
transform: translateX(4px)
}
/*
ul,
ol {
list-style: none;
padding: 0;
margin: 0
}
*/
code,
kbd,
pre,
samp {
font-weight: 600;
font-family: 'Roboto Mono', monospace;
font-size: 1rem;
line-height: 1.5
}
kbd {
background-color: #fff;
padding: 2px 8px 4px;
border-radius: 2px;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.25)
}
@media (max-width: 959px) {
kbd {
padding: 0 4px 2px
}
}
code {
line-height: 1.25;
padding: 5px;
border-radius: 0;
background: #cfd8dc;
padding: 1.75rem;
margin: 1.75rem;
display: block
}
@media (max-width: 959px) {
code {
margin: 1.75rem 0
}
}
pre {
color: #607d8b;
word-break: break-all;
word-wrap: break-word;
white-space: nowrap;
background: #fff;
margin: 1.75rem;
background: #cfd8dc;
border-radius: 0;
display: block
}
@media (max-width: 959px) {
pre {
margin: 1.75rem 0
}
}
pre code {
color: #607d8b;
padding: 0;
padding: 1.75rem;
margin: 0;
white-space: pre-wrap;
display: block
}
abbr {
cursor: help
}
blockquote {
color: #1e1e1e;
position: relative;
margin: 1.75rem 0 1.75rem 0;
padding: 0 20px 2px;
font-size: 1.25rem;
font-style: italic;
border: 0;
border-left: 3px solid #424242
}
blockquote.blockquote-reverse,
blockquote.pull-right {
border: 0;
border-right: 3px solid #424242;
text-align: right
}
cite {
font-style: normal
}
address {
font-style: normal
}
sup,
sub {
font-size: .5em
}
sup {
top: -1em
}
.fade-in-up {
opacity: 0;
-webkit-transform: translate3d(0, 100px, 0);
transform: translate3d(0, 100px, 0);
-webkit-transition: all .4s ease-out 0s;
transition: all .4s ease-out 0s
}
.is-loaded .fade-in-up,
.is-default .fade-in-up {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
#page-about-us #aspot,
#page-careers #aspot,
#page-career #aspot,
#page-default #aspot,
#page-about-us main>*,
#page-careers main>*,
#page-career main>*,
#page-default main>* {
opacity: 0;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
#page-about-us .site-footer,
#page-careers .site-footer,
#page-career .site-footer,
#page-default .site-footer {
-webkit-transition: none;
transition: none
}
#page-about-us .is-exiting #aspot,
#page-careers .is-exiting #aspot,
#page-career .is-exiting #aspot,
#page-default .is-exiting #aspot,
#page-about-us .is-exiting main>*,
#page-careers .is-exiting main>*,
#page-career .is-exiting main>*,
#page-default .is-exiting main>*,
#page-about-us .is-exiting .site-footer,
#page-careers .is-exiting .site-footer,
#page-career .is-exiting .site-footer,
#page-default .is-exiting .site-footer {
opacity: 0
}
#page-about-us .is-exiting .site-footer,
#page-careers .is-exiting .site-footer,
#page-career .is-exiting .site-footer,
#page-default .is-exiting .site-footer {
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out;
-webkit-transition-delay: 0s;
transition-delay: 0s
}
#page-about-us .is-loaded #aspot,
#page-careers .is-loaded #aspot,
#page-career .is-loaded #aspot,
#page-default .is-loaded #aspot,
#page-about-us .is-default #aspot,
#page-careers .is-default #aspot,
#page-career .is-default #aspot,
#page-default .is-default #aspot,
#page-about-us .is-loaded main>*,
#page-careers .is-loaded main>*,
#page-career .is-loaded main>*,
#page-default .is-loaded main>*,
#page-about-us .is-default main>*,
#page-careers .is-default main>*,
#page-career .is-default main>*,
#page-default .is-default main>*,
#page-about-us .is-loaded .site-footer,
#page-careers .is-loaded .site-footer,
#page-career .is-loaded .site-footer,
#page-default .is-loaded .site-footer,
#page-about-us .is-default .site-footer,
#page-careers .is-default .site-footer,
#page-career .is-default .site-footer,
#page-default .is-default .site-footer {
opacity: 1
}
#page-about-us .is-loaded .site-footer,
#page-careers .is-loaded .site-footer,
#page-career .is-loaded .site-footer,
#page-default .is-loaded .site-footer,
#page-about-us .is-default .site-footer,
#page-careers .is-default .site-footer,
#page-career .is-default .site-footer,
#page-default .is-default .site-footer {
-webkit-transition-delay: 1s;
transition-delay: 1s
}
.main-menu {
width: 100%;
padding: 25px;
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 1030;
pointer-events: none;
-webkit-transition: -webkit-transform 200ms linear;
transition: transform 200ms linear
}
#page-careers.in-main .site-footer,
#page-default.in-main .site-footer {
opacity: 1 !important
}
#page-about-us.in-mid .is-exiting .site-footer {
opacity: 0 !important;
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
#page-careers.in-main .is-exiting .site-footer,
#page-default.in-main .is-exiting .site-footer {
opacity: 0 !important;
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
#page-home .site-footer {
opacity: 0;
-webkit-transition: opacity .25s ease-out 0s;
transition: opacity .25s ease-out 0s
}
#page-home.fp-viewing-5 .site-footer {
opacity: 1;
-webkit-transition: opacity .5s ease-out .5s;
transition: opacity .5s ease-out .5s;
z-index: 3
}
.site-footer .cta {
text-align: center;
width: 100%;
padding: 120px 0 80px;
margin-bottom: 30px;
border-bottom: 2px dashed #424242
}
@media (max-width: 719px) {
.site-footer .cta {
padding: 80px 0 60px
}
}
.site-footer .cta h4 {
color: #999;
font-weight: 500;
font-size: 20px;
margin: 0 0 10px
}
@media (max-width: 719px) {
.site-footer .cta h4 {
font-size: 18px
}
}
.site-footer .cta h5 {
color: #fff;
font-size: 50px;
margin: 0 0 60px
}
@media (max-width: 719px) {
.site-footer .cta h5 {
font-size: 40px;
margin: 0 0 40px
}
}
.site-footer .cta a {
font-size: 14px;
font-weight: 600
}
@media (max-width: 719px) {
.site-footer .site-contacts .links {
margin: 0 0 20px
}
}
.site-footer .site-contacts a {
font-size: 13px;
text-transform: uppercase;
letter-spacing: .05rem;
font-weight: 500;
color: #999
}
.site-footer .site-contacts a:hover {
color: #fff
}
.site-footer .site-contacts .icons {
font-size: 30px;
line-height: 32px;
text-align: right
}
.site-footer .site-contacts .icons a {
width: 32px;
height: 32px;
line-height: 32px;
text-align: center;
display: inline-block
}
.site-footer .site-contacts .icons a:first-child {
font-size: 32px
}
.site-footer .site-contacts .icons a:last-child {
font-size: 27px;
position: relative;
top: -1px
}
.site-footer .site-contacts .icons a i span {
display: none
}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
width: auto;
border: 0;
border-radius: 3px;
color: #fff;
background: #ffbc2e;
line-height: normal;
padding: .5rem 1rem;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover {
background: #1e1e1e
}
.btn {
color: #fff;
font-weight: 500;
font-family: 'Sentinel', serif;
font-style: italic;
text-align: center;
text-transform: lowercase;
letter-spacing: 0;
line-height: 1.5;
border: 3px solid #fff;
border-radius: 3px;
padding: .75rem 1rem;
background: transparent;
display: inline-block;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
.btn span {
display: inline-block
}
.btn i {
font-size: 20px;
margin-right: 5px;
float: left
}
.btn [class^="entypo-"],
.btn [class*=" entypo-"] {
font-size: 20px
}
.btn--trans {
color: #fff !important;
background: rgba(255, 255, 255, 0.25);
border: 0;
padding: 12px 16px
}
.btn--trans:hover {
color: #1e1e1e !important;
background: #fff
}
.btn--default {
color: #1e1e1e;
background: #fff;
border-color: #fff
}
.btn--primary {
color: #fff;
background: #1e1e1e;
border-color: #1e1e1e
}
.btn--primary:hover {
color: #1e1e1e !important;
background: #fff
}
.btn--primary.btn--outline {
background: transparent;
color: #1e1e1e !important
}
.btn--primary.btn--outline:hover {
color: #fff !important;
background: #1e1e1e !important
}
.btn--secondary {
color: #fff !important;
background: #ffbc2e;
border-color: #ffbc2e
}
.btn--secondary:hover {
color: #ffbc2e !important;
background: #fff
}
.btn--secondary.btn--outline {
background: transparent;
color: #ffbc2e !important
}
.btn--secondary.btn--outline:hover {
color: #fff !important;
background: #ffbc2e !important
}
.tab-list {
position: relative
}
.tab-list .tab {
width: 100%;
opacity: 0;
visibility: hidden;
pointer-events: none;
position: absolute;
display: inline-block;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
.tab-list .tab.active {
opacity: 1;
visibility: visible;
pointer-events: auto
}
input,
select,
textarea {
color: #1e1e1e;
font-weight: normal;
line-height: normal;
width: 100%;
background: #fff;
margin: 0;
padding: .75rem 1rem;
border: 1px solid #424242;
border-radius: 0;
display: block
}
input:focus,
select:focus,
textarea:focus {
outline: 0
}
textarea {
overflow: auto;
vertical-align: top;
resize: vertical;
height: auto
}
input[type="text"],
input[type="email"],
input[type="search"],
input[type="password"],
input[type="tel"],
textarea {
-webkit-appearance: none
}
::input-placeholder {
line-height: normal;
opacity: .5;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
*:focus::input-placeholder {
opacity: 0
}
:-moz-placeholder {
line-height: normal;
transition: all .25s ease-out
}
*:focus:-moz-placeholder {
opacity: 0
}
::-moz-placeholder {
line-height: normal;
transition: all .25s ease-out
}
*:focus::-moz-placeholder {
opacity: 0
}
:-ms-input-placeholder {
line-height: normal;
transition: all .25s ease-out
}
*:focus:-ms-input-placeholder {
opacity: 0
}
::-webkit-input-placeholder {
line-height: normal;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
*:focus::-webkit-input-placeholder {
opacity: 0
}
fieldset {
padding: 0;
margin: 0;
border: 0;
min-width: 0
}
.input-group {
position: relative;
display: table;
border-collapse: separate
}
@media (min-width:768px) {
.form-inline .input-group>input {
width: 100%
}
}
.input-group-btn {
position: relative;
font-size: 0;
white-space: nowrap;
vertical-align: middle;
width: 1%;
display: table-cell
}
.input-group-btn .btn {
background: #ccc;
line-height: normal;
border: 1px solid #ccc;
border-radius: 0;
margin-left: -1px
}
.input-group-btn .btn i {
font-size: initial;
margin: 0
}
.input-group>input:focus {
border-color: #1e1e1e
}
.input-group>input:focus+.input-group-btn .btn {
background: #1e1e1e;
border-color: #1e1e1e
}
.input-group>input:focus+.input-group-btn .btn:hover {
color: #fff;
background: #ffbc2e;
border-color: #ffbc2e
}
[type="checkbox"]:not(:checked),
[type="checkbox"]:checked,
[type="radio"]:not(:checked),
[type="radio"]:checked {
position: absolute;
left: -9999px
}
[type="checkbox"]:not(:checked)+label,
[type="checkbox"]:checked+label,
[type="radio"]:not(:checked)+label,
[type="radio"]:checked+label {
position: relative;
padding-left: 75px;
cursor: pointer
}
[type="checkbox"]:not(:checked)+label:before,
[type="checkbox"]:checked+label:before,
[type="checkbox"]:not(:checked)+label:after,
[type="checkbox"]:checked+label:after,
[type="radio"]:not(:checked)+label:before,
[type="radio"]:checked+label:before,
[type="radio"]:not(:checked)+label:after,
[type="radio"]:checked+label:after {
content: '';
position: absolute
}
[type="checkbox"]:not(:checked)+label:before,
[type="checkbox"]:checked+label:before,
[type="radio"]:not(:checked)+label:before,
[type="radio"]:checked+label:before {
left: 0;
top: -3px;
width: 65px;
height: 30px;
background: #ddd;
border-radius: 15px;
-webkit-transition: background-color .2s;
transition: background-color .2s
}
[type="checkbox"]:not(:checked)+label:after,
[type="checkbox"]:checked+label:after,
[type="radio"]:not(:checked)+label:after,
[type="radio"]:checked+label:after {
width: 20px;
height: 20px;
-webkit-transition: all .2s;
transition: all .2s;
border-radius: 50%;
background: #7f8c9a;
top: 2px;
left: 5px
}
[type="checkbox"]:checked+label:before,
[type="radio"]:checked+label:before {
background: #34495e
}
[type="checkbox"]:checked+label:after,
[type="radio"]:checked+label:after {
background: #39d2b4;
top: 2px;
left: 40px
}
[type="checkbox"]:checked+label .ui,
[type="checkbox"]:not(:checked)+label .ui:before,
[type="checkbox"]:checked+label .ui:after,
[type="radio"]:checked+label .ui,
[type="radio"]:not(:checked)+label .ui:before,
[type="radio"]:checked+label .ui:after {
position: absolute;
left: 6px;
width: 65px;
border-radius: 15px;
font-size: 14px;
font-weight: bold;
line-height: 22px;
-webkit-transition: all .2s;
transition: all .2s
}
[type="checkbox"]:not(:checked)+label .ui:before,
[type="radio"]:not(:checked)+label .ui:before {
content: "no";
left: 32px
}
[type="checkbox"]:checked+label .ui:after,
[type="radio"]:checked+label .ui:after {
content: "yes";
color: #39d2b4
}
[type="checkbox"]:focus+label:before,
[type="radio"]:focus+label:before {
border: 1px dashed #777;
box-sizing: border-box;
margin-top: -1px
}
cite {
font-style: normal
}
.size-auto,
.size-full,
.size-large,
.size-medium,
.size-thumbnail {
max-width: 100%;
height: auto
}
.gallery dl {
float: left;
margin-top: 10px;
text-align: center;
width: 33%
}
.gallery dl img {
border: 2px solid #cfcfcf
}
.post-content {
text-align: center;
margin: 0 auto;
clear: both;
position: relative;
opacity: 0;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
.post-content p:first-child em strong,
.post-content p:first-child strong em {
font-size: 24px;
line-height: 1.25;
font-weight: 300;
font-style: normal
}
@media (min-width:720px) {
.post-content p:first-child em strong,
.post-content p:first-child strong em {
font-size: 28px;
line-height: 1.5
}
}
.post-content>p,
.post-content>h2,
.post-content>h3,
.post-content>h4,
.post-content>h5,
.post-content>ul,
.post-content>ol,
.post-content>.wp-slick-slider {
margin-left: auto;
margin-right: auto
}
@media (min-width:600px) {
.post-content>p,
.post-content>h2,
.post-content>h3,
.post-content>h4,
.post-content>h5,
.post-content>ul,
.post-content>ol,
.post-content>.wp-slick-slider {
max-width: 600px
}
}
@media (min-width:1200px) {
.post-content>p,
.post-content>h2,
.post-content>h3,
.post-content>h4,
.post-content>h5,
.post-content>ul,
.post-content>ol,
.post-content>.wp-slick-slider {
max-width: 800px
}
}
.post-content code {
line-height: 1.25;
padding: 5px;
border-radius: 0;
background: #cfd8dc;
padding: 1.75rem;
margin: 1.75rem;
display: block
}
@media (max-width:959px) {
.post-content code {
margin: 1.75rem 0
}
}
.post-content pre {
color: #607d8b;
word-break: break-all;
word-wrap: break-word;
white-space: nowrap;
background: #fff;
margin: 1.75rem auto;
border-radius: 0;
display: block
}
@media (min-width:600px) {
.post-content pre {
max-width: 600px
}
}
@media (min-width:1200px) {
.post-content pre {
max-width: 800px
}
}
@media (max-width:959px) {
.post-content pre {
margin-top: 1.75rem;
margin-bottom: 1.75rem
}
}
.post-content pre code {
color: #607d8b;
padding: 0;
padding: 1.75rem;
margin: 0;
white-space: pre-wrap;
display: block
}
.post-content .wp-slick-slider {
padding: 0 25px;
text-align: center
}
.post-content .wp-slick-slider figure {
padding: 0
}
.post-content .wp-slick-slider.post-full {
padding: 0;
max-width: 100%
}
.post-content .wp-slick-slider.post-full .slick-prev {
left: 20px
}
@media (max-width: 719px) {
.post-content .wp-slick-slider.post-full .slick-prev {
left: 0
}
}
.post-content .wp-slick-slider.post-full .slick-next {
right: 20px
}
@media (max-width: 719px) {
.post-content .wp-slick-slider.post-full .slick-next {
right: 0
}
}
@media (max-width: 719px) {
.post-content .wp-slick-slider.post-full .slick-prev,
.post-content .wp-slick-slider.post-full .slick-next {
width: 48px;
right: 0
}
}
.post-content .wp-slick-slider.post-full .slick-prev:before,
.post-content .wp-slick-slider.post-full .slick-next:before {
font-size: 48px;
color: #fff
}
@media (max-width: 719px) {
.post-content .wp-slick-slider.post-full .slick-prev:before,
.post-content .wp-slick-slider.post-full .slick-next:before {
font-size: 32px
}
}
.post-content .wp-slick-slider.post-full figure {
padding: 0
}
@media (min-width:720px) {
.post-content .wp-slick-slider.post-wide {
max-width: 720px
}
}
@media (min-width:800px) {
.post-content .wp-slick-slider.post-wide {
max-width: 800px
}
}
@media (min-width:960px) {
.post-content .wp-slick-slider.post-wide {
max-width: 960px
}
}
@media (min-width:1200px) {
.post-content .wp-slick-slider.post-wide {
max-width: 1200px
}
}
@media (min-width:600px) {
.post-content .wp-slick-slider.post-size {
max-width: 600px
}
}
@media (min-width:1200px) {
.post-content .wp-slick-slider.post-size {
max-width: 800px
}
}
.post-content [data-slick] figure {
background: #fff
}
.post-content [data-slick] img {
width: 100%;
padding: 0;
margin: 0
}
.post-content [data-slick] figcaption {
text-align: center;
width: 100%;
overflow: hidden
}
.post-content [data-slick] .slick-prev {
left: -56px
}
@media (max-width: 719px) {
.post-content [data-slick] .slick-prev {
left: 0
}
}
.post-content [data-slick] .slick-next {
right: -56px
}
@media (max-width: 719px) {
.post-content [data-slick] .slick-next {
right: 0
}
}
.post-content [data-slick] .slick-prev,
.post-content [data-slick] .slick-next {
width: 56px;
height: 56px;
margin-top: -28px;
z-index: 1000
}
@media (max-width: 719px) {
.post-content [data-slick] .slick-prev,
.post-content [data-slick] .slick-next {
width: 25px
}
}
.post-content [data-slick] .slick-prev:before,
.post-content [data-slick] .slick-next:before {
font-size: 32px;
color: #1e1e1e
}
@media (max-width: 719px) {
.post-content [data-slick] .slick-prev:before,
.post-content [data-slick] .slick-next:before {
font-size: 24px
}
}
.post-content [data-slick].post-full {
margin-top: 1.75rem;
margin-bottom: 1.75rem
}
.post-content [data-slick].post-full:first-child {
margin-top: 0
}
.post-content [data-slick].post-full:last-child {
margin-bottom: 0
}
.post-content [data-slick].post-full figure {
position: relative;
margin: 0
}
.post-content [data-slick].post-full figcaption {
color: #fff;
font-size: 15px;
text-align: left;
max-width: 100%;
left: 0;
right: 0;
position: absolute;
bottom: 0;
display: block
}
.post-content [data-slick].post-full figcaption.has--caption {
padding: 120px 27.5% 25px 25px;
background: url('../img/ui/figcaption-grad.png') repeat-x center bottom;
background: -webkit-linear-gradient(bottom, rgba(37, 43, 51, 0.25) 0, rgba(37, 43, 51, 0) 100%);
background: linear-gradient(to top, rgba(37, 43, 51, 0.25) 0, rgba(37, 43, 51, 0) 100%);
opacity: 0;
-webkit-transition: all .2s ease 0s;
transition: all .2s ease 0s
}
@media (max-width: 719px) {
.post-content [data-slick].post-full figcaption.has--caption {
padding: 120px 25px 15px 25px;
text-align: center
}
}
.post-content [data-slick].post-full .slick-active figcaption.has--caption {
opacity: 1;
-webkit-transition-delay: .4s;
transition-delay: .4s
}
.post-content>*:not(img) {
text-align: left;
padding: 0 25px
}
.post-content>*:not(figure) {
text-align: left
}
.is-default .post-content,
.is-loaded .post-content {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
.post-content h3 {
font-size: 26px;
font-weight: 700;
margin-bottom: .75rem
}
.post-content h4 {
font-size: 22px;
font-weight: 500
}
.post-content h3+h4 {
font-size: 16px;
font-weight: 700;
margin-top: 0;
letter-spacing: .02rem;
text-transform: uppercase;
color: #a6a6a6;
color: rgba(0, 0, 0, 0.35)
}
.post-content h5 {
color: #ccc;
font-size: 1rem;
letter-spacing: .1rem;
font-weight: 700;
text-transform: uppercase
}
.post-content blockquote {
border: 0;
margin: 0 auto;
padding-top: 12.5px;
padding-bottom: 12.5px;
max-width: 100%;
position: relative
}
@media (min-width:600px) {
.post-content blockquote {
max-width: 600px
}
}
@media (min-width:960px) {
.post-content blockquote {
max-width: 800px
}
}
@media (min-width:1200px) {
.post-content blockquote {
max-width: 960px;
padding-top: 25px;
padding-bottom: 25px
}
}
.post-content blockquote p {
color: #ffbc2e;
font-family: 'Sentinel', serif;
font-size: 24px;
font-weight: 500;
line-height: 1.25;
font-style: italic;
padding: 0;
position: relative
}
@media (min-width:800px) {
.post-content blockquote p {
font-size: 28px
}
}
@media (min-width:960px) {
.post-content blockquote p {
font-size: 32px
}
}
@media (min-width:1200px) {
.post-content blockquote p {
font-size: 36px
}
}
.post-content li a,
.post-content p a {
color: #1e1e1e;
background-image: -webkit-linear-gradient(top, rgba(30, 30, 30, 0) 0, rgba(30, 30, 30, 0.4) 0);
background-image: linear-gradient(to bottom, rgba(30, 30, 30, 0) 0, rgba(30, 30, 30, 0.4) 0);
background-repeat: repeat-x;
background-size: 2px 2px;
background-position: 0 100%;
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
word-break: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto
}
.post-content li a:hover,
.post-content p a:hover {
color: #1e1e1e;
background-image: -webkit-linear-gradient(top, rgba(255, 188, 46, 0) 0, #ffbc2e 0);
background-image: linear-gradient(to bottom, rgba(255, 188, 46, 0) 0, #ffbc2e 0);
background-size: 2px 100%
}
.post-content figure.width-1600 {
padding: 0;
max-width: 100%
}
.post-content figure.wp-caption {
position: relative
}
.post-content img {
max-width: 100%;
margin-left: auto;
margin-right: auto
}
.post-content img.size-post-full {
width: 100%
}
.post-content img.size-post-full+.wp-caption-text {
color: #fff;
font-size: 15px;
text-align: left;
max-width: 100%;
left: 0;
right: 0;
position: absolute;
bottom: 0;
padding: 120px 27.5% 25px 25px;
background: url('../img/ui/figcaption-grad.png') repeat-x center bottom;
background: -webkit-linear-gradient(bottom, rgba(37, 43, 51, 0.25) 0, rgba(37, 43, 51, 0) 100%);
background: linear-gradient(to top, rgba(37, 43, 51, 0.25) 0, rgba(37, 43, 51, 0) 100%);
display: block
}
@media (max-width: 719px) {
.post-content img.size-post-full+.wp-caption-text {
padding: 120px 25px 15px 25px;
text-align: center
}
}
@media (max-width:719px) {
.post-content img.size-post-wide {
width: 100%
}
}
@media (min-width:720px) {
.post-content img.size-post-wide {
max-width: 670px
}
}
@media (min-width:800px) {
.post-content img.size-post-wide {
max-width: 750px
}
}
@media (min-width:960px) {
.post-content img.size-post-wide {
max-width: 910px
}
}
@media (min-width:1200px) {
.post-content img.size-post-wide {
max-width: 1150px
}
}
@media (max-width:599px) {
.post-content img.size-post-size {
width: 100%
}
}
@media (min-width:600px) {
.post-content img.size-post-size {
max-width: 550px
}
}
@media (min-width:1200px) {
.post-content img.size-post-size {
max-width: 750px
}
}
.post-content figure {
max-width: 100%;
margin-left: auto;
margin-right: auto;
text-align: center
}
.post-content figure a {
display: inline-block
}
.post-content figure.size-full {
width: 100%;
padding-left: 0;
padding-right: 0
}
@media (max-width:799px) {
.post-content figure.size-full {
padding: 0 25px
}
}
@media (max-width:719px) {
.post-content figure.size-wide {
padding: 0 25px;
width: 100%
}
}
@media (min-width:720px) {
.post-content figure.size-wide {
max-width: 670px
}
}
@media (min-width:800px) {
.post-content figure.size-wide {
max-width: 750px
}
}
@media (min-width:960px) {
.post-content figure.size-wide {
max-width: 910px
}
}
@media (min-width:1200px) {
.post-content figure.size-wide {
max-width: 1150px
}
}
@media (max-width:599px) {
.post-content figure.size-post {
padding: 0 25px;
width: 100%
}
}
@media (min-width:600px) {
.post-content figure.size-post {
max-width: 550px
}
}
@media (min-width:1200px) {
.post-content figure.size-post {
max-width: 750px
}
}
.post-content figure figcaption {
color: #aaa;
font-size: 15px;
line-height: 1.2;
max-width: 600px;
margin: 0;
padding-top: 16px;
margin: 0 auto
}
@media (max-width:600px) {
.post-content figure figcaption {
padding-left: 25px;
padding-right: 25px
}
}
.post-content .wp-caption figcaption,
.post-content .wp-caption .wp-caption-text {
color: #aaa;
font-size: 15px;
line-height: 1.2;
max-width: 600px;
margin: 0;
padding-top: 16px;
margin: 0 auto
}
@media (max-width:600px) {
.post-content .wp-caption figcaption,
.post-content .wp-caption .wp-caption-text {
padding-left: 25px;
padding-right: 25px
}
}
.post-content .video-container {
margin-left: auto;
margin-right: auto;
margin-top: 3.5rem;
margin-bottom: 3.5rem;
max-width: 600px
}
@media (min-width:720px) {
.post-content .video-container {
max-width: 720px
}
}
@media (min-width:800px) {
.post-content .video-container {
max-width: 800px
}
}
@media (min-width:960px) {
.post-content .video-container {
max-width: 960px
}
}
@media (min-width:1200px) {
.post-content .video-container {
max-width: 1200px
}
}
.post-content .video-container div {
width: 100%;
position: relative;
padding-bottom: 56.25%
}
.post-content .video-container div iframe,
.post-content .video-container div object,
.post-content .video-container div embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%
}
.post-content ol,
.post-content ul {
list-style: none;
margin-top: 1.75rem;
margin-bottom: 1.75rem;
counter-reset: post
}
.post-content ol li,
.post-content ul li {
margin-left: 30px;
margin-bottom: .875rem;
padding-top: 2px
}
.post-content ol li:last-child,
.post-content ul li:last-child {
margin-bottom: 0
}
.post-content ol li:before,
.post-content ul li:before {
position: absolute;
display: inline-block;
box-sizing: border-box;
width: 58px;
margin-left: -58px;
text-align: right
}
.post-content ol li:before {
font-size: 1rem;
font-weight: 700;
padding-right: 12px;
counter-increment: post;
content: counter(post) "."
}
.post-content ul li:before {
font-weight: 800;
padding-right: 15px;
font-size: 1rem;
content: '•'
}
.post-content figure {
margin-top: 1.75rem;
margin-bottom: 1.75rem
}
.post-content figure:last-child {
margin-bottom: 0
}
.post-content figure img {
display: block
}
.gallery dl {
float: left;
margin-top: 10px;
text-align: center;
width: 33%
}
.gallery dl img {
border: 2px solid #cfcfcf
}
.page-content {
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
.is-exiting .page-content {
opacity: 0
}
.is-loaded .page-content,
.is-default .page-content {
opacity: 1
}
.page-content h3 {
font-size: 26px;
font-weight: 700;
margin-bottom: .75rem
}
.page-content h4 {
font-size: 22px;
font-weight: 500
}
.page-content li {
margin-top: .58333333rem
}
.page-content p:last-of-type {
margin-top: 1.75rem
}
.page-content li a:not(.arrowlink),
.page-content p a:not(.arrowlink) {
color: #1e1e1e;
background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 50%);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.6) 50%);
background-repeat: repeat-x;
background-size: 2px 4px;
background-position: 0 100%;
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
word-break: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto
}
.page-content li a:not(.arrowlink):hover,
.page-content p a:not(.arrowlink):hover {
color: #1e1e1e;
background-image: -webkit-linear-gradient(top, rgba(255, 188, 46, 0) 50%, #ffbc2e 50%);
background-image: linear-gradient(to bottom, rgba(255, 188, 46, 0) 50%, #ffbc2e 50%);
background-repeat: repeat-x;
background-size: 2px 200%;
background-position: 0 100%
}
#aspot {
overflow: hidden;
width: 100%;
background-color: #fff;
position: relative;
z-index: 1
}
#aspot.no-bg {
background: #e8e8e8
}
#aspot.has-grad:after {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
display: block;
background: url(../img/ui/aspot-grad.png) repeat-x center bottom;
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0, #fff 100%), linear-gradient(to bottom, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.5) 100%);
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%), linear-gradient(to bottom, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.5) 100%)
}
#aspot .set-bg {
width: 100%;
height: 100%;
position: fixed;
z-index: 1;
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
opacity: 0;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out
}
#aspot .set-bg.default-bg {
background-repeat: repeat
}
@media (max-width: 719px) {
#page-home #aspot .set-bg {
background-position: 40% top
}
}
#aspot .set-bg.bg-loaded {
opacity: 1
}
#aspot h1 {
font-size: 100px;
line-height: 90px;
letter-spacing: -0.025em;
text-transform: none;
margin: 0
}
@media (max-width: 959px) {
#aspot h1 {
font-size: 80px;
line-height: 1
}
}
@media (max-width: 719px) {
#aspot h1 {
font-size: 70px;
line-height: 1
}
[data-height="small"]#aspot h1 {
font-size: 50px
}
}
@media (max-width: 599px) {
#aspot h1 {
font-size: 60px;
line-height: 1
}
}
@media (max-width: 359px) {
#aspot h1 {
font-size: 40px
}
}
#aspot .inner {
width: 100%;
height: 100%;
position: relative;
z-index: 2
}
#aspot .inner .arrowdown {
color: #1e1e1e;
width: 170px;
font-size: 32px;
text-align: center;
display: inline-block;
position: absolute;
bottom: -25vh
}
@media (max-width: 719px) {
#aspot .inner .arrowdown {
width: 100px
}
#page-home #aspot .inner .arrowdown {
bottom: -25vh
}
}
#aspot .set-bg+.inner h1 {
opacity: 0;
-webkit-transition: all 1s ease-in-out .75s;
transition: all 1s ease-in-out .75s
}
#aspot .set-bg+.inner .arrowdown {
opacity: 0;
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: all 1s ease-in-out 1s;
transition: all 1s ease-in-out 1s
}
#aspot .set-bg.bg-loaded+.inner h1 {
opacity: 1
}
#aspot .set-bg.bg-loaded+.inner .arrowdown {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
#aspot .bgvid {
width: 100%;
height: 100%
}
#aspot .section-one-background-title {
position: absolute;
top: 50%;
left: 50%;
display: block;
opacity: .65;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
#aspot .section-one-background-title .desktop {
display: block
}
@media (max-width: 959px) {
#aspot .section-one-background-title .desktop {
display: none
}
}
#aspot .section-one-background-title .mobile {
display: none
}
@media (max-width: 959px) {
#aspot .section-one-background-title .mobile {
display: block
}
}
#zspot {
width: 100%;
background-color: #fff;
position: relative
}
#page-article #zspot:before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
width: 100%;
height: 100%;
display: block;
background: #252b33;
opacity: .35;
-webkit-transition: all .5s cubic-bezier(.7, 0, .3, 1);
transition: all .5s cubic-bezier(.7, 0, .3, 1)
}
#zspot .inner {
height: 100%;
position: relative
}
#zspot .cta-wrap {
width: 100%;
height: 100%
}
#zspot .cta-wrap .cta {
background-color: #aaa;
text-align: center;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
width: 50%;
height: 100%;
padding: 0;
float: left;
position: relative
}
.is-single#zspot .cta-wrap .cta {
width: 100%
}
#zspot .cta-wrap .cta:before {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
background: #fff;
display: block;
opacity: 1;
-webkit-transition: opacity .6s ease-in-out;
transition: opacity .6s ease-in-out
}
#zspot .cta-wrap .cta:hover:before {
opacity: 0
}
#zspot .cta-wrap .cta h4 {
color: #fff;
font-size: 64px;
margin: 0;
width: 100%;
padding: 0 48px;
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%)
}
.is-single#zspot .cta-wrap .cta h4 {
font-size: 72px
}
#zspot .cta-wrap .cta span {
color: #1e1e1e;
font-size: 64px;
line-height: 1;
font-weight: 700;
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
z-index: 1;
-webkit-transition: opacity .6s ease-in-out;
transition: opacity .6s ease-in-out
}
.is-single#zspot .cta-wrap .cta span {
font-size: 72px
}
#zspot .cta-wrap .cta:hover span {
opacity: 0
}
#zspot.post-nav {
height: 300px;
z-index: 1;
-webkit-transition: height .6s ease-out;
transition: height .6s ease-out
}
#page-home #zspot.post-nav {
height: 100%
}
@media (min-width: 720px) {
#zspot.post-nav {
height: 400px
}
#page-home #zspot.post-nav {
height: 100%
}
}
#page-career #zspot.post-nav {
-webkit-transition: opacity .6s ease-in-out;
transition: opacity .6s ease-in-out
}
#page-article .is-zspotting #zspot.post-nav.is-next,
#page-article .is-exiting #zspot.post-nav.is-next,
#page-project .is-zspotting #zspot.post-nav.is-next,
#page-project .is-exiting #zspot.post-nav.is-next {
height: 100vh
}
#page-career .is-zspotting #zspot.post-nav.is-next,
#page-career .is-exiting #zspot.post-nav.is-next {
height: 400px !important;
opacity: 0
}
#zspot.post-nav .cta {
width: 100%;
height: 100%;
display: block;
position: relative;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out
}
#page-home .is-zspotting #zspot.post-nav .cta {
opacity: 1
}
#page-project .is-zspotting #zspot.post-nav .cta {
opacity: 1
}
#zspot.post-nav .cta:before {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
opacity: 1;
background: #fff;
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out
}
#zspot.post-nav.is-hovered .cta:before {
opacity: 0
}
#zspot.post-nav .cta .container {
padding-top: 56px;
padding-bottom: 56px;
top: 50%;
position: relative;
z-index: 1;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out;
pointer-events: none;
visibility: hidden
}
#zspot.post-nav.is-hovered .cta .container {
pointer-events: auto;
visibility: visible
}
.is-zspotting #zspot.post-nav.is-next .cta .container,
.is-exiting #zspot.post-nav.is-next .cta .container {
top: 100%;
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%)
}
#page-home .is-zspotting #zspot.post-nav.is-next .cta .container,
#page-home .is-exiting #zspot.post-nav.is-next .cta .container {
top: 50%;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
#zspot.post-nav .cta .initial {
width: 100%;
text-align: center;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
z-index: 2
}
#page-home #zspot.post-nav .cta .initial {
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out
}
#page-about-us #zspot.post-nav .cta .initial {
-webkit-transition: opacity 300ms ease-in-out;
transition: opacity 300ms ease-in-out
}
#zspot.post-nav.is-hovered .cta .initial {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
text-align: center;
z-index: 2;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
#page-home #zspot.post-nav.is-hovered .cta .initial {
height: auto;
bottom: auto;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%)
}
#zspot.post-nav.is-hovered .cta .initial span {
display: block;
position: relative;
width: 100%;
height: 100%
}
#page-home #zspot.post-nav.is-hovered .cta .initial span {
width: auto;
height: auto
}
#zspot.post-nav.is-hovered .cta .initial span a {
width: 100%;
height: 100%
}
#page-home #zspot.post-nav.is-hovered .cta .initial span a {
width: auto;
height: auto
}
#zspot.post-nav.is-hovered .cta .initial span a strong {
display: inline-block;
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%)
}
#page-home #zspot.post-nav.is-hovered .cta .initial span a strong {
top: auto;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
.is-zspotting #zspot.post-nav.is-next .cta .initial,
.is-exiting #zspot.post-nav.is-next .cta .initial {
display: none
}
#page-home .is-zspotting #zspot.post-nav.is-next .cta .initial,
#page-home .is-exiting #zspot.post-nav.is-next .cta .initial,
#page-about-us .is-zspotting #zspot.post-nav.is-next .cta .initial,
#page-about-us .is-exiting #zspot.post-nav.is-next .cta .initial {
display: block;
opacity: 0
}
#zspot.post-nav .cta span {
color: #1e1e1e;
font-size: 36px;
line-height: 1;
font-weight: 700;
display: inline-block;
-webkit-transition: all 200ms ease-in-out;
transition: all 200ms ease-in-out
}
@media (min-width: 720px) {
#zspot.post-nav .cta span {
font-size: 48px
}
}
@media (min-width: 960px) {
#zspot.post-nav .cta span {
font-size: 60px;
letter-spacing: -0.1rem
}
}
@media (min-width: 1440px) {
#zspot.post-nav .cta span {
font-size: 80px
}
}
#zspot.post-nav a {
color: #1e1e1e;
display: inline-block;
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out
}
#zspot.post-nav a:hover {
color: #fff
}
#zspot.post-nav.is-hovered span {
opacity: 0
}
#page-home #zspot.post-nav.is-hovered span,
#page-about-us #zspot.post-nav.is-hovered span {
color: #fff;
opacity: 1
}
#zspot.post-nav a:hover:before {
opacity: 0
}
.is-zspotting #zspot.post-nav.is-next .cta:before,
.is-exiting #zspot.post-nav.is-next .cta:before {
opacity: 0
}
#zspot.post-nav h1 {
color: #fff;
font-size: 36px;
line-height: 1;
font-weight: 700;
margin: 0;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
@media (min-width: 720px) {
#zspot.post-nav h1 {
font-size: 48px
}
}
@media (min-width: 960px) {
#zspot.post-nav h1 {
font-size: 60px;
letter-spacing: -0.1rem
}
}
@media (min-width: 1440px) {
#zspot.post-nav h1 {
font-size: 80px
}
#page-article #zspot.post-nav h1 {
font-size: 60px
}
}
#page-project .is-zspotting #zspot.post-nav h1,
#page-project .is-exiting #zspot.post-nav h1 {
opacity: 0
}
#zspot.post-nav h2 {
color: #fff;
font-size: 18px;
line-height: 1.5;
font-weight: normal;
margin: 0;
margin-top: 18px;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
@media (max-width: 719px) {
#zspot.post-nav h2 {
display: none
}
}
.pace {
-webkit-pointer-events: none;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none
}
.pace-inactive {
display: none
}
.pace .pace-progress {
background: #29d;
position: fixed;
z-index: 2000;
top: 0;
right: 100%;
width: 100%;
height: 2px
}
.fluidbox {
outline: none;
cursor: -webkit-zoom-in;
cursor: zoom-in
}
.fluidbox.fluidbox-opened {
cursor: -webkit-zoom-out;
cursor: zoom-out
}
.fluidbox-overlay {
background-color: rgba(255, 255, 255, 0.95);
cursor: pointer;
cursor: -webkit-zoom-out;
cursor: zoom-out;
opacity: 0;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
-webkit-transition: all .125s ease-out .125s;
transition: all .125s ease-out .125s
}
.fluidbox-wrap {
background-position: center center;
background-size: cover;
margin: 0 auto;
position: relative;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
.fluidbox-closed .fluidbox-wrap img {
-webkit-transition: opacity 0s ease-out .25s;
transition: opacity 0s ease-out .25s
}
.fluidbox-ghost {
background-size: 100% 100%;
background-position: center center;
position: absolute;
-webkit-transition-property: opacity, -webkit-transform;
transition-property: opacity, transform;
-webkit-transition-duration: 0s, .25s;
transition-duration: 0s, .25s;
-webkit-transition-delay: .25s, 0s;
transition-delay: .25s, 0s
}
.fluidbox-opened .fluidbox-ghost {
-webkit-transition-delay: 0s, 0s;
transition-delay: 0s, 0s
}
.img-caption {
opacity: 0;
background: rgba(255, 255, 255, 0.5);
width: 100%;
padding: 16px;
text-align: center;
position: fixed;
bottom: 2.5%;
left: 0;
-webkit-transform: translateY(100%);
-ms-transform: translateY(100%);
transform: translateY(100%);
z-index: 1060;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
.img-caption.visible {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
html.fp-enabled,
.fp-enabled body {
margin: 0;
padding: 0;
overflow: hidden;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0)
}
#superContainer {
height: 100%;
position: relative;
-ms-touch-action: none;
touch-action: none
}
.fp-section {
position: relative;
box-sizing: border-box
}
.fp-slide {
float: left
}
.fp-slide,
.fp-slidesContainer {
height: 100%;
display: block
}
.fp-slides {
z-index: 1;
height: 100%;
overflow: hidden;
position: relative;
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out
}
.fp-section.fp-table,
.fp-slide.fp-table {
display: table;
table-layout: fixed;
width: 100%
}
.fp-tableCell {
display: table-cell;
vertical-align: middle;
width: 100%;
height: 100%
}
.fp-slidesContainer {
float: left;
position: relative
}
.fp-controlArrow {
position: absolute;
z-index: 4;
top: 50%;
cursor: pointer;
width: 0;
height: 0;
border-style: solid;
margin-top: -38px;
-webkit-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.fp-controlArrow.fp-prev {
left: 15px;
width: 0;
border-width: 38.5px 34px 38.5px 0;
border-color: transparent #fff transparent transparent
}
.fp-controlArrow.fp-next {
right: 15px;
border-width: 38.5px 0 38.5px 34px;
border-color: transparent transparent transparent #fff
}
.fp-scrollable {
overflow: scroll
}
.fp-notransition {
-webkit-transition: none !important;
transition: none !important
}
#fp-nav {
position: fixed;
z-index: 100;
margin-top: 0 !important;
top: 50%;
opacity: 1;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
@media (max-width: 719px) {
#fp-nav {
display: none
}
}
#fp-nav.right {
right: 25px
}
#fp-nav.left {
left: 25px
}
.fp-slidesNav {
position: absolute;
z-index: 4;
left: 50%;
opacity: 1
}
#fp-nav ul,
.fp-slidesNav ul {
width: 25px;
margin: 0;
padding: 0;
text-align: center
}
#fp-nav ul li,
.fp-slidesNav ul li {
height: auto;
line-height: 0;
padding: 2px 0;
margin: 0;
display: block
}
#fp-nav ul li a,
.fp-slidesNav ul li a {
width: 25px;
padding: 6px 0;
margin: 0;
display: inline-block
}
#fp-nav ul li a span,
.fp-slidesNav ul li a span {
width: 100%;
height: 2px;
display: block;
background: rgba(30, 30, 30, 0.25)
}
#fp-nav ul li a:hover span,
.fp-slidesNav ul li a:hover span {
background: rgba(30, 30, 30, 0.5)
}
#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span {
background: rgba(30, 30, 30, 0.75)
}
#fp-nav ul li .fp-tooltip {
position: absolute;
top: -2px;
color: #fff;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
white-space: nowrap;
max-width: 220px;
overflow: hidden;
display: block;
opacity: 0;
width: 0
}
#fp-nav ul li:hover .fp-tooltip,
#fp-nav.fp-show-active a.active+.fp-tooltip {
-webkit-transition: opacity .2s ease-in;
transition: opacity .2s ease-in;
width: auto;
opacity: 1
}
#fp-nav ul li .fp-tooltip.right {
right: 20px
}
#fp-nav ul li .fp-tooltip.left {
left: 20px
}
.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell {
height: auto !important
}
body {
-webkit-backface-visibility: hidden
}
.animated {
-webkit-animation-duration: .75s;
animation-duration: .75s;
-webkit-animation-delay: 0;
animation-delay: 0;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
@-webkit-keyframes fadeIn {
0% {
opacity: 0
}
100% {
opacity: 1
}
}
@keyframes fadeIn {
0% {
opacity: 0
}
100% {
opacity: 1
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn
}
@-webkit-keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 20%, 0);
transform: translate3d(0, 20%, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInUp {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 20%, 0);
transform: translate3d(0, 20%, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp
}
@-webkit-keyframes fadeInUpMore {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 40%, 0);
transform: translate3d(0, 40%, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInUpMore {
0% {
opacity: 0;
-webkit-transform: translate3d(0, 40%, 0);
transform: translate3d(0, 40%, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
.fadeInUpMore {
-webkit-animation-name: fadeInUpMore;
animation-name: fadeInUpMore
}
@-webkit-keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-20%, 0, 0);
transform: translate3d(-20%, 0, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInLeft {
0% {
opacity: 0;
-webkit-transform: translate3d(-20%, 0, 0);
transform: translate3d(-20%, 0, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft
}
@-webkit-keyframes fadeInLeftAlt {
0% {
opacity: 0;
-webkit-transform: translate3d(-20%, 0, 0);
transform: translate3d(-20%, 0, 0)
}
100% {
opacity: .75;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInLeftAlt {
0% {
opacity: 0;
-webkit-transform: translate3d(-20%, 0, 0);
transform: translate3d(-20%, 0, 0)
}
100% {
opacity: .75;
-webkit-transform: none;
transform: none
}
}
.fadeInLeftAlt {
-webkit-animation-name: fadeInLeftAlt;
animation-name: fadeInLeftAlt
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(20%, 0, 0);
transform: translate3d(20%, 0, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(20%, 0, 0);
transform: translate3d(20%, 0, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
transform: none
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight
}
@-webkit-keyframes fadeInRightAlt {
0% {
opacity: 0;
-webkit-transform: translate3d(20%, 0, 0);
transform: translate3d(20%, 0, 0)
}
100% {
opacity: .75;
-webkit-transform: none;
transform: none
}
}
@keyframes fadeInRightAlt {
0% {
opacity: 0;
-webkit-transform: translate3d(20%, 0, 0);
transform: translate3d(20%, 0, 0)
}
100% {
opacity: .75;
-webkit-transform: none;
transform: none
}
}
.fadeInRightAlt {
-webkit-animation-name: fadeInRightAlt;
animation-name: fadeInRightAlt
}
@-webkit-keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3)
}
50% {
opacity: 1
}
}
@keyframes zoomIn {
0% {
opacity: 0;
-webkit-transform: scale3d(.3, .3, .3);
transform: scale3d(.3, .3, .3)
}
50% {
opacity: 1
}
}
.zoomIn {
-webkit-animation-name: zoomIn;
animation-name: zoomIn
}
@-webkit-keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 20%, 0);
transform: translate3d(0, 20%, 0);
visibility: visible
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
}
@keyframes slideInUp {
0% {
-webkit-transform: translate3d(0, 20%, 0);
transform: translate3d(0, 20%, 0);
visibility: visible
}
100% {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp
}
.m-scene .scene_element {
-webkit-animation-duration: .5s;
animation-duration: .5s;
-webkit-transition-timing-function: ease-in;
transition-timing-function: ease-in;
-webkit-animation-fill-mode: both;
animation-fill-mode: both
}
.m-scene .scene_element--fadein {
-webkit-animation-name: fadeIn;
animation-name: fadeIn
}
.m-scene .scene_element--fadeinup {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp
}
.m-scene .scene_element--fadeinright {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight
}
.m-scene .scene_element--delayed {
-webkit-animation-delay: .25s;
animation-delay: .25s
}
.m-scene.is-exiting .scene_element {
-webkit-animation-direction: alternate-reverse;
animation-direction: alternate-reverse
}
.m-scene.is-exiting .scene_element--delayed {
-webkit-animation-delay: 0s;
animation-delay: 0s
}
.m-scene.is-exiting .scene_element--noexiting {
-webkit-animation-direction: alternate-reverse;
animation-direction: alternate-reverse
}
.m-scene.is-exiting .scene_element--noanim {
-webkit-animation: none;
animation: none
}
@media screen and (min-width:768px) {
.m-scene .scene_element--fadeinright-wide {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight
}
}
.is-loading,
.is-loading a {
cursor: progress
}
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent
}
.slick-list {
position: relative;
display: block;
overflow: hidden;
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;
top: 0;
left: 0;
display: block
}
.slick-track:before,
.slick-track:after {
display: table;
content: ''
}
.slick-track:after {
clear: both
}
.slick-loading .slick-track {
visibility: hidden
}
.slick-slide {
display: none;
float: left;
height: 100%;
min-height: 1px
}
[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-loading .slick-list {
background: #fff url('../img/ajax-loader.gif') center center no-repeat
}
@font-face {
font-family: 'slick';
font-weight: normal;
font-style: normal;
src: url('../fonts/slick/slick.eot');
src: url('../fonts/slick/slick.eot?#iefix') format('embedded-opentype'), url('../fonts/slick/slick.woff') format('woff'), url('../fonts/slick/slick.ttf') format('truetype'), url('../fonts/slick/slick.svg#slick') format('svg')
}
.slick-prev,
.slick-next {
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
margin-top: -10px;
padding: 0;
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
color: transparent;
outline: none;
background: transparent
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
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;
opacity: .75;
color: white;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.slick-prev {
left: -25px
}
[dir='rtl'] .slick-prev {
right: -25px;
left: auto
}
.slick-prev:before {
content: '←'
}
[dir='rtl'] .slick-prev:before {
content: '→'
}
.slick-next {
right: -25px
}
[dir='rtl'] .slick-next {
right: auto;
left: -25px
}
.slick-next:before {
content: '→'
}
[dir='rtl'] .slick-next:before {
content: '←'
}
.slick-slider {
margin-bottom: 30px
}
.slick-dots {
position: absolute;
bottom: -45px;
display: block;
width: 100%;
padding: 0;
list-style: none;
text-align: center
}
.slick-dots li {
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer
}
.slick-dots li button {
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent
}
.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 {
font-family: 'slick';
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: black;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.slick-dots li.slick-active button:before {
opacity: .75;
color: black
}
.slick-prev,
.slick-next {
width: 60px;
height: 60px;
margin-top: -30px
}
.slick-prev {
left: -80px
}
.slick-next {
right: -80px
}
.slick-prev:before,
.slick-next:before {
font-family: '_dgicons';
font-size: 60px;
color: #1e1e1e
}
.slick-prev:before {
content: '\e607'
}
.slick-next:before {
content: '\e608'
}
.typed-cursor {
font-weight: 400;
opacity: 1;
-webkit-transform: scale(.5, 1.25);
-ms-transform: scale(.5, 1.25);
transform: scale(.5, 1.25);
display: inline-block;
-webkit-animation: blink .7s infinite;
animation: blink .7s infinite
}
@-webkit-keyframes blink {
0% {
opacity: 1
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
@keyframes blink {
0% {
opacity: 1
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
#page-home {
max-width: 100%
}
#page-home #aspot {
height: 100vh
}
#page-home #aspot .set-bg {
position: relative;
z-index: 1
}
#page-home #aspot .inner {
position: absolute;
top: 0
}
@media (max-width: 959px) {
#page-home #aspot h1 {
font-size: 80px;
line-height: 1
}
}
@media (max-width: 719px) {
#page-home #aspot h1 {
font-size: 70px;
line-height: 1
}
}
@media (max-width: 599px) {
#page-home #aspot h1 {
font-size: 60px;
line-height: 1
}
}
@media (max-width: 359px) {
#page-home #aspot h1 {
font-size: 40px
}
}
#fullpage {
z-index: 1
}
.is-exiting:not(.is-zspotting):not(.is-projecting) #fullpage {
opacity: 0;
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
#fullpage .section .inner {
width: 100%;
height: 100%
}
#fullpage .section.proj .inner .container {
padding-top: 13.5%
}
@media (max-width: 959px) {
#fullpage .section.proj .inner .container {
padding-top: 20%
}
}
@media (max-width: 719px) {
#fullpage .section.proj .inner .container {
display: table;
width: 100%;
height: 100%;
padding-left: 0;
padding-right: 0;
padding-top: 0;
padding-bottom: 13.5%
}
#fullpage .section.proj .inner .container>* {
display: table-cell;
vertical-align: middle
}
}
#fullpage .section.scroll .inner {
position: static;
overflow-y: scroll
}
#fullpage .bgimg {
width: 100%;
height: 100%;
position: absolute
}
#fullpage .bgimg.bg-cover {
background-repeat: no-repeat;
background-position: center center;
background-size: cover
}
#fullpage .bgimg::before {
content: '';
background: #fff;
position: absolute;
width: 100%;
height: 100%;
display: block;
opacity: 0;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
.is-exiting #fullpage .bgimg:before,
#fullpage .bgimg.is--hovered:before {
opacity: 0;
z-index: 0
}
#fullpage .proj--title {
position: relative;
-webkit-transition: -webkit-transform .4s ease-in-out, opacity .4s ease-in-out;
transition: transform .4s ease-in-out, opacity .4s ease-in-out
}
#fullpage .proj--title h2 {
font-size: 130px;
line-height: 100px;
font-weight: 600;
letter-spacing: -0.025em;
display: inline;
margin: 0
}
@media (max-width: 959px) {
#fullpage .proj--title h2 {
font-size: 90px;
line-height: 80px
}
}
@media (max-width: 719px) {
#fullpage .proj--title h2 {
font-size: 60px;
line-height: 1
}
}
@media (max-width: 599px) {
#fullpage .proj--title h2 {
font-size: 50px
}
}
#fullpage .proj--title h2 a {
color: #fff;
padding: 0;
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out
}
#fullpage .proj--title h2:hover a {
color: #1e1e1e
}
#fullpage .proj--title h3 {
color: #1e1e1e;
font-size: 16px;
font-weight: 500;
letter-spacing: .025rem;
text-transform: uppercase;
display: block;
position: absolute;
top: -25px;
left: .4rem;
margin: 0;
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out
}
#fullpage .proj--title h2:hover+h3 {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
-webkit-transition: all .25s ease-in-out;
transition: all .25s ease-in-out
}
.is-exiting #fullpage .proj--title {
opacity: 0
}
.is-exiting #fullpage .proj--title h2 a {
color: #1e1e1e
}
.is-exiting #fullpage .proj--title h2+h3 {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
-webkit-transition: all .25s ease-in-out;
transition: all .25s ease-in-out
}
#fullpage #tagline .inner {
position: relative;
padding-bottom: 4rem
}
@media (max-width: 719px) {
#fullpage #tagline .inner {
padding-bottom: 2rem
}
}
#fullpage #tagline .inner h2 {
font-size: 3.333333rem
}
@media (max-width: 719px) {
#fullpage #tagline .inner h2 {
font-size: 2.75rem
}
}
@media (max-width: 359px) {
#fullpage #tagline .inner h2 {
font-size: 2.25rem
}
}
@media (max-width: 719px) {
#fullpage #tagline .inner p {
font-size: 15px
}
}
#fullpage #tagline .inner .heart {
padding: 25px;
margin-bottom: 45px;
border-radius: 50%;
background: #ffbc2e;
display: inline-block
}
@media (max-width: 719px) {
#fullpage #tagline .inner .heart {
padding: 20px;
margin-bottom: 30px
}
}
#fullpage #tagline .inner .heart .heart-inner {
width: 120px;
height: 120px;
background: url('../img/ui/graphic-heart.png') no-repeat center center;
background-size: contain;
opacity: .8;
-webkit-animation: pulsate 1.25s ease-out;
animation: pulsate 1.25s ease-out;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}
@media (max-width: 719px) {
#fullpage #tagline .inner .heart .heart-inner {
width: 60px;
height: 60px
}
}
#fullpage #ending .inner {
height: -webkit-calc(100% - 320px);
height: calc(100% - 320px)
}
#fullpage #zspot:before {
content: none
}
#fullpage #zspot .inner {
position: relative;
padding-bottom: 380px
}
#fullpage #zspot .cta-wrap {
width: 100%;
height: 100%;
background: #fff
}
#fullpage #zspot .cta-wrap .cta {
padding-top: 0;
padding-bottom: 0;
display: table
}
#fullpage #zspot .cta-wrap .cta h4 {
display: table-cell;
vertical-align: middle
}
.fp-viewing-5 #fp-nav {
opacity: 0;
pointer-events: none
}
@-webkit-keyframes pulsate {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
40% {
-webkit-transform: scale(1.01);
transform: scale(1.01)
}
50% {
-webkit-transform: scale(.98);
transform: scale(.98)
}
60% {
-webkit-transform: scale(1.01);
transform: scale(1.01)
}
100% {
-webkit-transform: scale(1);
transform: scale(1)
}
}
@keyframes pulsate {
0% {
-webkit-transform: scale(1);
transform: scale(1)
}
40% {
-webkit-transform: scale(1.01);
transform: scale(1.01)
}
50% {
-webkit-transform: scale(.98);
transform: scale(.98)
}
60% {
-webkit-transform: scale(1.01);
transform: scale(1.01)
}
100% {
-webkit-transform: scale(1);
transform: scale(1)
}
}
.not-projecting #projects {
opacity: 0;
-webkit-transition: opacity .5s ease-in-out;
transition: opacity .5s ease-in-out
}
#projects #bg-imgs>div {
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
position: fixed !important;
width: 100%;
height: 100%;
opacity: 0;
visibility: hidden;
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out
}
#projects #bg-imgs>div.is--active {
opacity: 1 !important;
visibility: visible
}
#projects #bg-imgs>div.b-lazy.bg {
background-size: cover
}
#projects #project-list {
-webkit-transition: all .7s ease-out;
transition: all .7s ease-out
}
#projects #project-list nav {
margin-right: auto;
margin-left: auto;
padding-left: 25px;
padding-right: 25px
}
@media (min-width: 600px) {
#projects #project-list nav {
width: 600px
}
}
@media (min-width: 720px) {
#projects #project-list nav {
width: 720px
}
}
@media (min-width: 960px) {
#projects #project-list nav {
width: 960px
}
}
#projects #project-list nav {
height: 100vh;
display: table
}
#projects #project-list nav ul {
padding: 90px 0 90px;
display: table-cell;
vertical-align: middle;
width: 100%
}
@media (max-width: 719px) {
#projects #project-list nav ul {
padding: 106px 0 60px
}
}
#projects #project-list nav ul li {
opacity: 0;
-webkit-transform: translateY(100%);
-ms-transform: translateY(100%);
transform: translateY(100%);
-webkit-transition: -webkit-transform .25s ease-in, opacity .5s;
transition: transform .25s ease-in, opacity .5s
}
.is-loaded #projects #project-list nav ul li,
.is-default #projects #project-list nav ul li {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
-webkit-transition: -webkit-transform .5s, opacity .4s;
transition: transform .5s, opacity .4s
}
#projects #project-list nav ul li:nth-child(1) {
-webkit-transition-delay: .45s;
transition-delay: .45s;
-webkit-transition-duration: .125s;
transition-duration: .125s
}
.is-loaded #projects #project-list nav ul li:nth-child(1),
.is-default #projects #project-list nav ul li:nth-child(1) {
-webkit-transition-delay: .15s;
transition-delay: .15s;
-webkit-transition-duration: .25s;
transition-duration: .25s
}
#projects #project-list nav ul li:nth-child(2) {
-webkit-transition-delay: .4s;
transition-delay: .4s;
-webkit-transition-duration: .15s;
transition-duration: .15s
}
.is-loaded #projects #project-list nav ul li:nth-child(2),
.is-default #projects #project-list nav ul li:nth-child(2) {
-webkit-transition-delay: .2s;
transition-delay: .2s;
-webkit-transition-duration: .3s;
transition-duration: .3s
}
#projects #project-list nav ul li:nth-child(3) {
-webkit-transition-delay: .35s;
transition-delay: .35s;
-webkit-transition-duration: .175s;
transition-duration: .175s
}
.is-loaded #projects #project-list nav ul li:nth-child(3),
.is-default #projects #project-list nav ul li:nth-child(3) {
-webkit-transition-delay: .25s;
transition-delay: .25s;
-webkit-transition-duration: .35s;
transition-duration: .35s
}
#projects #project-list nav ul li:nth-child(4) {
-webkit-transition-delay: .3s;
transition-delay: .3s;
-webkit-transition-duration: .2s;
transition-duration: .2s
}
.is-loaded #projects #project-list nav ul li:nth-child(4),
.is-default #projects #project-list nav ul li:nth-child(4) {
-webkit-transition-delay: .3s;
transition-delay: .3s;
-webkit-transition-duration: .4s;
transition-duration: .4s
}
#projects #project-list nav ul li:nth-child(5) {
-webkit-transition-delay: .25s;
transition-delay: .25s;
-webkit-transition-duration: .225s;
transition-duration: .225s
}
.is-loaded #projects #project-list nav ul li:nth-child(5),
.is-default #projects #project-list nav ul li:nth-child(5) {
-webkit-transition-delay: .35s;
transition-delay: .35s;
-webkit-transition-duration: .45s;
transition-duration: .45s
}
#projects #project-list nav ul li:nth-child(6) {
-webkit-transition-delay: .2s;
transition-delay: .2s;
-webkit-transition-duration: .25s;
transition-duration: .25s
}
.is-loaded #projects #project-list nav ul li:nth-child(6),
.is-default #projects #project-list nav ul li:nth-child(6) {
-webkit-transition-delay: .4s;
transition-delay: .4s;
-webkit-transition-duration: .5s;
transition-duration: .5s
}
#projects #project-list nav ul li:nth-child(7) {
-webkit-transition-delay: .15s;
transition-delay: .15s;
-webkit-transition-duration: .275s;
transition-duration: .275s
}
.is-loaded #projects #project-list nav ul li:nth-child(7),
.is-default #projects #project-list nav ul li:nth-child(7) {
-webkit-transition-delay: .45s;
transition-delay: .45s;
-webkit-transition-duration: .55s;
transition-duration: .55s
}
#projects #project-list nav ul li:nth-child(8) {
-webkit-transition-delay: .1s;
transition-delay: .1s;
-webkit-transition-duration: .3s;
transition-duration: .3s
}
.is-loaded #projects #project-list nav ul li:nth-child(8),
.is-default #projects #project-list nav ul li:nth-child(8) {
-webkit-transition-delay: .5s;
transition-delay: .5s;
-webkit-transition-duration: .6s;
transition-duration: .6s
}
#projects #project-list nav ul li:nth-child(9) {
-webkit-transition-delay: .05s;
transition-delay: .05s;
-webkit-transition-duration: .325s;
transition-duration: .325s
}
.is-loaded #projects #project-list nav ul li:nth-child(9),
.is-default #projects #project-list nav ul li:nth-child(9) {
-webkit-transition-delay: .55s;
transition-delay: .55s;
-webkit-transition-duration: .65s;
transition-duration: .65s
}
#projects #project-list nav ul li:nth-child(10) {
-webkit-transition-delay: 0s;
transition-delay: 0s;
-webkit-transition-duration: .35s;
transition-duration: .35s
}
.is-loaded #projects #project-list nav ul li:nth-child(10),
.is-default #projects #project-list nav ul li:nth-child(10) {
-webkit-transition-delay: .6s;
transition-delay: .6s;
-webkit-transition-duration: .7s;
transition-duration: .7s
}
#projects #project-list nav ul li h2 {
font-size: 36px;
font-weight: 700;
line-height: 1;
margin: 0;
padding: .5rem 0;
display: inline-block
}
@media (min-width: 720px) {
#projects #project-list nav ul li h2 {
font-size: 48px
}
}
@media (min-width: 960px) {
#projects #project-list nav ul li h2 {
font-size: 60px;
letter-spacing: -0.1rem
}
}
@media (min-width: 1440px) {
#projects #project-list nav ul li h2 {
font-size: 80px
}
}
#projects #project-list nav ul li h2 a {
color: #fff;
-webkit-transition: all 300ms ease-in-out;
transition: all 300ms ease-in-out
}
#projects #project-list nav ul li h2.is--hovered a {
color: #1e1e1e
}
@media (max-width: 719px) {
.proj-content video::-webkit-media-controls {
display: none !important
}
}
main[data-page="page-project"] {
z-index: 3;
background: #fff;
margin-top: 70vh;
opacity: 0;
-webkit-transition: all .4s ease-out 0s;
transition: all .4s ease-out 0s
}
.is-loaded main[data-page="page-project"],
.is-default main[data-page="page-project"] {
opacity: 1;
-webkit-transition-delay: .2s;
transition-delay: .2s
}
.is-exiting main[data-page="page-project"] {
opacity: 0;
-webkit-transition: all .2s ease-out 0s;
transition: all .2s ease-out 0s
}
.is-exiting.is-zspotting main[data-page="page-project"] {
opacity: 1;
-webkit-transition-delay: 0s;
transition-delay: 0s
}
.is-exiting.is-zspotting main[data-page="page-project"]>* {
opacity: 0
}
main[data-page="page-project"] img,
main[data-page="page-project"] video {
max-width: 100%
}
#project {
padding-top: 10px;
max-width: 100%;
position: relative
}
@media (min-width: 1200px) {
#project {
padding-top: 20px
}
}
#project:before {
content: '';
display: block;
width: 100%;
height: 100vh;
left: 0;
top: 4px;
background: url(../img/ui/aspot-grad-b.png) repeat-x center bottom;
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0, #fff 100%), linear-gradient(to bottom, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.75) 100%);
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%), linear-gradient(to bottom, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.75) 100%);
position: absolute;
opacity: 0;
z-index: 2;
border-bottom: 2px solid #fff;
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: opacity .3s ease-out .3s;
transition: opacity .3s ease-out .3s
}
.is-default #project:before,
.is-loaded #project:before {
opacity: 1;
-webkit-transition-delay: 0s;
transition-delay: 0s
}
.is-exiting #project:before {
opacity: 0;
top: 0;
border-bottom: 0;
-webkit-transition: opacity .3s ease-out .3s;
transition: opacity .3s ease-out .3s
}
#aspot.proj-header {
width: 100%;
height: 100%;
position: fixed;
top: 0;
z-index: 1;
-webkit-filter: grayscale(0);
filter: grayscale(0);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
-webkit-transition: all .4s ease-out 0s;
transition: all .4s ease-out 0s
}
#aspot.proj-header.b-lazy.bg {
background-size: cover
}
.is-loaded #aspot.proj-header,
.is-default #aspot.proj-header {
-webkit-filter: grayscale(0);
filter: grayscale(0);
opacity: 1 !important;
-webkit-transform: translateY(0) !important;
-ms-transform: translateY(0) !important;
transform: translateY(0) !important;
height: 100vh;
-webkit-transition-delay: .2s;
transition-delay: .2s
}
.has-scrolled .is-loaded #aspot.proj-header,
.has-scrolled .is-default #aspot.proj-header {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
-webkit-transition-delay: 0s;
transition-delay: 0s
}
.in-mid .is-loaded #aspot.proj-header,
.in-mid .is-default #aspot.proj-header {
z-index: -1;
opacity: 0 !important
}
.is-exiting #aspot.proj-header {
-webkit-filter: grayscale(0);
filter: grayscale(0);
opacity: 1 !important;
-webkit-transform: translateY(0) !important;
-ms-transform: translateY(0) !important;
transform: translateY(0) !important;
height: 100vh;
-webkit-transition: all .2s ease-out 0s;
transition: all .2s ease-out 0s
}
.is-zspotting #aspot.proj-header {
opacity: 0 !important;
-webkit-transition-delay: 0s;
transition-delay: 0s
}
#proj-intro {
margin-bottom: 160px
}
@media (max-width: 719px) {
#proj-intro {
margin-bottom: 80px
}
}
#proj-intro h2 {
font-size: 60px;
line-height: 1
}
@media (max-width: 719px) {
#proj-intro h2 {
font-size: 40px
}
}
@media (max-width: 599px) {
#proj-intro h2 {
font-size: 32px
}
}
.is-loaded .fade-in-up:nth-child(1) {
-webkit-transition-delay: .9s;
transition-delay: .9s
}
.is-loaded .fade-in-up:nth-child(2) {
-webkit-transition-delay: 1.2s;
transition-delay: 1.2s
}
.proj-content {
width: 100%;
max-width: 100%;
position: relative
}
.proj-content h3 {
font-size: 50px
}
@media (max-width: 719px) {
.proj-content h3 {
font-size: 32px
}
}
.proj-content .b-lazy.bg {
width: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
-webkit-transition: all 1s cubic-bezier(.7, 0, .3, 1);
transition: all 1s cubic-bezier(.7, 0, .3, 1)
}
.launch-link {
color: #ffbc2e;
font-size: 14px;
line-height: 24px;
font-weight: 700;
letter-spacing: .075rem;
text-transform: uppercase;
display: inline-block
}
.launch-link i {
font-size: 18px;
line-height: 24px;
margin-left: 4px;
float: right;
-webkit-transition: all .15s ease;
transition: all .15s ease
}
.launch-link:hover {
color: #ffbc2e
}
.launch-link:hover i {
-webkit-transform: translateX(4px);
-ms-transform: translateX(4px);
transform: translateX(4px)
}
.cinemadisplay {
width: 100%;
height: -webkit-calc((100vw - 50px) * 0.76);
height: calc((100vw - 50px) * 0.76);
max-width: 100%;
margin: 0 auto;
padding-top: 4.1%;
padding-left: 4.1%;
position: relative;
background: url('../img/proj/devices/cinemadisplay-base.png') no-repeat center top;
background-size: 100%
}
@media (min-width: 720px) {
.cinemadisplay {
height: -webkit-calc((720px - 50px) * 0.76);
height: calc((720px - 50px) * 0.76)
}
}
@media (min-width: 960px) {
.cinemadisplay {
height: -webkit-calc((960px - 50px) * 0.76);
height: calc((960px - 50px) * 0.76)
}
}
@media (min-width: 1200px) {
.cinemadisplay {
height: -webkit-calc((1200px - 50px) * 0.76);
height: calc((1200px - 50px) * 0.76)
}
}
.cinemadisplay:before {
content: '';
display: block;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: url('../img/proj/devices/cinemadisplay-glare.png') no-repeat center center;
background-size: 100%;
position: absolute;
z-index: 2
}
.cinemadisplay img {
width: 91.66667%;
position: absolute;
margin: 0 auto;
display: block
}
.browser {
width: 100%;
border-radius: 4px;
overflow: hidden;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2)
}
@media (max-width: 719px) {
.browser {
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2)
}
}
.browser .controls {
list-style: none;
margin: 0;
height: 36px;
line-height: 36px;
background-color: #dedede;
padding: 0 15px
}
@media (max-width: 719px) {
.browser .controls {
height: 24px;
line-height: 22px;
padding: 0 10px
}
}
.browser .controls span {
height: 12px;
width: 12px;
border-radius: 50%;
display: inline-block;
margin-right: 8px;
box-sizing: border-box
}
@media (max-width: 719px) {
.browser .controls span {
height: 8px;
width: 8px;
margin-right: 6px
}
}
.browser .controls span:last-child {
margin-right: 0
}
.browser .controls span:nth-child(1) {
background: #f67a00
}
.browser .controls span:nth-child(2) {
background: #ebc71f
}
.browser .controls span:nth-child(3) {
background: #31bb37
}
.browser .window {
width: 100%;
overflow: hidden;
line-height: 0;
background: #dedede
}
.browser .window img,
.browser .window video {
width: 100%;
max-width: 100%;
height: auto;
display: block
}
.is-zspotting #project {
opacity: 0;
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
#project #the-results {
margin-bottom: 200px
}
@media (max-width: 719px) {
#project #the-results {
margin-bottom: 100px
}
}
#project #testimonial {
padding: 120px 0
}
@media (max-width: 719px) {
#project #testimonial {
padding: 60px 0
}
}
#project #testimonial blockquote {
color: #fff;
border: 0;
margin-top: 0;
margin-bottom: 0
}
#project #testimonial blockquote p {
font-family: 'Sentinel', serif;
font-weight: 300;
font-size: 18px;
font-style: italic;
line-height: 1.5;
padding: 0 0 0 8.33333333%;
position: relative
}
@media (max-width: 719px) {
#project #testimonial blockquote p {
font-size: 16px;
padding: 0 0 0 12.5%
}
}
#project #testimonial blockquote p:before {
font-size: 34px;
content: "\e904";
font-family: '_dgicons' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
position: absolute;
top: 0;
left: 0
}
#project #testimonial blockquote cite {
font-size: 24px;
font-weight: 700;
margin-top: 40px;
padding: 0 0 0 8.33333333%;
display: block
}
@media (max-width: 719px) {
#project #testimonial blockquote cite {
padding: 0 0 0 12.5%
}
}
#project #testimonial blockquote cite span {
color: #1e1e1e;
font-weight: 700;
text-transform: uppercase;
font-size: 12.5px;
line-height: 1;
letter-spacing: .05rem;
display: block
}
#project.single-project .cta-project .cta {
text-align: center;
width: 100%;
padding: 120px 0 80px
}
@media (max-width: 719px) {
#project.single-project .cta-project .cta {
padding: 80px 0 60px
}
}
#project.single-project .cta-project .cta h4 {
color: #999;
font-weight: 500;
font-size: 20px;
margin: 0 0 10px
}
@media (max-width: 719px) {
#project.single-project .cta-project .cta h4 {
font-size: 18px
}
}
#project.single-project .cta-project .cta h5 {
color: #1e1e1e;
font-size: 50px;
margin: 0 0 60px
}
@media (max-width: 719px) {
#project.single-project .cta-project .cta h5 {
font-size: 40px;
margin: 0 0 40px
}
}
[data-project="kilcullen-and-company"] #proj-content-1 {
margin-bottom: 20%
}
@media (max-width: 719px) {
[data-project="kilcullen-and-company"] #proj-content-1 {
margin-bottom: 20%
}
}
[data-project="kilcullen-and-company"] #proj-content-1 .container {
position: relative;
padding-bottom: 18.75%
}
[data-project="kilcullen-and-company"] #proj-content-1.proj-content .b-lazy.bg {
top: 35%;
background-position: center top;
background-size: cover
}
@media (max-width: 719px) {
[data-project="kilcullen-and-company"] #proj-content-1.proj-content .b-lazy.bg {
top: 0
}
}
[data-project="kilcullen-and-company"] #proj-content-1 .cinemadisplay+* {
padding-top: 50%
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos {
position: absolute;
left: 0;
right: 0;
bottom: -12%;
padding: 0 25px
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img {
width: 21.2%;
height: auto;
position: relative;
float: left;
display: block;
box-shadow: 0 3px 15px rgba(0, 0, 0, 0.25)
}
@media (max-width: 719px) {
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25)
}
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img:nth-child(1) {
margin-top: 14.78%
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img:nth-child(2) {
margin-left: -12.17%;
z-index: 1
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img:nth-child(3) {
margin-left: -2.5%;
margin-top: 8.69%
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img:nth-child(4) {
margin-left: 4.78%;
margin-top: -1.739%
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img:nth-child(5) {
margin-left: -13.05%;
margin-top: 16.52%
}
[data-project="kilcullen-and-company"] #proj-content-1 .team-photos img:nth-child(6) {
margin-left: -4.3%;
margin-top: 3.4%
}
[data-project="kilcullen-and-company"] #proj-content-2 {
padding: 200px 0
}
@media (max-width: 719px) {
[data-project="kilcullen-and-company"] #proj-content-2 {
padding: 100px 0
}
}
[data-project="kilcullen-and-company"] #proj-content-2 .browser {
margin: 30px auto
}
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices {
text-align: right;
position: relative;
width: 100%
}
@media (max-width: 719px) {
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices {
text-align: center
}
}
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices img {
margin: 0 60px;
-webkit-transition: all .4s ease-in 0s;
transition: all .4s ease-in 0s
}
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices img.b-loaded {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0)
}
@media (max-width: 719px) {
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices img {
margin: 0 auto
}
}
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices img+img {
position: absolute;
right: 0;
bottom: 60px;
margin: 0
}
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices img+img.b-loaded {
-webkit-transition-delay: .4s;
transition-delay: .4s
}
@media (max-width: 719px) {
[data-project="kilcullen-and-company"] #proj-content-3 .mobiledevices img+img {
width: 100%;
padding: 0 0 0 57%;
bottom: 40px;
right: 0
}
}
[data-project="kilcullen-and-company"] #proj-content-5 .b-lazy.bg {
background-position: center top;
background-size: cover
}
[data-project="kilcullen-and-company"] #proj-content-5 figure img {
display: block;
margin: 0 auto
}
.browser .window {
background-image: url('../img/proj/kilcullen-and-company/videoreplace.jpg');
background-repeat: no-repeat;
background-position: center top;
background-size: cover
}
.browser .window video {
opacity: 0\9
}
_:-ms-lang(x),
.browser .window video {
opacity: 0
}
[data-project="lamb-mcerlane"] #proj-content-5 {
background-repeat: no-repeat;
background-position: center bottom;
background-size: contain
}
[data-project="lamb-mcerlane"] #proj-content-5 .image-wrapper {
background: transparent
}
[data-project="lamb-mcerlane"] #proj-content-5 .image-wrapper img {
border-left: 1px solid #f2f2f2;
border-right: 1px solid #f2f2f2
}
[data-project="lamb-mcerlane"] #proj-content-5 .image-wrapper img:first-child {
border-top: 1px solid #f2f2f2
}
[data-project="avenue-365"] #screenshot {
margin-bottom: 140px
}
[data-project="avenue-365"] #screenshot .b-lazy.bg {
background-position: center bottom;
background-size: 100% auto
}
[data-project="avenue-365"] #screenshot figure {
position: relative
}
[data-project="avenue-365"] #screenshot figure img {
margin: 0 auto;
display: block
}
[data-project="avenue-365"] #screenshot figure img:first-child {
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5)
}
[data-project="avenue-365"] #screenshot figure img:nth-child(3) {
width: 40%;
position: absolute;
bottom: -3.5%;
right: 0
}
@media (max-width: 719px) {
[data-project="avenue-365"] #screenshot figure img:nth-child(3) {
width: 60%;
position: absolute;
bottom: -10%;
right: auto;
left: 50%;
margin-left: -30%
}
}
[data-project="avenue-365"] #branding {
padding-top: 120px
}
[data-project="avenue-365"] #branding figure {
padding: 30px 0
}
[data-project="avenue-365"] #branding figure:first-of-type {
margin-top: 100px;
border: 1px solid #e5e5e5;
border-width: 1px 0
}
[data-project="avenue-365"] #branding figure:last-child img:first-child {
float: left;
padding: 0 30px
}
[data-project="avenue-365"] #branding figure:last-child img:last-child {
float: right
}
[data-project="avenue-365"] #before-after {
background: #e6e6e6;
padding-top: 100px;
padding-bottom: 120px
}
@media (max-width: 719px) {
[data-project="avenue-365"] #before-after {
padding-top: 60px;
padding-bottom: 60px
}
}
[data-project="avenue-365"] #before-after figure {
margin-top: 40px;
position: relative
}
@media (max-width: 719px) {
[data-project="avenue-365"] #before-after figure {
margin-top: 0;
width: 140%;
margin-left: -20%;
max-width: none !important
}
}
[data-project="avenue-365"] #before-after figure .ba {
position: absolute;
top: 0;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%)
}
[data-project="avenue-365"] #before-after figure .ba.ba-before {
z-index: 2
}
[data-project="avenue-365"] #before-after figure .ba.ba-after {
z-index: 3;
opacity: 0
}
[data-project="avenue-365"] #before-after figure:hover .ba.ba-after {
opacity: 1
}
[data-project="avenue-365"] #mobile-shots {
padding-top: 180px
}
@media (max-width: 719px) {
[data-project="avenue-365"] #mobile-shots {
padding-top: 90px;
padding-bottom: 90px
}
}
[data-project="avenue-365"] #mobile-shots figure {
margin-top: 30px;
text-align: left;
position: relative;
width: 100%
}
@media (max-width: 959px) {
[data-project="avenue-365"] #mobile-shots figure {
text-align: center
}
}
@media (max-width: 959px) {
[data-project="avenue-365"] #mobile-shots figure img {
margin: 0 auto
}
}
[data-project="avenue-365"] #mobile-shots figure img+img {
position: absolute;
left: 35%;
bottom: 60px
}
@media (max-width: 959px) {
[data-project="avenue-365"] #mobile-shots figure img+img {
position: absolute;
width: 100%;
padding: 0 0 0 57%;
bottom: 40px;
right: 0;
left: auto
}
}
[data-project="avenue-365"] #tabbed-pages {
padding-top: 180px;
margin-bottom: 180px
}
[data-project="avenue-365"] #tabbed-pages h3 {
font-size: 25px
}
[data-project="avenue-365"] #tabbed-pages .tabs .tab-nav ol {
padding-right: 50px
}
[data-project="avenue-365"] #tabbed-pages .tabs .tab-nav ol li {
font-size: 15px;
font-weight: 500;
display: block;
border-top: 1px solid #ccc
}
[data-project="avenue-365"] #tabbed-pages .tabs .tab-nav ol li:last-child {
border-bottom: 1px solid #ccc
}
[data-project="avenue-365"] #tabbed-pages .tabs .tab-nav ol li.active {
font-weight: 700
}
[data-project="avenue-365"] #tabbed-pages .tabs .tab-nav ol li button {
width: 100%;
text-align: left;
border: 0;
border-radius: 0;
color: #1e1e1e;
background: transparent;
line-height: inherit;
padding: 12px 0;
display: block
}
[data-project="avenue-365"] #tabbed-pages .tabs .tab-list {
height: 0;
padding-bottom: 232.5581%
}
[data-project="platypus-home"] #proj-content-2 .container {
padding-left: 0;
padding-right: 0
}
[data-project="platypus-home"] #proj-content-2 figure {
width: 960px;
max-width: 100%;
margin: 0 auto
}
[data-project="platypus-home"] #proj-content-2 .slick-dots li {
margin: 0
}
[data-project="platypus-home"] #proj-content-2 .slick-dots li button:before {
font-size: 11px;
line-height: 22px;
opacity: 1;
color: #c6c6c6
}
[data-project="platypus-home"] #proj-content-2 .slick-dots li.slick-active button:before {
opacity: 1;
color: #930
}
[data-project="platypus-home"] #proj-content-1a .container,
[data-project="platypus-home"] #proj-content-1b .container,
[data-project="platypus-home"] #proj-content-3 .container {
padding-left: 0;
padding-right: 0
}
@media (max-width:600px) {
[data-project="platypus-home"] #proj-content-1a .container,
[data-project="platypus-home"] #proj-content-1b .container,
[data-project="platypus-home"] #proj-content-3 .container {
padding-left: 25px;
padding-right: 25px
}
}
main[data-page="page-articles"] {
z-index: 3;
padding-bottom: 0;
background: #fff;
margin-bottom: 500px
}
#articles article:before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
width: 100%;
height: 100%;
display: block;
background: #252b33;
opacity: .35
}
#articles article a {
color: #1e1e1e;
width: 100%;
height: 100%;
display: block;
position: relative;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out
}
#articles article a.b-lazy.bg {
opacity: 1
}
#articles article a:before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 1;
width: 100%;
height: 100%;
display: block;
background: #fff;
opacity: 1;
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.1);
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out
}
#articles article a:hover:before {
opacity: 0
}
#articles article a:hover p {
color: #fff
}
#articles article a:hover h1 {
color: #fff
}
#articles article a:hover h2 {
color: #fff
}
@media (min-width: 720px) {
#articles article a .article-title {
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out
}
#articles article a .article-subtitle {
opacity: 0;
position: relative;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out
}
#articles article a:hover .article-title {
opacity: 1;
top: 0;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
#articles article a:hover .article-subtitle {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
}
@media (min-width: 720px) {
#articles article.is-next a .article-title {
opacity: 1;
top: 0;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
#articles article.is-next a .article-subtitle {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
}
#articles article:first-child a:before {
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0)
}
#articles article:hover+article a:before {
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0)
}
#articles article .container {
height: 100%;
padding-top: 80px;
padding-bottom: 80px;
position: relative;
z-index: 1;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out
}
@media (max-width: 719px) {
#articles article .container {
padding-top: 60px;
padding-bottom: 60px
}
}
#articles article .container .row {
height: 100%
}
@media (min-width: 720px) {
#articles article .art-wrap {
height: 100%;
position: relative
}
#articles article.is-next .art-wrap {
height: auto
}
}
#articles article p {
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out
}
#articles article h1 {
font-size: 36px;
margin: 0;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out
}
@media (min-width: 720px) {
#articles article h1 {
font-size: 48px
}
}
@media (min-width: 1200px) {
#articles article h1 {
font-size: 60px;
letter-spacing: -0.1rem
}
}
#articles article h2 {
font-size: 18px;
line-height: 1.5;
font-weight: normal;
margin: 0;
margin-top: 18px;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out
}
@media (max-width: 719px) {
#articles article h2 {
display: none
}
}
#articles article:hover h1 {
color: #1e1e1e
}
#articles article:hover h2 {
color: #1e1e1e
}
#articles article.is-next a:before {
opacity: 0
}
#articles article.is-next p {
color: #fff
}
#articles article.is-next h1 {
color: #fff
}
#articles article.is-next h2 {
color: #fff
}
#articles article {
opacity: 0;
-webkit-transition: opacity .6s ease-in-out;
transition: opacity .6s ease-in-out
}
.is-default .is-ready#articles article {
opacity: 1
}
.is-loaded .is-ready#articles article {
opacity: 1
}
#articles .lp-placeholder article:first-child a:before {
box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.1)
}
#articles article {
position: relative;
min-height: 300px
}
#articles article.is-next {
-webkit-transition: height .3s linear, -webkit-transform .6s ease-in-out, opacity .2s 0s;
transition: height .3s linear, transform .6s ease-in-out, opacity .2s 0s
}
@media (max-width: 719px) {
#articles article {
min-height: auto
}
}
.is-exiting #articles article.is-next {
opacity: 1 !important;
height: 100vh !important
}
.is-exiting #articles article:not(.is-next) {
opacity: 0;
-webkit-transform: translateY(0) !important;
-ms-transform: translateY(0) !important;
transform: translateY(0) !important;
-webkit-transition: opacity .2s 0s;
transition: opacity .2s 0s
}
.is-exiting #articles article.is-next a:before {
opacity: 0
}
.is-exiting #articles article.is-next a h1 {
color: #fff
}
.load-post-spot {
text-align: center;
width: 100%;
height: 320px;
display: table
}
.load-post-spot a {
color: #1e1e1e;
font-size: 48px;
line-height: 1;
font-weight: 700;
display: table-cell;
vertical-align: middle;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
.load-post-spot a:hover {
background: #eee
}
.load-post-spot a.disabled {
color: #ccc;
cursor: default
}
.load-post-spot a.disabled:hover {
background: transparent
}
#page-articles #articles .lp-placeholder article {
opacity: 0;
-webkit-transform: translateY(100%);
-ms-transform: translateY(100%);
transform: translateY(100%);
-webkit-transition: all .5s 0s;
transition: all .5s 0s
}
#page-articles #articles .lp-placeholder.lp-loaded article {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
main[data-page="page-article"] {
z-index: 3;
background: #fff
}
#aspot.post-header {
width: 100%;
height: 100vh;
overflow: hidden;
position: relative;
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
.is-projecting #aspot.post-header,
.is-exiting #aspot.post-header {
opacity: 0
}
#aspot.post-header .container .row {
position: relative
}
#aspot.post-header.has-grad:after {
opacity: 0;
content: '';
position: absolute;
right: 0;
bottom: -1px;
left: 0;
height: 100%;
width: 100%;
display: block;
background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0, #fff 100%);
background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #fff 100%);
-webkit-transition: all .6s ease-out;
transition: all .6s ease-out
}
.is-loaded #aspot.post-header.has-grad:after,
.is-default #aspot.post-header.has-grad:after {
opacity: 1;
-webkit-transition-delay: .3s;
transition-delay: .3s
}
#aspot.post-header .bg-img {
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
position: fixed;
overflow: hidden;
width: 100%;
height: 100%;
-webkit-transition: all .6s ease-out;
transition: all .6s ease-out
}
#aspot.post-header .bg-img:before {
opacity: .35;
content: '';
z-index: 0;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
display: block;
background: #252b33;
-webkit-transition: all .5s ease-out;
transition: all .5s ease-out
}
.is-default #aspot.post-header .bg-img,
.is-loaded #aspot.post-header .bg-img {
opacity: 1;
-webkit-filter: grayscale(0);
filter: grayscale(0)
}
.has-scrolled .is-default #aspot.post-header .bg-img,
.has-scrolled .is-loaded #aspot.post-header .bg-img {
-webkit-filter: grayscale(100%);
filter: grayscale(100%)
}
#aspot.post-header .has-grad {
height: 100%
}
#aspot.post-header .has-grad .container {
padding-top: 56px;
padding-bottom: 56px;
position: relative;
-webkit-transition: all .6s ease-out .6s;
transition: all .6s ease-out .6s;
-webkit-transition: -webkit-transform .6s ease-out .6s, opacity .6s ease-out, top 0s;
transition: transform .6s ease-out .6s, opacity .6s ease-out, top 0s
}
.is-exiting #aspot.post-header .has-grad .container {
opacity: 0
}
#aspot.post-header h1 {
color: #fff;
font-size: 36px;
letter-spacing: 0;
line-height: 1;
margin: 0;
-webkit-transition: color .3s ease-out;
transition: color .3s ease-out
}
@media (min-width: 720px) {
#aspot.post-header h1 {
font-size: 48px
}
}
@media (min-width: 1200px) {
#aspot.post-header h1 {
font-size: 60px;
letter-spacing: -0.1rem
}
}
.is-default #aspot.post-header h1,
.is-loaded #aspot.post-header h1 {
color: #1e1e1e;
-webkit-transition-delay: .3s;
transition-delay: .3s
}
#aspot.post-header h2 {
color: #fff;
font-size: 18px;
line-height: 1.5;
font-weight: normal;
margin: 0;
margin-top: 18px;
-webkit-transition: color .3s ease-out, opacity .3s ease-out;
transition: color .3s ease-out, opacity .3s ease-out
}
@media (max-width: 719px) {
#aspot.post-header h2 {
display: none
}
}
.is-default #aspot.post-header h2,
.is-loaded #aspot.post-header h2 {
color: #1e1e1e;
-webkit-transition-delay: .3s;
transition-delay: .3s
}
#aspot.post-header .read-time {
font-size: 14px;
text-transform: uppercase;
letter-spacing: .05rem;
display: inline-block;
position: absolute;
left: 0;
bottom: 20vh;
opacity: 0;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: all 1s ease-in-out 0s;
transition: all 1s ease-in-out 0s
}
.is-loaded #aspot.post-header .read-time,
.is-default #aspot.post-header .read-time {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
-webkit-transition: all 1s ease-in-out .5s;
transition: all 1s ease-in-out .5s
}
.is-exiting #aspot.post-header .read-time {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
#aspot.post-header .read-time .wrap {
width: auto;
min-width: 120px;
min-height: 70px;
line-height: 1;
text-align: center;
position: relative;
display: inline-block
}
#aspot.post-header .read-time .wrap span {
color: #fff;
font-size: 11.5px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: .1rem;
display: inline-block;
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out
}
.is-default #aspot.post-header .read-time .wrap span,
.is-loaded #aspot.post-header .read-time .wrap span {
color: #1e1e1e;
-webkit-transition-delay: .3s;
transition-delay: .3s
}
#aspot.post-header .read-time .wrap .arrowdown {
color: #fff;
left: 50%;
bottom: 0;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out
}
.is-default #aspot.post-header .read-time .wrap .arrowdown,
.is-loaded #aspot.post-header .read-time .wrap .arrowdown {
color: #1e1e1e;
-webkit-transition-delay: .3s;
transition-delay: .3s
}
#aspot.post-header span {
color: #fff
}
.is-default #aspot.post-header span,
.is-loaded #aspot.post-header span {
color: #1e1e1e;
-webkit-transition-delay: .3s;
transition-delay: .3s
}
[data-page="page-article"] article.post {
padding: 60px 0;
-webkit-transition: all .6s ease-out;
transition: all .6s ease-out
}
@media (min-width: 600px) {
[data-page="page-article"] article.post {
padding: 90px 0
}
}
.is-exiting [data-page="page-article"] article.post {
opacity: 0
}
[data-page="page-article"] article.post .by-line {
font-size: 14px;
font-weight: 500;
color: #ffbc2e;
text-transform: uppercase;
letter-spacing: .05rem;
padding: 0 25px;
margin: 0 auto 60px;
text-align: left;
display: block;
opacity: 0;
-webkit-transition: opacity .6s ease-out 1s;
transition: opacity .6s ease-out 1s;
margin-left: auto;
margin-right: auto
}
.is-exiting [data-page="page-article"] article.post .by-line {
-webkit-transition-duration: .3s;
transition-duration: .3s;
-webkit-transition-delay: 0s;
transition-delay: 0s
}
.is-loaded [data-page="page-article"] article.post .by-line,
.is-default [data-page="page-article"] article.post .by-line {
opacity: 1
}
@media (min-width:600px) {
[data-page="page-article"] article.post .by-line {
max-width: 600px
}
}
@media (min-width:960px) {
[data-page="page-article"] article.post .by-line {
max-width: 640px
}
}
@media (min-width:1200px) {
[data-page="page-article"] article.post .by-line {
max-width: 800px
}
}
[data-page="page-article"] article.post .by-line img {
width: auto;
height: 100%;
display: block;
float: left
}
[data-page="page-article"] article.post .by-line p {
text-transform: uppercase;
font-size: 14px;
font-weight: 700;
line-height: 21px;
letter-spacing: .1rem;
position: relative;
top: 100%;
float: left;
margin: 0;
margin-left: 20px;
margin-top: -21px
}
main[data-page="page-about-us"] {
z-index: 3;
background: #fff;
margin-bottom: 0;
position: relative
}
#page-about-us #aspot {
height: 100vh
}
#page-about-us #aspot .set-bg {
background-position: 0 top;
background-size: cover
}
@media (max-width: 959px) {
#page-about-us #aspot .set-bg {
background-position: 30% top
}
}
#page-about-us #aspot h1 {
min-height: 270px;
margin-top: 90px
}
@media (max-width: 719px) {
#page-about-us #aspot h1 {
min-height: 210px;
margin-top: 70px
}
}
@media (max-width: 599px) {
#page-about-us #aspot h1 {
min-height: 150px;
margin-top: 50px
}
}
@media (max-width: 359px) {
#page-about-us #aspot h1 {
min-height: 120px;
margin-top: 40px
}
}
#page-about-us #aspot h1 div {
display: block
}
#page-about-us #aspot .inner .arrowdown {
bottom: -webkit-calc(-25vh - -90px);
bottom: calc(-25vh - -90px)
}
@media (max-width: 719px) {
#page-about-us #aspot .inner .arrowdown {
bottom: -webkit-calc(-25vh - -70px);
bottom: calc(-25vh - -70px)
}
}
@media (max-width: 599px) {
#page-about-us #aspot .inner .arrowdown {
bottom: -webkit-calc(-25vh - -50px);
bottom: calc(-25vh - -50px)
}
}
@media (max-width: 359px) {
#page-about-us #aspot .inner .arrowdown {
bottom: -webkit-calc(-25vh - -40px);
bottom: calc(-25vh - -40px)
}
}
#page-about-us #intro {
overflow: hidden;
position: relative
}
#page-about-us #intro .container {
padding-top: 6rem;
padding-bottom: 12rem;
position: relative
}
@media (max-width: 719px) {
#page-about-us #intro .container {
padding-top: 3rem;
padding-bottom: 6rem
}
}
#page-about-us #intro h2 {
font-size: 3.333333rem
}
@media (max-width: 719px) {
#page-about-us #intro h2 {
font-size: 2.75rem
}
}
#page-about-us #intro .lungs {
padding: 35px;
margin-bottom: 60px;
border-radius: 50%;
background: #ffbc2e;
display: inline-block
}
@media (max-width: 719px) {
#page-about-us #intro .lungs {
padding: 20px;
margin-bottom: 40px
}
}
#page-about-us #intro .lungs .lungs-inner {
width: 100px;
height: 100px;
position: relative;
top: -5px;
background: url('../img/ui/graphic-lungs.png') no-repeat center center;
background-size: contain;
-webkit-animation: breathe 1.25s ease-out;
animation: breathe 1.25s ease-out;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}
@media (max-width: 719px) {
#page-about-us #intro .lungs .lungs-inner {
width: 60px;
height: 60px
}
}
@-webkit-keyframes breathe {
0% {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
animation-timing-function: cubic-bezier(.175, .885, .32, 1)
}
70% {
-webkit-transform: scaleX(1.04);
transform: scaleX(1.04)
}
100% {
-webkit-transform: scaleX(1);
transform: scaleX(1)
}
}
@keyframes breathe {
0% {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
animation-timing-function: cubic-bezier(.175, .885, .32, 1)
}
70% {
-webkit-transform: scaleX(1.04);
transform: scaleX(1.04)
}
100% {
-webkit-transform: scaleX(1);
transform: scaleX(1)
}
}
#page-about-us .plax {
background-position: 50% 0;
background-size: auto 120%;
background-repeat: no-repeat;
height: 0;
padding-bottom: 100%;
position: relative;
-webkit-transition: none !important;
transition: none !important
}
@media (min-width: 720px) {
.no-touchevents #page-about-us .plax {
height: 0;
padding-bottom: 80%;
background-attachment: fixed;
background-position: 50% 50%;
background-size: cover
}
}
@media (min-width: 960px) {
.no-touchevents #page-about-us .plax {
height: 0;
padding-bottom: 60%
}
}
@media (min-width: 1200px) {
.no-touchevents #page-about-us .plax {
height: 0;
padding-bottom: 40%
}
}
.touchevents #page-about-us .plax {
padding-bottom: 100%;
background-position: 50% 50% !important;
background-size: cover
}
#page-about-us #services .container {
padding-top: 8rem;
padding-bottom: 8rem
}
@media (max-width: 719px) {
#page-about-us #services .container {
padding-top: 4rem;
padding-bottom: 4rem
}
}
@media (max-width: 719px) {
#page-about-us #services h2 {
font-size: 2.75rem
}
}
#page-about-us #services .capability {
margin-top: 52px;
margin-bottom: 80px
}
@media (max-width: 719px) {
#page-about-us #services .capability {
margin-bottom: 0
}
}
#page-about-us #services .capability:last-of-type {
margin-bottom: 0
}
#page-about-us #services .capability h3 {
margin-bottom: .5rem
}
#page-about-us #services .capability h3+p {
margin-top: .5rem;
margin-bottom: .5rem
}
#page-about-us #services .capability h3+p small {
color: #646464;
display: inline-block
}
#page-about-us #services .capability ul {
font-weight: 500
}
#page-about-us #services .capability ul li {
margin-top: .5rem
}
@media (max-width: 719px) {
#page-about-us #services .sticker {
position: static !important
}
}
#page-about-us #team {
padding: 5rem 0 6.5rem;
position: relative;
overflow: hidden
}
@media (max-width: 719px) {
#page-about-us #team {
padding: 2rem 0 4rem
}
}
@media (max-width: 959px) {
#page-about-us #team .intro {
padding: 0 50px 50px
}
}
@media (max-width: 599px) {
#page-about-us #team .intro {
padding: 0 25px 25px
}
}
#page-about-us #team .intro h2 {
font-size: 2.8em
}
@media (max-width: 959px) {
#page-about-us #team .intro h2 {
font-size: 2.5rem
}
}
@media (max-width: 599px) {
#page-about-us #team .intro h2 {
font-size: 2.2rem
}
}
#page-about-us #team .intro p {
font-size: 17.5px
}
@media (max-width: 959px) {
#page-about-us #team .intro p {
font-size: 16px
}
}
@media (max-width: 599px) {
#page-about-us #team .intro p {
font-size: 15px;
text-align: center
}
}
#page-about-us #team .intro p strong {
text-transform: uppercase
}
#page-about-us #team #team-list {
padding-top: 5.5rem
}
@media (max-width: 959px) {
#page-about-us #team #team-list {
display: none
}
}
#page-about-us #team #team-list ul {
-webkit-columns: 2;
-moz-columns: 2;
columns: 2;
-webkit-column-gap: 150px;
-moz-column-gap: 150px;
column-gap: 150px
}
#page-about-us #team #team-list ul li {
line-height: 3;
padding: 0 0 0 60px
}
.no-csscolumns #page-about-us #team #team-list ul li {
line-height: 3;
width: 40%;
padding: 0 0 0 90px;
float: left
}
.no-csscolumns #page-about-us #team #team-list ul li:nth-child(2n) {
width: 40%;
padding: 0 0 0 45px;
float: right
}
#page-about-us #team #team-list ul li h3 {
line-height: 1;
font-size: 40px;
font-weight: 700;
margin: 0;
display: inline-block
}
#page-about-us #team #team-list ul li h3 a {
color: #1e1e1e;
display: inline-block;
-webkit-transition: all 0s ease-out;
transition: all 0s ease-out
}
#page-about-us #team #team-list ul li h3.is--hovered a {
color: #fff
}
#page-about-us #team #team-imgs {
background: #fff;
position: absolute;
width: 100%;
height: 100%;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -1
}
@media (max-width: 959px) {
#page-about-us #team #team-imgs {
display: none
}
}
#page-about-us #team #team-imgs [data-team-bg] {
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
opacity: 0;
-webkit-transition: all .3s ease-out;
transition: all .3s ease-out
}
#page-about-us #team #team-imgs [data-team-bg].is--active {
opacity: .375
}
#page-about-us #team #team-imgs [data-team-bg].bg-def.is--active {
opacity: 1
}
#page-about-us #beliefs .container {
padding-top: 10rem;
padding-bottom: 10rem
}
@media (max-width: 719px) {
#page-about-us #beliefs .container {
padding-top: 6rem;
padding-bottom: 6rem
}
}
@media (max-width: 599px) {
#page-about-us #beliefs .container {
padding-top: 2rem;
padding-bottom: 6rem
}
}
#page-about-us #beliefs h2 {
font-size: 3.333333rem;
margin-bottom: 4rem
}
@media (max-width: 719px) {
#page-about-us #beliefs h2 {
font-size: 2.75rem
}
}
#page-about-us #beliefs .tabs .tab-list {
width: 100%;
position: relative
}
#page-about-us #beliefs .tabs .tab-list .tab {
width: 100%;
-webkit-transition: all .6s ease-in-out;
transition: all .6s ease-in-out
}
#page-about-us #beliefs .tabs .tab-list .tab .number {
width: 15%;
height: 100%;
float: left;
display: table;
position: relative
}
@media (max-width: 599px) {
#page-about-us #beliefs .tabs .tab-list .tab .number {
width: 10%;
height: auto
}
}
#page-about-us #beliefs .tabs .tab-list .tab .number h3 {
color: #ffbc2e;
font-family: 'Sentinel', serif;
font-size: 100px;
line-height: 84px;
font-weight: 500;
text-align: left;
margin: 0
}
@media (max-width: 719px) {
#page-about-us #beliefs .tabs .tab-list .tab .number h3 {
font-size: 80px;
line-height: 64px
}
}
@media (max-width: 599px) {
#page-about-us #beliefs .tabs .tab-list .tab .number h3 {
font-size: 50px;
line-height: 48px;
position: relative;
top: -3px
}
}
#page-about-us #beliefs .tabs .tab-list .tab .quote {
width: 85%;
padding-left: 85px;
float: left;
position: relative
}
@media (max-width: 719px) {
#page-about-us #beliefs .tabs .tab-list .tab .quote {
padding-left: 20px
}
}
@media (max-width: 599px) {
#page-about-us #beliefs .tabs .tab-list .tab .quote {
width: 88%
}
}
#page-about-us #beliefs .tabs .tab-list .tab .quote:before {
content: '';
position: absolute;
top: 0;
left: -10px;
width: 2px;
height: 100%;
display: block;
background: #ddd
}
@media (max-width: 719px) {
#page-about-us #beliefs .tabs .tab-list .tab .quote:before {
display: none
}
}
#page-about-us #beliefs .tabs .tab-list .tab .quote h4 {
font-size: 22px;
font-weight: 700;
text-transform: none;
margin: 0 0 1rem
}
#page-about-us #beliefs .tabs .tab-list .tab .quote p {
font-family: 'aktiv-grotesk', sans-serif;
font-size: 16px;
line-height: 1.5;
margin: 0
}
@media (max-width: 719px) {
#page-about-us #beliefs .tabs .tab-list .tab .quote p {
font-size: 14px
}
}
#page-about-us #beliefs .tabs .tab-nav {
margin-top: 3rem;
text-align: right
}
@media (max-width: 719px) {
#page-about-us #beliefs .tabs .tab-nav {
margin-top: 15px;
text-align: right
}
}
#page-about-us #beliefs .tabs .tab-nav ol {
width: 75%;
text-align: left;
padding-left: 20px;
display: inline-block
}
@media (max-width: 719px) {
#page-about-us #beliefs .tabs .tab-nav ol {
width: 100%;
padding-left: 0;
text-align: center
}
}
#page-about-us #beliefs .tabs .tab-nav ol li {
display: inline-block;
margin: 1rem 24px 0
}
@media (max-width: 719px) {
#page-about-us #beliefs .tabs .tab-nav ol li {
margin: 15px 6px 0
}
}
#page-about-us #beliefs .tabs .tab-nav ol li:first-child {
margin-left: 0
}
#page-about-us #beliefs .tabs .tab-nav ol li:last-child {
margin-right: 0
}
#page-about-us #beliefs .tabs .tab-nav ol li button {
color: #ccc;
font-family: 'Sentinel', serif;
font-size: 22px;
width: 36px;
height: 36px;
line-height: 36px;
background: transparent;
border-radius: 50%;
padding: 0;
margin: 0;
display: block;
-webkit-transition: all 0s ease-out;
transition: all 0s ease-out
}
#page-about-us #beliefs .tabs .tab-nav ol li button:hover {
color: #fff;
background: rgba(30, 30, 30, 0.2)
}
#page-about-us #beliefs .tabs .tab-nav ol li.active button {
color: #fff;
background: #1e1e1e
}
#page-about-us #collage .b-lazy {
padding-bottom: 25%;
height: 0;
background-repeat: no-repeat;
background-size: cover;
background-position: center center
}
@media (max-width: 599px) {
#page-about-us #collage .b-lazy {
padding-bottom: 133.3333%
}
}
#team {
padding: 6rem 0 6rem;
position: relative;
overflow: hidden
}
@media (min-width: 960px) {
#team #team-bios {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
overflow: hidden;
pointer-events: none
}
}
@media (min-width: 960px) {
#team #team-bios .bio {
color: #fff;
padding: 90px 60px;
position: absolute;
z-index: 5;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
background: url('../img/ui/teambg-a.jpg') no-repeat center center;
background-size: cover;
visibility: hidden;
pointer-events: none;
-webkit-transform: scale(1.15);
-ms-transform: scale(1.15);
transform: scale(1.15);
-webkit-transition: opacity .35s, visibility .35s, -webkit-transform .35s .35s;
transition: opacity .35s, visibility .35s, transform .35s .35s
}
#team #team-bios .bio:nth-child(2n) {
background: url('../img/ui/teambg-b.jpg') no-repeat center center;
background-size: cover
}
#team #team-bios .bio [data-close="bio"] {
display: block;
width: 106px;
height: 106px;
background: url('../img/ui/cursor-close.png') no-repeat center center;
position: absolute;
top: 0;
right: 0;
padding: 0
}
}
@media (max-width: 959px) {
#team #team-bios .bio {
color: #fff;
position: relative;
padding: 90px 64px;
z-index: 2;
height: 400px;
opacity: 1;
background: url('../img/ui/teambg-a.jpg') no-repeat center center;
background-size: cover
}
#team #team-bios .bio:nth-child(2n) {
background: url('../img/ui/teambg-b.jpg') no-repeat center center;
background-size: cover
}
#team #team-bios .bio [data-close="bio"] {
display: none
}
}
@media (max-width: 719px) {
#team #team-bios .bio {
padding: 160px 64px;
background-size: auto 100%
}
#team #team-bios .bio:nth-child(2n) {
background-size: auto 100%
}
}
@media (max-width: 599px) {
#team #team-bios .bio {
height: 100vw;
padding: 35% 0 0
}
}
@media (max-width: 359px) {
#team #team-bios .bio {
padding: 32.5% 0 0
}
}
@media (min-width: 960px) {
#team #team-bios .bio.bio-active {
opacity: 1;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-transition: all .65s cubic-bezier(.7, 0, .3, 1);
transition: all .65s cubic-bezier(.7, 0, .3, 1);
visibility: visible;
pointer-events: auto
}
}
#team #team-bios .bio .bio-img {
position: absolute;
right: 0;
bottom: 0;
width: auto;
max-height: 100%
}
@media (max-width: 1199px) {
#team #team-bios .bio .bio-img {
-webkit-transform: translateX(15%);
-ms-transform: translateX(15%);
transform: translateX(15%)
}
}
@media (max-width: 959px) {
#team #team-bios .bio .bio-img {
background-size: auto 100%;
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0)
}
}
@media (max-width: 599px) {
#team #team-bios .bio .bio-img {
-webkit-transform: translateX(15%);
-ms-transform: translateX(15%);
transform: translateX(15%)
}
}
@media (max-width: 359px) {
#team #team-bios .bio .bio-img {
-webkit-transform: translateX(15%);
-ms-transform: translateX(15%);
transform: translateX(15%)
}
}
@media (max-width: 599px) {
#team #team-bios .bio[data-team-bio="jordan-muir"] .bio-img,
#team #team-bios .bio[data-team-bio="andi-archer"] .bio-img,
#team #team-bios .bio[data-team-bio="beefy"] .bio-img {
-webkit-transform: translateX(20%);
-ms-transform: translateX(20%);
transform: translateX(20%)
}
}
@media (max-width: 359px) {
#team #team-bios .bio[data-team-bio="jordan-muir"] .bio-img {
-webkit-transform: translateX(25%);
-ms-transform: translateX(25%);
transform: translateX(25%)
}
}
@media (max-width: 599px) {
#team #team-bios .bio[data-team-bio="gunther"] .bio-img,
#team #team-bios .bio[data-team-bio="beau"] .bio-img {
-webkit-transform: translateX(5%);
-ms-transform: translateX(5%);
transform: translateX(5%)
}
}
@media (max-width: 359px) {
#team #team-bios .bio[data-team-bio="gunther"] .bio-img,
#team #team-bios .bio[data-team-bio="beau"] .bio-img {
-webkit-transform: translateX(10%);
-ms-transform: translateX(10%);
transform: translateX(10%)
}
}
#team #team-bios .bio h2 {
color: #000;
font-size: 50px;
letter-spacing: -0.05rem;
margin: 0 0 50px
}
@media (min-width: 960px) {
#team #team-bios .bio h2 {
opacity: 0;
-webkit-transform: translateY(40px);
-ms-transform: translateY(40px);
transform: translateY(40px);
-webkit-transition: all .5s .6s;
transition: all .5s .6s
}
}
@media (max-width: 959px) {
#team #team-bios .bio h2 {
color: #fff
}
}
#team #team-bios .bio h3 {
color: #fff;
text-transform: uppercase;
font-size: 14px;
line-height: 1.25;
font-weight: 500;
letter-spacing: .05rem;
margin: 0;
margin-bottom: .25rem;
text-indent: 3px
}
@media (min-width: 960px) {
#team #team-bios .bio h3 {
opacity: 0;
-webkit-transform: translateY(40px);
-ms-transform: translateY(40px);
transform: translateY(40px);
-webkit-transition: all .5s .5s;
transition: all .5s .5s
}
}
@media (max-width: 959px) {
#team #team-bios .bio h3 {
color: #1e1e1e;
font-size: 12px;
font-weight: 700;
letter-spacing: 0;
white-space: nowrap
}
}
@media (min-width: 960px) {
#team #team-bios .bio .bio-copy {
opacity: 0;
-webkit-transform: translateY(40px);
-ms-transform: translateY(40px);
transform: translateY(40px);
-webkit-transition: all .5s .7s;
transition: all .5s .7s
}
}
@media (max-width: 959px) {
#team #team-bios .bio .bio-copy {
display: none
}
}
#team #team-bios .bio p {
font-size: 17px;
line-height: 1.5;
margin: 1.5rem 0
}
#team #team-bios .bio p:first-child {
margin-top: 0
}
#team #team-bios .bio p:last-child {
margin-bottom: 0
}
#team #team-bios .bio p a {
color: #fff;
background-image: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.5) 0);
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, 0.5) 0);
background-repeat: repeat-x;
background-size: 2px 2px;
background-position: 0 100%;
overflow-wrap: break-word;
word-wrap: break-word;
-ms-word-break: break-all;
word-break: break-word;
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto
}
#team #team-bios .bio p a:hover {
background-image: -webkit-linear-gradient(top, rgba(30, 30, 30, 0) 0, rgba(30, 30, 30, 0.5) 0);
background-image: linear-gradient(to bottom, rgba(30, 30, 30, 0) 0, rgba(30, 30, 30, 0.5) 0);
background-size: 2px 100%
}
#team #team-bios .bio.bio-active h2,
#team #team-bios .bio.bio-active h3,
#team #team-bios .bio.bio-active .bio-copy {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
#join-the-team .container {
padding-top: 240px;
padding-bottom: 120px
}
@media (max-width: 719px) {
#join-the-team .container {
padding-top: 120px;
padding-bottom: 60px
}
}
#join-the-team h2 {
font-size: 2.75rem;
margin-bottom: 1.25rem
}
#join-the-team h3 {
font-size: 1.25rem;
margin-bottom: 1.25rem
}
@media (max-width: 719px) {
#join-the-team h3 {
margin-top: 40px
}
}
#join-the-team ul {
font-size: 14px;
font-weight: 500;
line-height: 1.25;
letter-spacing: .05rem;
text-transform: uppercase
}
#join-the-team ul li {
margin-top: 15px
}
#join-the-team ul li a {
display: inline-block
}
#instagram {
text-align: center
}
@media (max-width: 599px) {
#instagram .container+.container {
padding: 0
}
}
#instagram h3 {
font-size: 22px;
font-weight: 600;
letter-spacing: .02rem;
text-transform: uppercase;
margin: .75rem 0 .75rem
}
#instagram .container>a {
color: #1e1e1e;
font-size: 18px;
line-height: 28px;
font-weight: 500;
display: inline-block;
margin: 0 0 1.5rem
}
#instagram .container>a:hover {
color: #ffbc2e
}
#instagram .container>a i {
color: #1e1e1e;
font-size: 30px;
line-height: 30px;
float: left;
margin-right: 12px
}
#instagram .container>a span {
font-weight: 700;
position: relative;
font-size: 17px;
top: -1px
}
#instafeed {
height: 0;
padding-bottom: 200%;
position: relative;
overflow: hidden;
margin-left: -4px;
margin-right: -4px
}
@media (min-width: 720px) {
#instafeed {
padding-bottom: 100%
}
}
@media (min-width: 960px) {
#instafeed {
padding-bottom: 50%
}
}
@media (min-width: 1200px) {
#instafeed {
padding-bottom: 25%;
margin: 0
}
}
#instafeed a {
width: 50%;
height: 0;
padding-bottom: 50%;
float: left;
display: block;
overflow: hidden;
position: relative;
-webkit-transition: opacity .25s;
transition: opacity .25s
}
@media (min-width: 720px) {
#instafeed a {
width: 33.3333%;
padding-bottom: 33.3333%
}
}
@media (min-width: 960px) {
#instafeed a {
width: 25%;
padding-bottom: 25%
}
}
@media (min-width: 1200px) {
#instafeed a {
float: none;
padding-bottom: 0;
position: absolute
}
}
#instafeed a:after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
box-shadow: inset -4px -4px 0 0 #fff, inset 4px 4px 0 0 #fff
}
@media (min-width: 1200px) {
#instafeed a:nth-child(1) {
width: 25%;
height: 50%;
top: 0;
left: 0
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(1):after {
box-shadow: inset -4px -4px 0 0 #fff
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(2) {
width: 25%;
height: 50%;
top: 50%;
left: 0
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(2):after {
box-shadow: inset -4px 4px 0 0 #fff
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(3) {
width: 25%;
height: 100%;
top: 0;
left: 25%
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(3):after {
box-shadow: inset 4px 0 0 0 #fff, inset -4px 0 0 0 #fff
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(4) {
width: 12.5%;
height: 50%;
top: 0;
left: 50%
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(4):after {
box-shadow: inset 4px -4px 0 0 #fff, inset -4px 0 0 0 #fff
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(5) {
width: 12.5%;
height: 50%;
top: 50%;
left: 50%
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(5):after {
box-shadow: inset 4px 4px 0 0 #fff, inset -4px 0 0 0 #fff
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(6) {
width: 12.5%;
height: 50%;
top: 0;
left: 62.5%
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(6):after {
box-shadow: inset 4px -4px 0 0 #fff, inset -4px 0 0 0 #fff
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(7) {
width: 25%;
height: 50%;
top: 50%;
left: 62.5%
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(7):after {
box-shadow: inset 4px 4px 0 0 #fff, inset -4px 0 0 0 #fff
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(8) {
width: 25%;
height: 50%;
top: 0;
left: 75%
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(8):after {
box-shadow: inset 4px -4px 0 0 #fff
}
}
#instafeed a:nth-child(9) {
display: none
}
@media (min-width: 720px) {
#instafeed a:nth-child(9) {
display: block
}
}
@media (min-width: 960px) {
#instafeed a:nth-child(9) {
display: none
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(9) {
width: 12.5%;
height: 50%;
top: 50%;
left: 87.5%;
display: block
}
}
@media (min-width: 1200px) {
#instafeed a:nth-child(9):after {
box-shadow: inset 4px 4px 0 0 #fff
}
}
#instafeed a figure {
display: block;
width: 100%;
height: 100%;
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
-webkit-backface-visibility: hidden;
-webkit-transition: all .25s;
transition: all .25s
}
@media (max-width: 719px) {
#instafeed a figure {
display: block
}
}
#instafeed a figure:after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
z-index: 1;
background: #fff;
opacity: 0;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
#instafeed a figure figcaption {
width: 100%;
height: 100%;
color: #1e1e1e;
font-size: 17px;
font-weight: 400;
font-family: 'sentinel';
line-height: 1.25;
word-wrap: break-word;
display: block;
position: relative;
z-index: 2;
padding: 20px;
visibility: hidden;
opacity: 0;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
@media (max-width: 719px) {
#instafeed a figure figcaption {
font-size: 14px;
display: block
}
}
#instafeed a figure figcaption span {
position: relative;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
display: block
}
#instafeed a:hover figure:after {
opacity: 1
}
#instafeed a:hover figure figcaption {
visibility: visible;
opacity: 1
}
#page-about-us #zspot.post-nav .cta {
-webkit-transition: all .6s ease-out;
transition: all .6s ease-out
}
#page-about-us .is-exiting.is-zspotting #aspot,
#page-about-us .is-exiting.is-zspotting main>*,
#page-about-us .is-exiting.is-zspotting .site-footer {
opacity: 1
}
#page-careers .page-content h3 {
margin-bottom: .875rem
}
#page-careers .intro {
margin-bottom: 80px
}
#page-careers .list-careers li {
margin-bottom: 80px
}
#page-career .page-content a[href^="mailto"] {
margin-top: 2.625rem
}
#page-career #zspot:before {
content: none
}
@font-face {
font-family: 'nlicons';
src: url('../fonts/nlicons/nlicons.eot');
src: url('../fonts/nlicons/nlicons.eot?#iefix') format('embedded-opentype'), url('../fonts/nlicons/nlicons.woff') format('woff'), url('../fonts/nlicons/nlicons.ttf') format('truetype'), url('../fonts/nlicons/nlicons.svg#nlicons') format('svg');
font-weight: normal;
font-style: normal
}
main[data-page="page-start-a-project"] {
z-index: 3;
padding-bottom: 120px;
background: #fff;
opacity: 0;
-webkit-transition: opacity .6s ease-in-out;
transition: opacity .6s ease-in-out
}
.is-default main[data-page="page-start-a-project"],
.is-loaded main[data-page="page-start-a-project"] {
opacity: 1
}
.is-exiting main[data-page="page-start-a-project"] {
opacity: 0
}
#nl-first-name,
#nl-last-name {
display: none
}
.nl-form-wrap {
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
.form-confirmed .nl-form-wrap {
opacity: 0;
visibility: hidden;
pointer-events: none
}
.nl-form-wrap header {
margin-bottom: 120px
}
@media (max-width: 719px) {
.nl-form-wrap header {
margin-bottom: 40px
}
}
.nl-form-wrap header,
.nl-form-wrap header+.container {
opacity: 0;
-webkit-transform: translateY(20%);
-ms-transform: translateY(20%);
transform: translateY(20%);
-webkit-transition: all .5s ease-in-out 0s;
transition: all .5s ease-in-out 0s
}
.is-default .nl-form-wrap header,
.is-loaded .nl-form-wrap header {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
-webkit-transition-delay: 1s;
transition-delay: 1s
}
.is-default .nl-form-wrap header+.container,
.is-loaded .nl-form-wrap header+.container {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none;
-webkit-transition-delay: 1.1s;
transition-delay: 1.1s
}
.nl-form-wrap h1 {
font-size: 90px;
font-weight: 700;
letter-spacing: -0.2rem;
margin-top: 0
}
@media (max-width: 719px) {
.nl-form-wrap h1 {
font-size: 42px;
letter-spacing: -0.1rem;
margin-bottom: 10px
}
}
.nl-form-confirmation {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
opacity: 0;
visibility: hidden;
pointer-events: none;
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
.form-confirmed .nl-form-confirmation {
opacity: 1;
visibility: visible;
pointer-events: auto
}
.nl-form-confirmation header {
width: 100%;
height: 100vh
}
.nl-form-confirmation h1 {
font-size: 90px;
font-weight: 700;
letter-spacing: -0.2rem;
margin-top: 0
}
@media (max-width: 719px) {
.nl-form-confirmation h1 {
font-size: 42px;
letter-spacing: -0.1rem;
margin-bottom: 10px
}
}
.nl-form-confirmation a {
color: #fff;
margin-top: 60px
}
.nl-form-confirmation a:hover {
color: #fff
}
.nl-form-wrap header p {
font-size: 18px;
color: #fff;
font-weight: 500
}
@media (max-width: 719px) {
.nl-form-wrap header p {
font-size: 16px;
color: #fff;
line-height: 1.5;
font-weight: 500
}
}
.ear {
padding: 30px;
margin-bottom: 30px;
border-radius: 50%;
background: #fff;
display: inline-block
}
@media (max-width:719px) {
.ear {
padding: 20px;
margin-bottom: 20px
}
}
.ear .ear-inner {
width: 120px;
height: 120px;
background: url('../img/ui/graphic-ear.png') no-repeat center center;
background-size: contain;
opacity: .75
}
@media (max-width:719px) {
.ear .ear-inner {
width: 60px;
height: 60px
}
}
.nl-form {
width: 100%;
margin: .3em auto 0 auto;
font-size: 1.7em;
line-height: 1.65;
color: #ea7f25;
padding-top:65px;
}
@media (max-width: 719px) {
.nl-form {
line-height: 1.75;
font-weight: 600
}
.nl-form p {
margin: 1.5rem 0
}
}
.nl-form ul {
list-style: none;
margin: 0;
padding: 0
}
.nl-form input,
.nl-form select,
.nl-form button {
border-radius: 0;
border: none;
background: transparent;
font-family: inherit;
font-size: inherit;
color: inherit;
font-weight: inherit;
line-height: inherit;
display: inline-block;
padding: 0;
margin: 0;
-webkit-appearance: none;
-moz-appearance: none
}
.nl-form input:focus {
outline: none
}
.nl-field {
display: inline-block;
position: relative
}
.nl-field.nl-field-open {
z-index: 10000
}
.nl-field-toggle,
.nl-form input,
.nl-form select {
line-height: inherit;
display: inline-block;
border-bottom: 1px solid #fff;
font-family: 'Noto Serif JP', sans-serif;
}
.nl-field ul {
position: absolute;
visibility: hidden;
background: #1e1e1e;
left: -1em;
top: 50%;
font-size: 80%;
font-style: italic;
opacity: 0;
-webkit-transform: translateY(-40%) scale(.9);
-ms-transform: translateY(-40%) scale(.9);
transform: translateY(-40%) scale(.9);
-webkit-transition: visibility 0s .3s, opacity .3s, -webkit-transform .3s;
transition: visibility 0s .3s, opacity .3s, transform .3s
}
.nl-field.nl-field-open ul {
visibility: visible;
opacity: 1;
-webkit-transform: translateY(-50%) scale(1);
-ms-transform: translateY(-50%) scale(1);
transform: translateY(-50%) scale(1);
-webkit-transition: visibility 0s 0s, opacity .3s, -webkit-transform .3s;
transition: visibility 0s 0s, opacity .3s, transform .3s
}
.nl-form label {
font-family: 'Noto Serif JP', sans-serif;
font-weight: 200;
}
.nl-field ul li {
color: #888;
position: relative
}
.nl-ti-input {
position: relative
}
.nl-ti-input:before {
font-family: 'nlicons';
content: "\e002";
height: 100%;
position: absolute;
text-align: center;
width: 2.75em;
color: #555;
left: 0;
font-size: 75%;
line-height: 2.75;
display: block
}
.nl-dd ul li {
padding: .25em 1.5em .25em .5em;
cursor: pointer;
white-space: nowrap
}
.nl-dd ul li.nl-dd-checked {
color: #fff
}
.no-touchevents .nl-dd ul li:hover {
background: #000
}
.no-touchevents .nl-dd ul li:hover:active {
color: #fff
}
.nl-dd ul li.nl-dd-checked:before,
.submit:before,
.nl-field-go:before {
font-family: 'nlicons';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased
}
.nl-dd ul li.nl-dd-checked:before {
content: "\e000";
position: absolute;
right: 1em;
font-size: 50%;
line-height: 3
}
.nl-ti-text ul {
min-width: 14em
}
.nl-ti-text ul li.nl-ti-input input {
width: 100%;
padding: .275em 2.5em .25em 2.25em;
border: 0;
color: #fff;
font-weight: 400
}
.nl-form .nl-field-go {
position: absolute;
right: 0;
top: 0;
bottom: 0;
height: 100%;
cursor: pointer;
background: #000;
width: 2em;
text-align: center;
color: transparent
}
.nl-field-go:before {
content: "\e001";
font-size: 75%;
color: #fff;
width: 100%;
height: 100%;
line-height: 2.9;
display: block
}
.nl-form input::-webkit-input-placeholder {
line-height: 1.5;
color: rgba(255, 255, 255, 1)
}
.nl-form input:active::-webkit-input-placeholder,
input:focus::-webkit-input-placeholder {
color: rgba(255, 255, 255, 1)
}
.nl-form input::-moz-placeholder {
line-height: 1.5;
color: rgba(255, 255, 255, 1)
}
.nl-form input:active::-moz-placeholder,
input:focus::-moz-placeholder {
color: rgba(255, 255, 255, 1)
}
.nl-form input:-ms-input-placeholder {
line-height: 1.5;
color: rgba(255, 255, 255, 1)
}
.nl-form input:active::-ms-input-placeholder,
input:focus::-ms-input-placeholder {
color: rgba(255, 255, 255, 1)
}
.nl-ti-text ul li.nl-ti-example {
font-size: 40%;
font-style: italic;
font-weight: 400;
padding: 0 1em;
color: rgba(0, 0, 0, 0.2)
}
.nl-ti-text ul li.nl-ti-example em {
color: #fff
}
.nl-submit-wrap {
margin-top: 1.5em;}
@media (max-width: 719px) {
.nl-submit-wrap {
margin-top: 0
}
}
.nl-form .submit {
cursor: pointer;
position: relative;
background: #ea7f25;
color: #000;
padding: 0 1.5em 0 1.5em;
border-radius: 0;
letter-spacing: 1px;
font-size: 16px;
padding: 5px 5px 15px 10px;
}
/*
.nl-submit:before {
content: "\e001";
color: #ffbc2e;
float: right;
padding: 0 1em;
margin: 0 0 0 1.5em;
background: #000
}
*/
.no-touchevents .nl-form .submit:hover {
background: #000;
color:#fff;
}
.no-touchevents .nl-form .submit:hover:before {
background: #000;
color:#fff;
}
.form-error .nl-submit-wrap:after {
font-size: 16px;
font-weight: 400;
padding: 0 12px;
font-family: 'aktiv-grotesk', sans-serif;
content: 'Required fields are marked in red.'
}
.nl-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
opacity: 0;
z-index: 9999;
visibility: hidden;
-webkit-transition: visibility 0s .3s, opacity .3s;
transition: visibility 0s .3s, opacity .3s
}
.nl-field.nl-field-open~.nl-overlay {
opacity: 1;
visibility: visible;
-webkit-transition-delay: 0s;
transition-delay: 0s
}
@media (max-width:719px) {
.nl-form {
font-size: 1.75em
}
}
@media (max-width:600px) {
.nl-form {
font-size: 1.5em
}
}
.form-error label[required]+.nl-field>.nl-field-toggle {
color: red
}
#page-404 main .content {
max-width: 100%;
height: 100vh;
position: relative;
overflow: hidden
}
@media (max-width: 719px) {
#page-404 main .content .container {
padding-bottom: 180px
}
}
#page-404 main .content .set-bg {
width: 100%;
height: 100%;
position: fixed;
z-index: -1;
background-repeat: repeat-x;
background-position: center top;
background-size: auto;
opacity: 0;
-webkit-transition: all 1s ease-in-out;
transition: all 1s ease-in-out
}
#page-404 main .content .set-bg.bg-loaded {
opacity: 1
}
#page-404 main .content .b-lazy {
width: auto;
max-height: 80%;
position: absolute;
right: 0;
bottom: 0;
z-index: 2
}
#page-404 main .content .b-lazy:hover {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
-ms-transform-origin: center bottom;
transform-origin: center bottom
}
#page-404 main .content h1 {
font-size: 18px;
margin: 0 0 10px;
text-indent: 5px
}
#page-404 main .content h2 {
font-size: 100px;
margin: 0;
letter-spacing: -0.25rem
}
@media (max-width: 719px) {
#page-404 main .content h2 {
font-size: 60px
}
}
#page-404 main .content a {
margin-top: 140px;
margin-left: 8px
}
@media (max-width: 719px) {
#page-404 main .content a {
margin-top: 40px
}
}
#page-404 main .content .inner {
width: 100%;
height: 100%;
max-width: 100%;
overflow: hidden;
position: relative
}
#page-404 main .content .set-bg+.inner .row>div {
opacity: 0;
-webkit-transition: all 1s ease-in-out .75s;
transition: all 1s ease-in-out .75s
}
@media (min-width: 720px) {
#page-404 main .content .set-bg+.inner+.b-lazy {
opacity: 0;
-webkit-transform: translateY(25%);
-ms-transform: translateY(25%);
transform: translateY(25%);
-webkit-transition: all 1s ease-in-out 1s;
transition: all 1s ease-in-out 1s
}
}
#page-404 main .content .set-bg.bg-loaded+.inner .row>div {
opacity: 1
}
#page-404 main .content .set-bg.bg-loaded+.inner+.b-lazy.b-loaded {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0)
}
@-webkit-keyframes bounce {
0%,
20%,
53%,
80%,
100% {
-webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
transition-timing-function: cubic-bezier(.215, .61, .355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
40%,
43% {
-webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
transition-timing-function: cubic-bezier(.755, .05, .855, .06);
-webkit-transform: translate3d(0, 30px, 0);
transform: translate3d(0, 30px, 0)
}
70% {
-webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
transition-timing-function: cubic-bezier(.755, .05, .855, .06);
-webkit-transform: translate3d(0, 15px, 0);
transform: translate3d(0, 15px, 0)
}
90% {
-webkit-transform: translate3d(0, 4px, 0);
transform: translate3d(0, 4px, 0)
}
}
@keyframes bounce {
0%,
20%,
53%,
80%,
100% {
-webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
transition-timing-function: cubic-bezier(.215, .61, .355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
40%,
43% {
-webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
transition-timing-function: cubic-bezier(.755, .05, .855, .06);
-webkit-transform: translate3d(0, 30px, 0);
transform: translate3d(0, 30px, 0)
}
70% {
-webkit-transition-timing-function: cubic-bezier(.755, .05, .855, .06);
transition-timing-function: cubic-bezier(.755, .05, .855, .06);
-webkit-transform: translate3d(0, 15px, 0);
transform: translate3d(0, 15px, 0)
}
90% {
-webkit-transform: translate3d(0, 4px, 0);
transform: translate3d(0, 4px, 0)
}
}
main[data-template="page-default"] {
z-index: 3;
background: #fff;
margin-bottom: 500px;
position: relative
}
main[data-template="page-default"] .page-content {
padding-top: 80px;
padding-bottom: 160px
}
main[data-footer="none"] {
margin-bottom: 0
}
#aspot[data-height="small"] {
height: 450px;
position: relative
}
@media (max-width: 719px) {
#aspot[data-height="small"] {
height: 300px
}
#aspot[data-height="small"] .inner {
padding-top: 56px
}
}
#aspot[data-height="small"] .set-bg {
position: absolute
}
.is-exiting #aspot[data-height="small"] {
opacity: 0;
-webkit-transition: opacity .25s ease-in-out;
transition: opacity .25s ease-in-out
}
main[data-page="page-landing-page-a"] {
z-index: 3;
background: #fff;
margin-bottom: 400px;
position: relative
}
.page-template-page-landing-page-a .site-logo .d-icon {
width: 56px;
height: 56px;
padding: 0;
border-radius: 0;
background: transparent url('../img/ui/logo-sprite@2x.png') no-repeat 0 0;
background-size: 112px auto;
position: relative;
display: block;
z-index: 1030;
float: left;
pointer-events: none
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .site-logo .site-title {
display: none
}
}
.page-template-page-landing-page-a #aspot {
height: 100vh
}
.page-template-page-landing-page-a #aspot .set-bg {
background-position: center top;
background-size: cover
}
@media (max-width: 719px) {
.page-template-page-landing-page-a #aspot .set-bg {
background-size: -webkit-calc(100vw * 3.25);
background-size: calc(100vw * 3.25);
background-position: 35% top
}
}
.page-template-page-landing-page-a #aspot h1 span {
display: block
}
.page-template-page-landing-page-a #aspot .telno {
position: absolute;
top: 0;
right: 0;
z-index: 4;
padding: 34px 40px;
font-weight: 600;
color: #1e1e1e
}
@media (min-width: 720px) {
.page-template-page-landing-page-a #aspot .telno {
pointer-events: none
}
.page-template-page-landing-page-a #aspot .telno:hover {
cursor: text
}
}
@media (max-width: 719px) {
.page-template-page-landing-page-a #aspot .telno {
padding: 40px 25px
}
}
.page-template-page-landing-page-a #intro {
overflow: hidden;
position: relative
}
.page-template-page-landing-page-a #intro .container {
padding-top: 6rem;
padding-bottom: 12rem;
position: relative
}
@media (max-width: 719px) {
.page-template-page-landing-page-a #intro .container {
padding-top: 3rem;
padding-bottom: 6rem
}
}
.page-template-page-landing-page-a #intro .circle-graphic {
width: 170px;
height: 170px;
padding: 15px;
margin-bottom: 60px;
border-radius: 50%;
background: #ffbc2e;
display: inline-block
}
@media (max-width: 719px) {
.page-template-page-landing-page-a #intro .circle-graphic {
width: 100px;
height: 100px;
margin-bottom: 40px
}
}
.page-template-page-landing-page-a #intro h2 {
font-size: 3.333333rem
}
@media (max-width: 719px) {
.page-template-page-landing-page-a #intro h2 {
font-size: 2.75rem
}
}
@media (max-width: 359px) {
.page-template-page-landing-page-a #intro h2 {
font-size: 34px
}
}
.page-template-page-landing-page-a #intro .lungs {
padding: 35px;
margin-bottom: 60px;
border-radius: 50%;
background: #ffbc2e;
display: inline-block
}
@media (max-width: 719px) {
.page-template-page-landing-page-a #intro .lungs {
padding: 20px;
margin-bottom: 40px
}
}
.page-template-page-landing-page-a #intro .lungs .lungs-inner {
width: 100px;
height: 100px;
position: relative;
top: -5px;
background: url('../img/ui/graphic-lungs.png') no-repeat center center;
background-size: contain;
-webkit-animation: breathe 1.25s ease-out;
animation: breathe 1.25s ease-out;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite
}
@media (max-width: 719px) {
.page-template-page-landing-page-a #intro .lungs .lungs-inner {
width: 60px;
height: 60px
}
}
@keyframes breathe {
0% {
-webkit-transform: scaleX(1);
transform: scaleX(1);
-webkit-animation-timing-function: cubic-bezier(.175, .885, .32, 1);
animation-timing-function: cubic-bezier(.175, .885, .32, 1)
}
70% {
-webkit-transform: scaleX(1.04);
transform: scaleX(1.04)
}
100% {
-webkit-transform: scaleX(1);
transform: scaleX(1)
}
}
.page-template-page-landing-page-a .lp-statement {
position: relative;
padding: 240px 0
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-statement {
padding: 120px 0
}
}
.page-template-page-landing-page-a .lp-statement .b-lazy.bg {
width: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
background-repeat: no-repeat;
background-position: center center;
background-size: cover
}
.page-template-page-landing-page-a .lp-statement h3 {
font-size: 3.333333rem
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-statement h3 {
font-size: 2.75rem
}
}
@media (max-width: 359px) {
.page-template-page-landing-page-a .lp-statement h3 {
font-size: 34px
}
}
.page-template-page-landing-page-a .lp-statement.text-white h3 {
color: #fff
}
.page-template-page-landing-page-a .lp-statement.text-white p {
color: #fff
}
.page-template-page-landing-page-a .lp-testimonial {
padding: 120px 0;
position: relative
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-testimonial {
padding: 60px 0
}
}
.page-template-page-landing-page-a .lp-testimonial .b-lazy.bg {
width: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
z-index: -1;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
-webkit-transition: all 1s cubic-bezier(.7, 0, .3, 1);
transition: all 1s cubic-bezier(.7, 0, .3, 1)
}
.page-template-page-landing-page-a .lp-testimonial blockquote {
color: #fff;
border: 0;
margin-top: 0;
margin-bottom: 0
}
.page-template-page-landing-page-a .lp-testimonial blockquote p {
font-family: 'Sentinel', serif;
font-weight: 500;
font-size: 24px;
font-style: italic;
line-height: 1.25;
padding: 0 0 0 8.33333333%;
position: relative
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-testimonial blockquote p {
font-size: 20px;
padding: 0 0 0 12.5%
}
}
.page-template-page-landing-page-a .lp-testimonial blockquote p:before {
font-size: 34px;
content: "\e904";
font-family: '_dgicons' !important;
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
position: absolute;
top: 0;
left: 0
}
.page-template-page-landing-page-a .lp-testimonial blockquote cite {
font-size: 24px;
font-weight: 700;
margin-top: 40px;
padding: 0 0 0 8.33333333%;
display: block
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-testimonial blockquote cite {
padding: 0 0 0 12.5%
}
}
.page-template-page-landing-page-a .lp-testimonial blockquote cite span {
color: #1e1e1e;
font-weight: 700;
text-transform: uppercase;
font-size: 12.5px;
line-height: 1;
letter-spacing: .05rem;
display: block
}
.page-template-page-landing-page-a .lp-capabilities {
padding: 180px 0;
position: relative
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-capabilities {
padding: 90px 0
}
}
.page-template-page-landing-page-a .lp-capabilities h3 {
font-size: 2rem
}
.page-template-page-landing-page-a .lp-capabilities ul {
padding-top: 1rem
}
.page-template-page-landing-page-a .lp-capabilities ul li {
font-weight: 500;
margin-top: .5rem
}
@media (min-width: 720px) {
.page-template-page-landing-page-a .lp-capabilities ul li {
width: 50%;
padding-right: 30px;
float: left
}
}
.page-template-page-landing-page-a #intro+.lp-capabilities {
background: #f5f5f5
}
.page-template-page-landing-page-a .site-footer {
height: 400px;
background: #fff
}
.page-template-page-landing-page-a .site-footer h4 {
color: #999;
font-weight: 500;
font-size: 20px;
margin: 0 0 10px
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .site-footer h4 {
font-size: 18px
}
}
.page-template-page-landing-page-a .site-footer h5 {
color: #1e1e1e;
font-size: 50px;
margin: 0 0 60px
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .site-footer h5 {
font-size: 40px;
margin: 0 0 40px
}
}
@media (max-width: 359px) {
.page-template-page-landing-page-a .site-footer h5 {
font-size: 34px
}
}
.page-template-page-landing-page-a .site-footer .cta {
text-align: center;
width: 100%;
padding: 120px 0 0;
margin-bottom: 0;
border-bottom: 0
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .site-footer .cta {
padding: 90px 0 0
}
}
.page-template-page-landing-page-a .lp-form {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
background: #fff;
z-index: -1;
pointer-events: none;
visibility: hidden;
opacity: 0;
overflow-y: auto;
-webkit-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);
-webkit-transition: all .5s cubic-bezier(.7, 0, .3, 1);
transition: all .5s cubic-bezier(.7, 0, .3, 1)
}
.page-template-page-landing-page-a .lp-form.is-visible {
z-index: 2000;
pointer-events: auto;
visibility: visible;
opacity: 1;
-webkit-overflow-scrolling: touch;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1)
}
.form-confirmed.page-template-page-landing-page-a .lp-form.is-visible {
overflow: hidden;
opacity: 0
}
.page-template-page-landing-page-a .lp-form .container {
padding-top: 120px;
padding-bottom: 120px
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-form .container {
padding-top: 60px;
padding-bottom: 60px
}
}
.page-template-page-landing-page-a .lp-form form label {
display: none
}
.page-template-page-landing-page-a .lp-form form ul li {
margin-bottom: 30px
}
.page-template-page-landing-page-a .lp-form form ul li.field-left {
width: -webkit-calc(50% - 15px);
width: calc(50% - 15px);
float: left
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-form form ul li.field-left {
width: 100%;
float: left
}
}
.page-template-page-landing-page-a .lp-form form ul li.field-right {
width: -webkit-calc(50% - 15px);
width: calc(50% - 15px);
float: right
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-form form ul li.field-right {
width: 100%;
float: left
}
}
.page-template-page-landing-page-a .lp-form form ul li.field-full {
width: 100%;
float: left
}
.page-template-page-landing-page-a .lp-form form ul li.field-center {
text-align: center
}
.page-template-page-landing-page-a .lp-form form #lp-first-name,
.page-template-page-landing-page-a .lp-form form #lp-last-name {
display: none
}
.form-error.page-template-page-landing-page-a .lp-form form input {
border-color: red
}
.form-error.page-template-page-landing-page-a .lp-form form .lp-submit+span:after {
color: red;
content: 'Required fields are marked in red.';
font-size: 13px;
margin-top: 15px;
display: block
}
.page-template-page-landing-page-a .lp-form-confirmation {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
height: 100%;
width: 100%;
background: #fff;
z-index: -1;
pointer-events: none;
visibility: hidden;
opacity: 0;
overflow-y: auto;
-webkit-transition: all .25s cubic-bezier(.7, 0, .3, 1);
transition: all .25s cubic-bezier(.7, 0, .3, 1)
}
.form-confirmed.page-template-page-landing-page-a .lp-form.is-visible+.lp-form-confirmation {
z-index: 2020;
pointer-events: auto;
visibility: visible;
opacity: 1
}
.page-template-page-landing-page-a .lp-form-close {
color: #1e1e1e;
position: absolute;
top: 0;
right: 0;
font-size: 32px;
padding: 32px;
z-index: 2020
}
@media (max-width: 719px) {
.page-template-page-landing-page-a .lp-form-close {
font-size: 24px;
padding: 16px
}
}
.clear:before,
.clear:after {
content: '';
display: table
}
.clear:after {
clear: both
}
.center-block {
display: block;
margin-left: auto;
margin-right: auto
}
.hold-stuff {
position: relative
}
.u-no-break {
white-space: nowrap
}
.vert-center {
display: table;
height: 100%;
padding-left: 0;
padding-right: 0
}
.vert-center.container {
width: 100%
}
@media (min-width: 600px) {
.vert-center.container {
width: 600px
}
}
@media (min-width: 720px) {
.vert-center.container {
width: 720px
}
}
@media (min-width: 960px) {
.vert-center.container {
width: 960px
}
}
@media (min-width: 1200px) {
.vert-center.container {
width: 1200px
}
}
.vert-center>* {
display: table-cell;
vertical-align: middle
}
.vert-bottom {
display: table;
height: 100%;
padding-left: 0;
padding-right: 0
}
.vert-bottom>* {
display: table-cell;
vertical-align: bottom
}
.left {
float: left !important
}
.right {
float: right !important
}
.hide {
display: none
}
@media (max-width: 719px) {
.hide-sm {
display: none
}
}
.invisible {
visibility: hidden
}
.clr--brand {
color: #ffbc2e !important
}
.clr--white {
color: #fff !important
}
.clr--text {
color: #1e1e1e !important
}
.bg--gray {
background-color: #eee
}
.bg-cover {
background-repeat: no-repeat;
background-position: center center;
background-size: cover
}
.fs-13 {
font-size: .8125rem
}
.fs-14 {
font-size: .875rem
}
.fs-15 {
font-size: .9375rem
}
.fs-16 {
font-size: 1rem
}
.fs-18 {
font-size: 1.125rem
}
.fs-20 {
font-size: 1.25rem
}
.fs-22 {
font-size: 1.375rem
}
.lh-1 {
line-height: 1
}
.lh-125 {
line-height: 1.25
}
.ml-5 {
margin-left: 5px
}
.mr-5 {
margin-right: 5px
}
.mt-0 {
margin-top: 0 !important
}
.mt-10 {
margin-top: 10px !important
}
.mt-15 {
margin-top: 15px !important
}
.mt-20 {
margin-top: 20px !important
}
@media (max-width: 719px) {
.mt-20 {
margin-top: 20px !important
}
}
.mt-40 {
margin-top: 40px !important
}
@media (max-width: 719px) {
.mt-40 {
margin-top: 20px !important
}
}
.mt-60 {
margin-top: 60px !important
}
@media (max-width: 719px) {
.mt-60 {
margin-top: 30px !important
}
}
.mt-80 {
margin-top: 80px !important
}
@media (max-width: 719px) {
.mt-80 {
margin-top: 40px !important
}
}
.mt-100 {
margin-top: 100px !important
}
@media (max-width: 719px) {
.mt-100 {
margin-top: 50px !important
}
}
.mt-120 {
margin-top: 120px !important
}
@media (max-width: 719px) {
.mt-120 {
margin-top: 60px !important
}
}
.mt-160 {
margin-top: 160px !important
}
@media (max-width: 719px) {
.mt-160 {
margin-top: 80px !important
}
}
.mt-200 {
margin-top: 200px !important
}
@media (max-width: 719px) {
.mt-200 {
margin-top: 100px !important
}
}
.mb-0 {
margin-bottom: 0 !important
}
.mb-10 {
margin-bottom: 10px !important
}
.mb-15 {
margin-bottom: 15px !important
}
.mb-20 {
margin-bottom: 20px !important
}
@media (max-width: 719px) {
.mb-20 {
margin-bottom: 20px !important
}
}
.mb-40 {
margin-bottom: 40px !important
}
@media (max-width: 719px) {
.mb-40 {
margin-bottom: 20px !important
}
}
.mb-60 {
margin-bottom: 60px !important
}
@media (max-width: 719px) {
.mb-60 {
margin-bottom: 30px !important
}
}
.mb-80 {
margin-bottom: 80px !important
}
@media (max-width: 719px) {
.mb-80 {
margin-bottom: 40px !important
}
}
.mb-100 {
margin-bottom: 100px !important
}
@media (max-width: 719px) {
.mb-100 {
margin-bottom: 50px !important
}
}
.mb-120 {
margin-bottom: 120px !important
}
@media (max-width: 719px) {
.mb-120 {
margin-bottom: 60px !important
}
}
.mb-160 {
margin-bottom: 160px !important
}
@media (max-width: 719px) {
.mb-160 {
margin-bottom: 80px !important
}
}
.mb-200 {
margin-bottom: 200px !important
}
@media (max-width: 719px) {
.mb-200 {
margin-bottom: 100px !important
}
}
.pt-0 {
padding-top: 0
}
.pt-10 {
padding-top: 10px
}
.pt-15 {
padding-top: 15px
}
.pt-20 {
padding-top: 20px
}
@media (max-width: 719px) {
.pt-20 {
padding-top: 20px
}
}
.pt-40 {
padding-top: 40px
}
@media (max-width: 719px) {
.pt-40 {
padding-top: 20px
}
}
.pt-60 {
padding-top: 60px
}
@media (max-width: 719px) {
.pt-60 {
padding-top: 30px
}
}
.pt-80 {
padding-top: 80px
}
@media (max-width: 719px) {
.pt-80 {
padding-top: 40px
}
}
.pt-100 {
padding-top: 100px
}
@media (max-width: 719px) {
.pt-100 {
padding-top: 50px
}
}
.pt-120 {
padding-top: 120px
}
@media (max-width: 719px) {
.pt-120 {
padding-top: 60px
}
}
.pt-160 {
padding-top: 160px
}
@media (max-width: 719px) {
.pt-160 {
padding-top: 80px
}
}
.pt-200 {
padding-top: 200px
}
@media (max-width: 719px) {
.pt-200 {
padding-top: 100px
}
}
.pb-0 {
padding-bottom: 0
}
.pb-10 {
padding-bottom: 10px
}
.pb-15 {
padding-bottom: 15px
}
.pb-20 {
padding-bottom: 20px
}
@media (max-width: 719px) {
.pb-20 {
padding-bottom: 20px
}
}
.pb-40 {
padding-bottom: 40px
}
@media (max-width: 719px) {
.pb-40 {
padding-bottom: 20px
}
}
.pb-60 {
padding-bottom: 60px
}
@media (max-width: 719px) {
.pb-60 {
padding-bottom: 30px
}
}
.pb-80 {
padding-bottom: 80px
}
@media (max-width: 719px) {
.pb-80 {
padding-bottom: 40px
}
}
.pb-100 {
padding-bottom: 100px
}
@media (max-width: 719px) {
.pb-100 {
padding-bottom: 50px
}
}
.pb-120 {
padding-bottom: 120px
}
@media (max-width: 719px) {
.pb-120 {
padding-bottom: 60px
}
}
.pb-160 {
padding-bottom: 160px
}
@media (max-width: 719px) {
.pb-160 {
padding-bottom: 80px
}
}
.pb-200 {
padding-bottom: 200px
}
@media (max-width: 719px) {
.pb-200 {
padding-bottom: 100px
}
}
.p-80 {
padding-top: 80px;
padding-bottom: 80px
}
@media (max-width: 719px) {
.p-80 {
padding-top: 40px;
padding-bottom: 40px
}
}
.p-100 {
padding-top: 100px;
padding-bottom: 100px
}
@media (max-width: 719px) {
.p-100 {
padding-top: 50px;
padding-bottom: 50px
}
}
.p-120 {
padding-top: 120px;
padding-bottom: 120px
}
@media (max-width: 719px) {
.p-120 {
padding-top: 60px;
padding-bottom: 60px
}
}
@media (min-width: 1600px) {
.hide-xxl {
display: none
}
}
@media (min-width: 1200px) {
.hide-lg {
display: none
}
}
@media (min-width: 960px) and (max-width: 1199px) {
.hide-md {
display: none
}
}
@media (min-width: 720px) and (max-width: 959px) {
.hide-sm {
display: none
}
}
@media (max-width: 719px) {
.hide-xs {
display: none
}
}
.push-page {
min-height: 600px
}
.altrows>div:nth-child(2n) div {
float: right
}
.altrows>div:nth-child(2n) div+div {
float: left
}
.altrows>div:nth-child(2n) div>div {
float: left
}
.altrows>div:nth-child(2n) div>div+div {
float: right
}
.t-c {
text-align: center
}
.t-l {
text-align: left
}
.t-r {
text-align: right
}
@media (max-width: 719px) {
.t-c-sm {
text-align: center
}
}
@media (max-width: 599px) {
.t-c-xs {
text-align: center
}
}
.lower {
text-transform: lowercase !important
}
.js-no-scroll {
overflow: hidden !important
}
.js-body-fixed {
overflow: hidden;
margin-right: 15px;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0
}
.fade {
opacity: 0 !important;
-webkit-transition: all .25s ease-out;
transition: all .25s ease-out
}
.no-js .fade {
opacity: 1 !important
}
.fade.in {
opacity: 1 !important
}
.fdinup {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
-webkit-transition: all .8s cubic-bezier(.77, 0, .175, 1) 0s;
transition: all .8s cubic-bezier(.77, 0, .175, 1) 0s
}
.is-loaded .fdinup,
.is-default .fdinup {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
@font-face {
font-family: 'nlicons';
src: url('../fonts/nlicons.eot'); /* IE9 Compat Modes */
src: url('../fonts/nlicons.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('../fonts/nlicons.woff2') format('woff2'), /* Super Modern Browsers */
url('../fonts/nlicons.woff') format('woff'), /* Pretty Modern Browsers */
url('../fonts/nlicons.ttf') format('truetype'), /* Safari, Android, iOS */
url('../fonts/nlicons.svg#svgFontName') format('svg'); /* Legacy iOS */
}