html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block } nav ul {list-style: none } blockquote, q {quotes: none } blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none } a {margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent } ins {background-color: #ff9; color: #000; text-decoration: none } mark {background-color: #ff9; color: #000; font-style: italic; font-weight: 700 } del {text-decoration: line-through } abbr[title], dfn[title] {border-bottom: 1px dotted; cursor: help } table {border-collapse: collapse; border-spacing: 0 } hr {display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0 } input, select {vertical-align: middle } input, textarea {outline: 0 } body {font: 13px/1.231 sans-serif; *font-size: small } select, input, textarea, button {font: 99% sans-serif } pre, code, kbd, samp {font-family: monospace, sans-serif } body, select, input, textarea {color: #444 } h1, h2, h3, h4, h5, h6 {font-weight: 700 } html {overflow-y: scroll } a:hover, a:active {outline: 0 } ul, ol {margin-left: 1.8em } ol {list-style-type: decimal } nav ul, nav li {margin: 0 } small {font-size: 85% } strong, th {font-weight: 700 } td, td img {vertical-align: top } textarea {overflow: auto } .ie6 legend, .ie7 legend {margin-left: -7px } input[type="radio"] {vertical-align: text-bottom } input[type="checkbox"] {vertical-align: bottom } .ie7 input[type="checkbox"] {vertical-align: baseline } .ie6 input {vertical-align: text-bottom } td {vertical-align: top } sub, sup {font-size: 75%; line-height: 0; position: relative } sup {top: -.5em } sub {bottom: -.25em } pre {white-space: pre; white-space: pre-wrap; word-wrap: break-word; padding: 15px } .ie6 legend, .ie7 legend {margin-left: -7px } label, input[type=button], input[type=submit], button {cursor: pointer } button, input, select, textarea {margin: 0 } input:invalid, textarea:invalid {border-radius: 1px; -moz-box-shadow: 0 0 5px red; -webkit-box-shadow: 0 0 5px red; box-shadow: 0 0 5px red } .no-boxshadow input:invalid, .no-boxshadow textarea:invalid {background-color: #f0dddd } button {width: auto; overflow: visible } .ie7 img {-ms-interpolation-mode: bicubic } .ir {display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr } .hidden {display: none; visibility: hidden } .visuallyhidden {position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px, 1px, 1px, 1px) } .clearfix:before, .clearfix:after {content: "\0020"; display: block; height: 0; visibility: hidden } .clearfix:after {clear: both } .clearfix {zoom: 1 } .left {float: left } .right {float: right;position: relative;} .first {margin-left: 0 !important } .last {margin-right: 0 !important } .hide {display: none } .visible {display: block !important } .empty {visibility: hidden !important } .hr {clear: both; margin: 18px 0; background: transparent; border: 0; border-top: 1px solid #bbb } hr {visibility: hidden; font-size: 0; line-height: 0; height: 0; border: 0 } .accent, strong.accent, span.accent, em.accent {background: #ffffbf !important; color: inherit; padding: .25em; font-weight: 700 } div.accent, p.accent {padding: 1.5em } .amp {font: italic 1.1em/10% "Warnock Pro", "Goudy Old Style", "Palatino", "Book Antiqua", serif } .ui-helper-hidden {display: none } .ui-helper-hidden-accessible {position: absolute; left: -99999999px } .ui-helper-reset {margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none } .ui-helper-clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden } .ui-helper-clearfix {display: inline-block } * html .ui-helper-clearfix {height: 1% } .ui-helper-clearfix {display: block } .ui-helper-zfix {width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter: Alpha(Opacity=0) } .ui-tabs-panel {display: block !important } .ui-tabs-hide {display: none !important } img.wp-smiley, img.emoji {display: inline !important; border: 0 !important; box-shadow: none !important; height: 1em !important; width: 1em !important; margin: 0 .07em !important; vertical-align: -.1em !important; background: none !important; padding: 0 !important } @font-face {font-family: 'maison-bold'; src: url(//noformat.com/wp-content/themes/noformat/assets/css/../fonts/maisonneue-bold-webfont.woff2) format('woff2'), url(//noformat.com/wp-content/themes/noformat/assets/css/../fonts/maisonneue-bold-webfont.woff) format('woff'); font-weight: 400; font-style: normal } @font-face {font-family: 'maison-book'; src: url(//noformat.com/wp-content/themes/noformat/assets/css/../fonts/maisonneue-book-webfont.woff2) format('woff2'), url(//noformat.com/wp-content/themes/noformat/assets/css/../fonts/maisonneue-book-webfont.woff) format('woff'); font-weight: 400; font-style: normal } @font-face {font-family: 'maison-demi'; src: url(//noformat.com/wp-content/themes/noformat/assets/css/../fonts/maisonneue-demi-webfont.woff2) format('woff2'), url(//noformat.com/wp-content/themes/noformat/assets/css/../fonts/maisonneue-demi-webfont.woff) format('woff'); font-weight: 400; font-style: normal } @font-face {font-family: 'maison-medium'; src: url(//noformat.com/wp-content/themes/noformat/assets/css/../fonts/maisonneue-medium-webfont.woff2) format('woff2'), url(//noformat.com/wp-content/themes/noformat/assets/css/maisonneue-medium-webfont.woff) format('woff'); font-weight: 400; font-style: normal } html, body {position: relative; overflow: hidden !important; height: 100% !important; font-family: 'maison-book'; color: #000; font-weight: 400; -webkit-text-size-adjust: none } body {background: #86bc25; -webkit-transition: background-color 900ms 250ms ease-in-out; -moz-transition: background-color 900ms 250ms ease-in-out; transition: background-color 900ms 250ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .mobile body {background: #fff } * {-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-smoothing: antialiased; text-rendering: optimizeLegibility } #main {position: relative; overflow: hidden; width: 100% !important; height: 100% !important; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .tablet .home #main, .mobile .home #main, .tablet .page-template-page-about #main {position: fixed } .history-swap-box-in, .history-swap-box-out {overflow: hidden !important; width: 100% !important; height: 100% !important; backrground: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } h1, h2, h3, h4, h5, h6, strong, b {font-family: 'maison-bold'; font-weight: 400 } .red-overlay {position: fixed; left: 0; top: 100%; z-index: 9999; width: 100%; height: 100%; background: red; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } .first-time-overlay, #site-preloader {position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; background: #fff } #site-preloader .loader_overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff } #site-preloader .loader {position: absolute; top: 0; left: 0; width: 100%; height: 30px } #site-preloader .progress_notification {display: none } #site-preloader .progress_bar {position: absolute; top: 0; width: 100%; height: 0; border-bottom: 2px solid #fff } #site-preloader .progress_loaded {position: relative; width: 0; height: 100%; border-bottom: 2px solid #000 } .spinner {position: absolute; left: 50%; top: 50%; display: block; z-index: 2; width: 56px; height: 56px; margin: -28px 0 0 -28px } .spinner span {display: none; position: absolute; left: 0; top: 0; width: 56px; height: 56px; clip: rect(0, 56px, 56px, 28px); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); transform: rotate(0deg) } .spinner span i {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 12px solid #000; border-radius: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); transform: rotate(0deg); clip: rect(0, 28px, 56px, 0) } .spinner span.left {-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); transform: rotate(180deg) } .spinner:before {content: ""; display: block; position: absolute; left: 0; top: 50%; z-index: 2; width: 100%; height: 2px; margin-top: -1px; background: #fff; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg) } .intro-video-spinner-holder {position: absolute; left: 0; top: 0; z-index: 999; display: none; width: 100%; height: 100%; background: rgba(0, 0, 0, .35) } .intro-video-spinner {position: absolute; left: 50%; top: 50%; display: block; width: 56px; height: 56px; margin: -28px 0 0 -28px; animation: spinnerAnim 4s linear infinite } .intro-video-spinner span {display: block; position: absolute; left: 0; top: 0; width: 56px; height: 56px; clip: rect(0, 56px, 56px, 28px); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); transform: rotate(0deg) } .intro-video-spinner span i {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border: 12px solid #000; border-radius: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); transform: rotate(0deg); clip: rect(0, 27px, 56px, 0) } .intro-video-spinner span i.activated {animation: spinnerIAnim 1.5s linear forwards } .postid-25 .intro-video-spinner span i {border-color: #e91027 } .postid-4 .intro-video-spinner span i {border-color: #bb9b6d } .postid-20 .intro-video-spinner span i {border-color: #ccc } .postid-17 .intro-video-spinner span i {border-color: #9e714c } .postid-14 .intro-video-spinner span i {border-color: #fa9d10 } .postid-404 .intro-video-spinner span i {border-color: #c67945 } .postid-567 .intro-video-spinner span i {border-color: #285a12 } .postid-559 .intro-video-spinner span i {border-color: #f3292f } .postid-498 .intro-video-spinner span i {border-color: #914c3b } .intro-video-spinner span.left {-webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); transform: rotate(180deg) } @keyframes spinnerAnim {0% {transform: rotate(0deg) } 100% {transform: rotate(360deg) } } @keyframes spinnerIAnim {0% {transform: rotate(0deg) } 100% {transform: rotate(180deg) } } .video-wrapper+.intro-video-spinner-holder {display: block } .tablet .intro-video-spinner-holder, .mobile .intro-video-spinner-holder {display: none } #preloader {position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100% } #preloader .loader_overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100% } #preloader .loader {position: absolute; top: 0; left: 0; width: 100%; height: 30px } #preloader .progress_notification {display: none } #preloader .progress_bar {position: absolute; top: 0; width: 100%; height: 0 } #preloader .progress_loaded {position: relative; width: 0; height: 100%; border-bottom: 2px solid #000 } .postid-25 #preloader .progress_loaded {border-bottom-color: #e91027 } .postid-4 #preloader .progress_loaded {border-bottom-color: #bb9b6d } .postid-20 #preloader .progress_loaded {border-bottom-color: #ccc } .postid-17 #preloader .progress_loaded {border-bottom-color: #9e714c } .postid-14 #preloader .progress_loaded {border-bottom-color: #fa9d10 } .postid-375 #preloader .progress_loaded {border-bottom-color: #4a4a4a } .postid-404 #preloader .progress_loaded {border-bottom-color: #c67945 } .postid-567 #preloader .progress_loaded {border-bottom-color: #285a12 } .postid-559 #preloader .progress_loaded {border-bottom-color: #f3292f } .postid-498 #preloader .progress_loaded {border-bottom-color: #914c3b } #single-preloader {position: fixed; top: 0; left: 0; width: 100%; height: 100% } #single-preloader .loader_overlay {position: absolute; top: 0; left: 0; width: 100%; height: 100% } #single-preloader .loader {position: absolute; top: 0; bottom: 0; width: 100%; height: 100% } #single-preloader .progress_notification {display: none } #single-preloader .progress_bar {position: absolute; bottom: 0; left: 0; width: 100%; height: 100% } #single-preloader .progress_loaded {position: absolute; left: 0; bottom: 0; width: 100%; height: 0; background: rgba(255, 255, 255, .2) } /*.landscape-message {position: fixed; left: 0; top: 0; z-index: 9999; display: none; width: 100%; height: 200%; background: url(../imgs/bgr-landscape-message.png) center no-repeat #fff; background-size: contain; -webkit-transform: translateY(-25%); -moz-transform: translateY(-25%); -ms-transform: translateY(-25%); -o-transform: translateY(-25%); transform: translateY(-25%) } .mobile.landscape .landscape-message {display: block }*/ header {position: fixed; left: 0; top: 0; z-index: 9998; width: 100%; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); transition: all 1000ms cubic-bezier(.645, .045, .355, 1); -webkit-transform: translateY(0%) translateZ(0); -moz-transform: translateY(0%) translateZ(0); transform: translateY(0%) translateZ(0) } header.initial {opacity: 0; -webkit-transform: translateY(-60px) translateZ(0); -moz-transform: translateY(-60px) translateZ(0); transform: translateY(-60px) translateZ(0) } .page-template-page-contact header.initial, .single-projects header.initial {opacity: 1; -webkit-transform: translateY(0) translateZ(0); -moz-transform: translateY(0) translateZ(0); transform: translateY(0) translateZ(0) } .single header {-webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .header-up {-webkit-transform: translateY(-100%) translateZ(0); -moz-transform: translateY(-100%) translateZ(0); transform: translateY(-100%) translateZ(0) } .sticky-header {background: #000; -webkit-transition-delay: .2s; -moz-transition-delay: .2s; transition-delay: .2s } header .holder {margin: 0 auto; padding: 80px 100px 0; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .sticky-header .holder {padding: 35px 100px 20px } header .logo {float: left; position: relative; width: 123px; height: 50px; text-indent: -9999px; outline: 0 } header .logo:before, header .logo:after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 69px; background: url(../imgs/Medianature.svg) center no-repeat; background-size: 100% 100%; -webkit-transition: opacity .3s 0ms ease-in-out; -moz-transition: opacity .3s 0ms ease-in-out; transition: opacity .3s 0ms ease-in-out } header .logo:after {background-image: url(../imgs/Medianature.png);opacity: 0} header.light .logo:before {opacity: 0 } header.light .logo:after {opacity: 1 } header.opened.light .logo:before {opacity: 1 } header.opened.light .logo:after {opacity: 0 } .scrolling header .logo:before, .scrolling header .logo:after {-webkit-transition: opacity 900ms 500ms ease-in-out; -moz-transition: opacity 900ms 500ms ease-in-out; transition: opacity 900ms 500ms ease-in-out } .sticky-header .logo:before {opacity: 0 !important } .sticky-header .logo:after {opacity: 1 !important } .single header .logo:before, .single header .logo:after {-webkit-transition: opacity 300ms 0ms ease-in-out; -moz-transition: opacity 300ms 0ms ease-in-out; transition: opacity 300ms 0ms ease-in-out } header .nav-trigger {float: right; position: relative; z-index: 9998; font-family: 'maison-medium'; font-size: 15px; line-height: 25px; color: #000; text-decoration: none; -webkit-transition: color 500ms 0ms ease-in-out; -moz-transition: color 500ms 0ms ease-in-out; transition: color 500ms 0ms ease-in-out } header .nav-trigger:hover {text-decoration: underline } header.opened .nav-trigger, header.light .nav-trigger {color: #fff } .sticky-header .nav-trigger {color: #fff !important; -webkit-transition: all 300ms 0ms ease-in-out; -moz-transition: all 300ms 0ms ease-in-out; transition: all 300ms 0ms ease-in-out } header nav {position: fixed; right: 0; top: 0; z-index: 9997; height: 100%; min-width: 790px; padding: 140px 215px 0 120px; font-family: 'maison-bold'; background: #86bc25; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translateX(100%) translateZ(0); -moz-transform: translateX(100%) translateZ(0); transform: translateX(100%) translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 500ms ease-in-out; -moz-transition: -moz-transform 500ms ease-in-out; transition: all 500ms ease-in-out } .mobile-logo {display: none; position: absolute; left: 40px; top: 12px; width: 85px; height: 50px; text-indent: -9999px; background: url(../imgs/Medianature.svg) left top no-repeat; background-size: 100% 100%; outline: 0; } header nav .main {margin-bottom: 95px } header nav .main li {overflow: hidden; font-size: 74px; line-height: 82px } header nav .main li a {float: left;font-size: 28px;position: relative;color: #fff;text-decoration: none;-webkit-transition: all 250ms ease-in-out;-moz-transition: all 250ms ease-in-out;transition: all 250ms ease-in-out;} header nav .main li a:hover {text-decoration: underline } header nav .main li a.active {color: #000 } header nav .main li a.active:hover {color: #000 } header nav .social li {font-size: 10px; line-height: 20px } header nav .social li a {color: #fff; text-decoration: none; text-transform: uppercase } .desktop nav .social li a:hover {text-decoration: underline } header nav p {position: absolute; left: 120px; bottom: 60px; color: #fff; font-size: 20px } header nav p em {display: block; margin-bottom: 45px; font-style: normal; font-size: 30px; line-height: 42px } header nav p em a {display: inline-block; color: #fff; text-decoration: none } header nav p em a i {display: none } header nav p em a:after {content: ""; display: inline-block; width: 21px; height: 30px; margin-left: 8px; background: url(../imgs/icon-pin-light.png) no-repeat; background-size: 100% 100% } header nav span {display: block; margin-bottom: 20px } header nav p>a {display: inline-block; color: #fff; text-decoration: none } header nav p a:hover {text-decoration: underline } header.opened nav {-webkit-transform: translateX(0%); -moz-transform: translateX(0%); transform: translateX(0%) } .nav-overlay {position: fixed; left: 0; top: 0; z-index: 9996; display: none; width: 100%; height: 100%; background: rgba(255, 255, 255, .75); -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder {position: relative; height: 100%; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section {position: relative;overflow: hidden;height: 100%;background-image: none;} .sections-holder .media-holder, .sections-holder .media-holder2 {position: absolute; left: 0; top: 0; overflow: hidden; width: 100%; height: 100%; background: #fff; -webkit-transform: scale(.95, .92) translateZ(0); -moz-transform: scale(.95, .92) translateZ(0); transform: scale(.95, .92) translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transition: -webkit-transform 250ms ease-in-out; -moz-transition: -moz-transform 250ms ease-in-out; transition: transform 250ms ease-in-out } .sections-holder .media-holder span, .sections-holder .media-holder2 span {display: block; position: absolute; left: 0; top: 0; overflow: hidden; width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover } .sections-holder .active .media-holder, .sections-holder .active .media-holder2 {-webkit-transition-delay: 1400ms; -moz-transition-delay: 1400ms; transition-delay: 1400ms; -webkit-transform: scale(1, 1) translateZ(0); -moz-transform: scale(1, 1) translateZ(0); transform: scale(1, 1) translateZ(0) } .sections-holder .clicked .media-holder, .sections-holder .clicked .media-holder2 {-webkit-transform: scale(.5) translateZ(0); -moz-transform: scale(.5) translateZ(0); transform: scale(.5) translateZ(0); -webkit-transition: -webkit-transform 500ms ease-in-out; -moz-transition: -moz-transform 500ms ease-in-out; transition: transform 500ms ease-in-out } .about .sections-holder .media-holder, .from-services .media-holder, .about .sections-holder .media-holder2, .from-services .media-holder2 {background: #fff } .sections-holder .parallax {position: absolute; left: 50%; top: 50%; width: 100%; height: 100%; -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0); transform: translateX(-50%) translateY(-50%) translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder .parallax .layer {position: absolute; left: 0; top: 0; width: 100%; height: 100%; will-change: transform } .sections-holder .parallax .layer span {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: 100% 100%; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; backface-visibility: hidden } .sections-holder .clicked .parallax .layer {-webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out } .sections-holder section article, .single-intro article {position: absolute;left: 50%;top: 23%;z-index: 1000;width: 100%;max-width: 1920px;-webkit-transform: translateX(-50%) translateY(100%) translateZ(0);-moz-transform: translateX(-50%) translateY(100%) translateZ(0);transform: translateX(-50%) translateY(100%) translateZ(0);backface-visibility: hidden;-webkit-backface-visibility: hidden;} .single-intro article {-webkit-transform: translateX(-50%) translateY(0%) translateZ(0); -moz-transform: translateX(-50%) translateY(0%) translateZ(0); transform: translateX(-50%) translateY(0%) translateZ(0); cursor: pointer } .single-intro article.light {color: #fff } .about .sections-holder section article, .home .sections-holder section.from-services article {-webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%) } .sections-holder .case-study article h6 {margin-bottom: 30px; font-size: 34px; letter-spacing: -1px } .sections-holder section article h3, .single-intro article h1 {width: 38%; margin-bottom: 60px; font-size: 160px; line-height: 140px } .single-intro article h1 {font-size: 114px; line-height: 100px; letter-spacing: -.25px } .sections-holder section article h3 a {padding: 0; font-size: 120px; line-height: 120px; } .sections-holder section article p, .sections-holder section article h4, .single-intro article h2 {width: 30%; margin-bottom: 45px; font-family: 'maison-book'; font-weight: 400; font-size: 16px; line-height: 27px } .sections-holder section article a {position: relative; display: inline-block; padding-right: 60px; font-family: 'maison-bold'; font-size: 16px; text-decoration: none; color: #000 } .sections-holder section article a .arrow {right: 0; width: 45px; margin-top: 0; background: #000 } .sections-holder section article a .arrow:before, .sections-holder section article a .arrow:after {background: #000 } .sections-holder section article.light a .arrow, .sections-holder section article.light a .arrow:before, .sections-holder section article.light a .arrow:after {background: #fff } .sections-holder section article a:hover .arrow {-webkit-transform: translateX(20px); -moz-transform: translateX(20px); transform: translateX(20px) } .sections-holder section article.light h3 a, .sections-holder section article.light p, .sections-holder section article.light h4, .sections-holder section article.light h6, .sections-holder section article.light a {color: #fff } .home .sections-holder section.active article {-webkit-transform: translateX(-50%) translateY(0%) translateZ(0); -moz-transform: translateX(-50%) translateY(0%) translateZ(0); transform: translateX(-50%) translateY(0%) translateZ(0); -webkit-transition: -webkit-transform 800ms 500ms ease-in-out; -moz-transition: -moz-transform 800ms 500ms ease-in-out; transition: transform 800ms 500ms ease-in-out } .sections-holder section.went-down article {-webkit-transform: translateX(-50%) translateY(50%) translateZ(0); -moz-transform: translateX(-50%) translateY(50%) translateZ(0); transform: translateX(-50%) translateY(50%) translateZ(0); -webkit-transition: -webkit-transform 600ms 250ms ease-in-out; -moz-transition: -moz-transform 600ms 250ms ease-in-out; transition: transform 600ms 250ms ease-in-out } .sections-holder section.went-up article {-webkit-transform: translateX(-50%) translateY(-50%) translateZ(0); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0); transform: translateX(-50%) translateY(-50%) translateZ(0); -webkit-transition: -webkit-transform 700ms 250ms ease-in-out; -moz-transition: -moz-transform 700ms 250ms ease-in-out; transition: transform 700ms 250ms ease-in-out } .sections-nav {position: fixed; right: 100px; top: 50%; z-index: 100000; margin: 0; list-style: none; -webkit-transform: translateX(0) translateY(-50%) translateZ(0); -moz-transform: translateX(0) translateY(-50%) translateZ(0); transform: translateX(0) translateY(-50%) translateZ(0); backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); transition: all 1000ms cubic-bezier(.645, .045, .355, 1); } .sections-nav.initial {opacity: 0; -webkit-transform: translateX(60px) translateY(-50%) translateZ(0); -moz-transform: translateX(60px) translateY(-50%) translateZ(0); transform: translateX(60px) translateY(-50%) translateZ(0) } .sections-nav li {margin-bottom: 34px } .sections-nav li a {display: block; width: 4px; height: 4px; margin: 0 auto; text-indent: -9999px; background: #000; -webkit-background-clip: padding-box; background-clip: padding-box; border: 5px solid transparent; border-radius: 50%; -webkit-transition: all 900ms 500ms ease-in-out; -moz-transition: all 900ms 500ms ease-in-out; transition: all 900ms 500ms ease-in-out } .sections-nav li a.active {width: 2px; height: 2px; background: #fff; border: 5px solid #000; -webkit-background-clip: padding-box; background-clip: padding-box } .sections-nav.light li a {background: #fff; -webkit-background-clip: padding-box; background-clip: padding-box } .sections-nav.light li a.active {background: #000; border-color: #fff; -webkit-background-clip: padding-box; background-clip: padding-box } .about .sections-nav li a {-webkit-transition: all 700ms 0ms ease-in-out; -moz-transition: all 700ms 0ms ease-in-out; transition: all 700ms 0ms ease-in-out } .sections-nav li:last-child {margin: 0 } .discover-btn {display: block; position: absolute; left: 100px; bottom: 80px; z-index: 1001; padding-left: 45px; line-height: 10px; font-size: 10px; text-transform: uppercase; text-decoration: none; color: #000; -webkit-transform: translateX(0) rotate(-90deg) translateZ(0); -moz-transform: translateX(0) rotate(-90deg) translateZ(0); transform: translateX(0) rotate(-90deg) translateZ(0); -webkit-transform-origin: left top; -moz-transform-origin: left top; transform-origin: left top } .arrow {position: absolute; display: block; top: 50%; width: 22px; height: 1px; margin-top: -1px; background: #000; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out } .arrow:before, .arrow:after {content: ""; display: block; position: absolute; right: 0; top: -2px; width: 5px; height: 1px; background: #000; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } .arrow:after {top: auto; bottom: -2px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg) } .discover-btn .arrow {left: 0 } .discover-btn .arrow:before, .discover-btn .arrow:after {left: 0; right: auto; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg) } .discover-btn .arrow:after {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } .discover-btn:hover .arrow {-webkit-transform: translateX(-20px); -moz-transform: translateX(-20px); transform: translateX(-20px) } .discover-btn.light {color: #fff } .discover-btn.light .arrow, .discover-btn.light .arrow:before, .discover-btn.light .arrow:after {background: #fff } footer {position: absolute; left: 0; bottom: 0; width: 100% } footer>p {margin-bottom: 60px; font-family: 'maison-bold'; text-align: center; font-size: 36px } footer>p a {color: #000 } footer .bottom {overflow: hidden; position: relative; padding: 60px 100px; background: url(../imgs/Medianature.svg) 100px center no-repeat #000; background-size: 60px 41px; -webkit-transition: background-color 900ms 250ms ease-in-out; -moz-transition: background-color 900ms 250ms ease-in-out; transition: background-color 900ms 250ms ease-in-out } footer .bottom>a {display: block; position: absolute; left: 100px; top: 50%; width: 123px; height: 21px; text-indent: -9999px; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); transform: translateY(-50%); outline: 0 } footer ul {float: right; margin: 0; list-style: none } footer ul li {float: left; margin: 0 8px; line-height: 21px } footer ul li a {font-family: 'maison-demi'; color: #fff; text-decoration: none; font-size: 12px } footer ul li a:hover {text-decoration: underline } footer ul li:last-child {margin-right: 0 } footer .bottom p {position: absolute; left: 50%; top: 50%; font-family: 'maison-book'; font-size: 8px; color: #fff; line-height: 21px; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .single-projects footer, .page-template-page-work footer {position: relative; left: auto; bottom: auto; padding-top: 60px } .desktop.low-height .single-projects footer, .desktop.lower-height .single-projects footer, .desktop.low-height .page-template-page-work footer, .desktop.lower-height .page-template-page-work footer {padding-top: 60px } body.home {background: #000 } .sections-holder section.intro .media-holder video {position: absolute; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); will-change: transform } .sections-holder section.intro article {bottom: auto; top: 50%; max-width: 900px; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .intro-content {position: relative; -webkit-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); transition: all 1000ms cubic-bezier(.645, .045, .355, 1) } .desktop .intro-content.initial, .tablet .intro-content.initial {opacity: 0; -webkit-transform: translateY(-60px); -moz-transform: translateY(-60px); transform: translateY(-60px) } .sections-holder section.intro article h3 {width: 100%; margin: 0; font-size: 22px; line-height: normal; text-align: left } .desktop.low-height .sections-holder section.intro article h3, .desktop.lower-height .sections-holder section.intro article h3 {margin-bottom: 20px; color: #98e70a; } .sections-holder section.intro article p {position: relative; width: 100%; margin: 0; padding-left: 120px; white-space: nowrap; line-height: normal; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .sections-holder section.intro article p span {font-family: 'maison-bold'; font-size: 104px; line-height: 104px; text-align: left } .sections-holder section.intro article p .first:after {content: " "} @-webkit-keyframes ani-mouse {0% {opacity: 1; top: 29% } 15% {opacity: 1; top: 50% } 50% {opacity: 0; top: 50% } 100% {opacity: 0; top: 29% } } @-moz-keyframes ani-mouse {0% {opacity: 1; top: 29% } 15% {opacity: 1; top: 50% } 50% {opacity: 0; top: 50% } 100% {opacity: 0; top: 29% } } @keyframes ani-mouse {0% {opacity: 1; top: 29% } 15% {opacity: 1; top: 50% } 50% {opacity: 0; top: 50% } 100% {opacity: 0; top: 29% } } .home .sections-holder section.intro .media-holder {background: #000 } #outer-eye, #inner-eye {position: absolute; left: 0; top: 0 } .home .sections-holder section.intro .media-holder:after {content: ""; position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; background: radial-gradient(rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 1) 75%) } .home .sections-holder section.intro article h3 {color: #fff } .home .sections-holder .intro .mouse {position: absolute; left: 50%; bottom: 80px; display: block; width: 12px; height: 22px; margin-left: -6px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #fff; border-radius: 6px; -webkit-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 1000ms cubic-bezier(.645, .045, .355, 1); transition: all 1000ms cubic-bezier(.645, .045, .355, 1) } .home .sections-holder .intro .mouse.initial {opacity: 0; -webkit-transform: translateY(60px); -moz-transform: translateY(60px); transform: translateY(60px) } .home .sections-holder .intro .mouse>* {position: absolute; display: block; top: 29%; left: 50%; width: 2px; height: 4px; margin: -2px 0 0 -1px; background: #fff; border-radius: 50%; -webkit-animation: ani-mouse 1.5s linear infinite; -moz-animation: ani-mouse 1.5s linear infinite; animation: ani-mouse 1.5s linear infinite } .home .sections-holder .intro.active article {-webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .sections-holder .intro.went-up article {-webkit-transform: translateX(-50%) translateY(-200%); -moz-transform: translateX(-50%) translateY(-200%); transform: translateX(-50%) translateY(-200%) } .sections-holder section.active .discover-btn {padding-left: 45px; -webkit-transform: translateX(0) translateY(0) rotate(-90deg) translateZ(0); -moz-transform: translateX(0) translateY(0) rotate(-90deg) translateZ(0); transform: translateX(0) translateY(0) rotate(-90deg) translateZ(0); -webkit-transition: all 600ms 500ms ease-in-out; -moz-transition: all 600ms 500ms ease-in-out; transition: all 600ms 500ms ease-in-out } .sections-holder section.went-up .discover-btn {padding-left: 75px; -webkit-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); -moz-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); -webkit-transition: all 500ms 250ms ease-in-out; -moz-transition: all 500ms 250ms ease-in-out; transition: all 500ms 250ms ease-in-out } .about .sections-holder section .discover-btn {padding-left: 75px; -webkit-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); -moz-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0) } .about .sections-holder section.active .discover-btn {padding-left: 45px; -webkit-transform: translateX(0) translateY(0) rotate(-90deg) translateZ(0); -moz-transform: translateX(0) translateY(0) rotate(-90deg) translateZ(0); transform: translateX(0) translateY(0) rotate(-90deg) translateZ(0); -webkit-transition: all 500ms 750ms ease-in-out; -moz-transition: all 500ms 750ms ease-in-out; transition: all 500ms 750ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .about .sections-holder section.went-up .discover-btn {padding-left: 75px; -webkit-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); -moz-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); -webkit-transition: all 500ms 250ms ease-in-out; -moz-transition: all 500ms 250ms ease-in-out; transition: all 500ms 250ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .about .sections-holder section.went-down .discover-btn {padding-left: 75px; -webkit-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); -moz-transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); transform: translateX(0) translateY(-200px) rotate(-90deg) translateZ(0); -webkit-transition: all 500ms 250ms ease-in-out; -moz-transition: all 500ms 250ms ease-in-out; transition: all 500ms 250ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.pls-pls-me .media-holder span {/* background-image: url(../imgs/bgr-pls-pls-me.jpg) */} .mobile .sections-holder section.pls-pls-me .media-holder span {/* background-image: url(../imgs/bgr-pls-pls-me-mobile.jpg) */} .sections-holder section.pls-pls-me .parallax .one span {background-image: url(../imgs/bgr-pls-pls-me-layer-one.png) } .sections-holder section.pls-pls-me .parallax .two span {background-image: url(../imgs/bgr-pls-pls-me-layer-two.png) } .sections-holder section.pls-pls-me .parallax .three span {} .sections-holder section.pls-pls-me .parallax .four span {background-image: url(../imgs/bgr-pls-pls-me-layer-four.png) } .sections-holder section.pls-pls-me .parallax .five span {background-image: url(../imgs/bgr-pls-pls-me-layer-five.png) } .sections-holder section.pls-pls-me .parallax .six span {background-image: url(../imgs/bgr-pls-pls-me-layer-six.png) } .sections-holder section.unreal-candy .media-holder span {background-image: url(../imgs/bgr-unreal-candy.jpg) } .sections-holder section.unreal-candy .parallax .one span {background-image: url(../imgs/bgr-unreal-candy-layer-one.png) } .sections-holder section.unreal-candy .parallax .two span {background-image: url(../imgs/bgr-unreal-candy-layer-two.png) } .sections-holder section.unreal-candy .parallax .three span {background-image: url(../imgs/bgr-unreal-candy-layer-three.png) } .sections-holder section.unreal-candy .parallax .four span {background-image: url(../imgs/bgr-unreal-candy-layer-four.png) } .sections-holder section.unreal-candy .parallax .five span {background-image: url(../imgs/bgr-unreal-candy-layer-five.png) } .sections-holder section.unreal-candy .parallax .six span {background-image: url(../imgs/bgr-unreal-candy-layer-six.png) } .sections-holder section.unreal-candy .parallax .seven span {background-image: url(../imgs/bgr-unreal-candy-layer-seven.png) } .sections-holder section.unreal-candy .parallax .eight span {background-image: url(./imgs/bgr-unreal-candy-layer-eight.png) } .sections-holder section.centaur-properties .media-holder span {background-image: url(../imgs/bgr-centaur-properties.jpg) } .sections-holder section.centaur-properties .parallax .one span {background-image: url(../imgs/bgr-centaur-properties-layer-one.png) } .sections-holder section.centaur-properties .parallax .two span {background-image: url(../imgs/bgr-centaur-properties-layer-two.png) } .sections-holder section.centaur-properties .parallax .three span {background-image: url(../imgs/bgr-centaur-properties-layer-three.png) } .sections-holder section.centaur-properties .parallax .four span {background-image: url(../imgs/bgr-centaur-properties-layer-four.png) } .sections-holder section.longo-park .media-holder span {background-image: url(../imgs/bgr-longo-park.jpg) } .sections-holder section.longo-park .parallax .one span {background-image: url(../imgs/bgr-longo-park-layer-one.png) } .sections-holder section.longo-park .parallax .two span {background-image: url(../imgs/bgr-longo-park-layer-two.png) } .sections-holder section.longo-park .parallax .three span {background-image: url(../imgs/bgr-longo-park-layer-three.png) } .sections-holder section.longo-park .parallax .four span {background-image: url(../imgs/bgr-longo-park-layer-four.png) } .sections-holder section.longo-park .parallax .five span {background-image: url(../imgs/bgr-longo-park-layer-five.png) } .sections-holder section.longo-park .parallax .six span {background-image: url(../imgs/bgr-longo-park-layer-two.png) } .tablet.landscape .sections-holder section.longo-park .parallax .four {margin-left: -30% } .sections-holder section.happy-moves .media-holder span {/* background-image: url(../imgs/bgr-happy-moves.jpg) */} .sections-holder section.happy-moves .parallax .one span {background-image: url(../imgs/bgr-happy-moves-layer-one.png) } .sections-holder section.happy-moves .parallax .two span {background-image: url(../imgs/bgr-happy-moves-layer-two.png) } .sections-holder section.happy-moves .parallax .three span {background-image: url(../imgs/bgr-happy-moves-layer-three.png) } .sections-holder section.happy-moves .parallax .four span {background-image: url(../imgs/bgr-happy-moves-layer-four.png) } .sections-holder section.happy-moves .parallax .five span {background-image: url(../imgs/bgr-happy-moves-layer-five.png) } .sections-holder section.happy-moves .parallax .six span {} .tablet.landscape .sections-holder section.happy-moves .parallax {margin-left: -20% } .tablet.portrait .sections-holder section.happy-moves .parallax {margin-left: 20% } .sections-holder section.renaissance .media-holder span {background-image: url(../imgs/bgr-renaissance.jpg) } .sections-holder section.renaissance .parallax .one span {background-image: url(../imgs/bgr-renaissance-layer-one.png) } .sections-holder section.renaissance .parallax .two span {background-image: url(../imgs/bgr-renaissance-layer-two.png) } .sections-holder section.renaissance .parallax .three span {background-image: url(../imgs/bgr-renaissance-layer-three.png) } .sections-holder section.renaissance .parallax .four span {background-image: url(../imgs/bgr-renaissance-layer-four.png) } .sections-holder section.renaissance .parallax .five span {background-image: url(../imgs/bgr-renaissance-layer-five.png) } .sections-holder section.renaissance .parallax .six span {background-image: url(../imgs/bgr-renaissance-layer-six.png) } .sections-holder section.renaissance .parallax .seven span {background-image: url(../imgs/bgr-renaissance-layer-seven.png) } .sections-holder section.yoga-school h3 {width: 50% } .portrait .sections-holder section.yoga-school h3 {width: 70% } .sections-holder section.yoga-school .media-holder span {background-image: url(../imgs/bgr-yoga-school.jpg) } .portrait .sections-holder section.yoga-school .media-holder span {background-image: url(../imgs/bgr-yoga-school-portrait.jpg) } .sections-holder section.yoga-school .parallax .one span {background-image: url(../imgs/bgr-yoga-school-layer-one.png) } .portrait .sections-holder section.yoga-school .parallax .one span {background-image: url(../imgs/bgr-yoga-school-layer-one-portrait.png) } .sections-holder section.yoga-school .parallax .two span {background-image: url(../imgs/bgr-yoga-school-layer-two.png) } .sections-holder section.yoga-school .parallax .three span {background-image: url(../imgs/bgr-yoga-school-layer-three.png) } .tablet.landscape .sections-holder section.yoga-school .parallax {margin-left: -30% } .sections-holder section.assemblage .media-holder span {background-image: url(../imgs/bgr-assemblage.jpg) } .sections-holder section.assemblage .parallax .one span {background-image: url(../imgs/bgr-assemblage-layer-one.png) } .sections-holder section.assemblage .parallax .two span {background-image: url(../imgs/bgr-assemblage-layer-two.png) } .sections-holder section.assemblage .parallax .three span {background-image: url(../imgs/bgr-assemblage-layer-three.png) } .sections-holder section.assemblage .parallax .four span {background-image: url(../imgs/bgr-assemblage-layer-four.png) } .sections-holder section.assemblage .parallax .five span {background-image: url(../imgs/bgr-assemblage-layer-five.png) } .sections-holder section.assemblage .parallax .six span {background-image: url(../imgs/bgr-assemblage-layer-six.png) } .sections-holder section.assemblage .parallax .seven span {background-image: url(../imgs/bgr-assemblage-layer-seven.png) } .tablet.landscape .sections-holder section.assemblage .parallax {margin-left: -20% } .tablet.portrait .sections-holder section.assemblage .parallax {margin-left: 20% } .sections-holder section.home-about .meadi-holder {background: #fff } .sections-holder section.home-about article {bottom: 50%; max-width: 1600px } .sections-holder section.active.home-about article {-webkit-transform: translateX(-50%) translateY(20%) translateZ(0); -moz-transform: translateX(-50%) translateY(20%) translateZ(0); transform: translateX(-50%) translateY(20%) translateZ(0); -webkit-transition: -webkit-transform 800ms 500ms ease-in-out; -moz-transition: -moz-transform 800ms 500ms ease-in-out; transition: transform 800ms 500ms ease-in-out } .sections-holder section.home-about.went-down article, .sections-holder section.home-about article {-webkit-transform: translateX(-50%) translateY(45%) translateZ(0); -moz-transform: translateX(-50%) translateY(45%) translateZ(0); transform: translateX(-50%) translateY(45%) translateZ(0); -webkit-transition: -webkit-transform 600ms 350ms ease-in-out; -moz-transition: -moz-transform 600ms 350ms ease-in-out; transition: transform 600ms 350ms ease-in-out } .sections-holder section.home-about article h1 {width: 100%; margin: 0; font-family: 'maison-bold'; text-align: center; font-size: 45px; line-height: 80px; letter-spacing: -.5px; font-weight: 400 } .about .sections-holder .active .media-holder {-webkit-transition-delay: 1100ms; -moz-transition-delay: 1100ms; transition-delay: 1100ms } .about .media-holder:after, .from-services .media-holder:after {content: "about us"; position: absolute; left: 50%; top: 50%; font-family: 'maison-bold'; font-size: 700px; color: #fff; white-space: nowrap; letter-spacing: -20px; text-shadow: 0 0 0 rgba(0, 0, 0, .075); -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0); transform: translateX(-50%) translateY(-50%) translateZ(0); -webkit-transition: all 250ms; -moz-transition: all 250ms; transition: all 250ms; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-user-select: none; -moz-user-select: none; user-select: none } .active .media-holder:after {text-shadow: 0 0 80px rgba(0, 0, 0, .075); -webkit-transition-delay: 1550ms; -webkit-transition-duration: 950ms; -moz-transition-delay: 1550ms; -moz-transition-duration: 950ms; transition-delay: 1550ms; transition-duration: 950ms } .clients .media-holder:after {-webkit-transform: translateX(-50%) translateY(-74%) translateZ(0); -moz-transform: translateX(-50%) translateY(-74%) translateZ(0); transform: translateX(-50%) translateY(-74%) translateZ(0) } .about .sections-holder section article, .home .sections-holder section.from-services article {bottom: auto; top: 50%; -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0); transform: translateX(-50%) translateY(-50%) translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden } .mobile .page-template-page-about {height: auto !important; background: #fff } .mobile .about {height: auto !important } .mobile .about .sections-holder {height: auto; background: #fff } .mobile .about section, .mobile .from-services {height: auto; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .mobile .about .sections-holder section {overflow: visible } .mobile .about .sections-holder section article, .mobile .sections-holder section.quote blockquote {position: relative; left: auto; top: auto; -webkit-transform: none !important; -moz-transform: none !important; transform: none !important; box-sizing: border-box } .we-design .media-holder:after {content: "we create"; font-size: 410px } .we-are .media-holder:after {content: "we are"; font-size: 480px } .sections-holder section.with-text article {max-width: 950px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .sections-holder section.with-text h5, .sections-holder section.quote h5 {font-size: 20px; line-height: normal; text-align: left; -webkit-transform: translateX(0) translateY(150px) translateZ(0); -moz-transform: translateX(0) translateY(150px) translateZ(0); transform: translateX(0) translateY(150px) translateZ(0) } .sections-holder section.quote h5 {margin-bottom: 45px } .sections-holder section.with-text .text-holder {width: 100%; margin: 0; padding: 35px 60px 0 125px; font-family: 'maison-bold'; font-size: 42px; line-height: 60px; letter-spacing: -2px; text-align: left; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translateX(0%) translateY(50%); -moz-transform: translateX(0%) translateY(50%); transform: translateX(0%) translateY(50%); -webkit-transition: all 750ms 150ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms 150ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms 150ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.we-believe.with-text .text-holder {padding-right: 0 } .sections-holder section.with-text .text-holder .sections-holder section.with-text article .text {width: 100%; margin: 0 } .sections-holder section.with-text article .text em {position: relative; font-style: normal; cursor: default; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transition: color 250ms ease-in-out; -moz-transition: color 250ms ease-in-out; transition: color 250ms ease-in-out } .sections-holder section.with-text article .text em.hovered {color: red } .sections-holder section.with-text article .text ul {position: fixed; left: 0; bottom: 0; z-index: 2; opacity: 0; overflow: hidden; width: 300px; height: 372px; margin: 0; -webkit-transform: translateX(0%) translateY(-50%) translateZ(0); -moz-transform: translateX(0%) translateY(-50%) translateZ(0); transform: translateX(0%) translateY(-50%) translateZ(0); -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out; -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform, opacity; transition-property: transform, opacity } .sections-holder section.with-text article .text ul li {display: block; height: 100% } .sections-holder section.with-text article .text ul li img {width: auto; height: 100% } .sections-holder section.active.with-text h5 {-webkit-transform: translateX(0) translateY(0%) translateZ(0); -moz-transform: translateX(0) translateY(0%) translateZ(0); transform: translateX(0) translateY(0%) translateZ(0); -webkit-transition: all 750ms 650ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms 650ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms 650ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.active.quote h5 {-webkit-transform: translateX(0) translateY(0%) translateZ(0); -moz-transform: translateX(0) translateY(0%) translateZ(0); transform: translateX(0) translateY(0%) translateZ(0); -webkit-transition: all 750ms 550ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms 550ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms 550ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.with-text h5 {-webkit-transform: translateX(0) translateY(-250px) translateZ(0); -moz-transform: translateX(0) translateY(-250px) translateZ(0); transform: translateX(0) translateY(-250px) translateZ(0); -webkit-transition: all 600ms 150ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 600ms 150ms cubic-bezier(.645, .045, .355, 1); transition: all 600ms 150ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.quote h5 {-webkit-transform: translateX(0) translateY(-450px) translateZ(0); -moz-transform: translateX(0) translateY(-450px) translateZ(0); transform: translateX(0) translateY(-450px) translateZ(0); -webkit-transition: all 600ms 150ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 600ms 150ms cubic-bezier(.645, .045, .355, 1); transition: all 600ms 150ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-down.with-text h5 {-webkit-transform: translateX(0) translateY(150px) translateZ(0); -moz-transform: translateX(0) translateY(150px) translateZ(0); transform: translateX(0) translateY(150px) translateZ(0); -webkit-transition: all 750ms 150ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms 150ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms 150ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-down.quote h5 {-webkit-transform: translateX(0) translateY(150px) translateZ(0); -moz-transform: translateX(0) translateY(150px) translateZ(0); transform: translateX(0) translateY(150px) translateZ(0); -webkit-transition: all 750ms 350ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms 350ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms 350ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.active.with-text .text-holder {-webkit-transform: translateX(0%) translateY(0%); -moz-transform: translateX(0%) translateY(0%); transform: translateX(0%) translateY(0%); -webkit-transition: all 750ms 750ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms 750ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms 750ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.with-text .text-holder {-webkit-transform: translateX(0%) translateY(-50%); -moz-transform: translateX(0%) translateY(-50%); transform: translateX(0%) translateY(-50%); -webkit-transition: all 500ms 250ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 500ms 250ms cubic-bezier(.645, .045, .355, 1); transition: all 500ms 250ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-down.with-text .text-holder {-webkit-transform: translateX(0%) translateY(50%); -moz-transform: translateX(0%) translateY(50%); transform: translateX(0%) translateY(50%); -webkit-transition: all 750ms 250ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms 250ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms 250ms cubic-bezier(.645, .045, .355, 1); backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder .quote .media-holder:after {display: none } .sections-holder .we-believe .media-holder:after {content: "we believe"; font-size: 410px } .sections-holder .our-impact .media-holder:after {content: "our impact"; font-size: 410px } .sections-holder .quote blockquote {position: absolute; left: 50%; top: 50%; width: 1080px; font-family: 'maison-bold'; text-align: center; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .sections-holder .quote blockquote p {margin-bottom: 45px; font-size: 80px; letter-spacing: -4px; -webkit-transform: translateX(0%) translateY(100%) translateZ(0); -moz-transform: translateX(0%) translateY(100%) translateZ(0); transform: translateX(0%) translateY(100%) translateZ(0) } .sections-holder .quote blockquote cite {display: block; font-size: 22px; font-style: normal; -webkit-transform: translateX(0%) translateY(800%); -moz-transform: translateX(0%) translateY(800%); transform: translateX(0%) translateY(800%) } .sections-holder .quote blockquote cite:before {content: "_"} .sections-holder section.active.quote blockquote p {-webkit-transform: translateX(0%) translateY(0%) translateZ(0); -moz-transform: translateX(0%) translateY(0%) translateZ(0); transform: translateX(0%) translateY(0%) translateZ(0); -webkit-transition: all 750ms 550ms ease-in-out; -moz-transition: all 750ms 550ms ease-in-out; transition: all 750ms 550ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.quote blockquote p {-webkit-transform: translateX(0%) translateY(-100%) translateZ(0); -moz-transform: translateX(0%) translateY(-100%) translateZ(0); transform: translateX(0%) translateY(-100%) translateZ(0); -webkit-transition: all 550ms 200ms ease-in-out; -moz-transition: all 550ms 200ms ease-in-out; transition: all 550ms 200ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-down.quote blockquote p {-webkit-transform: translateX(0%) translateY(100%) translateZ(0); -moz-transform: translateX(0%) translateY(100%) translateZ(0); transform: translateX(0%) translateY(100%) translateZ(0); -webkit-transition: all 550ms 450ms ease-in-out; -moz-transition: all 550ms 450ms ease-in-out; transition: all 550ms 450ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.active.quote blockquote cite {-webkit-transform: translateX(0%) translateY(0%) translateZ(0); -moz-transform: translateX(0%) translateY(0%) translateZ(0); transform: translateX(0%) translateY(0%) translateZ(0); -webkit-transition: all 550ms 750ms ease-in-out; -moz-transition: all 550ms 750ms ease-in-out; transition: all 550ms 750ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.quote blockquote cite {-webkit-transform: translateX(0%) translateY(-500%) translateZ(0); -moz-transform: translateX(0%) translateY(-500%) translateZ(0); transform: translateX(0%) translateY(-500%) translateZ(0); -webkit-transition: all 550ms 200ms ease-in-out; -moz-transition: all 550ms 200ms ease-in-out; transition: all 550ms 200ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-down.quote blockquote cite {-webkit-transform: translateX(0%) translateY(1000%) translateZ(0); -moz-transform: translateX(0%) translateY(1000%) translateZ(0); transform: translateX(0%) translateY(1000%) translateZ(0); -webkit-transition: all 550ms 350ms ease-in-out; -moz-transition: all 550ms 350ms ease-in-out; transition: all 550ms 350ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .about .we-do .media-holder:after {content: "we do"; font-size: 610px } .about .process-intro .media-holder:after, .about .process .media-holder:after {content: "our process"; font-size: 360px } .about .we-create .media-holder:after {content: "we create"} .about .sections-holder section.with-list article {padding: 0 120px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .about .sections-holder section h5 {margin-bottom: 120px; font-family: 'maison-bold'; font-size: 20px } .about .sections-holder section h5, .about .sections-holder section.went-down h5 {-webkit-transform: translateX(0%) translateY(120px) translateZ(0); -moz-transform: translateX(0%) translateY(120px) translateZ(0); transform: translateX(0%) translateY(120px) translateZ(0); -webkit-transition: all 550ms 400ms ease-in-out; -moz-transition: all 550ms 400ms ease-in-out; transition: all 550ms 400ms ease-in-out } .about .sections-holder section.active h5 {-webkit-transform: translateX(0%) translateY(0%) translateZ(0); -moz-transform: translateX(0%) translateY(0%) translateZ(0); transform: translateX(0%) translateY(0%) translateZ(0); -webkit-transition: all 750ms 550ms ease-in-out; -moz-transition: all 750ms 550ms ease-in-out; transition: all 750ms 550ms ease-in-out } .about .sections-holder section.went-up h5 {-webkit-transform: translateX(0%) translateY(-350px) translateZ(0); -moz-transform: translateX(0%) translateY(-350px) translateZ(0); transform: translateX(0%) translateY(-350px) translateZ(0); -webkit-transition: all 550ms 250ms ease-in-out; -moz-transition: all 550ms 250ms ease-in-out; transition: all 550ms 250ms ease-in-out } .sections-holder .with-list ol {margin: 0; list-style: none } .sections-holder .with-list ol li {float: left;width: 48%;margin-right: 2%;} .sections-holder .with-list ol li h4 {clear: left; width: 100%; font-family: 'maison-bold'; font-size: 36px; white-space: nowrap } .sections-holder .with-list ol li p, .sections-holder .with-list ol li h1, .sections-holder .with-list ol li h2 {width: 100%; margin-bottom: 0; font-family: 'maison-medium'; font-size: 15px; line-height: 28px } .sections-holder .with-list ol li:nth-child(3n) {margin-right: 0 } .sections-holder section.went-down.with-list article ol li, .sections-holder section.with-list article ol li {-webkit-transform: translateX(0%) translateY(100%) translateZ(0); -moz-transform: translateX(0%) translateY(100%) translateZ(0); transform: translateX(0%) translateY(100%) translateZ(0); -webkit-transition: all 550ms 300ms ease-in-out; -moz-transition: all 550ms 300ms ease-in-out; transition: all 550ms 300ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.active.with-list article ol li {-webkit-transform: translateX(0%) translateY(0%) translateZ(0); -moz-transform: translateX(0%) translateY(0%) translateZ(0); transform: translateX(0%) translateY(0%) translateZ(0); -webkit-transition: all 550ms 750ms ease-in-out; -moz-transition: all 550ms 750ms ease-in-out; transition: all 550ms 750ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.with-list article ol li {-webkit-transform: translateX(0%) translateY(-75%) translateZ(0); -moz-transform: translateX(0%) translateY(-75%) translateZ(0); transform: translateX(0%) translateY(-75%) translateZ(0); -webkit-transition: all 550ms 250ms ease-in-out; -moz-transition: all 550ms 250ms ease-in-out; transition: all 550ms 250ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .about .sections-holder section.testimonials .media-holder:after {display: none } .testimonials-slider {padding: 0 15% } .sections-holder section article .testimonials-slider blockquote {text-align: center } .sections-holder section article .testimonials-slider blockquote p {width: auto; margin-bottom: 40px; font-family: 'maison-bold'; font-size: 30px; line-height: 50px; letter-spacing: -1px } .sections-holder section article .testimonials-slider cite {display: block; margin-bottom: 30px; text-align: center; font-family: 'maison-bold'; font-size: 16px; line-height: 30px; font-style: normal } .sections-holder section article .testimonials-slider cite em {display: block; font-family: 'maison-book'; font-style: normal } .sections-holder section article .testimonials-slider .slick-dots {margin-left: 0; text-align: center } .sections-holder section article .testimonials-slider .slick-dots li {display: inline-block; margin: 0 10px } .sections-holder section article .testimonials-slider .slick-dots li button {display: block; box-sizing: content-box; width: 2px; height: 2px; padding: 0; text-indent: -9999px; background-color: #000; border: #fff solid 3px; border-radius: 50%; outline: 0; -webkit-transition: all 700ms 0ms ease-in-out; -moz-transition: all 700ms 0ms ease-in-out; transition: all 700ms 0ms ease-in-out } .sections-holder section article .testimonials-slider .slick-dots li.slick-active button {background-color: #fff; border-color: #000 } .clients-intro .media-holder:after, .clients .media-holder:after {content: "our clients"; font-size: 410px } .sections-holder section.clients article {padding: 0 10%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .logos-list {overflow: hidden; margin: 0; list-style: none; -webkit-transform: translateX(-50px); -moz-transform: translateX(-50px); transform: translateX(-50px) } .logos-list li {float: left; width: 16.6%; margin-bottom: 50px } .logos-list li img {display: block; width: 100%; max-width: 180px; margin: 0 auto } .clients-list {overflow: hidden; margin: 0; list-style: none } .clients-list li {float: left; width: 15%; margin-right: 2%; font-size: 14px; line-height: 27px } .clients-list li:nth-child(6n) {margin-right: 0 } .sections-holder section.went-down.clients .logos-list, .sections-holder section.clients .logos-list {-webkit-transform: translateX(0) translateY(50%) translateZ(0); -moz-transform: translateX(0) translateY(50%) translateZ(0); transform: translateX(0) translateY(50%) translateZ(0); -webkit-transition: all 550ms 400ms ease-in-out; -moz-transition: all 550ms 400ms ease-in-out; transition: all 550ms 400ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.active.clients .logos-list {-webkit-transform: translateX(0) translateY(-20%) translateZ(0); -moz-transform: translateX(0) translateY(-20%) translateZ(0); transform: translateX(0) translateY(-20%) translateZ(0); transition: all 550ms 550ms ease-in-out; -webkit-transition: all 550ms 550ms ease-in-out; -moz-transition: all 550ms 550ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.clients .logos-list {-webkit-transform: translateX(0) translateY(-50%) translateZ(0); -moz-transform: translateX(0) translateY(-50%) translateZ(0); transform: translateX(0) translateY(-50%) translateZ(0); -webkit-transition: all 550ms 200ms ease-in-out; -moz-transition: all 550ms 200ms ease-in-out; transition: all 550ms 200ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-down.clients .clients-list, .sections-holder section.clients .clients-list {-webkit-transform: translateX(0) translateY(50%) translateZ(0); -moz-transform: translateX(0) translateY(50%) translateZ(0); transform: translateX(0) translateY(50%) translateZ(0); -webkit-transition: all 550ms 200ms ease-in-out; -moz-transition: all 550ms 200ms ease-in-out; transition: all 550ms 200ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.active.clients .clients-list {-webkit-transform: translateX(0) translateY(0%) translateZ(0); -moz-transform: translateX(0) translateY(0%) translateZ(0); transform: translateX(0) translateY(0%) translateZ(0); -webkit-transition: all 450ms 800ms ease-in-out; -moz-transition: all 450ms 800ms ease-in-out; transition: all 450ms 800ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .sections-holder section.went-up.clients .clients-list {-webkit-transform: translateX(0) translateY(-50%) translateZ(0); -moz-transform: translateX(0) translateY(-50%) translateZ(0); transform: translateX(0) translateY(-50%) translateZ(0); -webkit-transition: all 550ms 400ms ease-in-out; -moz-transition: all 550ms 400ms ease-in-out; transition: all 550ms 400ms ease-in-out; backface-visibility: hidden; -webkit-backface-visibility: hidden } .single-holder {position: fixed; top: 0; right: 0; left: 0; width: 100%; height: auto; background: #fff; webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: transform } .tablet, .mobile {overflow-y: visible !important } .mobile .single, .tablet .single {position: relative !important; top: auto; left: auto; height: auto !important; background: #fff } .mobile .single .single-holder, .tablet .single .single-holder {position: relative; top: auto; left: auto; height: auto !important; will-change: auto } .vs-scrollbar {display: block; position: absolute; z-index: 9998 } .vs-scrollbar.vs-vertical {top: 0; right: 0; bottom: 0; width: 8px; height: 100% } .vs-scrollbar .vs-scrolldrag {opacity: 0; width: 100%; height: auto; background: #000; cursor: pointer; -webkit-transition: opacity 250ms ease-in-out; -moz-transition: opacity 250ms ease-in-out; -ms-transition: opacity 250ms ease-in-out; -o-transition: opacity 250ms ease-in-out; transition: opacity 250ms ease-in-out } .postid-25 .vs-scrollbar .vs-scrolldrag {background: #e91027 } .postid-4 .vs-scrollbar .vs-scrolldrag {background: #bb9b6d } .postid-20 .vs-scrollbar .vs-scrolldrag {background: #ccc } .postid-17 .vs-scrollbar .vs-scrolldrag {background: #9e714c } .postid-14 .vs-scrollbar .vs-scrolldrag {background: #fa9d10 } .postid-375 .vs-scrollbar .vs-scrolldrag {background: #4a4a4a } .postid-404 .vs-scrollbar .vs-scrolldrag {background: #c67945 } .postid-567 .vs-scrollbar .vs-scrolldrag {background: #285a12 } .postid-559 .vs-scrollbar .vs-scrolldrag {background: #f3292f } .postid-498 .vs-scrollbar .vs-scrolldrag {background: #914c3b } .vs-scrollbar:hover .vs-scrolldrag, .scrolling .vs-scrollbar .vs-scrolldrag {opacity: 1 } .scrolling>* {user-select: none; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none } .single-intro {position: relative; overflow: hidden; background: #000; -webkit-backface-visibility: hidden; backface-visibility: hidden } .single-intro .bgr-holder {position: absolute; left: 0; top: 0; display: none; width: 100%; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: cover } .sections-holder .single-intro .bgr-holder {-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-transition: all 1000ms 0ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 1000ms 0ms cubic-bezier(.645, .045, .355, 1); transition: all 1000ms 0ms cubic-bezier(.645, .045, .355, 1) } .tablet .single-intro .bgr-holder {display: block } .single-intro video {position: fixed; top: 50%; left: 50%; z-index: -100; min-width: 100%; min-height: 100%; width: auto; height: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .single-intro .discover-btn {opacity: 0; -webkit-transition: opacity 500ms ease-in-out; -moz-transition: opacity 500ms ease-in-out; transition: opacity 500ms ease-in-out; -webkit-backface-visibility: hidden; backface-visibility: hidden } .single-holder .video-wrapper {overflow: hidden; width: 100%; height: 100%; background-position: center; background-size: cover; background-color: #eee } .single-holder .text-holder .video-wrapper {height: auto !important; margin-bottom: 150px; background-size: 100% 100% !important } .tablet .single-intro .video-wrapper {display: none } .vimeovideo {position: relative; overflow: hidden; width: 100%; height: 100%; margin: 0 auto } .vimeovideo input[type=range]:focus, .vimeovideo:focus {outline: 0 } .vimeovideo .vimeovideo-video-embed iframe, .vimeovideo-tooltip {pointer-events: none } .android .vimeovideo .vimeovideo-video-embed iframe, .android .vimeovideo-tooltip {pointer-events: auto } .vimeovideo, .vimeovideo *, .vimeovideo::after, .vimeovideo::before {box-sizing: border-box } .vimeovideo a, .vimeovideo button, .vimeovideo input, .vimeovideo label {-ms-touch-action: manipulation; touch-action: manipulation } .vimeovideo audio, .vimeovideo video {width: 100%; height: auto; vertical-align: middle; border-radius: inherit } .vimeovideo input[type=range] {display: block; height: 10px; width: 100%; margin: 0; padding: 0; vertical-align: middle; background: 0 0; border: 0; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none } .vimeovideo input[type=range]::-webkit-slider-runnable-track {height: 10px; background: 0 0; border: 0; border-radius: 0; -webkit-user-select: none; user-select: none } .vimeovideo input[type=range]::-webkit-slider-thumb {position: relative; height: 16px; width: 16px; margin-top: -4px; background: #fff; border: 2px solid transparent; border-radius: 100%; transition: background .2s ease, border .2s ease, transform .2s ease; box-shadow: 0 1px 1px rgba(0, 0, 0, .15), 0 0 0 1px rgba(0, 0, 0, .15); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none } .vimeovideo input[type=range]::-moz-range-track {height: 8px; background: 0 0; border: 0; border-radius: 0; -moz-user-select: none; user-select: none } .vimeovideo input[type=range]::-moz-range-thumb {position: relative; height: 16px; width: 16px; background: #fff; border: 2px solid transparent; border-radius: 100%; -webkit-transition: background .2s ease, border .2s ease, transform .2s ease; -moz-transition: background .2s ease, border .2s ease, transform .2s ease; transition: background .2s ease, border .2s ease, transform .2s ease; box-shadow: 0 1px 1px rgba(0, 0, 0, .15), 0 0 0 1px rgba(0, 0, 0, .15); -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .vimeovideo input[type=range]::-moz-focus-outer {border: 0 } .vimeovideo input[type=range].tab-focus:focus {outline-offset: 3px } .vimeovideo input[type=range]:active::-webkit-slider-thumb {background: #3498db; border-color: #fff; transform: scale(1.25) } .vimeovideo input[type=range]:active::-moz-range-thumb {background: #3498db; border-color: #fff; transform: scale(1.25) } .vimeovideo-video input[type=range].tab-focus:focus {outline: rgba(255, 255, 255, .5) dotted 1px } .vimeovideo-audio input[type=range].tab-focus:focus {outline: rgba(86, 93, 100, .5) dotted 1px } .vimeovideo-sr-only {clip: rect(1px, 1px, 1px, 1px); overflow: hidden; position: absolute !important; height: 1px !important; width: 1px !important; padding: 0 !important; border: 0 !important } .vimeovideo-video-wrapper {position: relative; border-radius: inherit } .vimeovideo-video-embed {overflow: hidden; z-index: 0; height: 0; padding-bottom: 56.25%; margin: 0 !important; border-radius: inherit } .vimeovideo-video-embed>div {position: relative; opacity: 0; padding-bottom: 200%; -webkit-transform: translateY(-35.95%) translateZ(0); -moz-transform: translateY(-35.95%) translateZ(0); transform: translateY(-35.95%) translateZ(0); transition: opacity 1250ms linear; backface-visibility: hidden } .vimeovideo-video-embed iframe {position: absolute; top: 0; left: 0; width: calc(100% + 10px); height: calc(100% + 10px); margin: -5px 0 0 -5px; border: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .vimeovideo-controls {position: absolute; left: 0; right: 0; bottom: -1px; z-index: 2; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; line-height: 1; text-align: center; color: #fff; border-bottom-left-radius: inherit; border-bottom-right-radius: inherit; -webkit-transition: opacity .3s ease; -moz-transition: opacity .3s ease; transition: opacity .3s ease } .vimeovideo-controls .vimeovideo-progress:first-child, .vimeovideo-controls>button:first-child {display: none } .vimeovideo-controls [data-vimeovideo=pause], .vimeovideo-controls [data-vimeovideo=fullscreen], .vimeovideo-controls [data-vimeovideo=captions] {display: none } .vimeovideo-controls button {position: absolute; right: 100px; bottom: 60px; display: none !important } .vimeovideo-controls button:focus {outline: 0 } .single-intro .vimeovideo-controls [data-vimeovideo=mute] {display: block !important; width: 41px; height: 34px; padding: 0; background-position: left top; background-repeat: no-repeat; background-size: 100% 200%; background-color: transparent; border: 0 } .single-intro .vimeovideo-muted .vimeovideo-controls [data-vimeovideo=mute] {background-position: 0 100% } .postid-25 .single-intro .vimeovideo-controls [data-vimeovideo=mute] {background-image: url(../imgs/icon-mute-happymoves.png) } .postid-4 .single-intro .vimeovideo-controls [data-vimeovideo=mute] {background-image: url(../imgs/icon-mute-plsplsme.png) } .postid-20 .single-intro .vimeovideo-controls [data-vimeovideo=mute] {background-image: url(../imgs/icon-mute-longo-park.png) } .postid-17 .single-intro .vimeovideo-controls [data-vimeovideo=mute] {background-image: url(../imgs/icon-mute-centaur.png) } .postid-14 .single-intro .vimeovideo-controls [data-vimeovideo=mute] {background-image: url(../imgs/icon-mute-renaissance.png) } .vimeovideo-hide-controls .vimeovideo-controls {opacity: 0; pointer-events: none } .vimeovideo-play-large {display: block; position: absolute; z-index: 1; top: 50%; left: 50%; padding: 40px 42px; margin-top: -58px; background: none; border: 4px solid currentColor; border-radius: 100%; box-shadow: 0 1px 1px rgba(0, 0, 0, .15); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: opacity .3s ease; -moz-transition: opacity .3s ease; transition: opacity .3s ease; outline: 0 } .vimeovideo-play-large span {display: block; width: 0; height: 0; border-top: 15px solid transparent; border-left: 24px solid red; border-bottom: 15px solid transparent; -webkit-transform: translateX(4px); -moz-transform: translateX(4px); transform: translateX(4px) } .vimeovideo-playing .vimeovideo-controls [data-vimeovideo=play], .vimeovideo-controls [data-vimeovideo=pause] {display: none } .vimeovideo-playing .vimeovideo-play-large {opacity: 0; visibility: hidden } .vimeovideo-playing .vimeovideo-controls [data-vimeovideo=pause] {display: inline-block } .vimeovideo-muted .vimeovideo-controls .icon-muted {display: block } .vimeovideo-progress input[type=range] {position: relative; z-index: 2; opacity: 0 } .vimeovideo-progress input[type=range]::-webkit-slider-runnable-track {background: 0 0 } .vimeovideo-progress input[type=range]::-moz-range-track {background: 0 0 } .vimeovideo .vimeovideo-progress {display: block; position: absolute; left: 0; bottom: 0; width: 100%; height: 6px; color: transparent } .vimeovideo-progress-buffer, .vimeovideo-progress-played {position: absolute; left: 0; top: 50%; width: 100%; height: 8px; margin: -3px 0 0; padding: 0; vertical-align: top; border: 0; border-radius: 0; -webkit-appearance: none; -moz-appearance: none; appearance: none } .vimeovideo-progress-buffer::-webkit-progress-bar, .vimeovideo-progress-played::-webkit-progress-bar {background: 0 0 } .vimeovideo-progress-buffer::-webkit-progress-value, .vimeovideo-progress-played::-webkit-progress-value {background: currentColor; border-radius: 0; min-width: 8px } .vimeovideo-progress-buffer::-moz-progress-bar, .vimeovideo-progress-played::-moz-progress-bar {background: currentColor; border-radius: 0; min-width: 8px } .vimeovideo-progress-played {z-index: 1; color: #3498db; background: 0 0; transition: none } .vimeovideo-progress-played::-webkit-progress-value {min-width: 8px; max-width: 99%; border-top-right-radius: 0; border-bottom-right-radius: 0; -webkit-transition: none; -moz-transition: none; transition: none } .vimeovideo-progress-played::-moz-progress-bar {min-width: 8px; max-width: 99%; border-top-right-radius: 0; border-bottom-right-radius: 0; -webkit-transition: none; -moz-transition: none; transition: none } .vimeovideo-progress-buffer::-webkit-progress-value {-webkit-transition: width .2s ease; -moz-transition: width .2s ease; transition: width .2s ease } .vimeovideo-progress-buffer::-moz-progress-bar {transition: width .2s ease } .vimeovideo-time, .vimeovideo-volume-display, .vimeovideo-volume {display: none } .vimeovideo-is-ios .vimeovideo-volume, .vimeovideo-is-ios [data-vimeovideo=mute] {display: none !important } .gm-custom-scroll-red .vimeovideo-progress-played {color: #ad1637 !important } .single-holder .text-holder {position: relative; overflow: hidden; max-width: 1300px; margin: 0 auto; padding-bottom: 50px } .single-holder .text-holder+.text-holder {padding-top: 0; margin-top: -100px } .single-holder .text-holder:last-of-type {padding-bottom: 50px } .desktop .single-holder .text-holder>* {opacity: 0; -webkit-transform: translateY(300px) translateZ(0); -moz-transform: translateY(300px) translateZ(0); transform: translateY(300px) translateZ(0); -webkit-transition: all 750ms cubic-bezier(.645, .045, .355, 1); -moz-transition: all 750ms cubic-bezier(.645, .045, .355, 1); transition: all 750ms cubic-bezier(.645, .045, .355, 1); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: transform, opacity } .single-holder .text-holder:nth-child(2)>h3:first-of-type {opacity: 1 !important; -webkit-transform: translateY(0) !important; -moz-transform: translateY(0) !important; transform: translateY(0) !important } .single-holder .text-holder>*.inview {opacity: 1; -webkit-transform: translateY(0) translateZ(0); -moz-transform: translateY(0) translateZ(0); transform: translateY(0) translateZ(0) } .single-holder .text-holder h1, .single-holder .text-holder h2, .single-holder .text-holder h3 {clear: both; position: relative; width: 300px; padding-top: 35px; margin-bottom: 25px; font-size: 44px; line-height: 60px; letter-spacing: -1px } .single-holder .text-holder h1.inview, .single-holder .text-holder h2.inview, .single-holder .text-holder h3.inview {-webkit-transform: translateY(0); -moz-transform: translateY(0); transform: translateY(0) } .single-holder .text-holder h1:before, .single-holder .text-holder h2:before, .single-holder .text-holder h3:before {content: ""; display: block; position: absolute; left: 0; top: 0; width: 30px; height: 6px } .single-holder .text-holder h1:last-child, .single-holder .text-holder h2:last-child, .single-holder .text-holder h3:last-child {margin-bottom: 0 !important } .single-holder .text-holder h4, .single-holder .text-holder h5, .single-holder .text-holder h6 {clear: both; width: 700px; margin-bottom: 335px; font-family: 'maison-book'; font-size: 27px; line-height: 60px; text-align: justify; font-weight: 400 } .single-holder .text-holder h4:last-child, .single-holder .text-holder h5:last-child, .single-holder .text-holder h6:last-child {margin: 0 !important } .single-holder .text-holder .project-tags {width: 300px; margin: 15px 0 0; font-family: 'maison-medium'; font-size: 12px; text-transform: uppercase; line-height: 22px; list-style: none } .single-holder .text-holder p {clear: both;width: 600px;margin-bottom: 15px;font-size: 20px;line-height: 30px;} .single-holder .text-holder p a {color: #000; -webkit-transition: color 200ms ease-in-out; -moz-transition: color 200ms ease-in-out; transition: color 200ms ease-in-out } .single-holder .text-holder p a:hover {color: red } .single-holder .text-holder p .img-holder {padding-bottom: 50px } .single-holder .text-holder p:last-child .img-holder {padding-bottom: 0 } .single-holder .text-holder .without-margin {opacity: 1 !important; -webkit-transform: translateY(0) !important; -moz-transform: translateY(0) !important; transform: translateY(0) !important } .single-holder .text-holder .without-margin .img-holder {padding-bottom: 0 !important } .single-holder .text-holder .without-margin+div {opacity: 1 !important; -webkit-transform: translateY(0) !important; -moz-transform: translateY(0) !important; transform: translateY(0) !important } .single-holder .text-holder p:last-child {margin: 0 !important } .single-holder .text-holder div {margin-bottom: 230px } .single-holder .text-holder img {display: block; width: 100% } .single-holder .text-holder div:last-child {margin-bottom: 0 !important } .single-holder .text-holder blockquote {text-align: center; margin-bottom: 100px } .single-holder .text-holder blockquote:last-of-type {margin-bottom: 0 } .single-holder .text-holder blockquote p {width: 80%; margin: 0 auto 100px; font-size: 24px; line-height: 40px } .single-holder .text-holder blockquote p:before, .single-holder .text-holder blockquote p:after {content: ""} .single-holder .text-holder blockquote h4, .single-holder .text-holder blockquote h5, .single-holder .text-holder blockquote h6 {width: 100% } .single-holder .text-holder blockquote h4 {margin-bottom: 0; font-size: 36px; font-family: 'maison-bold'} .single-holder .text-holder blockquote h5 {margin-bottom: 10px; font-size: 46px; letter-spacing: .5px } .single-holder .text-holder blockquote h6 {margin-bottom: 120px; font-size: 26px } .single-holder .text-holder blockquote img {width: auto; height: auto; margin: 0 auto 150px } .single-holder .text-holder blockquote cite {font-family: 'maison-bold'; font-size: 24px } .single-holder .text-holder blockquote:last-child {margin: 0 !important } .single-holder .text-holder:nth-child(2) {padding-top: 95px; z-index: 100; } .mobile .single-holder .text-holder>*, .tablet .single-holder .text-holder>* {-webkit-transform: translateY(0px) !important; -moz-transform: translateY(0px) !important; transform: translateY(0px) !important } .single-holder .text-holder .video-below-without-margin+.video-wrapper {margin-bottom: 0 !important } .images-list ul {margin: 0; list-style: none } .images-list li {margin-bottom: 10px; background-position: center; background-repeat: no-repeat; background-size: cover; background-color: #eee } .images-list li:last-child {margin-bottom: 0 } .next-project-holder {position: relative; z-index: 2 } .top-btn {display: block; position: absolute; left: 100px; bottom: 100%; z-index: 1001; padding-right: 45px; margin-bottom: 60px; line-height: 10px; font-size: 8px; text-transform: uppercase; text-decoration: none; color: #000; -webkit-transform: translateY(40px) rotate(-90deg); -moz-transform: translateY(40px) rotate(-90deg); transform: translateY(40px) rotate(-90deg); -webkit-transform-origin: left top; -moz-transform-origin: left top; transform-origin: left top; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out } .top-btn .arrow {position: absolute; display: block; top: 50%; width: 22px; height: 1px; margin-top: -1px; background: #000; -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); transform: rotate(180deg); -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out } .top-btn .arrow:before, .top-btn .arrow:after {content: ""; display: block; position: absolute; right: 0; top: -2px; width: 5px; height: 1px; background: #000; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } .top-btn .arrow:after {top: auto; bottom: -2px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg) } .top-btn .arrow {right: 0 } .top-btn .arrow:before, .top-btn .arrow:after {left: 0; right: auto; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg) } .top-btn .arrow:after {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } .top-btn:hover .arrow {-webkit-transform: translateX(20px) rotate(180deg); -moz-transform: translateX(20px) rotate(180deg); transform: translateX(20px) rotate(180deg) } .top-btn.inview {-webkit-transform: translateY(-80px) rotate(-90deg); -moz-transform: translateY(-80px) rotate(-90deg); transform: translateY(-80px) rotate(-90deg) } .share-project-list {position: absolute; right: 50%; bottom: 100%; display: none; margin: 0 -660px 0 0; list-style: none; -webkit-transform: translateY(-120px); -moz-transform: translateY(-120px); transform: translateY(-120px); -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out } .share-project-list li {line-height: 20px; font-size: 10px; text-transform: uppercase } .share-project-list li a {color: #000; text-decoration: none } .share-project-list li a:hover {text-decoration: underline } .share-project-list.inview {-webkit-transform: translateY(-275px); -moz-transform: translateY(-275px); transform: translateY(-275px) } .share-project-list:before {content: "Share on:"; display: block; margin-bottom: 15px; font-family: 'maison-book'; font-size: 10px } .more-projects h4 {position: relative; margin-bottom: 100px; padding-bottom: 65px; font-size: 36px; text-align: center } .more-projects h4 .arrow {position: absolute; display: block; bottom: 0; left: 50%; width: 40px; height: 1px; margin-top: 55px; background: #000; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transform-origin: left; -moz-transform-origin: left; transform-origin: left } .more-projects h4 .arrow:before, .more-projects h4 .arrow:after {content: ""; display: block; position: absolute; right: 0; top: -2px; width: 5px; height: 1px; background: #000; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } .more-projects h4 .arrow:after {top: auto; bottom: -2px; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg) } .more-projects h4 .arrow {right: 0 } .more-projects h4 .arrow:before, .more-projects h4 .arrow:after {left: 0; right: auto; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg) } .more-projects h4 .arrow:after {-webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } .more-projects ul {overflow: hidden; margin: 0; list-style: none } .more-projects ul li  , .choose-ul li{float: left; position: relative; overflow: hidden; width: 33.33%; height: 320px; background: #fff; } .more-projects ul li a , .choose-ul li a {display: block; position: absolute; left: 0; top: 0; overflow: hidden; width: 100%; height: 100%; text-decoration: none; font-size: 30px; font-weight: bolder; line-height: 320px; text-align: center; background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-transition: all 750ms ease-in-out; -moz-transition: all 750ms ease-in-out; transition: all 750ms ease-in-out; background-color: rgba(0,0,0,.8); } .more-projects ul li a:after {/* content: ""; */ display: block; position: absolute; left: 0; top: 0; opacity: 0; width: 100%; height: 100%; background: #000; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; } .more-projects ul li a:hover ,.choose-ul li a:hover{-webkit-transform: scale(1.15); -moz-transform: scale(1.15); transform: scale(1.15) } .more-projects ul li a:hover:after {opacity: .25 } .more-projects ul li:last-child {width: 33.34% } .contact-holder {position: relative; height: 100%; background: #fff } .contact-holder .bgr-holder {position: absolute; left: 0; top: 0; width: 100%; height: 100% } .contact-holder .bgr-holder h3 {position: absolute; left: 50%; top: 50%; font-size: 420px; color: #fff; white-space: nowrap; letter-spacing: -20px; text-shadow: 0 20px 80px rgba(0, 0, 0, 0.075); -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0px); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0px); transform: translateX(-50%) translateY(-50%) translateZ(0px); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-user-select: none; -moz-user-select: none; user-select: none } .contact-holder .text-holder {position: absolute; left: 50%; top: 50%; z-index: 2; width: 100%; max-width: 1240px; margin-top: -50px; font-size: 16px; line-height: 30px; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%) } .contact-holder .text-holder .left {float: left; width: 44% } .contact-holder .text-holder .right {position: relative;float: right;width: 44%;/* padding-bottom: 80px */} .contact-holder .text-holder h1 {margin-bottom: 50px; font-size: 192px; line-height: 192px; letter-spacing: -10px } .contact-holder .text-holder h2 {font-family: 'maison-book'; font-weight: 400 } .contact-holder .text-holder ul {margin: 0 0 60px; list-style: none } .contact-holder .text-holder ul li {margin-bottom: 25px; line-height: 28px } .contact-holder .text-holder ul li strong {display: block } .contact-holder .text-holder ul li a {font-family: 'maison-medium'; font-size: 12px; color: #000; text-decoration: none } .contact-holder .text-holder ul li a:hover {text-decoration: underline } .contact-holder .text-holder ul li:last-child {margin: 0 } .contact-holder .text-holder em {display: block; font-style: normal; font-size: 14px; line-height: 28px } .contact-holder .text-holder h3 {position: absolute; left: 0; top: 100%; width: 100%; font-size: 24px } .contact-holder .text-holder h3>a {display: none } .contact-holder .text-holder h3 em {margin-bottom: 40px } .contact-holder .text-holder h3 em a {display: inline-block; font-size: 40px; line-height: 50px; color: #000; text-decoration: none } .contact-holder .text-holder h3 em a:hover {text-decoration: underline } .contact-holder .text-holder h3 em a i {font-style: normal } .contact-holder .text-holder h3 em a:after {/* content: ""; */ display: inline-block; width: 21px; height: 30px; margin-left: 8px; background: url(../imgs/icon-pin-dark.png) no-repeat; background-size: 100% 100%; } .mobile .page-template-page-contact {height: auto !important; background: #fff } .work {background: #fff } .work-holder {position: relative; height: 100%; padding-top: 260px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .tablet .work-holder, .mobile .work-holder {height: auto } .mobile .page-template-page-work, .tablet .page-template-page-work {position: relative !important; top: auto; left: auto; height: auto !important; background: #fff } .page-template-page-work .vs-scrollbar {visibility: hidden } .filters {/* position: absolute; */ right: 100px; /* top: 180px; */ margin: 0; list-style: none; } .filters li {float: left; margin: 0 40px } .filters li a {position: relative; display: block; padding-bottom: 4px; font-family: 'maison-medium'; font-size: 15px; color: #000; text-decoration: none } .filters li a:after {content: ""; display: block; position: absolute; left: 50%; bottom: 0; width: 0; height: 2px; background: #000; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out } .filters li a.is-checked:after, .desktop .filters li a:hover:after {left: 0; width: 100% } .filters li:last-child {margin-right: 0 } .work-grid-holder {position: relative; overflow: hidden; height: 100% } .tablet .work-grid-holder, .mobile .work-grid-holder {height: auto } .work-grid .item {position: relative; height: 360px; width: 33.33%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .work-grid .item a {position: absolute; left: 0; top: 0; overflow: hidden; width: 100%; height: 100% } .work-grid .item .bgr-holder, .work-grid .item .layer-one, .work-grid .item .layer-two {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out } .work-grid .happy-moves .bgr-holder {background-image: url(../imgs/bgr-happy-moves.jpg) } .work-grid .happy-moves .layer-one {/* background-image: url(../imgs/bgr-work-happy-moves-layer-one.png); */ background-position: right bottom; -webkit-transform-origin: center bottom; transform-origin: center bottom; } .work-grid .happy-moves .layer-two {background-image: url(../imgs/bgr-work-happy-moves-layer-two.png); background-position: right bottom; -webkit-transform-origin: center bottom; transform-origin: center bottom } .work-grid .pls-pls-me .bgr-holder {background-image: url(../imgs/bgr-pls-pls-me.jpg) } .work-grid .pls-pls-me .layer-one {background-image: url(../imgs/bgr-work-pls-pls-me-layer-one.png); -webkit-transform-origin: left top; transform-origin: left top } .work-grid .pls-pls-me .layer-two {background-image: url(../imgs/bgr-work-pls-pls-me-layer-two.png); -webkit-transform-origin: left top; transform-origin: left top } .work-grid .longo-park .bgr-holder {background-image: url(../imgs/bgr-longo-park.jpg) } .work-grid .longo-park .layer-one {background-image: url(../imgs/bgr-work-longo-park-layer-one.png); background-position: left center; -webkit-transform-origin: left bottom; transform-origin: left bottom } .work-grid .longo-park .layer-two {background-image: url(../imgs/bgr-work-longo-park-layer-two.png); background-position: right bottom; -webkit-transform-origin: right bottom; transform-origin: right bottom } .work-grid .discover-your-city .bgr-holder {background-image: url(../imgs/bgr-renaissance.jpg) } .work-grid .discover-your-city .layer-one {background-image: url(../imgs/bgr-work-discover-your-city-layer-one.png); background-position: right bottom; -webkit-transform-origin: center bottom; transform-origin: center bottom } .work-grid .discover-your-city .layer-two {background-image: url(../imgs/bgr-work-discover-your-city-layer-two.png); background-position: left top; -webkit-transform-origin: left bottom; transform-origin: left bottom } .work-grid .centaur-properties .bgr-holder {background-image: url(../imgs/bgr-centaur-properties.jpg) } .work-grid .centaur-properties .layer-one {background-image: url(../imgs/bgr-work-centaur-properties-layer-one.png); background-position: right bottom; -webkit-transform-origin: right bottom; transform-origin: right bottom } .work-grid .centaur-properties .layer-two {background-image: url(../imgs/bgr-work-centaur-properties-layer-two.png); background-position: left top; -webkit-transform-origin: left bottom; transform-origin: left bottom } .work-grid .the-yoga-school .bgr-holder {background-image: url(../imgs/bgr-yoga-school.jpg) } .work-grid .the-yoga-school .layer-one {background-image: url(../imgs/bgr-work-yoga-school-layer-one.png); background-position: right bottom; -webkit-transform-origin: right bottom; transform-origin: right bottom } .work-grid .the-yoga-school .layer-two {background-image: url(../imgs/bgr-work-yoga-school-layer-two.png); background-position: left top; -webkit-transform-origin: left bottom; transform-origin: left bottom } .work-grid .the-assemblage .bgr-holder {background-image: url(../imgs/bgr-assemblage-thumbnail.jpg) } .work-grid .the-assemblage .layer-one {background-image: url(../imgs/bgr-work-assemblage-layer-one.png); background-position: right bottom; -webkit-transform-origin: right bottom; transform-origin: center top } .work-grid .the-assemblage .layer-two {background-image: url(../imgs/bgr-work-assemblage-layer-two.png); background-position: left top; -webkit-transform-origin: left bottom; transform-origin: right bottom } .work-grid .think-global-school .bgr-holder {background-image: url(../imgs/bgr-tgs-thumbnail.jpg) } .work-grid .think-global-school .layer-one {background-image: url(../imgs/bgr-work-tgs-layer-one.png); background-position: right bottom; -webkit-transform-origin: right bottom; transform-origin: center top } .work-grid .think-global-school .layer-two {background-image: url(../imgs/bgr-work-tgs-layer-two.png); background-position: left top; -webkit-transform-origin: left bottom; transform-origin: right bottom } .work-grid .item.heineken h3 {z-index: 2 } .work-grid .heineken .bgr-holder {background-image: url(../imgs/bgr-heineken-thumbnail.jpg) } .work-grid .heineken .layer-one {z-index: 1; background-image: url(../imgs/bgr-work-heineken-layer-one.png); background-position: right bottom; -webkit-transform-origin: right bottom; transform-origin: center top } .work-grid .heineken .layer-two {background-image: url(../imgs/bgr-work-heineken-layer-two.png); background-position: left top; -webkit-transform-origin: left bottom; transform-origin: right bottom } .work-grid .grand-marnier .bgr-holder {background-image: url(../imgs/bgr-gm-layer-thumbnail.png) } .work-grid .grand-marnier .layer-one {background-image: url(../imgs/bgr-gm-layer-one.png); background-position: right bottom; -webkit-transform-origin: right bottom; transform-origin: center top } .work-grid .grand-marnier .layer-two {background-image: url(../imgs/bgr-gm-layer-two.png); background-position: left top; -webkit-transform-origin: left bottom; transform-origin: right bottom } .work-grid .capitalonespark .bgr-holder {background-image: url(../imgs/bgr-work-spark.jpg); -webkit-transform-origin: left top; transform-origin: left top } .work-grid .capitalonespark .layer-one {background-image: url(../imgs/bgr-work-spark-layer-one.png); background-position: right bottom; -webkit-transform-origin: right top; transform-origin: center bottom } .work-grid .capitalonespark .layer-two {background-image: url(../imgs/bgr-work-spark-layer-two.png); background-position: left top; -webkit-transform-origin: center top; transform-origin: center top } .desktop .work-grid .item:hover .bgr-holder, .desktop .work-grid .item:hover .layer-one, .desktop .work-grid .item:hover .layer-two {-webkit-transform: scale(1.15); -moz-transform: scale(1.15); transform: scale(1.15) } .desktop .work-grid .item.capitalonespark:hover .layer-two {-webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1) } .work-grid .item h3 {position: absolute; left: 80px; bottom: 60px; width: 280px; color: #fff; font-size: 54px; line-height: 46px; -webkit-transition: all 500ms ease-in-out; -moz-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; -webkit-transform-origin: left bottom; transform-origin: left bottom } .work-grid .longo-park h3, .work-grid .the-yoga-school h3, .work-grid .grand-marnier h3, .work-grid .capitalonespark h3 {color: #000 } .desktop .work-grid .item:hover h3 {-webkit-transform: scale(1.25); -moz-transform: scale(1.25); transform: scale(1.25) } .careers .sections-holder section article {bottom: auto; top: 50% } .careers .media-holder:after {content: "careers"; position: absolute; left: 50%; top: 50%; font-family: 'maison-bold'; font-size: 578px; color: #fff; white-space: nowrap; letter-spacing: -20px; text-shadow: 0 0 0 rgba(0, 0, 0, 0.075); -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0px); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0px); transform: translateX(-50%) translateY(-50%) translateZ(0px); -webkit-transition: all 250ms; -moz-transition: all 250ms; transition: all 250ms; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-user-select: none; -moz-user-select: none; user-select: none } .careers .active .media-holder:after {text-shadow: 0 0 80px rgba(0, 0, 0, 0.075); -webkit-transition-delay: 1550ms; -webkit-transition-duration: 950ms; -moz-transition-delay: 1550ms; -moz-transition-duration: 950ms; transition-delay: 1550ms; transition-duration: 950ms } .careers .sections-holder section.active article {-webkit-transform: translateX(-50%) translateY(-50%) translateZ(0px); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0px); transform: translateX(-50%) translateY(-50%) translateZ(0px); -webkit-transition: -webkit-transform 800ms 500ms ease-in-out; -moz-transition: -moz-transform 800ms 500ms ease-in-out; transition: transform 800ms 500ms ease-in-out } .careers .sections-holder section.intro article {max-width: 1020px } .careers .intro h1 {float: left; max-width: 280px; font-size: 114px; line-height: 100px; letter-spacing: -6px } .careers .intro h2 {float: right; max-width: 650px; font-size: 38px; line-height: 64px; letter-spacing: -2px } .sections-holder section.career-positions h3 {width: auto; margin-bottom: 0; font-size: 70px; line-height: 85px } .sections-holder section.career-positions ul {margin: 0; list-style: none; overflow: hidden } .sections-holder section.career-positions.one-item ul {text-align: center } .sections-holder section.career-positions.one-item ul li {display: inline-block; text-align: center } .sections-holder section.career-positions.two-items ul li {float: left; width: 50% } .sections-holder section.career-positions.three-items ul li {float: left; width: 33% } .sections-holder section.career-positions.four-items ul li {float: left; width: 50% } .sections-holder section.career-positions.four-items ul li:nth-child(2n+1) {clear: left } .sections-holder section.career-positions.six-items ul li {float: left; width: 33% } .sections-holder section.career-positions.six-items ul li:nth-child(3n+1) {clear: left } .error404 .sections-holder {background: #fff } .error404 section:before {content: "404"; position: absolute; left: 50%; top: 50%; font-family: 'maison-bold'; font-size: 420px; color: #fff; white-space: nowrap; letter-spacing: -20px; text-shadow: 0 0 80px rgba(0, 0, 0, 0.075); -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0px); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0px); transform: translateX(-50%) translateY(-50%) translateZ(0px); -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-user-select: none; -moz-user-select: none; user-select: none } .error404 section p {position: absolute; left: 50%; top: 50%; width: 100%; font-family: 'maison-bold'; font-size: 42px; line-height: 42px; text-align: center; -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0px); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0px); transform: translateX(-50%) translateY(-50%) translateZ(0px) } .error404 section p a {font-family: 'maison-book'; font-size: 16px; color: #000 } @media screen and (max-width:2024px) {.sections-holder section article, .single-intro article {max-width: 1440px } } @media screen and (max-width:2000px) {.sections-holder section article, .single-intro article {max-width: 1440px } .sections-holder section.home-about article {max-width: 1100px } .sections-holder section.home-about article h1 {font-size: 30px; line-height: 56px } } @media screen and (max-width:1920px) {.about .media-holder:after, .from-services .media-holder:after {font-size: 410px } .we-are .media-holder:after {font-size: 480px } } @media screen and (max-width:1780px) {footer>p {font-size: 32px; line-height: 50px } footer .bottom {padding: 40px 100px } .home .sections-holder section.intro .media-holder:after {font-size: 380px } .sections-holder section.home-about article {max-width: 1240px } .sections-holder section.home-about article h1 {font-size: 32px; line-height: 50px } .single-projects footer, .page-template-page-work footer {padding-top: 60px } } @media screen and (max-width:1600px) {.home .sections-holder section.intro .media-holder:after {font-size: 340px } .sections-holder section.home-about article {max-width: 1020px } } @media screen and (max-width:1440px) {header .logo {width: 92px; height: 16px } header .nav-trigger {line-height: 16px; font-size: 12px } header nav {padding: 100px 215px 0 100px } header nav .main {margin-bottom: 70px } header nav .main li {font-size: 60px; line-height: 68px } header nav p {left: 100px; font-size: 16px } header nav p em {margin-bottom: 30px; font-size: 26px; line-height: 39px } header nav p em a:after {width: 11px; height: 16px } .contact .sections-holder section article, .home .sections-holder section article, .single-intro article {width: 100%; max-width: 1080px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box } .sections-holder .case-study article h6 {font-size: 26px } .sections-holder section article h3 {font-size: 120px; line-height: 108px } .sections-holder section article h3 a {font-size: 120px } .sections-holder section article p, .sections-holder section article h4 {font-size: 14px; line-height: 22px } .sections-holder section article a {font-size: 12px } .sections-holder section article .testimonials-slider blockquote p {margin-bottom: 30px; font-size: 24px; line-height: 44px; letter-spacing: 0 } .sections-holder section article .testimonials-slider cite {margin-bottom: 20px; font-size: 14px; line-height: 24px } footer>p {font-size: 28px } footer .bottom {background-size: 92px 16px } footer .bottom>a {width: 92px; height: 16px } footer ul li a {font-size: 10px } .home .sections-holder section.intro .media-holder:after {font-size: 320px } .sections-holder section.intro article h3 {margin-bottom: 20px; font-size: 16px; text-align: center } .sections-holder section.intro article p {padding-left: 0; text-align: center } .sections-holder section.intro article p span {font-size: 78px } .sections-holder section.active.home-about article {-webkit-transform: translateX(-50%) translateY(35%) translateZ(0px); -moz-transform: translateX(-50%) translateY(35%) translateZ(0px); transform: translateX(-50%) translateY(35%) translateZ(0px) } .sections-holder section.home-about article h1 {max-width: 1020px; font-size: 36px; line-height: 52px } .about .media-holder:after, .from-services .media-holder:after {font-size: 340px } .we-are .media-holder:after {font-size: 360px } .about .we-design .media-holder:after {font-size: 320px } .sections-holder section.with-text article {max-width: 800px } .sections-holder section.with-text h5, .sections-holder section.quote h5 {font-size: 16px; line-height: 26px } .sections-holder section.with-text .text-holder {padding: 0 0 0 100px; font-size: 36px; line-height: 52px } .sections-holder .quote .media-holder:after {display: none } .sections-holder .we-believe .media-holder:after, .sections-holder .our-impact .media-holder:after {font-size: 320px } .sections-holder .quote blockquote {width: 800px } .sections-holder .quote blockquote p {font-size: 60px; line-height: 80px } .sections-holder .quote blockquote cite {font-size: 20px } .sections-holder .with-list {padding: 0 } .about .we-do .media-holder:after {font-size: 360px } .about .process-intro .media-holder:after, .about .process .media-holder:after {font-size: 270px } .about .sections-holder section.with-list article {max-width: 950px; padding: 0 } .about .sections-holder section h5 {font-size: 16px; margin-bottom: 40px } .sections-holder .with-list ol {-webkit-transform: translateY(0px); -moz-transform: translateY(0px); transform: translateY(0px) } // .sections-holder .with-list ol li{width:22%;margin-right:17%}.sections-holder .with-list ol li h3{width:62%}.sections-holder .with-list ol li h4{margin-bottom:30px;font-size:28px}.sections-holder .with-list ol li:before{margin-bottom:18px;font-size:16px}.sections-holder .with-list ol li:nth-child(4),.sections-holder .with-list ol li:nth-child(5),.sections-holder .with-list ol li:last-child{margin-bottom:0}.clients-intro .media-holder:after{font-size:320px}.clients .media-holder:after{font-size:320px;-webkit-transform:translateX(-50%) translateY(-60%) translateZ(0px);-moz-transform:translateX(-50%) translateY(-60%) translateZ(0px);transform:translateX(-50%) translateY(-60%) translateZ(0px)}.sections-holder section.clients article{padding:0;max-width:850px}.logos-list li{width:10%;margin-right:8%;margin-bottom:40px}.logos-list li img{width:100%;height:auto}.logos-list li:nth-child(6n){margin-right:0}.sections-holder section.went-down.clients .logos-list,.sections-holder section.clients .logos-list{-webkit-transform:translateX(0px) translateY(50%) translateZ(0px);-moz-transform:translateX(0px) translateY(50%) translateZ(0px);transform:translateX(0px) translateY(50%) translateZ(0px)}.sections-holder section.active.clients .logos-list{-webkit-transform:translateX(0px) translateY(0%) translateZ(0px);-moz-transform:translateX(0px) translateY(0%) translateZ(0px);transform:translateX(0px) translateY(0%) translateZ(0px)}.sections-holder section.went-up.clients .logos-list{-webkit-transform:translateX(0px) translateY(-50%) translateZ(0px);-moz-transform:translateX(0px) translateY(-50%) translateZ(0px);transform:translateX(0px) translateY(-50%) translateZ(0px)}.clients-list li{font-size:10px}.single-intro article{bottom:5%}.single-intro article h1{margin-bottom:40px;font-size:86px;line-height:76px}.single-intro article h2{font-size:12px;line-height:20px}.single-holder .text-holder{max-width:980px;padding:235px 0}.single-holder .text-holder>*{-webkit-transform:translateY(150px);-moz-transform:translateY(150px);transform:translateY(150px)}.single-holder .text-holder h1,.single-holder .text-holder h2,.single-holder .text-holder h3{width:250px;margin-bottom:90px;font-size:32px;line-height:45px}.single-holder .text-holder .project-tags{width:250px}.single-holder .text-holder h4,.single-holder .text-holder h5,.single-holder .text-holder h6,.single-holder .text-holder p{width:500px;margin-bottom:135px;font-size:28px;line-height:45px}.single-holder .text-holder p{font-size:16px}.single-holder .text-holder blockquote p{width:68%;font-size:18px;line-height:30px}.single-holder .text-holder blockquote cite{font-size:18px}.single-holder .text-holder blockquote h5{font-size:36px}.single-holder .text-holder blockquote h4{font-size:26px}.single-holder .text-holder blockquote h6{font-size:16px;margin-bottom:80px}.single-holder .text-holder blockquote img{margin-bottom:80px}.single-holder .text-holder .video-wrapper{margin-bottom:100px}.desktop .single-holder .text-holder>*{-webkit-transform:translateY(200px) translateZ(0px);-moz-transform:translateY(200px) translateZ(0px);transform:translateY(200px) translateZ(0px)}.single-holder .text-holder>*.inview{-webkit-transform:translateY(0px) translateZ(0px);-moz-transform:translateY(0px) translateZ(0px);transform:translateY(0px) translateZ(0px)}.single-holder .text-holder:last-of-type{/* padding-bottom:330px */}.top-btn{left:170px}.top-btn.inview{-webkit-transform:translateY(-40px) rotate(-90deg);-moz-transform:translateY(-40px) rotate(-90deg);transform:translateY(-40px) rotate(-90deg)}.share-project-list{margin:0 -50% 0 0;padding-right:300px}.share-project-list.inview{-webkit-transform:translateY(-175px);-moz-transform:translateY(-175px);transform:translateY(-175px)}.more-projects h4{font-size:28px}.more-projects ul li{height:250px}.contact-holder .text-holder{max-width:840px}.contact-holder .bgr-holder h3{font-size:300px}.contact-holder .text-holder h1{margin-bottom:20px;font-size:144px;line-height:144px}.contact-holder .text-holder h2{font-size:12px;line-height:22px}.contact-holder .text-holder ul li{font-size:14px;line-height:20px}.contact-holder .text-holder h3{font-size:18px;line-height:42px}.contact-holder .text-holder h3 em{margin-bottom:20px}.contact-holder .text-holder h3 em a{font-size:30px;line-height:40px}.contact-holder .text-holder h3 em a:after{width:17px;height:24px}.work-holder{padding-top:240px}.filters li{margin:0 30px}.filters li a{font-size:14px}.filters li:last-child{margin-right:0}.work-grid .item h3{left:60px;bottom:50px;width:210px;font-size:40px;line-height:35px}}@media screen and (max-width:1366px){header .logo{width:86px;height: 60px;}header .nav-trigger{line-height:15px;font-size:12px}header nav{min-width: 600px !important;padding:100px 215px 0 80px;}header nav .main{margin-bottom:60px}header nav .main li{font-size:52px;line-height:58px}header nav .social li{font-size:8px;line-height:16px}header nav p{left:80px;bottom:40px;font-size:14px}header nav p em{margin-bottom:30px;font-size:22px;line-height:32px}header nav p em a:after{width:11px;height:16px}header nav span{margin-bottom:10px}.contact .sections-holder section article,.home .sections-holder section article,.single-intro article{max-width:100%;padding:0 100px}.home .sections-holder section.from-services article{padding:0}.sections-holder section article h3{font-size:114px;line-height:102px}.sections-holder section article h3 a{font-size: 60px;line-height: 60px;}.sections-nav li{margin-bottom:20px}.sections-nav li a{width:3px;height:3px}footer>p{font-size:25px;margin-bottom:40px}footer .bottom{background-size:86px 15px}footer .bottom>a{width:86px;height:15px}footer ul li a{font-size:10px}.sections-holder section.intro article p span{font-size:74px;color: #98e70a;}.home .sections-holder .intro .mouse{bottom:55px}.sections-holder section.active.home-about article{-webkit-transform:translateX(-50%) translateY(30%) translateZ(0px);-moz-transform:translateX(-50%) translateY(30%) translateZ(0px);transform:translateX(-50%) translateY(30%) translateZ(0px)}.sections-holder section.home-about article h1{max-width:920px;margin:0 auto;font-size:22px;line-height:50px}.about .media-holder:after,.from-services .media-holder:after{font-size:300px}.we-are .media-holder:after{font-size:340px}.about .we-design .media-holder:after{font-size:290px}.sections-holder section.with-text article{max-width:800px}.sections-holder section.with-text h5,.sections-holder section.quote h5{font-size:14px;line-height:26px}.sections-holder section.with-text .text-holder,.sections-holder section.we-believe.with-text .text-holder{padding:0 40px 0 100px;font-size:34px;line-height:48px}.sections-holder .quote .media-holder:after,.sections-holder .we-believe .media-holder:after,.sections-holder .our-impact .media-holder:after{font-size:290px}.sections-holder .quote blockquote{width:730px}.sections-holder .quote blockquote p{font-size:56px;line-height:72px}.sections-holder .quote blockquote cite{font-size:16px}.sections-holder .with-list{padding:0}.about .we-do .media-holder:after{font-size:360px}.about .process-intro .media-holder:after,.about .process .media-holder:after{font-size:270px}.about .sections-holder section.with-list article{padding-top:40px}// .sections-holder .with-list ol li{width:25%;margin-right:12%}.about .sections-holder section h5{font-size:14px}.sections-holder .with-list ol li h3{width:62%}.sections-holder .with-list ol li h4{margin-bottom:30px;font-size:25px}.sections-holder .with-list ol li:before{margin-bottom:18px;font-size:16px}.sections-holder .with-list ol li:nth-child(4),.sections-holder .with-list ol li:nth-child(5),.sections-holder .with-list ol li:last-child{margin-bottom:0}.clients-intro .media-holder:after{font-size:290px}.clients .media-holder:after{font-size:290px;-webkit-transform:translateX(-50%) translateY(-72%) translateZ(0px);-moz-transform:translateX(-50%) translateY(-72%) translateZ(0px);transform:translateX(-50%) translateY(-72%) translateZ(0px)}.sections-holder section.clients article{max-width:850px;padding:0;-webkit-transform:translateX(-50%) translateY(-65%);-moz-transform:translateX(-50%) translateY(-65%);transform:translateX(-50%) translateY(-65%)}.logos-list li{width:12%;margin-right:5%;margin-bottom:40px}.logos-list li img{width:100%;height:auto}.logos-list li:nth-child(6n){margin-right:0}.sections-holder section.went-down.clients .logos-list,.sections-holder section.clients .logos-list{-webkit-transform:translateX(0px) translateY(50%) translateZ(0px);-moz-transform:translateX(0px) translateY(50%) translateZ(0px);transform:translateX(0px) translateY(50%) translateZ(0px)}.sections-holder section.active.clients .logos-list{-webkit-transform:translateX(0px) translateY(0%) translateZ(0px);-moz-transform:translateX(0px) translateY(0%) translateZ(0px);transform:translateX(0px) translateY(0%) translateZ(0px)}.sections-holder section.went-up.clients .logos-list{-webkit-transform:translateX(0px) translateY(-50%) translateZ(0px);-moz-transform:translateX(0px) translateY(-50%) translateZ(0px);transform:translateX(0px) translateY(-50%) translateZ(0px)}.clients-list li{font-size:10px}.single-intro article{bottom:5%}.single-intro article h1{margin-bottom:40px;font-size:81px;line-height:71px}.single-intro article h2{font-size:11px;line-height:19px}.single-holder .text-holder{max-width:860px;padding:235px 0}.single-holder .text-holder>*{-webkit-transform:translateY(150px);-moz-transform:translateY(150px);transform:translateY(150px)}.single-holder .text-holder h1,.single-holder .text-holder h2,.single-holder .text-holder h3{width:200px;margin-bottom:90px;font-size:31px;line-height:43px}.single-holder .text-holder .project-tags{width:200px}.single-holder .text-holder h4,.single-holder .text-holder h5,.single-holder .text-holder h6,.single-holder .text-holder p{width:450px;margin-bottom:135px;font-size:26px;line-height:45px}.single-holder .text-holder p{font-size:14px}.single-holder .text-holder blockquote p{width:68%;font-size:17px;line-height:28px}.single-holder .text-holder blockquote cite{font-size:18px}.single-holder .text-holder .video-wrapper{margin-bottom:100px}.desktop .single-holder .text-holder>*{-webkit-transform:translateY(200px) translateZ(0px);-moz-transform:translateY(200px) translateZ(0px);transform:translateY(200px) translateZ(0px)}.single-holder .text-holder>*.inview{-webkit-transform:translateY(0px) translateZ(0px);-moz-transform:translateY(0px) translateZ(0px);transform:translateY(0px) translateZ(0px)}.single-holder .text-holder:last-of-type{/* padding-top: 0!important; */padding: 15px;padding-bottom: 0px !important;}.top-btn{left:170px}.top-btn.inview{-webkit-transform:translateY(-40px) rotate(-90deg);-moz-transform:translateY(-40px) rotate(-90deg);transform:translateY(-40px) rotate(-90deg)}.share-project-list{margin:0 -50% 0 0;padding-right:300px}.share-project-list.inview{-webkit-transform:translateY(-175px);-moz-transform:translateY(-175px);transform:translateY(-175px)}.more-projects h4{font-size:28px}.more-projects ul li{height:230px}.contact-holder .text-holder{max-width:866px}.contact-holder .text-holder h1{margin-bottom:20px;font-size:136px;line-height:136px}.contact-holder .text-holder .right{width:40%}.contact-holder .text-holder ul{margin:0}.contact-holder .text-holder h3{font-size:17px;line-height:42px}.contact-holder .text-holder h3 em a{font-size:28px;line-height:38px}.contact-holder .text-holder h3 em a:after{width:14px;height:22px}.work-holder{padding-top:200px}.filters{/* top:150px */}.filters li{margin:0 25px}.filters li:last-child{margin-right:0}.work-grid .item h3{left:50px;bottom:40px;width:190px;font-size:38px;line-height:34px}}@media screen and (max-width:1280px){header .holder{padding:60px 80px 30px}header .logo{width:70px;height:12px}header .nav-trigger{font-size:12px;line-height:12px}.contact .sections-holder section article,.home .sections-holder section article,.single-intro article{padding:0 80px}.sections-holder .case-study article h6{font-size:22px}.sections-holder section article h3{margin-bottom:40px;font-size:96px;line-height:90px}.sections-holder section article h3 a{font-size:96px}.sections-holder section article p,.sections-holder section article h4{width:34%;font-size:18px;line-height:30px}.sections-holder section article a{font-size:19px}.sections-nav{right:80px}footer>p{margin-bottom:60px;font-size:20px}footer .bottom{padding:30px 80px;background-size:64px 11px;background-position:80px center}footer .bottom>a{left:80px;width:64px;height:11px}footer .bottom p{font-size:6px;line-height:11px}footer ul li{line-height:11px}footer ul li a{font-size:7px}.home .sections-holder section.intro .media-holder:after{font-size:240px}.sections-holder section.intro article h3{margin-bottom:4px;font-size:12px}.sections-holder section.intro article p span{font-size:54px}.sections-holder section.home-about article h1{max-width:720px;line-height:44px;font-size:26px}.sections-holder section.active.home-about article{-webkit-transform:translateX(-50%) translateY(45%) translateZ(0px);-moz-transform:translateX(-50%) translateY(45%) translateZ(0px);transform:translateX(-50%) translateY(45%) translateZ(0px)}.about .media-holder:after,.from-services .media-holder:after{font-size:240px}.we-are .media-holder:after{font-size:260px}.about .we-design .media-holder:after{font-size:218px}.sections-holder section.with-text article{max-width:620px}.sections-holder section.with-text h5,.sections-holder section.quote h5{font-size:12px}.sections-holder section.with-text .text-holder,.sections-holder section.we-believe.with-text .text-holder{padding:0 80px 0 80px;font-size:26px;line-height:40px}.sections-holder .quote .media-holder:after,.sections-holder .we-believe .media-holder:after,.sections-holder .our-impact .media-holder:after{font-size:218px}.sections-holder .quote blockquote{width:510px}.sections-holder .quote blockquote p{font-size:42px;line-height:50px}.sections-holder .quote blockquote cite{font-size:14px}.sections-holder .with-list{padding:0}.about .we-do .media-holder:after{font-size:260px}.about .process-intro .media-holder:after,.about .process .media-holder:after{font-size:192px}.about .sections-holder section.with-list article{max-width:700px;padding-top:0}.about .sections-holder section h5{font-size:12px}.sections-holder .with-list ol li{width:30%;margin-right:5%}.sections-holder .with-list ol li h4{margin-bottom:15px;font-size:20px}.sections-holder .with-list ol li p,.sections-holder .with-list ol li h1,.sections-holder .with-list ol li h2{font-size:12px;line-height:20px}.sections-holder .with-list ol li:before{margin-bottom:4px;padding-bottom:0;font-size:12px}.sections-holder .with-list ol li:nth-child(4),.sections-holder .with-list ol li:nth-child(5),.sections-holder .with-list ol li:last-child{margin-bottom:0}.clients-intro .media-holder:after{font-size:218px}.clients .media-holder:after{font-size:218px;-webkit-transform:translateX(-50%) translateY(-54%) translateZ(0px);-moz-transform:translateX(-50%) translateY(-54%) translateZ(0px);transform:translateX(-50%) translateY(-54%) translateZ(0px)}.sections-holder section.clients article{max-width:700px;-webkit-transform:translateX(-50%) translateY(-40%);-moz-transform:translateX(-50%) translateY(-40%);transform:translateX(-50%) translateY(-40%)}.logos-list li{width:12%;margin-right:5%;margin-bottom:40px}.single-intro article h1{margin-bottom:40px;font-size:81px;line-height:71px}.single-intro article h2{font-size:14px;line-height:20px}.single-holder .text-holder{max-width:590px;padding:100px 0}.single-holder .text-holder>*{-webkit-transform:translateY(150px);-moz-transform:translateY(150px);transform:translateY(150px)}.single-holder .text-holder h1,.single-holder .text-holder h2,.single-holder .text-holder h3{width:150px;margin-bottom:60px;font-size:22px;line-height:34px}.single-holder .text-holder .project-tags{width:150px}.single-holder .text-holder h4,.single-holder .text-holder h5,.single-holder .text-holder h6,.single-holder .text-holder p{width:340px;margin-bottom:100px;font-size:16px;line-height:45px}.single-holder .text-holder p{font-size:16px}.single-holder .text-holder blockquote p{width:68%;font-size:20px;line-height:30px}.single-holder .text-holder blockquote h5{font-size:28px}.single-holder .text-holder blockquote h4{font-size:20px}.single-holder .text-holder blockquote h6{margin-bottom:50px}.single-holder .text-holder blockquote img{margin-bottom:50px}.single-holder .text-holder p .img-holder{padding-bottom:100px}.single-holder .text-holder:last-of-type{padding-bottom:100px}.single-holder .text-holder+.text-holder{margin-top:0}.top-btn{left:80px;margin-bottom:0}.share-project-list{position:relative;right:auto;bottom:auto;margin:0 0 90px;padding-right:0;text-align:center;-webkit-transform:translateY(-0px);-moz-transform:translateY(-0px);transform:translateY(-0px)}.share-project-list li{font-size:12px;line-height:30px}.share-project-list:before{display:none}.more-projects h4{font-size:20px}.more-projects ul li{height:170px}.contact-holder .text-holder{max-width:780px}.contact-holder .bgr-holder h3{font-size:218px}.contact-holder .text-holder .left{width:52%}.contact-holder .text-holder h1{margin-bottom:20px;font-size:110px;line-height:110px}.contact-holder .text-holder h2{line-height:20px}.contact-holder .text-holder .right{width:36%}.contact-holder .text-holder ul{margin:0}.contact-holder .text-holder h3{font-size:14px;line-height:42px}.contact-holder .text-holder h3 em a{font-size:22px;line-height:31px}.contact-holder .text-holder h3 em a:after{width:10px;height:15px}.work-holder{padding-top:160px}.filters{right:80px;/* top:120px */}.filters li{margin:0 15px}.filters li a{font-size:12px}.filters li:last-child{margin-right:0}.work-grid .item h3{left:40px;bottom:30px;width:140px;font-size:28px;line-height:24px}}@media screen and (max-width:980px){.sections-holder section article h3,.single-intro article h1{width:50%}.sections-holder section article p,.sections-holder section article h4,.single-intro article h2{width:55%}.home .sections-holder section.intro .media-holder:after{font-size:160px;letter-spacing:-10px}.sections-holder section.home-about article{padding:0 130px}.about .media-holder:after,.from-services .media-holder:after{font-size:190px}.about .sections-holder section.with-list article{max-width:450px}.sections-holder .with-list ol li{float:none;width:100%;margin:0 0 40px}.sections-holder .with-list ol li:last-child{margin-bottom:0}.sections-holder .with-list ol li p,.sections-holder .with-list ol li h1,.sections-holder .with-list ol li h2{font-size:14px;line-height:22px}.sections-holder section.clients article{max-width:680px;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%)}.logos-list{text-align:center}.logos-list li{float:none;display:inline-block;width:16%;margin:0 2% 20px}.logos-list li:nth-child(6n){margin-right:2%}.contact-holder .text-holder{position:relative;left:auto;top:auto;margin:0;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.contact-holder .text-holder .left,.contact-holder .text-holder .right{width:100%;padding:0 80px;float:none;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.contact-holder .text-holder .left{padding-top:150px;padding-bottom:50px}.contact-holder .text-holder h3{position:relative;top:auto}.contact-holder .text-holder ul{margin-bottom:50px}.error404 section:before{font-size:280px}.error404 section p{font-size:22px;line-height:32px}.error404 section p a{font-size:12px}.filters-wrapper{margin-bottom:40px}.filters{position:relative;right:auto;top:auto;text-align:center;right: 0 !important;}.filters li{float:none;display:inline-block;margin:0 12px;}.filters li a{font-size:13px}.filters li:first-child{/* margin-left:0; */}.work-grid .item{width: 100%;}.work-grid .item h3{left:50px;bottom:40px;width:160px;font-size:32px;line-height:28px}}@media screen and (max-width:640px){.page-template-page-about header,.page-template-page-contact header,.page-template-page-work header{-webkit-transition-duration:.3s;-moz-transition-duration:.3s;transition-duration:.3s}.sticky-header{-webkit-transition-delay:0s;-moz-transition-delay:0s;transition-delay:0s}.sticky-header .holder{padding:35px 40px 20px}header .holder{padding:35px 40px 0}header .logo{width:75px;height: 45px;}header .nav-trigger{padding:10px 10px;font-size:12px;line-height:14px;text-decoration:underline;-webkit-transform:translateX(10px) translateY(-10px);-moz-transform:translateX(10px) translateY(-10px);transform:translateX(10px) translateY(-10px)}header nav{width:100% !important;min-width:0 !important;padding:110px 0 0 40px !important}.mobile-logo{display:block}header nav .main{margin-bottom:45px}header nav .main li{font-size:37px;line-height:50px}header nav .social li{font-size:11px !important;line-height:30px}header nav .social li a{font-size:9px !important}header nav p{left:40px;bottom:50px;font-size:12px}header nav span{margin-bottom:15px;font-size:14px}header nav span a{color:#fff;text-decoration:none}header nav p em{margin-bottom:15px;font-size:18px;line-height:26px}.contact .sections-holder section article,.home .sections-holder section article,.single-intro article{padding:0 40px 0 40px}.sections-holder .case-study article h6{font-size:18px}.sections-holder section article h3,.single-intro article h1{width:80%;margin-bottom:20px;font-size:51px;line-height:52px;color: #86bc24;}.sections-holder section article h3 a{font-size:51px}.sections-holder section article p,.sections-holder section article h4,.single-intro article h2{width:80%;margin-bottom:30px;font-size:14px;line-height:22px}.sections-holder section article a{font-size:14px}.sections-nav{right:40px}.sections-nav li{margin-bottom:12px}.sections-nav li a{width:2px;height:2px}.sections-holder section.testimonials article{padding:70px 0 100px}.sections-holder section article .testimonials-slider blockquote p{font-size:18px;line-height:26px}.sections-holder section article .testimonials-slider cite{font-size:13px;line-height:21px}footer{-webkit-transform:translateZ(0px);-moz-transform:translateZ(0px);transform:translateZ(0px)}footer p{padding:0 20px 0 20px;margin-bottom:35px;text-align:center;font-size:17px;line-height:25px}.home footer>p{padding:0 100px}footer .bottom{padding:30px 25px;background:#000}footer .bottom>a{display:none}footer ul{float:none;padding-bottom:25px;text-align:center}footer ul li{float:none;display:inline-block;margin:0 6px;line-height:normal}footer ul li a{font-size:11px}footer ul li:last-child{margin-right:0}.about footer .bottom,.single footer .bottom{position:relative;left:auto;bottom:auto}footer .bottom p{bottom:10px;top:auto;padding:0;margin:0;line-height:normal}.single-projects footer,.page-template-page-work footer{padding-top:35px}.sections-holder section.intro article h3{text-indent:0;margin-bottom:12px}.home .sections-holder section.intro article h3{text-align:center;font-size:16px;letter-spacing:-1px}.home .sections-holder section.intro article p{padding-left:0;text-align:center}.sections-holder section.intro article p span{font-size:32px;line-height:42px}.home .sections-holder .intro .mouse{bottom:50px}.sections-holder section.happy-moves .parallax:after{content:"";display:block;position:absolute;left:0;top:0;z-index:9999;width:100%;height:100%;background:-moz-linear-gradient(top,rgba(0,0,0,0.0) 0,rgba(0,0,0,0.65) 100%);background:-webkit-linear-gradient(top,rgba(0,0,0,0.0) 0,rgba(0,0,0,0.65) 100%);background:linear-gradient(to bottom,rgba(0,0,0,0.0) 0,rgba(0,0,0,0.65) 100%);-webkit-backface-visibility:hidden;backface-visibility:hidden}.from-services .media-holder:after{display:none}.home .sections-holder section.from-services article{padding:0 80px 0 40px}.clients footer>p{margin-bottom:20px}.sections-holder section.home-about article{padding:0 75px 0 75px}.sections-holder section.home-about article h1{font-size:13px;line-height:28px}.sections-holder section.active.home-about article{-webkit-transform:translateX(-50%) translateY(30%) translateZ(0px);-moz-transform:translateX(-50%) translateY(30%) translateZ(0px);transform:translateX(-50%) translateY(30%) translateZ(0px)}.page-template-page-about{height:auto !important}.sections-holder section.with-text h5,.sections-holder section.quote h5{margin-bottom:25px}.sections-holder section.with-text .text-holder,.sections-holder section.we-believe.with-text .text-holder{padding:0;font-size:20px;line-height:35px;letter-spacing:-1px}.sections-holder section.with-text article .text ul{position:absolute;left:50% !important;top:50% !important;width:200px;height:248px;-webkit-transform:translateX(-50%) translateY(-50%) translateZ(0) !important;-moz-transform:translateX(-50%) translateY(-50%) translateZ(0) !important;transform:translateX(-50%) translateY(-50%) translateZ(0) !important}.about .we-design{padding:70px 0;background:#000;color:#fff}.we-believe{padding:70px 0}.sections-holder section.quote{padding:0 0 180px}.sections-holder section.quote blockquote{width:100%;padding:0 40px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.sections-holder section.quote blockquote p{margin-bottom:30px;font-size:29px;line-height:40px;letter-spacing:0;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.sections-holder section.quote blockquote cite{font-size:15px;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.about .sections-holder section.with-list{padding:70px 0}.about .sections-holder section.with-list .media-holder{display:none}.about .sections-holder section.with-list article{position:relative !important;left:auto !important;top:auto !important;padding:0 65px 0 40px;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.about .sections-holder section h5{margin-bottom:35px;font-size:12px !important;letter-spacing:0;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.sections-holder section.with-list ol{width:100% !important;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important;box-sizing:border-box}.sections-holder section.with-list ol li{float:none;width:100%;margin-bottom:70px;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.sections-holder .with-list ol li h4{margin-bottom:25px;font-size: 20px;color: #86bc24;}.sections-holder .with-list ol li p,.sections-holder .with-list ol li h1,.sections-holder .with-list ol li h2{line-height:23px;font-size: 16px;}.sections-holder .with-list ol li:before{margin-bottom:10px;font-size:15px}.sections-holder .with-list ol li:nth-child(4),.sections-holder .with-list ol li:nth-child(5){margin-bottom:40px}.sections-holder section.with-list ol li:last-child{margin-bottom:0}.about .sections-holder section.with-list:first-child{padding-top:150px}.about .sections-holder section.we-create{background:#000;color:#fff}.sections-holder section.testimonials .testimonials-slider{-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.clients{padding:0}.logos-list li{display:block;float:left;width:33%;margin:0 0 20px}.logos-list li img{width:70%}.logos-list li:nth-child(6n){margin:0 0 20px}.clients-list{-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.clients-list li{width:31%}.clients footer>p{margin-bottom:40px;padding:0 15px;font-size:15px}.ios .single-intro .vimeovideo-video-embed{display:none}.single-holder .text-holder{padding: 60px 15px 60px 15px;}.single-holder .text-holder:nth-child(2){padding-top:50px}.single-holder .text-holder:last-of-type{padding-bottom:100px}.single-holder .text-holder h4,.single-holder .text-holder h5,.single-holder .text-holder h6{width:100%;font-size:13px;line-height:22px}.single-holder .text-holder h1,.single-holder .text-holder h2,.single-holder .text-holder h3{width:50%;padding-top:25px;margin-bottom:60px;font-size:22px;line-height:30px}.single-holder .text-holder h1:before,.single-holder .text-holder h2:before,.single-holder .text-holder h3:before{height:3px;width:20px}.single-holder .text-holder .project-tags{width: 100%;margin: 30px -0 30px 0;}.single-holder .text-holder .project-tags li{font-size:8px;line-height:16px}.single-holder .text-holder .project-tags:last-child{margin-bottom:0}.single-holder .text-holder p{width:100%;margin-bottom: 20px;font-size:13px;line-height:22px;}.single-holder .text-holder p .img-holder{padding-bottom:25px}.single-holder .text-holder blockquote p{width:100%;margin-bottom:25px;font-size:13px;line-height:24px}.single-holder .text-holder blockquote cite{font-size:12px}.single-holder .text-holder blockquote h5{margin-bottom:0;font-size:13px}.single-holder .text-holder blockquote h4{font-size:20px}.single-holder .text-holder blockquote h6{margin-bottom:30px;font-size:13px}.single-holder .text-holder blockquote img{width:80%;margin-bottom:30px}.single-holder .text-holder .video-wrapper{margin-bottom:20px}.single-holder .text-holder+.text-holder{margin-top:0}.single-holder .text-holder:last-of-type{padding-bottom:60px}.images-list li .video-wrapper{width:100% !important;margin-left:0 !important}.top-btn{left:15px;margin-bottom:20px;font-size: 18px;bottom: 88%;}.share-project-list{position:relative;right:auto;bottom:auto;margin:0;padding:0 0 100px;text-align:center;-webkit-transform:none;-moz-transform:none;transform:none}.share-project-list:before{display:none}.share-project-list li{line-height:30px;font-size:9px}.more-projects h4{padding-bottom:40px;margin-bottom:60px;font-size: 24px;}.more-projects ul li{height:70px}.contact{height:auto !important;overflow-y:auto !important}.contact-holder{height:auto;padding-top:100px;padding-bottom:30px}.contact-holder .bgr-holder h3{display:none}.contact-holder .text-holder .left,.contact-holder .text-holder .right{padding:0 40px}.contact-holder .text-holder h1{margin-bottom:34px;font-size:68px;line-height:68px;letter-spacing:0}.contact-holder .text-holder h2{margin-bottom:45px;font-size:13px;line-height:26px}.contact-holder .text-holder ul{margin-bottom:55px}.contact-holder .text-holder ul li{margin-bottom:20px;+}.contact-holder .text-holder ul li a{text-decoration:underline}.contact-holder .text-holder h3{font-size:20px;line-height:21px}.contact-holder .text-holder h3 em{margin:0 -20px 15px 0;font-size:20px;line-height:25px}.contact-holder .text-holder h3 em a{font-size:17px;line-height:21px}.contact-holder .text-holder h3 em a:after{width:11px;height:17px;margin-left:4px}.contact-holder .text-holder span a{color:#000}.error404 section:before{font-size:180px;letter-spacing:-10px}.work-holder{padding-top: 115px;}.filters-wrapper{position:relative;overflow-x: scroll;/* height:61px; */margin-bottom:0;}.filters-holder{overflow-x:scroll;/* height:80px; */-webkit-overflow-scrolling:touch;}.filters-holder::-webkit-scrollbar{width:0 !important}.filters-holder::-webkit-scrollbar-thumb{background:transparent !important}.filters-holder::-webkit-scrollbar-track-piece{background:transparent !important}.filters-wrapper:before,.filters-wrapper:after{content:"";position:absolute;top:0;z-index:2;height:100%;width:40px}.filters-wrapper:before{left:0;background:-webkit-gradient(linear,left top,right top,from(#fff),to(rgba(255,255,255,0)));background:-webkit-linear-gradient(left,#fff,rgba(255,255,255,0));background:-moz-linear-gradient(left,#fff,rgba(255,255,255,0));background:-ms-linear-gradient(left,#fff,rgba(255,255,255,0));background:-o-linear-gradient(left,#fff,rgba(255,255,255,0))}.filters-wrapper:after{right:0;background:-webkit-gradient(linear,left top,right top,rgba(255,255,255,0),to(#fff));background:-webkit-linear-gradient(left,rgba(255,255,255,0),#fff);background:-moz-linear-gradient(left,rgba(255,255,255,0),#fff);background:-ms-linear-gradient(left,rgba(255,255,255,0),#fff);background:-o-linear-gradient(left,rgba(255,255,255,0),#fff)}.filters{text-align:left;display: none;}.filters li{margin:0 20px;padding:20px 0}.filters li:first-child{margin-left:40px !important}.filters li:last-child{margin-right:40px !important}.work-grid .item h3{left:30px;bottom:20px;width:90px;font-size:18px;line-height:16px}}@media screen and (max-width:340px){.sticky-header .holder{padding:30px 25px 10px}header .holder{padding:30px 25px 0}header .logo{width:70px;height:12px}header .nav-trigger{font-size:12px;line-height:12px}header nav{padding:100px 0 0 25px !important}.mobile-logo{left:25px;top:30px;width:70px;height:12px}header nav .main{margin-bottom:25px}header nav .main li{font-size:32px;line-height:44px}header nav .social li{line-height:20px}header nav p{left:25px;bottom:25px;font-size:12px}header nav span{font-size:14px}header nav p em{font-size:15px;line-height:22px}header nav p em a:after{width:9px;height:14px;margin-left:4px}.contact .sections-holder section article,.home .sections-holder section article,.single-intro article{padding:0 25px 0 25px}.sections-holder .case-study article h6{font-size:14px;letter-spacing:-1px}.sections-holder section article h3,.single-intro article h1{font-size:44px;line-height:42px}.sections-holder section article h3 a{font-size:44px}.discover-btn{left:40px;bottom:40px}.sections-nav{right:25px}.home footer>p{padding:0 25px}footer>p{padding:0 25px;font-size:15px}footer .bottom{padding:20px 25px}footer ul li a{font-size:9px}.home .sections-holder section.intro article h3{font-size:14px}.home .sections-holder section.intro article p span{font-size:26px;line-height:36px}.home .sections-holder .intro .mouse{bottom:25px}.sections-holder section.home-about article{padding-right:42px;padding-left:42px}.sections-holder section.home-about article h1{font-size:12px;line-height:24px}.page-template-page-about{height:auto !important}.sections-holder section.with-text article,.home .sections-holder section.from-services article{padding:0 60px 0 30px}.sections-holder section.with-text h5,.sections-holder section.quote h5{margin-bottom:25px}.sections-holder section.with-text h5,.sections-holder section.went-down.with-text h5{-webkit-transform:translateX(0) translateY(80px) translateZ(0px);-moz-transform:translateX(0) translateY(80px) translateZ(0px);transform:translateX(0) translateY(80px) translateZ(0px)}.sections-holder section.with-text .text-holder{padding:0;font-size:16px;line-height:26px;letter-spacing:-1px}.sections-holder section.with-text article .text ul{position:absolute;left:50% !important;top:50% !important;width:200px;height:248px;-webkit-transform:translateX(-50%) translateY(-50%) translateZ(0) !important;-moz-transform:translateX(-50%) translateY(-50%) translateZ(0) !important;transform:translateX(-50%) translateY(-50%) translateZ(0) !important}.we-are{padding-top:125px;padding-bottom:70px}.about .we-design{padding:70px 0;background:#000;color:#fff}.sections-holder section.quote blockquote{padding:0 30px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.sections-holder section.quote blockquote p{margin-bottom:30px;font-size:29px;line-height:40px;letter-spacing:0;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.sections-holder section.quote blockquote cite{font-size:15px;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.about .sections-holder section.with-list{padding:70px 0}.about .sections-holder section.with-list article{position:relative !important;left:auto !important;top:auto !important;padding:0 45px 0 30px;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.sections-holder section.with-list ol{width:100% !important;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important;box-sizing:border-box}.sections-holder section.with-list ol li{float:none;width:100%;margin-bottom:70px;-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.sections-holder .with-list ol li h4{margin-bottom:25px;font-size:24px}.sections-holder .with-list ol li p,.sections-holder .with-list ol li h1,.sections-holder .with-list ol li h2{line-height:23px;font-size:12px}.sections-holder .with-list ol li:before{margin-bottom:10px;font-size:15px}.sections-holder .with-list ol li:nth-child(4),.sections-holder .with-list ol li:nth-child(5){margin-bottom:40px}.sections-holder section.with-list ol li:last-child{margin-bottom:0}.sections-holder section.testimonials article{padding-left:35px;padding-right:35px}.logos-list{padding-top:20px}.logos-list li{width:33%;margin-right:0;margin-bottom:20px}.logos-list li img{width:70%}.clients-list{-webkit-transform:none !important;-moz-transform:none !important;transform:none !important}.clients-list li{width:31%}.clients footer>p{margin-bottom:20px;padding:0 15px;font-size:15px}.single-holder .text-holder{padding:50px 25px}.single-holder .text-holder:nth-child(2){padding-top:50px}.single-holder .text-holder:last-of-type{padding-bottom:100px}.single-holder .text-holder h4,.single-holder .text-holder h5,.single-holder .text-holder h6{width:100%;font-size:12px;line-height:24px}.single-holder .text-holder h1,.single-holder .text-holder h2,.single-holder .text-holder h3{width:50%;padding-top:25px;margin-bottom:50px;font-size:19px;line-height:25px}.single-holder .text-holder h1:before,.single-holder .text-holder h2:before,.single-holder .text-holder h3:before{height:3px;width:20px}.single-holder .text-holder p{width:100%;margin-bottom:80px;font-size:12px;line-height:24px}.single-holder .text-holder p .img-holder{padding-bottom:20px}.single-holder .text-holder blockquote p{width:100%;margin-bottom:25px;font-size:12px;line-height:24px}.single-holder .text-holder blockquote cite{font-size:12px}.single-holder .text-holder .video-wrapper{margin-bottom:20px}.single-holder .text-holder+.text-holder{margin-top:0}.contact-holder .text-holder .left,.contact-holder .text-holder .right{padding:0 25px}.contact-holder .text-holder h1{margin-bottom:24px;font-size:58px;line-height:58px}.contact-holder .text-holder h2{margin-bottom:34px;font-size:12px;line-height:22px}.contact-holder .text-holder ul{margin-bottom:45px}.contact-holder .text-holder ul li{margin-bottom:16px}.contact-holder .text-holder h3{font-size:17px}.contact-holder .text-holder h3 em{font-size:17px}.contact-holder .text-holder h3 em a:after{width:9px;height:14px}.work-holder{padding-top:80px}.filters-wrapper{margin-bottom:0}.filters-wrapper:before,.filters-wrapper:after{width:25px}.filters li{margin:0 12px}.filters li a{font-size:14px}.filters li:first-child{margin-left:25px !important}.filters li:last-child{margin-right:25px !important}.work-grid .item{width:100%}.work-grid .item h3{left:25px;width:125px;font-size:26px;line-height:24px}}@media print{*{background:transparent !important;color:#444 !important;text-shadow:none !important}a,a:visited{color:#444 !important;text-decoration:underline}a:after{content:"("attr(href)")"}abbr:after{content:"("attr(title)")"}.ir a:after{content:""}pre,blockquote{border:1px solid #999;page-break-inside:avoid}thead{display:table-header-group}tr,img{page-break-inside:avoid}@page{margin:.5cm}p,h2,h3{orphans:3;widows:3}h2,h3{page-break-after:avoid}} .slick-slider {position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent } .slick-list {position: relative; display: block; overflow: hidden; margin: 0; padding: 0 } .slick-list:focus {outline: 0 } .slick-list.dragging {cursor: pointer; cursor: hand } .slick-slider .slick-track, .slick-slider .slick-list {-webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } .slick-track {position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto } .slick-track:before, .slick-track:after {display: table; content: ''} .slick-track:after {clear: both } .slick-loading .slick-track {visibility: hidden } .slick-slide {display: none; float: left; height: 100%; min-height: 1px } [dir='rtl'] .slick-slide {float: right } .slick-slide img {display: block } .slick-slide.slick-loading img {display: none } .slick-slide.dragging img {pointer-events: none } .slick-initialized .slick-slide {display: block } .slick-loading .slick-slide {visibility: hidden } .slick-vertical .slick-slide {display: block; height: auto; border: 1px solid transparent } .slick-arrow.slick-hidden {display: none } .recentcomments a {display: inline !important; padding: 0 !important; margin: 0 !important } .youtube-li{position: relative;max-height: 500px !important;} .youtube-video{position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .project-tags li a{text-decoration: none; color: #000; font-size: 18px; } .filters , .filter {/* position: absolute; */ right: 100px; /* top: 190px; */ margin: 0; list-style: none; } .filters li ,  .filter li {float: left; margin: 0 40px; margin-bottom: 12px; } .filters li a ,  .filter li a{position: relative; display: block; padding-bottom: 4px; font-family: 'maison-medium'; font-size: 15px; color: #000; text-decoration: none } .filters li a:after ,.filter li a:after {content: ""; display: block; position: absolute; left: 50%; bottom: 0; width: 0; height: 2px; background: #000; -webkit-transition: all 250ms ease-in-out; -moz-transition: all 250ms ease-in-out; transition: all 250ms ease-in-out } .filters li a.is-checked:after, .desktop .filters li a:hover:after ,.filter li a.is-checked:after, .desktop .filter li a:hover:after {left: 0; width: 100% } .filters li:last-child , .filter li:last-child {margin-right: 0 } .video-holde2{position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .second-section{/* min-height: 600px; */ text-align: center; background-size: cover; background-repeat: no-repeat; padding: 20vw; position: relative; } .second-section h1{position: absolute; top: 50%; left: 10%; font-size: 3vw; transition-duration: .3s; } .second-section h1:hover{padding-left: 50px; } .banner-icon{max-width: 20vw; margin: 0 auto; } .sub-h4{padding-bottom: 30px !important; margin-bottom: 0 !important; } .sub-h4 span{position: relative; padding-bottom:5px; cursor:pointer; } .sub-h4 span:before{content:' '; position:absolute; bottom: 0%; width: 0%; left:50%; height:2px; transition-duration:.3s; border-bottom:2px solid; } .sub-h4:hover span:before{left:0; width:100%; } .sub-h4:hover .sub-h4 span:before{width:100%; } .sub-ul{background: #fff; margin-bottom: 30px !important; } .sub-ul li{position:relative; cursor: pointer; } .sub-ul li:before{/* content:' '; */ position:absolute; height: 90%; width: 90%; left: 5%; z-index: 10; bottom: 5%; border: 4px solid #000; opacity: 0; transition-duration: .3s; } .sub-ul li:hover::before{opacity: 1; } .sub-ul li:hover a{transform: scale(1.15); } .menu-btn{color:#000 !important; } .active_btn{color:#000 !important; } .media-holder2 iframe{position: absolute; height: 100%; top: 0; right: 0; z-index: -4; } .choose-ul{padding: 0; margin: 0; } .choose-ul li{background-size: cover;background-position: center;cursor: pointer;} .choose-ul li a{background-color: rgba(0,0,0,0); } .choose-div{margin: 0 auto;margin-bottom: 30px;max-width: 1171px;} a{cursor: pointer; } @media(max-width: 1390px){.filters-holder{/* min-height: 60px; */ } } @media(max-width: 1300px){.filters-holder{/* min-height: 80px; */ } } .img-responsive{max-width: 100%; } .slider-gallery{position: fixed; top: 0; right: 0; width: 100%; z-index: 100000; height: 100%; background: rgba(0,0,0,.8); display: none; } .slider-gallery.active{display: block; } .pop-img{max-width: 1170px; max-height: calc( 95vh - 60px); margin-bottom: 15px; } .close-gallery {height: 50px; } .close-gallery .close{margin: 15px 30px; color: #fff !important; opacity: 1; } .choose-icon{text-align: center; max-width:860px; margin: 0 auto; margin-bottom: 19px; } .choose-icon img{max-width: 40px; margin-right: 20px; } .gallery-net{display: none; } .gallery-single{display: none; } .gallery-single.active ,.gallery-net.active{display: block; } @media(min-width: 1024px){.network{height: 20vw !important; } } @media screen and (max-width: 640px){.more-projects ul .network {height: 159px; width: 50%; } } .choose-icon.gallery{padding-top:30px; padding-bottom:15px; } .team-item{padding: 5px; color: #fff; background-color: #86bc25; } .team-item h5{text-align:center; font-size:20px !important; margin-bottom:0 !important; height:40px; } .team-item p{height:80px } .our-team .media-holder:after{content: "Our Team"; position: absolute; left: 50%; top: 50%; font-family: 'maison-bold'; font-size: 700px; color: #fff; white-space: nowrap; letter-spacing: -20px; text-shadow: 0 0 0 rgba(0, 0, 0, .075); -webkit-transform: translateX(-50%) translateY(-50%) translateZ(0); -moz-transform: translateX(-50%) translateY(-50%) translateZ(0); transform: translateX(-50%) translateY(-50%) translateZ(0); -webkit-transition: all 250ms; -moz-transition: all 250ms; transition: all 250ms; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .contact-holder .text-holder h3 span a{text-decoration: none; /* word-spacing: 6px; */ color: #000; font-size: 17px; } .our_team .item{position: relative; overflow:hidden; } .our_team .item .user_info{position: absolute; width: 100%; height: 50%; bottom: -50%; left: 0; /*   background: rgb(134, 188, 37,.8 */ ); overflow: hidden; text-align:center; color:#fff; transition-duration:.5s; } .our_team .item:hover .user_info,.our_team .item:hover .info_bg{bottom:0; } .our_team .item .user_info  h4{font-size:20px; width: 100%; margin-bottom:10px; } .our_team .item .user_info  p{width:100%; } .our_team .item .info-bg{position: absolute; width: 100%; height: 100%; bottom: -100%; left: 0; background: rgb(134, 188, 37,.8 ); overflow: hidden; color:#fff; transition-duration:.2s; } .our_team .item:hover .info-bg{bottom:0; } .user_info .title{border-bottom: 1px solid; } @media(max-width: 1400px){.our_team{margin-top: 10vw; } } .owl-cont2.our_team{margin-top: 0 !important; } @font-face {font-family: 'BebasNeue'; src: url('/fonts/BebasNeue Bold.otf'), } .sections-holder section article.light h3 a{font-family: 'BebasNeue'; } @media(max-width: 992px){.media-holder .img_mb{background-size:100% 100% !important; } .sections-holder section.happy-moves .parallax .six span{display: none !important; } .more-projects ul li, .choose-ul li{height: 200px;background-size:cover;width: 100%;} .more-projects ul li:last-child {width: 100%;} .sections-holder section article.light h3 a{display: none; } .home .sections-holder section.active article{display: none; } .main-article{display: block !important; } .home .sections-holder section.active article.clients-article {display: block; } .owl-dots{display: none !important; } } .client-img{max-width:80%; margin: 0 auto; margin-bottom:15px; } .our_links{margin-bottom: 15px; padding: 0 30px; } @media(max-width:992px){.work-grid .item a{width:calc(100% - 10px); height:calc(100% - 10px); left:5px; } } .magazine-row{margin-bottom: 30px; } .cv li {width: 100% !important; } .cv .left{width:50%; } .cv li img{max-height:250px; } .cv .right:before{content:' '; position:absolute; left: -15px; top: -15px; width:25%; height:25%; border-left:4px solid #86bc25; border-top:4px solid #86bc25; } .cv .right:after{content:' '; position:absolute; right: -15px; bottom: -15px; width:25%; height:25%; border-right:4px solid #86bc25; border-bottom:4px solid #86bc25; } .cv-title{font-size: 30px !important;} .cv-job{font-size: 18px !important;color: #86bc25;margin: 15px 0;margin-bottom: 15px !important;} .cv-p{line-height: 23px !important;font-size: 16px !important;} .cv_owl .image-holder{padding: 30px; position: relative; } .cv_owl .image-holder:before{content:' '; position:absolute; left: 10px; top: 10px; width:25%; height:25%; border-left:4px solid #86bc25; border-top:4px solid #86bc25; } .cv_owl .image-holder:after{content:' '; position:absolute; right: 10px; bottom: 10px; width:25%; height:25%; border-right:4px solid #86bc25; border-bottom:4px solid #86bc25; } .cv_owl h4{width: 100% !important; margin-bottom: 0px !important; padding-left: 30px; } .bretcrumb{padding: 0; margin: 0; } .bretcrumb li{display: inline; } .bretcrumb li a{color: #000; text-decoration: none; } .contact_icons{position: fixed;left: 17px;right: 85px;bottom: 40px;max-width: 249px;z-index: 2000000;} .contact_icons li{display: inline-block; } .contact_icons li a{display: block; background: #25d366; width: 60px; height: 60px; text-align: center; border-radius: 60px; transition: all 300ms; line-height: 60px; color: #fff; font-size: 27px; } .contact_icons li a.email_li{background: #ea4335; } .contact_icons li a.phone_li{background:#b2b2b2; } .contact_icons li a:hover{transform: rotate(360deg) scale(1.1); } .why h3 {font-size: 40px !important; width: 100% !important; line-height: 40px !important; margin-bottom: 30px !important; } .why p {font-size: 22px !important; width: 100% !important; line-height: 36px !important; } .contact-holder .text-holder .contact_map{width: 100%;} .contact-holder .text-holder .contact_info{width: 40%; } @media(max-width: 992px){.contact_icons li {display: inline-block;opacity: .6;} .contact_icons li a{width: 45px; height: 45px; font-size: 22px; line-height: 45px; margin-bottom: 5px; } .why h3 {font-size: 30px !important; width: 100% !important; line-height: 30px !important; margin-bottom: 22px !important; } .why p {font-size: 18px !important;width: 100% !important;font-weight: bolder !important;line-height: 27px !important;} .contact_map ,.contact_info{width: 100%; } } .contact-holder .text-holder h3 em a:hover{text-decoration:none; }
.contact-holder .text-holder h3 span .contact_footer_icon{
	font-size: 24px;
    margin-right: 10px;
}
.go-home {
    background: #86bc24;
    color: #fff;
    padding: 15px 30px;
    font-size: 22px;
    border-radius: 5px;
    text-decoration: none;
}
.text-center{
	text-align: center;
}
.error_div{
	width: 100%;
}
@media(max-width:992px){
	.contact-holder .text-holder .contact_map,.contact-holder .text-holder .contact_info{
		width:100% !important;
	}
	.bretcrumb li a{
		font-size: 22px;
	}
	.project-tags li a{
		font-size: 22px;
	}
	.single-holder .text-holder h3{
		width: 100% !important;
		font-size: 28px;
		color: #86bc25;
		font-weight: bold;
	}
	.single-holder .text-holder p{
		font-size: 19px !important;
		line-height: 30px !important;
	}
	.more-projects{
		margin-top: 80px;
	}
	.why_section{
		font-size: 16px;
	}
}
@media(max-width: 640px){
	.sections-holder .with-list ol li h1{

	}
	.single-holder .text-holder .project-tags li {
        
        margin: 20px 0;
    }
    .single-holder .text-holder .project-tags li {
        padding:0;
    }
    .nav-tabs .nav-item {
        margin-bottom: -1px;
        display: block;
        width: 100%;
    }
    .nav-tabs .nav-link{
        padding-left:0;
    }
    .single-holder .text-holder div{
        margin-left:0;
    }
}
.contact_icons li a:hover{
	opacity:1;
}
@font-face {
  font-family: 'Museo-Slab';
  src: url('arch/Museo_Slab_900italic.otf') format('opentype');
  font-weight: 900;
}
@media(max-width:992px){
    .single-holder .text-holder:nth-child(2)>h3:first-of-type{
           font-size: 20px;
    }
    .single-holder .text-holder:nth-child(2) {
        padding-top: 20px;
        padding-bottom: 0 !important;
    }
    .md_mall{
        margin: 0;
        padding: 0;
        width: 50% !important;
    }
   .qoute_item {
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        padding-left: 70px !important;
    }
    
}
header .logo:before, header .logo:after{
        background-size: contain;
}