*, ::before, ::after {
box-sizing: border-box;
}
html {
direction: ltr;
font-feature-settings: "calt" 1, "clig" 1, "kern" 1, "liga" 1, "onum" 1, "pnum" 1, "case" 0, "liga", "clig";
-webkit-font-smoothing: antialiased;
font-synthesis: none;
font-variant-ligatures: common-ligatures;
height: -webkit-fill-available;
-ms-overflow-style: scrollbar;
scroll-behavior: smooth;
-webkit-tap-highlight-color: transparent;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
text-size-adjust: 100%;
text-size-adjust: 100%;
}
html,
body,body {
min-height: 100%;
}
body {
font-family: "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-family: var(--font-body);
font-size: 16px;
font-size: var(--font-size);
line-height: 1.2;
line-height: var(--font-line-height);
min-height: -webkit-fill-available;
-ms-overflow-style: none;
overflow-x: hidden;
overflow-y: scroll;
scrollbar-width: none;
text-align: left;
}
@-moz-document url-prefix() {
html {
scrollbar-width: none;
}
}
body::-webkit-scrollbar {
background: transparent;
display: none;
width: 0;
}
a {
background-color: transparent;
color: currentColor;
cursor: pointer;
text-decoration: none;
-webkit-text-decoration-skip: objects;
}
a:not([href]):not([tabindex]) {
text-decoration: none;
}
a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
color: inherit;
text-decoration: none;
}
a:not([href]):not([tabindex]):focus {
outline: 0;
}
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
margin: 0;
}
article, aside, dialog, figcaption, figure,
footer, header, hgroup, main, nav, section {
display: block;
}
ul, ol {
list-style: none;
margin: 0;
padding: 0;
}
input,
button,
textarea,
select {
font: inherit;
}
iframe {
border: 0;
}
blockquote, q {
quotes: none;
}
blockquote::before, blockquote::after, q::before, q::after {
content: "";
content: none;
}
abbr[title],
abbr[data-original-title] {
border-bottom: 0;
cursor: help;
text-decoration: underline;
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
address {
font-style: normal;
line-height: inherit;
}
b,
strong {
font-weight: bolder;
}
figure {
margin: 0;
-webkit-margin-end: 0;
-webkit-margin-start: 0;
}
img {
border-image-width: 0;
border-style: none;
height: auto;
image-rendering: -webkit-optimize-contrast;
max-width: 100%;
vertical-align: middle;
}
img[src=""] {
display: none;
}
svg:not(:root) {
image-rendering: -webkit-optimize-contrast;
overflow: visible;
}
a,
area,
button,
[role=button],
input:not([type=range]),
label,
select,
summary,
textarea {
touch-action: manipulation;
}
input, select, button, progress,
[type=button],
[type=submit],
[type=reset],
[type=search] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
text-rendering: inherit;
}
input:not(:disabled),
select:not(:disabled),
button:not(:disabled),
progress:not(:disabled),
[type=button]:not(:disabled),
[type=submit]:not(:disabled),
[type=reset]:not(:disabled),
[type=search]:not(:disabled) {
cursor: pointer;
}
progress {
vertical-align: baseline;
}
table {
border-collapse: collapse;
}
th {
text-align: inherit;
}
label {
display: inline-block;
}
select {
word-wrap: normal;
}
button,
input,
select,
textarea {
font-size: 100%;
margin: 0;
vertical-align: baseline;
*vertical-align: middle;
}
button,
input {
line-height: normal;
}
button,
select {
text-transform: none;
}
button,
html input[type=button],
input[type=reset],
input[type=submit] {
-webkit-appearance: button;
cursor: pointer;
*overflow: visible;
}
input[type=checkbox],
input[type=radio] {
box-sizing: border-box;
*height: 13px;
padding: 0;
*width: 13px;
}
[list]::-webkit-calendar-picker-indicator {
display: none;
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
-webkit-appearance: none;
-moz-appearance: none;
}
input[type=search] {
-webkit-appearance: none;
-moz-appearance: none;
box-sizing: content-box;
}
input[type=radio],
input[type=checkbox] {
box-sizing: border-box;
padding: 0;
}
input[type=date],
input[type=time],
input[type=datetime-local],
input[type=month] {
-webkit-appearance: textfield;
}
textarea {
overflow: auto;
resize: vertical;
vertical-align: top;
}
audio,
canvas,
video {
display: inline-block;
*display: inline;
max-width: 100%;
*zoom: 1;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden] {
display: none;
}
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
::-webkit-search-cancel-button,
::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-datetime-edit {
line-height: 0;
overflow: visible;
}
::-webkit-file-upload-button {
-webkit-appearance: none;
font: inherit;
}
::-webkit-datetime-edit-fields-wrapper,
::-webkit-datetime-edit-text,
::-webkit-datetime-edit-minute,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-year-field {
padding: 0;
}
::-webkit-color-swatch-wrapper {
padding: 0;
}
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
border-style: none;
padding: 0;
}
[hidden] {
display: none !important;
}
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-duration: 0.01ms !important;
}
}
/*======================================
= Modular Spacer =
======================================*/
/*=================================
= Resources =
=================================*/
@font-face {
font-display: block;
font-family: "webfont";
font-style: normal;
font-weight: 100 900;
src: url("/wp-content/themes/cybersmile-wp-main-3.1.30/assets/fonts/sans/outfit/Outfit-VariableFont_wght.ttf") format("truetype");
}
:root {
--gutter: 1rem;
--site-gutter: 1rem;
--scale-xs: 0.64rem;
--scale-sm: 0.8rem;
--scale-p: 1rem;
--scale-h5: 1.25rem;
--scale-h4: 1.5625rem;
--scale-h3: 1.953125rem;
--scale-h2: 2.44140625rem;
--scale-h1: 3.0517578125rem;
--site-max-width: 544px;
--viewportBasis: 544;
--transition-xs: 150ms;
--transition-sm: 250ms;
--transition-md: 350ms;
--transition-lg: 450ms;
}
@media (min-width: 576px) and (max-width: 768px) {
:root {
--site-max-width: 736px;
--viewportBasis: 736;
--gutter: 1rem;
--site-gutter: 1rem;
}
}
@media (min-width: 992px) and (max-width: 1200px) {
:root {
--site-max-width: 960px;
--viewportBasis: 960;
--gutter: 1.25rem;
--site-gutter: 1.25rem;
}
}
@media (min-width: 1200px) and (max-width: 1380px) {
:root {
--site-max-width: 1048px;
--viewportBasis: 1048;
--gutter: 1.563rem;
--site-gutter: 1.563rem;
}
}
@media (min-width: 1380px) {
:root {
--site-max-width: 1348px;
--viewportBasis: 1348;
--gutter: 2rem;
--site-gutter: 2rem;
}
}
:root {
--rem-p13: 5.202rem;
--rem-p12: 4.624rem;
--rem-p11: 4.11rem;
--rem-p10: 3.653rem;
--rem-p9: 2.887rem;
--rem-p8: 2.566rem;
--rem-p7: 2.281rem;
--rem-p6: 2.027rem;
--rem-p5: 1.802rem;
--rem-p4: 1.602rem;
--rem-p3: 1.424rem;
--rem-p2: 1.266rem;
--rem-p1: 1.125rem;
--rem-0: 1rem;
--rem-n1: 0.889rem;
--rem-n2: 0.79rem;
--rem-n3: 0.702rem;
--rem-n4: 0.624rem;
--rem-n5: 0.555rem;
--em-p13: 5.202em;
--em-p12: 4.624em;
--em-p11: 4.11em;
--em-p10: 3.653em;
--em-p9: 2.887em;
--em-p8: 2.566em;
--em-p7: 2.281em;
--em-p6: 2.027em;
--em-p5: 1.802em;
--em-p4: 1.602em;
--em-p3: 1.424em;
--em-p2: 1.266em;
--em-p1: 1.125em;
--em-0: 1em;
--em-n1: 0.889em;
--em-n2: 0.79em;
--em-n3: 0.702em;
--em-n4: 0.624em;
--em-n5: 0.555em;
--theme-bg: var(--color-white);
--theme-color: var(--color-black);
--theme-link-color: var(--color-primary-900);
--theme-link-accent: var(--color-primary-500);
--theme-link-accent-hover: var(--color-primary-400);
--theme-accent-rgb: var(--color-primary-500-rgb);
--theme-border-color: var(--color-slate-200);
--theme-border-radius: 0.192em;
--theme-shadow-0: rgba(var(--color-slate-300-rgb), 0.05) 0 0 0 1px;
--theme-shadow-1: rgba(var(--color-slate-200-rgb), 0.05) 0px 0px 0px 1px, rgba(var(--color-slate-200-rgb), 0.10) 0px 20px 25px -5px, rgba(var(--color-slate-200-rgb), 0.4) 0px 10px 10px -5px;
--site-max-length: 39.292em;
--font-fallback: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
--font-body: "webfont", var(--font-fallback);
--font-heading: "webfont", var(--font-fallback);
--spacing0: calc(4 / var(--viewportBasis) * 100vw);
--spacing1: calc(8 / var(--viewportBasis) * 100vw);
--spacing2: calc(16 / var(--viewportBasis) * 100vw);
--spacing3: calc(24 / var(--viewportBasis) * 100vw);
--spacing4: calc(32 / var(--viewportBasis) * 100vw);
--spacing5: calc(40 / var(--viewportBasis) * 100vw);
--spacing6: calc(60 / var(--viewportBasis) * 100vw);
--spacing7: calc(80 / var(--viewportBasis) * 100vw);
--spacing8: calc(160 / var(--viewportBasis) * 100vw);
--spacing9: calc(240 / var(--viewportBasis) * 100vw);
--spacing10: calc(320 / var(--viewportBasis) * 100vw);
--spacing11: calc(580 / var(--viewportBasis) * 100vw);
--fontSizeFluid1: calc(14 / var(--viewportBasis) * 100vw);
--fontSizeFluid2: calc(16 / var(--viewportBasis) * 100vw);
--fontSizeFluid3: calc(18 / var(--viewportBasis) * 100vw);
--fontSizeFluid4: calc(24 / var(--viewportBasis) * 100vw);
--fontSizeFluid5: calc(30 / var(--viewportBasis) * 100vw);
--fontSizeFluid6: calc(48 / var(--viewportBasis) * 100vw);
--fontSizeFluid7: calc(64 / var(--viewportBasis) * 100vw);
--fontSizeFluid8: calc(80 / var(--viewportBasis) * 100vw);
--fontSizeFluid9: calc(100 / var(--viewportBasis) * 100vw);
--spacer-0: 0;
--spacer-1: 0.444rem;
--spacer-2: 0.667rem;
--spacer-3: 1rem;
--spacer-4: 1.5rem;
--spacer-5: 2.25rem;
--font-size: 16px;
--font-line-height: 1.2;
--font-body-strong-weight: 600;
--type-heading-l: 500 1rem/1.1875 var(--font-heading);
--type-title-l: 400 1.44rem/1.2 var(--font-heading);
--type-title-s: var(--font-body-strong-weight) 0.833rem/1.2 var(--font-body);
--type-heading-h0: 700 3.815rem/1.138 var(--font-heading);
--type-heading-h1: 700 2.441rem/1.138 var(--font-heading);
--type-heading-h2: 700 1.953rem/1.2857 var(--font-heading);
--type-heading-h3: 700 1.563rem/1.2916 var(--font-heading);
--type-heading-h4: 500 1.25rem/1.222 var(--font-heading);
--type-heading-h5: var(--type-heading-l);
--type-heading-h6: 600 0.833rem/1.0833 var(--font-heading);
--type-article-p: 400 1rem/2 var(--font-body);
--type-headline: 700 56px/1.07143 var(--font-heading);
--type-subheading: 700 48px/1.16667 var(--font-heading);
--type-body: 500 16px/1.42859 var(--font-body);
--type-body-s: 500 14px/1.42859 var(--font-body);
--type-body-m: 500 16px/1.42859 var(--font-body);
--type-body-l: 500 19px/1.42859 var(--font-body);
--type-footnote: 500 12px/1.33337 var(--font-body);
--type-caption1: 500 12px/1.33337 var(--font-heading);
--type-caption2: 600 14px/1.33337 var(--font-body);
--type-title0: 700 80px/1.05 var(--font-heading);
--type-title1: 600 56px/1.07143 var(--font-heading);
--type-title2: 700 48px/1.08349 var(--font-heading);
--type-title3: 600 28px/1.14286 var(--font-heading);
--type-title4: 500 24px/1.16667 var(--font-heading);
--type-title5: 500 21px/1.14286 var(--font-heading);
--type-title6: 500 19px/1.47059 var(--font-heading);
--color-white: #FFFFFF;
--color-black: #000000;
--color-white-rgb: 255, 255, 255;
--color-black-rgb: 0, 0, 0;
--color-grey-50: #fafafa;
--color-grey-100: #f5f5f5;
--color-grey-200: #e5e5e5;
--color-grey-300: #d4d4d4;
--color-grey-400: #a3a3a3;
--color-grey-500: #737373;
--color-grey-600: #525252;
--color-grey-700: #404040;
--color-grey-800: #262626;
--color-grey-900: #171717;
--color-grey-50-rgb: 250, 250, 250;
--color-grey-100-rgb: 245, 245, 245;
--color-grey-200-rgb: 229, 229, 229;
--color-grey-300-rgb: 212, 212, 212;
--color-grey-400-rgb: 163, 163, 163;
--color-grey-500-rgb: 115, 115, 115;
--color-grey-600-rgb: 82, 82, 82;
--color-grey-700-rgb: 64, 64, 64;
--color-grey-800-rgb: 38, 38, 38;
--color-grey-900-rgb: 23, 23, 23;
--color-slate-50: #fafafa;
--color-slate-100: #f4f4f4;
--color-slate-200: #eeeeee;
--color-slate-300: #d5d5d5;
--color-slate-400: #afafaf;
--color-slate-500: #727272;
--color-slate-600: #585858;
--color-slate-700: #474747;
--color-slate-800: #262626;
--color-slate-900: #1e1e1e;
--color-slate-50-rgb: 250, 250, 250;
--color-slate-100-rgb: 244, 244, 244;
--color-slate-200-rgb: 238, 238, 238;
--color-slate-300-rgb: 213, 213, 213;
--color-slate-400-rgb: 175, 175, 175;
--color-slate-500-rgb: 114, 114, 114;
--color-slate-600-rgb: 88, 88, 88;
--color-slate-700-rgb: 71, 71, 71;
--color-slate-800-rgb: 38, 38, 38;
--color-slate-900-rgb: 30, 30, 30;
--color-slate-50: #f8fafc;
--color-slate-100: #f1f5f9;
--color-slate-200: #e2e8f0;
--color-slate-300: #cbd5e1;
--color-slate-400: #94a3b8;
--color-slate-500: #64748b;
--color-slate-600: #475569;
--color-slate-700: #334155;
--color-slate-800: #1e293b;
--color-slate-900: #0f172a;
--color-slate-50-rgb: 248, 250, 252;
--color-slate-100-rgb: 241, 245, 249;
--color-slate-200-rgb: 226, 232, 240;
--color-slate-300-rgb: 203, 213, 225;
--color-slate-400-rgb: 148, 163, 184;
--color-slate-500-rgb: 100, 116, 139;
--color-slate-600-rgb: 71, 85, 105;
--color-slate-700-rgb: 51, 65, 85;
--color-slate-800-rgb: 30, 41, 59;
--color-slate-900-rgb: 15, 23, 42;
--color-primary-50: #eaf4ff;
--color-primary-100: #bfdeff;
--color-primary-200: #95c8ff;
--color-primary-300: #80bdff;
--color-primary-400: #55a7ff;
--color-primary-500: #007bff;
--color-primary-600: #0864c7;
--color-primary-700: #09519e;
--color-primary-800: #082748;
--color-primary-900: #000a15;
--color-primary-50-rgb: 234, 244, 255;
--color-primary-100-rgb: 191, 222, 255;
--color-primary-200-rgb: 149, 200, 255;
--color-primary-300-rgb: 128, 189, 255;
--color-primary-400-rgb: 85, 167, 255;
--color-primary-500-rgb: 0, 123, 255;
--color-primary-600-rgb: 8, 100, 199;
--color-primary-700-rgb: 9, 81, 158;
--color-primary-800-rgb: 8, 39, 72;
--color-primary-900-rgb: 0, 10, 21;
--color-accent-1-50: #FFEEE4;
--color-accent-1-100: #FFD9C2;
--color-accent-1-200: #FFC5A1;
--color-accent-1-300: #FFB282;
--color-accent-1-400: #FFA46F;
--color-accent-1-500: #F79F76;
--color-accent-1-600: #FF833C;
--color-accent-1-700: #FF6E15;
--color-accent-1-800: #FF5F00;
--color-accent-1-900: #FF5100;
--color-accent-1-50-rgb: 255, 238, 228;
--color-accent-1-100-rgb: 255, 217, 194;
--color-accent-1-200-rgb: 255, 197, 161;
--color-accent-1-300-rgb: 255, 178, 130;
--color-accent-1-400-rgb: 255, 164, 111;
--color-accent-1-500-rgb: 247, 159, 118;
--color-accent-1-600-rgb: 255, 131, 60;
--color-accent-1-700-rgb: 255, 110, 21;
--color-accent-1-800-rgb: 255, 95, 0;
--color-accent-1-900-rgb: 255, 81, 0;
--color-accent-2-50: #FDE8EE;
--color-accent-2-100: #F9BFD1;
--color-accent-2-200: #F9BFD1;
--color-accent-2-300: #F3799F;
--color-accent-2-400: #F05B89;
--color-accent-2-500: #EE3F75;
--color-accent-2-600: #EC2361;
--color-accent-2-700: #E01453;
--color-accent-2-800: #CA124B;
--color-accent-2-900: #B51043;
--color-accent-2-50-rgb: 253, 232, 238;
--color-accent-2-100-rgb: 249, 191, 209;
--color-accent-2-200-rgb: 249, 191, 209;
--color-accent-2-300-rgb: 243, 121, 159;
--color-accent-2-400-rgb: 240, 91, 137;
--color-accent-2-500-rgb: 238, 63, 117;
--color-accent-2-600-rgb: 236, 35, 97;
--color-accent-2-700-rgb: 224, 20, 83;
--color-accent-2-800-rgb: 202, 18, 75;
--color-accent-2-900-rgb: 181, 16, 67;
--color-accent-3-50: #FFFBEF;
--color-accent-3-100: #FFEFC1;
--color-accent-3-200: #FFE597;
--color-accent-3-300: #FFDB72;
--color-accent-3-400: #FFD24F;
--color-accent-3-500: #FFC118;
--color-accent-3-600: #CF9700;
--color-accent-3-700: #BB8800;
--color-accent-3-800: #A87A00;
--color-accent-3-900: #77632E;
--color-accent-3-50-rgb: 255, 251, 239;
--color-accent-3-100-rgb: 255, 239, 193;
--color-accent-3-200-rgb: 255, 229, 151;
--color-accent-3-300-rgb: 255, 219, 114;
--color-accent-3-400-rgb: 255, 210, 79;
--color-accent-3-500-rgb: 255, 193, 24;
--color-accent-3-600-rgb: 207, 151, 0;
--color-accent-3-700-rgb: 187, 136, 0;
--color-accent-3-800-rgb: 168, 122, 0;
--color-accent-3-900-rgb: 119, 99, 46;
--color-hue-1-50: #ffecea;
--color-hue-1-100: #ffc7bf;
--color-hue-1-200: #ffa295;
--color-hue-1-300: #ff9080;
--color-hue-1-400: #ff6a55;
--color-hue-1-500: #ff2000;
--color-hue-1-600: #c72008;
--color-hue-1-700: #9e1b09;
--color-hue-1-800: #481008;
--color-hue-1-900: #150300;
--color-hue-2-50: #fff2ea;
--color-hue-2-100: #ffd7bf;
--color-hue-2-200: #ffbd95;
--color-hue-2-300: #ffb080;
--color-hue-2-400: #ff9555;
--color-hue-2-500: #ff6000;
--color-hue-2-600: #c75008;
--color-hue-2-700: #9e4109;
--color-hue-2-800: #482008;
--color-hue-2-900: #150800;
--color-hue-3-50: #fff7ea;
--color-hue-3-100: #ffe7bf;
--color-hue-3-200: #ffd795;
--color-hue-3-300: #ffcf80;
--color-hue-3-400: #ffbf55;
--color-hue-3-500: #ff9f00;
--color-hue-3-600: #c77f08;
--color-hue-3-700: #9e6609;
--color-hue-3-800: #483008;
--color-hue-3-900: #150d00;
--color-hue-4-50: #fffcea;
--color-hue-4-100: #fff7bf;
--color-hue-4-200: #fff295;
--color-hue-4-300: #ffef80;
--color-hue-4-400: #ffea55;
--color-hue-4-500: #ffdf00;
--color-hue-4-600: #c7af08;
--color-hue-4-700: #9e8b09;
--color-hue-4-800: #484008;
--color-hue-4-900: #151300;
--color-hue-5-50: #fdffea;
--color-hue-5-100: #f8ffbf;
--color-hue-5-200: #f3ff95;
--color-hue-5-300: #f1ff80;
--color-hue-5-400: #ecff55;
--color-hue-5-500: #e3ff00;
--color-hue-5-600: #b2c708;
--color-hue-5-700: #8d9e09;
--color-hue-5-800: #414808;
--color-hue-5-900: #131500;
--color-hue-6-50: #f7ffea;
--color-hue-6-100: #e7ffbf;
--color-hue-6-200: #d6ff95;
--color-hue-6-300: #ceff80;
--color-hue-6-400: #beff55;
--color-hue-6-500: #9dff00;
--color-hue-6-600: #7ec708;
--color-hue-6-700: #649e09;
--color-hue-6-800: #304808;
--color-hue-6-900: #0d1500;
--color-hue-7-50: #eafff2;
--color-hue-7-100: #bfffd8;
--color-hue-7-200: #95ffbe;
--color-hue-7-300: #80ffb2;
--color-hue-7-400: #55ff98;
--color-hue-7-500: #00ff64;
--color-hue-7-600: #08c753;
--color-hue-7-700: #099e43;
--color-hue-7-800: #084821;
--color-hue-7-900: #001508;
--color-hue-8-50: #eafaff;
--color-hue-8-100: #bfefff;
--color-hue-8-200: #95e4ff;
--color-hue-8-300: #80deff;
--color-hue-8-400: #55d3ff;
--color-hue-8-500: #00bdff;
--color-hue-8-600: #0896c7;
--color-hue-8-700: #09779e;
--color-hue-8-800: #083848;
--color-hue-8-900: #001015;
--color-hue-9-50: #eaecff;
--color-hue-9-100: #bfc6ff;
--color-hue-9-200: #959fff;
--color-hue-9-300: #808cff;
--color-hue-9-400: #5566ff;
--color-hue-9-500: #0019ff;
--color-hue-9-600: #081bc7;
--color-hue-9-700: #09179e;
--color-hue-9-800: #080f48;
--color-hue-9-900: #000215;
--color-hue-10-50: #f9eaff;
--color-hue-10-100: #edbfff;
--color-hue-10-200: #e195ff;
--color-hue-10-300: #dc80ff;
--color-hue-10-400: #d055ff;
--color-hue-10-500: #b800ff;
--color-hue-10-600: #9208c7;
--color-hue-10-700: #74099e;
--color-hue-10-800: #360848;
--color-hue-10-900: #0f0015;
--color-hue-11-50: #ffeaf9;
--color-hue-11-100: #ffbfee;
--color-hue-11-200: #ff95e3;
--color-hue-11-300: #ff80dd;
--color-hue-11-400: #ff55d2;
--color-hue-11-500: #ff00bb;
--color-hue-11-600: #c70894;
--color-hue-11-700: #9e0976;
--color-hue-11-800: #480837;
--color-hue-11-900: #150010;
--color-hue-12-50: #ffeaef;
--color-hue-12-100: #ffbfcf;
--color-hue-12-200: #ff95af;
--color-hue-12-300: #ff80a0;
--color-hue-12-400: #ff5580;
--color-hue-12-500: #ff0040;
--color-hue-12-600: #c70838;
--color-hue-12-700: #9e092e;
--color-hue-12-800: #480818;
--color-hue-12-900: #150005;
--color-success-50: #eafff2;
--color-success-100: #bfffd8;
--color-success-200: #95ffbe;
--color-success-300: #80ffb2;
--color-success-400: #55ff98;
--color-success-500: #00ff64;
--color-success-600: #08c753;
--color-success-700: #099e43;
--color-success-800: #084821;
--color-success-900: #001508;
--color-danger-50: #ffecea;
--color-danger-100: #ffc7bf;
--color-danger-200: #ffa295;
--color-danger-300: #ff9080;
--color-danger-400: #ff6a55;
--color-danger-500: #ff2000;
--color-danger-600: #c72008;
--color-danger-700: #9e1b09;
--color-danger-800: #481008;
--color-danger-900: #150300;
--color-warning-50: #fff7ea;
--color-warning-100: #ffe7bf;
--color-warning-200: #ffd795;
--color-warning-300: #ffcf80;
--color-warning-400: #ffbf55;
--color-warning-500: #ff9f00;
--color-warning-600: #c77f08;
--color-warning-700: #9e6609;
--color-warning-800: #483008;
--color-warning-900: #150d00;
--color-info-50: #eaecff;
--color-info-100: #bfc6ff;
--color-info-200: #959fff;
--color-info-300: #808cff;
--color-info-400: #5566ff;
--color-info-500: #0019ff;
--color-info-600: #081bc7;
--color-info-700: #09179e;
--color-info-800: #080f48;
--color-info-900: #000215;
--color-success-50-neutral: #effaf3;
--color-success-100-neutral: #cef0db;
--color-success-200-neutral: #ade7c4;
--color-success-300-neutral: #9de2b8;
--color-success-400-neutral: #7cd8a0;
--color-success-500-neutral: #3bc471;
--color-success-600-neutral: #349b5c;
--color-success-700-neutral: #2b7c4b;
--color-success-800-neutral: #173924;
--color-success-900-neutral: #051009;
--color-danger-50-neutral: #faf0ef;
--color-danger-100-neutral: #f0d2ce;
--color-danger-200-neutral: #e7b4ad;
--color-danger-300-neutral: #e2a69d;
--color-danger-400-neutral: #d8877c;
--color-danger-500-neutral: #c44c3b;
--color-danger-600-neutral: #9b4134;
--color-danger-700-neutral: #7c352b;
--color-danger-800-neutral: #391b17;
--color-danger-900-neutral: #100605;
--color-warning-50-neutral: #fcf6ed;
--color-warning-100-neutral: #f7e5c7;
--color-warning-200-neutral: #f1d4a3;
--color-warning-300-neutral: #eecb91;
--color-warning-400-neutral: #e9ba6b;
--color-warning-500-neutral: #de9721;
--color-warning-600-neutral: #ae7921;
--color-warning-700-neutral: #8b611c;
--color-warning-800-neutral: #402e10;
--color-warning-900-neutral: #120c03;
--color-info-50-neutral: #f1f1f8;
--color-info-100-neutral: #d3d6eb;
--color-info-200-neutral: #b6bade;
--color-info-300-neutral: #a7acd8;
--color-info-400-neutral: #8a90ca;
--color-info-500-neutral: #4f59b0;
--color-info-600-neutral: #434a8c;
--color-info-700-neutral: #373d70;
--color-info-800-neutral: #1c1f34;
--color-info-900-neutral: #07070e;
--color-hue-1-50-rgb: 255, 236, 234;
--color-hue-1-100-rgb: 255, 199, 191;
--color-hue-1-200-rgb: 255, 162, 149;
--color-hue-1-300-rgb: 255, 144, 128;
--color-hue-1-400-rgb: 255, 106, 85;
--color-hue-1-500-rgb: 255, 32, 0;
--color-hue-1-600-rgb: 199, 32, 8;
--color-hue-1-700-rgb: 158, 27, 9;
--color-hue-1-800-rgb: 72, 16, 8;
--color-hue-1-900-rgb: 21, 3, 0;
--color-hue-2-50-rgb: 255, 242, 234;
--color-hue-2-100-rgb: 255, 215, 191;
--color-hue-2-200-rgb: 255, 189, 149;
--color-hue-2-300-rgb: 255, 176, 128;
--color-hue-2-400-rgb: 255, 149, 85;
--color-hue-2-500-rgb: 255, 96, 0;
--color-hue-2-600-rgb: 199, 80, 8;
--color-hue-2-700-rgb: 158, 65, 9;
--color-hue-2-800-rgb: 72, 32, 8;
--color-hue-2-900-rgb: 21, 8, 0;
--color-hue-3-50-rgb: 255, 247, 234;
--color-hue-3-100-rgb: 255, 231, 191;
--color-hue-3-200-rgb: 255, 215, 149;
--color-hue-3-300-rgb: 255, 207, 128;
--color-hue-3-400-rgb: 255, 191, 85;
--color-hue-3-500-rgb: 255, 159, 0;
--color-hue-3-600-rgb: 199, 127, 8;
--color-hue-3-700-rgb: 158, 102, 9;
--color-hue-3-800-rgb: 72, 48, 8;
--color-hue-3-900-rgb: 21, 13, 0;
--color-hue-4-50-rgb: 255, 252, 234;
--color-hue-4-100-rgb: 255, 247, 191;
--color-hue-4-200-rgb: 255, 242, 149;
--color-hue-4-300-rgb: 255, 239, 128;
--color-hue-4-400-rgb: 255, 234, 85;
--color-hue-4-500-rgb: 255, 223, 0;
--color-hue-4-600-rgb: 199, 175, 8;
--color-hue-4-700-rgb: 158, 139, 9;
--color-hue-4-800-rgb: 72, 64, 8;
--color-hue-4-900-rgb: 21, 19, 0;
--color-hue-5-50-rgb: 253, 255, 234;
--color-hue-5-100-rgb: 248, 255, 191;
--color-hue-5-200-rgb: 243, 255, 149;
--color-hue-5-300-rgb: 241, 255, 128;
--color-hue-5-400-rgb: 236, 255, 85;
--color-hue-5-500-rgb: 227, 255, 0;
--color-hue-5-600-rgb: 178, 199, 8;
--color-hue-5-700-rgb: 141, 158, 9;
--color-hue-5-800-rgb: 65, 72, 8;
--color-hue-5-900-rgb: 19, 21, 0;
--color-hue-6-50-rgb: 247, 255, 234;
--color-hue-6-100-rgb: 231, 255, 191;
--color-hue-6-200-rgb: 214, 255, 149;
--color-hue-6-300-rgb: 206, 255, 128;
--color-hue-6-400-rgb: 190, 255, 85;
--color-hue-6-500-rgb: 157, 255, 0;
--color-hue-6-600-rgb: 126, 199, 8;
--color-hue-6-700-rgb: 100, 158, 9;
--color-hue-6-800-rgb: 48, 72, 8;
--color-hue-6-900-rgb: 13, 21, 0;
--color-hue-7-50-rgb: 234, 255, 242;
--color-hue-7-100-rgb: 191, 255, 216;
--color-hue-7-200-rgb: 149, 255, 190;
--color-hue-7-300-rgb: 128, 255, 178;
--color-hue-7-400-rgb: 85, 255, 152;
--color-hue-7-500-rgb: 0, 255, 100;
--color-hue-7-600-rgb: 8, 199, 83;
--color-hue-7-700-rgb: 9, 158, 67;
--color-hue-7-800-rgb: 8, 72, 33;
--color-hue-7-900-rgb: 0, 21, 8;
--color-hue-8-50-rgb: 234, 250, 255;
--color-hue-8-100-rgb: 191, 239, 255;
--color-hue-8-200-rgb: 149, 228, 255;
--color-hue-8-300-rgb: 128, 222, 255;
--color-hue-8-400-rgb: 85, 211, 255;
--color-hue-8-500-rgb: 0, 189, 255;
--color-hue-8-600-rgb: 8, 150, 199;
--color-hue-8-700-rgb: 9, 119, 158;
--color-hue-8-800-rgb: 8, 56, 72;
--color-hue-8-900-rgb: 0, 16, 21;
--color-hue-9-50-rgb: 234, 236, 255;
--color-hue-9-100-rgb: 191, 198, 255;
--color-hue-9-200-rgb: 149, 159, 255;
--color-hue-9-300-rgb: 128, 140, 255;
--color-hue-9-400-rgb: 85, 102, 255;
--color-hue-9-500-rgb: 0, 25, 255;
--color-hue-9-600-rgb: 8, 27, 199;
--color-hue-9-700-rgb: 9, 23, 158;
--color-hue-9-800-rgb: 8, 15, 72;
--color-hue-9-900-rgb: 0, 2, 21;
--color-hue-10-50-rgb: 249, 234, 255;
--color-hue-10-100-rgb: 237, 191, 255;
--color-hue-10-200-rgb: 225, 149, 255;
--color-hue-10-300-rgb: 220, 128, 255;
--color-hue-10-400-rgb: 208, 85, 255;
--color-hue-10-500-rgb: 184, 0, 255;
--color-hue-10-600-rgb: 146, 8, 199;
--color-hue-10-700-rgb: 116, 9, 158;
--color-hue-10-800-rgb: 54, 8, 72;
--color-hue-10-900-rgb: 15, 0, 21;
--color-hue-11-50-rgb: 255, 234, 249;
--color-hue-11-100-rgb: 255, 191, 238;
--color-hue-11-200-rgb: 255, 149, 227;
--color-hue-11-300-rgb: 255, 128, 221;
--color-hue-11-400-rgb: 255, 85, 210;
--color-hue-11-500-rgb: 255, 0, 187;
--color-hue-11-600-rgb: 199, 8, 148;
--color-hue-11-700-rgb: 158, 9, 118;
--color-hue-11-800-rgb: 72, 8, 55;
--color-hue-11-900-rgb: 21, 0, 16;
--color-hue-12-50-rgb: 255, 234, 239;
--color-hue-12-100-rgb: 255, 191, 207;
--color-hue-12-200-rgb: 255, 149, 175;
--color-hue-12-300-rgb: 255, 128, 160;
--color-hue-12-400-rgb: 255, 85, 128;
--color-hue-12-500-rgb: 255, 0, 64;
--color-hue-12-600-rgb: 199, 8, 56;
--color-hue-12-700-rgb: 158, 9, 46;
--color-hue-12-800-rgb: 72, 8, 24;
--color-hue-12-900-rgb: 21, 0, 5;
--color-success-50-rgb: 234, 255, 242;
--color-success-100-rgb: 191, 255, 216;
--color-success-200-rgb: 149, 255, 190;
--color-success-300-rgb: 128, 255, 178;
--color-success-400-rgb: 85, 255, 152;
--color-success-500-rgb: 0, 255, 100;
--color-success-600-rgb: 8, 199, 83;
--color-success-700-rgb: 9, 158, 67;
--color-success-800-rgb: 8, 72, 33;
--color-success-900-rgb: 0, 21, 8;
--color-danger-50-rgb: 255, 236, 234;
--color-danger-100-rgb: 255, 199, 191;
--color-danger-200-rgb: 255, 162, 149;
--color-danger-300-rgb: 255, 144, 128;
--color-danger-400-rgb: 255, 106, 85;
--color-danger-500-rgb: 255, 32, 0;
--color-danger-600-rgb: 199, 32, 8;
--color-danger-700-rgb: 158, 27, 9;
--color-danger-800-rgb: 72, 16, 8;
--color-danger-900-rgb: 21, 3, 0;
--color-warning-50-rgb: 255, 247, 234;
--color-warning-100-rgb: 255, 231, 191;
--color-warning-200-rgb: 255, 215, 149;
--color-warning-300-rgb: 255, 207, 128;
--color-warning-400-rgb: 255, 191, 85;
--color-warning-500-rgb: 255, 159, 0;
--color-warning-600-rgb: 199, 127, 8;
--color-warning-700-rgb: 158, 102, 9;
--color-warning-800-rgb: 72, 48, 8;
--color-warning-900-rgb: 21, 13, 0;
--color-info-50-rgb: 234, 236, 255;
--color-info-100-rgb: 191, 198, 255;
--color-info-200-rgb: 149, 159, 255;
--color-info-300-rgb: 128, 140, 255;
--color-info-400-rgb: 85, 102, 255;
--color-info-500-rgb: 0, 25, 255;
--color-info-600-rgb: 8, 27, 199;
--color-info-700-rgb: 9, 23, 158;
--color-info-800-rgb: 8, 15, 72;
--color-info-900-rgb: 0, 2, 21;
--color-blue-rgb: 0, 123, 255;
--color-blue-lightest: #C2DFFF;
--color-blue-light: #70B5FF;
--color-blue: #007bff;
--color-blue-dark: #00458F;
--color-yellow-rgb: 249, 215, 28;
--color-yellow-lightest: #FCEE9C;
--color-yellow-light: #F9E04D;
--color-yellow: #ECCA09;
--color-yellow-dark: #9D8706;
--color-orange-rgb: 255, 85, 0;
--color-orange-lightest: #FFC9AD;
--color-orange-light: #FFAD85;
--color-orange: #ff5500;
--color-orange-dark: #B83D00;
--color-green-rgb: 40, 167, 69;
--color-green-lightest: #a5d6a7;
--color-green-light: #6cce5d;
--color-green: #28a745;
--color-green-dark: #00b300;
--color-red-rgb: 220, 53, 69;
--color-red-lightest: #F3BABF;
--color-red-light: #EA868E;
--color-red: #dc3545;
--color-red-dark: #79151E;
--color-pink-rgb: 255, 105, 180;
--color-pink-lightest: #FFC2E0;
--color-pink-light: #FF85C2;
--color-pink: #FF47A3;
--color-pink-dark: #8F0047;
--color-grey-darkest: #343a40;
--color-grey-darker: #495057;
--color-grey-dark: #868e96;
--color-grey-medium: #adb5bd;
--color-grey: #6c757d;
--color-grey-light: #d2d2d2;
--color-grey-lighter: #e9ecef;
--color-grey-lightest: #f8f9fa;
--color-darkGreen-rgb: 0, 128, 128;
--color-darkGreen-lightest: #ADFFFF;
--color-darkGreen-light: #70FFFF;
--color-darkGreen: #008080;
--color-darkGreen-dark: #005252;
--color-purple-rgb: 102, 16, 242;
--color-purple-lightest: #DAC5FC;
--color-purple-light: #A977F8;
--color-purple: #6610f2;
--color-purple-dark: #380788;
--color-rose-rgb: 196, 24, 60;
--color-rose-lightest: #f2c2d0;
--color-rose-light: #d95a8e;
--color-rose: #c4183c;
--color-rose-dark: #a31533;
}
/*==================================
= Typography =
==================================*/
p,
ul,
ol,
form,
table,
pre {
text-indent: 0;
}
p:not(:last-child),
ul:not(:last-child),
ol:not(:last-child),
form:not(:last-child),
table:not(:last-child),
pre:not(:last-child) {
margin-bottom: 1em;
}
strong {
font-weight: bold;
}
small {
display: inline-block;
font-size: 80%;
}
ul,
ol {
list-style-position: inside;
}
li {
-moz-column-break-inside: avoid;
break-inside: avoid-column;
-webkit-column-break-inside: avoid;
}
/*===================================
= Grid System =
===================================*/
/*=========================================
= Display Utilities =
=========================================*/
.d-none {
display: none;
}
.d-inline {
display: inline;
}
.d-inline-block {
display: inline-block;
}
.d-block {
display: block;
}
.d-flex {
display: flex;
}
.d-grid {
display: grid;
}
@media (min-width: 576px) {
.d-sm-none {
display: none;
}
.d-sm-inline {
display: inline;
}
.d-sm-inline-block {
display: inline-block;
}
.d-sm-block {
display: block;
}
.d-sm-flex {
display: flex;
}
.d-sm-grid {
display: grid;
}
}
@media (min-width: 992px) {
.d-md-none {
display: none;
}
.d-md-inline {
display: inline;
}
.d-md-inline-block {
display: inline-block;
}
.d-md-block {
display: block;
}
.d-md-flex {
display: flex;
}
.d-md-grid {
display: grid;
}
}
@media (min-width: 1200px) {
.d-lg-none {
display: none;
}
.d-lg-inline {
display: inline;
}
.d-lg-inline-block {
display: inline-block;
}
.d-lg-block {
display: block;
}
.d-lg-flex {
display: flex;
}
.d-lg-grid {
display: grid;
}
}
@media (min-width: 1380px) {
.d-xl-none {
display: none;
}
.d-xl-inline {
display: inline;
}
.d-xl-inline-block {
display: inline-block;
}
.d-xl-block {
display: block;
}
.d-xl-flex {
display: flex;
}
.d-xl-grid {
display: grid;
}
}
@media (min-width: 1480px) {
.d-xxl-none {
display: none;
}
.d-xxl-inline {
display: inline;
}
.d-xxl-inline-block {
display: inline-block;
}
.d-xxl-block {
display: block;
}
.d-xxl-flex {
display: flex;
}
.d-xxl-grid {
display: grid;
}
}
/*======================================
= Flex Utilities =
======================================*/
.flex-row {
flex-direction: row !important;
}
.flex-column {
flex-direction: column !important;
}
.flex-wrap {
flex-wrap: wrap !important;
}
.justify-content-start {
justify-content: flex-start !important;
}
.justify-content-end {
justify-content: flex-end !important;
}
.justify-content-center {
justify-content: center !important;
}
.justify-content-between {
justify-content: space-between !important;
}
.justify-content-around {
justify-content: space-around !important;
}
.align-items-start {
align-items: flex-start !important;
}
.align-items-end {
align-items: flex-end !important;
}
.align-items-center {
align-items: center !important;
}
.align-items-baseline {
align-items: baseline !important;
}
.align-items-stretch {
align-items: stretch !important;
}
@media (min-width: 576px) {
.flex-sm-row {
flex-direction: row !important;
}
.flex-sm-column {
flex-direction: column !important;
}
.flex-sm-wrap {
flex-wrap: wrap !important;
}
.justify-content-sm-start {
justify-content: flex-start !important;
}
.justify-content-sm-end {
justify-content: flex-end !important;
}
.justify-content-sm-center {
justify-content: center !important;
}
.justify-content-sm-between {
justify-content: space-between !important;
}
.justify-content-sm-around {
justify-content: space-around !important;
}
.align-items-sm-start {
align-items: flex-start !important;
}
.align-items-sm-end {
align-items: flex-end !important;
}
.align-items-sm-center {
align-items: center !important;
}
.align-items-sm-baseline {
align-items: baseline !important;
}
.align-items-sm-stretch {
align-items: stretch !important;
}
}
@media (min-width: 992px) {
.flex-md-row {
flex-direction: row !important;
}
.flex-md-column {
flex-direction: column !important;
}
.flex-md-wrap {
flex-wrap: wrap !important;
}
.justify-content-md-start {
justify-content: flex-start !important;
}
.justify-content-md-end {
justify-content: flex-end !important;
}
.justify-content-md-center {
justify-content: center !important;
}
.justify-content-md-between {
justify-content: space-between !important;
}
.justify-content-md-around {
justify-content: space-around !important;
}
.align-items-md-start {
align-items: flex-start !important;
}
.align-items-md-end {
align-items: flex-end !important;
}
.align-items-md-center {
align-items: center !important;
}
.align-items-md-baseline {
align-items: baseline !important;
}
.align-items-md-stretch {
align-items: stretch !important;
}
}
@media (min-width: 1200px) {
.flex-lg-row {
flex-direction: row !important;
}
.flex-lg-column {
flex-direction: column !important;
}
.flex-lg-wrap {
flex-wrap: wrap !important;
}
.justify-content-lg-start {
justify-content: flex-start !important;
}
.justify-content-lg-end {
justify-content: flex-end !important;
}
.justify-content-lg-center {
justify-content: center !important;
}
.justify-content-lg-between {
justify-content: space-between !important;
}
.justify-content-lg-around {
justify-content: space-around !important;
}
.align-items-lg-start {
align-items: flex-start !important;
}
.align-items-lg-end {
align-items: flex-end !important;
}
.align-items-lg-center {
align-items: center !important;
}
.align-items-lg-baseline {
align-items: baseline !important;
}
.align-items-lg-stretch {
align-items: stretch !important;
}
}
@media (min-width: 1380px) {
.flex-xl-row {
flex-direction: row !important;
}
.flex-xl-column {
flex-direction: column !important;
}
.flex-xl-wrap {
flex-wrap: wrap !important;
}
.justify-content-xl-start {
justify-content: flex-start !important;
}
.justify-content-xl-end {
justify-content: flex-end !important;
}
.justify-content-xl-center {
justify-content: center !important;
}
.justify-content-xl-between {
justify-content: space-between !important;
}
.justify-content-xl-around {
justify-content: space-around !important;
}
.align-items-xl-start {
align-items: flex-start !important;
}
.align-items-xl-end {
align-items: flex-end !important;
}
.align-items-xl-center {
align-items: center !important;
}
.align-items-xl-baseline {
align-items: baseline !important;
}
.align-items-xl-stretch {
align-items: stretch !important;
}
}
@media (min-width: 1480px) {
.flex-xxl-row {
flex-direction: row !important;
}
.flex-xxl-column {
flex-direction: column !important;
}
.flex-xxl-wrap {
flex-wrap: wrap !important;
}
.justify-content-xxl-start {
justify-content: flex-start !important;
}
.justify-content-xxl-end {
justify-content: flex-end !important;
}
.justify-content-xxl-center {
justify-content: center !important;
}
.justify-content-xxl-between {
justify-content: space-between !important;
}
.justify-content-xxl-around {
justify-content: space-around !important;
}
.align-items-xxl-start {
align-items: flex-start !important;
}
.align-items-xxl-end {
align-items: flex-end !important;
}
.align-items-xxl-center {
align-items: center !important;
}
.align-items-xxl-baseline {
align-items: baseline !important;
}
.align-items-xxl-stretch {
align-items: stretch !important;
}
}
/*========================================
= Margin Utilities =
========================================*/
.m-0 {
margin: 0 0 !important;
}
.my-0, .mt-0 {
margin-top: 0 !important;
}
.my-0, .mb-0 {
margin-bottom: 0 !important;
}
.mx-0, .mr-0 {
margin-right: 0 !important;
}
.mx-0, .ml-0 {
margin-left: 0 !important;
}
.m-1 {
margin: 0.444rem 0.444rem !important;
margin: var(--spacer-1) var(--spacer-1) !important;
}
.mx-1, .mr-1 {
margin-right: 0.444rem !important;
margin-right: var(--spacer-1) !important;
}
.mx-1, .ml-1 {
margin-left: 0.444rem !important;
margin-left: var(--spacer-1) !important;
}
.my-1, .mt-1 {
margin-top: 0.444rem !important;
margin-top: var(--spacer-1) !important;
}
.my-1, .mb-1 {
margin-bottom: 0.444rem !important;
margin-bottom: var(--spacer-1) !important;
}
.m-2 {
margin: 0.667rem 0.667rem !important;
margin: var(--spacer-2) var(--spacer-2) !important;
}
.mx-2, .mr-2 {
margin-right: 0.667rem !important;
margin-right: var(--spacer-2) !important;
}
.mx-2, .ml-2 {
margin-left: 0.667rem !important;
margin-left: var(--spacer-2) !important;
}
.my-2, .mt-2 {
margin-top: 0.667rem !important;
margin-top: var(--spacer-2) !important;
}
.my-2, .mb-2 {
margin-bottom: 0.667rem !important;
margin-bottom: var(--spacer-2) !important;
}
.m-3 {
margin: 1rem 1rem !important;
margin: var(--spacer-3) var(--spacer-3) !important;
}
.mx-3, .mr-3 {
margin-right: 1rem !important;
margin-right: var(--spacer-3) !important;
}
.mx-3, .ml-3 {
margin-left: 1rem !important;
margin-left: var(--spacer-3) !important;
}
.my-3, .mt-3 {
margin-top: 1rem !important;
margin-top: var(--spacer-3) !important;
}
.my-3, .mb-3 {
margin-bottom: 1rem !important;
margin-bottom: var(--spacer-3) !important;
}
.m-4 {
margin: 1.5rem 1.5rem !important;
margin: var(--spacer-4) var(--spacer-4) !important;
}
.mx-4, .mr-4 {
margin-right: 1.5rem !important;
margin-right: var(--spacer-4) !important;
}
.mx-4, .ml-4 {
margin-left: 1.5rem !important;
margin-left: var(--spacer-4) !important;
}
.my-4, .mt-4 {
margin-top: 1.5rem !important;
margin-top: var(--spacer-4) !important;
}
.my-4, .mb-4 {
margin-bottom: 1.5rem !important;
margin-bottom: var(--spacer-4) !important;
}
.m-5 {
margin: 2.25rem 2.25rem !important;
margin: var(--spacer-5) var(--spacer-5) !important;
}
.mx-5, .mr-5 {
margin-right: 2.25rem !important;
margin-right: var(--spacer-5) !important;
}
.mx-5, .ml-5 {
margin-left: 2.25rem !important;
margin-left: var(--spacer-5) !important;
}
.my-5, .mt-5 {
margin-top: 2.25rem !important;
margin-top: var(--spacer-5) !important;
}
.my-5, .mb-5 {
margin-bottom: 2.25rem !important;
margin-bottom: var(--spacer-5) !important;
}
.m-auto {
margin: auto !important;
}
.my-auto, .mt-auto {
margin-top: auto !important;
}
.my-auto, .mb-auto {
margin-bottom: auto !important;
}
.mx-auto, .mr-auto {
margin-right: auto !important;
}
.mx-auto, .ml-auto {
margin-left: auto !important;
}
@media (min-width: 576px) {
.m-sm-0 {
margin: 0 0 !important;
}
.my-sm-0, .mt-sm-0 {
margin-top: 0 !important;
}
.my-sm-0, .mb-sm-0 {
margin-bottom: 0 !important;
}
.mx-sm-0, .mr-sm-0 {
margin-right: 0 !important;
}
.mx-sm-0, .ml-sm-0 {
margin-left: 0 !important;
}
.m-sm-1 {
margin: 0.444rem 0.444rem !important;
margin: var(--spacer-1) var(--spacer-1) !important;
}
.mx-sm-1, .mr-sm-1 {
margin-right: 0.444rem !important;
margin-right: var(--spacer-1) !important;
}
.mx-sm-1, .ml-sm-1 {
margin-left: 0.444rem !important;
margin-left: var(--spacer-1) !important;
}
.my-sm-1, .mt-sm-1 {
margin-top: 0.444rem !important;
margin-top: var(--spacer-1) !important;
}
.my-sm-1, .mb-sm-1 {
margin-bottom: 0.444rem !important;
margin-bottom: var(--spacer-1) !important;
}
.m-sm-2 {
margin: 0.667rem 0.667rem !important;
margin: var(--spacer-2) var(--spacer-2) !important;
}
.mx-sm-2, .mr-sm-2 {
margin-right: 0.667rem !important;
margin-right: var(--spacer-2) !important;
}
.mx-sm-2, .ml-sm-2 {
margin-left: 0.667rem !important;
margin-left: var(--spacer-2) !important;
}
.my-sm-2, .mt-sm-2 {
margin-top: 0.667rem !important;
margin-top: var(--spacer-2) !important;
}
.my-sm-2, .mb-sm-2 {
margin-bottom: 0.667rem !important;
margin-bottom: var(--spacer-2) !important;
}
.m-sm-3 {
margin: 1rem 1rem !important;
margin: var(--spacer-3) var(--spacer-3) !important;
}
.mx-sm-3, .mr-sm-3 {
margin-right: 1rem !important;
margin-right: var(--spacer-3) !important;
}
.mx-sm-3, .ml-sm-3 {
margin-left: 1rem !important;
margin-left: var(--spacer-3) !important;
}
.my-sm-3, .mt-sm-3 {
margin-top: 1rem !important;
margin-top: var(--spacer-3) !important;
}
.my-sm-3, .mb-sm-3 {
margin-bottom: 1rem !important;
margin-bottom: var(--spacer-3) !important;
}
.m-sm-4 {
margin: 1.5rem 1.5rem !important;
margin: var(--spacer-4) var(--spacer-4) !important;
}
.mx-sm-4, .mr-sm-4 {
margin-right: 1.5rem !important;
margin-right: var(--spacer-4) !important;
}
.mx-sm-4, .ml-sm-4 {
margin-left: 1.5rem !important;
margin-left: var(--spacer-4) !important;
}
.my-sm-4, .mt-sm-4 {
margin-top: 1.5rem !important;
margin-top: var(--spacer-4) !important;
}
.my-sm-4, .mb-sm-4 {
margin-bottom: 1.5rem !important;
margin-bottom: var(--spacer-4) !important;
}
.m-sm-5 {
margin: 2.25rem 2.25rem !important;
margin: var(--spacer-5) var(--spacer-5) !important;
}
.mx-sm-5, .mr-sm-5 {
margin-right: 2.25rem !important;
margin-right: var(--spacer-5) !important;
}
.mx-sm-5, .ml-sm-5 {
margin-left: 2.25rem !important;
margin-left: var(--spacer-5) !important;
}
.my-sm-5, .mt-sm-5 {
margin-top: 2.25rem !important;
margin-top: var(--spacer-5) !important;
}
.my-sm-5, .mb-sm-5 {
margin-bottom: 2.25rem !important;
margin-bottom: var(--spacer-5) !important;
}
.m-sm-auto {
margin: auto !important;
}
.my-sm-auto, .mt-sm-auto {
margin-top: auto !important;
}
.my-sm-auto, .mb-sm-auto {
margin-bottom: auto !important;
}
.mx-sm-auto, .mr-sm-auto {
margin-right: auto !important;
}
.mx-sm-auto, .ml-sm-auto {
margin-left: auto !important;
}
}
@media (min-width: 992px) {
.m-md-0 {
margin: 0 0 !important;
}
.my-md-0, .mt-md-0 {
margin-top: 0 !important;
}
.my-md-0, .mb-md-0 {
margin-bottom: 0 !important;
}
.mx-md-0, .mr-md-0 {
margin-right: 0 !important;
}
.mx-md-0, .ml-md-0 {
margin-left: 0 !important;
}
.m-md-1 {
margin: 0.444rem 0.444rem !important;
margin: var(--spacer-1) var(--spacer-1) !important;
}
.mx-md-1, .mr-md-1 {
margin-right: 0.444rem !important;
margin-right: var(--spacer-1) !important;
}
.mx-md-1, .ml-md-1 {
margin-left: 0.444rem !important;
margin-left: var(--spacer-1) !important;
}
.my-md-1, .mt-md-1 {
margin-top: 0.444rem !important;
margin-top: var(--spacer-1) !important;
}
.my-md-1, .mb-md-1 {
margin-bottom: 0.444rem !important;
margin-bottom: var(--spacer-1) !important;
}
.m-md-2 {
margin: 0.667rem 0.667rem !important;
margin: var(--spacer-2) var(--spacer-2) !important;
}
.mx-md-2, .mr-md-2 {
margin-right: 0.667rem !important;
margin-right: var(--spacer-2) !important;
}
.mx-md-2, .ml-md-2 {
margin-left: 0.667rem !important;
margin-left: var(--spacer-2) !important;
}
.my-md-2, .mt-md-2 {
margin-top: 0.667rem !important;
margin-top: var(--spacer-2) !important;
}
.my-md-2, .mb-md-2 {
margin-bottom: 0.667rem !important;
margin-bottom: var(--spacer-2) !important;
}
.m-md-3 {
margin: 1rem 1rem !important;
margin: var(--spacer-3) var(--spacer-3) !important;
}
.mx-md-3, .mr-md-3 {
margin-right: 1rem !important;
margin-right: var(--spacer-3) !important;
}
.mx-md-3, .ml-md-3 {
margin-left: 1rem !important;
margin-left: var(--spacer-3) !important;
}
.my-md-3, .mt-md-3 {
margin-top: 1rem !important;
margin-top: var(--spacer-3) !important;
}
.my-md-3, .mb-md-3 {
margin-bottom: 1rem !important;
margin-bottom: var(--spacer-3) !important;
}
.m-md-4 {
margin: 1.5rem 1.5rem !important;
margin: var(--spacer-4) var(--spacer-4) !important;
}
.mx-md-4, .mr-md-4 {
margin-right: 1.5rem !important;
margin-right: var(--spacer-4) !important;
}
.mx-md-4, .ml-md-4 {
margin-left: 1.5rem !important;
margin-left: var(--spacer-4) !important;
}
.my-md-4, .mt-md-4 {
margin-top: 1.5rem !important;
margin-top: var(--spacer-4) !important;
}
.my-md-4, .mb-md-4 {
margin-bottom: 1.5rem !important;
margin-bottom: var(--spacer-4) !important;
}
.m-md-5 {
margin: 2.25rem 2.25rem !important;
margin: var(--spacer-5) var(--spacer-5) !important;
}
.mx-md-5, .mr-md-5 {
margin-right: 2.25rem !important;
margin-right: var(--spacer-5) !important;
}
.mx-md-5, .ml-md-5 {
margin-left: 2.25rem !important;
margin-left: var(--spacer-5) !important;
}
.my-md-5, .mt-md-5 {
margin-top: 2.25rem !important;
margin-top: var(--spacer-5) !important;
}
.my-md-5, .mb-md-5 {
margin-bottom: 2.25rem !important;
margin-bottom: var(--spacer-5) !important;
}
.m-md-auto {
margin: auto !important;
}
.my-md-auto, .mt-md-auto {
margin-top: auto !important;
}
.my-md-auto, .mb-md-auto {
margin-bottom: auto !important;
}
.mx-md-auto, .mr-md-auto {
margin-right: auto !important;
}
.mx-md-auto, .ml-md-auto {
margin-left: auto !important;
}
}
@media (min-width: 1200px) {
.m-lg-0 {
margin: 0 0 !important;
}
.my-lg-0, .mt-lg-0 {
margin-top: 0 !important;
}
.my-lg-0, .mb-lg-0 {
margin-bottom: 0 !important;
}
.mx-lg-0, .mr-lg-0 {
margin-right: 0 !important;
}
.mx-lg-0, .ml-lg-0 {
margin-left: 0 !important;
}
.m-lg-1 {
margin: 0.444rem 0.444rem !important;
margin: var(--spacer-1) var(--spacer-1) !important;
}
.mx-lg-1, .mr-lg-1 {
margin-right: 0.444rem !important;
margin-right: var(--spacer-1) !important;
}
.mx-lg-1, .ml-lg-1 {
margin-left: 0.444rem !important;
margin-left: var(--spacer-1) !important;
}
.my-lg-1, .mt-lg-1 {
margin-top: 0.444rem !important;
margin-top: var(--spacer-1) !important;
}
.my-lg-1, .mb-lg-1 {
margin-bottom: 0.444rem !important;
margin-bottom: var(--spacer-1) !important;
}
.m-lg-2 {
margin: 0.667rem 0.667rem !important;
margin: var(--spacer-2) var(--spacer-2) !important;
}
.mx-lg-2, .mr-lg-2 {
margin-right: 0.667rem !important;
margin-right: var(--spacer-2) !important;
}
.mx-lg-2, .ml-lg-2 {
margin-left: 0.667rem !important;
margin-left: var(--spacer-2) !important;
}
.my-lg-2, .mt-lg-2 {
margin-top: 0.667rem !important;
margin-top: var(--spacer-2) !important;
}
.my-lg-2, .mb-lg-2 {
margin-bottom: 0.667rem !important;
margin-bottom: var(--spacer-2) !important;
}
.m-lg-3 {
margin: 1rem 1rem !important;
margin: var(--spacer-3) var(--spacer-3) !important;
}
.mx-lg-3, .mr-lg-3 {
margin-right: 1rem !important;
margin-right: var(--spacer-3) !important;
}
.mx-lg-3, .ml-lg-3 {
margin-left: 1rem !important;
margin-left: var(--spacer-3) !important;
}
.my-lg-3, .mt-lg-3 {
margin-top: 1rem !important;
margin-top: var(--spacer-3) !important;
}
.my-lg-3, .mb-lg-3 {
margin-bottom: 1rem !important;
margin-bottom: var(--spacer-3) !important;
}
.m-lg-4 {
margin: 1.5rem 1.5rem !important;
margin: var(--spacer-4) var(--spacer-4) !important;
}
.mx-lg-4, .mr-lg-4 {
margin-right: 1.5rem !important;
margin-right: var(--spacer-4) !important;
}
.mx-lg-4, .ml-lg-4 {
margin-left: 1.5rem !important;
margin-left: var(--spacer-4) !important;
}
.my-lg-4, .mt-lg-4 {
margin-top: 1.5rem !important;
margin-top: var(--spacer-4) !important;
}
.my-lg-4, .mb-lg-4 {
margin-bottom: 1.5rem !important;
margin-bottom: var(--spacer-4) !important;
}
.m-lg-5 {
margin: 2.25rem 2.25rem !important;
margin: var(--spacer-5) var(--spacer-5) !important;
}
.mx-lg-5, .mr-lg-5 {
margin-right: 2.25rem !important;
margin-right: var(--spacer-5) !important;
}
.mx-lg-5, .ml-lg-5 {
margin-left: 2.25rem !important;
margin-left: var(--spacer-5) !important;
}
.my-lg-5, .mt-lg-5 {
margin-top: 2.25rem !important;
margin-top: var(--spacer-5) !important;
}
.my-lg-5, .mb-lg-5 {
margin-bottom: 2.25rem !important;
margin-bottom: var(--spacer-5) !important;
}
.m-lg-auto {
margin: auto !important;
}
.my-lg-auto, .mt-lg-auto {
margin-top: auto !important;
}
.my-lg-auto, .mb-lg-auto {
margin-bottom: auto !important;
}
.mx-lg-auto, .mr-lg-auto {
margin-right: auto !important;
}
.mx-lg-auto, .ml-lg-auto {
margin-left: auto !important;
}
}
@media (min-width: 1380px) {
.m-xl-0 {
margin: 0 0 !important;
}
.my-xl-0, .mt-xl-0 {
margin-top: 0 !important;
}
.my-xl-0, .mb-xl-0 {
margin-bottom: 0 !important;
}
.mx-xl-0, .mr-xl-0 {
margin-right: 0 !important;
}
.mx-xl-0, .ml-xl-0 {
margin-left: 0 !important;
}
.m-xl-1 {
margin: 0.444rem 0.444rem !important;
margin: var(--spacer-1) var(--spacer-1) !important;
}
.mx-xl-1, .mr-xl-1 {
margin-right: 0.444rem !important;
margin-right: var(--spacer-1) !important;
}
.mx-xl-1, .ml-xl-1 {
margin-left: 0.444rem !important;
margin-left: var(--spacer-1) !important;
}
.my-xl-1, .mt-xl-1 {
margin-top: 0.444rem !important;
margin-top: var(--spacer-1) !important;
}
.my-xl-1, .mb-xl-1 {
margin-bottom: 0.444rem !important;
margin-bottom: var(--spacer-1) !important;
}
.m-xl-2 {
margin: 0.667rem 0.667rem !important;
margin: var(--spacer-2) var(--spacer-2) !important;
}
.mx-xl-2, .mr-xl-2 {
margin-right: 0.667rem !important;
margin-right: var(--spacer-2) !important;
}
.mx-xl-2, .ml-xl-2 {
margin-left: 0.667rem !important;
margin-left: var(--spacer-2) !important;
}
.my-xl-2, .mt-xl-2 {
margin-top: 0.667rem !important;
margin-top: var(--spacer-2) !important;
}
.my-xl-2, .mb-xl-2 {
margin-bottom: 0.667rem !important;
margin-bottom: var(--spacer-2) !important;
}
.m-xl-3 {
margin: 1rem 1rem !important;
margin: var(--spacer-3) var(--spacer-3) !important;
}
.mx-xl-3, .mr-xl-3 {
margin-right: 1rem !important;
margin-right: var(--spacer-3) !important;
}
.mx-xl-3, .ml-xl-3 {
margin-left: 1rem !important;
margin-left: var(--spacer-3) !important;
}
.my-xl-3, .mt-xl-3 {
margin-top: 1rem !important;
margin-top: var(--spacer-3) !important;
}
.my-xl-3, .mb-xl-3 {
margin-bottom: 1rem !important;
margin-bottom: var(--spacer-3) !important;
}
.m-xl-4 {
margin: 1.5rem 1.5rem !important;
margin: var(--spacer-4) var(--spacer-4) !important;
}
.mx-xl-4, .mr-xl-4 {
margin-right: 1.5rem !important;
margin-right: var(--spacer-4) !important;
}
.mx-xl-4, .ml-xl-4 {
margin-left: 1.5rem !important;
margin-left: var(--spacer-4) !important;
}
.my-xl-4, .mt-xl-4 {
margin-top: 1.5rem !important;
margin-top: var(--spacer-4) !important;
}
.my-xl-4, .mb-xl-4 {
margin-bottom: 1.5rem !important;
margin-bottom: var(--spacer-4) !important;
}
.m-xl-5 {
margin: 2.25rem 2.25rem !important;
margin: var(--spacer-5) var(--spacer-5) !important;
}
.mx-xl-5, .mr-xl-5 {
margin-right: 2.25rem !important;
margin-right: var(--spacer-5) !important;
}
.mx-xl-5, .ml-xl-5 {
margin-left: 2.25rem !important;
margin-left: var(--spacer-5) !important;
}
.my-xl-5, .mt-xl-5 {
margin-top: 2.25rem !important;
margin-top: var(--spacer-5) !important;
}
.my-xl-5, .mb-xl-5 {
margin-bottom: 2.25rem !important;
margin-bottom: var(--spacer-5) !important;
}
.m-xl-auto {
margin: auto !important;
}
.my-xl-auto, .mt-xl-auto {
margin-top: auto !important;
}
.my-xl-auto, .mb-xl-auto {
margin-bottom: auto !important;
}
.mx-xl-auto, .mr-xl-auto {
margin-right: auto !important;
}
.mx-xl-auto, .ml-xl-auto {
margin-left: auto !important;
}
}
@media (min-width: 1480px) {
.m-xxl-0 {
margin: 0 0 !important;
}
.my-xxl-0, .mt-xxl-0 {
margin-top: 0 !important;
}
.my-xxl-0, .mb-xxl-0 {
margin-bottom: 0 !important;
}
.mx-xxl-0, .mr-xxl-0 {
margin-right: 0 !important;
}
.mx-xxl-0, .ml-xxl-0 {
margin-left: 0 !important;
}
.m-xxl-1 {
margin: 0.444rem 0.444rem !important;
margin: var(--spacer-1) var(--spacer-1) !important;
}
.mx-xxl-1, .mr-xxl-1 {
margin-right: 0.444rem !important;
margin-right: var(--spacer-1) !important;
}
.mx-xxl-1, .ml-xxl-1 {
margin-left: 0.444rem !important;
margin-left: var(--spacer-1) !important;
}
.my-xxl-1, .mt-xxl-1 {
margin-top: 0.444rem !important;
margin-top: var(--spacer-1) !important;
}
.my-xxl-1, .mb-xxl-1 {
margin-bottom: 0.444rem !important;
margin-bottom: var(--spacer-1) !important;
}
.m-xxl-2 {
margin: 0.667rem 0.667rem !important;
margin: var(--spacer-2) var(--spacer-2) !important;
}
.mx-xxl-2, .mr-xxl-2 {
margin-right: 0.667rem !important;
margin-right: var(--spacer-2) !important;
}
.mx-xxl-2, .ml-xxl-2 {
margin-left: 0.667rem !important;
margin-left: var(--spacer-2) !important;
}
.my-xxl-2, .mt-xxl-2 {
margin-top: 0.667rem !important;
margin-top: var(--spacer-2) !important;
}
.my-xxl-2, .mb-xxl-2 {
margin-bottom: 0.667rem !important;
margin-bottom: var(--spacer-2) !important;
}
.m-xxl-3 {
margin: 1rem 1rem !important;
margin: var(--spacer-3) var(--spacer-3) !important;
}
.mx-xxl-3, .mr-xxl-3 {
margin-right: 1rem !important;
margin-right: var(--spacer-3) !important;
}
.mx-xxl-3, .ml-xxl-3 {
margin-left: 1rem !important;
margin-left: var(--spacer-3) !important;
}
.my-xxl-3, .mt-xxl-3 {
margin-top: 1rem !important;
margin-top: var(--spacer-3) !important;
}
.my-xxl-3, .mb-xxl-3 {
margin-bottom: 1rem !important;
margin-bottom: var(--spacer-3) !important;
}
.m-xxl-4 {
margin: 1.5rem 1.5rem !important;
margin: var(--spacer-4) var(--spacer-4) !important;
}
.mx-xxl-4, .mr-xxl-4 {
margin-right: 1.5rem !important;
margin-right: var(--spacer-4) !important;
}
.mx-xxl-4, .ml-xxl-4 {
margin-left: 1.5rem !important;
margin-left: var(--spacer-4) !important;
}
.my-xxl-4, .mt-xxl-4 {
margin-top: 1.5rem !important;
margin-top: var(--spacer-4) !important;
}
.my-xxl-4, .mb-xxl-4 {
margin-bottom: 1.5rem !important;
margin-bottom: var(--spacer-4) !important;
}
.m-xxl-5 {
margin: 2.25rem 2.25rem !important;
margin: var(--spacer-5) var(--spacer-5) !important;
}
.mx-xxl-5, .mr-xxl-5 {
margin-right: 2.25rem !important;
margin-right: var(--spacer-5) !important;
}
.mx-xxl-5, .ml-xxl-5 {
margin-left: 2.25rem !important;
margin-left: var(--spacer-5) !important;
}
.my-xxl-5, .mt-xxl-5 {
margin-top: 2.25rem !important;
margin-top: var(--spacer-5) !important;
}
.my-xxl-5, .mb-xxl-5 {
margin-bottom: 2.25rem !important;
margin-bottom: var(--spacer-5) !important;
}
.m-xxl-auto {
margin: auto !important;
}
.my-xxl-auto, .mt-xxl-auto {
margin-top: auto !important;
}
.my-xxl-auto, .mb-xxl-auto {
margin-bottom: auto !important;
}
.mx-xxl-auto, .mr-xxl-auto {
margin-right: auto !important;
}
.mx-xxl-auto, .ml-xxl-auto {
margin-left: auto !important;
}
}
/*=========================================
= Padding Utilities =
=========================================*/
.p-0 {
padding: 0 0 !important;
}
.py-0, .pt-0 {
padding-top: 0 !important;
}
.py-0, .pb-0 {
padding-bottom: 0 !important;
}
.px-0, .pr-0 {
padding-right: 0 !important;
}
.px-0, .pl-0 {
padding-left: 0 !important;
}
.p-1 {
padding: 0.444rem 0.444rem !important;
padding: var(--spacer-1) var(--spacer-1) !important;
}
.px-1, .pr-1 {
padding-right: 0.444rem !important;
padding-right: var(--spacer-1) !important;
}
.px-1, .pl-1 {
padding-left: 0.444rem !important;
padding-left: var(--spacer-1) !important;
}
.py-1, .pt-1 {
padding-top: 0.444rem !important;
padding-top: var(--spacer-1) !important;
}
.py-1, .pb-1 {
padding-bottom: 0.444rem !important;
padding-bottom: var(--spacer-1) !important;
}
.p-2 {
padding: 0.667rem 0.667rem !important;
padding: var(--spacer-2) var(--spacer-2) !important;
}
.px-2, .pr-2 {
padding-right: 0.667rem !important;
padding-right: var(--spacer-2) !important;
}
.px-2, .pl-2 {
padding-left: 0.667rem !important;
padding-left: var(--spacer-2) !important;
}
.py-2, .pt-2 {
padding-top: 0.667rem !important;
padding-top: var(--spacer-2) !important;
}
.py-2, .pb-2 {
padding-bottom: 0.667rem !important;
padding-bottom: var(--spacer-2) !important;
}
.p-3 {
padding: 1rem 1rem !important;
padding: var(--spacer-3) var(--spacer-3) !important;
}
.px-3, .pr-3 {
padding-right: 1rem !important;
padding-right: var(--spacer-3) !important;
}
.px-3, .pl-3 {
padding-left: 1rem !important;
padding-left: var(--spacer-3) !important;
}
.py-3, .pt-3 {
padding-top: 1rem !important;
padding-top: var(--spacer-3) !important;
}
.py-3, .pb-3 {
padding-bottom: 1rem !important;
padding-bottom: var(--spacer-3) !important;
}
.p-4 {
padding: 1.5rem 1.5rem !important;
padding: var(--spacer-4) var(--spacer-4) !important;
}
.px-4, .pr-4 {
padding-right: 1.5rem !important;
padding-right: var(--spacer-4) !important;
}
.px-4, .pl-4 {
padding-left: 1.5rem !important;
padding-left: var(--spacer-4) !important;
}
.py-4, .pt-4 {
padding-top: 1.5rem !important;
padding-top: var(--spacer-4) !important;
}
.py-4, .pb-4 {
padding-bottom: 1.5rem !important;
padding-bottom: var(--spacer-4) !important;
}
.p-5 {
padding: 2.25rem 2.25rem !important;
padding: var(--spacer-5) var(--spacer-5) !important;
}
.px-5, .pr-5 {
padding-right: 2.25rem !important;
padding-right: var(--spacer-5) !important;
}
.px-5, .pl-5 {
padding-left: 2.25rem !important;
padding-left: var(--spacer-5) !important;
}
.py-5, .pt-5 {
padding-top: 2.25rem !important;
padding-top: var(--spacer-5) !important;
}
.py-5, .pb-5 {
padding-bottom: 2.25rem !important;
padding-bottom: var(--spacer-5) !important;
}
@media (min-width: 576px) {
.p-sm-0 {
padding: 0 0 !important;
}
.py-sm-0, .pt-sm-0 {
padding-top: 0 !important;
}
.py-sm-0, .pb-sm-0 {
padding-bottom: 0 !important;
}
.px-sm-0, .pr-sm-0 {
padding-right: 0 !important;
}
.px-sm-0, .pl-sm-0 {
padding-left: 0 !important;
}
.p-sm-1 {
padding: 0.444rem 0.444rem !important;
padding: var(--spacer-1) var(--spacer-1) !important;
}
.px-sm-1, .pr-sm-1 {
padding-right: 0.444rem !important;
padding-right: var(--spacer-1) !important;
}
.px-sm-1, .pl-sm-1 {
padding-left: 0.444rem !important;
padding-left: var(--spacer-1) !important;
}
.py-sm-1, .pt-sm-1 {
padding-top: 0.444rem !important;
padding-top: var(--spacer-1) !important;
}
.py-sm-1, .pb-sm-1 {
padding-bottom: 0.444rem !important;
padding-bottom: var(--spacer-1) !important;
}
.p-sm-2 {
padding: 0.667rem 0.667rem !important;
padding: var(--spacer-2) var(--spacer-2) !important;
}
.px-sm-2, .pr-sm-2 {
padding-right: 0.667rem !important;
padding-right: var(--spacer-2) !important;
}
.px-sm-2, .pl-sm-2 {
padding-left: 0.667rem !important;
padding-left: var(--spacer-2) !important;
}
.py-sm-2, .pt-sm-2 {
padding-top: 0.667rem !important;
padding-top: var(--spacer-2) !important;
}
.py-sm-2, .pb-sm-2 {
padding-bottom: 0.667rem !important;
padding-bottom: var(--spacer-2) !important;
}
.p-sm-3 {
padding: 1rem 1rem !important;
padding: var(--spacer-3) var(--spacer-3) !important;
}
.px-sm-3, .pr-sm-3 {
padding-right: 1rem !important;
padding-right: var(--spacer-3) !important;
}
.px-sm-3, .pl-sm-3 {
padding-left: 1rem !important;
padding-left: var(--spacer-3) !important;
}
.py-sm-3, .pt-sm-3 {
padding-top: 1rem !important;
padding-top: var(--spacer-3) !important;
}
.py-sm-3, .pb-sm-3 {
padding-bottom: 1rem !important;
padding-bottom: var(--spacer-3) !important;
}
.p-sm-4 {
padding: 1.5rem 1.5rem !important;
padding: var(--spacer-4) var(--spacer-4) !important;
}
.px-sm-4, .pr-sm-4 {
padding-right: 1.5rem !important;
padding-right: var(--spacer-4) !important;
}
.px-sm-4, .pl-sm-4 {
padding-left: 1.5rem !important;
padding-left: var(--spacer-4) !important;
}
.py-sm-4, .pt-sm-4 {
padding-top: 1.5rem !important;
padding-top: var(--spacer-4) !important;
}
.py-sm-4, .pb-sm-4 {
padding-bottom: 1.5rem !important;
padding-bottom: var(--spacer-4) !important;
}
.p-sm-5 {
padding: 2.25rem 2.25rem !important;
padding: var(--spacer-5) var(--spacer-5) !important;
}
.px-sm-5, .pr-sm-5 {
padding-right: 2.25rem !important;
padding-right: var(--spacer-5) !important;
}
.px-sm-5, .pl-sm-5 {
padding-left: 2.25rem !important;
padding-left: var(--spacer-5) !important;
}
.py-sm-5, .pt-sm-5 {
padding-top: 2.25rem !important;
padding-top: var(--spacer-5) !important;
}
.py-sm-5, .pb-sm-5 {
padding-bottom: 2.25rem !important;
padding-bottom: var(--spacer-5) !important;
}
}
@media (min-width: 992px) {
.p-md-0 {
padding: 0 0 !important;
}
.py-md-0, .pt-md-0 {
padding-top: 0 !important;
}
.py-md-0, .pb-md-0 {
padding-bottom: 0 !important;
}
.px-md-0, .pr-md-0 {
padding-right: 0 !important;
}
.px-md-0, .pl-md-0 {
padding-left: 0 !important;
}
.p-md-1 {
padding: 0.444rem 0.444rem !important;
padding: var(--spacer-1) var(--spacer-1) !important;
}
.px-md-1, .pr-md-1 {
padding-right: 0.444rem !important;
padding-right: var(--spacer-1) !important;
}
.px-md-1, .pl-md-1 {
padding-left: 0.444rem !important;
padding-left: var(--spacer-1) !important;
}
.py-md-1, .pt-md-1 {
padding-top: 0.444rem !important;
padding-top: var(--spacer-1) !important;
}
.py-md-1, .pb-md-1 {
padding-bottom: 0.444rem !important;
padding-bottom: var(--spacer-1) !important;
}
.p-md-2 {
padding: 0.667rem 0.667rem !important;
padding: var(--spacer-2) var(--spacer-2) !important;
}
.px-md-2, .pr-md-2 {
padding-right: 0.667rem !important;
padding-right: var(--spacer-2) !important;
}
.px-md-2, .pl-md-2 {
padding-left: 0.667rem !important;
padding-left: var(--spacer-2) !important;
}
.py-md-2, .pt-md-2 {
padding-top: 0.667rem !important;
padding-top: var(--spacer-2) !important;
}
.py-md-2, .pb-md-2 {
padding-bottom: 0.667rem !important;
padding-bottom: var(--spacer-2) !important;
}
.p-md-3 {
padding: 1rem 1rem !important;
padding: var(--spacer-3) var(--spacer-3) !important;
}
.px-md-3, .pr-md-3 {
padding-right: 1rem !important;
padding-right: var(--spacer-3) !important;
}
.px-md-3, .pl-md-3 {
padding-left: 1rem !important;
padding-left: var(--spacer-3) !important;
}
.py-md-3, .pt-md-3 {
padding-top: 1rem !important;
padding-top: var(--spacer-3) !important;
}
.py-md-3, .pb-md-3 {
padding-bottom: 1rem !important;
padding-bottom: var(--spacer-3) !important;
}
.p-md-4 {
padding: 1.5rem 1.5rem !important;
padding: var(--spacer-4) var(--spacer-4) !important;
}
.px-md-4, .pr-md-4 {
padding-right: 1.5rem !important;
padding-right: var(--spacer-4) !important;
}
.px-md-4, .pl-md-4 {
padding-left: 1.5rem !important;
padding-left: var(--spacer-4) !important;
}
.py-md-4, .pt-md-4 {
padding-top: 1.5rem !important;
padding-top: var(--spacer-4) !important;
}
.py-md-4, .pb-md-4 {
padding-bottom: 1.5rem !important;
padding-bottom: var(--spacer-4) !important;
}
.p-md-5 {
padding: 2.25rem 2.25rem !important;
padding: var(--spacer-5) var(--spacer-5) !important;
}
.px-md-5, .pr-md-5 {
padding-right: 2.25rem !important;
padding-right: var(--spacer-5) !important;
}
.px-md-5, .pl-md-5 {
padding-left: 2.25rem !important;
padding-left: var(--spacer-5) !important;
}
.py-md-5, .pt-md-5 {
padding-top: 2.25rem !important;
padding-top: var(--spacer-5) !important;
}
.py-md-5, .pb-md-5 {
padding-bottom: 2.25rem !important;
padding-bottom: var(--spacer-5) !important;
}
}
@media (min-width: 1200px) {
.p-lg-0 {
padding: 0 0 !important;
}
.py-lg-0, .pt-lg-0 {
padding-top: 0 !important;
}
.py-lg-0, .pb-lg-0 {
padding-bottom: 0 !important;
}
.px-lg-0, .pr-lg-0 {
padding-right: 0 !important;
}
.px-lg-0, .pl-lg-0 {
padding-left: 0 !important;
}
.p-lg-1 {
padding: 0.444rem 0.444rem !important;
padding: var(--spacer-1) var(--spacer-1) !important;
}
.px-lg-1, .pr-lg-1 {
padding-right: 0.444rem !important;
padding-right: var(--spacer-1) !important;
}
.px-lg-1, .pl-lg-1 {
padding-left: 0.444rem !important;
padding-left: var(--spacer-1) !important;
}
.py-lg-1, .pt-lg-1 {
padding-top: 0.444rem !important;
padding-top: var(--spacer-1) !important;
}
.py-lg-1, .pb-lg-1 {
padding-bottom: 0.444rem !important;
padding-bottom: var(--spacer-1) !important;
}
.p-lg-2 {
padding: 0.667rem 0.667rem !important;
padding: var(--spacer-2) var(--spacer-2) !important;
}
.px-lg-2, .pr-lg-2 {
padding-right: 0.667rem !important;
padding-right: var(--spacer-2) !important;
}
.px-lg-2, .pl-lg-2 {
padding-left: 0.667rem !important;
padding-left: var(--spacer-2) !important;
}
.py-lg-2, .pt-lg-2 {
padding-top: 0.667rem !important;
padding-top: var(--spacer-2) !important;
}
.py-lg-2, .pb-lg-2 {
padding-bottom: 0.667rem !important;
padding-bottom: var(--spacer-2) !important;
}
.p-lg-3 {
padding: 1rem 1rem !important;
padding: var(--spacer-3) var(--spacer-3) !important;
}
.px-lg-3, .pr-lg-3 {
padding-right: 1rem !important;
padding-right: var(--spacer-3) !important;
}
.px-lg-3, .pl-lg-3 {
padding-left: 1rem !important;
padding-left: var(--spacer-3) !important;
}
.py-lg-3, .pt-lg-3 {
padding-top: 1rem !important;
padding-top: var(--spacer-3) !important;
}
.py-lg-3, .pb-lg-3 {
padding-bottom: 1rem !important;
padding-bottom: var(--spacer-3) !important;
}
.p-lg-4 {
padding: 1.5rem 1.5rem !important;
padding: var(--spacer-4) var(--spacer-4) !important;
}
.px-lg-4, .pr-lg-4 {
padding-right: 1.5rem !important;
padding-right: var(--spacer-4) !important;
}
.px-lg-4, .pl-lg-4 {
padding-left: 1.5rem !important;
padding-left: var(--spacer-4) !important;
}
.py-lg-4, .pt-lg-4 {
padding-top: 1.5rem !important;
padding-top: var(--spacer-4) !important;
}
.py-lg-4, .pb-lg-4 {
padding-bottom: 1.5rem !important;
padding-bottom: var(--spacer-4) !important;
}
.p-lg-5 {
padding: 2.25rem 2.25rem !important;
padding: var(--spacer-5) var(--spacer-5) !important;
}
.px-lg-5, .pr-lg-5 {
padding-right: 2.25rem !important;
padding-right: var(--spacer-5) !important;
}
.px-lg-5, .pl-lg-5 {
padding-left: 2.25rem !important;
padding-left: var(--spacer-5) !important;
}
.py-lg-5, .pt-lg-5 {
padding-top: 2.25rem !important;
padding-top: var(--spacer-5) !important;
}
.py-lg-5, .pb-lg-5 {
padding-bottom: 2.25rem !important;
padding-bottom: var(--spacer-5) !important;
}
}
@media (min-width: 1380px) {
.p-xl-0 {
padding: 0 0 !important;
}
.py-xl-0, .pt-xl-0 {
padding-top: 0 !important;
}
.py-xl-0, .pb-xl-0 {
padding-bottom: 0 !important;
}
.px-xl-0, .pr-xl-0 {
padding-right: 0 !important;
}
.px-xl-0, .pl-xl-0 {
padding-left: 0 !important;
}
.p-xl-1 {
padding: 0.444rem 0.444rem !important;
padding: var(--spacer-1) var(--spacer-1) !important;
}
.px-xl-1, .pr-xl-1 {
padding-right: 0.444rem !important;
padding-right: var(--spacer-1) !important;
}
.px-xl-1, .pl-xl-1 {
padding-left: 0.444rem !important;
padding-left: var(--spacer-1) !important;
}
.py-xl-1, .pt-xl-1 {
padding-top: 0.444rem !important;
padding-top: var(--spacer-1) !important;
}
.py-xl-1, .pb-xl-1 {
padding-bottom: 0.444rem !important;
padding-bottom: var(--spacer-1) !important;
}
.p-xl-2 {
padding: 0.667rem 0.667rem !important;
padding: var(--spacer-2) var(--spacer-2) !important;
}
.px-xl-2, .pr-xl-2 {
padding-right: 0.667rem !important;
padding-right: var(--spacer-2) !important;
}
.px-xl-2, .pl-xl-2 {
padding-left: 0.667rem !important;
padding-left: var(--spacer-2) !important;
}
.py-xl-2, .pt-xl-2 {
padding-top: 0.667rem !important;
padding-top: var(--spacer-2) !important;
}
.py-xl-2, .pb-xl-2 {
padding-bottom: 0.667rem !important;
padding-bottom: var(--spacer-2) !important;
}
.p-xl-3 {
padding: 1rem 1rem !important;
padding: var(--spacer-3) var(--spacer-3) !important;
}
.px-xl-3, .pr-xl-3 {
padding-right: 1rem !important;
padding-right: var(--spacer-3) !important;
}
.px-xl-3, .pl-xl-3 {
padding-left: 1rem !important;
padding-left: var(--spacer-3) !important;
}
.py-xl-3, .pt-xl-3 {
padding-top: 1rem !important;
padding-top: var(--spacer-3) !important;
}
.py-xl-3, .pb-xl-3 {
padding-bottom: 1rem !important;
padding-bottom: var(--spacer-3) !important;
}
.p-xl-4 {
padding: 1.5rem 1.5rem !important;
padding: var(--spacer-4) var(--spacer-4) !important;
}
.px-xl-4, .pr-xl-4 {
padding-right: 1.5rem !important;
padding-right: var(--spacer-4) !important;
}
.px-xl-4, .pl-xl-4 {
padding-left: 1.5rem !important;
padding-left: var(--spacer-4) !important;
}
.py-xl-4, .pt-xl-4 {
padding-top: 1.5rem !important;
padding-top: var(--spacer-4) !important;
}
.py-xl-4, .pb-xl-4 {
padding-bottom: 1.5rem !important;
padding-bottom: var(--spacer-4) !important;
}
.p-xl-5 {
padding: 2.25rem 2.25rem !important;
padding: var(--spacer-5) var(--spacer-5) !important;
}
.px-xl-5, .pr-xl-5 {
padding-right: 2.25rem !important;
padding-right: var(--spacer-5) !important;
}
.px-xl-5, .pl-xl-5 {
padding-left: 2.25rem !important;
padding-left: var(--spacer-5) !important;
}
.py-xl-5, .pt-xl-5 {
padding-top: 2.25rem !important;
padding-top: var(--spacer-5) !important;
}
.py-xl-5, .pb-xl-5 {
padding-bottom: 2.25rem !important;
padding-bottom: var(--spacer-5) !important;
}
}
@media (min-width: 1480px) {
.p-xxl-0 {
padding: 0 0 !important;
}
.py-xxl-0, .pt-xxl-0 {
padding-top: 0 !important;
}
.py-xxl-0, .pb-xxl-0 {
padding-bottom: 0 !important;
}
.px-xxl-0, .pr-xxl-0 {
padding-right: 0 !important;
}
.px-xxl-0, .pl-xxl-0 {
padding-left: 0 !important;
}
.p-xxl-1 {
padding: 0.444rem 0.444rem !important;
padding: var(--spacer-1) var(--spacer-1) !important;
}
.px-xxl-1, .pr-xxl-1 {
padding-right: 0.444rem !important;
padding-right: var(--spacer-1) !important;
}
.px-xxl-1, .pl-xxl-1 {
padding-left: 0.444rem !important;
padding-left: var(--spacer-1) !important;
}
.py-xxl-1, .pt-xxl-1 {
padding-top: 0.444rem !important;
padding-top: var(--spacer-1) !important;
}
.py-xxl-1, .pb-xxl-1 {
padding-bottom: 0.444rem !important;
padding-bottom: var(--spacer-1) !important;
}
.p-xxl-2 {
padding: 0.667rem 0.667rem !important;
padding: var(--spacer-2) var(--spacer-2) !important;
}
.px-xxl-2, .pr-xxl-2 {
padding-right: 0.667rem !important;
padding-right: var(--spacer-2) !important;
}
.px-xxl-2, .pl-xxl-2 {
padding-left: 0.667rem !important;
padding-left: var(--spacer-2) !important;
}
.py-xxl-2, .pt-xxl-2 {
padding-top: 0.667rem !important;
padding-top: var(--spacer-2) !important;
}
.py-xxl-2, .pb-xxl-2 {
padding-bottom: 0.667rem !important;
padding-bottom: var(--spacer-2) !important;
}
.p-xxl-3 {
padding: 1rem 1rem !important;
padding: var(--spacer-3) var(--spacer-3) !important;
}
.px-xxl-3, .pr-xxl-3 {
padding-right: 1rem !important;
padding-right: var(--spacer-3) !important;
}
.px-xxl-3, .pl-xxl-3 {
padding-left: 1rem !important;
padding-left: var(--spacer-3) !important;
}
.py-xxl-3, .pt-xxl-3 {
padding-top: 1rem !important;
padding-top: var(--spacer-3) !important;
}
.py-xxl-3, .pb-xxl-3 {
padding-bottom: 1rem !important;
padding-bottom: var(--spacer-3) !important;
}
.p-xxl-4 {
padding: 1.5rem 1.5rem !important;
padding: var(--spacer-4) var(--spacer-4) !important;
}
.px-xxl-4, .pr-xxl-4 {
padding-right: 1.5rem !important;
padding-right: var(--spacer-4) !important;
}
.px-xxl-4, .pl-xxl-4 {
padding-left: 1.5rem !important;
padding-left: var(--spacer-4) !important;
}
.py-xxl-4, .pt-xxl-4 {
padding-top: 1.5rem !important;
padding-top: var(--spacer-4) !important;
}
.py-xxl-4, .pb-xxl-4 {
padding-bottom: 1.5rem !important;
padding-bottom: var(--spacer-4) !important;
}
.p-xxl-5 {
padding: 2.25rem 2.25rem !important;
padding: var(--spacer-5) var(--spacer-5) !important;
}
.px-xxl-5, .pr-xxl-5 {
padding-right: 2.25rem !important;
padding-right: var(--spacer-5) !important;
}
.px-xxl-5, .pl-xxl-5 {
padding-left: 2.25rem !important;
padding-left: var(--spacer-5) !important;
}
.py-xxl-5, .pt-xxl-5 {
padding-top: 2.25rem !important;
padding-top: var(--spacer-5) !important;
}
.py-xxl-5, .pb-xxl-5 {
padding-bottom: 2.25rem !important;
padding-bottom: var(--spacer-5) !important;
}
}
/*=========================================
= Padding Utilities =
=========================================*/
.gap-0 {
gap: 0 0 !important;
}
.gap-1 {
gap: 0.444rem 0.444rem !important;
gap: var(--spacer-1) var(--spacer-1) !important;
}
.gap-2 {
gap: 0.667rem 0.667rem !important;
gap: var(--spacer-2) var(--spacer-2) !important;
}
.gap-3 {
gap: 1rem 1rem !important;
gap: var(--spacer-3) var(--spacer-3) !important;
}
.gap-4 {
gap: 1.5rem 1.5rem !important;
gap: var(--spacer-4) var(--spacer-4) !important;
}
.gap-5 {
gap: 2.25rem 2.25rem !important;
gap: var(--spacer-5) var(--spacer-5) !important;
}
@media (min-width: 576px) {
.gap-sm-0 {
gap: 0 0 !important;
}
.gap-sm-1 {
gap: 0.444rem 0.444rem !important;
gap: var(--spacer-1) var(--spacer-1) !important;
}
.gap-sm-2 {
gap: 0.667rem 0.667rem !important;
gap: var(--spacer-2) var(--spacer-2) !important;
}
.gap-sm-3 {
gap: 1rem 1rem !important;
gap: var(--spacer-3) var(--spacer-3) !important;
}
.gap-sm-4 {
gap: 1.5rem 1.5rem !important;
gap: var(--spacer-4) var(--spacer-4) !important;
}
.gap-sm-5 {
gap: 2.25rem 2.25rem !important;
gap: var(--spacer-5) var(--spacer-5) !important;
}
}
@media (min-width: 992px) {
.gap-md-0 {
gap: 0 0 !important;
}
.gap-md-1 {
gap: 0.444rem 0.444rem !important;
gap: var(--spacer-1) var(--spacer-1) !important;
}
.gap-md-2 {
gap: 0.667rem 0.667rem !important;
gap: var(--spacer-2) var(--spacer-2) !important;
}
.gap-md-3 {
gap: 1rem 1rem !important;
gap: var(--spacer-3) var(--spacer-3) !important;
}
.gap-md-4 {
gap: 1.5rem 1.5rem !important;
gap: var(--spacer-4) var(--spacer-4) !important;
}
.gap-md-5 {
gap: 2.25rem 2.25rem !important;
gap: var(--spacer-5) var(--spacer-5) !important;
}
}
@media (min-width: 1200px) {
.gap-lg-0 {
gap: 0 0 !important;
}
.gap-lg-1 {
gap: 0.444rem 0.444rem !important;
gap: var(--spacer-1) var(--spacer-1) !important;
}
.gap-lg-2 {
gap: 0.667rem 0.667rem !important;
gap: var(--spacer-2) var(--spacer-2) !important;
}
.gap-lg-3 {
gap: 1rem 1rem !important;
gap: var(--spacer-3) var(--spacer-3) !important;
}
.gap-lg-4 {
gap: 1.5rem 1.5rem !important;
gap: var(--spacer-4) var(--spacer-4) !important;
}
.gap-lg-5 {
gap: 2.25rem 2.25rem !important;
gap: var(--spacer-5) var(--spacer-5) !important;
}
}
@media (min-width: 1380px) {
.gap-xl-0 {
gap: 0 0 !important;
}
.gap-xl-1 {
gap: 0.444rem 0.444rem !important;
gap: var(--spacer-1) var(--spacer-1) !important;
}
.gap-xl-2 {
gap: 0.667rem 0.667rem !important;
gap: var(--spacer-2) var(--spacer-2) !important;
}
.gap-xl-3 {
gap: 1rem 1rem !important;
gap: var(--spacer-3) var(--spacer-3) !important;
}
.gap-xl-4 {
gap: 1.5rem 1.5rem !important;
gap: var(--spacer-4) var(--spacer-4) !important;
}
.gap-xl-5 {
gap: 2.25rem 2.25rem !important;
gap: var(--spacer-5) var(--spacer-5) !important;
}
}
@media (min-width: 1480px) {
.gap-xxl-0 {
gap: 0 0 !important;
}
.gap-xxl-1 {
gap: 0.444rem 0.444rem !important;
gap: var(--spacer-1) var(--spacer-1) !important;
}
.gap-xxl-2 {
gap: 0.667rem 0.667rem !important;
gap: var(--spacer-2) var(--spacer-2) !important;
}
.gap-xxl-3 {
gap: 1rem 1rem !important;
gap: var(--spacer-3) var(--spacer-3) !important;
}
.gap-xxl-4 {
gap: 1.5rem 1.5rem !important;
gap: var(--spacer-4) var(--spacer-4) !important;
}
.gap-xxl-5 {
gap: 2.25rem 2.25rem !important;
gap: var(--spacer-5) var(--spacer-5) !important;
}
}
/*======================================
= Text Utilities =
======================================*/
.text-left {
text-align: left !important;
}
.text-right {
text-align: right !important;
}
.text-center {
text-align: center !important;
}
@media (min-width: 576px) {
.text-sm-left {
text-align: left !important;
}
.text-sm-right {
text-align: right !important;
}
.text-sm-center {
text-align: center !important;
}
}
@media (min-width: 992px) {
.text-md-left {
text-align: left !important;
}
.text-md-right {
text-align: right !important;
}
.text-md-center {
text-align: center !important;
}
}
@media (min-width: 1200px) {
.text-lg-left {
text-align: left !important;
}
.text-lg-right {
text-align: right !important;
}
.text-lg-center {
text-align: center !important;
}
}
@media (min-width: 1380px) {
.text-xl-left {
text-align: left !important;
}
.text-xl-right {
text-align: right !important;
}
.text-xl-center {
text-align: center !important;
}
}
@media (min-width: 1480px) {
.text-xxl-left {
text-align: left !important;
}
.text-xxl-right {
text-align: right !important;
}
.text-xxl-center {
text-align: center !important;
}
}
.text-uppercase {
text-transform: uppercase !important;
}
.text-lowercase {
text-transform: lowercase !important;
}
.text-capitalize {
text-transform: capitalize !important;
}
.text-bold {
font-weight: bold !important;
}
.text-normal {
font-weight: normal !important;
}
.text-underline {
text-decoration: underline !important;
}
.text-italic {
font-style: italic !important;
}
.text-ellipsis {
overflow: hidden !important;
text-overflow: ellipsis !important;
white-space: nowrap !important;
}
/*========================================
= Border Utilities =
========================================*/
.border-1, .border-top-1 {
border-top-width: 1px !important;
}
.border-1, .border-bottom-1 {
border-bottom-width: 1px !important;
}
.border-1, .border-left-1 {
border-left-width: 1px !important;
}
.border-1, .border-right-1 {
border-right-width: 1px !important;
}
.border-0, .border-top-0 {
border-top-width: 0 !important;
}
.border-0, .border-right-0 {
border-right-width: 0 !important;
}
.border-0, .border-bottom-0 {
border-bottom-width: 0 !important;
}
.border-0, .border-left-0 {
border-left-width: 0 !important;
}
.border-solid {
border-style: solid !important;
}
.border-dashed {
border-style: dashed !important;
}
.border-dotted {
border-style: dotted !important;
}
/*======================================
= List Utilities =
======================================*/
.list-unstyled,.list-inline {
list-style: none;
}
.list-inline {
padding-left: 0;
}
.list-inline-item {
display: inline-block;
}
.list-inline-item:not(:last-child) {
margin-right: 0.5em;
}
/*===============================================
= Screen Reader Utilities =
===============================================*/
.sr-only,
.sr-only-focusable:active,
.sr-only-focusable:focus {
border: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
white-space: nowrap;
width: 1px;
}
/*==================================
= Visibility =
==================================*/
.ovh {
overflow: hidden;
}
.ovy-y {
overflow-y: hidden;
}
.ovx-h {
overflow-x: hidden;
}
/*===========================================
= Alignment Utilities =
===========================================*/
.align-baseline {
vertical-align: baseline;
}
.align-top {
vertical-align: top;
}
.align-middle {
vertical-align: middle;
}
.align-bottom {
vertical-align: bottom;
}
.align-text-bottom {
vertical-align: text-bottom;
}
.align-text-top {
vertical-align: text-top;
}
/*==========================================
= Position Utilities =
==========================================*/
.position-absolute {
position: absolute;
}
.position-relative {
position: relative;
}
.position-fixed {
position: fixed;
}
i[class^=icon-],
i[class*=" icon-"],
i[class^=icon-] > svg,
i[class*=" icon-"] > svg {
align-items: center;
display: inline-flex;
fill: currentColor;
height: 1em;
pointer-events: none;
vertical-align: -0.1em;
width: 1em;
}
i[class^=icon-] > svg,
i[class*=" icon-"] > svg {
display: block;
}
/*===============================
= Typeset =
===============================*/
.small-caps {
font-feature-settings: "c2sc" on, "smcp" on, "smcp", "c2sc";
font-variant-caps: all-small-caps;
}
.pull-double {
margin-left: -0.38em;
}
.push-double {
margin-right: 0.38em;
}
.pull-single {
margin-left: -0.15em;
}
.push-single {
margin-right: 0.15em;
}
.pull-t, .pull-v, .pull-w, .pull-y {
margin-left: -0.07em;
}
.push-t, .push-v, .push-w, .push-y {
margin-right: 0.07em;
}
.pull-o, .pull-c, .pull-o, .pull-c {
margin-left: -0.04em;
}
.push-o, .push-c, .push-o, .push-c {
margin-right: 0.04em;
}
.pull-a {
margin-left: -0.03em;
}
.push-a {
margin-right: 0.03em;
}
/*================================
= Longform =
================================*/
.max-lf h1, .max-lf h2, .max-lf h3,
.max-lf h4, .max-lf h5, .max-lf h6,
.max-lf p,
.max-lf ul, .max-lf ul li,
.max-lf ol, .max-lf ol li {
max-width: 39.292em;
}
/*==========================================
= JavaScript Helpers =
==========================================*/
.is-scrolling,
.is-scrolling * {
pointer-events: none !important;
}
/*====================================
= Reset Button =
====================================*/
.reset-button {
-webkit-appearance: none;
background: transparent;
border: none;
color: inherit;
font: inherit;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
line-height: normal;
margin: 0;
overflow: visible;
padding: 0;
width: auto;
}
/*==========================================
= Absolute Permalink =
==========================================*/
a.permalink {
bottom: 0;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
z-index: 3;
}
a.permalink:focus {
outline: none;
}
html, body, table {
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 1, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
}
h1, .h1,
h2, .h2,
h3, .h3 {
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 0, "dlig" 0;
}
abbr {
font-feature-settings: "c2sc" on, "smcp" on, "smcp", "c2sc";
font-variant-caps: all-small-caps;
}
time {
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 0;
}
pre, kbd, samp, code {
font-feature-settings: "kern" 0, "liga" 0, "calt" 1, "dlig" 0, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 1, "zero" 1;
}
sup {
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 0, "dlig" 0, "sups" 1;
}
sub {
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 0, "dlig" 0, "subs" 1;
}
input[type=color],
input[type=date],
input[type=datetime],
input[type=datetime-local],
input[type=number],
input[type=range] input[type=tel],
input[type=week] {
font-feature-settings: "kern" 0, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 1, "zero" 0;
}
button {
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 0, "dlig" 0;
}
tbody, caption {
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 1, "zero" 1;
}
::-moz-selection {
background-color: #ACCEF7;
color: inherit;
text-shadow: inherit;
}
::selection {
background-color: #ACCEF7;
color: inherit;
text-shadow: inherit;
}
.embed-responsive {
display: block;
overflow: hidden;
padding: 0;
position: relative;
width: 100%;
}
.embed-responsive-16by9::before {
content: "";
display: block;
padding-top: 56.25%;
}
.embed-responsive > div {
border: 0;
bottom: 0;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
:root {
--animate-duration: 0s;
--animate-delay: 0s;
--animate-repeat: 1 ;
}
@media (min-width: 992px) {
:root {
--animate-duration: 100ms;
--animate-delay: 0s;
--animate-repeat: 1 ;
}
}
.animate__animated {
animation-delay: 0s;
animation-delay: var(--animate-delay);
animation-duration: 0s;
animation-duration: var(--animate-duration);
animation-fill-mode: both;
}
.animate__animated.animate__infinite {
animation-iteration-count: infinite;
}
.animate__animated.animate__repeat-1 {
animation-iteration-count: 1;
animation-iteration-count: 1 ;
animation-iteration-count: var(--animate-repeat);
}
.animate__animated.animate__repeat-2 {
animation-iteration-count: 2;
animation-iteration-count: calc(1 * 2);
animation-iteration-count: calc(var(--animate-repeat) * 2);
}
.animate__animated.animate__repeat-3 {
animation-iteration-count: 3;
animation-iteration-count: calc(1 * 3);
animation-iteration-count: calc(var(--animate-repeat) * 3);
}
.animate__animated.animate__delay-1s {
animation-delay: 1s;
animation-delay: 0s;
animation-delay: var(--animate-delay);
}
.animate__animated.animate__delay-2s {
animation-delay: 2s;
animation-delay: calc(0s * 2);
animation-delay: calc(var(--animate-delay) * 2);
}
.animate__animated.animate__delay-3s {
animation-delay: 3s;
animation-delay: calc(0s * 3);
animation-delay: calc(var(--animate-delay) * 3);
}
.animate__animated.animate__delay-4s {
animation-delay: 4s;
animation-delay: calc(0s * 4);
animation-delay: calc(var(--animate-delay) * 4);
}
.animate__animated.animate__delay-5s {
animation-delay: 5s;
animation-delay: calc(0s * 5);
animation-delay: calc(var(--animate-delay) * 5);
}
.animate__animated.animate__faster {
animation-duration: 0.5s;
animation-duration: calc(0s / 2);
animation-duration: calc(var(--animate-duration) / 2);
}
.animate__animated.animate__fast {
animation-duration: 0.8s;
animation-duration: calc(0s * 0.8);
animation-duration: calc(var(--animate-duration) * 0.8);
}
.animate__animated.animate__slow {
animation-duration: 2s;
animation-duration: calc(0s * 2);
animation-duration: calc(var(--animate-duration) * 2);
}
.animate__animated.animate__slower {
animation-duration: 3s;
animation-duration: calc(0s * 3);
animation-duration: calc(var(--animate-duration) * 3);
}
@media (prefers-reduced-motion: reduce), print {
.animate__animated {
animation-duration: 1ms !important;
animation-iteration-count: 1 !important;
transition-duration: 1ms !important;
}
.animate__animated[class*=Out] {
opacity: 0;
}
}
@keyframes fadeIn {
0% {
opacity: 0;
}
to {
opacity: 1;
}
}
.animate__fadeIn {
animation-name: fadeIn;
}
@keyframes fadeInDown {
0% {
opacity: 0;
transform: translate3d(0, -100%, 0);
}
80% {
opacity: 1;
transform: translateZ(0);
}
}
.animate__fadeInDown {
animation-name: fadeInDown;
}
@keyframes fadeInLeft {
0% {
opacity: 0;
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
transform: translateZ(0);
}
}
.animate__fadeInLeft {
animation-name: fadeInLeft;
}
@keyframes fadeInLeftBig {
0% {
opacity: 0;
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
transform: translateZ(0);
}
}
.animate__fadeInLeftBig {
animation-name: fadeInLeftBig;
}
@keyframes fadeInRight {
0% {
opacity: 0;
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
transform: translateZ(0);
}
}
.animate__fadeInRight {
animation-name: fadeInRight;
}
@keyframes fadeInRightBig {
0% {
opacity: 0;
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
transform: translateZ(0);
}
}
.animate__fadeInRightBig {
animation-name: fadeInRightBig;
}
@keyframes fadeInUp {
0% {
opacity: 0;
transform: translate3d(0, 100%, 0);
}
to {
opacity: 1;
transform: translateZ(0);
}
}
.animate__fadeInUp {
animation-name: fadeInUp;
}
@keyframes fadeOut {
0% {
opacity: 1;
}
to {
opacity: 0;
}
}
.animate__fadeOut {
animation-name: fadeOut;
}
@keyframes fadeOutDown {
0% {
opacity: 1;
}
to {
opacity: 0;
transform: translate3d(0, 100%, 0);
}
}
.animate__fadeOutDown {
animation-name: fadeOutDown;
}
.animate__slideInDown {
animation-name: slideInDown;
}
@keyframes slideInLeft {
0% {
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
transform: translateZ(0);
}
}
.animate__slideInLeft {
animation-name: slideInLeft;
}
@keyframes slideInRight {
0% {
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
transform: translateZ(0);
}
}
.animate__slideInRight {
animation-name: slideInRight;
}
@keyframes slideInUp {
0% {
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
transform: translateZ(0);
}
}
.animate__slideInUp {
animation-name: slideInUp;
}
.main-container {
width: 100vw;
}
.main-container .main-grid {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
.site-header--height {
height: 75px;
height: var(--global-header-height, 75px);
}
.site-main {
min-height: 100%;
min-height: calc(1vh * 100);
min-height: calc(var(--global-vh, 1vh) * 100);
position: relative;
}
.is-after .site-main::after {
opacity: 0;
}
.site-main--wrapper {
min-height: 100%;
padding-bottom: var(--global-footer-height);
position: relative;
}
.site-main--wrapper + .main-footer {
bottom: 0;
left: 0;
position: absolute;
right: 0;
}
.cs-container {
margin-left: auto;
margin-right: auto;
max-width: 544px;
max-width: var(--site-max-width);
padding-left: 1rem;
padding-left: var(--gutter);
padding-right: 1rem;
padding-right: var(--gutter);
width: 100%;
}
.sitenav {
--sitenav-arrow-offset: 0;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
position: fixed;
z-index: 9999;
}
.sitenav,.sitenav::after {
left: 0;
top: 0;
width: 100%;
}
.sitenav::after {
background-color: #FFFFFF;
background-color: var(--color-white);
bottom: 0;
content: "";
display: block;
height: 100%;
position: absolute;
right: 0;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: background-color, -webkit-backdrop-filter;
transition-property: background-color, backdrop-filter;
transition-property: background-color, backdrop-filter, -webkit-backdrop-filter;
will-change: background-color, backdrop-filter;
z-index: 1;
}
.is-after .sitenav::after {
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
background-color: rgba(255, 255, 255, 0.98);
}
.sitenav:focus-within .site-navigation--gradient, .sitenav:hover .site-navigation--gradient {
opacity: 0.25;
}
.site-header--gradient {
background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.01), rgb(255, 255, 255) 85%), radial-gradient(ellipse at top left, rgba(var(--page-primary-rgb), 0.5), transparent 50%), radial-gradient(ellipse at top right, rgba(var(--page-primary-rgb), 0.5), transparent 50%), radial-gradient(ellipse at center right, rgba(var(--page-primary-rgb-darker), 0.5), transparent 50%), radial-gradient(ellipse at center left, rgba(var(--page-primary-rgb), 0.5), transparent 50%);
content: "";
height: 460px;
-webkit-mask-image: linear-gradient(to top, rgba(255, 255, 255, 0), rgb(255, 255, 255));
mask-image: linear-gradient(to top, rgba(255, 255, 255, 0), rgb(255, 255, 255));
opacity: 0.3;
top: -100px;
width: 100%;
width: 100%;
z-index: 0;
}
.site-header--gradient,.site-navigation--gradient {
left: 0;
pointer-events: none;
pointer-events: none;
position: absolute;
right: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
user-select: none;
}
.site-navigation--gradient {
mix-blend-mode: overlay;
opacity: 0.25;
top: 45px;
transition: 250ms;
transition: var(--transition-sm);
transition-property: opacity, top;
transition-timing-function: ease-in;
will-change: opacity, top;
z-index: -1;
}
.is-after .site-navigation--gradient {
opacity: 0.45;
}
.sitenav-wrapper {
position: relative;
z-index: 2;
}
@media (max-width: 1199.98px) {
.sitenav-wrapper {
padding: 0 calc(40px * 1);
padding: 0 calc(40px * var(--scale));
}
}
.sitenav-top--wrapper {
align-items: center;
display: flex;
justify-content: space-between;
min-height: 65px;
}
@media (min-width: 1200px) {
.sitenav-top--wrapper {
display: grid;
grid-template-columns: 233px 1fr 1fr;
}
}
.sitenav-top--logo {
--logo-width: 233px;
--logo-height: 34px;
align-items: center;
cursor: pointer;
display: flex;
height: 34px;
height: var(--logo-height);
position: relative;
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: opacity;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 233px;
width: var(--logo-width);
will-change: opacity;
}
.has-active .sitenav-top--logo {
filter: grayscale(50%);
opacity: 0.65;
}
.sitenav-top--logo a {
color: #007bff;
color: var(--color-primary-500);
outline: 1px solid transparent;
outline-offset: 0;
position: relative;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: color, opacity;
will-change: color, opacity;
}
.sitenav-top--logo a svg {
display: block;
height: var(--logo-height);
width: var(--logo-width);
}
.sitenav-top--logo a::before {
border: 1px solid rgba(0, 123, 255, 0.4);
border: 1px solid rgba(var(--color-primary-500-rgb), 0.4);
border-color: transparent;
border-radius: 5px;
border-style: solid;
border-width: 1px;
box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.15);
box-shadow: 0 0 0 3px rgba(var(--color-primary-500-rgb), 0.15);
content: "";
display: block;
height: 51px;
left: calc(50% + 1px);
opacity: 0;
position: absolute;
top: calc(50% + 1px);
transform: translate(-50%, -50%) scale(0);
transition-duration: 150ms;
transition-property: transform, opacity;
width: calc(100% + 19px);
will-change: transform, opacity;
z-index: -1;
}
.sitenav-top--logo a:hover {
color: #007bff;
color: var(--color-primary-500);
}
.sitenav-top--logo a:focus {
color: #0864c7;
color: var(--color-primary-600);
}
.sitenav-top--logo a:focus-visible::before {
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
.sitenav-top--logo a:focus-visible {
color: rgba(0, 123, 255, 1);
color: rgba(var(--color-primary-500-rgb), 1);
}
.sitenav-top--logo a:active {
color: rgba(9, 81, 158, 0.5);
color: rgba(var(--color-primary-700-rgb), 0.5);
transform: translateY(1px);
}
.sitenav-top--listMain {
display: flex;
margin-left: 3.247rem;
position: relative;
}
.sitenav-top--listMain::before {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), #e2e8f0, rgba(255, 255, 255, 0));
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), var(--color-slate-200), rgba(255, 255, 255, 0));
content: "";
display: block;
height: calc(100% + 1rem);
left: -1.0823333333rem;
position: absolute;
top: -0.5rem;
width: 1px;
}
.sitenav-top--item,
.sitenav-aside--item,.sitenav-top--link,
.sitenav-aside--link {
align-items: center;
display: flex;
position: relative;
}
.sitenav-top--link,
.sitenav-aside--link {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: transparent;
border: none;
border-radius: 3px;
color: #334155;
color: var(--color-slate-700);
cursor: pointer;
font: 500 17px/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 500 17px/0.889 var(--font-heading);
font-feature-settings: "kern" 0, "liga" 1, "calt" 1, "pnum" 0, "tnum" 1, "onum" 0, "lnum" 0, "dlig" 0;
height: 54px;
letter-spacing: -0.003em;
outline: none;
padding: 0 12px;
transition: 250ms;
transition: var(--transition-sm);
transition-property: color, opacity, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: color, opacity, transform;
}
@media (min-width: 1380px) {
.sitenav-top--link,
.sitenav-aside--link {
font-size: 17px;
}
}
.sitenav-top--link span,
.sitenav-aside--link span {
display: inline-flex;
pointer-events: none;
position: relative;
transition: 150ms;
transition: var(--transition-xs);
transition-property: transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: pre;
will-change: transform;
}
.sitenav-top--link:active span,
.sitenav-aside--link:active span {
transform: translateY(1px);
}
.sitenav-top--link:hover,
.sitenav-aside--link:hover {
color: #0f172a;
color: var(--color-slate-900);
-webkit-font-smoothing: antialiased;
transform: translateY(-1px);
}
.sitenav-top--link::before,
.sitenav-aside--link::before {
background-image: linear-gradient(45deg, rgba(0, 123, 255, 0.04), white);
background-image: linear-gradient(45deg, rgba(var(--color-primary-500-rgb), 0.04), white);
border: 1px solid rgba(0, 123, 255, 0.4);
border: 1px solid rgba(var(--color-primary-500-rgb), 0.4);
border-color: transparent;
border-radius: 5px;
border-style: solid;
border-width: 1px;
box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.15);
box-shadow: 0 0 0 3px rgba(var(--color-primary-500-rgb), 0.15);
content: "";
display: block;
height: 30px;
left: 50%;
opacity: 0;
position: absolute;
top: calc(50% + 1px);
transform: translate(-50%, -50%) scale(0);
transition-duration: 150ms;
transition-property: transform, opacity;
width: calc(100% - 6px);
will-change: transform, opacity;
z-index: -1;
}
.sitenav-top--link:focus-visible::before,
.sitenav-aside--link:focus-visible::before {
opacity: 1;
transform: translate(-50%, -50%) scale(1);
}
.sitenav-top--link:focus,
.sitenav-aside--link:focus {
color: #0f172a;
color: var(--color-slate-900);
}
.sitenav-top--link:hover, .sitenav-top--link:active, .sitenav-top--link:focus, .sitenav-top--link:focus-visible,
.sitenav-aside--link:hover,
.sitenav-aside--link:active,
.sitenav-aside--link:focus,
.sitenav-aside--link:focus-visible {
outline: 0;
}
.sitenav-top--link [aria-expanded=false],
.sitenav-aside--link [aria-expanded=false] {
font-weight: 500;
}
@media (min-width: 1200px) {
.sitenav-top--listMain.has-active .sitenav-top--link,
.sitenav-top--listMain.has-active .sitenav-aside--link {
color: #94a3b8;
color: var(--color-slate-400);
}
.sitenav-top--listMain.has-active .sitenav-top--link.is-active {
color: #0f172a;
color: var(--color-slate-900);
}
.sitenav-top--listMain.has-active .sitenav-top--link.is-active span {
transform: translateY(-4px);
}
}
.sitenav-top--listAside ul {
align-items: center;
display: flex;
justify-content: flex-end;
}
.sitenav-bottom--wrapper {
--sitenav-section-width: 590px;
--sitenav-section-height: 312px;
display: block;
opacity: 0;
pointer-events: none;
position: absolute;
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-timing-function: ease-in-out;
width: 100%;
z-index: 9998;
}
.sitenav-bottom--wrapper[aria-hidden=false] {
opacity: 1;
pointer-events: all;
visibility: visible;
}
@media (min-width: 1200px) {
.sitenav-bottom--wrapper {
left: 0;
top: 60px;
transition-property: opacity;
visibility: hidden;
will-change: opacity;
}
}
@media (max-width: 1200px) {
.sitenav-bottom--wrapper {
left: 0;
padding: 0;
top: -100vh;
transition-property: opacity, top;
will-change: opacity, top;
}
.sitenav-bottom--wrapper[aria-hidden=false] {
top: 0;
}
}
.sitenav-arrow {
background-color: #FFFFFF;
background-color: var(--color-white);
border-radius: 0;
box-shadow: -4px -4px 6px rgba(0, 0, 0, 0.04);
height: 12px;
left: calc(var(--sitenav-arrow-offset) - 4px);
margin: 0;
position: absolute;
top: -4px;
transform: translateY(0px) rotate(45deg);
transform-origin: center;
transition-duration: 200ms;
transition-property: opacity, left;
width: 12px;
will-change: opacity, left;
z-index: 2;
}
.sitenav-bottom--container {
display: inline-block;
position: absolute;
width: 100%;
z-index: 999;
}
@media (min-width: 1200px) {
.sitenav-bottom--container {
left: 50%;
top: -5px;
transform: translateX(-50%);
transform-origin: 0 0;
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: transform, width, height;
will-change: transform, width, height;
}
}
@media (max-width: 1200px) {
.sitenav-bottom--container {
left: 0;
max-height: calc(1vh * 100);
max-height: calc(var(--global-vh, 1vh) * 100);
min-height: calc(1vh * 100);
min-height: calc(var(--global-vh, 1vh) * 100);
transition-delay: 150ms;
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: top;
width: 100vw;
}
.site-menu--open .sitenav-bottom--container {
left: 0;
}
}
.sitenav-section--container {
background-color: #FFFFFF;
background-color: var(--color-white);
overflow: hidden;
position: relative;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
}
@media (min-width: 1200px) {
.sitenav-section--container {
border-radius: 8px;
box-shadow: 0 0 100px -20px rgba(15, 23, 42, 0.15), 0 30px 60px -30px rgba(15, 23, 42, 0.25);
box-shadow: 0 0 100px -20px rgba(var(--color-slate-900-rgb), 0.15), 0 30px 60px -30px rgba(var(--color-slate-900-rgb), 0.25);
left: calc(var(--sitenav-left-pos) - 40px);
min-height: var(--sitenav-section-height);
min-width: 100px;
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: opacity, left, transform;
width: var(--sitenav-section-width);
will-change: opacity, left, transform;
}
}
@media (max-width: 1200px) {
.sitenav-section--container {
border-bottom: 1px solid #f1f5f9;
border-bottom: 1px solid var(--color-slate-100);
box-sizing: content-box;
display: grid;
grid-gap: 0;
max-height: calc(1vh * 100);
max-height: calc(var(--global-vh, 1vh) * 100);
min-height: calc(1vh * 100);
min-height: calc(var(--global-vh, 1vh) * 100);
overflow-x: hidden;
overflow-y: scroll;
padding: 0 17px 0 0;
position: relative;
transition-property: opacity, width, transform, top;
width: 100vw;
will-change: opacity, width, transform, top;
z-index: 0;
}
}
.sitenav-bottom--section {
display: inline-block;
width: var(--sitenav-section-width);
}
.sitenav-bottom--section[aria-hidden=true] {
opacity: 1;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 1200px) {
.sitenav-bottom--section {
left: 50%;
max-width: 620px;
opacity: 0;
position: absolute;
top: 0;
transform: translateX(-50%);
transition-duration: 150ms;
transition-property: opacity, left;
will-change: opacity, left;
}
.sitenav-bottom--section[aria-hidden=false] {
opacity: 1;
}
}
@media (max-width: 1200px) {
.sitenav-bottom--section::after {
background-image: linear-gradient(to right, #f8fafc 10%, #f1f5f9, #f8fafc 90%);
background-image: linear-gradient(to right, var(--color-slate-50) 10%, var(--color-slate-100), var(--color-slate-50) 90%);
bottom: -1px;
content: "";
display: block;
height: 1px;
left: 0;
position: absolute;
width: 100%;
}
}
.sitenav-section--layout {
padding: 0;
position: relative;
}
@media (min-width: 1200px) {
.sitenav-section--layout {
align-items: center;
display: flex;
justify-content: center;
padding: 0;
width: 100%;
}
}
@media (max-width: 1200px) {
.sitenav-section--layout {
opacity: 0;
transition-duration: 300ms;
transition-property: height;
}
.sitenav-section--layout[aria-hidden=true] {
display: none;
height: 0;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
visibility: hidden;
}
.sitenav-section--layout[aria-hidden=false] {
opacity: 1;
}
}
.sitenav-mobile--top,
.sitenav-mobile--gradient,
.site-mobile--gradient,
.sitenav-mobile--header,
.sitenav-top--listMobile,
.sitenav-mobile--close {
display: none;
}
@media (max-width: 1200px) {
.site-mobile--gradient {
content: "";
display: none;
height: 20px;
left: 0;
mix-blend-mode: initial;
position: absolute;
right: 0;
top: 40px;
width: 100%;
z-index: 2;
}
.site-mobile--gradient,.sitenav-mobile--overlay {
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.sitenav-mobile--overlay {
background-color: #FFFFFF;
background-color: var(--color-white);
display: block;
height: calc(100% + 2rem);
left: -1rem;
opacity: 0;
position: fixed;
top: -1rem;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: opacity;
visibility: hidden;
width: calc(100% + 2rem);
will-change: opacity;
z-index: -999;
}
.sitenav-mobile--overlay[aria-hidden=false] {
display: none;
opacity: 1;
visibility: visible;
z-index: 1;
z-index: -999;
}
.sitenav-header--sm {
width: 100%;
}
.sitenav-mobile--top {
align-items: flex-start;
display: flex;
flex-direction: column;
justify-content: flex-start;
padding-bottom: 0;
padding-top: 0;
position: relative;
width: 100%;
z-index: 1;
}
.sitenav-mobile--rowWrapper {
background-color: white;
height: 65px;
padding: 0 1rem;
z-index: 10;
}
.sitenav-mobile--rowWrapper,.sitenav-mobile--row:nth-of-type(1) {
align-items: center;
display: flex;
justify-content: space-between;
width: 100%;
}
.sitenav-mobile--row:nth-of-type(2),
.sitenav-mobile--row.is-styled {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border-top: 1px solid #f1f5f9;
border-top: 1px solid var(--color-slate-100);
color: #0f172a;
color: var(--color-slate-900);
display: flex;
justify-content: space-between;
margin-top: 0;
max-width: 100%;
min-height: 60px;
position: relative;
width: 100%;
}
.sitenav-mobile--row:nth-of-type(2) a,
.sitenav-mobile--row.is-styled a {
align-items: center;
color: #0f172a;
color: var(--color-slate-900);
display: flex;
font: 600 16px/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 600 16px/0.889 var(--font-heading);
height: 100%;
justify-content: flex-start;
left: 0;
letter-spacing: 0;
padding-left: 1rem;
padding-right: 1rem;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.sitenav-mobile--logo {
--logo-width: 233px;
--logo-height: 34px;
color: #007bff;
color: var(--color-primary-500);
outline: 1px solid transparent;
outline-offset: 0;
position: relative;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: color;
will-change: color;
}
.sitenav-mobile--logo svg {
display: block;
height: var(--logo-height);
width: var(--logo-width);
}
.sitenav-mobile--logo::before {
display: none;
}
.sitenav-mobile--gradient {
display: block;
opacity: 0;
pointer-events: none;
position: absolute;
top: 35px;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: -1;
}
.is-active .sitenav-mobile--gradient {
opacity: 1;
}
.sitenav-mobile--header {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border-top: 1px solid #f1f5f9;
border-top: 1px solid var(--color-slate-100);
color: #0f172a;
color: var(--color-slate-900);
display: flex;
justify-content: space-between;
max-width: 100%;
min-height: 60px;
position: relative;
width: 100%;
}
.sitenav-mobile--header .fa-angle-down {
color: #0f172a;
color: var(--color-slate-900);
font-size: 12px;
position: absolute;
right: 0;
transform: rotate(-90deg);
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: transform;
will-change: transform;
}
.sitenav-top--listMobile {
display: block;
}
.sitenav-mobile--toggle {
align-items: center;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: white;
border: none;
border-radius: 6px;
color: #0f172a;
color: var(--color-slate-900);
cursor: default;
display: flex;
font-size: 15px;
font-weight: 500;
height: 24px;
justify-content: center;
outline: none;
padding: 0;
transition: 250ms;
transition: var(--transition-sm);
transition-property: color, opacity;
width: 24px;
}
.sitenav-mobile--toggle svg {
display: block;
height: 10px;
width: 10px;
}
.sitenav-mobile--toggle.sitenav-mobile--close {
z-index: 9;
}
.sitenav-bottom--section.is-active .sitenav-mobile--title {
color: #007bff;
color: var(--color-primary-500);
font-weight: 600;
}
.sitenav-bottom--section.is-active .sitenav-mobile--header .fa-angle-down {
opacity: 1;
transform: rotate(0);
}
.sitenav-section--container {
align-items: flex-start;
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.sitenav-bottom--section {
width: 100%;
}
.sitenav-top--menu,
.sitenav-top--listAside,
.sitenav-arrow {
display: none;
}
.sitenav-mobile--title {
color: #0f172a;
color: var(--color-slate-900);
display: block;
font: 600 16px/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 600 16px/0.889 var(--font-heading);
left: 1rem;
letter-spacing: 0;
pointer-events: none;
position: absolute;
z-index: 0;
}
}
.sitenav-section--list {
display: grid;
grid-gap: calc(1.563em * 1);
grid-gap: calc(1.563em * var(--scale));
grid-template-columns: repeat(2, 250px);
height: -moz-max-content;
height: max-content;
margin-bottom: 0 !important;
opacity: 1;
padding: calc(1.563em * 1);
padding: calc(1.563em * var(--scale));
transition-delay: 120ms;
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: opacity;
width: -moz-max-content;
width: max-content;
will-change: opacity;
}
.sitenav-bottom--section[aria-hidden=true] .sitenav-section--list {
opacity: 0.75;
pointer-events: none;
visibility: hidden;
}
@media (min-width: 1200px) {
.sitenav-section--list:hover .sitenav-section--link {
opacity: 0.45;
}
.sitenav-section--list:hover .sitenav-section--link:hover {
opacity: 1;
}
}
@media (max-width: 1200px) {
.sitenav-section--list {
background-color: rgba(248, 250, 252, 0.6);
background-color: rgba(var(--color-slate-50-rgb), 0.6);
border-top: 1px solid #f1f5f9;
border-top: 1px solid var(--color-slate-100);
grid-gap: 10px;
grid-template-columns: repeat(1, 1fr);
padding: 1rem;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: padding;
width: 100%;
}
}
.sitenav-section--link {
align-items: initial;
display: grid;
grid-gap: 2px 10px;
grid-template-columns: auto 1fr;
grid-template-rows: auto auto;
position: relative;
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: opacity;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: opacity;
}
.sitenav-section--link::after, .sitenav-section--link::before {
content: "";
display: block;
height: calc(100% + var(--link-gutter));
left: calc(var(--link-gutter) / 2 * -1);
position: absolute;
top: calc(var(--link-gutter) / 2 * -1);
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-timing-function: ease-in-out;
width: calc(100% + var(--link-gutter));
}
.sitenav-section--link::before {
--link-gutter: 14px;
border-radius: 6px;
transition-property: background-color, opacity;
will-change: background-color, opacity;
z-index: -1;
}
.sitenav-section--link::after {
--link-gutter: 26px;
border-color: transparent;
border-radius: 8px;
border-style: solid;
border-width: 0px;
box-shadow: 0 0 0 0;
transform: scaleY(1.05) scaleX(1);
transition-property: border-color, transform, box-shadow;
will-change: border-color, transform, box-shadow;
z-index: -2;
}
.sitenav-section--link:active::before {
opacity: 0;
}
.sitenav-section--link:active::after {
border-color: transparent;
transform: scaleY(0) scaleX(0);
}
.sitenav-section--link:hover::before, .sitenav-section--link:focus::before {
background-color: #f8fafc;
background-color: var(--color-slate-50);
}
.sitenav-section--link:hover::after, .sitenav-section--link:focus::after {
border-color: #f1f5f9;
border-color: var(--color-slate-100);
box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
transform: scaleY(1) scaleX(1);
}
.sitenav-section--link:hover, .sitenav-section--link:focus {
outline: 0;
}
.sitenav-section--link .sitenav-link--icon,
.sitenav-section--link .sitenav-link--label,
.sitenav-section--link .sitenav-link--body {
transition-duration: 0;
}
.sitenav-section--link .sitenav-link--icon {
font-size: 1em;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: color;
will-change: color;
}
.sitenav-section--link .sitenav-link--icon .fa-alt {
--fa-primary-color: var(--color-slate-300);
--fa-secondary-color: var(--color-slate-500);
}
.sitenav-section--link .sitenav-link--icon .corner-icon {
display: none;
}
@media (max-width: 1200px) {
.sitenav-section--link .sitenav-link--icon .corner-icon {
display: none;
}
}
.sitenav-section--link .sitenav-link--label {
color: #0f172a;
color: var(--color-slate-900);
}
.sitenav-section--link .sitenav-link--body {
color: #64748b;
color: var(--color-slate-500);
}
.sitenav-section--link:hover .sitenav-link--icon, .sitenav-section--link:focus .sitenav-link--icon {
--fa-primary-color: var(--color-slate-700);
--fa-secondary-color: rgba(var(--color-slate-800-rgb), 0.3);
}
.sitenav-section--link:hover .sitenav-link--icon .fa-alt, .sitenav-section--link:focus .sitenav-link--icon .fa-alt {
--fa-primary-color: var(--color-slate-700);
--fa-secondary-color: var(--color-accent-2-300);
}
.sitenav-section--link:hover .sitenav-link--icon .corner-icon, .sitenav-section--link:focus .sitenav-link--icon .corner-icon {
display: none;
}
.sitenav-section--link:hover .sitenav-link--label, .sitenav-section--link:focus .sitenav-link--label {
color: #0f172a;
color: var(--color-slate-900);
text-decoration-color: #94a3b8;
text-decoration-color: var(--color-slate-400);
}
.sitenav-section--link:hover .sitenav-link--body, .sitenav-section--link:active .sitenav-link--body {
color: #64748b;
color: var(--color-slate-500);
}
.sitenav-section--link .sitenav-link--icon {
align-items: flex-start;
display: flex;
grid-row: span 2;
justify-content: center;
}
.sitenav-section--link .sitenav-link--icon::before, .sitenav-section--link .sitenav-link--icon::after {
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: color, opacity;
transition-timing-function: ease-in-out;
will-change: color, opacity;
}
.sitenav-section--link .sitenav-link--icon i {
font-size: 20px;
}
.sitenav-section--link .sitenav-link--label {
font: 650 16px/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 650 16px/0.889 var(--font-heading);
-webkit-font-smoothing: antialiased;
letter-spacing: 0.01em;
transition-property: -webkit-text-decoration;
transition-property: text-decoration;
transition-property: text-decoration, -webkit-text-decoration;
}
.sitenav-section--link .sitenav-link--body {
font: 500 15px/1.25 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 500 15px/1.25 var(--font-heading);
grid-column: 2/span 1;
grid-row: 2/span 1;
margin-top: 2px;
overflow: hidden;
}
@media (max-width: 1200px) {
.sitenav-section--link {
align-items: center;
grid-gap: 3px 10px;
grid-template-columns: 1fr max-content;
grid-template-rows: auto;
min-height: 48px;
}
.sitenav-section--link.is-current {
pointer-events: none;
}
.sitenav-section--link.is-current .sitenav-link--label {
color: #0f172a;
color: var(--color-slate-900);
font-weight: 500;
}
.sitenav-section--link .sitenav-link--indicate {
align-items: center;
background-color: rgba(0, 123, 255, 0.1);
background-color: rgba(var(--color-primary-500-rgb), 0.1);
border-radius: 3px;
color: #007bff;
color: var(--color-primary-500);
display: inline;
font-size: 12px;
font-weight: 500;
justify-content: center;
letter-spacing: -0.01em;
margin-left: 3px;
padding: 4px 5px;
position: absolute;
right: 1rem;
top: 50%;
transform: translateY(-50%);
}
.sitenav-section--link .sitenav-link--icon {
color: #0f172a;
color: var(--color-slate-900);
order: 2;
}
.sitenav-section--link .sitenav-link--label {
color: #1e293b;
color: var(--color-slate-800);
}
.sitenav-section--link .sitenav-link--icon {
grid-row: span 1;
height: auto;
justify-content: flex-start;
min-width: 22px;
width: 22px;
}
.sitenav-section--link .sitenav-link--icon i {
font-size: 20px;
}
.sitenav-section--link .sitenav-link--label {
font: 500 1rem/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 500 1rem/0.889 var(--font-heading);
-webkit-font-smoothing: antialiased;
white-space: pre;
}
}
.site-menu--gradient {
bottom: -5px;
left: 0;
opacity: 0.45;
pointer-events: none;
position: absolute;
right: 0;
transition: 100ms;
transition-property: bottom, opacity;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: bottom, opacity;
z-index: 0;
}
@media (min-width: 1200px) {
.site-main--wrapper {
transition-delay: 60ms;
transition-duration: 120ms;
transition-property: opacity, filter;
}
}
@media (max-width: 1200px) {
.sitenav-mobile--sectionToggle {
align-items: center;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: transparent;
border: 0px;
border: none;
color: #0f172a;
color: var(--color-slate-900);
cursor: pointer;
display: flex;
font-size: 14px;
height: 100%;
justify-content: flex-end;
outline: none;
padding: 0;
position: absolute;
right: 0;
width: 100%;
width: 100%;
z-index: 1;
}
.sitenav-mobile--sectionToggle i {
margin-right: 1.563rem;
}
.site-menu--gradient {
display: none;
}
.sitenav-bottom--section {
max-width: 100%;
position: relative;
}
.sitenav-section--link::before,
.sitenav-section--link::after {
display: none;
}
.sitenav-link--icon {
grid-row: 1/1;
height: 19px;
width: 19px;
}
.sitenav-link--body {
display: none;
margin-top: 0;
}
}
@media (min-width: 1199.98px) {
.sitenav-header--sm,
.site-mobile--bottom {
display: none;
}
}
@media (max-width: 1199.98px) {
.site-mobile--bottom {
margin-top: 2rem;
max-width: 100vw;
padding: 0 1rem 1rem 1rem;
position: relative;
width: 100%;
}
.sitenav-sm--row[data-nav=contact] {
display: none;
}
.sitenav-sm--row[data-nav=social] {
margin-bottom: 12px;
margin-top: 12px;
}
.sitenav-sm--row[data-nav=social] ul {
display: flex;
font-size: 20px;
gap: 10px;
}
.sitenav-sm--row[data-nav=social] ul li a {
justify-content: center;
}
.sitenav-sm--row[data-nav=social] ul li a,.sitenav-sm--row[data-nav=legal] {
align-items: center;
color: #475569;
color: var(--color-slate-600);
display: flex;
}
.sitenav-sm--row[data-nav=legal] {
font-size: 14px;
gap: 6px;
margin-bottom: 10px;
}
.sitenav-sm--row[data-nav=copy] {
color: #475569;
color: var(--color-slate-600);
font-size: 14px;
margin-bottom: 4px;
}
}
@media (max-height: 668px) {
.site-mobile--bottom {
display: none;
}
}
.main-footer {
overflow: hidden;
position: relative;
}
.main-footer__top {
padding-top: 40px;
position: relative;
width: 100%;
}
@media (min-width: 992px) {
.main-footer__top {
padding-top: 120px;
}
}
@media (min-width: 1380px) {
.main-footer__top {
align-items: flex-end;
display: grid;
grid-gap: 4rem;
grid-template-columns: 0.45fr 1fr;
}
}
.main-footer__bottom {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
padding-bottom: 60px;
position: relative;
width: 100%;
}
.main-footer__bottom p {
color: #64748b;
color: var(--color-slate-500);
font-feature-settings: "onum" 0, "lnum" 1;
font-size: 13px;
margin: 40px 0 0.475rem;
}
.main-footer__bottom span:not(:first-child) {
margin-left: 0.35em;
}
.main-footer__bottom a {
color: #64748b;
color: var(--color-slate-500);
}
@media (min-width: 1380px) {
.main-footer__bottom {
align-items: flex-start;
margin-top: 40px;
}
}
.main-footer__logo {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.main-footer__logo svg {
color: #007bff;
color: var(--color-primary-500);
display: block;
height: auto;
max-width: 220px;
}
.main-footer__logo p {
color: #475569;
color: var(--color-slate-600);
font-size: 15px;
font-weight: 400;
line-height: 1.563;
margin-left: auto;
margin-right: auto;
margin-top: 2em;
max-inline-size: 60ch;
text-align: center;
text-wrap: balance;
}
@media (min-width: 1380px) {
.main-footer__logo p {
color: #64748b;
color: var(--color-slate-500);
font-size: 13px;
font-weight: 400;
line-height: 1.414;
margin-left: 0;
margin-right: 0;
text-align: left;
}
.main-footer__logo {
align-items: flex-start;
}
}
@media (min-width: 1380px) {
}
.main-footer__navs {
display: grid;
grid-gap: 40px;
margin-bottom: 100px;
margin-top: 100px;
position: relative;
}
.main-footer__navs::before, .main-footer__navs::after {
background-image: linear-gradient(to right, white, #e2e8f0 50%, white);
background-image: linear-gradient(to right, white, var(--color-slate-200) 50%, white);
content: "";
display: block;
height: 1px;
position: absolute;
width: 100%;
}
.main-footer__navs::before {
top: -50px;
}
.main-footer__navs::after {
bottom: -50px;
}
.main-footer__navs nav {
display: flex;
flex-direction: column;
justify-content: flex-start;
text-align: center;
}
.main-footer__navs nav h3 {
font-size: 1rem;
font-weight: 600;
line-height: 1.602;
}
@media (max-width: 768px) {
.main-footer__navs nav h3 {
align-items: center;
color: #0f172a;
color: var(--color-slate-900);
display: flex;
font-size: 14px;
font-weight: 500;
justify-content: space-between;
line-height: 32px;
min-height: auto;
padding: 0;
}
.main-footer__navs nav h3 i {
display: none;
}
.is-open .main-footer__navs nav h3 i {
transform: rotate(180deg);
}
}
.main-footer__navs nav ul {
display: flex;
flex-direction: column;
}
.main-footer__navs nav ul li a {
color: #475569;
color: var(--color-slate-600);
display: flex;
font-size: 16px;
font-weight: 400;
justify-content: center;
line-height: 32px;
text-align: center;
}
@media (min-width: 992px) {
.main-footer__navs nav ul li a .nav-item--link {
line-height: 28px;
}
}
.main-footer__navs nav ul li a:hover, .main-footer__navs nav ul li a:focus {
color: #007bff;
color: var(--color-primary-500);
outline: 0;
}
@media (max-width: 768px) {
.main-footer__navs nav ul li a {
font-size: 14px;
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.main-footer__navs nav ul li a,.main-footer__navs nav {
justify-content: flex-start;
text-align: left;
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
}
@media (min-width: 1380px) {
.main-footer__navs nav {
text-align: left;
}
.main-footer__navs nav ul {
align-items: flex-start;
justify-content: flex-start;
text-align: left;
}
}
@media (min-width: 768px) {
.main-footer__navs {
grid-template-columns: repeat(2, minmax(min-content, auto));
justify-content: center;
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.main-footer__navs {
grid-gap: 40px 100px;
grid-template-columns: repeat(3, minmax(min-content, auto));
justify-content: center;
}
}
@media (min-width: 1380px) {
.main-footer__navs {
grid-gap: 2rem 3rem;
grid-template-columns: repeat(3, auto);
justify-content: flex-end;
margin-bottom: 0;
margin-top: 0;
}
.main-footer__navs::before, .main-footer__navs::after {
display: none;
}
}
@media (max-width: 768px) {
.main-footer__navs {
grid-gap: calc(80px * 1);
grid-gap: calc(80px * var(--scale));
grid-template-columns: repeat(2, max-content);
justify-content: center;
}
.main-footer__navs .nav-item--link {
justify-content: flex-start;
line-height: 32px;
padding: 0;
}
}
.main-footer nav[aria-labelledby=quicknav-legal] ul {
display: flex;
flex-wrap: wrap;
font-size: 14px;
grid-gap: 6px;
justify-content: center;
text-align: center;
}
.main-footer nav[aria-labelledby=quicknav-legal] ul li a {
display: flex;
}
.main-footer nav[aria-labelledby=quicknav-social] {
order: -1;
}
.main-footer nav[aria-labelledby=quicknav-social] ul {
display: flex;
grid-gap: 12px;
}
.main-footer nav[aria-labelledby=quicknav-social] ul li a {
color: #64748b;
color: var(--color-slate-500);
display: flex;
font-size: 24px;
}
@media (min-width: 1380px) {
.main-footer nav[aria-labelledby=quicknav-social] {
bottom: 40px;
order: -1;
position: absolute;
right: 0;
}
}
.main-footer nav a {
font-size: 13px;
text-decoration: underline;
text-decoration-color: transparent;
-webkit-text-decoration-skip: ink;
text-decoration-skip-ink: auto;
text-decoration-thickness: 1px;
text-underline-offset: 0.25em;
white-space: pre;
}
.main-footer nav a:hover, .main-footer nav a:focus {
text-decoration-color: #007bff;
text-decoration-color: var(--color-primary-500);
}
.site-footer--logo svg {
color: #007bff;
color: var(--color-primary-500);
display: block;
}
.site-footer--logo p {
font-size: 14px;
font-weight: 400;
line-height: 1.402;
}
.site-footer--gradient {
bottom: -30px;
display: block;
height: 40px;
position: absolute;
width: 150%;
}
.page-header {
--page-header-title: 700 var(--rem-p3)/var(--em-p2) var(--font-heading);
--page-header-excerpt: 400 1rem/var(--em-p3) var(--font-heading);
--page-header-grid-figure: 320px;
--page-header-grid-object-w: 60px;
--page-header-grid-object-o: -45deg;
--page-header-grid-object-m: -10px;
--page-header-grid-gap: var(--em-p2);
--page-header-grid-columns: 1fr var(--page-header-grid-figure);
--page-header-color: var(--color-primary-300-rgb);
margin-bottom: calc(3.653rem * 1.266);
margin-bottom: calc(var(--rem-p10) * 1.266);
margin-top: calc(3.653rem * 1.266);
margin-top: calc(var(--rem-p10) * 1.266);
}
.page-header__content {
display: grid;
grid-gap: var(--em-n7);
justify-content: flex-start;
}
@media (min-width: 768px) {
.page-header__content {
grid-gap: 0.555em;
grid-gap: var(--em-n5);
justify-content: center;
}
}
@media (min-width: 1380px) {
.page-header__content {
grid-gap: 0.79em;
grid-gap: var(--em-n2);
max-width: 39.292em;
max-width: var(--site-max-length);
}
}
.page-header__figure::before,
.page-header__figure::after {
background-image: linear-gradient(var(--page-header-grid-object-o), rgba(var(--page-header-color), 0.6), white 80%);
border-radius: 0.25em;
content: "";
height: var(--page-header-grid-object-w);
-webkit-mask-image: url(/wp-content/themes/cybersmile-wp-main-3.1.30/assets/img/vectors/square.svg);
mask-image: url(/wp-content/themes/cybersmile-wp-main-3.1.30/assets/img/vectors/square.svg);
-webkit-mask-position: center;
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
opacity: 0.25;
pointer-events: none;
position: absolute;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: var(--page-header-grid-object-w);
z-index: -1;
}
.page-header__figure::before {
bottom: var(--page-header-grid-object-m);
left: var(--page-header-grid-object-m);
}
.page-header__figure::after {
right: var(--page-header-grid-object-m);
top: var(--page-header-grid-object-m);
}
@media (min-width: 992px) {
.page-header {
--page-header-grid-object-w: 100px;
--page-header-grid-object-m: -20px;
}
}
.page-header__title {
font: var(--page-header-title);
}
.page-header__excerpt {
font: var(--page-header-excerpt);
}
.page-header__title,
.page-header__excerpt {
margin-left: auto;
margin-right: auto;
max-width: 39.292em;
max-width: var(--site-max-length);
text-align: center;
}
@media (min-width: 768px) {
.page-header {
--page-header-grid-figure: 300px;
}
.page-header__title,
.page-header__excerpt {
text-align: left;
}
.page-header__title {
font-size: 1.802rem;
font-size: var(--rem-p5);
}
.page-header__excerpt {
font-size: 1.266rem;
font-size: var(--rem-p2);
}
}
@media (min-width: 992px) {
.page-header__title,
.page-header__excerpt {
margin-left: 0;
margin-right: 0;
}
.page-header__title {
font-size: 2.281rem;
font-size: var(--rem-p7);
letter-spacing: -0.02em;
}
.page-header__excerpt {
font-size: 1.424rem;
font-size: var(--rem-p3);
}
}
@media (min-width: 1380px) {
.page-header__title {
font-size: 2.566rem;
font-size: var(--rem-p8);
line-height: 1.266em;
line-height: var(--em-p2);
}
.page-header__excerpt {
font-size: 1.266rem;
font-size: var(--rem-p2);
line-height: 1.424em;
line-height: var(--em-p3);
}
}
.page-header[data-align=center] {
align-items: center;
display: flex;
justify-content: center;
text-align: center;
}
.page-header[data-align=center] .page-header__title,
.page-header[data-align=center] .page-header__excerpt {
margin-left: auto;
margin-right: auto;
max-width: calc(39.292em / 1.266);
max-width: calc(var(--site-max-length) / 1.266);
}
.profile-box {
animation: fade-in-fwd 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both;
background-color: var(--bg);
background-image: var(--gradient);
/* outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15); */
border: 1px solid rgba(var(--page-primary-rgb), 0.15);
border-radius: 10px;
overflow: hidden;
}
@keyframes fade-in-fwd {
0% {
opacity: 0;
transform: translateZ(-80px) translateY(50px) scale(0.95);
transform-origin: 50% 100%;
}
100% {
opacity: 1;
transform: translateZ(0) translateY(0) scale(1);
transform-origin: 50% 100%;
}
}
.section-profile__header *::-moz-selection {
background: rgba(var(--page-primary-rgb), 0.15);
color: #0f172a;
color: var(--color-slate-900);
}
.section-profile__header *::selection {
background: rgba(var(--page-primary-rgb), 0.15);
color: #0f172a;
color: var(--color-slate-900);
}
.profile-header {
--r: 8px;
--g: var(--gutter);
--bg: var(--color-white);
--gradient: radial-gradient(at 9% 0%, rgba(var(--page-primary-rgb), 0.1) 0px, transparent 50%), radial-gradient(at 87% 75%, rgba(var(--page-secondary-rgb), 0.04) 0px, transparent 50%);
--first-col-w: 220px;
--first-col-h: 220px;
--last-col-w: calc(var(--first-col-w) * 2);
--last-col-h: var(--first-col-h);
align-items: center;
border-radius: 8px;
border-radius: var(--r);
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
padding: 1rem;
position: relative;
}
@media (min-width: 992px) {
.profile-header {
grid-gap: 1.953rem;
padding: calc(var(--g) * 1);
}
}
.profile-header[data-type=advisor],
.profile-header[data-type=ambassador] {
background-color: white;
background-image: linear-gradient(to left, white 25%, rgba(var(--page-primary-rgb), 0.02) 100%);
border: 1px solid rgba(var(--page-primary-rgb), 0.2);
border-radius: 8px;
}
.profile-header .profile-header--col:nth-of-type(2) {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
padding: 1rem 0 0;
}
@media (max-width: 1100px) {
.profile-header {
--first-col-w: 100px;
--first-col-h: 100px;
}
.profile-header[data-type=report],
.profile-header[data-type=module],
.profile-header[data-type=ambassador],
.profile-header[data-type=advisor] {
grid-gap: 0;
}
.profile-header[data-type=ambassador] .profile-header--meta p,
.profile-header[data-type=advisor] .profile-header--meta p {
display: none;
}
}
@media (max-width: 1100px) {
}
@media (min-width: 768px) and (max-width: 1100px) {
.profile-header {
--first-col-w: 120px;
--first-col-h: 120px;
}
}
@media (min-width: 1100px) and (max-width: 1380px) {
.profile-header:not([data-type=partner]),
.profile-header:not([data-type=campaign]) {
--first-col-w: 225px;
--first-col-h: 225px;
grid-template-columns: 225px 1fr;
grid-template-columns: var(--first-col-w) 1fr;
}
.profile-header[data-type=partner],
.profile-header[data-type=campaign] {
--first-col-w: 180px;
--first-col-h: 180px;
grid-template-columns: 180px 1fr 180px;
grid-template-columns: var(--first-col-w) 1fr 180px;
}
}
@media (min-width: 1380px) {
.profile-header:not([data-type=partner]),
.profile-header:not([data-type=campaign]) {
--first-col-w: 225px;
--first-col-h: 225px;
grid-template-columns: 225px 1fr;
grid-template-columns: var(--first-col-w) 1fr;
}
.profile-header[data-type=partner],
.profile-header[data-type=campaign],
.profile-header[data-type=resource],
.profile-header[data-type=report],
.profile-header[data-type=module] {
grid-template-columns: var(--first-col-w) 1fr auto;
}
}
.profile-header[data-type=ambassador] .profile-header--gallery,.profile-header[data-type=advisor] .profile-header--gallery,.profile-header[data-type=partner] .profile-header--links,
.profile-header[data-type=campaign] .profile-header--links {
display: none;
}
.profile-header .profile-shade {
bottom: 0;
display: none;
height: 100%;
max-width: 400px;
overflow: hidden;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
z-index: 0;
}
@media (min-width: 1200px) {
.profile-header .profile-shade {
display: block;
}
}
.profile-header .profile-shade::before,
.profile-header .profile-shade::after {
content: "";
display: block;
height: 300px;
mix-blend-mode: color-burn;
opacity: 0.08;
position: absolute;
right: 0;
transition-duration: 150ms;
transition-property: clip-path;
width: 300px;
will-change: clip-path;
z-index: 0;
}
.profile-header .profile-shade::before {
background-color: rgba(var(--page-primary-rgb), 0.15);
clip-path: circle(57% at 100% 100%);
top: 0;
}
.profile-header .profile-shade::after {
background-color: rgba(var(--page-primary-rgb), 0.15);
bottom: 0;
clip-path: circle(57.8% at 76% 100%);
}
@media (max-width: 1380px) {
.profile-header .profile-shade {
right: inherit;
}
.profile-header .profile-shade::before,
.profile-header .profile-shade::after {
bottom: inherit;
left: 0;
right: inherit;
top: 0;
}
.profile-header .profile-shade::before {
clip-path: circle(64.4% at 0% 2%);
}
.profile-header .profile-shade::after {
clip-path: circle(78.6% at 1% 0);
}
}
@media (max-width: 992px) {
.profile-header .profile-shade::before,
.profile-header .profile-shade::after {
height: 200px;
width: 200px;
}
}
.profile-header[data-type=report] .profile-shade,
.profile-header[data-type=resource] .profile-shade,
.profile-header[data-type=module] .profile-shade {
width: 100%;
}
.profile-header[data-type=report] .profile-shade::before,
.profile-header[data-type=resource] .profile-shade::before,
.profile-header[data-type=module] .profile-shade::before {
top: 0;
}
.profile-header[data-type=report] .profile-shade::after,
.profile-header[data-type=resource] .profile-shade::after,
.profile-header[data-type=module] .profile-shade::after {
display: none;
}
.profile-header[data-type=report] .profile-shade::before,
.profile-header[data-type=resource] .profile-shade::before,
.profile-header[data-type=module] .profile-shade::before {
bottom: 0;
clip-path: polygon(0% 70%, 4.17% 70%, 4.17% 10%, 8.33% 10%, 8.33% 90%, 12.5% 90%, 12.5% 50%, 16.67% 50%, 16.67% 80%, 20.83% 80%, 20.83% 10%, 25% 10%, 25% 10%, 29.17% 10%, 29.17% 40%, 33.33% 40%, 33.33% 80%, 37.5% 80%, 37.5% 60%, 41.67% 60%, 41.67% 20%, 45.83% 20%, 45.83% 70%, 50% 70%, 50% 40%, 54.17% 40%, 54.17% 80%, 58.33% 80%, 58.33% 80%, 62.5% 80%, 62.5% 60%, 66.67% 60%, 66.67% 90%, 70.83% 90%, 70.83% 10%, 75% 10%, 75% 60%, 79.17% 60%, 79.17% 80%, 83.33% 80%, 83.33% 20%, 87.5% 20%, 87.5% 10%, 91.67% 10%, 91.67% 90%, 95.83% 90%, 95.83% 50%, 100% 50%, 100% 0%, 95.83% 0%, 95.83% 0%, 91.67% 0%, 91.67% 0%, 87.5% 0%, 87.5% 0%, 83.33% 0%, 83.33% 0%, 79.17% 0%, 79.17% 0%, 75% 0%, 75% 0%, 70.83% 0%, 70.83% 0%, 66.67% 0%, 66.67% 0%, 62.5% 0%, 62.5% 0%, 58.33% 0%, 58.33% 0%, 54.17% 0%, 54.17% 0%, 50% 0%, 50% 0%, 45.83% 0%, 45.83% 0%, 41.67% 0%, 41.67% 0%, 37.5% 0%, 37.5% 0%, 33.33% 0%, 33.33% 0%, 29.17% 0%, 29.17% 0%, 25% 0%, 25% 0%, 20.83% 0%, 20.83% 0%, 16.67% 0%, 16.67% 0%, 12.5% 0%, 12.5% 0%, 8.33% 0%, 8.33% 0%, 4.17% 0%, 4.17% 0%, 0% 0%, 0% 0%);
height: 100%;
left: 0;
-webkit-mask: linear-gradient(transparent, white 3rem calc(100% - 3rem), transparent), linear-gradient(90deg, transparent, white 3rem calc(100% - 3rem), transparent);
mask: linear-gradient(transparent, white 3rem calc(100% - 3rem), transparent), linear-gradient(90deg, transparent, white 3rem calc(100% - 3rem), transparent);
-webkit-mask-composite: source-in, xor;
mask-composite: intersect;
opacity: 0.08;
right: 0;
top: inherit;
transform: scaleY(-1) scaleX(1.5);
transform-origin: left center;
width: 100%;
}
.profile-header--picture {
align-items: center;
aspect-ratio: 1/1;
display: flex;
height: 100%;
justify-content: center;
min-height: var(--first-col-h);
min-width: var(--first-col-w);
position: relative;
width: var(--first-col-w);
}
body[data-template-type=partner] .profile-header--picture,
body[data-template-type=campaign] .profile-header--picture,
body[data-template-type=resource] .profile-header--picture,
body[data-template-type=advisor] .profile-header--picture,
body[data-template-type=ambassador] .profile-header--picture {
border-radius: 8px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}
.profile-picture--icon {
color: white;
display: block;
height: 50%;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 50%;
z-index: 2;
}
.profile-header--picture img {
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
/*
[data-type="ambassador"] .profile-header--picture,
[data-type="advisor"] .profile-header--picture {
filter: drop-shadow(2px 4px 6px rgba(0, 0, 0, 0.1));
} */
*:not([data-type=partner]) .profile-header--picture img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
}
[data-type=partner] .profile-header--picture {
-webkit-backdrop-filter: blur(20px);
backdrop-filter: blur(20px);
background-color: rgba(255, 255, 255, 0.85);
}
[data-type=partner] .profile-header--picture img {
height: 50%;
left: 50%;
-o-object-fit: contain;
object-fit: contain;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 50%;
}
[data-type=ambassador] .profile-header--picture img,
[data-type=advisor] .profile-header--picture img,
[data-type=campaign] .profile-header--picture img,
[data-type=resource] .profile-header--picture img,
[data-type=report] .profile-header--picture img,
[data-type=module] .profile-header--picture img {
border-radius: 8px;
}
[data-type=ambassador] .profile-header--picture img:nth-of-type(1),
[data-type=advisor] .profile-header--picture img:nth-of-type(1),
[data-type=campaign] .profile-header--picture img:nth-of-type(1),
[data-type=resource] .profile-header--picture img:nth-of-type(1),
[data-type=report] .profile-header--picture img:nth-of-type(1),
[data-type=module] .profile-header--picture img:nth-of-type(1) {
z-index: 1;
}
[data-type=ambassador] .profile-header--picture img:nth-of-type(2),
[data-type=advisor] .profile-header--picture img:nth-of-type(2),
[data-type=campaign] .profile-header--picture img:nth-of-type(2),
[data-type=resource] .profile-header--picture img:nth-of-type(2),
[data-type=report] .profile-header--picture img:nth-of-type(2),
[data-type=module] .profile-header--picture img:nth-of-type(2) {
z-index: 0;
}
body[data-template-type=partner] .site-main--wrapper > section:first-of-type,
body[data-template-type=resource] .site-main--wrapper > section:first-of-type,
body[data-template-type=campaign] .site-main--wrapper > section:first-of-type,
body[data-template-type=advisor] .site-main--wrapper > section:first-of-type,
body[data-template-type=ambassador] .site-main--wrapper > section:first-of-type,body[data-template-type=partner] .site-main--wrapper > section,
body[data-template-type=resource] .site-main--wrapper > section,
body[data-template-type=campaign] .site-main--wrapper > section,
body[data-template-type=advisor] .site-main--wrapper > section,
body[data-template-type=ambassador] .site-main--wrapper > section {
margin-top: 1.563rem;
}
@media (min-width: 1100px) {
body[data-template-type=campaign] .site-main--wrapper > section {
margin-bottom: 2rem;
margin-top: 2rem;
}
}
@media (max-width: 1024px) {
.profile-aside {
margin-top: 1.563rem;
}
.profile-header--picture img:nth-of-type(2) {
display: none;
}
[data-type=ambassador] .profile-header--picture,
[data-type=advisor] .profile-header--picture,
[data-type=resource] .profile-header--picture {
height: 85px;
margin-bottom: 15px;
margin-top: -10px;
min-height: 85px;
min-width: 85px;
position: absolute;
right: 1rem;
top: -1.15rem;
transform: rotate(1deg);
width: 85px;
}
body[data-template-type=advisor] .profile-header--meta h2,
body[data-template-type=ambassador] .profile-header--meta h2 {
margin-bottom: 0;
}
.profile-header .profile-header--col:nth-of-type(2) {
padding-top: 0;
}
[data-type=report] .profile-header--picture,
[data-type=module] .profile-header--picture {
height: 100px;
margin-bottom: 1.25rem;
width: 100px;
}
}
.profile-header--meta,
.profile-header--links,
.profile-header--gallery,
.profile-header--picture {
position: relative;
z-index: 2;
}
.profile-header--meta {
align-items: flex-start;
display: flex;
flex-direction: column;
justify-content: center;
}
.profile-header--meta h1 {
color: #0f172a;
color: var(--color-slate-900);
display: inline;
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
font-size: 1.563rem;
font-weight: 700;
letter-spacing: 0;
line-height: 1.25;
}
@media (min-width: 1200px) {
.profile-header--meta h1 {
align-items: center;
display: flex;
gap: 7px;
justify-content: flex-start;
}
}
.profile-header--meta h1 svg {
display: block;
height: 0.65em;
width: 0.65em;
}
.profile-header--meta h1 svg,[data-type=advisor] .profile-header--meta h1 svg,[data-type=ambassador] .profile-header--meta h1 svg {
color: #007bff;
color: var(--color-primary-500);
}
@media (max-width: 992px) {
.profile-header--meta h1 {
align-items: center;
display: flex;
font-size: 20px;
font-weight: 600;
gap: 4px;
text-wrap: balance;
}
}
.profile-header--meta h2 {
color: #64748b;
color: var(--color-slate-500);
font: 500 1rem / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h5);
font-size: 15px;
font-weight: 500;
line-height: 1;
margin-bottom: 32px;
margin-top: 6px;
}
@media (min-width: 1024px) {
.profile-header--meta h2 {
margin-bottom: 12px;
margin-top: 0.25em;
}
}
.profile-header--meta h2 a {
color: inherit;
}
.profile-header--meta h2 a:focus,
.profile-header--meta h2 a:hover {
text-decoration: underline;
text-decoration-color: rgba(var(--page-primary-rgb), 0.35);
text-underline-offset: 0.15em;
}
[data-type=campaign] .profile-header--meta h2 i {
font-size: 100%;
}
.profile-header--meta h2 i {
color: #007bff;
font-size: 80%;
}
[data-type=ambassador] .profile-header--date,
[data-type=advisor] .profile-header--date {
color: #64748b;
color: var(--color-slate-500);
font-size: 14px;
order: 2;
}
@media (min-width: 992px) {
[data-type=ambassador] .profile-header--date,
[data-type=advisor] .profile-header--date {
order: -1;
}
}
[data-type=ambassador] .profile-header--date i,
[data-type=advisor] .profile-header--date i {
color: #64748b;
color: var(--color-slate-500);
font-size: 100%;
}
.profile-header--meta p {
color: #475569;
color: var(--color-slate-600);
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
}
.profile-header--meta h1 + p {
margin-top: 8px;
}
.profile-container-grid {
grid-gap: 1.953rem;
}
.profile-aside,
.profile-container {
display: flex;
flex-direction: column;
}
@media (min-width: 1200px) {
.profile-header--meta p {
font-size: 17px;
line-height: 1.414;
}
body[data-template-type=advisor] .profile-header--meta p,
body[data-template-type=ambassador] .profile-header--meta p {
font-size: 1.125rem;
margin-top: 0;
text-wrap: balance;
}
}
.profile-header--meta .profile-note {
background-color: #fffce5;
border: 1px dashed #e7c800;
border-radius: 6px;
display: inline-block;
font-size: 16px;
font-weight: 400;
margin-top: 12px;
max-width: -moz-max-content;
max-width: max-content;
padding: 12px;
}
.profile-header--meta .profile-note mark {
background-color: transparent;
font-weight: 500;
text-decoration: underline;
}
@media (min-width: 768px) and (max-width: 992px) {
.profile-header--meta h1 {
font-size: 1.602rem;
letter-spacing: 0;
}
.profile-header--meta h2 {
font-size: 1.25rem;
letter-spacing: 0;
}
.profile-header--meta p {
margin-top: 1em;
}
}
@media (min-width: 992px) {
.profile-header--meta h1 {
color: #1e293b;
color: var(--color-slate-800);
font: 600 calc(2.074 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h2);
font-size: 1.563rem;
font-weight: 700;
}
.profile-header--meta h2 {
font: 500 1rem / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h5);
font-weight: 500;
letter-spacing: 0;
}
.profile-header--meta p {
margin-top: 1.25em;
}
.profile-header--meta h1 + p {
margin-top: 12px;
}
}
@media (max-width: 1380px) {
.profile-header--links {
margin-top: 1.563rem;
}
}
.profile-header--links {
align-items: flex-end;
display: flex;
justify-content: space-between;
}
.profile-header--links ul {
gap: 6px;
list-style: none;
margin: 0;
padding: 0;
}
.profile-header--links ul,.profile-header--links ul li a {
align-items: center;
display: flex;
}
.profile-header--links ul li a {
background-color: white;
background-image: linear-gradient(to bottom, #f8fafc, #f1f5f9);
background-image: linear-gradient(to bottom, var(--color-slate-50), var(--color-slate-100));
border: 1px solid rgba(71, 85, 105, 0.35);
border: 1px solid rgba(var(--color-slate-600-rgb), 0.35);
border-radius: 8px;
color: #475569;
color: var(--color-slate-600);
height: 28px;
justify-content: center;
justify-content: center;
outline-color: rgba(71, 85, 105, 0.15);
outline-color: rgba(var(--color-slate-600-rgb), 0.15);
outline-offset: 0.25em;
outline-style: solid;
outline-width: 0px;
position: relative;
top: 0;
transition-duration: 100ms;
transition-property: color, background-color, border-color, outline-color, outline-width, outline-offset, top;
transition-timing-function: ease-in-out;
width: 28px;
will-change: color, background-color, border-color, outline-color, outline-width, outline-offset, top;
}
.profile-header--links ul li a svg {
display: block;
fill: currentColor;
height: 16px;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 16px;
}
.profile-header--links ul li a:active {
top: 1px;
}
.profile-header--links ul li a:hover {
border-color: rgba(var(--page-primary-rgb), 1);
outline-color: rgba(var(--page-primary-rgb), 0.25);
outline-offset: 0;
outline-style: solid;
outline-width: 2px;
}
.profile-header--gallery {
align-items: center;
display: flex;
height: var(--last-col-h);
justify-content: center;
width: var(--last-col-w);
}
.profile-header--gallery .profile-gallery--item {
aspect-ratio: 1/1;
border: 1px solid rgba(var(--page-primary-rgb), 1);
border-radius: calc(var(--r) * 2);
display: block;
height: calc(var(--last-col-w) / 2);
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.25);
overflow: hidden;
position: absolute;
transform-origin: center;
transition-duration: 250ms;
transition-property: transform;
width: calc(var(--last-col-w) / 2);
will-change: transform;
}
.profile-header--gallery .profile-gallery--item[aria-hidden] {
--rotate-odd: 0deg;
--rotate-even: 0deg;
--scale-odd: 0;
--scale-even: 0;
--translate-odd: 0%, 0%;
--translate-even: 0%, 0%;
}
.profile-header--gallery .profile-gallery--item[aria-hidden=false] {
--rotate-odd: -3deg;
--rotate-even: 3deg;
--scale-odd: .85;
--scale-even: .95;
--translate-odd: -30%, 0%;
--translate-even: 50%, 0%;
}
.profile-header--gallery .profile-gallery--item:nth-of-type(1),
.profile-header--gallery .profile-gallery--item:nth-of-type(3),
.profile-header--gallery .profile-gallery--item:nth-of-type(5) {
transform: translate(var(--translate-odd)) scale(var(--scale-odd)) rotate(var(--rotate-odd));
transition-delay: 100ms;
}
.profile-header--gallery .profile-gallery--item:nth-of-type(2),
.profile-header--gallery .profile-gallery--item:nth-of-type(4),
.profile-header--gallery .profile-gallery--item:nth-of-type(6) {
transform: translate(var(--translate-even)) scale(var(--scale-even)) rotate(var(--rotate-even));
transition-delay: 200ms;
}
@media (max-width: 992px) {
.profile-header--gallery {
position: absolute;
right: 1rem;
top: 0;
}
.profile-header--picture {
margin-top: -2rem;
position: relative;
}
.profile-header--gallery .profile-gallery--item[aria-hidden=false] {
--translate-even: 51%, -33%;
--translate-odd: -23%, -74%;
--scale-odd: .8;
--scale-even: .75;
top: 50%;
transform-origin: top right;
}
.profile-header--gallery .profile-gallery--item {
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}
}
@media (min-width: 992px) and (max-width: 1380px) {
.profile-header--gallery {
height: 100%;
position: absolute;
right: 0;
top: 0;
}
.profile-header--gallery .profile-gallery--item[aria-hidden=false] {
--translate-even: 51%, -33%;
--translate-odd: -18%, -65%;
--scale-odd: .7;
--scale-even: .7;
}
}
.profile-header--gallery img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.profile-note ul {
flex-direction: row;
gap: 18px;
list-style: none;
margin: 0;
padding: 0;
position: relative;
z-index: 3;
}
.profile-note ul,.profile-note ul li {
align-items: center;
display: flex;
}
.profile-note ul li {
font-size: 1rem;
font-weight: 400;
font-weight: 500;
justify-content: flex-start;
line-height: 1;
width: -moz-max-content;
width: max-content;
}
@media (min-width: 1380px) {
[data-type=module] .profile-note ul li {
font-size: 24px;
}
}
.profile-header--logo {
align-items: center;
display: flex;
height: 40px;
justify-content: flex-end;
position: absolute;
right: 1.563rem;
top: 1.563rem;
width: auto;
}
.profile-header--logo img {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.profile-header--logo img.img-landscape,
.profile-header--logo img[data-img-format=landscape] {
max-height: 32px;
}
.profile-header--logo img.img-square,
.profile-header--logo img[data-img-format=square] {
height: 32px;
width: 32px;
}
.profile-header--cta {
align-items: flex-end;
display: flex;
flex-direction: column;
font-size: 24px;
font-weight: 600;
height: 100%;
justify-content: flex-end;
margin-top: 1em;
max-width: -moz-max-content;
max-width: max-content;
}
.profile-header--cta a,
.chart__prev-button,
.chart__next-button {
align-items: center;
background-color: white;
border: 1px solid rgba(var(--page-primary-rgb), 0.35);
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
color: #80bdff;
color: var(--page-primary-hex);
cursor: pointer;
display: flex;
font-size: 16px;
font-weight: 550;
gap: 6px;
justify-content: center;
line-height: 1;
max-width: -moz-max-content;
max-width: max-content;
outline: 0.25em solid rgba(var(--page-primary-rgb), 0);
outline-offset: 5px;
overflow: hidden;
padding: 0.825em 1em;
position: relative;
text-decoration: none;
transition-delay: 0ms, 150ms, 0ms, 0ms, 0ms, 0ms, 0ms;
transition-duration: 150ms, 200ms, 150ms, 150ms, 150ms, 150ms, 150ms;
transition-property: outline-offset, outline-color, border-color, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
width: 100%;
z-index: 10;
}
.profile-header--cta a span,
.chart__next-button span,
.chart__prev-button span {
pointer-events: none;
}
.profile-header--cta a:hover,
.profile-header--cta a:focus,
.chart__prev-button:hover,
.chart__prev-button:focus,
.chart__next-button:hover,
.chart__next-button:focus {
border-color: rgba(var(--page-primary-rgb), 0.7);
outline-color: rgba(var(--page-primary-rgb), 0.1);
outline-offset: 0;
}
.profile-header--cta a:active,
.chart__prev-button:active,
.chart__next-button:active {
transform: translateY(-1px);
}
/* @media (max-width: 1380px) {
.profile-header--cta {
display: none;
}
} */
.orbit-gradient {
background-image: radial-gradient(at 57% 71%, rgba(244, 123, 224, 0.75) 0px, transparent 50%), radial-gradient(at 0% 79%, rgba(112, 87, 234, 0.53) 0px, transparent 50%), radial-gradient(at 97% 93%, rgba(237, 182, 80, 0.76) 0px, transparent 50%), radial-gradient(at 0% 82%, rgba(163, 200, 245, 0.96) 0px, transparent 50%), radial-gradient(at 4% 3%, rgba(148, 240, 201, 0.95) 0px, transparent 50%);
bottom: 0;
content: "";
display: block;
height: 100vh;
left: 0;
opacity: 0.1;
position: fixed;
right: 0;
top: 0;
width: 100vw;
}
.orbit {
--color-1-light: 255, 188, 216;
--color-2-light: 130, 207, 232;
--color-3-light: 255, 223, 186;
--color-4-light: 199, 206, 234;
--color-5-light: 255, 241, 208;
--color-6-light: 208, 234, 199;
--color-1-dark: 127, 94, 108;
--color-2-dark: 65, 103, 116;
--color-3-dark: 127, 111, 93;
--color-4-dark: 99, 103, 117;
--color-5-dark: 127, 120, 104;
--color-6-dark: 104, 117, 99;
transform: translateX(-50%) translateY(-50%);
}
.orbit,.orbit .circle-mask {
left: 50%;
position: absolute;
top: 50%;
}
.orbit .circle-mask {
background-image: radial-gradient(white 10%, rgba(255, 255, 255, 0) 70%);
content: "";
height: 200%;
transform: translate(-50%, -50%);
width: 200%;
z-index: -1;
}
.orbit .inner-circle {
--w: 170px;
--h: 170px;
--stroke: var(--color-slate-300);
--bg: white;
--icon-radius: 0.25em;
height: 170px;
height: var(--h);
width: 170px;
width: var(--w);
}
.orbit .inner-circle .cyllinder {
animation: animateCyllinder 1s cubic-bezier(0.39, 0.575, 0.565, 1) forwards;
height: calc(var(--h) / 2.5);
left: 50%;
position: absolute;
scale: 0;
top: 50%;
transform: translate(-50%, -50%);
transform-origin: left top;
transform-origin: center;
width: calc(var(--w) * 2.5);
}
.orbit .inner-circle .cyllinder:nth-of-type(1) {
animation-delay: 300ms;
rotate: 0deg;
transform-origin: left top;
}
.orbit .inner-circle .cyllinder:nth-of-type(2) {
animation-delay: 500ms;
rotate: 45deg;
transform-origin: left top;
}
.orbit .inner-circle .cyllinder:nth-of-type(2) .circle-inner {
transform: rotate(-45deg);
}
.orbit .inner-circle .cyllinder:nth-of-type(2) .circle-shadow {
transform: rotate(-45deg) translate(-50%, -50%);
transform-origin: 0 0;
}
.orbit .inner-circle .cyllinder:nth-of-type(3) {
animation-delay: 600ms;
rotate: -45deg;
transform-origin: left top;
}
.orbit .inner-circle .cyllinder:nth-of-type(3) .circle-inner {
transform: rotate(45deg);
}
.orbit .inner-circle .cyllinder:nth-of-type(3) .circle-shadow {
transform: rotate(45deg) translate(-50%, -50%);
transform-origin: 0 0;
}
.orbit .inner-circle .cyllinder:nth-of-type(4) {
animation-delay: 900ms;
rotate: 90deg;
transform-origin: left top;
}
.orbit .inner-circle .cyllinder:nth-of-type(4) .circle-inner {
transform: rotate(-90deg);
}
.orbit .inner-circle .cyllinder:nth-of-type(4) .circle-shadow {
transform: rotate(-90deg) translate(-50%, -50%);
transform-origin: 0 0;
}
.orbit .inner-circle .circle {
border-radius: var(--icon-radius);
height: calc(var(--h) / 3);
position: absolute;
width: calc(var(--w) / 3);
}
.orbit .inner-circle .circle-left, .orbit .inner-circle .circle-right {
top: 50%;
transform: translateY(-50%);
}
.orbit .inner-circle .circle-left {
left: calc(var(--w) / 10 * -1);
}
.orbit .inner-circle .circle-right {
right: calc(var(--w) / 10 * -1);
}
.orbit .inner-circle .circle .circle-inner {
align-items: center;
border-radius: var(--icon-radius);
bottom: 0;
display: flex;
height: 100%;
justify-content: center;
left: 0;
overflow: hidden;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.orbit .inner-circle .circle .circle-shadow {
background-color: white;
border: 1px dashed var(--stroke);
border-radius: var(--icon-radius);
content: "";
display: block;
height: calc(100% + var(--w) / 15);
left: 50%;
overflow: hidden;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: calc(100% + var(--w) / 15);
z-index: -1;
}
.orbit .inner-circle .circle .circle-inner svg {
height: 70%;
width: 70%;
}
.orbit .inner-circle .circle[data-color="1"] .circle-inner {
background-color: #FFF3E0;
color: #FFD54F;
}
.orbit .inner-circle .circle[data-color="2"] .circle-inner {
background-color: #F3E5F5;
color: #BA68C8;
}
.orbit .inner-circle .circle[data-color="3"] .circle-inner {
background-color: #FCE4EC;
color: #F48FB1;
}
.orbit .inner-circle .circle[data-color="4"] .circle-inner {
background-color: #E3F2FD;
color: #90CAF9;
}
.orbit .inner-circle .circle[data-color="5"] .circle-inner {
background-color: #FBE9E7;
color: #FFAB91;
}
.orbit .inner-circle .circle[data-color="6"] .circle-inner {
background-color: #EDE7F6;
color: #9575CD;
}
.orbit .inner-circle .circle[data-color="7"] .circle-inner {
background-color: #E8EAF6;
color: #7986CB;
}
.orbit .inner-circle .circle[data-color="8"] .circle-inner {
background-color: #FFEBEE;
color: #EF9A9A;
}
.orbit .inner-circle .lines .line {
animation: animateCircleLines 300ms cubic-bezier(0.39, 0.575, 0.565, 1) forwards;
transform: scale(0);
}
.orbit .inner-circle .line:nth-of-type(1) {
rotate: 0deg;
}
.orbit .inner-circle .line:nth-of-type(2) {
rotate: 45deg;
}
.orbit .inner-circle .line:nth-of-type(3) {
rotate: 90deg;
}
.orbit .inner-circle .line:nth-of-type(4) {
rotate: 135deg;
}
.orbit .inner-circle .line:nth-of-type(5) {
rotate: 180deg;
}
.orbit .inner-circle .line:nth-of-type(6) {
rotate: 225deg;
}
.orbit .inner-circle .line:nth-of-type(7) {
rotate: 270deg;
}
.orbit .inner-circle .line:nth-of-type(8) {
rotate: 315deg;
}
.orbit .inner-circle .line {
border-top: 1px dashed var(--stroke);
left: calc(var(--w) * -1 - var(--w) / -3);
position: absolute;
top: 50%;
transform: translateY(-50%);
transform-origin: center right;
width: calc(var(--w) + var(--w) / 6);
z-index: -1;
}
.orbit .inner-circle .main-circle {
animation: animateMainCircle 400ms cubic-bezier(0.39, 0.575, 0.565, 1) forwards;
background-color: var(--bg);
border-radius: 50%;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
height: var(--h);
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%) scale(0);
transform-origin: 0 0;
width: var(--w);
z-index: 5;
}
.orbit .inner-circle .main-circle .main-circle-inner {
align-items: center;
display: flex;
height: 100%;
justify-content: center;
width: 100%;
}
.orbit .inner-circle .main-circle svg {
animation: animateMainCircleIcon 2000ms ease-in-out forwards;
color: #546E7A;
display: block;
height: 2.5em;
transform-origin: center center;
width: 2.5em;
}
@keyframes animateCircleLines {
from {
transform: scale(0);
}
to {
transform: scale(1);
}
}
@keyframes animateCyllinder {
from {
scale: 0;
}
to {
scale: 1;
}
}
@keyframes animateMainCircle {
from {
transform: scale(0) translate(-50%, -50%);
}
to {
transform: scale(1) translate(-50%, -50%);
}
}
@keyframes animateMainCircleIcon {
from {
transform: rotate(0deg);
}
to {
transform: rotate(180deg);
}
}
.section-pricing {
padding: 0 0 1rem 0;
position: relative;
}
.pricing-section-header {
font: 600 calc(2.074 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h2);
margin-bottom: 3rem;
text-align: center;
}
@media (min-width: 1100px) {
.section-pricing {
padding: 1rem 0 6rem 0;
}
}
.section-pricing--gradient {
background-image: linear-gradient(to right, rgba(191, 212, 16, 0.36), rgba(195, 232, 74, 0.15), rgba(172, 234, 73, 0.15), rgba(106, 227, 94, 0.15), rgba(99, 207, 163, 0.47), rgba(99, 213, 250, 0.72), rgba(80, 177, 248, 0.48), rgba(62, 140, 245, 0.45), rgba(113, 105, 246, 0.15), rgba(159, 73, 246, 0.15), rgba(201, 51, 246, 0.15));
bottom: 0;
height: 100%;
left: 0;
opacity: 0.35;
right: 0;
top: 0;
z-index: -2;
}
.section-pricing--gradient,.section-pricing::before,
.section-pricing::after {
pointer-events: none;
position: absolute;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.section-pricing::before,
.section-pricing::after {
content: "";
display: block;
height: 30%;
z-index: -1;
}
.section-pricing::before {
background-image: linear-gradient(to bottom, white, rgba(255, 255, 255, 0));
top: 0;
}
.section-pricing::after {
background-image: linear-gradient(to top, white, rgba(255, 255, 255, 0));
bottom: 0;
}
.pricing-section {
display: grid;
grid-gap: 32px;
}
.pricing-section .pricing-card {
--card-border: 0px solid var(--color-slate-200);
--btn-background: var(--color-white);
--btn-background-hover: var(--color-slate-200);
--btn-border: 1px solid var(--color-slate-900);
--btn-border-hover: 1px solid var(--color-slate-600);
background-color: white;
background-image: linear-gradient(to bottom, rgba(203, 213, 225, 0.1), #fff);
background-image: linear-gradient(to bottom, rgba(var(--color-slate-300-rgb), 0.1), #fff);
border: 0px solid #e2e8f0;
border: var(--card-border);
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
overflow: hidden;
position: relative;
}
.pricing-section .pricing-card .pricing-header {
padding-top: calc(1.44 * 1rem);
padding-top: calc(var(--scale-p3) * 1rem);
}
.pricing-section .pricing-card .pricing-footer {
padding-bottom: calc(1.44 * 1rem);
padding-bottom: calc(var(--scale-p3) * 1rem);
}
.pricing-section .pricing-card .pricing-header,
.pricing-section .pricing-card .pricing-features,
.pricing-section .pricing-card .pricing-footer {
padding-left: calc(1.44 * 1rem);
padding-left: calc(var(--scale-p3) * 1rem);
padding-right: calc(1.44 * 1rem);
padding-right: calc(var(--scale-p3) * 1rem);
}
@media (min-width: 1380px) {
.pricing-section {
grid-template-columns: 1fr;
grid-template-columns: repeat(3, minmax(320px, 1fr));
}
.pricing-section .pricing-card.pricing-highlight {
margin-top: -40px;
}
.pricing-section .pricing-card.pricing-highlight .pricing-label {
background: #FFDE0A;
border: 1px solid #FFDE0A;
border-radius: 6px 6px 0 0;
color: #000000;
color: var(--color-black);
content: "Most Popular";
font-size: 12px;
font-weight: bold;
height: 40px;
letter-spacing: 0.05em;
line-height: 40px;
text-align: center;
text-transform: uppercase;
width: 100%;
}
}
@media (min-width: 1380px) {
}
@media (max-width: 1380px) {
.pricing-section .pricing-card.pricing-highlight .pricing-label {
display: none;
}
}
.pricing-card:nth-of-type(1) {
--btn-background: #FFB35C;
--btn-background-hover: #FFA946;
--btn-bg-rgb: 255, 179, 92;
--btn-bg-hover-rgb: 255, 169, 70;
--btn-color: #613D0D;
--mark-color: 255, 160, 51;
background-image: linear-gradient(to bottom, rgba(255, 160, 51, 0.04), #fff);
background-image: linear-gradient(to bottom, rgba(var(--mark-color), 0.04), #fff);
border: 1px solid rgba(255, 160, 51, 0.15);
border: 1px solid rgba(var(--mark-color), 0.15);
}
.pricing-card:nth-of-type(2) {
--btn-background: #FFDE0A;
--btn-background-hover: #ffd21f;
--btn-bg-rgb: 255, 222, 10;
--btn-bg-hover-rgb: 255, 210, 31;
--btn-color: #61560d;
--mark-color: 255, 222, 10;
background-image: linear-gradient(to bottom, rgba(255, 222, 10, 0.05), #fff);
background-image: linear-gradient(to bottom, rgba(var(--mark-color), 0.05), #fff);
border: 1px solid #f1f5f9;
border: 1px solid var(--color-slate-100);
}
.pricing-card:nth-of-type(3) {
--btn-background: #F5F4F5;
--btn-background-hover: #E2DFE2;
--btn-bg-rgb: 245, 244, 245;
--btn-bg-hover-rgb: 226, 223, 226;
--btn-color: var(--color-slate-600);
--mark-color: 168, 159, 168;
background-image: linear-gradient(to bottom, rgba(168, 159, 168, 0.04), #fff);
background-image: linear-gradient(to bottom, rgba(var(--mark-color), 0.04), #fff);
border: 1px solid rgba(168, 159, 168, 0.15);
border: 1px solid rgba(var(--mark-color), 0.15);
}
.pricing-card .pricing-description mark {
background-color: transparent;
}
.pricing-card .pricing-title {
font: 500 1rem / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h5);
font-weight: 600;
letter-spacing: 0.01em;
margin-bottom: 1em;
}
.pricing-card .pricing-rate {
margin-bottom: 1em;
}
.pricing-card .pricing-cost {
font: 700 calc(2.986 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h1);
font-weight: 500;
letter-spacing: -0.01em;
}
.pricing-card .pricing-interval {
font-size: 16px;
font-weight: 400;
letter-spacing: -0.01em;
}
.pricing-card .features-list {
border-top: 1px solid #e2e8f0;
border-top: 1px solid var(--color-slate-200);
margin-top: calc(1.44 * 1rem);
margin-top: calc(var(--scale-p3) * 1rem);
padding-top: calc(1.44 * 1rem);
padding-top: calc(var(--scale-p3) * 1rem);
}
.pricing-card .features-list li {
align-content: flex-start;
align-items: center;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
font-size: calc(1 * 1rem);
font-size: calc(var(--scale-p1) * 1rem);
font-weight: 500;
gap: 8px;
height: -moz-min-content;
height: min-content;
justify-content: flex-start;
overflow: visible;
padding: 0;
position: relative;
width: 100%;
}
.pricing-card .features-list li.feature-repeated {
opacity: 0.5;
}
.pricing-card .features-list li:not(:last-child) {
margin-bottom: 0.75em;
}
.pricing-card .features-list li i {
display: block;
font-size: 1rem;
}
.pricing-card .pricing-footer {
margin-top: calc(3.583 * 1rem);
margin-top: calc(var(--scale-p8) * 1rem);
}
.pricing-card .pricing-footer a {
align-items: center;
background-color: white;
background-image: linear-gradient(rgba(var(--btn-bg-rgb), 0.11), rgba(var(--btn-bg-rgb), 0.25));
border: 0;
border: 1px solid rgba(var(--btn-bg-rgb), 0.35);
border-radius: 6px;
border-radius: 0.85em;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
color: var(--btn-color);
cursor: pointer;
display: flex;
font-size: 1rem;
font-weight: 600;
height: 60px;
justify-content: center;
justify-content: center;
line-height: 1.2;
margin: 0.25rem;
margin: auto;
margin: 3.563rem auto 0;
max-width: 330px;
outline: 0.35em solid rgba(var(--btn-bg-rgb), 0);
outline-offset: 0.25em;
overflow: hidden;
padding: 0.25rem 0.5rem;
position: relative;
text-decoration: none;
transition-duration: 150ms;
transition-property: outline-offset, outline-color, border-color, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
width: 100%;
}
.pricing-card .pricing-footer a:active {
top: 1px;
}
.page-header[data-img] .page-header__container {
align-items: center;
display: grid;
grid-gap: var(--page-header-grid-gap);
grid-template-columns: 1fr;
grid-template-columns: 1fr;
justify-content: space-between;
}
.page-header[data-img] .page-header__figure {
margin: 0 auto;
position: relative;
}
.page-header[data-img] .page-header__img {
height: var(--page-header-grid-figure);
width: var(--page-header-grid-figure);
}
.page-header[data-img] .page-header__img div {
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 1.266em;
border-radius: var(--em-p2);
bottom: 0;
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
height: 100%;
left: 0;
overflow: hidden;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.page-header[data-img-shape=landscape] .page-header__img {
height: calc(var(--page-header-grid-figure) / 1.7777777778);
}
.page-header[data-img-shape=landscape] .page-header__img div {
border-radius: 0.5em;
}
.page-header[data-img-bg=cover][data-img-shape=circle] .page-header__img div,
.page-header[data-img-bg=cover][data-img-shape=square] .page-header__img div {
background-size: cover;
}
.page-header[data-img-shape=circle] {
--page-header-grid-object-m: 30px;
}
.page-header[data-img-shape=circle] .page-header__figure::before,
.page-header[data-img-shape=circle] .page-header__figure::after,
.page-header[data-img-shape=circle] .page-header__img div {
border-radius: 999em;
}
.page-header[data-img-shape=square] .page-header__figure::before,
.page-header[data-img-shape=square] .page-header__figure::after,
.page-header[data-img-shape=square] .page-header__img div {
border-radius: 1.266em;
border-radius: var(--em-p2);
}
@media (max-width: 992px) {
.page-header[data-img] {
grid-template-columns: 1fr var(--page-header-grid-figure);
}
.page-header[data-img] .page-header__figure {
order: -1;
}
.page-header[data-img] .page-header__title, .page-header[data-img] .page-header__excerpt {
text-align: center;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
.page-header[data-img-size=sm] {
--page-header-grid-figure: 300px;
}
.page-header[data-img-size=md] {
--page-header-grid-figure: 400px;
}
.page-header[data-img-size=lg] {
--page-header-grid-figure: 460px;
}
}
@media (min-width: 992px) {
.page-header[data-img-size=sm][data-img-shape=landscape] {
--page-header-grid-figure: 360px;
}
.page-header[data-img-size=md][data-img-shape=landscape] {
--page-header-grid-figure: 420px;
}
.page-header[data-img-size=lg][data-img-shape=landscape] {
--page-header-grid-figure: 520px;
}
.page-header[data-img] .page-header__container {
--page-header-grid-gap: calc(var(--rem-p10) * 1.266);
/*grid-template-columns: fit-content(50%) var(--page-header-grid-figure);*/
grid-template-columns: minmax(500px, max-content) var(--page-header-grid-figure);
justify-content: center;
}
.page-header[data-img] .page-header__figure {
order: 1;
}
}
@media (min-width: 1380px) {
.page-header__title[data-length="0"] {
font-size: calc(3.653rem * 1.125);
font-size: calc(var(--rem-p10) * 1.125);
line-height: 1.125em;
line-height: var(--em-p1);
}
.page-header__title[data-length="1"] {
font-size: calc(2.887rem * 1.125);
font-size: calc(var(--rem-p9) * 1.125);
line-height: 1.125em;
line-height: var(--em-p1);
}
.page-header__title[data-length="2"] {
font-size: 3.653rem;
font-size: var(--rem-p10);
line-height: 1.125em;
line-height: var(--em-p1);
}
.page-header__title[data-length="3"] {
font-size: 2.887rem;
font-size: var(--rem-p9);
line-height: 1.125em;
line-height: var(--em-p1);
}
.page-header__title[data-length="0"] + .page-header__excerpt,
.page-header__title[data-length="1"] + .page-header__excerpt,
.page-header__title[data-length="2"] + .page-header__excerpt {
font-size: 1.424rem;
font-size: var(--rem-p3);
line-height: 1.424em;
line-height: var(--em-p3);
}
.page-header[data-img-size=sm] {
--page-header-grid-figure: 400px;
}
.page-header[data-img-size=md] {
--page-header-grid-figure: 450px;
}
.page-header[data-img-size=lg] {
--page-header-grid-figure: 500px;
}
.page-header[data-img-size=sm][data-img-shape=landscape] {
--page-header-grid-figure: 360px;
}
.page-header[data-img-size=md][data-img-shape=landscape] {
--page-header-grid-figure: 560px;
}
.page-header[data-img-size=lg][data-img-shape=landscape] {
--page-header-grid-figure: 600px;
}
}
/*=======================================
= Blockquote Card =
=======================================*/
.card-bq {
--color-primary: var(--color-primary-400-rgb);
--color-primary-dark: var(--color-accent-1-800-rgb);
align-items: center;
display: grid;
margin: 0 auto;
margin-top: 100px;
max-width: 1200px;
position: relative;
}
.card-bq:not([data-bq-title]) .card-bq--title,
.card-bq:not([data-bq-quote]) .card-bq--quote,
.card-bq:not([data-bq-figure]) .card-bq--figure,
.card-bq:not([data-bq-cite]) .card-bq--cite,
.card-bq:not([data-bq-logo]) .card-bq--logo {
display: none;
}
.card-bq--title {
font-size: 1rem;
font-weight: normal;
margin: 0 0 1.602rem;
}
.card-bq--quote p {
color: #0f172a;
color: var(--color-slate-900);
font-size: 1.266rem;
font-weight: 500;
line-height: 1.266;
margin: 0 0 0.702em;
text-align: center;
}
@media (min-width: 568px) and (max-width: 768px) {
.card-bq--quote p {
padding: 0 1.563rem;
}
}
@media (min-width: 768px) and (max-width: 992px) {
.card-bq--quote p {
margin: 0 auto 0.702em;
max-width: 80%;
}
}
.card-bq--cite {
align-items: center;
color: #64748b;
color: var(--color-slate-500);
display: flex;
font-size: 1rem;
font-style: normal;
font-weight: 400;
justify-content: center;
}
.card-bq--cite img {
margin: 0 0.1rem 0 0.3rem;
max-height: 0.6rem;
}
.card-bq--btn {
align-items: center;
display: flex;
grid-gap: 6px;
justify-content: center;
margin-top: 2rem;
}
@media (min-width: 768px) {
.card-bq--btn {
justify-content: flex-start;
}
}
.card-bq--btn a {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 0;
border-radius: 4px;
box-shadow: rgba(203, 213, 225, 0.6) 0px 0px 0px 1px, 0 0 0 0.35em rgba(var(--color-primary), 0);
box-shadow: rgba(var(--color-slate-300-rgb), 0.6) 0px 0px 0px 1px, 0 0 0 0.35em rgba(var(--color-primary), 0);
color: #0f172a;
color: var(--color-slate-900);
display: inline-flex;
font: 600 0.889rem/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 600 0.889rem/0.889 var(--font-heading);
justify-content: center;
letter-spacing: -0.003em;
margin-top: 0;
max-width: -moz-max-content;
max-width: max-content;
padding: 0.6rem 1rem;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: color, background-color, box-shadow;
width: 100%;
will-change: color, background-color, box-shadow;
}
.card-bq--btn a:hover {
background-color: rgba(var(--color-primary), 0);
box-shadow: rgba(var(--color-primary), 0.6) 0px 0px 0px 1px, 0 0 0 0.35em rgba(var(--color-primary), 0.1);
color: rgba(51, 65, 85, 1);
color: rgba(var(--color-slate-700-rgb), 1);
outline: 0;
}
.card-bq--figure {
border-radius: 1em;
margin: 0 0 1rem;
order: -1;
position: relative;
}
.card-bq--figure::before,
.card-bq--figure::after {
background-image: linear-gradient(to bottom, rgba(var(--color-primary), 0.3), #FFFFFF 80%);
background-image: linear-gradient(to bottom, rgba(var(--color-primary), 0.3), var(--color-white) 80%);
content: "";
height: 100%;
left: 50%;
-webkit-mask-image: url(/wp-content/themes/cybersmile-wp-main-3.1.30/assets/img/vectors/wave-2.svg);
mask-image: url(/wp-content/themes/cybersmile-wp-main-3.1.30/assets/img/vectors/wave-2.svg);
-webkit-mask-position: center;
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
pointer-events: none;
position: absolute;
top: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 460px;
z-index: -1;
}
.card-bq--figure::before {
transform: translateY(0%) translateX(-80%) scaleX(0.7) scaleY(0.7) rotate(117deg);
}
.card-bq--figure::after {
transform: translateY(-20%) translateX(-20%) scaleX(0.8) scaleY(0.8) rotate(253deg);
}
.card-bq--figure-wrapper {
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 1em;
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
height: 290px;
overflow: hidden;
position: relative;
width: 290px;
}
@media (max-width: 768px) {
.card-bq--figure-wrapper {
border-radius: 0.5em;
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
}
}
.card-bq--logo {
align-items: center;
bottom: 0;
display: flex;
height: 60px;
justify-content: center;
margin: 0;
position: absolute;
right: 0;
width: 60px;
z-index: 100;
}
.card-bq--logo img {
display: block;
max-height: 60px;
}
@media (max-width: 992px) {
.card-bq {
grid-template-columns: 1fr;
}
.card-bq--figure {
margin: 0 auto 2.25em;
}
}
@media (min-width: 992px) {
.card-bq--figure-wrapper {
height: 380px;
width: 380px;
}
.card-bq--figure::before,
.card-bq--figure::after {
background-image: linear-gradient(to bottom, rgba(var(--color-primary), 0.1), #FFFFFF 80%);
background-image: linear-gradient(to bottom, rgba(var(--color-primary), 0.1), var(--color-white) 80%);
}
.card-bq--figure::before {
transform: translateY(45%) translateX(-92%) scaleX(0.4) scaleY(0.4) rotate(190deg);
}
.card-bq--figure::after {
transform: translateY(-45%) translateX(-15%) scaleX(0.4) scaleY(0.4) rotate(55deg);
}
.card-bq {
grid-gap: 5%;
grid-template-columns: 1fr 0.624fr;
}
.card-bq--title {
font-size: 1.125rem;
}
.card-bq--quote p {
font-size: 1.424rem;
line-height: 1.602;
text-align: left;
}
.card-bq--cite {
font-size: 1rem;
justify-content: flex-start;
}
.card-bq--header {
order: 0;
}
.card-bq--figure {
margin: 0;
order: 1;
}
}
@media (min-width: 1120px) {
.card-bq {
grid-gap: 10%;
}
.card-bq--title {
font-size: 1.424rem;
}
.card-bq--quote p {
font-size: 1.802rem;
line-height: 1.424;
}
.card-bq--cite {
font-size: 1rem;
font-weight: 600;
}
.card-bq--header {
order: 0;
}
.card-bq--figure {
order: 1;
}
}
:root {
--depth-1: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
--depth-2: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
--depth-3: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
/*==========================================
= Press Release Card =
==========================================*/
.list-card--post {
display: grid;
grid-template-columns: 1fr;
list-style: none;
margin: 0;
padding: 0;
}
@media (min-width: 992px) {
.list-card--post {
grid-template-columns: repeat(4, 1fr);
}
}
.list-card--post .list-card {
box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
box-shadow: var(--depth-1);
padding: 1.563rem;
}
.list-card--post .list-card--eyebrow {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-radius: 4px;
display: inline-block;
font-size: 11px;
font-weight: 500;
letter-spacing: 0.03em;
margin: 0 0 1rem -4px;
padding: 3px 6px;
text-transform: uppercase;
}
.list-card--post .list-card--title {
font-size: 1rem;
line-height: 1.563;
}
.list-card--post .list-card--excerpt {
line-height: 1.563;
}
.list-card--post .list-card--btn {
margin-top: 1.563rem;
}
.list-card--post .list-card--btn a {
align-items: center;
border: 1px solid;
border-radius: 4px;
display: flex;
font-size: 14px;
font-weight: 600;
height: 46px;
justify-content: center;
line-height: 46px;
width: 100%;
}
.list-card--post .list-card--btn a svg {
display: block;
height: 1rem;
margin: 0 0 0 0.25em;
width: 1rem;
}
:root {
--depth-1: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
--depth-2: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
--depth-3: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}
/*==========================================
= Press Release Card =
==========================================*/
.list-stories {
--story-gutter: 1.953rem;
display: grid;
grid-template-columns: 1fr;
list-style: none;
margin: 0;
padding: 0;
}
@media (min-width: 992px) {
.list-stories {
grid-gap: var(--story-gutter);
grid-template-columns: repeat(1, 1fr);
}
}
.list-stories--list .story-card {
margin: var(--story-gutter) 0;
padding: var(--story-gutter) 0;
position: relative;
}
.list-stories--list .story-card:not(:last-child)::after {
background-color: #e2e8f0;
background-color: var(--color-slate-200);
bottom: calc(var(--story-gutter) * -1);
content: "";
display: block;
height: 1px;
position: absolute;
width: 100%;
}
.list-stories--list .story-card__details {
border-radius: 4px;
display: inline-block;
font-size: 13px;
font-weight: 500;
letter-spacing: 0.03em;
margin: 0 0 1rem -4px;
padding: 3px 6px;
text-transform: uppercase;
}
.list-stories--list .story-card__details .story-card__cat {
color: #0f172a;
color: var(--color-slate-900);
}
.list-stories--list .story-card__details .story-card__date {
font-feature-settings: "calt" 1, "clig" 1, "kern" 1, "liga" 1, "onum" 0, "pnum" 0, "case" 0;
}
.list-stories--list .story-card__title {
color: #0f172a;
color: var(--color-slate-900);
font-size: 1.953rem;
font-weight: 700;
line-height: 1.563;
max-width: 39.292em;
transition-duration: 100ms;
transition-property: text-decoration-color, color;
will-change: text-decoration-color, color;
}
.list-stories--list .story-card:hover .story-card__title,
.list-stories--list .story-card:focus .story-card__title {
text-decoration-color: #0f172a;
text-decoration-color: var(--color-slate-900);
}
.list-stories--list .story-card__excerpt {
color: #334155;
color: var(--color-slate-700);
font-size: 1.25rem;
line-height: 1.563;
margin: 1.25rem 0 0;
max-width: 39.292em;
}
.story-card__permalink {
bottom: 0;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.site-main {
}
.particle-article__aside_title h3 {
align-items: center;
color: #334155;
color: var(--color-slate-700);
display: flex;
font-size: 13px;
font-weight: 700;
margin-bottom: 6px;
text-transform: uppercase;
}
.particle-article__aside:not(:first-of-type) {
margin-top: 2rem;
}
@media (prefers-reduced-motion: no-preference) {
html {
scroll-behavior: smooth;
}
}
/* Content */
@media (max-width: 768px) {
.site-main--wrapper {
overflow-x: hidden;
}
}
/* Blocktypes */
.particle-article__content .blocktype-cluster {
position: relative;
}
.blocktype-cluster:first-child {
margin-top: 0;
}
.blocktype-cluster:last-child {
margin-bottom: 0;
}
.blocktype-cluster:not(:last-child) {
margin-bottom: 48px;
}
.blocktype-cluster:not(:first-child) {
margin-top: 48px;
}
.blocktype-heading + .blocktype-cluster {
border-top: 0;
padding-top: 0;
}
/* Blocktype Horizontal Rule */
.particle-article__content .blocktype-hr {
background-color: transparent;
border-color: transparent;
margin: 3.653em 0;
margin: var(--em-p10) 0;
position: relative;
}
@media (min-width: 1100px) {
.particle-article__content .blocktype-hr {
margin: 3.653em 0;
margin: var(--em-p10) 0;
}
}
.particle-article__content .blocktype-hr + .blocktype-heading {
margin-top: 0;
}
.particle-article__content .blocktype-hr::before {
background-image: linear-gradient(to right, #e2e8f0, #e2e8f0, #f1f5f9);
background-image: linear-gradient(to right, var(--color-slate-200), var(--color-slate-200), var(--color-slate-100));
content: "";
display: block;
height: 1px;
max-width: 768px;
width: 100%;
}
/* Blocktype Divider */
.blocktype-divider {
background-image: linear-gradient(to right, #e2e8f0, white 90%);
background-image: linear-gradient(to right, var(--color-slate-200), white 90%);
border: 0px;
height: 1px;
margin: calc(2.986 * 1rem) 0;
margin: calc(var(--scale-p7) * 1rem) 0;
width: 100%;
}
@media (min-width: 768px) and (max-width: 1024px) {
.blocktype-divider {
margin: 2.566rem 0;
margin: var(--rem-p8) 0;
}
}
@media (max-width: 768px) {
.blocktype-divider {
margin: 1.563rem 0;
}
}
/* =========================================================*/
/* Blocktype Window */
/* =========================================================*/
/* =========================================================*/
/* Blocktype Alert */
/* =========================================================*/
.blocktype-window-container {
padding: 2.488rem;
position: relative;
}
.blocktype-alert-container::before,
.blocktype-alert-container::after {
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: -1;
}
.blocktype-window-container::before {
--line: var(--color-slate-100);
--size: 55px;
background: linear-gradient(90deg, #f1f5f9 1px, transparent 1px 55px) 50% 50%/55px 55px, linear-gradient(#f1f5f9 1px, transparent 1px 55px) 50% 50%/55px 55px;
height: 85%;
-webkit-mask: linear-gradient(-15deg, transparent 30%, white);
mask: linear-gradient(-15deg, transparent 30%, white);
width: 100%;
z-index: 0;
}
@supports (background: linear-gradient(red 0%, red 0% 1%, red 2%)){
.blocktype-window-container::before {
background: linear-gradient(90deg, var(--line) 1px, transparent 1px var(--size)) 50% 50%/var(--size) var(--size), linear-gradient(var(--line) 1px, transparent 1px var(--size)) 50% 50%/var(--size) var(--size);
}
}
.blocktype-window-container::after {
background: linear-gradient(270deg, var(--gradient-color-1), var(--gradient-color-2));
background-size: 200% 200%;
filter: blur(25px);
height: 47%;
left: 2%;
margin: 0 auto;
opacity: 0.25;
right: inherit;
top: 50%;
transform: translateY(-50%);
width: 45%;
z-index: -1;
}
.blocktype-window {
align-items: center;
background-color: white;
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 8px;
color: #475569;
color: var(--color-slate-600);
display: flex;
justify-content: center;
max-width: 568px;
outline-color: rgba(0, 123, 255, 0.15);
outline-color: rgba(var(--color-primary-500-rgb), 0.15);
outline-offset: 0.25em;
outline-style: solid;
outline-width: 0px;
overflow: hidden;
position: relative;
}
.blocktype-window__header {
border-bottom: 1px solid #cbd5e1;
border-bottom: 1px solid var(--color-slate-300);
}
.blocktype-window .blocktype-window__title {
background: linear-gradient(to bottom, #f8fafc, #f1f5f9);
background: linear-gradient(to bottom, var(--color-slate-50), var(--color-slate-100));
color: #0f172a;
color: var(--color-slate-900);
font-size: 1rem;
font-weight: 600;
letter-spacing: -0.03em;
padding: 0.5rem 0.825rem;
position: relative;
text-align: left;
}
.blocktype-window .blocktype-window__title h3 {
font-size: 1rem;
line-height: 1;
margin: 0;
white-space: nowrap;
}
.blocktype-window .blocktype-window__meta {
padding: 1rem 0.825rem;
}
.blocktype-window .blocktype-window__meta p {
font-size: 1rem;
-webkit-font-smoothing: antialiased;
-webkit-hyphens: auto;
hyphens: auto;
line-height: 1.415;
max-width: 100%;
vertical-align: baseline;
white-space: break-spaces;
}
.blocktype-window:not(:first-child) {
margin: calc(1.2 * 1rem) 0 !important;
margin: calc(var(--scale-p2) * 1rem) 0 !important;
}
.blocktype-window:first-child {
margin-bottom: calc(1.2 * 1rem) !important;
margin-bottom: calc(var(--scale-p2) * 1rem) !important;
}
.blocktype-window:last-child {
margin-bottom: 0 !important;
}
.blocktype-window .blocktype-window__icon {
color: #FF5100;
color: var(--color-accent-1-900);
position: absolute;
right: 6px;
top: 6px;
z-index: 1;
}
/* Blocktype Cluster */
.blocktype-cluster:last-of-type {
margin-bottom: 0;
}
/* Particle Article Options */
/* .particle-aside__widget:not(:first-child) {
margin-top: 2rem;
padding-top: 2rem;
border-top: 1px solid var(--color-slate-100);
} */
.particle-aside__widget .particle-widget__title {
align-items: center;
color: #94a3b8;
color: var(--color-slate-400);
display: flex;
font-size: 13px;
font-weight: 700;
margin-bottom: 12px;
text-transform: uppercase;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
/* Particle Widget URL */
.particle-widget__url .particle-url__body {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid #e5e5e5;
border: 1px solid var(--color-grey-200);
border-radius: 3px;
box-shadow: 0 0 0 0.2rem rgba(var(--page-primary-rgb), 0);
color: #334155;
color: var(--color-slate-700);
cursor: pointer;
display: flex;
font-family: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;
font-size: 11px;
justify-content: space-between;
letter-spacing: -0.01em;
line-height: 1;
line-height: 36px;
max-width: calc(100% - 42px);
min-height: 36px;
overflow: hidden;
padding: 0 0.5rem 0 0.75rem;
position: relative;
transition-duration: 200ms;
will-change: background-color, box-shadow;
}
.particle-widget__url .particle-url__body:active {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border: 1px solid #80bdff;
border: 1px solid var(--page-primary-hex);
box-shadow: 0 0 0 0.2rem rgba(var(--page-primary-rgb), 0.25);
color: #171717;
color: var(--color-grey-900);
}
.particle-widget__url .particle-url__body .particle-url__field {
display: block;
line-height: 1;
overflow: hidden;
text-overflow: ellipsis;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
width: 85%;
}
.particle-widget__url .particle-url__body .particle-url__field::-moz-selection {
background-color: transparent;
}
.particle-widget__url .particle-url__body .particle-url__field::selection {
background-color: transparent;
}
.particle-widget__url .particle-url__body .particle-url__btn {
background-color: #f5f5f5;
background-color: var(--color-grey-100);
border-radius: 2px;
color: #404040;
color: var(--color-grey-700);
font-size: 13px;
height: 24px;
position: absolute;
right: 9px;
transition-duration: 100ms;
transition-property: background-color, color;
width: 24px;
will-change: background-color, color;
}
.particle-widget__url:active .particle-url__body .particle-url__btn {
background-color: #eaf4ff;
background-color: var(--color-primary-50);
color: #007bff;
color: var(--color-primary-500);
}
/* Clusters */
.particle-article__content .blocktype-cluster__2 {
align-items: center;
background: radial-gradient(rgba(var(--page-primary-rgb), 0.25), #FFFFFF 50%);
background: radial-gradient(rgba(var(--page-primary-rgb), 0.25), var(--color-white) 50%);
display: grid;
grid-template-columns: 1fr;
padding: 1.563rem;
}
.particle-article__content .blocktype-cluster__2 > figure {
margin-bottom: 0 !important;
}
.particle-article__content .blocktype-cluster__2 > figure > div {
display: block;
margin-left: auto !important;
margin-right: auto !important;
width: 100%;
}
@media (min-width: 1100px) {
.particle-article__content .blocktype-cluster__2 {
grid-template-columns: repeat(2, 1fr);
padding: 0;
}
}
blockquote.twitter-tweet p {
max-width: -moz-fit-content;
max-width: fit-content;
}
/* Blocktype Swiper */
.blocktype-swiper {
height: 100%;
width: 100%;
}
/* Za */
.research-year {
margin-bottom: 3rem;
}
.research-year:not(:first-child) {
margin-top: 4rem;
}
.research-year:empty {
display: none;
}
@media (min-width: 992px) {
.research-year {
margin-bottom: 3rem;
}
.research-year:not(:first-child) {
margin-top: 7rem;
}
}
.list-resource__meta {
align-items: center;
display: grid;
font-size: 1.125rem;
grid-template-columns: 24px 150px 1fr;
}
.list-resource__meta i {
color: #64748b;
color: var(--color-slate-500);
font-size: 80%;
}
.list-resource__meta span {
white-space: nowrap;
}
.list-resource__meta strong {
font-weight: 500;
}
.list-resource__meta:not(:last-child) {
margin-bottom: 0.35em;
}
.list-resource__sample,
.list-resource__respondents,
.list-resource__demographics {
display: inline-flex;
font-size: 1rem !important;
line-height: 1.25 !important;
font-size: 1rem;
}
.list-resource__respondents li:not(:last-child),
.list-resource__sample li:not(:last-child),
.list-resource__demographics li:not(:last-child) {
margin-right: 0.15em;
}
.list-resource__respondents li:not(:last-child)::after,
.list-resource__sample li:not(:last-child)::after,
.list-resource__demographics li:not(:last-child)::after {
content: ",";
}
/* */
.list-resource__item,.list-resource__top {
position: relative;
}
.list-resource__top {
align-items: center;
display: grid;
grid-template-columns: 1fr;
}
.list-resource__wrapper {
height: 100%;
left: 50%;
overflow: hidden;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 100%;
z-index: -1;
}
.list-resource__wrapper svg {
bottom: 110%;
left: 60%;
opacity: 0.05;
position: relative;
transform: scale(0.85) rotate(45deg);
}
.list-resource__wrapper svg path {
fill: hsla(217, 19%, 35%, 0.15);
}
.list-resource__top svg {
height: 100%;
left: 0;
opacity: 1;
position: absolute;
transform: scale(5);
width: 100%;
}
.list-resource__item:hover .resource-figure svg {
transform: scale(2.2);
}
.resource-figure img {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 992px) {
.list-resource__top {
align-items: flex-start;
border-radius: 0.25em;
box-shadow: rgba(51, 65, 85, 0.05) 0px 6px 24px 0px, rgba(51, 65, 85, 0.08) 0px 0px 0px 1px;
box-shadow: rgba(var(--color-slate-700-rgb), 0.05) 0px 6px 24px 0px, rgba(var(--color-slate-700-rgb), 0.08) 0px 0px 0px 1px;
grid-gap: 1rem;
grid-template-columns: 1fr;
padding: 2rem 0 2rem 2rem;
}
.resource-figure {
border-radius: 0.35em;
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
order: -1;
overflow: hidden;
position: relative;
}
}
@media (min-width: 1100px) {
.list-resource__top {
grid-template-columns: 1fr 200px;
}
.resource-figure {
height: 240px;
order: 1;
right: -40px;
width: 240px;
}
}
@media (min-width: 1380px) {
.list-resource__top {
grid-template-columns: 1fr 290px;
}
.resource-figure {
height: 290px;
right: -40px;
width: 290px;
}
}
@media (max-width: 1099.97px) {
.resource-figure {
border-radius: 0.35rem;
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
margin: -4rem auto 2rem;
order: -1;
overflow: hidden;
}
.resource-figure,
.resource-figure img {
margin-left: auto;
margin-right: auto;
max-width: 100%;
}
.research-header__title,
.research-header__excerpt {
text-align: center;
}
.research-header__btns {
margin-top: 1.266rem !important;
}
.list-resource__metas {
display: none;
}
.list-resource__top {
background-image: linear-gradient(to bottom, #f1f5f9, #f8fafc);
background-image: linear-gradient(to bottom, var(--color-slate-100), var(--color-slate-50));
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 0.25rem;
padding: 2rem 1rem;
}
}
.resource-figure__icon i {
color: #FFFFFF;
color: var(--color-white);
font-size: 32px;
margin-left: 1rem;
}
.resource-figure__wrapper {
align-items: center;
color: #FFFFFF;
color: var(--color-white);
display: flex;
font-size: 22px;
font-weight: 500;
height: 42px;
justify-content: center;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
white-space: nowrap;
z-index: 1;
}
.list-resource__item + .list-resource__item {
margin-top: 2rem;
}
.research-header__title {
font-size: 1.612rem !important;
}
.research-header__excerpt {
-webkit-box-orient: vertical;
display: -webkit-box;
font-size: 1.125rem !important;
-webkit-line-clamp: 3;
margin-bottom: 0 !important;
margin-top: 0.5rem;
overflow: hidden;
}
@media (max-width: 992px) {
.research-header__excerpt {
margin-left: auto;
margin-right: auto;
max-width: 75%;
}
}
@media (max-width: 768px) {
.research-header__excerpt {
margin-left: auto;
margin-right: auto;
max-width: 100%;
}
}
@media (min-width: 1100px) {
.research-header__excerpt {
font-size: 1.414rem !important;
}
.research-header__title {
font-size: 1.612rem !important;
}
}
@media (min-width: 1380px) {
.research-header__title {
font-size: 1.953rem !important;
}
}
.list-resource__metas {
margin: 0 0 3rem;
padding-top: 2rem;
}
@media (max-width: 991.97px) {
.list-resource__metas {
margin-bottom: 1rem;
margin-top: 2rem;
padding: 2rem 3rem;
}
}
.research-header__citation {
background-color: #FFFFFF;
background-color: var(--color-white);
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px;
display: none;
font-size: 0.95rem;
line-height: 1.414;
margin-bottom: 0rem;
margin-top: 2rem;
overflow: hidden;
padding: 1rem;
}
.research-header__citation.show {
display: block;
}
.single-content__citation strong {
color: #64748b;
color: var(--color-slate-500);
display: block;
font-size: 0.85rem;
margin-bottom: 0.6em;
text-transform: uppercase;
}
.research-header__btns {
display: flex;
}
.research-header__btns .btn + .btn {
margin-left: 0.75rem;
}
@media (max-width: 991.97px) {
.research-header__btns {
justify-content: center;
}
}
.btn {
border: 1px solid transparent;
border-radius: 4px;
display: inline-block;
font-size: 1rem;
font-weight: 600;
outline: 0;
padding: 0.5em 1em;
text-decoration: none;
transition: all 0.2s ease-in-out;
white-space: nowrap;
}
.btn i {
font-size: 80%;
}
.btn span {
display: inline-block;
position: relative;
transition-duration: 200ms;
transition-property: top;
will-change: top;
}
.btn:active span {
top: -1px;
}
.btn span + i,
.btn i + span {
margin-left: 0.35em;
}
.btn--solid.btn--slate {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: transparent;
border-color: rgba(100, 116, 139, 0.5);
border-color: rgba(var(--color-slate-500-rgb), 0.5);
box-shadow: 0 0 0 0.15em rgba(100, 116, 139, 0);
box-shadow: 0 0 0 0.15em rgba(var(--color-slate-500-rgb), 0);
color: #64748b;
color: var(--color-slate-500);
}
.btn.btn--solid:hover,
.btn.btn--solid:focus-within {
background-color: rgba(100, 116, 139, 0.09);
background-color: rgba(var(--color-slate-500-rgb), 0.09);
border-color: rgba(100, 116, 139, 0.5);
border-color: rgba(var(--color-slate-500-rgb), 0.5);
box-shadow: 0 0 0 0.15em rgba(100, 116, 139, 0.15);
box-shadow: 0 0 0 0.15em rgba(var(--color-slate-500-rgb), 0.15);
outline: 0;
}
.btn--solid.btn--primary {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: transparent;
border-color: rgba(0, 123, 255, 0.5);
border-color: rgba(var(--color-primary-500-rgb), 0.5);
box-shadow: 0 0 0 0.15em rgba(0, 123, 255, 0);
box-shadow: 0 0 0 0.15em rgba(var(--color-primary-500-rgb), 0);
color: #007bff;
color: var(--color-primary-500);
}
.btn.btn--solid.btn--primary:hover,
.btn.btn--solid.btn--primary:focus-within {
/* background-color: rgba(var(--color-primary-500-rgb), 0.15); */
border-color: rgba(0, 123, 255, 0.65);
border-color: rgba(var(--color-primary-500-rgb), 0.65);
box-shadow: 0 0 0 0.2em rgba(0, 123, 255, 0.25);
box-shadow: 0 0 0 0.2em rgba(var(--color-primary-500-rgb), 0.25);
color: #007bff;
color: var(--color-primary-500);
outline: 0;
}
.btn--outline {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: rgba(100, 116, 139, 0.2);
border-color: rgba(var(--color-slate-500-rgb), 0.2);
color: #475569;
color: var(--color-slate-600);
}
.btn--outline:hover,
.btn--outline:focus-within {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: rgba(100, 116, 139, 1);
border-color: rgba(var(--color-slate-500-rgb), 1);
box-shadow: 0 0 0 0.15em rgba(100, 116, 139, 0.35);
box-shadow: 0 0 0 0.15em rgba(var(--color-slate-500-rgb), 0.35);
color: rgba(100, 116, 139, 1);
color: rgba(var(--color-slate-500-rgb), 1);
}
.btn--txt {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: transparent;
color: rgba(100, 116, 139, 1);
color: rgba(var(--color-slate-500-rgb), 1);
}
.btn--txt:hover,
.btn--txt:focus-within {
background-color: #FFFFFF;
background-color: var(--color-white);
box-shadow: 0 0 0 0;
color: rgba(100, 116, 139, 1);
color: rgba(var(--color-slate-500-rgb), 1);
}
/* Blobs */
.corner-blobs {
overflow-x: hidden;
width: 100%;
}
.corner-color-blobs {
--blob-w: 500px;
--blob-h: 500px;
--blob-1-hex: var(--color-accent-1-100);
--blob-1-rgb: var(--color-accent-1-200-rgb);
--blob-2-hex: var(--color-primary-100-rgb);
--blob-2-rgb: var(--color-accent-1-300-rgb);
--blob-3-hex: var(--color-accent-1-400-rgb);
--blob-3-rgb: var(--color-accent-1-400-rgb);
clip-path: polygon(250% 10%, -20% 0%, 25% 205%);
display: inline !important;
display: initial !important;
filter: blur(100px);
height: 500px;
opacity: 0.35;
overflow: hidden;
position: absolute;
right: 0;
top: -100px;
width: 45%;
z-index: -1;
}
@media (min-width: 992px) {
.corner-color-blobs {
background-color: rgba(var(--page-primary-rgb), 0.8);
clip-path: polygon(250% 10%, -20% 0%, 25% 205%);
display: inline !important;
display: initial !important;
filter: blur(100px);
height: 400px;
position: absolute;
}
}
@media (min-width: 1200px) {
.corner-color-blobs {
clip-path: polygon(250% 10%, -20% 0%, 25% 205%);
display: inline !important;
display: initial !important;
filter: blur(100px);
height: 500px;
opacity: 0.25;
position: absolute;
}
}
@media (max-width: 992px) {
.corner-color-blobs {
clip-path: polygon(250% 10%, -20% 0%, 25% 205%);
display: inline !important;
display: initial !important;
filter: blur(50px);
height: 300px;
opacity: 0.09;
position: absolute;
--blob-w: 1000px;
--blob-h: 1000px;
background-color: rgba(var(--page-primary-rgb), 1);
clip-path: polygon(500% 0, 0 0, -650% 50%);
filter: blur(100px);
height: 1400px;
overflow: hidden;
right: -100px;
top: -100px;
width: 45%;
}
}
@media (max-width: 992px) {
}
.corner-color-blobs .red,
.corner-color-blobs .green,
.corner-color-blobs .blue {
border-radius: 50%;
height: var(--blob-w);
position: absolute;
transform: translate3d(0, 0, 0);
width: var(--blob-h);
will-change: transform;
}
.corner-color-blobs .red,
.corner-color-blobs .green {
left: 50px;
top: -250px;
}
.corner-color-blobs .red {
background-color: rgba(var(--page-primary-rgb-lightest), 1);
}
.corner-color-blobs .green {
background-color: rgba(var(--page-primary-rgb-lighter), 1);
}
.corner-color-blobs .blue {
background-color: rgba(var(--page-primary-rgb), 1);
left: 250px;
top: 250px;
}
.section-videos {
background-color: #FFFFFF;
background-color: var(--color-white);
background-image: linear-gradient(180deg, #FFFFFF 0%, rgba(var(--page-primary-rgb-lighter), 0.3) 50%, white);
background-image: linear-gradient(180deg, var(--color-white) 0%, rgba(var(--page-primary-rgb-lighter), 0.3) 50%, white);
border: 1px solid rgba(var(--page-primary-rgb), 0.125);
border: 1px solid rgba(var(--page-primary-rgb), 0.5);
border-radius: 0.85rem;
margin-bottom: 2rem;
padding: 1rem 0 1.125rem;
padding: var(--gutter) 0 1.125rem;
position: relative;
transition-duration: 150ms;
transition-property: opacity;
will-change: opacity;
}
.section-videos,.section-videos__items {
background-image: linear-gradient(180deg, rgba(var(--page-primary-rgb), 0.015) 0%, rgba(var(--page-primary-rgb), 0.025) 100%);
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15);
}
.section-videos__items {
border: 1px solid rgba(var(--page-primary-rgb), 0.5);
border-radius: 1rem;
}
.section-videos::before {
background-color: rgba(var(--page-primary-rgb-lightest), 0.15);
clip-path: polygon(100% 0, 0 0, 100% 200%);
content: "";
display: inline !important;
display: initial !important;
filter: blur(1000px);
height: 1000px;
opacity: 1;
padding: 100px 0;
position: absolute;
}
.section-videos .blocktype-video {
border-radius: 1em;
box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
overflow: hidden;
}
.particle-article__content .blocktype-cluster__embedded {
overflow-x: hidden;
}
.particle-article__content .blocktype-cluster__embedded::before {
bottom: 0;
content: "";
position: absolute;
top: 0;
width: 150px;
z-index: 15;
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgb(255, 255, 255) 100%);
right: 0;
}
/* Profile Container */
.profile-container {
--block-font-size: 1rem;
}
.profile-aside {
display: flex;
flex-direction: column;
}
.profile-overview .profile-container:not(:last-child) {
margin-bottom: 2rem;
}
.profile-container button.read-more {
border: 0px solid;
display: block;
font-size: 1rem;
font-weight: 600;
height: 40px;
line-height: 40px;
padding: 0;
position: relative;
text-decoration: underline;
text-decoration-color: #cbd5e1;
text-decoration-color: var(--color-slate-300);
text-underline-offset: 0.25em;
transition-duration: 150ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: color, text-decoration-color;
z-index: 2;
}
.profile-container button.read-more:hover,
.profile-container button.read-more:focus {
border-color: transparent;
color: #0f172a;
color: var(--color-slate-900);
outline: 0;
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
.profile-container a.external-link {
align-items: center;
display: inline-flex;
gap: 6px;
text-decoration: none;
}
.profile-container a.external-link svg {
display: block;
height: 1rem;
width: 1rem;
}
@media (max-width: 992px) {
.profile-container a.external-link span[itemprop=name] {
color: #1e293b;
color: var(--color-slate-800);
display: inline-block;
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
@media (min-width: 992px) {
.profile-container a.external-link span[itemprop=name] {
color: #1e293b;
color: var(--color-slate-800);
display: inline-block;
max-width: 425px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
.profile-container a.external-link span[itemprop=name] {
font-weight: 400;
}
.profile-container a.external-link span[itemprop=source] {
align-items: center;
display: flex;
font-weight: 700;
gap: 0.25em;
}
.profile-container a.external-link:hover span,
.profile-container a.external-link:focus span {
color: #80bdff;
color: var(--page-primary-hex);
}
.profile-container .blocktype-heading {
font-size: 1.125rem;
font-weight: 700;
margin-bottom: 1.25em;
margin-top: 0;
}
.profile-container .blocktype-heading:not(:first-child) {
margin-top: 1.25em;
}
.article-list .article-list--title h2,
.profile-content--header h2 {
align-items: center;
color: #475569;
color: var(--color-slate-600);
display: flex;
font-size: 13px;
font-weight: 700;
margin-bottom: 12px;
text-transform: uppercase;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.article-list .article-list--grid {
display: flex;
flex-direction: column;
gap: 1rem;
padding-bottom: 0;
}
.article-list .article-card {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid transparent;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 6px;
outline: 0.25em solid transparent;
outline-offset: 0.55em;
position: relative;
transition-duration: 250ms;
transition-property: border-color, box-shadow, outline, outline-offset;
}
/* .page-single-ambassador .article-list,
.page-single-advisor .article-list {
background-image: linear-gradient(to left, white 25%, rgba(var(--page-primary-rgb), 0.02) 100%);
border-radius: 8px;
border: 1px solid rgba(var(--page-primary-rgb), 0.2);
padding: 1rem;
} */
.article-list .article-card:hover {
border-color: rgba(var(--page-primary-rgb), 0.7);
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
}
.article-list .article-card .article-title > span:first-child {
text-decoration: none;
text-decoration-color: #f1f5f9;
text-decoration-color: var(--color-slate-100);
transition-duration: 250ms;
}
.article-list .article-card:hover .article-title > span:first-child {
color: #0f172a;
color: var(--color-slate-900);
text-decoration: underline;
text-decoration-color: #0f172a;
text-decoration-color: var(--color-slate-900);
text-decoration-thickness: 1px;
text-underline-offset: 0.1em;
}
.article-list .article-card:focus-within {
border-color: rgba(var(--page-primary-rgb), 0.7);
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
}
.article-list .article-card[data-item-type=press] .article-image,
.article-list .article-card[data-item-type=press] .article-excerpt {
display: none;
}
.article-list .article-card[data-item-type=press] .article-card--wrapper {
grid-template-columns: 1fr;
}
.article-list .article-card[data-item-type=press] .article-title {
-webkit-line-clamp: 2;
}
.article-list .article-card[data-item-type=ambassador] .article-title i,
.article-list .article-card[data-item-type=advisor] .article-title i {
color: #007bff;
color: var(--color-primary-500);
font-size: 80%;
}
/*
.article-list .article-card[data-item-type="ambassador"],
.article-list .article-card[data-item-type="advisor"] {
background-image: linear-gradient(to bottom, white 50%, rgba(255, 193, 106, 0.08) 100%);
}
.article-list .article-card[data-item-type="ambassador"] .article-image,
.article-list .article-card[data-item-type="advisor"] .article-image {
filter: drop-shadow(0px 5px 24px rgba(0, 0, 0, 0.125));
box-shadow: 0 0 0 0;
} */
.article-list .article-card .article-card--wrapper {
align-items: center;
display: grid;
grid-gap: 12px;
grid-template-columns: 60px 1fr;
justify-content: flex-start;
padding: 12px;
}
.article-list .article-card .article-image {
border-radius: 6px;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
height: 60px;
overflow: hidden;
position: relative;
width: 60px;
}
.article-list .article-card .article-image img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
}
.article-list .article-card .article-title {
-webkit-box-orient: vertical;
display: -webkit-box;
font-size: 16px;
-webkit-line-clamp: 1;
line-height: 1.5;
overflow: hidden;
}
.article-list--grid + .pagination {
justify-content: flex-start;
margin-bottom: 0;
margin-top: 1.5rem;
}
.article-list .article-card .article-title .article-title--tag {
color: #868e96;
color: var(--color-grey-dark);
font-style: italic;
font-weight: 500;
}
.article-list .article-card .article-excerpt {
-webkit-box-orient: vertical;
color: #6c757d;
color: var(--color-grey);
display: -webkit-box;
font-size: 14px;
font-weight: 400;
-webkit-line-clamp: 2;
line-height: 1.25;
overflow: hidden;
}
.article-list .article-card .article-tag {
color: #64748b;
color: var(--color-slate-500);
font-size: 14px;
font-weight: 400;
}
.article-list .article-card .article-date {
display: none;
}
@media (min-width: 992px) {
.article-list .article-card .article-card--wrapper {
grid-gap: 12px;
grid-template-columns: 90px 1fr;
}
.article-list .article-card .article-image {
height: 90px;
width: 90px;
}
.article-list .article-card .article-title {
font-size: 18px;
}
.article-list .article-card .article-excerpt {
font-size: 16px;
max-width: 80%;
}
.article-list .article-card .article-tag {
font-size: 16px;
}
}
.box-style {
--outline-width: 3px;
--outline-color: rgba(var(--page-primary-rgb), 0.15);
--border-width: 1px;
--border-color: rgba(var(--page-primary-rgb), 0.25);
--border-radius: 8px;
--background-gradient: linear-gradient(to top, rgba(var(--page-primary-rgb), 0.03) 10%, rgba(var(--page-primary-rgb), 0.01), white);
--padding-y: 1.25rem;
--padding-x: 1.25rem;
background-color: #FFFFFF;
background-color: var(--color-white);
background-image: var(--background-gradient);
border: 1px solid var(--border-color);
border: var(--border-width) solid var(--border-color);
border-radius: 8px;
border-radius: var(--border-radius);
padding: 1.25rem 1.25rem;
padding: var(--padding-y) var(--padding-x);
}
.list-cards.list-cards__press {
--btn-bg: var(--color-white);
--btn-color: var(--color-primary-900);
--btn-border: var(--color-slate-300);
--btn-hover-bg: var(--color-slate-50);
--btn-hover-border: var(--color-slate-300);
--btn-hover-color: var(--color-primary-500);
}
.list-cards.list-cards__press li:last-child {
margin-bottom: 0;
}
.list-cards.list-cards__press .article-card {
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
display: flex;
flex-direction: column;
}
.list-cards.list-cards__press .article-card__figure {
align-items: center;
background: linear-gradient(220.55deg, #55a7ff 0%, #95c8ff 100%);
background: linear-gradient(220.55deg, var(--color-primary-400) 0%, var(--color-primary-200) 100%);
background-color: #f1f5f9;
background-color: var(--color-slate-100);
border-radius: 6px 6px 0 0;
color: #FFFFFF;
color: var(--color-white);
display: flex;
font-size: 32px;
justify-content: center;
max-width: 100%;
min-height: 100px;
overflow: hidden;
position: relative;
text-shadow: 1px 1px 10px rgba(0, 0, 0, 0.235);
}
.list-cards.list-cards__posts .article-card__figure {
background: linear-gradient(220.55deg, #FFA46F 0%, #FFD9C2 100%);
background: linear-gradient(220.55deg, var(--color-accent-1-400) 0%, var(--color-accent-1-100) 100%);
}
.list-cards.list-cards__reports .article-card__figure {
background: linear-gradient(220.55deg, #8a88fb 0%, #d079ee 100%);
}
.list-cards.list-cards__posts .article-card__figure__image,
.list-cards.list-cards__reports .article-card__figure__image,
.list-cards.list-cards__campaigns .article-card__figure__image {
aspect-ratio: 16/16;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 6px 6px 0 0;
bottom: 0;
height: 100%;
left: 0;
min-height: 300px;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.list-cards.list-cards__press .article-card__figure img {
height: auto;
width: 100%;
}
.list-cards.list-cards__press .article-card__content {
border: 1px solid #f1f5f9;
border: 1px solid var(--color-slate-100);
border-radius: 0 0 6px 6px;
padding: 1.563rem;
}
.list-cards.list-cards__press .article-card__title {
font-weight: 600;
line-height: 1.315;
margin-bottom: 0.25em;
}
.list-cards.list-cards__press .article-card__title,
.list-cards.list-cards__posts .article-card__title,
.list-cards.list-cards__reports .article-card__title,
.list-cards.list-cards__campaigns .article-card__title {
-webkit-box-orient: vertical;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
}
.list-cards.list-cards__press .article-card__excerpt {
display: none;
}
.list-cards.list-cards__press .article-card__excerpt,
.list-cards.list-cards__posts .article-card__excerpt,
.list-cards.list-cards__reports .article-card__excerpt,
.list-cards.list-cards__campaigns .article-card__excerpt {
-webkit-box-orient: vertical;
display: -webkit-box;
font-size: 1rem;
-webkit-line-clamp: 3;
line-height: 1.415;
margin-bottom: 0;
overflow: hidden;
}
.list-cards.list-cards__press span.article-date__content {
display: block;
font-size: 14px;
font-weight: 500;
margin-top: 0.75rem;
}
.list-cards.list-cards__press .article-card__link {
background-color: var(--btn-bg);
border: 1px solid var(--btn-border);
border-radius: 0.25rem;
color: var(--btn-color);
display: block;
font-size: 1rem;
font-weight: 600;
letter-spacing: -0.03em;
line-height: 1;
margin-top: 1rem;
padding: 0.875rem 1rem;
text-align: center;
text-decoration: none;
transition-duration: 0.1s;
transition-property: background-color, border-color, color;
}
.list-cards.list-cards__press .article-card:hover .article-card__link {
background-color: var(--btn-hover-bg);
border-color: var(--btn-hover-border);
color: var(--btn-hover-color);
}
@media (max-width: 768px) {
.list-cards.list-cards__press,
.list-cards.list-cards__posts,
.list-cards.list-cards__reports {
display: grid;
grid-gap: 1.563rem;
grid-template-columns: repeat(1, 1fr);
}
}
@media (min-width: 768px) {
.list-cards.list-cards__press,
.list-cards.list-cards__posts,
.list-cards.list-cards__reports,
.list-cards.list-cards__campaigns {
display: grid;
grid-gap: 1.563rem;
grid-template-columns: repeat(3, 1fr);
}
.list-cards.list-cards__press li:nth-of-type(4n),
.list-cards.list-cards__posts li:nth-of-type(4n),
.list-cards.list-cards__reports li:nth-of-type(4n),
.list-cards.list-cards__campaigns li:nth-of-type(4n) {
display: none;
}
.list-cards.list-cards__posts .article-card__figure,
.list-cards.list-cards__reports .article-card__figure,
.list-cards.list-cards__campaigns .article-card__figure {
min-height: 310px;
}
}
@media (min-width: 1200px) {
.list-cards.list-cards__press,
.list-cards.list-cards__posts,
.list-cards.list-cards__reports {
display: grid;
grid-gap: 1.563rem;
grid-template-columns: repeat(4, 1fr);
}
.list-cards.list-cards__press li:nth-of-type(5n),
.list-cards.list-cards__posts li:nth-of-type(5n),
.list-cards.list-cards__reports li:nth-of-type(5n),
.list-cards.list-cards__campaigns li:nth-of-type(5n) {
display: none;
}
.list-cards.list-cards__posts .article-card__figure,
.list-cards.list-cards__reports .article-card__figure,
.list-cards.list-cards__campaigns .article-card__figure {
min-height: 300px;
}
}
.list-resources {
display: grid;
grid-template-columns: 1fr;
}
@media (min-width: 768px) {
.list-resources {
grid-gap: 2rem;
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 992px) {
.list-resources {
grid-gap: 2rem;
grid-template-columns: repeat(3, 1fr);
}
}
@media (min-width: 1400px) {
.list-resources {
grid-gap: 2rem;
grid-template-columns: repeat(3, 1fr);
}
}
.list-resource__card {
border-radius: 0.5rem;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
cursor: pointer;
overflow: hidden;
transition-duration: 200ms;
transition-property: box-shadow;
will-change: box-shadow;
}
.list-resource__card:hover {
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.list-resource__cta {
margin-top: 1rem;
}
.list-resource__image {
aspect-ration: 16/16;
max-height: 100px;
min-height: 100px;
overflow: hidden;
width: 100%;
}
.list-resource__image img,
.list-resource__image svg {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
}
.list-resource__content {
padding: 2rem;
position: relative;
}
.list-resource__title {
margin-bottom: 1rem;
}
.list-resource__title h3 {
color: #0f172a;
color: var(--color-slate-900);
font-family: "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-family: var(--font-heading);
font-size: 1.612rem;
letter-spacing: -0.02em;
line-height: 1.2;
margin: 0;
}
.list-resource__description {
color: #64748b;
color: var(--color-slate-500);
font-family: "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-family: var(--font-body);
font-size: 1.125rem;
line-height: 1.5;
margin: 0;
margin-bottom: 3rem;
min-height: 160px;
}
.list-resource__description p {
margin: 0;
}
.list-resource__cta {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
bottom: 2rem;
color: #64748b;
color: var(--color-slate-500);
font-family: "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-family: var(--font-body);
font-size: 1rem;
font-weight: 600;
left: 2rem;
margin: 0;
padding: 0.75rem 1rem;
position: absolute;
text-align: center;
width: calc(100% - 4rem);
}
.blocktype-tip[data-theme="0"] {
--border-color: var(--color-primary-500);
--background-color: rgba(var(--color-primary-500-rgb), 0.055);
--icon-color: var(--color-primary-500);
--link-color: var(--color-primary-700);
}
.blocktype-tip[data-theme="1"] {
--border-color: var(--color-accent-1-700);
--background-color: rgba(var(--color-accent-1-500-rgb), 0.05);
--icon-color: var(--color-accent-1-800);
--link-color: var(--color-accent-1-800);
}
.blocktype-tip[data-theme="2"] {
--border-color: var(--color-accent-2-700);
--background-color: rgba(var(--color-accent-2-700-rgb), 0.05);
--icon-color: var(--color-accent-2-700);
--link-color: var(--color-accent-2-700);
}
.blocktype-tip {
background-clip: padding-box;
background-color: var(--background-color);
border: 1px solid;
border: 1px solid var(--border-color);
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
display: block;
line-height: 1.5rem;
margin-bottom: 18px;
margin-top: 18px;
max-width: 620px;
padding: 12px 18px 12px 65px;
position: relative;
word-break: break-word;
}
.blocktype-tip i {
color: var(--icon-color);
font-size: 1.35rem;
left: 1.45rem;
position: absolute;
top: 18px;
}
.blocktype-tip__content {
display: block;
}
.blocktype-tip__content,.blocktype-tip__content p {
margin-bottom: 0;
margin-top: 0;
}
.blocktype-tip__content p strong {
font-weight: 700;
}
.blocktype-tip__content p a {
color: var(--link-color);
font-weight: 500;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 0.1em;
}
.r-visual__shadows,
.r-visual__icon {
display: none;
}
.corner-color-blobs {
--blob-1-rgb: 240, 177, 84;
--blob-2-rgb: 240, 177, 84;
--blob-3-rgb: 240, 177, 84;
}
.ajax-filter {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
background-image: linear-gradient(to bottom, #f8fafc, #f1f5f9);
background-image: linear-gradient(to bottom, var(--color-slate-50), var(--color-slate-100));
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 12px;
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
justify-content: center;
margin: 2rem 0;
min-height: 72px;
padding: 1.125rem;
transition-duration: 250ms;
transition-property: background-color, border-color, box-shadow;
}
.ajax-filter:focus-within {
border-color: transparent;
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.ajax-filter .ajax-filter__div {
display: flex;
flex-direction: column;
grid-gap: 0.5rem;
max-width: 140px;
}
@media (max-width: 992px) {
.ajax-filter .ajax-filter__div {
max-width: 100%;
}
}
.ajax-filter .ajax-filter__div > select {
background-color: transparent;
background-color: white;
border-color: #94a3b8;
border-color: var(--color-slate-400);
border-color: #e2e8f0;
border-color: var(--color-slate-200);
border-radius: 6px;
font-size: 16px;
font-weight: 400;
font-weight: 600;
margin-top: 0;
min-height: 32px;
outline: 4px solid rgba(0, 123, 255, 0);
outline: 4px solid rgba(var(--color-primary-500-rgb), 0);
padding: 0.5rem;
transition-duration: 250ms;
transition-property: outline, border-color, box-shadow, background;
width: 100%;
will-change: outline, border-color, box-shadow, background;
}
.ajax-filter .ajax-filter__div > select:focus,
.ajax-filter .ajax-filter__div > select:active {
border-color: #007bff;
border-color: var(--color-primary-500);
outline: 4px solid rgba(0, 123, 255, 0.15);
outline: 4px solid rgba(var(--color-primary-500-rgb), 0.15);
}
.ajax-filter .ajax-filter__div > label {
color: #64748b;
color: var(--color-slate-500);
display: none;
font-size: 0.865rem;
font-weight: 700;
line-height: 1;
margin: 0;
}
@media (min-width: 992px) {
.ajax-filter[data-filter=news] {
align-items: center;
display: flex;
justify-content: flex-end;
}
.ajax-filter[data-filter=news] > .ajax-filter__div {
min-width: 180px;
width: 180px;
}
.ajax-filter[data-filter=resources] {
grid-template-columns: 1fr 1fr 1fr 1fr;
justify-content: center;
}
.ajax-filter .ajax-filter__div {
border-color: #cbd5e1;
border-color: var(--color-slate-300);
border-radius: 6px;
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 1, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
font-weight: 400;
margin-top: 0;
max-width: 100%;
min-height: 32px;
padding: 0.5rem;
width: 100%;
}
}
#ajax_posts_wrap .alert {
grid-column-end: 4;
grid-column-start: 1;
margin: 2rem auto 0;
padding: 0 2rem;
}
#ajax_posts_wrap .alert .alert-content p {
font-size: 1.15rem;
line-height: 1.563;
text-align: center;
}
@media (max-width: 768px) {
#ajax_posts_wrap .alert {
background-color: #f8fafc;
background-color: var(--color-slate-50);
margin-top: 1rem;
padding: 1.563rem;
}
#ajax_posts_wrap .alert .alert-content p {
font-size: 1rem;
}
}
@media (min-width: 992px) {
#ajax_posts_wrap .alert {
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 8px;
margin: 2rem auto 0;
max-width: 768px;
padding: 2rem;
}
#ajax_posts_wrap .alert .alert-content p {
font-size: 1.25rem;
line-height: 1.563;
}
}
.is-hidden {
display: none;
visibility: hidden;
}
.select {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 6px;
color: #0f172a;
color: var(--color-slate-900);
cursor: pointer;
display: inline-block;
min-height: 42px;
position: relative;
transition-duration: 250ms;
transition-property: outline, border-color, box-shadow, background;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: outline, border-color, box-shadow, background;
}
.select.is-active,
.select:focus {
border: 1px solid #007bff;
border: 1px solid var(--color-primary-500);
outline: 0.25em solid rgba(0, 123, 255, 0.25);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.25);
}
.select-styled {
align-items: center;
-webkit-appearance: none;
background: none;
border: none;
bottom: 0;
cursor: pointer;
display: flex;
font-size: 1rem;
font-weight: 500;
left: 0;
margin: 0;
min-height: 38px;
padding: 0;
padding: 0 12px;
position: absolute;
right: 0;
top: 0;
}
.select-styled > span {
overflow: hidden;
text-align: left;
text-overflow: ellipsis;
white-space: nowrap;
width: 60%;
}
.select-styled::after {
background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M%207.4296875%209.5%20L%205.9296875%2011%20L%2012%2017.070312%20L%2018.070312%2011%20L%2016.570312%209.5%20L%2012%2014.070312%20L%207.4296875%209.5%20z%22%20fill%3D%22%23000000%22%2F%3E%3C%2Fsvg%3E");
content: "";
height: 18px;
opacity: 0.4;
position: absolute;
right: 1rem;
top: 50%;
transform: translateY(-50%) scaleY(1);
transition-duration: 250ms;
transition-property: transform;
width: 18px;
will-change: transform;
}
.select.is-active .select-styled::after {
transform: translateY(-50%) scaleY(-1);
}
.select-options {
background-color: white;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 6px;
display: flex;
display: none;
flex-direction: column;
left: 0;
list-style: none;
margin: 0 0;
margin-top: 11px;
padding: 0;
position: absolute;
right: 0;
top: 100%;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: 999;
}
.select.is-active .select-options {
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
display: flex;
}
.select-options li {
margin: 0;
padding: 0.5rem 1rem;
transition-duration: 150ms;
transition-property: background-color, color;
transition-timing-function: ease;
}
.select-options li.is-disabled {
color: #94a3b8;
color: var(--color-slate-400);
cursor: not-allowed;
}
.select-options li.is-disabled:hover {
background-color: transparent;
}
.select-options li.is-selected {
background-color: #e2e8f0;
background-color: var(--color-slate-200);
}
.select-options li:hover {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
}
.ajax-filter[data-resource-type=reports] [data-filter-name=resource_age],
.ajax-filter[data-resource-type=reports] [data-filter-name=resource_age] {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
color: #e2e8f0;
color: var(--color-slate-200);
/* select is disabled */
opacity: 0.4;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.ajax-filter__checkbox {
max-width: 300px;
position: relative;
width: 100%;
}
.ajax-filter__header {
align-items: center;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
display: flex;
font-size: 1rem;
font-weight: 600;
height: 38px;
justify-content: space-between;
padding: 0 6px;
padding: 0 12px;
}
.ajax-filter__header button {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: none;
background-color: white;
border: none;
border: 1px solid;
border-radius: 0.25em;
color: #334155;
color: var(--color-slate-700);
display: flex;
font-size: 13px;
font-weight: 600;
padding: 3px 5px;
}
.ajax-filter__checkboxes {
background-color: white;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 0.25em;
border-top: none;
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
box-sizing: border-box;
display: flex;
flex-direction: column;
height: 280px;
max-width: 300px;
overflow-x: hidden;
padding: 0.5rem;
position: absolute;
top: calc(100% + 6px);
width: 100%;
z-index: 1000;
}
.ajax-filter__checkboxes::-webkit-scrollbar {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
opacity: 0;
width: 3px;
}
.ajax-filter__checkboxes::-webkit-scrollbar-thumb {
background-color: #007bff;
background-color: var(--color-primary-500);
}
.ajax-filter__checkbox label {
align-items: center;
box-sizing: border-box;
cursor: pointer;
display: flex;
flex-direction: row-reverse;
font-size: 14px;
font-weight: 500;
justify-content: space-between;
padding: 0.5rem 0.8rem;
padding: 6px 0;
transition: background-color 250ms ease;
width: 100%;
}
.ajax-filter__checkbox label span {
max-width: calc(100% - 2rem);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ajax-filter__checkbox input[type=checkbox] {
border-radius: 3px;
height: 16px;
overflow: hidden;
width: 16px;
}
.ajax-filter__checkbox input[type=checkbox]::before {
background-color: #eaf4ff;
background-color: var(--color-primary-50);
background-position: center;
background-repeat: no-repeat;
background-size: 100%;
border: 0px solid #e2e8f0;
border: 0px solid var(--color-slate-200);
content: "";
display: block;
height: 18px;
transition: background-color 250ms ease;
width: 18px;
}
.ajax-filter__checkbox input[type=checkbox]:checked::before {
background-color: #007bff;
background-color: var(--color-primary-500);
background-image: url('data:image/svg+xml;utf8,');
}
.patron-container {
display: flex;
flex-direction: column;
}
.patron-container + .patron-container {
border-top: 1px solid #e2e8f0;
border-top: 1px solid var(--color-slate-200);
margin-top: 3.125rem;
padding-top: 3.125rem;
}
.patron-grid {
display: grid;
}
.patron-image {
--r: 8px;
--w: 80px;
--h: 80px;
grid-area: patron-image;
height: 80px;
height: var(--h);
width: 80px;
width: var(--w);
}
.patron-image img {
border-radius: var(--r);
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
pointer-events: none;
position: absolute;
width: 100%;
z-index: 1;
}
.patron-image img,.patron-image p {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.patron-image p {
color: #475569;
color: var(--color-slate-600);
font-size: 12px;
line-height: 1.414;
margin-top: 10px;
}
.patron-image picture {
display: block;
}
.patron-image--wrapper {
height: var(--h);
position: relative;
width: var(--w);
}
.patron-image--wrapper::before {
background-color: rgba(226, 232, 240, 1);
background-color: rgba(var(--color-slate-200-rgb), 1);
border-radius: var(--r);
content: "";
display: block;
height: calc(100% + 5px);
left: -5px;
position: absolute;
top: -10px;
transform: rotate(-3deg);
width: calc(100% + 5px);
z-index: 0;
}
.patron-header {
grid-area: patron-header;
}
.patron-header h2 {
align-items: center;
display: flex;
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
font-weight: 700;
gap: 6px;
line-height: 1.2;
margin: 0;
}
.patron-header h2 i {
color: #64748b;
color: var(--color-slate-500);
font-size: 70%;
}
.patron-content {
grid-area: patron-content;
}
.patron-content p {
font-size: 1rem;
}
@media (min-width: 992px) {
.patron-grid {
gap: 0px calc(2.074 * 1rem);
gap: 0px calc(var(--scale-p5) * 1rem);
grid-template-areas: "patron-image patron-header" "patron-image patron-content" ". .";
grid-template-columns: 225px 1fr;
grid-template-rows: 42px auto auto auto;
}
.patron-image {
--r: 9px;
--w: 225px;
--h: 225px;
}
.patron-content p {
font-size: 1.125rem;
}
.patron-image {
-ms-grid-row: 1;
-ms-grid-row-span: 3;
-ms-grid-column: 1;
}
.patron-header {
-ms-grid-row: 1;
-ms-grid-column: 3;
}
.patron-content {
-ms-grid-row: 3;
-ms-grid-column: 3;
}
.patron-image {
-ms-grid-row: 1;
-ms-grid-row-span: 3;
-ms-grid-column: 1;
}
.patron-header {
-ms-grid-row: 1;
-ms-grid-column: 3;
}
.patron-content {
-ms-grid-row: 3;
-ms-grid-column: 3;
}
}
@media (max-width: 992px) {
.patron-grid {
gap: 0px calc(1.44 * 1rem);
gap: 0px calc(var(--scale-p3) * 1rem);
grid-template-areas: "patron-image patron-header" "patron-content patron-content" ". .";
grid-template-columns: 80px auto;
grid-template-rows: 80px auto auto auto;
}
.patron-header {
align-self: flex-end;
}
.patron-content {
margin-top: calc(1 * 1rem);
margin-top: calc(var(--scale-p1) * 1rem);
}
.patron-image p {
display: none;
}
.patron-image {
-ms-grid-row: 1;
-ms-grid-row-span: 1;
-ms-grid-column: 1;
}
.patron-header {
-ms-grid-row: 1;
-ms-grid-column: 3;
}
.patron-content {
-ms-grid-row: 3;
-ms-grid-column: 1;
-ms-grid-column-span: 3;
}
.patron-image {
-ms-grid-row: 1;
-ms-grid-row-span: 1;
-ms-grid-column: 1;
}
.patron-header {
-ms-grid-row: 1;
-ms-grid-column: 3;
}
.patron-content {
-ms-grid-row: 3;
-ms-grid-column: 1;
-ms-grid-column-span: 3;
}
}
:root {
--scale: 1;
}
@media (min-width: 1500px) {
:root {
--scale: 1.1875 ;
}
}
@media (min-width: 992px) and (max-width: 1199.98px) {
:root {
--scale: 0.9 ;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
:root {
--scale: 0.8 ;
}
}
@media (max-width: 767.98px) {
:root {
--scale: 0.6 ;
}
}
/*
.hero {
display: grid;
grid-template-columns: 1fr;
grid-gap: calc(40px*var(--scale));
} */
:root {
--scale-n5: 0.402;
--scale-n4: 0.482;
--scale-n3: 0.579;
--scale-n2: 0.694;
--scale-n1: 0.833;
--scale-p1: 1;
--scale-p2: 1.2;
--scale-p3: 1.44;
--scale-p4: 1.728;
--scale-p5: 2.074;
--scale-p6: 2.488;
--scale-p7: 2.986;
--scale-p8: 3.583;
--scale-p9: 4.3;
--scale-p10: 5.16;
--scale-p11: 6.192;
--body-ff: "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
--heading-ff: var(--body-ff);
--body-fs: calc(var(--abs-p1) * 1px);
--body-fw: 400;
--body-lh: var(--scale-p3);
--type-body: 400 1rem / var(--scale-p5) var(--body-ff);
--flu1: calc(var(--abs-p1) / var(--viewportBase) * 100vw);
--flu2: calc(var(--abs-p2) / var(--viewportBase) * 100vw);
--flu3: calc(var(--abs-p3) / var(--viewportBase) * 100vw);
--flu4: calc(var(--abs-p4) / var(--viewportBase) * 100vw);
--flu5: calc(var(--abs-p5) / var(--viewportBase) * 100vw);
--flu6: calc(var(--abs-p6) / var(--viewportBase) * 100vw);
--flu7: calc(var(--abs-p7) / var(--viewportBase) * 100vw);
--flu8: calc(var(--abs-p8) / var(--viewportBase) * 100vw);
--flu9: calc(var(--abs-p9) / var(--viewportBase) * 100vw);
--flu10: calc(var(--abs-p10) / var(--viewportBase) * 100vw);
--type-h0: 700 calc(var(--scale-p8) * 1rem) / var(--scale-p3) var(--heading-ff);
--type-h1: 700 calc(var(--scale-p7) * 1rem) / var(--scale-p2) var(--heading-ff);
--type-h2: 600 calc(var(--scale-p5) * 1rem) / var(--scale-p2) var(--heading-ff);
--type-h3: 600 calc(var(--scale-p3) * 1rem) / var(--scale-p2) var(--heading-ff);
--type-h4: 500 calc(var(--abs-p2) * 1px) / var(--scale-p2) var(--heading-ff);
--type-h5: 500 1rem / var(--scale-p2) var(--heading-ff);
--type-h6: 500 calc(var(--abs-n1) * 1px) / var(--scale-p2) var(--heading-ff);
--type-p: 400 1rem / var(--scale-p3) var(--body-ff);
--type-p-lg: 400 calc(var(--scale-p2) * 1rem) / var(--scale-p3) var(--body-ff);
--type-p-sm: 400 calc(var(--abs-p1) * 1px) / var(--scale-p3) var(--body-ff);
--h0c: clamp(var(--scale-p9) * 1rem, var(--flu6), calc(var(--scale-p9) * 1rem + 3.9vw));
--h1c: clamp(var(--scale-p8) * 1rem, var(--flu8), var(--scale-p9) * 1rem);
--h2c: clamp(var(--scale-p6) * 1rem, var(--flu7), var(--scale-p7) * 1rem);
--h3c: clamp(var(--scale-p4) * 1rem, var(--flu6), var(--scale-p5) * 1rem);
--h4c: clamp(var(--scale-p3) * 1rem, var(--flu5), var(--scale-p4) * 1rem);
--h5c: clamp(var(--scale-p2) * 1rem, var(--flu4), var(--scale-p3) * 1rem);
--h6c: clamp(var(--scale-p1) * 1rem, var(--flu3), var(--scale-p2) * 1rem);
--pc: clamp(var(--scale-p2) * 1rem, var(--flu4), var(--scale-p3) * 1rem);
--type-h0f: 700 calc(var(--scale-p6) * 1rem + var(--scale-p3) * 1vw) / var(--scale-p1) var(--heading-ff);
--type-h1f: 700 calc(var(--scale-p3) * 1rem + var(--scale-p2) * 1vw) / var(--scale-p3) var(--heading-ff);
--type-h2f: 600 calc(var(--scale-p1) * 1rem + var(--scale-p1) * 1vw) / var(--scale-p3) var(--heading-ff);
--type-h3f: 600 calc(var(--scale-p1) * 1rem + var(--scale-n1) * 1vw) / var(--scale-p3) var(--heading-ff);
--type-pf: 400 calc(var(--scale-p1) * 1rem + var(--scale-n5) * 1vw) / var(--scale-p3) var(--heading-ff);
--gutter: 1rem;
--gutter-x: 1rem;
--gutter-y: 0;
--rem1: 1rem;
--rem2: calc(var(--scale-p2) * 1rem);
--rem3: calc(var(--scale-p3) * 1rem);
--rem4: calc(var(--scale-p4) * 1rem);
--rem5: calc(var(--scale-p5) * 1rem);
--rem6: calc(var(--scale-p6) * 1rem);
--rem7: calc(var(--scale-p7) * 1rem);
--rem8: calc(var(--scale-p8) * 1rem);
--rem9: calc(var(--scale-p9) * 1rem);
}
@media (max-width: 768px) {
:root {
--gutter-x: 28px;
}
}
@media (max-width: 375px) {
:root {
--gutter-x: 16px;
}
}
@media (max-width: 544px) {
:root {
--viewportBase: 544;
--abs-n5: 6.43;
--abs-n4: 7.71;
--abs-n3: 9.26;
--abs-n2: 11.1;
--abs-n1: 13.33;
--abs-p1: 16;
--abs-p2: 20;
--abs-p3: 25.01;
--abs-p4: 31.25;
--abs-p5: 39.06;
--abs-p6: 48.83;
--abs-p7: 61.04;
--abs-p8: 76.29;
--abs-p9: 95.36;
--abs-p10: 119.22;
}
}
@media (min-width: 544px) and (max-width: 768px) {
:root {
--viewportBase: 768;
--abs-n5: 6.43;
--abs-n4: 7.71;
--abs-n3: 9.26;
--abs-n2: 11.1;
--abs-n1: 13.33;
--abs-p1: 16;
--abs-p2: 20;
--abs-p3: 25.01;
--abs-p4: 31.25;
--abs-p5: 39.06;
--abs-p6: 48.83;
--abs-p7: 61.04;
--abs-p8: 76.29;
--abs-p9: 95.36;
--abs-p10: 119.22;
}
}
@media (min-width: 768px) and (max-width: 1024px) {
:root {
--viewportBase: 1024;
--abs-n5: 6.43;
--abs-n4: 7.71;
--abs-n3: 9.26;
--abs-n2: 11.1;
--abs-n1: 13.33;
--abs-p1: 16;
--abs-p2: 20;
--abs-p3: 25.01;
--abs-p4: 31.25;
--abs-p5: 39.06;
--abs-p6: 48.83;
--abs-p7: 61.04;
--abs-p8: 76.29;
--abs-p9: 95.36;
--abs-p10: 119.22;
}
}
@media (min-width: 1024px) and (max-width: 1366px) {
:root {
--viewportBase: 1366;
--abs-n5: 6.83;
--abs-n4: 8.19;
--abs-n3: 9.84;
--abs-n2: 11.8;
--abs-n1: 14.16;
--abs-p1: 17;
--abs-p2: 21.25;
--abs-p3: 26.57;
--abs-p4: 33.2;
--abs-p5: 41.5;
--abs-p6: 51.88;
--abs-p7: 64.86;
--abs-p8: 81.06;
--abs-p9: 101.32;
--abs-p10: 126.67;
}
}
@media (min-width: 1366px) {
:root {
--viewportBase: 1366;
--abs-n5: 7.24;
--abs-n4: 8.68;
--abs-n3: 10.42;
--abs-n2: 12.49;
--abs-n1: 14.99;
--abs-p1: 18;
--abs-p2: 22.5;
--abs-p3: 28.13;
--abs-p4: 35.15;
--abs-p5: 43.94;
--abs-p6: 54.94;
--abs-p7: 68.67;
--abs-p8: 85.82;
--abs-p9: 107.28;
--abs-p10: 134.12;
}
}
@media (min-width: 1920px) {
:root {
--viewportBase: 1920;
}
}
.h0, .h0f {
font: 700 calc(3.583 * 1rem) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h0);
}
.h1, .h1f, h1 {
font: 700 calc(2.986 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h1);
}
.h2, .h2f, h2 {
font: 600 calc(2.074 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h2);
}
.h3, .h3f, h3 {
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
}
.h4, h4 {
font: var(--type-h4);
}
.h5, h5 {
font: 500 1rem / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h5);
}
.h6, h6 {
font: var(--type-h6);
}
.h0f {
font: 700 calc(2.488 * 1rem + 1.44 * 1vw) / 1 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif !important;
font: var(--type-h0f) !important;
}
.h1f {
font: 700 calc(1.44 * 1rem + 1.2 * 1vw) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif !important;
font: var(--type-h1f) !important;
}
.h2f {
font: 600 calc(1 * 1rem + 1 * 1vw) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif !important;
font: var(--type-h2f) !important;
}
.h3f {
font: 600 calc(1 * 1rem + 0.833 * 1vw) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif !important;
font: var(--type-h3f) !important;
}
.type-caption1 {
color: #737373;
color: var(--color-grey-500);
font: 500 12px/1.33337 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--type-caption1);
}
.type-caption2 {
color: #404040;
color: var(--color-grey-700);
font: 600 14px/1.33337 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--type-caption2);
}
.type-footnote {
font: 500 12px/1.33337 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--type-footnote);
}
.type-pf {
font: 400 calc(1 * 1rem + 0.402 * 1vw) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-pf);
margin-bottom: 1em;
}
.type-p {
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
}
.type-p-sm {
font: var(--type-p-sm);
}
.type-p-lg {
font: 400 calc(1.2 * 1rem) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p-lg);
}
p {
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
text-wrap: pretty;
}
p + p {
margin-top: 1em;
}
*,
*::before,
*::after {
box-sizing: border-box;
}
span.sr-only,
.sr-only {
border-width: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
white-space: nowrap;
width: 1px;
}
i[class^=icon-],
i[class*=" icon-"],
i[class^=icon-] > svg,
i[class*=" icon-"] > svg {
align-items: center;
display: inline-flex;
fill: currentColor;
height: 1em;
width: 1em;
}
i[class^=icon-] > svg,
i[class*=" icon-"] > svg {
display: block;
}
html {
direction: ltr;
font-family: "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font-family: var(--body-ff);
font-feature-settings: "calt" 1, "clig" 1, "kern" 1, "liga" 1, "onum" 0, "pnum" 0, "case" 0, "liga", "clig";
font-size: var(--body-fs);
-webkit-font-smoothing: antialiased;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-synthesis: none;
font-variant-ligatures: common-ligatures;
font-weight: 400;
font-weight: var(--body-fw);
height: -webkit-fill-available;
line-height: 1.44;
line-height: var(--body-lh);
-ms-overflow-style: scrollbar;
scroll-behavior: smooth;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
text-rendering: optimizeLegibility;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
text-size-adjust: 100%;
}
html,
body,body {
min-height: 100%;
}
body {
min-height: -webkit-fill-available;
-ms-overflow-style: none;
overflow-x: hidden;
overflow-y: scroll;
scrollbar-width: none;
text-align: left;
}
body::-webkit-scrollbar {
background: transparent;
display: none;
width: 0;
}
@-moz-document url-prefix() {
html {
scrollbar-width: none;
}
}
a {
background-color: transparent;
color: currentColor;
cursor: pointer;
text-decoration: none;
-webkit-text-decoration-skip: objects;
}
a:not([href]):not([tabindex]) {
text-decoration: none;
}
a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
color: inherit;
text-decoration: none;
}
a:not([href]):not([tabindex]):focus {
outline: 0;
}
button {
-webkit-appearance: none;
background: transparent;
border: none;
color: inherit;
font: inherit;
line-height: normal;
overflow: visible;
padding: 0;
width: auto;
}
button,body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
margin: 0;
}
article,
aside,
dialog,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section {
display: block;
}
ul,
ol {
list-style: none;
margin: 0;
padding: 0;
}
input,
button,
textarea,
select {
font: inherit;
}
iframe {
border: 0;
}
blockquote,
q {
quotes: none;
}
blockquote::before, blockquote::after,
q::before,
q::after {
content: "";
content: none;
}
[tabindex="-1"]:focus {
outline: none !important;
}
abbr[title],
abbr[data-original-title] {
border-bottom: 0;
cursor: help;
text-decoration: underline;
-webkit-text-decoration: underline dotted;
text-decoration: underline dotted;
}
address {
font-style: normal;
line-height: inherit;
}
b,
strong {
font-weight: bolder;
}
figure {
margin: 0;
-webkit-margin-end: 0;
-webkit-margin-start: 0;
}
img {
border-image-width: 0;
border-style: none;
height: auto;
image-rendering: -webkit-optimize-contrast;
max-width: 100%;
vertical-align: middle;
}
img[src=""] {
display: none;
}
svg:not(:root) {
image-rendering: -webkit-optimize-contrast;
overflow: visible;
}
a,
area,
button,
[role=button],
input:not([type=range]),
label,
select,
summary,
textarea {
touch-action: manipulation;
}
input,
select,
button,
progress,
[type=button],
[type=submit],
[type=reset],
[type=search] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
text-rendering: inherit;
}
input:not(:disabled),
select:not(:disabled),
button:not(:disabled),
progress:not(:disabled),
[type=button]:not(:disabled),
[type=submit]:not(:disabled),
[type=reset]:not(:disabled),
[type=search]:not(:disabled) {
cursor: pointer;
}
progress {
vertical-align: baseline;
}
table {
border-collapse: collapse;
}
th {
text-align: inherit;
}
label {
display: inline-block;
}
select {
word-wrap: normal;
}
button,
input,
select,
textarea {
font-size: 100%;
margin: 0;
vertical-align: baseline;
*vertical-align: middle;
}
button,
input {
line-height: normal;
}
button,
select {
text-transform: none;
}
button,
html input[type=button],
input[type=reset],
input[type=submit] {
-webkit-appearance: button;
cursor: pointer;
*overflow: visible;
}
input[type=checkbox],
input[type=radio] {
box-sizing: border-box;
*height: 13px;
padding: 0;
*width: 13px;
}
[list]::-webkit-calendar-picker-indicator {
display: none;
}
input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration,
input[type=search]::-webkit-search-results-button,
input[type=search]::-webkit-search-results-decoration {
-webkit-appearance: none;
-moz-appearance: none;
}
input[type=search] {
-webkit-appearance: none;
-moz-appearance: none;
box-sizing: content-box;
}
input[type=radio],
input[type=checkbox] {
box-sizing: border-box;
padding: 0;
}
input[type=date],
input[type=time],
input[type=datetime-local],
input[type=month] {
-webkit-appearance: textfield;
}
textarea {
overflow: auto;
resize: vertical;
vertical-align: top;
}
audio,
canvas,
video {
display: inline-block;
*display: inline;
max-width: 100%;
*zoom: 1;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden] {
display: none;
}
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height: auto;
}
::-webkit-search-cancel-button,
::-webkit-search-decoration {
-webkit-appearance: none;
}
::-webkit-datetime-edit {
line-height: 0;
overflow: visible;
}
::-webkit-file-upload-button {
-webkit-appearance: none;
font: inherit;
}
::-webkit-datetime-edit-fields-wrapper,
::-webkit-datetime-edit-text,
::-webkit-datetime-edit-minute,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-year-field {
padding: 0;
}
::-webkit-color-swatch-wrapper {
padding: 0;
}
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
border-style: none;
padding: 0;
}
[hidden] {
display: none !important;
}
button {
-webkit-appearance: none;
background: transparent;
border: none;
color: inherit;
font: inherit;
line-height: normal;
margin: 0;
overflow: visible;
padding: 0;
width: auto;
}
@media (prefers-reduced-motion: reduce) {
html {
scroll-behavior: auto;
}
*,
*::before,
*::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-duration: 0.01ms !important;
}
}
.b-1 {
border: 1px solid;
}
.bl-1 {
border-left: 1px solid;
}
.br-1 {
border-right: 1px solid;
}
.bb-1 {
border-bottom: 1px solid;
}
.bt-1 {
border-top: 1px solid;
}
.mx-auto {
margin-right: auto;
}
.mx-auto,.ml-auto {
margin-left: auto;
}
.mr-auto {
margin-right: auto;
}
.mt-auto {
margin-top: auto;
}
.mb-auto {
margin-bottom: auto;
}
.container-fluid + .container-fluid,
.container-fluid + .container,
.container + .container-fluid,
.container + .container,
.row + .row {
margin-top: 0 !important;
margin-top: var(--gutter-y) !important;
}
.row.no-gutters {
margin-left: 0 !important;
margin-right: 0 !important;
margin-top: 0 !important;
}
.row.no-gutters > * {
margin-top: 0 !important;
padding-left: 0 !important;
padding-right: 0 !important;
}
.container-fluid,
.container {
margin-left: auto;
margin-right: auto;
padding-left: 1rem !important;
padding-left: var(--gutter-x) !important;
padding-right: 1rem !important;
padding-right: var(--gutter-x) !important;
width: 100%;
}
.row {
display: flex;
flex-wrap: wrap;
margin-left: calc(1rem / -1) !important;
margin-left: calc(var(--gutter-x) / -1) !important;
margin-right: calc(1rem / -1) !important;
margin-right: calc(var(--gutter-x) / -1) !important;
}
.row > * {
flex-shrink: 0;
max-width: 100%;
padding-left: 1rem !important;
padding-left: var(--gutter-x) !important;
padding-right: 1rem !important;
padding-right: var(--gutter-x) !important;
width: 100%;
}
.col {
flex: 1 0;
}
.d-none {
display: none !important;
}
.d-flex,.d-inline-flex {
display: flex !important;
}
.d-block {
display: block !important;
}
.d-grid {
display: grid !important;
}
.text-center {
text-align: center !important;
}
.text-left {
text-align: left !important;
}
.text-right {
text-align: right !important;
}
.flex-row {
flex-direction: row !important;
}
.flex-column {
flex-direction: column !important;
}
.flex-nowrap {
flex-wrap: nowrap !important;
}
.flex-wrap {
flex-wrap: wrap !important;
}
.justify-content-center {
justify-content: center !important;
}
.justify-content-start {
justify-content: flex-start !important;
}
.justify-content-end {
justify-content: flex-end !important;
}
.justify-content-between {
justify-content: space-between !important;
}
.justify-content-around {
justify-content: space-around !important;
}
.justify-content-evenly {
justify-content: space-evenly !important;
}
.align-items-center {
align-items: center !important;
}
.align-items-start {
align-items: flex-start !important;
}
.align-items-end {
align-items: flex-end !important;
}
.align-items-stretch {
align-items: stretch !important;
}
.align-items-baseline {
align-items: baseline !important;
}
.align-self-center {
align-self: center !important;
}
.align-self-start {
align-self: flex-start !important;
}
.align-self-end {
align-self: flex-end !important;
}
.align-self-stretch {
align-self: stretch !important;
}
.align-self-baseline {
align-self: baseline !important;
}
.w-100 {
width: 100% !important;
}
.w-100vh {
height: 100vh !important;
}
.w-100vw {
width: 100vw !important;
}
.pe-none {
pointer-events: none !important;
}
.user-select-none {
-webkit-user-select: none !important;
-moz-user-select: none !important;
user-select: none !important;
}
.row-cols-1 > * {
flex: 0 0 auto !important;
}
.row-cols-1 > *,
.col-1 {
width: 8.3333333333% !important;
}
.row-cols-2 > * {
flex: 0 0 auto !important;
}
.row-cols-2 > *,
.col-2 {
width: 16.6666666667% !important;
}
.row-cols-3 > * {
flex: 0 0 auto !important;
}
.row-cols-3 > *,
.col-3 {
width: 25% !important;
}
.row-cols-4 > * {
flex: 0 0 auto !important;
}
.row-cols-4 > *,
.col-4 {
width: 33.3333333333% !important;
}
.row-cols-5 > * {
flex: 0 0 auto !important;
}
.row-cols-5 > *,
.col-5 {
width: 41.6666666667% !important;
}
.row-cols-6 > * {
flex: 0 0 auto !important;
}
.row-cols-6 > *,
.col-6 {
width: 50% !important;
}
.row-cols-7 > * {
flex: 0 0 auto !important;
}
.row-cols-7 > *,
.col-7 {
width: 58.3333333333% !important;
}
.row-cols-8 > * {
flex: 0 0 auto !important;
}
.row-cols-8 > *,
.col-8 {
width: 66.6666666667% !important;
}
.row-cols-9 > * {
flex: 0 0 auto !important;
}
.row-cols-9 > *,
.col-9 {
width: 75% !important;
}
.row-cols-10 > * {
flex: 0 0 auto !important;
}
.row-cols-10 > *,
.col-10 {
width: 83.3333333333% !important;
}
.row-cols-11 > * {
flex: 0 0 auto !important;
}
.row-cols-11 > *,
.col-11 {
width: 91.6666666667% !important;
}
.row-cols-12 > * {
flex: 0 0 auto !important;
}
.row-cols-12 > *,
.col-12 {
width: 100% !important;
}
.col-1 {
width: 8.3333333333% !important;
}
.col-1,.col-2 {
flex: 0 0 auto !important;
}
.col-2 {
width: 16.6666666667% !important;
}
.col-3 {
width: 25% !important;
}
.col-3,.col-4 {
flex: 0 0 auto !important;
}
.col-4 {
width: 33.3333333333% !important;
}
.col-5 {
width: 41.6666666667% !important;
}
.col-5,.col-6 {
flex: 0 0 auto !important;
}
.col-6 {
width: 50% !important;
}
.col-7 {
width: 58.3333333333% !important;
}
.col-7,.col-8 {
flex: 0 0 auto !important;
}
.col-8 {
width: 66.6666666667% !important;
}
.col-9 {
width: 75% !important;
}
.col-9,.col-10 {
flex: 0 0 auto !important;
}
.col-10 {
width: 83.3333333333% !important;
}
.col-11 {
width: 91.6666666667% !important;
}
.col-11,.col-12 {
flex: 0 0 auto !important;
}
.col-12 {
width: 100% !important;
}
.mt-0,
.my-0 {
margin-top: 0 !important;
}
.mt-1,
.my-1 {
margin-top: 0.432rem !important;
}
.mt-2,
.my-2 {
margin-top: 0.864rem !important;
}
.mt-3,
.my-3 {
margin-top: 1.728rem !important;
}
.mt-4,
.my-4 {
margin-top: 2.592rem !important;
}
.mt-5,
.my-5 {
margin-top: 3.456rem !important;
}
.mb-0,
.my-0 {
margin-bottom: 0 !important;
}
.mb-1,
.my-1 {
margin-bottom: 0.432rem !important;
}
.mb-2,
.my-2 {
margin-bottom: 0.864rem !important;
}
.mb-3,
.my-3 {
margin-bottom: 1.728rem !important;
}
.mb-4,
.my-4 {
margin-bottom: 2.592rem !important;
}
.mb-5,
.my-5 {
margin-bottom: 3.456rem !important;
}
.ml-0,
.mx-0 {
margin-left: 0 !important;
}
.ml-1,
.mx-1 {
margin-left: 0.432rem !important;
}
.ml-2,
.mx-2 {
margin-left: 0.864rem !important;
}
.ml-3,
.mx-3 {
margin-left: 1.728rem !important;
}
.ml-4,
.mx-4 {
margin-left: 2.592rem !important;
}
.ml-5,
.mx-5 {
margin-left: 3.456rem !important;
}
.mr-0,
.mx-0 {
margin-right: 0 !important;
}
.mr-1,
.mx-1 {
margin-right: 0.432rem !important;
}
.mr-2,
.mx-2 {
margin-right: 0.864rem !important;
}
.mr-3,
.mx-3 {
margin-right: 1.728rem !important;
}
.mr-4,
.mx-4 {
margin-right: 2.592rem !important;
}
.mr-5,
.mx-5 {
margin-right: 3.456rem !important;
}
.pt-0,
.py-0 {
padding-top: 0 !important;
}
.pt-1,
.py-1 {
padding-top: 0.432rem !important;
}
.pt-2,
.py-2 {
padding-top: 0.864rem !important;
}
.pt-3,
.py-3 {
padding-top: 1.728rem !important;
}
.pt-4,
.py-4 {
padding-top: 2.592rem !important;
}
.pt-5,
.py-5 {
padding-top: 3.456rem !important;
}
.pb-0,
.py-0 {
padding-bottom: 0 !important;
}
.pb-1,
.py-1 {
padding-bottom: 0.432rem !important;
}
.pb-2,
.py-2 {
padding-bottom: 0.864rem !important;
}
.pb-3,
.py-3 {
padding-bottom: 1.728rem !important;
}
.pb-4,
.py-4 {
padding-bottom: 2.592rem !important;
}
.pb-5,
.py-5 {
padding-bottom: 3.456rem !important;
}
.pl-0,
.px-0 {
padding-left: 0 !important;
}
.pl-1,
.px-1 {
padding-left: 0.432rem !important;
}
.pl-2,
.px-2 {
padding-left: 0.864rem !important;
}
.pl-3,
.px-3 {
padding-left: 1.728rem !important;
}
.pl-4,
.px-4 {
padding-left: 2.592rem !important;
}
.pl-5,
.px-5 {
padding-left: 3.456rem !important;
}
.pr-0,
.px-0 {
padding-right: 0 !important;
}
.pr-1,
.px-1 {
padding-right: 0.432rem !important;
}
.pr-2,
.px-2 {
padding-right: 0.864rem !important;
}
.pr-3,
.px-3 {
padding-right: 1.728rem !important;
}
.pr-4,
.px-4 {
padding-right: 2.592rem !important;
}
.pr-5,
.px-5 {
padding-right: 3.456rem !important;
}
@media (max-width: 544px) {
.container {
max-width: 100%;
}
.col-xs-1,
.row-cols-xs-1 > * {
flex: 0 0 auto !important;
width: 8.3333333333% !important;
}
.col-xs-2,
.row-cols-xs-2 > * {
flex: 0 0 auto !important;
width: 16.6666666667% !important;
}
.col-xs-3,
.row-cols-xs-3 > * {
flex: 0 0 auto !important;
width: 25% !important;
}
.col-xs-4,
.row-cols-xs-4 > * {
flex: 0 0 auto !important;
width: 33.3333333333% !important;
}
.col-xs-5,
.row-cols-xs-5 > * {
flex: 0 0 auto !important;
width: 41.6666666667% !important;
}
.col-xs-6,
.row-cols-xs-6 > * {
flex: 0 0 auto !important;
width: 50% !important;
}
.col-xs-7,
.row-cols-xs-7 > * {
flex: 0 0 auto !important;
width: 58.3333333333% !important;
}
.col-xs-8,
.row-cols-xs-8 > * {
flex: 0 0 auto !important;
width: 66.6666666667% !important;
}
.col-xs-9,
.row-cols-xs-9 > * {
flex: 0 0 auto !important;
width: 75% !important;
}
.col-xs-10,
.row-cols-xs-10 > * {
flex: 0 0 auto !important;
width: 83.3333333333% !important;
}
.col-xs-11,
.row-cols-xs-11 > * {
flex: 0 0 auto !important;
width: 91.6666666667% !important;
}
.col-xs-12,
.row-cols-xs-12 > * {
flex: 0 0 auto !important;
width: 100% !important;
}
.d-xs-none {
display: none !important;
}
.d-xs-flex,.d-xs-inline-flex {
display: flex !important;
}
.d-xs-block {
display: block !important;
}
.d-xs-grid {
display: grid !important;
}
.text-xs-center {
text-align: center !important;
}
.text-xs-left {
text-align: left !important;
}
.text-xs-right {
text-align: right !important;
}
.flex-xs-row {
flex-direction: row !important;
}
.flex-xs-column {
flex-direction: column !important;
}
.flex-xs-nowrap {
flex-wrap: nowrap !important;
}
.flex-xs-wrap {
flex-wrap: wrap !important;
}
.justify-content-xs-center {
justify-content: center !important;
}
.justify-content-xs-start {
justify-content: flex-start !important;
}
.justify-content-xs-end {
justify-content: flex-end !important;
}
.justify-content-xs-between {
justify-content: space-between !important;
}
.justify-content-xs-around {
justify-content: space-around !important;
}
.justify-content-xs-evenly {
justify-content: space-evenly !important;
}
.align-items-xs-center {
align-items: center !important;
}
.align-items-xs-start {
align-items: flex-start !important;
}
.align-items-xs-end {
align-items: flex-end !important;
}
.align-items-xs-stretch {
align-items: stretch !important;
}
.align-items-xs-baseline {
align-items: baseline !important;
}
.align-self-xs-center {
align-self: center !important;
}
.align-self-xs-start {
align-self: flex-start !important;
}
.align-self-xs-end {
align-self: flex-end !important;
}
.align-self-xs-stretch {
align-self: stretch !important;
}
.align-self-xs-baseline {
align-self: baseline !important;
}
.w-xs-100 {
width: 100% !important;
}
.w-xs-100vh {
height: 100vh !important;
}
.w-xs-100vw {
width: 100vw !important;
}
}
@media (min-width: 544px) and (max-width: 767px) {
.container {
max-width: 100%;
}
.col-sm-1,
.row-cols-sm-1 > * {
flex: 0 0 auto !important;
width: 8.3333333333% !important;
}
.col-sm-2,
.row-cols-sm-2 > * {
flex: 0 0 auto !important;
width: 16.6666666667% !important;
}
.col-sm-3,
.row-cols-sm-3 > * {
flex: 0 0 auto !important;
width: 25% !important;
}
.col-sm-4,
.row-cols-sm-4 > * {
flex: 0 0 auto !important;
width: 33.3333333333% !important;
}
.col-sm-5,
.row-cols-sm-5 > * {
flex: 0 0 auto !important;
width: 41.6666666667% !important;
}
.col-sm-6,
.row-cols-sm-6 > * {
flex: 0 0 auto !important;
width: 50% !important;
}
.col-sm-7,
.row-cols-sm-7 > * {
flex: 0 0 auto !important;
width: 58.3333333333% !important;
}
.col-sm-8,
.row-cols-sm-8 > * {
flex: 0 0 auto !important;
width: 66.6666666667% !important;
}
.col-sm-9,
.row-cols-sm-9 > * {
flex: 0 0 auto !important;
width: 75% !important;
}
.col-sm-10,
.row-cols-sm-10 > * {
flex: 0 0 auto !important;
width: 83.3333333333% !important;
}
.col-sm-11,
.row-cols-sm-11 > * {
flex: 0 0 auto !important;
width: 91.6666666667% !important;
}
.col-sm-12,
.row-cols-sm-12 > * {
flex: 0 0 auto !important;
width: 100% !important;
}
.d-sm-none {
display: none !important;
}
.d-sm-flex,.d-sm-inline-flex {
display: flex !important;
}
.d-sm-block {
display: block !important;
}
.d-sm-grid {
display: grid !important;
}
.text-sm-center {
text-align: center !important;
}
.text-sm-left {
text-align: left !important;
}
.text-sm-right {
text-align: right !important;
}
.flex-sm-row {
flex-direction: row !important;
}
.flex-sm-column {
flex-direction: column !important;
}
.flex-sm-nowrap {
flex-wrap: nowrap !important;
}
.flex-sm-wrap {
flex-wrap: wrap !important;
}
.justify-content-sm-center {
justify-content: center !important;
}
.justify-content-sm-start {
justify-content: flex-start !important;
}
.justify-content-sm-end {
justify-content: flex-end !important;
}
.justify-content-sm-between {
justify-content: space-between !important;
}
.justify-content-sm-around {
justify-content: space-around !important;
}
.justify-content-sm-evenly {
justify-content: space-evenly !important;
}
.align-items-sm-center {
align-items: center !important;
}
.align-items-sm-start {
align-items: flex-start !important;
}
.align-items-sm-end {
align-items: flex-end !important;
}
.align-items-sm-stretch {
align-items: stretch !important;
}
.align-items-sm-baseline {
align-items: baseline !important;
}
.align-self-sm-center {
align-self: center !important;
}
.align-self-sm-start {
align-self: flex-start !important;
}
.align-self-sm-end {
align-self: flex-end !important;
}
.align-self-sm-stretch {
align-self: stretch !important;
}
.align-self-sm-baseline {
align-self: baseline !important;
}
.w-sm-100 {
width: 100% !important;
}
.w-sm-100vh {
height: 100vh !important;
}
.w-sm-100vw {
width: 100vw !important;
}
}
@media (min-width: 768px) and (max-width: 1023px) {
.col-md-1,
.row-cols-md-1 > * {
flex: 0 0 auto !important;
width: 8.3333333333% !important;
}
.col-md-2,
.row-cols-md-2 > * {
flex: 0 0 auto !important;
width: 16.6666666667% !important;
}
.col-md-3,
.row-cols-md-3 > * {
flex: 0 0 auto !important;
width: 25% !important;
}
.col-md-4,
.row-cols-md-4 > * {
flex: 0 0 auto !important;
width: 33.3333333333% !important;
}
.col-md-5,
.row-cols-md-5 > * {
flex: 0 0 auto !important;
width: 41.6666666667% !important;
}
.col-md-6,
.row-cols-md-6 > * {
flex: 0 0 auto !important;
width: 50% !important;
}
.col-md-7,
.row-cols-md-7 > * {
flex: 0 0 auto !important;
width: 58.3333333333% !important;
}
.col-md-8,
.row-cols-md-8 > * {
flex: 0 0 auto !important;
width: 66.6666666667% !important;
}
.col-md-9,
.row-cols-md-9 > * {
flex: 0 0 auto !important;
width: 75% !important;
}
.col-md-10,
.row-cols-md-10 > * {
flex: 0 0 auto !important;
width: 83.3333333333% !important;
}
.col-md-11,
.row-cols-md-11 > * {
flex: 0 0 auto !important;
width: 91.6666666667% !important;
}
.col-md-12,
.row-cols-md-12 > * {
flex: 0 0 auto !important;
width: 100% !important;
}
.d-md-none {
display: none !important;
}
.d-md-flex,.d-md-inline-flex {
display: flex !important;
}
.d-md-block {
display: block !important;
}
.d-md-grid {
display: grid !important;
}
.text-md-center {
text-align: center !important;
}
.text-md-left {
text-align: left !important;
}
.text-md-right {
text-align: right !important;
}
.flex-md-row {
flex-direction: row !important;
}
.flex-md-column {
flex-direction: column !important;
}
.flex-md-nowrap {
flex-wrap: nowrap !important;
}
.flex-md-wrap {
flex-wrap: wrap !important;
}
.justify-content-md-center {
justify-content: center !important;
}
.justify-content-md-start {
justify-content: flex-start !important;
}
.justify-content-md-end {
justify-content: flex-end !important;
}
.justify-content-md-between {
justify-content: space-between !important;
}
.justify-content-md-around {
justify-content: space-around !important;
}
.justify-content-md-evenly {
justify-content: space-evenly !important;
}
.align-items-md-center {
align-items: center !important;
}
.align-items-md-start {
align-items: flex-start !important;
}
.align-items-md-end {
align-items: flex-end !important;
}
.align-items-md-stretch {
align-items: stretch !important;
}
.align-items-md-baseline {
align-items: baseline !important;
}
.align-self-md-center {
align-self: center !important;
}
.align-self-md-start {
align-self: flex-start !important;
}
.align-self-md-end {
align-self: flex-end !important;
}
.align-self-md-stretch {
align-self: stretch !important;
}
.align-self-md-baseline {
align-self: baseline !important;
}
.w-md-100 {
width: 100% !important;
}
.w-md-100vh {
height: 100vh !important;
}
.w-md-100vw {
width: 100vw !important;
}
}
@media (min-width: 1024px) and (max-width: 1365px) {
.container {
max-width: calc(var(--viewportBase) - 1rem * 2);
max-width: calc(var(--viewportBase) - var(--gutter-x) * 2);
}
.col-lg-1,
.row-cols-lg-1 > * {
flex: 0 0 auto !important;
width: 8.3333333333% !important;
}
.col-lg-2,
.row-cols-lg-2 > * {
flex: 0 0 auto !important;
width: 16.6666666667% !important;
}
.col-lg-3,
.row-cols-lg-3 > * {
flex: 0 0 auto !important;
width: 25% !important;
}
.col-lg-4,
.row-cols-lg-4 > * {
flex: 0 0 auto !important;
width: 33.3333333333% !important;
}
.col-lg-5,
.row-cols-lg-5 > * {
flex: 0 0 auto !important;
width: 41.6666666667% !important;
}
.col-lg-6,
.row-cols-lg-6 > * {
flex: 0 0 auto !important;
width: 50% !important;
}
.col-lg-7,
.row-cols-lg-7 > * {
flex: 0 0 auto !important;
width: 58.3333333333% !important;
}
.col-lg-8,
.row-cols-lg-8 > * {
flex: 0 0 auto !important;
width: 66.6666666667% !important;
}
.col-lg-9,
.row-cols-lg-9 > * {
flex: 0 0 auto !important;
width: 75% !important;
}
.col-lg-10,
.row-cols-lg-10 > * {
flex: 0 0 auto !important;
width: 83.3333333333% !important;
}
.col-lg-11,
.row-cols-lg-11 > * {
flex: 0 0 auto !important;
width: 91.6666666667% !important;
}
.col-lg-12,
.row-cols-lg-12 > * {
flex: 0 0 auto !important;
width: 100% !important;
}
.d-lg-none {
display: none !important;
}
.d-lg-flex,.d-lg-inline-flex {
display: flex !important;
}
.d-lg-block {
display: block !important;
}
.d-lg-grid {
display: grid !important;
}
.text-lg-center {
text-align: center !important;
}
.text-lg-left {
text-align: left !important;
}
.text-lg-right {
text-align: right !important;
}
.flex-lg-row {
flex-direction: row !important;
}
.flex-lg-column {
flex-direction: column !important;
}
.flex-lg-nowrap {
flex-wrap: nowrap !important;
}
.flex-lg-wrap {
flex-wrap: wrap !important;
}
.justify-content-lg-center {
justify-content: center !important;
}
.justify-content-lg-start {
justify-content: flex-start !important;
}
.justify-content-lg-end {
justify-content: flex-end !important;
}
.justify-content-lg-between {
justify-content: space-between !important;
}
.justify-content-lg-around {
justify-content: space-around !important;
}
.justify-content-lg-evenly {
justify-content: space-evenly !important;
}
.align-items-lg-center {
align-items: center !important;
}
.align-items-lg-start {
align-items: flex-start !important;
}
.align-items-lg-end {
align-items: flex-end !important;
}
.align-items-lg-stretch {
align-items: stretch !important;
}
.align-items-lg-baseline {
align-items: baseline !important;
}
.align-self-lg-center {
align-self: center !important;
}
.align-self-lg-start {
align-self: flex-start !important;
}
.align-self-lg-end {
align-self: flex-end !important;
}
.align-self-lg-stretch {
align-self: stretch !important;
}
.align-self-lg-baseline {
align-self: baseline !important;
}
.w-lg-100 {
width: 100% !important;
}
.w-lg-100vh {
height: 100vh !important;
}
.w-lg-100vw {
width: 100vw !important;
}
}
@media (min-width: 1366px) {
.container {
max-width: 1334px;
}
.col-xl-1,
.row-cols-xl-1 > * {
flex: 0 0 auto !important;
width: 8.3333333333% !important;
}
.col-xl-2,
.row-cols-xl-2 > * {
flex: 0 0 auto !important;
width: 16.6666666667% !important;
}
.col-xl-3,
.row-cols-xl-3 > * {
flex: 0 0 auto !important;
width: 25% !important;
}
.col-xl-4,
.row-cols-xl-4 > * {
flex: 0 0 auto !important;
width: 33.3333333333% !important;
}
.col-xl-5,
.row-cols-xl-5 > * {
flex: 0 0 auto !important;
width: 41.6666666667% !important;
}
.col-xl-6,
.row-cols-xl-6 > * {
flex: 0 0 auto !important;
width: 50% !important;
}
.col-xl-7,
.row-cols-xl-7 > * {
flex: 0 0 auto !important;
width: 58.3333333333% !important;
}
.col-xl-8,
.row-cols-xl-8 > * {
flex: 0 0 auto !important;
width: 66.6666666667% !important;
}
.col-xl-9,
.row-cols-xl-9 > * {
flex: 0 0 auto !important;
width: 75% !important;
}
.col-xl-10,
.row-cols-xl-10 > * {
flex: 0 0 auto !important;
width: 83.3333333333% !important;
}
.col-xl-11,
.row-cols-xl-11 > * {
flex: 0 0 auto !important;
width: 91.6666666667% !important;
}
.col-xl-12,
.row-cols-xl-12 > * {
flex: 0 0 auto !important;
width: 100% !important;
}
.d-xl-none {
display: none !important;
}
.d-xl-flex,.d-xl-inline-flex {
display: flex !important;
}
.d-xl-block {
display: block !important;
}
.d-xl-grid {
display: grid !important;
}
.text-xl-center {
text-align: center !important;
}
.text-xl-left {
text-align: left !important;
}
.text-xl-right {
text-align: right !important;
}
.flex-xl-row {
flex-direction: row !important;
}
.flex-xl-column {
flex-direction: column !important;
}
.flex-xl-nowrap {
flex-wrap: nowrap !important;
}
.flex-xl-wrap {
flex-wrap: wrap !important;
}
.justify-content-xl-center {
justify-content: center !important;
}
.justify-content-xl-start {
justify-content: flex-start !important;
}
.justify-content-xl-end {
justify-content: flex-end !important;
}
.justify-content-xl-between {
justify-content: space-between !important;
}
.justify-content-xl-around {
justify-content: space-around !important;
}
.justify-content-xl-evenly {
justify-content: space-evenly !important;
}
.align-items-xl-center {
align-items: center !important;
}
.align-items-xl-start {
align-items: flex-start !important;
}
.align-items-xl-end {
align-items: flex-end !important;
}
.align-items-xl-stretch {
align-items: stretch !important;
}
.align-items-xl-baseline {
align-items: baseline !important;
}
.align-self-xl-center {
align-self: center !important;
}
.align-self-xl-start {
align-self: flex-start !important;
}
.align-self-xl-end {
align-self: flex-end !important;
}
.align-self-xl-stretch {
align-self: stretch !important;
}
.align-self-xl-baseline {
align-self: baseline !important;
}
.w-xl-100 {
width: 100% !important;
}
.w-xl-100vh {
height: 100vh !important;
}
.w-xl-100vw {
width: 100vw !important;
}
}
@media (min-width: 1420px) {
.container {
max-width: 1200px;
width: calc(100% - 1rem * 2);
width: calc(100% - var(--gutter-x) * 2);
}
}
@media (min-width: 576px) {
.container {
max-width: 540px;
}
}
@media (min-width: 768px) {
.container {
max-width: 720px;
}
}
@media (min-width: 992px) {
.container {
max-width: 960px;
}
}
@media (min-width: 1200px) {
.container {
max-width: 1140px;
}
}
.section-posts + .section-posts {
margin-top: 24px;
}
.section-posts .section-posts--grid {
display: grid;
grid-template-columns: 1fr;
}
.section-posts .section-posts--grid .left-col {
margin-bottom: 24px;
}
.section-posts article header {
align-items: flex-start;
display: flex;
flex-direction: column;
justify-content: center;
}
.section-posts .section-posts--header h2 {
color: #94a3b8;
color: var(--color-slate-400);
font-size: 13px;
font-weight: 700;
letter-spacing: 0.01em;
margin: 0 0 12px;
text-transform: uppercase;
}
.section-posts article a {
border-radius: 4px;
box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
display: grid;
grid-gap: 16px;
grid-template-columns: 1fr 90px;
outline: 4px solid transparent;
outline-offset: 7px;
padding: 16px;
transition-duration: 150ms;
transition-property: background-color, border-color, color, outline-offset;
transition-timing-function: ease-in-out;
}
.section-posts article:hover a {
border-color: rgba(var(--page-primary-rgb), 0.75);
outline: 4px solid rgba(var(--page-primary-rgb), 0.25);
outline-offset: 0;
}
.section-posts article + article {
margin-top: 1.25rem;
}
.section-posts article picture {
aspect-ratio: 1/1;
border-radius: 6px;
order: 2;
overflow: hidden;
}
.section-posts article picture img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.section-posts article .article-meta {
display: none;
}
.section-posts article h3 {
font-weight: 600;
-webkit-hyphens: auto;
hyphens: auto;
-webkit-line-clamp: 3;
line-height: 1.125;
width: 100%;
}
.section-posts article h3,.section-posts article p {
-webkit-box-orient: vertical;
display: -webkit-box;
font-size: 16px;
margin-top: 6px;
overflow: hidden;
}
.section-posts article p {
color: #475569;
color: var(--color-slate-600);
display: none;
-webkit-line-clamp: 2;
line-height: 1.333;
text-wrap: balance;
}
.section-posts [data-loadmore] {
align-items: center;
background-color: white;
background-image: linear-gradient(rgba(var(--page-primary-rgb), 0.01), rgba(var(--page-primary-rgb), 0.03));
border: 0;
border: 1px solid rgba(var(--page-primary-rgb), 0.35);
border-radius: 6px;
border-radius: 0.85em;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
color: #80bdff;
color: var(--page-primary-hex);
cursor: pointer;
display: flex;
font-size: 1rem;
font-weight: 600;
height: 60px;
justify-content: center;
justify-content: center;
line-height: 1.2;
margin: 0.25rem;
margin: auto;
margin: 3.563rem auto 0;
max-width: 330px;
outline: 0.35em solid rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
overflow: hidden;
padding: 0.25rem 0.5rem;
position: relative;
text-decoration: none;
transition-duration: 150ms;
transition-property: outline-offset, outline-color, border-color, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
width: 100%;
}
.section-posts [data-loadmore] span {
position: relative;
top: 0;
transition-duration: 150ms;
}
.section-posts [data-loadmore]:hover {
transform: scaleY(1.01) scaleX(1.01);
}
.section-posts [data-loadmore]:hover,
.section-posts [data-loadmore]:focus {
border-color: rgba(var(--page-primary-rgb), 0.5);
outline-color: rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
}
.section-posts [data-loadmore]:active,.section-posts [data-loadmore]:not(.is-loading) {
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.85em;
}
.section-posts [data-loadmore]:active span {
top: -1px;
}
.section-posts [data-loadmore].is-loading {
filter: grayscale(100%);
}
.section-posts [data-loadmore][aria-hidden=true] {
display: none;
}
@media (min-width: 1100px) {
.section-posts .section-posts--grid.size-lg {
grid-gap: 1rem;
grid-template-columns: 1fr 425px;
}
.section-posts .section-posts--grid.size-sm {
grid-gap: 1rem;
grid-template-columns: repeat(3, 1fr);
}
.section-posts .section-posts--grid.size-sm article {
margin-bottom: 0;
margin-top: 0;
}
.section-posts .left-col article {
height: 100%;
}
.section-posts .left-col article a {
display: flex;
flex-direction: column;
min-height: 100%;
}
.section-posts .left-col picture {
aspect-ratio: 3/2;
order: -1;
}
.section-posts .left-col article h3 {
font-size: 24px;
text-wrap: normal;
}
.section-posts .left-col article p {
font-size: 18px;
text-wrap: normal;
}
.section-posts .section-posts--grid .left-col {
margin-bottom: 0;
}
}
@keyframes counterShadowIn {
0% {
opacity: 0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1;
}
}
[data-gradient] {
display: grid;
grid-template-columns: 1fr;
height: 100%;
left: 50%;
pointer-events: none;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 200%;
z-index: -1;
}
[data-gradient] > div {
filter: blur(30px);
isolation: isolate;
opacity: 0.25;
position: relative;
}
[data-gradient] > div > div {
--background: radial-gradient(farthest-side, rgba(var(--color-rgb), var(--color-opacity)), transparent);
background-image: var(--background);
content: "";
height: var(--height);
left: var(--left);
position: absolute;
top: var(--top);
width: var(--width);
}
[data-gradient] > div > div:nth-of-type(1) {
--top: 30%;
--left: 45%;
--width: 45%;
--height: 65%;
--color-rgb: 217, 0, 255;
--color-opacity: 0.56;
}
[data-gradient] > div > div:nth-of-type(2) {
--top: 30%;
--left: 35%;
--width: 25%;
--height: 40%;
--color-rgb: 34, 0, 255;
--color-opacity: 0.2;
mix-blend-mode: multiply;
}
[data-gradient] > div > div:nth-of-type(3) {
--top: 20%;
--left: 20%;
--width: 50%;
--height: 60%;
--color-rgb: 217, 0, 255;
--color-opacity: 0.56;
mix-blend-mode: multiply;
}
.section-counter .counter-wrapper {
position: relative;
}
.section-counter .counter-grid {
--grid-columns: 2;
--grid-gap: 1rem;
display: grid;
grid-gap: 1rem;
grid-gap: var(--grid-gap);
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(var(--grid-columns), 1fr);
}
@media (min-width: 768px) and (max-width: 1099.98px) {
.section-counter .counter-grid {
--grid-columns: 2;
}
}
@media (min-width: 1100px) and (max-width: 1379.98px) {
.section-counter .counter-grid {
--grid-columns: 3;
}
}
@media (min-width: 1380px) {
.section-counter .counter-grid {
--grid-columns: 4;
}
}
.section-counter .counter {
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.section-counter .counter .count-header {
align-items: flex-start;
display: flex;
flex-direction: column;
height: 100%;
justify-content: flex-start;
}
.section-counter .counter .count-icon {
display: none;
}
.section-counter .counter .count-number,
.section-counter .counter .count-title {
white-space: pre;
}
.section-counter .counter .count-title,
.section-counter .counter .count-excerpt {
max-width: 100%;
width: 100%;
}
.section-counter .counter .count-number {
display: inline-flex;
font: 700 calc(3.583 * 1rem) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h0);
font-weight: 600;
line-height: 1;
}
.section-counter .counter .count-number [data-counter=text] {
letter-spacing: -0.03em;
margin-left: 5px;
}
.section-counter .counter.is-animated .count-number,
.section-counter .counter.is-animating .count-number {
opacity: 1;
}
.section-counter .counter .count-title {
font-size: 1.125rem;
font-weight: 500;
line-height: 1;
margin-top: 0.5em;
position: relative;
}
.section-counter .counter .count-excerpt {
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
font-weight: 400;
line-height: 1.25;
margin-top: 0.5em;
opacity: 0.7;
}
.section-counter .counter .count-shadow {
bottom: 0;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.section-counter .counter .count-shadow::before {
background-color: var(--color-hex);
content: "";
display: none;
filter: blur(30px);
height: 35px;
left: 50%;
opacity: 0.7;
position: absolute;
top: 50px;
transform: translateX(-50%) translateY(-10px);
width: 65%;
z-index: 0;
}
.section-counter .counter[aria-hidden=false] {
display: flex;
}
.section-counter[data-style*=no-excerpt] .count-title {
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
font-weight: 500;
margin-bottom: 0 !important;
margin-top: 0 !important;
opacity: 0.65;
}
.section-counter[data-style*=no-excerpt] .count-excerpt {
display: none;
}
@media (min-width: 768px) {
.section-counter[data-style*="0"],
.section-counter[data-style*="1"],
.section-counter[data-style*="2"] {
--gutter: calc(var(--scale-p5) * 1rem);
}
.section-counter[data-style*="0"] .counter,
.section-counter[data-style*="0"] .count-header {
justify-content: center;
text-align: center;
}
.section-counter[data-style*="0"] .count-header {
align-items: center;
}
.section-counter[data-style*="1"] .counter {
align-items: center;
justify-content: center;
padding-bottom: 2rem;
padding-left: calc(1rem * 2);
padding-left: calc(var(--gutter) * 2);
padding-right: calc(1rem * 2);
padding-right: calc(var(--gutter) * 2);
padding-top: 2rem;
text-align: center;
}
.section-counter[data-style*="1"] .count-number {
margin-left: auto;
margin-right: auto;
}
.section-counter[data-style*="1"] .counter:nth-of-type(n+2) {
border-left: 1px solid #e2e8f0;
border-left: 1px solid var(--color-slate-200);
}
.section-counter[data-style*="1"] .counter.counter-first {
border-left: 0px;
}
.section-counter[data-style*="2"] .count-shadow::before {
display: block;
}
.section-counter[data-style*="2"] .counter {
padding: 0;
width: 100%;
}
.section-counter[data-style*="2"] .count-header {
background-color: white;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 8px;
padding: 1rem 1.563rem 1rem;
position: relative;
width: 100%;
z-index: 1;
}
.section-counter[data-style*="2"] .count-number {
font: 700 calc(2.986 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h1);
font-weight: 600;
line-height: 1;
}
.section-counter[data-style*="2"] .count-title {
margin-bottom: 0;
margin-top: 0.825em;
}
.section-counter[data-style*="3"] .counter {
padding: 0;
width: 100%;
}
.section-counter[data-style*="3"] .count-header {
background-color: white;
border: 1px solid rgba(var(--color-rgb), 0.25);
border-radius: 8px;
padding: 1rem 1.563rem 1rem;
position: relative;
width: 100%;
z-index: 1;
}
.section-counter[data-style*="3"] .count-number {
font: 700 calc(2.986 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h1);
font-weight: 600;
line-height: 1;
}
.section-counter[data-style*="3"] .count-title {
margin-bottom: 0;
margin-top: 0.825em;
}
.section-counter[data-style*="4"] .counter-grid {
grid-gap: 2rem;
}
.section-counter[data-style*="4"] .counter {
padding: 0;
width: 100%;
}
.section-counter[data-style*="4"] .count-header {
background-color: white;
background-image: linear-gradient(180deg, rgba(var(--color-rgb), 0.015) 0%, rgba(var(--color-rgb), 0.025) 100%);
border: 1px solid rgba(var(--color-rgb), 0.5);
border-radius: 8px;
outline: 0.25em solid rgba(var(--color-rgb), 0.15);
padding: 1rem 1.563rem 1rem;
padding: 1rem 1.563rem;
position: relative;
width: 100%;
z-index: 1;
}
.section-counter[data-style*="4"] .count-number {
color: rgba(var(--color-rgb), 0.75);
font: 700 calc(2.986 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h1);
font-weight: 700;
line-height: 1;
}
.section-counter[data-style*="4"] .count-title {
margin-bottom: 0.5em;
margin-top: 0.25em;
}
}
@media (min-width: 1100px) {
.section-counter[data-style*="2"] .count-number {
font: 700 calc(3.583 * 1rem) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h0);
font-weight: 600;
line-height: 1;
}
}
@media (max-width: 768px) {
.section-counter .counter .count-shadow::before {
display: block;
height: 20px;
top: 50%;
transform: scaleY(0.7) translate(-50%, -50%);
}
.section-counter .counter .count-header {
align-items: center;
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background-color: rgba(255, 255, 255, 0.8);
border: 0px solid;
border-radius: 6px;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
justify-content: center;
padding: 1rem 1.563rem;
text-align: center;
width: 100%;
z-index: 2;
}
.section-counter .counter .count-number {
font: 600 calc(2.074 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h2);
font-weight: 600;
line-height: 1;
margin-left: auto;
margin-right: auto;
}
.section-counter .counter .count-meta {
width: 100%;
}
.section-counter .counter .count-title {
font: 400 calc(1.2 * 1rem) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p-lg);
font-size: 18px;
font-weight: 500;
line-height: 1;
margin-left: auto;
margin-right: auto;
margin-top: 0.1em;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.section-counter .counter .count-excerpt {
margin-top: 0.25em;
opacity: 0.6;
}
}
@media (min-width: 768px) {
.section-counter[data-style*=w-icon] .counter {
overflow: hidden;
position: relative;
}
.section-counter[data-style*=w-icon] .count-icon {
color: var(--color-hex);
display: block;
font-size: 24px;
line-height: 1;
opacity: 0.04;
position: absolute;
right: 10%;
top: 50%;
transform: translateY(-50%) scale(10);
}
.section-counter[data-style*=dark][data-style*=w-icon] .count-icon {
color: #FFFFFF;
color: var(--color-white);
opacity: 0.04;
}
.section-counter[data-style*=dark] {
background: linear-gradient(220.55deg, #3793FF 0%, #0017E4 100%);
}
.section-counter[data-style*=dark] .counter {
color: white;
}
.section-counter[data-style*=dark] .count-header {
background-color: transparent;
}
.section-counter[data-style*=dark][data-style*="2"] .count-shadow {
display: none;
}
.section-counter[data-style*=dark][data-style*="2"] .count-header {
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background-color: rgba(255, 255, 255, 0.2);
border-color: rgba(255, 255, 255, 0.1);
}
.section-counter[data-style*=dark][data-style*="2"] .count-number {
font-weight: 600;
}
.section-counter[data-style*=dark][data-style*="2"] .count-title {
font-weight: 500;
}
.section-counter[data-style*=dark][data-style*="3"] .count-shadow {
display: none;
}
.section-counter[data-style*=dark][data-style*="3"] .count-header {
-webkit-backdrop-filter: blur(40px);
backdrop-filter: blur(40px);
background-color: rgba(255, 255, 255, 0.1);
border-color: rgba(255, 255, 255, 0.2);
}
.section-counter[data-style*=dark][data-style*="3"] .count-shadow::before {
display: block;
opacity: 0.4;
z-index: 2;
}
}
.manual .count-icon {
-webkit-background-clip: text;
background-image: linear-gradient(45deg, #E0F7FA 10%, #C5CAE9 20%, #7E57C2 40%, #EDE7F6 150%);
display: block;
font-size: 19px;
line-height: 1;
mix-blend-mode: darken;
opacity: 0.07;
position: absolute;
right: 3rem;
-webkit-text-fill-color: transparent;
top: 50%;
transform: translateY(-50%) scale(12);
z-index: -1;
}
.manual .count-header {
padding: 1rem 1.563rem;
width: 100%;
}
.section-counter {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
position: relative;
}
.pagination-container {
margin-top: calc(1.44 * 1rem);
margin-top: calc(var(--scale-p3) * 1rem);
position: relative;
}
.pagination-container ul {
align-items: center;
display: flex;
gap: 0.5rem;
justify-content: center;
list-style: none;
margin: 0;
padding: 0;
}
.pagination-container ul li {
align-items: center;
display: block;
justify-content: center;
}
.pagination-container button {
align-items: center;
background-color: #e2e8f0;
background-color: var(--color-slate-200, #eaebed);
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200, #eaebed);
border-radius: 4px;
display: inline-flex;
height: 12px;
justify-content: center;
outline-color: transparent;
outline-offset: 4px;
outline-style: solid;
outline-width: 2px;
position: relative;
text-align: center;
transition-duration: 100ms;
transition-property: outline-color, outline-offset, background-color, border-color;
width: 12px;
}
@media (max-width: 768px) {
.pagination-container button {
outline-width: 2px;
}
}
.pagination-container button:hover,
.pagination-container button:focus {
background-color: #cbd5e1;
background-color: var(--color-slate-300, #d1d4d6);
outline-color: #f1f5f9;
outline-color: var(--color-slate-100, #f7f8f9);
outline-offset: 0px;
}
.pagination-container button:focus {
border-color: #FFFFFF;
border-color: var(--color-white, #fff);
outline-color: #0f172a;
outline-color: var(--color-slate-900, #1d1e1f);
}
.pagination-container button:focus,.pagination-container button.is-active {
background-color: #0f172a;
background-color: var(--color-slate-900, #1d1e1f);
}
.pagination-container button.is-active {
border-color: #0f172a;
border-color: var(--color-slate-900, #1d1e1f);
outline-color: transparent;
}
.pagination-container button.is-active:focus {
border-color: #FFFFFF;
border-color: var(--color-white, #fff);
}
.large-pullquote {
--gutter: calc(var(--scale-p2) * 1rem);
--bg: var(--page-primary-rgb-lighter);
--fill: var(--page-secondary-rgb);
--border: var(--page-primary-rgb);
--color: var(--color-slate-900);
--icon: var(--page-secondary-rgb);
--title: var(--type-h1);
--subtitle: var(--type-p-lg);
--border: var(--page-primary-rgb);
--marker-color-initial: initial;
--marker-color-animated: initial;
--marker-bg-color1: var(--page-secondary-rgb);
--marker-bg-color2: var(--page-secondary-rgb);
--marker-bg-color3: var(--page-secondary-rgb);
--marker-opacity1: .3;
--marker-opacity2: .3;
--marker-opacity3: .3;
--marker-bg: linear-gradient(90deg, rgba(var(--marker-bg-color1), var(--marker-opacity1)) 11%, rgba(var(--marker-bg-color2), var(--marker-opacity2)) 30%, rgba(var(--marker-bg-color3), var(--marker-opacity3)) 50%, rgba(255, 255, 255, 0) 50%);
--bg-gradient: linear-gradient(to bottom, rgba(var(--bg), .01), rgba(var(--bg), .05), rgba(var(--bg), .01));
display: grid;
grid-template-columns: 1fr;
margin-left: auto;
margin-right: auto;
position: relative;
}
@media (min-width: 1380px) {
.large-pullquote.w-img {
grid-template-columns: 1fr;
}
}
.large-pullquote__icon {
color: rgba(var(--icon), 1);
font-size: 34px;
left: 50%;
position: absolute;
top: 1rem;
transform: translateX(-50%);
z-index: 2;
}
@media (min-width: 992px) {
.large-pullquote__icon {
font-size: 34px;
top: 2rem;
}
}
.large-pullquote__gradient {
content: "";
height: 100%;
left: -201px;
opacity: 0.5;
pointer-events: none;
position: absolute;
top: 0;
transform: rotate(30deg);
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 50%;
z-index: 0;
}
.large-pullquote__gradient svg {
display: block;
height: 100%;
width: 100%;
}
.large-pullquote__image {
aspect-ratio: 1/1;
border-radius: 8px;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
display: block;
max-width: 200px;
position: relative;
top: 50%;
transform: translateY(-50%);
z-index: 2;
}
@media (max-width: 992px) {
.large-pullquote__image {
border: 3px solid rgba(var(--border), 0.3);
border-radius: 999em;
height: 60px;
max-width: 60px;
overflow: hidden;
position: absolute;
right: 30px;
top: 30px;
}
}
.large-pullquote__image img {
border-radius: 8px;
display: block;
height: 100%;
margin: auto;
min-height: 100%;
min-width: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.large-pullquote__logo {
display: none;
margin-top: calc(1rem * 2);
margin-top: calc(var(--gutter) * 2);
max-width: 120px;
}
@media (min-width: 992px) {
.large-pullquote__logo {
display: none;
}
}
.large-pullquote__logo img {
display: block;
height: 100%;
margin: auto;
min-height: 100%;
min-width: 100%;
-o-object-fit: contain;
object-fit: contain;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.large-pullquote__logo img.img-square,
.large-pullquote__logo img[data-img-format=square] {
display: block;
height: 30px;
max-width: 30px;
width: 30px;
}
.large-pullquote__logo img.img-landscape,
.large-pullquote__logo img[data-img-format=landscape] {
}
@media (min-width: 992px) {
.large-pullquote__logo {
max-width: 160px;
}
}
.large-pullquote__inner {
align-items: flex-start;
background-color: white;
display: flex;
flex-direction: column;
/* background-image: var(--bg-gradient); */
height: -moz-max-content;
height: max-content;
justify-content: space-between;
min-height: -moz-min-content;
min-height: min-content;
position: relative;
z-index: 1;
}
.large-pullquote:not(.w-img) .large-pullquote__inner {
height: 100%;
}
@media (min-width: 992px) {
.large-pullquote__inner {
padding: calc(1rem * 3) calc(1rem * 3);
padding: calc(var(--gutter) * 3) calc(var(--gutter) * 3);
}
}
.large-pullquote .large-pullquote__inner {
background-color: #FFFFFF;
background-color: var(--color-white);
background-image: linear-gradient(to left, white 25%, rgba(var(--page-primary-rgb), 0.02) 100%);
border: 1px solid rgba(var(--page-primary-rgb), 0.2);
border-radius: 8px;
padding: 1.25rem;
}
@media (min-width: 992px) {
.large-pullquote .large-pullquote__inner {
border: 1px solid rgba(var(--page-primary-rgb), 0.2);
padding: calc(1rem * 2.5) calc(1rem * 2.5) calc(1rem * 2.5);
padding: calc(var(--gutter) * 2.5) calc(var(--gutter) * 2.5) calc(var(--gutter) * 2.5);
}
}
.large-pullquote__inner *::-moz-selection {
background: rgba(var(--page-primary-rgb), 0.15);
color: #0f172a;
color: var(--color-slate-900);
}
.large-pullquote__inner *::selection {
background: rgba(var(--page-primary-rgb), 0.15);
color: #0f172a;
color: var(--color-slate-900);
}
.large-pullquote__content {
color: var(--color);
line-height: 1.44;
line-height: var(--scale-p3);
text-wrap: pretty;
}
.large-pullquote__content p {
font: var(--type-h4);
font-weight: 500;
}
@media (min-width: 992px) {
.large-pullquote__content p {
font: 600 calc(2.074 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h2);
font-weight: 600;
}
}
@media (min-width: 1100px) {
.large-pullquote__content p {
font: 700 calc(2.986 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h1);
font-weight: 600;
}
}
.large-pullquote__content mark {
background-color: transparent;
background-color: none;
background-image: var(--marker-bg);
background-size: 200% 100%;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
color: var(--marker-color-initial);
position: relative;
transition-duration: 250ms;
transition-property: background-image, background-position;
will-change: background-image, background-position;
}
.large-pullquote__credits {
align-items: flex-start;
color: var(--color);
display: flex;
flex-direction: column;
font: var(--type-p-sm);
justify-content: flex-start;
margin-top: 1rem;
margin-top: var(--gutter);
}
.large-pullquote__credits .large-pullquote__author {
font-size: 16px;
font-weight: 500;
line-height: 1;
}
.large-pullquote__credits .large-pullquote__role {
color: #64748b;
color: var(--color-slate-500);
font-size: 14px;
font-weight: 500;
line-height: 1.563;
margin-top: 5px;
}
@media (min-width: 992px) {
.large-pullquote__credits .large-pullquote__author {
font-size: 1.25rem;
}
.large-pullquote__credits .large-pullquote__role {
font-size: 1rem;
}
.large-pullquote__credits {
flex-direction: row;
}
}
@media (min-width: 992px) {
}
.large-pullquote__credits {
margin: calc(1 * 1rem) 0 0;
margin: calc(var(--scale-p1) * 1rem) 0 0;
}
/* Image */
.large-pullquote.w-img .large-pullquote__icon,
.large-pullquote.w-img .large-pullquote__image {
display: none;
}
.large-pullquote.w-img .large-pullquote__thumbnail {
border: 1px solid rgba(var(--border), 0.35);
border-radius: 999em;
height: 50px;
outline: 2px solid rgba(var(--border), 0.15);
overflow: hidden;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 50px;
}
@media (min-width: 1100px) {
.large-pullquote.w-img .large-pullquote__thumbnail {
height: 80px;
width: 80px;
}
}
.large-pullquote.w-img .large-pullquote__thumbnail img {
display: block;
height: 100%;
min-width: 100%;
-o-object-fit: cover;
object-fit: cover;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.large-pullquote__logo img.img-square,
.large-pullquote__logo img[data-img-format=square] {
height: 45px;
max-width: 45px;
width: 45px;
}
.large-pullquote.w-img .large-pullquote__logo {
display: none;
margin: 0 0 calc(2.986 * 1rem);
margin: 0 0 calc(var(--scale-p7) * 1rem);
order: -1;
}
@media (max-width: 992px) {
.large-pullquote.w-img .large-pullquote__logo {
display: none;
}
}
.large-pullquote__logo img.img-portrait,
.large-pullquote__logo img[data-img-format=portrait] {
height: auto;
max-width: 55px;
min-width: 55px;
}
.large-pullquote__logo img.img-landscape,
.large-pullquote__logo img[data-img-format=landscape] {
height: auto;
max-width: 120px;
min-width: 90px;
}
.large-pullquote.w-img .large-pullquote__logo img {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
width: 100%;
}
.large-pullquote.w-img .large-pullquote__credits {
align-items: center;
display: grid;
grid-gap: calc(1 * 1rem);
grid-gap: calc(var(--scale-p1) * 1rem);
grid-template-columns: auto 1fr;
margin-top: calc(5.16 * 1rem);
margin-top: calc(var(--scale-p10) * 1rem);
}
.large-pullquote.w-img .large-pullquote__text {
display: flex;
flex-direction: column;
}
@media (max-width: 992px) {
.large-pullquote__logo img.img-square {
height: 30px;
max-width: 30px;
width: 30px;
}
.large-pullquote.w-img .large-pullquote__credits {
margin-top: calc(2.074 * 1rem);
margin-top: calc(var(--scale-p5) * 1rem);
}
}
.large-pullquote:not(.w-img) {
grid-template-columns: 1fr;
text-align: center;
}
.large-pullquote:not(.w-img) .large-pullquote__gradient,.large-pullquote:not(.w-img) .large-pullquote__image {
display: none;
}
.large-pullquote:not(.w-img) .large-pullquote__credits {
margin-top: 40px;
}
@media (min-width: 992px) {
.large-pullquote:not(.w-img) .large-pullquote__credits {
margin-top: 120px;
}
}
.large-pullquote:not(.w-img) .large-pullquote__text {
align-items: flex-start;
display: flex;
flex-direction: column;
gap: 6px;
justify-content: flex-start;
}
.large-pullquote:not(.w-img) .large-pullquote__content {
text-align: left;
}
.large-pullquote:not(.w-img) .large-pullquote__logo {
margin-bottom: 120px;
margin-top: 0;
order: -1;
}
@media (max-width: 992px) {
.large-pullquote__content p {
font: var(--type-h4);
font-size: 18px;
font-weight: 500;
line-height: 1.44;
line-height: var(--scale-p3);
}
}
@media (min-width: 992px) {
.large-pullquote__content {
font: 600 calc(2.074 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h2);
font-weight: 600;
line-height: 1.44;
line-height: var(--scale-p3);
}
}
@media (min-width: 1380px) {
.large-pullquote__content {
font-weight: 600;
}
.large-pullquote__credits {
font: var(--subtitle);
}
}
/**
* Swiper 11.1.3
* Most modern mobile touch slider and framework with hardware accelerated transitions
* https://swiperjs.com
*
* Copyright 2014-2024 Vladimir Kharlampidi
*
* Released under the MIT License
*
* Released on: May 13, 2024
*/
@font-face {
font-family: swiper-icons;
font-style: normal;
font-weight: 400;
src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");
}
:root {
--swiper-theme-color: #007aff ;
}
:host {
display: block;
margin-left: auto;
margin-right: auto;
position: relative;
z-index: 1;
}
.swiper {
display: block;
list-style: none;
margin-left: auto;
margin-right: auto;
overflow: hidden;
padding: 0;
position: relative;
z-index: 1;
}
.swiper-vertical > .swiper-wrapper {
flex-direction: column;
}
.swiper-wrapper {
box-sizing: content-box;
display: flex;
height: 100%;
position: relative;
transition-property: transform;
transition-timing-function: ease;
transition-timing-function: initial;
transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
width: 100%;
z-index: 1;
}
.swiper-android .swiper-slide,
.swiper-ios .swiper-slide,
.swiper-wrapper {
transform: translate3d(0px, 0, 0);
}
.swiper-horizontal {
touch-action: pan-y;
}
.swiper-vertical {
touch-action: pan-x;
}
.swiper-slide {
display: block;
flex-shrink: 0;
height: 100%;
position: relative;
transition-property: transform;
width: 100%;
}
.swiper-slide-invisible-blank {
visibility: hidden;
}
.swiper-autoheight,
.swiper-autoheight .swiper-slide {
height: auto;
}
.swiper-autoheight .swiper-wrapper {
align-items: flex-start;
transition-property: transform, height;
}
.swiper-backface-hidden .swiper-slide {
backface-visibility: hidden;
transform: translateZ(0);
}
.swiper-3d .swiper-wrapper,.swiper-3d .swiper-cube-shadow,
.swiper-3d .swiper-slide {
transform-style: preserve-3d;
}
.swiper-css-mode > .swiper-wrapper {
overflow: auto;
-ms-overflow-style: none;
scrollbar-width: none;
}
.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
display: none;
}
.swiper-css-mode > .swiper-wrapper > .swiper-slide {
scroll-snap-align: start start;
}
.swiper-css-mode.swiper-horizontal > .swiper-wrapper {
scroll-snap-type: x mandatory;
}
.swiper-css-mode.swiper-vertical > .swiper-wrapper {
scroll-snap-type: y mandatory;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper {
scroll-snap-type: none;
}
.swiper-css-mode.swiper-free-mode > .swiper-wrapper > .swiper-slide {
scroll-snap-align: none;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper::before {
content: "";
flex-shrink: 0;
order: 9999;
}
.swiper-css-mode.swiper-centered > .swiper-wrapper > .swiper-slide {
scroll-snap-align: center center;
scroll-snap-stop: always;
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
margin-inline-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
height: 100%;
min-height: 1px;
width: var(--swiper-centered-offset-after);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
margin-block-start: var(--swiper-centered-offset-before);
}
.swiper-css-mode.swiper-centered.swiper-vertical > .swiper-wrapper::before {
height: var(--swiper-centered-offset-after);
min-width: 1px;
width: 100%;
}
.swiper-3d .swiper-slide-shadow,
.swiper-3d .swiper-slide-shadow-bottom,
.swiper-3d .swiper-slide-shadow-left,
.swiper-3d .swiper-slide-shadow-right,
.swiper-3d .swiper-slide-shadow-top {
height: 100%;
left: 0;
pointer-events: none;
position: absolute;
top: 0;
width: 100%;
z-index: 10;
}
.swiper-3d .swiper-slide-shadow {
background: rgba(0, 0, 0, 0.15);
}
.swiper-3d .swiper-slide-shadow-left {
background-image: linear-gradient(to left, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-right {
background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-top {
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-3d .swiper-slide-shadow-bottom {
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0));
}
.swiper-lazy-preloader {
border: 4px solid #007aff ;
border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
border-radius: 50%;
border-top-color: transparent;
box-sizing: border-box;
height: 42px;
left: 50%;
margin-left: -21px;
margin-top: -21px;
position: absolute;
top: 50%;
transform-origin: 50%;
width: 42px;
z-index: 10;
}
.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,
.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader {
animation: spinAnimation 1s infinite linear;
}
.swiper-lazy-preloader-white {
--swiper-preloader-color: #fff;
}
.swiper-lazy-preloader-black {
--swiper-preloader-color: #000;
}
.swiper-virtual .swiper-slide {
-webkit-backface-visibility: hidden;
transform: translateZ(0);
}
.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
content: "";
left: 0;
pointer-events: none;
position: absolute;
top: 0;
}
.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
height: 1px;
width: var(--swiper-virtual-size);
}
.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
height: var(--swiper-virtual-size);
width: 1px;
}
:root {
--swiper-navigation-size: 20px;
}
.swiper-button-next,
.swiper-button-prev {
align-items: center;
color: #007aff ;
color: var(--swiper-navigation-color, var(--swiper-theme-color));
cursor: pointer;
display: flex;
height: 20px;
height: var(--swiper-navigation-size);
justify-content: center;
margin-top: calc(0px - 20px / 2);
margin-top: calc(0px - var(--swiper-navigation-size) / 2);
top: 50%;
top: var(--swiper-navigation-top-offset, 50%);
width: calc(20px / 44 * 27);
width: calc(var(--swiper-navigation-size) / 44 * 27);
z-index: 10;
}
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
cursor: auto;
opacity: 0.35;
pointer-events: none;
}
.swiper-button-next.swiper-button-hidden,
.swiper-button-prev.swiper-button-hidden {
cursor: auto;
opacity: 0;
pointer-events: none;
}
.swiper-navigation-disabled .swiper-button-next,
.swiper-navigation-disabled .swiper-button-prev {
display: none !important;
}
.swiper-button-next svg,
.swiper-button-prev svg {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
transform-origin: center;
width: 100%;
}
.swiper-rtl .swiper-button-next svg,
.swiper-rtl .swiper-button-prev svg {
transform: rotate(180deg);
}
.swiper-button-prev,
.swiper-rtl .swiper-button-next {
left: 10px;
left: var(--swiper-navigation-sides-offset, 10px);
right: auto;
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
left: auto;
right: 10px;
right: var(--swiper-navigation-sides-offset, 10px);
}
.swiper-button-lock {
display: none;
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-family: swiper-icons;
font-feature-settings: ;
font-size: 20px;
font-size: var(--swiper-navigation-size);
font-variant: normal;
font-variant: initial;
letter-spacing: 0;
line-height: 1;
text-transform: none !important;
}
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
content: "prev";
}
.swiper-button-next,
.swiper-rtl .swiper-button-prev {
left: auto;
right: 10px;
right: var(--swiper-navigation-sides-offset, 10px);
}
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
content: "next";
}
.swiper-pagination {
transition: 0.3s opacity;
z-index: 10;
}
.swiper-pagination.swiper-pagination-hidden {
opacity: 0;
}
.swiper-pagination-disabled > .swiper-pagination,
.swiper-pagination.swiper-pagination-disabled {
display: none !important;
}
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
bottom: 8px;
bottom: var(--swiper-pagination-bottom, 8px);
left: 0;
top: auto;
top: var(--swiper-pagination-top, auto);
width: 100%;
}
.swiper-pagination-bullets-dynamic {
font-size: 0;
overflow: hidden;
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
position: relative;
transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active,.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
transform: scale(1);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
transform: scale(0.33);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
transform: scale(0.66);
}
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
transform: scale(0.33);
}
.swiper-pagination-bullet {
background: #000;
background: var(--swiper-pagination-bullet-inactive-color, #000);
border-radius: 50%;
border-radius: var(--swiper-pagination-bullet-border-radius, 50%);
display: inline-block;
height: 8px;
height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
opacity: 0.2;
opacity: var(--swiper-pagination-bullet-inactive-opacity, 0.2);
width: 8px;
width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
}
button.swiper-pagination-bullet {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
box-shadow: none;
margin: 0;
padding: 0;
}
.swiper-pagination-clickable .swiper-pagination-bullet {
cursor: pointer;
}
.swiper-pagination-bullet:only-child {
display: none !important;
}
.swiper-pagination-bullet-active {
background: #007aff ;
background: var(--swiper-pagination-color, var(--swiper-theme-color));
opacity: 1;
opacity: var(--swiper-pagination-bullet-opacity, 1);
}
.swiper-pagination-vertical.swiper-pagination-bullets,
.swiper-vertical > .swiper-pagination-bullets {
left: auto;
left: var(--swiper-pagination-left, auto);
right: 8px;
right: var(--swiper-pagination-right, 8px);
top: 50%;
transform: translate3d(0px, -50%, 0);
}
.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
display: block;
margin: 6px 0;
margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
top: 50%;
transform: translateY(-50%);
width: 8px;
}
.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
display: inline-block;
transition: 0.2s transform, 0.2s top;
}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
margin: 0 4px;
margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px);
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
left: 50%;
transform: translateX(-50%);
white-space: nowrap;
}
.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
transition: 0.2s transform, 0.2s left;
}
.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
transition: 0.2s transform, 0.2s right;
}
.swiper-pagination-fraction {
color: inherit;
color: var(--swiper-pagination-fraction-color, inherit);
}
.swiper-pagination-progressbar {
background: rgba(0, 0, 0, 0.25);
background: var(--swiper-pagination-progressbar-bg-color, rgba(0, 0, 0, 0.25));
position: absolute;
}
.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
background: #007aff ;
background: var(--swiper-pagination-color, var(--swiper-theme-color));
height: 100%;
left: 0;
position: absolute;
top: 0;
transform: scale(0);
transform-origin: left top;
width: 100%;
}
.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
transform-origin: right top;
}
.swiper-horizontal > .swiper-pagination-progressbar,
.swiper-pagination-progressbar.swiper-pagination-horizontal,
.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
height: 4px;
height: var(--swiper-pagination-progressbar-size, 4px);
left: 0;
top: 0;
width: 100%;
}
.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,
.swiper-pagination-progressbar.swiper-pagination-vertical,
.swiper-vertical > .swiper-pagination-progressbar {
height: 100%;
left: 0;
top: 0;
width: 4px;
width: var(--swiper-pagination-progressbar-size, 4px);
}
.swiper-pagination-lock {
display: none;
}
.swiper-scrollbar {
background: rgba(0, 0, 0, 0.1);
background: var(--swiper-scrollbar-bg-color, rgba(0, 0, 0, 0.1));
border-radius: 10px;
border-radius: var(--swiper-scrollbar-border-radius, 10px);
position: relative;
touch-action: none;
}
.swiper-scrollbar-disabled > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-disabled {
display: none !important;
}
.swiper-horizontal > .swiper-scrollbar,
.swiper-scrollbar.swiper-scrollbar-horizontal {
bottom: 4px;
bottom: var(--swiper-scrollbar-bottom, 4px);
height: 4px;
height: var(--swiper-scrollbar-size, 4px);
left: 1%;
left: var(--swiper-scrollbar-sides-offset, 1%);
position: absolute;
top: auto;
top: var(--swiper-scrollbar-top, auto);
width: calc(100% - 2 * 1%);
width: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
z-index: 50;
}
.swiper-scrollbar.swiper-scrollbar-vertical,
.swiper-vertical > .swiper-scrollbar {
height: calc(100% - 2 * 1%);
height: calc(100% - 2 * var(--swiper-scrollbar-sides-offset, 1%));
left: auto;
left: var(--swiper-scrollbar-left, auto);
position: absolute;
right: 4px;
right: var(--swiper-scrollbar-right, 4px);
top: 1%;
top: var(--swiper-scrollbar-sides-offset, 1%);
width: 4px;
width: var(--swiper-scrollbar-size, 4px);
z-index: 50;
}
.swiper-scrollbar-drag {
background: rgba(0, 0, 0, 0.5);
background: var(--swiper-scrollbar-drag-bg-color, rgba(0, 0, 0, 0.5));
border-radius: 10px;
border-radius: var(--swiper-scrollbar-border-radius, 10px);
height: 100%;
left: 0;
position: relative;
top: 0;
width: 100%;
}
.swiper-scrollbar-cursor-drag {
cursor: move;
}
.swiper-scrollbar-lock {
display: none;
}
.swiper-zoom-container {
align-items: center;
display: flex;
height: 100%;
justify-content: center;
text-align: center;
width: 100%;
}
.swiper-zoom-container > canvas,
.swiper-zoom-container > img,
.swiper-zoom-container > svg {
max-height: 100%;
max-width: 100%;
-o-object-fit: contain;
object-fit: contain;
}
.swiper-slide-zoomed {
cursor: move;
touch-action: none;
}
.swiper .swiper-notification {
left: 0;
opacity: 0;
pointer-events: none;
position: absolute;
top: 0;
z-index: -1000;
}
.swiper-free-mode > .swiper-wrapper {
margin: 0 auto;
transition-timing-function: ease-out;
}
.swiper-grid > .swiper-wrapper {
flex-wrap: wrap;
}
.swiper-grid-column > .swiper-wrapper {
flex-direction: column;
flex-wrap: wrap;
}
.swiper-fade.swiper-free-mode .swiper-slide {
transition-timing-function: ease-out;
}
.swiper-fade .swiper-slide {
pointer-events: none;
transition-property: opacity;
}
.swiper-fade .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-fade .swiper-slide-active,.swiper-fade .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-cube {
overflow: visible;
}
.swiper-cube .swiper-slide {
backface-visibility: hidden;
height: 100%;
pointer-events: none;
transform-origin: 0 0;
visibility: hidden;
width: 100%;
z-index: 1;
}
.swiper-cube .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-cube.swiper-rtl .swiper-slide {
transform-origin: 100% 0;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-cube .swiper-slide-active,
.swiper-cube .swiper-slide-next,
.swiper-cube .swiper-slide-prev {
pointer-events: auto;
visibility: visible;
}
.swiper-cube .swiper-cube-shadow {
bottom: 0px;
height: 100%;
left: 0;
opacity: 0.6;
position: absolute;
width: 100%;
z-index: 0;
}
.swiper-cube .swiper-cube-shadow:before {
background: #000;
bottom: 0;
content: "";
filter: blur(50px);
left: 0;
position: absolute;
right: 0;
top: 0;
}
.swiper-cube .swiper-slide-next + .swiper-slide {
pointer-events: auto;
visibility: visible;
}
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,
.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top {
backface-visibility: hidden;
z-index: 0;
}
.swiper-flip {
overflow: visible;
}
.swiper-flip .swiper-slide {
backface-visibility: hidden;
pointer-events: none;
z-index: 1;
}
.swiper-flip .swiper-slide .swiper-slide {
pointer-events: none;
}
.swiper-flip .swiper-slide-active,
.swiper-flip .swiper-slide-active .swiper-slide-active {
pointer-events: auto;
}
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,
.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top {
backface-visibility: hidden;
z-index: 0;
}
.swiper-creative .swiper-slide {
backface-visibility: hidden;
overflow: hidden;
transition-property: transform, opacity, height;
}
.swiper-cards {
overflow: visible;
}
.swiper-cards .swiper-slide {
backface-visibility: hidden;
overflow: hidden;
transform-origin: center bottom;
}
.stacked-cards {
--gx: calc(var(--scale-p1) * 1rem);
--gy: calc(var(--scale-p1) * 1rem);
--pl: 130px;
align-items: flex-end;
display: flex;
margin: 0;
padding: 1rem 0 1rem;
padding: var(--gutter) 0 var(--gutter);
}
.stacked-cards * {
-webkit-user-drag: none;
user-drag: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.stacked-cards .article-meta {
align-items: center;
color: #0f172a;
color: var(--color-slate-900);
display: flex;
font-size: calc(1 * 1rem);
font-size: calc(var(--scale-p1) * 1rem);
grid-gap: 6px;
line-height: 1;
margin-bottom: calc(1 * 1rem);
margin-bottom: calc(var(--scale-p1) * 1rem);
order: 2;
white-space: nowrap;
}
.stacked-cards .article-meta time {
display: none;
}
.stacked-cards .article-meta span.tag {
color: var(--color-analogous-2-500);
font-weight: 500;
}
.stacked-cards article {
background-image: linear-gradient(85deg, #f8fafc, #e2e8f0);
background-image: linear-gradient(85deg, var(--color-slate-50), var(--color-slate-200));
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 16px;
box-shadow: -2rem 0 3rem -2rem rgba(241, 245, 249, 0.75);
box-shadow: -2rem 0 3rem -2rem rgba(var(--color-slate-100-rgb), 0.75);
color: #0f172a;
color: var(--color-slate-900);
display: flex;
flex-direction: column;
height: 400px;
margin: 0;
min-width: 275px;
padding: var(--gy) var(--gx);
transition-duration: 250ms;
width: 275px;
z-index: 2;
}
.stacked-cards article:not(:first-child) {
box-shadow: -3rem 0 3rem -2rem rgba(71, 85, 105, 0.4);
box-shadow: -3rem 0 3rem -2rem rgba(var(--color-slate-600-rgb), 0.4);
margin-left: calc(var(--pl) * -1);
}
.stacked-cards article:hover, .stacked-cards article:focus-within {
transform: translateY(-1rem) rotate(3deg);
}
.stacked-cards article:hover ~ article, .stacked-cards article:focus-within ~ article {
position: relative;
transform: translateX(var(--pl));
transition-duration: 250ms;
transition-property: transform;
}
.stacked-cards article:focus-within, .stacked-cards article:hover {
border-color: var(--color-analogous-2-500);
outline: 0.25em solid rgba(var(--color-analogous-2-300-rgb), 0.25);
}
.stacked-cards article:focus-within a {
outline: 0;
}
.stacked-cards article h3 {
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
line-height: calc(1.2 * 1em);
line-height: calc(var(--scale-p2) * 1em);
margin-bottom: calc(0.402 * 1rem);
margin-bottom: calc(var(--scale-n5) * 1rem);
}
.stacked-cards article p {
-webkit-box-orient: vertical;
display: -webkit-box;
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
-webkit-line-clamp: 3;
opacity: 0.75;
overflow: hidden;
}
.stacked-cards article {
overflow: hidden;
position: relative;
}
.stacked-cards article header {
position: relative;
z-index: 1;
}
.stacked-cards article picture {
aspect-ratio: 16/9;
border-radius: 5px 5px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
display: block;
margin-bottom: calc(1 * 1rem);
margin-bottom: calc(var(--scale-p1) * 1rem);
opacity: 1;
order: -1;
overflow: hidden;
z-index: 0;
}
.stacked-cards article picture img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
}
.stacked-cards article a {
display: flex;
flex-direction: column;
}
.section-slider {
overflow-x: hidden;
}
.section-slider:nth-of-type(even) {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid var(--color-slate-200);
border-top: 1px solid #e2e8f0;
border-top: 1px solid var(--color-slate-200);
padding: 3rem 0 2rem;
}
@media (max-width: 1023.98px) {
.section-slider-container {
max-width: 100%;
}
.section-slider-container .row > .col {
padding-left: 0 !important;
padding-right: 0 !important;
}
.section-slider-container .section-slider-header {
margin-bottom: calc(1 * 1rem);
margin-bottom: calc(var(--scale-p1) * 1rem);
text-align: center;
}
}
.section-slider-grid {
display: grid;
grid-gap: 0;
grid-column-gap: calc(2.986 * 1rem);
grid-column-gap: calc(var(--scale-p7) * 1rem);
grid-template-columns: 1fr;
grid-template-rows: auto 1fr;
}
.section-slider-grid .section-slider-header h2 {
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
}
.section-slider-grid .section-slider-header p {
font-size: 1.125rem;
line-height: 1.563;
margin-left: auto;
margin-right: auto;
margin-top: calc(0.694 * 1rem);
margin-top: calc(var(--scale-n2) * 1rem);
max-width: 400px;
}
.section-slider-grid .section-slider-header p:not(:last-child) {
margin-bottom: 1rem;
}
.section-slider-grid .section-slider-header a {
align-items: center;
background: #FFFFFF;
background: var(--color-white);
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 0.375rem;
color: #0f172a;
color: var(--color-slate-900);
display: inline-flex;
font-size: 16px;
font-weight: 500;
justify-content: center;
line-height: 1;
outline: 2px solid rgba(100, 116, 139, 0);
outline: 2px solid rgba(var(--color-slate-500-rgb), 0);
outline-offset: 0.35em;
padding: calc(0.482 * 1rem) calc(0.694 * 1rem);
padding: calc(var(--scale-n4) * 1rem) calc(var(--scale-n2) * 1rem);
text-align: center;
text-decoration-line: none;
transition-duration: 100ms;
transition-property: background-color, border-color, color, outline, outline-offset;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: background-color, border-color, color, outline, outline-offset;
}
.section-slider-grid .section-slider-header a svg {
align-items: center;
display: flex;
height: 8px;
margin-left: 5px;
margin-top: 2px;
width: 8px;
}
@media (min-width: 1024px) {
.section-slider-grid {
grid-gap: calc(1 * 1rem);
grid-gap: calc(var(--scale-p1) * 1rem);
grid-template-columns: 300px 1fr;
}
.section-slider-grid .section-slider-header {
max-width: 420px;
padding-top: 0.5rem;
}
}
.section-slider-grid .carousel-slider,.carousel-slider {
display: grid;
position: relative;
}
.carousel-slider {
height: -moz-fit-content;
height: fit-content;
}
.carousel-slider--nav button {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border: 0px;
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 999em;
bottom: 130px;
color: #0f172a;
color: var(--color-slate-900);
display: flex;
height: 60px;
justify-content: center;
margin-top: -30px;
position: absolute;
top: 50%;
transform: translateY(-50%);
transition-duration: 250ms;
width: 60px;
z-index: 2;
}
.carousel-slider--nav button:first-child {
left: -32px;
}
.carousel-slider--nav button:last-child {
right: -32px;
}
@media (max-width: 1023.98px) {
.carousel-slider--nav {
display: none;
}
}
.carousel-slider--pagination {
display: flex;
grid-gap: calc(1 * 1rem);
grid-gap: calc(var(--scale-p1) * 1rem);
justify-content: center;
margin-bottom: 0;
}
.carousel-slider--pagination button {
-webkit-appearance: none;
background: transparent;
border: none;
border: 1px solid #94a3b8;
border: 1px solid var(--color-slate-400);
border-radius: 999em;
color: inherit;
content: "";
font: inherit;
height: 10px;
line-height: normal;
margin: 0;
overflow: visible;
padding: 0;
width: auto;
width: 10px;
}
.carousel-slider--pagination button.is-active {
background-color: #1e293b;
background-color: var(--color-slate-800);
border-color: #1e293b;
border-color: var(--color-slate-800);
}
.carousel-slider--pagination button[disabled] {
pointer-events: none;
}
@media (max-width: 1365.98px) {
.carousel-slider--pagination {
display: flex;
}
}
@media (min-width: 1024px) {
.carousel-slider--pagination {
display: none;
}
}
.carousel-slider--items {
--cardWidth: 280px;
display: flex;
flex-wrap: nowrap;
gap: 0;
justify-content: flex-start;
list-style: none;
-webkit-overflow-scrolling: touch;
overflow-x: scroll;
padding-bottom: 0.5rem;
padding-top: 0.5rem;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
}
.carousel-slider--items .carousel-item {
flex: 0 0 var(--cardWidth);
max-width: var(--cardWidth);
min-width: var(--cardWidth);
scroll-snap-align: center;
}
.carousel-slider--items .carousel-item--placeholder {
content: "";
display: flex;
flex: 0 0 calc(50% - var(--cardWidth) / 2);
max-width: calc(50% - var(--cardWidth) / 2);
min-width: calc(50% - var(--cardWidth) / 2);
visibility: hidden;
}
@media (min-width: 768px) {
.carousel-slider--items {
--cardWidth: 290px;
}
}
@media (min-width: 1024px) {
.carousel-slider--items {
--cardWidth: 300px;
}
.carousel-slider--items .carousel-item--placeholder {
display: none;
}
.carousel-slider--items .carousel-item {
scroll-snap-align: start;
}
}
.carousel-slider--items::-webkit-scrollbar {
display: none;
}
.carousel-slider--items.dragging {
cursor: grabbing;
}
.carousel-slider--items.dragging .carousel-item {
pointer-events: none;
}
.carousel-slider--items .carousel-item {
display: flex;
flex: 0 0 auto;
margin-right: 1rem;
margin-right: var(--gutter-x);
position: relative;
transition-duration: 300ms;
transition-property: opacity;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: opacity;
}
.carousel-slider--items .carousel-item.with-opacity,
.carousel-slider--items .carousel-item.is-partial {
opacity: 0.5;
}
@media (min-width: 1024px) {
.carousel-slider--items .carousel-item {
margin-right: var(1rem);
margin-right: var(var(--gutter-x));
}
.carousel-slider--items .carousel-item:last-child {
margin-right: 0;
}
}
@media (max-width: 1023.98px) {
.carousel-slider--items {
padding: calc(1.44 * 1rem) 0;
padding: calc(var(--scale-p3) * 1rem) 0;
}
}
.carousel-slider--items::before, .carousel-slider--items::after {
bottom: 0;
height: 100%;
opacity: 0;
pointer-events: none;
position: absolute;
top: 0;
transition-duration: 250ms;
transition-property: opacity;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 125px;
will-change: opacity;
z-index: 1;
}
.carousel-slider--items::after {
background-image: linear-gradient(to right, rgba(255, 255, 255, 0), white);
border-right: 1px solid #f1f5f9;
border-right: 1px solid var(--color-slate-100);
right: 0;
}
.carousel-slider--items::before {
background-image: linear-gradient(to right, white, rgba(255, 255, 255, 0));
border-left: 1px solid #f1f5f9;
border-left: 1px solid var(--color-slate-100);
left: 0;
}
.carousel-slider--items:not(.is-last)::after,.carousel-slider--items:not(.is-first)::before {
opacity: 1;
}
.carousel-slider--items.is-last::after,.carousel-slider--items.is-first::before {
opacity: 0;
}
.carousel-slider--items.is-first::after,.carousel-slider--items.is-last::before {
opacity: 1;
}
.carousel-slider--items .carousel-item--wrapper {
border-radius: 5px;
display: flex;
flex-direction: column;
height: 100%;
justify-content: flex-start;
width: 100%;
}
.carousel-slider--items article a {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 6px;
overflow: hidden;
-webkit-user-drag: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.carousel-slider--items article a:hover,
.carousel-slider--items article a:focus-within {
outline: 0.25em solid #007bff;
outline: 0.25em solid var(--color-primary-500);
}
.carousel-slider--items .carousel-item h3 {
font: var(--type-h4);
font-weight: 600;
}
.carousel-slider--items .article-meta {
margin-bottom: calc(1 * 1rem);
margin-bottom: calc(var(--scale-p1) * 1rem);
}
.carousel-slider--items .article-meta time {
display: none;
}
[data-type=person] .carousel-slider--items .article-meta .tag {
--tab-bg: var(--color-slate-500-rgb);
}
.carousel-slider--items .article-meta .tag {
background-color: rgba(var(--tag-bg), 0.1);
border-radius: 6px;
color: rgba(var(--tag-bg), 1);
font-size: 13px;
font-weight: 600;
padding: 3px 6px;
text-transform: uppercase;
}
.carousel-slider--items article h3,
.carousel-slider--items article h3 + p {
-webkit-box-orient: vertical;
display: -webkit-box;
overflow: hidden;
}
.carousel-slider--items article h3 {
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
font-weight: 500;
-webkit-line-clamp: 2;
margin-top: 0;
}
.carousel-slider--items article[data-type=campaign] h3,
.carousel-slider--items article[data-type=person] h3,
.carousel-slider--items article[data-type=resource] h3 {
-webkit-line-clamp: 1;
}
.carousel-slider--items article h3 + p {
color: #334155;
color: var(--color-slate-700);
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
font-weight: 400;
-webkit-line-clamp: 3;
line-height: 1.333;
margin-top: calc(0.402 * 1rem);
margin-top: calc(var(--scale-n5) * 1rem);
}
.carousel-slider--items article header {
padding: 0 calc(1.44 * 1rem) calc(1.44 * 1rem);
padding: 0 calc(var(--scale-p3) * 1rem) calc(var(--scale-p3) * 1rem);
}
.carousel-slider--items article picture {
/* min-height: 190px; */
aspect-ratio: 1/1;
border-radius: 4px 4px 0 0;
display: block;
overflow: hidden;
width: 100%;
}
.carousel-slider--items article picture:not(:first-child) {
margin-top: calc(1 * 1rem);
margin-top: calc(var(--scale-p1) * 1rem);
}
.carousel-slider--items article picture:first-child {
margin-bottom: calc(1.2 * 1rem);
margin-bottom: calc(var(--scale-p2) * 1rem);
}
.carousel-slider--items article picture img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
/* .icon-arrow {
--scale: 1;
box-sizing: border-box;
position: relative;
display: block;
transform: scale(var(--scale, 1));
width: 22px;
height: 22px;
}
.icon-arrow-right::after, .icon-arrow-right::before, .icon-arrow-left::after, .icon-arrow-left::before {
content: "";
display: block;
box-sizing: border-box;
position: absolute;
}
.icon-arrow-right::before, .icon-arrow-left::before {
width: 16px;
height: 2px;
bottom: 10px;
background: currentColor;
}
.icon-arrow-right::after, .icon-arrow-right::before {
right: 3px;
}
.icon-arrow-right::after {
width: 8px;
height: 8px;
border-top: 2px solid;
border-right: 2px solid;
transform: rotate(45deg);
bottom: 7px;
} */
.icon-arrow-left::after, .icon-arrow-left::before {
left: 3px;
}
.icon-arrow-left::after {
border-bottom: 2px solid;
border-left: 2px solid;
bottom: 7px;
height: 8px;
transform: rotate(45deg);
width: 8px;
}
.icon-spinner {
position: relative;
transform: scale(1);
transform: scale(var(--scale, 1));
}
.icon-spinner,.icon-spinner::before {
display: block;
height: 20px;
width: 20px;
}
.icon-spinner::before {
animation: spinner-alt 1s cubic-bezier(0.6, 0, 0.4, 1) infinite;
border: 3px solid transparent;
border-bottom-color: currentColor;
border-radius: 100px;
border-top-color: currentColor;
content: "";
position: absolute;
}
.carousel-slider .carousel-slider--items,
.carousel-slider .carousel-slider--nav {
opacity: 0;
}
.carousel-slider .icon-spinner {
left: 50%;
opacity: 1;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
transition-delay: 100ms;
transition-duration: 250ms;
transition-properrty: opacity;
will-change: opacity;
}
.carousel-slider.is-loaded .icon-spinner {
opacity: 0;
}
.carousel-slider.is-loaded .carousel-slider--items,
.carousel-slider.is-loaded .carousel-slider--nav {
opacity: 1;
}
.section-content--wrapper {
padding: 1.563rem 0;
}
.section-content--wrapper .section-header h2 {
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
font-weight: 600;
}
.section-content--wrapper .section-header p {
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
font-size: 16px;
margin-bottom: 1.563rem;
}
.section-component--grid {
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
}
@media (min-width: 768px) and (max-width: 1023.98px) {
.section-component--grid {
grid-gap: 1rem;
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1024px) {
.section-component--grid {
grid-gap: 1rem;
grid-template-columns: repeat(3, 1fr);
}
}
.post-item__wrapper {
--g: 1rem;
background-color: white;
display: flex;
flex-direction: column;
gap: 0;
}
.post-item__wrapper header {
display: flex;
flex: 1 1;
flex-direction: column;
gap: 0;
min-height: 90px;
position: relative;
}
.post-item__wrapper header,
.post-item__wrapper footer {
padding-left: var(--g);
padding-right: var(--g);
}
.post-item__wrapper header {
padding-top: var(--g);
}
.post-item__wrapper footer {
margin-top: calc(var(--g) * 2);
padding-bottom: var(--g);
}
.post-item__icon {
align-items: center;
border-radius: 3px;
bottom: var(--g);
display: flex;
justify-content: center;
position: absolute;
right: var(--g);
transform: scale(0) rotate(0deg);
transition-duration: 250ms;
transition-property: transform, right, top, color;
will-change: transform, right, top, color;
}
.post-item:hover .post-item__icon,
.post-item:focus .post-item__icon,
.post-item:focus-within .post-item__icon {
color: #334155;
color: var(--color-slate-700);
transform: scale(1) rotate(90deg);
}
.post-item__icon svg {
display: block;
height: 14px;
width: 14px;
}
.post-item header p {
color: #6c757d;
color: var(--color-grey);
margin-top: 1rem;
}
.post-item {
background-image: linear-gradient(to bottom, rgba(var(--color-rgb), 0.085) 20%, white);
border-radius: 6px;
box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
outline-color: transparent;
outline-offset: 0.35em;
outline-style: solid;
outline-width: 0.35em;
overflow: hidden;
padding: 0;
position: relative;
transform: scale(1);
transition-duration: 100ms;
transition-property: background-color, border-color, color, outline, outline-offset, transform;
will-change: background-color, border-color, color, outline, outline-offset, transform;
}
.post-item:active {
transform: scale(0.98);
}
.post-item .post-picture--thumbnail {
background-color: white;
border-radius: 0;
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.post-item .post-picture--thumbnail img {
display: block;
transform: scale(1);
transition-duration: 250ms;
transition-property: transform;
will-change: transform;
}
.post-item:hover .post-picture--thumbnail img,
.post-item:focus .post-picture--thumbnail img,
.post-item:focus-within .post-picture--thumbnail img {
transform: scale(1.03);
}
.post-item .post-picture--logo {
/* border-radius: 8px; */
aspect-ratio: 16/9;
overflow: hidden;
position: relative;
}
.post-item .post-picture--logo .logo-image {
background-position: center;
background-repeat: no-repeat;
background-size: 50%;
height: 100%;
left: 50%;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
/* background-color: white; */
width: 100%;
}
.post-item .post-picture--logo[data-shape=horizontal] .logo-image,
.post-item .post-picture--logo[data-shape=vertical] .logo-image,
.post-item .post-picture--logo[data-shape=rectangle] .logo-image,
.post-item .post-picture--logo[data-shape=square] .logo-image {
background-size: cover;
}
.post-item a {
display: block;
}
.post-item a:focus {
outline: none;
}
.post-item picture,
.post-item figure {
aspect-ratio: 1/1;
display: block;
}
.post-item picture img,
.post-item figure img {
display: block;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.post-item header h3,
.post-item header h2 {
align-items: center;
display: inline-flex;
font: var(--type-h4);
font-weight: 700;
margin-top: 0;
}
.post-item header h2 i,
.post-item header h3 i {
color: #007bff;
color: var(--color-primary-500);
font-size: 90%;
margin-left: 0.25em;
}
.post-item[data-type=partner] header h3 i {
color: gold;
}
.post-item[data-type=person] header h3 i {
color: #007bff;
color: var(--color-primary-500);
}
.post-item[data-type=person] header,
.post-item[data-type=partner] header {
display: flex;
flex-direction: column;
}
.post-item[data-type=person] header h3 {
order: 0;
}
.post-item[data-type=person] header .post-item__meta {
order: 1;
}
.post-item[data-type=person] header .post-item__meta [itemprop=role],
.post-item[data-type=partner] header .post-item__meta {
color: #6c757d;
color: var(--color-grey);
font-size: 16px;
font-weight: 500;
margin-bottom: 1rem;
margin-top: 0.5rem;
}
.post-item[data-type=person] header p {
order: 2;
}
.post-item[data-type=partner] header h3 {
order: 0;
}
.post-item[data-type=partner] header .post-item__meta {
order: 1;
}
.post-item[data-type=partner] header p {
order: 2;
}
.post-item header p {
-webkit-box-orient: vertical;
display: -webkit-box;
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
-webkit-line-clamp: 2;
overflow: hidden;
text-wrap: balance;
}
.post-item[data-type=person] header p {
-webkit-line-clamp: 3;
}
.post-item .post-item__meta {
align-items: center;
display: flex;
justify-content: space-between;
}
.post-item[data-type=campaign] .post-item__meta,
.post-item[data-type=post] .post-item__meta {
margin-top: 0.5rem;
}
.post-item .post-item__meta .date {
display: none;
}
.post-item .post-item__meta .tag {
background-color: rgba(var(--color-rgb), 0.09);
border-radius: 7px;
color: var(--color-dark-hex);
font-size: 13px;
font-weight: 500;
line-height: 1;
padding: 4px 5px;
align-items: center;
display: flex;
}
.post-item .post-item__meta .tag svg {
display: block;
height: 1em;
margin-right: 0.25em;
width: 1em;
}
body[data-template-type=blog] .post-item .post-item__meta .tag {
display: none;
}
.post-item .post-item__link {
position: relative;
}
.post-item .read-more {
color: #64748b;
color: var(--color-slate-500);
display: inline-flex;
font-weight: 500;
justify-content: center;
line-height: 1.5;
position: relative;
text-align: center;
text-decoration-line: none;
transition-duration: 100ms;
transition-property: background-color, border-color, color, outline, outline-offset;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: pre;
will-change: background-color, border-color, color, outline, outline-offset;
}
.post-item .read-more::before,
.post-item .read-more::after {
background: currentColor;
bottom: 0;
content: "";
display: block;
height: 1.5px;
left: 0;
pointer-events: none;
position: absolute;
width: 100%;
}
.post-item .read-more::before {
opacity: 0.25;
}
.post-item .read-more::after {
background-color: rgba(var(--color-rgb), 0);
pointer-events: none;
transform: scaleX(0);
transform-origin: left;
transition: transform 400ms ease, background-color 400ms ease;
will-change: transform, background-color;
}
.post-item:hover,
.post-item:focus,
.post-item:focus-within {
border-color: rgba(var(--color-rgb), 0.5);
outline: 0.35em solid rgba(var(--color-rgb), 0.25);
outline-offset: 0;
}
.post-item .read-more,
.post-item:hover .read-more {
color: #0f172a;
color: var(--color-slate-900);
}
.post-item .read-more::after {
transform: scaleX(0);
}
.post-item:hover .read-more::after {
background-color: rgba(var(--color-rgb), 1);
transform: scaleX(1);
}
.post-item .read-more::after {
background-color: rgba(var(--color-rgb), 0);
}
.post-item .read-more,
.post-item .read-more::after {
transition-delay: 50ms;
}
.section-hero[data-align=center] {
text-align: center;
}
.section-hero[data-align=center] .section-hero-container .subtitle p {
margin-left: auto;
margin-right: auto;
text-wrap: balance;
}
.section-hero[data-align=left] {
text-align: left;
}
.section-hero[data-align=left] .section-hero-container .subtitle p {
max-width: 992px;
}
.section-hero-container {
display: flex;
flex-direction: column;
margin-top: var(--global-header-height);
padding-bottom: calc(1.728 * 1rem);
padding-bottom: calc(var(--scale-p4) * 1rem);
padding-top: calc(3.583 * 1rem);
padding-top: calc(var(--scale-p8) * 1rem);
}
@media (min-width: 992px) {
.section-hero-container {
margin-top: 0;
padding-bottom: calc(1 * 1rem);
padding-bottom: calc(var(--scale-p1) * 1rem);
padding-top: calc(5.16 * 1rem);
padding-top: calc(var(--scale-p10) * 1rem);
}
}
.section-hero-container .title h1 {
font: 700 calc(1.728 * 1rem + 1.2 * 0.5vw)/1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 700 calc(var(--scale-p4) * 1rem + var(--scale-p2) * 0.5vw)/var(--scale-p2) var(--heading-ff);
letter-spacing: -0.03em;
}
@media (max-width: 992px) {
.desktop-title,.desktop-subtitle {
display: none !important;
}
}
@media (min-width: 992px) {
.mobile-title,.mobile-subtitle {
display: none !important;
}
}
.section-hero-container .subtitle p {
font: 500 18px/1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 500 18px/var(--scale-p3) var(--heading-ff);
margin-top: 0.5em;
text-wrap: pretty;
}
@media (max-width: 768px) {
.section-hero-container {
margin-top: 0;
padding-bottom: calc(1 * 1rem);
padding-bottom: calc(var(--scale-p1) * 1rem);
padding-top: calc(3.583 * 1rem);
padding-top: calc(var(--scale-p8) * 1rem);
}
.section-hero-container .title h1 {
font: 700 calc(1.44 * 1rem + 1.44 * 1vw)/1 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 700 calc(var(--scale-p3) * 1rem + var(--scale-p3) * 1vw)/var(--scale-p1) var(--heading-ff);
line-height: 1.1;
}
.section-hero-container .subtitle p {
font: 500 18px/1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 500 18px/var(--scale-p3) var(--heading-ff);
max-width: 39em;
}
.section-hero-container .title h1.title-split {
display: flex;
flex-direction: column;
}
.section-hero-container .title h1.title-split > span {
align-items: center;
display: flex;
justify-content: center;
}
}
@media (min-width: 768px) and (max-width: 992px) {
.section-hero-container {
padding-bottom: calc(1 * 1rem);
padding-bottom: calc(var(--scale-p1) * 1rem);
padding-top: calc(2.986 * 1rem);
padding-top: calc(var(--scale-p7) * 1rem);
}
.section-hero-container .title h1 {
font: 700 calc(2.074 * 1rem + 1.44 * 1vw)/1 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 700 calc(var(--scale-p5) * 1rem + var(--scale-p3) * 1vw)/var(--scale-p1) var(--heading-ff);
line-height: 1.1;
}
.section-hero-container .subtitle p {
font: 400 calc(1.2 * 1rem + 0.402 * 1vw)/1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 400 calc(var(--scale-p2) * 1rem + var(--scale-n5) * 1vw)/var(--scale-p3) var(--heading-ff);
max-width: 39em;
}
.section-hero-container .title h1.title-split,
.section-hero-container .subtitle p.subtitle-split {
display: flex;
flex-direction: column;
}
.section-hero-container .title h1.title-split > span {
align-items: center;
display: flex;
justify-content: center;
}
}
@media (min-width: 992px) and (max-width: 1380px) {
.section-hero-container .title h1 {
font: 700 calc(2.488 * 1rem + 1.44 * 1vw)/1 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 700 calc(var(--scale-p6) * 1rem + var(--scale-p3) * 1vw)/var(--scale-p1) var(--heading-ff);
}
.section-hero-container .subtitle p {
font: 400 calc(1.44 * 1rem + 0.402 * 1vw)/1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 400 calc(var(--scale-p3) * 1rem + var(--scale-n5) * 1vw)/var(--scale-p3) var(--heading-ff);
max-width: 39em;
}
.section-hero-container .title h1.title-split,
.section-hero-container .subtitle p.subtitle-split {
display: flex;
flex-direction: column;
}
.section-hero-container .title h1.title-split > span {
align-items: center;
display: flex;
justify-content: center;
}
}
@media (min-width: 1380px) {
.section-hero-container {
padding-bottom: calc(2.074 * 1rem);
padding-bottom: calc(var(--scale-p5) * 1rem);
padding-top: calc(5.16 * 1rem);
padding-top: calc(var(--scale-p10) * 1rem);
}
.section-hero-container .title h1 {
font: 700 calc(3.583 * 1rem + 1.44 * 1vw)/1 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 700 calc(var(--scale-p8) * 1rem + var(--scale-p3) * 1vw)/var(--scale-p1) var(--heading-ff);
}
.section-hero-container .subtitle p {
font: 400 calc(1.44 * 1rem + 0.402 * 1vw)/1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 400 calc(var(--scale-p3) * 1rem + var(--scale-n5) * 1vw)/var(--scale-p3) var(--heading-ff);
max-width: 39em;
}
.section-hero-container .title h1.title-split,
.section-hero-container .subtitle p.subtitle-split {
display: flex;
flex-direction: column;
}
.section-hero-container .title h1.title-split > span {
align-items: center;
display: flex;
justify-content: center;
}
}
@media (min-width: 1800px) {
.section-hero-container .title h1 {
font: 700 calc(4.3 * 1rem + 1.44 * 0.75vw)/1 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 700 calc(var(--scale-p9) * 1rem + var(--scale-p3) * 0.75vw)/var(--scale-p1) var(--heading-ff);
}
.section-hero-container .subtitle p {
font: 400 calc(1.728 * 1rem + 0.402 * 0.85vw)/1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: 400 calc(var(--scale-p4) * 1rem + var(--scale-n5) * 0.85vw)/var(--scale-p2) var(--heading-ff);
max-width: 40em;
}
}
.section-hero[data-theme] {
position: relative;
}
.section-hero[data-theme]::before {
content: "";
display: block;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
}
.section-hero[data-theme=swatch-color-0]::before {
background-image: linear-gradient(180deg, rgba(0, 96, 100, 0.09) 15%, rgb(255, 255, 255) 65%);
}
.section-hero[data-theme=swatch-color-1]::before {
background-image: linear-gradient(180deg, rgba(74, 20, 140, 0.09) 15%, rgb(255, 255, 255) 65%);
}
.section-hero[data-theme=swatch-color-2]::before {
background-image: linear-gradient(180deg, rgba(26, 35, 126, 0.09) 15%, rgb(255, 255, 255) 65%);
}
.section-hero[data-theme=swatch-color-3]::before {
background-image: linear-gradient(180deg, rgba(33, 150, 243, 0.25) 30%, rgb(255, 255, 255) 65%);
}
.section-hero[data-theme=swatch-color-4]::before {
background-image: linear-gradient(180deg, rgba(41, 182, 246, 0.25) 30%, rgb(255, 255, 255) 65%);
opacity: 0.06;
}
.section-hero[data-theme=swatch-color-5]::before {
background-image: linear-gradient(180deg, rgba(255, 152, 0, 0.09) 5%, rgb(255, 255, 255) 30%, rgb(255, 255, 255) 150%);
}
.section-hero[data-theme=swatch-color-6]::before {
background-image: linear-gradient(180deg, rgba(244, 67, 54, 0.25) 30%, rgb(255, 255, 255) 65%);
}
.section-hero[data-theme=swatch-color-7]::before {
background-image: linear-gradient(180deg, rgba(121, 85, 72, 0.25) 30%, rgb(255, 255, 255) 65%);
}
.section-hero[data-theme=swatch-color-8]::before {
background-image: linear-gradient(180deg, rgba(96, 125, 139, 0.25) 30%, rgb(255, 255, 255) 65%);
}
.section-hero-blobs {
filter: blur(30px);
filter: hue-rotate(37deg);
height: 100%;
isolation: isolate;
left: 0;
opacity: 0.5;
position: relative;
position: absolute;
right: 0;
top: -68%;
width: 100vw;
}
.section-hero-blobs .blob:nth-of-type(1) {
background: radial-gradient(farthest-side, rgba(0, 227, 255, 0.9215686275), transparent);
height: 60%;
left: 20%;
mix-blend-mode: multiply;
position: absolute;
top: 20%;
width: 50%;
}
.section-hero-blobs .blob:nth-of-type(2) {
background: radial-gradient(farthest-side, rgba(34, 0, 255, 0.2), transparent);
height: 50%;
left: 40%;
mix-blend-mode: multiply;
position: absolute;
top: 25%;
width: 25%;
}
.section-hero-blobs .blob:nth-of-type(3) {
background: radial-gradient(farthest-side, rgba(217, 0, 255, 0.5607843137), transparent);
height: 65%;
left: 45%;
position: absolute;
top: 20%;
width: 35%;
}
.section-hero-logos {
margin-top: calc(1.44 * 1rem);
margin-top: calc(var(--scale-p3) * 1rem);
}
#particleToc {
max-width: auto;
position: sticky;
top: 105px;
}
.particle-widget__toc {
display: flex;
flex-direction: column;
}
.particle-widget__toc h2 {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
color: #94a3b8;
color: var(--color-slate-400);
display: flex;
font-size: 13px;
font-weight: 700;
margin-bottom: 1rem;
text-transform: uppercase;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
:root {
--page-primary-hex: var(--color-primary-300);
}
nav[role=doc-toc] {
display: flex;
flex-direction: column;
}
@media (min-width: 992px) {
nav[role=doc-toc] {
height: -moz-max-content;
height: max-content;
overflow: hidden;
position: sticky;
top: calc(1.2 * 1rem);
top: calc(var(--scale-p2) * 1rem);
}
}
nav[role=doc-toc] header h2 {
align-items: center;
display: flex;
}
nav[role=doc-toc] header h2 i {
margin-right: 3px;
}
.toc-list--item a {
--padding-left: var(--scale-p2);
--border-color: var(--color-slate-300-rgb);
--border-opacity: 1;
--border-active-color: var(--page-primary-rgb);
--border-active-opacity: 1;
--opacity: 1;
--link-color-rgb: var(--color-slate-700-rgb);
--link-active-rgb: var(--color-slate-900-rgb);
}
.toc-list--item.level-1 a {
--padding-left: var(--scale-p2);
--border-opacity: .3;
--border-active-opacity: 1;
--opacity: 1;
}
.toc-list--item.level-2 a {
--padding-left: var(--scale-p3);
--border-opacity: .25;
--border-active-opacity: .7;
--opacity: 1;
}
.toc-list--item.level-3 a {
--padding-left: var(--scale-p6);
--border-opacity: .2;
--border-active-opacity: .6;
--opacity: 1;
}
.toc-list--item.level-4 a {
--padding-left: var(--scale-p2);
--border-opacity: 0.1;
--border-active-opacity: .5;
--opacity: 1;
}
.toc-list--item a {
border-left-color: rgba(var(--border-color), var(--border-opacity));
border-left-style: solid;
border-left-width: 1px;
color: rgba(21, 21, 21, var(--opacity));
padding-left: calc(var(--padding-left) * 1rem);
transition-duration: 150ms;
transition-property: color, border-color, padding-left, font-weight, background-color, border-left-width;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: color, border-color, padding-left, font-weight, background-color, border-left-width;
color: rgba(var(--link-color-rgb), 1);
display: block;
font-size: 17px;
font-weight: 400;
line-height: 1.5;
padding-bottom: 6px;
padding-top: 6px;
text-wrap: balance;
will-change: color;
}
.toc-list--item a.active {
border-color: rgba(var(--border-active-color), var(--border-active-opacity));
border-left-width: 3px;
color: rgba(var(--link-color-rgb), 1);
color: rgba(var(--link-active-rgb), 1);
font-weight: 500;
text-decoration: underline;
text-decoration-color: rgba(var(--link-active-rgb), 0.25);
text-decoration-thickness: initial;
text-underline-offset: 3px;
}
.toc-list--item a:hover,
.toc-list--item a:focus {
color: rgba(var(--link-active-rgb), 1);
outline: none;
text-decoration: underline;
text-decoration-color: rgba(var(--link-active-rgb), 0.5);
-webkit-text-decoration-skip: ink;
text-decoration-skip-ink: auto;
text-decoration-thickness: 1px;
text-underline-offset: 3px;
}
@media (max-width: 768px) {
.toc-list--item a {
font-size: 15px;
font-weight: 400;
padding-bottom: 0;
padding-top: 0;
}
.toc-list--item.level-1 a,
.toc-list--item.level-2 a,
.toc-list--item.level-3 a,
.toc-list--item.level-4 a {
max-inline-size: 90%;
padding-bottom: 4px;
padding-top: 4px;
text-wrap: balance;
}
}
/* Particle Share */
#particleAsideShare {
margin-bottom: 2.25rem;
}
.particle-aside__share {
align-items: center;
display: flex;
flex-direction: row;
grid-gap: 10px;
justify-content: flex-start;
}
.particle-aside__share a,
.particle-aside__share button {
align-items: center;
background-image: linear-gradient(to bottom, #f8fafc, #f1f5f9);
background-image: linear-gradient(to bottom, var(--color-slate-50), var(--color-slate-100));
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 8px;
color: #475569;
color: var(--color-slate-600);
display: flex;
height: 28px;
justify-content: center;
outline-color: rgba(0, 123, 255, 0.15);
outline-color: rgba(var(--color-primary-500-rgb), 0.15);
outline-offset: 0.25em;
outline-style: solid;
outline-width: 0px;
position: relative;
top: 0;
transition-duration: 100ms;
transition-property: color, background-color, border-color, outline-color, outline-width, outline-offset, top;
transition-timing-function: ease-in-out;
width: 28px;
will-change: color, background-color, border-color, outline-color, outline-width, outline-offset, top;
}
.particle-aside__share a svg,
.particle-aside__share button svg {
display: block;
fill: currentColor;
height: 16px;
width: 16px;
}
.particle-aside__share a:focus,
.particle-aside__share a:hover,
.particle-aside__share button:focus,
.particle-aside__share button:hover {
border-color: #55a7ff;
border-color: var(--color-primary-400);
outline-color: rgba(0, 123, 255, 0.25);
outline-color: rgba(var(--color-primary-500-rgb), 0.25);
outline-offset: 0;
outline-style: solid;
outline-width: 2px;
}
.particle-aside__share a:active,
.particle-aside__share button:active {
top: 1px;
}
.particle-aside__share a:hover svg,
.particle-aside__share button:hover svg {
color: #007bff;
color: var(--color-primary-500);
}
.particle-aside__share .divider {
background-image: linear-gradient(to bottom, white, #e2e8f0, white);
background-image: linear-gradient(to bottom, white, var(--color-slate-200), white);
display: block;
height: 30px;
margin: 0 6px;
width: 1px;
}
@media (max-width: 992px) {
/* .particle-aside__share { margin-bottom: var(--rem-p5); } */
.particle-aside__share {
grid-gap: 1rem;
}
#particleAsideShare {
align-items: center;
background-color: #f8fafc;
background-color: var(--color-slate-50);
border: 0px;
display: flex;
justify-content: center;
justify-content: center;
margin-bottom: 1.563rem;
margin-top: 0;
max-width: 100%;
padding: 1rem 0;
width: 100%;
}
#particleAsideShare .particle-widget__title {
display: none;
}
.particle-widget__title,
.particle-aside__share {
margin-bottom: 0 !important;
}
.particle-aside__share a {
box-shadow: 0 0 0;
}
}
/* .tile-container[data-type=logos] {
margin-top: -60px;
z-index: 1000000;
position: relative;
max-width: 100%;
}
.tile-container--wrapper[data-type=logos] {
overflow: visible;
} */
.countdown-wrapper header h1 {
font-size: var(--h0c);
padding-top: 150px;
text-align: center;
}
.countdown-grid {
--cols: 3;
display: grid;
display: none;
grid-template-columns: repeat(3, 1fr);
grid-template-columns: repeat(var(--cols), 1fr);
justify-content: center;
margin: 0 auto;
max-width: 768px;
text-align: center;
}
@media (min-width: 1100px) {
.countdown-grid {
display: grid;
}
}
.countdown-grid .bloc-time {
margin-left: auto;
margin-right: auto;
width: 210px;
}
.countdown-grid .count-title {
color: #94a3b8;
color: var(--color-slate-400);
display: block;
flex-grow: 1;
font-size: var(--h6c);
font-weight: 500;
letter-spacing: 1px;
margin-bottom: 1rem;
text-transform: uppercase;
}
.countdown-grid .figure {
background-color: #FFFFFF;
background-color: var(--color-white);
border-radius: 10px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
flex: 0 0 50%;
float: left;
height: 80px;
margin-right: 10px;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 70px;
}
.countdown-grid .figure:last-child {
margin-right: 0;
}
.countdown-grid .figure > span {
color: #80bdff;
color: var(--page-primary-hex);
font-size: 5rem;
font-weight: 700;
left: 0;
line-height: 80px;
margin: auto;
position: absolute;
right: 0;
}
@media (min-width: 992px) {
.countdown-grid .figure {
height: 110px;
width: 100px;
}
.countdown-grid .figure > span {
line-height: 107px;
}
}
.countdown-grid .figure .top:after,
.countdown-grid .figure .bottom-back:after {
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid var(--color-slate-200);
bottom: 0;
content: "";
height: 100%;
left: 0;
position: absolute;
width: 100%;
z-index: -1;
}
.countdown-grid .figure .top {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
transform: perspective(200px);
transform-origin: 50% 100%;
z-index: 3;
}
.countdown-grid .figure .bottom {
z-index: 1;
}
.countdown-grid .figure .bottom:before {
background-color: rgba(0, 0, 0, 0.02);
content: "";
display: block;
height: 50%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.countdown-grid .figure .bottom-back {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-top-left-radius: 10px;
border-top-right-radius: 10px;
height: 50%;
overflow: hidden;
top: 0;
z-index: 2;
}
.countdown-grid .figure .bottom-back span {
left: 0;
margin: auto;
position: absolute;
right: 0;
top: 0;
}
.countdown-grid .figure .top,
.countdown-grid .figure .top-back {
backface-visibility: hidden;
height: 50%;
overflow: hidden;
}
.countdown-grid .figure .top-back {
background-color: #FFFFFF;
background-color: var(--color-white);
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
bottom: 0;
transform: perspective(200px) rotateX(180deg);
transform-origin: 50% 0;
z-index: 4;
}
.countdown-grid .figure .top-back span {
left: 0;
margin: auto;
position: absolute;
right: 0;
top: -100%;
}
.list-container {
margin: 0 auto;
max-width: 800px;
padding: 1.563rem;
}
.list-menu {
align-items: center;
background-image: linear-gradient(to bottom, #f8fafc, #f1f5f9);
background-image: linear-gradient(to bottom, var(--color-slate-50), var(--color-slate-100));
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;
display: grid;
grid-template-columns: 1fr;
justify-content: space-between;
min-width: 1px;
padding: 12px;
position: relative;
z-index: 100;
}
.list-btns {
align-items: center;
display: flex;
gap: 6px;
justify-content: flex-end;
}
@media (max-width: 992px) {
.section-component.section-header header,
.section-component.section-header[data-size="0"] header {
margin-bottom: 0.825rem;
padding-bottom: 0.825rem;
}
.section-component.section-header[data-align=left] header::after {
display: none;
}
.list-menu[data-search][data-btns] {
display: grid;
grid-gap: 12px;
grid-template-columns: 1fr max-content;
justify-content: space-between;
}
.list-menu[data-search][data-btns][data-filter] {
display: grid;
grid-gap: 12px;
grid-template-columns: 1fr 38px 38px;
justify-content: space-between;
}
.list-menu[data-search][data-btns][data-filter] .list-search {
grid-column: 1/span 3;
}
.list-menu[data-search][data-btns][data-filter] .list-filter {
grid-column: 1/span 1;
}
.list-menu[data-search][data-btns][data-filter] .list-btns {
display: contents;
grid-column: 2/span 2;
}
}
@media (max-width: 992px) {
}
@media (min-width: 992px) {
.list-menu {
border-radius: 6px;
margin: 0;
padding: 10px;
}
.list-menu[data-search][data-btns] {
display: grid;
grid-gap: 12px;
grid-template-columns: 1fr max-content;
justify-content: space-between;
}
.list-menu[data-search][data-btns][data-filter] {
display: grid;
grid-gap: 12px;
grid-template-columns: 1fr max-content max-content;
justify-content: space-between;
}
}
.list-btn--sortAlpha,
.list-btn--sortDate {
-webkit-appearance: none;
background: transparent;
background-color: white;
border: none;
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 6px;
color: inherit;
cursor: pointer;
display: block;
font: inherit;
font-size: 18px;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
height: 38px;
line-height: normal;
margin: 0;
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
outline-style: solid;
outline-width: 2px;
overflow: visible;
padding: 0;
transition-duration: 150ms;
transition-property: outline-color, outline-offset, outline, border-color;
width: auto;
will-change: outline-color, outline-offset, outline, border-color;
}
.list-btn--sortAlpha i,
.list-btn--sortDate i {
color: #475569;
color: var(--color-slate-600);
font-size: 1.125rem;
}
.list-btn--sortAlpha:hover i,
.list-btn--sortDate:hover i,
.list-btn--sortAlpha:focus i,
.list-btn--sortDate:focus i {
color: #0f172a;
color: var(--color-slate-900);
}
.list-btn--sortDate,
.list-btn--sortAlpha {
width: 38px;
}
.list-btn--sortDate:hover,
.list-btn--sortDate:focus,
.list-btn--sortAlpha:hover,
.list-btn--sortAlpha:focus {
border-color: #64748b;
border-color: var(--color-slate-500);
outline-color: rgba(100, 116, 139, 0.15);
outline-color: rgba(var(--color-slate-500-rgb), 0.15);
outline-offset: 0;
outline-width: 2px;
}
.list-btn--sortDate,
.list-btn--sortAlpha {
align-items: center;
display: flex;
font-size: 22px;
justify-content: center;
}
.list-menu--left {
display: flex;
flex-direction: column;
grid-gap: 12px;
}
.list-filters {
display: contents;
}
@media (min-width: 992px) {
.list-menu--left {
flex-direction: row;
}
}
.list-filter--icon {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 0 6px 6px 0;
display: flex;
height: 38px;
justify-content: center;
width: 38px;
}
.list-filter--icon,
.list-filter--search {
transition-duration: 150ms;
transition-property: border-color, background-color;
will-change: border-color, background-color;
}
.list-filter {
align-items: center;
border-radius: 6px;
display: flex;
flex-direction: row;
outline: 6px solid rgba(var(--page-primary-rgb), 0);
outline-offset: 8px;
transition-duration: 150ms;
transition-property: outline-color, outline-offset, outline, border-color;
}
.list-filter:hover,
.list-filter:focus-within {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: #64748b;
border-color: var(--color-slate-500);
outline-color: rgba(100, 116, 139, 0.15);
outline-color: rgba(var(--color-slate-500-rgb), 0.15);
outline-offset: 0;
outline-width: 2px;
}
.list-filter:hover .list-filter--select,
.list-filter:hover .list-filter--icon,
.list-filter:focus-within .list-filter--select,
.list-filter:focus-within .list-filter--icon {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: #64748b;
border-color: var(--color-slate-500);
outline: none;
}
.list-filter--select {
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 6px 0 0 6px;
border-right: 0;
font-size: 16px;
height: 38px;
padding-left: 12px;
padding-right: 12px;
}
@media (max-width: 768px) {
.list-filter {
max-width: 100%;
position: relative;
}
.list-filter,.list-filter button {
width: 100%;
}
.list-filter--groupWrapper.is-active,
.list-filter--checkbox-group {
max-width: 100% !important;
top: 100%;
width: 100% !important;
}
}
.list-search {
max-width: 336px;
position: relative;
}
.list-search--clear {
-webkit-appearance: none;
background: transparent;
border: none;
border-radius: 6px;
color: inherit;
font: inherit;
font-size: 14px;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
line-height: normal;
margin: 0;
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
outline-style: solid;
outline-width: 6px;
overflow: visible;
padding: 0;
transition-duration: 150ms;
transition-property: outline-color, outline-offset, outline, border-color;
width: auto;
width: 32px;
will-change: outline-color, outline-offset, outline, border-color;
}
.list-search--clear:focus {
border-color: #80bdff;
border-color: var(--page-primary-hex);
outline-color: rgba(var(--page-primary-rgb), 0.4);
outline-offset: 0;
outline-width: 0.15em;
}
.list-search--icon,
.list-search--clear {
align-items: center;
display: flex;
font-size: 14px;
height: 22px;
justify-content: center;
position: absolute;
right: 8px;
top: 8px;
width: 22px;
}
.list-search--icon i,
.list-search--clear i {
color: #94a3b8;
color: var(--color-slate-400);
font-size: 14px;
}
.list-search--icon svg,
.list-search--clear svg {
pointer-events: none;
}
.list-search .list-search--clear {
display: none;
}
.list-search:focus-within .list-search--clear {
display: flex;
}
.list-search:focus-within .list-search--icon {
display: none;
}
.list-search input {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 0 solid;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 8px;
color: #1e293b;
color: var(--color-slate-800);
font-size: 16px;
min-height: 38px;
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
outline-style: solid;
outline-width: 6px;
padding: 0 12px;
transition-duration: 150ms;
transition-property: outline-color, outline-offset, outline, border-color;
width: 100%;
will-change: outline-color, outline-offset, outline, border-color;
}
.list-search input::-moz-placeholder {
color: #94a3b8;
color: var(--color-slate-400);
}
.list-search input::placeholder {
color: #94a3b8;
color: var(--color-slate-400);
}
.list-search input:focus-within {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: #64748b;
border-color: var(--color-slate-500);
outline-color: rgba(100, 116, 139, 0.15);
outline-color: rgba(var(--color-slate-500-rgb), 0.15);
outline-offset: 0;
outline-width: 2px;
}
@media (max-width: 768px) {
.list-search {
max-width: 100%;
position: relative;
}
}
.list-filter {
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
}
.list-filter,.list-filter--groupWrapper {
background-color: #fff;
position: relative;
}
.list-filter--groupWrapper {
border-radius: 3px;
box-shadow: rgba(0, 0, 0, 0.16) 0 10px 36px 0, rgba(0, 0, 0, 0.06) 0 0 0 1px;
overflow: hidden;
}
@media (max-width: 768px) {
.list-filter--groupWrapper.is-active {
display: block;
left: 0;
position: fixed;
right: 0;
top: 100%;
z-index: 100;
}
}
@media (min-width: 768px) {
.list-filter--groupWrapper.is-active {
display: block;
left: 0;
position: absolute;
top: calc(100% + 10px);
z-index: 100;
}
}
.list-filter--groupWrapper:not(.is-active) {
display: none;
}
.list-filter--checkbox-group {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
max-height: 300px;
max-width: 300px;
min-width: 220px;
overflow-x: hidden;
overflow-y: scroll;
}
.list-filter--checkbox-group::-webkit-scrollbar {
width: 5px;
}
.list-filter--checkbox-group::-webkit-scrollbar-track {
background: #e2e8f0;
background: var(--color-slate-200);
}
.list-filter--checkbox-group::-webkit-scrollbar-thumb {
background: rgba(0, 123, 255, 1);
background: rgba(var(--color-blue-rgb), 1);
}
.list-filter button {
border: none;
border-radius: 8px;
color: #475569;
color: var(--color-slate-600);
height: 38px;
padding: 0 18px 0 1rem;
transition-duration: 150ms;
transition-property: background-color, color;
will-change: background-color, color;
}
.list-filter button.is-active {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
color: #1e293b;
color: var(--color-slate-800);
}
.list-filter button svg {
height: 14px;
position: relative;
right: -4px;
top: 2px;
transform: rotate(-90deg);
transition-duration: 150ms;
transition-property: transform;
width: 14px;
will-change: transform;
}
.list-filter button.is-active svg {
transform: rotate(0);
}
.list-filter--checkbox-group label {
align-items: center;
cursor: pointer;
display: flex;
}
.list-filter--checkbox-group label:hover {
background-color: #e9ecef;
border-color: #007bff;
}
.list-filter--icon {
align-items: center;
display: flex;
}
.icon-filter svg {
fill: #6c757d;
height: 16px;
width: 16px;
}
.list-filter--checkbox-group input[type=checkbox]:focus + label {
outline: 2px solid #007bff;
outline-offset: 2px;
}
.list-filter--checkbox-group {
--checkbox-size: 16px;
--checkbox-radius: 4px;
--checkbox-color: var(--color-blue-rgb);
}
.list-filter--checkbox-group .label-row {
align-items: center;
background-color: white;
display: flex;
gap: 10px;
justify-content: flex-start;
min-width: -moz-max-content;
min-width: max-content;
padding: 0.65rem 1rem 0.65rem 0.75rem;
transition-duration: 150ms;
transition-property: background-color;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: background-color;
}
.list-filter--checkbox-group .label-row span {
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
text-wrap: nowrap;
}
.list-filter--checkbox-group .label-row[for=filter-industry-select-all],
.list-filter--checkbox-group .label-row[for=filter-type-select-all],
.list-filter--checkbox-group .label-row[for=filter-format-select-all] {
background-color: rgba(100, 116, 139, 0.05);
background-color: rgba(var(--color-slate-500-rgb), 0.05);
border-bottom: 1px solid rgba(100, 116, 139, 0.1);
border-bottom: 1px solid rgba(var(--color-slate-500-rgb), 0.1);
color: #94a3b8;
color: var(--color-slate-400);
font-size: 14px;
font-weight: 600;
text-transform: uppercase;
}
.list-filter--checkbox-group .label-row[for=filter-industry-select-all]:hover,
.list-filter--checkbox-group .label-row[for=filter-type-select-all]:hover,
.list-filter--checkbox-group .label-row[for=filter-format-select-all]:hover,
.list-filter--checkbox-group .label-row[for=filter-industry-select-all]:focus,
.list-filter--checkbox-group .label-row[for=filter-type-select-all]:focus,
.list-filter--checkbox-group .label-row[for=filter-format-select-all]:focus {
background-color: rgba(var(--checkbox-color), 0.1);
}
.list-filter--checkbox-group .label-row:hover {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
}
.list-filter--checkbox-group .label-row input[type=checkbox] + label,
.list-filter--checkbox-group .label-row label + input[type=checkbox] {
font-size: 16px;
margin-left: 7px;
}
.list-filter--checkbox-group label {
align-items: center;
color: #1e293b;
color: var(--color-slate-800);
display: flex;
font-size: 16px;
font-weight: 500;
gap: 12px;
justify-content: center;
}
.list-filter--checkbox-group label[for] {
cursor: pointer;
}
.list-filter--checkbox-group input[type=checkbox] {
border-radius: var(--checkbox-radius);
cursor: pointer;
height: var(--checkbox-size);
outline-color: rgba(0, 0, 0, 0);
outline-offset: 4px;
outline-style: solid;
outline-width: 2px;
position: relative;
transition-duration: 100ms;
transition-property: outline-color, outline-offset;
width: var(--checkbox-size);
}
.list-filter--checkbox-group input[type=checkbox]:focus,.list-filter--checkbox-group input[type=checkbox]:checked:active,
.list-filter--checkbox-group input[type=checkbox]:checked:hover {
outline-color: rgba(var(--checkbox-color), 0.35);
outline-offset: 0;
}
.list-filter--checkbox-group input[type=checkbox]::before {
background-color: rgba(0, 0, 0, 0.1);
border: 1px solid rgba(0, 0, 0, 0.25);
border-radius: var(--checkbox-radius);
content: "";
display: block;
height: var(--checkbox-size);
left: 0;
position: absolute;
top: 0;
width: var(--checkbox-size);
}
.list-filter--checkbox-group input[type=checkbox]:checked {
background-color: rgba(var(--checkbox-color), 1);
background-image: url("data:image/svg+xml;charset=utf-8, %3Csvg aria-hidden='true' xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 12'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M1 5.917 5.724 10.5 15 1.5'/%3E%3C/svg%3E");
background-position: 50%;
background-repeat: no-repeat;
background-repeat: no-repeat;
background-size: 0.55em 0.55em;
background-size: 0.55em 0.55em;
border-color: transparent;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
}
.list-filter--checkbox-group input[type=checkbox]:checked::before {
background-color: transparent;
border-color: rgba(var(--checkbox-color), 1);
}
.blocktype-video {
--plyr-color-main: var(--page-primary-hex);
--plyr-video-background: transparent;
--plyr-control-spacing: 18px;
--plyr-color-main: var(--page-primary-hex);
height: auto;
margin-top: 1.563rem;
position: relative;
width: 100%;
}
.blocktype-video .plyr__video-wrapper::before {
display: none;
}
.blocktype-video:first-child {
margin-top: 0;
}
.blocktype-video:last-child {
margin-bottom: 0;
}
.blocktype-video:not(:first-child) {
margin-top: 1.563rem;
}
.blocktype-video:not(:last-child) {
margin-bottom: 1.563rem;
}
.blocktype-video[data-aspect-ratio=landscape] .blocktype-video-wrapper {
aspect-ratio: 16/9;
}
.blocktype-video[data-aspect-ratio=square] .blocktype-video-wrapper,
.blocktype-video[data-aspect-ratio=portrait] .blocktype-video-wrapper {
margin: auto;
max-width: 576px;
}
.blocktype-video-wrapper .plyr {
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
clip-path: inset(1px 1px);
}
.blocktype-video .blocktype-video-wrapper {
border-radius: 12px;
overflow: hidden;
}
.blocktype-video {
background-color: transparent;
}
.blocktype-video figcaption {
color: #334155;
color: var(--color-slate-700);
font-size: 13px;
line-height: 1.25;
margin-top: 6px;
text-align: left;
}
.blocktype-cluster {
margin-top: 48px;
max-width: 768px;
position: relative;
}
.blocktype-cluster:first-child {
margin-top: 0;
}
.blocktype-cluster:last-child {
margin-bottom: 0;
}
.blocktype-cluster--wrapper {
align-items: center;
box-sizing: content-box;
display: flex;
height: 100%;
overflow: visible;
position: relative;
transition-property: transform;
transition-timing-function: ease;
transition-timing-function: initial;
transition-timing-function: var(--swiper-wrapper-transition-timing-function, initial);
width: 100%;
z-index: 1;
}
.blocktype-cluster .swiper-slide .blocktype-pullquote__inner {
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}
.blocktype-cluster .swiper-pagination {
align-items: center;
display: flex;
justify-content: center;
margin: auto;
margin-top: 2rem;
position: relative;
width: 100%;
z-index: 10;
}
.blocktype-cluster .swiper-pagination .swiper-pagination-bullet {
--swiper-pagination-bullet-width: 10px;
--swiper-pagination-bullet-height: 10px;
background-color: rgba(100, 116, 139, 0.6);
background-color: rgba(var(--color-slate-500-rgb), 0.6);
border: 1px solid rgba(100, 116, 139, 0.6);
border: 1px solid rgba(var(--color-slate-500-rgb), 0.6);
outline: 3px solid rgba(100, 116, 139, 0);
outline: 3px solid rgba(var(--color-slate-500-rgb), 0);
outline-offset: 3px;
transition-duration: 250ms;
transition-property: background-color, outline-offset, outline, border-color;
transition-timing-function: ease;
transition-timing-function: initial;
transition-timing-function: var(--swiper-pagination-bullet-transition-timing-function, initial);
}
.blocktype-cluster .swiper-pagination .swiper-pagination-bullet-active,.blocktype-cluster .swiper-pagination .swiper-pagination-bullet:focus,
.blocktype-cluster .swiper-pagination .swiper-pagination-bullet:hover {
background-color: #007bff;
background-color: var(--color-primary-500);
border-color: #007bff;
border-color: var(--color-primary-500);
}
.blocktype-cluster .swiper-pagination .swiper-pagination-bullet:focus,
.blocktype-cluster .swiper-pagination .swiper-pagination-bullet:hover {
outline: 3px solid rgba(0, 123, 255, 0.15);
outline: 3px solid rgba(var(--color-primary-500-rgb), 0.15);
outline-offset: 0;
}
.blocktype-cluster--wrapper .swiper-slide {
align-items: center;
background: #fff;
display: flex;
display: block;
flex-shrink: 0;
font-size: 18px;
height: 100%;
justify-content: center;
opacity: 0;
overflow: visible;
position: relative;
text-align: center;
transition-property: transform;
width: 100%;
}
.blocktype-cluster--wrapper .swiper-slide.swiper-slide-active {
opacity: 1;
}
.swiper-autoheight, .swiper-autoheight .swiper-slide,.blocktype-cluster--wrapper .swiper-autoheight .swiper-slide {
height: auto;
}
.blocktype-pullquote {
--color-rgb: var(--color-slate-800-rgb);
--color-rgb-lighter: var(--color-slate-300-rgb);
--gutter: calc(var(--scale-p2) * 1rem);
--bg: var(--color-rgb-lighter);
--fill: var(--color-rgb);
--border: var(--color-rgb);
--color: var(--color-slate-900);
--icon: var(--color-rgb);
display: grid;
grid-template-columns: 1fr;
margin-left: auto;
margin-right: auto;
position: relative;
}
.article-content > .bloctype-pullquote,
.particle-article__content > .blocktype-pullquote {
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid var(--color-slate-200);
border-top: 1px solid #e2e8f0;
border-top: 1px solid var(--color-slate-200);
margin-bottom: 3.653em;
margin-bottom: var(--em-p10);
margin-top: 3.653em;
margin-top: var(--em-p10);
padding-bottom: 3.653em;
padding-bottom: var(--em-p10);
padding-top: 3.653em;
padding-top: var(--em-p10);
}
@media (min-width: 1380px) {
.blocktype-pullquote[data-blockquote-img] {
grid-template-columns: 1fr;
}
}
.blocktype-pullquote__icon {
color: rgba(var(--icon), 1);
font-size: 34px;
left: 50%;
position: absolute;
top: 1rem;
transform: translateX(-50%);
z-index: 2;
}
@media (min-width: 992px) {
.blocktype-pullquote__icon {
top: 2rem;
}
}
.blocktype-pullquote__gradient {
content: "";
height: 100%;
left: -201px;
opacity: 0.5;
pointer-events: none;
position: absolute;
top: 0;
transform: rotate(30deg);
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 50%;
z-index: 0;
}
.blocktype-pullquote__gradient svg {
display: block;
height: 100%;
width: 100%;
}
.blocktype-pullquote__image {
aspect-ratio: 1/1;
border-radius: 4px;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
display: block;
max-width: 200px;
position: relative;
top: 50%;
transform: translateY(-50%);
z-index: 2;
}
@media (max-width: 992px) {
.blocktype-pullquote__image {
border: 3px solid rgba(var(--border), 0.3);
border-radius: 999em;
height: 60px;
max-width: 60px;
overflow: hidden;
position: absolute;
right: 30px;
top: 30px;
}
}
.blocktype-pullquote__image img,
.blocktype-pullquote__logo img {
border-radius: 8px;
display: block;
height: 100%;
margin: auto;
min-height: 100%;
min-width: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.blocktype-pullquote__logo {
margin-top: calc(1rem * 2);
margin-top: calc(var(--gutter) * 2);
max-width: 120px;
}
.blocktype-pullquote__logo img.img-square,
.blocktype-pullquote__logo img[data-img-format=square] {
height: 30px;
width: 30px;
}
@media (min-width: 992px) {
.blocktype-pullquote__logo {
max-width: 160px;
}
}
.blocktype-pullquote__inner {
align-items: flex-start;
background-color: white;
border-radius: 4px;
/* border: 1px solid rgba(var(--border), 0.25); */
/* outline: 4px solid rgba(var(--border), 0.15); */
box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
display: flex;
flex-direction: column;
height: -moz-max-content;
height: max-content;
justify-content: space-between;
min-height: -moz-min-content;
min-height: min-content;
overflow: hidden;
padding: 24px;
position: relative;
z-index: 1;
}
.blocktype-pullquote:not([data-blockquote-img]) .blocktype-pullquote__inner {
height: 100%;
}
@media (min-width: 992px) {
.blocktype-pullquote__inner {
padding: 1.563rem;
}
}
.blocktype-pullquote .blocktype-pullquote__inner {
background-color: #FFFFFF;
background-color: var(--color-white);
/* background-image: linear-gradient(to top, rgba(var(--color-rgb), 0.03) 10%, rgba(var(--color-rgb), 0.01), white); */
text-align: left;
}
@media (min-width: 992px) {
.blocktype-pullquote .blocktype-pullquote__inner {
padding: 32px;
}
}
.blocktype-pullquote__inner *::-moz-selection {
background: rgba(var(--color-rgb), 0.15);
color: #0f172a;
color: var(--color-slate-900);
}
.blocktype-pullquote__inner *::selection {
background: rgba(var(--color-rgb), 0.15);
color: #0f172a;
color: var(--color-slate-900);
}
.blocktype-pullquote__content {
font: var(--type-h4);
font-weight: 500;
line-height: 1.563;
}
.blocktype-pullquote__content,.blocktype-pullquote__credits {
color: var(--color);
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.blocktype-pullquote__credits {
align-items: flex-start;
display: flex;
flex-direction: column;
font: var(--type-p-sm);
justify-content: flex-start;
margin-top: 1rem;
margin-top: var(--gutter);
}
.blocktype-pullquote__credits .blocktype-pullquote__author {
font-size: 1rem;
font-weight: 500;
line-height: 1;
}
.blocktype-pullquote__credits .blocktype-pullquote__role,
.blocktype-pullquote__credits .blocktype-pullquote__company {
color: #6c757d;
color: var(--color-grey);
font-size: 15px;
line-height: 1.125;
margin-top: 10px;
}
@media (min-width: 992px) {
.blocktype-pullquote__credits {
flex-direction: row;
}
}
.blocktype-pullquote__credits {
margin: calc(1 * 1rem) 0 0;
margin: calc(var(--scale-p1) * 1rem) 0 0;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__icon,
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__image {
display: none;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__thumbnail {
border: 1px solid rgba(var(--border), 0.35);
border-radius: 999em;
height: 60px;
outline: 2px solid rgba(var(--border), 0.035);
overflow: hidden;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 60px;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__thumbnail picture {
display: block;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__thumbnail img {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
-o-object-fit: cover;
object-fit: cover;
}
.blocktype-pullquote__logo img.img-square,
.blocktype-pullquote__logo img[data-img-format=square] {
height: 45px;
width: 45px;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__logo {
display: block;
margin: 0 0 calc(2.986 * 1rem);
margin: 0 0 calc(var(--scale-p7) * 1rem);
order: -1;
}
@media (max-width: 992px) {
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__logo {
display: none;
}
}
.blocktype-pullquote__logo img.img-portrait,
.blocktype-pullquote__logo img[data-img-format=portrait] {
height: auto;
max-width: 55px;
min-width: 55px;
}
.blocktype-pullquote__logo img.img-landscape,
.blocktype-pullquote__logo img[data-img-format=landscape] {
height: auto;
max-width: 3rem;
min-width: 90px;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__logo img {
-o-object-fit: contain;
object-fit: contain;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__credits {
align-items: center;
display: grid;
grid-gap: 12px;
grid-template-columns: auto 1fr;
margin-top: 42px;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__text {
display: flex;
flex-direction: column;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (max-width: 992px) {
.blocktype-pullquote__logo img.img-square {
height: 30px;
width: 30px;
}
.blocktype-pullquote[data-blockquote-img] .blocktype-pullquote__credits {
margin-top: calc(2.074 * 1rem);
margin-top: calc(var(--scale-p5) * 1rem);
}
}
.blocktype-pullquote:not([data-blockquote-img]) {
grid-template-columns: 1fr;
text-align: center;
}
.blocktype-pullquote:not([data-blockquote-img]) .blocktype-pullquote__gradient,
.blocktype-pullquote:not([data-blockquote-img]) .blocktype-pullquote__image {
display: none;
}
.blocktype-pullquote:not([data-blockquote-img]) .blocktype-pullquote__credits {
margin-top: 30px;
}
.blocktype-pullquote:not([data-blockquote-img]) .blocktype-pullquote__text {
align-items: flex-start;
display: flex;
flex-direction: column;
justify-content: flex-start;
line-height: 1.125;
}
.blocktype-pullquote:not([data-blockquote-img]) .blocktype-pullquote__content {
text-align: left;
}
.blocktype-pullquote:not([data-blockquote-img]) .blocktype-pullquote__logo {
margin-bottom: 120px;
margin-top: 0;
order: -1;
}
@media (max-width: 992px) {
.blocktype-pullquote__content {
font: var(--type-h4);
font-weight: 500;
line-height: 1.563;
}
}
@media (min-width: 992px) {
.blocktype-pullquote__credits {
font: 400 calc(1.2 * 1rem) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p-lg);
}
}
@media (min-width: 1200px) {
.blocktype-pullquote__content {
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
font-weight: 500;
line-height: 1.563;
}
}
body[data-template-type=advisor] .large-pullquote__thumbnail,
body[data-template-type=ambassador] .large-pullquote__thumbnail {
display: none !important;
}
.blocktype-2ximg {
margin-top: 1.563rem;
}
.blocktype-2ximg:first-child {
margin-top: 0;
}
.blocktype-2ximg figure {
margin: 0 !important;
padding: 0 !important;
}
.blocktype-2ximg--container {
align-items: center;
display: grid;
gap: 1.563rem;
grid-gap: 1.563rem;
grid-template-columns: repeat(2, 1fr);
}
.blocktype-2ximg--container .blocktype-image--wrapper::before {
display: none;
}
@media (max-width: 992px) {
.blocktype-2ximg--wrapper {
grid-template-columns: 1fr;
}
}
.blocktype-2ximg--caption {
color: #64748b;
color: var(--color-slate-500);
font-size: 14px;
margin-top: 1em;
}
.blocktype-2ximg picture {
border-radius: 12px;
box-shadow: rgba(50, 50, 93, 0.25) 0 2px 5px -1px, rgba(0, 0, 0, 0.3) 0 1px 3px -1px;
display: block;
margin: 0 !important;
overflow: hidden;
padding: 0 !important;
width: 100%;
}
.blocktype-2ximg picture img {
height: auto;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
/* Blocktype Image Square */
.particle-article__content > .blocktype-image[data-img-format=square] {
margin-bottom: 1.563rem;
margin-bottom: var(--blocktype-gutter-y);
padding: 0 1.563rem;
padding: 0 var(--blocktype-gutter-x);
position: relative;
}
.particle-article__content > .blocktype-image[data-img-format=square] .blocktype-image--wrapper {
padding-top: 1.563rem;
padding-top: var(--blocktype-gutter-y);
position: relative;
}
.particle-article__content > .blocktype-image[data-img-format=square] .blocktype-image--wrapper::before {
background-image: linear-gradient(to right, rgba(191, 212, 16, 0.36), rgba(195, 232, 74, 0.15), rgba(172, 234, 73, 0.15), rgba(106, 227, 94, 0.15), rgba(99, 207, 163, 0.47), rgba(99, 213, 250, 0.72), rgba(80, 177, 248, 0.48), rgba(62, 140, 245, 0.45), rgba(113, 105, 246, 0.15), rgba(159, 73, 246, 0.15), rgba(201, 51, 246, 0.15));
border-radius: 12px;
bottom: 0;
content: "";
display: block;
filter: blur(60px);
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
transform: scale(0.7);
width: 100%;
}
.particle-article__content > .blocktype-image[data-img-format=square] picture {
border-radius: 12px;
display: block;
margin: auto;
max-width: 500px;
overflow: hidden;
position: relative;
width: 100%;
z-index: 1;
}
.particle-article__content > .blocktype-image[data-img-format=square] figcaption {
font-size: 14px;
margin: 8px auto 0;
max-width: 500px;
position: relative;
text-align: center;
z-index: 1;
}
.blocktype-image picture {
box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
}
.particle-article__content > .blocktype-image .blocktype-image--wrapper:last-child,
.particle-article__content > .blocktype-2ximg .blocktype-2ximg--wrapper,
.particle-article__content > .blocktype-6ximg .blocktype-6ximg--wrapper {
margin-bottom: 1.563rem;
margin-bottom: var(--blocktype-gutter-y);
margin-top: 1.563rem;
margin-top: var(--blocktype-gutter-y);
}
.blocktype-image:first-child {
margin-top: 0;
}
.blocktype-image:last-child {
margin-bottom: 0;
}
.blocktype-2ximg .blocktype-image .blocktype-image--wrapper,
.blocktype-6ximg .blocktype-image .blocktype-image--wrapper {
margin-bottom: 0;
margin-top: 0;
}
.blocktype-6ximg--container {
align-items: center;
display: grid;
gap: 12px;
grid-gap: 12px;
grid-template-columns: repeat(4, 1fr);
}
@media (min-width: 992px) {
.blocktype-6ximg--container {
grid-template-columns: repeat(6, 1fr);
}
}
.blocktype-image + .blocktype-heading,
.blocktype-heading + .blocktype-image {
margin-top: 0;
}
.particle-article__content > #overview-1 + .blocktype-image .blocktype-image--wrapper,
.particle-article__content > #introduction-1 + .blocktype-image .blocktype-image--wrapper,
.particle-article__content > .blocktype-image:first-child .blocktype-image--wrapper {
padding-top: 0;
}
.particle-article__content > .blocktype-image:last-child .blocktype-image--wrapper,.particle-article__content > .blocktype-image .blocktype-image--wrapper:not(:last-child) {
padding-bottom: 0;
}
.particle-article__content > .blocktype-image[data-img-format=square] .blocktype-image--wrapper:not(:last-child) + * {
padding-bottom: 1.563rem;
}
.blocktype-image {
margin-top: 1.563rem;
}
.blocktype-image + .blocktype-image,h2.blocktype-heading + .blocktype-image,
p.blocktype-paragraph + .blocktype-image {
margin-top: 0;
}
h2.blocktype-heading + .blocktype-image[data-img-format=square] {
margin-top: 2rem;
}
.blocktype-image[data-img-format=square] + .blocktype-paragraph,
.blocktype-image + .blocktype-paragraph,.blocktype-image:first-child {
margin-top: 0;
}
.blocktype-image figcaption {
color: #64748b;
color: var(--color-slate-500);
margin-bottom: 1.563rem;
margin-top: 0.5em;
}
.blocktype-image--wrapper {
border-radius: 12px;
overflow: hidden;
}
.blocktype-image--wrapper picture img {
border-radius: 12px;
display: block;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.swiper-slide figure,.swiper-slide picture {
padding: 0 !important;
}
.swiper-slide picture {
max-width: 100% !important;
}
.blocktype-6ximg--container figure {
background-color: none !important;
background-image: none;
margin: 0 !important;
padding: 0 !important;
}
.main-grid {
display: grid;
/* mobile = 3 */
/* desktop 12 */
grid-template-columns: repeat(3, 1fr);
}
.main-grid .grid-item {
padding: 1em;
}
@media (min-width: 992px) {
.main-grid {
grid-template-columns: repeat(12, 1fr);
}
}
.blocktype-readmore {
position: relative;
}
.blocktype-readmore[aria-expanded=false] {
overflow: hidden;
}
.blocktype-readmore[aria-expanded=false] > * {
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.blocktype-readmore[aria-expanded=false] button.read-more {
pointer-events: auto;
-webkit-user-select: auto;
-moz-user-select: auto;
user-select: auto;
}
.blocktype-readmore[aria-expanded=true]::after {
background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
opacity: 0;
z-index: -1;
}
.blocktype-readmore[aria-expanded=false] [aria-hidden=true] {
display: none;
}
.blocktype-readmore button.read-less,
.blocktype-readmore button.read-more {
display: block;
position: relative;
z-index: 2;
}
.blocktype-readmore button {
border: 0px solid;
font-size: 1rem;
font-weight: 600;
height: 40px;
line-height: 40px;
padding: 0;
text-decoration: underline;
text-decoration-color: #cbd5e1;
text-decoration-color: var(--color-slate-300);
text-underline-offset: 0.25em;
transition-duration: 150ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: color, text-decoration-color;
}
.blocktype-readmore button:hover,
.blocktype-readmore button:focus {
border-color: transparent;
color: #0f172a;
color: var(--color-slate-900);
outline: 0;
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
.blocktype-readmore button:focus {
outline: 0;
}
.blocktype-readmore button:active {
top: 1px;
}
/* =========================================================*/
/* Blocktype Alert */
/* =========================================================*/
.blocktype-alert-container {
--color-border: var(--page-primary-hex);
--color-icon: var(--page-primary-hex);
--gradient-color-1: var(--page-primary-hex);
--gradient-color-2: var(--page-secondary-hex);
position: relative;
margin-bottom: 1.563rem;
margin-top: 1.563rem;
}
.blocktype-alert-container:first-child {
margin-top: 0;
}
.blocktype-alert-container:last-child {
margin-bottom: 0;
}
@media (max-width: 768px) {
.blocktype-alert-container {
margin-left: 0;
}
}
.blocktype-alert-container[data-type=inherit] {
--gradient-color-1: #9E9E9E;
--gradient-color-2: #607D8B;
--color-border: var(--color-primary-500);
--color-icon: var(--color-primary-500);
}
.blocktype-alert-container[data-type=info] {
--gradient-color-1: #9E9E9E;
--gradient-color-2: #607D8B;
--color-link: var(--color-slate-400);
--color-border: var(--color-slate-400);
--color-icon: var(--color-slate-400);
}
.blocktype-alert-container[data-type=danger] {
--gradient-color-1: #FF5722;
--gradient-color-2: #ff2a00;
--color-link: #ff2a00;
--color-border: #F44336;
--color-icon: #F44336;
}
.blocktype-alert-container[data-type=warning] {
--gradient-color-1: #fffc0f;
--gradient-color-2: var(--color-accent-1-800);
--color-link: var(--color-accent-1-800);
--color-border: var(--color-accent-1-800);
--color-icon: var(--color-accent-1-800);
}
.blocktype-alert-container[data-type=success] {
--gradient-color-1: #00b300;
--gradient-color-2: #00b300;
--color-link: #00b300;
--color-border: #00b300;
--color-icon: #00b300;
}
.blocktype-alert-container::before,
.blocktype-alert-container::after {
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: -1;
}
.blocktype-alert-container::before {
--line: var(--color-slate-100);
--size: 55px;
background: linear-gradient(90deg, #f1f5f9 1px, transparent 1px 55px) 50% 50%/55px 55px, linear-gradient(#f1f5f9 1px, transparent 1px 55px) 50% 50%/55px 55px;
height: 85%;
-webkit-mask: linear-gradient(-15deg, transparent 30%, white);
mask: linear-gradient(-15deg, transparent 30%, white);
width: 100%;
z-index: -2;
}
@supports (background: linear-gradient(red 0%, red 0% 1%, red 2%)){
.blocktype-alert-container::before {
background: linear-gradient(90deg, var(--line) 1px, transparent 1px var(--size)) 50% 50%/var(--size) var(--size), linear-gradient(var(--line) 1px, transparent 1px var(--size)) 50% 50%/var(--size) var(--size);
}
}
.blocktype-alert-container::after {
background: linear-gradient(270deg, var(--gradient-color-1), var(--gradient-color-2));
background-size: 200% 200%;
filter: blur(25px);
height: 47%;
left: 2%;
margin: 0 auto;
opacity: 0.25;
right: inherit;
top: 50%;
transform: translateY(-50%);
width: 45%;
z-index: -1;
}
.blocktype-alert {
align-items: center;
background-color: white;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 0 6px 6px 0;
color: #475569;
color: var(--color-slate-600);
display: flex;
justify-content: flex-start;
position: relative;
}
.blocktype-alert .blocktype-alert__meta p {
text-wrap: balance;
}
.blocktype-alert__header {
align-items: center;
color: #0f172a;
color: var(--color-slate-900);
display: flex;
justify-content: space-between;
padding: 1.25rem;
padding-bottom: 0;
position: relative;
text-align: left;
}
.blocktype-alert__header:last-child {
padding-bottom: 1.25rem;
}
.blocktype-alert .blocktype-alert__title {
font-size: calc(1.2 * 1rem);
font-size: var(--rem2);
font-weight: 600;
line-height: 1;
margin: 0;
padding: 0;
text-decoration: underline;
text-decoration-thickness: inherit;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
}
.blocktype-alert .blocktype-alert__icon {
align-items: center;
background-color: white;
border-radius: 999em;
color: var(--color-icon);
display: flex;
font-size: calc(1.2 * 1rem);
font-size: var(--rem2);
justify-content: center;
left: 0px;
padding: 8px;
position: absolute;
top: 0px;
transform: translate(calc(-50% - 1.5px), -50%);
}
.blocktype-alert .blocktype-alert__meta {
padding: 0.825rem 1.25rem 1.25rem 1.25rem;
}
.blocktype-alert .blocktype-alert__meta:empty {
display: none;
}
.blocktype-alert .blocktype-alert__meta ul,
.blocktype-alert .blocktype-alert__meta ol,
.blocktype-alert .blocktype-alert__meta p,
.blocktype-alert .blocktype-alert__meta code {
color: #475569;
color: var(--color-slate-600);
font-family: inherit;
font-size: 1rem;
-webkit-font-smoothing: auto;
font-weight: 400;
line-height: 1.563;
max-width: 100%;
vertical-align: baseline;
}
.blocktype-alert .blocktype-alert__meta code {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
border-radius: 0.25em;
padding: 0.25em 0.35em;
}
.blocktype-alert .blocktype-alert__meta p:not(:first-child) {
margin-top: 1em;
}
.blocktype-alert .blocktype-alert__meta p a {
font-weight: 500;
text-decoration: underline;
text-underline-offset: 0.15em;
}
.blocktype-alert .blocktype-alert__meta p a,.blocktype-alert .blocktype-alert__meta p a:hover,
.blocktype-alert .blocktype-alert__meta p a:focus {
color: var(--color-link);
text-decoration-color: var(--color-link);
}
.blocktype-alert:not(:first-child) {
margin: calc(1.2 * 1rem) 0 !important;
margin: calc(var(--scale-p2) * 1rem) 0 !important;
}
.blocktype-alert:first-child {
margin-bottom: calc(1.2 * 1rem) !important;
margin-bottom: calc(var(--scale-p2) * 1rem) !important;
}
.blocktype-alert:last-child {
margin-bottom: 0 !important;
}
/* .blocktype-blockquote:not(:first-child) {
margin-top: 1.563rem;
}
.blocktype-blockquote p {
margin-top: 0;
font-weight: 400;
line-height: 1.563;
}
.blocktype-blockquote p:not(:last-child) {
margin-block-start: 0;
margin-block-end: 0;
}
.blocktype-blockquote__footer {
display: flex;
justify-content: flex-start;
align-items: center;
gap: 1rem;
margin-top: 6px;
font-size: 1rem;
}
.blocktype-blockquote__cite {
margin-bottom: 0 !important;
}
.blocktype-blockquote__author_details {
margin-top: 0;
}
.blocktype-blockquote__cite .blocktype-blockquote__author_name {}
.blocktype-blockquote__cite .blocktype-blockquote__author_title,
.blocktype-blockquote__cite .blocktype-blockquote__author_company {
}
.blocktype-blockquote__cite span {}
.blocktype-blockquote__picture {
display: block;
outline: 2px solid rgba(var(--page-primary-rgb), .15);
border: 1px solid rgba(var(--page-primary-rgb), .55);
border-radius: 999em;
width: 52px;
height: 52px;
min-width: 52px;
min-height: 52px;
overflow: hidden;
}
@media (max-width: 768px) {
.blocktype-blockquote[data-blockquote-img] {
max-width: 768px;
border-left: none;
margin-left: 0;
border-width: 1px;
border-style: solid;
border-color: rgba(var(--page-primary-rgb), .15);
border-radius: 6px;
margin-top: 1.563rem;
padding: 1rem;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}
}
.blocktype-blockquote__picture img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.blocktype-blockquote__author_title,
.blocktype-blockquote__author_company {
font-weight: 400;
}
*/
.blocktype-blockquote p,
.blocktype-blockquote cite {
display: inline;
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
}
.blocktype-blockquote {
margin-bottom: 1.25rem;
margin-left: 0;
margin-top: 1.25rem;
padding-left: 1.25rem;
}
@media (min-width: 1024px) {
.blocktype-blockquote {
margin-bottom: 1.25em;
margin-left: -1.25em;
margin-top: 1.25em;
}
}
.blocktype-blockquote::before {
background-color: #e2e8f0;
background-color: var(--color-slate-200);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 3px;
}
.blocktype-blockquote {
border: none;
margin-bottom: 1.563rem;
padding: 1rem 1.563rem;
padding-left: 1.563rem;
position: relative;
}
.blocktype-blockquote picture {
display: block;
height: 60px;
width: 60px;
}
.blocktype-blockquote p,
.blocktype-blockquote cite {
display: inline-block;
margin-top: 0;
}
@keyframes pulse-btn {
0% {
box-shadow: 0 0 0 0 rgba(var(--page-primary-rgb), 0.7);
transform: scale(0.95) translateY(-50%);
}
70% {
box-shadow: 0 0 0 10px rgba(var(--page-primary-rgb), 0);
transform: scale(1) translateY(-50%);
}
100% {
box-shadow: 0 0 0 0 rgba(var(--page-primary-rgb), 0);
transform: scale(0.95) translateY(-50%);
}
}
@keyframes pulse-sound {
10% {
box-shadow: inset 0 -4px 0;
}
30% {
box-shadow: inset 0 -10px 0;
}
60% {
box-shadow: inset 0 -6px 0;
}
80% {
box-shadow: inset 0 -8px 0;
}
to {
box-shadow: inset 0 -2px 0;
}
}
@keyframes spinner-alt {
0% {
transform: rotate(0deg);
}
to {
transform: rotate(359deg);
}
}
.particle-topic__container .ico-spin {
background-color: rgba(255, 255, 255, 0.3);
border-radius: 999em;
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
color: #007bff;
color: var(--color-primary-500);
left: 50%;
position: absolute !important;
top: 50%;
transform: translate(-50%, -50%);
z-index: 1000;
}
.particle-topic__container .ico-spin.is-hidden {
display: none;
}
.particle-topic__container .ico-spin,
.particle-topic__container .ico-spin::before {
box-sizing: border-box;
display: block;
height: 20px;
position: relative;
width: 20px;
}
.particle-topic__container .ico-spin::before {
animation: spinner-alt 1s cubic-bezier(0.6, 0, 0.4, 1) infinite;
border: 3px solid transparent;
border-radius: 100px;
border-top-color: currentColor;
content: "";
position: absolute;
}
.particle-topic__container .ico-podcast,
.particle-topic__container .ico-podcast::after,
.particle-topic__container .ico-podcast::before {
animation: pulse-sound 1.3s ease infinite alternate;
box-shadow: inset 0 -12px 0;
box-sizing: border-box;
display: block;
height: 12px;
width: 2px;
}
.particle-topic__container .ico-podcast {
position: relative;
transform: scale(1);
}
.particle-topic__container .ico-podcast::after,
.particle-topic__container .ico-podcast::before {
bottom: 0;
content: "";
position: absolute;
}
.particle-topic__container .ico-podcast::before {
animation-delay: -2.4s;
left: -4px;
}
.particle-topic__container .ico-podcast::after {
animation-delay: -3.7s;
right: -4px;
}
.particle-topic__widget {
--particle-radius: 8px;
--particle-border-color: rgba(var(--page-primary-rgb), 0.5);
--particle-video-border-radius: 8px;
background-image: linear-gradient(to right, rgba(var(--page-primary-rgb), 0.03), #FFFFFF);
background-image: linear-gradient(to right, rgba(var(--page-primary-rgb), 0.03), var(--color-white));
border-radius: 8px;
border-radius: var(--particle-video-border-radius);
margin: 0;
}
.particle-topic__video {
margin-bottom: 1.266em;
position: relative;
transition-duration: 200ms;
transition-property: height;
will-change: height;
}
@media print {
.particle-topic__container {
display: none !important;
}
}
@media (min-width: 1100px) {
.particle-topic__video,
.particle-topic__widget {
--particle-video-border-radius: 0.25em;
}
.particle-topic__widget {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-radius: var(--particle-video-border-radius);
margin-bottom: 2rem;
padding: 1.563rem;
}
}
.particle-topic__container .video-widget {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid var(--particle-border-color);
border-radius: 8px;
box-shadow: 0 0 0 0.25em rgba(var(--page-primary-rgb), 0.08), rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
cursor: pointer;
display: grid;
grid-template-columns: 90px 1fr;
max-width: 100%;
max-width: 460px;
min-height: 90px;
position: relative;
transition-duration: 200ms;
transition-property: box-shadow, border;
transition-timing-function: ease-in-out;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: box-shadow, border;
}
.particle-topic__container .video-widget:hover,
.particle-topic__container .video-widget:focus,
.particle-topic__container .video-widget:active {
border: 1px solid var(--particle-border-color);
box-shadow: 0 0 0 0.25em rgba(var(--page-primary-rgb), 0.08), rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
}
.particle-topic__container .video-widget[aria-hidden=true] {
height: 0;
opacity: 0;
}
.particle-topic__container .video-widget__aside {
background-color: white;
border-radius: 8px 0 0 8px;
border-right: 1px solid var(--particle-border-color);
height: 90px;
position: relative;
width: 90px;
}
@media (max-width: 768px) {
.particle-topic__container .video-widget {
min-height: 95px;
}
.particle-topic__container .video-widget__aside {
height: 95px;
}
}
.particle-topic__container .video-widget__btn {
align-items: center;
background-color: rgba(var(--page-primary-rgb-darker), 1);
border: 1px solid rgba(#FFFFFF, 1);
border: 1px solid rgba(var(--color-white), 1);
border-radius: 6px;
border-radius: 999em;
color: #FFFFFF;
color: var(--color-white);
cursor: pointer;
display: flex;
font-size: 12px;
height: 32px;
justify-content: center;
position: absolute;
right: -16px;
top: 50%;
transform: translateY(-50%);
transition-duration: 200ms;
transition-property: all;
width: 32px;
will-change: all;
}
.particle-topic__container .video-widget__btn:focus {
outline: none;
}
.particle-topic__container .video-widget:hover .video-widget__btn,
.particle-topic__container .video-widget:focus-within .video-widget__btn {
animation: pulse-btn 2s infinite;
}
.particle-topic__container .video-widget__icon {
color: #80bdff;
color: var(--page-primary-hex);
position: absolute;
right: 1rem;
top: 1rem;
}
.particle-topic__container .video-widget__avatar img {
border-radius: 8px 0 0 8px;
display: block;
height: 150px;
margin-top: -40px;
-o-object-fit: cover;
object-fit: cover;
width: auto;
}
@media (max-width: 768px) {
.particle-topic__container .video-widget__avatar img {
height: 123px;
margin-top: -29px;
}
}
@media (min-width: 1380px) {
.particle-topic__container .video-widget__avatar img {
height: 140px;
margin-top: -50px;
}
}
.particle-topic__container .video-widget__header {
box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
display: flex;
flex-direction: column;
justify-content: center;
padding-left: 2rem;
padding-right: 2rem;
}
.particle-topic__container .video-widget__header_title {
color: #1e293b;
color: var(--color-slate-800);
font-size: 20px;
font-weight: 500;
line-height: 1;
max-width: 140px;
}
@media (max-width: 768px) {
.particle-topic__container .video-widget__header_title {
max-width: 130px;
}
}
@media (min-width: 992px) {
.particle-topic__container .video-widget__header_title {
font-size: 1.125rem;
max-width: 200px;
}
}
.particle-topic__container .video-widget__header_time {
align-items: center;
bottom: 1rem;
color: #6c757d;
color: var(--color-grey);
display: flex;
font-feature-settings: "kern" 1, "liga" 0, "calt" 0, "pnum" 0, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
font-size: 15px;
margin-top: 5px;
position: absolute;
right: 1rem;
}
.particle-topic__container .video-widget__header_time i {
font-size: 12px;
margin-right: 0.25em;
}
.particle-topic__container .particle-topic__title h2 {
font-weight: 700;
margin-bottom: 1rem;
}
@media (min-width: 1100px) {
.particle-topic__container .particle-topic__title h2 {
margin-bottom: 2rem;
}
}
.blocktype-helpcenter-item h2:first-child {
margin-top: 0;
}
.blocktype-helpcenter-item {
border-bottom: 1px solid #d2d2d2;
border-bottom: 1px solid var(--color-grey-light);
margin-bottom: 60px;
padding-bottom: 60px;
}
.blocktype-helpcenter-item:last-child {
border-bottom: none;
margin-bottom: 0;
padding-bottom: 0;
}
@media (min-width: 1366px) {
.page-help-center-topic section[data-page-style=left] .particle-article__wrapper {
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: minmax(300px, 340px) 1fr;
}
#particleToc {
max-width: 430px;
}
}
@media (max-width: 1100px) {
#particleToc {
display: none;
}
}
.blocktype-loop:not(:first-child) {
margin-top: 24px;
}
.blocktype-loop:not(:last-child) {
margin-bottom: 24px;
}
.blocktype-loop--wrapper {
display: flex;
flex-wrap: wrap;
gap: 12px;
}
.blocktype-loop--card a {
display: block;
}
.blocktype-loop--card picture {
aspect-ratio: 1/1;
display: flex;
height: 100%;
position: relative;
width: 100%;
}
.blocktype-loop--card picture img {
display: block;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
}
.blocktype-loop[data-post-style="0"] .blocktype-loop--card {
border: 1px solid rgba(0, 0, 0, 0.1);
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
outline: 3px solid rgba(0, 0, 0, 0);
outline-offset: 12px;
overflow: hidden;
transition-duration: 250ms;
transition-property: box-shadow, border-color, outline, outline-offset;
width: 100px;
will-change: box-shadow, border-color, outline, outline-offset;
}
.blocktype-loop[data-post-style="0"] .blocktype-loop--card:hover {
box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}
.blocktype-loop[data-post-style="0"] .blocktype-loop--card:focus,
.blocktype-loop[data-post-style="0"] .blocktype-loop--card:focus-within {
border: 1px solid rgba(0, 0, 0, 0.35);
box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 15px -3px, rgba(0, 0, 0, 0.05) 0px 4px 6px -2px;
outline: 3px solid rgba(0, 0, 0, 0.1);
outline-offset: 0;
}
/* Heading */
/* h2.blocktype-heading,
h3.blocktype-heading,
h4.blocktype-heading {
position: relative;
margin: var(--em-p6) 0 var(--em-n5);
font-weight: 600;
}
h2.blocktype-heading + h3,
h4.blocktype-heading + h5 {
margin-top: var(--em-p2);
font-weight: 600;
}
h2.blocktype-heading + h3 + p {
margin-top: 0;
}
h2.blocktype-heading {
font: 600 calc(var(--scale-p4) * 1rem) / var(--scale-p2) var(--heading-ff);
} */
h2.blocktype-heading a.heading-link,
h3.blocktype-heading a.heading-link,
h4.blocktype-heading a.heading-link,
h5.blocktype-heading a.heading-link {
color: #cbd5e1;
color: var(--color-slate-300);
font-size: 80%;
font-size: 20px;
font-weight: 500;
left: -33px;
opacity: 0;
position: absolute;
top: calc(50% + 3px);
transform: translateY(-50%);
transition-delay: 150ms, 0s;
transition-duration: 150ms;
transition-property: opacity, color;
width: 30px;
will-change: opacity, color;
}
h2.blocktype-heading:hover a.heading-link,
h3.blocktype-heading:hover a.heading-link {
opacity: 1;
}
h2.blocktype-heading:hover a.heading-link:hover,
h3.blocktype-heading:hover a.heading-link:hover,
h2.blocktype-heading:hover a.heading-link:focus,
h3.blocktype-heading:hover a.heading-link:focus {
color: #64748b;
color: var(--color-slate-500);
}
.blocktype-heading + .blocktype-accordion {
margin-top: 1.563rem;
}
.blocktype-heading:first-child {
margin-top: 0;
}
.blocktype-heading:last-child {
margin-bottom: 0;
}
@media (max-width: 992px) {
h2.blocktype-heading:hover a.heading-link,
h3.blocktype-heading:hover a.heading-link {
display: none;
}
}
.blocktype-heading--hidden {
display: none;
}
.blocktype-heading--hidden + * {
border-top: 0;
margin-top: 0;
padding-top: 0;
}
.blocktype-button {
display: block;
margin-top: 1.563rem;
}
.blocktype-button:first-child {
margin-top: 0;
}
.blocktype-button > a,
.blocktype-button > button {
--icon-size: 48px;
--border-color: var(--color-slate-200);
--text-color: var(--color-slate-800);
border: 1px solid #e2e8f0;
border: 1px solid var(--border-color);
border-radius: 6px;
box-shadow: rgba(50, 50, 93, 0.05) 0 2px 5px -1px, rgba(0, 0, 0, 0.03) 0 1px 3px -1px;
color: #1e293b;
color: var(--text-color);
display: inline-flex;
font-weight: 600;
height: auto;
outline: 3px solid rgba(var(--page-primary-rgb), 0);
outline-offset: 0.45em;
padding: 0;
position: relative;
text-decoration: none;
transform: translateY(0);
transition: box-shadow 300ms, background-color 300ms, color 300ms, transform 300ms, outline-offset 300ms, outline-color 300ms, border-color 300ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: -moz-max-content;
width: max-content;
}
.blocktype-button .blocktype-button--txt,
.blocktype-button .blocktype-button--icn {
align-items: center;
display: flex;
height: var(--icon-size);
justify-content: center;
}
.blocktype-button .blocktype-button--txt {
padding: 0 1.563rem;
}
.blocktype-button > a:hover,
.blocktype-button > a:focus,
.blocktype-button > button:hover,
.blocktype-button > button:focus {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-color: #cbd5e1;
border-color: var(--color-slate-300);
box-shadow: rgba(50, 50, 93, 0.1) 0 4px 6px -1px, rgba(0, 0, 0, 0.05) 0 2px 4px -1px;
color: #0f172a;
color: var(--color-slate-900);
transform: translateY(-2px);
}
.blocktype-button > a:focus,
.blocktype-button > button:focus {
border-color: #007bff;
border-color: var(--color-primary-500);
outline: 3px solid rgba(var(--page-primary-rgb), 0.2);
outline-color: rgba(0, 123, 255, 0.25);
outline-color: rgba(var(--color-primary-500-rgb), 0.25);
outline-offset: 0;
}
.blocktype-button > a .blocktype-button--icn,
.blocktype-button > button .blocktype-button--icn {
align-items: center;
display: inline-flex;
position: relative;
}
.blocktype-button .blocktype-button--icn {
align-items: center;
border-left: 1px solid var(--border-color);
border-radius: 0;
color: var(--text-color);
display: flex;
font-size: 18px;
height: var(--icon-size);
justify-content: center;
order: 1;
transition-duration: 300ms;
width: var(--icon-size);
}
.blocktype-form {
margin-top: 1.563rem;
}
.blocktype-form:first-child {
margin-top: 0;
}
.blocktype-form .blocktype-form--wrapper[aria-hidden=true] {
display: none;
}
section[data-page-style] .particle-article__wrapper {
min-height: 0;
min-width: 0;
}
section[data-page-style] .particle-article__content {
min-width: 0;
}
@media (max-width: 992px) {
section[data-page-style=right] .particle-article__wrapper,
section[data-page-style=left] .particle-article__wrapper {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
}
section[data-page-style=left] .particle-article__wrapper {
gap: 1.25rem !important;
}
section[data-page-style=right] .particle-article__wrapper aside,
section[data-page-style=left] .particle-article__wrapper aside {
--header-gutter-y: calc(var(--scale-p7) * 1rem);
--hr-margin: calc(var(--header-gutter-y)* var(--scale-n1));
margin-bottom: 0;
margin-top: 1.25rem;
order: 1;
padding-bottom: 0;
position: relative;
}
section[data-page-style=right] .particle-article__wrapper aside::after,
section[data-page-style=left] .particle-article__wrapper aside::after {
display: none !important;
background-image: linear-gradient(to right, #e2e8f0, white);
background-image: linear-gradient(to right, var(--color-slate-200), white);
bottom: calc(var(--hr-margin) * 0);
content: "";
display: block;
height: 1px;
left: 0;
position: absolute;
right: 0;
width: 100%;
}
}
@media (min-width: 992px) and (max-width: 1365.99px) {
section[data-page-style=right] .particle-article__wrapper {
display: grid;
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: minmax(280px, 320px) 1fr;
}
section[data-page-style=right] .particle-article__content {
order: 1;
}
section[data-page-style=right] .particle-article__aside {
order: -1;
}
}
@media (min-width: 1366px) {
section[data-page-style] .particle-article__wrapper {
border-top: 1px solid #f1f5f9;
border-top: 1px solid var(--color-slate-100);
display: grid;
padding-top: 2rem;
}
section[data-page-style=right] .particle-article__wrapper {
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: minmax(300px, 350px) 1fr;
}
section[data-page-style=right] .particle-article__content {
order: 1;
}
section[data-page-style=right] .particle-article__aside {
margin-top: 0;
order: 0;
}
}
@media (min-width: 992px) {
section[data-page-style=left] .particle-article__wrapper {
display: grid;
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: 1fr minmax(280px, 300px);
}
section[data-page-style=left] .particle-article__content {
order: 0;
}
section[data-page-style=left] .particle-article__aside {
order: 1;
}
}
@media (max-width: 992px) {
section[data-page-style=left] .particle-article__wrapper {
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: 1fr;
}
section[data-page-style=left] .particle-article__content {
order: 1;
}
section[data-page-style=left] .particle-article__aside {
order: 0;
}
}
@media (min-width: 1366px) {
section[data-page-style=left-no-aside] .particle-article__wrapper {
display: grid;
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: 0.7fr;
}
section[data-page-style=left-no-aside] .particle-article__content {
order: 0;
}
section[data-page-style=left-no-aside] .particle-article__aside {
display: none;
}
}
@media (max-width: 1365.98px) {
section[data-page-style=left-no-aside] .particle-article__wrapper {
display: grid;
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: 1fr;
}
section[data-page-style=left-no-aside] .particle-article__content {
order: 1;
}
section[data-page-style=left-no-aside] .particle-article__aside {
order: -1;
}
}
@media (min-width: 1366px) {
section[data-page-style=center] .particle-article__wrapper {
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: 1fr;
margin-left: auto;
margin-right: auto;
max-width: 768px;
}
section[data-page-style=center] .particle-article__content {
order: 0;
}
section[data-page-style=center] .particle-article__aside {
display: none;
}
}
@media (max-width: 1365.98px) {
section[data-page-style=center] .particle-article__wrapper {
grid-gap: calc(1rem * 2);
grid-gap: calc(var(--gutter-x) * 2);
grid-template-columns: 1fr;
}
section[data-page-style=center] .particle-article__content {
margin-left: auto;
margin-right: auto;
order: 0;
width: 100%;
}
section[data-page-style=center] .particle-article__aside {
display: none;
}
}
.section-component.section-header {
--header-gutter-y: 2.25rem;
}
.section-component.section-header[data-size="0"] {
--header-gutter-y: calc(var(--scale-p7) * 1rem);
}
.section-component.section-header header {
padding-bottom: calc(var(--header-gutter-y) * 1.44);
padding-bottom: calc(var(--header-gutter-y) * var(--scale-p3));
padding-top: calc(var(--header-gutter-y) * 0.482);
padding-top: calc(var(--header-gutter-y) * var(--scale-n4));
}
@media (min-width: 1365.99px) {
.section-component.section-header[data-size="0"] header {
padding-bottom: 0;
padding-top: 0;
}
.section-component.section-header .container,.section-component.section-header[data-size="0"][data-align=center][data-icon=false] {
padding-bottom: calc(var(--header-gutter-y) * 1.44);
padding-bottom: calc(var(--header-gutter-y) * var(--scale-p3));
padding-top: calc(var(--header-gutter-y) * 1);
padding-top: calc(var(--header-gutter-y) * var(--scale-p1));
}
.section-component.section-header[data-align=left][data-size="0"][data-icon=false] header {
padding-bottom: calc(var(--header-gutter-y) * 1.2);
padding-bottom: calc(var(--header-gutter-y) * var(--scale-p2));
padding-top: calc(var(--header-gutter-y) * 1.2);
padding-top: calc(var(--header-gutter-y) * var(--scale-p2));
}
.section-component.section-header[data-align=center][data-size="0"][data-icon=true] header {
padding-bottom: calc(var(--header-gutter-y) * 1.2);
padding-bottom: calc(var(--header-gutter-y) * var(--scale-p2));
padding-top: calc(var(--header-gutter-y) * 0.402);
padding-top: calc(var(--header-gutter-y) * var(--scale-n5));
}
}
@media (max-width: 1024px) {
.section-component.section-header header,
.section-component.section-header[data-size="0"] header {
--hr-margin: calc(var(--header-gutter-y) * var(--scale-n1));
margin-bottom: calc(var(--header-gutter-y) * 0.833);
margin-bottom: calc(var(--header-gutter-y) * var(--scale-n1));
padding-bottom: calc(var(--header-gutter-y) * 0.833);
padding-bottom: calc(var(--header-gutter-y) * var(--scale-n1));
padding-top: calc(var(--header-gutter-y) * 0.482);
padding-top: calc(var(--header-gutter-y) * var(--scale-n4));
}
}
@media (min-width: 1024px) and (max-width: 1365.99px) {
.section-component.section-header header,
.section-component.section-header[data-size="0"] header {
--hr-margin: calc(var(--header-gutter-y) * var(--scale-p2));
margin-bottom: calc(var(--header-gutter-y) * 1.2);
margin-bottom: calc(var(--header-gutter-y) * var(--scale-p2));
padding-bottom: calc(var(--header-gutter-y) * 1.2);
padding-bottom: calc(var(--header-gutter-y) * var(--scale-p2));
padding-top: calc(var(--header-gutter-y) * 0.482);
padding-top: calc(var(--header-gutter-y) * var(--scale-n4));
}
}
.section-component.section-header .section-header__eyebrow {
border-radius: 6px;
font-size: 15px;
font-weight: 600;
margin-bottom: 1.25em;
max-width: -moz-max-content;
max-width: max-content;
padding: 2px;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.section-component.section-header .section-header__eyebrow span {
border-radius: 6px;
display: inline-block;
font-weight: 500;
position: relative;
text-decoration: underline;
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
text-decoration-style: solid;
text-decoration-thickness: initial;
text-underline-offset: 0.1em;
z-index: 1;
}
.section-component.section-header .section-header__heading {
color: #000000;
color: var(--color-black);
font-size: calc(2.074 * 1rem);
font-size: calc(var(--scale-p5) * 1rem);
font-weight: 700;
line-height: 1.125;
margin-bottom: 0.25em;
max-inline-size: 22ch;
text-wrap: balance;
}
.section-component.section-header .section-header__subheading {
color: #334155;
color: var(--color-slate-700);
font-size: calc(1.2 * 1rem);
font-size: calc(var(--scale-p2) * 1rem);
line-height: calc(1.44 * 1);
line-height: calc(var(--scale-p3) * 1);
max-inline-size: 58ch;
text-wrap: balance;
}
.section-component.section-header .section-header__time {
color: #64748b;
color: var(--color-slate-500);
font-size: 16px;
line-height: calc(0.833 * 1);
line-height: calc(var(--scale-n1) * 1);
margin-top: calc(0.833 * 1rem);
margin-top: calc(var(--scale-n1) * 1rem);
}
@media (min-width: 768px) and (max-width: 1023.99px) {
.section-component.section-header .section-header__eyebrow {
font-size: 16px;
}
.section-component.section-header .section-header__heading {
font-size: calc(2.074 * 1rem);
font-size: calc(var(--scale-p5) * 1rem);
}
.section-component.section-header .section-header__subheading {
font-size: calc(1.44 * 1rem);
font-size: calc(var(--scale-p3) * 1rem);
}
}
@media (min-width: 1024px) and (max-width: 1365.99px) {
.section-component.section-header .section-header__eyebrow {
font-size: 17px;
}
.section-component.section-header .section-header__heading {
font-size: calc(2.986 * 1rem);
font-size: calc(var(--scale-p7) * 1rem);
}
.section-component.section-header .section-header__subheading {
font-size: calc(1.44 * 1rem);
font-size: calc(var(--scale-p3) * 1rem);
}
}
@media (min-width: 1366px) and (max-width: 1919.99px) {
.section-component.section-header .section-header__eyebrow {
font-size: 1.25rem;
}
.section-component.section-header .section-header__heading {
font-size: calc(3.583 * 1rem);
font-size: calc(var(--scale-p8) * 1rem);
}
.section-component.section-header .section-header__subheading {
font-size: calc(1.728 * 1rem);
font-size: calc(var(--scale-p4) * 1rem);
}
}
@media (min-width: 1920px) {
.section-component.section-header .section-header__eyebrow {
font-size: 1.25rem;
}
.section-component.section-header .section-header__heading {
font-size: calc(3.583 * 1rem);
font-size: calc(var(--scale-p8) * 1rem);
}
.section-component.section-header .section-header__subheading {
font-size: calc(1.728 * 1rem);
font-size: calc(var(--scale-p4) * 1rem);
}
}
.section-component.section-header[data-align=center] {
text-align: center;
}
.section-component.section-header[data-align=center] header .section-header__wrapper {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
}
.section-component.section-header[data-align=center] header > * {
margin-left: auto;
margin-right: auto;
text-align: center;
}
.section-component.section-header[data-align=center] header .section-header__heading {
max-inline-size: 24ch;
}
@media (max-width: 1365.99px) {
.section-component.section-header header .section-header__wrapper {
display: flex;
flex-direction: column;
}
.section-component.section-header header {
position: relative;
}
.section-component.section-header[data-align=center] header .section-header__wrapper {
align-items: center;
justify-content: center;
}
.section-component.section-header[data-align=center] header .section-header__heading {
max-width: 46.875rem;
}
.section-component.section-header[data-align=center] header .section-header__eyebrow,
.section-component.section-header[data-align=center] header .section-header__heading,
.section-component.section-header[data-align=center] header .section-header__subheading {
text-align: center;
}
.section-component.section-header[data-align=center] header::after {
background-image: linear-gradient(to right, white, #e2e8f0, white);
background-image: linear-gradient(to right, white, var(--color-slate-200), white);
bottom: calc(var(--hr-margin) * 0);
content: "";
display: block;
height: 1px;
left: 0;
position: absolute;
right: 0;
width: 100%;
}
.section-component.section-header[data-align=left] header .section-header__wrapper {
align-items: flex-start;
justify-content: flex-start;
}
.section-component.section-header[data-align=left] header .section-header__eyebrow,
.section-component.section-header[data-align=left] header .section-header__heading,
.section-component.section-header[data-align=left] header .section-header__subheading {
text-align: left;
}
.section-component.section-header[data-align=left] header::after {
background-image: linear-gradient(to right, #e2e8f0, white);
background-image: linear-gradient(to right, var(--color-slate-200), white);
bottom: calc(var(--hr-margin) * 0);
content: "";
display: block;
height: 1px;
left: 0;
position: absolute;
right: 0;
width: 100%;
}
}
.section-component.section-header .section-header__icon {
align-items: center;
background-color: white;
border: 1px solid rgba(var(--page-primary-rgb), 0.45);
border-radius: 999em;
color: #80bdff;
color: var(--page-primary-hex);
display: flex;
font-size: 20px;
height: 50px;
justify-content: center;
margin-bottom: calc(2.074 * 1rem);
margin-bottom: calc(var(--scale-p5) * 1rem);
outline: 3px solid rgba(var(--page-primary-rgb), 0.15);
width: 50px;
}
@media (min-width: 1024px) {
.section-component.section-header[data-align=left] .section-header__icon {
margin-top: calc(2.074 * 1rem);
margin-top: calc(var(--scale-p5) * 1rem);
}
}
@media (min-width: 1366px) {
.section-component.section-header[data-style=gradient] {
position: relative;
}
.section-component.section-header[data-style=gradient]::after {
background: linear-gradient(180deg, #fff 70%, rgba(var(--page-primary-rgb), 0.095) 100%);
bottom: 0;
content: "";
height: calc(100% + 100px);
left: 0;
overflow: hidden;
position: absolute;
right: 0;
top: -100px;
width: 100%;
z-index: -1;
}
.section-component.section-header[data-style=gradient] + section {
background-color: white;
margin-top: 60px;
position: relative;
}
.section-component.section-header[data-style=gradient] + section::before {
content: "";
display: block;
width: 100%;
}
}
@media (max-width: 992px) {
.section-header.w-img .section-header--grid {
display: grid;
grid-template-columns: 1fr;
}
.section-header.w-img .section-header--grid figure {
margin-left: auto;
margin-right: auto;
max-width: 220px;
order: -1;
}
.section-header[data-align=left].w-img header .section-header__eyebrow,
.section-header[data-align=left].w-img header .section-header__heading,
.section-header[data-align=left].w-img header .section-header__subheading {
text-align: center;
}
}
@media (min-width: 992px) {
.section-header.w-img .section-header--grid {
display: grid;
grid-template-columns: 1fr 1fr;
}
.section-header.w-img .section-header--grid figure {
order: 2;
}
}
.blocktype-faqs {
margin-bottom: 1.563rem;
margin-top: 1.563rem;
--faq-padding: 1.563rem;
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 6px;
transition: background-color 150ms, border-color 150ms, box-shadow 150ms;
will-change: background-color, border-color, box-shadow;
}
.blocktype-faqs + .blocktype-faqs {
margin-top: 2.027em;
margin-top: var(--em-p6);
}
.blocktype-faqs h3[aria-expanded=false] + div {
display: none;
}
.blocktype-faqs h3[aria-expanded=true] {
font-weight: 500;
}
.blocktype-faqs .blocktype-faq--title {
color: #64748b;
color: var(--color-slate-500);
font-size: 1rem;
font-weight: 500;
padding: var(--faq-padding) var(--faq-padding) 0 var(--faq-padding);
}
.blocktype-faqs h4[aria-controls],
.blocktype-faqs h3[aria-controls] {
color: #0f172a;
color: var(--color-slate-900);
cursor: pointer;
font-size: 1.125rem;
font-weight: 500;
margin: 0;
padding: var(--faq-padding) 0;
transition: color 150ms;
}
.blocktype-faqs h4[tabindex]:focus,
.blocktype-faqs h3[tabindex]:focus {
color: #0f172a;
color: var(--color-slate-900);
outline: 0;
text-decoration: underline;
}
.blocktype-faqs h4[aria-controls]:not([aria-expanded=true]):hover,
.blocktype-faqs h4[aria-controls]:not([aria-expanded=true]):focus,
.blocktype-faqs h3[aria-controls]:not([aria-expanded=true]):hover,
.blocktype-faqs h3[aria-controls]:not([aria-expanded=true]):focus {
color: #0f172a;
color: var(--color-slate-900);
outline: none;
}
.blocktype-faqs h4[aria-controls][aria-expanded=true],
.blocktype-faqs h3[aria-controls][aria-expanded=true] {
color: #0f172a;
color: var(--color-slate-900);
text-decoration: underline;
}
.blocktype-faqs div[aria-hidden=true] {
display: none;
}
.blocktype-faqs div[aria-hidden=false] {
color: #475569;
color: var(--color-slate-600);
display: block;
margin-top: -1rem;
padding-bottom: 1.563rem;
padding-top: 0;
transition: max-height 150ms, margin-top 150ms;
}
.blocktype-faqs [itemprop=acceptedAnswer] p,
.blocktype-faqs [itemprop=acceptedAnswer] ul {
color: #0f172a;
color: var(--color-slate-900);
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
margin: 0;
}
.blocktype-faqs [itemprop=acceptedAnswer] ul {
list-style: disc outside;
margin-bottom: 1em;
margin-left: 1.25em;
margin-top: 1em;
}
.blocktype-faqs [itemprop=acceptedAnswer] ul:last-child {
margin-bottom: 0;
}
.blocktype-faqs [itemprop=acceptedAnswer] details {
border: 1px solid;
border-color: #cbd5e1;
border-color: var(--color-slate-300);
border-radius: 6px;
cursor: pointer;
padding: 0 1rem;
transition-duration: 150ms;
transition-property: border-color, background-color;
}
.blocktype-faqs [itemprop=acceptedAnswer] details[open] {
padding-bottom: 1rem;
}
.blocktype-faqs [itemprop=acceptedAnswer] details summary {
color: #0f172a;
color: var(--color-slate-900);
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
font-weight: 500;
margin-bottom: 0;
padding: 1rem 0;
}
.blocktype-faqs [itemprop=acceptedAnswer] details:not([open]):hover,
.blocktype-faqs [itemprop=acceptedAnswer] details[open] {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-color: #94a3b8;
border-color: var(--color-slate-400);
}
.blocktype-faqs [itemprop=acceptedAnswer] details + details {
margin-top: 1rem;
}
.blocktype-faqs [itemprop=acceptedAnswer] details summary {
align-items: center;
display: flex;
position: relative;
}
.blocktype-faqs [itemprop=acceptedAnswer] details summary::marker {
content: "";
}
.blocktype-faqs [itemprop=acceptedAnswer] details summary::before {
background-color: white;
background-position: center;
background-repeat: no-repeat;
background-size: 16px 16px;
border: 1px solid rgba(100, 116, 139, 0.25);
border: 1px solid rgba(var(--color-slate-500-rgb), 0.25);
border-radius: 4px;
content: "";
display: flex;
height: 24px;
margin-right: 0.525em;
outline: 3px solid rgba(100, 116, 139, 0.05);
outline: 3px solid rgba(var(--color-slate-500-rgb), 0.05);
width: 24px;
}
.blocktype-faqs [itemprop=acceptedAnswer] details:not([open]) summary::before {
background-image: url('data:image/svg+xml,');
}
.blocktype-faqs [itemprop=acceptedAnswer] details summary::before {
background-image: url('data:image/svg+xml,');
}
.blocktype-faqs ol > li {
border-bottom: 1px solid #cbd5e1;
border-bottom: 1px solid var(--color-slate-300);
border-left: 0px solid transparent;
padding: 0 var(--faq-padding);
}
.blocktype-faqs ol > li h3::before,
.blocktype-faqs ol > li h4::before {
background-color: rgba(0, 123, 255, 0);
background-color: rgba(var(--color-primary-500-rgb), 0);
content: "";
height: 25px;
left: calc(var(--faq-padding) * -1);
position: absolute;
top: 0;
top: calc(var(--faq-padding) * 1);
transition-duration: 150ms;
transition-property: background-color, width;
width: 0px;
will-change: background-color, width;
}
.blocktype-faqs ol > li.is-open h3,
.blocktype-faqs ol > li.is-open h4 {
position: relative;
}
.blocktype-faqs ol > li.is-open h3::before,
.blocktype-faqs ol > li.is-open h4::before {
background-color: rgba(0, 123, 255, 1);
background-color: rgba(var(--color-primary-500-rgb), 1);
width: 4px;
}
.blocktype-faqs *::-moz-selection {
background-color: rgba(0, 0, 0, 0.1);
}
.blocktype-faqs *::selection {
background-color: rgba(0, 0, 0, 0.1);
}
.blocktype-faqs ol > li:last-child {
border-bottom: none;
}
.blocktype-faqs a {
display: inline;
position: relative;
text-decoration: underline;
text-decoration-color: #007bff;
text-decoration-color: var(--color-primary-500);
text-underline-offset: 0.15em;
transition: color 150ms, background-color 150ms, text-decoration-color 150ms;
will-change: color, background-color, text-decoration-color;
}
.blocktype-faqs a [aria-hidden] .blocktype-faqs a:hover,
.blocktype-faqs a:focus {
background-color: rgba(var(--page-primary-rgb), 0.1);
color: #0f172a;
color: var(--color-slate-900);
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
ul.blocktype-list,
ol.blocktype-list {
list-style: disc;
list-style-position: inside;
padding-left: 1rem;
}
ul.blocktype-list-readmore li.read-more,
ol.blocktype-list-readmore li.read-more {
list-style: none;
margin: 12px 0 0;
}
.blocktype-list li.read-more button {
align-items: center;
border: 0px solid;
display: flex;
font-size: inherit;
font-weight: 600;
height: 40px;
line-height: 40px;
padding: 0;
text-decoration: underline;
text-decoration-color: #cbd5e1;
text-decoration-color: var(--color-slate-300);
text-decoration-thickness: 0.1em;
text-underline-offset: 0.25em;
transition-duration: 150ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: color, text-decoration-color;
}
.blocktype-list li.read-more button:hover,
.blocktype-list li.read-more button:focus {
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
.blocktype-list li.read-more button i {
font-size: 80%;
}
ul.blocktype-list-readmore li[aria-hidden=true],
ol.blocktype-list-readmore li[aria-hidden=true] {
display: none;
}
.blocktype-list li {
max-width: 39.292em;
max-width: var(--site-max-length);
}
ul.blocktype-list a,
ol.blocktype-list a {
color: #0f172a;
color: var(--color-slate-900);
font-weight: 500;
text-decoration: underline;
text-decoration-color: #94a3b8;
text-decoration-color: var(--color-slate-400);
text-underline-offset: 0.125em;
}
ul.blocktype-list a:hover,
ol.blocktype-list a:hover,
ul.blocktype-list a:focus,
ol.blocktype-list a:focus {
color: rgba(30, 41, 59, 1);
color: rgba(var(--color-slate-800-rgb), 1);
text-decoration-color: rgba(var(--page-primary-rgb-darker), 1);
}
ul.blocktype-list.blocktype-list-disc,
ol .blocktype-list.blocktype-list-disc {
list-style: disc inside;
}
ul.blocktype-list.blocktype-list-circle,
ol .blocktype-list.blocktype-list-circle {
display: flex;
flex-direction: column;
list-style: none;
margin-left: 0;
}
ul.blocktype-list.blocktype-list-circle li i,
ol .blocktype-list.blocktype-list-circle li i {
margin-right: 7px;
}
ul.blocktype-list.blocktype-list-square,
ol .blocktype-list.blocktype-list-square {
list-style: square inside;
}
ul.blocktype-list.blocktype-list-square li,
ol .blocktype-list.blocktype-list-square li {
align-items: baseline;
display: inline-flex;
}
ul.blocktype-list.blocktype-list-square li i,
ol .blocktype-list.blocktype-list-square li i {
color: #80bdff;
color: var(--page-primary-hex);
}
ul.blocktype-list li ul,
ol.blocktype-list li ol {
margin-bottom: 1.563em;
margin-left: 0;
margin-top: 0;
}
ul.blocktype-list:last-child,
ol.blocktype-list:last-child {
margin-bottom: 0 !important;
}
ul.blocktype-list li ul li::marker,
ol.blocktype-list li ol li::marker {
color: rgba(30, 41, 59, 0.3);
color: rgba(var(--color-slate-800-rgb), 0.3);
}
ul.blocktype-list li ul li ul li::marker,
ol.blocktype-list li ol li ol li::marker {
color: rgba(30, 41, 59, 0.2);
color: rgba(var(--color-slate-800-rgb), 0.2);
list-style: square;
}
ul.blocktype-list > li,
ol.blocktype-list > li {
margin-block-end: 0.15em;
margin-block-start: 0.15em;
position: relative;
}
ul.blocktype-list > li::marker,
ol.blocktype-list > li::marker {
color: rgba(30, 41, 59, 0.4);
color: rgba(var(--color-slate-800-rgb), 0.4);
}
ul.blocktype-list li:last-child,
ol.blocktype-list li:last-child {
margin-bottom: 0;
padding-bottom: 0;
}
ol.blocktype-list-num {
list-style: decimal;
counter-reset: li;
padding-left: 0;
}
ol.blocktype-list-num li {
counter-increment: li;
}
ol.blocktype-list-num li::marker {
content: counters(li, ".") ".";
font-family: inherit;
}
.blocktype-list li.w-icon {
list-style: none;
}
.blocktype-list i.icon-list-dot,
.blocktype-list i.icon-list-dot {
margin-left: -27px;
position: relative;
top: 3px;
}
.blocktype-list i.icon-list-tip,
.blocktype-list i.icon-list-tip {
font-size: 75%;
margin-left: -27px;
position: relative;
top: 0;
}
:root {
--blocktype-h2: 600 24.41px/1.15 var(--font-heading);
--blocktype-h3: 600 19.53px/1.15 var(--font-heading);
--blocktype-h4: 500 16px/1.15 var(--font-heading);
--blocktype-p: 400 16px/1.6 var(--font-body);
--blocktype-link: 600 16px/1.6 var(--font-body);
--blocktype-gutter-y: 1.563rem;
--blocktype-gutter-x: 1.563rem;
}
@media (min-width: 600px) {
:root {
--blocktype-h1: 600 1.563rem/1.25 var(--font-heading);
--blocktype-h2: 600 1.563rem/1.25 var(--font-heading);
--blocktype-h3: 600 1.25rem/1.25 var(--font-heading);
--blocktype-h4: 500 1rem/1.25 var(--font-heading);
--blocktype-p: 400 1rem/1.563 var(--font-body);
--blocktype-link: 600 1rem/1.563 var(--font-body);
}
}
@media (min-width: 1180px) {
html {
font-size: 16px;
}
:root {
--blocktype-h1: 600 1.602rem/1.266 var(--font-heading);
--blocktype-h2: 600 1.424rem/1.266 var(--font-heading);
--blocktype-h3: 600 1.266rem/1.424 var(--font-heading);
--blocktype-h4: 500 1.125rem/1.424 var(--font-heading);
--blocktype-p: 400 1.125rem/1.602 var(--font-body);
--blocktype-link: 450 1.125rem/1.602 var(--font-body);
}
}
.blocktype-heading,
.blocktype-paragraph,
.blocktype-list,
.blocktype-alert {
-webkit-font-smoothing: antialiased;
}
.blocktype-paragraph b,
.blocktype-paragraph strong,
.blocktype-list b,
.blocktype-list strong {
font-weight: 600;
}
.blocktype-paragraph a {
font: 600 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-link);
text-decoration: underline;
text-decoration-color: #cbd5e1;
text-decoration-color: var(--color-slate-300);
-webkit-text-decoration-skip: ink;
text-decoration-skip-ink: auto;
text-decoration-thickness: 1px;
text-underline-offset: 1px;
text-underline-position: from-font;
}
.blocktype-paragraph a:hover,
.blocktype-paragraph a:focus {
color: #000000;
color: var(--color-black);
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
.blocktype-heading {
max-width: 870px;
text-wrap: balance;
}
h2.blocktype-heading {
font: 600 24.41px/1.15 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-h2);
margin-top: 48px;
}
h2.blocktype-heading,h3.blocktype-heading {
color: #1e293b;
color: var(--color-slate-800);
}
h3.blocktype-heading {
font: 600 19.53px/1.15 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-h3);
margin-top: 32px;
}
h4.blocktype-heading {
color: #1e293b;
color: var(--color-slate-800);
font: 500 16px/1.15 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-h4);
font-weight: 600;
margin-bottom: -6px;
margin-top: 24px;
}
h4.blocktype-heading + .blocktype-list {
margin-top: 24px;
}
.blocktype-paragraph,
.blocktype-list {
color: #4F4F4F;
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
margin-block-end: 1em;
margin-block-start: 1em;
text-wrap: pretty;
}
.blocktype-paragraph:first-child,
.blocktype-list:first-child {
margin-top: 0;
}
.blocktype-paragraph:last-child,
.blocktype-list:last-child {
margin-bottom: 0;
}
.blocktype-list {
margin-block-end: 1em;
margin-block-start: 1em;
}
.blocktype-paragraph {
font-feature-settings: normal;
max-width: 870px;
}
.blocktype-paragraph:last-child {
margin-bottom: 0;
}
/*
@media (min-width: 992px) {
:root {
--blocktype-paragraph-font-size: 1.266rem;
--blocktype-paragraph-line-height: 1.602em;
--blocktype-paragraph-margin: 1.2em;
}
}
@media (min-width: 1100px) and (max-width: 1365.98px) {
:root {
--blocktype-paragraph-font-size: 1.125rem;
--blocktype-paragraph-line-height: 1.563;
--blocktype-paragraph-margin: 1.2em;
}
}
@media (min-width: 1366px) {
:root {
--blocktype-paragraph-font-size: 1.25rem;
--blocktype-paragraph-line-height: 1.728;
--blocktype-paragraph-margin: 1.2em;
}
}
.blocktype-paragraph {
font-size: var(--blocktype-paragraph-font-size);
line-height: var(--blocktype-paragraph-line-height);
margin: 0 0 var(--blocktype-paragraph-margin);
font-weight: 400;
}
.blocktype-paragraph>a {
text-decoration: underline;
text-decoration-color: var(--page-primary-hex);
text-decoration-thickness: 1px;
text-decoration-skip-ink: auto;
text-underline-position: from-font;
text-underline-offset: auto;
}
.blocktype-paragraph>a:hover,
.blocktype-paragraph>a:focus {
border-radius: 2px;
background-color: rgba(var(--page-primary-rgb), 0.3);
}
.blocktype-paragraph>a:focus,
.blocktype-paragraph>a:focus-within {} */
.blocktype-gallery:not(:first-child),.blocktype-gallery:not(:last-child) {
margin-top: 24px;
}
section.blocktype-gallery {
margin-bottom: 2.441rem !important;
margin-top: 2.441rem !important;
}
.blocktype-gallery .blocktype-gallery--container,
.blocktype-gallery .blocktype-gallery--wrapper {
position: relative;
}
.blocktype-gallery--caption {
color: #64748b;
color: var(--color-slate-500);
font-size: 13px;
line-height: 1.563;
margin-top: 16px;
max-inline-size: 58ch;
}
.blocktype-gallery {
max-width: 100%;
}
.blocktype-gallery .swiper-3d {
border-radius: 12px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
overflow: visible;
overflow: hidden;
}
.blocktype-gallery .swiper-3d .swiper-slide-shadow {
background: none;
}
.blocktype-gallery img {
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.blocktype-gallery[data-gallery-ar="0"] .blocktype-image--wrapper {
aspect-ratio: 16/9;
}
.blocktype-gallery[data-gallery-ar="1"] .blocktype-image--wrapper {
aspect-ratio: auto;
}
.blocktype-gallery .swiper-slide picture {
align-items: center;
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
margin-left: auto;
margin-right: auto;
position: relative;
}
.blocktype-gallery .swiper-slide:not(.swiper-slide-visible) {
opacity: 0;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.blocktype-gallery .swiper-slide.swiper-slide-next {
opacity: 0;
}
.blocktype-gallery .blocktype-image--wrapper,
.blocktype-gallery .blocktype-image--wrapper picture img {
border-radius: 0;
}
.blocktype-gallery .swiper-slide picture figcaption {
-webkit-backdrop-filter: blur(1vw);
backdrop-filter: blur(1vw);
background-color: rgba(255, 255, 255, 0.95);
bottom: 1.563rem;
display: block;
display: none;
font-size: 12px;
left: 1.563rem;
line-height: 1.563;
margin: 0 auto 0 0;
max-inline-size: 65ch;
max-width: 356px;
padding: 10px;
position: absolute;
text-wrap: balance;
z-index: 1;
}
.blocktype-gallery .swiper-wrapper {
align-items: center;
display: flex;
flex-wrap: nowrap;
position: relative;
}
.blocktype-gallery .blocktype-gallery--navigation {
align-items: center;
border-radius: 0 0 12px 12px;
bottom: 0;
display: flex;
justify-content: space-between;
left: 0;
opacity: 0;
padding: 12px;
position: relative;
position: absolute;
right: 0;
transition-duration: 250ms;
transition-property: opacity;
will-change: opacity;
z-index: 1;
}
.blocktype-gallery .blocktype-gallery--navigation::before {
background-image: linear-gradient(to top, rgba(0, 0, 0, 0.15), rgba(255, 255, 255, 0));
border-radius: 0 0 12px 12px;
bottom: 0;
content: "";
display: block;
height: 60px;
left: 0;
overflow: hidden;
pointer-events: none;
position: absolute;
right: 0;
width: 100%;
z-index: 0;
}
.blocktype-gallery:hover .blocktype-gallery--navigation,
.blocktype-gallery:focus .blocktype-gallery--navigation,
.blocktype-gallery:focus-within .blocktype-gallery--navigation {
opacity: 1;
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows {
align-items: center;
display: flex;
flex-direction: row;
gap: 6px;
justify-content: center;
margin-bottom: 0;
margin-right: 6px;
margin-top: -27px;
padding: 0;
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-prev,
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-next {
align-items: center;
background-color: #80bdff;
background-color: var(--page-primary-hex);
border: 1px solid #fff;
border-radius: 999em;
color: #fff;
display: flex;
font-size: 35px;
height: 35px;
justify-content: center;
left: auto;
margin-top: 0;
outline: 3px solid transparent;
outline-offset: 12px;
padding: 0;
position: relative;
right: auto;
top: auto;
transition-duration: 250ms;
transition-property: background-color, color, opacity, outline-offset, outline-color;
width: 35px;
will-change: background-color, color, opacity, outline-offset, outline-color;
z-index: 10;
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-prev:hover,
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-next:hover {
background-color: white;
color: #80bdff;
color: var(--page-primary-hex);
outline-color: rgba(255, 255, 255, 0.35);
outline-offset: 1px;
outline-width: 1px;
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-prev:focus,
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-next:focus {
background-color: white;
color: #80bdff;
color: var(--page-primary-hex);
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-prev i,
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-next i {
display: block;
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-prev {
order: -1;
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-prev::after,
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-next::after {
display: none;
}
.blocktype-gallery .blocktype-gallery--navigation .blocktype-gallery--arrows .swiper-button-next {
order: 1;
}
/* Pagination */
.blocktype-gallery .blocktype-gallery--pagination {
padding: 0;
}
.blocktype-gallery .blocktype-gallery--pagination,.blocktype-gallery .blocktype-gallery--pagination .swiper-pagination {
align-items: center;
display: flex;
justify-content: center;
}
.blocktype-gallery .blocktype-gallery--pagination .swiper-pagination-bullet {
--swiper-pagination-bullet-inactive-opacity: 0.2;
--swiper-pagination-bullet-inactive-color: #fff;
--swiper-pagination-bullet-active-color: #fff;
--swiper-pagination-bullet-size: 8px;
--swiper-pagination-bullet-border-radius: 50%;
--swiper-pagination-bullet-width: var(--swiper-pagination-bullet-size);
--swiper-pagination-bullet-height: var(--swiper-pagination-bullet-size);
}
.blocktype-gallery .blocktype-gallery--pagination .swiper-pagination-bullet-active {
background-color: #fff;
background-color: #fff;
}
.blocktype-gallery .swiper-slide picture {
width: auto;
}
.blocktype-gallery .swiper-slide picture img {
display: block;
margin: auto;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
}
.blocktype-gallery .blocktype-gallery .swiper-slide {
overflow: hidden;
}
/* Scroll Animation Indicator */
/* .blocktype-gallery .scroll-indicator--backdrop::before {
display: block;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-image: linear-gradient(to top, black, transparent);
width: 100%;
height: 100%;
overflow: hidden;
content: '';
z-index: 10;
user-select: none;
} */
.blocktype-gallery .scroll-indicator--wrapper {
align-items: center;
background-color: #f8fafc;
background-color: var(--color-slate-50);
bottom: 1rem;
display: flex;
flex-direction: column;
justify-content: center;
left: 1rem;
padding: 12px;
position: absolute;
width: 210px;
z-index: 10;
}
.blocktype-gallery .scroll-indicator--wrapper header {
font-size: 14px;
text-align: center;
}
.blocktype-gallery .scroll-indicator--wrapper header p {
color: #0f172a;
color: var(--color-slate-900);
}
.scroll-indicator {
margin-bottom: -9px;
margin-top: 4px;
width: 100%;
z-index: 4;
}
.scroll-indicator .indicator-wrapper {
margin: 0 auto;
transform: translate3d(0, 0, 0);
width: 100%;
}
.scroll-indicator .indicator-wrapper .indicator-cursor {
animation: cursor-swipe-animation 1.2s cubic-bezier(0.23, 1, 0.72, 1) infinite;
height: auto;
position: absolute;
top: 32px;
width: 15px;
z-index: 5;
}
.scroll-indicator .indicator-wrapper .box-container {
height: 50px;
margin-left: auto;
margin-right: auto;
-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0px, rgb(0, 0, 0) 30px, rgb(0, 0, 0) calc(100% - 30px), rgba(0, 0, 0, 0) 100%);
mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0px, rgb(0, 0, 0) 30px, rgb(0, 0, 0) calc(100% - 30px), rgba(0, 0, 0, 0) 100%);
overflow: hidden;
position: relative;
width: 100%;
}
.scroll-indicator .indicator-wrapper .box-container .box-outer {
animation: box-swipe-animation 1.2s cubic-bezier(0.23, 1, 0.72, 1) infinite;
position: relative;
top: calc(50% - 1em - 1px);
}
.scroll-indicator .indicator-wrapper .box-container .box {
aspect-ratio: 16/9;
background-color: #FFF;
border: 1px solid #475569;
border: 1px solid var(--color-slate-600);
border-radius: 6px;
height: 35px;
position: absolute;
}
.scroll-indicator .indicator-wrapper .box-container .box:nth-of-type(0) {
left: 0em;
}
.scroll-indicator .indicator-wrapper .box-container .box:nth-of-type(1) {
left: 4.25em;
}
.scroll-indicator .indicator-wrapper .box-container .box:nth-of-type(2) {
left: 8.5em;
}
.scroll-indicator .indicator-wrapper .box-container .box:nth-of-type(3) {
left: 12.75em;
}
@keyframes cursor-swipe-animation {
0% {
left: 120px;
transform: rotate(30deg);
}
100% {
left: 60px;
transform: rotate(0deg);
}
}
@keyframes box-swipe-animation {
0% {
left: 0px;
}
100% {
left: -5em;
}
}
.blocktype-accordion {
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 6px;
max-width: 768px;
transition: background-color 150ms, border-color 150ms, box-shadow 150ms;
width: 100%;
will-change: background-color, border-color, box-shadow;
}
.blocktype-accordion:not([open]) {
padding-bottom: 0;
}
.blocktype-accordion:hover {
cursor: pointer;
}
.blocktype-accordion:not([open]):hover {
background-color: #f8fafc;
background-color: var(--color-slate-50);
}
.blocktype-accordion[open] {
background-color: white;
border-color: #80bdff;
border-color: var(--page-primary-hex);
box-shadow: 0 1.6px 2.7px rgba(0, 0, 0, 0.02), 0 4.2px 6.9px rgba(0, 0, 0, 0.03), 0 8.5px 14.2px rgba(0, 0, 0, 0.04), 0 17.5px 29.2px rgba(0, 0, 0, 0.05), 0 48px 80px rgba(0, 0, 0, 0.06);
outline: 3px solid rgba(var(--page-primary-rgb), 0.2);
}
.blocktype-accordion:not([open]) > * {
padding: 16px;
}
.blocktype-accordion[open] > * {
padding-left: 16px;
padding-right: 16px;
}
.blocktype-accordion[open] > *:last-child {
padding-bottom: 16px;
}
.blocktype-accordion[open] .blocktype-accordion-title {
padding-bottom: 6px;
padding-top: 16px;
}
@media (min-width: 1024px) {
.blocktype-accordion:not([open]) > * {
padding: 24px;
}
.blocktype-accordion[open] > * {
padding-left: 24px;
padding-right: 24px;
}
.blocktype-accordion[open] > *:last-child {
padding-bottom: 24px;
}
.blocktype-accordion[open] .blocktype-accordion-title {
padding-bottom: 12px;
padding-top: 24px;
}
}
.blocktype-accordion:not([open]):focus,
.blocktype-accordion:not([open]):focus-within {
background-color: rgba(var(--page-primary-rgb), 0.05);
border-color: #80bdff;
border-color: var(--page-primary-hex);
outline: 3px solid rgba(var(--page-primary-rgb), 0.2);
}
.blocktype-accordion + .blocktype-accordion {
margin-top: 1rem;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 1024px) {
.blocktype-accordion + .blocktype-accordion {
margin-top: calc(1.728 * 1em);
margin-top: calc(var(--scale-p4) * 1em);
}
}
.blocktype-accordion a {
color: #0f172a;
color: var(--color-slate-900);
display: inline;
font-weight: 500;
line-height: 1.25;
position: relative;
text-decoration: underline;
text-decoration-color: #cbd5e1;
text-decoration-color: var(--color-slate-300);
text-underline-offset: 0.15em;
transition: color 150ms, background-color 150ms, text-decoration-color 150ms;
will-change: color, background-color, text-decoration-color;
}
.blocktype-accordion a:hover,
.blocktype-accordion a:focus {
background-color: rgba(var(--page-primary-rgb), 0.1);
color: #0f172a;
color: var(--color-slate-900);
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
.blocktype-accordion img {
border-radius: 12px;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
overflow: hidden;
pointer-events: none;
}
.blocktype-accordion img,.blocktype-accordion .blocktype-accordion-title {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.blocktype-accordion .blocktype-accordion-title {
align-items: center;
display: flex;
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
font-weight: 500;
gap: 12px;
justify-content: flex-start;
position: relative;
}
.blocktype-accordion .blocktype-accordion-title:focus {
outline: 0;
}
.blocktype-accordion .blocktype-accordion-title::marker {
content: "";
}
.blocktype-accordion:not([open]) .blocktype-accordion-title::before {
background-image: url('data:image/svg+xml,');
}
.blocktype-accordion[open] .blocktype-accordion-title::before {
background-image: url('data:image/svg+xml,');
}
.blocktype-accordion .blocktype-accordion-title::before {
background-color: white;
background-position: center;
background-repeat: no-repeat;
background-size: 16px 16px;
border: 1px solid rgba(100, 116, 139, 0.25);
border: 1px solid rgba(var(--color-slate-500-rgb), 0.25);
border-radius: 4px;
content: "";
display: flex;
height: 24px;
margin-right: 0.525em;
outline: 3px solid rgba(100, 116, 139, 0.05);
outline: 3px solid rgba(var(--color-slate-500-rgb), 0.05);
position: absolute;
right: 5px;
width: 24px;
}
@media (min-width: 1024px) {
.blocktype-accordion .blocktype-accordion-title::before {
height: 27px;
width: 32px;
}
}
.blocktype-accordion[open] .blocktype-accordion-title {
text-decoration: underline;
text-decoration-color: rgba(var(--page-primary-rgb), 1);
text-decoration-thickness: inherit;
text-underline-offset: 0.08em;
}
.blocktype-accordion address {
font: 400 16px/1.6 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--blocktype-p);
font-style: normal;
line-height: 1.563;
}
.blocktype-accordion address,
.blocktype-accordion .blocktype-paragraph,
.blocktype-accordion ul.blocktype-list > li,
.blocktype-accordion ol.blocktype-list > li {
text-wrap: balance;
}
.blocktype-accordion ul.blocktype-list > li,
.blocktype-accordion ol.blocktype-list > li {
margin-bottom: 6px;
}
.blocktype-accordion ul.blocktype-list,
.blocktype-accordion ol.blocktype-list {
line-height: 1.563;
list-style: disc outside;
margin: 0 0 1.25em 1.25em;
text-wrap: balance;
}
.blocktype-accordion ul.blocktype-list a,
.blocktype-accordion ol.blocktype-list a {
font-weight: 400;
text-decoration: underline;
text-underline-offset: 0.15em;
}
.blocktype-accordion ul.blocktype-list a,
.blocktype-accordion ol.blocktype-list a,.blocktype-accordion ul.blocktype-list a:hover,
.blocktype-accordion ol.blocktype-list a:hover,
.blocktype-accordion ul.blocktype-list a:focus,
.blocktype-accordion ol.blocktype-list a:focus {
color: #0f172a;
color: var(--color-slate-900);
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
.blocktype-accordion ul.blocktype-list li ul,
.blocktype-accordion ol.blocktype-list li ol {
margin: 1.25em 0 1.25em 1.25em;
}
.blocktype-accordion ul.blocktype-list:last-child,
.blocktype-accordion ol.blocktype-list:last-child {
margin-bottom: 0 !important;
}
.blocktype-accordion ul.blocktype-list li ul li::marker,
.blocktype-accordion ol.blocktype-list li ol li::marker {
color: rgba(var(--page-primary-rgb), 0.6);
}
.blocktype-accordion ul.blocktype-list li ul li ul li::marker,
.blocktype-accordion ol.blocktype-list li ol li ol li::marker {
color: rgba(var(--page-primary-rgb), 0.2);
}
.blocktype-accordion ul.blocktype-list > li,
.blocktype-accordion ol.blocktype-list > li {
line-height: 1.563;
margin: 0 0 0.35em;
max-width: 39.292em;
max-width: var(--site-max-length);
padding-left: 0;
position: relative;
}
.blocktype-accordion ul.blocktype-list > li::marker,
.blocktype-accordion ol.blocktype-list > li::marker {
color: #80bdff;
color: var(--page-primary-hex);
margin: 0 0.493rem 0 0;
}
.blocktype-accordion ul.blocktype-list li:last-child,
.blocktype-accordion ol.blocktype-list li:last-child {
margin-bottom: 0;
padding-bottom: 0;
}
.blocktype-accordion .blocktype-accordion-title + *:first-of-type {
margin-top: 0;
}
.blocktype-accordion p:last-child {
margin-bottom: 0;
}
.blocktype-accordion[data-partner] {
background-color: white;
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.05) 25%, white);
border-color: #80bdff;
border-color: var(--page-primary-hex);
outline: 3px solid rgba(var(--page-primary-rgb), 0.1);
}
.blocktype-accordion[data-partner] .blocktype-accordion-title {
gap: 1rem;
}
.blocktype-accordion[data-partner]:not([open]) .blocktype-accordion-title {
min-height: 65px;
padding: 0 24px;
}
.blocktype-accordion[data-partner] .blocktype-accordion-title::before {
border: 1px solid rgba(var(--page-primary-rgb), 0.65);
outline: 3px solid rgba(var(--page-primary-rgb), 0.05);
}
.section-component .card-toggles {
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
position: relative;
}
@media (max-width: 992px) {
.section-component .card-toggles {
margin-bottom: 2rem;
}
}
@media (min-width: 992px) {
.section-component .card-toggles {
margin-bottom: 2rem;
}
}
.section-component .card-toggles__gradient {
display: grid;
grid-template-columns: 1fr;
height: 200%;
left: 50%;
opacity: 0.15;
pointer-events: none;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
transition-duration: 250ms;
transition-property: opacity;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 200%;
z-index: 0;
}
.section-component .card-toggles.has-open .card-toggles__gradient {
opacity: 0.09;
}
.section-component .card-toggles__gradient div {
position: absolute;
}
.section-component .card-toggles__gradient div:nth-of-type(1) {
background: radial-gradient(farthest-side, rgba(217, 0, 255, 0.56), transparent);
height: 65%;
left: 45%;
top: 20%;
width: 35%;
}
.section-component .card-toggles__gradient div:nth-of-type(2) {
background: radial-gradient(farthest-side, rgba(34, 0, 255, 0.2), transparent);
height: 50%;
left: 40%;
mix-blend-mode: multiply;
top: 25%;
width: 25%;
}
.section-component .card-toggles__gradient div:nth-of-type(3) {
background: radial-gradient(farthest-side, rgba(0, 227, 255, 0.42), transparent);
height: 60%;
left: 20%;
mix-blend-mode: multiply;
top: 20%;
width: 50%;
}
@media (min-width: 992px) {
.section-component .card-toggles {
align-items: flex-start;
grid-template-columns: repeat(3, 1fr);
}
}
.card-toggle {
--color-rgb: var(--color-slate-500-rgb);
background-color: white;
border: 1px solid rgba(226, 232, 240, 1);
border: 1px solid rgba(var(--color-slate-200-rgb), 1);
border-radius: 6px;
cursor: pointer;
outline-color: rgba(100, 116, 139, 0);
outline-color: rgba(var(--color-rgb), 0);
outline-offset: 6px;
outline-style: solid;
outline-width: 4px;
padding: 1rem;
transition-duration: 150ms;
transition-property: background-color, filter, outline-offset, outline-color;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: background-color, filter, outline-offset, outline-color;
z-index: 1;
}
@media (min-width: 992px) {
.card-toggle {
padding: 1rem;
}
}
.card-toggle.is-open,
.card-toggle:focus-within,
.card-toggle:hover {
border: 1px solid rgba(var(--color-rgb), 0.55);
outline-color: rgba(var(--color-rgb), 0.1);
outline-offset: 0;
}
.card-toggle__header {
align-items: center;
display: grid;
grid-gap: 0.5rem;
grid-template-columns: max-content 1fr max-content;
justify-content: space-between;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.card-toggle__title {
font-size: 18px;
line-height: 1;
}
@media (min-width: 992px) {
.card-toggle__title {
font-size: 20px;
}
}
@media (min-width: 1200px) {
.card-toggle__header {
grid-template-columns: max-content 1fr max-content;
}
.card-toggle__title {
font-size: 22px;
}
}
.card-toggle__icon svg {
color: rgba(var(--color-rgb), 1);
display: block;
height: 24px;
width: 24px;
}
@media (min-width: 992px) {
.card-toggle__icon svg {
height: 32px;
width: 32px;
}
}
.card-toggle__btn {
-webkit-appearance: none;
background: transparent;
border: none;
color: inherit;
font: inherit;
-webkit-font-smoothing: inherit;
-moz-osx-font-smoothing: inherit;
line-height: normal;
margin: 0;
overflow: visible;
padding: 0;
width: auto;
}
.card-toggle__btn i {
display: block;
font-size: 1rem;
transition-duration: 150ms;
transition-property: transform;
will-change: transform;
}
@media (min-width: 992px) {
.card-toggle__btn i {
font-size: 1.125rem;
}
}
.card-toggle__btn[aria-expanded=true] i {
transform: scaleY(-1) rotate(-90deg);
}
.card-toggle__content {
max-height: 0;
overflow: hidden;
transition-duration: 150ms;
will-change: max-height;
}
.card-toggle__content p {
color: #6c757d;
color: var(--color-grey);
font-size: 1rem;
font-weight: 400;
line-height: 1.563;
}
.card-toggle__content[aria-hidden=false] {
margin-top: 1em;
max-height: 400px;
}
.site-header--gradient {
background-image: linear-gradient(to right, rgba(191, 212, 16, 0.36), rgba(195, 232, 74, 0.15), rgba(172, 234, 73, 0.15), rgba(106, 227, 94, 0.15), rgba(99, 207, 163, 0.47), rgba(99, 213, 250, 0.72), rgba(80, 177, 248, 0.48), rgba(62, 140, 245, 0.45), rgba(113, 105, 246, 0.15), rgba(159, 73, 246, 0.15), rgba(201, 51, 246, 0.15));
height: 100%;
left: 0;
margin: 0 auto;
-webkit-mask: linear-gradient(to top, transparent 60%, white);
mask: linear-gradient(to top, transparent 60%, white);
max-height: 500px;
max-width: 1500px;
min-height: 500px;
opacity: 1;
position: absolute;
right: 0;
top: 0;
top: -50px;
}
.site-header--gradient::after {
background: linear-gradient(to right, #fff, rgba(255, 255, 255, 0) 100px, rgba(255, 255, 255, 0) calc(100% - 100px), #fff);
bottom: 0;
content: "";
left: 0;
position: absolute;
right: 0;
top: 0;
z-index: 1;
}
.section-top__title {
font-size: 1.953rem;
line-height: 1.125;
max-inline-size: 22ch;
text-wrap: balance;
}
.section-top__excerpt {
color: #1e293b;
color: var(--color-slate-800);
font-size: 1.125rem;
line-height: 1.563;
margin-top: 0.5em;
}
@media (min-width: 992px) {
.section-top__excerpt {
max-inline-size: 58ch;
text-wrap: balance;
}
}
.section-top[data-size=sm] .section-top__wrapper {
align-items: center;
padding-bottom: 2rem;
padding-top: 1rem;
}
@media (min-width: 768px) {
.section-top[data-size=sm] .section-top__wrapper {
padding-bottom: 2rem;
padding-top: 2rem;
}
section[data-page-style] .particle-article__wrapper {
padding-top: 2rem;
}
.section-top__title {
font-size: 2.074rem;
}
.section-top__excerpt {
font-size: 1.125rem;
}
}
@media (min-width: 1024px) {
section[data-page-style] .particle-article__wrapper {
padding-top: 4rem;
}
}
@media (min-width: 1380px) {
section[data-page-style] .particle-article__wrapper {
padding-top: 4rem;
}
}
@media (max-width: 992px) {
.section-top[data-figure="1"] .section-top__wrapper {
display: grid;
grid-template-columns: 1fr;
}
.section-top[data-figure="1"] .section-top__wrapper figure {
order: 2;
}
}
@media (min-width: 992px) {
.section-top[data-figure="1"] .section-top__wrapper {
display: grid;
grid-template-columns: 1fr;
}
.section-top[data-figure="1"] .section-top__wrapper figure {
align-items: center;
display: flex;
flex-direction: row;
justify-content: center;
}
.section-top__title {
font-size: 3.052rem;
}
.section-top__excerpt {
font-size: 1.25rem;
}
}
@media (min-width: 1100px) {
.section-top__title {
font-size: 56px;
font-weight: 700;
}
.section-top__excerpt {
font-size: 27.36px;
}
}
@media (min-width: 1380px) {
.section-top__title {
font-size: 64px;
font-weight: 700;
}
.section-top__excerpt {
font-size: 27.36px;
}
}
.section-top[data-align*=center] .section-top__header * {
margin-left: auto;
margin-right: auto;
text-align: center;
}
.section-top[data-align*=left] .section-top__header * {
margin-left: 0;
text-align: left;
}
@media (max-width: 992px) {
.section-top[data-align*=center-sm] .section-top__header * {
margin-left: auto;
margin-right: auto;
text-align: center;
}
.section-top[data-align*=left-sm] .section-top__header * {
margin-left: 0;
text-align: left;
}
}
@media (min-width: 992px) {
.section-top[data-align*=center-lg] .section-top__header * {
margin-left: auto;
margin-right: auto;
text-align: center;
}
.section-top[data-align*=left-lg] .section-top__header * {
margin-left: 0;
text-align: left;
}
}
.section-top .card-expandables {
margin-top: 2rem;
}
#alert {
align-items: center;
background-color: #f8fafc;
background-color: var(--color-slate-50);
border: 1px solid #f1f5f9;
border: 1px solid var(--color-slate-100);
border-radius: 8px;
display: grid;
grid-gap: 0.65rem;
grid-template-columns: 24px 1fr;
margin-bottom: 1.563rem;
padding: 1.25rem;
}
#alert svg {
color: #94a3b8;
color: var(--color-slate-400);
display: block;
height: 19px;
width: 19px;
}
#alert p {
color: #334155;
color: var(--color-slate-700);
font: 400 16px/1.125 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 400 16px/1.125 var(--font-heading);
margin: 0;
max-width: 90%;
}
#alert[aria-hidden=true] {
display: none;
}
@media (min-width: 1200px) {
#alert {
bottom: 0;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
left: 1.563rem;
max-width: 336px;
position: fixed;
z-index: 999;
}
}
.hub-menu {
align-items: center;
border-bottom: 1px solid #f1f5f9;
border-bottom: 1px solid var(--color-slate-100);
display: grid;
grid-template-columns: 400px auto;
justify-content: space-between;
margin-bottom: 1.25rem;
padding-bottom: 1.25rem;
padding-top: 1.563rem;
}
@media (max-width: 1200px) {
.hub-menu {
grid-template-columns: 1fr auto;
}
}
.hub-search--wrapper {
display: grid;
grid-template-columns: 1fr;
margin-left: 0;
max-width: 500px;
}
.hub-search--wrapper,.hub-search--input {
height: 42px;
position: relative;
width: 100%;
}
.hub-search--input {
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 4px;
color: #334155;
color: var(--color-slate-700);
font: 400 16px/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 400 16px/0.889 var(--font-heading);
margin: 0;
overflow: hidden;
padding: 0 12px;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: border-color, box-shadow;
willl-change: border-color, box-shadow;
}
.hub-search--input:focus {
border-color: rgba(100, 116, 139, 0.75);
border-color: rgba(var(--color-slate-500-rgb), 0.75);
box-shadow: 0 0 0 4px rgba(100, 116, 139, 0.15);
box-shadow: 0 0 0 4px rgba(var(--color-slate-500-rgb), 0.15);
}
.is-active .hub-search--input:focus {
border-color: rgba(0, 123, 255, 0.75);
border-color: rgba(var(--color-primary-500-rgb), 0.75);
box-shadow: 0 0 0 4px rgba(0, 123, 255, 0.15);
box-shadow: 0 0 0 4px rgba(var(--color-primary-500-rgb), 0.15);
}
.hub-search--input:hover {
cursor: text;
}
.hub-search--input::-moz-placeholder {
color: #cbd5e1;
color: var(--color-slate-300);
transition-duration: 250ms;
transition-duration: var(--transition-sm);
-moz-transition-property: color;
transition-property: color;
will-change: color;
}
.hub-search--input::placeholder {
color: #cbd5e1;
color: var(--color-slate-300);
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: color;
will-change: color;
}
.hub-search--input:focus::-moz-placeholder, .hub-search--input:hover::-moz-placeholder {
color: #94a3b8;
color: var(--color-slate-400);
}
.hub-search--input:focus::placeholder, .hub-search--input:hover::placeholder {
color: #94a3b8;
color: var(--color-slate-400);
}
.hub-search--input:focus {
outline: 0;
}
.hub-search--input:focus::-moz-placeholder {
color: #334155;
color: var(--color-slate-700);
}
.hub-search--input:focus::placeholder {
color: #334155;
color: var(--color-slate-700);
}
.hub-search--btn button {
align-items: center;
border-radius: 4px;
color: #64748b;
color: var(--color-slate-500);
display: flex;
height: 26px;
justify-content: center;
position: absolute;
right: 8px;
top: 8px;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: background-color, color, opacity;
width: 26px;
will-change: background-color, color, opacity;
}
.hub-search--btn button:focus {
outline: none;
}
.hub-search--btn button svg {
display: block;
height: 20px;
margin: 0;
pointer-events: none;
width: 20px;
}
.hub-search--btn button.hub-btn--clear {
cursor: pointer;
display: none;
z-index: 2;
}
.hub-search--btn button[aria-hidden=true] {
display: none;
}
.hub-search--btn button[aria-hidden=false] {
display: flex;
}
.is-active .hub-search--btn button {
background-color: rgba(0, 123, 255, 0.15);
background-color: rgba(var(--color-primary-500-rgb), 0.15);
color: rgba(0, 123, 255, 1);
color: rgba(var(--color-primary-500-rgb), 1);
}
.is-active:hover .hub-search--btn button:hover, .is-active .hub-search--btn button:focus {
background-color: rgba(0, 123, 255, 0);
background-color: rgba(var(--color-primary-500-rgb), 0);
color: rgba(0, 123, 255, 0.5);
color: rgba(var(--color-primary-500-rgb), 0.5);
}
.section-hub {
padding-bottom: calc(2.25rem * 2);
padding-bottom: calc(var(--spacer-5) * 2);
}
.section-hub--search {
display: block;
margin: 2.25rem 0 0;
margin: var(--spacer-5) 0 0;
position: relative;
}
.section-hub--search:focus-within .HubSearchGradient {
opacity: 0.55;
transform: translate(-50%, -50%) scaleY(1.25);
}
.HubSearchGradient {
left: 50%;
max-width: 600px;
opacity: 0.65;
pointer-events: none;
position: absolute;
top: 50%;
transform: translate(-50%, -50%) scaleY(1.9);
transition-duration: 250ms;
transition-property: opacity, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
z-index: -1;
}
.hub-search--container {
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 8px;
display: grid;
grid-template-columns: 1fr;
margin-left: 0;
overflow: hidden;
position: relative;
}
@media (min-width: 1200px) {
.hub-search--container {
margin-bottom: calc(2.25rem * 2);
margin-bottom: calc(var(--spacer-5) * 2);
}
}
@media (max-width: 1200px) {
.hub-search--container {
margin-bottom: calc(2.25rem * 1);
margin-bottom: calc(var(--spacer-5) * 1);
}
}
.section-search--input input {
border: 0 solid;
color: #94a3b8;
color: var(--color-slate-400);
font-family: "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-family: var(--font-body);
font-size: 14px;
font-size: 16px;
-webkit-font-smoothing: antialiased;
height: 52px;
line-height: 42px;
margin: 0;
padding: 0 1rem;
position: relative;
width: 100%;
}
.section-search--input input::-moz-placeholder {
color: #94a3b8;
color: var(--color-slate-400);
}
.section-search--input input::placeholder {
color: #94a3b8;
color: var(--color-slate-400);
}
.section-search--input input:hover, .section-search--input input:focus {
color: #334155;
color: var(--color-slate-700);
outline: 0;
}
.section-search--icon {
align-items: center;
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-left: 1px solid #e2e8f0;
border-left: 1px solid var(--color-slate-200);
bottom: 0;
color: #64748b;
color: var(--color-slate-500);
display: flex;
justify-content: center;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
width: 52px;
}
.section-search--icon svg {
display: block;
height: 24px;
pointer-events: none;
width: 24px;
}
@media (min-width: 1200px) {
.section-search--input input {
font-size: 1.15rem;
}
.section-hub--search {
max-width: 600px;
}
}
.section-hub--grid {
display: grid;
justify-content: center;
}
.single-hub--figure {
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid var(--color-slate-200);
overflow: hidden;
padding-top: 56.25%;
position: relative;
}
.single-hub--figure .aspect-ratio,
.single-hub--figure .aspect-ratio > svg {
display: block;
height: 100%;
left: 0;
-o-object-fit: cover;
object-fit: cover;
position: absolute;
top: 0;
width: 100%;
}
.single-hub--figure .aspect-ratio > svg:nth-of-type(2) {
z-index: -2;
}
@media (max-width: 1200px) {
.single-hub--figure .aspect-ratio > div {
display: none;
}
}
@media (min-width: 576px) {
.section-hub--grid {
align-items: stretch;
display: grid;
grid-gap: 1.563rem;
grid-template-columns: repeat(2, 1fr);
justify-content: center;
}
}
@media (min-width: 992px) and (max-width: 1380px) {
.section-hub--grid {
align-items: stretch;
display: grid;
grid-gap: 1.563rem;
grid-template-columns: repeat(2, 1fr);
justify-content: center;
}
}
@media (min-width: 1200px) {
.section-hub--grid {
grid-gap: 1.563rem;
grid-template-columns: repeat(3, 1fr);
}
}
@media (min-width: 1380px) {
.section-hub--grid {
grid-gap: 1.25rem;
grid-template-columns: repeat(4, 1fr);
}
}
.section-hub--grid article {
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
opacity: 0.99;
opacity: 1;
overflow: hidden;
transition-duration: 150ms;
transition-duration: var(--transition-xs);
transition-property: transform, box-shadow, opacity;
transition-timing-function: ease-in-out;
will-change: transform, box-shadow, opacity;
}
.section-hub--grid article:hover {
box-shadow: rgba(0, 0, 0, 0.16) 0px 12px 24px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.section-hub--grid article:active {
box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
.section-hub--grid article:not(.is-hidden) {
order: 1;
}
.section-hub--grid article.is-hidden {
opacity: 0.25;
order: 999;
}
.single-hub--item {
justify-content: space-between;
position: relative;
width: 100%;
}
.single-hub--item,.single-hub--item > div:nth-of-type(1) {
display: flex;
flex-direction: column;
height: 100%;
}
[data-topic=catfishing] .single-hub--figure {
--hub-hue-0: var(--color-hue-9-50);
--hub-hue-1: var(--color-hue-11-300);
--hub-hue-2: var(--color-hue-9-400);
}
[data-topic=mentalhealth] .single-hub--figure {
--hub-hue-0: var(--color-hue-7-200);
--hub-hue-1: var(--color-hue-8-200);
--hub-hue-2: var(--color-hue-7-200);
}
@media (max-width: 768px) {
[data-topic=mentalhealth] .single-hub--figure svg {
display: none;
}
}
[data-topic=mentalhealth] .single-hub--item #el2 {
filter: drop-shadow(0 0 55px rgba(0, 0, 0, 0.25));
transition-duration: 250ms;
transition-duration: var(--transition-sm);
transition-property: filter;
transition-timing-function: ease-in-out;
will-change: filter;
}
[data-topic=mentalhealth] .single-hub--item:hover #el2 {
filter: drop-shadow(0 0 30px rgba(0, 0, 0, 0.1));
}
[data-topic=catfishing] .single-hub--item #el2,
[data-topic=catfishing] .single-hub--item #el3 {
transition: transform 200ms ease-in-out;
}
[data-topic=catfishing] .single-hub--item #el3 {
transform: translate(-3000px, 180px);
transition-delay: 100ms;
}
[data-topic=catfishing] .single-hub--item #el2 {
transform: translate(-3000px, 693px);
transition-delay: 300ms;
}
[data-topic=catfishing] .single-hub--item:hover #el3 {
transform: translate(-800px, 180px);
}
[data-topic=catfishing] .single-hub--item:hover #el2 {
transform: translate(-600px, 693px);
}
[data-topic=catfishing] .single-hub--item #person {
transition: opacity 400ms 200ms ease-in-out, filter 400ms 100ms ease-in-out;
}
[data-topic=catfishing] .single-hub--item:hover #person {
filter: drop-shadow(0px 0px 30px rgba(0, 0, 0, 0.25)) blur(25px);
}
.figure-hue--0,
.figure-hue--1,
.figure-hue--2 {
border-radius: 999em;
content: "";
filter: blur(20px);
left: 50%;
opacity: 0.75;
position: absolute;
top: 50%;
z-index: -1;
}
.figure-hue--0 {
background: var(--hub-hue-0);
filter: blur(40px);
height: 100px;
left: 0;
transform: translate(-50%, -50%) rotate(-45deg) translateZ(0);
width: 150px;
}
.figure-hue--1 {
background: var(--hub-hue-1);
filter: blur(50px);
height: 300px;
left: 70%;
top: 70%;
transform: translate(-50%, -50%) rotate(30deg) translateZ(0);
width: 100px;
}
.figure-hue--2 {
background: var(--hub-hue-2);
filter: blur(60px);
height: 400px;
left: 20%;
top: 0;
transform: translate(-50%, -50%) rotate(90deg) translateZ(0);
width: 100px;
}
.single-hub--figure figcaption {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border-radius: 6px;
bottom: 16px;
box-shadow: rgba(0, 0, 0, 0.05) 0 6px 24px 0, rgba(0, 0, 0, 0.08) 0 0 0 1px;
color: #0f172a;
color: var(--color-slate-900);
display: flex;
font: 600 17px/1.125 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 600 17px/1.125 var(--font-heading);
height: 32px;
left: 16px;
letter-spacing: -0.01em;
padding: 0 8px;
position: absolute;
}
.single-hub--figure figcaption,.single-hub--header {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: 1;
}
.single-hub--header {
padding: 24px;
position: relative;
}
.single-hub--title {
display: none;
font: 500 1.25rem/1.222 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--type-heading-h4);
margin: 0;
}
.single-hub--excerpt {
color: #64748b;
color: var(--color-slate-500);
font-family: 400 14px/1.424 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-family: 400 14px/1.424 var(--font-heading);
height: 60px;
margin-bottom: 0 !important;
overflow: hidden;
}
.hub-link--txt {
display: inline-block;
font: 600 14px/1.33337 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--type-caption2);
font-family: "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font-family: var(--font-heading);
letter-spacing: 0.03em;
padding: 0 0 24px 24px;
text-transform: uppercase;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: 1;
}
.hub-link--icon {
align-items: center;
background-color: #f1f5f9;
background-color: var(--color-slate-100);
border-left: 1px solid #e2e8f0;
border-left: 1px solid var(--color-slate-200);
border-radius: 50% 0 0 0;
border-top: 1px solid #e2e8f0;
border-top: 1px solid var(--color-slate-200);
bottom: 0;
color: #64748b;
color: var(--color-slate-500);
display: flex;
height: 32px;
justify-content: center;
position: absolute;
right: 0;
width: 32px;
}
.hub-link--icon svg {
height: 16px;
margin-left: 2px;
margin-top: 2px;
width: 16px;
}
.single-hub--link span {
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-radius: 4px;
color: #64748b;
color: var(--color-slate-500);
display: inline-flex;
line-height: 24px;
padding: 0 8px;
text-shadow: 1px 1px #FFFFFF;
text-shadow: 1px 1px var(--color-white);
transition: background-color 200ms ease-in-out, color 200ms ease-in-out;
}
.single-hub--item:hover .single-hub--link span {
background-color: #e2e8f0;
background-color: var(--color-slate-200);
color: #334155;
color: var(--color-slate-700);
}
@media screen and (max-width: 768px) {
.single-hub--item .single-hub--link span {
background-color: #e2e8f0;
background-color: var(--color-slate-200);
color: #334155;
color: var(--color-slate-700);
}
.single-hub--item {
box-shadow: rgba(0, 0, 0, 0.16) 0 10px 36px 0, rgba(0, 0, 0, 0.06) 0 0 0 1px;
padding: 0;
}
.single-hub--figure {
overflow: visible;
position: absolute;
width: 100%;
}
.single-hub--figure svg {
height: 140%;
position: absolute;
right: -22%;
top: -10%;
width: 120%;
}
.single-hub--header {
width: calc(100% - 120px);
}
.single-hub--title {
color: #334155;
color: var(--color-slate-700);
display: flex;
font-size: 1rem;
font-weight: bold;
letter-spacing: -0.03em;
margin: 0 0 6px;
}
.single-hub--figure figcaption {
display: none;
}
.single-hub--excerpt {
color: #334155;
color: var(--color-slate-700);
font: 500 14px/1.42859 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: var(--type-body-s);
height: auto;
max-width: 22em;
overflow: hidden;
}
.single-hub--excerpt::after {
display: none;
}
.single-hub--link {
padding-left: 0;
}
.single-hub--link div {
font-size: 12px;
position: relative;
z-index: 2;
}
}
@media (max-width: 1200px) {
.single-hub--figure .aspect-ratio {
display: none;
}
}
.site-cookies {
background-color: white;
background-color: #f8fafc;
background-color: var(--color-slate-50);
border-radius: 6px;
bottom: 1rem;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
color: #1e293b;
color: var(--color-slate-800);
left: 1rem;
max-width: 330px;
padding: 1.25rem;
position: fixed;
transition: all 200ms ease;
z-index: 2147483647;
}
@media (min-width: 768px) {
.site-cookies svg {
fill: currentColor;
}
.site-cookies {
padding: 1.25rem;
}
.site-cookies--headline {
font-weight: 600;
margin-bottom: 6px;
}
.site-cookies--description {
color: #475569;
color: var(--color-slate-600);
font-size: 15px;
}
.site-cookies--meta {
background-color: #FFFFFF;
background-color: var(--color-white);
padding: 1.25rem;
}
.site-cookies--actions {
align-items: center;
display: flex;
justify-content: flex-start;
}
.site-cookies__dismiss {
align-items: center;
display: flex;
margin-top: 0.5rem;
}
.site-cookies--actions {
display: flex;
flex-direction: row;
gap: 12px;
}
.site-cookies--actions a,
.site-cookies--actions button,
.site-cookies--actions button[data-close] {
background-color: rgba(0, 0, 0, 0.05);
border-radius: 4px;
font-size: 14px;
font-weight: 500;
margin-top: 1rem;
outline: 2px solid rgba(0, 123, 255, 0);
outline: 2px solid rgba(var(--color-primary-500-rgb), 0);
outline-offset: 4px;
padding: 8px 9px;
transition-duration: 0.2s;
transition-property: background-color, outline-offset, outline-color;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: outline-offset, outline-color, background-color;
}
.site-cookies--actions a i,
.site-cookies--actions button i {
color: #007bff;
color: var(--color-primary-500);
}
.site-cookies--actions a:hover,
.site-cookies--actions button:hover {
background-color: rgba(0, 0, 0, 0.1);
}
.site-cookies--actions a:focus,
.site-cookies--actions button:focus {
background-color: rgba(0, 0, 0, 0.1);
outline-color: rgba(0, 123, 255, 0.5);
outline-color: rgba(var(--color-primary-500-rgb), 0.5);
outline-offset: 0;
}
}
@media (max-width: 768px) {
#siteCookiesWrapper::before {
background-color: rgba(0, 0, 0, 0.5);
content: "";
display: block;
height: 100%;
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 10000000;
}
.site-cookies {
background-color: white;
border-radius: 4px;
height: -moz-max-content;
height: max-content;
left: 50%;
padding: 1rem;
top: 50%;
transform: translate(-50%, -50%);
width: calc(100% - 2rem);
z-index: 10000000;
}
.site-cookies--headline {
font-weight: 600;
}
.site-cookies--description {
margin-top: 1rem;
}
.site-cookies--description p {
font-size: 15px;
line-height: 1.414;
margin: 0;
text-wrap: none;
}
.site-cookies--actions {
display: flex;
flex-direction: row;
gap: 12px;
}
.site-cookies--actions a,
.site-cookies--actions button {
background-color: rgba(0, 0, 0, 0.05);
border-radius: 4px;
font-size: 14px;
font-weight: 500;
margin-top: 1rem;
padding: 8px 9px;
}
.site-cookies--actions a i,
.site-cookies--actions button i {
color: #007bff;
color: var(--color-primary-500);
}
}
.hero__scattered {
--tiles-gap: 1rem;
--cols-gy: 1rem;
--cols-gx: 1rem;
--cols-width: 90px;
--cols-p-width: 90px;
--p-radius: 12px;
--p-ar: 1/1;
--tile-hero-scale: 1;
--tile-hero-width: calc(376px * var(--tile-hero-scale));
--tile-hero-height: calc(669px * var(--tile-hero-scale));
--tile-hero-rotate: 0;
--tile-hero-rotate-loaded: 3deg;
align-items: center;
display: flex;
gap: 1rem;
gap: var(--tiles-gap);
height: auto;
justify-content: center;
width: 100%;
}
@media (max-width: 991.98px) {
.hero__scattered {
--cols-width: 40px;
--cols-p-width: 40px;
--cols-gy: 0.15rem;
--tiles-gap: 0.15rem;
--p-radius: 3px;
--p-ar: 1/1;
}
}
@media (min-width: 992px) and (max-width: 1199.98px) {
.hero__scattered {
--cols-width: 90px;
--cols-p-width: 90px;
--cols-gy: .25rem;
--tiles-gap: 0;
--p-radius: 4px;
}
}
@media (min-width: 1200px) and (max-width: 1319.98px) {
.hero__scattered {
--cols-width: 100px;
--cols-p-width: 100px;
--cols-gy: .5rem;
--tiles-gap: 0;
--p-radius: 4px;
}
}
@media (min-width: 1320px) {
.hero__scattered {
--cols-width: 110px;
--cols-p-width: 110px;
--cols-gy: 0;
--tiles-gap: 0;
--p-radius: 5px;
}
}
.hero__scattered .hero__cols {
display: flex;
flex-direction: column;
grid-gap: var(--cols-gy) var(--cols-gx);
min-width: var(--cols-width);
position: relative;
top: 0;
transition-duration: 300ms;
transition-property: opacity, width, top, transform;
}
.hero__scattered .hero__cols.column-1 {
order: 1;
}
.hero__scattered .hero__cols.column-2 {
order: 2;
}
.hero__scattered .hero__cols.column-3 {
order: 3;
}
.hero__scattered .hero__cols.column-4 {
order: 4;
}
.hero__scattered .hero__cols.column-5 {
order: 5;
}
.hero__scattered .hero__cols.column-6 {
order: 6;
}
.hero__scattered .hero__cols.column-7 {
order: 7;
}
.hero__scattered .hero__cols.column-8 {
order: 8;
}
.hero__scattered .hero__cols.column-1 > *, .hero__scattered .hero__cols.column-2 > *, .hero__scattered .hero__cols.column-3 > *, .hero__scattered .hero__cols.column-4 > * {
transform-origin: right;
}
.hero__scattered .hero__cols.column-5 > *, .hero__scattered .hero__cols.column-6 > *, .hero__scattered .hero__cols.column-7 > *, .hero__scattered .hero__cols.column-8 > * {
transform-origin: left;
}
.hero__scattered .hero__cols.column-1 > *, .hero__scattered .hero__cols.column-8 > * {
opacity: 0.09;
transform: scale(0.6);
}
.hero__scattered .hero__cols.column-2 > *, .hero__scattered .hero__cols.column-7 > * {
opacity: 0.1;
transform: scale(0.7);
}
.hero__scattered .hero__cols.column-3 > *, .hero__scattered .hero__cols.column-6 > * {
opacity: 0.2;
transform: scale(0.6);
}
.hero__scattered .hero__cols.column-4 > *, .hero__scattered .hero__cols.column-5 > * {
opacity: 0.3;
transform: scale(0.5);
}
.hero__scattered .hero__cols picture,
.hero__scattered .hero__cols figure {
border-radius: var(--p-radius);
box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
display: block;
margin: 0 auto;
max-width: var(--cols-p-width);
overflow: hidden;
transition-duration: 100ms;
transition-duration: 300ms;
transition-property: width, height, opacity, transform, scale;
will-change: width, height, opacity, transform, scale;
}
.hero__scattered .hero__cols picture i,
.hero__scattered .hero__cols figure i {
color: #64748b;
color: var(--color-slate-500);
font-size: 3rem;
}
.hero__scattered .hero__cols picture img {
aspect-ratio: var(--p-ar);
border-radius: var(--p-radius);
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.hero__scattered .hero__cols:nth-of-type(even) picture:nth-of-type(even) {
transition-delay: 100ms;
}
.hero__scattered .hero__cols:nth-of-type(odd) picture:nth-of-type(even) {
transition-delay: 50ms;
}
.hero__scattered .hero__cols:nth-of-type(odd) picture:nth-of-type(odd) {
transition-delay: 150ms;
}
@media (max-width: 992px) {
.hero__scattered .hero__cols:not(.hero):nth-of-type(even) {
top: -4px;
}
.hero__scattered .hero__cols:not(.hero):nth-of-type(odd) {
top: 4px;
}
}
@media (min-width: 1320px) {
.hero__scattered .hero__cols:not(.hero):nth-of-type(even) {
top: -15px;
}
.hero__scattered .hero__cols:not(.hero):nth-of-type(odd) {
top: 15px;
}
}
.hero__scattered .hero__cols:not(.hero):not(.loaded) {
opacity: 0.01;
}
.hero__scattered .hero__cols:not(.hero):not(.loaded) > picture {
opacity: 0.02;
transform: scale(0.2);
}
.hero__scattered .hero__cols:not(.hero).loaded {
opacity: 1;
}
.hero__scattered .hero__cols.hero {
--tile-hero-width: max-content;
align-items: center;
display: flex;
justify-content: center;
opacity: 0.01;
order: 5;
position: relative;
transition-delay: 100ms;
transition-duration: 600ms;
transition-property: opacity;
will-change: opacity;
z-index: 10;
}
@media (min-width: 992px) {
.hero__scattered .hero__cols.hero.content {
min-width: 768px;
width: 768px;
}
}
@media (max-width: 991.98px) {
.hero__scattered .hero__cols.hero.content {
min-width: 80vw;
width: 80vw;
}
}
.hero__scattered .hero__cols.hero.loaded {
opacity: 1;
}
.hero__scattered .hero__cols.hero picture {
max-width: 100%;
opacity: 1;
}
.hero__scattered .hero__cols.hero picture img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
}
.device__container {
--device-scale: 0.715;
align-items: center;
display: flex;
height: auto;
justify-content: center;
width: 100%;
}
@media (min-width: 768px) and (max-width: 991.98px) {
.device__container {
--device-scale: 0.75;
}
}
@media (min-width: 992px) {
.device__container {
--device-scale: 0.8;
}
}
@media (min-width: 1200px) {
.device__container {
--device-scale: 1;
}
}
.device__container.portrait {
--device-width: calc(376px * var(--device-scale));
--device-height: calc(669px * var(--device-scale));
--device-rotate: 3deg;
--device-rotate-loaded: 3deg;
--device-radius: 8px;
}
.device__container.portrait .device__wrapper::before {
filter: blur(10vw);
transform: scaleY(0.55) scaleX(0.69);
z-index: 1;
}
@media (min-width: 991.98px) {
.device__container.portrait .device__wrapper::before {
filter: blur(5vw);
transform: scaleY(0.55) scaleX(1.07);
}
}
.device__container.portrait .device {
box-shadow: -0.359em 1.538em 3.205em -0.641em rgb(16, 15, 15), 0.513em 1.026em 1.923em -0.897em rgb(28, 27, 26), 0 0 0 0.3em rgb(40, 39, 38), 0 0 0 0.15em rgb(16, 15, 15);
}
.device__container.portrait .device__bottom {
bottom: 2rem;
}
.device__container.landscape {
--device-width: calc(calc(1442.67px * var(--device-scale)) / 1.563);
--device-height: calc(calc(812px * var(--device-scale)) / 1.563);
--device-rotate: 0;
--device-rotate-loaded: 0;
--device-radius: 2px;
}
@media (max-width: 728px) {
.device__container.landscape {
--device-width: calc(calc(1442.67px * var(--device-scale)) / 2.25);
--device-height: calc(calc(812px * var(--device-scale)) / 2.25);
}
}
.device__container.landscape .device__wrapper::before {
filter: blur(10vw);
transform: scaleY(0.55) scaleX(0.69);
}
@media (min-width: 991.98px) {
.device__container.landscape .device__wrapper::before {
filter: blur(5vw);
transform: scaleY(0.55) scaleX(1.01);
}
}
.device__container.landscape .device {
box-shadow: -0.359em 1.538em 3.205em -0.641em rgb(16, 15, 15), 0.513em 1.026em 1.923em -0.897em rgb(0, 0, 0), 0 0 0 0.25em rgb(0, 0, 0), 0 0 0 0.1em rgb(16, 15, 15);
}
.device__container.landscape .device__top__center {
display: none;
}
.device__container.landscape .device__bottom {
justify-content: flex-end !important;
padding-right: 1.953rem;
top: 1.953rem;
}
.device__container *,
.device__container *::before,
.device__container *::after {
box-sizing: border-box;
}
.device__container .device__wrapper {
align-items: center;
display: flex;
justify-content: center;
margin: auto;
position: relative;
width: -moz-max-content;
width: max-content;
}
.device__container .device__wrapper::before {
animation: glowAnimation 30s ease infinite;
background: linear-gradient(270deg, #0fffc1, #7e0fff);
background-size: 200% 200%;
content: "";
filter: blur(10vw);
height: 100%;
left: 0;
margin: 0 auto;
position: absolute;
right: 0;
top: 0;
transform: scaleY(0.85) scaleX(1.05);
width: 100%;
z-index: 0;
}
.device__container .device {
align-items: center;
background-color: #000;
border-radius: var(--device-radius);
display: flex;
flex-shrink: 0;
height: var(--device-height);
justify-content: center;
min-height: var(--device-height);
min-width: var(--device-width);
overflow: hidden;
position: relative;
transform: matrix(var(--device-scale), 0, 0, var(--device-scale), 0, 0) rotate(var(--device-rotate));
transition-duration: 150ms;
transition-property: all;
width: var(--device-width);
z-index: 10;
}
.device__wrapper .display {
background: black;
border-radius: calc(var(--device-radius) * 1);
height: 100%;
overflow: hidden;
position: relative;
width: 100%;
}
.device__wrapper .device__top {
align-items: center;
box-sizing: border-box;
display: grid;
grid-template-columns: 1fr 1fr 1fr;
height: 25px;
padding: 0.5rem 1rem 0;
position: relative;
position: absolute;
top: 0;
width: 100%;
z-index: 5;
}
@media (max-width: 992px) {
.device__wrapper .device__top {
display: none;
}
}
.device__wrapper .device__top__left {
align-items: center;
color: rgb(135, 133, 128);
display: flex;
font-size: 1.25rem;
height: 30px;
margin: 0;
width: 30px;
}
.device__wrapper .device__top__center {
height: 8px;
justify-self: center;
width: 4em;
}
.device__wrapper .device__bottom {
align-items: center;
bottom: 0;
display: flex;
grid-gap: 1rem;
height: 30px;
justify-content: center;
opacity: 0;
z-index: 5;
}
.device__wrapper .device__bottom,.device__wrapper .device__bottom::before {
left: 0;
position: absolute;
right: 0;
transition-duration: 150ms;
transition-property: opacity;
transition-timing-function: ease-in;
width: 100%;
}
.device__wrapper .device__bottom::before {
background-image: linear-gradient(to top, rgb(0, 0, 0), rgba(0, 0, 0, 0));
bottom: -2rem;
display: block;
height: 300px;
z-index: 0;
}
.device__wrapper .device__bottom .button {
align-items: center;
apperance: none;
background-color: rgba(206, 205, 195, 0.15);
border: none;
border: 1px solid rgba(255, 255, 255, 0.15);
border-radius: 12px;
color: rgb(255, 255, 255);
cursor: pointer;
display: inline-block;
display: flex;
font-family: sans-serif;
font-size: 1rem;
height: 24px;
justify-content: center;
line-height: 1;
margin: 0;
min-height: 24px;
min-width: 46px;
outline-color: rgba(255, 255, 255, 0.15);
outline-offset: 0.35em;
outline-width: 0;
position: relative;
text-align: center;
text-decoration: none;
transition-duration: 250ms;
transition-duration: 150ms;
transition-property: background, color, opacity;
transition-property: color, background-color, border-color, outline-color, outline-offset;
transition-timing-function: ease-in;
width: 46px;
z-index: 1;
}
.device__wrapper .device__bottom .button:hover, .device__wrapper .device__bottom .button:focus {
background-color: rgba(255, 255, 255, 0.15);
border-color: rgba(226, 232, 240, 0.25);
border-color: rgba(var(--color-slate-200-rgb), 0.25);
color: rgba(226, 232, 240, 1);
color: rgba(var(--color-slate-200-rgb), 1);
outline: 0.15em solid rgba(226, 232, 240, 0.15);
outline: 0.15em solid rgba(var(--color-slate-200-rgb), 0.15);
outline-offset: 0;
}
.device__wrapper:hover .device__bottom, .device__wrapper:focus-within .device__bottom {
opacity: 1;
}
.device__wrapper .device .device__bottom .button--right i.icon-device-spinner {
animation: spinAnimation 1s linear infinite;
transform-origin: center;
}
.device__wrapper .device__bottom [aria-hidden=true] {
display: none;
}
.device__wrapper:not([data-type=video]) .device__bottom {
display: none !important;
}
.device__wrapper iframe,
.device__wrapper video {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
z-index: 0;
}
@media (min-width: 992px) {
.device__wrapper iframe,
.device__wrapper video {
z-index: -1;
}
}
@keyframes spinAnimation {
0% {
transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
}
}
@keyframes glowAnimation {
0% {
background-position: 0% 50%;
}
50% {
background-position: 100% 50%;
}
100% {
background-position: 0% 50%;
}
}
.js-disable-hover [tabindex],
.js-disable-hover a,
.js-disable-hover button,
.js-disable-hover input,
.js-disable-hover select,
.js-disable-hover textarea,
.js-disable-hover label[for],
.js-disable-hover option,
.js-disable-hover summary,
.js-disable-hover area,
.js-disable-hover audio[controls],
.js-disable-hover video[controls],
.js-disable-hover iframe,
.js-disable-hover embed,
.js-disable-hover object {
pointer-events: none !important;
}
.particle-breadcrumb__wrapper {
margin-bottom: calc(1.2 * 1rem);
margin-bottom: calc(var(--scale-p2) * 1rem);
margin-top: 24px;
position: relative;
z-index: 1;
}
@media (min-width: 1024px) {
.particle-breadcrumb__wrapper {
margin-bottom: 0;
margin-top: calc(1.44 * 1rem);
margin-top: calc(var(--scale-p3) * 1rem);
}
}
.particle-breadcrumb ol {
align-items: center;
display: flex;
font-size: 13px;
list-style: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
@media (min-width: 992px) {
.particle-breadcrumb ol {
font-size: 14px;
}
}
.particle-breadcrumb ol li {
margin: 0;
}
.particle-breadcrumb li {
align-items: center;
display: inline-flex;
}
.particle-breadcrumb li:not(:first-child)::before {
color: #94a3b8;
color: var(--color-slate-400);
content: "/";
padding-left: 0.243rem;
padding-right: 0.243rem;
}
.particle-breadcrumb li a,
.particle-breadcrumb li span[itemprop=name] {
align-items: center;
color: #64748b;
color: var(--color-slate-500);
display: flex;
}
[data-template-type=news] .particle-breadcrumb li:last-child span[itemprop=name] {
display: block;
max-width: 100px;
overflow: hidden;
text-overflow: ellipsis;
white-space: pre;
}
@media (max-width: 992px) {
.particle-breadcrumb li {
max-width: 120px;
}
.particle-breadcrumb li a span[itemprop=name] {
white-space: pre;
}
}
.particle-breadcrumb li a:focus,
.particle-breadcrumb li a:focus-visible,
.particle-breadcrumb li a:hover {
outline: 0;
}
.particle-breadcrumb li a:focus span,
.particle-breadcrumb li a:focus-visible span,
.particle-breadcrumb li a:hover span {
color: #0f172a;
color: var(--color-slate-900);
}
.particle-breadcrumb li a[aria-current] {
color: #64748b;
color: var(--color-slate-500);
}
.particle-breadcrumb li a[aria-current] span[itemprop=name] {
display: block;
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 0, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
line-height: 1.563;
overflow: hidden;
text-overflow: ellipsis;
white-space: pre;
}
.particle-breadcrumb li a[aria-current]:focus,
.particle-breadcrumb li a[aria-current]:focus-visible,
.particle-breadcrumb li a[aria-current]:hover {
color: #334155;
color: var(--color-slate-700);
outline: 0;
}
.dropcap {
text-align: justify;
text-indent: 0;
}
.dropcap .dropcap-letter {
align-items: center;
background-color: #80bdff;
background-color: var(--page-primary-hex);
border-radius: 0.75rem;
color: white;
display: flex;
float: left;
font-feature-settings: "c2sc", "smcp", "kern";
font-size: 30px;
font-weight: 700;
height: 52px;
justify-content: center;
line-height: 1;
margin: 8px 8px 0 0;
position: relative;
text-shadow: none !important;
text-transform: uppercase;
width: 46px;
}
.dropcap .dropcap-letter::before {
background-color: rgba(var(--page-primary-rgb), 0.1);
border-radius: 0.75rem;
bottom: -4px;
content: "";
display: block;
height: 100%;
left: -4px;
position: absolute;
width: 100%;
z-index: -1;
}
@media (min-width: 992px) {
.dropcap .dropcap-letter {
font-size: 45px;
height: 65px;
margin: 12px 15px 0 0;
width: 65px;
}
.dropcap .dropcap-letter::before {
bottom: -6px;
left: -6px;
}
}
.dropcap [aria-hidden] {
display: inline;
}
@keyframes plyr-popup {
0% {
opacity: 0.5;
transform: translateY(10px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
@keyframes plyr-fade-in {
0% {
display: none;
opacity: 0;
}
to {
opacity: 1;
}
}
.plyr {
--plyr-range-thumb-background: var(--color-white);
--plyr-video-background: transparent;
--plyr-video-controls-background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15));
--plyr-audio-control-background-hover: var(--plyr-color-main);
--plyr-audio-controls-background: var(--plyr-color-main);
--plyr-badge-background: var(--color-slate-700);
--plyr-badge-color: var(--color-white);
--plyr-video-control-background-hover: var(--plyr-color-main);
--plyr-video-control-background: transparent;
direction: ltr;
display: flex;
font-family: inherit;
font-weight: 400;
line-height: 1.7;
max-width: 100%;
min-width: 200px;
position: relative;
text-shadow: none;
transition: box-shadow 0.3s ease;
z-index: 0;
}
.plyr .plyr__control:focus-visible .plyr__tooltip {
opacity: 1;
transform: translate(-50%) scale(1);
}
.plyr .plyr__control:hover .plyr__tooltip {
opacity: 1;
transform: translate(-50%) scale(1);
z-index: 3;
}
.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip] {
display: none;
}
.plyr [hidden] {
display: none !important;
}
.plyr audio {
display: block;
height: 100%;
width: 100%;
}
.plyr button {
font: inherit;
line-height: inherit;
width: auto;
}
.plyr iframe {
margin-top: 0;
}
.plyr iframe,.plyr video {
display: block;
height: 100%;
width: 100%;
}
.plyr--airplay-supported [data-plyr=airplay] {
display: inline-block;
}
.plyr--audio {
display: block;
}
.plyr--audio .plyr__control:focus-visible,
.plyr--audio .plyr__control:hover,
.plyr--audio .plyr__control[aria-expanded=true] {
background-color: var(--plyr-audio-control-background-hover);
color: #FFFFFF;
color: var(--color-white);
}
.plyr--audio .plyr__controls {
background-color: var(--plyr-audio-controls-background);
border-radius: inherit;
color: #334155;
color: var(--color-slate-700);
padding: 10px;
}
.plyr--audio .plyr__progress__buffer {
color: rgba(#334155, 0.6);
color: rgba(var(--color-slate-700), 0.6);
}
.plyr--captions-active .plyr__captions {
display: block;
}
.plyr--captions-enabled [data-plyr=captions] {
display: inline-block;
}
.plyr--full-ui {
box-sizing: border-box;
}
.plyr--full-ui * {
box-sizing: inherit;
}
.plyr--full-ui .plyr__video-embed > .plyr__video-embed__container {
padding-bottom: 240%;
position: relative;
transform: translateY(-38.28125%);
}
.plyr--full-ui input[type=range] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: rgba(0, 0, 0, 0);
border: 0;
border-radius: 26px;
color: var(--plyr-color-main);
display: block;
height: 19px;
margin: 0;
min-width: 0;
padding: 0;
transition: box-shadow 0.3s ease;
width: 100%;
}
.plyr--full-ui input[type=range]::-moz-focus-outer {
border: 0;
}
.plyr--full-ui input[type=range]::-moz-range-progress {
background: currentColor;
border-radius: 2.5px;
height: 5px;
}
.plyr--full-ui input[type=range]::-moz-range-thumb {
background-color: var(--plyr-range-thumb-background);
border: 0;
border-radius: 100%;
height: 13px;
position: relative;
-moz-transition: all 0.2s ease;
transition: all 0.2s ease;
width: 13px;
}
.plyr--full-ui input[type=range]::-moz-range-track {
background-color: rgba(255, 255, 255, 0.15);
border: 0;
border-radius: 2.5px;
height: 5px;
-moz-transition: box-shadow 0.3s ease;
transition: box-shadow 0.3s ease;
}
.plyr--full-ui input[type=range]::-ms-fill-lower {
background: rgba(0, 0, 0, 0);
background: currentColor;
}
.plyr--full-ui input[type=range]::-ms-fill-lower,.plyr--full-ui input[type=range]::-ms-fill-upper {
border: 0;
border-radius: 2.5px;
height: 5px;
-ms-transition: box-shadow 0.3s ease;
transition: box-shadow 0.3s ease;
}
.plyr--full-ui input[type=range]::-ms-fill-upper {
background: rgba(0, 0, 0, 0);
}
.plyr--full-ui input[type=range]::-ms-thumb {
background-color: var(--plyr-range-thumb-background);
border: 0;
border-radius: 100%;
box-shadow: 0 1px 1px rgba(51, 65, 85), 0 0 0 1px rgba(30, 41, 59, 0.2);
box-shadow: 0 1px 1px rgba(var(--color-slate-700-rgb, 0.1)), 0 0 0 1px rgba(var(--color-slate-800-rgb), 0.2);
height: 13px;
margin-top: 0;
position: relative;
-ms-transition: all 0.2s ease;
transition: all 0.2s ease;
width: 13px;
}
.plyr--full-ui input[type=range]::-ms-tooltip {
display: none;
}
.plyr--full-ui input[type=range]::-ms-track {
background: rgba(0, 0, 0, 0);
border: 0;
border-radius: 2.5px;
color: rgba(0, 0, 0, 0);
height: 5px;
-ms-transition: box-shadow 0.3s ease;
transition: box-shadow 0.3s ease;
}
.plyr--full-ui input[type=range]::-webkit-slider-runnable-track {
background-color: rgba(0, 0, 0, 0);
background-image: linear-gradient(90deg, currentColor 0, #0f172a 0);
background-image: linear-gradient(90deg, currentColor 0, var(--color-slate-900) 0);
background-image: linear-gradient(to right, currentColor 0, rgba(0, 0, 0, 0) 0);
background-image: linear-gradient(to right, currentColor var(--value, 0), rgba(0, 0, 0, 0) var(--value, 0));
border: 0;
border-radius: 2.5px;
height: 5px;
-webkit-transition: box-shadow 0.3s ease;
transition: box-shadow 0.3s ease;
}
.plyr--full-ui input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
appearance: none;
background-color: var(--plyr-range-thumb-background);
border: 1px solid #FFFFFF;
border: 1px solid var(--color-white);
border-radius: 100%;
height: 13px;
margin-top: -4px;
position: relative;
-webkit-transition: all 0.2s ease;
transition: all 0.2s ease;
width: 13px;
}
.plyr--full-ui input[type=range]:focus {
outline: 0;
}
.plyr--full-ui input[type=range]:focus-visible::-moz-range-track,
.plyr--full-ui input[type=range]:focus-visible::-ms-track,
.plyr--full-ui input[type=range]:focus-visible::-webkit-slider-runnable-track {
outline: 2px dashed var(--plyr-color-main);
outline-offset: 2px;
}
.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track,
.plyr--full-ui.plyr--audio input[type=range]::-ms-track,
.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track {
background-color: rgba(#334155, 0.6);
background-color: rgba(var(--color-slate-700), 0.6);
}
.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb,
.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb,
.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb {
box-shadow: 0 1px 1px rgba(51, 65, 85), 0 0 0 1px rgba(30, 41, 59, 0.2), 0 0 0 3px rgba(51, 65, 85, 0.1);
box-shadow: 0 1px 1px rgba(var(--color-slate-700-rgb, 0.1)), 0 0 0 1px rgba(var(--color-slate-800-rgb), 0.2), 0 0 0 3px rgba(var(--color-slate-700-rgb), 0.1);
}
.plyr--full-ui.plyr--video .plyr__control--overlaid {
display: flex;
opacity: 0;
}
.plyr--full-ui.plyr--video:hover .plyr__control--overlaid {
opacity: 1;
}
.plyr--full-ui.plyr--video input[type=range]::-moz-range-track,
.plyr--full-ui.plyr--video input[type=range]::-ms-track,
.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track {
background-color: rgba(255, 255, 255, 0.2);
}
.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb,
.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb,
.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb {
box-shadow: 0 1px 1px rgba(51, 65, 85), 0 0 0 1px rgba(30, 41, 59, 0.2), 0 0 0 3px rgba(255, 255, 255, 0.5);
box-shadow: 0 1px 1px rgba(var(--color-slate-700-rgb, 0.1)), 0 0 0 1px rgba(var(--color-slate-800-rgb), 0.2), 0 0 0 3px rgba(255, 255, 255, 0.5);
}
.plyr--full-ui::-webkit-media-controls,
.plyr--full-ui::-webkit-media-text-track-container {
display: none;
}
.plyr--full-ui:after,
.plyr--full-ui:before {
box-sizing: inherit;
}
.plyr--fullscreen-enabled [data-plyr=fullscreen] {
display: inline-block;
}
.plyr--fullscreen-fallback {
background-color: #0f172a;
background-color: var(--color-slate-900);
border-radius: 0 !important;
bottom: 0;
height: 100%;
left: 0;
margin: 0;
position: fixed;
right: 0;
top: 0;
width: 100%;
z-index: 10000000;
}
.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen {
display: block;
}
.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen + svg {
display: none;
}
.plyr--fullscreen-fallback video {
height: 100%;
}
.plyr--fullscreen-fallback.plyr--hide-controls {
cursor: none;
}
.plyr--loading .plyr__progress__buffer {
animation: plyr-progress 1s linear infinite;
background-repeat: repeat-x;
background-size: 25px 25px;
color: #0f172a;
color: var(--color-slate-900);
}
.plyr--no-transition {
transition: none !important;
}
.plyr--pip-supported [data-plyr=pip] {
display: inline-block;
}
.plyr--playing .plyr__control--overlaid {
opacity: 0;
visibility: hidden;
}
.plyr--stopped.plyr__poster-enabled .plyr__poster {
opacity: 1;
}
.page-help-center-topic .plyr__poster {
background-color: var(--page-primary-hex-lightest);
}
.plyr--video {
background: none;
overflow: hidden;
}
.plyr--video .plyr__control:focus-visible,
.plyr--video .plyr__control:hover,
.plyr--video .plyr__control[aria-expanded=true] {
background-color: var(--plyr-video-control-background-hover);
color: #FFFFFF;
color: var(--color-white);
filter: brightness(1.5);
}
.plyr__video-wrapper::before {
background: rgba(0, 0, 0, 0.3);
bottom: 0;
content: "";
height: 100%;
left: 0;
opacity: 1;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
transition: opacity 0.3s ease;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
will-change: opacity;
z-index: 2;
}
.plyr--playing .plyr__video-wrapper::before {
opacity: 0;
}
.plyr--video .plyr__control:hover {
background-color: var(--plyr-video-control-background-hover);
}
.plyr--video .plyr__controls {
align-items: center;
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2));
border-bottom-left-radius: inherit;
border-bottom-right-radius: inherit;
bottom: 0;
color: #FFFFFF;
color: var(--color-white);
gap: 4px;
left: 0;
padding: 0.5rem;
position: absolute;
right: 0;
transition: opacity 0.4s ease-in-out, transform 0.4s ease-in-out;
z-index: 3;
}
.plyr--video .plyr__progress__buffer {
background-color: rgba(255, 255, 255, 0.35);
color: rgba(255, 255, 255, 0.2);
}
.plyr--video.plyr--hide-controls .plyr__controls {
opacity: 0.4;
}
.plyr--video.plyr--menu-open {
overflow: visible;
}
.plyr--youtube.plyr--paused.plyr__poster-enabled:not(.plyr--stopped) .plyr__poster {
display: none;
}
.plyr:focus {
outline: 0;
}
.plyr:fullscreen {
background: #0f172a;
background: var(--color-slate-900);
border-radius: 0 !important;
height: 100%;
margin: 0;
width: 100%;
}
.plyr:fullscreen .plyr__control .icon--exit-fullscreen {
display: block;
}
.plyr:fullscreen .plyr__control .icon--exit-fullscreen + svg {
display: none;
}
.plyr:fullscreen video {
height: 100%;
}
.plyr:fullscreen.plyr--hide-controls {
cursor: none;
}
.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty) ~ .plyr__captions {
transform: translateY(-40px);
}
.plyr__badge {
background: var(--plyr-badge-background);
border-radius: 2px;
color: var(--plyr-badge-color);
font-size: 9px;
line-height: 1;
padding: 3px 4px;
}
.plyr__caption {
--plyr-captions-background: rgba(var(--color-slate-900-rgb), .8);
--plyr-captions-color: var(--color-white);
background: rgba(15, 23, 42, .8);
background: var(--plyr-captions-background);
border-radius: 2px;
-webkit-box-decoration-break: clone;
box-decoration-break: clone;
color: #FFFFFF;
color: var(--plyr-captions-color);
line-height: 185%;
padding: 0.2em 0.5em;
white-space: pre-wrap;
}
.plyr__caption div {
display: inline;
}
.plyr__captions {
animation: plyr-fade-in 350ms 250ms linear;
bottom: 0;
font-size: 13px;
left: 0;
padding: 10px;
position: absolute;
text-align: center;
transition: transform 400ms linear;
width: 100%;
will-change: transform;
}
.plyr__captions,.plyr__captions span:empty {
display: none;
}
.plyr__control {
background: var(--plyr-video-control-background);
border: 0;
border-radius: 3px;
color: inherit;
cursor: pointer;
overflow: visible;
padding: 7px;
position: relative;
transition: all 0.3s ease;
}
.plyr__control svg {
display: block;
fill: currentColor;
height: 18px;
width: 18px;
}
.plyr__control--overlaid {
align-items: center;
background: var(--plyr-video-control-background-hover, var(--plyr-color-main, var(--plyr-color-main, var(--plyr-color-main))));
border: 0;
border-radius: 12px;
color: #FFFFFF;
color: var(--color-white);
display: flex;
height: 52px !important;
justify-content: center;
left: 50%;
opacity: 1;
padding: 0 !important;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
transition-duration: 250ms;
transition-property: opacity, background-color, filter;
width: 52px !important;
will-change: opacity, background-color, filter;
z-index: 2;
}
.plyr__control--overlaid svg {
position: relative;
transform: scale(1);
}
@media (min-width: 1100px) {
.plyr__control--overlaid svg {
transform: scale(1.5);
}
.plyr__control--overlaid {
padding: 1rem;
}
}
.plyr__control--overlaid:focus,.plyr__control--overlaid:hover {
opacity: 1;
}
.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed {
display: none;
}
.plyr__control:focus {
outline: 0;
}
.plyr__control:focus-visible {
outline: 2px dashed var(--plyr-color-main);
outline-offset: 2px;
}
.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed {
display: none;
}
.plyr__controls {
display: flex;
text-align: center;
}
.plyr__controls .plyr__controls__item {
align-items: center;
margin-left: 2.5px;
}
.plyr__controls .plyr__controls__item.plyr__progress__container {
padding-left: 2.5px;
width: 100%;
}
.plyr__controls .plyr__controls__item.plyr__progress__container:first-child {
padding-left: 0;
}
.plyr__controls .plyr__controls__item.plyr__time {
padding: 0 5px;
}
.plyr__controls .plyr__controls__item.plyr__time + .plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child {
padding-left: 0;
}
.plyr__controls .plyr__controls__item:first-child {
border-radius: 0.25em;
margin-left: 0;
margin-right: auto;
}
.plyr__controls .plyr__progress__container {
min-width: 0;
}
.plyr__controls > .plyr__control:first-child + .plyr__control .plyr__tooltip {
left: 0;
transform: translateY(10px) scale(0.8);
transform-origin: 0 100%;
}
.plyr__controls > .plyr__control:first-child + .plyr__control .plyr__tooltip--visible {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:first-child + .plyr__control .plyr__tooltip:before {
left: 16px;
}
.plyr__controls > .plyr__control:first-child + .plyr__control:focus-visible .plyr__tooltip {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:first-child + .plyr__control:hover .plyr__tooltip {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:first-child .plyr__tooltip {
left: 0;
transform: translateY(10px) scale(0.8);
transform-origin: 0 100%;
}
.plyr__controls > .plyr__control:first-child .plyr__tooltip--visible {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:first-child .plyr__tooltip:before {
left: 16px;
}
.plyr__controls > .plyr__control:first-child:focus-visible .plyr__tooltip {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:first-child:hover .plyr__tooltip {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:last-child .plyr__tooltip {
left: auto;
right: 0;
transform: translateY(10px) scale(0.8);
transform-origin: 100% 100%;
}
.plyr__controls > .plyr__control:last-child .plyr__tooltip--visible {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:last-child .plyr__tooltip:before {
left: auto;
right: 16px;
transform: translateX(50%);
}
.plyr__controls > .plyr__control:last-child:focus-visible .plyr__tooltip {
transform: translate(0) scale(1);
}
.plyr__controls > .plyr__control:last-child:hover .plyr__tooltip {
transform: translate(0) scale(1);
}
.plyr__controls:empty {
display: none;
}
.plyr__cues {
background: currentColor;
display: block;
height: 5px;
left: 0;
opacity: 0.8;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 3px;
z-index: 3;
}
.plyr__menu {
display: flex;
position: relative;
}
.plyr__menu .plyr__control svg {
transition: transform 0.3s ease;
}
.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip {
display: none;
}
.plyr__menu .plyr__control[aria-expanded=true] svg {
transform: rotate(90deg);
}
.plyr__menu__container {
animation: plyr-popup 0.2s ease;
background: rgba(255, 255, 255, 0.9);
background: var(--plyr-menu-background, rgba(255, 255, 255, 0.9));
border-radius: 4px;
bottom: 100%;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
color: #334155;
color: var(--color-slate-700);
font-size: 15px;
margin-bottom: 10px;
position: absolute;
right: -3px;
text-align: left;
white-space: nowrap;
z-index: 3;
}
.plyr__menu__container .plyr__control {
color: #334155;
color: var(--color-slate-700);
display: flex;
font-size: 13px;
padding: 4.66667px 10.5px;
width: 100%;
}
.plyr__menu__container .plyr__control > span {
display: flex;
width: 100%;
}
.plyr__menu__container .plyr__control--back {
font-weight: 400;
margin: 7px;
padding-left: 28px;
position: relative;
width: calc(100% - 14px);
}
.plyr__menu__container .plyr__control--back:after {
border-right-color: #334155;
border-right-color: var(--color-slate-700);
left: 6.5px;
}
.plyr__menu__container .plyr__control--back:before {
background: #f8fafc;
background: var(--color-slate-50);
background: var(--plyr-menu-back-border-color, var(--color-slate-50));
box-shadow: 0 1px 0 #FFFFFF;
box-shadow: 0 1px 0 var(--color-white);
content: "";
height: 1px;
left: 0;
margin-top: 3.5px;
overflow: hidden;
position: absolute;
right: 0;
top: 100%;
}
.plyr__menu__container .plyr__control--back:focus-visible:after {
border-right-color: currentcolor;
border-right-color: initial;
}
.plyr__menu__container .plyr__control--back:hover:after {
border-right-color: currentcolor;
border-right-color: initial;
}
.plyr__menu__container .plyr__control--forward {
padding-right: 28px;
}
.plyr__menu__container .plyr__control--forward:after {
border-left-color: #334155;
border-left-color: var(--color-slate-700);
right: 6.5px;
}
.plyr__menu__container .plyr__control--forward:focus-visible:after {
border-left-color: currentcolor;
border-left-color: initial;
}
.plyr__menu__container .plyr__control--forward:hover:after {
border-left-color: currentcolor;
border-left-color: initial;
}
.plyr__menu__container .plyr__control:after {
border: 4px solid rgba(0, 0, 0, 0);
content: "";
position: absolute;
top: 50%;
transform: translateY(-50%);
}
.plyr__menu__container .plyr__control[role=menuitemradio] {
padding-left: 7px;
}
.plyr__menu__container .plyr__control[role=menuitemradio]:after {
background: #FFFFFF;
background: var(--color-white);
border: 0;
border-radius: 100%;
height: 6px;
left: 12px;
opacity: 0;
top: 50%;
transform: translateY(-50%) scale(0);
transition: transform 0.3s ease, opacity 0.3s ease;
width: 6px;
}
.plyr__menu__container .plyr__control[role=menuitemradio]:before {
background: rgba(0, 0, 0, 0.1);
border-radius: 100%;
content: "";
display: block;
height: 16px;
margin-right: 10px;
transition: all 0.3s ease;
width: 16px;
}
.plyr__menu__container .plyr__control[role=menuitemradio]:focus-visible:before {
background: rgba(51, 65, 85, 0.1);
background: rgba(var(--color-slate-700-rgb), 0.1);
}
.plyr__menu__container .plyr__control[role=menuitemradio]:hover:before {
background: rgba(51, 65, 85, 0.1);
background: rgba(var(--color-slate-700-rgb), 0.1);
}
.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:after {
opacity: 1;
transform: translateY(-50%) scale(1);
}
.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before {
background: var(--plyr-color-main);
background: var(--plyr-control-toggle-checked-background, var(--plyr-color-main, var(--plyr-color-main, var(--plyr-color-main))));
}
.plyr__menu__container .plyr__menu__value {
display: flex;
margin-left: auto;
margin-right: -5px;
overflow: hidden;
padding-left: 24.5px;
}
.plyr__menu__container > div {
overflow: hidden;
transition: height 0.35s cubic-bezier(0.4, 0, 0.2, 1), width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}
.plyr__menu__container [role=menu] {
padding: 7px;
}
.plyr__menu__container [role=menuitem] {
margin-top: 2px;
}
.plyr__menu__container [role=menuitem]:first-child {
margin-top: 0;
}
.plyr__menu__container [role=menuitemradio] {
margin-top: 2px;
}
.plyr__menu__container [role=menuitemradio]:first-child {
margin-top: 0;
}
.plyr__menu__container:after {
border: 4px solid rgba(0, 0, 0, 0);
border-top-color: rgba(255, 255, 255, 0.9);
content: "";
height: 0;
position: absolute;
right: 14px;
top: 100%;
width: 0;
}
.plyr__poster {
background-color: transparent;
background-position: 50% 50%;
background-repeat: no-repeat;
background-size: 102%;
transition-duration: 200ms;
transition-property: opacity;
}
.plyr__poster,.plyr__preview-scrubbing {
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 1;
}
.plyr__preview-scrubbing {
bottom: 0;
margin: auto;
overflow: hidden;
right: 0;
transition: opacity 0.3s ease;
}
.plyr__preview-scrubbing img {
height: 100%;
left: 0;
max-height: none;
max-width: none;
position: absolute;
top: 0;
width: 100%;
}
.plyr__preview-scrubbing--is-shown {
opacity: 1;
}
.plyr__preview-thumb {
background-color: rgba(255, 255, 255, 0.9);
border-radius: 5px;
bottom: 100%;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
margin-bottom: 10px;
opacity: 0;
padding: 3px;
position: absolute;
transform: translateY(10px) scale(0.8);
transform-origin: 50% 100%;
transition: transform 0.2s ease 0.1s, opacity 0.2s ease 0.1s;
z-index: 2;
}
.plyr__preview-thumb--is-shown {
opacity: 1;
transform: translate(0) scale(1);
}
.plyr__preview-thumb:before {
border-left: 4px solid rgba(0, 0, 0, 0);
border-right: 4px solid rgba(0, 0, 0, 0);
border-top: 4px solid rgba(255, 255, 255, 0.9);
bottom: -4px;
content: "";
height: 0;
left: calc(50% + var(--preview-arrow-offset));
position: absolute;
transform: translateX(-50%);
width: 0;
z-index: 2;
}
.plyr__preview-thumb__image-container {
background: #f8fafc;
background: var(--color-slate-50);
border-radius: 4px;
overflow: hidden;
position: relative;
z-index: 0;
}
.plyr__preview-thumb__image-container img {
height: 100%;
left: 0;
max-height: none;
max-width: none;
position: absolute;
top: 0;
width: 100%;
}
.plyr__preview-thumb__image-container:after {
border-radius: inherit;
box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.15);
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.plyr__preview-thumb__time-container {
background-image: var(--plyr-video-controls-background);
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
bottom: 0;
left: 0;
line-height: 1.1;
padding: 20px 6px 6px;
position: absolute;
right: 0;
z-index: 3;
}
.plyr__preview-thumb__time-container span {
color: #FFFFFF;
color: var(--color-white);
font-size: 13px;
}
.plyr__progress {
left: 6.5px;
margin-right: 13px;
position: relative;
}
.plyr__progress .plyr__tooltip {
left: 0;
max-width: 120px;
overflow-wrap: break-word;
}
.plyr__progress input[type=range] {
position: relative;
z-index: 2;
}
.plyr__progress input[type=range],.plyr__progress__buffer {
margin-left: -6.5px;
margin-right: -6.5px;
width: calc(100% + 13px);
}
.plyr__progress__buffer {
background-image: rgba(255, 255, 255, 0.2);
border: 0;
border-radius: 100px;
height: 5px;
left: 0;
margin-top: -2.5px;
padding: 0;
position: absolute;
top: 50%;
}
.plyr__progress__buffer::-moz-progress-bar {
background: currentColor;
border-radius: 100px;
min-width: 5px;
-moz-transition: width 0.2s ease;
transition: width 0.2s ease;
}
.plyr__progress__buffer::-ms-fill {
border-radius: 100px;
-ms-transition: width 0.2s ease;
transition: width 0.2s ease;
}
.plyr__progress__buffer::-webkit-progress-bar {
background: rgba(0, 0, 0, 0);
}
.plyr__progress__buffer::-webkit-progress-value {
background: currentColor;
border-radius: 100px;
min-width: 5px;
-webkit-transition: width 0.2s ease;
transition: width 0.2s ease;
}
.plyr__progress__marker {
background-color: #FFFFFF;
background-color: var(--color-white);
border-radius: 1px;
height: 5px;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 3px;
z-index: 3;
}
.plyr__sr-only {
border: 0 !important;
clip: rect(1px, 1px, 1px, 1px);
height: 1px !important;
overflow: hidden;
padding: 0 !important;
position: absolute !important;
width: 1px !important;
}
.plyr__time {
font-size: 13px;
}
.plyr__time + .plyr__time:before {
content: "⁄";
margin-right: 10px;
}
.plyr__tooltip {
background: rgba(255, 255, 255, 0.9);
background: var(--plyr-tooltip-background, rgba(255, 255, 255, 0.9));
border-radius: 5px;
bottom: 100%;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
color: #334155;
color: var(--color-slate-700);
font-size: 13px;
font-weight: 400;
left: 50%;
line-height: 1.3;
margin-bottom: 10px;
opacity: 0;
padding: 5px 7.5px;
position: absolute;
transform: translate(-50%, 10px) scale(0.8);
transform-origin: 50% 100%;
transition: transform 0.2s ease 0.1s, opacity 0.2s ease 0.1s;
white-space: nowrap;
z-index: 2;
}
.plyr__tooltip--visible {
opacity: 1;
transform: translate(-50%) scale(1);
}
.plyr__tooltip:before {
border-left: 4px solid rgba(0, 0, 0, 0);
border-right: 4px solid rgba(0, 0, 0, 0);
border-top: 4px solid rgba(255, 255, 255, 0.9);
bottom: -4px;
content: "";
height: 0;
left: 50%;
position: absolute;
transform: translateX(-50%);
width: 0;
z-index: 2;
}
.plyr__video-embed iframe {
border: 0;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.plyr__video-wrapper {
background: var(--plyr-video-background);
height: 100%;
margin: auto;
overflow: hidden;
position: relative;
width: 100%;
}
.plyr__video-wrapper--fixed-ratio video {
border: 0;
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
}
.plyr__volume {
display: flex;
position: relative;
}
.plyr__volume input[type=range] {
margin-left: 5px;
margin-right: 5px;
max-width: 90px;
min-width: 60px;
position: relative;
z-index: 2;
}
a.plyr__control {
text-decoration: none;
}
a.plyr__control:after,
a.plyr__control:before {
display: none;
}
@media (min-width: 480px) {
.plyr--video .plyr__controls {
padding: 10px;
}
.plyr__captions {
font-size: 15px;
padding: 20px;
}
}
@media (min-width: 768px) {
.plyr__captions {
font-size: 18px;
}
}
@media (max-width: 767px) {
.plyr__time + .plyr__time {
display: none;
}
}
@media (min-width: 1024px) {
.plyr--fullscreen-fallback .plyr__captions {
font-size: 21px;
}
.plyr:fullscreen .plyr__captions {
font-size: 21px;
}
}
.plyr {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.list-grid {
--grid-list-columns: 1;
--grid-list-gaps: 2.25rem;
display: grid;
grid-gap: 2.25rem;
grid-gap: var(--grid-list-gaps);
grid-template-columns: repeat(1, 1fr);
grid-template-columns: repeat(var(--grid-list-columns), 1fr);
}
@media (min-width: 576px) and (max-width: 991.98px) {
.list-grid {
--grid-list-columns: 1;
--grid-list-gaps: 1.5rem;
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.list-grid {
--grid-list-columns: 2;
--grid-list-gaps: 2rem;
}
}
@media (min-width: 1380px) {
.list-grid {
--grid-list-columns: 3;
--grid-list-gaps: 2.25rem;
}
}
.list-article__item {
border-radius: 8px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
overflow: hidden;
position: relative;
position: relative;
transition-duration: 50ms, 250ms, 250ms;
transition-property: box-shadow, opacity, transform;
transition-timing-function: linear;
will-change: box-shadow, opacity, transform;
}
.list-article__item:hover, .list-article__item:focus {
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
}
.list-article__item:active {
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}
.list-article__item[data-color] {
--meta-height: 28px;
--figure-bg: linear-gradient(45deg, var(--color-accent-0-light), var(--color-white));
}
.article-card__content,
.article-card__footer {
padding: 0 2.027rem;
padding: 0 var(--rem-p6);
}
@media (max-width: 768px) {
.article-card__content,
.article-card__footer {
padding: 0 1.602rem;
padding: 0 var(--rem-p4);
}
}
.article-card__content .article-content__title {
-webkit-box-orient: vertical;
display: -webkit-box;
font-size: 1.25rem;
font-weight: 700;
letter-spacing: -0.01em;
-webkit-line-clamp: 3;
margin: 0;
overflow: hidden;
text-indent: -0.04em;
}
.article-card__content .article-content__title span.date {
font-feature-settings: "onum" 1;
}
.article-card__content .article-content__meta {
align-items: center;
color: #475569;
color: var(--color-slate-600);
display: flex;
font-size: 1.125rem;
font-weight: 600;
line-height: 1;
margin-top: 10px;
}
.article-card__content .article-content__desc {
-webkit-box-orient: vertical;
color: #262626;
color: var(--color-grey-800);
display: -webkit-box;
font-size: 1rem;
-webkit-font-smoothing: antialiased;
-webkit-line-clamp: 3;
line-height: 1.563;
margin: 1rem 0 0 0;
margin-bottom: 0.5rem;
overflow: hidden;
}
@media (min-width: 768px) {
.article-card__content .article-content__title {
font-size: 1.563rem;
}
.article-card__content .article-content__desc {
font-size: 1.125rem;
}
}
.article-card__link {
bottom: 0;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
z-index: 3;
}
.article-card__figure {
--figure-height: 300px;
--figure-image-width: 100%;
aspect-ratio: 1/1;
height: 300px;
height: var(--figure-height);
min-height: 300px;
min-height: var(--figure-height);
overflow: hidden;
position: relative;
width: 100%;
}
.article-card__figure::before {
display: none;
z-index: -1;
}
.article-figure__image,
.article-figure__gradient,
.article-figure__pattern {
bottom: 0;
height: 100%;
left: 0;
overflow: hidden;
pointer-events: none;
position: absolute;
right: 0;
top: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.article-figure__gradient {
background-image: var(--figure-bg);
z-index: -2;
}
.article-figure__pattern svg {
bottom: -20px;
fill: #FFFFFF;
fill: var(--color-white);
left: -100px;
position: absolute;
right: 0;
transform: scaleY(2.5) scaleX(3.5);
width: 100%;
z-index: -2;
}
.article-figure__image img {
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: center;
object-position: center;
transition-delay: 100ms;
transition-duration: 100ms;
transition-property: transform;
transition-timing-function: ease-in-out;
width: 100%;
will-change: transform;
}
.page-latest-news .article-figure__image img {
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
}
.list-article__item:hover .article-figure__image img,
.list-article__item:focus .article-figure__image img {
transform: scale(0.95);
}
@media (max-width: 991.98px) {
.article-card__figure {
--figure-image-width: auto;
}
}
@media (min-width: 992px) {
.article-card__figure {
--figure-height: 400px;
--figure-image-width: 80%;
}
}
@media (min-width: 1380px) {
.article-card__figure {
--figure-image-width: 290px;
height: 290px;
height: var(--figure-image-width);
}
}
.article-figure__image .article-image__wrapper {
align-items: center;
display: flex;
height: calc(var(--figure-height) / 1.563);
justify-content: center;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%) scale(1);
transition-duration: 250ms;
transition-property: transform;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
width: var(--figure-image-width);
will-change: transform;
}
@media (min-width: 1380px) {
.article-figure__image .article-image__wrapper {
height: var(--figure-image-width);
width: var(--figure-image-width);
}
}
.article-figure__image .article-image__wrapper img + i {
display: none;
}
.article-figure__image .article-image__wrapper img.default-fallback + i {
align-items: center;
color: rgba(255, 255, 255, 0.85);
display: block;
display: flex;
font-size: calc(var(--figure-height) / 1.563 / 3);
height: 100px;
justify-content: center;
left: 50%;
position: absolute;
text-align: center;
top: 50%;
transform: translate(-50%, -50%);
width: 100px;
will-change: transform;
z-index: 1;
}
@media (max-width: 992px) {
.article-figure__image .article-image__wrapper img + i {
font-size: 80px;
}
}
.article-figure__image img {
border-radius: 0.25em;
filter: drop-shadow(0px 15px 10px rgba(50, 50, 93, 0.25));
max-height: calc(var(--figure-height) / 1.25);
max-width: var(--figure-image-width);
}
.article-figure__meta {
background-color: #FFFFFF;
background-color: var(--color-white);
border-radius: 6px;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
height: 36px;
position: absolute;
right: 12px;
top: 12px;
transform: scale(0);
transition-delay: 50ms;
transition-duration: 250ms;
transition-property: transform;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
width: 36px;
will-change: transform;
}
.article-figure__meta,.article-figure__meta .figure-meta__icon {
align-items: center;
display: flex;
justify-content: center;
}
.article-figure__meta .figure-meta__icon {
color: var(--color-accent-0-dark);
}
.article-figure__meta .figure-meta__icon svg {
display: block;
height: 24px;
width: 24px;
}
.list-article__item:hover .article-figure__meta {
transform: scale(1);
}
.article-meta__output {
background-color: white;
border: 1px solid rgba(100, 116, 139, 0.25);
border: 1px solid rgba(var(--color-slate-500-rgb), 0.25);
border-radius: 5px;
color: rgba(100, 116, 139, 1);
color: rgba(var(--color-slate-500-rgb), 1);
display: inline-block;
font-size: 0.875rem;
font-weight: 500;
padding: 3px 6px;
}
.article-card__footer {
padding-bottom: 2.027rem;
padding-bottom: var(--rem-p6);
}
.article-card__button {
--btn-bg: var(--color-white);
--btn-border: var(--color-slate-300);
--btn-color: var(--color-slate-500);
background-color: #FFFFFF;
background-color: var(--btn-bg);
border: 1px solid #cbd5e1;
border: 1px solid var(--btn-border);
border-radius: 0.25rem;
color: #64748b;
color: var(--btn-color);
display: block;
font-size: 1rem;
font-weight: 600;
letter-spacing: 0;
line-height: 1;
margin-top: 2.5rem;
outline: 0.5em solid rgba(0, 123, 255, 0);
outline: 0.5em solid rgba(var(--color-primary-500-rgb), 0);
outline-offset: 2px;
padding: 0.875rem 1rem;
text-align: center;
text-decoration: none;
transform: translate3d(0, 0, 0);
transition-duration: 0.1s;
transition-duration: 250ms;
transition-property: transform, background-color, border-color, color, outline;
will-change: transform, background-color, border-color, color, outline;
}
.list-article__item:hover .article-card__button, .list-article__item:focus .article-card__button {
--btn-bg: var(--color-white);
--btn-border: var(--color-primary-500);
--btn-color: var(--color-primary-600);
outline: 0.25em solid rgba(0, 123, 255, 0.1);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.1);
outline-offset: 0;
transform: translate3d(0, -3px, 0);
}
.assistant-trigger {
bottom: 1.563rem;
height: 48px;
position: fixed;
right: 1.563rem;
transform: translateY(0) translateX(0);
transition-duration: 300ms;
transition-property: transform, opacity, visibility, box-shadow;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
width: 48px;
}
.assistant-open .assistant-trigger {
opacity: 0;
transform: translateY(100px) translateX(100px) scale(0);
}
.assistant-trigger button {
align-items: center;
background: none;
background-attachment: fixed;
background-color: #007bff;
background-color: var(--color-primary-500);
background-repeat: no-repeat;
border: 0;
border-radius: 50%;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
color: #FFFFFF;
color: var(--color-white);
cursor: pointer;
cursor: pointer;
display: flex;
height: 48px;
justify-content: center;
margin: 0;
outline: 0;
padding: 0;
transform: translateY(0);
transition: transform, opacity, background-image, box-shadow;
transition-duration: 300ms;
transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
width: 48px;
will-change: transform, opacity, background-image, box-shadow;
}
.assistant-trigger .arrow-right {
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 15px solid #007bff;
border-top: 15px solid var(--color-primary-500);
content: "";
height: 0;
opacity: 0.8;
pointer-events: none;
position: absolute;
right: -10px;
top: 40px;
transform: rotate(-43deg);
transition-duration: 300ms;
transition-property: transform, right, top;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 0;
will-change: transform, right, top;
z-index: -1;
}
.assistant-trigger:hover .arrow-right,
.assistant-trigger:focus-within .arrow-right {
right: -8px;
top: 40px;
transform: rotate(-43deg);
}
.assistant-trigger button:hover {
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
transform: translateY(-5px) translateX(-5px) scale(1.1);
}
.assistant-trigger svg {
color: white;
display: block;
height: 24px;
width: 24px;
}
@media (min-width: 992px) {
.assistant-trigger button {
height: 54px;
width: 54px;
}
.assistant-trigger svg {
bottom: 30px;
right: 30px;
}
}
@media (max-width: 991.98px) {
.assistant-trigger {
bottom: 1rem;
right: 1rem;
}
.assistant-trigger .arrow-right {
right: -3px;
top: 36px;
}
}
#assistant {
border-bottom: 0;
border-radius: 0;
bottom: 0;
box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
display: none;
height: 100vh;
overflow: hidden;
position: fixed;
right: 0;
transform: translateY(calc(100% + 2rem)) scale(0);
transition-delay: 500ms;
transition-duration: 300ms;
width: 100%;
z-index: 1000000;
}
.assistant-complete #assistant {
display: block;
transform: translateY(0) scale(1);
}
@media (max-width: 991.98px) {
#assistant {
border-radius: 0;
height: 100vh;
left: 0;
width: 100%;
}
}
@media (min-width: 992px) {
#assistant {
border-radius: 0.5em;
height: 668px;
min-height: 668px;
right: 2rem;
transform: translateY(calc(100% + 2rem)) scale(0);
width: 368px;
}
.assistant-complete #assistant {
transform: translateY(-2rem) scale(1);
}
}
#assistant iframe {
height: 100%;
width: 100%;
}
:root {
--tooltip-bg: #fff;
--tooltip-color: #000;
--tooltip-border: #bbb;
}
.data-tooltip {
border-radius: 4px;
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
box-sizing: border-box;
display: inline-block;
font-family: sans-serif;
height: auto;
position: relative;
width: 200px;
}
.data-tooltip::before, .data-tooltip::after {
content: "";
display: inline-block;
height: 1rem;
position: absolute;
width: 1rem;
}
.data-tooltip::before {
background-color: #bbb;
background-color: var(--tooltip-border);
bottom: -10.5px;
z-index: -1;
}
.data-tooltip::before,.data-tooltip::after {
clip-path: polygon(0 0, 100% 0, 50% 100%);
left: 50%;
transform: translateX(-50%);
}
.data-tooltip::after {
background-color: #fff;
background-color: var(--tooltip-bg);
bottom: -9px;
z-index: 1;
}
.data-tooltip.data-tooltip--s {
left: 50%;
top: -6px;
transform: translateX(-50%) translateY(-100%);
}
.data-tooltip.data-tooltip--n {
left: 50%;
top: calc((100% - 6px) * -1);
transform: translateX(-50%) translateY(100%);
}
.data-tooltip.data-tooltip--n::before, .data-tooltip.data-tooltip--n::after {
clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
}
.data-tooltip.data-tooltip--n::before {
bottom: auto;
bottom: initial;
top: -10.5px;
}
.data-tooltip.data-tooltip--n::after {
bottom: auto;
bottom: initial;
top: -9px;
}
.data-tooltip.data-tooltip--e {
left: calc(100% + 6px);
top: 50%;
transform: translateY(-50%);
}
.data-tooltip.data-tooltip--e::before, .data-tooltip.data-tooltip--e::after {
bottom: auto;
bottom: initial;
clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
top: 50%;
transform: rotate(-90deg) translateY(-50%);
transform-origin: center left;
}
.data-tooltip.data-tooltip--e::before {
left: 5.5px;
}
.data-tooltip.data-tooltip--e::after {
left: 6.5px;
}
.data-tooltip.data-tooltip--w {
right: calc(100% + 6px);
top: 50%;
transform: translateY(-50%);
}
.data-tooltip.data-tooltip--w::before, .data-tooltip.data-tooltip--w::after {
bottom: auto;
bottom: initial;
clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
left: auto;
left: initial;
top: 50%;
transform: rotate(90deg) translateY(-50%);
transform-origin: center right;
}
.data-tooltip.data-tooltip--w::before {
right: 5.5px;
}
.data-tooltip.data-tooltip--w::after {
right: 6.5px;
}
.data-tooltip:not(.data-tooltip--show) {
display: none;
}
.data-tooltip.data-tooltip--show {
display: inline-block;
margin: 0;
position: absolute;
z-index: 2147483647;
}
.data-tooltip .data-tooltip__inner {
background-color: #fff;
background-color: var(--tooltip-bg);
border: 1px solid #bbb;
border: 1px solid var(--tooltip-border);
border-radius: 0.5em;
padding: 1rem;
}
.data-tooltip .data-tooltip__title {
color: #000;
color: var(--tooltip-color);
display: block;
font-size: 12px;
font-weight: bold;
line-height: 1.25;
margin: 0 0 4px;
}
.data-tooltip .data-tooltip__text {
color: #000;
color: var(--tooltip-color);
font-size: 12px;
font-weight: normal;
-webkit-hyphens: auto;
hyphens: auto;
line-height: 1.414;
margin: 0;
opacity: 0.6;
}
.filter-list__btn {
--list-btn-color: var(--color-black);
--list-btn-bg: var(--color-white);
--list-btn-border: var(--color-slate-200);
--list-btn-border-focus: #dee2e6;
--list-btn-color-hover: var(--color-black);
--list-btn-color-focus: var(--color-black);
--icon-color: rgba(var(--color-blue-rgb), 1);
--btn-bg-expanded: #fff;
align-items: center;
background-color: #FFFFFF;
background-color: var(--list-btn-bg);
border: 1px solid #e2e8f0;
border: 1px solid var(--list-btn-border);
border-radius: 0.25rem 0.25rem 0 0;
color: #000000;
color: var(--list-btn-color);
cursor: pointer;
display: inline-flex;
font-size: 1rem;
font-weight: bold;
height: 48px;
justify-content: space-between;
line-height: 48px;
overflow: hidden;
padding: 0 0.8rem;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.is-closed .filter-list__btn {
border-radius: 0.25rem;
}
.filter-list__btn .filter-list-btn__text {
align-items: center;
display: flex;
font-size: 1rem;
}
.filter-list__btn .filter-list-btn__text svg {
display: inline-flex;
fill: currentColor;
height: 12px;
margin-right: 0.35rem;
width: 12px;
}
.filter-list__btn .filter-list-btn__icon {
background: linear-gradient(120deg, #ebedee 0%, #ebedee 100%);
background-color: var(--list-btn-bg);
border-left: 1px solid var(--list-btn-border);
bottom: 0;
height: 100%;
position: absolute;
right: 0;
top: 0;
transition-duration: 150ms;
transition-property: border-color, background-color, color;
width: 50px;
}
.filter-list__btn .filter-list-btn__icon svg {
color: var(--icon-color);
display: inline-flex;
height: 16px;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%) scaleY(1);
transition-duration: 150ms;
transition-property: transform;
width: 16px;
will-change: transform;
}
.filter-list__btn[aria-expanded=true] {
border-radius: 0.25rem 0.25rem 0 0;
}
.filter-list__btn[aria-expanded=true] .filter-list-btn__text {
color: var(--list-btn-color-focus);
}
.filter-list__btn[aria-expanded=true] .filter-list-btn__icon {
background-color: var(--btn-bg-expanded);
}
.filter-list__btn[aria-expanded=true] .filter-list-btn__icon svg {
transform: translate(-50%, -50%) scaleY(-1);
}
.filter-list__btn:hover {
color: var(--list-btn-color-hover);
}
.filter-list__btn[aria-expanded=false]:focus, .filter-list__btn[aria-expanded=true]:focus {
background-color: var(--list-btn-bg);
border-color: var(--list-btn-border-focus);
color: var(--list-btn-color-focus);
outline: 0;
}
.filter-form-list {
--filterListScrollbarBg: var(--color-grey-lighter);
--filterListScrollbarThumb: rgba(var(--color-blue-rgb), 1);
--filterListListBg: var(--color-white);
--filterListListBorder: var(--color-slate-200);
--filterListListHover: var(--color-grey-lighter);
--filterListLabelBg: var(--color-grey-lighter);
--filterListLabelHover: rgba(0,0,0,0.05);
--filterListCheckboxUnchecked: var(--color-grey-lighter);
--filterListCheckboxChecked: rgba(var(--color-blue-rgb), 1);
--filterListCheckboxHover: rgba(var(--color-blue-rgb), .5);
background-color: #FFFFFF;
background-color: var(--filterListListBg);
border: 1px solid #e2e8f0;
border: 1px solid var(--filterListListBorder);
border-radius: 0 0 0.25rem 0.25rem;
border-top: 0px solid;
list-style: none;
margin: 0;
max-height: 200px;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none;
overflow-x: hidden;
overflow-y: scroll;
padding: 0 0;
scrollbar-width: none;
transition-duration: 250ms;
transition-property: background-color;
will-change: background-color;
}
.filter-form-list[aria-hidden=true] {
display: none;
}
.filter-form-list[aria-hidden=false] {
display: block;
}
.filter-form-list li {
border-bottom: 1px solid #e9ecef;
border-bottom: 1px solid var(--color-grey-lighter);
display: flex;
margin: 0 !important;
padding: 0 !important;
}
.filter-form-list li:last-of-type {
border-bottom: 0px;
}
.filter-form-list input {
justify-self: flex-end;
order: 1;
}
.filter-form-list label {
align-items: center;
cursor: pointer;
display: grid;
flex-direction: row-reverse;
font-size: 16px;
font-weight: normal;
grid-template-columns: 1fr 30px;
justify-content: space-between;
padding: 6px 8px 6px 10px;
transition-duration: 150ms;
transition-property: background-color;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
will-change: background-color;
}
.filter-form-list label:hover,
.filter-form-list label:focus-within {
background-color: #fdfcfb;
}
.filter-form-list span {
display: block;
line-height: 1.75;
max-width: calc(100% - 60px);
overflow: hidden;
text-align: left;
text-overflow: ellipsis;
white-space: pre;
width: 100%;
}
@media (max-width: 992px) {
.filter-form-list input[type=checkbox] {
border-radius: 3px;
height: 18px;
margin: 0;
overflow: hidden;
width: 18px;
}
.filter-form-list input[type=checkbox]:focus {
outline: 0px;
}
.filter-form-list input[type=checkbox]:before {
background-position: center;
background-repeat: no-repeat;
background-size: 100%;
content: "";
display: block;
height: 18px;
transition: background-color 250ms ease;
width: 18px;
}
.filter-form-list input[type=checkbox]:before,.filter-form-list input[type=checkbox]:focus:before {
background-color: var(--filterListCheckboxUnchecked);
}
.filter-form-list input[type=checkbox]:checked:before, .filter-form-list input[type=checkbox]:hover:checked:before {
background-color: var(--filterListCheckboxChecked);
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 18 18' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cpolygon fill='%23fff' points='7 14.414 2.293 9.707 3.707 8.293 7 11.586 14.293 4.293 15.707 5.707'%3E%3C/polygon%3E%3C/svg%3E");
}
.filter-form-list input[type=checkbox]:hover:checked:before {
background-color: var(--filterListCheckboxHover);
}
}
@media (min-width: 992px) {
.filter-form-list label {
font-family: inherit;
font-size: 16px;
}
.filter-form-list input[type=checkbox] {
border-radius: 3px;
height: 18px;
margin: 0;
overflow: hidden;
width: 18px;
}
.filter-form-list input[type=checkbox]:focus {
outline: 0px;
}
.filter-form-list input[type=checkbox]:before {
background-position: center;
background-repeat: no-repeat;
background-size: 100%;
content: "";
display: block;
height: 18px;
transition: background-color 250ms ease;
width: 18px;
}
.filter-form-list input[type=checkbox]:before,.filter-form-list input[type=checkbox]:focus:before {
background-color: var(--filterListCheckboxUnchecked);
}
.filter-form-list input[type=checkbox]:checked:before, .filter-form-list input[type=checkbox]:hover:checked:before {
background-color: var(--filterListCheckboxChecked);
background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 18 18' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cpolygon fill='%23fff' points='7 14.414 2.293 9.707 3.707 8.293 7 11.586 14.293 4.293 15.707 5.707'%3E%3C/polygon%3E%3C/svg%3E");
}
.filter-form-list input[type=checkbox]:hover:checked:before {
background-color: var(--filterListCheckboxHover);
}
}
.filter-form-list::-webkit-scrollbar {
background-color: var(--filterListScrollbarBg);
width: 0.25rem;
}
.filter-form-list::-webkit-scrollbar-thumb {
background-color: var(--filterListScrollbarThumb);
}
.filter-list__clear_container {
display: flex;
justify-content: flex-end;
}
.filter-list-btn__clear {
background-color: #e9ecef;
background-color: var(--color-grey-lighter);
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 0.35rem;
color: #000000;
color: var(--color-black);
cursor: pointer;
font-size: 10px;
font-weight: 600;
line-height: 20px;
margin: 13px 20px 0 0;
padding: 0 0.35rem;
position: absolute;
right: calc(40px + 0.5rem);
text-transform: uppercase;
top: 0px;
transition-duration: 100ms;
transition-property: opacity;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: 1;
}
.filter-list-btn__clear[aria-hidden=true] {
display: none;
}
.filter-list-btn__clear:focus, .filter-list-btn__clear:hover {
opacity: 0.8;
outline: 0;
}
.accordion-wrapper {
--accordion-icon-size: 42px;
--accordion-gap: 1rem;
--accordion-border-color: var(--color-slate-100);
--accordion-active-bg: var(--color-slate-200);
margin: 0 auto;
}
@media (min-width: 992px) {
.accordion-wrapper {
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr 1fr;
}
}
.accordion-item {
display: grid;
grid-gap: 0 var(--accordion-gap);
grid-template-columns: var(--accordion-icon-size) 1fr;
padding: 2.5rem 1rem;
}
@media (max-width: 767.98px) {
.accordion-item.is-active {
background-color: var(--accordion-active-bg);
}
.accordion-item:not(:last-child) {
border-bottom: 1px solid var(--accordion-border-color);
}
}
@media (min-width: 768px) {
.accordion-item {
border-bottom: 1px solid var(--accordion-border-color);
}
}
.accordion-btn {
align-items: center;
-webkit-appearance: none;
background: transparent;
border: none;
bottom: 0;
color: inherit;
cursor: pointer;
display: flex;
font: inherit;
height: 100%;
justify-content: flex-end;
left: 0;
line-height: normal;
margin: 0;
overflow: visible;
padding: 0;
position: absolute;
right: 0;
top: 0;
width: auto;
width: 100%;
}
@media (min-width: 768px) {
.accordion-btn {
display: none;
}
}
.accordion-icon-wrapper {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid;
border-radius: 999em;
display: flex;
height: 32px;
justify-content: center;
width: 32px;
}
.accordion-icon-wrapper .accordion-icon {
background: currentColor;
box-sizing: border-box;
display: block;
}
.accordion-icon-wrapper .accordion-icon,.is-active .accordion-icon-wrapper .accordion-icon {
height: 1px;
position: relative;
transform: scale(1);
width: 16px;
}
.is-active .accordion-icon-wrapper .accordion-icon::after {
background: currentColor;
box-sizing: border-box;
content: "";
display: block;
height: 16px;
left: 7px;
position: absolute;
top: -7px;
width: 1px;
}
@media (min-width: 768px) {
.accordion-icon-wrapper {
display: none;
}
}
.accordion-figure {
align-items: center;
display: flex;
height: 42px;
margin: 0;
overflow: hidden;
position: relative;
width: 42px;
}
.accordion-figure > div {
background-color: #007bff;
background-color: var(--color-primary-500);
border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
content: "";
display: block;
height: 42px;
width: 42px;
}
.accordion-figure img {
border-radius: 999em;
display: block;
height: 100%;
height: var(--accordion-icon-size);
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
width: var(--accordion-icon-size);
}
.accordion-header {
align-items: center;
display: flex;
height: 42px;
justify-content: space-between;
position: relative;
}
.accordion-header .accordion-title {
align-self: center;
line-height: 1;
margin: 0;
}
.accordion-content {
grid-column-start: 2;
overflow: hidden;
}
.accordion-content p {
font-size: 1rem;
line-height: 1.414;
margin: 0;
padding-right: 2rem;
}
@media (max-width: 768px) {
.accordion-content {
margin: 0;
max-height: 0;
padding: 0;
transition-duration: 600ms;
transition-property: max-height;
visibility: hidden;
}
.accordion-content p {
opacity: 0;
transition-delay: 200ms;
transition-duration: 300ms;
transition-property: opacity;
}
.is-active .accordion-content {
max-height: 1000px;
visibility: visible;
}
.is-active .accordion-content p {
opacity: 1;
}
}
.tabs__items {
border-radius: 0.5rem;
flex-wrap: wrap;
justify-content: flex-start;
list-style: none;
margin: 0 !important;
padding: 0;
position: relative;
z-index: 1;
}
.tabs__items,.tabs__item {
display: flex;
height: 36px;
}
.tabs__item {
align-items: center;
border-radius: 0.5em;
box-sizing: border-box;
color: #64748b;
color: var(--color-slate-500);
cursor: pointer;
font-weight: 500;
outline: 0.25em solid transparent;
padding: 0 1.125rem;
text-align: center;
transition-duration: 150ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: auto;
}
.tabs__item:not(.tabs__item--active):hover, .tabs__item:not(.tabs__item--active):focus, .tabs__item.tabs__item--active {
color: #0f172a;
color: var(--color-slate-900);
}
.tabs__item span {
display: block;
overflow: hidden;
white-space: pre;
}
@media (max-width: 992px) {
.tabs__item span {
text-overflow: ellipsis;
}
}
.tabs__filter {
background-color: rgba(var(--page-primary-rgb), 0.05);
border-radius: 0.8rem;
box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;
margin-bottom: 1.5rem;
padding: 6px;
position: relative;
}
.tabs__filter .tabs__rectangle {
border-radius: 0.8rem;
bottom: 0;
height: 36px;
pointer-events: none;
position: absolute;
top: 6px;
transition: transform 250ms ease-in-out;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tabs__content button.show-more-text {
-webkit-appearance: none;
background: transparent;
border: none;
color: inherit;
font: inherit;
font-weight: 700;
line-height: normal;
margin: 0;
overflow: visible;
padding: 0;
text-decoration: underline;
transition-duration: 150ms;
transition-property: text-decoration-color;
width: auto;
will-change: text-decoration-color;
}
.tabs__content button.show-more-text:hover, .tabs__content button.show-more-text:focus, .tabs__content button.show-more-text:focus-within {
text-decoration-color: rgba(var(--page-primary-rgb), 0.5);
}
.tabs__content {
height: 0px;
max-height: 0;
opacity: 0;
overflow: hidden;
transition: max-height 300ms ease-in-out, opacity 300ms ease-in-out;
}
.tabs__content.tabs__item--active {
height: auto;
max-height: 100%;
opacity: 1;
overflow: inherit;
}
.tile-container {
margin-left: auto;
margin-right: auto;
}
.tile-container + .tile-container {
margin-top: 4rem;
}
.tile-grid {
--tile-grid-cols: repeat(1, minmax(320px, 1fr));
--tile-grid-gap: 1.44rem;
align-items: center;
display: grid;
grid-gap: 1.44rem;
grid-gap: var(--tile-grid-gap);
grid-template-columns: repeat(1, minmax(320px, 1fr));
grid-template-columns: var(--tile-grid-cols);
justify-content: center;
}
.tile-grid + .pagination {
margin-top: 2.441rem;
}
@media (min-width: 768px) {
.tile-grid {
--tile-grid-cols: repeat(auto-fill, minmax(330px, 1fr));
}
}
@media (min-width: 992px) {
.tile-grid {
--tile-grid-cols: repeat(2, 1fr);
}
}
@media (min-width: 1380px) {
.tile-grid {
--tile-grid-cols: repeat(3, minmax(330px, 1fr));
}
}
.tile {
--tile-gx: 1rem;
--tile-gy: 1rem;
--tile-gap: 0.833rem;
--tile-title-fs: 1.44rem;
--tile-title-fw: 700;
--tile-subtitle-fs: 1rem;
--tile-subtitle-fw: 400;
--tile-excerpt-fs: 1rem;
--tile-excerpt-lh: 1.563;
--tile-excerpt-fw: 300;
--tile-link-fs: 1rem;
--tile-link-fw: 700;
--tile-radius: 6px;
border: 1px solid transparent;
border-radius: 6px;
border-radius: var(--tile-radius);
box-sizing: border-box;
outline: 0.279rem solid transparent;
outline-offset: 0.279rem;
overflow: hidden;
padding: 0;
}
.tile-wrapper {
display: grid;
grid-gap: var(--tile-gap);
}
.tile-wrapper .tile-btn {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 6px;
box-shadow: rgba(50, 50, 93, 0.05) 0 2px 5px -1px, rgba(0, 0, 0, 0.03) 0 1px 3px -1px;
color: #1e293b;
color: var(--color-slate-800);
display: inline-flex;
font-weight: 600;
grid-gap: 0.25rem;
height: 42px;
justify-content: center;
margin-bottom: var(--tile-gy);
margin-left: var(--tile-gx);
margin-top: calc(var(--tile-gy) * 2.441);
padding: 0 0.8333rem;
position: relative;
text-decoration: none;
top: 0;
transition-duration: 150ms;
transition-property: top;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: -moz-max-content;
width: max-content;
}
.tile-wrapper:hover .tile-btn, .tile-wrapper:focus-within .tile-btn {
top: -2px;
}
.tile-picture {
height: 330px;
overflow: visible;
pointer-events: none;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: 0;
}
.tile-picture img {
display: block;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
}
.tile-picture img:nth-of-type(1) {
border-radius: var(--tile-radius);
-o-object-fit: cover;
object-fit: cover;
position: relative;
z-index: 1;
}
.tile-picture img:nth-of-type(2) {
filter: blur(45px);
left: 0;
-o-object-fit: contain;
object-fit: contain;
top: 0;
transform: translate3d(0, 0, 0);
width: 85%;
}
.tile-picture img:nth-of-type(2),.tile-picture .tile-picture--icon {
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
}
.tile-picture .tile-picture--icon {
align-items: center;
color: white;
display: flex;
justify-content: center;
z-index: 2;
}
.tile-picture .tile-picture--icon svg {
height: 40%;
width: 40%;
}
.tile-picture .tile-picture--label {
bottom: 1rem;
left: 1rem;
position: absolute;
z-index: 2;
}
.tile-logo {
align-items: center !important;
aspect-ratio: 1/1 !important;
background-color: transparent !important;
display: flex !important;
height: 330px !important;
justify-content: center !important;
max-width: 100% !important;
width: calc(100% - var(--tile-gy) * 2);
}
.tile-logo img {
max-width: 180px !important;
-o-object-fit: contain !important;
object-fit: contain !important;
width: 50% !important;
}
.tile-figure {
margin: var(--tile-gap) 0 0;
overflow: hidden;
pointer-events: none;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tile-figure img {
display: block;
height: auto;
}
.tile-figure {
padding: 0 var(--tile-gx);
}
.tile-header {
padding: var(--tile-gy) calc(var(--tile-gx) * 1) 0;
}
.tile-header--title {
font-size: var(--tile-title-fs);
font-weight: var(--tile-title-fw);
}
.tile-header--title:not(:last-child) {
margin-bottom: var(--tile-gap);
}
.tile-header--subtitle,
.tile-header--date {
font-size: var(--tile-subtitle-fs);
font-weight: var(--tile-subtitle-fw);
}
.tile-header--excerpt {
font-size: var(--tile-excerpt-fs);
font-weight: var(--tile-excerpt-fw);
line-height: var(--tile-excerpt-lh);
margin: 0;
opacity: 0.8;
}
.tile-header--link {
margin: var(--tile-gap) 0 0;
}
.tile-header--link a {
align-items: center;
display: flex;
font-size: var(--tile-link-fs);
font-weight: var(--tile-link-fw);
grid-gap: 0.25em;
text-decoration: none;
}
.tile-header--link i {
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tile-tooltip {
cursor: pointer;
position: relative;
}
.tile-tooltip svg {
vertical-align: middle;
}
.tile-container--wrapper[data-type=logos] {
margin-left: auto;
margin-right: auto;
max-width: 100%;
overflow: hidden;
position: relative;
width: 100%;
}
.tile-container[data-type=logos] {
display: flex;
height: 70px;
-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgb(0, 0, 0) 75%, rgba(0, 0, 0, 0) 100%);
mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgb(0, 0, 0) 25%, rgb(0, 0, 0) 75%, rgba(0, 0, 0, 0) 100%);
overflow: hidden;
padding-left: 0;
padding-right: 0;
position: relative;
width: 100%;
}
.tile-container[data-type=logos] .tile {
border-radius: 0;
overflow: visible;
padding: 0;
}
.tile-container[data-type=logos] .tile-figure {
margin: 0;
padding: 0;
}
.tile-container[data-type=logos] .tile-figure i {
color: #334155;
color: var(--color-slate-700);
font-size: 26px;
}
.tile[data-partner] {
--scale-logo: 1;
--gutter-logos: 2rem;
}
@media (max-width: 767.98px) {
.tile[data-partner] {
--scale-logo: 1;
--gutter-logos: 2rem;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
.tile[data-partner] {
--scale-logo: 1;
--gutter-logos: 80px;
}
}
@media (min-width: 1100px) and (max-width: 1379.98px) {
.tile[data-partner] {
--scale-logo: 1;
--gutter-logos: 100px;
}
}
@media (min-width: 1380px) {
.tile[data-partner] {
--scale-logo: 1.125;
--gutter-logos: 260px;
}
.tile[data-partner=bt] {
--scale-logo: 1.5;
}
.tile[data-partner=urbandecay] {
--scale-logo: 1;
}
.tile[data-partner=instagram],
.tile[data-partner=twitter],
.tile[data-partner=ee] {
--scale-logo: 1.3;
}
}
@media (min-width: 1380px) {
}
.tile[data-partner=brita] .tile-wrapper {
height: calc(23.28px / var(--scale-logo));
width: calc(99.2px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=brita] .tile-wrapper {
height: calc(23.28px * var(--scale-logo));
width: calc(99.2px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=brita] .tile-wrapper {
height: calc(23.28px * var(--scale-logo));
width: calc(99.2px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=brita] .tile-wrapper {
height: calc(23.28px * var(--scale-logo));
width: calc(99.2px * var(--scale-logo));
}
}
.tile[data-partner=rimmel] .tile-wrapper {
height: calc(24.38px / var(--scale-logo));
width: calc(149.93px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=rimmel] .tile-wrapper {
height: calc(24.38px * var(--scale-logo));
width: calc(149.93px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=rimmel] .tile-wrapper {
height: calc(24.38px * var(--scale-logo));
width: calc(149.93px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=rimmel] .tile-wrapper {
height: calc(24.38px * var(--scale-logo));
width: calc(149.93px * var(--scale-logo));
}
}
.tile[data-partner=claires] .tile-wrapper {
height: calc(25.76px / var(--scale-logo));
width: calc(106.77px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=claires] .tile-wrapper {
height: calc(25.76px * var(--scale-logo));
width: calc(106.77px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=claires] .tile-wrapper {
height: calc(25.76px * var(--scale-logo));
width: calc(106.77px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=claires] .tile-wrapper {
height: calc(25.76px * var(--scale-logo));
width: calc(106.77px * var(--scale-logo));
}
}
.tile[data-partner=riotgames] .tile-wrapper {
height: calc(26px / var(--scale-logo));
width: calc(92.64px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=riotgames] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(92.64px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=riotgames] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(92.64px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=riotgames] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(92.64px * var(--scale-logo));
}
}
.tile[data-partner=wwe] .tile-wrapper {
height: calc(40px / var(--scale-logo));
width: calc(42px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=wwe] .tile-wrapper {
height: calc(40px * var(--scale-logo));
width: calc(42px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=wwe] .tile-wrapper {
height: calc(40px * var(--scale-logo));
width: calc(42px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=wwe] .tile-wrapper {
height: calc(40px * var(--scale-logo));
width: calc(42px * var(--scale-logo));
}
}
.tile[data-partner=urbandecay] .tile-wrapper {
height: calc(45px / var(--scale-logo));
width: calc(61.41px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=urbandecay] .tile-wrapper {
height: calc(45px * var(--scale-logo));
width: calc(61.41px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=urbandecay] .tile-wrapper {
height: calc(45px * var(--scale-logo));
width: calc(61.41px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=urbandecay] .tile-wrapper {
height: calc(45px * var(--scale-logo));
width: calc(61.41px * var(--scale-logo));
}
}
.tile[data-partner=intel] .tile-wrapper {
height: calc(25.93px / var(--scale-logo));
width: calc(66.84px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=intel] .tile-wrapper {
height: calc(25.93px * var(--scale-logo));
width: calc(66.84px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=intel] .tile-wrapper {
height: calc(25.93px * var(--scale-logo));
width: calc(66.84px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=intel] .tile-wrapper {
height: calc(25.93px * var(--scale-logo));
width: calc(66.84px * var(--scale-logo));
}
}
.tile[data-partner=instagram] .tile-wrapper {
height: calc(26px / var(--scale-logo));
width: calc(26px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=instagram] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(26px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=instagram] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(26px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=instagram] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(26px * var(--scale-logo));
}
}
.tile[data-partner=esl] .tile-wrapper {
height: calc(25.42px / var(--scale-logo));
width: calc(81.98px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=esl] .tile-wrapper {
height: calc(25.42px * var(--scale-logo));
width: calc(81.98px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=esl] .tile-wrapper {
height: calc(25.42px * var(--scale-logo));
width: calc(81.98px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=esl] .tile-wrapper {
height: calc(25.42px * var(--scale-logo));
width: calc(81.98px * var(--scale-logo));
}
}
.tile[data-partner=gameloft] .tile-wrapper {
height: calc(25.39px / var(--scale-logo));
width: calc(129.98px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=gameloft] .tile-wrapper {
height: calc(25.39px * var(--scale-logo));
width: calc(129.98px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=gameloft] .tile-wrapper {
height: calc(25.39px * var(--scale-logo));
width: calc(129.98px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=gameloft] .tile-wrapper {
height: calc(25.39px * var(--scale-logo));
width: calc(129.98px * var(--scale-logo));
}
}
.tile[data-partner=twitter] .tile-wrapper {
height: calc(25.87px / var(--scale-logo));
width: calc(31.84px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=twitter] .tile-wrapper {
height: calc(25.87px * var(--scale-logo));
width: calc(31.84px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=twitter] .tile-wrapper {
height: calc(25.87px * var(--scale-logo));
width: calc(31.84px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=twitter] .tile-wrapper {
height: calc(25.87px * var(--scale-logo));
width: calc(31.84px * var(--scale-logo));
}
}
.tile[data-partner=sky] .tile-wrapper {
height: calc(26px / var(--scale-logo));
width: calc(43.39px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=sky] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(43.39px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=sky] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(43.39px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=sky] .tile-wrapper {
height: calc(26px * var(--scale-logo));
width: calc(43.39px * var(--scale-logo));
}
}
.tile[data-partner=samsung] .tile-wrapper {
height: calc(20px / var(--scale-logo));
width: calc(130.58px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=samsung] .tile-wrapper {
height: calc(20px * var(--scale-logo));
width: calc(130.58px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=samsung] .tile-wrapper {
height: calc(20px * var(--scale-logo));
width: calc(130.58px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=samsung] .tile-wrapper {
height: calc(20px * var(--scale-logo));
width: calc(130.58px * var(--scale-logo));
}
}
.tile[data-partner=bt] .tile-wrapper {
height: calc(32px / var(--scale-logo));
width: calc(32px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=bt] .tile-wrapper {
height: calc(32px * var(--scale-logo));
width: calc(32px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=bt] .tile-wrapper {
height: calc(32px * var(--scale-logo));
width: calc(32px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=bt] .tile-wrapper {
height: calc(32px * var(--scale-logo));
width: calc(32px * var(--scale-logo));
}
}
.tile[data-partner=ee] .tile-wrapper {
height: calc(41.9px / var(--scale-logo));
width: calc(23.84px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=ee] .tile-wrapper {
height: calc(41.9px * var(--scale-logo));
width: calc(23.84px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=ee] .tile-wrapper {
height: calc(41.9px * var(--scale-logo));
width: calc(23.84px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=ee] .tile-wrapper {
height: calc(41.9px * var(--scale-logo));
width: calc(23.84px * var(--scale-logo));
}
}
.tile[data-partner=itv] .tile-wrapper {
height: calc(25.97px / var(--scale-logo));
width: calc(51.88px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=itv] .tile-wrapper {
height: calc(25.97px * var(--scale-logo));
width: calc(51.88px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=itv] .tile-wrapper {
height: calc(25.97px * var(--scale-logo));
width: calc(51.88px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=itv] .tile-wrapper {
height: calc(25.97px * var(--scale-logo));
width: calc(51.88px * var(--scale-logo));
}
}
.tile[data-partner=cw] .tile-wrapper {
height: calc(25.98px / var(--scale-logo));
width: calc(64.84px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=cw] .tile-wrapper {
height: calc(25.98px * var(--scale-logo));
width: calc(64.84px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=cw] .tile-wrapper {
height: calc(25.98px * var(--scale-logo));
width: calc(64.84px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=cw] .tile-wrapper {
height: calc(25.98px * var(--scale-logo));
width: calc(64.84px * var(--scale-logo));
}
}
.tile[data-partner=colgate] .tile-wrapper {
height: calc(20px / var(--scale-logo));
width: calc(93.38px / var(--scale-logo));
}
@media (min-width: 768px) and (max-width: 992px) {
.tile[data-partner=colgate] .tile-wrapper {
height: calc(20px * var(--scale-logo));
width: calc(93.38px * var(--scale-logo));
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.tile[data-partner=colgate] .tile-wrapper {
height: calc(20px * var(--scale-logo));
width: calc(93.38px * var(--scale-logo));
}
}
@media (min-width: 1380px) {
.tile[data-partner=colgate] .tile-wrapper {
height: calc(20px * var(--scale-logo));
width: calc(93.38px * var(--scale-logo));
}
}
.tile[data-partner=rimmel] .tile-wrapper {
margin-top: 8px;
}
.tile-container[data-type=logos] {
max-width: 1600px;
}
.tile-grid[data-type=logos] {
align-items: center;
color: #0f172a;
color: var(--color-slate-900);
display: flex;
flex-direction: row;
gap: 64px;
height: auto;
height: 100%;
margin: 0;
max-height: 100%;
max-width: 100%;
padding: 0;
place-items: center;
position: relative;
text-indent: none;
transform: translateX(0px);
width: 100%;
will-change: transform;
}
.tile-grid[data-type=logos] .tile,
.tile-grid[data-type=logos] .tile-wrapper {
align-items: center;
display: flex;
justify-content: center;
}
.tile-grid[data-type=logos] .tile {
border-radius: 0;
overflow: visible;
padding: 0;
}
.tile-grid[data-type=logos] .tile figure {
align-items: center;
display: flex;
height: -moz-max-content;
height: max-content;
justify-content: center;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tile-grid[data-type=logos] .tile figure svg {
align-items: center;
font-size: inherit;
vertical-align: 0;
}
.tile-grid[data-type=logos] a {
color: inherit;
position: relative;
}
.tile-grid[data-type=logos] a:hover, .tile-grid[data-type=logos] a:focus {
color: #334155;
color: var(--color-slate-700);
outline: 0;
transition-duration: 150ms;
transition-property: color;
}
.tile-grid[data-type=logos] a:hover i, .tile-grid[data-type=logos] a:focus i {
pointer-events: none;
}
.tile-grid[data-type=logos] i[class^=icon-],
.tile-grid[data-type=logos] i[class*=" icon-"],
.tile-grid[data-type=logos] i[class^=icon-] > svg,
.tile-grid[data-type=logos] i[class*=" icon-"] > svg {
height: 100%;
width: 100%;
}
.tile-grid[data-type=loadmore] {
display: grid;
grid-template-columns: 1fr;
justify-content: center;
width: 100%;
}
.tile-grid[data-type=loadmore] .tile-wrapper {
align-items: center;
border-radius: 0.833rem;
box-sizing: border-box;
display: flex;
justify-content: center;
padding: 2rem;
}
.tile-grid[data-type=loadmore] .tile-wrapper button {
align-items: center;
background-color: white;
background-image: linear-gradient(rgba(var(--page-primary-rgb), 0.01), rgba(var(--page-primary-rgb), 0.03));
border: 0;
border: 1px solid rgba(var(--page-primary-rgb), 0.35);
border-radius: 0.25rem;
border-radius: 0.85em;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
color: #80bdff;
color: var(--page-primary-hex);
cursor: pointer;
display: flex;
font-size: 1rem;
font-weight: bold;
height: 60px;
justify-content: center;
line-height: 1.2;
margin: 0.25rem;
max-width: 330px;
outline: 0.35em solid rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
overflow: hidden;
padding: 0.25rem 0.5rem;
position: relative;
text-decoration: none;
transition-duration: 150ms;
transition-property: outline-offset, outline-color, border-color, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
width: 100%;
}
.tile-grid[data-type=loadmore] .tile-wrapper button span {
position: relative;
top: 0;
transition-duration: 150ms;
}
.tile-grid[data-type=loadmore] .tile-wrapper button:hover {
transform: scaleY(1.03) scaleX(1.01);
}
.tile-grid[data-type=loadmore] .tile-wrapper button:hover, .tile-grid[data-type=loadmore] .tile-wrapper button:focus {
border-color: rgba(var(--page-primary-rgb), 0.5);
outline-color: rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
}
.tile-grid[data-type=loadmore] .tile-wrapper button:active,.tile-grid[data-type=loadmore] .tile-wrapper button[data-loading=false] {
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.85em;
}
.tile-grid[data-type=loadmore] .tile-wrapper button:active span {
top: -1px;
}
.tile-grid[data-type=loadmore] .tile-wrapper button[data-loading=true] {
filter: grayscale(100%);
}
.tile-grid[data-type=loadmore] .tile-wrapper button [aria-hidden=true] {
display: none;
}
.spinner {
display: inline-block;
height: -moz-max-content;
height: max-content;
position: relative;
width: 40px;
}
.spinner div {
animation-timing-function: cubic-bezier(0, 1, 1, 0);
background-color: rgba(var(--page-primary-rgb), 1);
border-radius: 999em;
height: 4px;
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 4px;
}
.spinner div:nth-child(1) {
animation: spinnerAnimation1 0.6s infinite;
left: 4px;
}
.spinner div:nth-child(2) {
animation: spinnerAnimation2 0.6s infinite;
left: 4px;
}
.spinner div:nth-child(3) {
animation: spinnerAnimation2 0.6s infinite;
left: 16px;
}
.spinner div:nth-child(4) {
animation: spinnerAnimation3 0.6s infinite;
left: 42px;
}
.spinner[aria-hidden=true] {
display: none;
}
@keyframes spinnerAnimation1 {
0% {
transform: scale(0);
}
100% {
transform: scale(1);
}
}
@keyframes spinnerAnimation3 {
0% {
transform: scale(1);
}
100% {
transform: scale(0);
}
}
@keyframes spinnerAnimation2 {
0% {
transform: translate(0, 0);
}
100% {
transform: translate(24px, 0);
}
}
.tile[data-type=press] {
--tile-gap: 0;
--tile-border-color: var(--color-slate-300);
background-color: white;
border-color: #cbd5e1;
border-color: var(--tile-border-color);
padding: calc(var(--tile-gy) * 2) calc(var(--tile-gx) * 2);
position: relative;
transition-delay: 0s;
transition-duration: 150ms;
transition-property: outline, outline-offset, border-color, background-color, transform;
}
.tile[data-type=press] .tile-wrapper {
color: inherit;
outline: 0;
position: relative;
text-decoration: none;
top: 0;
transition-duration: 150ms;
transition-property: top;
will-change: top;
}
.tile[data-type=press] .tile-header {
padding: 0;
}
.tile[data-type=press] .tile-header--title {
margin-top: 0;
}
.tile[data-type=press] .tile-header--date {
font-size: 90%;
margin-bottom: 0;
margin-top: 0.25em;
}
.tile[data-type=press] .tile-header--excerpt {
margin-bottom: 3rem;
margin-top: 3rem;
}
.tile[data-type=press] .tile-footer--link {
align-items: flex-end;
color: #334155;
color: var(--color-slate-700);
display: flex;
font-size: 1rem;
justify-self: flex-start;
line-height: 1;
outline: 0;
position: relative;
text-decoration: underline;
text-decoration-color: #cbd5e1;
text-decoration-color: var(--color-slate-300);
text-underline-offset: 0.25em;
transition-duration: 100ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.tile[data-type=press] .tile-footer--link span {
background-color: white;
position: relative;
z-index: 1;
}
.tile[data-type=press] .tile-footer--link i {
color: rgba(var(--page-primary-rgb), 0);
font-size: 90%;
margin-left: 0.25em;
transform: translateX(-15px);
transition-duration: 150ms, 50ms;
transition-property: color, transform, opacity;
transition-timing-function: cubic-bezier(0.25, 0.8, 0.25, 1);
z-index: 0;
}
.tile[data-type=press]::before, .tile[data-type=press]::after {
bottom: 0.85em;
box-shadow: 0px 13px 8px #cbd5e1;
box-shadow: 0px 13px 8px var(--color-slate-300);
content: "";
display: block;
height: 20%;
left: 1.18em;
max-height: 13em;
position: absolute;
transform: rotate(-2deg);
width: 40%;
z-index: -1;
}
.tile[data-type=press]::after {
left: auto;
right: 0.75em;
transform: rotate(2deg);
}
.tile[data-type=press]:hover, .tile[data-type=press]:focus-within {
border-color: rgba(var(--page-primary-rgb), 0.75);
outline-color: rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
outline-width: 0.35em;
}
.tile[data-type=press]:hover .tile-wrapper, .tile[data-type=press]:focus-within .tile-wrapper {
top: -3px;
}
.tile[data-type=press]:hover .tile-footer--link,
.tile[data-type=press]:hover .tile-footer--link, .tile[data-type=press]:focus-within .tile-footer--link,
.tile[data-type=press]:focus-within .tile-footer--link {
text-decoration-color: rgba(var(--page-primary-rgb), 0.5);
}
.tile[data-type=press]:hover .tile-footer--link i,
.tile[data-type=press]:hover .tile-footer--link i, .tile[data-type=press]:focus-within .tile-footer--link i,
.tile[data-type=press]:focus-within .tile-footer--link i {
color: rgba(var(--page-primary-rgb), 1);
opacity: 1;
transform: translateX(0);
}
.tile[data-type=press]:active {
box-shadow: rgba(0, 0, 0, 0.05) 0px 1px 2px 0px;
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.5em;
}
.tile[data-type=press]:active .tile-wrapper {
top: 0;
}
.tile[data-type=press]:active .tile-header--title span {
opacity: 0.5;
}
.tile[data-type=organization] {
--tile-gap: 0;
--tile-border-color: var(--color-slate-200);
border-color: #e2e8f0;
border-color: var(--tile-border-color);
border-width: 0px solid;
transition-duration: 150ms;
}
.tile[data-type=organization]:hover, .tile[data-type=organization]:focus-within {
border-color: rgba(var(--page-primary-rgb), 0.75);
outline-color: rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
outline-width: 0.35em;
}
.tile[data-type=organization] .tile-wrapper {
position: relative;
}
.tile[data-type=organization] .tile-wrapper--top {
width: 100%;
}
.tile[data-type=organization] .tile-header .tile-header--attr {
align-items: center;
display: flex;
font-size: 1em;
grid-gap: 1rem;
}
.tile[data-type=organization] .tile-row {
align-items: center;
display: flex;
justify-content: space-between;
margin-bottom: 1rem;
min-height: 42px;
}
.tile[data-type=organization] .tile-region {
align-items: center;
border-radius: 0.35rem;
box-sizing: border-box;
display: flex;
justify-content: center;
line-height: 1;
overflow: hidden;
pointer-events: none;
position: absolute;
right: var(--tile-gy);
top: var(--tile-gy);
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tile[data-type=organization] .tile-region i {
font-size: 1.4rem;
}
.tile[data-type=organization] .tile-region .tile-region__name {
font-size: 15px;
font-weight: 700;
letter-spacing: -0.01em;
text-transform: uppercase;
}
.tile[data-type=organization] .tile-header--title {
font-size: 20px;
font-weight: 600;
margin: 0 0 var(--tile-gy);
width: 240px;
width: 80%;
}
.tile[data-type=organization] .tile-header--title small {
color: #475569;
color: var(--color-slate-600);
display: block;
font-size: 1rem;
font-weight: 400;
margin-top: 0.25em;
}
.tile[data-type=organization] .tile-header--tel {
align-items: center;
color: inherit;
display: flex;
font-size: 17px;
font-weight: 500;
height: 42px;
margin: 0;
order: -1;
}
.tile[data-type=organization] .tile-header--tel .tile-tooltip--btn {
align-items: center;
background: transparent;
background-color: none;
border: 0px;
border-right: 1px solid #cbd5e1;
border-right: 1px solid var(--color-slate-300);
color: #334155;
color: var(--color-slate-700);
cursor: pointer;
display: none;
font: inherit;
font-size: 1rem;
grid-gap: 0.25em;
justify-content: center;
margin: 0;
overflow: visible;
padding: 0;
text-decoration: none;
width: 32px;
}
.tile[data-type=organization] .tile-header--tel .tile-tooltip--btn i {
font-size: 110%;
line-height: 1;
}
.tile[data-type=organization] .tile-header--tel .tile-tooltip--btn:hover, .tile[data-type=organization] .tile-header--tel .tile-tooltip--btn:focus {
color: rgba(var(--page-primary-rgb), 1);
outline: 0;
}
.tile[data-type=organization] .tile-header--tel a {
align-items: center;
background: #f1f5f9;
background: var(--color-slate-100);
border-radius: 6px;
color: inherit;
cursor: pointer;
display: flex;
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 1, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
height: 100%;
padding: 0 0.85rem;
text-decoration: none;
transition-duration: 100ms;
transition-property: background-color;
will-change: background-color;
}
.tile[data-type=organization] .tile-header--tel a:hover, .tile[data-type=organization] .tile-header--tel a:focus-within {
background-color: #e2e8f0;
background-color: var(--color-slate-200);
outline: 0;
}
.tile[data-type=organization] .tile-footer {
border-top: 1px solid var(--tile-border-color);
display: flex;
height: 60px;
justify-content: space-between;
line-height: 60px;
padding: 0 var(--tile-gx);
}
.tile[data-type=organization] .tile-footer a {
background-color: white;
box-sizing: border-box;
color: #334155;
color: var(--color-slate-700);
cursor: pointer;
display: flex;
font-size: 1rem;
font-weight: 500;
font-weight: 500;
justify-content: center;
line-height: 1;
min-width: 60px;
text-align: center;
text-decoration: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tile[data-type=organization] .tile-footer .tile-footer--right {
align-items: center;
display: flex;
grid-gap: 1rem;
justify-content: flex-end;
}
.tile[data-type=organization] .tile-footer .tile-footer--left {
align-items: center;
border: 0px solid !important;
display: flex;
}
.tile[data-type=organization] .tile-footer .tile-footer--link {
align-items: center;
color: #334155;
color: var(--color-slate-700);
display: flex;
font-size: 1rem;
justify-self: flex-start;
line-height: 1;
text-decoration: underline;
text-decoration-color: #cbd5e1;
text-decoration-color: var(--color-slate-300);
text-underline-offset: 0.25em;
transition-duration: 100ms;
}
.tile[data-type=organization] .tile-footer .tile-footer--link span {
background-color: white;
}
.tile[data-type=organization] .tile-footer .tile-footer--link i {
font-size: 80%;
opacity: 0;
position: relative;
transform: translateX(-15px);
transition-duration: 150ms;
transition-property: transform, opacity, color;
z-index: -1;
}
.tile[data-type=organization] .tile-footer .tile-footer--link:hover, .tile[data-type=organization] .tile-footer .tile-footer--link:focus {
text-decoration: underline;
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
text-underline-offset: 0.25em;
}
.tile[data-type=organization] .tile-footer .tile-footer--link:hover i, .tile[data-type=organization] .tile-footer .tile-footer--link:focus i {
color: #80bdff;
color: var(--page-primary-hex);
opacity: 1;
transform: translateX(5px);
}
.tile[data-type=organization] .tile-footer .tile-footer--btn {
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 6px;
outline: 0.25em solid rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
padding: 6px 8px;
transition-duration: 100ms;
transition-property: background-color, color, border-color, outline;
will-change: background-color, color, border-color, outline;
}
.tile[data-type=organization] .tile-footer .tile-footer--btn:hover, .tile[data-type=organization] .tile-footer .tile-footer--btn:focus, .tile[data-type=organization] .tile-footer .tile-footer--btn:focus-within {
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.02), rgba(var(--page-primary-rgb), 0.05));
border: 1px solid rgba(var(--page-primary-rgb), 1);
color: rgba(var(--page-primary-rgb), 1);
color: #80bdff;
color: var(--page-primary-hex);
outline: 4px solid rgba(var(--page-primary-rgb), 0.25);
outline-offset: 0;
}
.section-filters {
border-radius: 6px;
}
@media (max-width: 991.98px) {
.section-filters {
padding: 0;
width: 100%;
}
}
@media (min-width: 992px) {
.section-filters {
height: -moz-max-content;
height: max-content;
min-width: 320px;
padding: 0;
}
}
@media (min-height: 768px) and (min-width: 992px) {
.section-filters {
position: sticky;
top: 100px;
}
}
.filter-list-wrapper {
max-width: 100%;
position: relative;
}
.filter-list-wrapper:not(:last-of-type) {
margin-bottom: 1rem;
}
.filter-list-wrapper:last-of-type {
margin-bottom: 1.563rem;
}
.filter-list-container {
border: 1px solid rgba(203, 213, 225, 0);
border: 1px solid rgba(var(--color-slate-300-rgb), 0);
border-radius: 0.25rem;
display: block;
outline: 0 solid rgba(203, 213, 225, 0);
outline: 0 solid rgba(var(--color-slate-300-rgb), 0);
outline-offset: 12px;
overflow: hidden;
transition-duration: 200ms;
transition-property: border-color, outline-offset, outline-color;
will-change: border-color, outline-offset, outline-color;
}
.filter-list-container.is-closed {
overflow: hidden;
}
.filter-list-container:focus-within {
border-color: rgba(var(--page-primary-rgb), 1);
outline-color: rgba(var(--page-primary-rgb), 0.25);
outline-offset: 0;
outline-width: 0.25em;
overflow: hidden;
}
@keyframes fadeInUp {
0% {
/* The card starts a bit below its final position */
opacity: 0;
transform: translateY(20px);
}
100% {
/* The card ends at its normal position */
opacity: 1;
transform: translateY(0);
}
}
.is-fading-in {
animation: fadeInUp 200ms forwards;
border-color: rgba(var(--page-primary-rgb), 1) !important;
outline-color: rgba(var(--page-primary-rgb), 0.15) !important;
outline-offset: 0 !important;
outline-width: 0.35em;
}
.filter-alert {
border-radius: 4px;
font-size: 1rem;
grid-column: 1/-1;
margin-bottom: 1rem;
padding: 12px;
}
.filter-alert,.filter-alert[aria-hidden=true] {
display: none;
}
.filter-alert[aria-hidden=false] {
display: block;
}
.filter-alert strong {
font-weight: 700;
text-decoration: underline;
}
.filter-alert.positive-result {
background-color: rgba(var(--page-primary-rgb), 0.05);
border: 1px solid rgba(var(--page-primary-rgb), 0.15);
}
.filter-alert.negative-result {
background-color: rgba(255, 85, 0, 0.03);
background-color: rgba(var(--color-orange-rgb), 0.03);
border: 1px solid rgba(255, 85, 0, 0.15);
border: 1px solid rgba(var(--color-orange-rgb), 0.15);
}
.tile-grid[data-type=organizations] {
min-height: 250px;
min-width: 100%;
width: 100%;
}
@media (max-width: 991.98px) {
.tile-grid[data-type=organizations] {
display: flex;
flex-direction: column;
}
.tile-grid[data-type=organizations] .tile {
width: 100%;
}
}
@media (min-width: 768px) {
.tile-grid[data-type=organizations] .tile {
width: 100%;
}
}
@media (min-width: 992px) {
.tile-grid[data-type=organizations] {
--tile-grid-cols: repeat(1, 1fr);
}
}
@media (min-width: 1200px) {
.tile-grid[data-type=organizations] {
--tile-grid-cols: repeat(2, 1fr);
}
.tile-grid[data-type=organizations] .tile-header {
min-height: 180px;
}
}
@media (min-width: 1380px) {
.tile-grid[data-type=organizations] {
--tile-grid-cols: repeat(2, 1fr);
}
.tile-grid[data-type=organizations] .tile-header {
min-height: 190px;
}
}
.tile-grid[data-type=organizations] .tile-header {
padding: var(--tile-gy) calc(var(--tile-gx) * 1);
}
.tile-grid[data-type=organizations] .tile {
background-color: white;
}
.tile-container[data-type=filters] {
display: flex;
flex-direction: column;
}
@media (min-width: 992px) {
.tile-container[data-type=filters] {
display: grid;
flex-direction: row;
grid-gap: 1rem;
grid-template-columns: repeat(3, 1fr);
}
.tile-container[data-type=filters] aside + div[data-type=organizations] {
grid-column: 2/4;
}
}
.tile[data-type=helpcenter] {
--tile-gap: 0;
--color-hex: var(--page-primary-hex);
--color-rgb: var(--page-primary-rgb);
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
outline: 0.35em solid rgba(var(--color-rgb), 0);
outline-offset: 0.25em;
transition-duration: 150ms;
}
.tile[data-type=helpcenter]:hover {
background-image: linear-gradient(to top, rgba(var(--color-rgb), 0.055), #fff 250px);
border: 1px solid rgba(var(--color-rgb), 0.85);
outline: 0.35em solid rgba(var(--color-rgb), 0.15);
outline-offset: 0;
}
.tile[data-type=helpcenter] .tile-wrapper {
color: inherit;
text-decoration: none;
}
.tile[data-type=helpcenter] .tile-picture {
align-items: center;
background-image: linear-gradient(45deg, rgba(var(--color-rgb), 0.9), rgba(var(--color-rgb), 0.89), rgba(var(--color-rgb), 0.85), rgba(var(--color-rgb), 0.82), rgba(var(--color-rgb), 0.75));
display: flex;
height: 220px;
justify-content: center;
text-align: center;
}
.tile[data-type=helpcenter] .tile-picture i {
color: #000000;
color: var(--color-black);
display: block;
filter: drop-shadow(-1px -1px 25px #000000);
filter: drop-shadow(-1px -1px 25px var(--color-black));
font-size: 5rem;
mix-blend-mode: exclusion;
}
.tile[data-type=helpcenter] .tile-header--subtitle {
display: none;
font-size: 0.7rem;
font-size: 1.728rem;
font-weight: bold;
letter-spacing: -0.01em;
margin: 1.44rem 0 0;
opacity: 0.75;
}
.tile[data-type=helpcenter] .tile-header--title {
align-items: center;
display: flex;
font-weight: 700;
grid-gap: 0.35rem;
line-height: 1.25;
margin-top: 0;
}
.tile[data-type=helpcenter] .tile-header--link {
margin-top: 3rem;
}
.tile[data-type=helpcenter] .tile-header--link a {
background-image: linear-gradient(rgba(var(--color-rgb), 0.01), rgba(var(--color-rgb), 0.07));
border: 1px solid rgba(var(--color-rgb), 0.25);
border-radius: var(--tile-radius);
box-shadow: rgba(50, 50, 93, 0.05) 0px 2px 5px -1px, rgba(0, 0, 0, 0.03) 0px 1px 3px -1px;
color: #262626;
display: inline-flex;
font-size: 0.833rem;
height: 42px;
justify-content: center;
line-height: 42px;
padding: 0 0.8333rem;
position: relative;
text-decoration: none;
top: 0;
transition-duration: 150ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 120px;
}
.tile[data-type=helpcenter]:hover .tile-header--link a, .tile[data-type=helpcenter]:focus-within .tile-header--link a {
top: -2px;
}
.tile[data-type=helpcenter][data-contained="1"] .tile-picture {
transition-duration: 150ms;
}
.tile[data-type=helpcenter][data-contained="1"] {
padding: 0;
}
.tile[data-type=helpcenter][data-contained="1"] .tile-header {
padding: var(--tile-gy) calc(var(--tile-gx) * 1.563) 0;
}
.tile[data-type=helpcenter][data-contained="1"] .tile-picture {
border-radius: var(--tile-radius);
box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
height: auto;
margin-left: auto;
margin-right: auto;
margin-top: var(--tile-gy);
max-width: calc(100% - var(--tile-gy) * 2);
min-height: 220px;
overflow: hidden;
overflow: visible;
width: 100%;
}
.tile-label--heading {
display: block;
margin-top: 6px;
}
.tile-label {
border-radius: 6px;
color: #334155;
color: var(--color-slate-700);
display: inline-block;
font-size: 16px;
font-weight: 700;
line-height: 1;
padding: 5px 9px;
}
.tile-label--type.tile-label,.tile-label--year.tile-label {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
}
.tile[data-type=person] {
--tile-title-fs: calc(var(--scale-p2) * 1rem);
--tile-subtitle-fs: 1rem;
--tile-excerpt-fs: 16.5px;
--tile-gap: 0;
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
outline-offset: 0.25em;
transition-delay: 0s;
transition-duration: 50ms;
transition-property: outline-offset, outline, border-color;
}
.tile[data-type=person].is-colored {
background-image: linear-gradient(to top, rgba(var(--color-rgb), 0.055), #fff 250px);
outline: 0.35em solid rgba(var(--color-rgb), 0);
}
.tile[data-type=person] *,
.tile[data-type=person] *::before,
.tile[data-type=person] *::after {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tile[data-type=person] .tile-wrapper {
background-color: white;
color: inherit;
cursor: pointer;
overflow: hidden;
text-decoration: none;
}
.tile[data-type=person][data-contained="0"] .tile-picture {
background-color: rgba(var(--color-rgb), 0.15);
min-height: 400px;
}
.tile[data-type=person][data-contained="0"] .tile-picture::after {
background: linear-gradient(220.55deg, #80bdff 20%, rgba(var(--color-rgb), 0.25) 100%);
background: linear-gradient(220.55deg, var(--page-primary-hex) 20%, rgba(var(--color-rgb), 0.25) 100%);
content: "";
display: block;
height: 100%;
left: 0;
mix-blend-mode: multiply;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.tile[data-type=person][data-contained="0"] .tile-picture img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
position: relative;
width: 100%;
z-index: 1;
}
.tile[data-type=person][data-contained="0"] .tile-picture .tile-divider {
background-color: white;
bottom: -51px;
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
height: 90px;
left: -25%;
overflow: hidden;
position: absolute;
transform: rotate(-2deg) scaleY(-1);
width: 150%;
z-index: 1;
z-index: 1;
}
.tile[data-type=person][data-contained="0"] .tile-picture .tile-divider::before {
bottom: -1px;
content: "";
height: 100%;
left: -1px;
pointer-events: none;
position: absolute;
right: -1px;
top: -1px;
width: 100%;
z-index: 3;
}
.tile[data-type=person][data-contained="0"]:hover .tile-divider {
outline: 0.35em solid rgba(var(--color-rgb), 0.15);
}
.tile[data-type=person][data-contained="1"] .tile-picture {
aspect-ratio: 1/1;
background-color: rgba(var(--color-rgb), 0.15);
border-radius: var(--tile-radius);
box-sizing: border-box;
height: auto;
margin-left: auto;
margin-right: auto;
margin-top: var(--tile-gy);
max-width: calc(100% - var(--tile-gy) * 2);
overflow: hidden;
transition-duration: 100ms;
transition-property: transform;
transition-timing-function: cubic-bezier(0.17, 0.67, 0.87, 0.62);
}
.tile[data-type=person][data-contained="1"] .tile-header {
padding: var(--tile-gy) calc(var(--tile-gx) * 1.563) 0;
}
.tile[data-type=person]:hover, .tile[data-type=person]:focus-within {
border-color: rgba(var(--color-rgb), 1);
outline: 0.35em solid rgba(var(--color-rgb), 0.15);
outline-offset: 0;
}
.tile[data-type=person]:hover .tile-wrapper {
outline: 0;
}
.tile[data-type=person]:hover .tile-wrapper .tile-btn, .tile[data-type=person]:focus-within .tile-wrapper .tile-btn {
top: -2px;
}
.tile[data-type=person] .tile-header--title {
align-items: center;
display: flex;
font-weight: 700;
grid-gap: 0.35rem;
letter-spacing: -0.01em;
line-height: 1;
margin-top: 0;
}
.tile[data-type=person] .tile-header--title i {
color: #007bff;
color: var(--color-primary-500);
}
.tile[data-type=person] .tile-header--subtitle {
color: #64748b;
color: var(--color-slate-500);
font-weight: 500;
margin-bottom: 1.44rem;
margin-top: 5px;
}
.tile[data-type=person] .tile-header--excerpt {
-webkit-box-orient: vertical;
color: #475569;
color: var(--color-slate-600);
display: -webkit-box;
font-weight: 400;
-webkit-line-clamp: 4;
margin-bottom: 0;
overflow: hidden;
}
.tile[data-type=person] .tile-header--link {
margin-top: 3rem;
}
.tile[data-type=partner] {
--tile-gap: 1.44rem;
background-image: linear-gradient(to top, rgba(var(--color-rgb), 0) 10%, #fff);
border-color: rgba(var(--color-rgb), 0.75);
outline-color: rgba(var(--color-rgb), 0);
transition-duration: 150ms;
transition-property: outline-offset, border-color, outline-color, background-image;
}
.tile[data-type=partner]:hover {
background-image: linear-gradient(to top, rgba(var(--color-rgb), 0.055), #fff 250px);
border-color: rgba(var(--color-rgb), 0.85);
outline-color: rgba(var(--color-rgb), 0.25);
outline-offset: 0;
outline-width: 0.35em;
}
.tile[data-type=partner][data-contained="1"]:hover {
background-image: linear-gradient(to bottom, rgba(var(--color-rgb), 0.085) 10%, #fff);
}
.tile[data-type=partner] .tile-header {
z-index: 1;
}
.tile[data-type=partner] .tile-header--title {
display: none;
}
.tile[data-type=partner] .tile-header--excerpt {
font-size: 1rem;
line-height: 1.563;
margin-bottom: 3rem;
margin-top: 0;
max-width: 23em;
}
.tile[data-type=partner] .tile-header--link a {
background-image: linear-gradient(rgba(var(--color-rgb), 0.01), rgba(var(--color-rgb), 0.07));
border: 1px solid rgba(var(--color-rgb), 0.25);
border-radius: var(--tile-radius);
box-shadow: rgba(50, 50, 93, 0.05) 0px 2px 5px -1px, rgba(0, 0, 0, 0.03) 0px 1px 3px -1px;
color: #262626;
display: inline-flex;
font-size: 0.833rem;
height: 42px;
justify-content: center;
line-height: 42px;
padding: 0 0.8333rem;
position: relative;
text-decoration: none;
top: 0;
transition-duration: 150ms;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 120px;
}
.tile[data-type=partner]:hover .tile-header--link a, .tile[data-type=partner]:focus-within .tile-header--link a {
top: -2px;
}
.tile[data-type=partner] .tile-figure {
margin-top: 0;
overflow: visible;
}
.tile[data-type=partner] .tile-figure img {
max-height: 45px;
max-width: 150px;
position: relative;
z-index: 1;
}
.tile[data-type=partner][data-contained="1"] .tile-picture {
border-radius: var(--tile-radius);
box-shadow: rgba(var(--color-rgb), 0.05) 0px 6px 24px -2px, rgba(0, 0, 0, 0.15) 0px 6px 24px -2px, rgba(var(--color-rgb), 0.3) 0px 3px 7px -3px;
box-sizing: border-box;
margin: var(--tile-gy) var(--tile-gy) 0;
overflow: hidden;
transition-duration: 100ms;
transition-property: transform;
transition-timing-function: cubic-bezier(0.17, 0.67, 0.87, 0.62);
}
.tile[data-type=partner][data-contained="1"]:hover .tile-picture {
transform: scale(0.98);
}
.tile[data-type=partner][data-contained="1"] .tile-picture {
border-radius: var(--tile-radius);
box-shadow: rgba(var(--page-primary-rgb), 0.05) 0px 6px 24px -2px, rgba(0, 0, 0, 0.15) 0px 6px 24px -2px, rgba(var(--page-primary-rgb), 0.3) 0px 3px 7px -3px;
box-sizing: border-box;
margin: var(--tile-gy) var(--tile-gy) 0;
overflow: hidden;
transition-duration: 100ms;
transition-property: transform;
transition-timing-function: cubic-bezier(0.17, 0.67, 0.87, 0.62);
}
.tile[data-type=partner][data-contained="1"]:hover .tile-picture {
transform: scale(0.98);
}
.tile[data-type=partner][data-gradient="1"] .tile-picture::after {
background-image: linear-gradient(to top, white, rgba(255, 255, 255, 0));
bottom: 0;
content: "";
display: block;
height: 40%;
left: 0;
position: absolute;
right: 0;
transition-duration: 150ms;
transition-property: height;
width: 100%;
z-index: 1;
}
.tile-container[data-type=testimonial] {
display: grid;
grid-gap: 1.25rem;
grid-template-columns: 1fr;
justify-content: flex-start;
position: relative;
}
.tile-container[data-type=testimonial] .tile-grid {
align-items: flex-start;
display: flex;
flex-direction: column;
grid-gap: 1.25rem;
grid-template-columns: 1fr;
justify-content: flex-start;
}
@media (min-width: 992px) {
.tile-container[data-type=testimonial] {
grid-gap: 1.563rem;
grid-template-columns: repeat(3, 1fr);
}
}
.tile[data-type=testimonial] {
--tile-radius: 6px;
--tile-gap: 0;
--tile-border-color: var(--color-slate-300);
background-color: white;
border-color: transparent;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
padding: 0;
position: relative;
}
.tile[data-type=testimonial] .tile-wrapper {
color: inherit;
display: grid;
grid-template-columns: 60px 1fr;
margin: 0;
outline: 0;
padding: 0;
padding: 1.563rem;
position: relative;
text-decoration: none;
}
.tile[data-type=testimonial] .tile-picture {
border-radius: var(--tile-radius);
box-shadow: rgba(14, 63, 126, 0.06) 0px 0px 0px 1px, rgba(42, 51, 70, 0.03) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 2px 2px -1px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.03) 0px 5px 5px -2.5px, rgba(42, 51, 70, 0.03) 0px 10px 10px -5px, rgba(42, 51, 70, 0.03) 0px 24px 24px -8px;
height: 60px;
margin-right: 1rem;
overflow: hidden;
width: 60px;
}
.tile[data-type=testimonial] .tile-header {
margin-left: 1rem;
padding: 0;
}
.tile[data-type=testimonial] .tile-header--title,
.tile[data-type=testimonial] .tile-header--subtitle {
line-height: 1;
margin-top: 0;
}
.tile[data-type=testimonial] .tile-header--title {
--tile-title-fs: 1.125rem;
color: #0f172a;
color: var(--color-slate-900);
font-weight: 600;
margin-top: 8px;
}
.tile[data-type=testimonial] .tile-header--subtitle {
--tile-title-fs: 1rem;
color: #334155;
color: var(--color-slate-700);
margin-top: 4px;
}
.tile[data-type=testimonial] .tile-header--date {
font-size: 90%;
margin-bottom: 0;
margin-top: 0.25em;
}
.tile[data-type=testimonial] .tile-header--excerpt {
--tile-excerpt-fs: 1.25rem;
color: #1e293b;
color: var(--color-slate-800);
font-size: 1rem;
font-weight: 400;
-webkit-hyphens: auto;
hyphens: auto;
line-height: 1.563;
margin: 1.953rem 0 0 calc(-60px - 1rem);
}
.tile-grid[data-type=showall] {
background-image: linear-gradient(to top, white 30%, rgba(255, 255, 255, 0));
bottom: -1rem;
grid-column: 1/-1;
height: 300px;
left: -1rem;
position: absolute;
right: 0;
width: calc(100% + 2rem);
z-index: 2;
}
.tile-grid[data-type=showall] .user-lists--shadow {
align-items: flex-end;
bottom: 0;
display: flex;
height: 100%;
justify-content: center;
left: 0;
padding-bottom: 2.5rem;
position: absolute;
right: 0;
width: 100%;
}
.tile-grid[data-type=showall] .user-lists--shadow button {
align-items: center;
background-color: white;
border: 0;
border: 1px solid rgba(var(--page-primary-rgb), 0.35);
border-radius: 6px;
border-radius: 0.85em;
box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
color: #80bdff;
color: var(--page-primary-hex);
cursor: pointer;
display: flex;
font-size: 1.125rem;
font-weight: bold;
height: 60px;
justify-content: center;
line-height: 1.2;
margin: 0.25rem;
max-width: 330px;
outline: 0.35em solid rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
overflow: hidden;
padding: 0.25rem 0.5rem;
position: relative;
text-decoration: none;
transition-duration: 150ms;
transition-property: outline-offset, outline-color, border-color, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
width: 100%;
}
.tile-grid[data-type=showall] .user-lists--shadow button span {
position: relative;
top: 0;
transition-duration: 150ms;
}
.tile-grid[data-type=showall] .user-lists--shadow button:hover {
transform: scaleY(1.03) scaleX(1.01);
}
.tile-grid[data-type=showall] .user-lists--shadow button:hover, .tile-grid[data-type=showall] .user-lists--shadow button:focus {
border-color: rgba(var(--page-primary-rgb), 0.5);
outline-color: rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
}
.tile-grid[data-type=showall] .user-lists--shadow button:active,.tile-grid[data-type=showall] .user-lists--shadow button[data-loading=false] {
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.85em;
}
.tile-grid[data-type=showall] .user-lists--shadow button:active span {
top: -1px;
}
.tile-grid[data-type=showall] .user-lists--shadow button[data-loading=true] {
filter: grayscale(100%);
}
.tile-grid[data-type=showall] .user-lists--shadow button [aria-hidden=true] {
display: none;
}
.tile-grid[data-type=showall].is-static {
background-image: linear-gradient(to right, white, #f8fafc, white);
background-image: linear-gradient(to right, white, var(--color-slate-50), white);
bottom: inherit;
grid-template-columns: 1fr;
height: 200px;
left: inherit;
margin-top: 2rem;
position: relative;
right: inherit;
}
.tile-grid[data-type=showall].is-static .user-lists--shadow {
align-items: center;
bottom: inherit;
display: flex;
height: 200px;
justify-content: center;
left: inherit;
margin: 0;
padding: 0;
position: relative;
right: inherit;
}
.r-hero[data-header-theme]::before {
content: "";
height: 600px;
left: 0;
position: absolute;
right: 0;
top: -200px;
width: 100%;
z-index: -2;
}
.r-hero[data-header-theme=swatch-color-0]::before, .r-hero[data-header-theme=swatch-color-1]::before, .r-hero[data-header-theme=swatch-color-2]::before, .r-hero[data-header-theme=swatch-color-3]::before, .r-hero[data-header-theme=swatch-color-4]::before, .r-hero[data-header-theme=swatch-color-5]::before, .r-hero[data-header-theme=swatch-color-6]::before, .r-hero[data-header-theme=swatch-color-7]::before, .r-hero[data-header-theme=swatch-color-8]::before {
opacity: 0.25;
}
.r-hero[data-header-theme=swatch-color-0]::before {
background-image: linear-gradient(180deg, rgba(0, 96, 100, 0.25) 30%, #FFF 70%);
}
.r-hero[data-header-theme=swatch-color-1]::before {
background-image: linear-gradient(180deg, rgba(74, 20, 140, 0.25) 30%, #fff 70%);
}
.r-hero[data-header-theme=swatch-color-2]::before {
background-image: linear-gradient(180deg, rgba(26, 35, 126, 0.25) 30%, #fff 70%);
}
.r-hero[data-header-theme=swatch-color-3]::before {
background-image: linear-gradient(180deg, rgba(33, 150, 243, 0.25) 30%, #fff 70%);
}
.r-hero[data-header-theme=swatch-color-4]::before {
background-image: linear-gradient(180deg, rgba(41, 182, 246, 0.25) 30%, #fff 70%);
}
.r-hero[data-header-theme=swatch-color-5]::before {
background-image: linear-gradient(180deg, rgba(255, 152, 0, 0.25) 30%, #fff 70%);
}
.r-hero[data-header-theme=swatch-color-6]::before {
background-image: linear-gradient(180deg, rgba(244, 67, 54, 0.25) 30%, #fff 70%);
}
.r-hero[data-header-theme=swatch-color-7]::before {
background-image: linear-gradient(180deg, rgba(121, 85, 72, 0.25) 30%, #fff 70%);
}
.r-hero[data-header-theme=swatch-color-8]::before {
background-image: linear-gradient(180deg, rgba(96, 125, 139, 0.25) 30%, #fff 70%);
}
.r-hero {
padding: 100px 0;
}
.r-hero[data-header-theme]::before {
content: "";
height: 600px;
left: 0;
position: absolute;
right: 0;
top: -200px;
width: 100%;
z-index: -2;
}
@media (min-width: 768px) and (max-width: 992px) {
.r-hero {
padding: 30px 0 60px;
}
}
@media (min-width: 992px) {
.r-hero {
padding: 0 0 100px;
}
.r-hero[data-size=lg] {
padding-bottom: calc(50px * 1);
padding-bottom: calc(50px * var(--scale));
padding-top: calc(100px * 1);
padding-top: calc(100px * var(--scale));
}
}
@media (max-width: 768px) {
.r-hero {
padding: 2.25rem 0 1.563rem;
}
}
.r-hero__content {
display: flex;
margin: 0 auto;
padding-left: 1rem;
padding-left: var(--gutter);
padding-right: 1rem;
padding-right: var(--gutter);
}
@media (max-width: 768px) {
.r-hero__content {
order: 1;
}
}
@media (max-width: 991.98px) {
.r-hero__content {
flex-direction: column;
}
}
@media (min-width: 992px) {
.r-hero__content {
flex-direction: row;
}
}
.r-content__text {
flex-basis: 67.5%;
}
@media (min-width: 992px) {
.r-content__text {
padding-right: 8rem;
}
}
[data-size=lg] .r-content__text {
flex-basis: 100%;
padding-right: 0;
text-align: center;
}
.r-hero__icon .r-content__text {
flex-basis: 60%;
}
.r-content__logo img {
max-width: 300px;
}
.r-content__heading h1 {
font-size: clamp(2.75rem, 2vw + 2.5rem, 4rem);
-webkit-font-smoothing: antialiased;
font-weight: 700;
letter-spacing: -0.03em;
line-height: 1.2;
margin-bottom: 1rem;
margin-top: 0;
}
@media (max-width: 768px) {
.r-content__heading h1 {
font-size: 1.953rem;
margin-bottom: 0;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
.r-content__heading h1 {
font-size: clamp(2.75rem, 2vw + 2.226rem, 4rem);
}
}
@media (min-width: 992px) {
[data-size=lg] .r-content__heading h1 {
font-size: clamp(2.887rem, calc(80 / 544 * 100vw), 5.202rem);
font-size: clamp(var(--rem-p9), var(--fontSizeFluid8), var(--rem-p13));
line-height: 1.1;
margin-top: -70px;
}
}
.r-content__tagline p {
font-size: 24px;
line-height: 1.602em;
line-height: var(--em-p4);
margin-bottom: 0;
margin-top: 1rem;
}
@media (max-width: 767.98px) {
.r-content__tagline p {
font-size: 1.266rem;
font-size: var(--rem-p2);
line-height: 1.414;
opacity: 0.7;
}
}
@media (min-width: 768px) and (max-width: 991.98px) {
.r-content__tagline p {
font-size: 1.563rem;
margin-left: 0;
max-width: 32em;
}
}
@media (min-width: 992px) {
.r-content__tagline p {
font-size: clamp(1.802rem, calc(24 / 544 * 100vw), 2.027rem);
font-size: clamp(var(--rem-p5), var(--fontSizeFluid4), var(--rem-p6));
line-height: 1.424em;
line-height: var(--em-p3);
}
[data-size=lg] .r-content__tagline p {
margin-left: auto;
margin-right: auto;
max-width: 70%;
}
}
@media (max-width: 992px) {
.r-content__heading h1,
.r-content__tagline p {
margin-left: auto;
margin-right: auto;
text-align: center;
}
}
.r-content__cta {
margin-top: 1.802rem;
margin-top: var(--rem-p5);
}
.r-content__cta a {
background-color: #80bdff;
background-color: var(--page-primary-hex);
border-radius: 4px;
color: #fff;
display: inline-block;
font-size: 18px;
font-weight: 600;
line-height: 1.2;
padding: 1rem 1.5rem;
text-align: center;
transform-origin: center center;
transition: background-color 0.1s;
}
.r-content__cta a:-moz-any-link {
color: #fff;
text-decoration: none;
}
.r-content__cta a:any-link {
color: #fff;
text-decoration: none;
}
.r-hero__visual {
flex: 1 1;
transform-origin: center center;
}
.r-visual__container {
align-items: center;
display: flex;
height: 100%;
justify-content: center;
}
@media (max-width: 992px) {
.r-hero__visual {
display: inline;
display: initial;
transform: scale(0.5);
order: -1;
}
}
.r-visual__shadows {
filter: blur(45px);
height: 500px;
width: 500px;
z-index: 0;
}
.r-visual__shadows,.r-visual__shadows > div {
position: absolute;
}
.r-visual__shadows > div:nth-of-type(1) {
background: rgba(var(--page-primary-rgb-darker), 0.5);
height: 280px;
left: 160px;
top: 110px;
width: 280px;
}
.r-visual__shadows > div:nth-of-type(2) {
background: rgba(var(--page-primary-rgb-dark), 0.5);
height: 130px;
left: 160px;
top: 285px;
width: 130px;
}
.r-visual__shadows > div:nth-of-type(3) {
background: rgba(var(--page-primary-rgb-darker), 0.5);
height: 150px;
left: 150px;
top: 125px;
width: 150px;
}
.r-visual__img {
position: relative;
z-index: 2;
}
@media (min-width: 1380px) {
.r-visual__img {
position: relative;
}
}
.r-visual__img img {
border-radius: 0.75rem;
box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
margin: 0 auto;
max-width: 100%;
overflow: hidden;
}
.r-visual__img div:nth-of-type(1) {
animation: fadeInRight 2s 100ms;
left: 60px;
max-width: 150px;
position: relative;
top: -60px;
z-index: 5;
}
.r-visual__img div:nth-of-type(2) {
animation: fadeInRight 2s 200ms;
max-width: 200px;
position: relative;
right: -100px;
top: -50px;
}
.r-visual__img div:nth-of-type(3) {
animation: fadeInRight 2s 200ms;
left: -125px;
max-width: 140px;
position: relative;
top: -340px;
}
.r-visual__img div:nth-of-type(4) {
animation: fadeInLeft 2s 200ms;
left: -46px;
max-width: 175px;
position: relative;
top: -269px;
}
.r-visual__img div:nth-of-type(5) {
animation: fadeInUp 2s 200ms;
max-width: 145px;
position: relative;
right: -268px;
top: -670px;
}
@media (max-width: 1300px) {
.r-visual__img div:nth-of-type(3) {
left: -70px;
max-width: 130px;
position: relative;
top: -340px;
}
}
@media (max-width: 992px) {
.r-hero__visual {
transform: scale(0.7);
}
}
.section-metrics__items {
--grid-list-columns: 2;
display: grid;
grid-gap: 12px;
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(var(--grid-list-columns), 1fr);
justify-content: center;
}
@media (min-width: 768px) and (max-width: 991.98px) {
.section-metrics__items {
--grid-list-columns: 2;
grid-template-columns: repeat(2, 1fr);
grid-template-columns: repeat(var(--grid-list-columns), 1fr);
}
}
@media (min-width: 992px) and (max-width: 1379.98px) {
.section-metrics__items {
--grid-list-columns: 4;
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(var(--grid-list-columns), 1fr);
}
}
@media (min-width: 1380px) {
.section-metrics__items {
--grid-list-columns: 4;
grid-gap: 1rem;
grid-gap: var(--gutter-x);
grid-template-columns: repeat(4, 1fr);
grid-template-columns: repeat(var(--grid-list-columns), 1fr);
}
}
@media (max-width: 768px) {
.section-metrics__inner .pagination {
display: none;
}
.section-metrics__inner {
margin: 0 1rem;
}
}
.section-metrics__item {
align-items: center;
background-color: #FFFFFF;
background-color: var(--color-white);
background-color: var(--color-white);
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.06), rgba(var(--page-primary-rgb), 0.08), rgba(var(--page-primary-rgb), 0.01));
border: 1px solid rgba(var(--page-primary-rgb), 0.5);
border-radius: 0.35rem;
display: grid;
flex-direction: column;
justify-content: center;
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.09);
padding: 1rem;
position: relative;
text-align: center;
}
@media (min-width: 991.98px) {
.section-metrics__item {
border: 1px solid rgba(var(--page-primary-rgb), 0.75);
border-radius: 0.85em;
grid-gap: 0.5rem;
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15);
padding: 1.563rem;
}
}
.section-metrics__icon {
background: linear-gradient(to bottom, #80bdff 0%, var(--page-primary-hex-lighter) 100%);
background: linear-gradient(to bottom, var(--page-primary-hex) 0%, var(--page-primary-hex-lighter) 100%);
-webkit-background-clip: text;
-moz-background-clip: text;
background-clip: text;
font-size: 1rem;
-webkit-text-fill-color: transparent;
}
@media (min-width: 991.98px) {
.section-metrics__icon {
display: block;
font-size: 1.563rem;
}
}
.section-metrics__value {
display: block;
font: 600 calc(2.074 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h2);
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 1, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
font-weight: 700;
letter-spacing: -0.01em;
line-height: 1;
margin: 0;
}
@media (min-width: 1200px) {
.section-metrics__value {
font: 700 calc(3.583 * 1rem) / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h0);
}
}
.section-metrics__type {
font: 500 1rem / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h5);
font-weight: 500;
line-height: 1;
}
.section-metrics__header {
margin-bottom: 1rem;
margin-bottom: var(--rem1);
text-align: left;
}
.section-metrics__title {
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
font-weight: 500;
}
.section-metrics__description {
display: none;
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
font-size: 16px;
margin-left: auto;
margin-right: auto;
margin-top: 0.5em;
max-width: 90%;
}
.r-hero__clippath {
background: #FFEEE4;
background: var(--color-accent-1-50);
clip-path: polygon(0% 0%, 0% 82.5%, 1.69492% 84.3293%, 3.38983% 86.1385%, 5.08475% 87.9078%, 6.77966% 89.6179%, 8.47458% 91.25%, 10.1695% 92.7862%, 11.8644% 94.2098%, 13.5593% 95.505%, 15.2542% 96.6578%, 16.9492% 97.6555%, 18.6441% 98.487%, 20.339% 99.1435%, 22.0339% 99.6176%, 23.7288% 99.9041%, 25.4237% 100%, 27.1186% 99.9041%, 28.8136% 99.6176%, 30.5085% 99.1435%, 32.2034% 98.487%, 33.8983% 97.6555%, 35.5932% 96.6578%, 37.2881% 95.505%, 38.9831% 94.2098%, 40.678% 92.7862%, 42.3729% 91.25%, 44.0678% 89.6179%, 45.7627% 87.9078%, 47.4576% 86.1385%, 49.1525% 84.3293%, 50.8475% 82.5%, 52.5424% 80.6708%, 54.2373% 78.8616%, 55.9322% 77.0922%, 57.6271% 75.3821%, 59.322% 73.75%, 61.017% 72.2138%, 62.7119% 70.7902%, 64.4068% 69.495%, 66.1017% 68.3422%, 67.7966% 67.3446%, 69.4915% 66.513%, 71.1864% 65.8565%, 72.8814% 65.3824%, 74.5763% 65.0959%, 76.2712% 65%, 77.9661% 65.0959%, 79.661% 65.3824%, 81.3559% 65.8565%, 83.0509% 66.513%, 84.7458% 67.3446%, 86.4407% 68.3422%, 88.1356% 69.495%, 89.8305% 70.7902%, 91.5254% 72.2138%, 93.2203% 73.75%, 94.9153% 75.3821%, 96.6102% 77.0922%, 98.3051% 78.8616%, 100% 80.6708%, 100% 0%);
height: 200px;
position: absolute;
shape-outside: polygon(0% 0%, 0% 82.5%, 1.69492% 84.3293%, 3.38983% 86.1385%, 5.08475% 87.9078%, 6.77966% 89.6179%, 8.47458% 91.25%, 10.1695% 92.7862%, 11.8644% 94.2098%, 13.5593% 95.505%, 15.2542% 96.6578%, 16.9492% 97.6555%, 18.6441% 98.487%, 20.339% 99.1435%, 22.0339% 99.6176%, 23.7288% 99.9041%, 25.4237% 100%, 27.1186% 99.9041%, 28.8136% 99.6176%, 30.5085% 99.1435%, 32.2034% 98.487%, 33.8983% 97.6555%, 35.5932% 96.6578%, 37.2881% 95.505%, 38.9831% 94.2098%, 40.678% 92.7862%, 42.3729% 91.25%, 44.0678% 89.6179%, 45.7627% 87.9078%, 47.4576% 86.1385%, 49.1525% 84.3293%, 50.8475% 82.5%, 52.5424% 80.6708%, 54.2373% 78.8616%, 55.9322% 77.0922%, 57.6271% 75.3821%, 59.322% 73.75%, 61.017% 72.2138%, 62.7119% 70.7902%, 64.4068% 69.495%, 66.1017% 68.3422%, 67.7966% 67.3446%, 69.4915% 66.513%, 71.1864% 65.8565%, 72.8814% 65.3824%, 74.5763% 65.0959%, 76.2712% 65%, 77.9661% 65.0959%, 79.661% 65.3824%, 81.3559% 65.8565%, 83.0509% 66.513%, 84.7458% 67.3446%, 86.4407% 68.3422%, 88.1356% 69.495%, 89.8305% 70.7902%, 91.5254% 72.2138%, 93.2203% 73.75%, 94.9153% 75.3821%, 96.6102% 77.0922%, 98.3051% 78.8616%, 100% 80.6708%, 100% 0%);
top: -75px;
width: 100%;
z-index: -1;
}
@media (min-width: 1380px) {
.r-hero__clippath {
height: 425px;
}
}
.svg-clippaths {
height: 700px;
left: 0;
margin: 0 auto;
max-width: 1300px;
opacity: 0.075;
position: absolute;
right: 0;
top: -75px;
}
.svg-clippaths svg {
display: inline-block;
left: 0;
opacity: 1;
position: absolute;
top: 0;
transform: scaleX(2);
}
.particle-article__faq_title {
font-size: 16px;
letter-spacing: 0.03em;
margin-bottom: 4rem;
opacity: 0.5;
position: relative;
text-transform: uppercase;
}
@media (min-width: 992px) {
.particle-article__faq_title {
padding-top: 3.5rem;
}
}
.particle-faq ol {
display: flex;
flex-direction: column;
grid-gap: 1.25rem;
}
.particle-faq__item[aria-hidden=true] {
display: none;
}
.particle-faq .particle-faq__item {
background-color: rgba(0, 0, 0, 0);
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 8px;
outline: 0.25em solid rgba(0, 123, 255, 0);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0);
outline-offset: 0.75em;
overflow: hidden;
transition-duration: 200ms;
transition-property: outline-offset, outline;
will-change: outline-offset, outline;
}
.particle-faq .particle-faq__item:not(.is-open):focus-within {
border-color: #80bdff;
border-color: var(--color-primary-300);
outline: 0.25em solid rgba(0, 123, 255, 0.1);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.1);
outline-offset: 0.025em;
}
.particle-faq .particle-faq__item:hover .particle-faq__header,
.particle-faq .particle-faq__item:focus .particle-faq__header,
.particle-faq .particle-faq__item:focus-within .particle-faq__header {
background-color: rgba(248, 250, 252, 1);
background-color: rgba(var(--color-slate-50-rgb), 1);
}
.particle-faq .particle-faq__item.is-open {
border: 1px solid #80bdff;
border: 1px solid var(--color-primary-300);
outline: 0.25em solid rgba(0, 123, 255, 0.1);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.1);
outline-offset: 0;
}
.particle-faq .particle-faq__item.is-open .particle-faq__header {
background-color: rgba(248, 250, 252, 1);
background-color: rgba(var(--color-slate-50-rgb), 1);
border-bottom: 1px solid #e2e8f0;
border-bottom: 1px solid var(--color-slate-200);
margin-bottom: 1rem;
}
.particle-faq__header {
align-items: flex-start;
display: flex;
justify-content: space-between;
padding: 1.563rem;
position: relative;
}
.particle-faq .particle-faq__btn {
align-items: center;
cursor: pointer;
display: flex;
font-size: 1.125rem;
font-weight: 600;
height: 32px;
height: 100%;
justify-content: flex-end;
outline: 0;
padding-right: 1.563rem;
position: absolute;
right: 0;
top: 0;
width: 32px;
width: 100%;
}
.particle-faq .particle-faq__btn i {
transform: rotate(-90deg);
transition-duration: 150ms;
transition-property: transform;
will-change: transform;
}
.particle-faq__item.is-open .particle-faq__btn i {
transform: rotate(0);
}
.particle-faq__content {
padding: 0 1.563rem 1.563rem;
}
.particle-faq__content p,
.particle-faq__content ol,
.particle-faq__content ul {
font-size: 1.125rem;
line-height: 1.414;
}
.particle-faq__content p a {
color: #0f172a;
color: var(--color-slate-900);
text-decoration: underline;
text-decoration-color: #007bff;
text-decoration-color: var(--color-primary-500);
text-decoration-thickness: 1px;
text-underline-offset: 0.15em;
}
.particle-faq__content p a:hover,
.particle-faq__content p a:focus {
color: #64748b;
color: var(--color-slate-500);
}
.particle-faq__content ul {
padding-left: 1.2rem;
}
.particle-faq__content ul li::before {
color: #007bff;
color: var(--color-primary-500);
content: "•";
display: inline-block;
margin-left: -1em;
width: 1em;
}
@media (min-width: 992px) {
.particle-faq__content p,
.particle-faq__content ol,
.particle-faq__content ul {
font-size: 1.25rem;
}
.particle-faq__content {
max-width: 39em;
}
}
.particle-faq__content[aria-hidden=true] {
display: none;
}
.particle-faq ol + button {
align-items: flex-end;
background-color: transparent;
border: 0;
border: 0px;
display: flex;
font-size: 1.125rem;
font-weight: bold;
justify-content: flex-end;
margin-top: 2rem;
padding: 0;
padding: 0 1rem;
transition-duration: 150ms;
transition-property: color;
width: 100%;
will-change: color;
}
.particle-faq ol + button:hover,
.particle-faq ol + button:focus {
color: #64748b;
color: var(--color-slate-500);
outline: 0;
}
.particle-faq ol + button:focus {
color: #007bff;
color: var(--color-primary-500);
}
:root {
--pagination-bg: white;
--pagination-color: rgba(var(--color-slate-500-rgb), 0.5);
--pagination-border-color: rgba(var(--color-slate-500-rgb), 0.25);
--pagination-disabled-bg: rgba(var(--color-slate-500-rgb), 0.03);
--pagination-disabled-color: rgba(var(--color-slate-500-rgb), 0.2);
--pagination-disabled-border-color: rgba(var(--color-slate-500-rgb), 0.1);
--pagination-hover-color: rgba(var(--color-slate-500-rgb), 1);
--pagination-hover-border-color: rgba(var(--color-slate-400-rgb), 0.6);
--pagination-hover-outline-color: rgba(var(--color-slate-900-rgb), 0.02);
--pagination-focus-color: rgba(var(--color-slate-400-rgb), 1);
--pagination-focus-border-color: rgba(var(--color-slate-400-rgb), 1);
--pagination-focus-outline-color: rgba(var(--color-slate-500-rgb), 0.1);
--pagination-active-color: var(--page-primary-hex);
--pagination-active-border-color: rgba(var(--page-primary-rgb), .5);
--pagination-active-outline-color: rgba(var(--page-primary-rgb), .25);
--pagination-current-color: var(--page-primary-hex);
--pagination-current-border-color: rgba(var(--page-primary-rgb), .5);
--pagination-current-outline-color: rgba(var(--page-primary-rgb), .25);
--pagination-fw: 600;
--pagination-fs: 14px;
--pagination-radius: 6px;
}
.pagination {
align-items: center;
display: flex;
justify-content: center;
margin-top: 1rem;
}
.pagination:focus, .pagination:focus-within {
outline: none;
}
.pagination__list {
grid-gap: 12px;
list-style: none;
margin: 0;
}
.pagination__list,.pagination__list button,
.pagination__list a {
align-items: center;
display: flex;
justify-content: center;
padding: 0;
}
.pagination__list button,
.pagination__list a {
background-color: white;
background-color: var(--pagination-bg);
border: 1px solid rgba(100, 116, 139, 0.25);
border: 1px solid var(--pagination-border-color);
border-radius: 6px;
border-radius: var(--pagination-radius);
color: rgba(100, 116, 139, 0.5);
color: var(--pagination-color);
cursor: pointer;
font-size: 14px;
font-size: var(--pagination-fs);
font-weight: 600;
font-weight: var(--pagination-fw);
height: 32px;
line-height: 32px;
min-width: 32px;
outline-color: transparent;
outline-offset: 5px;
outline-style: solid;
outline-width: 3px;
text-align: center;
text-decoration: none;
transition-duration: 150ms;
transition-property: background-color, border-color, color, outline-offset, outline-color;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
will-change: background-color, border-color, color, outline-offset, outline-color;
}
.pagination__list button[aria-hidden=true],
.pagination__list a[aria-hidden=true] {
display: none;
}
.pagination__list button .arrow-left-icon,
.pagination__list button .arrow-right-icon,
.pagination__list button .arrow-skip-icon,
.pagination__list a .arrow-left-icon,
.pagination__list a .arrow-right-icon,
.pagination__list a .arrow-skip-icon {
height: 16px;
min-height: 16px;
min-width: 16px;
pointer-events: none;
transform: scale(0.65);
width: 16px;
}
.pagination__list button .arrow-left-icon::after, .pagination__list button .arrow-left-icon::before,
.pagination__list button .arrow-right-icon::after,
.pagination__list button .arrow-right-icon::before,
.pagination__list button .arrow-skip-icon::after,
.pagination__list button .arrow-skip-icon::before,
.pagination__list a .arrow-left-icon::after,
.pagination__list a .arrow-left-icon::before,
.pagination__list a .arrow-right-icon::after,
.pagination__list a .arrow-right-icon::before,
.pagination__list a .arrow-skip-icon::after,
.pagination__list a .arrow-skip-icon::before {
box-sizing: border-box;
content: "";
display: block;
position: absolute;
}
.pagination__list button .arrow-left-icon,
.pagination__list a .arrow-left-icon {
border: 2px solid transparent;
border-radius: 100px;
box-sizing: border-box;
display: block;
position: relative;
}
.pagination__list button .arrow-left-icon::after,
.pagination__list a .arrow-left-icon::after {
border-bottom: 2px solid;
border-left: 2px solid;
box-sizing: border-box;
content: "";
display: block;
height: 10px;
left: 3px;
position: absolute;
top: 1px;
transform: rotate(45deg);
width: 10px;
}
.pagination__list button .arrow-right-icon,
.pagination__list a .arrow-right-icon {
border: 2px solid transparent;
border-radius: 100px;
box-sizing: border-box;
display: block;
position: relative;
}
.pagination__list button .arrow-right-icon::after,
.pagination__list a .arrow-right-icon::after {
border-bottom: 2px solid;
border-right: 2px solid;
box-sizing: border-box;
content: "";
display: block;
height: 10px;
position: absolute;
right: 4px;
top: 1px;
transform: rotate(-45deg);
width: 10px;
}
.pagination__list button .arrow-skip-icon::after,
.pagination__list button .arrow-skip-icon::before,
.pagination__list a .arrow-skip-icon::after,
.pagination__list a .arrow-skip-icon::before {
border-right: 1.5px solid;
border-top: 1.5px solid;
box-sizing: border-box;
content: "";
display: block;
height: 8px;
position: absolute;
right: 4px;
top: 4.5px;
transform: rotate(45deg);
width: 8px;
}
.pagination__list button .arrow-skip-icon::after,
.pagination__list a .arrow-skip-icon::after {
right: 8px;
}
.pagination__list button.paginate-prev, .pagination__list button.paginate-next, .pagination__list button.paginate-skip,
.pagination__list a.paginate-prev,
.pagination__list a.paginate-next,
.pagination__list a.paginate-skip {
grid-gap: 2px;
}
.pagination__list button.paginate-prev,
.pagination__list a.paginate-prev {
padding: 0 0.875em 0 0.375em;
}
.pagination__list button.paginate-next,
.pagination__list a.paginate-next {
padding: 0 0.375em 0 0.875em;
}
.pagination__list button.paginate-prev.w-icon, .pagination__list button.paginate-next.w-icon, .pagination__list button.paginate-skip.w-icon,
.pagination__list a.paginate-prev.w-icon,
.pagination__list a.paginate-next.w-icon,
.pagination__list a.paginate-skip.w-icon {
min-width: 32px;
padding-left: 0;
padding-right: 0;
width: 32px;
}
.pagination__list button.paginate-skip,
.pagination__list a.paginate-skip {
padding-left: 0.85rem;
padding-right: 0.85rem;
}
.pagination__list button svg,
.pagination__list a svg {
display: block;
height: 14px;
min-height: 14px;
min-width: 14px;
pointer-events: none;
width: 14px;
}
.pagination__list button:hover,
.pagination__list a:hover {
border-color: rgba(148, 163, 184, 0.6);
border-color: var(--pagination-hover-border-color);
color: rgba(100, 116, 139, 1);
color: var(--pagination-hover-color);
outline-color: rgba(15, 23, 42, 0.02);
outline-color: var(--pagination-hover-outline-color);
outline-offset: 0;
}
.pagination__list button:focus, .pagination__list button:focus-within,
.pagination__list a:focus,
.pagination__list a:focus-within {
border-color: rgba(148, 163, 184, 1);
border-color: var(--pagination-focus-border-color);
color: rgba(148, 163, 184, 1);
color: var(--pagination-focus-color);
outline-color: rgba(100, 116, 139, 0.1);
outline-color: var(--pagination-focus-outline-color);
outline-offset: 0;
}
.pagination__list button:active,
.pagination__list a:active {
border-color: var(--pagination-active-border-color);
color: #80bdff;
color: var(--pagination-active-color);
outline-color: var(--pagination-active-outline-color);
outline-offset: 0;
}
.pagination__list button[disabled],
.pagination__list a[disabled] {
background-color: rgba(100, 116, 139, 0.03);
background-color: var(--pagination-disabled-bg);
border: 1px solid rgba(100, 116, 139, 0.1);
border: 1px solid var(--pagination-disabled-border-color);
color: rgba(100, 116, 139, 0.2);
color: var(--pagination-disabled-color);
cursor: not-allowed;
pointer-events: none;
}
.pagination__list button[aria-current=true],
.pagination__list a[aria-current=true] {
background-color: var(--pagination-current-bg);
border: 1px solid var(--pagination-current-border-color);
color: #80bdff;
color: var(--pagination-current-color);
outline-color: var(--pagination-current-outline-color);
outline-offset: 0;
pointer-events: none;
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: 2px;
}
.pagination__list button[aria-current=true]:focus,
.pagination__list a[aria-current=true]:focus {
outline-color: transparent;
}
[data-paginate-item][aria-hidden=true] {
display: none;
}
.tab-switcher {
--tab-switcher-bg: 255, 255, 255;
--tab-switcher-radius: 0;
--tab-switcher-gutter: 5px;
--tab-switcher-bg-active: var(--page-primary-rgb);
--tab-switcher-color-active: 255, 251, 245;
--tab-switcher-color-inactive: 11, 29, 26;
--tab-switcher-btn-radius: 0;
--tab-switcher-btn-height: 42px;
grid-gap: 1rem;
justify-content: flex-start;
}
.tab-switcher,.tab-switcher--titles {
align-items: center;
display: flex;
flex-direction: column;
width: 100%;
}
.tab-switcher--titles {
justify-content: center;
position: relative;
}
.tab-switcher--btns {
align-items: center;
background-color: rgba(var(--tab-switcher-bg), 1);
border-radius: var(--tab-switcher-radius);
border-radius: 0;
box-sizing: border-box;
display: flex;
grid-gap: var(--tab-switcher-gutter);
grid-gap: 0;
outline: 0.25em solid transparent;
outline-offset: 0.25em;
transition-duration: 150ms;
transition-property: outline, outline-offset, background-color;
width: 100%;
will-change: outline, outline-offset, background-color;
}
.tab-switcher--btns::after {
background-image: linear-gradient(to right, #e2e8f0, white);
background-image: linear-gradient(to right, var(--color-slate-200), white);
bottom: 0;
content: "";
display: block;
height: 1px;
position: absolute;
width: 100%;
}
.tab-switcher--btns.has-focus {
outline-offset: 0.5em;
outline-width: 1px;
}
.tab-switcher--btns button {
align-items: center;
-webkit-appearance: none;
background: transparent;
border: none;
border-radius: var(--tab-switcher-btn-radius);
cursor: pointer;
display: flex;
font-size: 16px;
font-weight: 500;
height: var(--tab-switcher-btn-height);
justify-content: space-between;
line-height: 1;
margin: 0;
overflow: visible;
padding: 0 1rem;
padding: 0 var(--rem1);
position: relative;
transition-duration: 150ms, 100ms;
transition-property: color, background-color;
transition-timing-function: linear, ease-in;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: 1;
}
.tab-switcher--btns button span {
position: relative;
top: 0;
transition-duration: 50ms;
transition-property: span;
will-change: top;
}
.tab-switcher--btns button svg {
color: inherit;
display: block;
height: 1em;
width: 1em;
}
@media (min-width: 768px) {
.tab-switcher--btns button svg {
display: none;
}
}
.tab-switcher--btns button:not(.disabled):focus, .tab-switcher--btns button:not(.disabled):hover {
color: #1e293b;
color: var(--color-slate-800);
outline: 0;
}
.tab-switcher--btns button[aria-expanded=false] {
color: rgba(var(--tab-switcher-color-inactive), 0.6);
}
.tab-switcher--btns button[aria-expanded=false]:active span {
outline: 0;
top: 1px;
}
.tab-switcher--btns button[aria-expanded=false] svg {
opacity: 0;
}
.tab-switcher--btns button[aria-expanded=true] {
color: #0f172a;
color: var(--color-slate-900);
}
.tab-switcher--line {
position: relative;
width: 100%;
}
.tab-switcher--indicator {
position: absolute;
top: calc(var(--tab-switcher-btn-height) * 0 - 1px);
transition-delay: 0s, 0s, 150ms;
transition-duration: 100ms, 50ms, 150ms;
transition-property: transform, width, opacity;
transition-timing-function: ease-in-out, linear, linear;
z-index: 0;
}
.tab-switcher--indicator::before {
background-color: rgba(var(--tab-switcher-bg-active), 1);
border-radius: var(--tab-switcher-btn-radius);
content: "";
display: block;
height: 2px;
position: absolute;
top: 0;
width: 100%;
z-index: 0;
}
@media (max-width: 768px) {
.tab-switcher--titles,.tab-switcher--titles .tab-switcher--btns {
flex-direction: row;
max-width: 100%;
width: 100%;
}
.tab-switcher--titles .tab-switcher--btns {
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 4px;
overflow: hidden;
}
.tab-switcher--titles .tab-switcher--btns::after {
display: none;
}
.tab-switcher--titles .tab-switcher--btns button {
display: flex;
font-size: 15px;
justify-content: center;
text-align: left;
width: 100%;
}
.tab-switcher--titles .tab-switcher--btns button:not(:last-child) {
border-right: 1px solid #e2e8f0;
border-right: 1px solid var(--color-slate-200);
}
.tab-switcher--titles .tab-switcher--btns button[aria-expanded=true] {
background-color: white;
color: #007bff;
color: var(--color-primary-500);
font-weight: 600;
}
.tab-switcher--titles .tab-switcher--btns button span {
white-space: nowrap;
}
.tab-switcher--titles .tab-switcher--btns button svg,.tab-switcher--titles .tab-switcher--indicator {
display: none;
}
.tab-switcher--titles .tab-switcher--btns button[aria-expanded=false] {
color: #94a3b8;
color: var(--color-slate-400);
}
.tab-switcher--titles.is-toggled button[aria-expanded=false] {
display: flex;
}
.tab-switcher--line {
display: none;
}
}
.tab-switcher--containerInner {
padding: 0 1rem 1rem 1rem;
}
.tab-switcher--containerInner .blocktype-paragraph {
text-wrap: balance;
}
.tab-switcher--containerInner .blocktype-hr {
border: 0px solid;
border-top: 1px solid #cbd5e1;
border-top: 1px solid var(--color-slate-300);
margin: 2rem 0;
}
.tab-switcher--containerInner .blocktype-heading.blocktype-heading-h3:not(:last-child) {
margin-bottom: 1em;
}
.tab-switcher--containerInner .blocktype-accordion ul {
display: inline-block;
line-height: 2;
list-style: disc;
list-style-position: inside;
margin: 0 !important;
max-width: 100%;
padding-left: 1rem;
}
.tab-switcher--containerInner .blocktype-accordion ul li:last-child {
margin-bottom: 0;
}
.tab-switcher--containerInner ul.blocktype-list.blocktype-list-circle,
.tab-switcher--containerInner ul.blocktype-list.blocktype-list-circle {
display: inline-block;
line-height: 2;
list-style: disc;
list-style-position: inside;
margin: 0 !important;
max-width: 100%;
padding-left: 1rem;
}
.tab-switcher--containerInner ul.blocktype-list.blocktype-list-circle li:last-child,
.tab-switcher--containerInner ul.blocktype-list.blocktype-list-circle li:last-child {
margin-bottom: 0;
}
.tab-switcher--containers {
-webkit-overflow-scrolling: touch;
width: 100%;
}
.tab-switcher--containers[aria-hidden=true] {
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.tab-switcher--containers .tab-switcher--container {
display: inline-block;
outline: 0px solid;
width: 100%;
}
.tab-switcher--containers .tab-switcher--container[aria-hidden=true] {
display: none;
}
.chart {
align-items: center;
display: grid;
grid-template-columns: 1fr;
margin: 0 auto;
max-width: 100%;
padding: 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
.chart {
grid-gap: 1rem;
grid-template-columns: 1fr 425px;
margin: 0 auto;
padding: 1rem;
}
}
@media (min-width: 1200px) {
.chart {
grid-gap: 1rem;
grid-template-columns: 650px 1fr;
margin: 0 auto;
padding: 1rem;
}
}
.chart__header {
align-items: flex-start;
display: flex;
flex-direction: column;
grid-column-gap: 1rem;
}
.chart__header .chart__question-number {
border-bottom: 1px solid rgba(var(--page-primary-rgb), 0.45);
display: block;
font-size: 1rem;
font-weight: 600;
margin-bottom: 1.25rem;
overflow: hidden;
width: -moz-max-content;
width: max-content;
}
.chart__header .chart__title {
font-size: 1.563rem;
font-weight: 600;
line-height: 1.25;
margin: 0;
text-wrap: balance;
}
.chart__header p {
font-size: 1rem;
text-wrap: pretty;
}
@media (min-width: 768px) {
.chart__header .chart__title {
font-size: 1.953rem;
}
.chart__header p {
font-size: 1.25rem;
margin-top: 0.5rem;
}
}
@media (min-width: 1380px) {
.chart__header .chart__title {
font-size: 2.25rem;
font-weight: 600;
line-height: 1.25;
}
.chart__header p {
font-size: 1.25rem;
max-inline-size: 60ch;
}
}
.chart__fact {
margin-bottom: 1.25rem;
margin-top: 0.5rem;
}
.chart__fact p {
color: #475569;
color: var(--color-slate-600);
line-height: 1.563;
opacity: 0.85;
text-wrap: balance;
}
.chart__fact:last-child {
margin-bottom: 0;
}
.graph {
--radius: 0.25rem;
--border-color: var(--color-slate-300);
animation: fade-in-fwd 0.6s cubic-bezier(0.39, 0.575, 0.565, 1) both;
border: 1px solid #cbd5e1;
border: 1px solid var(--border-color);
border-radius: 0.25rem;
border-radius: var(--radius);
box-shadow: rgba(33, 35, 38, 0.1) 0px 10px 10px -10px;
margin: 0;
overflow: hidden;
padding: 0;
position: relative;
}
.graph[data-style="0"] {
border: 0px solid;
border-radius: 0;
box-shadow: 0 0 0 0;
display: flex;
flex-direction: column;
}
.graph[data-style="0"] .graph__logo {
display: none;
}
.graph[data-style="0"] figcaption {
background: none;
border: none;
border-radius: 6px;
color: #334155;
color: var(--color-slate-700);
display: flex;
font-size: 14px;
justify-content: center;
margin: 1.125rem auto 0 0;
margin-top: 1.125rem;
max-width: -moz-max-content;
max-width: max-content;
opacity: 0.75;
padding: 6px 0;
}
@media (min-width: 992px) {
.graph[data-style="0"] figcaption {
margin-top: 0;
}
}
.graph figcaption {
align-items: center;
border-bottom: 1px solid var(--border-color);
color: rgba(0, 0, 0, 0.5);
display: inline-flex;
font-size: 15px;
grid-gap: 0.25rem;
justify-content: center;
margin: 0;
margin-top: 0;
order: 1;
padding: 0 0 0 1rem;
padding: 0.55rem 0;
text-align: center;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.graph figcaption svg {
display: block;
height: 0.9em;
width: 0.9em;
}
.graph__data {
background-color: transparent;
grid-gap: 12px;
grid-template-columns: 1fr !important;
}
.graph__data .graph__row {
background-color: #fff;
border: 1px solid rgba(var(--page-primary-rgb), 0.25);
box-shadow: 0 0 0 0;
}
.graph__data[aria-hidden=false]::-webkit-scrollbar {
width: 10px;
}
.graph__data[aria-hidden=false]::-webkit-scrollbar-track {
background: #f1f1f1;
}
.graph__data[aria-hidden=false]::-webkit-scrollbar-thumb {
background: #888;
}
.graph__data[aria-hidden=false]::-webkit-scrollbar-thumb:hover {
background: #555;
}
@media (min-width: 1024px) {
.graph__data {
grid-gap: 1rem;
padding: 1.125rem 0;
}
}
.graph__data {
align-items: flex-end;
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
padding: 1.125rem 0;
}
.graph__data .graph__row {
align-items: center;
display: grid;
grid-gap: 12px;
grid-template-columns: 1fr 80px;
margin: 0;
width: 100%;
}
@media (min-width: 992px) {
.graph__data .graph__row {
grid-template-columns: 1fr 100px;
}
}
.graph__data .graph__row > span {
align-items: center;
display: flex;
}
.graph__data .graph__row + .graph__row {
margin-top: 0;
}
.graph__data .graph__bar {
align-items: center;
border-radius: var(--radius);
box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
display: block;
grid-template-columns: max-content 50px;
height: 30px;
margin: 0 !important;
overflow: hidden;
padding: 0;
position: relative;
}
.graph__data .graph__fill {
margin: 0;
padding: 0;
}
@media (min-width: 992px) {
.graph__data {
grid-template-columns: 1fr 1fr;
}
}
.graph__row {
border-radius: 12px;
box-sizing: border-box;
margin-left: 1rem;
padding: 12px 12px 12px 16px;
position: relative;
width: 100%;
width: calc(100% - 2rem);
}
.graph__row.hidden {
display: none;
}
.graph__row .graph__bar {
margin-top: 0.825rem;
}
.graph__row + .graph__row {
margin-top: 1.125rem;
}
.graph__row .graph__reply {
display: block;
font-size: 15px;
font-weight: 600;
line-height: 1.25;
}
.graph__row .graph__tip {
font-size: 13px;
}
@media (min-width: 992px) {
.graph__row .graph__tip {
font-size: 15px;
}
.graph__row .graph__reply {
font-size: 18px;
}
}
.graph__fill {
height: 30px;
position: relative;
transition-duration: 50ms;
transition-property: width;
transition-timing-function: linear;
z-index: 0;
}
.graph__tip {
align-items: center;
background-color: #f1f5f9;
background-color: var(--color-slate-100);
bottom: 0;
display: flex;
font-feature-settings: "kern" 1, "liga" 1, "calt" 1, "pnum" 1, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
font-size: 16px;
font-weight: 700;
justify-content: flex-end;
margin: 0;
outline: 0;
padding-left: 0.65rem;
padding-right: 0.35rem;
position: absolute;
right: 0;
top: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: -moz-max-content;
width: max-content;
z-index: 1;
}
[data-theme=dark] .graph__tip {
background-color: rgb(255, 255, 255);
color: #000000;
color: var(--color-black);
}
[data-size=sm] .graph__fill,[data-size=sm] .graph__tip {
height: 30px;
}
[data-size=md] .graph__fill {
height: 35px;
}
[data-size=md] .graph__tip {
height: 25px;
}
[data-size=lg] .graph__fill {
height: 40px;
}
[data-size=lg] .graph__tip {
height: 20px;
}
.graph__row:nth-of-type(1) .graph__bar {
background-color: rgba(0, 123, 255, 0.05);
}
.graph__row:nth-of-type(1) .graph__fill {
background-color: #007bff;
}
.graph__row:nth-of-type(2) .graph__bar {
background-color: rgba(211, 107, 231, 0.05);
}
.graph__row:nth-of-type(2) .graph__fill {
background-color: #d36be7;
}
.graph__row:nth-of-type(3) .graph__bar {
background-color: rgba(255, 107, 179, 0.05);
}
.graph__row:nth-of-type(3) .graph__fill {
background-color: #ff6bb3;
}
.graph__row:nth-of-type(4) .graph__bar {
background-color: rgba(255, 145, 126, 0.05);
}
.graph__row:nth-of-type(4) .graph__fill {
background-color: #ff917e;
}
.graph__row:nth-of-type(5) .graph__bar {
background-color: rgba(255, 198, 95, 0.05);
}
.graph__row:nth-of-type(5) .graph__fill {
background-color: #ffc65f;
}
.graph__row:nth-of-type(6) .graph__bar {
background-color: rgba(173, 130, 17, 0.05);
}
.graph__row:nth-of-type(6) .graph__fill {
background-color: #ad8211;
}
.graph__row:nth-of-type(7) .graph__bar {
background-color: rgba(208, 94, 0, 0.05);
}
.graph__row:nth-of-type(7) .graph__fill {
background-color: #d05e00;
}
.graph__row:nth-of-type(8) .graph__bar {
background-color: rgba(37, 193, 150, 0.05);
}
.graph__row:nth-of-type(8) .graph__fill {
background-color: #25c196;
}
.graph__row:nth-of-type(9) .graph__bar {
background-color: rgba(208, 121, 238, 0.05);
}
.graph__row:nth-of-type(9) .graph__fill {
background-color: #d079ee;
}
.graph__row:nth-of-type(10) .graph__bar {
background-color: rgba(0, 85, 164, 0.05);
}
.graph__row:nth-of-type(10) .graph__fill {
background-color: #0055a4;
}
.graph__row:nth-of-type(11) .graph__bar {
background-color: rgba(193, 47, 221, 0.05);
}
.graph__row:nth-of-type(11) .graph__fill {
background-color: #c12fdd;
}
.graph__row:nth-of-type(12) .graph__bar {
background-color: rgba(255, 139, 200, 0.05);
}
.graph__row:nth-of-type(12) .graph__fill {
background-color: #ff8bc8;
}
.graph__row:nth-of-type(13) .graph__bar {
background-color: rgba(255, 170, 152, 0.05);
}
.graph__row:nth-of-type(13) .graph__fill {
background-color: #ffaa98;
}
.graph__row:nth-of-type(14) .graph__bar {
background-color: rgba(255, 221, 128, 0.05);
}
.graph__row:nth-of-type(14) .graph__fill {
background-color: #ffdd80;
}
.graph__row:nth-of-type(15) .graph__bar {
background-color: rgba(6, 60, 255, 0.05);
}
.graph__row:nth-of-type(15) .graph__fill {
background-color: #063cff;
}
.graph__row:nth-of-type(16) .graph__bar {
background-color: rgba(32, 165, 128, 0.05);
}
.graph__row:nth-of-type(16) .graph__fill {
background-color: #20a580;
}
.graph__row:nth-of-type(17) .graph__bar {
background-color: rgba(184, 80, 0, 0.05);
}
.graph__row:nth-of-type(17) .graph__fill {
background-color: #b85000;
}
.graph__row:nth-of-type(18) .graph__bar {
background-color: rgba(255, 0, 184, 0.05);
}
.graph__row:nth-of-type(18) .graph__fill {
background-color: #ff00b8;
}
.graph__logo {
align-items: center;
background-image: linear-gradient(to top, var(--border-color), #fff);
border-radius: 0 0 var(--radius) var(--radius);
border-top: 1px solid var(--border-color);
color: #bbb;
display: flex;
font-size: 12px;
grid-gap: 0.5rem;
justify-content: space-between;
justify-content: center;
letter-spacing: -0.01em;
margin: 0;
margin-bottom: -2px;
padding: 1rem 1.2rem;
position: relative;
text-shadow: -1px -1px #fff;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.graph__logo svg {
display: block;
}
.graph__logo .left__logo,
.graph__logo .right__logo {
align-items: center;
display: inline-flex;
grid-gap: 0.5rem;
}
.graph__logo .right__logo {
display: none;
}
.graph__logo .left__logo svg {
color: #c9c9c9;
height: 24px;
width: -moz-max-content;
width: max-content;
}
.graph__logo .logo__square {
display: none;
}
.graph__button {
--page-primary-rgb: 0, 174, 255;
--page-primary-hex: #00aeff;
--page-primarydark-hex: #006899;
background-image: linear-gradient(to top, #fff 20%, rgba(255, 255, 255, 0));
bottom: 55px;
height: 150px;
left: 0;
position: absolute;
right: 0;
z-index: 3;
}
.graph__button,.graph__button button {
align-items: center;
display: flex;
justify-content: center;
width: 100%;
width: 100%;
}
.graph__button button {
background-color: white;
background-image: linear-gradient(rgba(var(--page-primary-rgb), 0.01), rgba(var(--page-primary-rgb), 0.03));
border: 0;
border: 1px solid rgba(var(--page-primary-rgb), 0.35);
border-radius: 0.25rem;
border-radius: 0.85em;
color: #80bdff;
color: var(--page-primary-hex);
cursor: pointer;
font-size: 1rem;
font-weight: bold;
height: 60px;
line-height: 1.2;
margin: 2.441rem;
max-width: 330px;
outline: 0.35em solid rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25em;
overflow: hidden;
padding: 0.25rem 0.5rem;
position: relative;
text-decoration: none;
transition-delay: 100ms, 0ms, 0ms, 0ms;
transition-duration: 150ms, 150ms, 150ms, 150ms;
transition-property: outline-offset, outline-color, border-color, transform;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
}
.graph__button button span {
position: relative;
top: 0;
transition-duration: 150ms;
}
.graph__button button:hover {
transform: scaleY(1.03) scaleX(1.01);
}
.graph__button button:hover, .graph__button button:focus {
border-color: rgba(var(--page-primary-rgb), 0.5);
outline-color: rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
}
.graph__button button:active,.graph__button button[data-loading=false] {
outline-color: rgba(var(--page-primary-rgb), 0);
outline-offset: 0.85em;
}
.graph__button button:active span {
top: -1px;
}
.graph__button button[data-loading=true] {
filter: grayscale(100%);
}
.graph__button button [aria-hidden=true],.blocktype-graphchart[aria-hidden=true] {
display: none;
}
.chart__navigation {
align-items: center;
display: flex;
gap: 1rem;
}
@media (max-width: 1280px) {
.chart__navigation {
display: grid;
grid-template-columns: 1fr 1fr;
}
.chart__navigation button {
min-width: 100%;
width: 100%;
}
.graph figcaption {
order: -1;
}
}
.section-tile {
--page-primary-rgb: 229, 139, 23;
--figure-radius: 15px;
--figure-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
--figcaption-fs: 14px;
--figcaption-lh: 1.25;
--figcaption-fw: 400;
--figcaption-opacity: 1;
--figcaption-color: var(--color-slate-700);
--figcaption-link-color: #999;
--figcaption-link-color-hover: var(--color-slate-800);
--figcaption-underline-color: var(--color-slate-700);
--figcaption-underline-color-hover: var(--color-slate-800);
--tile-heading-ff: inherit;
--tile-btn-ff: inherit;
--tile-header-h1-fs: calc(var(--scale-p4) * 1rem);
--tile-header-h1-fw: 700;
--tile-header-h1-ls: 0;
--tile-header-h2-fs: calc(var(--scale-p2) * 1rem);
--tile-header-h2-fw: 600;
--tile-header-h2-ls: 0;
--tile-header-p-fs: calc(var(--scale-p2) * 1rem);
--tile-header-p-fw: 400;
--tile-header-p-lh: 1.563;
--tile-btn-fs: 1.2rem;
--tile-btn-fw: 500;
}
@media (min-width: 992px) {
.section-tile {
--tile-header-h1-fs: calc(var(--scale-p8) * 1rem);
--tile-header-h2-fs: calc(var(--scale-p2) * 1rem);
--tile-header-p-fs: calc(var(--scale-p3) * 1rem);
}
}
.section-tile[data-tile-size=lg] .section-tile-container {
padding-bottom: calc(3.583 * 1rem);
padding-bottom: calc(var(--scale-p8) * 1rem);
padding-top: calc(2.074 * 1rem);
padding-top: calc(var(--scale-p5) * 1rem);
}
.section-tile .section-tile-container {
margin-left: auto;
margin-right: auto;
}
@media (max-width: 768px) {
.section-tile .section-tile-container {
padding-top: 2rem;
}
}
@media (min-width: 992px) {
.section-tile .section-tile-container {
padding-left: 2rem;
padding-right: 2rem;
}
}
@media (min-width: 1400px) {
.section-tile .section-tile-container {
padding-left: 0;
padding-right: 0;
}
}
.section-tile .section-tile-row {
align-items: center;
display: grid;
grid-gap: 2rem;
}
@media (min-width: 1200px) {
.section-tile .section-tile-row {
grid-gap: 2.441rem;
}
}
@media (min-width: 992px) {
.section-tile[data-tile-cols="2"] .section-tile-row {
grid-template-columns: 1fr 1fr;
}
.section-tile[data-tile-cols="1"] .section-tile-row {
grid-template-columns: 1fr;
}
}
.section-tile-meta .section-tile--h2 {
font-size: var(--tile-header-h2-fs);
font-weight: var(--tile-header-h2-fw);
letter-spacing: var(--tile-header-h2-ls);
line-height: 1;
margin-bottom: calc(1.44 * 1em);
margin-bottom: calc(var(--scale-p3) * 1em);
text-decoration: underline;
text-decoration-color: #80bdff;
text-decoration-color: var(--page-primary-hex);
}
.section-tile-meta p,
.section-tile-meta ul,
.section-tile-meta ol {
font-size: var(--tile-header-p-fs);
font-weight: var(--tile-header-p-fw);
line-height: var(--tile-header-p-lh);
margin-top: 1em;
max-inline-size: 65ch;
text-wrap: balance;
}
.section-tile-meta *:first-child {
margin-top: 0;
}
.section-tile-meta *:last-child {
margin-bottom: 0;
}
@media (max-width: 992px) {
.section-tile-meta p {
display: none;
}
}
.section-tile-btns {
align-items: center;
display: flex;
font-size: var(--tile-btn-fs);
font-weight: var(--tile-btn-fw);
grid-gap: 1rem;
justify-content: flex-start;
margin-top: 2.441rem;
}
.section-tile-btns a {
align-items: center;
display: flex;
height: 52px;
justify-content: center;
line-height: 52px;
text-decoration: none;
white-space: pre;
}
.section-tile-figure {
border-radius: 12px;
box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
overflow: hidden;
}
.section-tile-figure img {
max-width: 100%;
}
.section-tile[data-image-count] .section-tile-figures {
display: grid;
grid-gap: 1rem;
position: relative;
}
.section-tile[data-image-count] .section-tile-figures img {
border-radius: var(--figure-radius);
box-shadow: var(--figure-shadow);
display: block;
height: 100%;
margin-left: auto;
margin-right: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
overflow: hidden;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.section-tile[data-image-count] .section-tile-figures figcaption {
color: var(--figcaption-color);
font-size: var(--figcaption-fs);
font-weight: var(--figcaption-fw);
grid-column: 1/-1;
line-height: var(--figcaption-lh);
margin-top: 0;
opacity: var(--figcaption-opacity);
}
.section-tile[data-image-count] .section-tile-figures figcaption span {
position: relative;
transition-duration: 150ms;
transition-property: color, opacity, text-decoration-color;
will-change: color, opacity, text-decoration-color;
}
.section-tile[data-image-count] .section-tile-figures figcaption a {
color: var(--figcaption-link-color);
text-decoration: underline;
text-decoration-color: var(--figcaption-underline-color);
text-decoration-thickness: 1px;
text-underline-offset: 0.1em;
}
.section-tile[data-image-count] .section-tile-figures figcaption a:hover, .section-tile[data-image-count] .section-tile-figures figcaption a:focus {
color: var(--figcaption-link-color-hover);
text-decoration-color: var(--figcaption-underline-color-hover);
}
.section-tile[data-image-count] .section-tile-figures figcaption a:active span {
top: 1px;
}
.section-tile[data-image-count="0"]:not([data-tile-type=video]) .section-tile-figures {
display: none;
}
.section-tile[data-image-count="0"][data-tile-type=video] .section-tile-figures {
display: block;
}
.section-tile[data-image-count="1"] .section-tile-figures {
grid-template-columns: 1fr;
}
.section-tile[data-image-count="1"] .section-tile-figures figure {
aspect-ratio: 4/3;
}
.section-tile[data-image-count="1"] .section-tile-figures figure:nth-of-type(n+2) {
display: none;
}
.section-tile[data-image-count="2"] .section-tile-figures {
grid-template-columns: 1fr 1fr;
}
.section-tile[data-image-count="2"] .section-tile-figures figure:nth-of-type(n+3) {
display: none;
}
.section-tile[data-image-count="2"] .section-tile-figures figure {
aspect-ratio: 9/16 !important;
}
.section-tile[data-image-count="3"] .section-tile-figures {
grid-template-columns: 1fr 1fr 1fr;
}
.section-tile[data-image-count="3"] .section-tile-figures figure:nth-of-type(n+4) {
display: none;
}
.section-tile[data-image-count="3"] .section-tile-figures figure {
aspect-ratio: 9/16;
}
.section-tile[data-tile-ar="1-1"][data-tile-type=image] .section-tile-figures figure {
aspect-ratio: 1/1;
}
.section-tile[data-tile-ar="3-4"][data-tile-type=image] .section-tile-figures figure {
aspect-ratio: 9/16;
}
.section-tile[data-tile-ar="16-9"][data-tile-type=image] .section-tile-figures figure {
aspect-ratio: 16/9;
}
.section-tile[data-tile-ar="1-1"][data-tile-type=video] .section-tile-figures figure,
.section-tile[data-tile-ar="3-4"][data-tile-type=video] .section-tile-figures figure,
.section-tile[data-tile-ar="16-9"][data-tile-type=video] .section-tile-figures figure {
aspect-ratio: auto;
}
.section-tile[data-tile-ar="1-1"][data-tile-cols="2"]:not([data-image-count="1"]) .section-tile-figures,
.section-tile[data-tile-ar="1-1"][data-tile-cols="3"]:not([data-image-count="1"]) .section-tile-figures,
.section-tile[data-tile-ar="16-9"][data-tile-cols="2"]:not([data-image-count="1"]) .section-tile-figures,
.section-tile[data-tile-ar="16-9"][data-tile-cols="3"]:not([data-image-count="1"]) .section-tile-figures {
grid-template-columns: 1fr 1fr;
}
.section-tile[data-tile-ar="1-1"][data-tile-cols="2"]:not([data-image-count="1"]) .section-tile-figures figure,
.section-tile[data-tile-ar="1-1"][data-tile-cols="3"]:not([data-image-count="1"]) .section-tile-figures figure,
.section-tile[data-tile-ar="16-9"][data-tile-cols="2"]:not([data-image-count="1"]) .section-tile-figures figure,
.section-tile[data-tile-ar="16-9"][data-tile-cols="3"]:not([data-image-count="1"]) .section-tile-figures figure {
aspect-ratio: 9/16;
}
.section-tile[data-tile-ar="1-1"][data-tile-cols="2"]:not([data-image-count="1"]) .section-tile-figures figure:nth-of-type(n+3),
.section-tile[data-tile-ar="1-1"][data-tile-cols="3"]:not([data-image-count="1"]) .section-tile-figures figure:nth-of-type(n+3),
.section-tile[data-tile-ar="16-9"][data-tile-cols="2"]:not([data-image-count="1"]) .section-tile-figures figure:nth-of-type(n+3),
.section-tile[data-tile-ar="16-9"][data-tile-cols="3"]:not([data-image-count="1"]) .section-tile-figures figure:nth-of-type(n+3),.section-tile[data-tile-type=text] .section-tile-figures {
display: none;
}
.section-tile[data-tile-type=text] .section-tile-row {
grid-template-columns: 1fr;
}
.section-tile[data-tile-size=sm][data-image-count="1"] .section-tile-figures,
.section-tile[data-tile-size=sm][data-image-count="2"] .section-tile-figures,
.section-tile[data-tile-size=sm][data-image-count="3"] .section-tile-figures {
grid-gap: 1.563rem;
margin-left: auto;
margin-right: auto;
max-width: 90%;
text-align: center;
}
.section-tile[data-tile-size=sm][data-image-count="1"] .section-tile-figures {
margin-left: auto;
margin-right: auto;
max-width: 500px;
width: 100%;
}
.section-tile[data-tile-size=sm][data-image-count="2"] .section-tile-figures {
margin-left: auto;
margin-right: auto;
max-width: 1024px;
width: 100%;
}
.section-tile[data-tile-size=md][data-image-count="1"] .section-tile-figures {
margin-left: auto;
margin-right: auto;
max-width: 1380px;
width: 100%;
}
.section-tile[data-tile-size=md][data-image-count="2"] .section-tile-figures {
margin-left: auto;
margin-right: auto;
max-width: 1100px;
width: 100%;
}
.section-tile[data-tile-size=lg][data-image-count="1"] .section-tile-figures {
margin-left: auto;
margin-right: auto;
max-width: 992px;
width: 100%;
}
.section-tile[data-tile-size=lg][data-image-count="2"] .section-tile-figures {
margin-left: auto;
margin-right: auto;
max-width: 1380px;
width: 100%;
}
.section-tile[data-tile-cols="1"] .section-tile-row {
grid-column-gap: 0;
}
.section-tile[data-tile-cols="1"][data-tile-alignment=center] {
text-align: center;
}
.section-tile[data-tile-cols="1"][data-tile-alignment=center] .section-tile-meta,
.section-tile[data-tile-cols="1"][data-tile-alignment=center] .section-tile-btns,
.section-tile[data-tile-cols="1"][data-tile-alignment=center] .section-tile-meta p,
.section-tile[data-tile-cols="1"][data-tile-alignment=center] .section-tile--h2 {
margin-left: auto;
margin-right: auto;
}
.section-tile[data-tile-cols="1"][data-tile-alignment=center] .section-tile-btns {
justify-content: center;
}
@media (min-width: 1200px) {
.section-tile[data-tile-cols="1"]:first-child .section-tile-meta .section-tile--h2 {
font-size: 3.247rem;
}
}
@media (min-width: 1380px) {
.section-tile[data-tile-cols="1"]:first-child .section-tile-meta .section-tile--h2 {
font-size: 3.815rem;
}
}
@media (max-width: 992px) {
.section-tile[data-tile-cols="1"]:first-child .section-tile-figures {
order: -1 !important;
}
}
.section-tile[data-tile-cols="1"][data-image-count="1"][data-tile-ar="3-4"] .section-tile-figures figure {
max-width: 350px;
}
.section-tile[data-tile-cols="2"][data-image-count="1"][data-tile-ar="3-4"] .section-tile-figures {
text-align: center;
}
.section-tile[data-tile-cols="2"][data-image-count="1"][data-tile-ar="3-4"] .section-tile-figures figure {
margin-left: auto;
margin-right: auto;
max-height: 600px;
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] .section-tile-figures,
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] .section-tile-figures {
align-items: center;
grid-gap: 1rem;
grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 991.98px) {
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] .section-tile-figures,
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] .section-tile-figures {
margin-left: auto;
margin-right: auto;
max-width: 550px;
}
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figure,
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figure {
aspect-ratio: 1/1;
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figure:nth-of-type(1),
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figure:nth-of-type(1) {
aspect-ratio: 1/1;
grid-column: 1/2;
height: 250px;
transform: scale(1);
width: 100%;
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figure:nth-of-type(2),
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figure:nth-of-type(2) {
aspect-ratio: inherit;
grid-column: 2/4;
height: 250px;
transform: scale(1);
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figure:nth-of-type(3),
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figure:nth-of-type(3) {
aspect-ratio: inherit;
aspect-ratio: 1/1;
grid-column: 1/4;
height: 250px;
transform: scale(1);
width: 100%;
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figcaption,
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figcaption {
grid-column: 1/-1;
transform: scale(1);
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figure,
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figcaption,
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figure,
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figcaption {
transition-delay: 150ms;
transition-duration: 150ms;
transition-property: transform;
}
.section-tile[data-tile-cols="1"][data-image-count="3"][data-tile-ar=collage] figure img,
.section-tile[data-tile-cols="2"][data-image-count="3"][data-tile-ar=collage] figure img {
display: block;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
width: 100%;
}
@media (max-width: 991.98px) {
.section-tile[data-tile-orientation=top] .section-tile-figures,
.section-tile[data-tile-orientation=left] .section-tile-figures,
.section-tile[data-tile-orientation=right] .section-tile-figures {
order: -1;
}
}
@media (min-width: 992px) {
.section-tile[data-tile-orientation=top] .section-tile-figures,
.section-tile[data-tile-orientation=left] .section-tile-figures {
order: -1;
}
.section-tile[data-tile-orientation=bottom] .section-tile-figures,
.section-tile[data-tile-orientation=right] .section-tile-figures {
order: 2;
}
}
.section-tile[data-tile-type=text] .section-tile-figures {
display: none;
}
.section-tile[data-tile-type=text] .section-tile-meta {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
}
.section-tile[data-tile-type=text] .section-tile-meta i {
color: rgba(var(--page-primary-rgb), 0.8);
font-size: 3.815rem;
margin-bottom: 3.052rem;
}
.section-tile[data-tile-type=text] .section-tile-meta p {
color: rgba(0, 0, 0, 0.65);
font-size: 1rem;
}
.section-tile[data-tile-type=text][data-tile-contained="0"] .section-tile-row {
align-items: initial;
grid-gap: 2rem;
}
.section-tile[data-tile-type=text][data-tile-contained="0"] .section-tile-col {
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.015), white);
border: 1px solid rgba(var(--page-primary-rgb), 0.25);
border-radius: 15px;
padding: 2rem;
}
.section-tile[data-tile-type=text][data-tile-contained="0"] .section-tile-col h2 {
font-size: 1.728rem;
}
.section-tile[data-tile-type=text][data-tile-contained="1"] .section-tile-row {
align-items: initial;
grid-gap: 2rem;
}
.section-tile[data-tile-type=text][data-tile-contained="1"] .section-tile-col {
background-color: rgba(var(--page-primary-rgb), 0.05);
border: 1px solid rgba(var(--page-primary-rgb), 0.1);
border-radius: 15px;
padding: 2rem;
}
.section-tile[data-tile-type=text][data-tile-contained="1"] .section-tile-col h2 {
font-size: 1.728rem;
}
.section-tile[data-tile-type=text] .section-tile-row {
align-items: flex-start;
grid-template-columns: 1fr !important;
}
.section-tile[data-tile-type=text] .section-tile-row .section-tile-meta .section-tile--h2 {
line-height: 1;
}
.section-tile[data-tile-type=text] .section-tile-row .section-tile-meta p,
.section-tile[data-tile-type=text] .section-tile-row .section-tile-meta ul,
.section-tile[data-tile-type=text] .section-tile-row .section-tile-meta ol {
font-size: var(--tile-header-p-fs);
}
.section-tile[data-tile-type=text][data-tile-alignment=center] .section-tile-row {
align-items: center;
}
.section-tile[data-tile-type=quote] .section-tile-row {
grid-gap: 0 !important;
}
.section-tile[data-tile-type=quote] .section-tile-meta {
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
}
.section-tile[data-tile-type=quote] .section-tile-meta .section-tile--h2 {
color: rgba(var(--page-primary-rgb), 1);
font-size: 2.4rem;
font-weight: 600;
line-height: 1.414 !important;
}
.section-tile[data-tile-type=quote] .section-tile-meta p {
color: rgba(0, 0, 0, 0.65);
font-size: 1.563rem;
font-weight: bold;
}
.section-tile[data-tile-type=quote][data-tile-contained="0"] .section-tile-row {
align-items: initial;
grid-gap: 2rem;
}
.section-tile[data-tile-type=quote][data-tile-contained="0"] .section-tile-header {
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.015), white);
border: 1px solid rgba(var(--page-primary-rgb), 0.15);
border-radius: 15px 0 0 15px;
box-shadow: 0;
padding: 2rem;
}
.section-tile[data-tile-type=quote][data-tile-contained="0"] .section-tile-header h2 {
font-size: 1.728rem;
}
.section-tile[data-tile-type=quote][data-image-count] .section-tile-figures figure img {
border-radius: 0 15px 15px 0;
box-shadow: 0 !important;
}
.section-tile[data-tile-type=quote][data-tile-contained] figcaption {
display: none;
}
@media (min-width: 992px) {
.section-tile[data-tile-type=quote][data-tile-cols="1"] .section-tile-row, .section-tile[data-tile-type=quote][data-tile-cols="2"] .section-tile-row {
grid-template-columns: repeat(2, 1fr);
}
.section-tile[data-tile-type=quote][data-tile-cols="1"] .section-tile-meta p, .section-tile[data-tile-type=quote][data-tile-cols="2"] .section-tile-meta p {
max-width: 27em;
}
.section-tile[data-tile-type=quote][data-tile-cols="3"] .section-tile-row, .section-tile[data-tile-type=quote][data-tile-cols="4"] .section-tile-row {
grid-template-columns: repeat(4, 1fr);
}
}
@media (max-width: 992px) {
.section-tile[data-tile-type=quote][data-tile-cols="2"] .section-tile-meta p {
max-width: 27em;
}
.section-tile[data-tile-type=quote][data-tile-cols="1"] .section-tile-row, .section-tile[data-tile-type=quote][data-tile-cols="2"] .section-tile-row, .section-tile[data-tile-type=quote][data-tile-cols="3"] .section-tile-row, .section-tile[data-tile-type=quote][data-tile-cols="4"] .section-tile-row {
grid-template-columns: repeat(1, 1fr);
}
}
.section-tile[data-tile-type=quote] .section-tile-row {
align-items: flex-start;
grid-template-columns: repeat(2, 1fr);
}
.section-tile[data-tile-type=quote] .section-tile-row .section-tile-meta .section-tile--h2 {
line-height: 1;
}
.section-tile[data-tile-type=quote] .section-tile-row .section-tile-meta p,
.section-tile[data-tile-type=quote] .section-tile-row .section-tile-meta ul,
.section-tile[data-tile-type=quote] .section-tile-row .section-tile-meta ol {
font-size: 1.1rem;
}
.multisection {
--multisection-color: #000;
--multisection-btn-hover-bg: var(--page-primary-hex);
--multi-section-btn-hover-color: #0a0e12;
--multisection-bg-open: #f1f2f3;
--multisection-color-open: #000;
}
.multisection__progressbar {
--progress-width: 0%;
background-color: var(--multisection-bg-open);
border-radius: 0;
bottom: 0;
display: none;
height: 4px;
left: 0;
margin: 0;
position: absolute;
width: 100%;
}
.multisection__progressbar.animate::before {
transition: width var(--transition-speed) linear;
width: var(--progress-width);
}
.multisection__progressbar::before {
background-color: #80bdff;
background-color: var(--page-primary-hex);
content: "";
display: block;
height: 100%;
width: var(--progress-width);
}
.is-open .multisection__progressbar {
background-color: rgba(0, 0, 0, 0.05);
display: flex;
}
.multisection {
display: grid;
grid-gap: 1.563rem;
}
@media (min-width: 1024px) {
.multisection {
grid-gap: 2rem;
}
}
.multisection header {
display: grid;
grid-gap: 12px;
text-align: center;
}
.multisection header h1,
.multisection header h2 {
margin: 0;
}
.multisection header h2 {
font-size: 1rem;
font-weight: 500;
text-decoration: underline !important;
text-decoration-color: #007bff !important;
text-decoration-color: var(--color-primary-500) !important;
text-underline-offset: 0.1em;
}
.multisection header h1 {
font-size: 1.414rem;
line-height: 1.25;
}
@media (min-width: 768px) and (max-width: 991.98px) {
.multisection header h2 {
font-size: 1rem;
}
.multisection header h1 {
font-size: 1.953rem;
}
}
@media (min-width: 1024px) {
.multisection header h2 {
font-size: 1.563rem;
}
.multisection header h1 {
font-size: 52px;
line-height: 1.25;
margin: 0 auto;
width: 70%;
}
}
.multisection__body {
align-items: center;
display: grid;
}
.multisection__body ul {
display: flex;
flex-direction: column;
grid-gap: 1rem;
list-style: none;
margin: 0;
padding: 0 1.563rem;
position: relative;
z-index: 1;
}
.multisection__body picture {
aspect-ratio: 1/1;
display: block;
margin: auto;
pointer-events: none;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.multisection__body picture img {
display: block;
height: 100%;
max-width: 100%;
-o-object-position: center;
object-position: center;
width: 100%;
}
.multisection__body picture img:nth-of-type(1) {
border-radius: 12px;
-o-object-fit: cover;
object-fit: cover;
position: relative;
z-index: 1;
}
.multisection__body picture img:nth-of-type(2) {
filter: blur(96px);
left: 0;
max-width: 50%;
-o-object-fit: contain;
object-fit: contain;
position: absolute;
top: 0;
transform: translate3d(3rem, 3rem, 0);
}
@media (max-width: 1023.98px) {
.multisection__body picture {
height: 260px;
margin-bottom: 1.563rem;
order: -1;
width: 260px;
}
}
@media (min-width: 1024px) {
.multisection__body {
grid-gap: 1rem;
grid-template-columns: 500px max-content;
justify-content: center;
}
.multisection__body picture {
display: block;
height: 480px;
width: 480px;
}
}
@media (min-width: 1200px) {
.multisection__body {
grid-template-columns: 550px max-content;
}
.multisection__body picture {
height: 550px;
width: 550px;
}
}
.multisection__item {
border-radius: 8px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
color: var(--multisection-color);
overflow: hidden;
position: relative;
}
.multisection__item.is-open {
box-shadow: rgba(0, 0, 0, 0.16) 0px 10px 36px 0px, rgba(0, 0, 0, 0.06) 0px 0px 0px 1px;
color: var(--multisection-color-open);
}
.multisection__item .multisection__btn {
align-items: center;
background: transparent;
border: none;
border-radius: 12px;
color: var(--multisection-color);
cursor: pointer;
display: flex;
font-weight: 600;
justify-content: space-between;
outline: 0;
transition-duration: 150ms, 250ms;
transition-property: background-color;
width: 100%;
will-change: background-color;
}
.multisection__item.is-open .multisection__btn i {
display: none;
}
.multisection__item .multisection__btn i {
font-size: 1rem;
}
.multisection__item:not(.is-open) .multisection__btn i {
rotate: 0;
transition: transform 150ms;
}
.multisection__item.is-open .multisection__btn i {
transform: rotate(0deg);
}
.multisection__item:not(.is-open):hover .multisection__btn,
.multisection__item:not(.is-open):focus-within .multisection__btn {
background-color: rgba(0, 0, 0, 0.015);
}
.multisection__item .multisection__content {
display: none;
}
.multisection__item .multisection__content p {
color: rgba(0, 0, 0, 0.85);
font-size: 1.125rem;
line-height: 1.563;
}
.multisection__item .multisection__content p:last-of-type {
margin-bottom: 0;
}
.multisection__item .multisection__content p:first-of-type {
margin-top: 0;
}
.multisection__item .multisection__content a {
align-items: center;
color: black;
display: flex;
font-weight: 600;
grid-gap: 0.35rem;
justify-content: flex-start;
line-height: 1;
text-align: center;
text-decoration: none;
}
.multisection__item .multisection__content a span {
position: relative;
}
.multisection__item .multisection__content a span::before {
background-color: rgba(var(--page-primary-rgb), 1);
bottom: -3px;
content: "";
height: 1px;
left: 50%;
position: absolute;
right: 0;
transform: translateX(-50%);
transition-duration: 150ms;
transition-property: width;
width: 0%;
will-change: width;
z-index: -1;
}
.multisection__item .multisection__content a:hover span::before {
width: 100%;
}
.multisection__item .multisection__content a:hover,
.multisection__item .multisection__content a:focus {
outline: 0;
}
.multisection__item.is-open .multisection__content {
display: block;
height: -moz-fit-content;
height: fit-content;
}
@media (max-width: 991.98px) {
.multisection__item .multisection__btn {
font-size: 1.125rem;
padding: 1.563rem 1.563rem;
}
.multisection__item .multisection__content {
padding: 0 1.563rem 1.563rem;
}
.multisection__item.is-open .multisection__btn {
padding: 1.563rem 1.563rem 0.5rem;
}
.multisection__item.is-open .multisection__content {
padding: 0 1.563rem 1.563rem;
}
.multisection__item .multisection__content p,
.multisection__item .multisection__content p a {
font-size: 1rem;
}
}
@media (min-width: 992px) {
.multisection__item .multisection__btn {
font-size: 1.25rem;
font-weight: 600;
padding: 1.563rem 1.563rem;
}
.multisection__item.is-open .multisection__btn {
padding-bottom: 0.5rem;
}
.multisection__item.is-open .multisection__content {
padding: 0 1.563rem 1.563rem;
}
}
[data-btn] {
cursor: pointer;
}
[data-btn]:hover .btn-primary, [data-btn]:focus .btn-primary {
--btn-bg: var(--color-white);
--btn-border: var(--color-primary-500);
--btn-color: var(--color-primary-600);
outline: 0.25em solid rgba(0, 123, 255, 0.1);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.1);
outline-offset: 0;
transform: translate3d(0, -3px, 0);
}
.btn-primary {
--btn-bg: var(--color-white);
--btn-border: var(--color-slate-300);
--btn-color: var(--color-slate-500);
background-color: #FFFFFF;
background-color: var(--btn-bg);
border: 1px solid #cbd5e1;
border: 1px solid var(--btn-border);
border-radius: 0.25rem;
color: #64748b;
color: var(--btn-color);
display: block;
font-size: 1rem;
font-weight: 600;
letter-spacing: 0;
line-height: 1;
outline: 0.5em solid rgba(0, 123, 255, 0);
outline: 0.5em solid rgba(var(--color-primary-500-rgb), 0);
outline-offset: 2px;
padding: 0.875rem 1rem;
text-align: center;
text-decoration: none;
transform: translate3d(0, 0, 0);
transition-duration: 0.1s;
transition-duration: 250ms;
transition-property: transform, background-color, border-color, color, outline;
will-change: transform, background-color, border-color, color, outline;
}
.btn-primary:hover, .btn-primary:focus {
--btn-bg: var(--color-white);
--btn-border: var(--color-primary-500);
--btn-color: var(--color-primary-600);
outline: 0.25em solid rgba(0, 123, 255, 0.1);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.1);
outline-offset: 0;
transform: translate3d(0, -3px, 0);
}
.list-cards__people {
--list-grid-col: 1;
--list-grid-gap: 1.563rem;
}
.list-cards.list-cards__people {
display: grid;
grid-gap: var(--list-grid-gap);
grid-template-columns: repeat(var(--list-grid-col), minmax(auto, 400px));
justify-content: center;
list-style: none;
}
@media (min-width: 575px) {
.list-cards.list-cards__people {
grid-template-columns: repeat(var(--list-grid-col), 1fr);
}
.list-cards__people {
--list-grid-col: 2;
--list-grid-gap: 1.5rem;
}
}
@media (min-width: 768px) {
.list-cards__people {
--list-grid-col: 2;
--list-grid-gap: 1.5rem;
}
}
@media (min-width: 992px) {
.list-cards__people {
--list-grid-col: 3;
--list-grid-gap: 2rem;
}
}
@media (min-width: 1200px) {
.list-cards__people {
--list-grid-col: 3;
--list-grid-gap: 2.5rem;
}
}
@media (min-width: 1400px) {
.list-cards__people {
--list-grid-col: 3;
--list-grid-gap: 2rem;
}
}
.list-cards__people .list-card__item {
border-radius: 0.25rem;
position: relative;
transition-duration: 100ms;
transition-property: box-shadow, border-color, background-color;
}
.list-cards__people .list-card__article {
--btn-color: var(--color-slate-700);
--btn-hover-color: var(--color-primary-500);
--btn-border: var(--color-slate-300);
--btn-hover-border: var(--color-primary-500);
--btn-bg: var(--color-white);
--btn-hover-bg: rgba(var(--color-primary-500-rgb), .02);
--box-shadow: 0 0 0 0.25rem rgba(var(--color-primary-500-rgb), 0.25);
--divider-color: var(--color-white);
--bg-color: var(--color-white);
--h2-color: var(--color-slate-900);
--h2-i-color: var(--color-primary-500);
--h3-color: var(--color-slate-600);
--content-color: var(--color-slate-900);
--box-shadow-color: rgba(var(--color-primary-500-rgb), 0.25);
--btn-outline-color: rgba(var(--color-primary-500-rgb), 0.25);
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px;
cursor: pointer;
display: flex;
flex-direction: column;
height: 100%;
justify-content: flex-start;
outline-color: transparent;
outline-offset: 0.25em;
outline-style: solid;
outline-width: 0.25em;
padding: 12px;
transition-duration: 150ms, 150ms, 150ms;
transition-property: outline-offset, outline-color, border-color;
will-change: outline-offset, outline-color, border-color;
}
.list-cards__people .list-card__item:focus .list-card__article,
.list-cards__people .list-card__item:focus-within .list-card__article,
.list-cards__people .list-card__item:hover .list-card__article {
border-color: var(--border-color) !important;
outline-color: var(--box-shadow-color);
outline-offset: 0;
}
.list-cards__people .list-card__item:focus .list-card__btn,
.list-cards__people .list-card__item:focus-within .list-card__btn,
.list-cards__people .list-card__item:hover .list-card__btn {
background-color: var(--btn-hover-bg);
border-color: var(--border-color) !important;
color: var(--btn-hover-color);
outline-color: var(--btn-outline-color);
outline-offset: 0;
transform: translate3d(0, -3px, 0);
}
.list-cards__people .list-card__figure {
border-radius: 6px;
overflow: hidden;
position: relative;
}
.list-cards__people .list-card__figure .list-card__divider {
background-color: #FFFFFF;
background-color: var(--color-white);
bottom: -1px;
clip-path: ellipse(79% 27% at 71% 100%);
height: 50px;
left: 0;
pointer-events: none;
position: absolute;
width: 100%;
z-index: 1;
}
.list-cards__people .list-card__header {
background-color: #FFFFFF;
background-color: var(--color-white);
padding: 1rem 1rem 0;
}
.list-cards__people .list-card__footer {
padding: 0 1rem 1rem;
}
@media (min-width: 1100px) {
.list-cards__people .list-card__header {
padding: 2rem 2rem 0;
}
.list-cards__people .list-card__footer {
padding: 0 2rem 2rem;
}
}
.list-cards__people .list-card__header .list-card__h2 {
font-size: 1.25rem;
font-weight: 700;
letter-spacing: -0.025em;
line-height: 1.5;
}
.list-cards__people .list-card__header .list-card__h2 i {
color: var(--h2-i-color);
font-size: 1rem;
font-weight: 400;
letter-spacing: 0;
line-height: 1.5;
}
.list-cards__people .list-card__header .list-card__h3 {
color: #64748b;
color: var(--color-slate-500);
font-size: 1rem;
font-weight: 500;
line-height: 1.5;
}
@media (min-width: 1100px) {
.list-cards__people .list-card__header .list-card__h2 {
font-size: 1.424rem;
font-size: var(--rem-p3);
}
.list-cards__people .list-card__header .list-card__h3 {
font-size: 1.125rem;
font-size: var(--rem-p1);
}
}
.list-cards__people .list-card__header .list-card__content {
font-size: 0.875rem;
font-weight: 400;
letter-spacing: 0;
line-height: 1.5;
margin-top: 0.5rem;
}
@media (min-width: 1080px) {
.list-cards__people .list-card__header .list-card__content {
-webkit-box-orient: vertical;
color: #1e293b;
color: var(--color-slate-800);
display: -webkit-box;
font-size: 1rem;
-webkit-line-clamp: 4;
opacity: 0.65;
overflow: hidden;
transition-duration: 150ms;
transition-property: opacity;
will-change: opacity;
}
.list-cards__people article:hover .list-card__header .list-card__content {
opacity: 1;
}
}
.list-cards__people .list-card__btn {
background-color: var(--btn-bg);
border: 1px solid var(--btn-border);
border-radius: 0.25rem;
color: var(--btn-color);
display: block;
font-size: 1rem;
font-weight: 600;
letter-spacing: 0;
line-height: 1;
margin-top: var(--list-grid-gap);
outline-color: transparent;
outline-offset: 0.25em;
outline-style: solid;
outline-width: 0.25em;
padding: 0.875rem 1rem;
text-align: center;
text-decoration: none;
transform: translate3d(0, 0, 0);
transition-duration: 0.1s;
transition-duration: 250ms;
transition-property: transform, background-color, border-color, color, outline-offset, outline-color;
will-change: transform, background-color, border-color, color, outline-offset, outline-color;
}
.page-ambassadors .list-card__article .list-card__figure {
background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.65), transparent);
border-radius: 0.25rem 0.25rem 0 0;
min-height: 175px;
}
.page-ambassadors .list-card__article .list-card__figure .list-card__img {
transition-duration: 150ms;
transition-property: transform;
}
.list-card__article[data-theme] {
--box-shadow-color: rgba(var(--color-primary-500-rgb), 0.15);
--border-color: var(--color-primary-500);
--btn-hover-color: var(--color-primary-500);
--btn-outline-color: rgba(var(--color-primary-500-rgb), 0.25);
}
.list-card__article[data-theme] .list-card__figure {
background-color: #95c8ff;
background-color: var(--color-primary-200);
}
.list-card__article[data-theme] .list-card__divider {
-webkit-mask-size: 500% 50px;
}
.page-ambassadors .list-card__article[data-theme="1"] {
--box-shadow-color: rgba(var(--color-accent-2-500-rgb), 0.15);
--border-color: var(--color-accent-2-500);
--btn-hover-color: var(--color-accent-2-500);
--btn-outline-color: rgba(var(--color-accent-2-500-rgb), 0.25);
}
.page-ambassadors .list-card__article[data-theme="1"] .list-card__figure {
background-color: #F9BFD1;
background-color: var(--color-accent-2-100);
}
.page-ambassadors .list-card__article[data-theme="1"] .list-card__divider {
-webkit-mask-size: 600% 50px;
}
.page-ambassadors .list-card__article[data-theme="2"] {
--box-shadow-color: rgba(var(--color-accent-3-500-rgb), 0.15);
--border-color: var(--color-accent-3-500);
--btn-hover-color: var(--color-accent-3-500);
--btn-outline-color: rgba(var(--color-accent-3-500-rgb), 0.25);
}
.page-ambassadors .list-card__article[data-theme="2"] .list-card__figure {
background-color: #FFEFC1;
background-color: var(--color-accent-3-100);
}
.page-ambassadors .list-card__article[data-theme="2"] .list-card__divider {
-webkit-mask-size: 450% 50px;
}
.page-ambassadors .list-card__article[data-theme="3"] {
--box-shadow-color: rgba(var(--color-accent-1-500-rgb), 0.15);
--border-color: var(--color-accent-1-200);
--btn-hover-color: var(--color-accent-1-800);
--btn-outline-color: rgba(var(--color-accent-1-800-rgb), 0.25);
}
.page-ambassadors .list-card__article[data-theme="3"] .list-card__figure {
background-color: #FFD9C2;
background-color: var(--color-accent-1-100);
}
.page-ambassadors .list-card__article[data-theme="3"] .list-card__divider {
-webkit-mask-size: 350% 50px;
}
.profile-wrapper {
padding: 0 calc(1rem / 2);
padding: 0 calc(var(--gutter) / 2);
}
.profile-row {
margin-bottom: calc(2.074 * 1rem);
margin-bottom: var(--rem5);
}
.person-container__top {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid rgba(var(--page-primary-rgb), 0.5);
border-radius: 0.85rem;
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
margin-top: calc(1rem + 35px);
margin-top: calc(var(--rem1) + 35px);
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15);
padding: calc(1.728 * 1rem) calc(1.44 * 1rem);
padding: var(--rem4) var(--rem3);
position: relative;
}
.person-container__top::before {
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.15), #FFFFFF);
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.15), var(--color-white));
border-radius: 0.85rem;
content: "";
height: 50%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
@media (min-width: 992px) {
.person-container__top {
padding: calc(1.728 * 1rem) calc(1.728 * 1rem);
padding: var(--rem4) var(--rem4);
}
}
.person-container {
position: relative;
}
.person-container > div {
position: relative;
z-index: 1;
}
.person-box {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid rgba(var(--page-primary-rgb), 0.2);
border-radius: 0.85rem;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
box-shadow: var(--depth-3);
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
padding: 1rem;
}
@media (min-width: 992px) {
.person-box,.person-container__top {
grid-gap: calc(1.2 * 1rem);
grid-gap: var(--rem2);
padding: calc(1.2 * 1rem);
padding: var(--rem2);
}
.person-container__top {
align-items: center;
grid-template-columns: 200px 1fr;
margin-top: calc(1.2 * 1rem);
margin-top: var(--rem2);
}
}
.person-avatar {
--avatar-width: 150px;
--avatar-height: 150px;
background-color: #FFFFFF;
background-color: var(--color-white);
background-image: linear-gradient(45deg, rgba(var(--page-primary-rgb), 0.25), rgba(var(--page-primary-rgb), 0.35) 40%, #FFFFFF);
background-image: linear-gradient(45deg, rgba(var(--page-primary-rgb), 0.25), rgba(var(--page-primary-rgb), 0.35) 40%, var(--color-white));
border: 1px solid rgba(var(--page-primary-rgb), 0.5);
border-radius: 999em;
height: 150px;
height: var(--avatar-height);
margin: -75px auto 0;
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15);
overflow: hidden;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 150px;
width: var(--avatar-width);
}
@media (min-width: 992px) {
.person-avatar {
--avatar-width: 200px;
--avatar-height: 200px;
margin: 0;
}
}
.person-avatar img {
bottom: 0;
height: 100%;
left: 0;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: center;
object-position: center;
pointer-events: none;
position: absolute;
right: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
@keyframes avatarShine {
100% {
left: 125%;
}
}
.page-single-ambassador .person-avatar {
overflow: hidden;
position: relative;
}
.page-single-ambassador .person-avatar::before {
animation: avatarShine 0.85s;
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
content: "";
display: block;
height: 100%;
left: -75%;
opacity: 0.25;
position: absolute;
top: 0;
transform: skewX(-25deg);
width: 50%;
z-index: 2;
}
.page-single-ambassador .person-avatar img:nth-of-type(1) {
border-radius: 999em;
-o-object-fit: cover;
object-fit: cover;
position: relative;
z-index: 1;
}
.profile-meta,
.person-meta {
align-items: flex-end;
display: grid;
grid-gap: 1rem;
grid-gap: var(--gutter);
grid-template-columns: 1fr;
position: relative;
text-align: center;
z-index: 1;
}
@media (min-width: 992px) {
.profile-meta,
.person-meta {
align-items: center;
text-align: left;
}
}
.profile-meta .person-name,
.person-meta .person-name {
font: 600 calc(1.44 * 1rem) / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h3);
letter-spacing: -0.03em;
line-height: 1;
}
.profile-meta .person-name i,
.person-meta .person-name i {
color: #007bff;
color: var(--color-primary-500);
font-size: 80%;
}
.profile-meta .profile-title,
.profile-meta .person-title,
.person-meta .profile-title,
.person-meta .person-title {
align-items: center;
display: flex;
font: 500 1rem / 1.2 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-h5);
font-weight: 500;
justify-content: center;
line-height: 1;
margin-top: 0.25em;
opacity: 0.6;
}
.profile-meta .profile-title i,
.profile-meta .person-title i,
.person-meta .profile-title i,
.person-meta .person-title i {
color: #007bff;
color: var(--color-primary-500);
font-size: 1rem;
margin-right: 0.25em;
}
.profile-meta .profile-intro,
.profile-meta .person-intro,
.person-meta .profile-intro,
.person-meta .person-intro {
font: var(--type-p-sm);
margin: calc(1.44 * 1rem) auto 0;
margin: var(--rem3) auto 0;
max-width: 400px;
}
@media (min-width: 1190px) {
.profile-meta .person-title,
.person-meta .person-title {
justify-content: flex-start;
}
.profile-meta .person-intro,
.person-meta .person-intro {
margin-bottom: 0;
margin-left: 0;
max-width: 39em;
}
}
.person-social {
align-items: center;
display: flex;
grid-gap: 9px;
}
@media (max-width: 992px) {
.person-social {
justify-content: center;
}
}
.person-social a {
align-items: center;
border-radius: 0.25rem;
color: #475569;
color: var(--color-slate-600);
display: flex;
height: 22px;
justify-content: center;
outline: 2px solid rgba(var(--page-primary-rgb), 0);
outline-offset: 0.25rem;
transition-duration: 200ms;
transition-property: outline, outline-offset, outline-color, color, background-color, opacity;
width: 22px;
will-change: outline, outline-offset, outline-color, color, background-color, opacity;
}
.person-social a:hover {
color: rgba(var(--page-primary-rgb), 1);
outline: 3px solid rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
}
.person-social a:focus {
outline: 3px solid rgba(var(--page-primary-rgb), 0.05);
outline-offset: 0;
}
.person-social a i {
font-size: 22px;
}
.person-about-container {
align-items: flex-start;
display: grid;
grid-template-columns: 1fr;
justify-content: center;
}
.person-quote {
line-height: 1.414;
margin: 0 auto;
position: relative;
}
.person-quote cite {
font-style: normal;
}
.person-bio .person-quote {
font-size: 1.125rem;
margin: 0 0;
max-width: 39em;
padding: 1.563rem;
position: relative;
}
.person-quote i {
color: #80bdff;
color: var(--page-primary-hex);
display: block;
float: right;
font-size: 30px;
padding-left: 1rem;
}
.person-bio p,
.person-testimonial p {
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
}
.person-container-grid {
align-items: flex-start;
display: grid;
grid-gap: 2rem;
grid-template-columns: 1fr;
}
@media (min-width: 992px) {
.person-container-grid {
grid-template-columns: 1fr 1fr;
}
}
.person-video {
border-radius: 6px;
overflow: hidden;
}
.person-fact {
align-items: center;
display: grid;
grid-template-columns: max-content 1fr;
justify-content: center;
position: relative;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
}
.person-fact:last-child {
margin-bottom: 0;
}
.person-fact .person-header {
align-items: center;
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.05), rgba(var(--page-primary-rgb), 0.1));
border-radius: 14px;
display: flex;
height: 42px;
justify-content: center;
max-width: 39em;
padding: 0 1rem;
position: relative;
width: 42px;
}
.person-fact .person-header::after {
border-bottom: 6px solid transparent;
border-left: 6px solid rgba(var(--page-primary-rgb-lighter), 0.07);
border-top: 6px solid transparent;
content: "";
height: 0;
position: absolute;
right: -6px;
top: 11px;
width: 0;
}
.person-fact .person-fact__icon {
align-items: center;
color: #80bdff;
color: var(--page-primary-hex);
display: flex;
font-size: 20px;
justify-content: center;
}
.person-fact .person-fact__title {
color: rgba(var(--page-primary-rgb), 1);
font-size: 13px !important;
line-height: 1;
margin-bottom: 0;
margin-top: 0;
text-transform: uppercase;
}
.person-fact .person-fact__content {
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.05), rgba(var(--page-primary-rgb), 0.1));
border: 1px solid rgba(var(--page-primary-rgb), 0.25);
border-radius: 12px;
box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px;
margin-left: 12px;
max-width: 475px;
padding: 1rem;
padding: var(--rem1);
}
.person-fact .person-fact__content p {
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
margin-top: 0.25em;
max-width: 475px;
}
.article-card__list {
display: grid;
gap: calc(0.579 * 1rem);
gap: calc(var(--scale-n3) * 1rem);
grid-gap: calc(0.579 * 1rem);
grid-gap: calc(var(--scale-n3) * 1rem);
}
@media (min-width: 992px) {
.article-card__list {
gap: calc(1 * 1rem);
gap: calc(var(--scale-p1) * 1rem);
}
}
.article-card__list article {
align-items: center;
background-color: white;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 6px;
display: grid;
grid-template-columns: max-content 1fr;
outline: 0.25em solid transparent;
overflow: hidden;
padding: calc(0.694 * 1rem);
padding: calc(var(--scale-n2) * 1rem);
position: relative;
transition-duration: 200ms;
}
@media (min-width: 992px) {
.article-card__list article {
padding: calc(0.579 * 1rem);
padding: calc(var(--scale-n3) * 1rem);
}
}
.article-card__list article a {
bottom: 0;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.article-card__list article[aria-hidden=true] {
display: none;
}
.article-card__list article:hover, .article-card__list article:focus, .article-card__list article:focus-within {
border-color: #80bdff;
border-color: var(--page-primary-hex);
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
outline-color: rgba(var(--page-primary-rgb), 0.15);
outline-offset: 0;
transform: translateY(-0.25rem);
}
.article-card__list article .article-image {
border-radius: 4px;
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
height: 60px;
overflow: hidden;
position: relative;
width: 60px;
}
.article-card__list article .article-image svg {
color: rgba(255, 255, 255, 0.75);
display: block;
height: 32px;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 32px;
}
.article-card__list article .article-image img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
}
.article-card__list article .article-image i {
align-items: center;
bottom: 0;
color: #FFFFFF;
color: var(--color-white);
display: flex;
font-size: 30px;
height: 100%;
justify-content: center;
left: 0;
opacity: 0.85;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
@media (min-width: 992px) {
.article-card__list article .article-image {
height: 80px;
width: 80px;
}
}
.article-card__list .article-content {
padding-left: 14px;
}
.article-card__list .article-title {
font: 400 1rem / 1.44 "webfont", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
font: var(--type-p);
font-weight: 600;
line-height: 1.2;
line-height: var(--scale-p2);
}
.article-card__list .article-title span.clamp {
-webkit-box-orient: vertical;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
}
.article-card__list .article-title-text {
align-items: center;
display: flex;
}
.article-card__list .article-title-text i {
color: #007bff;
color: var(--color-primary-500);
font-size: 80%;
margin-left: 0.25rem;
}
@media (min-width: 992px) {
.article-card__list .article-title-text {
padding-right: 3rem;
}
}
@media (max-width: 768px) {
.article-card__list .article-title-text {
font-size: 16px;
padding-right: 2rem;
}
}
.article-card__list .article-title-label {
background-color: rgba(var(--page-primary-rgb), 0.05);
border-radius: 0.35rem;
color: #80bdff;
color: var(--page-primary-hex);
font-size: 13px;
padding: 2px 0.75rem;
position: absolute;
right: 1rem;
top: 1rem;
}
.article-card__list .article-date {
color: #64748b;
color: var(--color-slate-500);
display: block;
font-size: 14px;
font-weight: 300;
margin: 0.25em 0;
}
.article-card__list .article-excerpt {
-webkit-box-orient: vertical;
display: -webkit-box;
-webkit-line-clamp: 2;
margin-top: 0.25em;
max-width: 90%;
overflow: hidden;
}
@media (min-width: 992px) {
.article-card__list .article-excerpt {
color: #475569;
color: var(--color-slate-600);
}
}
@media (max-width: 768px) {
.article-card__list .article-excerpt {
display: none;
}
}
.profile-container__top {
background-color: #FFFFFF;
background-color: var(--color-white);
background-image: linear-gradient(to bottom, rgba(var(--page-primary-rgb), 0.15) 10%, rgba(var(--page-primary-rgb), 0.01), white);
border: 1px solid rgba(var(--page-primary-rgb), 0.5);
border-radius: 6px;
display: grid;
grid-gap: 1rem;
grid-gap: var(--gutter);
grid-template-columns: 1fr;
margin-top: calc(4rem + 35px);
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.15);
padding: 0 1.953rem;
position: relative;
}
@media (max-width: 991.98px) {
.profile-container__top {
margin-left: 1rem;
margin-right: 1rem;
}
}
@media (min-width: 992px) {
.profile-container__top {
align-items: center;
grid-template-columns: 200px 1fr;
margin-top: 0;
}
}
.profile-container,
.profile-container > div {
position: relative;
}
.profile-container > div {
z-index: 1;
}
.profile-box {
display: grid;
grid-gap: 1rem;
grid-gap: var(--gutter);
grid-template-columns: 1fr;
}
@media (min-width: 992px) {
.profile-col:last-of-type {
align-self: flex-end;
justify-self: flex-end;
width: 100%;
}
}
.profile-avatar {
--avatar-width: 150px;
--avatar-height: 150px;
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid rgba(var(--page-primary-rgb), 0.5);
border-radius: 12px;
height: 150px;
height: var(--avatar-height);
margin: -75px auto 0;
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.05);
overflow: hidden;
position: relative;
width: 150px;
width: var(--avatar-width);
}
@media (min-width: 992px) {
.profile-avatar {
--avatar-width: 200px;
--avatar-height: 200px;
border: 1px solid rgba(var(--page-primary-rgb), 0.25);
margin: 0;
}
}
.profile-avatar img {
bottom: 0;
height: 100%;
left: 0;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: center;
object-position: center;
pointer-events: none;
position: absolute;
right: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.page-single-partner .profile-avatar img {
height: 50%;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
width: 50%;
}
.page-single-partner .profile-avatar img[src*="urbandecay.svg"] {
width: 80%;
}
.profile-name {
font-size: 1.424rem;
font-weight: bold;
letter-spacing: -0.03em;
}
@media (min-width: 1100px) {
.profile-name {
font-size: 1.953rem;
}
}
.profile-title {
align-items: center;
display: flex;
font-weight: 500;
justify-content: center;
margin-top: 0.25em;
}
.profile-title i {
color: #80bdff;
color: var(--page-primary-hex);
font-size: 85%;
margin-right: 0.25em;
}
@media (min-width: 992px) {
.profile-title {
justify-content: flex-start;
}
}
.profile-intro {
font: var(--type-p-sm);
margin: 0.5em auto 0;
max-width: 400px;
}
.profile-gallery > div {
margin: 0 auto;
min-height: 250px;
position: relative;
width: 100%;
}
@media (max-width: 768px) {
.profile-gallery > div {
left: 50%;
margin: 0 auto;
min-height: 110px;
position: relative;
transform: scale(0.75) translateY(45px) translateX(-65%) rotate(0deg);
transform-origin: center;
width: 100%;
z-index: 5;
}
.profile-gallery > div > div {
aspect-ratio: 1/1;
overflow: hidden;
}
.profile-gallery > div > div.is-ready:nth-of-type(1) {
transform: translate(-165px, -90px) scale(0.75) rotate(-3deg);
}
.profile-gallery > div > div.is-ready:nth-of-type(2) {
transform: translate(-25px, -90px) scale(0.75) rotate(3deg);
}
.profile-gallery > div > div:nth-of-type(3) {
display: none;
}
}
.profile-gallery > div > div {
aspect-ratio: 3/4;
border: 1px solid rgba(var(--page-primary-rgb), 1);
border-radius: 8px;
height: 195px;
left: 50%;
max-height: 195px;
max-width: 195px;
min-height: 195px;
min-width: 195px;
outline: 0.25em solid rgba(var(--page-primary-rgb), 0.25);
overflow: hidden;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
transition-duration: 150ms;
transition-property: top, left, right, bottom, transform;
width: 195px;
will-change: top, left, right, bottom, transform;
}
.profile-gallery > div > div img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
pointer-events: none;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
width: 100%;
}
.profile-gallery > div > div div {
transform: translate(-50%, -50%) scale(0) rotate(0);
transition-duration: 250ms;
transition-property: transform;
will-change: transform;
}
.profile-gallery > div > div.is-ready:nth-of-type(1) {
transform: translate(-20px, -165px) scale(0.7) rotate(-2deg);
transition-delay: 150ms;
}
.profile-gallery > div > div.is-ready:nth-of-type(2) {
transform: translate(-70px, -43px) scale(0.73) rotate(2deg);
transition-delay: 250ms;
transform: translate(-170px, -70px) scale(0.8) rotate(-6deg);
transition-delay: 100ms;
}
.profile-gallery > div > div.is-ready:nth-of-type(4) {
background-image: linear-gradient(69deg, rgba(var(--page-primary-rgb), 0.7), rgba(var(--page-primary-rgb), 0.25) 90%);
border-radius: 30% 70% 70% 30%/30% 30% 70% 70%;
transform: translate(-95px, -110px) scale(1) rotate(-3deg);
transition-delay: 300ms;
}
@media (min-width: 992px) {
.profile-gallery > div > div.is-ready:nth-of-type(1) {
transform: translate(9px, -165px) scale(0.9) rotate(4deg);
}
.profile-gallery > div > div.is-ready:nth-of-type(2) {
transform: translate(-195px, -68px) scale(0.95) rotate(-4deg);
}
}
@media (max-width: 992px) {
.profile-gallery > div > div.is-ready:nth-of-type(4) {
border-radius: 999em 45em 200em 70em;
height: 100%;
max-width: 100%;
transform: translate(-50%, -50%) scale(0.85) rotate(-3deg);
width: 100%;
}
}
.profile-gallery[data-gallery-count="1"] > div > div.is-ready:nth-of-type(1) {
transform: translate(-97px, -103px) scale(1.35) rotate(2deg);
}
.profile-gallery[data-gallery-count="2"] > div > div.is-ready:nth-of-type(1) {
transform: translate(-20px, -133px) scale(1) rotate(6deg);
}
.profile-gallery[data-gallery-count="2"] > div > div.is-ready:nth-of-type(2) {
transform: translate(-185px, -72px) scale(1) rotate(-6deg);
}
@media (max-width: 991.98px) {
.profile-gallery[data-gallery-count="2"] {
margin-top: -30px;
}
.profile-gallery[data-gallery-count="2"] > div > div.is-ready:nth-of-type(1) {
transform: translate(-15px, -90px) scale(0.75) rotate(6deg);
}
.profile-gallery[data-gallery-count="2"] > div > div.is-ready:nth-of-type(2) {
transform: translate(-165px, -90px) scale(0.75) rotate(-6deg);
}
}
.profile-social {
align-items: center;
display: flex;
grid-gap: 4px;
justify-content: center;
}
@media (min-width: 992px) {
.profile-social {
justify-content: flex-start;
}
}
.profile-social a {
align-items: center;
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 3px;
color: #334155;
color: var(--color-slate-700);
display: flex;
height: 26px;
justify-content: center;
transition-duration: 250ms;
transition-property: box-shadow, border-color, color;
width: 26px;
}
.profile-social a:hover, .profile-social a:focus {
border-color: #94a3b8;
border-color: var(--color-slate-400);
color: #0f172a;
color: var(--color-slate-900);
}
.profile-social a i {
font-size: 85%;
}
.profile-meta {
align-items: flex-end;
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
position: relative;
text-align: center;
z-index: 1;
}
@media (min-width: 992px) {
.profile-meta {
align-items: center;
grid-gap: 1.563rem;
grid-template-columns: 1fr 300px;
text-align: left;
}
}
.profile-meta .profile-name {
font-size: 1.728rem;
font-weight: bold;
letter-spacing: -0.03em;
line-height: 1;
}
.profile-meta .profile-name i {
color: #007bff;
color: var(--color-primary-500);
font-size: 80%;
}
.profile-meta .profile-title {
align-items: center;
display: flex;
font-size: 1.2rem;
font-weight: 500;
justify-content: center;
line-height: 1;
margin-top: 0.25em;
}
.profile-meta .profile-title i {
color: #007bff;
color: var(--color-primary-500);
font-size: 1rem;
margin-right: 0.25em;
}
.profile-meta .profile-intro {
max-width: 400px;
}
@media (min-width: 992px) {
.profile-meta .profile-name {
font-size: 1.728rem;
}
.profile-meta .profile-title {
font-size: 1.2rem;
justify-content: flex-start;
}
.profile-meta .profile-intro {
margin-bottom: 0;
margin-left: 0;
max-width: 460px;
}
}
.profile-about-container {
align-items: flex-start;
display: grid;
grid-template-columns: 1fr;
justify-content: center;
}
.profile-quote {
line-height: 1.414;
margin: 0 auto;
position: relative;
}
.profile-quote cite {
font-style: normal;
}
.profile-container-grid {
align-items: flex-start;
display: grid;
grid-gap: 1rem;
grid-template-columns: 1fr;
}
@media (min-width: 1200px) {
.profile-container-grid {
grid-gap: 2.441rem;
grid-template-columns: 1fr 375px;
}
}
.profile-overview:not(:first-child) {
margin-top: 1.5rem;
}
.profile-video {
border-radius: 8px;
overflow: hidden;
}
.page-single-campaign .campaign-pullquote {
border-left: 2px solid rgba(var(--page-primary-rgb), 0.25);
margin-top: 2rem;
padding: 1rem 1rem 1rem 2.25rem;
position: relative;
}
.page-single-campaign .campaign-pullquote p {
margin: 0;
padding-right: 2rem;
}
.page-single-campaign .campaign-pullquote cite {
display: block;
margin-top: 0.5rem;
}
.page-single-campaign .campaign-pullquote i {
color: #80bdff;
color: var(--page-primary-hex);
font-size: 1.563rem;
position: absolute;
right: 1rem;
top: 0rem;
}
.page-single-campaign .campaign-pullquote:not(:last-child) {
margin-bottom: 2rem;
}
.page-single-campaign .tabs__content article:not([data-paginate-item]) p strong {
font-weight: 500;
}
.page-single-campaign .tabs__content article:not([data-paginate-item]) p:not(:last-child) {
margin-bottom: 1em;
}
.page-single-campaign .tabs__content article:not([data-paginate-item]) ol:not(:last-child),
.page-single-campaign .tabs__content article:not([data-paginate-item]) ul:not(:last-child) {
margin-bottom: 1.563em;
}
.page-single-campaign .tabs__content article:not([data-paginate-item]) p,
.page-single-campaign .tabs__content article:not([data-paginate-item]) ol,
.page-single-campaign .tabs__content article:not([data-paginate-item]) ul {
font-size: 1.125rem;
line-height: 1.414;
}
.page-single-campaign .tabs__content article:not([data-paginate-item]) ol,
.page-single-campaign .tabs__content article:not([data-paginate-item]) ul {
line-height: 1.563;
margin: 0;
max-width: 39.292em;
max-width: var(--site-max-length);
position: relative;
}
.page-single-campaign .tabs__content article:not([data-paginate-item]) ol > li,
.page-single-campaign .tabs__content article:not([data-paginate-item]) ul > li {
padding-left: 1rem;
}
.page-single-campaign [data-category=media] ul,
.page-single-campaign [data-category=awards] ul {
-moz-column-count: 2;
column-count: 2;
-moz-column-gap: 1.563rem;
column-gap: 1.563rem;
}
.page-single-campaign [data-category=impact] ul li {
align-items: baseline;
display: flex;
grid-gap: 10px;
padding-left: 0 !important;
}
.page-single-campaign [data-category=impact] ul li i {
color: #80bdff;
color: var(--page-primary-hex);
position: relative;
top: 4px;
}
@media (min-width: 1100px) {
.page-single-campaign [data-category=media] ul,
.page-single-campaign [data-category=awards] ul {
line-height: 1.615;
}
}
.page-single-campaign [data-title=Credits] p {
align-items: center;
display: flex;
flex-wrap: nowrap;
grid-gap: 0.25em;
margin: 0;
padding-left: 0 !important;
padding-right: 1rem;
}
.page-single-campaign [data-title=Credits] p strong {
font-weight: 500;
margin-right: 0.5rem;
min-width: 130px;
padding-bottom: 1.563rem;
padding-left: 1rem;
padding-right: 1rem;
padding-top: 1.563rem;
}
.page-single-campaign [data-title=Credits] p.ambassador-links strong {
display: block;
font-weight: 500;
}
.page-single-campaign .ambassador-link,
.page-single-campaign .partners-link {
align-items: center;
display: inline-flex;
}
.page-single-campaign .partners-link {
display: inline-block;
}
.page-single-campaign .partners-link img {
height: auto;
max-height: 40px;
max-width: 100px;
width: 100%;
}
.page-single-campaign .ambassador-link[data-theme] {
background-color: rgba(var(--page-primary-rgb), 0.25);
border-color: rgba(var(--page-primary-rgb), 0.5);
}
.page-single-campaign .ambassador-link[data-theme]:hover,
.page-single-campaign .ambassador-link[data-theme]:focus {
background-color: rgba(var(--page-primary-rgb), 0.5);
border-color: rgba(var(--page-primary-rgb), 0.75);
}
.page-single-campaign .ambassador-link[data-theme] img {
background-color: #80bdff;
background-color: var(--page-primary-hex);
outline: 3px solid rgba(var(--page-primary-rgb), 0.5);
}
.page-single-campaign .ambassador-links-list {
display: flex;
flex-wrap: wrap;
grid-gap: 0.5rem;
padding: 1rem 0;
}
.page-single-campaign .ambassador-link {
border: 1px solid #cbd5e1;
border: 1px solid var(--color-slate-300);
border-radius: 2.75rem;
font-weight: 500;
padding: 5px;
padding: 3px 13px 3px 3px;
transition-duration: 150ms;
transition-property: box-shadow, background-color, border-color;
}
.page-single-campaign .ambassador-link:hover,
.page-single-campaign .ambassador-link:focus {
box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}
.page-single-campaign .ambassador-link img {
background-color: #F79F76;
background-color: var(--color-accent-1-500);
border-radius: 999em;
height: 35px;
margin-right: 0.5rem;
outline: 3px solid rgba(247, 159, 118, 0.5);
outline: 3px solid rgba(var(--color-accent-1-500-rgb), 0.5);
width: 35px;
}
.byline-partner {
color: #334155;
color: var(--color-slate-700);
font-size: 1.2rem;
font-weight: 500;
letter-spacing: -0.01em;
margin-top: 0.5rem;
}
.byline-partner i {
color: #007bff;
color: var(--color-primary-500);
font-size: 80%;
}
.animated-visual #animatedVisualMain,
.animated-visual #animatedVisualCircle,
.animated-visual #animatedVisualCircleStroke,
.animated-visual #animatedVisualSquare {
pointer-events: none;
position: absolute;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: -1;
}
.grid-visual--container {
position: relative;
}
.grid-visual--caption {
display: none;
}
.animated-visual #animatedVisualBg {
animation: animateVisualBgExpand 0.5s ease-in forwards;
height: 100%;
margin: 0 auto;
width: 95%;
}
.animated-visual #animatedVisualCircle {
animation: animateVisualDown 1s 0.5s cubic-bezier(0.17, 0.67, 0.53, 0.85) forwards;
height: 15%;
left: 20%;
opacity: 0;
top: -25%;
width: 15%;
}
.animated-visual #animatedVisualSquare {
animation: animateVisualUp 1s 0.65s cubic-bezier(0.17, 0.67, 0.53, 0.85) forwards;
height: 20%;
opacity: 0;
right: -20%;
top: -5%;
width: 20%;
}
.animated-visual #animatedVisualCircleStroke {
animation: animateVisualLeft 0.25s 0.25s ease forwards;
left: -10%;
opacity: 0;
top: 25%;
width: 35%;
}
.animated-visual #animatedVisualMain {
animation: animateVisualMainExpand 0.5s 0.5s ease forwards;
bottom: 0;
left: 51%;
opacity: 0;
opacity: 0;
transform: translateX(-50%);
width: 52%;
z-index: 1;
}
.animated-visual #animatedVisualMain {
bottom: -20px;
left: 50%;
transform: translateX(-50%);
width: 75%;
z-index: 1;
}
.list-helplines--filters {
display: flex;
flex-direction: row;
justify-content: space-between;
width: 100%;
}
@media (max-width: 768px) {
.list-helplines--filters {
display: none;
}
}
.helpline-filters--left,
.helpline-filters--right {
align-items: center;
display: flex;
grid-gap: 1rem;
justify-content: center;
}
.helpline-filter--header {
align-items: center;
border-radius: 4px;
cursor: not-allowed;
display: flex;
flex-direction: row;
justify-content: flex-start;
opacity: 0.5;
overflow: hidden;
padding: 0;
}
.helpline-filter--icon {
align-items: center;
color: rgba(100, 116, 139, 0.3);
color: rgba(var(--color-slate-500-rgb), 0.3);
display: flex;
height: 42px;
justify-content: center;
margin-left: 12px;
width: 42px;
}
.helpline-filter--header:not(.is-active) {
background-image: linear-gradient(45deg, rgba(100, 116, 139, 0.04), white);
background-image: linear-gradient(45deg, rgba(var(--color-slate-500-rgb), 0.04), white);
border: 1px solid rgba(100, 116, 139, 0.3);
border: 1px solid rgba(var(--color-slate-500-rgb), 0.3);
box-shadow: inset 0 0 0 3px rgba(100, 116, 139, 0.05);
box-shadow: inset 0 0 0 3px rgba(var(--color-slate-500-rgb), 0.05);
}
.helpline-filter--header:not(.is-active) .helpline-filter--icon {
background-image: linear-gradient(45deg, rgba(100, 116, 139, 0.08), white);
background-image: linear-gradient(45deg, rgba(var(--color-slate-500-rgb), 0.08), white);
border-left: 1px solid rgba(100, 116, 139, 0.3);
border-left: 1px solid rgba(var(--color-slate-500-rgb), 0.3);
}
.helpline-filter--header.is-active {
background-image: linear-gradient(45deg, rgba(var(--color-primary), 0.04), white);
border: 1px solid rgba(var(--color-primary), 0.3);
box-shadow: inset 0 0 0 3px rgba(var(--color-primary), 0.05);
}
.helpline-filter--header.is-active .helpline-filter--icon {
background-image: linear-gradient(45deg, rgba(var(--color-primary), 0.08), white);
border-left: 1px solid rgba(var(--color-primary), 0.3);
color: rgba(var(--color-primary), 1);
}
.helpline-filter--title {
font: 500 1rem/0.889 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 500 1rem/0.889 var(--font-heading);
padding: 0 0 0 1rem;
}
[data-article] .list-helplines {
--color-primary: var(--color-accent-3-800-rgb);
align-items: flex-start;
display: grid;
grid-gap: 2rem;
grid-template-columns: repeat(2, 1fr);
justify-content: flex-start;
list-style: none;
margin: 0;
}
@media (max-width: 768px) {
[data-article] .list-helplines {
grid-template-columns: repeat(1, 1fr);
}
}
[data-article] .list-helpline--card {
background-color: #FFFFFF;
background-color: var(--color-white);
background-image: linear-gradient(-180deg, #FFFFFF 30%, rgba(var(--color-primary), 0.02));
background-image: linear-gradient(-180deg, var(--color-white) 30%, rgba(var(--color-primary), 0.02));
border: 1px solid rgba(var(--color-primary), 0.15);
border-radius: 0.35em;
box-shadow: inset 0 0 0 0.35em rgba(var(--color-primary), 0.015);
height: 100%;
max-width: 100%;
padding: 1.266rem 1.802rem;
padding: var(--rem-p2) var(--rem-p5);
position: relative;
}
[data-article] .list-helpline--card:hover {
--color-primary: var(--color-primary-800-rgb);
background-image: linear-gradient(-180deg, #FFFFFF 30%, rgba(8, 39, 72, 0.02));
background-image: linear-gradient(-180deg, var(--color-white) 30%, rgba(var(--color-primary), 0.02));
border: 1px solid rgba(8, 39, 72, 0.3);
border: 1px solid rgba(var(--color-primary), 0.3);
box-shadow: 0 0 0 0.25em rgba(8, 39, 72, 0.1), inset 0 0 0 0.35em rgba(8, 39, 72, 0.015);
box-shadow: 0 0 0 0.25em rgba(var(--color-primary), 0.1), inset 0 0 0 0.35em rgba(var(--color-primary), 0.015);
}
[data-article] .list-helpline--card:first-child {
margin-top: 0;
}
[data-article] .list-helpline--verified {
color: rgba(var(--color-primary), 0.35);
font-size: 24px;
position: absolute;
right: 2rem;
top: 2rem;
}
[data-article] .list-helpline--card h2 {
font: 500 1.266rem/1.402 "webfont", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
font: 500 1.266rem/1.402 var(--font-heading);
margin-bottom: 1rem;
margin-top: 0;
}
[data-article] .list-helpline--card h2 span {
max-width: 60%;
text-decoration: underline;
text-decoration-color: rgba(var(--color-primary), 0.3);
-webkit-text-decoration-skip: ink;
text-decoration-skip-ink: auto;
text-decoration-style: solid;
text-decoration-thickness: 1px;
text-underline-offset: 1px;
text-underline-position: from-font;
}
[data-article] .list-helpline--meta {
display: flex;
flex-direction: column;
}
[data-article] .list-helpline--card a i {
margin-right: 7px;
}
[data-article] .helpline-card--url a,
[data-article] .helpline-card--num a,
[data-article] .helpline-card--sms a {
align-items: center;
color: #1e293b;
color: var(--color-slate-800);
display: flex;
justify-content: start;
}
[data-article] .helpline-card--url span,
[data-article] .helpline-card--num span,
[data-article] .helpline-card--sms span {
display: inline-block;
font-feature-settings: "kern" 0, "liga" 0, "calt" 0, "pnum" 0, "tnum" 0, "onum" 0, "lnum" 0, "dlig" 0;
max-width: 160px;
overflow: hidden;
text-overflow: ellipsis;
}
[data-article] .helpline-card--url,
[data-article] .helpline-card--num:not(:last-child) {
margin-bottom: 12px;
}
:root {
--card-thumbnail-height: 375px;
--card-padding: 2rem;
--card-title-fs: 1.25rem;
--card-tag-fs: 0.8rem;
}
.carousel-container[data-size=sm] {
--card-thumbnail-height: 390px;
--card-padding: 1rem;
--card-tag-fs: 11px;
--card-title-fs: 1rem;
}
.carousel-container[data-size=md] {
--card-thumbnail-height: 410px;
--card-padding: 1.5rem;
--card-tag-fs: 1.414rem;
--card-title-fs: 1rem;
}
.carousel-container--title {
text-align: center;
}
.carousel-container--title h2 {
font-size: 16px;
letter-spacing: 1px;
text-transform: uppercase;
}
.carousel-container {
overflow: auto;
width: 100%;
}
.carousel-container--track {
margin-top: 2rem;
overflow: hidden;
width: 100%;
}
.carousel-container--items {
display: flex;
list-style: none;
margin: 0 auto;
-ms-overflow-style: none;
overflow-x: scroll;
overflow-y: hidden;
position: relative;
scroll-behavior: smooth;
scroll-snap-type: x mandatory;
scrollbar-width: none;
}
.carousel-container--items::-webkit-scrollbar {
display: none;
}
.carousel-container--item {
border: 1px solid;
border-radius: 4px;
flex: 0 0 280px;
margin: 1rem;
overflow: hidden;
position: relative;
scroll-snap-align: center;
transition: outline-offset 0.15s ease-in-out, outline 0.15s ease, box-shadow 0.25s ease-in-out, border-color 0.25s ease-in-out;
width: 280px;
}
.carousel-container--item__placeholder {
display: flex;
flex-basis: calc(25% - 140px);
flex-grow: 0;
flex-shrink: 0;
min-width: calc(25% - 140px);
visibility: hidden;
}
.carousel-container--item__link {
color: currentColor;
display: flex;
flex-direction: column;
height: 100%;
justify-content: space-between;
min-height: 375px;
min-height: var(--card-thumbnail-height);
text-decoration: none;
width: 100%;
}
.carousel-item--thumbnail,
.carousel-item--thumbnail figure,
.carousel-item--thumbnail picture {
height: 375px;
height: var(--card-thumbnail-height);
margin: 0;
overflow: hidden;
position: relative;
width: 100%;
}
.carousel-item--thumbnail figure::after {
background-color: #FFF;
bottom: -1px;
clip-path: ellipse(90% 105% at 12% 125%);
content: "";
height: 100px;
left: -9px;
pointer-events: none;
position: absolute;
width: calc(100% + 2px);
z-index: 1;
z-index: 0;
}
[data-shape="1"] .carousel-item--thumbnail figure {
border-radius: 0% 0% 80% 20%/30% 30% 40% 70%;
box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
}
[data-shape="2"] .carousel-item--thumbnail figure {
border-radius: 0% 0% 80% 20%/60% 70% 40% 40%;
box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
}
.carousel-item--thumbnail picture img {
aspect-ratio: 3/4;
display: block;
height: auto;
height: 100%;
margin: 0 auto;
max-width: 150%;
min-height: 375px;
min-height: var(--card-thumbnail-height);
-o-object-fit: cover;
object-fit: cover;
padding: 10px;
width: 100%;
}
.carousel-item--meta {
display: flex;
flex-direction: column;
justify-content: space-between;
min-height: calc(375px - 120px);
min-height: calc(var(--card-thumbnail-height) - 120px);
padding: 2rem;
padding: var(--card-padding);
position: relative;
}
.carousel-item--header {
position: relative;
top: -60px;
}
.carousel-item--header__title {
display: inline-block;
font-size: 1.25rem;
font-size: var(--card-title-fs);
font-weight: 700;
line-height: 1.125;
}
.carousel-item--header__title i {
color: #007bff;
color: var(--color-primary-500);
font-size: 80%;
}
.carousel-item--header__category {
color: #475569;
color: var(--color-slate-600);
font-size: 0.8rem;
font-size: var(--card-tag-fs);
font-weight: 500;
margin: 0 0 0.512rem;
}
.carousel-item--header__description {
color: #475569;
color: var(--color-slate-600);
font-size: 1rem;
font-weight: 400;
line-height: 1.563;
margin: 1.563rem 0 0.512rem;
}
@media (min-width: 768px) {
.carousel-item--header__category {
font-size: 1rem;
}
.carousel-item--header__title {
font-size: 1.25rem;
}
}
@media (min-width: 992px) {
.carousel-item--header__category {
font-size: 1.125rem;
}
.carousel-item--header__title {
font-size: 1.5rem;
}
}
.carousel-item--footer {
display: flex;
font-size: 0.8rem;
font-weight: 400;
line-height: 1;
margin-top: 1rem;
}
.carousel-item--footer__author {
display: none;
}
.carousel-item--footer__author span:nth-child(n+2):before {
content: "&";
margin-right: 0.25rem;
}
.carousel-picture--icon {
background-color: #FFFFFF;
background-color: var(--color-white);
border: 1px solid;
border-radius: 3px;
height: 42px;
left: 1rem;
position: absolute;
top: 1rem;
transition: box-shadow 0.2s ease;
width: 42px;
}
.carousel-picture--icon,.carousel-container--item:hover {
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}
.carousel-picture--icon svg {
display: block;
height: 24px;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
transition: all 0.1s ease;
width: 24px;
}
.carousel-picture--wave {
bottom: -10px;
content: "";
height: 42px;
left: 50%;
position: absolute;
right: 0;
transform: translateX(-50%);
width: 100%;
}
.carousel-item--icon {
bottom: 2rem;
display: block;
fill: currentColor;
height: 16px;
position: absolute;
right: 2rem;
transition: all 0.25s ease;
width: 16px;
}
@media (min-width: 576px) {
.carousel-container--item {
width: 310px;
}
.carousel-container--item__placeholder {
flex-basis: calc(25% - 240px);
flex-grow: 0;
flex-shrink: 0;
min-width: calc(25% - 240px);
}
}
@media (min-width: 1100px) {
.carousel-container--item {
flex: 0 0 400px;
width: 400px;
}
.carousel-container--item__link {
min-height: 375px;
min-height: var(--card-thumbnail-height);
}
.carousel-item--meta {
min-height: calc(375px - 375px);
min-height: calc(var(--card-thumbnail-height) - var(--card-thumbnail-height));
}
.carousel-item--thumbnail,
.carousel-item--thumbnail figure,
.carousel-item--thumbnail picture {
height: 375px;
height: var(--card-thumbnail-height);
}
.carousel-item--footer__author {
display: block;
}
.carousel-item--footer__date:before {
content: "-";
margin: 0 0.2rem;
}
}
.carousel-navigation {
align-items: center;
display: flex;
justify-content: center;
margin-bottom: 2rem;
margin-top: 2rem;
}
.carousel-navigation button {
-moz-appearance: none;
-webkit-appearance: none;
background-color: transparent;
border: 1px solid;
border-radius: 999em;
cursor: pointer;
display: block;
height: 10px;
margin: 0 4px;
outline: 0;
padding: 0;
padding: 0;
position: relative;
text-indent: -999em;
width: 10px;
}
.clip-path--loading rect,
.clip-path--playing rect {
animation: progress 4s cubic-bezier(0, 0.7, 0.25, 1) forwards;
}
.clip-path--playing rect {
animation-delay: 1s;
animation-duration: 60s;
animation-timing-function: linear;
}
.layer rect {
transform-origin: center;
}
.layer rect:nth-child(1n) {
animation-duration: 1.1s;
}
.layer rect:nth-child(2n) {
animation-duration: 3.2s;
}
.layer rect:nth-child(3n) {
animation-duration: 2.3s;
}
.layer rect:nth-child(4n) {
animation-duration: 1.4s;
}
.layer rect:nth-child(5n) {
animation-duration: 3.5s;
}
.layer rect:nth-child(6n) {
animation-duration: 2.6s;
}
.layer--loading {
fill: #FFFFFF;
fill: var(--color-white);
}
.layer--playing {
fill: #007bff;
fill: var(--color-primary-500);
}
@keyframes progress {
0% {
width: 0;
}
100% {
width: 100%;
}
}
@keyframes equalize {
0% {
transform: scaleY(1);
}
10% {
transform: scaleY(0.4);
}
20% {
transform: scaleY(0.8);
}
30% {
transform: scaleY(0.6);
}
40% {
transform: scaleY(0.9);
}
50% {
transform: scaleY(0.5);
}
60% {
transform: scaleY(0.7);
}
70% {
transform: scaleY(1);
}
80% {
transform: scaleY(0.6);
}
90% {
transform: scaleY(0.4);
}
100% {
transform: scaleY(0.9);
}
}
.carousel-container.theme-dark {
background-color: #000000;
background-color: var(--color-black);
color: #FFFFFF;
color: var(--color-white);
}
.carousel-container.theme-dark .carousel-container--item {
background-color: #334155;
background-color: var(--color-slate-700);
border-color: #475569;
border-color: var(--color-slate-600);
}
.carousel-container.theme-dark .carousel-item--icon {
fill: #FFFFFF;
fill: var(--color-white);
}
.carousel-container.theme-dark .carousel-navigation button {
border-color: #94a3b8;
border-color: var(--color-slate-400);
}
.carousel-container.theme-dark .carousel-navigation button[aria-pressed=true] {
background-color: #64748b;
background-color: var(--color-slate-500);
}
.carousel-container.theme-dark .carousel-container--item:focus .carousel-item--icon,
.carousel-container.theme-dark .carousel-container--item:hover .carousel-item--icon {
fill: #94a3b8;
fill: var(--color-slate-400);
}
.carousel-container.theme-dark .carousel-container--item.is-focused {
border: 1px solid #007bff;
border: 1px solid var(--color-primary-500);
box-shadow: 0 0 0 4px #475569;
box-shadow: 0 0 0 4px var(--color-slate-600);
outline: 0.25em solid rgba(0, 123, 255, 0.25);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.25);
outline-offset: 0;
}
.carousel-container.theme-light {
background-color: #FFFFFF;
background-color: var(--color-white);
color: #0f172a;
color: var(--color-slate-900);
}
.carousel-container.theme-light .carousel-container--item {
background-color: #FFFFFF;
background-color: var(--color-white);
border-color: #cbd5e1;
border-color: var(--color-slate-300);
outline: 0.43em solid transparent;
outline-offset: 0.15em;
}
.carousel-container.theme-light .carousel-container--item:hover,
.carousel-container.theme-light .carousel-container--item:focus,
.carousel-container.theme-light .carousel-container--item.is-focused {
border: 1px solid #007bff;
border: 1px solid var(--color-primary-500);
outline: 0.25em solid rgba(0, 123, 255, 0.25);
outline: 0.25em solid rgba(var(--color-primary-500-rgb), 0.25);
outline-offset: 0;
}
.carousel-container.theme-light .carousel-item--icon {
fill: #94a3b8;
fill: var(--color-slate-400);
}
.carousel-container.theme-light .carousel-navigation button {
border-color: #94a3b8;
border-color: var(--color-slate-400);
}
.carousel-container.theme-light .carousel-navigation button[aria-pressed=true] {
background-color: #007bff;
background-color: var(--color-primary-500);
border-color: #007bff;
border-color: var(--color-primary-500);
}
.carousel-container.theme-light .carousel-container--item:focus .carousel-item--icon,
.carousel-container.theme-light .carousel-container--item:hover .carousel-item--icon {
fill: #334155;
fill: var(--color-slate-700);
}
.press-container {
background-color: #f1f5f9;
background-color: var(--color-slate-100);
border-radius: 6px;
box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
line-height: 1.414;
max-width: 360px;
padding: 1rem;
}
.press-container__title {
border-bottom: 1px solid #bbb;
font-size: 1.125rem;
font-weight: bold;
line-height: 1;
margin-bottom: 1rem;
padding-bottom: 1rem;
}
.press-container__columns {
margin: 1rem 0;
}
.press-column {
line-height: 1.414;
}
.press-column:not(:first-child) {
margin-top: 1rem;
}
.press-container__columns h4 {
font-size: 1rem;
font-weight: bold;
}
.press-archives button {
background-color: transparent;
border: 0px solid;
color: #007bff;
color: var(--color-primary-500);
display: block;
font-size: 14px;
line-height: 1.414;
margin: 0;
padding: 0;
text-transform: uppercase;
}
.archive-year.highlighted-year {
font-weight: bold;
}
.press-card__list {
display: grid;
grid-gap: 1.25rem;
}
.press-card__list > li {
align-items: center;
background-color: white;
border: 1px solid #e2e8f0;
border: 1px solid var(--color-slate-200);
border-radius: 6px;
display: grid;
grid-gap: 1rem;
grid-template-columns: max-content 1fr;
grid-template-rows: max-content;
outline: 0.25em solid transparent;
overflow: hidden;
padding: 0.875rem 1rem;
position: relative;
transition-duration: 250ms;
transition-property: transform, box-shadow, outline;
}
.press-card__list > li[aria-hidden=true] {
display: none;
}
.press-card__list > li:hover, .press-card__list > li:focus, .press-card__list > li:focus-within {
border-color: #80bdff;
border-color: var(--page-primary-hex);
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
outline-color: rgba(var(--page-primary-rgb), 0.25);
transform: translateY(-0.25rem);
}
.press-card__list > li a {
bottom: 0;
height: 100%;
left: 0;
position: absolute;
right: 0;
top: 0;
width: 100%;
}
.press-card__list > li .press-image {
border-radius: 6px;
box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
grid-area: 1/1/2/2;
height: 50px;
overflow: hidden;
position: relative;
width: 50px;
}
.press-card__list > li .press-image img {
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
width: 100%;
}
.press-card__list > li .press-image i {
align-items: center;
bottom: 0;
color: #FFFFFF;
color: var(--color-white);
display: flex;
font-size: 20px;
justify-content: center;
left: 0;
opacity: 0.85;
position: absolute;
right: 0;
top: 0;
}
@media (min-width: 992px) {
.press-card__list > li .press-image {
height: 75px;
width: 75px;
}
.press-card__list > li .press-image i {
font-size: 24px;
}
}
.press-card__list > li .press-content {
grid-area: 1/2/2/3;
}
.press-card__list > li .press-title {
font-weight: 600;
}
.press-card__list > li .press-title__text {
-webkit-box-orient: vertical;
display: -webkit-box;
-webkit-line-clamp: 2;
overflow: hidden;
}
@media (min-width: 992px) {
.press-card__list > li .press-title__text {
padding-right: 3rem;
}
}
.press-card__list > li .press-hidden__tab {
grid-area: 2/2/3/3;
}
.press-card__list > li .press-date {
color: #64748b;
color: var(--color-slate-500);
display: block;
font-size: 14px;
font-weight: 300;
margin: 0.25em 0 0;
}
.press-card__list > li .press-excerpt {
-webkit-box-orient: vertical;
display: -webkit-box;
display: none;
-webkit-line-clamp: 2;
overflow: hidden;
padding-right: 2rem;
}
/*# sourceMappingURL=style.min.css.map */