/* Box sizing rules */ *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } /* Remove default padding */ ul[class], ol[class] { padding: 0; } /* Remove default margin */ body, h1, h2, h3, h4, p, ul[class], ol[class], li, figure, figcaption, blockquote, dl, dd { margin: 0; } /* Set core body defaults */ body { min-height: 100vh; scroll-behavior: smooth; text-rendering: optimizeSpeed; line-height: 1.5; } /* Remove list styles on ul, ol elements with a class attribute */ ul[class], ol[class] { list-style: none; } /* A elements that don't have a class get default styles */ a:not([class]) { -webkit-text-decoration-skip: ink; text-decoration-skip-ink: auto; } /* Make images easier to work with */ img { max-width: 100%; display: block; } /* Inherit fonts for inputs and buttons */ input, button, textarea, select { font: inherit; } /* Remove all animations and transitions for people that prefer not to see them */ @media (prefers-reduced-motion: reduce) { * { -webkit-animation-duration: 0.01ms !important; animation-duration: 0.01ms !important; -webkit-animation-iteration-count: 1 !important; animation-iteration-count: 1 !important; -webkit-transition-duration: 0.01ms !important; -o-transition-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; } } html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } a { text-decoration: none; color: inherit; } :root { --primary-colour: #ed008c; --secondary-colour: #ed008c; } .colour--white { color: #fff !important; } .colour--primary { color: #ed008c !important; } .colour--secondary { color: #ed008c !important; } .clearfix:before, .clearfix:after { content: ''; display: table; } .clearfix:after { clear: both; } .embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } html { font-size: 10px; } body { font-weight: 400; font-size: 1.6rem; } h1, .h1 { font-size: 5rem; font-weight: 700; font-family: 'urw-din', sans-serif; margin-bottom: 1.5rem; } h2, .h2 { font-size: 4rem; font-weight: 300; font-family: 'urw-din', sans-serif; margin-bottom: 1.5rem; } h3, .h3 { font-size: 2.8rem; font-weight: 700; font-family: 'urw-din', sans-serif; margin-bottom: 1.5rem; } h4, .h4 { font-size: 2.4rem; font-weight: 700; font-family: 'urw-din', sans-serif; margin-bottom: 1.5rem; } h5, .h5 { font-size: 2rem; font-family: 'urw-din', sans-serif; font-weight: 100; margin-bottom: 1.5rem; } h6, .h6 { font-size: 1.8rem; font-weight: 500; font-family: 'urw-din', sans-serif; margin-bottom: 1.5rem; } p, li { font-weight: 300; font-size: 1.6rem; font-family: 'urw-din', sans-serif; line-height: 1.7; margin-bottom: 1.5rem; } html { font-family: 'urw-din', sans-serif; font-weight: 100; } html b { font-weight: 700; } .colour--grey { color: #afa9a9 !important; } .colour--white { color: #fff !important; } .colour--primary { color: #ed008c !important; } .linkable { position: relative; display: inline-block; font-weight: 700; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .linkable:hover { color: #ed008c; } .linkable:hover:before { -webkit-transform: translateX(0.5rem); -ms-transform: translateX(0.5rem); transform: translateX(0.5rem); } .linkable:before { position: absolute; display: block; content: ''; background-image: url('data:image/svg+xml; utf8, '); width: 25px; height: 18px; position: relative; margin-right: 1rem; display: inline-block; vertical-align: middle; top: -1px; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .linkableAlt { position: relative; display: inline-block; font-weight: 700; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); color: #ed008c; } .linkableAlt:hover { color: #ed008c; } .linkableAlt:hover:after { -webkit-transform: translateX(0.5rem); -ms-transform: translateX(0.5rem); transform: translateX(0.5rem); } .linkableAlt:after { position: absolute; display: block; content: ''; background-image: url('data:image/svg+xml; utf8, '); width: 45px; height: 18px; position: relative; margin-left: 1rem; display: inline-block; vertical-align: middle; top: -1px; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } strong { font-weight: 700; } sup { font-size: 60%; vertical-align: super; position: relative; -webkit-transform: translateY(20%); -ms-transform: translateY(20%); transform: translateY(20%); display: inline-block; } sup.tm { font-size: 40%; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } .text-center { text-align: center; } img.left { float: left; margin-right: 1rem; } img.right { float: right; margin-left: 1rem; } .icon-checkbox-checked { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: -52px -22px; width: 20px; height: 20px; } .icon-checkbox-focused { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: -26px -26px; width: 20px; height: 20px; } .icon-checkbox-unchecked { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: 0px -52px; width: 20px; height: 20px; } .icon-linkable { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: -52px 0px; width: 25px; height: 18px; } .icon-radio-checked { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: 0px 0px; width: 22px; height: 22px; } .icon-radio-focused { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: -26px 0px; width: 22px; height: 22px; } .icon-radio-unchecked { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: 0px -26px; width: 22px; height: 22px; } .icon-select { display: inline-block; background-image: url(/themes/mercury/dist/scripts/../images/generated/spritefb1bdef09777e9feccf89af54cb2ec5f.png); background-position: -24px -52px; width: 25px; height: 14px; } @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-webkit-min-device-pixel-ratio: 2.5), only screen and (-o-min-device-pixel-ratio: 5/2), only screen and (min-resolution: 240dpi) { .icon-checkbox-checked { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } .icon-checkbox-focused { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } .icon-checkbox-unchecked { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } .icon-linkable { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } .icon-radio-checked { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } .icon-radio-focused { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } .icon-radio-unchecked { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } .icon-select { background-image: url(/themes/mercury/dist/scripts/../images/generated/sprite@2x028fb9a937a7762a55f1650de583cfbf.png); background-size: 38.5px 36px; } } /*------------------------------------------------------------------ Tingle ------------------------------------------------------------------*/ .tingle-modal { position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 1000; display: -webkit-box; display: -ms-flexbox; display: flex; visibility: hidden; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; overflow: hidden; -webkit-overflow-scrolling: touch; background: rgba(255, 255, 255, 0.85); opacity: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; } .tingle-modal__close { display: none; } .tingle-modal .tingle-modal-box { position: relative; -ms-flex-negative: 0; flex-shrink: 0; margin-top: auto; margin-bottom: auto; width: calc(90% - 4rem); max-width: 90rem; opacity: 1; cursor: auto; will-change: transform, opacity; } .tingle-enabled { position: fixed; right: 0; left: 0; overflow: hidden; } .tingle-enabled .tingle-content-wrapper { -webkit-filter: blur(8px); filter: blur(8px); } .tingle-modal--visible { visibility: visible; opacity: 1; } @supports ((-webkit-backdrop-filter: blur(12px)) or (backdrop-filter: blur(12px))) { .tingle-modal:before { position: fixed; top: 0; right: 0; bottom: 0; left: 0; content: ''; -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); } .tingle-enabled .tingle-content-wrapper { -webkit-filter: none; filter: none; } } .modal__close__icon { position: relative; position: absolute; top: -2rem; right: 0; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); width: 5rem; } .modal__close__icon:after { content: ''; position: relative; display: block; padding-bottom: 98.83721%; } .modal__close__icon svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .modal__close__icon polygon { stroke: #ed008c; } /* Slider */ .slick-slider { position: relative; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-slider * { outline: none; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; margin-left: auto; margin-right: auto; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /*------------------------------------------------------------------ Choices ------------------------------------------------------------------*/ /*=============================== = Choices = ===============================*/ .choices { position: relative; margin-bottom: 24px; font-size: 16px; } .choices:focus { outline: none; } .choices:last-child { margin-bottom: 0; } .choices.is-disabled .choices__inner, .choices.is-disabled .choices__input { background-color: #eaeaea; cursor: not-allowed; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .choices.is-disabled .choices__item { cursor: not-allowed; } .choices [hidden] { display: none !important; } .choices[data-type*='select-one'] { cursor: pointer; } .choices[data-type*='select-one'] .choices__inner { padding-bottom: 7.5px; } .choices[data-type*='select-one'] .choices__input { display: block; width: 100%; padding: 10px; border-bottom: 1px solid #dddddd; background-color: #ffffff; margin: 0; } .choices[data-type*='select-one'] .choices__button { background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjMDAwIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==); padding: 0; background-size: 8px; position: absolute; top: 50%; right: 0; margin-top: -10px; margin-right: 25px; height: 20px; width: 20px; border-radius: 10em; opacity: 0.5; } .choices[data-type*='select-one'] .choices__button:hover, .choices[data-type*='select-one'] .choices__button:focus { opacity: 1; } .choices[data-type*='select-one'] .choices__button:focus { -webkit-box-shadow: 0px 0px 0px 2px #00bcd4; box-shadow: 0px 0px 0px 2px #00bcd4; } .choices[data-type*='select-one'] .choices__item[data-value=''] .choices__button { display: none; } .choices[data-type*='select-one']:after { content: ''; height: 0; width: 0; border-style: solid; border-color: #333333 transparent transparent transparent; border-width: 5px; position: absolute; right: 11.5px; top: 50%; margin-top: -2.5px; pointer-events: none; } .choices[data-type*='select-one'].is-open:after { border-color: transparent transparent #333333 transparent; margin-top: -7.5px; } .choices[data-type*='select-one'][dir='rtl']:after { left: 11.5px; right: auto; } .choices[data-type*='select-one'][dir='rtl'] .choices__button { right: auto; left: 0; margin-left: 25px; margin-right: 0; } .choices[data-type*='select-multiple'] .choices__inner, .choices[data-type*='text'] .choices__inner { cursor: text; } .choices[data-type*='select-multiple'] .choices__button, .choices[data-type*='text'] .choices__button { position: relative; display: inline-block; margin-top: 0; margin-right: -4px; margin-bottom: 0; margin-left: 8px; padding-left: 16px; border-left: 1px solid #008fa1; background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjEiIGhlaWdodD0iMjEiIHZpZXdCb3g9IjAgMCAyMSAyMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjRkZGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0yLjU5Mi4wNDRsMTguMzY0IDE4LjM2NC0yLjU0OCAyLjU0OEwuMDQ0IDIuNTkyeiIvPjxwYXRoIGQ9Ik0wIDE4LjM2NEwxOC4zNjQgMGwyLjU0OCAyLjU0OEwyLjU0OCAyMC45MTJ6Ii8+PC9nPjwvc3ZnPg==); background-size: 8px; width: 8px; line-height: 1; opacity: 0.75; border-radius: 0; } .choices[data-type*='select-multiple'] .choices__button:hover, .choices[data-type*='select-multiple'] .choices__button:focus, .choices[data-type*='text'] .choices__button:hover, .choices[data-type*='text'] .choices__button:focus { opacity: 1; } .choices__inner { display: inline-block; vertical-align: top; width: 100%; background-color: #f9f9f9; padding: 7.5px 7.5px 3.75px; border: 1px solid #dddddd; border-radius: 2.5px; font-size: 14px; min-height: 44px; overflow: hidden; } .is-focused .choices__inner, .is-open .choices__inner { border-color: #b7b7b7; } .is-open .choices__inner { border-radius: 2.5px 2.5px 0 0; } .is-flipped.is-open .choices__inner { border-radius: 0 0 2.5px 2.5px; } .choices__list { margin: 0; padding-left: 0; list-style: none; } .choices__list--single { display: inline-block; padding: 4px 16px 4px 4px; width: 100%; } [dir='rtl'] .choices__list--single { padding-right: 4px; padding-left: 16px; } .choices__list--single .choices__item { width: 100%; } .choices__list--multiple { display: inline; } .choices__list--multiple .choices__item { display: inline-block; vertical-align: middle; border-radius: 20px; padding: 4px 10px; font-size: 12px; font-weight: 500; margin-right: 3.75px; margin-bottom: 3.75px; background-color: #00bcd4; border: 1px solid #00a5bb; color: #ffffff; word-break: break-all; -webkit-box-sizing: border-box; box-sizing: border-box; } .choices__list--multiple .choices__item[data-deletable] { padding-right: 5px; } [dir='rtl'] .choices__list--multiple .choices__item { margin-right: 0; margin-left: 3.75px; } .choices__list--multiple .choices__item.is-highlighted { background-color: #00a5bb; border: 1px solid #008fa1; } .is-disabled .choices__list--multiple .choices__item { background-color: #aaaaaa; border: 1px solid #919191; } .choices__list--dropdown { visibility: hidden; z-index: 1; position: absolute; width: 100%; background-color: #ffffff; border: 1px solid #dddddd; top: 100%; margin-top: -1px; border-bottom-left-radius: 2.5px; border-bottom-right-radius: 2.5px; overflow: hidden; word-break: break-all; will-change: visibility; } .choices__list--dropdown.is-active { visibility: visible; } .is-open .choices__list--dropdown { border-color: #b7b7b7; } .is-flipped .choices__list--dropdown { top: auto; bottom: 100%; margin-top: 0; margin-bottom: -1px; border-radius: 0.25rem 0.25rem 0 0; } .choices__list--dropdown .choices__list { position: relative; max-height: 300px; overflow: auto; -webkit-overflow-scrolling: touch; will-change: scroll-position; } .choices__list--dropdown .choices__item { position: relative; padding: 10px; font-size: 14px; } [dir='rtl'] .choices__list--dropdown .choices__item { text-align: right; } @media (min-width: 640px) { .choices__list--dropdown .choices__item--selectable { padding-right: 100px; } .choices__list--dropdown .choices__item--selectable:after { content: attr(data-select-text); font-size: 12px; opacity: 0; position: absolute; right: 10px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } [dir='rtl'] .choices__list--dropdown .choices__item--selectable { text-align: right; padding-left: 100px; padding-right: 10px; } [dir='rtl'] .choices__list--dropdown .choices__item--selectable:after { right: auto; left: 10px; } } .choices__list--dropdown .choices__item--selectable.is-highlighted { background-color: #f2f2f2; } .choices__list--dropdown .choices__item--selectable.is-highlighted:after { opacity: 0.5; } .choices__item { cursor: default; } .choices__item--selectable { cursor: pointer; } .choices__item--disabled { cursor: not-allowed; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; opacity: 0.5; } .choices__heading { font-weight: 600; font-size: 12px; padding: 10px; border-bottom: 1px solid #f7f7f7; color: gray; } .choices__button { text-indent: -9999px; -webkit-appearance: none; -moz-appearance: none; appearance: none; border: 0; background-color: transparent; background-repeat: no-repeat; background-position: center; cursor: pointer; } .choices__button:focus { outline: none; } .choices__input { display: inline-block; vertical-align: baseline; background-color: #f9f9f9; font-size: 14px; margin-bottom: 5px; border: 0; border-radius: 0; max-width: 100%; padding: 4px 0 4px 2px; } .choices__input:focus { outline: 0; } [dir='rtl'] .choices__input { padding-right: 2px; padding-left: 0; } .choices__placeholder { opacity: 0.5; } /*===== End of Choices ======*/ /*------------------------------------------------------------------ Overrides ------------------------------------------------------------------*/ body .blogFilter .choices[data-type*='select-one']:before { background-image: url('data:image/svg+xml; utf8, ') !important; } body .choices[data-type*='select-one']:after { display: none !important; } body .choices[data-type*='select-one']:before { position: absolute; display: block; content: ''; background-image: url('data:image/svg+xml; utf8, '); width: 16px; height: 9px; z-index: 1; right: 1rem; top: 50%; margin-top: -4.5px; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; } body .choices[data-type*='select-one'] .choices__input::-webkit-input-placeholder { color: #e4e4e4; } body .choices[data-type*='select-one'] .choices__input:-moz-placeholder { color: #e4e4e4; } body .choices[data-type*='select-one'] .choices__input::-moz-placeholder { color: #e4e4e4; } body .choices[data-type*='select-one'] .choices__input:-ms-input-placeholder { color: #e4e4e4; } body .choices.is-open[data-type*='select-one']:before { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); } body .choices.is-open .choices__inner { border-color: #e4e4e4; } body .choices.is-open .choices__list--dropdown { border-color: #e4e4e4; } body .choices.is-focused .choices__inner { border-color: #ed008c; } body .choices.is-focused { border-color: #ed008c; outline: 0; -webkit-box-shadow: 0 0 0 2px rgba(237, 0, 140, 0.2); box-shadow: 0 0 0 2px rgba(237, 0, 140, 0.2); } body .choices__inner { min-height: auto; border-radius: 0rem !important; } body .choices__list { padding: 0; } body .choices__list--dropdown { margin-top: 0.5rem; -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); overflow: hidden; border-color: #e4e4e4; border-radius: 0rem !important; } body .choices__list::-webkit-scrollbar-track { background-color: #ebebeb; } body .choices__list::-webkit-scrollbar { width: 5px; background-color: #ebebeb; } body .choices__list::-webkit-scrollbar-thumb { background-color: #ed008c; } body .choices__item { margin: 0; } body .choices__item.is-highlighted { background: #ed008c !important; color: #fff !important; } body .choices__inner + .choices__list { display: none; } body .choices__inner + .choices__list.is-active { display: block; } .banner { overflow: hidden; position: relative; } .banner__push { margin-top: 8rem; } .banner .banner__wrap__colour { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #ed008c; z-index: -2000; } .banner--generic .banner__wrap { width: 100%; padding: 0 2rem; height: auto; background: #1b1a1a; } .banner--generic .banner__wrap__overlay { opacity: 0; } .banner--generic .banner__wrap__content { padding: 24rem 0 10rem; position: relative; left: auto; top: auto; -webkit-transform: none; -ms-transform: none; transform: none; color: #fff; } .banner--generic .banner__wrap__content h1 { font-family: 'urw-din-condensed', sans-serif; font-weight: 900; font-style: normal; font-size: 8rem; color: #fff; line-height: 0.9; } .banner__wrap { width: 100%; height: calc(100vh - 8rem); } .banner__wrap .bannerImage { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center center; background-repeat: no-repeat; } .banner__wrap .bannerImage:after { position: absolute; display: block; content: ''; background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0))); background: -o-linear-gradient(bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); background: linear-gradient(0deg, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); width: 100%; left: 0; bottom: 0; right: 0; z-index: 2; height: 100%; } .banner__wrap__icon { position: relative; position: absolute; width: 50%; opacity: 0.4; margin: 0 auto; bottom: 0%; left: 0%; z-index: 3; -webkit-transform: translateY(20%) translateX(-20%); -ms-transform: translateY(20%) translateX(-20%); transform: translateY(20%) translateX(-20%); } .banner__wrap__icon:after { content: ''; position: relative; display: block; padding-bottom: 52.15827%; } .banner__wrap__icon svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .banner__wrap__overlay { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; background: #000; opacity: 0.65; } .banner__wrap__content { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 100%; max-width: 1280px; padding: 2rem; z-index: 5; margin: 0 auto; } .bannerHome { position: relative; overflow: hidden; padding: 0 2rem; } .bannerHome__background { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center center; background-repeat: no-repeat; z-index: 1; } .bannerHome__background:after { position: absolute; display: block; content: ''; width: 1px; top: 0; right: 40%; bottom: 0; } .bannerHome__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 auto; max-width: 1280px; width: 100%; } .bannerHome__wrap__left { position: relative; z-index: 2; width: 60%; padding: 22rem 0rem 15rem; max-width: 796px; } @media only screen and (max-width: 1023px) { .bannerHome__wrap__left { width: 100%; max-width: 10000rem; padding: 20rem 0rem 5rem; } } .bannerHome__wrap__left__inner { position: relative; z-index: 4; float: right; width: 100%; opacity: 0; -webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transform: translateY(2rem); -ms-transform: translateY(2rem); transform: translateY(2rem); } .bannerHome__wrap__left__inner.inView { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .bannerHome__wrap__left__inner img { width: 180px; height: auto; display: inline-block; margin-bottom: 0rem; } @media only screen and (max-width: 767px) { .bannerHome__wrap__left__inner img { width: 120px; } } .bannerHome__wrap__left__inner h1 { font-family: 'urw-din-condensed', sans-serif; font-weight: 900; font-style: normal; font-size: 10rem; } @media only screen and (max-width: 767px) { .bannerHome__wrap__left__inner h1 { font-size: 6rem; } } .bannerHome__wrap__left__inner h4 { font-weight: 300; } .bannerHome__right { position: absolute; z-index: 2; width: 40%; top: 0; right: 0; bottom: 0; padding: 33rem 0rem 20rem; padding-left: 3rem; padding-right: 2rem; opacity: 0; -webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transform: translateX(2rem); -ms-transform: translateX(2rem); transform: translateX(2rem); -webkit-transition-delay: 1s; -o-transition-delay: 1s; transition-delay: 1s; } .bannerHome__right.inView { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } @media only screen and (max-width: 1023px) { .bannerHome__right { padding: 5rem 2rem 6rem; width: auto; margin-left: -2rem; margin-right: -2rem; position: relative; } } .bannerHome__right h2 { font-weight: 100; font-size: 7rem; line-height: 1; letter-spacing: -2px; } @media only screen and (max-width: 1023px) { .bannerHome__right h2 { font-size: 4rem; } } .bannerHome__right:after { position: absolute; display: block; content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(45, 45, 45, 0.7); } .bannerHome__right__inner { position: relative; z-index: 4; max-width: 46rem; float: left; width: 100%; } @media only screen and (max-width: 1023px) { .bannerHome__right__inner { float: none; max-width: 100%; } } .bannerHome__right__controls__prev { position: absolute; bottom: 0; z-index: 5; right: 5.3rem; width: 5rem; height: 5rem; background: rgba(0, 0, 0, 0.8); } .bannerHome__right__controls__prev:hover svg { margin-left: -0.3rem; } .bannerHome__right__controls__prev svg { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .bannerHome__right__controls__next { position: absolute; bottom: 0; z-index: 5; right: 0; width: 5rem; height: 5rem; background: rgba(0, 0, 0, 0.8); } .bannerHome__right__controls__next:hover svg { margin-left: 0.3rem; } .bannerHome__right__controls__next svg { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .breadCrumbs { border-bottom: 1px solid #f7f7f7; margin-bottom: 4rem; } .breadCrumbs__wrap { max-width: 1280px; padding: 0 2rem; margin: 0 auto; position: relative; overflow: hidden; white-space: nowrap; -o-text-overflow: ellipsis; text-overflow: ellipsis; } .breadCrumbs__wrap p { display: inline-block; margin: 0 !important; font-size: 1.4rem !important; } .breadCrumbs__wrap__item { margin-bottom: 0; font-size: 1.4rem; text-decoration: none; display: inline-block; vertical-align: middle; padding: 2.4rem 1rem; color: #ed008c; } @media only screen and (max-width: 767px) { .breadCrumbs__wrap__item { padding-left: 0.2rem; padding-right: 0.2rem; font-size: 1rem; } } .breadCrumbs__wrap__item--divivder svg { position: relative; top: 2px; opacity: 0.2; } .breadCrumbs__wrap__item--divivder svg polygon, .breadCrumbs__wrap__item--divivder svg path { fill: inherit; } .breadCrumbs__wrap__item--icon { margin-left: -0.8rem; } .breadCrumbs__wrap__item--icon svg { opacity: 0.2; position: relative; top: 2px; } .breadCrumbs__wrap__item--icon svg polygon { -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; } .breadCrumbs__wrap__item--icon svg polygon, .breadCrumbs__wrap__item--icon svg path { fill: inherit; } .breadCrumbs__wrap__item--icon:hover path, .breadCrumbs__wrap__item--icon:hover polygon { fill: inherit; } .breadCrumbs__wrap__item--link { color: #ed008c; } .breadCrumbs__wrap__item--link:hover { color: #ed008c; } .breadCrumbs__wrap__item--current { color: #ed008c; } .breadCrumbs__wrap__social { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; right: 2rem; } @media only screen and (max-width: 639px) { .breadCrumbs__wrap__social { display: none; } } .breadCrumbs__wrap__social__text { margin: 0 !important; display: inline-block; vertical-align: middle; font-size: 1.2rem !important; } @media only screen and (max-width: 767px) { .breadCrumbs__wrap__social__text { display: none; } } .breadCrumbs__wrap__social__link { position: relative; display: inline-block; vertical-align: middle; text-decoration: none; margin-left: 0.3rem; width: 2.4rem; -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .breadCrumbs__wrap__social__link:after { content: ''; position: relative; display: block; padding-bottom: 100%; } .breadCrumbs__wrap__social__link svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .breadCrumbs__wrap__social__link path { fill: #ed008c; } .breadCrumbs__wrap__social__link:hover { -webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); } .button, input[type='submit'] { background: #ed008c; padding: 1.5rem 4rem; display: inline-block; margin-bottom: 0.5rem; text-decoration: none !important; color: #fff !important; -webkit-transition: all 111ms ease; -o-transition: all 111ms ease; transition: all 111ms ease; font-weight: 500; font-size: 1.4rem; text-transform: uppercase; border: 0; } .button:hover, input:hover[type='submit'] { -webkit-box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.2); } .button:active, input:active[type='submit'] { -webkit-transform: translateY(1px); -ms-transform: translateY(1px); transform: translateY(1px); } .button--secondary { background: transparent; background: #ed008c; } .button--secondary:hover { -webkit-box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.3); } .button--black { background: transparent; background: #000; } .button--black:hover { -webkit-box-shadow: inset 0 0 0 1000px rgba(255, 255, 255, 0.2); box-shadow: inset 0 0 0 1000px rgba(255, 255, 255, 0.2); } .button--grey { background: transparent; background: #afa9a9; } .button--grey:hover { -webkit-box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.1); box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.1); } .button--white { color: #ed008c !important; background: #fff; } .button--outline { background: transparent; outline: 2px solid #ed008c; outline-offset: -2px; color: #ed008c !important; } .button--outline:hover { -webkit-box-shadow: inset 0 0 0 1000px #ed008c; box-shadow: inset 0 0 0 1000px #ed008c; color: #fff !important; } .button--white.button--outline { color: #fff !important; background: transparent; outline: 2px solid #fff; } .grid { position: absolute; top: 0; right: 0; bottom: 0; left: 0; position: fixed; z-index: 9999999999; pointer-events: none; display: none; } .grid.active { display: block; } .grid__wrap { display: block; margin: 0 auto; position: absolute; left: 0; right: 0; max-width: 1440px; bottom: 0; top: 0; border-left: 1px solid #ed008c; border-right: 1px solid #ed008c; } .grid__wrap__center { display: block; margin: 0 auto; position: absolute; left: 0; right: 0; max-width: 1px; bottom: 0; top: 0; background: rgba(255, 192, 203, 0.5); border-right: 1px solid #ed008c; } .grid__wrap__left { display: block; position: absolute; left: 2rem; max-width: 1px; bottom: 0; top: 0; background: rgba(255, 192, 203, 0.5); border-left: 1px solid #ed008c; } .grid__wrap__right { display: block; position: absolute; right: 2rem; max-width: 1px; bottom: 0; top: 0; background: rgba(255, 192, 203, 0.5); border-right: 1px solid #ed008c; } .grid__outer { display: block; margin: 0 auto; position: absolute; left: 0; right: 0; max-width: 1280px; bottom: 0; top: 0; border-left: 1px solid #ed008c; border-right: 1px solid #ed008c; } .grid__outer__center { display: block; margin: 0 auto; position: absolute; left: 0; right: 0; max-width: 1px; bottom: 0; top: 0; background: rgba(255, 192, 203, 0.5); border-right: 1px solid #ed008c; } .grid__outer__left { display: block; position: absolute; left: 2rem; max-width: 1px; bottom: 0; top: 0; background: rgba(255, 192, 203, 0.5); border-left: 1px solid #ed008c; } .grid__outer__right { display: block; position: absolute; right: 2rem; max-width: 1px; bottom: 0; top: 0; background: rgba(255, 192, 203, 0.5); border-right: 1px solid #ed008c; } .header { width: 100%; position: fixed; top: 0; left: 0; right: 0; padding: 0; z-index: 999; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .header:before { position: absolute; display: block; content: ''; position: absolute; top: 0; left: 0; right: 0; height: 5rem; background: rgba(0, 0, 0, 0.3); -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .header:after { position: absolute; display: block; content: ''; position: absolute; top: 5rem; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.3); -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); opacity: 0.5; } .header__wrap { position: relative; height: 11rem; max-width: 1280px; margin: 0 auto; z-index: 9; } .header__wrap__menu { left: 0; text-align: right; right: 0; } @media only screen and (max-width: 967px) { .header__wrap__menu { right: 6rem; } } .header__wrap__menu__item { display: inline-block; vertical-align: middle; } @media only screen and (max-width: 967px) { .header__wrap__menu__item { display: none !important; } } .header__wrap__menu__item--search { margin-left: 1rem; } .header__wrap__menu__item--search svg { margin-top: 0.3rem; } .header__wrap__menu__item__link { padding: 1.5rem 1rem; display: block; font-size: 1.6rem; margin: 0; color: #000; position: relative; } .header__wrap__menu__item__link p { font-size: 1.8rem !important; margin: 0 !important; font-weight: 700; color: #fff; } .header__wrap__menu__item__link:after { position: absolute; display: block; content: ''; left: 0; right: 0; bottom: 0; height: 3px; background: #ed008c; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; } .header__wrap__menu__item__link.active, .header__wrap__menu__item__link:hover { color: #ed008c; } .header__wrap__menu__item__link:hover, .header__wrap__menu__item__link.section, .header__wrap__menu__item__link.current { color: #ed008c; } .header__wrap__menu__item__link:hover:after, .header__wrap__menu__item__link.section:after, .header__wrap__menu__item__link.current:after { -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); } .header__wrap__logo { position: relative; position: absolute; left: 0; top: 0; z-index: 4; width: 18rem; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .header__wrap__logo:after { content: ''; position: relative; display: block; padding-bottom: 74.5614%; } .header__wrap__logo svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .header__wrap__navburger { width: 3rem; height: 3rem; position: absolute; right: -5.5rem; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); cursor: pointer; } @media only screen and (min-width: 968px) { .header__wrap__navburger { display: none; } } .header__wrap__navburger__ring { width: 3.6rem; height: 0.2rem; position: absolute; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; } .header__wrap__navburger__ring--1 { margin-top: 0.5rem; background: #ed008c; } .header__wrap__navburger__ring--2 { margin-top: 1.5rem; background: #ed008c; } .header__wrap__navburger__ring--3 { margin-top: 2.5rem; background: #ed008c; } .header__wrap__secondary { text-align: right; z-index: 3; height: 5rem; position: relative; overflow: hidden; } .header__wrap__secondary__item { display: inline-block; padding: 1.5rem 1rem 1.6rem; color: #fff; font-weight: 700; font-size: 1.4rem; } .header__wrap__secondary__item svg { display: none; } @media only screen and (max-width: 899px) { .header__wrap__secondary__item { display: none; } .header__wrap__secondary__item:first-of-type { display: inline-block; font-size: 0; padding: 1rem 1rem 1.1rem; } .header__wrap__secondary__item:first-of-type svg { display: inline-block; position: relative; top: 3px; } .header__wrap__secondary__item.header__wrap__secondary__item__button { display: inline-block; } } .header__wrap__secondary__item__loop { margin-left: 1rem; position: relative; } .header__wrap__secondary__item__loop:before { position: absolute; display: block; content: ''; left: -1rem; top: 1.6rem; bottom: 1.6rem; width: 2px; background: #fff; } .header__wrap__secondary__item__button { background: #fff; color: #ed008c; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .header__wrap__secondary__item__button:hover { background: #ed008c; color: #fff; } /*------------------------------------------------------------------ Sticky Header ------------------------------------------------------------------*/ .header.sticky:before { background: rgba(0, 0, 0, 0.8); } .header.sticky:after { opacity: 1; } .header.sticky .header__wrap__logo { width: 148px; } button, input, select, textarea { -webkit-appearance: none; } body .choices__inner, form .textarea.field textarea, form .text.field input { margin: 0; position: relative; display: inline-block; padding: 0.75rem 1.5rem 0.8rem !important; width: 100%; line-height: 1.7; background-color: #fff; background-image: none; border: 1px solid #e4e4e4; border-radius: 0rem; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; } body .choices__inner::-webkit-input-placeholder, form .textarea.field textarea::-webkit-input-placeholder, form .text.field input::-webkit-input-placeholder { opacity: 0.5; } body .choices__inner:-moz-placeholder, form .textarea.field textarea:-moz-placeholder, form .text.field input:-moz-placeholder { opacity: 0.5; } body .choices__inner::-moz-placeholder, form .textarea.field textarea::-moz-placeholder, form .text.field input::-moz-placeholder { opacity: 0.5; } body .choices__inner:-ms-input-placeholder, form .textarea.field textarea:-ms-input-placeholder, form .text.field input:-ms-input-placeholder { opacity: 0.5; } body .choices__inner:hover, form .textarea.field textarea:hover, form .text.field input:hover { border-color: #ed008c; } body .choices__inner:focus, form .textarea.field textarea:focus, form .text.field input:focus { border-color: #ed008c; outline: 0; -webkit-box-shadow: 0 0 0 2px rgba(237, 0, 140, 0.2); box-shadow: 0 0 0 2px rgba(237, 0, 140, 0.2); } form .field.textarea, form .field.text, form .field { position: relative; display: block; float: left; width: 100%; margin-bottom: 1rem; } form .field.textarea .optionset, form .field.text .optionset, form .field.textarea legend, form .field.text legend, form .field.textarea label, form .field.text label, form .field .optionset, form .field legend, form .field label { margin: 1rem 0 0.5rem; display: block; } form .half.field.textarea, form .half.field.text, form .field.half { width: calc(50% - 1rem); } @media only screen and (max-width: 767px) { form .half.field.textarea, form .half.field.text, form .field.half { width: 100%; } } form .textarea.field textarea, form .field.textarea textarea { min-height: 10rem; resize: none; } input[type='submit'] { margin-top: 2rem; } /*------------------------------------------------------------------ Checkbox ------------------------------------------------------------------*/ input[type='checkbox'] { opacity: 0; z-index: -1; position: absolute; } input[type='checkbox'] + label { position: relative; padding-left: 3rem; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; } input[type='checkbox'] + label:before { position: absolute; display: block; content: ''; display: block; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; background: #fff; border: 1px solid #e4e4e4; width: 20px; height: 20px; border-radius: 0rem; } input[type='checkbox'] + label:after { position: absolute; display: block; content: ''; -webkit-transform: rotate(43deg); -ms-transform: rotate(43deg); transform: rotate(43deg); width: 5px; height: 9px; border: 2px solid #fff; border-top: 0; border-left: 0; left: 7px; top: 50%; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; margin-top: -1px; -webkit-transform: translateY(-50%) rotate(20deg); -ms-transform: translateY(-50%) rotate(20deg); transform: translateY(-50%) rotate(20deg); } input[type='checkbox']:checked + label:before { background: #ed008c; border-color: #ed008c; } input[type='checkbox']:checked + label:after { -webkit-transform: translateY(-50%) rotate(43deg); -ms-transform: translateY(-50%) rotate(43deg); transform: translateY(-50%) rotate(43deg); } /*------------------------------------------------------------------ Radio ------------------------------------------------------------------*/ input[type='radio'] { opacity: 0; z-index: -1; position: absolute; } input[type='radio'] + label { position: relative; padding-left: 3rem; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; } input[type='radio'] + label:before { position: absolute; display: block; content: ''; display: block; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; background: #fff; border: 1px solid #e4e4e4; width: 20px; height: 20px; border-radius: 2rem; } input[type='radio'] + label:after { position: absolute; display: block; content: ''; left: 0; top: 50%; width: 20px; height: 20px; background: #fff; -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; border-radius: 2rem; -webkit-transform: translateY(-50%) scale(0.9); -ms-transform: translateY(-50%) scale(0.9); transform: translateY(-50%) scale(0.9); } input[type='radio']:checked + label:before { background: #ed008c; border-color: #ed008c; } input[type='radio']:checked + label:after { -webkit-transform: translateY(-50%) scale(0.5); -ms-transform: translateY(-50%) scale(0.5); transform: translateY(-50%) scale(0.5); } /*------------------------------------------------------------------ User form specifics ------------------------------------------------------------------*/ form .userformsstep, form .userform-fields { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } /*------------------------------------------------------------------ File field ------------------------------------------------------------------*/ .field.file .middleColumn { position: relative; border: 2px dashed #e4e4e4; border-radius: 0.4rem; height: 7rem; } .field.file .middleColumn input { position: absolute; width: 100%; top: 0; padding: 2rem 1rem; bottom: 0; line-height: 1; outline: none; margin: 0; cursor: pointer; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; } .field.file .middleColumn input:hover { background: #f7f7f7; } a:not([class]) { text-decoration: none; -webkit-box-shadow: inset 0 -1px 0 #ed008c, 0 1px 0 #ed008c; box-shadow: inset 0 -1px 0 #ed008c, 0 1px 0 #ed008c; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; overflow: hidden; color: #ed008c; } a:not([class]):hover { -webkit-box-shadow: inset 0 -30px 0 #ed008c, 0 1px 0 #ed008c; box-shadow: inset 0 -30px 0 #ed008c, 0 1px 0 #ed008c; color: #fff !important; } ul:not([class]) { list-style: none; margin: 1rem auto; } ul:not([class]) li { position: relative; padding-left: 2rem; margin-bottom: 1rem; } ul:not([class]) li:before { position: absolute; display: block; content: ''; width: 1.1rem; height: 1.6rem; border-radius: 1.5rem; top: 0.6rem; left: .3rem; background-image: url('data:image/svg+xml; utf8, '); } ol:not([class]) { margin: 1rem auto; list-style: none; } ol:not([class]) li { padding-left: 2rem; margin-bottom: 0.5rem; position: relative; counter-increment: counter; } ol:not([class]) li:before { position: absolute; display: block; content: ''; top: 0.4rem; left: 0.5rem; content: counter(counter) "."; font-weight: 700; font-size: 75%; color: #ed008c; } ol:not([class]) li li { counter-increment: internalcounter; } ol:not([class]) li li:before { content: counter(internalcounter) "."; } .menuActive { width: 100%; } .menuActive .blur { -webkit-filter: blur(25px); filter: blur(25px); -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); } .menuActive .header__logo path { fill: #fff; } .menuActive .header__wrap__navburger__ring--1 { -webkit-transform: rotate(45deg) translateX(0.7rem) translateY(0.7rem); -ms-transform: rotate(45deg) translateX(0.7rem) translateY(0.7rem); transform: rotate(45deg) translateX(0.7rem) translateY(0.7rem); } .menuActive .header__wrap__navburger__ring--2 { background: transparent !important; } .menuActive .header__wrap__navburger__ring--3 { -webkit-transform: rotate(-45deg) translateX(0.7rem) translateY(-0.7rem); -ms-transform: rotate(-45deg) translateX(0.7rem) translateY(-0.7rem); transform: rotate(-45deg) translateX(0.7rem) translateY(-0.7rem); } .menuActive .offCanvas { -webkit-transform: none; -ms-transform: none; transform: none; opacity: 1; visibility: visible; } .menuActive .offCanvas__menu__item { opacity: 1 !important; -webkit-transform: translateY(0) !important; -ms-transform: translateY(0) !important; transform: translateY(0) !important; } .menuActive .header__background { opacity: 0 !important; } .blur { will-change: auto; -webkit-transition: all 666ms ease; -o-transition: all 666ms ease; transition: all 666ms ease; } .offCanvas { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(255, 255, 255, 0.4); -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; opacity: 0; will-change: all; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; z-index: 998; overflow: auto; visibility: hidden; padding-top: 10rem; } .offCanvas > svg { position: absolute; top: 2rem; left: 2rem; height: 30px; width: 126.25px; } .offCanvas__menu { margin-top: 8rem; padding: 2rem 0; } .offCanvas__menu__item { position: relative; margin: 0; } .offCanvas__menu__item:nth-child(0) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 0ms; -o-transition-delay: 0ms; transition-delay: 0ms; -webkit-transform: translateY(-0px); -ms-transform: translateY(-0px); transform: translateY(-0px); display: block; } .offCanvas__menu__item:nth-child(1) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 220ms; -o-transition-delay: 220ms; transition-delay: 220ms; -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); display: block; } .offCanvas__menu__item:nth-child(2) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 440ms; -o-transition-delay: 440ms; transition-delay: 440ms; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); display: block; } .offCanvas__menu__item:nth-child(3) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 660ms; -o-transition-delay: 660ms; transition-delay: 660ms; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); display: block; } .offCanvas__menu__item:nth-child(4) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 880ms; -o-transition-delay: 880ms; transition-delay: 880ms; -webkit-transform: translateY(-40px); -ms-transform: translateY(-40px); transform: translateY(-40px); display: block; } .offCanvas__menu__item:nth-child(5) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 1100ms; -o-transition-delay: 1100ms; transition-delay: 1100ms; -webkit-transform: translateY(-50px); -ms-transform: translateY(-50px); transform: translateY(-50px); display: block; } .offCanvas__menu__item:nth-child(6) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 1320ms; -o-transition-delay: 1320ms; transition-delay: 1320ms; -webkit-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px); display: block; } .offCanvas__menu__item:nth-child(7) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 1540ms; -o-transition-delay: 1540ms; transition-delay: 1540ms; -webkit-transform: translateY(-70px); -ms-transform: translateY(-70px); transform: translateY(-70px); display: block; } .offCanvas__menu__item:nth-child(8) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 1760ms; -o-transition-delay: 1760ms; transition-delay: 1760ms; -webkit-transform: translateY(-80px); -ms-transform: translateY(-80px); transform: translateY(-80px); display: block; } .offCanvas__menu__item:nth-child(9) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 1980ms; -o-transition-delay: 1980ms; transition-delay: 1980ms; -webkit-transform: translateY(-90px); -ms-transform: translateY(-90px); transform: translateY(-90px); display: block; } .offCanvas__menu__item:nth-child(10) { opacity: 0.5; -webkit-transition: all 888ms ease !important; -o-transition: all 888ms ease !important; transition: all 888ms ease !important; -webkit-transition-delay: 2200ms; -o-transition-delay: 2200ms; transition-delay: 2200ms; -webkit-transform: translateY(-100px); -ms-transform: translateY(-100px); transform: translateY(-100px); display: block; } .offCanvas__menu__item:after { position: absolute; display: block; content: ''; left: 0; right: 0; bottom: -1px; height: 1px; background: rgba(247, 247, 247, 0.2); } .offCanvas__menu__item__link { display: block; padding: 2rem 2rem; text-decoration: none; position: relative; } .offCanvas__menu__item__link:hover { color: #ed008c; } .offCanvas__menu__item__link.current { padding: 1.8rem 3rem 1.8rem 5rem !important; } .offCanvas__menu__item__link.current:after { position: absolute; display: block; content: ''; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; left: 0; width: 4rem; height: 1px; background: #ed008c; } .offCanvas__menu__item__link b { font-size: 3rem; position: relative; z-index: 2; } @media only screen and (max-width: 479px) { .offCanvas__menu__item__link b { font-size: 2rem; } } .offCanvas__menu__item__link span { width: 6rem; position: absolute; right: 1.8rem; top: 0; bottom: 0; text-align: center; } .offCanvas__menu__item__link span svg { margin-top: 1.5rem; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .offCanvas__menu__item__link.current, .offCanvas__menu__item__link:hover { color: #ed008c; } .offCanvas .open svg { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .offCanvas .open .offCanvas__submenu { padding: 1rem 0 0.5rem; max-height: 30rem; } .offCanvas__submenu { background: #ed008c; padding: 0; display: none; } .offCanvas__submenu__item__link { font-weight: 500; display: block; padding: 1.8rem 3rem; color: #fff; text-decoration: none; position: relative; font-size: 2.4rem; } .offCanvas__submenu__item__link span { width: 3.5rem; position: absolute; right: 1.8rem; top: 0; bottom: 0; background: #e4e4e4; text-align: center; } .offCanvas__submenu__item__link span svg { margin: 0.8rem auto; } .offCanvas__submenu__item__link:hover { color: #ed008c; } .sidebarWrapper { position: relative; font-size: 0; max-width: 1280px; margin: 0 auto 4rem; } .sidebarWrapper:before, .sidebarWrapper:after { content: ''; display: table; } .sidebarWrapper:after { clear: both; } @media only screen and (max-width: 967px) { .sidebarWrapper { margin-bottom: 0rem; } } .sidebarWrapper__sidebar { width: 28rem; display: block; float: left; padding-top: 3.5rem; padding-left: 2rem; } .sidebarWrapper__sidebar--no-padding { padding-top: 8rem; padding-bottom: 11rem; } @media only screen and (max-width: 967px) { .sidebarWrapper__sidebar { display: none; } } .sidebarWrapper__sidebar__link { font-size: 1.6rem; display: block; padding: 0.5rem 0; margin-bottom: 1rem; -webkit-transition: all 111ms ease; -o-transition: all 111ms ease; transition: all 111ms ease; font-weight: 700; } .sidebarWrapper__sidebar__link--indented { padding-left: 2rem; } .sidebarWrapper__sidebar__link--alt { color: #000; } .sidebarWrapper__sidebar__link:hover { color: #ed008c; } .sidebarWrapper__sidebar__link--current, .sidebarWrapper__sidebar__link--section { color: #ed008c; } .sidebarWrapper__sidebar .publishDate { margin-top: -0.6rem; } .sidebarWrapper__content { width: calc(100% - 30rem); display: block; float: left; } @media only screen and (max-width: 967px) { .sidebarWrapper__content { width: 100%; } } .sidebarWrapper__content__recent { margin-top: 3rem; } .sidebarWrapper__content__recent hr { margin: 0 auto 2rem; } .sidebarWrapper__content__recent__link { color: #000 !important; -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; } .sidebarWrapper__content__recent__link svg { position: relative; top: -1px; display: inline-block; vertical-align: middle; margin-left: 0.3rem; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; } .sidebarWrapper__content__recent__link svg polygon { -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; } .sidebarWrapper__content__recent__link:hover { color: #ed008c !important; } .sidebarWrapper__content__recent__link:hover svg { -webkit-transform: translateX(5px); -ms-transform: translateX(5px); transform: translateX(5px); } .sidebarWrapper__content__recent__link:hover svg polygon { fill: #ed008c; } @media only screen and (min-width: 968px) { .js-sticky-sidebar { position: -webkit-sticky; position: sticky; top: 3rem; margin-bottom: 0; padding-bottom: 4rem; } } @media only screen and (min-width: 968px) { .sidebarWrapper__content .accordionBlock__wrap { padding: 0 !important; } .sidebarWrapper__content > .contentBlock:nth-child(1) .h4 { margin-top: -5.4rem; } .sidebarWrapper__content .textBlock__wrap { max-width: 82rem; } } table { vertical-align: top; max-width: 100%; border-collapse: collapse; border-spacing: 0; width: 100%; margin: 0 auto 3rem; position: relative; overflow: hidden; -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); min-width: 768px; border: 2px solid #fff; } table li { margin-bottom: 0 !important; } table tr { background: #f7f7f7; border-bottom: 2px solid #fff; margin-bottom: 5px; } table tr:last-of-type { border-bottom: 0; } table tr:nth-child(even) { background: #eaeaea; } table th, table td { text-align: left; padding: 2rem; border-right: 2px solid #fff; } table th:last-of-type, table td:last-of-type { border-right: 0; } table th { background: #ed008c; color: #fff !important; } .SilverStripe\\ErrorPage\\ErrorPage .partners, .SilverStripe\\ErrorPage\\ErrorPage .questions, .SilverStripe\\ErrorPage\\ErrorPage .footer, .SilverStripe\\ErrorPage\\ErrorPage .header { display: none; } .fourOhFour { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: #ed008c; } .fourOhFour__wrap { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); text-align: center; } .fourOhFour__wrap__number h1 { font-size: 26vw !important; color: #ed008c !important; font-weight: bold !important; text-shadow: 0em 0.16em 0.24em rgba(0, 0, 0, 0.32); } .fourOhFour__wrap__button a { font-weight: bold !important; } .login { min-height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .login__image { background-size: cover; background-position: center center; background-repeat: no-repeat; width: 50%; } @media only screen and (max-width: 967px) { .login__image { display: none; } } .login__form { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; width: 50%; padding: 4rem; } @media only screen and (max-width: 967px) { .login__form { width: 100%; position: relative; } } .login__form__wrap { max-width: 50rem; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .login__form__wrap__logo { margin: 6rem auto auto; -ms-flex-item-align: start; align-self: flex-start; } .login__form__wrap__copy { width: 100%; } .login__form__wrap__copy h4 { text-align: center; } .login__form__wrap__copy p { text-align: center; } .login__form__wrap__copy #ForgotPassword { display: none; } .styleguide { margin: 0 auto; max-width: 1280px; padding: 10rem 0; } .styleguide__content__section { padding-bottom: 4rem; } .styleguide__content__section__heading { margin-bottom: 5rem !important; position: relative; text-transform: uppercase; padding: 0 2rem; } .styleguide__content__section__heading:after { position: absolute; display: block; content: ''; left: 2rem; top: 120%; height: 0.4rem; width: 5rem; background: #ed008c; } .accordionBlock__wrap { margin: 0 auto; max-width: 1280px; padding: 0 2rem; } .accordionBlock__wrap__item { position: relative; border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; margin-bottom: -1px; } .accordionBlock__wrap__item.active .accordionBlock__wrap__item__heading:before, .accordionBlock__wrap__item.active .accordionBlock__wrap__item__heading:after { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .accordionBlock__wrap__item__heading { position: relative; padding: 2rem 0; cursor: pointer; } .accordionBlock__wrap__item__heading.active *, .accordionBlock__wrap__item__heading:hover * { color: #ed008c; } .accordionBlock__wrap__item__heading.active:before, .accordionBlock__wrap__item__heading.active:after, .accordionBlock__wrap__item__heading:hover:before, .accordionBlock__wrap__item__heading:hover:after { background: #ed008c; } .accordionBlock__wrap__item__heading h5 { margin-bottom: 0 !important; padding-right: 2.5rem; } .accordionBlock__wrap__item__heading h5 * { -webkit-transition: all 111ms ease; -o-transition: all 111ms ease; transition: all 111ms ease; } .accordionBlock__wrap__item__heading:before { position: absolute; display: block; content: ''; width: 2.2rem; height: 0.3rem; background: #ed008c; position: absolute; right: 0; top: 50%; margin-top: -1px; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: background 111ms ease, -webkit-transform 444ms ease; transition: background 111ms ease, -webkit-transform 444ms ease; -o-transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease, -webkit-transform 444ms ease; } .accordionBlock__wrap__item__heading:after { position: absolute; display: block; content: ''; width: 2.2rem; height: 0.3rem; background: #ed008c; position: absolute; right: 0; top: 50%; margin-top: -1px; -webkit-transition: background 111ms ease, -webkit-transform 444ms ease; transition: background 111ms ease, -webkit-transform 444ms ease; -o-transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease, -webkit-transform 444ms ease; } .accordionBlock__wrap__item__content { display: none; } .accordionBlock__wrap__item__content__inner { padding: 1rem 0 2rem; } .block { margin: 5rem auto; } .block img { display: block; height: auto; max-width: 100%; } @media only screen and (min-width: 1024px) { .block img.left { float: left; margin-right: 1.5rem; margin-bottom: 1.5rem; } .block img.right { float: right; margin-left: 1.5rem; margin-bottom: 1.5rem; } .block img:not([width]) { max-width: 100%; } .block img:not([height]) { height: auto; } } .blogFilter { position: relative; margin: 10rem auto 5rem; z-index: 33; } .blogFilter__wrap { margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; max-width: 1024px; padding: 0 2rem; } .blogFilter__wrap__select { width: calc(50% - 2rem); } @media only screen and (max-width: 767px) { .blogFilter__wrap__select { width: calc(100%); margin: 2rem 1rem; } } .blogFilter__wrap__select .choices__inner { border-radius: 0; border: 1px solid #000; background: transparent; color: #000; opacity: 1; font-size: 2rem; } .blogFilter__wrap__select .choices__placeholder { opacity: 1; } .articles { position: relative; margin: 0 auto 10rem; padding: 0 2rem; } .articles__wrap { margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: start; align-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; max-width: 1024px; } .articles__wrap__item { margin: 2rem; background: #fff; overflow: hidden; position: relative; -webkit-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); -o-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); will-change: opacity, transform; opacity: 0; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); width: calc(50% - 4rem); } @media only screen and (max-width: 767px) { .articles__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .articles__wrap__item:nth-child(0) { -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .articles__wrap__item:nth-child(1) { -webkit-transform: matrix(1, 0, 0, 1, 0, 10); -ms-transform: matrix(1, 0, 0, 1, 0, 10); transform: matrix(1, 0, 0, 1, 0, 10); } .articles__wrap__item:nth-child(2) { -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .articles__wrap__item:nth-child(3) { -webkit-transform: matrix(1, 0, 0, 1, 0, 30); -ms-transform: matrix(1, 0, 0, 1, 0, 30); transform: matrix(1, 0, 0, 1, 0, 30); } .articles__wrap__item:nth-child(4) { -webkit-transform: matrix(1, 0, 0, 1, 0, 40); -ms-transform: matrix(1, 0, 0, 1, 0, 40); transform: matrix(1, 0, 0, 1, 0, 40); } .articles__wrap__item:nth-child(5) { -webkit-transform: matrix(1, 0, 0, 1, 0, 50); -ms-transform: matrix(1, 0, 0, 1, 0, 50); transform: matrix(1, 0, 0, 1, 0, 50); } .articles__wrap__item:nth-child(6) { -webkit-transform: matrix(1, 0, 0, 1, 0, 60); -ms-transform: matrix(1, 0, 0, 1, 0, 60); transform: matrix(1, 0, 0, 1, 0, 60); } .articles__wrap__item:nth-child(7) { -webkit-transform: matrix(1, 0, 0, 1, 0, 70); -ms-transform: matrix(1, 0, 0, 1, 0, 70); transform: matrix(1, 0, 0, 1, 0, 70); } .articles__wrap__item:nth-child(8) { -webkit-transform: matrix(1, 0, 0, 1, 0, 80); -ms-transform: matrix(1, 0, 0, 1, 0, 80); transform: matrix(1, 0, 0, 1, 0, 80); } .articles__wrap__item:nth-child(9) { -webkit-transform: matrix(1, 0, 0, 1, 0, 90); -ms-transform: matrix(1, 0, 0, 1, 0, 90); transform: matrix(1, 0, 0, 1, 0, 90); } .articles__wrap__item:nth-child(10) { -webkit-transform: matrix(1, 0, 0, 1, 0, 100); -ms-transform: matrix(1, 0, 0, 1, 0, 100); transform: matrix(1, 0, 0, 1, 0, 100); } .articles__wrap__item:nth-child(11) { -webkit-transform: matrix(1, 0, 0, 1, 0, 110); -ms-transform: matrix(1, 0, 0, 1, 0, 110); transform: matrix(1, 0, 0, 1, 0, 110); } .articles__wrap__item:nth-child(12) { -webkit-transform: matrix(1, 0, 0, 1, 0, 120); -ms-transform: matrix(1, 0, 0, 1, 0, 120); transform: matrix(1, 0, 0, 1, 0, 120); } .articles__wrap__item.inView { opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .articles__wrap__item:hover .articles__wrap__item__image__tag { -webkit-transform: rotateX(0); transform: rotateX(0); opacity: 1; } .articles__wrap__item__image { background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; width: 100%; -webkit-perspective: 600; perspective: 600; } .articles__wrap__item__image:after { content: ''; position: relative; display: block; padding-bottom: 50%; } .articles__wrap__item__image__tag { font-family: 'urw-din-condensed', sans-serif; font-weight: 900; font-style: normal; position: absolute; top: 0; left: 3rem; padding: 4rem 1.2rem 1rem; background: #ed008c; color: #fff; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transform-origin: 0% 0; -ms-transform-origin: 0% 0; transform-origin: 0% 0; -webkit-transform: rotateX(-50deg); transform: rotateX(-50deg); opacity: 0; } .articles__wrap__item__content { padding: 1rem 0 0; } .articles__wrap__item__content__heading { position: relative; margin: 2rem auto 1rem; opacity: 0.4; } [data-classname="SilverStripe\\Blog\\Model\\BlogPost"] .textBlock__wrap { max-width: 968px !important; } .count { background: #1b1a1a; padding: 0 2rem; } .count__wrap { max-width: 1024px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 4rem 0; } @media only screen and (max-width: 967px) { .count__wrap { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .count__wrap__item { width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media only screen and (max-width: 967px) { .count__wrap__item { width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .count__wrap__item__number { font-weight: 100; color: #ed008c; font-size: 8rem; padding-right: 2rem; letter-spacing: -3px; } @media only screen and (max-width: 539px) { .count__wrap__item__number { width: 100%; padding-right: 0; text-align: center; } } .count__wrap__item__copy { color: #585757; font-weight: 500; font-size: 2.6rem; line-height: 1; } @media only screen and (max-width: 539px) { .count__wrap__item__copy { width: 100%; text-align: center; } .count__wrap__item__copy br { display: none; } } .downloadBlock { padding: 0 2rem; margin-bottom: 10rem; } .downloadBlock__wrap { margin: 0 auto; max-width: 768px; } .downloadBlock__wrap__list__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; color: inherit; padding: 1.5rem 2rem; border: 1px solid #afa9a9; text-decoration: none; margin-bottom: 2rem; position: relative; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .downloadBlock__wrap__list__item p { margin-bottom: 0 !important; } .downloadBlock__wrap__list__item__details__summary, .downloadBlock__wrap__list__item__details__info, .downloadBlock__wrap__list__item__details__title { width: 100%; -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; } .downloadBlock__wrap__list__item__details__title { margin-bottom: 0.5rem !important; padding-right: 4rem; } .downloadBlock__wrap__list__item__extension { margin-right: 6rem; margin-left: auto; } .downloadBlock__wrap__list__item__extension b { text-decoration: underline; } .downloadBlock__wrap__list__item__icon { position: absolute; right: 0; bottom: 0; top: 0; background: #afa9a9; width: 5rem; -webkit-transition: all 222ms ease; -o-transition: all 222ms ease; transition: all 222ms ease; } .downloadBlock__wrap__list__item__icon svg { overflow: visible; position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .downloadBlock__wrap__list__item:hover .downloadBlock__wrap__list__item__details__summary, .downloadBlock__wrap__list__item:hover .downloadBlock__wrap__list__item__details__title { color: #ed008c; } .downloadBlock__wrap__list__item:hover .downloadBlock__wrap__list__item__icon { background: #ed008c; } .downloadThumbnailBlock { max-width: 1280px; padding: 0 4rem; margin: 0 auto; width: 100%; } .downloadThumbnailBlock__wrap { padding: 4rem 0; margin: 0 -4rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media only screen and (max-width: 767px) { .downloadThumbnailBlock__wrap { margin: 0 auto; } } .downloadThumbnailBlock__wrap__item { margin: 2rem; background: #fff; overflow: hidden; position: relative; -webkit-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); -o-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); will-change: opacity, transform; opacity: 0; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .downloadThumbnailBlock__wrap__item:hover .downloadThumbnailBlock__wrap__item__content h6 { color: #ed008c; } .downloadThumbnailBlock__wrap__item:nth-child(0) { -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .downloadThumbnailBlock__wrap__item:nth-child(1) { -webkit-transform: matrix(1, 0, 0, 1, 0, 10); -ms-transform: matrix(1, 0, 0, 1, 0, 10); transform: matrix(1, 0, 0, 1, 0, 10); } .downloadThumbnailBlock__wrap__item:nth-child(2) { -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .downloadThumbnailBlock__wrap__item:nth-child(3) { -webkit-transform: matrix(1, 0, 0, 1, 0, 30); -ms-transform: matrix(1, 0, 0, 1, 0, 30); transform: matrix(1, 0, 0, 1, 0, 30); } .downloadThumbnailBlock__wrap__item:nth-child(4) { -webkit-transform: matrix(1, 0, 0, 1, 0, 40); -ms-transform: matrix(1, 0, 0, 1, 0, 40); transform: matrix(1, 0, 0, 1, 0, 40); } .downloadThumbnailBlock__wrap__item:nth-child(5) { -webkit-transform: matrix(1, 0, 0, 1, 0, 50); -ms-transform: matrix(1, 0, 0, 1, 0, 50); transform: matrix(1, 0, 0, 1, 0, 50); } .downloadThumbnailBlock__wrap__item:nth-child(6) { -webkit-transform: matrix(1, 0, 0, 1, 0, 60); -ms-transform: matrix(1, 0, 0, 1, 0, 60); transform: matrix(1, 0, 0, 1, 0, 60); } .downloadThumbnailBlock__wrap__item:nth-child(7) { -webkit-transform: matrix(1, 0, 0, 1, 0, 70); -ms-transform: matrix(1, 0, 0, 1, 0, 70); transform: matrix(1, 0, 0, 1, 0, 70); } .downloadThumbnailBlock__wrap__item:nth-child(8) { -webkit-transform: matrix(1, 0, 0, 1, 0, 80); -ms-transform: matrix(1, 0, 0, 1, 0, 80); transform: matrix(1, 0, 0, 1, 0, 80); } .downloadThumbnailBlock__wrap__item:nth-child(9) { -webkit-transform: matrix(1, 0, 0, 1, 0, 90); -ms-transform: matrix(1, 0, 0, 1, 0, 90); transform: matrix(1, 0, 0, 1, 0, 90); } .downloadThumbnailBlock__wrap__item:nth-child(10) { -webkit-transform: matrix(1, 0, 0, 1, 0, 100); -ms-transform: matrix(1, 0, 0, 1, 0, 100); transform: matrix(1, 0, 0, 1, 0, 100); } .downloadThumbnailBlock__wrap__item:nth-child(11) { -webkit-transform: matrix(1, 0, 0, 1, 0, 110); -ms-transform: matrix(1, 0, 0, 1, 0, 110); transform: matrix(1, 0, 0, 1, 0, 110); } .downloadThumbnailBlock__wrap__item:nth-child(12) { -webkit-transform: matrix(1, 0, 0, 1, 0, 120); -ms-transform: matrix(1, 0, 0, 1, 0, 120); transform: matrix(1, 0, 0, 1, 0, 120); } .downloadThumbnailBlock__wrap__item.inView { opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .downloadThumbnailBlock__wrap__item__image { background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; width: 100%; } .downloadThumbnailBlock__wrap__item__image:after { content: ''; position: relative; display: block; padding-bottom: 141.90871%; } .downloadThumbnailBlock__wrap__item__content { position: relative; } .downloadThumbnailBlock__wrap__item__content h6 { padding-right: 7rem; padding-top: 1rem; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .downloadThumbnailBlock__wrap__item__content span { width: 7rem; height: 7rem; background: #ed008c; top: 0; display: block; right: 0; position: absolute; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .downloadThumbnailBlock__wrap__item__content span svg { position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .downloadThumbnailBlock__wrap .downloadThumbnailBlock__wrap__item { width: calc(33.33333% - 4rem); } @media only screen and (max-width: 767px) { .downloadThumbnailBlock__wrap .downloadThumbnailBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .downloadThumbnailBlock__wrap--2 .downloadThumbnailBlock__wrap__item { width: calc(50% - 4rem); } @media only screen and (max-width: 767px) { .downloadThumbnailBlock__wrap--2 .downloadThumbnailBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .downloadThumbnailBlock__wrap--3 .downloadThumbnailBlock__wrap__item { width: calc(33.333% - 4rem); } @media only screen and (max-width: 767px) { .downloadThumbnailBlock__wrap--3 .downloadThumbnailBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .downloadThumbnailBlock__wrap--4 .downloadThumbnailBlock__wrap__item { width: calc(25% - 4rem); } @media only screen and (max-width: 767px) { .downloadThumbnailBlock__wrap--4 .downloadThumbnailBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .footer { position: relative; overflow: hidden; background: #1b1a1a; padding: 10rem 2rem; } @media only screen and (max-width: 967px) { .footer { padding: 6rem 2rem; } } .footer__wrap { max-width: 1280px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; z-index: 3; position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .footer__wrap__logo { position: relative; width: 15.6rem; } .footer__wrap__logo:after { content: ''; position: relative; display: block; padding-bottom: 53.84615%; } .footer__wrap__logo svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } @media only screen and (max-width: 967px) { .footer__wrap__logo { margin: 0 auto 4rem; } } .footer__wrap__menu { margin-right: 0; margin-left: auto; } @media only screen and (max-width: 967px) { .footer__wrap__menu { width: 100%; text-align: center; margin-bottom: 4rem; } } .footer__wrap__menu__link { font-weight: 500; color: #fff; padding: 1rem; } .footer__wrap__menu__link span { font-weight: 500; margin-right: 1rem; display: inline-block; } @media only screen and (max-width: 967px) { .footer__wrap__social { width: 100%; text-align: center; margin-bottom: 4rem; } } .footer__wrap__social__item { margin-left: 2rem; } .footer__wrap__copyright { color: #fff; margin-top: 4rem; } .footer__wrap__copyright * { font-weight: 500; font-size: 1.2rem !important; } .footer__wrap__copyright p { margin-bottom: 0.5rem; } .footer__wrap__copyright a { color: #fff; -webkit-box-shadow: none !important; box-shadow: none !important; } .gallerySlider__slider { max-width: 968px; position: relative; margin: 10rem auto 3rem; } .gallerySlider__slider__main { margin-bottom: 2rem; } .gallerySlider__slider__nav { position: relative; margin: 0 -1rem; } .gallerySlider__slider__nav__item { padding: 1rem; } .gallerySlider__slider__nav__item img { width: 100%; height: auto; } .gallerySlider__slider .slick-next { position: absolute; right: 0; bottom: 0; z-index: 2; } .gallerySlider__slider .slick-prev { position: absolute; left: 0; bottom: 0; z-index: 2; } .gridBlock { max-width: 1280px; margin: 0 auto; padding: 0 2rem; } .gridBlock__wrap { padding: 4rem 0rem; margin: 0 auto; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; } .gridBlock__wrap h3 { margin-bottom: 5rem; } @media only screen and (max-width: 767px) { .gridBlock__wrap { margin: 0 auto; } } .gridBlock__wrap__grid { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .gridBlock__wrap__grid__item { width: calc(50% - 1rem); display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-line-pack: center; align-content: center; margin-bottom: 2rem; border-bottom: 1px solid #afa9a9; padding-top: 1rem; padding-bottom: 3rem; } @media only screen and (max-width: 967px) { .gridBlock__wrap__grid__item { width: 100%; } } .gridBlock__wrap__grid__item h4 { -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .gridBlock__wrap__grid__item:hover h4 { color: #ed008c; } .gridBlock__wrap__grid__item:nth-child(1) { padding-top: 3rem; border-top: 1px solid #afa9a9; } .gridBlock__wrap__grid__item:nth-child(2) { padding-top: 3rem; border-top: 1px solid #afa9a9; } @media only screen and (max-width: 967px) { .gridBlock__wrap__grid__item:nth-child(2) { border-top: 0; } } .gridBlock__wrap__grid__item:hover .gridBlock__wrap__grid__item__link { color: #ed008c; } .gridBlock__wrap__grid__item:hover svg { -webkit-transform: translateX(0.3rem); -ms-transform: translateX(0.3rem); transform: translateX(0.3rem); } .gridBlock__wrap__grid__item:hover svg path { fill: #ed008c; } .gridBlock__wrap__grid__item__image { background-size: cover; background-position: center center; background-repeat: no-repeat; width: 12rem; height: 12rem; } .gridBlock__wrap__grid__item__content { background-size: cover; background-position: center center; background-repeat: no-repeat; width: calc(100% - 22rem); padding-left: 2rem; } @media only screen and (max-width: 639px) { .gridBlock__wrap__grid__item__content { width: calc(100% - 12rem); } } .gridBlock__wrap__grid__item__content h4 { margin: 0; } .gridBlock__wrap__grid__item__link { width: 10rem; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: center; align-content: center; } @media only screen and (max-width: 639px) { .gridBlock__wrap__grid__item__link { width: 100%; padding-top: 2rem; } } .gridBlock__wrap__grid__item__link svg { display: inline-block; vertical-align: middle; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); margin-right: 0.3rem; } .gridBlock__wrap__grid__item__link svg path { -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .gridBlock__wrap__grid__item__link p { margin: 0 0 0 0.3rem; display: inline-block; vertical-align: middle; font-size: 1rem !important; } .imageText + .imageText { margin-top: 20rem !important; } .imageText__wrap { padding: 0 2rem; position: relative; max-width: 1280px; margin: 10rem auto; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } @media only screen and (max-width: 767px) { .imageText__wrap { margin: 10rem auto; } } .imageText__wrap__image { width: 50%; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: center; align-content: center; text-align: center; -ms-flex-pack: distribute; justify-content: space-around; padding: 0; z-index: 4; -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); } @media only screen and (max-width: 767px) { .imageText__wrap__image { width: 100%; -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; -webkit-box-ordinal-group: 2 !important; -ms-flex-order: 1 !important; order: 1 !important; } } .imageText__wrap__image img { width: 100%; height: auto; } .imageText__wrap__image__text { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.4); z-index: 333; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .imageText__wrap__image__text h4 { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; padding: 4rem; } .imageText__wrap__text { background: #f7f7f7; width: 50%; padding: 6rem 5rem; position: relative; } @media only screen and (max-width: 767px) { .imageText__wrap__text { width: 100%; -webkit-box-ordinal-group: 3 !important; -ms-flex-order: 2 !important; order: 2 !important; -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; } } .imageText__wrap__text:after { position: absolute; display: block; content: ''; top: 0; bottom: 0; width: 10%; background: #f7f7f7; right: 99%; } @media only screen and (max-width: 767px) { .imageText__wrap__text:after { display: none; } } .imageText--reversed .imageText__wrap__image { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .imageText--reversed .imageText__wrap__text { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .imageText--reversed .imageText__wrap__text:after { left: 99%; right: auto; } .animatedPanel { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 9; } .animatedPanel__colour { position: absolute; display: block; content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); left: -1px; top: -1px; background: #ed008c; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; } .animatedPanel:before { position: absolute; display: block; content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); left: -1px; top: -1px; background: #f7f7f7; -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; } @-webkit-keyframes overPanelImage { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } @keyframes overPanelImage { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } @-webkit-keyframes underPanelImage { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } @keyframes underPanelImage { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } .animatedPanel.inView:before { -webkit-animation-name: underPanelImage; animation-name: underPanelImage; -webkit-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); -o-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .animatedPanel.inView .animatedPanel__colour { -webkit-animation-name: overPanelImage; animation-name: overPanelImage; -webkit-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); -o-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .symbolic { width: 9rem; height: 14rem; z-index: 9; opacity: 0.8; background: #ed008c; top: 0; left: 10%; display: block; position: absolute; -webkit-transform: translateY(-50%) scaleY(0); -ms-transform: translateY(-50%) scaleY(0); transform: translateY(-50%) scaleY(0); -webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); } .symbolic.inView { -webkit-transform: translateY(-50%) scaleY(1); -ms-transform: translateY(-50%) scaleY(1); transform: translateY(-50%) scaleY(1); } .imageBlock { position: relative; padding: 4rem 0; } .imageBlock__wrap { margin: 0 auto; max-width: 1280px; position: relative; -webkit-transition: all 888ms ease; -o-transition: all 888ms ease; transition: all 888ms ease; opacity: 0; will-change: opacity, transform; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .imageBlock__wrap.inView { -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); opacity: 1; } .imageBlock__wrap img { width: 100%; height: auto; display: block; } .imageBlock__wrap__caption { background: #ed008c; position: absolute; bottom: 3rem; left: 0rem; padding: 1rem 4rem; -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); -webkit-transform: translateX(-2rem); -ms-transform: translateX(-2rem); transform: translateX(-2rem); } .imageBlock__wrap__caption p { color: #fff; margin: 0; } .imageTextBlock { position: relative; width: 100%; margin: 10rem auto; } .imageTextBlock__wrap { width: 100%; margin: 0 auto; max-width: 1280px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .imageTextBlock__wrap__image { background-size: cover; background-position: center center; background-repeat: no-repeat; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; width: 50%; position: relative; } @media only screen and (max-width: 767px) { .imageTextBlock__wrap__image { -webkit-box-ordinal-group: 2 !important; -ms-flex-order: 1 !important; order: 1 !important; width: 100%; position: relative; } .imageTextBlock__wrap__image:after { content: ''; position: relative; display: block; padding-bottom: 56.25%; } } .imageTextBlock__wrap__copy { width: 50%; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; padding: 6rem 10rem; } @media only screen and (max-width: 767px) { .imageTextBlock__wrap__copy { padding: 6rem 4rem; -webkit-box-ordinal-group: 3 !important; -ms-flex-order: 2 !important; order: 2 !important; width: 100%; } } .imageTextBlock--reversed .imageTextBlock__wrap__image { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .imageTextBlock--reversed .imageTextBlock__wrap__copy { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .animatedPanel { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 9; } .animatedPanel__colour { position: absolute; display: block; content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); left: -1px; top: -1px; background: #ed008c; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; } .animatedPanel:before { position: absolute; display: block; content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); left: -1px; top: -1px; background: #f7f7f7; -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; } @keyframes overPanelImage { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } @keyframes underPanelImage { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } .animatedPanel.inView:before { -webkit-animation-name: underPanelImage; animation-name: underPanelImage; -webkit-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); -o-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .animatedPanel.inView .animatedPanel__colour { -webkit-animation-name: overPanelImage; animation-name: overPanelImage; -webkit-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); -o-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .intro { position: relative; overflow: hidden; margin: 10rem auto; padding: 0 2rem; } .intro__wrap { max-width: 1280px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .intro__wrap__left { width: 40%; } @media only screen and (max-width: 967px) { .intro__wrap__left { width: 100%; } } .intro__wrap__right { width: 60%; padding-right: 10rem; line-height: 1.8; } @media only screen and (max-width: 967px) { .intro__wrap__right { width: 100%; padding-right: 0; } } .linkBlock { max-width: 1280px; margin: 0 auto; } .linkBlock__wrap { padding: 4rem 2rem; margin: 0 -2rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media only screen and (max-width: 767px) { .linkBlock__wrap { margin: 0 auto; } } .linkBlock__wrap__item { -webkit-box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.034), 0 6.7px 5.3px rgba(0, 0, 0, 0.048), 0 12.5px 10px rgba(0, 0, 0, 0.06), 0 22.3px 17.9px rgba(0, 0, 0, 0.072), 0 41.8px 33.4px rgba(0, 0, 0, 0.086); margin: 2rem; background: #fff; border-radius: 0.5rem; overflow: hidden; position: relative; -webkit-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); -o-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); will-change: opacity, transform; opacity: 0; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .linkBlock__wrap__item:nth-child(0) { -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .linkBlock__wrap__item:nth-child(1) { -webkit-transform: matrix(1, 0, 0, 1, 0, 10); -ms-transform: matrix(1, 0, 0, 1, 0, 10); transform: matrix(1, 0, 0, 1, 0, 10); } .linkBlock__wrap__item:nth-child(2) { -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .linkBlock__wrap__item:nth-child(3) { -webkit-transform: matrix(1, 0, 0, 1, 0, 30); -ms-transform: matrix(1, 0, 0, 1, 0, 30); transform: matrix(1, 0, 0, 1, 0, 30); } .linkBlock__wrap__item:nth-child(4) { -webkit-transform: matrix(1, 0, 0, 1, 0, 40); -ms-transform: matrix(1, 0, 0, 1, 0, 40); transform: matrix(1, 0, 0, 1, 0, 40); } .linkBlock__wrap__item:nth-child(5) { -webkit-transform: matrix(1, 0, 0, 1, 0, 50); -ms-transform: matrix(1, 0, 0, 1, 0, 50); transform: matrix(1, 0, 0, 1, 0, 50); } .linkBlock__wrap__item:nth-child(6) { -webkit-transform: matrix(1, 0, 0, 1, 0, 60); -ms-transform: matrix(1, 0, 0, 1, 0, 60); transform: matrix(1, 0, 0, 1, 0, 60); } .linkBlock__wrap__item:nth-child(7) { -webkit-transform: matrix(1, 0, 0, 1, 0, 70); -ms-transform: matrix(1, 0, 0, 1, 0, 70); transform: matrix(1, 0, 0, 1, 0, 70); } .linkBlock__wrap__item:nth-child(8) { -webkit-transform: matrix(1, 0, 0, 1, 0, 80); -ms-transform: matrix(1, 0, 0, 1, 0, 80); transform: matrix(1, 0, 0, 1, 0, 80); } .linkBlock__wrap__item:nth-child(9) { -webkit-transform: matrix(1, 0, 0, 1, 0, 90); -ms-transform: matrix(1, 0, 0, 1, 0, 90); transform: matrix(1, 0, 0, 1, 0, 90); } .linkBlock__wrap__item:nth-child(10) { -webkit-transform: matrix(1, 0, 0, 1, 0, 100); -ms-transform: matrix(1, 0, 0, 1, 0, 100); transform: matrix(1, 0, 0, 1, 0, 100); } .linkBlock__wrap__item:nth-child(11) { -webkit-transform: matrix(1, 0, 0, 1, 0, 110); -ms-transform: matrix(1, 0, 0, 1, 0, 110); transform: matrix(1, 0, 0, 1, 0, 110); } .linkBlock__wrap__item:nth-child(12) { -webkit-transform: matrix(1, 0, 0, 1, 0, 120); -ms-transform: matrix(1, 0, 0, 1, 0, 120); transform: matrix(1, 0, 0, 1, 0, 120); } .linkBlock__wrap__item.bordered:after { position: absolute; display: block; content: ''; top: 0; left: 0; right: 0; border-top: 4px solid #ed008c; } .linkBlock__wrap__item.inView { opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .linkBlock__wrap__item:hover .linkBlock__wrap__item__content__link svg { -webkit-transform: translateX(0.5rem); -ms-transform: translateX(0.5rem); transform: translateX(0.5rem); } .linkBlock__wrap__item__image { background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; width: 100%; } .linkBlock__wrap__item__image:after { content: ''; position: relative; display: block; padding-bottom: 50%; } .linkBlock__wrap__item__icon { text-align: center; display: block; } .linkBlock__wrap__item__icon img { margin: 2rem auto 0; display: inline-block; max-width: 100%; height: auto; } .linkBlock__wrap__item__content { padding: 1rem 3rem 2rem; } .linkBlock__wrap__item__content__heading { position: relative; margin: 2rem auto 1rem; text-align: center; } .linkBlock__wrap__item__content__link { color: #ed008c; } .linkBlock__wrap__item__content__link svg { -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; } .linkBlock__wrap__item__content__link svg path { fill: #ed008c; } .linkBlock__wrap .linkBlock__wrap__item { width: calc(33.33333% - 4rem); } @media only screen and (max-width: 767px) { .linkBlock__wrap .linkBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .linkBlock__wrap--2 .linkBlock__wrap__item { width: calc(50% - 4rem); } @media only screen and (max-width: 767px) { .linkBlock__wrap--2 .linkBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .linkBlock__wrap--3 .linkBlock__wrap__item { width: calc(33.333% - 4rem); } @media only screen and (max-width: 767px) { .linkBlock__wrap--3 .linkBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .linkBlock__wrap--4 .linkBlock__wrap__item { width: calc(25% - 4rem); } @media only screen and (max-width: 767px) { .linkBlock__wrap--4 .linkBlock__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .locationFilter { position: relative; margin: 10rem auto 0; z-index: 33; } .locationFilter__wrap { margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 4rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background: #1b1a1a; } .locationFilter__wrap__select { min-width: 30rem; margin-right: 3rem; } .locationFilter__wrap__select .choices__inner { border-radius: 0; border: 1px solid #fff; background: transparent; color: #fff; opacity: 1; font-size: 2rem; } .locationFilter__wrap__select .choices__placeholder { opacity: 1; } .map { position: relative; margin: 0 auto; display: block; background: #aadaff; min-height: 40rem; width: 100%; margin-bottom: 10rem; } .map:after { content: ''; position: relative; display: block; padding-bottom: 56.25%; } @media only screen and (max-width: 767px) { .map { width: 100% !important; } } .map .largeMap { position: absolute; top: 0; right: 0; bottom: 0; left: 0; position: absolute !important; z-index: 3; } .map .zoom { position: absolute; bottom: 2rem; right: 2rem; z-index: 9; } .map .zoom__in, .map .zoom__out { font-weight: 700; display: block; width: 4rem; height: 4rem; margin-bottom: 0.2rem; text-decoration: none !important; color: #fff !important; background: #ed008c; text-align: center; line-height: 4rem; font-size: 3rem; font-weight: bold; } .map .zoom__in { line-height: 3.9rem; } .map .zoom__out { line-height: 3.55rem; } .infoBox { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; z-index: 3; width: 33rem; padding: 2rem 2rem; background: #fff; -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2); box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.2); position: absolute; right: calc(50% + 2rem); opacity: 0; -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); visibility: hidden; -webkit-transition: all 333ms ease; -o-transition: all 333ms ease; transition: all 333ms ease; margin-top: -0.8rem; -webkit-transform-origin: 100% -200%; -ms-transform-origin: 100% -200%; transform-origin: 100% -200%; font-size: 1.4rem; } @media only screen and (max-width: 639px) { .infoBox { left: 4rem; right: 3rem; width: auto; -webkit-transform-origin: 50% -250%; -ms-transform-origin: 50% -250%; transform-origin: 50% -250%; } .infoBox:after { display: none !important; } } .infoBox:after { position: absolute; display: block; content: ''; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; width: 0; height: 0; border-style: solid; border-width: 9px 0 9px 9px; border-color: transparent transparent transparent white; left: 100%; } .infoBox.active { opacity: 1; visibility: visible; -webkit-transform: scale(1) translateY(-50%); -ms-transform: scale(1) translateY(-50%); transform: scale(1) translateY(-50%); } .infoBox__content__close { position: Absolute; top: 2rem; right: 2rem; cursor: pointer; } .infoBox__content__close:hover polygon { fill: #ed008c; } .infoBox__content h4 { font-size: 1.6rem; } .infoBox__content p { font-size: 1.4rem; } .infoBox__content p:last-of-type { margin-bottom: 0; } .infoBox__content__narrow-spacer { display: inline-block; width: 2rem; } .infoBox__content__content__wide-spacer { display: inline-block; } .infoBox__content__float-spacer { display: block; float: right; } .megamenu { position: fixed; display: block; left: 0; right: 0; top: 13.3rem; z-index: 99; display: none; -webkit-box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1); background: rgba(255, 255, 255, 0.9); } .megamenu.sticky { position: fixed; top: 11rem; } .megamenu.active { display: block; } .megamenu__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; max-width: 1280px; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: 0 auto; padding: 4rem 2rem 4rem; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .megamenu__wrap__list { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; display: none; position: relative; } .megamenu__wrap__list.active { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .megamenu__wrap__list__column { width: 25%; } .megamenu__wrap__list__column .button, .megamenu__wrap__list__column input[type='submit'] { position: absolute; left: 75%; bottom: 0; } .megamenu__wrap__list__column:after { position: absolute; display: block; content: ''; right: 4rem; top: 0rem; bottom: 0rem; width: 1px; } .megamenu__wrap__list__column:last-of-type:after { display: none; } .megamenu__wrap__list__column h6 { width: 100%; } .megamenu__wrap__list__column__link { display: inline-block; font-weight: 300; width: 100%; font-family: 'urw-din', sans-serif; font-weight: 700; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); position: relative; font-size: 1.4rem; margin-bottom: 0.4rem; } .megamenu__wrap__list__column__link svg { -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); position: absolute; right: calc(100% + 3px); top: 6px; opacity: 0; -webkit-transform: translateX(-0.7rem); -ms-transform: translateX(-0.7rem); transform: translateX(-0.7rem); } .megamenu__wrap__list__column__link svg path { fill: #ed008c; } .megamenu__wrap__list__column__link:hover { -webkit-transform: translateX(1rem); -ms-transform: translateX(1rem); transform: translateX(1rem); } .megamenu__wrap__list__column__link:hover svg { opacity: 1; -webkit-transform: translateX(-0.2rem); -ms-transform: translateX(-0.2rem); transform: translateX(-0.2rem); } .megamenu__wrap__grid { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .megamenu__wrap__grid__link { width: calc(14.285714286% - 2rem); margin: 1rem; font-size: 1.4rem; font-weight: 300; } .megamenu__wrap__grid__link:hover { color: #ed008c; } .megamenu__wrap__grid__link__image { position: relative; background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 1rem; } .megamenu__wrap__grid__link__image:after { content: ''; position: relative; display: block; padding-bottom: 100%; } .mobileMenu { position: fixed; top: 10rem; left: 0; right: 0; background: #fff; z-index: 999999; bottom: 0; padding: 3rem 0 10rem; overflow: auto; -webkit-transition: all 262ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 262ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 262ms cubic-bezier(0.165, 0.84, 0.44, 1); visibility: hidden; opacity: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-overflow-scrolling: touch; } .mobileMenu.sticky { top: 7.9rem; } .mobileMenu__group { margin: 0 auto; } .mobileMenu__group--noKids { opacity: 1; } .mobileMenu__group__topless { font-weight: 700; text-decoration: none; display: block; text-transform: capitalize; position: relative; -webkit-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); padding: 2rem 2rem 2rem 4rem; color: #000; font-size: 2rem; } .mobileMenu__group__topless a { -webkit-box-shadow: none !important; box-shadow: none !important; color: #000; } .mobileMenu__group__topless a:hover { color: #ed008c !important; } .mobileMenu__group__top { font-weight: 700; text-decoration: none; display: block; text-transform: capitalize; position: relative; -webkit-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); padding: 2rem 2rem 2rem 4rem; color: #000; font-size: 2rem; } .mobileMenu__group__top:before { position: absolute; display: block; content: ''; width: 2rem; height: 0.2rem; background: #000; position: absolute; left: 1rem; top: 50%; margin-top: -1px; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: background 111ms ease, -webkit-transform 444ms ease; transition: background 111ms ease, -webkit-transform 444ms ease; -o-transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease, -webkit-transform 444ms ease; } .mobileMenu__group__top:after { position: absolute; display: block; content: ''; width: 2rem; height: 0.2rem; background: #000; position: absolute; left: 1rem; top: 50%; margin-top: -1px; -webkit-transition: background 111ms ease, -webkit-transform 444ms ease; transition: background 111ms ease, -webkit-transform 444ms ease; -o-transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease, -webkit-transform 444ms ease; } .mobileMenu__group__top a { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; right: 2rem; margin-top: -1rem; color: #afa9a9; opacity: 0; -webkit-transform: translateX(-1rem); -ms-transform: translateX(-1rem); transform: translateX(-1rem); -webkit-transition: background 111ms ease, -webkit-transform 444ms ease; transition: background 111ms ease, -webkit-transform 444ms ease; -o-transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease, -webkit-transform 444ms ease; } .mobileMenu__group__top.active { padding-left: 5rem; color: #ed008c; } .mobileMenu__group__top.active a { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .mobileMenu__group__top.active:before, .mobileMenu__group__top.active:after { background: #ed008c; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .mobileMenu__group__top.active + .mobileMenu__group__children .mobileMenu__group__children__item { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .mobileMenu__group__top:hover { color: #ed008c; } .mobileMenu__group__children { background: #ed008c; padding: 0 2rem; } .mobileMenu__group__children__item { font-weight: 700; text-decoration: none; color: #fff; padding: 1.2rem 0rem 1.2rem 3rem; display: block; text-transform: capitalize; -webkit-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); opacity: 0; font-size: 1.6rem !important; } .mobileMenu__group__children__item--top { position: relative; } .mobileMenu__group__children__item--top:before { position: absolute; display: block; content: ''; width: 2rem; height: 0.2rem; background: #fff; position: absolute; left: -1rem; top: 50%; margin-top: -1px; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transition: background 111ms ease, -webkit-transform 444ms ease; transition: background 111ms ease, -webkit-transform 444ms ease; -o-transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease, -webkit-transform 444ms ease; } .mobileMenu__group__children__item--top:after { position: absolute; display: block; content: ''; width: 2rem; height: 0.2rem; background: #fff; position: absolute; left: -1rem; top: 50%; margin-top: -1px; -webkit-transition: background 111ms ease, -webkit-transform 444ms ease; transition: background 111ms ease, -webkit-transform 444ms ease; -o-transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease; transition: transform 444ms ease, background 111ms ease, -webkit-transform 444ms ease; } .mobileMenu__group__children__item--top a { color: #fff; float: right; border-bottom: 2px solid #fff; opacity: 0; } @media only screen and (max-width: 639px) { .mobileMenu__group__children__item { font-size: 2rem; } } .mobileMenu__group__children__item:nth-child(1) { -webkit-transition-delay: 50ms; -o-transition-delay: 50ms; transition-delay: 50ms; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } .mobileMenu__group__children__item:nth-child(2) { -webkit-transition-delay: 100ms; -o-transition-delay: 100ms; transition-delay: 100ms; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } .mobileMenu__group__children__item:nth-child(3) { -webkit-transition-delay: 150ms; -o-transition-delay: 150ms; transition-delay: 150ms; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } .mobileMenu__group__children__item:nth-child(4) { -webkit-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; -webkit-transform: translateX(-40px); -ms-transform: translateX(-40px); transform: translateX(-40px); } .mobileMenu__group__children__item:nth-child(5) { -webkit-transition-delay: 250ms; -o-transition-delay: 250ms; transition-delay: 250ms; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } .mobileMenu__group__children__item:nth-child(6) { -webkit-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; -webkit-transform: translateX(-60px); -ms-transform: translateX(-60px); transform: translateX(-60px); } .mobileMenu__group__children__item:nth-child(7) { -webkit-transition-delay: 350ms; -o-transition-delay: 350ms; transition-delay: 350ms; -webkit-transform: translateX(-70px); -ms-transform: translateX(-70px); transform: translateX(-70px); } .mobileMenu__group__children__item:nth-child(8) { -webkit-transition-delay: 400ms; -o-transition-delay: 400ms; transition-delay: 400ms; -webkit-transform: translateX(-80px); -ms-transform: translateX(-80px); transform: translateX(-80px); } .mobileMenu__group__children__item:nth-child(9) { -webkit-transition-delay: 450ms; -o-transition-delay: 450ms; transition-delay: 450ms; -webkit-transform: translateX(-90px); -ms-transform: translateX(-90px); transform: translateX(-90px); } .mobileMenu__group__children__item:nth-child(10) { -webkit-transition-delay: 500ms; -o-transition-delay: 500ms; transition-delay: 500ms; -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); } .mobileMenu__group__children__item:nth-child(11) { -webkit-transition-delay: 550ms; -o-transition-delay: 550ms; transition-delay: 550ms; -webkit-transform: translateX(-110px); -ms-transform: translateX(-110px); transform: translateX(-110px); } .mobileMenu__group__children__item:nth-child(12) { -webkit-transition-delay: 600ms; -o-transition-delay: 600ms; transition-delay: 600ms; -webkit-transform: translateX(-120px); -ms-transform: translateX(-120px); transform: translateX(-120px); } .mobileMenu__group__children__item:nth-child(13) { -webkit-transition-delay: 650ms; -o-transition-delay: 650ms; transition-delay: 650ms; -webkit-transform: translateX(-130px); -ms-transform: translateX(-130px); transform: translateX(-130px); } .mobileMenu__group__children__item:nth-child(14) { -webkit-transition-delay: 700ms; -o-transition-delay: 700ms; transition-delay: 700ms; -webkit-transform: translateX(-140px); -ms-transform: translateX(-140px); transform: translateX(-140px); } .mobileMenu__group__children__item:nth-child(15) { -webkit-transition-delay: 750ms; -o-transition-delay: 750ms; transition-delay: 750ms; -webkit-transform: translateX(-150px); -ms-transform: translateX(-150px); transform: translateX(-150px); } .mobileMenu__group__children__item:nth-child(16) { -webkit-transition-delay: 800ms; -o-transition-delay: 800ms; transition-delay: 800ms; -webkit-transform: translateX(-160px); -ms-transform: translateX(-160px); transform: translateX(-160px); } .mobileMenu__group__children__item:nth-child(17) { -webkit-transition-delay: 850ms; -o-transition-delay: 850ms; transition-delay: 850ms; -webkit-transform: translateX(-170px); -ms-transform: translateX(-170px); transform: translateX(-170px); } .mobileMenu__group__children__item:nth-child(18) { -webkit-transition-delay: 900ms; -o-transition-delay: 900ms; transition-delay: 900ms; -webkit-transform: translateX(-180px); -ms-transform: translateX(-180px); transform: translateX(-180px); } .mobileMenu__group__children__item:nth-child(19) { -webkit-transition-delay: 950ms; -o-transition-delay: 950ms; transition-delay: 950ms; -webkit-transform: translateX(-190px); -ms-transform: translateX(-190px); transform: translateX(-190px); } .mobileMenu__group__children__item:nth-child(20) { -webkit-transition-delay: 1000ms; -o-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); } .mobileMenu__group__children__item__children__item { font-weight: 700; text-decoration: none; color: #fff !important; padding: 1.2rem 0rem 1.2rem 3rem; display: block; text-transform: capitalize; -webkit-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 222ms cubic-bezier(0.165, 0.84, 0.44, 1); opacity: 0; font-size: 1.4rem !important; } .mobileMenu__group__children__item__children__item a { color: #fff; } .mobileMenu__group__children__item__children__item:nth-child(1) { -webkit-transition-delay: 50ms; -o-transition-delay: 50ms; transition-delay: 50ms; -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } .mobileMenu__group__children__item__children__item:nth-child(2) { -webkit-transition-delay: 100ms; -o-transition-delay: 100ms; transition-delay: 100ms; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } .mobileMenu__group__children__item__children__item:nth-child(3) { -webkit-transition-delay: 150ms; -o-transition-delay: 150ms; transition-delay: 150ms; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } .mobileMenu__group__children__item__children__item:nth-child(4) { -webkit-transition-delay: 200ms; -o-transition-delay: 200ms; transition-delay: 200ms; -webkit-transform: translateX(-40px); -ms-transform: translateX(-40px); transform: translateX(-40px); } .mobileMenu__group__children__item__children__item:nth-child(5) { -webkit-transition-delay: 250ms; -o-transition-delay: 250ms; transition-delay: 250ms; -webkit-transform: translateX(-50px); -ms-transform: translateX(-50px); transform: translateX(-50px); } .mobileMenu__group__children__item__children__item:nth-child(6) { -webkit-transition-delay: 300ms; -o-transition-delay: 300ms; transition-delay: 300ms; -webkit-transform: translateX(-60px); -ms-transform: translateX(-60px); transform: translateX(-60px); } .mobileMenu__group__children__item__children__item:nth-child(7) { -webkit-transition-delay: 350ms; -o-transition-delay: 350ms; transition-delay: 350ms; -webkit-transform: translateX(-70px); -ms-transform: translateX(-70px); transform: translateX(-70px); } .mobileMenu__group__children__item__children__item:nth-child(8) { -webkit-transition-delay: 400ms; -o-transition-delay: 400ms; transition-delay: 400ms; -webkit-transform: translateX(-80px); -ms-transform: translateX(-80px); transform: translateX(-80px); } .mobileMenu__group__children__item__children__item:nth-child(9) { -webkit-transition-delay: 450ms; -o-transition-delay: 450ms; transition-delay: 450ms; -webkit-transform: translateX(-90px); -ms-transform: translateX(-90px); transform: translateX(-90px); } .mobileMenu__group__children__item__children__item:nth-child(10) { -webkit-transition-delay: 500ms; -o-transition-delay: 500ms; transition-delay: 500ms; -webkit-transform: translateX(-100px); -ms-transform: translateX(-100px); transform: translateX(-100px); } .mobileMenu__group__children__item__children__item:nth-child(11) { -webkit-transition-delay: 550ms; -o-transition-delay: 550ms; transition-delay: 550ms; -webkit-transform: translateX(-110px); -ms-transform: translateX(-110px); transform: translateX(-110px); } .mobileMenu__group__children__item__children__item:nth-child(12) { -webkit-transition-delay: 600ms; -o-transition-delay: 600ms; transition-delay: 600ms; -webkit-transform: translateX(-120px); -ms-transform: translateX(-120px); transform: translateX(-120px); } .mobileMenu__group__children__item__children__item:nth-child(13) { -webkit-transition-delay: 650ms; -o-transition-delay: 650ms; transition-delay: 650ms; -webkit-transform: translateX(-130px); -ms-transform: translateX(-130px); transform: translateX(-130px); } .mobileMenu__group__children__item__children__item:nth-child(14) { -webkit-transition-delay: 700ms; -o-transition-delay: 700ms; transition-delay: 700ms; -webkit-transform: translateX(-140px); -ms-transform: translateX(-140px); transform: translateX(-140px); } .mobileMenu__group__children__item__children__item:nth-child(15) { -webkit-transition-delay: 750ms; -o-transition-delay: 750ms; transition-delay: 750ms; -webkit-transform: translateX(-150px); -ms-transform: translateX(-150px); transform: translateX(-150px); } .mobileMenu__group__children__item__children__item:nth-child(16) { -webkit-transition-delay: 800ms; -o-transition-delay: 800ms; transition-delay: 800ms; -webkit-transform: translateX(-160px); -ms-transform: translateX(-160px); transform: translateX(-160px); } .mobileMenu__group__children__item__children__item:nth-child(17) { -webkit-transition-delay: 850ms; -o-transition-delay: 850ms; transition-delay: 850ms; -webkit-transform: translateX(-170px); -ms-transform: translateX(-170px); transform: translateX(-170px); } .mobileMenu__group__children__item__children__item:nth-child(18) { -webkit-transition-delay: 900ms; -o-transition-delay: 900ms; transition-delay: 900ms; -webkit-transform: translateX(-180px); -ms-transform: translateX(-180px); transform: translateX(-180px); } .mobileMenu__group__children__item__children__item:nth-child(19) { -webkit-transition-delay: 950ms; -o-transition-delay: 950ms; transition-delay: 950ms; -webkit-transform: translateX(-190px); -ms-transform: translateX(-190px); transform: translateX(-190px); } .mobileMenu__group__children__item__children__item:nth-child(20) { -webkit-transition-delay: 1000ms; -o-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transform: translateX(-200px); -ms-transform: translateX(-200px); transform: translateX(-200px); } .mobileMenu__group__children__item.active { padding-left: 3rem; } .mobileMenu__group__children__item.active a { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .mobileMenu__group__children__item.active:before, .mobileMenu__group__children__item.active:after { background: #fff; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .mobileMenu__group__children__item.active + .mobileMenu__group__children__item__children .mobileMenu__group__children__item__children__item { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } .mobileMenuActive .header__wrap__logo { width: 148px; } .mobileMenuActive .header.sticky:after { opacity: 0; } .mobileMenuActive .mobileMenu { visibility: visible !important; opacity: 1 !important; } .header__primary__burger { position: absolute; right: 1rem; top: 4.5rem; bottom: 0; width: 4rem; z-index: 2; display: block; } @media only screen and (min-width: 968px) { .header__primary__burger { display: none; } } .header__primary__burger__ring { width: 3.4rem; height: 2px; background: #fff; position: absolute; top: 50%; left: 0; right: 0; margin: 0 auto; -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .header__primary__burger__ring--1 { margin-top: -1rem; -webkit-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; } .header__primary__burger__ring--4 { margin-top: 1rem; -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; } .mobileMenuActive .header { background: #fff; } .mobileMenuActive .header__primary__burger__ring--1 { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } .mobileMenuActive .header__primary__burger__ring--2 { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); background: #ed008c; } .mobileMenuActive .header__primary__burger__ring--3 { -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); background: #ed008c; } .mobileMenuActive .header__primary__burger__ring--4 { -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); } .pagination { max-width: 1280px; margin: 0 auto; } .pagination__wrap { padding: 4rem 2rem; margin: 0 -2rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .pagination__wrap__item { font-family: 'urw-din-condensed', sans-serif; font-weight: 900; font-style: normal; width: 4rem; height: 4rem; display: inline-block; background: #ed008c; color: #fff; margin: 1rem; text-align: center; line-height: 4rem; } .pagination__wrap__item--current { background: #e4e4e4; color: #000; } .partners { position: relative; overflow: hidden; margin-bottom: 10rem; padding: 0 1rem; } .partners__wrap { max-width: 1280px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } .partners__wrap__item { width: calc(25% - 4rem); display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; padding: 1rem; -webkit-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); -o-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); will-change: opacity, transform; opacity: 0; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .partners__wrap__item img { width: 100%; height: auto; } .partners__wrap__item:nth-child(0) { -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .partners__wrap__item:nth-child(1) { -webkit-transform: matrix(1, 0, 0, 1, 0, 10); -ms-transform: matrix(1, 0, 0, 1, 0, 10); transform: matrix(1, 0, 0, 1, 0, 10); } .partners__wrap__item:nth-child(2) { -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .partners__wrap__item:nth-child(3) { -webkit-transform: matrix(1, 0, 0, 1, 0, 30); -ms-transform: matrix(1, 0, 0, 1, 0, 30); transform: matrix(1, 0, 0, 1, 0, 30); } .partners__wrap__item:nth-child(4) { -webkit-transform: matrix(1, 0, 0, 1, 0, 40); -ms-transform: matrix(1, 0, 0, 1, 0, 40); transform: matrix(1, 0, 0, 1, 0, 40); } .partners__wrap__item:nth-child(5) { -webkit-transform: matrix(1, 0, 0, 1, 0, 50); -ms-transform: matrix(1, 0, 0, 1, 0, 50); transform: matrix(1, 0, 0, 1, 0, 50); } .partners__wrap__item:nth-child(6) { -webkit-transform: matrix(1, 0, 0, 1, 0, 60); -ms-transform: matrix(1, 0, 0, 1, 0, 60); transform: matrix(1, 0, 0, 1, 0, 60); } .partners__wrap__item:nth-child(7) { -webkit-transform: matrix(1, 0, 0, 1, 0, 70); -ms-transform: matrix(1, 0, 0, 1, 0, 70); transform: matrix(1, 0, 0, 1, 0, 70); } .partners__wrap__item:nth-child(8) { -webkit-transform: matrix(1, 0, 0, 1, 0, 80); -ms-transform: matrix(1, 0, 0, 1, 0, 80); transform: matrix(1, 0, 0, 1, 0, 80); } .partners__wrap__item:nth-child(9) { -webkit-transform: matrix(1, 0, 0, 1, 0, 90); -ms-transform: matrix(1, 0, 0, 1, 0, 90); transform: matrix(1, 0, 0, 1, 0, 90); } .partners__wrap__item:nth-child(10) { -webkit-transform: matrix(1, 0, 0, 1, 0, 100); -ms-transform: matrix(1, 0, 0, 1, 0, 100); transform: matrix(1, 0, 0, 1, 0, 100); } .partners__wrap__item:nth-child(11) { -webkit-transform: matrix(1, 0, 0, 1, 0, 110); -ms-transform: matrix(1, 0, 0, 1, 0, 110); transform: matrix(1, 0, 0, 1, 0, 110); } .partners__wrap__item:nth-child(12) { -webkit-transform: matrix(1, 0, 0, 1, 0, 120); -ms-transform: matrix(1, 0, 0, 1, 0, 120); transform: matrix(1, 0, 0, 1, 0, 120); } .partners__wrap__item.inView { opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } @media only screen and (max-width: 767px) { .partners__wrap__item { width: 25%; } } @media only screen and (max-width: 539px) { .partners__wrap__item { width: 50%; } } .partners__wrap__item--title { width: 16rem; opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } @media only screen and (max-width: 767px) { .partners__wrap__item--title { width: 100%; } .partners__wrap__item--title br { display: none; } } .percentage { margin-bottom: 10rem; position: relative; } .percentage[data-background='true'] { overflow: hidden; } .percentage__background { background-size: cover; background-position: center center; background-repeat: no-repeat; position: absolute; top: 0; left: 0; height: 165%; width: 100%; } .percentage[data-background='true'] { background-size: cover; background-position: center center; background-repeat: no-repeat; } .percentage[data-background='true']:after { position: absolute; display: block; content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; background: rgba(0, 0, 0, 0.4); } .percentage[data-background='true'] .percentage__wrap { position: relative; z-index: 2; } @media only screen and (max-width: 967px) { .percentage[data-background='true'] .percentage__wrap__image { display: none; } .percentage[data-background='true'] .percentage__wrap__content__inner { float: none; } } .percentage .symbolic { top: auto; bottom: 0; -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%); left: auto; right: 10%; } .percentage--content .percentage__wrap { max-width: 1280px; margin: 0 auto; } .percentage.backgroundColor--black .percentage__wrap__content { background: #000; } .percentage.backgroundColor--none .percentage__wrap__content { background: transparent; } .percentage.backgroundColor--white .percentage__wrap__content { background: #fff; } .percentage.backgroundColor--pink .percentage__wrap__content { background: #ed008c; } .percentage--33-66 .percentage__wrap__item:first-of-type { width: 33.33333333%; } .percentage--33-66 .percentage__wrap__item:last-of-type { width: 66.66666666%; } .percentage--50-50 .percentage__wrap__item { width: 50%; } .percentage--66-33 .percentage__wrap__item:first-of-type { width: 66.66666666%; } .percentage--66-33 .percentage__wrap__item:last-of-type { width: 33.33333333%; } .percentage__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; } .percentage__wrap__content { width: 50%; background: #f7f7f7; } @media only screen and (max-width: 967px) { .percentage__wrap__content { width: 100% !important; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } } .percentage__wrap__content__inner { padding: 12rem 8rem; float: right; } @media only screen and (max-width: 967px) { .percentage__wrap__content__inner { width: 100%; max-width: 6000rem; padding: 8rem 2rem 6rem; } } .percentage__wrap__image { background-size: cover; background-position: center center; background-repeat: no-repeat; width: 50%; position: relative; } @media only screen and (max-width: 967px) { .percentage__wrap__image { position: relative; width: 100% !important; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .percentage__wrap__image:after { content: ''; position: relative; display: block; padding-bottom: 56.25%; } } .animatedPanel { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 9; } .animatedPanel__colour { position: absolute; display: block; content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); left: -1px; top: -1px; background: #ed008c; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; } .animatedPanel:before { position: absolute; display: block; content: ''; position: absolute; width: calc(100% + 2px); height: calc(100% + 2px); left: -1px; top: -1px; background: #f7f7f7; -webkit-transform: scaleX(1); -ms-transform: scaleX(1); transform: scaleX(1); -webkit-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; } @keyframes overPanelImage { 0% { -webkit-transform: scaleX(0); transform: scaleX(0); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } @keyframes underPanelImage { 0% { -webkit-transform: scaleX(1); transform: scaleX(1); } 38% { -webkit-transform: scaleX(1); transform: scaleX(1); } 40% { -webkit-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: scaleX(1); transform: scaleX(1); } 41% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(1); transform: scaleX(1); } 100% { -webkit-transform-origin: 100% 100%; transform-origin: 100% 100%; -webkit-transform: scaleX(0); transform: scaleX(0); } } .animatedPanel.inView:before { -webkit-animation-name: underPanelImage; animation-name: underPanelImage; -webkit-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); -o-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .animatedPanel.inView .animatedPanel__colour { -webkit-animation-name: overPanelImage; animation-name: overPanelImage; -webkit-animation-duration: 1.1s; animation-duration: 1.1s; -webkit-animation-iteration-count: 1; animation-iteration-count: 1; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); -o-transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); transition-timing-function: cubic-bezier(0.25, 0.46, 0.45, 0.94); } .product { position: relative; margin: 0 auto 10rem; padding: 0 2rem; z-index: 4; } .product__wrap { margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: start; align-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; max-width: 1280px; } .product__wrap__content { width: 60%; } @media only screen and (max-width: 767px) { .product__wrap__content { width: 100%; } } .product__wrap__secondary { width: 40%; } @media only screen and (max-width: 767px) { .product__wrap__secondary { width: 100%; margin-top: 5rem; } } .product__wrap__secondary__image img { width: 100%; height: auto; max-width: 35rem; margin: 0 auto; } @media only screen and (max-width: 767px) { .product__wrap__secondary__image img { margin: 0 auto 5rem; } } .product__wrap__secondary__downloads { padding: 4rem 2rem 0; } .product__wrap__secondary__downloads h3 { padding-left: 2rem; } .product__wrap__secondary__downloads .downloadBlock__wrap__list__item__extension { display: none; } .product__wrap__secondary__downloads .downloadBlock { margin-bottom: 5rem; } .product__wrap__secondary__links { padding: 0 4rem; } .product__wrap__secondary__links__item { display: block; background: #ed008c; margin-bottom: 3rem; padding: 6rem 3rem 2rem; position: relative; } .product__wrap__secondary__links__item h5 { font-family: 'urw-din-condensed', sans-serif; font-weight: 900; font-style: normal; margin: 0; } .product__wrap__secondary__links__item svg { position: absolute; bottom: 3rem; right: 2rem; } .product__wrap__secondary__links__item svg path { stroke: #fff; } .product__wrap__secondary__links__item--grey { background: #afa9a9; color: #fff; } .product__wrap__secondary__links__item--grey svg path { stroke: #ed008c; } [data-classname='Toast\\Pages\\ProductPage'] .breadCrumbs__wrap { padding-right: 40rem; } .products { position: relative; margin: 0 auto 10rem; padding: 0 2rem; } .products__wrap { margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: start; align-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; max-width: 1024px; } .products__wrap__item { margin: 2rem; background: #fff; overflow: hidden; position: relative; -webkit-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); -o-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); will-change: opacity, transform; opacity: 0; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); width: calc(50% - 4rem); } @media only screen and (max-width: 767px) { .products__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .products__wrap__item:nth-child(0) { -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .products__wrap__item:nth-child(1) { -webkit-transform: matrix(1, 0, 0, 1, 0, 10); -ms-transform: matrix(1, 0, 0, 1, 0, 10); transform: matrix(1, 0, 0, 1, 0, 10); } .products__wrap__item:nth-child(2) { -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .products__wrap__item:nth-child(3) { -webkit-transform: matrix(1, 0, 0, 1, 0, 30); -ms-transform: matrix(1, 0, 0, 1, 0, 30); transform: matrix(1, 0, 0, 1, 0, 30); } .products__wrap__item:nth-child(4) { -webkit-transform: matrix(1, 0, 0, 1, 0, 40); -ms-transform: matrix(1, 0, 0, 1, 0, 40); transform: matrix(1, 0, 0, 1, 0, 40); } .products__wrap__item:nth-child(5) { -webkit-transform: matrix(1, 0, 0, 1, 0, 50); -ms-transform: matrix(1, 0, 0, 1, 0, 50); transform: matrix(1, 0, 0, 1, 0, 50); } .products__wrap__item:nth-child(6) { -webkit-transform: matrix(1, 0, 0, 1, 0, 60); -ms-transform: matrix(1, 0, 0, 1, 0, 60); transform: matrix(1, 0, 0, 1, 0, 60); } .products__wrap__item:nth-child(7) { -webkit-transform: matrix(1, 0, 0, 1, 0, 70); -ms-transform: matrix(1, 0, 0, 1, 0, 70); transform: matrix(1, 0, 0, 1, 0, 70); } .products__wrap__item:nth-child(8) { -webkit-transform: matrix(1, 0, 0, 1, 0, 80); -ms-transform: matrix(1, 0, 0, 1, 0, 80); transform: matrix(1, 0, 0, 1, 0, 80); } .products__wrap__item:nth-child(9) { -webkit-transform: matrix(1, 0, 0, 1, 0, 90); -ms-transform: matrix(1, 0, 0, 1, 0, 90); transform: matrix(1, 0, 0, 1, 0, 90); } .products__wrap__item:nth-child(10) { -webkit-transform: matrix(1, 0, 0, 1, 0, 100); -ms-transform: matrix(1, 0, 0, 1, 0, 100); transform: matrix(1, 0, 0, 1, 0, 100); } .products__wrap__item:nth-child(11) { -webkit-transform: matrix(1, 0, 0, 1, 0, 110); -ms-transform: matrix(1, 0, 0, 1, 0, 110); transform: matrix(1, 0, 0, 1, 0, 110); } .products__wrap__item:nth-child(12) { -webkit-transform: matrix(1, 0, 0, 1, 0, 120); -ms-transform: matrix(1, 0, 0, 1, 0, 120); transform: matrix(1, 0, 0, 1, 0, 120); } .products__wrap__item.inView { opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .products__wrap__item:hover .products__wrap__item__image__tag { -webkit-transform: rotateX(0); transform: rotateX(0); opacity: 1; } .products__wrap__item__image { background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; width: 100%; -webkit-perspective: 600; perspective: 600; } .products__wrap__item__image:after { content: ''; position: relative; display: block; padding-bottom: 50%; } .products__wrap__item__image__tag { font-family: 'urw-din-condensed', sans-serif; font-weight: 900; font-style: normal; position: absolute; top: 0; left: 3rem; padding: 4rem 1.2rem 1rem; background: #ed008c; color: #fff; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transform-origin: 0% 0; -ms-transform-origin: 0% 0; transform-origin: 0% 0; -webkit-transform: rotateX(-50deg); transform: rotateX(-50deg); opacity: 0; } .products__wrap__item__content { padding: 1rem 0 0; } .products__wrap__item__content__heading { position: relative; margin: 2rem auto 1rem; opacity: 0.4; } [data-classname='Toast\\Pages\\ProductCategoryPage'] .products__wrap__item__image { position: relative; } [data-classname='Toast\\Pages\\ProductCategoryPage'] .products__wrap__item__image:after { content: ''; position: relative; display: block; padding-bottom: 100%; } .columns--2 .products__wrap__item { width: calc(50% - 4rem); } @media only screen and (max-width: 767px) { .columns--2 .products__wrap__item { width: calc(100%); } } .columns--3 .products__wrap__item { width: calc(33.3333% - 4rem); } @media only screen and (max-width: 767px) { .columns--3 .products__wrap__item { width: calc(100%); } } .columns--4 .products__wrap__item { width: calc(25% - 4rem); } @media only screen and (max-width: 767px) { .columns--4 .products__wrap__item { width: calc(100%); } } .questions { position: relative; overflow: hidden; background: #ececec; padding: 10rem 2rem; } .questions__image { position: absolute; right: 0; width: auto; height: 130%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); position: absolute; z-index: 1; max-width: none; } @media only screen and (max-width: 767px) { .questions:after { position: absolute; display: block; content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0, 0, 0, 0.4); z-index: 2; } } .questions__wrap { max-width: 1280px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; z-index: 3; position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-line-pack: center; align-content: center; } @media only screen and (max-width: 967px) { .questions__wrap { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .questions__wrap * { text-align: center; } } .questions__wrap__text { -webkit-transform: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); -ms-transform: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); transform: all 1s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transform: translateY(2rem); -ms-transform: translateY(2rem); transform: translateY(2rem); opacity: 0; } @media only screen and (max-width: 967px) { .questions__wrap__text { color: #fff; text-align: center; } } .questions__wrap__text.inView { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } .busy .js-list { opacity: 0.3; pointer-events: none; } .js-list { -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); } .resources { padding: 0 2rem 10rem; } .resources .loader { margin-top: 20rem; z-index: 444; } .resources .downloadBlock__wrap__list { max-width: 968px; margin: 0 auto; } .resources__wrap { margin: 4rem auto; max-width: 968px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .resources__wrap__filter { min-width: 30rem; position: relative; margin-right: 0rem; } .resources__wrap__filter .choices__inner { border-radius: 0; border: 1px solid #fff; background: transparent; color: #fff; opacity: 1; font-size: 2rem; } .resources__wrap__filter .choices__placeholder { opacity: 1; } .resources__wrap__filter__label { color: #fff; position: absolute; top: -2.5rem; font-size: 1.4rem; font-weight: 500; } /*------------------------------------------------------------------ Dark background ------------------------------------------------------------------*/ .darkBackground { background: #1b1a1a; } .darkBackground .downloadBlock__wrap__list__item__extension, .darkBackground .downloadBlock__wrap__list__item__details__title { color: #fff; } .darkBackground .breadCrumbs { border: 0; } .darkBackground .breadCrumbs__wrap__item path { fill: #fff; } .darkBackground .breadCrumbs__wrap__item polygon { fill: #fff; } .darkBackground .breadCrumbs__wrap__item { color: #fff; } /*------------------------------------------------------------------ Dark background ------------------------------------------------------------------*/ .loader { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin: 0 auto; width: 50%; position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); opacity: 0; visibility: hidden; } .loader.active { opacity: 1; visibility: visible; } @-webkit-keyframes rotate { 0% { -webkit-transform: rotateX(-37.5deg) rotateY(45deg); transform: rotateX(-37.5deg) rotateY(45deg); } 50% { -webkit-transform: rotateX(-37.5deg) rotateY(405deg); transform: rotateX(-37.5deg) rotateY(405deg); } 100% { -webkit-transform: rotateX(-37.5deg) rotateY(405deg); transform: rotateX(-37.5deg) rotateY(405deg); } } @keyframes rotate { 0% { -webkit-transform: rotateX(-37.5deg) rotateY(45deg); transform: rotateX(-37.5deg) rotateY(45deg); } 50% { -webkit-transform: rotateX(-37.5deg) rotateY(405deg); transform: rotateX(-37.5deg) rotateY(405deg); } 100% { -webkit-transform: rotateX(-37.5deg) rotateY(405deg); transform: rotateX(-37.5deg) rotateY(405deg); } } .cube, .cube * { position: absolute; width: 151px; height: 151px; } .sides { -webkit-animation: rotate 3s ease infinite; animation: rotate 3s ease infinite; -webkit-animation-delay: 0.8s; animation-delay: 0.8s; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: rotateX(-37.5deg) rotateY(45deg); transform: rotateX(-37.5deg) rotateY(45deg); } .cube .sides * { -webkit-box-sizing: border-box; box-sizing: border-box; background-color: rgba(237, 29, 140, 0.5); border: 2px solid white; } .cube .sides .top { -webkit-animation: top-animation 3s ease infinite; animation: top-animation 3s ease infinite; -webkit-animation-delay: 0ms; animation-delay: 0ms; -webkit-transform: rotateX(90deg) translateZ(150px); transform: rotateX(90deg) translateZ(150px); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } @-webkit-keyframes top-animation { 0% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(150px); transform: rotateX(90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(75px); transform: rotateX(90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(75px); transform: rotateX(90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(150px); transform: rotateX(90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(150px); transform: rotateX(90deg) translateZ(150px); } } @keyframes top-animation { 0% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(150px); transform: rotateX(90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(75px); transform: rotateX(90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(75px); transform: rotateX(90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(150px); transform: rotateX(90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateX(90deg) translateZ(150px); transform: rotateX(90deg) translateZ(150px); } } .cube .sides .bottom { -webkit-animation: bottom-animation 3s ease infinite; animation: bottom-animation 3s ease infinite; -webkit-animation-delay: 0ms; animation-delay: 0ms; -webkit-transform: rotateX(-90deg) translateZ(150px); transform: rotateX(-90deg) translateZ(150px); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } @-webkit-keyframes bottom-animation { 0% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(150px); transform: rotateX(-90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(75px); transform: rotateX(-90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(75px); transform: rotateX(-90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(150px); transform: rotateX(-90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(150px); transform: rotateX(-90deg) translateZ(150px); } } @keyframes bottom-animation { 0% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(150px); transform: rotateX(-90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(75px); transform: rotateX(-90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(75px); transform: rotateX(-90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(150px); transform: rotateX(-90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateX(-90deg) translateZ(150px); transform: rotateX(-90deg) translateZ(150px); } } .cube .sides .front { -webkit-animation: front-animation 3s ease infinite; animation: front-animation 3s ease infinite; -webkit-animation-delay: 100ms; animation-delay: 100ms; -webkit-transform: rotateY(0deg) translateZ(150px); transform: rotateY(0deg) translateZ(150px); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } @-webkit-keyframes front-animation { 0% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(150px); transform: rotateY(0deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(75px); transform: rotateY(0deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(75px); transform: rotateY(0deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(150px); transform: rotateY(0deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(150px); transform: rotateY(0deg) translateZ(150px); } } @keyframes front-animation { 0% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(150px); transform: rotateY(0deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(75px); transform: rotateY(0deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(75px); transform: rotateY(0deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(150px); transform: rotateY(0deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(0deg) translateZ(150px); transform: rotateY(0deg) translateZ(150px); } } .cube .sides .back { -webkit-animation: back-animation 3s ease infinite; animation: back-animation 3s ease infinite; -webkit-animation-delay: 100ms; animation-delay: 100ms; -webkit-transform: rotateY(-180deg) translateZ(150px); transform: rotateY(-180deg) translateZ(150px); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } @-webkit-keyframes back-animation { 0% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(150px); transform: rotateY(-180deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(75px); transform: rotateY(-180deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(75px); transform: rotateY(-180deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(150px); transform: rotateY(-180deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(150px); transform: rotateY(-180deg) translateZ(150px); } } @keyframes back-animation { 0% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(150px); transform: rotateY(-180deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(75px); transform: rotateY(-180deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(75px); transform: rotateY(-180deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(150px); transform: rotateY(-180deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(-180deg) translateZ(150px); transform: rotateY(-180deg) translateZ(150px); } } .cube .sides .left { -webkit-animation: left-animation 3s ease infinite; animation: left-animation 3s ease infinite; -webkit-animation-delay: 100ms; animation-delay: 100ms; -webkit-transform: rotateY(-90deg) translateZ(150px); transform: rotateY(-90deg) translateZ(150px); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } @-webkit-keyframes left-animation { 0% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(150px); transform: rotateY(-90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(75px); transform: rotateY(-90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(75px); transform: rotateY(-90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(150px); transform: rotateY(-90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(150px); transform: rotateY(-90deg) translateZ(150px); } } @keyframes left-animation { 0% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(150px); transform: rotateY(-90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(75px); transform: rotateY(-90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(75px); transform: rotateY(-90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(150px); transform: rotateY(-90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(-90deg) translateZ(150px); transform: rotateY(-90deg) translateZ(150px); } } .cube .sides .right { -webkit-animation: right-animation 3s ease infinite; animation: right-animation 3s ease infinite; -webkit-animation-delay: 100ms; animation-delay: 100ms; -webkit-transform: rotateY(90deg) translateZ(150px); transform: rotateY(90deg) translateZ(150px); -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; } @-webkit-keyframes right-animation { 0% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(150px); transform: rotateY(90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(75px); transform: rotateY(90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(75px); transform: rotateY(90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(150px); transform: rotateY(90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(150px); transform: rotateY(90deg) translateZ(150px); } } @keyframes right-animation { 0% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(150px); transform: rotateY(90deg) translateZ(150px); } 20% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(75px); transform: rotateY(90deg) translateZ(75px); } 70% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(75px); transform: rotateY(90deg) translateZ(75px); } 90% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(150px); transform: rotateY(90deg) translateZ(150px); } 100% { opacity: 1; -webkit-transform: rotateY(90deg) translateZ(150px); transform: rotateY(90deg) translateZ(150px); } } .searchResultsHeader { margin: 4rem auto; } .searchResults__wrap { max-width: 1280px; margin: 0 auto; padding: 5rem 0; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .searchResults__wrap__item { margin: 2rem; background: #fff; overflow: hidden; position: relative; -webkit-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); -o-transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 800ms cubic-bezier(0.4, 0, 0.2, 1), transform 800ms cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 800ms cubic-bezier(0.4, 0, 0.2, 1); will-change: opacity, transform; opacity: 0; -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); width: calc(33.333% - 4rem); } @media only screen and (max-width: 767px) { .searchResults__wrap__item { width: calc(100%); margin: 2rem 1rem; } } .searchResults__wrap__item:nth-child(0) { -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .searchResults__wrap__item:nth-child(1) { -webkit-transform: matrix(1, 0, 0, 1, 0, 10); -ms-transform: matrix(1, 0, 0, 1, 0, 10); transform: matrix(1, 0, 0, 1, 0, 10); } .searchResults__wrap__item:nth-child(2) { -webkit-transform: matrix(1, 0, 0, 1, 0, 20); -ms-transform: matrix(1, 0, 0, 1, 0, 20); transform: matrix(1, 0, 0, 1, 0, 20); } .searchResults__wrap__item:nth-child(3) { -webkit-transform: matrix(1, 0, 0, 1, 0, 30); -ms-transform: matrix(1, 0, 0, 1, 0, 30); transform: matrix(1, 0, 0, 1, 0, 30); } .searchResults__wrap__item:nth-child(4) { -webkit-transform: matrix(1, 0, 0, 1, 0, 40); -ms-transform: matrix(1, 0, 0, 1, 0, 40); transform: matrix(1, 0, 0, 1, 0, 40); } .searchResults__wrap__item:nth-child(5) { -webkit-transform: matrix(1, 0, 0, 1, 0, 50); -ms-transform: matrix(1, 0, 0, 1, 0, 50); transform: matrix(1, 0, 0, 1, 0, 50); } .searchResults__wrap__item:nth-child(6) { -webkit-transform: matrix(1, 0, 0, 1, 0, 60); -ms-transform: matrix(1, 0, 0, 1, 0, 60); transform: matrix(1, 0, 0, 1, 0, 60); } .searchResults__wrap__item:nth-child(7) { -webkit-transform: matrix(1, 0, 0, 1, 0, 70); -ms-transform: matrix(1, 0, 0, 1, 0, 70); transform: matrix(1, 0, 0, 1, 0, 70); } .searchResults__wrap__item:nth-child(8) { -webkit-transform: matrix(1, 0, 0, 1, 0, 80); -ms-transform: matrix(1, 0, 0, 1, 0, 80); transform: matrix(1, 0, 0, 1, 0, 80); } .searchResults__wrap__item:nth-child(9) { -webkit-transform: matrix(1, 0, 0, 1, 0, 90); -ms-transform: matrix(1, 0, 0, 1, 0, 90); transform: matrix(1, 0, 0, 1, 0, 90); } .searchResults__wrap__item:nth-child(10) { -webkit-transform: matrix(1, 0, 0, 1, 0, 100); -ms-transform: matrix(1, 0, 0, 1, 0, 100); transform: matrix(1, 0, 0, 1, 0, 100); } .searchResults__wrap__item:nth-child(11) { -webkit-transform: matrix(1, 0, 0, 1, 0, 110); -ms-transform: matrix(1, 0, 0, 1, 0, 110); transform: matrix(1, 0, 0, 1, 0, 110); } .searchResults__wrap__item:nth-child(12) { -webkit-transform: matrix(1, 0, 0, 1, 0, 120); -ms-transform: matrix(1, 0, 0, 1, 0, 120); transform: matrix(1, 0, 0, 1, 0, 120); } .searchResults__wrap__item.inView { opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); -ms-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); } .searchResults__wrap__item:hover .searchResults__wrap__item__image__tag { -webkit-transform: rotateX(0); transform: rotateX(0); opacity: 1; } .searchResults__wrap__item__image { background-size: cover; background-position: center center; background-repeat: no-repeat; position: relative; width: 100%; -webkit-perspective: 600; perspective: 600; } .searchResults__wrap__item__image:after { content: ''; position: relative; display: block; padding-bottom: 50%; } .searchResults__wrap__item__image__tag { font-family: 'urw-din-condensed', sans-serif; font-weight: 900; font-style: normal; position: absolute; top: 0; left: 3rem; padding: 4rem 1.2rem 1rem; background: #ed008c; color: #fff; -webkit-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1); -webkit-transform-origin: 0% 0; -ms-transform-origin: 0% 0; transform-origin: 0% 0; -webkit-transform: rotateX(-50deg); transform: rotateX(-50deg); opacity: 0; } .searchResults__wrap__item__content { padding: 1rem 0 0; } .searchResults__wrap__item__content__heading { position: relative; margin: 2rem auto 1rem; opacity: 0.4; } .searchActive .searchPane { opacity: 1; visibility: visible; } .searchActive .searchPane .text:after { -webkit-transform: scaleX(1) !important; -ms-transform: scaleX(1) !important; transform: scaleX(1) !important; } .searchActive .searchPane__wrap__close { -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } .searchPane { position: absolute; top: 0; right: 0; bottom: 0; left: 0; position: fixed; background: rgba(0, 0, 0, 0.9); -webkit-transition: all 555ms ease; -o-transition: all 555ms ease; transition: all 555ms ease; z-index: 9999999999; opacity: 0; visibility: hidden; } .searchPane__wrap { max-width: 1024px; margin: 0 auto; position: relative; padding: 0 2rem; } .searchPane__wrap__close { position: absolute; top: 4rem; right: 2rem; -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1); -o-transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.8s cubic-bezier(0.165, 0.84, 0.44, 1); cursor: pointer; } .searchPane__wrap__close svg polygon { fill: #ed008c; } .searchPane__wrap__form { padding-top: 30rem; } .searchPane__wrap__form .field label { display: none !important; } .searchPane__wrap__form .field.text { margin-bottom: 2rem; position: relative; } .searchPane__wrap__form .field.text:after { position: absolute; display: block; content: ''; border-bottom: 0.4rem solid #ed008c; bottom: 0; width: 100%; -webkit-transition: all 666ms ease; -o-transition: all 666ms ease; transition: all 666ms ease; -webkit-transform: scaleX(0); -ms-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; } @media only screen and (max-width: 639px) { .searchPane__wrap__form .field.text:after { border-bottom: 0.2rem solid #ed008c; } } .searchPane__wrap__form .field .text { background: transparent; border: 0; border-radius: 0; margin: 0; color: #fff; -webkit-box-shadow: none !important; box-shadow: none !important; font-size: 5rem; padding-left: 0 !important; } @media only screen and (max-width: 767px) { .searchPane__wrap__form .field .text { font-size: 3rem; } } @media only screen and (max-width: 639px) { .searchPane__wrap__form .field .text { font-size: 2.4rem; } } .searchPane__wrap__form .field .text::-webkit-input-placeholder { opacity: 1 !important; color: #fff !important; } .searchPane__wrap__form .field .text:-moz-placeholder { opacity: 1 !important; color: #fff !important; } .searchPane__wrap__form .field .text::-moz-placeholder { opacity: 1 !important; color: #fff !important; } .searchPane__wrap__form .field .text:-ms-input-placeholder { opacity: 1 !important; color: #fff !important; } .searchPane__wrap__form .action { display: none; } .searchPane__wrap__form__direction { font-weight: 700; color: #ed008c; display: block; text-align: right; } @media only screen and (max-width: 639px) { .searchPane__wrap__form__direction { font-size: 1.2rem !important; } } .percentage + .split { margin-top: -10rem; } @media only screen and (max-width: 767px) { .percentage + .percentage { margin-top: -10rem; } } .split { position: relative; overflow: hidden; margin-bottom: 10rem; } .split__wrap { max-width: 1280px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .split__wrap__item { width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; } @media only screen and (max-width: 767px) { .split__wrap__item { width: 100%; -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } } .split__wrap__item__inner { max-width: 70rem; padding: 10rem 4rem; } @media only screen and (max-width: 767px) { .split__wrap__item__inner { padding: 4rem 2rem; } } .split__wrap__item:first-of-type { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; background: #e4e4e4; } .split__wrap__item:first-of-type:before { position: absolute; display: block; content: ''; width: 50vw; right: 50%; top: 0; bottom: 0; background: #e4e4e4; z-index: -1; } @media only screen and (max-width: 767px) { .split__wrap__item:first-of-type:before { display: none; } } .split__wrap__item:last-of-type { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; background: #000; } .split__wrap__item:last-of-type *:not(a) { color: #fff; } .split__wrap__item:last-of-type:before { position: absolute; display: block; content: ''; width: 50vw; left: 50%; top: 0; bottom: 0; background: #000; z-index: -1; } @media only screen and (max-width: 767px) { .split__wrap__item:last-of-type:before { display: none; } } .split__wrap__item--grey { background: #e4e4e4 !important; } .split__wrap__item--grey:before { background: #e4e4e4 !important; } .split__wrap__item--black { background: #000 !important; } .split__wrap__item--black:before { background: #000 !important; } .split__wrap__item--pink { background: #ed008c !important; } .split__wrap__item--pink:before { background: #ed008c !important; } .split__wrap__item--white { background: #fff !important; } .split__wrap__item--white:before { background: #fff !important; } .tabBlock__wrap { margin: 0 auto; max-width: 1280px; padding: 0 2rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .tabBlock__wrap__tabs { width: 35rem; border-right: 1px solid #e4e4e4; position: relative; } @media only screen and (max-width: 967px) { .tabBlock__wrap__tabs { width: 100%; border-right: 0 solid #e4e4e4; border-left: 1px solid #e4e4e4; padding-left: 2rem; margin-bottom: 4rem; } } .tabBlock__wrap__tabs__indicator { position: absolute; width: 4px; right: -1px; min-height: 2rem; background: #ed008c; -webkit-transition: all 600ms cubic-bezier(0.4, 0, 0.2, 1); -o-transition: all 600ms cubic-bezier(0.4, 0, 0.2, 1); transition: all 600ms cubic-bezier(0.4, 0, 0.2, 1); } @media only screen and (max-width: 967px) { .tabBlock__wrap__tabs__indicator { right: auto; left: -1px; } } .tabBlock__wrap__tabs__item { padding: 1rem 0; display: block; } @media only screen and (max-width: 967px) { .tabBlock__wrap__tabs__item { padding: 0; } } .tabBlock__wrap__tabs__item.active h6 { color: #ed008c; } .tabBlock__wrap__content { width: calc(100% - 35rem); padding: 0 4rem; } @media only screen and (max-width: 967px) { .tabBlock__wrap__content { width: 100%; padding: 0; } } .tabBlock__wrap__content__item { display: none; } .tabBlock__wrap__content__item.active { display: block; } .testimonialBlock__wrap { margin: 0 auto; max-width: 1280px; padding: 0 2rem; } .textBlock { padding: 0 2rem; } .textBlock__wrap { margin: 0 auto; max-width: 1280px; } .textBlock--narrow .textBlock__wrap { max-width: 968px; } .iframeBlock { padding: 0 2rem; } .iframeBlock iframe { width: 100%; } .iframeBlock__wrap { margin: 0 auto; max-width: 968px; } .iframeBlock--narrow .textBlock__wrap { max-width: 968px; } .videoBlock { padding: 0 2rem; } .videoBlock__wrap { margin: 0 auto; max-width: 1280px; position: relative; overflow: hidden; display: block; } .videoBlock__wrap:after { content: ''; position: relative; display: block; padding-bottom: 56.25%; } .videoBlock__wrap:hover .videoBlock__wrap__background { cursor: pointer; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .videoBlock__wrap__background { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center center; background-repeat: no-repeat; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); -webkit-transition: all 555ms ease; -o-transition: all 555ms ease; transition: all 555ms ease; z-index: 1; } .videoBlock__wrap__icon { position: relative; position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 8rem; z-index: 2; cursor: pointer; } .videoBlock__wrap__icon:after { content: ''; position: relative; display: block; padding-bottom: 100%; } .videoBlock__wrap__icon svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .videoBlock__wrap__icon circle { fill: #ed008c; } .videos { padding: 0 2rem; width: 100%; background: #1b1a1a; } .videos__wrap { margin: 0 auto; padding-top: 5rem; padding-bottom: 10rem; max-width: 1280px; overflow: hidden; display: block; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .videos__wrap__title { width: 100%; color: #fff; margin-bottom: 5rem; } .videos__wrap__item { width: calc(50% - 2rem); position: relative; margin-bottom: 2rem; } @media only screen and (max-width: 767px) { .videos__wrap__item { width: 100%; } } .videos__wrap__item:hover .videos__wrap__item__video__background { cursor: pointer; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .videos__wrap__item__video { position: relative; position: relative; display: block; overflow: hidden; margin-bottom: 2rem; } .videos__wrap__item__video:after { content: ''; position: relative; display: block; padding-bottom: 56.25%; } .videos__wrap__item__video__background { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center center; background-repeat: no-repeat; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); -webkit-transition: all 555ms ease; -o-transition: all 555ms ease; transition: all 555ms ease; z-index: 1; } .videos__wrap__item__video__icon { position: relative; position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 8rem; z-index: 2; cursor: pointer; } .videos__wrap__item__video__icon:after { content: ''; position: relative; display: block; padding-bottom: 100%; } .videos__wrap__item__video__icon svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .videos__wrap__item__video__icon circle { fill: #ed008c; } .videos__wrap__item h5 { color: #fff; } .videos__wrap__item p { color: #fff; } .videoSplit { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; margin-bottom: 10rem; } .videoSplit.reversed .videoSplit__video { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .videoSplit.reversed .videoSplit__content { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .videoSplit__content { background: #afa9a9; width: 45%; } @media only screen and (max-width: 767px) { .videoSplit__content { width: 100%; } } .videoSplit__content__inner { padding: 12rem 8rem; max-width: 50rem; } @media only screen and (max-width: 767px) { .videoSplit__content__inner { width: 100%; padding: 4rem 2rem; } } .videoSplit__video { margin: 0 auto; width: 55%; overflow: hidden; display: block; position: relative; cursor: pointer; } @media only screen and (max-width: 767px) { .videoSplit__video { width: 100%; position: relative; } .videoSplit__video:after { content: ''; position: relative; display: block; padding-bottom: 56.25%; } } .videoSplit__video__background { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-size: cover; background-position: center center; background-repeat: no-repeat; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); -webkit-transition: all 555ms ease; -o-transition: all 555ms ease; transition: all 555ms ease; z-index: 1; } .videoSplit__video:hover .videoSplit__video__background { cursor: pointer; -webkit-transform: scale(1) !important; -ms-transform: scale(1) !important; transform: scale(1) !important; } .videoSplit__video__icon { position: relative; position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); width: 8rem; z-index: 2; cursor: pointer; } .videoSplit__video__icon:after { content: ''; position: relative; display: block; padding-bottom: 100%; } .videoSplit__video__icon svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .videoSplit__video__icon circle { fill: #ed008c; } /*# sourceMappingURL=main.css.map*/