/** * Swiper 6.8.4 * 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: August 23, 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{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0px,0,0);transform:translate3d(0px,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-multirow-column>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-container-pointer-events{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-pointer-events.swiper-container-vertical{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:transform,height;transition-property:transform,height;transition-property:transform,height,-webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;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{-webkit-transform-style:preserve-3d;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:-webkit-gradient(linear,right top, left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));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:-webkit-gradient(linear,left top, right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));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:-webkit-gradient(linear,left bottom, left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));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:-webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));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{-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory}.swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper{-ms-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;text-transform:none;font-variant:initial;line-height:1}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{left:10px;right:auto}.swiper-button-prev:after,.swiper-container-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{right:10px;left:auto}.swiper-button-next:after,.swiper-container-rtl .swiper-button-prev:after{content:'next'}.swiper-button-next.swiper-button-white,.swiper-button-prev.swiper-button-white{--swiper-navigation-color:#ffffff}.swiper-button-next.swiper-button-black,.swiper-button-prev.swiper-button-black{--swiper-navigation-color:#000000}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:50%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:1;background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0px,-50%,0);transform:translate3d(0px,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s transform,.2s top;-o-transition:.2s transform,.2s top;transition:.2s transform,.2s top}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s transform,.2s left;-o-transition:.2s transform,.2s left;transition:.2s transform,.2s left}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s transform,.2s right;-o-transition:.2s transform,.2s right;transition:.2s transform,.2s right}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white{--swiper-pagination-color:#ffffff}.swiper-pagination-black{--swiper-pagination-color:#000000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s infinite linear;animation:swiper-preloader-spin 1s infinite linear;-webkit-box-sizing:border-box;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-container-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;-webkit-filter:blur(50px);filter:blur(50px)}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}@charset "UTF-8"; .button, .button-content { border-radius: 100px; } .button { display: inline-block; position: relative; -webkit-transition: -webkit-box-shadow 150ms; transition: -webkit-box-shadow 150ms; -o-transition: box-shadow 150ms; transition: box-shadow 150ms; transition: box-shadow 150ms, -webkit-box-shadow 150ms; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important; outline: none !important; -ms-touch-action: manipulation !important; touch-action: manipulation !important; } .button::before { content: ""; -webkit-box-sizing: border-box; box-sizing: border-box; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; border-width: 2px; border-style: solid; border-radius: 100px; -webkit-transform: scale3d(0.6, 0.6, 1); transform: scale3d(0.6, 0.6, 1); opacity: 0; -webkit-transition: opacity 150ms, -webkit-transform 150ms; transition: opacity 150ms, -webkit-transform 150ms; -o-transition: transform 150ms, opacity 150ms; transition: transform 150ms, opacity 150ms; transition: transform 150ms, opacity 150ms, -webkit-transform 150ms; pointer-events: none; } .button-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; min-width: 84px; height: 48px; background-clip: padding-box; padding: 0 28px; border-width: 0; border-style: solid; -webkit-transition: color 150ms, background 150ms, border 150ms; -o-transition: color 150ms, background 150ms, border 150ms; transition: color 150ms, background 150ms, border 150ms; cursor: pointer; } .button-content svg g, .button-content svg path, .button-content svg use { fill: currentColor; } .button-content input { width: auto !important; min-height: 48px; background: none; padding: 0 28px !important; border: 0; margin: 0 -28px; outline: 0; } .button-layout--icon-text .button-content { padding-left: 24px; } .button-layout--icon-text .button-content input { padding-left: 24px; margin-left: -24px; } .button-layout--icon-texts .button-content { padding-left: 24px; padding-right: 32px; } .button-layout--icon-texts input { padding-left: 24px; padding-right: 32px; margin-left: -24px; margin-right: -32px; } .button-layout--text-icon .button-content, .button-layout--texts-icon .button-content { padding-left: 32px; padding-right: 24px; } .button-layout--text-icon input, .button-layout--texts-icon input { padding-left: 32px; padding-right: 24px; margin-left: -32px; margin-right: -24px; } .button-layout--icon-text .button-content, .button-layout--icon-texts .button-content, .button-layout--text-icon .button-content, .button-layout--texts-icon .button-content { min-width: 0; } .button-text { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 500; font-size: 14px; line-height: 1; white-space: nowrap; } .button-text-small { display: block; font-size: 0.87em; } .button-text + .button-icon, .button-icon + .button-text { margin-left: 12px; } .button-transparent { color: #92a1ae; } .button-transparent .button-content { border-width: 1px; border-color: transparent; margin: -1px; } .button-transparent--border-gray { color: #92a1ae; } .button-transparent--border-gray .button-content { border-width: 2px; border-color: rgba(146, 161, 174, 0.25); margin: -2px; } .button-transparent--border-red { color: #ff0044; } .button-transparent--border-red .button-content { border-width: 2px; border-color: #ff0044; margin: -2px; } .button-red { color: white; -webkit-box-shadow: 0 4px 20px 0 rgba(255, 0, 68, 0.4); box-shadow: 0 4px 20px 0 rgba(255, 0, 68, 0.4); } .button-red .button-content { background-color: #ff0044; } .button-red--border-red { color: white; -webkit-box-shadow: 0 4px 20px 0 rgba(255, 0, 68, 0.4); box-shadow: 0 4px 20px 0 rgba(255, 0, 68, 0.4); } .button-red--border-red::before { border-color: #ff0044; } .button-red--border-red .button-content { background-color: #ff0044; } .button-transparent-red--border-red { color: #ff0044; -webkit-box-shadow: 0 4px 20px 0 rgba(255, 0, 68, 0.4); box-shadow: 0 4px 20px 0 rgba(255, 0, 68, 0.4); } .button-transparent-red--border-red::before { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); opacity: 1; border-color: #ff0044; } .button-transparent-red--border-red .button-content { background: transparent; -webkit-transition: color 150ms, background 300ms, border 300ms; -o-transition: color 150ms, background 300ms, border 300ms; transition: color 150ms, background 300ms, border 300ms; } .button-white { color: #ff0044; -webkit-box-shadow: 0 4px 20px 0 rgba(29, 31, 38, 0.1); box-shadow: 0 4px 20px 0 rgba(29, 31, 38, 0.1); } .button-white .button-content { background-color: white; border-width: 1px; border-color: transparent; margin: -1px; } .button-white--border-white { color: #ff0044; -webkit-box-shadow: 0 4px 20px 0 rgba(29, 31, 38, 0.1); box-shadow: 0 4px 20px 0 rgba(29, 31, 38, 0.1); } .button-white--border-white::before { border-color: white; } .button-white--border-white .button-content { background-color: white; } .button-transparent-white--border-white { color: white; } .button-transparent-white--border-white::before { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); border-color: white; } .button-transparent-white--border-white .button-content { background: transparent; -webkit-transition: color 150ms, background 300ms, border 300ms; -o-transition: color 150ms, background 300ms, border 300ms; transition: color 150ms, background 300ms, border 300ms; } .no-touchevents .button:active { -webkit-transition: -webkit-box-shadow 30ms; transition: -webkit-box-shadow 30ms; -o-transition: box-shadow 30ms; transition: box-shadow 30ms; transition: box-shadow 30ms, -webkit-box-shadow 30ms; } .no-touchevents .button:active::before { -webkit-transition: opacity 30ms, -webkit-transform 30ms; transition: opacity 30ms, -webkit-transform 30ms; -o-transition: transform 30ms, opacity 30ms; transition: transform 30ms, opacity 30ms; transition: transform 30ms, opacity 30ms, -webkit-transform 30ms; } .no-touchevents .button-content:active { -webkit-transition: color 30ms, background 30ms, border 30ms; -o-transition: color 30ms, background 30ms, border 30ms; transition: color 30ms, background 30ms, border 30ms; } .no-touchevents .button-transparent:hover .button-content { background-color: rgba(146, 161, 174, 0.1); border-color: rgba(146, 161, 174, 0.25); } .no-touchevents .button-transparent:active .button-content { background-color: rgba(146, 161, 174, 0.25); border-color: rgba(146, 161, 174, 0.6); } .no-touchevents .button-transparent--border-gray:hover, .no-touchevents .button-transparent--border-gray:active { color: #ff0044; } .no-touchevents .button-transparent--border-gray:hover .button-content, .no-touchevents .button-transparent--border-gray:active .button-content { border-color: #ff0044; } .no-touchevents .button-transparent--border-gray:active .button-content { background-color: rgba(146, 161, 174, 0.1); } .no-touchevents .button-transparent--border-red:hover, .no-touchevents .button-transparent--border-red:active { color: #ff0044; } .no-touchevents .button-transparent--border-red:hover .button-content, .no-touchevents .button-transparent--border-red:active .button-content { border-color: #ff0044; } .no-touchevents .button-transparent--border-red:hover { -webkit-box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.3); box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.3); } .no-touchevents .button-transparent--border-red:active { -webkit-box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.4); box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.4); } .no-touchevents .button-red:hover .button-content, .no-touchevents .button-red:active .button-content { background-color: #ff0044; } .no-touchevents .button-red:hover { -webkit-box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.5); box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.5); } .no-touchevents .button-red:active { -webkit-box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.5); box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.5); } .no-touchevents .button-red:active .button-content { -webkit-box-shadow: 0 0 0 1px rgba(29, 31, 38, 0.25) inset; box-shadow: 0 0 0 1px rgba(29, 31, 38, 0.25) inset; } .no-touchevents .button-red--border-red:hover, .no-touchevents .button-red--border-red:active { color: #ff0044; } .no-touchevents .button-red--border-red:hover::before, .no-touchevents .button-red--border-red:active::before { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); opacity: 1; } .no-touchevents .button-red--border-red:hover .button-content, .no-touchevents .button-red--border-red:active .button-content { background: transparent; } .no-touchevents .button-red--border-red:hover { -webkit-box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.5); box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.5); } .no-touchevents .button-red--border-red:active { -webkit-box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.5); box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.5); } .no-touchevents .button-transparent-red--border-red:hover, .no-touchevents .button-transparent-red--border-red:active { color: white; } .no-touchevents .button-transparent-red--border-red:hover::before, .no-touchevents .button-transparent-red--border-red:active::before { -webkit-transform: scale3d(0.6, 0.6, 1); transform: scale3d(0.6, 0.6, 1); opacity: 0; } .no-touchevents .button-transparent-red--border-red:hover .button-content, .no-touchevents .button-transparent-red--border-red:active .button-content { background-color: #ff0044; } .no-touchevents .button-transparent-red--border-red:hover { -webkit-box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.5); box-shadow: 0 4px 24px 0 rgba(255, 0, 68, 0.5); } .no-touchevents .button-transparent-red--border-red:active { -webkit-box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.5); box-shadow: 0 2px 10px 0 rgba(255, 0, 68, 0.5); } .no-touchevents .button-white:hover { -webkit-box-shadow: 0 4px 24px 0 rgba(26, 29, 41, 0.2); box-shadow: 0 4px 24px 0 rgba(26, 29, 41, 0.2); } .no-touchevents .button-white:active { color: #ff0044; -webkit-box-shadow: 0 2px 10px 0 rgba(137, 162, 184, 0.25); box-shadow: 0 2px 10px 0 rgba(137, 162, 184, 0.25); } .no-touchevents .button-white:active .button-content { border-color: rgba(146, 161, 174, 0.25); } .no-touchevents .button-white--border-white:hover, .no-touchevents .button-white--border-white:active { color: white; } .no-touchevents .button-white--border-white:hover::before, .no-touchevents .button-white--border-white:active::before { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); opacity: 1; } .no-touchevents .button-white--border-white:hover .button-content, .no-touchevents .button-white--border-white:active .button-content { background: transparent; } .no-touchevents .button-white--border-white:hover { -webkit-box-shadow: 0 4px 24px 0 rgba(26, 29, 41, 0.2); box-shadow: 0 4px 24px 0 rgba(26, 29, 41, 0.2); } .no-touchevents .button-white--border-white:active { -webkit-box-shadow: 0 2px 10px 0 rgba(137, 162, 184, 0.25); box-shadow: 0 2px 10px 0 rgba(137, 162, 184, 0.25); } .no-touchevents .button-transparent-white--border-white:hover, .no-touchevents .button-transparent-white--border-white:active { color: #ff0044; } .no-touchevents .button-transparent-white--border-white:hover::before, .no-touchevents .button-transparent-white--border-white:active::before { -webkit-transform: scale3d(0.6, 0.6, 1); transform: scale3d(0.6, 0.6, 1); opacity: 0; } .no-touchevents .button-transparent-white--border-white:hover .button-content, .no-touchevents .button-transparent-white--border-white:active .button-content { background-color: white; } .no-touchevents .button-transparent-white--border-white:hover { -webkit-box-shadow: 0 4px 24px 0 rgba(26, 29, 41, 0.2); box-shadow: 0 4px 24px 0 rgba(26, 29, 41, 0.2); } .no-touchevents .button-transparent-white--border-white:active { -webkit-box-shadow: 0 2px 10px 0 rgba(137, 162, 184, 0.25); box-shadow: 0 2px 10px 0 rgba(137, 162, 184, 0.25); } /** Remove autofill contact icon for Safari */ input::-webkit-contacts-auto-fill-button { visibility: hidden; display: none !important; pointer-events: none; position: absolute; right: 0; } /** Remove yellow background in autofilled inputs */ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active { -webkit-box-shadow: inset 0 0 0 9999px #25282F; background-clip: content-box !important; -webkit-text-fill-color: rgba(255, 255, 255, 0.75) !important; } @font-face { font-family: "TT Hoves Pro"; font-style: normal; font-weight: 300; src: url(/assets/files/TT_Hoves_Pro_Light-bf76677411459cdeccc19b437bb04a19.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "TT Hoves Pro"; font-style: normal; font-weight: 400; src: url(/assets/files/TT_Hoves_Pro_Regular-efe9545a2132eca7d5f8cea475d511c6.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "TT Hoves Pro"; font-style: normal; font-weight: 500; src: url(/assets/files/TT_Hoves_Pro_Medium-d309031b20ef7fbb6e9cb9d0ede69c90.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "TT Hoves Pro"; font-style: normal; font-weight: 600; src: url(/assets/files/TT_Hoves_Pro_SemiBold-bf93f9513aa77d3b9dc331554f6b050f.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "TT Hoves Pro"; font-style: normal; font-weight: 700; src: url(/assets/files/TT_Hoves_Pro_Bold-59c473210a9ceeade3b22fc643391816.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "TT Hoves Pro"; font-style: normal; font-weight: 800; src: url(/assets/files/TT_Hoves_Pro_ExtraBold-bf46b3551cba36ef5701d507a27d76a1.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "TT Hoves Pro"; font-style: normal; font-weight: 900; src: url(/assets/files/TT_Hoves_Pro_Black-b9f691627364c0532223c15eab03811a.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "Sofia"; font-style: normal; font-weight: 400; src: url(/assets/files/SofiaSansExtraCondensed-Regular-79e9ebe33a1fe1350e5b7481ba62c611.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "Sofia"; font-style: normal; font-weight: 600; src: url(/assets/files/SofiaSansExtraCondensed-SemiBold-6b06f0b31db2e1af57067a0596edecea.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "Sofia"; font-style: normal; font-weight: 700; src: url(/assets/files/SofiaSansExtraCondensed-Bold-c2f23157cf443e779f6f95280fdc41c2.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "Sofia"; font-style: normal; font-weight: 800; src: url(/assets/files/SofiaSansExtraCondensed-ExtraBold-2c751ea88eebfc02029ffec87c380f98.woff2) format("woff2"); font-display: swap; } @font-face { font-family: "Sofia"; font-style: normal; font-weight: 900; src: url(/assets/files/SofiaSansExtraCondensed-Black-1e3c8e808934bcbf0c41b4b3e9b01d56.woff2) format("woff2"); font-display: swap; } /*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */ /** * 1. Set default font family to sans-serif. * 2. Prevent iOS and IE text size adjust after device orientation change, * without disabling user zoom. */ html { font-family: sans-serif; /* 1 */ -ms-text-size-adjust: 100%; /* 2 */ -webkit-text-size-adjust: 100%; /* 2 */ } /** * Remove default margin. */ body { margin: 0; } /* HTML5 display definitions ========================================================================== */ /** * Correct `block` display not defined for any HTML5 element in IE 8/9. * Correct `block` display not defined for `details` or `summary` in IE 10/11 * and Firefox. * Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } /** * 1. Correct `inline-block` display not defined in IE 8/9. * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ } /** * Prevent modern browsers from displaying `audio` without controls. * Remove excess height in iOS 5 devices. */ audio:not([controls]) { display: none; height: 0; } /** * Address `[hidden]` styling not present in IE 8/9/10. * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22. */ [hidden], template { display: none; } /* Links ========================================================================== */ /** * Remove the gray background color from active links in IE 10. */ a { background-color: transparent; } /** * Improve readability of focused elements when they are also in an * active/hover state. */ a:active, a:hover { outline: 0; } /* Text-level semantics ========================================================================== */ /** * Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title] { border-bottom: 1px dotted; } /** * Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong { font-weight: bold; } /** * Address styling not present in Safari and Chrome. */ dfn { font-style: italic; } /** * Address variable `h1` font-size and margin within `section` and `article` * contexts in Firefox 4+, Safari, and Chrome. */ h1 { font-size: 2em; margin: .67em 0; } /** * Address styling not present in IE 8/9. */ mark { color: black; background: #ff0; } /** * Address inconsistent and variable font size in all browsers. */ small { font-size: 80%; } /** * Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -.5em; } sub { bottom: -.25em; } /* Embedded content ========================================================================== */ /** * Remove border when inside `a` element in IE 8/9/10. */ img { border: 0; } /** * Correct overflow not hidden in IE 9/10/11. */ svg:not(:root) { overflow: hidden; } /* Grouping content ========================================================================== */ /** * Address margin not present in IE 8/9 and Safari. */ figure { margin: 1em 40px; } /** * Address differences between Firefox and other browsers. */ hr { -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; } /** * Contain overflow in all browsers. */ pre { overflow: auto; } /** * Address odd `em`-unit font size rendering in all browsers. */ code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* Forms ========================================================================== */ /** * Known limitation: by default, Chrome and Safari on OS X allow very limited * styling of `select`, unless a `border` property is set. */ /** * 1. Correct color not being inherited. * Known issue: affects color of disabled elements. * 2. Correct font properties not being inherited. * 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea { font: inherit; /* 2 */ margin: 0; /* 3 */ color: inherit; /* 1 */ } /** * Address `overflow` set to `hidden` in IE 8/9/10/11. */ button { overflow: visible; } /** * Address inconsistent `text-transform` inheritance for `button` and `select`. * All other form control elements do not inherit `text-transform` values. * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. * Correct `select` style inheritance in Firefox. */ button, select { text-transform: none; } /** * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` * and `video` controls. * 2. Correct inability to style clickable `input` types in iOS. * 3. Improve usability and consistency of cursor style between image-type * `input` and others. */ button, html input[type='button'], input[type='reset'], input[type='submit'] { cursor: pointer; /* 3 */ -webkit-appearance: button; /* 2 */ } /** * Re-set default cursor for disabled elements. */ button[disabled], html input[disabled] { cursor: default; } /** * Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } /** * Address Firefox 4+ setting `line-height` on `input` using `!important` in * the UA stylesheet. */ input { line-height: normal; } /** * It's recommended that you don't attempt to style these elements. * Firefox's implementation doesn't respect box-sizing, padding, or width. * * 1. Address box sizing set to `content-box` in IE 8/9/10. * 2. Remove excess padding in IE 8/9/10. */ input[type='checkbox'], input[type='radio'] { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ } /** * Fix the cursor style for Chrome's increment/decrement buttons. For certain * `font-size` values of the `input`, it causes the cursor style of the * decrement button to change from `default` to `text`. */ input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button { height: auto; } /** * 1. Address `appearance` set to `searchfield` in Safari and Chrome. * 2. Address `box-sizing` set to `border-box` in Safari and Chrome. */ input[type='search'] { -webkit-box-sizing: content-box; box-sizing: content-box; /* 2 */ -webkit-appearance: textfield; /* 1 */ } /** * Remove inner padding and search cancel button in Safari and Chrome on OS X. * Safari (but not Chrome) clips the cancel button when the search input has * padding (and `textfield` appearance). */ input[type='search']::-webkit-search-cancel-button, input[type='search']::-webkit-search-decoration { -webkit-appearance: none; } /** * Define consistent border, margin, and padding. */ fieldset { margin: 0 2px; padding: .35em .625em .75em; border: 1px solid #c0c0c0; } /** * 1. Correct `color` not being inherited in IE 8/9/10/11. * 2. Remove padding so people aren't caught out if they zero out fieldsets. */ legend { padding: 0; /* 2 */ border: 0; /* 1 */ } /** * Remove default vertical scrollbar in IE 8/9/10/11. */ textarea { overflow: auto; } /** * Don't inherit the `font-weight` (applied by a rule above). * NOTE: the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup { font-weight: bold; } /* Tables ========================================================================== */ /** * Remove most spacing between table cells. */ table { border-spacing: 0; border-collapse: collapse; } td, th { padding: 0; } div[role="button"] { -webkit-tap-highlight-color: transparent; } div[role="button"]:focus-within, div[role="button"]:focus-visible, div[role="button"]:focus { outline: none; } body { font-family: 'Helvetica CY', Arial, 'Nimbus Sans L', sans-serif; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-size: 10px; scroll-behavior: smooth; position: relative; min-height: 100vh; -webkit-font-smoothing: antialiased; } * { -webkit-box-sizing: border-box; box-sizing: border-box; } body, a { color: #2e2e2e; } h1, h2, h3, h4, h5, h6 { font-size: 1em; } h1, h2, h3, h4, h5, h6, p, ul, ol { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6, strong, b { font-weight: bold; } h1 i, h1 em, h1 q, h2 i, h2 em, h2 q, h3 i, h3 em, h3 q, h4 i, h4 em, h4 q, h5 i, h5 em, h5 q, h6 i, h6 em, h6 q, strong i, strong em, strong q, b i, b em, b q { font-weight: bold; font-style: italic; } i, em, q { font-style: italic; } a, a:hover { text-decoration: none; } ul, ol { list-style: none; } address { font-style: normal; display: block; } input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill { background-color: transparent; } /* Hide Play button + controls on iOS */ video::-webkit-media-controls { display: none !important; } .g-hide { display: none !important; } .g-hidden { visibility: hidden !important; } .g-invisible { opacity: 0 !important; } @media only screen and (min-width: 1025px) { .g-zoom { font-size: 0.78125vw; } } @media only screen and (min-width: 1920px) { .g-zoom { font-size: 1.5em; } } .privacy-modal { background-color: #15171b; position: fixed; width: 100vw; height: 100vh; height: 100%; overflow: auto; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 120px 0; top: 0; left: 0; z-index: 100; display: none; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .privacy-modal { padding: 80px 0; } } @media only screen and (max-width: 767px) { .privacy-modal { padding: 60px 0; } } .privacy-modal_close-btn { background: url(/assets/files/i-32-cross-76729f95be7b00e31ac302e6064b6937.svg) 50% 50% no-repeat transparent; opacity: 0.7; background-size: auto 32px; position: fixed; z-index: 500; color: white; right: 0; top: 0; cursor: pointer; width: 64px; height: 64px; -webkit-transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out; -o-transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out; transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out; } .privacy-modal_close-btn:hover { opacity: 1; background-color: #ff0044; } @media only screen and (max-width: 1024px) { .privacy-modal_close-btn { background-size: auto 20px; width: 40px; height: 40px; } } .privacy-modal_inner { margin: auto; } @media only screen and (min-width: 1280px) { .privacy-modal_inner { width: calc(1150px * 8 / 12); } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .privacy-modal_inner { width: calc(920px * 8 / 12); } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .privacy-modal_inner { width: calc(93.75vw * 8 / 12); } } @media only screen and (max-width: 767px) { .privacy-modal_inner { width: 87.5vw; } } .privacy-modal_title { color: #ff0044; } .privacy-modal_title-main { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 72px; line-height: 1.08; color: #ff0044; margin-bottom: 0.54em; } @media only screen and (max-width: 1024px) { .privacy-modal_title-main { font-size: 58px; } } @media only screen and (max-width: 767px) { .privacy-modal_title-main { font-size: 28px; } } .privacy-modal_title-second { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 28px; line-height: 1.28; color: #ff0044; margin-bottom: 0.64em; margin-top: 56px; } @media only screen and (max-width: 1024px) { .privacy-modal_title-second { font-size: 24px; } } @media only screen and (max-width: 767px) { .privacy-modal_title-second { font-size: 18px; } } .privacy-modal_paragraph, .privacy-modal li, .privacy-modal_link { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; } @media only screen and (max-width: 767px) { .privacy-modal_paragraph, .privacy-modal li, .privacy-modal_link { font-size: 16px; } } .privacy-modal_paragraph, .privacy-modal li { color: rgba(255, 255, 255, 0.75); } .privacy-modal_link { color: #ff0044; } .privacy-modal_link:hover { color: white; } @media only screen and (min-width: 1025px) { .privacy-modal li { padding-left: calc((1150px / 12) * 0.3); } } .privacy-modal li::before { content: "\2014"; margin-right: 0.3em; } .cookie-msg { z-index: 99; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #17181f; } @media only screen and (min-width: 768px) { .cookie-msg { position: fixed; width: 260px; max-width: 87.5vw; padding: 12px 56px 12px 24px; } } @media only screen and (min-width: 1025px) { .cookie-msg { bottom: 40px; left: 24px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .cookie-msg { top: 86px; right: 24px; } } @media only screen and (max-width: 767px) { .cookie-msg { position: absolute; padding: 13px 40px 17px 21px; width: 100%; left: 0; top: 62px; } } .cookie-msg--hidden { display: none; } .cookie-msg__text { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 500; font-size: 14px; line-height: 1.57; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.785em; color: white; margin-bottom: 0; } @media only screen and (max-width: 767px) { .cookie-msg__text { padding-right: 5em; } } .cookie-msg__close-btn { position: absolute; top: 12px; right: 14px; cursor: pointer; width: 20px; height: 20px; } .cookie-msg__close-btn g { fill: white; } .cookie-msg__close-btn:hover g { fill: #ff0044; } /** * Common layout **/ iframe[name='google_conversion_frame'] { position: absolute; height: 0; } .l-header { position: fixed; z-index: 30; top: 0; left: 0; width: 100%; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } @media only screen and (min-width: 1025px) { .l-header { background: rgba(249, 249, 249, 0.9); -webkit-box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05), 0 4px 16px 0 rgba(0, 0, 0, 0.05); box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05), 0 4px 16px 0 rgba(0, 0, 0, 0.05); -webkit-transition: background .3s ease-in-out; -o-transition: background .3s ease-in-out; transition: background .3s ease-in-out; } @supports ((-webkit-backdrop-filter: initial) or (backdrop-filter: initial)) { .l-header { -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px); background-color: rgba(255, 255, 255, 0.9); } } .l-header--transparent { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; -webkit-box-shadow: none; box-shadow: none; } .l-header--sticky { position: -webkit-sticky; position: sticky; } } .l-header nav a, .l-header nav a span { -webkit-transition: color .3s ease-in-out; -o-transition: color .3s ease-in-out; transition: color .3s ease-in-out; } .l-body-wrapper.hidden { display: none; } .l-body-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; min-height: 100vh; } .l-footer { min-height: 200px; background-color: #1d1f26; position: relative; } .l-column { font-size: 1em; margin: 0 auto; } @media only screen and (max-width: 767px) { .l-column { width: 87.5vw; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .l-column { width: 86.32813vw; } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .l-column { width: 98em; } } @media only screen and (min-width: 1280px) { .l-column { width: 115em; } } .noscroll { overflow: hidden; } @media only screen and (max-width: 1024px) { .noscroll { position: fixed; right: 0; left: 0; width: 100%; height: 100%; } } .touchevents .noscroll, .noscroll.touchevents { position: fixed; right: 0; left: 0; width: 100%; height: 100%; } @media only screen and (max-width: 1024px) { .scrollable { overflow-y: auto !important; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } } .disable-pointer-events, .disable-pointer-events * { pointer-events: none !important; } .container:after { content: ""; display: table; clear: both; } .row, .row-reverse { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } .gr-0, .gr-1, .gr-2, .gr-3, .gr-4, .gr-5, .gr-6, .gr-7, .gr-8 { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } .gr-adapt { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } .gr-grow { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } .push-0, .push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8 { position: relative; } .pull-0, .pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8 { position: relative; } .nowrap { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap > * { white-space: normal; } .wrap { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } .gr-centered { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } @media screen and (max-width: 767px) { .container\@mobile:after { content: ""; display: table; clear: both; } } @media screen and (max-width: 767px) { .row\@mobile, .row-reverse\@mobile { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } } @media screen and (max-width: 767px) { .gr-0\@mobile, .gr-1\@mobile, .gr-2\@mobile, .gr-3\@mobile, .gr-4\@mobile, .gr-5\@mobile, .gr-6\@mobile, .gr-7\@mobile, .gr-8\@mobile { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (max-width: 767px) { .gr-adapt\@mobile { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (max-width: 767px) { .gr-grow\@mobile { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (max-width: 767px) { .push-0\@mobile, .push-1\@mobile, .push-2\@mobile, .push-3\@mobile, .push-4\@mobile, .push-5\@mobile, .push-6\@mobile, .push-7\@mobile, .push-8\@mobile { position: relative; } } @media screen and (max-width: 767px) { .pull-0\@mobile, .pull-1\@mobile, .pull-2\@mobile, .pull-3\@mobile, .pull-4\@mobile, .pull-5\@mobile, .pull-6\@mobile, .pull-7\@mobile, .pull-8\@mobile { position: relative; } } @media screen and (max-width: 767px) { .nowrap\@mobile { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap\@mobile > * { white-space: normal; } } @media screen and (max-width: 767px) { .wrap\@mobile { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } } @media screen and (max-width: 767px) { .gr-centered\@mobile { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .container\@tablet:after { content: ""; display: table; clear: both; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .row\@tablet, .row-reverse\@tablet { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-0\@tablet, .gr-1\@tablet, .gr-2\@tablet, .gr-3\@tablet, .gr-4\@tablet, .gr-5\@tablet, .gr-6\@tablet, .gr-7\@tablet, .gr-8\@tablet { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-adapt\@tablet { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-grow\@tablet { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .push-0\@tablet, .push-1\@tablet, .push-2\@tablet, .push-3\@tablet, .push-4\@tablet, .push-5\@tablet, .push-6\@tablet, .push-7\@tablet, .push-8\@tablet { position: relative; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .pull-0\@tablet, .pull-1\@tablet, .pull-2\@tablet, .pull-3\@tablet, .pull-4\@tablet, .pull-5\@tablet, .pull-6\@tablet, .pull-7\@tablet, .pull-8\@tablet { position: relative; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .nowrap\@tablet { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap\@tablet > * { white-space: normal; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .wrap\@tablet { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-centered\@tablet { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } } @media screen and (min-width: 1025px) { .container\@desktop:after { content: ""; display: table; clear: both; } } @media screen and (min-width: 1025px) { .row\@desktop, .row-reverse\@desktop { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } } @media screen and (min-width: 1025px) { .gr-0\@desktop, .gr-1\@desktop, .gr-2\@desktop, .gr-3\@desktop, .gr-4\@desktop, .gr-5\@desktop, .gr-6\@desktop, .gr-7\@desktop, .gr-8\@desktop { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 1025px) { .gr-adapt\@desktop { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 1025px) { .gr-grow\@desktop { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 1025px) { .push-0\@desktop, .push-1\@desktop, .push-2\@desktop, .push-3\@desktop, .push-4\@desktop, .push-5\@desktop, .push-6\@desktop, .push-7\@desktop, .push-8\@desktop { position: relative; } } @media screen and (min-width: 1025px) { .pull-0\@desktop, .pull-1\@desktop, .pull-2\@desktop, .pull-3\@desktop, .pull-4\@desktop, .pull-5\@desktop, .pull-6\@desktop, .pull-7\@desktop, .pull-8\@desktop { position: relative; } } @media screen and (min-width: 1025px) { .nowrap\@desktop { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap\@desktop > * { white-space: normal; } } @media screen and (min-width: 1025px) { .wrap\@desktop { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } } @media screen and (min-width: 1025px) { .gr-centered\@desktop { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } } @media screen and (max-width: 400px) { @-ms-viewport { width: device-width; } } #gridle-settings { content: '{ "version" : "2.0.48", "states" : { "default":{ "name" : "default", "min-width" : null, "max-width" : null, "query" : null, "classes" : true, "context" : "8", "column-width" : null, "gutter-width" : "4em", "gutter-height" : "0", "gutter-top" : "0", "gutter-right" : "2em", "gutter-bottom" : "0", "gutter-left" : "2em", "direction" : "ltr", "dir-attribute" : false, "name-multiplicator" : "1", "states-classes" : false, "classes-prefix" : null, "_" : true }, "mobile":{ "name" : "mobile", "min-width" : null, "max-width" : "767px", "query" : "screen and (max-width: 767px)", "classes" : true, "context" : "8", "column-width" : null, "gutter-width" : "4em", "gutter-height" : "0", "gutter-top" : "0", "gutter-right" : "2em", "gutter-bottom" : "0", "gutter-left" : "2em", "direction" : "ltr", "dir-attribute" : false, "name-multiplicator" : "1", "states-classes" : false, "classes-prefix" : null, "_" : true }, "tablet":{ "name" : "tablet", "min-width" : "768px", "max-width" : "1024px", "query" : "screen and (min-width: 768px) and (max-width: 1024px)", "classes" : true, "context" : "8", "column-width" : null, "gutter-width" : "4em", "gutter-height" : "0", "gutter-top" : "0", "gutter-right" : "2em", "gutter-bottom" : "0", "gutter-left" : "2em", "direction" : "ltr", "dir-attribute" : false, "name-multiplicator" : "1", "states-classes" : false, "classes-prefix" : null, "_" : true }, "desktop":{ "name" : "desktop", "min-width" : "1025px", "max-width" : null, "query" : "screen and (min-width: 1025px)", "classes" : true, "context" : "8", "column-width" : null, "gutter-width" : "4em", "gutter-height" : "0", "gutter-top" : "0", "gutter-right" : "2em", "gutter-bottom" : "0", "gutter-left" : "2em", "direction" : "ltr", "dir-attribute" : false, "name-multiplicator" : "1", "states-classes" : false, "classes-prefix" : null, "_" : true }} }'; } .gr-0 { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0 { left: 0%; right: auto; } .pull-0 { right: 0%; left: auto; } .prefix-0 { margin-left: 0%; } .suffix-0 { margin-right: 0%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0 { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1 { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1 { left: 12.5%; right: auto; } .pull-1 { right: 12.5%; left: auto; } .prefix-1 { margin-left: 12.5%; } .suffix-1 { margin-right: 12.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2 { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2 { left: 25%; right: auto; } .pull-2 { right: 25%; left: auto; } .prefix-2 { margin-left: 25%; } .suffix-2 { margin-right: 25%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2 { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3 { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3 { left: 37.5%; right: auto; } .pull-3 { right: 37.5%; left: auto; } .prefix-3 { margin-left: 37.5%; } .suffix-3 { margin-right: 37.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4 { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4 { left: 50%; right: auto; } .pull-4 { right: 50%; left: auto; } .prefix-4 { margin-left: 50%; } .suffix-4 { margin-right: 50%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5 { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5 { left: 62.5%; right: auto; } .pull-5 { right: 62.5%; left: auto; } .prefix-5 { margin-left: 62.5%; } .suffix-5 { margin-right: 62.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5 { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6 { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6 { left: 75%; right: auto; } .pull-6 { right: 75%; left: auto; } .prefix-6 { margin-left: 75%; } .suffix-6 { margin-right: 75%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6 { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7 { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7 { left: 87.5%; right: auto; } .pull-7 { right: 87.5%; left: auto; } .prefix-7 { margin-left: 87.5%; } .suffix-7 { margin-right: 87.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7 { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8 { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8 { left: 100%; right: auto; } .pull-8 { right: 100%; left: auto; } .prefix-8 { margin-left: 100%; } .suffix-8 { margin-right: 100%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8 { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left { float: left; } .float-right { float: right; } .clear { clear: both; } .clear-left { clear: left; } .clear-right { clear: right; } .no-gutter { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left { padding-left: 0; } .no-gutter-right { padding-right: 0; } .no-gutter-top { padding-top: 0; } .no-gutter-bottom { padding-bottom: 0; } .gutter { padding-right: 2em; padding-left: 2em; } .gutter-left { padding-left: 2em; } .gutter-right { padding-right: 2em; } .auto-height { height: inherit; } .row { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse { margin-left: 0 !important; margin-right: 0 !important; } .row-full { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide { display: none; } .not-visible { visibility: hidden; } .show { display: block; } .show-inline { display: inline-block; } .visible { visibility: visible; } .row-debug { position: relative; z-index: 99999; overflow: hidden; } .row-debug:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } @media screen and (max-width: 767px) { .gr-0\@mobile { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0\@mobile { left: 0%; right: auto; } .pull-0\@mobile { right: 0%; left: auto; } .prefix-0\@mobile { margin-left: 0%; } .suffix-0\@mobile { margin-right: 0%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0\@mobile { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1\@mobile { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1\@mobile { left: 12.5%; right: auto; } .pull-1\@mobile { right: 12.5%; left: auto; } .prefix-1\@mobile { margin-left: 12.5%; } .suffix-1\@mobile { margin-right: 12.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1\@mobile { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2\@mobile { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2\@mobile { left: 25%; right: auto; } .pull-2\@mobile { right: 25%; left: auto; } .prefix-2\@mobile { margin-left: 25%; } .suffix-2\@mobile { margin-right: 25%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2\@mobile { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3\@mobile { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3\@mobile { left: 37.5%; right: auto; } .pull-3\@mobile { right: 37.5%; left: auto; } .prefix-3\@mobile { margin-left: 37.5%; } .suffix-3\@mobile { margin-right: 37.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3\@mobile { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4\@mobile { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4\@mobile { left: 50%; right: auto; } .pull-4\@mobile { right: 50%; left: auto; } .prefix-4\@mobile { margin-left: 50%; } .suffix-4\@mobile { margin-right: 50%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4\@mobile { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5\@mobile { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5\@mobile { left: 62.5%; right: auto; } .pull-5\@mobile { right: 62.5%; left: auto; } .prefix-5\@mobile { margin-left: 62.5%; } .suffix-5\@mobile { margin-right: 62.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5\@mobile { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6\@mobile { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6\@mobile { left: 75%; right: auto; } .pull-6\@mobile { right: 75%; left: auto; } .prefix-6\@mobile { margin-left: 75%; } .suffix-6\@mobile { margin-right: 75%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6\@mobile { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7\@mobile { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7\@mobile { left: 87.5%; right: auto; } .pull-7\@mobile { right: 87.5%; left: auto; } .prefix-7\@mobile { margin-left: 87.5%; } .suffix-7\@mobile { margin-right: 87.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7\@mobile { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8\@mobile { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8\@mobile { left: 100%; right: auto; } .pull-8\@mobile { right: 100%; left: auto; } .prefix-8\@mobile { margin-left: 100%; } .suffix-8\@mobile { margin-right: 100%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8\@mobile { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left\@mobile { float: left; } .float-right\@mobile { float: right; } .clear\@mobile { clear: both; } .clear-left\@mobile { clear: left; } .clear-right\@mobile { clear: right; } .no-gutter\@mobile { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left\@mobile { padding-left: 0; } .no-gutter-right\@mobile { padding-right: 0; } .no-gutter-top\@mobile { padding-top: 0; } .no-gutter-bottom\@mobile { padding-bottom: 0; } .gutter\@mobile { padding-right: 2em; padding-left: 2em; } .gutter-left\@mobile { padding-left: 2em; } .gutter-right\@mobile { padding-right: 2em; } .auto-height\@mobile { height: inherit; } .row\@mobile { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row\@mobile { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse\@mobile { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse\@mobile { margin-left: 0 !important; margin-right: 0 !important; } .row-full\@mobile { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col\@mobile { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse\@mobile { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left\@mobile { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center\@mobile { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right\@mobile { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle\@mobile { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top\@mobile { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom\@mobile { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around\@mobile { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between\@mobile { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide\@mobile { display: none; } .not-visible\@mobile { visibility: hidden; } .show\@mobile { display: block; } .show-inline\@mobile { display: inline-block; } .visible\@mobile { visibility: visible; } .row-debug\@mobile { position: relative; z-index: 99999; overflow: hidden; } .row-debug\@mobile:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-0\@tablet { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0\@tablet { left: 0%; right: auto; } .pull-0\@tablet { right: 0%; left: auto; } .prefix-0\@tablet { margin-left: 0%; } .suffix-0\@tablet { margin-right: 0%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0\@tablet { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1\@tablet { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1\@tablet { left: 12.5%; right: auto; } .pull-1\@tablet { right: 12.5%; left: auto; } .prefix-1\@tablet { margin-left: 12.5%; } .suffix-1\@tablet { margin-right: 12.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1\@tablet { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2\@tablet { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2\@tablet { left: 25%; right: auto; } .pull-2\@tablet { right: 25%; left: auto; } .prefix-2\@tablet { margin-left: 25%; } .suffix-2\@tablet { margin-right: 25%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2\@tablet { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3\@tablet { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3\@tablet { left: 37.5%; right: auto; } .pull-3\@tablet { right: 37.5%; left: auto; } .prefix-3\@tablet { margin-left: 37.5%; } .suffix-3\@tablet { margin-right: 37.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3\@tablet { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4\@tablet { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4\@tablet { left: 50%; right: auto; } .pull-4\@tablet { right: 50%; left: auto; } .prefix-4\@tablet { margin-left: 50%; } .suffix-4\@tablet { margin-right: 50%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4\@tablet { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5\@tablet { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5\@tablet { left: 62.5%; right: auto; } .pull-5\@tablet { right: 62.5%; left: auto; } .prefix-5\@tablet { margin-left: 62.5%; } .suffix-5\@tablet { margin-right: 62.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5\@tablet { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6\@tablet { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6\@tablet { left: 75%; right: auto; } .pull-6\@tablet { right: 75%; left: auto; } .prefix-6\@tablet { margin-left: 75%; } .suffix-6\@tablet { margin-right: 75%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6\@tablet { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7\@tablet { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7\@tablet { left: 87.5%; right: auto; } .pull-7\@tablet { right: 87.5%; left: auto; } .prefix-7\@tablet { margin-left: 87.5%; } .suffix-7\@tablet { margin-right: 87.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7\@tablet { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8\@tablet { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8\@tablet { left: 100%; right: auto; } .pull-8\@tablet { right: 100%; left: auto; } .prefix-8\@tablet { margin-left: 100%; } .suffix-8\@tablet { margin-right: 100%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8\@tablet { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left\@tablet { float: left; } .float-right\@tablet { float: right; } .clear\@tablet { clear: both; } .clear-left\@tablet { clear: left; } .clear-right\@tablet { clear: right; } .no-gutter\@tablet { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left\@tablet { padding-left: 0; } .no-gutter-right\@tablet { padding-right: 0; } .no-gutter-top\@tablet { padding-top: 0; } .no-gutter-bottom\@tablet { padding-bottom: 0; } .gutter\@tablet { padding-right: 2em; padding-left: 2em; } .gutter-left\@tablet { padding-left: 2em; } .gutter-right\@tablet { padding-right: 2em; } .auto-height\@tablet { height: inherit; } .row\@tablet { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row\@tablet { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse\@tablet { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse\@tablet { margin-left: 0 !important; margin-right: 0 !important; } .row-full\@tablet { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col\@tablet { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse\@tablet { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left\@tablet { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center\@tablet { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right\@tablet { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle\@tablet { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top\@tablet { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom\@tablet { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around\@tablet { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between\@tablet { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide\@tablet { display: none; } .not-visible\@tablet { visibility: hidden; } .show\@tablet { display: block; } .show-inline\@tablet { display: inline-block; } .visible\@tablet { visibility: visible; } .row-debug\@tablet { position: relative; z-index: 99999; overflow: hidden; } .row-debug\@tablet:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } } @media screen and (min-width: 1025px) { .gr-0\@desktop { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0\@desktop { left: 0%; right: auto; } .pull-0\@desktop { right: 0%; left: auto; } .prefix-0\@desktop { margin-left: 0%; } .suffix-0\@desktop { margin-right: 0%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0\@desktop { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1\@desktop { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1\@desktop { left: 12.5%; right: auto; } .pull-1\@desktop { right: 12.5%; left: auto; } .prefix-1\@desktop { margin-left: 12.5%; } .suffix-1\@desktop { margin-right: 12.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1\@desktop { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2\@desktop { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2\@desktop { left: 25%; right: auto; } .pull-2\@desktop { right: 25%; left: auto; } .prefix-2\@desktop { margin-left: 25%; } .suffix-2\@desktop { margin-right: 25%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2\@desktop { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3\@desktop { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3\@desktop { left: 37.5%; right: auto; } .pull-3\@desktop { right: 37.5%; left: auto; } .prefix-3\@desktop { margin-left: 37.5%; } .suffix-3\@desktop { margin-right: 37.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3\@desktop { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4\@desktop { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4\@desktop { left: 50%; right: auto; } .pull-4\@desktop { right: 50%; left: auto; } .prefix-4\@desktop { margin-left: 50%; } .suffix-4\@desktop { margin-right: 50%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4\@desktop { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5\@desktop { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5\@desktop { left: 62.5%; right: auto; } .pull-5\@desktop { right: 62.5%; left: auto; } .prefix-5\@desktop { margin-left: 62.5%; } .suffix-5\@desktop { margin-right: 62.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5\@desktop { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6\@desktop { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6\@desktop { left: 75%; right: auto; } .pull-6\@desktop { right: 75%; left: auto; } .prefix-6\@desktop { margin-left: 75%; } .suffix-6\@desktop { margin-right: 75%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6\@desktop { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7\@desktop { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7\@desktop { left: 87.5%; right: auto; } .pull-7\@desktop { right: 87.5%; left: auto; } .prefix-7\@desktop { margin-left: 87.5%; } .suffix-7\@desktop { margin-right: 87.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7\@desktop { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8\@desktop { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8\@desktop { left: 100%; right: auto; } .pull-8\@desktop { right: 100%; left: auto; } .prefix-8\@desktop { margin-left: 100%; } .suffix-8\@desktop { margin-right: 100%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8\@desktop { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left\@desktop { float: left; } .float-right\@desktop { float: right; } .clear\@desktop { clear: both; } .clear-left\@desktop { clear: left; } .clear-right\@desktop { clear: right; } .no-gutter\@desktop { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left\@desktop { padding-left: 0; } .no-gutter-right\@desktop { padding-right: 0; } .no-gutter-top\@desktop { padding-top: 0; } .no-gutter-bottom\@desktop { padding-bottom: 0; } .gutter\@desktop { padding-right: 2em; padding-left: 2em; } .gutter-left\@desktop { padding-left: 2em; } .gutter-right\@desktop { padding-right: 2em; } .auto-height\@desktop { height: inherit; } .row\@desktop { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row\@desktop { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse\@desktop { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse\@desktop { margin-left: 0 !important; margin-right: 0 !important; } .row-full\@desktop { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col\@desktop { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse\@desktop { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left\@desktop { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center\@desktop { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right\@desktop { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle\@desktop { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top\@desktop { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom\@desktop { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around\@desktop { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between\@desktop { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide\@desktop { display: none; } .not-visible\@desktop { visibility: hidden; } .show\@desktop { display: block; } .show-inline\@desktop { display: inline-block; } .visible\@desktop { visibility: visible; } .row-debug\@desktop { position: relative; z-index: 99999; overflow: hidden; } .row-debug\@desktop:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } } [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } @media screen and (max-width: 767px) { [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } } @media screen and (min-width: 1025px) { [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } } .link, .b-project-section a { -webkit-transition: color .3s ease; -o-transition: color .3s ease; transition: color .3s ease; color: #5c5c5c; background-image: -webkit-gradient(linear, left top, left bottom, from(#ff0044), to(#ff0044)); background-image: -webkit-linear-gradient(#ff0044, #ff0044); background-image: -o-linear-gradient(#ff0044, #ff0044); background-image: linear-gradient(#ff0044, #ff0044); background-repeat: repeat-x; background-position: 0 95%; background-size: 1px 1px; } .link:hover, .b-project-section a:hover { color: #ff0044; } .h1 span, .h2 span, .h3 span { font-family: "Roboto", sans-serif; font-weight: 700; color: #ff0044; } .h1 span, .h2 span { line-height: 1.3; } .h1 span { font-size: 8em; } @media screen and (max-width: 767px) { .h1 span { font-size: 3.2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .h1 span { font-size: 6.4em; } } .h2 span { font-size: 5.7em; } @media screen and (max-width: 767px) { .h2 span { font-size: 2.28em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .h2 span { font-size: 4.56em; } } .h3 span { font-size: 4em; } @media screen and (max-width: 767px) { .h3 span { font-size: 1.6em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .h3 span { font-size: 3.2em; } } .h4 span { font-size: 2.8em; } @media screen and (max-width: 767px) { .h4 span { font-size: 1.12em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .h4 span { font-size: 2.24em; } } .p { margin-bottom: 2em; } @media screen and (max-width: 767px) { .p { margin-bottom: 1.4em; } } .p span { font-family: "Roboto", sans-serif; font-size: 2em; font-weight: 300; line-height: 1.8em; } @media screen and (max-width: 767px) { .p span { font-size: 1.6em; } } .list-title { margin-top: 2.7em; margin-bottom: 1.8em; } .unordered-list { margin-bottom: 3.1em; } .unordered-list ul { margin-top: 1.4em; } .unordered-list li { position: relative; margin-bottom: 1.4em; padding-left: 2.1em; } .unordered-list li::before { position: absolute; top: 1.1em; left: .1em; width: 1em; height: .2em; content: ''; background: #ff0044; } .unordered-list span { font-size: 1.8em; font-weight: 300; line-height: 1.35; } @media screen and (min-width: 768px) and (max-width: 1024px) { .unordered-list span { font-size: 2em; } } @media screen and (max-width: 767px) { .unordered-list span { font-size: 1.5em; } } .bold { font-weight: 500; color: #2e2e2e; } .bolder { font-weight: 900; color: #2e2e2e; } .lead { margin-bottom: 2.4em; } @media screen and (max-width: 767px) { .lead { margin-bottom: 1.4em; } } .lead span { font-family: "Roboto", sans-serif; font-size: 2.4em; font-weight: 300; line-height: 1.8em; } @media screen and (max-width: 767px) { .lead span { font-size: 1.6em; } } .lead span { font-weight: 400; line-height: 1.7; color: rgba(29, 31, 38, 0.7); } @media screen and (max-width: 767px) { .lead span { font-size: 1.8em; line-height: 1.5; } } .quote span { font-size: 2.2em; font-style: italic; line-height: 2.1; } @media screen and (max-width: 767px) { .quote span { font-size: 1.6em; } } .number span { font-family: "Roboto", sans-serif; font-weight: bold; color: rgba(46, 46, 46, 0.1); } .big-caption { font-size: 32em; font-weight: bold; line-height: 1; color: rgba(0, 0, 0, 0.03); } /** * Component Logo **/ /** * Component Navigation **/ /** * Component Request Estimate link **/ /** * Component Button **/ /** * Component Form Fields **/ .c-button { display: inline-block; vertical-align: top; position: relative; } .c-button_wrap { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; } .c-button_wrap svg { width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .c-button_wrap g { fill: #2e2e2e; } .c-button_content { position: relative; z-index: 2; padding: 0 20px; text-align: center; white-space: nowrap; outline: 0; } .c-field { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; color: #444; border: 1px solid rgba(255, 255, 255, 0.16); background-color: rgba(255, 255, 255, 0.04); } .c-field input::-webkit-input-placeholder, .c-field textarea::-webkit-input-placeholder { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 15px; line-height: 1.33; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.665em; } @media only screen and (max-width: 767px) { .c-field input::-webkit-input-placeholder, .c-field textarea::-webkit-input-placeholder { font-size: 13px; line-height: 1.53; } } .c-field input::-moz-placeholder, .c-field textarea::-moz-placeholder { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 15px; line-height: 1.33; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.665em; } @media only screen and (max-width: 767px) { .c-field input::-moz-placeholder, .c-field textarea::-moz-placeholder { font-size: 13px; line-height: 1.53; } } .c-field input:-ms-input-placeholder, .c-field textarea:-ms-input-placeholder { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 15px; line-height: 1.33; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.665em; } @media only screen and (max-width: 767px) { .c-field input:-ms-input-placeholder, .c-field textarea:-ms-input-placeholder { font-size: 13px; line-height: 1.53; } } .c-field.error { border-color: #ff0044; } .c-field.c-field--focused { border-color: white; } .c-field_label { color: #aeaeae; } .c-field_label span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 500; font-size: 14px; line-height: 1.57; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.785em; color: white; } .c-textfield { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; } @media only screen and (max-width: 1024px) { .c-textfield { height: 4.2em; padding: 1.1em 1.2em; } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .c-textfield { height: 3.9em; padding: 1em .8em; } } @media only screen and (min-width: 1280px) { .c-textfield { height: 4.2em; padding: 1.1em; } } .c-textarea { width: 100%; } .c-radiobutton { position: relative; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; cursor: default; } .c-radiobutton label { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 1.8em; } @media only screen and (max-width: 767px) { .c-radiobutton label { padding-left: 5em; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-radiobutton label { padding-left: 5.5em; } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .c-radiobutton label { padding-left: 4.9em; } } @media only screen and (min-width: 1280px) { .c-radiobutton label { padding-left: 5.2em; } } .c-radiobutton span { font-size: 1.6em; color: #5c5c5c; } .ui-radio + i { width: 2.4em; height: 2.4em; position: absolute; z-index: 1; top: 50%; left: 0; margin-top: -1.2em; background-image: url(/assets/files/button_radio-716aa557650ee01a87ab699309a2d98d.png); background-repeat: no-repeat; background-position: 0 -2.4em; background-size: 2.4em; } @media only screen and (min-width: 320px) and (min-device-pixel-ratio: 2), (min-width: 320px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 320px) and (-o-min-device-pixel-ratio: 2/1), (min-width: 320px) and (min-resolution: 192dpi), (min-width: 320px) and (min-resolution: 2dppx) { .ui-radio + i { background-image: url(/assets/files/button_radio@2x-a10d7fe537933f98c97a213f9940b38b.png); background-position: 0 -2.4em; } } .ui-radio:checked + i { background-image: url(/assets/files/button_radio-716aa557650ee01a87ab699309a2d98d.png); background-repeat: no-repeat; background-position: 0 0; background-size: 2.4em; } @media only screen and (min-width: 320px) and (min-device-pixel-ratio: 2), (min-width: 320px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 320px) and (-o-min-device-pixel-ratio: 2/1), (min-width: 320px) and (min-resolution: 192dpi), (min-width: 320px) and (min-resolution: 2dppx) { .ui-radio:checked + i { background-image: url(/assets/files/button_radio@2x-a10d7fe537933f98c97a213f9940b38b.png); background-position: 0 0; } } .ui-checkbox + i { width: 2.4em; height: 2.4em; position: absolute; z-index: 1; top: 50%; left: 0; margin-top: -1.2em; background-image: url(/assets/files/button_checkbox-f780c9e935ac16132ccd399ead1ba665.png); background-repeat: no-repeat; background-position: 0 -2.4em; background-size: 2.4em; } @media only screen and (min-width: 320px) and (min-device-pixel-ratio: 2), (min-width: 320px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 320px) and (-o-min-device-pixel-ratio: 2/1), (min-width: 320px) and (min-resolution: 192dpi), (min-width: 320px) and (min-resolution: 2dppx) { .ui-checkbox + i { background-image: url(/assets/files/button_checkbox@2x-5e6ecf1b0fb859d82f582d79f9c06b05.png); background-position: 0 -2.4em; } } .ui-checkbox:checked + i { background-image: url(/assets/files/button_checkbox-f780c9e935ac16132ccd399ead1ba665.png); background-repeat: no-repeat; background-position: 0 0; background-size: 2.4em; } @media only screen and (min-width: 320px) and (min-device-pixel-ratio: 2), (min-width: 320px) and (-webkit-min-device-pixel-ratio: 2), (min-width: 320px) and (-o-min-device-pixel-ratio: 2/1), (min-width: 320px) and (min-resolution: 192dpi), (min-width: 320px) and (min-resolution: 2dppx) { .ui-checkbox:checked + i { background-image: url(/assets/files/button_checkbox@2x-5e6ecf1b0fb859d82f582d79f9c06b05.png); background-position: 0 0; } } .ui-radio, .ui-checkbox { position: absolute; z-index: 2; top: 50%; left: 0; width: 2.4em; height: 2.4em; margin-top: -1.2em; opacity: 0; cursor: pointer; } .ui-textfield, .ui-textarea { margin: 0; padding: 0; border: 0; outline: 0; background: none; } @media only screen and (max-width: 1024px) { .ui-textfield, .ui-textarea { font-size: 1.8em; } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .ui-textfield, .ui-textarea { font-size: 1.6em; } } @media only screen and (min-width: 1280px) { .ui-textfield, .ui-textarea { font-size: 1.8em; } } .ui-textfield ~ .c-field_label, .ui-textarea ~ .c-field_label { position: absolute; top: -28px; left: 0; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; } .ui-textfield.full ~ .c-field_label, .ui-textarea.full ~ .c-field_label { opacity: 1; } @media only screen and (max-width: 1024px) { .ui-textfield.full ~ .c-field_label, .ui-textarea.full ~ .c-field_label { top: -28px; } } @media only screen and (min-width: 1025px) { .ui-textfield.full ~ .c-field_label, .ui-textarea.full ~ .c-field_label { top: -28px; } } .ui-textfield.required ~ .c-field_label, .ui-textarea.required ~ .c-field_label { padding-right: 1.4em; } .ui-textfield.required ~ .c-field_label:after, .ui-textarea.required ~ .c-field_label:after { font-size: 1.4em; position: absolute; z-index: 2; top: 0; right: 0; content: '*'; color: #ff0044; } .ui-textfield { width: 100%; } .ui-textarea { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 100%; resize: none; } @media only screen and (max-width: 1024px) { .ui-textarea { padding: 0.66667em 0.5em; } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .ui-textarea { padding: 0.75em 0.5625em; } } @media only screen and (min-width: 1280px) { .ui-textarea { padding: 0.66667em 0.5em; } } /** * Component Popup **/ .c-popup_close { background: url(/assets/files/i-32-cross-76729f95be7b00e31ac302e6064b6937.svg) 50% 50% no-repeat transparent; opacity: 0.7; background-size: auto 32px; position: absolute; z-index: 500; color: white; right: 0; top: 0; cursor: pointer; width: 64px; height: 64px; -webkit-transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out; -o-transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out; transition: background-color 0.3s ease-in-out, opacity 0.3s ease-in-out; } .c-popup_close:hover { opacity: 1; background-color: #ff0044; } @media only screen and (max-width: 1024px) { .c-popup_close { position: fixed; } } .c-popup_content { z-index: 1; top: 0; left: 0; width: 100%; height: 100%; } .c-popup.request_estimate { margin: auto; z-index: 2; background-color: #18191c; } @media only screen and (max-width: 1024px) { .c-popup.request_estimate { position: relative; top: 0; left: 0; width: 100%; height: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } } @media only screen and (max-width: 1024px) { .c-popup.request_estimate .c-popup_content { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: auto; min-height: 100%; } } .c-request_estimate { position: fixed; z-index: 40; width: 100%; -webkit-tap-highlight-color: transparent; } @media only screen and (max-width: 1024px) { .c-request_estimate { top: 0; height: 100%; left: 0; background: #fff; overflow-x: hidden; } } @media only screen and (min-width: 1025px) { .c-request_estimate { top: 0; height: 100%; } } .c-request_estimate.finished .c-request_estimate_form { display: none; } .c-request_estimate.active .request_estimate_container { opacity: 1; } .request_estimate_container { position: relative; z-index: 2; width: 100%; height: 100%; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-sizing: border-box; box-sizing: border-box; opacity: 0; overflow-y: auto; } .c-slide.request_estimate { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; background-color: rgba(29, 31, 38, 0.9); -webkit-box-sizing: border-box; box-sizing: border-box; } .b-request_estimate-slide { position: relative; z-index: 2; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: #bfbfbf; background-color: rgba(29, 31, 38, 0.9); } @media only screen and (max-width: 767px) { .b-request_estimate-slide { min-height: 570px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-request_estimate-slide { min-height: 600px; } } .b-request_estimate-slide .b-request_content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 1em; background-color: #18191c; } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content { width: 100%; background-color: transparent; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-request_estimate-slide .b-request_content { padding: 72px 64px 64px; } } @media only screen and (max-width: 767px) { .b-request_estimate-slide .b-request_content { padding: 64px 0 0; } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content { width: calc(calc(100vw - 155px) / 12 * 8 - 1px); } } @media only screen and (max-width: 767px) { .b-request_estimate-slide .b-request_content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } .b-request_estimate-slide .b-request_content_part { -webkit-box-sizing: border-box; box-sizing: border-box; } .b-request_estimate-slide .b-request_content_part_inner { padding: 48px 0 56px; } @media only screen and (min-width: 1025px) and (max-width: 1199px) { .b-request_estimate-slide .b-request_content_part_inner { padding: 32px 0 48px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part_inner { padding: unset; } } .b-request_estimate-slide .b-request_content_part .b-request_form_inner { width: 100%; overflow: hidden; } .b-request_estimate-slide .b-request_content_part-1 { padding-right: 56px; } @media only screen and (min-width: 1200px) and (max-width: 1359px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: 64px; } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: 72px; } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: 80px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: unset; background-color: #18191c; padding: 48px 60px 64px; } } @media only screen and (min-width: 460px) and (max-width: 767px) { .b-request_estimate-slide .b-request_content_part-1 { padding-inline: 32px; } } @media only screen and (max-width: 459px) { .b-request_estimate-slide .b-request_content_part-1 { padding-inline: 24px; } } .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { padding-left: 64px; width: calc(8 * calc(100vw - 155px) / 12 - 67px); } @media only screen and (min-width: 1025px) and (max-width: 1199px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { padding-left: 56px; width: calc(7 * calc(100vw - 155px) / 12 - 56px); } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(7 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1560px) and (max-width: 1799px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(6 * calc(100vw - 155px) / 12 - 76px); } } @media only screen and (min-width: 1800px) and (max-width: 1919px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(5 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(4 * calc(100vw - 155px) / 12 - 80px); padding-left: 80px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: 100%; padding-left: unset; } } .b-request_estimate-slide .b-request_content_part-2 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; border-right: 1px solid rgba(255, 255, 255, 0.1); padding-left: 56px; } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-2 { border-right: unset; padding-left: unset; margin-bottom: 32px; } } @media only screen and (min-width: 1200px) and (max-width: 1359px) { .b-request_estimate-slide .b-request_content_part-2 { padding-left: 64px; } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-2 { padding-left: 72px; } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-2 { padding-left: 80px; } } .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-right: 56px; height: 100%; width: calc(calc(100vw - 155px) / 12 * 5 - 112px); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-right: 64px; width: calc(4 * calc(100vw - 155px) / 12 - 64px); } @media only screen and (min-width: 1025px) and (max-width: 1199px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-right: 56px; width: calc(5 * calc(100vw - 155px) / 12 - 56px); } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(5 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1560px) and (max-width: 1799px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(4 * calc(100vw - 155px) / 12 - 73px); } } @media only screen and (min-width: 1800px) and (max-width: 1919px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(5 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(4 * calc(100vw - 155px) / 12 - 80px); padding-right: 80px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: auto; padding-right: unset; gap: 32px; margin-bottom: 40px; } } @media only screen and (min-width: 460px) and (max-width: 767px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-inline: 32px; } } @media only screen and (max-width: 459px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-inline: 24px; } } .b-request_paragraph { font-family: "TT Hoves Pro", "Arial", sans-serif; font-weight: 300; color: white; font-size: 22px; line-height: 1.27; } @media only screen and (min-width: 1360px) and (max-width: 1799px) { .b-request_paragraph { font-size: 24px; line-height: 1.33; } } @media only screen and (min-width: 1800px) and (max-width: 1919px) { .b-request_paragraph { font-size: clamp(24px, calc(-36.5042px + 3.36134vw), 28px); } } @media only screen and (min-width: 1920px) { .b-request_paragraph { font-size: 28px; } } @media only screen and (max-width: 1024px) { .b-request_paragraph { font-size: 32px; line-height: 48px; } } @media only screen and (min-width: 460px) and (max-width: 767px) { .b-request_paragraph { font-size: 24px; line-height: 32px; } } @media only screen and (max-width: 459px) { .b-request_paragraph { font-size: 22px; line-height: 28px; } } /** * Component Shadow **/ .c-shadow { position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; opacity: 0; background: #000000; } @media only screen and (max-width: 1024px) { .c-request_estimate .c-shadow { display: none; } } @media only screen and (min-width: 1025px) { .c-request_estimate.active .c-shadow { opacity: 1; } } @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes spin { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /** * Component Request Estimate **/ .c-logo { position: relative; left: -20px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 100%; } @media only screen and (max-width: 1024px) { .c-logo { z-index: 2; -webkit-transition: opacity .4s ease .2s; -o-transition: opacity .4s ease .2s; transition: opacity .4s ease .2s; opacity: 1; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-logo { left: -12px; } } @media only screen and (max-width: 767px) { .c-logo { left: -14px; } } @media only screen and (max-width: 1024px) { .collapse .c-logo { display: none; -webkit-transition: opacity .2s ease; -o-transition: opacity .2s ease; transition: opacity .2s ease; opacity: 0; } } .c-logo:before { display: block; width: 21em; height: 4.6em; content: ' '; background-image: url(/assets/files/mercdev-logo-black-38738ac3e55531f1867e301e1fef28e5.svg), url(/assets/files/mercdev-logo-white-b6d4fd7c7e2c4b757714ae0a197997cc.svg); background-repeat: no-repeat; background-position: center; background-size: contain, 0; -webkit-transition: background-image .3s ease-in-out; -o-transition: background-image .3s ease-in-out; transition: background-image .3s ease-in-out; } @media only screen and (max-width: 1024px) { .c-logo:before { width: 17em; height: 3.6em; } } @media only screen and (max-width: 767px) { .c-logo:before { width: 14em; } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .c-logo:before { background-image: url(/assets/files/mercdev-logo-mini-black-12bee38d5d86ed21a16b463efc5cb637.svg), url(/assets/files/mercdev-logo-mini-white-c4bd644c578c2efc735217e919ecd1c1.svg); width: 8em; height: 6em; } } @media only screen and (min-width: 1025px) { .c-logo:before { margin-top: -6px; } .l-header--transparent .c-logo:before { background-image: url(/assets/files/mercdev-logo-white-b6d4fd7c7e2c4b757714ae0a197997cc.svg), url(/assets/files/mercdev-logo-black-38738ac3e55531f1867e301e1fef28e5.svg); } } @media only screen and (min-width: 1025px) and (min-width: 1025px) and (max-width: 1279px) { .l-header--transparent .c-logo:before { background-image: url(/assets/files/mercdev-logo-mini-white-c4bd644c578c2efc735217e919ecd1c1.svg), url(/assets/files/mercdev-logo-mini-black-12bee38d5d86ed21a16b463efc5cb637.svg); width: 8em; height: 6em; } } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .c-logo:before { margin-top: 0px; } } @-webkit-keyframes logo-fade-out { to { display: none; opacity: 0; } } @keyframes logo-fade-out { to { display: none; opacity: 0; } } @-webkit-keyframes logo-fade-in { to { display: block; opacity: 1; } } @keyframes logo-fade-in { to { display: block; opacity: 1; } } @media only screen and (max-width: 1024px) { .c-nav { position: fixed; z-index: 1; top: .8em; right: 1.2em; width: 4.4em; height: 4.4em; -webkit-transition: all 216.66667ms ease 416.66667ms; -o-transition: all 216.66667ms ease 416.66667ms; transition: all 216.66667ms ease 416.66667ms; } .c-nav.active { -webkit-box-sizing: border-box; box-sizing: border-box; width: auto; height: auto; -webkit-transition: none; -o-transition: none; transition: none; } .c-nav.active .c-nav_wrap { width: 100vw; height: 100%; min-height: 100vh; -webkit-transition: opacity 416.66667ms ease 216.66667ms; -o-transition: opacity 416.66667ms ease 216.66667ms; transition: opacity 416.66667ms ease 216.66667ms; opacity: 1; } .c-nav:before { position: absolute; z-index: 1; top: 0; right: 0; width: 4.4em; height: 4.4em; content: ''; -webkit-transition: all 633.33333ms ease, opacity 633.33333ms ease 416.66667ms; -o-transition: all 633.33333ms ease, opacity 633.33333ms ease 416.66667ms; transition: all 633.33333ms ease, opacity 633.33333ms ease 416.66667ms; opacity: 0; border-radius: 2.2em; background: #fff; } .c-nav:after { position: fixed; top: 0; right: 0; width: 100vw; height: 6.2em; content: ''; -webkit-transition: all 633.33333ms ease; -o-transition: all 633.33333ms ease; transition: all 633.33333ms ease; background: #fff; } .c-nav.active:after { opacity: 0; } .c-nav.collapse:after { top: .8em; right: 1.2em; width: 4.4em; height: 4.4em; border-radius: 2.2em; } } @media only screen and (orientation: landscape) and (max-width: 1024px) { .c-nav.active:before { top: 50%; right: 50%; width: 300vw; height: 300vw; margin: -150vw -150vw 0 0; -webkit-transition: all 633.33333ms ease, opacity 1ms ease; -o-transition: all 633.33333ms ease, opacity 1ms ease; transition: all 633.33333ms ease, opacity 1ms ease; opacity: 1; border-radius: 150vw; } } @media only screen and (orientation: portrait) and (max-width: 1024px) { .c-nav.active:before { top: 50%; right: 50%; width: 300vh; height: 300vh; margin: -150vh -150vh 0 0; -webkit-transition: all 633.33333ms ease, opacity 1ms ease; -o-transition: all 633.33333ms ease, opacity 1ms ease; transition: all 633.33333ms ease, opacity 1ms ease; opacity: 1; border-radius: 150vh; } } @media only screen and (max-width: 767px) { .c-nav.active:after { z-index: 4; background-color: white; opacity: 1; pointer-events: none; } } @media only screen and (min-width: 1025px) { .c-nav { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } } @media only screen and (max-width: 1024px) { .c-nav_wrap { position: fixed; z-index: 3; top: 0; right: 0; bottom: 0; left: 0; -webkit-box-sizing: border-box; box-sizing: border-box; width: 0; height: 0; -webkit-transition: all 0.5s ease 416.66667ms, opacity 416.66667ms ease; -o-transition: all 0.5s ease 416.66667ms, opacity 416.66667ms ease; transition: all 0.5s ease 416.66667ms, opacity 416.66667ms ease; opacity: 0; } } @media only screen and (max-width: 767px) { .c-nav_wrap { padding: 9em 0 10em 4em; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav_wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; padding: 10em 0 4em; } } @media only screen and (min-width: 1025px) { .c-nav_wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } } @media only screen and (min-width: 1025px) { .c-nav_list { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav_list { width: 100%; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; } } .c-nav_overlay { position: fixed; z-index: 4; top: 0; left: 0; display: none; width: 100%; height: 6.2em; background: #fff; -webkit-box-shadow: 0 0 4px 2px #ccc; box-shadow: 0 0 4px 2px #ccc; } @media only screen and (max-width: 767px) { .c-nav_overlay { z-index: 5; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav_overlay { -webkit-box-shadow: none; box-shadow: none; } } .c-nav_ico { display: none; } @media only screen and (max-width: 1024px) { .c-nav_ico { position: absolute; z-index: 4; top: 1.4em; right: 1em; display: block; width: 2.4em; height: 1.6em; } .c-nav_ico:before { padding: 28px 46px; content: ''; } } @media only screen and (max-width: 767px) { .c-nav_ico { z-index: 5; } } .c-nav_ico.active .top { top: 0.7em; -webkit-transition: top 233.33333ms ease-in-out 33.33333ms, -webkit-transform 266.66667ms ease-in-out 333.33333ms; transition: top 233.33333ms ease-in-out 33.33333ms, -webkit-transform 266.66667ms ease-in-out 333.33333ms; -o-transition: top 233.33333ms ease-in-out 33.33333ms, transform 266.66667ms ease-in-out 333.33333ms; transition: top 233.33333ms ease-in-out 33.33333ms, transform 266.66667ms ease-in-out 333.33333ms; transition: top 233.33333ms ease-in-out 33.33333ms, transform 266.66667ms ease-in-out 333.33333ms, -webkit-transform 266.66667ms ease-in-out 333.33333ms; -webkit-transform: rotate(45deg) translate3d(0, 0, 0); transform: rotate(45deg) translate3d(0, 0, 0); } .c-nav_ico.active .middle { top: 50%; margin-top: -.1em; -webkit-transition: -webkit-transform 266.66667ms ease-in-out 333.33333ms; transition: -webkit-transform 266.66667ms ease-in-out 333.33333ms; -o-transition: transform 266.66667ms ease-in-out 333.33333ms; transition: transform 266.66667ms ease-in-out 333.33333ms; transition: transform 266.66667ms ease-in-out 333.33333ms, -webkit-transform 266.66667ms ease-in-out 333.33333ms; -webkit-transform: rotate(45deg) translate3d(0, 0, 0); transform: rotate(45deg) translate3d(0, 0, 0); } .c-nav_ico.active .bottom { bottom: 0.7em; -webkit-transition: bottom 233.33333ms ease-in-out 33.33333ms, -webkit-transform 300ms ease-in-out 333.33333ms; transition: bottom 233.33333ms ease-in-out 33.33333ms, -webkit-transform 300ms ease-in-out 333.33333ms; -o-transition: bottom 233.33333ms ease-in-out 33.33333ms, transform 300ms ease-in-out 333.33333ms; transition: bottom 233.33333ms ease-in-out 33.33333ms, transform 300ms ease-in-out 333.33333ms; transition: bottom 233.33333ms ease-in-out 33.33333ms, transform 300ms ease-in-out 333.33333ms, -webkit-transform 300ms ease-in-out 333.33333ms; -webkit-transform: rotate(-45deg) translate3d(0, 0, 0); transform: rotate(-45deg) translate3d(0, 0, 0); } @media only screen and (max-width: 1024px) { .c-nav_ico_line { position: absolute; left: 0; width: 100%; height: .2em; -webkit-transition: all 266.66667ms ease-in-out 33.33333ms; -o-transition: all 266.66667ms ease-in-out 33.33333ms; transition: all 266.66667ms ease-in-out 33.33333ms; /*webGl hack*/ -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); border-radius: .1em; background-color: #ed3d24; } .c-nav_ico_line.top { top: 0; } .c-nav_ico_line.middle { top: 50%; margin-top: -.1em; } .c-nav_ico_line.bottom { bottom: 0; } } @media only screen and (min-width: 1025px) { .c-nav_ico_line { display: none; } } .c-nav_link_wrap { -webkit-transition: background-color .3s ease-in-out; -o-transition: background-color .3s ease-in-out; transition: background-color .3s ease-in-out; } @media only screen and (max-width: 767px) { .c-nav_link_wrap { width: 100%; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav_link_wrap { width: 100%; } } @media only screen and (min-width: 1025px) { .c-nav_link_wrap { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .c-nav_link_wrap:hover, .c-nav_link_wrap.active { background-color: white; } .c-nav_link_wrap:hover .c-nav_link span, .c-nav_link_wrap.active .c-nav_link span { color: #ff0044; } .l-header--transparent .c-nav_link_wrap:hover, .l-header--transparent .c-nav_link_wrap.active { background-color: transparent; } } .c-nav_link_wrap .b-nav_customer_support span, .c-nav_link_wrap .b-nav_customer_login span { color: rgba(29, 31, 38, 0.85); } .c-nav_link { text-transform: uppercase; } @media only screen and (max-width: 767px) { .c-nav_link { line-height: 54px; display: block; } .c-nav_link span { color: rgba(29, 31, 38, 0.85); } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav_link { display: inline-block; width: 100%; height: 100%; padding: 4em 0; text-align: center; } .c-nav_link:hover { background: #fcd9d4; } .c-nav_link span { font-size: 32px; line-height: 1em; } } @media only screen and (min-width: 1025px) { .c-nav_link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 0 1.9em; } .c-nav_link span { font-size: 14px; } .l-header--transparent .c-nav_link span { color: white; } } .c-nav_link span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 13px; line-height: 1.38; letter-spacing: 0.91px; text-transform: uppercase; color: #1d1f26; margin-bottom: 0.69em; margin-bottom: 0; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav_link span { font-size: 32px; } } @media only screen and (max-width: 767px) { .c-nav_footer { margin-top: 3em; } } @media only screen and (max-width: 767px) and (orientation: portrait) { .c-nav_footer { margin-bottom: 2em; } } @media only screen and (max-width: 767px) and (orientation: landscape) { .c-nav_footer { margin-bottom: 3em; } } @media only screen and (min-width: 1025px) { .c-nav_footer { display: none; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav_footer { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-flow: column-reverse nowrap; -ms-flex-flow: column-reverse nowrap; flex-flow: column-reverse nowrap; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; position: relative; top: -40px; min-height: 15em; margin: 0 auto; text-align: center; } } @media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) { .c-nav_footer { margin-bottom: 10em; } } @media only screen and (max-width: 1024px) { .b-nav_request_estimate_link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-nav_request_estimate_link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } @media only screen and (min-width: 1025px) { .b-nav_request_estimate_link { display: none; } } @media only screen and (min-width: 1025px) { .b-nav_customer_support, .b-nav_customer_login { display: none; } } .b-nav_footer_text { padding: 1.1em 0 1em; text-decoration: underline; opacity: .35; color: black; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-nav_footer_text { opacity: 1; color: #909090; } } .b-nav_footer_text span { font-size: 1.4em; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-nav_footer_text span { font-size: 1.6em; } } .b-nav_footer_email { display: inline-block; vertical-align: top; } .c-request_estimate_link { position: relative; } @media only screen and (min-width: 1025px) { .c-request_estimate_link { width: 21em; } } @media only screen and (max-width: 767px) { .c-request_estimate_link { letter-spacing: .08em; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-request_estimate_link { letter-spacing: 1.6px; } } @media only screen and (min-width: 1025px) { .l-header--transparent .c-request_estimate_link { color: white; } } @media only screen and (max-width: 1024px) { .c-request_estimate_link svg { width: 100%; height: 100%; } } .c-request_estimate_link .c-request_estimate_link_value_less-desktop { display: none; font-size: inherit; } @media only screen and (max-width: 1024px) { .c-request_estimate_link .c-request_estimate_link_value_less-desktop { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } } @media only screen and (max-width: 767px) { .c-request_estimate_link .c-request_estimate_link_value_less-desktop { height: 54px; } } .c-request_estimate_button { display: none; text-transform: none; } @media only screen and (min-width: 1025px) { .c-request_estimate_button { display: block; } } .c-request_estimate_link_icon { position: relative; margin-right: .62em; } @media only screen and (max-width: 767px) { .c-request_estimate_link_icon { width: 14px; height: 14px; margin-right: .6em; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-request_estimate_link_icon { width: 32px; height: 32px; margin-right: 1.2em; } } .c-request_estimate_link_icon svg g { fill: #ff0044; } .landing__request-estimate-section { position: relative; padding: 160px 0; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: #121418; overflow: hidden; } @media only screen and (max-width: 1024px) { .landing__request-estimate-section { padding-top: unset; padding-bottom: unset; } } .landing__request-estimate-section::before { content: "CONTACT US"; display: block; position: absolute; z-index: 1; bottom: 0; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 800; font-size: 300px; line-height: 1.07; color: rgba(146, 161, 174, 0.1); letter-spacing: 6px; margin-bottom: 0.535em; letter-spacing: 10px; white-space: nowrap; color: #1d1f26; margin-bottom: 0; } @media only screen and (min-width: 1025px) { .landing__request-estimate-section::before { left: 50%; bottom: -60px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } } @media only screen and (max-width: 1024px) { .landing__request-estimate-section::before { display: none; } } .landing__request-estimate-section .b-request_estimate-slide { position: relative; z-index: 2; background-color: transparent; min-height: 0; font-size: 10px; overflow: visible; } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .landing__request-estimate-section .b-request_submit { margin-left: 20px; } } .b-request_bg { z-index: 1; top: 0; left: 0; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; border: 1px solid rgba(255, 255, 255, 0.1); } @media only screen and (max-width: 1024px) { .b-request_bg { border: unset; } } .b-request_bg_inner { width: 100%; height: 100%; } .b-request_bg .b-request_content, .b-request_bg .b-request_content_part-1 { height: 100%; } .b-request_content { position: relative; z-index: 2; } @media only screen and (max-width: 1024px) { .b-request_content { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: auto; padding: 0; -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; } } .b-request_result { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; position: relative; z-index: 3; width: 100%; height: 100%; } @media only screen and (min-width: 1280px) { .b-request_result_fail { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } } .b-request_result_content { height: 40%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 40px; } @media only screen and (min-width: 1280px) { .b-request_result_content { min-width: 480px; } } .b-request_result_wrap { text-align: left; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .b-request_estimate-slide-cols { font-size: 10px; width: 100%; } .b-request_title { width: 100%; text-transform: uppercase; font-family: "Sofia", "Arial", sans-serif; color: #ff0044; font-size: 44px; line-height: 1.09; letter-spacing: 3.52px; font-weight: 800; margin-bottom: 24px; } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_title { font-size: 52px; line-height: 1.15; letter-spacing: 4.16px; } } @media only screen and (min-width: 1560px) and (max-width: 1799px) { .b-request_title { font-size: 48px; line-height: 60px; letter-spacing: 3.84px; } } @media only screen and (min-width: 1800px) and (max-width: 1919px) { .b-request_title { font-size: clamp(48px, calc(-73.0084px + 6.72269vw), 56px); } } @media only screen and (min-width: 1920px) { .b-request_title { font-size: 64px; line-height: 72px; letter-spacing: 5.12px; } } @media only screen and (max-width: 1024px) { .b-request_title { font-size: 80px; line-height: 1; margin-bottom: 16px; } } @media only screen and (min-width: 460px) and (max-width: 767px) { .b-request_title { font-size: 68px; line-height: 72px; letter-spacing: 5.44px; } } @media only screen and (min-width: 380px) and (max-width: 459px) { .b-request_title { font-size: 52px; line-height: 56px; letter-spacing: 4.16px; } } @media only screen and (max-width: 379px) { .b-request_title { font-size: 44px; line-height: 48px; letter-spacing: 3.52px; } } .b-request_contact { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; gap: 8px; } .b-request_contact .l-mail-link { width: -webkit-max-content; width: -moz-max-content; width: max-content; text-transform: uppercase; font-family: "Sofia", "Arial", sans-serif; font-weight: 900; color: #ff0044; -webkit-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; font-size: 14px; line-height: 1; letter-spacing: 1.4px; pointer-events: all; } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_contact .l-mail-link { font-size: 22px; line-height: 1.27; letter-spacing: 2.2px; } } @media only screen and (min-width: 1560px) { .b-request_contact .l-mail-link { font-size: 20px; line-height: 28px; letter-spacing: 2px; } } @media only screen and (min-width: 1920px) { .b-request_contact .l-mail-link { font-size: 24px; line-height: 32px; letter-spacing: 2.4px; } } @media only screen and (max-width: 1024px) { .b-request_contact .l-mail-link { font-size: 24px; line-height: 32px; letter-spacing: 2.4px; } } @media only screen and (min-width: 380px) and (max-width: 459px) { .b-request_contact .l-mail-link { font-size: 21px; line-height: 24px; letter-spacing: 2.1px; } } @media only screen and (max-width: 379px) { .b-request_contact .l-mail-link { font-size: 17px; line-height: 20px; letter-spacing: 1.7px; } } .b-request_contact .l-mail-link:hover { color: white; } .b-request_contact .l-mail-link:active { color: rgba(255, 255, 255, 0.75); } .b-request_contact .l-phone-link a { width: -webkit-max-content; width: -moz-max-content; width: max-content; font-family: "Sofia", "Arial", sans-serif; color: white; -webkit-transition: all 0.15s ease-in-out; -o-transition: all 0.15s ease-in-out; transition: all 0.15s ease-in-out; font-weight: 800; font-size: 32px; line-height: 1.19; letter-spacing: 2.56px; text-transform: uppercase; pointer-events: all; } @media only screen and (min-width: 1360px) and (max-width: 1919px) { .b-request_contact .l-phone-link a { font-size: 36px; line-height: 1.11; letter-spacing: 2.88px; } } @media only screen and (min-width: 1920px) { .b-request_contact .l-phone-link a { font-size: 40px; line-height: 48px; letter-spacing: 3.2px; } } @media only screen and (max-width: 1024px) { .b-request_contact .l-phone-link a { font-size: 44px; line-height: 1; letter-spacing: 3.52px; } } @media only screen and (min-width: 380px) and (max-width: 459px) { .b-request_contact .l-phone-link a { font-size: 38px; line-height: 38px; letter-spacing: 3.04px; } } @media only screen and (max-width: 379px) { .b-request_contact .l-phone-link a { font-size: 32px; line-height: 32px; letter-spacing: 2.56px; } } .b-request_contact .l-phone-link a:hover { color: #ff0044; } .b-request_contact .l-phone-link a:active { color: #ed4159; } .b-request_footer { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; margin: 25px 0 0; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-request_footer { margin: 40px auto 0; } } @media only screen and (max-width: 767px) { .b-request_footer { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } @media only screen and (min-width: 1280px) { .b-request_bg .b-request_footer { margin-top: 50px; } } @media only screen and (max-width: 767px) { .b-request_content { width: 100%; } .b-request_content .b-request_submit { width: 178px; margin: 27px 0 0; } .b-request_content .b-request_radio-wrapper { margin-top: 20px; } .b-request_content .b-request_radio .c-radiobutton { margin-bottom: 26px; } .b-request_content .b-request_radio .c-radiobutton:nth-child(1) { -webkit-box-ordinal-group: 2; -webkit-order: 1; -ms-flex-order: 1; order: 1; } .b-request_content .b-request_radio .c-radiobutton:nth-child(2) { -webkit-box-ordinal-group: 4; -webkit-order: 3; -ms-flex-order: 3; order: 3; } .b-request_content .b-request_radio .c-radiobutton:nth-child(3) { -webkit-box-ordinal-group: 3; -webkit-order: 2; -ms-flex-order: 2; order: 2; } .b-request_content .b-request_radio .c-radiobutton:nth-child(4) { -webkit-box-ordinal-group: 5; -webkit-order: 4; -ms-flex-order: 4; order: 4; } .b-request_content .b-request_radio .c-radiobutton:nth-child(5) { -webkit-box-ordinal-group: 6; -webkit-order: 5; -ms-flex-order: 5; order: 5; } .b-request_content .b-request_radio .c-radiobutton:nth-child(6) { -webkit-box-ordinal-group: 7; -webkit-order: 6; -ms-flex-order: 6; order: 6; } .b-request_content .b-request_radio .c-radiobutton .b-request_radio_custom { top: -11px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-request_content { padding: 0; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .b-request_content .b-request_submit { width: 178px; margin: 0; } .b-request_content .c-field.c-textarea { height: 137px; margin: 7em auto 0; } .b-request_content .b-request_user { width: 100%; margin-bottom: 30px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .b-request_content .b-request_user .c-field { display: inline-block; width: calc(50% - 8px); margin: 0; } .b-request_content .b-request_company { padding: 0; } .b-request_content .b-request_radio { display: block; padding: 10px 0 0 16px; } .b-request_content .b-request_radio-wrapper { margin-top: 40px; } .b-request_content .b-request_radio .c-radiobutton { display: inline-block; vertical-align: top; margin-bottom: 27px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) and (min-width: 768px) { .b-request_content .b-request_radio .c-radiobutton { width: 50%; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-request_content .b-request_radio .c-radiobutton:last-child { margin-bottom: 15px; } .b-request_content .b-request_radio .c-radiobutton label { padding-left: 38px; } .b-request_content .b-request_radio .c-radiobutton .b-request_radio_custom { width: 190px; } } @media only screen and (min-width: 1025px) { .b-request_content .b-request_submit { width: 178px; } .b-request_content .b-request_contact { bottom: -2px; left: 121px; } .b-request_content .c-field.c-textarea { height: 107px; } .b-request_content .b-request_user { margin-bottom: 28px; } .b-request_content .b-request_radio { padding: 10px 0 0 10px; } .b-request_content .b-request_radio-wrapper { margin-top: 20px; } .b-request_content .b-request_radio .c-radiobutton { display: inline-block; margin-right: 0; margin-bottom: 25px; width: 50%; } .b-request_content .b-request_radio .c-radiobutton label { padding-left: 38px; } .b-request_content .b-request_radio .c-radiobutton:last-child { margin-top: 0; } .b-request_content .b-request_radio .c-radiobutton .b-request_radio_custom { top: -14px; } } @media only screen and (min-width: 1280px) { .b-request_content .b-request_submit { width: 178px; margin: 0; } .b-request_content .c-field { height: 42px; padding: 11px 11px 10px; } .b-request_content .c-field input, .b-request_content .c-field textarea { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 15px; line-height: 1.33; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.665em; color: white; margin-bottom: 0; } } @media only screen and (min-width: 1280px) and (max-width: 767px) { .b-request_content .c-field input, .b-request_content .c-field textarea { font-size: 13px; line-height: 1.53; } } @media only screen and (min-width: 1280px) { .b-request_content .c-field input::-webkit-input-placeholder, .b-request_content .c-field textarea::-webkit-input-placeholder { color: rgba(255, 255, 255, 0.3); } .b-request_content .c-field input::-moz-placeholder, .b-request_content .c-field textarea::-moz-placeholder { color: rgba(255, 255, 255, 0.3); } .b-request_content .c-field input::-ms-input-placeholder, .b-request_content .c-field textarea::-ms-input-placeholder { color: rgba(255, 255, 255, 0.3); } .b-request_content .c-field input::placeholder, .b-request_content .c-field textarea::placeholder { color: rgba(255, 255, 255, 0.3); } .b-request_content .c-field.error input, .b-request_content .c-field.error textarea { color: #ff0044; } .b-request_content .c-field.c-textarea { height: 145px; } .b-request_content .b-request_user { margin-bottom: 35px; } .b-request_content .b-request_user .c-field { width: calc(50% - 20px); } .b-request_bg_inner .b-request_content .b-request_user .c-field { width: 270px; } } @media only screen and (min-width: 1280px) and (max-width: 1024px) { .b-request_content .b-request_user .c-field { width: 250px; max-width: 65vw; } } @media only screen and (min-width: 1280px) { .b-request_content .b-request_user .c-field:first-child { margin-right: 40px; } .b-request_content .b-request_radio { padding: 15px 0 0 13px; } .b-request_content .b-request_radio .c-radiobutton { display: inline-block; margin-bottom: 27px; } .b-request_content .b-request_radio .b-request_radio_custom { font-size: 16px; line-height: 18px; height: 38px; padding: 10px 8px 10px; } } /** * Component Header **/ /** * Component Copyright **/ /** * Component Customer Support **/ /** * Component Customer Login **/ .c-copyright span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 800; font-size: 11px; line-height: 1.27; letter-spacing: 0.55px; text-transform: uppercase; color: rgba(146, 161, 174, 0.6); margin-bottom: 0.5em; color: white; } .c-customer_support { text-transform: uppercase; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-customer_support { display: inline-block; width: 100%; height: 100%; letter-spacing: 1.6px; } .c-customer_support:hover { background: #fcd9d4; } } .c-customer_support span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 13px; line-height: 1.38; letter-spacing: 0.91px; text-transform: uppercase; color: #1d1f26; margin-bottom: 0.69em; color: rgba(255, 255, 255, 0.75); } .c-nav .c-customer_support span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 13px; line-height: 1.38; letter-spacing: 0.91px; text-transform: uppercase; color: #1d1f26; margin-bottom: 0.69em; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav .c-customer_support span { font-size: 32px; } } .c-customer_login { text-transform: uppercase; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-customer_login { display: inline-block; width: 100%; height: 100%; letter-spacing: 1.6px; } .c-customer_login:hover { background: #fcd9d4; } } .c-customer_login span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 13px; line-height: 1.38; letter-spacing: 0.91px; text-transform: uppercase; color: #1d1f26; margin-bottom: 0.69em; color: rgba(255, 255, 255, 0.75); } .c-nav .c-customer_login span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 13px; line-height: 1.38; letter-spacing: 0.91px; text-transform: uppercase; color: #1d1f26; margin-bottom: 0.69em; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-nav .c-customer_login span { font-size: 32px; } } /** * Component footer **/ .c-footer + .c-footer { margin-top: 15px; } @media only screen and (max-width: 1024px) { .c-footer + .c-footer { margin-top: 24px; } } .c-footer-badges-top { padding-top: 20px; } @media only screen and (max-width: 1024px) { .c-footer-badges-top { padding-top: 28px; } } .c-header { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; position: relative; } @media only screen and (max-width: 1024px) { .c-header { -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; height: 6.2em; } } @media only screen and (min-width: 1025px) { .c-header { height: 9em; text-transform: uppercase; } } @media only screen and (max-width: 1024px) { .b-header_request_estimate_link { display: none; } } @media only screen and (min-width: 1025px) { .b-header_request_estimate_link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } } .b-header_request_estimate_link .button, .no-touchevents .b-header_request_estimate_link .button { -webkit-box-shadow: none; box-shadow: none; } .header__request-estimate-link-container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -webkit-align-items: start; -ms-flex-align: start; align-items: start; width: 210px; min-width: 210px; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 500; font-size: 14px; line-height: 1; } @media only screen and (max-width: 1024px) { .header__request-estimate-link-container { display: none; } } .header__request-estimate-links { margin-left: auto; } .header__request-estimate-link, .header__phone { position: relative; white-space: nowrap; padding: 6px 0 6px 32px; -webkit-transition: color 150ms ease-in-out; -o-transition: color 150ms ease-in-out; transition: color 150ms ease-in-out; } .header__request-estimate-link div, .header__phone div { position: absolute; z-index: 1; left: 0; top: 50%; width: 20px; height: 20px; margin-top: -10px; } .header__request-estimate-link path, .header__phone path { fill: currentColor; } .header__request-estimate-link { text-transform: none; color: #ff0044; cursor: pointer; } .no-touchevents .header__request-estimate-link:hover { color: rgba(255, 0, 68, 0.7); } .no-touchevents .l-header--transparent .header__request-estimate-link:hover { color: white; } .header__phone { color: rgba(29, 31, 38, 0.7); } .l-header--transparent .header__phone { color: rgba(255, 255, 255, 0.75); } .c-footer { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; position: relative; min-height: 70px; color: white; } @media only screen and (max-width: 1024px) { .c-footer { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } .c-footer a { color: white; } .c-footer_links-wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } @media only screen and (max-width: 1024px) { .c-footer_links-wrapper { display: none; } } .c-footer_links-wrapper_item { opacity: 0.6; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; } @media (hover: hover) and (pointer: fine) { .c-footer_links-wrapper_item:hover { opacity: 1; } } .no-touchevents .c-footer_links-wrapper_item:hover { opacity: 1; } .c-footer_links-wrapper_item + .c-footer_links-wrapper_item { margin-left: 40px; } .c-footer_socials { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; margin: 0 auto; } .c-footer_socials_item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; width: 48px; height: 48px; border-radius: 25.5px; border: solid 2px rgba(255, 255, 255, 0.75); opacity: 0.6; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; padding: 12px; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-backface-visibility: hidden; } .c-footer_socials_item + .c-footer_socials_item { margin-left: 16px; } .no-touchevents .c-footer_socials_item:hover { opacity: 1; } @media (hover: hover) and (pointer: fine) { .c-footer_socials_item:hover { opacity: 1; } } .b-footer_contact { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; } @media only screen and (max-width: 1024px) { .b-footer_contact { text-align: center; margin-bottom: 32px; } } .b-footer_email { color: white; } .b-footer_email:hover > span { color: #ff0044; } .b-footer_email span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 400; font-size: 14px; line-height: 1.53; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.765em; color: rgba(255, 255, 255, 0.75); } .b-footer_address { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; } .b-footer_address .c-office { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; display: inline-block; vertical-align: top; padding: 0 2.4em; text-align: center; } .b-footer_address .c-office .c-office_phone { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.645em; margin-bottom: 0; } .b-footer_address .c-office .c-office_place { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 400; font-size: 14px; line-height: 1.53; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.765em; color: rgba(255, 255, 255, 0.75); margin-bottom: 0; } .c-badge { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; opacity: .4; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; -webkit-backface-visibility: hidden; } @media only screen and (max-width: 1024px) { .c-badge { margin: 20px; } } @media only screen and (max-width: 1024px) { .c-badge { margin: 15px 12px; } } @media (hover: hover) and (pointer: fine) { .c-badge:hover { opacity: .6; } } .c-badge_wrapper { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; width: 100%; } @media only screen and (max-width: 1024px) { .c-badge_wrapper { margin: 0 auto; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } .b-footer_customer_support, .b-footer_customer_login { -webkit-align-self: center; -ms-flex-item-align: center; align-self: center; display: block; } .container:after { content: ""; display: table; clear: both; } .row, .row-reverse { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } .gr-0, .gr-1, .gr-2, .gr-3, .gr-4, .gr-5, .gr-6, .gr-7, .gr-8 { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } .gr-adapt { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } .gr-grow { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } .push-0, .push-1, .push-2, .push-3, .push-4, .push-5, .push-6, .push-7, .push-8 { position: relative; } .pull-0, .pull-1, .pull-2, .pull-3, .pull-4, .pull-5, .pull-6, .pull-7, .pull-8 { position: relative; } .nowrap { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap > * { white-space: normal; } .wrap { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } .gr-centered { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } @media screen and (max-width: 767px) { .container\@mobile:after { content: ""; display: table; clear: both; } } @media screen and (max-width: 767px) { .row\@mobile, .row-reverse\@mobile { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } } @media screen and (max-width: 767px) { .gr-0\@mobile, .gr-1\@mobile, .gr-2\@mobile, .gr-3\@mobile, .gr-4\@mobile, .gr-5\@mobile, .gr-6\@mobile, .gr-7\@mobile, .gr-8\@mobile { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (max-width: 767px) { .gr-adapt\@mobile { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (max-width: 767px) { .gr-grow\@mobile { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (max-width: 767px) { .push-0\@mobile, .push-1\@mobile, .push-2\@mobile, .push-3\@mobile, .push-4\@mobile, .push-5\@mobile, .push-6\@mobile, .push-7\@mobile, .push-8\@mobile { position: relative; } } @media screen and (max-width: 767px) { .pull-0\@mobile, .pull-1\@mobile, .pull-2\@mobile, .pull-3\@mobile, .pull-4\@mobile, .pull-5\@mobile, .pull-6\@mobile, .pull-7\@mobile, .pull-8\@mobile { position: relative; } } @media screen and (max-width: 767px) { .nowrap\@mobile { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap\@mobile > * { white-space: normal; } } @media screen and (max-width: 767px) { .wrap\@mobile { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } } @media screen and (max-width: 767px) { .gr-centered\@mobile { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .container\@tablet:after { content: ""; display: table; clear: both; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .row\@tablet, .row-reverse\@tablet { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-0\@tablet, .gr-1\@tablet, .gr-2\@tablet, .gr-3\@tablet, .gr-4\@tablet, .gr-5\@tablet, .gr-6\@tablet, .gr-7\@tablet, .gr-8\@tablet { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-adapt\@tablet { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-grow\@tablet { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .push-0\@tablet, .push-1\@tablet, .push-2\@tablet, .push-3\@tablet, .push-4\@tablet, .push-5\@tablet, .push-6\@tablet, .push-7\@tablet, .push-8\@tablet { position: relative; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .pull-0\@tablet, .pull-1\@tablet, .pull-2\@tablet, .pull-3\@tablet, .pull-4\@tablet, .pull-5\@tablet, .pull-6\@tablet, .pull-7\@tablet, .pull-8\@tablet { position: relative; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .nowrap\@tablet { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap\@tablet > * { white-space: normal; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .wrap\@tablet { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-centered\@tablet { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } } @media screen and (min-width: 1025px) { .container\@desktop:after { content: ""; display: table; clear: both; } } @media screen and (min-width: 1025px) { .row\@desktop, .row-reverse\@desktop { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; } } @media screen and (min-width: 1025px) { .gr-0\@desktop, .gr-1\@desktop, .gr-2\@desktop, .gr-3\@desktop, .gr-4\@desktop, .gr-5\@desktop, .gr-6\@desktop, .gr-7\@desktop, .gr-8\@desktop { -webkit-box-flex: 0; -webkit-flex: 0 0 auto; -moz-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 1025px) { .gr-adapt\@desktop { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 0; -webkit-flex: 0 1 auto; -moz-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 1025px) { .gr-grow\@desktop { max-width: 100%; display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 2em; padding-left: 2em; } } @media screen and (min-width: 1025px) { .push-0\@desktop, .push-1\@desktop, .push-2\@desktop, .push-3\@desktop, .push-4\@desktop, .push-5\@desktop, .push-6\@desktop, .push-7\@desktop, .push-8\@desktop { position: relative; } } @media screen and (min-width: 1025px) { .pull-0\@desktop, .pull-1\@desktop, .pull-2\@desktop, .pull-3\@desktop, .pull-4\@desktop, .pull-5\@desktop, .pull-6\@desktop, .pull-7\@desktop, .pull-8\@desktop { position: relative; } } @media screen and (min-width: 1025px) { .nowrap\@desktop { -webkit-flex-wrap: nowrap; -ms-flex-wrap: none; flex-wrap: nowrap; white-space: nowrap; } .nowrap\@desktop > * { white-space: normal; } } @media screen and (min-width: 1025px) { .wrap\@desktop { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; white-space: normal; } } @media screen and (min-width: 1025px) { .gr-centered\@desktop { display: block !important; float: none !important; margin-left: auto !important; margin-right: auto !important; clear: both !important; } } .gr-0 { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0 { left: 0%; right: auto; } .pull-0 { right: 0%; left: auto; } .prefix-0 { margin-left: 0%; } .suffix-0 { margin-right: 0%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0 { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1 { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1 { left: 12.5%; right: auto; } .pull-1 { right: 12.5%; left: auto; } .prefix-1 { margin-left: 12.5%; } .suffix-1 { margin-right: 12.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1 { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2 { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2 { left: 25%; right: auto; } .pull-2 { right: 25%; left: auto; } .prefix-2 { margin-left: 25%; } .suffix-2 { margin-right: 25%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2 { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3 { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3 { left: 37.5%; right: auto; } .pull-3 { right: 37.5%; left: auto; } .prefix-3 { margin-left: 37.5%; } .suffix-3 { margin-right: 37.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3 { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4 { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4 { left: 50%; right: auto; } .pull-4 { right: 50%; left: auto; } .prefix-4 { margin-left: 50%; } .suffix-4 { margin-right: 50%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4 { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5 { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5 { left: 62.5%; right: auto; } .pull-5 { right: 62.5%; left: auto; } .prefix-5 { margin-left: 62.5%; } .suffix-5 { margin-right: 62.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5 { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6 { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6 { left: 75%; right: auto; } .pull-6 { right: 75%; left: auto; } .prefix-6 { margin-left: 75%; } .suffix-6 { margin-right: 75%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6 { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7 { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7 { left: 87.5%; right: auto; } .pull-7 { right: 87.5%; left: auto; } .prefix-7 { margin-left: 87.5%; } .suffix-7 { margin-right: 87.5%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7 { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8 { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8 { left: 100%; right: auto; } .pull-8 { right: 100%; left: auto; } .prefix-8 { margin-left: 100%; } .suffix-8 { margin-right: 100%; } .order-first { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8 { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left { float: left; } .float-right { float: right; } .clear { clear: both; } .clear-left { clear: left; } .clear-right { clear: right; } .no-gutter { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left { padding-left: 0; } .no-gutter-right { padding-right: 0; } .no-gutter-top { padding-top: 0; } .no-gutter-bottom { padding-bottom: 0; } .gutter { padding-right: 2em; padding-left: 2em; } .gutter-left { padding-left: 2em; } .gutter-right { padding-right: 2em; } .auto-height { height: inherit; } .row { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse { margin-left: 0 !important; margin-right: 0 !important; } .row-full { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide { display: none; } .not-visible { visibility: hidden; } .show { display: block; } .show-inline { display: inline-block; } .visible { visibility: visible; } .row-debug { position: relative; z-index: 99999; overflow: hidden; } .row-debug:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } @media screen and (max-width: 767px) { .gr-0\@mobile { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0\@mobile { left: 0%; right: auto; } .pull-0\@mobile { right: 0%; left: auto; } .prefix-0\@mobile { margin-left: 0%; } .suffix-0\@mobile { margin-right: 0%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0\@mobile { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1\@mobile { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1\@mobile { left: 12.5%; right: auto; } .pull-1\@mobile { right: 12.5%; left: auto; } .prefix-1\@mobile { margin-left: 12.5%; } .suffix-1\@mobile { margin-right: 12.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1\@mobile { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2\@mobile { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2\@mobile { left: 25%; right: auto; } .pull-2\@mobile { right: 25%; left: auto; } .prefix-2\@mobile { margin-left: 25%; } .suffix-2\@mobile { margin-right: 25%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2\@mobile { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3\@mobile { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3\@mobile { left: 37.5%; right: auto; } .pull-3\@mobile { right: 37.5%; left: auto; } .prefix-3\@mobile { margin-left: 37.5%; } .suffix-3\@mobile { margin-right: 37.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3\@mobile { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4\@mobile { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4\@mobile { left: 50%; right: auto; } .pull-4\@mobile { right: 50%; left: auto; } .prefix-4\@mobile { margin-left: 50%; } .suffix-4\@mobile { margin-right: 50%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4\@mobile { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5\@mobile { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5\@mobile { left: 62.5%; right: auto; } .pull-5\@mobile { right: 62.5%; left: auto; } .prefix-5\@mobile { margin-left: 62.5%; } .suffix-5\@mobile { margin-right: 62.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5\@mobile { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6\@mobile { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6\@mobile { left: 75%; right: auto; } .pull-6\@mobile { right: 75%; left: auto; } .prefix-6\@mobile { margin-left: 75%; } .suffix-6\@mobile { margin-right: 75%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6\@mobile { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7\@mobile { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7\@mobile { left: 87.5%; right: auto; } .pull-7\@mobile { right: 87.5%; left: auto; } .prefix-7\@mobile { margin-left: 87.5%; } .suffix-7\@mobile { margin-right: 87.5%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7\@mobile { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8\@mobile { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8\@mobile { left: 100%; right: auto; } .pull-8\@mobile { right: 100%; left: auto; } .prefix-8\@mobile { margin-left: 100%; } .suffix-8\@mobile { margin-right: 100%; } .order-first\@mobile { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8\@mobile { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last\@mobile { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left\@mobile { float: left; } .float-right\@mobile { float: right; } .clear\@mobile { clear: both; } .clear-left\@mobile { clear: left; } .clear-right\@mobile { clear: right; } .no-gutter\@mobile { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left\@mobile { padding-left: 0; } .no-gutter-right\@mobile { padding-right: 0; } .no-gutter-top\@mobile { padding-top: 0; } .no-gutter-bottom\@mobile { padding-bottom: 0; } .gutter\@mobile { padding-right: 2em; padding-left: 2em; } .gutter-left\@mobile { padding-left: 2em; } .gutter-right\@mobile { padding-right: 2em; } .auto-height\@mobile { height: inherit; } .row\@mobile { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row\@mobile { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse\@mobile { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse\@mobile { margin-left: 0 !important; margin-right: 0 !important; } .row-full\@mobile { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col\@mobile { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse\@mobile { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left\@mobile { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center\@mobile { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right\@mobile { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle\@mobile { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top\@mobile { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom\@mobile { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around\@mobile { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between\@mobile { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide\@mobile { display: none; } .not-visible\@mobile { visibility: hidden; } .show\@mobile { display: block; } .show-inline\@mobile { display: inline-block; } .visible\@mobile { visibility: visible; } .row-debug\@mobile { position: relative; z-index: 99999; overflow: hidden; } .row-debug\@mobile:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .gr-0\@tablet { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0\@tablet { left: 0%; right: auto; } .pull-0\@tablet { right: 0%; left: auto; } .prefix-0\@tablet { margin-left: 0%; } .suffix-0\@tablet { margin-right: 0%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0\@tablet { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1\@tablet { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1\@tablet { left: 12.5%; right: auto; } .pull-1\@tablet { right: 12.5%; left: auto; } .prefix-1\@tablet { margin-left: 12.5%; } .suffix-1\@tablet { margin-right: 12.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1\@tablet { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2\@tablet { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2\@tablet { left: 25%; right: auto; } .pull-2\@tablet { right: 25%; left: auto; } .prefix-2\@tablet { margin-left: 25%; } .suffix-2\@tablet { margin-right: 25%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2\@tablet { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3\@tablet { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3\@tablet { left: 37.5%; right: auto; } .pull-3\@tablet { right: 37.5%; left: auto; } .prefix-3\@tablet { margin-left: 37.5%; } .suffix-3\@tablet { margin-right: 37.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3\@tablet { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4\@tablet { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4\@tablet { left: 50%; right: auto; } .pull-4\@tablet { right: 50%; left: auto; } .prefix-4\@tablet { margin-left: 50%; } .suffix-4\@tablet { margin-right: 50%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4\@tablet { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5\@tablet { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5\@tablet { left: 62.5%; right: auto; } .pull-5\@tablet { right: 62.5%; left: auto; } .prefix-5\@tablet { margin-left: 62.5%; } .suffix-5\@tablet { margin-right: 62.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5\@tablet { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6\@tablet { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6\@tablet { left: 75%; right: auto; } .pull-6\@tablet { right: 75%; left: auto; } .prefix-6\@tablet { margin-left: 75%; } .suffix-6\@tablet { margin-right: 75%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6\@tablet { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7\@tablet { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7\@tablet { left: 87.5%; right: auto; } .pull-7\@tablet { right: 87.5%; left: auto; } .prefix-7\@tablet { margin-left: 87.5%; } .suffix-7\@tablet { margin-right: 87.5%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7\@tablet { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8\@tablet { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8\@tablet { left: 100%; right: auto; } .pull-8\@tablet { right: 100%; left: auto; } .prefix-8\@tablet { margin-left: 100%; } .suffix-8\@tablet { margin-right: 100%; } .order-first\@tablet { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8\@tablet { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last\@tablet { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left\@tablet { float: left; } .float-right\@tablet { float: right; } .clear\@tablet { clear: both; } .clear-left\@tablet { clear: left; } .clear-right\@tablet { clear: right; } .no-gutter\@tablet { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left\@tablet { padding-left: 0; } .no-gutter-right\@tablet { padding-right: 0; } .no-gutter-top\@tablet { padding-top: 0; } .no-gutter-bottom\@tablet { padding-bottom: 0; } .gutter\@tablet { padding-right: 2em; padding-left: 2em; } .gutter-left\@tablet { padding-left: 2em; } .gutter-right\@tablet { padding-right: 2em; } .auto-height\@tablet { height: inherit; } .row\@tablet { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row\@tablet { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse\@tablet { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse\@tablet { margin-left: 0 !important; margin-right: 0 !important; } .row-full\@tablet { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col\@tablet { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse\@tablet { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left\@tablet { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center\@tablet { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right\@tablet { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle\@tablet { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top\@tablet { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom\@tablet { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around\@tablet { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between\@tablet { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide\@tablet { display: none; } .not-visible\@tablet { visibility: hidden; } .show\@tablet { display: block; } .show-inline\@tablet { display: inline-block; } .visible\@tablet { visibility: visible; } .row-debug\@tablet { position: relative; z-index: 99999; overflow: hidden; } .row-debug\@tablet:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } } @media screen and (min-width: 1025px) { .gr-0\@desktop { -webkit-flex-basis: 0%; -ms-flex-preferred-size: 0%; flex-basis: 0%; max-width: 0%; } .push-0\@desktop { left: 0%; right: auto; } .pull-0\@desktop { right: 0%; left: auto; } .prefix-0\@desktop { margin-left: 0%; } .suffix-0\@desktop { margin-right: 0%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-0\@desktop { -webkit-box-ordinal-group: 1; -webkit-order: 0; -moz-order: 0; -ms-flex-order: 0; order: 0; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-1\@desktop { -webkit-flex-basis: 12.5%; -ms-flex-preferred-size: 12.5%; flex-basis: 12.5%; max-width: 12.5%; } .push-1\@desktop { left: 12.5%; right: auto; } .pull-1\@desktop { right: 12.5%; left: auto; } .prefix-1\@desktop { margin-left: 12.5%; } .suffix-1\@desktop { margin-right: 12.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-1\@desktop { -webkit-box-ordinal-group: 2; -webkit-order: 1; -moz-order: 1; -ms-flex-order: 1; order: 1; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-2\@desktop { -webkit-flex-basis: 25%; -ms-flex-preferred-size: 25%; flex-basis: 25%; max-width: 25%; } .push-2\@desktop { left: 25%; right: auto; } .pull-2\@desktop { right: 25%; left: auto; } .prefix-2\@desktop { margin-left: 25%; } .suffix-2\@desktop { margin-right: 25%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-2\@desktop { -webkit-box-ordinal-group: 3; -webkit-order: 2; -moz-order: 2; -ms-flex-order: 2; order: 2; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-3\@desktop { -webkit-flex-basis: 37.5%; -ms-flex-preferred-size: 37.5%; flex-basis: 37.5%; max-width: 37.5%; } .push-3\@desktop { left: 37.5%; right: auto; } .pull-3\@desktop { right: 37.5%; left: auto; } .prefix-3\@desktop { margin-left: 37.5%; } .suffix-3\@desktop { margin-right: 37.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-3\@desktop { -webkit-box-ordinal-group: 4; -webkit-order: 3; -moz-order: 3; -ms-flex-order: 3; order: 3; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-4\@desktop { -webkit-flex-basis: 50%; -ms-flex-preferred-size: 50%; flex-basis: 50%; max-width: 50%; } .push-4\@desktop { left: 50%; right: auto; } .pull-4\@desktop { right: 50%; left: auto; } .prefix-4\@desktop { margin-left: 50%; } .suffix-4\@desktop { margin-right: 50%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-4\@desktop { -webkit-box-ordinal-group: 5; -webkit-order: 4; -moz-order: 4; -ms-flex-order: 4; order: 4; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-5\@desktop { -webkit-flex-basis: 62.5%; -ms-flex-preferred-size: 62.5%; flex-basis: 62.5%; max-width: 62.5%; } .push-5\@desktop { left: 62.5%; right: auto; } .pull-5\@desktop { right: 62.5%; left: auto; } .prefix-5\@desktop { margin-left: 62.5%; } .suffix-5\@desktop { margin-right: 62.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-5\@desktop { -webkit-box-ordinal-group: 6; -webkit-order: 5; -moz-order: 5; -ms-flex-order: 5; order: 5; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-6\@desktop { -webkit-flex-basis: 75%; -ms-flex-preferred-size: 75%; flex-basis: 75%; max-width: 75%; } .push-6\@desktop { left: 75%; right: auto; } .pull-6\@desktop { right: 75%; left: auto; } .prefix-6\@desktop { margin-left: 75%; } .suffix-6\@desktop { margin-right: 75%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-6\@desktop { -webkit-box-ordinal-group: 7; -webkit-order: 6; -moz-order: 6; -ms-flex-order: 6; order: 6; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-7\@desktop { -webkit-flex-basis: 87.5%; -ms-flex-preferred-size: 87.5%; flex-basis: 87.5%; max-width: 87.5%; } .push-7\@desktop { left: 87.5%; right: auto; } .pull-7\@desktop { right: 87.5%; left: auto; } .prefix-7\@desktop { margin-left: 87.5%; } .suffix-7\@desktop { margin-right: 87.5%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-7\@desktop { -webkit-box-ordinal-group: 8; -webkit-order: 7; -moz-order: 7; -ms-flex-order: 7; order: 7; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .gr-8\@desktop { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } .push-8\@desktop { left: 100%; right: auto; } .pull-8\@desktop { right: 100%; left: auto; } .prefix-8\@desktop { margin-left: 100%; } .suffix-8\@desktop { margin-right: 100%; } .order-first\@desktop { -webkit-box-ordinal-group: 0; -webkit-order: -1; -moz-order: -1; -ms-flex-order: -1; order: -1; } .order-8\@desktop { -webkit-box-ordinal-group: 9; -webkit-order: 8; -moz-order: 8; -ms-flex-order: 8; order: 8; } .order-last\@desktop { -webkit-box-ordinal-group: 10000; -webkit-order: 9999; -moz-order: 9999; -ms-flex-order: 9999; order: 9999; } .float-left\@desktop { float: left; } .float-right\@desktop { float: right; } .clear\@desktop { clear: both; } .clear-left\@desktop { clear: left; } .clear-right\@desktop { clear: right; } .no-gutter\@desktop { padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0; } .no-gutter-left\@desktop { padding-left: 0; } .no-gutter-right\@desktop { padding-right: 0; } .no-gutter-top\@desktop { padding-top: 0; } .no-gutter-bottom\@desktop { padding-bottom: 0; } .gutter\@desktop { padding-right: 2em; padding-left: 2em; } .gutter-left\@desktop { padding-left: 2em; } .gutter-right\@desktop { padding-right: 2em; } .auto-height\@desktop { height: inherit; } .row\@desktop { -webkit-box-direction: normal; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; flex-direction: row; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row\@desktop { margin-left: 0 !important; margin-right: 0 !important; } .row-reverse\@desktop { -webkit-box-direction: reverse; -webkit-box-orient: horizontal; -webkit-flex-direction: row-reverse; -moz-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } [class*="no-gutter"] > .row-reverse\@desktop { margin-left: 0 !important; margin-right: 0 !important; } .row-full\@desktop { width: 100vw; margin-left: 50% !important; margin-right: 0 !important; -webkit-transform: translateX(-50%); -moz-transition: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .col\@desktop { -webkit-box-direction: normal; -webkit-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .col-reverse\@desktop { -webkit-box-direction: reverse; -webkit-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; padding-left: 0 !important; padding-right: 0 !important; margin-left: -2em; margin-right: -2em; } .row-align-left\@desktop { -webkit-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; -moz-justify-content: flex-start; justify-content: flex-start; } .row-align-center\@desktop { -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; -moz-justify-content: center; justify-content: center; } .row-align-right\@desktop { -webkit-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; -moz-justify-content: flex-end; justify-content: flex-end; } .row-align-middle\@desktop { -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; -moz-align-items: center; align-items: center; } .row-align-top\@desktop { -webkit-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; } .row-align-bottom\@desktop { -webkit-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; } .row-align-around\@desktop { -ms-flex-pack: distribute; -webkit-justify-content: space-around; -moz-justify-content: space-around; justify-content: space-around; } .row-align-between\@desktop { -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; -moz-justify-content: space-between; justify-content: space-between; } .hide\@desktop { display: none; } .not-visible\@desktop { visibility: hidden; } .show\@desktop { display: block; } .show-inline\@desktop { display: inline-block; } .visible\@desktop { visibility: visible; } .row-debug\@desktop { position: relative; z-index: 99999; overflow: hidden; } .row-debug\@desktop:before { pointer-events: none; content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 99999px; background: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, rgba(0, 0, 0, 0.02))); background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background: linear-gradient(to right, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.02) 50%); background-size: 25% 100%; z-index: 99999; } body { direction: ltr; } } [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } @media screen and (max-width: 767px) { [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } } @media screen and (min-width: 1025px) { [class*="gr-"] > [class^="row"], [class*="gr-"] > [class^="col"] { margin-left: -2em; margin-right: -2em; } } /** * common **/ .b-btn_projects { width: 100%; } .b-btn_projects-wrap { position: relative; } .b-btn_projects-wrap .c-button_wrap g { fill: #000; } .b-btn_projects-back { font-size: 2em; position: absolute; bottom: -5.4em; left: 1em; text-transform: none; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-btn_projects-back { font-size: 1.6em; left: 0; } } @media only screen and (max-width: 767px) { .b-btn_projects-back { font-size: 1.6em; top: 0; right: 0; bottom: -4em; left: 0; width: 9em; height: 3em; margin: auto; } } .b-btn_projects-back a { color: #f15b41; } .b-btn_projects-back .c-button_content { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 800; font-size: 11px; line-height: 1.27; letter-spacing: 0.55px; text-transform: uppercase; color: rgba(146, 161, 174, 0.6); margin-bottom: 0.5em; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 18px 14px 14px 14px; color: #f15b41; } .b-btn_projects-back .c-button_wrap { display: none; } .b-btn_projects-arrow { display: inline-block; width: 18px; height: 18px; margin-right: 5px; vertical-align: middle; background: url(/assets/files/ic_arrow_back_red_18px-e835604443610f8e324d5b9f62743bcc.png) center no-repeat; background-size: cover; } @media only screen and (max-width: 767px) { .b-btn_projects-arrow { width: 15px; height: 15px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-btn_projects-arrow { width: 15px; height: 15px; } } .c-all_projects { display: inline-block; position: absolute; left: 0; top: 14px; z-index: 2; font-size: 15px; line-height: 1.27; letter-spacing: 0.5px; white-space: nowrap; color: white; padding: 18px 14px 18px 28px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important; outline: none !important; -ms-touch-action: manipulation !important; touch-action: manipulation !important; } .c-all_projects:before { content: ""; position: absolute; top: 50%; left: 0; width: 16px; height: 16px; background: url(/assets/files/back-0b881a92b57b8c0111a6dc7fa9d259e6.svg) no-repeat center; margin-top: -8px; } .c-all_projects span { font-style: normal; font-weight: 500; font-size: 15px; text-transform: uppercase; } .no-touchevents .c-all_projects:hover { opacity: .8; } .b-project-close-video { position: absolute; z-index: -1; top: 2em; left: 2em; cursor: pointer; opacity: 0; } .b-project-close-video .c-button_content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; font-size: 1.8em; padding: 1em; letter-spacing: 1px; text-transform: uppercase; color: #f15b41; } .b-project-close-video .c-button_content:before { width: 17px; height: 17px; margin-right: 10px; content: ' '; background: url(/assets/files/close-50e618c271dbfa5ef81b57c9b3e247ea.svg); } .b-project-close-video .c-button_wrap g { fill: #000; } .b-project-play-video { z-index: 50; visibility: hidden; margin: 2em auto 5.5em; cursor: pointer; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; opacity: 0; -webkit-align-self: flex-end; -ms-flex-item-align: end; align-self: flex-end; } @media only screen and (max-width: 1024px) { .b-project-play-video { margin: -3.5em auto 2.5em; } } .b-project-play-video.visible { visibility: visible; opacity: 1; } .b-project-play-video .c-button_content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.645em; color: white; margin-bottom: 0; padding: 1.4em; } .b-project-play-video .c-button_content:before { width: 32px; height: 32px; margin-right: 10px; content: ' '; background: url(/assets/files/32-pt-video-84fe9002e11c3c70a99e5784098cc9dc.svg); } .b-project-play-video .c-button_wrap g { fill: #000; } .b-project-header { position: relative; z-index: 0; width: 100%; height: 60em; margin-bottom: 2em; background: url(/assets/files/header_placeholder-4ce68203e9045847252d9f0e924e5143.png) center bottom no-repeat; background-size: cover; } @media only screen and (max-width: 767px) { .b-project-header { height: 30em; margin-bottom: 1.8em; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-project-header { height: 40em; } } .b-project-header > .no-video { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; height: 100%; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } @media only screen and (max-width: 767px) { .b-project-header > .no-video { -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; } } .b-project-header-no-video > .no-video { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .b-project-image-header, .b-project-pattern { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .b-project-image-header { z-index: 1; opacity: .3; background-position: center bottom; background-size: cover; } .b-project-pattern { z-index: 2; background: url(/assets/files/pattern-91906460351e2461b43c9ac384839ea4.png) 0 0 repeat; } .b-project-play_btn { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100pt; height: 50pt; margin: auto; cursor: pointer; } .b-project-play_btn .c-button_content { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 18px; padding: 20px; letter-spacing: 1px; color: white; } .b-project-header-video { position: absolute; top: 0; right: 0; bottom: 0; left: 0; -webkit-transition: .5s; -o-transition: .5s; transition: .5s; opacity: 0; } @media only screen and (max-width: 767px) { .b-project-header-video iframe { height: 30em; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-project-header-video iframe { height: 40em; } } .b-project-logo { z-index: 10; width: 100%; max-width: 38.4em; margin: 0 auto; } @media only screen and (max-width: 767px) { .b-project-logo { max-height: 26em; } } .case-study-video { overflow: hidden; position: relative; min-height: 600px; background-color: #000; margin-top: 90px; } @media only screen and (min-width: 768px) { .case-study-video { -webkit-transition: min-height 0.3s ease-in-out 0.15s; -o-transition: min-height 0.3s ease-in-out 0.15s; transition: min-height 0.3s ease-in-out 0.15s; } } @media only screen and (max-width: 1024px) { .case-study-video { min-height: 400px; margin-top: 62px; } } @media only screen and (max-width: 767px) { .case-study-video { min-height: 300px; margin-bottom: 18px; } } @media only screen and (min-width: 768px) { .case-study-video-opened { -webkit-transition: min-height 0.3s ease-in-out; -o-transition: min-height 0.3s ease-in-out; transition: min-height 0.3s ease-in-out; } } .case-study-video-loading { min-height: calc(100vh - 80px); } @media only screen and (max-width: 1024px) { .case-study-video-loading { min-height: calc(100vh - 60px); } } @media only screen and (max-width: 767px) { .case-study-video-loading { min-height: 300px; } } .case-study-video-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; } .case-study-video-content-foreground { position: absolute; z-index: 6; left: 0; top: 0; width: 100vw; height: 100vh; background-color: #000; opacity: 0; pointer-events: none; } @media only screen and (min-width: 768px) { .case-study-video-content-foreground { -webkit-transition: opacity 0.3s ease-in-out 0.3s; -o-transition: opacity 0.3s ease-in-out 0.3s; transition: opacity 0.3s ease-in-out 0.3s; } } .case-study-video-opened .case-study-video-content-foreground { opacity: 1; } .case-study-video-loading .case-study-video-content-foreground { opacity: 0; } .case-study-video-content-background { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; background-image: url(/assets/files/header_placeholder-4ce68203e9045847252d9f0e924e5143.png); background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; } .case-study-video-content-background::before { content: ""; display: block; position: absolute; z-index: 2; left: 0; top: 0; width: 100vw; height: 100vh; background-image: url(/assets/files/pattern-91906460351e2461b43c9ac384839ea4.png); background-size: 4px 4px; background-position: 0 0; background-repeat: repeat; } .case-study-video-content-background > div { position: absolute; z-index: 1; left: 0; top: 0; width: 100%; height: 100%; background-size: cover; background-position: 50% 50%; background-repeat: no-repeat; opacity: 0.3; } .case-study-video-logo { position: relative; z-index: 2; width: 100%; font-size: 0; text-align: center; } .case-study-video-logo img { width: 100%; max-width: 384px; } @media only screen and (max-width: 767px) { .case-study-video-logo img { max-height: 260px; } } .case-study-video-play-button { position: relative; z-index: 5; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important; outline: none !important; -ms-touch-action: manipulation !important; touch-action: manipulation !important; } @media only screen and (max-width: 1024px) { .case-study-video-play-button { top: -60px; } } @media only screen and (max-width: 767px) { .case-study-video-play-button { top: -40px; } } .case-study-video-loading .case-study-video-play-button { opacity: 0; pointer-events: none; } .case-study-video-close-button { display: none; position: absolute; z-index: 28; right: 0; top: 0; cursor: pointer; background-color: #ff0044; -webkit-transition: background-color 0.3s ease-out; -o-transition: background-color 0.3s ease-out; transition: background-color 0.3s ease-out; padding: 30px; } @media only screen and (max-width: 767px) { .case-study-video-close-button { padding: 18px; } } .case-study-video-close-button svg { display: block; width: 30px; height: 30px; } @media only screen and (max-width: 767px) { .case-study-video-close-button svg { width: 18px; height: 18px; } } .case-study-video-close-button path { fill: white; -webkit-transition: fill 0.3s ease-out; -o-transition: fill 0.3s ease-out; transition: fill 0.3s ease-out; } .case-study-video-opened .case-study-video-close-button { display: block; } .case-study-video-loading .case-study-video-close-button { display: none; } .no-touchevents .case-study-video-close-button:hover { background-color: white; } .no-touchevents .case-study-video-close-button:hover path { fill: #ff0044; } .case-study-video iframe { position: absolute; z-index: 20; left: 0; top: 0; width: 0; height: 0; opacity: 0; } .case-study-video iframe.opened { width: 100%; height: 100%; opacity: 1; } @media only screen and (min-width: 768px) { .case-study-video iframe.opened { -webkit-transition: opacity 0.25s ease-in 0.15s; -o-transition: opacity 0.25s ease-in 0.15s; transition: opacity 0.25s ease-in 0.15s; } } .mercdev-shields { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } @media only screen and (max-width: 767px) { .mercdev-shields { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } .mercdev-shield { display: block; width: 116px; min-width: 116px; text-decoration: none; margin-right: 40px; } @media only screen and (max-width: 767px) { .mercdev-shield { width: 64px; min-width: 64px; margin-right: 5px; } } .mercdev-shield:last-child { margin-right: 0; } .mercdev-shield--clutch { width: 136px; min-width: 136px; } @media only screen and (max-width: 767px) { .mercdev-shield--clutch { width: 75px; min-width: 75px; } } .mercdev-shield__image { text-align: center; } .mercdev-shield__image img { width: 100%; height: auto; } .mercdev-shield__title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 800; font-size: 11px; line-height: 1.27; letter-spacing: 0.5px; text-align: center; text-transform: uppercase; color: rgba(255, 255, 255, 0.75); -webkit-transition: color 150ms ease-in-out; -o-transition: color 150ms ease-in-out; transition: color 150ms ease-in-out; } @media only screen and (max-width: 767px) { .mercdev-shield__title { display: none; } } .no-touchevents a.mercdev-shield:hover .mercdev-shield__title { color: white; } html, body { min-height: 100%; } body { height: 100%; color: #5c5c5c; background: #fff !important; } .container { font-family: Roboto; max-width: 116em; margin: 0 auto; padding: 0 4em; } @media screen and (max-width: 767px) { .container { padding: 0 2em; } } .b-project-section { margin: 8em 0; } @media screen and (max-width: 767px) { .b-project-section { margin: 4em 0; } } @media screen and (max-width: 767px) { .b-project-section p + p:last-child { margin-bottom: 0; } } .b-project-section-highlighted .row { font-style: italic; padding-top: 8em; padding-bottom: 7em; background: rgba(228, 229, 230, 0.4); } @media screen and (max-width: 767px) { .b-project-section-highlighted .row { padding-top: 4em; padding-bottom: 3em; } } .b-project-section.review { padding: 6em 0 4.7em; background-color: rgba(146, 161, 174, 0.1); } @media screen and (max-width: 767px) { .b-project-section.review { padding: 4em 0 2.7em; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review { background: transparent; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .b-project-customer { margin-bottom: 1.1em; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .b-project-customer .gr-1 { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .b-project-customer .gr-4 { -webkit-flex-basis: 100%; -ms-flex-preferred-size: 100%; flex-basis: 100%; max-width: 100%; text-align: center; margin-right: auto; margin-left: auto; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .b-project-customer .avatar { min-width: 10em; margin-right: auto; margin-left: auto; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .b-project-customer .title { display: inline-block; position: relative; top: 19px; padding: 0 0.8em; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 800; font-size: 11px; line-height: 1.27; letter-spacing: 0.55px; text-transform: uppercase; color: rgba(146, 161, 174, 0.6); margin-bottom: 0.5em; background-color: white; margin-bottom: 0; } } @media only screen and (max-width: 1024px) { .b-project-section.bordered-review .b-project-customer .title span { display: none; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .caption, .b-project-section.bordered-review .name, .b-project-section.bordered-review .b-project-quote-line { display: none; } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .gr-6 { padding: 3.5em 5em 1.9em 5em; border-style: solid; border-width: 2px; border-color: rgba(146, 161, 174, 0.4); } } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .gr-6 p { text-align: center; } } .b-project-section.bordered-review .double-quote { font-size: 1em; } @media only screen and (min-width: 1025px) { .b-project-section.bordered-review .double-quote { display: none; } } .b-project-section:last-child { margin-bottom: 0; padding-bottom: 18.6em; } @media only screen and (max-width: 1024px) { .b-project-section:last-child { padding-bottom: 3.4em; } } .b-project-section h1 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 72px; line-height: 1.08; color: #ff0044; margin-bottom: 0.54em; } @media only screen and (max-width: 1024px) { .b-project-section h1 { font-size: 58px; } } @media only screen and (max-width: 767px) { .b-project-section h1 { font-size: 28px; } } .b-project-section h2 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; } @media only screen and (max-width: 1024px) { .b-project-section h2 { font-size: 40px; } } @media only screen and (max-width: 767px) { .b-project-section h2 { font-size: 24px; } } .b-project-section h3 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 38px; line-height: 1.21; color: #ff0044; margin-bottom: 0.605em; } @media only screen and (max-width: 1024px) { .b-project-section h3 { font-size: 32px; } } @media only screen and (max-width: 767px) { .b-project-section h3 { font-size: 20px; } } .b-project-section p { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; } @media only screen and (max-width: 767px) { .b-project-section p { font-size: 16px; } } .b-project-section ul li { position: relative; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 400; font-size: 18px; line-height: 1.33; color: rgba(29, 31, 38, 0.75); padding-left: 1.17em; margin: 0.675em 0; } .b-project-section ul li:last-of-type { margin-bottom: 1.4em; } .b-project-section ul li::before { content: ""; display: block; position: absolute; top: 0.675em; left: 0.06em; width: 0.56em; height: 2px; background-color: #ff0044; margin-top: -1px; } @media only screen and (max-width: 767px) { .b-project-section ul li { font-size: 15px; } } .b-project-section .b-project-list-title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 500; font-weight: 500; font-size: 20px; line-height: 1.5; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; } @media only screen and (max-width: 767px) { .b-project-section .b-project-list-title { font-size: 16px; } } .b-project-section .b-project-text-quote { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: italic; font-weight: 400; font-style: italic; font-weight: 400; font-size: 22px; line-height: 2.09; color: rgba(29, 31, 38, 0.85); margin-bottom: 1.045em; } @media only screen and (max-width: 767px) { .b-project-section .b-project-text-quote { font-size: 16px; line-height: 2.06; } } .b-project-section .b-text-intro { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 500; font-weight: 500; font-size: 24px; line-height: 1.67; color: rgba(29, 31, 38, 0.7); margin-bottom: 0.835em; } @media only screen and (max-width: 767px) { .b-project-section .b-text-intro { font-size: 18px; } } .b-project-section .b-header-h1-row { padding: 2.9em 0 0 0; } @media screen and (max-width: 767px) { .b-project-section .b-header-h1-row { padding-top: 0; } } .b-project-section .b-header-h1-row .b-project-header-number span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 72px; line-height: 1.08; color: #ff0044; margin-bottom: 0.54em; color: rgba(146, 161, 174, 0.25); } @media only screen and (max-width: 1024px) { .b-project-section .b-header-h1-row .b-project-header-number span { font-size: 58px; } } @media only screen and (max-width: 767px) { .b-project-section .b-header-h1-row .b-project-header-number span { font-size: 28px; } } .b-project-section .b-header-h2-row { padding: 1em 0 0 0; } @media screen and (max-width: 767px) { .b-project-section .b-header-h2-row { padding-top: 0; } } .b-project-section .b-header-h2-row .b-project-header-number span { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: rgba(146, 161, 174, 0.25); } @media only screen and (max-width: 1024px) { .b-project-section .b-header-h2-row .b-project-header-number span { font-size: 40px; } } @media only screen and (max-width: 767px) { .b-project-section .b-header-h2-row .b-project-header-number span { font-size: 24px; } } .b-project-section .row { margin: 0; } .b-project-header { margin-top: 8em; } @media screen and (min-width: 768px) and (max-width: 1024px) { .b-project-header { margin-top: 6em; } } @media screen and (max-width: 767px) { .b-project-header { margin-top: 6em; } } .b-project-video { width: 100%; height: 40em; margin: 2em 0 4em; } @media screen and (min-width: 768px) and (max-width: 1024px) { .b-project-video { height: 35em; } } @media screen and (max-width: 767px) { .b-project-video { height: 30em; } } .b-project-img { display: block; width: 100%; margin: 6em 0; } @media screen and (max-width: 767px) { .b-project-img { margin: 3em 0; } } .img-border .b-project-img { border: solid 1px rgba(0, 0, 0, 0.15); border-radius: 2px; } .b-project-img-description { margin-bottom: 10%; } @media screen and (max-width: 767px) { .b-project-img-description { margin-bottom: 0; } } .b-project-img-description .title { margin-bottom: 2.8em; } .b-project-img-description .title span { font-size: 1.1em; font-weight: 900; line-height: 1.3; letter-spacing: 1px; text-transform: uppercase; color: rgba(46, 46, 46, 0.3); } .b-project-img-description .description { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 16px; line-height: 1.5; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.75em; margin-bottom: 0; } .b-project-img-description .description p { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 16px; line-height: 1.5; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.75em; margin: 0 0 1em 0; } .b-project-quote-line { max-width: 10em; height: 4px; background-color: #ff0044; margin-top: 2em; } .b-project-customer { margin-bottom: 5em; } @media screen and (max-width: 767px) { .b-project-customer { margin-bottom: 1.5em; } } .b-project-customer .avatar { overflow: hidden; max-width: 10em; border-radius: 100%; } .b-project-customer .avatar img { display: block; width: 100%; } .b-project-customer .caption { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 800; font-size: 11px; line-height: 1.27; letter-spacing: 0.55px; text-transform: uppercase; color: rgba(146, 161, 174, 0.6); margin-bottom: 0.5em; margin-top: 0.4em; margin-bottom: 1.2em; } .b-project-customer .name { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 500; font-size: 16px; line-height: 1.25; color: #ff0044; margin-bottom: 0.625em; margin-bottom: 0.3em; } .b-project-customer .title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 400; font-size: 14px; line-height: 1.53; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.765em; margin-bottom: 0; } @media screen and (max-width: 767px) { .b-project-statistigs-grid { margin-right: 0; margin-left: 0; } } .b-project-statistics-gr { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: calc(33.3% - 8em); margin: 2em; padding: 2em; text-align: center; border-radius: 4px; background-color: rgba(146, 161, 174, 0.1); } @media screen and (max-width: 767px) { .b-project-statistics-gr { width: calc(50% - 2.8em); margin: .4em; padding: 1em; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .b-project-statistics-gr { width: calc(33.3% - 4.8em); margin: .4em; } } .b-project-statistics-block { width: 100%; height: 100%; } .b-project-statistics-block .title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 24px; line-height: 1.17; color: #ff0044; margin-bottom: 0.585em; } @media only screen and (max-width: 1024px) { .b-project-statistics-block .title { font-size: 16px; } } @media only screen and (max-width: 767px) { .b-project-statistics-block .title { font-size: 12px; } } @media screen and (max-width: 767px) { .b-project-statistics-block .title { margin-top: 0.4em; margin-bottom: 0.4em; } } .b-project-statistics-block .description { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 15px; line-height: 1.33; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.665em; margin-bottom: 0; } @media only screen and (max-width: 767px) { .b-project-statistics-block .description { font-size: 13px; line-height: 1.53; } } @media screen and (min-width: 768px) and (max-width: 1024px) { .b-project-statistics-block .description { margin-bottom: .5em; } } @media screen and (max-width: 767px) { .b-project-statistics-block .description { margin-bottom: .5em; } } .b-project-statistics-block .icon { margin: .4em 0 1.8em; } @media screen and (min-width: 768px) and (max-width: 1024px) { .b-project-statistics-block .icon { margin-bottom: .5em; } } @media screen and (max-width: 767px) { .b-project-statistics-block .icon { margin-bottom: .5em; } } .landing__section { display: block; position: relative; padding: 0; margin: 0; } .landing__section h1 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 72px; line-height: 1.08; color: #ff0044; margin-bottom: 0.54em; } @media only screen and (max-width: 1024px) { .landing__section h1 { font-size: 58px; } } @media only screen and (max-width: 767px) { .landing__section h1 { font-size: 28px; } } .landing__section h2 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; } @media only screen and (max-width: 1024px) { .landing__section h2 { font-size: 40px; } } @media only screen and (max-width: 767px) { .landing__section h2 { font-size: 24px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__section h2 { font-size: 38px; } } .landing__section h3 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 38px; line-height: 1.21; color: #ff0044; margin-bottom: 0.605em; } @media only screen and (max-width: 1024px) { .landing__section h3 { font-size: 32px; } } @media only screen and (max-width: 767px) { .landing__section h3 { font-size: 20px; } } .landing__section p { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; padding-right: 12.5%; padding-left: 12.5%; } @media only screen and (max-width: 767px) { .landing__section p { font-size: 16px; } } .landing__section p:last-of-type { margin-bottom: 0; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__section p { font-size: 18px; line-height: 1.67; color: rgba(29, 31, 38, 0.85); font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 100; } } @media only screen and (max-width: 767px) { .landing__section p { padding-right: 0; padding-left: 0; } } .landing__section .l-column { padding: 100px 0; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__section .l-column { padding: 69px 0; } } @media only screen and (max-width: 767px) { .landing__section .l-column { padding: 50px 0; } } .landing__canvas-section { overflow: hidden; } .landing__canvas-section .c-canvas-bg-pattern { display: block; pointer-events: none; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; min-width: 1920px; height: auto; min-height: 100%; } .landing__canvas-section .l-column { position: relative; z-index: 2; padding: 0; } @media only screen and (min-width: 768px) { .landing__intro-section::before { content: ""; display: block; position: absolute; z-index: 2; left: 50%; bottom: 0; background-position: 50% 50%; background-size: contain; background-repeat: no-repeat; } } .landing__intro-section-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start; width: 50%; height: 731px; padding-left: 12.5%; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__intro-section-content { height: 531px; width: 75%; } } @media only screen and (max-width: 767px) { .landing__intro-section-content { width: auto; height: 362px; padding-left: 0; } } @media only screen and (max-width: 1024px) { .landing__intro-section-content__link { padding-top: 14px; } } .landing__intro-section-content__text { height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .landing__intro-section .l-column { z-index: 3; } .landing__intro-section h1 { position: relative; color: white; margin-bottom: 0.7em; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__intro-section h1 { font-size: 50px; margin-bottom: 1.4em; position: relative; top: 19px; } } @media only screen and (max-width: 767px) { .landing__intro-section h1 { text-align: center; margin-top: 1em; margin-bottom: 1.2em; } } .landing__intro-section h1::before { content: ""; display: block; position: absolute; z-index: 1; left: -25%; top: 0.5em; width: 18.33%; height: 9px; background-color: white; margin-top: -4px; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__intro-section h1::before { width: 8.5%; left: -15%; } } .landing__all-projects-button { display: inline-block; position: absolute; z-index: 20; left: 0; top: 14px; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 500; font-size: 15px; line-height: 1; text-transform: uppercase; white-space: nowrap; color: white; background-image: url(/assets/files/back-0b881a92b57b8c0111a6dc7fa9d259e6.svg); background-size: 16px 16px; background-position: 0 calc(50% - 1px); background-repeat: no-repeat; padding: 18px 14px 18px 28px; -webkit-tap-highlight-color: transparent; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__all-projects-button { left: 8px; } } @media only screen and (max-width: 767px) { .landing__all-projects-button { position: static; } } .no-touchevents .landing__all-projects-button:hover { opacity: .8; } .landing__all-projects-button--red { color: #ff0044; background-image: url(/assets/files/back-red-7491a95878375b31fa9837bb8006c32b.svg); } .landing__link-section .l-column { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; padding: 56px 0 102px 0; } @media only screen and (max-width: 767px) { .landing__link-section .l-column { display: block; height: auto; padding: 32px 0 38px 0; } } .landing__link-section a { display: block; position: absolute; z-index: 100; left: 0; top: 0; width: 100%; height: 100%; text-decoration: none; } .no-touchevents .landing__link-section a { -webkit-transition: background-color 150ms ease-in-out; -o-transition: background-color 150ms ease-in-out; transition: background-color 150ms ease-in-out; } .no-touchevents .landing__link-section a:hover { background-color: rgba(255, 255, 255, 0.25); } .landing__link-section-text-1 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.645em; color: white; margin-bottom: 2.2em; } @media only screen and (max-width: 767px) { .landing__link-section-text-1 { margin-bottom: 1.6em; padding: 0; } } .landing__link-section-text-2 { position: relative; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; padding: 0 25% 0 0; margin-bottom: 0; } @media only screen and (max-width: 1024px) { .landing__link-section-text-2 { font-size: 40px; } } @media only screen and (max-width: 767px) { .landing__link-section-text-2 { font-size: 24px; } } @media only screen and (max-width: 767px) { .landing__link-section-text-2 { padding: 0; } } .landing__link-section-text-2 svg { display: block; position: absolute; z-index: 1; width: 72px; height: 72px; -webkit-transform: rotate3d(0, 0, 1, 180deg); transform: rotate3d(0, 0, 1, 180deg); margin-top: -36px; } @media only screen and (min-width: 768px) { .landing__link-section-text-2 svg { top: 50%; right: 0; } } @media only screen and (max-width: 767px) { .landing__link-section-text-2 svg { display: none; } } .landing__link-section-text-2 svg g g { fill: currentColor; } .landing__heading { padding-right: 12.5%; padding-left: 12.5%; } @media only screen and (max-width: 767px) { .landing__heading { padding-right: 0; padding-left: 0; } } .landing__heading--ordered { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding-right: 0; padding-left: 0; } @media only screen and (max-width: 767px) { .landing__heading--ordered { display: block; } } .landing__heading--ordered span:first-child { font-weight: 900; width: 12.5%; color: rgba(146, 161, 174, 0.25); } @media only screen and (max-width: 767px) { .landing__heading--ordered span:first-child { display: none; } } .landing__heading--ordered span:last-child { width: 75%; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__heading--ordered span:last-child { width: 62%; } } @media only screen and (max-width: 767px) { .landing__heading--ordered span:last-child { display: block; width: auto; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { h3.landing__heading { font-size: 24px; line-height: 1.17; } } .landing__image-content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 20px 0; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__image-content { padding: 26px 0; } } @media only screen and (max-width: 1024px) { .landing__image-content { display: block; } } .landing__image-content--reversed { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .landing__image-content--reversed .landing__image-content-text { padding-left: 0; } @media only screen and (min-width: 1025px) { .landing__image-content--reversed .landing__image-content-text { padding-right: 3.33%; } } .landing__image-content-image { width: 37.5%; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__image-content-image { width: 45%; margin: 0 auto; } } @media only screen and (max-width: 767px) { .landing__image-content-image { width: 70%; margin: 0 auto; } } .landing__image-content-image img { width: 100%; height: auto; } .landing__image-content-text { width: 62.5%; padding-left: 3.33%; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .landing__image-content-text { width: 77%; margin: 17px auto 0; padding-left: 0; } } @media only screen and (max-width: 767px) { .landing__image-content-text { width: auto; padding-top: 20px; padding-right: 0; padding-left: 0; } } .landing__image-content-text .landing__heading, .landing__image-content-text p { padding-right: 0; padding-left: 0; } [data-aos][data-aos][data-aos-duration="50"],body[data-aos-duration="50"] [data-aos]{-webkit-transition-duration:50ms;-o-transition-duration:50ms;transition-duration:50ms}[data-aos][data-aos][data-aos-delay="50"],body[data-aos-delay="50"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="50"].aos-animate,body[data-aos-delay="50"] [data-aos].aos-animate{-webkit-transition-delay:50ms;-o-transition-delay:50ms;transition-delay:50ms}[data-aos][data-aos][data-aos-duration="100"],body[data-aos-duration="100"] [data-aos]{-webkit-transition-duration:.1s;-o-transition-duration:.1s;transition-duration:.1s}[data-aos][data-aos][data-aos-delay="100"],body[data-aos-delay="100"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="100"].aos-animate,body[data-aos-delay="100"] [data-aos].aos-animate{-webkit-transition-delay:.1s;-o-transition-delay:.1s;transition-delay:.1s}[data-aos][data-aos][data-aos-duration="150"],body[data-aos-duration="150"] [data-aos]{-webkit-transition-duration:.15s;-o-transition-duration:.15s;transition-duration:.15s}[data-aos][data-aos][data-aos-delay="150"],body[data-aos-delay="150"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="150"].aos-animate,body[data-aos-delay="150"] [data-aos].aos-animate{-webkit-transition-delay:.15s;-o-transition-delay:.15s;transition-delay:.15s}[data-aos][data-aos][data-aos-duration="200"],body[data-aos-duration="200"] [data-aos]{-webkit-transition-duration:.2s;-o-transition-duration:.2s;transition-duration:.2s}[data-aos][data-aos][data-aos-delay="200"],body[data-aos-delay="200"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="200"].aos-animate,body[data-aos-delay="200"] [data-aos].aos-animate{-webkit-transition-delay:.2s;-o-transition-delay:.2s;transition-delay:.2s}[data-aos][data-aos][data-aos-duration="250"],body[data-aos-duration="250"] [data-aos]{-webkit-transition-duration:.25s;-o-transition-duration:.25s;transition-duration:.25s}[data-aos][data-aos][data-aos-delay="250"],body[data-aos-delay="250"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="250"].aos-animate,body[data-aos-delay="250"] [data-aos].aos-animate{-webkit-transition-delay:.25s;-o-transition-delay:.25s;transition-delay:.25s}[data-aos][data-aos][data-aos-duration="300"],body[data-aos-duration="300"] [data-aos]{-webkit-transition-duration:.3s;-o-transition-duration:.3s;transition-duration:.3s}[data-aos][data-aos][data-aos-delay="300"],body[data-aos-delay="300"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="300"].aos-animate,body[data-aos-delay="300"] [data-aos].aos-animate{-webkit-transition-delay:.3s;-o-transition-delay:.3s;transition-delay:.3s}[data-aos][data-aos][data-aos-duration="350"],body[data-aos-duration="350"] [data-aos]{-webkit-transition-duration:.35s;-o-transition-duration:.35s;transition-duration:.35s}[data-aos][data-aos][data-aos-delay="350"],body[data-aos-delay="350"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="350"].aos-animate,body[data-aos-delay="350"] [data-aos].aos-animate{-webkit-transition-delay:.35s;-o-transition-delay:.35s;transition-delay:.35s}[data-aos][data-aos][data-aos-duration="400"],body[data-aos-duration="400"] [data-aos]{-webkit-transition-duration:.4s;-o-transition-duration:.4s;transition-duration:.4s}[data-aos][data-aos][data-aos-delay="400"],body[data-aos-delay="400"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="400"].aos-animate,body[data-aos-delay="400"] [data-aos].aos-animate{-webkit-transition-delay:.4s;-o-transition-delay:.4s;transition-delay:.4s}[data-aos][data-aos][data-aos-duration="450"],body[data-aos-duration="450"] [data-aos]{-webkit-transition-duration:.45s;-o-transition-duration:.45s;transition-duration:.45s}[data-aos][data-aos][data-aos-delay="450"],body[data-aos-delay="450"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="450"].aos-animate,body[data-aos-delay="450"] [data-aos].aos-animate{-webkit-transition-delay:.45s;-o-transition-delay:.45s;transition-delay:.45s}[data-aos][data-aos][data-aos-duration="500"],body[data-aos-duration="500"] [data-aos]{-webkit-transition-duration:.5s;-o-transition-duration:.5s;transition-duration:.5s}[data-aos][data-aos][data-aos-delay="500"],body[data-aos-delay="500"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="500"].aos-animate,body[data-aos-delay="500"] [data-aos].aos-animate{-webkit-transition-delay:.5s;-o-transition-delay:.5s;transition-delay:.5s}[data-aos][data-aos][data-aos-duration="550"],body[data-aos-duration="550"] [data-aos]{-webkit-transition-duration:.55s;-o-transition-duration:.55s;transition-duration:.55s}[data-aos][data-aos][data-aos-delay="550"],body[data-aos-delay="550"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="550"].aos-animate,body[data-aos-delay="550"] [data-aos].aos-animate{-webkit-transition-delay:.55s;-o-transition-delay:.55s;transition-delay:.55s}[data-aos][data-aos][data-aos-duration="600"],body[data-aos-duration="600"] [data-aos]{-webkit-transition-duration:.6s;-o-transition-duration:.6s;transition-duration:.6s}[data-aos][data-aos][data-aos-delay="600"],body[data-aos-delay="600"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="600"].aos-animate,body[data-aos-delay="600"] [data-aos].aos-animate{-webkit-transition-delay:.6s;-o-transition-delay:.6s;transition-delay:.6s}[data-aos][data-aos][data-aos-duration="650"],body[data-aos-duration="650"] [data-aos]{-webkit-transition-duration:.65s;-o-transition-duration:.65s;transition-duration:.65s}[data-aos][data-aos][data-aos-delay="650"],body[data-aos-delay="650"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="650"].aos-animate,body[data-aos-delay="650"] [data-aos].aos-animate{-webkit-transition-delay:.65s;-o-transition-delay:.65s;transition-delay:.65s}[data-aos][data-aos][data-aos-duration="700"],body[data-aos-duration="700"] [data-aos]{-webkit-transition-duration:.7s;-o-transition-duration:.7s;transition-duration:.7s}[data-aos][data-aos][data-aos-delay="700"],body[data-aos-delay="700"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="700"].aos-animate,body[data-aos-delay="700"] [data-aos].aos-animate{-webkit-transition-delay:.7s;-o-transition-delay:.7s;transition-delay:.7s}[data-aos][data-aos][data-aos-duration="750"],body[data-aos-duration="750"] [data-aos]{-webkit-transition-duration:.75s;-o-transition-duration:.75s;transition-duration:.75s}[data-aos][data-aos][data-aos-delay="750"],body[data-aos-delay="750"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="750"].aos-animate,body[data-aos-delay="750"] [data-aos].aos-animate{-webkit-transition-delay:.75s;-o-transition-delay:.75s;transition-delay:.75s}[data-aos][data-aos][data-aos-duration="800"],body[data-aos-duration="800"] [data-aos]{-webkit-transition-duration:.8s;-o-transition-duration:.8s;transition-duration:.8s}[data-aos][data-aos][data-aos-delay="800"],body[data-aos-delay="800"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="800"].aos-animate,body[data-aos-delay="800"] [data-aos].aos-animate{-webkit-transition-delay:.8s;-o-transition-delay:.8s;transition-delay:.8s}[data-aos][data-aos][data-aos-duration="850"],body[data-aos-duration="850"] [data-aos]{-webkit-transition-duration:.85s;-o-transition-duration:.85s;transition-duration:.85s}[data-aos][data-aos][data-aos-delay="850"],body[data-aos-delay="850"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="850"].aos-animate,body[data-aos-delay="850"] [data-aos].aos-animate{-webkit-transition-delay:.85s;-o-transition-delay:.85s;transition-delay:.85s}[data-aos][data-aos][data-aos-duration="900"],body[data-aos-duration="900"] [data-aos]{-webkit-transition-duration:.9s;-o-transition-duration:.9s;transition-duration:.9s}[data-aos][data-aos][data-aos-delay="900"],body[data-aos-delay="900"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="900"].aos-animate,body[data-aos-delay="900"] [data-aos].aos-animate{-webkit-transition-delay:.9s;-o-transition-delay:.9s;transition-delay:.9s}[data-aos][data-aos][data-aos-duration="950"],body[data-aos-duration="950"] [data-aos]{-webkit-transition-duration:.95s;-o-transition-duration:.95s;transition-duration:.95s}[data-aos][data-aos][data-aos-delay="950"],body[data-aos-delay="950"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="950"].aos-animate,body[data-aos-delay="950"] [data-aos].aos-animate{-webkit-transition-delay:.95s;-o-transition-delay:.95s;transition-delay:.95s}[data-aos][data-aos][data-aos-duration="1000"],body[data-aos-duration="1000"] [data-aos]{-webkit-transition-duration:1s;-o-transition-duration:1s;transition-duration:1s}[data-aos][data-aos][data-aos-delay="1000"],body[data-aos-delay="1000"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1000"].aos-animate,body[data-aos-delay="1000"] [data-aos].aos-animate{-webkit-transition-delay:1s;-o-transition-delay:1s;transition-delay:1s}[data-aos][data-aos][data-aos-duration="1050"],body[data-aos-duration="1050"] [data-aos]{-webkit-transition-duration:1.05s;-o-transition-duration:1.05s;transition-duration:1.05s}[data-aos][data-aos][data-aos-delay="1050"],body[data-aos-delay="1050"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1050"].aos-animate,body[data-aos-delay="1050"] [data-aos].aos-animate{-webkit-transition-delay:1.05s;-o-transition-delay:1.05s;transition-delay:1.05s}[data-aos][data-aos][data-aos-duration="1100"],body[data-aos-duration="1100"] [data-aos]{-webkit-transition-duration:1.1s;-o-transition-duration:1.1s;transition-duration:1.1s}[data-aos][data-aos][data-aos-delay="1100"],body[data-aos-delay="1100"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1100"].aos-animate,body[data-aos-delay="1100"] [data-aos].aos-animate{-webkit-transition-delay:1.1s;-o-transition-delay:1.1s;transition-delay:1.1s}[data-aos][data-aos][data-aos-duration="1150"],body[data-aos-duration="1150"] [data-aos]{-webkit-transition-duration:1.15s;-o-transition-duration:1.15s;transition-duration:1.15s}[data-aos][data-aos][data-aos-delay="1150"],body[data-aos-delay="1150"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1150"].aos-animate,body[data-aos-delay="1150"] [data-aos].aos-animate{-webkit-transition-delay:1.15s;-o-transition-delay:1.15s;transition-delay:1.15s}[data-aos][data-aos][data-aos-duration="1200"],body[data-aos-duration="1200"] [data-aos]{-webkit-transition-duration:1.2s;-o-transition-duration:1.2s;transition-duration:1.2s}[data-aos][data-aos][data-aos-delay="1200"],body[data-aos-delay="1200"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1200"].aos-animate,body[data-aos-delay="1200"] [data-aos].aos-animate{-webkit-transition-delay:1.2s;-o-transition-delay:1.2s;transition-delay:1.2s}[data-aos][data-aos][data-aos-duration="1250"],body[data-aos-duration="1250"] [data-aos]{-webkit-transition-duration:1.25s;-o-transition-duration:1.25s;transition-duration:1.25s}[data-aos][data-aos][data-aos-delay="1250"],body[data-aos-delay="1250"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1250"].aos-animate,body[data-aos-delay="1250"] [data-aos].aos-animate{-webkit-transition-delay:1.25s;-o-transition-delay:1.25s;transition-delay:1.25s}[data-aos][data-aos][data-aos-duration="1300"],body[data-aos-duration="1300"] [data-aos]{-webkit-transition-duration:1.3s;-o-transition-duration:1.3s;transition-duration:1.3s}[data-aos][data-aos][data-aos-delay="1300"],body[data-aos-delay="1300"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1300"].aos-animate,body[data-aos-delay="1300"] [data-aos].aos-animate{-webkit-transition-delay:1.3s;-o-transition-delay:1.3s;transition-delay:1.3s}[data-aos][data-aos][data-aos-duration="1350"],body[data-aos-duration="1350"] [data-aos]{-webkit-transition-duration:1.35s;-o-transition-duration:1.35s;transition-duration:1.35s}[data-aos][data-aos][data-aos-delay="1350"],body[data-aos-delay="1350"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1350"].aos-animate,body[data-aos-delay="1350"] [data-aos].aos-animate{-webkit-transition-delay:1.35s;-o-transition-delay:1.35s;transition-delay:1.35s}[data-aos][data-aos][data-aos-duration="1400"],body[data-aos-duration="1400"] [data-aos]{-webkit-transition-duration:1.4s;-o-transition-duration:1.4s;transition-duration:1.4s}[data-aos][data-aos][data-aos-delay="1400"],body[data-aos-delay="1400"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1400"].aos-animate,body[data-aos-delay="1400"] [data-aos].aos-animate{-webkit-transition-delay:1.4s;-o-transition-delay:1.4s;transition-delay:1.4s}[data-aos][data-aos][data-aos-duration="1450"],body[data-aos-duration="1450"] [data-aos]{-webkit-transition-duration:1.45s;-o-transition-duration:1.45s;transition-duration:1.45s}[data-aos][data-aos][data-aos-delay="1450"],body[data-aos-delay="1450"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1450"].aos-animate,body[data-aos-delay="1450"] [data-aos].aos-animate{-webkit-transition-delay:1.45s;-o-transition-delay:1.45s;transition-delay:1.45s}[data-aos][data-aos][data-aos-duration="1500"],body[data-aos-duration="1500"] [data-aos]{-webkit-transition-duration:1.5s;-o-transition-duration:1.5s;transition-duration:1.5s}[data-aos][data-aos][data-aos-delay="1500"],body[data-aos-delay="1500"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1500"].aos-animate,body[data-aos-delay="1500"] [data-aos].aos-animate{-webkit-transition-delay:1.5s;-o-transition-delay:1.5s;transition-delay:1.5s}[data-aos][data-aos][data-aos-duration="1550"],body[data-aos-duration="1550"] [data-aos]{-webkit-transition-duration:1.55s;-o-transition-duration:1.55s;transition-duration:1.55s}[data-aos][data-aos][data-aos-delay="1550"],body[data-aos-delay="1550"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1550"].aos-animate,body[data-aos-delay="1550"] [data-aos].aos-animate{-webkit-transition-delay:1.55s;-o-transition-delay:1.55s;transition-delay:1.55s}[data-aos][data-aos][data-aos-duration="1600"],body[data-aos-duration="1600"] [data-aos]{-webkit-transition-duration:1.6s;-o-transition-duration:1.6s;transition-duration:1.6s}[data-aos][data-aos][data-aos-delay="1600"],body[data-aos-delay="1600"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1600"].aos-animate,body[data-aos-delay="1600"] [data-aos].aos-animate{-webkit-transition-delay:1.6s;-o-transition-delay:1.6s;transition-delay:1.6s}[data-aos][data-aos][data-aos-duration="1650"],body[data-aos-duration="1650"] [data-aos]{-webkit-transition-duration:1.65s;-o-transition-duration:1.65s;transition-duration:1.65s}[data-aos][data-aos][data-aos-delay="1650"],body[data-aos-delay="1650"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1650"].aos-animate,body[data-aos-delay="1650"] [data-aos].aos-animate{-webkit-transition-delay:1.65s;-o-transition-delay:1.65s;transition-delay:1.65s}[data-aos][data-aos][data-aos-duration="1700"],body[data-aos-duration="1700"] [data-aos]{-webkit-transition-duration:1.7s;-o-transition-duration:1.7s;transition-duration:1.7s}[data-aos][data-aos][data-aos-delay="1700"],body[data-aos-delay="1700"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1700"].aos-animate,body[data-aos-delay="1700"] [data-aos].aos-animate{-webkit-transition-delay:1.7s;-o-transition-delay:1.7s;transition-delay:1.7s}[data-aos][data-aos][data-aos-duration="1750"],body[data-aos-duration="1750"] [data-aos]{-webkit-transition-duration:1.75s;-o-transition-duration:1.75s;transition-duration:1.75s}[data-aos][data-aos][data-aos-delay="1750"],body[data-aos-delay="1750"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1750"].aos-animate,body[data-aos-delay="1750"] [data-aos].aos-animate{-webkit-transition-delay:1.75s;-o-transition-delay:1.75s;transition-delay:1.75s}[data-aos][data-aos][data-aos-duration="1800"],body[data-aos-duration="1800"] [data-aos]{-webkit-transition-duration:1.8s;-o-transition-duration:1.8s;transition-duration:1.8s}[data-aos][data-aos][data-aos-delay="1800"],body[data-aos-delay="1800"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1800"].aos-animate,body[data-aos-delay="1800"] [data-aos].aos-animate{-webkit-transition-delay:1.8s;-o-transition-delay:1.8s;transition-delay:1.8s}[data-aos][data-aos][data-aos-duration="1850"],body[data-aos-duration="1850"] [data-aos]{-webkit-transition-duration:1.85s;-o-transition-duration:1.85s;transition-duration:1.85s}[data-aos][data-aos][data-aos-delay="1850"],body[data-aos-delay="1850"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1850"].aos-animate,body[data-aos-delay="1850"] [data-aos].aos-animate{-webkit-transition-delay:1.85s;-o-transition-delay:1.85s;transition-delay:1.85s}[data-aos][data-aos][data-aos-duration="1900"],body[data-aos-duration="1900"] [data-aos]{-webkit-transition-duration:1.9s;-o-transition-duration:1.9s;transition-duration:1.9s}[data-aos][data-aos][data-aos-delay="1900"],body[data-aos-delay="1900"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1900"].aos-animate,body[data-aos-delay="1900"] [data-aos].aos-animate{-webkit-transition-delay:1.9s;-o-transition-delay:1.9s;transition-delay:1.9s}[data-aos][data-aos][data-aos-duration="1950"],body[data-aos-duration="1950"] [data-aos]{-webkit-transition-duration:1.95s;-o-transition-duration:1.95s;transition-duration:1.95s}[data-aos][data-aos][data-aos-delay="1950"],body[data-aos-delay="1950"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="1950"].aos-animate,body[data-aos-delay="1950"] [data-aos].aos-animate{-webkit-transition-delay:1.95s;-o-transition-delay:1.95s;transition-delay:1.95s}[data-aos][data-aos][data-aos-duration="2000"],body[data-aos-duration="2000"] [data-aos]{-webkit-transition-duration:2s;-o-transition-duration:2s;transition-duration:2s}[data-aos][data-aos][data-aos-delay="2000"],body[data-aos-delay="2000"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2000"].aos-animate,body[data-aos-delay="2000"] [data-aos].aos-animate{-webkit-transition-delay:2s;-o-transition-delay:2s;transition-delay:2s}[data-aos][data-aos][data-aos-duration="2050"],body[data-aos-duration="2050"] [data-aos]{-webkit-transition-duration:2.05s;-o-transition-duration:2.05s;transition-duration:2.05s}[data-aos][data-aos][data-aos-delay="2050"],body[data-aos-delay="2050"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2050"].aos-animate,body[data-aos-delay="2050"] [data-aos].aos-animate{-webkit-transition-delay:2.05s;-o-transition-delay:2.05s;transition-delay:2.05s}[data-aos][data-aos][data-aos-duration="2100"],body[data-aos-duration="2100"] [data-aos]{-webkit-transition-duration:2.1s;-o-transition-duration:2.1s;transition-duration:2.1s}[data-aos][data-aos][data-aos-delay="2100"],body[data-aos-delay="2100"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2100"].aos-animate,body[data-aos-delay="2100"] [data-aos].aos-animate{-webkit-transition-delay:2.1s;-o-transition-delay:2.1s;transition-delay:2.1s}[data-aos][data-aos][data-aos-duration="2150"],body[data-aos-duration="2150"] [data-aos]{-webkit-transition-duration:2.15s;-o-transition-duration:2.15s;transition-duration:2.15s}[data-aos][data-aos][data-aos-delay="2150"],body[data-aos-delay="2150"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2150"].aos-animate,body[data-aos-delay="2150"] [data-aos].aos-animate{-webkit-transition-delay:2.15s;-o-transition-delay:2.15s;transition-delay:2.15s}[data-aos][data-aos][data-aos-duration="2200"],body[data-aos-duration="2200"] [data-aos]{-webkit-transition-duration:2.2s;-o-transition-duration:2.2s;transition-duration:2.2s}[data-aos][data-aos][data-aos-delay="2200"],body[data-aos-delay="2200"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2200"].aos-animate,body[data-aos-delay="2200"] [data-aos].aos-animate{-webkit-transition-delay:2.2s;-o-transition-delay:2.2s;transition-delay:2.2s}[data-aos][data-aos][data-aos-duration="2250"],body[data-aos-duration="2250"] [data-aos]{-webkit-transition-duration:2.25s;-o-transition-duration:2.25s;transition-duration:2.25s}[data-aos][data-aos][data-aos-delay="2250"],body[data-aos-delay="2250"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2250"].aos-animate,body[data-aos-delay="2250"] [data-aos].aos-animate{-webkit-transition-delay:2.25s;-o-transition-delay:2.25s;transition-delay:2.25s}[data-aos][data-aos][data-aos-duration="2300"],body[data-aos-duration="2300"] [data-aos]{-webkit-transition-duration:2.3s;-o-transition-duration:2.3s;transition-duration:2.3s}[data-aos][data-aos][data-aos-delay="2300"],body[data-aos-delay="2300"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2300"].aos-animate,body[data-aos-delay="2300"] [data-aos].aos-animate{-webkit-transition-delay:2.3s;-o-transition-delay:2.3s;transition-delay:2.3s}[data-aos][data-aos][data-aos-duration="2350"],body[data-aos-duration="2350"] [data-aos]{-webkit-transition-duration:2.35s;-o-transition-duration:2.35s;transition-duration:2.35s}[data-aos][data-aos][data-aos-delay="2350"],body[data-aos-delay="2350"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2350"].aos-animate,body[data-aos-delay="2350"] [data-aos].aos-animate{-webkit-transition-delay:2.35s;-o-transition-delay:2.35s;transition-delay:2.35s}[data-aos][data-aos][data-aos-duration="2400"],body[data-aos-duration="2400"] [data-aos]{-webkit-transition-duration:2.4s;-o-transition-duration:2.4s;transition-duration:2.4s}[data-aos][data-aos][data-aos-delay="2400"],body[data-aos-delay="2400"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2400"].aos-animate,body[data-aos-delay="2400"] [data-aos].aos-animate{-webkit-transition-delay:2.4s;-o-transition-delay:2.4s;transition-delay:2.4s}[data-aos][data-aos][data-aos-duration="2450"],body[data-aos-duration="2450"] [data-aos]{-webkit-transition-duration:2.45s;-o-transition-duration:2.45s;transition-duration:2.45s}[data-aos][data-aos][data-aos-delay="2450"],body[data-aos-delay="2450"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2450"].aos-animate,body[data-aos-delay="2450"] [data-aos].aos-animate{-webkit-transition-delay:2.45s;-o-transition-delay:2.45s;transition-delay:2.45s}[data-aos][data-aos][data-aos-duration="2500"],body[data-aos-duration="2500"] [data-aos]{-webkit-transition-duration:2.5s;-o-transition-duration:2.5s;transition-duration:2.5s}[data-aos][data-aos][data-aos-delay="2500"],body[data-aos-delay="2500"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2500"].aos-animate,body[data-aos-delay="2500"] [data-aos].aos-animate{-webkit-transition-delay:2.5s;-o-transition-delay:2.5s;transition-delay:2.5s}[data-aos][data-aos][data-aos-duration="2550"],body[data-aos-duration="2550"] [data-aos]{-webkit-transition-duration:2.55s;-o-transition-duration:2.55s;transition-duration:2.55s}[data-aos][data-aos][data-aos-delay="2550"],body[data-aos-delay="2550"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2550"].aos-animate,body[data-aos-delay="2550"] [data-aos].aos-animate{-webkit-transition-delay:2.55s;-o-transition-delay:2.55s;transition-delay:2.55s}[data-aos][data-aos][data-aos-duration="2600"],body[data-aos-duration="2600"] [data-aos]{-webkit-transition-duration:2.6s;-o-transition-duration:2.6s;transition-duration:2.6s}[data-aos][data-aos][data-aos-delay="2600"],body[data-aos-delay="2600"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2600"].aos-animate,body[data-aos-delay="2600"] [data-aos].aos-animate{-webkit-transition-delay:2.6s;-o-transition-delay:2.6s;transition-delay:2.6s}[data-aos][data-aos][data-aos-duration="2650"],body[data-aos-duration="2650"] [data-aos]{-webkit-transition-duration:2.65s;-o-transition-duration:2.65s;transition-duration:2.65s}[data-aos][data-aos][data-aos-delay="2650"],body[data-aos-delay="2650"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2650"].aos-animate,body[data-aos-delay="2650"] [data-aos].aos-animate{-webkit-transition-delay:2.65s;-o-transition-delay:2.65s;transition-delay:2.65s}[data-aos][data-aos][data-aos-duration="2700"],body[data-aos-duration="2700"] [data-aos]{-webkit-transition-duration:2.7s;-o-transition-duration:2.7s;transition-duration:2.7s}[data-aos][data-aos][data-aos-delay="2700"],body[data-aos-delay="2700"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2700"].aos-animate,body[data-aos-delay="2700"] [data-aos].aos-animate{-webkit-transition-delay:2.7s;-o-transition-delay:2.7s;transition-delay:2.7s}[data-aos][data-aos][data-aos-duration="2750"],body[data-aos-duration="2750"] [data-aos]{-webkit-transition-duration:2.75s;-o-transition-duration:2.75s;transition-duration:2.75s}[data-aos][data-aos][data-aos-delay="2750"],body[data-aos-delay="2750"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2750"].aos-animate,body[data-aos-delay="2750"] [data-aos].aos-animate{-webkit-transition-delay:2.75s;-o-transition-delay:2.75s;transition-delay:2.75s}[data-aos][data-aos][data-aos-duration="2800"],body[data-aos-duration="2800"] [data-aos]{-webkit-transition-duration:2.8s;-o-transition-duration:2.8s;transition-duration:2.8s}[data-aos][data-aos][data-aos-delay="2800"],body[data-aos-delay="2800"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2800"].aos-animate,body[data-aos-delay="2800"] [data-aos].aos-animate{-webkit-transition-delay:2.8s;-o-transition-delay:2.8s;transition-delay:2.8s}[data-aos][data-aos][data-aos-duration="2850"],body[data-aos-duration="2850"] [data-aos]{-webkit-transition-duration:2.85s;-o-transition-duration:2.85s;transition-duration:2.85s}[data-aos][data-aos][data-aos-delay="2850"],body[data-aos-delay="2850"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2850"].aos-animate,body[data-aos-delay="2850"] [data-aos].aos-animate{-webkit-transition-delay:2.85s;-o-transition-delay:2.85s;transition-delay:2.85s}[data-aos][data-aos][data-aos-duration="2900"],body[data-aos-duration="2900"] [data-aos]{-webkit-transition-duration:2.9s;-o-transition-duration:2.9s;transition-duration:2.9s}[data-aos][data-aos][data-aos-delay="2900"],body[data-aos-delay="2900"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2900"].aos-animate,body[data-aos-delay="2900"] [data-aos].aos-animate{-webkit-transition-delay:2.9s;-o-transition-delay:2.9s;transition-delay:2.9s}[data-aos][data-aos][data-aos-duration="2950"],body[data-aos-duration="2950"] [data-aos]{-webkit-transition-duration:2.95s;-o-transition-duration:2.95s;transition-duration:2.95s}[data-aos][data-aos][data-aos-delay="2950"],body[data-aos-delay="2950"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="2950"].aos-animate,body[data-aos-delay="2950"] [data-aos].aos-animate{-webkit-transition-delay:2.95s;-o-transition-delay:2.95s;transition-delay:2.95s}[data-aos][data-aos][data-aos-duration="3000"],body[data-aos-duration="3000"] [data-aos]{-webkit-transition-duration:3s;-o-transition-duration:3s;transition-duration:3s}[data-aos][data-aos][data-aos-delay="3000"],body[data-aos-delay="3000"] [data-aos]{-webkit-transition-delay:0;-o-transition-delay:0;transition-delay:0}[data-aos][data-aos][data-aos-delay="3000"].aos-animate,body[data-aos-delay="3000"] [data-aos].aos-animate{-webkit-transition-delay:3s;-o-transition-delay:3s;transition-delay:3s}[data-aos][data-aos][data-aos-easing=linear],body[data-aos-easing=linear] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.25,.25,.75,.75);-o-transition-timing-function:cubic-bezier(.25,.25,.75,.75);transition-timing-function:cubic-bezier(.25,.25,.75,.75)}[data-aos][data-aos][data-aos-easing=ease],body[data-aos-easing=ease] [data-aos]{-webkit-transition-timing-function:ease;-o-transition-timing-function:ease;transition-timing-function:ease}[data-aos][data-aos][data-aos-easing=ease-in],body[data-aos-easing=ease-in] [data-aos]{-webkit-transition-timing-function:ease-in;-o-transition-timing-function:ease-in;transition-timing-function:ease-in}[data-aos][data-aos][data-aos-easing=ease-out],body[data-aos-easing=ease-out] [data-aos]{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}[data-aos][data-aos][data-aos-easing=ease-in-out],body[data-aos-easing=ease-in-out] [data-aos]{-webkit-transition-timing-function:ease-in-out;-o-transition-timing-function:ease-in-out;transition-timing-function:ease-in-out}[data-aos][data-aos][data-aos-easing=ease-in-back],body[data-aos-easing=ease-in-back] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.6,-.28,.735,.045);-o-transition-timing-function:cubic-bezier(.6,-.28,.735,.045);transition-timing-function:cubic-bezier(.6,-.28,.735,.045)}[data-aos][data-aos][data-aos-easing=ease-out-back],body[data-aos-easing=ease-out-back] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.175,.885,.32,1.275);-o-transition-timing-function:cubic-bezier(.175,.885,.32,1.275);transition-timing-function:cubic-bezier(.175,.885,.32,1.275)}[data-aos][data-aos][data-aos-easing=ease-in-out-back],body[data-aos-easing=ease-in-out-back] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.68,-.55,.265,1.55);-o-transition-timing-function:cubic-bezier(.68,-.55,.265,1.55);transition-timing-function:cubic-bezier(.68,-.55,.265,1.55)}[data-aos][data-aos][data-aos-easing=ease-in-sine],body[data-aos-easing=ease-in-sine] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.47,0,.745,.715);-o-transition-timing-function:cubic-bezier(.47,0,.745,.715);transition-timing-function:cubic-bezier(.47,0,.745,.715)}[data-aos][data-aos][data-aos-easing=ease-out-sine],body[data-aos-easing=ease-out-sine] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.39,.575,.565,1);-o-transition-timing-function:cubic-bezier(.39,.575,.565,1);transition-timing-function:cubic-bezier(.39,.575,.565,1)}[data-aos][data-aos][data-aos-easing=ease-in-out-sine],body[data-aos-easing=ease-in-out-sine] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.445,.05,.55,.95);-o-transition-timing-function:cubic-bezier(.445,.05,.55,.95);transition-timing-function:cubic-bezier(.445,.05,.55,.95)}[data-aos][data-aos][data-aos-easing=ease-in-quad],body[data-aos-easing=ease-in-quad] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.55,.085,.68,.53);-o-transition-timing-function:cubic-bezier(.55,.085,.68,.53);transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quad],body[data-aos-easing=ease-out-quad] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.25,.46,.45,.94);-o-transition-timing-function:cubic-bezier(.25,.46,.45,.94);transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quad],body[data-aos-easing=ease-in-out-quad] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.455,.03,.515,.955);-o-transition-timing-function:cubic-bezier(.455,.03,.515,.955);transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-cubic],body[data-aos-easing=ease-in-cubic] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.55,.085,.68,.53);-o-transition-timing-function:cubic-bezier(.55,.085,.68,.53);transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-cubic],body[data-aos-easing=ease-out-cubic] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.25,.46,.45,.94);-o-transition-timing-function:cubic-bezier(.25,.46,.45,.94);transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-cubic],body[data-aos-easing=ease-in-out-cubic] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.455,.03,.515,.955);-o-transition-timing-function:cubic-bezier(.455,.03,.515,.955);transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos][data-aos][data-aos-easing=ease-in-quart],body[data-aos-easing=ease-in-quart] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.55,.085,.68,.53);-o-transition-timing-function:cubic-bezier(.55,.085,.68,.53);transition-timing-function:cubic-bezier(.55,.085,.68,.53)}[data-aos][data-aos][data-aos-easing=ease-out-quart],body[data-aos-easing=ease-out-quart] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.25,.46,.45,.94);-o-transition-timing-function:cubic-bezier(.25,.46,.45,.94);transition-timing-function:cubic-bezier(.25,.46,.45,.94)}[data-aos][data-aos][data-aos-easing=ease-in-out-quart],body[data-aos-easing=ease-in-out-quart] [data-aos]{-webkit-transition-timing-function:cubic-bezier(.455,.03,.515,.955);-o-transition-timing-function:cubic-bezier(.455,.03,.515,.955);transition-timing-function:cubic-bezier(.455,.03,.515,.955)}[data-aos^=fade][data-aos^=fade]{opacity:0;-webkit-transition-property:opacity,-webkit-transform;transition-property:opacity,-webkit-transform;-o-transition-property:opacity,transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}[data-aos^=fade][data-aos^=fade].aos-animate{opacity:1;-webkit-transform:translateZ(0);transform:translateZ(0)}[data-aos=fade-up]{-webkit-transform:translate3d(0,100px,0);transform:translate3d(0,100px,0)}[data-aos=fade-down]{-webkit-transform:translate3d(0,-100px,0);transform:translate3d(0,-100px,0)}[data-aos=fade-right]{-webkit-transform:translate3d(-100px,0,0);transform:translate3d(-100px,0,0)}[data-aos=fade-left]{-webkit-transform:translate3d(100px,0,0);transform:translate3d(100px,0,0)}[data-aos=fade-up-right]{-webkit-transform:translate3d(-100px,100px,0);transform:translate3d(-100px,100px,0)}[data-aos=fade-up-left]{-webkit-transform:translate3d(100px,100px,0);transform:translate3d(100px,100px,0)}[data-aos=fade-down-right]{-webkit-transform:translate3d(-100px,-100px,0);transform:translate3d(-100px,-100px,0)}[data-aos=fade-down-left]{-webkit-transform:translate3d(100px,-100px,0);transform:translate3d(100px,-100px,0)}[data-aos^=zoom][data-aos^=zoom]{opacity:0;-webkit-transition-property:opacity,-webkit-transform;transition-property:opacity,-webkit-transform;-o-transition-property:opacity,transform;transition-property:opacity,transform;transition-property:opacity,transform,-webkit-transform}[data-aos^=zoom][data-aos^=zoom].aos-animate{opacity:1;-webkit-transform:translateZ(0) scale(1);transform:translateZ(0) scale(1)}[data-aos=zoom-in]{-webkit-transform:scale(.6);-ms-transform:scale(.6);transform:scale(.6)}[data-aos=zoom-in-up]{-webkit-transform:translate3d(0,100px,0) scale(.6);transform:translate3d(0,100px,0) scale(.6)}[data-aos=zoom-in-down]{-webkit-transform:translate3d(0,-100px,0) scale(.6);transform:translate3d(0,-100px,0) scale(.6)}[data-aos=zoom-in-right]{-webkit-transform:translate3d(-100px,0,0) scale(.6);transform:translate3d(-100px,0,0) scale(.6)}[data-aos=zoom-in-left]{-webkit-transform:translate3d(100px,0,0) scale(.6);transform:translate3d(100px,0,0) scale(.6)}[data-aos=zoom-out]{-webkit-transform:scale(1.2);-ms-transform:scale(1.2);transform:scale(1.2)}[data-aos=zoom-out-up]{-webkit-transform:translate3d(0,100px,0) scale(1.2);transform:translate3d(0,100px,0) scale(1.2)}[data-aos=zoom-out-down]{-webkit-transform:translate3d(0,-100px,0) scale(1.2);transform:translate3d(0,-100px,0) scale(1.2)}[data-aos=zoom-out-right]{-webkit-transform:translate3d(-100px,0,0) scale(1.2);transform:translate3d(-100px,0,0) scale(1.2)}[data-aos=zoom-out-left]{-webkit-transform:translate3d(100px,0,0) scale(1.2);transform:translate3d(100px,0,0) scale(1.2)}[data-aos^=slide][data-aos^=slide]{-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform}[data-aos^=slide][data-aos^=slide].aos-animate{-webkit-transform:translateZ(0);transform:translateZ(0)}[data-aos=slide-up]{-webkit-transform:translate3d(0,100%,0);transform:translate3d(0,100%,0)}[data-aos=slide-down]{-webkit-transform:translate3d(0,-100%,0);transform:translate3d(0,-100%,0)}[data-aos=slide-right]{-webkit-transform:translate3d(-100%,0,0);transform:translate3d(-100%,0,0)}[data-aos=slide-left]{-webkit-transform:translate3d(100%,0,0);transform:translate3d(100%,0,0)}[data-aos^=flip][data-aos^=flip]{-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform, -webkit-transform}[data-aos=flip-left]{-webkit-transform:perspective(2500px) rotateY(-100deg);transform:perspective(2500px) rotateY(-100deg)}[data-aos=flip-left].aos-animate{-webkit-transform:perspective(2500px) rotateY(0);transform:perspective(2500px) rotateY(0)}[data-aos=flip-right]{-webkit-transform:perspective(2500px) rotateY(100deg);transform:perspective(2500px) rotateY(100deg)}[data-aos=flip-right].aos-animate{-webkit-transform:perspective(2500px) rotateY(0);transform:perspective(2500px) rotateY(0)}[data-aos=flip-up]{-webkit-transform:perspective(2500px) rotateX(-100deg);transform:perspective(2500px) rotateX(-100deg)}[data-aos=flip-up].aos-animate{-webkit-transform:perspective(2500px) rotateX(0);transform:perspective(2500px) rotateX(0)}[data-aos=flip-down]{-webkit-transform:perspective(2500px) rotateX(100deg);transform:perspective(2500px) rotateX(100deg)}[data-aos=flip-down].aos-animate{-webkit-transform:perspective(2500px) rotateX(0);transform:perspective(2500px) rotateX(0)}/** * Component Tiles **/ /** * Component Tile **/ .c-tiles { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; } @media only screen and (max-width: 767px) { .c-tiles { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; } } @media only screen and (min-width: 768px) { .c-tiles { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-flow: row wrap; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-align-content: flex-start; -ms-flex-line-pack: start; align-content: flex-start; } } .c-tiles::after { content: ""; width: 100%; height: 100%; position: absolute; top: 0; left: 0; pointer-events: none; z-index: 1; opacity: 0; background-color: rgba(29, 31, 38, 0.85); } .c-tiles:not(.c-tiles--no-transition).c-tiles::after { -webkit-transition: all ease-in-out 0.3s; -o-transition: all ease-in-out 0.3s; transition: all ease-in-out 0.3s; } .c-tiles--overlay::after { opacity: 1; pointer-events: initial; } .c-tile { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: background-size .3s ease-out; -o-transition: background-size .3s ease-out; transition: background-size .3s ease-out; background-position: center; background-size: 100%; -webkit-box-align: stretch; -webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch; } .no-touchevents .c-tile-external-url:not(.c-tile--popup):hover .b-project, .no-touchevents .c-tile.tile-no-url:not(.c-tile--popup):hover .b-project { cursor: pointer; } .c-tile.single { font-size: 10px !important; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-tile.single { font-size: calc((30 / (3 * 10.24)) * 1vw); width: 33.33333%; height: calc(33.33333vw - 5px); } } @media only screen and (min-width: 1024px) and (max-width: 1919px) { .c-tile.single { font-size: calc((30 / (4 * 10.24)) * 1vw); width: 25%; height: calc(25vw - 3.75px); } } @media only screen and (min-width: 1920px) { .c-tile.single { font-size: calc((30 / (6 * 10.24)) * 1vw); width: 16.66667%; height: calc(16.66667vw - 2.5px); } } @media only screen and (max-width: 767px) { .c-tile.single { width: 100%; height: calc(100vw - 15px); } } .js-tile-wrapper > .c-tile.single { width: 100%; height: 100%; } .js-tile-wrapper > .c-tile.single:not(.c-tile--popup) { -webkit-transform: none !important; -ms-transform: none !important; transform: none !important; } .c-tile.single.js-tile-wrapper { overflow: visible; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .c-tile.double { font-size: calc((30 / (3 * 10.24)) * 1vw); width: 66.66667%; height: calc(33.33333vw - 5px); } } @media only screen and (min-width: 1024px) and (max-width: 1919px) { .c-tile.double { font-size: calc((30 / (4 * 10.24)) * 1vw); width: 50%; height: calc(25vw - 3.75px); } } @media only screen and (min-width: 1920px) { .c-tile.double { font-size: calc((30 / (6 * 10.24)) * 1vw); width: 33.33333%; height: calc(16.66667vw - 2.5px); } } @media only screen and (max-width: 767px) { .c-tile.double { width: 100%; height: auto; } } @media only screen and (max-width: 767px) { .c-tile:first-child > .b-development { -webkit-box-sizing: border-box; box-sizing: border-box; padding-top: 6.2em; } } .c-tile.project.aisle { background-image: url(/assets/files/aisle-b2d0a68694d4a10ac60fcd6534219835.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.aisle { background-size: cover; } } .c-tile.project.barco { background-image: url(/assets/files/barco-89634b8dde5f2e7f5383420442d59089.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.barco { background-size: cover; } } .c-tile.project.bladepad { background-image: url(/assets/files/bladepad-d675fa01fc8436f4d5c8928e484761b8.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.bladepad { background-size: cover; } } .c-tile.project.boiron { background-image: url(/assets/files/boiron-05f8eb7742d5b20fc756c3d19f64d54f.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.boiron { background-size: cover; } } .c-tile.project.borran_software { background-image: url(/assets/files/borran_software-d48bc1c4d3a6f96ce9ed7cc290f6f4f0.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.borran_software { background-size: cover; } } .c-tile.project.brandsource { background-image: url(/assets/files/brandsource-4265619da99024143857d46c61a275ee.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.brandsource { background-size: cover; } } .c-tile.project.bsecure { background-image: url(/assets/files/bsecure-e12fe14acc5f56eb69341ec54ac0884b.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.bsecure { background-size: cover; } } .c-tile.project.burger_king { background-image: url(/assets/files/burger_king-44b6d1a3921d7e1d16c0e2fe40f5b60c.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.burger_king { background-size: cover; } } .c-tile.project.cisco { background-image: url(/assets/files/cisco-3d1125291add9a10dd1cfcda9b2e4f28.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.cisco { background-size: cover; } } .c-tile.project.comodo { background-image: url(/assets/files/comodo-a40e015d53c6ef5ede6003dcdda94b10.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.comodo { background-size: cover; } } .c-tile.project.dow { background-image: url(/assets/files/dow-989ab821a1c1a8398a6ec793dbfb4d02.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.dow { background-size: cover; } } .c-tile.project.ecwid { background-image: url(/assets/files/ecwid-8b4a3467444738a1d595b0d140359311.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.ecwid { background-size: cover; } } .c-tile.project.emojme { background-image: url(/assets/files/emojme-1096159b0b11bafb2a8742fe7e767a85.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.emojme { background-size: cover; } } .c-tile.project.eventicious { background-image: url(/assets/files/eventicious-5b3c9c021c203d3da038d2f0613460a0.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.eventicious { background-size: cover; } } .c-tile.project.eyeic { background-image: url(/assets/files/eyeic-2d0f381f48d8096c142c915ffda71602.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.eyeic { background-size: cover; } } .c-tile.project.ezlynk { background-image: url(/assets/files/ezlynk-76fd46e4f14d8329e0903cf403f342da.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.ezlynk { background-size: cover; } } .c-tile.project.ellpa { background-image: url(/assets/files/ellpa-39f2cfd26bfb1ce732936dcd3184e863.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.ellpa { background-size: cover; } } .c-tile.project.fest404 { background-image: url(/assets/files/fest404-0118aec070778f4e2434ea1b37b1de94.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.fest404 { background-size: cover; } } .c-tile.project.firecore { background-image: url(/assets/files/firecore-04aec9ce4072039355ed2973e332354e.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.firecore { background-size: cover; } } .c-tile.project.fitbit { background-image: url(/assets/files/fitbit-dfc5f11f3db756b82dae69da0e454f48.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.fitbit { background-size: cover; } } .c-tile.project.fitness_bank { background-image: url(/assets/files/fitness_bank-7c0b60939f0377dd815c0d4492101d11.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.fitness_bank { background-size: cover; } } .c-tile.project.google_glass { background-image: url(/assets/files/google_glass-15293b2917ee5f8f73e6eebdc24d439f.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.google_glass { background-size: cover; } } .c-tile.project.grainger { background-image: url(/assets/files/grainger-d1f8b7795c7477d98b485ce920f94290.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.grainger { background-size: cover; } } .c-tile.project.grants { background-image: url(/assets/files/grants-f0116fd946c1c393ad2bfa2d6adcddc5.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.grants { background-size: cover; } } .c-tile.project.greenlinks { background-image: url(/assets/files/greenlinks-943ed7f37601ffad47e60481867bac14.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.greenlinks { background-size: cover; } } .c-tile.project.henkel { background-image: url(/assets/files/henkel-aac18b2b7d762c7f03b25a80bf116430.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.henkel { background-size: cover; } } .c-tile.project.henry_ford { background-image: url(/assets/files/henry_ford-e58b9ca32efa484191a973c469192d0f.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.henry_ford { background-size: cover; } } .c-tile.project.hex3 { background-image: url(/assets/files/hex3-c5b40825ce80ad40e267e2970612db72.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.hex3 { background-size: cover; } } .c-tile.project.hsbc { background-image: url(/assets/files/hsbc-ad161f2e2c28193fb63d658dc7813940.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.hsbc { background-size: cover; } } .c-tile.project.jaja { background-image: url(/assets/files/jaja-0bbdd5ccaa6c84cfad54818d9017c88a.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.jaja { background-size: cover; } } .c-tile.project.kensington { background-image: url(/assets/files/kensington-594a525614df9dddde690ae5194a13d6.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.kensington { background-size: cover; } } .c-tile.project.kensington_presentair { background-image: url(/assets/files/kensington_presentair-431816575fa65c98e4269f4625f1fdcd.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.kensington_presentair { background-size: cover; } } .c-tile.project.kensington_proximo { background-image: url(/assets/files/kensington_proximo-b876f794888066ff1d8a1d690a6521d5.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.kensington_proximo { background-size: cover; } } .c-tile.project.kia { background-image: url(/assets/files/kia-977e78a859c3823724ffb6d85951a64c.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.kia { background-size: cover; } } .c-tile.project.kompoz { background-image: url(/assets/files/kompoz-8a660883fc3906562be1d94394631c28.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.kompoz { background-size: cover; } } .c-tile.project.leroy_merlin { background-image: url(/assets/files/leroy_merlin-83d12bf7ae90d2a0a8b85decc8fac789.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.leroy_merlin { background-size: cover; } } .c-tile.project.mars { background-image: url(/assets/files/mars-e1d57a65a5ccbd03d4dbc3c0fd56d8d8.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.mars { background-size: cover; } } .c-tile.project.mayday { background-image: url(/assets/files/mayday-f8568efc573e337673b48961c119b8c5.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.mayday { background-size: cover; } } .c-tile.project.mercedes { background-image: url(/assets/files/mercedes-63e78cb1767ae59dc39385596fa4097a.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.mercedes { background-size: cover; } } .c-tile.project.miami_childrens_hospital { background-image: url(/assets/files/miami_childrens_hospital-ecedf735dace509f72a0ffeb61e5576d.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.miami_childrens_hospital { background-size: cover; } } .c-tile.project.mimedia { background-image: url(/assets/files/mimedia-639cd08d74b072631f47cdf1f1bb5cb2.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.mimedia { background-size: cover; } } .c-tile.project.nestle { background-image: url(/assets/files/nestle-334c37caa38de988a07bc94a59ff23c6.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.nestle { background-size: cover; } } .c-tile.project.novartis_pharma { background-image: url(/assets/files/novartis_pharma-b200b23ccf072eb671825d773c1c04da.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.novartis_pharma { background-size: cover; } } .c-tile.project.oneinfour { background-image: url(/assets/files/oneinfour-738fe529df6ee40ed0c64ef06341ebbf.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.oneinfour { background-size: cover; } } .c-tile.project.odds_finder { background-image: url(/assets/files/odds_finder-bba91731a291a74230d7fef088e60f27.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.odds_finder { background-size: cover; } } .c-tile.project.one_spa_world { background-image: url(/assets/files/one_spa_world-96af723fb08cefe14bde1109f1d8a550.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.one_spa_world { background-size: cover; } } .c-tile.project.open_edge { background-image: url(/assets/files/open_edge-e3658316037fc25df4436d5da97a822f.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.open_edge { background-size: cover; } } .c-tile.project.origo { background-image: url(/assets/files/origo-a9864386fb8da1aeff1e2f5ddeacf476.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.origo { background-size: cover; } } .c-tile.project.philip_morris_i { background-image: url(/assets/files/philip_morris_i-a81459489c3a2baba80d1e5fca323bab.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.philip_morris_i { background-size: cover; } } .c-tile.project.ppm { background-image: url(/assets/files/ppm-a94ee902c406b402cbae0a4b838a99eb.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.ppm { background-size: cover; } } .c-tile.project.practiceadmin { background-image: url(/assets/files/practiceadmin-59a870b2fa6bbdeb7125e0e8f0ff088e.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.practiceadmin { background-size: cover; } } .c-tile.project.sberbank { background-image: url(/assets/files/sberbank-712a772f757de55bccd6c929c20d8f2b.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.sberbank { background-size: cover; } } .c-tile.project.shots { background-image: url(/assets/files/shots-f325c562e0d2c3583e65670758578eec.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.shots { background-size: cover; } } .c-tile.project.sns { background-image: url(/assets/files/sns-7f4d4f9d58a110b51b5b307dbc792db8.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.sns { background-size: cover; } } .c-tile.project.sony { background-image: url(/assets/files/sony-1586c1151d1ea5417fe65f2fd7a534c8.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.sony { background-size: cover; } } .c-tile.project.stada { background-image: url(/assets/files/stada-84dbc7ffd06bba49d218ab737f0d0e0c.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.stada { background-size: cover; } } .c-tile.project.thnks { background-image: url(/assets/files/thnks-37b885eecc43db0dd75bcd8f8970575e.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.thnks { background-size: cover; } } .c-tile.project.thomson_reuters { background-image: url(/assets/files/thomson_reuters-57f12b1e53a34a01e5edcb361c447be7.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.thomson_reuters { background-size: cover; } } .c-tile.project.tom_sawyer_fest { background-image: url(/assets/files/tom_sawyer_fest-7894938155e0cefaf1ed2fc837ac0a53.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.tom_sawyer_fest { background-size: cover; } } .c-tile.project.tonal { background-image: url(/assets/files/tonal-31382c149f3313b404c52f6879dacd8f.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.tonal { background-size: cover; } } .c-tile.project.twin_river_casino { background-image: url(/assets/files/twin_river_casino-54e05aa009422a001857cfe58c91a6d8.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.twin_river_casino { background-size: cover; } } .c-tile.project.vision_group { background-image: url(/assets/files/vision_group-843fba10fbbb378290e5179583d42709.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.vision_group { background-size: cover; } } .c-tile.project.wellez { background-image: url(/assets/files/wellez-b7693dfcfceeb9eccae2ac555b9c3b6f.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.wellez { background-size: cover; } } .c-tile.project.wobble { background-image: url(/assets/files/wobble-2fd31c245cb69529b37940dc85f65899.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.wobble { background-size: cover; } } .c-tile.project.world_skills { background-image: url(/assets/files/world_skills-c4b1054cd16322da50b155c24fb47ceb.jpg); } @media only screen and (max-width: 767px) { .see-also .c-tile.project.world_skills { background-size: cover; } } .see-also .c-tile.project.android { background-image: url(/assets/files/android-7f41a8061d808a5ec0deb3755966acea.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.android { background-size: cover; } } .see-also .c-tile.project.apple { background-image: url(/assets/files/apple-fa9614555e79ebc6f56312d7b50cac08.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.apple { background-size: cover; } } .see-also .c-tile.project.apple_tv { background-image: url(/assets/files/apple_tv-faa8149988f54834b9e9524c676521e2.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.apple_tv { background-size: cover; } } .see-also .c-tile.project.ios_and_android { background-image: url(/assets/files/ios_and_android-064b1da985cc024ee06a543ffe97cb7e.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.ios_and_android { background-size: cover; } } .see-also .c-tile.project.smart_tv { background-image: url(/assets/files/smart_tv-d9fb1a3f9a0c25f0560891143f7598c2.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.smart_tv { background-size: cover; } } .see-also .c-tile.project.web { background-image: url(/assets/files/web-5b62dd7233b2c1a5812cdbd8c51d5262.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.web { background-size: cover; } } .see-also .c-tile.project.watch { background-image: url(/assets/files/watch-0034284fd26a921cc698599d06ee3edc.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.watch { background-size: cover; } } .see-also .c-tile.project.windows_and_osx { background-image: url(/assets/files/windows_and_osx-9c496cf360ff4a62d96f741eaf4faabd.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.windows_and_osx { background-size: cover; } } .see-also .c-tile.project.design { background-image: url(/assets/files/design-59ca56e3b06463bf14acd96e2d4ca552.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.design { background-size: cover; } } .see-also .c-tile.project.digital_transformation { background-image: url(/assets/files/digital_transformation-2117a2b252b17b0b8294c9991ae20c01.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.digital_transformation { background-size: cover; } } .see-also .c-tile.project.discovery { background-image: url(/assets/files/discovery-00415dd6c965d01bbacc97680d690a47.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.discovery { background-size: cover; } } .see-also .c-tile.project.fitness_and_wellness { background-image: url(/assets/files/fitness_and_wellness-97423f35370e05d80063e85cecd55ce8.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.fitness_and_wellness { background-size: cover; } } .see-also .c-tile.project.healthcare { background-image: url(/assets/files/healthcare-973e864f7b6ee1e9f8541bfcd930a7cb.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.healthcare { background-size: cover; } } .see-also .c-tile.project.staff_augmentation { background-image: url(/assets/files/staff_augmentation-576b44df4008e68e319f29a2dc7e87f2.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.staff_augmentation { background-size: cover; } } .see-also .c-tile.project.quality_assurance { background-image: url(/assets/files/quality_assurance-2cc89eb82805ad0d70679d82094dcb0c.jpg); background-size: auto 100%; } @media only screen and (max-width: 767px) { .see-also .c-tile.project.quality_assurance { background-size: cover; } } .c-tile__btn { width: 64px; height: 64px; position: absolute; top: 0; right: 0; visibility: hidden; pointer-events: none; display: block; z-index: 4; background-color: transparent; background-repeat: no-repeat; background-image: url(/assets/files/i-24-cross-db1c96032b1a788184081dc816df84eb.svg); background-size: 24px 24px; background-position: 50% 50%; } .c-tile__btn::before { content: ""; background-color: rgba(255, 255, 255, 0.1); position: absolute; top: 0; left: 0; width: 64px; height: 64px; opacity: 0; -webkit-transition: opacity 0.3s easy-in-out; -o-transition: opacity 0.3s easy-in-out; transition: opacity 0.3s easy-in-out; z-index: 3; } .c-tile__btn:hover::before { opacity: 1; } .c-tile--popup > .c-tile__btn { visibility: visible; pointer-events: initial; } .b-tile_project:not(.tile-no-url):not(.c-tile-external-url):after { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; content: ''; -webkit-transition: opacity .3s ease; -o-transition: opacity .3s ease; transition: opacity .3s ease; background-image: -webkit-linear-gradient(315deg, #ff435d, #b0208e); background-image: -o-linear-gradient(315deg, #ff435d, #b0208e); background-image: linear-gradient(135deg, #ff435d, #b0208e); opacity: 0; } .no-touchevents .b-tile_project.c-tile--popup::after, .no-touchevents .b-tile_project:not(.c-tile--popup):hover::after { opacity: 0.7; } .b-tile_testimonial:after { position: absolute; z-index: 2; top: 0; left: 0; width: 100%; height: 100%; content: ''; opacity: 0.9; } .b-tile_testimonial.hsbc:after { background-image: -webkit-linear-gradient(315deg, #37b8ff, #0058ff); background-image: -o-linear-gradient(315deg, #37b8ff, #0058ff); background-image: linear-gradient(135deg, #37b8ff, #0058ff); } .b-tile_testimonial.wobble:after, .b-tile_testimonial.sns:after { background-image: -webkit-linear-gradient(315deg, #b1e752, #00a525); background-image: -o-linear-gradient(315deg, #b1e752, #00a525); background-image: linear-gradient(135deg, #b1e752, #00a525); } .b-tile_testimonial.bladepad:after { background-image: -webkit-linear-gradient(315deg, #ffd461, #ff7c4b); background-image: -o-linear-gradient(315deg, #ffd461, #ff7c4b); background-image: linear-gradient(135deg, #ffd461, #ff7c4b); } .b-tile_testimonial.eventicious:after { background-image: -webkit-linear-gradient(315deg, #ac53ff 0%, #4439ff 100%); background-image: -o-linear-gradient(315deg, #ac53ff 0%, #4439ff 100%); background-image: linear-gradient(135deg, #ac53ff 0%, #4439ff 100%); } .b-tile_testimonial.dow:after { background-image: -webkit-linear-gradient(153deg, #009a9e, #00fc9c); background-image: -o-linear-gradient(153deg, #009a9e, #00fc9c); background-image: linear-gradient(297deg, #009a9e, #00fc9c); } .b-tile_testimonial.ppm:after { background-image: -webkit-linear-gradient(333deg, #ff883a, #ff284c); background-image: -o-linear-gradient(333deg, #ff883a, #ff284c); background-image: linear-gradient(117deg, #ff883a, #ff284c); } .b-tile_testimonial.eyeic:after { background: -webkit-linear-gradient(153deg, #99179c, #ff2747); background: -o-linear-gradient(153deg, #99179c, #ff2747); background: linear-gradient(297deg, #99179c, #ff2747); } .b-tile_testimonial.firecore:after { background: -webkit-linear-gradient(315deg, #ffd461, #ff7c4b); background: -o-linear-gradient(315deg, #ffd461, #ff7c4b); background: linear-gradient(135deg, #ffd461, #ff7c4b); } .b-tile_testimonial.barco:after { background: -webkit-linear-gradient(315deg, #37b8ff, #0058ff); background: -o-linear-gradient(315deg, #37b8ff, #0058ff); background: linear-gradient(135deg, #37b8ff, #0058ff); } .tile-no-url.c-tile:hover { background-size: 100%; } .c-tile:not(.landing) .project-shield-container::after { background-image: none !important; } .see-also { padding: 60px 0; background-color: #1d1f26; } @media only screen and (min-width: 1025px) { .see-also { padding: 120px 0; } } .see-also--border { border-bottom: 2px solid rgba(255, 255, 255, 0.1); } .see-also__title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 72px; line-height: 1.08; color: #ff0044; margin-bottom: 0.54em; margin-bottom: 36px; color: white; text-align: center; } @media only screen and (max-width: 1024px) { .see-also__title { font-size: 58px; } } @media only screen and (max-width: 767px) { .see-also__title { font-size: 28px; } } @media only screen and (min-width: 1025px) { .see-also__title { margin-bottom: 72px; } } .see-also__cards { display: grid; grid-gap: 40px; grid-template-columns: 1fr; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .see-also__cards { grid-gap: 20px; } } @media only screen and (max-width: 767px) { .see-also__cards { grid-gap: 10px; } } @media only screen and (min-width: 768px) { .see-also__cards--wide { grid-template-columns: 1fr 1fr; } .see-also__cards--narrow { grid-template-columns: 1fr 1fr 1fr; } } .see-also__card { position: relative; z-index: 1; overflow: hidden; height: 210px; width: 100%; } .see-also__card__body { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; transition: opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; -o-transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out; transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out; transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; opacity: 0; -webkit-transform: translate3d(0, 30px, 0); transform: translate3d(0, 30px, 0); } .see-also__cards--wide .see-also__card__body { padding: 0 90px; } .see-also__cards--narrow .see-also__card__body { padding: 0 32px; } .see-also__card__logo { -webkit-transition: opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; transition: opacity 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; -o-transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out; transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out; transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out, -webkit-transform 0.2s ease-in-out; opacity: 1; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-sizing: border-box; box-sizing: border-box; } .see-also__cards--wide .see-also__card__logo { padding: 0 90px; } .see-also__cards--narrow .see-also__card__logo { padding: 0 32px; } .see-also__card__logo img { max-width: 100%; } .see-also__card__body + .see-also__card__logo { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .see-also__card__inner { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .see-also__card__inner--background { z-index: 0; -webkit-box-shadow: 0 0 34px 0 rgba(0, 0, 0, 0.17); box-shadow: 0 0 34px 0 rgba(0, 0, 0, 0.17); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; -o-transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } .see-also__card__title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 28px; line-height: 1.28; color: #ff0044; margin-bottom: 0.64em; color: white; margin: 12px 0 0; text-align: center; } @media only screen and (max-width: 1024px) { .see-also__card__title { font-size: 24px; } } @media only screen and (max-width: 767px) { .see-also__card__title { font-size: 18px; } } .see-also__card__body .see-also__card__title { margin: 0; } .see-also__card__description { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 15px; line-height: 1.33; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.665em; color: rgba(255, 255, 255, 0.7); margin: 16px 0 0; text-align: center; } @media only screen and (max-width: 767px) { .see-also__card__description { font-size: 13px; line-height: 1.53; } } .see-also__card::before { content: ""; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; -webkit-transition: opacity 0.3s ease-in-out; -o-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; background-image: -webkit-linear-gradient(315deg, #ff435d, #b0208e); background-image: -o-linear-gradient(315deg, #ff435d, #b0208e); background-image: linear-gradient(135deg, #ff435d, #b0208e); } .see-also__card:hover::before { opacity: 0.7; } .see-also__card:hover .see-also__card__inner--background { -webkit-transform: scale3d(1.1, 1.1, 1.1); transform: scale3d(1.1, 1.1, 1.1); } .see-also__card:hover .see-also__card__body { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } .see-also__card:hover .see-also__card__body + .see-also__card__logo { opacity: 0; -webkit-transform: translate3d(0, -30px, 0); transform: translate3d(0, -30px, 0); } .c-slide.request_estimate { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-flow: column nowrap; -ms-flex-flow: column nowrap; flex-flow: column nowrap; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; background-color: rgba(29, 31, 38, 0.9); -webkit-box-sizing: border-box; box-sizing: border-box; } .b-request_estimate-slide { position: relative; z-index: 2; overflow: hidden; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; color: #bfbfbf; background-color: rgba(29, 31, 38, 0.9); } @media only screen and (max-width: 767px) { .b-request_estimate-slide { min-height: 570px; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-request_estimate-slide { min-height: 600px; } } .b-request_estimate-slide .b-request_content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-sizing: border-box; box-sizing: border-box; font-size: 1em; background-color: #18191c; } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content { width: 100%; background-color: transparent; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .b-request_estimate-slide .b-request_content { padding: 72px 64px 64px; } } @media only screen and (max-width: 767px) { .b-request_estimate-slide .b-request_content { padding: 64px 0 0; } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content { width: calc(calc(100vw - 155px) / 12 * 8 - 1px); } } @media only screen and (max-width: 767px) { .b-request_estimate-slide .b-request_content { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } .b-request_estimate-slide .b-request_content_part { -webkit-box-sizing: border-box; box-sizing: border-box; } .b-request_estimate-slide .b-request_content_part_inner { padding: 48px 0 56px; } @media only screen and (min-width: 1025px) and (max-width: 1199px) { .b-request_estimate-slide .b-request_content_part_inner { padding: 32px 0 48px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part_inner { padding: unset; } } .b-request_estimate-slide .b-request_content_part .b-request_form_inner { width: 100%; overflow: hidden; } .b-request_estimate-slide .b-request_content_part-1 { padding-right: 56px; } @media only screen and (min-width: 1200px) and (max-width: 1359px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: 64px; } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: 72px; } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: 80px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-1 { padding-right: unset; background-color: #18191c; padding: 48px 60px 64px; } } @media only screen and (min-width: 460px) and (max-width: 767px) { .b-request_estimate-slide .b-request_content_part-1 { padding-inline: 32px; } } @media only screen and (max-width: 459px) { .b-request_estimate-slide .b-request_content_part-1 { padding-inline: 24px; } } .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { padding-left: 64px; width: calc(8 * calc(100vw - 155px) / 12 - 67px); } @media only screen and (min-width: 1025px) and (max-width: 1199px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { padding-left: 56px; width: calc(7 * calc(100vw - 155px) / 12 - 56px); } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(7 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1560px) and (max-width: 1799px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(6 * calc(100vw - 155px) / 12 - 76px); } } @media only screen and (min-width: 1800px) and (max-width: 1919px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(5 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: calc(4 * calc(100vw - 155px) / 12 - 80px); padding-left: 80px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-1 .b-request_content_part_inner { width: 100%; padding-left: unset; } } .b-request_estimate-slide .b-request_content_part-2 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; border-right: 1px solid rgba(255, 255, 255, 0.1); padding-left: 56px; } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-2 { border-right: unset; padding-left: unset; margin-bottom: 32px; } } @media only screen and (min-width: 1200px) and (max-width: 1359px) { .b-request_estimate-slide .b-request_content_part-2 { padding-left: 64px; } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-2 { padding-left: 72px; } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-2 { padding-left: 80px; } } .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-right: 56px; height: 100%; width: calc(calc(100vw - 155px) / 12 * 5 - 112px); display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding-right: 64px; width: calc(4 * calc(100vw - 155px) / 12 - 64px); } @media only screen and (min-width: 1025px) and (max-width: 1199px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-right: 56px; width: calc(5 * calc(100vw - 155px) / 12 - 56px); } } @media only screen and (min-width: 1360px) and (max-width: 1559px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(5 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1560px) and (max-width: 1799px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(4 * calc(100vw - 155px) / 12 - 73px); } } @media only screen and (min-width: 1800px) and (max-width: 1919px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(5 * calc(100vw - 155px) / 12 - 72px); } } @media only screen and (min-width: 1920px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: calc(4 * calc(100vw - 155px) / 12 - 80px); padding-right: 80px; } } @media only screen and (max-width: 1024px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { width: auto; padding-right: unset; gap: 32px; margin-bottom: 40px; } } @media only screen and (min-width: 460px) and (max-width: 767px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-inline: 32px; } } @media only screen and (max-width: 459px) { .b-request_estimate-slide .b-request_content_part-2 .b-request_content_part_inner { padding-inline: 24px; } } .b-request_paragraph { font-family: "TT Hoves Pro", "Arial", sans-serif; font-weight: 300; color: white; font-size: 22px; line-height: 1.27; } @media only screen and (min-width: 1360px) and (max-width: 1799px) { .b-request_paragraph { font-size: 24px; line-height: 1.33; } } @media only screen and (min-width: 1800px) and (max-width: 1919px) { .b-request_paragraph { font-size: responsive-clamp(1800, 1919, 24, 28); } } @media only screen and (min-width: 1920px) { .b-request_paragraph { font-size: 28px; } } @media only screen and (max-width: 1024px) { .b-request_paragraph { font-size: 32px; line-height: 48px; } } @media only screen and (min-width: 460px) and (max-width: 767px) { .b-request_paragraph { font-size: 24px; line-height: 32px; } } @media only screen and (max-width: 459px) { .b-request_paragraph { font-size: 22px; line-height: 28px; } } .tonal--intro { position: relative; } @media only screen and (max-width: 767px) { .tonal--intro__logo svg { width: 235px; } } .tonal--intro__bg { position: absolute; top: -200px; } .tonal--intro__bg img { width: 100%; } .tonal--intro__images { padding-top: 625px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } @media only screen and (max-width: 1024px) { .tonal--intro__images { display: none; } } .tonal--intro__images__mobile { display: none; padding-top: 515px; position: relative; } .tonal--intro__images__mobile .hero-image { position: relative; z-index: 5; } .tonal--intro__images__mobile .bg, .tonal--intro__images__mobile .tonal-bg-compose { position: absolute; left: 0; right: 0; bottom: 0; top: 0; } .tonal--intro__images__mobile .tonal-text { position: absolute; top: 60%; left: 0; right: 0; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal--intro__images__mobile { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .tonal--intro__images__mobile picture, .tonal--intro__images__mobile img { width: 100%; display: block; } } .tonal--intro__images__phone { display: none; padding-top: 450px; } .tonal--intro__images__phone .hero-image { position: relative; z-index: 5; margin: auto; } .tonal--intro__images__phone .bg, .tonal--intro__images__phone .tonal-bg-compose { position: absolute; left: 0; right: 0; bottom: 0%; top: 0; } .tonal--intro__images__phone .bg img, .tonal--intro__images__phone .tonal-bg-compose img { display: block; width: 100%; } .tonal--intro__images__phone .tonal-text { position: absolute; top: 74%; left: 0; right: 0; } .tonal--intro__images__phone .tonal-text img { display: block; width: 100%; } @media only screen and (max-width: 767px) { .tonal--intro__images__phone { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .tonal--intro__images__phone img { margin: auto; } } .tonal--intro__images .left, .tonal--intro__images .right { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 1; } .tonal--intro__images .left { right: 170px; top: 115px; } .tonal--intro__images .right { left: 120px; bottom: 50px; } .tonal--intro__images .middle { position: relative; max-width: 1160px; } .tonal--intro__images .middle--bg { position: absolute; z-index: 0; left: 0; right: 0; top: 0; bottom: 0; } .tonal--intro__images .middle--bg .bg, .tonal--intro__images .middle--bg .tonal-bg-compose { position: absolute; width: 100%; bottom: 0; z-index: 0; } .tonal--intro__images .middle--bg .tonal-text { top: 0; left: 5%; bottom: 0; right: 5%; position: absolute; z-index: 0; } .tonal--intro__images .middle--bg .tonal-text img { position: absolute; top: 60%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .tonal--intro__images .middle--bg .tonal-text .mask { width: 100%; height: auto; position: absolute; top: 60%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .tonal--intro__images .middle--bg picture, .tonal--intro__images .middle--bg img { display: block; width: 100%; margin: auto; } .tonal--intro__images .middle--left { position: absolute; left: -50px; top: 25px; z-index: 1; } .tonal--intro__images .middle--right { position: relative; z-index: 1; left: 160px; } .tonal--intro__images .middle--center { position: absolute; top: 340px; left: 230px; z-index: 2; } .tonal--intro__images .middle--center-top-right { position: absolute; top: 145px; right: -9px; z-index: 2; } .tonal--intro--text { position: absolute; z-index: 5; top: 200px; margin: auto; left: 0; right: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media only screen and (max-width: 767px) { .tonal--intro--text { top: 100px; } } .tonal--intro__desc { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 500; font-weight: 500; font-size: 24px; line-height: 1.67; color: rgba(29, 31, 38, 0.7); margin-bottom: 0.835em; margin-top: 48px; text-align: center; color: rgba(255, 255, 255, 0.7); max-width: 85%; } @media only screen and (max-width: 767px) { .tonal--intro__desc { font-size: 18px; } } @media only screen and (max-width: 1024px) { .tonal--intro__desc { width: 100%; } } @media only screen and (max-width: 767px) { .tonal--intro__desc { max-width: 100%; margin-top: -12px; } } .tonal--overview { padding-top: 220px; overflow: hidden; } @media only screen and (max-width: 1024px) { .tonal--overview { padding-top: 145px; } } @media only screen and (max-width: 767px) { .tonal--overview { padding-top: 56px; } } .tonal--overview--text { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .tonal--overview__title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; } @media only screen and (max-width: 1024px) { .tonal--overview__title { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--overview__title { font-size: 24px; } } .tonal--overview__desc { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 500; font-weight: 500; font-size: 24px; line-height: 1.67; color: rgba(29, 31, 38, 0.7); margin-bottom: 0.835em; margin-bottom: 92px; text-align: center; color: rgba(255, 255, 255, 0.7); max-width: 85%; } @media only screen and (max-width: 767px) { .tonal--overview__desc { font-size: 18px; } } @media only screen and (max-width: 1024px) { .tonal--overview__desc { max-width: 92%; margin-bottom: 56px; } } @media only screen and (max-width: 767px) { .tonal--overview__desc { margin-bottom: 20px; max-width: 100%; } } .tonal--overview--cards { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding-bottom: 230px; } @media only screen and (max-width: 1024px) { .tonal--overview--cards { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; max-width: 85%; padding-bottom: 92px; } } @media only screen and (max-width: 767px) { .tonal--overview--cards { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; max-width: 100%; padding-bottom: 64px; } } .tonal--overview--card { -webkit-box-flex: 1; -webkit-flex: 1 1 33.3%; -ms-flex: 1 1 33.3%; flex: 1 1 33.3%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 36px; background: #14141c; margin-right: 36px; border-radius: 20px; } .tonal--overview--card:last-child { margin-right: 0; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal--overview--card:last-child { margin-right: auto; } } @media only screen and (max-width: 1024px) { .tonal--overview--card { -webkit-box-flex: 1; -webkit-flex: 1 1 100%; -ms-flex: 1 1 100%; flex: 1 1 100%; margin-left: auto; margin-right: auto; margin-top: 30px; max-width: 620px; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; padding: 16px 36px; padding-bottom: 43px; } } @media only screen and (max-width: 767px) { .tonal--overview--card { -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; max-width: 100%; padding: 36px; } } .tonal--overview--card__title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 24px; line-height: 1.17; color: #ff0044; margin-bottom: 0.585em; text-transform: uppercase; padding-top: 28px; } @media only screen and (max-width: 1024px) { .tonal--overview--card__title { font-size: 16px; } } @media only screen and (max-width: 767px) { .tonal--overview--card__title { font-size: 12px; } } @media only screen and (max-width: 1024px) { .tonal--overview--card__title { font-size: 24px; padding-top: 12px; } } @media only screen and (max-width: 767px) { .tonal--overview--card__title { font-size: 18px; } } .tonal--overview--card__desc { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-weight: 500; font-size: 16px; line-height: 1.25; color: #ff0044; margin-bottom: 0.625em; text-align: center; line-height: 1.63; color: rgba(255, 255, 255, 0.7); } @media only screen and (max-width: 1024px) { .tonal--overview--card__desc { text-align: left; } } @media only screen and (max-width: 767px) { .tonal--overview--card__desc { font-size: 12px; text-align: center; } } @media only screen and (max-width: 1024px) { .tonal--overview--card__logo svg { width: 90px; height: 90px; } } .tonal--overview .card--mobile .tonal--overview--card__title span { color: #a6ff01; } .tonal--overview .card--tonal .tonal--overview--card__title span { color: #ff0044; } .tonal--overview .card--apple .tonal--overview--card__title span { color: #41d8fe; } .tonal--look { position: relative; z-index: 5; } @media only screen and (max-width: 767px) { .tonal--look { padding: 5% 0 10%; } } .tonal--look .tonal-bg-compose { position: absolute; } .tonal--look__title { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; text-align: center; } @media only screen and (max-width: 1024px) { .tonal--look__title { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--look__title { font-size: 24px; } } .tonal--look__images .hero-image { width: 680px; margin: auto; position: relative; z-index: 5; } .tonal--look__images .logo { position: absolute; width: 924px; z-index: 1; } .tonal--look__images .logo img { -webkit-clip-path: url(#look-logo-mask); clip-path: url(#look-logo-mask); } .tonal--look__images .mask image { -webkit-transform: translateY(-5%); -ms-transform: translateY(-5%); transform: translateY(-5%); } .tonal--look__images img { display: block; width: 100%; } .tonal--look__bg-mobile { display: none; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal--look__bg-mobile { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; position: relative; left: unset; } .tonal--look__bg-mobile .hero-image { max-width: 680px; margin: auto; position: relative; z-index: 5; } .tonal--look__bg-mobile .logo { position: absolute; max-width: 628px; top: 5%; } .tonal--look__bg-mobile img { display: block; width: 100%; } } .tonal--look__bg-phone { display: none; } .tonal--look__bg-phone .hero-image { margin: auto; position: relative; z-index: 5; } .tonal--look__bg-phone .logo { position: absolute; max-width: 628px; top: 10%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } @media only screen and (max-width: 767px) { .tonal--look__bg-phone { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .tonal--look__bg-phone img { width: 100%; } } .tonal--look__bg-1 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin-top: 120px; position: relative; z-index: 1; } .tonal--look__bg-1 img { width: 100%; } @media only screen and (max-width: 1024px) { .tonal--look__bg-1 { display: none; } } .tonal--look__bg-2 { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .tonal--look__bg-2 svg { max-width: 1260px; position: absolute; top: -1300px; } @media only screen and (max-width: 1024px) { .tonal--look__bg-2 { display: none; } } .tonal--watch { position: relative; padding-top: 16%; } .tonal--watch--decoration { position: absolute; top: 0; right: 0; } .tonal--watch--container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; position: relative; z-index: 5; } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch--container { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } @media only screen and (max-width: 1024px) { .tonal--watch--container { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -webkit-flex-direction: column-reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } } .tonal--watch--decor { position: absolute; left: -300px; top: 300px; } .tonal--watch--image { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; padding-right: 24px; position: relative; } @media only screen and (max-width: 1024px) { .tonal--watch--image__desktop { display: none; } } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch--image__desktop { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } .tonal--watch--image__desktop .watch { position: absolute; right: 45px; top: 375px; z-index: 10; } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch--image__desktop .watch { right: 235px; } } @media only screen and (max-width: 1024px) { .tonal--watch--image { display: none; } } .tonal--watch--image__mobile { display: none; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal--watch--image__mobile { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } .tonal--watch--image__mobile img { display: block; width: 100%; } .tonal--watch--image__mobile .icon-health { top: 20%; right: 15%; width: 64px; } .tonal--watch--image__mobile .icon-activity { top: 15%; left: 5%; width: 60px; } .tonal--watch--image__mobile .icon-purple { top: 40%; right: 5%; width: 34px; } .tonal--watch--image__phone { display: none; position: relative; z-index: 5; } @media only screen and (max-width: 767px) { .tonal--watch--image__phone { display: block; left: 25px; margin: 0 auto; max-width: 90%; } .tonal--watch--image__phone img { width: 100%; } } .tonal--watch--image__phone .phone { position: relative; } .tonal--watch--image__phone .icon-health { top: 26%; right: 10%; width: 26px; } .tonal--watch--image__phone .icon-activity { top: 10%; left: -15%; width: 36px; } .tonal--watch--image__phone .icon-purple { top: 5%; right: 10%; width: 16px; } .tonal--watch--image__before { position: absolute; z-index: 1; content: ''; top: -60px; left: -30%; } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch--image__before { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; left: unset; } } .tonal--watch--image .img--watch { width: 100%; position: relative; z-index: 10; } .tonal--watch--text { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; padding-left: 64px; } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch--text { max-width: 85%; text-align: center; } } @media only screen and (max-width: 1024px) { .tonal--watch--text { padding-left: 0; margin: auto; -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 92%; } } @media only screen and (max-width: 767px) { .tonal--watch--text { max-width: 100%; } } .tonal--watch--text h3 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; padding-top: 64px; } @media only screen and (max-width: 1024px) { .tonal--watch--text h3 { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--watch--text h3 { font-size: 24px; } } @media only screen and (max-width: 1024px) { .tonal--watch--text h3 { text-align: center; } } @media only screen and (max-width: 767px) { .tonal--watch--text h3 { padding-top: 0px; } } .tonal--watch--text p { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; font-size: 18px; color: rgba(255, 255, 255, 0.85); /*&:first-child { margin-top: 30px; }*/ } @media only screen and (max-width: 767px) { .tonal--watch--text p { font-size: 16px; } } @media only screen and (max-width: 1024px) { .tonal--watch--text p { text-align: center; } } .tonal--watch__images .icon-health { top: 50%; left: -10%; width: 64px; } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch__images .icon-health { top: 6%; left: auto; width: 64px; right: -18%; } } .tonal--watch__images .icon-activity { top: 22%; right: 5%; width: 60px; } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch__images .icon-activity { top: 5%; right: auto; width: 60px; left: -15%; } } .tonal--watch__images .icon-purple { top: 50%; right: 0; width: 34px; } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch__images .icon-purple { top: 41%; right: -25%; width: 34px; } } .tonal--watch .tonal-bg-compose { position: absolute; left: 65%; top: auto; } @media only screen and (min-width: 1025px) { .tonal--watch .tonal-bg-compose { left: 40%; } } @media only screen and (min-width: 1025px) and (max-width: 1440px) { .tonal--watch .tonal-bg-compose { left: 65%; } } .tonal--watch__bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .tonal--watch__bg_desktop { display: none; } @media only screen and (min-width: 768px) { .tonal--watch__bg_desktop { display: block; left: 0; right: 0; bottom: 0; top: auto; } } .tonal--watch__bg_phone { display: none; } @media only screen and (max-width: 767px) { .tonal--watch__bg_phone { top: auto; bottom: 10%; display: block; } } .tonal--watch .icon-health, .tonal--watch .icon-activity, .tonal--watch .icon-purple { position: absolute; } .tonal--watch .icon-health img, .tonal--watch .icon-activity img, .tonal--watch .icon-purple img { display: block; width: 100%; } .tonal--watch .phone { position: relative; z-index: 5; } .tonal--future { position: relative; } .tonal--future__decoration { display: none; position: absolute; top: -550px; right: 0; } @media only screen and (min-width: 1921px) { .tonal--future__decoration { display: block; } } .tonal--future .tonal-bg-compose { position: absolute; padding: 0; border-radius: 20px; overflow: hidden; } .tonal--future--wrapper { margin-top: 300px; position: relative; z-index: 1; } @media only screen and (max-width: 1024px) { .tonal--future--wrapper { margin-top: 100px; } } @media only screen and (max-width: 767px) { .tonal--future--wrapper { margin-top: 64px; } } .tonal--future--container { margin-left: auto; margin-right: auto; position: relative; background: #14141c; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; border-radius: 20px; } @media only screen and (max-width: 1024px) { .tonal--future--container { -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; max-width: 92%; } } @media only screen and (max-width: 767px) { .tonal--future--container { max-width: 100%; } } .tonal--future--text { -webkit-box-flex: 0; -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; position: relative; z-index: 5; } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .tonal--future--text { -webkit-box-flex: 0; -webkit-flex: 0 0 60%; -ms-flex: 0 0 60%; flex: 0 0 60%; } } @media only screen and (max-width: 1024px) { .tonal--future--text { -webkit-box-flex: 0; -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; } } .tonal--future--text h3 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; margin-bottom: 20px; padding-left: 72px; padding-top: 120px; } @media only screen and (max-width: 1024px) { .tonal--future--text h3 { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--future--text h3 { font-size: 24px; } } @media only screen and (max-width: 1024px) { .tonal--future--text h3 { padding: 60px 80px 0 80px; text-align: center; } } @media only screen and (max-width: 767px) { .tonal--future--text h3 { padding: 36px 16px 0 16px; } } .tonal--future--text p { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; line-height: 1.7; padding-left: 72px; padding-bottom: 120px; color: rgba(255, 255, 255, 0.85); } @media only screen and (max-width: 767px) { .tonal--future--text p { font-size: 16px; } } @media only screen and (max-width: 1024px) { .tonal--future--text p { padding-left: 80px; padding-right: 80px; padding-bottom: 0px; text-align: center; } } @media only screen and (max-width: 767px) { .tonal--future--text p { padding-left: 16px; padding-right: 16px; } } .tonal--future--image { position: relative; z-index: 5; } @media only screen and (min-width: 1025px) { .tonal--future--image { top: -35px; } } @media only screen and (max-width: 1024px) { .tonal--future--image { margin-bottom: -50px; } } .tonal--future--image img { position: absolute; bottom: -50px; left: -160px; } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .tonal--future--image img { left: -265px; } } @media only screen and (max-width: 1024px) { .tonal--future--image img { position: static; width: 100%; display: block; } } .tonal--design { padding-top: 270px; position: relative; z-index: 1; background-color: black; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal--design { padding-top: 180px; } } @media only screen and (max-width: 767px) { .tonal--design { padding-top: 70px; } } .tonal--design .tonal-bg-compose { top: -50%; } .tonal--design__back { position: absolute; left: 0; } .tonal--design .logo { width: 156px; position: absolute; z-index: 6; } .tonal--design .logo img { display: block; width: 100%; } .tonal--design .graph { position: absolute; left: 0; right: 0; } .tonal--design .graph img { display: block; width: 100%; } .tonal--design .tonal-bg-compose { position: absolute; } .tonal--design--images { position: relative; min-height: 1000px; } @media only screen and (max-width: 1024px) { .tonal--design--images { display: none; } } .tonal--design--images .graph { top: 20%; } .tonal--design--images .logo { top: 20%; left: 56%; } .tonal--design--images__mobile { display: none; } .tonal--design--images__mobile img { margin: auto; width: 100%; position: relative; z-index: 5; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal--design--images__mobile { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } } .tonal--design--images__phone { display: none; } .tonal--design--images__phone img { margin: auto; position: relative; z-index: 5; } @media only screen and (max-width: 767px) { .tonal--design--images__phone { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } .tonal--design--images__phone img { width: 100%; } } .tonal--design--images__before { width: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; position: absolute; top: -175px; } .tonal--design--images__before-center { position: absolute; width: 100%; height: 100%; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; top: -70px; } .tonal--design--images__before-center img { margin: auto; } .tonal--design--images .left { position: absolute; left: 0; z-index: 1; } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .tonal--design--images .left { left: -100px; } } .tonal--design--images .center { position: absolute; left: 305px; top: -35px; z-index: 2; } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .tonal--design--images .center { left: 215px; } } .tonal--design--images .right { position: absolute; z-index: 1; right: -10px; top: 210px; } @media only screen and (min-width: 1025px) and (max-width: 1279px) { .tonal--design--images .right { right: -140px; } } .tonal--design--text h3 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; text-align: center; } @media only screen and (max-width: 1024px) { .tonal--design--text h3 { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--design--text h3 { font-size: 24px; } } .tonal--design--text p { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; color: rgba(255, 255, 255, 0.85); margin: auto; text-align: center; } @media only screen and (max-width: 767px) { .tonal--design--text p { font-size: 16px; } } @media only screen and (min-width: 1025px) { .tonal--design--text p { max-width: 65%; } } .tonal--colors { overflow: hidden; } @media only screen and (min-width: 1025px) { .tonal--colors { margin-top: 240px; } } @media only screen and (max-width: 767px) { .tonal--colors--image svg { width: 100%; height: 100%; } } .tonal--colors--container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media only screen and (max-width: 767px) { .tonal--colors { margin-top: 0; } } .tonal--colors--heading h3 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; margin-bottom: 36px; } @media only screen and (max-width: 1024px) { .tonal--colors--heading h3 { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--colors--heading h3 { font-size: 24px; } } .tonal--colors--texts { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 790px; margin-left: 7px; } @media only screen and (max-width: 767px) { .tonal--colors--texts { width: 110%; margin-left: 0; } } .tonal--colors--color { -webkit-box-flex: 0; -webkit-flex: 0 0 33.3%; -ms-flex: 0 0 33.3%; flex: 0 0 33.3%; font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.645em; color: white; text-align: center; } .tonal--soft { margin-top: 120px; } @media only screen and (min-width: 1025px) { .tonal--soft { margin-top: 210px; } } .tonal--soft video { border-radius: 4px; } .tonal--soft .video-player { position: absolute; top: 465px; left: 470px; } @media only screen and (max-width: 1024px) { .tonal--soft .video-player { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; top: 511px; left: unset; } } @media only screen and (max-width: 767px) { .tonal--soft .video-player { top: 223px; } } .tonal--soft .video-player__mobile { display: none; } @media only screen and (max-width: 1024px) { .tonal--soft .video-player__mobile { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; } } @media only screen and (max-width: 767px) { .tonal--soft .video-player__mobile { width: 110px; } .tonal--soft .video-player__mobile video { width: 100%; } } .tonal--soft--text { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; max-width: 716px; text-align: center; } .tonal--soft--text h3 { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; } @media only screen and (max-width: 1024px) { .tonal--soft--text h3 { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--soft--text h3 { font-size: 24px; } } .tonal--soft--text p { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; color: rgba(255, 255, 255, 0.85); } @media only screen and (max-width: 767px) { .tonal--soft--text p { font-size: 16px; } } .tonal--soft--image { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; max-width: 100%; margin: auto; position: relative; bottom: 200px; } @media only screen and (max-width: 767px) { .tonal--soft--image { bottom: 0; } .tonal--soft--image img { width: 1125px; height: 100%; } } .tonal--soft--image--container { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .tonal--soft--image--container .middle-photo { position: relative; z-index: 1; } .tonal--soft--image--container .side-photo { max-height: 390px; margin-right: 40px; margin-top: 40px; position: relative; } .tonal--soft--image--container .side-photo:last-child { margin-right: 0; top: 4446px; } .tonal--soft--image--container .side-photo:nth-child(1) { top: 4446px; } .tonal--soft--image--container .side-photo:nth-child(2) { margin-right: -300px; top: 2790px; } .tonal--soft--image--container .side-photo:nth-child(4) { margin-left: -300px; top: 2790px; } @media only screen and (max-width: 1024px) { .tonal--soft--image--container { display: none; } } .tonal--soft--image > img { display: none; } @media only screen and (max-width: 1024px) { .tonal--soft--image > img { display: inline-block; } } .tonal--reviews { overflow: hidden; position: relative; margin-top: -120px; } .tonal--reviews--content { position: relative; } @media only screen and (min-width: 1025px) { .tonal--reviews { min-height: 900px; } } .tonal--reviews__before { position: absolute; top: -50px; left: 0; width: 100%; height: 100%; background-image: url(/assets/files/i2560_bg-091e9e226fa0aea92c3ba97539d9e55c.png); background-size: contain; background-repeat: no-repeat; background-position: center bottom; } @media only screen and (min-device-pixel-ratio: 2), (-webkit-min-device-pixel-ratio: 2), (-o-min-device-pixel-ratio: 2/1), (min-resolution: 192dpi), (min-resolution: 2dppx) { .tonal--reviews__before { background-image: url(/assets/files/i2560_bg@2x-d2b1b5a64a6a77f892cc3d605750103c.png); } } @media only screen and (max-width: 1024px) { .tonal--reviews__before { background-size: 210%; top: 0px; } } @media only screen and (max-width: 767px) { .tonal--reviews__before { background-size: 300%; } } @media only screen and (max-width: 1024px) { .tonal--reviews { margin-top: -210px; } } @media only screen and (max-width: 767px) { .tonal--reviews { margin-top: 0; background-size: 1250px; } } .tonal--reviews__head { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 50px; line-height: 1.12; color: #ff0044; margin-bottom: 0.56em; color: white; text-align: center; margin-bottom: 64px; } @media only screen and (max-width: 1024px) { .tonal--reviews__head { font-size: 40px; } } @media only screen and (max-width: 767px) { .tonal--reviews__head { font-size: 24px; } } .tonal--reviews--card { width: 940px; margin: auto; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; background: #14141c; border-radius: 20px; } @media only screen and (max-width: 1024px) { .tonal--reviews--card { width: auto; max-width: 92%; padding-bottom: 36px; } } @media only screen and (max-width: 767px) { .tonal--reviews--card { max-width: 100%; height: unset; margin-bottom: 120px; } } .tonal--reviews--card--top { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; padding: 10px 41px 10px 27px; } @media only screen and (max-width: 767px) { .tonal--reviews--card--top { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; padding: 0; } } .tonal--reviews--card--top .left, .tonal--reviews--card--top .stars { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media only screen and (max-width: 767px) { .tonal--reviews--card--top .stars { -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } @media only screen and (max-width: 767px) { .tonal--reviews--card--top .left { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } .tonal--reviews--card--top .text { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } @media only screen and (max-width: 767px) { .tonal--reviews--card--top .text { -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } } .tonal--reviews--card--top .text__name { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 28px; line-height: 1.28; color: #ff0044; margin-bottom: 0.64em; color: white; margin-top: 6px; margin-bottom: 6px; } @media only screen and (max-width: 1024px) { .tonal--reviews--card--top .text__name { font-size: 24px; } } @media only screen and (max-width: 767px) { .tonal--reviews--card--top .text__name { font-size: 18px; } } .tonal--reviews--card--top .text__city { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 700; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.645em; color: rgba(255, 255, 255, 0.85); } @media only screen and (max-width: 767px) { .tonal--reviews--card--top .text__name, .tonal--reviews--card--top .text__city { text-align: center; } } .tonal--reviews--card--top .stars__star { margin-right: 10px; } .tonal--reviews--card--top .stars__star:last-child { margin-right: 0; } @media only screen and (max-width: 767px) { .tonal--reviews--card--top .stars__star svg { width: 18px; } } .tonal--reviews--card--top .card { position: relative; bottom: 3px; } @media only screen and (max-width: 767px) { .tonal--reviews--card--top .card { margin-top: -44px; } } .tonal--reviews--card--bottom hr { border-color: black; opacity: 0.2; } .tonal--reviews--card--bottom .bottom--slider__next { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); bottom: 2px; } .tonal--reviews--card--bottom .bottom--slider__next, .tonal--reviews--card--bottom .bottom--slider__prev { position: relative; z-index: 10000; } .tonal--reviews--card--bottom .bottom--slider__next:focus-within, .tonal--reviews--card--bottom .bottom--slider__next:focus-visible, .tonal--reviews--card--bottom .bottom--slider__next:focus, .tonal--reviews--card--bottom .bottom--slider__prev:focus-within, .tonal--reviews--card--bottom .bottom--slider__prev:focus-visible, .tonal--reviews--card--bottom .bottom--slider__prev:focus { outline: none; } .tonal--reviews--card--bottom .bottom--slider__next svg g, .tonal--reviews--card--bottom .bottom--slider__prev svg g { fill: white; } .tonal--reviews--card--bottom .bottom--slider--nav { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; width: 110px; } @media only screen and (max-width: 1024px) { .tonal--reviews--card--bottom .bottom--slider--nav { margin: auto; } } .tonal--reviews--card--bottom .bottom--slider--container { width: 100%; padding-left: 39px; padding-right: 39px; padding-top: 36px; padding-bottom: 48px; -webkit-box-sizing: border-box; box-sizing: border-box; } @media only screen and (max-width: 1024px) { .tonal--reviews--card--bottom .bottom--slider--container { width: 100%; margin: auto; } } @media only screen and (max-width: 767px) { .tonal--reviews--card--bottom .bottom--slider--container { width: 100%; padding-bottom: 0px; } } .tonal--reviews--card--bottom .bottom--slider-pagination { width: 110px; } @media only screen and (max-width: 1024px) { .tonal--reviews--card--bottom .bottom--slider-pagination { width: 100%; } } .tonal--reviews--card--bottom .bottom--slider--slide .head { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; color: white; margin-bottom: 4px; font-weight: bold; } @media only screen and (max-width: 767px) { .tonal--reviews--card--bottom .bottom--slider--slide .head { font-size: 16px; } } @media only screen and (max-width: 1024px) { .tonal--reviews--card--bottom .bottom--slider--slide .head { text-align: center; color: white; } } .tonal--reviews--card--bottom .bottom--slider--slide .text { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 20px; line-height: 1.8; color: rgba(29, 31, 38, 0.85); margin-bottom: 0.9em; color: rgba(255, 255, 255, 0.85); } @media only screen and (max-width: 767px) { .tonal--reviews--card--bottom .bottom--slider--slide .text { font-size: 16px; } } @media only screen and (max-width: 1024px) { .tonal--reviews--card--bottom .bottom--slider--slide .text { text-align: center; margin-bottom: 35px; } } .tonal--reviews--card--bottom .swiper-pagination-current { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 16px; line-height: 1.5; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.75em; font-weight: bold; color: white; } .tonal--reviews--card--bottom .swiper-pagination-total { font-family: "TT Hoves Pro", Arial, "Helvetica Neue", Helvetica, sans-serif; font-style: normal; font-weight: 400; font-weight: 400; font-size: 16px; line-height: 1.5; color: rgba(29, 31, 38, 0.75); margin-bottom: 0.75em; font-weight: bold; color: #434350; } .tonal--reviews--card--bottom .swiper-pagination-fraction { font-weight: bold; bottom: unset; font-size: 16px; } .tonal-bg-compose { width: 100%; top: 0; left: 50%; right: 0; bottom: 0; max-width: 1920px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .tonal-bg-compose__round { position: absolute; background-position: 50%; background-repeat: no-repeat; background-size: contain; } .tonal-bg-compose__round_blue { background-image: url(/assets/files/gradient-blue-8dae293e6fe0f53aa6371e1515aeaabe.svg); } .tonal-bg-compose__round_purple { background-image: url(/assets/files/gradient-purple-145ca432f97da88111c047d91affd9d9.svg); } .tonal-bg-compose__round_green { background-image: url(/assets/files/gradient-green-8e98d503cd18334cfcf5c9538c7da329.svg); } .tonal-bg-compose__round_orange { background-image: url(/assets/files/gradient-orange-5db70e5a374ce2d921fecc3660b3aca2.svg); } .tonal-bg-compose__round_cian { background-image: url(/assets/files/gradient-cian-568becd6812c97c5f0915852a50cf667.svg); } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_intro { padding-top: 77.26%; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_intro { padding-top: 27.81%; } } .tonal-bg-compose_slide_intro .tonal-bg-compose__round_cian { display: none; visibility: hidden; } .tonal-bg-compose_slide_intro .tonal-bg-compose__round_blue { width: 85%; padding-top: 85%; top: 50%; left: -22.05%; opacity: .8; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_intro .tonal-bg-compose__round_blue { width: 55%; padding-top: 55%; top: 64%; left: 7.95%; opacity: .8; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_intro .tonal-bg-compose__round_blue { width: 25%; padding-top: 25%; top: 70%; left: 17.95%; opacity: .6; } } .tonal-bg-compose_slide_intro .tonal-bg-compose__round_purple { width: 100%; padding-top: 100%; top: 26.5%; left: -8.2%; opacity: .8; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_intro .tonal-bg-compose__round_purple { width: 55%; padding-top: 55%; top: 23.5%; left: 12.8%; opacity: .8; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_intro .tonal-bg-compose__round_purple { width: 50%; padding-top: 50%; top: 27.5%; left: -6.2%; opacity: .75; } } .tonal-bg-compose_slide_intro .tonal-bg-compose__round_green { width: 65%; padding-top: 65%; top: 65.4%; right: -10%; opacity: .5; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_intro .tonal-bg-compose__round_green { width: 35%; padding-top: 35%; top: 60%; right: 17%; opacity: .5; } } .tonal-bg-compose_slide_intro .tonal-bg-compose__round_orange { width: 55%; padding-top: 55%; top: 45%; right: -2%; opacity: .8; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_intro .tonal-bg-compose__round_orange { width: 40%; padding-top: 40%; top: 32%; right: 11%; opacity: .6; } } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_look { padding-top: 77.26%; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_look { padding-top: 38%; } } .tonal-bg-compose_slide_look .tonal-bg-compose__round_cian { display: none; visibility: hidden; } .tonal-bg-compose_slide_look .tonal-bg-compose__round_blue { width: 85%; padding-top: 85%; top: 34%; left: -2.05%; opacity: .9; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_look .tonal-bg-compose__round_blue { width: 55%; padding-top: 55%; top: 44%; left: 7.95%; opacity: .8; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_look .tonal-bg-compose__round_blue { width: 35%; padding-top: 35%; top: 30%; left: 20.95%; opacity: 0.4; } } .tonal-bg-compose_slide_look .tonal-bg-compose__round_purple { width: 120%; padding-top: 120%; top: -22.5%; left: -37.2%; opacity: .8; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_look .tonal-bg-compose__round_purple { width: 75%; padding-top: 75%; top: -20.5%; left: 2.8%; opacity: .4; } } .tonal-bg-compose_slide_look .tonal-bg-compose__round_green { width: 65%; padding-top: 65%; top: 39.4%; right: -2%; opacity: .6; } @media only screen and (min-width: 768px) { .tonal-bg-compose_slide_look .tonal-bg-compose__round_green { width: 35%; padding-top: 35%; top: 20.4%; right: 14%; opacity: .75; } } .tonal-bg-compose_slide_look .tonal-bg-compose__round_orange { width: 120%; padding-top: 120%; top: -10%; right: -40%; opacity: .7; } @media only screen and (min-width: 768px) { .tonal-bg-compose_slide_look .tonal-bg-compose__round_orange { width: 30%; padding-top: 30%; top: -1%; right: 20%; opacity: .8; } } .tonal-bg-compose_slide_watch { padding-top: 100%; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_watch { padding-top: 57.81%; } } .tonal-bg-compose_slide_watch .tonal-bg-compose__round_cian { display: none; visibility: hidden; } .tonal-bg-compose_slide_watch .tonal-bg-compose__round_blue { width: 85%; padding-top: 85%; top: 34%; left: -2.05%; opacity: .9; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_watch .tonal-bg-compose__round_blue { width: 55%; padding-top: 55%; top: 44%; left: 7.95%; opacity: .8; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_watch .tonal-bg-compose__round_blue { width: 35%; padding-top: 35%; top: 41%; left: -9.05%; opacity: 0.7; } } .tonal-bg-compose_slide_watch .tonal-bg-compose__round_purple { width: 120%; padding-top: 120%; top: -22.5%; left: -37.2%; opacity: .8; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_watch .tonal-bg-compose__round_purple { width: 45%; padding-top: 45%; top: -0.5%; left: -5.5%; opacity: 0.6; } } .tonal-bg-compose_slide_watch .tonal-bg-compose__round_green { width: 65%; padding-top: 65%; top: 39.4%; right: -2%; opacity: .6; } @media only screen and (min-width: 768px) { .tonal-bg-compose_slide_watch .tonal-bg-compose__round_green { width: 65%; padding-top: 65%; top: -2.6%; right: auto; opacity: .65; left: 30%; } } .tonal-bg-compose_slide_watch .tonal-bg-compose__round_orange { width: 120%; padding-top: 120%; top: -10%; right: -40%; opacity: .7; } @media only screen and (min-width: 768px) { .tonal-bg-compose_slide_watch .tonal-bg-compose__round_orange { width: 40%; padding-top: 40%; left: 34%; right: auto; opacity: 0.5; top: -36%; } } .tonal-bg-compose_slide_future { padding-top: 100%; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_future { padding-top: 57.81%; } } .tonal-bg-compose_slide_future .tonal-bg-compose__round_cian { display: none; visibility: hidden; } .tonal-bg-compose_slide_future .tonal-bg-compose__round_blue { width: 85%; padding-top: 85%; top: 34%; left: -2.05%; opacity: .9; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_future .tonal-bg-compose__round_blue { width: 55%; padding-top: 55%; top: 44%; left: 7.95%; opacity: .8; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_future .tonal-bg-compose__round_blue { width: 35%; padding-top: 35%; top: 35%; left: 63.95%; opacity: 0.6; } } .tonal-bg-compose_slide_future .tonal-bg-compose__round_purple { width: 120%; padding-top: 120%; top: auto; left: 18.8%; opacity: .8; bottom: -5%; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_future .tonal-bg-compose__round_purple { width: 65%; padding-top: 65%; top: 7.5%; left: 62.8%; opacity: .8; bottom: auto; } } .tonal-bg-compose_slide_future .tonal-bg-compose__round_green { width: 175%; padding-top: 175%; top: 10.4%; right: auto; opacity: .9; left: -66%; bottom: -5%; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_future .tonal-bg-compose__round_green { width: 75%; padding-top: 75%; top: 21.4%; bottom: auto; right: auto; opacity: .7; left: 24%; } } .tonal-bg-compose_slide_future .tonal-bg-compose__round_orange { display: none; visibility: hidden; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_app-design { padding-top: 77.26%; } } .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_cian { display: none; visibility: hidden; } .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_blue { width: 85%; padding-top: 85%; top: 50%; left: -22.05%; opacity: .8; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_blue { width: 55%; padding-top: 55%; top: 64%; left: 7.95%; opacity: .8; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_blue { width: 35%; padding-top: 35%; top: 62%; left: 11.95%; opacity: .6; } } .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_purple { width: 100%; padding-top: 100%; top: 26.5%; left: -8.2%; opacity: .8; } @media only screen and (min-width: 768px) and (max-width: 1024px) { .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_purple { width: 55%; padding-top: 55%; top: 23.5%; left: 12.8%; opacity: .8; } } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_purple { width: 65%; padding-top: 65%; top: 10.5%; left: -12.2%; opacity: .65; } } .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_green { width: 65%; padding-top: 65%; top: 65.4%; right: -10%; opacity: .5; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_green { width: 45%; padding-top: 45%; top: 24%; right: 2%; opacity: .65; } } .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_orange { width: 55%; padding-top: 55%; top: 45%; right: -2%; opacity: .8; } @media only screen and (min-width: 1025px) { .tonal-bg-compose_slide_app-design .tonal-bg-compose__round_orange { width: 40%; padding-top: 40%; top: 47%; right: 17%; opacity: 1; } } .tonal--page { background: black; margin-top: 9em; overflow: hidden; } @media only screen and (max-width: 1024px) { .tonal--page { margin-top: 6.2em; } }