/* Start:/local/templates/.default/assets/css/libs/swiper-bundle.min.css?175309091518454*/ /** * Swiper 11.2.6 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2025 Vladimir Kharlampidi * * Released under the MIT License * * Released on: March 19, 2025 */ @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');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,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:flex;align-items: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.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display: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;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-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:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,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%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-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:flex;justify-content: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%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden} /* End */ /* Start:/local/templates/.default/assets/css/libs/spotlight.min.css?176647810813901*/ @keyframes pulsate{0%,to{opacity:1}50%{opacity:.2}}#spotlight{position:fixed;top:-1px;bottom:-1px;width:100%;z-index:99999;color:#fff;background-color:#000;opacity:0;overflow:hidden;-webkit-user-select:none;user-select:none;transition:opacity .2s ease-out;font-family:Arial,sans-serif;font-size:16px;font-weight:400;contain:strict;touch-action:none;pointer-events:none}#spotlight.show{opacity:1;transition:none;pointer-events:auto}#spotlight.white{color:#212529;background-color:#fff}#spotlight.white .spl-next,#spotlight.white .spl-page~*,#spotlight.white .spl-prev,#spotlight.white .spl-spinner{filter:invert(1)}#spotlight.white .spl-progress{background-color:rgba(0,0,0,.35)}#spotlight.white .spl-footer,#spotlight.white .spl-header{background-color:rgba(255,255,255,.65)}#spotlight.white .spl-button{background:#212529;color:#fff}.spl-footer,.spl-header{background-color:rgba(0,0,0,.45)}#spotlight .contain,#spotlight .cover{object-fit:cover;height:100%;width:100%}#spotlight .contain{object-fit:contain}#spotlight .autofit{object-fit:none;width:auto;height:auto;max-height:none;max-width:none;transition:none}.spl-scene,.spl-spinner,.spl-track{width:100%;height:100%;position:absolute}.spl-track{contain:strict}.spl-spinner{background-position:center;background-repeat:no-repeat;background-size:42px;opacity:0}.spl-spinner.spin{background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzgiIGhlaWdodD0iMzgiIHZpZXdCb3g9IjAgMCAzOCAzOCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBzdHJva2U9IiNmZmYiPjxnIGZpbGw9Im5vbmUiIGZpbGwtcnVsZT0iZXZlbm9kZCI+PGcgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMSAxKSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2Utb3BhY2l0eT0iLjY1Ij48Y2lyY2xlIHN0cm9rZS1vcGFjaXR5PSIuMTUiIGN4PSIxOCIgY3k9IjE4IiByPSIxOCIvPjxwYXRoIGQ9Ik0zNiAxOGMwLTkuOTQtOC4wNi0xOC0xOC0xOCI+PGFuaW1hdGVUcmFuc2Zvcm0gYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgMTggMTgiIHRvPSIzNjAgMTggMTgiIGR1cj0iMXMiIHJlcGVhdENvdW50PSJpbmRlZmluaXRlIi8+PC9wYXRoPjwvZz48L2c+PC9zdmc+);transition:opacity .2s linear .25s;opacity:1}.spl-spinner.error{background-image:url(data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjMyIiB3aWR0aD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBmaWxsPSIjZmZmIiBkPSJNMTYsMUExNSwxNSwwLDEsMCwzMSwxNiwxNSwxNSwwLDAsMCwxNiwxWm0wLDJhMTMsMTMsMCwwLDEsOC40NSwzLjE0TDYuMTQsMjQuNDVBMTMsMTMsMCwwLDEsMTYsM1ptMCwyNmExMywxMywwLDAsMS04LjQ1LTMuMTRMMjUuODYsNy41NUExMywxMywwLDAsMSwxNiwyOVoiIGlkPSJiYW5fc2lnbl9jcm9zc2VkX2NpcmNsZSIvPjwvc3ZnPg==);background-size:128px;transition:none;opacity:.5}.spl-scene{transition:transform .65s cubic-bezier(.1,1,.1,1);contain:layout size;will-change:transform}.spl-pane>*{position:absolute;width:auto;height:auto;max-width:100%;max-height:100%;left:50%;top:50%;margin:0;padding:0;border:0;transform:translate(-50%,-50%) scale(1);transition:transform .65s cubic-bezier(.3,1,.3,1),opacity .65s ease;contain:layout style;will-change:transform,opacity;visibility:hidden}.spl-header,.spl-pane,.spl-progress{position:absolute;top:0}.spl-pane{width:100%;height:100%;transition:transform .65s cubic-bezier(.3,1,.3,1);contain:layout size;will-change:transform,contents}.spl-header{width:100%;height:50px;text-align:right;transform:translateY(-100px);transition:transform .35s ease;overflow:hidden;will-change:transform}#spotlight.menu .spl-footer,#spotlight.menu .spl-header,.spl-footer:hover,.spl-header:hover{transform:translateY(0)}.spl-header div{display:inline-block;vertical-align:middle;white-space:nowrap;width:50px;height:50px;opacity:.5}.spl-progress{width:100%;height:3px;background-color:rgba(255,255,255,.45);transform:translateX(-100%);transition:transform linear}.spl-footer,.spl-next,.spl-prev{position:absolute;transition:transform .35s ease;will-change:transform}.spl-footer{left:0;right:0;bottom:0;line-height:20px;padding:20px 20px 0;padding-bottom:env(safe-area-inset-bottom,0);text-align:left;font-size:15px;font-weight:400;transform:translateY(100%)}.spl-title{font-size:22px}.spl-button,.spl-description,.spl-title{margin-bottom:20px}.spl-button{display:inline-block;background:#fff;color:#000;border-radius:5px;padding:10px 20px;cursor:pointer}.spl-next,.spl-page~*,.spl-prev{background-position:center;background-repeat:no-repeat}.spl-page{float:left;width:auto;line-height:50px}.spl-page~*{background-size:21px;float:right}.spl-fullscreen{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiIHZpZXdCb3g9Ii0xIC0xIDI2IDI2IiB3aWR0aD0iMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggZD0iTTggM0g1YTIgMiAwIDAgMC0yIDJ2M20xOCAwVjVhMiAyIDAgMCAwLTItMmgtM20wIDE4aDNhMiAyIDAgMCAwIDItMnYtM00zIDE2djNhMiAyIDAgMCAwIDIgMmgzIi8+PC9zdmc+)}.spl-fullscreen.on{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyLjUiIHZpZXdCb3g9IjAgMCAyNCAyNCIgd2lkdGg9IjI0IiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik04IDN2M2EyIDIgMCAwIDEtMiAySDNtMTggMGgtM2EyIDIgMCAwIDEtMi0yVjNtMCAxOHYtM2EyIDIgMCAwIDEgMi0yaDNNMyAxNmgzYTIgMiAwIDAgMSAyIDJ2MyIvPjwvc3ZnPg==)}.spl-autofit{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBoZWlnaHQ9Ijk2cHgiIHZpZXdCb3g9IjAgMCA5NiA5NiIgd2lkdGg9Ijk2cHgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PHBhdGggdHJhbnNmb3JtPSJyb3RhdGUoOTAgNTAgNTApIiBmaWxsPSIjZmZmIiBkPSJNNzEuMzExLDgwQzY5LjY3LDg0LjY2LDY1LjIzLDg4LDYwLDg4SDIwYy02LjYzLDAtMTItNS4zNy0xMi0xMlYzNmMwLTUuMjMsMy4zNC05LjY3LDgtMTEuMzExVjc2YzAsMi4yMSwxLjc5LDQsNCw0SDcxLjMxMSAgeiIvPjxwYXRoIHRyYW5zZm9ybT0icm90YXRlKDkwIDUwIDUwKSIgZmlsbD0iI2ZmZiIgZD0iTTc2LDhIMzZjLTYuNjMsMC0xMiw1LjM3LTEyLDEydjQwYzAsNi42Myw1LjM3LDEyLDEyLDEyaDQwYzYuNjMsMCwxMi01LjM3LDEyLTEyVjIwQzg4LDEzLjM3LDgyLjYzLDgsNzYsOHogTTgwLDYwICBjMCwyLjIxLTEuNzksNC00LDRIMzZjLTIuMjEsMC00LTEuNzktNC00VjIwYzAtMi4yMSwxLjc5LTQsNC00aDQwYzIuMjEsMCw0LDEuNzksNCw0VjYweiIvPjwvc3ZnPg==)}.spl-zoom-in,.spl-zoom-out{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSIxMSIgY3k9IjExIiByPSI4Ii8+PGxpbmUgeDE9IjIxIiB4Mj0iMTYuNjUiIHkxPSIyMSIgeTI9IjE2LjY1Ii8+PGxpbmUgeDE9IjgiIHgyPSIxNCIgeTE9IjExIiB5Mj0iMTEiLz48L3N2Zz4=);background-size:22px}.spl-zoom-in{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSIxMSIgY3k9IjExIiByPSI4Ii8+PGxpbmUgeDE9IjIxIiB4Mj0iMTYuNjUiIHkxPSIyMSIgeTI9IjE2LjY1Ii8+PGxpbmUgeDE9IjExIiB4Mj0iMTEiIHkxPSI4IiB5Mj0iMTQiLz48bGluZSB4MT0iOCIgeDI9IjE0IiB5MT0iMTEiIHkyPSIxMSIvPjwvc3ZnPg==)}.spl-download{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIxNDEuNzMycHgiIHZlcnNpb249IjEuMSIgdmlld0JveD0iMCAwIDE0MS43MzIgMTQxLjczMiIgd2lkdGg9IjE0MS43MzJweCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjZmZmIj48cGF0aCBkPSJNMTIwLjY3NCwxMjUuMTM4SDIwLjc5M3YxNi41OTRoOTkuODgxVjEyNS4xMzh6IE0xMTkuMDE5LDU4Ljc3NmMtMi41NjEtMi41NjItNi43MTYtMi41NjItOS4yNzUsMEw3Ny4yMSw5MS4zMTJWNi41NjIgICBDNzcuMjEsMi45MzYsNzQuMjY5LDAsNzAuNjQ4LDBjLTMuNjI0LDAtNi41NiwyLjkzNy02LjU2LDYuNTYzdjg0Ljc1TDMxLjk5Miw1OS4yMThjLTIuNTYyLTIuNTY0LTYuNzE1LTIuNTY0LTkuMjc3LDAgICBjLTIuNTY1LDIuNTYyLTIuNTY1LDYuNzE2LDAsOS4yNzlsNDMuMjk0LDQzLjI5M2MwLjE1LDAuMTU0LDAuMzE0LDAuMjk5LDAuNDgxLDAuNDM4YzAuMDc2LDAuMDYyLDAuMTU1LDAuMTEzLDAuMjM0LDAuMTc2ICAgYzAuMDk0LDAuMDY1LDAuMTg2LDAuMTQyLDAuMjc5LDAuMjA2YzAuMDk3LDAuMDYzLDAuMTkyLDAuMTE0LDAuMjg2LDAuMTc0YzAuMDg4LDAuMDU0LDAuMTc0LDAuMTA1LDAuMjY1LDAuMTUzICAgYzAuMSwwLjA1NiwwLjE5OSwwLjEsMC4yOTgsMC4xNDdjMC4wOTcsMC4wNDUsMC4xOSwwLjA5MSwwLjI4MywwLjEzMmMwLjA5OCwwLjA0LDAuMTk2LDAuMDcyLDAuMjk1LDAuMTA1ICAgYzAuMTA0LDAuMDM4LDAuMjA3LDAuMDc4LDAuMzEyLDAuMTA5YzAuMTAxLDAuMDMsMC4xOTcsMC4wNTIsMC4yOTcsMC4wNzdjMC4xMDgsMC4wMjMsMC4yMTQsMC4wNTgsMC4zMjQsMC4wNzggICBjMC4xMTUsMC4wMjEsMC4yMzEsMC4wMzMsMC4zNDYsMC4wNTRjMC4wOTcsMC4wMTUsMC4xOTIsMC4wMzIsMC4yODksMC4wNDJjMC40MywwLjA0MiwwLjg2NSwwLjA0MiwxLjI5NSwwICAgYzAuMS0wLjAxLDAuMTkxLTAuMDI3LDAuMjg5LTAuMDQyYzAuMTE0LTAuMDIxLDAuMjMzLTAuMDI5LDAuMzQ0LTAuMDU0YzAuMTA5LTAuMDIxLDAuMjE3LTAuMDU1LDAuMzI0LTAuMDc4ICAgYzAuMTAyLTAuMDI1LDAuMTk5LTAuMDQ3LDAuMjk5LTAuMDc3YzAuMTA1LTAuMDMxLDAuMjA3LTAuMDcxLDAuMzEyLTAuMTA5YzAuMTAyLTAuMDMsMC4xOTUtMC4wNjIsMC4yOTUtMC4xMDUgICBjMC4wOTYtMC4wNDEsMC4xOTEtMC4wODcsMC4yODMtMC4xMzJjMC4xLTAuMDQ4LDAuMTk5LTAuMDkyLDAuMjk3LTAuMTQ3YzAuMDkxLTAuMDQ4LDAuMTc3LTAuMTA0LDAuMjY0LTAuMTUzICAgYzAuMDk4LTAuMDYsMC4xOTMtMC4xMSwwLjI4Ny0wLjE3NGMwLjA5Ni0wLjA2NCwwLjE4OS0wLjE0MSwwLjI4MS0wLjIwNmMwLjA3Ni0wLjA2MiwwLjE1Ni0wLjExMywwLjIzMy0wLjE3NiAgIGMwLjI0OS0wLjIwNCwwLjQ3OS0wLjQzNywwLjY5NC0wLjY3YzAuMDc2LTAuMDY3LDAuMTU0LTAuMTMxLDAuMjI5LTAuMjAzbDQzLjI5NC00My4yOTYgICBDMTIxLjU4MSw2NS40OTEsMTIxLjU4MSw2MS4zMzcsMTE5LjAxOSw1OC43NzYiLz48L2c+PC9zdmc+);background-size:20px}.spl-theme{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBoZWlnaHQ9IjI0cHgiIHZlcnNpb249IjEuMiIgdmlld0JveD0iMiAyIDIwIDIwIiB3aWR0aD0iMjRweCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSIjZmZmIj48cGF0aCBkPSJNMTIsNGMtNC40MTgsMC04LDMuNTgyLTgsOHMzLjU4Miw4LDgsOHM4LTMuNTgyLDgtOFMxNi40MTgsNCwxMiw0eiBNMTIsMThjLTMuMzE0LDAtNi0yLjY4Ni02LTZzMi42ODYtNiw2LTZzNiwyLjY4Niw2LDYgUzE1LjMxNCwxOCwxMiwxOHoiLz48cGF0aCBkPSJNMTIsN3YxMGMyLjc1NywwLDUtMi4yNDMsNS01UzE0Ljc1Nyw3LDEyLDd6Ii8+PC9nPjwvc3ZnPg==)}.spl-play{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSItMC41IC0wLjUgMjUgMjUiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSIxMCIvPjxwb2x5Z29uIGZpbGw9IiNmZmYiIHBvaW50cz0iMTAgOCAxNiAxMiAxMCAxNiAxMCA4Ii8+PC9zdmc+)}.spl-play.on{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSItMC41IC0wLjUgMjUgMjUiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjEyIiByPSIxMCIvPjxsaW5lIHgxPSIxMCIgeDI9IjEwIiB5MT0iMTUiIHkyPSI5Ii8+PGxpbmUgeDE9IjE0IiB4Mj0iMTQiIHkxPSIxNSIgeTI9IjkiLz48L3N2Zz4=);animation:pulsate 1s ease infinite}.spl-close{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIyIDIgMjAgMjAiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48bGluZSB4MT0iMTgiIHgyPSI2IiB5MT0iNiIgeTI9IjE4Ii8+PGxpbmUgeDE9IjYiIHgyPSIxOCIgeTE9IjYiIHkyPSIxOCIvPjwvc3ZnPg==)}.spl-info{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+Cjxzdmcgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDI0IDI0IiB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHhtbDpzcGFjZT0icHJlc2VydmUiIHhtbG5zOnNlcmlmPSJodHRwOi8vd3d3LnNlcmlmLmNvbS8iIHN0eWxlPSJmaWxsLXJ1bGU6ZXZlbm9kZDtjbGlwLXJ1bGU6ZXZlbm9kZDtzdHJva2UtbGluZWNhcDpyb3VuZDtzdHJva2UtbGluZWpvaW46cm91bmQ7Ij4KICAgIDxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjkuNiIgc3R5bGU9ImZpbGw6bm9uZTtzdHJva2U6d2hpdGU7c3Ryb2tlLXdpZHRoOjEuOTJweDsiLz4KICAgIDxnIHRyYW5zZm9ybT0ibWF0cml4KDIwLDAsMCwyMCw4LjI2Mzg1LDE5LjMzOTUpIj4KICAgICAgICA8cGF0aCBkPSJNMC4yODgsLTAuNjU5QzAuMjg4LC0wLjYzMyAwLjI3OSwtMC42MTIgMC4yNjEsLTAuNTk0QzAuMjQ0LC0wLjU3NyAwLjIyMywtMC41NjkgMC4xOTgsLTAuNTY5QzAuMTc0LC0wLjU2OSAwLjE1MiwtMC41NzggMC4xMzUsLTAuNTk1QzAuMTE3LC0wLjYxMyAwLjEwOCwtMC42MzQgMC4xMDgsLTAuNjU5QzAuMTA4LC0wLjY4NCAwLjExNywtMC43MDUgMC4xMzUsLTAuNzIyQzAuMTUyLC0wLjc0IDAuMTc0LC0wLjc0OSAwLjE5OCwtMC43NDlDMC4yMjMsLTAuNzQ5IDAuMjQ0LC0wLjc0IDAuMjYxLC0wLjcyMkMwLjI3OSwtMC43MDUgMC4yODgsLTAuNjg0IDAuMjg4LC0wLjY1OVpNMC4zNTQsLTAuMTE4TDAuMzU0LC0wTDAuMDM3LC0wTDAuMDM3LC0wLjExOEwwLjExNSwtMC4xMThMMC4xMTUsLTAuMzkzTDAuMDM3LC0wLjM5M0wwLjAzNywtMC41MTNMMC4yNzgsLTAuNTEzTDAuMjc4LC0wLjExOEwwLjM1NCwtMC4xMThaIiBzdHlsZT0iZmlsbDp3aGl0ZTtmaWxsLXJ1bGU6bm9uemVybzsiLz4KICAgIDwvZz4KPC9zdmc+Cg==)}.spl-next,.spl-prev{top:50%;width:50px;height:50px;opacity:.65;background-color:rgba(0,0,0,.45);border-radius:100%;cursor:pointer;margin-top:-25px;transform:translateX(-100px);background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIj8+PHN2ZyBmaWxsPSJub25lIiBoZWlnaHQ9IjI0IiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSIyIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cG9seWxpbmUgcG9pbnRzPSIxNSAxOCA5IDEyIDE1IDYiLz48L3N2Zz4=);background-size:30px}.spl-prev{left:20px}.spl-next{left:auto;right:20px;transform:translateX(100px) scaleX(-1)}#spotlight.menu .spl-prev{transform:translateX(0)}#spotlight.menu .spl-next{transform:translateX(0) scaleX(-1)}@media (hover:hover){.spl-page~div{cursor:pointer;transition:opacity .2s ease}.spl-next:hover,.spl-page~div:hover,.spl-prev:hover{opacity:1}}@media (max-width:500px){.spl-header div{width:44px}.spl-footer .spl-title{font-size:20px}.spl-footer{font-size:14px}.spl-next,.spl-prev{width:35px;height:35px;margin-top:-17.5px;background-size:15px 15px}.spl-spinner{background-size:30px 30px}}.hide-scrollbars{overflow:hidden!important} /* End */ /* Start:/local/templates/.default/assets/css/style.css?1791554123106004*/ @font-face { font-display: swap; font-family: 'Onest'; font-style: normal; src: url("/local/templates/.default/assets/fonts/Onest/Onest-Variable.woff2") format('woff2'), url("/local/templates/.default/assets/fonts/Onest/Onest-Variable.ttf") format('truetype'); font-weight: 100 900; } /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } button { font-size: inherit; font-family: inherit; } body, html { width: 100%; font-family: Onest, Roboto, Arial, Tahoma, Verdana, sans-serif; font-size: 16px; line-height: 1.5; font-weight: 400; color: var(--blue-color-1); } :root { --container-padding: 15px; --border-color: #7D7882; --light-text-color: #ffffff; --accent-text-color: #ADB2BD; --dark-text-color: #130F33; --notice-text-color: #7D7882; --gray-text-color-1: #213149; --blue-color-1: #130F33; --blue-color-2: #162668; --blue-color-3: #324473; --light-text-active-color: #AAC8C8; --light-text-hover-color: #7ED0D6; --hover-fill-color: #162668; --green-color: #6D7E80; --disabled-background-color: #D6DAE4; --icon-block-hover: #D6DAE4; --error-text-color: #D92D20; --header-height: 81px; --container-max-width: 1216px; --divider-color: #A5A8BE80; /* vacancy-page */ --vacancy-card-header-text-color: #1C2543; /*Blog page*/ --tags-border-color: #213149; --tags-active-color: #D6DAE4; --tags-hover-color: #B3B8C5; --tags-hover-text-color: inherit; /* Change swiper default */ --swiper-navigation-sides-offset: 0; --swiper-navigation-top-offset: 0; /* One place for main z-indexes */ --header-z-index: 500; --modal-z-index: 505; --cookies-modal-z-index: 10; } @media screen and (prefers-reduced-motion: no-preference) { @view-transition { navigation: auto; } } .image { width: 100%; display: block; } .link-underline, .link { font-size: inherit; color: inherit; text-decoration: none; } .h1, .h2, .h3, .h4, .h2-5 { font-weight: 600; letter-spacing: -0.02em; } .h1 { font-size: 60px; line-height: 1.2; } .h2 { font-size: 48px; line-height: 1.25; } .h2-5 { font-size: 36px; line-height: 1.25; } .h3 { font-size: 30px; line-height: 1.25; } .h4 { font-size: 24px; line-height: 1.34; } .header-margin { margin-bottom: 20px; } @media (max-width: 650px) { .header-margin { margin-bottom: 10px; } } [x-cloak] { display: none !important; } .hidden { display: none; } .text-center { text-align: center; } .normal { font-weight: 400; } .medium { font-weight: 600; } .bold { font-weight: 700; } .header-m-smallest { margin-bottom: 10px; } .header-m-small { margin-bottom: 20px; } .header-m-normal { margin-bottom: 40px; } .header-m-big { margin-bottom: 60px; } html { overflow-y: scroll; overflow-x: hidden; } .accent { color: var(--accent-text-color); } .scrollDisabled { position: fixed; } .mobile { display: none; } .tablet { display: none; } .desktop { display: block; } .block { display: block; } .cursor__pointer { cursor: pointer; } .button__text { padding: 0; border: none; background: none; outline: none; color: inherit; cursor: pointer; } .link-dashed { text-decoration: none; display: inline-block; color: var(--blue-color-2); border: 0; background: none; padding: 0; border-bottom: 1px dashed var(--blue-color-2); cursor: pointer; } .notice-text { color: var(--notice-text-color); } @media (min-width: 651px) { .column__split-point { display: block; break-before: column; -webkit-column-break-before: always; } } @media (min-width: 651px) and (max-width: 1080px) { .desktop { display: none; } .tablet { display: block; } } @media (max-width: 650px) { .desktop, .tablet { display: none; } .mobile { display: block; } } a { color: inherit; text-decoration: none; } .no-transition *::after, .no-transition *::before, .no-transition * { transition: none!important; } .standard-padding { padding-top: 40px; padding-bottom: 40px; } .standard-padding__bottom { padding-bottom: 40px; } .standard-padding__top { padding-top: 40px; } .small-padding { padding-top: 30px; padding-bottom: 30px; } .small-padding__bottom { padding-bottom: 30px; } .small-padding__top { padding-top: 30px; } @media (max-width: 650px) { .standard-padding { padding-top: 30px; padding-bottom: 30px; } .standard-padding__top { padding-top: 30px; } .standard-padding__bottom { padding-bottom: 30px; } .small-padding { padding-top: 20px; padding-bottom: 20px; } .small-padding__top { padding-top: 20px; } .small-padding__bottom { padding-bottom: 20px; } } .flex-20 { display: flex; gap: 20px; } /* main page*/ .container { max-width: var(--container-max-width); margin-left: auto; margin-right: auto; padding-left: var(--container-padding); padding-right: var(--container-padding); } .container__narrow { --container-max-width: 865px; } .container__normal { --container-max-width: 1216px; } .header__container { position: sticky; top: -1px; z-index: var(--header-z-index, 500); --container-max-width: 1280px; } .header__container.menu-opened, .header__container.is-pinned { background-color: var(--blue-color-1);} .wrapper { padding-left: var(--container-padding); padding-right: var(--container-padding); } .header { --header-vertical-padding: 15px; --header-main-color: var(--light-text-color, #ffffff); --header-hover-color: var(--light-text-hover-color); --header-block-hover-color: var(--hover-fill-color, #162668); display: flex; /* background-color: black; */ color: var(--header-main-color); max-width: var(--container-max-width); --header-logo-width: 188px; --header-burger-width: 70px; } .header__phone, .header__nav, .header__burger, .header__geo { display: flex; align-items: center; justify-content: center; } .header__block { border-right: 1px solid var(--border-color); } .header__block a { color: var(--header-main-color); text-decoration: none; transition: color 0.15s ease-in-out; } .header__block a:hover { color: var(--header-hover-color); } .header__block:last-child { border-right: 0; } .header__block-active { background-color: var(--blue-color-1); } .header__logo { padding: var(--header-vertical-padding) 0; flex: 0 0 var(--header-logo-width); box-sizing: border-box; } .header__logo-image { display: block; } .header__burger { flex-shrink: 0; padding: var(--header-vertical-padding) 0; width: var(--header-burger-width); min-width: 70px; } .header__logo-image, .header__burger { flex-shrink: 0; } .header__burger { padding: 0; } .dropdown__item:hover, .button__burger:hover { background-color: var(--header-block-hover-color); transition: background 0.15s ease-in; } .dropdown__menu-geo { border: 1px solid var(--border-color); } .dropdown__item-geo:nth-child(n + 2) { border-top: 1px solid var(--border-color); } .button__burger { border: none; width: 100%; height: 100%; background: none; border: none; outline: none; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; z-index: 999; } .button__burger-icons { cursor: pointer; display: block; position: relative; border: none; background: transparent; width: 28px; height: 19px; } .button__burger-icons::before, .button__burger-icons::after { content: ''; left: 0; position: absolute; display: block; width: 100%; height: 2px; background: var(--header-main-color); } .button__burger-icons::before { top: 0; box-shadow: 0 8px 0 var(--header-main-color); transition: box-shadow .3s .15s, top .3s .15s, transform .3s; } .button__burger-icons::after { bottom: 0; transition: bottom .3s .15s, transform .3s; } .button__burger-icons-active::before { top: 6px; transform: rotate(45deg); box-shadow: 0 6px 0 rgba(0, 0, 0, 0); transition: box-shadow .15s, top .3s, transform .3s .15s; } .button__burger-icons-active::after { bottom: 11px; transform: rotate(-45deg); transition: bottom .3s, transform .3s .15s; } .header__nav { width: 26%; padding: var(--header-vertical-padding); margin-right: auto; flex-grow: 1; } .header__nav ul { display: flex; margin-right: -30px; } .header__nav li { margin-right: 30px; } .header__nav li:last-child { margin-right: 0; } .header__nav-hidden { display: none; } .header__partners { width: 28.8%; display: flex; align-items: center; justify-content: center; transition: max-width 0.3s ease; overflow: hidden; } .header__partners-image:not(:last-child) { padding-right: 20px; margin-right: 20px; position: relative; } .header__partners-image:not(:last-child)::before { position: absolute; height: 90%; top: 5%; right: 0; display: block; content: " "; border-right: 1px solid #ffffff; } .header__geo { width: 10.1%; min-width: 123px; } .dropdown { position: relative; } .dropdown__menu { position: absolute; top: 100%; left: -1px; width: 100%; height: 100%; background-color: var(--blue-color-1); } .dropdown__item { display: flex; align-items: center; cursor: pointer; width: 100%; height: 100%; justify-content: center; } .header__dropdown { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; cursor: pointer; } .dropdown__item img { margin-right: 10px; } .dropdown__current { position: relative; } .dropdown__item::after, .dropdown__current::after { width: 12px; height: 6px; top: calc(50% - 3px); content: " "; display: block; padding: 0 6px; background-position: center; background-repeat: no-repeat; } .header__blue { background-color: var(--blue-color-1); } .header__container:not(.is-pinned, .menu-opened) .header__light .dropdown__current:hover::after, .dropdown__current::after { background-image: url("data:image/svg+xml,%3Csvg width='12' height='6' viewBox='0 0 12 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0L6 6L12 0' fill='white'/%3E%3C/svg%3E%0A"); } .header__container:not(.is-pinned, .menu-opened) .header__light .dropdown__current::after { background-image: url("data:image/svg+xml,%3Csvg width='12' height='6' viewBox='0 0 12 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 0L6 6L12 0' fill='%23130F33'/%3E%3C/svg%3E%0A"); } .header__phone { width: 16.5%; padding-left: 20px; align-items: flex-start; min-width: 210px; } .header__callback { padding: 0 0 2px; border-bottom: 1px dashed var(--light-text-color); } .header__callback:hover { color: var(--header-hover-color); border-color: var(--header-hover-color); } .header__phone { flex-direction: column; } .header__phone-link { font-weight: 600; font-size: 20px; } .full-width { width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; } .overflow__hidden { overflow: hidden; overflow: clip; } .divider { border-bottom: 1px solid var(--border-color); } .divider-gray { border-bottom: 1px solid var(--divider-color); } .header__container:not(.is-pinned,.menu-opened) .header__light { --header-main-color: var(--blue-color-1); color: var(--blue-color-1); } .header__container:not(.is-pinned,.menu-opened) .header__light .header__geo:hover, .header__container:not(.is-pinned,.menu-opened) .header__light .button__burger:hover { --header-main-color: var(--light-text-color); color: var(--light-text-color); } /* https://cssfilterconverter.com/ */ .header__container:not(.is-pinned,.menu-opened) .header__light .header__partners-image, .header__container:not(.is-pinned,.menu-opened) .header__light .header__logo-image { filter: brightness(0) saturate(100%) invert(10%) sepia(5%) saturate(7499%) hue-rotate(208deg) brightness(94%) contrast(105%); } /* TODO: Make Menu styles*/ .main-nav { --submenu-color: #213149; --main-menu-color: #AAA5BE; --submenu-hover-color: #162668; --main-menu-hover-color: #FFFFFF; position: absolute; top: 100%; right: 0; background-color: #162668; color: var(--submenu-color); box-sizing: border-box; width: 100%; z-index: 999; } .main-nav a { color: inherit; } .main-nav a:hover { /* Скачет контент, так не делаем */ /* font-weight: 600; */ } .main-nav__container { display: grid; grid-template-areas: "main side" "main footer"; grid-template-columns: calc(var(--header-logo-width) + var(--header-burger-width) + var(--container-padding) + 1px) calc(100% - var(--header-logo-width) - var(--header-burger-width)); grid-template-rows: 1fr 90px; min-height: calc(100vh - var(--header-height)); max-width: calc(var(--container-max-width) + var(--container-padding) * 2); padding: 0; margin-left: auto; margin-right: auto; } .main-nav__menu { grid-area: main; position: relative; padding-top: 40px; box-sizing: border-box; padding-left: var(--container-padding); border-right: 1px solid var(--border-color); } .main-nav__menu li { margin-left: auto; margin-bottom: 20px; color: var(--main-menu-color); } .main-nav__menu-button:hover, .main-nav__menu a:hover { color: var(--main-menu-hover-color); } .main-nav__menu-button.is-active { color: var(--light-text-color); } .main-nav__menu-button.is-active + .menu-arrow { display: inline-block; } .main-nav__menu-button { width: calc(100% - 36px); text-align: left; } .menu-arrow { padding-right: 22px; height: 14px; } .main-nav__menu-wrapper { display: flex; justify-content: space-between; } /* .main-nav__menu>li:hover .main-nav__inner-block { display: block; } */ .main-nav__menu-mobile { display: none; } .main-nav__inner { grid-area: side; height: 100%; } .main-nav__inner-block { position: absolute; width: 100vw; top: 0; left: calc(100% + 1px); display: none; background-color: white; box-sizing: border-box; height: calc(100% - 70px); z-index: 2; } .main-nav__inner-block.is-active { display: block; } .main-nav__inner-block a { display: flex; align-items: center; gap: 10px; color: var(--submenu-color); } .main-nav__inner-block a:hover { color: var(--submenu-hover-color); text-shadow: 1px 0 var(--submenu-hover-color); } .main-nav__inner-header { margin-bottom: 60px; padding-left: 60px; border-bottom: 1px solid var(--border-color); } .main-nav__inner-block { padding-top: 20px; } .main-nav__inner-header { padding: 20px 0 0 60px; } .main-nav__inner-block ul { padding-left: 60px; columns: 2; width: fit-content; } .main-nav__inner-block li { margin-bottom: 20px; margin-right: 100px; } .main-nav__bottom { display: flex; justify-content: space-around; padding: 25px 30px 25px 15px; box-sizing: border-box; align-items: center; max-width: calc(min(100%, var(--container-max-width)) - var(--header-logo-width) - var(--header-burger-width)); } .main-nav__bottom-wrapper { z-index: 2; position: relative; border-top: 1px solid var(--border-color); width: 100vw; background-color: white; grid-area: footer; } .main-nav__inner-block-back { display: none; } .menu-arrow { display: none; } main.under-header { margin-top: calc(-1 * var(--header-height)); } .hero { position: relative; --hero-link-color: #7ED0D6; --hero-link-hover-color: #4D8E93; padding: 0; overflow: hidden; } .hero__video-wrapper { position: absolute; width: 100%; height: 100%; top: 0; } .hero__video-wrapper img, .hero__video-wrapper video { object-fit: cover; width: 100%; height: 100%; object-position: top; } .hero__video-wrapper::after { position: absolute; background: linear-gradient(115.75deg, rgba(0, 0, 0, 0.7) 32.62%, rgba(22, 38, 104, 0.7) 82.54%); content: " "; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; } .hero__video-wrapper__no-gradient::after { content: none; } .hero__video-wrapper__contain video, .hero__video-wrapper__contain img { object-fit: contain; } .hero__main { padding: 200px 0 127px; } .hero__content { position: relative; z-index: 1; color: var(--light-text-color); } .hero___main-h1 { width: 80%; margin-bottom: 40px; } .hero__teasers { width: 84%; display: flex; } .hero__teaser-item { margin-right: 50px; padding-right: 50px; max-width: 320px; border-right: 1px solid var(--border-color); } .hero__teaser-item:last-child { margin-right: 0; padding-right: 0; flex-shrink: 0; border-right: 0; } .hero__teaser-item a { color: var(--hero-link-color); } .hero__teaser-item a:hover { color: var(--hero-link-hover-color); } .hero__teaser-number { line-height: 1; } .marquee__wrapper { --marquee-gap: 60px; display: flex; overflow: hidden; gap: var(--marquee-gap); } .marquee__wrapper:hover .marquee { /* Pause marquee on hover */ /* animation-play-state: paused; */ } .hero__marquue { display: flex; padding: 45px 0; align-items: center; } .hero__marquue img { display: block; } .marquee { animation: scroll 40s linear infinite; justify-content: space-around; gap: var(--marquee-gap); } @keyframes scroll { from { transform: translateX(0); } to { transform: translateX(calc(-100% - var(--marquee-gap))); } } /* main expertise */ .main-expertise { padding-top: 100px; padding-bottom: 40px; } /* funnel */ .funnel { padding-top: 60px; padding-bottom: 60px; counter-reset: funnel -1; display: flex; justify-content: space-between; } .funnel-block, .funnel-links { width: calc(50% - 25px); } .funnel-links__item { counter-increment: funnel; margin-bottom: 30px; } .funnel-links__item:nth-child(1)::before { background-color: #000000; } .funnel-links__item:nth-child(2)::before { background-color: var(--blue-color-1); } .funnel-links__item:nth-child(3)::before { background-color: #324473; } .funnel-links__item:nth-child(4)::before { background-color: var(--green-color); } .funnel-links__item:nth-child(5)::before { background-color: #A5BEBE; } .funnel-links__item:last-child { margin-bottom: 0; } .funnel-links__item-header-block { display: none; } .funnel-links__link-additional { display: none; } .icon-block { --icon-content-padding: 20px; --icon-background: #130F33; --icon-background-image: none; --icon-background-size: 0; --icon-content: counter(funnel, decimal-leading-zero); --icon-color: #ffffff; --icon-font-size: 48px; --icon-width: 103px; border: 1px solid var(--border-color); padding: 20px; display: flex; } .icon-block__simple { border: 1px solid var(--border-color); display: flex; } .icon-block__simple-content { padding: 20px; } .certificate-item__content { min-height: 75px; } .price-item__content { min-height: 90px; width: 68%; } .icon-block::before { display: flex; align-items: center; justify-content: center; content: var(--icon-content); width: fit-content; margin: calc(var(--icon-content-padding) * -1); background-color: var(--icon-background); color: var(--icon-color); font-size: var(--icon-font-size); margin-right: var(--icon-content-padding); padding: var(--icon-content-padding); width: var(--icon-width); box-sizing: border-box; background-image: var(--icon-background-image); background-repeat: no-repeat; background-size: var(--icon-background-size); background-position: center; flex-shrink: 0; } .funnel-link__container { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 5px; } .funnel-link__container-modal { padding: 20px; } .industry-tags, .funnel-links__link { padding: 6px 10px; background-color: #D6DAE4; text-decoration: none; color: var(--gray-text-color-1); transition: filter 0.15s ease-in; border: none; cursor: pointer; } .industry-tags { cursor: default; } .funnel-links__link-more { color: var(--light-text-color); background-color: var(--green-color); line-height: inherit; } .industry-tags:hover, .funnel-links__link:hover { filter: brightness(85%); } .funnel-block { display: flex; flex-direction: column; align-items: center; text-align: center; padding-top: 147px; } .funnel-block__item { font-size: 18px; } .funnel-block__item svg { max-width: 100%; margin-top: 10px; } .funnel-block__item rect { transform-origin: 50% 0; } .funnel-block__item path { transform-origin: 0 100%; } /* callback */ .callback { padding-top: 42px; padding-bottom: 42px; } .callback { display: flex; justify-content: space-between; align-items: center; } .callback__button-block, .callback__text { width: calc(50% - 25px); } .callback__button-block { text-align: center; } .callback__button-block-right { text-align: right; } .callback__h3 { margin-bottom: 10px; } .callback__wide-text .callback__text { width: 55%; } .callback__wide-text .callback__button-block { width: 40%; text-align: right; } .callback__blue { background-color: var(--blue-color-2); color: var(--light-text-color); } .button { padding: 15px 40px; font-size: 18px; font-weight: 500; border: 1px solid var(--blue-color-1); outline: none; background-color: var(--blue-color-1); color: var(--light-text-color); transition: background-color 0.15s ease-in; cursor: pointer; display: inline-block; text-decoration: none; box-sizing: border-box; line-height: inherit; min-height: 60px; } .button img, .button svg { margin-left: 10px; } .button:hover { background-color: var(--hover-fill-color, #162668); border-color: var(--hover-fill-color, #162668); } .button:disabled { background-color: var(--accent-text-color); border-color: var(--accent-text-color); color: var(--light-text-color); } .button__blue { background-color: #162668; border-color: #162668; } .button__blue:hover { background-color: transparent; color: #162668; } .button__blue:hover path { stroke: #162668; } .button__light-blue { background-color: #31A2E5; border-color: #31A2E5; } .button__footer-width { min-width: 270px; } /* cases */ .blue-background { background-color: var(--blue-color-1); color: var(--light-text-color); } .blue-2-background { background-color: var(--blue-color-2); color: var(--light-text-color); } .blue-2-background .button__blue { background-color: var(--blue-color-1); } .blue-background .button__blue { background-color: var(--blue-color-2); } .cases-block { padding-top: 40px; padding-bottom: 80px; } .case-nav__wrapper { overflow-y: hidden; overflow-x: auto; } .cases-nav { padding: 30px 0 15px; display: flex; justify-content: space-between; overflow-y: auto; gap: 20px; margin-bottom: 45px; scrollbar-width: thin; scrollbar-color: #AAA5BE #FFFFFF; } @media (max-width: 768px) { .cases-nav { margin-bottom: 20px; } } .cases-nav__item { white-space: nowrap; } .cases-nav a { color: #AAA5BE; text-decoration: none; min-width: 800px; } .cases-nav__item-current a { color: var(--dark-text-color); } :where(.blue-background) .cases-nav__item-current a { color: var(--light-text-active-color); } .cases-nav a:hover { color: var(--light-text-hover-color); } .cases-main { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 32px } .cases-standalone { margin-bottom: 120px; } @media (max-width: 650px) { .cases-standalone { margin-bottom: 60px; } } .case-item { --main-case-item-background: linear-gradient(90deg, #0C9738 0%, #0B8B34 100%); background: var(--main-case-item-background); position: relative; overflow: hidden; color: var(--light-text-color); align-items: stretch; display: grid; grid-template-rows: 1fr min-content; height: 480px; } .case-item:hover img { transform: scale(1.03); } .a.case-item__h4::after { position: absolute; content: " "; display: block; top: 0; left: 0; z-index: 1; } .case-item img { max-width: 580px; } .case-item__tags { width: fit-content; position: relative; z-index: 1; cursor: pointer; } .case-item__h4 { color: var(--light-text-color); text-decoration: none; margin-bottom: 20px; } .case-item__wide { grid-column: 1 / span 2; display: flex; justify-content: space-between; flex-direction: row; height: 320px; } .case-item__content { box-sizing: border-box; padding: 30px 30px 40px; position: relative; z-index: 1; } .case-item__picture { display: block; margin-left: 222px; margin-top: -100px; width: 100%; pointer-events: none; position: absolute; bottom: 0; } .case-item__picture img { transition: transform 2s ease; height: auto; margin-left: auto; } .case-item__wide .case-item__picture { width: 43%; margin: 0; min-width: 509px; right: auto; margin: 0; position: static; align-self: flex-end; } .case-item__mobile-picture { display: none; } .case-item__wide .case-item__content { width: 44%; } .case-item__tags { display: flex; gap: 5px; margin: 20px 0 30px; } .case-item__tags a { border: 1px solid var(--light-text-color); color: var(--light-text-color); padding: 10px; text-decoration: none; transition: color 0.15s ease, background 0.15s ease; position: relative; } .case-item__tags a:hover { color: var(--dark-text-color); background-color: var(--light-text-color); } .case-item__link { font-size: 18px; text-decoration: none; color: inherit; pointer-events: none; } .link-medium { font-weight: 600; text-decoration: none; color: inherit; } .link { transition: color 0.3s ease; } .link svg, .case-item__link svg { margin-left: 10px; } .case-item__dark-text , .cases-services__slide.case-item__dark-text, .case-item__dark-text { color: var(--dark-text-color); } .case-item__dark-text .tag-item, .case-item__dark-text .case-item__tags a { border: 1px solid var(--dark-text-color); color: var(--dark-text-color); } .case-item__dark-text .tag-item:hover, .case-item__dark-text .case-item__tags a:hover { color: var(--light-text-color); background-color: var(--dark-text-color); } .case-item__dark-text .other-cases__header, .case-item__dark-text .case-item__h4 { color: var(--dark-text-color); } .case-item__dark-text .case-item__link path { stroke: var(--dark-text-color); } .link svg { stroke: var(--blue-color-1); } .link path { stroke: inherit; transition: stroke 0.3s ease; } .link:hover { color: var(--light-text-hover-color); } .link:hover path { stroke: var(--light-text-hover-color); } .case-item__link path { stroke: var(--light-text-color); } @media (max-width: 650px) { .link { font-size: 14px; } .link svg { width: 13px; height: 13px; } } .link-underline { text-decoration: underline; transition: color 0.3s ease; } .case-item__h4::after { position: absolute; width: 100%; height: 100%; display: block; content: " "; top: 0; left: 0; } .cases__button { margin-top: 30px; } .button__transparent { background-color: transparent; border: 1px solid var(--light-text-color); transition: color 0.15s ease, background 0.15s ease; } .button__transparent:hover { background-color: var(--light-text-color); color: var(--dark-text-color); } .button__transparent:hover path { stroke: var(--dark-text-color); } .button__transparent-dark { background-color: transparent; border: 1px solid var(--dark-text-color); transition: color 0.15s ease, background 0.15s ease; color: var(--dark-text-color); } .button__transparent-dark.active, .button__transparent-dark:hover { color: var(--light-text-color); } .button__transparent-dark.active { background-color: var(--blue-color-1); } .button__white { background-color: var(--light-text-color); color: var(--dark-text-color); } .button__white:hover { color: var(--light-text-color); } .button__white path { stroke: var(--dark-text-color); transition: stroke 0.3s ease; } .button__white:hover path { stroke: var(--light-text-color); } .button__grey { display: inline-block; padding-top: 20px; color: var(--notice-text-color); } .button__grey:hover { color: var(--dark-text-color); text-decoration: underline; } .button__wide { width: 100%; text-align: center; } .image__notice { display: block; margin: 20px auto; color: var(--green-color); text-align: center; font-size: 12px; } /* teasers */ .teasers { padding-top: 100px; padding-bottom: 80px; } .main-teasers-slider { padding: 20px; margin: -20px; box-sizing: border-box; margin-top: 10px; overflow: visible; } .main-teasers-slider__item { box-shadow: 0px 2px 30px 0px #2131491A; padding: 30px 30px 38px; height: 100%; box-sizing: border-box; } .main-teasers-slider__slide { height: auto; } .main-teasers-slider__item .h4 { margin-bottom: 20px; } .main-teasers-slider__item img { display: block; max-width: 100%; margin-bottom: 45px; max-height: 145px; } .header-block { display: flex; justify-content: space-between; } .slider-navigation-block, .summary-slider__navigation, .main-teasers__navigation { display: flex; gap: 10px; } .main-teasers__navigation-mobile { display: none; } .slider-button { position: relative; margin-top: 0; width: 58px; height: 58px; border: 1px solid var(--blue-color-1); transition: border 0.15s ease-in, background-color 0.15s ease-in; } .slider-button:hover { background-color: var(--hover-fill-color); border-color: var(--hover-fill-color); } .slider-button::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M29 15L1 15M1 15L15 0.999999M1 15L15 29' stroke='%23130F33' stroke-linecap='square'/%3E%3C/svg%3E%0A"); mask-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M29 15L1 15M1 15L15 0.999999M1 15L15 29' stroke='%23130F33' stroke-linecap='square'/%3E%3C/svg%3E%0A"); -webkit-mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; width: 100%; height: 100%; mask-repeat: no-repeat; background-color: var(--blue-color-1); content: " "; transition: mask-image 0.15s ease-in; display: block; } .slider-button__next::after { -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.999999 15L29 15M29 15L15 0.999999M29 15L15 29' stroke='%23130F33' stroke-linecap='square'/%3E%3C/svg%3E%0A"); mask-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.999999 15L29 15M29 15L15 0.999999M29 15L15 29' stroke='%23130F33' stroke-linecap='square'/%3E%3C/svg%3E%0A"); } .slider-button:hover::after { background-color: var(--light-text-color); } .main-teasers-slider__button-prev, .main-teasers-slider__button-next { position: static; } .slider-button__white { border-color: white; background-color: transparent; position: relative; } .slider-button__white::after { background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M29 15L1 15M1 15L15 0.999999M1 15L15 29' stroke='%23ffffff' stroke-linecap='square'/%3E%3C/svg%3E%0A"); background-position: center; background-repeat: no-repeat; mask: none; background-color: transparent; } .slider-button__white:hover::after { background-color: transparent; } .slider-button__white.slider-button__next::after { background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.999999 15L29 15M29 15L15 0.999999M29 15L15 29' stroke='%23ffffff' stroke-linecap='square'/%3E%3C/svg%3E%0A"); } .slider-button__white:hover { background-color: var(--blue-color-2); } /* principles */ .principles { /* display: none; */ padding: 95px 0 0; position: relative; } .revolut-like { --number-of-items: 6; position: relative; /* height: calc(100vh * var(--number-of-items)); */ height: 100vh; } .revolut-like__item { height: 100vh; top: 0; left: 0; right: 0; width: 100%; box-sizing: border-box; } .revolut-like__item picture { position: relative; } .revolut-like__item:nth-child(1) { position: relative; } .revolut-like__item-hidden { --mask-svg-size: 15%; --top-position: 95%; --mask-position: center var(--top-position); mask-image: url("data:image/svg+xml,%3Csvg width='282' height='362' viewBox='0 0 282 362' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='1' y='1' width='280' height='360' fill='white'/%3E%3Crect x='1' y='1' width='280' height='360' stroke='%23AAC8C8'/%3E%3C/svg%3E%0A"); mask-repeat: no-repeat; mask-position: var(--mask-position); mask-size: var(--mask-svg-size); opacity: 1; pointer-events: none; } .revolut-like__item-hidden::after { position: absolute; content: " "; display: block; width: 100%; height: 100%; left: 0; top: 0; background-image: url("data:image/svg+xml,%3Csvg width='282' height='362' viewBox='0 0 282 362' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='1' y='1' width='280' height='360' stroke='%23AAC8C8'/%3E%3Cpath d='M76 11H11V76M206 11H271V76M11 286V351H76M271 286V351H206' stroke='%23AAC8C8'/%3E%3Ccircle cx='38' cy='41' r='7' fill='%23AAC8C8'/%3E%3Cpath d='M56.162 46V36.102H59.97C60.502 36.102 60.9873 36.158 61.426 36.27C61.8647 36.3727 62.2473 36.5453 62.574 36.788C62.9007 37.0213 63.1527 37.3387 63.33 37.74C63.5073 38.1413 63.596 38.636 63.596 39.224C63.596 39.756 63.5027 40.2133 63.316 40.596C63.1293 40.9787 62.8727 41.296 62.546 41.548C62.2193 41.8 61.8507 41.9913 61.44 42.122L63.554 46H61.916L59.956 42.36H57.646V46H56.162ZM57.646 41.03H59.662C59.998 41.03 60.3107 41.0067 60.6 40.96C60.8987 40.904 61.16 40.8107 61.384 40.68C61.608 40.54 61.7807 40.3533 61.902 40.12C62.0327 39.8773 62.098 39.5693 62.098 39.196C62.1073 38.7667 62.0233 38.426 61.846 38.174C61.678 37.9127 61.426 37.7307 61.09 37.628C60.754 37.516 60.348 37.46 59.872 37.46H57.646V41.03ZM69.1396 46.112C68.4956 46.112 67.8889 46.0187 67.3196 45.832C66.7502 45.6453 66.2696 45.342 65.8776 44.922C65.4856 44.502 65.2242 43.9467 65.0936 43.256H66.6196C66.7409 43.648 66.9369 43.956 67.2076 44.18C67.4782 44.3947 67.7909 44.544 68.1456 44.628C68.5096 44.712 68.8736 44.754 69.2376 44.754C69.5829 44.754 69.9049 44.7073 70.2036 44.614C70.5116 44.5207 70.7636 44.3667 70.9596 44.152C71.1556 43.9373 71.2536 43.6573 71.2536 43.312C71.2536 43.0507 71.2022 42.836 71.0996 42.668C70.9969 42.5 70.8522 42.3647 70.6656 42.262C70.4882 42.15 70.2736 42.0613 70.0216 41.996C69.7322 41.9027 69.4196 41.8233 69.0836 41.758C68.7569 41.6927 68.4302 41.618 68.1036 41.534C67.7862 41.45 67.4876 41.3427 67.2076 41.212C66.9742 41.1187 66.7456 41.0067 66.5216 40.876C66.3069 40.736 66.1202 40.5727 65.9616 40.386C65.8029 40.19 65.6722 39.9613 65.5696 39.7C65.4762 39.4387 65.4296 39.14 65.4296 38.804C65.4296 38.356 65.4996 37.9733 65.6396 37.656C65.7889 37.3387 65.9802 37.0727 66.2136 36.858C66.4562 36.6433 66.7316 36.4753 67.0396 36.354C67.3569 36.2233 67.6882 36.13 68.0336 36.074C68.3789 36.018 68.7149 35.99 69.0416 35.99C69.6389 35.99 70.1896 36.0833 70.6936 36.27C71.1976 36.4567 71.6129 36.7553 71.9396 37.166C72.2756 37.5673 72.4576 38.0993 72.4856 38.762H71.0436C71.0062 38.4073 70.8849 38.1273 70.6796 37.922C70.4836 37.7073 70.2362 37.558 69.9376 37.474C69.6389 37.3807 69.3216 37.334 68.9856 37.334C68.7429 37.334 68.5002 37.3573 68.2576 37.404C68.0149 37.4413 67.7909 37.516 67.5856 37.628C67.3896 37.7307 67.2309 37.8707 67.1096 38.048C66.9976 38.2253 66.9416 38.4447 66.9416 38.706C66.9416 38.93 66.9882 39.1307 67.0816 39.308C67.1749 39.476 67.3056 39.6207 67.4736 39.742C67.6509 39.854 67.8469 39.952 68.0616 40.036C68.4536 40.1853 68.8829 40.302 69.3496 40.386C69.8162 40.4607 70.2549 40.568 70.6656 40.708C70.9642 40.8013 71.2442 40.918 71.5056 41.058C71.7669 41.1887 71.9909 41.352 72.1776 41.548C72.3642 41.7347 72.5089 41.9587 72.6116 42.22C72.7142 42.472 72.7656 42.766 72.7656 43.102C72.7656 43.6527 72.6676 44.124 72.4716 44.516C72.2756 44.8987 72.0096 45.2067 71.6736 45.44C71.3376 45.6733 70.9502 45.846 70.5116 45.958C70.0729 46.0607 69.6156 46.112 69.1396 46.112ZM74.6874 46V36.102H78.2574C78.9947 36.102 79.6294 36.2187 80.1614 36.452C80.7027 36.6853 81.1181 37.0493 81.4074 37.544C81.6967 38.0293 81.8414 38.6593 81.8414 39.434C81.8414 40.1807 81.6734 40.806 81.3374 41.31C81.0107 41.814 80.5627 42.1967 79.9934 42.458C79.4241 42.71 78.7754 42.836 78.0474 42.836H76.1714V46H74.6874ZM76.1714 41.492H77.9914C78.7007 41.492 79.2701 41.3287 79.6994 41.002C80.1287 40.666 80.3434 40.1293 80.3434 39.392C80.3434 38.748 80.1661 38.2673 79.8114 37.95C79.4567 37.6233 78.9201 37.46 78.2014 37.46H76.1714V41.492ZM83.6151 46V36.102H85.0991V40.512H86.5271L89.5511 36.102H91.2451L87.8151 40.974L91.2591 46H89.5231L86.6391 41.87H85.0991V46H83.6151ZM94.8626 46V37.46H91.7266V36.102H99.4686V37.46H96.3466V46H94.8626Z' fill='%23AAC8C8'/%3E%3C/svg%3E%0A"); background-position: var(--mask-position); background-repeat: no-repeat; background-size: var(--mask-svg-size); z-index: 1; } .h2.revolut-like__header-hidden { /* position: absolute; */ font-size: 20px; /* top: calc(80%); */ /* left: calc(50% - 140px); */ z-index: 1; /* width: 280px; */ } /*TODO: Поправить стрелку*/ .revolut-like__arrow { display: none; width: 28px; height: 28px; background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 30 30' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15 1V29M15 29L29 15M15 29L1 15' stroke='white' stroke-linecap='square'/%3E%3C/svg%3E%0A"); background-position: center; background-repeat: no-repeat; content: " "; margin: 20px auto 0; position: absolute; left: calc(50% - 14px); } .flip-complete .revolut-like__arrow { display: none; } .revolut-like__background { position: absolute; width: 100%; height: 100%; z-index: 1; } .revolut-like__background::after { background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0%, rgba(0, 0, 0, 0) 100%); position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: ' '; } .revolut-like__background img { width: 100%; height: 100%; object-fit: cover; } .revolut-like__content { padding-top: calc(var(--header-height) + 50px); height: 100%; position: relative; z-index: 2; color: var(--light-text-color); padding-left: 20px; padding-right: 20px; border-left: 1px solid var(--border-color); border-right: 1px solid var(--border-color); display: flex; flex-direction: column; box-sizing: border-box; } .revolut-like__content p:not(.h2), .revolut-like__content button, .revolut-like__content a { margin-bottom: 20px; } .revolut-like__content button { margin-left: auto; margin-right: auto; } .revolut-like__item-hidden .revolut-like__content { box-sizing: border-box; /* position: absolute; */ margin: 0 auto; /* max-width: 282px; max-height: 362px; top: calc(var(--top-position) - 5%); padding: 0; */ } .revolut-like__header { position: relative; } .revolut-like__divider-top { margin-bottom: 30px; } .revolut-like__divider-bottom { margin-top: auto; margin-bottom: 5%; } /* qualification */ .qualification { padding-top: 80px; padding-bottom: 120px; } .tabs-main { margin-top: 30px; } .tabs__slider a { text-decoration: none; color: inherit; } .tabs__link { margin: 30px 0 30px; display: flex; gap: 40px; overflow-y: auto; } .tabs__link-multiline { gap: 5px 40px; flex-wrap: wrap; } .tabs__link-item { outline: none; background: none; border: none; cursor: pointer; color: #324473; transition: 0.15s color ease; font-size: 18px; } .tabs__link-item:hover { color: var(--hover-fill-color); } .tabs__link-item.is-active { color: inherit; } .tabs__slider-column-fix.swiper-grid-column > .swiper-wrapper { display: grid; grid-template-rows: min-content min-content; grid-auto-flow: column; } .icon-block { /* --icon-content-padding: 20px; --icon-background: #130F33; --icon-content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='70' viewBox='0 0 48 70' fill='none'%3E%3Cpath d='M17.066 46.6346L17.3374 46.2309L16.9414 45.9484C12.3705 42.6887 8.85396 39.5079 6.47688 35.8324C4.10713 32.1682 2.85172 27.9838 2.85172 22.6834C2.85172 16.0528 5.14176 10.5282 9.58091 6.65444C14.0281 2.77369 20.6897 0.5 29.5199 0.5H46.7491V69.5H35.5983V9.46662V8.96662H35.0983H29.6635C24.5967 8.96662 20.6622 10.2502 17.9868 12.543C15.3022 14.8437 13.9418 18.1126 13.9418 21.9544C13.9418 26.2755 14.8671 29.4784 16.7751 32.2474C18.6704 34.9978 21.5097 37.2806 25.2522 39.8106L25.253 39.8112L30.9754 43.6638L13.6668 69.5H1.6888L17.066 46.6346Z' stroke='white'/%3E%3C/svg%3E"); --icon-color: #ffffff; --icon-font-size: 48px; */ } .price-item, .review-item, .rating-item, .certificate-item { --icon-width: 120px; box-sizing: border-box; /*По другому никак */ height: auto !important; --icon-content: ""; } .icon-block__simple-icon { flex-shrink: 0; width: 120px; display: flex; justify-content: center; align-items: center; background-color: var(--blue-color-1, #130F33); padding: var(--icon-content-padding); margin: calc(var(--icon-content-padding) * -1) } .icon-block__simple-icon svg, .icon-block__simple-icon img { max-width: 100%; height: auto; } .rating-item .icon-block__simple-icon { background-color: #162668; } .rating-item::before, .certificate-item::before { padding-bottom: 0; } .tabs__content-header { margin-bottom: 10px; } /* .review-item */ .review-item { border: 1px solid var(--border-color); } .review-item__text { color: var(--notice-text-color); } .icon-block__link .review-item__text { color: inherit; } .review-item__head { display: flex; border-bottom: 1px solid var(--border-color); } .review-item__icon { display: flex; align-items: center; justify-content: center; padding: 5px; width: 26%; border-right: 1px solid var(--border-color); flex-shrink: 0; max-width: 120px; aspect-ratio: 1 / 1; } .review-item__icon img, .review-item__icon svg { width: 100%; height: auto; display: block; } .review-item__title { padding: 20px 30px; } .review-item__post { color: var(--notice-text-color); } .review-item__content { padding: 20px; } .review-item__content p { margin-bottom: 22px; } .review-item__more { margin-top: 22px; font-weight: 500; font-size: 18px; } .review-item__more svg { margin-left: 4px; } .review-item__modal .review-item__more { display: none; pointer-events: none; } .review-item__modal .truncate-text { overflow: visible; display: block; } .tabs__slider-navigation { display: flex; justify-content: space-between; } .tabs__slider-navigation .slider-button { margin-top: 32px; } .tabs-slider__button-prev, .tabs-slider__button-next { position: relative; left: auto; right: auto; margin: 0; } .icon-block__link:hover, .icon-block__link:hover { background-color: var(--icon-block-hover, #D6DAE4); transition: color 0.15s ease, background-color 0.15s ease; } /* footer */ .footer__top { padding-top: 20px; padding-bottom: 20px; display: flex; justify-content: space-between; } .footer__logo { padding-top: 15px; } .footer__main { padding: 40px var(--container-padding) 40px; display: grid; grid-template-columns: 2fr 2fr 3fr; gap: 30px; } .footer__nav a { color: var(--light-text-color); text-decoration: none; transition: color 0.15s ease; } .footer__nav a:hover { color: var(--light-text-hover-color); } .footer__nav-item { font-weight: 500; } .footer__contacts-list a { font-weight: 600; } .footer__nav li { margin-bottom: 14px; } .footer__nav-secondary li { margin-bottom: 18px; } .footer__nav-secondary { font-size: 14px; } .footer__nav-main { font-weight: 500; } .footer__contacts-name { color: #ADB2BD; } .footer__subscribe-header { font-weight: 500; } .footer__contacts-list { margin-bottom: 30px; } textarea, input:not([type=checkbox], [type=radio]) { resize: none; padding: 18px 20px; font-size: inherit; background: transparent; border: 1px solid var(--border-color); font-family: inherit; box-sizing: border-box; min-height: 60px; } textarea:focus, input:focus { outline: none; } .footer__subscribe-form { margin-top: 20px; display: flex; align-items: flex-start; gap: 10px; } .input__light { color: #ADB2BD; } .input__is-error input { border-color: #D92D20; } .form__error-field, .input__error-field { display: none; } .is-error .form__error-field, .input__is-error .input__error-field { color: var(--light-text-color); background-color: var(--error-text-color, #D92D20); width: fit-content; font-size: 12px; padding: 4px 10px; display: block; } .is-error .form__input::placeholder, .is-error .form__input { border-color: var(--error-text-color); color: var(--error-text-color); } .footer__bottom { padding: 25px var(--container-padding) 25px; display: flex; justify-content: space-between; } .footer__bottom-text { font-size: 14px; color: var(--light-text-color); } a.footer__bottom-text:hover { color: var(--light-text-hover-color); } .socials-block { display: flex; gap: 14px; } .socials__item { border: 1px solid var(--light-text-color); width: 30px; height: 30px; padding: 2px; box-sizing: border-box; display: flex; justify-content: center; align-items: center; transition: background-color 0.15s ease, color 0.15s ease; } .socials__item-dark { border: 1px solid var(--dark-text-color); } .socials__item:hover { background-color: var(--hover-fill-color); } .socials__item-dark:hover { background-color: var(--light-text-hover-color); } .socials__item img { max-width: 100%; } .modal-wrapper { position: fixed; display: flex; justify-content: center; align-items: center; overflow: auto; top: 0; left: 0; width: 100%; height: 0; z-index: var(--modal-z-index, 555); transition: height 0s ease-out 1s; } .modal-wrapper.active { height: 100%; transition: height 0s ease-in 0s; } .dropdown-background, .modal-background { position: fixed; z-index: var(--modal-z-index, 555); top: 0; right: 0; bottom: 0; left: 0; background-color:rgba(19, 15, 51, 0.5); } .header__burger .dropdown-background, .modal-wrapper .modal-background { visibility: hidden; opacity: 0; transition: all .6s ease-in-out; } .menu-opened .header__burger .dropdown-background, .modal-wrapper.active .modal-background { visibility: visible; opacity: 1; } .modal-panel { background-color: white; position: relative; z-index: 999; opacity: 0; transform: scale(.8); transition: all .3s ease-in-out; width: auto; } @media (max-width: 622px) { .modal-panel { width: 100%; } } .modal-panel.active { opacity: 1; transform: none; } .modal__close { position: absolute; background-color: transparent; border: none; left: 100%; bottom: 100%; background-image: url("data:image/svg+xml,%3Csvg width='25' height='25' viewBox='0 0 25 25' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M23 2L2 23M2 2L23 23' stroke='white' stroke-width='2' stroke-linecap='square'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: center; display: block; cursor: pointer; width: 40px; height: 40px; } .modal__close:hover { filter: brightness(70%); } .modal__default { width: 100%; padding: 20px; box-sizing: border-box; overflow-y: auto; max-width: 592px; max-height: 80vh; } .icon-modal { background-color: var(--blue-color-1); display: flex; align-items: center; justify-content: center; color: var(--light-text-color); font-size: 48px; } .modal__header { margin-bottom: 20px; } .modal__header-wrapper { margin-bottom: 20px; } .form__textarea, .form__input { padding: 18px 20px; color: var(--form-input-color, #324473); font-size: inherit; border: 1px solid var(--blue-color-1, #130F33); box-sizing: border-box; width: 100%; } .form__textarea::placeholder, .form__input::placeholder { color: var(--form-input-color, #324473); } .form-columns { display: flex; justify-content: space-between; width: 100%; box-sizing: border-box; } .form-columns .form__input-wraper { width: calc(50% - 10px); } .form__input-wraper { margin-bottom: 10px; } .form__textarea { resize: none; border-radius: 0; border: 1px solid var(--blue-color-1); width: 100%; height: 140px; } .form__footer { display: flex; align-items: flex-start; } .form__submit { padding: 15px 20px; flex-shrink: 0; } .form__footer-notice, .form__required-notice { font-size: 14px; line-height: 20px; } .form__footer-notice { margin-left: 20px; } .form__required-notice { margin-top: 20px; } .main-nav__bottom-callback, .main-nav__bottom-phone { display: none; } .socials-block { --socials-color: #213149; } .main-nav__socials .socials__item { border: 1px solid var(--socials-color); } .main-nav__socials .socials__item:hover { background-color: #162668; border-color: #162668; } .main-nav__socials .socials__item:hover path { fill: white; } .main-nav__socials path { fill: var(--socials-color); } .footer__socials path { fill: white; } .footer__socials .socials__item:hover { background-color: #ffffff; } .footer__socials .socials__item:hover path { fill: var(--socials-color); } @media (max-width: 1280px) { .header__partners { display: none; } } @media (max-width: 1080px) { .header { --header-logo-width: 275px; } .header__hide-tablet { display: none; } .header__burger { margin-left: auto; border-left: 1px solid var(--border-color); } .header__logo { order: 1; } .header__nav { order: 2; border-right: 0; } .header__geo { border-left: 1px solid var(--border-color); order: 3; min-width: 107px; margin-left: auto; } .header__burger { order: 4; margin-right: calc(var(--container-padding) * -1); margin-left: 0; border-right: none; border-left: none; min-width: 70px; } .main-nav__container { grid-template-columns: calc(var(--header-logo-width) + var(--container-padding)) calc(100% - var(--header-logo-width) - var(--header-burger-width)); } .hero__teaser-item { padding-right: 20px; margin-right: 20px; } .hero___main-h1 { width: 100%; } .funnel-block, .funnel-links { width: calc(50% - 15px); } .revolut-like__item-hidden { --mask-svg-size: 30%; } .main-nav__inner-block ul { columns: 1; } .main-nav__socials { order: 1; } .main-nav__bottom { flex-wrap: wrap; } .main-nav__bottom-text { order: 2; width: 100%; text-align: center; margin-top: 5px; display: none; } .main-nav__inner-block { overflow: auto; } .main-nav__inner-block ul { width: 100%; } .main-nav__inner-header { margin-bottom: 30px; } .hero__teasers { width: 100%; } } @media (max-width: 800px) { .header__nav { display: none; } } @media (max-width: 768px) { .funnel-links { width: 100%; } .funnel-block { display: none; } .funnel-links__item { display: flex; flex-wrap: wrap; --icon-font-size: 24px; --icon-content-padding: 14px; padding: 0; margin-bottom: 14px; } .funnel-links__item::before { width: 70px; margin: 0; border-bottom: 1px solid var(--border-color); } .funnel-links__item-header-block { padding: 11px 14px 11px; display: block; border-bottom: 1px solid var(--border-color); box-sizing: border-box; width: calc(100% - 70px); } .funnel-link__container { padding: 14px; } .case-item__picture { margin: 10px 0 0; } .case-item__picture-w-mobile .case-item__desktop-picture { display: none; } .case-item__picture-w-mobile .case-item__mobile-picture { display: block; } .case-item__link { display: none; } .case-item__wide .case-item__picture { align-self: center; } .tabs__content-item { grid-template-columns: 1fr; } .footer__main { grid-template-columns: 1fr 1fr; flex-wrap: wrap; } } @media (max-width: 768px) { /* cases */ .cases-block { padding-top: 40px; padding-bottom: 40px; } .cases-main { display: block; } .case-item { margin-bottom: 14px; } .case-item img { max-width: none; } .case-item__wide { display: grid; height: 480px; } .case-item .case-item__picture, .case-item .case-item__content { width: 100%; } .case-item__content { padding: 30px 14px 0; } .case-item .case-item__picture { padding-left: 14px; min-width: auto; right: auto; margin-top: 0; } .case-item__tags { margin-bottom: 0; } .cases__button { width: 100%; margin-left: auto; margin-right: auto; box-sizing: border-box; text-align: center; } } @media (max-width: 900px) { .h1 { font-size: 40px; line-height: 1.2; } .h2 { font-size: 30px; line-height: 1.25; } .h2-5 { font-size: 25px; line-height: 1.25; } .h3 { font-size: 22px; line-height: 1.25; } .h4 { font-size: 20px; line-height: 1.34; } } @media (max-width: 1080px), (max-width: 1440px) and (orientation: landscape) and (hover: none) and (pointer: coarse) { .h1, .h2, .h3, .h4 { letter-spacing: normal; } body, html { font-size: 14px; line-height: 1.42; } .header { --header-logo-width: 155px; } .header-m-normal, .header-m-big { margin-bottom: 30px; } .h1 { font-size: 30px; } .h2-5, .h2 { font-size: 24px; line-height: 32px; } .h3, .h4 { font-size: 20px; line-height: 28px; } .button { padding-top: 16px; padding-bottom: 16px; } .hero__main { padding-top: 153px; padding-bottom: 37px; } .header__nav { display: none; } .header__logo { border-right: none; } .hero__teasers { display: block; width: 100%; } .hero__teaser-item { padding: 14px 0 0; border: none; border-top: 1px solid var(--border-color); margin-top: 14px; } .hero__teaser-item:nth-child(1) { border-top: none; margin-top: 0; } .hero__teaser-item-mobile { display: none; } .hero___main-h1 { margin-bottom: 25px; } .hero__marquue { padding: 30px 0; } .hero__marquue img { max-height: 30px; width: auto; } .hero__partners { display: flex; align-items: center; margin-bottom: 22px; } .main-expertise { padding-top: 37px; padding-bottom: 40px; } .funnel { padding-top: 40px; padding-bottom: 40px; } .funnel-links__link-additional { display: block; } .funnel-links__link-more { display: none; } /*callback */ .callback { display: block; padding-top: 30px; padding-bottom: 30px; } .callback__text { margin-bottom: 20px; text-align: center; } .callback__text, .callback__button-block { width: 100%; } .button__callback { padding: 16px 20px; width: 100%; max-width: 375px; } /* Teasers */ .teasers { padding-top: 40px; padding-bottom: 60px; } .main-teasers__navigation { margin-top: 10px; } .main-teasers__navigation-desktop { display: none; } .main-teasers-slider { padding-top: 30px; margin-top: -30px; margin-top: 0; } .main-teasers__navigation-mobile { display: flex; margin-top: 30px; } .main-teasers-slider__button-prev-mobile, .main-teasers-slider__button-next-mobile { position: static; } .main-teasers-slider__item { padding: 30px 14px 35px; } .main-teasers-slider__item img { margin-bottom: 30px; } /* principles */ .principles { padding-top: 0; } /*revolut-like*/ .revolut-like { height: auto; } .revolut-like .swiper-wrapper { display: block; } .revolut-like__button { display: none; } .mobile-button__wide { width: 100%; max-width: 375px; text-align: center; margin-left: auto; margin-right: auto; } .revolut-like__item { position: relative; opacity: 1; mask: none; min-height: 444px; height: auto; } .revolut-like__header { margin-bottom: 20px; } .revolut-like__content p:not(.h2), .revolut-like__content button, .revolut-like__content a { display: block; } .revolut-like__item .divider { display: none; } .revolut-like__item::after { content: none; } .revolut-like__content { padding: 30px var(--container-padding); text-align: left; } /* qualification */ .qualification { padding-top: 60px; padding-bottom: 60px; } .tabs__slider-navigation { justify-content: flex-start; } .tabs__slider-navigation .slider-button { margin-top: 20px; margin-bottom: 0; } .tabs-slider__button-prev { margin-right: 10px; } .tabs-main { margin-top: 0; } .tabs__link { margin: 20px 0 30px; gap: 20px; } .tabs__link-item { font-size: 14px; } .icon-block__simple-content { padding: 10px 14px; } .icon-block__simple-icon { width: 70px; } .icon-block__simple-icon svg, .icon-block__simple-icon img { width: 70%; } .icon-block__simple-icon-small img { width: 40%; } .tabs__content-header { font-size: 18px; margin-bottom: 5px; } .review-item__title { padding: 10px 14px; } .review-item__icon { width: 20%; } .footer__top { flex-direction: column; align-items: center; } .footer__logo { margin-bottom: 20px; padding-top: 0; } .footer__main { display: block; padding-top: 30px; padding-bottom: 30px; } .footer__contacts, .footer__nav-main { font-size: 16px; } .footer__nav { text-align: center; margin-bottom: 30px; } .footer__nav:last-child { margin: 0; } .footer__nav li { margin-bottom: 14px; } .footer__subscribe-form { margin-top: 14px; display: block; } .footer__subscribe-form .input__wrapper { margin-bottom: 10px; } .footer__subscribe-form .button, .footer__subscribe-form .input__light { width: 100%; } .footer__subscribe-form .input__light { text-align: center; } .footer__bottom { display: block; text-align: center; } .footer__bottom-text { margin-bottom: 14px; display: block; } .footer__socials { width: min-content; margin: 0 auto; } /* mobile menu */ .main-nav { font-size: 16px; width: 100%; height: calc(100vh - var(--header-height)); overflow: auto; } .main-nav__container { display: block; padding: 0; overflow: hidden; } .main-nav__menu { padding: 0; } .main-nav__menu>li { display: flex; align-items: center; } .main-nav__menu ul { position: relative; } .main-nav__menu li { margin-bottom: 0; border-bottom: 1px solid var(--divider-color); } .main-nav__menu-button, .main-nav__menu a { text-align: left; box-sizing: border-box; display: block; padding: 14px; width: 100%; background-color: #162668; } .main-nav__inner-header { font-size: 16px; font-weight: 400; padding: 14px; margin: 0; background-color: #162668; color: var(--light-text-color); } .main-nav__inner-block { position: absolute; left: 100%; top: 0; padding: 0; z-index: 2; transition: all 0.3s ease; transform: translate(0%, 0); height: 100%; width: 100%; } .main-nav__inner-block ul { padding: 0; columns: unset; width: 100%; } .main-nav__inner-block li { margin: 0; padding: 0; color: #213149; } .main-nav__inner-block a { display: flex; width: 100%; padding: 14px; border-bottom: 1px solid var(--divider-color); background-color: white; } .menu-arrow { display: block; width: 14px; height: 14px; padding: 14px; } .main-nav__bottom { width: 100%; max-width: none; flex-direction: column; background-color: var(--blue-color-1); } .main-nav__bottom-text { display: none; } .main-nav__inner-block-back { background-color: var(--blue-color-1); width: 100%; display: block; padding: 14px; border: none; color: var(--light-text-color); text-align: left; display: flex; align-items: center; } .main-nav__inner-block-back svg { margin-right: 5px; } .main-nav__inner-block.is-active { transition: all 0.3s ease; transform: translate(-100%, 0); } .main-nav__bottom { color: var(--light-text-color); } .main-nav__bottom-callback, .main-nav__bottom-phone { display: block; } .main-nav__bottom-callback { margin-bottom: 20px; text-underline-offset: 2px; text-decoration: underline dashed; } .main-nav__menu-mobile a { color: var(--light-text-color); display: block; background-color: var(--blue-color-1); } .main-nav__socials { --socials-color: var(--light-text-color); } .modal-wrapper { padding-left: var(--container-padding); padding-right: var(--container-padding); width: 100%; box-sizing: border-box; } .modal__default { background-color: white; overflow: auto; width: calc(100% - 32px); margin: 0 auto; } .modal__close { left: auto; right: 8px; bottom: 100%; } .modal__form { background-color: transparent; padding-left: 0; padding-right: 0; } .modal__form .form__input { border-color: var(--accent-text-color); color: var(--accent-text-color); } .modal__form .form__input::placeholder { color: var(--accent-text-color); } .modal__form .form__submit { background-color: var(--light-text-color); color: var(--blue-color-1); width: 100%; margin-bottom: 20px; } .modal__form .form__submit svg { display: none; } .form__footer-notice { margin-left: 0; margin-top: 16px; } .form__footer { width: 100%; display: block; } .form-columns { display: block; } .form-columns .form__input-wraper { width: 100%; } } .section { padding-top: 60px; padding-bottom: 60px; } .section-padding-big { padding-top: 70px; padding-bottom: 40px; } .section-padding__top-big { padding-top: 80px; } .section-padding__top { padding-top: 40px; } .section-padding__bottom { padding-bottom: 40px; } .section-padding__bottom-big { padding-bottom: 80px; } .section-border { border-bottom: 1px solid var(--divider-color); } @media (max-width: 650px) { .section { padding-top: 30px; padding-bottom: 30px; } .section-padding-big { padding-top: 40px; padding-bottom: 30px; } .section-padding__top-big { padding-top: 40px; } .section-padding__bottom-big { padding-bottom: 40px; } } .breadcrumbs { display: flex; color: var(--green-color); flex-wrap: wrap; } .breadcrumbs__light { color: var(--light-text-color); } .breadcrumb__item { position: relative; font-size: 14px; line-height: 1.44; } .breadcrumb__item a { color: inherit; text-decoration: none; } .breadcrumb__item-current { color: #A5BEBE; font-weight: 500; } .breadcrumb__item-current-dark { color: var(--blue-color-1); } .breadcrumb__item::after { content: "-"; display: inline-block; padding-left: 5px; padding-right: 5px; } .breadcrumb__item-current::after { content: none; } .hero__service { padding-top: 172px; padding-bottom: 87px; min-height: 400px; } .hero-wrapper__service-wide .hero__service { max-width: 840px; } .hero-wrapper__service-wide .breadcrumbs { max-width: 535px; } .hero-wrapper__service-marquee { margin-bottom: -170px; } .marquee__service-wrapper { position: relative; } .hero-wrapper__service-marquee .hero__service { padding-top: 132px; padding-bottom: 227px; } .hero__text { margin-bottom: 40px; } .hero__text p { margin-bottom: 16px; } .hero__text p:last-child { margin-bottom: 0; } .hero___service-h1 { margin-bottom: 20px; } .hero__service-single { max-width: 535px; } .hero__service-single .hero__text { max-width: 488px; } .hero__text-wide { max-width: 830px; } @media (max-width: 650px) { .breadcrumbs { flex-wrap: wrap; } .hero-wrapper__service-marquee { margin-bottom: -90px; } .hero-wrapper__service-marquee .hero__service { padding-top: 60px; padding-bottom: 140px; } } @media (max-width: 650px) { .hero__service-single .hero__text, .hero__text { max-width: none; } .hero__service { padding-top: 120px; padding-bottom: 30px; min-height: auto; } .hero__text p { margin-bottom: 14px; } .hero___service-h1 { margin-bottom: 10px; } .hero__button { max-width: none; padding-left: 16px; padding-right: 16px; } } .hero__service-slider { display: flex; justify-content: space-between; } .hero__content-slider, .hero__content-main { width: calc(50% - 16px); } @media (max-width: 1080px) { .hero__service-slider { display: block; } .hero__content-slider, .hero__content-main { width: 100%; } .hero__content-main { margin-bottom: 20px; } } .hero__text-teasers { max-width: 730px; } .hero__text-teasers p:not(:last-child) { margin-bottom: 30px; } .hero-teasers { margin: 30px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 20px 40px; color: #A5BEBE; } .hero__teasers-one-column .hero-teasers { grid-template-columns: 1fr; } .hero-teasers__item { display: flex; align-items: center; } .hero-teasers__item::before { flex-shrink: 0; margin-right: 20px; content: " "; width: 36px; height: 36px; background-repeat: no-repeat; background-position: center; background-size: contain; background-image: url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_98_1434)'%3E%3Cpath d='M18.0018 35.5136C27.6742 35.5136 35.5153 27.6725 35.5153 18.0001C35.5153 8.32764 27.6742 0.486572 18.0018 0.486572C8.32935 0.486572 0.488281 8.32764 0.488281 18.0001C0.488281 27.6725 8.32935 35.5136 18.0018 35.5136Z' stroke='%23789A9A' stroke-miterlimit='10'/%3E%3Cpath d='M18.0312 9.36011V26.3969' stroke='%23789A9A' stroke-miterlimit='10'/%3E%3Cpath d='M26.5524 17.8735H9.51562' stroke='%23789A9A' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_98_1434'%3E%3Crect width='36' height='36' fill='white'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A"); } @media (max-width: 650px) { .hero-teasers { gap: 10px; grid-template-columns: 1fr; margin: 20px 0; } } .top-section { padding-top: 60px; } @media (max-width: 650px) { .top-section { padding-top: 30px; } } .map-wrapper { padding-top: 30px; padding-bottom: 41px; } .contacts-card__item { position: relative; z-index: 1; max-width: 428px; background-color: var(--light-text-color); } .map__callback { display: block; color: var(--light-text-color); border-color: var(--light-text-color); } .contacts-card__content { padding: 30px; } .contacts-card__text { margin-bottom: 20px; } .contacts-card__content:not(:last-child) { border-bottom: 1px solid var(--divider-color); } .map-wrapper { position: relative; } .map-container { position: absolute; width: 100%; height: 100%; top: 0; } .map-container iframe { width: 100%; height: 100%; } .map-wrapper { margin-top: 20px; } .map-item { z-index: 1; position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .map-item iframe { width: 100%; height: 100%; pointer-events: none; } .map-item:not(.map-active) { z-index: 0; } .map-clickable iframe{ pointer-events: all; } @media (max-width: 1000px) { .map-container { width: 1110px; } .map-wrapper { overflow: hidden; } } @media (max-width: 800px) { .map-container { width: 100%; } .map-wrapper { overflow: hidden; } } @media (max-width: 650px) { .map-wrapper { display: flex; flex-direction: column-reverse; } .map-wrapper .container { padding: 0; } .map-wrapper .container, .contacts-card__item { max-width: none; width: 100%; } .map-wrapper { padding: 0; margin-top: 30px; } .map-container { width: 200%; position: relative; top: auto; left: -100%; height: 450px; } .contacts-tabs { display: flex; flex-direction: column; } .contacts-tabs > *:not(:last-child) { margin-bottom: 10px; } } .truncate-text { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .case-wrap { overflow: hidden; } .tag-item { padding: 5px 9px; border: 1px solid var(--tags-border-color); text-decoration: none; color: var(--tag-item-color, var(--gray-text-color-1)); } .tag-item__white { color: var(--blue-color-1); background-color: var(--light-text-color); } .tag-item__green { color: var(--light-text-color); background-color: var(--success-color, #039855); border-color: var(--success-color, #039855); } .tag-item:hover { border-color: var(--tags-hover-color); background-color: var(--tags-hover-color); color: var(--tags-hover-text-color); } .tag-filter { margin: 10px 0 10px; display: flex; flex-wrap: wrap; gap: 10px; width: fit-content; position: relative; z-index: 1; } .tag-filter:first-child { margin-top: 30px; } .tag-filter:last-child { margin-bottom: 30px; } .tag-filter__item { transition: 0.3s ease all; position: relative; display: flex; align-items: center; gap: 10px; } .filter__checkbox input.form-check-input:checked + .tagitem, .tag-filter__item-active { background-color: var(--tags-active-color); border-color: var(--tags-active-color); } .tag-filter__item.disabled { opacity: 0.4; } .filter__checkbox input.form-check-input:checked + .tagitem::before, .tag-filter__item-active::before { content: ""; background-image: url("data:image/svg+xml,%3Csvg width='14' height='14' viewBox='0 0 14 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.3813 0.809082L0.999909 13.1905' stroke='%23213149' stroke-miterlimit='10'/%3E%3Cpath d='M13.3878 13.1905L1.00635 0.809082' stroke='%23213149' stroke-miterlimit='10'/%3E%3C/svg%3E%0A"); background-position: center; background-size: cover; width: 13px; height: 13px; } .tag-filter__item-all { background-color: var(--tags-border-color); color: var(--light-text-color, #ffffff); } /*event-page detail*/ .hero__background { background: var(--hero-background); } .tag-filter__white { --tags-border-color: var(--light-text-color); --tag-item-color: var(--light-text-color); --tags-hover-color: var(--light-text-color); --tags-hover-text-color: var(--blue-color-1); margin: 20px 0; } .tag-filter__big-padding .tag-item { padding-top: 10px; padding-bottom: 10px; } .event__hero-text { margin-bottom: 40px; } .event__hero-text p:not(:last-child) { margin-bottom: 20px; } .event__hero-buttons { display: flex; gap: 20px; } .hero__event { padding-top: calc(var(--header-height) + 100px); padding-bottom: 103px; width: 53%; min-width: 500px; } .hero__content-image { position: absolute; left: calc(50% + 150px); bottom: -1px; width: 100%; /* max-width: 1200px; */ } .hero__content-image img { display: block; width: 100%; } @media (max-width: 650px) { .hero__case .tag-filter { margin: 10px 0; } .hero__case .breadcrumbs__light { display: none; } .hero__case .case__hero-text { font-size: 14px; } .case__hero-text p:not(:last-child) { margin-bottom: 10px; } .hero__case { padding-bottom: 128px; } .hero__content-image { position: static; width: calc(100% + 2 * var(--container-padding)); } .hero__event { padding-top: calc(var(--header-height) + 40px); padding-bottom: 20px; } .event__hero-text { margin-bottom: 0; } } /* policy */ .policy__bordered-row { border-top: 1px solid var(--divider-color); border-bottom: 1px solid var(--divider-color); padding-top: 10px; padding-bottom: 10px; display: flex; justify-content: space-between; margin-top: 30px; } .policy__text-block { margin-top: 30px; margin-bottom: 120px; } .policy__text-block p { margin-bottom: 16px; } .policy__text-block .h3 { margin: 30px 0; } .policy__text-block .h4 { margin-bottom: 16px; } .policy__bordered-row p { margin: 0; } @media (max-width: 650px) { .top-section__policy { padding-top: 30px; } .policy__text-block .h3 { margin-bottom: 10px; } .policy__text-block .h4 { font-size: 16px; } } .hero__form { display: flex; gap: 30px; } .form__hero { background-color: #ffffff; color: var(--blue-color-1); } @media (max-width: 800px) { .hero__form .form__footer-notice { margin: 10px 0 0; } .hero__form .form__submit { width: 100%; } } @media (min-width: 651px) and (max-width: 800px) { .hero__form .h1 { font-size: 48px; } .hero__form .form__footer { flex-direction: column-reverse; } } @media (max-width: 650px) { .hero__form { flex-direction: column; } .hero__form-block { padding-bottom: 0; } .hero__form-block { padding-top: 0; } .hero__form .hero__text { margin-bottom: 0; } .form__hero { margin: 0; width: 100%; max-height: none; } .hero__form .form__submit { width: 100%; } .hero__form-block { padding-bottom: 60px; } } .modal__subscribe { display: flex; padding: 0; max-width: 792px; } .modal__subscribe-image { width: 262px; flex-shrink: 0; } .modal__subscribe-image img { width: 100%; height: 100%; object-fit: cover; display: block; } .modal__subscribe-text { padding: 30px 30px 40px; } .modal__subscribe-header { margin-bottom: 10px; } .modal__subscribe-form { display: flex; gap: 10px; margin-top: 20px; align-items: flex-start; } .input__is-error { position: relative; } .input__error-field-absolute { position: absolute; top: 100%; } @media(max-width: 800px) { .modal__subscribe { flex-direction: column-reverse; max-width: 375px; margin: 0; padding: 16px; width: 100%; } .modal__subscribe-image { width: 100%; } .modal__subscribe-text { padding: 0; margin-bottom: 30px; } .modal__subscribe-form { display: block; } .modal__subscribe-form button, .modal__subscribe-form input { width: 100%; box-sizing: border-box; text-align: center; } .modal__subscribe-form .input__wrapper { margin-bottom: 10px; } } .spl-pane iframe { width: 80%; height: 80%; } :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ol { counter-reset: numbered-list; } :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ol, :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ul { margin-bottom: 20px; } :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ul, .blog-detail__toc-list { list-style: none; } :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ol li, :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ul li, .blog-detail__toc-list li { --blog-list-padding: 21px; margin-bottom: 10px; position: relative; padding-left: 26px; } :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ul li:last-child, .blog-detail__toc-list li:last-child { margin-bottom: 0; } :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ol li::before, :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ul li::before, .blog-detail__toc-list li::before { position: absolute; display: block; content: "\2022"; top: 0; left: calc(var(--blog-list-padding) / 2); } :where(.sales-funnel__content, .blog-detail__content, .list-wrapper) ol li::before { counter-increment: numbered-list; content: counter(numbered-list) "."; left: calc(var(--blog-list-padding) / 3); } .table-wrapper { overflow-x: auto; } .table-wrapper { margin-bottom: 20px; } .table-wrapper td { padding: 10px; border: 1px solid #D5D1D1; } .table-wrapper tr:first-child td { font-weight: 600; font-size: 18px; background-color: var(--blue-color-1); color: var(--light-text-color); } .table-wrapper td:first-child { color: var(--light-text-color); background-color: #98AFAC; } .form__footer-legal { display: flex; align-items: flex-start; gap: 6px; font-size: 13px; color: var(--blue-color-1); } .form__footer-legal a { text-decoration: underline; } .cookies-notice__modal { position: fixed; right: 0; bottom: 0; background-color: #ffffff; padding: 32px 40px; color: var(--blue-color-1); font-size: 14px; max-width: 478px; z-index: var(--cookies-modal-z-index, 10); } .cookies-notice__text { margin-bottom: 24px; } .button__cookies { min-height: 44px; padding: 8px 32px; } .default-list { list-style: initial; margin-left: 18px; } .default-list__numbered { list-style: decimal; } .default-list li { margin-bottom: 10px; } .default-list__small-margin li { margin-bottom: 3px; } .default-list__numbered-inside { list-style-position: inside; } /*Убрать когда англ версию добавим */ @media (max-width: 650px) { .header__burger { margin-left: auto; border-left: 1px solid var(--border-color); } } .play-button { position: relative; height: 100%; } .play-button::after { position: absolute; width: clamp(20px, 20%, 60px); aspect-ratio: 1 / 1; background-size: contain; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 227 227'%3E%3Ccircle cx='113.5' cy='113.5' r='113.5' fill='%23a5bebe' fill-opacity='.3'/%3E%3Ccircle cx='113.5' cy='113.5' r='113' stroke='%23fff' stroke-opacity='.3'/%3E%3Cpath fill='%23a5bebe' stroke='%23a5bebe' d='M79 174.622V53.378L184.001 114z'/%3E%3C/svg%3E"); content: ""; top: 50%; left: 50%; cursor: pointer; transform: translate(-50%, -50%); transition: transform 0.3s ease; } .play-button__non-interactable::after { pointer-events: none; } .play-button:hover::after { transform: translate(-50%, -50%) scale(1.1); } .play-button.playing::after { display: none; } #spotlight { background-color: rgba(19, 15, 51, 0.5); } .spl-header div { opacity: 1; } .spl-header { transform: none; } @media (min-width: 1081px) { .hero__tall .hero__service { min-height: 500px; } } .spotlight { cursor: pointer; } .hero__no-bg-img .hero__video-wrapper { display: none; } .hero__no-bg-img .hero__content { color: var(--blue-color-1); } .hero__check-sheet { display: flex; flex-direction: column; margin: 30px 0 60px; gap: 10px; } .hero__check-sheet-point { display: flex; gap: 20px; } .hero__check-sheet-point input { width: 25px; height: 25px; margin: 20px 1px; accent-color: var(--blue-color-1); cursor: pointer; flex-shrink: 0; } .hero__check-sheet-point label { margin: auto 0; cursor: pointer; } .hero__no-bg-img .image-text__bottom-text-wrapper { display: none; } .hero__check-result { margin: 30px 0 53px; display: flex; flex-direction: column; gap: 20px; } .hero__check-result-point { display: flex; border: 1px solid var(--border-color); } .hero__check-result-num { width: 78px; flex-shrink: 0; margin: auto 0; text-align: center; } .hero__check-result-point p { border-left: 1px solid var(--border-color); padding: 18px 40px 18px 20px; } .hero__no-bg-img .hero__vacancy-props { margin-right: 105px; } @media (max-width: 1080px) { .hero__no-bg-img .hero__vacancy-props br { display: none; } } @media (max-width: 650px) { .hero__no-bg-img .hero__vacancy-props { margin-right: unset; } } .check-sheet__slider .image-text__slider-button-next span { padding: 16px 0 16px 15px; color: var(--blue-color-1); } .check-sheet__slider .image-text__slider-button-next:hover span { color: var(--light-text-color); } .arrow__down { transform: rotate(180deg); } .arrow__none { display: none; } .check-more-results { scroll-margin-top: var(--header-height); } .overflown-slider__container { overflow: hidden; } .menu-tags { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 40px; } .menu-tags__item { background-color: #F2F2F2; padding: 22px 0 22px 20px; display: flex; align-items: center; font-size: 24px; line-height: 32px; gap: 5px; max-width: 280px; transition: 0.3s ease all; } .main-nav__inner-block .menu-tags__item:hover { color: var(--light-text-color); background-color: var(--blue-color-2); } .menu-tags__item img { width: 80px; } @media (max-width: 650px) { .menu-tags { margin-top: 20px; } .main-nav__inner-block .menu-tags { padding-left: 14px; } .menu-tags li { border: none; } .main-nav__inner-block .menu-tags__item { background-color: #F2F2F2; border: none; } } @media (min-width: 651px) { .header-w-slider-buttons { width: calc(100% - 150px); } } .case-item__summary { display: block; background-color: #D6DAE4; } .case-item__summary .case-item__h4::after { content: none; } .case-item__summary .case-item__content { width: 100%; height: 100%; display: flex; flex-direction: column; overflow: hidden; } .case-item__summary .swiper-slide { height: auto; } .summary__slider, .summary-slider__wrapper { width: 100%; height: 100%; } .summary-slider__wrapper { height: calc(100% - 90px); } .summary-slider__sidebar { max-height: 90px; padding: 0 30px 30px; position: absolute; bottom: 0; width: 100%; display: flex; gap: 20px; box-sizing: border-box; align-items: center; justify-content: space-between; } .summary-slider__navigation { display: flex; gap: 10px; } .summary-slider__logo { max-height: 60px; height: 100%; width: auto; align-self: center; display: flex; } .summary-slider__logo img { max-width: 230px; } @media (min-width: 651px) { .case-item__wide .summary__slider, .case-item__wide .summary-slider__wrapper { width: 100%; height: 100%; } .case-item__wide .summary-slider__sidebar { padding: 30px; } .case-item__wide.case-item__summary { height: 320px; min-height: auto; } .case-item__wide .summary-slider__wrapper { display: flex; } .case-item__wide .summary-slider__sidebar { max-height: none; position: static; display: flex; flex-direction: column; width: auto; } .case-item__wide .summary-slider__logo { margin-top: auto; width: 100%; height: auto; max-width: 130px; max-height: none; } } .summary__measure-node { position: absolute; visibility: hidden; top: 0; left: 0; z-index: -1000; pointer-events: none; height: auto; } @media (max-width: 650px) { .summary__header { margin-bottom: 10px; } .summary-slider__sidebar { padding: 30px 14px 30px; max-height: 120px; } .summary-slider__wrapper { height: calc(100% - 120px); } } .case-item__summary:nth-child(2n-1) { background-color: #F2F2F2; } .no-padding-top.section, .no-padding-top .section { padding-top: 0; } .no-padding-bottom.section, .no-padding-bottom .section { padding-bottom: 0; } .btn-to-top__container { mix-blend-mode: exclusion; position: fixed; bottom: 50px; right: 37px; z-index: 9; display: flex; flex-direction: column; gap: 10px; align-items: center; opacity: 0; visibility: hidden; transition: all 0.2s linear; } .btn-to-top__icon { width: 20px; height: 23px; transition: all 0.2s linear; } .btn-to-top__txt { color: #ADB2BD; font-size: 16px; line-height: 1.3; transition: all 0.2s linear; } .btn-to-top__container:hover { gap: 15px; } .btn-to-top__container:hover .btn-to-top__icon path { stroke: #162668; } .btn-to-top__container:hover .btn-to-top__txt { color: #162668; } .btn-to-top__show { opacity: 1; visibility: visible; } .cases-custom__breadcrumb { margin: 0 auto 0 112px; position: absolute; top: 100px; left: 0; z-index: 9; width: 700px; max-width: calc(100vw - 30px); } .cases-custom__breadcrumb .breadcrumbs { flex-wrap: nowrap; } .cases-custom__breadcrumb .breadcrumb__item { flex-shrink: 0; color: #ADB2BD; } .cases-custom__breadcrumb .breadcrumb__item-current { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex-shrink: 1; min-width: 0; } @media screen and (max-width: 1024px) { .cases-custom__breadcrumb { margin: 0; padding: 0 30px; box-sizing: border-box; } } @media screen and (max-width: 768px) { .cases-custom__breadcrumb .breadcrumbs { flex-wrap: wrap; } } @media (max-width: 500px) { .cases-custom__breadcrumb { position: unset; padding: 15px; } .cases-custom__breadcrumb .breadcrumb__item { color: #130F33; } } .clips-slider-wrapper { position: relative; } .clips-slider { overflow: visible; } .clip-slide { aspect-ratio: 128 / 227; position: relative; cursor: pointer; background-color: var(--blue-color-1); overflow: hidden; } .video-block { position: relative; cursor: pointer; overflow: hidden; } .swiper:not(.swiper-initialized) .clip-slide { width: 25%; } @media (max-width: 1080px) { .swiper:not(.swiper-initialized) .clip-slide { width: 33%; } } @media (max-width: 650px) { .swiper:not(.swiper-initialized) .clip-slide { width: 80%; } } .video-block img, .clip-slide img { width: 100%; height: auto; } .video-block::after, .clip-slide::after { content: " "; position: absolute; left: 0; top: 0; background-color: #00000080; background-image: url("data:image/svg+xml,%3Csvg width='145' height='145' viewBox='0 0 145 145' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='72.5' cy='72.5' r='71' stroke='white' stroke-width='3'/%3E%3Cpath d='M50 107.642L50 38.3584L110.001 73L50 107.642Z' stroke='white' stroke-width='3'/%3E%3C/svg%3E%0A"); background-position: center; background-repeat: no-repeat; background-size: 145px 145px; transition: all .3s ease; pointer-events: none; width: 100%; height: 100%; } .video-block:hover::after, .clip-slide:hover::after { background-image: url("data:image/svg+xml,%3Csvg width='145' height='145' viewBox='0 0 145 145' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='72.5' cy='72.5' r='71' stroke='white' stroke-width='3'/%3E%3Cpath d='M50 107.642L50 38.3584L110.001 73L50 107.642Z' fill='white' stroke='white' stroke-width='3'/%3E%3C/svg%3E%0A"); } .video-block__active::after, .clip-slide__active::after { content: none; } .video-block video, .clip-slide iframe { width: 100%; height: 100%; } .slider-navigation-block__header-top { position: absolute; top: -121px; right: 0; } @media (max-width: 1080px) { .clip-slide::after { background-size: 100px 100px; } .slider-navigation-block__header-top { top: -110px; } } @media (max-width: 650px) { .clip-slide::after { background-size: 60px 60px; } .slider-navigation-block__header-top { top: -90px; } } .case-diplomas__wrapper { overflow: hidden; width: 100vw; height: 50vh; margin-bottom: -50vh; position: relative; z-index: 7; } .case-diplomas { padding: 5px 0; position: absolute; top: 0; right: 0; width: 375px; overflow: hidden; transform: translate(25%, 100%) rotate(45deg); } .case-diplomas-2 { background-color: #BCBABA; border: 1px solid #AEAEAE; } .case-diplomas-2 .case-diplomas__inner { border-width: 1px 0px 1px 0px; border-style: solid; border-color:#AEAEAE; } .case-diplomas-3 { background-color: #AC997E; border: 1px solid #A28F74; } .case-diplomas-3 .case-diplomas__inner { border-width: 1px 0px 1px 0px; border-style: solid; border-color:#A28F74; } .case-diplomas__inner { padding: 5px 15px; cursor: pointer; } .case-diplomas__text { font-weight: 600; font-size: 20px; line-height: 1.3; color: rgba(255, 255, 255, 0.85); } .case-diplomas__marquee-container { overflow: hidden; white-space: nowrap; width: 100%; } .case-diplomas__marquee-content { display: flex; gap: 30px; width: max-content; animation: case-diplomas-marquee calc(15s * var(--count-diplomas)) linear infinite; } .case-diplomas__marquee-content span { flex-shrink: 0; } @keyframes case-diplomas-marquee { 0% { transform: translate(0, 0); } 100% { transform: translate(calc(-50% - 15px), 0); } } .case-diplomas__button { width: 100%; } @media (max-width: 500px) { .case-diplomas { position: relative; width: 100%; transform: none; } .case-diplomas__text { font-size: 14px; } } .modal__diploma { width: 100%; padding: 0; } .case-diplomas__slider { overflow: hidden; } .case-diplomas__button-prev, .case-diplomas__button-next { border: 2px solid #FFFFFF; position: absolute; top: 50%; left: -78px; transform: translateY(-50%); } .case-diplomas__button-next { left: unset; right: -78px; } @media (max-width: 768px) { .case-diplomas__button-prev, .case-diplomas__button-next { top: 100%; left: 20px; transform: translateY(50%); } .case-diplomas__button-next { left: unset; right: 20px; } } .case-diplomas__button-prev::after, .case-diplomas__button-next::after { background-color: #FFFFFF; } .case-diplomas__image { display: block; margin: 0 auto; height: 323px; } .case-diplomas__item { display: flex; flex-direction: column; border-top: none; border-right: none; border-bottom: none; } .case-diplomas__item .review-item__head { flex-grow: 1; } .relevant-block { margin-top: 30px; } @media (min-width: 1081px) { .relevant-block .card-item__wide { height: 188px; } } .relevant-block .card-item__content { padding: 20px 30px; max-height: 188px; } .relevant-block .h4 { line-height: 32px; } .relevant-block .card-item__header { overflow: hidden; text-overflow: ellipsis; flex-grow: 0; flex-shrink: 1; } .relevant-block .card-item__wide .card-item__image-wrapper { width: 192px; } .relevant-block img { margin: 0; } @media screen and (max-width: 650px) { .relevant-block .card-item__wide .card-item__image-wrapper { width: 100%; } .relevant-block .card-item__content { padding: 30px 14px; } } @media (max-width: 650px) { .context-medical .text-tabs .image-text__button-block { margin-top: 40px; } .context-medical .image-text__slide video, .context-medical .image-text__slide img { width: 100%; height: 216px; } } .summary-list .case-item { height: 500px; } .summary-list .case-item__wide { height: 340px; } .summary-list .summary-slider__logo img { width: 130px; } .summary-list__link { color: rgba(19, 15, 51, 0.5); } .landing-modal-button { position: fixed; top: 110px; right: 35px; z-index: 2; } .landing-modal__eye { border: 0; width: 45px; background-color: transparent; cursor: pointer; } .landing-modal__svg-path { transition: fill 0.3s ease; } .landing-modal-button:hover .landing-modal__svg-path { fill: var(--blue-color-3, #324473); } .modal-horizontal { max-width: 870px; width: 100%; } .modal__default--no-padding { padding: 0; } .modal__default--no-margin { margin: 0; } .modal-horizontal__w-image { display: flex; } .modal-horizontal__image { width: 262px; flex-shrink: 0; } .modal-horizontal__image img { width: 100%; height: 100%; object-fit: cover; } .modal-horizontal__content { padding: 30px; } .modal-horizontal__buttons-block { display: flex; gap: 10px; } .modal-horizontal__header { margin-bottom: 10px; } .modal-horizontal__text-content { margin-bottom: 20px; } .button__small-padding { padding: 16px 10px; } .modal-horizontal__button { flex-grow: 1; text-align: center; } @media (max-width: 900px) { .modal-horizontal__buttons-block { flex-direction: column; } } @media (max-width: 650px) { .modal-horizontal__button { font-size: 16px; } } @media (max-width: 600px) { .modal-horizontal__w-image { flex-direction: column; } .modal-horizontal__image { width: 100%; height: 100px; } } /* End */ /* Start:/local/templates/.default/assets/css/blog-event-pages.css?178703583434983*/ .blog-detail__info-wrapper, .blog-detail__top, .blog-detail__content { --container-max-width: 864px; } .blog-list { padding-bottom: 120px; } .card-item { display: block; box-shadow: 0 2px 30px 0 #2131491A; height: 100%; } .cards-slider__item { height: auto; } .card-item__duration { margin-bottom: 20px; } .cards-slider__item-text { margin-bottom: 20px; } .card-item__wide { display: flex; } @media (min-width: 1081px) { .card-item__wide { height: 296px; } } .card-item__image-wrapper { display: block; } .card-item__image-wrapper img { width: 100%; height: 100%; object-fit: cover; display: block; aspect-ratio: 2 / 1; } .card-item__wide .card-item__image-wrapper { width: 384px; flex-shrink: 0; } .card-item__content { padding: 30px; display: flex; flex-direction: column; max-height: 383px; } .card-item__top-text { margin-bottom: 20px; } .card-item__tags { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 20px; } .card-item__tags:last-child { margin-bottom: 0; } .card-item__header { margin-bottom: 20px; } .card-item__text { margin-bottom: 20px } .card-item__text { overflow: hidden; text-overflow: ellipsis; flex-grow: 0; flex-shrink: 1; /* white-space: nowrap; */ } .card-item__link { display: flex; align-items: center; margin-top: auto; } .blog-slider { margin-top: 30px; } .blog-slider__navigation { display: flex; margin: 20px 0 0; gap: 20px; --swiper-navigation-sides-offset: 0; } .card-list, .blog-index__list { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 32px; align-items: flex-start; } .blog__show-more { margin-top: 30px; text-align: center; } @media (max-width: 1080px) { .card-list, .blog-index__list { grid-template-columns: 1fr 1fr; } .card-item__wide .card-item__image-wrapper { width: 200px; } } @media (max-width: 650px) { .blog-slider { display: none; } .blog-index__list { display: block; } .card-item { margin-bottom: 14px; } .card-item__content { padding: 30px 14px; } .card-item__header { margin-bottom: 10px; } .card-item__image-wrapper { width: 100%; height: 168px; } .card-list { display: block; } .cards-slider__navigation { margin-top: 20px; } } /*detail-page*/ .card-item__tags-detail { gap: 5px; margin-bottom: 30px; } .blog-detail__info { display: flex; justify-content: space-between; align-items: center; } .blog-detail__info { padding: 10px 0; border-top: 1px solid var(--divider-color); border-bottom: 1px solid var(--divider-color); } .blog-detail__date {} .blog-detail__author { display: flex; align-items: center; } .blog-detail__author-photo { width: 46px; height: 46px; border-radius: 50%; margin-right: 10px; object-fit: cover; } .blog-detail__author-name p:last-child { font-size: 14px; color: var(--notice-text-color); } .blog-detail__toc { margin-top: 30px; } .blog-detail__toc a { text-decoration: underline; text-decoration-style: solid; text-underline-offset: 25%; text-decoration-thickness: 0%; color: var(--gray-text-color-1); } .blog-detail__toc a:hover { color: var(--light-text-hover-color); } .blog-detail__toc-header { margin-bottom: 20px; } .menu_level_3, .menu_level_2, .menu_level_1 { padding-top: 10px; } .blog-detail__content { margin-top: 30px; margin-bottom: 80px; } .detail__slider img { width: 100%; } :where(.blog-detail__content) h2 { font-size: 30px; margin-bottom: 20px; font-weight: 600; line-height: 1.25; } :where(.blog-detail__content) h3 { font-size: 24px; margin-bottom: 20px; font-weight: 600; line-height: 1.33; } :where(.blog-detail__content) h4 { margin-bottom: 20px; font-size: 18px; font-weight: 600; line-height: 1.33; } :where(.blog-detail__content) h2+h3 { margin-top: 30px; } :where(.blog-detail__content) p { margin-bottom: 16px; } :where(.blog-detail__content) p+h2, :where(.blog-detail__content) p+h3, :where(.blog-detail__content) p+h4 { margin-top: 30px; } :where(.blog-detail__content) img { width: 100%; margin-top: 30px; margin-bottom: 30px; } :where(.blog-detail__content) img+.img-title { margin-top: -30px; } .detail__slider { position: relative; margin: 30px 0; } .detail__slider img { margin-top: 0; margin-bottom: 0; display: block; } .detail__slider-notice { position: absolute; top: calc(100% + 40px); color: var(--green-color); text-align: center; width: calc(100% - 58px * 2 - 10px); left: 58px; font-size: 12px; box-sizing: border-box; } .detail__slider-notice-right { right: 0; left: auto; padding-left: 20px; top: calc(100% + 20px); font-size: 16px; color: var(--blue-color-1); } .navigation-space-between, .detail-slider__navigation { display: flex; width: 100%; justify-content: space-between; --swiper-navigation-sides-offset: 0; margin-top: 20px; } .navigation-left { display: flex; justify-content: flex-start; gap: 10px; } .quote { position: relative; background-color: #D6DAE480; display: flex; padding: 20px 30px; } .quote::before { background-image: url("data:image/svg+xml,%3Csvg width='72' height='72' viewBox='0 0 72 72' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 40.0107H15.3848C16.1789 47.1494 14.3796 56.2695 0 56.2695V62.8149C29.9064 62.8149 30.8251 47.9771 30.8251 40.0107V9.18555H0V40.0107ZM41.1749 40.0107H56.5591C57.3532 47.1495 55.554 56.2695 41.1749 56.2695V62.8149C71.0807 62.8149 72 47.9771 72 40.0107V9.18555H41.1749V40.0107Z' fill='white'/%3E%3C/svg%3E%0A"); width: 72px; height: 72px; content: ''; display: block; top: 20px; left: 17px; position: absolute; } .quote-author { flex-shrink: 0; width: 155px; padding-right: 20px; align-self: center; flex-shrink: 0; } .quote-author img { border-radius: 50%; width: 100%; margin: 0 0 10px; height: 155px; object-fit: cover; } .quote-author { text-align: center; font-weight: 600; } .quote-author p { margin-bottom: 6px; } .quote-author p:last-child { font-size: 14px; font-weight: 400; margin-bottom: 0; } .quote blockquote { position: relative; z-index: 1; padding-top: 40px; margin-right: 30px; } .img-title { color: var(--green-color); font-size: 12px; } .notice-block { background-color: #D6DAE480; padding: 20px 30px; margin: 30px 0; } .notice-block p { margin-bottom: 10px; } .notice-block p:last-child { margin-bottom: 0; } .notice-header { font-size: larger; } /*read also*/ .recommend-block .wrapper { border-top: 1px solid var(--divider-color); padding-top: 40px; margin-bottom: 120px; } .recommend-block__header { margin-bottom: 60px; } .blog-detail__recommend .card-item { margin-bottom: 30px; } @media screen and (max-width: 650px) { .detail__slider { margin: 20px 0; } .detail__slider-notice { position: static; width: 100%; margin: 10px 0; font-size: 12px; text-align: left; } .navigation-space-between, .detail-slider__navigation { justify-content: flex-start; gap: 10px; } .blog-detail__info-wrapper { border-top: 1px solid var(--divider-color); border-bottom: 1px solid var(--divider-color); } .blog-detail__info { border: none; } .blog-detail__toc-header { margin-bottom: 10px; } :where(.blog-detail__content) h2 { font-size: 20px; margin-bottom: 10px; } :where(.blog-detail__content) h2 { font-size: 30px; margin-bottom: 20px; } :where(.blog-detail__content) h3 { font-size: 18px; margin-bottom: 10px; } :where(.blog-detail__content) h4 { margin-bottom: 10px; font-size: 14px; } :where(.blog-detail__content) h2+h3 { margin-top: 20px; } :where(.blog-detail__content) p { margin-bottom: 14px; } :where(.blog-detail__content) p+h2, :where(.blog-detail__content) p+h3, :where(.blog-detail__content) p+h4 { margin-top: 30px; } :where(.blog-detail__content) .notice { margin: 20px 0; padding: 20px 15px; } .quote { display: block; } .quote::before { left: calc(50% - 36px); } .quote blockquote { width: 100%; margin: 0 0 30px; } .quote-author { padding: 0; margin: 0 auto; } .recommend-block .wrapper { margin-bottom: 60px; } .recommend-block__header { margin-bottom: 30px; } .card-item__wide { display: block; } .card-item__wide .card-item__image-wrapper { width: 100%; } .blog-detail__return-button { width: 100%; text-align: center; margin-top: 30px; } } /*event-page*/ .datepicker { display: flex; align-items: center; justify-content: space-between; gap: 40px; max-width: 100%; margin: 20px auto; color: var(--green-color); } .datepicker__nav-button { width: 28px; height: 28px; cursor: pointer; border: none; background: transparent; } .datepicker__date-grid { display: flex; gap: 30px; overflow: auto; } .datepicker__month-group { display: flex; flex-direction: column; } .datepicker__month-title { color: #D92D20; text-align: left; text-transform: capitalize; font-size: 14px; } .datepicker__month-days { display: flex; gap: 30px; overflow-x: auto; white-space: nowrap; padding-bottom: 1rem; } .datepicker__date-cell { box-sizing: border-box; min-width: 44px; padding: 10px 0; cursor: pointer; transition: background 0.2s; user-select: none; text-align: center; } a.datepicker__date-cell { color: inherit; text-decoration: none; } .datepicker__day-of-month { font-size: 18px; display: block; } .datepicker__date-cell:hover { color: var(--blue-color-2); } .datepicker__date-cell.today { background-color: #D6DAE4; font-weight: bold; } .datepicker__date-cell.today.selected { color: var(--light-text-hover-color); } .datepicker__date-cell.selected { color: var(--light-text-hover-color); } .datepicker__date-cell:not(.active) { opacity: 0.3; pointer-events: none; } @media (max-width: 650px) { .datepicker { display: block; } .datepicker__nav-button { display: none; } } .event__index-content { padding-bottom: 120px; } .event__detail-text { padding-top: 40px; padding-bottom: 60px; columns: 2; } .event__detail-text-no-column { columns: 1; } .event__detail-text p { margin-bottom: 16px; } .event-speakers { overflow: hidden; } .speakers, .speakers-slider { padding-top: 60px; padding-bottom: 60px; overflow: visible; } .speakers-slider__wrapper { position: relative; } .speakers-slider__navigation { position: absolute; width: min-content; right: var(--container-padding); bottom: calc(100% + 40px); display: flex; gap: 10px; } .speaker-item { display: flex; box-shadow: 0 2px 30px 0 #2131491A; margin-bottom: 30px; } .speaker-item:last-child { margin-bottom: 0; } .speaker-item .img-wrapper { width: 31%; flex-shrink: 0; } .speaker-item__slide { display: block; margin: 0; height: unset; } .speaker-item img { width: 100%; display: block; } .speaker-info { padding: 30px; } .speaker-name { margin-bottom: 20px; } .speaker-post { margin-bottom: 20px; color: var(--notice-text-color); } .speaker-text p:not(:last-child) { margin-bottom: 16px; } .speaker-text { margin-bottom: 20px; } .speaker-post:last-child, .speaker-text:last-child { margin-bottom: 0; } .event-themes { margin-bottom: 60px; } .side-by-side { display: grid; grid-template-columns: 1fr 1fr; } .side-by-side__image video, .side-by-side__image img { width: 100%; height: 100%; object-fit: cover; } .side-by-side__content { box-sizing: border-box; padding-left: 50px; display: flex; flex-direction: column; justify-content: center; padding-top: 30px; padding-bottom: 30px; } .side-by-side__content p:not(:last-child, .h2, .h2-5, .h3, .h4) { margin-bottom: 16px; } .side-by-side-right .side-by-side__content { padding-right: 50px; padding-left: 0; } .event-theme__header { margin-bottom: 20px; } .button__theme { margin-top: 40px; } .row-item, .program-item { display: flex; align-items: flex-start; gap: 40px; justify-content: space-between; padding: 30px; border-bottom: 1px solid var(--divider-color); } .program-item { align-items: center; } .program-item:last-child { border-bottom: 0; } .event-time__item { display: flex; gap: 10px; margin-bottom: 4px; } .program-item__speaker-name { margin-top: 4px; } .detail-text__block .event__detail-text { padding-bottom: 40px; } /*event-price */ .event-price__header { width: 23%; } .event-price__list { width: 50%; } .list { list-style: none; --list-left-padding: 20px; --list-marker-size: 10px; --list-marker-color: var(--blue-color-1); } .list li { position: relative; padding-left: var(--list-left-padding); margin-bottom: 4px; } .list li::before { position: absolute; left: 0; top: 6px; border-radius: 50%; background-color: var(--list-marker-color); width: var(--list-marker-size); height: var(--list-marker-size); content: " "; display: block; } .event-price__price { width: 15%; } .event-price__price-text { margin-top: 4px; } .event-price__old-price-text { font-weight: 600; font-size: 20px; text-decoration: line-through; color: #A5A8BE80; } .other-events-slider__navigation { margin-top: 40px; } @media (max-width: 1080px) { .hero__content-image { left: calc(50% + 75px); } } .event__hero-text { margin-top: 20px; } .hero__event { padding-top: 100px; } @media (max-width: 650px) { .hero__content-image { position: static; width: calc(100% + 2 * var(--container-padding)); margin-left: calc(-1 * var(--container-padding)); } .hero__event { padding-top: 40px; padding-bottom: 50px; min-width: auto; width: 100%; } .tag-filter__white { flex-wrap: wrap; gap: 5px; margin: 14px 0; } .event__hero-text { margin: 20px 0; } .event__hero-buttons { flex-direction: column; gap: 10px; } /*top-section */ .top-section { padding-top: 10px; } .event__detail-text { padding: 20px 0; columns: 1; } .event__detail-text p { margin-bottom: 14px; } .speakers-slider { padding-top: 20px; padding-bottom: 10px; } .speakers-slider__navigation { position: static; margin-bottom: 20px; } .speaker-info { padding: 20px 15px; } .speaker-item { display: block; } .speaker-item .img-wrapper { width: 100%; } .speaker-name, .speaker-post { margin-bottom: 10px; } .speaker-text p:not(:last-child) { margin-bottom: 10px; } .callback__wide-text .callback__text, .callback__wide-text .callback__button-block { width: 100%; } .callback__wide-text .callback__button-block { text-align: left; } .speakers, .speakers-slider { padding-top: 40px; padding-bottom: 40px; } /*event-themes*/ .event-themes { margin-bottom: 20px; } .side-by-side { display: flex; flex-direction: column; } .side-by-side__image, .side-by-side__content { width: 100%; } .side-by-side-right .side-by-side__content, .side-by-side__content { padding: 20px 0; } .event-theme__header { font-size: 24px; margin-bottom: 10px; } .side-by-side-right { flex-direction: column-reverse; } .button__theme { margin-top: 20px; } /* program */ .program-item { padding: 20px 0; flex-direction: column; align-items: flex-start; gap: 14px; } .event-price__list, .program-item__events { background-color: #D6DAE480; padding: 10px 15px; width: 100%; box-sizing: border-box; } .event-time__item :first-child { width: 90px; flex-shrink: 0; } .event-program { padding-top: 20px; } .detail-text__block .event__detail-text { padding-bottom: 20px; } .navigation-space-between, .detail-slider__navigation { margin-top: 10px; } .notice-block { padding: 20px 15px; } /* event-price */ .event-price { padding-top: 20px; padding-bottom: 20px; } .event-price__list, .event-price__price, .event-price__header { width: 100%; } .event-price__price { text-align: center; } .event-price__old-price-text { font-size: 18px; } .other-events__slider .swiper-wrapper { display: block; } .other-events__slider { padding-top: 40px; padding-bottom: 40px; } .other-events-slider__navigation { display: none; } } /* case page */ .hero__background-image { background-image: var(--hero-background-image); background-position: center; background-size: cover; background-repeat: no-repeat; } .case-detail__h1 { margin-bottom: 20px; } .case__hero-text { font-size: 20px; } .other-cases__slide { display: flex; background: var(--case-item-background-color); color: var(--case-item-color, var(--light-text-color)); text-decoration: none; height: auto; flex-direction: column; overflow: hidden; position: relative; } .other-cases__content { padding: 30px; display: flex; flex-direction: column; width: 100%; box-sizing: border-box; } .other-cases__header::after { content: " "; display: block; position: absolute; left: 0; top: 0; right: 0; bottom: 0; width: 100%; height: 100%; } .other-cases__image { align-self: flex-end; width: 85%; margin-top: auto; } .other-cases__image img { display: block; width: 100%; height: auto; } .other-cases__teasers { margin-top: auto; display: flex; justify-content: space-between; } .other-cases__teaser-header { font-weight: 400; font-size: 36px; letter-spacing: -0.02em; margin-bottom: 0; } .other-cases__button { position: static; } .other-cases__navigation { margin-top: 30px; display: flex; width: 100%; justify-content: space-between; } .other-cases__image { width: 85%; margin-top: auto; } @media (max-width: 650px) { .other-cases__slide { flex-direction: column; } .other-cases__content { min-width: auto; width: 100%; padding: 20px 10px 0 14px; } .other-cases__header { margin-bottom: 20px; } .other-cases__image { margin-top: 8px; width: 95%; } .other-cases__image img { width: 100%; height: auto; } .other-cases__teasers { display: grid; justify-content: flex-start; grid-template-columns: min-content min-content; gap: 30px; } .other-cases__teaser-header { font-size: 24px; line-height: 32px; } .other-cases__navigation { display: none; } .other-cases__slider .swiper-wrapper { flex-direction: column; gap: 14px; } } .case-results { display: grid; grid-template-columns: 55fr 40fr; grid-template-rows: auto auto; gap: 30px; } .case-results__text-block { grid-column: 1 / 2; grid-row: 1 / 2; } .case-stats { grid-column: 1 / 2; grid-row: 2 / 3; margin-top: auto; } .case-results__about { grid-column: 2 / 3; grid-row: 1 / 3; box-shadow: 0 2px 30px 0 #2131491A; align-self: flex-start; } .case-results__about-bottom, .case-results__about-top { padding: 30px; } .case-results__about-top { border-bottom: 1px solid var(--divider-color); } .case-results__about-top:last-child { border-bottom: 0; } .case-results__subheader { font-size: 15px; margin-bottom: 15px; } .case-stats__top { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px; margin-bottom: 10px; } .case-stats__top:last-child { margin-bottom: 0; } .case-stats__top-2 { grid-template-columns: 1fr 2fr; } .case-stats__top-1 { grid-template-columns: 1fr; } .case-stats__top-item { padding: 20px; box-sizing: border-box; border: 1px solid var(--border-color); flex-shrink: 0; } .case-stats__header { font-size: 36px; line-height: 1.22; flex-shrink: 0; } .case-stats__bottom { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; } .case-stats__bottom-1 { grid-template-columns: 1fr; } .case-stats__bottom-item { padding: 20px; font-weight: 600; font-size: 20px; background-color: #D6DAE4; } .case-stats__bottom-star { background-color: var(--blue-color-2); color: var(--light-text-color); background-image: url("data:image/svg+xml,%3Csvg width='96' height='102' viewBox='0 0 96 102' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M81.7212 7.8305C87.9002 13.3294 92.726 20.1814 95.8224 27.8522C91.2459 50.7828 83.6226 72.9979 73.1558 93.9063C66.3211 97.9244 58.6735 100.36 50.7745 101.036C54.0651 95.1777 57.344 88.8088 60.4684 81.8932C68.0134 65.3074 73.8102 47.9805 77.7652 30.1931C79.5234 22.2913 80.8064 14.746 81.7212 7.8305ZM53.4593 53.732C50.9408 61.2179 48.1847 68.2404 45.3217 74.8113L45.1078 74.9183L20.1011 88.0839C19.7345 88.2727 19.3251 88.3628 18.9131 88.3453C18.4839 88.3054 18.0734 88.1494 17.726 87.894C17.3786 87.6386 17.1073 87.2935 16.9411 86.8957C16.7789 86.4967 16.7336 86.0599 16.8104 85.6361L21.5623 57.7602C21.6179 57.3863 21.5894 57.0047 21.479 56.6432C21.3614 56.2889 21.162 55.9673 20.8969 55.7045L0.701424 35.9798C0.392092 35.6778 0.174021 35.2949 0.071909 34.8747C-0.0354677 34.4482 -0.0223805 34.0001 0.109758 33.5806C0.241897 33.161 0.487761 32.7863 0.820192 32.4983C1.16134 32.2214 1.57256 32.0445 2.00816 31.9873L29.985 27.9117C30.3567 27.8676 30.7097 27.7239 31.0066 27.4958C31.3115 27.2759 31.5598 26.9868 31.7312 26.6522L44.2406 1.29521C44.4303 0.907629 44.7218 0.579027 45.084 0.344635C45.4446 0.131372 45.8533 0.0127841 46.272 0C46.6906 0.0138005 47.099 0.132316 47.46 0.344635C47.8222 0.579027 48.1139 0.907629 48.3035 1.29521L60.8247 26.6759C60.8692 26.7769 60.925 26.8726 60.991 26.9611C58.9853 36.0014 56.4909 44.9263 53.5187 53.6964' fill='%23324473'/%3E%3C/svg%3E%0A"); background-size: 96px 101px; background-position: right top; background-repeat: no-repeat; } .case-stats__bottom-header { font-size: initial; } @media (max-width: 950px) { .case-results { display: block; } .case-results__text-block, .case-stats, .case-results__about { margin-bottom: 20px; } } @media (max-width: 650px) { .case-stats__top, .case-stats__bottom { display: block; margin-bottom: 0; } .case-stats__bottom-item, .case-stats__top-item { margin-bottom: 10px; } .case-stats__top-item { display: flex; gap: 20px; align-items: center; padding: 10px 20px; } .case-stats__header { min-width: 80px; font-size: 24px; text-align: center; } .case-stats__bottom-header { font-size: 14px; } .case-stats__bottom-item { padding: 10px 20px; font-size: 18px; } .case-results__about-bottom, .case-results__about-top { padding: 20px 15px; } } .text-left__block, .text-right__block { display: flex; --gap: 50px; gap: var(--gap); } .text-left__block > div, .text-right__block > div { width: calc(50% - var(--gap) / 2); } @media (max-width: 650px) { .text-left__block, .text-right__block { display: block; padding-top: 15px; padding-bottom: 15px; } .text-left__block > div, .text-right__block > div { width: 100%; } } .pre, pre { background-color: #f4f4f4; padding: 15px; border-radius: 8px; overflow-x: auto; margin-bottom: 20px; } .pre .code, pre code { font-family: 'Consolas', 'Monaco', 'Andale Mono', 'Ubuntu Mono', monospace; font-size: 14px; color: #333; line-height: 1.5; display: block; } pre.highlight { border-left: 5px solid #007bff; /* Blue left border */ } .comment { color: #6a9955; } .keyword { color: #569cd6; font-weight: bold; } .content__iframe iframe { max-width: 100%; height: auto; aspect-ratio: 16 / 9; } .image-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 32px; } @media (max-width: 650px) { .image-grid { gap: 16px; } } .case-content__image { width: 100%; height: auto; display: block; margin: 40px 0; } .case-content__image:first-child { margin-top: 0; } .case-content__image:last-child { margin-bottom: 0; } .vertical-video__wrapper { display: flex; justify-content: center; margin: 0 auto; } .vertical-video__wrapper { max-width: 325px; } @media (max-width: 650px) { .vertical-video__wrapper { width: 80%; } } .image-text__vertical-middle .image-text__text-block { align-self: center; } .video-line { display: grid; gap: 10px; margin: 40px 0; grid-template-columns: repeat(5, 1fr); } .video-line:first-child { margin-top: 0; } .video-line:last-child { margin-bottom: 0; } .video-line img, .video-line video { width: 100%; } .hero__centered-image { position: relative; } .hero__centered-image .breadcrumb__item { color: var(--light-text-color); } .hero__centered-image .hero__content { position: static; } .hero__centered-image .hero__content-image { right: 0; height: 100%; width: auto; left: auto; bottom: 0; top: 0; } .hero__centered-image .hero__content-image img { height: 100%; width: auto; } .hero__centered-image .hero__event { position: relative; z-index: 1; } .hero__centered-image .event__hero-text:last-child { margin-bottom: 0; } @media (min-width: 651px) { .hero__centered-image .event__hero-text { font-size: 20px; } } @media (max-width: 1400px) and (min-width: 650px) { .hero__centered-image .hero__event { padding-top: calc(var(--header-height) + 50px); } } @media (max-width: 1200px) and (min-width: 650px) { .hero__centered-image .hero__service { min-height: 300px; } } @media (max-width: 1000px) { .hero__centered-image .hero__content-image { display: none; } .hero__centered-image .desktop { display: none; } } .hero__centered-image .mobile { display: none; } @media (max-width: 650px) { .hero__centered-image .hero__content-image { display: flex; flex-direction: column; justify-content: flex-end; position: absolute; width: 100%; left: var(--container-padding); bottom: 0; z-index: 0; } .hero__centered-image .mobile { display: block; } .hero__centered-image .hero__content-image img { width: 100%; height: auto; } .hero__centered-image .hero__service { position: relative; z-index: 1; } } .hero__blue-text .tag-filter { --tags-border-color: var(--dark-text-color); --tag-item-color: var(--dark-text-color); } .hero__blue-text .breadcrumb__item, .hero__blue-text .hero__content { color: var(--dark-text-color); } .theme-item { display: flex; padding: 30px; align-items: flex-start; gap: 40px; } .theme-item__header-wrapper { width: 25%; } .theme-item__text { width: 53%; } @media (max-width: 1080px) { .theme-item__header-wrapper { width: 30%; } .theme-item__text { width: 60%; } } @media (max-width: 650px) { .theme-item { padding: 0; display: block; margin-bottom: 40px; } .theme-item:last-child { margin-bottom: 0; } .theme-item__text, .theme-item__header-wrapper { width: 100%; box-sizing: border-box; } .theme-item__header-wrapper { margin-bottom: 14px; } .theme-item__text { padding: 10px 30px 10px 15px; background-color: #D6DAE480; } } .case-teasers { display: grid; grid-template-columns: repeat(var(--row-item-count), 1fr); gap: 40px; } .case-teaser__image { width: 137px; height: 137px; } .case-teaser__image img { width: 100%; height: 100%; object-fit: contain; } .case-teaser__image { margin-bottom: 40px; } .case-teaser__header { margin-bottom: 24px; font-weight: 700; } @media (max-width: 1440px) { .case-teasers__card { grid-template-columns: repeat(calc(var(--row-item-count) / 2), 1fr); } } @media (max-width: 650px) { .case-teasers { width: 800px; overflow-x: scroll; } .case-teasers__card { grid-template-columns: repeat(var(--row-item-count), 1fr); width: calc(300px * var(--row-item-count)); } .case-teasers__wrapper { overflow: scroll; padding-bottom: 10px; } } @media (min-width: 651px) { .image-text__30 .image-text__image-block { width: calc(66% - 25px); } .image-text__30 .image-text__text-block { width: calc(33% - 25px); } .image-text__70 .image-text__image-block { width: calc(33% - 25px); } .image-text__70 .image-text__text-block { width: calc(66% - 25px); } } .remove-section-paddings section { padding-top: 0; padding-bottom: 0; } .case-teasers__squared .case-teaser__item { border: #7D7882 1px solid; padding: 20px; box-sizing: border-box; } .case-teasers__squared .case-teaser__header { font-weight: 400; margin-bottom: 10px; font-size: 36px; } @media (max-width: 900px) { .case-teasers__squared .case-teaser__header { font-size: 26px; } } @media (max-width: 650px) { .case-teasers__squared .case-teaser__header { font-size: 22px; } } .case-teasers__card .case-teaser__item { border: 1px solid #7D7882 } .case-teasers__card .case-teaser__header { margin: 0; padding: 20px; box-sizing: border-box; background-color: #130F33; color: #FFFFFF; font-size: 30px; font-weight: 500; line-height: 1.25; text-align: center; } .case-teasers__card .case-teaser__item div { padding: 20px; box-sizing: border-box; } .case-list { grid-template-columns: repeat(2, 1fr); } @media (max-width: 768px) { .case-list { grid-template-columns: unset; width: auto; } } .case-list .case-teaser__item { border: 1px solid #7D7882; } .case-list .case-teaser__header { padding-right: 20px; display: flex; flex-direction: row; gap: 20px; align-items: center; margin-bottom: 0; font-size: 24px; font-weight: 600; line-height: 1.3; border-bottom: 1px solid #7D7882; } .case-list .case-teaser__item div { padding: 20px; } .case-teaser__header-index { display: inline-block; width: 102px; padding: 28px 20px; box-sizing: border-box; font-size: 48px; font-weight: 400; line-height: 1.3; color: #FFFFFF; text-align: center; } .case-teaser__header-index__0 { background-color: #130F33; } .case-teaser__header-index__1 { background-color: #324473; } .case-teaser__header-index__2 { background-color: #6D7E80; } .case-teaser__header-index__3 { background-color: #A5BEBE; } .iframe__squared { aspect-ratio: 1.2 / 1; } .iframe__squared iframe { width: 100%; height: 100%; } .image-text__image-block .card-list, .image-text__image-block .blog-index__list { grid-template-columns: 1fr; } .image-text__image-block .blog-list { padding-bottom: 0; } /* End */ /* Start:/include/cases/stomexpert-ddos/style.css?174498015459657*/ @font-face { font-family: 'RoadRadio'; src: url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Black.eot'); src: local('./fonts/RoadRadio-Black'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Black.eot?#iefix') format('embedded-opentype'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Black.woff') format('woff'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Black.ttf') format('truetype'); font-weight: 900; font-style: normal; } @font-face { font-family: 'RoadRadio'; src: url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Bold.eot'); src: local('./fonts/RoadRadio-Bold'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Bold.eot?#iefix') format('embedded-opentype'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Bold.woff') format('woff'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio-Bold.ttf') format('truetype'); font-weight: bold; font-style: normal; } @font-face { font-family: 'RoadRadio'; src: url('/include/cases/stomexpert-ddos/./fonts/RoadRadio.eot'); src: local('./fonts/RoadRadio'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio.eot?#iefix') format('embedded-opentype'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio.woff') format('woff'), url('/include/cases/stomexpert-ddos/./fonts/RoadRadio.ttf') format('truetype'); font-weight: normal; font-style: normal; } .nobr { white-space: nowrap; } .caseWrapper { font-family: 'RoadRadio'; font-size: 27px; line-height: 30px; color: #2F292A; background-color: #FBF8EE; overflow: hidden; } .ya-share2 { background-color: #FBF8EE; } .wrapper { max-width: 1220px; margin: 0 auto; padding-left: 15px; padding-right: 15px; box-sizing: border-box; } .relative { position: relative; } /*caseHeader*/ .caseHeader { background-color: #A63333; } .caseHeader .wrapper { padding-top: 206px; padding-bottom: 185px; } .caseHeaderText { color: #FDF6D8; font-size: 30px; line-height: 39px; max-width: 934px; } .caseWrapper h1 { font-family: 'RoadRadio'; font-style: normal; font-weight: 700; font-size: 50px; line-height: 50px; color: #FDF6D8; text-align: left; margin: 0 0 43px; max-width: 940px; width: auto; } .caseH2 { font-weight: 700; font-size: 55px; line-height: 50px; color: #A63333; } .caseH3 { font-weight: 700; font-size: 40px; line-height: 40px; color: #2F292A; } .screamingMonster { position: absolute; left: -250px; bottom: 23px; } .worm { position: absolute; top: 29px; left: -100px; } .target { position: absolute; left: calc(50% - 38px); top: 89px; width: 77px; height: 75px; } .ballMonster { position: absolute; width: 301px; height: 286px; top: 0; right: -230px; } .medusa { position: absolute; top: 0px; left: calc(50% + 200px); } .deadMonster { position: absolute; width: 239px; height: 253px; left: 80%; bottom: 106px; } .arrow { width: 207px; height: 163px; position: absolute; left: 87%; bottom: 340px; opacity: 0; animation: arrow 0.5s 1s ease-in forwards; } @keyframes arrow { 0% { opacity: 0; transform: rotate(10deg) translateX(440px) translateY(-400px); } 100% { opacity: 1; transform: rotate(-15deg) translateX(0) translateY(0); } } .pow { position: absolute; width: 216px; height: 194px; left: 87%; bottom: 50px; transform-origin: center; transform: scale(0.0); animation: powAnimation 0.7s ease 1.5s forwards; } @keyframes powAnimation { 0% { transform: scale(0.0); } 50% { transform: scale(1.7); } 100% { transform: scale(1); } } .fly { position: absolute; width: 54px; height: 64px; right: -162px; bottom: 300px; } .screamingVisualisation { animation: screamMove 10s ease-in-out infinite; } .screamingEyes { animation: omniousEyes 3s ease-in-out infinite; } @keyframes screamMove { 0% { transform: translate(0, 0); } 50% { transform: translate(20px, 20px); } 100% { transform: translate(0, 0); } } @keyframes omniousEyes { 0% { filter: saturate(1) blur(0px) drop-shadow(1px 1px 0px transparent); } 50% { filter: saturate(1.7) blur(3px) drop-shadow(1px 1px 0px #E40000); } 100% { filter: saturate(1) blur(0px) drop-shadow(1px 1px 0px transparent); } } .medusa .medusaBody { opacity: 0; animation: medusaAppears 3s ease-in-out 2s forwards; } .medusa .medusaEverythingElse { opacity: 0; animation: medusaAppears 3s ease-in-out 5s forwards; } @keyframes medusaAppears { 0% { opacity: 0; } 100% { opacity: 1; } } /*introduction*/ .introduction { font-weight: 700; font-size: 40px; line-height: 45px; color: #2F292A; } .introduction .wrapper { padding-top: 112px; padding-bottom: 107px; } .introduction p { padding-left: 104px; max-width: 903px; } .fullWidthImage picture img { display: block; width: 100%; } /*chat*/ .chat .wrapper { padding-top: 123px; padding-bottom: 123px; } .chatBlock { padding-left: 112px; } .chatItem { font-size: 20px; line-height: 27px; margin-bottom: 30px; display: flex; } .chatItem:nth-child(2n) { margin-left: 105px; } .chatItem img { width: 100px; height: 100px; margin-bottom: 6px; align-self: flex-end; } .chatItem:last-child { margin-bottom: 0; } .chatMessageAuthor { font-size: 22px; line-height: 22px; color: #A63333; margin-bottom: 13px; } .chatCloud { max-width: 793px; padding-left: 30px; position: relative; width: 100%; } .chatCloudWrapper { padding: 21px 30px 34px; border-radius: 28px; } .chatCloud::before { content: ""; display: block; position: absolute; left: 0; bottom: 5px; width: 36px; height: 50px; } .chatCloud.pink::before { background-image: url("data:image/svg+xml,%3Csvg width='37' height='51' viewBox='0 0 37 51' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 48C31.5 57.5 31.4789 37.9516 36.4177 43.0461L33.3567 0.5L32.2746 1.29659C31.3214 8.72138 23.5823 44.9539 0 48Z' fill='%23EBD7D7'/%3E%3C/svg%3E%0A"); } .chatCloud.yellow::before { background-image: url("data:image/svg+xml,%3Csvg width='37' height='51' viewBox='0 0 37 51' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 48C31.5 57.5 31.4789 37.9516 36.4177 43.0461L33.3567 0.5L32.2746 1.29659C31.3214 8.72138 23.5823 44.9539 0 48Z' fill='%23EEE3B1'/%3E%3C/svg%3E%0A");} .chatCloud.yellow .chatCloudWrapper { background-color: #EEE3B1; } .chatCloud.pink .chatCloudWrapper { background-color: #EBD7D7; } .chatCloudWrapper.smallPaddingBottom { padding-bottom: 22px; } .chatBlock { position: relative; } .chatBlock .svgMonster { position: absolute; bottom: -20px; right: 0; } @keyframes smallMovement { 0% { transform: scale(1.0); } 50% { transform: scale(1.05); } 100% { transform: scale(1.0); } } @keyframes redderEye { 0% { fill: #DA251D; } 100% { fill: #ff0000; } } .chatBlock .svgMonster .eye { animation: redderEye 10s ease; } .chatBlock .svgMonster .animate { transform-origin: center; animation: smallMovement 2s ease infinite; } /*storyTime*/ .storyTime { background-image: url("data:image/svg+xml,%3Csvg width='1920' height='1362' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M830.5 137 0 0v1146l1092.5 134v-55l830.5 137V853.5l-3-.03v-325.5l3 .03V216L830.5 82v55Z' fill='url(%23a)'/%3E%3Cdefs%3E%3ClinearGradient id='a' x1='961.5' y1='0' x2='961.5' y2='1362' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23FFFDF7'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E"); background-size: cover; background-repeat: no-repeat; background-position: center -50px; } .storyTime .wrapper { padding: 115px 102px 87px; } .storyTime .caseH2 { margin-bottom: 43px; max-width: 1008px; } .storyBlock { font-size: 25px; line-height: 31px; margin-bottom: 42px; } .storyBlock p { margin-bottom: 31px; } .storyBlock p:last-child { margin-bottom: 0; } .storyCloud { max-width: 746px; margin: 0 auto 200px; padding: 66px 26px 120px 38px; background-image: url("data:image/svg+xml,%3Csvg width='702' height='347' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M687.9 129.778c.59-27.098.757-55.981-16.005-78.81-16.979-23.146-45.39-31.122-72.462-35.513C507.423.519 217.657-3.361 124.519 4.578c-3.895.33-7.766.89-11.595 1.678-24.65.708-48.338 6.101-70.095 24.681C-.35 67.807-2.073 156.671 10.853 206.722c16.067 62.15 102.703 63.798 153.74 69.451 40.694 4.498 84.071 8.886 127.311 10.248 5.18 17.254-5.864 35.161-11.95 41.465-20.103 20.777-1.108 18.585 6.97 17.709 15.639-1.702 33.31-13.714 43.165-22.044 11.925-10.114 20.103-23.354 25.494-37.733 17.092-.893 231.593-7.784 248.502-10.441 72.358-11.689 82.5-84.78 83.815-145.599Z' fill='%23DFD5A7'/%3E%3Cpath d='M34.916 68.176c12.083-12.9 20.41-24.353 36.637-32.958 15.385-8.146 33.477-9.034 48.44-17.559a1.151 1.151 0 0 0 .316-1.727 1.154 1.154 0 0 0-.54-.372c-26.975-5.198-85.866 19.551-85.594 52.285a.44.44 0 0 0 .74.33ZM128.261 16.435c2.476 1.498 5.53.42 8.274.134 1.068-.116 4.089-.856 3.642-2.55-.53-2.195-3.57-2.273-5.375-2.082-2.902.295-5.849.564-6.892 3.554a.807.807 0 0 0 .342.909l.009.035ZM651.072 224.262c-11.849 8.32-20.953 16.827-34.952 21.994-11.778 4.357-22.948 6.622-33.655 13.496a.984.984 0 0 0-.399 1.041.981.981 0 0 0 .83.743c23.276 1.145 63.412-9.753 68.999-36.643.093-.437-.37-.986-.831-.667l.008.036ZM116.487 254.435c9.879 6.11 24.425 5.588 35.63 6.44 14.798 1.144 30.249 2.377 44.883-.593a.974.974 0 0 0 .051-1.901c-13.17-3.237-26.768-2.973-40.215-3.688-12.807-.682-27.505-3.956-40.157-1.494a.674.674 0 0 0-.445.918c.052.119.138.22.247.291l.006.027ZM205.098 259.958c2.446 1.996 7.72 3.271 10.453 1.336a.715.715 0 0 0 .167-1.107c-2.411-2.165-6.527-1.303-9.551-1.979-.918-.203-1.965 1.013-1.069 1.75Z' fill='%23fff'/%3E%3Cpath d='M501.626 94.228c-.969 2.123-1.185 4.356-1.737 6.604-.598 2.448-1.162 4.643-1.534 7.131-.129.909 1.072 1.233 1.651.734 3.588-3.161 5.718-9.313 4.279-14.054-.334-1.07-2.083-1.668-2.659-.415ZM.107 212.978C2.35 243.395 32.387 272.013 62.682 272a.917.917 0 0 0 1.057-.76.922.922 0 0 0-.76-1.058c-14.268-6.182-28-10.653-39.18-21.991-10.196-10.348-13.893-24.202-22.282-35.553-.38-.513-1.47-.495-1.41.34ZM63.67 216.84c2.931 2.521 8.914 5.125 12.584 2.926a1.324 1.324 0 0 0 .662-.962 1.33 1.33 0 0 0-.352-1.114c-1.75-1.419-3.683-1.49-5.843-1.912a33.31 33.31 0 0 0-6.247-.728c-.862-.009-1.543 1.157-.805 1.79ZM648.29 17.236c34.016 15.51 44.906 51.619 51.226 85.818.171.974 1.593.622 1.641-.26 1.775-31.742-15.785-82.286-52.058-87.58-1.176-.158-1.986 1.499-.769 2.051l-.04-.029Z' fill='%23DFD5A7'/%3E%3C/svg%3E"); background-size: 100% 100%; position: relative; box-sizing: border-box; } .storyTimeMonster { width: 230px; height: 247px; position: absolute; bottom: -200px; } .storyCloud p { max-width: 620px; font-weight: 700; font-size: 25px; line-height: 30px; text-align: center; } .storyTime .svgMonster { margin-top: 100px; } .wTextCaptions { position: relative; } .caption { position: absolute; bottom: 35px; min-height: 92px; color: #FBF9EE; font-size: 25px; line-height: 25px; background-color: #A63333; border-radius: 10px; display: flex; padding: 10px 3px 7px 14px; box-sizing: border-box; } .caption img { width: 61px; height: 55px; margin-right: 20px; } .caption.first { padding: 19px 30px 19px; max-width: 382px; left: 15%; } .caption.second { max-width: 634px; left: calc(50% + 20px); } /*company*/ .company .wrapper { display: flex; align-items: center; flex-direction: column; padding-top: 124px; padding-bottom: 50px; } .companyLogo { margin-bottom: 44px; } .company .caseH2 { color: #000000; margin-bottom: 38px; max-width: 903px; text-align: center; } .company .caseH2 span { color: #A63333; } .companyText { text-align: center; max-width: 963px; font-size: 35px; line-height: 35px; margin-bottom: 60px; } .worriesList { display: flex; justify-content: space-between; counter-reset: worriesCounter; } .worryItem { width: calc(33.3333% - 86px); font-size: 20px; line-height: 20px; text-align: center; color: #000000; } .counter { position: relative; counter-increment: worriesCounter; display: block; margin: 0 auto 27px; width: 111px; height: 105px; background-image: url("data:image/svg+xml,%3Csvg width='116' height='106' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.354 82.155c3.483 11.525 18.648 22.568 30.66 22.131a.166.166 0 0 0 .123-.261.168.168 0 0 0-.095-.064c-5.776-1.591-11.116-3.276-16.209-6.529-6.234-3.982-9.96-9.63-14.37-15.333a.066.066 0 0 0-.118.056h.009ZM110.277 32.658c7.278 20.171 4.398 39.517-8.595 56.725-.107.143.124.31.243.188 13.671-14.04 19.011-39.621 8.634-57.032-.085-.145-.342-.05-.282.12ZM97.433 93.335c.906-.428 2.877-1.34 2.655-2.606a.187.187 0 0 0-.226-.13c-.547.095-.919.625-1.314.971-.496.427-.993.855-1.476 1.297-.265.245.07.6.361.468ZM3.01 29.138c2.206-4.012 4.669-7.69 7.78-11.057 2.827-3.071 6.208-5.51 8.996-8.6a.175.175 0 0 0-.214-.273c-7.109 4.059-14.81 11.68-16.791 19.836a.124.124 0 0 0 .226.094h.002ZM5.735 18.68c.91-1.186 1.9-2.31 2.962-3.362 1.068-1.069 2.258-2.006 3.23-3.177a.213.213 0 0 0-.213-.36c-3.079.832-5.016 3.996-6.392 6.66a.237.237 0 0 0 .408.239h.005Z' fill='%23A63333'/%3E%3Cellipse cx='55.964' cy='52.76' rx='55.964' ry='52.76' fill='%23A63333'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-size: 100% 100%; } .counter::after { display: block; position: absolute; width: 100%; height: 100%; left: 0; top: 0; font-weight: 700; font-size: 80px; line-height: 94px; text-align: center; color: #ffffff; content: counter(worriesCounter); } /*plan*/ .plan .wrapper { padding-top: 50px; padding-bottom: 71px; } .postBlock { display: flex; max-width: 980px; margin: 0 auto 0; } .postBlock .caseH3 { margin-bottom: 29px; } .postBlockAvatar { margin-right: 87px; } .postBlockAvatar img { width: 150px; height: 150px; margin-bottom: 14px; display: block; } .postBlockAvatar p { font-size: 20px; line-height: 16px; text-align: center; color: #A63333; } .postBlockAvatar .caseH3 { margin-bottom: 29px; } .planItems { list-style-type: none; counter-reset: planItems; } .planItems li { counter-increment: planItems; position: relative; padding-left: 70px; margin-bottom: 31px; } .planItems li::before { position: absolute; content: "0" counter(planItems) "."; left: 0; top: -3px; font-weight: 900; font-size: 40px; line-height: 40px; color: #A63333; } .planItems li:nth-child(2)::before { top: -5px; } .postBlockText { font-size: 26px; line-height: 30px; color: #2F292A; } /*firstStep*/ .firstStep .wrapper { padding-top: 124px; padding-bottom: 122px; } .firstStep .postBlock { margin-bottom: 46px; } .stepsGrid { display: grid; grid-template-columns: 25fr 42fr 33fr; grid-template-rows: auto auto; gap: 30px; } .stepsItem { background: #E5DAA3; border-radius: 36px; font-size: 20px; line-height: 20px; font-weight: 700; color: #A63333; padding: 23px 19px 12px 27px; min-height: 157px; box-sizing: border-box;; } .cornerCounterReset { counter-reset: cornerCounter; } .cornerCounter { position: relative; counter-increment: cornerCounter; } .stepsItem p { margin-bottom: 8px; } .stepsItem.three p { margin-bottom: 22px; } .stepsGrid .stepsItem p:last-child { margin-bottom: 0; } .stepsItem .description { font-size: 18px; line-height: 18px; font-weight: 400; color: #2F292A; } .stepsItem.one { padding-top: 39px; grid-column: 1 / 2; grid-row: 1 / 2; } .stepsItem.two { padding-top: 33px; grid-column: 2 / 3; grid-row: 1 / 2; } .stepsItem.three { grid-column: 3 / 4; grid-row: 1 / 3; padding-top: 42px; } .stepsItem.four { grid-column: 1 / 2; grid-row: 2 / 3; } .stepsItem.five { grid-column: 2 / 3; grid-row: 2 / 3; } .cornerCounter::before { position: absolute; content: "0" counter(cornerCounter); font-weight: 900; font-size: 55px; line-height: 55px; color: #FDF6D8; bottom: 7px; right: 19px; } .cornerCounterRed::before { color: #EE9D9D; } .stepsItem.one p { max-width: 162px; } .stepsItem.two p { max-width: 378px; } .stepsItem.five p { max-width: 336px; } /*optimization*/ .optimization .wrapper { padding-top: 124px; padding-bottom: 111px; } .optimization .caseH2 { margin-bottom: 51px; color: #2F292A } .caseH2smaller { font-size: 50px; } .stepsFlex { display: flex; justify-content: space-between; margin-bottom: 42px; } .optimizationStepsItem.stepsItem { width: calc(50% - 15px); } .optimizationStepsItem.stepsItem { font-size: 17px; line-height: 18px; color: #2F292A; } .leftBlock { max-width: 800px; margin-bottom: 85px; } .optimizationText { color: #A63333; font-weight: 700; font-size: 20px; line-height: 24px; } .optimizationMonster { display: block; position: absolute; right: 0; top: 140px; } .postBlockText p { margin-bottom: 24px; } .widerGaps p { margin-bottom: 32px; } .postBlockText p:last-child { margin-bottom: 0; } .colorAttention { color: #A63333; } /*marathon*/ .marathon { background-image: url("data:image/svg+xml,%3Csvg width='1920' height='1362' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M830.5 137 0 0v1146l1092.5 134v-55l830.5 137V853.5l-3-.03v-325.5l3 .03V216L830.5 82v55Z' fill='url(%23a)'/%3E%3Cdefs%3E%3ClinearGradient id='a' x1='961.5' y1='0' x2='961.5' y2='1362' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='1' stop-color='%23FFFDF7'/%3E%3C/linearGradient%3E%3C/defs%3E%3C/svg%3E"); background-position: top; background-size: 100% 75%; background-repeat: no-repeat; } .marathon .wrapper { padding-top: 130px; padding-bottom: 55px; } .marathonCloud { background-image: url("data:image/svg+xml,%3Csvg width='776' height='379' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M756.406 154.402c1.406-29.501 2.403-60.959-15.211-86.3-17.843-25.69-48.565-35.18-77.931-40.726C563.461 8.511 247.933-3.889 146.255 2.131c-4.252.25-8.485.75-12.677 1.501-26.871.076-52.827 5.283-77.05 24.908C8.454 67.484 4.07 164.233 16.738 219.117c15.748 68.153 110.073 72.392 165.508 79.989 44.2 6.047 91.326 12.051 138.389 14.754 5.155 18.94-7.379 38.135-14.187 44.831-22.484 22.064-1.731 20.212 7.093 19.486 17.084-1.413 36.67-13.999 47.64-22.795 13.276-10.68 22.557-24.871 28.835-40.382 18.644-.491 252.491-1.947 270.984-4.364 79.148-10.691 92.257-90.023 95.406-156.234Z' fill='%23A63333'/%3E%3Cpath d='M49.44 75.141C62.966 61.431 72.36 49.19 90.278 40.275c16.988-8.44 36.721-8.897 53.26-17.761a1.258 1.258 0 0 0 .393-1.873 1.26 1.26 0 0 0-.578-.42c-29.236-6.423-94.084 18.875-94.71 54.539a.48.48 0 0 0 .797.381ZM152.578 21.414c2.656 1.701 6.012.613 9.01.38 1.166-.097 4.478-.817 4.039-2.676-.516-2.406-3.825-2.576-5.796-2.419-3.17.24-6.388.45-7.608 3.677a.88.88 0 0 0 .347 1l.008.038ZM713.624 254.424c-13.142 8.73-23.299 17.739-38.693 22.973-12.953 4.414-25.184 6.566-37.041 13.751a1.075 1.075 0 0 0-.152 1.677c.158.148.357.246.572.279 25.322 1.903 69.349-8.836 76.193-37.968.113-.474-.376-1.085-.887-.751l.008.039ZM140.303 278.829c10.589 6.934 26.448 6.775 38.63 8.019 16.086 1.665 32.882 3.443 48.907.62a1.059 1.059 0 0 0 .108-2.068c-14.254-3.899-29.073-3.994-43.701-5.153-13.931-1.104-29.85-5.085-43.7-2.759a.728.728 0 0 0-.511.987.732.732 0 0 0 .26.324l.007.03ZM236.67 287.344c2.608 2.243 8.317 3.78 11.349 1.749a.773.773 0 0 0 .395-.549.775.775 0 0 0-.182-.652c-2.566-2.426-7.074-1.603-10.349-2.424-.994-.247-2.168 1.048-1.213 1.876Z' fill='%23fff'/%3E%3Cpath d='M554.503 167.384c-1.115 2.285-1.413 4.711-2.078 7.145-.72 2.65-1.398 5.024-1.872 7.724-.167.987 1.133 1.373 1.777.846 3.998-3.342 6.491-9.983 5.058-15.188-.334-1.176-2.223-1.876-2.885-.527ZM.192 221.08c1.585 33.195 33.497 65.216 66.497 66.056a1.001 1.001 0 0 0 1.173-.798 1.006 1.006 0 0 0-.799-1.174c-15.367-7.137-30.2-12.394-42.058-25.059-10.814-11.56-14.45-26.755-23.268-39.357-.398-.569-1.587-.58-1.545.332ZM73.985 288.589c3.123 2.828 9.566 5.834 13.626 3.542a1.45 1.45 0 0 0 .396-2.253c-1.866-1.594-3.97-1.726-6.311-2.247a36.286 36.286 0 0 0-6.784-.969c-.938-.034-1.713 1.216-.927 1.927ZM744.142 53.193c29.22 28.385 27.159 69.429 21.108 106.839-.182 1.062 1.407 1.222 1.779.334 13.457-31.92 13.965-90.222-21.315-108.952-1.15-.592-2.588.81-1.542 1.824l-.03-.045Z' fill='%23A63333'/%3E%3C/svg%3E"); margin-bottom: 46px; } .marathonCloud p { font-size: 35px; line-height: 35px; color: #FBF9EE; } .marathon .postBlock { margin-bottom: none; } .postBlock.narrow { max-width: 920px; } /*security*/ .security .wrapper { padding-top: 55px; padding-bottom: 112px; } .security .caseH2 { max-width: 670px; margin-bottom: 41px; color: #2F292A; } .cloudsFlex { display: flex; justify-content: space-between; flex-wrap: wrap; } .cloudHeaderBlock { width: 100%; } .cloudItem { width: calc(33% - 14px); background-size: 100% 100%; background-repeat: no-repeat; font-weight: 700; font-size: 20px; line-height: 20px; color: #2F292A; padding: 70px 17px 45px 35px; box-sizing: border-box; } .cloudItemBiggerFont { font-size: 25px; line-height: 25px; } .cloudItem.yellow { background-image: url("data:image/svg+xml,%3Csvg width='396' height='251' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m312.384 242.441-137.108.084-.036.071c-38.667-.149-75.068-1.041-91.605-3.749-48.57-7.952-65.582-21.376-70.634-45.009C10.145 180.577-4.98 61.619 30.413 30.028a99.353 99.353 0 0 1 28.765-17.972c25.67-10.557 191.416-9.27 239.967.906 43.451 6.223 83.308 22.59 91.656 72.289 5.74 34.236 6.969 77.727-3.814 114.239-6.347 21.475-25.551 42.04-75.072 42.322l.469.629Z' fill='%23EEE3B1'/%3E%3Cpath d='M63.508 1.159C25.936-2.27-3.683 41.376 3.032 75.975a.785.785 0 0 0 1.547-.069c5.62-38.394 18.514-65.039 58.959-74.017a.367.367 0 0 0-.029-.73ZM2.441 79.362C.851 81.6-.323 86.28 2.186 88.246a.777.777 0 0 0 1.086-.177c.689-1.137.588-2.04.445-3.34-.193-1.703.072-3.389-.1-5.102a.657.657 0 0 0-1.176-.265ZM337.91 14.95c8.939 4.993 18.246 8.63 26.557 14.792 9.157 6.823 16.273 16.673 23.349 25.534a.708.708 0 0 0 1.184-.733c-8.277-19.309-28.507-39.681-50.785-40.408-.405-.014-.725.576-.299.8l-.006.015ZM385.617 219.416c-3.638 3.988-6.056 8.76-9.934 12.686-3.879 3.926-8.94 6.873-13.986 9.289-11.349 5.446-22.95 4.614-34.962 6.516-.687.108-.867 1.224-.137 1.415 12.577 3.272 27.31-.601 38.76-6.1 8.701-4.158 19.987-13.243 20.914-23.562a.37.37 0 0 0-.059-.22.369.369 0 0 0-.596-.024ZM10.915 216.219c1.723 28.111 48.75 35.195 69.81 31.232.978-.181.796-1.424-.07-1.619-26.543-6.016-53.191-3.183-68.421-30.023a.699.699 0 0 0-1.322.418l.003-.008Z' fill='%23EEE3B1'/%3E%3C/svg%3E"); } .cloudItem.red { background-image: url("data:image/svg+xml,%3Csvg width='396' height='251' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m312.384 242.441-137.108.084-.036.071c-38.667-.149-75.068-1.041-91.605-3.749-48.57-7.952-65.582-21.376-70.634-45.009C10.145 180.577-4.98 61.619 30.413 30.028a99.353 99.353 0 0 1 28.765-17.972c25.67-10.557 191.416-9.27 239.967.906 43.451 6.223 83.308 22.59 91.656 72.289 5.74 34.236 6.969 77.727-3.814 114.239-6.347 21.475-25.551 42.04-75.072 42.322l.469.629Z' fill='%23A63333'/%3E%3Cpath d='M63.508 1.159C25.936-2.27-3.683 41.376 3.032 75.975a.785.785 0 0 0 1.547-.069c5.62-38.394 18.514-65.039 58.959-74.017a.367.367 0 0 0-.029-.73ZM2.441 79.362C.851 81.6-.323 86.28 2.186 88.246a.777.777 0 0 0 1.086-.177c.689-1.137.588-2.04.445-3.34-.193-1.703.072-3.389-.1-5.102a.657.657 0 0 0-1.176-.265ZM337.91 14.95c8.939 4.993 18.246 8.63 26.557 14.792 9.157 6.823 16.273 16.673 23.349 25.534a.708.708 0 0 0 1.184-.733c-8.277-19.309-28.507-39.681-50.785-40.408-.405-.014-.725.576-.299.8l-.006.015ZM385.617 219.416c-3.638 3.988-6.056 8.76-9.934 12.686-3.879 3.926-8.94 6.873-13.986 9.289-11.349 5.446-22.95 4.614-34.962 6.516-.687.108-.867 1.224-.137 1.415 12.577 3.272 27.31-.601 38.76-6.1 8.701-4.158 19.987-13.243 20.914-23.562a.37.37 0 0 0-.059-.22.369.369 0 0 0-.596-.024ZM10.915 216.219c1.723 28.111 48.75 35.195 69.81 31.232.978-.181.796-1.424-.07-1.619-26.543-6.016-53.191-3.183-68.421-30.023a.699.699 0 0 0-1.322.418l.003-.008Z' fill='%23A63333'/%3E%3C/svg%3E"); color: #FBF9EE; padding-top: 44px; font-weight: 400; } .cloudItem.cornerCounter::before { right: 38px; bottom: 20px; font-weight: 700; } /*migration*/ .migration .wrapper { padding-top: 106px; padding-bottom: 131px; } .migration .caseH2 { font-size: 60px; line-height: 60px; color: #2F292A; margin-bottom: 17px; } .migrationText { margin-bottom: 46px; max-width: 640px; font-size: 30px; line-height: 30px; color: #231F20; } .migration .postBlock { margin-bottom: 80px; } /*blackBlock*/ .blackBlock::after { content: ""; position: absolute; background-color: #000000; width: 100%; height: 100%; left: 0; top: 0; opacity: 1; transition: 0.5s 0.5s all ease-in; } .caseWrapper.scrolled .blackBlock[data-load=true]::after { opacity: 0; } /*results*/ .results { padding-top: 124px; padding-bottom: 81px; } .results .postBlockText p { font-size: 27px; margin-bottom: 32px; } .results .postBlockText .caseH3 { font-size: 50px; line-height: 50px; margin-bottom: 23px; } .happyEnd { height: 600px; } .happyEnd .background { width: 100%; height: 100%; object-fit: cover; } .happyEndText { position: absolute; left: calc(50% - 401px); top: 136px; text-align: center; max-width: 801px; font-weight: 700; font-size: 60px; line-height: 60px; text-align: center; color: #000000; } .happyEndBall { position: absolute; width: 222px; height: 222px; top: 35px; right: 10%; } .happyEndCat { position: absolute; width: 203px; height: 186px; right: 17%; bottom: 20px; cursor: pointer; } .happyEndLegs { transform: rotateY(180deg); position: absolute; width: 231px; height: 447px; left: 0; top: 108px; } .happyEndCatHead { position: absolute; width: 125px; height: 134px; left: 26%; bottom: 60px; } /*slider*/ .casesSliderBlock { padding-top: 104px; padding-bottom: 120px; } .casesButtonNext:hover, .casesButtonPrev:hover { background-color: #A63333; border-color: #A63333; } .sliderHeader { font-weight: 700; } .chatAvatarWrapper { position: relative; overflow: hidden; width: min-content; height: min-content; align-self: flex-end; } .chatAvatarWrapper img { display: block; } .chatAvatarWrapper:after { content: ""; position: absolute; top: -50%; left: -60%; width: 20%; height: 200%; opacity: 0; transform: rotate(30deg); background: rgba(255, 255, 255, 0.13); background: linear-gradient( to right, rgba(255, 255, 255, 0.13) 0%, rgba(255, 255, 255, 0.13) 66%, rgba(255, 255, 255, 0.8) 82%, rgba(255, 255, 255, 0.0) 100% ); } /* Hover state - trigger effect */ .chatAvatarWrapper:hover:after { opacity: 1; left: 130%; transition-property: left, top, opacity; transition-duration: 0.7s, 0.7s, 0.15s; transition-timing-function: ease; } /* Active state */ .chatAvatarWrapper:active:after { opacity: 0; } @media (max-width: 1200px) and (min-width: 1081px) { .happyEndLegs { left: -80px; } .happyEndBall { right: 0; } } @media (min-width: 1081px) { .alignBottom { display: flex; flex-direction: column; justify-content: flex-end; margin-bottom: -38px; } } @media (max-width: 1150px) { .caption.first { left: 10%; } } @media (max-width: 1080px) { .wrapper { padding-left: 30px; padding-right: 30px; } .caseHeader .wrapper { padding-top: 139px; padding-bottom: 71px; } .caseHeaderText { max-width: 70%; font-size: 18px; line-height: 27px; } .caseWrapper h1 { font-size: 35px; line-height: 35px; margin: 0 0 8px; padding: 0; } .worm { width: 209px; height: 69px; top: 58px; left: -7px; } .medusa { width: 91px; height: 93px; top: 40px; left: 50%; } .ballMonster { width: 174px; height: 166px; right: 0; top: 56px; } .arrow { width: 107px; height: 111px; left: 77%; bottom: 180px; } @keyframes arrow { 0% { opacity: 0; transform: rotate(10deg) translateX(500px) translateY(-500px); } 100% { opacity: 1; transform: rotate(10deg) translateX(0) translateY(0); } } .deadMonster { width: 128px; height: 135px; left: 68%; } .pow { width: 117px; height: 74px; left: 77%; bottom: 112px; } .target, .screamingMonster { display: none; } /*introduction*/ .introduction { font-size: 22px; line-height: 29px; } .introduction .wrapper { padding-top: 50px; padding-bottom: 32px; } .introduction p { padding-left: 0; max-width: 635px; } /*chat*/ .chat .wrapper { padding-top: 50px; padding-bottom: 115px; } .chatBlock { padding-left: 0; } .chatItem { font-size: 16px; line-height: 24px; } .chatItem img { width: 80px; height: 80px; margin-bottom: 0; } .chatAvatarWrapper { min-width: 80px; } .chatItem:nth-child(2n) { margin-left: 0; } .chatCloud::before { bottom: 12px; } .chatCloudWrapper { padding: 12px 14px 15px 22px } .chatMessageAuthor { font-size: 18px; line-height: 18px; margin-bottom: 8px; } .chatBlock .svgMonster { width: 204px; height: 250px; bottom: -120px; } /*storyTime*/ .storyTime .wrapper { padding: 80px 30px 96px; } .caseH2 { font-size: 30px; line-height: 39px; } .storyTime .caseH2 { margin-bottom: 25px; max-width: 600px; } .storyBlock { font-size: 18px; line-height: 150%; margin-bottom: 21px; } .storyCloud { max-width: 523px; padding: 43px 36px 97px 31px; margin: 0 0 0 auto; } .storyCloud p { font-size: 18px; line-height: 130%; } .storyTimeMonster { width: 200px; height: 214px; left: -131px; bottom: -50px; } /*caption*/ .caption { font-size: 15px; line-height: 15px; min-height: 80px; bottom: 0; } .caption img { width: 44px; height: 39px; margin-right: 14px; } .caption.first, .caption.second { max-width: 44%; } .caption.first { left: 4%; padding: 25px 30px 10px; } .caption.second { padding: 10px 14px 8px; } /*company*/ .company .wrapper { padding-top: 40px; padding-bottom: 22px; } .companyLogo { margin-bottom: 24px; } .company .caseH2 { max-width: 500px; margin-bottom: 14px; } .companyText { max-width: 583px; font-size: 20px; line-height: 26px; margin-bottom: 36px; } .counter { width: 76px; height: 69px; margin-bottom: 14px; } .counter::after { font-size: 50px; line-height: 62px; } .worryItem { width: calc(33.3333% - 14px); } .worryText { font-size: 16px; line-height: 21px; } /*plan*/ .plan .wrapper { padding-top: 35px; padding-bottom: 47px; } .postBlockAvatar { margin-right: 66px; } .postBlockAvatar img { width: 99px; height: 99px; margin-bottom: 13px; } .caseH3 { font-size: 25px; line-height: 25px; } .postBlockText { font-weight: 400; font-size: 18px; line-height: 23px; } .postBlockText p { margin-bottom: 27px; } .postBlock .caseH3 { margin-bottom: 42px; } .planItems { font-weight: 300; font-size: 20px; line-height: 26px; } .planItems li { max-width: 464px; margin-bottom: 9px; } .planItems li::before { font-size: 40px; line-height: 40px; } .firstStep .postBlock { margin-bottom: 57px; } .firstStep .postBlockText { margin-top: 31px; } .firstStep .wrapper { padding-top: 51px; padding-bottom: 70px; } .stepsGrid { grid-template-columns: 1fr 1fr; grid-template-rows: max-content max-content max-content; gap: 20px; } .stepsItem { padding: 39px 27px 54px 22px; } .stepsItem .description { font-size: 16px; line-height: 16px; } .stepsItem.three { padding-top: 26px; grid-column: 1 / 2; grid-row: 2 / 3; } .stepsItem.four { grid-column: 2 / 3; grid-row: 2 / 3; } .stepsItem.five { padding-top: 23px; grid-column: 1 / 3; grid-row: 3 / 4; } .stepsItem.one p { max-width: none; } .stepsItem.three p { margin-bottom: 10px; } .stepsItem.three .description { padding-right: 30px; } .stepsItem.five p { max-width: 565px; } /*optimization*/ .optimization .wrapper { padding-top: 80px; padding-bottom: 70px; } .optimization .caseH2 { margin-bottom: 42px; } .optimizationStepsItem.stepsItem { padding: 23px 28px 38px 20px; min-height: 133px; width: calc(50% - 11px); } .stepsFlex { margin-bottom: 51px; } .optimizationText { font-size: 18px; line-height: 24px; max-width: 72%; } .optimizationMonster { width: 113px; height: 218px; top: 300px; right: 78px; } .leftBlock { margin-bottom: 82px; } .marathon { background-image: none; } .marathon .wrapper { padding-top: 28px; padding-bottom: 15px; } .marathonCloud { margin-bottom: 50px; margin-right: auto; max-width: 515px; } .marathon .caseH3 { margin-bottom: 22px; } /*security*/ .security .wrapper { padding-top: 47px; padding-bottom: 66px; } .cloudItem { font-size: 16px; line-height: 19px; padding: 50px 40px 40px 38px; } .cloudItemPaddingTop { padding-top: 74px; } .cloudItem.yellow { padding-top: 63px; padding-bottom: 56px; } .cloudsFlex > div { width: calc(50% - 8px); margin-bottom: 20px; } .cloudHeaderBlock { align-self: center; padding-left: 5px; } .security .caseH2 { margin-bottom: 0; } .securityCaseH2 { font-size: 32px; line-height: 32px; } /*migration*/ .migration .wrapper { padding-top: 70px; padding-bottom: 60px; } .migration .caseH2 { font-size: 40px; line-height: 40px; margin-bottom: 7px; } .migrationPostBlockText { font-size: 20px; line-height: 26px; } .migration .postBlock { margin-bottom: 30px; } .migrationText { font-size: 18px; line-height: 23px; margin-bottom: 0; margin-right: -15px; } .migration .cloudsFlex > div { width: calc(50% - 30px); } .migration .cloudItem { min-height: 200px; box-sizing: border-box; padding-top: 35px; } .migration .cornerCounter::before { font-size: 60px; line-height: 61px; } /*results*/ .results { padding-top: 60px; padding-bottom: 32px; } .results .postBlockText p { font-size: 18px; line-height: 23px; margin-bottom: 23px; } .results .postBlockText .caseH3 { font-size: 30px; line-height: 30px; margin-bottom: 17px; } .happyEnd { height: 472px; } .happyEndText { max-width: 464px; left: calc(50% - 232px); font-size: 30px; line-height: 30px; top: 172px; } .happyEndBall { width: 146px; height: 146px; top: 21px; right: 63px; } .happyEndCat { width: 135px; height: 123px; right: 20%; bottom: 63px; } .happyEndLegs { width: 138px; height: 268px; left: 47px; top: 27px; } .happyEndCatHead { width: 104px; height: 111px; left: 30%; bottom: 72px; } } @media (max-width: 1024px) { .caseWrapper { padding-bottom: 0; } } @media (max-width: 840px) and (min-width: 650px) { .arrow { left: 71%; bottom: 226px; } @keyframes arrow { 0% { opacity: 0; transform: rotate(10deg) translateX(500px) translateY(-500px); } 100% { opacity: 1; transform: rotate(-20deg) translateX(0) translateY(0); } } } @media (max-width: 768px) and (min-width: 651px) { .chatItem.tabletPadding .chatMessage { padding-right: 150px; } .happyEndLegs { left: 0; } } @media (max-width: 650px) { .caseHeader .wrapper { padding-top: 51px; padding-bottom: 190px; } .wrapper { padding-left: 15px; padding-right: 15px; } .caseWrapper h1 { font-size: 25px; line-height: 25px; margin-bottom: 13px; } .caseHeaderText { font-size: 15px; line-height: 19px; max-width: none; } .introduction { font-size: 16px; line-height: 21px; } .introduction .wrapper { padding-top: 40px; padding-bottom: 40px; } .worm { display: none; } .medusa { display: none; } .ballMonster { width: 104px; height: 106px; right: 31%; top: unset; bottom: 80px } .arrow { width: 65px; height: 40px; left:42%; bottom: 87px; } @keyframes arrow { 0% { opacity: 0; transform: rotate(10deg) translateX(500px) translateY(-215px); } 100% { opacity: 1; transform: rotate(0deg) translateX(0); } } .deadMonster { width: 76px; height: 81px; left: 33%; bottom: 20px; } .pow { width: 69px; height: 67px; left: 40%; bottom: 10px; } .fly { width: 34px; height: 41px; top: 26px; right: 18px; } /*chat*/ .chat .wrapper { padding-top: 30px; padding-bottom: 71px; } .chatItem img { width: 40px; height: 40px; } .chatAvatarWrapper { min-width: 40px; margin-bottom: 20px; } .chatCloud { margin-left: -15px; padding-left: 27px; } .chatMessageAuthor { font-size: 15px; line-height: 15px; margin-bottom: 11px; } .chatMessage { font-size: 15px; line-height: 19px; } .chatMessagePadding { padding-right: 30px; } .chatBlock .svgMonster { width: 76px; height: 114px; bottom: -65px; } /*storyTime*/ .storyTime .wrapper { padding: 40px 15px 22px; } .caseH2 { font-size: 20px; line-height: 22px; } .storyTime .caseH2 { margin-bottom: 17px; } .storyBlock { font-size: 15px; line-height: 18px; } .storyBlock p { margin-bottom: 18px; } .storyCloud { padding: 20px 16px 44px 14px; max-width: 274px; margin-right: auto; margin-bottom: 100px; } .storyTimeMonster { width: 105px; height: 112px; bottom: -85px; left: 15px; } .storyCloud p { font-size: 14px; line-height: 15px; } .textCaptions { padding-left: 15px; padding-right: 15px; } .caption { position: static; min-height: auto; font-size: 14px; line-height: 14px; } .caption.first, .caption.second { max-width: 100%; padding: 12px 15px 7px; } .caption.first { margin-top: 12px; margin-bottom: 10px; } .caption img { width: 30px; height: 27px; margin-right: 11px; } /*company*/ .company .wrapper { padding-top: 20px; padding-bottom: 14px; } .companyLogo { width: 68px; height: 61px; margin-bottom: 22px; } .company .caseH2 { margin-bottom: 10px; } .companyText { font-size: 15px; line-height: 17px; margin-bottom: 35px; } .worriesList { display: block; margin-bottom: 0; } .worryItem { display: flex; width: 100%; text-align: left; margin-bottom: 22px; } .worryItem:last-child { margin-bottom: 0; } .worryText { font-size: 15px; line-height: 18px; } .counter { width: 46px; min-width: 46px; height: 43px; margin-bottom: 0; margin-right: 9px; } .counter::after { font-size: 30px; line-height: 40px; } /*plan*/ .plan .wrapper { padding-top: 25px; padding-bottom: 48px; } .postBlock { flex-direction: column-reverse; } .postBlock .caseH3 { margin-bottom: 4px; font-size: 16px; line-height: 19px; } .planItems { font-size: 15px; line-height: 18px; } .planItems li { padding-left: 38px; margin-bottom: 14px; } .planItems li:last-child { margin-bottom: 0; } .planItems li::before { font-size: 20px; line-height: 29px; } .postBlockText { font-size: 15px; line-height: 18px; margin-bottom: 14px; } .postBlockText p { margin-bottom: 18px; } .postBlockAvatar { display: flex; align-items: center; } .postBlockAvatar img { width: 50px; height: 50px; margin-right: 9px; margin-bottom: 0; } .postBlockAvatar p { max-width: 80px; font-size: 14px; line-height: 16px; text-align: left; } /*firstStep*/ .firstStep .wrapper { padding-top: 31px; padding-bottom: 40px; } .firstStep .postBlockText { margin-top: 0; margin-bottom: 5px; } .firstStep .postBlock { margin-bottom: 30px; } .stepsItem { min-height: 100px; margin-bottom: 14px; font-size: 15px; padding: 17px 24px; } .firstStep .stepsItem { padding-top: 17px; } .stepsItem:last-child { margin-bottom: 0; } .stepsItem .description { font-size: 14px; line-height: 14px; } .cornerCounter::before { font-size: 40px; line-height: 40px; bottom: 13px; right: 6px; } /*optimization*/ .optimization .wrapper { padding-top: 40px; padding-bottom: 40px; } .optimization .caseH2 { margin-bottom: 18px; } .caseH2smaller { font-size: 16px; line-height: 19px; } .stepsFlex { display: block; margin-bottom: 31px; } .optimizationStepsItem.stepsItem { width: 100%; padding: 17px 13px 28px 25px; font-size: 15px; } .optimizationText { max-width: 100%; font-size: 16px; line-height: 19px; } .leftBlock { margin-bottom: 0; } .oprimizationBiggerText { font-size: 16px; line-height: 19px; } .optimizationMonster { position: static; width: 60px; height: 117px; margin: -7px 46px 35px auto; } /*marathon*/ .marathon .wrapper { padding-top: 30px; padding-bottom: 22px; } .marathonCloud { max-width: 290px; margin-bottom: 31px; } .marathonCloud p { font-size: 15px; line-height: 18px; font-weight: 400; } .marathon .caseH3 { margin-bottom: 14px; } /*security*/ .security .wrapper { padding-top: 22px; padding-bottom: 45px; } .cloudsFlex { display: block; } .cloudsFlex > div { width: 100%; margin-bottom: 17px; } .cloudItem { font-size: 15px; line-height: 17px; padding: 50px 25px 50px; } .cloudItem.paddingMobile { padding-top: 30px; } .cloudItem.yellow { padding-top: 42px; padding-bottom: 42px; } /*migration*/ .migration .wrapper { padding-top: 40px; padding-bottom: 50px; } .migration .postBlock { margin-bottom: 46px; } .migration .cloudsFlex > div { width: 100%; } .migration .caseH2 { font-size: 20px; line-height: 22px; margin-bottom: 8px; } .migrationText { font-size: 15px; line-height: 18px; margin-bottom: 41px; } .migration .cloudItem { font-size: 18px; font-weight: 400; line-height: 20px; padding-right: 100px; min-height: 60px; } .results .postBlockText p { font-size: 15px; line-height: 18px; margin-bottom: 18px; } .results .postBlockText .caseH3 { font-size: 20px; line-height: 22px; } .happyEnd { height: 300px; } .happyEndText { font-size: 20px; line-height: 22px; left: calc(50% - 137px); max-width: 274px; top: 102px; } .happyEndBall { width: 80px; height: 80px; top: 12px; right: 17px; } .happyEndCat { width: 77px; height: 70px; right: 13px; bottom: 40px; } .happyEndLegs { width: 52px; height: 100px; left: 25px; top: 17px; } .happyEndCatHead { width: 60px; height: 65px; left: 31px; bottom: 35px; } .casesSliderBlock { padding-top: 26px; padding-bottom: 90px; } } @media (max-width: 575px) { .stepsGrid { display: block; } } @media (max-width: 500px) { .migration .cloudItem { min-height: 190px; padding-right: 20px; } .arrow { left:35%; } .deadMonster { left: 26%; } .pow { left: 33%; } } @media (max-width: 450px) { .stepsItem { min-height: 135px; } .ballMonster { right: 23%; } } /* CSS3 ANIMATION */ .caseWrapper .animation-show, .caseWrapper .animation-show-2, .caseWrapper .animation-show-3, .caseWrapper .animation-show-4 { opacity: 0; transition: all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; } .caseWrapper .animation-left, .caseWrapper .animation-left-2, .caseWrapper .animation-left-3, .caseWrapper .animation-left-4 { opacity: 0; -ms-transform: translate(200px, 0); transform: translate(200px, 0); -webkit-transform: translate(200px, 0); -moz-transform: translate(200px, 0); -o-transform: translate(200px, 0); } .caseWrapper.scrolled .animation-left[data-load=true] { transition-delay: 0.6s; -webkit-transition-delay: 0.6s; -moz-transition-delay: 0.6s; -o-transition-delay: 0.6s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.2s ease-in-out; -webkit-transition: all 0.6s 0.2s ease-in-out; -moz-transition: all 0.6s 0.2s ease-in-out; -o-transition: all 0.6s 0.2s ease-in-out; } .caseWrapper.scrolled .animation-left-2[data-load=true] { transition-delay: 0.9s; -webkit-transition-delay: 0.9s; -moz-transition-delay: 0.9s; -o-transition-delay: 0.9s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); -webkit-transition: all 0.6s 0.2s ease-in-out; -o-transition: all 0.6s 0.2s ease-in-out; transition: all 0.6s 0.2s ease-in-out; -webkit-transition: all 0.6s 0.3s ease-in-out; -moz-transition: all 0.6s 0.3s ease-in-out; -o-transition: all 0.6s 0.3s ease-in-out; } .caseWrapper.scrolled .animation-left-3[data-load=true] { transition-delay: 1.2s; -webkit-transition-delay: 1.2s; -moz-transition-delay: 1.2s; -o-transition-delay: 1.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.4s ease-in-out; -webkit-transition: all 0.6s 0.4s ease-in-out; -moz-transition: all 0.6s 0.4s ease-in-out; -o-transition: all 0.6s 0.4s ease-in-out; } .caseWrapper.scrolled .animation-left-4[data-load=true] { transition-delay: 1.5s; -webkit-transition-delay: 1.5s; -moz-transition-delay: 1.5s; -o-transition-delay: 1.5s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.5s ease-in-out; -webkit-transition: all 0.6s 0.5s ease-in-out; -moz-transition: all 0.6s 0.5s ease-in-out; -o-transition: all 0.6s 0.5s ease-in-out; } .caseWrapper .animation-right, .caseWrapper .animation-right-2, .caseWrapper .animation-right-3 { opacity: 0; -ms-transform: translate(-200px, 0); transform: translate(-200px, 0); -webkit-transform: translate(-200px, 0); -moz-transform: translate(-200px, 0); -o-transform: translate(-200px, 0); } .caseWrapper.scrolled .animation-right[data-load=true] { transition-delay: 0.6s; -webkit-transition-delay: 0.6s; -moz-transition-delay: 0.6s; -o-transition-delay: 0.6s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.2s ease-in-out; -webkit-transition: all 0.6s 0.2s ease-in-out; -moz-transition: all 0.6s 0.2s ease-in-out; -o-transition: all 0.6s 0.2s ease-in-out; } .caseWrapper.scrolled .animation-right-2[data-load=true] { transition-delay: 0.9s; -webkit-transition-delay: 0.9s; -moz-transition-delay: 0.9s; -o-transition-delay: 0.9s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.4s ease-in-out; -webkit-transition: all 0.6s 0.4s ease-in-out; -moz-transition: all 0.6s 0.4s ease-in-out; -o-transition: all 0.6s 0.4s ease-in-out; } .caseWrapper.scrolled .animation-right-3[data-load=true] { transition-delay: 1.2s; -webkit-transition-delay: 1.2s; -moz-transition-delay: 1.2s; -o-transition-delay: 1.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.6s ease-in-out; -webkit-transition: all 0.6s 0.6s ease-in-out; -moz-transition: all 0.6s 0.6s ease-in-out; -o-transition: all 0.6s 0.6s ease-in-out; } .caseWrapper .animation-top, .caseWrapper .animation-top-2, .caseWrapper .animation-top-3, .caseWrapper .animation-top-4, .caseWrapper .animation-top-5, .caseWrapper .animation-top-6 { opacity: 0; -ms-transform: translate(0, 50px); transform: translate(0, 50px); -webkit-transform: translate(0, 50px); -moz-transform: translate(0, 50px); -o-transform: translate(0, 50px); } .caseWrapper.scrolled .animation-top[data-load=true] { transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; } .caseWrapper.scrolled .animation-top-2[data-load=true] { transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.2s ease-in-out; -webkit-transition: all 0.6s 0.2s ease-in-out; -moz-transition: all 0.6s 0.2s ease-in-out; -o-transition: all 0.6s 0.2s ease-in-out; } .caseWrapper.scrolled .animation-top-3[data-load=true] { transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.3s ease-in-out; -webkit-transition: all 0.6s 0.3s ease-in-out; -moz-transition: all 0.6s 0.3s ease-in-out; -o-transition: all 0.6s 0.3s ease-in-out; } .caseWrapper.scrolled .animation-top-4[data-load=true] { transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.4s ease-in-out; -webkit-transition: all 0.6s 0.4s ease-in-out; -moz-transition: all 0.6s 0.4s ease-in-out; -o-transition: all 0.6s 0.4s ease-in-out; } .caseWrapper.scrolled .animation-top-5[data-load=true] { transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.5s ease-in-out; -webkit-transition: all 0.6s 0.5s ease-in-out; -moz-transition: all 0.6s 0.5s ease-in-out; -o-transition: all 0.6s 0.5s ease-in-out; } .caseWrapper.scrolled .animation-top-6[data-load=true] { transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s 0.6s ease-in-out; -webkit-transition: all 0.6s 0.6s ease-in-out; -moz-transition: all 0.6s 0.6s ease-in-out; -o-transition: all 0.6s 0.6s ease-in-out; } .caseWrapper .animation-bottom { opacity: 0; -ms-transform: translate(0, -50px); transform: translate(0, -50px); -webkit-transform: translate(0, -50px); -moz-transform: translate(0, -50px); -o-transform: translate(0, -50px); } .caseWrapper.scrolled .animation-bottom[data-load=true] { transition-delay: 0.2s; -webkit-transition-delay: 0.2s; -moz-transition-delay: 0.2s; -o-transition-delay: 0.2s; opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; } .caseWrapper .animation-fade { opacity: 0; transition: all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; -ms-transform: scale(0.1, 0.1); transform: scale(0.1, 0.1); -webkit-transform: scale(0.1, 0.1); -moz-transform: scale(0.1, 0.1); -o-transform: scale(0.1, 0.1); } .caseWrapper.scrolled .animation-fade[data-load=true] { opacity: 1; -ms-transform: scale(1, ); transform: scale(1, ); -webkit-transform: scale(1, ); -moz-transform: scale(1, ); -o-transform: scale(1, ); } .caseWrapper .animation-graph { opacity: 0; -ms-transform: translate(0, 300px); transform: translate(0, 300px); -webkit-transform: translate(0, 300px); -moz-transform: translate(0, 300px); -o-transform: translate(0, 300px); transition: all 0.6s ease-in-out; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; } .caseWrapper .animation-graph[data-load=true] { opacity: 1; -ms-transform: translate(0, 0); transform: translate(0, 0); -webkit-transform: translate(0, 0); -moz-transform: translate(0, 0); -o-transform: translate(0, 0); transition: all 1s ease-in-out; -webkit-transition: all 1s ease-in-out; -moz-transition: all 1s ease-in-out; -o-transition: all 1s ease-in-out; } /* End */ /* /local/templates/.default/assets/css/libs/swiper-bundle.min.css?175309091518454 */ /* /local/templates/.default/assets/css/libs/spotlight.min.css?176647810813901 */ /* /local/templates/.default/assets/css/style.css?1791554123106004 */ /* /local/templates/.default/assets/css/blog-event-pages.css?178703583434983 */ /* /include/cases/stomexpert-ddos/style.css?174498015459657 */