@media (min-width:46.25em) { [ data-animate-scroll] { -webkit-transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); opacity: 0 } .anim-rtl [data-animate-scroll] { -webkit-transform: translate(100px); -ms-transform: translate(100px); transform: translate(100px) } .anim-ltr [data-animate-scroll] { -webkit-transform: translate(-100px); -ms-transform: translate(-100px); transform: translate(-100px) } .anim-ltr [data-animate-scroll] .action-detail__blackstrip--back { -webkit-transform: rotate(180deg) scaleX(1)!important; -ms-transform: rotate(180deg) scaleX(1)!important; transform: rotate(180deg) scaleX(1)!important; -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; -webkit-animation-name: uc27fb0d0; animation-name: uc27fb0d0 } @ -webkit-keyframes uc27fb0d0 { 0% { -webkit-transform: rotate(180deg) scaleX(1); transform: rotate(180deg) scaleX(1) } to { -webkit-transform: rotate(180deg) scaleX(0); transform: rotate(180deg) scaleX(0) } } @keyframes uc27fb0d0 { 0% { -webkit-transform: rotate(180deg) scaleX(1); transform: rotate(180deg) scaleX(1) } to { -webkit-transform: rotate(180deg) scaleX(0); transform: rotate(180deg) scaleX(0) } } [data-animate-scroll].animate-scroll { -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); opacity: 1 } .animate { -webkit-animation: 2s cubic-bezier(.075, .82, .165, 1) forwards; animation: 2s cubic-bezier(.075, .82, .165, 1) forwards; -webkit-animation-name: animate1; animation-name: animate1; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); opacity: 0; } @-webkit-keyframes animate1 { 0% { -webkit-transform: translateY(100px); transform: translateY(100px); opacity: 0 } 50% { -webkit-transform: translateY(0); transform: translateY(0) } to { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1 } } @keyframes animate1 { 0% { -webkit-transform: translateY(100px); transform: translateY(100px); opacity: 0 } 50% { -webkit-transform: translateY(0); transform: translateY(0) } to { -webkit-transform: translateY(0); transform: translateY(0); opacity: 1 } } .animate-opacity { -webkit-animation: 2s cubic-bezier(.23, 1, .32, 1) forwards; animation: 2s cubic-bezier(.23, 1, .32, 1) forwards; -webkit-animation-name: animate-opacity; animation-name: animate-opacity; opacity: 0 } @-webkit-keyframes animate-opacity { 0% { opacity: 0 } to { opacity: 1 } } @keyframes animate-opacity { 0% { opacity: 0 } to { opacity: 1 } } .action-detail__blackstrip-back-right { overflow: hidden; right: 0!important; -webkit-transform: scaleX(1)!important; -ms-transform: scaleX(1)!important; transform: scaleX(1)!important; -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards!important; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards!important; -webkit-animation-name: u4d84c09a!important; animation-name: u4d84c09a!important } } @media (min-width:46.25em) and (min-width:1520px) { .action-detail__blackstrip-back-right { right: -58px!important } } @media (min-width:46.25em) { @ -webkit-keyframes u4d84c09a { 0% { -webkit-transform: scaleX(1); transform: scaleX(1) } to { -webkit-transform: scaleX(0); transform: scaleX(0) } } @keyframes u4d84c09a { 0% { -webkit-transform: scaleX(1); transform: scaleX(1) } to { -webkit-transform: scaleX(0); transform: scaleX(0) } } .action-detail__blackstrip-back-left { right: 429px!important; -webkit-transform: rotate(180deg) scaleX(1)!important; -ms-transform: rotate(180deg) scaleX(1)!important; transform: rotate(180deg) scaleX(1)!important; -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards!important; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards!important; -webkit-animation-name: u92f4437b!important; animation-name: u92f4437b!important } @-webkit-keyframes u92f4437b { 0% { -webkit-transform: rotate(180deg) scaleX(1); transform: rotate(180deg) scaleX(1) } to { -webkit-transform: rotate(180deg) scaleX(0); transform: rotate(180deg) scaleX(0) } } @keyframes u92f4437b { 0% { -webkit-transform: rotate(180deg) scaleX(1); transform: rotate(180deg) scaleX(1) } to { -webkit-transform: rotate(180deg) scaleX(0); transform: rotate(180deg) scaleX(0) } } .animate-back-right { -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; -webkit-animation-name: u7291c6fb; animation-name: u7291c6fb } @-webkit-keyframes u7291c6fb { 0% { -webkit-transform: translate(0); transform: translate(0); opacity: 1 } to { -webkit-transform: translate(100px); transform: translate(100px); opacity: 0 } } @keyframes u7291c6fb { 0% { -webkit-transform: translate(0); transform: translate(0); opacity: 1 } to { -webkit-transform: translate(100px); transform: translate(100px); opacity: 0 } } .animate-back-left { -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; -webkit-animation-name: u9599131f; animation-name: u9599131f } @-webkit-keyframes u9599131f { 0% { -webkit-transform: translate(0); transform: translate(0); opacity: 1 } to { -webkit-transform: translate(-100px); transform: translate(-100px); opacity: 0 } } @keyframes u9599131f { 0% { -webkit-transform: translate(0); transform: translate(0); opacity: 1 } to { -webkit-transform: translate(-100px); transform: translate(-100px); opacity: 0 } } } .site-container, .site-footer, .site-header { -webkit-transition: -webkit-transform .3s cubic-bezier(.55, .085, .68, .53); transition: -webkit-transform .3s cubic-bezier(.55, .085, .68, .53); transition: transform .3s cubic-bezier(.55, .085, .68, .53); transition: transform .3s cubic-bezier(.55, .085, .68, .53), -webkit-transform .3s cubic-bezier(.55, .085, .68, .53) } .site-container.translate, .site-footer.translate, .site-header.translate { -webkit-transform: translateX(-100%); -ms-transform: translateX(-100%); transform: translateX(-100%) } ::-moz-selection { color: #fff; background: #000 } .typeset p { font-size: 1rem; line-height: 2rem; margin-bottom: 1.33999rem; padding-top: .66001rem; -webkit-font-feature-settings: "kern" 1, "onum" 1, "liga" 1; font-feature-settings: "kern" 1, "onum" 1, "liga" 1 } .typeset h1, .typeset h2, .typeset h3, .typeset h4, .typeset h5, .typeset h6 { -webkit-font-feature-settings: "dlig" 1, "liga" 1, "lnum" 1, "kern" 1; font-feature-settings: "dlig" 1, "liga" 1, "lnum" 1, "kern" 1 } .typeset h1 { font-size: 2.33275rem; line-height: 3rem; margin-bottom: .293125rem; padding-top: .706875rem } .typeset h2 { font-size: 1.776889rem; line-height: 3rem; margin-bottom: .10413226rem; padding-top: .89586774rem } .typeset h3 { font-size: 1.75rem; line-height: 3rem; margin-bottom: .09499rem; padding-top: .90501rem } .typeset h4 { font-size: 1.333rem; line-height: 2rem; margin-bottom: -.54679rem; padding-top: .54679rem } .typeset h5 { font-size: 1.3128282071rem; line-height: 2rem; margin-bottom: -.5536484096rem; padding-top: .5536484096rem } .typeset h6 { font-size: 1rem; line-height: 2rem; margin-bottom: -.66001rem; padding-top: .66001rem } .typeset b, .typeset strong { font-weight: 700 } .typeset .caption, .typeset small { font-family: Roboto, Arial, sans-serif; font-weight: 400; font-style: normal; font-size: .7501875469rem } .typeset small { line-height: 1rem } .typeset .caption { font-size: .9848673721rem; line-height: 2rem; margin-bottom: 1.3348449065rem; padding-top: .6651550935rem; color: #ccc } .typeset h1+.caption, .typeset h2+.caption, .typeset h3+.caption { margin-top: -1rem } .typeset h4+.caption, .typeset h5+.caption, .typeset h6+.caption { margin-top: 0 } .typeset ol, .typeset ul { font-size: 1rem; line-height: 2rem; margin-bottom: 1.33999rem; padding-top: .66001rem } .typeset ol li, .typeset ul li { margin-left: 1.25rem; -webkit-font-feature-settings: "kern" 1, "onum" 1, "liga" 1; font-feature-settings: "kern" 1, "onum" 1, "liga" 1 } .typeset ul li { list-style: disc } .typeset ol li { list-style: decimal } .typeset blockquote { border-left: .125rem solid #000; padding-left: 1rem } .typeset blockquote p { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: italic; font-size: 1rem; line-height: 2rem; margin-bottom: 1.67999rem; padding-bottom: .66001rem } .typeset blockquote p+cite { margin-top: -3rem } .typeset blockquote cite { font-family: Roboto, Arial, sans-serif; font-weight: 700; font-size: .7501875469rem; line-height: 3rem; margin-bottom: 1.7550537659rem; padding-top: 1.2449462341rem; display: block; text-transform: uppercase } @media (max-width:46.24em) { .title { line-height: 1.4 } } strong { font-weight: 700 } .u-pull-left { float: left } .u-pull-right { float: right } .u-text-left { text-align: left } .u-text-right { text-align: right } .u-text-center { text-align: center } .u-text-justify { text-align: justify } .u-uppercase { text-transform: uppercase } .u-lowercase { text-transform: lowercase } .u-clearfix:after { clear: both; content: ""; display: table } .u-inline { display: inline } .u-inline-block { display: inline-block } .u-block { display: block } .u-table { display: table } .u-cell { display: table-cell } .u-va-top { vertical-align: top } .u-va-middle { vertical-align: middle } .u-va-bottom { vertical-align: bottom } .u-hidden { display: none } .u-invisible { visibility: hidden } .u-hide-text { overflow: hidden; padding: 0; text-indent: 101%; white-space: nowrap } .u-visually-hidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px } .u-visually-hidden--focusable:active, .u-visually-hidden--focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto } .u-text-hyphenate { -ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto } .u-button-reset { display: block; margin: 0; padding: 0; border: 0; width: 100%; background: transparent } .u-button-reset:focus { outline: 0 } .u-nobr { white-space: nowrap } .container { margin-right: auto; margin-left: auto; position: relative; } .container:after { clear: both; content: ""; display: table } .container--large { max-width: 1300px } .row { display: block; clear: both } .row:after { clear: both; content: ""; display: table } .row--collapse { margin: 0 } .row--collapse .column { padding-left: 0; padding-right: 0 } .large-1 { width: 8.3333333333% } .large-2 { width: 16.6666666667% } .large-3 { width: 25% } .large-4 { width: 33.3333333333% } .large-5 { width: 41.6666666667% } .large-6 { width: 50% } .large-7 { width: 58.3333333333% } .large-8 { width: 66.6666666667% } .large-9 { width: 75% } .large-10 { width: 83.3333333333% } .large-11 { width: 91.6666666667% } .large-12 { width: 100% } .column { float: left; padding: 0 17.5px; min-height: 20px } /*! formstone v0.6.14 [dropdown.css] 2015-06-23 | MIT License | formstone.it */.fs-dropdown-selected { width: 100%; position: relative; background: #fff; border: 1px solid #ccc; border-radius: 3px; color: #222; cursor: pointer; display: block; font-size: 14px; height: 40px; line-height: 40px; margin: 0; overflow: hidden; padding: 0 40px 0 15px; text-align: left; text-overflow: clip; z-index: 2 } .fs-dropdown-selected:after { height: 0; width: 0; position: absolute; top: 0; right: 15px; bottom: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #ccc; content: ""; display: block; margin: auto 0 } .fs-dropdown-options { width: 100%; max-height: 260px; position: absolute; top: 100%; left: 0; border: 1px solid #ccc; border-width: 0 1px 1px; border-radius: 0 0 3px 3px; box-shadow: 0 1px 4px rgba(0,0,0,.15); background-color: #fff; display: none; margin: 0; overflow: auto; overflow-x: hidden; padding: 0; z-index: 50 } .fs-dropdown-item { width: 100%; background: #fff; border-bottom: 1px solid #ccc; color: #222; cursor: pointer; display: block; font-size: 14px; margin: 0; height: 40px; line-height: 40px; overflow: hidden; padding: 0 15px; text-align: left; text-decoration: none; text-overflow: ellipsis } .fs-dropdown-item_selected { background: #eee } .fs-dropdown-item:last-child { border-bottom: 0; border-radius: 0 0 3px 3px } .fs-dropdown-open .fs-dropdown-options { display: block; border-radius: 0 0 3px 3px } .fs-dropdown-open .fs-dropdown-selected { z-index: 51; border-radius: 3px 3px 0 0 } .fs-dropdown-focus .fs-dropdown-selected, .fs-dropdown-open .fs-dropdown-selected { background-color: #fff; box-shadow: 0 0 5px rgba(0,0,0,.1) } .fs-dropdown-cover .fs-dropdown-options { top: 0; border-radius: 3px; border-width: 1px } .fs-dropdown-cover .fs-dropdown-item:first-child { border-radius: 3px 3px 0 0 } .fs-dropdown-bottom.fs-dropdown-open .fs-dropdown-selected { border-radius: 0 0 3px 3px } .fs-dropdown-bottom.fs-dropdown-open .fs-dropdown-options { border-radius: 3px 3px 0 0 } .fs-dropdown-bottom.fs-dropdown-cover.fs-dropdown-open .fs-dropdown-options, .fs-dropdown-bottom.fs-dropdown-cover.fs-dropdown-open .fs-dropdown-selected { border-radius: 3px } .fs-dropdown-multiple .fs-dropdown-options { width: 100%; position: static; border-radius: 3px; border-width: 1px; box-shadow: none; display: block } .site-header { padding: 30px 30px 0; position: absolute; top: 0; right: 0; left: 0 } .site-header:after { clear: both; content: ""; display: table } .site-header__left { position: fixed; top: 30px; left: 30px; float: left; z-index: 10 } .site-header__left.relative { position: relative; top: 0; left: 0 } .site-header__menu { text-align: right; position: relative; z-index: 55; left: calc(100% - 150px)!important } .open-menu .site-header__menu { z-index: 55 } .site-header__logo { float: left; display: block; height: 45px; width: 45px; -webkit-animation-delay: .2s; animation-delay: .2s } .site-header__baseline { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; margin-top: 8px; margin-right: 150px; margin-left: 70px; padding-left: 20px; position: relative; -webkit-animation-delay: .3s; animation-delay: .3s } .site-header__baseline:before { content: ""; position: absolute; top: 0; left: 0; height: 30px; width: 1px; background-color: #ccc } @media (max-width:46.24em) { .site-header__baseline { display: none } } .header-icon-menu { margin: 40px 40px 0 0 } body:not(.open-menu) .header-icon-menu:hover .menu-toggle b.top { -webkit-transform: translateY(-8px); -ms-transform: translateY(-8px); transform: translateY(-8px) } body:not(.open-menu) .header-icon-menu:hover .menu-toggle b.bottom, body:not(.open-menu) .header-icon-menu:hover .menu-toggle b.top { -webkit-transition: -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); transition: -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); transition: transform .3s cubic-bezier(.23, 1, .32, 1); transition: transform .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) } body:not(.open-menu) .header-icon-menu:hover .menu-toggle b.bottom { -webkit-transform: translateY(8px); -ms-transform: translateY(8px); transform: translateY(8px) } .link-menu { font-family: Roboto, Arial, sans-serif; font-weight: 700; font-style: normal; font-size: 1rem; padding-right: 25px; line-height: 24px; display: inline-block; vertical-align: top; cursor: pointer } .open-menu .link-menu { display: none } @media (max-width:46.24em) { .link-menu { display: none } } .menu-toggle { position: relative; display: inline-block; width: 26px; height: 24px; z-index: 100; -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-transition: -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); transition: -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); transition: transform .3s cubic-bezier(.23, 1, .32, 1); transition: transform .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .3s cubic-bezier(.23, 1, .32, 1); cursor: pointer } .menu-toggle b { position: absolute; left: 0; top: 50%; display: block; width: 100%; height: 4px; margin: -2px 0 0; background: #000 } .open-menu .menu-toggle b { background-color: #fff!important } .menu-toggle b.top { -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); -webkit-transition: background .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .2s cubic-bezier(.23, 1, .32, 1) .1s; transition: background .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .2s cubic-bezier(.23, 1, .32, 1) .1s; transition: transform .2s cubic-bezier(.23, 1, .32, 1) .1s, background .3s cubic-bezier(.23, 1, .32, 1); transition: transform .2s cubic-bezier(.23, 1, .32, 1) .1s, background .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .2s cubic-bezier(.23, 1, .32, 1) .1s } .menu-toggle b.middle { -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); -webkit-transition: opacity .2s cubic-bezier(.23, 1, .32, 1) .1s, background .3s cubic-bezier(.23, 1, .32, 1); transition: opacity .2s cubic-bezier(.23, 1, .32, 1) .1s, background .3s cubic-bezier(.23, 1, .32, 1) } .menu-toggle b.bottom { -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); -webkit-transition: background .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .2s cubic-bezier(.23, 1, .32, 1) .1s; transition: background .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .2s cubic-bezier(.23, 1, .32, 1) .1s; transition: transform .2s cubic-bezier(.23, 1, .32, 1) .1s, background .3s cubic-bezier(.23, 1, .32, 1); transition: transform .2s cubic-bezier(.23, 1, .32, 1) .1s, background .3s cubic-bezier(.23, 1, .32, 1), -webkit-transform .2s cubic-bezier(.23, 1, .32, 1) .1s } .open-menu .menu-toggle { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg) } .open-menu .menu-toggle b.top { -webkit-transform: translate(0) rotate(-45deg); -ms-transform: translate(0) rotate(-45deg); transform: translate(0) rotate(-45deg) } .open-menu .menu-toggle b.middle { opacity: 0 } .open-menu .menu-toggle b.bottom { -webkit-transform: translate(0) rotate(45deg); -ms-transform: translate(0) rotate(45deg); transform: translate(0) rotate(45deg) } .midnightHeader.default { color: #000 } .midnightHeader.default .menu-toggle b { background-color: #000 } .midnightHeader.black { color: #fff } .midnightHeader.black .menu-toggle b { background-color: #000 } .midnightHeader.white { color: #fff } .midnightHeader.white .menu-toggle b, .site-footer { background-color: #fff } .site-footer__menu { padding: 60px 0 } @media (max-width:55.615em) { .site-footer__menu .column { width: 100%; float: none; max-width: 460px; margin: auto; text-align: center } .site-footer__menu .column:first-child .site-footer__link:after { position: absolute; top: -15px; bottom: 0; left: calc(50% - 15px) } } .site-footer__title { font-size: 1.125rem; line-height: 1.5; position: relative; padding: 23px 0 } .site-footer__title:after { content: ""; position: absolute; bottom: 0; left: 0; height: 1px; width: 30px; background-color: rgba(0,0,0,.2) } @media (max-width:55.615em) { .site-footer__title:after { position: absolute; bottom: 0; left: calc(50% - 15px) } } .site-footer__title a:hover { color: rgba(0,0,0,.5); text-decoration: none } .site-footer__parag { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; font-size: .9375rem; line-height: 2; position: relative; padding: 23px 0; color: rgba(0,0,0,.6) } .site-footer__link { position: relative; display: inline-block; margin: 15px 0; font-size: 14px; line-height: 2; letter-spacing: .03em } .site-footer__link .svg { display: inline-block; margin-left: 7px; position: relative; top: 1px; -webkit-transition: margin .2s cubic-bezier(.23, 1, .32, 1); transition: margin .2s cubic-bezier(.23, 1, .32, 1) } .site-footer__link:hover { text-decoration: none } .site-footer__link:hover .svg { margin-left: 12px } .site-footer__link:after { content: ""; position: absolute; top: -15px; left: 0; height: 1px; width: 30px; background-color: rgba(0,0,0,.2) } .site-footer__list { text-align: left } .site-footer__list:after { clear: both; content: ""; display: table } .site-footer__list>li { width: 50%; float: left; padding: 4px 0 } .site-footer__icons .logo-white, .site-footer__list>li:first-child a:after, .site-footer__list>li:nth-child(2) a:after { display: none } .site-footer__partners { margin-bottom: 39px } @media (min-width:55.625em) { .site-footer__partners:after { clear: both; content: ""; display: table } } .site-footer__partners img { display: block; margin-top: 15px; max-width: 260px } @media (min-width:55.625em) { .site-footer__partners img { float: left; width: calc(50% - 5px) } .site-footer__partners img:nth-child(odd) { margin-right: 10px } } @media (max-width:55.615em) { .site-footer__partners img { margin-left: auto; margin-right: auto } .site-footer__partners img:nth-child(odd) { margin-right: auto } } @media (min-width:61.25em) { .site-footer__partners img.feder { width: 75% } } .site-footer__copyright { padding: 20px 17.5px 45px; font-size: .75rem; line-height: 1.5 } .site-footer__copyright .logo-dogstudio { float: right } .site-footer__copyright .logo-dogstudio .svg { fill: #af976d; -webkit-transition: fill .3s cubic-bezier(.23, 1, .32, 1); transition: fill .3s cubic-bezier(.23, 1, .32, 1) } .site-footer__copyright .logo-dogstudio:hover .svg { fill: #000 } .breadcrumb { position: relative; margin: 0 0 30px; padding: 8px 10px; color: #000; background: #f4f4f4; font-size: 11px; line-height: 12px; text-transform: uppercase; border: 1px solid #c1c1c1 } .breadcrumb:after { clear: both; content: ""; display: table } .breadcrumb li { float: left; list-style: none; margin: 0; padding: 0 } .breadcrumb li:after { content: "/"; margin: 0 5px; color: #a8a8a8 } .breadcrumb li:last-child:after { content: none } .breadcrumb a { text-decoration: none } .breadcrumb .is-disabled a { color: #a8a8a8; cursor: default } button { padding: 0; background-color: transparent; outline: none; border: none } .button, button { text-decoration: none; cursor: pointer; -webkit-appearance: none; box-sizing: border-box } .button { display: inline-block; padding: 12px; font-size: 14px; line-height: 16px; font-weight: 700; text-align: center; border: 2px solid transparent; border-radius: 5px } .button, .button:hover { background: #000; color: #fff } .button:hover { text-decoration: none } .button--disable { background: #ccc; pointer-events: none } .button--disable:hover { cursor: default } .button--outline { border-color: #000; background: none; color: #000 } .button--outline:hover { background: #000 } .button--outline.button--disable { color: #ccc; background: none; border-color: #ccc } .button--transparent { background: none; color: #000 } .button--transparent:hover { color: #000; background: #e6e6e6 } .button--transparent.button--disable { color: #ccc; background: none } .button--expand { display: block } .button--big { padding: 15px 20px } .button--small { padding: 6px } .round { display: block; float: left; width: 40px; height: 40px; border: 2px solid #313131; border-radius: 20px; margin-right: 10px; -webkit-transition: background .3s cubic-bezier(.23, 1, .32, 1), border .3s cubic-bezier(.23, 1, .32, 1); transition: background .3s cubic-bezier(.23, 1, .32, 1), border .3s cubic-bezier(.23, 1, .32, 1) } .round svg { margin: 13px 10px; fill: #fff; -webkit-transition: fill .3s cubic-bezier(.23, 1, .32, 1); transition: fill .3s cubic-bezier(.23, 1, .32, 1) } @media (max-width:46.24em) { .round { -webkit-transform: scale(.7); -ms-transform: scale(.7); transform: scale(.7) } } .btn-link { font-size: .75rem; line-height: 40px; letter-spacing: .1em; text-transform: uppercase; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal; color: #fff } .btn-link:hover .round { border: 2px solid #fff; background-color: #fff } .btn-link:hover .round svg { fill: #000 } .btn-black { display: block; height: 50px; line-height: 46px; padding: 0 25px; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal; color: #fff; font-size: .6875rem; text-transform: uppercase; border-radius: 25px; background-color: #000; letter-spacing: .11em; position: relative; border: 2px solid #000; -webkit-appearance: none; cursor: pointer; -webkit-transition: background .3s cubic-bezier(.23, 1, .32, 1), color .3s cubic-bezier(.23, 1, .32, 1); transition: background .3s cubic-bezier(.23, 1, .32, 1), color .3s cubic-bezier(.23, 1, .32, 1) } .btn-black .svg { fill: #fff; position: absolute; top: 1px; right: 25px; -webkit-transition: fill .3s cubic-bezier(.23, 1, .32, 1), right .3s cubic-bezier(.23, 1, .32, 1); transition: fill .3s cubic-bezier(.23, 1, .32, 1), right .3s cubic-bezier(.23, 1, .32, 1) } .btn-black:hover { background-color: #fff; text-decoration: none; color: #000 } .btn-black:hover .svg { fill: #000; right: 20px } .btn-play { display: block; height: 50px; line-height: 50px; padding: 0 25px; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal; color: #fff; font-size: .6875rem; text-transform: uppercase; border-radius: 25px; background-color: #000; letter-spacing: .11em; position: relative; -webkit-appearance: none; cursor: pointer; -webkit-transition: background .3s cubic-bezier(.23, 1, .32, 1), color .3s cubic-bezier(.23, 1, .32, 1); transition: background .3s cubic-bezier(.23, 1, .32, 1), color .3s cubic-bezier(.23, 1, .32, 1) } .btn-play .svg { fill: #fff; -webkit-transition: fill .3s cubic-bezier(.23, 1, .32, 1), right .3s cubic-bezier(.23, 1, .32, 1); transition: fill .3s cubic-bezier(.23, 1, .32, 1), right .3s cubic-bezier(.23, 1, .32, 1); margin-right: 15px } .btn-play:hover { background-color: #fff; text-decoration: none; color: #000 } .btn-play:hover .svg { fill: #000 } .btn-transparent { display: inline-block; height: 54px; line-height: 50px; padding: 0 25px; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal; color: #fff; font-size: .6875rem; text-transform: uppercase; border-radius: 27px; background-color: transparent; letter-spacing: .11em; position: relative; border: 2px solid hsla(0,0%,100%,.2); -webkit-transition: background .3s cubic-bezier(.23, 1, .32, 1), color .3s cubic-bezier(.23, 1, .32, 1); transition: background .3s cubic-bezier(.23, 1, .32, 1), color .3s cubic-bezier(.23, 1, .32, 1) } .btn-transparent .svg { fill: #fff; position: absolute; top: 1px; right: 25px; -webkit-transition: fill .3s cubic-bezier(.23, 1, .32, 1), right .3s cubic-bezier(.23, 1, .32, 1); transition: fill .3s cubic-bezier(.23, 1, .32, 1), right .3s cubic-bezier(.23, 1, .32, 1) } .btn-transparent:hover { background-color: #fff; text-decoration: none; color: #000 } .btn-transparent:hover .svg { fill: #000; right: 20px } .btn-transparent.disabled { color: hsla(0,0%,100%,.2); pointer-events: none; display: none } .arrow-left, .arrow-right { display: block; height: 50px; width: 50px; border: 2px solid #ccc; border-radius: 25px; margin-bottom: 12px; -webkit-transition: background .3s cubic-bezier(.23, 1, .32, 1), border .3s cubic-bezier(.23, 1, .32, 1); transition: background .3s cubic-bezier(.23, 1, .32, 1), border .3s cubic-bezier(.23, 1, .32, 1) } .arrow-left .svg, .arrow-right .svg { display: block; margin: 9px 15px } .arrow-left svg, .arrow-right svg { fill: #000; -webkit-transition: fill .1s; transition: fill .1s } .arrow-left:hover, .arrow-right:hover { background-color: #000; border: 2px solid #000 } .arrow-left:hover svg, .arrow-right:hover svg { fill: #fff } .arrow-left.disabled, .arrow-right.disabled { pointer-events: none; opacity: .3 } .label, label { display: block; margin: 0 0 5px; color: rgba(0,0,0,.45); font-size: .6875rem; line-height: 20px; letter-spacing: .1em; text-transform: uppercase; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal } .fields:after { clear: both; content: ""; display: table } .input--text, select, textarea { position: relative; background: #fff; border: 2px solid rgba(0,0,0,.2); width: 100%; height: 54px; padding: 10px 15px; margin: 0; font-size: .875rem; line-height: 20px; color: #000; border-radius: 0; box-shadow: none; -webkit-transition: border .4s cubic-bezier(.23, 1, .32, 1); transition: border .4s cubic-bezier(.23, 1, .32, 1); font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: italic } .input--text:focus, select:focus, textarea:focus { border-color: #000; outline: none } select { border-radius: 27px; font-size: .6875rem; letter-spacing: .1em; text-transform: uppercase; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal } textarea { min-height: 160px; resize: vertical } .field { margin: 0 18px 25px; width: calc(50% - 36px); float: left; position: relative } @media (max-width:61.24em) { .field { margin: 0 0 25px; width: 100% } } .field--large { width: calc(100% - 36px) } @media (max-width:61.24em) { .field--large { width: 100% } } .field--error .label, .field--error label { color: red } .field--error .input--text, .field--error select, .field--error textarea { border-color: red } .field--error .checkbox label, .field--error .radio label { color: #000 } .field .btn-black { width: 180px; text-align: left } @media (max-width:61.24em) { .field .btn-black { width: 100% } } .field .required-fields { text-align: right; font-size: .875rem; font-family: Roboto, Arial, sans-serif; font-weight: 500; font-style: normal; line-height: 45px } @media (max-width:61.24em) { .field .required-fields { line-height: 20px } } .field__error { position: absolute; bottom: -20px; right: 0; color: red; font-size: 11px; font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: italic } .checkbox, .radio { position: relative; margin: 0 } .checkbox label, .radio label { display: inline; margin: 0 0 0 5px; font-size: 13px } .checkbox-list { padding: 0; margin: 0 0 20px } .checkbox-list:after { clear: both; content: ""; display: table } .checkbox-list .checkbox, .checkbox-list .radio { list-style: none; margin: 0 0 15px; padding: 0 } .postfix, .prefix { background: #f2f2f2; border: 1px solid #ccc; display: block; font-size: 13px; height: 44px; line-height: 40px; overflow: hidden; position: relative; text-align: center; width: 100%; z-index: 2 } .postfix { border-left: 0 none } .prefix { border-right: 0 none } .error { color: red } .message { font-size: 16px; line-height: 18px; font-weight: 700; color: green; background: #bfdfbf; border: 2px solid green; margin: 0 20px 30px; text-align: center; padding: 20px } @media (max-width:61.24em) { .message { margin: 0 0 30px } } .message a { color: green } .message--error { color: red; background-color: #ffbfbf; border-color: red } .message--error a { color: red } .message--warning { color: orange; background-color: #ffe9bf; border-color: orange } .message--warning a { color: orange } .pagination { position: relative; margin: 0; padding: 0; text-align: center } .pagination:after { clear: both; content: ""; display: table } .pagination__next, .pagination__prev { position: relative; width: 20%; z-index: 10 } .pagination__prev { float: left; text-align: left } .pagination__next { float: right; text-align: right } .pagination__list { position: relative; margin: 0; padding: 0; font-size: 0 } .pagination__list li { list-style: none; margin: 0; padding: 0; display: inline; font-size: 14px } .pagination__list li:after { content: "/"; margin: 0 5px; color: #a8a8a8 } .pagination__list li:last-child:after { content: none } .pagination__list a { display: inline-block; padding: 5px } .persona { float: left; width: 90px; margin: 15px } .persona:first-child { -webkit-transition-delay: 0s; transition-delay: 0s } .persona:nth-child(2) { -webkit-transition-delay: .05s; transition-delay: .05s } .persona:nth-child(3) { -webkit-transition-delay: .1s; transition-delay: .1s } .persona:nth-child(4) { -webkit-transition-delay: .15s; transition-delay: .15s } .persona:nth-child(5) { -webkit-transition-delay: .2s; transition-delay: .2s } .persona:nth-child(6) { -webkit-transition-delay: .25s; transition-delay: .25s } .persona:nth-child(7) { -webkit-transition-delay: .3s; transition-delay: .3s } .persona__icon { height: 90px; width: 90px; background-color: rgba(49,49,49,.7); border-radius: 50%; padding: 15px; margin: auto } .persona__icon svg { fill: hsla(0,0%,100%,.4); stroke: rgba(49,49,49,.7) } .persona__text { font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; color: #fff; text-transform: uppercase; font-size: .5625rem; line-height: 1.6; letter-spacing: .1em; width: 100%; height: 32px; margin-top: 15px; -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto } .persona__loop, .persona__text { font-style: normal; text-align: center } .persona__loop { display: block; height: 40px; width: 40px; line-height: 40px; margin-left: calc(50% - 40px); font-size: .8125rem; color: hsla(0,0%,100%,.4); position: relative; font-family: Droid Serif, Times New Roman, serif; font-weight: 400; margin-bottom: 20px } .persona__loop:after { content: ""; position: absolute; right: 0; bottom: 0; height: 19px; width: 1px; background-color: hsla(0,0%,100%,.2) } .persona--large { width: calc(16.666666% - 30px) } @media (max-width:61.24em) { .persona--large { width: calc(33.333333% - 30px) } } @media (max-width:500px) { .persona--large { width: calc(50% - 30px) } } .persona--large .persona__icon { height: 120px; width: 120px; padding: 20px; margin-bottom: 20px } .persona--large .persona__text { font-size: .75rem; -webkit-hyphens: none; -ms-hyphens: none; hyphens: none } .posts-section { background-color: #000; padding: 100px 0 } .posts { padding: 30px 4.5px 0 } .posts:after { clear: both; content: ""; display: table } @media (max-width:46.24em) { .posts { padding: 30px 15px 0 } } .posts>div:first-child { -webkit-transition-delay: 0s; transition-delay: 0s } .posts>div:nth-child(2) { -webkit-transition-delay: .05s; transition-delay: .05s } .posts>div:nth-child(3) { -webkit-transition-delay: .1s; transition-delay: .1s } .posts>div:nth-child(4) { -webkit-transition-delay: .15s; transition-delay: .15s } .posts>div:nth-child(5) { -webkit-transition-delay: .2s; transition-delay: .2s } .posts>div:nth-child(6) { -webkit-transition-delay: .25s; transition-delay: .25s } .posts>div:nth-child(7) { -webkit-transition-delay: .3s; transition-delay: .3s } .post { display: block; width: calc(33% - 26px); max-width: 360px; float: left; margin: 13px; background-color: hsla(0,0%,100%,.1); -webkit-transition: background .5s cubic-bezier(.23, 1, .32, 1); transition: background .5s cubic-bezier(.23, 1, .32, 1) } .post:nth-child(2) { width: calc(34% - 26px) } @media (max-width:46.24em) { .post { width: auto; float: none; margin: 20px auto } } .post__img { position: relative; overflow: hidden } .post__img:before { padding-top: 53.8674033149%; display: block; content: "" } .post__img a { display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100% } .post__img img { width: 100%; -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); -webkit-transition: -webkit-transform 1s cubic-bezier(.23, 1, .32, 1); transition: -webkit-transform 1s cubic-bezier(.23, 1, .32, 1); transition: transform 1s cubic-bezier(.23, 1, .32, 1); transition: transform 1s cubic-bezier(.23, 1, .32, 1), -webkit-transform 1s cubic-bezier(.23, 1, .32, 1) } .post__infos { padding-bottom: 30px } .post__title { font-family: Roboto, Arial, sans-serif; font-weight: 400; font-style: normal; padding: 30px 30px 25px; position: relative } .post__title a { display: block; max-height: 46.008px; overflow: hidden; font-size: 1.125rem; line-height: 1.278; height: 46.008px; color: #fff; -webkit-transition: color .5s cubic-bezier(.23, 1, .32, 1); transition: color .5s cubic-bezier(.23, 1, .32, 1) } @supports (-webkit-line-clamp:2) { .post__title a { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; text-overflow: ellipsis } } .post__title a:hover { text-decoration: none } .post__title:after { content: ""; position: absolute; right: 0; bottom: 0; left: 30px; height: 1px; width: 30px; background-color: hsla(0,0%,100%,.2); -webkit-transition: background .5s cubic-bezier(.23, 1, .32, 1), width .5s cubic-bezier(.23, 1, .32, 1); transition: background .5s cubic-bezier(.23, 1, .32, 1), width .5s cubic-bezier(.23, 1, .32, 1) } .post__tagline { padding: 0 30px; color: #9a9a9a; font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: italic; font-size: .875rem; margin-top: 8px } .post:hover { background-color: #fff } .post:hover .post__img img { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 5s cubic-bezier(.23, 1, .32, 1); transition: -webkit-transform 5s cubic-bezier(.23, 1, .32, 1); transition: transform 5s cubic-bezier(.23, 1, .32, 1); transition: transform 5s cubic-bezier(.23, 1, .32, 1), -webkit-transform 5s cubic-bezier(.23, 1, .32, 1) } .post:hover .post__title a { color: #000; -webkit-text-fill-color: #000 } .post:hover .post__title:after { background-color: rgba(0,0,0,.2) } .post:hover .post__tagline { color: #000 } .navigation { position: fixed; top: 0; left: 0; z-index: 50; height: 100%; width: 100%; background-color: #000; background-image: url(/Public/Home/assets/images/navigation-bg.jpg); background-repeat: no-repeat; background-position: 100% 0; overflow: hidden; overflow-y: scroll; color: #fff; -webkit-transform: translateY(100%); -ms-transform: translateY(100%); transform: translateY(100%); opacity: 0 } .navigation:after { clear: both; content: ""; display: table } .loaded .navigation { -webkit-transition: opacity .7s cubic-bezier(.455, .03, .515, .955), -webkit-transform 0s cubic-bezier(.23, 1, .32, 1) .7s; transition: opacity .7s cubic-bezier(.455, .03, .515, .955), -webkit-transform 0s cubic-bezier(.23, 1, .32, 1) .7s; transition: transform 0s cubic-bezier(.23, 1, .32, 1) .7s, opacity .7s cubic-bezier(.455, .03, .515, .955); transition: transform 0s cubic-bezier(.23, 1, .32, 1) .7s, opacity .7s cubic-bezier(.455, .03, .515, .955), -webkit-transform 0s cubic-bezier(.23, 1, .32, 1) .7s } .open-menu .navigation { -webkit-transition: opacity .5s cubic-bezier(.23, 1, .32, 1); transition: opacity .5s cubic-bezier(.23, 1, .32, 1); -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1 } @media (max-width:46.24em) { .navigation { overflow-x: scroll } } @media (min-width:46.25em) { .navigation { overflow-y: hidden } } .navigation__menu { float: left; width: calc(100% - 400px) } @media (max-width:1120px) { .navigation__menu { width: calc(100% - 320px) } } @media (max-width:46.24em) { .navigation__menu { width: 100% } } .navigation__side { float: right; width: 400px; height: 100% } @media (max-width:1120px) { .navigation__side { width: 320px } } @media (max-width:46.24em) { .navigation__side { width: 100%; float: none } } .navigation__icons { fill: #fff; text-align: center; position: absolute; right: 0; bottom: 10px; left: 0 } .navigation__icons .logo-black { display: none } @media (max-height:610px) { .navigation__icons { margin-top: 25px; margin-bottom: 25px; position: relative; bottom: auto } } @media (max-width:46.24em) { .navigation__icons { position: relative; bottom: auto; margin-top: 25px; margin-bottom: 25px } .navigation__icons .social-icons__link { -webkit-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8) } } .navigation__video { position: absolute; top: 0; height: 90%; width: 90%; background-color: #000 } .navigation__video video { position: absolute; top: 0; right: 0; height: auto; width: auto; min-width: 100%; min-height: 100%; -webkit-transform: translate(46%, -8%); -ms-transform: translate(46%, -8%); transform: translate(46%, -8%); outline: none } @media (max-width:61.24em) { .navigation__video { display: none } } .menu { height: 100% } @media (max-width:46.24em) { .menu { height: auto } } .menu__list { height: 100% } .menu__list:after { clear: both; content: ""; display: table } @media (max-width:46.24em) { .menu__list { position: absolute; top: 150px; right: 0; left: 0; height: auto } } .menu__item { width: 33.333333%; float: left; height: 100%; border-right: 1px solid rgba(0,0,0,.1); background-color: #fff; position: relative; -webkit-transition: width .5s cubic-bezier(.23, 1, .32, 1), background-color .2s cubic-bezier(.23, 1, .32, 1); transition: width .5s cubic-bezier(.23, 1, .32, 1), background-color .2s cubic-bezier(.23, 1, .32, 1) } @media (max-width:61.24em) { .menu__item { width: 100%; float: none; height: 33.333333%; border-right: none; border-bottom: 1px solid rgba(0,0,0,.1) } } @media (max-width:46.24em) { .menu__item { height: 55px; background-color: #fff; border-bottom: 1px solid rgba(0,0,0,.1); width: auto } .menu__item br { display: none } } .menu__item:last-child { border-right: 1px solid hsla(0,0%,100%,.1) } @media (max-width:61.24em) { .menu__item:last-child { border-right: none } } .menu__item.current { width: 40%; background-color: transparent } @media (max-width:61.24em) { .menu__item.current { width: 100% } } @media (max-width:46.24em) { .menu__item.current { width: auto; background-color: #fff } } .menu__item.not-current { width: 30% } @media (max-width:61.24em) { .menu__item.not-current { width: 100% } } @media (max-width:46.24em) { .menu__item.not-current { width: auto } } .menu__item.not-current .menu__title { font-size: 1.5rem } @media (max-width:46.24em) { .menu__item.not-current .menu__title { font-size: 1rem } } .menu__link { display: block; height: 100% } .menu__link:hover { text-decoration: none } .menu__content { display: block; height: 100%; text-align: center } .menu__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .menu__title { display: inline-block; font-size: 1.875rem; line-height: 1.167; font-family: Roboto, Arial, sans-serif; font-weight: 700; font-style: normal; position: relative; max-width: 260px; margin: 0 auto; padding: 0 10px; -webkit-transition: color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) 0s, color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) 0s, color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) 0s; -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px) } @media (max-width:1120px) { .menu__title { font-size: 1.5625rem } } @media (max-width:61.24em) { .menu__title { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0) } } @media (max-width:46.24em) { .menu__title { font-size: 1rem; max-width: 100%; color: #000 } } .menu__link:hover .menu__title { -webkit-transition: color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.455, .03, .515, .955) 0s; transition: color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.455, .03, .515, .955) 0s; transition: transform .3s cubic-bezier(.455, .03, .515, .955) 0s, color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: transform .3s cubic-bezier(.455, .03, .515, .955) 0s, color .3s cubic-bezier(.23, 1, .32, 1) 0s, font-size .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.455, .03, .515, .955) 0s; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); color: #fff } @media (max-width:46.24em) { .menu__link:hover .menu__title { color: #000 } } .menu__title:before { content: ""; position: absolute; top: -30px; left: 50%; height: 17px; width: 1px; background-color: rgba(0,0,0,.2); -webkit-transition: all .3s cubic-bezier(.23, 1, .32, 1) .3s; transition: all .3s cubic-bezier(.23, 1, .32, 1) .3s } .menu__link:hover .menu__title:before { -webkit-transition: all .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: all .3s cubic-bezier(.23, 1, .32, 1) 0s; position: absolute; top: auto; bottom: -60px; left: 50%; height: 30px; width: 1px; background-color: hsla(0,0%,100%,.2) } @media (max-width:61.24em) { .menu__link:hover .menu__title:before { position: absolute; top: -30px; left: 50%; height: 17px; width: 1px } } @media (max-width:46.24em) { .menu__title:before { display: none } } .menu__parag { visibility: hidden; font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; color: hsla(0,0%,100%,.4); max-width: 220px; display: block; height: 60px; margin: 90px auto 40px; -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1) .1s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) .1s; transition: opacity .3s cubic-bezier(.23, 1, .32, 1) .1s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) .1s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) .1s, opacity .3s cubic-bezier(.23, 1, .32, 1) .1s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) .1s, opacity .3s cubic-bezier(.23, 1, .32, 1) .1s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) .1s; opacity: 0; -webkit-transform: translateY(40px); -ms-transform: translateY(40px); transform: translateY(40px) } .menu__link:hover .menu__parag.empty { margin-top: 60px } .menu__link:hover .menu__parag { -webkit-transition: opacity .4s cubic-bezier(.23, 1, .32, 1) .15s, -webkit-transform .4s cubic-bezier(.23, 1, .32, 1) .15s; transition: opacity .4s cubic-bezier(.23, 1, .32, 1) .15s, -webkit-transform .4s cubic-bezier(.23, 1, .32, 1) .15s; transition: transform .4s cubic-bezier(.23, 1, .32, 1) .15s, opacity .4s cubic-bezier(.23, 1, .32, 1) .15s; transition: transform .4s cubic-bezier(.23, 1, .32, 1) .15s, opacity .4s cubic-bezier(.23, 1, .32, 1) .15s, -webkit-transform .4s cubic-bezier(.23, 1, .32, 1) .15s; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible; height: auto } @media (max-width:61.24em) { .menu__parag { display: none } } .menu__button { visibility: hidden; margin: 0 auto; -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: opacity .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) 0s, opacity .3s cubic-bezier(.23, 1, .32, 1) 0s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) 0s, opacity .3s cubic-bezier(.23, 1, .32, 1) 0s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) 0s; opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px) } .menu__link:hover .menu__button { -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1) .25s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) .25s; transition: opacity .3s cubic-bezier(.23, 1, .32, 1) .25s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) .25s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) .25s, opacity .3s cubic-bezier(.23, 1, .32, 1) .25s; transition: transform .3s cubic-bezier(.23, 1, .32, 1) .25s, opacity .3s cubic-bezier(.23, 1, .32, 1) .25s, -webkit-transform .3s cubic-bezier(.23, 1, .32, 1) .25s; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; visibility: visible } @media (max-width:61.24em) { .menu__button { display: none } } .navigation__side-content { padding: 100px 60px 0; height: 100%; position: relative } @media (max-width:1120px) { .navigation__side-content { padding: 100px 30px 0 } } @media (max-width:46.24em) { .navigation__side-content { padding-top: 25px } } .navigation__logo { height: 200px; width: 200px; margin: auto } @media (max-width:46.24em) { .navigation__logo, .navigation__logo svg { height: 100px; width: 100px } } .navigation__parag { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; color: #fff; max-width: 220px; margin: 50px auto 70px; text-align: center; position: relative } .navigation__parag:after { content: ""; position: absolute; bottom: -50px; left: 50%; height: 30px; width: 1px; background-color: hsla(0,0%,100%,.2) } @media (max-width:46.24em) { .navigation__parag { margin: 220px auto 20px; font-size: .8125rem } .navigation__parag:after { display: none } } .sidemenu__item { font-size: 1.5rem; line-height: 1.5; margin: 10px 0; text-align: center; font-family: Roboto, Arial, sans-serif; font-weight: 700; font-style: normal } @media (max-width:46.24em) { .sidemenu__item { font-size: .875rem } } .sidemenu__link { color: #fff } .sidemenu__link:hover { text-decoration: none; color: hsla(0,0%,100%,.4) } .menu__content { -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); opacity: 0 } .open-menu .menu__content { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; -webkit-transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1) } .menu__item:first-child .menu__content { -webkit-transition-delay: 0s; transition-delay: 0s } .menu__item:nth-child(2) .menu__content { -webkit-transition-delay: .05s; transition-delay: .05s } .menu__item:nth-child(3) .menu__content { -webkit-transition-delay: .1s; transition-delay: .1s } .menu__item:nth-child(4) .menu__content { -webkit-transition-delay: .15s; transition-delay: .15s } .menu__item:nth-child(5) .menu__content { -webkit-transition-delay: .2s; transition-delay: .2s } .navigation__logo, .navigation__parag { -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); opacity: 0 } .open-menu .navigation__logo, .open-menu .navigation__parag { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; -webkit-transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1) } .navigation__logo { -webkit-transition-delay: .15s; transition-delay: .15s } .navigation__parag { -webkit-transition-delay: .2s; transition-delay: .2s } .navigation__icons .social-icons__item { -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); opacity: 0; -webkit-transition: none; transition: none } .open-menu .navigation__icons .social-icons__item { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; -webkit-transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1) } .navigation__icons .social-icons__item:first-child { -webkit-transition-delay: .35s; transition-delay: .35s } .navigation__icons .social-icons__item:nth-child(2) { -webkit-transition-delay: .4s; transition-delay: .4s } .navigation__icons .social-icons__item:nth-child(3) { -webkit-transition-delay: .45s; transition-delay: .45s } .navigation__icons .social-icons__item:nth-child(4) { -webkit-transition-delay: .5s; transition-delay: .5s } .navigation__icons .social-icons__item:nth-child(5) { -webkit-transition-delay: .55s; transition-delay: .55s } .sidemenu__item { -webkit-transform: translateY(100px); -ms-transform: translateY(100px); transform: translateY(100px); opacity: 0 } .open-menu .sidemenu__item { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; -webkit-transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1); transition: transform 1s cubic-bezier(.075, .82, .165, 1), opacity 2s cubic-bezier(.075, .82, .165, 1), -webkit-transform 1s cubic-bezier(.075, .82, .165, 1) } .sidemenu__item:first-child { -webkit-transition-delay: .25s; transition-delay: .25s } .sidemenu__item:nth-child(2) { -webkit-transition-delay: .3s; transition-delay: .3s } .sidemenu__item:nth-child(3) { -webkit-transition-delay: .35s; transition-delay: .35s } .sidemenu__item:nth-child(4) { -webkit-transition-delay: .4s; transition-delay: .4s } .sidemenu__item:nth-child(5) { -webkit-transition-delay: .45s; transition-delay: .45s } /*! formstone v0.6.14 [dropdown.css] 2015-06-23 | MIT License | formstone.it */.fs-dropdown { position: relative; z-index: 1; display: block; margin: 10px 0; max-width: 100% } .fs-dropdown:focus { box-shadow: none; outline: none } .fs-dropdown, .fs-dropdown *, .fs-dropdown:after, .fs-dropdown :after, .fs-dropdown:before, .fs-dropdown :before { box-sizing: border-box; -webkit-transition: none; transition: none; -webkit-user-select: none!important; -moz-user-select: none!important; -ms-user-select: none!important; user-select: none!important } .fs-dropdown-element { width: 100%; height: 100%; position: absolute; left: 0; opacity: 0; z-index: -1 } .fs-dropdown-element, .fs-dropdown-element:focus { outline: none; -webkit-tap-highlight-color: rgba(255,255,255,0); -webkit-tap-highlight-color: transparent } .no-opacity .fs-dropdown-element { left: -999999px } .fs-dropdown-selected { width: 100%; position: relative; background: #fff; border: 2px solid rgba(0,0,0,.2); color: #222; cursor: pointer; display: block; height: 54px; line-height: 54px; margin: 0; overflow: hidden; padding: 0 40px 0 20px; text-align: left; text-overflow: clip; z-index: 2; border-radius: 27px; -webkit-transition: border-radius .2s cubic-bezier(.23, 1, .32, 1); transition: border-radius .2s cubic-bezier(.23, 1, .32, 1); font-size: .6875rem; line-height: 40px; letter-spacing: .1em; text-transform: uppercase; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal } .fs-dropdown-selected:after { height: 0; width: 0; position: absolute; top: 0; right: 20px; bottom: 0; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #000; content: ""; display: block; margin: auto 0 } .no-touch .fs-dropdown-selected:hover { color: #222 } .no-touch .fs-dropdown-disabled .fs-dropdown-selected:hover { color: #ccc } .fs-dropdown-options { width: 100%; max-height: 260px; position: absolute; top: 100%; left: 0; border: 1px solid #ccc; border-width: 0 1px 1px; border-radius: 0; box-shadow: none; background-color: #fff; display: none; margin: 0; overflow: auto; overflow-x: hidden; padding: 0; z-index: 50 } .fs-dropdown-options.fs-scrollbar { position: absolute } .no-opacity .fs-dropdown-options { width: auto } .fs-dropdown-group { color: #999; font-size: 11px; padding: 10px 15px } .fs-dropdown-group, .fs-dropdown-item { border-bottom: 1px solid #ccc; display: block; text-transform: uppercase } .fs-dropdown-item { width: 100%; background: #fff; color: #222; cursor: pointer; font-size: 14px; margin: 0; height: 40px; overflow: hidden; padding: 0 15px; text-align: left; text-decoration: none; text-overflow: ellipsis; font-size: .6875rem; line-height: 40px; letter-spacing: .1em; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal; -webkit-transition: background .2s cubic-bezier(.23, 1, .32, 1); transition: background .2s cubic-bezier(.23, 1, .32, 1) } .fs-dropdown-item_placeholder { display: none } .fs-dropdown-item:hover, .fs-dropdown-item_selected { background: rgba(0,0,0,.1) } .fs-dropdown-item_disabled { color: #999; cursor: default } .fs-dropdown-item:first-child { border-radius: 0 } .fs-dropdown-item:last-child { border-bottom: 0; border-radius: 0 } .no-touch .fs-dropdown-item:hover, .no-touch .fs-dropdown-item_selected:hover { color: #222; background-color: #ddd; border-color: #ccc } .fs-dropdown-item_disabled, .no-touch .fs-dropdown-item_disabled:hover { color: #ccc; background-color: #fff; border-color: #ccc } .fs-dropdown-open { z-index: 3 } .fs-dropdown-open .fs-dropdown-options { display: block; border-radius: 0 } .fs-dropdown-open .fs-dropdown-selected { z-index: 51; border-radius: 0 } .fs-dropdown-focus .fs-dropdown-selected, .fs-dropdown-open .fs-dropdown-selected { background-color: #fff; box-shadow: none } .fs-dropdown-cover.fs-dropdown-open .fs-dropdown-selected { z-index: 49 } .fs-dropdown-cover .fs-dropdown-options { top: 0; border-radius: 0; border-width: 1px } .fs-dropdown-cover .fs-dropdown-item:first-child { border-radius: 0 } .fs-dropdown-bottom .fs-dropdown-options { top: auto; bottom: 100%; border-width: 1px 1px 0 } .fs-dropdown-bottom .fs-dropdown-item:last-child { border: none } .fs-dropdown-bottom.fs-dropdown-open .fs-dropdown-options, .fs-dropdown-bottom.fs-dropdown-open .fs-dropdown-selected { border-radius: 0 } .fs-dropdown-bottom.fs-dropdown-cover .fs-dropdown-options { top: auto; bottom: 0 } .fs-dropdown-bottom.fs-dropdown-cover.fs-dropdown-open .fs-dropdown-options, .fs-dropdown-bottom.fs-dropdown-cover.fs-dropdown-open .fs-dropdown-selected { border-radius: 0 } .fs-dropdown-multiple .fs-dropdown-options { width: 100%; position: static; border-radius: 0; border-width: 1px; box-shadow: none; display: block } .fs-dropdown-disabled .fs-dropdown-selected { background: #fff; border-color: #ccc; color: #ccc; cursor: default } .fs-dropdown-disabled .fs-dropdown-options { background: #fff; border-color: #ccc } .fs-dropdown-disabled .fs-dropdown-group, .fs-dropdown-disabled .fs-dropdown-item { border-color: #ccc; color: #ccc; cursor: default } .fs-dropdown-disabled .fs-dropdown-item, .no-touch .fs-dropdown-disabled .fs-dropdown-item:hover { color: #ccc; background-color: #fff } .fs-dropdown-disabled .fs-dropdown-item_selected, .no-touch .fs-dropdown-disabled .fs-dropdown-item_selected:hover { background: #fafafa } .social-icons:after { clear: both; content: ""; display: table } .social-icons__item { display: inline-block; margin: 5px; vertical-align: middle } .social-icons__item:first-child { -webkit-transition-delay: 0s; transition-delay: 0s } .social-icons__item:nth-child(2) { -webkit-transition-delay: .05s; transition-delay: .05s } .social-icons__item:nth-child(3) { -webkit-transition-delay: .1s; transition-delay: .1s } .social-icons__item:nth-child(4) { -webkit-transition-delay: .15s; transition-delay: .15s } .social-icons__item:nth-child(5) { -webkit-transition-delay: .2s; transition-delay: .2s } .social-icons__item:nth-child(6) { -webkit-transition-delay: .25s; transition-delay: .25s } .social-icons__item:nth-child(7) { -webkit-transition-delay: .3s; transition-delay: .3s } .social-icons__item:first-child { margin-left: 0 } .social-icons__item:first-child a { padding-left: 0 } .social-icons__item:last-child { margin-right: 0 } .social-icons__item:last-child a { padding-right: 0 } .social-icons__link { display: block; padding: 10px; vertical-align: bottom; -webkit-transition: opacity .3s cubic-bezier(.23, 1, .32, 1); transition: opacity .3s cubic-bezier(.23, 1, .32, 1); outline: none } .social-icons__link .icon-logo-wall { position: relative; top: 2px } .social-icons__link .icon-logo-creative-mag { position: relative; top: -4px } .social-icons__link:hover { opacity: .5 } .intro { position: relative; height: 100vh; z-index: 1; background: #fff; overflow: hidden } @media (max-height:610px) { } @media (max-width:46.24em) { .intro { padding-bottom: 40px; height: auto!important } } .intro__content { text-align: center; padding-top: 13% } .intro__logo { -webkit-transition-delay: .3s; transition-delay: .3s } .intro__title { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; font-size: 1.875rem; line-height: 1.5; max-width: 680px; margin: 65px auto 0; position: relative; -webkit-transition-delay: .4s; transition-delay: .4s } .intro__title:before { content: ""; position: absolute; top: -63px; left: 50%; height: 30px; width: 1px; background-color: rgba(0,0,0,.3) } @media (max-width:46.24em) { .intro__title { font-size: 1.25rem; margin-left: 10px; margin-right: 10px } } .intro__button { display: block; position: absolute; bottom: 55px; left: 50%; margin-left: -25px; height: 50px; width: 50px; border-radius: 50%; border: 1px solid #ccc; -webkit-transition: background .2s cubic-bezier(.23, 1, .32, 1), border .2s cubic-bezier(.23, 1, .32, 1); transition: background .2s cubic-bezier(.23, 1, .32, 1), border .2s cubic-bezier(.23, 1, .32, 1) } .intro__button .icon-arrow-bottom { margin: 16px 19px; -webkit-transition: fill .2s cubic-bezier(.23, 1, .32, 1); transition: fill .2s cubic-bezier(.23, 1, .32, 1) } .intro__button:hover { background-color: #000; border: 1px solid #000 } .intro__button:hover .icon-arrow-bottom { fill: #fff } @media (max-width:46.24em) { .intro__button { position: relative; bottom: auto; left: auto; margin-left: auto; margin-right: auto; margin-top: 40px } } .intro__canvas { position: absolute; top: 0; left: 0; z-index: -1 } .intro .animate { -webkit-animation-delay: .5s; animation-delay: .5s } .actions-section { } .actions-section:before { position: absolute; right: 0; bottom: 0; left: 0; background-color: #000; height: 0px } .actions-section--detail { padding-bottom: 100px } .actions-section--detail .action:first-child:before { display: none } .actions-section--detail .action:last-child .action__img { margin-top: -190px } .actions-section--detail:before { display: none } .actions-section.color1, .actions-section.color2, .actions-section.color3, .actions-section.color4, .actions-section.color5, .actions-section.color6 { -webkit-transition: background .4s cubic-bezier(.23, 1, .32, 1); transition: background .4s cubic-bezier(.23, 1, .32, 1) } .actions-section.color1 { background-color: #0094d1 } .actions-section.color1 .quote { color: #b3dff1 } .actions-section.color1 .svg { fill: #b3dff1 } .actions-section.color2 { background-color: #5151a0 } .actions-section.color2 .quote { color: #cbcbe3 } .actions-section.color2 .svg { fill: #cbcbe3 } .actions-section.color3 { background-color: #eb9f10 } .actions-section.color3 .quote { color: #f9e2b7 } .actions-section.color3 .svg { fill: #f9e2b7 } .actions-section.color4 { background-color: #b944a5 } .actions-section.color4 .quote { color: #eac7e4 } .actions-section.color4 .svg { fill: #eac7e4 } .actions-section.color5 { background-color: #e72349 } .actions-section.color5 .quote { color: #f8bdc8 } .actions-section.color5 .svg { fill: #f8bdc8 } .actions-section.color6 { background-color: #a0b53f } .actions-section.color6 .quote { color: #e3e9c5 } .actions-section.color6 .svg { fill: #e3e9c5 } .actions-section .no-result { color: #fff; text-align: center; font-size: 1.0625rem; line-height: 27px; padding-bottom: 26px } @media (max-width:61.24em) { .actions-section { } } .filters { padding: 30px 0 } .filters__list { text-align: center } .filters__item { display: inline-block; font-size: .625rem; text-transform: uppercase; letter-spacing: .15em; font-family: brandon-grotesque, Times New Roman, sans-serif; font-weight: 900; font-style: normal; margin: 8px } .filters__item:first-child { -webkit-transition-delay: 0s; transition-delay: 0s } .filters__item:nth-child(2) { -webkit-transition-delay: .05s; transition-delay: .05s } .filters__item:nth-child(3) { -webkit-transition-delay: .1s; transition-delay: .1s } .filters__item:nth-child(4) { -webkit-transition-delay: .15s; transition-delay: .15s } .filters__item:nth-child(5) { -webkit-transition-delay: .2s; transition-delay: .2s } .filters__item:nth-child(6) { -webkit-transition-delay: .25s; transition-delay: .25s } .filters__item:nth-child(7) { -webkit-transition-delay: .3s; transition-delay: .3s } .filters__link { display: block; color: #fff; line-height: 20px; padding: 5px 20px; border-radius: 17px; border: 2px solid hsla(0,0%,100%,.2); -webkit-transition: color .4s cubic-bezier(.23, 1, .32, 1), background .4s cubic-bezier(.23, 1, .32, 1); transition: color .4s cubic-bezier(.23, 1, .32, 1), background .4s cubic-bezier(.23, 1, .32, 1) } .filters__link.active, .filters__link:hover { border-color: #fff; background-color: #fff; color: #000; text-decoration: none } .actions { margin: 40px 0 } .action, .actions { position: relative } .action { text-align: center; padding: 40px 10px 50px; color: #fff; z-index: 10 } .action:hover { z-index: 20 } .action__title { font-size: 5rem; line-height: 1.25; display: inline-block; -webkit-transition: color .4s cubic-bezier(.23, 1, .32, 1); transition: color .4s cubic-bezier(.23, 1, .32, 1); color: hsla(0,0%,100%,.3); position: relative } @media (max-width:46.24em) { .action__title { font-size: 2.5rem } } .action__title .svg { display: block; width: 18px; height: 10px; opacity: 0; fill: #fff; position: absolute; top: 50%; right: -20px; -webkit-transition: right .4s cubic-bezier(.23, 1, .32, 1), opacity .4s cubic-bezier(.23, 1, .32, 1); transition: right .4s cubic-bezier(.23, 1, .32, 1), opacity .4s cubic-bezier(.23, 1, .32, 1) } .action__title .svg .icon-arrow-right { vertical-align: top } @media (max-width:61.24em) { .action__title .svg { display: none } } .action__title:hover { color: #fff; z-index: 10; text-shadow: 0 20px 13px rgba(35,31,32,.27) } .action__title:hover .svg { opacity: 1; right: -40px } .action__title a { display: block; color: hsla(0,0%,100%,.3); text-decoration: none } .action__title a:hover { color: #fff } .action:before { content: ""; position: absolute; top: 0; left: 50%; z-index: 20; margin-left: -15px; height: 1px; width: 30px; background-color: hsla(0,0%,100%,.2) } .action__hover { visibility: hidden; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 9; text-align: left } .action__hover.active { visibility: visible } .action__hover.active .action__img, .action__hover.active .action__parag { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); opacity: 1 } @media (max-width:61.24em) { .action__hover { display: none } } .action__img { margin-right: 50%; box-shadow: 0 3px 30px 0 rgba(0,0,0,.2); max-width: 650px; max-height: 430px; position: relative; -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); opacity: 0; -webkit-transition: opacity .5s cubic-bezier(.23, 1, .32, 1) .1s, -webkit-transform .5s cubic-bezier(.23, 1, .32, 1) .1s; transition: opacity .5s cubic-bezier(.23, 1, .32, 1) .1s, -webkit-transform .5s cubic-bezier(.23, 1, .32, 1) .1s; transition: transform .5s cubic-bezier(.23, 1, .32, 1) .1s, opacity .5s cubic-bezier(.23, 1, .32, 1) .1s; transition: transform .5s cubic-bezier(.23, 1, .32, 1) .1s, opacity .5s cubic-bezier(.23, 1, .32, 1) .1s, -webkit-transform .5s cubic-bezier(.23, 1, .32, 1) .1s } .action__img:before { padding-top: 66.1538461538%; display: block; content: "" } .action__img img { position: absolute; top: 0; left: 0; height: 100%; width: 100% } .action__parag { top: 155px; left: 50%; padding-left: 70px; font-style: italic; font-size: 1.0625rem; line-height: 27px; max-width: 550px; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); opacity: 0; -webkit-transition: opacity .5s cubic-bezier(.23, 1, .32, 1) .2s, -webkit-transform .5s cubic-bezier(.23, 1, .32, 1) .2s; transition: opacity .5s cubic-bezier(.23, 1, .32, 1) .2s, -webkit-transform .5s cubic-bezier(.23, 1, .32, 1) .2s; transition: transform .5s cubic-bezier(.23, 1, .32, 1) .2s, opacity .5s cubic-bezier(.23, 1, .32, 1) .2s; transition: transform .5s cubic-bezier(.23, 1, .32, 1) .2s, opacity .5s cubic-bezier(.23, 1, .32, 1) .2s, -webkit-transform .5s cubic-bezier(.23, 1, .32, 1) .2s } .action__parag, .action__parag .quote { position: absolute; font-family: Droid Serif, Times New Roman, serif; font-weight: 400 } .action__parag .quote { font-style: normal; font-size: 3.125rem; padding-left: 10px; bottom: -10px } .mag-section { max-width: 1300px; max-height: 522px; margin: 110px 10px 0; position: relative } .mag-section__img { background-repeat: no-repeat; background-position: 50%; background-size: cover; position: relative } .mag-section__img:before { padding-top: 40.1538461538%; display: block; content: "" } .mag-section__img:after { content: ""; background-color: rgba(0,0,0,.7) } .mag-section__content, .mag-section__img:after { position: absolute; top: 0; right: 0; bottom: 0; left: 0 } .mag-section__content { height: 100%; width: 100%; text-align: center; padding-top: calc(20% - 105px) } @media (max-width:46.24em) { .mag-section__content { height: auto; width: auto; position: relative; padding: 25px } } .mag-section__baseline { font-family: Roboto, Arial, sans-serif; font-weight: 500; font-style: normal; color: #8f8f8f; font-size: 1.125rem; line-height: 1.5; margin-bottom: 25px } @media (max-width:46.24em) { .mag-section__baseline { margin-bottom: 20px } } .mag-section__title { color: #fff; font-size: 2.1875rem; max-width: 700px; margin: 0 auto 60px; line-height: 1.5; font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal } @media (max-width:46.24em) { .mag-section__title { margin-bottom: 30px; font-size: 1.5rem } } .transitions-section { position: fixed; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100vh; z-index: -10; -webkit-transition: -webkit-transform .3s cubic-bezier(.55, .085, .68, .53) .15s; transition: -webkit-transform .3s cubic-bezier(.55, .085, .68, .53) .15s; transition: transform .3s cubic-bezier(.55, .085, .68, .53) .15s; transition: transform .3s cubic-bezier(.55, .085, .68, .53) .15s, -webkit-transform .3s cubic-bezier(.55, .085, .68, .53) .15s; background: #000 } .transitions-section.translate { -webkit-transform: translate(-100%); -ms-transform: translate(-100%); transform: translate(-100%) } .transitions-section.visible { opacity: 1 } .intro__canvas--action { z-index: -2; position: fixed; top: 0; left: 0 } .action-detail { padding-top: 175px; padding-right: 17.5px; padding-left: 17.5px; margin-bottom: 155px } @media (max-width:46.24em) { .action-detail { margin-bottom: 50px; padding-top: 150px } } .action-detail__blackstrip { width: 429px; -webkit-transform-origin: 100% 50%; -ms-transform-origin: 100% 50%; transform-origin: 100% 50%; background-color: #000; z-index: -1; position: absolute; top: 0; right: 0; bottom: -193px; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; -webkit-animation-name: u244ef9a6; animation-name: u244ef9a6 } @-webkit-keyframes u244ef9a6 { 0% { -webkit-transform: scaleX(0); transform: scaleX(0) } to { -webkit-transform: scaleX(1); transform: scaleX(1) } } @keyframes u244ef9a6 { 0% { -webkit-transform: scaleX(0); transform: scaleX(0) } to { -webkit-transform: scaleX(1); transform: scaleX(1) } } @media (max-width:81.24em) { .action-detail__blackstrip { display: none } } @media (min-width:1520px) { .action-detail__blackstrip { right: -58px; width: 487px } } .action-detail.anim-ltr .action-detail__blackstrip { position: absolute; top: 0; right: 429px; bottom: -193px; -webkit-transform: rotate(180deg) scaleX(0); -ms-transform: rotate(180deg) scaleX(0); transform: rotate(180deg) scaleX(0); -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; -webkit-animation-name: u5f3290f8; animation-name: u5f3290f8 } @-webkit-keyframes u5f3290f8 { 0% { -webkit-transform: rotate(180deg) scaleX(0); transform: rotate(180deg) scaleX(0) } to { -webkit-transform: rotate(180deg) scaleX(1); transform: rotate(180deg) scaleX(1) } } @keyframes u5f3290f8 { 0% { -webkit-transform: rotate(180deg) scaleX(0); transform: rotate(180deg) scaleX(0) } to { -webkit-transform: rotate(180deg) scaleX(1); transform: rotate(180deg) scaleX(1) } } @media (min-width:1520px) { .action-detail.anim-ltr .action-detail__blackstrip { width: 487px } } @media (max-width:81.24em) { .action-detail.anim-ltr .action-detail__blackstrip { display: none } } @media (min-width:81.25em) { .action-detail.anim-ltr .action-detail__sidebar { -webkit-transition: none!important; transition: none!important; -webkit-transform: none!important; -ms-transform: none!important; transform: none!important } } .action-detail.anim-rtl .action-detail__blackstrip { position: absolute; top: 0; right: 0; bottom: -193px; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; animation: 1s cubic-bezier(.23, 1, .32, 1) .3s forwards; -webkit-animation-name: u51029242; animation-name: u51029242 } @-webkit-keyframes u51029242 { 0% { -webkit-transform: scaleX(0); transform: scaleX(0) } to { -webkit-transform: scaleX(1); transform: scaleX(1) } } @keyframes u51029242 { 0% { -webkit-transform: scaleX(0); transform: scaleX(0) } to { -webkit-transform: scaleX(1); transform: scaleX(1) } } @media (min-width:1520px) { .action-detail.anim-rtl .action-detail__blackstrip { right: -58px; width: 487px } } @media (max-width:81.24em) { .action-detail.anim-rtl .action-detail__blackstrip { display: none } } @media (min-width:81.25em) { .action-detail.anim-rtl .action-detail__sidebar { -webkit-transition: none!important; transition: none!important; -webkit-transform: none!important; -ms-transform: none!important; transform: none!important } } .action-detail__header { padding-bottom: 80px; position: relative } @media (max-width:81.24em) { .action-detail__header { padding-bottom: 60px } } @media (max-width:46.24em) { .action-detail__header { padding-bottom: 30px } } .action-detail__navigation { position: absolute; top: 93px; left: -95px } @media (max-width:81.24em) { .action-detail__navigation { left: 0 } } @media (max-width:46.24em) { .action-detail__navigation { top: 60px; -webkit-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8) } } @media (max-width:22.49em) { .action-detail__navigation { -webkit-transform: scale(.6); -ms-transform: scale(.6); transform: scale(.6); top: 47px } } .action-detail__media { max-width: 1085px; max-height: 615px; -webkit-transition: opacity .5s cubic-bezier(.075, .82, .165, 1) .6s, -webkit-transform 1s cubic-bezier(.075, .82, .165, 1) .6s!important; transition: opacity .5s cubic-bezier(.075, .82, .165, 1) .6s, -webkit-transform 1s cubic-bezier(.075, .82, .165, 1) .6s!important; transition: opacity .5s cubic-bezier(.075, .82, .165, 1) .6s, transform 1s cubic-bezier(.075, .82, .165, 1) .6s!important; transition: opacity .5s cubic-bezier(.075, .82, .165, 1) .6s, transform 1s cubic-bezier(.075, .82, .165, 1) .6s, -webkit-transform 1s cubic-bezier(.075, .82, .165, 1) .6s!important; position: relative; margin-left: -75px } .action-detail__media:before { padding-top: 56.6820276498%; display: block; content: "" } .action-detail__media img { position: absolute; top: 0; left: 0; height: 100%; width: 100% } .action-detail__media .media-btn { position: absolute; top: 50%; left: 50%; height: 50px; width: 180px; margin-top: -25px; margin-left: -90px } .action-detail__media .media-video { position: absolute; top: 0; left: 0; height: 100%; width: 100% } @media (max-width:81.24em) { .action-detail__media { margin-left: 0; max-width: 1105px } } .action-detail__main { position: relative } .action-detail__main:after { clear: both; content: ""; display: table } .action-detail__description { width: calc(100% - 476px); padding-top: 106px; float: left } @media (max-width:46.24em) { .action-detail__description { width: 100%; float: none; padding-top: 40px } } .action-detail__sidebar { float: right; width: 429px; padding-top: 82px; margin-right: -17.5px } @media only screen and (min-width:1520px) { .action-detail__sidebar { width: 487px; margin-right: -75.5px } } @media (max-width:81.24em) { .action-detail__sidebar { margin-right: 0; background: #000 } } @media (min-width:81.25em) { .action-detail__sidebar { -webkit-transition: none!important; transition: none!important; -webkit-transform: none!important; -ms-transform: none!important; transform: none!important } } @media (max-width:46.24em) { .action-detail__sidebar { width: 100%; float: none; padding-top: 40px } } .action-detail__side-content { padding-right: 70px; padding-left: 70px } @media (max-width:46.24em) { .action-detail__side-content { padding-right: 20px; padding-left: 20px } } .action-detail__side-icons { padding: 35px 55px 85px } .action-detail__side-icons:after { clear: both; content: ""; display: table } .action-detail__operator { font-size: .875rem; line-height: 2.143; padding-bottom: 15px; font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: italic; color: rgba(0,0,0,.8); position: relative } .action-detail__operator:after { content: ""; position: absolute; bottom: 0; left: 0; height: 1px; width: 30px; background-color: #ccc } .action-detail__operator a:hover { text-decoration: none; color: rgba(0,0,0,.5) } .action-detail__title { font-size: 6.25rem; line-height: .9; margin-top: 40px; max-width: 600px } @media (max-width:81.24em) { .action-detail__title { margin-bottom: 20px; margin-left: 90px } } @media (max-width:61.24em) { .action-detail__title { font-size: 5rem; max-width: 500px } } @media (max-width:46.24em) { .action-detail__title { font-size: 3.75rem; margin-top: 25px; margin-bottom: 25px; margin-left: 60px; max-width: 400px; min-height: 108px } } @media (max-width:22.49em) { .action-detail__title { font-size: 2.5rem; min-height: 72px } } .action-detail__link { position: absolute; top: 161px; right: 0; width: 412px; padding-left: 65px } @media (max-width:81.24em) { .action-detail__link { width: auto } .action-detail__link .btn-link { color: #000 } .action-detail__link .btn-link svg { fill: #000 } .action-detail__link .btn-link:hover .round { background-color: #000 } .action-detail__link .btn-link:hover svg { fill: #fff } } @media (max-width:46.24em) { .action-detail__link { position: static; padding-left: 0 } } .action-detail__description h2 { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; font-size: 1.875rem; line-height: 1.233; margin-bottom: 50px } @media (max-width:46.24em) { .action-detail__description h2 { margin-bottom: 30px } } .action-detail__description p { padding: 0 0 30px } .action-detail__text { -webkit-columns: 2; -moz-columns: 2; columns: 2; -webkit-column-gap: 60px; -moz-column-gap: 60px; column-gap: 60px; color: rgba(0,0,0,.5) } .action-detail__text p { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid-column } @media (max-width:61.24em) { .action-detail__text { -webkit-columns: 1; -moz-columns: 1; columns: 1; -webkit-column-gap: 0; -moz-column-gap: 0; column-gap: 0 } } .action-detail__side-content { color: #fff } .action-detail__side-content h3 { color: #fff; font-family: Roboto, Arial, sans-serif; font-weight: 500; font-style: normal; font-size: 1.375rem; line-height: 1.364; margin-bottom: 50px } .action-detail__side-content p { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: italic; font-size: .8125rem; line-height: 2.077; color: hsla(0,0%,100%,.5) } .action-detail__operator { -webkit-transition-delay: .2s; transition-delay: .2s } .action-detail__title { -webkit-transition-delay: .3s; transition-delay: .3s } .action-detail__link { -webkit-transition-delay: .5s; transition-delay: .5s } .action-detail__media { -webkit-transition-delay: .6s; transition-delay: .6s } @media (min-height:900px) { .action-detail__media .media-btn { -webkit-transition-delay: .7s; transition-delay: .7s } } @media (max-width:46.24em) { .action-detail__media .media-btn { -webkit-transition-delay: .7s; transition-delay: .7s } } .action-detail__side-content h3 { -webkit-transition-delay: .1s; transition-delay: .1s } .action-detail__side-content p { -webkit-transition-delay: .4s; transition-delay: .4s } .pageScrollerNav { position: fixed; z-index: 5; overflow: visible; top: calc(50% - 90px); left: 35px } @media (max-width:81.24em) { .pageScrollerNav { display: none } } .pageScrollerNav ul { display: block; width: 40px } .pageScrollerNav li { display: block } .pageScrollerNav li a { display: block; position: relative; overflow: hidden; height: 40px; width: 30px; text-indent: -9999px; -webkit-transition: width .2s cubic-bezier(.55, .085, .68, .53); transition: width .2s cubic-bezier(.55, .085, .68, .53) } .pageScrollerNav li a:after { content: ""; display: block; width: 100%; height: 1px; position: absolute; top: 50%; left: 0; background: hsla(0,0%,50%,.2) } .pageScrollerNav li.active a, .pageScrollerNav li:hover a { width: 40px } .pageScrollerNav li.active a:after, .pageScrollerNav li:hover a:after { background: gray } .about { background-color: #fff; color: #000; position: relative; padding-bottom: 70px } .about__video { position: absolute; top: 0; height: 1000px; width: 100%; background-image: url(/Public/Home/assets/images/about-bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: 50% } @media (min-width:1500px) { .about__video { height: 100%; width: 100% } } .about__video video { position: absolute; top: 50%; left: 50%; height: auto; width: auto; min-width: 100%; min-height: 100%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); outline: none } @media (max-width:61.24em) { .about__video video { display: none } } .about__perso { position: absolute; right: -100px; bottom: -70px; width: 1045px; z-index: 0 } .about__perso img { display: block; width: 100% } @media (max-width:81.24em) { .about__perso { width: 750px; position: absolute; right: 0; bottom: -70px } } @media (max-width:61.24em) { .about__perso { width: 600px } } @media (max-width:46.24em) { .about__perso { width: 300px; right: 50px } } .about__intro { padding: 80px 0 70px; text-align: center; margin-bottom: 0 } @media (max-width:61.24em) { .about__intro { padding-bottom: 0 } } .about__icons { margin-bottom: 10px } .about__icons:after { clear: both; content: ""; display: table } .about__title { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; font-size: 1.875rem; line-height: 1.5; max-width: 680px; margin: 65px auto 0; padding: 0 10px; position: relative; color: #fff } .about__title:before { content: ""; position: absolute; top: -63px; left: 50%; height: 30px; width: 1px; background-color: hsla(0,0%,100%,.2) } .about__content { padding: 80px 0; margin: 0 17.5px; position: relative; z-index: 1 } .about__content .about-subtitle, .about__content .about-title { color: #000 } .about__content p { color: rgba(0,0,0,.5); font-size: 1rem; line-height: 2 } .about__content .columns2-right:before { background-color: rgba(0,0,0,.2) } .about--white { background-color: #000; color: #fff } .about--white .about__content .about-title { color: #fff } .about--white .about__content .about-subtitle, .about--white .about__content p { color: hsla(0,0%,100%,.5) } .about--white .about__content .column1-medium-right:before, .about--white .about__content .columns2-right:before { background-color: hsla(0,0%,100%,.2) } .about-title { font-size: 4.375rem; line-height: 1; padding-top: 30px; padding-bottom: 30px; margin-bottom: 5px } @media (max-width:46.24em) { .about-title { font-size: 2.8125rem } } @media (max-width:22.49em) { .about-title { font-size: 2.25rem } } .about-title--border { position: relative; margin-bottom: 25px } .about-title--border:before { content: ""; position: absolute; bottom: 5px; left: 0; height: 1px; width: 30px; background-color: rgba(0,0,0,.2) } .about-subtitle { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; font-size: 1.25rem; line-height: 1.8; max-width: 670px; padding-bottom: 20px } @media (max-width:22.49em) { .about-subtitle { font-size: 1rem; padding-bottom: 10px } } .about-1 { padding-bottom: 170px } @media (max-width:81.24em) { .about-1 { padding-bottom: 0 } } .about-3 .about__content { padding-bottom: 50px } .columns2-right { -webkit-columns: 2; -moz-columns: 2; columns: 2; -webkit-column-gap: 35px; -moz-column-gap: 35px; column-gap: 35px; padding-left: 33.333333%; position: relative; margin-top: 30px; padding-top: 45px } .columns2-right:before { content: ""; position: absolute; top: 0; left: 0; height: 1px; width: calc(33.333333% - 35px) } .columns2-right p { -webkit-column-break-inside: avoid; page-break-inside: avoid; break-inside: avoid-column } @media (max-width:61.24em) { .columns2-right { padding-left: 0 } .columns2-right:before { height: 1px; width: 280px } } @media (max-width:46.24em) { .columns2-right { -webkit-columns: 1; -moz-columns: 1; columns: 1; -webkit-column-gap: 0; -moz-column-gap: 0; column-gap: 0 } } .column1-small-left { max-width: 345px } @media (max-width:46.24em) { .column1-small-left { padding-bottom: 100px; margin: auto } } .column1-medium-right { padding-left: 33.333333%; position: relative; margin-top: 30px; padding-top: 45px } .column1-medium-right:before { content: ""; position: absolute; top: 0; left: 0; height: 1px; width: calc(33.333333% - 35px) } @media (max-width:61.24em) { .column1-medium-right { padding-left: 0 } .column1-medium-right:before { height: 1px; width: 280px } } .our-values { text-align: center; position: relative; color: #fff; overflow: hidden } .our-values.black-background { background: #000 } .our-values__video { position: absolute; top: 0; height: 100%; width: 100%; background-image: url(/Public/Home/assets/images/about-bg.jpg); background-repeat: no-repeat; background-size: cover; background-position: 50%; z-index: -1 } .our-values__video video { position: absolute; top: 50%; left: 50%; height: auto; width: auto; min-width: 100%; min-height: 100%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } @media (max-width:61.24em) { .our-values__video video { display: none } } .our-values__content { padding: 105px 0; text-align: center } .our-values__baseline { font-family: Roboto, Arial, sans-serif; font-weight: 500; font-style: normal; color: hsla(0,0%,100%,.2); font-size: 1.125rem; line-height: 1.5; margin-bottom: 10px } .our-values__title { color: #fff; font-size: 2.1875rem; line-height: 1.5; font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; margin-bottom: 30px } .our-values__button { margin: auto; display: block; height: 50px; width: 50px; border-radius: 50%; border: 2px solid hsla(0,0%,100%,.2); -webkit-transition: background .2s cubic-bezier(.23, 1, .32, 1); transition: background .2s cubic-bezier(.23, 1, .32, 1) } .our-values__button .icon-arrow-bottom { fill: #fff; margin: 15px 18px; -webkit-transition: fill .2s cubic-bezier(.23, 1, .32, 1); transition: fill .2s cubic-bezier(.23, 1, .32, 1) } .our-values__button:hover { background-color: #fff } .our-values__button:hover .icon-arrow-bottom { fill: #000 } .about__logo { -webkit-transition-delay: .2s; transition-delay: .2s } .about__title { -webkit-transition-delay: .3s; transition-delay: .3s } .about-1 .about-title { -webkit-transition-delay: .4s; transition-delay: .4s } @media (min-height:900px) { .about-1 .about-subtitle { -webkit-transition-delay: .5s; transition-delay: .5s } } .contact__main { padding: 225px 0 90px; margin: 0 17.5px } .contact__main:after { clear: both; content: ""; display: table } @media (max-width:46.24em) { .contact__main { padding-top: 150px; padding-bottom: 0 } } .contact__sidebar { width: 345px; float: left } @media (max-width:46.24em) { .contact__sidebar { width: 100%; float: none } } .contact__content { float: right; width: calc(100% - 380px); padding: 200px 42px 0 } @media (max-width:46.24em) { .contact__content { width: 100%; float: none; padding: 20px 0 0 } } .contact__title { font-family: Droid Serif, Times New Roman, serif; font-weight: 400; font-style: normal; font-size: 1.875rem; line-height: 1.333; padding: 40px 0 } .contact__parag { font-size: 1rem; line-height: 2; color: rgba(0,0,0,.5); padding: 20px 0; max-width: 275px } .contact__parag, .contact__title { position: relative } .contact__parag:before, .contact__title:before { content: ""; position: absolute; top: 0; left: 0; height: 1px; width: 30px; background-color: rgba(0,0,0,.2) } .contact__title { -webkit-transition-delay: .2s; transition-delay: .2s } .contact__parag { -webkit-transition-delay: .3s; transition-delay: .3s } .contact__content { -webkit-transition-delay: .4s; transition-delay: .4s } /* FILE ARCHIVED ON 00:49:35 Aug 24, 2018 AND RETRIEVED FROM THE INTERNET ARCHIVE ON 00:11:58 Jul 18, 2024. JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE. ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C. SECTION 108(a)(3)). */ /* playback timings (ms): captures_list: 1.147 exclusion.robots: 0.145 exclusion.robots.policy: 0.126 esindex: 0.019 cdx.remote: 32.608 LoadShardBlock: 266.519 (3) PetaboxLoader3.datanode: 235.939 (4) PetaboxLoader3.resolve: 173.565 (2) load_resource: 180.905 */