/* Start:/local/templates/DNT_digital/assets/css/libs/swiper.bundle.min.css?176355821018459*/ /** * Swiper 11.1.14 * Most modern mobile touch slider and framework with hardware accelerated transitions * https://swiperjs.com * * Copyright 2014-2024 Vladimir Kharlampidi * * Released under the MIT License * * Released on: September 12, 2024 */ @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/DNT_digital/assets/css/libs/st_style.css?176355821094540*/ :root { --font-size: 10px; --font-weight: var(--fw-normal); --display: initial; --margin-top: 0; --margin-bottom: 0; --padding-top: 0; --padding-bottom: 0; --space-step: 2.5px; --space-start: 0rem; --space-0: calc(0 * var(--space-step) + var(--space-start)); --space-1: calc(1 * var(--space-step) + var(--space-start)); --space-2: calc(2 * var(--space-step) + var(--space-start)); --space-3: calc(3 * var(--space-step) + var(--space-start)); --space-4: calc(4 * var(--space-step) + var(--space-start)); --space-5: calc(5 * var(--space-step) + var(--space-start)); --space-6: calc(6 * var(--space-step) + var(--space-start)); --space-7: calc(7 * var(--space-step) + var(--space-start)); --space-8: calc(8 * var(--space-step) + var(--space-start)); --space-9: calc(9 * var(--space-step) + var(--space-start)); --space-10: calc(10 * var(--space-step) + var(--space-start)); --space-11: calc(11 * var(--space-step) + var(--space-start)); --space-12: calc(12 * var(--space-step) + var(--space-start)); --space-13: calc(13 * var(--space-step) + var(--space-start)); --space-14: calc(14 * var(--space-step) + var(--space-start)); --space-15: calc(15 * var(--space-step) + var(--space-start)); --space-16: calc(16 * var(--space-step) + var(--space-start)); --space-17: calc(17 * var(--space-step) + var(--space-start)); --space-18: calc(18 * var(--space-step) + var(--space-start)); --space-19: calc(19 * var(--space-step) + var(--space-start)); --space-20: calc(20 * var(--space-step) + var(--space-start)); --space-21: calc(21 * var(--space-step) + var(--space-start)); --space-22: calc(22 * var(--space-step) + var(--space-start)); --space-23: calc(23 * var(--space-step) + var(--space-start)); --space-24: calc(24 * var(--space-step) + var(--space-start)); --space-25: calc(25 * var(--space-step) + var(--space-start)); --fs-h1: 3.2rem; --fs-h2: 2.4rem; --fs-h3: 2rem; --fs-h4: 1.8rem; --fs-h5: 1.6rem; --fs-h6: 1.4rem; --fs-p: 1.2rem; --fw-thin: 100; --fw-extralight: 200; --fw-light: 300; --fw-normal: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --fw-extrabold: 800; --fw-black: 900; --xs-min: 0px; --sm-min: 375px; --md-min: 768px; --lp-min: 1024px; --lg-min: 1280px; --dt-min: 1536px; --xl-min: 1920px; --xs-max: calc(var(--sm-min) - 0.02px); --sm-max: calc(var(--md-min) - 0.02px); --md-max: calc(var(--lp-min) - 0.02px); --lp-max: calc(var(--lg-min) - 0.02px); --lg-max: calc(var(--dt-min) - 0.02px); --dt-max: calc(var(--xl-min) - 0.02px); --xl-max: 100vw; } *[fs] { font-size: var(--font-size) !important } *[fs="h1"] { --font-size: var(--fs-h1) } *[fs="h2"] { --font-size: var(--fs-h2) } *[fs="h3"] { --font-size: var(--fs-h3) } *[fs="h4"] { --font-size: var(--fs-h4) } *[fs="h5"] { --font-size: var(--fs-h5) } *[fs="h6"] { --font-size: var(--fs-h6) } *[fs="p"] { --font-size: var(--fs-p) } *[fw] { font-weight: var(--font-weight) !important } *[fw="thin"] { --font-weight: var(--fw-thin) } *[fw="extralight"] { --font-weight: var(--fw-extralight) } *[fw="light"] { --font-weight: var(--fw-light) } *[fw="normal"] { --font-weight: var(--fw-normal) } *[fw="medium"] { --font-weight: var(--fw-medium) } *[fw="semibold"] { --font-weight: var(--fw-semibold) } *[fw="bold"] { --font-weight: var(--fw-bold) } *[fw="extrabold"] { --font-weight: var(--fw-extrabold) } *[fw="black"] { --font-weight: var(--fw-black) } *[m], *[mt], *[mb] { --margin-top: 0; --margin-bottom: 0 } /* margin-y */ *[m~="0"], *[m~="xs-0"] { --margin-top: var(--space-0); --margin-bottom: var(--space-0) } *[m~="1"], *[m~="xs-1"] { --margin-top: var(--space-1); --margin-bottom: var(--space-1) } *[m~="2"], *[m~="xs-2"] { --margin-top: var(--space-2); --margin-bottom: var(--space-2) } *[m~="3"], *[m~="xs-3"] { --margin-top: var(--space-3); --margin-bottom: var(--space-3) } *[m~="4"], *[m~="xs-4"] { --margin-top: var(--space-4); --margin-bottom: var(--space-4) } *[m~="5"], *[m~="xs-5"] { --margin-top: var(--space-5); --margin-bottom: var(--space-5) } *[m~="6"], *[m~="xs-6"] { --margin-top: var(--space-6); --margin-bottom: var(--space-6) } *[m~="7"], *[m~="xs-7"] { --margin-top: var(--space-7); --margin-bottom: var(--space-7) } *[m~="8"], *[m~="xs-8"] { --margin-top: var(--space-8); --margin-bottom: var(--space-8) } *[m~="9"], *[m~="xs-9"] { --margin-top: var(--space-9); --margin-bottom: var(--space-9) } *[m~="10"], *[m~="xs-10"] { --margin-top: var(--space-10); --margin-bottom: var(--space-10) } *[m~="11"], *[m~="xs-11"] { --margin-top: var(--space-11); --margin-bottom: var(--space-11) } *[m~="12"], *[m~="xs-12"] { --margin-top: var(--space-12); --margin-bottom: var(--space-12) } *[m~="13"], *[m~="xs-13"] { --margin-top: var(--space-13); --margin-bottom: var(--space-13) } *[m~="14"], *[m~="xs-14"] { --margin-top: var(--space-14); --margin-bottom: var(--space-14) } *[m~="15"], *[m~="xs-15"] { --margin-top: var(--space-15); --margin-bottom: var(--space-15) } *[m~="16"], *[m~="xs-16"] { --margin-top: var(--space-16); --margin-bottom: var(--space-16) } *[m~="17"], *[m~="xs-17"] { --margin-top: var(--space-17); --margin-bottom: var(--space-17) } *[m~="18"], *[m~="xs-18"] { --margin-top: var(--space-18); --margin-bottom: var(--space-18) } *[m~="19"], *[m~="xs-19"] { --margin-top: var(--space-19); --margin-bottom: var(--space-19) } *[m~="20"], *[m~="xs-20"] { --margin-top: var(--space-20); --margin-bottom: var(--space-20) } *[m~="21"], *[m~="xs-21"] { --margin-top: var(--space-21); --margin-bottom: var(--space-21) } *[m~="22"], *[m~="xs-22"] { --margin-top: var(--space-22); --margin-bottom: var(--space-22) } *[m~="23"], *[m~="xs-23"] { --margin-top: var(--space-23); --margin-bottom: var(--space-23) } *[m~="24"], *[m~="xs-24"] { --margin-top: var(--space-24); --margin-bottom: var(--space-24) } *[m~="25"], *[m~="xs-25"] { --margin-top: var(--space-25); --margin-bottom: var(--space-25) } /* margin-top */ *[mt~="0"], *[mt~="xs-0"] { --margin-top: var(--space-0) } *[mt~="1"], *[mt~="xs-1"] { --margin-top: var(--space-1) } *[mt~="2"], *[mt~="xs-2"] { --margin-top: var(--space-2) } *[mt~="3"], *[mt~="xs-3"] { --margin-top: var(--space-3) } *[mt~="4"], *[mt~="xs-4"] { --margin-top: var(--space-4) } *[mt~="5"], *[mt~="xs-5"] { --margin-top: var(--space-5) } *[mt~="6"], *[mt~="xs-6"] { --margin-top: var(--space-6) } *[mt~="7"], *[mt~="xs-7"] { --margin-top: var(--space-7) } *[mt~="8"], *[mt~="xs-8"] { --margin-top: var(--space-8) } *[mt~="9"], *[mt~="xs-9"] { --margin-top: var(--space-9) } *[mt~="10"], *[mt~="xs-10"] { --margin-top: var(--space-10) } *[mt~="11"], *[mt~="xs-11"] { --margin-top: var(--space-11) } *[mt~="12"], *[mt~="xs-12"] { --margin-top: var(--space-12) } *[mt~="13"], *[mt~="xs-13"] { --margin-top: var(--space-13) } *[mt~="14"], *[mt~="xs-14"] { --margin-top: var(--space-14) } *[mt~="15"], *[mt~="xs-15"] { --margin-top: var(--space-15) } *[mt~="16"], *[mt~="xs-16"] { --margin-top: var(--space-16) } *[mt~="17"], *[mt~="xs-17"] { --margin-top: var(--space-17) } *[mt~="18"], *[mt~="xs-18"] { --margin-top: var(--space-18) } *[mt~="19"], *[mt~="xs-19"] { --margin-top: var(--space-19) } *[mt~="20"], *[mt~="xs-20"] { --margin-top: var(--space-20) } *[mt~="21"], *[mt~="xs-21"] { --margin-top: var(--space-21) } *[mt~="22"], *[mt~="xs-22"] { --margin-top: var(--space-22) } *[mt~="23"], *[mt~="xs-23"] { --margin-top: var(--space-23) } *[mt~="24"], *[mt~="xs-24"] { --margin-top: var(--space-24) } *[mt~="25"], *[mt~="xs-25"] { --margin-top: var(--space-25) } /* margin-bottom */ *[mb~="0"], *[mb~="xs-0"] { --margin-bottom: var(--space-0) } *[mb~="1"], *[mb~="xs-1"] { --margin-bottom: var(--space-1) } *[mb~="2"], *[mb~="xs-2"] { --margin-bottom: var(--space-2) } *[mb~="3"], *[mb~="xs-3"] { --margin-bottom: var(--space-3) } *[mb~="4"], *[mb~="xs-4"] { --margin-bottom: var(--space-4) } *[mb~="5"], *[mb~="xs-5"] { --margin-bottom: var(--space-5) } *[mb~="6"], *[mb~="xs-6"] { --margin-bottom: var(--space-6) } *[mb~="7"], *[mb~="xs-7"] { --margin-bottom: var(--space-7) } *[mb~="8"], *[mb~="xs-8"] { --margin-bottom: var(--space-8) } *[mb~="9"], *[mb~="xs-9"] { --margin-bottom: var(--space-9) } *[mb~="10"], *[mb~="xs-10"] { --margin-bottom: var(--space-10) } *[mb~="11"], *[mb~="xs-11"] { --margin-bottom: var(--space-11) } *[mb~="12"], *[mb~="xs-12"] { --margin-bottom: var(--space-12) } *[mb~="13"], *[mb~="xs-13"] { --margin-bottom: var(--space-13) } *[mb~="14"], *[mb~="xs-14"] { --margin-bottom: var(--space-14) } *[mb~="15"], *[mb~="xs-15"] { --margin-bottom: var(--space-15) } *[mb~="16"], *[mb~="xs-16"] { --margin-bottom: var(--space-16) } *[mb~="17"], *[mb~="xs-17"] { --margin-bottom: var(--space-17) } *[mb~="18"], *[mb~="xs-18"] { --margin-bottom: var(--space-18) } *[mb~="19"], *[mb~="xs-19"] { --margin-bottom: var(--space-19) } *[mb~="20"], *[mb~="xs-20"] { --margin-bottom: var(--space-20) } *[mb~="21"], *[mb~="xs-21"] { --margin-bottom: var(--space-21) } *[mb~="22"], *[mb~="xs-22"] { --margin-bottom: var(--space-22) } *[mb~="23"], *[mb~="xs-23"] { --margin-bottom: var(--space-23) } *[mb~="24"], *[mb~="xs-24"] { --margin-bottom: var(--space-24) } *[mb~="25"], *[mb~="xs-25"] { --margin-bottom: var(--space-25) } /* sm (≥375px) */ @media (min-width: 375px) { /* margin-y */ *[m~="sm-0"] { --margin-top: var(--space-0); --margin-bottom: var(--space-0) } *[m~="sm-1"] { --margin-top: var(--space-1); --margin-bottom: var(--space-1) } *[m~="sm-2"] { --margin-top: var(--space-2); --margin-bottom: var(--space-2) } *[m~="sm-3"] { --margin-top: var(--space-3); --margin-bottom: var(--space-3) } *[m~="sm-4"] { --margin-top: var(--space-4); --margin-bottom: var(--space-4) } *[m~="sm-5"] { --margin-top: var(--space-5); --margin-bottom: var(--space-5) } *[m~="sm-6"] { --margin-top: var(--space-6); --margin-bottom: var(--space-6) } *[m~="sm-7"] { --margin-top: var(--space-7); --margin-bottom: var(--space-7) } *[m~="sm-8"] { --margin-top: var(--space-8); --margin-bottom: var(--space-8) } *[m~="sm-9"] { --margin-top: var(--space-9); --margin-bottom: var(--space-9) } *[m~="sm-10"] { --margin-top: var(--space-10); --margin-bottom: var(--space-10) } *[m~="sm-11"] { --margin-top: var(--space-11); --margin-bottom: var(--space-11) } *[m~="sm-12"] { --margin-top: var(--space-12); --margin-bottom: var(--space-12) } *[m~="sm-13"] { --margin-top: var(--space-13); --margin-bottom: var(--space-13) } *[m~="sm-14"] { --margin-top: var(--space-14); --margin-bottom: var(--space-14) } *[m~="sm-15"] { --margin-top: var(--space-15); --margin-bottom: var(--space-15) } *[m~="sm-16"] { --margin-top: var(--space-16); --margin-bottom: var(--space-16) } *[m~="sm-17"] { --margin-top: var(--space-17); --margin-bottom: var(--space-17) } *[m~="sm-18"] { --margin-top: var(--space-18); --margin-bottom: var(--space-18) } *[m~="sm-19"] { --margin-top: var(--space-19); --margin-bottom: var(--space-19) } *[m~="sm-20"] { --margin-top: var(--space-20); --margin-bottom: var(--space-20) } *[m~="sm-21"] { --margin-top: var(--space-21); --margin-bottom: var(--space-21) } *[m~="sm-22"] { --margin-top: var(--space-22); --margin-bottom: var(--space-22) } *[m~="sm-23"] { --margin-top: var(--space-23); --margin-bottom: var(--space-23) } *[m~="sm-24"] { --margin-top: var(--space-24); --margin-bottom: var(--space-24) } *[m~="sm-25"] { --margin-top: var(--space-25); --margin-bottom: var(--space-25) } /* margin-top */ *[mt~="sm-0"] { --margin-top: var(--space-0) } *[mt~="sm-1"] { --margin-top: var(--space-1) } *[mt~="sm-2"] { --margin-top: var(--space-2) } *[mt~="sm-3"] { --margin-top: var(--space-3) } *[mt~="sm-4"] { --margin-top: var(--space-4) } *[mt~="sm-5"] { --margin-top: var(--space-5) } *[mt~="sm-6"] { --margin-top: var(--space-6) } *[mt~="sm-7"] { --margin-top: var(--space-7) } *[mt~="sm-8"] { --margin-top: var(--space-8) } *[mt~="sm-9"] { --margin-top: var(--space-9) } *[mt~="sm-10"] { --margin-top: var(--space-10) } *[mt~="sm-11"] { --margin-top: var(--space-11) } *[mt~="sm-12"] { --margin-top: var(--space-12) } *[mt~="sm-13"] { --margin-top: var(--space-13) } *[mt~="sm-14"] { --margin-top: var(--space-14) } *[mt~="sm-15"] { --margin-top: var(--space-15) } *[mt~="sm-16"] { --margin-top: var(--space-16) } *[mt~="sm-17"] { --margin-top: var(--space-17) } *[mt~="sm-18"] { --margin-top: var(--space-18) } *[mt~="sm-19"] { --margin-top: var(--space-19) } *[mt~="sm-20"] { --margin-top: var(--space-20) } *[mt~="sm-21"] { --margin-top: var(--space-21) } *[mt~="sm-22"] { --margin-top: var(--space-22) } *[mt~="sm-23"] { --margin-top: var(--space-23) } *[mt~="sm-24"] { --margin-top: var(--space-24) } *[mt~="sm-25"] { --margin-top: var(--space-25) } /* margin-bottom */ *[mb~="sm-0"] { --margin-bottom: var(--space-0) } *[mb~="sm-1"] { --margin-bottom: var(--space-1) } *[mb~="sm-2"] { --margin-bottom: var(--space-2) } *[mb~="sm-3"] { --margin-bottom: var(--space-3) } *[mb~="sm-4"] { --margin-bottom: var(--space-4) } *[mb~="sm-5"] { --margin-bottom: var(--space-5) } *[mb~="sm-6"] { --margin-bottom: var(--space-6) } *[mb~="sm-7"] { --margin-bottom: var(--space-7) } *[mb~="sm-8"] { --margin-bottom: var(--space-8) } *[mb~="sm-9"] { --margin-bottom: var(--space-9) } *[mb~="sm-10"] { --margin-bottom: var(--space-10) } *[mb~="sm-11"] { --margin-bottom: var(--space-11) } *[mb~="sm-12"] { --margin-bottom: var(--space-12) } *[mb~="sm-13"] { --margin-bottom: var(--space-13) } *[mb~="sm-14"] { --margin-bottom: var(--space-14) } *[mb~="sm-15"] { --margin-bottom: var(--space-15) } *[mb~="sm-16"] { --margin-bottom: var(--space-16) } *[mb~="sm-17"] { --margin-bottom: var(--space-17) } *[mb~="sm-18"] { --margin-bottom: var(--space-18) } *[mb~="sm-19"] { --margin-bottom: var(--space-19) } *[mb~="sm-20"] { --margin-bottom: var(--space-20) } *[mb~="sm-21"] { --margin-bottom: var(--space-21) } *[mb~="sm-22"] { --margin-bottom: var(--space-22) } *[mb~="sm-23"] { --margin-bottom: var(--space-23) } *[mb~="sm-24"] { --margin-bottom: var(--space-24) } *[mb~="sm-25"] { --margin-bottom: var(--space-25) } } /* md (≥768px) */ @media (min-width: 768px) { /* margin-y */ *[m~="md-0"] { --margin-top: var(--space-0); --margin-bottom: var(--space-0) } *[m~="md-1"] { --margin-top: var(--space-1); --margin-bottom: var(--space-1) } *[m~="md-2"] { --margin-top: var(--space-2); --margin-bottom: var(--space-2) } *[m~="md-3"] { --margin-top: var(--space-3); --margin-bottom: var(--space-3) } *[m~="md-4"] { --margin-top: var(--space-4); --margin-bottom: var(--space-4) } *[m~="md-5"] { --margin-top: var(--space-5); --margin-bottom: var(--space-5) } *[m~="md-6"] { --margin-top: var(--space-6); --margin-bottom: var(--space-6) } *[m~="md-7"] { --margin-top: var(--space-7); --margin-bottom: var(--space-7) } *[m~="md-8"] { --margin-top: var(--space-8); --margin-bottom: var(--space-8) } *[m~="md-9"] { --margin-top: var(--space-9); --margin-bottom: var(--space-9) } *[m~="md-10"] { --margin-top: var(--space-10); --margin-bottom: var(--space-10) } *[m~="md-11"] { --margin-top: var(--space-11); --margin-bottom: var(--space-11) } *[m~="md-12"] { --margin-top: var(--space-12); --margin-bottom: var(--space-12) } *[m~="md-13"] { --margin-top: var(--space-13); --margin-bottom: var(--space-13) } *[m~="md-14"] { --margin-top: var(--space-14); --margin-bottom: var(--space-14) } *[m~="md-15"] { --margin-top: var(--space-15); --margin-bottom: var(--space-15) } *[m~="md-16"] { --margin-top: var(--space-16); --margin-bottom: var(--space-16) } *[m~="md-17"] { --margin-top: var(--space-17); --margin-bottom: var(--space-17) } *[m~="md-18"] { --margin-top: var(--space-18); --margin-bottom: var(--space-18) } *[m~="md-19"] { --margin-top: var(--space-19); --margin-bottom: var(--space-19) } *[m~="md-20"] { --margin-top: var(--space-20); --margin-bottom: var(--space-20) } *[m~="md-21"] { --margin-top: var(--space-21); --margin-bottom: var(--space-21) } *[m~="md-22"] { --margin-top: var(--space-22); --margin-bottom: var(--space-22) } *[m~="md-23"] { --margin-top: var(--space-23); --margin-bottom: var(--space-23) } *[m~="md-24"] { --margin-top: var(--space-24); --margin-bottom: var(--space-24) } *[m~="md-25"] { --margin-top: var(--space-25); --margin-bottom: var(--space-25) } /* margin-top */ *[mt~="md-0"] { --margin-top: var(--space-0) } *[mt~="md-1"] { --margin-top: var(--space-1) } *[mt~="md-2"] { --margin-top: var(--space-2) } *[mt~="md-3"] { --margin-top: var(--space-3) } *[mt~="md-4"] { --margin-top: var(--space-4) } *[mt~="md-5"] { --margin-top: var(--space-5) } *[mt~="md-6"] { --margin-top: var(--space-6) } *[mt~="md-7"] { --margin-top: var(--space-7) } *[mt~="md-8"] { --margin-top: var(--space-8) } *[mt~="md-9"] { --margin-top: var(--space-9) } *[mt~="md-10"] { --margin-top: var(--space-10) } *[mt~="md-11"] { --margin-top: var(--space-11) } *[mt~="md-12"] { --margin-top: var(--space-12) } *[mt~="md-13"] { --margin-top: var(--space-13) } *[mt~="md-14"] { --margin-top: var(--space-14) } *[mt~="md-15"] { --margin-top: var(--space-15) } *[mt~="md-16"] { --margin-top: var(--space-16) } *[mt~="md-17"] { --margin-top: var(--space-17) } *[mt~="md-18"] { --margin-top: var(--space-18) } *[mt~="md-19"] { --margin-top: var(--space-19) } *[mt~="md-20"] { --margin-top: var(--space-20) } *[mt~="md-21"] { --margin-top: var(--space-21) } *[mt~="md-22"] { --margin-top: var(--space-22) } *[mt~="md-23"] { --margin-top: var(--space-23) } *[mt~="md-24"] { --margin-top: var(--space-24) } *[mt~="md-25"] { --margin-top: var(--space-25) } /* margin-bottom */ *[mb~="md-0"] { --margin-bottom: var(--space-0) } *[mb~="md-1"] { --margin-bottom: var(--space-1) } *[mb~="md-2"] { --margin-bottom: var(--space-2) } *[mb~="md-3"] { --margin-bottom: var(--space-3) } *[mb~="md-4"] { --margin-bottom: var(--space-4) } *[mb~="md-5"] { --margin-bottom: var(--space-5) } *[mb~="md-6"] { --margin-bottom: var(--space-6) } *[mb~="md-7"] { --margin-bottom: var(--space-7) } *[mb~="md-8"] { --margin-bottom: var(--space-8) } *[mb~="md-9"] { --margin-bottom: var(--space-9) } *[mb~="md-10"] { --margin-bottom: var(--space-10) } *[mb~="md-11"] { --margin-bottom: var(--space-11) } *[mb~="md-12"] { --margin-bottom: var(--space-12) } *[mb~="md-13"] { --margin-bottom: var(--space-13) } *[mb~="md-14"] { --margin-bottom: var(--space-14) } *[mb~="md-15"] { --margin-bottom: var(--space-15) } *[mb~="md-16"] { --margin-bottom: var(--space-16) } *[mb~="md-17"] { --margin-bottom: var(--space-17) } *[mb~="md-18"] { --margin-bottom: var(--space-18) } *[mb~="md-19"] { --margin-bottom: var(--space-19) } *[mb~="md-20"] { --margin-bottom: var(--space-20) } *[mb~="md-21"] { --margin-bottom: var(--space-21) } *[mb~="md-22"] { --margin-bottom: var(--space-22) } *[mb~="md-23"] { --margin-bottom: var(--space-23) } *[mb~="md-24"] { --margin-bottom: var(--space-24) } *[mb~="md-25"] { --margin-bottom: var(--space-25) } } /* lp (≥1024px) */ @media (min-width: 1024px) { /* margin-y */ *[m~="lp-0"] { --margin-top: var(--space-0); --margin-bottom: var(--space-0) } *[m~="lp-1"] { --margin-top: var(--space-1); --margin-bottom: var(--space-1) } *[m~="lp-2"] { --margin-top: var(--space-2); --margin-bottom: var(--space-2) } *[m~="lp-3"] { --margin-top: var(--space-3); --margin-bottom: var(--space-3) } *[m~="lp-4"] { --margin-top: var(--space-4); --margin-bottom: var(--space-4) } *[m~="lp-5"] { --margin-top: var(--space-5); --margin-bottom: var(--space-5) } *[m~="lp-6"] { --margin-top: var(--space-6); --margin-bottom: var(--space-6) } *[m~="lp-7"] { --margin-top: var(--space-7); --margin-bottom: var(--space-7) } *[m~="lp-8"] { --margin-top: var(--space-8); --margin-bottom: var(--space-8) } *[m~="lp-9"] { --margin-top: var(--space-9); --margin-bottom: var(--space-9) } *[m~="lp-10"] { --margin-top: var(--space-10); --margin-bottom: var(--space-10) } *[m~="lp-11"] { --margin-top: var(--space-11); --margin-bottom: var(--space-11) } *[m~="lp-12"] { --margin-top: var(--space-12); --margin-bottom: var(--space-12) } *[m~="lp-13"] { --margin-top: var(--space-13); --margin-bottom: var(--space-13) } *[m~="lp-14"] { --margin-top: var(--space-14); --margin-bottom: var(--space-14) } *[m~="lp-15"] { --margin-top: var(--space-15); --margin-bottom: var(--space-15) } *[m~="lp-16"] { --margin-top: var(--space-16); --margin-bottom: var(--space-16) } *[m~="lp-17"] { --margin-top: var(--space-17); --margin-bottom: var(--space-17) } *[m~="lp-18"] { --margin-top: var(--space-18); --margin-bottom: var(--space-18) } *[m~="lp-19"] { --margin-top: var(--space-19); --margin-bottom: var(--space-19) } *[m~="lp-20"] { --margin-top: var(--space-20); --margin-bottom: var(--space-20) } *[m~="lp-21"] { --margin-top: var(--space-21); --margin-bottom: var(--space-21) } *[m~="lp-22"] { --margin-top: var(--space-22); --margin-bottom: var(--space-22) } *[m~="lp-23"] { --margin-top: var(--space-23); --margin-bottom: var(--space-23) } *[m~="lp-24"] { --margin-top: var(--space-24); --margin-bottom: var(--space-24) } *[m~="lp-25"] { --margin-top: var(--space-25); --margin-bottom: var(--space-25) } /* margin-top */ *[mt~="lp-0"] { --margin-top: var(--space-0) } *[mt~="lp-1"] { --margin-top: var(--space-1) } *[mt~="lp-2"] { --margin-top: var(--space-2) } *[mt~="lp-3"] { --margin-top: var(--space-3) } *[mt~="lp-4"] { --margin-top: var(--space-4) } *[mt~="lp-5"] { --margin-top: var(--space-5) } *[mt~="lp-6"] { --margin-top: var(--space-6) } *[mt~="lp-7"] { --margin-top: var(--space-7) } *[mt~="lp-8"] { --margin-top: var(--space-8) } *[mt~="lp-9"] { --margin-top: var(--space-9) } *[mt~="lp-10"] { --margin-top: var(--space-10) } *[mt~="lp-11"] { --margin-top: var(--space-11) } *[mt~="lp-12"] { --margin-top: var(--space-12) } *[mt~="lp-13"] { --margin-top: var(--space-13) } *[mt~="lp-14"] { --margin-top: var(--space-14) } *[mt~="lp-15"] { --margin-top: var(--space-15) } *[mt~="lp-16"] { --margin-top: var(--space-16) } *[mt~="lp-17"] { --margin-top: var(--space-17) } *[mt~="lp-18"] { --margin-top: var(--space-18) } *[mt~="lp-19"] { --margin-top: var(--space-19) } *[mt~="lp-20"] { --margin-top: var(--space-20) } *[mt~="lp-21"] { --margin-top: var(--space-21) } *[mt~="lp-22"] { --margin-top: var(--space-22) } *[mt~="lp-23"] { --margin-top: var(--space-23) } *[mt~="lp-24"] { --margin-top: var(--space-24) } *[mt~="lp-25"] { --margin-top: var(--space-25) } /* margin-bottom */ *[mb~="lp-0"] { --margin-bottom: var(--space-0) } *[mb~="lp-1"] { --margin-bottom: var(--space-1) } *[mb~="lp-2"] { --margin-bottom: var(--space-2) } *[mb~="lp-3"] { --margin-bottom: var(--space-3) } *[mb~="lp-4"] { --margin-bottom: var(--space-4) } *[mb~="lp-5"] { --margin-bottom: var(--space-5) } *[mb~="lp-6"] { --margin-bottom: var(--space-6) } *[mb~="lp-7"] { --margin-bottom: var(--space-7) } *[mb~="lp-8"] { --margin-bottom: var(--space-8) } *[mb~="lp-9"] { --margin-bottom: var(--space-9) } *[mb~="lp-10"] { --margin-bottom: var(--space-10) } *[mb~="lp-11"] { --margin-bottom: var(--space-11) } *[mb~="lp-12"] { --margin-bottom: var(--space-12) } *[mb~="lp-13"] { --margin-bottom: var(--space-13) } *[mb~="lp-14"] { --margin-bottom: var(--space-14) } *[mb~="lp-15"] { --margin-bottom: var(--space-15) } *[mb~="lp-16"] { --margin-bottom: var(--space-16) } *[mb~="lp-17"] { --margin-bottom: var(--space-17) } *[mb~="lp-18"] { --margin-bottom: var(--space-18) } *[mb~="lp-19"] { --margin-bottom: var(--space-19) } *[mb~="lp-20"] { --margin-bottom: var(--space-20) } *[mb~="lp-21"] { --margin-bottom: var(--space-21) } *[mb~="lp-22"] { --margin-bottom: var(--space-22) } *[mb~="lp-23"] { --margin-bottom: var(--space-23) } *[mb~="lp-24"] { --margin-bottom: var(--space-24) } *[mb~="lp-25"] { --margin-bottom: var(--space-25) } } /* lg (≥1280px) */ @media (min-width: 1280px) { /* margin-y */ *[m~="lg-0"] { --margin-top: var(--space-0); --margin-bottom: var(--space-0) } *[m~="lg-1"] { --margin-top: var(--space-1); --margin-bottom: var(--space-1) } *[m~="lg-2"] { --margin-top: var(--space-2); --margin-bottom: var(--space-2) } *[m~="lg-3"] { --margin-top: var(--space-3); --margin-bottom: var(--space-3) } *[m~="lg-4"] { --margin-top: var(--space-4); --margin-bottom: var(--space-4) } *[m~="lg-5"] { --margin-top: var(--space-5); --margin-bottom: var(--space-5) } *[m~="lg-6"] { --margin-top: var(--space-6); --margin-bottom: var(--space-6) } *[m~="lg-7"] { --margin-top: var(--space-7); --margin-bottom: var(--space-7) } *[m~="lg-8"] { --margin-top: var(--space-8); --margin-bottom: var(--space-8) } *[m~="lg-9"] { --margin-top: var(--space-9); --margin-bottom: var(--space-9) } *[m~="lg-10"] { --margin-top: var(--space-10); --margin-bottom: var(--space-10) } *[m~="lg-11"] { --margin-top: var(--space-11); --margin-bottom: var(--space-11) } *[m~="lg-12"] { --margin-top: var(--space-12); --margin-bottom: var(--space-12) } *[m~="lg-13"] { --margin-top: var(--space-13); --margin-bottom: var(--space-13) } *[m~="lg-14"] { --margin-top: var(--space-14); --margin-bottom: var(--space-14) } *[m~="lg-15"] { --margin-top: var(--space-15); --margin-bottom: var(--space-15) } *[m~="lg-16"] { --margin-top: var(--space-16); --margin-bottom: var(--space-16) } *[m~="lg-17"] { --margin-top: var(--space-17); --margin-bottom: var(--space-17) } *[m~="lg-18"] { --margin-top: var(--space-18); --margin-bottom: var(--space-18) } *[m~="lg-19"] { --margin-top: var(--space-19); --margin-bottom: var(--space-19) } *[m~="lg-20"] { --margin-top: var(--space-20); --margin-bottom: var(--space-20) } *[m~="lg-21"] { --margin-top: var(--space-21); --margin-bottom: var(--space-21) } *[m~="lg-22"] { --margin-top: var(--space-22); --margin-bottom: var(--space-22) } *[m~="lg-23"] { --margin-top: var(--space-23); --margin-bottom: var(--space-23) } *[m~="lg-24"] { --margin-top: var(--space-24); --margin-bottom: var(--space-24) } *[m~="lg-25"] { --margin-top: var(--space-25); --margin-bottom: var(--space-25) } /* margin-top */ *[mt~="lg-0"] { --margin-top: var(--space-0) } *[mt~="lg-1"] { --margin-top: var(--space-1) } *[mt~="lg-2"] { --margin-top: var(--space-2) } *[mt~="lg-3"] { --margin-top: var(--space-3) } *[mt~="lg-4"] { --margin-top: var(--space-4) } *[mt~="lg-5"] { --margin-top: var(--space-5) } *[mt~="lg-6"] { --margin-top: var(--space-6) } *[mt~="lg-7"] { --margin-top: var(--space-7) } *[mt~="lg-8"] { --margin-top: var(--space-8) } *[mt~="lg-9"] { --margin-top: var(--space-9) } *[mt~="lg-10"] { --margin-top: var(--space-10) } *[mt~="lg-11"] { --margin-top: var(--space-11) } *[mt~="lg-12"] { --margin-top: var(--space-12) } *[mt~="lg-13"] { --margin-top: var(--space-13) } *[mt~="lg-14"] { --margin-top: var(--space-14) } *[mt~="lg-15"] { --margin-top: var(--space-15) } *[mt~="lg-16"] { --margin-top: var(--space-16) } *[mt~="lg-17"] { --margin-top: var(--space-17) } *[mt~="lg-18"] { --margin-top: var(--space-18) } *[mt~="lg-19"] { --margin-top: var(--space-19) } *[mt~="lg-20"] { --margin-top: var(--space-20) } *[mt~="lg-21"] { --margin-top: var(--space-21) } *[mt~="lg-22"] { --margin-top: var(--space-22) } *[mt~="lg-23"] { --margin-top: var(--space-23) } *[mt~="lg-24"] { --margin-top: var(--space-24) } *[mt~="lg-25"] { --margin-top: var(--space-25) } /* margin-bottom */ *[mb~="lg-0"] { --margin-bottom: var(--space-0) } *[mb~="lg-1"] { --margin-bottom: var(--space-1) } *[mb~="lg-2"] { --margin-bottom: var(--space-2) } *[mb~="lg-3"] { --margin-bottom: var(--space-3) } *[mb~="lg-4"] { --margin-bottom: var(--space-4) } *[mb~="lg-5"] { --margin-bottom: var(--space-5) } *[mb~="lg-6"] { --margin-bottom: var(--space-6) } *[mb~="lg-7"] { --margin-bottom: var(--space-7) } *[mb~="lg-8"] { --margin-bottom: var(--space-8) } *[mb~="lg-9"] { --margin-bottom: var(--space-9) } *[mb~="lg-10"] { --margin-bottom: var(--space-10) } *[mb~="lg-11"] { --margin-bottom: var(--space-11) } *[mb~="lg-12"] { --margin-bottom: var(--space-12) } *[mb~="lg-13"] { --margin-bottom: var(--space-13) } *[mb~="lg-14"] { --margin-bottom: var(--space-14) } *[mb~="lg-15"] { --margin-bottom: var(--space-15) } *[mb~="lg-16"] { --margin-bottom: var(--space-16) } *[mb~="lg-17"] { --margin-bottom: var(--space-17) } *[mb~="lg-18"] { --margin-bottom: var(--space-18) } *[mb~="lg-19"] { --margin-bottom: var(--space-19) } *[mb~="lg-20"] { --margin-bottom: var(--space-20) } *[mb~="lg-21"] { --margin-bottom: var(--space-21) } *[mb~="lg-22"] { --margin-bottom: var(--space-22) } *[mb~="lg-23"] { --margin-bottom: var(--space-23) } *[mb~="lg-24"] { --margin-bottom: var(--space-24) } *[mb~="lg-25"] { --margin-bottom: var(--space-25) } } /* dt (≥1536px) */ @media (min-width: 1536px) { /* margin-y */ *[m~="dt-0"] { --margin-top: var(--space-0); --margin-bottom: var(--space-0) } *[m~="dt-1"] { --margin-top: var(--space-1); --margin-bottom: var(--space-1) } *[m~="dt-2"] { --margin-top: var(--space-2); --margin-bottom: var(--space-2) } *[m~="dt-3"] { --margin-top: var(--space-3); --margin-bottom: var(--space-3) } *[m~="dt-4"] { --margin-top: var(--space-4); --margin-bottom: var(--space-4) } *[m~="dt-5"] { --margin-top: var(--space-5); --margin-bottom: var(--space-5) } *[m~="dt-6"] { --margin-top: var(--space-6); --margin-bottom: var(--space-6) } *[m~="dt-7"] { --margin-top: var(--space-7); --margin-bottom: var(--space-7) } *[m~="dt-8"] { --margin-top: var(--space-8); --margin-bottom: var(--space-8) } *[m~="dt-9"] { --margin-top: var(--space-9); --margin-bottom: var(--space-9) } *[m~="dt-10"] { --margin-top: var(--space-10); --margin-bottom: var(--space-10) } *[m~="dt-11"] { --margin-top: var(--space-11); --margin-bottom: var(--space-11) } *[m~="dt-12"] { --margin-top: var(--space-12); --margin-bottom: var(--space-12) } *[m~="dt-13"] { --margin-top: var(--space-13); --margin-bottom: var(--space-13) } *[m~="dt-14"] { --margin-top: var(--space-14); --margin-bottom: var(--space-14) } *[m~="dt-15"] { --margin-top: var(--space-15); --margin-bottom: var(--space-15) } *[m~="dt-16"] { --margin-top: var(--space-16); --margin-bottom: var(--space-16) } *[m~="dt-17"] { --margin-top: var(--space-17); --margin-bottom: var(--space-17) } *[m~="dt-18"] { --margin-top: var(--space-18); --margin-bottom: var(--space-18) } *[m~="dt-19"] { --margin-top: var(--space-19); --margin-bottom: var(--space-19) } *[m~="dt-20"] { --margin-top: var(--space-20); --margin-bottom: var(--space-20) } *[m~="dt-21"] { --margin-top: var(--space-21); --margin-bottom: var(--space-21) } *[m~="dt-22"] { --margin-top: var(--space-22); --margin-bottom: var(--space-22) } *[m~="dt-23"] { --margin-top: var(--space-23); --margin-bottom: var(--space-23) } *[m~="dt-24"] { --margin-top: var(--space-24); --margin-bottom: var(--space-24) } *[m~="dt-25"] { --margin-top: var(--space-25); --margin-bottom: var(--space-25) } /* margin-top */ *[mt~="dt-0"] { --margin-top: var(--space-0) } *[mt~="dt-1"] { --margin-top: var(--space-1) } *[mt~="dt-2"] { --margin-top: var(--space-2) } *[mt~="dt-3"] { --margin-top: var(--space-3) } *[mt~="dt-4"] { --margin-top: var(--space-4) } *[mt~="dt-5"] { --margin-top: var(--space-5) } *[mt~="dt-6"] { --margin-top: var(--space-6) } *[mt~="dt-7"] { --margin-top: var(--space-7) } *[mt~="dt-8"] { --margin-top: var(--space-8) } *[mt~="dt-9"] { --margin-top: var(--space-9) } *[mt~="dt-10"] { --margin-top: var(--space-10) } *[mt~="dt-11"] { --margin-top: var(--space-11) } *[mt~="dt-12"] { --margin-top: var(--space-12) } *[mt~="dt-13"] { --margin-top: var(--space-13) } *[mt~="dt-14"] { --margin-top: var(--space-14) } *[mt~="dt-15"] { --margin-top: var(--space-15) } *[mt~="dt-16"] { --margin-top: var(--space-16) } *[mt~="dt-17"] { --margin-top: var(--space-17) } *[mt~="dt-18"] { --margin-top: var(--space-18) } *[mt~="dt-19"] { --margin-top: var(--space-19) } *[mt~="dt-20"] { --margin-top: var(--space-20) } *[mt~="dt-21"] { --margin-top: var(--space-21) } *[mt~="dt-22"] { --margin-top: var(--space-22) } *[mt~="dt-23"] { --margin-top: var(--space-23) } *[mt~="dt-24"] { --margin-top: var(--space-24) } *[mt~="dt-25"] { --margin-top: var(--space-25) } /* margin-bottom */ *[mb~="dt-0"] { --margin-bottom: var(--space-0) } *[mb~="dt-1"] { --margin-bottom: var(--space-1) } *[mb~="dt-2"] { --margin-bottom: var(--space-2) } *[mb~="dt-3"] { --margin-bottom: var(--space-3) } *[mb~="dt-4"] { --margin-bottom: var(--space-4) } *[mb~="dt-5"] { --margin-bottom: var(--space-5) } *[mb~="dt-6"] { --margin-bottom: var(--space-6) } *[mb~="dt-7"] { --margin-bottom: var(--space-7) } *[mb~="dt-8"] { --margin-bottom: var(--space-8) } *[mb~="dt-9"] { --margin-bottom: var(--space-9) } *[mb~="dt-10"] { --margin-bottom: var(--space-10) } *[mb~="dt-11"] { --margin-bottom: var(--space-11) } *[mb~="dt-12"] { --margin-bottom: var(--space-12) } *[mb~="dt-13"] { --margin-bottom: var(--space-13) } *[mb~="dt-14"] { --margin-bottom: var(--space-14) } *[mb~="dt-15"] { --margin-bottom: var(--space-15) } *[mb~="dt-16"] { --margin-bottom: var(--space-16) } *[mb~="dt-17"] { --margin-bottom: var(--space-17) } *[mb~="dt-18"] { --margin-bottom: var(--space-18) } *[mb~="dt-19"] { --margin-bottom: var(--space-19) } *[mb~="dt-20"] { --margin-bottom: var(--space-20) } *[mb~="dt-21"] { --margin-bottom: var(--space-21) } *[mb~="dt-22"] { --margin-bottom: var(--space-22) } *[mb~="dt-23"] { --margin-bottom: var(--space-23) } *[mb~="dt-24"] { --margin-bottom: var(--space-24) } *[mb~="dt-25"] { --margin-bottom: var(--space-25) } } /* xl (≥1920px) */ @media (min-width: 1920px) { /* margin-y */ *[m~="xl-0"] { --margin-top: var(--space-0); --margin-bottom: var(--space-0) } *[m~="xl-1"] { --margin-top: var(--space-1); --margin-bottom: var(--space-1) } *[m~="xl-2"] { --margin-top: var(--space-2); --margin-bottom: var(--space-2) } *[m~="xl-3"] { --margin-top: var(--space-3); --margin-bottom: var(--space-3) } *[m~="xl-4"] { --margin-top: var(--space-4); --margin-bottom: var(--space-4) } *[m~="xl-5"] { --margin-top: var(--space-5); --margin-bottom: var(--space-5) } *[m~="xl-6"] { --margin-top: var(--space-6); --margin-bottom: var(--space-6) } *[m~="xl-7"] { --margin-top: var(--space-7); --margin-bottom: var(--space-7) } *[m~="xl-8"] { --margin-top: var(--space-8); --margin-bottom: var(--space-8) } *[m~="xl-9"] { --margin-top: var(--space-9); --margin-bottom: var(--space-9) } *[m~="xl-10"] { --margin-top: var(--space-10); --margin-bottom: var(--space-10) } *[m~="xl-11"] { --margin-top: var(--space-11); --margin-bottom: var(--space-11) } *[m~="xl-12"] { --margin-top: var(--space-12); --margin-bottom: var(--space-12) } *[m~="xl-13"] { --margin-top: var(--space-13); --margin-bottom: var(--space-13) } *[m~="xl-14"] { --margin-top: var(--space-14); --margin-bottom: var(--space-14) } *[m~="xl-15"] { --margin-top: var(--space-15); --margin-bottom: var(--space-15) } *[m~="xl-16"] { --margin-top: var(--space-16); --margin-bottom: var(--space-16) } *[m~="xl-17"] { --margin-top: var(--space-17); --margin-bottom: var(--space-17) } *[m~="xl-18"] { --margin-top: var(--space-18); --margin-bottom: var(--space-18) } *[m~="xl-19"] { --margin-top: var(--space-19); --margin-bottom: var(--space-19) } *[m~="xl-20"] { --margin-top: var(--space-20); --margin-bottom: var(--space-20) } *[m~="xl-21"] { --margin-top: var(--space-21); --margin-bottom: var(--space-21) } *[m~="xl-22"] { --margin-top: var(--space-22); --margin-bottom: var(--space-22) } *[m~="xl-23"] { --margin-top: var(--space-23); --margin-bottom: var(--space-23) } *[m~="xl-24"] { --margin-top: var(--space-24); --margin-bottom: var(--space-24) } *[m~="xl-25"] { --margin-top: var(--space-25); --margin-bottom: var(--space-25) } /* margin-top */ *[mt~="xl-0"] { --margin-top: var(--space-0) } *[mt~="xl-1"] { --margin-top: var(--space-1) } *[mt~="xl-2"] { --margin-top: var(--space-2) } *[mt~="xl-3"] { --margin-top: var(--space-3) } *[mt~="xl-4"] { --margin-top: var(--space-4) } *[mt~="xl-5"] { --margin-top: var(--space-5) } *[mt~="xl-6"] { --margin-top: var(--space-6) } *[mt~="xl-7"] { --margin-top: var(--space-7) } *[mt~="xl-8"] { --margin-top: var(--space-8) } *[mt~="xl-9"] { --margin-top: var(--space-9) } *[mt~="xl-10"] { --margin-top: var(--space-10) } *[mt~="xl-11"] { --margin-top: var(--space-11) } *[mt~="xl-12"] { --margin-top: var(--space-12) } *[mt~="xl-13"] { --margin-top: var(--space-13) } *[mt~="xl-14"] { --margin-top: var(--space-14) } *[mt~="xl-15"] { --margin-top: var(--space-15) } *[mt~="xl-16"] { --margin-top: var(--space-16) } *[mt~="xl-17"] { --margin-top: var(--space-17) } *[mt~="xl-18"] { --margin-top: var(--space-18) } *[mt~="xl-19"] { --margin-top: var(--space-19) } *[mt~="xl-20"] { --margin-top: var(--space-20) } *[mt~="xl-21"] { --margin-top: var(--space-21) } *[mt~="xl-22"] { --margin-top: var(--space-22) } *[mt~="xl-23"] { --margin-top: var(--space-23) } *[mt~="xl-24"] { --margin-top: var(--space-24) } *[mt~="xl-25"] { --margin-top: var(--space-25) } /* margin-bottom */ *[mb~="xl-0"] { --margin-bottom: var(--space-0) } *[mb~="xl-1"] { --margin-bottom: var(--space-1) } *[mb~="xl-2"] { --margin-bottom: var(--space-2) } *[mb~="xl-3"] { --margin-bottom: var(--space-3) } *[mb~="xl-4"] { --margin-bottom: var(--space-4) } *[mb~="xl-5"] { --margin-bottom: var(--space-5) } *[mb~="xl-6"] { --margin-bottom: var(--space-6) } *[mb~="xl-7"] { --margin-bottom: var(--space-7) } *[mb~="xl-8"] { --margin-bottom: var(--space-8) } *[mb~="xl-9"] { --margin-bottom: var(--space-9) } *[mb~="xl-10"] { --margin-bottom: var(--space-10) } *[mb~="xl-11"] { --margin-bottom: var(--space-11) } *[mb~="xl-12"] { --margin-bottom: var(--space-12) } *[mb~="xl-13"] { --margin-bottom: var(--space-13) } *[mb~="xl-14"] { --margin-bottom: var(--space-14) } *[mb~="xl-15"] { --margin-bottom: var(--space-15) } *[mb~="xl-16"] { --margin-bottom: var(--space-16) } *[mb~="xl-17"] { --margin-bottom: var(--space-17) } *[mb~="xl-18"] { --margin-bottom: var(--space-18) } *[mb~="xl-19"] { --margin-bottom: var(--space-19) } *[mb~="xl-20"] { --margin-bottom: var(--space-20) } *[mb~="xl-21"] { --margin-bottom: var(--space-21) } *[mb~="xl-22"] { --margin-bottom: var(--space-22) } *[mb~="xl-23"] { --margin-bottom: var(--space-23) } *[mb~="xl-24"] { --margin-bottom: var(--space-24) } *[mb~="xl-25"] { --margin-bottom: var(--space-25) } } *[m], *[mt], *[mb] { margin-top: var(--margin-top); margin-bottom: var(--margin-bottom) } *[p], *[pt], *[pb] { --padding-top: 0; --padding-bottom: 0 } /* padding-y */ *[p~="0"], *[p~="xs-0"] { --padding-top: var(--space-0); --padding-bottom: var(--space-0) } *[p~="1"], *[p~="xs-1"] { --padding-top: var(--space-1); --padding-bottom: var(--space-1) } *[p~="2"], *[p~="xs-2"] { --padding-top: var(--space-2); --padding-bottom: var(--space-2) } *[p~="3"], *[p~="xs-3"] { --padding-top: var(--space-3); --padding-bottom: var(--space-3) } *[p~="4"], *[p~="xs-4"] { --padding-top: var(--space-4); --padding-bottom: var(--space-4) } *[p~="5"], *[p~="xs-5"] { --padding-top: var(--space-5); --padding-bottom: var(--space-5) } *[p~="6"], *[p~="xs-6"] { --padding-top: var(--space-6); --padding-bottom: var(--space-6) } *[p~="7"], *[p~="xs-7"] { --padding-top: var(--space-7); --padding-bottom: var(--space-7) } *[p~="8"], *[p~="xs-8"] { --padding-top: var(--space-8); --padding-bottom: var(--space-8) } *[p~="9"], *[p~="xs-9"] { --padding-top: var(--space-9); --padding-bottom: var(--space-9) } *[p~="10"], *[p~="xs-10"] { --padding-top: var(--space-10); --padding-bottom: var(--space-10) } *[p~="11"], *[p~="xs-11"] { --padding-top: var(--space-11); --padding-bottom: var(--space-11) } *[p~="12"], *[p~="xs-12"] { --padding-top: var(--space-12); --padding-bottom: var(--space-12) } *[p~="13"], *[p~="xs-13"] { --padding-top: var(--space-13); --padding-bottom: var(--space-13) } *[p~="14"], *[p~="xs-14"] { --padding-top: var(--space-14); --padding-bottom: var(--space-14) } *[p~="15"], *[p~="xs-15"] { --padding-top: var(--space-15); --padding-bottom: var(--space-15) } *[p~="16"], *[p~="xs-16"] { --padding-top: var(--space-16); --padding-bottom: var(--space-16) } *[p~="17"], *[p~="xs-17"] { --padding-top: var(--space-17); --padding-bottom: var(--space-17) } *[p~="18"], *[p~="xs-18"] { --padding-top: var(--space-18); --padding-bottom: var(--space-18) } *[p~="19"], *[p~="xs-19"] { --padding-top: var(--space-19); --padding-bottom: var(--space-19) } *[p~="20"], *[p~="xs-20"] { --padding-top: var(--space-20); --padding-bottom: var(--space-20) } *[p~="21"], *[p~="xs-21"] { --padding-top: var(--space-21); --padding-bottom: var(--space-21) } *[p~="22"], *[p~="xs-22"] { --padding-top: var(--space-22); --padding-bottom: var(--space-22) } *[p~="23"], *[p~="xs-23"] { --padding-top: var(--space-23); --padding-bottom: var(--space-23) } *[p~="24"], *[p~="xs-24"] { --padding-top: var(--space-24); --padding-bottom: var(--space-24) } *[p~="25"], *[p~="xs-25"] { --padding-top: var(--space-25); --padding-bottom: var(--space-25) } /* padding-top */ *[pt~="0"], *[pt~="xs-0"] { --padding-top: var(--space-0) } *[pt~="1"], *[pt~="xs-1"] { --padding-top: var(--space-1) } *[pt~="2"], *[pt~="xs-2"] { --padding-top: var(--space-2) } *[pt~="3"], *[pt~="xs-3"] { --padding-top: var(--space-3) } *[pt~="4"], *[pt~="xs-4"] { --padding-top: var(--space-4) } *[pt~="5"], *[pt~="xs-5"] { --padding-top: var(--space-5) } *[pt~="6"], *[pt~="xs-6"] { --padding-top: var(--space-6) } *[pt~="7"], *[pt~="xs-7"] { --padding-top: var(--space-7) } *[pt~="8"], *[pt~="xs-8"] { --padding-top: var(--space-8) } *[pt~="9"], *[pt~="xs-9"] { --padding-top: var(--space-9) } *[pt~="10"], *[pt~="xs-10"] { --padding-top: var(--space-10) } *[pt~="11"], *[pt~="xs-11"] { --padding-top: var(--space-11) } *[pt~="12"], *[pt~="xs-12"] { --padding-top: var(--space-12) } *[pt~="13"], *[pt~="xs-13"] { --padding-top: var(--space-13) } *[pt~="14"], *[pt~="xs-14"] { --padding-top: var(--space-14) } *[pt~="15"], *[pt~="xs-15"] { --padding-top: var(--space-15) } *[pt~="16"], *[pt~="xs-16"] { --padding-top: var(--space-16) } *[pt~="17"], *[pt~="xs-17"] { --padding-top: var(--space-17) } *[pt~="18"], *[pt~="xs-18"] { --padding-top: var(--space-18) } *[pt~="19"], *[pt~="xs-19"] { --padding-top: var(--space-19) } *[pt~="20"], *[pt~="xs-20"] { --padding-top: var(--space-20) } *[pt~="21"], *[pt~="xs-21"] { --padding-top: var(--space-21) } *[pt~="22"], *[pt~="xs-22"] { --padding-top: var(--space-22) } *[pt~="23"], *[pt~="xs-23"] { --padding-top: var(--space-23) } *[pt~="24"], *[pt~="xs-24"] { --padding-top: var(--space-24) } *[pt~="25"], *[pt~="xs-25"] { --padding-top: var(--space-25) } /* padding-bottom */ *[pb~="0"], *[pb~="xs-0"] { --padding-bottom: var(--space-0) } *[pb~="1"], *[pb~="xs-1"] { --padding-bottom: var(--space-1) } *[pb~="2"], *[pb~="xs-2"] { --padding-bottom: var(--space-2) } *[pb~="3"], *[pb~="xs-3"] { --padding-bottom: var(--space-3) } *[pb~="4"], *[pb~="xs-4"] { --padding-bottom: var(--space-4) } *[pb~="5"], *[pb~="xs-5"] { --padding-bottom: var(--space-5) } *[pb~="6"], *[pb~="xs-6"] { --padding-bottom: var(--space-6) } *[pb~="7"], *[pb~="xs-7"] { --padding-bottom: var(--space-7) } *[pb~="8"], *[pb~="xs-8"] { --padding-bottom: var(--space-8) } *[pb~="9"], *[pb~="xs-9"] { --padding-bottom: var(--space-9) } *[pb~="10"], *[pb~="xs-10"] { --padding-bottom: var(--space-10) } *[pb~="11"], *[pb~="xs-11"] { --padding-bottom: var(--space-11) } *[pb~="12"], *[pb~="xs-12"] { --padding-bottom: var(--space-12) } *[pb~="13"], *[pb~="xs-13"] { --padding-bottom: var(--space-13) } *[pb~="14"], *[pb~="xs-14"] { --padding-bottom: var(--space-14) } *[pb~="15"], *[pb~="xs-15"] { --padding-bottom: var(--space-15) } *[pb~="16"], *[pb~="xs-16"] { --padding-bottom: var(--space-16) } *[pb~="17"], *[pb~="xs-17"] { --padding-bottom: var(--space-17) } *[pb~="18"], *[pb~="xs-18"] { --padding-bottom: var(--space-18) } *[pb~="19"], *[pb~="xs-19"] { --padding-bottom: var(--space-19) } *[pb~="20"], *[pb~="xs-20"] { --padding-bottom: var(--space-20) } *[pb~="21"], *[pb~="xs-21"] { --padding-bottom: var(--space-21) } *[pb~="22"], *[pb~="xs-22"] { --padding-bottom: var(--space-22) } *[pb~="23"], *[pb~="xs-23"] { --padding-bottom: var(--space-23) } *[pb~="24"], *[pb~="xs-24"] { --padding-bottom: var(--space-24) } *[pb~="25"], *[pb~="xs-25"] { --padding-bottom: var(--space-25) } /* sm (≥375px) */ @media (min-width: 375px) { /* padding-y */ *[p~="sm-0"] { --padding-top: var(--space-0); --padding-bottom: var(--space-0) } *[p~="sm-1"] { --padding-top: var(--space-1); --padding-bottom: var(--space-1) } *[p~="sm-2"] { --padding-top: var(--space-2); --padding-bottom: var(--space-2) } *[p~="sm-3"] { --padding-top: var(--space-3); --padding-bottom: var(--space-3) } *[p~="sm-4"] { --padding-top: var(--space-4); --padding-bottom: var(--space-4) } *[p~="sm-5"] { --padding-top: var(--space-5); --padding-bottom: var(--space-5) } *[p~="sm-6"] { --padding-top: var(--space-6); --padding-bottom: var(--space-6) } *[p~="sm-7"] { --padding-top: var(--space-7); --padding-bottom: var(--space-7) } *[p~="sm-8"] { --padding-top: var(--space-8); --padding-bottom: var(--space-8) } *[p~="sm-9"] { --padding-top: var(--space-9); --padding-bottom: var(--space-9) } *[p~="sm-10"] { --padding-top: var(--space-10); --padding-bottom: var(--space-10) } *[p~="sm-11"] { --padding-top: var(--space-11); --padding-bottom: var(--space-11) } *[p~="sm-12"] { --padding-top: var(--space-12); --padding-bottom: var(--space-12) } *[p~="sm-13"] { --padding-top: var(--space-13); --padding-bottom: var(--space-13) } *[p~="sm-14"] { --padding-top: var(--space-14); --padding-bottom: var(--space-14) } *[p~="sm-15"] { --padding-top: var(--space-15); --padding-bottom: var(--space-15) } *[p~="sm-16"] { --padding-top: var(--space-16); --padding-bottom: var(--space-16) } *[p~="sm-17"] { --padding-top: var(--space-17); --padding-bottom: var(--space-17) } *[p~="sm-18"] { --padding-top: var(--space-18); --padding-bottom: var(--space-18) } *[p~="sm-19"] { --padding-top: var(--space-19); --padding-bottom: var(--space-19) } *[p~="sm-20"] { --padding-top: var(--space-20); --padding-bottom: var(--space-20) } *[p~="sm-21"] { --padding-top: var(--space-21); --padding-bottom: var(--space-21) } *[p~="sm-22"] { --padding-top: var(--space-22); --padding-bottom: var(--space-22) } *[p~="sm-23"] { --padding-top: var(--space-23); --padding-bottom: var(--space-23) } *[p~="sm-24"] { --padding-top: var(--space-24); --padding-bottom: var(--space-24) } *[p~="sm-25"] { --padding-top: var(--space-25); --padding-bottom: var(--space-25) } /* padding-top */ *[pt~="sm-0"] { --padding-top: var(--space-0) } *[pt~="sm-1"] { --padding-top: var(--space-1) } *[pt~="sm-2"] { --padding-top: var(--space-2) } *[pt~="sm-3"] { --padding-top: var(--space-3) } *[pt~="sm-4"] { --padding-top: var(--space-4) } *[pt~="sm-5"] { --padding-top: var(--space-5) } *[pt~="sm-6"] { --padding-top: var(--space-6) } *[pt~="sm-7"] { --padding-top: var(--space-7) } *[pt~="sm-8"] { --padding-top: var(--space-8) } *[pt~="sm-9"] { --padding-top: var(--space-9) } *[pt~="sm-10"] { --padding-top: var(--space-10) } *[pt~="sm-11"] { --padding-top: var(--space-11) } *[pt~="sm-12"] { --padding-top: var(--space-12) } *[pt~="sm-13"] { --padding-top: var(--space-13) } *[pt~="sm-14"] { --padding-top: var(--space-14) } *[pt~="sm-15"] { --padding-top: var(--space-15) } *[pt~="sm-16"] { --padding-top: var(--space-16) } *[pt~="sm-17"] { --padding-top: var(--space-17) } *[pt~="sm-18"] { --padding-top: var(--space-18) } *[pt~="sm-19"] { --padding-top: var(--space-19) } *[pt~="sm-20"] { --padding-top: var(--space-20) } *[pt~="sm-21"] { --padding-top: var(--space-21) } *[pt~="sm-22"] { --padding-top: var(--space-22) } *[pt~="sm-23"] { --padding-top: var(--space-23) } *[pt~="sm-24"] { --padding-top: var(--space-24) } *[pt~="sm-25"] { --padding-top: var(--space-25) } /* padding-bottom */ *[pb~="sm-0"] { --padding-bottom: var(--space-0) } *[pb~="sm-1"] { --padding-bottom: var(--space-1) } *[pb~="sm-2"] { --padding-bottom: var(--space-2) } *[pb~="sm-3"] { --padding-bottom: var(--space-3) } *[pb~="sm-4"] { --padding-bottom: var(--space-4) } *[pb~="sm-5"] { --padding-bottom: var(--space-5) } *[pb~="sm-6"] { --padding-bottom: var(--space-6) } *[pb~="sm-7"] { --padding-bottom: var(--space-7) } *[pb~="sm-8"] { --padding-bottom: var(--space-8) } *[pb~="sm-9"] { --padding-bottom: var(--space-9) } *[pb~="sm-10"] { --padding-bottom: var(--space-10) } *[pb~="sm-11"] { --padding-bottom: var(--space-11) } *[pb~="sm-12"] { --padding-bottom: var(--space-12) } *[pb~="sm-13"] { --padding-bottom: var(--space-13) } *[pb~="sm-14"] { --padding-bottom: var(--space-14) } *[pb~="sm-15"] { --padding-bottom: var(--space-15) } *[pb~="sm-16"] { --padding-bottom: var(--space-16) } *[pb~="sm-17"] { --padding-bottom: var(--space-17) } *[pb~="sm-18"] { --padding-bottom: var(--space-18) } *[pb~="sm-19"] { --padding-bottom: var(--space-19) } *[pb~="sm-20"] { --padding-bottom: var(--space-20) } *[pb~="sm-21"] { --padding-bottom: var(--space-21) } *[pb~="sm-22"] { --padding-bottom: var(--space-22) } *[pb~="sm-23"] { --padding-bottom: var(--space-23) } *[pb~="sm-24"] { --padding-bottom: var(--space-24) } *[pb~="sm-25"] { --padding-bottom: var(--space-25) } } /* md (≥768px) */ @media (min-width: 768px) { /* padding-y */ *[p~="md-0"] { --padding-top: var(--space-0); --padding-bottom: var(--space-0) } *[p~="md-1"] { --padding-top: var(--space-1); --padding-bottom: var(--space-1) } *[p~="md-2"] { --padding-top: var(--space-2); --padding-bottom: var(--space-2) } *[p~="md-3"] { --padding-top: var(--space-3); --padding-bottom: var(--space-3) } *[p~="md-4"] { --padding-top: var(--space-4); --padding-bottom: var(--space-4) } *[p~="md-5"] { --padding-top: var(--space-5); --padding-bottom: var(--space-5) } *[p~="md-6"] { --padding-top: var(--space-6); --padding-bottom: var(--space-6) } *[p~="md-7"] { --padding-top: var(--space-7); --padding-bottom: var(--space-7) } *[p~="md-8"] { --padding-top: var(--space-8); --padding-bottom: var(--space-8) } *[p~="md-9"] { --padding-top: var(--space-9); --padding-bottom: var(--space-9) } *[p~="md-10"] { --padding-top: var(--space-10); --padding-bottom: var(--space-10) } *[p~="md-11"] { --padding-top: var(--space-11); --padding-bottom: var(--space-11) } *[p~="md-12"] { --padding-top: var(--space-12); --padding-bottom: var(--space-12) } *[p~="md-13"] { --padding-top: var(--space-13); --padding-bottom: var(--space-13) } *[p~="md-14"] { --padding-top: var(--space-14); --padding-bottom: var(--space-14) } *[p~="md-15"] { --padding-top: var(--space-15); --padding-bottom: var(--space-15) } *[p~="md-16"] { --padding-top: var(--space-16); --padding-bottom: var(--space-16) } *[p~="md-17"] { --padding-top: var(--space-17); --padding-bottom: var(--space-17) } *[p~="md-18"] { --padding-top: var(--space-18); --padding-bottom: var(--space-18) } *[p~="md-19"] { --padding-top: var(--space-19); --padding-bottom: var(--space-19) } *[p~="md-20"] { --padding-top: var(--space-20); --padding-bottom: var(--space-20) } *[p~="md-21"] { --padding-top: var(--space-21); --padding-bottom: var(--space-21) } *[p~="md-22"] { --padding-top: var(--space-22); --padding-bottom: var(--space-22) } *[p~="md-23"] { --padding-top: var(--space-23); --padding-bottom: var(--space-23) } *[p~="md-24"] { --padding-top: var(--space-24); --padding-bottom: var(--space-24) } *[p~="md-25"] { --padding-top: var(--space-25); --padding-bottom: var(--space-25) } /* padding-top */ *[pt~="md-0"] { --padding-top: var(--space-0) } *[pt~="md-1"] { --padding-top: var(--space-1) } *[pt~="md-2"] { --padding-top: var(--space-2) } *[pt~="md-3"] { --padding-top: var(--space-3) } *[pt~="md-4"] { --padding-top: var(--space-4) } *[pt~="md-5"] { --padding-top: var(--space-5) } *[pt~="md-6"] { --padding-top: var(--space-6) } *[pt~="md-7"] { --padding-top: var(--space-7) } *[pt~="md-8"] { --padding-top: var(--space-8) } *[pt~="md-9"] { --padding-top: var(--space-9) } *[pt~="md-10"] { --padding-top: var(--space-10) } *[pt~="md-11"] { --padding-top: var(--space-11) } *[pt~="md-12"] { --padding-top: var(--space-12) } *[pt~="md-13"] { --padding-top: var(--space-13) } *[pt~="md-14"] { --padding-top: var(--space-14) } *[pt~="md-15"] { --padding-top: var(--space-15) } *[pt~="md-16"] { --padding-top: var(--space-16) } *[pt~="md-17"] { --padding-top: var(--space-17) } *[pt~="md-18"] { --padding-top: var(--space-18) } *[pt~="md-19"] { --padding-top: var(--space-19) } *[pt~="md-20"] { --padding-top: var(--space-20) } *[pt~="md-21"] { --padding-top: var(--space-21) } *[pt~="md-22"] { --padding-top: var(--space-22) } *[pt~="md-23"] { --padding-top: var(--space-23) } *[pt~="md-24"] { --padding-top: var(--space-24) } *[pt~="md-25"] { --padding-top: var(--space-25) } /* padding-bottom */ *[pb~="md-0"] { --padding-bottom: var(--space-0) } *[pb~="md-1"] { --padding-bottom: var(--space-1) } *[pb~="md-2"] { --padding-bottom: var(--space-2) } *[pb~="md-3"] { --padding-bottom: var(--space-3) } *[pb~="md-4"] { --padding-bottom: var(--space-4) } *[pb~="md-5"] { --padding-bottom: var(--space-5) } *[pb~="md-6"] { --padding-bottom: var(--space-6) } *[pb~="md-7"] { --padding-bottom: var(--space-7) } *[pb~="md-8"] { --padding-bottom: var(--space-8) } *[pb~="md-9"] { --padding-bottom: var(--space-9) } *[pb~="md-10"] { --padding-bottom: var(--space-10) } *[pb~="md-11"] { --padding-bottom: var(--space-11) } *[pb~="md-12"] { --padding-bottom: var(--space-12) } *[pb~="md-13"] { --padding-bottom: var(--space-13) } *[pb~="md-14"] { --padding-bottom: var(--space-14) } *[pb~="md-15"] { --padding-bottom: var(--space-15) } *[pb~="md-16"] { --padding-bottom: var(--space-16) } *[pb~="md-17"] { --padding-bottom: var(--space-17) } *[pb~="md-18"] { --padding-bottom: var(--space-18) } *[pb~="md-19"] { --padding-bottom: var(--space-19) } *[pb~="md-20"] { --padding-bottom: var(--space-20) } *[pb~="md-21"] { --padding-bottom: var(--space-21) } *[pb~="md-22"] { --padding-bottom: var(--space-22) } *[pb~="md-23"] { --padding-bottom: var(--space-23) } *[pb~="md-24"] { --padding-bottom: var(--space-24) } *[pb~="md-25"] { --padding-bottom: var(--space-25) } } /* lp (≥1024px) */ @media (min-width: 1024px) { /* padding-y */ *[p~="lp-0"] { --padding-top: var(--space-0); --padding-bottom: var(--space-0) } *[p~="lp-1"] { --padding-top: var(--space-1); --padding-bottom: var(--space-1) } *[p~="lp-2"] { --padding-top: var(--space-2); --padding-bottom: var(--space-2) } *[p~="lp-3"] { --padding-top: var(--space-3); --padding-bottom: var(--space-3) } *[p~="lp-4"] { --padding-top: var(--space-4); --padding-bottom: var(--space-4) } *[p~="lp-5"] { --padding-top: var(--space-5); --padding-bottom: var(--space-5) } *[p~="lp-6"] { --padding-top: var(--space-6); --padding-bottom: var(--space-6) } *[p~="lp-7"] { --padding-top: var(--space-7); --padding-bottom: var(--space-7) } *[p~="lp-8"] { --padding-top: var(--space-8); --padding-bottom: var(--space-8) } *[p~="lp-9"] { --padding-top: var(--space-9); --padding-bottom: var(--space-9) } *[p~="lp-10"] { --padding-top: var(--space-10); --padding-bottom: var(--space-10) } *[p~="lp-11"] { --padding-top: var(--space-11); --padding-bottom: var(--space-11) } *[p~="lp-12"] { --padding-top: var(--space-12); --padding-bottom: var(--space-12) } *[p~="lp-13"] { --padding-top: var(--space-13); --padding-bottom: var(--space-13) } *[p~="lp-14"] { --padding-top: var(--space-14); --padding-bottom: var(--space-14) } *[p~="lp-15"] { --padding-top: var(--space-15); --padding-bottom: var(--space-15) } *[p~="lp-16"] { --padding-top: var(--space-16); --padding-bottom: var(--space-16) } *[p~="lp-17"] { --padding-top: var(--space-17); --padding-bottom: var(--space-17) } *[p~="lp-18"] { --padding-top: var(--space-18); --padding-bottom: var(--space-18) } *[p~="lp-19"] { --padding-top: var(--space-19); --padding-bottom: var(--space-19) } *[p~="lp-20"] { --padding-top: var(--space-20); --padding-bottom: var(--space-20) } *[p~="lp-21"] { --padding-top: var(--space-21); --padding-bottom: var(--space-21) } *[p~="lp-22"] { --padding-top: var(--space-22); --padding-bottom: var(--space-22) } *[p~="lp-23"] { --padding-top: var(--space-23); --padding-bottom: var(--space-23) } *[p~="lp-24"] { --padding-top: var(--space-24); --padding-bottom: var(--space-24) } *[p~="lp-25"] { --padding-top: var(--space-25); --padding-bottom: var(--space-25) } /* padding-top */ *[pt~="lp-0"] { --padding-top: var(--space-0) } *[pt~="lp-1"] { --padding-top: var(--space-1) } *[pt~="lp-2"] { --padding-top: var(--space-2) } *[pt~="lp-3"] { --padding-top: var(--space-3) } *[pt~="lp-4"] { --padding-top: var(--space-4) } *[pt~="lp-5"] { --padding-top: var(--space-5) } *[pt~="lp-6"] { --padding-top: var(--space-6) } *[pt~="lp-7"] { --padding-top: var(--space-7) } *[pt~="lp-8"] { --padding-top: var(--space-8) } *[pt~="lp-9"] { --padding-top: var(--space-9) } *[pt~="lp-10"] { --padding-top: var(--space-10) } *[pt~="lp-11"] { --padding-top: var(--space-11) } *[pt~="lp-12"] { --padding-top: var(--space-12) } *[pt~="lp-13"] { --padding-top: var(--space-13) } *[pt~="lp-14"] { --padding-top: var(--space-14) } *[pt~="lp-15"] { --padding-top: var(--space-15) } *[pt~="lp-16"] { --padding-top: var(--space-16) } *[pt~="lp-17"] { --padding-top: var(--space-17) } *[pt~="lp-18"] { --padding-top: var(--space-18) } *[pt~="lp-19"] { --padding-top: var(--space-19) } *[pt~="lp-20"] { --padding-top: var(--space-20) } *[pt~="lp-21"] { --padding-top: var(--space-21) } *[pt~="lp-22"] { --padding-top: var(--space-22) } *[pt~="lp-23"] { --padding-top: var(--space-23) } *[pt~="lp-24"] { --padding-top: var(--space-24) } *[pt~="lp-25"] { --padding-top: var(--space-25) } /* padding-bottom */ *[pb~="lp-0"] { --padding-bottom: var(--space-0) } *[pb~="lp-1"] { --padding-bottom: var(--space-1) } *[pb~="lp-2"] { --padding-bottom: var(--space-2) } *[pb~="lp-3"] { --padding-bottom: var(--space-3) } *[pb~="lp-4"] { --padding-bottom: var(--space-4) } *[pb~="lp-5"] { --padding-bottom: var(--space-5) } *[pb~="lp-6"] { --padding-bottom: var(--space-6) } *[pb~="lp-7"] { --padding-bottom: var(--space-7) } *[pb~="lp-8"] { --padding-bottom: var(--space-8) } *[pb~="lp-9"] { --padding-bottom: var(--space-9) } *[pb~="lp-10"] { --padding-bottom: var(--space-10) } *[pb~="lp-11"] { --padding-bottom: var(--space-11) } *[pb~="lp-12"] { --padding-bottom: var(--space-12) } *[pb~="lp-13"] { --padding-bottom: var(--space-13) } *[pb~="lp-14"] { --padding-bottom: var(--space-14) } *[pb~="lp-15"] { --padding-bottom: var(--space-15) } *[pb~="lp-16"] { --padding-bottom: var(--space-16) } *[pb~="lp-17"] { --padding-bottom: var(--space-17) } *[pb~="lp-18"] { --padding-bottom: var(--space-18) } *[pb~="lp-19"] { --padding-bottom: var(--space-19) } *[pb~="lp-20"] { --padding-bottom: var(--space-20) } *[pb~="lp-21"] { --padding-bottom: var(--space-21) } *[pb~="lp-22"] { --padding-bottom: var(--space-22) } *[pb~="lp-23"] { --padding-bottom: var(--space-23) } *[pb~="lp-24"] { --padding-bottom: var(--space-24) } *[pb~="lp-25"] { --padding-bottom: var(--space-25) } } /* lg (≥1280px) */ @media (min-width: 1280px) { /* padding-y */ *[p~="lg-0"] { --padding-top: var(--space-0); --padding-bottom: var(--space-0) } *[p~="lg-1"] { --padding-top: var(--space-1); --padding-bottom: var(--space-1) } *[p~="lg-2"] { --padding-top: var(--space-2); --padding-bottom: var(--space-2) } *[p~="lg-3"] { --padding-top: var(--space-3); --padding-bottom: var(--space-3) } *[p~="lg-4"] { --padding-top: var(--space-4); --padding-bottom: var(--space-4) } *[p~="lg-5"] { --padding-top: var(--space-5); --padding-bottom: var(--space-5) } *[p~="lg-6"] { --padding-top: var(--space-6); --padding-bottom: var(--space-6) } *[p~="lg-7"] { --padding-top: var(--space-7); --padding-bottom: var(--space-7) } *[p~="lg-8"] { --padding-top: var(--space-8); --padding-bottom: var(--space-8) } *[p~="lg-9"] { --padding-top: var(--space-9); --padding-bottom: var(--space-9) } *[p~="lg-10"] { --padding-top: var(--space-10); --padding-bottom: var(--space-10) } *[p~="lg-11"] { --padding-top: var(--space-11); --padding-bottom: var(--space-11) } *[p~="lg-12"] { --padding-top: var(--space-12); --padding-bottom: var(--space-12) } *[p~="lg-13"] { --padding-top: var(--space-13); --padding-bottom: var(--space-13) } *[p~="lg-14"] { --padding-top: var(--space-14); --padding-bottom: var(--space-14) } *[p~="lg-15"] { --padding-top: var(--space-15); --padding-bottom: var(--space-15) } *[p~="lg-16"] { --padding-top: var(--space-16); --padding-bottom: var(--space-16) } *[p~="lg-17"] { --padding-top: var(--space-17); --padding-bottom: var(--space-17) } *[p~="lg-18"] { --padding-top: var(--space-18); --padding-bottom: var(--space-18) } *[p~="lg-19"] { --padding-top: var(--space-19); --padding-bottom: var(--space-19) } *[p~="lg-20"] { --padding-top: var(--space-20); --padding-bottom: var(--space-20) } *[p~="lg-21"] { --padding-top: var(--space-21); --padding-bottom: var(--space-21) } *[p~="lg-22"] { --padding-top: var(--space-22); --padding-bottom: var(--space-22) } *[p~="lg-23"] { --padding-top: var(--space-23); --padding-bottom: var(--space-23) } *[p~="lg-24"] { --padding-top: var(--space-24); --padding-bottom: var(--space-24) } *[p~="lg-25"] { --padding-top: var(--space-25); --padding-bottom: var(--space-25) } /* padding-top */ *[pt~="lg-0"] { --padding-top: var(--space-0) } *[pt~="lg-1"] { --padding-top: var(--space-1) } *[pt~="lg-2"] { --padding-top: var(--space-2) } *[pt~="lg-3"] { --padding-top: var(--space-3) } *[pt~="lg-4"] { --padding-top: var(--space-4) } *[pt~="lg-5"] { --padding-top: var(--space-5) } *[pt~="lg-6"] { --padding-top: var(--space-6) } *[pt~="lg-7"] { --padding-top: var(--space-7) } *[pt~="lg-8"] { --padding-top: var(--space-8) } *[pt~="lg-9"] { --padding-top: var(--space-9) } *[pt~="lg-10"] { --padding-top: var(--space-10) } *[pt~="lg-11"] { --padding-top: var(--space-11) } *[pt~="lg-12"] { --padding-top: var(--space-12) } *[pt~="lg-13"] { --padding-top: var(--space-13) } *[pt~="lg-14"] { --padding-top: var(--space-14) } *[pt~="lg-15"] { --padding-top: var(--space-15) } *[pt~="lg-16"] { --padding-top: var(--space-16) } *[pt~="lg-17"] { --padding-top: var(--space-17) } *[pt~="lg-18"] { --padding-top: var(--space-18) } *[pt~="lg-19"] { --padding-top: var(--space-19) } *[pt~="lg-20"] { --padding-top: var(--space-20) } *[pt~="lg-21"] { --padding-top: var(--space-21) } *[pt~="lg-22"] { --padding-top: var(--space-22) } *[pt~="lg-23"] { --padding-top: var(--space-23) } *[pt~="lg-24"] { --padding-top: var(--space-24) } *[pt~="lg-25"] { --padding-top: var(--space-25) } /* padding-bottom */ *[pb~="lg-0"] { --padding-bottom: var(--space-0) } *[pb~="lg-1"] { --padding-bottom: var(--space-1) } *[pb~="lg-2"] { --padding-bottom: var(--space-2) } *[pb~="lg-3"] { --padding-bottom: var(--space-3) } *[pb~="lg-4"] { --padding-bottom: var(--space-4) } *[pb~="lg-5"] { --padding-bottom: var(--space-5) } *[pb~="lg-6"] { --padding-bottom: var(--space-6) } *[pb~="lg-7"] { --padding-bottom: var(--space-7) } *[pb~="lg-8"] { --padding-bottom: var(--space-8) } *[pb~="lg-9"] { --padding-bottom: var(--space-9) } *[pb~="lg-10"] { --padding-bottom: var(--space-10) } *[pb~="lg-11"] { --padding-bottom: var(--space-11) } *[pb~="lg-12"] { --padding-bottom: var(--space-12) } *[pb~="lg-13"] { --padding-bottom: var(--space-13) } *[pb~="lg-14"] { --padding-bottom: var(--space-14) } *[pb~="lg-15"] { --padding-bottom: var(--space-15) } *[pb~="lg-16"] { --padding-bottom: var(--space-16) } *[pb~="lg-17"] { --padding-bottom: var(--space-17) } *[pb~="lg-18"] { --padding-bottom: var(--space-18) } *[pb~="lg-19"] { --padding-bottom: var(--space-19) } *[pb~="lg-20"] { --padding-bottom: var(--space-20) } *[pb~="lg-21"] { --padding-bottom: var(--space-21) } *[pb~="lg-22"] { --padding-bottom: var(--space-22) } *[pb~="lg-23"] { --padding-bottom: var(--space-23) } *[pb~="lg-24"] { --padding-bottom: var(--space-24) } *[pb~="lg-25"] { --padding-bottom: var(--space-25) } } /* dt (≥1536px) */ @media (min-width: 1536px) { /* padding-y */ *[p~="dt-0"] { --padding-top: var(--space-0); --padding-bottom: var(--space-0) } *[p~="dt-1"] { --padding-top: var(--space-1); --padding-bottom: var(--space-1) } *[p~="dt-2"] { --padding-top: var(--space-2); --padding-bottom: var(--space-2) } *[p~="dt-3"] { --padding-top: var(--space-3); --padding-bottom: var(--space-3) } *[p~="dt-4"] { --padding-top: var(--space-4); --padding-bottom: var(--space-4) } *[p~="dt-5"] { --padding-top: var(--space-5); --padding-bottom: var(--space-5) } *[p~="dt-6"] { --padding-top: var(--space-6); --padding-bottom: var(--space-6) } *[p~="dt-7"] { --padding-top: var(--space-7); --padding-bottom: var(--space-7) } *[p~="dt-8"] { --padding-top: var(--space-8); --padding-bottom: var(--space-8) } *[p~="dt-9"] { --padding-top: var(--space-9); --padding-bottom: var(--space-9) } *[p~="dt-10"] { --padding-top: var(--space-10); --padding-bottom: var(--space-10) } *[p~="dt-11"] { --padding-top: var(--space-11); --padding-bottom: var(--space-11) } *[p~="dt-12"] { --padding-top: var(--space-12); --padding-bottom: var(--space-12) } *[p~="dt-13"] { --padding-top: var(--space-13); --padding-bottom: var(--space-13) } *[p~="dt-14"] { --padding-top: var(--space-14); --padding-bottom: var(--space-14) } *[p~="dt-15"] { --padding-top: var(--space-15); --padding-bottom: var(--space-15) } *[p~="dt-16"] { --padding-top: var(--space-16); --padding-bottom: var(--space-16) } *[p~="dt-17"] { --padding-top: var(--space-17); --padding-bottom: var(--space-17) } *[p~="dt-18"] { --padding-top: var(--space-18); --padding-bottom: var(--space-18) } *[p~="dt-19"] { --padding-top: var(--space-19); --padding-bottom: var(--space-19) } *[p~="dt-20"] { --padding-top: var(--space-20); --padding-bottom: var(--space-20) } *[p~="dt-21"] { --padding-top: var(--space-21); --padding-bottom: var(--space-21) } *[p~="dt-22"] { --padding-top: var(--space-22); --padding-bottom: var(--space-22) } *[p~="dt-23"] { --padding-top: var(--space-23); --padding-bottom: var(--space-23) } *[p~="dt-24"] { --padding-top: var(--space-24); --padding-bottom: var(--space-24) } *[p~="dt-25"] { --padding-top: var(--space-25); --padding-bottom: var(--space-25) } /* padding-top */ *[pt~="dt-0"] { --padding-top: var(--space-0) } *[pt~="dt-1"] { --padding-top: var(--space-1) } *[pt~="dt-2"] { --padding-top: var(--space-2) } *[pt~="dt-3"] { --padding-top: var(--space-3) } *[pt~="dt-4"] { --padding-top: var(--space-4) } *[pt~="dt-5"] { --padding-top: var(--space-5) } *[pt~="dt-6"] { --padding-top: var(--space-6) } *[pt~="dt-7"] { --padding-top: var(--space-7) } *[pt~="dt-8"] { --padding-top: var(--space-8) } *[pt~="dt-9"] { --padding-top: var(--space-9) } *[pt~="dt-10"] { --padding-top: var(--space-10) } *[pt~="dt-11"] { --padding-top: var(--space-11) } *[pt~="dt-12"] { --padding-top: var(--space-12) } *[pt~="dt-13"] { --padding-top: var(--space-13) } *[pt~="dt-14"] { --padding-top: var(--space-14) } *[pt~="dt-15"] { --padding-top: var(--space-15) } *[pt~="dt-16"] { --padding-top: var(--space-16) } *[pt~="dt-17"] { --padding-top: var(--space-17) } *[pt~="dt-18"] { --padding-top: var(--space-18) } *[pt~="dt-19"] { --padding-top: var(--space-19) } *[pt~="dt-20"] { --padding-top: var(--space-20) } *[pt~="dt-21"] { --padding-top: var(--space-21) } *[pt~="dt-22"] { --padding-top: var(--space-22) } *[pt~="dt-23"] { --padding-top: var(--space-23) } *[pt~="dt-24"] { --padding-top: var(--space-24) } *[pt~="dt-25"] { --padding-top: var(--space-25) } /* padding-bottom */ *[pb~="dt-0"] { --padding-bottom: var(--space-0) } *[pb~="dt-1"] { --padding-bottom: var(--space-1) } *[pb~="dt-2"] { --padding-bottom: var(--space-2) } *[pb~="dt-3"] { --padding-bottom: var(--space-3) } *[pb~="dt-4"] { --padding-bottom: var(--space-4) } *[pb~="dt-5"] { --padding-bottom: var(--space-5) } *[pb~="dt-6"] { --padding-bottom: var(--space-6) } *[pb~="dt-7"] { --padding-bottom: var(--space-7) } *[pb~="dt-8"] { --padding-bottom: var(--space-8) } *[pb~="dt-9"] { --padding-bottom: var(--space-9) } *[pb~="dt-10"] { --padding-bottom: var(--space-10) } *[pb~="dt-11"] { --padding-bottom: var(--space-11) } *[pb~="dt-12"] { --padding-bottom: var(--space-12) } *[pb~="dt-13"] { --padding-bottom: var(--space-13) } *[pb~="dt-14"] { --padding-bottom: var(--space-14) } *[pb~="dt-15"] { --padding-bottom: var(--space-15) } *[pb~="dt-16"] { --padding-bottom: var(--space-16) } *[pb~="dt-17"] { --padding-bottom: var(--space-17) } *[pb~="dt-18"] { --padding-bottom: var(--space-18) } *[pb~="dt-19"] { --padding-bottom: var(--space-19) } *[pb~="dt-20"] { --padding-bottom: var(--space-20) } *[pb~="dt-21"] { --padding-bottom: var(--space-21) } *[pb~="dt-22"] { --padding-bottom: var(--space-22) } *[pb~="dt-23"] { --padding-bottom: var(--space-23) } *[pb~="dt-24"] { --padding-bottom: var(--space-24) } *[pb~="dt-25"] { --padding-bottom: var(--space-25) } } /* xl (≥1920px) */ @media (min-width: 1920px) { /* padding-y */ *[p~="xl-0"] { --padding-top: var(--space-0); --padding-bottom: var(--space-0) } *[p~="xl-1"] { --padding-top: var(--space-1); --padding-bottom: var(--space-1) } *[p~="xl-2"] { --padding-top: var(--space-2); --padding-bottom: var(--space-2) } *[p~="xl-3"] { --padding-top: var(--space-3); --padding-bottom: var(--space-3) } *[p~="xl-4"] { --padding-top: var(--space-4); --padding-bottom: var(--space-4) } *[p~="xl-5"] { --padding-top: var(--space-5); --padding-bottom: var(--space-5) } *[p~="xl-6"] { --padding-top: var(--space-6); --padding-bottom: var(--space-6) } *[p~="xl-7"] { --padding-top: var(--space-7); --padding-bottom: var(--space-7) } *[p~="xl-8"] { --padding-top: var(--space-8); --padding-bottom: var(--space-8) } *[p~="xl-9"] { --padding-top: var(--space-9); --padding-bottom: var(--space-9) } *[p~="xl-10"] { --padding-top: var(--space-10); --padding-bottom: var(--space-10) } *[p~="xl-11"] { --padding-top: var(--space-11); --padding-bottom: var(--space-11) } *[p~="xl-12"] { --padding-top: var(--space-12); --padding-bottom: var(--space-12) } *[p~="xl-13"] { --padding-top: var(--space-13); --padding-bottom: var(--space-13) } *[p~="xl-14"] { --padding-top: var(--space-14); --padding-bottom: var(--space-14) } *[p~="xl-15"] { --padding-top: var(--space-15); --padding-bottom: var(--space-15) } *[p~="xl-16"] { --padding-top: var(--space-16); --padding-bottom: var(--space-16) } *[p~="xl-17"] { --padding-top: var(--space-17); --padding-bottom: var(--space-17) } *[p~="xl-18"] { --padding-top: var(--space-18); --padding-bottom: var(--space-18) } *[p~="xl-19"] { --padding-top: var(--space-19); --padding-bottom: var(--space-19) } *[p~="xl-20"] { --padding-top: var(--space-20); --padding-bottom: var(--space-20) } *[p~="xl-21"] { --padding-top: var(--space-21); --padding-bottom: var(--space-21) } *[p~="xl-22"] { --padding-top: var(--space-22); --padding-bottom: var(--space-22) } *[p~="xl-23"] { --padding-top: var(--space-23); --padding-bottom: var(--space-23) } *[p~="xl-24"] { --padding-top: var(--space-24); --padding-bottom: var(--space-24) } *[p~="xl-25"] { --padding-top: var(--space-25); --padding-bottom: var(--space-25) } /* padding-top */ *[pt~="xl-0"] { --padding-top: var(--space-0) } *[pt~="xl-1"] { --padding-top: var(--space-1) } *[pt~="xl-2"] { --padding-top: var(--space-2) } *[pt~="xl-3"] { --padding-top: var(--space-3) } *[pt~="xl-4"] { --padding-top: var(--space-4) } *[pt~="xl-5"] { --padding-top: var(--space-5) } *[pt~="xl-6"] { --padding-top: var(--space-6) } *[pt~="xl-7"] { --padding-top: var(--space-7) } *[pt~="xl-8"] { --padding-top: var(--space-8) } *[pt~="xl-9"] { --padding-top: var(--space-9) } *[pt~="xl-10"] { --padding-top: var(--space-10) } *[pt~="xl-11"] { --padding-top: var(--space-11) } *[pt~="xl-12"] { --padding-top: var(--space-12) } *[pt~="xl-13"] { --padding-top: var(--space-13) } *[pt~="xl-14"] { --padding-top: var(--space-14) } *[pt~="xl-15"] { --padding-top: var(--space-15) } *[pt~="xl-16"] { --padding-top: var(--space-16) } *[pt~="xl-17"] { --padding-top: var(--space-17) } *[pt~="xl-18"] { --padding-top: var(--space-18) } *[pt~="xl-19"] { --padding-top: var(--space-19) } *[pt~="xl-20"] { --padding-top: var(--space-20) } *[pt~="xl-21"] { --padding-top: var(--space-21) } *[pt~="xl-22"] { --padding-top: var(--space-22) } *[pt~="xl-23"] { --padding-top: var(--space-23) } *[pt~="xl-24"] { --padding-top: var(--space-24) } *[pt~="xl-25"] { --padding-top: var(--space-25) } /* padding-bottom */ *[pb~="xl-0"] { --padding-bottom: var(--space-0) } *[pb~="xl-1"] { --padding-bottom: var(--space-1) } *[pb~="xl-2"] { --padding-bottom: var(--space-2) } *[pb~="xl-3"] { --padding-bottom: var(--space-3) } *[pb~="xl-4"] { --padding-bottom: var(--space-4) } *[pb~="xl-5"] { --padding-bottom: var(--space-5) } *[pb~="xl-6"] { --padding-bottom: var(--space-6) } *[pb~="xl-7"] { --padding-bottom: var(--space-7) } *[pb~="xl-8"] { --padding-bottom: var(--space-8) } *[pb~="xl-9"] { --padding-bottom: var(--space-9) } *[pb~="xl-10"] { --padding-bottom: var(--space-10) } *[pb~="xl-11"] { --padding-bottom: var(--space-11) } *[pb~="xl-12"] { --padding-bottom: var(--space-12) } *[pb~="xl-13"] { --padding-bottom: var(--space-13) } *[pb~="xl-14"] { --padding-bottom: var(--space-14) } *[pb~="xl-15"] { --padding-bottom: var(--space-15) } *[pb~="xl-16"] { --padding-bottom: var(--space-16) } *[pb~="xl-17"] { --padding-bottom: var(--space-17) } *[pb~="xl-18"] { --padding-bottom: var(--space-18) } *[pb~="xl-19"] { --padding-bottom: var(--space-19) } *[pb~="xl-20"] { --padding-bottom: var(--space-20) } *[pb~="xl-21"] { --padding-bottom: var(--space-21) } *[pb~="xl-22"] { --padding-bottom: var(--space-22) } *[pb~="xl-23"] { --padding-bottom: var(--space-23) } *[pb~="xl-24"] { --padding-bottom: var(--space-24) } *[pb~="xl-25"] { --padding-bottom: var(--space-25) } } *[p], *[pt], *[pb] { padding-top: var(--padding-top); padding-bottom: var(--padding-bottom) } *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; border: 0; font-family: inherit; font-style: inherit; color: inherit; vertical-align: middle; } html { font-size: var(--font-size); width: 100vw; overflow-x: hidden; scroll-behavior: smooth } body { user-select: none; width: 100vw; overflow-x: hidden; font-size: 1.6rem; font-weight: var(--font-weight); line-height: 1; } main, section, .container { position: relative; width: 100%; margin-left: auto; margin-right: auto } picture, video, canvas, svg { display: block; overflow: hidden; max-width: 100%; height: auto; line-height: 0 } img, iframe { width: 100%; height: 100%; object-fit: cover; object-position: center } input, textarea, button { font-size: var(--fs-p) } textarea:focus, input:focus, button:focus { outline: none } label > input, label > textarea { width: 100%; height: 100%; resize: vertical; } label:has(> *[checkbox], *[radio]):has(> input[type="checkbox"], input[type="radio"]) { position: relative; input[type="checkbox"], input[type="radio"] { position: absolute; opacity: 0; width: 1px; height: 1px; bottom: 0; left: 0; pointer-events: none; } *[checkbox], *[radio] { cursor: pointer; position: relative; } span[checkbox], span[radio] { display: inline-block; vertical-align: middle; width: var(--fs-p); height: var(--fs-p); } } button { background: none; border: none } li { list-style: none } hr { border: 0; margin: 0 } *[icon] { display: flex; justify-content: center; align-items: center; box-sizing: content-box; cursor: pointer; position: relative; width: max-content; height: max-content; } *[icon~="square"] { height: auto; aspect-ratio: 1 / 1; } *[icon~="inline"] { display: inline-flex } *[icon] > * { flex: auto } *[icon]::after { content: ''; position: absolute; top: -1rem; left: -1rem; right: -1rem; bottom: -1rem; pointer-events: all; background: rgba(0,0,0,0); z-index: 10; } *[mask] { --mask: ''; --color: #000; mask: var(--mask) no-repeat center / contain; background-color: var(--color); } a, button { cursor: pointer } h1, h2, h3, h4, h5, h6, p { font-weight: inherit; overflow-wrap: break-word } h1 { font-size: var(--fs-h1) } h2 { font-size: var(--fs-h2) } h3 { font-size: var(--fs-h3) } h4 { font-size: var(--fs-h4) } h5 { font-size: var(--fs-h5) } h6 { font-size: var(--fs-h6) } p { font-size: var(--fs-p) } section { max-width: 375px } @media (min-width:375px) { section { max-width: 540px } } @media (min-width:768px) { section { max-width: 720px } } @media (min-width:1024px) { section { max-width: 960px } } @media (min-width:1280px) { section { max-width: 1200px } } @media (min-width:1536px) { section { max-width: 1320px } } @media (min-width:1920px) { section { max-width: 1600px } } *[grid], *[grid~="12"] { --grid-columns: 12; display: grid; grid-template-columns: repeat(var(--grid-columns), 1fr) } *[grid~="10"] { --grid-columns: 10; } *[col] { grid-column: var(--col-start, auto) / span var(--col-span, var(--grid-columns)) } /* xs: >0px */ *[col~="1"], *[col~="xs-1"] { --col-span: 1 } *[col~="2"], *[col~="xs-2"] { --col-span: 2 } *[col~="3"], *[col~="xs-3"] { --col-span: 3 } *[col~="4"], *[col~="xs-4"] { --col-span: 4 } *[col~="5"], *[col~="xs-5"] { --col-span: 5 } *[col~="6"], *[col~="xs-6"] { --col-span: 6 } *[col~="7"], *[col~="xs-7"] { --col-span: 7 } *[col~="8"], *[col~="xs-8"] { --col-span: 8 } *[col~="9"], *[col~="xs-9"] { --col-span: 9 } *[col~="10"], *[col~="xs-10"] { --col-span: 10 } *[col~="11"], *[col~="xs-11"] { --col-span: 11 } *[col~="12"], *[col~="xs-12"] { --col-span: 12 } *[col~="start-1"], *[col~="xs-start-1"] { --col-start: 1 } *[col~="start-2"], *[col~="xs-start-2"] { --col-start: 2 } *[col~="start-3"], *[col~="xs-start-3"] { --col-start: 3 } *[col~="start-4"], *[col~="xs-start-4"] { --col-start: 4 } *[col~="start-5"], *[col~="xs-start-5"] { --col-start: 5 } *[col~="start-6"], *[col~="xs-start-6"] { --col-start: 6 } *[col~="start-7"], *[col~="xs-start-7"] { --col-start: 7 } *[col~="start-8"], *[col~="xs-start-8"] { --col-start: 8 } *[col~="start-9"], *[col~="xs-start-9"] { --col-start: 9 } *[col~="start-10"], *[col~="xs-start-10"] { --col-start: 10 } *[col~="start-11"], *[col~="xs-start-11"] { --col-start: 11 } *[col~="start-12"], *[col~="xs-start-12"] { --col-start: 12 } /* sm (≥375px) */ @media (min-width: 375px) { *[col~="sm-1"] { --col-span: 1 } *[col~="sm-2"] { --col-span: 2 } *[col~="sm-3"] { --col-span: 3 } *[col~="sm-4"] { --col-span: 4 } *[col~="sm-5"] { --col-span: 5 } *[col~="sm-6"] { --col-span: 6 } *[col~="sm-7"] { --col-span: 7 } *[col~="sm-8"] { --col-span: 8 } *[col~="sm-9"] { --col-span: 9 } *[col~="sm-10"] { --col-span: 10 } *[col~="sm-11"] { --col-span: 11 } *[col~="sm-12"] { --col-span: 12 } *[col~="sm-start-1"] { --col-start: 1 } *[col~="sm-start-2"] { --col-start: 2 } *[col~="sm-start-3"] { --col-start: 3 } *[col~="sm-start-4"] { --col-start: 4 } *[col~="sm-start-5"] { --col-start: 5 } *[col~="sm-start-6"] { --col-start: 6 } *[col~="sm-start-7"] { --col-start: 7 } *[col~="sm-start-8"] { --col-start: 8 } *[col~="sm-start-9"] { --col-start: 9 } *[col~="sm-start-10"] { --col-start: 10 } *[col~="sm-start-11"] { --col-start: 11 } *[col~="sm-start-12"] { --col-start: 12 } } /* md (≥768px) */ @media (min-width: 768px) { *[col~="md-1"] { --col-span: 1 } *[col~="md-2"] { --col-span: 2 } *[col~="md-3"] { --col-span: 3 } *[col~="md-4"] { --col-span: 4 } *[col~="md-5"] { --col-span: 5 } *[col~="md-6"] { --col-span: 6 } *[col~="md-7"] { --col-span: 7 } *[col~="md-8"] { --col-span: 8 } *[col~="md-9"] { --col-span: 9 } *[col~="md-10"] { --col-span: 10 } *[col~="md-11"] { --col-span: 11 } *[col~="md-12"] { --col-span: 12 } *[col~="md-start-1"] { --col-start: 1 } *[col~="md-start-2"] { --col-start: 2 } *[col~="md-start-3"] { --col-start: 3 } *[col~="md-start-4"] { --col-start: 4 } *[col~="md-start-5"] { --col-start: 5 } *[col~="md-start-6"] { --col-start: 6 } *[col~="md-start-7"] { --col-start: 7 } *[col~="md-start-8"] { --col-start: 8 } *[col~="md-start-9"] { --col-start: 9 } *[col~="md-start-10"] { --col-start: 10 } *[col~="md-start-11"] { --col-start: 11 } *[col~="md-start-12"] { --col-start: 12 } } /* lp (≥1024px) */ @media (min-width: 1024px) { *[col~="lp-1"] { --col-span: 1 } *[col~="lp-2"] { --col-span: 2 } *[col~="lp-3"] { --col-span: 3 } *[col~="lp-4"] { --col-span: 4 } *[col~="lp-5"] { --col-span: 5 } *[col~="lp-6"] { --col-span: 6 } *[col~="lp-7"] { --col-span: 7 } *[col~="lp-8"] { --col-span: 8 } *[col~="lp-9"] { --col-span: 9 } *[col~="lp-10"] { --col-span: 10 } *[col~="lp-11"] { --col-span: 11 } *[col~="lp-12"] { --col-span: 12 } *[col~="lp-start-1"] { --col-start: 1 } *[col~="lp-start-2"] { --col-start: 2 } *[col~="lp-start-3"] { --col-start: 3 } *[col~="lp-start-4"] { --col-start: 4 } *[col~="lp-start-5"] { --col-start: 5 } *[col~="lp-start-6"] { --col-start: 6 } *[col~="lp-start-7"] { --col-start: 7 } *[col~="lp-start-8"] { --col-start: 8 } *[col~="lp-start-9"] { --col-start: 9 } *[col~="lp-start-10"] { --col-start: 10 } *[col~="lp-start-11"] { --col-start: 11 } *[col~="lp-start-12"] { --col-start: 12 } } /* lg (≥1280px) */ @media (min-width: 1280px) { *[col~="lg-1"] { --col-span: 1 } *[col~="lg-2"] { --col-span: 2 } *[col~="lg-3"] { --col-span: 3 } *[col~="lg-4"] { --col-span: 4 } *[col~="lg-5"] { --col-span: 5 } *[col~="lg-6"] { --col-span: 6 } *[col~="lg-7"] { --col-span: 7 } *[col~="lg-8"] { --col-span: 8 } *[col~="lg-9"] { --col-span: 9 } *[col~="lg-10"] { --col-span: 10 } *[col~="lg-11"] { --col-span: 11 } *[col~="lg-12"] { --col-span: 12 } *[col~="lg-start-1"] { --col-start: 1 } *[col~="lg-start-2"] { --col-start: 2 } *[col~="lg-start-3"] { --col-start: 3 } *[col~="lg-start-4"] { --col-start: 4 } *[col~="lg-start-5"] { --col-start: 5 } *[col~="lg-start-6"] { --col-start: 6 } *[col~="lg-start-7"] { --col-start: 7 } *[col~="lg-start-8"] { --col-start: 8 } *[col~="lg-start-9"] { --col-start: 9 } *[col~="lg-start-10"] { --col-start: 10 } *[col~="lg-start-11"] { --col-start: 11 } *[col~="lg-start-12"] { --col-start: 12 } } /* dt (≥1536px) */ @media (min-width: 1536px) { *[col~="dt-1"] { --col-span: 1 } *[col~="dt-2"] { --col-span: 2 } *[col~="dt-3"] { --col-span: 3 } *[col~="dt-4"] { --col-span: 4 } *[col~="dt-5"] { --col-span: 5 } *[col~="dt-6"] { --col-span: 6 } *[col~="dt-7"] { --col-span: 7 } *[col~="dt-8"] { --col-span: 8 } *[col~="dt-9"] { --col-span: 9 } *[col~="dt-10"] { --col-span: 10 } *[col~="dt-11"] { --col-span: 11 } *[col~="dt-12"] { --col-span: 12 } *[col~="dt-start-1"] { --col-start: 1 } *[col~="dt-start-2"] { --col-start: 2 } *[col~="dt-start-3"] { --col-start: 3 } *[col~="dt-start-4"] { --col-start: 4 } *[col~="dt-start-5"] { --col-start: 5 } *[col~="dt-start-6"] { --col-start: 6 } *[col~="dt-start-7"] { --col-start: 7 } *[col~="dt-start-8"] { --col-start: 8 } *[col~="dt-start-9"] { --col-start: 9 } *[col~="dt-start-10"] { --col-start: 10 } *[col~="dt-start-11"] { --col-start: 11 } *[col~="dt-start-12"] { --col-start: 12 } } /* xl (≥1920px) */ @media (min-width: 1920px) { *[col~="xl-1"] { --col-span: 1 } *[col~="xl-2"] { --col-span: 2 } *[col~="xl-3"] { --col-span: 3 } *[col~="xl-4"] { --col-span: 4 } *[col~="xl-5"] { --col-span: 5 } *[col~="xl-6"] { --col-span: 6 } *[col~="xl-7"] { --col-span: 7 } *[col~="xl-8"] { --col-span: 8 } *[col~="xl-9"] { --col-span: 9 } *[col~="xl-10"] { --col-span: 10 } *[col~="xl-11"] { --col-span: 11 } *[col~="xl-12"] { --col-span: 12 } *[col~="xl-start-1"] { --col-start: 1 } *[col~="xl-start-2"] { --col-start: 2 } *[col~="xl-start-3"] { --col-start: 3 } *[col~="xl-start-4"] { --col-start: 4 } *[col~="xl-start-5"] { --col-start: 5 } *[col~="xl-start-6"] { --col-start: 6 } *[col~="xl-start-7"] { --col-start: 7 } *[col~="xl-start-8"] { --col-start: 8 } *[col~="xl-start-9"] { --col-start: 9 } *[col~="xl-start-10"] { --col-start: 10 } *[col~="xl-start-11"] { --col-start: 11 } *[col~="xl-start-12"] { --col-start: 12 } } *[d] { display: var(--display) !important } /* xs: >0px */ *[d~="none"], *[d~="xs-none"] { --display: none } *[d~="block"], *[d~="xs-block"] { --display: block } *[d~="flex"], *[d~="xs-flex"] { --display: flex } *[d~="grid"], *[d~="xs-grid"] { --display: grid } *[d~="inline"], *[d~="xs-inline"] { --display: inline } /* sm: ≥375px */ @media (min-width: 375px) { *[d~="sm-none"] { --display: none } *[d~="sm-block"] { --display: block } *[d~="sm-flex"] { --display: flex } *[d~="sm-grid"] { --display: grid } *[d~="sm-inline"] { --display: inline } } /* md: ≥768px */ @media (min-width: 768px) { *[d~="md-none"] { --display: none } *[d~="md-block"] { --display: block } *[d~="md-flex"] { --display: flex } *[d~="md-grid"] { --display: grid } *[d~="md-inline"] { --display: inline } } /* lp: ≥1024px */ @media (min-width: 1024px) { *[d~="lp-none"] { --display: none } *[d~="lp-block"] { --display: block } *[d~="lp-flex"] { --display: flex } *[d~="lp-grid"] { --display: grid } *[d~="lp-inline"] { --display: inline } } /* lg: ≥1280px */ @media (min-width: 1280px) { *[d~="lg-none"] { --display: none } *[d~="lg-block"] { --display: block } *[d~="lg-flex"] { --display: flex } *[d~="lg-grid"] { --display: grid } *[d~="lg-inline"] { --display: inline } } /* dt: ≥1536px */ @media (min-width: 1536px) { *[d~="dt-none"] { --display: none } *[d~="dt-block"] { --display: block } *[d~="dt-flex"] { --display: flex } *[d~="dt-grid"] { --display: grid } *[d~="dt-inline"] { --display: inline } } /* xl: ≥1920px */ @media (min-width: 1920px) { *[d~="xl-none"] { --display: none } *[d~="xl-block"] { --display: block } *[d~="xl-flex"] { --display: flex } *[d~="xl-grid"] { --display: grid } *[d~="xl-inline"] { --display: inline } } /* xs-only: 0–374.98px */ @media (max-width: 374.98px) { *[d~="xs-only-none"] { --display: none } *[d~="xs-only-block"] { --display: block } *[d~="xs-only-flex"] { --display: flex } *[d~="xs-only-grid"] { --display: grid } *[d~="xs-only-inline"] { --display: inline } } /* sm-only: 375–767.98px */ @media (min-width: 375px) and (max-width: 767.98px) { *[d~="sm-only-none"] { --display: none } *[d~="sm-only-block"] { --display: block } *[d~="sm-only-flex"] { --display: flex } *[d~="sm-only-grid"] { --display: grid } *[d~="sm-only-inline"] { --display: inline } } /* md-only: 768–1023.98px */ @media (min-width: 768px) and (max-width: 1023.98px) { *[d~="md-none"] { --display: none } *[d~="md-block"] { --display: block } *[d~="md-flex"] { --display: flex } *[d~="md-grid"] { --display: grid } *[d~="md-inline"] { --display: inline } } /* lp-only: 1024–1279.98px */ @media (min-width: 1024px) and (max-width: 1279.98px) { *[d~="lp-only-none"] { --display: none } *[d~="lp-only-block"] { --display: block } *[d~="lp-only-flex"] { --display: flex } *[d~="lp-only-grid"] { --display: grid } *[d~="lp-only-inline"] { --display: inline } } /* lg-only: 1280–1535.98px */ @media (min-width: 1280px) and (max-width: 1535.98px) { *[d~="lg-only-none"] { --display: none } *[d~="lg-only-block"] { --display: block } *[d~="lg-only-flex"] { --display: flex } *[d~="lg-only-grid"] { --display: grid } *[d~="lg-only-inline"] { --display: inline } } /* dt-only: 1536–1919.98px */ @media (min-width: 1536px) and (max-width: 1919.98px) { *[d~="dt-only-none"] { --display: none } *[d~="dt-only-block"] { --display: block } *[d~="dt-only-flex"] { --display: flex } *[d~="dt-only-grid"] { --display: grid } *[d~="dt-only-inline"] { --display: inline } } /* xl-only: 1920px+ */ @media (min-width: 1920px) { *[d~="xl-only-none"] { --display: none } *[d~="xl-only-block"] { --display: block } *[d~="xl-only-flex"] { --display: flex } *[d~="xl-only-grid"] { --display: grid } *[d~="xl-only-inline"] { --display: inline } } .editor { width: 100%; max-width: 100%; margin: 0; padding: 0; h1, h2, h3, h4, h5, h6 { margin: 1.6rem 0 .8rem } p { margin: 0 0 1rem } a { color: blue; text-decoration: underline } strong { font-weight: var(--fw-bold) } em { font-style: italic } b { font-weight: var(--fw-bold) } i { font-style: italic } ul, ol { margin: 0 0 1rem 2rem; padding: 0; list-style-position: inside } li { margin-bottom: .5rem } blockquote { margin: 0 0 1rem; padding-left: 1rem; } hr { border: none; border-top: 1px solid #ccc; margin: 2rem 0 } table { width: 100%; border-collapse: collapse; margin-bottom: 1rem } th, td { padding: .5rem 1rem; border: 1px solid #ccc; text-align: left } iframe { aspect-ratio: 16/9 } pre, code { font-family: monospace; background: #f4f4f4; padding: .25rem .5rem; border-radius: .25rem; overflow-x: auto } pre { margin-bottom: 1rem } sup, sub { vertical-align: baseline; font-size: .8em } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/libs/st_animation.css?176355821018109*/ :root { --transition-duration: var(--td-rapid); --iteration-count: 1; --td-rapid: 0.1s; --td-fast: 0.325s; --td-medium: 0.55s; --td-slow: 0.775s; } *, *::before, *::after { transition: inherit; } /* scale */ *[scale] { --transition-duration: var(--td-medium); --scale-duration: var(--transition-duration); --scale-hover: 1.05; --scale-active: 0.95; will-change: transform; transition-duration: var(--scale-duration); } *[scale~="hover"]:hover { transform: scale(var(--scale-hover)) } *[scale~="active"]:active { transform: scale(var(--scale-active)) } *[scale~="focus"]:focus { transform: scale(var(--scale-active)) } /* rotate */ *[rotate] { --transition-duration: var(--td-medium); --rotate-duration: var(--transition-duration); --rotate-hover: 3deg; --rotate-active: -3deg; will-change: transform; transition-duration: var(--rotate-duration); } *[rotate~="hover"]:hover { transform: rotate(var(--rotate-hover)) } *[rotate~="active"]:active { transform: rotate(var(--rotate-active)) } *[rotate~="focus"]:focus { transform: rotate(var(--rotate-active)) } /* blur */ *[blur] { --transition-duration: var(--td-slow); --blur-duration: var(--transition-duration); --blur-amount: 5px; will-change: blur; filter: blur(var(--blur-amount)) } *[blur]:hover, *[blur]:active, *[blur]:focus { filter: blur(0) } /* shadow */ *[shadow] { --transition-duration: var(--td-medium); --shadow-duration: var(--transition-duration); --shadow-hover-offset: 5px; --shadow-hover-offsetX: var(--shadow-hover-offset); --shadow-hover-offsetY: var(--shadow-hover-offset); --shadow-hover-blur: 10px; --shadow-hover-color: rgba(0, 0, 0, 0.2); --shadow-active-offset: 2px; --shadow-active-offsetX: var(--shadow-hover-offset); --shadow-active-offsetY: var(--shadow-hover-offset); --shadow-active-blur: 8px; --shadow-active-color: rgba(0, 0, 0, 0.3); will-change: box-shadow; transition-duration: var(--shadow-duration); } *[shadow~="hover"]:hover { box-shadow: var(--shadow-hover-offsetX) var(--shadow-hover-offsetY) var(--shadow-hover-blur) var(--shadow-hover-color) } *[shadow~="active"]:active { box-shadow: var(--shadow-active-offsetX) var(--shadow-active-offsetY) var(--shadow-active-blur) var(--shadow-active-color) } *[shadow~="focus"]:focus { box-shadow: var(--shadow-active-offsetX) var(--shadow-active-offsetY) var(--shadow-active-blur) var(--shadow-active-color) } /* st_opacity */ @keyframes st_opacity { 0% { opacity: 1 } 50% { opacity: 0 } 100% { opacity: 1 } } *[st_opacity] { --transition-duration: var(--td-slow); --opacity-duration: var(--transition-duration); --opacity-iteration-count: var(--iteration-count); will-change: opacity; animation: st_opacity var(--opacity-duration) linear var(--opacity-iteration-count) } *[st_opacity~="infinite"] { --opacity-iteration-count: infinite } *[st_opacity~="hover"], *[st_opacity~="active"], *[st_opacity~="focus"] { animation: none } *[st_opacity~="hover"]:hover, *[st_opacity~="active"]:active, *[st_opacity~="focus"]:focus { animation: st_opacity var(--opacity-duration) linear var(--opacity-iteration-count) } /* blink */ @keyframes blink { 50% { opacity: 0 } } *[blink] { --transition-duration: 1s; --blink-duration: var(--transition-duration); --blink-iteration-count: var(--iteration-count); will-change: opacity; animation: blink var(--blink-duration) step-end var(--blink-iteration-count) } *[blink~="infinite"] { --blink-iteration-count: infinite } *[blink~="hover"], *[blink~="active"], *[blink~="focus"] { animation: none } *[blink~="hover"]:hover, *[blink~="active"]:active, *[blink~="focus"]:focus { animation: blink var(--blink-duration) step-end var(--blink-iteration-count) } /* typing-text */ @keyframes typing-text { from { width: 0 } to { width: 100% } } *[typing-text] { --transition-duration: 3s; --typing-duration: var(--transition-duration); --typing-steps: 24; --typing-chars: 10; --typing-color: #000; --typing-width: 2px; will-change: width; position: relative !important; display: inline-block; overflow: hidden; white-space: nowrap; width: 0; min-width: calc(var(--typing-chars) * 1ch); max-width: max-content; animation: typing-text var(--typing-duration) steps(var(--typing-steps), end) forwards; } *[typing-text]::after { will-change: opacity; content: ""; position: absolute; right: 0; top: 0; bottom: 0; display: inline-block; width: var(--typing-width); background: var(--typing-color); animation: blink 1s step-end infinite; } *[typing-text~="hover"], *[typing-text~="active"], *[typing-text~="focus"] { animation-play-state: paused } *[typing-text~="hover"]:hover, *[typing-text~="active"]:active, *[typing-text~="focus"]:focus { animation-play-state: running; } /* pulse */ @keyframes pulse { 0%, 100% { transform: scale(1) } 50% { transform: scale(var(--pulse-scale)) } } *[pulse] { --transition-duration: var(--td-medium); --pulse-duration: var(--transition-duration); --pulse-scale: 1.03; --pulse-iteration-count: var(--iteration-count); will-change: transform; animation: pulse var(--pulse-duration) ease-in-out var(--pulse-iteration-count) } *[pulse~="infinite"] { --pulse-iteration-count: infinite } *[pulse~="hover"], *[pulse~="active"], *[pulse~="focus"] { animation: none } *[pulse~="hover"]:hover, *[pulse~="active"]:active, *[pulse~="focus"]:focus { animation: pulse var(--pulse-duration) ease-in-out var(--pulse-iteration-count) } /* wobble */ @keyframes wobble { 0%, 100% { transform: rotate(0deg) } 25% { transform: rotate(var(--wobble-angle)) } 75% { transform: rotate(calc(-1 * var(--wobble-angle))) } } *[wobble] { --transition-duration: var(--td-fast); --wobble-duration: var(--transition-duration); --wobble-angle: 10deg; --wobble-iteration-count: var(--iteration-count); will-change: transform; animation: wobble var(--wobble-duration) ease-in-out var(--wobble-iteration-count) } *[wobble~="infinite"] { --wobble-iteration-count: infinite } /* поведение: когда указано hover/active/focus — проигрывается только при событии */ *[wobble~="hover"], *[wobble~="active"], *[wobble~="focus"] { animation: none } *[wobble~="hover"]:hover, *[wobble~="active"]:active, *[wobble~="focus"]:focus { animation: wobble var(--wobble-duration) ease-in-out var(--wobble-iteration-count) } /* sheen */ @keyframes sheen { 0% { left: -150% } 100% { left: 150% } } *[sheen] { --transition-duration: var(--td-medium); --sheen-duration: var(--transition-duration); --sheen-color: rgba(255, 255, 255, 0.1); --sheen-width: max(30px, 30%); --sheen-angle: -45deg; --sheen-iteration-count: var(--iteration-count); position: relative; overflow: hidden; } *[sheen]::before { will-change: left; content: ""; position: absolute; top: 0; left: -150%; width: var(--sheen-width); height: 100%; background: linear-gradient(to right, #fff0 0%, var(--sheen-color) 50%, #fff0 100%); transform: skewX(var(--sheen-angle)); pointer-events: none; z-index: 10; animation: sheen var(--sheen-duration) linear var(--sheen-iteration-count) } *[sheen~="infinite"] { --sheen-iteration-count: infinite } *[sheen~="hover"]::before, *[sheen~="active"]::before, *[sheen~="focus"]::before { animation: none } *[sheen~="hover"]:hover::before, *[sheen~="active"]:active::before, *[sheen~="focus"]:focus::before { animation: sheen var(--sheen-duration) linear var(--sheen-iteration-count) } /* vibrate */ @keyframes vibrate { 0% { transform: translate(0, 0) rotate(0); } 10% { transform: translate(var(--vibrate-x), var(--vibrate-y)) rotate(var(--vibrate-rotate)); } 30% { transform: translate(calc(var(--vibrate-x) * -1), var(--vibrate-y)) rotate(calc(var(--vibrate-rotate) * -1)); } 50% { transform: translate(var(--vibrate-x), calc(var(--vibrate-y) * -1)) rotate(var(--vibrate-rotate)); } 70% { transform: translate(calc(var(--vibrate-x) * -1), calc(var(--vibrate-y) * -1)) rotate(calc(var(--vibrate-rotate) * -1)); } 90% { transform: translate(var(--vibrate-x), var(--vibrate-y)) rotate(var(--vibrate-rotate)); } 100% { transform: translate(0, 0) rotate(0); } } *[vibrate] { --transition-duration: var(--td-fast); --vibrate-duration: var(--transition-duration); --vibrate-iteration-count: infinite; --vibrate-x: 2px; --vibrate-y: 1px; --vibrate-rotate: 0.5deg; will-change: transform; animation: vibrate var(--vibrate-duration) linear var(--vibrate-iteration-count); animation-play-state: paused } *[vibrate~="hover"]:hover, *[vibrate~="active"]:active, *[vibrate~="focus"]:focus { animation-play-state: running } *[vibrate~="reverse"] { animation-play-state: running } *[vibrate~="reverse"][vibrate~="hover"]:hover, *[vibrate~="reverse"][vibrate~="hover"]:active, *[vibrate~="reverse"][vibrate~="hover"]:focus { animation-play-state: paused } /* float */ @keyframes floatY { 0%, 100% { transform: translateY(0) } 25% { transform: translateY(var(--float-range)) } 75% { transform: translateY(calc(-1 * var(--float-range))) } } @keyframes floatX { 0%, 100% { transform: translateX(0) } 25% { transform: translateX(var(--float-range)) } 75% { transform: translateX(calc(-1 * var(--float-range))) } } *[float] { --transition-duration: var(--td-slow); --float-duration: var(--transition-duration); --float-iteration-count: var(--iteration-count); --float-range: 6px; will-change: transform; animation: floatY var(--float-duration) ease-in-out var(--float-iteration-count); } *[float~='horizontal'] { animation: floatX var(--float-duration) ease-in-out var(--float-iteration-count); } *[float~="infinite"] { --float-iteration-count: infinite; } *[float~="hover"], *[float~="active"], *[float~="focus"] { animation: none; } *[float~="hover"]:hover, *[float~="active"]:active, *[float~="focus"]:focus { animation: floatY var(--float-duration) ease-in-out var(--float-iteration-count); } *[float~="hover"][float~="horizontal"]:hover, *[float~="active"][float~="horizontal"]:active, *[float~="focus"][float~="horizontal"]:focus { animation: floatX var(--float-duration) ease-in-out var(--float-iteration-count); } /* heartbeat */ @keyframes heartbeat { 0% { transform: scale(1) } 30% { transform: scale(var(--heartbeat-first-scale)) } 60% { transform: scale(var(--heartbeat-second-scale)) } 100% { transform: scale(1) } } *[heartbeat] { --transition-duration: var(--td-slow); --heartbeat-duration: var(--transition-duration); --heartbeat-iteration-count: var(--iteration-count); --heartbeat-first-scale: 1.10; --heartbeat-second-scale: 0.95; will-change: transform; animation: heartbeat var(--heartbeat-duration) cubic-bezier(.4, .0, .2, 1) var(--heartbeat-iteration-count) } *[heartbeat~="infinite"] { --heartbeat-iteration-count: infinite } *[heartbeat~="hover"], *[heartbeat~="active"], *[heartbeat~="focus"] { animation: none } *[heartbeat~="hover"]:hover, *[heartbeat~="active"]:active, *[heartbeat~="focus"]:focus { animation: heartbeat var(--heartbeat-duration) cubic-bezier(.4, .0, .2, 1) var(--heartbeat-iteration-count) } /* jello */ @keyframes jello { 0% { transform: scale3d(1,1,1); } 30% { transform: scale3d(1.25,0.85,1); } 45% { transform: scale3d(0.9,1.05,1); } 60% { transform: scale3d(1.05,0.95,1); } 100% { transform: scale3d(1,1,1); } } *[jello] { --transition-duration: var(--td-medium); --jello-duration: var(--transition-duration); --jello-iteration-count: var(--iteration-count); will-change: transform; animation: jello var(--jello-duration) cubic-bezier(.2,.7,.2,1) var(--jello-iteration-count); } *[jello~="infinite"] { --jello-iteration-count: infinite } *[jello~="hover"], *[jello~="active"], *[jello~="focus"] { animation: none } *[jello~="hover"]:hover, *[jello~="active"]:active, *[jello~="focus"]:focus { animation: jello var(--jello-duration) cubic-bezier(.2,.7,.2,1) var(--jello-iteration-count) } /* ripple */ @keyframes ripple { 0% { transform: translate(-50%,-50%) scale(0); opacity: 0.8; } 60% { transform: translate(-50%,-50%) scale(10); opacity: 0.28; } 100% { transform: translate(-50%,-50%) scale(14); opacity: 0; } } *[ripple] { --transition-duration: var(--td-medium); --ripple-duration: var(--transition-duration); --ripple-color: rgba(255, 255, 255, 0.479); position: relative; overflow: hidden } *[ripple]::after { will-change: transform; content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; background-color: var(--ripple-color); border-radius: 50%; transform: translate(-50%,-50%) scale(0); opacity: 0; pointer-events: none } *[ripple~="active"]:active::after, *[ripple~="hover"]:hover::after, *[ripple~="focus"]:focus::after { animation: ripple var(--ripple-duration) ease-out } /* shimmer-text */ @keyframes shimmer { 0% { background-position: 200% 0 } 100% { background-position: -200% 0 } } *[shimmer-text] { --transition-duration: 2s; --shimmer-duration: var(--transition-duration); --shimmer-color: var(--color, black); --shimmer-size: 100%; --shimmer-iteration-count: var(--iteration-count); will-change: background-position; background: linear-gradient(90deg, transparent calc(50% - var(--shimmer-size)), var(--shimmer-color) 50%, transparent calc(50% + var(--shimmer-size))); background-size: 200% 100%; background-clip: text; animation: shimmer var(--shimmer-duration) linear infinite; } *[shimmer-text]:not([shimmer-text~="active"]):not([shimmer-text~="focus"]) { color: transparent } *[shimmer-text~="hover"] { animation-play-state: paused } *[shimmer-text~="hover"]:hover { animation-play-state: running } *[shimmer-text~="active"], *[shimmer-text~="focus"] { animation: none } *[shimmer-text~="active"]:active, *[shimmer-text~="focus"]:focus { color: transparent; animation: shimmer var(--shimmer-duration) linear infinite } /* underline */ *[underline] { --transition-duration: var(--td-slow); --underline-duration: var(--transition-duration); --underline-color: currentColor; --underline-width: 2px; --underline-offset: 2px; --underline-start: 0%; --underline-direction: center; position: relative } *[underline]::after { will-change: width; content: ""; position: absolute; left: 0; right: 0; margin-left: auto; margin-right: auto; bottom: calc(-1 * var(--underline-offset)); height: var(--underline-width); width: var(--underline-start); background: var(--underline-color); transition: width var(--underline-duration) ease } *[underline~="left"]::after { margin-left: 0 } *[underline~="right"]::after { margin-right: 0 } *[underline~="left"][underline~="right"]::after { margin-left: auto; margin-right: auto; } *[underline]:not([underline~="hover"]):not([underline~="active"]):not([underline~="focus"])::after { width: 100% } *[underline~="hover"]:hover::after, *[underline~="active"]:active::after, *[underline~="focus"]:focus::after { width: 100% } /* spin */ @keyframes spin { to { transform: rotate(360deg) } } *[spin] { --transition-duration: var(--td-slow); --spin-duration: var(--transition-duration); --spin-iteration-count: var(--iteration-count); will-change: transform; animation: spin var(--spin-duration) linear var(--spin-iteration-count); } *[spin~="infinite"] { --spin-iteration-count: infinite } *[spin~="hover"], *[spin~="active"], *[spin~="focus"] { animation: none } *[spin~="hover"]:hover, *[spin~="active"]:active, *[spin~="focus"]:focus { animation: spin var(--spin-duration) linear var(--spin-iteration-count) } /* bounce */ @keyframes bounce { 0%, 100% { transform: translateY(0); animation-timing-function: cubic-bezier(0, 0, 0.2, 1); } 50% { transform: translateY(calc(-1 * var(--bounce-height))); animation-timing-function: cubic-bezier(0.8, 0, 1, 1); } } *[bounce] { --transition-duration: var(--td-medium); --bounce-duration: var(--transition-duration); --bounce-height: 30px; --bounce-iteration-count: var(--iteration-count); will-change: transform; animation: bounce var(--bounce-duration) ease-in-out var(--bounce-iteration-count) } *[bounce~="infinite"] { --bounce-iteration-count: infinite } *[bounce~="hover"], *[bounce~="active"], *[bounce~="focus"] { animation: none } *[bounce~="hover"]:hover, *[bounce~="active"]:active, *[bounce~="focus"]:focus { animation: bounce var(--bounce-duration) ease-in-out var(--bounce-iteration-count) } *[td], *[td]::before, *[td]::after { transition-duration: var(--transition-duration) !important } *[td="rapid"] { --transition-duration: var(--td-rapid) } *[td="fast"] { --transition-duration: var(--td-fast) } *[td="medium"] { --transition-duration: var(--td-medium) } *[td="slow"] { --transition-duration: var(--td-slow) } *[td="1s"] { --transition-duration: 1s } *[td="2s"] { --transition-duration: 2s } *[td="3s"] { --transition-duration: 3s } *[td="5s"] { --transition-duration: 5s } *[td="none"] { --transition-duration: none } *[infinite] { --iteration-count: infinite; } @media (prefers-reduced-motion:reduce) { *[pulse], *[wobble], *[sheen]::before, *[float], *[heartbeat], *[jello], *[ripple]::after, *[shimmer-text], *[shadow-pop], *[vibrate], *[bounce], *[spin] { animation: none !important; transition: none !important } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/root.css?17635582105040*/ html { font-family: 'Circe'; font-style: normal; scroll-behavior: smooth; } main { padding: 0px 18px; } :root { --color_orange: #F15A24; --color_orange__hover: #D14E1E; --color_orange__active: #B9451A; --color_violet: #542D8C; --color_violet__hover: #452472; --color_violet__active: #381e5e; --color_violet__disabled: #B4ABC7; --color_violet__pale: rgba(84, 45, 140, 0.1); --mask: url(/local/templates/DNT_digital/assets/css/); } *[underline] { --underline-offset: -3px; } #panel { transition: unset; * { transition: unset } } h2 { font-weight: var(--fw-extrabold); font-size: 4rem; } h3 { font-size: 2rem; line-height: 1.5; } .color_orange { --color: var(--color_orange); color: var(--color_orange); } .color_violet { --color: var(--color_violet); color: var(--color_violet); } .color_violet__pale { color: var(--color_violet__pale); * {color: var(--color_violet__pale) } } .color_violet__disabled { color: var(--color_violet__disabled); * {color: var(--color_violet__disabled);} } .right { text-align: end; } .button { transition: 180ms cubic-bezier(.2,.8,.2,1); border-radius: 20px; font-weight: var(--fw-extrabold); font-size: 2rem; line-height: 1.5; } blockquote { position: relative; padding-left: 1rem; font-weight: var(--fw-light); font-size: 1.2rem; line-height: 1.5; color: #000000; } blockquote::before { content: ''; position: absolute; left: 0; top: 50%; height: calc(100% - 1rem); transform: translateY(-50%); width: 2px; background-color: var(--color_orange); } .button--wide { width: 100%; --sheen-color: rgba(255, 255, 255, 0.1); --sheen-width: max(30px, 30%); --sheen-angle: -45deg; --sheen-duration: 3s; --sheen-iteration-count: infinite; position: relative; overflow: hidden; } .button--small { font-size: var(--fs-p); line-height: 1; padding: 1rem; } .button--wide::before { will-change: left; content: ""; position: absolute; top: 0; left: -150%; width: var(--sheen-width); height: 100%; background: linear-gradient(to right, #fff0 0%, var(--sheen-color) 50%, #fff0 100%); transform: skewX(var(--sheen-angle)); pointer-events: none; z-index: 10; animation: sheen var(--sheen-duration) linear var(--sheen-iteration-count) } .button--orange { background: var(--color_orange); color: #FFFFFF; } .button--orange:hover { background: var(--color_orange__hover); transform: translateY(-2px); } .button--orange:active { background: var(--color_orange__active); transform: translateY(0); } .button--violet { background: var(--color_violet); color: #FFFFFF; } .button--violet:hover { background: var(--color_violet__hover); transform: translateY(-2px); } .button--violet:active { background: var(--color_violet__active); transform: translateY(0); } .button--violet:disabled { background: var(--color_violet__disabled) !important; } .editor { font-size: 1.2rem; p, h2, h3, h4, h5, h6, a { color: var(--color_violet); } table.violet_table { --border-radius: 20px; --border-width: 2px; width: 100%; border-collapse: separate; border-spacing: 0; border-radius: var(--border-radius); overflow: hidden; border: var(--border-width) solid var(--color_violet__disabled); table-layout: fixed; background: #fff; th, td { border: none; font-size: 1rem; text-align: center; vertical-align: middle; } thead th, tbody td.left { background: var(--color_violet__pale); color: var(--color_violet); font-weight: var(--fw-bold); border-bottom: var(--border-width) solid var(--color_violet__disabled); border-right: var(--border-width) solid var(--color_violet__disabled); } tbody td { border-bottom: var(--border-width) solid var(--color_violet__disabled); border-right: var(--border-width) solid var(--color_violet__disabled); font-weight: var(--fw-light); color: #000; padding: 3px 0px; background: #fff; } thead th:first-child { border-top-left-radius: calc(var(--border-radius) - 2px) } thead th:last-child { border-top-right-radius: calc(var(--border-radius) - 2px) } thead th:last-child, tbody td:last-child { border-right: none } tbody tr:last-child td { border-bottom: none } tbody tr:last-child td:first-child { border-bottom-left-radius: calc(var(--border-radius) - 2px) } tbody tr:last-child td:last-child { border-bottom-right-radius: calc(var(--border-radius) - 2px) } } } img.orange { filter: brightness(0) saturate(100%) invert(41%) sepia(50%) saturate(1616%) hue-rotate(344deg) brightness(96%) contrast(97%); } /* End */ /* Start:/local/templates/DNT_digital/assets/css/header.css?17635582101476*/ header { margin-top: 64px; .header-mobile { position: fixed; top: 0; display: block; padding: 20px 18px; width: 100%; background-color: white; z-index: 1000; } .header-mobile__top { display: flex; justify-content: space-between; align-items: start; *[icon] { width: 20px; } } .menu__list { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 24px; .menu__item { list-style: none; text-decoration: none; font-size: 2rem; color: var(--color_violet); font-weight: var(--fw-bold); a {text-decoration: none;} } .menu__item:hover a, .menu__item.active a { margin-left: 1rem; } .menu__item.active { list-style: initial; } } .header-mobile__menu { overflow: hidden; max-height: 100vh } .header-mobile[expanded="false"] { .header-mobile__top .menu_button_close { display: none !important } .header-mobile__menu { max-height: 0px } } .header-mobile[expanded="true"] { padding-top: 40px; background: rgb(238,234,243); .header-mobile__top { .logo { width: 242px } .menu_button_open { display: none !important } } } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/main.css?176355821012027*/ .section__header { .section__subtitle h3 { * { vertical-align: baseline} margin: var(--space-4) 0; } } .services { gap: 12px; article { --border-radius: 20px; border-radius: var(--border-radius); } article > a { --duration: var(--td-slow); --width: 300px; color: rgb(255 255 255 / 40%); text-decoration: none; position: relative; display: flex; gap: 15px; background: var(--color_violet__pale); border-radius: var(--border-radius); padding: 15px; .services__picture { flex: none; display: flex; justify-content: center; align-items: center; /* animation: none; */ .services__picture--icon { max-width: 80px; *[icon] { width: 60px; } } } .services__arrow { position: absolute; right: 20px; top: 50%; transform: translateY(-50%); } .services__content { overflow: hidden; * { color: var(--color_violet) } .services__content--price { display: flex; align-items: baseline; gap: 10px; p { text-wrap: nowrap; flex: 1; overflow-x: auto; overflow-y: hidden; padding-bottom: 0.25rem; } p::-webkit-scrollbar { height: 0.25rem; position: relative; } p:hover::-webkit-scrollbar { height: 0.75rem; } p::-webkit-scrollbar-track { background: transparent; } p::-webkit-scrollbar-thumb { background-color: var(--color_violet__disabled); border-radius: 10px; } } } } article:hover, article:focus { .services__arrow svg { transition-duration: var(--td-fast); width: 10px; } } article:hover .services__picture { animation: pulse var(--pulse-duration) ease-in-out var(--pulse-iteration-count); } } .gallery_container { gap: 12px; } .gallery { --border-radius: 25px; border-radius: var(--border-radius); overflow: visible; position: relative; .swiper-slide { height: 300px; width: 225px; overflow: hidden; border-radius: var(--border-radius); .gallery__picture { border-radius: var(--border-radius); height: 100%; width: 100%; } } .swiper-pagination { bottom: 0; width: max-content; transform: translateY(calc(100% + 5px)); .swiper-pagination-bullet-active { background-color: var(--color_violet); } } } .why_us { gap: 24px; article { position: relative; display: flex; gap: 16px; .why_us__content { display: flex; align-items: center; } .why_us__picture { min-width: 45px; flex: none; display: flex; justify-content: center; align-items: center; .why_us__picture--icon { max-width: 40px; } } } } .services_table__container { row-gap: var(--space-15); } .services_table { .services_table__top { display: flex; align-items: center; gap: 7px; h3 { line-height: 1.2; font-weight: var(--fw-bold) } } table { width: 100%; border-collapse: collapse; * { font-size: 1rem } tr * { font-size: 1.2rem } th, td { border: 1px solid var(--color_violet__pale); vertical-align: middle; min-width: 30px; } td:not(:has(b, strong)) { font-weight: var(--fw-light); * { font-weight: inherit } } tr:first-child th, tr:first-child td { border-top: none; } tr:last-child th, tr:last-child td { border-bottom: none; } tr th:first-child, tr td:first-child { border-left: none; } tr th:last-child, tr td:last-child { border-right: none; } } } .services_icons { article { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 8px; .services_icons__picture--icon { max-width: 80px; *[icon] { width: 70px; } } .services_icons__content { p { font-size: 1.4rem; font-weight: var(--fw-bold); } } } .services_icons__bottom { text-align: center; } } .faq_list { ul { display: flex; flex-direction: column; gap: 6px; } li { list-style: none; padding: 12px 16px; border-radius: 20px; border: 1px solid var(--color_violet__disabled); cursor: pointer; } .faq_list__arrow { position: absolute; right: 0; top: 50%; transform: translate(-100%, -50%) rotate(90deg); path { opacity: 1; stroke: var(--color_violet); } } *[icon] { height: 14px } .faq_list__top { position: relative } .faq_list__top p { font-size: 1.4rem; font-weight: var(--fw-bold); max-width: calc(100% - 25px); } .faq_list__content p { font-size: 1.2rem; font-weight: var(--fw-light); line-height: 1.2; } .faq_list__content { overflow: hidden;} .faq_list__content[expanded="false"] { max-height: 0px; margin: 0; } .faq_list__content[expanded="true"] { max-height: 100vh } li:has(.faq_list__content[expanded="true"]) { border-color: var(--color_orange); .faq_list__arrow { transform: translate(-100%, -50%) rotate(270deg); path { stroke: var(--color_orange); } } } } .contacts { p, a { color: var(--color_violet); font-weight: var(--fw-light); font-size: 1.2rem; line-height: 1.2; text-decoration: none; } .bottom_links { p { color: black; } a { text-decoration: underline; } } h4 { color: var(--color_violet); font-weight: var(--fw-extrabold); font-size: 1.4rem; } .contacts__left, .contacts__right { display: flex; flex-direction: column; gap:20px; } .contacts__right { align-items: end; } .contacts__left--socials { display: flex; gap: 8px; align-items: center; } .contacts__right_inner { width: max-content; } } .contacts__map { display: flex; flex-direction: column; p, a { color: var(--color_violet); font-weight: var(--fw-light); font-size: 1.2rem; line-height: 1.2; text-decoration: none; } h4 { color: var(--color_violet); font-weight: var(--fw-extrabold); font-size: 1.4rem; } .bottom_links { p, a { color: black; line-height: 2; } a { color: var(--color_violet); text-decoration: underline; } } .contacts__map--container { border-radius: 20px; height: 170px; width: 100%; overflow: hidden; } } .section_detail__periods { .section_detail__items--content { display: flex; flex-wrap: wrap; gap: 12px 32px; .section_detail__items--item { font-weight: var(--fw-bold); font-size: 1.4rem; line-height: 1.2; position: relative; --underline-color: var(--color_orange); --underline-duration: var(--td-medium); --underline-offset: 3px; } .section_detail__items--item:not(:last-child)::before { content: ""; position: absolute; right: -19px; top: 0; bottom: 0; width: 2px; background: var(--color_orange); } .section_detail__items--item:hover { padding: 0px 5px; } } .section_detail__periods--content { gap: 8px; .section_detail__periods--item { padding: 8px 13px; border-radius: 20px; background-color: var(--color_violet__pale); display: flex; justify-content: space-between; flex-wrap: wrap; color: var(--color_violet); } .section_detail__periods--item > *:last-child { align-self: flex-end; margin-left: auto; } } } .feedback_form { .feedback_form__title { font-weight: 800; font-size: 2.4rem; } .feedback_form__subtitle { font-weight: var(--fw-light); font-size: 1.4rem; color: #000000; } } .modal .calendar_top { justify-content: center !important; } .calendar_container { display: none; .calendar_top { display: flex; justify-content: center; gap: 20px; .title { font-weight: var(--fw-bold); font-size: 2rem; color: var(--color_violet); } .arrow { display: flex; align-items: center; svg path { stroke: var(--color_violet__disabled) } } } .date__content { display: grid; min-height: 80px; grid-template-rows: 1fr 1fr; * { display: flex; justify-content: center; align-items: center; text-align: center; } } table { border-collapse: collapse; width: 100%; table-layout: fixed; font-weight: var(--fw-bold); th, td { border: 2px solid #d2cddd } .weekday { font-size: 1.2rem; color: var(--color_violet); vertical-align: baseline; } .status_date { font-size: 1.2rem; } .status_text { font-size: 0.9rem; } .past { background: rgba(142, 142, 142, 0.08); color: rgba(157, 157, 157, 1) } .busy { background: #F15A241A; color: #F15A24; cursor: auto !important; } .free { background: #09B3B91A; color: #03585B; cursor: pointer; } .weekend { background: #432C7314 !important; color: #432C73 !important; cursor: pointer; .status_text { color: black !important } } } } .calendar_container[data-v-app] { display: block; } .calendar_times_container { gap: 6px 4px; label { *[checkbox] { font-size: 1rem; background: var(--color_violet__pale); border-radius: 20px; padding: 8px; text-align: center; color: var(--color_violet); } input:checked + *[checkbox] { background-color: var(--color_violet); color: white; } } } .phones { flex: 1; a { text-decoration: none; } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/footer.css?17635582101194*/ footer { padding: 20px 17px 40px; background: #EEEAF4; border-radius: 20px 20px 0px 0px; .skinny { font-size: 1.1rem; } p { color: var(--color_violet); } *[col] { place-content: end } .footer__logo { display: flex; justify-content: end; } .footer__social { display: flex; gap: 20px; .footer__social--icons { flex: 0 0 auto; display: flex; gap: 8px; align-items: end; } } .dnt_logo { flex: 1; text-align: end; a { display: inline-block } p { font-size: 0.8rem; } } .logo { height: 60px; width: max-content; display: flex; align-items: center; a { display: inline-block; height: 100%; svg { width: auto; height: 100% } } } .timework { max-width: 100%; * { max-width: max-content; } } .mail { display: flex; align-items: end; a { text-decoration: none } } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/modals.css?17635582105003*/ .modal_container { display: flex; align-items: center; height: 100vh; will-change: transform, opacity, max-height; } .modal { --min-width: 340px; --border-radius: 20px; min-width: var(--min-width); position: relative; background: #FFFFFF; border: 1px solid #F15A24; border-radius: var(--border-radius); .modal__top { display: flex; justify-content: space-between; padding: 18px 18px 0; } .modal__title { font-size: 1.4rem; line-height: 1.2; * { font-size: inherit } padding: 0 12px; text-align: center; } *[action="close"] { width: 8px; rect { fill: var(--color_violet__disabled) } } label:has(> *[checkbox], *[radio]):has(> input[type="checkbox"], input[type="radio"]) { input[type="checkbox"], input[type="radio"] { bottom: 30%; left: 50%; } } table { border-radius: 0 0 var(--border-radius) var(--border-radius); overflow: hidden; } } .modal__form { position: relative; .modal__form--list { display: flex; flex-direction: column; gap: 0.4rem; } .input_text::placeholder { color: var(--color_violet__disabled); } *:has( > .input_error) { position: relative; .input_error { opacity: 0; position: absolute; right: 16px; top: 50%; transform: translateY(-50%); font-weight: var(--fw-normal); font-size: 1rem; line-height: 1; color: var(--color_orange); } *:has(input[type="checkbox"]) ~ .input_error { left: 0; bottom: -4px; transform: translateY(100%); } } .input_text[invalid] ~ .input_error { opacity: 1; } *:has(input[type="checkbox"][invalid]) ~ .input_error { opacity: 1; } .input_text[invalid], .input_text[invalid]:focus, .input_text[invalid]:active { border-color: var(--color_orange); } .input_text[invalid]::placeholder { color: var(--color_orange); } input[invalid] ~ *[checkbox] { border-color: var(--color_orange); } input[invalid] ~ .checkbox__text a{ color: var(--color_orange); } .input_text { padding: 8px 16px; border: 1px solid var(--color_violet__disabled); border-radius: 20px; } .input_text:focus, .input_text:active { border-color: var(--color_violet) } .modal__form--list { *[checkbox] { border: 1px solid var(--color_violet__disabled); border-radius: 2px; padding: 1px; svg { width: 100%; height: 100%; opacity: 0; } } .checkbox__text { font-size: 1.1rem; font-weight: var(--fw-light); margin-left: 4px; } input:checked + *[checkbox] { background-color: var(--color_violet); border: unset; svg { opacity: 100 } } } textarea { min-height: 80px; } .button_container { text-align: center; .button { font-size: 1.4rem; padding: 10px 0; } } .list_container--logo_horizontal { display: none; } } .modal .modal__form { padding: 16px 16px 20px; textarea { min-height: initial; } .button_container .button { max-width: 240px; } } #img_modal { .modal__content { padding: 10px; height: max-content; --min-width: unset; picture { height: auto; width: auto; border-radius: 20px; max-width: 90vw; max-height: 85vh; img { object-fit: contain } } } } .modal_container:has(.modal.slidein) { will-change: max-height; } .modal.slidein { will-change: opacity, transform; } [state="hidden"] .modal_container .modal.slidein { transform: translateY(-100%); opacity: 0; } [state="shown"] .modal_container { overflow-y: auto; } [state="shown"] .modal_container .modal.slidein { transform: translateY(0); opacity: 100%; } [state="hiding"] .modal_container .modal.slidein { transform: translateY(100%); opacity: 0; } [state="hidden"] .modal_container:has(.modal.slidein) { max-height: 100% } [state="shown"] .modal_container:has(.modal.slidein) { max-height: max-content } [state="hidden"] .modal_container:has(.modal.slidein) { max-height: 100% } .modal.opacityin { will-change: opacity; } [state="hidden"] .modal.opacityin { opacity: 0; } [state="shown"] .modal.opacityin { opacity: 100%; } [state="hiding"] .modal.opacityin { opacity: 0; } @media (max-width: 350px) { .modal { --min-width: auto } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/404.css?1763558210497*/ .page_404 { .container_404 { display: flex; align-items: center; justify-content: space-around; flex-direction: column; } a { text-decoration: none; padding: var(--padding-top) 24px var(--padding-bottom); svg { display: inline; margin: 0px 0px 3px 20px; } } h1 { font-weight: var(--fw-extrabold); font-size: 18rem; line-height: 1; color: #EEEAF4; } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/main_adaptive.css?1763558210233*/ @media (min-width:376px) { :root { --font-size: 11px; } } @media (min-width:768px) { :root { --font-size: 13px; } } @media (min-width:1024px) { :root { --font-size: 15px; } } @media (min-width:1280px) { :root { --font-size: 10px; } } /* End */ /* Start:/local/templates/DNT_digital/assets/css/main_desktop.css?176355821013278*/ @media (min-width:1280px) { header .header-mobile { max-width: 1200px } } @media (min-width:1536px) { header .header-mobile { max-width: 1320px } } @media (min-width:1920px) { header .header-mobile { max-width: 1600px } } @media (min-width: 1280px) { :root { --space-step: 4.5px; --fs-p: 2rem; } header { .container { display: flex; justify-content: center; } .header-mobile { box-sizing: content-box; display: flex; flex-direction: row-reverse; justify-content: space-between; .header-mobile__menu { max-height: 100vh !important; nav { --margin-top: 0px; } } } .menu__list { flex-direction: row; .menu__item { list-style: none !important; font-weight: var(--fw-normal); font-size: 1.8rem; --transition-duration: var(--td-medium); --ripple-duration: var(--transition-duration); --ripple-color: rgba(255, 255, 255, 0.479); position: relative; overflow: hidden; a { margin-left: 0px !important} } .menu__item::after { will-change: transform; content: ""; position: absolute; left: 50%; top: 50%; width: 8px; height: 8px; background-color: var(--ripple-color); border-radius: 50%; transform: translate(-50%,-50%) scale(0); opacity: 0; pointer-events: none } .menu__item:hover::after { animation: ripple var(--ripple-duration) ease-out } } } h2 { font-size: 8rem; * { --underline-offset: -10px !important; --underline-width: 5px !important } } h3 {font-size: 3.2rem;} blockquote::before { width: 4px; } blockquote { padding-left: 1.5rem; } .editor { font-size: 2.4rem; blockquote { font-size: 2.4rem; padding-left: 2.5rem; } p, h6 { font-size: 3rem; } p { margin-bottom: 2rem; } h6 { margin: 4rem 0 4rem; } h2 { margin: 5rem 0 4rem; } table.violet_table { --border-width: 1px; thead th { padding: 20px 0px; } tbody td { padding: 15px 0px; } th, td { font-size: 2.4rem; } } } .button { border-radius: 24px; font-weight: var(--fw-bold); font-size: 3.2rem; line-height: 1.5; } .button--small { font-size: var(--fs-p); line-height: 1; padding: 1rem; } .gallery { --swiper-navigation-sides-offset: 25px; overflow: hidden; .swiper-slide { height: 600px; width: 1200px; } .swiper-pagination { display: none; } .gallery__blockquote_container { position: absolute; max-width: 550px; width: 45%; height: auto; bottom: 0; right: 0; z-index: 1; .gallery__blockquote { width: 100%; height: 100%; position: relative; svg { width: 100%; height: 100%; } .gallery__blockquote_text { position: absolute; bottom: 0; right: 0; left: 0; top: 0; padding: 50px 0 0 50px; blockquote { font-size: 1.8rem; padding-left: 1.5rem; } } } } .gallery__button_container { position: absolute; max-width: 500px; width: 40%; height: auto; bottom: 0; left: 0; z-index: 1; margin: 18px; } .swiper-button-next, .swiper-button-prev { width: max-content; height: auto; } .gallery__blockquote_container ~ .swiper-button-next, .gallery__blockquote_container ~ .swiper-button-prev { margin-top: calc(-30px - (var(--swiper-navigation-size) / 2)); } .swiper-button-next:after, .swiper-button-prev:after { content: ''; } } .gallery_container .gallery .swiper-slide { height: 550px; } .gallery_container .gallery[data-slides_count="2"] .swiper-slide { height: 380px; } .services { article { > a { flex-direction: column; padding: 20px; gap: 5px; .services__content { .services__content--title { font-weight: var(--fw-extrabold); font-size: 1.8rem; } .services__content--price { line-height: 1.2; p { font-size: 1.8rem; } } } .services__picture .services__picture--icon { max-width: 90px; *[icon] {width: 90px;} } } h2 { font-size: 4rem; } } } .why_us { gap: 56px; article { .why_us__content { p, b, blockquote { font-size: 2rem; line-height: 1.2; } b { font-weight: var(--fw-extrabold); } } .why_us__picture { min-width: 80px; .why_us__picture--icon { max-width: 80px; } } } } .feedback_form { .feedback_form__title { font-size: 4rem; line-height: 1.2; } .feedback_form__subtitle { font-size: 2.4rem; } .list_container--logo_horizontal { display: block; } .modal__form--list_container { width: 45%; } } .modal { .modal__top { padding: 32px 32px 0; svg { width: 129px !important; } *[action="close"] { width: 16px; } } .modal__title { padding: 0 56px; font-size: 2.4rem; font-weight: var(--fw-extrabold); } .modal__form { padding: 20px 56px 32px; .button_container .button { max-width: initial; } } } .modal__form { .input_text { padding: 8px 16px; font-size: 2rem; } .checkbox__text { font-size: 2rem !important; } .modal__form--list { gap: 1rem; } .button_container .button { font-weight: var(--fw-bold); font-size: 3.2rem; line-height: 1.5; } .list_container--logo_horizontal { position: absolute; right: 0; bottom: 0; } .input_error { font-size: 2rem !important; } *:has(input[type="checkbox"]) ~ .input_error { bottom: -12px !important; } } footer { padding: 50px 0px 65px; *[col] { place-content: start; } .footer_top { grid-template-rows: repeat(2, auto); gap: 50px; > :nth-child(1) { grid-column: 10 / span 3; grid-row: 1 / span 2; } > :nth-child(3) { grid-column: 6 / span 3; grid-row: 2; } > :nth-child(5) { grid-column: 1 / span 5; grid-row: 2; } > :nth-child(2) { grid-column: 1 / span 5; grid-row: 1; } > :nth-child(4) { grid-column: 6 / span 3; grid-row: 1; } } .skinny { font-size: 1.8rem; } .timework { max-width: max-content; flex: none; } .footer__logo svg { width: 290px !important; } .footer__social--icons { svg { height: 30px; width: auto; } } .dnt_logo { align-items: center; display: flex; flex-direction: row-reverse; gap: 10px; p { font-size: 1.6rem; } } } .services_table table { th, td { min-width: 70px; padding: 10px 0; } tr * { font-size: 1.8rem; } } .services_table__container { gap: 100px; } .services_icons { svg { width: 10px; margin-bottom: 1.5rem !important; } article { .services_icons__picture--icon { max-width: 120px; *[icon] { width: 120px; } } .services_icons__content { p { font-size: 2.4rem; } } } article:last-child { order: 1; } article:nth-last-child(2) { order: 2; } } .faq_list { ul { gap: 12px; } .faq_list__top p { font-weight: var(--fw-light); font-size: 2.4rem; line-height: 1.2; } .faq_list__content p { font-size: 1.8rem; } } .contacts { gap: 80px; p, a, h4 { font-size: 1.8rem; } *:has(> .bottom_links) { flex-direction: column; justify-content: space-between; } .contacts__map { flex-direction: column-reverse; .contacts__map--container { height: 330px; } .schema * { display: inline;} } } .page_404 { h3 {font-weight: var(--fw-extrabold) !important;} .container_404 { flex-direction: row; h1 { color: var(--color_orange); font-size: 35rem; line-height: 0.7; } svg {width: 460px} > * { display: flex; align-items: center; flex-direction: column; align-self: end; } } } .services_table__top svg { width: 110px !important; } .section_detail__periods { .section_detail__periods--content { display: flex; gap: 15px; flex-wrap: wrap; .section_detail__periods--item { gap: 50px; font-size: 3.2rem; padding: 30px 25px; border-radius: 25px; } } .section_detail__items--content { .section_detail__items--item { font-size: 2.4rem; } .section_detail__items--item:hover { padding: 0px 10px; } .section_detail__items--item:not(:last-child)::before { width: 4px; } } } .calendar_container { .calendar_top { justify-content: start; } .date__content { min-height: 90px; *:not(.status_text) { justify-content: start; padding: 8px 10px; } } table { td, th { border-width: 1px; } th { padding: 5px 0px; } .weekday, .status_text { font-size: 1.8rem; } .status_text { font-weight: var(--fw-normal); padding: 0px 5px 10px; } .status_date { font-size: 2.4rem; } } } .calendar_times_container { gap: 10px 8px; label *[checkbox] { font-size: 2rem; padding: 12px; } } } /* End */ /* /local/templates/DNT_digital/assets/css/libs/swiper.bundle.min.css?176355821018459 */ /* /local/templates/DNT_digital/assets/css/libs/st_style.css?176355821094540 */ /* /local/templates/DNT_digital/assets/css/libs/st_animation.css?176355821018109 */ /* /local/templates/DNT_digital/assets/css/root.css?17635582105040 */ /* /local/templates/DNT_digital/assets/css/header.css?17635582101476 */ /* /local/templates/DNT_digital/assets/css/main.css?176355821012027 */ /* /local/templates/DNT_digital/assets/css/footer.css?17635582101194 */ /* /local/templates/DNT_digital/assets/css/modals.css?17635582105003 */ /* /local/templates/DNT_digital/assets/css/404.css?1763558210497 */ /* /local/templates/DNT_digital/assets/css/main_adaptive.css?1763558210233 */ /* /local/templates/DNT_digital/assets/css/main_desktop.css?176355821013278 */