@charset "UTF-8"; html { font-family: sans-serif; line-height: 1.15; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 0; } article, aside, footer, header, nav, section { display: block; } h1 { margin: .67em 0; font-size: 2em; } figcaption, figure, main { display: block; } figure { margin: 1em 40px; } hr { overflow: visible; -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; } pre { font-size: 1em; font-family: monospace, monospace; } a { background-color: transparent; -webkit-text-decoration-skip: objects; } a:active, a:hover { outline-width: 0; } abbr[title] { border-bottom: none; text-decoration: underline; -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } b, strong { font-weight: inherit; } b, strong { font-weight: bolder; } code, kbd, samp { font-size: 1em; font-family: monospace, monospace; } dfn { font-style: italic; } mark { background-color: #ff0; color: #000; } small { font-size: 80%; } sub, sup { position: relative; vertical-align: baseline; font-size: 75%; line-height: 0; } sub { bottom: -.25em; } sup { top: -.5em; } audio, video { display: inline-block; } audio:not([controls]) { display: none; height: 0; } img { border-style: none; } svg:not(:root) { overflow: hidden; } button, input, optgroup, select, textarea { margin: 0; font-size: 100%; font-family: sans-serif; line-height: 1.15; } button, input { overflow: visible; } button, select { text-transform: none; } [type=reset], [type=submit], button, html [type=button] { -webkit-appearance: button; } button { border-radius: 0; } [type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner { padding: 0; border-style: none; } [type=button]:-moz-focusring, [type=reset]:-moz-focusring, [type=submit]:-moz-focusring, button:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { margin: 0 2px; padding: .35em .625em .75em; border: 1px solid silver; } legend { display: table; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; max-width: 100%; color: inherit; white-space: normal; } progress { display: inline-block; vertical-align: baseline; } textarea { overflow: auto; } [type=checkbox], [type=radio] { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 0; } [type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; } [type=search] { outline-offset: -2px; -webkit-appearance: textfield; } [type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; } details, menu { display: block; } summary { display: list-item; } canvas { display: inline-block; } template { display: none; } [hidden] { display: none; } html { -webkit-box-sizing: border-box; box-sizing: border-box; } [hidden], template { display: none; } *, :after, :before { -webkit-box-sizing: inherit; box-sizing: inherit; } address { font-style: inherit; } cite, dfn, em, i { font-style: italic; } b, strong { font-weight: 700; } a { text-decoration: none; } a svg { pointer-events: none; } [tabindex], a, area, button, input, label, select, textarea { -ms-touch-action: manipulation; touch-action: manipulation; } [hreflang]>abbr[title] { text-decoration: none; } table { border-spacing: 0; border-collapse: collapse; } hr { display: block; margin: 1em 0; padding: 0; height: 1px; border: 0; border-top: 1px solid #ccc; } audio, canvas, iframe, img, svg, video { vertical-align: middle; } audio:not([controls]) { display: none; height: 0; } img, svg { height: auto; } img[height], img[width], svg[height], svg[width] { max-width: none; } img { font-style: italic; } svg { fill: currentColor; } input, select, textarea { display: block; margin: 0; padding: 0; width: 100%; outline: 0; border: 0; border-radius: 0; background: none transparent; color: inherit; font: inherit; line-height: normal; -webkit-appearance: none; -moz-appearance: none; appearance: none; } select { text-transform: none; } select::-ms-expand { display: none; } select::-ms-value { background: 0 0; color: inherit; } textarea { overflow: auto; resize: vertical; } .o-button, button { display: inline-block; overflow: visible; margin: 0; padding: 0; outline: 0; border: 0; background: none transparent; color: inherit; vertical-align: middle; text-align: center; text-decoration: none; text-transform: none; font: inherit; line-height: normal; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .o-button:focus, .o-button:hover, button:focus, button:hover { text-decoration: none; } @font-face { font-family: 'hyg2gjm'; src: url(../fonts/hyg2gjm.TTF); font-weight: 400; font-style: normal; } @font-face { font-family: 'futural'; src: url(../fonts/futural.ttf); font-weight: 500; font-style: normal; } @font-face { font-family: 'futurab'; src: url(../fonts/futurab.ttf); font-weight: 700; font-style: normal; } html { overflow-y: scroll; min-height: 100%; color: #222; font-size: 1em; line-height: 1.5; font-family: "futural", sans-serif; } @media (max-width:1599px) { html { font-size: 16px; } } @media (min-width:1600px) { html { font-size: 18px; } } html.has-smooth-scroll { height: 100%; overflow: hidden; } html:not(.has-smooth-scroll) { overflow: scroll; -webkit-overflow-scrolling: touch; } html[data-template=jobs] { background-color: #edeaea; } html[data-theme=dark] { background-color: #000; } html[data-theme=dark] .o-page { color: #fff; } .has-smooth-scroll .o-page, .has-smooth-scroll .o-scroll, .has-smooth-scroll body, .has-smooth-scroll main { height: 100%; overflow: hidden; } ::-moz-selection { background-color: #222325; color: #fff; text-shadow: none; } ::selection { background-color: #222325; color: #fff; text-shadow: none; } .o-link, a { color: #000; -webkit-transition: color .3s cubic-bezier(.4, 0, 0, 1); transition: color .3s cubic-bezier(.4, 0, 0, 1); } .o-link:hover, a:hover { color: #000; } .o-link.-underline, a.-underline { color: #222; text-decoration: underline; } .o-link.-underline:hover, a.-underline:hover { color: #222; } .o-link.-white, a.-white { color: #fff; } .o-link.-white:hover, a.-white:hover { color: #fff; } .o-horizontal { position: relative; } .o-horizontal.-margin { margin-left: 10rem; } .has-smooth-scroll .o-horizontal { height: 100vh; } figure { margin: 0; } .o-h, .o-h1, .o-h2, .o-h3, .o-h4, .o-h5, .o-h6, h1, h2, h3, h4, h5, h6 { margin-top: 0; line-height: 1.5; } .o-h1, h1 { font-size: 6.25rem; font-weight: 700; line-height: 1.1; } @media (max-width:1199px) { .o-h1, h1 { font-size: 5.625rem; } } @media (max-width:699px) { .o-h1, h1 { font-size: 3.4375rem; } } .o-h2, h2 { font-size: 6.25rem; font-weight: 700; line-height: 1.1; } @media (max-width:1399px) { .o-h2, h2 { font-size: 5.3125rem; } } @media (max-width:699px) { .o-h2, h2 { font-size: 3.75rem; } } .o-h3, h3 { font-size: 3.8rem; line-height: 1.1; } .o-h4, h4 { font-size: 2.0rem; margin: 1.875rem 0; line-height: 1.2; } @media (max-width:1199px) { .o-h4, h4 { font-size: 1.375rem; } } .o-h5, h5 { font-size: 1.125rem; } .o-h6, h6 { font-size: 1rem; } @media (min-width:1400px) { .o-container { max-width: calc(100% - 13.75rem); } } @media (min-width:1200px) and (max-width:1399px) { .o-container { max-width: calc(100% - 11.25rem); } .join_bg .o-container { max-width: 100%; } .join_bg .o-layout_item { padding-right: 6% !important; } } @media (min-width:1000px) and (max-width:1199px) { .o-container { max-width: calc(100% - 8.75rem); } .join_bg .o-container { max-width: 100%; } .join_bg .o-layout_item { padding-right: 3% !important; } } .o-layout { margin: 0; padding: 0; list-style: none; font-size: 0; margin-left: 0; } .o-layout.-gutter { margin-left: -3.33rem; } @media (max-width:699px) { .o-layout.-gutter { margin-left: -1.875rem; } } .o-layout.-gutter-small { margin-left: -1.875rem; } .o-layout.-center { text-align: center; } .o-layout.-right { text-align: right; } .o-layout.-reverse { direction: rtl; } .o-layout_item { display: inline-block; width: 100%; vertical-align: top; font-size: 1rem; padding-left: 0; } .o-layout.-gutter>.o-layout_item { padding-left: 3.33rem; } @media (max-width:699px) { .o-layout.-gutter>.o-layout_item { padding-left: 1.875rem; } } .o-layout.-gutter-small>.o-layout_item { padding-left: 1.875rem; } .o-layout.-middle>.o-layout_item { vertical-align: middle; } .o-layout.-bottom>.o-layout_item { vertical-align: bottom; } .o-layout.-center>.o-layout_item, .o-layout.-reverse>.o-layout_item, .o-layout.-right>.o-layout_item { text-align: left; } .o-layout.-reverse>.o-layout_item { direction: ltr; } .o-checkbox-label, .o-label, .o-radio-label { display: block; margin-bottom: .625rem; font-size: .875rem; } .o-label { font-family: 'hyg2gjm'; } .has-error.o-checkbox-label, .has-error.o-radio-label, .o-label.has-error { color: red; } .o-input_wrapper { position: relative; margin-bottom: 1.875rem; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .o-input_wrapper { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .dom-is-loaded .o-input_wrapper:nth-child(1) { -webkit-transition-delay: .68s; transition-delay: .68s; } .dom-is-loaded .o-input_wrapper:nth-child(2) { -webkit-transition-delay: .76s; transition-delay: .76s; } .dom-is-loaded .o-input_wrapper:nth-child(3) { -webkit-transition-delay: .84s; transition-delay: .84s; } .dom-is-loaded .o-input_wrapper:nth-child(4) { -webkit-transition-delay: .92s; transition-delay: .92s; } .dom-is-loaded .o-input_wrapper:nth-child(5) { -webkit-transition-delay: 1s; transition-delay: 1s; } .dom-is-loaded .o-input_wrapper:nth-child(6) { -webkit-transition-delay: 1.08s; transition-delay: 1.08s; } .dom-is-loaded .o-input_wrapper:nth-child(7) { -webkit-transition-delay: 1.16s; transition-delay: 1.16s; } .o-input_wrapper_icon { position: absolute; top: 50%; right: 0; z-index: 100; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .o-input_wrapper_icon svg { display: block; width: 16px; height: 16px; } .o-checkbox-label::after, .o-checkbox-label::before, .o-input, .o-radio-label::after, .o-radio-label::before, .o-select, .o-textarea { padding: .9375rem .625rem; border: 0; background-color: #f1f1f1; -webkit-transition: background-color .3s cubic-bezier(.215, .61, .355, 1); transition: background-color .3s cubic-bezier(.215, .61, .355, 1); } .o-checkbox-label:focus::after, .o-checkbox-label:focus::before, .o-input:focus, .o-radio-label:focus::after, .o-radio-label:focus::before, .o-select:focus, .o-textarea:focus { background-color: #edeaea; } .o-input::-webkit-input-placeholder, .o-select::-webkit-input-placeholder, .o-textarea::-webkit-input-placeholder { color: gray; } .o-input:-ms-input-placeholder, .o-select:-ms-input-placeholder, .o-textarea:-ms-input-placeholder { color: gray; } .o-input::-ms-input-placeholder, .o-select::-ms-input-placeholder, .o-textarea::-ms-input-placeholder { color: gray; } .o-input::placeholder, .o-select::placeholder, .o-textarea::placeholder { color: gray; } .o-checkbox, .o-radio { position: absolute; width: 0; opacity: 0; } .o-checkbox:focus+.o-checkbox-label::before, .o-checkbox:focus+.o-radio-label::before, .o-radio:focus+.o-checkbox-label::before, .o-radio:focus+.o-radio-label::before { border-color: gray; } .o-checkbox:checked+.o-checkbox-label::after, .o-checkbox:checked+.o-radio-label::after, .o-radio:checked+.o-checkbox-label::after, .o-radio:checked+.o-radio-label::after { opacity: 1; } .o-checkbox-label, .o-radio-label { position: relative; display: inline-block; margin-right: .5em; padding-left: 1.75rem; } .o-checkbox-label::after, .o-checkbox-label::before, .o-radio-label::after, .o-radio-label::before { position: absolute; top: 50%; left: 0; display: inline-block; margin-top: -.5625rem; padding: 0; width: 1.125rem; height: 1.125rem; content: ""; } .o-checkbox-label::after, .o-radio-label::after { border-color: transparent; background-color: transparent; background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2210.5%22%20viewBox%3D%220%200%2013%2010.5%22%20enable-background%3D%22new%200%200%2013%2010.5%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpath%20fill%3D%22%23424242%22%20d%3D%22M4.8%205.8L2.4%203.3%200%205.7l4.8%204.8L13%202.4c0%200-2.4-2.4-2.4-2.4L4.8%205.8z%22%2F%3E%3C%2Fsvg%3E); background-position: center; background-size: .8125rem; background-repeat: no-repeat; opacity: 0; } .o-radio-label::after, .o-radio-label::before { border-radius: 50%; } .o-radio-label::after { background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20enable-background%3D%22new%200%200%2013%2013%22%20xml%3Aspace%3D%22preserve%22%3E%3Ccircle%20fill%3D%22%23424242%22%20cx%3D%226.5%22%20cy%3D%226.5%22%20r%3D%226.5%22%2F%3E%3C%2Fsvg%3E); background-size: .5rem; } .o-select { position: relative; z-index: 1; padding-right: 2.5rem; } .o-select-wrap { position: relative; } .o-select-wrap::after { position: absolute; top: 0; right: 0; bottom: 0; z-index: 2; width: 2.5rem; background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20version%3D%221.1%22%20x%3D%220%22%20y%3D%220%22%20width%3D%2213%22%20height%3D%2211.3%22%20viewBox%3D%220%200%2013%2011.3%22%20enable-background%3D%22new%200%200%2013%2011.3%22%20xml%3Aspace%3D%22preserve%22%3E%3Cpolygon%20fill%3D%22%23424242%22%20points%3D%226.5%2011.3%203.3%205.6%200%200%206.5%200%2013%200%209.8%205.6%20%22%2F%3E%3C%2Fsvg%3E); background-position: center; background-size: .625rem; background-repeat: no-repeat; content: ""; pointer-events: none; } .o-textarea { min-height: 9.375rem; resize: none; } .o-background { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; display: block; background-position: center; background-size: cover; } .o-background.-overlay::after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #222325; opacity: .32; -webkit-transition: opacity 1.2s cubic-bezier(.4, 0, 0, 1); transition: opacity 1.2s cubic-bezier(.4, 0, 0, 1); } .o-background.-overlay.-dark::after { opacity: .54; } .o-background.-left { background-position: center left; } .o-background.-right { background-position: center right; } .o-background_video { position: absolute; top: 50%; left: 50%; z-index: 1; min-width: 100%; min-height: 100%; width: auto; height: auto; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } @media (max-width:699px) { .o-background_video { left: 0; } } .autoplay-not-allowed .o-background_video { display: none; } @media (max-width:699px) and (orientation:portrait) { .o-background_video { max-height: 100%; } } .o-background_fallback { position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: 0; background-size: cover; background-position: center center; } .o-background_fallback::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(0, 0, 0, .2); } .o-button { position: relative; width: auto; padding: 1.875rem 1.25rem; background-color: #fff; color: #000; -webkit-transition: color .6s cubic-bezier(.215, .61, .355, 1), background-color .6s cubic-bezier(.215, .61, .355, 1); transition: color .6s cubic-bezier(.215, .61, .355, 1), background-color .6s cubic-bezier(.215, .61, .355, 1); } .o-button.-black { color: #fff; background-color: #000 } .o-button.-purple { background-color: #496df1; } .o-button.-large { padding: 1.375rem 3.35rem; } .o-button:hover { background-color: #e6e5e5 } .o-button:hover.-black { background-color: #1a1919 } .o-button:hover.-purple { color: #fff; background-color: #1a47ed } .o-button_hover, .o-button_label { display: block } .o-button_label { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition: opacity .2s cubic-bezier(.25, .46, .45, .94) .1s, -webkit-transform .2s cubic-bezier(.25, .46, .45, .94) .1s; transition: opacity .2s cubic-bezier(.25, .46, .45, .94) .1s, -webkit-transform .2s cubic-bezier(.25, .46, .45, .94) .1s; transition: opacity .2s cubic-bezier(.25, .46, .45, .94) .1s, transform .2s cubic-bezier(.25, .46, .45, .94) .1s; transition: opacity .2s cubic-bezier(.25, .46, .45, .94) .1s, transform .2s cubic-bezier(.25, .46, .45, .94) .1s, -webkit-transform .2s cubic-bezier(.25, .46, .45, .94) .1s } .o-button:hover .o-button_label { opacity: 0; -webkit-transform: translate(0, -150%); -ms-transform: translate(0, -150%); transform: translate(0, -150%); -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transition-timing-function: cubic-bezier(.55, .085, .68, .53); transition-timing-function: cubic-bezier(.55, .085, .68, .53) } .c-nav-button:hover .o-button_label { opacity: 0; -webkit-transform: translate(0, -150%); -ms-transform: translate(0, -150%); transform: translate(0, -150%); -webkit-transition-delay: 0s; transition-delay: 0s; -webkit-transition-timing-function: cubic-bezier(.55, .085, .68, .53); transition-timing-function: cubic-bezier(.55, .085, .68, .53) } .o-button_hover { position: absolute; top: 50%; left: 50%; width: 100%; opacity: 0; -webkit-transform: translate(-50%, 100%); -ms-transform: translate(-50%, 100%); transform: translate(-50%, 100%); -webkit-transition: opacity .2s cubic-bezier(.55, .085, .68, .53), -webkit-transform .2s cubic-bezier(.55, .085, .68, .53); transition: opacity .2s cubic-bezier(.55, .085, .68, .53), -webkit-transform .2s cubic-bezier(.55, .085, .68, .53); transition: opacity .2s cubic-bezier(.55, .085, .68, .53), transform .2s cubic-bezier(.55, .085, .68, .53); transition: opacity .2s cubic-bezier(.55, .085, .68, .53), transform .2s cubic-bezier(.55, .085, .68, .53), -webkit-transform .2s cubic-bezier(.55, .085, .68, .53) } .o-button:hover .o-button_hover { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 1; -webkit-transition-delay: .1s; transition-delay: .1s; -webkit-transition-timing-function: cubic-bezier(.25, .46, .45, .94); transition-timing-function: cubic-bezier(.25, .46, .45, .94) } .c-nav-button:hover .o-button_hover { -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 1; -webkit-transition-delay: .1s; transition-delay: .1s; -webkit-transition-timing-function: cubic-bezier(.25, .46, .45, .94); transition-timing-function: cubic-bezier(.25, .46, .45, .94) } .o-button-rounded { background-color: #ddd2de; padding: .9375rem; border-radius: 50%; display: inline-block; color: #000; -webkit-transition: color .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1); transition: color .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1) } .o-button-rounded .img { display: block; width: 18px; height: 20px } .o-button-rounded:hover { color: #fff; background-color: #000 } .o-barba_wrapper { height: 100%; overflow: hidden; min-height: 100vh } .o-barba_container { height: 100%; overflow: hidden } .has-smooth-scroll .o-scroll { height: 100%; position: relative; overflow: hidden } .has-smooth-scroll .o-horizontal .o-scroll { max-height: 100vh } .has-smooth-scroll .o-horizontal .o-scroll_list { margin: 0; padding: 0; list-style: none; font-size: 0; margin-left: 0; white-space: nowrap; height: 100%; position: relative; } .scroll-content { height: 100%; } .o-page { opacity: 1; -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loading:not([data-transition=BrandTransition]) .o-page { opacity: 0; } @media (min-width:1200px) { .o-page { margin-left: 15.44444rem; border-left: 1px solid #efefef; } } @media (min-width:1000px) and (max-width:1199px) { .o-page { margin-left: 15.44444rem; border-left: 1px solid #efefef; } } @media (max-width:999px) { .o-page { margin-top: 87px; } } @media (max-width:699px) { .o-page { margin-top: 67px; } } .o-page_cta { position: relative; z-index: 1; display: block; text-align: center; background-color: #656270; color: #fff; -webkit-transition: color .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1); transition: color .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1); } [data-template=about] .o-page_cta, [data-template=cased] .o-page_cta { background-color: #ffffff; color: #000; } .o-page_cta:hover { color: #000; background-color: #fff; } [data-template=about] .o-page_cta:hover, [data-template=cased] .o-page_cta:hover { background-color: #656270; color: #fff; } @media (min-width:1400px) { .o-page_cta { padding: 5rem; } } @media (max-width:1399px) { .o-page_cta { padding: 3.75rem; } } @media (max-width:699px) { .o-page_cta { padding: 3.75rem 1.875rem; } } .o-page_cta_title { position: relative; display: inline-block; margin-bottom: 1rem; font-size: 6.1111rem; line-height: 1.1; } .o-page_cta_title::after { content: ""; display: block; width: 100%; height: 4px; background-color: #ef8200; opacity: 0; -webkit-transition: background-color .3s cubic-bezier(.215, .61, .355, 1); transition: background-color .3s cubic-bezier(.215, .61, .355, 1); } @media (max-width:999px) { .o-page_cta_title::after { height: 4px; } } .o-page_cta_title.is-show::after { opacity: 1; } .o-page_cta:hover .o-page_cta_title::after { background-color: #000; } [data-template=about] .o-page_cta:hover .o-page_cta_title::after, [data-template=cased] .o-page_cta:hover .o-page_cta_title::after { background-color: #ffffff; } @media (max-width:999px) { .o-page_cta_title { font-size: 5rem; } } @media (max-width:699px) { .o-page_cta_title { font-size: 3.75rem; } } .o-page_cta_label { margin: 0 auto; max-width: 18.75rem; opacity: 0; font-weight: bold; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .6s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .6s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .3s, transform .6s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .3s, transform .6s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .6s cubic-bezier(.215, .61, .355, 1) .3s } .o-page_cta.is-show .o-page_cta_label { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none } @media (max-width:699px) { .o-page_cta_label { font-size: .875rem; } } .o-wysiwyg { font-size: .875rem } .o-wysiwyg strong {} .o-wysiwyg a { color: #000; line-height: 1.4; display: block; text-decoration: underline } [data-theme=dark] .o-wysiwyg a { color: #fff } .o-wysiwyg h3 { margin: 1.25rem 0 } @media (max-width:699px) { .o-wysiwyg h3 { margin: .8333333333rem 0; } } .o-wysiwyg>:first-child { margin-top: 0 } .o-wysiwyg ul { padding: 0 } .o-wysiwyg ul.-checked li { display: block; background-image: url(../images/check.svg); background-position: center left; background-size: 1.125rem auto; background-repeat: no-repeat; padding-left: 1.875rem; margin-bottom: .3125rem; opacity: 0; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1) } .o-wysiwyg ul.-checked li.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s } .o-embed { position: relative; padding-bottom: 56.25%; padding-top: 35px; height: 0; overflow: hidden } .o-embed iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .slick-slider { position: relative; display: block; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; height: 100% } .slick-list:focus { outline: 0 } .slick-slider .slick-list, .slick-slider .slick-track { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } .slick-track { position: relative; left: 0; top: 0; display: block; height: 100% } .slick-track:after, .slick-track:before { content: ""; display: table } .slick-track:after { clear: both } .slick-loading .slick-track { visibility: hidden } .slick-slide { position: relative; float: left; height: 100%; min-height: 1px; cursor: -webkit-grab; cursor: grab; outline: 0; display: none } [dir=rtl] .slick-slide { float: right } .slick-slide img { display: block } .slick-slide.slick-loading img { display: 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 } .is-dragging .slick-slide { cursor: -webkit-grabbing !important; cursor: grabbing !important } @media (max-width:999px) { .slick-arrow { display: none !important; } } .slick-arrow.slick-hidden { display: none } .slick-lightbox .slick-next, .slick-lightbox .slick-prev, .slick-lightbox-close { position: absolute; border-radius: 50%; text-align: center; margin: 10px; -webkit-transition: -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: transform .6s cubic-bezier(.645, .045, .355, 1); transition: transform .6s cubic-bezier(.645, .045, .355, 1), -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); z-index: 2; font-size: 0 } @media (max-width:699px) { .slick-lightbox .slick-next, .slick-lightbox .slick-prev, .slick-lightbox-close { width: 40px; height: 40px; top: 12px; } } @media (min-width:700px) { .slick-lightbox .slick-next, .slick-lightbox .slick-prev, .slick-lightbox-close { width: 50px; height: 50px; } } @media (min-width:700px) and (max-width:1199px) { .slick-lightbox .slick-next, .slick-lightbox .slick-prev, .slick-lightbox-close { top: 30px; } } @media (min-width:1200px) { .slick-lightbox .slick-next, .slick-lightbox .slick-prev, .slick-lightbox-close { top: 45px; } } .slick-lightbox .slick-next::before, .slick-lightbox .slick-prev::before, .slick-lightbox-close::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #fff; border-radius: 50%; -webkit-transition: background-color .3s cubic-bezier(.645, .045, .355, 1); transition: background-color .3s cubic-bezier(.645, .045, .355, 1) } .slick-lightbox .slick-next::after, .slick-lightbox .slick-prev::after, .slick-lightbox-close::after { content: ""; position: absolute; top: 50%; left: 50%; display: inline-block; width: 14px; height: 14px; margin-top: -7px; margin-left: -7px; background-size: 100% 100% } .slick-lightbox { position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; -webkit-transition: opacity .3s cubic-bezier(.645, .045, .355, 1); transition: opacity .3s cubic-bezier(.645, .045, .355, 1); background: 0 0 !important } .slick-lightbox::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: #000; opacity: .9; -webkit-transition: opacity .6s cubic-bezier(.455, .03, .515, .955); transition: opacity .6s cubic-bezier(.455, .03, .515, .955) } .slick-lightbox .slick-loading .slick-list { background-color: transparent } .slick-lightbox .slick-next, .slick-lightbox .slick-prev { top: 50%; margin-top: -25px; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0) } @media (max-width:999px) { .slick-lightbox .slick-next, .slick-lightbox .slick-prev { display: none; } } .slick-lightbox .slick-prev { -webkit-transition-delay: .1s; transition-delay: .1s } .slick-lightbox .slick-prev::after { background-image: url(../images/prev.svg); margin-left: -8px } @media (max-width:699px) { .slick-lightbox .slick-prev { left: 12px; } } @media (min-width:700px) and (max-width:1199px) { .slick-lightbox .slick-prev { left: 30px; } } @media (min-width:1200px) { .slick-lightbox .slick-prev { left: 45px; } } .slick-lightbox-hide .slick-lightbox .slick-prev, .slick-lightbox-hide-init .slick-lightbox .slick-prev { -webkit-transform: translateX(-250%); -ms-transform: translateX(-250%); transform: translateX(-250%) } .slick-lightbox .slick-next { -webkit-transition-delay: .2s; transition-delay: .2s } .slick-lightbox .slick-next::after { background-image: url(../images/next.svg) } @media (max-width:699px) { .slick-lightbox .slick-next { right: 12px; } } @media (min-width:700px) and (max-width:1199px) { .slick-lightbox .slick-next { right: 30px; } } @media (min-width:1200px) { .slick-lightbox .slick-next { right: 45px; } } .slick-lightbox.slick-lightbox-hide-init::before, .slick-lightbox.slick-lightbox-hide::before { opacity: 0 } .slick-lightbox.slick-lightbox-hide .slick-next, .slick-lightbox.slick-lightbox-hide-init .slick-next { -webkit-transform: translateX(250%); -ms-transform: translateX(250%); transform: translateX(250%); -webkit-transition-delay: 0s; transition-delay: 0s } .slick-lightbox.slick-lightbox-hide .slick-prev, .slick-lightbox.slick-lightbox-hide-init .slick-prev { -webkit-transform: translateX(-250%); -ms-transform: translateX(-250%); transform: translateX(-250%); -webkit-transition-delay: 0s; transition-delay: 0s } .slick-lightbox-hide-init { position: absolute; top: -9999px } .slick-lightbox-inner { position: fixed; top: 0; left: 0; width: 100%; height: 100% } .slick-lightbox-slick-item { text-align: center; overflow: hidden } @media (max-width:699px) { .slick-lightbox-slick-item { padding: 0 40px; } } @media (min-width:700px) and (max-width:999px) { .slick-lightbox-slick-item { padding: 0 3.75rem; } } @media (min-width:1000px) and (max-width:1199px) { .slick-lightbox-slick-item { padding: 0 130px; } } @media (min-width:1200px) { .slick-lightbox-slick-item { padding: 0 160px; } } .slick-lightbox-slick-item:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; margin-right: -.25em } .slick-caption-bottom .slick-lightbox-slick-item .slick-lightbox-slick-item .slick-lightbox-slick-caption { position: absolute; bottom: 0; left: 0; text-align: center; width: 100%; margin-bottom: 20px } .slick-caption-dynamic .slick-caption-bottom .slick-lightbox-slick-item .slick-lightbox-slick-item .slick-lightbox-slick-caption { display: block; text-align: center } .slick-lightbox-slick-item-inner { display: inline-block; vertical-align: middle; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition: -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: transform .6s cubic-bezier(.645, .045, .355, 1); transition: transform .6s cubic-bezier(.645, .045, .355, 1), -webkit-transform .6s cubic-bezier(.645, .045, .355, 1) } .slick-lightbox-hide .slick-lightbox-slick-item-inner, .slick-lightbox-hide-init .slick-lightbox-slick-item-inner { -webkit-transform: translateY(-100vh); -ms-transform: translateY(-100vh); transform: translateY(-100vh) } .slick-lightbox-slick-img { margin: 0 auto; display: block } .slick-lightbox-slick-caption { display: inline-block; margin: 10px 0 0; color: #fff; margin-top: 1.25rem; font-size: .875rem } .slick-lightbox-close { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: .3s; transition-delay: .3s } @media (max-width:699px) { .slick-lightbox-close { right: 12px; } } @media (min-width:700px) and (max-width:1199px) { .slick-lightbox-close { right: 30px; } } @media (min-width:1200px) { .slick-lightbox-close { right: 45px; } } .slick-lightbox-close::after { background-image: url(../images/close.svg) } .slick-lightbox-close:focus { outline: 0 } .slick-lightbox-hide .slick-lightbox-close, .slick-lightbox-hide-init .slick-lightbox-close { -webkit-transform: translateY(-250%); -ms-transform: translateY(-250%); transform: translateY(-250%); -webkit-transition-delay: 0s; transition-delay: 0s } [data-scrollbar], [scrollbar], scrollbar { position: relative; display: block } [data-scrollbar] .scroll-content, [scrollbar] .scroll-content, scrollbar .scroll-content { width: 100% } [data-scrollbar].sticky .scrollbar-track, [scrollbar].sticky .scrollbar-track, scrollbar.sticky .scrollbar-track { background: rgba(255, 255, 255, .3) } [data-scrollbar] .scrollbar-track, [scrollbar] .scrollbar-track, scrollbar .scrollbar-track { position: absolute; z-index: 1; -webkit-transition: opacity .5s ease-out, background .5s ease-out; transition: opacity .5s ease-out, background .5s ease-out; background: 0 0; visibility: hidden } .o-scroll .scrollbar-track { visibility: visible } [data-scrollbar] .scrollbar-track.show, [data-scrollbar] .scrollbar-track:hover, [scrollbar] .scrollbar-track.show, [scrollbar] .scrollbar-track:hover, scrollbar .scrollbar-track.show, scrollbar .scrollbar-track:hover { opacity: 1 } [data-scrollbar] .scrollbar-track:hover, [scrollbar] .scrollbar-track:hover, scrollbar .scrollbar-track:hover { background: rgba(255, 255, 255, .3) } [data-scrollbar] .scrollbar-track-x, [scrollbar] .scrollbar-track-x, scrollbar .scrollbar-track-x { bottom: 0; left: 0; width: 100%; height: 8px; visibility: hidden } [data-scrollbar] .scrollbar-track-y, [scrollbar] .scrollbar-track-y, scrollbar .scrollbar-track-y { top: 0; right: 0; width: 5px; height: 100% } [data-scrollbar] .scrollbar-thumb, [scrollbar] .scrollbar-thumb, scrollbar .scrollbar-thumb { position: absolute; top: 0; left: 0; width: 5px; height: 8px; background: rgba(0, 0, 0, .2); opacity: 0; -webkit-transition: opacity 1s cubic-bezier(.215, .61, .355, 1) 2s; transition: opacity 1s cubic-bezier(.215, .61, .355, 1) 2s } .dom-is-loaded [data-scrollbar] .scrollbar-thumb, .dom-is-loaded [scrollbar] .scrollbar-thumb, .dom-is-loaded scrollbar .scrollbar-thumb { opacity: 1 } .dom-is-reloaded [data-scrollbar] .scrollbar-thumb, .dom-is-reloaded [scrollbar] .scrollbar-thumb, .dom-is-reloaded scrollbar .scrollbar-thumb { opacity: 1 } .dom-is-loading [data-scrollbar] .scrollbar-thumb, .dom-is-loading [scrollbar] .scrollbar-thumb, .dom-is-loading scrollbar .scrollbar-thumb { opacity: 0; -webkit-transition-delay: 0s; transition-delay: 0s } [data-scrollbar] .overscroll-glow, [scrollbar] .overscroll-glow, scrollbar .overscroll-glow { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .selectric-wrapper { position: relative; cursor: pointer } .selectric-responsive { width: 100% } .selectric { border: 0 solid #000; border-radius: 0; background: #fff; position: relative; overflow: hidden; border-bottom: 3px solid #000 } .selectric .label { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0; font-size: 1.375rem; color: #000; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; padding: .8333333333rem 0 } .selectric .button { position: absolute; top: 50%; right: 0; z-index: 100; width: 14px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); color: transparent; background-image: url(../images/arrow-down.svg); background-repeat: no-repeat; background-position: center right } .selectric-focus .selectric { border-color: #000 } .selectric-hover .selectric { border-color: #000 } .selectric-open .selectric .button { -webkit-transform: translateY(-50%) rotate(179deg); -ms-transform: translateY(-50%) rotate(179deg); transform: translateY(-50%) rotate(179deg) } .selectric-open { z-index: 9999 } .selectric-open .selectric { border-color: #000 } .selectric-open .selectric-items { display: block } .selectric-disabled { opacity: .5; cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .selectric-hide-select { position: relative; overflow: hidden; width: 0; height: 0 } .selectric-hide-select select { position: absolute; left: -100% } .selectric-hide-select.selectric-is-native { position: absolute; width: 100%; height: 100%; z-index: 10 } .selectric-hide-select.selectric-is-native select { position: absolute; top: 0; left: 0; right: 0; height: 100%; width: 100%; border: none; z-index: 1; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 0 } .selectric-input { position: absolute !important; top: 0 !important; left: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; margin: 0 !important; padding: 0 !important; width: 1px !important; height: 1px !important; outline: 0 !important; border: none !important; background: 0 0 !important } .selectric-temp-show { position: absolute !important; visibility: hidden !important; display: block !important } .selectric-items { display: none; position: absolute; top: 100%; left: 0; background: #fff; z-index: -1; -webkit-box-shadow: 0 0 10px -6px; box-shadow: 0 0 10px -6px } .selectric-items .selectric-scroll { height: 100%; overflow: auto } .selectric-above .selectric-items { top: auto; bottom: 100% } .selectric-items li, .selectric-items ul { list-style: none; padding: 0; margin: 0; font-size: 1rem; line-height: 20px; min-height: 20px } .selectric-items li { display: block; padding: 10px; color: #000; cursor: pointer; padding: .8333333333rem; -webkit-transition: color .3s cubic-bezier(.215, .61, .355, 1), background .3s cubic-bezier(.215, .61, .355, 1); transition: color .3s cubic-bezier(.215, .61, .355, 1), background .3s cubic-bezier(.215, .61, .355, 1) } .selectric-items li:hover { background: #000; color: #fff } .selectric-items .disabled { opacity: .5; cursor: default !important; background: 0 0 !important; color: #666 !important; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .selectric-items .selectric-group .selectric-group-label { font-weight: 700; padding-left: 10px; cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background: 0 0; color: #444 } .selectric-items .selectric-group.disabled li { opacity: 1 } .selectric-items .selectric-group li { padding-left: 25px } .c-nav-background { position: fixed; top: 0; bottom: 0; left: 0; width: 10rem; z-index: 800; opacity: 0 } .c-nav-background::after, .c-nav-background::before { content: ""; background-color: #fff; position: absolute; right: 0; left: 0 } .c-nav-background::before { top: 0; height: 7.9375rem } .c-nav-background::after { bottom: 0; height: calc(100% - 17.3125rem) } @media (max-width:1199px) { .c-nav-background { width: 7.5rem; } } @media (max-width:999px) { .c-nav-background { display: none; } } .c-nav { position: fixed; top: 0; bottom: 0; left: 0; width: 15.44444rem; background:#fff; z-index: 900; } @media (max-width:1199px) { .c-nav { width: 15.44444rem; } } @media (max-width:999px) { .c-nav { width: 100%; bottom: auto; right: 0; background-color: #fff; height: 50px; } } .c-nav_wordmark { display: block; padding: 2rem 0; text-align: center; height: auto; opacity: 0; -webkit-transform: translateX(-60px); -ms-transform: translateX(-60px); transform: translateX(-60px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, .5), -webkit-transform .6s cubic-bezier(.215, .61, .355, .5); transition: opacity .6s cubic-bezier(.215, .61, .355, .5), -webkit-transform .6s cubic-bezier(.215, .61, .355, .5); transition: opacity .6s cubic-bezier(.215, .61, .355, .5), transform .6s cubic-bezier(.215, .61, .355, .5); transition: opacity .6s cubic-bezier(.215, .61, .355, .5), transform .6s cubic-bezier(.215, .61, .355, .5), -webkit-transform .6s cubic-bezier(.215, .61, .355, .5) } .c-nav_wordmark2{ display: block; padding: 2rem 0; text-align: center; height: auto; opacity: 1; } .dom-is-loaded .c-nav_wordmark, .dom-is-loading .c-nav_wordmark { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-nav_wordmark svg { fill: #222325; width: 5.1875rem; height: .875rem } @media (max-width:699px) { .c-nav_wordmark svg { width: 3.75rem; height: .625rem; } } @media (max-width:999px) { .c-nav_wordmark { display: inline-block; width: 25%; height: auto; padding: 1.875rem 3.75rem; } } @media (max-width:699px) { .c-nav_wordmark { width: auto; padding: 1.25rem 1.875rem; } } .c-nav_logo_mobile { display: inline-block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center } .c-nav_logo_mobile svg { width: 40px; height: 40px; fill: #000 } @media (max-width:999px) { .c-nav_logo_mobile svg { width: 30px; height: 30px; } } @media (min-width:1000px) { .c-nav_logo_mobile { visibility: hidden; } } .c-nav_text { position: absolute; right: 0; bottom: 0; left: 0; font-size: .75rem; padding: 1rem; padding-right: 1.25rem; font-weight: 500; opacity: 0; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .has-nav-open .c-nav_text.-small { width: 18.75rem; z-index: 99; } .has-logo-big.-small { width: auto; font-weight: bold; } .contact:after { content: ''; clear: both; display: block; zoom: 1; } .has-nav-open .c-nav_text.contact { -webkit-transition-delay: .1s; transition-delay: .1s; opacity: 1; visibility: visible; z-index: 99; } .has-logo-big .c-nav_text.contact { opacity: 0; visibility: visible; } .contact a { display: block; float: left; padding-top: 0.2rem; padding-bottom: 0.2rem; line-height: 1.2; cursor: pointer; } .contact a+a { border-left: 1px solid #686868; padding-left: 0.6rem; margin-left: 0.6rem; } .contact a div { font-size: 1.01rem; font-family: 'hyg2gjm'; } .contact a span { font-size: .8375rem; font-weight: bold; } .contact a span.active { -moz-transition: opacity 800ms; -webkit-transition: opacity 800ms; transition: opacity 800ms; -moz-animation: mymove 1s infinite alternate; -webkit-animation: mymove 1s infinite alternate; animation: mymove 1s infinite alternate; } @keyframes mymove { 0% { color: #5cc3dd; } 25% { color: #000000; } 50% { color: #5cc3dd; } 75% { color: #000000; } 100% { color: #5cc3dd; } } .dom-is-loaded .c-nav_text { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay:.6s; transition-delay: .6s; } .dom-is-loading .c-nav_text { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .dom-is-animated .c-nav_text { -webkit-transition-delay: .3s; transition-delay: .3s; } .c-nav_text.-big { font-size:14px; width: 18.75rem; right: auto; bottom: 5rem; padding-top: 0; padding-bottom: 0; margin-top: 0; margin-bottom: -.625rem; z-index: 2; opacity: 0; } .c-nav_text.contact { bottom: 9rem; width: 18.75rem; opacity: 0; visibility: hidden; } .dom-is-loaded .c-nav_text.-big { -webkit-transition-delay: 1.2s; transition-delay: 1.2s; } [data-template=home].dom-is-loaded .has-logo-big .c-nav_text.contact, [data-template=home].dom-is-loaded .has-logo-big .c-nav_text.-big { opacity: 1; } [data-template=home].dom-is-loaded .has-logo-big .c-nav_text.-small { width: 18.75rem; z-index: 99; } .has-nav-open .c-nav_text.-big { -webkit-transition-delay: .1s; transition-delay: .1s; opacity: 1; } .dom-is-loading .c-nav_text.-big { opacity: 0; } .dom-is-animated .c-nav_text.-big { -webkit-transition-delay: .15s; transition-delay: .15s; } @media (max-width:1199px) { .c-nav_text { padding: .9375rem; padding-right: 10px; } } @media (max-width:999px) { .c-nav_text { display: none; } } .c-nav_burger { position: absolute; top: 50%; width: 3.125rem; height: 3.125rem; line-height: 1; padding-top: 2px; margin-top: -1.5625rem; opacity: 0; -webkit-transform: translateX(-60px); -ms-transform: translateX(-60px); transform: translateX(-60px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1) } .dom-is-loaded .c-nav_burger, .dom-is-loading .c-nav_burger { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay:0.2s; transition-delay:0.2s } .c-nav_burger::after, .c-nav_burger::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; -webkit-transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: transform .3s cubic-bezier(.4, 0, 0, 1); transition: transform .3s cubic-bezier(.4, 0, 0, 1), -webkit-transform .3s cubic-bezier(.4, 0, 0, 1) } .c-nav_burger::before { background-color: #009bb8; } .c-nav_burger::after { background-color: #000; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0) } .c-nav_burger:hover::before { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2) } .has-nav-open .c-nav_burger::after { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .has-nav-open .c-nav_burger:hover::after { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2) } @media (min-width:1200px) { .c-nav_burger { left: 2.2222rem; } } @media (min-width:1000px) and (max-width:1199px) { .c-nav_burger { left: 2.2222rem; } } @media (max-width:999px) { .c-nav_burger { left: auto; right: 1.875rem; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 2.5rem; height: 2.5rem; margin-top: -1.25rem; } .c-nav_wordmark2{display:none;} } @media (max-width:699px) { .c-nav_burger { right: .9375rem; } } .c-nav_burger_lines { position: relative; display: inline-block; width: 2px; height: 18px; background-color: #fff; z-index: 2; -webkit-transition: background-color .3s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: background-color .3s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: background-color .3s cubic-bezier(.4, 0, 0, 1), transform .45s cubic-bezier(.4, 0, 0, 1); transition: background-color .3s cubic-bezier(.4, 0, 0, 1), transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1) } .c-nav_burger_lines::after, .c-nav_burger_lines::before { content: ""; background-color: #fff; position: absolute; top: 0; bottom: 0; width: 2px; -webkit-transition: background-color .3s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: background-color .3s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: background-color .3s cubic-bezier(.4, 0, 0, 1), transform .45s cubic-bezier(.4, 0, 0, 1); transition: background-color .3s cubic-bezier(.4, 0, 0, 1), transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom } .c-nav_burger_lines::before { right: -6px } .c-nav_burger_lines::after { left: -6px } .has-nav-open .c-nav_burger_lines { background-color: transparent; -webkit-transform: rotate(180deg) translateY(-2px); -ms-transform: rotate(180deg) translateY(-2px); transform: rotate(180deg) translateY(-2px) } .has-nav-open .c-nav_burger_lines::after, .has-nav-open .c-nav_burger_lines::before { background-color: #fff } .has-nav-open .c-nav_burger_lines::before { -webkit-transform: rotate(-42deg); -ms-transform: rotate(-42deg); transform: rotate(-42deg) } .has-nav-open .c-nav_burger_lines::after { -webkit-transform: rotate(42deg); -ms-transform: rotate(42deg); transform: rotate(42deg) } .c-nav_main { position: fixed; top: 0; right: 0; bottom: 0; font-size: 0; visibility: hidden; -webkit-transition: visibility 0s .9s; transition: visibility 0s .9s } .c-nav_main::before { display: inline-block; content: ""; width: 15%; height: 100%; background-color: #fff; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1) .6s; transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1) .6s; transition: transform .3s cubic-bezier(.4, 0, 0, 1) .6s; transition: transform .3s cubic-bezier(.4, 0, 0, 1) .6s, -webkit-transform .3s cubic-bezier(.4, 0, 0, 1) .6s; -webkit-transform-origin: center left; -ms-transform-origin: center left; transform-origin: center left } @media (max-width:999px) { .c-nav_main::before { display: none; } } .has-nav-open .c-nav_main { visibility: visible; -webkit-transition-delay: 0s; transition-delay: 0s } .has-nav-open .c-nav_main::before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); -webkit-transition-delay: 0s; transition-delay: 0s } @media (min-width:1200px) { .c-nav_main { left: 15.44444rem; } } @media (max-width:1199px) { .c-nav_main { left: 15.44444rem; } } @media (max-width:999px) { .c-nav_main { left: 0; top: 84px; } } @media (max-width:699px) { .c-nav_main { top: 67px; } } .c-nav_main_layout { position: relative; display: inline-block; vertical-align: top; height: 100%; width: calc(100% - 15.5%); text-align: left; } .has-nav-open .c-nav_main_layout:hover .bg { opacity: 0; visibility: hidden; } .has-nav-open .c-nav_main_layout .bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(../images/xian.png) no-repeat center center; background-size: cover; opacity: 1; visibility: visible; } @media (max-width:999px) { .c-nav_main_layout { width: 100%; } } .c-nav_main_item { height: 100%; -webkit-transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); -webkit-transform: translateZ(0); transform: translateZ(0); } @media (min-width:1200px) { .c-nav_main_item:hover+.c-nav_main_item { -webkit-transform: translateX(5rem); -ms-transform: translateX(5rem); transform: translateX(5rem); } .c-nav_main_item:nth-child(5):hover { -webkit-transform: translateX(-5rem); -ms-transform: translateX(-5rem); transform: translateX(-5rem); } } @media (max-width:999px) { .c-nav_main_item { height: 15%; } .c-nav_main_item.-big { height: 50%; } } .c-nav_main_item_secondary { height: 100% } .c-nav_main_link { position: relative; display: block; height: 100%; color: #fff; padding: 2.5rem; text-align: center; -webkit-transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1) } .c-nav_main_link.-dark { color: #000 } .c-nav_main_link.-dark01 { color: #010101 } @media (min-width:1200px) { .c-nav_main_link.-dark:hover { color: #000; } } @media (min-width:1200px) { .c-nav_main_link:hover { color: #fff; } } @media (min-width:1000px) { .c-nav_main_link.-half { height: 50%; } } @media (max-width:999px) { .c-nav_main_link.-half { display: inline-block; width: 50%; } .c-nav_main_link:focus, .c-nav_main_link:hover { color: #fff; } } @media (max-width:499px) { .c-nav_main_link { padding: 1.875rem; } } .c-nav_main_wrap { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; -webkit-transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1) } .c-nav_main_wrap::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: right 0s, bottom 0s, -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: right 0s, bottom 0s, -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: transform .3s cubic-bezier(.4, 0, 0, 1), right 0s, bottom 0s; transition: transform .3s cubic-bezier(.4, 0, 0, 1), right 0s, bottom 0s, -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); -webkit-transform-origin: center left; -ms-transform-origin: center left; transform-origin: center left } .c-nav_main_item:nth-child(1) .c-nav_main_wrap::before { background-color: #263244; -webkit-transition-delay: .3s, 0s, 0s; transition-delay: .3s, 0s, 0s } .has-nav-open .c-nav_main_item:nth-child(1) .c-nav_main_wrap::before { -webkit-transition-delay: .1s, .35s, 0s; transition-delay: .1s, .35s, 0s } .c-nav_main_item:nth-child(2) .c-nav_main_wrap::before { background-color: #5cc3dd; -webkit-transition-delay: .2s, 0s, 0s; transition-delay: .2s, 0s, 0s } .has-nav-open .c-nav_main_item:nth-child(2) .c-nav_main_wrap::before { -webkit-transition-delay: .2s, .7s, 0s; transition-delay: .2s, .7s, 0s } .c-nav_main_item:nth-child(3) .c-nav_main_wrap::before { background-color: #263244; -webkit-transition-delay: .3s, 0s, 0s; transition-delay: .3s, 0s, 0s } .has-nav-open .c-nav_main_item:nth-child(3) .c-nav_main_wrap::before { -webkit-transition-delay: .1s, .35s, 0s; transition-delay: .1s, .35s, 0s } .c-nav_main_item:nth-child(4) .c-nav_main_wrap::before { background-color: #5cc3dd; -webkit-transition-delay: .2s, 0s, 0s; transition-delay: .2s, 0s, 0s } .has-nav-open .c-nav_main_item:nth-child(4) .c-nav_main_wrap::before { -webkit-transition-delay: .2s, .7s, 0s; transition-delay: .2s, .7s, 0s } .has-nav-open .c-nav_main_wrap::before { right: -10rem; -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1) } @media (min-width:1200px) { .c-nav_main_item:hover .c-nav_main_wrap { -webkit-transform: translateX(-5rem); -ms-transform: translateX(-5rem); transform: translateX(-5rem); } } .c-nav_main_background { display: block; background-color: #263244; background-size: cover; -webkit-transition: opacity .45s cubic-bezier(.4, 0, 0, 1); transition: opacity .45s cubic-bezier(.4, 0, 0, 1); opacity: 0; z-index: 2; position: absolute; top: 0; right: -10rem; bottom: 0; left: 0; overflow: hidden } .c-nav_main_background .o-background { left: -5rem; right: 5rem; -webkit-transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1) } .c-nav_main_item:hover+.c-nav_main_item .c-nav_main_background .o-background { -webkit-transform: translateX(-5rem); -ms-transform: translateX(-5rem); transform: translateX(-5rem) } .c-nav_main_item:hover .c-nav_main_background .o-background { -webkit-transform: translateX(5rem); -ms-transform: translateX(5rem); transform: translateX(5rem) } .c-nav_main_item:hover .c-nav_main_background { opacity: 1 } .dom-is-loading .c-nav_main_background { opacity: 0 !important } @media (max-width:1199px) { .c-nav_main_background { display: none; } } .c-nav_main_content { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; opacity: 0; font-size: 0; -webkit-transition: opacity .15s cubic-bezier(.4, 0, 0, 1); transition: opacity .15s cubic-bezier(.4, 0, 0, 1) } .c-nav_main_content::before { display: inline-block; height: 100%; content: ""; vertical-align: middle } .c-nav_main_content>* { display: inline-block; vertical-align: middle; font-size: 1rem } .c-nav_main_item:nth-child(1) .c-nav_main_content { -webkit-transition-delay: .3s; transition-delay: .3s } .has-nav-open .c-nav_main_item:nth-child(1) .c-nav_main_content { -webkit-transition-delay: .1s; transition-delay: .1s } .c-nav_main_item:nth-child(2) .c-nav_main_content { -webkit-transition-delay: .2s; transition-delay: .2s } .has-nav-open .c-nav_main_item:nth-child(2) .c-nav_main_content { -webkit-transition-delay: .2s; transition-delay: .2s } .c-nav_main_item:nth-child(3) .c-nav_main_content { -webkit-transition-delay: .2s; transition-delay: .2s } .has-nav-open .c-nav_main_item:nth-child(3) .c-nav_main_content { -webkit-transition-delay: .2s; transition-delay: .2s } .c-nav_main_item:nth-child(4) .c-nav_main_content { -webkit-transition-delay: .2s; transition-delay: .2s } .has-nav-open .c-nav_main_item:nth-child(4) .c-nav_main_content { -webkit-transition-delay: .2s; transition-delay: .2s } .has-nav-open .c-nav_main_content { opacity: 1; } .c-nav_main_text { display: inline-block; position: absolute; bottom: 0; left: 6rem; text-align: left; margin: 2rem 1.5rem; font-size: 2rem; max-width: 13.125rem; font-weight: 500; line-height: 1.1; } .c-nav_main_text span { display: block; font-weight: 300; } .c-nav_main_link.-half .c-nav_main_text { font-size: .75rem; line-height: 1.6; } @media (max-width:999px) { .c-nav_main_text { display: block; left: 3rem; } .has-nav-open .c-nav_main_layout .bg { display: none; } .contact { margin-bottom: 1em; } } .c-nav_main_heading { position: relative; display: inline-block; font-weight: 500; line-height: 1; text-align: left; opacity: 0; -webkit-transition: opacity 1s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1s cubic-bezier(.215, .61, .355, 1); transition: opacity 1s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1s cubic-bezier(.215, .61, .355, 1); transition: opacity 1s cubic-bezier(.215, .61, .355, 1), transform 1s cubic-bezier(.215, .61, .355, 1); transition: opacity 1s cubic-bezier(.215, .61, .355, 1), transform 1s cubic-bezier(.215, .61, .355, 1), -webkit-transform 1s cubic-bezier(.215, .61, .355, 1); font-weight: bold; } .c-nav_main_item:nth-child(1) .c-nav_main_heading { -webkit-transition-delay: .3s; transition-delay: .3s; } .has-nav-open .c-nav_main_item:nth-child(1) .c-nav_main_heading { -webkit-transition-delay: .1s; transition-delay: .1s; } .c-nav_main_item:nth-child(2) .c-nav_main_heading { -webkit-transition-delay: .2s; transition-delay: .2s; } .has-nav-open .c-nav_main_item:nth-child(2) .c-nav_main_heading { -webkit-transition-delay: .2s; transition-delay: .2s; } .c-nav_main_item:nth-child(3) .c-nav_main_heading { -webkit-transition-delay: .2s; transition-delay: .2s; } .has-nav-open .c-nav_main_item:nth-child(3) .c-nav_main_heading { -webkit-transition-delay: .2s; transition-delay: .2s; } .c-nav_main_item:nth-child(4) .c-nav_main_heading { -webkit-transition-delay: .2s; transition-delay: .2s; } .has-nav-open .c-nav_main_item:nth-child(4) .c-nav_main_heading { -webkit-transition-delay: .2s; transition-delay: .2s; } .has-nav-open .c-nav_main_heading { opacity: 1; } .c-nav_main_heading.-large { position: absolute; bottom: 0; left: 0; font-size: 4rem; width: 9.5rem; height: 9.5rem; -webkit-transform: rotate(-90deg) translateY(-75%); -ms-transform: rotate(-90deg) translateY(-75%); transform: rotate(-90deg) translateY(-75%); margin: 1.875rem; font-weight: bold; word-break:keep-all; white-space:nowrap; } @media (max-width:1199px) { .c-nav_main_heading.-large { font-size: 6.25rem; } } @media (max-width:999px) { .c-nav_main_heading.-large { font-size: 5rem; -webkit-transform: rotate(-90deg) translateY(-50%); -ms-transform: rotate(-90deg) translateY(-50%); transform: rotate(-90deg) translateY(-50%); } } @media (max-width:699px) { .c-nav_main_heading.-large { font-size: 2.5rem; } } .has-nav-open .c-nav_main_heading.-large { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg) } @media (max-width:999px) { .has-nav-open .c-nav_main_heading.-large { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } } .c-nav_main_heading.-small { font-size: 1.875rem; color: #fff; text-align: center; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .c-nav_main_heading.-small i { display: block; font-style: inherit; font-size: 1rem; padding-top: 0.5rem; font-weight: 300; } .has-nav-open .c-nav_main_heading.-small { -webkit-transform: none; -ms-transform: none; transform: none; } @media (max-width:999px) { .c-nav_main_heading.-small { font-size: 1.25rem; } } @media (max-width:699px) { .c-nav_main_heading.-small { font-size: 1.125rem; } } .c-nav-button { position: fixed; right: 0; color: #fff; z-index: 800; text-align: center; letter-spacing: .02em; font-size: 0 } .c-nav-button::before { display: inline-block; height: 100%; content: ""; vertical-align: middle } .c-nav-button>* { display: inline-block; vertical-align: middle; font-size: 1rem } .c-nav-button:hover { color: #fff } .c-nav-button.-top { top: 0; opacity: 0; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%) } .dom-is-loaded .c-nav-button.-top { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 2.7s; transition-delay: 2.7s; -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1) } [data-transition=BetweenBrandsTransition] .c-nav-button.-top { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 2.7s; transition-delay: 2.7s; -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } [data-template=cased] .c-nav-button.-top, [data-template=jobs] .c-nav-button.-top, [data-template=story] .c-nav-button.-top, [data-template=solutiond] .c-nav-button.-top { color: #000; font-weight: bold; font-family: 'hyg2gjm'; } [data-template=contact] .c-nav-button.-top { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); } .c-nav-button.-bottom { bottom: 0; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1) } .dom-is-loaded .c-nav-button.-bottom { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 2.9s; transition-delay: 2.9s } [data-transition=BetweenBrandsTransition] .c-nav-button.-bottom { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 2.9s; transition-delay: 2.9s } .dom-is-animated .c-nav-button.-bottom { -webkit-transition-delay: 0s; transition-delay: 0s } [data-template=jobs] .c-nav-button.-bottom { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%) } @media (max-width:999px) { [data-way=down] .c-nav-button.-bottom { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } } @media (min-width:1400px) { .c-nav-button { width: 13.75625rem; } } @media (min-width:1200px) and (max-width:1399px) { .c-nav-button { width: 11.25625rem; } } @media (min-width:1200px) { .c-nav-button { height: 7.5rem; } } @media (max-width:1199px) { .c-nav-button { width: 8.75rem; height: 5.625rem; } } @media (max-width:699px) { .c-nav-button { height: 4.375rem; padding: 1.25rem .625rem; font-size: .625rem; } .c-nav-button .o-button_hover, .c-nav-button .o-button_label { font-size: .875rem; } } .c-nav_main_infos { padding: 3.75rem 1.875rem; height: calc(35%); background-color: #fff; -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: -webkit-transform .4s cubic-bezier(.215, .61, .355, 1) .3s; transition: -webkit-transform .4s cubic-bezier(.215, .61, .355, 1) .3s; transition: transform .4s cubic-bezier(.215, .61, .355, 1) .3s; transition: transform .4s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .4s cubic-bezier(.215, .61, .355, 1) .3s; font-size: 0 } .c-nav_main_infos::before { display: inline-block; height: 100%; content: ""; vertical-align: middle } .c-nav_main_infos>* { display: inline-block; vertical-align: middle; font-size: 1rem } .has-nav-open .c-nav_main_infos { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 0s; transition-delay: 0s; } @media (min-width:1000px) { .c-nav_main_infos { display: none; } } @media (max-width:699px) { .c-nav_main_infos { padding: .9375rem 1.875rem; z-index: 99; position: relative; } } .c-nav_main_infos_text { opacity: 0; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1) .1s, -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .1s; transition: opacity .3s cubic-bezier(.215, .61, .355, 1) .1s, -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .1s; transition: opacity .3s cubic-bezier(.215, .61, .355, 1) .1s, transform .3s cubic-bezier(.215, .61, .355, 1) .1s; transition: opacity .3s cubic-bezier(.215, .61, .355, 1) .1s, transform .3s cubic-bezier(.215, .61, .355, 1) .1s, -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .1s; } .has-nav-open .c-nav_main_infos_text { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .1s; transition-delay: .1s; } .c-nav_main_infos_text.-big { font-size: 1.375rem; margin: 0; } @media (max-width:699px) { .c-nav_main_infos_text.-big { font-size: 1.125rem; } } @media (max-width:699px) { .c-nav_main_infos_text { font-size: .875rem; } } .c-logo { position: fixed; top: 0; bottom: 0; left: 0; width: 50%; z-index: 850; overflow: hidden; min-width: 45rem; pointer-events: none; } @media (max-width:999px) { .c-logo { display: none; } } .c-logo_wrap { -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.645, .045, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.645, .045, .355, 1), -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; padding-top: 3.7778rem; pointer-events: auto; opacity: 0; background-color: #000; } .c-logo_wrap::after, .c-logo_wrap::before { position: absolute; display: block; content: ""; right: 0; left: 0; background-color: #fff; height: 40.6875rem; } .c-logo_wrap::before { top: -41.3347rem; height: 45.3125rem; } .c-logo_wrap::after { top: 34.5rem; height: 475vh; } @media (min-width:1600px) { .c-logo_wrap::after { top: 34.5rem; } } @media (max-width:1199px) { .c-logo_wrap::after { top: 34.5rem; } } .c-logo_wrap .img { fill: #fff; width: 33.5556rem; height: 31.4444rem; } @media (min-width:1200px) { .c-logo_wrap { width: 33.5556rem; -webkit-transform: translateY(3.7778rem) scale(.31125); -ms-transform: translateY(3.7778rem) scale(.31125); transform: translateY(3.7778rem) scale(.31125); } .dom-is-loaded .c-logo_wrap { -webkit-transform: translateY(3.7778rem) scale(.31125); -ms-transform: translateY(3.7778rem) scale(.31125); transform: translateY(3.7778rem) scale(.31125); -webkit-transition-delay: .3s; transition-delay: .3s; opacity: 1; } .dom-is-loading .c-logo_wrap { -webkit-transform: translateY(3.7778rem) scale(.31125); -ms-transform: translateY(3.7778rem) scale(.31125); transform: translateY(3.7778rem) scale(.31125); -webkit-transition-delay: 0s; transition-delay: 0s; opacity: 1; } [data-template=home] .has-logo-big .c-logo_wrap { -webkit-transform: translateY(0) scale(1); -ms-transform: translateY(0) scale(1); transform: translateY(0) scale(1); } .has-logo-big .c-logo_wrap { -webkit-transition-delay: 1.6s; transition-delay: 1.6s; } .dom-is-animated .c-logo_wrap { -webkit-transition-delay: 0s; transition-delay: 0s; } } @media (min-width:1000px) and (max-width:1199px) { .c-logo_wrap { width: 33.5556rem; padding-top: 3.7778rem; -webkit-transform: translateY(3.7778rem) scale(.31125); -ms-transform: translateY(3.7778rem) scale(.31125); transform: translateY(3.7778rem) scale(.31125); } .dom-is-loaded .c-logo_wrap { -webkit-transform: translateY(3.7778rem) scale(.31125); -ms-transform: translateY(3.7778rem) scale(.31125); transform: translateY(3.7778rem) scale(.31125); -webkit-transition-delay: .3s; transition-delay: .3s; opacity: 1; } .dom-is-loading .c-logo_wrap { -webkit-transform: translateY(3.7778rem) scale(.31125); -ms-transform: translateY(3.7778rem) scale(.31125); transform: translateY(3.7778rem) scale(.31125); -webkit-transition-delay: 0s; transition-delay: 0s; opacity: 1; } [data-template=home] .has-logo-big .c-logo_wrap { -webkit-transform: translateY(0) scale(1); -ms-transform: translateY(0) scale(1); transform: translateY(0) scale(1); } .has-logo-big .c-logo_wrap { -webkit-transition-delay: 1.6s; transition-delay: 1.6s; } .dom-is-animated .c-logo_wrap { -webkit-transition-delay: 0s; transition-delay: 0s; } } [data-template=home] .c-logo_wrap { background-color: transparent; } .c-logo_target { position: absolute; top: 0; bottom: 0; left: 0; right: 99vw; z-index: -1; } @media (max-width:1199px) { [data-template=home] .c-logo_target { top: 100vh; right: 0; bottom: 0; } } .c-sharer { position: relative; z-index: 10; margin-top: 3.5rem; margin-bottom: 5.5556rem; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-sharer { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1.4s; transition-delay: 1.4s; } @media (max-width:699px) { .c-sharer { margin-top: 2.875rem; margin-bottom: 1.875rem; } } .c-sharer::after { content: ""; } .c-sharer_button { position: relative; opacity: 1; -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1), color .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1), color .3s cubic-bezier(.215, .61, .355, 1); z-index: 11; } .c-sharer.is-open .c-sharer_button { color: #fff; background-color: #000; opacity: 0; } .c-sharer_list { position: absolute; top: 0; left: 0; margin: 0; padding: 1.875rem 5.625rem 1.875rem 1.875rem; color: #fff; z-index: -1; overflow: hidden; visibility: hidden; -webkit-transition: z-index 0s .5s, visibility 0s .5s; transition: z-index 0s .5s, visibility 0s .5s; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .c-sharer_list::before { content: ""; position: absolute; top: 27px; left: 27px; width: 500px; height: 500px; z-index: -1; margin-top: -250px; margin-left: -250px; background-color: #000; border-radius: 50%; -webkit-transform: scale(.04); -ms-transform: scale(.04); transform: scale(.04); -webkit-transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .2s; transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .2s; transition: transform .3s cubic-bezier(.215, .61, .355, 1) .2s; transition: transform .3s cubic-bezier(.215, .61, .355, 1) .2s, -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .2s; } .c-sharer.is-open .c-sharer_list { z-index: 10; visibility: visible; -webkit-transition-delay: 0s; transition-delay: 0s; } .c-sharer.is-open .c-sharer_list::before { content: ""; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition-delay: 0s; transition-delay: 0s; } .c-sharer_list_button { position: relative; display: block; padding: 10px 0 2px 0 !important; height: auto !important; font-size: 0.875rem !important; opacity: 0; float: none !important; margin: 0 !important; background-image: none !important; color: #fff !important; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } .c-sharer.is-open .c-sharer_list_button { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-sharer.is-open .c-sharer_list_button:nth-child(1) { -webkit-transition-delay: .25s; transition-delay: .25s; } .c-sharer.is-open .c-sharer_list_button:nth-child(2) { -webkit-transition-delay: .3s; transition-delay: .3s; } .c-sharer.is-open .c-sharer_list_button:nth-child(3) { -webkit-transition-delay: .35s; transition-delay: .35s; } .c-sharer.is-open .c-sharer_list_button:nth-child(4) { -webkit-transition-delay: .4s; transition-delay: .4s; } .c-sharer_list_button::after { content: ""; position: absolute; bottom: 0; right: 0; left: 0; height: 1px; background-color: #fff; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: center left; -ms-transform-origin: center left; transform-origin: center left; -webkit-transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } .c-sharer_list_button:hover::after { content: ""; -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: center right; -ms-transform-origin: center right; transform-origin: center right; } .c-sharer_list_close { width: 15px; height: 15px; position: absolute; top: 0; right: 0; margin: 15px; opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } .c-sharer.is-open .c-sharer_list_close { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .2s; transition-delay: .2s; } .c-sharer_list_close svg { fill: #fff; display: block; width: 100%; height: 100%; } .c-home-section { position: relative; min-width: 100%; color: #fff; font-size: 0; display: block; overflow: hidden; background-color: #272424; } .c-home-section::before { display: inline-block; height: 100%; content: ""; vertical-align: middle; } .c-home-section>* { display: inline-block; vertical-align: middle; font-size: 1rem; } .c-home-section.-stats .o-background { left: 50vw; } @media (max-width:1199px) { .c-home-section.-stats { padding-top: 3.75rem; } } @media (min-width:1200px) { .c-home-section { display: block; height: 100vh; white-space: nowrap; } .c-home-section.-smaller { width: calc(100vw - 13.75rem); } .c-home-section.-bigger { width: calc(140vw); } .c-home-section.-xbigger { width: calc(140vw); } } @media (max-width:1199px) { .c-home-section:first-child { height: 100vh; } } @media (min-width:1000px) and (max-width:1199px) { .c-home-section { padding-left: 7.5rem; } } .c-home-section .o-background { opacity: .5; } .c-home-section_video { opacity: 0; -webkit-transition: opacity 1s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity 1s cubic-bezier(.215, .61, .355, 1) .3s; } .dom-is-loaded .c-home-section_video { opacity: 1; } .c-home-section_content { position: relative; white-space: normal; } @media (min-width:1000px) { .c-home-section:first-child .c-home-section_content { -webkit-transition: -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); transition: transform .6s cubic-bezier(.645, .045, .355, 1); transition: transform .6s cubic-bezier(.645, .045, .355, 1), -webkit-transform .6s cubic-bezier(.645, .045, .355, 1); -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } @media (min-width:1200px) { .c-home-section:first-child .c-home-section_content { padding-left: 20rem; } [data-template=home] .has-logo-big .c-home-section:first-child .c-home-section_content { -webkit-transform: translateX(18.5556rem); -ms-transform: translateX(18.5556rem); transform: translateX(18.5556rem); } } @media (min-width:1000px) and (max-width:1199px) { [data-template=home] .has-logo-big .c-home-section:first-child .c-home-section_content { -webkit-transform: translateX(25.625rem); -ms-transform: translateX(25.625rem); transform: translateX(25.625rem); } } @media (min-width:1200px) { .c-home-section_content { display: inline-block; width: 83vw; padding-left: 10rem; } } @media (max-width:1199px) { .c-home-section_content { width: 100%; padding: 3.75rem; } } @media (max-width:699px) { .c-home-section_content { padding: 3.75rem 1.875rem; } } .c-home-section_heading { position: relative; color: #fff; line-height: 1.1; font-weight: bold; } @media (max-width:1199px) { .c-home-section_heading { margin: 0; } } .c-home-section_heading_line { display: block; margin-bottom: 1.875rem; } @media (max-width:699px) { .c-home-section_heading_line { margin-bottom: .9375rem; } } .c-home-section_heading_line_inner { position: relative; } .c-home-section_heading_line_inner::after { content: ""; display: block; width: 100%; height: 2px; background-color: #fff; opacity: 0; } @media (max-width:699px) { .c-home-section_heading_line_inner::after { height: 6px; } } .c-home-section_heading_line_inner.is-displayed::after { opacity: 1; } .c-home_section_intro { margin-top: 7.5rem; } @media (max-width:999px) { .c-home_section_intro { margin-top: 1.875rem; } } .c-home_section_intro_title { font-weight: 400; font-size: 1.625rem; max-width: 22.5rem; opacity: 0; -webkit-transform: translateX(120px); -ms-transform: translateX(120px); transform: translateX(120px); -webkit-transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .3s, transform .8s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .3s, transform .8s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .3s; } .c-home_section_intro.is-show .c-home_section_intro_title { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-home-section_text { font-size: .9375rem; max-width: 22.5rem; line-height: 1.8; margin: 1.875rem 0; opacity: 0; -webkit-transform: translateX(120px); -ms-transform: translateX(120px); transform: translateX(120px); -webkit-transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .4s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .4s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .4s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .4s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .4s, transform .8s cubic-bezier(.215, .61, .355, 1) .4s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .4s, transform .8s cubic-bezier(.215, .61, .355, 1) .4s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .4s; } .c-home_section_intro.is-show .c-home-section_text { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-home-section_intro_button { display: inline-block; opacity: 0; -webkit-transform: translateX(120px); -ms-transform: translateX(120px); transform: translateX(120px); -webkit-transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .5s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .5s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .5s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .5s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .5s, transform .8s cubic-bezier(.215, .61, .355, 1) .5s; transition: opacity .8s cubic-bezier(.215, .61, .355, 1) .5s, transform .8s cubic-bezier(.215, .61, .355, 1) .5s, -webkit-transform .8s cubic-bezier(.215, .61, .355, 1) .5s; } .c-home_section_intro.is-show .c-home-section_intro_button { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-home-section_image { position: relative; display: inline-block; width: 50vw; height: 100%; margin: 0 -5vw 0 10vw; } @media (min-width:700px) { .c-home-section.-xbigger .c-home-section_image { width: 75vw; } } .c-home-section_image.-top { vertical-align: top; } .c-home-section_image.-bottom { vertical-align: bottom; } @media (max-width:1199px) { .c-home-section_image { margin: 0 3.75rem; } } @media (max-width:699px) { .c-home-section_image { margin: 0; width: 100%; } } .c-home-section_image_item { position: relative; } .c-home-section_image_item.-absolute { position: absolute; left: -15%; z-index: 1; } .c-home-section_image_item.-absolute.-bottom { bottom: 0; } @media (max-width:1199px) { .c-home-section_image_item.-absolute { display: none; } } .c-home-section_image_item.-overlay { overflow: hidden; } .c-home-section_image_item.-overlay img { display: block; margin: 0; width: 100%; } .c-home-section_image_item.-overlay::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(39, 36, 36, .3); } .c-home-section_stat { display: block; } @media (min-width:1200px) { .c-home-section_stat { width: 40vw; display: inline-block; } .c-home-section_stat.-top { margin-top: -11.25rem; } .c-home-section_stat.-bottom { margin-bottom: -11.25rem; } .c-home-section_stat:nth-child(2) { margin-left: 10vw; } } @media (max-width:1199px) { .c-home-section_stat { width: 100%; padding: 1.875rem 3.75rem; } } @media (max-width:1199px) { .c-home-section_stat { text-align: center; } } @media (max-width:699px) { .c-home-section_stat { text-align: left; padding: 1.875rem; } } .c-home-section_stat_label { position: absolute; top: 15%; left: calc(100% + 30px); font-size: .875rem; font-weight: 400; } @media (max-width:699px) { .c-home-section_stat_label { left: calc(100% + 15px); } } .c-home-section_stat_label_icon, .c-home-section_stat_label_text { display: inline-block; vertical-align: top; } .c-home-section_stat_label_icon { width: 20px; height: 20px; margin-right: 10px; } .c-home-section_arrow { position: absolute; top: 50%; right: 1.875rem; width: 3.125rem; height: 3.125rem; margin-top: -1.5625rem; opacity: 0; cursor: pointer; -webkit-transform: translateX(120px); -ms-transform: translateX(120px); transform: translateX(120px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded:not(.has-scroll) .c-home-section_arrow { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1s; transition-delay: 1s; } .c-home-section_arrow::after, .c-home-section_arrow::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; -webkit-transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: transform .3s cubic-bezier(.4, 0, 0, 1); transition: transform .3s cubic-bezier(.4, 0, 0, 1), -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); } .c-home-section_arrow::before { background-color: #ddd2de; } .c-home-section_arrow::after { background-color: #000; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .c-home-section_arrow:hover::before { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .c-home-section_arrow .img { display: block; width: 1.125rem; height: 1.125rem; position: relative; z-index: 10; margin: 1rem; fill: #000; cursor: pointer; background: url(../images/home-prev.png) no-repeat center; } @media (max-width:999px) { .c-home-section_arrow { top: auto; bottom: 1.875rem; left: 50%; right: auto; margin-top: 0; margin-left: -1.5625rem; -webkit-transform: translateY(120px) rotate(90deg); -ms-transform: translateY(120px) rotate(90deg); transform: translateY(120px) rotate(90deg); } .dom-is-loaded:not(.has-scroll) .c-home-section_arrow { opacity: 1; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition-delay: 1s; transition-delay: 1s; display: none; } } .c-header-section { position: relative; min-width: 100%; color: #fff; white-space: nowrap; } [data-template=about] .c-home-section, [data-template=culture] .c-home-section { z-index: 10; } @media (min-width:1200px) { .c-header-section { height: 100vh; } } @media (max-width:1199px) { .c-header-section { height: 80vh; } } @media (min-width:1000px) { .c-header-section.-smaller { display: inline-block; width: calc(100vw - 13.75rem); } } @media (min-width:1000px) and (max-width:1199px) { .c-header-section.-smaller { display: block; } } .o-horizontal .c-header-section { font-size: 0; } .o-horizontal .c-header-section::before { display: inline-block; height: 100%; content: ""; vertical-align: middle; } .o-horizontal .c-header-section>* { display: inline-block; vertical-align: middle; font-size: 1rem; } .c-header-section::after { position: absolute; top: 0; bottom: 0; right: 0; left: 0; } .c-header-section_content { width: 100%; padding-right: 3.75rem; } .o-page .c-header-section_content { position: absolute; bottom: 0; left: 0; } @media (min-width:1400px) { .o-page .c-header-section_content { padding-left: 7.5rem; } } @media (max-width:1399px) { .o-page .c-header-section_content { padding-left: 3.75rem; } } @media (max-width:699px) { .o-page .c-header-section_content { padding-left: 1.875rem; } } @media (min-width:1400px) { .c-header-section_content { padding-left: 21.25rem; } } @media (max-width:1399px) { .c-header-section_content { padding-left: 13.75rem; } } @media (max-width:999px) { .c-header-section_content { padding-left: 3.75rem; } } @media (max-width:699px) { .c-header-section_content { padding-left: 1.875rem; padding-right: 1.875rem; } } .c-header-section_heading { position: relative; color: #fff; line-height: 1.1; } .c-header-section_heading.-black { color: #000; } .c-header-section_heading.-medium { font-size: 7.5rem; } @media (max-width:1599px) { .c-header-section_heading.-medium { font-size: 6.25rem; } } @media (max-width:1399px) { .c-header-section_heading.-medium { font-size: 5.625rem; } } @media (max-width:1199px) { .c-header-section_heading.-medium { font-size: 5rem; } } @media (max-width:699px) { .c-header-section_heading.-medium { font-size: 4.375rem; } } .c-header-section_heading.-small { white-space: normal; font-size: 4.4444rem; } .c-news-section_content .c-header-section_heading.-small { font-size: 2.7778rem; font-weight: 300; } @media (max-width:1599px) { .c-header-section_heading.-small { font-size: 4.375rem; } .c-news-section_content .c-header-section_heading.-small { font-size: 2.375rem; } } @media (max-width:1399px) { .c-header-section_heading.-small { font-size: 3.75rem; } .c-news-section_content .c-header-section_heading.-small { font-size: 1.75rem; } } @media (max-width:1199px) { .c-header-section_heading.-small { font-size: 3.125rem; } .c-news-section_content .c-header-section_heading.-small { font-size: 1.125rem; } } @media (max-width:699px) { .c-header-section_heading.-small { font-size: 2.1875rem; } .c-news-section_content .c-header-section_heading.-small { font-size: 1.1875rem; } } @media (min-width:1200px) { .c-header-section_heading { max-width: 70%; } } @media (min-width:1400px) { .c-header-section_heading { font-size: 8.75rem; } } @media (max-width:1199px) { [data-template=culture] .c-header-section_heading { margin-bottom: 11.25rem; } } @media (max-width:699px) { [data-template=culture] .c-header-section_heading { margin-bottom: 7.5rem; } } [data-template=brand-details] .c-header-section_heading { margin-bottom: 11.25rem; } @media (max-width:699px) { [data-template=brand-details] .c-header-section_heading { margin-bottom: 7.5rem; } } .c-header-section_heading_glitch { display: inline !important; line-height: 1.2; /*border-bottom: 4px solid #ef8200;*/ text-transform: capitalize; } .c-glitch_content_text, .c-content-stories_header_text { position: relative; font-size: 1.4444rem; padding-bottom: 1rem; display: block; margin-bottom: 4rem; font-family: 'hyg2gjm'; } .c-glitch_content_text:after, .c-content-stories_header_text:after, .c-news-section_content .c-header-section_heading.-small:after { content: ''; position: absolute; bottom: 0; left: 0; width: 150px; height: 4px; background-color: #ef8200; } .c-news-section_content .c-header-section_heading.-small:after { bottom: -0.8rem; } @media (max-width:1399px) { /* .c-header-section_heading_glitch { border-bottom: 4px solid #ef8200; }*/ } @media (max-width:699px) { /* .c-header-section_heading_glitch { border-bottom: 4px solid #ef8200; }*/ } .c-header-section_heading_line { display: block; margin-bottom: 1.875rem; } .c-header-section_heading_line.-offset { margin-left: 10vw; } @media (max-width:1399px) { .c-header-section_heading.-medium .c-header-section_heading_line { margin-bottom: 1.25rem; } } @media (max-width:699px) { .c-header-section_heading_line { margin-bottom: .9375rem; } } .c-header-section_heading_line_inner { display: inline-block; position: relative; } .c-header-section_heading_line_inner sup { position: absolute; top: .5em; font-size: .4em; } .c-header-section_heading_line_inner::after { content: ""; display: block; width: 100%; height: 10px; background-color: #fff; opacity: 0; } @media (max-width:699px) { .c-header-section_heading_line_inner::after { height: 6px; } } .c-header-section_heading.-black .c-header-section_heading_line_inner::after { background-color: #000; } .c-header-section_heading_line_inner.is-displayed::after { opacity: 1; } .c-header-section_heading.-small .c-header-section_heading_line_inner::after { display: none; } .c-header-section_background { overflow: hidden; } .c-header-section_background, .c-header-section_background_inner { position: absolute; top: 0; bottom: 0; right: 0; left: 0; } .c-header-section_heading_date { display: block; font-size: 1.2222rem; text-transform: uppercase; font-weight: bold; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-header-section_heading_date { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1.2s; transition-delay: 1.2s; } @media (max-width:699px) { .c-header-section_heading_date { font-size: .875rem; } } .c-header-section_count { position: absolute; z-index: 1; top: 1.875rem; right: 1.875rem; color: #fff; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-header-section_count { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1.4s; transition-delay: 1.4s; } @media (min-width:1000px) { .c-header-section_count { display: none; } } .c-header-section_count_value { display: inline-block; line-height: 1; font-size: 3.75rem; } .c-header-section_count_value span { font-size: 1.875rem; margin-left: 4px; } .c-header-section_count_base { display: inline-block; vertical-align: top; margin-left: -.125rem; margin-top: .25rem; font-size: 1.125rem; } .c-header-section_text { color: #fff; position: relative; z-index: 1; white-space: normal; margin-bottom: 11.25rem; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-header-section_text { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1.6s; transition-delay: 1.6s; } @media (min-width:1000px) { .c-header-section_text { max-width: 30vw; } } @media (max-width:999px) { .c-header-section_text { max-width: 50vw; } } @media (max-width:1399px) { .c-header-section_text { margin-bottom: 11.25rem; } } @media (max-width:1199px) { .c-header-section_text { margin-bottom: 0; } } .c-header-section_cta { position: absolute; bottom: 0; color: #fff; background-color: #222325; text-align: center; opacity: 0; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); font-size: 0; } .dom-is-loaded:not(.has-scroll) .c-header-section_cta { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1.8s; transition-delay: 1.8s; } .c-header-section_cta::before { display: inline-block; height: 100%; content: ""; vertical-align: middle; } .c-header-section_cta>* { display: inline-block; vertical-align: middle; font-size: 1rem; } .c-header-section_cta:focus, .c-header-section_cta:hover { color: #fff; } @media (min-width:1400px) { .c-header-section_cta { width: 13.75rem; } } @media (min-width:1200px) and (max-width:1399px) { .c-header-section_cta { width: 11.25rem; } } @media (min-width:1200px) { .c-header-section_cta { height: 7.5rem; } } @media (max-width:1199px) { .c-header-section_cta { width: 8.75rem; height: 5.625rem; } } @media (max-width:699px) { .c-header-section_cta { height: auto; } } .c-header-section_scroll_target { display: inline-block; width: 100%; vertical-align: top; font-size: 1rem; padding-left: 0; width: 1px; position: absolute; top: 0; bottom: 0; left: 100vw; } @media (max-width:1199px) { .c-header-section_scroll_target { left: 0; right: 0; width: auto; height: 1px; top: 67vh; } } .c-header-section_arrow { position: absolute; bottom: 1.875rem; left: 50%; width: 3.125rem; height: 3.125rem; margin-left: -1.5625rem; padding: 1.125rem; opacity: 0; -webkit-transform: translateY(120px); -ms-transform: translateY(120px); transform: translateY(120px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded:not(.has-scroll) .c-header-section_arrow { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1s; transition-delay: 1s; } .c-header-section_arrow::after, .c-header-section_arrow::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border-radius: 50%; -webkit-transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); transition: transform .3s cubic-bezier(.4, 0, 0, 1); transition: transform .3s cubic-bezier(.4, 0, 0, 1), -webkit-transform .3s cubic-bezier(.4, 0, 0, 1); } .c-header-section_arrow::before { background-color: #ddd2de; background-image: url(../images/prev-icon.png); background-position: center; background-repeat: no-repeat; } .c-header-section_arrow::after { background-color: #000; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .c-header-section_arrow:hover::before { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); } .c-header-section_arrow svg { display: block; width: 100%; height: 100%; position: relative; z-index: 10; fill: #000; } .c-action { display: inline-block; width: 100%; vertical-align: top; font-size: 1rem; padding-left: 0; position: relative; width: 36vw; height: 100%; color: #fff; white-space: normal; } .c-action:hover { color: #fff; } [data-transition=BrandTransition] .c-action { z-index: 10; } .c-action.is-clicked-link { z-index: 11; } .c-action:not(.is-clicked-link) { -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1); } [data-template=solution] .o-scroll_list .c-action:first-child:hover .c-action_wrap, [data-template=case] .o-scroll_list .c-action:first-child:hover .c-action_wrap { -webkit-transform: translateX(0); -moz-transform: translateX(0); -ms-transform: translateX(0); -o-transform: translateX(0); transform: translateX(0); } [data-template=solution] .o-scroll_list .c-action:first-child .c-action_heading, [data-template=case] .o-scroll_list .c-action:first-child .c-action_heading { -webkit-transform: translateX(5%); -moz-transform: translateX(5%); -ms-transform: translateX(5%); -o-transform: translateX(5%); transform: translateX(5%); } .dom-is-loading .c-action:not(.is-clicked-link) { opacity: 0; -webkit-transition-delay: .5s; transition-delay: .5s; } @media (min-width:1200px) { .c-action:last-child { overflow: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transition: overflow 0s .6s, -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: overflow 0s .6s, -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), overflow 0s .6s; transition: transform .45s cubic-bezier(.4, 0, 0, 1), overflow 0s .6s, -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); width: calc(35vw + 5vw); margin-right: -5vw; padding-right: 5vw; } .c-action:last-child:hover { overflow: visible; -webkit-transition-delay: 0s; transition-delay: 0s; } .c-action:first-child { overflow: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transition: overflow 0s .6s, -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: overflow 0s .6s, -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), overflow 0s .6s; transition: transform .45s cubic-bezier(.4, 0, 0, 1), overflow 0s .6s, -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); width: calc(35vw + 5vw); margin-left: -5vw; padding-left: 5vw; } .c-action:first-child:hover { overflow: visible; -webkit-transition-delay: 0s; transition-delay: 0s; } } @media (max-width:1199px) { .c-action { overflow: hidden; height: 60vh; -webkit-transition: height .5s cubic-bezier(.215, .61, .355, 1); transition: height .5s cubic-bezier(.215, .61, .355, 1); } .c-action.is-clicked-link { overflow: visible; height: 75vh; } } @media (min-width:1000px) and (max-width:1199px) { .c-action { width: calc(50% - 3.75rem); margin-left: -4px; } .c-action:nth-child(even) { margin-left: 7.5rem; } } @media (max-width:999px) { .c-action { width: 100%; } } .c-action_wrap { position: relative; height: 100%; display: block; -webkit-transform: translateZ(0); transform: translateZ(0); -webkit-transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); } @media (min-width:1200px) { .c-action:hover .c-action_wrap { -webkit-transform: translateX(-5vw); -ms-transform: translateX(-5vw); transform: translateX(-5vw); } .c-action:hover+.c-action .c-action_wrap { -webkit-transform: translateX(5vw); -ms-transform: translateX(5vw); transform: translateX(5vw); } [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_wrap { -webkit-transform: translateX(-5vw); -ms-transform: translateX(-5vw); transform: translateX(-5vw); } } .c-action_inner { font-size: 0; height: 100%; display: block; } .c-action_inner::before { display: inline-block; height: 100%; content: ""; vertical-align: middle; } .c-action_inner>* { display: inline-block; vertical-align: middle; font-size: 1rem; } .c-action_inner>div { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .c-action_background { position: absolute; top: 0; bottom: 0; left: 0; right: 0; overflow: hidden; -webkit-transition: left .5s cubic-bezier(.645, .045, .355, 1), right .5s cubic-bezier(.645, .045, .355, 1), -webkit-filter .6s cubic-bezier(.215, .61, .355, 1); transition: left .5s cubic-bezier(.645, .045, .355, 1), right .5s cubic-bezier(.645, .045, .355, 1), -webkit-filter .6s cubic-bezier(.215, .61, .355, 1); transition: filter .6s cubic-bezier(.215, .61, .355, 1), left .5s cubic-bezier(.645, .045, .355, 1), right .5s cubic-bezier(.645, .045, .355, 1); transition: filter .6s cubic-bezier(.215, .61, .355, 1), left .5s cubic-bezier(.645, .045, .355, 1), right .5s cubic-bezier(.645, .045, .355, 1), -webkit-filter .6s cubic-bezier(.215, .61, .355, 1); } @media (min-width:1200px) { [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_background { -webkit-filter: grayscale(0); filter: grayscale(0); } [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_background .o-background { -webkit-transform: translateX(5vw); -ms-transform: translateX(5vw); transform: translateX(5vw); } } @media (min-width:1400px) { [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_background { right: calc((-64vw + 13.75rem + 10rem)/ 2); left: calc((-64vw + 13.75rem + 10rem)/ 2); } } @media (min-width:1200px) and (max-width:1399px) { [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_background { right: calc((-64vw + 11.25rem + 10rem)/ 2); left: calc((-64vw + 11.25rem + 10rem)/ 2); } } @media (min-width:1000px) and (max-width:1199px) { [data-transition=BrandTransition] .c-action.is-clicked-link:nth-child(odd) .c-action_background { right: 0; left: calc((-100vw + 8.75rem + 10rem)/ 2); } [data-transition=BrandTransition] .c-action.is-clicked-link:nth-child(even) .c-action_background { left: 0; right: calc((-100vw + 8.75rem + 10rem)/ 2); } } @media (min-width:1200px) { .c-action_background { -webkit-filter: grayscale(1); filter: grayscale(1); right: -10vw; } .c-action_background .o-background { left: -5vw; right: 5vw; -webkit-transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1); transition: transform .45s cubic-bezier(.4, 0, 0, 1), -webkit-transform .45s cubic-bezier(.4, 0, 0, 1); } .c-action:hover+.c-action .c-action_background .o-background { -webkit-transform: translateX(-5vw); -ms-transform: translateX(-5vw); transform: translateX(-5vw); } .c-action:hover .c-action_background .o-background { -webkit-transform: translateX(5vw); -ms-transform: translateX(5vw); transform: translateX(5vw); } .c-action:hover .c-action_background { -webkit-filter: grayscale(0); filter: grayscale(0); } } .c-action_heading { position: relative; display: block; font-size: 6.25rem; font-weight: 700; line-height: 1.1; } @media (min-width:1200px) { .c-action_heading { -webkit-transform: translateX(-25%); -ms-transform: translateX(-25%); transform: translateX(-25%); } } @media (max-width:1199px) { .c-action_heading { font-size: 4.375rem; margin: 7.5rem 1.875rem; } } @media (max-width:999px) { .c-action_heading { margin: 7.5rem 3.75rem; } } @media (max-width:699px) { .c-action_heading { font-size: 2.8125rem; margin: 7.5rem 1.875rem; } } .c-action_heading_line { display: block; margin-bottom: 1.875rem; } .c-action_heading_line.-offset { margin-left: 10vw; } @media (max-width:1199px) { .c-action_heading_line { margin-bottom: 1.25rem; } } .c-action_heading_line_inner { display: inline-block; position: relative; } .c-action_heading_line_inner::after { content: ""; display: block; width: 100%; background-color: #fff; -webkit-transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); -webkit-transform-origin: center right; -ms-transform-origin: center right; transform-origin: center right; } @media (min-width:1200px) { .c-action_heading_line_inner::after { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); height: 8px; } .c-action:hover .c-action_heading_line_inner::after { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } .c-action:hover .c-action_heading_line:nth-child(1) .c-action_heading_line_inner::after { -webkit-transition-delay: .19s; transition-delay: .19s; } .c-action:hover .c-action_heading_line:nth-child(2) .c-action_heading_line_inner::after { -webkit-transition-delay: .28s; transition-delay: .28s; } } @media (max-width:1199px) { .c-action_heading_line_inner::after { height: 6px; } } [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_heading_line_inner::after { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } .c-action_heading_line_inner>* { -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_heading_line_inner>* { opacity: 0; -webkit-transform: translateX(60px); -ms-transform: translateX(60px); transform: translateX(60px); } @media (min-width:1200px) { .c-action_heading_line_inner>* { opacity: 0; -webkit-transform: translateX(60px); -ms-transform: translateX(60px); transform: translateX(60px); } .c-action:hover .c-action_heading_line_inner>* { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-action_heading_line_inner>:nth-child(1) { -webkit-transition-delay: 50ms; transition-delay: 50ms; } .c-action_heading_line_inner>:nth-child(2) { -webkit-transition-delay: .1s; transition-delay: .1s; } } .c-action_heading_line_slice { display: block; position: absolute; top: 0; /*left: -5px;*/ left: 0; /* height: 50%;*/ overflow: hidden; } @media (max-width:699px) { .c-action_heading_line_slice { display: none; } } .c-action_heading_line_base { display: block; position: relative; } @media (min-width:700px) { .c-action_heading_line_base { -webkit-clip-path: polygon(0 53%, 100% 53%, 100% 100%, 0 100%); clip-path: polygon(0 53%, 100% 53%, 100% 100%, 0 100%); } } .c-action_header { position: absolute; top: 0; left: 0; right: 0; z-index: 1; } .c-action_header::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 1px; background-color: #fff; -webkit-transform-origin: center left; -ms-transform-origin: center left; transform-origin: center left; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: -webkit-transform .4s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .4s cubic-bezier(.215, .61, .355, 1); transition: transform .4s cubic-bezier(.215, .61, .355, 1); transition: transform .4s cubic-bezier(.215, .61, .355, 1), -webkit-transform .4s cubic-bezier(.215, .61, .355, 1); } @media (min-width:1200px) { .c-action:hover .c-action_header::before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } } @media (max-width:1199px) { .c-action_header::before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } } [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_header::before { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } @media (min-width:1200px) { .c-action_header { width: calc(100% - 80px); margin: 7.5rem 2.5rem; } } @media (max-width:1199px) { .c-action_header { width: auto; margin: 1.875rem; } } .c-action_header_label { -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); font-family: 'hyg2gjm'; } [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_header_label { opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } .c-action_header_count { margin: 0; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1) .3s; transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1) .3s, -webkit-transform .3s cubic-bezier(.215, .61, .355, 1) .3s; } @media (min-width:1200px) { .c-action_header_count { font-size: 3.75rem; } .c-action:hover .c-action_header_count { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s; } } @media (max-width:1199px) { .c-action_header_count { font-size: 2.8125rem; opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } } [data-transition=BrandTransition] .c-action.is-clicked-link .c-action_header_count { opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition-delay: 0s; transition-delay: 0s; } .c-glitch_slices { position: absolute; top: 0; left: 0; bottom: 0; right: 0; } .c-glitch_content { display: block; opacity: 0; } .c-glitch.is-displayed .c-glitch_content { opacity: 1; } .is-edge .c-glitch_content, .is-trident .c-glitch_content { opacity: 1; } .c-glitch_slice { overflow: hidden; display: none; position: relative; } .c-glitch.is-launched .c-glitch_slice { display: block; } .c-glitch_slice_content { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .c-content-stories { background-color: #000; padding: 7.5rem; margin-top: 7.5rem; color: #fff; } @media (max-width:1399px) { .c-content-stories { padding: 3.75rem; margin-top: 3.75rem; } } @media (max-width:699px) { .c-content-stories { padding: 2.5rem 1.875rem; margin-top: 1.875rem; } } .c-content-stories .slick-list { overflow: visible; } [data-theme=dark] .c-content-stories { padding: 0 7.5rem 7.5rem 7.5rem; } @media (max-width:1399px) { [data-theme=dark] .c-content-stories { padding: 0 3.75rem 3.75rem 3.75rem; } } @media (max-width:699px) { [data-theme=dark] .c-content-stories { padding: 0 1.875rem 2.5rem 1.875rem; } } .c-content-stories_list { position: relative; margin-top: 3.75rem; } @media (max-width:699px) { .c-content-stories_list { margin-top: 1.875rem; } .school .c-content-stories_list { margin-top: 0; } } .c-content-stories_list_item:not(.slick-slide) { position: absolute; width: 50%; top: 0; left: 0; } .c-content-stories_list_item:not(.slick-slide):first-child { position: relative; } .c-content-stories_list_item:nth-child(1) .c-story-card.is-show { -webkit-transition-delay: .5s; transition-delay: .5s; } .c-content-stories_list_item:nth-child(2) .c-story-card.is-show { -webkit-transition-delay: .6s; transition-delay: .6s; } .c-content-stories_list_item:nth-child(3) .c-story-card.is-show { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-content-stories_list_item:nth-child(4) .c-story-card.is-show { -webkit-transition-delay: .8s; transition-delay: .8s; } .c-content-stories_list.-slider .c-content-stories_list_item { padding-right: 3.75rem; } @media (max-width:699px) { .c-content-stories_list.-slider .c-content-stories_list_item { padding-right: 1.875rem; } } .c-content-stories_header_title { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-stories_header_title.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s; } .c-content-stories_header_infos { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-stories_header_infos.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .5s; transition-delay: .5s; } .c-content-stories_controls { margin-top: 1.875rem; } @media (max-width:699px) { .c-content-stories_controls { margin-top: 0; } } .c-content-stories_controls_arrow { padding: 15px; font-family: 'hyg2gjm'; color: #fff; font-weight: bold; font-size: 1rem; } .c-content-block { position: relative; display: block; padding: 0 7.5rem; } .c-content-block.-dark { background-color: #222325; color: #fff; } @media (max-width:1399px) { .c-content-block { padding: 0 3.75rem; } } @media (max-width:699px) { .c-content-block { padding: 0 1.875rem; } } .c-content-intro { padding: 7.5rem; background-color: #f1f1f1; } .c-content-intro.-black { background-color: #000; } .c-content-intro.-offset { margin: 7.5rem 0; padding: 0 0 0 15rem; } @media (max-width:1399px) { .c-content-intro.-offset { margin: 3.75rem 0; padding: 0 0 0 7.5rem; } } @media (max-width:999px) { .c-content-intro.-offset { margin: 3.75rem 0; padding: 0 3.75rem; } } @media (max-width:699px) { .c-content-intro.-offset { margin: 1.875rem 0; padding: 0 1.875rem; } } @media (max-width:1399px) { .c-content-intro { padding: 3.75rem; } } @media (max-width:699px) { .c-content-intro { padding: 1.875rem; } } .c-content-intro_content>* { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-intro.is-show .c-content-intro_content>* { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-content-intro.is-show .c-content-intro_content>:nth-child(1) { -webkit-transition-delay: .38s; transition-delay: .38s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(2) { -webkit-transition-delay: .46s; transition-delay: .46s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(3) { -webkit-transition-delay: .54s; transition-delay: .54s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(4) { -webkit-transition-delay: .62s; transition-delay: .62s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(5) { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(6) { -webkit-transition-delay: .78s; transition-delay: .78s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(7) { -webkit-transition-delay: .86s; transition-delay: .86s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(8) { -webkit-transition-delay: .94s; transition-delay: .94s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(9) { -webkit-transition-delay: 1.02s; transition-delay: 1.02s; } .c-content-intro.is-show .c-content-intro_content>:nth-child(10) { -webkit-transition-delay: 1.1s; transition-delay: 1.1s; } .c-content-intro_logo { display: block; margin: 0 auto; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-intro.is-show .c-content-intro_logo { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .6s; transition-delay: .6s; } @media (max-width:999px) { .c-content-intro_logo { margin-top: 1.875rem; } } .c-content-tagline { text-align: center; } .c-content-tagline::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 200px; background-color: #f1f1f1; z-index: -1; } .c-content-tagline_value { margin: 0 7.5rem; line-height: 1.1; } @media (min-width:1400px) { .c-content-tagline_value { font-size: 6.25rem; } } @media (max-width:1399px) { .c-content-tagline_value { font-size: 5rem; } } @media (max-width:1199px) { .c-content-tagline_value { font-size: 3.75rem; } } @media (max-width:999px) { .c-content-tagline_value { margin: 0; } } @media (max-width:699px) { .c-content-tagline_value { font-size: 2.8125rem; } } .c-content-tagline_value_line { display: block; margin-bottom: 1.875rem; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-tagline.is-show .c-content-tagline_value_line { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(1) { -webkit-transition-delay: .5s; transition-delay: .5s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(2) { -webkit-transition-delay: .6s; transition-delay: .6s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(3) { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(4) { -webkit-transition-delay: .8s; transition-delay: .8s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(5) { -webkit-transition-delay: .9s; transition-delay: .9s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(6) { -webkit-transition-delay: 1s; transition-delay: 1s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(7) { -webkit-transition-delay: 1.1s; transition-delay: 1.1s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(8) { -webkit-transition-delay: 1.2s; transition-delay: 1.2s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(9) { -webkit-transition-delay: 1.3s; transition-delay: 1.3s; } .c-content-tagline.is-show .c-content-tagline_value_line:nth-child(10) { -webkit-transition-delay: 1.4s; transition-delay: 1.4s; } .c-content-tagline_value_line_inner { display: inline-block; } .c-content-tagline_value_line_inner::after { content: ""; display: block; width: 100%; height: 8px; background-color: #000; } @media (max-width:1199px) { .c-content-tagline_value_line_inner::after { height: 6px; } } .c-content-app { padding: 7.5rem; } @media (max-width:1399px) { .c-content-app { padding: 3.75rem; } } @media (max-width:699px) { .c-content-app { padding: 1.875rem; } } .c-content-intro_image { display: block; margin: 0 auto; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-app_inner.is-show .c-content-intro_image { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .6s; transition-delay: .6s; } .c-content-app_content>* { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-app_inner.is-show .c-content-app_content>* { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(1) { -webkit-transition-delay: .38s; transition-delay: .38s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(2) { -webkit-transition-delay: .46s; transition-delay: .46s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(3) { -webkit-transition-delay: .54s; transition-delay: .54s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(4) { -webkit-transition-delay: .62s; transition-delay: .62s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(5) { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(6) { -webkit-transition-delay: .78s; transition-delay: .78s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(7) { -webkit-transition-delay: .86s; transition-delay: .86s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(8) { -webkit-transition-delay: .94s; transition-delay: .94s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(9) { -webkit-transition-delay: 1.02s; transition-delay: 1.02s; } .c-content-app_inner.is-show .c-content-app_content>:nth-child(10) { -webkit-transition-delay: 1.1s; transition-delay: 1.1s; } .c-content-app_buttons { margin: 3.75rem 0; } @media (max-width:999px) { .c-content-app_buttons_item { margin-bottom: 1.25rem; } } .c-content-column { padding: 7.5rem; } @media (max-width:1399px) { .c-content-column { padding: 3.75rem 7.5rem; } } @media (max-width:1199px) { .c-content-column { padding: 3.75rem; } } @media (max-width:699px) { .c-content-column { padding: 1.875rem; } } .c-content-column.-offset { padding: 7.5rem 0 7.5rem 7.5rem; } @media (max-width:1399px) { .c-content-column.-offset { padding: 3.75rem 0 3.75rem 7.5rem; } } @media (max-width:1199px) { .c-content-column.-offset { padding: 3.75rem 0 3.75rem 3.75rem; } } @media (max-width:999px) { .c-content-column.-offset { padding: 3.75rem; } } @media (max-width:699px) { .c-content-column.-offset { padding: 1.875rem; } } .c-content-column_content>* { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-column_inner.is-show .c-content-column_content>* { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(1) { -webkit-transition-delay: .38s; transition-delay: .38s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(2) { -webkit-transition-delay: .46s; transition-delay: .46s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(3) { -webkit-transition-delay: .54s; transition-delay: .54s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(4) { -webkit-transition-delay: .62s; transition-delay: .62s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(5) { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(6) { -webkit-transition-delay: .78s; transition-delay: .78s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(7) { -webkit-transition-delay: .86s; transition-delay: .86s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(8) { -webkit-transition-delay: .94s; transition-delay: .94s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(9) { -webkit-transition-delay: 1.02s; transition-delay: 1.02s; } .c-content-column_inner.is-show .c-content-column_content>:nth-child(10) { -webkit-transition-delay: 1.1s; transition-delay: 1.1s; } .c-content-video { display: block; position: relative; margin: 7.5rem; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-video.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } @media (max-width:1399px) { .c-content-video { margin: 3.75rem; } } @media (max-width:699px) { .c-content-video { margin: 1.875rem; } } .c-content-video_full .o-container { margin: 0; max-width: 100%; } .c-content-video_full .c-content-video { padding: 0; margin: 0; } .c-content-video_inner:hover { cursor: pointer; } .c-content-video_button { position: absolute; top: 50%; left: 50%; z-index: 3; width: 60px; height: 60px; border-radius: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 1; -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1); } .c-content-video.is-playing .c-content-video_button { opacity: 0; } .c-content-video_button svg { fill: #fff; display: block; width: 100%; height: 100%; -webkit-transition: fill .3s cubic-bezier(.215, .61, .355, 1); transition: fill .3s cubic-bezier(.215, .61, .355, 1); } .c-content-video_inner:hover .c-content-video_button svg { fill: #496df1; } .c-content-video_background { position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-size: cover; } .c-content-video_background::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: #000; opacity: .4; -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1); } .c-content-video_inner:hover .c-content-video_background::after { opacity: .2; } .c-content-text { margin: 7.5rem 0; } .c-header-section+.c-content-text { background-color: #f1f1f1; padding: 7.5rem; margin: 0; } @media (max-width:1399px) { .c-header-section+.c-content-text { padding: 3.75rem 7.5rem; } } @media (max-width:1199px) { .c-header-section+.c-content-text { padding: 3.75rem; } } @media (max-width:699px) { .c-header-section+.c-content-text { padding: 1.875rem; } } @media (max-width:1399px) { .c-content-text { margin: 3.75rem 0; } } @media (max-width:699px) { .c-content-text { margin: 1.875rem 0; } } .c-content-text.o-wysiwyg>* { font-size: 1.5rem; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); line-height: 2; } .c-content-text.o-wysiwyg>:first-child { margin-top: 0; } @media (max-width:699px) { .c-content-text.o-wysiwyg>* { font-size: 1rem; line-height: 1.8; } } .c-content-text.o-wysiwyg.is-show>* { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-content-text.o-wysiwyg.is-show>:nth-child(1) { -webkit-transition-delay: .38s; transition-delay: .38s; } .c-content-text.o-wysiwyg.is-show>:nth-child(2) { -webkit-transition-delay: .46s; transition-delay: .46s; } .c-content-text.o-wysiwyg.is-show>:nth-child(3) { -webkit-transition-delay: .54s; transition-delay: .54s; } .c-content-text.o-wysiwyg.is-show>:nth-child(4) { -webkit-transition-delay: .62s; transition-delay: .62s; } .c-content-text.o-wysiwyg.is-show>:nth-child(5) { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-content-text.o-wysiwyg.is-show>:nth-child(6) { -webkit-transition-delay: .78s; transition-delay: .78s; } .c-content-text.o-wysiwyg.is-show>:nth-child(7) { -webkit-transition-delay: .86s; transition-delay: .86s; } .c-content-text.o-wysiwyg.is-show>:nth-child(8) { -webkit-transition-delay: .94s; transition-delay: .94s; } .c-content-text.o-wysiwyg.is-show>:nth-child(9) { -webkit-transition-delay: 1.02s; transition-delay: 1.02s; } .c-content-text.o-wysiwyg.is-show>:nth-child(10) { -webkit-transition-delay: 1.1s; transition-delay: 1.1s; } .c-content-text.o-wysiwyg a { display: inline; text-decoration: none; -webkit-transition: background-position cubic-bezier(.215, .61, .355, 1) .2s; transition: background-position cubic-bezier(.215, .61, .355, 1) .2s; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 60, 255, .23)), to(rgba(0, 60, 255, .23))); background-image: linear-gradient(to bottom, rgba(0, 60, 255, .23) 0, rgba(0, 60, 255, .23) 100%); background-size: 100%; background-repeat: no-repeat; background-position: 0 1em; } .c-content-text.o-wysiwyg a:hover { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 60, 255, .23)), to(rgba(0, 60, 255, .23))); background-image: linear-gradient(to bottom, rgba(0, 60, 255, .23) 0, rgba(0, 60, 255, .23) 100%); background-position: 0 0; } .c-content-quote { padding-bottom: 7.5rem; text-align: center; } .c-content-quote::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 200px; background-color: #f1f1f1; z-index: -1; } @media (max-width:1399px) { .c-content-quote { padding-bottom: 3.75rem; } } @media (max-width:699px) { .c-content-quote { padding-bottom: 1.875rem; } } .c-content-quote_value { display: inline; border-bottom: 8px solid #000; line-height: 1.1; } .c-content-quote_value::before { content: """; display: block; border: 0; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-quote_value.is-show::before { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s; } @media (min-width:1400px) { .c-content-quote_value { font-size: 6.25rem; } } @media (max-width:1399px) { .c-content-quote_value { font-size: 5rem; } } @media (max-width:1199px) { .c-content-quote_value { font-size: 3.75rem; border-bottom: 6px solid #000; } } @media (max-width:999px) { .c-content-quote_value { line-height: 1.2; } } @media (max-width:699px) { .c-content-quote_value { font-size: 2.8125rem; } } .c-content-gallery { margin: 7.5rem; } @media (max-width:1399px) { .c-content-gallery { margin: 3.75rem; } } @media (max-width:699px) { .c-content-gallery { margin: 1.875rem; } } @media (min-width:1400px) { .c-content-gallery_header { margin-bottom: 3.75rem; } } @media (min-width:1000px) and (max-width:1399px) { .c-content-gallery_header { margin-bottom: 2.5rem; } } @media (min-width:700px) and (max-width:999px) { .c-content-gallery_header { margin-bottom: 1.875rem; } } @media (max-width:699px) { .c-content-gallery_header { margin-bottom: .9375rem; } } .c-content-gallery_title { margin: 0; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-gallery_title.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s; } .c-content-gallery_title sup { top: -1.25rem; margin-left: -4px; font-weight: 400; font-size: 1.125rem; } @media (max-width:699px) { .c-content-gallery_title h3 { margin-bottom: 1.25rem; } } .c-content-gallery_intro { font-size: .875rem; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-content-gallery_intro.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .5s; transition-delay: .5s; } .c-content-gallery_grid { width: 100%; } .c-content-gallery_grid_col { height: 100%; vertical-align: middle; } .c-content-gallery_grid_item { position: relative; background-color: #edeaea; } .c-content-gallery_grid_item::before { content: ""; display: block; padding-bottom: 100%; } .c-content-gallery_grid_item::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; opacity: 0; background-color: rgba(0, 0, 0, .3); -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1); } @media (min-width:1200px) { .c-content-gallery_grid_item:hover::after { opacity: 1; } } @media (max-width:699px) { .c-content-gallery_grid_item { margin-top: 10px; } } .c-content-gallery_grid_image { position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-size: cover; background-position: center center; } .c-content-gallery_grid_image img { opacity: 0; position: absolute; pointer-events: none; } .c-content-gallery_grid_item_zoom { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 3; width: 2.3125rem; height: 2.3125rem; padding: .75rem; } .c-content-gallery_grid_item_zoom_icon { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) scale(0); -ms-transform: translate(-50%, -50%) scale(0); transform: translate(-50%, -50%) scale(0); -webkit-transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); transition: transform .3s cubic-bezier(.645, .045, .355, 1); transition: transform .3s cubic-bezier(.645, .045, .355, 1), -webkit-transform .3s cubic-bezier(.645, .045, .355, 1); } .c-content-gallery_grid_item_zoom_icon svg { display: block; width: 1.25rem; height: 1.25rem; fill: #fff; } @media (min-width:1200px) { .c-content-gallery_grid_item:hover .c-content-gallery_grid_item_zoom_icon { -webkit-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); -webkit-transition-delay: .1s; transition-delay: .1s; } } .c-brand-articles { background-color: #f1f1f1; } .c-brand-articles_background img { display: block; width: 100%; } .c-brand-articles_list { margin-top: -15rem; } @media (max-width:999px) { .c-brand-articles_list { margin-top: -7.5rem; } } .c-brand-articles_link { text-align: center; display: block; margin: 3.75rem 0; font-size: 1.875rem; text-decoration: underline; color: #000; } .c-brand-articles_link:hover { color: #000; opacity: .6; } .c-brand-articles_link svg { display: block; margin: auto; fill: #000; width: 70px; height: 70px; } .c-brand-stat { padding: 3.75rem 7.5rem; text-align: center; background-color: #f1f1f1; } @media (max-width:1399px) { .c-brand-stat { padding: 3.75rem; } } @media (max-width:699px) { .c-brand-stat { padding: 1.875rem; } } .c-brand-stat_value { font-weight: 700; line-height: 1.1; margin: 0; position: relative; } @media (min-width:1400px) { .c-brand-stat_value { font-size: 8.125rem; } } @media (max-width:1399px) { .c-brand-stat_value { font-size: 6.25rem; } } @media (max-width:999px) { .c-brand-stat_value { font-size: 3.75rem; } } .c-brand-stat_label { text-decoration: underline; opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-brand-stat_label.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } @media (min-width:1400px) { .c-brand-stat_label { font-size: 1.5rem; } } @media (max-width:1399px) { .c-brand-stat_label { font-size: 1.25rem; margin: 0; } } .c-brand-nav { position: fixed; right: 0; z-index: 10; padding: 1.25rem 1.875rem .625rem 1.875rem; text-align: center; } @media (min-width:1400px) { .c-brand-nav { width: 13.75rem; } } @media (min-width:1200px) and (max-width:1399px) { .c-brand-nav { width: 11.25rem; } } @media (min-width:1200px) { .c-brand-nav { bottom: 7.5rem; } } @media (max-width:1199px) { .c-brand-nav { width: 8.75rem; bottom: 5.625rem; } } @media (min-width:1000px) { .c-brand-nav.-mobile { display: none; } } @media (max-width:999px) { .c-brand-nav { bottom: 0; left: 0; padding: 0; width: 100%; background-color: #fff; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-brand-nav { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 2.9s; transition-delay: 2.9s; } [data-transition=BetweenBrandsTransition] .c-brand-nav { -webkit-transform: none; -ms-transform: none; transform: none; } .dom-is-animated .c-brand-nav { -webkit-transition-delay: 0s; transition-delay: 0s; } [data-way=down] .c-brand-nav { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } .c-brand-nav.-desktop { display: none; } } .c-brand-nav_count { position: relative; white-space: nowrap; -webkit-transform: rotate(-90deg) translate3d(0, 150%, 0); transform: rotate(-90deg) translate3d(0, 150%, 0); -webkit-transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-brand-nav_count { -webkit-transform: rotate(-90deg) translate3d(0, 0, 0); transform: rotate(-90deg) translate3d(0, 0, 0); -webkit-transition-delay: 1s; transition-delay: 1s; } [data-transition=BetweenBrandsTransition] .c-brand-nav_count { -webkit-transform: rotate(-90deg) translate3d(0, 0, 0); transform: rotate(-90deg) translate3d(0, 0, 0); } .c-brand-nav_count_value_wrapper { font-weight: 700; font-size: 6.25rem; display: inline-block; line-height: 1; } .c-brand-nav_count_value_wrapper span { font-size: 3.75rem; } @media (max-width:1199px) { .c-brand-nav_count_value_wrapper { font-size: 5rem; } } .c-brand-nav_count_value { display: inline-block; margin: 0; opacity: 1; -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1), transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } [data-transition=BetweenBrandsTransition] .c-brand-nav_count_value { -webkit-transform: translateY(-20%); -ms-transform: translateY(-20%); transform: translateY(-20%); opacity: 0; } .c-brand-nav_count_base { font-size: 1.375rem; display: inline-block; vertical-align: top; margin-left: -.125rem; margin-top: .375rem; font-weight: bold; color: #000; } .c-brand-nav_bullets { margin-top: 1.875rem; text-align: left; } @media (max-width:1199px) { .c-brand-nav_bullets { margin-top: .9375rem; } } .c-brand-nav_bullets_item { display: inline-block; padding: 0 .3125rem; width: 10px; height: 20px; position: relative; } .c-brand-nav_bullets_item::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 1px; height: 10px; -webkit-transform-origin: center bottom; -ms-transform-origin: center bottom; transform-origin: center bottom; background-color: #d6d6d6; -webkit-transition: background-color .3s cubic-bezier(.215, .61, .355, 1), height .3s cubic-bezier(.215, .61, .355, 1); transition: background-color .3s cubic-bezier(.215, .61, .355, 1), height .3s cubic-bezier(.215, .61, .355, 1); } .c-brand-nav_bullets_item.is-active::after, .c-brand-nav_bullets_item:hover::after { background-color: #000; height: 20px; } .c-brand-nav_controls { margin-top: 1.875rem; border-top: 1px solid #d6d6d6; border-bottom: 1px solid #d6d6d6; } @media (min-width:1000px) { .c-brand-nav_controls { -webkit-transform: translateX(150%); -ms-transform: translateX(150%); transform: translateX(150%); -webkit-transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-brand-nav_controls { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1.2s; transition-delay: 1.2s; } [data-transition=BetweenBrandsTransition] .c-brand-nav_controls { -webkit-transform: none; -ms-transform: none; transform: none; } } @media (max-width:999px) { .c-brand-nav_controls { margin: 0; } } .c-brand-nav_arrow { display: inline-block; padding: 15px; position: relative; font-family: "hyg2gjm"; font-weight: bold; } .c-brand-nav_arrow:first-child { border-right: 1px solid #d6d6d6; } .c-brand-nav_arrow:first-child::before { -webkit-transform-origin: center right; -ms-transform-origin: center right; transform-origin: center right; } .c-brand-nav_arrow svg { display: block; margin: 12px auto; width: 12px; height: 12px; fill: #000; } @media (max-width:1199px) { .c-brand-nav_arrow svg { margin: 5px auto; } } .c-brand-nav_arrow::before { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: #f1f1f1; z-index: -1; -webkit-transform-origin: center left; -ms-transform-origin: center left; transform-origin: center left; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } .c-brand-nav_arrow:hover::before { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } @media (max-width:999px) { .c-brand-nav_arrow { padding: 5px 15px; } .c-brand-nav_arrow:nth-child(3) { border-left: 1px solid #d6d6d6; } } .c-brand-nav_button { position: relative; padding: 1.25rem 0 1.25rem 0; -webkit-transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } @media (min-width:700px) { .c-brand-nav_button { -webkit-transform: translateX(150%); -ms-transform: translateX(150%); transform: translateX(150%); } } @media (max-width:999px) { .c-brand-nav_button { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } } .dom-is-loaded .c-brand-nav_button { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1.4s; transition-delay: 1.4s; } [data-transition=BetweenBrandsTransition] .c-brand-nav_button { -webkit-transform: none; -ms-transform: none; transform: none; } .c-brand-nav_button svg { display: block; margin: 0 auto; width: 20px; height: 20px; } .c-brand-nav_button::before { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: #f1f1f1; z-index: -1; -webkit-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); -webkit-transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } .c-brand-nav_button:hover::before { -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); } @media (min-width:1000px) { .c-brand-nav_button { display: block; } } @media (max-width:999px) { .c-brand-nav_button { padding: 2.125rem .9375rem; } } @media (max-width:699px) { .c-brand-nav_button { padding: 1.5rem .9375rem; } } .c-brands-list { border-top: 1px solid #ffffff; background-color: #efefef; } .c-brands-list_item { position: relative; padding: 1.25rem; border: 1px solid transparent; border-bottom: 1px solid #ffffff; color: #000; background-color: transparent; -webkit-transition: color .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1); transition: color .3s cubic-bezier(.215, .61, .355, 1), background-color .3s cubic-bezier(.215, .61, .355, 1); } .c-brands-list_item.is-active { color: #bbb; background-color: #efefef; } .c-brands-list_item:hover { background-color: #656270; color: #fff; } .c-brands-list_item::before { content: ""; display: block; padding-bottom: 100%; } @media (min-width:1000px) { .c-brands-list_item:nth-child(3n+1), .c-brands-list_item:nth-child(3n+2) { border-right: 1px solid #ffffff; } } @media (max-width:999px) { .c-brands-list_item:nth-child(odd) { border-right: 1px solid #ffffff; } } .c-brands-list_logo { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-width: 60%; max-height: 60%; } .c-brands-list_text { margin: 1.25rem; } @media (max-width:699px) { .c-brands-list_text { margin: .625rem; font-size: 0.75rem; } } .c-brands-list_link { position: absolute; bottom: 0; left: 0; font-family: 'hyg2gjm'; } .c-brands-list_count { position: absolute; top: 0; right: 0; } .c-story-card { display: block; position: relative; z-index: 1; opacity: 0; -webkit-transform: translateY(120px); -ms-transform: translateY(120px); transform: translateY(120px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-story-card.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-story-card.is-show:nth-child(1) { -webkit-transition-delay: .38s; transition-delay: .38s; } .c-story-card.is-show:nth-child(2) { -webkit-transition-delay: .46s; transition-delay: .46s; } .c-story-card.is-show:nth-child(3) { -webkit-transition-delay: .54s; transition-delay: .54s; } .c-story-card.is-show:nth-child(4) { -webkit-transition-delay: .62s; transition-delay: .62s; } .c-story-card::before { content: ""; background-color: #222325; position: absolute; top: 1px; bottom: 1px; right: 1px; left: 1px; z-index: -1; -webkit-transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1); transition: transform .3s cubic-bezier(.215, .61, .355, 1), -webkit-transform .3s cubic-bezier(.215, .61, .355, 1); } .c-content-stories .c-story-card::before { background-color: #ef8200; } @media (min-width:1200px) { .c-story-card:hover::before { -webkit-transform: translate(12px, 12px); -ms-transform: translate(12px, 12px); transform: translate(12px, 12px); } } @media (max-width:999px) { .c-story-card { margin-bottom: 1.875rem; } } .c-story-card_inner { background-color: #fff; padding: 1.875rem; } .c-story-card_date { display: block; text-transform: uppercase; margin-bottom: 1.875rem; } .c-brand-articles .c-story-card_date { display: none; } .c-story-card_image img { width: 100%; display: block; box-shadow: 0 0 3.2rem rgba(0, 0, 0, 0.07); } .c-story-card_title { margin-right: 1.875rem; margin-bottom: 3.75rem; } @media (max-width:1399px) { .c-story-card_title { margin-bottom: 1.875rem; } } @media (max-width:699px) { .c-story-card_title { margin-bottom: .9375rem; } } .c-story-card_title br { display: none; } .c-story-mini { display: block; padding: 1.38rem 1.55rem; -webkit-transition: background-color .3s cubic-bezier(.215, .61, .355, 1); transition: background-color .3s cubic-bezier(.215, .61, .355, 1); } .c-story-mini:hover { background-color: #efefef; } @media (max-width:1199px) { .c-story-mini { padding: 1.25rem; } } .c-story-mini_date { margin-bottom: .625rem; font-size: .625rem; text-transform: uppercase; font-family: 'hyg2gjm'; } .c-story-mini_title { font-size: .8889rem; margin-top: .625rem; margin-bottom: 0; text-align: center; } .c-news-list_wrapper .c-story-mini_date { margin-bottom: .3125rem; font-size: .7778rem; font-weight: bold; display: block; } .c-news-list_wrapper .c-story-mini_title { font-size: .7778rem; margin-top: .625rem; margin-bottom: 0; text-align: left; } @media (max-width:1199px) { .c-story-mini_title { line-height: 1.3; } } .c-story-mini_title br { display: none; } .c-stories-list_wrapper { position: fixed; top: 0; right: 0; z-index: 10; overflow: hidden; } @media (min-width:1400px) { .c-stories-list_wrapper { width: 13.75rem; } } @media (min-width:1200px) and (max-width:1399px) { .c-stories-list_wrapper { width: 11.25rem; } } @media (min-width:1200px) { .c-stories-list_wrapper { top: 7.5rem; bottom: 7.5rem; } } @media (max-width:1199px) { .c-stories-list_wrapper { width: 8.75rem; top: 5.625rem; bottom: 5.625rem; } } @media (min-width:1000px) { .c-stories-list_wrapper { border-top: 1px solid #efefef; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); -webkit-transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-stories-list_wrapper { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1s; transition-delay: 1s; } html:not(.has-smooth-scroll) .c-stories-list_wrapper { overflow-y: scroll; -webkit-overflow-scrolling: touch; } } @media (max-width:999px) { .c-stories-list_wrapper { -webkit-transition: z-index 0s .6s; transition: z-index 0s .6s; z-index: 1; } .stories-list-open .c-stories-list_wrapper { z-index: 900; -webkit-transition-delay: 0s; transition-delay: 0s; } } .c-stories-list { margin: 0; padding: 0; } @media (max-width:999px) { .c-stories-list { position: fixed; top: 0; bottom: 0; right: 0; left: 50%; background-color: #fff; z-index: 5; overflow-y: scroll; -webkit-overflow-scrolling: touch; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); visibility: hidden; -webkit-transition: visibility 0s .6s, -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: visibility 0s .6s, -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), visibility 0s .6s; transition: transform .6s cubic-bezier(.215, .61, .355, 1), visibility 0s .6s, -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .stories-list-open .c-stories-list { -webkit-transform: none; -ms-transform: none; transform: none; visibility: visible; -webkit-transition-delay: 0s; transition-delay: 0s; } } @media (max-width:699px) { .c-stories-list { left: 30%; } } .c-stories-list_item { display: block; } .c-stories_button { position: fixed; bottom: 0; left: 0; text-align: left; width: 100%; background-color: #fff; border-top: 1px solid #d6d6d6; font-size: .875rem; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); -webkit-transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1); transition: transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-stories_button { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 2.9s; transition-delay: 2.9s; } .dom-is-animated .c-stories_button { -webkit-transition-delay: 0s; transition-delay: 0s; } [data-way=down] .c-stories_button { -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); } @media (min-width:1000px) { .c-stories_button { display: none; } } @media (min-width:700px) { .c-stories_button { padding: 2.25rem 1.875rem; } } @media (max-width:699px) { .c-stories_button { padding: 1.59375rem 1.875rem; } } .c-stories_button .more_case { display: inline-block; width: 15px; height: 15px; margin-right: 15px; fill: #000; } .c-stories-list_background { position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: 2; background-color: rgba(0, 0, 0, .3); opacity: 0; visibility: hidden; -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1), visibility 0s .6s; transition: opacity .3s cubic-bezier(.215, .61, .355, 1), visibility 0s .6s; } .stories-list-open .c-stories-list_background { opacity: 1; visibility: visible; -webkit-transition-delay: 0s; transition-delay: 0s; } @media (min-width:1000px) { .c-stories-list_background { display: none; } } .c-popup-video { position: fixed; top: 0; right: 0; left: 0; height: 0; -webkit-transition: height 0s 1s; transition: height 0s 1s; z-index: 1000; overflow: hidden; } .c-popup-video::before { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: -2; background-color: #000; opacity: 0; -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .4s; transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .4s; } .popup-video-is-open .c-popup-video { height: 100%; -webkit-transition-delay: 0s; transition-delay: 0s; } .popup-video-is-open .c-popup-video::before { opacity: 1; } .c-popup-video_inner { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); margin: auto; } .c-popup-video_inner iframe { opacity: 0; -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1); } .popup-video-is-open .c-popup-video_inner iframe { opacity: 1; -webkit-transition-delay: 2s; transition-delay: 2s; } @media (min-width:1000px) { .c-popup-video_inner { width: 66.6666666667%; } } @media (max-width:999px) { .c-popup-video_inner { width: 83.3333333333%; } } .c-popup-video_embed { opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .popup-video-is-open .c-popup-video_embed { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1s; transition-delay: 1s; } .c-popup-video_close { position: absolute; width: 20px; height: 20px; top: 1.875rem; right: 1.875rem; -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); -webkit-transition: -webkit-transform .3s cubic-bezier(.55, .055, .675, .19); transition: -webkit-transform .3s cubic-bezier(.55, .055, .675, .19); transition: transform .3s cubic-bezier(.55, .055, .675, .19); transition: transform .3s cubic-bezier(.55, .055, .675, .19), -webkit-transform .3s cubic-bezier(.55, .055, .675, .19); } .c-popup-video_close svg { display: block; width: 100%; height: 100%; fill: #fff; } .popup-video-is-open .c-popup-video_close { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s; } .c-popup-gallery { position: fixed; top: 0; right: 0; left: 0; height: 0; -webkit-transition: height 0s 1s; transition: height 0s 1s; z-index: 1000; overflow: hidden; } .c-popup-gallery::before { content: ""; position: fixed; top: 0; bottom: 0; right: 0; left: 0; z-index: -2; background-color: #fff; opacity: 0; visibility: hidden; -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .4s, visibility 0s 1s; transition: opacity .6s cubic-bezier(.215, .61, .355, 1) .4s, visibility 0s 1s; } .popup-gallery-is-open .c-popup-gallery { height: 100%; -webkit-transition-delay: 0s; transition-delay: 0s; } .popup-gallery-is-open .c-popup-gallery::before { opacity: 1; visibility: visible; -webkit-transition-delay: 0s, 0s; transition-delay: 0s, 0s; } .c-popup-gallery_inner { position: relative; margin: auto; padding-bottom: 3.75rem; opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .popup-gallery-is-open .c-popup-gallery_inner { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1s; transition-delay: 1s; } .c-popup-gallery_close { position: fixed; top: 1.875rem; right: 1.875rem; width: 20px; height: 20px; z-index: 10; -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); -webkit-transition: -webkit-transform .3s cubic-bezier(.55, .055, .675, .19); transition: -webkit-transform .3s cubic-bezier(.55, .055, .675, .19); transition: transform .3s cubic-bezier(.55, .055, .675, .19); transition: transform .3s cubic-bezier(.55, .055, .675, .19), -webkit-transform .3s cubic-bezier(.55, .055, .675, .19); } .c-popup-gallery_close svg { display: block; width: 100%; height: 100%; fill: #000; } .popup-gallery-is-open .c-popup-gallery_close { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s; } @media (max-width:999px) { .c-popup-gallery_close { top: 1.875rem; right: 1.875rem; } .popup-gallery-is-open .c-popup-gallery_close { -webkit-transform: translate(50%, 0); -ms-transform: translate(50%, 0); transform: translate(50%, 0); } } .c-popup-gallery_content { color: #000; margin: 3.75rem 0; width: calc(1 * 100vw / 6); font-size: .6875rem; } @media (min-width:1400px) { .c-popup-gallery_content { margin: 1.875rem 0 1.875rem calc(1 * 100vw / 6); } } @media (min-width:1000px) and (max-width:1399px) { .c-popup-gallery_content { margin: 1.875rem 0 1.875rem calc(1 * 100vw / 6); } } @media (min-width:1000px) { .c-popup-gallery_content { width: calc(1 * 100vw / 6); } } @media (max-width:999px) { .c-popup-gallery_content { width: 50%; margin: .9375rem 0 1.875rem 1.875rem; } } .c-popup-gallery_logo { position: fixed; top: 1.875rem; left: 1.875rem; z-index: 10; width: 3.75rem; height: 3.75rem; -webkit-transform: translateY(-200%); -ms-transform: translateY(-200%); transform: translateY(-200%); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-popup-gallery_logo svg { display: block; width: 100%; height: 100%; } .popup-gallery-is-open .c-popup-gallery_logo { -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1s; transition-delay: 1s; } @media (max-width:699px) { .c-popup-gallery_logo { display: none; } } .c-popup-gallery-slider_item_scroll { height: 100vh; } html:not(.has-smooth-scroll) .c-popup-gallery-slider_item_scroll { -webkit-overflow-scrolling: touch; overflow-y: scroll; } .c-popup-gallery_image img { display: block; margin: auto; } @media (min-width:1000px) { .c-popup-gallery_image { padding-top: 3.75rem; margin: 0 16.6666666667%; } } @media (max-width:999px) { .c-popup-gallery_image { padding-top: 7.5rem; margin: 0 1.875rem; } } .c-popup-gallery_arrow { position: absolute; top: 50vh; border-radius: 50%; z-index: 20; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .c-popup-gallery_arrow svg { display: block; fill: #000; -webkit-transition: fill .3s cubic-bezier(.215, .61, .355, 1); transition: fill .3s cubic-bezier(.215, .61, .355, 1); } @media (min-width:1200px) { .c-popup-gallery_arrow:hover svg { fill: #496df1; } } @media (min-width:1000px) { .c-popup-gallery_arrow { padding: 20px; } .c-popup-gallery_arrow.-prev { left: 1.875rem; } .c-popup-gallery_arrow.-next { right: 1.875rem; } .c-popup-gallery_arrow svg { width: 16px; height: 16px; } } @media (max-width:999px) { .c-popup-gallery_arrow { padding: 10px; } .c-popup-gallery_arrow.-prev { left: .9375rem; } .c-popup-gallery_arrow.-next { right: .9375rem; } .c-popup-gallery_arrow svg { width: 10px; height: 10px; } } @media (max-width:1399px) { .c-popup-gallery_arrow { display: none; } } .c-popup-gallery_infos { position: absolute; top: 25vh; left: 0; z-index: 20; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: calc(1 * 100vw / 6); padding-left: 1.875rem; } @media (max-width:999px) { .c-popup-gallery_infos { display: none; } } .c-popup-gallery_title { margin-bottom: 0; margin-bottom: 1.875rem; } .c-popup-gallery_count { font-size: .9375rem; letter-spacing: 1px; } .c-jobs_wrapper { min-height: 100vh; padding: 0 15rem 7.5rem 7.5rem; } @media (max-width:1399px) { .c-jobs_wrapper { padding: 0 11.25rem 3.75rem 3.75rem; } } @media (max-width:999px) { .c-jobs_wrapper { padding: 0 3.75rem 3.75rem 3.75rem; } } @media (max-width:699px) { .c-jobs_wrapper { padding: 0 1.875rem 1.875rem 1.875rem; } } .c-jobs_header { padding: 2.5rem 0; } .c-jobs_header_item { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-jobs_header_item { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .dom-is-loaded .c-jobs_header_item:nth-child(1) { -webkit-transition-delay: .3s; transition-delay: .3s; } .dom-is-loaded .c-jobs_header_item:nth-child(2) { -webkit-transition-delay: .4s; transition-delay: .4s; } @media (max-width:699px) { .c-jobs_header_item { font-size: .75rem; } } .c-jobs_list { margin: 7.5rem 0 0 0; padding: 0; } @media (max-width:1399px) { .c-jobs_list { margin: 1.875rem 0 0 0; } } @media (max-width:699px) { .c-jobs_list { margin: .9375rem 0 0 0; } } .c-jobs_list_item { display: block; position: relative; } .c-jobs_list_item a { display: block; padding: 1.875rem 0 1.875rem 0; line-height: 1; border-bottom: 1px solid transparent; -webkit-transition: border .3s cubic-bezier(.215, .61, .355, 1), color .3s cubic-bezier(.215, .61, .355, 1); transition: border .3s cubic-bezier(.215, .61, .355, 1), color .3s cubic-bezier(.215, .61, .355, 1); } .c-jobs_list_item a:hover { color: #496df1; border-color: #496df1; } .dom-is-loaded .c-jobs_list_item a { border-color: #222325; -webkit-transition-delay: .8s; transition-delay: .8s; } .dom-is-animated .c-jobs_list_item a { -webkit-transition-delay: 0s; transition-delay: 0s; } @media (max-width:699px) { .c-jobs_list_item a { padding: 1.25rem 0 1.25rem 0; } } .c-jobs_list_item:nth-child(2) a { border-top: 1px solid #222325; } .c-jobs_list_title { font-size: 2.625rem; font-weight: 700; display: block; position: relative; padding-right: 2.5rem; opacity: 0; -webkit-transform: translateX(100px); -ms-transform: translateX(100px); transform: translateX(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-animated .c-jobs_list_item.is-show .c-jobs_list_title { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .4s; transition-delay: .4s; } @media (max-width:699px) { .c-jobs_list_title { font-size: 1.375rem; } } .c-jobs_list_category { display: block; margin-bottom: 1.25rem; opacity: 0; -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-animated .c-jobs_list_category.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .3s; transition-delay: .3s; } @media (max-width:699px) { .c-jobs_list_category { font-size: .75rem; } } .c-jobs_departments { margin-bottom: 1.875rem; margin-top: 7.5rem; } .c-jobs_departments:first-child { margin-top: 0; } @media (max-width:999px) { .c-jobs_departments { margin-top: 3.75rem; margin-bottom: 1.875rem; } } .c-jobs_list_arrow { position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .c-jobs_list_arrow svg { display: block; width: 30px; height: 30px; } .c-contact { padding: 7.5rem; } .join_bg .c-contact { padding: 0; } @media (max-width:1399px) { .c-contact, .join_bg .c-contact { padding: 3.75rem; } } @media (max-width:999px) { .c-contact, .join_bg .c-contact { padding: 3.75rem; } } @media (max-width:699px) { .c-contact, .join_bg .c-contact { padding: 1.875rem; } } .c-contact_phone { position: absolute; top: 0; right: 0; text-align: center; font-size: 0; padding: 0 .9375rem; opacity: 0; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-contact_phone::before { display: inline-block; height: 100%; content: ""; vertical-align: middle; } .c-contact_phone>* { display: inline-block; vertical-align: middle; font-size: 1rem; } .dom-is-loaded .c-contact_phone { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: 1s; transition-delay: 1s; } .c-contact_phone svg { width: 20px; height: 20px; display: inline-block; margin-right: .9375rem; } @media (min-width:1400px) { .c-contact_phone { min-width: 13.75rem; } } @media (min-width:1200px) and (max-width:1399px) { .c-contact_phone { min-width: 11.25rem; } } @media (min-width:1200px) { .c-contact_phone { height: 7.5rem; } } @media (max-width:1199px) { .c-contact_phone { min-width: 8.75rem; height: 5.625rem; } } @media (max-width:999px) { .c-contact_phone { top: 0; padding-top: 3.75rem; } } @media (max-width:699px) { .c-contact_phone { top: 0; height: 4.375rem; padding-top: 1.875rem; } } @media (min-width:1000px) { .c-contact_form { margin-top: 7.5rem; } } @media (max-width:999px) { .c-contact_form { margin: 3.75rem 0; } } .c-contact_infos_address, .c-contact_infos_cta, .c-contact_infos_icon { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .dom-is-loaded .c-contact_infos_address, .dom-is-loaded .c-contact_infos_cta, .dom-is-loaded .c-contact_infos_icon { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .dom-is-loaded .c-contact_infos_address:nth-child(1), .dom-is-loaded .c-contact_infos_cta:nth-child(1), .dom-is-loaded .c-contact_infos_icon:nth-child(1) { -webkit-transition-delay: .6s; transition-delay: .6s; } .dom-is-loaded .c-contact_infos_address:nth-child(2), .dom-is-loaded .c-contact_infos_cta:nth-child(2), .dom-is-loaded .c-contact_infos_icon:nth-child(2) { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-contact_infos_icon { display: block; } .c-contact_infos_icon svg { display: block; width: 30px; height: 30px; -webkit-transition: fill .3s cubic-bezier(.215, .61, .355, 1); transition: fill .3s cubic-bezier(.215, .61, .355, 1); } .c-contact_infos_icon:hover svg { fill: #496df1; } .c-contact_recaptcha { display: none; } .c-loader { position: fixed; top: 0; right: 0; left: 0; z-index: 999; height: 0; -webkit-transition: height 0s 1.2s, z-index 0s 1.2s, opacity .6s 0s; transition: height 0s 1.2s, z-index 0s 1.2s, opacity .6s 0s; background-color: #fff; opacity: 0; } .dom-is-first-loading .c-loader, .dom-is-loading .c-loader { z-index: 700; height: 100vh; -webkit-transition-delay: 0s; transition-delay: 0s; opacity: 1; } @media (min-width:1400px) { [data-transition=BetweenBrandsTransition] .c-loader { right: 13.75rem; } } @media (min-width:1200px) and (max-width:1399px) { [data-transition=BetweenBrandsTransition] .c-loader { right: 11.25rem; } } [data-transition=BrandTransition] .c-loader { opacity: 0; } .c-loader_logo_wrapper { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 60px; height: 60px; } @media (max-width:1399px) { .c-loader_logo_wrapper { width: 60px; height: 60px; } } @-webkit-keyframes play-loader { from { -webkit-transform: translateY(0); transform: translateY(0); } to { -webkit-transform: translateY(calc(60px - 100%)); transform: translateY(calc(60px - 100%)); } } @keyframes play-loader { from { -webkit-transform: translateY(0); transform: translateY(0); } to { -webkit-transform: translateY(calc(60px - 100%)); transform: translateY(calc(60px - 100%)); } } .c-loader_logo { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 60px; height: 60px; overflow: hidden; } .c-loader_logo img { display: none; } .dom-is-first-loading .c-loader_logo img, .dom-is-loading .c-loader_logo img { -webkit-animation: play-loader 1.6s steps(55); animation: play-loader 1.6s steps(55); } .dom-is-first-loading .c-loader_logo img { -webkit-animation-delay: 1.9s; animation-delay: 1.9s; } .c-feed { position: relative; margin: 15rem 0; padding: 0 7.5rem; } @media (max-width:1399px) { .c-feed { margin: 7.5rem 0; padding: 0 3.75rem; } } @media (max-width:699px) { .c-feed { margin: 3.75rem 0; padding: 0 1.875rem; } } .c-feed_title { position: relative; z-index: 2; } @media (max-width:699px) { .c-feed_title { font-size: 2.5rem; } } .c-feed_link, .c-feed_title { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-feed_link.is-show, .c-feed_title.is-show { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .2s; transition-delay: .2s; } .c-feed_grid { position: relative; margin-right: 15rem; } @media (max-width:1399px) { .c-feed_grid { margin-right: 11.25rem; } } @media (max-width:1199px) { .c-feed_grid { margin-right: 7.5rem; } } @media (max-width:999px) { .c-feed_grid { margin-right: 0; } } .c-feed_grid_inner { position: relative; z-index: 1; } .c-feed_grid_item.-absolute { position: absolute; top: 0; right: 0; width: 60%; z-index: -1; -webkit-transform: translate(50%, -50%); -ms-transform: translate(50%, -50%); transform: translate(50%, -50%); } @media (max-width:699px) { .c-feed_grid_item.-absolute { display: none; } } .c-feed_picture_wrapper { position: relative; display: block; margin-bottom: 3.75rem; overflow: hidden; } .c-feed_picture_wrapper::before { content: ""; display: block; padding-bottom: 100%; } .c-feed_picture_wrapper::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background: rgba(0, 0, 0, .4); opacity: 0; -webkit-transition: opacity .3s cubic-bezier(.215, .61, .355, 1); transition: opacity .3s cubic-bezier(.215, .61, .355, 1); } .c-feed_picture_wrapper:hover::after { opacity: 1; } .c-feed_picture { position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-size: cover; } .c-feed_grid_item { text-align: center; } .c-feed_link { margin: 0 auto 1.875rem auto; } .c-feed_link svg { display: block; margin: auto; width: 50px; height: 50px; } .c-title-block { height: 100vh; font-size: 0; text-align: center; overflow: hidden; position: relative; } .c-title-block::before { display: inline-block; height: 100%; content: ""; vertical-align: middle; } .c-title-block>* { display: inline-block; vertical-align: middle; font-size: 1rem; } .c-title-block::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; z-index: -1; background-color: #000; -webkit-transform: scaleY(1); -ms-transform: scaleY(1); transform: scaleY(1); -webkit-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; -webkit-transition: -webkit-transform 1.2s cubic-bezier(.645, .045, .355, 1); transition: -webkit-transform 1.2s cubic-bezier(.645, .045, .355, 1); transition: transform 1.2s cubic-bezier(.645, .045, .355, 1); transition: transform 1.2s cubic-bezier(.645, .045, .355, 1), -webkit-transform 1.2s cubic-bezier(.645, .045, .355, 1); } .c-title-block.is-show::after { -webkit-transform: scaleY(0); -ms-transform: scaleY(0); transform: scaleY(0); } @media (max-width:999px) { .c-title-block { height: 65vh; } } .c-title-block_background { background-size: cover; background-position: center center; position: absolute; top: 0; right: 0; left: 0; bottom: 0; z-index: -1; } .c-title-block_background::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; left: 0; background-color: rgba(0, 0, 0, .3); } .c-title-block_heading { position: relative; margin: auto; color: #fff; line-height: 1.1; } @media (min-width:1400px) { .c-title-block_heading { font-size: 7.5rem; } } @media (max-width:699px) { .c-title-block_heading { font-size: 3.125rem; } } .c-title-block_heading_glitch { display: inline !important; line-height: 1.2; border-bottom: 8px solid #fff; } @media (max-width:1399px) { .c-title-block_heading_glitch { border-bottom: 6px solid #fff; } } @media (max-width:699px) { .c-title-block_heading_glitch { border-bottom: 4px solid #fff; } } .c-title-block_heading_line { display: block; margin-bottom: 1.875rem; } @media (max-width:699px) { .c-title-block_heading_line { margin-bottom: .9375rem; } } .c-title-block_heading_line_inner { display: inline-block; position: relative; } .c-title-block_heading_line_inner::after { content: ""; display: block; width: 100%; height: 10px; background-color: #fff; opacity: 0; } @media (max-width:699px) { .c-title-block_heading_line_inner::after { height: 6px; } } .c-title-block_heading_line_inner.is-displayed::after { opacity: 1; } .c-team_member { margin-bottom: .625rem; } @media (max-width:699px) { .c-team_member { margin-bottom: .3125rem; } } .c-team_name { font-size: 1.875rem; text-decoration: underline; margin: 0; text-align: right; opacity: 0; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-team_member.is-show .c-team_name { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .2s; transition-delay: .2s; } @media (max-width:1199px) { .c-team_name { font-size: 1.375rem; } } @media (max-width:699px) { .c-team_name { font-size: 1.125rem; } } .c-team_role { margin: 0; font-size: .875rem; opacity: 0; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-team_member.is-show .c-team_role { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; -webkit-transition-delay: .4s; transition-delay: .4s; } @media (max-width:699px) { .c-team_role { font-size: .6875rem; } } @media (max-width:999px) { .c-benefits { margin-top: 2.5rem; } } @media (min-width:700px) { .c-benefits_item:nth-child(even) { margin-top: 5.625rem; } } .c-benefits_item>* { opacity: 0; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); -webkit-transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1); transition: opacity .6s cubic-bezier(.215, .61, .355, 1), transform .6s cubic-bezier(.215, .61, .355, 1), -webkit-transform .6s cubic-bezier(.215, .61, .355, 1); } .c-benefits_item.is-show * { opacity: 1; -webkit-transform: none; -ms-transform: none; transform: none; } .c-benefits_item.is-show:nth-child(1) { -webkit-transition-delay: .38s; transition-delay: .38s; } .c-benefits_item.is-show:nth-child(2) { -webkit-transition-delay: .46s; transition-delay: .46s; } .c-benefits_item.is-show:nth-child(3) { -webkit-transition-delay: .54s; transition-delay: .54s; } .c-benefits_item.is-show:nth-child(4) { -webkit-transition-delay: .62s; transition-delay: .62s; } .c-benefits_item.is-show:nth-child(5) { -webkit-transition-delay: .7s; transition-delay: .7s; } .c-benefits_item.is-show:nth-child(6) { -webkit-transition-delay: .78s; transition-delay: .78s; } .c-benefits_item.is-show:nth-child(7) { -webkit-transition-delay: .86s; transition-delay: .86s; } .c-benefits_item.is-show:nth-child(8) { -webkit-transition-delay: .94s; transition-delay: .94s; } .c-benefits_item.is-show:nth-child(9) { -webkit-transition-delay: 1.02s; transition-delay: 1.02s; } .c-benefits_item.is-show:nth-child(10) { -webkit-transition-delay: 1.1s; transition-delay: 1.1s; } .c-benefits_item h4 { font-weight: 400; font-size: 1.875rem; text-decoration: underline; margin: 0; } @media (max-width:1199px) { .c-benefits_item h4 { font-size: 1.375rem; } } @media (max-width:699px) { .c-benefits_item h4 { font-size: 1.125rem; } } @media (max-width:699px) { .c-benefits_item { margin-bottom: 1.875rem; } } .u-float-left { float: left !important; } .u-float-right { float: right !important; } .u-text-center { text-align: center !important; } .u-text-left { text-align: left !important; } .u-text-right { text-align: right !important; } .u-align-baseline { vertical-align: baseline !important; } .u-align-bottom { vertical-align: bottom !important; } .u-align-middle { vertical-align: middle !important; } .u-align-top { vertical-align: top !important; } .u-vertical-center { font-size: 0; } .u-vertical-center::before { display: inline-block; height: 100%; content: ""; vertical-align: middle; } .u-vertical-center>* { display: inline-block; vertical-align: middle; font-size: 1rem; } [aria-busy=true] { cursor: progress; } [aria-controls] { cursor: pointer; } [aria-disabled] { cursor: default; } .is-visible { visibility: visible !important; opacity: 1 !important; } .is-invisible { visibility: hidden !important; opacity: 0 !important; } .is-hidden { display: none !important; visibility: hidden !important; } @media not print { .is-hidden\@screen { display: none !important; visibility: hidden !important; } } @media print { .is-hidden\@print { display: none !important; visibility: hidden !important; } } .u-1\/1 { width: 100% !important; } .u-1\/2 { width: 60% !important; } .u-2\/2 { width: 100% !important; } .u-1\/3 { width: 33.3333333333% !important; } .u-2\/3 { width: 66.6666666667% !important; } .u-3\/3 { width: 100% !important; } .u-1\/4 { width: 25% !important; } .u-2\/4 { width: 50% !important; } .u-3\/4 { width: 75% !important; } .u-4\/4 { width: 100% !important; } .u-1\/5 { width: 20% !important; } .u-2\/5 { width: 40% !important; } .u-3\/5 { width: 60% !important; } .u-4\/5 { width: 80% !important; } .u-5\/5 { width: 100% !important; } .u-1\/6 { width: 16.6666666667% !important; } .u-2\/6 { width: 33.3333333333% !important; } .u-3\/6 { width: 50% !important; } .u-4\/6 { width: 66.6666666667% !important; } .u-5\/6 { width: 83.3333333333% !important; } .u-6\/6 { width: 100% !important; } @media (min-width:1000px) { .u-1\/2\@from-medium { width: 25%; } } @media (min-width:700px) { .u-1\/2\@from-small { width: 25%; } } @media (min-width:1000px) { .u-1\/3\@from-medium { width: 25%; } } @media (min-width:1000px) { .u-2\/3\@from-medium { width: 25%; } } @media (min-width:1000px) { .u-1\/4\@from-medium { width: 25%; } } @media (min-width:700px) { .u-1\/3\@from-small { width: 25%; } } @media (max-width:999px) { .u-1\/2\@to-medium { width: 25%; } } .icp { font-family: 'hyg2gjm'; position: fixed; bottom: 50px; right: -40px; font-size: 12px; -webkit-transform: rotate(-90deg); -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -o-transform: rotate(-90deg); transform: rotate(-90deg); z-index: 2; height: 20px; line-height: 20px; width: 110px; text-align: center; } @media (min-width:1000px){ a.c-nav_wordmark1 { display: none; } } @media (max-width:999px){ a.c-nav_wordmark { display: none; } a.c-nav_wordmark1 img{margin-top:8px;margin-left:10px;} } @media only screen and (max-width: 1367px) and (min-width: 1100px){ .c-nav_wordmark2 { display: block; padding: 0.5rem 0; text-align: center; height: auto; opacity: 1; } img.img { width: 150px !important; } }