/* Page Generated in 0.000000 seconds */ @font-face { font-family: 'swiper-icons'; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff"); font-weight: 400; font-style: normal; } /*:root { --swiper-theme-color: #000; }*/ .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; /* Fix of Webkit flickering */ z-index: 1; } .swiper-container-vertical > .swiper-wrapper { flex-direction: column; } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box; } .swiper-container-android .swiper-slide,.swiper-wrapper { transform: translate3d(0px, 0, 0); } .swiper-container-multirow > .swiper-wrapper { flex-wrap: wrap; } .swiper-container-multirow-column > .swiper-wrapper { flex-wrap: wrap; flex-direction: column; } .swiper-container-free-mode > .swiper-wrapper { transition-timing-function: ease-out; margin: 0 auto; } .swiper-container-pointer-events { touch-action: pan-y; } .swiper-container-pointer-events.swiper-container-vertical { touch-action: pan-x; } .swiper-slide { flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform; } .swiper-slide-invisible-blank { visibility: hidden; } /* Auto Height */ .swiper-container-autoheight,.swiper-container-autoheight .swiper-slide { height: auto; } .swiper-container-autoheight .swiper-wrapper { align-items: flex-start; transition-property: transform, height; } /* 3D Effects */ .swiper-container-3d { perspective: 1200px; } .swiper-container-3d .swiper-wrapper,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-cube-shadow {transform-style: preserve-3d; } .swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-slide-shadow-bottom {position: absolute;left: 0;top: 0;width: 100%;height: 100%;pointer-events: none;z-index: 10; } .swiper-container-3d .swiper-slide-shadow-left {background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-right {background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-top {background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } .swiper-container-3d .swiper-slide-shadow-bottom {background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0)); } /* CSS Mode */ .swiper-container-css-mode > .swiper-wrapper {overflow: auto;scrollbar-width: none;/* For Firefox */-ms-overflow-style: none;/* For Internet Explorer and Edge */ } .swiper-container-css-mode > .swiper-wrapper::-webkit-scrollbar {display: none; } .swiper-container-css-mode > .swiper-wrapper > .swiper-slide {scroll-snap-align: start start; } .swiper-container-horizontal.swiper-container-css-mode > .swiper-wrapper {scroll-snap-type: x mandatory; } .swiper-container-vertical.swiper-container-css-mode > .swiper-wrapper {scroll-snap-type: y mandatory; } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {border: 0;font-size: 100%;font: inherit;vertical-align: baseline;margin: 0;padding: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block; } body {line-height: 1; } ol, ul {list-style: none; } blockquote, q {quotes: none; } blockquote:before, blockquote:after, q:before, q:after {content: none; } table {border-collapse: collapse;border-spacing: 0; } a {text-decoration: none; } * {box-sizing: border-box; } *:after, *:before {box-sizing: inherit; } img {max-width: 100%; } ::-moz-selection {background-color: #6DCEF0;color: #ffffff; } ::selection {background-color: #6DCEF0;color: #ffffff; } @font-face { font-family: 'calvert_mt_stdregular'; src: url('/img/calvertmtstd.eot'); src: url('/img/calvertmtstd.eot?#iefix') format('embedded-opentype'), url('/img/calvertmtstd.woff') format('woff'), url('/img/calvertmtstd.ttf') format('truetype'), url('/img/calvertmtstd.svg#calvert_mt_stdregular') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'calvert_mt_stdbold'; src: url('/img/calvertmtstd-bold.eot'); src: url('/img/calvertmtstd-bold.eot?#iefix') format('embedded-opentype'), url('/img/calvertmtstd-bold.woff') format('woff'), url('/img/calvertmtstd-bold.ttf') format('truetype'), url('/img/calvertmtstd-bold.svg#calvert_mt_stdbold') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Avenir-Light'; src: url("/img/Avenir-Light.woff") format("woff"); font-weight: 200; font-style: normal; } @font-face { font-family: 'Avenir-Book'; src: url("/img/Avenir-Book.woff") format("woff"); font-weight: normal; font-style: normal; } @font-face { font-family: 'Avenir-Heavy'; src: url("/img/Avenir-Heavy.woff") format("woff"); font-weight: 600; font-style: normal; } i {display: block;position: relative; } i svg {display: block;margin: auto; } .icon-wnwn {width: 130px;height: 45px;background-blend-mode: multiply;mix-blend-mode: multiply; } .icon-wnwn:before {content: '';display: block;width: 100%;height: 100%;/*background-image: url(/svg/wnwn-horizontal);*/background-size: 100% 100%;background-blend-mode: multiply;mix-blend-mode: multiply; } .icon-facebook {width: 13px;height: 15px; } .icon-facebook:before {content: '';display: block;width: 100%;height: 100%;/*background-image: url(/svg/facebook);*/background-size: auto 100%; } .icon-twitter {width: 17px;height: 17px; } .icon-twitter:before {content: '';display: block;width: 100%;height: 100%;/*background-image: url(/svg/twitter);*/background-size: 100% 100%; } .icon-pinterest {width: 17px;height: 17px; } .icon-pinterest:before {content: '';display: block;width: 100%;height: 100%;/*background-image: url(/svg/pinterest);*/background-size: 100% 100%; } .icon-instagram {width: 17px;height: 17px; } .icon-instagram:before {content: '';display: block;width: 100%;height: 100%;/*background-image: url(/svg/instagram);*/background-size: 100% 100%; } .icon-email {width: 19px;height: 17px; } .icon-email:before {content: '';display: block;width: 100%;height: 100%;/*background-image: url(/svg/envelope);*/background-size: 100% 100%; } .icon-website {width: 19px;height: 17px; } .icon-website:before {content: '';display: block;width: 100%;height: 100%;/*background-image: url(/svg/website);*/background-size: 100% 100%; } .btn {display: inline-block;font-family: 'Avenir-Heavy', sans-serif;font-weight: 600;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 14px;letter-spacing: 1px;line-height: 1.375;color: inherit; } @media screen and (min-width: 768px) {.btn { font-size: 17px; letter-spacing: .0623em; line-height: 1.35; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.btn { font-size: 1.180vw; } } .h0 {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 50px;line-height: 1.2; } @media screen and (min-width: 768px) {.h0 { font-size: 70px; line-height: 1.05; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.h0 { font-size: 4.8611vw; } } .h1 {font-family: 'calvert_mt_stdregular','Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 50px;letter-spacing: 0.1px;line-height: 0.925; } @media screen and (min-width: 768px) {.h1 { font-size: 80px; letter-spacing: .0026em; line-height: .9; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.h1 { font-size: 6.555vw; } } .h2 {font-family: calvert_mt_stdregular, 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 40px;line-height: 0.8; } @media screen and (min-width: 768px) {.h2 { font-size: 70px; line-height: 0.8; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.h2 { font-size: 5.861vw; } } .h3 {font-family: 'Avenir-Light', sans-serif;font-weight: 200;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 30px;line-height: 1.3;letter-spacing: 0.08px; } @media screen and (min-width: 768px) {.h3 { font-size: 48px; line-height: 1.1875; letter-spacing: .0025em; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.h3 { font-size: 3.333vw; } } .h4 {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 30px;letter-spacing: 0.05px;line-height: 1.1; } @media screen and (min-width: 768px) {.h4 { font-size: 35px; letter-spacing: .0025em; line-height: 1.114; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.h4 { font-size: 3.2305vw; } } .h5 {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 22px;line-height: 1.238;letter-spacing: .0252em; } @media screen and (min-width: 768px) {.h5 { font-size: 28px; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.h5 { font-size: 1.458vw; font-weight:bold; } } .h5 p + p {margin-top: 1em; } .h5 p + p:before { /* content: '\00A0'; */} .h6 {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 18px;line-height: 1.3589;letter-spacing: .0025em; } @media screen and (min-width: 768px) {.h6 { font-size: 39px; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.h6 { font-size: 2.7083vw; } } .label {font-family: 'Avenir-Light', sans-serif;font-weight: 200;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 16px;line-height: 1.33;letter-spacing: 2.13px;text-transform: uppercase; } @media screen and (min-width: 768px) {.label { font-size: 18px; line-height: 1.44; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.label { font-size: 1.25vw; } } .p {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;ont-size: 18px;line-height: 1.66; } @media screen and (min-width: 768px) {.p { line-height: 1.44; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.p { font-size: 1.25vw; } } html {height: 100%; } html.stay {overflow: hidden; } body {display: flex;flex-direction: column;min-height: 100%;background-color: #2A3CAC; } body section > .image,body section > .center {transition: .35s; } body.is-loading { pointer-events: none; /* header { opacity: 0; transition: .35s;} */ /* .main { pointer-events: none; .center { opacity: 0; transition: .35s; } } */ } body.is-loading header, body.is-loading .main { pointer-events: none; } body.is-loading header section > .image, body.is-loading header section > .center, body.is-loading .main section > .image, body.is-loading .main section > .center { opacity: 0; } body.is-loading header a, body.is-loading .main a { pointer-events: none; } body.is-done-loading { /* header { opacity: 1; transition: .35s;} */ /* .main { pointer-events: all; .center { opacity: 1; transition: .35s; }} */ } .main {position: relative;z-index: 2;flex: 1; } img {display: block; } a {color: inherit; } .splitting .word {white-space: nowrap; } canvas {position: fixed;left: 0;top: 0;width: 100vw;height: 100vh;pointer-events: none;opacity: .999999;filter: brightness(0.99); } #scene-changer {position: fixed;top: 0;left: 0;width: 100%;height: 100%;z-index: 10;visibility: hidden;pointer-events: none; } #scene-changer.is-visible {visibility: visible; } /*! locomotive-scroll v4.1.0 | MIT License | https://github.com/locomotivemtl/locomotive-scroll */ html.has-scroll-smooth {overflow: hidden; } html.has-scroll-dragging {-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none; } .has-scroll-smooth body {overflow: hidden; } .has-scroll-smooth [data-scroll-container] {min-height: 100vh; } [data-scroll-direction=horizontal] [data-scroll-container] {height: 100vh;display: inline-block;white-space: nowrap; } [data-scroll-direction=horizontal] [data-scroll-section] {display: inline-block;vertical-align: top;white-space: nowrap;height: 100%; } .c-scrollbar {position: absolute;right: 0;top: 0;width: 11px;height: 100%;transform-origin: center right;transition: transform .3s,opacity .3s;opacity: 0; } .c-scrollbar:hover {transform: scaleX(1.45); } .c-scrollbar:hover, .has-scroll-dragging .c-scrollbar, .has-scroll-scrolling .c-scrollbar {opacity: 1; } [data-scroll-direction=horizontal] .c-scrollbar {width: 100%;height: 10px;top: auto;bottom: 0;transform: scaleY(1); } [data-scroll-direction=horizontal] .c-scrollbar:hover {transform: scaleY(1.3); } .c-scrollbar_thumb {position: absolute;top: 0;right: 0;background-color: #000;opacity: .5;width: 7px;border-radius: 10px;margin: 2px;cursor: -webkit-grab;cursor: grab; } .has-scroll-dragging .c-scrollbar_thumb {cursor: -webkit-grabbing;cursor: grabbing; } [data-scroll-direction=horizontal] .c-scrollbar_thumb {right: auto;bottom: 0; } /* Recommended styles for Splitting */ .splitting .word,.splitting .char {display: inline-block; } /* Psuedo-element chars */ .splitting .char {position: relative; } /** * Populate the psuedo elements with the character to allow for expanded effects * Set to `display: none` by default; just add `display: block` when you want * to use the psuedo elements */ .splitting .char::before,.splitting .char::after {content: attr(data-char);position: absolute;top: 0;left: 0;visibility: hidden;transition: inherit;user-select: none; } /* Expanded CSS Variables */ .splitting { /* The center word index */ --word-center: calc((var(--word-total) - 1) / 2); /* The center character index */ --char-center: calc((var(--char-total) - 1) / 2); /* The center character index */ --line-center: calc((var(--line-total) - 1) / 2); } .splitting .word { /* Pecent (0-1) of the word's position */ --word-percent: calc(var(--word-index) / var(--word-total)); /* Pecent (0-1) of the line's position */ --line-percent: calc(var(--line-index) / var(--line-total)); } .splitting .char { /* Percent (0-1) of the char's position */ --char-percent: calc(var(--char-index) / var(--char-total)); /* Offset from center, positive & negative */ --char-offset: calc(var(--char-index) - var(--char-center)); /* Absolute distance from center, only positive */ --distance: calc( (var(--char-offset) * var(--char-offset)) / var(--char-center) ); /* Distance from center where -1 is the far left, 0 is center, 1 is far right */ --distance-sine: calc(var(--char-offset) / var(--char-center)); /* Distance from center where 1 is far left/far right, 0 is center */ --distance-percent: calc((var(--distance) / var(--char-center))); } .splitting.cells img {width: 100%;display: block; } @supports (display: grid) { .splitting.cells {position: relative;overflow: hidden;background-size: cover;visibility: hidden; } .splitting .cell-grid {background: inherit;position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: grid;grid-template: repeat(var(--row-total), 1fr)/repeat(var(--col-total), 1fr); } .splitting .cell {background: inherit;position: relative;overflow: hidden; } .splitting .cell-inner {background: inherit;position: absolute;visibility: visible;/* Size to fit the whole container size */width: calc(100% * var(--col-total));height: calc(100% * var(--row-total));/* Position properly */left: calc(-100% * var(--col-index));top: calc(-100% * var(--row-index)); }/* Helper variables for advanced effects */ .splitting .cell {--center-x: calc((var(--col-total) - 1) / 2);--center-y: calc((var(--row-total) - 1) / 2);/* Offset from center, positive & negative */--offset-x: calc(var(--col-index) - var(--center-x));--offset-y: calc(var(--row-index) - var(--center-y));/* Absolute distance from center, only positive */--distance-x: calc( (var(--offset-x) * var(--offset-x)) / var(--center-x) );/* Absolute distance from center, only positive */--distance-y: calc( (var(--offset-y) * var(--offset-y)) / var(--center-y) ); } } footer {background-color: #2A3CAC; } footer .center {margin: auto;padding: 70px 6.66% 7px; } @media screen and (min-width: 1200px) { footer .center { padding: 0 5.55% 16px; } } footer .contact {text-align: center;color: #ffffff; } footer .contact h3 span { display: inline-block; transform: translateY(50%); opacity: 0; } footer .contact h3.is-inview span { transform: translateY(0); opacity: 1; transition: 1s; } footer .contact h2 a { display: inline-block; transform: translateY(50%); opacity: 0; } footer .contact h2.is-inview a { transform: translateY(0); opacity: 1; transition: 1s; } footer .contact h3 + h2 { margin-top: 15px; } footer .contact h2 { font-family: calvert_mt_stdregular, 'Avenir-Book', sans-serif; font-weight: 400; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 24px; line-height: 1.625; } footer .contact h2 + h2 { margin-top: 6px; } footer .contact a span { color: #ffffff; transition: .5s; } footer .contact a:hover span { color: #6DCEF0; } footer .contact a:active span { transform: scale(0.975); transition: .15s; } footer .contact + .instagram { margin-top: 90px; } @media screen and (min-width: 768px) { footer .contact h3 + h2 { margin-top: 26px; } footer .contact h2 { font-size: 42px; line-height: 0.92; } footer .contact h2 + h2 { margin-top: 24px; } footer .contact + .instagram { margin-top: 180px; } } @media screen and (min-width: 1440px) and (min-height: 560px) {footer .contact h2 {font-size: 2.916vw; } } footer .instagram .feed {display: grid;grid-template-columns: 1fr;row-gap: 10px;column-gap: 10px; } footer .instagram .feed a {display: block;position: relative; } footer .instagram .feed a:before {content: '';display: block;width: 100%;height: 0;padding-top: 100%; } footer .instagram .feed a img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;transition: .35s; } footer .instagram .feed a:hover img {filter: sepia(0.2); } footer .instagram .feed a:active img {transform: scale(0.95);transition: .15s; } footer .instagram .feed + .text {margin-top: 20px; } footer .instagram .text {width: 76.92%;color: #ffffff; } footer .instagram .text a span {color: #ffffff;transition: .5s; } footer .instagram .text a:hover span {color: #6DCEF0; } footer .instagram .text a:active span {transform: scale(0.975);transition: .15s; } footer .instagram h2 {font-family: calvert_mt_stdregular, 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 24px;line-height: 1.1666;letter-spacing: 0.06px; } footer .instagram h2 + p {margin-top: 20px; display:block; font-family: 'Avenir-Heavy', sans-serif; font-weight:600; font-size:4.180vw; letter-spacing: .0623em; line-height: 1.35 } footer .instagram + .foot {margin-top: 80px; } @media (min-width: 320px) {footer .instagram .feed {grid-template-columns: 1fr 1fr; } } @media (min-width: 640px) { footer .instagram {display: flex;align-items: center; } footer .instagram .feed {width: 50%; } footer .instagram .feed + .text {margin-top: 0;padding-left: 50px; } footer .instagram .text {flex: 1; } } @media screen and (min-width: 768px) { footer .instagram {padding: 0 1.093%; } footer .instagram .feed {width: 50%; } footer .instagram .feed + .text {padding-left: 60px; } footer .instagram h2 {font-size: 42px;line-height: 1.11;letter-spacing: .0026em; } footer .instagram h2 + p { font-size:1.180vw; } footer .instagram + .foot {margin-top: 116px; } } @media screen and (min-width: 1024px) { footer .instagram .feed {grid-template-columns: 1fr 1fr 1fr 1fr;row-gap: 12px;column-gap: 12px;width: 57.82%; } footer .instagram .feed + .text {padding-left: 8%; } } @media screen and (min-width: 1280px) { footer .instagram .feed {row-gap: .8333vw;column-gap: .8333vw; } footer .instagram .feed + .text {padding-left: 8.77%; } footer .instagram h2 {display: inline;font-size: 2.916vw; } } footer .foot {display: flex;flex-direction: column;align-items: center; } footer .foot .logo {order: 2;margin-top: 48px;margin-bottom: 12px;width: 90px; } footer .foot .text {display: flex;flex-direction: column;align-items: center; } footer .foot .newsletter {order: 2;margin-top: 48px; } footer .foot .newsletter a span {display: inline-block;font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 14px;letter-spacing: .1185em;text-transform: uppercase;color: #ffffff;transition: .5s; } footer .foot .newsletter a:hover span {color: #6DCEF0; } footer .foot .newsletter a:active span {transform: scale(0.975);transition: .15s; } footer .foot nav {order: 1;text-align: center; } footer .foot nav li {font-family: 'Avenir-Heavy', sans-serif;font-weight: 600;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 16px;letter-spacing: 1px;line-height: 1.375;color: #ffffff; display:inline-block; margin:0 8px; } @media screen and (min-width: 400px) { footer .foot nav li { margin:0 15px; } } footer .foot nav li + li {margin-top: 24px; } footer .foot nav a span {display: inline-block;color: #ffffff;transition: .5s; } footer .foot nav a:hover span {color: #6DCEF0; } footer .foot nav a:active span {transform: scale(0.975);transition: .15s; } footer .foot .copyright {order: 3;margin-top: 48px;text-align: center;color: #ffffff; } footer .foot .copyright p {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;font-size: 14px;letter-spacing: .03px;line-height: 1.2; } @media screen and (min-width: 400px) { footer .foot .copyright p { line-height:4.54; } } footer .foot .copyright p + p {margin-top: 1.25em; } @media screen and (min-width: 400px) { footer .foot .copyright p + p {margin-top: 0; } } footer .foot .copyright a {display: inline-block;position: relative;transition: .5s;line-height: 1.0; } footer .foot .copyright a:hover {color: #6DCEF0; } footer .foot .copyright a:active {transform: scale(0.975);transition: .15s; } footer .foot .copyright a + a {margin-left: 20px; } footer .foot .copyright a:after {content: '';display: block;position: absolute;top: 100%;left: 0;width: 100%;height: 1px;background-color: #fff; } @media screen and (min-width: 768px) { footer .foot {/* display: grid;align-items: flex-start;grid-template-columns: 104px 1fr; */flex-direction: row;position: relative; } footer .foot .logo {order: 1;grid-row-start: 1;grid-row-end: 3;margin: 0;width: 106px; } footer .foot .text {display: flex;flex-wrap: wrap;align-items: flex-end;flex-direction: row;flex: 1;order: 2;position: absolute;left: 106px;top: 0;height: 100%;width: calc(100% - 106px); } footer .foot nav,footer .foot .copyright {padding-left: 4.14%; } footer .foot nav,footer .foot .newsletter {align-self: start;width: 50%; } footer .foot nav {order: 1;text-align: left; } footer .foot nav ul { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; row-gap: 7px; column-gap: 75px; } footer .foot nav li {font-size: 13px;letter-spacing: .0623em;line-height: 1.38; margin:0; } footer .foot nav li + li { margin-top: 7px; } footer .foot .newsletter {margin-top: 0; } footer .foot .copyright {display: flex;margin-top: 0;margin-bottom:30px;width: 100%;text-align: left; } footer .foot .copyright p {line-height: 1.44; } footer .foot .copyright p + p { line-height:1.6; margin-left: 0px; } } @media screen and (min-width: 1024px) { footer .foot nav,footer .foot .newsletter {padding-top: 18px; } footer .foot nav {width: auto; } footer .foot nav li + li {margin-top: 0; } footer .foot .newsletter {padding-left: 123px; } footer .foot .copyright p + p { line-height:1.44; margin-left: 20px; } } @media screen and (min-width: 1440px) and (min-height: 560px) { footer .foot {grid-template-columns: 7.222vw 1fr; } footer .foot .logo {width: 6.3611vw; } footer .foot .text {left: 6.3611vw; width: calc(100% - 6.3611vw); } footer .foot nav,footer .foot .newsletter {padding-top: 1.25vw; } footer .foot nav ul {row-gap: .486vw;column-gap: 5.2083vw; } footer .foot nav li {font-size: .9027vw; } footer .foot .newsletter {padding-left: 8.5416vw; } footer .foot .newsletter a span {font-size: .9722vw; } footer .foot .copyright p {font-size: .7638vw; } } header { position: fixed; z-index: 5; top: 0; left: 0; width: 100%; pointer-events: none; background-color:#2A3CAC; } header + .main { padding-top: 0px; } @media (min-width: 800px) { header + .main { padding-top: 82px; } } @media (min-width: 1024px) { header + .main { padding-top: 240px; } } header .center { display: flex; justify-content: space-between; align-items: center; position: relative; margin: auto; padding: 16px 4.266%; } @media (min-width: 860px) { header .center { justify-content: center; padding: 32px 5.55%; } } @media screen and (min-width: 1024px) { header .center { padding: 20px 5.55%; } } header .logo { position: relative; z-index: 2; width: 100px; pointer-events: all; } header .logo .vertical { display: none; } header .logo .vertical svg { overflow: visible; } @media (min-width: 1024px) { header .logo { width: 206px; } } @media screen and (min-width: 1440px) and (min-height: 560px) { header .logo { width: 10.305vw; } } header .logo a { display: block; transition: .35s; } header .logo a:active { transform: scale(0.95); transition: .15s; } header .hamburger {position: relative;z-index: 2;width: 32px;height: 24px;cursor: pointer;pointer-events: all;color: #ffffff;transition: .35s; } header .hamburger:before, header .hamburger:after { content: ''; } header .hamburger:before, header .hamburger:after,header .hamburger span { display: block; position: absolute; left: 0; width: 100%; height: 2px; background-color: #fff; transition: transform .35s, top .35s, bottom .35s; } header .hamburger:before { top: 0; } header .hamburger span { top: 50%; margin-top: -1px; } header .hamburger:after { bottom: 0; } header .hamburger:hover, header .hamburger:focus { transform: scale(0.9); opacity: .7; } header .hamburger:hover:before, header .hamburger:hover:after, header .hamburger:focus:before, header .hamburger:focus:after { width: 100%; } header .hamburger:active { transform: translate3d(0, 1px, 0) scale(0.8); transition: .15s; } @media (min-width: 860px) { header .hamburger { display: none; } } header nav {position: fixed;top: 0;left: 0;width: 100vw;height: 100vh;z-index: 1;background-color: #2A3CAC;opacity: 0;transition: .35s; } header nav.is-open { opacity: 1; pointer-events: all; } header nav ul { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; padding: 50px 4.266%; } header nav li { color: #ffffff; } header nav li a span { display: inline-block; color: #ffffff; transition: .5s; } header nav li a:hover span { color: #6DCEF0; } header nav li a:active span { color:#6DCEF0; transform: scale(0.975); transition: .15s; } @media (max-width: 859px) { header nav li { font-family: 'Avenir-Heavy', sans-serif; font-weight: 600; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 30px;line-height: 1.3; letter-spacing: 0.08px; margin-bottom:20px; } header nav li + li { margin-top: .25em; } } @media (min-width: 860px) { header nav { position: absolute; width: 100%; height: 100%; background-color: #2A3CAC; opacity: 1; pointer-events: all; } header nav ul { flex-direction: row; justify-content: space-between; padding: 0 5.55%; } header nav li { font-family: calvert_mt_stdregular, 'Avenir-Heavy', sans-serif; font-weight: 600; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 17px; letter-spacing: .0623em; line-height: 1.35; margin-right:19%; } header nav li:nth-child(2n) { margin-right: 35%; } } @media (min-width: 1200px) { header nav li:nth-child(2n) { margin-right: 10%; } } @media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) { header nav li:nth-child(2n) { margin-right: 35%; } } @media all and (device-width: 1080px) and (device-height: 810px) and (orientation:landscape) { header nav li:nth-child(2n) { margin-right: 38%; } } @media all and (min-device-width: 768px) and (max-device-width: 1200px) { header nav li:nth-child(2n) { margin-right: 35%; } } @media (min-width: 1200px) { header nav li:nth-child(2n) { margin-right: 40%; } } @media (min-width: 1440px) { header nav li { font-size: 1.180vw; } } .home header .center { align-items: flex-start; transition: .35s; } @media screen and (min-width: 860px) { .home header .center { padding-top: 25px; } } .home header .logo { position: relative; z-index: 2; pointer-events: all; } .home header .logo svg path { fill: #b0e0e6; } .home header .logo .horizontal svg { opacity: 0; } .home header .logo .vertical { position: absolute; transform: translateX(-50%); top: 0; left: 50%; display: block; width: 61px; transition: transform .15s; } @media (min-width: 1024px) { .home header .logo .vertical { width: 122px; } } @media screen and (min-width: 1440px) and (min-height: 560px) { .home header .logo .vertical { width: 8.4722vw; } } .home header nav ul { transition: .35s; /* @media screen and (min-width: 860px) { padding-bottom: 60px; } @media screen and (min-width: 1024px) { padding-bottom: 120px; } @media screen and (min-width: 1440px) { padding-bottom: 8.3333vw; } */ } .home header.is-compact .center { padding-top: 16px; } @media (min-width: 860px) { .home header.is-compact .center { padding-top: 32px; } } @media screen and (min-width: 1024px) { .home header.is-compact .center { padding-top: 50px; } } .home header.is-compact .logo { /* .horizontal { display: block; } .vertical { display: none; } */ } .home header.is-compact .logo .horizontal img {opacity: 1;transition: 0s linear 1s; } .home header.is-compact .logo .vertical {opacity: 0;pointer-events: none;transition: 0s linear 1s; } .home header.is-compact .logo .vertical img {transform: scale(0.775);transition: 1s cubic-bezier(0.22, 0.61, 0.36, 1); } @media screen and (min-width: 1024px) {.home header.is-compact .logo .vertical img {transform: translateY(1.5%) scale(0.795); } } .modals {display: block;position: fixed;z-index: 10;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.61);opacity: 0;pointer-events: none;transition: .5s; } .modals.is-active {opacity: 1;pointer-events: all; } .modals .modal {position: absolute;bottom: 50%;right: 50%;transform: translate3d(50%, 60%, 0);max-width: 590px;width: 100%;padding-top: 20px;padding-bottom: 20px;background: #fff;opacity: 0;pointer-events: none;transition: .35s; } .modals .modal.is-open {transform: translate3d(50%, 50%, 0);opacity: 1;pointer-events: all;transition-delay: .15s; } .modals .modal.is-open iframe {display: block; } .modals .modal .close {display: block;position: absolute;z-index: 2;top: 28px;right: 30px;width: 28px;height: 28px;cursor: pointer;transition: .35s; } .modals .modal .close:before, .modals .modal .close:after {content: '';display: block;position: absolute;top: 50%;left: 50%;width: 100%;height: 1px;background-color: #111111;transition: .35s; } .modals .modal .close:before {transform: translate3d(-50%, -50%, 0) rotate(45deg); } .modals .modal .close:after {transform: translate3d(-50%, -50%, 0) rotate(-45deg); } .modals .modal .close:hover:before, .modals .modal .close:hover:after {background-color: #6DCEF0; } .modals .modal .close:active {transform: scale(0.8);transition: .15s; } .modals .modal > div {overflow: hidden; } .modals .modal.contact > div {height: 502px; } .modals .modal.newsletter > div {height: 334px; } .modals .modal iframe {display: none;height: 100% !important; } @media screen and (min-width: 768px) { .modals .modal {transform: translateY(10%);bottom: 0;right: 0;min-width: 590px;width: 40.9722vw;padding-top: 40px;padding-bottom: 40px; } .modals .modal.is-open {transform: translateY(0); } } @media screen and (min-width: 1200px) {.modals .modal {padding-top: 6.5277vw;padding-bottom: 5.1388vw; } } .e404 { } .e404 section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.e404 section .center {padding: 0 5.55%; } } .e404 .intro {width: 100%;color: #fff;background-color: #2A3CAC; /* .whitespace {vertical-align: top; &:before { content: '\00A0'; }} */ } .e404 .intro .center {padding-top: 70px;padding-bottom: 199px; } .e404 .intro .text {margin: auto;text-align: center; } .e404 .intro .word {overflow: hidden; } .e404 .intro h1 {/* display: flex;flex-wrap: wrap; */ } .e404 .intro h1 + p {margin-top: 10px; } .e404 .mcont {width: 100%; color: #121212; background-color:#fff; } .e404 .mcont p + .btn {margin-top: 30px; } @media (min-width: 375px) {.e404 .mcont .text {max-width: 84%; } } @media screen and (min-width: 768px) { .e404 .mcont .center {padding-top: 125px;padding-bottom: 170px; } .e404 .mcont .text {padding-top: 0; margin: auto; text-align: center; color:#121212 } } @media screen and (min-width: 1280px) {.e404 .mcont .text {max-width: 64%; } } .e404 .mcont .text .btn span { display: inline-block; color: #6DCEF0; transition: .5s;} .e404 footer { padding-top: 200px; } @media screen and (min-width: 768px) { .e404 footer { padding-top: 221px; } } .main.about {background-color: #2A3CAC; } .main.about footer {padding-top: 107px; } @media screen and (min-width: 768px) {.main.about footer {padding-top: 246px; } } .main.about section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.main.about section .center {padding: 0 5.55%; } } .main.about section { /* h2, p {display: flex; flex-wrap: wrap;} */ /* .whitespace {vertical-align: top; &:before { content: '\00A0';}} */ } .main.about section .word {overflow: hidden; } .main.about .hero .image { /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview {img {transform: scale(1);opacity: 1;} } */ } .main.about .hero img {width: 100%; } .main.about .intro {color: #ffffff;background-color: #2A3CAC; /* .whitespace {vertical-align: top; &:before {content: '\00A0';}} */ } .main.about .intro .center { padding-top: 170px; padding-bottom: 199px; } @media screen and (min-width: 768px) { .main.about .intro .center { padding-top: 70px; padding-bottom: 300px; } } .main.about .intro .word {overflow: hidden; } @media screen and (min-width: 1024px) {.main.about .intro .headline {padding-top: 0; padding-bottom:3vh; } } .main.about .intro h1 { /* display: flex;flex-wrap: wrap; */ } @media (min-width: 375px) {.main.about .intro h1 {max-width: 84%; } } @media screen and (min-width: 768px) { .main.about .intro h1 {padding-top: 0; } } @media screen and (min-width: 1280px) {.main.about .intro h1 {max-width: 64%; } } .main.about .clients {color: #121212;background-color: #ffffff; } .main.about .clients h2 {line-height: 1; color:#2A3CAC; } .main.about .clients h4 { line-height:1; } .main.about .clients h5 {font-family: 'calvert_mt_stdregular','Avenir-Book', sans-serif; color:#2A3CAC; font-size:7vw; } @media screen and (min-width: 768px) { .main.about .clients h5 { font-size:2vw; } } .main.about .clients .center {padding-bottom: 93px; } .main.about .clients .image .social { position:relative; margin:30px; font-size:60px; float:right; } .main.about .clients .row:first-child .image {margin-bottom: -104px; } .main.about .clients .row:first-child .image img {transform: translateY(-104px); } .main.about .clients .row:first-child .image + .text {margin-top: 70px; } .main.about .clients .row:first-child .text {max-width: 67.466vw; } .main.about .clients .row:first-child + .row {margin-top: 74px; } .main.about .clients .row:nth-child(2) .image img {margin-left: auto;width: 53.866vw; } .main.about .clients .row:nth-child(2) .image + .text {margin-top: 35px; } @media screen and (min-width: 1024px) { .main.about .clients .center {padding-top: 41px;padding-bottom: 141px; } .main.about .clients .row {display: flex; } .main.about .clients .row:first-child .image { /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview { img {transform: scale(1); opacity: 1;}} */ margin-bottom: 0; width: calc(50% + 30px); padding-top: 119px; } .main.about .clients .row:first-child .image img { transform: none; width: 78.56%; } .main.about .clients .row:first-child .text { width: calc(50% - 30px); } .main.about .clients .row:first-child + .row { margin-top: 83px; } .main.about .clients .row:nth-child(2) { position: relative; } .main.about .clients .row:nth-child(2) .image { /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview { img {transform: scale(1); opacity: 1; }} */ position: absolute; bottom: 100%; right: 0; width: calc(50% - 30px); } .main.about .clients .row:nth-child(2) .image img { width: 49.423%; } .main.about .clients .row:nth-child(2) .image + .text { margin-top: 0; } .main.about .clients .row:nth-child(2) .text { width: calc(50% + 30px); } .main.about .clients .image .social { position:absolute; right:0; font-size:120px; } } @media screen and (min-width: 1280px) {.main.about .clients .row:nth-child(2) .image {bottom: calc(100% + 30px); } } @media screen and (min-width: 1440px) and (min-height: 560px) {.main.about .clients .row:first-child .text h2 {width: 72.181%; color:#2A3CAC; } } .main.about .more {color: #ffffff;background-color: #2A3CAC; } .main.about .more .center {padding-top: 90px; } .main.about .more .text + .pages {margin-top: 93px; } .main.about .more h2 {text-align: center;justify-content: center; } .main.about .more .h3 {font-family: calvert_mt_stdregular, 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale; } .main.about .more .page .image picture {display: block;overflow: hidden; } .main.about .more .page .image img {width: 100%; } .main.about .more .page .text {transform: translateY(20px);opacity: 0; } .main.about .more .page .text.is-inview {transform: translateY(0);opacity: 1;transition: 1s; } .main.about .more .page:first-child .image picture {width: 76.923%; } .main.about .more .page:nth-child(2) .text {text-align: right; } .main.about .more .page .image + .text {margin-top: 18px; } .main.about .more .page + .page {margin-top: 58px; } @media screen and (min-width: 768px) { .main.about .more .center {padding-top: 155px; } .main.about .more .text + .pages {margin-top: 134px; } .main.about .more h2 {margin: auto;width: 75vw; } .main.about .more h3 {display: inline-block; } .main.about .more .pages {display: flex;align-items: center;margin: auto;width: 90vw; } .main.about .more .page a {display: block;pointer-events: none;transition: .5s; } .main.about .more .page a .image,.main.about .more .page a h3 { pointer-events: all; } .main.about .more .page a .image img { transition: .5s; } .main.about .more .page a h3 { transition: .5s; } .main.about .more .page a:hover .image img { transform: scale(1.05); transition: .5s; } .main.about .more .page a:hover h3 { color: #6DCEF0; } .main.about .more .page a:active { transform: scale(0.975); transition: .15s; } .main.about .more .page:first-child {flex: 1;position: relative;z-index: 2; } .main.about .more .page:first-child .image picture { width: 120.634%; } .main.about .more .page:nth-child(2) {width: 65.1933%; } .main.about .more .page .image + .text {margin-top: 20px; } .main.about .more .page + .page {margin-top: 0; } } @media screen and (min-width: 1024px) { .main.about .more h2 {width: 60.625vw; } .main.about .more .pages {width: 85vw; } } @media screen and (min-width: 1280px) {.main.about .more .pages {width: 75.4166vw; } } .main.careers { background-color: #333333; color: #ffffff; } .main.careers footer { padding-top: 200px; } @media screen and (min-width: 768px) { .main.careers footer { padding-top: 221px; } } .main.careers section .center { margin: auto; padding: 0 6.66%; } @media screen and (min-width: 768px) { .main.careers section .center { padding: 0 8.3333%; } } .main.careers .perks .label,.main.careers .perks .p,.main.careers .perks .h6,.main.careers .open .label,.main.careers .open .p,.main.careers .open .h6,.main.careers .press .label,.main.careers .press .p,main.careers .press .h6 {transform: translateY(20px);opacity: 0; } .main.careers .perks .label.is-inview,.main.careers .perks .p.is-inview,.main.careers .perks .h6.is-inview,.main.careers .open .label.is-inview,.main.careers .open .p.is-inview,.main.careers .open .h6.is-inview,.main.careers .press .label.is-inview,.main.careers .press .p.is-inview,.main.careers .press .h6.is-inview {transform: translateY(0);opacity: 1;transition: 1s; } .main.careers .intro { /* h1 {display: flex;flex-wrap: wrap;} .whitespace {vertical-align: top; &:before {content: '\00A0';} } */ } .main.careers .intro .center {padding-top: 46px; } .main.careers .intro .word {overflow: hidden; } .main.careers .intro .text + .image {margin-top: 51px; } .main.careers .intro .image { /* picture { display: block;overflow: hidden; transition: .5s; } img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview { img {transform: scale(1); opacity: 1; }} */ } .main.careers .intro .image img {width: 100%; } .main.careers .intro .image + .caption {margin-top: 17px; } .main.careers .intro .caption {text-align: right; } @media screen and (min-width: 768px) { .main.careers .intro .text + .image {margin-top: 31px; } .main.careers .intro .image + .caption {margin-top: 11px; } } .main.careers .perks {margin-top: 159px; } .main.careers .perks .label + .h6 {margin-top: 10px; } .main.careers .perks .h6 {width: 80%; } @media screen and (min-width: 768px) { .main.careers .perks {margin-top: 89px; } .main.careers .perks .h6 { width: 55.833vw; } } .main.careers .open {margin-top: 159px; } .main.careers .open .label + ul,.main.careers .open .label + .p {margin-top: 16px; } .main.careers .open .p + ul {margin-top: 16px; } .main.careers .open li {transform: translateY(50%);opacity: 0; } .main.careers .open li.is-inview {transform: translateY(0);opacity: 1;transition: 1s; } .main.careers .open li a span {display: inline-block;color: #ffffff;transition: .5s; } .main.careers .open li a span:before { top: 90%; } .main.careers .open li a:hover span {color: #6DCEF0; } .main.careers .open li a:active span {transform: scale(0.975);transition: .15s; } .main.careers .open li + li {margin-top: 13px; } .main.careers .open .right {margin-top: 79px; } @media screen and (min-width: 1024px) { .main.careers .open .center {display: flex; } .main.careers .open .left,.main.careers .open .right {width: 50%; } .main.careers .open .left {padding-right: 20px; } .main.careers .open .right {margin-top: 111px;padding-left: 20px; } } .main.careers .team {position: relative;z-index: 2;margin-top: 159px; } .main.careers .team h2 + .members {margin-top: 83px; } .main.careers .team ul {display: grid;grid-template-columns: 1fr;row-gap: 40px; } .main.careers .team ul li {display: flex;flex-direction: column; } .main.careers .team ul .image {order: 1; } .main.careers .team ul .image img { width: 100%; } .main.careers .team ul .text {margin-top: 20px;order: 2; } .main.careers .team ul .text h3 { font-family: 'Avenir-Heavy', sans-serif; font-weight: 600; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .main.careers .team ul .text h3 + .p { margin-top: 20px; } .main.careers .team ul .text .p p + p { margin-top: .5em; } .main.careers .team ul .text strong { font-family: 'Avenir-Heavy', sans-serif; font-weight: 600; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media screen and (min-width: 500px) {.main.careers .team ul .image img {width: 50%; } } @media screen and (min-width: 768px) { .main.careers .team h2 + .members {margin-top: 141px; } .main.careers .team ul {grid-template-columns: 1fr 1fr;row-gap: 80px;column-gap: 40px; } .main.careers .team ul .image img { width: 100%; } } @media screen and (min-width: 1024px) { .main.careers .team h2 {margin-left: -4vw;width: 100%; } .main.careers .team ul {grid-template-columns: 1fr 1fr;row-gap: 120px;column-gap: 80px; } .main.careers .team ul li { position: relative; } .main.careers .team ul li:nth-child(4n + 1) .text h3 { margin-left: 40%; padding-left: 20px; } .main.careers .team ul li:nth-child(4n + 1) .image { left: -10%; top: -10%; } .main.careers .team ul li:nth-child(4n + 2) { margin-top: 15%; } .main.careers .team ul li:nth-child(4n + 2) .text h3 { margin-right: 40%; padding-right: 20px; } .main.careers .team ul li:nth-child(4n + 2) .image { right: -10%; top: -20%; } .main.careers .team ul li:nth-child(4n + 3) .text { padding-top: 15%; } .main.careers .team ul li:nth-child(4n + 3) .image { left: 25%; } .main.careers .team ul li:nth-child(4n + 4) .image { bottom: -10%; left: -10%; } .main.careers .team ul li:hover .image img { opacity: .1; } .main.careers .team ul .image { position: absolute; width: 50%; pointer-events: none; } .main.careers .team ul .image img { width: 100%; transition: .35s; } .main.careers .team ul .text { margin-top: 0; } .main.careers .team ul .text h3 + .p { margin-top: 40px; } } @media screen and (min-width: 1200px) {.main.careers .team ul {grid-template-columns: 1fr 1fr;row-gap: 200px;column-gap: 200px; } } @media screen and (min-width: 1440px) { .main.careers .team ul li:nth-child(4n + 1) .text h3 {padding-left: 40px; } .main.careers .team ul li:nth-child(4n + 1) .text .p {margin-left: 25%; } .main.careers .team ul li:nth-child(4n + 1) .image {top: -15%; } .main.careers .team ul li:nth-child(4n + 2) .text .p {margin-right: 15%; } .main.careers .team ul li:nth-child(4n + 2) .image {right: 0;top: -20%; } .main.careers .team ul li:nth-child(4n + 4) .text {padding-left: 15%; } .main.careers .team ul li:nth-child(4n + 4) .image {bottom: -15%; } } .main.careers .founder {position: relative;z-index: 2;margin-top: 159px; } .main.careers .founder h2 {width: 80%; } .main.careers .founder .row + .row {margin-top: 83px; } .main.careers .founder .text + .image {margin-top: 42px; } .main.careers .founder .text + .press {margin-top: 83px; } .main.careers .founder .image { /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview {img {transform: scale(1);opacity: 1;}} */ } .main.careers .founder .image img {margin-left: auto;width: 100%; } .main.careers .founder .h5 {line-height: 1.5; } .main.careers .founder .h5 p {transform: translateY(20px);opacity: 0; } .main.careers .founder .h5 p.is-inview { transform: translateY(0); opacity: 1; transition: 1s; } .main.careers .founder .press {text-align: center; } .main.careers .founder .press .label + ul {margin-top: 66px; } .main.careers .founder .press li {transform: translateY(20px);opacity: 0; } .main.careers .founder .press li.is-inview { transform: translateY(0); opacity: 1; transition: 1s; } .main.careers .founder .press li + li { margin-top: 68px; } .main.careers .founder .press img {margin: auto; } @media screen and (min-width: 768px) { .main.careers .founder .row:nth-child(2) .text {width: 80%; } .main.careers .founder .image,.main.careers .founder .press {margin-left: auto;width: 35vw;margin-right: 2.5694vw; } .main.careers .founder .press .label + ul {margin-top: 89px; } .main.careers .founder .press li + li {margin-top: 91px; } .main.careers .founder .press img {display: inline-block; } } @media screen and (min-width: 1024px) { .main.careers .founder {margin-top: 0; } .main.careers .founder .row { display: flex; } .main.careers .founder .row:first-child .text { margin-top: 15.277vw; padding-bottom: 7.9166vw; } .main.careers .founder .row:nth-child(2) .text { width: 60vw; padding-right: 8.4027vw; padding-bottom: 9.6527vw; } .main.careers .founder .row + .row { margin-top: 0; } .main.careers .founder .text { width: 60vw; } .main.careers .founder .text + .image { margin-top: 0; } .main.careers .founder h2 { margin-left: -4vw; width: 100%; } .main.careers .founder .image,.main.careers .founder .press { width: 25vw; } .main.careers .founder .press { padding-top: 9.6527vw; } .main.careers .founder .press img { max-width: 90%; } } @media screen and (min-width: 1440px) and (min-height: 560px) { .main.careers .founder .row:nth-child(2) {align-items: flex-end; } .main.careers .founder .row:nth-child(2) .text { padding-right: 0; width: 44.861vw; } .main.careers .founder .row + .row {margin-top: -2.1527vw; } .main.careers .founder .text {width: 44.861vw; } .main.careers .founder .image,.main.careers .founder .press {flex: 1;width: 30vw;padding-left: 8.4027vw; } } .main.news_blk { background-color: #333333; color: #ffffff; } .main.news_blk footer { padding-top: 200px; } @media screen and (min-width: 768px) { .main.news_blk footer { padding-top: 221px; } } .main.news_blk section .center { margin: auto; padding: 0 6.66%; } @media screen and (min-width: 768px) { .main.news_blk section .center { padding: 0 8.3333%; } } .main.news_blk .news {position: relative;z-index: 2;margin-top: 159px; } .main.news_blk .news h2 + .items {margin-top: 83px; } .main.news_blk .news ul {display: grid;grid-template-columns: 1fr;row-gap: 40px; } .main.news_blk .news ul li {display: flex;flex-direction: column; } .main.news_blk .news ul .image {order: 1; } .main.news_blk .news ul .image img { width: 100%; } .main.news_blk .news ul .text {margin-top: 20px;order: 2; } .main.news_blk .news ul .text h3 { font-family: 'Avenir-Heavy', sans-serif; font-weight: 600; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .main.news_blk .news ul .text h3 + .p { margin-top: 20px; } .main.news_blk .news ul .text .p p + p { margin-top: .5em; } .main.news_blk .news ul .text strong { font-family: 'Avenir-Heavy', sans-serif; font-weight: 600; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } @media screen and (min-width: 500px) {.main.news_blk .news ul .image img {width: 50%; } } @media screen and (min-width: 768px) { .main.news_blk .news h2 + .items {margin-top: 141px; } .main.news_blk .news ul {grid-template-columns: 1fr 1fr;row-gap: 80px;column-gap: 40px; } .main.news_blk .news ul .image img { width: 100%; } } @media screen and (min-width: 1024px) { .main.news_blk .news h2 {margin-left: -4vw;width: 100%; } .main.news_blk .news ul {grid-template-columns: 1fr 1fr;row-gap: 120px;column-gap: 80px; } .main.news_blk .news ul li { position: relative; } .main.news_blk .news ul li:nth-child(4n + 1) .text h3 { margin-left: 40%; padding-left: 20px; } .main.news_blk .news ul li:nth-child(4n + 1) .image { left: -10%; top: -10%; } .main.news_blk .news ul li:nth-child(4n + 2) { margin-top: 15%; } .main.news_blk .news ul li:nth-child(4n + 2) .text h3 { margin-right: 40%; padding-right: 20px; } .main.news_blk .news ul li:nth-child(4n + 2) .image { right: -10%; top: -20%; } .main.news_blk .news ul li:nth-child(4n + 3) .text { padding-top: 15%; } .main.news_blk .news ul li:nth-child(4n + 3) .image { left: 25%; } .main.news_blk .news ul li:nth-child(4n + 4) .image { bottom: -10%; left: -10%; } .main.news_blk .news ul li:hover .image img { opacity: .1; } .main.news_blk .news ul .image { position: absolute; width: 50%; pointer-events: none; } .main.news_blk .news ul .image img { width: 100%; transition: .35s; height:auto; } .main.news_blk .news ul .text { margin-top: 0; } .main.news_blk .news ul .text h3 + .p { margin-top: 40px; } } @media screen and (min-width: 1200px) {.main.news_blk .news ul {grid-template-columns: 1fr 1fr;row-gap: 200px;column-gap: 200px; } } @media screen and (min-width: 1440px) { .main.news_blk .news ul li:nth-child(4n + 1) .text h3 {padding-left: 40px; } .main.news_blk .news ul li:nth-child(4n + 1) .text .p {margin-left: 25%; } .main.news_blk .news ul li:nth-child(4n + 1) .image {top: -15%; } .main.news_blk .news ul li:nth-child(4n + 2) .text .p {margin-right: 15%; } .main.news_blk .news ul li:nth-child(4n + 2) .image {right: 0;top: -20%; } .main.news_blk .news ul li:nth-child(4n + 4) .text {padding-left: 15%; } .main.news_blk .news ul li:nth-child(4n + 4) .image {bottom: -15%; } } .device-mobile .main.contact .mcont2 .center {padding-top: 30px;padding-bottom: 30px; } .main.contact {background-color: #2A3CAC; } .main.contact footer {padding-top: 107px; } @media screen and (min-width: 768px) {.main.contact footer {padding-top: 181px; } } .main.contact section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.main.contact section .center {padding: 0 5.55%; } } .main.contact .intro { color: #ffffff;background-color: #2A3CAC;} @media screen and (min-width: 1024px) {.main.contact .intro .headline {padding-top: 0; padding-bottom:3vh; } } @media screen and (min-width: 1280px) {.main.contact .intro h1 {max-width: 64%; } } .main.contact .intro .word {overflow: hidden; } .main.contact .intro .center {padding-top: 170px; } @media screen and (min-width: 768px) { .main.contact .intro .center {padding-top: 70px; } } .main.contact .intro .text + .image {margin-top: 70px; } .main.contact .intro h1 + .p {margin-top: 22px; } .main.contact .intro .image { margin-bottom: -70px; } .main.contact .intro .image picture {margin-left: auto;margin-right: -6.66vw; } @media screen and (min-width: 768px) {.main.contact .intro .image picture {margin-right: -5.55vw; } } @media screen and (min-width: 1024px) { .main.contact .intro {padding-bottom: 19.513vw; } .main.contact .intro .center {position: relative; } .main.contact .intro .text {width: 54.583vw; } .main.contact .intro .text .p {width: 93.256%; } .main.contact .intro .text + .image {margin-top: -6vw; } .main.contact .intro .image {position: absolute;top: 100%;right: 0;margin: 0; } .main.contact .intro .image picture {/* position: absolute;bottom: -11.805vw;right: 0; */margin: 0; } .main.contact .intro .image img {width: 31.666vw; } } .main.contact .midImage {position: relative;z-index: 2;margin-top: 70px;margin-bottom: -70px; } .main.contact .midImage .image picture {margin-left: auto;margin-right: -6.66vw; } @media screen and (min-width: 768px) {.main.contact .midImage .image picture {margin-right: -5.55vw; } } @media screen and (min-width: 1024px) { .main.contact .midImage {margin-top: -6vw; } .main.contact .midImage .image {position: absolute;top: 0;right: 0;margin: 0; } .main.contact .midImage .image picture {/* position: absolute;bottom: -11.805vw;right: 0; */position: absolute;top: 0;right: 0;transform: translateY(-50%);width: 31.666vw;margin: 0; } .main.contact .midImage .image img {width: 100%; } } .main.contact .mcont {color: #121212;background-color: #ffffff; } .main.contact .mcont .center {padding-top: 140px;padding-bottom: 95px; } .main.contact .mcont .text h2 {color: #2A3CAC; } .main.contact .mcont .text h2 + .p {margin-top: 20px; } .main.contact .mcont .text h4 {color: #2A3CAC; } .main.contact .mcont .text .p p {transform: translateY(20px);opacity: 0; } .main.contact .mcont .text .p.is-inview p {transform: translateY(0);opacity: 1;transition: 1s; } .main.contact .mcont .text + .title {margin-top: 77px; } @media screen and (min-width: 1024px) { .main.contact .mcont .center {padding-top: 0;padding-bottom: 140px; } } @media screen and (min-width: 1280px) { .main.contact .mcont .center { padding-top:110px; padding-bottom: 210px; } } /* .main.contact {background-color: #ffffff;background-color: #333333; } .main.contact footer {padding-top: 71px; } @media screen and (min-width: 768px) {.main.contact footer {padding-top: 141px; } } .main.contact .intro {color: #ffffff;background-color: #333333; } .main.contact .intro .center {margin: auto;padding: 70px 6.66%; } @media screen and (min-width: 768px) {.main.contact .intro .center {padding: 24px 5.55% 117px; } } .main.contact .intro .image {position: relative; } .main.contact .intro .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 58.737%; } .main.contact .intro .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.contact .intro .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.contact .intro .image + .text {margin-top: 48px; } .main.contact .intro h1 {overflow: hidden; } .main.contact .intro h1 + h2 {margin-top: 24px; } .main.contact .intro h2 {} .main.contact .intro h2 .word {overflow: hidden; } .main.contact .intro li {text-align: right; font-size:1.25vw; line-height:1.44; } .main.contact .intro li + li {margin-top: .8333em; } @media screen and (min-width: 768px) { .main.contact .intro h1 {font-size: 29px; } .main.contact .intro .image {width: 100%;margin-left: 5.55vw; } .main.contact .intro .ct + .text {margin-top: 72px; } .main.contact .intro .map {width: 100%;margin-left: 5.55vw; } .main.contact .intro .map + .text {margin-top: 72px; } } @media screen and (min-width: 1024px) { .main.contact .intro .image {margin-left: auto;margin-right: -5.55vw;width: 57.2222vw; } .main.contact .intro .image + .text {position: relative;z-index: 2;margin-top: -11.875vw; } .main.contact .intro .map {margin-left: auto;margin-right: -5.55vw;width: 57.2222vw; } .main.contact .intro .map + .text {position: relative;z-index: 2;margin-top: -11.875vw; } .main.contact .intro .text {pointer-events: none; } .main.contact .intro h1,.main.contact .intro h2 {width: 65vw; } } @media screen and (min-width: 1280px) { .main.contact .intro h1,.main.contact .intro h2 {width: 45.347vw; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.main.contact .intro h1 {font-size: 2.0138vw; } } .main.contact .mcont {position: relative;z-index: 2;color: #121212;background-color: #ffffff;overflow: hidden; } .main.contact .mcont + section {position: relative;z-index: 2; } .main.contact .mcont + section:before {content: '';display: block;position: absolute;bottom: 100%;left: 0;width: 100%;height: 2px;background-color: #333333; } .main.contact .mcont .center {margin: auto;padding: 70px 6.66% 0; } @media screen and (min-width: 768px) {.main.contact .mcont .center {padding: 146px 5.55%; } } .main.contact .mcont .text h2 + .p {margin-top: 15px; } .main.contact .mcont .text + .images {margin-top: 70px; } .main.contact .mcont .label {overflow: hidden; } .main.contact .mcont .p p {transform: translateY(20px);opacity: 0; } .main.contact .mcont .p p.is-inview, .main.contact .mcont .p.is-inview p {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } .main.contact .mcont .images {transition-timing-function: linear; } .main.contact .mcont .images li { padding: 0 10px;} .main.contact .mcont .images li img {margin: auto;width: 100%; } @media screen and (min-width: 768px) {.main.contact .mcont .text {margin-left: auto;margin-right: auto;width: 80%;text-align: center; } } @media screen and (min-width: 1024px) { .main.contact .mcont .text {width: 53.8194vw; } .main.contact .mcont .text + .images {margin-top: 143px; } .main.contact .mcont .text h2 { font-size:24px; font-weight:bold; } .main.contact .mcont .swiper {margin: auto;max-width: 45.5555vw; } .main.contact .mcont .images {display: flex;position: relative;cursor: grab; } .main.contact .mcont .images:active {cursor: grabbing; } .main.contact .mcont .images li { position: relative;z-index: 2;padding: 0 2.6388vw; } } */ .form-field { font-family:calvert_mt_stdregular, 'Avenir-Book', sans-serif; position: relative; margin: 0 2% 25px 2%; font-size: 16px; width:46%; } .form-field label { /*position: absolute; left: 1rem; top: 0.644444444rem;*/ -webkit-transition: all 0.25s ease-out; transition: all 0.25s ease-out; } .form-field.non-empty label { top: -7px; left: 0; margin-top: -10px; font-size: 16px; opacity: 0.7; } .form-field.non-empty .form-control { border-color: #121212; } .form-field.non-empty .form-control:focus { border-color: #121212; } .form-field-cb label { position: absolute; left: 2rem; top: 0; -webkit-transition: all 0.25s ease-out; transition: all 0.25s ease-out; } .form-field-cb .form-field { margin:0 0 0.77777778rem 0; } .form-field-sel label { position: absolute; left: 2rem; top: 0; -webkit-transition: all 0.25s ease-out; transition: all 0.25s ease-out; } .form-field-submit { width:100%; } .form-field-submit .htmlISubmit, .form-field-submit button { border:0; width:50%; font-size:40px; background-color:#2A3CAC; color:#fff; line-height:1; padding: 10px 10px 15px 10px; cursor: pointer; font-family: calvert_mt_stdregular, 'Avenir-Book', sans-serif; } @media (max-width:768px){ .form-field-submit .htmlISubmit, .form-field-submit button { width:100%; } } .form-field-submit .htmlISubmit:hover, .form-field-submit button:hover { background-color:#6DCEF0; } .htmlIText { width:100%; height: auto; background-color: #ededea ; border: 2px solid #aaa; font-size: 20px; color: #121212; padding: 0.5rem; border-width: 0 0 2px; -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-transition: all 0.25s ease-out; transition: all 0.25s ease-out; } .htmlIText:focus { border-color: #121212; } .htmlIMemo { width:100%; height: 150px; background-color: #ededea; border: 2px solid #aaa; font-size: 20px; color: #121212; padding: 0.5rem; border-width: 0 0 2px; -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-transition: all 0.25s ease-out; transition: all 0.25s ease-out; } /*.htmlIMemo { width:100%; border-width: 2px; padding: 0.5rem; height: 6.66666667rem; background-color:transparent; }*/ .form-field .tfvHighlight { color:red !important; } .grecaptcha-badge { right:-290px !important ; } .grecaptcha-badge:hover { right:-100px !important ; } .contact-form { margin-top: 6rem; } @media (max-width:768px){ .form-field { width:96%; margin-right:0; } .form-field .htmlIMemo { width:100%; margin-right:0; } } .main.caseStudies footer { padding-top: 110px; } @media screen and (min-width: 768px) { .main.caseStudies footer { padding-top: 186px; } } .main.caseStudies section .center { margin: auto; padding: 0 6.66%; } @media screen and (min-width: 768px) { .main.caseStudies section .center { padding: 0 5.55%; } } .main.caseStudies section .word { overflow: hidden; } .main.caseStudies section h1,.main.caseStudies section h2,.main.caseStudies section h3 { display: inline-flex; flex-wrap: wrap; } .main.caseStudies section .whitespace { vertical-align: top; } .main.caseStudies section .whitespace:before { content: '\00A0'; } .main.caseStudies .intro {color: #ffffff;background-color: #333333; } .main.caseStudies .intro .text h1 {font-size: 50px;line-height: 1.2; } .main.caseStudies .intro .text + .featured {margin-top: 83px; } .main.caseStudies .intro .center {padding-top: 70px;padding-bottom: 66px; } @media screen and (min-width: 768px) {.main.caseStudies .intro .center {padding-top: 75px; } } @media screen and (min-width: 768px) { .main.caseStudies .intro .center {padding-bottom: 9.6527vw; } .main.caseStudies .intro .container {position: relative; } .main.caseStudies .intro .text h1 {width: auto;font-size: 70px; } .main.caseStudies .intro .text h1 {position: absolute;z-index: 2;top: 50%;left: 0;margin-top: -1em; } .main.caseStudies .intro .text + .featured {margin-top: 0; } .main.caseStudies .intro .study {margin-left: auto;margin-right: auto;width: 66.25vw;padding-left: 6.25vw; } .main.caseStudies .intro .study .image:before {padding-top: 64.032%; } } @media screen and (min-width: 1024px) {.main.caseStudies .intro .study {width: 57.222vw; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.main.caseStudies .intro .text h1 {font-size: 4.86111vw; } } .main.caseStudies .studies {position: relative;z-index: 2;color: #ffffff; } .main.caseStudies .studies li + li {margin-top: 66px; } @media screen and (min-width: 768px) { .main.caseStudies .studies li + li {margin-top: 9.6527vw; } .main.caseStudies .studies .study:nth-child(4n + 1), .main.caseStudies .studies .study:nth-child(4n + 2) {width: 74vw; } .main.caseStudies .studies .study:nth-child(4n + 1) .image:before, .main.caseStudies .studies .study:nth-child(4n + 2) .image:before {padding-top: 63.6363%; } .main.caseStudies .studies .study:nth-child(4n + 2) {margin-left: auto; } .main.caseStudies .studies .study:nth-child(4n + 3) .image:before, .main.caseStudies .studies .study:nth-child(4n + 4) .image:before {padding-top: 64.032%; } .main.caseStudies .studies .study:nth-child(4n + 3) {width: 60vw; } .main.caseStudies .studies .study:nth-child(4n + 4) {margin-left: auto;margin-right: auto;width: 66.25vw;padding-left: 6.25vw; } } @media screen and (min-width: 1024px) { .main.caseStudies .studies .study:nth-child(4n + 1), .main.caseStudies .studies .study:nth-child(4n + 2) {width: 61.1111vw; } .main.caseStudies .studies .study:nth-child(4n + 3) {width: 50.972vw; } .main.caseStudies .studies .study:nth-child(4n + 4) {width: 57.222vw; } } .main.caseStudies .study .category {text-align: right; } .main.caseStudies .study .category .label {justify-content: flex-end;font-size: 14px; } .main.caseStudies .study .category + .image {margin-top: 9px; } .main.caseStudies .study .image { position: relative; /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview {img {transform: scale(1);opacity: 1;}} */ } .main.caseStudies .study .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 61.5384%; } .main.caseStudies .study .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.caseStudies .study .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.caseStudies .study .image + .title {margin-top: 14px; } .main.caseStudies .study .title h2 {position: relative;font-size: 24px;transition: .5s; } .main.caseStudies .study .title h2:before {content: '';position: absolute;transform-origin: 100% 50%;transform: scale3d(0, 1, 1);width: 100%;height: 1px;background: #fff;top: 100%;left: 0;pointer-events: none;transition: transform 0.5s; } .main.caseStudies .study a {transition: .5s; } .main.caseStudies .study a .image picture {display: block;overflow: hidden; } .main.caseStudies .study a .image img {transition: .5s; } .main.caseStudies .study a:hover .image img {transform: scale(1.05); } .main.caseStudies .study a:hover .title h2 {color: #6DCEF0; } .main.caseStudies .study a:hover .title h2:before {transform-origin: 0% 50%;transform: scale3d(1, 1, 1); } .main.caseStudies .study a:active {transform: scale(0.975);transition: .15s; } @media screen and (min-width: 768px) { .main.caseStudies .study a {display: block;pointer-events: none; } .main.caseStudies .study a .label,.main.caseStudies .study a .image,.main.caseStudies .study a h2 {pointer-events: all; } .main.caseStudies .study .category .label {font-size: 18px; } .main.caseStudies .study .title h2 {font-size: 39px; } } @media screen and (min-width: 1440px) and (min-height: 560px) { .main.caseStudies .study .category .label {font-size: 1.25vw; } .main.caseStudies .study .title h2 {font-size: 4.6388vw; } } .main.caseStudies .brands {position: relative;z-index: 2;color: #ffffff;background-color: #333333; } .main.caseStudies .brands .center {padding-top: 95px; } .main.caseStudies .brands p {text-align: center; } .main.caseStudies .brands p + ul {margin-top: 100px; } .main.caseStudies .brands ul {display: flex;align-items: center;justify-content: center;width: 100%; } @media screen and (max-width: 639px) {.main.caseStudies .brands ul { width: 200%; } } .main.caseStudies .brands ul + ul {margin-top: 98px; } .main.caseStudies .brands ul:nth-child(odd) {direction: rtl; } @media screen and (min-width: 768px) {.main.caseStudies .brands ul:last-child { margin-bottom: -98px; } } /*.main.caseStudies .brands li {margin-left: 49px;margin-right: 49px; }*/ .main.caseStudies .brands li a {display: block;transition: .35s; } .main.caseStudies .brands li a:active { transform: scale(0.975); transition: .15s; } .main.caseStudies .brands .hover {position: absolute;z-index: -1;width: 200px;height: 280px;top: 0;left: 0;pointer-events: none;opacity: 0;will-change: transform, filter; } .main.caseStudies .brands .hover__inner {overflow: hidden; } .main.caseStudies .brands .hover__inner,.main.caseStudies .brands .hover__img {width: 100%;height: 100%;position: relative; } .main.caseStudies .brands .hover__img {background-size: cover;background-position: 50% 50%; } @media screen and (max-width: 767px) { .main.caseStudies .brands {padding-bottom: 60px; } .main.caseStudies .brands + .about { padding-top: 60px; } } @media screen and (min-width: 768px) { .main.caseStudies .brands p {margin: auto;max-width: 60%; } .main.caseStudies .brands .center {padding-top: 350px; } .main.caseStudies .brands p + ul {margin-top: 270px; } } .page-template-page-clients { /* .hover { display: none; .image {transform: translate3d(-50%, -50%, 0);position: absolute;top: 50%;left: 50%;opacity: 0; img {width: 100%;height: 100%;object-fit: cover;object-position: center;} } @include bp-medium {display: flex;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;width: 100%;height: 100%; .image {position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);// flex: 0 0 auto;width: 35%;// opacity: 1;} } } .canvas {display: block;} */ } .page-template-page-clients header { position: fixed; } .clients_blk {padding-top: 50px; position: relative;z-index: 2;} @media (min-width: 860px) {.clients_blk {padding-top: 82px; } } @media screen and (min-width: 1024px) {.clients_blk {padding-top: 140px; } } .clients_blk .hover {position: absolute;z-index: -1;width: 200px;height: 280px;top: 0;left: 0;pointer-events: none;opacity: 0;will-change: transform, filter; } .clients_blk .hover__inner {overflow: hidden; } .clients_blk .hover__inner,.clients_blk .hover__img {width: 100%;height: 100%;position: relative; } .clients_blk .hover__img {background-size: cover;background-position: 50% 50%; } .clients_blk footer {padding-top: 114px; } @media screen and (min-width: 768px) {.clients_blk footer {padding-top: 208px; } } .clients_blk section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.clients_blk section .center {padding: 0 5.55%; } } .clients_blk .selected {position: relative;z-index: 2;color: #ffffff; } .clients_blk .selected .center {padding-top: 80px; } .clients_blk .selected .text h1 {overflow: hidden; } .clients_blk .selected .text + .images {margin-top: 89px; } .clients_blk .selected .logos {display: grid;row-gap: 13.333vw; } .clients_blk .selected .logo img {margin: auto; max-height: 20vh; } @media screen and (max-width: 640px) {.clients_blk .selected .logo img {max-width: 40vw; } } .clients_blk .selected .images {position: relative; } .clients_blk .selected .logos {position: relative;z-index: 2; } .clients_blk .selected .logos li {display: flex;align-items: center;justify-content: center; } @media screen and (min-width: 768px) { .clients_blk .selected { /* .hover { display: flex;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;width: 100%;height: 100%; .image {position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);// flex: 0 0 auto;width: 35%;// opacity: 1;} } */ } .clients_blk .selected .center {padding-top: calc(30.104vh - 81px); } .clients_blk .selected .text {text-align: center; } .clients_blk .selected .text + .images {margin-top: 9.1666vw; } .clients_blk .selected .logos {grid-template-columns: 1fr 1fr;row-gap: 96px; } } @media screen and (min-width: 1024px) {.clients_blk .logos {margin: auto;width: 60vw;column-gap: 10vw; } } @media (min-width: 1024px) and (min-height: 768px) {.clients_blk .center {padding-top: calc(30.104vh - 143px); } } @media screen and (min-width: 1280px) {.clients_blk .logos {width: 55.55vw; } } .main.clients {position: relative;z-index: 2; } .main.clients footer {padding-top: 114px; } @media screen and (min-width: 768px) {.main.clients footer {padding-top: 208px; } } .main.clients section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.main.clients section .center {padding: 0 5.55%; } } .main.clients .selected {position: relative;z-index: 2;color: #ffffff; } .main.clients .selected .center {padding-top: 80px; } .main.clients .selected .text h1 {overflow: hidden; } .main.clients .selected .text + .images {margin-top: 89px; } .main.clients .selected .logos {display: grid;row-gap: 13.333vw; } .main.clients .selected .logo img {margin: auto;max-height: 10vh; } @media screen and (max-width: 640px) {.main.clients .selected .logo img {max-width: 40vw; } } .main.clients .selected .images {position: relative; } .main.clients .selected .logos {position: relative;z-index: 2; } .main.clients .selected .logos li {display: flex;align-items: center;justify-content: center; } @media screen and (min-width: 768px) { .main.clients .selected { /* .hover { display: flex;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;width: 100%;height: 100%; .image {position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);// flex: 0 0 auto;width: 35%;// opacity: 1;} } */ } .main.clients .selected .center {padding-top: calc(30.104vh - 81px); } .main.clients .selected .text {text-align: center; } .main.clients .selected .text + .images {margin-top: 9.1666vw; } .main.clients .selected .logos {grid-template-columns: 1fr 1fr;row-gap: 96px; } } @media screen and (min-width: 1024px) {.main.clients .logos {margin: auto;width: 60vw;column-gap: 10vw; } } @media (min-width: 1024px) and (min-height: 768px) {.main.clients .center {padding-top: calc(30.104vh - 143px); } } @media screen and (min-width: 1280px) {.main.clients .logos {width: 55.55vw; } } .main.blogs {position: relative;z-index: 2; } .main.blogs .hover {position: absolute;z-index: -1;width: 200px;height: 280px;top: 0;left: 0;pointer-events: none;opacity: 0;will-change: transform, filter; } .main.blogs .hover__inner {overflow: hidden; } .main.blogs .hover__inner,.main.blogs .hover__img {width: 100%;height: 100%;position: relative; } .main.blogs .hover__img {background-size: cover;background-position: 50% 50%; } .main.blogs footer {padding-top: 114px; } @media screen and (min-width: 768px) {.main.blogs footer {padding-top: 208px; } } .main.blogs section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.main.blogs section .center {padding: 0 5.55%; } } .main.blogs .selected {position: relative;z-index: 2;color: #ffffff; } .main.blogs .selected .center {padding-top: 80px; } .main.blogs .selected .text h1 {overflow: hidden; } .main.blogs .selected .text + ul {margin-top: 89px; } .main.blogs .selected ul {display: grid;row-gap: 13.333vw; position: relative;} /* .main.blogs .selected .logo img {margin: auto;max-height: 10vh; } @media screen and (max-width: 640px) {.main.blogs .selected .logo img {max-width: 40vw; } } */ .main.blogs .selected ul {position: relative;z-index: 2; } .main.blogs .selected ul li {display: flex;align-items: center;justify-content: center; } @media screen and (min-width: 768px) { .main.blogs .selected { /* .hover { display: flex;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;width: 100%;height: 100%; .image {position: absolute;top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);// flex: 0 0 auto;width: 35%;// opacity: 1;} } */ } .main.blogs .selected .center {padding-top: calc(30.104vh - 81px); } .main.blogs .selected .text {text-align: center; font-size:40px; } .main.blogs .selected .text + ul {margin-top: 9.1666vw; } .main.blogs .selected ul {grid-template-columns: 1fr 1fr;row-gap: 96px; } } @media screen and (min-width: 1024px) {.main.blogs ul {margin: auto;width: 60vw;column-gap: 10vw; } } @media (min-width: 1024px) and (min-height: 768px) {.main.blogs .center {padding-top: calc(30.104vh - 143px); } } @media screen and (min-width: 1280px) {.main.blogs ul {width: 55.55vw; } } .device-mobile .main.home .intro { padding-top:80px; padding-bottom: 20px; } @media all and (device-width: 1024px) and (device-height: 768px) and (orientation:landscape) { .device-mobile .main.home .intro { padding-top:130px; } } .device-mobile .main.home .projects,.device-mobile .main.home .about,.device-mobile .main.home .featured.capabilities {padding-top: 60px;padding-bottom: 60px; } .device-mobile .main.home .projects > .center,.device-mobile .main.home .brands > .center,.device-mobile .main.home .about > .center,.device-mobile .main.home .featured.capabilities > .center {padding-top: 0;padding-bottom: 0; } .device-mobile .main.home .brands { padding-top: 280px; padding-bottom: 60px; overflow: hidden; } @media screen and (min-width: 800px) and (max-width: 1200px) { .device-mobile .main.home .brands { padding-top: 520px; padding-bottom: 180px; } } .device-mobile .main.home .brands ul {position: relative; } .device-mobile .main.home .brands ul:nth-last-child(2) {right: 300%; } .device-mobile .main.home .brands ul:nth-last-child(1) {left: 200%; } .device-mobile .main.home .brands .hover {display: none; } .device-mobile .main.home footer {padding-top: 0px; } .device-mobile footer .contact + .instagram { margin-top: 60px; } .main.home {padding-top: 0;background-color: #333333; } .main.home footer {padding-top: 120px; } @media screen and (min-width: 768px) {.main.home footer {padding-top: 180px; } } .main.home section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.main.home section .center {padding: 0 5.55%; } } .main.home .intro {color: #ffffff;background-color: #2A3CAC;padding-bottom: 10px; } .main.home .intro .center {height: 100vh; padding-top: 20px;padding-bottom: 85px; } @media screen and (min-height: 750px) { .main.home .intro .center {display: flex;flex-direction: column;justify-content: center; padding-top: 120px; } .main.home .intro .headline { flex: 1;display: flex;align-items: center; } } .main.home .intro .headline { /*flex: 1;display: flex;align-items: center;*/ /* .headline { flex: 1; display: flex; // flex-wrap: wrap; align-items: center; } .word,.whitespace {white-space: nowrap;overflow: hidden;} .whitespace { vertical-align: top; &:before { content: '\00A0';} } */ } .main.home .intro .headline .word {overflow: hidden; } .main.home .intro h1 {/* flex: 1;display: flex;align-items: center; */ } .main.home .intro h2 {padding-top: 85px;text-align: center; } .main.home .intro h2 div {overflow: hidden; } .main.home .intro h2 div + div { margin-top: .25em; } @media (max-height: 700px) { .main.home .intro h2 div + div { line-height:1.3; }} @media (min-width: 375px) { .main.home .intro h1 {max-width: 84%;padding-top: 85px; } .main.home .intro h2 {padding: 65px 4% 0; } } @media (min-width: 375px) and (max-height:750px) { .main.home .intro h1 {padding-top: 100px; } .main.home .intro h2 {padding: 30px 4% 0; } } @media screen and (min-width: 800px) { .main.home .intro h2 {margin: auto;max-width: 90%; padding: 85px 4% 0; } } @media screen and (min-width: 768px) { .main.home .intro h1 {line-height: .9; padding-top: 0; } .main.home .intro h2 {padding: 0;max-width: 75%; } } @media screen and (min-width: 768px) and (max-height:768px) { .main.home .intro h1 { padding-top: 140px; } } @media screen and (min-width: 1024px) {.main.home .intro .headline {padding-top: 15vh; } } @media screen and (min-width: 1280px) {.main.home .intro h1 {max-width: 64%; }.main.home .intro h2 {max-width: 55%; } } .main.home .projects {background-color: #ededea; } .main.home .projects .center {padding-bottom: 100px; } .main.home .projects h2 {color: #6DCEF0; } .main.home .projects h2 + ul {margin-top: 35px; } .main.home .projects ul {margin: auto; } .main.home .projects li .image {position: relative; } .main.home .projects li .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 113.414%; } .main.home .projects li .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.home .projects li .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.home .projects li .image + .text {padding-top: 30px; } .main.home .projects li h3 {color: #121212; } .main.home .projects li h3 + .btn {margin-top: 18px; } .main.home .projects li .btn span {color: #6DCEF0;transition: .5s; } .main.home .projects li a {transition: .5s; } .main.home .projects li a .image picture {display: block;overflow: hidden; } .main.home .projects li a .image img {transition: .5s; } .main.home .projects li a:hover .image img {transform: scale(1.05); } .main.home .projects li a:hover .btn span {color: #6DCEF0; } .main.home .projects li a:active {transform: scale(0.975);transition: .15s; } .main.home .projects .image { /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview {img {transform: scale(1);opacity: 1;} } */ } @media (min-width: 375px) { .main.home .projects h2 {max-width: 68%; } .main.home .projects li .text {max-width: 82%; } } @media (max-width: 639px) { .main.home .projects ul {max-width: 328px; } .main.home .projects li + li {margin-top: 75px; } } @media (min-width: 640px) and (max-width: 767px) { .main.home .projects ul {display: flex; } .main.home .projects li + li {margin-left: 6.66%; } } @media screen and (min-width: 768px) { .main.home .projects h2 + ul {margin-top: 100px; } .main.home .projects li a {display: flex;pointer-events: none; } .main.home .projects li .image {width: 36%;pointer-events: all; } .main.home .projects li .text {display: flex;flex-direction: column;justify-content: flex-end;max-width: 64%;padding-left: 10.19%;padding-bottom: 30px; } .main.home .projects li .text h3,.main.home .projects li .text .btn { pointer-events: all; } .main.home .projects li + li {margin-top: 80px; } } @media screen and (min-width: 1024px) {.main.home .projects ul {padding-left: 7.055%;padding-right: 7.055%; } } @media screen and (min-width: 1280px) { .main.home .projects ul {padding-left: 14.11%;padding-right: 14.11%; } .main.home .projects li .text {padding-left: 13%; } } .main.home .brands {position: relative;z-index: 2;color: #ffffff;background-color: #000000; background-image:url('/img/Georgina.jpg'); background-repeat:no-repeat; } @media screen and (max-width: 639px) { .main.home .brands h2 { line-height:1; } } @media screen and (max-width: 1200px) { .main.home .brands { background-size:contain; } } .main.home .brands .center {padding-top: 95px; } .main.home .brands p {text-align: center; } .main.home .brands p + ul {margin-top: 100px; } .main.home .brands ul {display: flex;align-items: center;justify-content: center;width: 100%; } @media screen and (max-width: 639px) {.main.home .brands ul { width: 200%; } } .main.home .brands ul + ul {margin-top: 98px; } .main.home .brands ul:nth-child(odd) {direction: rtl; } @media screen and (min-width: 768px) {.main.home .brands ul:last-child { margin-bottom: -98px; } } .main.home .brands li {margin-left: 49px;margin-right: 49px; } .main.home .brands li a {display: block;transition: .35s; } .main.home .brands li a:active { transform: scale(0.975); transition: .15s; } .main.home .brands .hover {position: absolute;z-index: -1;width: 200px;height: 280px;top: 0;left: 0;pointer-events: none;opacity: 0;will-change: transform, filter; } .main.home .brands .hover__inner {overflow: hidden; } .main.home .brands .hover__inner,.main.home .brands .hover__img {width: 100%;height: 100%;position: relative; } .main.home .brands .hover__img {background-size: cover;background-position: 50% 50%; } @media screen and (max-width: 767px) { .main.home .brands {padding-bottom: 60px; } .main.home .brands + .about { padding-top: 60px; } } @media screen and (min-width: 768px) { .main.home .brands p {margin: auto;max-width: 60%; } .main.home .brands .center { padding-top: 750px; padding-bottom: 300px; } .main.home .brands p + ul {margin-top: 270px; } } .main.home .about {background-color: #2A3CAC; } .main.home .about .center {padding-bottom: 100px; } .main.home .about a {color: #ffffff;pointer-events: none; } .main.home .about .image { position: relative; /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview {img {transform: scale(1);opacity: 1;}} */ margin-left: auto; max-width: 71.38%; pointer-events: all; } .main.home .about .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 128.172%; } .main.home .about .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.home .about .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.home .about .image picture {display: block;overflow: hidden; } .main.home .about .image img {transition: .5s; } .main.home .about .image + .text {position: relative;z-index: 2;margin-top: 25px; } .main.home .about h2 {pointer-events: all; font-family: 'calvert_mt_stdregular'; } @media (max-width: 768px) { .main.home .about h2{line-height:1;} } .main.home .about h2 + .btn {margin-top: 16px; } .main.home .about .btn {pointer-events: all; } .main.home .about .btn span {transition: .5s; } .main.home .about a {transition: .5s; } .main.home .about a:hover .image img {transform: scale(1.05); } .main.home .about a:hover .btn span {color: #6DCEF0; } .main.home .about a:active {transform: scale(0.975);transition: .15s; } @media (min-width: 375px) {.main.home .about .text {max-width: 93%; } } @media (min-width: 580px) {.main.home .about .text {max-width: 50%; } } @media screen and (min-width: 768px) { .main.home .about .center {padding-top: 310px;padding-bottom: 77px; } .main.home .about a {color: #ffffff;display: flex; } .main.home .about .image {position: relative;margin: 0;width: 50.51%; } .main.home .about .image:before { content: ''; display: block; width: 100%; height: 0; padding-top: 128.172%; } .main.home .about .image picture { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .main.home .about .image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .main.home .about .text {width: 49.49%;margin-left: -6.41%;padding-top: 30px;padding-bottom: 75px;display: flex;flex-direction: column;justify-content: flex-end; } .main.home .about h2 {width: 120%; } } @media (min-width: 900px) {.main.home .about .center {padding-left: 10%;padding-right: 10%; } } @media screen and (min-width: 1024px) {.main.home .about .center {padding-left: 16%;padding-right: 16%; } } @media screen and (min-width: 1280px) { .main.home .about .center {padding-left: 21.52%;padding-right: 21.52%; } .main.home .about h2 {width: 125%; } } @media screen and (min-width: 1280px) and (min-height: 768px) {.main.home .about .center {padding-left: 310px;padding-right: 310px; } } .main.home .featured {color: #ffffff;background-color: #333333; } .main.home .featured .center {padding-top: 90px;padding-bottom: 100px; } .main.home .featured h2 {text-align: center; } .main.home .featured h2 + ul {margin-top: 70px; } .main.home .featured ul {display: flex;align-items: center; } @media (max-width: 639px) {.main.home .featured ul li img {max-width: 33vw; } } @media (max-width: 767px) { .main.home .featured ul {flex-direction: column; } .main.home .featured li + li {margin-top: 66px; } } @media screen and (min-width: 768px) { .main.home .featured .center {padding-top: 190px;padding-bottom: 230px; } .main.home .featured ul {justify-content: space-around; } .main.home .featured li + li {margin-left: 5vw; } } .main.home .capabilities {color: #121212;background-color: #ffffff; } .main.home .capabilities .center {padding-top: 85px;padding-bottom: 100px; } .main.home .capabilities .text h2 {color: #2A3CAC; } .main.home .capabilities .text h2 + ul {margin-top: 45px; } .main.home .capabilities .text ul,.main.home .capabilities .text .btn {margin-left: 11%; } .main.home .capabilities .text ul + .btn {margin-top: 16px; } .main.home .capabilities .text li {transform: translateY(50%);opacity: 0; } .main.home .capabilities .text li.is-inview {transform: translateY(0);opacity: 1;transition: 1s; } .main.home .capabilities .text .btn span {display: inline-block;color: #6DCEF0;transition: .5s; } .main.home .capabilities .text .btn:hover span {color: #6DCEF0; } .main.home .capabilities .text .btn:active span {transform: scale(0.975);transition: .15s; } .main.home .capabilities .text + .image {margin-top: 45px; } .main.home .capabilities .image { margin-left: auto; max-width: 61%; /* picture {display: block;overflow: hidden;transition: .5s;} img {transform: scale(1.1);opacity: .5;transition: 2s;} &.is-inview {img {transform: scale(1);opacity: 1;}} */ } .main.home .capabilities .image li {position: relative;display: none; } .main.home .capabilities .image li:before {content: '';display: block;width: 100%;height: 0;padding-top: 113.483%; } .main.home .capabilities .image li picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.home .capabilities .image li img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.home .capabilities .image li:first-child {display: block; } @media screen and (min-width: 768px) { .main.home .capabilities .center {display: flex;padding-top: 165px;padding-bottom: 185px; } .main.home .capabilities .text {width: 66%; } .main.home .capabilities .text h2 {display: flex;flex-direction: column; } .main.home .capabilities .text h2 + ul {margin-top: 50px; } .main.home .capabilities .text ul + .btn {margin-top: 30px; } .main.home .capabilities .text + .image {margin-top: 70px; } .main.home .capabilities .image {width: 34%; } } @media screen and (min-width: 1280px) { .main.home .capabilities .text ul, .main.home .capabilities .text .btn { margin-left: 14.44%; margin-left: 19.930%; } .main.home .capabilities .text { width: 72.1875%; } .main.home .capabilities .image { margin-left: -5%; width: 27.8125%; } } .underline span { position: relative; } .underline span:before { content: ''; position: absolute; transform-origin: 0% 50%; transform: scale3d(0, 1, 1); width: 100%; height: 1px; background: #fff; top: 100%; left: 0; pointer-events: none; transition: transform 0.5s; } @media screen and (max-width: 767px) { .underline span:before { transform-origin: 0% 50%; transform: scale3d(0, 1, 1); } } .capabilities .underline span:before, .mcont .underline span:before { background: #6DCEF0; } .underline:hover span:before {transform-origin: 0% 50%;transform: scale3d(1, 1, 1); } a:hover .underline span:before {transform-origin: 0% 50%;transform: scale3d(1, 1, 1); } .splash {position: fixed;z-index: 10;top: 0;left: 0;width: 100%;height: 100%;overflow: hidden; background-color:#2A3CAC; } .splash .wipe {position: absolute;z-index: 2;top: 0;left: 0;width: 100%;height: 100%; } .splash .wipe span {position: absolute;top: 0;width: 100%;height: 100%;background-color: #2A3CAC; } .splash .wipe span:nth-child(1) {left: 0; } .splash .wipe span:nth-child(2) {right: 0; } .splash .images {position: relative;z-index: 1;width: 100%;height: 100%; } .splash .images .image {position: absolute;top: 0;width: 100%;height: 100%;overflow: hidden; } .splash .images .image img {width: 100%;height: 100%;object-fit: cover; } .splash .images .image:nth-child(1) {left: 0; } .splash .images .image:nth-child(2) {right: 0; } .splash .logo {position: absolute;z-index: 3;transform: translate3d(-50%, -50%, 0);top: 50%;left: 50%; } .splash .logo img {width: 300px;opacity: 0; } @media screen and (max-width: 639px) {.splash .wipe span:first-child {display: none; } } @media screen and (min-width: 640px) { .splash .wipe span {width: 50%; } .splash .images .image {width: 50%; } .splash .images .image:nth-child(1) { padding:12%; } } @media screen and (min-width: 1024px) {.splash .logo img {width: 264px; } } @media screen and (min-width: 1440px) {.splash .logo img {width: 21.3888vw; } } .device-mobile .main.project { /* .intro {padding-bottom: 20px;} .projects,.brands,.about,.featured.capabilities { padding-top: 60px;padding-bottom: 60px; > .center {padding-top: 0;padding-bottom: 0;} } footer {padding-top: 80px;} */ } .device-mobile .main.project .intro .image .cursor {top: 50%;left: 50%;transform: translate3d(-50%, -50%, 0);pointer-events: all; } .device-mobile .main.project .impact .center {padding-top: 30px;padding-bottom: 30px; } .main.project {background-color: #ffffff;background-color: #333333; } .main.project footer {padding-top: 71px; } @media screen and (min-width: 768px) {.main.project footer {padding-top: 141px; } } .main.project .intro {color: #ffffff;background-color: #333333; } .main.project .intro .center {margin: auto;padding: 70px 6.66%; } @media screen and (min-width: 768px) {.main.project .intro .center {padding: 24px 5.55% 117px; } } .main.project .intro .image {position: relative; } .main.project .intro .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 58.737%; } .main.project .intro .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.project .intro .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.project .intro .image video {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.project .intro .image .cursor {opacity: 0;pointer-events: none;display: flex;align-items: center;justify-content: center;position: absolute;top: 0;left: 0;width: 100px;height: 100px;border: 1px solid #fff;color: #fff;border-radius: 50%;transition: opacity .35s; } .main.project .intro .image .cursor.is-visible {opacity: 1; } @media screen and (min-width: 1024px) {.main.project .intro .image .cursor {width: 6vw;height: 6vw; } } .main.project .intro .image + .text {margin-top: 48px; } .main.project .intro h1 {overflow: hidden; } .main.project .intro h1 + h2 {margin-top: 24px; } .main.project .intro h2 { /* display: flex; flex-wrap: wrap; */ /* .whitespace {vertical-align: top; &:before {content: '\00A0';}} */ } .main.project .intro h2 .word {overflow: hidden; } .main.project .intro h2 + .categories {margin-top: 48px; } .main.project .intro li {text-align: right; font-size:1.25vw; line-height:1.44; } .main.project .intro li + li {margin-top: .8333em; } @media screen and (min-width: 768px) { .main.project .intro h1 {font-size: 29px; } .main.project .intro .image {width: 100%;margin-left: 5.55vw; } .main.project .intro .image + .text {margin-top: 72px; } } @media screen and (min-width: 1024px) { .main.project .intro .image {margin-left: auto;margin-right: -5.55vw;width: 57.2222vw; } .main.project .intro .image + .text {position: relative;z-index: 2;margin-top: -11.875vw; } .main.project .intro .text {pointer-events: none; } .main.project .intro h1,.main.project .intro h2 {width: 65vw; } .main.project .intro h2 + .categories {margin-top: 0; } } @media screen and (min-width: 1280px) { .main.project .intro h1,.main.project .intro h2 {width: 45.347vw; } .main.project .intro .categories {padding-left: 58.6111vw; } .main.project .intro .categories li {text-align: left; } .main.project .intro .categories li:first-child {margin-top: -1em; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.main.project .intro h1 {font-size: 2.0138vw; } } .main.project .brief {position: relative;z-index: 2;color: #121212;background-color: #ffffff;overflow: hidden; } .main.project .brief + section {position: relative;z-index: 2; } .main.project .brief + section:before {content: '';display: block;position: absolute;bottom: 100%;left: 0;width: 100%;height: 2px;background-color: #333333; } .main.project .brief .center {margin: auto;padding: 70px 6.66% 0; } @media screen and (min-width: 768px) {.main.project .brief .center {padding: 146px 5.55% 0; } } .main.project .brief .text h2 + .p {margin-top: 15px; } .main.project .brief .text + .gallery,.main.project .brief .text + .swiper,.main.project .brief .text + .images {margin-top: 70px; } .main.project .brief .label {overflow: hidden; } .main.project .brief .p p {transform: translateY(20px);opacity: 0; } .main.project .brief .p p.is-inview, .main.project .brief .p.is-inview p {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } .main.project .brief .gallery {position: relative; } .main.project .brief .gallery:before {content: '';display: block;position: absolute;bottom: 0;left: -50vw;width: 200vw;height: 66.596%;background-color: #333333; } .main.project .brief .gallery:after {content: '';display: block;position: absolute;top: 100%;left: -50vw;width: 200vw;height: 1px;background-color: #333333; } .main.project .brief .images {transition-timing-function: linear; } .main.project .brief .images li { padding: 0 10px; /* &:last-child {margin-bottom: -20vw;} */ /* + li {margin-top: 6.66vw;} */ } .main.project .brief .images li img {margin: auto;width: 100%; } @media screen and (min-width: 768px) {.main.project .brief .text {margin-left: auto;margin-right: auto;width: 80%;text-align: center; } } @media screen and (min-width: 1024px) { .main.project .brief .text {width: 53.8194vw; } .main.project .brief .text + .gallery,.main.project .brief .text + .swiper,.main.project .brief .text + .images {margin-top: 143px; } .main.project .brief .text h2 { font-size:24px; font-weight:bold; } .main.project .brief .swiper {margin: auto;max-width: 45.5555vw; } .main.project .brief .images {display: flex;position: relative;cursor: grab; } .main.project .brief .images:active {cursor: grabbing; } .main.project .brief .images li { position: relative;z-index: 2;padding: 0 2.6388vw; /* &:nth-child(n + 4) {display: none;} + li {margin-top: 0;margin-left: 5.347vw;} */ } } .main.project .impact {padding-top: 20vw;color: #ffffff;background-color: #333333; } .main.project .impact .center {margin: auto;padding: 90px 6.66% 90px; } @media screen and (min-width: 768px) {.main.project .impact .center {padding: 142px 8.3333% 133px; } } .main.project .impact h2 {/* display: flex;flex-wrap: wrap; *//* .whitespace {vertical-align: top; &:before {content: '\00A0';}} */ } .main.project .impact h2 .word {overflow: hidden; } .main.project .impact h2 + .h5 {margin-top: 24px; } .main.project .impact .h5 {line-height: 1.4; } /* .main.project .impact .h5 p {transform: translateY(20px);opacity: 0; } .main.project .impact .h5 p.is-inview {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } */ .main.project .impact .h5 p {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } .main.project .impact .h5 + .stats { margin-top: 90px; } .main.project .impact .stats { text-align: right; } .main.project .impact .stats li { display: flex; align-items: flex-start; flex-direction: column; text-align: left; } .main.project .impact .stats li + li { margin-top: 38px; } .main.project .impact .stats .h1 + .label { margin-top: 10px; } @media screen and (min-width: 768px) { .main.project .impact h2 + .h5 { margin-top: 58px; } } @media screen and (min-width: 1024px) { .main.project .impact { padding-top: 0; } .main.project .impact .center { display: flex; flex-wrap: wrap; } .main.project .impact h2 { margin-left: -4vw; width: 69vw; font-size:30px; font-weight:bold; } .main.project .impact .h5 { width: 60%; } .main.project .impact .h5 + .stats { margin-top: 58px; } .main.project .impact .stats { width: 40%; padding-left: 8.3333vw; } .main.project .impact .stats li { align-items: flex-start; } } @media screen and (min-width: 1280px) { .main.project .impact .h5 {width: 44.861vw; } .main.project .impact .stats {flex: 1;width: auto;padding-left: 10.5555vw;text-align: center; } .main.project .impact .stats ul {display: inline-block; } } @media screen and (min-width: 1280px) {.main.project .impact h2 {width: 51.18055vw; } } .main.project .press {position: relative;z-index: 2;color: #ffffff;background-color: #333333; } .main.project .press .center {margin: auto;padding: 90px 6.66% 90px; } @media screen and (min-width: 768px) {.main.project .press .center {padding: 90px 8.3333% 90px; } } .main.project .press .text + .images {margin-top: 96px; } .main.project .press .label {overflow: hidden; } .main.project .press .label + .logos {margin-top: 48px; } .main.project .press .logos {display: flex;justify-content: center;align-items: center; } .main.project .press li {flex: 1; } .main.project .press li img {margin: auto;max-height: 10vh; } .main.project .press li + li {margin-left: 6.66vw; } .main.project .press .images .image {display: none;box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5); } .main.project .press .images .image img {width: 100%; } .main.project .press .images .image.is-active {display: block; } @media screen and (max-width: 639px) { .main.project .press .label {text-align: center; } .main.project .press ul {flex-direction: column; } .main.project .press li img {max-width: 40vw; } .main.project .press li + li {margin-left: 0;margin-top: 40px; } } @media screen and (min-width: 768px) { .main.project .press .label + .logos {margin-top: 58px; } .main.project .press .images {margin: auto;width: 75vw; } .main.project .press li img {max-width: 15vw; } } @media screen and (min-width: 1024px) { .main.project .press .center {padding-top: 0; } .main.project .press .images {width: 66vw; } .main.project .press li img {max-width: 12vw; } } @media screen and (min-width: 1280px) {.main.project .press .images {width: 50.347vw; } } .main.project .next {position: relative;z-index: 2;color: #ffffff;background-color: #6DCEF0; } .main.project .next .center {margin: auto;padding: 90px 6.66% 70px; } @media screen and (min-width: 768px) {.main.project .next .center {padding: 123px 8.3333% 140px; } } .main.project .next .label {overflow: hidden; } .main.project .next .label + .project {margin-top: 36px; } .main.project .next .project .text {text-align: right; } .main.project .next .project .text.is-inview h3 {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } .main.project .next .project .text h3 {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;transform: translateY(20px);opacity: 0; } .main.project .next .project .text + .image {margin-top: 14px; } .main.project .next .project .image {position: relative; } .main.project .next .project .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 61.9496%; } .main.project .next .project .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.project .next .project .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.project .next .project a {transition: .5s; } .main.project .next .project a .image picture {display: block;overflow: hidden; } .main.project .next .project a .image img {transition: .5s; } .main.project .next .project a h3 span {transition: .5s; } .main.project .next .project a:hover .image img {transform: scale(1.05); } .main.project .next .project a:hover h3 span {color: #6DCEF0; } .main.project .next .project a:active {transform: scale(0.975);transition: .15s; } @media screen and (min-width: 768px) { .main.project .next .label {text-align: center; } .main.project .next .project {margin: auto;width: 80%; } .main.project .next .project a {display: flex;align-items: center;pointer-events: none; } .main.project .next .project a .text h3 {display: inline;pointer-events: all; } .main.project .next .project a .image {pointer-events: all; } .main.project .next .project .text {width: 55%;padding-right: 5.0694vw;text-align: right; } .main.project .next .project .text + .image {margin-top: 0; } .main.project .next .project .image {width: 45%; } } @media screen and (min-width: 1024px) { .main.project .next .project {width: 55.625vw; } .main.project .next .project a {margin-left: -5.03472vw;width: 100%; } .main.project .next .project .text {flex: 1;width: auto; } .main.project .next .project .image {width: 22.0833vw; } } .device-mobile .main.npost .bcont2 .center {padding-top: 30px;padding-bottom: 30px; } .main.npost {background-color: #ffffff;background-color: #333333; } .main.npost footer {padding-top: 71px; } @media screen and (min-width: 768px) {.main.npost footer {padding-top: 141px; } } .main.npost .intro {color: #ffffff;background-color: #333333; } .main.npost .intro .center {margin: auto;padding: 70px 6.66%; } @media screen and (min-width: 768px) {.main.npost .intro .center {padding: 24px 5.55% 117px; } } .main.npost .intro .image {position: relative; } .main.npost .intro .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 58.737%; } .main.npost .intro .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.npost .intro .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.npost .intro .image + .text {margin-top: 48px; } .main.npost .intro h1 {overflow: hidden; } .main.npost .intro h1 + h2 {margin-top: 24px; } .main.npost .intro h2 { /* display: flex; flex-wrap: wrap; */ /* .whitespace {vertical-align: top; &:before {content: '\00A0';}} */ } .main.npost .intro h2 .word {overflow: hidden; } .main.npost .intro h2 + .ninfo {margin-top: 48px; } .main.npost .intro li {text-align: right; font-size:1.25vw; line-height:1.44; } .main.npost .intro li + li {margin-top: .8333em; } @media screen and (min-width: 768px) { .main.npost .intro h1 {font-size: 29px; } .main.npost .intro .image {width: 100%;margin-left: 5.55vw; } .main.npost .intro .image + .text {margin-top: 72px; } } @media screen and (min-width: 1024px) { .main.npost .intro .image {margin-left: auto;margin-right: -5.55vw;width: 57.2222vw; } .main.npost .intro .image + .text {position: relative;z-index: 2;margin-top: -11.875vw; } .main.npost .intro .text {pointer-events: none; } .main.npost .intro h1,.main.npost .intro h2 {width: 65vw; } .main.npost .intro h2 + .ninfo {margin-top: 0; } } @media screen and (min-width: 1280px) { .main.npost .intro h1,.main.npost .intro h2 {width: 45.347vw; } .main.npost .intro .ninfo {padding-left: 58.6111vw; } .main.npost .intro .ninfo li {text-align: left; } .main.npost .intro .ninfo li:first-child {margin-top: -1em; } } @media screen and (min-width: 1440px) and (min-height: 560px) {.main.npost .intro h1 {font-size: 2.0138vw; } } .main.npost .bcont1 {position: relative;z-index: 2;color: #121212;background-color: #ffffff;overflow: hidden; } .main.npost .bcont1 + section {position: relative;z-index: 2; } .main.npost .bcont1 + section:before {content: '';display: block;position: absolute;bottom: 100%;left: 0;width: 100%;height: 2px;background-color: #333333; } .main.npost .bcont1 .center {margin: auto;padding: 70px 6.66% 0; } @media screen and (min-width: 768px) {.main.npost .bcont1 .center {padding: 146px 5.55% 0; } } .main.npost .bcont1 .text h2 + .p {margin-top: 15px; } .main.npost .bcont1 .text + .images {margin-top: 70px; } .main.npost .bcont1 .label {overflow: hidden; } .main.npost .bcont1 .p p {transform: translateY(20px);opacity: 0; } .main.npost .bcont1 .p p.is-inview, .main.npost .bcont1 .p.is-inview p {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } .main.npost .bcont1 .images {transition-timing-function: linear; } .main.npost .bcont1 .images li { padding: 0 10px; /* &:last-child {margin-bottom: -20vw;} */ /* + li {margin-top: 6.66vw;} */ } .main.npost .bcont1 .images li img {margin: auto;width: 100%; } @media screen and (min-width: 768px) {.main.npost .bcont1 .text {margin-left: auto;margin-right: auto;width: 80%;text-align: center; } } @media screen and (min-width: 1024px) { .main.npost .bcont1 .text {width: 53.8194vw; } .main.npost .bcont1 .text + .images {margin-top: 143px; } .main.npost .bcont1 .text h2 { font-size:24px; font-weight:bold; } .main.npost .bcont1 .images {display: flex;position: relative;cursor: grab; } .main.npost .bcont1 .images:active {cursor: grabbing; } .main.npost .bcont1 .images li { position: relative;z-index: 2;padding: 0 2.6388vw; /* &:nth-child(n + 4) {display: none;} + li {margin-top: 0;margin-left: 5.347vw;} */ } } .main.npost .bcont2 {padding-top: 20vw;color: #ffffff;background-color: #333333; } .main.npost .bcont2 .center {margin: auto;padding: 90px 6.66% 90px; } @media screen and (min-width: 768px) {.main.npost .bcont2 .center {padding: 142px 8.3333% 133px; } } .main.npost .bcont2 h2 {/* display: flex;flex-wrap: wrap; *//* .whitespace {vertical-align: top; &:before {content: '\00A0';}} */ } .main.npost .bcont2 h2 .word {overflow: hidden; } .main.npost .bcont2 h2 + .h5 {margin-top: 24px; } .main.npost .bcont2 .h5 {line-height: 1.4; } /* .main.npost .bcont2 .h5 p {transform: translateY(20px);opacity: 0; } .main.npost .bcont2 .h5 p.is-inview {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } */ .main.npost .bcont2 .h5 p {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } @media screen and (min-width: 768px) { .main.npost .bcont2 h2 + .h5 { margin-top: 58px; } } @media screen and (min-width: 1024px) { .main.npost .bcont2 { padding-top: 0; } .main.npost .bcont2 .center { display: flex; flex-wrap: wrap; } .main.npost .bcont2 h2 { margin-left: -4vw; width: 69vw; font-size:30px; font-weight:bold; } .main.npost .bcont2 .h5 { width: 60%; } } @media screen and (min-width: 1280px) { .main.npost .bcont2 .h5 {width: 44.861vw; } } @media screen and (min-width: 1280px) {.main.npost .bcont2 h2 {width: 51.18055vw; } } .main.npost .next {position: relative;z-index: 2;color: #ffffff;background-color: #6DCEF0; } .main.npost .next .center {margin: auto;padding: 90px 6.66% 70px; } @media screen and (min-width: 768px) {.main.npost .next .center {padding: 123px 8.3333% 140px; } } .main.npost .next .label {overflow: hidden; } .main.npost .next .label + .npost {margin-top: 36px; } .main.npost .next .npost .text {text-align: right; } .main.npost .next .npost .text.is-inview h3 {transform: translateY(0);opacity: 1;transition: 1s;transition-delay: .5s; } .main.npost .next .npost .text h3 {font-family: 'Avenir-Book', sans-serif;font-weight: 400;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;transform: translateY(20px);opacity: 0; } .main.npost .next .npost .text + .image {margin-top: 14px; } .main.npost .next .npost .image {position: relative; } .main.npost .next .npost .image:before {content: '';display: block;width: 100%;height: 0;padding-top: 61.9496%; } .main.npost .next .npost .image picture {position: absolute;top: 0;left: 0;width: 100%;height: 100%; } .main.npost .next .npost .image img {position: absolute;top: 0;left: 0;width: 100%;height: 100%;object-fit: cover; } .main.npost .next .npost a {transition: .5s; } .main.npost .next .npost a .image picture {display: block;overflow: hidden; } .main.npost .next .npost a .image img {transition: .5s; } .main.npost .next .npost a h3 span {transition: .5s; } .main.npost .next .npost a:hover .image img {transform: scale(1.05); } .main.npost .next .npost a:hover h3 span {color: #6DCEF0; } .main.npost .next .npost a:active {transform: scale(0.975);transition: .15s; } @media screen and (min-width: 768px) { .main.npost .next .label {text-align: center; } .main.npost .next .npost {margin: auto;width: 80%; } .main.npost .next .npost a {display: flex;align-items: center;pointer-events: none; } .main.npost .next .npost a .text h3 {display: inline;pointer-events: all; } .main.npost .next .npost a .image {pointer-events: all; } .main.npost .next .npost .text {width: 55%;padding-right: 5.0694vw;text-align: right; } .main.npost .next .npost .text + .image {margin-top: 0; } .main.npost .next .npost .image {width: 45%; } } @media screen and (min-width: 1024px) { .main.npost .next .npost {width: 55.625vw; } .main.npost .next .npost a {margin-left: -5.03472vw;width: 100%; } .main.npost .next .npost .text {flex: 1;width: auto; } .main.npost .next .npost .image {width: 22.0833vw; } } .main.services {background-color: #2A3CAC; } .main.services footer {padding-top: 107px; } @media screen and (min-width: 768px) {.main.services footer {padding-top: 181px; } } .main.services section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.main.services section .center {padding: 0 5.55%; } } .main.services .intro { color: #ffffff;background-color: #2A3CAC;} @media screen and (min-width: 1024px) {.main.services .intro .headline {padding-top: 0; padding-bottom:3vh; } } @media screen and (min-width: 1280px) {.main.services .intro h1 {max-width: 64%; } } .main.services .intro .word {overflow: hidden; } .main.services .intro .center {padding-top: 170px; } @media screen and (min-width: 768px) { .main.services .intro .center {padding-top: 70px; } } .main.services .intro .text + .image {margin-top: 70px; } .main.services .intro h1 + .p {margin-top: 22px; } .main.services .intro .image { margin-bottom: -70px; } .main.services .intro .image picture {margin-left: auto;margin-right: -6.66vw; } @media screen and (min-width: 768px) {.main.services .intro .image picture {margin-right: -5.55vw; } } @media screen and (min-width: 1024px) { .main.services .intro {padding-bottom: 19.513vw; } .main.services .intro .center {position: relative; } .main.services .intro .text {width: 54.583vw; } .main.services .intro .text .p {width: 93.256%; } .main.services .intro .text + .image {margin-top: -6vw; } .main.services .intro .image {position: absolute;top: 100%;right: 0;margin: 0; } .main.services .intro .image picture {/* position: absolute;bottom: -11.805vw;right: 0; */margin: 0; } .main.services .intro .image img {width: 31.666vw; } } .main.services .midImage {position: relative;z-index: 2;margin-top: 70px;margin-bottom: -70px; } .main.services .midImage .image picture {margin-left: auto;margin-right: -6.66vw; } @media screen and (min-width: 768px) {.main.services .midImage .image picture {margin-right: -5.55vw; } } @media screen and (min-width: 1024px) { .main.services .midImage {margin-top: -6vw; } .main.services .midImage .image {position: absolute;top: 0;right: 0;margin: 0; } .main.services .midImage .image picture {/* position: absolute;bottom: -11.805vw;right: 0; */position: absolute;top: 0;right: 0;transform: translateY(-50%);width: 31.666vw;margin: 0; } .main.services .midImage .image img {width: 100%; } } .main.services .sblk {color: #121212;background-color: #ffffff; } .main.services .sblk .center {padding-top: 140px;padding-bottom: 95px; } .main.services .sblk .text h2 {color: #2A3CAC; line-height:0.9; } .main.services .sblk .text h2 + .p {margin-top: 20px; } .main.services .sblk .text .p p {transform: translateY(20px);opacity: 0; } .main.services .sblk .text .p.is-inview p {transform: translateY(0);opacity: 1;transition: 1s; } .main.services .sblk .text + .title,.main.services .sblk .text + ul {margin-top: 77px; } .main.services .sblk .title + ul {margin-top: 35px; } .main.services .sblk ul {display: grid;row-gap: 60px; } @media (min-width: 640px) {.main.services .sblk ul {grid-template-columns: 1fr 1fr;column-gap: 6.66vw;margin: auto;width: 80vw; } } .main.services .sblk li .h6 + .h5 {margin-top: 12px; } .main.services .sblk li .label + .h5 {margin-top: 12px; width:92%; } .main.services .sblk li p {transform: translateY(20px);opacity: 0; } .main.services .sblk li.is-inview p {transform: translateY(0);opacity: 1;transition: 1s; } .main.services .sblk li.is-inview p + p {transition-delay: .25s; } .main.services .sblk li p.label { color:#2A3CAC; font-size: 30px; font-weight:bold; text-transform: uppercase; line-height: 1; margin-bottom: 20px; width:92%; } @media (min-width: 768px) { .main.services .sblk li p.label { font-size:40px; } } @media screen and (min-width: 1024px) { .main.services .sblk .center {padding-top: 0;padding-bottom: 140px; } .main.services .sblk .text {width: 50.069vw; padding-top:50px; } .main.services .sblk .text + .title,.main.services .sblk .text + ul {margin-top: 155px; } .main.services .sblk .title + ul {margin-top: 75px; } .main.services .sblk ul {row-gap: 9.0972vw;column-gap: 17.4305vw;width: 75vw; } .main.services .sblk li .label + .h5 {margin-top: 1em; font-weight:normal; } .main.services .sblk li:hover::before { content:url('/img/ball.png'); position:absolute; top:-100px; left:-100px; } } @media screen and (min-width: 1280px) { .main.services .sblk .center {padding-bottom: 210px; } .main.services .sblk ul {row-gap: 9.0972vw;width: 62.708vw; } } .main.blogs {background-color: #2A3CAC; } .main.blogs footer {padding-top: 107px; } @media screen and (min-width: 768px) {.main.blogs footer {padding-top: 181px; } } .main.blogs section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.main.blogs section .center {padding: 0 5.55%; } } .main.blogs .intro { color: #ffffff;background-color: #2A3CAC;} @media screen and (min-width: 1024px) {.main.blogs .intro .headline {padding-top: 15vh; padding-bottom:3vh; } } .main.blogs .intro .word {overflow: hidden; } .main.blogs .intro .center {padding-top: 70px; } .main.blogs .intro .text + .image {margin-top: 70px; } .main.blogs .intro h1 + .p {margin-top: 22px; } .main.blogs .intro .image { margin-bottom: -70px; } .main.blogs .intro .image picture {margin-left: auto;margin-right: -6.66vw; } @media screen and (min-width: 768px) {.main.blogs .intro .image picture {margin-right: -5.55vw; } } @media screen and (min-width: 1024px) { .main.blogs .intro {padding-bottom: 19.513vw; } .main.blogs .intro .center {position: relative; } .main.blogs .intro .text {width: 54.583vw; } .main.blogs .intro .text .p {width: 93.256%; } .main.blogs .intro .text + .image {margin-top: -6vw; } .main.blogs .intro .image {position: absolute;top: 100%;right: 0;margin: 0; } .main.blogs .intro .image picture {/* position: absolute;bottom: -11.805vw;right: 0; */margin: 0; } .main.blogs .intro .image img {width: 31.666vw; } } .main.blogs .bblk {color: #121212;background-color: #ffffff; } .main.blogs .bblk .center {padding-top: 140px;padding-bottom: 95px; } .main.blogs .bblk .text h2 {color: #2A3CAC; line-height:0.9; } .main.blogs .bblk .text h2 + .p {margin-top: 20px; } .main.blogs .bblk .text .p p {transform: translateY(20px);opacity: 0; } .main.blogs .bblk .text .p.is-inview p {transform: translateY(0);opacity: 1;transition: 1s; } .main.blogs .bblk .text + .title,.main.blogs .bblk .text + ul {margin-top: 77px; } .main.blogs .bblk .title + ul {margin-top: 35px; } .main.blogs .bblk ul {display: grid;row-gap: 60px; } .main.blogs .bblk li .h6 + .h5,.main.blogs .bblk li .label + .h5 {margin-top: 12px; } .main.blogs .bblk li p {transform: translateY(20px);opacity: 0; } .main.blogs .bblk li.is-inview p {transform: translateY(0);opacity: 1;transition: 1s; } .main.blogs .bblk li.is-inview p + p {transition-delay: .25s; } .main.blogs .bblk li p.label { color:#2A3CAC; font-size: 40px; font-weight:bold; text-transform: uppercase; line-height: 1; margin-bottom: 20px; } @media (min-width: 640px) {.main.blogs .bblk ul {grid-template-columns: 1fr 1fr;column-gap: 6.66vw;margin: auto;width: 80vw; } } @media screen and (min-width: 1024px) { .main.blogs .bblk .center {padding-top: 0;padding-bottom: 140px; } .main.blogs .bblk .text {width: 50.069vw; padding-top:50px; } .main.blogs .bblk .text + .title,.main.blogs .bblk .text + ul {margin-top: 155px; } .main.blogs .bblk .title + ul {margin-top: 75px; } .main.blogs .bblk ul {row-gap: 9.0972vw;column-gap: 17.4305vw;width: 75vw; } .main.blogs .bblk li .label + .h5 {margin-top: 1em; } .main.blogs .bblk li:hover::before { content:url('/img/ball.png'); position:absolute; top:-100px; left:-100px; } } @media screen and (min-width: 1280px) { .main.blogs .bblk .center {padding-bottom: 210px; } .main.blogs .bblk ul {row-gap: 9.0972vw;width: 62.708vw; } } .default {display: flex;align-items: center;justify-content: center; } .default section .center {margin: auto;padding: 0 6.66%; } @media screen and (min-width: 768px) {.default section .center {padding: 0 40% 0 5.55%; } } .default .intro {width: 100%;color: #ffffff;background-color: #2A3CAC; /* .whitespace {vertical-align: top; &:before { content: '\00A0'; }} */ padding-top:82px; } @media screen and (min-width: 768px) { .default .intro { padding-top:0; } } .default .intro .center {padding-top: 150px;padding-bottom: 150px; } @media screen and (min-width: 768px) { .default .intro .center { padding-top: 70px;padding-bottom: 199px; } } .default .intro .text { margin-top:15px; } .default .intro .word {overflow: hidden; } .default .intro h1 {/* display: flex;flex-wrap: wrap; */ } .default .intro h1 + p {margin-top: 10px; } .default .intro p + .btn {margin-top: 30px; } @media (min-width: 375px) {.default .intro .text {max-width: 84%; } } @media screen and (min-width: 768px) { .default .intro .text {padding-top: 0; } } .default .midImage {position: relative;z-index: 2;margin-top: 20px; margin-bottom: -70px; } @media screen and (min-width: 768px) { .default .midImage { margin-top:70px; } } .default .midImage .image picture {margin-left: auto;margin-right: -6.66vw; } @media screen and (min-width: 768px) {.default .midImage .image picture {margin-right: -5.55vw; } } @media screen and (min-width: 1024px) { .default .midImage {margin-top: -6vw; } .default .midImage .image {position: absolute;top: 0;right: 0;margin: 0; } .default .midImage .image picture {/* position: absolute;bottom: -11.805vw;right: 0; */position: absolute;top: 0;right: 0;transform: translateY(-50%);width: 31.666vw;margin: 0; } .default .midImage .image img {width: 100%; } } .default .mcont {color: #121212;background-color: #ffffff; } .default .mcont .center {padding-top: 140px;padding-bottom: 95px; } .default .mcont .text h2 {color: #2A3CAC; } .default .mcont .text h3 {color: #2A3CAC; font-size:30px; font-family:'calvert_mt_stdregular','Avenir-Book', sans-serif; margin:15px 0; line-height:1; } .default .mcont .text h2 + .p {margin-top: 20px; } .default .mcont .text h4 {color: #2A3CAC; } .default .mcont .text .p p {transform: translateY(20px);opacity: 0; } .default .mcont .text .p.is-inview p {transform: translateY(0);opacity: 1;transition: 1s; margin-bottom:30px; } .default .mcont .text ul { list-style:disc; margin-bottom:30px; } .default .mcont .text ul ul { margin-bottom:0px; } .default .mcont .text ul ul ul { margin-bottom:0px; } .default .mcont .text li { margin-left:40px; } @media screen and (min-width: 1024px) { .default .mcont .center {padding-top: 0;padding-bottom: 40px; } } .default footer { padding-top:100px; } .callus { font-family: 'Avenir-Book', sans-serif; font-weight:bold; font-size: 5.458vw; margin-top:20px; } @media (min-width: 768px) {.callus { font-size: 3.458vw; line-height: 1.238; letter-spacing: .0252em; } } @media (min-width: 1200px) {.callus { font-size: 1.458vw; } } .callus a {} .slogan { font-size:7.5vw; line-height:1.2; text-transform:uppercase; } @media (min-width: 768px) { .slogan { font-size:2.5vw; } } body:not(.aliashome) .slogan { text-align:left; margin-top:30px; }