/* ================================================== RESET Y BASE ================================================== */ /* ============================================ ICM Consulting — Estilos Base: réplica Varagon (Fase 1) → adaptado a ICM (Fase 2) ============================================ */ /* ── Tipografías Adobe Typekit (cargadas vía en el HTML) ── */ /* Neue Haas Grotesk Text — sans-serif (reemplaza AkkuratPro) */ /* Argent CF — serif (reemplaza Publico) */ /*** uncss> filename: static/build.css ***/ *, :after, :before, html { box-sizing: border-box; } html { -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } tr { vertical-align: top; } body { font-family: neue-haas-grotesk-text, sans-serif; font-size: 16px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-font-feature-settings: "liga", "kern"; text-rendering: optimizelegibility; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; color: #fff; background-color: #fff; height: auto; overflow: auto; } ::-moz-selection { color: #fff; background: #0c1a2a; } ::selection { color: #fff; background: #0c1a2a; } img { -ms-interpolation-mode: bicubic; } html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } body { margin: 0; } footer, header, main, nav, section { display: block; } video { display: inline-block; vertical-align: baseline; } template { display: none; } a { background-color: transparent; } a:active, a:hover { outline: 0; } h1 { font-size: 2em; margin: 0.67em 0; } img { border: 0; } svg:not(:root) { overflow: hidden; } button, input { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button { text-transform: none; } button { -webkit-appearance: button; cursor: pointer; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } table { border-spacing: 15px; } td, th { padding: 0; } .c-application.is-loading { cursor: wait; } /* Saltar preloader en navegación interna (menú hamburguesa). El script inline en pone esta clase ANTES del render, así el preloader nunca parpadea. */ html.skip-preloader .c-loader-intro { display: none !important; opacity: 0 !important; visibility: hidden !important; } /* Ocultar header (logo + menú) y subtítulo en navegación hamburguesa para evitar flash antes de que JS haga el fade-in suave. */ html.skip-preloader .c-header, html.skip-preloader .c-page__subtitle, html.skip-preloader [data-color] h1 { opacity: 0 !important; } /* Posición inicial del título del hero (slide-up) en navegación hamburguesa */ html.skip-preloader [data-color] h1 { transform: translateY(40px) translateZ(0) !important; } /* Fondo del hero transparente hasta que la imagen cargue. Evita destello del fondo oscuro antes de que la foto se pinte. */ html.skip-preloader [data-color] { background-color: transparent !important; } /* Desactiva TODAS las transiciones un frame al saltar el preloader en navegación interna (evita el "salto" del header/logo). */ .c-application.no-transitions, .c-application.no-transitions *, .c-application.no-transitions *::before, .c-application.no-transitions *::after { transition: none !important; } .l-terms-and-conditions { margin-right: 30px; } .l-terms-and-conditions { margin-right: 30px; } /* ================================================== FONT-FACE ================================================== */ /* Tipografías via Adobe Typekit */ /* ================================================== TIPOGRAFÍA (t-) ================================================== */ .t-h1, .t-h2, .t-h3, .t-h4, .t-h5, .t-h6, .t-h-reset { margin: 0; font-weight: 400; line-height: 1; } .t-text, .t-text--lg, .t-text--md, .t-text--sm, .t-text--xl, .t-text--xs, .t-text--xxl, .t-text--xxs { margin: 0; line-height: 1; -webkit-margin-before: 0; -webkit-margin-after: 0; } .t-h1 { font-size: 99px; font-size: 6.1875rem; font-size: calc(34px + 65 * ((53vw + 53vh) - 600px) / 820); } .t-h2 { font-size: 76px; font-size: 4.75rem; font-size: calc(22px + 54 * ((53vw + 53vh) - 600px) / 820); } .t-h3 { font-size: 55px; font-size: 3.4375rem; font-size: calc(28px + 22 * (50vw + 50vh - 600px) / 820); } .t-h4 { font-size: 33px; font-size: 2.0625rem; } .t-h5 { font-size: 25px; font-size: 1.5625rem; } .t-link--opacity { opacity: 1; transform: translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .t-link--opacity:hover { opacity: 0.6; } .t-link--alpha-opacity { opacity: 0.5; will-change: opacity; transform: translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .t-link--alpha-opacity:hover { opacity: 1; } .t-text, .t-text--lg, .t-text--md, .t-text--sm, .t-text--xl, .t-text--xs, .t-text--xxl, .t-text--xxs { font-family: neue-haas-grotesk-text, sans-serif; font-weight: 400; line-height: 1.6; } .t-text--xxs { font-size: 11px; font-size: 0.6875rem; } .t-text--xs { font-size: 12px; font-size: 0.75rem; } .t-text--sm { font-size: 14px; font-size: 0.875rem; } .t-text--md { font-size: 16px; font-size: 1rem; } .t-text--lg { font-size: 18px; font-size: 1.125rem; } .t-text--xl { font-size: 22px; font-size: 1.375rem; } .t-text--xxl { font-size: 28px; font-size: 1.75rem; } .t-text-ls--md { letter-spacing: 0.14em; } .t-text-ls--lg { letter-spacing: 0.17em; } .t-text-lh--md { line-height: 1.1; } .t-text--base-bold { font-family: neue-haas-grotesk-text, sans-serif; } .t-text--roman { font-family: argent-cf, serif; } .t-text--roman-italic { font-family: argent-cf, serif; } .t-italic { font-style: italic; } /* ================================================== OBJETOS (o-) ================================================== */ .o-list, .o-list--inline { list-style: none; margin: 0; padding: 0; -webkit-margin-before: 0; text-decoration: none; } .o-wrapper--valign, .u-vacuum { font-size: 0; } .o-list--inline .o-list__item { display: inline-block; } .o-wrapper, .o-wrapper--valign { position: relative; } .o-wrapper--panel { position: absolute; top: 0; left: 0; } .o-wrapper--valign:after { content: ""; display: inline-block; height: 100%; width: 0; vertical-align: middle; } .c-partners-slideshow__grid .o-list__item { width: 25%; } /* ================================================== BOTONES (t-btn) ================================================== */ .t-btn, .t-input { background: none; border: none; outline: none; padding: 0; margin: 0; border-radius: 0; -webkit-appearance: none !important; } .t-btn, .t-link { color: inherit; cursor: pointer; } .t-btn, .t-btn:hover, .t-link, .t-link:hover { text-decoration: none; } .t-btn:active, .t-btn:focus, .t-link:active, .t-link:focus { outline: none; } .t-btn--primary { padding-top: 28px; padding-bottom: 24px; } .t-btn--primary__bg { background-color: #c48a48; transform: scaleX(0) translateZ(0); transform-origin: 0 0; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1); } .t-btn--primary:hover .t-btn--primary__bg { transform: scaleX(1) translateZ(0); transition: transform 0.8s cubic-bezier(0.86, 0, 0.07, 1); } .t-btn--hovered { position: relative; transform: translateX(0) translateY(0) translateZ(0); height: 60px; transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; } .t-btn--hovered__primary { z-index: 2; width: 60px; height: 60px; border-top: 1px solid #e0e6ec; border-bottom: 1px solid #e0e6ec; border-left: 1px solid #e0e6ec; } .t-btn--hovered__secondary { margin-top: -60px; transform: translateX(calc(-100% + 60px)) translateY(0) translateZ(0); z-index: 1; border-right: 1px solid #e0e6ec; } .t-btn--hovered__secondary, .t-btn--hovered__secondary-content { height: 60px; transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; } .t-btn--hovered__secondary-content { transform: translateX(100%) translateY(0) translateZ(0); padding-right: 20px; border-top: 1px solid #e0e6ec; border-bottom: 1px solid #e0e6ec; } .t-btn--hovered:hover .t-btn--hovered__secondary { transform: translateX(60px) translateY(0) translateZ(0); } .t-btn--hovered:hover .t-btn--hovered__secondary-content { transform: translateX(-1px) translateY(0) translateZ(0); } /* ================================================== PRELOADER (c-loader-intro) ================================================== */ .c-loader-intro { z-index: 10; opacity: 0; visibility: hidden; transform: translateZ(0); transition: 0.55s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s, visibility 0s 1s; } .c-loader-intro img { height: 100%; } .is-first-loading .c-loader-intro { opacity: 1; visibility: visible; } .c-loader-intro__bar { background-color: #0c1a2a; transition: transform 2s cubic-bezier(0.23, 1, 0.32, 1); } .c-loader-intro__bar--x { height: 100px; transform-origin: 0 0; } .c-loader-intro__bar--x:nth-of-type(3) { transform-origin: 0 100%; } .c-loader-intro__bar--y { width: 100px; transform-origin: 0 0; } .c-loader-intro__bar--y:nth-of-type(2) { transform-origin: 100% 0; } .c-loader-intro__logo { height: auto; width: auto; text-align: center; transform: translate(-50%, -50%) scale(1) translateZ(0); } .c-loader-intro__ribbon-container { transform: translateY(35px) translateZ(0); width: 140px; left: 55px; } .is-assets-loaded .c-loader-intro__ribbon-container { transform: translateY(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1); } .c-loader-intro__logo__typo { opacity: 0; transform: translateY(35px) translateZ(0); left: 0; top: -7px; position: relative; } .is-assets-loaded .c-loader-intro__logo__typo { opacity: 1; transform: translateY(5px) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.15s, opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.15s; } .c-loader-intro__logo__typo:nth-child(2) { font-size: 8px; font-size: 0.5rem; transform: translateX(0) translateY(50px) translateZ(0); } .is-assets-loaded .c-loader-intro__logo__typo:nth-child(2) { transform: translateX(0) translateY(15px) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.25s, opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.25s; } .c-loader-intro__logo__img { opacity: 0; left: 0; transition: opacity 0.9s 0.5s; } .is-assets-loaded .c-loader-intro__logo__img { transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.15s, opacity 1s cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s; } .c-loader-intro__logo__ribbon:first-of-type { top: 6%; left: 30.5%; width: 10px; height: 28px; opacity: 0.5; transform-origin: 0 100%; transform: skewX(25deg) scaleY(1) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s, opacity 0.9s 0.5s; } .is-loop .c-loader-intro__logo__ribbon:first-of-type { opacity: 0; transform: skewX(25deg) scaleY(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0s, opacity 0s 0.6s; } .is-assets-loaded .c-loader-intro__logo__ribbon:first-of-type { opacity: 0; } .c-loader-intro__logo__ribbon:nth-of-type(2) { top: 0; left: 44%; width: 11px; height: 33px; z-index: 2; transform-origin: 0 0; transform: skewX(-25deg) scaleY(1) translateZ(0); transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0.1s, opacity 0.9s; } .is-loop .c-loader-intro__logo__ribbon:nth-of-type(2) { transform: skewX(-25deg) scaleY(0) translateZ(0); transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0.4s; } .is-assets-loaded .c-loader-intro__logo__ribbon:nth-of-type(2) { opacity: 0; } .c-loader-intro__logo__ribbon:nth-of-type(3) { top: 0; left: 45%; width: 10px; height: 33px; transform: translateZ(0); opacity: 0.5; transition: opacity 0.9s cubic-bezier(0.23, 1, 0.32, 1) 0s; } .first-is-loading .c-loader-intro__logo__ribbon:nth-of-type(3), .is-assets-loaded .c-loader-intro__logo__ribbon:nth-of-type(3) { opacity: 0; } .c-loader-intro__logo__ribbon:nth-of-type(4) { top: 0; left: 45.5%; width: 11px; height: 33px; z-index: 2; transform-origin: 0 100%; transform: skewX(-25deg) scaleY(1) translateZ(0); transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0.1s, opacity 0.9s cubic-bezier(0.23, 1, 0.32, 1) 0s; } .is-assets-loaded .c-loader-intro__logo__ribbon:nth-of-type(4) { opacity: 0; } .is-loop .c-loader-intro__logo__ribbon:nth-of-type(4) { transform: skewX(-25deg) scaleY(0) translateZ(0); transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0.4s; } .c-loader-intro__logo__ribbon:nth-of-type(5) { top: 0; left: 60%; width: 10px; height: 28px; opacity: 0.5; transform-origin: 0 0; transform: skewX(25deg) scaleY(1) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s, opacity 0.9s 0.5s; } .is-assets-loaded .c-loader-intro__logo__ribbon:nth-of-type(5) { opacity: 0; } .is-loop .c-loader-intro__logo__ribbon:nth-of-type(5) { opacity: 0; transform: skewX(25deg) scaleY(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0s, opacity 0s 0.55s; } /* ================================================== PRELOADER ICM — Logo SVG animado (reemplaza cintillas) ================================================== */ .c-icm-logo { height: clamp(22px, 2.5vw, 34px); width: auto; color: #ffffff; overflow: visible; display: block; } .c-icm-logo path { will-change: transform, opacity; } @media (prefers-reduced-motion: reduce) { .c-icm-logo path { opacity: 1 !important; transform: none !important; } } /* ================================================== LOADER TRANSICIÓN (c-loader) ================================================== */ .c-loader { z-index: 10; display: none; opacity: 0; transform: translateZ(0); transition: opacity 0.7s; } /* ================================================== HEADER (c-header) ================================================== */ .c-header { z-index: 3; } .c-header__logo { width: 88px; height: 2rem; bottom: 0; transition: transform 0.9s cubic-bezier(0.23, 1, 0.32, 1) 0.4s; transform: translateY(0) translateZ(0); } .is-first-loading .c-header__logo { transform: translateY(-50px) translateZ(0); } /* ── Logo dual: blanco (clear/dark bg) ↔ oscuro (dark/light bg) ───────── Por defecto: logo blanco visible, logo oscuro oculto. Con is-dark en el header: se invierte. */ .c-header__logo__img-dark { display: none; position: absolute; top: 0; left: 0; } .c-header.is-dark .c-header__logo__img-clear { display: none; } .c-header.is-dark .c-header__logo__img-dark { display: block; } /* Nav links: oscuros sobre fondo claro */ .c-header.is-dark .c-header__item__link { color: #0c1a2a; transition: color 0.3s; } .c-header.is-dark .c-header__item__link.is-active, .c-header.is-dark .c-header__item__link:hover { color: #3470c0; } .c-header__container { opacity: 1; visibility: visible; transform: translateY(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s, opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.2s, visibility 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s; } .is-home .c-header__container { transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.9s, opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.9s, visibility 1s cubic-bezier(0.23, 1, 0.32, 1) 0.9s; } .is-header-hided .c-header__container { opacity: 0; visibility: hidden; transform: translateY(-50px) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1), visibility 1s cubic-bezier(0.23, 1, 0.32, 1); } /* Logo fijo en páginas interiores: se muestra junto al burger al hacer scroll. El c-header__logo--fixed es un clon del logo inyectado por JS en initInnerPageBurger. */ .c-header__logo--fixed { display: none; position: fixed; top: 28px; left: 8.333%; z-index: 9; width: 60px; height: 28px; } .c-application:not(.is-home).is-header-hided .c-header__logo--fixed { display: block; } .c-header.is-dark .c-header__logo--fixed .c-header__logo__img-clear { display: none; } .c-header.is-dark .c-header__logo--fixed .c-header__logo__img-dark { display: block; } .is-popin-active .c-header__container { opacity: 0; visibility: hidden; } .c-header__logo__ribbon:first-of-type { top: 6%; left: 30.5%; width: 10px; height: 28px; opacity: 0.5; transform-origin: 0 100%; transform: skewX(25deg) scaleY(1) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.9s, background-color 1s cubic-bezier(0.23, 1, 0.32, 1); } .is-first-loading .c-header__logo__ribbon:first-of-type { transform: skewX(25deg) scaleY(0) translateZ(0); } .c-header__logo__ribbon:nth-of-type(2) { top: 0; left: 44%; width: 11px; height: 33px; z-index: 2; transform-origin: 0 0; transform: skewX(-25deg) scaleY(1) translateZ(0); transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0.5s, background-color 1s cubic-bezier(0.23, 1, 0.32, 1); } .is-first-loading .c-header__logo__ribbon:nth-of-type(2) { transform: skewX(-25deg) scaleY(0) translateZ(0); } .c-header__logo__ribbon:nth-of-type(3) { top: 0; left: 45%; width: 10px; height: 33px; transform: translateZ(0); opacity: 0.5; transition: opacity 0.9s cubic-bezier(0.23, 1, 0.32, 1) 0.4s, background-color 1s cubic-bezier(0.23, 1, 0.32, 1); } .first-is-loading .c-header__logo__ribbon:nth-of-type(3) { opacity: 0; } .c-header__logo__ribbon:nth-of-type(4) { top: 0; left: 45.5%; width: 11px; height: 33px; z-index: 2; transform-origin: 0 100%; transform: skewX(-25deg) scaleY(1) translateZ(0); transition: transform 0.6s cubic-bezier(0.77, 0, 0.175, 1) 0.5s, background-color 1s cubic-bezier(0.23, 1, 0.32, 1); } .is-first-loading .c-header__logo__ribbon:nth-of-type(4) { transform: skewX(-25deg) scaleY(0) translateZ(0); } .c-header__logo__ribbon:nth-of-type(5) { top: 0; left: 60%; width: 10px; height: 28px; opacity: 0.5; transform-origin: 0 0; transform: skewX(25deg) scaleY(1) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.9s, background-color 1s cubic-bezier(0.23, 1, 0.32, 1); } .is-first-loading .c-header__logo__ribbon:nth-of-type(5) { transform: skewX(25deg) scaleY(0) translateZ(0); } .c-header__item { opacity: 1; transform: translateY(0) translateZ(0); } .is-first-loading .c-header__item { opacity: 0; transform: translateY(-100%) translateZ(0); } .c-header__item:first-of-type { transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.7s, opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.7s; } .c-header__item:nth-of-type(2) { transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.75s, opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.75s; } .c-header__item:nth-of-type(3) { transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.8s, opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.8s; } .c-header__item:nth-of-type(4) { transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.85s, opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.85s; } .c-header__item:nth-of-type(5) { transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.9s, opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.9s; } .c-header__item:nth-of-type(6) { transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.95s, opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.95s; } .c-header__item:nth-of-type(7) { transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 1s, opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1) 1s; } .c-header__item__link { opacity: 0.4; transform: translateZ(0); font-size: 12px; transition: opacity 0.75s cubic-bezier(0.165, 0.84, 0.44, 1); } .c-header__item__link.is-active, .c-header__item__link:hover { opacity: 1; } /* ================================================== BANDEAU (c-bandeau) ================================================== */ .c-bandeau { position: relative; width: 100%; padding: 10px; color: #fff; z-index: 4; transform: translateY(0) translateZ(0); transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.6s; } /* Oculto arriba mientras carga; baja al quitar is-first-loading */ .is-first-loading .c-bandeau { transform: translateY(-100%) translateZ(0); } /* Ocultar título del hero mientras el preloader está activo. Evita destello visible→oculto→fade-up al terminar el preloader. */ .is-first-loading [data-color] h1 { opacity: 0; transform: translateY(40px) translateZ(0); } .c-bandeau a { color: #fff; text-align: center; text-decoration: none; } /* ================================================== BURGER (c-burger, t-btn--burger) ================================================== */ .t-btn--burger { width: 87px; height: 87px; right: 27px; transform: scale(1) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); } .is-nav-active .t-btn--burger, .is-popin-active .t-btn--burger { transform: scale(0.8) translateZ(0); } .t-btn--burger:hover { opacity: 0.75; } .c-burger__border { position: absolute; width: 100%; height: 100%; top: 0; left: 0; border-radius: 50%; opacity: 0; transform: scale(1.2) translateZ(0); transition: transform 0.75s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.45s; } .c-burger__border:first-of-type { opacity: 0; border: 2px solid #fff; } .is-nav-active .c-burger__border:first-of-type { opacity: 0.2; transform: scale(1) translateZ(0); transition: transform 0.75s cubic-bezier(0.23, 1, 0.32, 1) 0.3s, opacity 0.65s 0.3s; } .c-burger__border:nth-of-type(2) { opacity: 0; border: 2px solid #0c1a2a; } .is-popin-active .c-burger__border:nth-of-type(2) { opacity: 0.2; transform: scale(1) translateZ(0); transition: transform 0.75s cubic-bezier(0.23, 1, 0.32, 1) 0.3s, opacity 0.65s 0.3s; } .t-btn--burger__bar { width: 41px; height: 3px; transform: translateZ(0); transition: opacity 0.55s 0.3s; } .t-btn--burger__bar:nth-of-type(4), .t-btn--burger__bar:nth-of-type(5) { transform-origin: 50% 50%; } .t-btn--burger__bar:nth-of-type(4) { transform: translate(-50%, -50%) rotate(45deg) translateZ(0); } .t-btn--burger__bar:nth-of-type(5) { transform: translate(-50%, -50%) rotate(-45deg) translateZ(0); } .is-nav-active .t-btn--burger__bar:first-of-type, .is-nav-active .t-btn--burger__bar:nth-of-type(2), .is-nav-active .t-btn--burger__bar:nth-of-type(3), .is-popin-active .t-btn--burger__bar:first-of-type, .is-popin-active .t-btn--burger__bar:nth-of-type(2), .is-popin-active .t-btn--burger__bar:nth-of-type(3) { opacity: 0; transition: opacity 0.55s; } .t-btn--burger__bar .t-btn--burger__bar__panel:after, .t-btn--burger__bar .t-btn--burger__bar__panel:before, .t-btn--burger__bar:first-of-type:after, .t-btn--burger__bar:first-of-type:before, .t-btn--burger__bar:nth-of-type(2):after, .t-btn--burger__bar:nth-of-type(2):before, .t-btn--burger__bar:nth-of-type(3):after, .t-btn--burger__bar:nth-of-type(3):before { position: absolute; content: ""; top: 0; left: 0; width: 100%; height: 100%; transform: translateZ(0); transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1); } .t-btn--burger__bar .t-btn--burger__bar__panel:before, .t-btn--burger__bar:first-of-type:before, .t-btn--burger__bar:nth-of-type(2):before, .t-btn--burger__bar:nth-of-type(3):before { background-color: #fff; } .t-btn--burger__bar .t-btn--burger__bar__panel:after, .t-btn--burger__bar:first-of-type:after, .t-btn--burger__bar:nth-of-type(2):after, .t-btn--burger__bar:nth-of-type(3):after { opacity: 0; background-color: #0e2240; } .c-burger.is-dark .t-btn--burger__bar:before { opacity: 0; } .c-burger.is-dark .t-btn--burger__bar:after { opacity: 1; } .is-nav-active .t-btn--burger__bar:before { opacity: 1 !important; } .is-nav-active .t-btn--burger__bar:after { opacity: 0 !important; } .t-btn--burger__bar:nth-of-type(2) { margin: 4px 0; } .t-btn--burger__bar__panel { will-change: transform; transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1); } .t-btn--burger__bar:nth-of-type(4) .t-btn--burger__bar__panel, .t-btn--burger__bar:nth-of-type(5) .t-btn--burger__bar__panel { transform-origin: 0 0; transform: translateX(-10px) scaleX(0) translateZ(0); } .is-nav-active .t-btn--burger__bar__panel, .is-popin-active .t-btn--burger__bar__panel { transform: translateX(0) scaleX(1) translateZ(0) !important; transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.2s; } .c-burger.is-dark .t-btn--burger__bar__panel:before { opacity: 0; } .c-burger.is-dark .t-btn--burger__bar__panel:after { opacity: 1; } .is-nav-active .t-btn--burger__bar__panel:before { opacity: 1 !important; } .is-nav-active .t-btn--burger__bar__panel:after { opacity: 0 !important; } .c-burger { opacity: 0; visibility: hidden; z-index: 9; transition: visibility 0s 1s, opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .is-header-hided .c-burger { visibility: visible; opacity: 1; transition: visibility 0s 0s, opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .c-burger.is-white .c-burger__border:nth-of-type(2) { border: 2px solid #fff; } .c-burger__label { top: 30px; right: 125px; } .c-burger__label:after, .c-burger__label:before { position: absolute; top: 0; left: 0; content: "Close"; opacity: 0; transform: translateZ(0); transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1); } .is-white .c-burger__label:before { color: #fff; } .c-burger__label:before { color: #0c1a2a; } .c-burger__label:after { color: #fff; } .is-nav-active .c-burger__label:after, .is-popin-active .c-burger__label:before { opacity: 1; } /* ================================================== NAV OVERLAY (c-nav) ================================================== */ .c-nav { z-index: 8; } .c-nav:before { position: absolute; content: ""; width: 100%; height: 100%; top: 0; left: 0; background: #0c1a2a; will-change: opacity; transform: translateZ(0); opacity: 0; transition: opacity 0s 0.8s; } .c-nav.is-active:before { opacity: 1; transform: translateZ(0); transition: opacity 0.35s; } .c-nav.is-same-page:before { transition: opacity 1s cubic-bezier(0.23, 1, 0.32, 1) 0.8s; } .c-nav__renderer { opacity: 0; transform: translateZ(0); transition: opacity 0.85s 1.2s; } .c-nav.is-same-page .c-nav__renderer { transition: opacity 0.85s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; } .c-nav.is-active .c-nav__renderer { opacity: 1; transition: opacity 1.5s; } .c-nav__logo { width: 60px; height: 28px; opacity: 0; transform: translateZ(0); transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1); } .c-nav.is-active .c-nav__logo { opacity: 1; } .c-nav__list__item { margin-bottom: 24px; opacity: 0; will-change: opacity, transform; transform: translateY(45px) translateZ(0); } .c-nav__list__item:first-of-type { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.95s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.95s; } .c-nav__list__item:nth-of-type(2) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.85s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.85s; } .c-nav__list__item:nth-of-type(3) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.75s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.75s; } .c-nav__list__item:nth-of-type(4) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.65s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.65s; } .c-nav__list__item:nth-of-type(5) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.55s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.55s; } .c-nav__list__item:nth-of-type(6) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.45s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.45s; } .c-nav__list__item:nth-of-type(7) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; } .c-nav.is-active .c-nav__list__item { opacity: 1; transform: translateY(0) translateZ(0); } .c-nav.is-active .c-nav__list__item:first-of-type { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.2s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.2s; } .c-nav.is-active .c-nav__list__item:nth-of-type(2) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.25s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.25s; } .c-nav.is-active .c-nav__list__item:nth-of-type(3) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.3s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.3s; } .c-nav.is-active .c-nav__list__item:nth-of-type(4) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.35s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.35s; } .c-nav.is-active .c-nav__list__item:nth-of-type(5) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.4s; } .c-nav.is-active .c-nav__list__item:nth-of-type(6) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.45s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.45s; } .c-nav.is-active .c-nav__list__item:nth-of-type(7) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; } .c-nav.is-leaving .c-nav__list__item { opacity: 0; transform: translateY(-45px) translateZ(0); } .c-nav.is-leaving .c-nav__list__item:first-of-type { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.35s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.35s; } .c-nav.is-leaving .c-nav__list__item:nth-of-type(2) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.4s; } .c-nav.is-leaving .c-nav__list__item:nth-of-type(3) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.45s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.45s; } .c-nav.is-leaving .c-nav__list__item:nth-of-type(4) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; } .c-nav.is-leaving .c-nav__list__item:nth-of-type(5) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.55s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.55s; } .c-nav.is-leaving .c-nav__list__item:nth-of-type(6) { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1) 0.6s, transform 0.8s cubic-bezier(0.23, 1, 0.32, 1) 0.6s; } .c-nav__links { z-index: 2; } .c-nav__list__link { font-size: calc(30px + 25 * ((53vw + 53vh) - 600px) / 820); opacity: 0.5; will-change: opacity; transform: translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .c-nav__list__item.is-active .c-nav__list__link, .c-nav__list__link:hover { opacity: 1; } .c-nav__tile__poster { background-color: #2a3040; } .c-nav__tile { transform: scaleX(0.7) scaleY(0.6); transform-origin: 50% 50%; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1); } .c-nav__grain { background-image: url(../media/images/grain-big-pattern.png); background-repeat: repeat; transform: translateZ(0); opacity: 0; transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1) 0.35s; } .c-nav.is-active .c-nav__grain { opacity: 1; transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1); } .c-nav__overlay { will-change: opacity; transform: translateZ(0); opacity: 0; transition: opacity 1.2s; } .c-nav.is-active .c-nav__overlay { opacity: 0.85; transition: opacity 0.6s; } /* ================================================== HOME SLIDES (c-home__section) ================================================== */ .c-home__section.is-active .c-puzzle__piece__mask-in, .is-active .c-puzzle__piece__mask-in, .is-leaving .c-puzzle__piece__mask-in { opacity: 1; transform: translateX(0) translateZ(0) !important; transition: transform 1.5s cubic-bezier(0.23, 1, 0.32, 1) 0.6s, opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 0.7s; } .c-home__section.is-active .c-puzzle__piece__mask-out, .is-active .c-puzzle__piece__mask-out, .is-leaving .c-puzzle__piece__mask-out { opacity: 0.32; transform: translateX(0) scale(1) translateZ(0) !important; transition: transform 1.5s cubic-bezier(0.23, 1, 0.32, 1) 0.6s, opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 0.7s; } .c-home__section { transition: transform 1s cubic-bezier(0.435, 0.01, 0.135, 1); } .c-home__section-3__line { height: 1px; } .c-home__section-5__title { font-size: 200px; font-size: calc(34px + 132 * ((53vw + 53vh) - 600px) / 820); } .c-home__section-5__title-plus { vertical-align: middle; font-size: 125px; font-size: calc(34px + 57 * ((53vw + 53vh) - 600px) / 820); } .c-home__section__overlay { background: #163252; opacity: 0.58; } .c-home__section__logo { width: 60px; height: 28px; opacity: 0; transform: translateZ(0); transition: opacity 0.8s cubic-bezier(0.23, 1, 0.32, 1); } .c-home__section.is-active .c-home__section__logo { opacity: 1; transition: opacity 1.2s cubic-bezier(0.23, 1, 0.32, 1) 0.8s; } .c-home__section__subtitle { margin-left: -75px; margin-bottom: 55px; } .c-home__section__subtitle > span:first-child { width: 75px; } .c-home__section__title { margin-bottom: 55px; } .c-home__section.is-active .c-home__line-aside { opacity: 0.15; transition: opacity 0.7s 1s; } .c-home__section__ribbon { opacity: 1; transform: skewX(-25deg) translateX(-60%) translateZ(0); transition: transform 1.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.4s 0.4s; } .c-home__section.is-active .c-home__section__ribbon { opacity: 0; transform: skewX(-25deg) translateX(130%) translateZ(0); transition: transform 1.3s cubic-bezier(0.23, 1, 0.32, 1) 0.1s, opacity 0.4s 0.4s; } .c-home__section__bar { z-index: 2; } .c-home__section__poster { opacity: 0.01; transform: scale(1.1) translateZ(0); transition: transform 4s cubic-bezier(0.23, 1, 0.32, 1) 0s, opacity 4s 0s; } .c-home__section.is-active .c-home__section__poster { opacity: 1; transform: scale(1) translateZ(0); transition: transform 4s cubic-bezier(0.23, 1, 0.32, 1) 0.3s, opacity 4s 0.3s; } .c-home__section.is-active .c-home__section__poster--2 { opacity: 0.74; transform: scale(1) translateZ(0); transition: transform 4s cubic-bezier(0.23, 1, 0.32, 1) 0.3s, opacity 4s 0.3s; } .c-home__section__poster__filter { opacity: 0.01; transform: translateZ(0); transition: opacity 4s 0s; } .c-home__section.is-active .c-home__section__poster__filter { opacity: 1; transform: translateZ(0); transition: opacity 4s 0.3s; } .c-home__section__chapter { z-index: 2; top: 35px; left: 70px; opacity: 0; transform: translateZ(0); transition: opacity 0.45s cubic-bezier(0.23, 1, 0.32, 1); } .is-menu-hover .c-home__section__chapter { opacity: 1; transition: opacity 0.45s cubic-bezier(0.23, 1, 0.32, 1) 0.3s; } .c-home__section__bar--x { height: 80px; transform: scaleY(1) translateZ(0); transition: transform 1s cubic-bezier(0.435, 0.01, 0.135, 1); } .c-home__section__bar--x:first-child { top: -1px; left: 0; transform-origin: 0 0; } .c-home__section__bar--x:nth-child(3) { bottom: -1px; left: 0; transform-origin: 0 100%; } .c-home__section.is-active .c-home__section__bar--x { transform: scaleY(0) translateZ(0); transition: transform 1.4s cubic-bezier(0.435, 0.01, 0.135, 1) 0.2s; } .is-menu-hover .c-home__section.is-active .c-home__section__bar--x { transform: scaleY(1) translateZ(0); transition: transform 1s cubic-bezier(0.435, 0.01, 0.135, 1); } .c-home__section__bar--y { transform: scaleX(1) translateZ(0); transition: transform 1s cubic-bezier(0.435, 0.01, 0.135, 1); } .c-home__section__bar--y:nth-child(2) { width: 192px; transform-origin: 100% 0; } .c-home__section__bar--y:nth-child(4) { width: 70px; transform-origin: 0 0; } .c-home__section.is-active .c-home__section__bar--y { transform: scaleX(0) translateZ(0); transition: transform 1.4s cubic-bezier(0.435, 0.01, 0.135, 1) 0.2s; } .is-menu-hover .c-home__section.is-active .c-home__section__bar--y { transform: scaleX(1) translateZ(0); transition: transform 1s cubic-bezier(0.435, 0.01, 0.135, 1); } .c-home__section__fade { opacity: 0; transform: translateZ(0); transition: opacity 0.75s cubic-bezier(0.23, 1, 0.32, 1); } .is-active .c-home__section__fade { opacity: 1; transition: opacity 2s cubic-bezier(0.23, 1, 0.32, 1) 0.3s; } .c-home__section--6__footer { height: 75px; } .c-home__section--6__footer__border-top { left: 8.33333%; transform: scaleX(0) translateZ(0); transform-origin: 0 50%; width: 83.33333%; height: 1px; opacity: 0.5; transition: transform 1s cubic-bezier(0.435, 0.01, 0.135, 1); will-change: transform; } .is-active .c-home__section--6__footer__border-top { transform: scaleX(1) translateZ(0); transition-delay: 0.5s; } /* ================================================== HOME NAV DOTS (c-home__nav) ================================================== */ .c-home__nav { z-index: 2; opacity: 1; transform: translateY(-50%) translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; } .is-loading .c-home__nav { opacity: 0; } .c-home__nav__item { padding: 30px 88px 30px 55px; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1); will-change: opacity, transform; } .is-first .c-home__nav__item { transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.9s; } .is-first .c-home__nav__item:first-of-type { transform: translateY(130%) translateZ(0); } .is-first .c-home__nav__item:nth-of-type(2) { transform: translateY(70%) translateZ(0); } .is-first .c-home__nav__item:nth-of-type(3) { transform: translateY(10%) translateZ(0); } .is-first .c-home__nav__item:nth-of-type(4) { transform: translateY(-50%) translateZ(0); } .is-first .c-home__nav__item:nth-of-type(5) { transform: translateY(-110%) translateZ(0); } .is-first .c-home__nav__item:nth-of-type(6) { transform: translateY(-170%) translateZ(0); } .is-menu-hover .c-home__nav__item { opacity: 0.3; } .c-home__nav__item:hover { opacity: 1; } .c-home__nav__dot { width: 3px; height: 3px; opacity: 0.5; transform: translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .is-active .c-home__nav__dot { opacity: 1; } .c-home__nav__label { opacity: 0; transform: translateX(25px) translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.15s, transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.15s; } .is-menu-hover .c-home__nav__label { opacity: 1; transform: translateX(0) translateZ(0); } .is-menu-hover .c-home__nav__item:first-of-type .c-home__nav__label { transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0, transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0; } .is-menu-hover .c-home__nav__item:nth-of-type(2) .c-home__nav__label { transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.15s, transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.15s; } .is-menu-hover .c-home__nav__item:nth-of-type(3) .c-home__nav__label { transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.2s, transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.2s; } .is-menu-hover .c-home__nav__item:nth-of-type(4) .c-home__nav__label { transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.25s, transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.25s; } .is-menu-hover .c-home__nav__item:nth-of-type(5) .c-home__nav__label { transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.3s, transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.3s; } .is-menu-hover .c-home__nav__item:nth-of-type(6) .c-home__nav__label { transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.35s, transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.35s; } .c-home__nav__track { height: 79px; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1); } .c-home__nav__track__panel { transform: scaleX(0) translateZ(0); transition: transform 1.2s cubic-bezier(0.435, 0.01, 0.135, 1) 0.2s; transform-origin: 0 0; } .c-home__nav__track__panel--right { transform-origin: 100% 0; } .is-menu-hover .c-home__nav__track__panel { transform: scaleX(1) translateZ(0); transition: transform 1s cubic-bezier(0.435, 0.01, 0.135, 1); } /* ================================================== HOME SELECTOR (c-selector) ================================================== */ .c-selector__number { top: 50%; left: -8.33333vw; transform: translateX(0) translateY(-50%) translateZ(0); } .c-selector__item { opacity: 1; transform: translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .c-selector__item.is-disable { opacity: 0.4; } .c-selector__item__number { left: -100px; bottom: 10px; } .c-selector__item__number canvas { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; } .c-selector__item:after, .c-selector__item:before { position: absolute; content: ""; left: 0; bottom: -15px; height: 1px; transform-origin: 0 0; } .c-selector__item:before { width: 30px; background-color: #8a98a8; transform: translateZ(0); transition: opacity 0.45s cubic-bezier(0.165, 0.84, 0.44, 1); } .c-selector__item:after { width: 100%; background-color: #c48a48; opacity: 0; transform: scaleX(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.45s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s; } .c-selector__item-wrapper:hover .c-selector__item:before { opacity: 0; } .c-selector__item-wrapper:hover .c-selector__item:after { opacity: 1; transform: scaleX(1) translateZ(0); transition: transform 1.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.45s cubic-bezier(0.165, 0.84, 0.44, 1); } .c-selector__item-wrapper:hover .c-selector__item__base { opacity: 0; } .c-selector__item-wrapper:hover .c-selector__item__hover { opacity: 1; } .c-selector__item__base, .c-selector__item__hover { transform: translateZ(0); transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1); } .c-selector__item__hover { opacity: 0; } /* ================================================== HOME ELEMENTOS (c-home__) ================================================== */ .c-home__scroll-btn { z-index: 3; opacity: 0; visibility: hidden; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1), visibility 0s 1s; } .is-first .c-home__scroll-btn { opacity: 1; visibility: visible; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1), visibility 0s 0s; } .c-home__line-aside { width: 1px; right: 136px; top: 0; z-index: 0; opacity: 0; transform: translateZ(0); transition: opacity 0.25s; } .c-home__line-aside--bottom { top: auto; bottom: 0; } .c-home__line-aside--bottom-2 { top: auto; } .c-home__footer { opacity: 0; visibility: hidden; transform: translateZ(0); transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1), visibility 0s 1s; } .is-first .c-home__footer { opacity: 1; visibility: visible; transition: opacity 0.55s cubic-bezier(0.165, 0.84, 0.44, 1), visibility 0s 0s; } .c-home__footer__line { width: 42%; } .c-home__footer { z-index: 3; } .c-home__first-subtitle { transform: translateZ(0); transition: opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .is-loading .c-home__first-subtitle { transform: translateZ(0); } .c-home__line { transform-origin: 0 0; opacity: 0.3; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 1s, opacity 0.7s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; transform: scaleX(1) translateZ(0); } .is-loading .c-home__line { opacity: 0; transform: scaleX(0) translateZ(0); } .c-home__scroll { opacity: 1; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 1.3s, opacity 0.75s cubic-bezier(0.23, 1, 0.32, 1) 1.3s; transform: translateX(0) translateZ(0); } .is-loading .c-home__scroll { opacity: 0; transform: translateX(-25px) translateZ(0); } .c-home__grain { background-image: url(../media/images/grain-pattern.png); background-repeat: repeat; } /* ================================================== SCROLL BUTTON (c-btn-scroll) ================================================== */ .c-btn-scroll { bottom: 0; right: 114px; width: 45px; height: 45px; transform: scale(1) translateZ(0); } .c-btn-scroll:hover { transform: scale(1.3) translateZ(0); } .c-btn-scroll__big-bg { width: 150px; height: 150px; top: -52.5px; left: -52.5px; opacity: 0.08; visibility: hidden; transform: scale(0.3) translateZ(0); } .c-btn-scroll:hover .c-btn-scroll__big-bg { opacity: 0; visibility: visible; transform: scale(1) translateZ(0); transition: transform 2s cubic-bezier(0.23, 1, 0.32, 1), opacity 2s cubic-bezier(0.23, 1, 0.32, 1); } .c-btn-scroll__bg:first-of-type { opacity: 0; transition: opacity 0.4s 0.2s; } .c-btn-scroll:hover .c-btn-scroll__bg:first-of-type { opacity: 1; transition: opacity 0s 0s; } .c-btn-scroll__bg:nth-of-type(2) { transform: scaleX(1) translate(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1); } .c-btn-scroll:hover .c-btn-scroll__bg:nth-of-type(2) { transform: scaleX(1.7) translate(-65%, -65%) translateZ(0); transition: transform 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .c-btn-scroll__icon:nth-of-type(2) { opacity: 0; transition: opacity 0.6s 0s; } .c-btn-scroll:hover .c-btn-scroll__icon:nth-of-type(2) { opacity: 1; transition: opacity 0s 0.1s; } /* ================================================== MOUSE SCROLL INDICATOR (c-scroll-mouse) Ícono de mouse con dot animado para indicar scroll. Usado en el hero de index.html y nosotros.html. Sigue el lenguaje visual de Phosphor Icons (light). ================================================== */ @keyframes mouse-scroll-dot { 0% { transform: translateY(0); opacity: 1; } 50% { transform: translateY(10px); opacity: 0; } 51% { transform: translateY(0); opacity: 0; } 80% { opacity: 1; } 100% { transform: translateY(0); opacity: 1; } } .c-scroll-mouse { color: white; cursor: pointer; background: none; border: none; padding: 0; opacity: 0.75; transition: opacity 0.3s; } .c-scroll-mouse:hover { opacity: 1; } .c-scroll-mouse__icon { display: block; } .c-scroll-mouse__dot { transform-box: fill-box; transform-origin: center; animation: mouse-scroll-dot 2s cubic-bezier(0.23, 1, 0.32, 1) infinite; } /* ================================================== PUZZLE PIECES (c-puzzle) ================================================== */ .c-puzzle__piece { background-color: #0c1a2a; } .c-puzzle__piece:first-of-type { left: -75%; top: 0; width: 100%; height: 100%; opacity: 0.49; transform: skewX(-25deg) translateZ(0); transition: opacity 2.2s cubic-bezier(0.23, 1, 0.32, 1) 0.8s; } .is-loading .c-puzzle__piece:first-of-type { opacity: 1 !important; } .c-puzzle__piece:nth-of-type(2) { left: 48%; top: 0; width: 5%; height: 100%; opacity: 0.49; transform: skewX(-25deg) translateZ(0); transition: opacity 2.2s cubic-bezier(0.23, 1, 0.32, 1) 0.7s; } .is-loading .c-puzzle__piece:nth-of-type(2) { opacity: 1 !important; } .c-puzzle__piece:nth-of-type(3) { left: 76%; top: 0; width: 100%; height: 100%; opacity: 0.49; transform: skewX(-25deg) translateZ(0); transition: opacity 2.2s cubic-bezier(0.23, 1, 0.32, 1) 0.6s; } .is-loading .c-puzzle__piece:nth-of-type(3) { opacity: 1 !important; } .c-puzzle__piece--anim { background-color: transparent; } .c-puzzle__piece--anim:first-of-type { transform: skewX(-25deg) translateX(-32vw) translateZ(0); } .is-active .c-puzzle__piece--anim:first-of-type { transform: skewX(-25deg) translateX(0) translateZ(0); transition: transform 5.2s cubic-bezier(0, 1.01, 0, 1) 0s; } .is-leaving .c-puzzle__piece--anim:first-of-type { transform: skewX(-25deg) translateX(15vw) translateZ(0); transition: transform 5s cubic-bezier(0.23, 1, 0.32, 1) 0s; } .c-puzzle__piece--anim:nth-of-type(2) { opacity: 1; transform: skewX(-25deg) translateX(-32vw) translateZ(0); } .is-active .c-puzzle__piece--anim:nth-of-type(2) { transform: skewX(-25deg) translateX(0) translateZ(0); transition: transform 5.2s cubic-bezier(0, 1.01, 0, 1) 0s; } .is-leaving .c-puzzle__piece--anim:nth-of-type(2) { transform: skewX(-25deg) translateX(15vw) translateZ(0); transition: transform 5s cubic-bezier(0.23, 1, 0.32, 1) 0s; } .c-puzzle__piece--anim:nth-of-type(3) { transform: skewX(-25deg) translateX(-32vw) translateZ(0); } .is-active .c-puzzle__piece--anim:nth-of-type(3) { transform: skewX(-25deg) translateX(0) translateZ(0); transition: transform 5.2s cubic-bezier(0, 1.01, 0, 1) 0s; } .is-leaving .c-puzzle__piece--anim:nth-of-type(3) { transform: skewX(-25deg) translateX(15vw) translateZ(0); transition: transform 5s cubic-bezier(0.23, 1, 0.32, 1) 0s; } .c-puzzle__piece--anim:nth-of-type(4) { transform: skewX(-25deg) translateX(-32vw) translateZ(0); } .is-active .c-puzzle__piece--anim:nth-of-type(4) { transform: skewX(-25deg) translateX(0) translateZ(0); transition: transform 5.2s cubic-bezier(0, 1.01, 0, 1) 0s; } .is-leaving .c-puzzle__piece--anim:nth-of-type(4) { transform: skewX(-25deg) translateX(15vw) translateZ(0); transition: transform 5s cubic-bezier(0.23, 1, 0.32, 1) 0s; } .c-puzzle__piece--anim:nth-of-type(5) { transform: skewX(-25deg) translateX(-32vw) translateZ(0); } .is-active .c-puzzle__piece--anim:nth-of-type(5) { transform: skewX(-25deg) translateX(0) translateZ(0); transition: transform 5.2s cubic-bezier(0, 1.01, 0, 1) 0s; } .is-leaving .c-puzzle__piece--anim:nth-of-type(5) { transform: skewX(-25deg) translateX(15vw) translateZ(0); transition: transform 5s cubic-bezier(0.23, 1, 0.32, 1) 0s; } .c-puzzle__piece__image { transform: skewX(25deg) translateZ(0); } .c-puzzle__piece:nth-of-type(2) .c-puzzle__piece__image { left: -25vw; } .c-puzzle__piece:nth-of-type(3) .c-puzzle__piece__image { left: -48vw; } .c-puzzle__piece__mask-in { opacity: 0; background-color: #0e2240; transition: transform 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; } .c-puzzle__piece--anim:nth-of-type(2) .c-puzzle__piece__mask-in { transform: translateX(-40%) translateZ(0); } .c-puzzle__piece--anim:nth-of-type(3) .c-puzzle__piece__mask-in { transform: translateX(40%) translateZ(0); } .c-puzzle__piece__mask-out { opacity: 0; transition: transform 1.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0s, opacity 0.8s cubic-bezier(0.165, 0.84, 0.44, 1) 0s; } .c-puzzle__piece--anim:nth-of-type(2) .c-puzzle__piece__mask-out { transform: translateX(40%) scale(1.2) translateZ(0); } .c-puzzle__piece--anim:nth-of-type(3) .c-puzzle__piece__mask-out { transform: translateX(-40%) scale(1.2) translateZ(0); } /* ================================================== LÍNEAS (c-line) ================================================== */ .c-line { opacity: 0.2; } .c-line--x { height: 1px; } .c-line--y { width: 1px; } /* ================================================== PAGE HEADER (c-page) ================================================== */ .c-page__header { width: 1600px; height: 900px; } /* ================================================== UTILIDADES - LAYOUT ================================================== */ .u-w1of2 { width: 50%; } .u-w1of3 { width: 33.333333333333336%; } .u-w2of3 { width: 66.66666666666667%; } .u-w4of5 { width: 80%; } .u-w2of6 { width: 33.333333333333336%; } .u-w4of6 { width: 66.66666666666667%; } .u-w5of9 { width: 55.55555555555556%; } .u-w2of10 { width: 20%; } .u-w3of12 { width: 25%; } .u-w4of12 { width: 33.333%; } .u-w5of12 { width: 41.667%; } .u-w6of12 { width: 50%; } .u-w7of12 { width: 58.333%; } .u-w8of10 { width: 80%; } .u-w9of12 { width: 75%; } .u-w10of12 { width: 83.333%; } .u-w8of12 { width: 66.667%; } .u-w9of10 { width: 90%; } .u-w1of10 { width: 10%; } .u-w3of10 { width: 30%; } .u-pad-r-w1of4 { padding-right: 25%; } .u-pad-r-w1of12 { padding-right: 8.333%; } .u-marg-t-sm { margin-top: 10px; } .u-marg-t-vh1of20 { margin-top: 5vh; } .u-marg-b-sm { margin-bottom: 10px; } .u-marg-t-0 { margin-top: 0; } .u-marg-b-0 { margin-bottom: 0; } .u-opacity--15 { opacity: 0.15; } .u-opacity--40 { opacity: 0.4; } .u-pad-t-xxl { padding-top: 130px; } .u-pad-b-xxl { padding-bottom: 130px; } .u-pad-l-w1of8 { padding-left: 12.5%; } .u-pad-l-w1of12 { padding-left: 8.333%; } .u-inline-block { display: inline-block; } .u-block { display: block; } .u-fit { width: 100%; height: 100%; } .u-fit-w { width: 100%; } .u-fit-h { height: 100%; } .u-viewport-fit-h { height: 100vh; } /* ================================================== UTILIDADES - POSICIÓN ================================================== */ .u-pos-b { bottom: 0; } .u-absolute { position: absolute; } .u-fixed { position: fixed; will-change: transform; } .u-relative { position: relative; } .u-pos-tl { top: 0; left: 0; } .u-pos-l { left: 0; } .u-pos-y-center { top: 50%; transform: translateY(-50%); } .u-pos-r { right: 0; } .u-pos-tr { top: 0; right: 0; } .u-pos-bl { bottom: 0; left: 0; } .u-pos-br { bottom: 0; right: 0; } .u-pos-center { top: 50%; left: 50%; transform: translate(-50%, -50%); } /* ================================================== UTILIDADES - ESPACIADO ================================================== */ .u-marg-l-w1of9 { margin-left: 11.11111111111111%; } .u-pad-l-w1of9 { padding-left: 11.11111111111111%; } .u-marg-l-w1of12 { margin-left: 8.333333333333334%; } .u-pad-x-w1of12 { padding-right: 8.333333333333334%; } .u-pad-l-w1of12, .u-pad-x-w1of12 { padding-left: 8.333333333333334%; } .u-marg-b-vh1of12 { margin-bottom: 8.333333333333334vh; } .u-pad-l-w3of12, .u-pad-x-w3of12 { padding-left: 25%; } .u-marg-b-vh1of20 { margin-bottom: 5vh; } .u-marg-t-xs { margin-top: 5px; } .u-marg-b-xs { margin-bottom: 5px; } .u-marg-r-md { margin-right: 30px; } .u-marg-b-md { margin-bottom: 30px; } .u-marg-t-lg { margin-top: 55px; } .u-marg-r-lg { margin-right: 55px; } .u-marg-t-xl { margin-top: 80px; } .u-marg-b-xl { margin-bottom: 80px; } .u-marg-b-xxl { margin-bottom: 130px; } .u-marg-t-xxl { margin-top: 130px; } .u-pad-x-sm { padding-left: 15px; } .u-pad-x-sm { padding-right: 15px; } .u-pad-b-lg { padding-bottom: 55px; } /* ================================================== UTILIDADES - COLOR ================================================== */ .u-color--black { color: #0c1a2a; } .u-color--white { color: #fff; } .u-color--alpha-white { color: hsla(0, 0%, 100%, 0.5); } .u-color--gray-light { color: #a4aeba; } .u-color--gray { color: #8a98a8; } .u-color--gray-dark { color: #8a98a8; } .u-color--brand-blue { color: #c48a48; } .u-color--brand-blue-light { color: #3470c0; } .u-color--brand-blue-title { color: #163252; } .u-color--brand-dark { color: #0e2240; } .u-color--brand-darkest { color: #0e2240; } .u-color--brand-darker { color: #0c1a2a; } .u-bg--black { background-color: #0c1a2a; } .u-bg--white { background-color: #fff; } .u-bg--gray-lighter { background-color: #f0f2f5; } .u-bg--gray-light { background-color: #a4aeba; } .u-bg--gray { background-color: #8a98a8; } .u-bg--gray-dark { background-color: #8a98a8; } .u-bg--brand-blue { background-color: #3470c0; } .u-bg--brand-blue-dark { background-color: #163252; } .u-bg--brand-dark { background-color: #0e2240; } .u-bg--brand-darkest { background-color: #0e2240; } .u-bg--brand-darker { background-color: #0c1a2a; } /* ================================================== UTILIDADES - FLEX ================================================== */ .u-flex { display: flex; } .u-flex-fd--row { flex-direction: row; } .u-flex-fd--row-reverse { flex-direction: row-reverse; } .u-flex-fd--column { flex-direction: column; } .u-flex-fd--column-reverse { flex-direction: column-reverse; } .u-flex-fw--nowrap { flex-wrap: nowrap; } .u-flex-fw--wrap { flex-wrap: wrap; } .u-flex-fw--wrap-reverse { flex-wrap: wrap-reverse; } .u-flex-jc--end { justify-content: flex-end; } .u-flex-jc--center { justify-content: center; } .u-flex-jc--start { justify-content: flex-start; } .u-flex-jc--space-between { justify-content: space-between; } .u-flex-jc--space-around { justify-content: space-around; } .u-flex-jc--space-evenly { justify-content: space-evenly; } .u-flex-ai--end { align-items: flex-end; } .u-flex-ai--center { align-items: center; } .u-flex-ai--start { align-items: flex-start; } .u-flex-ai--baseline { align-items: baseline; } .u-flex-ai--stretch { align-items: stretch; } .u-flex-ac--start { align-content: flex-start; } .u-flex-ac--end { align-content: flex-end; } .u-flex-ac--center { align-content: center; } .u-flex-ac--space-between { align-content: space-between; } .u-flex-ac--space-around { align-content: space-around; } .u-flex-ac--stretch { align-content: stretch; } .u-flex__item-as--auto { align-self: flex-auto; } .u-flex__item-as--start { align-self: flex-start; } .u-flex__item-as--end { align-self: flex-end; } .u-flex__item-as--center { align-self: center; } .u-flex__item-as--baseline { align-self: baseline; } .u-flex__item-as--stretch { align-self: stretch; } /* ================================================== UTILIDADES - MISC ================================================== */ .u-zindex--1 { z-index: 1; } .u-zindex--2 { z-index: 2; } .u-zindex--3 { z-index: 3; } .u-zindex--4 { z-index: 4; } .u-opacity--30 { opacity: 0.3; } .u-opacity--74 { opacity: 0.74; } .u-force-3d { transform: translateZ(0); } .u-align-center { text-align: center; } .u-align-right { text-align: right; } .u-align-left { text-align: left; } .u-valign-top { vertical-align: top; } .u-valign-bottom { vertical-align: bottom; } .u-valign-middle { vertical-align: middle; } .u-uppercase { text-transform: uppercase; } .u-overflow-h { overflow: hidden; } .u-cursor-pointer { cursor: pointer; } .u-shape-circle { border-radius: 50%; } .u-pointer-none { pointer-events: none; } .u-object-fit-cover { object-fit: cover; } .u-force-inline { white-space: nowrap; } .is-active .c-scroll-object__item { opacity: 1; transform: translateY(0) translateZ(0); } .is-active .c-scroll-object__item:first-of-type { transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.15s, opacity 0.45s cubic-bezier(0.165, 0.84, 0.44, 1) 0.15s; } .is-active .c-scroll-object__item:nth-of-type(2) { transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.25s, opacity 0.45s cubic-bezier(0.165, 0.84, 0.44, 1) 0.25s; } .is-active .c-scroll-object__item:nth-of-type(3) { transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.35s, opacity 0.45s cubic-bezier(0.165, 0.84, 0.44, 1) 0.35s; } .c-loader.is-active { opacity: 1; transition: opacity 0.4s; } .c-vcc__section .vcc-slideshow-btn.is-active { opacity: 1; } .vcc-table-w .table-vcc a .is-active { display: inline-block; } .is-active .c-borrowers__section-2__list__item__line { transform: scaleX(1) translateZ(0); } .c-blog__article.is-first, .c-blog__header.is-first { border-top: 1px solid hsla(0, 0%, 51%, 0.2); } .c-blog__footer__pagination__page.is-active:after, .c-blog__footer__pagination__page:hover:after { transform: translateY(2px) translateZ(0); opacity: 1; } .is-active .c-about__section-2__list__item__line { transform: scaleX(1) translateZ(0); } .is-active .c-about__fact__offse-letter span { opacity: 1; transform: translateY(0) translateZ(0); } .is-active .c-about-fact__link { opacity: 1; transition: opacity 0.4s 0.5s; } .is-active .c-about__item__mask-in, .is-active .c-about__item__mask-out { transform: translateX(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.4s; } .is-active .c-about__item__mask-unity { transform: translateX(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.4s; } .is-active .c-about__fact--2__line { transform: scaleX(1) translateZ(0); } .c-about__fact--2__box.is-active { opacity: 1; transform: translateX(0) translateY(0) translateZ(0); } .c-about__fact--8__box.is-active { opacity: 1; transform: translateX(0) translateY(0) translateZ(0); } .c-about__nav__item.is-active .c-about__nav__dot { opacity: 1; } .is-active .c--about__fact--1__graph__path { stroke-dashoffset: 0; } .is-active .c--about__fact--1__graph__path:first-child { transition-delay: 0.2s; } .is-active .c--about__fact--1__graph__path:nth-child(2) { transition-delay: 0.3s; } .is-active .c--about__fact--1__graph__path:nth-child(3) { transition-delay: 0.4s; } .is-active .c--about__fact--1__graph__path:nth-child(4) { transition-delay: 0.5s; } .is-first-home .c-sliced-text__part:first-of-type { transition: transform 1.3s cubic-bezier(0.23, 1, 0.32, 1) 0.6s, opacity 1.3s cubic-bezier(0.23, 1, 0.32, 1) 0.6s, visibility 0s 2s; } .is-first-home .c-sliced-text__part:nth-of-type(2) { transition: transform 1.3s cubic-bezier(0.23, 1, 0.32, 1) 0.7s, opacity 1.3s cubic-bezier(0.23, 1, 0.32, 1) 0.7s, visibility 0s 2s; } .is-first-home .c-sliced-text__part:nth-of-type(3) { transition: transform 1.3s cubic-bezier(0.23, 1, 0.32, 1) 0.7s, opacity 1.3s cubic-bezier(0.23, 1, 0.32, 1) 0.7s, visibility 0s 2s; } .c-partners-slideshow__grid.is-first { border-bottom: 1px solid hsla(0, 0%, 51%, 0.12); } .c-partners-slideshow__grid.is-first .c-partners-slideshow__grid__item { border-top: 1px solid hsla(0, 0%, 51%, 0.12); } .c-partners-slideshow__grid.is-first .c-partners-slideshow__grid__item:nth-of-type(2n + 2):after, .c-partners-slideshow__grid.is-first .c-partners-slideshow__grid__item:nth-of-type(4n + 3):after { position: absolute; content: ""; left: 0; top: 3px; bottom: 3px; width: 1px; background: hsla(0, 0%, 51%, 0.12); } .c-partners-slideshow__dot.is-active, .c-partners-slideshow__dot:hover { transform: scale(1.5) translateZ(0); opacity: 1; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:first-of-type .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.411872162870664s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(2) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.416203026533009s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(3) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.482520736342554s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(4) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.476185472632404s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(5) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.448178811764952s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(6) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.402895496245778s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(7) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.371658327031047s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(8) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.363674570644531s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(9) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.318343521956967s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(10) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.394859149785427s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(11) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.428235925411201s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item:nth-of-type(12) .c-partners-slideshow__grid__item__logo { transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay: 0.496789106166493s; } .c-partners-slideshow__grid.is-active .c-partners-slideshow__grid__item__logo { opacity: 1; } .c-footer__link.is-active, .c-footer__link:hover { opacity: 1; } .c-facts__title.is-active { opacity: 1; } /* ================================================== MEDIA QUERIES ================================================== */ @media screen and (max-width: 1280px) { .t-h2 { font-size: 43px; font-size: 2.6875rem; } } @media screen and (max-width: 770px) { .t-h2 { font-size: 30px; font-size: 1.875rem; } } @media screen and (max-width: 770px) { .c-btn-scroll { right: 35px; } } @media screen and (max-width: 1024px) { .c-puzzle__piece:first-of-type { left: -50%; width: 55%; } } @media screen and (max-width: 1024px) { .c-puzzle__piece:nth-of-type(2) { left: 43%; width: 10%; } } @media screen and (max-width: 1024px) { .c-puzzle__piece:nth-of-type(3) { left: 91%; width: 60%; } } @media screen and (max-width: 1400px) { .u-flex\@xl { display: flex; } } @media screen and (max-width: 1280px) { .u-flex\@lg { display: flex; } } @media screen and (max-width: 1024px) { .u-flex\@md { display: flex; } } @media screen and (max-width: 770px) { .u-flex\@sm { display: flex; } } @media screen and (max-width: 360px) { .u-flex\@xs { display: flex; } } @media screen and (max-width: 1400px) { .u-flex-fd--row\@xl { flex-direction: row; } } @media screen and (max-width: 1280px) { .u-flex-fd--row\@lg { flex-direction: row; } } @media screen and (max-width: 1024px) { .u-flex-fd--row\@md { flex-direction: row; } } @media screen and (max-width: 770px) { .u-flex-fd--row\@sm { flex-direction: row; } } @media screen and (max-width: 360px) { .u-flex-fd--row\@xs { flex-direction: row; } } @media screen and (max-width: 1400px) { .u-flex-fd--row-reverse\@xl { flex-direction: row-reverse; } } @media screen and (max-width: 1280px) { .u-flex-fd--row-reverse\@lg { flex-direction: row-reverse; } } @media screen and (max-width: 1024px) { .u-flex-fd--row-reverse\@md { flex-direction: row-reverse; } } @media screen and (max-width: 770px) { .u-flex-fd--row-reverse\@sm { flex-direction: row-reverse; } } @media screen and (max-width: 360px) { .u-flex-fd--row-reverse\@xs { flex-direction: row-reverse; } } @media screen and (max-width: 1400px) { .u-flex-fd--column\@xl { flex-direction: column; } } @media screen and (max-width: 1280px) { .u-flex-fd--column\@lg { flex-direction: column; } } @media screen and (max-width: 1024px) { .u-flex-fd--column\@md { flex-direction: column; } } @media screen and (max-width: 770px) { .u-flex-fd--column\@sm { flex-direction: column; } } @media screen and (max-width: 360px) { .u-flex-fd--column\@xs { flex-direction: column; } } @media screen and (max-width: 1400px) { .u-flex-fd--column-reverse\@xl { flex-direction: column-reverse; } } @media screen and (max-width: 1280px) { .u-flex-fd--column-reverse\@lg { flex-direction: column-reverse; } } @media screen and (max-width: 1024px) { .u-flex-fd--column-reverse\@md { flex-direction: column-reverse; } } @media screen and (max-width: 770px) { .u-flex-fd--column-reverse\@sm { flex-direction: column-reverse; } } @media screen and (max-width: 360px) { .u-flex-fd--column-reverse\@xs { flex-direction: column-reverse; } } @media screen and (max-width: 1400px) { .u-flex-fw--nowrap\@xl { flex-wrap: nowrap; } } @media screen and (max-width: 1280px) { .u-flex-fw--nowrap\@lg { flex-wrap: nowrap; } } @media screen and (max-width: 1024px) { .u-flex-fw--nowrap\@md { flex-wrap: nowrap; } } @media screen and (max-width: 770px) { .u-flex-fw--nowrap\@sm { flex-wrap: nowrap; } } @media screen and (max-width: 360px) { .u-flex-fw--nowrap\@xs { flex-wrap: nowrap; } } @media screen and (max-width: 1400px) { .u-flex-fw--wrap\@xl { flex-wrap: wrap; } } @media screen and (max-width: 1280px) { .u-flex-fw--wrap\@lg { flex-wrap: wrap; } } @media screen and (max-width: 1024px) { .u-flex-fw--wrap\@md { flex-wrap: wrap; } } @media screen and (max-width: 770px) { .u-flex-fw--wrap\@sm { flex-wrap: wrap; } } @media screen and (max-width: 360px) { .u-flex-fw--wrap\@xs { flex-wrap: wrap; } } @media screen and (max-width: 1400px) { .u-flex-fw--wrap-reverse\@xl { flex-wrap: wrap-reverse; } } @media screen and (max-width: 1280px) { .u-flex-fw--wrap-reverse\@lg { flex-wrap: wrap-reverse; } } @media screen and (max-width: 1024px) { .u-flex-fw--wrap-reverse\@md { flex-wrap: wrap-reverse; } } @media screen and (max-width: 770px) { .u-flex-fw--wrap-reverse\@sm { flex-wrap: wrap-reverse; } } @media screen and (max-width: 360px) { .u-flex-fw--wrap-reverse\@xs { flex-wrap: wrap-reverse; } } @media screen and (max-width: 1400px) { .u-flex-jc--end\@xl { justify-content: flex-end; } } @media screen and (max-width: 1280px) { .u-flex-jc--end\@lg { justify-content: flex-end; } } @media screen and (max-width: 1024px) { .u-flex-jc--end\@md { justify-content: flex-end; } } @media screen and (max-width: 770px) { .u-flex-jc--end\@sm { justify-content: flex-end; } } @media screen and (max-width: 360px) { .u-flex-jc--end\@xs { justify-content: flex-end; } } @media screen and (max-width: 1400px) { .u-flex-jc--center\@xl { justify-content: center; } } @media screen and (max-width: 1280px) { .u-flex-jc--center\@lg { justify-content: center; } } @media screen and (max-width: 1024px) { .u-flex-jc--center\@md { justify-content: center; } } @media screen and (max-width: 770px) { .u-flex-jc--center\@sm { justify-content: center; } } @media screen and (max-width: 360px) { .u-flex-jc--center\@xs { justify-content: center; } } @media screen and (max-width: 1400px) { .u-flex-jc--start\@xl { justify-content: flex-start; } } @media screen and (max-width: 1280px) { .u-flex-jc--start\@lg { justify-content: flex-start; } } @media screen and (max-width: 1024px) { .u-flex-jc--start\@md { justify-content: flex-start; } } @media screen and (max-width: 770px) { .u-flex-jc--start\@sm { justify-content: flex-start; } } @media screen and (max-width: 360px) { .u-flex-jc--start\@xs { justify-content: flex-start; } } @media screen and (max-width: 1400px) { .u-flex-jc--space-between\@xl { justify-content: space-between; } } @media screen and (max-width: 1280px) { .u-flex-jc--space-between\@lg { justify-content: space-between; } } @media screen and (max-width: 1024px) { .u-flex-jc--space-between\@md { justify-content: space-between; } } @media screen and (max-width: 770px) { .u-flex-jc--space-between\@sm { justify-content: space-between; } } @media screen and (max-width: 360px) { .u-flex-jc--space-between\@xs { justify-content: space-between; } } @media screen and (max-width: 1400px) { .u-flex-jc--space-around\@xl { justify-content: space-around; } } @media screen and (max-width: 1280px) { .u-flex-jc--space-around\@lg { justify-content: space-around; } } @media screen and (max-width: 1024px) { .u-flex-jc--space-around\@md { justify-content: space-around; } } @media screen and (max-width: 770px) { .u-flex-jc--space-around\@sm { justify-content: space-around; } } @media screen and (max-width: 360px) { .u-flex-jc--space-around\@xs { justify-content: space-around; } } @media screen and (max-width: 1400px) { .u-flex-jc--space-evenly\@xl { justify-content: space-evenly; } } @media screen and (max-width: 1280px) { .u-flex-jc--space-evenly\@lg { justify-content: space-evenly; } } @media screen and (max-width: 1024px) { .u-flex-jc--space-evenly\@md { justify-content: space-evenly; } } @media screen and (max-width: 770px) { .u-flex-jc--space-evenly\@sm { justify-content: space-evenly; } } @media screen and (max-width: 360px) { .u-flex-jc--space-evenly\@xs { justify-content: space-evenly; } } @media screen and (max-width: 1400px) { .u-flex-ai--end\@xl { align-items: flex-end; } } @media screen and (max-width: 1280px) { .u-flex-ai--end\@lg { align-items: flex-end; } } @media screen and (max-width: 1024px) { .u-flex-ai--end\@md { align-items: flex-end; } } @media screen and (max-width: 770px) { .u-flex-ai--end\@sm { align-items: flex-end; } } @media screen and (max-width: 360px) { .u-flex-ai--end\@xs { align-items: flex-end; } } @media screen and (max-width: 1400px) { .u-flex-ai--center\@xl { align-items: center; } } @media screen and (max-width: 1280px) { .u-flex-ai--center\@lg { align-items: center; } } @media screen and (max-width: 1024px) { .u-flex-ai--center\@md { align-items: center; } } @media screen and (max-width: 770px) { .u-flex-ai--center\@sm { align-items: center; } } @media screen and (max-width: 360px) { .u-flex-ai--center\@xs { align-items: center; } } @media screen and (max-width: 1400px) { .u-flex-ai--start\@xl { align-items: flex-start; } } @media screen and (max-width: 1280px) { .u-flex-ai--start\@lg { align-items: flex-start; } } @media screen and (max-width: 1024px) { .u-flex-ai--start\@md { align-items: flex-start; } } @media screen and (max-width: 770px) { .u-flex-ai--start\@sm { align-items: flex-start; } } @media screen and (max-width: 360px) { .u-flex-ai--start\@xs { align-items: flex-start; } } @media screen and (max-width: 1400px) { .u-flex-ai--baseline\@xl { align-items: baseline; } } @media screen and (max-width: 1280px) { .u-flex-ai--baseline\@lg { align-items: baseline; } } @media screen and (max-width: 1024px) { .u-flex-ai--baseline\@md { align-items: baseline; } } @media screen and (max-width: 770px) { .u-flex-ai--baseline\@sm { align-items: baseline; } } @media screen and (max-width: 360px) { .u-flex-ai--baseline\@xs { align-items: baseline; } } @media screen and (max-width: 1400px) { .u-flex-ai--stretch\@xl { align-items: stretch; } } @media screen and (max-width: 1280px) { .u-flex-ai--stretch\@lg { align-items: stretch; } } @media screen and (max-width: 1024px) { .u-flex-ai--stretch\@md { align-items: stretch; } } @media screen and (max-width: 770px) { .u-flex-ai--stretch\@sm { align-items: stretch; } } @media screen and (max-width: 360px) { .u-flex-ai--stretch\@xs { align-items: stretch; } } @media screen and (max-width: 1400px) { .u-flex-ac--start\@xl { align-content: flex-start; } } @media screen and (max-width: 1280px) { .u-flex-ac--start\@lg { align-content: flex-start; } } @media screen and (max-width: 1024px) { .u-flex-ac--start\@md { align-content: flex-start; } } @media screen and (max-width: 770px) { .u-flex-ac--start\@sm { align-content: flex-start; } } @media screen and (max-width: 360px) { .u-flex-ac--start\@xs { align-content: flex-start; } } @media screen and (max-width: 1400px) { .u-flex-ac--end\@xl { align-content: flex-end; } } @media screen and (max-width: 1280px) { .u-flex-ac--end\@lg { align-content: flex-end; } } @media screen and (max-width: 1024px) { .u-flex-ac--end\@md { align-content: flex-end; } } @media screen and (max-width: 770px) { .u-flex-ac--end\@sm { align-content: flex-end; } } @media screen and (max-width: 360px) { .u-flex-ac--end\@xs { align-content: flex-end; } } @media screen and (max-width: 1400px) { .u-flex-ac--center\@xl { align-content: center; } } @media screen and (max-width: 1280px) { .u-flex-ac--center\@lg { align-content: center; } } @media screen and (max-width: 1024px) { .u-flex-ac--center\@md { align-content: center; } } @media screen and (max-width: 770px) { .u-flex-ac--center\@sm { align-content: center; } } @media screen and (max-width: 360px) { .u-flex-ac--center\@xs { align-content: center; } } @media screen and (max-width: 1400px) { .u-flex-ac--space-between\@xl { align-content: space-between; } } @media screen and (max-width: 1280px) { .u-flex-ac--space-between\@lg { align-content: space-between; } } @media screen and (max-width: 1024px) { .u-flex-ac--space-between\@md { align-content: space-between; } } @media screen and (max-width: 770px) { .u-flex-ac--space-between\@sm { align-content: space-between; } } @media screen and (max-width: 360px) { .u-flex-ac--space-between\@xs { align-content: space-between; } } @media screen and (max-width: 1400px) { .u-flex-ac--space-around\@xl { align-content: space-around; } } @media screen and (max-width: 1280px) { .u-flex-ac--space-around\@lg { align-content: space-around; } } @media screen and (max-width: 1024px) { .u-flex-ac--space-around\@md { align-content: space-around; } } @media screen and (max-width: 770px) { .u-flex-ac--space-around\@sm { align-content: space-around; } } @media screen and (max-width: 360px) { .u-flex-ac--space-around\@xs { align-content: space-around; } } @media screen and (max-width: 1400px) { .u-flex-ac--stretch\@xl { align-content: stretch; } } @media screen and (max-width: 1280px) { .u-flex-ac--stretch\@lg { align-content: stretch; } } @media screen and (max-width: 1024px) { .u-flex-ac--stretch\@md { align-content: stretch; } } @media screen and (max-width: 770px) { .u-flex-ac--stretch\@sm { align-content: stretch; } } @media screen and (max-width: 360px) { .u-flex-ac--stretch\@xs { align-content: stretch; } } @media screen and (max-width: 1400px) { .u-flex__item-as--auto\@xl { align-self: flex-auto; } } @media screen and (max-width: 1280px) { .u-flex__item-as--auto\@lg { align-self: flex-auto; } } @media screen and (max-width: 1024px) { .u-flex__item-as--auto\@md { align-self: flex-auto; } } @media screen and (max-width: 770px) { .u-flex__item-as--auto\@sm { align-self: flex-auto; } } @media screen and (max-width: 360px) { .u-flex__item-as--auto\@xs { align-self: flex-auto; } } @media screen and (max-width: 1400px) { .u-flex__item-as--start\@xl { align-self: flex-start; } } @media screen and (max-width: 1280px) { .u-flex__item-as--start\@lg { align-self: flex-start; } } @media screen and (max-width: 1024px) { .u-flex__item-as--start\@md { align-self: flex-start; } } @media screen and (max-width: 770px) { .u-flex__item-as--start\@sm { align-self: flex-start; } } @media screen and (max-width: 360px) { .u-flex__item-as--start\@xs { align-self: flex-start; } } @media screen and (max-width: 1400px) { .u-flex__item-as--end\@xl { align-self: flex-end; } } @media screen and (max-width: 1280px) { .u-flex__item-as--end\@lg { align-self: flex-end; } } @media screen and (max-width: 1024px) { .u-flex__item-as--end\@md { align-self: flex-end; } } @media screen and (max-width: 770px) { .u-flex__item-as--end\@sm { align-self: flex-end; } } @media screen and (max-width: 360px) { .u-flex__item-as--end\@xs { align-self: flex-end; } } @media screen and (max-width: 1400px) { .u-flex__item-as--center\@xl { align-self: center; } } @media screen and (max-width: 1280px) { .u-flex__item-as--center\@lg { align-self: center; } } @media screen and (max-width: 1024px) { .u-flex__item-as--center\@md { align-self: center; } } @media screen and (max-width: 770px) { .u-flex__item-as--center\@sm { align-self: center; } } @media screen and (max-width: 360px) { .u-flex__item-as--center\@xs { align-self: center; } } @media screen and (max-width: 1400px) { .u-flex__item-as--baseline\@xl { align-self: baseline; } } @media screen and (max-width: 1280px) { .u-flex__item-as--baseline\@lg { align-self: baseline; } } @media screen and (max-width: 1024px) { .u-flex__item-as--baseline\@md { align-self: baseline; } } @media screen and (max-width: 770px) { .u-flex__item-as--baseline\@sm { align-self: baseline; } } @media screen and (max-width: 360px) { .u-flex__item-as--baseline\@xs { align-self: baseline; } } @media screen and (max-width: 1400px) { .u-flex__item-as--stretch\@xl { align-self: stretch; } } @media screen and (max-width: 1280px) { .u-flex__item-as--stretch\@lg { align-self: stretch; } } @media screen and (max-width: 1024px) { .u-flex__item-as--stretch\@md { align-self: stretch; } } @media screen and (max-width: 770px) { .u-flex__item-as--stretch\@sm { align-self: stretch; } } @media screen and (max-width: 360px) { .u-flex__item-as--stretch\@xs { align-self: stretch; } } @media screen and (max-width: 1400px) { .u-marg-l-w1of2\@xl { margin-left: 50%; } .u-marg-r-w1of2\@xl { margin-right: 50%; } .u-marg-b-vh1of2\@xl { margin-bottom: 50vh; } .u-marg-l-w2of2\@xl { margin-left: 100%; } .u-marg-r-w2of2\@xl { margin-right: 100%; } .u-marg-b-vh2of2\@xl { margin-bottom: 100vh; } .u-marg-l-w1of3\@xl { margin-left: 33.333333333333336%; } .u-marg-r-w1of3\@xl { margin-right: 33.333333333333336%; } .u-marg-b-vh1of3\@xl { margin-bottom: 33.333333333333336vh; } .u-marg-l-w2of3\@xl { margin-left: 66.66666666666667%; } .u-marg-r-w2of3\@xl { margin-right: 66.66666666666667%; } .u-marg-b-vh2of3\@xl { margin-bottom: 66.66666666666667vh; } .u-marg-l-w3of3\@xl { margin-left: 100%; } .u-marg-r-w3of3\@xl { margin-right: 100%; } .u-marg-b-vh3of3\@xl { margin-bottom: 100vh; } .u-marg-l-w1of4\@xl { margin-left: 25%; } .u-marg-r-w1of4\@xl { margin-right: 25%; } .u-marg-b-vh1of4\@xl { margin-bottom: 25vh; } .u-marg-l-w2of4\@xl { margin-left: 50%; } .u-marg-r-w2of4\@xl { margin-right: 50%; } .u-marg-b-vh2of4\@xl { margin-bottom: 50vh; } .u-marg-l-w3of4\@xl { margin-left: 75%; } .u-marg-r-w3of4\@xl { margin-right: 75%; } .u-marg-b-vh3of4\@xl { margin-bottom: 75vh; } .u-marg-l-w4of4\@xl { margin-left: 100%; } .u-marg-r-w4of4\@xl { margin-right: 100%; } .u-marg-b-vh4of4\@xl { margin-bottom: 100vh; } .u-marg-l-w1of5\@xl { margin-left: 20%; } .u-marg-r-w1of5\@xl { margin-right: 20%; } .u-marg-b-vh1of5\@xl { margin-bottom: 20vh; } .u-marg-l-w2of5\@xl { margin-left: 40%; } .u-marg-r-w2of5\@xl { margin-right: 40%; } .u-marg-b-vh2of5\@xl { margin-bottom: 40vh; } .u-marg-l-w3of5\@xl { margin-left: 60%; } .u-marg-r-w3of5\@xl { margin-right: 60%; } .u-marg-b-vh3of5\@xl { margin-bottom: 60vh; } .u-marg-l-w4of5\@xl { margin-left: 80%; } .u-marg-r-w4of5\@xl { margin-right: 80%; } .u-marg-b-vh4of5\@xl { margin-bottom: 80vh; } .u-marg-l-w5of5\@xl { margin-left: 100%; } .u-marg-r-w5of5\@xl { margin-right: 100%; } .u-marg-b-vh5of5\@xl { margin-bottom: 100vh; } .u-marg-l-w1of6\@xl { margin-left: 16.666666666666668%; } .u-marg-r-w1of6\@xl { margin-right: 16.666666666666668%; } .u-marg-b-vh1of6\@xl { margin-bottom: 16.666666666666668vh; } .u-marg-l-w2of6\@xl { margin-left: 33.333333333333336%; } .u-marg-r-w2of6\@xl { margin-right: 33.333333333333336%; } .u-marg-b-vh2of6\@xl { margin-bottom: 33.333333333333336vh; } .u-marg-l-w3of6\@xl { margin-left: 50%; } .u-marg-r-w3of6\@xl { margin-right: 50%; } .u-marg-b-vh3of6\@xl { margin-bottom: 50vh; } .u-marg-l-w4of6\@xl { margin-left: 66.66666666666667%; } .u-marg-r-w4of6\@xl { margin-right: 66.66666666666667%; } .u-marg-b-vh4of6\@xl { margin-bottom: 66.66666666666667vh; } .u-marg-l-w5of6\@xl { margin-left: 83.33333333333334%; } .u-marg-r-w5of6\@xl { margin-right: 83.33333333333334%; } .u-marg-b-vh5of6\@xl { margin-bottom: 83.33333333333334vh; } .u-marg-l-w6of6\@xl { margin-left: 100%; } .u-marg-r-w6of6\@xl { margin-right: 100%; } .u-marg-b-vh6of6\@xl { margin-bottom: 100vh; } .u-marg-l-w1of7\@xl { margin-left: 14.285714285714286%; } .u-marg-r-w1of7\@xl { margin-right: 14.285714285714286%; } .u-marg-b-vh1of7\@xl { margin-bottom: 14.285714285714286vh; } .u-marg-l-w2of7\@xl { margin-left: 28.571428571428573%; } .u-marg-r-w2of7\@xl { margin-right: 28.571428571428573%; } .u-marg-b-vh2of7\@xl { margin-bottom: 28.571428571428573vh; } .u-marg-l-w3of7\@xl { margin-left: 42.85714285714286%; } .u-marg-r-w3of7\@xl { margin-right: 42.85714285714286%; } .u-marg-b-vh3of7\@xl { margin-bottom: 42.85714285714286vh; } .u-marg-l-w4of7\@xl { margin-left: 57.142857142857146%; } .u-marg-r-w4of7\@xl { margin-right: 57.142857142857146%; } .u-marg-b-vh4of7\@xl { margin-bottom: 57.142857142857146vh; } .u-marg-l-w5of7\@xl { margin-left: 71.42857142857143%; } .u-marg-r-w5of7\@xl { margin-right: 71.42857142857143%; } .u-marg-b-vh5of7\@xl { margin-bottom: 71.42857142857143vh; } .u-marg-l-w6of7\@xl { margin-left: 85.71428571428572%; } .u-marg-r-w6of7\@xl { margin-right: 85.71428571428572%; } .u-marg-b-vh6of7\@xl { margin-bottom: 85.71428571428572vh; } .u-marg-l-w7of7\@xl { margin-left: 100%; } .u-marg-r-w7of7\@xl { margin-right: 100%; } .u-marg-b-vh7of7\@xl { margin-bottom: 100vh; } .u-marg-l-w1of8\@xl { margin-left: 12.5%; } .u-marg-r-w1of8\@xl { margin-right: 12.5%; } .u-marg-b-vh1of8\@xl { margin-bottom: 12.5vh; } .u-marg-l-w2of8\@xl { margin-left: 25%; } .u-marg-r-w2of8\@xl { margin-right: 25%; } .u-marg-b-vh2of8\@xl { margin-bottom: 25vh; } .u-marg-l-w3of8\@xl { margin-left: 37.5%; } .u-marg-r-w3of8\@xl { margin-right: 37.5%; } .u-marg-b-vh3of8\@xl { margin-bottom: 37.5vh; } .u-marg-l-w4of8\@xl { margin-left: 50%; } .u-marg-r-w4of8\@xl { margin-right: 50%; } .u-marg-b-vh4of8\@xl { margin-bottom: 50vh; } .u-marg-l-w5of8\@xl { margin-left: 62.5%; } .u-marg-r-w5of8\@xl { margin-right: 62.5%; } .u-marg-b-vh5of8\@xl { margin-bottom: 62.5vh; } .u-marg-l-w6of8\@xl { margin-left: 75%; } .u-marg-r-w6of8\@xl { margin-right: 75%; } .u-marg-b-vh6of8\@xl { margin-bottom: 75vh; } .u-marg-l-w7of8\@xl { margin-left: 87.5%; } .u-marg-r-w7of8\@xl { margin-right: 87.5%; } .u-marg-b-vh7of8\@xl { margin-bottom: 87.5vh; } .u-marg-l-w8of8\@xl { margin-left: 100%; } .u-marg-r-w8of8\@xl { margin-right: 100%; } .u-marg-b-vh8of8\@xl { margin-bottom: 100vh; } .u-marg-l-w1of9\@xl { margin-left: 11.11111111111111%; } .u-marg-r-w1of9\@xl { margin-right: 11.11111111111111%; } .u-marg-b-vh1of9\@xl { margin-bottom: 11.11111111111111vh; } .u-marg-l-w2of9\@xl { margin-left: 22.22222222222222%; } .u-marg-r-w2of9\@xl { margin-right: 22.22222222222222%; } .u-marg-b-vh2of9\@xl { margin-bottom: 22.22222222222222vh; } .u-marg-l-w3of9\@xl { margin-left: 33.33333333333333%; } .u-marg-r-w3of9\@xl { margin-right: 33.33333333333333%; } .u-marg-b-vh3of9\@xl { margin-bottom: 33.33333333333333vh; } .u-marg-l-w4of9\@xl { margin-left: 44.44444444444444%; } .u-marg-r-w4of9\@xl { margin-right: 44.44444444444444%; } .u-marg-b-vh4of9\@xl { margin-bottom: 44.44444444444444vh; } .u-marg-l-w5of9\@xl { margin-left: 55.55555555555556%; } .u-marg-r-w5of9\@xl { margin-right: 55.55555555555556%; } .u-marg-b-vh5of9\@xl { margin-bottom: 55.55555555555556vh; } .u-marg-l-w6of9\@xl { margin-left: 66.66666666666666%; } .u-marg-r-w6of9\@xl { margin-right: 66.66666666666666%; } .u-marg-b-vh6of9\@xl { margin-bottom: 66.66666666666666vh; } .u-marg-l-w7of9\@xl { margin-left: 77.77777777777777%; } .u-marg-r-w7of9\@xl { margin-right: 77.77777777777777%; } .u-marg-b-vh7of9\@xl { margin-bottom: 77.77777777777777vh; } .u-marg-l-w8of9\@xl { margin-left: 88.88888888888889%; } .u-marg-r-w8of9\@xl { margin-right: 88.88888888888889%; } .u-marg-b-vh8of9\@xl { margin-bottom: 88.88888888888889vh; } .u-marg-l-w9of9\@xl { margin-left: 100%; } .u-marg-r-w9of9\@xl { margin-right: 100%; } .u-marg-b-vh9of9\@xl { margin-bottom: 100vh; } .u-marg-l-w1of10\@xl { margin-left: 10%; } .u-marg-r-w1of10\@xl { margin-right: 10%; } .u-marg-b-vh1of10\@xl { margin-bottom: 10vh; } .u-marg-l-w2of10\@xl { margin-left: 20%; } .u-marg-r-w2of10\@xl { margin-right: 20%; } .u-marg-b-vh2of10\@xl { margin-bottom: 20vh; } .u-marg-l-w3of10\@xl { margin-left: 30%; } .u-marg-r-w3of10\@xl { margin-right: 30%; } .u-marg-b-vh3of10\@xl { margin-bottom: 30vh; } .u-marg-l-w4of10\@xl { margin-left: 40%; } .u-marg-r-w4of10\@xl { margin-right: 40%; } .u-marg-b-vh4of10\@xl { margin-bottom: 40vh; } .u-marg-l-w5of10\@xl { margin-left: 50%; } .u-marg-r-w5of10\@xl { margin-right: 50%; } .u-marg-b-vh5of10\@xl { margin-bottom: 50vh; } .u-marg-l-w6of10\@xl { margin-left: 60%; } .u-marg-r-w6of10\@xl { margin-right: 60%; } .u-marg-b-vh6of10\@xl { margin-bottom: 60vh; } .u-marg-l-w7of10\@xl { margin-left: 70%; } .u-marg-r-w7of10\@xl { margin-right: 70%; } .u-marg-b-vh7of10\@xl { margin-bottom: 70vh; } .u-marg-l-w8of10\@xl { margin-left: 80%; } .u-marg-r-w8of10\@xl { margin-right: 80%; } .u-marg-b-vh8of10\@xl { margin-bottom: 80vh; } .u-marg-l-w9of10\@xl { margin-left: 90%; } .u-marg-r-w9of10\@xl { margin-right: 90%; } .u-marg-b-vh9of10\@xl { margin-bottom: 90vh; } .u-marg-l-w10of10\@xl { margin-left: 100%; } .u-marg-r-w10of10\@xl { margin-right: 100%; } .u-marg-b-vh10of10\@xl { margin-bottom: 100vh; } .u-marg-l-w1of12\@xl { margin-left: 8.333333333333334%; } .u-marg-r-w1of12\@xl { margin-right: 8.333333333333334%; } .u-marg-b-vh1of12\@xl { margin-bottom: 8.333333333333334vh; } .u-marg-l-w2of12\@xl { margin-left: 16.666666666666668%; } .u-marg-r-w2of12\@xl { margin-right: 16.666666666666668%; } .u-marg-b-vh2of12\@xl { margin-bottom: 16.666666666666668vh; } .u-marg-l-w3of12\@xl { margin-left: 25%; } .u-marg-r-w3of12\@xl { margin-right: 25%; } .u-marg-b-vh3of12\@xl { margin-bottom: 25vh; } .u-marg-l-w4of12\@xl { margin-left: 33.333333333333336%; } .u-marg-r-w4of12\@xl { margin-right: 33.333333333333336%; } .u-marg-b-vh4of12\@xl { margin-bottom: 33.333333333333336vh; } .u-marg-l-w5of12\@xl { margin-left: 41.66666666666667%; } .u-marg-r-w5of12\@xl { margin-right: 41.66666666666667%; } .u-marg-b-vh5of12\@xl { margin-bottom: 41.66666666666667vh; } .u-marg-l-w6of12\@xl { margin-left: 50%; } .u-marg-r-w6of12\@xl { margin-right: 50%; } .u-marg-b-vh6of12\@xl { margin-bottom: 50vh; } .u-marg-l-w7of12\@xl { margin-left: 58.333333333333336%; } .u-marg-r-w7of12\@xl { margin-right: 58.333333333333336%; } .u-marg-b-vh7of12\@xl { margin-bottom: 58.333333333333336vh; } .u-marg-l-w8of12\@xl { margin-left: 66.66666666666667%; } .u-marg-r-w8of12\@xl { margin-right: 66.66666666666667%; } .u-marg-b-vh8of12\@xl { margin-bottom: 66.66666666666667vh; } .u-marg-l-w9of12\@xl { margin-left: 75%; } .u-marg-r-w9of12\@xl { margin-right: 75%; } .u-marg-b-vh9of12\@xl { margin-bottom: 75vh; } .u-marg-l-w10of12\@xl { margin-left: 83.33333333333334%; } .u-marg-r-w10of12\@xl { margin-right: 83.33333333333334%; } .u-marg-b-vh10of12\@xl { margin-bottom: 83.33333333333334vh; } .u-marg-l-w11of12\@xl { margin-left: 91.66666666666667%; } .u-marg-r-w11of12\@xl { margin-right: 91.66666666666667%; } .u-marg-b-vh11of12\@xl { margin-bottom: 91.66666666666667vh; } .u-marg-l-w12of12\@xl { margin-left: 100%; } .u-marg-r-w12of12\@xl { margin-right: 100%; } .u-marg-b-vh12of12\@xl { margin-bottom: 100vh; } .u-marg-l-w1of16\@xl { margin-left: 6.25%; } .u-marg-r-w1of16\@xl { margin-right: 6.25%; } .u-pad-l-w1of16\@xl { padding-left: 6.25%; } .u-pad-r-w1of16\@xl { padding-right: 6.25%; } .u-marg-b-vh1of16\@xl { margin-bottom: 6.25vh; } .u-marg-l-w2of16\@xl { margin-left: 12.5%; } .u-marg-r-w2of16\@xl { margin-right: 12.5%; } .u-marg-b-vh2of16\@xl { margin-bottom: 12.5vh; } .u-marg-l-w3of16\@xl { margin-left: 18.75%; } .u-marg-r-w3of16\@xl { margin-right: 18.75%; } .u-marg-b-vh3of16\@xl { margin-bottom: 18.75vh; } .u-marg-l-w4of16\@xl { margin-left: 25%; } .u-marg-r-w4of16\@xl { margin-right: 25%; } .u-marg-b-vh4of16\@xl { margin-bottom: 25vh; } .u-marg-l-w5of16\@xl { margin-left: 31.25%; } .u-marg-r-w5of16\@xl { margin-right: 31.25%; } .u-marg-b-vh5of16\@xl { margin-bottom: 31.25vh; } .u-marg-l-w6of16\@xl { margin-left: 37.5%; } .u-marg-r-w6of16\@xl { margin-right: 37.5%; } .u-marg-b-vh6of16\@xl { margin-bottom: 37.5vh; } .u-marg-l-w7of16\@xl { margin-left: 43.75%; } .u-marg-r-w7of16\@xl { margin-right: 43.75%; } .u-marg-b-vh7of16\@xl { margin-bottom: 43.75vh; } .u-marg-l-w8of16\@xl { margin-left: 50%; } .u-marg-r-w8of16\@xl { margin-right: 50%; } .u-marg-b-vh8of16\@xl { margin-bottom: 50vh; } .u-marg-l-w9of16\@xl { margin-left: 56.25%; } .u-marg-r-w9of16\@xl { margin-right: 56.25%; } .u-marg-b-vh9of16\@xl { margin-bottom: 56.25vh; } .u-marg-l-w10of16\@xl { margin-left: 62.5%; } .u-marg-r-w10of16\@xl { margin-right: 62.5%; } .u-marg-b-vh10of16\@xl { margin-bottom: 62.5vh; } .u-marg-l-w11of16\@xl { margin-left: 68.75%; } .u-marg-r-w11of16\@xl { margin-right: 68.75%; } .u-marg-b-vh11of16\@xl { margin-bottom: 68.75vh; } .u-marg-l-w12of16\@xl { margin-left: 75%; } .u-marg-r-w12of16\@xl { margin-right: 75%; } .u-marg-b-vh12of16\@xl { margin-bottom: 75vh; } .u-marg-l-w13of16\@xl { margin-left: 81.25%; } .u-marg-r-w13of16\@xl { margin-right: 81.25%; } .u-marg-b-vh13of16\@xl { margin-bottom: 81.25vh; } .u-marg-l-w14of16\@xl { margin-left: 87.5%; } .u-marg-r-w14of16\@xl { margin-right: 87.5%; } .u-marg-b-vh14of16\@xl { margin-bottom: 87.5vh; } .u-marg-l-w15of16\@xl { margin-left: 93.75%; } .u-marg-r-w15of16\@xl { margin-right: 93.75%; } .u-marg-b-vh15of16\@xl { margin-bottom: 93.75vh; } .u-marg-l-w16of16\@xl { margin-left: 100%; } .u-marg-r-w16of16\@xl { margin-right: 100%; } .u-marg-b-vh16of16\@xl { margin-bottom: 100vh; } .u-marg-l-w1of18\@xl { margin-left: 5.555555555555555%; } .u-marg-r-w1of18\@xl { margin-right: 5.555555555555555%; } .u-marg-b-vh1of18\@xl { margin-bottom: 5.555555555555555vh; } .u-marg-l-w2of18\@xl { margin-left: 11.11111111111111%; } .u-marg-r-w2of18\@xl { margin-right: 11.11111111111111%; } .u-marg-b-vh2of18\@xl { margin-bottom: 11.11111111111111vh; } .u-marg-l-w3of18\@xl { margin-left: 16.666666666666664%; } .u-marg-r-w3of18\@xl { margin-right: 16.666666666666664%; } .u-marg-b-vh3of18\@xl { margin-bottom: 16.666666666666664vh; } .u-marg-l-w4of18\@xl { margin-left: 22.22222222222222%; } .u-marg-r-w4of18\@xl { margin-right: 22.22222222222222%; } .u-marg-b-vh4of18\@xl { margin-bottom: 22.22222222222222vh; } .u-marg-l-w5of18\@xl { margin-left: 27.77777777777778%; } .u-marg-r-w5of18\@xl { margin-right: 27.77777777777778%; } .u-marg-b-vh5of18\@xl { margin-bottom: 27.77777777777778vh; } .u-marg-l-w6of18\@xl { margin-left: 33.33333333333333%; } .u-marg-r-w6of18\@xl { margin-right: 33.33333333333333%; } .u-marg-b-vh6of18\@xl { margin-bottom: 33.33333333333333vh; } .u-marg-l-w7of18\@xl { margin-left: 38.888888888888886%; } .u-marg-r-w7of18\@xl { margin-right: 38.888888888888886%; } .u-marg-b-vh7of18\@xl { margin-bottom: 38.888888888888886vh; } .u-marg-l-w8of18\@xl { margin-left: 44.44444444444444%; } .u-marg-r-w8of18\@xl { margin-right: 44.44444444444444%; } .u-marg-b-vh8of18\@xl { margin-bottom: 44.44444444444444vh; } .u-marg-l-w9of18\@xl { margin-left: 50%; } .u-marg-r-w9of18\@xl { margin-right: 50%; } .u-marg-b-vh9of18\@xl { margin-bottom: 50vh; } .u-marg-l-w10of18\@xl { margin-left: 55.55555555555556%; } .u-marg-r-w10of18\@xl { margin-right: 55.55555555555556%; } .u-marg-b-vh10of18\@xl { margin-bottom: 55.55555555555556vh; } .u-marg-l-w11of18\@xl { margin-left: 61.11111111111111%; } .u-marg-r-w11of18\@xl { margin-right: 61.11111111111111%; } .u-marg-b-vh11of18\@xl { margin-bottom: 61.11111111111111vh; } .u-marg-l-w12of18\@xl { margin-left: 66.66666666666666%; } .u-marg-r-w12of18\@xl { margin-right: 66.66666666666666%; } .u-marg-b-vh12of18\@xl { margin-bottom: 66.66666666666666vh; } .u-marg-l-w13of18\@xl { margin-left: 72.22222222222221%; } .u-marg-r-w13of18\@xl { margin-right: 72.22222222222221%; } .u-marg-b-vh13of18\@xl { margin-bottom: 72.22222222222221vh; } .u-marg-l-w14of18\@xl { margin-left: 77.77777777777777%; } .u-marg-r-w14of18\@xl { margin-right: 77.77777777777777%; } .u-marg-b-vh14of18\@xl { margin-bottom: 77.77777777777777vh; } .u-marg-l-w15of18\@xl { margin-left: 83.33333333333333%; } .u-marg-r-w15of18\@xl { margin-right: 83.33333333333333%; } .u-marg-b-vh15of18\@xl { margin-bottom: 83.33333333333333vh; } .u-marg-l-w16of18\@xl { margin-left: 88.88888888888889%; } .u-marg-r-w16of18\@xl { margin-right: 88.88888888888889%; } .u-marg-b-vh16of18\@xl { margin-bottom: 88.88888888888889vh; } .u-marg-l-w17of18\@xl { margin-left: 94.44444444444444%; } .u-marg-r-w17of18\@xl { margin-right: 94.44444444444444%; } .u-marg-b-vh17of18\@xl { margin-bottom: 94.44444444444444vh; } .u-marg-l-w18of18\@xl { margin-left: 100%; } .u-marg-r-w18of18\@xl { margin-right: 100%; } .u-marg-b-vh18of18\@xl { margin-bottom: 100vh; } .u-marg-l-w1of20\@xl { margin-left: 5%; } .u-marg-r-w1of20\@xl { margin-right: 5%; } .u-marg-b-vh1of20\@xl { margin-bottom: 5vh; } .u-marg-l-w2of20\@xl { margin-left: 10%; } .u-marg-r-w2of20\@xl { margin-right: 10%; } .u-marg-b-vh2of20\@xl { margin-bottom: 10vh; } .u-marg-l-w3of20\@xl { margin-left: 15%; } .u-marg-r-w3of20\@xl { margin-right: 15%; } .u-marg-b-vh3of20\@xl { margin-bottom: 15vh; } .u-marg-l-w4of20\@xl { margin-left: 20%; } .u-marg-r-w4of20\@xl { margin-right: 20%; } .u-marg-b-vh4of20\@xl { margin-bottom: 20vh; } .u-marg-l-w5of20\@xl { margin-left: 25%; } .u-marg-r-w5of20\@xl { margin-right: 25%; } .u-marg-b-vh5of20\@xl { margin-bottom: 25vh; } .u-marg-l-w6of20\@xl { margin-left: 30%; } .u-marg-r-w6of20\@xl { margin-right: 30%; } .u-marg-b-vh6of20\@xl { margin-bottom: 30vh; } .u-marg-l-w7of20\@xl { margin-left: 35%; } .u-marg-r-w7of20\@xl { margin-right: 35%; } .u-marg-b-vh7of20\@xl { margin-bottom: 35vh; } .u-marg-l-w8of20\@xl { margin-left: 40%; } .u-marg-r-w8of20\@xl { margin-right: 40%; } .u-marg-b-vh8of20\@xl { margin-bottom: 40vh; } .u-marg-l-w9of20\@xl { margin-left: 45%; } .u-marg-r-w9of20\@xl { margin-right: 45%; } .u-marg-b-vh9of20\@xl { margin-bottom: 45vh; } .u-marg-l-w10of20\@xl { margin-left: 50%; } .u-marg-r-w10of20\@xl { margin-right: 50%; } .u-marg-b-vh10of20\@xl { margin-bottom: 50vh; } .u-marg-l-w11of20\@xl { margin-left: 55%; } .u-marg-r-w11of20\@xl { margin-right: 55%; } .u-marg-b-vh11of20\@xl { margin-bottom: 55vh; } .u-marg-l-w12of20\@xl { margin-left: 60%; } .u-marg-r-w12of20\@xl { margin-right: 60%; } .u-marg-b-vh12of20\@xl { margin-bottom: 60vh; } .u-marg-l-w13of20\@xl { margin-left: 65%; } .u-marg-r-w13of20\@xl { margin-right: 65%; } .u-marg-b-vh13of20\@xl { margin-bottom: 65vh; } .u-marg-l-w14of20\@xl { margin-left: 70%; } .u-marg-r-w14of20\@xl { margin-right: 70%; } .u-marg-b-vh14of20\@xl { margin-bottom: 70vh; } .u-marg-l-w15of20\@xl { margin-left: 75%; } .u-marg-r-w15of20\@xl { margin-right: 75%; } .u-marg-b-vh15of20\@xl { margin-bottom: 75vh; } .u-marg-l-w16of20\@xl { margin-left: 80%; } .u-marg-r-w16of20\@xl { margin-right: 80%; } .u-marg-b-vh16of20\@xl { margin-bottom: 80vh; } .u-marg-l-w17of20\@xl { margin-left: 85%; } .u-marg-r-w17of20\@xl { margin-right: 85%; } .u-marg-b-vh17of20\@xl { margin-bottom: 85vh; } .u-marg-l-w18of20\@xl { margin-left: 90%; } .u-marg-r-w18of20\@xl { margin-right: 90%; } .u-marg-b-vh18of20\@xl { margin-bottom: 90vh; } .u-marg-l-w19of20\@xl { margin-left: 95%; } .u-marg-r-w19of20\@xl { margin-right: 95%; } .u-marg-b-vh19of20\@xl { margin-bottom: 95vh; } .u-marg-l-w20of20\@xl { margin-left: 100%; } .u-marg-r-w20of20\@xl { margin-right: 100%; } .u-marg-b-vh20of20\@xl { margin-bottom: 100vh; } .u-marg-l-w1of24\@xl { margin-left: 4.166666666666667%; } .u-marg-r-w1of24\@xl { margin-right: 4.166666666666667%; } .u-marg-b-vh1of24\@xl { margin-bottom: 4.166666666666667vh; } .u-marg-l-w2of24\@xl { margin-left: 8.333333333333334%; } .u-marg-r-w2of24\@xl { margin-right: 8.333333333333334%; } .u-marg-b-vh2of24\@xl { margin-bottom: 8.333333333333334vh; } .u-marg-l-w3of24\@xl { margin-left: 12.5%; } .u-marg-r-w3of24\@xl { margin-right: 12.5%; } .u-marg-b-vh3of24\@xl { margin-bottom: 12.5vh; } .u-marg-l-w4of24\@xl { margin-left: 16.666666666666668%; } .u-marg-r-w4of24\@xl { margin-right: 16.666666666666668%; } .u-marg-b-vh4of24\@xl { margin-bottom: 16.666666666666668vh; } .u-marg-l-w5of24\@xl { margin-left: 20.833333333333336%; } .u-marg-r-w5of24\@xl { margin-right: 20.833333333333336%; } .u-marg-b-vh5of24\@xl { margin-bottom: 20.833333333333336vh; } .u-marg-l-w6of24\@xl { margin-left: 25%; } .u-marg-r-w6of24\@xl { margin-right: 25%; } .u-marg-b-vh6of24\@xl { margin-bottom: 25vh; } .u-marg-l-w7of24\@xl { margin-left: 29.166666666666668%; } .u-marg-r-w7of24\@xl { margin-right: 29.166666666666668%; } .u-marg-b-vh7of24\@xl { margin-bottom: 29.166666666666668vh; } .u-marg-l-w8of24\@xl { margin-left: 33.333333333333336%; } .u-marg-r-w8of24\@xl { margin-right: 33.333333333333336%; } .u-marg-b-vh8of24\@xl { margin-bottom: 33.333333333333336vh; } .u-marg-l-w9of24\@xl { margin-left: 37.5%; } .u-marg-r-w9of24\@xl { margin-right: 37.5%; } .u-marg-b-vh9of24\@xl { margin-bottom: 37.5vh; } .u-marg-l-w10of24\@xl { margin-left: 41.66666666666667%; } .u-marg-r-w10of24\@xl { margin-right: 41.66666666666667%; } .u-marg-b-vh10of24\@xl { margin-bottom: 41.66666666666667vh; } .u-marg-l-w11of24\@xl { margin-left: 45.833333333333336%; } .u-marg-r-w11of24\@xl { margin-right: 45.833333333333336%; } .u-marg-b-vh11of24\@xl { margin-bottom: 45.833333333333336vh; } .u-marg-l-w12of24\@xl { margin-left: 50%; } .u-marg-r-w12of24\@xl { margin-right: 50%; } .u-marg-b-vh12of24\@xl { margin-bottom: 50vh; } .u-marg-l-w13of24\@xl { margin-left: 54.16666666666667%; } .u-marg-r-w13of24\@xl { margin-right: 54.16666666666667%; } .u-marg-b-vh13of24\@xl { margin-bottom: 54.16666666666667vh; } .u-marg-l-w14of24\@xl { margin-left: 58.333333333333336%; } .u-marg-r-w14of24\@xl { margin-right: 58.333333333333336%; } .u-marg-b-vh14of24\@xl { margin-bottom: 58.333333333333336vh; } .u-marg-l-w15of24\@xl { margin-left: 62.50000000000001%; } .u-marg-r-w15of24\@xl { margin-right: 62.50000000000001%; } .u-marg-b-vh15of24\@xl { margin-bottom: 62.50000000000001vh; } .u-marg-l-w16of24\@xl { margin-left: 66.66666666666667%; } .u-marg-r-w16of24\@xl { margin-right: 66.66666666666667%; } .u-marg-b-vh16of24\@xl { margin-bottom: 66.66666666666667vh; } .u-marg-l-w17of24\@xl { margin-left: 70.83333333333334%; } .u-marg-r-w17of24\@xl { margin-right: 70.83333333333334%; } .u-marg-b-vh17of24\@xl { margin-bottom: 70.83333333333334vh; } .u-marg-l-w18of24\@xl { margin-left: 75%; } .u-marg-r-w18of24\@xl { margin-right: 75%; } .u-marg-b-vh18of24\@xl { margin-bottom: 75vh; } .u-marg-l-w19of24\@xl { margin-left: 79.16666666666667%; } .u-marg-r-w19of24\@xl { margin-right: 79.16666666666667%; } .u-marg-b-vh19of24\@xl { margin-bottom: 79.16666666666667vh; } .u-marg-l-w20of24\@xl { margin-left: 83.33333333333334%; } .u-marg-r-w20of24\@xl { margin-right: 83.33333333333334%; } .u-marg-b-vh20of24\@xl { margin-bottom: 83.33333333333334vh; } .u-marg-l-w21of24\@xl { margin-left: 87.5%; } .u-marg-r-w21of24\@xl { margin-right: 87.5%; } .u-marg-b-vh21of24\@xl { margin-bottom: 87.5vh; } .u-marg-l-w22of24\@xl { margin-left: 91.66666666666667%; } .u-marg-r-w22of24\@xl { margin-right: 91.66666666666667%; } .u-marg-b-vh22of24\@xl { margin-bottom: 91.66666666666667vh; } .u-marg-l-w23of24\@xl { margin-left: 95.83333333333334%; } .u-marg-r-w23of24\@xl { margin-right: 95.83333333333334%; } .u-marg-b-vh23of24\@xl { margin-bottom: 95.83333333333334vh; } .u-marg-l-w24of24\@xl { margin-left: 100%; } .u-marg-r-w24of24\@xl { margin-right: 100%; } .u-marg-b-vh24of24\@xl { margin-bottom: 100vh; } } @media screen and (max-width: 1280px) { .u-w1of2\@lg { width: 50%; } .u-marg-l-w1of2\@lg { margin-left: 50%; } .u-marg-r-w1of2\@lg { margin-right: 50%; } .u-marg-b-vh1of2\@lg { margin-bottom: 50vh; } .u-marg-l-w2of2\@lg { margin-left: 100%; } .u-marg-r-w2of2\@lg { margin-right: 100%; } .u-marg-b-vh2of2\@lg { margin-bottom: 100vh; } .u-marg-l-w1of3\@lg { margin-left: 33.333333333333336%; } .u-marg-r-w1of3\@lg { margin-right: 33.333333333333336%; } .u-marg-b-vh1of3\@lg { margin-bottom: 33.333333333333336vh; } .u-w2of3\@lg { width: 66.66666666666667%; } .u-marg-l-w2of3\@lg { margin-left: 66.66666666666667%; } .u-marg-r-w2of3\@lg { margin-right: 66.66666666666667%; } .u-marg-b-vh2of3\@lg { margin-bottom: 66.66666666666667vh; } .u-marg-l-w3of3\@lg { margin-left: 100%; } .u-marg-r-w3of3\@lg { margin-right: 100%; } .u-marg-b-vh3of3\@lg { margin-bottom: 100vh; } .u-marg-l-w1of4\@lg { margin-left: 25%; } .u-marg-r-w1of4\@lg { margin-right: 25%; } .u-marg-b-vh1of4\@lg { margin-bottom: 25vh; } .u-marg-l-w2of4\@lg { margin-left: 50%; } .u-marg-r-w2of4\@lg { margin-right: 50%; } .u-marg-b-vh2of4\@lg { margin-bottom: 50vh; } .u-marg-l-w3of4\@lg { margin-left: 75%; } .u-marg-r-w3of4\@lg { margin-right: 75%; } .u-marg-b-vh3of4\@lg { margin-bottom: 75vh; } .u-marg-l-w4of4\@lg { margin-left: 100%; } .u-marg-r-w4of4\@lg { margin-right: 100%; } .u-marg-b-vh4of4\@lg { margin-bottom: 100vh; } .u-marg-l-w1of5\@lg { margin-left: 20%; } .u-marg-r-w1of5\@lg { margin-right: 20%; } .u-marg-b-vh1of5\@lg { margin-bottom: 20vh; } .u-marg-l-w2of5\@lg { margin-left: 40%; } .u-marg-r-w2of5\@lg { margin-right: 40%; } .u-marg-b-vh2of5\@lg { margin-bottom: 40vh; } .u-marg-l-w3of5\@lg { margin-left: 60%; } .u-marg-r-w3of5\@lg { margin-right: 60%; } .u-marg-b-vh3of5\@lg { margin-bottom: 60vh; } .u-marg-l-w4of5\@lg { margin-left: 80%; } .u-marg-r-w4of5\@lg { margin-right: 80%; } .u-marg-b-vh4of5\@lg { margin-bottom: 80vh; } .u-marg-l-w5of5\@lg { margin-left: 100%; } .u-marg-r-w5of5\@lg { margin-right: 100%; } .u-marg-b-vh5of5\@lg { margin-bottom: 100vh; } .u-marg-l-w1of6\@lg { margin-left: 16.666666666666668%; } .u-marg-r-w1of6\@lg { margin-right: 16.666666666666668%; } .u-marg-b-vh1of6\@lg { margin-bottom: 16.666666666666668vh; } .u-marg-l-w2of6\@lg { margin-left: 33.333333333333336%; } .u-marg-r-w2of6\@lg { margin-right: 33.333333333333336%; } .u-marg-b-vh2of6\@lg { margin-bottom: 33.333333333333336vh; } .u-marg-l-w3of6\@lg { margin-left: 50%; } .u-marg-r-w3of6\@lg { margin-right: 50%; } .u-marg-b-vh3of6\@lg { margin-bottom: 50vh; } .u-marg-l-w4of6\@lg { margin-left: 66.66666666666667%; } .u-marg-r-w4of6\@lg { margin-right: 66.66666666666667%; } .u-marg-b-vh4of6\@lg { margin-bottom: 66.66666666666667vh; } .u-marg-l-w5of6\@lg { margin-left: 83.33333333333334%; } .u-marg-r-w5of6\@lg { margin-right: 83.33333333333334%; } .u-marg-b-vh5of6\@lg { margin-bottom: 83.33333333333334vh; } .u-marg-l-w6of6\@lg { margin-left: 100%; } .u-marg-r-w6of6\@lg { margin-right: 100%; } .u-marg-b-vh6of6\@lg { margin-bottom: 100vh; } .u-marg-l-w1of7\@lg { margin-left: 14.285714285714286%; } .u-marg-r-w1of7\@lg { margin-right: 14.285714285714286%; } .u-marg-b-vh1of7\@lg { margin-bottom: 14.285714285714286vh; } .u-marg-l-w2of7\@lg { margin-left: 28.571428571428573%; } .u-marg-r-w2of7\@lg { margin-right: 28.571428571428573%; } .u-marg-b-vh2of7\@lg { margin-bottom: 28.571428571428573vh; } .u-marg-l-w3of7\@lg { margin-left: 42.85714285714286%; } .u-marg-r-w3of7\@lg { margin-right: 42.85714285714286%; } .u-marg-b-vh3of7\@lg { margin-bottom: 42.85714285714286vh; } .u-marg-l-w4of7\@lg { margin-left: 57.142857142857146%; } .u-marg-r-w4of7\@lg { margin-right: 57.142857142857146%; } .u-marg-b-vh4of7\@lg { margin-bottom: 57.142857142857146vh; } .u-marg-l-w5of7\@lg { margin-left: 71.42857142857143%; } .u-marg-r-w5of7\@lg { margin-right: 71.42857142857143%; } .u-marg-b-vh5of7\@lg { margin-bottom: 71.42857142857143vh; } .u-marg-l-w6of7\@lg { margin-left: 85.71428571428572%; } .u-marg-r-w6of7\@lg { margin-right: 85.71428571428572%; } .u-marg-b-vh6of7\@lg { margin-bottom: 85.71428571428572vh; } .u-marg-l-w7of7\@lg { margin-left: 100%; } .u-marg-r-w7of7\@lg { margin-right: 100%; } .u-marg-b-vh7of7\@lg { margin-bottom: 100vh; } .u-marg-l-w1of8\@lg { margin-left: 12.5%; } .u-marg-r-w1of8\@lg { margin-right: 12.5%; } .u-marg-b-vh1of8\@lg { margin-bottom: 12.5vh; } .u-marg-l-w2of8\@lg { margin-left: 25%; } .u-marg-r-w2of8\@lg { margin-right: 25%; } .u-marg-b-vh2of8\@lg { margin-bottom: 25vh; } .u-marg-l-w3of8\@lg { margin-left: 37.5%; } .u-marg-r-w3of8\@lg { margin-right: 37.5%; } .u-marg-b-vh3of8\@lg { margin-bottom: 37.5vh; } .u-marg-l-w4of8\@lg { margin-left: 50%; } .u-marg-r-w4of8\@lg { margin-right: 50%; } .u-marg-b-vh4of8\@lg { margin-bottom: 50vh; } .u-marg-l-w5of8\@lg { margin-left: 62.5%; } .u-marg-r-w5of8\@lg { margin-right: 62.5%; } .u-marg-b-vh5of8\@lg { margin-bottom: 62.5vh; } .u-marg-l-w6of8\@lg { margin-left: 75%; } .u-marg-r-w6of8\@lg { margin-right: 75%; } .u-marg-b-vh6of8\@lg { margin-bottom: 75vh; } .u-marg-l-w7of8\@lg { margin-left: 87.5%; } .u-marg-r-w7of8\@lg { margin-right: 87.5%; } .u-marg-b-vh7of8\@lg { margin-bottom: 87.5vh; } .u-marg-l-w8of8\@lg { margin-left: 100%; } .u-marg-r-w8of8\@lg { margin-right: 100%; } .u-marg-b-vh8of8\@lg { margin-bottom: 100vh; } .u-marg-l-w1of9\@lg { margin-left: 11.11111111111111%; } .u-marg-r-w1of9\@lg { margin-right: 11.11111111111111%; } .u-marg-b-vh1of9\@lg { margin-bottom: 11.11111111111111vh; } .u-marg-l-w2of9\@lg { margin-left: 22.22222222222222%; } .u-marg-r-w2of9\@lg { margin-right: 22.22222222222222%; } .u-marg-b-vh2of9\@lg { margin-bottom: 22.22222222222222vh; } .u-marg-l-w3of9\@lg { margin-left: 33.33333333333333%; } .u-marg-r-w3of9\@lg { margin-right: 33.33333333333333%; } .u-marg-b-vh3of9\@lg { margin-bottom: 33.33333333333333vh; } .u-marg-l-w4of9\@lg { margin-left: 44.44444444444444%; } .u-marg-r-w4of9\@lg { margin-right: 44.44444444444444%; } .u-marg-b-vh4of9\@lg { margin-bottom: 44.44444444444444vh; } .u-marg-l-w5of9\@lg { margin-left: 55.55555555555556%; } .u-marg-r-w5of9\@lg { margin-right: 55.55555555555556%; } .u-marg-b-vh5of9\@lg { margin-bottom: 55.55555555555556vh; } .u-marg-l-w6of9\@lg { margin-left: 66.66666666666666%; } .u-marg-r-w6of9\@lg { margin-right: 66.66666666666666%; } .u-marg-b-vh6of9\@lg { margin-bottom: 66.66666666666666vh; } .u-marg-l-w7of9\@lg { margin-left: 77.77777777777777%; } .u-marg-r-w7of9\@lg { margin-right: 77.77777777777777%; } .u-marg-b-vh7of9\@lg { margin-bottom: 77.77777777777777vh; } .u-marg-l-w8of9\@lg { margin-left: 88.88888888888889%; } .u-marg-r-w8of9\@lg { margin-right: 88.88888888888889%; } .u-marg-b-vh8of9\@lg { margin-bottom: 88.88888888888889vh; } .u-marg-l-w9of9\@lg { margin-left: 100%; } .u-marg-r-w9of9\@lg { margin-right: 100%; } .u-marg-b-vh9of9\@lg { margin-bottom: 100vh; } .u-marg-l-w1of10\@lg { margin-left: 10%; } .u-marg-r-w1of10\@lg { margin-right: 10%; } .u-marg-b-vh1of10\@lg { margin-bottom: 10vh; } .u-marg-l-w2of10\@lg { margin-left: 20%; } .u-marg-r-w2of10\@lg { margin-right: 20%; } .u-marg-b-vh2of10\@lg { margin-bottom: 20vh; } .u-marg-l-w3of10\@lg { margin-left: 30%; } .u-marg-r-w3of10\@lg { margin-right: 30%; } .u-marg-b-vh3of10\@lg { margin-bottom: 30vh; } .u-marg-l-w4of10\@lg { margin-left: 40%; } .u-marg-r-w4of10\@lg { margin-right: 40%; } .u-marg-b-vh4of10\@lg { margin-bottom: 40vh; } .u-marg-l-w5of10\@lg { margin-left: 50%; } .u-marg-r-w5of10\@lg { margin-right: 50%; } .u-marg-b-vh5of10\@lg { margin-bottom: 50vh; } .u-marg-l-w6of10\@lg { margin-left: 60%; } .u-marg-r-w6of10\@lg { margin-right: 60%; } .u-marg-b-vh6of10\@lg { margin-bottom: 60vh; } .u-marg-l-w7of10\@lg { margin-left: 70%; } .u-marg-r-w7of10\@lg { margin-right: 70%; } .u-marg-b-vh7of10\@lg { margin-bottom: 70vh; } .u-marg-l-w8of10\@lg { margin-left: 80%; } .u-marg-r-w8of10\@lg { margin-right: 80%; } .u-marg-b-vh8of10\@lg { margin-bottom: 80vh; } .u-marg-l-w9of10\@lg { margin-left: 90%; } .u-marg-r-w9of10\@lg { margin-right: 90%; } .u-marg-b-vh9of10\@lg { margin-bottom: 90vh; } .u-marg-l-w10of10\@lg { margin-left: 100%; } .u-marg-r-w10of10\@lg { margin-right: 100%; } .u-marg-b-vh10of10\@lg { margin-bottom: 100vh; } .u-marg-l-w1of12\@lg { margin-left: 8.333333333333334%; } .u-marg-r-w1of12\@lg { margin-right: 8.333333333333334%; } .u-marg-b-vh1of12\@lg { margin-bottom: 8.333333333333334vh; } .u-marg-l-w2of12\@lg { margin-left: 16.666666666666668%; } .u-marg-r-w2of12\@lg { margin-right: 16.666666666666668%; } .u-marg-b-vh2of12\@lg { margin-bottom: 16.666666666666668vh; } .u-marg-l-w3of12\@lg { margin-left: 25%; } .u-marg-r-w3of12\@lg { margin-right: 25%; } .u-marg-b-vh3of12\@lg { margin-bottom: 25vh; } .u-marg-l-w4of12\@lg { margin-left: 33.333333333333336%; } .u-marg-r-w4of12\@lg { margin-right: 33.333333333333336%; } .u-marg-b-vh4of12\@lg { margin-bottom: 33.333333333333336vh; } .u-marg-l-w5of12\@lg { margin-left: 41.66666666666667%; } .u-marg-r-w5of12\@lg { margin-right: 41.66666666666667%; } .u-marg-b-vh5of12\@lg { margin-bottom: 41.66666666666667vh; } .u-marg-l-w6of12\@lg { margin-left: 50%; } .u-marg-r-w6of12\@lg { margin-right: 50%; } .u-marg-b-vh6of12\@lg { margin-bottom: 50vh; } .u-marg-l-w7of12\@lg { margin-left: 58.333333333333336%; } .u-marg-r-w7of12\@lg { margin-right: 58.333333333333336%; } .u-marg-b-vh7of12\@lg { margin-bottom: 58.333333333333336vh; } .u-marg-l-w8of12\@lg { margin-left: 66.66666666666667%; } .u-marg-r-w8of12\@lg { margin-right: 66.66666666666667%; } .u-marg-b-vh8of12\@lg { margin-bottom: 66.66666666666667vh; } .u-w9of12\@lg { width: 75%; } .u-marg-l-w9of12\@lg { margin-left: 75%; } .u-marg-r-w9of12\@lg { margin-right: 75%; } .u-marg-b-vh9of12\@lg { margin-bottom: 75vh; } .u-marg-l-w10of12\@lg { margin-left: 83.33333333333334%; } .u-marg-r-w10of12\@lg { margin-right: 83.33333333333334%; } .u-marg-b-vh10of12\@lg { margin-bottom: 83.33333333333334vh; } .u-marg-l-w11of12\@lg { margin-left: 91.66666666666667%; } .u-marg-r-w11of12\@lg { margin-right: 91.66666666666667%; } .u-marg-b-vh11of12\@lg { margin-bottom: 91.66666666666667vh; } .u-marg-l-w12of12\@lg { margin-left: 100%; } .u-marg-r-w12of12\@lg { margin-right: 100%; } .u-marg-b-vh12of12\@lg { margin-bottom: 100vh; } .u-marg-l-w1of16\@lg { margin-left: 6.25%; } .u-marg-r-w1of16\@lg { margin-right: 6.25%; } .u-marg-b-vh1of16\@lg { margin-bottom: 6.25vh; } .u-marg-l-w2of16\@lg { margin-left: 12.5%; } .u-marg-r-w2of16\@lg { margin-right: 12.5%; } .u-marg-b-vh2of16\@lg { margin-bottom: 12.5vh; } .u-marg-l-w3of16\@lg { margin-left: 18.75%; } .u-marg-r-w3of16\@lg { margin-right: 18.75%; } .u-marg-b-vh3of16\@lg { margin-bottom: 18.75vh; } .u-marg-l-w4of16\@lg { margin-left: 25%; } .u-marg-r-w4of16\@lg { margin-right: 25%; } .u-marg-b-vh4of16\@lg { margin-bottom: 25vh; } .u-marg-l-w5of16\@lg { margin-left: 31.25%; } .u-marg-r-w5of16\@lg { margin-right: 31.25%; } .u-marg-b-vh5of16\@lg { margin-bottom: 31.25vh; } .u-marg-l-w6of16\@lg { margin-left: 37.5%; } .u-marg-r-w6of16\@lg { margin-right: 37.5%; } .u-marg-b-vh6of16\@lg { margin-bottom: 37.5vh; } .u-marg-l-w7of16\@lg { margin-left: 43.75%; } .u-marg-r-w7of16\@lg { margin-right: 43.75%; } .u-marg-b-vh7of16\@lg { margin-bottom: 43.75vh; } .u-marg-l-w8of16\@lg { margin-left: 50%; } .u-marg-r-w8of16\@lg { margin-right: 50%; } .u-marg-b-vh8of16\@lg { margin-bottom: 50vh; } .u-marg-l-w9of16\@lg { margin-left: 56.25%; } .u-marg-r-w9of16\@lg { margin-right: 56.25%; } .u-marg-b-vh9of16\@lg { margin-bottom: 56.25vh; } .u-marg-l-w10of16\@lg { margin-left: 62.5%; } .u-marg-r-w10of16\@lg { margin-right: 62.5%; } .u-marg-b-vh10of16\@lg { margin-bottom: 62.5vh; } .u-marg-l-w11of16\@lg { margin-left: 68.75%; } .u-marg-r-w11of16\@lg { margin-right: 68.75%; } .u-marg-b-vh11of16\@lg { margin-bottom: 68.75vh; } .u-marg-l-w12of16\@lg { margin-left: 75%; } .u-marg-r-w12of16\@lg { margin-right: 75%; } .u-marg-b-vh12of16\@lg { margin-bottom: 75vh; } .u-marg-l-w13of16\@lg { margin-left: 81.25%; } .u-marg-r-w13of16\@lg { margin-right: 81.25%; } .u-marg-b-vh13of16\@lg { margin-bottom: 81.25vh; } .u-marg-l-w14of16\@lg { margin-left: 87.5%; } .u-marg-r-w14of16\@lg { margin-right: 87.5%; } .u-marg-b-vh14of16\@lg { margin-bottom: 87.5vh; } .u-marg-l-w15of16\@lg { margin-left: 93.75%; } .u-marg-r-w15of16\@lg { margin-right: 93.75%; } .u-marg-b-vh15of16\@lg { margin-bottom: 93.75vh; } .u-marg-l-w16of16\@lg { margin-left: 100%; } .u-marg-r-w16of16\@lg { margin-right: 100%; } .u-marg-b-vh16of16\@lg { margin-bottom: 100vh; } .u-marg-l-w1of18\@lg { margin-left: 5.555555555555555%; } .u-marg-r-w1of18\@lg { margin-right: 5.555555555555555%; } .u-marg-b-vh1of18\@lg { margin-bottom: 5.555555555555555vh; } .u-marg-l-w2of18\@lg { margin-left: 11.11111111111111%; } .u-marg-r-w2of18\@lg { margin-right: 11.11111111111111%; } .u-marg-b-vh2of18\@lg { margin-bottom: 11.11111111111111vh; } .u-marg-l-w3of18\@lg { margin-left: 16.666666666666664%; } .u-marg-r-w3of18\@lg { margin-right: 16.666666666666664%; } .u-marg-b-vh3of18\@lg { margin-bottom: 16.666666666666664vh; } .u-marg-l-w4of18\@lg { margin-left: 22.22222222222222%; } .u-marg-r-w4of18\@lg { margin-right: 22.22222222222222%; } .u-marg-b-vh4of18\@lg { margin-bottom: 22.22222222222222vh; } .u-marg-l-w5of18\@lg { margin-left: 27.77777777777778%; } .u-marg-r-w5of18\@lg { margin-right: 27.77777777777778%; } .u-marg-b-vh5of18\@lg { margin-bottom: 27.77777777777778vh; } .u-marg-l-w6of18\@lg { margin-left: 33.33333333333333%; } .u-marg-r-w6of18\@lg { margin-right: 33.33333333333333%; } .u-marg-b-vh6of18\@lg { margin-bottom: 33.33333333333333vh; } .u-marg-l-w7of18\@lg { margin-left: 38.888888888888886%; } .u-marg-r-w7of18\@lg { margin-right: 38.888888888888886%; } .u-marg-b-vh7of18\@lg { margin-bottom: 38.888888888888886vh; } .u-marg-l-w8of18\@lg { margin-left: 44.44444444444444%; } .u-marg-r-w8of18\@lg { margin-right: 44.44444444444444%; } .u-marg-b-vh8of18\@lg { margin-bottom: 44.44444444444444vh; } .u-marg-l-w9of18\@lg { margin-left: 50%; } .u-marg-r-w9of18\@lg { margin-right: 50%; } .u-marg-b-vh9of18\@lg { margin-bottom: 50vh; } .u-marg-l-w10of18\@lg { margin-left: 55.55555555555556%; } .u-marg-r-w10of18\@lg { margin-right: 55.55555555555556%; } .u-marg-b-vh10of18\@lg { margin-bottom: 55.55555555555556vh; } .u-marg-l-w11of18\@lg { margin-left: 61.11111111111111%; } .u-marg-r-w11of18\@lg { margin-right: 61.11111111111111%; } .u-marg-b-vh11of18\@lg { margin-bottom: 61.11111111111111vh; } .u-marg-l-w12of18\@lg { margin-left: 66.66666666666666%; } .u-marg-r-w12of18\@lg { margin-right: 66.66666666666666%; } .u-marg-b-vh12of18\@lg { margin-bottom: 66.66666666666666vh; } .u-marg-l-w13of18\@lg { margin-left: 72.22222222222221%; } .u-marg-r-w13of18\@lg { margin-right: 72.22222222222221%; } .u-marg-b-vh13of18\@lg { margin-bottom: 72.22222222222221vh; } .u-marg-l-w14of18\@lg { margin-left: 77.77777777777777%; } .u-marg-r-w14of18\@lg { margin-right: 77.77777777777777%; } .u-marg-b-vh14of18\@lg { margin-bottom: 77.77777777777777vh; } .u-marg-l-w15of18\@lg { margin-left: 83.33333333333333%; } .u-marg-r-w15of18\@lg { margin-right: 83.33333333333333%; } .u-marg-b-vh15of18\@lg { margin-bottom: 83.33333333333333vh; } .u-marg-l-w16of18\@lg { margin-left: 88.88888888888889%; } .u-marg-r-w16of18\@lg { margin-right: 88.88888888888889%; } .u-marg-b-vh16of18\@lg { margin-bottom: 88.88888888888889vh; } .u-marg-l-w17of18\@lg { margin-left: 94.44444444444444%; } .u-marg-r-w17of18\@lg { margin-right: 94.44444444444444%; } .u-marg-b-vh17of18\@lg { margin-bottom: 94.44444444444444vh; } .u-marg-l-w18of18\@lg { margin-left: 100%; } .u-marg-r-w18of18\@lg { margin-right: 100%; } .u-marg-b-vh18of18\@lg { margin-bottom: 100vh; } .u-marg-l-w1of20\@lg { margin-left: 5%; } .u-marg-r-w1of20\@lg { margin-right: 5%; } .u-marg-b-vh1of20\@lg { margin-bottom: 5vh; } .u-marg-l-w2of20\@lg { margin-left: 10%; } .u-marg-r-w2of20\@lg { margin-right: 10%; } .u-marg-b-vh2of20\@lg { margin-bottom: 10vh; } .u-marg-l-w3of20\@lg { margin-left: 15%; } .u-marg-r-w3of20\@lg { margin-right: 15%; } .u-marg-b-vh3of20\@lg { margin-bottom: 15vh; } .u-marg-l-w4of20\@lg { margin-left: 20%; } .u-marg-r-w4of20\@lg { margin-right: 20%; } .u-marg-b-vh4of20\@lg { margin-bottom: 20vh; } .u-marg-l-w5of20\@lg { margin-left: 25%; } .u-marg-r-w5of20\@lg { margin-right: 25%; } .u-marg-b-vh5of20\@lg { margin-bottom: 25vh; } .u-marg-l-w6of20\@lg { margin-left: 30%; } .u-marg-r-w6of20\@lg { margin-right: 30%; } .u-marg-b-vh6of20\@lg { margin-bottom: 30vh; } .u-marg-l-w7of20\@lg { margin-left: 35%; } .u-marg-r-w7of20\@lg { margin-right: 35%; } .u-marg-b-vh7of20\@lg { margin-bottom: 35vh; } .u-marg-l-w8of20\@lg { margin-left: 40%; } .u-marg-r-w8of20\@lg { margin-right: 40%; } .u-marg-b-vh8of20\@lg { margin-bottom: 40vh; } .u-marg-l-w9of20\@lg { margin-left: 45%; } .u-marg-r-w9of20\@lg { margin-right: 45%; } .u-marg-b-vh9of20\@lg { margin-bottom: 45vh; } .u-marg-l-w10of20\@lg { margin-left: 50%; } .u-marg-r-w10of20\@lg { margin-right: 50%; } .u-marg-b-vh10of20\@lg { margin-bottom: 50vh; } .u-marg-l-w11of20\@lg { margin-left: 55%; } .u-marg-r-w11of20\@lg { margin-right: 55%; } .u-marg-b-vh11of20\@lg { margin-bottom: 55vh; } .u-marg-l-w12of20\@lg { margin-left: 60%; } .u-marg-r-w12of20\@lg { margin-right: 60%; } .u-marg-b-vh12of20\@lg { margin-bottom: 60vh; } .u-marg-l-w13of20\@lg { margin-left: 65%; } .u-marg-r-w13of20\@lg { margin-right: 65%; } .u-marg-b-vh13of20\@lg { margin-bottom: 65vh; } .u-marg-l-w14of20\@lg { margin-left: 70%; } .u-marg-r-w14of20\@lg { margin-right: 70%; } .u-marg-b-vh14of20\@lg { margin-bottom: 70vh; } .u-marg-l-w15of20\@lg { margin-left: 75%; } .u-marg-r-w15of20\@lg { margin-right: 75%; } .u-marg-b-vh15of20\@lg { margin-bottom: 75vh; } .u-marg-l-w16of20\@lg { margin-left: 80%; } .u-marg-r-w16of20\@lg { margin-right: 80%; } .u-marg-b-vh16of20\@lg { margin-bottom: 80vh; } .u-marg-l-w17of20\@lg { margin-left: 85%; } .u-marg-r-w17of20\@lg { margin-right: 85%; } .u-marg-b-vh17of20\@lg { margin-bottom: 85vh; } .u-marg-l-w18of20\@lg { margin-left: 90%; } .u-marg-r-w18of20\@lg { margin-right: 90%; } .u-marg-b-vh18of20\@lg { margin-bottom: 90vh; } .u-marg-l-w19of20\@lg { margin-left: 95%; } .u-marg-r-w19of20\@lg { margin-right: 95%; } .u-marg-b-vh19of20\@lg { margin-bottom: 95vh; } .u-marg-l-w20of20\@lg { margin-left: 100%; } .u-marg-r-w20of20\@lg { margin-right: 100%; } .u-marg-b-vh20of20\@lg { margin-bottom: 100vh; } .u-marg-l-w1of24\@lg { margin-left: 4.166666666666667%; } .u-marg-r-w1of24\@lg { margin-right: 4.166666666666667%; } .u-marg-b-vh1of24\@lg { margin-bottom: 4.166666666666667vh; } .u-marg-l-w2of24\@lg { margin-left: 8.333333333333334%; } .u-marg-r-w2of24\@lg { margin-right: 8.333333333333334%; } .u-marg-b-vh2of24\@lg { margin-bottom: 8.333333333333334vh; } .u-marg-l-w3of24\@lg { margin-left: 12.5%; } .u-marg-r-w3of24\@lg { margin-right: 12.5%; } .u-marg-b-vh3of24\@lg { margin-bottom: 12.5vh; } .u-marg-l-w4of24\@lg { margin-left: 16.666666666666668%; } .u-marg-r-w4of24\@lg { margin-right: 16.666666666666668%; } .u-marg-b-vh4of24\@lg { margin-bottom: 16.666666666666668vh; } .u-marg-l-w5of24\@lg { margin-left: 20.833333333333336%; } .u-marg-r-w5of24\@lg { margin-right: 20.833333333333336%; } .u-marg-b-vh5of24\@lg { margin-bottom: 20.833333333333336vh; } .u-marg-l-w6of24\@lg { margin-left: 25%; } .u-marg-r-w6of24\@lg { margin-right: 25%; } .u-marg-b-vh6of24\@lg { margin-bottom: 25vh; } .u-marg-l-w7of24\@lg { margin-left: 29.166666666666668%; } .u-marg-r-w7of24\@lg { margin-right: 29.166666666666668%; } .u-marg-b-vh7of24\@lg { margin-bottom: 29.166666666666668vh; } .u-marg-l-w8of24\@lg { margin-left: 33.333333333333336%; } .u-marg-r-w8of24\@lg { margin-right: 33.333333333333336%; } .u-marg-b-vh8of24\@lg { margin-bottom: 33.333333333333336vh; } .u-marg-l-w9of24\@lg { margin-left: 37.5%; } .u-marg-r-w9of24\@lg { margin-right: 37.5%; } .u-marg-b-vh9of24\@lg { margin-bottom: 37.5vh; } .u-marg-l-w10of24\@lg { margin-left: 41.66666666666667%; } .u-marg-r-w10of24\@lg { margin-right: 41.66666666666667%; } .u-marg-b-vh10of24\@lg { margin-bottom: 41.66666666666667vh; } .u-marg-l-w11of24\@lg { margin-left: 45.833333333333336%; } .u-marg-r-w11of24\@lg { margin-right: 45.833333333333336%; } .u-marg-b-vh11of24\@lg { margin-bottom: 45.833333333333336vh; } .u-marg-l-w12of24\@lg { margin-left: 50%; } .u-marg-r-w12of24\@lg { margin-right: 50%; } .u-marg-b-vh12of24\@lg { margin-bottom: 50vh; } .u-marg-l-w13of24\@lg { margin-left: 54.16666666666667%; } .u-marg-r-w13of24\@lg { margin-right: 54.16666666666667%; } .u-marg-b-vh13of24\@lg { margin-bottom: 54.16666666666667vh; } .u-marg-l-w14of24\@lg { margin-left: 58.333333333333336%; } .u-marg-r-w14of24\@lg { margin-right: 58.333333333333336%; } .u-marg-b-vh14of24\@lg { margin-bottom: 58.333333333333336vh; } .u-marg-l-w15of24\@lg { margin-left: 62.50000000000001%; } .u-marg-r-w15of24\@lg { margin-right: 62.50000000000001%; } .u-marg-b-vh15of24\@lg { margin-bottom: 62.50000000000001vh; } .u-marg-l-w16of24\@lg { margin-left: 66.66666666666667%; } .u-marg-r-w16of24\@lg { margin-right: 66.66666666666667%; } .u-marg-b-vh16of24\@lg { margin-bottom: 66.66666666666667vh; } .u-marg-l-w17of24\@lg { margin-left: 70.83333333333334%; } .u-marg-r-w17of24\@lg { margin-right: 70.83333333333334%; } .u-marg-b-vh17of24\@lg { margin-bottom: 70.83333333333334vh; } .u-marg-l-w18of24\@lg { margin-left: 75%; } .u-marg-r-w18of24\@lg { margin-right: 75%; } .u-marg-b-vh18of24\@lg { margin-bottom: 75vh; } .u-marg-l-w19of24\@lg { margin-left: 79.16666666666667%; } .u-marg-r-w19of24\@lg { margin-right: 79.16666666666667%; } .u-marg-b-vh19of24\@lg { margin-bottom: 79.16666666666667vh; } .u-marg-l-w20of24\@lg { margin-left: 83.33333333333334%; } .u-marg-r-w20of24\@lg { margin-right: 83.33333333333334%; } .u-marg-b-vh20of24\@lg { margin-bottom: 83.33333333333334vh; } .u-marg-l-w21of24\@lg { margin-left: 87.5%; } .u-marg-r-w21of24\@lg { margin-right: 87.5%; } .u-marg-b-vh21of24\@lg { margin-bottom: 87.5vh; } .u-marg-l-w22of24\@lg { margin-left: 91.66666666666667%; } .u-marg-r-w22of24\@lg { margin-right: 91.66666666666667%; } .u-marg-b-vh22of24\@lg { margin-bottom: 91.66666666666667vh; } .u-marg-l-w23of24\@lg { margin-left: 95.83333333333334%; } .u-marg-r-w23of24\@lg { margin-right: 95.83333333333334%; } .u-marg-b-vh23of24\@lg { margin-bottom: 95.83333333333334vh; } .u-marg-l-w24of24\@lg { margin-left: 100%; } .u-marg-r-w24of24\@lg { margin-right: 100%; } .u-marg-b-vh24of24\@lg { margin-bottom: 100vh; } } @media screen and (max-width: 1024px) { .u-w1of2\@md { width: 50%; } .u-marg-l-w1of2\@md { margin-left: 50%; } .u-marg-r-w1of2\@md { margin-right: 50%; } .u-marg-b-vh1of2\@md { margin-bottom: 50vh; } .u-marg-l-w2of2\@md { margin-left: 100%; } .u-marg-r-w2of2\@md { margin-right: 100%; } .u-marg-b-vh2of2\@md { margin-bottom: 100vh; } .u-marg-l-w1of3\@md { margin-left: 33.333333333333336%; } .u-marg-r-w1of3\@md { margin-right: 33.333333333333336%; } .u-marg-b-vh1of3\@md { margin-bottom: 33.333333333333336vh; } .u-marg-l-w2of3\@md { margin-left: 66.66666666666667%; } .u-marg-r-w2of3\@md { margin-right: 66.66666666666667%; } .u-marg-b-vh2of3\@md { margin-bottom: 66.66666666666667vh; } .u-marg-l-w3of3\@md { margin-left: 100%; } .u-marg-r-w3of3\@md { margin-right: 100%; } .u-marg-b-vh3of3\@md { margin-bottom: 100vh; } .u-marg-l-w1of4\@md { margin-left: 25%; } .u-marg-r-w1of4\@md { margin-right: 25%; } .u-marg-b-vh1of4\@md { margin-bottom: 25vh; } .u-marg-l-w2of4\@md { margin-left: 50%; } .u-marg-r-w2of4\@md { margin-right: 50%; } .u-marg-b-vh2of4\@md { margin-bottom: 50vh; } .u-marg-l-w3of4\@md { margin-left: 75%; } .u-marg-r-w3of4\@md { margin-right: 75%; } .u-marg-b-vh3of4\@md { margin-bottom: 75vh; } .u-marg-l-w4of4\@md { margin-left: 100%; } .u-marg-r-w4of4\@md { margin-right: 100%; } .u-marg-b-vh4of4\@md { margin-bottom: 100vh; } .u-marg-l-w1of5\@md { margin-left: 20%; } .u-marg-r-w1of5\@md { margin-right: 20%; } .u-marg-b-vh1of5\@md { margin-bottom: 20vh; } .u-marg-l-w2of5\@md { margin-left: 40%; } .u-marg-r-w2of5\@md { margin-right: 40%; } .u-marg-b-vh2of5\@md { margin-bottom: 40vh; } .u-marg-l-w3of5\@md { margin-left: 60%; } .u-marg-r-w3of5\@md { margin-right: 60%; } .u-marg-b-vh3of5\@md { margin-bottom: 60vh; } .u-marg-l-w4of5\@md { margin-left: 80%; } .u-marg-r-w4of5\@md { margin-right: 80%; } .u-marg-b-vh4of5\@md { margin-bottom: 80vh; } .u-marg-l-w5of5\@md { margin-left: 100%; } .u-marg-r-w5of5\@md { margin-right: 100%; } .u-marg-b-vh5of5\@md { margin-bottom: 100vh; } .u-marg-l-w1of6\@md { margin-left: 16.666666666666668%; } .u-marg-r-w1of6\@md { margin-right: 16.666666666666668%; } .u-marg-b-vh1of6\@md { margin-bottom: 16.666666666666668vh; } .u-marg-l-w2of6\@md { margin-left: 33.333333333333336%; } .u-marg-r-w2of6\@md { margin-right: 33.333333333333336%; } .u-marg-b-vh2of6\@md { margin-bottom: 33.333333333333336vh; } .u-marg-l-w3of6\@md { margin-left: 50%; } .u-marg-r-w3of6\@md { margin-right: 50%; } .u-marg-b-vh3of6\@md { margin-bottom: 50vh; } .u-marg-l-w4of6\@md { margin-left: 66.66666666666667%; } .u-marg-r-w4of6\@md { margin-right: 66.66666666666667%; } .u-marg-b-vh4of6\@md { margin-bottom: 66.66666666666667vh; } .u-marg-l-w5of6\@md { margin-left: 83.33333333333334%; } .u-marg-r-w5of6\@md { margin-right: 83.33333333333334%; } .u-marg-b-vh5of6\@md { margin-bottom: 83.33333333333334vh; } .u-marg-l-w6of6\@md { margin-left: 100%; } .u-marg-r-w6of6\@md { margin-right: 100%; } .u-marg-b-vh6of6\@md { margin-bottom: 100vh; } .u-marg-l-w1of7\@md { margin-left: 14.285714285714286%; } .u-marg-r-w1of7\@md { margin-right: 14.285714285714286%; } .u-marg-b-vh1of7\@md { margin-bottom: 14.285714285714286vh; } .u-marg-l-w2of7\@md { margin-left: 28.571428571428573%; } .u-marg-r-w2of7\@md { margin-right: 28.571428571428573%; } .u-marg-b-vh2of7\@md { margin-bottom: 28.571428571428573vh; } .u-marg-l-w3of7\@md { margin-left: 42.85714285714286%; } .u-marg-r-w3of7\@md { margin-right: 42.85714285714286%; } .u-marg-b-vh3of7\@md { margin-bottom: 42.85714285714286vh; } .u-marg-l-w4of7\@md { margin-left: 57.142857142857146%; } .u-marg-r-w4of7\@md { margin-right: 57.142857142857146%; } .u-marg-b-vh4of7\@md { margin-bottom: 57.142857142857146vh; } .u-marg-l-w5of7\@md { margin-left: 71.42857142857143%; } .u-marg-r-w5of7\@md { margin-right: 71.42857142857143%; } .u-marg-b-vh5of7\@md { margin-bottom: 71.42857142857143vh; } .u-marg-l-w6of7\@md { margin-left: 85.71428571428572%; } .u-marg-r-w6of7\@md { margin-right: 85.71428571428572%; } .u-marg-b-vh6of7\@md { margin-bottom: 85.71428571428572vh; } .u-marg-l-w7of7\@md { margin-left: 100%; } .u-marg-r-w7of7\@md { margin-right: 100%; } .u-marg-b-vh7of7\@md { margin-bottom: 100vh; } .u-marg-l-w1of8\@md { margin-left: 12.5%; } .u-marg-r-w1of8\@md { margin-right: 12.5%; } .u-marg-b-vh1of8\@md { margin-bottom: 12.5vh; } .u-marg-l-w2of8\@md { margin-left: 25%; } .u-marg-r-w2of8\@md { margin-right: 25%; } .u-marg-b-vh2of8\@md { margin-bottom: 25vh; } .u-marg-l-w3of8\@md { margin-left: 37.5%; } .u-marg-r-w3of8\@md { margin-right: 37.5%; } .u-marg-b-vh3of8\@md { margin-bottom: 37.5vh; } .u-marg-l-w4of8\@md { margin-left: 50%; } .u-marg-r-w4of8\@md { margin-right: 50%; } .u-marg-b-vh4of8\@md { margin-bottom: 50vh; } .u-marg-l-w5of8\@md { margin-left: 62.5%; } .u-marg-r-w5of8\@md { margin-right: 62.5%; } .u-marg-b-vh5of8\@md { margin-bottom: 62.5vh; } .u-marg-l-w6of8\@md { margin-left: 75%; } .u-marg-r-w6of8\@md { margin-right: 75%; } .u-marg-b-vh6of8\@md { margin-bottom: 75vh; } .u-marg-l-w7of8\@md { margin-left: 87.5%; } .u-marg-r-w7of8\@md { margin-right: 87.5%; } .u-marg-b-vh7of8\@md { margin-bottom: 87.5vh; } .u-marg-l-w8of8\@md { margin-left: 100%; } .u-marg-r-w8of8\@md { margin-right: 100%; } .u-marg-b-vh8of8\@md { margin-bottom: 100vh; } .u-marg-l-w1of9\@md { margin-left: 11.11111111111111%; } .u-marg-r-w1of9\@md { margin-right: 11.11111111111111%; } .u-marg-b-vh1of9\@md { margin-bottom: 11.11111111111111vh; } .u-marg-l-w2of9\@md { margin-left: 22.22222222222222%; } .u-marg-r-w2of9\@md { margin-right: 22.22222222222222%; } .u-marg-b-vh2of9\@md { margin-bottom: 22.22222222222222vh; } .u-marg-l-w3of9\@md { margin-left: 33.33333333333333%; } .u-marg-r-w3of9\@md { margin-right: 33.33333333333333%; } .u-marg-b-vh3of9\@md { margin-bottom: 33.33333333333333vh; } .u-marg-l-w4of9\@md { margin-left: 44.44444444444444%; } .u-marg-r-w4of9\@md { margin-right: 44.44444444444444%; } .u-marg-b-vh4of9\@md { margin-bottom: 44.44444444444444vh; } .u-marg-l-w5of9\@md { margin-left: 55.55555555555556%; } .u-marg-r-w5of9\@md { margin-right: 55.55555555555556%; } .u-marg-b-vh5of9\@md { margin-bottom: 55.55555555555556vh; } .u-marg-l-w6of9\@md { margin-left: 66.66666666666666%; } .u-marg-r-w6of9\@md { margin-right: 66.66666666666666%; } .u-marg-b-vh6of9\@md { margin-bottom: 66.66666666666666vh; } .u-marg-l-w7of9\@md { margin-left: 77.77777777777777%; } .u-marg-r-w7of9\@md { margin-right: 77.77777777777777%; } .u-marg-b-vh7of9\@md { margin-bottom: 77.77777777777777vh; } .u-marg-l-w8of9\@md { margin-left: 88.88888888888889%; } .u-marg-r-w8of9\@md { margin-right: 88.88888888888889%; } .u-marg-b-vh8of9\@md { margin-bottom: 88.88888888888889vh; } .u-marg-l-w9of9\@md { margin-left: 100%; } .u-marg-r-w9of9\@md { margin-right: 100%; } .u-marg-b-vh9of9\@md { margin-bottom: 100vh; } .u-marg-l-w1of10\@md { margin-left: 10%; } .u-marg-r-w1of10\@md { margin-right: 10%; } .u-marg-b-vh1of10\@md { margin-bottom: 10vh; } .u-marg-l-w2of10\@md { margin-left: 20%; } .u-marg-r-w2of10\@md { margin-right: 20%; } .u-marg-b-vh2of10\@md { margin-bottom: 20vh; } .u-marg-l-w3of10\@md { margin-left: 30%; } .u-marg-r-w3of10\@md { margin-right: 30%; } .u-marg-b-vh3of10\@md { margin-bottom: 30vh; } .u-marg-l-w4of10\@md { margin-left: 40%; } .u-marg-r-w4of10\@md { margin-right: 40%; } .u-marg-b-vh4of10\@md { margin-bottom: 40vh; } .u-marg-l-w5of10\@md { margin-left: 50%; } .u-marg-r-w5of10\@md { margin-right: 50%; } .u-marg-b-vh5of10\@md { margin-bottom: 50vh; } .u-marg-l-w6of10\@md { margin-left: 60%; } .u-marg-r-w6of10\@md { margin-right: 60%; } .u-marg-b-vh6of10\@md { margin-bottom: 60vh; } .u-marg-l-w7of10\@md { margin-left: 70%; } .u-marg-r-w7of10\@md { margin-right: 70%; } .u-marg-b-vh7of10\@md { margin-bottom: 70vh; } .u-marg-l-w8of10\@md { margin-left: 80%; } .u-marg-r-w8of10\@md { margin-right: 80%; } .u-marg-b-vh8of10\@md { margin-bottom: 80vh; } .u-marg-l-w9of10\@md { margin-left: 90%; } .u-marg-r-w9of10\@md { margin-right: 90%; } .u-marg-b-vh9of10\@md { margin-bottom: 90vh; } .u-marg-l-w10of10\@md { margin-left: 100%; } .u-marg-r-w10of10\@md { margin-right: 100%; } .u-marg-b-vh10of10\@md { margin-bottom: 100vh; } .u-marg-l-w1of12\@md { margin-left: 8.333333333333334%; } .u-marg-r-w1of12\@md { margin-right: 8.333333333333334%; } .u-pad-x-w1of12\@md { padding-right: 8.333333333333334%; } .u-pad-x-w1of12\@md { padding-left: 8.333333333333334%; } .u-marg-b-vh1of12\@md { margin-bottom: 8.333333333333334vh; } .u-marg-l-w2of12\@md { margin-left: 16.666666666666668%; } .u-marg-r-w2of12\@md { margin-right: 16.666666666666668%; } .u-marg-b-vh2of12\@md { margin-bottom: 16.666666666666668vh; } .u-marg-l-w3of12\@md { margin-left: 25%; } .u-marg-r-w3of12\@md { margin-right: 25%; } .u-marg-b-vh3of12\@md { margin-bottom: 25vh; } .u-marg-l-w4of12\@md { margin-left: 33.333333333333336%; } .u-marg-r-w4of12\@md { margin-right: 33.333333333333336%; } .u-marg-b-vh4of12\@md { margin-bottom: 33.333333333333336vh; } .u-marg-l-w5of12\@md { margin-left: 41.66666666666667%; } .u-marg-r-w5of12\@md { margin-right: 41.66666666666667%; } .u-marg-b-vh5of12\@md { margin-bottom: 41.66666666666667vh; } .u-marg-l-w6of12\@md { margin-left: 50%; } .u-marg-r-w6of12\@md { margin-right: 50%; } .u-marg-b-vh6of12\@md { margin-bottom: 50vh; } .u-marg-l-w7of12\@md { margin-left: 58.333333333333336%; } .u-marg-r-w7of12\@md { margin-right: 58.333333333333336%; } .u-marg-b-vh7of12\@md { margin-bottom: 58.333333333333336vh; } .u-marg-l-w8of12\@md { margin-left: 66.66666666666667%; } .u-marg-r-w8of12\@md { margin-right: 66.66666666666667%; } .u-marg-b-vh8of12\@md { margin-bottom: 66.66666666666667vh; } .u-w9of12\@md { width: 75%; } .u-marg-l-w9of12\@md { margin-left: 75%; } .u-marg-r-w9of12\@md { margin-right: 75%; } .u-marg-b-vh9of12\@md { margin-bottom: 75vh; } .u-marg-l-w10of12\@md { margin-left: 83.33333333333334%; } .u-marg-r-w10of12\@md { margin-right: 83.33333333333334%; } .u-marg-b-vh10of12\@md { margin-bottom: 83.33333333333334vh; } .u-marg-l-w11of12\@md { margin-left: 91.66666666666667%; } .u-marg-r-w11of12\@md { margin-right: 91.66666666666667%; } .u-marg-b-vh11of12\@md { margin-bottom: 91.66666666666667vh; } .u-marg-l-w12of12\@md { margin-left: 100%; } .u-marg-r-w12of12\@md { margin-right: 100%; } .u-marg-b-vh12of12\@md { margin-bottom: 100vh; } .u-marg-l-w1of16\@md { margin-left: 6.25%; } .u-marg-r-w1of16\@md { margin-right: 6.25%; } .u-marg-b-vh1of16\@md { margin-bottom: 6.25vh; } .u-marg-l-w2of16\@md { margin-left: 12.5%; } .u-marg-r-w2of16\@md { margin-right: 12.5%; } .u-marg-b-vh2of16\@md { margin-bottom: 12.5vh; } .u-marg-l-w3of16\@md { margin-left: 18.75%; } .u-marg-r-w3of16\@md { margin-right: 18.75%; } .u-marg-b-vh3of16\@md { margin-bottom: 18.75vh; } .u-marg-l-w4of16\@md { margin-left: 25%; } .u-marg-r-w4of16\@md { margin-right: 25%; } .u-marg-b-vh4of16\@md { margin-bottom: 25vh; } .u-marg-l-w5of16\@md { margin-left: 31.25%; } .u-marg-r-w5of16\@md { margin-right: 31.25%; } .u-marg-b-vh5of16\@md { margin-bottom: 31.25vh; } .u-marg-l-w6of16\@md { margin-left: 37.5%; } .u-marg-r-w6of16\@md { margin-right: 37.5%; } .u-marg-b-vh6of16\@md { margin-bottom: 37.5vh; } .u-marg-l-w7of16\@md { margin-left: 43.75%; } .u-marg-r-w7of16\@md { margin-right: 43.75%; } .u-marg-b-vh7of16\@md { margin-bottom: 43.75vh; } .u-marg-l-w8of16\@md { margin-left: 50%; } .u-marg-r-w8of16\@md { margin-right: 50%; } .u-marg-b-vh8of16\@md { margin-bottom: 50vh; } .u-marg-l-w9of16\@md { margin-left: 56.25%; } .u-marg-r-w9of16\@md { margin-right: 56.25%; } .u-marg-b-vh9of16\@md { margin-bottom: 56.25vh; } .u-marg-l-w10of16\@md { margin-left: 62.5%; } .u-marg-r-w10of16\@md { margin-right: 62.5%; } .u-marg-b-vh10of16\@md { margin-bottom: 62.5vh; } .u-marg-l-w11of16\@md { margin-left: 68.75%; } .u-marg-r-w11of16\@md { margin-right: 68.75%; } .u-marg-b-vh11of16\@md { margin-bottom: 68.75vh; } .u-marg-l-w12of16\@md { margin-left: 75%; } .u-marg-r-w12of16\@md { margin-right: 75%; } .u-marg-b-vh12of16\@md { margin-bottom: 75vh; } .u-marg-l-w13of16\@md { margin-left: 81.25%; } .u-marg-r-w13of16\@md { margin-right: 81.25%; } .u-marg-b-vh13of16\@md { margin-bottom: 81.25vh; } .u-marg-l-w14of16\@md { margin-left: 87.5%; } .u-marg-r-w14of16\@md { margin-right: 87.5%; } .u-marg-b-vh14of16\@md { margin-bottom: 87.5vh; } .u-marg-l-w15of16\@md { margin-left: 93.75%; } .u-marg-r-w15of16\@md { margin-right: 93.75%; } .u-marg-b-vh15of16\@md { margin-bottom: 93.75vh; } .u-marg-l-w16of16\@md { margin-left: 100%; } .u-marg-r-w16of16\@md { margin-right: 100%; } .u-marg-b-vh16of16\@md { margin-bottom: 100vh; } .u-marg-l-w1of18\@md { margin-left: 5.555555555555555%; } .u-marg-r-w1of18\@md { margin-right: 5.555555555555555%; } .u-marg-b-vh1of18\@md { margin-bottom: 5.555555555555555vh; } .u-marg-l-w2of18\@md { margin-left: 11.11111111111111%; } .u-marg-r-w2of18\@md { margin-right: 11.11111111111111%; } .u-marg-b-vh2of18\@md { margin-bottom: 11.11111111111111vh; } .u-marg-l-w3of18\@md { margin-left: 16.666666666666664%; } .u-marg-r-w3of18\@md { margin-right: 16.666666666666664%; } .u-marg-b-vh3of18\@md { margin-bottom: 16.666666666666664vh; } .u-marg-l-w4of18\@md { margin-left: 22.22222222222222%; } .u-marg-r-w4of18\@md { margin-right: 22.22222222222222%; } .u-marg-b-vh4of18\@md { margin-bottom: 22.22222222222222vh; } .u-marg-l-w5of18\@md { margin-left: 27.77777777777778%; } .u-marg-r-w5of18\@md { margin-right: 27.77777777777778%; } .u-marg-b-vh5of18\@md { margin-bottom: 27.77777777777778vh; } .u-marg-l-w6of18\@md { margin-left: 33.33333333333333%; } .u-marg-r-w6of18\@md { margin-right: 33.33333333333333%; } .u-marg-b-vh6of18\@md { margin-bottom: 33.33333333333333vh; } .u-marg-l-w7of18\@md { margin-left: 38.888888888888886%; } .u-marg-r-w7of18\@md { margin-right: 38.888888888888886%; } .u-marg-b-vh7of18\@md { margin-bottom: 38.888888888888886vh; } .u-marg-l-w8of18\@md { margin-left: 44.44444444444444%; } .u-marg-r-w8of18\@md { margin-right: 44.44444444444444%; } .u-marg-b-vh8of18\@md { margin-bottom: 44.44444444444444vh; } .u-marg-l-w9of18\@md { margin-left: 50%; } .u-marg-r-w9of18\@md { margin-right: 50%; } .u-marg-b-vh9of18\@md { margin-bottom: 50vh; } .u-marg-l-w10of18\@md { margin-left: 55.55555555555556%; } .u-marg-r-w10of18\@md { margin-right: 55.55555555555556%; } .u-marg-b-vh10of18\@md { margin-bottom: 55.55555555555556vh; } .u-marg-l-w11of18\@md { margin-left: 61.11111111111111%; } .u-marg-r-w11of18\@md { margin-right: 61.11111111111111%; } .u-marg-b-vh11of18\@md { margin-bottom: 61.11111111111111vh; } .u-marg-l-w12of18\@md { margin-left: 66.66666666666666%; } .u-marg-r-w12of18\@md { margin-right: 66.66666666666666%; } .u-marg-b-vh12of18\@md { margin-bottom: 66.66666666666666vh; } .u-marg-l-w13of18\@md { margin-left: 72.22222222222221%; } .u-marg-r-w13of18\@md { margin-right: 72.22222222222221%; } .u-marg-b-vh13of18\@md { margin-bottom: 72.22222222222221vh; } .u-marg-l-w14of18\@md { margin-left: 77.77777777777777%; } .u-marg-r-w14of18\@md { margin-right: 77.77777777777777%; } .u-marg-b-vh14of18\@md { margin-bottom: 77.77777777777777vh; } .u-marg-l-w15of18\@md { margin-left: 83.33333333333333%; } .u-marg-r-w15of18\@md { margin-right: 83.33333333333333%; } .u-marg-b-vh15of18\@md { margin-bottom: 83.33333333333333vh; } .u-marg-l-w16of18\@md { margin-left: 88.88888888888889%; } .u-marg-r-w16of18\@md { margin-right: 88.88888888888889%; } .u-marg-b-vh16of18\@md { margin-bottom: 88.88888888888889vh; } .u-marg-l-w17of18\@md { margin-left: 94.44444444444444%; } .u-marg-r-w17of18\@md { margin-right: 94.44444444444444%; } .u-marg-b-vh17of18\@md { margin-bottom: 94.44444444444444vh; } .u-marg-l-w18of18\@md { margin-left: 100%; } .u-marg-r-w18of18\@md { margin-right: 100%; } .u-marg-b-vh18of18\@md { margin-bottom: 100vh; } .u-marg-l-w1of20\@md { margin-left: 5%; } .u-marg-r-w1of20\@md { margin-right: 5%; } .u-marg-b-vh1of20\@md { margin-bottom: 5vh; } .u-marg-l-w2of20\@md { margin-left: 10%; } .u-marg-r-w2of20\@md { margin-right: 10%; } .u-marg-b-vh2of20\@md { margin-bottom: 10vh; } .u-marg-l-w3of20\@md { margin-left: 15%; } .u-marg-r-w3of20\@md { margin-right: 15%; } .u-marg-b-vh3of20\@md { margin-bottom: 15vh; } .u-marg-l-w4of20\@md { margin-left: 20%; } .u-marg-r-w4of20\@md { margin-right: 20%; } .u-marg-b-vh4of20\@md { margin-bottom: 20vh; } .u-marg-l-w5of20\@md { margin-left: 25%; } .u-marg-r-w5of20\@md { margin-right: 25%; } .u-marg-b-vh5of20\@md { margin-bottom: 25vh; } .u-marg-l-w6of20\@md { margin-left: 30%; } .u-marg-r-w6of20\@md { margin-right: 30%; } .u-marg-b-vh6of20\@md { margin-bottom: 30vh; } .u-marg-l-w7of20\@md { margin-left: 35%; } .u-marg-r-w7of20\@md { margin-right: 35%; } .u-marg-b-vh7of20\@md { margin-bottom: 35vh; } .u-marg-l-w8of20\@md { margin-left: 40%; } .u-marg-r-w8of20\@md { margin-right: 40%; } .u-marg-b-vh8of20\@md { margin-bottom: 40vh; } .u-marg-l-w9of20\@md { margin-left: 45%; } .u-marg-r-w9of20\@md { margin-right: 45%; } .u-marg-b-vh9of20\@md { margin-bottom: 45vh; } .u-marg-l-w10of20\@md { margin-left: 50%; } .u-marg-r-w10of20\@md { margin-right: 50%; } .u-marg-b-vh10of20\@md { margin-bottom: 50vh; } .u-marg-l-w11of20\@md { margin-left: 55%; } .u-marg-r-w11of20\@md { margin-right: 55%; } .u-marg-b-vh11of20\@md { margin-bottom: 55vh; } .u-marg-l-w12of20\@md { margin-left: 60%; } .u-marg-r-w12of20\@md { margin-right: 60%; } .u-marg-b-vh12of20\@md { margin-bottom: 60vh; } .u-marg-l-w13of20\@md { margin-left: 65%; } .u-marg-r-w13of20\@md { margin-right: 65%; } .u-marg-b-vh13of20\@md { margin-bottom: 65vh; } .u-marg-l-w14of20\@md { margin-left: 70%; } .u-marg-r-w14of20\@md { margin-right: 70%; } .u-marg-b-vh14of20\@md { margin-bottom: 70vh; } .u-marg-l-w15of20\@md { margin-left: 75%; } .u-marg-r-w15of20\@md { margin-right: 75%; } .u-marg-b-vh15of20\@md { margin-bottom: 75vh; } .u-marg-l-w16of20\@md { margin-left: 80%; } .u-marg-r-w16of20\@md { margin-right: 80%; } .u-marg-b-vh16of20\@md { margin-bottom: 80vh; } .u-marg-l-w17of20\@md { margin-left: 85%; } .u-marg-r-w17of20\@md { margin-right: 85%; } .u-marg-b-vh17of20\@md { margin-bottom: 85vh; } .u-marg-l-w18of20\@md { margin-left: 90%; } .u-marg-r-w18of20\@md { margin-right: 90%; } .u-marg-b-vh18of20\@md { margin-bottom: 90vh; } .u-marg-l-w19of20\@md { margin-left: 95%; } .u-marg-r-w19of20\@md { margin-right: 95%; } .u-marg-b-vh19of20\@md { margin-bottom: 95vh; } .u-marg-l-w20of20\@md { margin-left: 100%; } .u-marg-r-w20of20\@md { margin-right: 100%; } .u-marg-b-vh20of20\@md { margin-bottom: 100vh; } .u-marg-l-w1of24\@md { margin-left: 4.166666666666667%; } .u-marg-r-w1of24\@md { margin-right: 4.166666666666667%; } .u-marg-b-vh1of24\@md { margin-bottom: 4.166666666666667vh; } .u-marg-l-w2of24\@md { margin-left: 8.333333333333334%; } .u-marg-r-w2of24\@md { margin-right: 8.333333333333334%; } .u-marg-b-vh2of24\@md { margin-bottom: 8.333333333333334vh; } .u-marg-l-w3of24\@md { margin-left: 12.5%; } .u-marg-r-w3of24\@md { margin-right: 12.5%; } .u-marg-b-vh3of24\@md { margin-bottom: 12.5vh; } .u-marg-l-w4of24\@md { margin-left: 16.666666666666668%; } .u-marg-r-w4of24\@md { margin-right: 16.666666666666668%; } .u-marg-b-vh4of24\@md { margin-bottom: 16.666666666666668vh; } .u-marg-l-w5of24\@md { margin-left: 20.833333333333336%; } .u-marg-r-w5of24\@md { margin-right: 20.833333333333336%; } .u-marg-b-vh5of24\@md { margin-bottom: 20.833333333333336vh; } .u-marg-l-w6of24\@md { margin-left: 25%; } .u-marg-r-w6of24\@md { margin-right: 25%; } .u-marg-b-vh6of24\@md { margin-bottom: 25vh; } .u-marg-l-w7of24\@md { margin-left: 29.166666666666668%; } .u-marg-r-w7of24\@md { margin-right: 29.166666666666668%; } .u-marg-b-vh7of24\@md { margin-bottom: 29.166666666666668vh; } .u-marg-l-w8of24\@md { margin-left: 33.333333333333336%; } .u-marg-r-w8of24\@md { margin-right: 33.333333333333336%; } .u-marg-b-vh8of24\@md { margin-bottom: 33.333333333333336vh; } .u-marg-l-w9of24\@md { margin-left: 37.5%; } .u-marg-r-w9of24\@md { margin-right: 37.5%; } .u-marg-b-vh9of24\@md { margin-bottom: 37.5vh; } .u-marg-l-w10of24\@md { margin-left: 41.66666666666667%; } .u-marg-r-w10of24\@md { margin-right: 41.66666666666667%; } .u-marg-b-vh10of24\@md { margin-bottom: 41.66666666666667vh; } .u-marg-l-w11of24\@md { margin-left: 45.833333333333336%; } .u-marg-r-w11of24\@md { margin-right: 45.833333333333336%; } .u-marg-b-vh11of24\@md { margin-bottom: 45.833333333333336vh; } .u-marg-l-w12of24\@md { margin-left: 50%; } .u-marg-r-w12of24\@md { margin-right: 50%; } .u-marg-b-vh12of24\@md { margin-bottom: 50vh; } .u-marg-l-w13of24\@md { margin-left: 54.16666666666667%; } .u-marg-r-w13of24\@md { margin-right: 54.16666666666667%; } .u-marg-b-vh13of24\@md { margin-bottom: 54.16666666666667vh; } .u-marg-l-w14of24\@md { margin-left: 58.333333333333336%; } .u-marg-r-w14of24\@md { margin-right: 58.333333333333336%; } .u-marg-b-vh14of24\@md { margin-bottom: 58.333333333333336vh; } .u-marg-l-w15of24\@md { margin-left: 62.50000000000001%; } .u-marg-r-w15of24\@md { margin-right: 62.50000000000001%; } .u-marg-b-vh15of24\@md { margin-bottom: 62.50000000000001vh; } .u-marg-l-w16of24\@md { margin-left: 66.66666666666667%; } .u-marg-r-w16of24\@md { margin-right: 66.66666666666667%; } .u-marg-b-vh16of24\@md { margin-bottom: 66.66666666666667vh; } .u-marg-l-w17of24\@md { margin-left: 70.83333333333334%; } .u-marg-r-w17of24\@md { margin-right: 70.83333333333334%; } .u-marg-b-vh17of24\@md { margin-bottom: 70.83333333333334vh; } .u-marg-l-w18of24\@md { margin-left: 75%; } .u-marg-r-w18of24\@md { margin-right: 75%; } .u-marg-b-vh18of24\@md { margin-bottom: 75vh; } .u-marg-l-w19of24\@md { margin-left: 79.16666666666667%; } .u-marg-r-w19of24\@md { margin-right: 79.16666666666667%; } .u-marg-b-vh19of24\@md { margin-bottom: 79.16666666666667vh; } .u-marg-l-w20of24\@md { margin-left: 83.33333333333334%; } .u-marg-r-w20of24\@md { margin-right: 83.33333333333334%; } .u-marg-b-vh20of24\@md { margin-bottom: 83.33333333333334vh; } .u-marg-l-w21of24\@md { margin-left: 87.5%; } .u-marg-r-w21of24\@md { margin-right: 87.5%; } .u-marg-b-vh21of24\@md { margin-bottom: 87.5vh; } .u-marg-l-w22of24\@md { margin-left: 91.66666666666667%; } .u-marg-r-w22of24\@md { margin-right: 91.66666666666667%; } .u-marg-b-vh22of24\@md { margin-bottom: 91.66666666666667vh; } .u-marg-l-w23of24\@md { margin-left: 95.83333333333334%; } .u-marg-r-w23of24\@md { margin-right: 95.83333333333334%; } .u-marg-b-vh23of24\@md { margin-bottom: 95.83333333333334vh; } .u-marg-l-w24of24\@md { margin-left: 100%; } .u-marg-r-w24of24\@md { margin-right: 100%; } .u-marg-b-vh24of24\@md { margin-bottom: 100vh; } } @media screen and (max-width: 770px) { .u-w1of2\@sm { width: 50%; } .u-marg-l-w1of2\@sm { margin-left: 50%; } .u-marg-r-w1of2\@sm { margin-right: 50%; } .u-marg-b-vh1of2\@sm { margin-bottom: 50vh; } .u-w2of2\@sm { width: 100%; } .u-marg-l-w2of2\@sm { margin-left: 100%; } .u-marg-r-w2of2\@sm { margin-right: 100%; } .u-marg-b-vh2of2\@sm { margin-bottom: 100vh; } .u-marg-l-w1of3\@sm { margin-left: 33.333333333333336%; } .u-marg-r-w1of3\@sm { margin-right: 33.333333333333336%; } .u-marg-b-vh1of3\@sm { margin-bottom: 33.333333333333336vh; } .u-marg-l-w2of3\@sm { margin-left: 66.66666666666667%; } .u-marg-r-w2of3\@sm { margin-right: 66.66666666666667%; } .u-marg-b-vh2of3\@sm { margin-bottom: 66.66666666666667vh; } .u-marg-l-w3of3\@sm { margin-left: 100%; } .u-marg-r-w3of3\@sm { margin-right: 100%; } .u-marg-b-vh3of3\@sm { margin-bottom: 100vh; } .u-marg-l-w1of4\@sm { margin-left: 25%; } .u-marg-r-w1of4\@sm { margin-right: 25%; } .u-marg-b-vh1of4\@sm { margin-bottom: 25vh; } .u-marg-l-w2of4\@sm { margin-left: 50%; } .u-marg-r-w2of4\@sm { margin-right: 50%; } .u-marg-b-vh2of4\@sm { margin-bottom: 50vh; } .u-w3of4\@sm { width: 75%; } .u-marg-l-w3of4\@sm { margin-left: 75%; } .u-marg-r-w3of4\@sm { margin-right: 75%; } .u-marg-b-vh3of4\@sm { margin-bottom: 75vh; } .u-marg-l-w4of4\@sm { margin-left: 100%; } .u-marg-r-w4of4\@sm { margin-right: 100%; } .u-marg-b-vh4of4\@sm { margin-bottom: 100vh; } .u-marg-l-w1of5\@sm { margin-left: 20%; } .u-marg-r-w1of5\@sm { margin-right: 20%; } .u-marg-b-vh1of5\@sm { margin-bottom: 20vh; } .u-marg-l-w2of5\@sm { margin-left: 40%; } .u-marg-r-w2of5\@sm { margin-right: 40%; } .u-marg-b-vh2of5\@sm { margin-bottom: 40vh; } .u-marg-l-w3of5\@sm { margin-left: 60%; } .u-marg-r-w3of5\@sm { margin-right: 60%; } .u-marg-b-vh3of5\@sm { margin-bottom: 60vh; } .u-marg-l-w4of5\@sm { margin-left: 80%; } .u-marg-r-w4of5\@sm { margin-right: 80%; } .u-marg-b-vh4of5\@sm { margin-bottom: 80vh; } .u-marg-l-w5of5\@sm { margin-left: 100%; } .u-marg-r-w5of5\@sm { margin-right: 100%; } .u-marg-b-vh5of5\@sm { margin-bottom: 100vh; } .u-marg-l-w1of6\@sm { margin-left: 16.666666666666668%; } .u-marg-r-w1of6\@sm { margin-right: 16.666666666666668%; } .u-marg-b-vh1of6\@sm { margin-bottom: 16.666666666666668vh; } .u-marg-l-w2of6\@sm { margin-left: 33.333333333333336%; } .u-marg-r-w2of6\@sm { margin-right: 33.333333333333336%; } .u-marg-b-vh2of6\@sm { margin-bottom: 33.333333333333336vh; } .u-marg-l-w3of6\@sm { margin-left: 50%; } .u-marg-r-w3of6\@sm { margin-right: 50%; } .u-marg-b-vh3of6\@sm { margin-bottom: 50vh; } .u-marg-l-w4of6\@sm { margin-left: 66.66666666666667%; } .u-marg-r-w4of6\@sm { margin-right: 66.66666666666667%; } .u-marg-b-vh4of6\@sm { margin-bottom: 66.66666666666667vh; } .u-marg-l-w5of6\@sm { margin-left: 83.33333333333334%; } .u-marg-r-w5of6\@sm { margin-right: 83.33333333333334%; } .u-marg-b-vh5of6\@sm { margin-bottom: 83.33333333333334vh; } .u-marg-l-w6of6\@sm { margin-left: 100%; } .u-marg-r-w6of6\@sm { margin-right: 100%; } .u-marg-b-vh6of6\@sm { margin-bottom: 100vh; } .u-marg-l-w1of7\@sm { margin-left: 14.285714285714286%; } .u-marg-r-w1of7\@sm { margin-right: 14.285714285714286%; } .u-marg-b-vh1of7\@sm { margin-bottom: 14.285714285714286vh; } .u-marg-l-w2of7\@sm { margin-left: 28.571428571428573%; } .u-marg-r-w2of7\@sm { margin-right: 28.571428571428573%; } .u-marg-b-vh2of7\@sm { margin-bottom: 28.571428571428573vh; } .u-marg-l-w3of7\@sm { margin-left: 42.85714285714286%; } .u-marg-r-w3of7\@sm { margin-right: 42.85714285714286%; } .u-marg-b-vh3of7\@sm { margin-bottom: 42.85714285714286vh; } .u-marg-l-w4of7\@sm { margin-left: 57.142857142857146%; } .u-marg-r-w4of7\@sm { margin-right: 57.142857142857146%; } .u-marg-b-vh4of7\@sm { margin-bottom: 57.142857142857146vh; } .u-marg-l-w5of7\@sm { margin-left: 71.42857142857143%; } .u-marg-r-w5of7\@sm { margin-right: 71.42857142857143%; } .u-marg-b-vh5of7\@sm { margin-bottom: 71.42857142857143vh; } .u-marg-l-w6of7\@sm { margin-left: 85.71428571428572%; } .u-marg-r-w6of7\@sm { margin-right: 85.71428571428572%; } .u-marg-b-vh6of7\@sm { margin-bottom: 85.71428571428572vh; } .u-marg-l-w7of7\@sm { margin-left: 100%; } .u-marg-r-w7of7\@sm { margin-right: 100%; } .u-marg-b-vh7of7\@sm { margin-bottom: 100vh; } .u-marg-l-w1of8\@sm { margin-left: 12.5%; } .u-marg-r-w1of8\@sm { margin-right: 12.5%; } .u-pad-x-w1of8\@sm { padding-right: 12.5%; } .u-pad-x-w1of8\@sm { padding-left: 12.5%; } .u-marg-b-vh1of8\@sm { margin-bottom: 12.5vh; } .u-marg-l-w2of8\@sm { margin-left: 25%; } .u-marg-r-w2of8\@sm { margin-right: 25%; } .u-marg-b-vh2of8\@sm { margin-bottom: 25vh; } .u-marg-l-w3of8\@sm { margin-left: 37.5%; } .u-marg-r-w3of8\@sm { margin-right: 37.5%; } .u-marg-b-vh3of8\@sm { margin-bottom: 37.5vh; } .u-w4of8\@sm { width: 50%; } .u-marg-l-w4of8\@sm { margin-left: 50%; } .u-marg-r-w4of8\@sm { margin-right: 50%; } .u-marg-b-vh4of8\@sm { margin-bottom: 50vh; } .u-marg-l-w5of8\@sm { margin-left: 62.5%; } .u-marg-r-w5of8\@sm { margin-right: 62.5%; } .u-marg-b-vh5of8\@sm { margin-bottom: 62.5vh; } .u-marg-l-w6of8\@sm { margin-left: 75%; } .u-marg-r-w6of8\@sm { margin-right: 75%; } .u-marg-b-vh6of8\@sm { margin-bottom: 75vh; } .u-marg-l-w7of8\@sm { margin-left: 87.5%; } .u-marg-r-w7of8\@sm { margin-right: 87.5%; } .u-marg-b-vh7of8\@sm { margin-bottom: 87.5vh; } .u-w8of8\@sm { width: 100%; } .u-marg-l-w8of8\@sm { margin-left: 100%; } .u-marg-r-w8of8\@sm { margin-right: 100%; } .u-marg-b-vh8of8\@sm { margin-bottom: 100vh; } .u-marg-l-w1of9\@sm { margin-left: 11.11111111111111%; } .u-marg-r-w1of9\@sm { margin-right: 11.11111111111111%; } .u-marg-b-vh1of9\@sm { margin-bottom: 11.11111111111111vh; } .u-marg-l-w2of9\@sm { margin-left: 22.22222222222222%; } .u-marg-r-w2of9\@sm { margin-right: 22.22222222222222%; } .u-marg-b-vh2of9\@sm { margin-bottom: 22.22222222222222vh; } .u-marg-l-w3of9\@sm { margin-left: 33.33333333333333%; } .u-marg-r-w3of9\@sm { margin-right: 33.33333333333333%; } .u-marg-b-vh3of9\@sm { margin-bottom: 33.33333333333333vh; } .u-marg-l-w4of9\@sm { margin-left: 44.44444444444444%; } .u-marg-r-w4of9\@sm { margin-right: 44.44444444444444%; } .u-marg-b-vh4of9\@sm { margin-bottom: 44.44444444444444vh; } .u-marg-l-w5of9\@sm { margin-left: 55.55555555555556%; } .u-marg-r-w5of9\@sm { margin-right: 55.55555555555556%; } .u-marg-b-vh5of9\@sm { margin-bottom: 55.55555555555556vh; } .u-marg-l-w6of9\@sm { margin-left: 66.66666666666666%; } .u-marg-r-w6of9\@sm { margin-right: 66.66666666666666%; } .u-marg-b-vh6of9\@sm { margin-bottom: 66.66666666666666vh; } .u-marg-l-w7of9\@sm { margin-left: 77.77777777777777%; } .u-marg-r-w7of9\@sm { margin-right: 77.77777777777777%; } .u-marg-b-vh7of9\@sm { margin-bottom: 77.77777777777777vh; } .u-marg-l-w8of9\@sm { margin-left: 88.88888888888889%; } .u-marg-r-w8of9\@sm { margin-right: 88.88888888888889%; } .u-marg-b-vh8of9\@sm { margin-bottom: 88.88888888888889vh; } .u-marg-l-w9of9\@sm { margin-left: 100%; } .u-marg-r-w9of9\@sm { margin-right: 100%; } .u-marg-b-vh9of9\@sm { margin-bottom: 100vh; } .u-marg-l-w1of10\@sm { margin-left: 10%; } .u-marg-r-w1of10\@sm { margin-right: 10%; } .u-marg-b-vh1of10\@sm { margin-bottom: 10vh; } .u-marg-l-w2of10\@sm { margin-left: 20%; } .u-marg-r-w2of10\@sm { margin-right: 20%; } .u-marg-b-vh2of10\@sm { margin-bottom: 20vh; } .u-marg-l-w3of10\@sm { margin-left: 30%; } .u-marg-r-w3of10\@sm { margin-right: 30%; } .u-marg-b-vh3of10\@sm { margin-bottom: 30vh; } .u-marg-l-w4of10\@sm { margin-left: 40%; } .u-marg-r-w4of10\@sm { margin-right: 40%; } .u-marg-b-vh4of10\@sm { margin-bottom: 40vh; } .u-marg-l-w5of10\@sm { margin-left: 50%; } .u-marg-r-w5of10\@sm { margin-right: 50%; } .u-marg-b-vh5of10\@sm { margin-bottom: 50vh; } .u-marg-l-w6of10\@sm { margin-left: 60%; } .u-marg-r-w6of10\@sm { margin-right: 60%; } .u-marg-b-vh6of10\@sm { margin-bottom: 60vh; } .u-marg-l-w7of10\@sm { margin-left: 70%; } .u-marg-r-w7of10\@sm { margin-right: 70%; } .u-marg-b-vh7of10\@sm { margin-bottom: 70vh; } .u-marg-l-w8of10\@sm { margin-left: 80%; } .u-marg-r-w8of10\@sm { margin-right: 80%; } .u-marg-b-vh8of10\@sm { margin-bottom: 80vh; } .u-marg-l-w9of10\@sm { margin-left: 90%; } .u-marg-r-w9of10\@sm { margin-right: 90%; } .u-marg-b-vh9of10\@sm { margin-bottom: 90vh; } .u-marg-l-w10of10\@sm { margin-left: 100%; } .u-marg-r-w10of10\@sm { margin-right: 100%; } .u-marg-b-vh10of10\@sm { margin-bottom: 100vh; } .u-marg-l-w1of12\@sm { margin-left: 8.333333333333334%; } .u-marg-r-w1of12\@sm { margin-right: 8.333333333333334%; } .u-pad-x-w1of12\@sm { padding-right: 8.333333333333334%; } .u-pad-x-w1of12\@sm { padding-left: 8.333333333333334%; } .u-marg-b-vh1of12\@sm { margin-bottom: 8.333333333333334vh; } .u-marg-l-w2of12\@sm { margin-left: 16.666666666666668%; } .u-marg-r-w2of12\@sm { margin-right: 16.666666666666668%; } .u-marg-b-vh2of12\@sm { margin-bottom: 16.666666666666668vh; } .u-marg-l-w3of12\@sm { margin-left: 25%; } .u-marg-r-w3of12\@sm { margin-right: 25%; } .u-marg-b-vh3of12\@sm { margin-bottom: 25vh; } .u-marg-l-w4of12\@sm { margin-left: 33.333333333333336%; } .u-marg-r-w4of12\@sm { margin-right: 33.333333333333336%; } .u-marg-b-vh4of12\@sm { margin-bottom: 33.333333333333336vh; } .u-marg-l-w5of12\@sm { margin-left: 41.66666666666667%; } .u-marg-r-w5of12\@sm { margin-right: 41.66666666666667%; } .u-marg-b-vh5of12\@sm { margin-bottom: 41.66666666666667vh; } .u-marg-l-w6of12\@sm { margin-left: 50%; } .u-marg-r-w6of12\@sm { margin-right: 50%; } .u-marg-b-vh6of12\@sm { margin-bottom: 50vh; } .u-marg-l-w7of12\@sm { margin-left: 58.333333333333336%; } .u-marg-r-w7of12\@sm { margin-right: 58.333333333333336%; } .u-marg-b-vh7of12\@sm { margin-bottom: 58.333333333333336vh; } .u-marg-l-w8of12\@sm { margin-left: 66.66666666666667%; } .u-marg-r-w8of12\@sm { margin-right: 66.66666666666667%; } .u-marg-b-vh8of12\@sm { margin-bottom: 66.66666666666667vh; } .u-marg-l-w9of12\@sm { margin-left: 75%; } .u-marg-r-w9of12\@sm { margin-right: 75%; } .u-marg-b-vh9of12\@sm { margin-bottom: 75vh; } .u-w10of12\@sm { width: 83.33333333333334%; } .u-marg-l-w10of12\@sm { margin-left: 83.33333333333334%; } .u-marg-r-w10of12\@sm { margin-right: 83.33333333333334%; } .u-marg-b-vh10of12\@sm { margin-bottom: 83.33333333333334vh; } .u-marg-l-w11of12\@sm { margin-left: 91.66666666666667%; } .u-marg-r-w11of12\@sm { margin-right: 91.66666666666667%; } .u-marg-b-vh11of12\@sm { margin-bottom: 91.66666666666667vh; } .u-marg-l-w12of12\@sm { margin-left: 100%; } .u-marg-r-w12of12\@sm { margin-right: 100%; } .u-marg-b-vh12of12\@sm { margin-bottom: 100vh; } .u-marg-l-w1of16\@sm { margin-left: 6.25%; } .u-marg-r-w1of16\@sm { margin-right: 6.25%; } .u-marg-b-vh1of16\@sm { margin-bottom: 6.25vh; } .u-marg-l-w2of16\@sm { margin-left: 12.5%; } .u-marg-r-w2of16\@sm { margin-right: 12.5%; } .u-marg-b-vh2of16\@sm { margin-bottom: 12.5vh; } .u-marg-l-w3of16\@sm { margin-left: 18.75%; } .u-marg-r-w3of16\@sm { margin-right: 18.75%; } .u-marg-b-vh3of16\@sm { margin-bottom: 18.75vh; } .u-marg-l-w4of16\@sm { margin-left: 25%; } .u-marg-r-w4of16\@sm { margin-right: 25%; } .u-marg-b-vh4of16\@sm { margin-bottom: 25vh; } .u-marg-l-w5of16\@sm { margin-left: 31.25%; } .u-marg-r-w5of16\@sm { margin-right: 31.25%; } .u-marg-b-vh5of16\@sm { margin-bottom: 31.25vh; } .u-marg-l-w6of16\@sm { margin-left: 37.5%; } .u-marg-r-w6of16\@sm { margin-right: 37.5%; } .u-marg-b-vh6of16\@sm { margin-bottom: 37.5vh; } .u-marg-l-w7of16\@sm { margin-left: 43.75%; } .u-marg-r-w7of16\@sm { margin-right: 43.75%; } .u-marg-b-vh7of16\@sm { margin-bottom: 43.75vh; } .u-marg-l-w8of16\@sm { margin-left: 50%; } .u-marg-r-w8of16\@sm { margin-right: 50%; } .u-marg-b-vh8of16\@sm { margin-bottom: 50vh; } .u-marg-l-w9of16\@sm { margin-left: 56.25%; } .u-marg-r-w9of16\@sm { margin-right: 56.25%; } .u-marg-b-vh9of16\@sm { margin-bottom: 56.25vh; } .u-marg-l-w10of16\@sm { margin-left: 62.5%; } .u-marg-r-w10of16\@sm { margin-right: 62.5%; } .u-marg-b-vh10of16\@sm { margin-bottom: 62.5vh; } .u-marg-l-w11of16\@sm { margin-left: 68.75%; } .u-marg-r-w11of16\@sm { margin-right: 68.75%; } .u-marg-b-vh11of16\@sm { margin-bottom: 68.75vh; } .u-marg-l-w12of16\@sm { margin-left: 75%; } .u-marg-r-w12of16\@sm { margin-right: 75%; } .u-marg-b-vh12of16\@sm { margin-bottom: 75vh; } .u-marg-l-w13of16\@sm { margin-left: 81.25%; } .u-marg-r-w13of16\@sm { margin-right: 81.25%; } .u-marg-b-vh13of16\@sm { margin-bottom: 81.25vh; } .u-marg-l-w14of16\@sm { margin-left: 87.5%; } .u-marg-r-w14of16\@sm { margin-right: 87.5%; } .u-marg-b-vh14of16\@sm { margin-bottom: 87.5vh; } .u-marg-l-w15of16\@sm { margin-left: 93.75%; } .u-marg-r-w15of16\@sm { margin-right: 93.75%; } .u-marg-b-vh15of16\@sm { margin-bottom: 93.75vh; } .u-marg-l-w16of16\@sm { margin-left: 100%; } .u-marg-r-w16of16\@sm { margin-right: 100%; } .u-marg-b-vh16of16\@sm { margin-bottom: 100vh; } .u-marg-l-w1of18\@sm { margin-left: 5.555555555555555%; } .u-marg-r-w1of18\@sm { margin-right: 5.555555555555555%; } .u-marg-b-vh1of18\@sm { margin-bottom: 5.555555555555555vh; } .u-marg-l-w2of18\@sm { margin-left: 11.11111111111111%; } .u-marg-r-w2of18\@sm { margin-right: 11.11111111111111%; } .u-marg-b-vh2of18\@sm { margin-bottom: 11.11111111111111vh; } .u-marg-l-w3of18\@sm { margin-left: 16.666666666666664%; } .u-marg-r-w3of18\@sm { margin-right: 16.666666666666664%; } .u-marg-b-vh3of18\@sm { margin-bottom: 16.666666666666664vh; } .u-marg-l-w4of18\@sm { margin-left: 22.22222222222222%; } .u-marg-r-w4of18\@sm { margin-right: 22.22222222222222%; } .u-marg-b-vh4of18\@sm { margin-bottom: 22.22222222222222vh; } .u-marg-l-w5of18\@sm { margin-left: 27.77777777777778%; } .u-marg-r-w5of18\@sm { margin-right: 27.77777777777778%; } .u-marg-b-vh5of18\@sm { margin-bottom: 27.77777777777778vh; } .u-marg-l-w6of18\@sm { margin-left: 33.33333333333333%; } .u-marg-r-w6of18\@sm { margin-right: 33.33333333333333%; } .u-marg-b-vh6of18\@sm { margin-bottom: 33.33333333333333vh; } .u-marg-l-w7of18\@sm { margin-left: 38.888888888888886%; } .u-marg-r-w7of18\@sm { margin-right: 38.888888888888886%; } .u-marg-b-vh7of18\@sm { margin-bottom: 38.888888888888886vh; } .u-marg-l-w8of18\@sm { margin-left: 44.44444444444444%; } .u-marg-r-w8of18\@sm { margin-right: 44.44444444444444%; } .u-marg-b-vh8of18\@sm { margin-bottom: 44.44444444444444vh; } .u-marg-l-w9of18\@sm { margin-left: 50%; } .u-marg-r-w9of18\@sm { margin-right: 50%; } .u-marg-b-vh9of18\@sm { margin-bottom: 50vh; } .u-marg-l-w10of18\@sm { margin-left: 55.55555555555556%; } .u-marg-r-w10of18\@sm { margin-right: 55.55555555555556%; } .u-marg-b-vh10of18\@sm { margin-bottom: 55.55555555555556vh; } .u-marg-l-w11of18\@sm { margin-left: 61.11111111111111%; } .u-marg-r-w11of18\@sm { margin-right: 61.11111111111111%; } .u-marg-b-vh11of18\@sm { margin-bottom: 61.11111111111111vh; } .u-marg-l-w12of18\@sm { margin-left: 66.66666666666666%; } .u-marg-r-w12of18\@sm { margin-right: 66.66666666666666%; } .u-marg-b-vh12of18\@sm { margin-bottom: 66.66666666666666vh; } .u-marg-l-w13of18\@sm { margin-left: 72.22222222222221%; } .u-marg-r-w13of18\@sm { margin-right: 72.22222222222221%; } .u-marg-b-vh13of18\@sm { margin-bottom: 72.22222222222221vh; } .u-marg-l-w14of18\@sm { margin-left: 77.77777777777777%; } .u-marg-r-w14of18\@sm { margin-right: 77.77777777777777%; } .u-marg-b-vh14of18\@sm { margin-bottom: 77.77777777777777vh; } .u-marg-l-w15of18\@sm { margin-left: 83.33333333333333%; } .u-marg-r-w15of18\@sm { margin-right: 83.33333333333333%; } .u-marg-b-vh15of18\@sm { margin-bottom: 83.33333333333333vh; } .u-marg-l-w16of18\@sm { margin-left: 88.88888888888889%; } .u-marg-r-w16of18\@sm { margin-right: 88.88888888888889%; } .u-marg-b-vh16of18\@sm { margin-bottom: 88.88888888888889vh; } .u-marg-l-w17of18\@sm { margin-left: 94.44444444444444%; } .u-marg-r-w17of18\@sm { margin-right: 94.44444444444444%; } .u-marg-b-vh17of18\@sm { margin-bottom: 94.44444444444444vh; } .u-marg-l-w18of18\@sm { margin-left: 100%; } .u-marg-r-w18of18\@sm { margin-right: 100%; } .u-marg-b-vh18of18\@sm { margin-bottom: 100vh; } .u-marg-l-w1of20\@sm { margin-left: 5%; } .u-marg-r-w1of20\@sm { margin-right: 5%; } .u-marg-b-vh1of20\@sm { margin-bottom: 5vh; } .u-marg-l-w2of20\@sm { margin-left: 10%; } .u-marg-r-w2of20\@sm { margin-right: 10%; } .u-marg-b-vh2of20\@sm { margin-bottom: 10vh; } .u-marg-l-w3of20\@sm { margin-left: 15%; } .u-marg-r-w3of20\@sm { margin-right: 15%; } .u-marg-b-vh3of20\@sm { margin-bottom: 15vh; } .u-marg-l-w4of20\@sm { margin-left: 20%; } .u-marg-r-w4of20\@sm { margin-right: 20%; } .u-marg-b-vh4of20\@sm { margin-bottom: 20vh; } .u-marg-l-w5of20\@sm { margin-left: 25%; } .u-marg-r-w5of20\@sm { margin-right: 25%; } .u-marg-b-vh5of20\@sm { margin-bottom: 25vh; } .u-marg-l-w6of20\@sm { margin-left: 30%; } .u-marg-r-w6of20\@sm { margin-right: 30%; } .u-marg-b-vh6of20\@sm { margin-bottom: 30vh; } .u-marg-l-w7of20\@sm { margin-left: 35%; } .u-marg-r-w7of20\@sm { margin-right: 35%; } .u-marg-b-vh7of20\@sm { margin-bottom: 35vh; } .u-marg-l-w8of20\@sm { margin-left: 40%; } .u-marg-r-w8of20\@sm { margin-right: 40%; } .u-marg-b-vh8of20\@sm { margin-bottom: 40vh; } .u-marg-l-w9of20\@sm { margin-left: 45%; } .u-marg-r-w9of20\@sm { margin-right: 45%; } .u-marg-b-vh9of20\@sm { margin-bottom: 45vh; } .u-marg-l-w10of20\@sm { margin-left: 50%; } .u-marg-r-w10of20\@sm { margin-right: 50%; } .u-marg-b-vh10of20\@sm { margin-bottom: 50vh; } .u-marg-l-w11of20\@sm { margin-left: 55%; } .u-marg-r-w11of20\@sm { margin-right: 55%; } .u-marg-b-vh11of20\@sm { margin-bottom: 55vh; } .u-marg-l-w12of20\@sm { margin-left: 60%; } .u-marg-r-w12of20\@sm { margin-right: 60%; } .u-marg-b-vh12of20\@sm { margin-bottom: 60vh; } .u-marg-l-w13of20\@sm { margin-left: 65%; } .u-marg-r-w13of20\@sm { margin-right: 65%; } .u-marg-b-vh13of20\@sm { margin-bottom: 65vh; } .u-marg-l-w14of20\@sm { margin-left: 70%; } .u-marg-r-w14of20\@sm { margin-right: 70%; } .u-marg-b-vh14of20\@sm { margin-bottom: 70vh; } .u-marg-l-w15of20\@sm { margin-left: 75%; } .u-marg-r-w15of20\@sm { margin-right: 75%; } .u-marg-b-vh15of20\@sm { margin-bottom: 75vh; } .u-marg-l-w16of20\@sm { margin-left: 80%; } .u-marg-r-w16of20\@sm { margin-right: 80%; } .u-marg-b-vh16of20\@sm { margin-bottom: 80vh; } .u-marg-l-w17of20\@sm { margin-left: 85%; } .u-marg-r-w17of20\@sm { margin-right: 85%; } .u-marg-b-vh17of20\@sm { margin-bottom: 85vh; } .u-marg-l-w18of20\@sm { margin-left: 90%; } .u-marg-r-w18of20\@sm { margin-right: 90%; } .u-marg-b-vh18of20\@sm { margin-bottom: 90vh; } .u-marg-l-w19of20\@sm { margin-left: 95%; } .u-marg-r-w19of20\@sm { margin-right: 95%; } .u-marg-b-vh19of20\@sm { margin-bottom: 95vh; } .u-marg-l-w20of20\@sm { margin-left: 100%; } .u-marg-r-w20of20\@sm { margin-right: 100%; } .u-marg-b-vh20of20\@sm { margin-bottom: 100vh; } .u-marg-l-w1of24\@sm { margin-left: 4.166666666666667%; } .u-marg-r-w1of24\@sm { margin-right: 4.166666666666667%; } .u-marg-b-vh1of24\@sm { margin-bottom: 4.166666666666667vh; } .u-marg-l-w2of24\@sm { margin-left: 8.333333333333334%; } .u-marg-r-w2of24\@sm { margin-right: 8.333333333333334%; } .u-marg-b-vh2of24\@sm { margin-bottom: 8.333333333333334vh; } .u-marg-l-w3of24\@sm { margin-left: 12.5%; } .u-marg-r-w3of24\@sm { margin-right: 12.5%; } .u-marg-b-vh3of24\@sm { margin-bottom: 12.5vh; } .u-marg-l-w4of24\@sm { margin-left: 16.666666666666668%; } .u-marg-r-w4of24\@sm { margin-right: 16.666666666666668%; } .u-marg-b-vh4of24\@sm { margin-bottom: 16.666666666666668vh; } .u-marg-l-w5of24\@sm { margin-left: 20.833333333333336%; } .u-marg-r-w5of24\@sm { margin-right: 20.833333333333336%; } .u-marg-b-vh5of24\@sm { margin-bottom: 20.833333333333336vh; } .u-marg-l-w6of24\@sm { margin-left: 25%; } .u-marg-r-w6of24\@sm { margin-right: 25%; } .u-marg-b-vh6of24\@sm { margin-bottom: 25vh; } .u-marg-l-w7of24\@sm { margin-left: 29.166666666666668%; } .u-marg-r-w7of24\@sm { margin-right: 29.166666666666668%; } .u-marg-b-vh7of24\@sm { margin-bottom: 29.166666666666668vh; } .u-marg-l-w8of24\@sm { margin-left: 33.333333333333336%; } .u-marg-r-w8of24\@sm { margin-right: 33.333333333333336%; } .u-marg-b-vh8of24\@sm { margin-bottom: 33.333333333333336vh; } .u-marg-l-w9of24\@sm { margin-left: 37.5%; } .u-marg-r-w9of24\@sm { margin-right: 37.5%; } .u-marg-b-vh9of24\@sm { margin-bottom: 37.5vh; } .u-marg-l-w10of24\@sm { margin-left: 41.66666666666667%; } .u-marg-r-w10of24\@sm { margin-right: 41.66666666666667%; } .u-marg-b-vh10of24\@sm { margin-bottom: 41.66666666666667vh; } .u-marg-l-w11of24\@sm { margin-left: 45.833333333333336%; } .u-marg-r-w11of24\@sm { margin-right: 45.833333333333336%; } .u-marg-b-vh11of24\@sm { margin-bottom: 45.833333333333336vh; } .u-marg-l-w12of24\@sm { margin-left: 50%; } .u-marg-r-w12of24\@sm { margin-right: 50%; } .u-marg-b-vh12of24\@sm { margin-bottom: 50vh; } .u-marg-l-w13of24\@sm { margin-left: 54.16666666666667%; } .u-marg-r-w13of24\@sm { margin-right: 54.16666666666667%; } .u-marg-b-vh13of24\@sm { margin-bottom: 54.16666666666667vh; } .u-marg-l-w14of24\@sm { margin-left: 58.333333333333336%; } .u-marg-r-w14of24\@sm { margin-right: 58.333333333333336%; } .u-marg-b-vh14of24\@sm { margin-bottom: 58.333333333333336vh; } .u-marg-l-w15of24\@sm { margin-left: 62.50000000000001%; } .u-marg-r-w15of24\@sm { margin-right: 62.50000000000001%; } .u-marg-b-vh15of24\@sm { margin-bottom: 62.50000000000001vh; } .u-marg-l-w16of24\@sm { margin-left: 66.66666666666667%; } .u-marg-r-w16of24\@sm { margin-right: 66.66666666666667%; } .u-marg-b-vh16of24\@sm { margin-bottom: 66.66666666666667vh; } .u-marg-l-w17of24\@sm { margin-left: 70.83333333333334%; } .u-marg-r-w17of24\@sm { margin-right: 70.83333333333334%; } .u-marg-b-vh17of24\@sm { margin-bottom: 70.83333333333334vh; } .u-marg-l-w18of24\@sm { margin-left: 75%; } .u-marg-r-w18of24\@sm { margin-right: 75%; } .u-marg-b-vh18of24\@sm { margin-bottom: 75vh; } .u-marg-l-w19of24\@sm { margin-left: 79.16666666666667%; } .u-marg-r-w19of24\@sm { margin-right: 79.16666666666667%; } .u-marg-b-vh19of24\@sm { margin-bottom: 79.16666666666667vh; } .u-marg-l-w20of24\@sm { margin-left: 83.33333333333334%; } .u-marg-r-w20of24\@sm { margin-right: 83.33333333333334%; } .u-marg-b-vh20of24\@sm { margin-bottom: 83.33333333333334vh; } .u-marg-l-w21of24\@sm { margin-left: 87.5%; } .u-marg-r-w21of24\@sm { margin-right: 87.5%; } .u-marg-b-vh21of24\@sm { margin-bottom: 87.5vh; } .u-marg-l-w22of24\@sm { margin-left: 91.66666666666667%; } .u-marg-r-w22of24\@sm { margin-right: 91.66666666666667%; } .u-marg-b-vh22of24\@sm { margin-bottom: 91.66666666666667vh; } .u-marg-l-w23of24\@sm { margin-left: 95.83333333333334%; } .u-marg-r-w23of24\@sm { margin-right: 95.83333333333334%; } .u-marg-b-vh23of24\@sm { margin-bottom: 95.83333333333334vh; } .u-marg-l-w24of24\@sm { margin-left: 100%; } .u-marg-r-w24of24\@sm { margin-right: 100%; } .u-marg-b-vh24of24\@sm { margin-bottom: 100vh; } } @media screen and (max-width: 360px) { .u-marg-l-w1of2\@xs { margin-left: 50%; } .u-marg-r-w1of2\@xs { margin-right: 50%; } .u-marg-b-vh1of2\@xs { margin-bottom: 50vh; } .u-marg-l-w2of2\@xs { margin-left: 100%; } .u-marg-r-w2of2\@xs { margin-right: 100%; } .u-marg-b-vh2of2\@xs { margin-bottom: 100vh; } .u-marg-l-w1of3\@xs { margin-left: 33.333333333333336%; } .u-marg-r-w1of3\@xs { margin-right: 33.333333333333336%; } .u-marg-b-vh1of3\@xs { margin-bottom: 33.333333333333336vh; } .u-marg-l-w2of3\@xs { margin-left: 66.66666666666667%; } .u-marg-r-w2of3\@xs { margin-right: 66.66666666666667%; } .u-marg-b-vh2of3\@xs { margin-bottom: 66.66666666666667vh; } .u-marg-l-w3of3\@xs { margin-left: 100%; } .u-marg-r-w3of3\@xs { margin-right: 100%; } .u-marg-b-vh3of3\@xs { margin-bottom: 100vh; } .u-marg-l-w1of4\@xs { margin-left: 25%; } .u-marg-r-w1of4\@xs { margin-right: 25%; } .u-marg-b-vh1of4\@xs { margin-bottom: 25vh; } .u-marg-l-w2of4\@xs { margin-left: 50%; } .u-marg-r-w2of4\@xs { margin-right: 50%; } .u-marg-b-vh2of4\@xs { margin-bottom: 50vh; } .u-marg-l-w3of4\@xs { margin-left: 75%; } .u-marg-r-w3of4\@xs { margin-right: 75%; } .u-marg-b-vh3of4\@xs { margin-bottom: 75vh; } .u-marg-l-w4of4\@xs { margin-left: 100%; } .u-marg-r-w4of4\@xs { margin-right: 100%; } .u-marg-b-vh4of4\@xs { margin-bottom: 100vh; } .u-marg-l-w1of5\@xs { margin-left: 20%; } .u-marg-r-w1of5\@xs { margin-right: 20%; } .u-marg-b-vh1of5\@xs { margin-bottom: 20vh; } .u-marg-l-w2of5\@xs { margin-left: 40%; } .u-marg-r-w2of5\@xs { margin-right: 40%; } .u-marg-b-vh2of5\@xs { margin-bottom: 40vh; } .u-marg-l-w3of5\@xs { margin-left: 60%; } .u-marg-r-w3of5\@xs { margin-right: 60%; } .u-marg-b-vh3of5\@xs { margin-bottom: 60vh; } .u-marg-l-w4of5\@xs { margin-left: 80%; } .u-marg-r-w4of5\@xs { margin-right: 80%; } .u-marg-b-vh4of5\@xs { margin-bottom: 80vh; } .u-marg-l-w5of5\@xs { margin-left: 100%; } .u-marg-r-w5of5\@xs { margin-right: 100%; } .u-marg-b-vh5of5\@xs { margin-bottom: 100vh; } .u-marg-l-w1of6\@xs { margin-left: 16.666666666666668%; } .u-marg-r-w1of6\@xs { margin-right: 16.666666666666668%; } .u-marg-b-vh1of6\@xs { margin-bottom: 16.666666666666668vh; } .u-marg-l-w2of6\@xs { margin-left: 33.333333333333336%; } .u-marg-r-w2of6\@xs { margin-right: 33.333333333333336%; } .u-marg-b-vh2of6\@xs { margin-bottom: 33.333333333333336vh; } .u-marg-l-w3of6\@xs { margin-left: 50%; } .u-marg-r-w3of6\@xs { margin-right: 50%; } .u-marg-b-vh3of6\@xs { margin-bottom: 50vh; } .u-marg-l-w4of6\@xs { margin-left: 66.66666666666667%; } .u-marg-r-w4of6\@xs { margin-right: 66.66666666666667%; } .u-marg-b-vh4of6\@xs { margin-bottom: 66.66666666666667vh; } .u-marg-l-w5of6\@xs { margin-left: 83.33333333333334%; } .u-marg-r-w5of6\@xs { margin-right: 83.33333333333334%; } .u-marg-b-vh5of6\@xs { margin-bottom: 83.33333333333334vh; } .u-marg-l-w6of6\@xs { margin-left: 100%; } .u-marg-r-w6of6\@xs { margin-right: 100%; } .u-marg-b-vh6of6\@xs { margin-bottom: 100vh; } .u-marg-l-w1of7\@xs { margin-left: 14.285714285714286%; } .u-marg-r-w1of7\@xs { margin-right: 14.285714285714286%; } .u-marg-b-vh1of7\@xs { margin-bottom: 14.285714285714286vh; } .u-marg-l-w2of7\@xs { margin-left: 28.571428571428573%; } .u-marg-r-w2of7\@xs { margin-right: 28.571428571428573%; } .u-marg-b-vh2of7\@xs { margin-bottom: 28.571428571428573vh; } .u-marg-l-w3of7\@xs { margin-left: 42.85714285714286%; } .u-marg-r-w3of7\@xs { margin-right: 42.85714285714286%; } .u-marg-b-vh3of7\@xs { margin-bottom: 42.85714285714286vh; } .u-marg-l-w4of7\@xs { margin-left: 57.142857142857146%; } .u-marg-r-w4of7\@xs { margin-right: 57.142857142857146%; } .u-marg-b-vh4of7\@xs { margin-bottom: 57.142857142857146vh; } .u-marg-l-w5of7\@xs { margin-left: 71.42857142857143%; } .u-marg-r-w5of7\@xs { margin-right: 71.42857142857143%; } .u-marg-b-vh5of7\@xs { margin-bottom: 71.42857142857143vh; } .u-marg-l-w6of7\@xs { margin-left: 85.71428571428572%; } .u-marg-r-w6of7\@xs { margin-right: 85.71428571428572%; } .u-marg-b-vh6of7\@xs { margin-bottom: 85.71428571428572vh; } .u-marg-l-w7of7\@xs { margin-left: 100%; } .u-marg-r-w7of7\@xs { margin-right: 100%; } .u-marg-b-vh7of7\@xs { margin-bottom: 100vh; } .u-marg-l-w1of8\@xs { margin-left: 12.5%; } .u-marg-r-w1of8\@xs { margin-right: 12.5%; } .u-marg-b-vh1of8\@xs { margin-bottom: 12.5vh; } .u-marg-l-w2of8\@xs { margin-left: 25%; } .u-marg-r-w2of8\@xs { margin-right: 25%; } .u-marg-b-vh2of8\@xs { margin-bottom: 25vh; } .u-marg-l-w3of8\@xs { margin-left: 37.5%; } .u-marg-r-w3of8\@xs { margin-right: 37.5%; } .u-marg-b-vh3of8\@xs { margin-bottom: 37.5vh; } .u-marg-l-w4of8\@xs { margin-left: 50%; } .u-marg-r-w4of8\@xs { margin-right: 50%; } .u-marg-b-vh4of8\@xs { margin-bottom: 50vh; } .u-marg-l-w5of8\@xs { margin-left: 62.5%; } .u-marg-r-w5of8\@xs { margin-right: 62.5%; } .u-marg-b-vh5of8\@xs { margin-bottom: 62.5vh; } .u-w6of8\@xs { width: 75%; } .u-marg-l-w6of8\@xs { margin-left: 75%; } .u-marg-r-w6of8\@xs { margin-right: 75%; } .u-marg-b-vh6of8\@xs { margin-bottom: 75vh; } .u-marg-l-w7of8\@xs { margin-left: 87.5%; } .u-marg-r-w7of8\@xs { margin-right: 87.5%; } .u-marg-b-vh7of8\@xs { margin-bottom: 87.5vh; } .u-marg-l-w8of8\@xs { margin-left: 100%; } .u-marg-r-w8of8\@xs { margin-right: 100%; } .u-marg-b-vh8of8\@xs { margin-bottom: 100vh; } .u-marg-l-w1of9\@xs { margin-left: 11.11111111111111%; } .u-marg-r-w1of9\@xs { margin-right: 11.11111111111111%; } .u-marg-b-vh1of9\@xs { margin-bottom: 11.11111111111111vh; } .u-marg-l-w2of9\@xs { margin-left: 22.22222222222222%; } .u-marg-r-w2of9\@xs { margin-right: 22.22222222222222%; } .u-marg-b-vh2of9\@xs { margin-bottom: 22.22222222222222vh; } .u-marg-l-w3of9\@xs { margin-left: 33.33333333333333%; } .u-marg-r-w3of9\@xs { margin-right: 33.33333333333333%; } .u-marg-b-vh3of9\@xs { margin-bottom: 33.33333333333333vh; } .u-marg-l-w4of9\@xs { margin-left: 44.44444444444444%; } .u-marg-r-w4of9\@xs { margin-right: 44.44444444444444%; } .u-marg-b-vh4of9\@xs { margin-bottom: 44.44444444444444vh; } .u-marg-l-w5of9\@xs { margin-left: 55.55555555555556%; } .u-marg-r-w5of9\@xs { margin-right: 55.55555555555556%; } .u-marg-b-vh5of9\@xs { margin-bottom: 55.55555555555556vh; } .u-marg-l-w6of9\@xs { margin-left: 66.66666666666666%; } .u-marg-r-w6of9\@xs { margin-right: 66.66666666666666%; } .u-marg-b-vh6of9\@xs { margin-bottom: 66.66666666666666vh; } .u-marg-l-w7of9\@xs { margin-left: 77.77777777777777%; } .u-marg-r-w7of9\@xs { margin-right: 77.77777777777777%; } .u-marg-b-vh7of9\@xs { margin-bottom: 77.77777777777777vh; } .u-marg-l-w8of9\@xs { margin-left: 88.88888888888889%; } .u-marg-r-w8of9\@xs { margin-right: 88.88888888888889%; } .u-marg-b-vh8of9\@xs { margin-bottom: 88.88888888888889vh; } .u-marg-l-w9of9\@xs { margin-left: 100%; } .u-marg-r-w9of9\@xs { margin-right: 100%; } .u-marg-b-vh9of9\@xs { margin-bottom: 100vh; } .u-marg-l-w1of10\@xs { margin-left: 10%; } .u-marg-r-w1of10\@xs { margin-right: 10%; } .u-marg-b-vh1of10\@xs { margin-bottom: 10vh; } .u-marg-l-w2of10\@xs { margin-left: 20%; } .u-marg-r-w2of10\@xs { margin-right: 20%; } .u-marg-b-vh2of10\@xs { margin-bottom: 20vh; } .u-marg-l-w3of10\@xs { margin-left: 30%; } .u-marg-r-w3of10\@xs { margin-right: 30%; } .u-marg-b-vh3of10\@xs { margin-bottom: 30vh; } .u-marg-l-w4of10\@xs { margin-left: 40%; } .u-marg-r-w4of10\@xs { margin-right: 40%; } .u-marg-b-vh4of10\@xs { margin-bottom: 40vh; } .u-marg-l-w5of10\@xs { margin-left: 50%; } .u-marg-r-w5of10\@xs { margin-right: 50%; } .u-marg-b-vh5of10\@xs { margin-bottom: 50vh; } .u-marg-l-w6of10\@xs { margin-left: 60%; } .u-marg-r-w6of10\@xs { margin-right: 60%; } .u-marg-b-vh6of10\@xs { margin-bottom: 60vh; } .u-marg-l-w7of10\@xs { margin-left: 70%; } .u-marg-r-w7of10\@xs { margin-right: 70%; } .u-marg-b-vh7of10\@xs { margin-bottom: 70vh; } .u-marg-l-w8of10\@xs { margin-left: 80%; } .u-marg-r-w8of10\@xs { margin-right: 80%; } .u-marg-b-vh8of10\@xs { margin-bottom: 80vh; } .u-marg-l-w9of10\@xs { margin-left: 90%; } .u-marg-r-w9of10\@xs { margin-right: 90%; } .u-marg-b-vh9of10\@xs { margin-bottom: 90vh; } .u-marg-l-w10of10\@xs { margin-left: 100%; } .u-marg-r-w10of10\@xs { margin-right: 100%; } .u-marg-b-vh10of10\@xs { margin-bottom: 100vh; } .u-marg-l-w1of12\@xs { margin-left: 8.333333333333334%; } .u-marg-r-w1of12\@xs { margin-right: 8.333333333333334%; } .u-marg-b-vh1of12\@xs { margin-bottom: 8.333333333333334vh; } .u-marg-l-w2of12\@xs { margin-left: 16.666666666666668%; } .u-marg-r-w2of12\@xs { margin-right: 16.666666666666668%; } .u-marg-b-vh2of12\@xs { margin-bottom: 16.666666666666668vh; } .u-marg-l-w3of12\@xs { margin-left: 25%; } .u-marg-r-w3of12\@xs { margin-right: 25%; } .u-marg-b-vh3of12\@xs { margin-bottom: 25vh; } .u-marg-l-w4of12\@xs { margin-left: 33.333333333333336%; } .u-marg-r-w4of12\@xs { margin-right: 33.333333333333336%; } .u-marg-b-vh4of12\@xs { margin-bottom: 33.333333333333336vh; } .u-marg-l-w5of12\@xs { margin-left: 41.66666666666667%; } .u-marg-r-w5of12\@xs { margin-right: 41.66666666666667%; } .u-marg-b-vh5of12\@xs { margin-bottom: 41.66666666666667vh; } .u-marg-l-w6of12\@xs { margin-left: 50%; } .u-marg-r-w6of12\@xs { margin-right: 50%; } .u-marg-b-vh6of12\@xs { margin-bottom: 50vh; } .u-marg-l-w7of12\@xs { margin-left: 58.333333333333336%; } .u-marg-r-w7of12\@xs { margin-right: 58.333333333333336%; } .u-marg-b-vh7of12\@xs { margin-bottom: 58.333333333333336vh; } .u-marg-l-w8of12\@xs { margin-left: 66.66666666666667%; } .u-marg-r-w8of12\@xs { margin-right: 66.66666666666667%; } .u-marg-b-vh8of12\@xs { margin-bottom: 66.66666666666667vh; } .u-marg-l-w9of12\@xs { margin-left: 75%; } .u-marg-r-w9of12\@xs { margin-right: 75%; } .u-marg-b-vh9of12\@xs { margin-bottom: 75vh; } .u-marg-l-w10of12\@xs { margin-left: 83.33333333333334%; } .u-marg-r-w10of12\@xs { margin-right: 83.33333333333334%; } .u-marg-b-vh10of12\@xs { margin-bottom: 83.33333333333334vh; } .u-marg-l-w11of12\@xs { margin-left: 91.66666666666667%; } .u-marg-r-w11of12\@xs { margin-right: 91.66666666666667%; } .u-marg-b-vh11of12\@xs { margin-bottom: 91.66666666666667vh; } .u-marg-l-w12of12\@xs { margin-left: 100%; } .u-marg-r-w12of12\@xs { margin-right: 100%; } .u-marg-b-vh12of12\@xs { margin-bottom: 100vh; } .u-marg-l-w1of16\@xs { margin-left: 6.25%; } .u-marg-r-w1of16\@xs { margin-right: 6.25%; } .u-marg-b-vh1of16\@xs { margin-bottom: 6.25vh; } .u-marg-l-w2of16\@xs { margin-left: 12.5%; } .u-marg-r-w2of16\@xs { margin-right: 12.5%; } .u-marg-b-vh2of16\@xs { margin-bottom: 12.5vh; } .u-marg-l-w3of16\@xs { margin-left: 18.75%; } .u-marg-r-w3of16\@xs { margin-right: 18.75%; } .u-marg-b-vh3of16\@xs { margin-bottom: 18.75vh; } .u-marg-l-w4of16\@xs { margin-left: 25%; } .u-marg-r-w4of16\@xs { margin-right: 25%; } .u-marg-b-vh4of16\@xs { margin-bottom: 25vh; } .u-marg-l-w5of16\@xs { margin-left: 31.25%; } .u-marg-r-w5of16\@xs { margin-right: 31.25%; } .u-marg-b-vh5of16\@xs { margin-bottom: 31.25vh; } .u-marg-l-w6of16\@xs { margin-left: 37.5%; } .u-marg-r-w6of16\@xs { margin-right: 37.5%; } .u-marg-b-vh6of16\@xs { margin-bottom: 37.5vh; } .u-marg-l-w7of16\@xs { margin-left: 43.75%; } .u-marg-r-w7of16\@xs { margin-right: 43.75%; } .u-marg-b-vh7of16\@xs { margin-bottom: 43.75vh; } .u-marg-l-w8of16\@xs { margin-left: 50%; } .u-marg-r-w8of16\@xs { margin-right: 50%; } .u-marg-b-vh8of16\@xs { margin-bottom: 50vh; } .u-marg-l-w9of16\@xs { margin-left: 56.25%; } .u-marg-r-w9of16\@xs { margin-right: 56.25%; } .u-marg-b-vh9of16\@xs { margin-bottom: 56.25vh; } .u-marg-l-w10of16\@xs { margin-left: 62.5%; } .u-marg-r-w10of16\@xs { margin-right: 62.5%; } .u-marg-b-vh10of16\@xs { margin-bottom: 62.5vh; } .u-marg-l-w11of16\@xs { margin-left: 68.75%; } .u-marg-r-w11of16\@xs { margin-right: 68.75%; } .u-marg-b-vh11of16\@xs { margin-bottom: 68.75vh; } .u-marg-l-w12of16\@xs { margin-left: 75%; } .u-marg-r-w12of16\@xs { margin-right: 75%; } .u-marg-b-vh12of16\@xs { margin-bottom: 75vh; } .u-marg-l-w13of16\@xs { margin-left: 81.25%; } .u-marg-r-w13of16\@xs { margin-right: 81.25%; } .u-marg-b-vh13of16\@xs { margin-bottom: 81.25vh; } .u-marg-l-w14of16\@xs { margin-left: 87.5%; } .u-marg-r-w14of16\@xs { margin-right: 87.5%; } .u-marg-b-vh14of16\@xs { margin-bottom: 87.5vh; } .u-marg-l-w15of16\@xs { margin-left: 93.75%; } .u-marg-r-w15of16\@xs { margin-right: 93.75%; } .u-marg-b-vh15of16\@xs { margin-bottom: 93.75vh; } .u-marg-l-w16of16\@xs { margin-left: 100%; } .u-marg-r-w16of16\@xs { margin-right: 100%; } .u-marg-b-vh16of16\@xs { margin-bottom: 100vh; } .u-marg-l-w1of18\@xs { margin-left: 5.555555555555555%; } .u-marg-r-w1of18\@xs { margin-right: 5.555555555555555%; } .u-marg-b-vh1of18\@xs { margin-bottom: 5.555555555555555vh; } .u-marg-l-w2of18\@xs { margin-left: 11.11111111111111%; } .u-marg-r-w2of18\@xs { margin-right: 11.11111111111111%; } .u-marg-b-vh2of18\@xs { margin-bottom: 11.11111111111111vh; } .u-marg-l-w3of18\@xs { margin-left: 16.666666666666664%; } .u-marg-r-w3of18\@xs { margin-right: 16.666666666666664%; } .u-marg-b-vh3of18\@xs { margin-bottom: 16.666666666666664vh; } .u-marg-l-w4of18\@xs { margin-left: 22.22222222222222%; } .u-marg-r-w4of18\@xs { margin-right: 22.22222222222222%; } .u-marg-b-vh4of18\@xs { margin-bottom: 22.22222222222222vh; } .u-marg-l-w5of18\@xs { margin-left: 27.77777777777778%; } .u-marg-r-w5of18\@xs { margin-right: 27.77777777777778%; } .u-marg-b-vh5of18\@xs { margin-bottom: 27.77777777777778vh; } .u-marg-l-w6of18\@xs { margin-left: 33.33333333333333%; } .u-marg-r-w6of18\@xs { margin-right: 33.33333333333333%; } .u-marg-b-vh6of18\@xs { margin-bottom: 33.33333333333333vh; } .u-marg-l-w7of18\@xs { margin-left: 38.888888888888886%; } .u-marg-r-w7of18\@xs { margin-right: 38.888888888888886%; } .u-marg-b-vh7of18\@xs { margin-bottom: 38.888888888888886vh; } .u-marg-l-w8of18\@xs { margin-left: 44.44444444444444%; } .u-marg-r-w8of18\@xs { margin-right: 44.44444444444444%; } .u-marg-b-vh8of18\@xs { margin-bottom: 44.44444444444444vh; } .u-marg-l-w9of18\@xs { margin-left: 50%; } .u-marg-r-w9of18\@xs { margin-right: 50%; } .u-marg-b-vh9of18\@xs { margin-bottom: 50vh; } .u-marg-l-w10of18\@xs { margin-left: 55.55555555555556%; } .u-marg-r-w10of18\@xs { margin-right: 55.55555555555556%; } .u-marg-b-vh10of18\@xs { margin-bottom: 55.55555555555556vh; } .u-marg-l-w11of18\@xs { margin-left: 61.11111111111111%; } .u-marg-r-w11of18\@xs { margin-right: 61.11111111111111%; } .u-marg-b-vh11of18\@xs { margin-bottom: 61.11111111111111vh; } .u-marg-l-w12of18\@xs { margin-left: 66.66666666666666%; } .u-marg-r-w12of18\@xs { margin-right: 66.66666666666666%; } .u-marg-b-vh12of18\@xs { margin-bottom: 66.66666666666666vh; } .u-marg-l-w13of18\@xs { margin-left: 72.22222222222221%; } .u-marg-r-w13of18\@xs { margin-right: 72.22222222222221%; } .u-marg-b-vh13of18\@xs { margin-bottom: 72.22222222222221vh; } .u-marg-l-w14of18\@xs { margin-left: 77.77777777777777%; } .u-marg-r-w14of18\@xs { margin-right: 77.77777777777777%; } .u-marg-b-vh14of18\@xs { margin-bottom: 77.77777777777777vh; } .u-marg-l-w15of18\@xs { margin-left: 83.33333333333333%; } .u-marg-r-w15of18\@xs { margin-right: 83.33333333333333%; } .u-marg-b-vh15of18\@xs { margin-bottom: 83.33333333333333vh; } .u-marg-l-w16of18\@xs { margin-left: 88.88888888888889%; } .u-marg-r-w16of18\@xs { margin-right: 88.88888888888889%; } .u-marg-b-vh16of18\@xs { margin-bottom: 88.88888888888889vh; } .u-marg-l-w17of18\@xs { margin-left: 94.44444444444444%; } .u-marg-r-w17of18\@xs { margin-right: 94.44444444444444%; } .u-marg-b-vh17of18\@xs { margin-bottom: 94.44444444444444vh; } .u-marg-l-w18of18\@xs { margin-left: 100%; } .u-marg-r-w18of18\@xs { margin-right: 100%; } .u-marg-b-vh18of18\@xs { margin-bottom: 100vh; } .u-marg-l-w1of20\@xs { margin-left: 5%; } .u-marg-r-w1of20\@xs { margin-right: 5%; } .u-marg-b-vh1of20\@xs { margin-bottom: 5vh; } .u-marg-l-w2of20\@xs { margin-left: 10%; } .u-marg-r-w2of20\@xs { margin-right: 10%; } .u-marg-b-vh2of20\@xs { margin-bottom: 10vh; } .u-marg-l-w3of20\@xs { margin-left: 15%; } .u-marg-r-w3of20\@xs { margin-right: 15%; } .u-marg-b-vh3of20\@xs { margin-bottom: 15vh; } .u-marg-l-w4of20\@xs { margin-left: 20%; } .u-marg-r-w4of20\@xs { margin-right: 20%; } .u-marg-b-vh4of20\@xs { margin-bottom: 20vh; } .u-marg-l-w5of20\@xs { margin-left: 25%; } .u-marg-r-w5of20\@xs { margin-right: 25%; } .u-marg-b-vh5of20\@xs { margin-bottom: 25vh; } .u-marg-l-w6of20\@xs { margin-left: 30%; } .u-marg-r-w6of20\@xs { margin-right: 30%; } .u-marg-b-vh6of20\@xs { margin-bottom: 30vh; } .u-marg-l-w7of20\@xs { margin-left: 35%; } .u-marg-r-w7of20\@xs { margin-right: 35%; } .u-marg-b-vh7of20\@xs { margin-bottom: 35vh; } .u-marg-l-w8of20\@xs { margin-left: 40%; } .u-marg-r-w8of20\@xs { margin-right: 40%; } .u-marg-b-vh8of20\@xs { margin-bottom: 40vh; } .u-marg-l-w9of20\@xs { margin-left: 45%; } .u-marg-r-w9of20\@xs { margin-right: 45%; } .u-marg-b-vh9of20\@xs { margin-bottom: 45vh; } .u-marg-l-w10of20\@xs { margin-left: 50%; } .u-marg-r-w10of20\@xs { margin-right: 50%; } .u-marg-b-vh10of20\@xs { margin-bottom: 50vh; } .u-marg-l-w11of20\@xs { margin-left: 55%; } .u-marg-r-w11of20\@xs { margin-right: 55%; } .u-marg-b-vh11of20\@xs { margin-bottom: 55vh; } .u-marg-l-w12of20\@xs { margin-left: 60%; } .u-marg-r-w12of20\@xs { margin-right: 60%; } .u-marg-b-vh12of20\@xs { margin-bottom: 60vh; } .u-marg-l-w13of20\@xs { margin-left: 65%; } .u-marg-r-w13of20\@xs { margin-right: 65%; } .u-marg-b-vh13of20\@xs { margin-bottom: 65vh; } .u-marg-l-w14of20\@xs { margin-left: 70%; } .u-marg-r-w14of20\@xs { margin-right: 70%; } .u-marg-b-vh14of20\@xs { margin-bottom: 70vh; } .u-marg-l-w15of20\@xs { margin-left: 75%; } .u-marg-r-w15of20\@xs { margin-right: 75%; } .u-marg-b-vh15of20\@xs { margin-bottom: 75vh; } .u-marg-l-w16of20\@xs { margin-left: 80%; } .u-marg-r-w16of20\@xs { margin-right: 80%; } .u-marg-b-vh16of20\@xs { margin-bottom: 80vh; } .u-marg-l-w17of20\@xs { margin-left: 85%; } .u-marg-r-w17of20\@xs { margin-right: 85%; } .u-marg-b-vh17of20\@xs { margin-bottom: 85vh; } .u-marg-l-w18of20\@xs { margin-left: 90%; } .u-marg-r-w18of20\@xs { margin-right: 90%; } .u-marg-b-vh18of20\@xs { margin-bottom: 90vh; } .u-marg-l-w19of20\@xs { margin-left: 95%; } .u-marg-r-w19of20\@xs { margin-right: 95%; } .u-marg-b-vh19of20\@xs { margin-bottom: 95vh; } .u-marg-l-w20of20\@xs { margin-left: 100%; } .u-marg-r-w20of20\@xs { margin-right: 100%; } .u-marg-b-vh20of20\@xs { margin-bottom: 100vh; } .u-marg-l-w1of24\@xs { margin-left: 4.166666666666667%; } .u-marg-r-w1of24\@xs { margin-right: 4.166666666666667%; } .u-marg-b-vh1of24\@xs { margin-bottom: 4.166666666666667vh; } .u-marg-l-w2of24\@xs { margin-left: 8.333333333333334%; } .u-marg-r-w2of24\@xs { margin-right: 8.333333333333334%; } .u-marg-b-vh2of24\@xs { margin-bottom: 8.333333333333334vh; } .u-marg-l-w3of24\@xs { margin-left: 12.5%; } .u-marg-r-w3of24\@xs { margin-right: 12.5%; } .u-marg-b-vh3of24\@xs { margin-bottom: 12.5vh; } .u-marg-l-w4of24\@xs { margin-left: 16.666666666666668%; } .u-marg-r-w4of24\@xs { margin-right: 16.666666666666668%; } .u-marg-b-vh4of24\@xs { margin-bottom: 16.666666666666668vh; } .u-marg-l-w5of24\@xs { margin-left: 20.833333333333336%; } .u-marg-r-w5of24\@xs { margin-right: 20.833333333333336%; } .u-marg-b-vh5of24\@xs { margin-bottom: 20.833333333333336vh; } .u-marg-l-w6of24\@xs { margin-left: 25%; } .u-marg-r-w6of24\@xs { margin-right: 25%; } .u-marg-b-vh6of24\@xs { margin-bottom: 25vh; } .u-marg-l-w7of24\@xs { margin-left: 29.166666666666668%; } .u-marg-r-w7of24\@xs { margin-right: 29.166666666666668%; } .u-marg-b-vh7of24\@xs { margin-bottom: 29.166666666666668vh; } .u-marg-l-w8of24\@xs { margin-left: 33.333333333333336%; } .u-marg-r-w8of24\@xs { margin-right: 33.333333333333336%; } .u-marg-b-vh8of24\@xs { margin-bottom: 33.333333333333336vh; } .u-marg-l-w9of24\@xs { margin-left: 37.5%; } .u-marg-r-w9of24\@xs { margin-right: 37.5%; } .u-marg-b-vh9of24\@xs { margin-bottom: 37.5vh; } .u-marg-l-w10of24\@xs { margin-left: 41.66666666666667%; } .u-marg-r-w10of24\@xs { margin-right: 41.66666666666667%; } .u-marg-b-vh10of24\@xs { margin-bottom: 41.66666666666667vh; } .u-marg-l-w11of24\@xs { margin-left: 45.833333333333336%; } .u-marg-r-w11of24\@xs { margin-right: 45.833333333333336%; } .u-marg-b-vh11of24\@xs { margin-bottom: 45.833333333333336vh; } .u-marg-l-w12of24\@xs { margin-left: 50%; } .u-marg-r-w12of24\@xs { margin-right: 50%; } .u-marg-b-vh12of24\@xs { margin-bottom: 50vh; } .u-marg-l-w13of24\@xs { margin-left: 54.16666666666667%; } .u-marg-r-w13of24\@xs { margin-right: 54.16666666666667%; } .u-marg-b-vh13of24\@xs { margin-bottom: 54.16666666666667vh; } .u-marg-l-w14of24\@xs { margin-left: 58.333333333333336%; } .u-marg-r-w14of24\@xs { margin-right: 58.333333333333336%; } .u-marg-b-vh14of24\@xs { margin-bottom: 58.333333333333336vh; } .u-marg-l-w15of24\@xs { margin-left: 62.50000000000001%; } .u-marg-r-w15of24\@xs { margin-right: 62.50000000000001%; } .u-marg-b-vh15of24\@xs { margin-bottom: 62.50000000000001vh; } .u-marg-l-w16of24\@xs { margin-left: 66.66666666666667%; } .u-marg-r-w16of24\@xs { margin-right: 66.66666666666667%; } .u-marg-b-vh16of24\@xs { margin-bottom: 66.66666666666667vh; } .u-marg-l-w17of24\@xs { margin-left: 70.83333333333334%; } .u-marg-r-w17of24\@xs { margin-right: 70.83333333333334%; } .u-marg-b-vh17of24\@xs { margin-bottom: 70.83333333333334vh; } .u-marg-l-w18of24\@xs { margin-left: 75%; } .u-marg-r-w18of24\@xs { margin-right: 75%; } .u-marg-b-vh18of24\@xs { margin-bottom: 75vh; } .u-marg-l-w19of24\@xs { margin-left: 79.16666666666667%; } .u-marg-r-w19of24\@xs { margin-right: 79.16666666666667%; } .u-marg-b-vh19of24\@xs { margin-bottom: 79.16666666666667vh; } .u-marg-l-w20of24\@xs { margin-left: 83.33333333333334%; } .u-marg-r-w20of24\@xs { margin-right: 83.33333333333334%; } .u-marg-b-vh20of24\@xs { margin-bottom: 83.33333333333334vh; } .u-marg-l-w21of24\@xs { margin-left: 87.5%; } .u-marg-r-w21of24\@xs { margin-right: 87.5%; } .u-marg-b-vh21of24\@xs { margin-bottom: 87.5vh; } .u-marg-l-w22of24\@xs { margin-left: 91.66666666666667%; } .u-marg-r-w22of24\@xs { margin-right: 91.66666666666667%; } .u-marg-b-vh22of24\@xs { margin-bottom: 91.66666666666667vh; } .u-marg-l-w23of24\@xs { margin-left: 95.83333333333334%; } .u-marg-r-w23of24\@xs { margin-right: 95.83333333333334%; } .u-marg-b-vh23of24\@xs { margin-bottom: 95.83333333333334vh; } .u-marg-l-w24of24\@xs { margin-left: 100%; } .u-marg-r-w24of24\@xs { margin-right: 100%; } .u-marg-b-vh24of24\@xs { margin-bottom: 100vh; } } @media screen and (max-width: 770px) { .u-align-center\@sm { text-align: center; } } @media screen and (max-width: 770px) { .u-align-left\@sm { text-align: left; } } @media screen and (max-width: 770px) { .u-block\@sm { display: block; } } @media screen and (max-width: 770px) { .u-hide\@sm { display: none; } } @media screen and (max-width: 1024px) { .u-fit-w\@md { width: 100%; } } @media screen and (max-width: 770px) { .u-fit-w\@sm { width: 100%; } } @media screen and (max-width: 770px) { .u-relative\@sm { position: relative; } } @media screen and (max-width: 1400px) { .u-marg-a-0\@xl { margin: 0; } .u-marg-t-0\@xl { margin-top: 0; } .u-marg-r-0\@xl { margin-right: 0; } .u-marg-b-0\@xl { margin-bottom: 0; } .u-marg-l-0\@xl { margin-left: 0; } .u-marg-x-0\@xl { margin-right: 0; margin-left: 0; } .u-marg-y-0\@xl { margin-top: 0; margin-bottom: 0; } .u-marg-x-auto\@xl { margin-right: auto; margin-left: auto; } .u-marg-a-xs\@xl { margin: 5px; } .u-marg-t-xs\@xl { margin-top: 5px; } .u-marg-r-xs\@xl { margin-right: 5px; } .u-marg-b-xs\@xl { margin-bottom: 5px; } .u-marg-l-xs\@xl { margin-left: 5px; } .u-marg-x-xs\@xl { margin-right: 5px; margin-left: 5px; } .u-marg-y-xs\@xl { margin-top: 5px; margin-bottom: 5px; } .u-marg-a-sm\@xl { margin: 15px; } .u-marg-t-sm\@xl { margin-top: 15px; } .u-marg-r-sm\@xl { margin-right: 15px; } .u-marg-b-sm\@xl { margin-bottom: 15px; } .u-marg-l-sm\@xl { margin-left: 15px; } .u-marg-x-sm\@xl { margin-right: 15px; margin-left: 15px; } .u-marg-y-sm\@xl { margin-top: 15px; margin-bottom: 15px; } .u-marg-a-md\@xl { margin: 30px; } .u-marg-t-md\@xl { margin-top: 30px; } .u-marg-r-md\@xl { margin-right: 30px; } .u-marg-b-md\@xl { margin-bottom: 30px; } .u-marg-l-md\@xl { margin-left: 30px; } .u-marg-x-md\@xl { margin-right: 30px; margin-left: 30px; } .u-marg-y-md\@xl { margin-top: 30px; margin-bottom: 30px; } .u-marg-a-lg\@xl { margin: 55px; } .u-marg-t-lg\@xl { margin-top: 55px; } .u-marg-r-lg\@xl { margin-right: 55px; } .u-marg-b-lg\@xl { margin-bottom: 55px; } .u-marg-l-lg\@xl { margin-left: 55px; } .u-marg-x-lg\@xl { margin-right: 55px; margin-left: 55px; } .u-marg-y-lg\@xl { margin-top: 55px; margin-bottom: 55px; } .u-marg-a-xl\@xl { margin: 80px; } .u-marg-t-xl\@xl { margin-top: 80px; } .u-marg-r-xl\@xl { margin-right: 80px; } .u-marg-b-xl\@xl { margin-bottom: 80px; } .u-marg-l-xl\@xl { margin-left: 80px; } .u-marg-x-xl\@xl { margin-right: 80px; margin-left: 80px; } .u-marg-y-xl\@xl { margin-top: 80px; margin-bottom: 80px; } .u-marg-a-xxl\@xl { margin: 130px; } .u-marg-t-xxl\@xl { margin-top: 130px; } .u-marg-r-xxl\@xl { margin-right: 130px; } .u-marg-b-xxl\@xl { margin-bottom: 130px; } .u-marg-l-xxl\@xl { margin-left: 130px; } .u-marg-x-xxl\@xl { margin-right: 130px; margin-left: 130px; } .u-marg-y-xxl\@xl { margin-top: 130px; margin-bottom: 130px; } .u-marg-a-ultra\@xl { margin: 180px; } .u-marg-t-ultra\@xl { margin-top: 180px; } .u-marg-r-ultra\@xl { margin-right: 180px; } .u-marg-b-ultra\@xl { margin-bottom: 180px; } .u-marg-l-ultra\@xl { margin-left: 180px; } .u-marg-x-ultra\@xl { margin-right: 180px; margin-left: 180px; } .u-marg-y-ultra\@xl { margin-top: 180px; margin-bottom: 180px; } } @media screen and (max-width: 1280px) { .u-marg-a-0\@lg { margin: 0; } .u-marg-t-0\@lg { margin-top: 0; } .u-marg-r-0\@lg { margin-right: 0; } .u-marg-b-0\@lg { margin-bottom: 0; } .u-marg-l-0\@lg { margin-left: 0; } .u-marg-x-0\@lg { margin-right: 0; margin-left: 0; } .u-marg-y-0\@lg { margin-top: 0; margin-bottom: 0; } .u-marg-x-auto\@lg { margin-right: auto; margin-left: auto; } .u-marg-a-xs\@lg { margin: 5px; } .u-marg-t-xs\@lg { margin-top: 5px; } .u-marg-r-xs\@lg { margin-right: 5px; } .u-marg-b-xs\@lg { margin-bottom: 5px; } .u-marg-l-xs\@lg { margin-left: 5px; } .u-marg-x-xs\@lg { margin-right: 5px; margin-left: 5px; } .u-marg-y-xs\@lg { margin-top: 5px; margin-bottom: 5px; } .u-marg-a-sm\@lg { margin: 15px; } .u-marg-t-sm\@lg { margin-top: 15px; } .u-marg-r-sm\@lg { margin-right: 15px; } .u-marg-b-sm\@lg { margin-bottom: 15px; } .u-marg-l-sm\@lg { margin-left: 15px; } .u-marg-x-sm\@lg { margin-right: 15px; margin-left: 15px; } .u-marg-y-sm\@lg { margin-top: 15px; margin-bottom: 15px; } .u-marg-a-md\@lg { margin: 30px; } .u-marg-t-md\@lg { margin-top: 30px; } .u-marg-r-md\@lg { margin-right: 30px; } .u-marg-b-md\@lg { margin-bottom: 30px; } .u-marg-l-md\@lg { margin-left: 30px; } .u-marg-x-md\@lg { margin-right: 30px; margin-left: 30px; } .u-marg-y-md\@lg { margin-top: 30px; margin-bottom: 30px; } .u-marg-a-lg\@lg { margin: 55px; } .u-marg-t-lg\@lg { margin-top: 55px; } .u-marg-r-lg\@lg { margin-right: 55px; } .u-marg-b-lg\@lg { margin-bottom: 55px; } .u-marg-l-lg\@lg { margin-left: 55px; } .u-marg-x-lg\@lg { margin-right: 55px; margin-left: 55px; } .u-marg-y-lg\@lg { margin-top: 55px; margin-bottom: 55px; } .u-marg-a-xl\@lg { margin: 80px; } .u-marg-t-xl\@lg { margin-top: 80px; } .u-marg-r-xl\@lg { margin-right: 80px; } .u-marg-b-xl\@lg { margin-bottom: 80px; } .u-marg-l-xl\@lg { margin-left: 80px; } .u-marg-x-xl\@lg { margin-right: 80px; margin-left: 80px; } .u-marg-y-xl\@lg { margin-top: 80px; margin-bottom: 80px; } .u-marg-a-xxl\@lg { margin: 130px; } .u-marg-t-xxl\@lg { margin-top: 130px; } .u-marg-r-xxl\@lg { margin-right: 130px; } .u-marg-b-xxl\@lg { margin-bottom: 130px; } .u-marg-l-xxl\@lg { margin-left: 130px; } .u-marg-x-xxl\@lg { margin-right: 130px; margin-left: 130px; } .u-marg-y-xxl\@lg { margin-top: 130px; margin-bottom: 130px; } .u-marg-a-ultra\@lg { margin: 180px; } .u-marg-t-ultra\@lg { margin-top: 180px; } .u-marg-r-ultra\@lg { margin-right: 180px; } .u-marg-b-ultra\@lg { margin-bottom: 180px; } .u-marg-l-ultra\@lg { margin-left: 180px; } .u-marg-x-ultra\@lg { margin-right: 180px; margin-left: 180px; } .u-marg-y-ultra\@lg { margin-top: 180px; margin-bottom: 180px; } } @media screen and (max-width: 1024px) { .u-marg-a-0\@md { margin: 0; } .u-marg-t-0\@md { margin-top: 0; } .u-marg-r-0\@md { margin-right: 0; } .u-marg-b-0\@md { margin-bottom: 0; } .u-marg-l-0\@md { margin-left: 0; } .u-marg-x-0\@md { margin-right: 0; margin-left: 0; } .u-marg-y-0\@md { margin-top: 0; margin-bottom: 0; } .u-marg-x-auto\@md { margin-right: auto; margin-left: auto; } .u-marg-a-xs\@md { margin: 5px; } .u-marg-t-xs\@md { margin-top: 5px; } .u-marg-r-xs\@md { margin-right: 5px; } .u-marg-b-xs\@md { margin-bottom: 5px; } .u-marg-l-xs\@md { margin-left: 5px; } .u-marg-x-xs\@md { margin-right: 5px; margin-left: 5px; } .u-marg-y-xs\@md { margin-top: 5px; margin-bottom: 5px; } .u-marg-a-sm\@md { margin: 15px; } .u-marg-t-sm\@md { margin-top: 15px; } .u-marg-r-sm\@md { margin-right: 15px; } .u-marg-b-sm\@md { margin-bottom: 15px; } .u-marg-l-sm\@md { margin-left: 15px; } .u-marg-x-sm\@md { margin-right: 15px; margin-left: 15px; } .u-marg-y-sm\@md { margin-top: 15px; margin-bottom: 15px; } .u-marg-a-md\@md { margin: 30px; } .u-marg-t-md\@md { margin-top: 30px; } .u-marg-r-md\@md { margin-right: 30px; } .u-marg-b-md\@md { margin-bottom: 30px; } .u-marg-l-md\@md { margin-left: 30px; } .u-marg-x-md\@md { margin-right: 30px; margin-left: 30px; } .u-marg-y-md\@md { margin-top: 30px; margin-bottom: 30px; } .u-marg-a-lg\@md { margin: 55px; } .u-marg-t-lg\@md { margin-top: 55px; } .u-marg-r-lg\@md { margin-right: 55px; } .u-marg-b-lg\@md { margin-bottom: 55px; } .u-marg-l-lg\@md { margin-left: 55px; } .u-marg-x-lg\@md { margin-right: 55px; margin-left: 55px; } .u-marg-y-lg\@md { margin-top: 55px; margin-bottom: 55px; } .u-marg-a-xl\@md { margin: 80px; } .u-marg-t-xl\@md { margin-top: 80px; } .u-marg-r-xl\@md { margin-right: 80px; } .u-marg-b-xl\@md { margin-bottom: 80px; } .u-marg-l-xl\@md { margin-left: 80px; } .u-marg-x-xl\@md { margin-right: 80px; margin-left: 80px; } .u-marg-y-xl\@md { margin-top: 80px; margin-bottom: 80px; } .u-marg-a-xxl\@md { margin: 130px; } .u-marg-t-xxl\@md { margin-top: 130px; } .u-marg-r-xxl\@md { margin-right: 130px; } .u-marg-b-xxl\@md { margin-bottom: 130px; } .u-marg-l-xxl\@md { margin-left: 130px; } .u-marg-x-xxl\@md { margin-right: 130px; margin-left: 130px; } .u-marg-y-xxl\@md { margin-top: 130px; margin-bottom: 130px; } .u-marg-a-ultra\@md { margin: 180px; } .u-marg-t-ultra\@md { margin-top: 180px; } .u-marg-r-ultra\@md { margin-right: 180px; } .u-marg-b-ultra\@md { margin-bottom: 180px; } .u-marg-l-ultra\@md { margin-left: 180px; } .u-marg-x-ultra\@md { margin-right: 180px; margin-left: 180px; } .u-marg-y-ultra\@md { margin-top: 180px; margin-bottom: 180px; } } @media screen and (max-width: 770px) { .u-marg-a-0\@sm { margin: 0; } .u-marg-t-0\@sm { margin-top: 0; } .u-marg-r-0\@sm { margin-right: 0; } .u-marg-b-0\@sm { margin-bottom: 0; } .u-marg-l-0\@sm { margin-left: 0; } .u-marg-x-0\@sm { margin-right: 0; margin-left: 0; } .u-marg-y-0\@sm { margin-top: 0; margin-bottom: 0; } .u-marg-x-auto\@sm { margin-right: auto; margin-left: auto; } .u-marg-a-xs\@sm { margin: 5px; } .u-marg-t-xs\@sm { margin-top: 5px; } .u-marg-r-xs\@sm { margin-right: 5px; } .u-marg-b-xs\@sm { margin-bottom: 5px; } .u-marg-l-xs\@sm { margin-left: 5px; } .u-marg-x-xs\@sm { margin-right: 5px; margin-left: 5px; } .u-marg-y-xs\@sm { margin-top: 5px; margin-bottom: 5px; } .u-marg-a-sm\@sm { margin: 15px; } .u-marg-t-sm\@sm { margin-top: 15px; } .u-marg-r-sm\@sm { margin-right: 15px; } .u-marg-b-sm\@sm { margin-bottom: 15px; } .u-marg-l-sm\@sm { margin-left: 15px; } .u-marg-x-sm\@sm { margin-right: 15px; margin-left: 15px; } .u-marg-y-sm\@sm { margin-top: 15px; margin-bottom: 15px; } .u-marg-a-md\@sm { margin: 30px; } .u-marg-t-md\@sm { margin-top: 30px; } .u-marg-r-md\@sm { margin-right: 30px; } .u-marg-b-md\@sm { margin-bottom: 30px; } .u-marg-l-md\@sm { margin-left: 30px; } .u-marg-x-md\@sm { margin-right: 30px; margin-left: 30px; } .u-marg-y-md\@sm { margin-top: 30px; margin-bottom: 30px; } .u-marg-a-lg\@sm { margin: 55px; } .u-marg-t-lg\@sm { margin-top: 55px; } .u-marg-r-lg\@sm { margin-right: 55px; } .u-marg-b-lg\@sm { margin-bottom: 55px; } .u-marg-l-lg\@sm { margin-left: 55px; } .u-marg-x-lg\@sm { margin-right: 55px; margin-left: 55px; } .u-marg-y-lg\@sm { margin-top: 55px; margin-bottom: 55px; } .u-marg-a-xl\@sm { margin: 80px; } .u-marg-t-xl\@sm { margin-top: 80px; } .u-marg-r-xl\@sm { margin-right: 80px; } .u-marg-b-xl\@sm { margin-bottom: 80px; } .u-marg-l-xl\@sm { margin-left: 80px; } .u-marg-x-xl\@sm { margin-right: 80px; margin-left: 80px; } .u-marg-y-xl\@sm { margin-top: 80px; margin-bottom: 80px; } .u-marg-a-xxl\@sm { margin: 130px; } .u-marg-t-xxl\@sm { margin-top: 130px; } .u-marg-r-xxl\@sm { margin-right: 130px; } .u-marg-b-xxl\@sm { margin-bottom: 130px; } .u-marg-l-xxl\@sm { margin-left: 130px; } .u-marg-x-xxl\@sm { margin-right: 130px; margin-left: 130px; } .u-marg-y-xxl\@sm { margin-top: 130px; margin-bottom: 130px; } .u-marg-a-ultra\@sm { margin: 180px; } .u-marg-t-ultra\@sm { margin-top: 180px; } .u-marg-r-ultra\@sm { margin-right: 180px; } .u-marg-b-ultra\@sm { margin-bottom: 180px; } .u-marg-l-ultra\@sm { margin-left: 180px; } .u-marg-x-ultra\@sm { margin-right: 180px; margin-left: 180px; } .u-marg-y-ultra\@sm { margin-top: 180px; margin-bottom: 180px; } } @media screen and (max-width: 360px) { .u-marg-a-0\@xs { margin: 0; } .u-marg-t-0\@xs { margin-top: 0; } .u-marg-r-0\@xs { margin-right: 0; } .u-marg-b-0\@xs { margin-bottom: 0; } .u-marg-l-0\@xs { margin-left: 0; } .u-marg-x-0\@xs { margin-right: 0; margin-left: 0; } .u-marg-y-0\@xs { margin-top: 0; margin-bottom: 0; } .u-marg-x-auto\@xs { margin-right: auto; margin-left: auto; } .u-marg-a-xs\@xs { margin: 5px; } .u-marg-t-xs\@xs { margin-top: 5px; } .u-marg-r-xs\@xs { margin-right: 5px; } .u-marg-b-xs\@xs { margin-bottom: 5px; } .u-marg-l-xs\@xs { margin-left: 5px; } .u-marg-x-xs\@xs { margin-right: 5px; margin-left: 5px; } .u-marg-y-xs\@xs { margin-top: 5px; margin-bottom: 5px; } .u-marg-a-sm\@xs { margin: 15px; } .u-marg-t-sm\@xs { margin-top: 15px; } .u-marg-r-sm\@xs { margin-right: 15px; } .u-marg-b-sm\@xs { margin-bottom: 15px; } .u-marg-l-sm\@xs { margin-left: 15px; } .u-marg-x-sm\@xs { margin-right: 15px; margin-left: 15px; } .u-marg-y-sm\@xs { margin-top: 15px; margin-bottom: 15px; } .u-marg-a-md\@xs { margin: 30px; } .u-marg-t-md\@xs { margin-top: 30px; } .u-marg-r-md\@xs { margin-right: 30px; } .u-marg-b-md\@xs { margin-bottom: 30px; } .u-marg-l-md\@xs { margin-left: 30px; } .u-marg-x-md\@xs { margin-right: 30px; margin-left: 30px; } .u-marg-y-md\@xs { margin-top: 30px; margin-bottom: 30px; } .u-marg-a-lg\@xs { margin: 55px; } .u-marg-t-lg\@xs { margin-top: 55px; } .u-marg-r-lg\@xs { margin-right: 55px; } .u-marg-b-lg\@xs { margin-bottom: 55px; } .u-marg-l-lg\@xs { margin-left: 55px; } .u-marg-x-lg\@xs { margin-right: 55px; margin-left: 55px; } .u-marg-y-lg\@xs { margin-top: 55px; margin-bottom: 55px; } .u-marg-a-xl\@xs { margin: 80px; } .u-marg-t-xl\@xs { margin-top: 80px; } .u-marg-r-xl\@xs { margin-right: 80px; } .u-marg-b-xl\@xs { margin-bottom: 80px; } .u-marg-l-xl\@xs { margin-left: 80px; } .u-marg-x-xl\@xs { margin-right: 80px; margin-left: 80px; } .u-marg-y-xl\@xs { margin-top: 80px; margin-bottom: 80px; } .u-marg-a-xxl\@xs { margin: 130px; } .u-marg-t-xxl\@xs { margin-top: 130px; } .u-marg-r-xxl\@xs { margin-right: 130px; } .u-marg-b-xxl\@xs { margin-bottom: 130px; } .u-marg-l-xxl\@xs { margin-left: 130px; } .u-marg-x-xxl\@xs { margin-right: 130px; margin-left: 130px; } .u-marg-y-xxl\@xs { margin-top: 130px; margin-bottom: 130px; } .u-marg-a-ultra\@xs { margin: 180px; } .u-marg-t-ultra\@xs { margin-top: 180px; } .u-marg-r-ultra\@xs { margin-right: 180px; } .u-marg-b-ultra\@xs { margin-bottom: 180px; } .u-marg-l-ultra\@xs { margin-left: 180px; } .u-marg-x-ultra\@xs { margin-right: 180px; margin-left: 180px; } .u-marg-y-ultra\@xs { margin-top: 180px; margin-bottom: 180px; } } @media screen and (max-width: 1024px) { .u-pad-x-0\@md { padding-left: 0; padding-right: 0; } .u-pad-y-xxl\@md { padding-top: 130px; padding-bottom: 130px; } } @media screen and (max-width: 770px) { .u-pad-r-0\@sm { padding-right: 0; } .u-pad-l-0\@sm { padding-left: 0; } .u-pad-b-md\@sm { padding-bottom: 30px; } .u-pad-t-lg\@sm { padding-top: 55px; } .u-pad-b-lg\@sm { padding-bottom: 55px; } .u-pad-t-xl\@sm { padding-top: 80px; } .u-pad-y-xl\@sm { padding-top: 80px; padding-bottom: 80px; } .u-pad-t-xxl\@sm { padding-top: 130px; } .u-pad-y-xxl\@sm { padding-top: 130px; padding-bottom: 130px; } } @media screen and (max-width: 770px) { .c-bandeau { font-size: 11px; padding: 8px; } } @media screen and (max-width: 770px) { .c-header__logo { top: 12px; width: 100px; height: 54px; } } @media screen and (max-height: 900px) { .is-header-hided .c-header__logo { display: none; } } @media print { .c-header { display: none; } } @media screen and (max-width: 770px) { .c-burger { opacity: 1; visibility: visible; } } @media screen and (max-width: 770px) { .c-burger__label { display: none; } } @media screen and (max-width: 770px) { .c-home__section__subtitle { margin-bottom: 0; } } @media screen and (max-width: 1024px) { .c-home__section__subtitle { margin-left: 0; } } @media screen and (max-height: 800px) { .c-home__section--2 .c-home__section__subtitle { margin-bottom: 25px; } } @media screen and (max-width: 770px) { .c-home__section__title { margin-bottom: 0; } } @media screen and (max-height: 800px) { .c-home__section--2 .c-home__section__title { margin-bottom: 25px; } } @media screen and (max-height: 700px) and (min-width: 771px) { .c-home__section--2 .c-home__section__description, [data-slide="3"] .c-home__section__description { font-size: 13px; line-height: 1.45; } } @media screen and (max-width: 770px) { .c-home__line-aside { display: none; } } @media screen and (max-width: 770px) { .c-home__section__bar--x { height: 25px; } } @media screen and (max-width: 770px) { .c-home__section__bar--y:nth-child(2) { width: 25px; } } @media screen and (max-width: 770px) { .c-home__section__bar--y:nth-child(4) { width: 25px; } } @media screen and (max-height: 800px) { .c-home__nav__item { padding-top: 20px; padding-bottom: 20px; } .c-home__nav__track { height: 59px; } } @media screen and (max-height: 400px) and (min-width: 1280px) { .c-home__section--6__footer { display: none; } } @media screen and (max-width: 770px) { .c-partners-slideshow__grid .o-list__item { width: 50%; } } @media screen and (max-width: 770px) { .c-partners-slideshow__grid.is-first .c-partners-slideshow__grid__item:nth-of-type(2n + 2):after, .c-partners-slideshow__grid.is-first .c-partners-slideshow__grid__item:nth-of-type(4n + 3):after { display: none; } } @media screen and (max-width: 770px) { .c-partners-slideshow__grid.is-first .c-partners-slideshow__grid__item:nth-of-type(2n):after { position: absolute; content: ""; left: 0; top: 3px; bottom: 3px; width: 1px; background: hsla(0, 0%, 51%, 0.12); } } @media print { @page { size: landscape; } .c-burger, .c-footer, .c-header, .c-loader, .c-loader-intro, .c-nav, .c-team-popin__buttons, .c-team-popin__content__bar, .c-team__btn-close, .c-team__content { display: none; } } /* Hero: título thin Argent CF */ [data-slide="0"] h1 { font-weight: 100; } /* Hero: título posicionado abajo (home slide 0) */ [data-slide="0"] > .u-absolute.u-valign-bottom { bottom: 0; top: auto; } /* ================================================== PÁGINAS INTERIORES — clases globales del hero ================================================== */ /* Offset vertical del título: centra con desplazamiento hacia abajo */ .u-marg-t-vh1of10 { margin-top: 10vh; } /* Line-height amplio para h1 de páginas interiores */ .t-text-lh--lg { line-height: 1.3; } /* Utilidades de espaciado (base, sin breakpoint) */ .u-marg-x-auto { margin-left: auto; margin-right: auto; } .u-pad-t-xl { padding-top: 80px; } .u-pad-y-xxl { padding-top: 130px; padding-bottom: 130px; } .u-pad-y-ultra { padding-top: 200px; padding-bottom: 200px; } .u-pad-x-w2of12 { padding-left: calc(100% / 6); padding-right: calc(100% / 6); } .u-pos-t { top: 0; } /* Subtítulo de página: se oculta durante el preloader */ .c-page__subtitle { opacity: 1; transform: translateZ(0); transition: opacity 0.75s cubic-bezier(0.165, 0.84, 0.44, 1) 0.25s; } .is-loading .c-page__subtitle { opacity: 0; } /* ========================================== LÍNEAS VERTICALES (c-home__line-aside) ========================================== Líneas finas blancas a la derecha, alineadas con el eje vertical de los dots. - Top: desde arriba hasta encima de los dots - Bottom: desde debajo de los dots hacia abajo - Hero tiene 3 líneas (la tercera sobre el botón scroll) - Otros slides tienen 2 líneas (top + bottom simétricas) ========================================== */ /* Línea superior: desde top:0 hacia abajo */ .c-home__line-aside { height: calc(50vh - 215px); } /* Línea inferior (otros slides): desde bottom:0 hacia arriba */ .c-home__line-aside--bottom { height: calc(50vh - 215px); } /* Hero: línea inferior corta (encima de "Begin scrolling") */ [data-slide="0"] .c-home__line-aside--bottom { height: 6vh; } /* Hero: segunda línea inferior (encima del botón scroll) */ [data-slide="0"] .c-home__line-aside--bottom-2 { height: 6vh; bottom: 15vh; } /* FIX: Botón scroll — solo íconos */ .c-btn-scroll__icon { width: 12px; height: auto; z-index: 2; } /* Texto transparente (label "Close" del burger) */ .u-transparent { color: transparent; } /* Nav links: gris por defecto, blanco en hover y activo */ .c-nav__list__link { opacity: 0.4; transition: opacity 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); } .c-nav__list__item:hover .c-nav__list__link, .c-nav__list__item.is-active .c-nav__list__link { opacity: 1; } /* Nav: fondo inmediato al mostrar (evita flash transparente) */ .c-nav[style*="display: block"] { background-color: #0c1a2a; } /* Footer slide 6: línea separadora + texto centrados verticalmente */ footer.c-home__section--6__footer { align-items: center; padding-top: 36px; } /* ================================================== ABOUT PAGE (c-about) Página interior scrollable — no slider. ================================================== */ .c-about { background-color: #fff; min-height: 100vh; } /* Container principal con perspectiva para animaciones 3D */ .c-about__container { perspective: 1600px; } /* Secciones de fact: centradas, ancho máximo. El padding lo dan las utility classes u-pad-y-xxl / u-pad-y-ultra por fact. */ .c-about__fact { position: relative; margin-right: auto; margin-left: auto; max-width: 1024px; } /* Línea separadora entre facts */ .c-about__fact::after { position: absolute; content: ""; bottom: 0; left: 0; width: 100%; height: 1px; background-color: hsla(0, 0%, 51%, 0.4); opacity: 0.3; } /* Número de capítulo */ .c-about__fact__chapter { color: #546478; position: absolute; top: 2.5vh; } /* Animación palabra por palabra (app-words) */ .c-about__fact__word { will-change: transform, opacity; opacity: 0; transform: translateY(50px) translateZ(0); transition: transform 0.9s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.7s; } .c-about__fact__word.is-up { opacity: 1; transform: translateY(0) translateZ(0); } /* Número grande — argent-cf, tamaño responsive */ .c-about__fact__big-number { font-size: calc(34px + (0.141463 * (-600px + 53vh + 53vw))); line-height: 1; font-weight: 300; font-family: argent-cf, serif; display: inline-block; white-space: nowrap; } /* $ unidad junto al número grande */ .c-about__fact--1__unity { font-size: 3rem; font-weight: 300; font-family: argent-cf, serif; } /* Margen izquierdo: posiciona el número 53px desde la izquierda del SVG de 260px */ .u-marg-l-lg { margin-left: 53px; } /* Gráfico SVG: dimensiones fijas 260×260, absoluto, opaco al 30% */ .c-about__fact--1__graph { width: 260px; height: 260px; opacity: 0.3; display: block; } /* Animación stroke-dashoffset en shorthand */ .c--about__fact--1__graph__path { transition: stroke-dashoffset 1.5s cubic-bezier(0.23, 1, 0.32, 1) 0s; } /* Fact 2: boxes con animación de entrada */ .c-about__fact--2__box { opacity: 0; will-change: transform, opacity; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.6s; transform: translateX(-50px) translateY(50px) translateZ(0); } /* Fact 2: línea decorativa horizontal entre columnas */ .c-about__fact--2__line { width: 30px; height: 1px; transform-origin: 0 0; will-change: transform; transform: scaleX(0) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1) 0.5s; } /* Fact 2: columna derecha con borde izquierdo */ .c-about__fact--2__right { border-left: 1px solid hsla(0, 0%, 51%, 0.3); } /* Fact 2 - mask animation: estados base */ .c-about__item__mask-in { transform: translateX(-100%) translateZ(0); } .c-about__item__mask-out { transform: translateX(100%) translateZ(0); } .c-about__item__mask-unity { transform: translateX(-100px) translateZ(0); } /* Offset letter (700+, etc): estados base */ .c-about__fact__offse-letter { font-size: 5rem; } .c-about__fact__offse-letter span { display: inline-block; opacity: 0; will-change: transform, opacity; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.5s; } .c-about__fact__offse-letter span:nth-child(odd) { transform: translateY(-100%) translateZ(0); } .c-about__fact__offse-letter span:nth-child(2n) { transform: translateY(100%) translateZ(0); } .c-about__fact__offse-letter__small-top { position: relative; margin-top: 10px; vertical-align: top; font-size: 1.25rem; } /* Fact 5: columnas con separador vertical */ .c-about__fact--5__col-left { border-right: 1px solid hsla(0, 0%, 51%, 0.3); padding: 8vh 5vw 8vh 8.333%; } .c-about__fact--5__col-right { padding: 8vh 8.333% 8vh 5vw; } /* Fact 8: boxes con animación de entrada (desde derecha) */ .c-about__fact--8__box { opacity: 0; will-change: transform, opacity; transform: translateX(50px) translateY(50px) translateZ(0); transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.6s; } /* Section 2 (Debt Solutions): lista con hover animado */ .c-about__section-2__list__item { border-top: 1px solid hsla(0, 0%, 51%, 0.12); } .c-about__section-2__list__item:last-child { border-bottom: 1px solid hsla(0, 0%, 51%, 0.12); } /* Fact 3: columna derecha con margen negativo para alinear visualmente */ .c-about__fact--3__col-right { margin-top: -30px; } @media screen and (max-width: 770px) { .c-about__fact--3__col-right { margin-top: 55px; } } /* Línea que escala al revelar (is-active en padre) */ .c-about__section-2__list__item__line { display: block; opacity: 0.5; transform: scaleX(0) translateZ(0); transform-origin: 0 50%; height: 1px; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; } /* Stagger delays: cada línea aparece con delay escalonado */ .c-about__section-2__list__item:first-child .c-about__section-2__list__item__line { transition-delay: 0s; } .c-about__section-2__list__item:nth-child(2) .c-about__section-2__list__item__line { transition-delay: 0.25s; } .c-about__section-2__list__item:nth-child(3) .c-about__section-2__list__item__line { transition-delay: 0.5s; } .c-about__section-2__list__item:nth-child(4) .c-about__section-2__list__item__line { transition-delay: 0.75s; } .c-about__section-2__list__item:nth-child(5) .c-about__section-2__list__item__line { transition-delay: 1s; } /* Máscara de hover: oculta a la izquierda, desliza hacia adentro */ .c-about__section-2__list__item__mask { background: rgba(7, 77, 190, 0.18); transform: translateX(calc(-100% - 1px)) translateZ(0); transition: transform 1.2s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; } .c-about__section-2__list__item:hover .c-about__section-2__list__item__mask { transform: translateX(0) translateZ(0); } /* Contenido de la máscara: contrarresta el offset del padre */ .c-about__section-2__list__item__mask-content { transform: translateX(100%) translateZ(0); transition: transform 1.2s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; padding: 0 0 0 4px; } .c-about__section-2__list__item:hover .c-about__section-2__list__item__mask-content { transform: translateX(0) translateZ(0); } /* Texto base del list item (siempre visible) */ .c-about__section-2__list__item__text { padding: 16px 0; } /* Sección de contenido largo — sección independiente con fondo gris claro */ .c-about__section-hight { position: relative; z-index: 1; } /* Wrapper de texto: offseteado — 25% margen izq, 33% ancho en desktop */ .c-about__section-hight__wrapper { margin-left: 25%; width: 41.667%; max-width: 65ch; } /* Links "Learn more": ocultos, se revelan con is-active en padre */ .c-about-fact__link { will-change: opacity; opacity: 0; transform: translateZ(0); transition: opacity 0.4s 0s; display: inline-block; text-transform: uppercase; letter-spacing: 0.1em; font-size: 11px; color: #3470c0; } /* Nav dots lateral */ .c-about__nav { position: fixed; right: 60px; top: 50%; transform: translateY(-50%); z-index: 5; text-align: right; transition: opacity 0.5s cubic-bezier(0.23, 1, 0.32, 1); } /* Líneas verticales arriba/abajo de los dots */ .c-about__nav__line { width: 1px; height: 80px; background: rgba(19, 21, 27, 0.1); margin: 0 2px; } /* Item clickable: contiene dot + label */ .c-about__nav__item { position: relative; padding: 6px 0; white-space: nowrap; } /* Dot (círculo) */ .c-about__nav__dot { display: inline-block; vertical-align: middle; width: 4px; height: 4px; border-radius: 50%; background-color: #0c1a2a; opacity: 0.2; transform: translateZ(0); transition: opacity 0.75s cubic-bezier(0.23, 1, 0.32, 1); } /* Label (número) a la izquierda del dot */ .c-about__nav__label { display: inline-block; vertical-align: middle; margin-right: 10px; opacity: 0; font-size: 10px; font-family: neue-haas-grotesk-text, sans-serif; letter-spacing: 0.1em; color: #0c1a2a; transform: translateX(10px) translateZ(0); transition: opacity 0.5s cubic-bezier(0.23, 1, 0.32, 1), transform 0.7s cubic-bezier(0.23, 1, 0.32, 1); } .c-about__nav__item:hover .c-about__nav__label { opacity: 0.4; transform: translateX(0) translateZ(0); } .c-about__nav__item.is-active .c-about__nav__label { opacity: 1; transform: translateX(0) translateZ(0); } /* Dot hero: oculto por defecto, aparece cuando el hero sale del viewport */ .c-about__nav__item--hero { max-height: 0; opacity: 0; overflow: hidden; transition: max-height 0.4s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.4s cubic-bezier(0.23, 1, 0.32, 1); } .c-about__nav__item--hero.is-visible { max-height: 40px; opacity: 1; } /* Botón scroll about hero */ .c-about__scroll-btn { bottom: 8vh; right: 114px; } /* ================================================== CONTACT MODAL (c-contact-modal) Drawer desde la derecha. Se activa al clicar cualquier enlace a contact.html. ================================================== */ .c-contact-modal { position: fixed; inset: 0; z-index: 200; pointer-events: none; /* Ocultar sin sacar del árbol de render: evita reflow al abrir */ visibility: hidden; transition: visibility 0s linear 0.75s; } .c-contact-modal.is-open { pointer-events: auto; visibility: visible; transition: visibility 0s; } /* Backdrop — GSAP anima opacity, no CSS transition */ .c-contact-modal__backdrop { position: absolute; inset: 0; background: rgba(9, 13, 17, 0.82); opacity: 0; cursor: pointer; } /* Panel drawer — GSAP anima translateX, no CSS transition */ .c-contact-modal__panel { position: absolute; top: 0; right: 0; width: 480px; max-width: 100vw; height: 100vh; background: #0e2240; display: flex; flex-direction: column; justify-content: center; padding: 80px 56px; transform: translateX(100%) translateZ(0); will-change: transform; overflow-y: auto; overflow-x: hidden; } /* Línea vertical de acento — CSS transition (pseudo-elemento, GSAP no lo alcanza) */ .c-contact-modal__panel::before { content: ''; position: absolute; top: 0; left: 0; width: 3px; height: 100%; background: #3470c0; transform: scaleY(0); transform-origin: top center; transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1) 0.45s; } .c-contact-modal.is-open .c-contact-modal__panel::before { transform: scaleY(1); } /* Botón cerrar */ .c-contact-modal__close { position: absolute; top: 28px; right: 28px; width: 40px; height: 40px; background: transparent; border: 1px solid rgba(255, 255, 255, 0.2); color: #fff; display: flex; align-items: center; justify-content: center; padding: 0; transition: border-color 0.3s, background 0.3s; } .c-contact-modal__close:hover { border-color: rgba(255, 255, 255, 0.6); background: rgba(255, 255, 255, 0.06); } .c-contact-modal__close i { font-size: 18px; line-height: 1; } /* Logo — estado inicial; GSAP anima opacity/y */ .c-contact-modal__logo { width: 64px; margin-bottom: 44px; opacity: 0; } /* Etiqueta — estado inicial; GSAP anima opacity/y */ .c-contact-modal__label { display: block; color: #3470c0; margin-bottom: 10px; opacity: 0; } /* Título — estado inicial; GSAP anima opacity/y */ .c-contact-modal__title { margin: 0 0 20px; line-height: 1.1; color: #fff; opacity: 0; } /* Separador — estado inicial; GSAP anima opacity */ .c-contact-modal__divider { width: 36px; height: 1px; background: rgba(255, 255, 255, 0.25); margin-bottom: 36px; opacity: 0; } /* Lista de items */ .c-contact-modal__list { display: flex; flex-direction: column; gap: 26px; } /* Items — estado inicial; GSAP anima opacity/x */ .c-contact-modal__item { display: flex; align-items: flex-start; gap: 16px; opacity: 0; } /* Ícono */ .c-contact-modal__icon { font-size: 22px; color: #3470c0; flex-shrink: 0; margin-top: 2px; line-height: 1; } /* Etiqueta y valor del item */ .c-contact-modal__item-label { display: block; font-family: neue-haas-grotesk-text, sans-serif; font-size: 10px; letter-spacing: 0.17em; text-transform: uppercase; color: rgba(255, 255, 255, 0.38); margin-bottom: 3px; } .c-contact-modal__item-value { display: block; font-family: neue-haas-grotesk-text, sans-serif; font-size: 14px; color: #fff; text-decoration: none; transition: color 0.25s; } a.c-contact-modal__item-value:hover { color: #3470c0; } @media screen and (max-width: 770px) { .c-contact-modal__panel { width: 100vw; padding: 80px 32px 48px; justify-content: flex-start; padding-top: 100px; } } /* SVG paths del gráfico circular */ .c--about__fact--1__graph__path { fill: none; stroke-width: 6; stroke-miterlimit: 10; } .c--about__fact--1__graph__path:first-child { stroke: #8a98a8; stroke-dashoffset: 254.58511352539062; stroke-dasharray: 254.58511352539062; } .c--about__fact--1__graph__path:nth-child(2) { stroke: #0c1a2a; stroke-dashoffset: 210.97991943359375; stroke-dasharray: 210.97991943359375; } .c--about__fact--1__graph__path:nth-child(3) { stroke: #8a98a8; stroke-dashoffset: 31.650531768798828; stroke-dasharray: 31.650531768798828; } .c--about__fact--1__graph__path:nth-child(4) { stroke: #c48a48; stroke-dashoffset: 352.6470947265625; stroke-dasharray: 352.6470947265625; } /* Animación círculo: reglas is-active con mayor especificidad que las :nth-child anteriores */ .is-active .c--about__fact--1__graph__path:first-child { stroke-dashoffset: 0; } .is-active .c--about__fact--1__graph__path:nth-child(2) { stroke-dashoffset: 0; } .is-active .c--about__fact--1__graph__path:nth-child(3) { stroke-dashoffset: 0; } .is-active .c--about__fact--1__graph__path:nth-child(4) { stroke-dashoffset: 0; } /* About: responsive mobile */ @media screen and (max-width: 770px) { .c-about__fact { padding-top: 60px; padding-bottom: 60px; } .c-about__fact--2__right { border-left: none; border-top: 1px solid hsla(0, 0%, 51%, 0.3); padding-left: 0; padding-top: 30px; margin-top: 30px; } .c-about__fact--5__col-left { border-right: none; border-bottom: 1px solid hsla(0, 0%, 51%, 0.3); padding: 40px 8.333%; } .c-about__fact--5__col-right { padding: 40px 8.333%; } .c-about__section-hight { padding-top: 60px; padding-bottom: 60px; } .c-about__section-hight__wrapper { margin-left: 8.333%; width: auto; max-width: calc(100% - 16.666%); } } /* ─── Utilidades faltantes ────────────────────────────────────────────── */ .u-invisible { visibility: hidden; } .u-w3of4 { width: 75%; } .u-w7of10 { width: 70%; } .u-w3of8 { width: 37.5%; } .u-pad-r-w1of5 { padding-right: 20%; } .u-pad-r-w1of24 { padding-right: 4.167%; } .u-marg-l-w2of8 { margin-left: 25%; } /* Fact 5: foto-boxes superpuestas (top-left y bottom-right) */ .c-about__fact--4__box { height: 50%; } @media screen and (max-width: 770px) { .c-about__fact--4__box { height: 40%; } } /* Aspect ratio box 12:10 (para foto de Fact 6) */ /* Sin position aquí — el elemento obtiene position:absolute de u-absolute */ .o-box--12by10:before { position: relative; content: ""; display: inline-block; width: 100%; padding-top: 120%; } /* Padding utilities (extraídas de la referencia) */ .u-marg-b-sm { margin-bottom: 15px; } .u-pad-y-xs { padding-top: 5px; padding-bottom: 5px; } .u-pad-b-sm { padding-bottom: 15px; } .u-pad-t-md { padding-top: 30px; } .u-pad-r-md { padding-right: 30px; } .u-pad-b-md { padding-bottom: 30px; } .u-pad-x-md { padding-left: 30px; padding-right: 30px; } .u-pad-y-md { padding-top: 30px; padding-bottom: 30px; } .u-pad-t-lg { padding-top: 55px; } .u-pad-r-lg { padding-right: 55px; } .u-pad-b-lg { padding-bottom: 55px; } .u-pad-y-lg { padding-top: 55px; padding-bottom: 55px; } .u-pad-y-xl { padding-top: 80px; padding-bottom: 80px; } /* ─── FOOTER GLOBAL ────────────────────────────────────────────────────── */ .c-footer__logo { width: 76px; height: 29px; } .c-footer__logo img { height: 100%; } .c-footer__link { opacity: .6; transform: translateZ(0); font-size: 0.75rem; /* ~12px */ text-transform: uppercase; letter-spacing: 0.05em; transition: opacity .55s cubic-bezier(.165, .84, .44, 1); } .c-footer__input { position: relative; top: 1px; height: 74px; width: 340px; max-width: 100%; border: 1px solid hsla(0, 0%, 100%, .3); background: transparent; color: #fff; padding-left: 20px; padding-right: 80px; font-family: neue-haas-grotesk-text, sans-serif; font-size: 14px; } .c-footer__input::placeholder { color: hsla(0, 0%, 100%, .5); } .c-footer__btn-submit { position: absolute; right: 0; top: 0; height: 74px; width: 74px; display: flex; align-items: center; justify-content: center; border: 1px solid hsla(0, 0%, 100%, .3); border-left: none; } .c-footer__input__msg { position: absolute; left: 0; bottom: -35px; transform: translateZ(0); transition: opacity .45s cubic-bezier(.165, .84, .44, 1); font-size: 11px; } .c-footer__input__msg--error, .c-footer__input__msg--success, .c-footer__input__msg--error-format { opacity: 0; } .is-form-error .c-footer__input__msg--error { opacity: 1; } .is-form-success .c-footer__input__msg--success { opacity: 1; } .is-error .c-footer__input__msg--error-format { opacity: 1; } .c-footer__scrolltop__icon { display: inline-block; margin-bottom: 6px; margin-left: 5px; vertical-align: middle; } .c-footer__divider { display: block; width: 100%; height: 1px; background: hsla(0, 0%, 51%, .3); margin-bottom: 20px; } .c-footer__credits { font-size: 0.75rem; /* ~12px */ color: hsla(0, 0%, 51%, .7); } .c-footer__credits a { color: inherit; text-decoration: none; border-bottom: 1px solid hsla(0, 0%, 51%, .4); transition: opacity .3s; } .c-footer__credits a:hover { opacity: 1; } .u-marg-b-lg { margin-bottom: 55px; } @media print { .c-footer { display: none; } } /* ─── Fix cascade: offse-letter is-active debe ganar a :nth-child ─────── */ /* Especificidad 0,3,1 > 0,2,1 de los estados base */ .is-active .c-about__fact__offse-letter span:nth-child(odd), .is-active .c-about__fact__offse-letter span:nth-child(2n) { opacity: 1; transform: translateY(0) translateZ(0); } /* ========================================================== BORROWERS PAGE (c-borrowers) ========================================================== */ /* Contenedor de sección: centrado, max-width 1024px */ .c-borrowers__section { max-width: 1024px; } /* Número de sección (01, 02, 03, 04) posición absoluta a la izquierda */ .c-borrowers__title__number { top: 2px; left: -20px; transform: translateX(-100%) translateZ(0); font-size: 12px; } /* ── SECCIÓN 2: Lista de productos financieros ── */ .c-borrowers__section-2__list__item { border-bottom: 1px solid rgba(0, 0, 0, 0.06); } .c-borrowers__section-2__list__item:last-child { border-bottom: 0 none; } /* Línea animada que se revela de izq a der */ .c-borrowers__section-2__list__item__line { opacity: 0.5; transform: scaleX(0) translateZ(0); transform-origin: 0 50%; height: 1px; transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; } /* Staggered animation delays */ .c-borrowers__section-2__list__item:first-child .c-borrowers__section-2__list__item__line { transition-delay: 0s; } .c-borrowers__section-2__list__item:nth-child(2) .c-borrowers__section-2__list__item__line { transition-delay: 0.25s; } .c-borrowers__section-2__list__item:nth-child(3) .c-borrowers__section-2__list__item__line { transition-delay: 0.5s; } .c-borrowers__section-2__list__item:nth-child(4) .c-borrowers__section-2__list__item__line { transition-delay: 0.75s; } .c-borrowers__section-2__list__item:nth-child(5) .c-borrowers__section-2__list__item__line { transition-delay: 1s; } /* ── SECCIÓN 4: Listas de industrias ── */ .c-borrowers__section-3__areas-list { flex-wrap: wrap; } .c-borrowers__section-3__areas-list__item:nth-child(odd) { padding-right: 30px; } /* ── Partners slideshow ── */ .c-partners-slideshow { position: relative; max-width: 900px; margin: 0 auto; padding: 0 40px; } .c-partners-slideshow__page { display: none; } .c-partners-slideshow__page.is-active { display: block; } .c-partners-slideshow__grid { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid hsla(0, 0%, 51%, 0.12); } .c-partners-slideshow__grid__item { position: relative; display: flex; align-items: center; justify-content: center; padding: 20px 15px; border-top: 1px solid hsla(0, 0%, 51%, 0.12); min-height: 110px; } /* Líneas verticales internas (columnas 2 y 3 llevan borde izquierdo) */ .c-partners-slideshow__grid__item:nth-child(4n+2), .c-partners-slideshow__grid__item:nth-child(4n+3) { border-left: 1px solid hsla(0, 0%, 51%, 0.12); border-right: 1px solid hsla(0, 0%, 51%, 0.12); } .c-partners-slideshow__grid__item img { max-width: 85%; max-height: 70px; object-fit: contain; opacity: 0; transition: opacity 0.65s cubic-bezier(0.165, 0.84, 0.44, 1); } /* Staggered fade-in cuando la página está activa */ .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(1) img { transition-delay: 0.05s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(2) img { transition-delay: 0.1s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(3) img { transition-delay: 0.15s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(4) img { transition-delay: 0.2s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(5) img { transition-delay: 0.25s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(6) img { transition-delay: 0.3s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(7) img { transition-delay: 0.35s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(8) img { transition-delay: 0.4s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(9) img { transition-delay: 0.45s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(10) img { transition-delay: 0.5s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(11) img { transition-delay: 0.55s; } .c-partners-slideshow__page.is-active .c-partners-slideshow__grid__item:nth-child(12) img { transition-delay: 0.6s; } .c-partners-slideshow__page.is-active.is-revealed .c-partners-slideshow__grid__item img { opacity: 1; } /* Grid estático sin slideshow (nosotros.html slide 03) */ .is-nosotros .c-partners-slideshow__grid__item img { opacity: 1; transition: none; } /* Nosotros — imagen edificio en sección Flexible Capital */ .c-nosotros__building-img { position: absolute; top: 0; left: 0; bottom: 0; width: 46%; overflow: hidden; z-index: 0; } .c-nosotros__building-img img { width: 100%; height: 100%; object-fit: cover; object-position: center top; } .c-nosotros__building-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to right, rgba(255,255,255,0.15) 0%, rgba(255,255,255,0) 25%, transparent 50%, #ffffff 82%); pointer-events: none; } /* El contenido queda encima de la imagen */ .is-nosotros .c-borrowers__section { position: relative; z-index: 1; } /* Controles */ .c-partners-slideshow__controls { display: flex; align-items: center; justify-content: space-between; margin-top: 35px; padding-bottom: 10px; } .c-partners-slideshow__dots { display: flex; align-items: center; gap: 10px; } .c-partners-slideshow__dot { display: block; width: 7px; height: 7px; border-radius: 50%; background: #0c1a2a; opacity: 0.25; cursor: pointer; transition: transform 0.35s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.35s cubic-bezier(0.23, 1, 0.32, 1); } .c-partners-slideshow__dot.is-active, .c-partners-slideshow__dot:hover { transform: scale(1.4); opacity: 1; } .c-partners-slideshow__nav { background: none; border: none; padding: 0; margin: 0; cursor: pointer; font-size: 14px; letter-spacing: 0.02em; opacity: 0.6; transition: opacity 0.35s; } .c-partners-slideshow__nav:hover { opacity: 1; } .c-partners-slideshow__nav.is-disabled { opacity: 0.2; pointer-events: none; cursor: default; } /* ── SECCIÓN 5: CTA background + container ── */ .c-borrowers__section-5__background { background-image: url(../media/images/borrowers-background.png); background-size: cover; background-position: 50%; } .c-borrowers__section-5__container { max-width: 800px; min-width: 641.66667px; } .c-borrowers__section-5__login-container { padding: 20px 45px; border: 1px solid hsla(0, 0%, 100%, 0.3); text-decoration: none; display: inline-flex; } .c-borrowers__section-5__login-container__icon { margin-left: 20px; width: 16px; height: auto; transform: scaleX(1) translateZ(0); transform-origin: 0 50%; transition: transform 0.8s cubic-bezier(0.23, 1, 0.32, 1); will-change: transform; } .c-borrowers__section-5__login-container:hover .c-borrowers__section-5__login-container__icon { transform: scaleX(1.2) translateZ(0); } .c-borrowers__section-5__link { text-decoration: none; } /* ══════════════════════════════════════════════ INVESTORS PAGE ══════════════════════════════════════════════ */ /* ── Secciones contenido ── */ .c-investors__section { max-width: 1024px; } .c-investors__title__number { left: -40px; top: 6px; font-size: 11px; letter-spacing: 0.15em; } /* ── Scroll reveal: h2 titles fade-up ── */ .js-investors-section h2, .js-investors-section .c-investors__section-1__blockquote { opacity: 0; transform: translateY(25px); transition: opacity 0.9s cubic-bezier(0.165, 0.84, 0.44, 1), transform 0.9s cubic-bezier(0.165, 0.84, 0.44, 1); } .js-investors-section.is-active h2, .js-investors-section.is-active .c-investors__section-1__blockquote { opacity: 1; transform: translateY(0); } /* Stagger para múltiples h2 en la misma sección */ .js-investors-section.is-active h2:nth-of-type(2) { transition-delay: 0.15s; } .js-investors-section.is-active h2:nth-of-type(3) { transition-delay: 0.3s; } .js-investors-section.is-active .c-investors__section-1__blockquote { transition-delay: 0.2s; } /* ── Patrón decorativo (sección 01 fondo) ── */ .c-investors__section-2__pattern { max-height: 512px; } /* ── Blockquote azul itálica (sección 01) ── */ .c-investors__section-1__blockquote { margin-left: -8.33333vw; border-top: 1px solid hsla(0, 0%, 51%, 0.12); } /* ── Testimonial (Philosophy) ── */ .c-testimonial { min-height: 650px; } .c-testimonial__pattern { top: 0; right: 0; width: 20%; height: 40%; background: hsla(0, 0%, 100%, 0.03); transform: skewX(-25deg); transform-origin: top right; } .c-testimonial__author__photo { width: 120px; height: 120px; } .c-testimonial__quote { font-size: calc(22px + 0.6vw); margin: 0; padding: 0; border: none; } /* ── RESPONSIVE: Investors ── */ @media (max-width: 770px) { .c-investors__section-1__blockquote { margin-left: 0; } .c-testimonial { min-height: auto; } .c-testimonial__author__photo { width: 90px; height: 90px; } .c-testimonial__quote { font-size: 20px; } } /* ── RESPONSIVE: Borrowers ── */ @media (max-width: 770px) { .c-borrowers__section-5__container { min-width: 83.33333%; } .c-borrowers__section-3__areas-list__item:nth-child(odd) { padding-right: 0; } .c-partners-slideshow { padding: 0 20px; } .c-partners-slideshow__grid { grid-template-columns: repeat(2, 1fr); } .c-partners-slideshow__grid__item:nth-child(4n+2), .c-partners-slideshow__grid__item:nth-child(4n+3) { border-left: none; border-right: none; } .c-partners-slideshow__grid__item:nth-child(2n) { border-left: 1px solid hsla(0, 0%, 51%, 0.12); } } /* ===================================================== VIEWPORT CORTO EN DESKTOP (≤750px alto, ≥771px ancho) Ajustes para laptops tipo 1366×768 con chrome del navegador (~600px de viewport útil). ===================================================== */ @media screen and (max-height: 750px) and (min-width: 771px) { /* ── SLIDE 02 — "Más que un software" ── Compacta gaps para que los párrafos descriptivos quepan sin necesidad de ocultarlos. */ .c-home__section--2 .c-home__section__subtitle { margin-bottom: 12px; } .c-home__section--2 .c-home__section__title { margin-bottom: 12px; } .c-home__section--2 .c-home__section__description.u-marg-t-lg { margin-top: 15px; } /* ── SLIDE 03 / 05 — Isabel Inga / estadísticas ── Reduce margins generosos (80px → 25px) para evitar que el título quede cortado en la parte superior. */ .c-home__section[data-slide="2"] .u-marg-b-xl, .c-home__section[data-slide="4"] .u-marg-b-xl { margin-bottom: 25px; } .c-home__section[data-slide="2"] .u-marg-b-md, .c-home__section[data-slide="4"] .u-marg-b-md { margin-bottom: 12px; } /* ── SLIDE 04 — "6 especialidades" ── Padding ultra (200px×2 = 400px) dejaba solo 200px para contenido en 600px de viewport. Reducido a 60px×2 = 120px, dejando 480px. */ .c-home__section[data-slide="3"].u-pad-y-ultra { padding-top: 60px; padding-bottom: 60px; } .c-home__section[data-slide="3"] .u-marg-t-ultra { margin-top: 30px; } .c-home__section[data-slide="3"] .u-marg-t-xxl { margin-top: 30px; } .c-home__section[data-slide="3"] .u-pad-b-xl { padding-bottom: 20px; } .c-home__section[data-slide="3"] .c-borrowers__section-2__list__item { padding-top: 10px; padding-bottom: 10px; } .c-home__section[data-slide="3"] .u-marg-b-xl { margin-bottom: 20px; } }