/** * Swiper 6.6.2 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2021 Vladimir Kharlampidi * * Released under the MIT License * * Released on: May 19, 2021 */ @font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA') format('woff');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}.swiper-container{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-container-multirow>.swiper-wrapper{flex-wrap:wrap}.swiper-container-multirow-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-container-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-container-pointer-events{touch-action:pan-y}.swiper-container-pointer-events.swiper-container-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-container-3d{perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-container-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper{scroll-snap-type:y mandatory} /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 1042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 1043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 1044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 1046; box-shadow: none; touch-action: manipulation; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow:before, .mfp-arrow:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { transform: scale(0.75); } .mfp-arrow-left { transform-origin: 0; } .mfp-arrow-right { transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ 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, main, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } /*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */ /* Document ========================================================================== */ /** * 1. Correct the line height in all browsers. * 2. Prevent adjustments of font size after orientation changes in * IE on Windows Phone and in iOS. */ html { line-height: 1.15; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /* Sections ========================================================================== */ /** * Remove the margin in all browsers (opinionated). */ body { margin: 0; } /** * Add the correct display in IE 9-. */ article, aside, footer, header, nav, section { display: block; } /** * Correct the font size and margin on `h1` elements within `section` and * `article` contexts in Chrome, Firefox, and Safari. */ h1 { font-size: 2em; margin: 0.67em 0; } /* Grouping content ========================================================================== */ /** * Add the correct display in IE 9-. * 1. Add the correct display in IE. */ figcaption, figure, main { /* 1 */ display: block; } /** * Add the correct margin in IE 8. */ figure { margin: 1em 40px; } /** * 1. Add the correct box sizing in Firefox. * 2. Show the overflow in Edge and IE. */ hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Text-level semantics ========================================================================== */ /** * 1. Remove the gray background on active links in IE 10. * 2. Remove gaps in links underline in iOS 8+ and Safari 8+. */ a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ } /** * 1. Remove the bottom border in Chrome 57- and Firefox 39-. * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */ abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ -webkit-text-decoration: underline dotted; text-decoration: underline dotted; /* 2 */ } /** * Prevent the duplicate application of `bolder` by the next rule in Safari 6. */ b, strong { font-weight: inherit; } /** * Add the correct font weight in Chrome, Edge, and Safari. */ b, strong { font-weight: bolder; } /** * 1. Correct the inheritance and scaling of font size in all browsers. * 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ } /** * Add the correct font style in Android 4.3-. */ dfn { font-style: italic; } /** * Add the correct background and color in IE 9-. */ mark { background-color: #ff0; color: #000; } /** * Add the correct font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` elements from affecting the line height in * all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* Embedded content ========================================================================== */ /** * Add the correct display in IE 9-. */ audio, video { display: inline-block; } /** * Add the correct display in iOS 4-7. */ audio:not([controls]) { display: none; height: 0; } /** * Remove the border on images inside links in IE 10-. */ img { border-style: none; } /** * Hide the overflow in IE. */ svg:not(:root) { overflow: hidden; } /* Forms ========================================================================== */ /** * 1. Change the font styles in all browsers (opinionated). * 2. Remove the margin in Firefox and Safari. */ button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ } /** * Show the overflow in IE. * 1. Show the overflow in Edge. */ button, input { /* 1 */ overflow: visible; } /** * Remove the inheritance of text transform in Edge, Firefox, and IE. * 1. Remove the inheritance of text transform in Firefox. */ button, select { /* 1 */ text-transform: none; } /** * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` * controls in Android 4. * 2. Correct the inability to style clickable types in iOS and Safari. */ button, html [type="button"], /* 1 */ [type="reset"], [type="submit"] { -webkit-appearance: button; /* 2 */ } /** * Remove the inner border and padding in Firefox. */ button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } /** * Restore the focus styles unset by the previous rule. */ button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } /** * Correct the padding in Firefox. */ fieldset { padding: 0.35em 0.75em 0.625em; } /** * 1. Correct the text wrapping in Edge and IE. * 2. Correct the color inheritance from `fieldset` elements in IE. * 3. Remove the padding so developers are not caught out when they zero out * `fieldset` elements in all browsers. */ legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ } /** * 1. Add the correct display in IE 9-. * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. */ progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Remove the default vertical scrollbar in IE. */ textarea { overflow: auto; } /** * 1. Add the correct box sizing in IE 10-. * 2. Remove the padding in IE 10-. */ [type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Correct the cursor style of increment and decrement buttons in Chrome. */ [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } /** * 1. Correct the odd appearance in Chrome and Safari. * 2. Correct the outline style in Safari. */ [type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /** * Remove the inner padding and cancel buttons in Chrome and Safari on macOS. */ [type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } /** * 1. Correct the inability to style clickable types in iOS and Safari. * 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Interactive ========================================================================== */ /* * Add the correct display in IE 9-. * 1. Add the correct display in Edge, IE, and Firefox. */ details, /* 1 */ menu { display: block; } /* * Add the correct display in all browsers. */ summary { display: list-item; } /* Scripting ========================================================================== */ /** * Add the correct display in IE 9-. */ canvas { display: inline-block; } /** * Add the correct display in IE. */ template { display: none; } /* Hidden ========================================================================== */ /** * Add the correct display in IE 10-. */ [hidden] { display: none; } @charset "UTF-8"; @keyframes ticker { 0% { transform: translate3d(0, 0, 0); visibility: visible; } 100% { transform: translate3d(-100%, 0, 0); } } @keyframes fall-till { 0% { opacity: 0; transform: perspective(600px) rotateX(30deg); } 100% { opacity: 1; transform: none; } } @keyframes pulse { 0% { transform: scale(1); } 50% { transform: scale(1.2); } 100% { transform: scale(1); } } @keyframes btn-rotate { 0% { rotate: z 0deg; } 100% { rotate: z 360deg; } } .hide { display: none; } .freeform-pages { display: flex; padding: 0; margin: 0 0 10px; list-style: none; } .freeform-pages li { margin: 0 10px 0 0; } .freeform-row { display: flex; justify-content: space-between; margin: 0 -15px; padding: 0 15px; } .freeform-row .freeform-column { flex: 1 0 0; padding: 0 0 6px; margin: 0 15px; box-sizing: border-box; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .freeform-row .freeform-column { flex: 1 0 auto; max-width: 100%; } } .freeform-row .freeform-column h1 { margin-bottom: 0.5em; text-align: center; } .freeform-row .freeform-column p { margin: 1em 0; } .freeform-row .freeform-column .center { text-align: center; } .freeform-row .freeform-column label { margin-top: 0; display: block; } .freeform-row .freeform-column label[for] { cursor: pointer; } .freeform-row .freeform-column .freeform-label.freeform-required:after { content: "*"; margin-left: 5px; color: red; } .freeform-row .freeform-column .freeform-errors { list-style: none; padding: 0; margin: 4px 0 0; min-height: 24px; font-size: 0.9375em; } .freeform-row .freeform-column .freeform-errors > li { color: red; } .freeform-row .freeform-column .freeform-input:not([type=radio]):not([type=checkbox]) { width: 100%; display: block; box-sizing: border-box; } .freeform-row .freeform-column input[type=radio], .freeform-row .freeform-column input[type=checkbox] { -webkit-appearance: none; -moz-appearance: none; appearance: none; box-shadow: 0 0 0 1px #adb1bc; border: 8px solid white; background-color: rgba(10, 109, 182, 0.2); border-radius: 0; width: 16px; height: 16px; display: inline-block; margin-right: 5px; vertical-align: top; transition: 0.2s ease all; cursor: pointer; } .freeform-row .freeform-column input[type=radio]:hover, .freeform-row .freeform-column input[type=checkbox]:hover { box-shadow: 0 0 0 1px #0A6DB6; border-width: 3px; } .freeform-row .freeform-column input[type=radio]:focus, .freeform-row .freeform-column input[type=checkbox]:focus { outline: none; box-shadow: 0 0 0 1px #0A6DB6; } .freeform-row .freeform-column input[type=radio]:checked, .freeform-row .freeform-column input[type=checkbox]:checked { box-shadow: 0 0 0 1px #0A6DB6; border-width: 3px; background-color: #0A6DB6; } .freeform-row .freeform-column input[type=radio]:disabled, .freeform-row .freeform-column input[type=checkbox]:disabled { box-shadow: 0 0 0 1px #D4D3D8; } .freeform-row .freeform-column input[type=radio]:disabled:hover, .freeform-row .freeform-column input[type=checkbox]:disabled:hover { border-width: 8px; } .freeform-row .freeform-column input[type=radio]:disabled:checked, .freeform-row .freeform-column input[type=checkbox]:disabled:checked { border-width: 3px; background-color: #D4D3D8; } .freeform-row .freeform-column input[type=radio] { border-radius: 16px; } .freeform-row .freeform-column select { background-position: right 8px top 13px; border-radius: 0; } .freeform-row .freeform-column .form-type-radio_group label:before { width: 0.75em; height: 0.75em; margin-right: 0.5em; text-indent: 0.05em; content: " "; display: inline-block; border: 1px solid #9294A1; color: #0079C1; font-size: 2em; line-height: 0.4em; overflow: visible; vertical-align: middle; } .freeform-row .freeform-column .form-type-checkbox { margin-bottom: 1.75em; } .freeform-row .freeform-column .form-type-checkbox .input__checkbox:checked + label:before { content: "✓"; text-shadow: 1px 0 0 white, -1px 0 0 white; } .freeform-row .freeform-column .form-type-checkbox label:before { width: 0.75em; height: 0.75em; margin-right: 0.5em; text-indent: 0.05em; display: inline-block; border: 1px solid #9294A1; color: #0079C1; font-size: 2em; line-height: 0.4em; overflow: visible; vertical-align: middle; border-radius: 0; } .freeform-row .freeform-column .freeform-input-only-label { font-weight: normal; } .freeform-row .freeform-column .freeform-input-only-label > .freeform-input { display: inline-block; width: auto; margin-right: 5px; } .freeform-row .freeform-column .freeform-instructions { margin: 0 0 5px; font-size: 13px; color: #ABA7A7; } .freeform-row .freeform-column.freeform-column-content-align-left { display: flex; justify-content: flex-start; } .freeform-row .freeform-column.freeform-column-content-align-left > button:not(:first-of-type) { margin-left: 5px; } .freeform-row .freeform-column.freeform-column-content-align-center { display: flex; justify-content: center; } .freeform-row .freeform-column.freeform-column-content-align-center > button:not(:first-of-type) { margin-left: 5px; } .freeform-row .freeform-column.freeform-column-content-align-right { display: flex; justify-content: flex-end; } .freeform-row .freeform-column.freeform-column-content-align-right > button:not(:first-of-type) { margin-left: 5px; } .freeform-row .freeform-column.freeform-column-content-align-spread { display: flex; justify-content: space-between; } .freeform-row .freeform-column.freeform-column-content-align-spread > button:not(:first-of-type) { margin-left: 5px; } .freeform-row .freeform-column .form-type-radio { margin: 0.375em 0; } .freeform-row .freeform-column .form-radios.form-two-col .form-type-radio { padding-right: 2em; box-sizing: border-box; } .freeform-form-has-errors { color: red; } .alert-success { display: none; } .form__group { position: relative; } .form__alert--success h1 { margin: 0 0 20px !important; } .form__alert--success p { font-size: 16px; margin: 0 0 20px; } .form__alert--success img { margin: 0 0 20px; } .form__alert--success hr { border: 0; height: 1px; width: 86px; background-color: #797c8b; display: block; margin: 30px auto; } .form__alert--success .btn { margin-top: 20px; border-width: 0; border-style: solid; background: #ff4455; border-bottom-color: #ff0033; color: #ffffff; cursor: pointer; line-height: 1.15; font-weight: 700; vertical-align: bottom; text-align: center; letter-spacing: 0.075em; text-transform: uppercase; text-decoration: none; display: inline-block; border-radius: 0; transition: all, 0.2s; -webkit-tap-highlight-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 18px; padding-top: 0.72222em; padding-right: 1.33333em; padding-bottom: 0.66667em; padding-left: 1.33333em; border-bottom-width: 2px; padding-bottom: 0.55556em; } #pageFreedomSundayCustomize { text-align: center; } #pageFreedomSundayCustomize > label { text-align: center; margin: 0 auto 50px; } #pageFreedomSundayCustomize h1, #pageFreedomSundayCustomize h2, #pageFreedomSundayCustomize .sectionTitle { margin-top: 1.75em; font-weight: normal; line-height: 2.1875rem; font-size: 2.5rem; letter-spacing: -0.025em; color: #0079C1; margin-bottom: 1.25em; text-align: center; } #pageFreedomSundayCustomize p { margin: 1em 0; line-height: 1.5; font-size: 18px; } #pageFreedomSundayCustomize .sectionSubtitle { font-weight: bold; font-size: 20px; margin: 50px 0 10px; text-align: left; } #pageFreedomSundayCustomize .freeform-row { max-width: 800px; margin: 0 auto; } #pageFreedomSundayCustomize .freeform-column { margin-top: 0.625rem; margin-bottom: 0.625rem; padding: 0; line-height: 1.25; } #pageFreedomSundayCustomize .field--submit { margin-top: 75px; } #pageFreedomSundayCustomize label { text-align: left; font-weight: 500; color: #797C8B; font-size: 1.125rem; display: block; margin-top: 0; margin-bottom: 0.25em; transition: 0.3s ease all; } #pageFreedomSundayCustomize label[for=form-input-leaderRole] { font-size: 1.285rem; font-weight: 600; color: #4b4e5a; } #pageFreedomSundayCustomize [type=text], #pageFreedomSundayCustomize [type=email], #pageFreedomSundayCustomize [type=phone] { -webkit-tap-highlight-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; box-shadow: none; outline: none; transition: all, 0.2s, ease-in-out; border: 1px solid #9294A1; padding: 0.75rem; display: block; line-height: normal; } #pageFreedomSundayCustomize [type=submit] { border-width: 0; border-style: solid; background: #FFD237; border-bottom-color: #ffbd38; color: #353439; cursor: pointer; line-height: normal; font-family: "Reader", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 700; vertical-align: bottom; text-align: center; letter-spacing: 0.075em; text-transform: uppercase; text-decoration: none; display: inline-block; border-radius: 0; transition: all, 0.2s; -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none; font-size: 18px; padding-top: 0.72222em; padding-right: 1.33333em; padding-bottom: 0.66667em; padding-left: 1.33333em; } #pageFreedomSundayCustomize select { -webkit-tap-highlight-color: transparent; -webkit-appearance: menulist; -moz-appearance: menulist; appearance: menulist; border-radius: 0; box-shadow: none; outline: none; transition: all, 0.2s, ease-in-out; border: 1px solid #9294A1; padding: 0.75rem; display: block; } @supports (-moz-appearance: none) { #pageFreedomSundayCustomize select { padding: calc(0.75rem - 1px); } } #pageFreedomSundayCustomize .btn { position: relative; z-index: 1; } #pageFreedomSundayCustomize .btn::before { content: ""; display: block; position: absolute; width: 100%; height: 100%; z-index: -1; background-color: rgba(255, 255, 255, 0.1); top: 0; left: 0; will-change: transform; transform: translateX(-100%); transition: 0.25s ease-in-out transform; } #pageFreedomSundayCustomize .btn:hover::before { transform: translateX(0%); transition: 0.25s ease-in-out transform; } #pageFreedomSundayCustomize .btn[name=form_previous_page_button] { background-color: #f2f2f2; } #pageFreedomSundayCustomize .field--leaderRole { display: flex; flex-flow: row wrap; justify-content: flex-start; } #pageFreedomSundayCustomize .field--leaderRole label { flex: 0 1 50%; } #pageFreedomSundayCustomize .field--leaderRole label.freeform-label { flex: 1 0 100%; margin: 2em 0 1em; } #pageFreedomSundayCustomize .field--designExperience .options { list-style-type: none; margin: 0 -20px; padding: 0; display: flex; flex-flow: row wrap; align-items: stretch; justify-content: space-around; text-align: center; } #pageFreedomSundayCustomize .field--designExperience .options .radio { flex: 1 0 150px; margin: 0 20px; display: flex; flex-flow: column nowrap; align-items: center; justify-content: flex-start; } #pageFreedomSundayCustomize .field--designExperience .options .radio input[type=radio] { order: 2; } #pageFreedomSundayCustomize .field--designExperience .options .radio input[type=radio]:checked + label img { box-shadow: 0 0 0 5px #0079c1; } #pageFreedomSundayCustomize .field--designExperience .options .radio label { order: 1; text-align: inherit; } #pageFreedomSundayCustomize .field--designExperience .options .radio label:checked { color: red; } #pageFreedomSundayCustomize .field--designExperience .options img { width: 125px; height: 125px; display: block; margin: 0 auto 20px; border-radius: 50%; transition: 0.2s ease box-shadow; } #pageFreedomSundayCustomize .field--designExperience .options .location { font-weight: bold; margin: 0; } #pageFreedomSundayCustomize .field--designExperience .options .problem { margin: 0; } #pageFreedomSundayCustomize.page_3 label[for=form-input-designExperience] { text-align: center; } #pageFreedomSundayCustomize.page_3 .options { margin-top: 50px; } #pageFreedomSundayCustomize.page_4 .field--fSInterests label { margin: 0.5em 0; } .freeform-pages { max-width: 900px; margin: 50px auto 0; } .freeform-pages ul { width: 100%; margin-bottom: 140px; text-align: left; font-weight: 500; display: flex; align-items: flex-end; justify-content: center; height: 45px; flex-flow: row nowrap; } .freeform-pages ul li { flex: 1 1 0; list-style-type: none; display: flex; justify-content: center; margin-right: 2px; } .freeform-pages ul li a { display: block; font-size: 0.75rem; line-height: 1.5; background-color: transparent; text-indent: 0.5em; font-weight: 500; text-decoration: none; flex: 1 1 0; justify-content: center; align-items: center; } .freeform-pages ul li a:after { content: " "; display: block; background-color: #D4D3D8; height: 16px; width: 100%; margin-top: 0.25em; } .freeform-pages ul li.first a:after { border-top-left-radius: 8px; border-bottom-left-radius: 8px; } .freeform-pages ul li.last a:after { border-top-right-radius: 8px; border-bottom-right-radius: 8px; } .freeform-pages ul li.current a:after { background-color: #797C8B; } .freeform-pages ul li.done a:before { content: " ✓"; display: inline; font-weight: bold; color: #39ac66; margin-right: 10px; } .freeform-pages ul li.done a:after { background-color: #39ac66; } #pageThankYou table { margin-top: 15px; } #pageThankYou table th { font-weight: bold; } #pageThankYou table th, #pageThankYou table td { padding-right: 15px; padding-bottom: 10px; } #pageThankYou .share-link .socials__ico { fill: #0079c1; width: 40px; height: 40px; margin-right: 10px; } html { box-sizing: border-box; scroll-behavior: smooth; } *:before, *:after { box-sizing: inherit; } a { color: inherit; text-decoration: none; } figure { margin: 0; } h1, h2, h3, h4, h5, h6 { margin: 0; line-height: 1.1; } mark { background: none; color: inherit; } a:focus, a:active, button:focus, button:active, input:focus, input:active, select:focus, select:active, textarea:focus, textarea:active { outline: 1px dotted currentColor; } .swiper-pagination-bullets > * + * { margin-left: 15px; } .ct-label { fill: rgba(0, 0, 0, 0.4); color: rgba(0, 0, 0, 0.4); font-size: 0.75rem; line-height: 1; } .ct-chart-line .ct-label, .ct-chart-bar .ct-label { display: block; display: flex; } .ct-chart-pie .ct-label, .ct-chart-donut .ct-label { dominant-baseline: central; } .ct-label.ct-horizontal.ct-start { align-items: flex-end; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-label.ct-horizontal.ct-end { align-items: flex-start; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-label.ct-vertical.ct-start { align-items: flex-end; justify-content: flex-end; text-align: right; text-anchor: end; } .ct-label.ct-vertical.ct-end { align-items: flex-end; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-chart-bar .ct-label.ct-horizontal.ct-start { align-items: flex-end; justify-content: center; text-align: center; text-anchor: start; } .ct-chart-bar .ct-label.ct-horizontal.ct-end { align-items: flex-start; justify-content: center; text-align: center; text-anchor: start; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-horizontal.ct-start { align-items: flex-end; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-horizontal.ct-end { align-items: flex-start; justify-content: flex-start; text-align: left; text-anchor: start; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-vertical.ct-start { align-items: center; justify-content: flex-end; text-align: right; text-anchor: end; } .ct-chart-bar.ct-horizontal-bars .ct-label.ct-vertical.ct-end { align-items: center; justify-content: flex-start; text-align: left; text-anchor: end; } .ct-grid { stroke: rgba(0, 0, 0, 0.2); stroke-width: 1px; stroke-dasharray: 2px; } .ct-grid-background { fill: none; } .ct-point { stroke-width: 10px; stroke-linecap: round; } .ct-line { fill: none; stroke-width: 4px; } .ct-area { stroke: none; fill-opacity: 0.1; } .ct-bar { fill: none; stroke-width: 10px; } .ct-slice-donut { fill: none; stroke-width: 60px; } .ct-series-a .ct-point, .ct-series-a .ct-line, .ct-series-a .ct-bar, .ct-series-a .ct-slice-donut { stroke: #d70206; } .ct-series-a .ct-slice-pie, .ct-series-a .ct-slice-donut-solid, .ct-series-a .ct-area { fill: #d70206; } .ct-series-b .ct-point, .ct-series-b .ct-line, .ct-series-b .ct-bar, .ct-series-b .ct-slice-donut { stroke: #f05b4f; } .ct-series-b .ct-slice-pie, .ct-series-b .ct-slice-donut-solid, .ct-series-b .ct-area { fill: #f05b4f; } .ct-series-c .ct-point, .ct-series-c .ct-line, .ct-series-c .ct-bar, .ct-series-c .ct-slice-donut { stroke: #f4c63d; } .ct-series-c .ct-slice-pie, .ct-series-c .ct-slice-donut-solid, .ct-series-c .ct-area { fill: #f4c63d; } .ct-series-d .ct-point, .ct-series-d .ct-line, .ct-series-d .ct-bar, .ct-series-d .ct-slice-donut { stroke: #d17905; } .ct-series-d .ct-slice-pie, .ct-series-d .ct-slice-donut-solid, .ct-series-d .ct-area { fill: #d17905; } .ct-series-e .ct-point, .ct-series-e .ct-line, .ct-series-e .ct-bar, .ct-series-e .ct-slice-donut { stroke: #453d3f; } .ct-series-e .ct-slice-pie, .ct-series-e .ct-slice-donut-solid, .ct-series-e .ct-area { fill: #453d3f; } .ct-series-f .ct-point, .ct-series-f .ct-line, .ct-series-f .ct-bar, .ct-series-f .ct-slice-donut { stroke: #59922b; } .ct-series-f .ct-slice-pie, .ct-series-f .ct-slice-donut-solid, .ct-series-f .ct-area { fill: #59922b; } .ct-series-g .ct-point, .ct-series-g .ct-line, .ct-series-g .ct-bar, .ct-series-g .ct-slice-donut { stroke: #0544d3; } .ct-series-g .ct-slice-pie, .ct-series-g .ct-slice-donut-solid, .ct-series-g .ct-area { fill: #0544d3; } .ct-series-h .ct-point, .ct-series-h .ct-line, .ct-series-h .ct-bar, .ct-series-h .ct-slice-donut { stroke: #6b0392; } .ct-series-h .ct-slice-pie, .ct-series-h .ct-slice-donut-solid, .ct-series-h .ct-area { fill: #6b0392; } .ct-series-i .ct-point, .ct-series-i .ct-line, .ct-series-i .ct-bar, .ct-series-i .ct-slice-donut { stroke: #f05b4f; } .ct-series-i .ct-slice-pie, .ct-series-i .ct-slice-donut-solid, .ct-series-i .ct-area { fill: #f05b4f; } .ct-series-j .ct-point, .ct-series-j .ct-line, .ct-series-j .ct-bar, .ct-series-j .ct-slice-donut { stroke: #dda458; } .ct-series-j .ct-slice-pie, .ct-series-j .ct-slice-donut-solid, .ct-series-j .ct-area { fill: #dda458; } .ct-series-k .ct-point, .ct-series-k .ct-line, .ct-series-k .ct-bar, .ct-series-k .ct-slice-donut { stroke: #eacf7d; } .ct-series-k .ct-slice-pie, .ct-series-k .ct-slice-donut-solid, .ct-series-k .ct-area { fill: #eacf7d; } .ct-series-l .ct-point, .ct-series-l .ct-line, .ct-series-l .ct-bar, .ct-series-l .ct-slice-donut { stroke: #86797d; } .ct-series-l .ct-slice-pie, .ct-series-l .ct-slice-donut-solid, .ct-series-l .ct-area { fill: #86797d; } .ct-series-m .ct-point, .ct-series-m .ct-line, .ct-series-m .ct-bar, .ct-series-m .ct-slice-donut { stroke: #b2c326; } .ct-series-m .ct-slice-pie, .ct-series-m .ct-slice-donut-solid, .ct-series-m .ct-area { fill: #b2c326; } .ct-series-n .ct-point, .ct-series-n .ct-line, .ct-series-n .ct-bar, .ct-series-n .ct-slice-donut { stroke: #6188e2; } .ct-series-n .ct-slice-pie, .ct-series-n .ct-slice-donut-solid, .ct-series-n .ct-area { fill: #6188e2; } .ct-series-o .ct-point, .ct-series-o .ct-line, .ct-series-o .ct-bar, .ct-series-o .ct-slice-donut { stroke: #a748ca; } .ct-series-o .ct-slice-pie, .ct-series-o .ct-slice-donut-solid, .ct-series-o .ct-area { fill: #a748ca; } .ct-square { display: block; position: relative; width: 100%; } .ct-square:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 100%; } .ct-square:after { content: ""; display: table; clear: both; } .ct-square > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-second { display: block; position: relative; width: 100%; } .ct-minor-second:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 93.75%; } .ct-minor-second:after { content: ""; display: table; clear: both; } .ct-minor-second > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-second { display: block; position: relative; width: 100%; } .ct-major-second:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 88.8888888889%; } .ct-major-second:after { content: ""; display: table; clear: both; } .ct-major-second > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-third { display: block; position: relative; width: 100%; } .ct-minor-third:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 83.3333333333%; } .ct-minor-third:after { content: ""; display: table; clear: both; } .ct-minor-third > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-third { display: block; position: relative; width: 100%; } .ct-major-third:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 80%; } .ct-major-third:after { content: ""; display: table; clear: both; } .ct-major-third > svg { display: block; position: absolute; top: 0; left: 0; } .ct-perfect-fourth { display: block; position: relative; width: 100%; } .ct-perfect-fourth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 75%; } .ct-perfect-fourth:after { content: ""; display: table; clear: both; } .ct-perfect-fourth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-perfect-fifth { display: block; position: relative; width: 100%; } .ct-perfect-fifth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 66.6666666667%; } .ct-perfect-fifth:after { content: ""; display: table; clear: both; } .ct-perfect-fifth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-sixth { display: block; position: relative; width: 100%; } .ct-minor-sixth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 62.5%; } .ct-minor-sixth:after { content: ""; display: table; clear: both; } .ct-minor-sixth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-golden-section { display: block; position: relative; width: 100%; } .ct-golden-section:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 61.804697157%; } .ct-golden-section:after { content: ""; display: table; clear: both; } .ct-golden-section > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-sixth { display: block; position: relative; width: 100%; } .ct-major-sixth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 60%; } .ct-major-sixth:after { content: ""; display: table; clear: both; } .ct-major-sixth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-minor-seventh { display: block; position: relative; width: 100%; } .ct-minor-seventh:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 56.25%; } .ct-minor-seventh:after { content: ""; display: table; clear: both; } .ct-minor-seventh > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-seventh { display: block; position: relative; width: 100%; } .ct-major-seventh:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 53.3333333333%; } .ct-major-seventh:after { content: ""; display: table; clear: both; } .ct-major-seventh > svg { display: block; position: absolute; top: 0; left: 0; } .ct-octave { display: block; position: relative; width: 100%; } .ct-octave:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 50%; } .ct-octave:after { content: ""; display: table; clear: both; } .ct-octave > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-tenth { display: block; position: relative; width: 100%; } .ct-major-tenth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 40%; } .ct-major-tenth:after { content: ""; display: table; clear: both; } .ct-major-tenth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-eleventh { display: block; position: relative; width: 100%; } .ct-major-eleventh:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 37.5%; } .ct-major-eleventh:after { content: ""; display: table; clear: both; } .ct-major-eleventh > svg { display: block; position: absolute; top: 0; left: 0; } .ct-major-twelfth { display: block; position: relative; width: 100%; } .ct-major-twelfth:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 33.3333333333%; } .ct-major-twelfth:after { content: ""; display: table; clear: both; } .ct-major-twelfth > svg { display: block; position: absolute; top: 0; left: 0; } .ct-double-octave { display: block; position: relative; width: 100%; } .ct-double-octave:before { display: block; float: left; content: ""; width: 0; height: 0; padding-bottom: 25%; } .ct-double-octave:after { content: ""; display: table; clear: both; } .ct-double-octave > svg { display: block; position: absolute; top: 0; left: 0; } .ct-series-a .ct-chart { width: 100%; height: 100px; } .ct-series-a .ct-horizontal { display: none; } .ct-series-a .ct-point { stroke-width: 2px; stroke: #fecf00; } .ct-series-a .ct-line { stroke: #fecf00; stroke-width: 2px; } .ct-series-a .ct-label { display: none; } .ct-series-a--yellow .ct-point { stroke: #fecf00; } .ct-series-a--yellow .ct-line { stroke: #fecf00; } .ct-series-a--blue .ct-point { stroke: #0072bc; } .ct-series-a--blue .ct-line { stroke: #0072bc; } .ct-series-a--blue1 .ct-point { stroke: #0072bc; } .ct-series-a--blue1 .ct-line { stroke: #0072bc; } .ct-series-a--blue2 .ct-point { stroke: #66aad7; } .ct-series-a--blue2 .ct-line { stroke: #66aad7; } .ct-series-a--grey1 .ct-point { stroke: #f2f2f2; } .ct-series-a--grey1 .ct-line { stroke: #f2f2f2; } .ct-series-a--grey2 .ct-point { stroke: #b2b2b2; } .ct-series-a--grey2 .ct-line { stroke: #b2b2b2; } .ct-series-a--grey3 .ct-point { stroke: #9294a1; } .ct-series-a--grey3 .ct-line { stroke: #9294a1; } .ct-series-a--grey4 .ct-point { stroke: #797c8b; } .ct-series-a--grey4 .ct-line { stroke: #797c8b; } .ct-series-a--grey5 .ct-point { stroke: #4b4d59; } .ct-series-a--grey5 .ct-line { stroke: #4b4d59; } .ct-series-a--grey6 .ct-point { stroke: #353439; } .ct-series-a--grey6 .ct-line { stroke: #353439; } .ct-series-a--yellow1 .ct-point { stroke: #FFD238; } .ct-series-a--yellow1 .ct-line { stroke: #FFD238; } .ct-series-a--yellow2 .ct-point { stroke: #f0dd66; } .ct-series-a--yellow2 .ct-line { stroke: #f0dd66; } .ct-series-a--orange1 .ct-point { stroke: #fe7000; } .ct-series-a--orange1 .ct-line { stroke: #fe7000; } .ct-series-a--orange2 .ct-point { stroke: #ff5800; } .ct-series-a--orange2 .ct-line { stroke: #ff5800; } .ct-series-a--red1 .ct-point { stroke: #f44c4c; } .ct-series-a--red1 .ct-line { stroke: #f44c4c; } .ct-series-a--red2 .ct-point { stroke: #ef3332; } .ct-series-a--red2 .ct-line { stroke: #ef3332; } .ct-series-a--green1 .ct-point { stroke: #39ac67; } .ct-series-a--green1 .ct-line { stroke: #39ac67; } .ct-series-a--green2 .ct-point { stroke: #5ecf8d; } .ct-series-a--green2 .ct-line { stroke: #5ecf8d; } .ct-series-a--maroon1 .ct-point { stroke: #920049; } .ct-series-a--maroon1 .ct-line { stroke: #920049; } .ct-series-a--maroon2 .ct-point { stroke: #620031; } .ct-series-a--maroon2 .ct-line { stroke: #620031; } * { box-sizing: border-box; } button { box-shadow: none; border: none; background: none; cursor: pointer; padding: 0; } button[type=button] { will-change: opacity; transition: opacity 0.3s ease; } button[type=button]:hover { opacity: 0.7; } body { overflow-x: hidden; } ::-moz-selection { background: #66aad7; color: #fff; } ::selection { background: #66aad7; color: #fff; } ::-moz-selection { background: #66aad7; color: #fff; } ::-moz-placeholder { /* Firefox 19+ */ color: #d4d3d8; font-weight: 400; } textarea::-moz-placeholder { color: #d4d3d8; font-weight: 400; } textarea::placeholder { color: #d4d3d8; font-weight: 400; } input[type=text], input[type=email], select { -webkit-appearance: none; -moz-appearance: none; text-indent: 0.01em; text-overflow: ""; } button, input, optgroup, select, textarea { font-family: "Reader", "sans-serif"; } hr { border-width: 1px 0 0 0; } @font-face { font-family: "Reader"; src: url(../fonts/Reader.eot?1d741499a69b75442296d9f8de33dd46); src: url(../fonts/Reader.eot?1d741499a69b75442296d9f8de33dd46?#iefix) format("embedded-opentype"), url(../fonts/Reader.woff?82fd9e0017b3ba9d2c03c02001ce0a13) format("woff"), url(../fonts/Reader.ttf?2712c5e0d0c075d4bb5ba053d61b086d) format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: "Feijoa"; src: url(../fonts/Feijoa-Bold.eot?083c0c1531c4baf54727a67974cb3be3); src: url(../fonts/Feijoa-Bold.eot?083c0c1531c4baf54727a67974cb3be3?#iefix) format("embedded-opentype"), url(../fonts/Feijoa-Bold.woff?fe5238b2297d2a7aace818c8b90dab99) format("woff"), url(../fonts/Feijoa-Bold.ttf?36d1af26a04bcdd91895c99a97d583cb) format("truetype"); font-weight: bold; font-style: normal; } @font-face { font-family: "Feijoa"; src: url(../fonts/Feijoa-MediumItalic.eot?5b43e253411e8f45e3d69fa159aea6f7); src: url(../fonts/Feijoa-MediumItalic.eot?5b43e253411e8f45e3d69fa159aea6f7?#iefix) format("embedded-opentype"), url(../fonts/Feijoa-MediumItalic.woff?8655156247078edfaec7b941f8230624) format("woff"), url(../fonts/Feijoa-MediumItalic.ttf?cece5f8979d8eab217d1298f3bdf4673) format("truetype"); font-weight: 500; font-style: italic; } @font-face { font-family: "Feijoa"; src: url(../fonts/Feijoa-Medium.eot?639919bf1473d0bc6b109db18f5743e7); src: url(../fonts/Feijoa-Medium.eot?639919bf1473d0bc6b109db18f5743e7?#iefix) format("embedded-opentype"), url(../fonts/Feijoa-Medium.woff?88962e31027a8fa7d59d382d79834816) format("woff"), url(../fonts/Feijoa-Medium.ttf?15c723867ad853ea3e8113cb0a6e8d4a) format("truetype"); font-weight: 500; font-style: normal; } @font-face { font-family: "Reader"; src: url(../fonts/Reader-Bold.eot?8ba406d4d4454dd035d4bbb3acbdb9ae); src: url(../fonts/Reader-Bold.eot?8ba406d4d4454dd035d4bbb3acbdb9ae?#iefix) format("embedded-opentype"), url(../fonts/Reader-Bold.woff?63854ea23f8f2d77d2508da9435de7e3) format("woff"), url(../fonts/Reader-Bold.ttf?a52015e70f7498b9ce282795130b218f) format("truetype"); font-weight: bold; font-style: normal; } @font-face { font-family: "Reader"; src: url(../fonts/Reader-BoldItalic.eot?535e59cc2ae462cbfad8228d8dc5d421); src: url(../fonts/Reader-BoldItalic.eot?535e59cc2ae462cbfad8228d8dc5d421?#iefix) format("embedded-opentype"), url(../fonts/Reader-BoldItalic.woff?d28260c72cbc6764b215c87130e8645f) format("woff"), url(../fonts/Reader-BoldItalic.ttf?150fed925c5e929607b07bb147955a82) format("truetype"); font-weight: bold; font-style: italic; } @font-face { font-family: "Feijoa"; src: url(../fonts/Feijoa-Display.eot?484edb30a41445b591e604c2405c3752); src: url(../fonts/Feijoa-Display.eot?484edb30a41445b591e604c2405c3752?#iefix) format("embedded-opentype"), url(../fonts/Feijoa-Display.woff?6b9d599aa98eeb18cd6b798fa3a874d9) format("woff"), url(../fonts/Feijoa-Display.ttf?20e7dbb66ace06b73c1ec3fc275a9061) format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: "Reader"; src: url(../fonts/Reader-Italic.eot?0fb873021d5e84a6e2cb2f209935a8c2); src: url(../fonts/Reader-Italic.eot?0fb873021d5e84a6e2cb2f209935a8c2?#iefix) format("embedded-opentype"), url(../fonts/Reader-Italic.woff?9e4c9427b7d55d2d40d30b5a08e46b52) format("woff"), url(../fonts/Reader-Italic.ttf?c3f8ab852b12993928fcfd91f3ea2b3a) format("truetype"); font-weight: normal; font-style: italic; } @font-face { font-family: "Reader"; src: url(../fonts/Reader-MediumItalic.eot?8cefa52f5930bbe2fd53036285113375); src: url(../fonts/Reader-MediumItalic.eot?8cefa52f5930bbe2fd53036285113375?#iefix) format("embedded-opentype"), url(../fonts/Reader-MediumItalic.woff?5fe2f7696f5b949d29f779f707dcc132) format("woff"), url(../fonts/Reader-MediumItalic.ttf?81647d18814e70955103cc9b4a639375) format("truetype"); font-weight: 500; font-style: italic; } @font-face { font-family: "Reader"; src: url(../fonts/Reader-Black.eot?89e942b8cbfb59ae4c2215655ec01135); src: url(../fonts/Reader-Black.eot?89e942b8cbfb59ae4c2215655ec01135?#iefix) format("embedded-opentype"), url(../fonts/Reader-Black.woff?fd058f44ab758143f188bea8df939b90) format("woff"), url(../fonts/Reader-Black.ttf?7c27be3a37e81f43ba6fc7134d57e058) format("truetype"); font-weight: 900; font-style: normal; } @font-face { font-family: "Reader"; src: url(../fonts/Reader-Medium.eot?fff2cc5ea2a798e21828ad2681ad9ae2); src: url(../fonts/Reader-Medium.eot?fff2cc5ea2a798e21828ad2681ad9ae2?#iefix) format("embedded-opentype"), url(../fonts/Reader-Medium.woff?e329d63ee7b6699a57c799ef9a920751) format("woff"), url(../fonts/Reader-Medium.ttf?dc14f4b67346d697df1b92e34fb48237) format("truetype"); font-weight: 500; font-style: normal; } body { font-family: "Reader", "sans-serif"; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility !important; } .row { margin-right: auto; margin-left: auto; display: flex; flex-flow: row wrap; } .row--collapse { margin-top: -30px; } .row--collapse > * { margin-top: 30px; } .row--mobile > * + * { margin-top: 30px; } @media screen and (min-width: 768px) { .row--mobile > * + * { margin-top: 0; } } .row .row { margin-right: -0.7813rem; margin-left: -0.7813rem; } @media screen and (min-width: 768px) { .row .row { margin-right: -0.7813rem; margin-left: -0.7813rem; } } @media screen and (min-width: 1024px) { .row .row { margin-right: -0.7813rem; margin-left: -0.7813rem; } } .row .row.collapse { margin-right: 0; margin-left: 0; } .row.expanded { max-width: none; } .row.expanded .row { margin-right: auto; margin-left: auto; } .row:not(.expanded) .row { max-width: none; } .row.collapse > .column, .row.collapse > .columns { padding-right: 0; padding-left: 0; } .row.is-collapse-child, .row.collapse > .column > .row, .row.collapse > .columns > .row { margin-right: 0; margin-left: 0; } .column, .columns { flex: 1 1 0px; padding-right: 0.7813rem; padding-left: 0.7813rem; min-width: 0; } .column.row.row, .row.row.columns { float: none; display: block; } .row .column.row.row, .row .row.row.columns { margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; } .small-1 { flex: 0 0 8.33333%; max-width: 8.33333%; } .small-offset-0 { margin-left: 0%; } .small-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } .small-offset-1 { margin-left: 8.33333%; } .small-3 { flex: 0 0 25%; max-width: 25%; } .small-offset-2 { margin-left: 16.66667%; } .small-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } .small-offset-3 { margin-left: 25%; } .small-5 { flex: 0 0 41.66667%; max-width: 41.66667%; } .small-offset-4 { margin-left: 33.33333%; } .small-6 { flex: 0 0 50%; max-width: 50%; } .small-offset-5 { margin-left: 41.66667%; } .small-7 { flex: 0 0 58.33333%; max-width: 58.33333%; } .small-offset-6 { margin-left: 50%; } .small-8 { flex: 0 0 66.66667%; max-width: 66.66667%; } .small-offset-7 { margin-left: 58.33333%; } .small-9 { flex: 0 0 75%; max-width: 75%; } .small-offset-8 { margin-left: 66.66667%; } .small-10 { flex: 0 0 83.33333%; max-width: 83.33333%; } .small-offset-9 { margin-left: 75%; } .small-11 { flex: 0 0 91.66667%; max-width: 91.66667%; } .small-offset-10 { margin-left: 83.33333%; } .small-12 { flex: 0 0 100%; max-width: 100%; } .small-offset-11 { margin-left: 91.66667%; } .small-up-1 { flex-wrap: wrap; } .small-up-1 > .column, .small-up-1 > .columns { flex: 0 0 100%; max-width: 100%; } .small-up-2 { flex-wrap: wrap; } .small-up-2 > .column, .small-up-2 > .columns { flex: 0 0 50%; max-width: 50%; } .small-up-3 { flex-wrap: wrap; } .small-up-3 > .column, .small-up-3 > .columns { flex: 0 0 33.33333%; max-width: 33.33333%; } .small-up-4 { flex-wrap: wrap; } .small-up-4 > .column, .small-up-4 > .columns { flex: 0 0 25%; max-width: 25%; } .small-up-5 { flex-wrap: wrap; } .small-up-5 > .column, .small-up-5 > .columns { flex: 0 0 20%; max-width: 20%; } .small-up-6 { flex-wrap: wrap; } .small-up-6 > .column, .small-up-6 > .columns { flex: 0 0 16.66667%; max-width: 16.66667%; } .small-up-7 { flex-wrap: wrap; } .small-up-7 > .column, .small-up-7 > .columns { flex: 0 0 14.28571%; max-width: 14.28571%; } .small-up-8 { flex-wrap: wrap; } .small-up-8 > .column, .small-up-8 > .columns { flex: 0 0 12.5%; max-width: 12.5%; } .small-collapse > .column, .small-collapse > .columns { padding-right: 0; padding-left: 0; } .small-uncollapse > .column, .small-uncollapse > .columns { padding-right: 0.7813rem; padding-left: 0.7813rem; } @media screen and (min-width: 768px) { .medium-1 { flex: 1 0 auto; max-width: 8.33333%; } .medium-offset-0 { margin-left: 0%; } .medium-2 { flex: 1 0 auto; max-width: 16.66667%; } .medium-offset-1 { margin-left: 8.33333%; } .medium-3 { flex: 1 0 auto; max-width: 25%; } .medium-offset-2 { margin-left: 16.66667%; } .medium-4 { flex: 1 0 auto; max-width: 33.33333%; } .is-windows .medium-4 { width: 33.333333%; } .medium-offset-3 { margin-left: 25%; } .medium-5 { flex: 1 0 auto; max-width: 41.66667%; } .is-windows .medium-5 { width: 41.666667%; } .medium-offset-4 { margin-left: 33.33333%; } .medium-6 { flex: 1 0 auto; max-width: 50%; } .is-windows .medium-6 { width: 50%; } .medium-offset-5 { margin-left: 41.66667%; } .medium-7 { flex: 1 0 auto; max-width: 58.33333%; } .is-windows .medium-7 { width: 58.333333%; } .medium-offset-6 { margin-left: 50%; } .medium-8 { flex: 1 0 auto; max-width: 66.66667%; } .medium-offset-7 { margin-left: 58.33333%; } .medium-9 { flex: 1 0 auto; max-width: 75%; } .medium-offset-8 { margin-left: 66.66667%; } .medium-10 { flex: 1 0 auto; max-width: 83.33333%; } .medium-offset-9 { margin-left: 75%; } .medium-11 { flex: 1 0 auto; max-width: 91.66667%; } .medium-offset-10 { margin-left: 83.33333%; } .medium-12 { flex: 1 0 auto; max-width: 100%; } .medium-offset-11 { margin-left: 91.66667%; } .medium-up-1 { flex-wrap: wrap; } .medium-up-1 > .column, .medium-up-1 > .columns { flex: 1 0 auto; max-width: 100%; } .medium-up-2 { flex-wrap: wrap; } .medium-up-2 > .column, .medium-up-2 > .columns { flex: 0 0 50%; max-width: 50%; } .medium-up-3 { flex-wrap: wrap; } .medium-up-3 > .column, .medium-up-3 > .columns { flex: 0 0 33.33333%; max-width: 33.33333%; } .medium-up-4 { flex-wrap: wrap; } .medium-up-4 > .column, .medium-up-4 > .columns { flex: 0 0 25%; max-width: 25%; } .medium-up-5 { flex-wrap: wrap; } .medium-up-5 > .column, .medium-up-5 > .columns { flex: 0 0 20%; max-width: 20%; } .medium-up-6 { flex-wrap: wrap; } .medium-up-6 > .column, .medium-up-6 > .columns { flex: 0 0 16.66667%; max-width: 16.66667%; } .medium-up-7 { flex-wrap: wrap; } .medium-up-7 > .column, .medium-up-7 > .columns { flex: 0 0 14.28571%; max-width: 14.28571%; } .medium-up-8 { flex-wrap: wrap; } .medium-up-8 > .column, .medium-up-8 > .columns { flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 768px) { .medium-expand { flex: 1 1 0px; } } .row.medium-unstack > .column, .row.medium-unstack > .columns { flex: 0 0 100%; } @media screen and (min-width: 768px) { .row.medium-unstack > .column, .row.medium-unstack > .columns { flex: 1 1 0px; } } @media screen and (min-width: 768px) { .medium-collapse > .column, .medium-collapse > .columns { padding-right: 0; padding-left: 0; } .medium-uncollapse > .column, .medium-uncollapse > .columns { padding-right: 0.7813rem; padding-left: 0.7813rem; } } @media screen and (min-width: 1024px) { .large-1 { flex: 0 0 8.33333%; max-width: 8.33333%; } .large-offset-0 { margin-left: 0%; } .large-2 { flex: 0 0 16.66667%; max-width: 16.66667%; } .large-offset-1 { margin-left: 8.33333%; } .large-3 { flex: 0 0 25%; max-width: 25%; } .large-offset-2 { margin-left: 16.66667%; } .large-4 { flex: 0 0 33.33333%; max-width: 33.33333%; } .is-windows .large-4 { width: 33.333333%; } .large-offset-3 { margin-left: 25%; } .large-5 { flex: 0 0 41.66667%; max-width: 41.66667%; } .large-offset-4 { margin-left: 33.33333%; } .large-6 { flex: 0 0 50%; max-width: 50%; } .large-offset-5 { margin-left: 41.66667%; } .large-7 { flex: 0 0 58.33333%; max-width: 58.33333%; } .large-offset-6 { margin-left: 50%; } .large-8 { flex: 0 0 66.66667%; max-width: 66.66667%; } .is-windows .large-8 { width: 66.66667%; } .large-offset-7 { margin-left: 58.33333%; } .large-9 { flex: 0 0 75%; max-width: 75%; } .large-offset-8 { margin-left: 66.66667%; } .large-10 { flex: 0 0 83.33333%; max-width: 83.33333%; } .large-offset-9 { margin-left: 75%; } .large-11 { flex: 0 0 91.66667%; max-width: 91.66667%; } .large-offset-10 { margin-left: 83.33333%; } .large-12 { flex: 0 0 100%; max-width: 100%; } .large-offset-11 { margin-left: 91.66667%; } .large-up-1 { flex-wrap: wrap; } .large-up-1 > .column, .large-up-1 > .columns { flex: 0 0 100%; max-width: 100%; } .large-up-2 { flex-wrap: wrap; } .large-up-2 > .column, .large-up-2 > .columns { flex: 0 0 50%; max-width: 50%; } .large-up-3 { flex-wrap: wrap; } .large-up-3 > .column, .large-up-3 > .columns { flex: 0 0 33.33333%; max-width: 33.33333%; } .large-up-4 { flex-wrap: wrap; } .large-up-4 > .column, .large-up-4 > .columns { flex: 0 0 25%; max-width: 25%; } .large-up-5 { flex-wrap: wrap; } .large-up-5 > .column, .large-up-5 > .columns { flex: 0 0 20%; max-width: 20%; } .large-up-6 { flex-wrap: wrap; } .large-up-6 > .column, .large-up-6 > .columns { flex: 0 0 16.66667%; max-width: 16.66667%; } .large-up-7 { flex-wrap: wrap; } .large-up-7 > .column, .large-up-7 > .columns { flex: 0 0 14.28571%; max-width: 14.28571%; } .large-up-8 { flex-wrap: wrap; } .large-up-8 > .column, .large-up-8 > .columns { flex: 0 0 12.5%; max-width: 12.5%; } } @media screen and (min-width: 1024px) { .large-expand { flex: 1 1 0px; } } .row.large-unstack > .column, .row.large-unstack > .columns { flex: 0 0 100%; } @media screen and (min-width: 1024px) { .row.large-unstack > .column, .row.large-unstack > .columns { flex: 1 1 0px; } } @media screen and (min-width: 1024px) { .large-collapse > .column, .large-collapse > .columns { padding-right: 0; padding-left: 0; } .large-uncollapse > .column, .large-uncollapse > .columns { padding-right: 0.7813rem; padding-left: 0.7813rem; } } .shrink { flex: 0 0 auto; max-width: 100%; } .column-block { margin-bottom: 1.875rem; } .column-block > :last-child { margin-bottom: 0; } .align-right { justify-content: flex-end; } .align-center { justify-content: center; } .align-justify { justify-content: space-between; } .align-spaced { justify-content: space-around; } .align-right.vertical.menu > li > a { justify-content: flex-end; } .align-center.vertical.menu > li > a { justify-content: center; } .align-top { align-items: flex-start; } .align-self-top { align-self: flex-start; } .align-bottom { align-items: flex-end; } .align-self-bottom { align-self: flex-end; } .align-middle { align-items: center; } .align-self-middle { align-self: center; } .align-stretch { align-items: stretch; } .align-self-stretch { align-self: stretch; } .align-center-middle { justify-content: center; align-items: center; align-content: center; } .small-order-1 { order: 1; } .small-order-2 { order: 2; } .small-order-3 { order: 3; } .small-order-4 { order: 4; } .small-order-5 { order: 5; } .small-order-6 { order: 6; } @media screen and (min-width: 768px) { .medium-order-1 { order: 1; } .medium-order-2 { order: 2; } .medium-order-3 { order: 3; } .medium-order-4 { order: 4; } .medium-order-5 { order: 5; } .medium-order-6 { order: 6; } } @media screen and (min-width: 1024px) { .large-order-1 { order: 1; } .large-order-2 { order: 2; } .large-order-3 { order: 3; } .large-order-4 { order: 4; } .large-order-5 { order: 5; } .large-order-6 { order: 6; } } .flex-container { display: flex; } .flex-child-auto { flex: 1 1 auto; } .flex-child-grow { flex: 1 0 auto; } .flex-child-shrink { flex: 0 1 auto; } .flex-dir-row { flex-direction: row; } .flex-dir-row-reverse { flex-direction: row-reverse; } .flex-dir-column { flex-direction: column; } .flex-dir-column-reverse { flex-direction: column-reverse; } @media screen and (min-width: 768px) { .medium-flex-container { display: flex; } .medium-flex-child-auto { flex: 1 1 auto; } .medium-flex-child-grow { flex: 1 0 auto; } .medium-flex-child-shrink { flex: 0 1 auto; } .medium-flex-dir-row { flex-direction: row; } .medium-flex-dir-row-reverse { flex-direction: row-reverse; } .medium-flex-dir-column { flex-direction: column; } .medium-flex-dir-column-reverse { flex-direction: column-reverse; } } .bg-color-none { background-color: transparent; } .bg-color-default { background-color: #0A6DB6; } .bg-color-blue1 { background-color: #0072bc; } .bg-color-blue2 { background-color: #66aad7; } .bg-color-grey1 { background-color: #f2f2f2; } .bg-color-grey2 { background-color: #b2b2b2; } .bg-color-grey3 { background-color: #9294a1; } .bg-color-grey4 { background-color: #797c8b; } .bg-color-grey5 { background-color: #4b4d59; } .bg-color-grey6 { background-color: #353439; } .bg-color-yellow1 { background-color: #FFD238; } .bg-color-yellow2 { background-color: #f0dd66; } .bg-color-orange1 { background-color: #fe7000; } .bg-color-orange2 { background-color: #ff5800; } .bg-color-red1 { background-color: #f44c4c; } .bg-color-red2 { background-color: #ef3332; } .bg-color-green1 { background-color: #39ac67; } .bg-color-green2 { background-color: #5ecf8d; } .bg-color-maroon1 { background-color: #920049; } .bg-color-maroon2 { background-color: #620031; } html[data-env=local] { --colorYellow: #e6c600; --colorRed: #f44c4c; padding: 30px; background-image: linear-gradient(135deg, var(--colorYellow) 25%, transparent 25%, transparent 50%, var(--colorYellow) 50%, var(--colorYellow) 75%, transparent 75%, transparent 100%); background-size: 56.57px 56.57px; position: relative; } html[data-env=local]::before { content: "This is a test site."; font-family: sans-serif; font-size: 14px; font-weight: bold; line-height: 1; direction: ltr; position: fixed; z-index: 999; top: 0; left: 50%; transform: translateX(-50%); background: var(--colorRed); color: white; padding: 0.25em 1em 0.35em; border-radius: 0 0 10px 10px; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5); } html[data-env=local] body { background-color: #fff; box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5); position: relative; } .box { width: 100%; } .box--content { max-width: 1248px; margin-left: auto; margin-right: auto; } .box--fit { max-width: 1200px; margin-left: auto; margin-right: auto; } .box--article { max-width: 590px; margin-left: auto; margin-right: auto; } .box--full { max-width: 1490px; margin-left: auto; margin-right: auto; } .box--max { max-width: none; margin-left: auto; margin-right: auto; } .box--padding { padding-left: 24px; padding-right: 24px; } .box--reset { padding-left: 0.7813rem; padding-right: 0.7813rem; } .box--cut { padding-top: 140px; } .box--txt { padding-top: 5px; padding-top: 5px; } .box--mobile > * + * { margin-top: 30px; } .box--relative { position: relative; } .box--grey { background-color: #fafafa; } .box--grey-dark { background-color: #eaeaea; } .box--light { background-color: #fff; } .box--radius { border-radius: 4px; } .box--black { background-color: #000; } .box--dark { background-color: #222; } .box--showcase { padding: 5px 0; } .grid { margin-top: -15px; } @media screen and (min-width: 768px) { .grid { margin-top: -24px; } } .grid > * { margin-top: 15px; } @media screen and (min-width: 768px) { .grid > * { margin-top: 24px; } } @media screen and (min-width: 768px) { .mobile { display: none; } } .desktop { display: none; } @media screen and (min-width: 1024px) { .desktop { display: block; } } .home__urgent { position: relative; z-index: 1; max-width: 1200px; } @media screen and (min-width: 768px) { .home__urgent { padding-left: 15px; padding-right: 15px; } } @media screen and (min-width: 768px) { .home__urgent { position: relative; z-index: 5; margin-bottom: 75px; margin-top: -160px; } } .home__what { margin-top: 90px; } @media screen and (min-width: 768px) { .home__what { margin-top: 160px; } } @media screen and (min-width: 1024px) { .home__what { margin-top: 265px; } } .home__about { padding-top: 80px; } @media screen and (min-width: 768px) { .home__about { padding-top: 140px; } } @media screen and (min-width: 1024px) { .home__about { padding-top: 180px; } } .home__about-txt { max-width: 780px; text-align: center; margin-left: auto; margin-right: auto; } .home__about-txt > * + * { margin-top: 30px; } .home__promotional { padding-top: 90px; padding-bottom: 90px; text-align: center; } @media screen and (min-width: 375px) { .home__promotional { padding-top: 40px; padding-bottom: 40px; } } .home__promotional > * + * { margin-top: 25px; } @media screen and (min-width: 1024px) { .home__promotional > * + * { margin-top: 45px; } } @media screen and (min-width: 375px) { .home__promotional .carousel__bullets { margin: 0 0 40px 0; } } @media screen and (min-width: 1024px) { .home__promotional .carousel__bullets { display: none; } } .home__partner { padding-top: 125px; } @media screen and (min-width: 375px) { .home__partner { padding-top: 100px; } } @media screen and (min-width: 768px) { .home__partner { padding-top: 230px; } } .home__rescues { padding-top: 25px; padding-bottom: 25px; } @media screen and (min-width: 768px) { .home__rescues { padding-top: 155px; } } @media screen and (min-width: 768px) { .home--blank .home__what { margin-top: 155px; } } @media screen and (min-width: 1024px) { .home--blank .home__what { margin-top: 105px; } } @media screen and (min-width: 768px) { .home--urgent .home__what { margin-top: 125px; } } @media screen and (min-width: 1024px) { .home--urgent .home__what { margin-top: 65px; } } .home--urgent .hero--fader { justify-content: flex-end; padding-bottom: 55px; } @media screen and (min-width: 550px) { .home--urgent .hero--fader { padding-bottom: 0; justify-content: center; } } @media screen and (min-width: 768px) { .home--urgent .hero__wrap .hero__title { max-width: 700px; } .home--urgent .hero__wrap .hero__sub { max-width: 500px; } } .home__row { padding: 80px 0; } @media screen and (min-width: 375px) { .home__row { padding: 40px 0; } } @media screen and (min-width: 550px) { .home__who { padding: 150px 0 190px 0; } } .single-news { padding-bottom: 100px; } @media screen and (min-width: 768px) { .single-news { padding-bottom: 180px; } } .single-news__breaker { margin-bottom: 60px; } .single-news__stories { margin-top: 50px; } .stories { padding: 5px 0; } @media screen and (min-width: 768px) { .stories { display: flex; flex-wrap: wrap; justify-content: space-between; } } .stories__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 25px; } @media screen and (min-width: 768px) { .stories__featured { width: calc(50% - 12px); } } .stories__featured .article-category { margin-bottom: 30px; } @media screen and (min-width: 550px) { .stories__featured .article-category { margin-bottom: 0; } } @media screen and (min-width: 375px) { .stories__carousel .carousel__item { max-width: none; width: calc(100% - 90px); } } @media screen and (min-width: 768px) { .stories__carousel { width: calc(50% - 12px); } } @media screen and (min-width: 1024px) { .stories__row { margin-top: 50px; } } .stories--small { margin-top: -25px; } .stories--small > * { margin-top: 25px; } .stories--home { padding: 0 0 60px; } @media screen and (min-width: 375px) { .stories--home > .column { padding-left: 0; padding-right: 0; } } @media screen and (min-width: 768px) { .stories--home > .column { padding-right: 0.7813rem; padding-left: 0.7813rem; } } @media screen and (min-width: 1024px) { .stories--home > .column { padding-right: 0.7813rem; padding-left: 0.7813rem; } } @media screen and (min-width: 768px) { .stories--home { padding: 0 0 80px; } } @media screen and (min-width: 1024px) { .stories--home { padding: 0 0 150px; } } .stories--lead { padding-top: 100px; } .internal__carousel, .internal__box, .internal__mosaic, .internal__form, .internal__img, .internal__breaker { margin-top: 100px; } @media screen and (min-width: 768px) { .internal__carousel, .internal__box, .internal__mosaic, .internal__form, .internal__img, .internal__breaker { margin-top: 150px; } } @media screen and (min-width: 1024px) { .internal__box, .internal__img, .internal__breaker { margin-top: 220px; } } .internal__box { margin-bottom: 50px; } @media screen and (min-width: 768px) { .internal__box { margin-bottom: 150px; } } @media screen and (min-width: 1024px) { .internal__box { margin-bottom: 190px; } } .internal__lead { position: relative; z-index: 1; padding-top: 100px; } @media screen and (min-width: 768px) { .internal__lead { padding-top: 150px; } } @media screen and (min-width: 1024px) { .internal__lead { padding-top: 200px; } } .internal__txt { padding: 100px 0; } @media screen and (min-width: 768px) { .internal__txt { padding: 150px 0; } } @media screen and (min-width: 1024px) { .internal__txt { padding: 190px 0 220px; } } .internal__map { margin-top: 50px; } @media screen and (min-width: 768px) { .internal__map { margin-top: 80px; } } .internal__form { max-width: 790px; margin-left: auto; margin-right: auto; padding-bottom: 50px; } @media screen and (min-width: 768px) { .internal__form { padding-bottom: 150px; } } @media screen and (min-width: 1024px) { .internal__form { padding-bottom: 220px; } } .internal__mosaic { overflow: hidden; } @media screen and (min-width: 1024px) { .internal__mosaic { margin-top: 230px; } } .internal__featured { margin-bottom: 55px; } .internal--dark { background-color: #1d1d1d; } .internal--dark .internal__box { color: #fff; } .internal--light { background-color: #fafafa; } .single-article { padding-bottom: 100px; } @media screen and (min-width: 768px) { .single-article { padding-bottom: 180px; } } .single-article__breaker { margin-bottom: 60px; } .single-article__stories { margin-top: 50px; } .careers { padding-bottom: 85px; } .careers__testimonials { padding-top: 70px; } .careers__testimonials > * + * { margin-top: 35px; } .careers__breaker { margin-bottom: 75px; } .news-landing__breaker { padding-bottom: 40px; } .news-landing__carousel { padding-top: 50px; } .news-landing__highlight { padding: 100px 0; } .news-landing__video { padding: 100px 0; } .news-landing__tiles { padding-bottom: 100px; } .careers-landing .hero, .careers-entry .hero { margin-bottom: 0; } .careers-landing .careers--list, .careers-entry .careers--list { padding-top: 100px; } .careers-landing .entry, .careers-entry .entry { margin: 50px 0; } .careers-landing .entry__location:after, .careers-entry .entry__location:after { content: ""; display: table; height: 0; clear: both; } .careers-landing .entry__location dt, .careers-landing .entry__location dd, .careers-entry .entry__location dt, .careers-entry .entry__location dd { display: inline-block; float: left; } .careers-landing .entry__location dt, .careers-entry .entry__location dt { clear: left; margin-right: 1em; font-weight: bold; } .block--embed { display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; } .responsive-embed { position: relative; width: 100%; height: 0; padding-bottom: 56.25%; } .responsive-embed > iframe { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; } .heading__ico { width: 20px; height: 20px; } .heading--hero { font-size: 48px; line-height: 48px; } @media screen and (min-width: 768px) { .heading--hero { font-size: 76px; line-height: 80px; } } .heading--giant { font-size: 60px; font-size: min(max(45px, 7.03125vw), 75px); } .heading--main, h1 { font-size: 42px; font-size: min(max(28px, 4.375vw), 45px); } .heading--main-small { font-size: 35px; line-height: 45px; } @media screen and (min-width: 768px) { .heading--main-small { font-size: 50px; line-height: 65px; } } @media screen and (min-width: 1024px) { .heading--main-small { font-size: 60px; line-height: 70px; } } .heading--secondary, h2 { font-size: 36px; font-size: min(max(24px, 3.75vw), 36px); } .heading--third, h3 { font-size: 32px; font-size: min(max(22px, 3.4375vw), 32px); font-weight: 500; } .heading--fourth, h4 { font-size: 28px; font-size: min(max(20px, 3.125vw), 28px); letter-spacing: 1px; } .heading--fifth, .form h3, h5 { font-size: 24px; font-size: min(max(18px, 2.8125vw), 24px); font-weight: 500; letter-spacing: 0.5px; } .heading--sixth, h6 { font-size: 20px; font-size: min(max(16px, 2.5vw), 20px); font-weight: 500; letter-spacing: 3px; } .heading--subhead { font-size: 18px; line-height: 24px; } .heading--lead { font-size: 42px; letter-spacing: 0; line-height: 54px; } .heading--news { font-size: 25px; line-height: 30px; } @media screen and (min-width: 1024px) { .heading--news { font-size: 45px; line-height: 50px; } } .heading--special { font-family: "Feijoa", "serif"; } .heading--large { font-size: 75px; line-height: 85px; font-weight: bold; } .heading--tiny { font-size: 12px; letter-spacing: 1.75px; } .heading--ico { display: inline-flex; align-items: center; } .heading--ico > * + * { margin-left: 7px; } .heading--orange .heading__ico { fill: #ff5800; } .heading--light { color: #fff; } .heading--blue { color: #0072bc; } .heading--yellow { color: #FFD238; } .heading--dark { color: #353439; } .heading--black { color: #000000; } .heading--grey { color: #adb1bc; } .heading--space { margin-bottom: 20px; } .heading--bold { font-weight: bold; } .heading--medium { font-weight: 500; } .heading--uppercase { text-transform: uppercase; } .heading--left { text-align: left; } .heading--center { text-align: center; } .heading--right { text-align: right; } .heading--inline { display: inline-block; } .span--caption { font-size: 12px; line-height: 18px; letter-spacing: 1px; } .span--quote { font-size: 32px; line-height: 42px; } @media screen and (min-width: 550px) { .span--quote { font-size: 42px; line-height: 54px; } } .span--special { font-family: "Feijoa", "serif"; font-weight: 500; } .span--light { color: #fff; } .span--dark { color: #353439; } .span--medium { font-weight: 500; } .span--slider { font-size: 14px; font-weight: 500; line-height: 18px; letter-spacing: 2.62px; color: rgba(255, 255, 255, 0.6); text-transform: uppercase; } .span--blue { color: #0a6db6; } .txt, .urgent__body p { color: #353439; font-weight: 500; } .txt strong, .urgent__body p strong { font-weight: bold; } .txt em, .urgent__body p em, .txt i, .urgent__body p i { font-style: italic; } .txt a, .urgent__body p a { transition: color 0.3s ease; color: #0072bc; } .txt a:hover, .urgent__body p a:hover { color: #66aad7; } .txt ul, .urgent__body p ul, .txt ol, .urgent__body p ol { padding-left: 15px; margin-top: 15px; margin-bottom: 15px; } .txt ul, .urgent__body p ul { list-style: disc; } .txt ol, .urgent__body p ol { list-style: decimal; } .txt a, .urgent__body p a { color: #0072bc; } .txt--bigger { font-size: 16px; line-height: 20px; } @media screen and (min-width: 550px) { .txt--bigger { font-size: 18px; line-height: 32px; } } .txt--regular, .urgent__body p { font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: 0.5px; } .txt--special { font-family: "Feijoa", "serif"; font-size: 16px; line-height: 26px; letter-spacing: 0.2px; } .txt--left { text-align: left; } .txt--center { text-align: center; } .txt--right { text-align: right; } .txt--small { font-size: 14px; line-height: 20px; letter-spacing: 0.02em; } .txt--light { color: #fff; } .txt--slim { font-weight: 400; } .txt--white { color: #fff; } .txt--blue { color: #0072bc; } .txt--narrow { max-width: 550px; } .txt--opacity { opacity: 0.7; } /* Button classes -------------- Regular button: "btn btn--standard */ .btn { white-space: nowrap; text-transform: uppercase; font-size: 13px; font-weight: bold; letter-spacing: 1.86px; display: inline-flex; align-items: center; justify-content: center; position: relative; overflow: hidden; padding: 5px 15px; will-change: background; transition: background 0.3s ease; /* ###### ####### ## ####### ######## ###### ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ######## ###### ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ###### ####### ######## ####### ## ## ###### */ /* ######## #### ## ## ## ## ## ## ## ## ## ## ###### ## ## ## ## ## ## ## ## ## ## ## ## #### ######## ######## ## ## ####### ######## ######## ### ### ## ## ## ## ## #### #### ## ## ## ## ## ## ### ## ## ## ## ## ###### ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ## ####### ######## ######## */ } .btn::before, .btn::after, .btn__mask { display: block; position: absolute; width: 100%; height: 100%; left: 0; top: 0; z-index: 2; transform: translateX(-100%); transition: transform 0.3s ease; will-change: transform; } .btn:hover::before, .btn:hover::after, .btn:focus::before, .btn:focus::after { transform: none; } .btn--wide { padding: 0 60px; } .btn--full { width: 100%; } .btn__inner { position: relative; top: 1px; line-height: 1; z-index: 3; } .btn__ico { width: 24px; height: 24px; min-width: 24px; min-height: 24px; position: relative; z-index: 3; will-change: fill; transition: fill 0.3s ease, transform 0.3s ease; fill: currentColor; } .btn__spinner { will-change: transform, opacity; transform: scale(0); transition: transform 0.3s ease, opacity 0.3s ease; } .btn__mask { background-color: rgba(255, 255, 255, 0.1); } .btn--standard { min-height: 48px; } .btn--big { min-height: 60px; } .btn--large { min-height: 72px; } .btn--flat { padding: 0; } .btn--fit { min-width: auto !important; } .btn--blue { background-color: #0072bc; border-color: #0072bc; color: #0072bc; } .btn--blue::after { background-color: #0072bc; } .btn--dark { background-color: #353439; border-color: #353439; color: #353439; } .btn--dark::after { background-color: #353439; } .btn--yellow { background-color: #f0dd66; border-color: #f0dd66; color: #f0dd66; } .btn--yellow::after { background-color: #f0dd66; } .btn--light { background-color: #66aad7; border-color: #66aad7; color: #66aad7; } .btn--light::after { background-color: #66aad7; } .btn--red { background-color: #f44c4c; border-color: #f44c4c; color: #f44c4c; } .btn--red::after { background-color: #f44c4c; } .btn--orange { background-color: #fe7000; border-color: #fe7000; color: #fe7000; } .btn--orange::after { background-color: #fe7000; } .btn--blue1 { background-color: #0072bc; border-color: #0072bc; color: #0072bc; } .btn--blue1::after { background-color: #0072bc; } .btn--blue2 { background-color: #66aad7; border-color: #66aad7; color: #66aad7; } .btn--blue2::after { background-color: #66aad7; } .btn--white { background-color: #fff; border-color: #fff; color: #fff; } .btn--white::after { background-color: #fff; } .btn--grey1 { background-color: #f2f2f2; border-color: #f2f2f2; color: #f2f2f2; } .btn--grey1::after { background-color: #f2f2f2; } .btn--grey2 { background-color: #b2b2b2; border-color: #b2b2b2; color: #b2b2b2; } .btn--grey2::after { background-color: #b2b2b2; } .btn--grey3 { background-color: #9294a1; border-color: #9294a1; color: #9294a1; } .btn--grey3::after { background-color: #9294a1; } .btn--grey4 { background-color: #797c8b; border-color: #797c8b; color: #797c8b; } .btn--grey4::after { background-color: #797c8b; } .btn--grey5 { background-color: #4b4d59; border-color: #4b4d59; color: #4b4d59; } .btn--grey5::after { background-color: #4b4d59; } .btn--grey6 { background-color: #353439; border-color: #353439; color: #353439; } .btn--grey6::after { background-color: #353439; } .btn--yellow1 { background-color: #FFD238; border-color: #FFD238; color: #FFD238; } .btn--yellow1::after { background-color: #FFD238; } .btn--yellow2 { background-color: #f0dd66; border-color: #f0dd66; color: #f0dd66; } .btn--yellow2::after { background-color: #f0dd66; } .btn--orange1 { background-color: #fe7000; border-color: #fe7000; color: #fe7000; } .btn--orange1::after { background-color: #fe7000; } .btn--orange2 { background-color: #ff5800; border-color: #ff5800; color: #ff5800; } .btn--orange2::after { background-color: #ff5800; } .btn--red1 { background-color: #f44c4c; border-color: #f44c4c; color: #f44c4c; } .btn--red1::after { background-color: #f44c4c; } .btn--red2 { background-color: #ef3332; border-color: #ef3332; color: #ef3332; } .btn--red2::after { background-color: #ef3332; } .btn--green1 { background-color: #39ac67; border-color: #39ac67; color: #39ac67; } .btn--green1::after { background-color: #39ac67; } .btn--green2 { background-color: #5ecf8d; border-color: #5ecf8d; color: #5ecf8d; } .btn--green2::after { background-color: #5ecf8d; } .btn--maroon1 { background-color: #920049; border-color: #920049; color: #920049; } .btn--maroon1::after { background-color: #920049; } .btn--maroon2 { background-color: #620031; border-color: #620031; color: #620031; } .btn--maroon2::after { background-color: #620031; } .btn--clean { min-width: auto; color: #353439; } .btn--primary { min-width: 170px; color: #fff; } .btn--primary::before { content: ""; background-color: rgba(255, 255, 255, 0.1); } .btn--inverse { min-width: 170px; background: none; border-width: 2px; border-style: solid; will-change: color; transition: color 0.3s ease; } .btn--inverse:hover, .btn--inverse:focus { color: #fff; } .btn--inverse:hover.btn--white, .btn--inverse:focus.btn--white { color: #353439; } .btn--inverse::after { content: ""; } .btn--inverse.btn--wide { min-width: 230px; } .btn--rounded { border-radius: 4px; } .btn--ico > * + * { margin-left: 1em; } .btn--arrow .btn__ico { width: 24px; height: 12px; transition: transform 0.3s ease; } .btn--loader::before { content: none; } .btn--loader.loaded .btn__ico { transform: none; opacity: 1; } .btn--loader.loaded .btn__spinner { opacity: 0; transform: scale(0); } .btn--loader .btn__ico { position: absolute; top: 0; bottom: 0; left: 0; right: 0; width: 20px; height: 13px; margin: auto; will-change: transform, opacity; transform: scale(0); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; } .btn--video { display: flex; align-items: center; } .btn--video > * + * { margin-left: 15px; } .btn--video .btn__inner { font-size: 14px; line-height: 18px; letter-spacing: 2px; font-weight: bold; color: #353439; } .btn--video .btn__ico { width: 24px; height: 24px; fill: #0072bc; } .btn--news { padding-left: 0; } .btn--freeformSubmit[disabled] { cursor: wait; } .btn--freeformSubmit[disabled]::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 32 32'%3E%3Cpath d='M16 32c-4.274 0-8.292-1.664-11.314-4.686s-4.686-7.040-4.686-11.314c0-3.026 0.849-5.973 2.456-8.522 1.563-2.478 3.771-4.48 6.386-5.791l1.344 2.682c-2.126 1.065-3.922 2.693-5.192 4.708-1.305 2.069-1.994 4.462-1.994 6.922 0 7.168 5.832 13 13 13s13-5.832 13-13c0-2.459-0.69-4.853-1.994-6.922-1.271-2.015-3.066-3.643-5.192-4.708l1.344-2.682c2.615 1.31 4.824 3.313 6.386 5.791 1.607 2.549 2.456 5.495 2.456 8.522 0 4.274-1.664 8.292-4.686 11.314s-7.040 4.686-11.314 4.686z'%3E%3C/path%3E%3C/svg%3E"); position: absolute; top: 50%; left: 50%; font-size: 1.5rem; line-height: 1; width: 1em; height: 1em; transform: translateX(-50%) translateY(-50%); transform-origin: 0% 0%; color: white; z-index: 5; animation-name: btn-rotate; animation-fill-mode: forwards; animation-duration: 1s; animation-timing-function: linear; animation-iteration-count: infinite; animation-play-state: running; } .btn--freeformSubmit[disabled]::after { transition: 0s linear transform; transform: translateX(0%); z-index: 4; } .btn-clean { min-width: auto; color: #353439; } .btn-clean--yellow .btn-clean__ico { fill: #f0dd66; } .btn-clean--blue .btn-clean__ico { fill: #0a6db6; } .btn-clean--light { color: #fff; } .btn-clean--txt-white { color: #fff; } .btn-clean--txt-blue { color: #0072bc; } .btn-clean--txt-yellow { color: #FFD238; } .btn-clean--txt-blue1 { color: #0072bc; } .btn-clean--txt-blue2 { color: #66aad7; } .btn-clean--txt-grey1 { color: #f2f2f2; } .btn-clean--txt-grey2 { color: #b2b2b2; } .btn-clean--txt-grey3 { color: #9294a1; } .btn-clean--txt-grey4 { color: #797c8b; } .btn-clean--txt-grey5 { color: #4b4d59; } .btn-clean--txt-grey6 { color: #353439; } .btn-clean--txt-yellow1 { color: #FFD238; } .btn-clean--txt-yellow2 { color: #f0dd66; } .btn-clean--txt-orange1 { color: #fe7000; } .btn-clean--txt-orange2 { color: #ff5800; } .btn-clean--txt-red1 { color: #f44c4c; } .btn-clean--txt-red2 { color: #ef3332; } .btn-clean--txt-green1 { color: #39ac67; } .btn-clean--txt-green2 { color: #5ecf8d; } .btn-clean--txt-maroon1 { color: #920049; } .btn-clean--txt-maroon2 { color: #620031; } .btn-clean--txt-black { color: #222; } .btn-clean--blue1 .btn-clean__ico { fill: #0072bc; } .btn-clean--blue2 .btn-clean__ico { fill: #66aad7; } .btn-clean--grey1 .btn-clean__ico { fill: #f2f2f2; } .btn-clean--grey2 .btn-clean__ico { fill: #b2b2b2; } .btn-clean--grey3 .btn-clean__ico { fill: #9294a1; } .btn-clean--grey4 .btn-clean__ico { fill: #797c8b; } .btn-clean--grey5 .btn-clean__ico { fill: #4b4d59; } .btn-clean--grey6 .btn-clean__ico { fill: #353439; } .btn-clean--yellow1 .btn-clean__ico { fill: #FFD238; } .btn-clean--yellow2 .btn-clean__ico { fill: #f0dd66; } .btn-clean--orange1 .btn-clean__ico { fill: #fe7000; } .btn-clean--orange2 .btn-clean__ico { fill: #ff5800; } .btn-clean--red1 .btn-clean__ico { fill: #f44c4c; } .btn-clean--red2 .btn-clean__ico { fill: #ef3332; } .btn-clean--green1 .btn-clean__ico { fill: #39ac67; } .btn-clean--green2 .btn-clean__ico { fill: #5ecf8d; } .btn-clean--maroon1 .btn-clean__ico { fill: #920049; } .btn-clean--maroon2 .btn-clean__ico { fill: #620031; } .liner { border: none; height: 3px; width: 60px; margin: 0; } .liner--yellow { background-color: #fecf00; } .liner--blue { background-color: #0a6db6; } .liner--green { background-color: #5fcf8d; } .liner--orange { background-color: #fe7000; } .spinner { z-index: 3; animation: loading-bar-spinner 800ms linear infinite; } .spinner__inner { width: 20px; height: 20px; border: solid 3px transparent; border-top-color: #fff; border-left-color: #fff; border-radius: 50%; } @keyframes loading-bar-spinner { 0% { transform: rotate(0deg); transform: rotate(0deg); } 100% { transform: rotate(360deg); transform: rotate(360deg); } } .input { display: inline-block; position: relative; width: 100%; height: 70px; } .input.freeze .input__label { transform: translateY(-20px); opacity: 1; } .input__label { position: absolute; left: 0; bottom: 22px; font-size: 13px; font-weight: 500; line-height: 20px; letter-spacing: 1.8px; text-transform: uppercase; color: #b2b2b2; will-change: transform, color; transition: transform 0.3s ease, color 0.3s ease; } .input__label--static { position: static; left: auto; bottom: auto; } .input__label.required:after { content: "*"; margin-left: 5px; color: red; } .input__val { width: 100%; height: 35px; position: absolute; left: 0; bottom: 0; font-size: 18px; line-height: 18px; letter-spacing: 0.75px; color: #353439; background-color: transparent; border: none; border-bottom: 1px solid #f2f2f2; border-radius: 0; } @media screen and (min-width: 768px) { .input__val { font-size: 16px; } } .input__val:focus + .input__label { transform: translateY(-20px); opacity: 1; } .input__arrow { background-color: #fff; } .input__ico { display: flex; align-items: center; position: absolute; z-index: 2; right: 0; bottom: 12px; } .input__btn { position: absolute; top: 0; bottom: 0; right: 10px; z-index: 2; height: calc(100% - 20px); margin: auto; } .input--ok .input__val { border-color: #5ecf8d; } .input--ok .input__ico { width: 20px; height: 13px; fill: #5ecf8d; } .input--err .input__val { border-color: #fd5354; } .input--err .input__ico { width: 14px; height: 14px; fill: #fd5354; } .input--select .input__val { color: #adb1bc; } .input--select .input__val:focus { color: #353439; } .input--select .input__label { transform: translateY(-20px); opacity: 1; } .input--select .input__ico { width: 12px; height: 7px; fill: #f2f2f2; } .input--multi-select { height: unset; display: block; } .input--multi-select .input__label { position: static; } .input--multi-select .input__desc { font-size: 0.9em; margin: 0.5em 0; color: #797c8b; } .input--multi-select .input__field { display: block; font-size: 18px; line-height: 18px; letter-spacing: 0.75px; color: #353439; background-color: transparent; border: 1px solid #f2f2f2; border-radius: 0; padding: 5px; } @media screen and (min-width: 768px) { .input--multi-select .input__field { font-size: 16px; } } .input--blue .input__val:focus { outline: none; border-bottom: 1px solid #0a6db6; } .input--blue .input__val:focus ~ .input__label { transform: translateY(-20px); color: #0a6db6; } .input--yellow .input__val { color: rgba(255, 255, 255, 0.5); } .input--yellow .input__val:focus { outline: none; border-bottom: 1px solid #fecf00; } .input--yellow .input__val:focus ~ .input__label { transform: translateY(-20px); color: #fecf00; } .input--textarea { height: auto; min-height: 70px; display: flex; flex-direction: column; justify-content: flex-end; } .input--textarea .input__val { position: static; margin-top: 50px; } .input--textarea .input__label { top: 28px; bottom: auto; } .check__input { position: absolute; opacity: 0; } .check__input + .check__label { line-height: 1.4; } .check__input + .check__label:before { content: ""; background: #fff; border-radius: 100%; border: 1px solid #adb1bc; display: inline-block; width: 16px; height: 16px; position: relative; top: 0.05em; margin-right: 15px; vertical-align: top; cursor: pointer; text-align: center; transition: all 250ms ease; } .check__input:focus + .check__label:before { outline: none; border-color: #0072bc; } .check__input:hover + .check__label:before { box-shadow: inset 0 0 0 4px #fff; border-color: #0072bc; background: rgba(0, 114, 188, 0.2); } .check__input:checked + .check__label:before { box-shadow: inset 0 0 0 4px #fff; border-color: #0072bc; background: #0072bc; } .check__input:checked:hover + .check__label:before { background: #0072bc; } .check__input:disabled + .check__label:before { box-shadow: inset 0 0 0 4px #fff; border-color: #f2f2f2; background: #fff; } .check__input:disabled:checked + .check__label:before { background: #f2f2f2; } .check__input + .check__label:empty:before { margin-right: 0; } .check__label a { color: #0072bc; } .check--checkbox .check__input:hover + .check__label:before { box-shadow: inset 0 0 0 3px #fff; } .check--checkbox .check__input:checked + .check__label:before { box-shadow: inset 0 0 0 3px #fff; } .check--checkbox .check__input :disabled + .check__label:before { box-shadow: inset 0 0 0 3px #fff; } .check--checkbox .check__label:before { border-radius: 0; } .capitalize { color: white; background-size: cover; -webkit-background-clip: text; background-clip: text; background-color: #222; -webkit-text-fill-color: transparent; text-fill-color: transparent; font-size: 80px; font-weight: bold; font-family: "Feijoa", "serif"; text-transform: uppercase; float: left; padding-right: 15px; } .capitalize--blank { background-color: #f2f2f2; } .is-ie .capitalize, .is-ie-11 .capitalize { background: none !important; color: #222; } @media screen and (min-width: 768px) { .capitalize { font-size: 120px; padding-right: 30px; } } @media screen and (min-width: 1024px) { .capitalize { font-size: 180px; padding-right: 45px; } } .link { font-family: inherit; color: #0072bc; display: inline-block; position: relative; will-change: opacity; transition: opacity 0.3s ease; } .link:hover { opacity: 0.8; } .link:hover::after { transform: scaleX(0); } .link:after { content: ""; display: block; position: absolute; bottom: 6px; left: 0; width: 100%; height: 1px; background-color: #0072bc; will-change: transform; transition: transform 0.3s ease; } .logo { height: 110px; width: calc( 110px * 0.5584415584); } @media screen and (min-width: 1200px) { .logo { height: 130px; width: calc( 130px * 0.5584415584 ); } } .logo--white { fill: #fff; } .logo--blue { fill: #0072bc; } .logo--alt { height: 55px; width: 170px; } .hb { width: 36px; height: 26px; position: relative; cursor: pointer; } .hb.active .hb__line:first-of-type { transform: rotate(45deg); } .hb.active .hb__line:last-of-type { transform: rotate(-45deg); } .hb__line { position: absolute; left: 0; display: block; will-change: transform; transition: transform 0.3s ease; width: 100%; height: 2px; background-color: #fff; border-radius: 0; } .hb__line:first-of-type { top: 0; transform-origin: top left; } .hb__line:last-of-type { bottom: 0; transform-origin: bottom left; } .header.light .hb__line { background-color: #353439; } .btn-special { display: inline-flex; align-items: center; height: 60px; width: 100%; } @media screen and (min-width: 1024px) { .btn-special { height: 48px; width: auto; border-radius: 0; overflow: hidden; } } .btn-special__modal { flex: 1 0 auto; height: 100%; margin-right: 2px; padding: 0 25px; background-color: #f44c4c; font-size: 14px; font-weight: bold; text-transform: uppercase; letter-spacing: 2px; color: #fff; cursor: pointer; } .btn-special__modal:focus { background-color: #222; } .btn-special__drop { flex: 0 1 auto; height: 100%; width: 60px; border-left: 2px solid transparent; padding: 0 15px; cursor: pointer; background-color: #f44c4c; } .btn-special__drop:hover .btn-special__ico, .btn-special__drop:focus .btn-special__ico { transform: translateY(3px); } .btn-special__drop:focus { background-color: #222; } .btn-special__ico { fill: #fff; width: 12px; height: 12px; will-change: transform; transition: transform 0.3s ease; } .drop { position: absolute; width: 100%; pointer-events: none; } .drop.active { pointer-events: inherit; z-index: 400; } .drop.active .drop__body { transform: none; } .drop__mask { position: absolute; top: -120%; left: 0; width: 100%; height: 150vh; z-index: 1; } .drop__body { position: relative; z-index: 2; will-change: tranform; transition: transform 0.3s ease; transform: scaleY(0); } .drop__arrow { display: none; } @media screen and (min-width: 768px) { .drop__arrow { display: block; } } .drop__wrap { background-color: #fff; box-shadow: 0 0 60px 0 rgba(33, 43, 54, 0.1); } .drop__item { line-height: 24px; letter-spacing: 0.5px; text-align: left; display: block; width: 100%; padding: 15px 0; } .drop__link { font-size: 16px; color: #353439; } .drop__break { font-size: 13px; font-weight: 500; text-transform: uppercase; color: #adb1bc; } .drop--mobile { bottom: 0px; } .drop--mobile .drop__wrap { padding: 40px 50px; } .drop--mobile .drop__body { transform-origin: left bottom; } .drop--desktop { top: 50px; } .drop--desktop .drop__arrow { display: flex; justify-content: flex-end; margin-top: 10px; position: relative; z-index: 1; } .drop--desktop .drop__triangle { position: absolute; top: -18px; right: 0; width: 40px; height: 40px; } .drop--desktop .drop__rectangle { position: absolute; top: 0; width: 100%; height: 100%; } .drop--desktop .drop__item { padding: 10px 15px; } .drop--desktop .drop__link { transition: background-color 0.15s ease, color 0.15s ease; } .drop--desktop .drop__link:hover { color: #fff; background-color: #fd5354; } .drop--desktop .drop__body { transform-origin: left top; box-shadow: 0 2px 16px 0 rgba(33, 43, 54, 0.08); } .drop--desktop .drop__wrap { padding: 5px 0; border-radius: 0; position: relative; z-index: 2; width: 100%; } .drop--desktop .drop__mask { left: 0; top: 0; position: fixed; width: 100vw; } .drop--desktop .drop__break { letter-spacing: 1.8px; border-bottom: 1px solid #f0f0f0; } .dropdown { display: inline-block; position: relative; min-width: 90px; } .dropdown__background { position: fixed; left: 0; top: 0; width: 100%; height: 100%; display: none; z-index: 10; } .dropdown__trigger { display: flex; flex-direction: row; justify-content: space-between; background-color: #fff; padding: 15px 20px; text-decoration: none; text-transform: uppercase; color: #353439; font-weight: 500; border-radius: 0; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.12); } .dropdown__trigger > * + * { margin-left: 0.5rem; } .dropdown__arrow { display: inline-block; width: 12px; } .dropdown__content { position: absolute; z-index: 12; left: 0; top: 100%; width: 100%; background-color: #fff; box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.12); border-radius: 0; margin-top: 0.5rem; padding-top: 10px; padding-bottom: 10px; transition: all 0.3s ease; visibility: hidden; opacity: 0; } .dropdown__content a { text-align: left; display: block; padding: 5px 20px; text-decoration: none; color: #353439; transition: opacity 0.3s ease; } .dropdown__content a:hover { opacity: 0.8; } .dropdown--visible .dropdown__content { visibility: visible; opacity: 1; } .dropdown--visible .dropdown__background { display: block; } .accordion { border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .accordion__head { display: inline-flex; justify-content: space-between; align-items: center; width: 100%; padding: 10px 0; } .accordion__ico { width: 12px; height: 12px; fill: rgba(255, 255, 255, 0.5); } .accordion__body { height: 0; overflow: hidden; will-change: height; } .accordion__body em, .accordion__body i { font-style: italic; } .accordion__body p { font-size: 15px; line-height: 1.8em; } .accordion__body p:not(:last-child) { margin-bottom: 15px; } .accordion__body ul, .accordion__body ol { padding-left: 15px; margin-top: 15px; margin-bottom: 15px; } .accordion__body ul { list-style: disc; } .accordion__body ol { list-style: decimal; } .accordion__body a { transition: color 0.3s ease; color: #0072bc; } .accordion__body a:hover { color: #66aad7; } .accordion--resources { width: 100%; } .accordion--resources .accordion__head { background: #fff; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1); opacity: 0.9; border-radius: 0; cursor: pointer; font-family: Reader; font-size: 16px; line-height: 24px; text-transform: none; width: 100%; padding: 15px 30px; } @media screen and (min-width: 550px) { .accordion--resources .accordion__head { height: 70px; } } .accordion--resources .accordion__ico { fill: #353439; } .accordion--resources .accordion__body { padding: 0 30px; } .accordion--resources .accordion__body > * { padding-top: 30px; } .socials { display: flex; flex-flow: column nowrap; justify-content: center; } .socials__list { display: flex; flex-flow: row wrap; justify-content: center; margin: 1em auto; padding: 0; } .socials__list li { display: flex; } .socials__item { padding: 15px; } .socials__ico { width: 17px; height: 17px; } .socials__ico--copy { transition: transform 0.3s ease, opacity 0.45s ease; will-change: transform, opacity; } .socials--mobile .socials__ico { fill: rgba(255, 255, 255, 0.7); } .socials--grey .socials__ico { fill: #4b4d59; } .socials--blue .socials__ico { fill: #0072bc; } .socials--footer > * + * { margin-left: 10px; } .socials--footer .socials__item { display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; width: 36px; height: 36px; background-color: #e6f0f7; border-radius: 50%; } .socials--footer .socials__item:hover .socials__ico--copy { transform: scale(3); opacity: 0; } .socials--footer .socials__ico { position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; fill: #0a6db6; } .socials--transparent .socials__item { background: rgba(255, 255, 255, 0.2); } .socials--transparent .socials__ico { fill: #fff; } .m-socials { display: flex; flex-flow: row wrap; justify-content: center; gap: 10px; } @media screen and (min-width: 768px) { .m-socials { flex-wrap: nowrap; } } .m-socials.-onDarkBg .m-socials__item { background-color: rgba(255, 255, 255, 0.2); } .m-socials.-onDarkBg .m-socials__ico { fill: white; } .m-socials__item { display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden; width: 36px; height: 36px; background-color: #e6f0f7; border-radius: 50%; } .m-socials__item:hover .m-socials__ico.-copy { transform: scale(3); opacity: 0; } .m-socials__ico { width: 17px; height: 17px; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; fill: #0a6db6; } .m-socials__ico.-copy { transition: transform 0.3s ease, opacity 0.45s ease; will-change: transform, opacity; } .drawer { overflow: hidden; opacity: 0; position: fixed; top: 0; right: 0; height: 100vh; width: 100%; transition: transform 0.35s ease, opacity 0.35s ease; transform: translateX(100%); z-index: 1000; } @media screen and (min-width: 1024px) { .drawer { max-width: 720px; } } .drawer.is-active { opacity: 1; transform: translateX(0%); } .drawer__wrap { display: flex; flex-direction: column; justify-content: flex-start; padding: 40px 30px 0; background: #fff; box-shadow: 3px 6px 12px 0 rgba(0, 0, 0, 0.2); height: 100%; width: 100%; position: relative; transition: transform 0.35s ease, opacity 0.35s ease; overflow: auto; } @media screen and (min-width: 1024px) { .drawer__wrap { padding: 80px 160px; } } .drawer__wrap--ajax { padding-top: 110px; } @media screen and (min-width: 1024px) { .drawer__wrap--ajax { padding: 80px 160px; } } .drawer__wrap--register { padding-top: 110px; } @media screen and (min-width: 1024px) { .drawer__wrap--register { padding: 80px 160px; } } .drawer__head:last-child { padding-bottom: 110px; } @media screen and (min-width: 550px) { .drawer__head:last-child { padding-bottom: 0; } } @media screen and (min-width: 1024px) { .drawer__close { display: none; } } .drawer__header { font-size: 22px; font-weight: 500; line-height: 30px; } .drawer__txt { margin-top: 20px; line-height: 28px; } .drawer__ico { width: 26px; height: 26px; cursor: pointer; } .drawer__switcher { margin-top: 20px; } .drawer__body { margin-bottom: 60px; position: relative; margin-top: 35px; } @media screen and (min-width: 1024px) { .drawer__body { flex: 0 1 auto; height: 100%; margin-bottom: 0px; margin-top: 60px; } } .drawer__body--owl > * + * { margin-top: 50px; } .drawer__body--register > *:last-child { margin-bottom: 40px; } @media screen and (min-width: 1024px) { .drawer__body--register > *:last-child { margin-bottom: 80px; } } .drawer__section { text-align: center; pointer-events: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%; opacity: 0; will-change: opacity; transition: opacity 0.3s ease; } @media screen and (min-width: 1024px) { .drawer__section { text-align: left; } } .drawer__section.active { opacity: 1; pointer-events: inherit; } .drawer__section-owl > * + * { margin-top: 30px; } .drawer__extra { margin-top: 65px; margin-bottom: 100px; } @media screen and (min-width: 1024px) { .drawer__extra { margin-top: 75px; } } .drawer__footer { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 50; } .drawer__footer-fake { height: 60%; max-height: 60px; width: 100%; flex: 1 0 auto; } .drawer__submit { width: 100%; } .drawer__submit--desktop { display: none; } @media screen and (min-width: 1024px) { .drawer__submit--desktop { display: flex; justify-content: space-between; padding: 0 30px; margin-top: 75px; } } @media screen and (min-width: 1024px) { .drawer__submit--mobile { display: none; } } .drawer__submit--register { padding-left: 30px; padding-right: 30px; margin: 0; display: flex; justify-content: space-between; } .drawer__donate { font-size: 14px; line-height: 24px; font-weight: 500; color: #adb1bc; letter-spacing: 1.5px; text-transform: uppercase; text-align: center; border-top: 1px solid rgba(212, 211, 216, 0.5); margin-top: 35px; padding-top: 20px; width: 100%; } @media screen and (min-width: 1024px) { .drawer__donate { border: none; margin-top: 0; } } .drawer--dark .drawer__wrap { background-color: #353439; } .drawer--dark .drawer__ico { fill: #fff; } .drawer--dark .drawer__header { color: #fff; } .drawer--dark .drawer__txt { color: #f2f2f2; } .drawer--light .drawer__wrap { background-color: #f9f9f9; } .drawer--light .drawer__ico { fill: #adb1bc; } .drawer--light .drawer__header { color: #353439; } .drawer--light .drawer__txt { color: #4b4d59; } .drawer-mask { display: none; } @media screen and (min-width: 1024px) { .drawer-mask { position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 999; } } .drawer-mask.active { display: block; } .switcher { display: flex; } .switcher__item { font-size: 14px; font-weight: 500; line-height: 24px; text-transform: uppercase; text-align: center; letter-spacing: 1.5px; color: #adb1bc; cursor: pointer; border-bottom: 1px solid rgba(212, 211, 216, 0.5); padding-bottom: 10px; width: 50%; } .switcher--red .switcher__item.active { color: #f44c4c; border-bottom: 3px solid #f44c4c; } .form p { margin: 0 0 1.25em; font-size: 18px; line-height: 1.5em; } .form h3 { color: #4b4d59; } .form__header { margin-bottom: 30px; } .form__header > * + * { margin-top: 15px; } .form__success { background-color: rgba(57, 172, 103, 0.1); border: 1px solid #39AC67; border-radius: 0; color: #39AC67; margin-top: 1.5em; margin-bottom: 1.5em; padding: 15px; display: none; font-size: 14px; font-weight: 600; letter-spacing: 0.05em; text-align: center; text-transform: uppercase; } .form__success.show { display: block; } .form__success p:last-child { margin-bottom: 0; } .form__success a { text-decoration: underline; } .form__fields > * + * { margin-top: 15px; } .form__forgot { font-size: 14px; font-weight: 500; letter-spacing: 1.5px; text-transform: uppercase; text-align: center; color: #adb1bc; margin-top: 20px; } @media screen and (min-width: 1024px) { .form__forgot { font-size: 12px; line-height: 24px; opacity: 0.6; margin-bottom: 35px; } } .form__desc { line-height: 1.5; } .form__submit { width: 100%; } .form__error { color: #ef3332; margin-bottom: 10px; min-height: 22px; font-size: 15px; } .form__check { color: #4b4d59; letter-spacing: 0.75px; } .form__group > * + * { margin-top: 10px; } .form__footer { margin-top: 45px; } /* Exceptions */ .block--theme-light .input__label { color: white; } .block--theme-light .input__val { color: white; border-bottom-color: white; } .block--theme-dark .input__label { color: black; } .block--theme-dark .input__val { color: black; border-bottom-color: black; } .block--form .input, .block--formBlock .input { margin-top: 30px; } .block--form .is-compact .input, .block--formBlock .is-compact .input { margin-top: 10px; } .article-content .o-footer__form p, .article-content .form p { font-family: "Reader", "sans-serif"; } .donate { text-align: center; } .donate__body { display: flex; align-items: center; justify-content: space-between; width: 100%; } .donate__btn { display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background-color: #fff; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.1); cursor: pointer; will-change: box-shadow, transform; transition: box-shadow 0.45s ease, transform 0.45s ease; } .donate__btn:hover { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); transform: scale(1.05); } .donate__ico { width: 14px; height: 14px; fill: #353439; } .donate__value { display: inline-flex; font-size: 36px; line-height: 40px; font-weight: 500; letter-spacing: 0.5px; color: #353439; } @media screen and (min-width: 1024px) { .donate__value { font-size: 55px; line-height: 62px; } } .donate__value input { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: none; border: none; font-family: "Reader", "sans-serif"; font-size: 36px; line-height: 40px; font-weight: 500; letter-spacing: 0.5px; color: #353439; width: 135px; } @media screen and (min-width: 1024px) { .donate__value input { font-size: 55px; line-height: 62px; } } .donate__footer { display: inline-flex; align-items: center; margin-top: 20px; font-size: 16px; line-height: 20px; text-transform: capitalize; } .donate__footer > * + * { margin-left: 10px; } .donate__footer--blue { color: #0072bc; } .donate__footer--orange { color: #ff5800; } .donate__shield { width: 24px; height: 24px; fill: #ff5800; } .urgent { display: flex; align-items: center; overflow: hidden; height: 350px; width: 100%; box-shadow: 0 0 60px 0 rgba(0, 0, 0, 0.1); background-color: #fff; } @media screen and (min-width: 768px) { .urgent { height: 280px; border-radius: 0; } } @media screen and (min-width: 1024px) { .urgent { transform-origin: top center; opacity: 0; } } .urgent__hero { height: 100%; } @media screen and (min-width: 768px) { .urgent__hero { display: flex; overflow: hidden; width: 40%; } } @media screen and (min-width: 1024px) { .urgent__hero { position: relative; z-index: 3; width: 50%; } } .urgent__label { display: flex; align-items: center; justify-content: center; width: 50px; height: 100%; } @media screen and (min-width: 768px) { .urgent__label { flex: 0 1 auto; min-width: 80px; } } .urgent__label-inner { display: block; width: 315px; transform: rotate(-90deg); white-space: nowrap; font-size: 16px; font-weight: 500; letter-spacing: 2px; text-transform: uppercase; } .urgent__img { display: none; } @media screen and (min-width: 768px) { .urgent__img { display: block; background-position: center; background-size: cover; width: 100%; height: 100%; flex: 1 0 auto; } } .urgent__content { display: flex; justify-content: center; flex-direction: column; height: 100%; padding: 10px; } @media screen and (min-width: 375px) { .urgent__content { padding: 30px; width: 100%; } } @media screen and (min-width: 1024px) { .urgent__content { position: relative; padding: 50px 60px; z-index: 2; } } .urgent__head { font-size: 20px; font-weight: 700; line-height: 24px; color: #353439; } .urgent__body { margin-top: 20px; } .urgent__btn { padding: 0; margin-top: 35px; text-align: left; justify-content: flex-start; white-space: normal; overflow: inherit; } @media screen and (min-width: 550px) { .urgent__btn { white-space: nowrap; } } .urgent__ico { fill: #0a6db6; } .urgent--orange .urgent__label { background-color: #fecf00; color: #000; } .urgent--blue .urgent__label { background-color: #0072bc; color: #fff; } .urgent--row { height: 320px; } @media screen and (min-width: 768px) { .urgent--row { height: 280px; } } @media screen and (min-width: 768px) { .urgent--row .urgent__hero { width: 30%; } } @media screen and (min-width: 768px) { .urgent--row .urgent__content { width: 70%; } } @media screen and (min-width: 1024px) { .urgent--row .urgent__content { position: relative; padding: 50px 40px 50px 45px; z-index: 2; } } .urgent--row .urgent__body { margin-top: 0; } .rescues__btn { width: 100%; justify-content: center; } .rescues__btn:after, .rescues__btn:before { content: none; } .rescues__item { background: #fff; font-size: 14px; color: #353439; letter-spacing: 0.23px; line-height: 23px; box-sizing: border-box; } .rescues__carousel { padding: 40px 0 50px; } @media screen and (min-width: 375px) { .rescues__carousel .carousel__item { max-width: none; width: calc(100% - 90px); } } .rescues--mobile .rescues__item { text-align: center; padding: 20px 30px; box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.05); border-radius: 12px; width: 100%; max-width: 80%; height: 80%; } @media screen and (min-width: 375px) { .rescues--mobile .rescues__item { max-width: none; } } .rescues--desktop { display: flex; overflow: hidden; background-color: #fff; box-shadow: 0 0 80px 0 rgba(0, 0, 0, 0.05); } .rescues--desktop .rescues__btn { flex-basis: 25%; position: relative; z-index: 5; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.4); font-size: 18px; font-weight: 500; letter-spacing: 0.45px; text-transform: capitalize; } .rescues--desktop .rescues__btn > * + * { margin-left: 10px; } .rescues--desktop .rescues__bar { flex-basis: 75%; position: relative; z-index: 3; overflow: hidden; width: 100%; } .rescues--desktop .rescues__bar:after { content: ""; position: absolute; right: 0; top: 0; height: 100%; width: 70px; background-image: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #fff 40%); } .rescues--desktop .rescues__timer { position: absolute; left: 0; background-color: #fff; height: 100%; z-index: 2; padding: 0 15px 0 30px; display: flex; align-items: center; font-size: 15px; font-weight: 500; line-height: 24px; letter-spacing: 0.5px; text-transform: uppercase; color: #0072bc; } .rescues--desktop .rescues__ticker { white-space: nowrap; display: inline-flex; align-items: center; height: 100%; padding-left: 850px; animation-iteration-count: infinite; animation-timing-function: linear; animation-name: ticker; animation-duration: 60s; } .rescues--desktop .rescues__ticker > * + * { margin-left: 50px; } .featured { position: relative; display: block; background-position: center; background-size: cover; } @media screen and (min-width: 768px) { .featured { overflow: hidden; height: 100%; } } .featured:before { content: ""; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-image: linear-gradient(-180deg, rgba(0, 0, 0, 0) 34%, #000000 100%); z-index: 1; } .featured__content { align-items: flex-start; display: flex; flex-direction: column; justify-content: flex-end; position: relative; z-index: 2; height: 100%; padding: 25px; min-height: 345px; } @media screen and (min-width: 1024px) { .featured__content { min-height: 385px; padding: 50px; } } .featured__content > div:last-child { width: 100%; } .featured__head { font-weight: bold; color: #fff; display: inline-block; margin-top: auto; margin-bottom: 30px; } .featured__head:after { content: ""; display: block; width: 50px; height: 3px; margin-top: 20px; background-color: #0a6db6; } .featured__txt { color: #fff; } .featured--dark .featured__head:after { background-color: #fecf00; } .featured--compact { height: 590px; } .highlight-banner { background-color: #fecf00; color: #353439; padding: 40px; } @media screen and (min-width: 768px) { .highlight-banner { padding: 60px 40px; } } @media screen and (min-width: 1024px) { .highlight-banner { height: 100%; padding: 0; display: flex; flex-direction: column; justify-content: flex-start; max-width: 300px; } } .highlight-banner > * + * { margin-top: 25px; } .highlight-banner__head { font-weight: bold; } .highlight-banner__btn { font-size: 12px; font-weight: 500; white-space: pre-wrap; margin-top: 35px; } .is-windows .highlight-banner__btn { white-space: normal; } .highlight-banner__btn:before, .highlight-banner__btn:after { content: none; } .highlight-banner__btn > * + * { margin-left: 10px; } .highlight-banner__btn:hover, .highlight-banner__btn:focus { background: #353439; } .highlight-banner__btn:hover .btn__ico, .highlight-banner__btn:focus .btn__ico { fill: #fff; } .highlight-banner__btn .btn__inner { line-height: 1.3; } .highlight-banner--blue { background-color: #0072bc; color: #fff; } .highlight-banner--full { max-width: 100%; padding: 40px; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; } @media screen and (min-width: 768px) { .highlight-banner--full { padding: 40px 80px; text-align: left; flex-direction: row; justify-content: space-between; } } @media screen and (min-width: 768px) { .highlight-banner--full .highlight-banner__btn { margin-top: 0; } } .triangle { position: relative; background-color: #fff; text-align: left; transform: rotate(-60deg) skewX(-30deg) scale(1, 0.866); } .triangle:before, .triangle:after { content: ""; position: absolute; background-color: inherit; } .triangle, .triangle:before, .triangle:after { width: 14px; height: 14px; border-top-right-radius: 3px; } .triangle:before { transform: rotate(-135deg) skewX(-45deg) scale(1.414, 0.707) translate(0, -50%); } .triangle:after { transform: rotate(135deg) skewY(-45deg) scale(0.707, 1.414) translate(50%); } .marker { position: relative; display: inline-block; } .marker__txt { position: relative; z-index: 2; } .marker__shape { fill: #fecf00; position: absolute; width: 100%; max-width: 240px; height: 23px; bottom: 0; left: 0; z-index: 1; } .breaker { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; height: 3px; position: relative; display: flex; align-items: flex-end; } .breaker__inner { position: relative; z-index: 1; margin: 0; height: 0; width: 100%; border: none; border-bottom: 1px solid rgba(121, 124, 139, 0.4); } .breaker::before { content: ""; position: absolute; top: 0; z-index: 2; height: 3px; width: 60px; } .breaker--black::before { background-color: #000; } .breaker--yellow::before { background-color: #fecf00; } .breaker--blue::before { background-color: #0a6db6; } .breaker--center::before { left: 50%; transform: translateX(-50%); } .breaker--center .breaker__inner { display: none; } .breaker--left::before { left: 0; } .breaker--right::before { right: 0; } .lead { max-width: 615px; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: auto; margin-right: auto; } .lead > * + * { margin-top: 25px; } .lead__txt, .lead__sub, .lead__head { text-align: center; } .lead__title { font-weight: 500; } .lead__btn { margin-top: 30px; } .lead--light .lead__title { color: #fecf00; } .lead--light .lead__head { color: #fff; } .lead--light .lead__txt { color: #fff; } .lead--light .lead__sub { color: #d4d3d8; } .lead--big .lead__txt { font-size: 42px; line-height: 54px; font-weight: 500; line-height: 54px; } .lead--wider { max-width: 310px; } .lead--wider > * + * { margin-top: 15px; } .lead--left { align-items: flex-start; } .lead--left .lead__title, .lead--left .lead__txt, .lead--left .lead__sub, .lead--left .lead__head { text-align: left; } .image { position: relative; } .image:hover .image__caption { opacity: 1; } .image__box { background-size: cover; background-position: center center; width: 100%; height: auto; max-height: 700px; -o-object-fit: cover; object-fit: cover; display: block; } @media screen and (min-width: 550px) { .image__box { position: static; } } @media screen and (min-width: 550px) { .image__box.is-mobile { display: none; } } .image__box.is-desktop { display: none; } @media screen and (min-width: 550px) { .image__box.is-desktop { display: block; } } .image__caption { position: absolute; bottom: 30px; left: 0; right: 0; margin-top: -45px; transition: opacity 0.45s ease; opacity: 0; } @media screen and (min-width: 375px) { .image__caption { margin: auto; } } .image__txt { font-size: 12px; line-height: 18px; color: #d4d3d8; display: inline-block; max-width: 320px; } .image__content { padding: 55px 24px; position: relative; text-align: center; margin: auto; width: 100%; } @media screen and (max-width: 768px) { .image__content { background: rgba(0, 0, 0, 0.5); margin: 0 !important; position: absolute; left: 0; top: 0; height: 100%; } } .image__content > * + * { margin-top: 20px; } @media screen and (min-width: 550px) { .image__content { padding: 0; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } } .image__content .txt, .image__content .urgent__body p, .urgent__body .image__content p { margin: 10px 0 15px 0; } .image__btns { display: flex; flex-flow: column wrap; justify-content: center; align-items: center; } .image__btns > * + * { margin-top: 15px; } @media screen and (min-width: 768px) { .image__btns { flex-flow: row wrap; } .image__btns > * + * { margin-top: 0; margin-left: 15px; } } .image--breaker .image__box { height: 300px; background-position: center; background-size: cover; background-blend-mode: multiply; } @media screen and (min-width: 768px) { .image--breaker .image__box { height: 365px; } } .image--light .image__txt { color: #353439; } .image--credit { position: relative; } .image--credit .image__head { text-transform: uppercase; display: inline-block; margin-bottom: 15px; } .image--credit .image__tile { padding: 40px; } .image--credit .image__caption { display: none; color: #fff; bottom: 0; left: 0; position: absolute; width: 100%; } @media screen and (min-width: 550px) { .image--credit .image__caption { display: block; } } .image--lightbox .image__caption { position: initial; width: 100%; text-align: center; } @media screen and (min-width: 768px) { .image--lightbox .image__caption { margin-top: 20px; } } @media screen and (min-width: 768px) { .image--content .image__box { max-height: 475px; } } .map { width: 100%; max-width: 1000px; height: auto; margin: 0 auto; display: block; } .hero-pagination { color: #fff; max-width: 210px; font-size: 12px; line-height: 18px; color: #adb1bc; cursor: pointer; display: flex; flex-direction: column; align-items: flex-end; } .hero-pagination:before { content: ""; display: block; top: 0; left: 0; width: 25px; height: 5px; background-color: #9294a1; } .hero-pagination.active:before { width: 60px; height: 5px; background-color: #fecf00; } .hero-pagination__content { overflow: hidden; height: 0; } .hero-pagination__txt { text-align: right; padding-top: 20px; } .txt-box h1 + p, .txt-box h2 + p { margin-top: 40px; } .txt-box h3 + p, .txt-box h4 + p, .txt-box h5 + p, .txt-box h6 + p { margin-top: 15px; } .txt-box p + p { margin-top: 30px; } .audio-player__controls { display: flex; align-items: center; } .audio-player__handler .audio-player__pause { display: none; } .audio-player__handler .audio-player__play { display: block; } .audio-player__handler.playing .audio-player__pause { display: block; } .audio-player__handler.playing .audio-player__play { display: none; } .audio-player__ico { flex: 0 1 auto; min-width: 20px; width: 20px; height: 20px; } .audio-player__slider { flex: 1 0 auto; margin-left: 20px; margin-right: 70px; height: 4px; position: relative; cursor: pointer; } .audio-player__progress { position: absolute; top: 0; left: 0; height: 100%; background-color: #fff; will-change: width; transition: width 0.15s ease; } .audio-player__volume { flex: 0 1 auto; min-width: 20px; } .audio-player__vol { display: none; } .audio-player [data-volume="0"] .audio-player__vol--mute { display: block; } .audio-player [data-volume="0.5"] .audio-player__vol--medium { display: block; } .audio-player [data-volume="1"] .audio-player__vol--high { display: block; } .audio-player__details { display: flex; justify-content: space-between; margin-top: 15px; } .audio-player__title, .audio-player__timer { font-size: 14px; line-height: 18px; letter-spacing: 0.5px; } .audio-player--dark .audio-player__ico { fill: #353439; } .audio-player--dark .audio-player__slider { background-color: #fff; } .audio-player--dark .audio-player__progress { background-color: #353439; } .audio-player--dark .audio-player__title, .audio-player--dark .audio-player__timer { color: #353439; } .audio-player--light .audio-player__ico { fill: #353439; } .audio-player--light .audio-player__slider { background-color: #4b4d59; } .audio-player--light .audio-player__progress { background-color: #fff; } .audio-player--light .audio-player__title, .audio-player--light .audio-player__timer { color: #9294a1; } .graph { width: 100%; } @media screen and (min-width: 768px) { .graph { max-width: 200px; width: 200px; } } .graph__head { font-size: 16px; font-weight: 500; letter-spacing: 3px; text-transform: uppercase; } .graph__progress { margin-top: 15px; } .graph__progress > * + * { margin-top: 10px; } .graph__step { display: flex; } .graph__label { font-size: 10px; letter-spacing: 1.25px; text-transform: uppercase; width: 40px; } .graph__value { font-size: 12px; font-weight: 500; letter-spacing: 1.5px; } .graph__liner { margin-top: 20px; } .graph__cta { width: 100%; min-width: 1px; margin-top: 25px; } .graph--yellow .graph__head { color: #fecf00; } .graph--yellow .graph__step { color: #f2f2f2; } .graph--yellow .ct-vertical { stroke: rgba(212, 211, 216, 0.5); stroke-dasharray: 1px 3px; } .graph--blue .graph__head { color: #0072bc; } .graph--blue .graph__step { color: #4b4d59; } .graph--blue .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--blue1 .graph__head { color: #0072bc; } .graph--blue1 .graph__step { color: #4b4d59; } .graph--blue1 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--blue2 .graph__head { color: #66aad7; } .graph--blue2 .graph__step { color: #4b4d59; } .graph--blue2 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--grey1 .graph__head { color: #f2f2f2; } .graph--grey1 .graph__step { color: #4b4d59; } .graph--grey1 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--grey2 .graph__head { color: #b2b2b2; } .graph--grey2 .graph__step { color: #4b4d59; } .graph--grey2 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--grey3 .graph__head { color: #9294a1; } .graph--grey3 .graph__step { color: #4b4d59; } .graph--grey3 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--grey4 .graph__head { color: #797c8b; } .graph--grey4 .graph__step { color: #4b4d59; } .graph--grey4 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--grey5 .graph__head { color: #4b4d59; } .graph--grey5 .graph__step { color: #4b4d59; } .graph--grey5 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--grey6 .graph__head { color: #353439; } .graph--grey6 .graph__step { color: #4b4d59; } .graph--grey6 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--yellow1 .graph__head { color: #FFD238; } .graph--yellow1 .graph__step { color: #4b4d59; } .graph--yellow1 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--yellow2 .graph__head { color: #f0dd66; } .graph--yellow2 .graph__step { color: #4b4d59; } .graph--yellow2 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--orange1 .graph__head { color: #fe7000; } .graph--orange1 .graph__step { color: #4b4d59; } .graph--orange1 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--orange2 .graph__head { color: #ff5800; } .graph--orange2 .graph__step { color: #4b4d59; } .graph--orange2 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--red1 .graph__head { color: #f44c4c; } .graph--red1 .graph__step { color: #4b4d59; } .graph--red1 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--red2 .graph__head { color: #ef3332; } .graph--red2 .graph__step { color: #4b4d59; } .graph--red2 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--green1 .graph__head { color: #39ac67; } .graph--green1 .graph__step { color: #4b4d59; } .graph--green1 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--green2 .graph__head { color: #5ecf8d; } .graph--green2 .graph__step { color: #4b4d59; } .graph--green2 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--maroon1 .graph__head { color: #920049; } .graph--maroon1 .graph__step { color: #4b4d59; } .graph--maroon1 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .graph--maroon2 .graph__head { color: #620031; } .graph--maroon2 .graph__step { color: #4b4d59; } .graph--maroon2 .ct-vertical { stroke: rgba(0, 0, 0, 0.4); stroke-dasharray: 1px 3px; } .progress-bar { position: fixed; left: 0; top: 0; display: flex; width: 100%; height: 60px; z-index: 1500; background: rgba(255, 255, 255, 0.9); box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1); transition: transform 0.45s ease, opacity 0.3s ease; transform: translateY(-105%); opacity: 0; } .progress-bar.pinned { transform: none; opacity: 1; } .progress-bar__status { width: 100%; height: 3px; border: none; background: none; position: absolute; top: 0; left: 0; /* Reset the appearance */ -webkit-appearance: none; -moz-appearance: none; appearance: none; /* Progress bar value for IE10+ */ color: #fecf00; } .progress-bar__status::-webkit-progress-bar { background-color: transparent; } .progress-bar__status::-webkit-progress-value { background-color: #fecf00; -webkit-transition: width 0.3s ease; transition: width 0.3s ease; } .progress-bar__status::-moz-progress-bar { background-color: #fecf00; -moz-transition: width 0.3s ease; transition: width 0.3s ease; } .progress-bar__content { display: flex; justify-content: space-between; align-items: center; width: 100%; height: 100%; } .progress-bar__back { display: flex; align-items: center; cursor: pointer; } .progress-bar__back:hover .progress-bar__ico { transform: translateX(-10px); } .progress-bar__back > * + * { margin-left: 10px; } .progress-bar__ico { position: relative; top: -2px; width: 24px; height: 24px; fill: #4b4d59; transition: transform 0.3s ease; } .progress-bar__txt { display: none; } @media screen and (min-width: 1024px) { .progress-bar__txt { display: block; } } .progress-bar__socials { display: none; } @media screen and (min-width: 768px) { .progress-bar__socials { display: flex; align-items: center; } .progress-bar__socials > * + * { margin-left: 20px; } } @media screen and (max-width: 768px) { .progress-bar .heading--special { overflow: hidden; margin: 0 auto; max-width: 200px; text-overflow: ellipsis; white-space: nowrap; } } .scroll-btn { width: 60px; height: 60px; border-radius: 50%; } .scroll-btn__arrow { width: 12px; height: 12px; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; animation-name: scroll; animation-fill-mode: forwards; animation-duration: 1.5s; animation-iteration-count: infinite; } .scroll-btn--dark { background-color: #353439; } .scroll-btn--dark .scroll-btn__arrow { fill: #fff; } .scroll-btn--light { background-color: #fff; box-shadow: 0 2px 30px 0 rgba(0, 0, 0, 0.2); } .scroll-btn--light .scroll-btn__arrow { fill: #353439; } @keyframes scroll { from { transform: translateY(0); } 50% { transform: translateY(10px); } to { transform: translateY(0); } } .section-heading__wrap { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; } @media screen and (min-width: 768px) { .section-heading__wrap { flex-direction: row; justify-content: space-between; text-align: left; } } .section-heading__wrap > * + * { margin-top: 15px; } @media screen and (min-width: 768px) { .section-heading__wrap > * + * { margin-top: 0; } } .section-heading__see { font-size: 14px; font-weight: bold; line-height: 18px; letter-spacing: 2px; color: #797c8b; } .section-heading--dark .section-heading__ico { fill: #fecf00; } .section-heading--light .section-heading__ico { fill: #0072bc; } .m-search { background-color: #e6f0f7; border-radius: 18px; display: flex; align-items: stretch; line-height: 1; transition: padding 0; } @media screen and (min-width: 768px) { .m-search.-opened .m-search__content { display: flex; padding-right: 13px; width: 160px; } } @media (min-width: 1200px) { .m-search.-opened .m-search__content { width: 225px; } } .m-search__content { overflow: hidden; width: 100%; align-items: center; transition: width 0.5s cubic-bezier(0.03, 0.31, 0.43, 1.51); padding-right: 10px; } @media screen and (min-width: 768px) { .m-search__content { width: 0; padding-right: 0; } } .m-search__loupe { padding: 10px; line-height: 1; font-size: 16px; cursor: pointer; } .m-search .icon { display: block; width: 1em; height: 1em; pointer-events: none; fill: #0a6db6; } .m-search__module { display: flex; align-items: center; position: relative; top: 2px; width: 100%; } .m-search__input { padding: 10px; flex: 1 1 auto; width: 100%; background: none; border: none; font-size: 12px; font-weight: 500; letter-spacing: 1.29px; color: #0a6db6; } .m-search__input::-webkit-input-placeholder, .m-search__input::-moz-placeholder, .m-search__input:-ms-input-placeholder, .m-search__input:-moz-placeholder { color: #0a6db6; text-transform: uppercase; font-weight: 500; opacity: 1; } .m-search__arrow { flex: 0 1 auto; min-width: 24px; width: 24px; height: 24px; fill: #0a6db6; } .m-search--transparent .m-search__wrap { background: rgba(255, 255, 255, 0.2); } .m-search--transparent .m-search__arrow, .m-search--transparent .m-search__loupe { fill: #fff; } .m-search--transparent .m-search__input { color: #fff; } .m-search--transparent .m-search__input::-webkit-input-placeholder, .m-search--transparent .m-search__input::-moz-placeholder, .m-search--transparent .m-search__input:-ms-input-placeholder, .m-search--transparent .m-search__input:-moz-placeholder { color: #fff; } .site-hero { position: relative; display: flex; align-items: flex-end; justify-content: center; height: 300px; padding: 30px 30px 70px; background-position: center; background-size: cover; } .site-hero:before { content: ""; display: block; position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); } .site-hero__header { position: relative; z-index: 2; } .lead-block > * + * { margin-top: 45px; } .lead-block__title { display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; } .lead-block__title > * + * { margin-top: 30px; } .lead-block__btn { display: flex; flex-direction: column; align-items: center; justify-content: center; } .lead-block__btn > * + * { margin-top: 15px; } @media screen and (min-width: 768px) { .lead-block__btn { flex-direction: row; } .lead-block__btn > * + * { margin-top: 0; margin-left: 10px; } } .lead-block--blue { background-color: rgba(81, 179, 240, 0.1); } .lead-block--wider { padding-left: 0; padding-right: 0; } .apply__item { display: flex; flex-flow: column wrap; align-items: center; justify-content: center; padding: 35px; border-radius: 0; background-color: #fff; width: 100%; } .apply__item > * + * { margin-top: 35px; } .dynamic-tabs { padding-top: 20px; padding-bottom: 20px; } @media screen and (min-width: 1024px) { .dynamic-tabs { padding-top: 40px; padding-bottom: 40px; } } .dynamic-tabs__title { margin-bottom: 2px; } @media screen and (min-width: 768px) { .dynamic-tabs__title { margin-bottom: 50px; } } .dynamic-tabs__head { display: flex; flex-direction: column; flex-wrap: wrap; justify-content: center; overflow-x: auto; cursor: pointer; } @media screen and (min-width: 550px) { .dynamic-tabs__head { flex-direction: row; } } @media screen and (min-width: 768px) { .dynamic-tabs__head { overflow: inherit; } } .dynamic-tabs__link { border-bottom: 1px solid rgba(212, 211, 216, 0.5); font-size: 14px; font-weight: 500; color: #adb1bc; letter-spacing: 1.5px; padding: 15px 25px 15px 50px; text-align: left; text-transform: uppercase; line-height: 24px; white-space: nowrap; } @media screen and (min-width: 550px) { .dynamic-tabs__link { text-align: center; padding-left: 25px; } } .dynamic-tabs__link.active { position: relative; color: #0a6db6; } .dynamic-tabs__link.active:before { content: ""; display: block; position: absolute; bottom: -1px; left: 0; height: 3px; width: 100%; background: #0a6db6; } .dynamic-tabs__body { position: relative; } .dynamic-tabs__row { justify-content: center; } .dynamic-tabs__row > * { margin-top: 2rem; justify-content: center; } .dynamic-tabs__wrap { display: none; } .dynamic-tabs__wrap.active { display: flex; flex-wrap: wrap; opacity: 1; } .dynamic-tabs__accordion { width: 100%; margin-top: 25px; } .dynamic-tabs--spacing .dynamic-tabs__body { margin-top: 35px; } .tile-img { display: block; background: #fff; border-radius: 4px; overflow: hidden; margin-bottom: 24px; transition: box-shadow 0.3s ease; } .tile-img:hover { box-shadow: 0 2px 60px 0 rgba(0, 0, 0, 0.1); } @media screen and (min-width: 1024px) { .tile-img { margin-bottom: 0; } } .tile-img__img { height: 145px; width: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; background-position: center; background-size: cover; background-color: gray; } .tile-img__img.-neverCrop { height: auto; -o-object-fit: contain; object-fit: contain; } .tile-img__img.is-desktop { display: none; } @media screen and (min-width: 550px) { .tile-img__img.is-desktop { display: block; } } .tile-img__img.is-mobile { display: block; } @media screen and (min-width: 550px) { .tile-img__img.is-mobile { display: none; } } .tile-img__content { display: flex; flex-flow: column wrap; padding: 25px; } .tile-img__content > * + * { margin-top: 30px; } @media screen and (min-width: 768px) { .tile-img__content { padding: 40px; } } @media screen and (max-width: 768px) and (max-height: 1024px) and (orientation: portrait) { .tile-img__content { padding: 20px 20px; } } .tile-img__content--map { padding: 15px; padding-top: 25px; max-width: 325px; } .tile-img__content--map .tile-img__tag { padding-top: 6px; } .tile-img__txt > * + * { margin-top: 15px; } .tile-img__tag-container { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 5px; } .tile-img__tag { display: inline-flex; align-items: center; gap: 3px; font-size: 11px; font-weight: 500; border-radius: 2px; background-color: #0a6db6; color: #fff; padding: 5px 15px; text-transform: uppercase; line-height: 1.2; } .tile-img__tag .icon { width: 1.3em; height: 1em; color: inherit; fill: currentColor; margin-bottom: 0.1em; } .tile-img--crew .tile-img__img { height: 70vw; } @media screen and (min-width: 550px) { .tile-img--crew .tile-img__img { height: 280px; } } .tile-img--crew .tile-img__content { padding: 30px 35px 25px; } .tile-img--crew .tile-img__txt > * + * { margin-top: 5px; } .tile-img--event .tile-img__img { display: flex; flex-flow: column wrap; align-items: flex-start; justify-content: flex-end; position: relative; height: 180px; padding: 30px 35px 25px; font-weight: bold; color: #fff; } .tile-img--event .tile-img__img:after { background: rgba(0, 0, 0, 0.4); bottom: 0; content: " "; height: 100%; left: 0; position: absolute; width: 100%; } .tile-img--event .tile-img__day { font-size: 32px; line-height: 26px; position: relative; z-index: 1; } .tile-img--event .tile-img__month { font-size: 14px; letter-spacing: 0.86px; line-height: 20px; position: relative; z-index: 1; } .tile-img--event .tile-img__content { padding: 30px 35px 25px; } .tile-img--event .tile-img__txt > * + * { margin-top: 5px; } .tile-img--left { text-align: left; } u.underline { text-decoration: none; } u.underline--yellow { background-image: linear-gradient(to bottom, transparent 57%, #e6c600 57%, #e6c600 82%, transparent 82%); } u.underline--blue { background-image: linear-gradient(to bottom, transparent 57%, #0072bc 57%, #0072bc 82%, transparent 82%); } .slider-big { position: relative; padding-top: 5px; padding-bottom: 5px; } .slider-big__slider { width: calc(100% - 100px); margin-left: 50px; z-index: 3; } .slider-big__nav { position: relative; z-index: 2; } .slider-big__pagination { display: flex; justify-content: center; margin-top: 30px; position: relative; z-index: 4; } .slider-big__pagination > * + * { margin-left: 15px; } .slider-big--img .slider-big__slider { width: 100%; margin-left: 0; } @media screen and (min-width: 768px) { .slider-big--img .slider-big__slider { width: calc(100% - 200px); margin-left: 100px; } } .slider-big--full .slider-big__slider { width: 100%; margin-left: 0; } .slider-big--full .slider-big__nav { z-index: 4; } .slider-big .image__content { display: flex; justify-content: center; } .lightbox-hide { display: none; } .lightbox { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 2000; display: none; justify-content: center; align-items: center; } .lightbox.active { display: flex; } .lightbox.active .lightbox__content { opacity: 1; } .lightbox__mask { position: absolute; top: 0; left: 0; background: rgba(0, 0, 0, 0.3); width: 100%; height: 100%; } .lightbox__content { position: relative; z-index: 5; display: flex; flex-flow: column wrap; justify-content: center; align-items: center; padding: 15px; width: 100%; max-width: 790px; height: auto; opacity: 0; } .lightbox__close { width: 25px; height: 25px; margin-bottom: 25px; fill: #fff; transition: transform 0.3s ease; cursor: pointer; } .lightbox__close:hover { transform: scale(0.8); } @media screen and (min-width: 1024px) { .lightbox__close { margin-bottom: 1vh; } } .lightbox__media { width: 100%; height: 0; padding-bottom: 56.25%; position: relative; } .lightbox.stick-bottom-right { display: flex; opacity: 0; visibility: hidden; transition: 0.5s ease all; } .lightbox.stick-bottom-right.active { display: flex; opacity: 1; visibility: visible; } @media screen and (min-width: 768px) { .lightbox.stick-bottom-right { align-items: flex-end; justify-content: flex-end; } .lightbox.stick-bottom-right .lightbox__close { position: absolute; top: 12px; right: 12px; width: 14px; height: 14px; z-index: 99; fill: #6e6d6d; } } @media screen and (min-width: 768px) { .lightbox.stick-bottom-right { max-width: 520px; height: auto; top: auto; left: auto; right: 0; bottom: 0; } .lightbox.stick-bottom-right .lightbox__content { max-width: 750px; padding: 0; } } @media screen and (min-width: 768px) and (max-width: 767px) { .lightbox.stick-bottom-right .lightbox__content { max-width: 440px; } } @media screen and (min-width: 768px) { .lightbox.stick-bottom-right .lightbox__media { max-width: 100%; } } @media screen and (min-width: 768px) { .lightbox.stick-bottom-right .lightbox__mask { display: none; } } .lightbox iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .jsLightboxInit { cursor: pointer; } .lightbox-content { background: #fafafa; } .article-small { display: flex; align-items: center; width: 100%; background: #fff; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12); border-radius: 0; overflow: hidden; } .article-small__img { flex: 0 1 auto; min-width: 120px; min-height: 120px; height: 100%; background-position: center; background-size: cover; } .article-small__content { height: 100%; padding: 15px; overflow: hidden; font-family: "Feijoa", "serif"; font-size: 14px; color: #353439; line-height: 22px; } .article-small__content--blue { color: #0072bc; } .article-small__date { font-size: 12px; color: #adb1bc; letter-spacing: 1.85px; line-height: 20px; display: inline-block; margin-top: 10px; } .article-small--simply { border-radius: 0; box-shadow: none; } .article-small--simply .article-small__content { padding: 5px; padding-left: 15px; font-weight: bold; } .play-btn__wrap { display: flex; align-items: center; justify-content: center; opacity: 0.6; } .play-btn:hover .play-btn__btn { animation-name: pulse; animation-duration: 2.5s; animation-iteration-count: infinite; } .play-btn__btn { fill: #fff; } .play-btn__time { font-size: 14px; color: #fff; letter-spacing: 2.62px; } .play-btn--vertically .play-btn__wrap { flex-flow: column wrap; } .play-btn--vertically .play-btn__wrap > * + * { margin-top: 20px; } .play-btn--right { display: flex; justify-content: flex-end; } .play-btn--left { display: flex; justify-content: flex-start; } .play-btn--horizontal .play-btn__wrap > * + * { margin-left: 10px; } .play-btn--small .play-btn__btn { width: 36px; height: 36px; } .play-btn--big .play-btn__btn { width: 90px; height: 90px; } .play-btn .image__content { flex-direction: column; display: flex; justify-content: center; } .play-btn--static .play-btn__wrap:hover .play-btn__btn { animation-name: none; } .breaking { padding: 15px; background-color: #fff; box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.12); } @media screen and (min-width: 768px) { .breaking { padding: 35px; } } .breaking > * + * { margin-top: 30px; } .breaking__content > * + * { margin-top: 30px; } .pad { display: inline-block; position: relative; width: 48px; height: 48px; background-color: #fff; border-radius: 50%; box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.12); border: 0; color: #0072bc; stroke: #0072bc; transition: all 0.3s ease; } .pad:hover { color: #353439; stroke: #353439; } .pad__content { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); margin: 0; color: inherit; font-weight: 500; width: 100%; text-align: center; line-height: 1; transition: all 0.3s ease; } .pad__content svg { display: block; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .pad--dots, .pad--number { display: none; } } .copyright { margin-top: 30px; } .copyright__image { display: block; max-width: 150px; float: left; margin-right: 25px; } .copyright p { margin-top: 14px; font-size: 10px; color: #4b4d59; line-height: 18px; letter-spacing: 1.3px; text-transform: uppercase; } .donation-widget { /* Convert to rem's */ /* * Floating form label * Form labels for input fields that appear over the input field. When * the latter received focus, the label shrinks and moves above the input. */ /* .combined-fields { display: flex; .combined-field1 { border-top-right-radius: 0; border-bottom-right-radius: 0; } .combined-field2 { border-top-left-radius: 0; border-bottom-left-radius: 0; border-left: 0; } } */ /* .input-group { display: flex; flex-flow: row nowrap; align-items: stretch; min-height: $field-height; .input-group__label { flex: 0 1 auto; display: flex; align-items: center; padding: 0 1em; line-height: 1; font-size: rem(24); font-weight: 500; color: $c_grey_2; border: 1px solid $c_grey_3; border-right: none; border-radius: 5px; border-top-right-radius: 0; border-bottom-right-radius: 0; } .input-group__field { flex: 0 1 auto; border-radius: 5px; border-top-left-radius: 0; border-bottom-left-radius: 0; height: 100%; padding: 0 1em; font-size: rem(24); font-weight: 500; color: $c_grey_2; } } @supports(display: grid) { .input-group { display: grid; grid-template-columns: auto 1fr; grid-template-rows: $field-height auto; grid-template-areas: "label field" ". error"; .input-group__label { grid-area: label; } .input-group__field { grid-area: field; } label.error { grid-area: error; } } } */ } .donation-widget * { box-sizing: border-box; } .donation-widget html { font-family: "Reader", Helvetica, Arial, sans-serif; font-size: 1rem; line-height: 2rem; letter-spacing: 0.2px; color: #4b4d59; } .donation-widget h1, .donation-widget h2, .donation-widget h3, .donation-widget h4, .donation-widget h5, .donation-widget h6, .donation-widget p, .donation-widget li, .donation-widget ul, .donation-widget input, .donation-widget label, .donation-widget textarea, .donation-widget a, .donation-widget ol, .donation-widget div, .donation-widget span, .donation-widget button { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004); text-rendering: optimizeLegibility !important; } .donation-widget h1, .donation-widget h2, .donation-widget h3, .donation-widget h4, .donation-widget h5, .donation-widget h6 { margin: 0; color: #353439; } .donation-widget h1 { font-weight: 500; font-size: 4.375rem; line-height: 1.0526315789; letter-spacing: 0; } .donation-widget h2 { font-weight: 500; font-size: 1.625rem; line-height: 1.1111111111; letter-spacing: 0.5px; } .donation-widget h3 { font-weight: 500; font-size: 1.25rem; line-height: 1.25; letter-spacing: 0.35px; } .donation-widget h4 { font-weight: 400; font-size: 1.125rem; line-height: 1.4782608696; letter-spacing: 1px; } .donation-widget h5 { font-weight: 500; font-size: 1.125rem; line-height: 1.2; letter-spacing: 0.5px; } .donation-widget h6 { font-weight: 500; font-size: 1rem; line-height: 1.1875; letter-spacing: 3px; text-transform: uppercase; } .donation-widget a { color: #0079c1; } .donation-widget figure { margin: 0; } @media (min-width: 640px) { .donation-widget h1 { font-size: 4.75rem; } .donation-widget h2 { font-size: 2rem; } .donation-widget h3 { font-size: 1.5rem; } .donation-widget h4 { font-size: 1.4375rem; } .donation-widget h5 { font-size: 1.25rem; } .donation-widget h6 { font-size: 1rem; } } .donation-widget label { display: block; font-weight: 500; font-size: 0.8125rem; letter-spacing: 1.8px; text-transform: uppercase; color: #acb1bb; line-height: 1em; } .donation-widget .-rel { position: relative; } .donation-widget #card-errors { line-height: 1em; } .donation-widget label.error, .donation-widget #card-errors.error { position: absolute; bottom: -1.115rem; text-transform: none; letter-spacing: 0.5px; color: #f44c4c; padding: 0; font-size: 13px; font-weight: 500; } .donation-widget #card-errors.error { display: none; } .donation-widget #card-element.StripeElement--invalid { border-color: #f44c4c; } .donation-widget #card-element.StripeElement--invalid ~ #card-errors.error { display: block; } .donation-widget #card-element.StripeElement--invalid ~ label { color: #f44c4c; } .donation-widget input[type=checkbox], .donation-widget input[type=radio] { width: 1rem; height: 1rem; border: 1px solid #979797; background: #fff; } .donation-widget input[type=checkbox] + label, .donation-widget input[type=radio] + label { display: inline-block; font-weight: normal; cursor: pointer; text-transform: none; font-size: 1.125rem; color: #4b4d59; letter-spacing: 0.75px; } .donation-widget input[type=checkbox] { border-radius: 2px; } .donation-widget input[type=radio] { border-radius: 1rem; } .donation-widget #card-element, .donation-widget input[type=text], .donation-widget input[type=password], .donation-widget input[type=date], .donation-widget input[type=datetime], .donation-widget input[type=datetime-local], .donation-widget input[type=month], .donation-widget input[type=week], .donation-widget input[type=email], .donation-widget input[type=number], .donation-widget input[type=search], .donation-widget input[type=tel], .donation-widget input[type=time], .donation-widget input[type=url], .donation-widget textarea { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; border-bottom: 1px solid #d4d3d8; padding: 4px 0; display: block; width: 100%; background: white; height: 1.5em; font-size: 1em; line-height: 22px; border-radius: 0; transition: 0.3s ease all; } .donation-widget #card-element::-moz-placeholder, .donation-widget input[type=text]::-moz-placeholder, .donation-widget input[type=password]::-moz-placeholder, .donation-widget input[type=date]::-moz-placeholder, .donation-widget input[type=datetime]::-moz-placeholder, .donation-widget input[type=datetime-local]::-moz-placeholder, .donation-widget input[type=month]::-moz-placeholder, .donation-widget input[type=week]::-moz-placeholder, .donation-widget input[type=email]::-moz-placeholder, .donation-widget input[type=number]::-moz-placeholder, .donation-widget input[type=search]::-moz-placeholder, .donation-widget input[type=tel]::-moz-placeholder, .donation-widget input[type=time]::-moz-placeholder, .donation-widget input[type=url]::-moz-placeholder, .donation-widget textarea::-moz-placeholder { color: #d4d3d8; } .donation-widget #card-element::placeholder, .donation-widget input[type=text]::placeholder, .donation-widget input[type=password]::placeholder, .donation-widget input[type=date]::placeholder, .donation-widget input[type=datetime]::placeholder, .donation-widget input[type=datetime-local]::placeholder, .donation-widget input[type=month]::placeholder, .donation-widget input[type=week]::placeholder, .donation-widget input[type=email]::placeholder, .donation-widget input[type=number]::placeholder, .donation-widget input[type=search]::placeholder, .donation-widget input[type=tel]::placeholder, .donation-widget input[type=time]::placeholder, .donation-widget input[type=url]::placeholder, .donation-widget textarea::placeholder { color: #d4d3d8; } .donation-widget #card-element:focus, .donation-widget input[type=text]:focus, .donation-widget input[type=password]:focus, .donation-widget input[type=date]:focus, .donation-widget input[type=datetime]:focus, .donation-widget input[type=datetime-local]:focus, .donation-widget input[type=month]:focus, .donation-widget input[type=week]:focus, .donation-widget input[type=email]:focus, .donation-widget input[type=number]:focus, .donation-widget input[type=search]:focus, .donation-widget input[type=tel]:focus, .donation-widget input[type=time]:focus, .donation-widget input[type=url]:focus, .donation-widget textarea:focus { outline: none; border-color: #0079c1; } .donation-widget #card-element:focus + label, .donation-widget input[type=text]:focus + label, .donation-widget input[type=password]:focus + label, .donation-widget input[type=date]:focus + label, .donation-widget input[type=datetime]:focus + label, .donation-widget input[type=datetime-local]:focus + label, .donation-widget input[type=month]:focus + label, .donation-widget input[type=week]:focus + label, .donation-widget input[type=email]:focus + label, .donation-widget input[type=number]:focus + label, .donation-widget input[type=search]:focus + label, .donation-widget input[type=tel]:focus + label, .donation-widget input[type=time]:focus + label, .donation-widget input[type=url]:focus + label, .donation-widget textarea:focus + label { color: #0079c1; } .donation-widget #card-element.error, .donation-widget input[type=text].error, .donation-widget input[type=password].error, .donation-widget input[type=date].error, .donation-widget input[type=datetime].error, .donation-widget input[type=datetime-local].error, .donation-widget input[type=month].error, .donation-widget input[type=week].error, .donation-widget input[type=email].error, .donation-widget input[type=number].error, .donation-widget input[type=search].error, .donation-widget input[type=tel].error, .donation-widget input[type=time].error, .donation-widget input[type=url].error, .donation-widget textarea.error { border-color: #f44c4c; color: #f44c4c; } .donation-widget #card-element.error ~ label, .donation-widget input[type=text].error ~ label, .donation-widget input[type=password].error ~ label, .donation-widget input[type=date].error ~ label, .donation-widget input[type=datetime].error ~ label, .donation-widget input[type=datetime-local].error ~ label, .donation-widget input[type=month].error ~ label, .donation-widget input[type=week].error ~ label, .donation-widget input[type=email].error ~ label, .donation-widget input[type=number].error ~ label, .donation-widget input[type=search].error ~ label, .donation-widget input[type=tel].error ~ label, .donation-widget input[type=time].error ~ label, .donation-widget input[type=url].error ~ label, .donation-widget textarea.error ~ label { color: #f44c4c; } .donation-widget #card-element.has-possible-typo, .donation-widget input[type=text].has-possible-typo, .donation-widget input[type=password].has-possible-typo, .donation-widget input[type=date].has-possible-typo, .donation-widget input[type=datetime].has-possible-typo, .donation-widget input[type=datetime-local].has-possible-typo, .donation-widget input[type=month].has-possible-typo, .donation-widget input[type=week].has-possible-typo, .donation-widget input[type=email].has-possible-typo, .donation-widget input[type=number].has-possible-typo, .donation-widget input[type=search].has-possible-typo, .donation-widget input[type=tel].has-possible-typo, .donation-widget input[type=time].has-possible-typo, .donation-widget input[type=url].has-possible-typo, .donation-widget textarea.has-possible-typo { border-color: #fe7000; color: #fe7000; } .donation-widget #card-element.has-possible-typo ~ label, .donation-widget input[type=text].has-possible-typo ~ label, .donation-widget input[type=password].has-possible-typo ~ label, .donation-widget input[type=date].has-possible-typo ~ label, .donation-widget input[type=datetime].has-possible-typo ~ label, .donation-widget input[type=datetime-local].has-possible-typo ~ label, .donation-widget input[type=month].has-possible-typo ~ label, .donation-widget input[type=week].has-possible-typo ~ label, .donation-widget input[type=email].has-possible-typo ~ label, .donation-widget input[type=number].has-possible-typo ~ label, .donation-widget input[type=search].has-possible-typo ~ label, .donation-widget input[type=tel].has-possible-typo ~ label, .donation-widget input[type=time].has-possible-typo ~ label, .donation-widget input[type=url].has-possible-typo ~ label, .donation-widget textarea.has-possible-typo ~ label { color: #fe7000; } .donation-widget :-ms-input-placeholder { color: #d4d3d8 !important; } .donation-widget #card-element { height: auto; } .donation-widget [type=submit], .donation-widget [type=reset] { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; border-radius: 3px; padding: 6px 15px; background-color: #0079c1; color: #fff; cursor: pointer; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15em; transition: 0.2s ease all; } .donation-widget [type=submit]:hover, .donation-widget [type=submit]:focus, .donation-widget [type=reset]:hover, .donation-widget [type=reset]:focus { background-color: #0086d5; } .donation-widget select { border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-bottom: 1px solid #d4d3d8; border-radius: 0; padding: 4px 24px 3px 0; display: block; width: 100%; background: white; font-size: 16px; line-height: 1; background-image: url("data:image/svg+xml;utf8,"); background-position: right 0 top 50%; background-repeat: no-repeat; } .donation-widget select::-ms-expand { display: none; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .donation-widget select { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAKAgMAAAAWdexqAAAADFBMVEX////U1NfV1djU09gVz+pAAAAABHRSTlMBU535ZVsv+QAAADVJREFUCB1jEGBgEGDYwQBE+xiYfjDoO7A/YOC+IN/AwPyhnoGB4e8fIFH/BUjIXwASbA4MADKMDCx1GclSAAAAAElFTkSuQmCC"); background-size: 15px 10px; } } .donation-widget select:focus { outline: none; border-color: #0079c1; background-image: url("data:image/svg+xml;utf8,"); } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .donation-widget select:focus { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA8AAAAKBAMAAACZNRnKAAAAElBMVEUAAP8AecIAesEAeMEAecEAecFiWicxAAAABnRSTlMBO2Kd0v7+5DEOAAAAQUlEQVQIHQXBsRGAIBAAsAgOQEPPnWdPwwAW9KL+/quYSCAxOsxuPMjR5WicL+aSomOPUj/Y4po3qBEFpFiAo+EHWuMHs0loNDwAAAAASUVORK5CYII="); } } .donation-widget select:focus + label { color: #0079c1; } .donation-widget select.error { border-color: #f44c4c; color: #f44c4c; background-image: url("data:image/svg+xml;utf8,"); } .donation-widget select.error ~ label { color: #f44c4c; } .donation-widget input[readonly], .donation-widget select[readonly], .donation-widget textarea[readonly] { background-color: #ddd; color: #777; } .donation-widget input[readonly].jsClickToEdit, .donation-widget select[readonly].jsClickToEdit, .donation-widget textarea[readonly].jsClickToEdit { cursor: pointer; } .donation-widget fieldset { border: 1px dotted #aaa; } .donation-widget fieldset legend { padding: 0 10px; } .donation-widget .button-group { margin-bottom: 0.75em; } .donation-widget .subscription-items { margin-bottom: 1.5rem; padding-left: 0.5rem; } .donation-widget .subscription-items .subscription-item { list-style-type: none; margin-bottom: 0.5rem; } .donation-widget .subscription-items .subscription-item input[type=radio] { position: relative; top: -2px; margin-right: 0.5rem; } .donation-widget body { display: flex; flex-flow: column nowrap; min-height: 100vh; background-color: #345; background: #ddd no-repeat 50% 50%; background-size: cover; align-items: stretch; height: 100%; } .donation-widget .site-header { width: 100%; } .donation-widget .site-wrapper { flex: 1 0 auto; padding-top: 100px; padding-bottom: 20px; padding-bottom: 0; background: transparent no-repeat 50% 50%; background-size: cover; background-position: top 25% left 50%; } .donation-widget .site-main { display: flex; flex-flow: column nowrap; justify-content: center; } .donation-widget .content-width { width: 100%; max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 20px; padding-right: 20px; } @media (max-width: 639px) { .donation-widget .content-width { margin-bottom: 20px; } } @media (min-width: 640px) { .donation-widget .site-wrapper { padding-top: 143px; padding-bottom: 50px; min-height: 1024px; } .donation-widget .content-width { padding-left: 10px; padding-right: 10px; } } .donation-widget .site-header { color: #fff; padding-top: 10px; padding-bottom: 10px; position: absolute; } .donation-widget .site-header.header-color--light-bg { color: #000; } .donation-widget .site-header.header-color--dark-bg { color: #fff; } .donation-widget .site-header .content-width { display: flex; flex-flow: row nowrap; justify-content: center; } .donation-widget .site-header .site-header__logo { line-height: 0; color: currentColor; } .donation-widget .site-header .site-header__logo .logo { width: 100px; height: 160px; fill: currentColor; max-height: 80px; } @media (min-width: 640px) { .donation-widget .site-header { padding-top: 25px; padding-bottom: 0; } .donation-widget .site-header .content-width { justify-content: flex-start; } .donation-widget .site-header .site-header__logo .logo { max-height: 98px; } } .donation-widget .o-footer { background-color: #fff; } .donation-widget .o-footer__content { grid-area: content; display: grid; grid-gap: 24px; grid-template-areas: "logo" "copyright" "accred" "bankdetails"; text-align: center; padding: 60px 24px; max-width: 1200px; margin-left: auto; margin-right: auto; } @media (min-width: 550px) { .donation-widget .o-footer__content { grid-template-areas: "logo copyright" "accred bankdetails"; } } @media (min-width: 768px) { .donation-widget .o-footer__content { grid-template-columns: min-content 1fr min-content 1fr; grid-template-areas: "logo copyright accred bankdetails"; align-self: end; } } .donation-widget .o-footer__content .-finePrint { font-size: 10px; color: #4b4d59; line-height: 18px; letter-spacing: 1.3px; text-transform: uppercase; } .donation-widget .o-footer__content .-finePrint p + p { margin-top: 5px; } .donation-widget .o-footer__content .-finePrint a { text-decoration: underline; } .donation-widget .o-footer__logo { grid-area: logo; display: grid; place-items: center; } .donation-widget .o-footer__logo a { color: inherit; } @media (min-width: 550px) { .donation-widget .o-footer__logo { justify-items: end; } } @media (min-width: 768px) { .donation-widget .o-footer__logo { justify-items: start; } } .donation-widget .o-footer__copyright { grid-area: copyright; align-self: center; } @media (min-width: 550px) { .donation-widget .o-footer__copyright { text-align: left; } } .donation-widget .o-footer__accreditations { grid-area: accred; display: grid; place-items: center; } .donation-widget .o-footer__accreditations a { display: block; } .donation-widget .o-footer__accreditations .icon-dzi { display: block; height: 100px; width: 66px; } @media (min-width: 550px) { .donation-widget .o-footer__accreditations { justify-items: end; } } @media (min-width: 768px) { .donation-widget .o-footer__accreditations { justify-items: start; } } .donation-widget .o-footer__bank-details { grid-area: bankdetails; align-self: center; } @media (min-width: 550px) { .donation-widget .o-footer__bank-details { text-align: left; } } .donation-widget .icon { display: inline-block; width: 1em; height: 1em; color: currentColor; fill: currentColor; } .donation-widget .field { display: flex; flex-flow: column-reverse nowrap; justify-content: flex-end; } .donation-widget .field--row { margin: 0 -10px; } .donation-widget .field--col { margin: 1.5em 10px 0; display: flex; flex-flow: column-reverse nowrap; justify-content: flex-end; } .donation-widget .field { position: relative; margin: 1.25rem 0 0; } .donation-widget .field.checkbox-radio-inputs { display: flex; flex-flow: row wrap; align-items: center; line-height: 1.3; } .donation-widget .field.checkbox-radio-inputs [type=checkbox], .donation-widget .field.checkbox-radio-inputs [type=radio] { flex: 0 1 10%; margin-right: 0.5em; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .donation-widget .field.checkbox-radio-inputs [type=checkbox], .donation-widget .field.checkbox-radio-inputs [type=radio] { margin-right: 0; } } .donation-widget .field.checkbox-radio-inputs label { flex: 0 1 90%; font-size: 1rem; } @supports (display: grid) { .donation-widget .field.checkbox-radio-inputs { display: grid; grid-template-columns: auto 1fr; } .donation-widget .field.checkbox-radio-inputs [type=checkbox], .donation-widget .field.checkbox-radio-inputs [type=radio] { grid-column: 1/2; align-self: start; } .donation-widget .field.checkbox-radio-inputs label { grid-column: 2/3; } } @media (min-width: 640px) { .donation-widget .field { margin: 1.75rem 0 0; } .donation-widget .field--row { display: flex; } .donation-widget .field--col { margin: 1.75em 10px 0; } .donation-widget .field--1 { width: 100%; } .donation-widget .field--1-2 { width: 50%; } .donation-widget .field--1-3 { width: 33.3%; } .donation-widget .field--2-3 { width: 66.6%; } .donation-widget .field.checkbox-radio-inputs { margin-top: 1.75rem; } } .donation-widget .radio-button-tabs { display: flex; flex-flow: row nowrap; align-items: stretch; justify-content: flex-start; font-size: 0.8125em; color: #ADB1BC; text-transform: uppercase; text-align: center; border-bottom: 1px solid #d4d3d8; margin: 5px 0 25px; } .donation-widget .radio-button-tabs input[type=radio] { display: none; } .donation-widget .radio-button-tabs input[type=radio]:checked + label { color: #0A6DB6; border-bottom-color: #0079c1; } .donation-widget .radio-button-tabs input[type=radio] + label { font-weight: 500; } .donation-widget .radio-button-tabs input[type=radio] + label, .donation-widget .radio-button-tabs .tab--static { flex: 1 1 0; line-height: 18px; margin-bottom: -1px; padding-bottom: 5px; border-bottom: 3px solid transparent; transition: 0.3s ease all; text-transform: uppercase; font-size: 0.75rem; color: #ADB1BC; letter-spacing: 0.09375rem; } .donation-widget .radio-button-tabs input[type=radio] + label .icon, .donation-widget .radio-button-tabs .tab--static .icon { width: 16px; height: 18px; color: inherit; fill: #d7d7d8; vertical-align: top; margin-top: -0.1em; margin-left: 0.5em; transition: 0.3s ease fill; } .donation-widget .radio-button-tabs label { cursor: pointer; transition: 0.3s ease all; } .donation-widget .radio-button-tabs label:hover, .donation-widget .radio-button-tabs label:focus { border-bottom-color: rgba(0, 121, 193, 0.2); } .donation-widget .radio-button-tabs .tab--static { font-weight: 500; color: inherit; font-size: 0.875rem; } .donation-widget .radio-button-tabs .extra-text { display: none; } @media (min-width: 400px) { .donation-widget .radio-button-tabs .extra-text { display: inline; } } @media (min-width: 640px) { .donation-widget .radio-button-tabs { margin: 0 0 30px; font-size: 0.875em; } .donation-widget .radio-button-tabs input[type=radio] + label, .donation-widget .radio-button-tabs .tab--static { font-size: 0.875rem; padding-bottom: 10px; } .donation-widget .radio-button-tabs .tab--static { font-size: 0.875rem; } .donation-widget .radio-button-tabs .tab--static .icon { width: 21px; height: 24px; } } .donation-widget .donation-form__heading { font-weight: 500; margin-bottom: 0; font-size: 1.25rem; line-height: 1.15; letter-spacing: 0.35px; } .donation-widget .donation-form__content { color: #4b4d59; } .donation-widget .donation-form__content p { font-size: 0.95em; line-height: 1.5; margin: 0; } .donation-widget .donation-form__content p + p { margin-top: 0.5em; } @media (min-width: 640px) { .donation-widget .form-heading { margin: 0 0; } .donation-widget .donation-form__heading { font-size: 1.5rem; margin-bottom: 10px; } .donation-widget .donation-form__content p { font-size: 0.95em; } .donation-widget .donation-form__content p + p { margin-top: 1em; } } .donation-widget .button { position: relative; display: inline-block; -webkit-appearance: none; -moz-appearance: none; appearance: none; text-decoration: none; text-align: center; border: none; border-radius: 0; padding: 16px 30px; background-color: #0079c1; color: #fff; cursor: pointer; font-size: 0.8125rem; line-height: 1.2308; font-weight: 600; text-transform: uppercase; letter-spacing: 2px; transition: 0.3s ease all; min-width: 170px; overflow: hidden; padding: 14px 30px; } .donation-widget .button::before { content: ""; display: block; position: absolute; top: 0; right: 100%; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.1); z-index: 1; transition: right 0.4s ease; pointer-events: none; } .donation-widget .button:hover, .donation-widget .button:focus { background-color: #0086d5; } .donation-widget .button:hover::before, .donation-widget .button:focus::before { right: 0; } .donation-widget .button[disabled] { opacity: 0.5; cursor: not-allowed; color: rgba(255, 255, 255, 0.5); } .donation-widget .button.red { background-color: #f44c4c; } .donation-widget .button.orange { background-color: #fe7000; } .donation-widget .button.hollow { background-color: transparent; border: 2px solid #0079c1; padding: 14px 28px; color: #0079c1; } .donation-widget .button.hollow:hover { background-color: #0079c1; color: #fff; } .donation-widget .button.hollow.red { border-color: #f44c4c; color: #f44c4c; } .donation-widget .button.hollow.orange { border-color: #fe7000; color: #fe7000; } .donation-widget .button.center { display: inline-block; margin-left: auto; margin-right: auto; } .donation-widget .button.button--donate { background-color: #f44c4c; } .donation-widget .button.button--donate:hover, .donation-widget .button.button--donate:focus { background-color: #f55f5f; } .donation-widget .button.button--donate.hollow { border: 2px solid #f44c4c; color: #f44c4c; } .donation-widget .button.button--donate.hollow:hover { background-color: #f44c4c; } .donation-widget .button.submit { display: inline-flex; align-items: center; justify-content: center; } .donation-widget .button.submit.processing::after { content: ""; position: absolute; right: 1em; width: 2em; height: 2em; border: 3px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: spin 1s linear infinite; } .donation-widget .button .icon { vertical-align: -5px; width: 1.5em; height: 1.25em; } .donation-widget .button .icon--pre { margin-right: 1em; } .donation-widget .button .icon--post { margin-left: 1em; } @media (min-width: 640px) { .donation-widget .button { padding: 16px 30px; } } @keyframes spin { 100% { transform: rotateZ(360deg); } } .donation-widget .amt-opts { position: relative; } .donation-widget .amt-opts__annually { position: absolute; top: 0; left: 0; width: 100%; } .donation-widget .radio-group { margin-top: 1.5em; } .donation-widget .payment-method-desc { line-height: 1; font-size: 16px; color: #797c8b; } .donation-widget .donation-form .radio-group p.payment-method-desc { margin-top: 0.25em; margin-bottom: 0; } .donation-widget .checkbox-transaction-fees { margin-left: 10px; } .donation-widget .button-group { display: flex; flex-flow: row wrap; align-items: center; margin: 0 -5px; } .donation-widget .button-group.-gap { gap: 5px; } .donation-widget .button-group.-rev { flex-direction: row-reverse; } .donation-widget .button-group.-nowrap { flex-wrap: nowrap; } .donation-widget .button-group.footer { margin-top: 1.25rem; width: 100%; } .donation-widget .button-group.expanded { align-items: stretch; } .donation-widget .button-group.left { justify-content: flex-start; } .donation-widget .button-group.center { justify-content: center; } .donation-widget .button-group.right { justify-content: flex-end; } .donation-widget .button-group .button { flex: 1 1 auto; margin: 0 5px; order: 1; } .donation-widget .button-group .button.hollow { order: 2; } @media (min-width: 640px) { .donation-widget .button-group { justify-content: space-around; } .donation-widget .button-group.footer { margin-top: 1.75rem; } .donation-widget .button-group.expanded .button { flex: 1 1 0; } .donation-widget .button-group .button { flex: 0 1 auto; /* margin: 0 10px; + .button { margin-top: 0; // margin-left: 10px; } */ } } .donation-widget .donation-form { position: relative; background-color: white; width: 100%; max-width: 540px; color: #4b4d59; } .donation-widget .donation-form.left { align-self: flex-start; } .donation-widget .donation-form.center { align-self: center; } .donation-widget .donation-form.right { align-self: flex-end; } .donation-widget .donation-form__content { font-size: 1.125rem; } .donation-widget .donation-form .form-page { padding: 5.5vw 6.25vw; } @media (min-width: 640px) { .donation-widget .donation-form .form-page { padding: 45px 40px; } } .donation-widget .donation-form .field.checkbox-radio-inputs { margin-top: 0; margin-bottom: 0; } .donation-widget #form-page--3 .jsPrevPage { float: left; } .donation-widget #stripe-captcha, .donation-widget #plaid-captcha { opacity: 0; height: 0; } .donation-widget .field, .donation-widget .field--col { position: relative; } .donation-widget .form-page:target { animation: highlight 5s ease; } .donation-widget .form-page.inactive { display: none; } .donation-widget .form-page .active { display: block; } .donation-widget .form-page #form-page--4 { min-height: 480px; } .donation-widget .form-nav { margin-top: 1em; } @keyframes highlight { 0% { background-color: rgba(255, 255, 0, 0.5); } 50% { background-color: rgba(255, 255, 0, 0.5); } 100% { background-color: rgba(255, 255, 0, 0); } } .donation-widget .required label:not([class=error])::after { content: "*"; } .donation-widget .label--float { display: flex; flex-flow: column-reverse nowrap; justify-content: flex-end; } .donation-widget .label--float input, .donation-widget .label--float label:not([class=error]), .donation-widget .label--float textarea { line-height: 1; transition: all 0.2s; } .donation-widget .label--float label:not([class=error]) { order: 3; } .donation-widget .label--float label.error { order: 1; } .donation-widget .label--float input, .donation-widget .label--float textarea { order: 2; font-size: 16px; padding: 0 0 0; } .donation-widget .label--float label:not([class=error]) { font-size: 13px; } .donation-widget .label--float input:-moz-placeholder-shown + label:not([class=error]), .donation-widget .label--float textarea:-moz-placeholder-shown + label:not([class=error]) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; transform-origin: left bottom; transform: translate(0, 16px); } .donation-widget .label--float input:placeholder-shown + label:not([class=error]), .donation-widget .label--float textarea:placeholder-shown + label:not([class=error]) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pointer-events: none; transform-origin: left bottom; transform: translate(0, 16px); } .donation-widget .label--float ::-moz-placeholder { opacity: 0; -moz-transition: inherit; transition: inherit; } .donation-widget .label--float ::placeholder { opacity: 0; transition: inherit; } .donation-widget .label--float input:focus::-moz-placeholder, .donation-widget .label--float textarea:focus::-moz-placeholder { opacity: 1; } .donation-widget .label--float input:focus::placeholder, .donation-widget .label--float textarea:focus::placeholder { opacity: 1; } .donation-widget .label--float input:not(:-moz-placeholder-shown) + label:not([class=error]), .donation-widget .label--float textarea:not(:-moz-placeholder-shown) + label:not([class=error]) { transform: translate(0, -0.25em) scale(1); cursor: pointer; pointer-events: auto; } .donation-widget .label--float input:not(:placeholder-shown) + label:not([class=error]), .donation-widget .label--float input:focus + label:not([class=error]), .donation-widget .label--float textarea:not(:placeholder-shown) + label:not([class=error]), .donation-widget .label--float textarea:focus + label:not([class=error]) { transform: translate(0, -0.25em) scale(1); cursor: pointer; pointer-events: auto; } .donation-widget .jsAchPopup { display: none; } .donation-widget .jsAchPopup.active { display: block; } .donation-widget #card-element { background-color: #fff; } .donation-widget .update-types { margin-top: 1em; margin-left: 2em; border-radius: 3px; background-color: #edecef; padding: 1em; } .donation-widget .update-types > *:first-child { margin-top: 0; } .donation-widget .update-types > *:last-child { margin-bottom: 0; } .donation-widget .label--amount { font-weight: 500; letter-spacing: 1px; font-size: 0.9375rem; margin: 0 0 1em; color: #4b4d59; text-transform: none; } .donation-widget .button--amount { padding: 13px 10px; margin: 5px; min-width: 0; box-shadow: 0 2px 2px rgba(0, 0, 0, 0.12); background-color: #fff; color: #0A6DB6; border: 2px solid transparent; font-size: 1rem; font-weight: 500; letter-spacing: 0.109375rem; } .donation-widget .button--amount::before { content: none; } .donation-widget .button--amount.selected, .donation-widget .button--amount:focus, .donation-widget .button--amount:hover { background-color: rgba(10, 109, 182, 0.12); border-color: #0A6DB6; } .donation-widget .amount-field { position: relative; display: flex; flex-flow: row nowrap; align-items: stretch; min-height: 48px; } .donation-widget .amount-field .amount-field__currency { flex: 0 1 auto; display: flex; align-items: center; padding: 0 1em; line-height: 1; font-size: 1.25rem; font-weight: 400; color: #acb1bb; border: 1px solid #979797; border-left: none; border-top-left-radius: 0; border-bottom-left-radius: 0; } .donation-widget .amount-field .amount-field__input { flex: 0 1 auto; border: 1px solid #979797; border-top-left-radius: 0; border-bottom-left-radius: 0; height: 100%; padding: 0 1em; font-size: 1.25rem; font-weight: 500; color: #4b4d59; text-align: right; } .donation-widget .cover_transaction_fees ~ label { font-size: 1rem; line-height: 1.25; } .donation-widget .cover_transaction_fees ~ label .is-checked { display: none; } .donation-widget .cover_transaction_fees ~ label .show-for-small-only { display: inline; } .donation-widget .cover_transaction_fees ~ label .show-for-medium-up { display: none; } @media (min-width: 440px) { .donation-widget .cover_transaction_fees ~ label .show-for-small-only { display: none; } .donation-widget .cover_transaction_fees ~ label .show-for-medium-up { display: inline; } } .donation-widget .transaction-fees { line-height: 1.2; margin-bottom: 0.5em; } @supports (display: grid) { .donation-widget .amount-field { display: grid; grid-template-columns: 1fr auto; grid-template-rows: 48px auto; grid-template-areas: "field currency" ". error"; } .donation-widget .amount-field .amount-field__currency { grid-area: currency; } .donation-widget .amount-field .amount-field__input { grid-area: field; } .donation-widget .amount-field label.error { grid-area: error; } } @media (min-width: 640px) { .donation-widget .label--amount { font-weight: 500; letter-spacing: 1px; font-size: 1rem; } .donation-widget .amount-field { min-height: 57px; } .donation-widget .amount-field .amount-field__prefix { font-size: 1.5rem; } .donation-widget .amount-field .amount-field__input { font-size: 1.5rem; } @supports (display: grid) { .donation-widget .amount-field { grid-template-rows: 57px auto; } } } .donation-widget .form-heading.progress-steps { max-width: 330px; margin: 0 auto; width: 100%; } .donation-widget .progress { list-style-type: none; display: flex; flex-flow: row nowrap; align-items: center; justify-content: space-between; padding: 0; margin: 0 0 30px; color: #d4d3d8; font-size: 1rem; font-weight: 500; line-height: 1.75rem; text-align: center; position: relative; counter-reset: steps; } .donation-widget .progress::before, .donation-widget .progress::after { content: ""; position: absolute; width: 100%; top: 50%; left: 0; } .donation-widget .progress::before { height: 1px; background-color: #d4d3d8; z-index: 1; } .donation-widget .progress::after { height: 2px; transform: translateY(-50%); background-image: linear-gradient(to right, transparent 0%, transparent 50%, transparent 50%); z-index: 2; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .donation-widget .progress { background-image: linear-gradient(to right, #d4d3d8 0%, #d4d3d8 50%, #d4d3d8 50%); background-position: 0% 11px; background-size: 100% 2px; background-repeat: no-repeat; } .donation-widget .progress::before, .donation-widget .progress::after { content: none; } } .donation-widget .progress .icon--check { fill: #fff; } .donation-widget .progress[data-progress="1"] li:nth-child(1) { background-color: #0A6DB6; color: white; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .donation-widget .progress[data-progress="1"] { background-image: linear-gradient(to right, #d4d3d8 0%, #d4d3d8 50%, #d4d3d8 50%); } } .donation-widget .progress[data-progress="2"]::after { background-image: linear-gradient(to right, #0079c1 0%, #0079c1 50%, transparent 50%); } .donation-widget .progress[data-progress="2"] li:nth-child(1) { background-color: #0079c1; } .donation-widget .progress[data-progress="2"] li:nth-child(1) span { display: none; } .donation-widget .progress[data-progress="2"] li:nth-child(1) .icon { display: inline-block; vertical-align: -3px; } .donation-widget .progress[data-progress="2"] li:nth-child(2) { background-color: #0A6DB6; color: white; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .donation-widget .progress[data-progress="2"] { background-image: linear-gradient(to right, #0A6DB6 0%, #0A6DB6 50%, #d4d3d8 50%); } } .donation-widget .progress[data-progress="3"]::after { background-image: linear-gradient(to right, #0079c1 0%, #0079c1 100%); } .donation-widget .progress[data-progress="3"] li:nth-child(1), .donation-widget .progress[data-progress="3"] li:nth-child(2) { color: #0079c1; } .donation-widget .progress[data-progress="3"] li:nth-child(1) span, .donation-widget .progress[data-progress="3"] li:nth-child(2) span { display: none; } .donation-widget .progress[data-progress="3"] li:nth-child(1) .icon, .donation-widget .progress[data-progress="3"] li:nth-child(2) .icon { display: inline-block; vertical-align: -3px; } .donation-widget .progress[data-progress="3"] li:nth-child(3) { background-color: #0A6DB6; color: white; } @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { .donation-widget .progress[data-progress="3"] { background-image: linear-gradient(to right, #0A6DB6 0%, #0A6DB6 50%, #0079c1 50%); } } .donation-widget .progress[data-progress=complete]::after { background-image: linear-gradient(to right, #fff 0%, #fff 100%); } .donation-widget .progress[data-progress=complete] li { color: #0079c1; } .donation-widget .progress[data-progress=complete] li span { display: none; } .donation-widget .progress[data-progress=complete] li .icon { display: inline-block; vertical-align: -3px; fill: #d4d3d8; } .donation-widget .progress li { display: flex; align-items: center; justify-content: center; position: relative; z-index: 1; width: 26px; height: 26px; background-color: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.23); border-radius: 50%; z-index: 3; } .donation-widget .progress li .icon { display: none; } .donation-widget .payment-method { padding-bottom: 1.5em; } .donation-widget .payment-method p { margin: 1em 0 0.25em; } .donation-widget .payment-method .field--radio-group { width: 100%; margin-top: 0; display: flex; flex-direction: row; justify-content: flex-start; } .donation-widget .payment-method .field--radio-group.required label:not([class=error]):after { content: ""; } .donation-widget .payment-method .input--radio { width: 24%; display: block; position: relative; } .donation-widget .payment-method .input--radio input[type=radio] { position: absolute; left: 50%; bottom: 20px; margin-left: -8px; } .donation-widget .payment-method .input--radio input[type=radio] + label { border: 2px solid #ffffff; padding-bottom: 14px; } .donation-widget .payment-method .input--radio input[type=radio]:checked + label { border-color: #0079c1; } .donation-widget .payment-method .input--radio label img { display: block; width: 100%; } .donation-widget .donation-summary p { font-size: 16px; margin-top: 0.5em; margin-bottom: 0; color: #797C8B; } .donation-widget .donation-summary__total th, .donation-widget .donation-summary__total td { border-top-color: #000; } .donation-widget .donation-summary caption { font-weight: 900; text-transform: uppercase; letter-spacing: 0.1em; color: #0079c1; } .donation-widget .donation-summary th, .donation-widget .donation-summary td { border: 1px solid #ddd; padding: 5px 10px; } .donation-widget .donation-summary th { text-align: right; width: 100%; color: #4b4d59; } .donation-widget .donation-summary td { font-weight: 900; text-align: right; padding-left: 10px; } .donation-widget .donation-summary .is-hidden { display: none; } .donation-widget .donation-note { margin-top: 0.8em; } .donation-widget .donation-note p { text-transform: uppercase; font-size: 14px; color: #ADB1BC; letter-spacing: 1.5px; font-weight: 400; text-align: left; margin-top: 0; } .donation-widget .donation-note p strong, .donation-widget .donation-note p b { font-weight: 500; } .donation-widget .email-suggestion { position: absolute; bottom: 2.5em; left: 2%; width: 96%; background-color: white; padding: 12px 15px; box-shadow: 0 4px 25px rgba(0, 0, 0, 0.23), 0 1px 4px rgba(0, 0, 0, 0.12); border-radius: 5px; border: 1px solid #bbb; z-index: 1; } .donation-widget .email-suggestion p { font-size: 14px; line-height: 1.2; margin: 0; } .donation-widget .email-suggestion::after { content: ""; position: absolute; left: 50%; bottom: -10px; transform: translateX(-50%); width: 0; height: 0; border-top: 10px solid white; border-right: 10px solid transparent; border-left: 10px solid transparent; } .donation-widget .email-suggestion__email { text-decoration: underline; color: #0079c1; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; } .donation-widget .email-suggestion__email strong { font-weight: bold; } .donation-widget .email-suggestion .icon { display: inline-block; width: 1em; height: 1em; stroke-width: 0; stroke: currentColor; fill: currentColor; } .donation-widget .email-suggestion .icon-warning { fill: #ff5800; vertical-align: -1px; } .donation-widget .email-suggestion__close { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; background-color: transparent; cursor: pointer; position: absolute; top: 0; right: 0; padding: 7px; line-height: 16px; } .donation-widget .email-suggestion__close:hover .icon { fill: #353439; } .donation-widget .email-suggestion__close .icon { fill: #d4d3d8; transition: 0.2s ease fill; } .donation-widget .alert { border: 2px solid red; background-color: #ffe6e6; color: red; padding: 1em; margin: 1em 0; } .donation-widget .alert *:first-child { margin-top: 0; } .donation-widget .alert *:last-child { margin-bottom: 0; } .donation-widget .thank-you * { text-align: center; } .donation-widget .thank-you h1, .donation-widget .thank-you p { color: white; } .donation-widget .thank-you .form__title { font-size: 3.75rem; } .donation-widget .thank-you p { font-size: 1em; line-height: 1.75; margin: 0 0 1rem; } .donation-widget .thank-you a { color: #0079c1; } .donation-widget .thank-you a.button { color: white; } .donation-widget .thank-you .columns { margin: 0 auto; } .donation-widget .thank-you .content { margin: 0 0 1.25rem; width: 100%; } .donation-widget .thank-you .social { margin: 0 0 1rem; } .donation-widget .thank-you .social .lead { width: 100%; } .donation-widget .thank-you .block--social-media { display: flex; align-items: center; flex-flow: row nowrap; justify-content: space-around; max-width: 180px; margin: 0 auto 1rem; } .donation-widget .thank-you .block--social-media a { color: #0079c1; display: flex; justify-content: center; align-items: center; width: 36px; height: 36px; background-color: white; border-radius: 50%; margin: 0 10px; } .donation-widget .thank-you .impact { margin: 0 0 1.5rem; width: 100%; text-align: center; } .donation-widget .thank-you .contact { margin: 0 0 1.5rem; } .donation-widget .thank-you .contact .columns { margin: 0 auto; } .donation-widget .thank-you .footnotes p { font-size: 0.75rem; } .donation-widget .form-page--1 .newsletter-sample { margin-left: 1.5rem; margin-top: 0.25em; } .donation-widget .form-page--2 .fieldGrid { margin-top: 1em; display: grid; gap: 1.5em 10px; grid-template-areas: "sal" "fname" "lname" "email" "phone" "country" "city" "zip" "address"; } @media (min-width: 400px) { .donation-widget .form-page--2 .fieldGrid { grid-template-areas: "sal fname fname lname lname lname" "email email email email email email" "phone phone phone phone phone phone" "country country country country country country" "city city city city zip zip" "address address address address address address"; grid-template-columns: repeat(6, 1fr); } } .donation-widget .form-page--2 .field--salutation { grid-area: sal; } .donation-widget .form-page--2 .field--first_name { grid-area: fname; } .donation-widget .form-page--2 .field--last_name { grid-area: lname; } .donation-widget .form-page--2 .field--email { grid-area: email; } .donation-widget .form-page--2 .field--phone { grid-area: phone; display: grid; grid-template-rows: auto auto; grid-template-columns: 1fr min-content; } .donation-widget .form-page--2 .field--phone input { grid-row: 2/-1; grid-column: 1/2; } .donation-widget .form-page--2 .field--phone label { grid-row: 1/2; grid-column: 1/2; } .donation-widget .form-page--2 .field--phone .fieldInfo { grid-column: 2/3; grid-row: 1/-1; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-color: transparent; border: none; padding: 10px; opacity: 0.5; cursor: pointer; transition: 0.2s ease opacity; } .donation-widget .form-page--2 .field--phone .fieldInfo:hover, .donation-widget .form-page--2 .field--phone .fieldInfo:focus { opacity: 1; } .donation-widget .form-page--2 .field--phone .fieldInfo .icon { display: block; width: 24px; height: 24px; } .donation-widget .form-page--2 .field--country { grid-area: country; } .donation-widget .form-page--2 .field--city { grid-area: city; } .donation-widget .form-page--2 .field--zip { grid-area: zip; } .donation-widget .form-page--2 .field--address { grid-area: address; } .donation-widget .form-page--2 .form__two-buttons { display: flex; gap: 5px; flex-flow: row nowrap; justify-content: space-between; margin-top: 2rem; } .donation-widget .form-page--2 .form__two-buttons .button { padding: 14px 5px; flex: 1 1 50%; min-width: unset; } .donation-widget .form-page--3 .form__two-buttons { display: flex; gap: 5px; flex-flow: row nowrap; justify-content: space-between; margin-top: 2rem; } .donation-widget .form-page--3 .form__two-buttons .button { padding: 14px 5px; flex: 1 1 50%; min-width: unset; } #ajax-response { position: absolute; top: 0; right: 0; z-index: 100; background: white; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } #ajax-loading .spinner { margin: 0 auto 0.75rem; height: 42px; width: 42px; animation: rotate 0.8s infinite linear; border: 2px solid #0072bc; border-right-color: transparent; border-radius: 50%; } @keyframes rotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } #ajax-loading .ajax-content { max-width: 380px; margin: 0 auto; } #ajax-loading .ajax-content p { margin-top: 0; } #ajax-loading h4 { color: #ADB1BC; font-size: 1.25rem; font-weight: 400; text-align: center; margin-bottom: 1.35em; } #ajax-loading p { color: #ADB1BC; font-size: 1.125rem; font-weight: 400; text-align: center; margin-bottom: 1.35em; } #ajax-loading p.quotes { font-size: 2.25rem; line-height: 1.125; } .donation-form, #payment-form { position: relative; } .loading { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: white; z-index: 100; display: flex; align-items: center; justify-content: center; } #ajax-response { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.95); z-index: 100; } #ajax-response .content { padding: 0 20px; } #ajax-message { text-align: center; margin: 0 0 1.5em; } #ajax-close a { width: 100%; text-align: center; color: #0079c1; display: block; text-decoration: underline; } .loading-icon { margin: auto; width: 20px; height: 20px; } .loading-icon .rect { background-color: #0071bd; height: 100%; width: 4px; float: left; animation: loading-rect 0.6s infinite ease-in-out; } .loading-icon .rect ~ .rect { margin-left: 4px; } .loading-icon .rect1 { animation-delay: -0.3s; } .loading-icon .rect2 { animation-delay: -0.2s; } .loading-icon .rect3 { animation-delay: -0.1s; } @keyframes loading-rect { 0%, 100% { transform: scaleY(0.2); opacity: 0.2; } 50% { transform: scaleY(1); opacity: 1; } } /** * Spinner for the Give Submit button */ /* overlay at start */ .mfp-fade { will-change: opacity; /* content at start */ } .mfp-fade.mfp-bg { opacity: 0; transition: all 0.15s ease-out; /* overlay animate in */ /* overlay animate out */ } .mfp-fade.mfp-bg.mfp-ready { opacity: 0.8; } .mfp-fade.mfp-bg.mfp-removing { opacity: 0; } .mfp-fade.mfp-wrap { will-change: opacity, transform; /* content animate in */ /* content animate out */ } .mfp-fade.mfp-wrap .mfp-content { opacity: 0; transform: scaleX(0.93) scaleY(0.93); transition: opacity 0.15s ease-out, transform 0.15s ease-out; } .mfp-fade.mfp-wrap.mfp-ready .mfp-content { opacity: 1; transform: scaleX(1) scaleY(1); } .mfp-fade.mfp-wrap.mfp-removing .mfp-content { opacity: 0; transition: opacity 0.15s ease-out, transform 0.15s ease-out; transform: scaleX(0.9) scaleY(0.9); } .mfp-wrap { cursor: pointer; } button.mfp-close { padding: 10px; width: unset; height: unset; line-height: 0; font-size: 20px; } button.mfp-close > * { pointer-events: none; } .mfp-container { display: flex; flex-flow: row nowrap; align-items: center; justify-content: center; } .mfp-content { flex: 0 1 30em; background-color: #fff; padding: 2em; font-size: 16px; line-height: 1.5; } .mfp-content main > *:first-child { margin-top: 0; } .mfp-content main > p:last-of-type { margin-bottom: 0; } .mfp-content main h1 { font-size: 2em; } .mfp-content main h2 { font-size: 1.8em; } .mfp-content main h3 { font-size: 1.6em; } .mfp-content main h4 { font-size: 1.4em; } .mfp-content main h5 { font-size: 1.2em; } .mfp-content main h6 { font-size: 1.1em; } .drawer { max-width: 580px; } .drawer--light .drawer__wrap.jsDonate { background: white; padding: 25px 30px 140px; } .drawer--light .drawer__wrap.jsDonate.complete { background: rgb(90, 125, 153); background: linear-gradient(180deg, rgb(90, 125, 153) 0%, rgb(167, 205, 224) 100%); } .drawer--light .drawer__wrap.jsDonate.complete .icon-close { fill: white; } @media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) { .drawer--light .drawer__wrap.jsDonate { padding: 40px 60px !important; } .progress-steps { display: none; } } @media only screen and (min-width: 1025px) { .drawer--light .drawer__wrap.jsDonate { padding: 80px 60px; } } #stripe-captcha, #plaid-captcha { opacity: 0; height: 0; } .cp-links { position: fixed; top: 50%; left: 5px; display: flex; flex-flow: column nowrap; align-items: flex-start; z-index: 99; } .cp-links__link { display: flex; flex-flow: row nowrap; align-items: center; padding: 5px 10px; font-size: 13px; color: #353439; border-radius: 15px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); background-color: #fafafa; margin: 5px 0; transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); white-space: nowrap; } .cp-links__link:hover, .cp-links__link:focus { box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); background-color: #fff; } .cp-links__link:hover .cp-links__text, .cp-links__link:focus .cp-links__text { max-width: 9em; margin-left: 5px; } .cp-links__text { overflow: hidden; max-width: 0; height: 16px; transition: 0.3s ease all; line-height: 16px; } .cp-links__icon { height: 16px; width: 16px; fill: currentColor; vertical-align: text-bottom; } .email-suggestion { z-index: 9999; position: absolute; bottom: calc(100% - 6px); left: 12.5px; width: 360px; max-width: 100%; background-color: white; padding: 15px 20px 15px 15px; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); border-radius: 5px; border: 1px solid #bbb; font-size: 1rem; transition: opacity 0.2s ease, visibility 0s ease 0.2s; } .email-suggestion::after { content: ""; position: absolute; left: 10%; top: 100%; width: 0; height: 0; border-top: 10px solid white; border-right: 10px solid transparent; border-left: 10px solid transparent; filter: drop-shadow(0 1px 0 #bbb); } .email-suggestion__email { text-decoration: underline; color: #0072bc; overflow-wrap: break-word; word-wrap: break-word; word-break: break-word; } .email-suggestion .icon { display: inline-block; width: 1em; height: 1em; stroke-width: 0; stroke: currentColor; fill: currentColor; } .email-suggestion .icon-warning { fill: #ff5800; vertical-align: -1px; } .email-suggestion__close { position: absolute; top: 0; right: 0; padding: 7px; line-height: 16px; } .email-suggestion__close:hover .icon { fill: #353439; } .email-suggestion__close .icon { fill: #b2b2b2; transition: 0.2s ease fill; } .has-possible-typo { border-color: #fe7000; color: #fe7000; } .has-possible-typo ~ label { color: #fe7000; } .header { position: absolute; top: 0; left: 0; width: 100%; z-index: 10; transition: background 0.45s ease; } .header.pinned { position: fixed; } @media screen and (min-width: 1024px) { .header.pinned { height: 100px; background: rgba(255, 255, 255, 0.9); box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.1); } } .header.pinned .header__logo { display: none; } @media screen and (min-width: 1024px) { .header.pinned .header__logo--alt { display: block; opacity: 1; transform: none; } } .header.pinned .header__hb > * { box-shadow: 1px 2px 6px rgba(0, 0, 0, 0.2); } .header__wrap { z-index: 2; } @media screen and (min-width: 1024px) { .header__wrap { display: flex; justify-content: space-between; align-items: center; right: 0; padding-top: 25px; padding-bottom: 20px; position: relative; } } .header__logo { margin: 30px auto 0; display: block; will-change: opacity, transform; transition: opacity 0.3s ease, transform 0.3s ease; transform-origin: left center; } @media screen and (min-width: 1024px) { .header__logo { margin: 0; will-change: height; transition: height 0.3s ease; } } .header__logo--alt { display: none; } .header__hb { position: absolute; top: 35px; left: 30px; z-index: 12; } .header__hb:focus, .header__hb:hover { outline: none; } @media screen and (min-width: 1024px) { .header__hb { display: none; } } .header__nav { position: absolute; top: 0; left: 0; height: auto; width: 100%; min-height: 100vh; z-index: 11; display: none; text-align: center; } @media screen and (min-width: 1024px) { .header__nav { text-align: initial; position: static; display: block; height: auto; width: auto; min-height: auto; } } .header__nav.active { display: block; } .header__nav-wrap { position: relative; z-index: 3; height: 100%; } .header__glass { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 2; opacity: 0; background-image: linear-gradient(-180deg, rgba(0, 0, 0, 0.25) 0%, #000000 100%); } @media screen and (min-width: 1024px) { .header__glass { display: none; } } .header-fake { height: 115px; } .header--dark { background-color: #fafafa; } .header--dark:before { background: rgba(255, 255, 255, 0.5); } .hero { position: relative; display: flex; flex-direction: column; justify-content: flex-end; margin-bottom: 0px; padding-bottom: 55px; height: calc(100vh - 60px); } @media screen and (min-width: 550px) { .hero { padding-bottom: 0; } } @media screen and (min-width: 768px) { .hero { height: calc(90vh + 100px); } } @media screen and (min-width: 1024px) { .hero { height: 700px; padding-bottom: 0; } } @media screen and (min-width: 1200px) { .hero { height: 875px; } } .hero__bcg { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; position: absolute; top: 0; left: 0; z-index: 1; background-position: center; background-size: cover; will-change: opacity; transition: opacity 0.45s ease; } .hero__lead { position: relative; z-index: 2; color: #fff; padding-top: 60px; text-align: left; } @media screen and (min-width: 768px) { .hero__lead { text-align: left; } } @media screen and (min-width: 1024px) { .hero__lead { padding-bottom: 250px; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; } } .hero__wrap--content > * + * { margin-top: 15px; } .hero__wrap--btn { display: flex; flex-direction: column; max-width: 275px; } @media screen and (min-width: 768px) { .hero__wrap--btn { flex-direction: row; align-items: center; max-width: 100%; } } .hero__wrap--btn > * + * { margin-top: 30px; } @media screen and (min-width: 768px) { .hero__wrap--btn > * + * { margin-top: 0; margin-left: 30px; } } @media screen and (min-width: 1024px) { .hero__title { display: inline-block; width: auto; margin-bottom: 27px; } } @media screen and (max-width: 400px) { .hero__title { font-size: 26px; line-height: 1.3; } } .hero__sub { line-height: 21px; color: #f2f2f2; margin-top: 10px; text-align: left; } @media screen and (min-width: 768px) { .hero__sub { font-size: 26px; line-height: 36px; letter-spacing: 0.02em; } } .hero__pagination { position: absolute; z-index: 5; right: 0; bottom: 0; padding-bottom: 25px; } @media screen and (min-width: 768px) { .hero__pagination { padding-bottom: 50px; } } @media screen and (min-width: 1024px) { .hero__pagination { padding-bottom: 185px; } } @media screen and (min-width: 1200px) { .hero__pagination { padding-bottom: 280px; } } .hero__pagination > * + * { margin-top: 25px; } .hero__pagination-wrap { position: relative; } .hero__form { display: flex; } .hero__form > * + * { margin-left: 10px; } .hero__input { width: 100%; background: none; color: #fff; border: 0; outline: 0; } .hero__input:focus { outline: 0; } .hero__scroll { display: none; position: absolute; bottom: 0px; left: 0; transform: translateY(100%); right: 0; z-index: 4; margin: 0 auto; } @media screen and (min-width: 550px) { .hero__scroll { display: block; } } .hero__footer { width: 100%; position: relative; z-index: 6; padding-bottom: 40px; } .hero__footer > * + * { margin-top: 30px; } @media screen and (min-width: 768px) { .hero__footer > * + * { margin-top: 0; } } .hero--light, .hero--dark { background: #000; overflow: hidden; } .hero--light .hero__bcg, .hero--dark .hero__bcg { left: auto; right: 0; } .hero--light .hero__bcg:before, .hero--light .hero__bcg:after, .hero--dark .hero__bcg:before, .hero--dark .hero__bcg:after { content: ""; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .hero--light .hero__bcg:before, .hero--dark .hero__bcg:before { background-image: linear-gradient(-180deg, rgba(35, 63, 86, 0) 45%, #000000 100%); } .hero--light .hero__bcg:after, .hero--dark .hero__bcg:after { background-image: linear-gradient(-90deg, rgba(0, 0, 0, 0) 100%, #000000 45%); } .hero--light .hero__wrap + .hero__wrap, .hero--dark .hero__wrap + .hero__wrap { margin-top: 25px; } @media screen and (min-width: 768px) { .hero--light .hero__wrap + .hero__wrap, .hero--dark .hero__wrap + .hero__wrap { margin-top: 45px; } } .hero--light .hero__pagination, .hero--dark .hero__pagination { display: none; } @media screen and (min-width: 550px) { .hero--light .hero__pagination, .hero--dark .hero__pagination { display: block; } } .hero--light .btn--ico, .hero--dark .btn--ico { margin-left: 20px; } @media screen and (min-width: 550px) { .hero--light .btn--ico, .hero--dark .btn--ico { margin-left: 0; } } .hero--light .hero__title span { background: #fff; display: inline; color: #222; white-space: pre-wrap; max-width: 360px; padding: 5px 5px; position: relative; } .hero--highlight-wrapper { padding-top: 200px; } .hero--highlight { height: auto; padding-bottom: 0; } .hero--highlight .hero__bcg { position: relative; width: 100%; height: 350px; } @media screen and (min-width: 550px) { .hero--highlight .hero__bcg { height: 450px; } } @media screen and (min-width: 1024px) { .hero--highlight .hero__bcg { position: absolute; width: 50%; height: 550px; right: 0; top: 0; margin-left: auto; } } @media screen and (min-width: 1200px) { .hero--highlight .hero__bcg { width: 80%; height: 625px; max-width: 715px; } } @media screen and (max-width: 768px) { .hero--highlight .hero__lead { padding-top: 45px; } } .hero--highlight .hero__head { text-align: left; } @media screen and (min-width: 550px) { .hero--highlight .hero__head { max-width: 790px; width: 80%; } } .hero--highlight .hero__title { background: #fff; display: inline; padding: 4px 0; position: relative; font-weight: bold; line-height: 1.13; font-size: min(max(30px, 4.6875vw), 60px); } body.is-windows .hero--highlight .hero__title { line-height: 1.21; } @media screen and (min-width: 1024px) { .hero--highlight .hero__title.heading--mobile { display: none; } } .hero--highlight .hero__title.heading--desktop { display: none; } @media screen and (min-width: 1024px) { .hero--highlight .hero__title.heading--desktop { display: inline; } } .hero--highlight .hero__wrap { flex-wrap: wrap; } @media screen and (min-width: 550px) { .hero--highlight .hero__wrap { position: relative; top: -70px; } } @media screen and (min-width: 1024px) { .hero--highlight .hero__wrap { top: 0; } } .hero--highlight .hero__sub { font-size: 23px; line-height: 34px; color: #353439; text-align: left; display: block; width: 100%; max-width: 430px; margin-top: 45px; padding-left: 0; } .hero--highlight .hero__cta { display: flex; flex-direction: column; flex-wrap: wrap; margin-top: 40px; } @media screen and (min-width: 375px) { .hero--highlight .hero__cta { margin-top: 0; width: 100%; } } @media screen and (min-width: 768px) { .hero--highlight .hero__cta { flex-direction: row; } } @media screen and (min-width: 1024px) { .hero--highlight .hero__cta { width: 40%; } } .hero--highlight .hero__cta > * + * { margin-top: 25px; } @media screen and (min-width: 768px) { .hero--highlight .hero__cta > * + * { margin-top: 0; margin-left: 25px; } } .hero--highlight .hero__cta .btn { flex-shrink: 0; margin-left: 0; margin-right: 25px; margin-top: 20px; box-sizing: content-box; } .hero--highlight .hero__cta .btn.btn-clean { padding: 0; } @media screen and (min-width: 1024px) { .hero--highlight .hero__lead { padding-top: 85px; } } .hero--static { overflow: inherit; } .hero--center { background: #000; padding-bottom: 0; } .hero--center .hero__lead { position: relative; z-index: 2; color: #fff; display: flex; justify-content: center; flex-direction: column; align-items: center; width: 100%; height: 100%; } @media screen and (min-width: 1024px) { .hero--center .hero__lead { justify-content: center; padding-bottom: 0; } } .hero--center .hero__wrap { text-align: center; } .hero--center .hero__wrap + .hero__wrap--btn { margin-top: 25px; } @media screen and (min-width: 768px) { .hero--center .hero__wrap--btn { justify-content: center; } } .hero--fader { margin-left: auto; margin-right: auto; } .hero--fader .hero__bcg { height: 100%; } @media screen and (min-width: 768px) { .hero--fader .hero__bcg:before { background: linear-gradient(rgba(255, 255, 255, 0.01), #fafafa); bottom: 0; content: " "; height: 50%; position: absolute; width: 100%; z-index: 0; } } @media screen and (min-width: 768px) { .hero--small { max-height: 600px; } } @media screen and (min-width: 375px) { .hero--tiny { max-height: 50vh; } } @media screen and (min-width: 550px) { .hero--tiny { max-height: 500px; } } @media screen and (min-width: 768px) { .hero--tiny { padding-top: 40px; max-height: 400px; } } @media screen and (min-width: 768px) { .hero--news { padding-bottom: 150px; } } @media screen and (min-width: 1024px) { .hero--news { padding-bottom: 0; } } .hero--news .hero__lead { padding-bottom: 30px; } .hero--news .hero__lead > * + * { margin-top: 15px; } @media screen and (min-width: 1024px) { .hero--news .hero__lead { padding-bottom: 60px; } } .hero--news .hero__pagination { padding-bottom: 160px; } @media screen and (min-width: 1024px) { .hero--news .hero__pagination { padding-bottom: 190px; } } @media screen and (min-width: 1200px) { .hero--news .hero__pagination { padding-bottom: 190px; } } .hero--news .hero__btn { margin-right: auto; } .hero--bottom .hero__lead { padding-bottom: 70px; } .hero--bottom .hero__wrap > * + * { margin-top: 15px; } .o-footer { padding-bottom: 90px; } @media screen and (min-width: 1024px) { .o-footer { padding-bottom: 0; } } .o-footer__highlight { grid-area: highlight; background-color: #FFD238; color: #353439; padding: 50px 0; font-size: 18px; line-height: 1.5; text-align: center; } .o-footer__highlight:target .o-footer__form { animation: jello-vertical 0.9s both; } /* ---------------------------------------------- * Generated by Animista on 2020-9-30 18:21:19 * Licensed under FreeBSD License. * See http://animista.net/license for more info. * w: http://animista.net, t: @cssanimista * ---------------------------------------------- */ /** * ---------------------------------------- * animation jello-vertical * ---------------------------------------- */ @keyframes jello-vertical { 0% { transform: scale3d(1, 1, 1); } 30% { transform: scale3d(0.75, 1.25, 1); } 40% { transform: scale3d(1.25, 0.75, 1); } 50% { transform: scale3d(0.85, 1.15, 1); } 65% { transform: scale3d(1.05, 0.95, 1); } 75% { transform: scale3d(0.95, 1.05, 1); } 100% { transform: scale3d(1, 1, 1); } } .o-footer__form { margin-left: auto; margin-right: auto; max-width: 640px; padding-left: 11.5px; padding-right: 11.5px; } .o-footer__form .form__footer { margin-top: 0; } .o-footer__form .form__error { min-height: unset; } .o-footer__form .form__rich-text { margin-bottom: 1em; } .o-footer__form .form__submit { width: auto; border-color: #000000; color: #000000; } .o-footer__form .form__submit:after { background-color: #fff; } .o-footer__form .form__submit:hover, .o-footer__form .form__submit:focus { color: #353439; } .o-footer__form .input { background-color: #fff; max-width: 640px; } .o-footer__form .input .input__val { padding: 5px 30px; height: 100%; border: 2px solid #fff; } .o-footer__form .input .input__val::-moz-placeholder { -moz-transition: 0.3s ease opacity; transition: 0.3s ease opacity; opacity: 0; } .o-footer__form .input .input__val::placeholder { transition: 0.3s ease opacity; opacity: 0; } .o-footer__form .input .input__val:focus::-moz-placeholder { opacity: 1; } .o-footer__form .input .input__val:focus::placeholder { opacity: 1; } .o-footer__form .input .input__val:focus + .input__label { transform: translateY(-23px); } .o-footer__form .input .input__val.form__field-has-errors { border: 2px solid red; } .o-footer__form .input .input__val.has-possible-typo { border-color: #fe7000; color: #fe7000; } .o-footer__form .input .input__val.has-possible-typo ~ label { color: #fe7000; } .o-footer__form .input .input__label { left: 30px; } .o-footer__form .input.freeze .input__label { transform: translateY(-23px); } .block--form .o-footer__form .form__rich-text, .block--formBlock .o-footer__form .form__rich-text { margin-bottom: 0; } .block--form .o-footer__form .form__rich-text p, .block--formBlock .o-footer__form .form__rich-text p { line-height: 1.25em; } .block--form .heading, .block--formBlock .heading { margin-bottom: 0.5em; } .o-footer__content { grid-area: content; display: grid; gap: 44px 24px; grid-template-areas: "logo" "copyright" "social" "sitemap" "accred_bank"; text-align: center; padding: 60px 24px; max-width: 1200px; margin-left: auto; margin-right: auto; } @media screen and (min-width: 550px) { .o-footer__content { grid-template-areas: "logo copyright" "social social" "sitemap sitemap" "accred_bank accred_bank"; } } @media screen and (min-width: 768px) { .o-footer__content { grid-template-columns: min-content 1fr min-content; grid-template-areas: "logo copyright social" "sitemap sitemap sitemap" "accred_bank accred_bank accred_bank"; } } @media screen and (min-width: 1024px) { .o-footer__content { grid-template-areas: "logo copyright social" "sitemap sitemap sitemap" "accred_bank accred_bank accred_bank"; align-self: end; } } .o-footer__content .-finePrint { font-size: 10px; color: #4b4d59; line-height: 18px; letter-spacing: 1.3px; text-transform: uppercase; } .o-footer__content .-finePrint p + p { margin-top: 5px; } .o-footer__content .-finePrint a { text-decoration: underline; } .o-footer__logo { grid-area: logo; display: grid; place-items: center; } @media screen and (min-width: 550px) { .o-footer__logo { justify-items: end; } } @media screen and (min-width: 1024px) { .o-footer__logo { justify-items: start; } } .o-footer__copyright { grid-area: copyright; align-self: center; } @media screen and (min-width: 550px) { .o-footer__copyright { text-align: left; } } .o-footer__search-socials { grid-area: social; display: grid; grid-template-areas: "search" "social"; gap: 10px; max-width: 280px; margin-left: auto; margin-right: auto; align-self: center; } @media screen and (min-width: 768px) { .o-footer__search-socials { margin-left: 0; margin-right: 0; justify-items: end; justify-self: center; max-width: unset; grid-template-areas: "search social"; grid-template-columns: 1fr min-content; } } .o-footer__sitemap { grid-area: sitemap; text-align: left; font-size: 13px; color: #4b4d59; line-height: 2; display: grid; grid-gap: 40px 10px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); justify-items: start; justify-self: center; } @media screen and (min-width: 375px) { .o-footer__sitemap { grid-template-columns: repeat(2, minmax(150px, 1fr)); } } @media screen and (min-width: 550px) { .o-footer__sitemap { grid-template-columns: repeat(2, minmax(150px, 1fr)); grid-gap: 40px; } } @media screen and (min-width: 768px) { .o-footer__sitemap { grid-template-columns: repeat(4, minmax(150px, 1fr)); } } @media screen and (min-width: 1024px) { .o-footer__sitemap { width: 100%; } } .o-footer__sitemap .m-sitemap__group { -moz-column-break-inside: avoid; break-inside: avoid; } .o-footer__sitemap .m-sitemap__head { letter-spacing: 1.3px; text-transform: uppercase; font-weight: 500; font-size: 13px; } .o-footer__sitemap .m-sitemap__list { margin-top: 20px; } .o-footer__accreds-bank { grid-area: accred_bank; display: flex; flex-flow: column nowrap; justify-content: center; gap: 44px 24px; } @media screen and (min-width: 768px) { .o-footer__accreds-bank { flex-flow: row nowrap; justify-content: flex-start; } } .o-footer__accreditations { display: flex; flex-flow: row wrap; justify-content: center; align-items: center; gap: 24px; } .o-footer__accreditations a { display: block; } .o-footer__accreditations img { max-width: 100%; max-height: 70px; height: auto; display: block; } .o-footer__accreditations .icon-dzi { display: block; height: 100px; width: 66px; } @media (min-width: 320px) { .o-footer__accreditations { flex-flow: row nowrap; } } @media screen and (min-width: 550px) { .o-footer__accreditations { justify-items: end; } } @media screen and (min-width: 1024px) { .o-footer__accreditations { justify-items: start; } } @media screen and (min-width: 768px) { .o-footer__bank-details { text-align: left; } } @media screen and (min-width: 1024px) { .top-nav__wrap { display: flex; align-items: center; } } .top-nav__wrap > * + * { margin-top: 20px; } @media screen and (min-width: 1024px) { .top-nav__wrap > * + * { margin-top: 0; margin-left: 30px; } } @media screen and (min-width: 1200px) { .top-nav__wrap > * + * { margin-left: 40px; } } .top-nav__item { font-size: 15px; font-weight: 500; line-height: 20px; letter-spacing: 1.61px; text-transform: uppercase; color: #fff; } @media screen and (min-width: 1024px) { .top-nav__item { white-space: nowrap; } } .top-nav__item--current { border-left: 2px solid #FFD238; padding-left: 10px; } @media screen and (min-width: 1024px) { .top-nav__item--current { border: none; color: #FFD238; } } .top-nav__drop { position: fixed; bottom: 0; left: 0; width: 100%; margin-top: 0; } @media screen and (min-width: 1024px) { .top-nav__drop { position: relative; } } @media screen and (min-width: 1024px) { .top-nav--dark .top-nav__item, .top-nav.pinned .top-nav__item { color: #353439; } } .main-nav { display: flex; flex-direction: column; height: 100%; } .main-nav .btn-special { min-width: 270px; } .main-nav__wrap { max-height: calc(100vh - 90px); width: 100%; overflow: auto; padding: 0 50px 90px; } @media screen and (min-width: 1024px) { .main-nav__wrap { padding: 0; overflow: visible; } } .main-nav__logo { display: block; margin: 30px auto 0; opacity: 0; } @media screen and (min-width: 1024px) { .main-nav__logo { display: none; } } .main-nav__body { margin-top: 40px; overflow: auto; } @media screen and (min-width: 1024px) { .main-nav__body { margin-top: 0; overflow: visible; } } .main-nav__footer { margin-top: 30px; } @media screen and (min-width: 1024px) { .main-nav__footer { display: none; } } .main-nav__socials { margin-top: 30px; } .main-nav__anim { opacity: 0; } @media screen and (min-width: 1024px) { .main-nav__anim { opacity: 1; } } .footer-nav__group { margin-top: 35px; } .footer-nav__head { text-transform: uppercase; font-weight: 500; color: #353439; } .footer-nav__item { font-size: 13px; } .footer-nav__link { line-height: 36px; transition: opacity 0.3s ease; } .footer-nav__link:hover { opacity: 0.8; } .footer-nav--mobile > * + * { margin-top: 15px; } .footer-nav--mobile .footer-nav__wrap { padding-bottom: 25px; list-style-type: none; } .footer-nav--mobile .footer-nav__head { color: rgba(255, 255, 255, 0.6); text-transform: uppercase; } .footer-nav--mobile .footer-nav__link { color: #fff; } .footer-nav--footer .footer-nav__head { letter-spacing: 1.3px; } .footer-nav--footer .footer-nav__wrap { margin-top: 20px; } .footer-nav--footer .footer-nav__link { line-height: 28px; color: #4a4a4a; } .pagination-section { text-align: center; display: flex; flex-direction: column; padding-top: 30px; padding-bottom: 30px; } @media screen and (min-width: 768px) { .pagination-section { flex-direction: row; justify-content: space-between; align-items: center; padding-top: 80px; padding-bottom: 80px; } } .pagination-section > * + * { margin-top: 1rem; } @media screen and (min-width: 768px) { .pagination-section > * + * { margin-top: 0; } } .pagination-section__container { display: inline-block; } .pagination-section__container > * + * { margin-left: 0.5rem; } .pagination-section__up { flex: 0 0 auto; } @media screen and (max-width: 768px) { .pagination-section__up { display: none; } } @media screen and (min-width: 768px) { .pagination-section__up--right { text-align: right; } } .mobile-drop { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 300; } @media screen and (min-width: 1024px) { .mobile-drop { display: none; } } .mobile-drop--fake { height: 90px; position: inherit; } .home-partner { position: relative; padding-bottom: 350px; } @media screen and (min-width: 1024px) { .home-partner { padding-bottom: 525px; } } .home-partner__bcg { position: absolute; top: 0; width: 100%; height: 100%; background-image: linear-gradient(-180deg, rgba(255, 255, 255, 0) 0%, #f0f3f6 26%, #7892b0 100%); z-index: 1; } .home-partner__img { position: absolute; bottom: 0; width: 100%; height: 350px; background-position: center top; background-size: cover; z-index: 2; } @media screen and (min-width: 375px) { .home-partner__img { background-position: initial; } } @media screen and (min-width: 1024px) { .home-partner__img { height: 50%; } } .home-partner__content { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 415px; max-width: 100%; margin-left: auto; margin-right: auto; position: relative; z-index: 3; color: #353439; text-align: center; } .home-partner__content > * + * { margin-top: 30px; } .home-partner__content > * { max-width: 100%; } .home-partner__head { display: flex; justify-content: center; } .home-partner__title { font-weight: 500; } @media screen and (min-width: 768px) { .home-partner__title { font-size: 36px; line-height: 40px; } } .home-partner__ico { fill: #ff5800; } .page__hero { --hero-color: #fff; --hero-bg-color: #fff; --hero-bg-height-ratio: 56.25vw; --video-bg-height-ratio: 56.25vw; position: relative; text-align: center; color: var(--hero-color); background-color: var(--hero-bg-color); overflow-y: hidden; } .page__hero .content-width { display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; max-width: 1248px; margin-left: auto; margin-right: auto; padding-top: 120px; min-height: var(--hero-bg-height-ratio); } .page__hero .hero__bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; height: 100%; min-width: 100%; max-height: 100%; background-size: cover; -o-object-fit: cover; object-fit: cover; z-index: 2; overflow: hidden; background-color: #0072bc; } .page__hero .hero__bg.-hasBgVideo { background-color: transparent; } .page__hero .video__bg { position: absolute; top: 0; left: 0; right: 0; width: 100%; height: 100%; aspect-ratio: 16/9; background-size: cover; background-repeat: no-repeat; -o-object-fit: cover; object-fit: cover; z-index: 1; overflow: hidden; } .page__hero .video__bg video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -100; -o-object-fit: cover; object-fit: cover; } .page__hero .hero__content { z-index: 3; position: relative; max-width: 1200px; padding: 5vh 30px; display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; } .page__hero .hero__content > * { display: contents; } .page__hero .hero__content .btn:not(.btn-clean) { text-shadow: none; } .page__hero .hero__content .donation-widget { text-align: left; max-width: 480px; margin: 1em auto; background-color: #fff; padding: 3em; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); border-radius: 3px; } .page__hero .content--all { display: block; } .page__hero .content--medium-up, .page__hero .content--large-up, .page__hero .content--extra-large-up { display: none; } .page__hero .content__block + .content__block { margin-top: 1rem; } @media (min-width: 768px) { .page__hero { --hero-color: #fff; } main.home--urgent .page__hero .hero__content { padding-bottom: calc(160px + 5vh); } } @media (min-width: 1024px) { .page__hero .hero__content { padding-left: 37px; padding-right: 37px; } } @media (min-width: 1200px) { .page__hero .content-width { padding-top: 175px; } } .block--heading h1 { font-size: 22px; font-weight: 700; } @media (min-width: 640px) { .block--heading h1 { font-size: 36px; } } @media (min-width: 1024px) { .block--heading h1 { font-size: 60px; } } .block--subheading h2 { font-size: 16px; font-weight: 500; line-height: 1.25; margin: 0.5em 0 0.75em; } @media (min-width: 640px) { .block--subheading h2 { font-size: 20px; } } .block--image img { width: 100%; max-width: 400px; } .block--text > * { margin-left: auto; margin-right: auto; } .block--button-group { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; margin: 0 -5px; } .block--button-group .block--buttons { margin: 0 5px; } .carousel { position: relative; } .carousel__nav { margin-top: 40px; } @media screen and (min-width: 768px) { .carousel__item { width: calc(100% - 100px); } } .carousel__bullets { margin-top: 40px; } @media screen and (min-width: 1024px) { .carousel__bullets { display: none; margin-top: 0; } } .carousel__container { height: 100%; } @media screen and (min-width: 375px) { .carousel__container { height: auto; } } .carousel__content { display: flex; flex-flow: column wrap; align-items: center; justify-content: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; } .carousel__content > * + * { margin-top: 20px; } .carousel__caption { position: absolute; bottom: 40px; left: 40px; } .carousel__caption > * + * { margin-top: 10px; } .carousel__caption-txt { font-size: 16px; font-weight: 500; line-height: 19px; letter-spacing: 0.4px; color: #fff; } .carousel__video { position: absolute; top: 35px; left: 35px; } .carousel__cta { display: flex; justify-content: center; margin-top: 30px; margin-bottom: 30px; } .carousel--stories { padding-top: 50px; padding-bottom: 85px; } @media screen and (min-width: 375px) { .carousel--stories { padding-bottom: 0; } } @media screen and (min-width: 768px) { .carousel--stories { padding-top: 0; padding-bottom: 0; } } .carousel--stories .carousel__item { height: 100%; } @media screen and (min-width: 768px) { .carousel--stories .carousel__item { max-width: 100%; } } .carousel--offset .carousel__container { padding-bottom: 5px; padding-top: 5px; } .carousel--offset .carousel__item { width: calc(100% - 100px); } .carousel-item { display: flex; flex-direction: column; align-items: center; justify-content: center; } @media screen and (min-width: 1024px) { .carousel-item { margin-bottom: 0; } } .carousel-item__img { width: 100px; height: 100px; border-radius: 100%; background-position: center; background-size: contain; background-repeat: no-repeat; } @media screen and (min-width: 768px) { .carousel-item__img { width: 180px; height: 180px; } } .carousel-item__content { text-align: center; max-width: 285px; margin-top: 25px; width: 100%; margin-top: 10px; color: #353439; } .carousel-item__content p { letter-spacing: 0.5px; line-height: 24px; } .carousel-item__content > * + * { margin-top: 20px; } @media screen and (min-width: 768px) { .carousel-item__content { margin-top: 40px; } } .carousel-item--light .carousel-item__content { color: #fff; } .carousel-bullet { display: flex; justify-content: center; } .carousel-bullet > * + * { margin-left: 15px; } .carousel-bullet__item { width: 10px; height: 10px; display: inline-block; border-radius: 50%; background-color: #b2b2b2; cursor: pointer; opacity: 1; will-change: background-color, box-shadow; transition: background-color 0.3s ease, box-shadow 0.3s ease; } .carousel-bullet__item:focus { outline: none; box-shadow: 0 0 5px #0072bc, 0 0 3px #0072bc, 0 0 10px #0072bc; } .carousel-bullet__item.active, .carousel-bullet__item.swiper-pagination-bullet-active { background-color: #4b4d59; } .carousel-story { display: flex; flex-direction: column; min-height: 580px; height: 100%; width: 100%; overflow: hidden; } @media screen and (min-width: 375px) { .carousel-story { min-height: 100px; } } @media screen and (min-width: 768px) { .carousel-story { min-height: auto; height: unset; } } @media screen and (min-width: 1024px) { .carousel-story:hover .carousel-story__content { background-color: #fff; } } .carousel-story__img { flex: 0 1 auto; width: 100%; min-height: 275px; padding: 35px; background-position: center; background-size: cover; background-color: rgba(146, 148, 161, 0.075); position: relative; display: flex; flex-flow: column nowrap; justify-content: flex-end; align-items: flex-start; } .carousel-story__content { flex: 1 0 auto; padding: 35px 30px; width: 100%; background-color: #fff; } .carousel-story__content > * + * { margin-top: 11px; } @media screen and (min-width: 1024px) { .carousel-story__content { background-color: transparent; will-change: background-color; transition: background-color 0.45s ease; } } .carousel-story__head { font-size: 18px; font-weight: bold; line-height: 26px; } .carousel-story__txt { color: #4b4d59; } .carousel-story__video { position: absolute; top: 35px; left: 35px; } .carousel-story__date { display: inline-block; font-size: 12px; color: #adb1bc; letter-spacing: 1.85px; line-height: 20px; text-transform: uppercase; } @media screen and (min-width: 768px) { .carousel-story--first { border-radius: 0; } } @media screen and (min-width: 768px) { .carousel-story--last { border-radius: 0; } } @media screen and (min-width: 1024px) { .carousel-story--dark:hover .carousel-story__head, .carousel-story--dark:hover .carousel-story__txt { color: #4b4d59; } } @media screen and (min-width: 1024px) { .carousel-story--dark:hover .carousel-story__content { background-color: #fff; } } .carousel-story--dark .carousel-story__content { background-color: transparent; } .carousel-story--dark .carousel-story__head, .carousel-story--dark .carousel-story__txt { color: #fff; transition: color 0.3s ease; } .carousel-story--dark .carousel-story__txt { color: #adb1bc; } @media screen and (min-width: 768px) { .carousel-story--compact { height: 590px; } } @media screen and (min-width: 1024px) { .carousel-story--compact { height: auto; } } .carousel-story--video:hover .carousel-story__play { transform: scale(1.1); } .carousel-story--video .carousel-story__img { display: flex; align-items: center; justify-content: center; } .carousel-story--news .carousel-story__content > * + * { margin-top: 15px; } .carousel-stories__btn { display: flex; justify-content: center; margin-top: 35px; } @media screen and (min-width: 768px) { .carousel-stories__btn { display: none; } } .carousel-mosaic__imgs { position: relative; } @media screen and (min-width: 768px) { .carousel-mosaic__imgs { width: 70%; } } @media screen and (min-width: 1024px) { .carousel-mosaic__imgs { width: calc(60% - 30px); } } .carousel-mosaic__content { margin-top: 35px; overflow: hidden; } @media screen and (min-width: 768px) { .carousel-mosaic__content { display: flex; flex-direction: column; justify-content: center; } } .carousel-mosaic__dsc > * + * { margin-top: 15px; } .carousel-mosaic__pagination { margin-top: 30px; } .carousel-mosaic__pagination > * + * { margin-left: 15px; } .carousel-tile { display: flex; flex-wrap: wrap; position: absolute; top: 0; left: 0; opacity: 0; width: 100%; transition: opacity 0.45s ease; } .carousel-tile.active { position: relative; opacity: 1; } .carousel-tile.active .carousel-tile__img--1, .carousel-tile.active .carousel-tile__img--2, .carousel-tile.active .carousel-tile__img--3 { transform: none; } .carousel-tile__img { background-size: cover; background-position: center; } .carousel-tile__img--1, .carousel-tile__img--2, .carousel-tile__img--3 { transform: translateX(20px); transition: transform 0.45s ease; } .carousel-tile__img--1, .carousel-tile__img--3 { height: 150px; } @media screen and (min-width: 550px) { .carousel-tile__img--1, .carousel-tile__img--3 { height: 250px; } } @media screen and (min-width: 768px) { .carousel-tile__img--1, .carousel-tile__img--3 { height: 300px; } } .carousel-tile__img--1 { width: 60%; } @media screen and (min-width: 550px) { .carousel-tile__img--1 { width: 100%; } } @media screen and (min-width: 1024px) { .carousel-tile__img--1 { width: 100%; margin-right: 0; } } .carousel-tile__img--2 { width: 40%; height: 150px; } @media screen and (min-width: 550px) { .carousel-tile__img--2 { margin-top: 25px; margin-bottom: auto; } } @media screen and (min-width: 768px) { .carousel-tile__img--2 { height: 180px; } } .carousel-tile__img--3 { width: 100%; } @media screen and (min-width: 550px) { .carousel-tile__img--3 { width: calc(60% - 25px); margin-left: 25px; margin-top: 25px; } } .carousel-tile__img.is-desktop { display: none; } @media screen and (min-width: 550px) { .carousel-tile__img.is-desktop { display: block; } } .carousel-tile__img.is-mobile { display: block; } @media screen and (min-width: 550px) { .carousel-tile__img.is-mobile { display: none; } } @media screen and (min-width: 550px) { .carousel-tile--reverse .carousel-tile__img--3 { margin: 0 25px 25px 0; } } @media screen and (min-width: 550px) { .carousel-tile--reverse .carousel-tile__img--2 { margin: auto 0 25px 0; } } .carousel-news__slider { position: relative; } .carousel-news__slide--swiped .carousel-news__img { transform: translateX(100%); } .carousel-news__slide--swiped .carousel-news__body { position: relative; z-index: -1; opacity: 0; } .carousel-news__slide--swiped .carousel-news__body > * { max-width: 100%; } .carousel-news__img { width: 100%; height: 350px; padding-left: 20px; padding-right: 20px; background-size: cover; background-position: center; background-color: #fff; z-index: 1; transition: 0.5s; } @media screen and (min-width: 768px) { .carousel-news__img { height: 550px; } } .carousel-news__body { display: flex; flex-direction: column; justify-content: center; align-items: center; padding-bottom: 40px; padding-top: 25px; padding-left: 20px; padding-right: 20px; text-align: center; transition: opacity 0.3s ease; background-color: #fff; } @media screen and (min-width: 768px) { .carousel-news__body { padding-bottom: 0; padding-top: 0px; padding-left: 40px; padding-right: 40px; } } .carousel-news__body > * + * { margin-top: 40px; } .is-ie-11 .carousel-news__body > * { width: 100%; } .carousel-news__body .txt p, .carousel-news__body .urgent__body p p, .urgent__body .carousel-news__body p p { font-family: "Feijoa", "serif"; } .carousel-news__heading { font-size: 25px; line-height: 30px; margin-bottom: 30px; position: relative; } @media screen and (min-width: 1024px) { .carousel-news__heading { font-size: 36px; line-height: 44px; } } .carousel-news__heading::after { content: ""; position: absolute; bottom: -30px; left: 50%; transform: translate(-50%, 0); width: 60px; height: 3px; background: #0072bc; } .carousel-news__arrow { display: flex; align-items: center; justify-content: center; position: absolute; top: 20%; transform: translateY(-50%); z-index: 1; cursor: pointer; width: 32px; height: 32px; border-radius: 50%; overflow: hidden; background-color: rgba(255, 255, 255, 0.2); transition: background-color 0.3s ease; } @media screen and (min-width: 375px) { .carousel-news__arrow { top: 23%; } } @media screen and (min-width: 768px) { .carousel-news__arrow { top: 50%; } } .carousel-news__arrow:hover { background-color: rgba(255, 255, 255, 0.6); } .carousel-news__arrow--prev { left: 50px; } @media screen and (min-width: 768px) { .carousel-news__arrow--prev { left: 80px; } } @media screen and (min-width: 1200px) { .carousel-news__arrow--prev { left: 130px; } } .carousel-news__arrow--next { right: 50px; } @media screen and (min-width: 768px) { .carousel-news__arrow--next { right: 80px; } } @media screen and (min-width: 1200px) { .carousel-news__arrow--next { right: 130px; } } .carousel-news__arrow--hidden { display: none; } .carousel-news__ico { width: 10px; fill: #fff; } .lead-box { overflow: hidden; } @media screen and (min-width: 1024px) { .lead-box__content { padding-bottom: 110px; } } .lead-box__decor { z-index: 8; } .lead-box__dts { z-index: 3; } .lead-box__hero { background-position: center; background-size: cover; position: relative; overflow: hidden; height: 350px; width: 100%; } @media screen and (min-width: 768px) { .lead-box__hero { overflow: initial; height: 500px; } } @media screen and (min-width: 1024px) { .lead-box__hero { height: 695px; } } @media screen and (min-width: 550px) { .lead-box__hero.is-mobile { display: none; } } .lead-box__hero.is-desktop { display: none; } @media screen and (min-width: 550px) { .lead-box__hero.is-desktop { display: block; } } .lead-box__content { margin-top: 35px; } @media screen and (min-width: 768px) { .lead-box__content { padding-top: 50px; } } @media screen and (min-width: 1024px) { .lead-box__content { padding-top: 85px; } } .lead-box__head { color: #353439; position: relative; z-index: 10; } .lead-box__cta { display: flex; flex-direction: column; margin-top: 35px; } @media screen and (min-width: 1024px) { .lead-box__cta { flex-direction: row; } } .lead-box__cta > * + * { margin-top: 25px; } @media screen and (min-width: 1024px) { .lead-box__cta > * + * { margin-top: 0; margin-left: 30px; } } .lead-box__wrap { margin-top: 70px; z-index: 1; } @media screen and (min-width: 768px) { .lead-box__wrap { margin-top: 120px; } } @media screen and (min-width: 1024px) { .lead-box__wrap { position: relative; margin-top: 120px; display: flex; flex-wrap: wrap; } } @media screen and (min-width: 1024px) { .lead-box__background { content: ""; display: block; position: absolute; top: -60px; left: -100vw; width: 200vw; height: calc(100% + 170px); background: rgba(255, 255, 255, 0.05); } } .lead-box__item { padding-right: 15px; margin-top: 30px; width: 50%; z-index: 2; } @media screen and (min-width: 1024px) { .lead-box__item { margin-top: 50px; } } .lead-box__txt { color: #adb1bc; margin-top: 15px; } @media screen and (min-width: 1024px) { .lead-box--light .lead-box__wrap:before { background: #f4f4f4; } } .img-box { padding: 5px 0; } .img-box__hero { height: 350px; width: 100%; background-position: center; background-size: cover; background-repeat: no-repeat; } .img-box__hero img { -o-object-position: center; object-position: center; -o-object-fit: cover; object-fit: cover; width: 100%; height: 100%; } .img-box__hero.-neverCrop { background-size: contain; } .img-box__hero.-neverCrop img { -o-object-fit: contain; object-fit: contain; } .img-box__hero.is-desktop { display: none; } @media screen and (min-width: 550px) { .img-box__hero.is-desktop { display: block; } } .img-box__hero.is-mobile { display: block; } @media screen and (min-width: 550px) { .img-box__hero.is-mobile { display: none; } } @media screen and (min-width: 768px) { .img-box__hero { height: 625px; } } .img-box__content { margin-top: auto; margin-bottom: auto; } .img-box__label { margin-bottom: 30px; } .img-box__cta { margin-top: 50px; } .img-box__wrap--left .img-box__cta.btn--arrow { margin-left: -15px; } .img-box__wrap--right .img-box__cta.btn--arrow { margin-right: -15px; } .img-box__pagination { margin-top: 40px; margin-left: 25px; } .img-box__wrap { padding: 30px 25px 0; } .img-box__wrap > * + * { margin-top: 20px; } .img-box__wrap--left { text-align: left; } .img-box__wrap--right { text-align: right; } .img-box__wrap--center { text-align: center; } .img-box--rounded .img-box__hero { border-radius: 0; } @media screen and (min-width: 768px) { .img-box--rounded .img-box__hero { height: 575px; } } .testimonial__content { max-width: 600px; margin-left: auto; margin-right: auto; } .testimonial__img { display: block; width: 120px; height: 120px; border-radius: 50%; overflow: hidden; margin: 0 auto; background-position: center; background-size: cover; } .testimonial__about { font-size: 16px; line-height: 1.5; font-weight: 400; margin-top: 35px; } .testimonial__about a { color: #0072bc; transition: color 0.3s ease; } .testimonial__about a:hover { color: #66aad7; } .testimonial__name { font-size: 16px; font-weight: 500; line-height: 19px; letter-spacing: 3px; color: #0a6db6; text-transform: uppercase; display: block; margin-top: 30px; } .testimonial__role { font-size: 13px; font-weight: 500; line-height: 20px; letter-spacing: 1.8px; color: #9294a1; text-transform: uppercase; display: block; margin-top: 10px; } .testimonial-nav { display: flex; align-items: center; justify-content: space-between; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; margin-top: auto; margin-bottom: auto; } .testimonial-nav__pagination { margin-top: 30px; } .testimonial-nav__arrow { display: flex; align-items: center; justify-content: center; position: relative; cursor: pointer; width: 48px; height: 48px; border-radius: 50%; overflow: hidden; background-color: rgba(10, 109, 182, 0.1); transition: background-color 0.3s ease; } .testimonial-nav__arrow:hover { background-color: rgba(10, 109, 182, 0.8); } .testimonial-nav__arrow:hover .testimonial-nav__ico { fill: #fff; } @media screen and (min-width: 375px) { .testimonial-nav__arrow { display: none; } } @media screen and (min-width: 768px) { .testimonial-nav__arrow { display: flex; } } .testimonial-nav__arrow--prev .testimonial-nav__ico { right: 2px; } .testimonial-nav__arrow--next .testimonial-nav__ico { left: 2px; } .testimonial-nav__ico { position: absolute; top: 0; bottom: 0; right: 0; left: 0; margin: auto; width: 16px; height: 16px; fill: #0a6db6; transition: fill 0.3s ease; } .testimonial-nav__circle { position: absolute; top: 0; left: 0; height: 48px; width: 48px; fill: #0a6db6; } .article-audio__core { display: none; } .article-hero { position: relative; height: 90vh; } @media screen and (min-width: 1024px) { .article-hero { padding-top: 70px; } } .article-hero__bcg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; background-position: center; background-size: cover; } .article-hero__bcg:after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.3); } .article-hero__content { display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; margin-left: auto; margin-right: auto; text-align: center; position: relative; z-index: 2; } .article-hero__content > .row:first-of-type { width: 100%; } .article-hero__content > * + * { margin-top: 30px; } .article-hero__title { font-weight: 600; } .is-windows .article-hero__title { width: 100%; } .article-hero__scroll { position: absolute; bottom: -30px; left: 0; right: 0; z-index: 4; margin: 0 auto; } .article-header { display: none; } @media screen and (min-width: 1024px) { .article-header { display: block; position: absolute; left: 0; right: 0; z-index: 3; margin: auto; } } .article-header.is-fixed { top: 50px; position: fixed; width: 100%; z-index: 500; } @media screen and (min-width: 1024px) { .article-header__wrap { display: flex; justify-content: space-between; padding-top: 50px; } } @media screen and (min-width: 1024px) { .article-header__nav { display: block; position: absolute; left: 0; top: 0; } } @media screen and (min-width: 1024px) { .article-header__graph { margin-top: 0; position: absolute; right: 0; top: 0; } } .article-nav { padding-top: 18px; } .article-nav > * + * { padding-top: 20px; margin-top: 5px; } .article-nav__item { display: block; position: relative; cursor: pointer; } .article-nav__item:hover .article-nav__bar { transform: translateX(10px); } .article-nav__item--active .article-nav__bar { width: 60px; height: 3px; } .article-nav__item--active .article-nav__counter { display: block; } .article-nav__bar { width: 25px; height: 1px; background-color: #9294a1; transition: transform 0.3s ease; } .article-nav__counter { font-size: 10px; line-height: 13px; letter-spacing: 1.25px; position: absolute; top: -18px; display: none; } .article-nav--blue1 .article-nav__item--active .article-nav__bar { background-color: #0072bc; } .article-nav--blue1 .article-nav__counter { color: #0072bc; } .article-nav--blue2 .article-nav__item--active .article-nav__bar { background-color: #66aad7; } .article-nav--blue2 .article-nav__counter { color: #66aad7; } .article-nav--grey1 .article-nav__item--active .article-nav__bar { background-color: #f2f2f2; } .article-nav--grey1 .article-nav__counter { color: #f2f2f2; } .article-nav--grey2 .article-nav__item--active .article-nav__bar { background-color: #b2b2b2; } .article-nav--grey2 .article-nav__counter { color: #b2b2b2; } .article-nav--grey3 .article-nav__item--active .article-nav__bar { background-color: #9294a1; } .article-nav--grey3 .article-nav__counter { color: #9294a1; } .article-nav--grey4 .article-nav__item--active .article-nav__bar { background-color: #797c8b; } .article-nav--grey4 .article-nav__counter { color: #797c8b; } .article-nav--grey5 .article-nav__item--active .article-nav__bar { background-color: #4b4d59; } .article-nav--grey5 .article-nav__counter { color: #4b4d59; } .article-nav--grey6 .article-nav__item--active .article-nav__bar { background-color: #353439; } .article-nav--grey6 .article-nav__counter { color: #353439; } .article-nav--yellow1 .article-nav__item--active .article-nav__bar { background-color: #FFD238; } .article-nav--yellow1 .article-nav__counter { color: #FFD238; } .article-nav--yellow2 .article-nav__item--active .article-nav__bar { background-color: #f0dd66; } .article-nav--yellow2 .article-nav__counter { color: #f0dd66; } .article-nav--orange1 .article-nav__item--active .article-nav__bar { background-color: #fe7000; } .article-nav--orange1 .article-nav__counter { color: #fe7000; } .article-nav--orange2 .article-nav__item--active .article-nav__bar { background-color: #ff5800; } .article-nav--orange2 .article-nav__counter { color: #ff5800; } .article-nav--red1 .article-nav__item--active .article-nav__bar { background-color: #f44c4c; } .article-nav--red1 .article-nav__counter { color: #f44c4c; } .article-nav--red2 .article-nav__item--active .article-nav__bar { background-color: #ef3332; } .article-nav--red2 .article-nav__counter { color: #ef3332; } .article-nav--green1 .article-nav__item--active .article-nav__bar { background-color: #39ac67; } .article-nav--green1 .article-nav__counter { color: #39ac67; } .article-nav--green2 .article-nav__item--active .article-nav__bar { background-color: #5ecf8d; } .article-nav--green2 .article-nav__counter { color: #5ecf8d; } .article-nav--maroon1 .article-nav__item--active .article-nav__bar { background-color: #920049; } .article-nav--maroon1 .article-nav__counter { color: #920049; } .article-nav--maroon2 .article-nav__item--active .article-nav__bar { background-color: #620031; } .article-nav--maroon2 .article-nav__counter { color: #620031; } .article-nav--yellow .article-nav__item--active .article-nav__bar { background-color: #fecf00; } .article-nav--yellow .article-nav__counter { color: #fecf00; } .article-nav--blue .article-nav__item--active .article-nav__bar { background-color: #0a6db6; } .article-nav--blue .article-nav__counter { color: #0a6db6; } .article-txt p + p, .article-txt ul + p { margin-top: 30px; } .article-txt p + blockquote, .article-txt ul + blockquote { margin-top: 15px; } .article-txt p + h1, .article-txt p + h2, .article-txt p + h3, .article-txt p + h4, .article-txt p + h5, .article-txt p + h6, .article-txt ul + h1, .article-txt ul + h2, .article-txt ul + h3, .article-txt ul + h4, .article-txt ul + h5, .article-txt ul + h6 { margin-top: 30px; } .article-txt h1 { font-size: 48px; line-height: 48px; } .article-txt h2 { font-size: 36px; line-height: 40px; letter-spacing: 0.5px; } .article-txt h3 { font-size: 24px; font-weight: 500; line-height: 30px; } .article-txt h4 { font-size: 23px; line-height: 34px; letter-spacing: 1px; } .article-txt h5 { font-size: 20px; line-height: 24px; letter-spacing: 0.5px; } .article-txt h6 { font-size: 16px; font-weight: 500; line-height: 19px; letter-spacing: 3px; } .article-txt h1 + p, .article-txt h2 + p, .article-txt h3 + p, .article-txt h4 + p, .article-txt h5 + p, .article-txt h6 + p { margin-top: 15px; } .article-txt em { font-style: italic; } .article-txt ul, .article-txt ol { padding-left: 15px; margin-top: 15px; margin-bottom: 15px; } .article-txt ul { list-style: disc; } .article-txt ol { list-style: decimal; } .article-txt a { transition: color 0.3s ease; color: #0072bc; } .article-txt a:hover { color: #66aad7; } .article-txt__capitalize { margin-bottom: 30px; } .article-txt--light { color: #f2f2f2; } .article-txt blockquote { color: #353439; background-color: #fff; border: 2px solid #0072bc; padding: 15px 20px; margin: 0 20px; } .article-txt blockquote + p { margin-top: 30px; } @media screen and (min-width: 550px) { .article-txt blockquote { float: right; width: 60%; } } @media screen and (min-width: 768px) { .article-txt blockquote { float: none; width: auto; } } @media screen and (min-width: 1024px) { .article-txt blockquote { float: right; width: 60%; margin-right: -30%; } } .article-section { position: relative; z-index: 2; } .article-section--special { z-index: 4; margin-top: 50px; margin-bottom: 50px; } @media screen and (min-width: 768px) { .article-section--special { margin-top: 100px; margin-bottom: 100px; } } .article-section--audio { margin-top: 55px; margin-bottom: 55px; } .article-section--img { z-index: 4; margin-top: 70px; margin-bottom: 70px; } @media screen and (min-width: 768px) { .article-section--img { margin-top: 130px; margin-bottom: 130px; } } .article-section--breaker { z-index: 4; } .article-section--regular { margin-top: 35px; margin-bottom: 35px; } @media screen and (min-width: 375px) { .article-section .article-quote { padding: 0 calc(0.7813rem + 24px); } } .article-video { background-size: cover; background-position: center; display: flex; align-items: center; justify-content: center; height: 300px; cursor: pointer; } .article-video:hover .article-video__btn { transform: scale(1.2) translateZ(0); } @media screen and (min-width: 768px) { .article-video__txt { padding-left: 35px; } } .article-video__btn { width: 60px; height: 60px; fill: #fff; transition: transform 0.3s ease; } .article-gallery { position: relative; z-index: 4; display: flex; flex-wrap: wrap; width: 100%; } .article-gallery__col { display: flex; flex-wrap: wrap; width: 100%; } @media screen and (min-width: 768px) { .article-gallery__col--left { width: 60%; } } .article-gallery__col--right { flex-direction: column; margin-top: 10px; } @media screen and (min-width: 768px) { .article-gallery__col--right { margin-top: 0; margin-left: 10px; width: calc(40% - 10px); } } .article-gallery__img { background-position: center; background-size: cover; } .article-gallery__img--1 { height: 450px; width: 100%; } .article-gallery__img--2 { height: 300px; width: calc(50% - 5px); margin-top: 10px; margin-right: 10px; } .article-gallery__img--3 { height: 300px; width: calc(50% - 5px); margin-top: 10px; } .article-gallery__img--4 { flex: 0 1 auto; min-height: 300px; } @media screen and (min-width: 550px) { .article-gallery__img--4 { min-height: 450px; } } @media screen and (min-width: 768px) { .article-gallery__img--4 { min-width: 300px; } } .article-gallery__img--5 { flex: 1 0 auto; margin-top: 10px; min-height: 300px; } @media screen and (min-width: 550px) { .article-gallery__img--5 { min-height: 450px; } } @media screen and (min-width: 768px) { .article-gallery__img--5 { min-height: 1px; } } .article-gallery__img.is-desktop { display: none; } @media screen and (min-width: 550px) { .article-gallery__img.is-desktop { display: block; } } .article-gallery__img.is-mobile { display: block; } @media screen and (min-width: 550px) { .article-gallery__img.is-mobile { display: none; } } .article-footer { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: 80px; margin-bottom: 80px; text-align: center; } @media screen and (min-width: 768px) { .article-footer { margin-top: 115px; margin-bottom: 190px; } } .article-footer__btn { margin-top: 30px; } .article-footer__socials { margin-top: 60px; } .article-content { padding-top: 50px; } @media screen and (min-width: 768px) { .article-content { padding-top: 100px; } } @media screen and (min-width: 1024px) { .article-content { padding-top: 150px; } } .article-content h2 { font-size: 28px; line-height: 1.1; letter-spacing: 0.5px; } @media screen and (min-width: 768px) { .article-content h2 { font-size: 32px; } } @media screen and (min-width: 1024px) { .article-content h2 { font-size: 36px; } } .article-content h3 { font-size: 24px; font-weight: 500; line-height: 30px; } .article-content h4 { font-size: 23px; line-height: 34px; letter-spacing: 1px; } .article-content h5 { font-size: 20px; line-height: 24px; letter-spacing: 0.5px; } .article-content h6 { font-size: 16px; font-weight: 500; line-height: 19px; letter-spacing: 3px; } .article-content p { font-family: "Feijoa", "serif"; } .article-categories { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; margin-bottom: 15px; } html.flexbox-gap .article-categories { gap: 10px; } html.no-flexbox-gap .article-categories > .article-category { margin: 5px; } .is-ie .article-categories > *, .is-ie-11 .article-categories > * { margin: 5px; } @media screen and (min-width: 768px) { .article-categories { margin-bottom: 35px; } } @media screen and (min-width: 1024px) { .article-categories { margin-bottom: 60px; } } .carousel-story--compact .article-categories { margin-bottom: 0; justify-content: flex-start; } .article-category { display: inline-block; padding: 11px 25px 9px; border-radius: 0; font-size: 11px; line-height: 16px; letter-spacing: 1.69px; color: #fff; text-align: center; text-transform: uppercase; } .article-category--regular { background: #0a6db6; } .article-date { display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-end; padding-left: calc(24px + 0.7813rem); padding-right: calc(24px + 0.7813rem); margin-bottom: 15px; font-size: 12px; color: #b2b2b2; letter-spacing: 1.85px; line-height: 20px; text-transform: uppercase; } @media screen and (min-width: 768px) { .article-date { padding-left: 0.7813rem; padding-right: 0.7813rem; max-width: calc((min(100%, 1248px) - 48px) / 2); margin-bottom: 35px; } } @media screen and (min-width: 1024px) { .article-date { justify-content: flex-end; margin-bottom: 60px; } } @media screen and (max-width: 768px) { .article-image { padding: 0; } } .article-cta .heading { margin-bottom: 25px; } .article-full { position: relative; z-index: 501; } .circles { padding: 5px 0; } .circles > * + * { margin-top: 45px; } .circles .text--dark { color: #353439; } .circles .text--light { color: #fff; } .circles .carousel-item__giant-text { text-align: center; margin: 1em auto 0.25em; } .circles .row { gap: 4em 0; } .img-wrap { padding-top: 40px; padding-bottom: 45px; } @media screen and (min-width: 1024px) { .img-wrap { padding-top: 90px; padding-bottom: 90px; } } .sort-bar { padding-bottom: 50px; padding-top: 60px; } @media screen and (min-width: 1024px) { .sort-bar__row { flex-wrap: nowrap; align-items: flex-end; } } .sort-bar__row > * + * { margin-top: 16px; } @media screen and (min-width: 768px) { .sort-bar__row > * + * { margin-top: 0; } } .sort-bar__pad { vertical-align: -90%; margin-right: 16px; } .sort-bar__filters { font-size: 13px; flex: 1 0 auto; } @media screen and (min-width: 768px) { .sort-bar__filters { text-align: right; } } .sort-bar__sort-dropdown { width: 185px; } .sort-bar__label { text-transform: uppercase; font-weight: 500; } .sort-bar__categories { margin-top: 1em; } .sort-bar__filters > * + * { margin-top: 16px; } @media screen and (min-width: 1024px) { .sort-bar__filters > * + * { margin-top: 0; margin-left: 16px; } } .sort-bar__filter { display: block; } @media screen and (min-width: 1024px) { .sort-bar__filter { display: inline-block; } } .sort-bar__filter > * + * { margin-left: 16px; } .contact-info { padding-top: 60px; padding-bottom: 60px; text-align: center; } @media screen and (min-width: 768px) { .contact-info { padding-top: 80px; padding-bottom: 80px; } } @media screen and (min-width: 1024px) { .contact-info { padding-top: 120px; padding-bottom: 120px; } } .contact-info__wrapper > * + * { margin-top: 20px; } @media screen and (min-width: 768px) { .contact-info__wrapper > * + * { margin-top: 35px; } } .contact-info__row > * + * { margin-top: 10px; } @media screen and (min-width: 768px) { .contact-info__row > * + * { margin-top: 0; } } .contact-info__box { padding: 30px 50px; } .headings { padding: 5px 0; } .map__layout { background: #f2f2f2; height: 500px; } .map__marker { background: rgba(0, 114, 188, 0.1); border: 2px solid #fff; border-radius: 100%; height: 40px; position: relative; width: 40px; } .map__marker:after { background: #0072bc; border-radius: 100%; content: " "; height: 24px; left: 50%; position: absolute; top: 50%; transform: translate3d(-50%, -50%, 0); width: 24px; } .map-germany { text-align: center; padding-bottom: 60px; background-color: #fafafa; } .map-germany__wrapper > * + * { margin-top: 40px; } .map-germany__map { height: 65vw; width: 100%; max-height: 600px; } .map-germany__location { display: none; } .map-germany__filters { display: inline-block; background-color: #fff; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12); border-radius: 30px; padding: 8px 12px; } .map-germany__filter { display: inline-block; } .map-germany__radio { display: none; } .map-germany__radio:checked + .map-germany__pill { background-color: #0072bc; color: #fff; } .map-germany__pill { display: inline-block; background-color: rgba(0, 114, 188, 0.1); color: #0072bc; text-transform: uppercase; font-weight: 700; font-size: 13px; padding: 10px 15px; border-radius: 18px; transition: 0.3s ease; cursor: pointer; letter-spacing: 1px; margin: 5px; } .table { width: 100%; } .table th, .table td { color: #353439; padding: 25px; } .table th { background: #fafafa; font-size: 13px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; } .table tr:nth-child(even) { background: #fafafa; } .block--two-squares { display: grid; grid-template-areas: "sq1" "sq2"; width: 100%; font-size: 14px; font-weight: 500; margin: 0 auto; } .block--two-squares.-gap { grid-gap: 20px; } .block--two-squares .square { flex: 1; width: 100%; min-height: 100vw; display: flex; flex-flow: row nowrap; align-items: stretch; justify-content: center; position: relative; background-size: cover; background-repeat: no-repeat; background-position: center center; } .block--two-squares .square.square-1 { grid-area: sq1; } .block--two-squares .square.square-2 { grid-area: sq2; } .block--two-squares .square__images { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; z-index: 1; display: grid; grid-gap: 20px; } .block--two-squares .square__images.-count-1 { grid-template-areas: "one"; grid-template-columns: 1fr; } .block--two-squares .square__images.-count-2 { grid-template-areas: "one two"; grid-template-columns: 1fr 2fr; } .block--two-squares .square__images.-count-3 { grid-template-areas: "one one one" "two three three"; grid-template-columns: 1fr 2fr; grid-template-rows: 2fr 1fr; } .block--two-squares .square__images::before { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; } .block--two-squares .square__images .square__image { display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .block--two-squares .square__images .image__1 { grid-area: one; } .block--two-squares .square__images .image__2 { grid-area: two; } .block--two-squares .square__images .image__3 { grid-area: three; } .block--two-squares .square__content { position: relative; z-index: 2; display: flex; flex-flow: column nowrap; align-items: flex-start; justify-content: center; padding: 24px; overflow-y: auto; line-height: 1.25; } .block--two-squares h1 { font-weight: 700; } .block--two-squares .btn { margin-top: 2em; } .block--two-squares .square--gap { width: 100%; } .block--two-squares .square--form { width: 100%; } .block--two-squares .square--form .internal__form { max-width: unset; padding-bottom: 0; margin-top: 0; } .block--two-squares .square--form .internal__form.box--padding { padding-left: 0; padding-right: 0; } .block--two-squares .square--form .form__header { display: none; } .block--two-squares .square--form .form__footer { margin-top: 0; } .block--two-squares .square--form .form__footer .btn { margin-top: 0; } .block--two-squares .square--form .form__error { display: none; } .block--two-squares .square--form .form__submit { width: auto; border-color: #fff; color: #fff; } .block--two-squares .square--form .form__submit:after { background-color: #fff; } .block--two-squares .square--form .form__submit:hover, .block--two-squares .square--form .form__submit:focus { color: #353439; } .block--two-squares .square--form .input { background-color: #fff; } .block--two-squares .square--form .input .input__val { padding: 5px 30px; height: 100%; border: 2px solid #fff; } .block--two-squares .square--form .input .input__val.form__field-has-errors { border: 2px solid red; } .block--two-squares .square--form .input .input__label { left: 30px; } @media (min-width: 320px) { .block--two-squares { font-size: 4.375vw; } .block--two-squares .square__content { padding: 7.5vw; } } @media (min-width: 640px) { .block--two-squares { grid-template-areas: "sq1 sq2"; grid-template-columns: 1fr 1fr; font-size: 20px; } .block--two-squares .square { min-height: 50vw; } .block--two-squares .square__content { padding: 4.03125vw; } } @media screen and (min-width: 768px) { .block--two-squares .square--form .internal__form { margin-top: 0; padding-bottom: 0; } .block--two-squares .square--form .form__footer.medium-6 { max-width: 100%; } } @media (min-width: 1024px) { .block--two-squares .square--form .internal__form { margin-top: 0; padding-bottom: 0; } } @media (min-width: 1248px) { .block--two-squares .square__content { padding: 50px; } } .cards .card { height: auto; } .cards .card + .card { margin-top: 60px; } @media screen and (min-width: 1024px) { .cards .card + .card { margin-top: 0; } } .cards .tile-img { display: flex; flex-flow: column nowrap; align-items: stretch; justify-content: flex-start; height: 100%; } .cards .tile-img__content { flex: 1 1 auto; display: flex; flex-flow: column nowrap; align-items: stretch; justify-content: space-between; } .button-group { flex: 1; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; margin: -7px; } .button-group.align--left { justify-content: flex-start; } .button-group.align--center { justify-content: center; } .button-group.align--right { justify-content: flex-end; } .button-group > * { margin: 7px; } .block--form, .block--formBlock { padding-top: 50px; padding-bottom: 50px; } .block--form:has(form.is-compact), .block--formBlock:has(form.is-compact) { padding-top: 20px; padding-bottom: 20px; } .block--form .internal__form, .block--formBlock .internal__form { margin: 0 auto; padding: 0; } .block--form .form__header, .block--formBlock .form__header { margin-bottom: 0; } .block--form .form__header .heading, .block--formBlock .form__header .heading { font-size: 21px; font-weight: 700; letter-spacing: 1px; } @media (min-width: 768px) { .block--form .form__header .heading, .block--formBlock .form__header .heading { font-size: 24px; } } @media (min-width: 1024px) { .block--form .form__header .heading, .block--formBlock .form__header .heading { font-size: 28px; } } .block--form .form__error, .block--formBlock .form__error { min-height: unset; } .block--form .form__footer, .block--formBlock .form__footer { margin-top: 1em; } .block--form .form__html *:last-child, .block--formBlock .form__html *:last-child { margin-bottom: 0; } .block--form .text-align--left, .block--formBlock .text-align--left { text-align: left; } .block--form .text-align--center, .block--formBlock .text-align--center { text-align: center; } .block--form .text-align--right, .block--formBlock .text-align--right { text-align: right; } .featureList.-largeHeadings { --padding: 0; display: flex; flex-flow: column nowrap; align-items: center; justify-content: center; gap: 1em; padding: calc(var(--padding) * 0.25); } @media screen and (min-width: 550px) { .featureList.-largeHeadings { padding: calc(var(--padding) * 0.5); } } @media screen and (min-width: 768px) { .featureList.-largeHeadings { padding: calc(var(--padding) * 0.75); } } @media screen and (min-width: 1024px) { .featureList.-largeHeadings { padding: var(--padding); } } .featureList__image { max-width: 100%; } .featureList__image img { max-width: 100%; height: auto; } .featureList__items { display: grid; grid-template-columns: 1fr; gap: 1em; font-size: clamp(1rem, 2.5vw, 1.5rem); } .featureList__items .item { display: flex; flex-flow: row nowrap; align-items: center; gap: 20px; } .featureList__items .item__heading { font-size: clamp(3rem, 5vw, 120px); font-weight: bold; margin: 0; flex: 1; text-align: right; } .featureList__items .item__text { flex: 2; } @media screen and (min-width: 768px) { .featureList__items { grid-template-columns: 1fr 1fr; } } .block--mediaFull { --fgColor: #fff; --bgColor: #797c8b; color: var(--fgColor); background-color: var(--bgColor); position: relative; display: flex; flex-flow: column nowrap; align-items: stretch; justify-content: center; padding: 40px 0; min-height: 475px; } .block--mediaFull.-foregroundColor--light { --fgColor: #fff; } .block--mediaFull.-foregroundColor--dark { --fgColor: #353439; } .block--mediaFull .content-width { width: 100%; max-width: 1248px; margin-left: auto; margin-right: auto; padding: 0 24px; display: flex; flex-flow: row nowrap; justify-content: center; } .block--mediaFull .content-width.align-left { justify-content: flex-start; } .block--mediaFull .content-width.align-right { justify-content: flex-end; } @media screen and (min-width: 768px) { .block--mediaFull { padding: 60px 0; } } @media screen and (min-width: 1024px) { .block--mediaFull { padding: 80px 0; } } .mediaFull__image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 1; } .mediaFull__content { --cols: 1; --totalCols: 1; grid-area: content; display: flex; flex-flow: column nowrap; gap: 1em; align-items: center; z-index: 2; flex-basis: calc(100% / var(--totalCols) * var(--cols)); } .mediaFull__content .txt, .mediaFull__content .urgent__body p, .urgent__body .mediaFull__content p { color: inherit; } @media screen and (min-width: 768px) { .mediaFull__content { --totalCols: 8; --cols: 8; } .mediaFull__content.width-2 { --cols: 2; } .mediaFull__content.width-4 { --cols: 4; } .mediaFull__content.width-6 { --cols: 6; } .mediaFull__content.width-8 { --cols: 8; } } @media screen and (min-width: 1024px) { .mediaFull__content { --totalCols: 12; --cols: 12; } .mediaFull__content.width-2 { --cols: 2; } .mediaFull__content.width-4 { --cols: 4; } .mediaFull__content.width-6 { --cols: 6; } .mediaFull__content.width-8 { --cols: 8; } .mediaFull__content.width-10 { --cols: 10; } .mediaFull__content.width-12 { --cols: 12; } } .card-search { display: flex; height: 100%; flex-direction: column; justify-content: space-between; background: #fff; padding: 25px; } .card-search__heading { margin-bottom: 15px; } .news-header { margin-bottom: 35px; padding-top: 20vh; text-align: center; } .news-header__location { margin-bottom: 35px; } .news-header__title { margin-bottom: 35px; } .news-image { margin-bottom: 65px; text-align: center; } .news-image .image__caption { opacity: 1; } .news-socials { display: flex; align-items: center; margin-bottom: 35px; } .news-socials > * + * { margin-left: 20px; } .news-txt p:first-child { font-size: 24px; line-height: 34px; } .news-txt p + p { margin-top: 30px; } .news-txt h1 + p, .news-txt h2 + p, .news-txt h3 + p, .news-txt h4 + p, .news-txt h5 + p, .news-txt h6 + p { margin-top: 15px; } .news-txt__capitalize { margin-bottom: 30px; } .news-txt--light { color: #f2f2f2; } .news-txt h2 { font-size: 36px; line-height: 40px; letter-spacing: 0.5px; } .news-txt h3 { font-size: 24px; font-weight: 500; line-height: 30px; } .news-txt h4 { font-size: 23px; line-height: 34px; letter-spacing: 1px; } .news-txt h5 { font-size: 20px; line-height: 24px; letter-spacing: 0.5px; } .news-txt h6 { font-size: 16px; font-weight: 500; line-height: 19px; letter-spacing: 3px; } .news-txt p { font-family: "Feijoa", "serif"; } .team-entry .txt p:not(:last-child), .team-entry .urgent__body p p:not(:last-child), .urgent__body .team-entry p p:not(:last-child) { margin-bottom: 20px; } .team-entry__name { margin-bottom: 5px; } .team-entry__role { margin-bottom: 25px; } .team-entry__image { height: 220px; margin-bottom: 30px; width: 220px; } .team-entry__image .tile-img__img { height: 100%; } .popup-form .default-form-wrapper { margin: 0; background: #FFF; padding-top: 25px; padding-bottom: 25px; } .popup-image-content { width: 100%; height: auto; display: block; position: relative; background: #fff; } .popup-image-content .popup-image { width: 100%; height: auto; display: block; position: relative; background-size: contain; } .popup-image-content .popup-image img { opacity: 0; width: 100%; margin: 0; line-height: 0; } @media (min-width: 768px) { .popup-image-content .popup-image { display: none; } } @media (max-width: 580px) { .popup-image-content .btn--primary { font-size: 10px; padding: 10px; height: auto; } } .popup-image-content .popup-content { width: 60%; max-width: 450px; } .popup-image-content .popup-content.left { text-align: left; } .popup-image-content .popup-content.right { text-align: right; } .popup-image-content .popup-content.center { text-align: center; } @media (max-width: 767px) { .popup-image-content .popup-content { width: 100%; position: static; padding: 20px; } } @media (max-width: 580px) { .popup-image-content .popup-content { padding: 10px; } } .popup-image-content .popup-content h2 { font-size: 36px; font-weight: 500; margin-bottom: 20px; line-height: 1.2; } @media (max-width: 1160px) { .popup-image-content .popup-content h2 { font-size: 30px; } } @media (max-width: 580px) { .popup-image-content .popup-content h2 { font-size: 20px; } } .popup-image-content .popup-content p { font-size: 24px; line-height: 1.4; font-weight: 500; margin-bottom: 20px; } @media (max-width: 1160px) { .popup-image-content .popup-content p { font-size: 22px; } } @media (max-width: 580px) { .popup-image-content .popup-content p { font-size: 16px; } } .popup-image-content .popup-content input[type=submit], .popup-image-content .popup-content button[type=submit] { border: 0; cursor: pointer; } #popup-form-wrapper, #popup-thank-you-wrapper { border: 1px solid #ddd; background: white; } @media (max-width: 580px) { .lightbox__media { max-width: 100%; } } #popup-thank-you-wrapper .banner-popup.left-middle-content h2 { font-size: 24px; } #popup-thank-you-wrapper .banner-popup.left-middle-content .popup-content { top: 43%; max-width: 290px; } #popup-thank-you-wrapper .banner-popup.left-middle-content .popup-content p { font-size: 16px; } @media (max-width: 767px) { #popup-thank-you-wrapper .banner-popup.left-middle-content .popup-content { max-width: 100%; } #popup-thank-you-wrapper .banner-popup.left-middle-content .popup-content p { font-size: 15px; } } .banner-popup { width: 100%; height: auto; position: relative; display: flex; flex-direction: column; /*@media (max-width:580px) { .btn--primary { font-size: 10px; padding: 15px; height: auto; } }*/ /* The toggle-checkbox */ } .banner-popup h2 { font-size: 21px; font-weight: 700; margin-bottom: 10px; line-height: 1.4; } .banner-popup p { font-size: 18px; line-height: 1.3; font-weight: 500; margin-bottom: 10px; /*@media (max-width:992px) { font-size: 9px; } @media (max-width:580px) { font-size: 8px; }*/ /*&.text-large{ font-size: 120%; }*/ } @media screen and (min-width: 768px) { .banner-popup p { font-size: 14px; line-height: 1.4; font-weight: 500; margin-bottom: 10px; } } .banner-popup p.txt-small { font-size: 10px; } .banner-popup p.txt-small a { text-decoration: underline; } @media (max-width: 767px) { .banner-popup p.txt-small { text-align: center; } } .banner-popup .footer-txt p { font-size: 10px !important; } .banner-popup .footer-txt p a { text-decoration: underline; } @media (max-width: 580px) { .banner-popup .footer-txt p { margin: 0 auto; } } @media (max-width: 767px) { .banner-popup .footer-txt p { text-align: center; } } .banner-popup .footer-txt p:last-child { margin-bottom: 0 !important; } .banner-popup .content-beginning h2 { font-size: 14px; } .banner-popup .content-beginning p { font-weight: normal; } .banner-popup .button-container { margin-top: 7px; margin-bottom: 14px; } @media (max-width: 767px) { .banner-popup .button-container { text-align: center; } } .banner-popup input[type=submit], .banner-popup button[type=submit] { border: 0; cursor: pointer; min-width: 150px; font-size: 12px; height: 40px; } .banner-popup .popup-image { width: 100%; height: auto; display: block; position: relative; overflow: hidden; line-height: 0; } .banner-popup .popup-image img { width: 100%; margin: 0; line-height: 0; } .banner-popup .popup-image img.mobile-image { display: none; } @media (max-width: 767px) { .banner-popup .popup-image img { display: none; } .banner-popup .popup-image img.mobile-image { display: block; } } @media (min-width: 768px) { .banner-popup .popup-image { display: none; } } .banner-popup .popup-content { width: 100%; max-width: 370px; padding: 25px 30px; background: white; } @media (max-width: 767px) { .banner-popup .popup-content { padding: 10px; max-width: 100%; } } @media (min-width: 768px) { .banner-popup .popup-content { background: transparent; } } @media (min-width: 768px) { .banner-popup { flex-direction: row; } .banner-popup.left-middle-content { align-items: center; justify-content: flex-start; } .banner-popup.right-middle-content { align-items: center; justify-content: flex-end; } .banner-popup.center-middle-content { align-items: center; justify-content: center; } } @media (max-width: 767px) { .banner-popup.mobile-individual .popup-image { display: flex; align-items: center; justify-content: flex-start; min-height: 170px; padding: 20px; } .banner-popup.mobile-individual .popup-image h2 { max-width: 160px; font-size: 24px; line-height: 1.4; margin: 0; } .banner-popup.mobile-individual .popup-content { width: 100%; padding: 16px 17px; } .banner-popup.mobile-individual .popup-content h2 { display: none; } .banner-popup.mobile-individual .popup-content p { font-size: 15px; } .banner-popup.mobile-individual .popup-content button[type=submit], .banner-popup.mobile-individual .popup-content input[type=submit] { font-size: 13px; height: 48px; } .banner-popup.mobile-individual .popup-content #content-form-part-2 .banner-popup-form { margin-top: 25px; } } @media (max-width: 767px) { .banner-popup.mobile-absolute .popup-content { width: 100%; padding: 20px; } .banner-popup.mobile-absolute .popup-content h2 { font-size: 26px; } .banner-popup.mobile-absolute .popup-content p { font-size: 20px; } } .banner-popup .banner-popup-form { padding-right: 50px; } .banner-popup .banner-popup-form .hide-label { display: none; } .banner-popup .banner-popup-form .input { height: auto; margin-bottom: 10px; } .banner-popup .banner-popup-form input[type=text], .banner-popup .banner-popup-form input[type=email], .banner-popup .banner-popup-form select { border: 0; border-bottom: 1px solid #000; box-shadow: none; padding: 5px 0; background: transparent; width: 100%; font-size: 14px; border-radius: 0; } .banner-popup .banner-popup-form .input__ico { position: absolute; top: 11px; right: 0; width: 8px; height: 8px; display: block; pointer-events: none; } .banner-popup .banner-popup-form .row { margin-right: -0.7813rem; margin-left: -0.7813rem; } .banner-popup .banner-popup-form .form__footer { margin-top: 20px; margin-bottom: 20px; } .banner-popup .banner-popup-form .form__submit { width: auto; } .banner-popup .banner-popup-form .form__error { /*display: none;*/ position: absolute; font-size: 11px; margin-top: 2px; } .banner-popup .banner-popup-form ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #353439; } .banner-popup .banner-popup-form ::-moz-placeholder { /* Firefox 19+ */ color: #353439; } .banner-popup .banner-popup-form :-ms-input-placeholder { /* IE 10+ */ color: #353439; } .banner-popup .banner-popup-form :-moz-placeholder { /* Firefox 18- */ color: #353439; } @media (max-width: 767px) { .banner-popup .banner-popup-form { padding-right: 0; } .banner-popup .banner-popup-form .column, .banner-popup .banner-popup-form .columns { flex: 1 0 100%; padding: 0; } .banner-popup .banner-popup-form .row { margin-right: 0; margin-left: 0; } } .banner-popup .toggle-checkbox { display: block; position: relative; padding-left: 35px; margin-bottom: 11px; cursor: pointer; font-size: 13px; -webkit-user-select: none; -moz-user-select: none; user-select: none; } .banner-popup .toggle-checkbox input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .banner-popup .toggle-checkbox input:checked ~ .checkmark { background-color: #0079c1; } .banner-popup .toggle-checkbox input:checked ~ .checkmark:after { left: 12px; } .banner-popup .toggle-checkbox .checkmark { position: absolute; top: 0; left: 0; height: 14px; width: 25px; background-color: #b9b9b9; border-radius: 25px; transition: 0.5s ease all; } .banner-popup .toggle-checkbox .checkmark:after { content: ""; position: absolute; width: 10px; height: 10px; background: #fff; border-radius: 10px; top: 2px; left: 2px; transition: 0.5s ease all; } .banner-popup .toggle-checkbox:hover input ~ .checkmark { /*background-color: #0079c1;*/ } @media (max-width: 767px) { .banner-popup .toggle-checkbox { font-size: 14px; line-height: 1.4; } .banner-popup .toggle-checkbox .checkmark { top: 1px; } } .cc-color-override--332607608.cc-window { display: none !important; } @media screen and (min-width: 768px) { .template-none > section:last-child > .pagination-section { padding-top: 80px; padding-bottom: 130px; } } .template-search .hero { margin-bottom: 0; } @media screen and (min-width: 550px) { .template-search { margin-bottom: 45px; } } .template-stories > section.box:last-child { padding-bottom: 135px; padding-top: 50px; } .template-stories > section.box:last-child .carousel--offset .carousel__container { padding-bottom: 45px; padding-top: 45px; } .template-stories .hero__title { max-width: 800px; margin-bottom: 0; } @media screen and (max-width: 400px) { .template-stories .hero__title { font-size: 20px; line-height: 1.3; } } @media screen and (max-width: 400px) { .template-stories .news-landing__breaker { padding-bottom: 30px; } } .template-stories .hero { margin-bottom: 0; height: auto; min-height: calc(100vh - 60px); padding: 0; padding-top: 140px; } @media (min-width: 1024px) { .template-stories .hero { padding-top: 155px; } } @media (min-width: 1200px) { .template-stories .hero { padding-top: 175px; } } @media screen and (max-width: 400px) { .template-stories .hero--light .btn--ico, .template-stories .hero--dark .btn--ico { margin-left: 0; } } @media screen and (max-width: 400px) { .template-stories .hero__wrap .txt, .template-stories .hero__wrap .urgent__body p, .urgent__body .template-stories .hero__wrap p { font-size: 14px; } } @media screen and (max-width: 768px) { .template-stories .hero__wrap--btn { align-items: flex-start; } } .template-stories .m-video { position: relative; } .template-stories .m-video__bgImage { position: absolute; height: 100%; max-height: unset; } .template-stories .m-video__content { position: relative; padding: 55px 24px; } @media (min-width: 768px) { .template-stories .m-video__content { padding: 90px 24px; } } .state-user-visited .hero__scroll { display: none; } .state-user-not-visited .home__urgent { display: none; } .state-user-not-visited .home .hero { margin-bottom: 25px; } @media screen and (min-width: 550px) { .state-user-not-visited .home .hero { margin-bottom: 155px; } } .state-drawer-open { position: relative; overflow: hidden; } .a-tag { --tagSidePadding: 1em; display: inline-block; padding: 0.25em var(--tagSidePadding) 0.25em calc(var(--tagSidePadding) * 1.25); border-radius: 1em; background-color: #0072bc; color: white; letter-spacing: 0.1em; text-align: center; position: relative; } .a-tag::after { content: ""; position: absolute; z-index: 1; bottom: -1px; right: 0; width: 1em; height: 1em; background-color: #fff; transform: scale3d(0, 0, 0); transform-origin: 85% 85%; transition: transform 0.2s ease; border-top-left-radius: 1em; box-shadow: -2px -2px 3px rgba(0, 0, 0, 0.25); background-image: linear-gradient(135deg, rgba(0, 114, 188, 0.5) 50%, #b2b2b2 50%, #fafafa 60%); } .a-tag:hover::after, .a-tag:focus::after { transform: scale3d(1, 1, 1); } .a-button { --button__color: #0072bc; --button__textColor: #fff; --button__iconColor: var(--button__color); --button__borderWidth: 2px; --button__verticalPadding: 16px; --button__horizontalPadding: 15px; align-items: center; background-color: var(--button__color); border-radius: 4px; color: var(--button__textColor); font-size: 13px; font-weight: 500; font-weight: 700; display: inline-flex; gap: 10px; letter-spacing: 1.86px; line-height: 1; min-width: 170px; overflow: hidden; padding: calc(var(--button__verticalPadding) + var(--button__borderWidth)) var(--button__horizontalPadding); position: relative; text-transform: uppercase; text-wrap: balance; z-index: 0; } .a-button:hover::after, .a-button:focus::after { transform: translateX(0%); } .a-button::after { content: ""; background-color: var(--button__textColor); display: block; height: 100%; left: 0; opacity: 0.1; position: absolute; top: 0; transform: translateX(-100%); transition: transform 0.3s ease; width: 100%; } .a-button.-hollow, .a-button.-ghost, .a-button.-outline, .a-button.-inverse { background-color: transparent; border: var(--button__borderWidth) solid var(--button__color); color: var(--button__color); padding: var(--button__verticalPadding); transition: color 0.3s ease, background-color 0.3s ease; } .a-button.-hollow:hover, .a-button.-hollow:focus, .a-button.-ghost:hover, .a-button.-ghost:focus, .a-button.-outline:hover, .a-button.-outline:focus, .a-button.-inverse:hover, .a-button.-inverse:focus { color: var(--button__textColor); } .a-button.-hollow::after, .a-button.-ghost::after, .a-button.-outline::after, .a-button.-inverse::after { background-color: var(--button__color); opacity: 1; z-index: -1; } .a-button.-clear, .a-button.-clean, .a-button.-plain { background-color: transparent; color: var(--button__color); transition: filter 0.3s ease; } .a-button.-clear:hover, .a-button.-clear:focus, .a-button.-clean:hover, .a-button.-clean:focus, .a-button.-plain:hover, .a-button.-plain:focus { filter: brightness(1.2) contrast(1.2); } .a-button.-clear:hover.-white1, .a-button.-clear:hover.-white2, .a-button.-clear:hover.-yellow1, .a-button.-clear:focus.-white1, .a-button.-clear:focus.-white2, .a-button.-clear:focus.-yellow1, .a-button.-clean:hover.-white1, .a-button.-clean:hover.-white2, .a-button.-clean:hover.-yellow1, .a-button.-clean:focus.-white1, .a-button.-clean:focus.-white2, .a-button.-clean:focus.-yellow1, .a-button.-plain:hover.-white1, .a-button.-plain:hover.-white2, .a-button.-plain:hover.-yellow1, .a-button.-plain:focus.-white1, .a-button.-plain:focus.-white2, .a-button.-plain:focus.-yellow1 { filter: brightness(0.8) contrast(1.2); } .a-button.-clear::after, .a-button.-clean::after, .a-button.-plain::after { content: none; } .a-button.-clear .icon, .a-button.-clean .icon, .a-button.-plain .icon { color: var(--button__iconColor); } .a-button.-small { --button__verticalPadding: 11px; } .a-button.-large { --button__verticalPadding: 24px; } .a-button.-huge { --button__verticalPadding: 30px; } .a-button.-flexible { min-width: unset; } .a-button.-wide { --button__horizontalPadding: 45px ; } .a-button.-full { width: 100%; } .a-button.-left { text-align: left; } .a-button.-center { text-align: center; } .a-button.-right { text-align: right; } .a-button.-splitLeft { border-top-right-radius: 0; border-bottom-right-radius: 0; } .a-button.-splitCenter { border-radius: 0; margin-left: 1px; } .a-button.-splitRight { border-top-left-radius: 0; border-bottom-left-radius: 0; margin-left: 1px; } .a-button.-blue1 { --button__color: #0072bc; --button__textColor: #fff; } .a-button.-blue2 { --button__color: #66aad7; --button__textColor: #fff; } .a-button.-grey1 { --button__color: #f2f2f2; --button__textColor: #353439; } .a-button.-grey2 { --button__color: #b2b2b2; --button__textColor: #353439; } .a-button.-grey3 { --button__color: #9294a1; --button__textColor: #353439; } .a-button.-grey4 { --button__color: #797c8b; --button__textColor: #fff; } .a-button.-grey5 { --button__color: #4b4d59; --button__textColor: #fff; } .a-button.-grey6 { --button__color: #353439; --button__textColor: #fff; } .a-button.-yellow1 { --button__color: #FFD238; --button__textColor: #353439; } .a-button.-yellow1::after { background-color: #353439; } .a-button.-yellow2 { --button__color: #f0dd66; --button__textColor: #353439; } .a-button.-yellow3 { --button__color: #e6c600; --button__textColor: #353439; } .a-button.-orange1 { --button__color: #fe7000; --button__textColor: #fff; } .a-button.-orange2 { --button__color: #ff5800; --button__textColor: #fff; } .a-button.-red1 { --button__color: #f44c4c; --button__textColor: #fff; } .a-button.-red2 { --button__color: #ef3332; --button__textColor: #fff; } .a-button.-green1 { --button__color: #39ac67; --button__textColor: #fff; } .a-button.-green2 { --button__color: #5ecf8d; --button__textColor: #fff; } .a-button.-purple1 { --button__color: #920049; --button__textColor: #fff; } .a-button.-purple2 { --button__color: #620031; --button__textColor: #fff; } .a-button.-white1 { --button__color: #fff; --button__textColor: #353439; } .a-button.-white1::after { background-color: #353439; } .a-button.-white2 { --button__color: #fafafa; --button__textColor: #353439; } .a-button.-white2::after { background-color: #353439; } .a-button.-typed { display: block; } .a-button.-iconOnly { min-width: unset; justify-items: center; } .a-progressBar { -webkit-appearance: none; -moz-appearance: none; appearance: none; height: 35px; margin-left: auto; margin-right: auto; display: block; width: 95%; max-width: 640px; border: 1px solid #b2b2b2; border-radius: 35px; position: relative; background-color: #f2f2f2; overflow: hidden; } .a-progressBar::-webkit-progress-bar { background-color: transparent; } .a-progressBar::-webkit-progress-value { background-color: #0072bc; -webkit-transition: 2s ease-out width; transition: 2s ease-out width; will-change: width; } .a-progressBar::before { content: "Loading..."; position: absolute; left: 50%; top: 50%; font-weight: 600; color: #000000; opacity: 0.75; visibility: visible; transform: translate(-50%, -50%); transition: 1s ease-out opacity, 0s linear visibility; transition-delay: 1s, 0s; } .a-progressBar:not([value])::-moz-progress-bar { background-color: transparent; } .a-progressBar[value]::before { opacity: 0; visibility: hidden; transition-delay: 1s, 2s; } .a-progressBar[value]::-moz-progress-bar { background-color: #0072bc; } .m-fieldType.-checkboxGroup .form__desc { font-size: 0.9em; margin-top: 0; color: #b2b2b2; } .m-categories { display: flex; flex-flow: row wrap; align-items: center; justify-content: flex-start; gap: 0.5em 1em; } /*# sourceMappingURL=app.css.map*/