@font-face{font-family:'Rubik';font-style:normal;font-weight:300 900;font-display:swap;src:url(//www.paylynxs.com/wp-content/themes/paylynxs/dist/fonts/./rubik-latin-ext-variable.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Rubik';font-style:normal;font-weight:300 900;font-display:swap;src:url(//www.paylynxs.com/wp-content/themes/paylynxs/dist/fonts/./rubik-latin-variable.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:'Rubik';font-style:italic;font-weight:300 900;font-display:swap;src:url(//www.paylynxs.com/wp-content/themes/paylynxs/dist/fonts/./rubik-latin-ext-italic-variable.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:'Rubik';font-style:italic;font-weight:300 900;font-display:swap;src:url(//www.paylynxs.com/wp-content/themes/paylynxs/dist/fonts/./rubik-latin-italic-variable.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} :root{--wccm-bg:#757575;--wccm-text:#fff;--wccm-link:#fff;--wccm-reject:#2b5e94;--wccm-accept:#3778ba;--wccm-focus:#a8d4ff;--wccm-font:var(--ff-primary,inherit);--wccm-z-banner:99999}.wccm-banner{position:fixed;left:0;right:0;bottom:0;z-index:var(--wccm-z-banner);padding:0;margin:0;font-family:var(--wccm-font);color:var(--wccm-text);box-sizing:border-box}.wccm-banner[hidden]{display:none !important}.wccm-banner *{box-sizing:border-box}.wccm-banner__inner{width:100%;margin:0;padding:1.25rem 1.75rem;background:var(--wccm-bg);border:0;border-radius:8px 8px 0 0;box-shadow:none}.wccm-banner__row{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;max-width:1200px;margin:0 auto}.wccm-banner__content{flex:1 1 auto;min-width:0}.wccm-banner__title{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wccm-banner__desc{margin:0;font-size:1.125rem;line-height:1.75rem;font-weight:400;color:var(--wccm-text)}.wccm-banner__link{display:inline-block;margin-top:.35rem;color:var(--wccm-link);font-size:1.125rem;line-height:1.75rem;text-decoration:underline;text-underline-offset:2px}.wccm-banner__link:hover,.wccm-banner__link:focus-visible{opacity:.85}.wccm-banner__ccpa{display:block;margin-top:.35rem;padding:0;border:0;background:0 0;color:var(--wccm-link);font:inherit;font-size:.9375rem;line-height:1.4;text-decoration:underline;text-underline-offset:2px;cursor:pointer}.wccm-banner__ccpa:focus{outline:none}.wccm-banner__ccpa:focus-visible{outline:2px solid var(--wccm-focus);outline-offset:2px}.wccm-banner__actions{display:flex;flex-wrap:nowrap;align-items:center;justify-content:flex-end;gap:.75rem;flex:0 0 auto;margin:0}#wccm-banner .wccm-btn,.wccm-banner .wccm-btn{appearance:none;-webkit-appearance:none;padding:12px 20px;margin:0;border:0 !important;border-radius:6px;color:#fff !important;cursor:pointer;position:relative;font-family:var(--wccm-font);font-weight:400;font-size:18px;line-height:100%;text-transform:none;display:inline-block;text-align:center;white-space:nowrap;text-decoration:none !important;box-shadow:none !important;background-image:none !important;-webkit-transition:background-color .3s ease,opacity .3s ease;transition:background-color .3s ease,opacity .3s ease}#wccm-banner .wccm-btn:focus,.wccm-banner .wccm-btn:focus{outline:none}#wccm-banner .wccm-btn:focus-visible,.wccm-banner .wccm-btn:focus-visible{outline:2px solid var(--wccm-focus);outline-offset:2px}#wccm-banner .wccm-btn.wccm-btn--reject,.wccm-banner .wccm-btn.wccm-btn--reject{background:#2b5e94 !important;background-color:#2b5e94 !important;color:#fff !important}#wccm-banner .wccm-btn.wccm-btn--reject:hover,#wccm-banner .wccm-btn.wccm-btn--reject:focus,.wccm-banner .wccm-btn.wccm-btn--reject:hover,.wccm-banner .wccm-btn.wccm-btn--reject:focus{background:#234e7a !important;background-color:#234e7a !important;color:#fff !important}#wccm-banner .wccm-btn.wccm-btn--accept,.wccm-banner .wccm-btn.wccm-btn--accept{background:#3778ba !important;background-color:#3778ba !important;color:#fff !important}#wccm-banner .wccm-btn.wccm-btn--accept:hover,#wccm-banner .wccm-btn.wccm-btn--accept:focus,.wccm-banner .wccm-btn.wccm-btn--accept:hover,.wccm-banner .wccm-btn.wccm-btn--accept:focus{background:#2f6aab !important;background-color:#2f6aab !important;color:#fff !important}#wccm-banner .wccm-btn.wccm-btn--prefs,.wccm-banner .wccm-btn.wccm-btn--prefs{background:#1f4e79 !important;background-color:#1f4e79 !important;color:#fff !important;font-size:16px}#wccm-banner .wccm-btn.wccm-btn--prefs:hover,#wccm-banner .wccm-btn.wccm-btn--prefs:focus,.wccm-banner .wccm-btn.wccm-btn--prefs:hover,.wccm-banner .wccm-btn.wccm-btn--prefs:focus{background:#183d5e !important;background-color:#183d5e !important;color:#fff !important}html.wccm-modal-open{overflow:hidden}.wccm-modal[hidden]{display:none !important}.wccm-modal{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:1.25rem;font-family:var(--wccm-font,inherit)}.wccm-modal__backdrop{position:absolute;inset:0;background:rgba(20,24,32,.45);border:0;padding:0;margin:0;cursor:pointer}.wccm-modal__dialog{position:relative;z-index:1;width:min(560px, 100%);max-height:min(90vh, 720px);overflow:auto;background:#fff;color:#222;border-radius:8px;padding:1.5rem 1.5rem 1.25rem;box-shadow:0 16px 48px rgba(0,0,0,.22)}.wccm-modal__header{display:flex;align-items:flex-start;justify-content:center;position:relative;margin-bottom:.85rem;min-height:2rem}.wccm-modal__title{margin:0;padding:0 2.5rem;font-size:1.35rem;font-weight:700;line-height:1.3;text-align:center;color:#1a1a1a}.wccm-modal__close{position:absolute;top:0;right:0;width:2rem;height:2rem;display:inline-flex;align-items:center;justify-content:center;border:0 !important;border-radius:4px;background:#2b5e94 !important;background-color:#2b5e94 !important;color:#fff !important;font-size:1.35rem;line-height:1;cursor:pointer;padding:0}.wccm-modal__close span{color:#fff !important}.wccm-modal__close:hover,.wccm-modal__close:focus{background:#234e7a !important;background-color:#234e7a !important;color:#fff !important}.wccm-modal__close:hover span,.wccm-modal__close:focus span{color:#fff !important}.wccm-modal__desc{margin:0 0 1.1rem;font-size:.9375rem;line-height:1.55;color:#333}.wccm-modal__categories{display:flex;flex-direction:column;gap:.65rem;margin-bottom:1.25rem}.wccm-cat{background:#f3f4f6;border-radius:8px;overflow:hidden}.wccm-cat__head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;padding:.85rem 1rem;border:0;background:0 0;font:inherit;color:inherit;text-align:left;cursor:pointer}button.wccm-cat__head{width:100%}.wccm-cat__label-btn{display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex:1 1 auto;min-width:0;padding:0;margin:0;border:0;background:0 0;font:inherit;color:inherit;cursor:pointer;text-align:left}.wccm-cat__name{font-size:1rem;font-weight:700;color:#1a1a1a}.wccm-cat__controls{display:inline-flex;align-items:center;gap:.65rem;flex-shrink:0}.wccm-cat__always{color:#2e7d32;font-size:.9375rem;font-weight:600;white-space:nowrap}.wccm-cat__chevron-btn{display:inline-flex;align-items:center;justify-content:center;width:1.75rem;height:1.75rem;padding:0;border:0;background:0 0;cursor:pointer}.wccm-cat__chevron{display:block;width:.55rem;height:.55rem;border-right:2px solid #444;border-bottom:2px solid #444;transform:rotate(45deg);margin-top:-.2rem;transition:transform .2s ease;flex-shrink:0}.wccm-cat--open .wccm-cat__chevron{transform:rotate(-135deg);margin-top:.2rem}.wccm-cat__body{padding:0 1rem .95rem}.wccm-cat__body p{margin:0;padding-top:.15rem;border-top:1px solid rgba(0,0,0,.06);font-size:.875rem;line-height:1.5;color:#444}.wccm-cat__body[hidden]{display:none !important}.wccm-switch{position:relative;display:inline-flex;align-items:center;flex-shrink:0;cursor:pointer}.wccm-switch input{position:absolute;opacity:0;width:0;height:0}.wccm-switch__ui{width:44px;height:24px;border-radius:999px;background:#c5c9d0;position:relative;transition:background-color .2s ease}.wccm-switch__ui:after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .2s ease}.wccm-switch input:checked+.wccm-switch__ui{background:#2b5e94}.wccm-switch input:checked+.wccm-switch__ui:after{transform:translateX(20px)}.wccm-switch input:focus-visible+.wccm-switch__ui{outline:2px solid #3778ba;outline-offset:2px}.wccm-modal .screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.wccm-modal__actions{display:flex;flex-wrap:wrap;gap:.65rem;margin-bottom:1rem}.wccm-modal__btn{appearance:none;-webkit-appearance:none;flex:1 1 0;min-width:7rem;padding:.8rem 1rem;border-radius:6px;font:inherit;font-size:.95rem;font-weight:700;cursor:pointer;text-align:center;-webkit-transition:background-color .25s ease,color .25s ease,border-color .25s ease;transition:background-color .25s ease,color .25s ease,border-color .25s ease}.wccm-modal__btn--accept{background:#2b5e94 !important;background-color:#2b5e94 !important;border:1px solid #2b5e94 !important;color:#fff !important}.wccm-modal__btn--accept:hover{background:#234e7a !important;background-color:#234e7a !important}.wccm-modal__btn--deny,.wccm-modal__btn--save{background:#f3f4f6 !important;background-color:#f3f4f6 !important;border:1px solid #d7dbe2 !important;color:#222 !important}.wccm-modal__btn--deny:hover,.wccm-modal__btn--save:hover{background:#e8eaee !important;background-color:#e8eaee !important}.wccm-modal__footer{display:flex;flex-wrap:wrap;justify-content:center;gap:1.25rem;padding-top:.25rem}.wccm-modal__footer a{color:#3778ba;font-size:.9rem;text-decoration:underline;text-underline-offset:2px}.wccm-modal__footer a:hover{color:#2b5e94}.wccm-cookie-launcher[hidden]{display:none !important}#wccm-cookie-launcher.wccm-cookie-launcher,.wccm-cookie-launcher{position:fixed;left:1rem;bottom:1rem;z-index:99998;display:inline-flex;align-items:center;justify-content:center;width:3.25rem;height:3.25rem;padding:0;margin:0;border:0 !important;border-radius:999px;background:#fff !important;background-color:#fff !important;background-image:none !important;box-shadow:0 4px 16px rgba(0,0,0,.2);cursor:pointer;-webkit-transition:transform .2s ease,box-shadow .2s ease;transition:transform .2s ease,box-shadow .2s ease}#wccm-cookie-launcher.wccm-cookie-launcher:hover,#wccm-cookie-launcher.wccm-cookie-launcher:focus,.wccm-cookie-launcher:hover,.wccm-cookie-launcher:focus{background:#fff !important;background-color:#fff !important;transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.24)}.wccm-cookie-launcher:focus{outline:none}.wccm-cookie-launcher:focus-visible{outline:2px solid #3778ba;outline-offset:3px}.wccm-cookie-launcher__icon{display:flex;line-height:0;position:relative;z-index:1}.wccm-cookie-launcher__icon svg{display:block}.wccm-cookie-launcher__tip{position:absolute;left:calc(100% + 0.65rem);top:50%;transform:translateY(-50%) translateX(-4px);padding:.4rem .7rem;border-radius:6px;background:#1a1d23;color:#fff;font-family:var(--wccm-font,inherit);font-size:.8125rem;font-weight:600;line-height:1.2;white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;box-shadow:0 4px 14px rgba(0,0,0,.18);-webkit-transition:opacity .18s ease,transform .18s ease,visibility .18s ease;transition:opacity .18s ease,transform .18s ease,visibility .18s ease}.wccm-cookie-launcher__tip:before{content:'';position:absolute;right:100%;top:50%;transform:translateY(-50%);border:6px solid transparent;border-right-color:#1a1d23}#wccm-cookie-launcher.wccm-cookie-launcher:hover .wccm-cookie-launcher__tip,#wccm-cookie-launcher.wccm-cookie-launcher:focus .wccm-cookie-launcher__tip,#wccm-cookie-launcher.wccm-cookie-launcher:focus-visible .wccm-cookie-launcher__tip,.wccm-cookie-launcher:hover .wccm-cookie-launcher__tip,.wccm-cookie-launcher:focus .wccm-cookie-launcher__tip,.wccm-cookie-launcher:focus-visible .wccm-cookie-launcher__tip{opacity:1;visibility:visible;transform:translateY(-50%) translateX(0)}@media (max-width:768px){.wccm-banner__inner{padding:1rem 1.125rem;border-radius:8px 8px 0 0}.wccm-banner__row{flex-direction:column;align-items:stretch;gap:1rem}.wccm-banner__actions{justify-content:stretch;flex-wrap:wrap}#wccm-banner .wccm-btn,.wccm-banner .wccm-btn{flex:1 1 auto;text-align:center}.wccm-modal__dialog{padding:1.15rem}.wccm-modal__actions{flex-direction:column}.wccm-modal__btn{width:100%}.wccm-cookie-launcher{left:.75rem;bottom:.75rem;width:3rem;height:3rem}}@media (prefers-reduced-motion:reduce){#wccm-banner .wccm-btn,.wccm-banner .wccm-btn,.wccm-modal__btn,.wccm-switch__ui,.wccm-switch__ui:after,.wccm-cat__chevron{-webkit-transition:none;transition:none}} /*! Theme Name: Paylynxs Theme URI: http://paylynxs.com/ Author: Paylynxs Author URI: https://paylynxs.com Description: Wordpress Theme for Paylynxs website Version: 1.0.0 Tested up to: 5.4 Requires PHP: 5.6 License: GNU General Public License v2 or later License URI: LICENSE Text Domain: paylynxs Tags: webpack, tailwind, kronoscode, custom-theme Kronos Theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc. Underscores is distributed under the terms of the GNU GPL v2 or later. */ @charset "UTF-8"; /*! Theme Name: Paylynxs Theme URI: http://paylynxs.com/ Author: Paylynxs Author URI: https://paylynxs.com Description: Wordpress Theme for Paylynxs website Version: 1.0.0 Tested up to: 5.4 Requires PHP: 5.6 License: GNU General Public License v2 or later License URI: LICENSE Text Domain: kronos Tags: webpack, tailwind, kronoscode, custom-theme Kronos Theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc. Underscores is distributed under the terms of the GNU GPL v2 or later. */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- This structure follows the 7+1 pattern, see more https://sass-guidelin.es/#the-7-1-pattern # Abstracts -- Mixins -- Variables # Base -- Reset -- Typography # Components -- Buttons -- Dropdowns -- Inputs -- Links # Layouts -- Header -- Footer # Pages # Themes # Vendors -- TailwindCSS utilities clasess --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Vendors --------------------------------------------------------------*/ /* * ## TailwindCSS base, components and utilities --------------------------------------------- */ /*! tailwindcss v3.2.1 | MIT License | https://tailwindcss.com */ /* 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) */ *, ::before, ::after { -webkit-box-sizing: border-box; box-sizing: border-box; /* 1 */ border-width: 0; /* 2 */ border-style: solid; /* 2 */ border-color: currentColor; /* 2 */ } ::before, ::after { --tw-content: ''; } /* 1. Use a consistent sensible line-height in all browsers. 2. Prevent adjustments of font size after orientation changes in iOS. 3. Use a more readable tab size. 4. Use the user's configured `sans` font-family by default. */ html { line-height: 1.5; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -moz-tab-size: 4; /* 3 */ -o-tab-size: 4; tab-size: 4; /* 3 */ font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */ } /* 1. Remove the margin in all browsers. 2. Inherit line-height from `html` so users can set them as a class directly on the `html` element. */ body { margin: 0; /* 1 */ line-height: inherit; /* 2 */ } /* 1. Add the correct height in Firefox. 2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655) 3. Ensure horizontal rules are visible by default. */ hr { height: 0; /* 1 */ color: inherit; /* 2 */ border-top-width: 1px; /* 3 */ } /* Add the correct text decoration in Chrome, Edge, and Safari. */ abbr:where([title]) { -webkit-text-decoration: underline dotted; text-decoration: underline dotted; } /* Remove the default font size and weight for headings. */ h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; } /* Reset links to optimize for opt-in styling instead of opt-out. */ a { color: inherit; text-decoration: inherit; } /* Add the correct font weight in Edge and Safari. */ b, strong { font-weight: bolder; } /* 1. Use the user's configured `mono` font family by default. 2. Correct the odd `em` font sizing in all browsers. */ code, kbd, samp, pre { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */ font-size: 1em; /* 2 */ } /* Add the correct font size in all browsers. */ small { font-size: 80%; } /* Prevent `sub` and `sup` elements from affecting the line height in all browsers. */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } /* 1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297) 2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016) 3. Remove gaps between table borders by default. */ table { text-indent: 0; /* 1 */ border-color: inherit; /* 2 */ border-collapse: collapse; /* 3 */ } /* 1. Change the font styles in all browsers. 2. Remove the margin in Firefox and Safari. 3. Remove default padding in all browsers. */ button, input, optgroup, select, textarea { font-family: inherit; /* 1 */ font-size: 100%; /* 1 */ font-weight: inherit; /* 1 */ line-height: inherit; /* 1 */ color: inherit; /* 1 */ margin: 0; /* 2 */ padding: 0; /* 3 */ } /* Remove the inheritance of text transform in Edge and Firefox. */ button, select { text-transform: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Remove default button styles. */ button, [type='button'], [type='reset'], [type='submit'] { -webkit-appearance: button; /* 1 */ background-color: transparent; /* 2 */ background-image: none; /* 2 */ } /* Use the modern Firefox focus style for all focusable elements. */ :-moz-focusring { outline: auto; } /* Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737) */ :-moz-ui-invalid { box-shadow: none; } /* Add the correct vertical alignment in Chrome and Firefox. */ progress { vertical-align: baseline; } /* Correct the cursor style of increment and decrement buttons in Safari. */ ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; } /* 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */ [type='search'] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ } /* Remove the inner padding in Chrome and Safari on macOS. */ ::-webkit-search-decoration { -webkit-appearance: none; } /* 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */ ::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ } /* Add the correct display in Chrome and Safari. */ summary { display: list-item; } /* Removes the default spacing and border for appropriate elements. */ blockquote, dl, dd, h1, h2, h3, h4, h5, h6, hr, figure, p, pre { margin: 0; } fieldset { margin: 0; padding: 0; } legend { padding: 0; } ol, ul, menu { list-style: none; margin: 0; padding: 0; } /* Prevent resizing textareas horizontally by default. */ textarea { resize: vertical; } /* 1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300) 2. Set the default placeholder color to the user's configured gray 400 color. */ input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input::-moz-placeholder, textarea::-moz-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input:-ms-input-placeholder, textarea:-ms-input-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input::-ms-input-placeholder, textarea::-ms-input-placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } input::placeholder, textarea::placeholder { opacity: 1; /* 1 */ color: #9ca3af; /* 2 */ } /* Set the default cursor for buttons. */ button, [role="button"] { cursor: pointer; } /* Make sure disabled buttons don't get the pointer cursor. */ :disabled { cursor: default; } /* 1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14) 2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210) This can trigger a poorly considered lint error in some tools but is included by design. */ img, svg, video, canvas, audio, iframe, embed, object { display: block; /* 1 */ vertical-align: middle; /* 2 */ } /* Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14) */ img, video { max-width: 100%; height: auto; } /* Make elements with the HTML hidden attribute stay hidden by default */ [hidden] { display: none; } *, ::before, ::after{ --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; } ::-webkit-backdrop{ --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; } ::backdrop{ --tw-border-spacing-x: 0; --tw-border-spacing-y: 0; --tw-translate-x: 0; --tw-translate-y: 0; --tw-rotate: 0; --tw-skew-x: 0; --tw-skew-y: 0; --tw-scale-x: 1; --tw-scale-y: 1; --tw-pan-x: ; --tw-pan-y: ; --tw-pinch-zoom: ; --tw-scroll-snap-strictness: proximity; --tw-ordinal: ; --tw-slashed-zero: ; --tw-numeric-figure: ; --tw-numeric-spacing: ; --tw-numeric-fraction: ; --tw-ring-inset: ; --tw-ring-offset-width: 0px; --tw-ring-offset-color: #fff; --tw-ring-color: rgb(59 130 246 / 0.5); --tw-ring-offset-shadow: 0 0 #0000; --tw-ring-shadow: 0 0 #0000; --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; --tw-blur: ; --tw-brightness: ; --tw-contrast: ; --tw-grayscale: ; --tw-hue-rotate: ; --tw-invert: ; --tw-saturate: ; --tw-sepia: ; --tw-drop-shadow: ; --tw-backdrop-blur: ; --tw-backdrop-brightness: ; --tw-backdrop-contrast: ; --tw-backdrop-grayscale: ; --tw-backdrop-hue-rotate: ; --tw-backdrop-invert: ; --tw-backdrop-opacity: ; --tw-backdrop-saturate: ; --tw-backdrop-sepia: ; } .container{ width: 100%; margin-right: auto; margin-left: auto; padding-right: .75rem; padding-left: .75rem; } @media (min-width: 390px){ .container{ max-width: 390px; } } @media (min-width: 576px){ .container{ max-width: 576px; } } @media (min-width: 768px){ .container{ max-width: 768px; } } @media (min-width: 992px){ .container{ max-width: 992px; } } @media (min-width: 1280px){ .container{ max-width: 1280px; } } @media (min-width: 1536px){ .container{ max-width: 1536px; } } .container{ max-width: calc(100% - 40px); } @media (min-width: 576px){ .container{ max-width: calc(576px - 40px); } } @media (min-width: 768px){ .container{ max-width: calc(768px - 40px); } } @media (min-width: 992px){ .container{ max-width: calc(992px - 140px); } } @media (min-width: 1280px){ .container{ max-width: calc(1280px - 140px); } } @media (min-width: 1536px){ .container{ max-width: calc(1536px - 140px); } } .visible{ visibility: visible; } .static{ position: static; } .fixed{ position: fixed; } .absolute{ position: absolute; } .relative{ position: relative; } .sticky{ position: sticky; } .bottom-0{ bottom: 0px; } .\!z-10{ z-index: 10 !important; } .z-50{ z-index: 50; } .col-span-12{ grid-column: span 12 / span 12; } .my-6{ margin-top: 1.5rem; margin-bottom: 1.5rem; } .mb-1\.5{ margin-bottom: 0.375rem; } .mb-1{ margin-bottom: 0.25rem; } .mb-6{ margin-bottom: 1.5rem; } .mb-7{ margin-bottom: 1.75rem; } .ml-1\.5{ margin-left: 0.375rem; } .ml-1{ margin-left: 0.25rem; } .mr-3{ margin-right: 0.75rem; } .mr-4{ margin-right: 1rem; } .mr-1\.5{ margin-right: 0.375rem; } .mr-1{ margin-right: 0.25rem; } .mt-16{ margin-top: 4rem; } .mt-1{ margin-top: 0.25rem; } .mb-2\.5{ margin-bottom: 0.625rem; } .mb-2{ margin-bottom: 0.5rem; } .ml-4{ margin-left: 1rem; } .mt-4{ margin-top: 1rem; } .mb-4{ margin-bottom: 1rem; } .block{ display: block; } .inline-block{ display: inline-block; } .inline{ display: inline; } .flex{ display: -webkit-box; display: -ms-flexbox; display: flex; } .table{ display: table; } .grid{ display: grid; } .hidden{ display: none; } .h-8{ height: 2rem; } .h-5{ height: 1.25rem; } .w-8{ width: 2rem; } .w-5{ width: 1.25rem; } .max-w-container{ max-width: calc(100% - 40px); } .max-w-md{ max-width: 28rem; } .flex-shrink{ -ms-flex-negative: 1; flex-shrink: 1; } .flex-grow{ -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .transform{ -webkit-transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); } .resize{ resize: both; } .grid-cols-1{ grid-template-columns: repeat(1, minmax(0, 1fr)); } .grid-cols-2{ grid-template-columns: repeat(2, minmax(0, 1fr)); } .grid-cols-3{ grid-template-columns: repeat(3, minmax(0, 1fr)); } .grid-cols-12{ grid-template-columns: repeat(12, minmax(0, 1fr)); } .flex-row{ -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .flex-row-reverse{ -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .flex-col{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .flex-wrap{ -ms-flex-wrap: wrap; flex-wrap: wrap; } .items-start{ -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .items-end{ -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .items-center{ -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .justify-start{ -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .justify-end{ -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .justify-center{ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .gap-x-2{ -webkit-column-gap: 0.5rem; -moz-column-gap: 0.5rem; column-gap: 0.5rem; } .gap-y-6{ row-gap: 1.5rem; } .gap-x-4{ -webkit-column-gap: 1rem; -moz-column-gap: 1rem; column-gap: 1rem; } .gap-y-3{ row-gap: 0.75rem; } .gap-x-6{ -webkit-column-gap: 1.5rem; -moz-column-gap: 1.5rem; column-gap: 1.5rem; } .rounded-full{ border-radius: 9999px; } .rounded{ border-radius: 0.25rem; } .border{ border-width: 1px; } .border-3{ border-width: 3px; } .border-white{ --tw-border-opacity: 1; border-color: rgb(255 255 255 / var(--tw-border-opacity)); } .border-green{ --tw-border-opacity: 1; border-color: rgb(69 132 46 / var(--tw-border-opacity)); } .border-gray{ --tw-border-opacity: 1; border-color: rgb(117 117 117 / var(--tw-border-opacity)); } .bg-white{ --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .bg-light-blue{ --tw-bg-opacity: 1; background-color: rgb(245 248 252 / var(--tw-bg-opacity)); } .bg-light-gray{ --tw-bg-opacity: 1; background-color: rgb(245 241 241 / var(--tw-bg-opacity)); } .bg-blue{ --tw-bg-opacity: 1; background-color: rgb(55 120 186 / var(--tw-bg-opacity)); } .bg-gray{ --tw-bg-opacity: 1; background-color: rgb(117 117 117 / var(--tw-bg-opacity)); } .p-5{ padding: 1.25rem; } .p-1{ padding: 0.25rem; } .py-12{ padding-top: 3rem; padding-bottom: 3rem; } .px-2{ padding-left: 0.5rem; padding-right: 0.5rem; } .py-1{ padding-top: 0.25rem; padding-bottom: 0.25rem; } .px-7{ padding-left: 1.75rem; padding-right: 1.75rem; } .py-2\.5{ padding-top: 0.625rem; padding-bottom: 0.625rem; } .py-2{ padding-top: 0.5rem; padding-bottom: 0.5rem; } .py-6{ padding-top: 1.5rem; padding-bottom: 1.5rem; } .px-2\.5{ padding-left: 0.625rem; padding-right: 0.625rem; } .py-1\.5{ padding-top: 0.375rem; padding-bottom: 0.375rem; } .py-4{ padding-top: 1rem; padding-bottom: 1rem; } .\!px-14{ padding-left: 3.5rem !important; padding-right: 3.5rem !important; } .pr-1\.5{ padding-right: 0.375rem; } .pr-1{ padding-right: 0.25rem; } .text-left{ text-align: left; } .text-center{ text-align: center; } .text-right{ text-align: right; } .text-hero{ font-size: 3.125rem; line-height: 1; } .text-h1{ font-size: 2.5rem; line-height: 3rem; } .text-lg{ font-size: 1.125rem; line-height: 1.75rem; } .text-2xl{ font-size: 1.5rem; line-height: 2rem; } .text-base{ font-size: 1rem; line-height: 1.5rem; } .text-sm{ font-size: 0.875rem; line-height: 1.25rem; } .text-xs{ font-size: 0.75rem; line-height: 1rem; } .text-xl{ font-size: 1.25rem; line-height: 1.75rem; } .text-3xl{ font-size: 1.875rem; line-height: 2.25rem; } .font-normal{ font-weight: 400; } .font-medium{ font-weight: 500; } .font-bold{ font-weight: 700; } .font-semibold{ font-weight: 600; } .uppercase{ text-transform: uppercase; } .lowercase{ text-transform: lowercase; } .capitalize{ text-transform: capitalize; } .\!normal-case{ text-transform: none !important; } .text-gray{ --tw-text-opacity: 1; color: rgb(117 117 117 / var(--tw-text-opacity)); } .text-green{ --tw-text-opacity: 1; color: rgb(69 132 46 / var(--tw-text-opacity)); } .text-white{ --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .underline{ text-decoration-line: underline; } .opacity-75{ opacity: 0.75; } .outline{ outline-style: solid; } .blur{ --tw-blur: blur(8px); -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .invert{ --tw-invert: invert(100%); -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .sepia{ --tw-sepia: sepia(100%); -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .filter{ -webkit-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); } .backdrop-filter{ backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia); } .transition{ -webkit-transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, backdrop-filter, -webkit-box-shadow, -webkit-transform, -webkit-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, backdrop-filter, -webkit-box-shadow, -webkit-transform, -webkit-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter; transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-box-shadow, -webkit-transform, -webkit-filter; -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); -webkit-transition-duration: 150ms; transition-duration: 150ms; } .transition-all{ -webkit-transition-property: all; transition-property: all; -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); -webkit-transition-duration: 150ms; transition-duration: 150ms; } .duration-300{ -webkit-transition-duration: 300ms; transition-duration: 300ms; } .ease-in-out{ -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } /* * ## Keen Slider --------------------------------------------- */ .keen-slider:not([data-keen-slider-disabled]) { -ms-flex-line-pack: start; align-content: flex-start; display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; position: relative; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; width: 100%; } .keen-slider:not([data-keen-slider-disabled]) .keen-slider__slide { position: relative; overflow: hidden; width: 100%; min-height: 100%; } .keen-slider:not([data-keen-slider-disabled])[data-keen-slider-reverse] { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .keen-slider:not([data-keen-slider-disabled])[data-keen-slider-v] { -ms-flex-wrap: wrap; flex-wrap: wrap; } [data-keen-slider-moves] * { pointer-events: none; } /*-------------------------------------------------------------- # Abstract --------------------------------------------------------------*/ /* * ## Mixins --------------------------------------------- */ /** Based in: https://codepen.io/MadeByMike/pen/vNrvdZ?editors=0110 */ /*————————————————————————————————————————————————————*\ ●❱ SHORTHANDS MIXINS HELPERS \*————————————————————————————————————————————————————*/ /*————————————————————————————————————————————————————*\ ●❱ MIXINGS \*————————————————————————————————————————————————————*/ /* * ## Variables --------------------------------------------- */ /*-------------------------------------------------------------- # Base --------------------------------------------------------------*/ /* * ## Reset --------------------------------------------- */ /* * ## Typography --------------------------------------------- */ /* Rubik is loaded once via header.php (non-blocking) to avoid duplicate @import in CSS. */ html *{ font-family: Rubik, sans-serif; } html *:not(h6){ --tw-text-opacity: 1; color: rgb(57 60 63 / var(--tw-text-opacity)); } h1, h2, h3, h4{ font-weight: 700; } h1{ font-size: 2.5rem; line-height: 3rem; } h2{ font-size: 1.875rem; line-height: 2.25rem; } h3{ font-size: 1.5rem; line-height: 2rem; } h4, h5{ font-size: 1.25rem; line-height: 1.75rem; } h6{ font-size: 1rem; line-height: 1.5rem; font-weight: 500; text-transform: uppercase; --tw-text-opacity: 1; color: rgb(69 132 46 / var(--tw-text-opacity)); } h6.mci__wrapper-info .mci__wrapper-info-title { font-size: 32px; } @media screen and (max-width: 76em) { h6.mci__wrapper-info .mci__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 48em) { h6.mci__wrapper-info .mci__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 36em) { h6.mci__wrapper-info .mci__wrapper-info-title { font-size: 22px; } } @media screen and (max-width: 29.6875em) { h6.mci__wrapper-info .mci__wrapper-info-title { font-size: 20px; } } h6.mci__wrapper-info .mci__wrapper-info-content { font-size: 24px; } @media screen and (max-width: 76em) { h6.mci__wrapper-info .mci__wrapper-info-content { font-size: 22px; } } @media screen and (max-width: 48em) { h6.mci__wrapper-info .mci__wrapper-info-content { font-size: 20px; } } @media screen and (max-width: 36em) { h6.mci__wrapper-info .mci__wrapper-info-content { font-size: 18px; } } @media screen and (max-width: 29.6875em) { h6.mci__wrapper-info .mci__wrapper-info-content { font-size: 16px; } } h6.mci__wrapper-info-title { color: var(--c-green-light); } h6.mci__wrapper-icons-item-info-title { font-size: 24px; } @media screen and (max-width: 76em) { h6.mci__wrapper-icons-item-info-title { font-size: 22px; } } @media screen and (max-width: 48em) { h6.mci__wrapper-icons-item-info-title { font-size: 20px; } } @media screen and (max-width: 36em) { h6.mci__wrapper-icons-item-info-title { font-size: 18px; } } p, a, li, blockquote{ font-size: 1rem; line-height: 1.5rem; } p.mci__wrapper-info .mci__wrapper-info-title, a.mci__wrapper-info .mci__wrapper-info-title, li.mci__wrapper-info .mci__wrapper-info-title, blockquote.mci__wrapper-info .mci__wrapper-info-title { font-size: 32px; } @media screen and (max-width: 76em) { p.mci__wrapper-info .mci__wrapper-info-title, a.mci__wrapper-info .mci__wrapper-info-title, li.mci__wrapper-info .mci__wrapper-info-title, blockquote.mci__wrapper-info .mci__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 48em) { p.mci__wrapper-info .mci__wrapper-info-title, a.mci__wrapper-info .mci__wrapper-info-title, li.mci__wrapper-info .mci__wrapper-info-title, blockquote.mci__wrapper-info .mci__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 36em) { p.mci__wrapper-info .mci__wrapper-info-title, a.mci__wrapper-info .mci__wrapper-info-title, li.mci__wrapper-info .mci__wrapper-info-title, blockquote.mci__wrapper-info .mci__wrapper-info-title { font-size: 22px; } } @media screen and (max-width: 29.6875em) { p.mci__wrapper-info .mci__wrapper-info-title, a.mci__wrapper-info .mci__wrapper-info-title, li.mci__wrapper-info .mci__wrapper-info-title, blockquote.mci__wrapper-info .mci__wrapper-info-title { font-size: 20px; } } p.mci__wrapper-info .mci__wrapper-info-content, a.mci__wrapper-info .mci__wrapper-info-content, li.mci__wrapper-info .mci__wrapper-info-content, blockquote.mci__wrapper-info .mci__wrapper-info-content { font-size: 24px; } @media screen and (max-width: 76em) { p.mci__wrapper-info .mci__wrapper-info-content, a.mci__wrapper-info .mci__wrapper-info-content, li.mci__wrapper-info .mci__wrapper-info-content, blockquote.mci__wrapper-info .mci__wrapper-info-content { font-size: 22px; } } @media screen and (max-width: 48em) { p.mci__wrapper-info .mci__wrapper-info-content, a.mci__wrapper-info .mci__wrapper-info-content, li.mci__wrapper-info .mci__wrapper-info-content, blockquote.mci__wrapper-info .mci__wrapper-info-content { font-size: 20px; } } @media screen and (max-width: 36em) { p.mci__wrapper-info .mci__wrapper-info-content, a.mci__wrapper-info .mci__wrapper-info-content, li.mci__wrapper-info .mci__wrapper-info-content, blockquote.mci__wrapper-info .mci__wrapper-info-content { font-size: 18px; } } @media screen and (max-width: 29.6875em) { p.mci__wrapper-info .mci__wrapper-info-content, a.mci__wrapper-info .mci__wrapper-info-content, li.mci__wrapper-info .mci__wrapper-info-content, blockquote.mci__wrapper-info .mci__wrapper-info-content { font-size: 16px; } } p.mci__wrapper-icons-item-info-title, a.mci__wrapper-icons-item-info-title, li.mci__wrapper-icons-item-info-title, blockquote.mci__wrapper-icons-item-info-title { font-size: 24px; } @media screen and (max-width: 76em) { p.mci__wrapper-icons-item-info-title, a.mci__wrapper-icons-item-info-title, li.mci__wrapper-icons-item-info-title, blockquote.mci__wrapper-icons-item-info-title { font-size: 22px; } } @media screen and (max-width: 48em) { p.mci__wrapper-icons-item-info-title, a.mci__wrapper-icons-item-info-title, li.mci__wrapper-icons-item-info-title, blockquote.mci__wrapper-icons-item-info-title { font-size: 20px; } } @media screen and (max-width: 36em) { p.mci__wrapper-icons-item-info-title, a.mci__wrapper-icons-item-info-title, li.mci__wrapper-icons-item-info-title, blockquote.mci__wrapper-icons-item-info-title { font-size: 18px; } } @media (min-width: 768px){ p, a, li, blockquote{ font-size: 1.125rem; line-height: 1.75rem; } } .hero-subtitle{ font-size: 1.5rem; line-height: 2rem; font-weight: 400; } .mci__wrapper-icons-item-info-title.hero-subtitle { font-weight: 400; } .small-copy{ font-size: 0.875rem; line-height: 1.25rem; } .mci__wrapper-info.small-copy .mci__wrapper-info-title { font-size: 18px; } .mci__wrapper-info.small-copy .mci__wrapper-info-content { font-size: 18px; } .mci__wrapper-icons-item-info-title.small-copy { line-height: 1.2; font-size: 20px; } @media screen and (max-width: 36em) { .mci__wrapper-icons-item-info-title.small-copy { font-size: 18px; } } /* * ## Utils --------------------------------------------- */ .bg-white-split-blue { background: -webkit-gradient(linear, left top, right top, color-stop(50%, white), color-stop(50%, #3778BA)); background: linear-gradient(to right, white 50%, #3778BA 50%); } .border-gradient-green { border-image-slice: 1; border-image-source: linear-gradient(to right, #45842E, #9ACD32); } .stretched-link::after{ position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; --tw-content: ""; content: var(--tw-content); } /* * ## Animations --------------------------------------------- */ .animation-fade-out{ opacity: 0; display: none; -webkit-animation: fade-out 300ms ease-in-out; animation: fade-out 300ms ease-in-out; } @-webkit-keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } @-webkit-keyframes fade-out { from { opacity: 1; } to { opacity: 0; } } @keyframes fade-out { from { opacity: 1; } to { opacity: 0; } } /* * ## Root --------------------------------------------- */ /*! Theme Name: Paylynxs Theme URI: http://paylynxs.com/ Author: Paylynxs Author URI: https://paylynxs.com Description: Wordpress Theme for Paylynxs website Version: 1.0.0 Tested up to: 5.4 Requires PHP: 5.6 License: GNU General Public License v2 or later License URI: LICENSE Text Domain: kronos Tags: webpack, tailwind, kronoscode, custom-theme Kronos Theme is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc. Underscores is distributed under the terms of the GNU GPL v2 or later. */ /*-------------------------------------------------------------- >>> TABLE OF CONTENTS: ---------------------------------------------------------------- This structure follows the 7+1 pattern, see more https://sass-guidelin.es/#the-7-1-pattern # Abstracts -- Mixins -- Variables # Base -- Reset -- Typography # Components -- Buttons -- Dropdowns -- Inputs -- Links # Layouts -- Header -- Footer # Pages # Themes # Vendors -- TailwindCSS utilities clasess --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Vendors --------------------------------------------------------------*/ /* * ## TailwindCSS base, components and utilities --------------------------------------------- */ /*! tailwindcss v3.2.1 | MIT License | https://tailwindcss.com */ /* 1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4) 2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116) */ h1, h2, h3, h4, h5, h6, p { margin: 0 !important; line-height: normal; } /* |> BREAKPOINTS BOOSTRAP ——————————————————————————————————————————————————————*/ /* |> OTHERS ——————————————————————————————————————————————————————*/ :root { /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ --max-width-container: 110rem; /* ——— Transition duration time */ --g-trans: 0.3s; /* ——— Border radius */ --g-br: 10px; /* ——— Box Shadow */ --g-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; /* ——— Fonts */ --body-font-size: 1rem; --body-line-height: 1.5; /* ——— Colors */ --c-primary: #242628; --c-black: #201f1e; --c-primary-hover: #231f20de; --c-second: #7c7c7c; --c-second-hover: #595959; --c-body-bg: #fff; --c-gray: #dee0e2; --c-gray-2: #66686c; --c-gray-3: #f3f3f3; --c-blue: #3573B1; --c-blue-2: #2b5e94; --c-green: #417D2C; --c-green-light: #417D2C; --c-green-2: #18370e; /* ——— HR */ --hr-color: grey; --hr-opacity: 1; --max-w: 1200px; --max-w-2: 1440px; --max-w-3: 1600px; --ff-primary: "Rubik", sans-serif; /* ——— Mark */ --mark-padding: 0.5rem; /* ——— Links */ --link-color: var(--c-primary); --link-hover-color: var(--c-primary-hover); /* ——— Font sizes */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* ——— Spacing */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ /* |> Unit check ——————————————————————————————————————————————————————*/ /* |> Convert screen sizes for media queries to 'em' ——————————————————————————————————————————————————————*/ /** @see https://zellwk.com/blog/media-query-units/ */ /** If we use 'rem', we convert them to 'em' */ /** If we use 'px', we convert them to 'em' */ --p-container: 2rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --p-container: calc(3.7037037037vw + 0.6666666667rem); } } @media screen and (min-width: 90em) { :root { --p-container: 4rem; } } :root { --fs-n1: 0.8rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-n1: calc(0.1851851852vw + 0.7333333333rem); } } @media screen and (min-width: 90em) { :root { --fs-n1: 0.9rem; } } :root { --fs-base: 1rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-base: calc(0vw + 1rem); } } @media screen and (min-width: 90em) { :root { --fs-base: 1rem; } } :root { --fs-0: 0.875rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-0: calc(0.1166666667vw + 0.833rem); } } @media screen and (min-width: 90em) { :root { --fs-0: 0.938rem; } } :root { --fs-1: 1rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-1: calc(0.2314814815vw + 0.9166666667rem); } } @media screen and (min-width: 90em) { :root { --fs-1: 1.125rem; } } :root { --fs-2: 1.25rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-2: calc(0.462962963vw + 1.0833333333rem); } } @media screen and (min-width: 90em) { :root { --fs-2: 1.5rem; } } :root { --fs-3: 1.5rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-3: calc(0.462962963vw + 1.3333333333rem); } } @media screen and (min-width: 90em) { :root { --fs-3: 1.75rem; } } :root { --fs-4: 1.625rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-4: calc(0.6944444444vw + 1.375rem); } } @media screen and (min-width: 90em) { :root { --fs-4: 2rem; } } :root { --fs-5: 2rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-5: calc(0.9259259259vw + 1.6666666667rem); } } @media screen and (min-width: 90em) { :root { --fs-5: 2.5rem; } } :root { --fs-6: 2rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-6: calc(2.7777777778vw + 1rem); } } @media screen and (min-width: 90em) { :root { --fs-6: 3.5rem; } } :root { --fs-hero-1: 2.5rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-hero-1: calc(3.8888888889vw + 1.1rem); } } @media screen and (min-width: 90em) { :root { --fs-hero-1: 4.6rem; } } :root { --fs-hero-2: 2rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --fs-hero-2: calc(7.8703703704vw - 0.8333333333rem); } } @media screen and (min-width: 90em) { :root { --fs-hero-2: 6.25rem; } } :root { --hg-navbar: 71px; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --hg-navbar: calc(6.1342592593vw + 35.6666666667px); } } @media screen and (min-width: 90em) { :root { --hg-navbar: 124px; } } :root { --sp-16: 1rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-16: calc(0vw + 1rem); } } @media screen and (min-width: 90em) { :root { --sp-16: 1rem; } } :root { --sp-32: 1.5rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-32: calc(0.9259259259vw + 1.1666666667rem); } } @media screen and (min-width: 90em) { :root { --sp-32: 2rem; } } :root { --sp-40: 2rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-40: calc(0.9259259259vw + 1.6666666667rem); } } @media screen and (min-width: 90em) { :root { --sp-40: 2.5rem; } } :root { --sp-50: 2rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-50: calc(2.0833333333vw + 1.25rem); } } @media screen and (min-width: 90em) { :root { --sp-50: 3.125rem; } } :root { --sp-64: 2rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-64: calc(3.7037037037vw + 0.6666666667rem); } } @media screen and (min-width: 90em) { :root { --sp-64: 4rem; } } :root { --sp-80: 2.5rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-80: calc(4.6296296296vw + 0.8333333333rem); } } @media screen and (min-width: 90em) { :root { --sp-80: 5rem; } } :root { --sp-120: 2.5rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-120: calc(9.2592592593vw - 0.8333333333rem); } } @media screen and (min-width: 90em) { :root { --sp-120: 7.5rem; } } :root { --sp-160: 2.5rem; /*-clean-css ignore:start */ /*-clean-css ignore:end */ } @media screen and (min-width: 36em) { :root { --sp-160: calc(13.8888888889vw - 2.5rem); } } @media screen and (min-width: 90em) { :root { --sp-160: 10rem; } } @media screen and (max-width: 22.5em) { :root { --p-container: 1.5rem !important; } } .container--wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding-inline: 40px; } @media screen and (max-width: 76em) { .container--wrapper { padding-inline: 30px; } } @media screen and (max-width: 48em) { .container--wrapper { padding-inline: 20px; } } html { scroll-behavior: smooth; overflow-x: hidden; } [class*=animation--] { opacity: 0; -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease, -webkit-filter 0.6s ease; transition: opacity 0.6s ease, -webkit-transform 0.6s ease, -webkit-filter 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease, filter 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease, filter 0.6s ease, -webkit-transform 0.6s ease, -webkit-filter 0.6s ease; } [class*=animation--].active--animation-no { opacity: 1; -webkit-transform: none; transform: none; } [class*=animation--].is-visible { opacity: 1; -webkit-transform: none; transform: none; } .animation--fade_in { opacity: 0; -webkit-transition: opacity 0.6s ease; transition: opacity 0.6s ease; } .animation--fade_in.is-visible { opacity: 1; } .animation--slide_up { opacity: 0; -webkit-transform: translateY(30px); transform: translateY(30px); -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease, -webkit-transform 0.6s ease; } .animation--slide_up.is-visible { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .animation--slide_left { opacity: 0; -webkit-transform: translateX(-40px); transform: translateX(-40px); -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease, -webkit-transform 0.6s ease; } .animation--slide_left.is-visible { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } .animation--slide_right { opacity: 0; -webkit-transform: translateX(40px); transform: translateX(40px); -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease, -webkit-transform 0.6s ease; } .animation--slide_right.is-visible { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } .animation--zoom_in { opacity: 0; -webkit-transform: scale(0.8); transform: scale(0.8); -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease, -webkit-transform 0.6s ease; } .animation--zoom_in.is-visible { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .animation--rotate_in { opacity: 0; -webkit-transform: rotate(-10deg) scale(0.95); transform: rotate(-10deg) scale(0.95); -webkit-transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, -webkit-transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease; transition: opacity 0.6s ease, transform 0.6s ease, -webkit-transform 0.6s ease; } .animation--rotate_in.is-visible { opacity: 1; -webkit-transform: rotate(0) scale(1); transform: rotate(0) scale(1); } .global-btn { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; text-transform: uppercase; background-color: var(--c-body-bg); padding: 12px 20px; border-radius: 6px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; } .global-btn span { display: inline-block; -webkit-transition: -webkit-transform 0.3s ease; transition: -webkit-transform 0.3s ease; transition: transform 0.3s ease; transition: transform 0.3s ease, -webkit-transform 0.3s ease; } .global-btn:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } @media screen and (max-width: 36em) { .global-btn { font-size: 16px; } } /*-------------------------------------------------------------- # Components --------------------------------------------------------------*/ /* * ## Buttons --------------------------------------------- */ .btn { padding: 12px 20px; border-radius: 6px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; text-transform: uppercase; display: inline-block; } @media screen and (max-width: 36em) { .btn { font-size: 16px; } } .btn:disabled, .btn.disabled{ cursor: not-allowed; opacity: 0.75; } .btn-primary { background-color: var(--c-blue); color: var(--c-body-bg); } .btn-primary span { display: inline-block; color: var(--c-body-bg); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .btn-secondary { background-color: var(--c-blue-2); color: var(--c-body-bg); } .btn-secondary span { display: inline-block; color: var(--c-body-bg); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .btn-white-blue { background-color: var(--c-body-bg); color: var(--c-blue); } .btn-white-blue span { display: inline-block; color: var(--c-blue); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .btn-white-blue-2 { background-color: var(--c-body-bg); color: var(--c-blue-2); } .btn-white-blue-2 span { display: inline-block; color: var(--c-blue-2); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .btn-white-green { background-color: var(--c-body-bg); color: var(--c-green); } .btn-white-green span { display: inline-block; color: var(--c-green); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .btn-white-green-2 { background-color: var(--c-body-bg); color: var(--c-green-2); } .btn-white-green-2 span { display: inline-block; color: var(--c-green-2); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .btn-white-ghost { border: 2px solid var(--c-body-bg); color: var(--c-body-bg); } .btn-white-ghost span { display: inline-block; color: var(--c-body-bg); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .btn-blue-ghost { border: 2px solid var(--c-blue); color: var(--c-blue); } .btn-blue-ghost-2 { border: 2px solid var(--c-blue-2); color: var(--c-blue-2); background-color: rgba(67, 146, 224, 0.1607843137); } .btn-small{ padding-left: 0.5rem; padding-right: 0.5rem; padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: 1rem; line-height: 1.5rem; } .mci__wrapper-info.btn-small .mci__wrapper-info-title { font-size: 32px; } @media screen and (max-width: 76em) { .mci__wrapper-info.btn-small .mci__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 48em) { .mci__wrapper-info.btn-small .mci__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 36em) { .mci__wrapper-info.btn-small .mci__wrapper-info-title { font-size: 22px; } } @media screen and (max-width: 29.6875em) { .mci__wrapper-info.btn-small .mci__wrapper-info-title { font-size: 20px; } } .mci__wrapper-info.btn-small .mci__wrapper-info-content { font-size: 24px; } @media screen and (max-width: 76em) { .mci__wrapper-info.btn-small .mci__wrapper-info-content { font-size: 22px; } } @media screen and (max-width: 48em) { .mci__wrapper-info.btn-small .mci__wrapper-info-content { font-size: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-info.btn-small .mci__wrapper-info-content { font-size: 18px; } } @media screen and (max-width: 29.6875em) { .mci__wrapper-info.btn-small .mci__wrapper-info-content { font-size: 16px; } } .mci__wrapper-icons-item-info-title.btn-small { font-size: 24px; } @media screen and (max-width: 76em) { .mci__wrapper-icons-item-info-title.btn-small { font-size: 22px; } } @media screen and (max-width: 48em) { .mci__wrapper-icons-item-info-title.btn-small { font-size: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-icons-item-info-title.btn-small { font-size: 18px; } } .btn-small:hover{ --tw-bg-opacity: 1; background-color: rgb(59 89 152 / var(--tw-bg-opacity)); --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .btn-small:focus{ --tw-bg-opacity: 1; background-color: rgb(59 89 152 / var(--tw-bg-opacity)); } .btn-small:active{ --tw-bg-opacity: 1; background-color: rgb(59 89 152 / var(--tw-bg-opacity)); } .btn-x-small{ padding-left: 1.75rem; padding-right: 1.75rem; padding-top: 0.625rem; padding-bottom: 0.625rem; font-size: 0.75rem; line-height: 1rem; } .btn-block{ display: block; text-align: center; } .mci__wrapper-info.btn-block { text-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } /* * ## Icons --------------------------------------------- */ .icon-facebook path { color: #3b5998; } .icon-linkedin path { color: #0e76a8; } .fa-youtube path { color: #c4302b; } .icon-green path{ fill: #45842E; } .icon-blue path{ fill: #3778BA; } .icon-circle-green svg{ height: 2rem; width: 2rem; border-radius: 9999px; border-width: 3px; --tw-border-opacity: 1; border-color: rgb(69 132 46 / var(--tw-border-opacity)); padding: 1.25rem; font-size: 1rem; line-height: 1.5rem; } .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-title { font-size: 32px; } @media screen and (max-width: 76em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 48em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 36em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-title { font-size: 22px; } } @media screen and (max-width: 29.6875em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-title { font-size: 20px; } } .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-content { font-size: 24px; } @media screen and (max-width: 76em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-content { font-size: 22px; } } @media screen and (max-width: 48em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-content { font-size: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-content { font-size: 18px; } } @media screen and (max-width: 29.6875em) { .mci__wrapper-info.icon-circle-green svg .mci__wrapper-info-content { font-size: 16px; } } .mci__wrapper-icons-item-info-title.icon-circle-green svg { font-size: 24px; } @media screen and (max-width: 76em) { .mci__wrapper-icons-item-info-title.icon-circle-green svg { font-size: 22px; } } @media screen and (max-width: 48em) { .mci__wrapper-icons-item-info-title.icon-circle-green svg { font-size: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-icons-item-info-title.icon-circle-green svg { font-size: 18px; } } .icon-gray path{ fill: #757575; } .icon-circle-gray svg{ height: 1.25rem; width: 1.25rem; border-radius: 9999px; border-width: 3px; --tw-border-opacity: 1; border-color: rgb(117 117 117 / var(--tw-border-opacity)); padding: 0.25rem; } /* * ## Hero --------------------------------------------- */ .hero { position: relative; } .hero .hero__bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; -o-object-position: center; object-position: center; z-index: -1; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .hero.has-cards .hero__bg { height: 75%; } @media screen and (max-width: 48em) { .hero.has-cards .hero__bg { height: 100%; } } .hero.no-cards .hero__bg { height: 100%; } .hero.no-cards { padding-block: 50px; } @media screen and (max-width: 36em) { .hero.no-cards { padding-block: 40px; } } .hero.has-cards { padding-block: 75px 0; } @media screen and (max-width: 48em) { .hero.has-cards { padding-block: 50px; } } @media screen and (max-width: 36em) { .hero.has-cards { padding-block: 40px; } } .hero::after { content: none; } .hero.green-blue-gradient { min-height: 470px; } @media screen and (max-width: 76em) { .hero.green-blue-gradient { min-height: 350px; } } @media screen and (max-width: 48em) { .hero.green-blue-gradient { min-height: auto; } } .hero.green-blue-gradient::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.0784313725); z-index: 0; } @media screen and (max-width: 80em) { .hero { height: 100%; margin-bottom: 0; padding-block: 50px; } } @media screen and (max-width: 36em) { .hero { padding-block: 40px; } } .hero__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 60px; font-family: var(--ff-primary); height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; position: relative; z-index: 1; } @media screen and (max-width: 48em) { .hero__wrapper { gap: 40px; height: auto; } } @media screen and (max-width: 36em) { .hero__wrapper { gap: 30px; height: auto; } } .hero__wrapper-content { -webkit-box-flex: 0; -ms-flex: 0 1 auto; flex: 0 1 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 40px; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } @media screen and (max-width: 62.5em) { .hero__wrapper-content { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: auto; } } .hero__wrapper-content-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 35px; } @media screen and (max-width: 76em) { .hero__wrapper-content-inner { gap: 25px; } } @media screen and (max-width: 48em) { .hero__wrapper-content-inner { gap: 20px; } } .hero__wrapper-content-inner-title { font-family: var(--ff-primary); font-weight: 700; color: var(--c-body-bg); } .hero__wrapper-content-inner-title.normal-size { font-size: 48px; line-height: 52px; } @media screen and (max-width: 76em) { .hero__wrapper-content-inner-title.normal-size { font-size: 42px; line-height: 1.1; } } @media screen and (max-width: 48em) { .hero__wrapper-content-inner-title.normal-size { font-size: 36px; } } @media screen and (max-width: 36em) { .hero__wrapper-content-inner-title.normal-size { font-size: 28px; } } .hero__wrapper-content-inner-title.large-size { font-size: 80px; line-height: 88px; } @media screen and (max-width: 76em) { .hero__wrapper-content-inner-title.large-size { font-size: 52px; line-height: 1.1; } } @media screen and (max-width: 48em) { .hero__wrapper-content-inner-title.large-size { font-size: 36px; } } @media screen and (max-width: 36em) { .hero__wrapper-content-inner-title.large-size { font-size: 28px; } } .hero__wrapper-content-inner-subtitle { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; text-transform: uppercase; color: var(--c-body-bg); } .hero__wrapper-content-inner-descriptionText.normal-size * { font-size: 28px; line-height: 1.3; } @media screen and (max-width: 48em) { .hero__wrapper-content-inner-descriptionText.normal-size * { font-size: 24px; } } @media screen and (max-width: 36em) { .hero__wrapper-content-inner-descriptionText.normal-size * { font-size: 20px; } } .hero__wrapper-content-inner-descriptionText.large-size * { font-size: 36px; line-height: 48px; } @media screen and (max-width: 76em) { .hero__wrapper-content-inner-descriptionText.large-size * { font-size: 28px; line-height: 1.3; } } @media screen and (max-width: 48em) { .hero__wrapper-content-inner-descriptionText.large-size * { font-size: 24px; } } @media screen and (max-width: 36em) { .hero__wrapper-content-inner-descriptionText.large-size * { font-size: 20px; } } .hero__wrapper-content-inner-descriptionText * { font-family: var(--ff-primary); font-weight: 300; color: var(--c-body-bg); } .hero__wrapper-content-inner-link.blue-link span { color: var(--c-blue); } .hero__wrapper-content-inner-link.green-link span { color: var(--c-green); } .hero__wrapper-content-image { max-width: 400px; width: 100%; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; -o-object-fit: contain; object-fit: contain; margin-top: 75px; } @media screen and (max-width: 76em) { .hero__wrapper-content-image { max-width: 350px; margin-top: 60px; } } @media screen and (max-width: 62.5em) { .hero__wrapper-content-image { margin-top: 0; } } .hero__wrapper-cards { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 50px; margin-top: 50px; } @media screen and (max-width: 48em) { .hero__wrapper-cards { margin-top: 30px; grid-template-columns: 1fr; gap: 40px; } } @media screen and (max-width: 36em) { .hero__wrapper-cards { margin-top: 20px; gap: 20px; } } .hero__wrapper-cards-card { background-color: var(--c-body-bg); border-radius: 20px; border: 1px solid var(--c-gray); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; overflow: hidden; } @media screen and (max-width: 48em) { .hero__wrapper-cards-card { gap: 20px; } } @media screen and (max-width: 36em) { .hero__wrapper-cards-card { gap: 15px; } } .hero__wrapper-cards-card-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 10px; padding: 25px 25px 0 25px; } @media screen and (max-width: 36em) { .hero__wrapper-cards-card-header { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .hero__wrapper-cards-card-header-title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .hero__wrapper-cards-card-header-title { font-size: 22px; } } @media screen and (max-width: 48em) { .hero__wrapper-cards-card-header-title { font-size: 20px; } } .hero__wrapper-cards-card-header-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 10px; font-family: var(--ff-primary); color: var(--c-blue); font-weight: 400; font-size: 18px; line-height: 24px; -webkit-transition: var(--g-trans); transition: var(--g-trans); overflow: hidden; position: relative; } @media screen and (max-width: 36em) { .hero__wrapper-cards-card-header-link { font-size: 16px; } } .hero__wrapper-cards-card-header-link::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 20px); height: 2px; background-color: var(--c-blue); z-index: 0; -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .hero__wrapper-cards-card-header-link:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .hero__wrapper-cards-card-header-link svg { width: 20px; height: 20px; -ms-flex-negative: 0; flex-shrink: 0; } .hero__wrapper-cards-card-description { padding: 0 25px; height: auto; } @media screen and (max-width: 48em) { .hero__wrapper-cards-card-description { height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } } .hero__wrapper-cards-card-video { border-radius: 20px; aspect-ratio: 16/9; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; overflow: hidden; margin-top: auto; } .hero__wrapper-cards-card .vimeo-facade { position: relative; cursor: pointer; background-color: #000; } .hero__wrapper-cards-card .vimeo-facade__poster, .hero__wrapper-cards-card .vimeo-facade iframe { position: absolute; inset: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border: 0; display: block; } .hero__wrapper-cards-card .vimeo-facade__play { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 64px; height: 64px; border: 0; border-radius: 50%; background: rgba(0, 0, 0, 0.7); color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; cursor: pointer; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .hero__wrapper-cards-card .vimeo-facade__play svg, .hero__wrapper-cards-card .vimeo-facade__play path { fill: #fff !important; color: #fff; } @media screen and (max-width: 36em) { .hero__wrapper-cards-card .vimeo-facade__play { width: 48px; height: 48px; } .hero__wrapper-cards-card .vimeo-facade__play svg { width: 20px; height: 20px; } } .hero__wrapper-cards-card .vimeo-facade:hover .hero__wrapper-cards-card .vimeo-facade__play { background: rgba(0, 0, 0, 0.85); } .hero__wrapper-cards-card iframe { border-radius: 20px; aspect-ratio: 16/9; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; overflow: hidden; margin-top: auto; } /* * ## Timeline --------------------------------------------- */ .timeline { padding-block: 100px; } @media screen and (max-width: 76em) { .timeline { padding-block: 80px; } } @media screen and (max-width: 48em) { .timeline { padding-block: 60px; } } @media screen and (max-width: 36em) { .timeline { padding-block: 40px; } } .timeline__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .timeline__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .timeline__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .timeline__wrapper { gap: 20px; } } .timeline__wrapper-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 20px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } .timeline__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .timeline__wrapper-info-subtitle { font-size: 16px; } } .timeline__wrapper-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 44px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .timeline__wrapper-info-title { font-size: 32px; } } @media screen and (max-width: 48em) { .timeline__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 36em) { .timeline__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .timeline__wrapper-info-title { font-size: 22px; } } .timeline__wrapper-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; color: var(--c-gray-2); line-height: 100%; } @media screen and (max-width: 36em) { .timeline__wrapper-info-content { font-size: 16px; } } .timeline__wrapper-time { position: relative; } .timeline__wrapper-time::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 4px; background-color: var(--c-green); -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 1; } @media screen and (max-width: 48em) { .timeline__wrapper-time::before { left: auto; -webkit-transform: translateX(0); transform: translateX(0); } } .timeline__wrapper-time-item { margin-bottom: 4rem; opacity: 0; -webkit-transform: translateY(80px); transform: translateY(80px); -webkit-transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1); transition: all 0.8s cubic-bezier(0.4, 0, 0.2, 1); } @media screen and (max-width: 76em) { .timeline__wrapper-time-item { margin-bottom: 3rem; } } @media screen and (max-width: 48em) { .timeline__wrapper-time-item { margin-bottom: 2rem; } } .timeline__wrapper-time-item:last-child { margin-bottom: 0; } .timeline__wrapper-time-item.animate-in { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .timeline__wrapper-time-item.animate-in .timeline__spot::before { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } .timeline__wrapper-time-item-section { position: relative; min-height: 100px; } @media screen and (max-width: 76em) { .timeline__wrapper-time-item-section { display: block; min-height: auto; } } .timeline__wrapper-time-item-section .timeline__spot { position: relative; padding: 2.5rem; background-color: var(--c-body-bg); border-radius: 12px; -webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; width: calc(50% - 2rem); text-align: right; } @media screen and (max-width: 76em) { .timeline__wrapper-time-item-section .timeline__spot { padding: 2rem; } } @media screen and (max-width: 48em) { .timeline__wrapper-time-item-section .timeline__spot { width: calc(100% - 2rem); margin-left: 2rem; gap: 10px; text-align: left; } } @media screen and (max-width: 36em) { .timeline__wrapper-time-item-section .timeline__spot { padding: 1.3rem; } } .timeline__wrapper-time-item-section .timeline__spot::before { position: absolute; content: ""; width: 2rem; height: 2rem; background-color: var(--c-green); border-radius: 50%; left: calc(100% + 2rem - 1rem); top: 2.5rem; border: 4px solid var(--c-body-bg); -webkit-box-shadow: 0 0 0 2px var(--c-green); box-shadow: 0 0 0 2px var(--c-green); z-index: 2; opacity: 0; -webkit-transform: scale(0); transform: scale(0); -webkit-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.2s; transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1) 0.2s; } @media screen and (max-width: 48em) { .timeline__wrapper-time-item-section .timeline__spot::before { left: -2.6rem; width: 1.5rem; height: 1.5rem; } } .timeline__wrapper-time-item-section .timeline__spot--right { margin-left: calc(50% + 2rem); text-align: left; } @media screen and (max-width: 76em) { .timeline__wrapper-time-item-section .timeline__spot--right { margin-left: calc(50% + 2rem); } } @media screen and (max-width: 48em) { .timeline__wrapper-time-item-section .timeline__spot--right { margin-left: 2rem; width: calc(100% - 2rem); } } .timeline__wrapper-time-item-section .timeline__spot--right .timeline__link { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .timeline__wrapper-time-item-section .timeline__spot--right::before { left: -3rem; } @media screen and (max-width: 48em) { .timeline__wrapper-time-item-section .timeline__spot--right::before { left: -2.6rem; } } .timeline__wrapper .timeline__date { font-family: var(--ff-primary); font-weight: 400; font-size: 14px; line-height: 20px; color: var(--c-green); text-transform: uppercase; margin-bottom: 5px; } @media screen and (max-width: 36em) { .timeline__wrapper .timeline__date { font-size: 12px; line-height: 16px; } } .timeline__wrapper .timeline__title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 32px; color: var(--c-primary); margin-bottom: 10px; } @media screen and (max-width: 76em) { .timeline__wrapper .timeline__title { font-size: 22px; line-height: 1.3; } } @media screen and (max-width: 36em) { .timeline__wrapper .timeline__title { font-size: 20px; } } .timeline__wrapper .timeline__content { font-family: var(--ff-primary); font-weight: 400; font-size: 16px; line-height: 24px; color: var(--c-gray-2); margin-bottom: 15px; } @media screen and (max-width: 36em) { .timeline__wrapper .timeline__content { font-size: 14px; line-height: 20px; } } .timeline__wrapper .timeline__link { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 0.625rem; font-family: var(--ff-primary); font-weight: 500; font-size: 16px; line-height: 24px; color: var(--c-blue); -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 48em) { .timeline__wrapper .timeline__link { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } } @media screen and (max-width: 36em) { .timeline__wrapper .timeline__link { font-size: 14px; line-height: 20px; } } .timeline__wrapper .timeline__link:hover { color: var(--c-dark-blue); } .timeline__wrapper .timeline__link:hover i { -webkit-transform: translateX(5px); transform: translateX(5px); } .timeline__wrapper .timeline__link i { -webkit-transition: var(--g-trans); transition: var(--g-trans); color: var(--c-blue); } /* * ## Details --------------------------------------------- */ .details__summary{ list-style-type: none; } .details__summary::marker{ display: none; } /* * ## Team member --------------------------------------------- */ .team { padding-block: 100px; } @media screen and (max-width: 76em) { .team { padding-block: 80px; } } @media screen and (max-width: 48em) { .team { padding-block: 60px; } } @media screen and (max-width: 36em) { .team { padding-block: 40px; } } .team__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 80px; } @media screen and (max-width: 76em) { .team__wrapper { gap: 60px; } } @media screen and (max-width: 48em) { .team__wrapper { gap: 40px; } } @media screen and (max-width: 36em) { .team__wrapper { gap: 30px; } } .team__wrapper-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } .team__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .team__wrapper-info-subtitle { font-size: 16px; } } .team__wrapper-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 44px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .team__wrapper-info-title { font-size: 32px; } } @media screen and (max-width: 48em) { .team__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 36em) { .team__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .team__wrapper-info-title { font-size: 22px; } } .team__wrapper-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; color: var(--c-gray-2); line-height: 100%; } @media screen and (max-width: 36em) { .team__wrapper-info-content { font-size: 16px; } } .team__wrapper-members { display: grid; grid-template-columns: repeat(2, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .team__wrapper-members { gap: 40px; } } @media screen and (max-width: 62.5em) { .team__wrapper-members { grid-template-columns: 1fr; } } @media screen and (max-width: 48em) { .team__wrapper-members { gap: 30px; } } @media screen and (max-width: 36em) { .team__wrapper-members { gap: 20px; } } .team__wrapper-members-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: start; gap: 20px; } .team__wrapper-members-item-image { width: 140px; height: 140px; border-radius: 50%; overflow: hidden; background-image: -webkit-gradient(linear, left top, right top, from(var(--c-green)), to(var(--c-green-light))); background-image: linear-gradient(to right, var(--c-green), var(--c-green-light)); padding: 7px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .team__wrapper-members-item-image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; border-radius: 50%; } @media screen and (max-width: 48em) { .team__wrapper-members-item-image { width: 120px; height: 120px; } } @media screen and (max-width: 36em) { .team__wrapper-members-item-image { width: 100px; height: 100px; } } .team__wrapper-members-item-body { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 5px; } .team__wrapper-members-item-body-title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .team__wrapper-members-item-body-title { font-size: 22px; } } @media screen and (max-width: 36em) { .team__wrapper-members-item-body-title { font-size: 20px; } } .team__wrapper-members-item-body-subtitle { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-green); } @media screen and (max-width: 36em) { .team__wrapper-members-item-body-subtitle { font-size: 16px; } } .team__wrapper-members-item-body-readmore { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-blue); margin-top: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 5px; cursor: pointer; } .team__wrapper-members-item-body-readmore:hover { color: var(--c-blue-2); } .team__wrapper-members-item-body-readmore:hover i { color: var(--c-blue-2); } .team__wrapper-members-item-body-readmore i { font-size: 15px; } .team__wrapper-members-item-body .team-member__bio { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-primary); margin-top: 20px; max-height: 0; overflow: hidden; opacity: 0; -webkit-transform: translateY(-10px); transform: translateY(-10px); -webkit-transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1); } @media screen and (max-width: 36em) { .team__wrapper-members-item-body .team-member__bio { font-size: 16px; } } .team__wrapper-members-item-body .team-member__bio.show { max-height: 500px; opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .hidden { display: none; } /* * ## Contact Section --------------------------------------------- */ .contact { padding-block: 100px; } @media screen and (max-width: 76em) { .contact { padding-block: 80px; } } @media screen and (max-width: 48em) { .contact { padding-block: 60px; } } @media screen and (max-width: 36em) { .contact { padding-block: 40px; } } .contact__wrapper { width: 100%; max-width: var(--max-w); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .contact__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .contact__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .contact__wrapper { gap: 20px; } } .contact__wrapper-info { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } .contact__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .contact__wrapper-info-subtitle { font-size: 16px; } } .contact__wrapper-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 36px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .contact__wrapper-info-title { font-size: 32px; } } @media screen and (max-width: 48em) { .contact__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 36em) { .contact__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .contact__wrapper-info-title { font-size: 22px; } } .contact__wrapper-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .contact__wrapper-info-content { font-size: 16px; } } .contact__wrapper-icons { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .contact__wrapper-icons { gap: 40px; } } @media screen and (max-width: 48em) { .contact__wrapper-icons { gap: 30px; } } @media screen and (max-width: 36em) { .contact__wrapper-icons { grid-template-columns: 1fr; gap: 20px; } } .contact__wrapper-icons-item { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 20px; -webkit-box-align: start; -ms-flex-align: start; align-items: start; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } @media screen and (max-width: 36em) { .contact__wrapper-icons-item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } .contact__wrapper-icons-item-icon { width: 80px; aspect-ratio: 1/1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 50%; background: -webkit-gradient(linear, left top, left bottom, from(#45842e), to(#92bf70)); background: linear-gradient(180deg, #45842e 0%, #92bf70 100%); padding: 10px; } @media screen and (max-width: 36em) { .contact__wrapper-icons-item-icon { width: 30px; height: 30px; } } .contact__wrapper-icons-item-icon i { font-size: 28px; } .contact__wrapper-icons-item-icon i path { color: var(--c-body-bg) !important; } .contact__wrapper-icons-item-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .contact__wrapper-icons-item-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 22px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .contact__wrapper-icons-item-info-title { font-size: 22px; } } @media screen and (max-width: 48em) { .contact__wrapper-icons-item-info-title { font-size: 20px; } } @media screen and (max-width: 36em) { .contact__wrapper-icons-item-info-title { font-size: 18px; } } .contact__wrapper-icons-item-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .contact__wrapper-icons-item-info-content { font-size: 16px; } } .contact__wrapper-icons-item-info-link { font-family: var(--ff-primary); font-weight: 700; font-size: 18px; line-height: 100%; -webkit-transition: var(--g-trans); transition: var(--g-trans); color: var(--c-blue); } .contact__wrapper-icons-item-info-link:hover { color: var(--c-blue-2); } @media screen and (max-width: 36em) { .contact__wrapper-icons-item-info-link { font-size: 16px; } } /* * ## Pagination --------------------------------------------- */ .wp-pagenavi .current, .wp-pagenavi .page, .wp-pagenavi .previouspostslink, .wp-pagenavi .nextpostslink{ margin-right: 0.75rem; display: inline-block; border-radius: 0.25rem; border-width: 1px; padding-left: 0.625rem; padding-right: 0.625rem; padding-top: 0.25rem; padding-bottom: 0.25rem; font-size: 1.125rem; line-height: 1.75rem; -webkit-transition-property: all; transition-property: all; -webkit-transition-duration: 300ms; transition-duration: 300ms; -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); } .wp-pagenavi .page, .wp-pagenavi .previouspostslink, .wp-pagenavi .nextpostslink{ --tw-border-opacity: 1; border-color: rgb(117 117 117 / var(--tw-border-opacity)); --tw-text-opacity: 1; color: rgb(117 117 117 / var(--tw-text-opacity)); } .wp-pagenavi .current, .wp-pagenavi .page:hover, .wp-pagenavi .previouspostslink:hover, .wp-pagenavi .nextpostslink:hover{ --tw-border-opacity: 1; border-color: rgb(69 132 46 / var(--tw-border-opacity)); --tw-bg-opacity: 1; background-color: rgb(69 132 46 / var(--tw-bg-opacity)); --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); } .mci__wrapper-info-title.wp-pagenavi .current,.mci__wrapper-info-title .wp-pagenavi .page:hover,.mci__wrapper-info-title .wp-pagenavi .previouspostslink:hover,.mci__wrapper-info-title .wp-pagenavi .nextpostslink:hover { color: var(--c-body-bg); } /* * ## Upcoming Events --------------------------------------------- */ .upcoming-events { padding-block: 100px; position: relative; padding-inline: 40px 0; } @media screen and (max-width: 76em) { .upcoming-events { padding-inline: 30px 0; } } @media screen and (max-width: 48em) { .upcoming-events { padding-inline: 20px 0; } } .upcoming-events.green-dots { background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/green-dots.webp); background-size: cover; } .upcoming-events.green-dots .swiper-header span { color: #bfff59; } .upcoming-events.green-dots .swiper-header img { -webkit-filter: brightness(1) saturate(100%) invert(89%) sepia(100%) saturate(1000%) hue-rotate(60deg) brightness(1.2); filter: brightness(1) saturate(100%) invert(89%) sepia(100%) saturate(1000%) hue-rotate(60deg) brightness(1.2); } .upcoming-events.green-lines { background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/green-lines.webp); background-size: cover; } .upcoming-events.green-lines .swiper-header span { color: #bfff59; } .upcoming-events.green-lines .swiper-header img { -webkit-filter: brightness(1) saturate(100%) invert(89%) sepia(100%) saturate(1000%) hue-rotate(60deg) brightness(1.2); filter: brightness(1) saturate(100%) invert(89%) sepia(100%) saturate(1000%) hue-rotate(60deg) brightness(1.2); } .upcoming-events.blue-dots { background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/blue-dots.webp); background-size: cover; } .upcoming-events.blue-dots .swiper-header span { color: #00d0ff; } .upcoming-events.gray { background-color: #f6f6f7; } .upcoming-events.gray .swiper-slide-content::after { background-color: var(--c-body-bg) !important; border: 1px solid #dee0e2; } .upcoming-events.gray .swiper-header span { color: var(--c-green); } .upcoming-events.gray .swiper-header img { -webkit-filter: brightness(0) saturate(100%) invert(27%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); filter: brightness(0) saturate(100%) invert(27%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); } .upcoming-events.gray .swiper-slide-content-title, .upcoming-events.gray .upcoming-events__wrapper-info-title, .upcoming-events.gray .swiper-slide-content-data-date, .upcoming-events.gray .swiper-slide-content-data-time, .upcoming-events.gray .upcoming-events__wrapper-info-link { color: var(--c-primary) !important; } .upcoming-events.gray .swiper-slide-content-description { color: var(--c-gray-2) !important; } .upcoming-events.gray .upcoming-events__wrapper-info-link::after { background-color: var(--c-primary) !important; } .upcoming-events.gray .upcoming-events__wrapper-info-link img { -webkit-filter: invert(1); filter: invert(1); } .upcoming-events.gray .swiper-button-prev, .upcoming-events.gray .swiper-button-next { border: 2px solid #66686c !important; } .upcoming-events.gray .swiper-button-prev:hover, .upcoming-events.gray .swiper-button-next:hover { background-color: #66686c !important; } .upcoming-events.gray .swiper-button-prev:hover::after, .upcoming-events.gray .swiper-button-next:hover::after { color: var(--c-body-bg) !important; } .upcoming-events.gray .swiper-button-prev::after, .upcoming-events.gray .swiper-button-next::after { color: #66686c !important; } .upcoming-events.gray .btn-register, .upcoming-events.gray .btn-view-event { color: var(--c-blue) !important; } .upcoming-events.gray .btn-register::after, .upcoming-events.gray .btn-view-event::after { background-color: var(--c-blue) !important; } .upcoming-events.gray .btn-register img, .upcoming-events.gray .btn-view-event img { -webkit-filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(1000%) hue-rotate(200deg) brightness(1.2); filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(1000%) hue-rotate(200deg) brightness(1.2); } @media screen and (max-width: 76em) { .upcoming-events { padding-block: 80px; } } @media screen and (max-width: 48em) { .upcoming-events { padding-block: 60px; } } @media screen and (max-width: 36em) { .upcoming-events { padding-block: 40px; } } .upcoming-events__wrapper { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .upcoming-events__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .upcoming-events__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .upcoming-events__wrapper { gap: 20px; } } .upcoming-events__wrapper-info { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 10px; padding-inline: 40px; position: relative; } @media screen and (max-width: 76em) { .upcoming-events__wrapper-info { padding-inline: 30px; } } @media screen and (max-width: 48em) { .upcoming-events__wrapper-info { padding-inline: 0 20px; } } @media screen and (max-width: 36em) { .upcoming-events__wrapper-info { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } .upcoming-events__wrapper-info-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-align: center; text-transform: uppercase; color: var(--c-body-bg); position: absolute; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap; } @media screen and (max-width: 36em) { .upcoming-events__wrapper-info-title { font-size: 16px; position: static; -webkit-transform: none; transform: none; text-align: left; -webkit-box-flex: 1; -ms-flex: auto; flex: auto; } } .upcoming-events__wrapper-info-link { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; color: var(--c-body-bg); position: absolute; right: 40px; overflow-x: hidden; } @media screen and (max-width: 76em) { .upcoming-events__wrapper-info-link { right: 30px; } } @media screen and (max-width: 48em) { .upcoming-events__wrapper-info-link { right: 20px; font-size: 16px; } } @media screen and (max-width: 36em) { .upcoming-events__wrapper-info-link { position: relative; right: auto; } } .upcoming-events__wrapper-info-link::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 30px); height: 2px; background-color: var(--c-body-bg); -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .upcoming-events__wrapper-info-link:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .upcoming-events__wrapper-info-link img { width: 24px; height: 24px; -o-object-fit: contain; object-fit: contain; } .upcoming-events__wrapper .swiper-events { width: 100%; padding-bottom: 100px; } @media screen and (max-width: 76em) { .upcoming-events__wrapper .swiper-events { padding-bottom: 80px; } } @media screen and (max-width: 48em) { .upcoming-events__wrapper .swiper-events { padding-bottom: 60px; } } .upcoming-events__wrapper .swiper-events .swiper-wrapper { width: 100%; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide { height: -webkit-fill-available !important; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content { height: 100%; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; padding: 25px; border-radius: 20px; position: relative; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(19, 50, 81, 0.3215686275); backdrop-filter: blur(6px); opacity: 0.7; z-index: -1; border-radius: 20px; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content .swiper-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; text-transform: uppercase; } @media screen and (max-width: 36em) { .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content .swiper-header { font-size: 16px; } } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content .swiper-header img { width: 20px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-title { font-family: var(--ff-primary); font-weight: 700; font-size: 20px; line-height: 26px; color: var(--c-body-bg); } @media screen and (max-width: 48em) { .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-title { font-size: 18px; } } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-data { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; margin-top: 10px; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-data-date { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-body-bg); } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-data-time { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-body-bg); } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-description { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-top: 10px; } @media screen and (max-width: 36em) { .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-description { font-size: 16px; } } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 10px; margin-top: 50px; } @media screen and (max-width: 76em) { .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions { margin-top: 40px; } } @media screen and (max-width: 48em) { .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions { margin-top: 30px; } } @media screen and (max-width: 36em) { .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions { margin-top: 20px; } } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-register { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); position: relative; overflow-x: hidden; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-register::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 30px); height: 2px; background-color: var(--c-body-bg); -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-register:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-register img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-view-event { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); position: relative; overflow-x: hidden; } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-view-event::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 30px); height: 2px; background-color: var(--c-body-bg); -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-view-event:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .upcoming-events__wrapper .swiper-events .swiper-wrapper .swiper-slide-content-actions .btn-view-event img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } .upcoming-events__wrapper .swiper-events .swiper-button-prev, .upcoming-events__wrapper .swiper-events .swiper-button-next { width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--c-body-bg); top: auto; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .upcoming-events__wrapper .swiper-events .swiper-button-prev::after, .upcoming-events__wrapper .swiper-events .swiper-button-next::after { content: ""; width: 16px; height: 2px; position: relative; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .upcoming-events__wrapper .swiper-events .swiper-button-prev:hover, .upcoming-events__wrapper .swiper-events .swiper-button-next:hover { background-color: var(--c-body-bg); } .upcoming-events__wrapper .swiper-events .swiper-button-prev:hover::after, .upcoming-events__wrapper .swiper-events .swiper-button-next:hover::after { color: var(--c-blue); } .upcoming-events__wrapper .swiper-events .swiper-button-prev { left: 45%; } @media screen and (max-width: 76em) { .upcoming-events__wrapper .swiper-events .swiper-button-prev { left: 40%; } } @media screen and (max-width: 48em) { .upcoming-events__wrapper .swiper-events .swiper-button-prev { left: 35%; } } @media screen and (max-width: 36em) { .upcoming-events__wrapper .swiper-events .swiper-button-prev { left: 30%; } } .upcoming-events__wrapper .swiper-events .swiper-button-prev::after { content: "←"; font-size: 20px; font-weight: bold; color: var(--c-body-bg); background: none; width: auto; height: auto; } .upcoming-events__wrapper .swiper-events .swiper-button-next { right: 45%; } .upcoming-events__wrapper .swiper-events .swiper-button-next::after { content: "→"; font-size: 20px; font-weight: bold; color: var(--c-body-bg); background: none; width: auto; height: auto; } @media screen and (max-width: 76em) { .upcoming-events__wrapper .swiper-events .swiper-button-next { right: 40%; } } @media screen and (max-width: 48em) { .upcoming-events__wrapper .swiper-events .swiper-button-next { right: 35%; } } @media screen and (max-width: 36em) { .upcoming-events__wrapper .swiper-events .swiper-button-next { right: 30%; } } .video { padding-block: 50px; } @media screen and (max-width: 76em) { .video { padding-block: 40px; } } @media screen and (max-width: 48em) { .video { padding-block: 30px; } } .video__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .video__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .video__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .video__wrapper { gap: 20px; } } .video__wrapper-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } @media screen and (max-width: 76em) { .video__wrapper-header { gap: 20px; } } .video__wrapper-header-title { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .video__wrapper-header-title { font-size: 28px; } } @media screen and (max-width: 48em) { .video__wrapper-header-title { font-size: 24px; } } @media screen and (max-width: 36em) { .video__wrapper-header-title { font-size: 22px; } } .video__wrapper-header-content { font-family: Rubik; font-weight: 400; font-style: Regular; font-size: 24px; leading-trim: NONE; line-height: 32px; letter-spacing: 0%; color: var(--c-gray-2); } @media screen and (max-width: 76em) { .video__wrapper-header-content { font-size: 22px; line-height: 30px; } } @media screen and (max-width: 48em) { .video__wrapper-header-content { font-size: 20px; line-height: 28px; } } @media screen and (max-width: 36em) { .video__wrapper-header-content { font-size: 18px; line-height: 26px; } } @media screen and (max-width: 29.6875em) { .video__wrapper-header-content { font-size: 16px; line-height: 24px; } } .video__wrapper .embed-videos { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 40px; width: 100%; } @media screen and (max-width: 48em) { .video__wrapper .embed-videos { grid-template-columns: 1fr; gap: 30px; } } @media screen and (max-width: 36em) { .video__wrapper .embed-videos { gap: 20px; } } .video__wrapper .embed-videos .embed-video { width: 100%; aspect-ratio: 16/9; } .video__wrapper .embed-videos .embed-video iframe { width: 100%; height: 100%; aspect-ratio: 16/9; border-radius: 20px; overflow: hidden; } /* * ## Sticky navbar --------------------------------------------- */ .sticky-nav { position: sticky; top: 78px; /* Default fallback, will be overridden by JavaScript */ background-color: #f6f6f7; border-bottom: 1px solid #dee0e2; z-index: 40; } @media screen and (max-width: 36em) { .sticky-nav { padding-block: 5px; } } .sticky-nav .container { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 !important; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 10px; } @media screen and (max-width: 36em) { .sticky-nav .container { gap: 5px; } } .sticky-nav__items { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -ms-flex-wrap: wrap; flex-wrap: wrap; } .sticky-nav__item { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 25px 20px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); position: relative; overflow: hidden; -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 76em) { .sticky-nav__item { padding: 20px 15px; } } @media screen and (max-width: 48em) { .sticky-nav__item { padding: 15px 10px; } } @media screen and (max-width: 36em) { .sticky-nav__item { font-size: 16px; padding: 10px 7px; } } .sticky-nav__item::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background-color: var(--c-primary); -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .sticky-nav__item:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .sticky-nav .sticky-nav__button { white-space: nowrap; } .sticky-nav .sticky-nav__button:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } /* * ## Breadcrumb --------------------------------------------- */ .breadcrumb { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } .breadcrumb__list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; list-style: none; margin: 0; padding: 0; } .breadcrumb__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .breadcrumb__item:not(:last-child)::after { content: "/"; margin: 0 0.75rem; color: rgba(255, 255, 255, 0.7); font-size: 0.875rem; } .breadcrumb__item--link { color: #ffffff; font-size: 0.75rem; font-weight: 300; text-decoration: none; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .breadcrumb__item--link:hover { color: rgba(255, 255, 255, 0.8); } @media (min-width: 768px) { .breadcrumb__item--link { font-size: 1.125rem; } } .breadcrumb__item--current { color: rgba(255, 255, 255, 0.9); font-size: 0.75rem; font-weight: 400; } @media (min-width: 768px) { .breadcrumb__item--current { font-size: 1.125rem; } } /* * ## Cookie notification --------------------------------------------- */ .cookie-notification{ position: sticky; bottom: 0px; z-index: 50; --tw-bg-opacity: 1; background-color: rgb(117 117 117 / var(--tw-bg-opacity)); padding-top: 1.5rem; padding-bottom: 1.5rem; --tw-shadow: 0px 3px 8px 0px rgba(57,60,63,0.2); --tw-shadow-colored: 0px 3px 8px 0px var(--tw-shadow-color); -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); -webkit-box-shadow: 0 -20px 25px -5px rgba(0, 0, 0, 0.1), 0 -8px 10px -6px rgba(0, 0, 0, 0.1); box-shadow: 0 -20px 25px -5px rgba(0, 0, 0, 0.1), 0 -8px 10px -6px rgba(0, 0, 0, 0.1); } /* * ## Columns Icons --------------------------------------------- */ .column-icons-button-item:hover i, .column-icons-button-item:hover span { color: #3778BA; } .column-icons-button-item:hover svg path { fill: #3778BA; } .text-bullet-left .icon-green { float: left; font-size: 8px; padding-top: 6px; height: 100%; width: 75px; } .text-bullet-left .icon-green svg { text-align: center; margin: 0 auto; width: 50px; } .text-bullet-left .icon-description { padding-left: 75px; } .text-bullet-left .icon-title { padding-left: 75px; } .cta { padding-block: 100px; } .cta.white-bg { background-color: var(--c-body-bg); } .cta.white-bg .cta__wrapper-info-subtitle { color: var(--c-green); } .cta.white-bg .cta__wrapper-info-title, .cta.white-bg .cta__wrapper-info-content { color: var(--c-primary); } .cta.green-bg { background: linear-gradient(101.46deg, #45842e 1.04%, #9acd32 155.28%); } .cta.green-bg .cta__wrapper-info-subtitle, .cta.green-bg .cta__wrapper-info-title, .cta.green-bg .cta__wrapper-info-content { color: var(--c-body-bg); } .cta.green-bg .cta-btn { background-color: var(--c-body-bg) !important; color: var(--c-green) !important; } .cta.green-bg .cta-btn span { color: var(--c-green) !important; } .cta.blue-bg { background: linear-gradient(96.4deg, #2e80d4 0.74%, #009de6 100%); } .cta.blue-bg .cta__wrapper-info-subtitle, .cta.blue-bg .cta__wrapper-info-title, .cta.blue-bg .cta__wrapper-info-content { color: var(--c-body-bg); } .cta.blue-bg .cta-btn { background-color: var(--c-body-bg) !important; color: var(--c-blue) !important; } .cta.blue-bg .cta-btn span { color: var(--c-blue) !important; } @media screen and (max-width: 48em) { .cta { padding-block: 60px; } } @media screen and (max-width: 36em) { .cta { padding-block: 40px; } } .cta__wrapper { max-width: 900px; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; font-family: var(--ff-primary); gap: 50px; } @media screen and (max-width: 76em) { .cta__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .cta__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .cta__wrapper { gap: 20px; } } .cta__wrapper-info { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 48em) { .cta__wrapper-info { gap: 20px; } } @media screen and (max-width: 36em) { .cta__wrapper-info { gap: 15px; } } @media screen and (max-width: 29.6875em) { .cta__wrapper-info { gap: 10px; } } .cta__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-align: center; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .cta__wrapper-info-subtitle { font-size: 16px; } } .cta__wrapper-info-title { font-family: var(--ff-primary); font-weight: 300; font-size: 36px; line-height: 48px; text-align: center; color: var(--c-primary); } @media screen and (max-width: 76em) { .cta__wrapper-info-title { font-size: 32px; line-height: 1.3; } } @media screen and (max-width: 48em) { .cta__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 36em) { .cta__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .cta__wrapper-info-title { font-size: 22px; } } .cta__wrapper-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; text-align: center; } .cta__wrapper-info-content * { line-height: 24px; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .cta__wrapper-info-content * { line-height: 1.3; } .cta__wrapper-info-content { font-size: 16px; } } .cta__wrapper .cta-btn:hover { background-color: var(--c-blue-2); } .cta__wrapper .cta-btn:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .mci { padding-block: 100px; } @media screen and (max-width: 76em) { .mci { padding-block: 80px; } } @media screen and (max-width: 48em) { .mci { padding-block: 60px; } } @media screen and (max-width: 36em) { .mci { padding-block: 40px; } } .mci.mci-gray-bg { background-color: #f6f6f7; } .mci.mci-gray-bg .mci__wrapper-icons-item-icon { background-color: var(--c-green-light); } .mci.mci-gray-bg .mci__wrapper-icons-item-icon img { -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); } .mci.mci-green-bg { background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/green-dots.webp); background-size: cover; } .mci.mci-green-bg .mci__wrapper-info-content { color: var(--c-body-bg); } .mci.mci-green-bg .mci__wrapper-icons-item-icon { background-color: rgba(24, 55, 14, 0.6392156863); } .mci.mci-green-bg .mci__wrapper-icons-item-icon img { -webkit-filter: brightness(1) invert(4) sepia(1) saturate(4) hue-rotate(40deg); filter: brightness(1) invert(4) sepia(1) saturate(4) hue-rotate(40deg); } .mci.mci-blue-bg { background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/blue-dots.webp); background-size: cover; } .mci.mci-blue-bg .mci__wrapper-info-content { color: var(--c-body-bg); } .mci.mci-blue-bg .mci__wrapper-icons-item-icon { background-color: rgba(19, 50, 81, 0.6392156863); } .mci.mci-blue-bg .mci__wrapper-icons-item-icon img { -webkit-filter: brightness(2) invert(1) sepia(2) saturate(38) hue-rotate(180deg); filter: brightness(2) invert(1) sepia(2) saturate(38) hue-rotate(180deg); } .mci__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .mci__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .mci__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .mci__wrapper { gap: 20px; } } .mci__wrapper-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } @media screen and (max-width: 48em) { .mci__wrapper-info { gap: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-info { gap: 15px; } } @media screen and (max-width: 29.6875em) { .mci__wrapper-info { gap: 10px; } } .mci__wrapper-info.text-left { text-align: left; -webkit-box-align: start; -ms-flex-align: start; align-items: start; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .mci__wrapper-info.text-center { text-align: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .mci__wrapper-info.text-sm .mci__wrapper-info-title { font-size: 18px; } .mci__wrapper-info.text-sm .mci__wrapper-info-content { font-size: 18px; } .mci__wrapper-info.text-base .mci__wrapper-info-title { font-size: 32px; } @media screen and (max-width: 76em) { .mci__wrapper-info.text-base .mci__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 48em) { .mci__wrapper-info.text-base .mci__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 36em) { .mci__wrapper-info.text-base .mci__wrapper-info-title { font-size: 22px; } } @media screen and (max-width: 29.6875em) { .mci__wrapper-info.text-base .mci__wrapper-info-title { font-size: 20px; } } .mci__wrapper-info.text-base .mci__wrapper-info-content { font-size: 24px; } @media screen and (max-width: 76em) { .mci__wrapper-info.text-base .mci__wrapper-info-content { font-size: 22px; } } @media screen and (max-width: 48em) { .mci__wrapper-info.text-base .mci__wrapper-info-content { font-size: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-info.text-base .mci__wrapper-info-content { font-size: 18px; } } @media screen and (max-width: 29.6875em) { .mci__wrapper-info.text-base .mci__wrapper-info-content { font-size: 16px; } } .mci__wrapper-info-title { font-weight: 700; line-height: 100%; } .mci__wrapper-info-title.text-white { color: var(--c-body-bg); } .mci__wrapper-info-title.text-green { color: var(--c-green-light); } .mci__wrapper-info-title.text-primary { color: var(--c-primary); } .mci__wrapper-info-title.text-normal { text-transform: math-auto; } .mci__wrapper-info-title.text-uppercase { text-transform: uppercase; } .mci__wrapper-info-content { font-family: var(--ff-primary); font-weight: 400; line-height: 32px; color: var(--c-gray-2); } .mci__wrapper-icons { width: 100%; display: grid; gap: 50px; } .mci__wrapper-icons.grid-cols-3 { grid-template-columns: repeat(3, 1fr); } @media screen and (max-width: 76em) { .mci__wrapper-icons.grid-cols-3 { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 48em) { .mci__wrapper-icons.grid-cols-3 { grid-template-columns: 1fr; gap: 30px; } } @media screen and (max-width: 36em) { .mci__wrapper-icons.grid-cols-3 { grid-template-columns: 1fr; gap: 20px; } } .mci__wrapper-icons.grid-cols-2 { grid-template-columns: repeat(2, 1fr); } @media screen and (max-width: 48em) { .mci__wrapper-icons.grid-cols-2 { grid-template-columns: 1fr; gap: 30px; } } @media screen and (max-width: 36em) { .mci__wrapper-icons.grid-cols-2 { grid-template-columns: 1fr; gap: 20px; } } @media screen and (max-width: 76em) { .mci__wrapper-icons { gap: 40px; } } @media screen and (max-width: 48em) { .mci__wrapper-icons { gap: 30px; } } @media screen and (max-width: 36em) { .mci__wrapper-icons { gap: 20px; } } .mci__wrapper-icons-item { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 15px 25px; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } .mci__wrapper-icons-item.bg-yes { background-color: var(--c-body-bg); border-radius: 16px; border: 1px solid var(--c-gray); padding: 25px; } .mci__wrapper-icons-item.bg-no { background-color: transparent; border-radius: 0; border: 0; padding: 0; } .mci__wrapper-icons-item.column-cards { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .mci__wrapper-icons-item.column-cards.hover-green:hover img { -webkit-filter: brightness(5) invert(2) sepia(42) saturate(16) hue-rotate(67deg) !important; filter: brightness(5) invert(2) sepia(42) saturate(16) hue-rotate(67deg) !important; -webkit-transition: none !important; transition: none !important; } .mci__wrapper-icons-item.column-cards.hover-green:hover .mci__wrapper-icons-item-info-title { color: var(--c-green-light) !important; } .mci__wrapper-icons-item.column-cards.hover-blue:hover img { -webkit-filter: brightness(5) invert(8) sepia(2) saturate(38) hue-rotate(180deg) !important; filter: brightness(5) invert(8) sepia(2) saturate(38) hue-rotate(180deg) !important; -webkit-transition: none !important; transition: none !important; } .mci__wrapper-icons-item.column-cards.hover-blue:hover .mci__wrapper-icons-item-info-title { color: var(--c-blue) !important; } .mci__wrapper-icons-item.row-cards { -webkit-box-align: start; -ms-flex-align: start; align-items: start; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } @media screen and (max-width: 23.4375em) { .mci__wrapper-icons-item.row-cards { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } @media screen and (max-width: 48em) { .mci__wrapper-icons-item { padding: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-icons-item { padding: 15px; } } .mci__wrapper-icons-item img { width: 30px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; opacity: 0; -webkit-transform: translateY(20px) scale(0.8); transform: translateY(20px) scale(0.8); -webkit-transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); } @media screen and (max-width: 48em) { .mci__wrapper-icons-item img { width: 25px; } } .mci__wrapper-icons-item:not(:hover) img { -webkit-transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: opacity 0.6s cubic-bezier(0.4, 0, 0.2, 1), transform 0.6s cubic-bezier(0.4, 0, 0.2, 1), -webkit-transform 0.6s cubic-bezier(0.4, 0, 0.2, 1); } .mci__wrapper-icons-item-icon { width: 70px; height: 70px; border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 48em) { .mci__wrapper-icons-item-icon { width: 60px; height: 60px; } } .mci__wrapper-icons-item-icon i, .mci__wrapper-icons-item-icon svg { width: 30px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 48em) { .mci__wrapper-icons-item-icon i, .mci__wrapper-icons-item-icon svg { width: 25px; } } .mci__wrapper-icons-item-info { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; min-height: auto; } .mci__wrapper-icons-item-info.start-align { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .mci__wrapper-icons-item-info.center-align { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: -webkit-fill-available; } @media screen and (max-width: 48em) { .mci__wrapper-icons-item-info.center-align { height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; } } .mci__wrapper-icons-item-info-title { font-family: var(--ff-primary); line-height: 100%; } .mci__wrapper-icons-item-info-title.text-sm { line-height: 1.2; font-size: 20px; } @media screen and (max-width: 36em) { .mci__wrapper-icons-item-info-title.text-sm { font-size: 18px; } } .mci__wrapper-icons-item-info-title.text-base { font-size: 24px; } @media screen and (max-width: 76em) { .mci__wrapper-icons-item-info-title.text-base { font-size: 22px; } } @media screen and (max-width: 48em) { .mci__wrapper-icons-item-info-title.text-base { font-size: 20px; } } @media screen and (max-width: 36em) { .mci__wrapper-icons-item-info-title.text-base { font-size: 18px; } } .mci__wrapper-icons-item-info-title.text-card-white { color: var(--c-body-bg); } .mci__wrapper-icons-item-info-title.text-card-black { color: var(--c-primary); } .mci__wrapper-icons-item-info-title.text-uppercase { text-transform: uppercase; } .mci__wrapper-icons-item-info-title.text-normal { text-transform: math-auto; } .mci__wrapper-icons-item-info-title.font-semibold { font-weight: 500; } .mci__wrapper-icons-item-info-title.font-normal { font-weight: 400; } @media screen and (max-width: 36em) { .mci__wrapper-icons-item-info-title { font-size: 16px; } } .mci__wrapper-icons-item-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; } .mci__wrapper-icons-item-info-content.text-card-white { color: var(--c-body-bg); } .mci__wrapper-icons-item-info-content.text-card-black { color: var(--c-primary); } .hover-green { -webkit-transition: var(--g-trans); transition: var(--g-trans); } .hover-green:hover { border: 1px solid var(--c-green-light); background-color: rgba(223, 246, 223, 0.16); } .hover-blue { -webkit-transition: var(--g-trans); transition: var(--g-trans); } .hover-blue:hover { border: 1px solid var(--c-blue); background-color: rgba(223, 234, 246, 0.16); } .quote { padding-block: 50px; position: relative; } .quote.green-bg { background: linear-gradient(101.46deg, #45842e 1.04%, #9acd32 155.28%); } .quote.green-bg .quote__wrapper-info-title, .quote.green-bg .quote__wrapper-info-content { color: var(--c-body-bg); } .quote.green-bg .quote__wrapper-info-title *, .quote.green-bg .quote__wrapper-info-content * { color: var(--c-body-bg); } .quote.blue-bg { background: linear-gradient(96.4deg, #2e80d4 0.74%, #009de6 100%); } .quote.blue-bg .quote__wrapper-info-title, .quote.blue-bg .quote__wrapper-info-content { color: var(--c-body-bg); } .quote.blue-bg .quote__wrapper-info-title *, .quote.blue-bg .quote__wrapper-info-content * { color: var(--c-body-bg); } .quote.light-gray-bg { background-color: #f6f6f7; } .quote.light-gray-bg .quote__wrapper-info-title { color: var(--c-green-light); } .quote.light-gray-bg .quote__wrapper-info-content * { color: var(--c-primary); } .quote.white-bg { background-color: var(--c-body-bg); } .quote.white-bg .quote__wrapper-info-title { color: var(--c-green-light); } .quote.white-bg .quote__wrapper-info-content * { color: var(--c-primary); } @media screen and (max-width: 76em) { .quote { padding-block: 40px; } } @media screen and (max-width: 48em) { .quote { padding-block: 30px; } } @media screen and (max-width: 36em) { .quote { padding-block: 20px; } } .quote__wrapper { max-width: var(--max-w-2); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 48em) { .quote__wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 40px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start; } } @media screen and (max-width: 36em) { .quote__wrapper { gap: 25px; } } .quote__wrapper-info { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start; } .quote__wrapper-info-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-body-bg); } @media screen and (max-width: 36em) { .quote__wrapper-info-title { font-size: 16px; } } .quote__wrapper-info-content * { font-family: var(--ff-primary); font-weight: 300; font-size: 30px; line-height: 1.2; } @media screen and (max-width: 76em) { .quote__wrapper-info-content * { font-size: 24px; } } @media screen and (max-width: 48em) { .quote__wrapper-info-content * { font-size: 22px; } } @media screen and (max-width: 36em) { .quote__wrapper-info-content * { font-size: 20px; } } @media screen and (max-width: 29.6875em) { .quote__wrapper-info-content * { font-size: 18px; } } @media screen and (max-width: 21.875em) { .quote__wrapper-info-content * { font-size: 16px; } } .quote__wrapper-info-content b, .quote__wrapper-info-content strong { font-weight: 500; } .quote__wrapper-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-size: 18px; } @media screen and (max-width: 36em) { .quote__wrapper-link { font-size: 16px; } } .quote__wrapper-link:hover img { -webkit-transform: translateX(10px); transform: translateX(10px); } .quote__wrapper-link img { width: 24px; height: 24px; -o-object-fit: contain; object-fit: contain; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .multi-column-logo { padding-inline: 0 !important; padding-block: 100px; } @media screen and (max-width: 76em) { .multi-column-logo { padding-block: 80px; } } @media screen and (max-width: 48em) { .multi-column-logo { padding-block: 60px; } } @media screen and (max-width: 36em) { .multi-column-logo { padding-block: 40px; } } .multi-column-logo__wrapper { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .multi-column-logo__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .multi-column-logo__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .multi-column-logo__wrapper { gap: 20px; } } .multi-column-logo__wrapper-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-align: center; text-transform: uppercase; color: var(--c-green-light); } @media screen and (max-width: 48em) { .multi-column-logo__wrapper-title { font-size: 16px; padding-inline: 20px; } } .multi-column-logo__wrapper .swiper { width: 100%; } .multi-column-logo__wrapper .swiper .swiper-wrapper { width: 100%; } .multi-column-logo__wrapper .swiper .swiper-wrapper .swiper-slide { width: 100%; height: 100px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .multi-column-logo__wrapper .swiper .swiper-wrapper .swiper-slide img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .multi-column-logo__wrapper-logos { max-width: var(--max-w); width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; padding-inline: 40px; } @media screen and (max-width: 76em) { .multi-column-logo__wrapper-logos { grid-template-columns: repeat(2, 1fr); gap: 40px; padding-inline: 30px; } } @media screen and (max-width: 48em) { .multi-column-logo__wrapper-logos { grid-template-columns: 1fr; gap: 30px; padding-inline: 20px; } } .multi-column-logo__wrapper-logos-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; padding: 25px; border-radius: 20px; border: 1px solid var(--c-gray); } .multi-column-logo__wrapper-logos-item-image { width: 100%; height: 150px; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 36em) { .multi-column-logo__wrapper-logos-item-image { height: 120px; } } .multi-column-logo__wrapper-logos-item-title { font-family: var(--ff-primary); font-weight: 500; font-size: 20px; line-height: 100%; text-transform: uppercase; color: var(--c-primary); } @media screen and (max-width: 36em) { .multi-column-logo__wrapper-logos-item-title { font-size: 18px; } } .multi-column-logo__wrapper-logos-item-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .multi-column-logo__wrapper-logos-item-content { font-size: 16px; line-height: 22px; } } .multi-column-logo__wrapper-logos-item-content a { margin-top: 12px; } .multi-column-logo__wrapper-logos-item-content a:hover { background-color: var(--c-blue-2) !important; } .multi-column-logo__wrapper-logos-item-content a:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .multi-column-logo__wrapper-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-blue); position: relative; overflow-x: hidden; text-align: center; } @media screen and (max-width: 48em) { .multi-column-logo__wrapper-link { padding-inline: 20px; } } .multi-column-logo__wrapper-link::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 30px); height: 2px; background-color: var(--c-blue); -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .multi-column-logo__wrapper-link:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .multi-column-logo__wrapper-link img { width: 20px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } .testimonial { position: relative; padding-block: 50px; overflow-x: hidden; padding-left: 120px; margin-bottom: 100px; } .testimonial.pt { margin-top: 100px; } @media screen and (max-width: 76em) { .testimonial.pt { margin-top: 80px; } } @media screen and (max-width: 48em) { .testimonial.pt { margin-top: 60px; } } @media screen and (max-width: 36em) { .testimonial.pt { margin-top: 40px; } } @media screen and (max-width: 76em) { .testimonial { padding-left: 80px; margin-bottom: 80px; } } @media screen and (max-width: 48em) { .testimonial { padding-block: 40px; padding-left: 60px; margin-bottom: 60px; } } @media screen and (max-width: 36em) { .testimonial { padding-left: 40px; margin-bottom: 40px; } } .testimonial.blue-bg::after { background: linear-gradient(96.4deg, #2e80d4 0.74%, #009de6 100%); } .testimonial.green-bg::after { background: linear-gradient(102.37deg, #45842e 1.09%, #9acd32 151.67%); } .testimonial::after { content: ""; width: calc(100vw - (100vw - var(--max-w)) / 2); height: 100%; background-size: cover; position: absolute; top: 0; left: calc((100vw - var(--max-w)) / 2); border-radius: 20px 0 0 20px; z-index: -1; } @media screen and (max-width: 81.25em) { .testimonial::after { width: 97vw; left: 3vw; } } .testimonial__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: relative; z-index: 1; padding-left: 65px; gap: 25px; } @media screen and (max-width: 76em) { .testimonial__wrapper { padding-left: 50px; } } @media screen and (max-width: 48em) { .testimonial__wrapper { padding-left: 40px; } } @media screen and (max-width: 36em) { .testimonial__wrapper { gap: 20px; padding-left: 30px; } } .testimonial__wrapper-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-align: center; text-transform: uppercase; color: var(--c-body-bg); } @media screen and (max-width: 36em) { .testimonial__wrapper-title { font-size: 16px; text-align: left; } } .testimonial__wrapper-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start; } @media screen and (max-width: 36em) { .testimonial__wrapper-content { gap: 20px; } } .testimonial__wrapper-content-quote { position: relative; } .testimonial__wrapper-content-quote .icon-quote { position: absolute; top: -5px; left: -50px; width: 40px; height: 40px; } @media screen and (max-width: 48em) { .testimonial__wrapper-content-quote .icon-quote { width: 30px; height: 30px; left: -40px; } } .testimonial__wrapper-content-quote * { font-family: var(--ff-primary); font-weight: 300; font-size: 30px; line-height: 1.3; color: var(--c-body-bg); } @media screen and (max-width: 76em) { .testimonial__wrapper-content-quote * { font-size: 24px; } } @media screen and (max-width: 48em) { .testimonial__wrapper-content-quote * { font-size: 22px; } } @media screen and (max-width: 36em) { .testimonial__wrapper-content-quote * { font-size: 20px; } } @media screen and (max-width: 29.6875em) { .testimonial__wrapper-content-quote * { font-size: 18px; } } @media screen and (max-width: 21.875em) { .testimonial__wrapper-content-quote * { font-size: 16px; } } .testimonial__wrapper-content-author { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } @media screen and (max-width: 48em) { .testimonial__wrapper-content-author { gap: 5px; } } .testimonial__wrapper-content-author-name { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-body-bg); } @media screen and (max-width: 36em) { .testimonial__wrapper-content-author-name { font-size: 16px; } } .testimonial__wrapper-content-author-position { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); } @media screen and (max-width: 36em) { .testimonial__wrapper-content-author-position { font-size: 16px; } } .counters { padding-block: 100px; background-color: #f6f6f7; } @media screen and (max-width: 76em) { .counters { padding-block: 80px; } } @media screen and (max-width: 48em) { .counters { padding-block: 60px; } } @media screen and (max-width: 36em) { .counters { padding-block: 40px; } } .counters__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 60px; } @media screen and (max-width: 76em) { .counters__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .counters__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .counters__wrapper { gap: 20px; } } .counters__wrapper-title { max-width: 800px; font-family: var(--ff-primary); font-weight: 300; font-size: 36px; line-height: 48px; text-align: center; color: var(--c-primary); } @media screen and (max-width: 76em) { .counters__wrapper-title { font-size: 32px; line-height: 1.3; } } @media screen and (max-width: 48em) { .counters__wrapper-title { font-size: 28px; } } @media screen and (max-width: 36em) { .counters__wrapper-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .counters__wrapper-title { font-size: 22px; } } @media screen and (max-width: 21.875em) { .counters__wrapper-title { font-size: 20px; } } .counters__wrapper-items { width: 100%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .counters__wrapper-items { grid-template-columns: repeat(3, 1fr); gap: 40px; } } @media screen and (max-width: 48em) { .counters__wrapper-items { grid-template-columns: repeat(2, 1fr); gap: 30px; } } @media screen and (max-width: 36em) { .counters__wrapper-items { grid-template-columns: 1fr; } } .counters__wrapper-items-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .counters__wrapper-items-item-title { font-family: var(--ff-primary); font-weight: 700; font-size: 48px; line-height: 52px; text-align: center; color: var(--c-green-light); max-width: 250px; width: 100%; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; display: inline-block; } @media screen and (max-width: 76em) { .counters__wrapper-items-item-title { font-size: 40px; line-height: 1.3; max-width: 200px; } } @media screen and (max-width: 48em) { .counters__wrapper-items-item-title { font-size: 32px; } } .counters__wrapper-items-item-subtitle { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; text-align: center; } .full-image img { width: 100%; height: auto; } .mcb { padding-block: 50px 100px; } @media screen and (max-width: 76em) { .mcb { padding-block: 50px 80px; } } @media screen and (max-width: 48em) { .mcb { padding-block: 50px 60px; } } @media screen and (max-width: 36em) { .mcb { padding-block: 40px; } } .mcb__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .mcb__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .mcb__wrapper { gap: 30px; } } .mcb__wrapper-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 20px; } .mcb__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .mcb__wrapper-info-subtitle { font-size: 16px; } } .mcb__wrapper-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .mcb__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 48em) { .mcb__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 36em) { .mcb__wrapper-info-title { font-size: 22px; } } .mcb__wrapper-bullets { display: grid; width: 100%; gap: 50px; } @media screen and (max-width: 76em) { .mcb__wrapper-bullets { gap: 40px; } } @media screen and (max-width: 48em) { .mcb__wrapper-bullets { gap: 30px; } } @media screen and (max-width: 36em) { .mcb__wrapper-bullets { gap: 20px; } } .mcb__wrapper-bullets.grid-cols-2 { grid-template-columns: repeat(2, 1fr); } @media screen and (max-width: 48em) { .mcb__wrapper-bullets.grid-cols-2 { grid-template-columns: 1fr; } } .mcb__wrapper-bullets.grid-cols-3 { grid-template-columns: repeat(3, 1fr); } @media screen and (max-width: 76em) { .mcb__wrapper-bullets.grid-cols-3 { grid-template-columns: repeat(2, 1fr); } } @media screen and (max-width: 48em) { .mcb__wrapper-bullets.grid-cols-3 { grid-template-columns: 1fr; } } .mcb__wrapper-bullets img { width: 24px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } .mcb__wrapper-bullets-bullet { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: start; gap: 15px; } @media screen and (max-width: 36em) { .mcb__wrapper-bullets-bullet { gap: 10px; } } .mcb__wrapper-bullets-bullet-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 5px; } .mcb__wrapper-bullets-bullet-info-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-primary); } @media screen and (max-width: 36em) { .mcb__wrapper-bullets-bullet-info-title { font-size: 16px; } } .mcb__wrapper-bullets-bullet-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .mcb__wrapper-bullets-bullet-info-content { font-size: 16px; line-height: 22px; } } .pricingTable { padding-block: 50px 100px; } @media screen and (max-width: 76em) { .pricingTable { padding-block: 50px 80px; } } @media screen and (max-width: 48em) { .pricingTable { padding-block: 50px 60px; } } @media screen and (max-width: 36em) { .pricingTable { padding-block: 40px; } } .pricingTable__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .pricingTable__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .pricingTable__wrapper { gap: 30px; } } .pricingTable__wrapper-title { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .pricingTable__wrapper-title { font-size: 28px; } } @media screen and (max-width: 48em) { .pricingTable__wrapper-title { font-size: 24px; } } @media screen and (max-width: 36em) { .pricingTable__wrapper-title { font-size: 22px; } } .pricingTable__wrapper-tables { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .pricingTable__wrapper-tables { grid-template-columns: repeat(2, 1fr); gap: 40px; } } @media screen and (max-width: 48em) { .pricingTable__wrapper-tables { grid-template-columns: 1fr; gap: 30px; } } .pricingTable__wrapper-tables-table { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; padding: 25px; border-radius: 24px; background-color: rgba(67, 146, 224, 0.0784313725); border: 1px solid rgba(67, 146, 224, 0.1607843137); } .pricingTable__wrapper-tables-table-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .pricingTable__wrapper-tables-table-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: #081c31; } @media screen and (max-width: 76em) { .pricingTable__wrapper-tables-table-info-title { fot-size: 22px; } } @media screen and (max-width: 48em) { .pricingTable__wrapper-tables-table-info-title { font-size: 20px; } } .pricingTable__wrapper-tables-table-info-icon { width: 46px; aspect-ratio: 1/1; border-radius: 50%; background-color: #081c31; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media screen and (max-width: 76em) { .pricingTable__wrapper-tables-table-info-icon { width: 40px; } } @media screen and (max-width: 48em) { .pricingTable__wrapper-tables-table-info-icon { width: 36px; } } .pricingTable__wrapper-tables-table-info-icon img { width: 24px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; opacity: 0; -webkit-transform: translateY(20px) scale(0.8); transform: translateY(20px) scale(0.8); -webkit-transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1); transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1); } @media screen and (max-width: 76em) { .pricingTable__wrapper-tables-table-info-icon img { width: 22px; } } @media screen and (max-width: 48em) { .pricingTable__wrapper-tables-table-info-icon img { width: 20px; } } .pricingTable__wrapper-tables-table-pricing { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 7px; } .pricingTable__wrapper-tables-table-pricing-label { font-family: var(--ff-primary); font-weight: 400; font-size: 16px; line-height: 100%; color: #081c31; } .pricingTable__wrapper-tables-table-pricing-data { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 7px; } .pricingTable__wrapper-tables-table-pricing-data-number { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; color: #081c31; } @media screen and (max-width: 76em) { .pricingTable__wrapper-tables-table-pricing-data-number { font-size: 28px; } } @media screen and (max-width: 48em) { .pricingTable__wrapper-tables-table-pricing-data-number { font-size: 24px; } } .pricingTable__wrapper-tables-table-pricing-data-frequency { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: #081c31; } @media screen and (max-width: 36em) { .pricingTable__wrapper-tables-table-pricing-data-frequency { font-size: 16px; line-height: 22px; } } .pricingTable__wrapper-tables-table-link { margin-top: 10px; text-align: center; } .pricingTable__wrapper-tables-table-link:hover { background-color: var(--c-blue-2); } .pricingTable__wrapper-tables-table-link:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .pricingTable__wrapper-tables-table-features { margin-top: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; } .pricingTable__wrapper-tables-table-features-title { font-family: var(--ff-primary); font-weight: 500; font-size: 16px; line-height: 100%; } .pricingTable__wrapper-tables-table-features-content * { font-family: var(--ff-primary); font-weight: 400; font-size: 16px; color: #081c31; line-height: 100%; } .pricingTable__wrapper-tables-table-features-content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; padding-left: 30px; } .pricingTable__wrapper-tables-table-features-content ul li { position: relative; line-height: 1.4; } .pricingTable__wrapper-tables-table-features-content ul li::before { content: ""; width: 20px; height: 20px; position: absolute; left: -30px; border-radius: 50%; top: -2px; background: url(https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/check-list.svg) no-repeat center center; } .pricingTable__wrapper-disclaimer { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; text-align: center; color: var(--c-primary); } @media screen and (max-width: 36em) { .pricingTable__wrapper-disclaimer { font-size: 16px; line-height: 22px; } } .mcc { background-color: #f6f6f7; padding-block: 100px; } @media screen and (max-width: 76em) { .mcc { padding-block: 80px; } } @media screen and (max-width: 48em) { .mcc { padding-block: 60px; } } @media screen and (max-width: 36em) { .mcc { padding-block: 40px; } } .mcc__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .mcc__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .mcc__wrapper { gap: 30px; } } .mcc__wrapper-title { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; text-align: center; color: var(--c-primary); } @media screen and (max-width: 76em) { .mcc__wrapper-title { font-size: 28px; } } @media screen and (max-width: 48em) { .mcc__wrapper-title { font-size: 24px; } } @media screen and (max-width: 36em) { .mcc__wrapper-title { font-size: 22px; } } .mcc__wrapper-cards { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .mcc__wrapper-cards { grid-template-columns: repeat(2, 1fr); gap: 40px; } } @media screen and (max-width: 48em) { .mcc__wrapper-cards { grid-template-columns: 1fr; gap: 30px; } } @media screen and (max-width: 36em) { .mcc__wrapper-cards { gap: 20px; } } .mcc__wrapper-cards-card { padding: 25px; border-radius: 24px; background-color: var(--c-body-bg); border: 1px solid #dee0e2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } @media screen and (max-width: 76em) { .mcc__wrapper-cards-card { gap: 20px; } } @media screen and (max-width: 48em) { .mcc__wrapper-cards-card { gap: 15px; } } .mcc__wrapper-cards-card-title { font-family: var(--ff-primary); font-weight: 700; font-size: 20px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .mcc__wrapper-cards-card-title { font-size: 18px; } } .mcc__wrapper-cards-card-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; color: var(--c-primary); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } @media screen and (max-width: 76em) { .mcc__wrapper-cards-card-content { gap: 20px; } } @media screen and (max-width: 48em) { .mcc__wrapper-cards-card-content { gap: 15px; } } .mcc__wrapper-cards-card-content a { text-decoration: underline; } .mcc__wrapper-cards-card-content * { line-height: 24px; } .mcc__wrapper-disclaimer { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; text-align: center; color: var(--c-primary); } .mcc__wrapper-disclaimer a { text-decoration: underline; } .mcc__wrapper-disclaimer a:hover { color: var(--c-gray-2); } @media screen and (max-width: 36em) { .mcc__wrapper-disclaimer { font-size: 16px; line-height: 22px; } } .socialMedia { padding-block: 100px; background-color: var(--c-gray-3); } @media screen and (max-width: 76em) { .socialMedia { padding-block: 80px; } } @media screen and (max-width: 48em) { .socialMedia { padding-block: 60px; } } @media screen and (max-width: 36em) { .socialMedia { padding-block: 40px; } } .socialMedia__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .socialMedia__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .socialMedia__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .socialMedia__wrapper { gap: 20px; } } .socialMedia__wrapper-info { width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .socialMedia__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .socialMedia__wrapper-info-subtitle { font-size: 16px; } } .socialMedia__wrapper-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 44px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .socialMedia__wrapper-info-title { font-size: 32px; } } @media screen and (max-width: 48em) { .socialMedia__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 36em) { .socialMedia__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .socialMedia__wrapper-info-title { font-size: 22px; } } .socialMedia__wrapper-social-media { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: start; -ms-flex-align: start; align-items: start; gap: 40px; } @media screen and (max-width: 76em) { .socialMedia__wrapper-social-media { -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 30px; } } @media screen and (max-width: 48em) { .socialMedia__wrapper-social-media { gap: 20px; } } .socialMedia__wrapper-social-media-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; max-width: 300px; width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .socialMedia__wrapper-social-media-item:hover i, .socialMedia__wrapper-social-media-item:hover a { opacity: 0.9; } .socialMedia__wrapper-social-media-item i { font-size: 12px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .socialMedia__wrapper-social-media-item a { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 1.3; color: var(--c-gray-2); text-decoration: none; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .internal-topbar { margin-top: 0; border-bottom: 1px solid var(--c-gray-3); } .internal-topbar .container { max-width: var(--max-w); width: 100%; margin: 0 auto; padding: 0 1rem; } @media screen and (max-width: 76em) { .internal-topbar .container { padding: 0 2rem; } } .internal-topbar nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 0; } @media screen and (max-width: 76em) { .internal-topbar nav ul { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } } .internal-topbar nav ul li { position: relative; overflow: hidden; } .internal-topbar nav ul li::after { content: ""; position: absolute; bottom: 0; left: 5%; width: 90%; height: 4px; background-color: var(--c-blue); -webkit-transform: translateX(-110%); transform: translateX(-110%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .internal-topbar nav ul li:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .internal-topbar nav ul li a { display: inline-block; padding: 1.5rem; color: var(--c-gray-2); text-decoration: none; -webkit-transition: var(--g-trans); transition: var(--g-trans); border-bottom: 4px solid transparent; } .internal-topbar nav ul li a:hover { color: var(--c-blue); } .internal-topbar nav ul li a.active { color: var(--c-blue); font-weight: 500; border-bottom-color: var(--c-blue); } .careers { padding-block: 100px; } @media screen and (max-width: 76em) { .careers { padding-block: 80px; } } @media screen and (max-width: 48em) { .careers { padding-block: 60px; } } @media screen and (max-width: 36em) { .careers { padding-block: 40px; } } .careers__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .careers__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .careers__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .careers__wrapper { gap: 20px; } } .careers__wrapper-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } .careers__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .careers__wrapper-info-subtitle { font-size: 16px; } } .careers__wrapper-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 36px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .careers__wrapper-info-title { font-size: 32px; } } @media screen and (max-width: 48em) { .careers__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 36em) { .careers__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .careers__wrapper-info-title { font-size: 22px; } } .careers__wrapper-info-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .careers__wrapper-info-content { font-size: 16px; } } .careers__wrapper-careers { width: 100%; display: grid; grid-template-columns: 1fr; gap: 50px; } @media screen and (max-width: 76em) { .careers__wrapper-careers { gap: 40px; } } @media screen and (max-width: 48em) { .careers__wrapper-careers { gap: 30px; } } @media screen and (max-width: 36em) { .careers__wrapper-careers { gap: 20px; } } .careers__wrapper-careers-card { padding: 25px; border-radius: 24px; background-color: var(--c-body-bg); border: 1px solid #dee0e2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; } .careers__wrapper-careers-card-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .careers__wrapper-careers-card-subtitle { font-size: 16px; } } .careers__wrapper-careers-card-title { font-family: var(--ff-primary); font-weight: 700; font-size: 28px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .careers__wrapper-careers-card-title { font-size: 24px; } } @media screen and (max-width: 48em) { .careers__wrapper-careers-card-title { font-size: 22px; } } .careers__wrapper-careers-card-location { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-gray-2); } .careers__wrapper-careers-card-location i { color: var(--c-gray-2); margin-right: 5px; } @media screen and (max-width: 36em) { .careers__wrapper-careers-card-location { font-size: 16px; } } .careers__wrapper-careers-card-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 1.4; color: var(--c-primary); margin-top: 10px; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; } @media screen and (max-width: 36em) { .careers__wrapper-careers-card-content { font-size: 16px; } } .careers__wrapper-careers-card-apply { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; margin-top: 10px; text-transform: math-auto; } .careers__wrapper-careers-card-apply:hover { background-color: var(--c-blue-2); } .careers__wrapper-careers-card-apply:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .request-demo { padding-block: 100px; } @media screen and (max-width: 76em) { .request-demo { padding-block: 80px; } } @media screen and (max-width: 48em) { .request-demo { padding-block: 60px; } } @media screen and (max-width: 36em) { .request-demo { padding-block: 40px; } } .request-demo__wrapper { width: 100%; max-width: var(--max-w); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .request-demo__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .request-demo__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .request-demo__wrapper { gap: 20px; } } .request-demo__wrapper-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .request-demo__wrapper-info-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .request-demo__wrapper-info-subtitle { font-size: 16px; } } .request-demo__wrapper-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 36px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .request-demo__wrapper-info-title { font-size: 32px; } } @media screen and (max-width: 48em) { .request-demo__wrapper-info-title { font-size: 28px; } } @media screen and (max-width: 36em) { .request-demo__wrapper-info-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .request-demo__wrapper-info-title { font-size: 22px; } } .request-demo__wrapper-ctas-item-card { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .request-demo__wrapper-ctas-item-card { gap: 40px; } } @media screen and (max-width: 48em) { .request-demo__wrapper-ctas-item-card { gap: 30px; } } @media screen and (max-width: 36em) { .request-demo__wrapper-ctas-item-card { gap: 20px; } } .request-demo__wrapper-ctas-item-card-title { font-family: var(--ff-primary); font-weight: 700; font-size: 28px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .request-demo__wrapper-ctas-item-card-title { font-size: 24px; } } @media screen and (max-width: 48em) { .request-demo__wrapper-ctas-item-card-title { font-size: 20px; } } @media screen and (max-width: 36em) { .request-demo__wrapper-ctas-item-card-title { font-size: 18px; } } .request-demo__wrapper-ctas-item-card-items { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .request-demo__wrapper-ctas-item-card-items { gap: 40px; } } @media screen and (max-width: 48em) { .request-demo__wrapper-ctas-item-card-items { gap: 30px; grid-template-columns: 1fr; } } @media screen and (max-width: 36em) { .request-demo__wrapper-ctas-item-card-items { gap: 20px; } } .request-demo__wrapper-ctas-item-card-items-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 20px; padding: 30px 25px; border: 2px solid var(--c-gray-3); border-radius: 20px; } @media screen and (max-width: 48em) { .request-demo__wrapper-ctas-item-card-items-item { gap: 15px; padding: 25px; } } @media screen and (max-width: 36em) { .request-demo__wrapper-ctas-item-card-items-item { gap: 10px; padding: 25px 20px; } } .request-demo__wrapper-ctas-item-card-items-item-title { font-family: var(--ff-primary); font-weight: 700; font-size: 20px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 36em) { .request-demo__wrapper-ctas-item-card-items-item-title { font-size: 18px; } } .request-demo__wrapper-ctas-item-card-items-item-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .request-demo__wrapper-ctas-item-card-items-item-content { font-size: 16px; } } .request-demo__wrapper-ctas-item-card-items-item-button { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } .request-demo__wrapper-ctas-item-card-items-item-button:hover { background-color: var(--c-blue-2); } .request-demo__wrapper-ctas-item-card-items-item-button:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .resources { padding-block: 100px; background-color: #f6f6f6; } @media screen and (max-width: 76em) { .resources { padding-block: 80px; } } @media screen and (max-width: 48em) { .resources { padding-block: 60px; } } @media screen and (max-width: 36em) { .resources { padding-block: 40px; } } .resources__wrapper { width: 100%; max-width: var(--max-w); display: grid; grid-template-columns: repeat(4, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .resources__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .resources__wrapper { grid-template-columns: 1fr; gap: 30px; } } @media screen and (max-width: 36em) { .resources__wrapper { gap: 20px; } } .resources__wrapper-nav { grid-column: span 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start; text-align: left; } .resources__wrapper-nav-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } .resources__wrapper-nav-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; gap: 5px; } .resources__wrapper-nav-list li { width: 100%; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; padding: 15px; border-radius: 12px; font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .resources__wrapper-nav-list li a { display: block; color: var(--c-primary); width: 100%; height: 100%; } .resources__wrapper-nav-list li:not(.active):hover { background-color: #dee0e2; } .resources__wrapper-nav-list .active { background-color: #dee0e2; } .resources__wrapper-feed { grid-column: span 3; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 40px; } @media screen and (max-width: 76em) { .resources__wrapper-feed { gap: 30px; } } @media screen and (max-width: 48em) { .resources__wrapper-feed { grid-column: span 1; } } @media screen and (max-width: 36em) { .resources__wrapper-feed { gap: 20px; } } .resources__wrapper-feed-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } @media screen and (max-width: 48em) { .resources__wrapper-feed-info { gap: 15px; } } @media screen and (max-width: 36em) { .resources__wrapper-feed-info { gap: 10px; } } .resources__wrapper-feed-info-term { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; color: var(--c-green); } .resources__wrapper-feed-info-term i { font-size: 18px; } .resources__wrapper-feed-info-term i * { color: var(--c-green) !important; } @media screen and (max-width: 36em) { .resources__wrapper-feed-info-term { font-size: 16px; } } .resources__wrapper-feed-info-title { font-family: var(--ff-primary); font-weight: 700; font-size: 48px; line-height: 52px; color: var(--c-primary); } @media screen and (max-width: 76em) { .resources__wrapper-feed-info-title { font-size: 42px; line-height: 1.3; } } @media screen and (max-width: 48em) { .resources__wrapper-feed-info-title { font-size: 32px; line-height: 1.3; } } @media screen and (max-width: 36em) { .resources__wrapper-feed-info-title { font-size: 28px; } } @media screen and (max-width: 29.6875em) { .resources__wrapper-feed-info-title { font-size: 22px; } } .resources__wrapper-feed-info-subtitle { font-family: var(--ff-primary); font-weight: 300; font-size: 28px; line-height: 36px; color: var(--c-gray-2); text-transform: math-auto; } @media screen and (max-width: 76em) { .resources__wrapper-feed-info-subtitle { font-size: 24px; line-height: 1.3; } } @media screen and (max-width: 48em) { .resources__wrapper-feed-info-subtitle { font-size: 20px; } } @media screen and (max-width: 36em) { .resources__wrapper-feed-info-subtitle { font-size: 18px; } } .resources__wrapper-feed-tags-list { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .resources__wrapper-feed-tags-list li { font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; letter-spacing: 0%; padding: 8px 16px; border-radius: 25px; border: 1px solid var(--c-green); -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 36em) { .resources__wrapper-feed-tags-list li { font-size: 16px; } } .resources__wrapper-feed-tags-list li:hover { background-color: var(--c-green); } .resources__wrapper-feed-tags-list li:hover a { color: var(--c-body-bg); } .resources__wrapper-feed-tags-list li:hover button { color: var(--c-body-bg); } .resources__wrapper-feed-tags-list li a { color: var(--c-green); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .resources__wrapper-feed-tags-list li button { background: none; border: none; font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; letter-spacing: 0%; color: var(--c-green); cursor: pointer; padding: 0; width: 100%; text-align: left; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .resources__wrapper-feed-tags-list li.active { background-color: var(--c-green); } .resources__wrapper-feed-tags-list li.active a { color: var(--c-body-bg); } .resources__wrapper-feed-tags-list li.active button { color: var(--c-body-bg); } .resources__wrapper-feed-posts { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .resources__wrapper-feed-posts { gap: 40px; } } @media screen and (max-width: 48em) { .resources__wrapper-feed-posts { gap: 30px; } } @media screen and (max-width: 36em) { .resources__wrapper-feed-posts { gap: 20px; } } .resources__wrapper-feed-posts-card { padding: 25px; border-radius: 20px; border: 1px solid var(--c-gray-3); background-color: var(--c-body-bg); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; } .resources__wrapper-feed-posts-card-title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 1.2; color: var(--c-primary); } @media screen and (max-width: 48em) { .resources__wrapper-feed-posts-card-title { font-size: 20px; } } @media screen and (max-width: 36em) { .resources__wrapper-feed-posts-card-title { font-size: 18px; } } .resources__wrapper-feed-posts-card-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .resources__wrapper-feed-posts-card-info-text { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-green); text-transform: uppercase; } @media screen and (max-width: 48em) { .resources__wrapper-feed-posts-card-info-text { font-size: 16px; } } .resources__wrapper-feed-posts-card-meta { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 7px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; margin: 10px 0 0; } .resources__wrapper-feed-posts-card-meta-date { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); } .resources__wrapper-feed-posts-card-meta-author { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); } .resources__wrapper-feed-posts-card-meta-author-link { color: var(--c-blue); text-decoration: underline; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .resources__wrapper-feed-posts-card-meta-author-link:hover { color: var(--c-blue-2); } .resources__wrapper-feed-posts-card-location { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-gray-2); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .resources__wrapper-feed-posts-card-location i { font-size: 18px; } .resources__wrapper-feed-posts-card .meta-col { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start; text-align: left; } .resources__wrapper-feed-posts-card .meta-col .date-uppercase { text-transform: uppercase; font-weight: 500; line-height: 1; } .resources__wrapper-feed-posts-card .meta-col .time-uppercase { line-height: 1; font-weight: 400; text-transform: uppercase; } .resources__wrapper-feed-posts-card-tags { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 10px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .resources__wrapper-feed-posts-card-tags-item { font-family: var(--ff-primary); font-weight: 400; font-size: 16px; line-height: 100%; border: 1px solid var(--c-green); border-radius: 25px; padding: 6px 12px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 48em) { .resources__wrapper-feed-posts-card-tags-item { font-size: 14px; } } @media screen and (max-width: 36em) { .resources__wrapper-feed-posts-card-tags-item { font-size: 12px; } } .resources__wrapper-feed-posts-card-tags-item:hover { background-color: var(--c-green); } .resources__wrapper-feed-posts-card-tags-item:hover a { color: var(--c-body-bg); } .resources__wrapper-feed-posts-card-tags-item a { display: block; width: 100%; height: 100%; color: var(--c-green); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .resources__wrapper-feed-posts-card-content { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; padding-top: 10px; color: var(--c-gray-2); overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; } @media screen and (max-width: 36em) { .resources__wrapper-feed-posts-card-content { font-size: 16px; line-height: 1.3; } } .resources__wrapper-feed-posts-card-read-more { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; overflow: hidden; color: var(--c-blue); position: relative; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; white-space: nowrap; } .resources__wrapper-feed-posts-card-read-more::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 20px); height: 2px; background-color: var(--c-blue); -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transform-origin: left; transform-origin: left; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .resources__wrapper-feed-posts-card-read-more:hover::after { -webkit-transform: scaleX(1); transform: scaleX(1); } .resources__wrapper-feed-posts-card-read-more img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .resources__wrapper-feed-posts .no-results-message { grid-column: 1/-1; text-align: center; padding: 2rem; font-family: var(--ff-primary); font-size: 18px; color: var(--c-gray-2); display: none; } .resources__wrapper-feed-posts-card-info-term { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-green); } .resources__wrapper-feed-posts-card-info-term i { font-size: 18px; } .resources__wrapper-feed-posts-card-info-term i * { color: var(--c-green) !important; } @media screen and (max-width: 36em) { .resources__wrapper-feed-posts-card-info-term { font-size: 16px; } } button.resources__wrapper-feed-posts-card-read-more { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: transparent; border: 0; padding: 0; cursor: pointer; text-align: left; } .guide-download-modal { position: fixed; inset: 0; z-index: 10050; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 1.25rem; opacity: 0; visibility: hidden; pointer-events: none; -webkit-transition: opacity 0.28s ease, visibility 0.28s ease; transition: opacity 0.28s ease, visibility 0.28s ease; } .guide-download-modal.is-open { opacity: 1; visibility: visible; pointer-events: auto; } .guide-download-modal.is-open .guide-download-modal__dialog { -webkit-transform: translateY(0) scale(1); transform: translateY(0) scale(1); opacity: 1; } .guide-download-modal__backdrop { position: absolute; inset: 0; background: radial-gradient(ellipse at top, rgba(53, 115, 177, 0.28), transparent 55%), rgba(12, 24, 40, 0.72); backdrop-filter: blur(4px); } .guide-download-modal__dialog { position: relative; z-index: 1; width: min(100%, 560px); max-height: min(90vh, 760px); overflow: auto; background: #fff; border-radius: 16px; padding: 0; -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 24px 64px rgba(12, 24, 40, 0.28); box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4) inset, 0 24px 64px rgba(12, 24, 40, 0.28); -webkit-transform: translateY(12px) scale(0.98); transform: translateY(12px) scale(0.98); opacity: 0; -webkit-transition: opacity 0.28s ease, -webkit-transform 0.28s ease; transition: opacity 0.28s ease, -webkit-transform 0.28s ease; transition: transform 0.28s ease, opacity 0.28s ease; transition: transform 0.28s ease, opacity 0.28s ease, -webkit-transform 0.28s ease; -webkit-overflow-scrolling: touch; } .guide-download-modal__dialog::before { content: ""; display: block; height: 4px; background: -webkit-gradient(linear, left top, right top, from(var(--c-blue)), to(var(--c-green))); background: linear-gradient(90deg, var(--c-blue) 0%, var(--c-green) 100%); border-radius: 16px 16px 0 0; } .guide-download-modal__close { position: absolute; top: 1rem; right: 1rem; z-index: 2; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 2.25rem; height: 2.25rem; border: 1px solid var(--c-gray); border-radius: 999px; background: #fff; color: var(--c-gray-2); font-size: 1.5rem; line-height: 1; cursor: pointer; -webkit-transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease; } .guide-download-modal__close:hover, .guide-download-modal__close:focus-visible { background: var(--c-gray-3); color: #111; border-color: #c9ccd1; outline: none; } .guide-download-modal__header { padding: 1.75rem 2rem 0.75rem; } @media screen and (max-width: 36em) { .guide-download-modal__header { padding: 1.5rem 1.25rem 0.5rem; } } .guide-download-modal__eyebrow { display: inline-block; margin-bottom: 0.5rem; font-family: var(--ff-primary); font-size: 0.75rem; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; color: var(--c-green); } .guide-download-modal__title { margin: 0 0 0.5rem; padding-right: 2.5rem; font-family: var(--ff-primary); font-size: clamp(1.35rem, 2.4vw, 1.65rem); font-weight: 600; line-height: 1.25; color: #152536; } .guide-download-modal__subtitle { margin: 0; font-family: var(--ff-primary); font-size: 0.975rem; line-height: 1.5; color: var(--c-gray-2); } .guide-download-modal__form { padding: 1rem 2rem 2rem; } @media screen and (max-width: 36em) { .guide-download-modal__form { padding: 0.75rem 1.25rem 1.5rem; } } .guide-download-modal__form .wpforms-container { margin: 0 !important; } .guide-download-modal__form .wpforms-form .wpforms-field-container { display: grid; grid-template-columns: 1fr 1fr; gap: 0.85rem 1rem; } @media screen and (max-width: 36em) { .guide-download-modal__form .wpforms-form .wpforms-field-container { grid-template-columns: 1fr; } } .guide-download-modal__form .wpforms-form .wpforms-field { padding: 0 !important; margin: 0 !important; } .guide-download-modal__form .wpforms-form .wpforms-field:last-child, .guide-download-modal__form .wpforms-form .wpforms-field:nth-last-child(2) { grid-column: 1/-1; } .guide-download-modal__form .wpforms-form .wpforms-field-label { display: block; margin: 0 0 0.35rem; font-family: var(--ff-primary); font-size: 0.8125rem; font-weight: 500; line-height: 1.3; color: #2a3441; } .guide-download-modal__form .wpforms-form .wpforms-field-label .wpforms-required-label { color: var(--c-blue); margin-left: 0.15rem; } .guide-download-modal__form .wpforms-form input[type=text], .guide-download-modal__form .wpforms-form input[type=email], .guide-download-modal__form .wpforms-form input[type=tel], .guide-download-modal__form .wpforms-form input[type=url], .guide-download-modal__form .wpforms-form input[type=number], .guide-download-modal__form .wpforms-form select, .guide-download-modal__form .wpforms-form textarea { width: 100% !important; max-width: none !important; height: 46px; margin: 0; padding: 0.7rem 0.9rem; border: 1px solid #d5d9de; border-radius: 8px; background: #fafbfc; font-family: var(--ff-primary); font-size: 0.9375rem; line-height: 1.4; color: #152536; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: border-color 0.2s ease, background-color 0.2s ease, -webkit-box-shadow 0.2s ease; transition: border-color 0.2s ease, background-color 0.2s ease, -webkit-box-shadow 0.2s ease; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease; transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, -webkit-box-shadow 0.2s ease; } .guide-download-modal__form .wpforms-form input[type=text]::-webkit-input-placeholder, .guide-download-modal__form .wpforms-form input[type=email]::-webkit-input-placeholder, .guide-download-modal__form .wpforms-form input[type=tel]::-webkit-input-placeholder, .guide-download-modal__form .wpforms-form input[type=url]::-webkit-input-placeholder, .guide-download-modal__form .wpforms-form input[type=number]::-webkit-input-placeholder, .guide-download-modal__form .wpforms-form select::-webkit-input-placeholder, .guide-download-modal__form .wpforms-form textarea::-webkit-input-placeholder { color: #9aa1aa; } .guide-download-modal__form .wpforms-form input[type=text]::-moz-placeholder, .guide-download-modal__form .wpforms-form input[type=email]::-moz-placeholder, .guide-download-modal__form .wpforms-form input[type=tel]::-moz-placeholder, .guide-download-modal__form .wpforms-form input[type=url]::-moz-placeholder, .guide-download-modal__form .wpforms-form input[type=number]::-moz-placeholder, .guide-download-modal__form .wpforms-form select::-moz-placeholder, .guide-download-modal__form .wpforms-form textarea::-moz-placeholder { color: #9aa1aa; } .guide-download-modal__form .wpforms-form input[type=text]:-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=email]:-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=tel]:-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=url]:-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=number]:-ms-input-placeholder, .guide-download-modal__form .wpforms-form select:-ms-input-placeholder, .guide-download-modal__form .wpforms-form textarea:-ms-input-placeholder { color: #9aa1aa; } .guide-download-modal__form .wpforms-form input[type=text]::-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=email]::-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=tel]::-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=url]::-ms-input-placeholder, .guide-download-modal__form .wpforms-form input[type=number]::-ms-input-placeholder, .guide-download-modal__form .wpforms-form select::-ms-input-placeholder, .guide-download-modal__form .wpforms-form textarea::-ms-input-placeholder { color: #9aa1aa; } .guide-download-modal__form .wpforms-form input[type=text]::placeholder, .guide-download-modal__form .wpforms-form input[type=email]::placeholder, .guide-download-modal__form .wpforms-form input[type=tel]::placeholder, .guide-download-modal__form .wpforms-form input[type=url]::placeholder, .guide-download-modal__form .wpforms-form input[type=number]::placeholder, .guide-download-modal__form .wpforms-form select::placeholder, .guide-download-modal__form .wpforms-form textarea::placeholder { color: #9aa1aa; } .guide-download-modal__form .wpforms-form input[type=text]:hover, .guide-download-modal__form .wpforms-form input[type=email]:hover, .guide-download-modal__form .wpforms-form input[type=tel]:hover, .guide-download-modal__form .wpforms-form input[type=url]:hover, .guide-download-modal__form .wpforms-form input[type=number]:hover, .guide-download-modal__form .wpforms-form select:hover, .guide-download-modal__form .wpforms-form textarea:hover { border-color: #b8c0c9; background: #fff; } .guide-download-modal__form .wpforms-form input[type=text]:focus, .guide-download-modal__form .wpforms-form input[type=email]:focus, .guide-download-modal__form .wpforms-form input[type=tel]:focus, .guide-download-modal__form .wpforms-form input[type=url]:focus, .guide-download-modal__form .wpforms-form input[type=number]:focus, .guide-download-modal__form .wpforms-form select:focus, .guide-download-modal__form .wpforms-form textarea:focus { outline: none; border-color: var(--c-blue); background: #fff; -webkit-box-shadow: 0 0 0 3px rgba(53, 115, 177, 0.18); box-shadow: 0 0 0 3px rgba(53, 115, 177, 0.18); } .guide-download-modal__form .wpforms-form input[type=text].wpforms-error, .guide-download-modal__form .wpforms-form input[type=email].wpforms-error, .guide-download-modal__form .wpforms-form input[type=tel].wpforms-error, .guide-download-modal__form .wpforms-form input[type=url].wpforms-error, .guide-download-modal__form .wpforms-form input[type=number].wpforms-error, .guide-download-modal__form .wpforms-form select.wpforms-error, .guide-download-modal__form .wpforms-form textarea.wpforms-error { border-color: #c0392b; background: #fff8f7; } .guide-download-modal__form .wpforms-form textarea { min-height: 96px; height: auto; resize: vertical; } .guide-download-modal__form .wpforms-form .wpforms-error { font-family: var(--ff-primary); font-size: 0.75rem; color: #c0392b; } .guide-download-modal__form .wpforms-form .wpforms-field-description { margin-top: 0.3rem; font-size: 0.75rem; color: var(--c-gray-2); } .guide-download-modal__form .wpforms-form .wpforms-submit-container { margin-top: 1.25rem; padding: 0; } .guide-download-modal__form .wpforms-form button.wpforms-submit, .guide-download-modal__form .wpforms-form .wpforms-submit, .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit { width: 100% !important; min-height: 48px; margin: 0 !important; padding: 0.85rem 1.25rem !important; border: 0 !important; border-radius: 8px !important; background: var(--c-blue) !important; background-color: var(--c-blue) !important; color: #fff !important; font-family: var(--ff-primary) !important; font-size: 0.9375rem !important; font-weight: 500 !important; letter-spacing: 0.04em; text-transform: uppercase; cursor: pointer; opacity: 1 !important; -webkit-box-shadow: none !important; box-shadow: none !important; -webkit-transition: background-color 0.2s ease, -webkit-transform 0.2s ease; transition: background-color 0.2s ease, -webkit-transform 0.2s ease; transition: background-color 0.2s ease, transform 0.2s ease; transition: background-color 0.2s ease, transform 0.2s ease, -webkit-transform 0.2s ease; } .guide-download-modal__form .wpforms-form button.wpforms-submit:hover, .guide-download-modal__form .wpforms-form button.wpforms-submit:focus, .guide-download-modal__form .wpforms-form button.wpforms-submit:focus-visible, .guide-download-modal__form .wpforms-form .wpforms-submit:hover, .guide-download-modal__form .wpforms-form .wpforms-submit:focus, .guide-download-modal__form .wpforms-form .wpforms-submit:focus-visible, .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit:hover, .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit:focus, .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit:focus-visible { background: var(--c-blue-2) !important; background-color: var(--c-blue-2) !important; color: #fff !important; outline: none; } .guide-download-modal__form .wpforms-form button.wpforms-submit:active, .guide-download-modal__form .wpforms-form .wpforms-submit:active, .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit:active { -webkit-transform: translateY(1px); transform: translateY(1px); } .guide-download-modal__form .wpforms-form button.wpforms-submit[disabled], .guide-download-modal__form .wpforms-form button.wpforms-submit.wpforms-disabled, .guide-download-modal__form .wpforms-form button.wpforms-submit:disabled, .guide-download-modal__form .wpforms-form .wpforms-submit[disabled], .guide-download-modal__form .wpforms-form .wpforms-submit.wpforms-disabled, .guide-download-modal__form .wpforms-form .wpforms-submit:disabled, .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit[disabled], .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit.wpforms-disabled, .guide-download-modal__form .wpforms-form button[type=submit].wpforms-submit:disabled { background: var(--c-blue) !important; background-color: var(--c-blue) !important; color: #fff !important; opacity: 0.7 !important; cursor: wait; } .guide-download-modal__form .wpforms-form .wpforms-confirmation-container-full, .guide-download-modal__form .wpforms-form .wpforms-confirmation-container { margin: 0; padding: 1rem 1.1rem; border: 1px solid rgba(65, 125, 44, 0.25); border-radius: 10px; background: rgba(65, 125, 44, 0.08); color: var(--c-green-2); font-family: var(--ff-primary); } .guide-download-modal__form .wpforms-form .wpforms-error-container { margin: 0 0 1rem; padding: 0.85rem 1rem; border-radius: 8px; border: 1px solid rgba(192, 57, 43, 0.25); background: #fff6f5; font-family: var(--ff-primary); font-size: 0.8125rem; line-height: 1.45; color: #8a2a22; } body.guide-modal-open { overflow: hidden; } .bk_counters { padding-bottom: 50px; } @media screen and (max-width: 76em) { .bk_counters { padding-bottom: 40px; } } @media screen and (max-width: 48em) { .bk_counters { padding-bottom: 30px; } } @media screen and (max-width: 36em) { .bk_counters { padding-bottom: 20px; } } .bk_counters__wrapper { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 60px; } @media screen and (max-width: 76em) { .bk_counters__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .bk_counters__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .bk_counters__wrapper { gap: 20px; } } .bk_counters__wrapper-title { font-family: var(--ff-primary); font-weight: 300 !important; font-size: 36px !important; line-height: 48px !important; text-align: center !important; color: var(--c-primary) !important; padding: 0 !important; } @media screen and (max-width: 76em) { .bk_counters__wrapper-title { font-size: 32px !important; line-height: 1.3 !important; } } @media screen and (max-width: 48em) { .bk_counters__wrapper-title { font-size: 28px !important; } } @media screen and (max-width: 36em) { .bk_counters__wrapper-title { font-size: 24px !important; } } @media screen and (max-width: 29.6875em) { .bk_counters__wrapper-title { font-size: 22px !important; } } @media screen and (max-width: 21.875em) { .bk_counters__wrapper-title { font-size: 20px !important; } } .bk_counters__wrapper-items { width: 100%; display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .bk_counters__wrapper-items { grid-template-columns: repeat(2, 1fr); gap: 40px; } } @media screen and (max-width: 48em) { .bk_counters__wrapper-items { grid-template-columns: repeat(3, 1fr); gap: 30px; } } @media screen and (max-width: 37.5em) { .bk_counters__wrapper-items { grid-template-columns: repeat(2, 1fr); gap: 20px; } } @media screen and (max-width: 28.125em) { .bk_counters__wrapper-items { grid-template-columns: 1fr; gap: 10px; } } .bk_counters__wrapper-items-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-align: start; -ms-flex-align: start; align-items: start; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .bk_counters__wrapper-items-item-title { font-family: var(--ff-primary); font-weight: 700 !important; font-size: 48px !important; line-height: 52px !important; text-align: left !important; color: var(--c-green-light); max-width: 250px !important; width: 100%; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; display: inline-block; padding: 0 !important; } @media screen and (max-width: 76em) { .bk_counters__wrapper-items-item-title { font-size: 40px !important; line-height: 1.3 !important; max-width: 200px !important; } } @media screen and (max-width: 48em) { .bk_counters__wrapper-items-item-title { font-size: 32px !important; } } .bk_counters__wrapper-items-item-subtitle { font-family: var(--ff-primary); font-weight: 400 !important; font-size: 18px !important; line-height: 24px !important; text-align: left !important; padding: 0 !important; } @media screen and (max-width: 36em) { .bk_counters__wrapper-items-item-subtitle { font-size: 16px !important; } } .bk_testimonials { padding-block: 50px; padding-inline: 0 !important; } @media screen and (max-width: 76em) { .bk_testimonials { padding-block: 40px; } } @media screen and (max-width: 48em) { .bk_testimonials { padding-block: 30px; } } @media screen and (max-width: 36em) { .bk_testimonials { padding-block: 20px; } } .bk_testimonials__wrapper { max-width: 80%; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } @media screen and (max-width: 76em) { .bk_testimonials__wrapper { gap: 20px; max-width: 90%; } } @media screen and (max-width: 48em) { .bk_testimonials__wrapper { gap: 15px; max-width: 100%; } } @media screen and (max-width: 36em) { .bk_testimonials__wrapper { gap: 10px; } } .bk_testimonials__wrapper-text { font-family: var(--ff-primary); font-weight: 300; font-size: 28px; line-height: 36px; color: #081c31; } @media screen and (max-width: 76em) { .bk_testimonials__wrapper-text { font-size: 26px; line-height: 1.4; } } @media screen and (max-width: 48em) { .bk_testimonials__wrapper-text { font-size: 24px; } } @media screen and (max-width: 36em) { .bk_testimonials__wrapper-text { font-size: 22px; } } .bk_testimonials__wrapper-author { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 5px; } .bk_testimonials__wrapper-author-name { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-primary); } @media screen and (max-width: 36em) { .bk_testimonials__wrapper-author-name { font-size: 16px; } } .bk_testimonials__wrapper-author-position { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); } @media screen and (max-width: 36em) { .bk_testimonials__wrapper-author-position { font-size: 16px; } } .textColumn { padding-block: 100px; font-family: var(--ff-primary); } @media screen and (max-width: 76em) { .textColumn { padding-block: 80px; } } @media screen and (max-width: 48em) { .textColumn { padding-block: 60px; } } @media screen and (max-width: 36em) { .textColumn { padding-block: 40px; } } .textColumn__wrapper { max-width: 900px; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } @media screen and (max-width: 76em) { .textColumn__wrapper { gap: 20px; } } @media screen and (max-width: 48em) { .textColumn__wrapper { gap: 15px; } } @media screen and (max-width: 36em) { .textColumn__wrapper { gap: 10px; } } .textColumn__wrapper-title { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; text-align: center; color: var(--c-primary); } @media screen and (max-width: 76em) { .textColumn__wrapper-title { font-size: 30px; line-height: 1.3; } } @media screen and (max-width: 48em) { .textColumn__wrapper-title { font-size: 28px; } } @media screen and (max-width: 36em) { .textColumn__wrapper-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .textColumn__wrapper-title { font-size: 22px; } } .textColumn__wrapper-description * { font-family: var(--ff-primary); font-weight: 400; font-size: 24px; line-height: 32px; color: var(--c-gray-2); text-align: center; } @media screen and (max-width: 76em) { .textColumn__wrapper-description * { font-size: 22px; line-height: 1.3; } } @media screen and (max-width: 48em) { .textColumn__wrapper-description * { font-size: 20px; } } @media screen and (max-width: 36em) { .textColumn__wrapper-description * { font-size: 18px; } } .tmb { padding-block: 100px; font-family: var(--ff-primary); } @media screen and (max-width: 76em) { .tmb { padding-block: 80px; } } @media screen and (max-width: 48em) { .tmb { padding-block: 60px; } } @media screen and (max-width: 36em) { .tmb { padding-block: 40px; } } .tmb__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: start; gap: 100px; } .tmb__wrapper.flex-row-reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } @media screen and (max-width: 62.5em) { .tmb__wrapper.flex-row-reverse { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } @media screen and (max-width: 76em) { .tmb__wrapper { gap: 80px; } } @media screen and (max-width: 62.5em) { .tmb__wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 60px; } } @media screen and (max-width: 36em) { .tmb__wrapper { gap: 40px; } } .tmb__wrapper-image { max-width: 420px; width: 100%; height: 350px; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 62.5em) { .tmb__wrapper-image { height: 300px; } } @media screen and (max-width: 48em) { .tmb__wrapper-image { height: 250px; } } @media screen and (max-width: 36em) { .tmb__wrapper-image { height: 200px; } } .tmb__wrapper-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .tmb__wrapper-content { gap: 40px; } } @media screen and (max-width: 48em) { .tmb__wrapper-content { gap: 30px; } } @media screen and (max-width: 36em) { .tmb__wrapper-content { gap: 20px; } } .tmb__wrapper-content-title { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; } @media screen and (max-width: 76em) { .tmb__wrapper-content-title { font-size: 30px; } } @media screen and (max-width: 48em) { .tmb__wrapper-content-title { font-size: 28px; } } @media screen and (max-width: 36em) { .tmb__wrapper-content-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .tmb__wrapper-content-title { font-size: 22px; } } .tmb__wrapper-content-description { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; font-family: var(--ff-primary); font-weight: 400; font-size: 24px; line-height: 32px; color: var(--c-gray-2); } @media screen and (max-width: 76em) { .tmb__wrapper-content-description { font-size: 22px; line-height: 1.4; } } @media screen and (max-width: 48em) { .tmb__wrapper-content-description { font-size: 20px; } } @media screen and (max-width: 36em) { .tmb__wrapper-content-description { font-size: 18px; } } .tmb__wrapper-content-description * { font-family: var(--ff-primary); font-weight: 400; font-size: 24px; line-height: 32px; color: var(--c-gray-2); } @media screen and (max-width: 76em) { .tmb__wrapper-content-description * { font-size: 22px; line-height: 1.4; } } @media screen and (max-width: 48em) { .tmb__wrapper-content-description * { font-size: 20px; } } @media screen and (max-width: 36em) { .tmb__wrapper-content-description * { font-size: 18px; } } .tmb__wrapper-content-bullets { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } .tmb__wrapper-content-bullets-bullet { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .tmb__wrapper-content-bullets-bullet-icon { width: 32px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; margin-right: 15px; } @media screen and (max-width: 76em) { .tmb__wrapper-content-bullets-bullet-icon { width: 28px; } } @media screen and (max-width: 48em) { .tmb__wrapper-content-bullets-bullet-icon { width: 24px; } } @media screen and (max-width: 36em) { .tmb__wrapper-content-bullets-bullet-icon { width: 20px; } } .tmb__wrapper-content-bullets-bullet-number { font-family: var(--ff-primary); font-weight: 700; font-size: 32px; line-height: 100%; color: #4392e0; text-align: center; width: 70px; min-width: 70px; max-width: 70px; height: 70px; min-height: 70px; max-height: 70px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 50%; border: 3px solid #4392e0; margin-right: 25px; } @media screen and (max-width: 76em) { .tmb__wrapper-content-bullets-bullet-number { font-size: 28px; width: 60px; min-width: 60px; max-width: 60px; height: 60px; min-height: 60px; max-height: 60px; } } @media screen and (max-width: 48em) { .tmb__wrapper-content-bullets-bullet-number { font-size: 24px; width: 50px; min-width: 50px; max-width: 50px; height: 50px; min-height: 50px; max-height: 50px; } } @media screen and (max-width: 36em) { .tmb__wrapper-content-bullets-bullet-number { font-size: 20px; width: 40px; min-width: 40px; max-width: 40px; height: 40px; min-height: 40px; max-height: 40px; } } .tmb__wrapper-content-bullets-bullet-title { font-family: var(--ff-primary); font-weight: 400; font-size: 24px; line-height: 32px; color: var(--c-gray-2); text-align: left; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } @media screen and (max-width: 76em) { .tmb__wrapper-content-bullets-bullet-title { font-size: 22px; line-height: 1.3; } } @media screen and (max-width: 48em) { .tmb__wrapper-content-bullets-bullet-title { font-size: 20px; } } @media screen and (max-width: 36em) { .tmb__wrapper-content-bullets-bullet-title { font-size: 18px; } } .tcg { padding-block: 100px; position: relative; font-family: var(--ff-primary); } .tcg::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/green-blue-gradient.webp); background-size: cover; background-position: center; background-repeat: no-repeat; } @media screen and (max-width: 76em) { .tcg { padding-block: 80px; } } @media screen and (max-width: 48em) { .tcg { padding-block: 60px; } } @media screen and (max-width: 36em) { .tcg { padding-block: 40px; } } .tcg__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 1; } .tcg__wrapper-title { font-family: var(--ff-primary); font-weight: 300; font-size: 36px; line-height: 48px; text-align: center; color: var(--c-body-bg); } @media screen and (max-width: 76em) { .tcg__wrapper-title { font-size: 30px; line-height: 1.3; } } @media screen and (max-width: 48em) { .tcg__wrapper-title { font-size: 28px; } } @media screen and (max-width: 36em) { .tcg__wrapper-title { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .tcg__wrapper-title { font-size: 22px; } } .tcg__wrapper-cards { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .tcg__wrapper-cards { gap: 40px; } } @media screen and (max-width: 48em) { .tcg__wrapper-cards { grid-template-columns: 1fr; gap: 30px; } } @media screen and (max-width: 36em) { .tcg__wrapper-cards { gap: 20px; } } .tcg__wrapper-cards-card { position: relative; padding: 25px; border-radius: 20px; overflow: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 30px; } @media screen and (max-width: 76em) { .tcg__wrapper-cards-card { gap: 25px; } } @media screen and (max-width: 48em) { .tcg__wrapper-cards-card { gap: 20px; } } @media screen and (max-width: 36em) { .tcg__wrapper-cards-card { gap: 15px; } } .tcg__wrapper-cards-card-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 10px; } @media screen and (max-width: 48em) { .tcg__wrapper-cards-card-header { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .tcg__wrapper-cards-card-header-icon { width: 70px; min-width: 70px; max-width: 70px; height: 70px; min-height: 70px; max-height: 70px; border-radius: 50%; background-color: rgba(19, 50, 81, 0.6392156863); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 5px; } @media screen and (max-width: 76em) { .tcg__wrapper-cards-card-header-icon { width: 60px; min-width: 60px; max-width: 60px; height: 60px; min-height: 60px; max-height: 60px; } } @media screen and (max-width: 48em) { .tcg__wrapper-cards-card-header-icon { width: 50px; min-width: 50px; max-width: 50px; height: 50px; min-height: 50px; max-height: 50px; } } .tcg__wrapper-cards-card-header-icon img { width: 60%; height: 60%; -o-object-fit: contain; object-fit: contain; } .tcg__wrapper-cards-card-header-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; text-align: left; } @media screen and (max-width: 76em) { .tcg__wrapper-cards-card-header-content { gap: 8px; } } @media screen and (max-width: 48em) { .tcg__wrapper-cards-card-header-content { gap: 6px; } } .tcg__wrapper-cards-card-header-content-title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .tcg__wrapper-cards-card-header-content-title { font-size: 22px; line-height: 1.3; } } @media screen and (max-width: 48em) { .tcg__wrapper-cards-card-header-content-title { font-size: 20px; } } .tcg__wrapper-cards-card-header-content-subtitle { font-family: var(--ff-primary); font-weight: 400; font-style: Italic; font-size: 18px; line-height: 24px; } @media screen and (max-width: 76em) { .tcg__wrapper-cards-card-header-content-subtitle { font-size: 16px; line-height: 22px; } } .tcg__wrapper-cards-card-description { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); } @media screen and (max-width: 36em) { .tcg__wrapper-cards-card-description { font-size: 16px; line-height: 22px; } } .tcg__wrapper-cards-card::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(255, 255, 255, 0.3607843137); z-index: -1; backdrop-filter: blur(5px); } .featuredBlog { padding-block: 100px; position: relative; font-family: var(--ff-primary); background-color: #f6f6f7; } @media screen and (max-width: 76em) { .featuredBlog { padding-block: 80px; } } @media screen and (max-width: 48em) { .featuredBlog { padding-block: 60px; } } @media screen and (max-width: 36em) { .featuredBlog { padding-block: 40px; } } .featuredBlog__wrapper { max-width: var(--max-w); width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media screen and (max-width: 76em) { .featuredBlog__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .featuredBlog__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .featuredBlog__wrapper { gap: 20px; } } .featuredBlog__wrapper-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-align: center; text-transform: uppercase; color: var(--c-primary); } /*-------------------------------------------------------------- # Layouts --------------------------------------------------------------*/ /* * ## Header --------------------------------------------- */ .header__hamburger { display: inline-block; position: relative; } @media (min-width: 1024px) { .header__hamburger { display: none; } } .header__hamburger.open .header__hamburger__bar:first-child { -webkit-transform: translateY(0) rotate(45deg); transform: translateY(0) rotate(45deg); } .header__hamburger.open .header__hamburger__bar:last-child { -webkit-transform: translateY(-10px) rotate(-45deg); transform: translateY(-10px) rotate(-45deg); } .header__hamburger__bar { display: block; position: relative; width: 28px; height: 3px; margin-bottom: 6px; border-radius: 6px; background-color: #6b7280; -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .header__hamburger__bar:last-child { margin-bottom: 0; } .header__brand { max-width: 160px; } @media (min-width: 768px) { .header__brand { max-width: 200px; } } @media (min-width: 1024px) { .header__brand { max-width: 250px; } } .header__menu-link--btn { text-transform: uppercase; font-weight: 500; color: var(--c-blue); -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .header__menu-link--btn:hover { color: var(--c-dark-blue); } .header__menu-item--parent:hover .header__menu--child, .header__menu-item--parent.menu-open .header__menu--child { opacity: 1; visibility: visible; -webkit-transform: translateY(0); transform: translateY(0); } .header__menu-item--parent:hover > a, .header__menu-item--parent.menu-open > a { color: var(--c-blue); } .header__menu--child { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; position: absolute; top: 100%; border-top: 1px solid var(--c-light-gray); overflow: hidden; -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); opacity: 0; visibility: hidden; -webkit-transform: translateY(-10px); transform: translateY(-10px); -webkit-transition: opacity 200ms ease-out, visibility 200ms ease-out, -webkit-transform 200ms ease-out; transition: opacity 200ms ease-out, visibility 200ms ease-out, -webkit-transform 200ms ease-out; transition: opacity 200ms ease-out, visibility 200ms ease-out, transform 200ms ease-out; transition: opacity 200ms ease-out, visibility 200ms ease-out, transform 200ms ease-out, -webkit-transform 200ms ease-out; -webkit-transition-delay: 0ms; transition-delay: 0ms; } .header__menu--dropdown { padding: 1.25rem 1rem; width: 15rem; background-color: white; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; left: 0; border-radius: 0 0 16px 16px; } .header__menu--dropdown > * + * { margin-top: 0.75rem; } .header__menu--megamenu { left: 0; width: 100%; } .header__cta-title path { fill: white; } .header__menu { display: none; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 1024px) { .header__menu { display: -webkit-box; display: -ms-flexbox; display: flex; } } .header__menu-item { padding: 38px 20px; position: relative; } .header__menu-item:hover { background-color: var(--c-gray-3); } .header__menu-item--parent.relative { position: relative; } .header__menu-item--parent.static { position: static; } .header__menu-link { -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .header__menu-link:hover { color: var(--c-blue); } .header { position: sticky; top: 0; z-index: 50; background-color: white; -webkit-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); } .site { scroll-behavior: smooth; } nav { max-width: var(--max-w); width: 100%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .header__brand-link { display: block; padding: 1.5rem 0; } @media (min-width: 1024px) { .header__brand-link { padding: 0; } } .nav-mobile__item-group { width: 100%; } .nav-mobile { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background-color: var(--c-primary); z-index: 1000; overflow-y: auto; padding: 2rem 0; } .nav-mobile.open { display: block; } .nav-mobile__item { width: 100%; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .nav-mobile__item:last-child { border-bottom: none; } .nav-mobile__item.open .nav-mobile__submenu { display: block; } .nav-mobile__menu-item { display: block; width: 100%; padding: 1rem 2rem; color: white; text-decoration: none; font-size: 1.125rem; font-weight: 500; -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; border: none; background: none; text-align: left; cursor: pointer; } .nav-mobile__menu-item:hover { background-color: rgba(255, 255, 255, 0.1); } .nav-mobile__submenu { display: none; background-color: rgba(0, 0, 0, 0.2); padding: 0; } .nav-mobile__menu-items { list-style: none; margin: 0; padding: 0; } .nav-mobile__section { padding: 1.5rem 2rem; border-bottom: 1px solid rgba(255, 255, 255, 0.1); } .nav-mobile__section:last-child { border-bottom: none; } .nav-mobile__section--container { margin-bottom: 2rem; } .nav-mobile__section--container:last-child { margin-bottom: 0; } .nav-mobile__title { color: white; font-size: 1.25rem; font-weight: 600; margin-bottom: 0.5rem; text-decoration: none; } .nav-mobile__title:hover { color: var(--c-blue); } .nav-mobile__subtitle { color: white; font-size: 1rem; font-weight: 500; margin-bottom: 0.5rem; } .nav-mobile__description { color: rgba(255, 255, 255, 0.8); font-size: 0.875rem; line-height: 1.5; margin-bottom: 1rem; } /* * ## Nav mobile --------------------------------------------- */ .nav-mobile { display: none; } @media screen and (max-width: 63.9375em) { .nav-mobile { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-block: 78px 0; background-color: var(--c-body-bg); opacity: 0; visibility: hidden; -webkit-transition: var(--g-trans); transition: var(--g-trans); z-index: 40; } } @media screen and (max-width: 48em) { .nav-mobile { padding-block: 86px 0; } } @media screen and (max-width: 36em) { .nav-mobile { padding-block: 40px 0; } } .nav-mobile.open { visibility: visible; opacity: 1; display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; } .nav-mobile__item-group { padding-top: 40px; } .nav-mobile .nav-mobile__item { padding-inline: 30px; } @media screen and (max-width: 48em) { .nav-mobile .nav-mobile__item { padding-inline: 20px; } } @media screen and (max-width: 36em) { .nav-mobile .nav-mobile__item { padding-inline: 10px; } } .nav-mobile__items { max-width: var(--max-w); width: 100%; margin: 0 auto; padding: 0 1rem; list-style-position: inside; } .nav-mobile__item { background-color: white; -webkit-transition: all 300ms ease-in-out; transition: all 300ms ease-in-out; } .nav-mobile__item.open { background-color: #f6f6f7; } .nav-mobile__item.open .nav-mobile__submenu { display: block; -webkit-transform: scaleY(1); transform: scaleY(1); } .nav-mobile__menu-items { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; list-style-position: inside; } .nav-mobile__menu-item { width: 100%; display: block; padding: 1rem 0; font-size: 18px; font-family: var(--ff-primary); font-weight: 400; color: var(--c-primary); } @media screen and (max-width: 48em) { .nav-mobile__menu-item { font-size: 16px; } } .nav-mobile__menu-item--small { font-size: 0.75rem; padding: 0.375rem 0; } .nav-mobile__span { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-top: 1rem; /* py-4 */ padding-bottom: 1rem; padding-right: 0.375rem; /* pr-1.5 = 6px */ cursor: pointer; } .nav-mobile__span::after { display: inline-block; padding: 0.25rem; /* p-1 */ border-color: #d1d5db; /* border-gray-300 por defecto */ border-right: 2px solid; border-bottom: 2px solid; -webkit-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; content: ""; } .nav-mobile__span.open::after { -webkit-transform: rotate(-135deg); transform: rotate(-135deg); } .nav-mobile__submenu { display: none; -webkit-transform: scaleY(0); transform: scaleY(0); -webkit-transform-origin: top; transform-origin: top; -webkit-transition: -webkit-transform 300ms ease-in-out; transition: -webkit-transform 300ms ease-in-out; transition: transform 300ms ease-in-out; transition: transform 300ms ease-in-out, -webkit-transform 300ms ease-in-out; } .nav-mobile__cta { width: 100%; display: block; padding: 20px; font-family: var(--ff-primary); font-weight: 500; margin: 0; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-body-bg); text-align: center; background: linear-gradient(96.4deg, #2e80d4 0.74%, #009de6 100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 36em) { .nav-mobile__cta { font-size: 16px; } } .nav-mobile__section--container { padding: 20px 30px; margin-bottom: 0; background-color: #f4f4f5; } @media screen and (max-width: 48em) { .nav-mobile__section--container { padding: 20px; } } @media screen and (max-width: 36em) { .nav-mobile__section--container { padding: 20px 15px; } } .nav-mobile__section--container .nav-mobile__title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: var(--c-primary); } @media screen and (max-width: 76em) { .nav-mobile__section--container .nav-mobile__title { font-size: 22px; } } @media screen and (max-width: 48em) { .nav-mobile__section--container .nav-mobile__title { font-size: 20px; } } @media screen and (max-width: 36em) { .nav-mobile__section--container .nav-mobile__title { font-size: 18px; } } .nav-mobile__section--container .nav-mobile__description { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-gray-2); } @media screen and (max-width: 36em) { .nav-mobile__section--container .nav-mobile__description { font-size: 16px; } } .nav-mobile__section--container .nav-mobile__subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-primary); padding-top: 15px; } @media screen and (max-width: 36em) { .nav-mobile__section--container .nav-mobile__subtitle { font-size: 16px; } } .nav-mobile__section--container .nav-mobile__menu-items { padding-top: 15px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; } .nav-mobile__section--container .nav-mobile__menu-items li a { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); padding: 0; } @media screen and (max-width: 36em) { .nav-mobile__section--container .nav-mobile__menu-items li a { font-size: 16px; } } .nav-mobile__cta { background-color: #f4f4f5; } @media screen and (max-width: 48em) { .nav-mobile__cta { display: none; } } .nav-mobile__cta .container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; } .nav-mobile__cta .container .title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: var(--c-body-bg); } @media screen and (max-width: 76em) { .nav-mobile__cta .container .title { font-size: 22px; } } @media screen and (max-width: 48em) { .nav-mobile__cta .container .title { font-size: 20px; } } @media screen and (max-width: 36em) { .nav-mobile__cta .container .title { font-size: 18px; } } .nav-mobile__cta .container .subtitle { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); text-transform: uppercase; } @media screen and (max-width: 36em) { .nav-mobile__cta .container .subtitle { font-size: 16px; } } .nav-mobile__cta .container .body { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); text-transform: math-auto; } @media screen and (max-width: 36em) { .nav-mobile__cta .container .body { font-size: 16px; } } .nav-mobile__cta .container .cta-nav-mobile { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); text-transform: math-auto; } @media screen and (max-width: 36em) { .nav-mobile__cta .container .cta-nav-mobile { font-size: 16px; } } .nav-mobile__cta .container .cta-nav-mobile:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .nav-mobile__section, .nav-mobile__submenu { background-color: #f4f4f5; } .grid-icons { padding: 0; } .grid-icons .nav-mobile__section { padding: 20px; margin: 0 !important; max-width: 100%; } @media screen and (max-width: 36em) { .grid-icons .nav-mobile__section { padding: 20px 10px; } } .grid-icons .nav-mobile__menu-items { width: 100%; display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; } @media screen and (max-width: 36em) { .grid-icons .nav-mobile__menu-items { grid-template-columns: repeat(1, 1fr); } } .grid-icons .nav-mobile__menu-item { padding: 15px 20px; background-color: var(--c-body-bg); border: 1px solid #dee0e2; border-radius: 12px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .grid-icons .nav-mobile__menu-item i { font-size: 20px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 36em) { .grid-icons .nav-mobile__menu-item i { font-size: 16px; } } .grid-icons .nav-mobile__menu-item:hover { color: var(--c-blue); } .grid-icons .nav-mobile__menu-item:hover i * { color: var(--c-blue) !important; } /* * ## Footer --------------------------------------------- */ .footer { padding-block: 100px; background-color: #f6f6f7; } @media screen and (max-width: 76em) { .footer { padding-block: 80px; } } @media screen and (max-width: 48em) { .footer { padding-block: 60px; } } @media screen and (max-width: 36em) { .footer { padding-block: 40px; } } .footer__wrapper { max-width: var(--max-w); width: 100%; font-family: var(--ff-primary); } .footer__wrapper .footer__copyright { width: 100%; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 20px; grid-column: span 4; } @media screen and (max-width: 76em) { .footer__wrapper .footer__copyright { grid-column: span 3; } } @media screen and (max-width: 48em) { .footer__wrapper .footer__copyright { grid-column: span 2; } } @media screen and (max-width: 36em) { .footer__wrapper .footer__copyright { grid-column: span 1; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } } .footer__wrapper .footer__copyright img { width: 50px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 48em) { .footer__wrapper .footer__copyright img { width: 40px; } } @media screen and (max-width: 36em) { .footer__wrapper .footer__copyright { font-size: 16px; } } .footer__wrapper .footer__wrapper-menus { display: grid; grid-template-columns: repeat(4, 1fr); gap: 50px; } @media screen and (max-width: 76em) { .footer__wrapper .footer__wrapper-menus { grid-template-columns: repeat(3, 1fr); gap: 40px; } } @media screen and (max-width: 48em) { .footer__wrapper .footer__wrapper-menus { grid-template-columns: repeat(2, 1fr); gap: 30px; } } @media screen and (max-width: 36em) { .footer__wrapper .footer__wrapper-menus { grid-template-columns: repeat(1, 1fr); gap: 20px; } } .footer__wrapper .footer__wrapper-menus-menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .footer__wrapper .footer__wrapper-menus-menu { gap: 40px; } } @media screen and (max-width: 48em) { .footer__wrapper .footer__wrapper-menus-menu { gap: 30px; } } @media screen and (max-width: 36em) { .footer__wrapper .footer__wrapper-menus-menu { gap: 20px; } } .footer__wrapper .footer__wrapper-menus-menu-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .footer__wrapper .footer__wrapper-menus-menu-item-image { width: 90px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 76em) { .footer__wrapper .footer__wrapper-menus-menu-item-image { width: 80px; } } .footer__wrapper .footer__wrapper-menus-menu-item-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-green); } @media screen and (max-width: 36em) { .footer__wrapper .footer__wrapper-menus-menu-item-title { font-size: 16px; } } .footer__wrapper .footer__wrapper-menus-menu-item-content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 25px; } .footer__wrapper .footer__wrapper-menus-menu-item-content p { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); } @media screen and (max-width: 36em) { .footer__wrapper .footer__wrapper-menus-menu-item-content p { font-size: 16px; } } .footer__wrapper .footer__wrapper-menus-menu-item-content p a { padding: 12px 20px; border-radius: 6px; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; position: relative; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; text-transform: uppercase; background-color: var(--c-blue); color: var(--c-body-bg); } .footer__wrapper .footer__wrapper-menus-menu-item-content p a:hover { background-color: var(--c-blue-2); } .footer__wrapper .footer__wrapper-menus-menu-item-content p a:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .footer__wrapper .footer__wrapper-menus-menu-item-content p a span { display: inline-block; color: var(--c-body-bg); -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 36em) { .footer__wrapper .footer__wrapper-menus-menu-item-content p a { font-size: 16px; } } .footer__wrapper .footer__wrapper-menus-menu-item-icons { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 20px; } .footer__wrapper .footer__wrapper-menus-menu-item-icons-item img { width: 30px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .footer__wrapper .footer__wrapper-menus-menu-item-icons-item img:hover { -webkit-transform: translateX(5px); transform: translateX(5px); } .footer__wrapper .footer__wrapper-menus-menu-item-list { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .footer__wrapper .footer__wrapper-menus-menu-item-list-text { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); } @media screen and (max-width: 36em) { .footer__wrapper .footer__wrapper-menus-menu-item-list-text { font-size: 16px; } } .footer__wrapper .footer__wrapper-menus-menu-item-list-item.underline a { text-decoration: underline; } .footer__wrapper .footer__wrapper-menus-menu-item-list-item a { text-decoration: none; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .footer__wrapper .footer__wrapper-menus-menu-item-list-item a:hover { opacity: 0.7; } @media screen and (max-width: 36em) { .footer__wrapper .footer__wrapper-menus-menu-item-list-item a { font-size: 16px; } } /* * ## Single --------------------------------------------- */ .singlePost { padding-block: 50px; background-color: #f6f6f7; overflow: hidden; padding-right: 0; } @media screen and (max-width: 48em) { .singlePost { padding-right: 20px; } } @media screen and (max-width: 36em) { .singlePost { padding-block: 20px; } } .singlePost__wrapper { width: 100%; max-width: var(--max-w); display: grid; grid-template-columns: repeat(7, 1fr); gap: 50px; -webkit-box-align: start; -ms-flex-align: start; align-items: start; } @media screen and (max-width: 76em) { .singlePost__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .singlePost__wrapper { grid-template-columns: 1fr; gap: 30px; } } @media screen and (max-width: 36em) { .singlePost__wrapper { gap: 20px; } } .singlePost__wrapper-back { grid-column: span 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; text-align: left; gap: 10px; font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; color: var(--c-primary); width: 100%; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; padding: 17px 15px; border-radius: 12px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } @media screen and (max-width: 36em) { .singlePost__wrapper-back { font-size: 16px; } } .singlePost__wrapper-back:hover { background-color: var(--c-gray); } .singlePost__wrapper-back img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 48em) { .singlePost__wrapper-back { grid-column: span 1; } } .singlePost__wrapper-content { grid-column: span 5; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content { gap: 40px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content { gap: 30px; grid-column: span 1; } } .singlePost__wrapper-content-header { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 20px; padding: 50px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content-header { padding: 40px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-header { padding: 40px 30px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header { padding: 30px 20px; } } .singlePost__wrapper-content-header::after { content: ""; width: calc(100vw - (100vw - var(--max-w)) / 2); height: 100%; background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/green-lines.webp); background-size: cover; position: absolute; background-position: left; -o-object-position: left; object-position: left; background-repeat: no-repeat; top: 0; left: 0; border-radius: 24px 0 0 25px; z-index: 0; } @media screen and (max-width: 48em) { .singlePost__wrapper-content-header::after { border-radius: 20px; right: auto; left: 0 !important; } } .singlePost__wrapper-content-header-wrapper { position: relative; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 20px; } .singlePost__wrapper-content-header-wrapper-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; text-transform: uppercase; } .singlePost__wrapper-content-header-wrapper-info span { color: var(--c-body-bg); } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-info { font-size: 16px; } } .singlePost__wrapper-content-header-wrapper-info i { font-size: 18px; } .singlePost__wrapper-content-header-wrapper-info i * { color: var(--c-body-bg); } .singlePost__wrapper-content-header-wrapper-title { font-family: var(--ff-primary); font-weight: 700; font-size: 48px; line-height: 52px; color: var(--c-body-bg); } @media screen and (max-width: 76em) { .singlePost__wrapper-content-header-wrapper-title { font-size: 36px; line-height: 1.2; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-header-wrapper-title { font-size: 28px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-title { font-size: 22px; } } @media screen and (max-width: 29.6875em) { .singlePost__wrapper-content-header-wrapper-title { font-size: 20px; } } .singlePost__wrapper-content-header-wrapper-tags { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 10px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; z-index: 1; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; } .singlePost__wrapper-content-header-wrapper-tags a { font-family: var(--ff-primary); font-weight: 300; font-size: 16px; line-height: 100%; color: var(--c-body-bg); border: 1px solid var(--c-body-bg); padding: 6px 12px; border-radius: 25px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .singlePost__wrapper-content-header-wrapper-tags a:hover { background-color: var(--c-body-bg); color: var(--c-green); } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-tags a { font-size: 14px; } } .singlePost__wrapper-content-header-wrapper-meta { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; z-index: 1; } .singlePost__wrapper-content-header-wrapper-meta .info-col { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 5px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -webkit-box-align: start; -ms-flex-align: start; align-items: start; text-align: left; } .singlePost__wrapper-content-header-wrapper-meta-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 6px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .singlePost__wrapper-content-header-wrapper-meta-info-excerpt { font-family: var(--ff-primary); font-weight: 300; font-size: 28px; line-height: 36px; color: var(--c-body-bg); padding-bottom: 50px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content-header-wrapper-meta-info-excerpt { font-size: 24px; line-height: 32px; padding-bottom: 40px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-header-wrapper-meta-info-excerpt { font-size: 20px; line-height: 28px; padding-bottom: 30px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-meta-info-excerpt { font-size: 18px; line-height: 24px; padding-bottom: 20px; } } @media screen and (max-width: 29.6875em) { .singlePost__wrapper-content-header-wrapper-meta-info-excerpt { font-size: 16px; line-height: 22px; padding-bottom: 10px; } } .singlePost__wrapper-content-header-wrapper-meta-info .btn-register { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); background-color: var(--c-body-bg); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-green); padding: 12px 20px; border-radius: 6px; -webkit-transition: var(--g-trans); transition: var(--g-trans); text-transform: uppercase; margin-right: 15px; } @media screen and (max-width: 48em) { .singlePost__wrapper-content-header-wrapper-meta-info .btn-register { font-size: 16px; padding: 10px 18px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-meta-info .btn-register { padding: 10px 15px; } } .singlePost__wrapper-content-header-wrapper-meta-info .btn-register:hover img { -webkit-transform: translateX(5px); transform: translateX(5px); } .singlePost__wrapper-content-header-wrapper-meta-info .btn-register img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; -webkit-filter: brightness(0) saturate(100%) invert(30%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); filter: brightness(0) saturate(100%) invert(30%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .singlePost__wrapper-content-header-wrapper-meta-info-data { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 5px; } .singlePost__wrapper-content-header-wrapper-meta-info-location { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; color: var(--c-body-bg); text-transform: uppercase; } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-meta-info-location { font-size: 16px; } } .singlePost__wrapper-content-header-wrapper-meta-info-date { font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; color: var(--c-body-bg); white-space: nowrap; } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-meta-info-date { font-size: 16px; } } .singlePost__wrapper-content-header-wrapper-meta-info-time { font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; color: var(--c-body-bg); white-space: nowrap; } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-meta-info-time { font-size: 16px; } } .singlePost__wrapper-content-header-wrapper-meta-info-author { font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; color: var(--c-body-bg); white-space: nowrap; } .singlePost__wrapper-content-header-wrapper-meta-info-author a { color: var(--c-body-bg); -webkit-transition: var(--g-trans); transition: var(--g-trans); text-decoration: underline; } .singlePost__wrapper-content-header-wrapper-meta-share { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 20px; } .singlePost__wrapper-content-header-wrapper-meta-share img { width: 21px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 36em) { .singlePost__wrapper-content-header-wrapper-meta-share img { width: 18px; } } .singlePost__wrapper-content-body { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 40px; word-break: break-word; padding-inline: 40px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content-body { gap: 30px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-body { padding-inline: 0; gap: 25px; } } .singlePost__wrapper-content-body h1 { font-weight: 700; font-size: 42px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content-body h1 { font-size: 36px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-body h1 { font-size: 32px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-body h1 { font-size: 28px; } } @media screen and (max-width: 29.6875em) { .singlePost__wrapper-content-body h1 { font-size: 22px; } } .singlePost__wrapper-content-body h2 { font-weight: 700; font-size: 36px; padding-top: 20px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content-body h2 { font-size: 32px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-body h2 { font-size: 28px; padding-top: 10px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-body h2 { font-size: 24px; } } @media screen and (max-width: 29.6875em) { .singlePost__wrapper-content-body h2 { font-size: 22px; } } .singlePost__wrapper-content-body h3, .singlePost__wrapper-content-body h4, .singlePost__wrapper-content-body h5, .singlePost__wrapper-content-body h6 { font-weight: 700; font-size: 32px; padding-top: 20px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content-body h3, .singlePost__wrapper-content-body h4, .singlePost__wrapper-content-body h5, .singlePost__wrapper-content-body h6 { font-size: 28px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-body h3, .singlePost__wrapper-content-body h4, .singlePost__wrapper-content-body h5, .singlePost__wrapper-content-body h6 { font-size: 24px; padding-top: 10px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-body h3, .singlePost__wrapper-content-body h4, .singlePost__wrapper-content-body h5, .singlePost__wrapper-content-body h6 { font-size: 22px; } } @media screen and (max-width: 29.6875em) { .singlePost__wrapper-content-body h3, .singlePost__wrapper-content-body h4, .singlePost__wrapper-content-body h5, .singlePost__wrapper-content-body h6 { font-size: 20px; } } .singlePost__wrapper-content-body a { color: var(--c-blue); text-decoration: underline; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .singlePost__wrapper-content-body a:hover { color: var(--c-blue-2); } .singlePost__wrapper-content-body ul, .singlePost__wrapper-content-body ol { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; padding-left: 20px; } .singlePost__wrapper-content-body ul li, .singlePost__wrapper-content-body ol li { list-style: disc; } .singlePost__wrapper-content-body ul li::marker, .singlePost__wrapper-content-body ol li::marker { color: var(--c-green); } .singlePost__wrapper-content-register { padding: 50px; border-radius: 24px 0 0 24px; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 20px; } @media screen and (max-width: 76em) { .singlePost__wrapper-content-register { padding: 40px 30px; } } @media screen and (max-width: 48em) { .singlePost__wrapper-content-register { padding: 30px 25px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-register { padding: 30px 20px; } } .singlePost__wrapper-content-register::after { content: ""; width: calc(100vw - (100vw - var(--max-w)) / 2); height: 100%; background: url(https://sp-ao.shortpixel.ai/client/to_webp,q_glossy,ret_img/https://www.paylynxs.com/wp-content/themes/paylynxs/dist/css/../images/green-lines.webp); background-size: cover; position: absolute; background-position: left; -o-object-position: left; object-position: left; background-repeat: no-repeat; top: 0; left: 0; border-radius: 24px 0 0 25px; background-color: var(--c-green); z-index: 0; } @media screen and (max-width: 48em) { .singlePost__wrapper-content-register::after { border-radius: 20px; right: auto; left: 0 !important; } } .singlePost__wrapper-content-register-meta { position: relative; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: start; -ms-flex-wrap: wrap; flex-wrap: wrap; } .singlePost__wrapper-content-register-meta .btn-register { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); background-color: var(--c-body-bg); font-weight: 400; font-size: 18px; line-height: 100%; color: var(--c-green); padding: 12px 20px; border-radius: 6px; -webkit-transition: var(--g-trans); transition: var(--g-trans); text-transform: uppercase; margin-right: 15px; } @media screen and (max-width: 48em) { .singlePost__wrapper-content-register-meta .btn-register { font-size: 16px; padding: 10px 18px; } } @media screen and (max-width: 36em) { .singlePost__wrapper-content-register-meta .btn-register { padding: 10px 15px; } } .singlePost__wrapper-content-register-meta .btn-register:hover img { -webkit-transform: translateX(5px); transform: translateX(5px); } .singlePost__wrapper-content-register-meta .btn-register img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; -webkit-filter: brightness(0) saturate(100%) invert(30%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); filter: brightness(0) saturate(100%) invert(30%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .singlePost__wrapper-content-register-meta-date { font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; color: var(--c-body-bg); white-space: nowrap; } @media screen and (max-width: 36em) { .singlePost__wrapper-content-register-meta-date { font-size: 16px; } } .singlePost__wrapper-content-register-meta-time { font-family: var(--ff-primary); font-weight: 300; font-size: 18px; line-height: 100%; color: var(--c-body-bg); white-space: nowrap; } @media screen and (max-width: 36em) { .singlePost__wrapper-content-register-meta-time { font-size: 16px; } } .singlePost__wrapper-content-register-socialMedias { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 20px; position: relative; z-index: 1; } .singlePost__wrapper-content-register-socialMedias a img { width: 20px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; } .relatedPosts { padding-block: 100px; background-color: #f6f6f7; padding-left: 40px; } @media screen and (max-width: 76em) { .relatedPosts { padding-block: 80px; padding-left: 30px; } } @media screen and (max-width: 48em) { .relatedPosts { padding-block: 60px; padding-left: 20px; } } @media screen and (max-width: 36em) { .relatedPosts { padding-block: 40px; } } .relatedPosts__wrapper { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 50px; } @media screen and (max-width: 76em) { .relatedPosts__wrapper { gap: 40px; } } @media screen and (max-width: 48em) { .relatedPosts__wrapper { gap: 30px; } } @media screen and (max-width: 36em) { .relatedPosts__wrapper { gap: 20px; } } .relatedPosts__wrapper-title { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-align: center; text-transform: uppercase; color: var(--c-primary); } .relatedPosts__wrapper-posts { width: 100%; } .relatedPosts__wrapper-posts .swiper { width: 100%; padding-bottom: 100px; } @media screen and (max-width: 76em) { .relatedPosts__wrapper-posts .swiper { padding-bottom: 80px; } } @media screen and (max-width: 48em) { .relatedPosts__wrapper-posts .swiper { padding-bottom: 60px; } } .relatedPosts__wrapper-posts .swiper .swiper-wrapper { width: 100%; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide { height: -webkit-fill-available !important; background-color: var(--c-body-bg); border: 1px solid #dee0e2; border-radius: 20px; padding: 25px; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content { height: 100%; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; position: relative; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content .swiper-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; text-transform: uppercase; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content .swiper-header span { color: var(--c-green); } @media screen and (max-width: 36em) { .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content .swiper-header { font-size: 16px; } } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content .swiper-header i * { color: var(--c-green) !important; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content .swiper-header img { width: 20px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; -webkit-filter: brightness(0) saturate(100%) invert(27%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); filter: brightness(0) saturate(100%) invert(27%) sepia(100%) saturate(1000%) hue-rotate(90deg) brightness(0.8); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-title { font-family: var(--ff-primary); font-weight: 700; font-size: 20px; line-height: 26px; color: var(--c-primary); } @media screen and (max-width: 48em) { .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-title { font-size: 18px; } } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-tags { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-tags a { font-family: var(--ff-primary); font-weight: 400; font-size: 16px; line-height: 1; color: var(--c-green); border: 1px solid var(--c-green); padding: 6px 12px; border-radius: 25px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-tags a:hover { background-color: var(--c-green); color: var(--c-body-bg); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-data { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; margin-top: 10px; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-data-date { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-primary); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-data-time { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 100%; text-transform: uppercase; color: var(--c-primary); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-description { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-gray-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-top: 10px; } @media screen and (max-width: 36em) { .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-description { font-size: 16px; } } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 10px; margin-top: 50px; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media screen and (max-width: 76em) { .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions { margin-top: 40px; } } @media screen and (max-width: 48em) { .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions { margin-top: 30px; } } @media screen and (max-width: 36em) { .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions { margin-top: 20px; } } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-register { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-blue); position: relative; overflow-x: hidden; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-register::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 30px); height: 2px; background-color: var(--c-blue); -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-register:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-register img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; -webkit-filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(1000%) hue-rotate(200deg) brightness(1.2); filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(1000%) hue-rotate(200deg) brightness(1.2); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-view-event { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-blue); position: relative; overflow-x: hidden; } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-view-event::after { content: ""; position: absolute; bottom: 0; left: 0; width: calc(100% - 30px); height: 2px; background-color: var(--c-blue); -webkit-transform: translateX(-100%); transform: translateX(-100%); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-view-event:hover::after { -webkit-transform: translateX(0); transform: translateX(0); } .relatedPosts__wrapper-posts .swiper .swiper-wrapper .swiper-slide-content-actions .btn-view-event img { width: 18px; aspect-ratio: 1/1; -o-object-fit: contain; object-fit: contain; -webkit-filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(1000%) hue-rotate(200deg) brightness(1.2); filter: brightness(0) saturate(100%) invert(20%) sepia(100%) saturate(1000%) hue-rotate(200deg) brightness(1.2); } .relatedPosts__wrapper-posts .swiper .swiper-button-prev, .relatedPosts__wrapper-posts .swiper .swiper-button-next { width: 40px; height: 40px; border-radius: 50%; border: 2px solid var(--c-gray-2); top: auto; bottom: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .relatedPosts__wrapper-posts .swiper .swiper-button-prev::after, .relatedPosts__wrapper-posts .swiper .swiper-button-next::after { content: ""; width: 16px; height: 2px; position: relative; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .relatedPosts__wrapper-posts .swiper .swiper-button-prev:hover, .relatedPosts__wrapper-posts .swiper .swiper-button-next:hover { background-color: var(--c-gray-2); } .relatedPosts__wrapper-posts .swiper .swiper-button-prev:hover::after, .relatedPosts__wrapper-posts .swiper .swiper-button-next:hover::after { color: var(--c-body-bg); } .relatedPosts__wrapper-posts .swiper .swiper-button-prev { left: 45%; } @media screen and (max-width: 76em) { .relatedPosts__wrapper-posts .swiper .swiper-button-prev { left: 40%; } } @media screen and (max-width: 48em) { .relatedPosts__wrapper-posts .swiper .swiper-button-prev { left: 35%; } } @media screen and (max-width: 36em) { .relatedPosts__wrapper-posts .swiper .swiper-button-prev { left: 30%; } } .relatedPosts__wrapper-posts .swiper .swiper-button-prev::after { content: "←"; font-size: 20px; font-weight: bold; color: var(--c-gray-2); background: none; width: auto; height: auto; } .relatedPosts__wrapper-posts .swiper .swiper-button-next { right: 45%; } .relatedPosts__wrapper-posts .swiper .swiper-button-next::after { content: "→"; font-size: 20px; font-weight: bold; color: var(--c-gray-2); background: none; width: auto; height: auto; } @media screen and (max-width: 76em) { .relatedPosts__wrapper-posts .swiper .swiper-button-next { right: 40%; } } @media screen and (max-width: 48em) { .relatedPosts__wrapper-posts .swiper .swiper-button-next { right: 35%; } } @media screen and (max-width: 36em) { .relatedPosts__wrapper-posts .swiper .swiper-button-next { right: 30%; } } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } @-webkit-keyframes moveLeft { from { left: 100vw; } to { left: 0; } } @keyframes moveLeft { from { left: 100vw; } to { left: 0; } } .header__menu--megamenu { background-color: #f6f6f7 !important; overflow: hidden; } .header__menu--megamenu__wrapper { max-width: var(--max-w); width: 100%; display: grid; grid-template-columns: repeat(12, 1fr); gap: 50px; } .header__menu--megamenu__wrapper-items { grid-column: span 9; display: grid; grid-template-columns: repeat(2, 1fr); gap: 50px; padding: 0; padding-block: 50px 33px; } .header__menu--megamenu__wrapper-items-section { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .header__menu--megamenu__wrapper-items-section-title a { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: var(--c-primary); -webkit-transition: var(--g-trans); transition: var(--g-trans); } .header__menu--megamenu__wrapper-items-section-title a:hover { color: var(--c-blue); } .header__menu--megamenu__wrapper-items-section-description { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-gray-2); } .header__menu--megamenu__wrapper-items-section-subtitle { font-family: var(--ff-primary); font-weight: 500; font-size: 18px; line-height: 24px; color: var(--c-primary); padding-top: 15px; } .header__menu--megamenu__wrapper-items-section-menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .header__menu--megamenu__wrapper-items-section-menu li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 7px; font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; } .header__menu--megamenu__wrapper-items-section-menu li a { color: var(--c-primary); } .header__menu--megamenu__wrapper-items-section-menu li a:hover { color: var(--c-blue); } .header__menu--megamenu__wrapper-cta { grid-column: span 3; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; padding-block: 50px 33px; z-index: 1; position: relative; } .header__menu--megamenu__wrapper-cta::after { content: ""; position: absolute; top: 0; left: -10%; width: 100vw; height: 100%; background: linear-gradient(96.4deg, #2e80d4 0.74%, #009de6 100%); z-index: -1; } .header__menu--megamenu__wrapper-cta .header__cta-title { font-family: var(--ff-primary); font-weight: 700; font-size: 24px; line-height: 100%; color: var(--c-body-bg); } .header__menu--megamenu__wrapper-cta .header__cta-subtitle { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; text-transform: uppercase; color: var(--c-body-bg); } .header__menu--megamenu__wrapper-cta .header__cta-body { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-body-bg); } .header__menu--megamenu__wrapper-cta .header__cta-button { margin-top: 15px; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; } .header__menu--megamenu__wrapper-cta .header__cta-button:hover { background-color: rgba(255, 255, 255, 0.1294117647) !important; } .header__menu--megamenu__wrapper-cta .header__cta-button:hover span { -webkit-transform: translateX(5px); transform: translateX(5px); } .header__menu--megamenu__wrapper-grid { grid-column: span 9; display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; padding-block: 50px 33px; margin-right: 50px; } .header__menu--megamenu__wrapper-grid .header__menu-item-box { padding: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 15px; border: 1px solid #dee0e2; background-color: var(--c-body-bg); border-radius: 16px; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; min-height: 100%; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .header__menu--megamenu__wrapper-grid .header__menu-item-box i { font-size: 20px; -webkit-transition: var(--g-trans); transition: var(--g-trans); } .header__menu--megamenu__wrapper-grid .header__menu-item-box:hover i * { color: var(--c-blue) !important; } .header__menu--megamenu__wrapper-grid .header__menu-item-box:hover .header__menu-item-box-text { color: var(--c-blue); } .header__menu--megamenu__wrapper-grid .header__menu-item-box .header__menu-item-box-text { font-family: var(--ff-primary); font-weight: 400; font-size: 18px; line-height: 24px; color: var(--c-primary); -webkit-transition: var(--g-trans); transition: var(--g-trans); } /*-------------------------------------------------------------- # Pages --------------------------------------------------------------*/ /*-------------------------------------------------------------- # Themes --------------------------------------------------------------*/ .after\:absolute::after{ content: var(--tw-content); position: absolute; } .after\:content-\[\'\'\]::after{ --tw-content: ''; content: var(--tw-content); } .hover\:bg-dark-blue:hover{ --tw-bg-opacity: 1; background-color: rgb(59 89 152 / var(--tw-bg-opacity)); } .hover\:bg-white:hover{ --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .hover\:text-blue:hover{ --tw-text-opacity: 1; color: rgb(55 120 186 / var(--tw-text-opacity)); } .hover\:shadow-none:hover{ --tw-shadow: 0 0 #0000; --tw-shadow-colored: 0 0 #0000; -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow); } .active\:bg-dark-blue:active{ --tw-bg-opacity: 1; background-color: rgb(59 89 152 / var(--tw-bg-opacity)); } @media (min-width: 576px){ .sm\:max-w-container-sm{ max-width: calc(576px - 40px); } } @media (min-width: 768px){ .md\:max-w-container-md{ max-width: calc(768px - 40px); } .md\:grid-cols-2{ grid-template-columns: repeat(2, minmax(0, 1fr)); } .md\:flex-row{ -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .md\:text-lg{ font-size: 1.125rem; line-height: 1.75rem; } .md\:text-3xl{ font-size: 1.875rem; line-height: 2.25rem; } .md\:text-xl{ font-size: 1.25rem; line-height: 1.75rem; } } @media (min-width: 992px){ .lg\:col-span-6{ grid-column: span 6 / span 6; } .lg\:max-w-container-lg{ max-width: calc(992px - 140px); } .lg\:justify-end{ -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .lg\:text-h1{ font-size: 2.5rem; line-height: 3rem; } .lg\:text-lg{ font-size: 1.125rem; line-height: 1.75rem; } } @media (min-width: 1280px){ .xl\:max-w-container-xl{ max-width: calc(1280px - 140px); } }