/*! tailwindcss v2.2.19 | MIT License | https://tailwindcss.com */
/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
html {
    -webkit-text-size-adjust: 100%;
    line-height: 1.15;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4
}

body {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji
}

hr {
    color: inherit;
    height: 0
}

abbr[title] {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

code,
kbd,
pre,
samp {
    font-family: ui-monospace, SFMono-Regular, Consolas, Liberation Mono, Menlo, monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

table {
    border-color: inherit;
    text-indent: 0
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
select {
    text-transform: none
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button
}

::-moz-focus-inner {
    border-style: none;
    padding: 0
}

:-moz-focusring {
    outline: 1px dotted ButtonText
}

:-moz-ui-invalid {
    box-shadow: none
}

legend {
    padding: 0
}

progress {
    vertical-align: baseline
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

summary {
    display: list-item
}

blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
    margin: 0
}

button {
    background-color: transparent;
    background-image: none
}

fieldset,
ol,
ul {
    margin: 0;
    padding: 0
}

ol,
ul {
    list-style: none
}

html {
    font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
    line-height: 1.5
}

body {
    font-family: inherit;
    line-height: inherit
}

*,
:after,
:before {
    border: 0 solid;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

hr {
    border-top-width: 1px
}

img {
    border-style: solid
}

textarea {
    resize: vertical
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #9ca3af
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #9ca3af
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #9ca3af
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    color: #9ca3af
}

input::placeholder,
textarea::placeholder {
    color: #9ca3af
}

[role=button],
button {
    cursor: pointer
}

:-moz-focusring {
    outline: auto
}

table {
    border-collapse: collapse
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit
}

a {
    color: inherit;
    text-decoration: inherit
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    line-height: inherit;
    padding: 0
}

code,
kbd,
pre,
samp {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, Liberation Mono, Courier New, monospace
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
    display: block;
    vertical-align: middle
}

img,
video {
    height: auto;
    max-width: 100%
}

[hidden] {
    display: none
}

*,
:after,
:before {
    --tw-blur: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-brightness: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-contrast: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-grayscale: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-hue-rotate: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-invert: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-saturate: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-sepia: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-drop-shadow: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}

[multiple],
[type=date],
[type=datetime-local],
[type=email],
[type=month],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=time],
[type=url],
[type=week],
select,
textarea {
    --tw-shadow: 0 0 #0000;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    border-color: #6b7280;
    border-radius: 0;
    border-width: 1px;
    font-size: 1rem;
    line-height: 1.5rem;
    padding: .5rem .75rem
}

[multiple]:focus,
[type=date]:focus,
[type=datetime-local]:focus,
[type=email]:focus,
[type=month]:focus,
[type=number]:focus,
[type=password]:focus,
[type=search]:focus,
[type=tel]:focus,
[type=text]:focus,
[type=time]:focus,
[type=url]:focus,
[type=week]:focus,
select:focus,
textarea:focus {
    --tw-ring-inset: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: #2563eb;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    border-color: #2563eb;
    -webkit-box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    outline: 2px solid transparent;
    outline-offset: 2px
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #6b7280;
    opacity: 1
}

input::-moz-placeholder,
textarea::-moz-placeholder {
    color: #6b7280;
    opacity: 1
}

input:-ms-input-placeholder,
textarea:-ms-input-placeholder {
    color: #6b7280;
    opacity: 1
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
    color: #6b7280;
    opacity: 1
}

input::placeholder,
textarea::placeholder {
    color: #6b7280;
    opacity: 1
}

::-webkit-datetime-edit-fields-wrapper {
    padding: 0
}

::-webkit-date-and-time-value {
    min-height: 1.5em
}

select {
    color-adjust: exact;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3E%3Cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3E%3C/svg%3E");
    background-position: right .5rem center;
    background-repeat: no-repeat;
    background-size: 1.5em 1.5em;
    padding-right: 2.5rem;
    -webkit-print-color-adjust: exact
}

[multiple] {
    color-adjust: unset;
    background-image: none;
    background-position: 0 0;
    background-repeat: unset;
    background-size: initial;
    padding-right: .75rem;
    -webkit-print-color-adjust: unset
}

[type=checkbox],
[type=radio] {
    color-adjust: exact;
    -ms-flex-negative: 0;
    --tw-shadow: 0 0 #0000;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: #fff;
    background-origin: border-box;
    border-color: #6b7280;
    border-width: 1px;
    color: #2563eb;
    display: inline-block;
    flex-shrink: 0;
    height: 1rem;
    padding: 0;
    -webkit-print-color-adjust: exact;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    width: 1rem
}

[type=checkbox] {
    border-radius: 0
}

[type=radio] {
    border-radius: 100%
}

[type=checkbox]:focus,
[type=radio]:focus {
    --tw-ring-inset: var(--tw-empty,
            /*!*/
            /*!*/
        );
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: #2563eb;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    -webkit-box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    outline: 2px solid transparent;
    outline-offset: 2px
}

[type=checkbox]:checked,
[type=radio]:checked {
    background-color: currentColor;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-color: transparent
}

[type=checkbox]:checked {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E")
}

[type=radio]:checked {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='%23fff' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='8' cy='8' r='3'/%3E%3C/svg%3E")
}

[type=checkbox]:checked:focus,
[type=checkbox]:checked:hover,
[type=radio]:checked:focus,
[type=radio]:checked:hover {
    background-color: currentColor;
    border-color: transparent
}

[type=checkbox]:indeterminate {
    background-color: currentColor;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3E%3C/svg%3E");
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-color: transparent
}

[type=checkbox]:indeterminate:focus,
[type=checkbox]:indeterminate:hover {
    background-color: currentColor;
    border-color: transparent
}

[type=file] {
    background: unset;
    border-color: inherit;
    border-radius: 0;
    border-width: 0;
    font-size: unset;
    line-height: inherit;
    padding: 0
}

[type=file]:focus {
    outline: 1px auto -webkit-focus-ring-color
}

.contents {
    display: contents
}

.hidden {
    display: none
}

.filter {
    -webkit-filter: var(--tw-filter);
    filter: var(--tw-filter)
}

:root {
    --blue-10: #041e3c;
    --blue-9: #042b59;
    --blue-8: #043875;
    --blue-7: #0553b1;
    --blue-6: #0468d7;
    --primary: #0468d7;
    --blue-5: #027dfd;
    --blue-4: #13b9fd;
    --blue-3: #81ddf9;
    --blue-2: #b8eafe;
    --blue-1: #e7f8ff;
    --pink: #f8bbd0;
    --red: #d43324;
    --coral: #f25d50;
    --yellow: #f2dd22;
    --violet-4: #833ef2;
    --violet-3: #796ceb;
    --violet-2: #6200ee;
    --violet-1: #c6bafa;
    --green-3: #14c2ad;
    --green-2: #a7ffeb;
    --green-1: #1cdac5;
    --grey-6: #4a4a4a;
    --grey-5: #a4a4a4;
    --grey-4: #dadce0;
    --grey-3: #e8eaed;
    --grey-2: #f1f3f4;
    --grey-1: #f8f9fa;
    --ui-anim-func: cubic-bezier(.27, .89, .39, .95);
    --ui-border-radius: 24px;
    --ui-border-radius-sm: 8px;
    --ui-border-color: var(--grey-3);
    --ui-btn-height: 40px;
    --ui-card-width: 484px;
    --ui-drop-shadow: 0px 8px 24px rgba(0, 0, 0, .25);
    --ui-drop-shadow-sm: 0px 0px 16px rgba(0, 0, 0, .1);
    --ui-header-event-banner-height: 50px;
    --ui-header-navigation-height: 86px;
    --ui-header-height: calc(var(--ui-header-navigation-height) + var(--ui-header-event-banner-height));
    --ui-logo-width: 126px;
    --font-size-heading-1: 46px;
    --font-size-heading-2: 34px;
    --font-size-heading-3: 24px;
    --font-size-heading-4: 18px;
    --font-size-heading-5: 16px;
    --font-size-default: 14px;
    --font-size-scaling-2: 6.11111vw;
    --font-size-scaling-3: 5vw;
    --font-weight-default: 400;
    --font-weight-bold: 700;
    --font-gsans: "Google Sans", sans-serif;
    --font-roboto: "Roboto", sans-serif;
    --font-roboto-mono: "Roboto Mono", monospace;
    --screen-xs-min: 480px;
    --screen-sm-min: 640px;
    --screen-md-min: 768px;
    --screen-lg-min: 1024px;
    --screen-xl-min: 1280px;
    --screen-2xl-min: 1536px;
    --screen-13-min: 1440px;
    --screen-desktop-min: 992px;
    --spacer-sm: 8px;
    --spacer-md: 32px;
    --spacer: 40px;
    --gutter-sm: 24px;
    --gutter: 50px;
    --gutter-md: 70px;
    --gutter-lg: 112px;
    --gutter-xl: 140px;
    --max-width: calc(var(--screen-xl-min) - var(--gutter)*2);
    --gutter-auto: calc((100vw - var(--max-width))/2);
    --grad-blue-green-145: linear-gradient(145deg, #f3fcff 40%, #d3fff5 90%);
    --grad-yellow-blue-145: linear-gradient(145deg, #faf9c5 40%, #e8f9ff 90%);
    --grad-blue-yellow-35: linear-gradient(35deg, #e8f9ff 40%, #faf9c5 90%);
    --grad-yellow-blue-35: linear-gradient(35deg, #faf9c5 40%, #e8f9ff 90%);
    --grad-liteyellow-blue: linear-gradient(35deg, #fcfce2 40%, #f5fbfe 90%);
    --grad-red-blue-35: linear-gradient(35deg, #fcdde8, #f3fcff 60%);
    --grad-violet-blue-35: linear-gradient(35deg, #e3ddfd 30%, #f3fcff 90%);
    --grad-blue-light-35: linear-gradient(35deg, #dcf5ff 50%, #f3fcff 90%);
    --grad-yellow-blue-75: linear-gradient(75deg, hsla(59, 82%, 87%, .5), rgba(231, 248, 255, .5))
}

@media (min-width:1024px) {
    :root {
        --font-size-heading-1: 60px;
        --font-size-heading-2: 36px;
        --font-size-heading-3: 28px;
        --font-size-heading-4: 20px;
        --font-size-heading-5: 16px;
        --font-size-default: 14px
    }
}

.text-coral {
    color: var(--coral) !important
}

.text-green {
    color: var(--green-3) !important
}

.text-blue {
    color: var(--blue-4) !important
}

.text-violet {
    color: var(--violet-4) !important
}

@define-mixin anim $name {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: $(
        name
    );
animation-name: $(
    name
);
-webkit-animation-timing-function: var(--ui-anim-func);
animation-timing-function: var(--ui-anim-func)
}

html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body,
html {
    height: 100%
}

body,
html {
    margin: 0;
    padding: 0
}

body {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    background-color: #fff;
    color: var(--grey-6);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    font-family: var(--font-roboto);
    font-size: var(--font-size-default);
    font-weight: var(--font-weight-default)
}

*,
:after,
:before {
    -webkit-box-sizing: inherit;
    box-sizing: inherit
}

*,
:after,
:before,
h1,
h2,
h3,
h4,
h5,
h6 {
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    margin-block-end: 0;
    margin-block-start: 0
}

h1,
h2,
h3,
h4,
h5,
h6 {
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    color: #000;
    font-family: var(--font-gsans);
    font-weight: var(--font-weight-bold);
    letter-spacing: -.005em;
    line-height: 1.2;
    margin-inline-end: 0;
    margin-inline-start: 0
}

h1,
h2.subheader {
    font-size: var(--font-size-heading-1)
}

h2.subheader {
    line-height: 1;
    margin-bottom: var(--gutter-md)
}

h2.centered {
    line-height: 1;
    margin: 0 auto;
    max-width: 885px;
    text-align: center
}

h4.eyebrow {
    font-size: var(--font-size-heading-4);
    margin-bottom: 20px
}

h4.eyebrow,
p {
    color: var(--grey-6)
}

p {
    line-height: 1.4
}

p a {
    color: var(--blue-6)
}

body.interior {
    padding-top: var(--ui-header-height)
}

main {
    -webkit-box-flex: 1;
    background-color: #fff;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    overflow: hidden
}

.module {
    padding: var(--gutter-md) 0
}

.container {
    margin: 0 auto;
    max-width: var(--max-width);
    width: calc(100% - var(--gutter-sm)*2)
}

.grid {
    gap: 2.19%;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    margin: 0 auto;
    max-width: var(--screen-xl-min)
}

.centered {
    text-align: center
}

.push-left {
    margin-left: 0
}

@media (min-width:768px) {
    .container {
        width: calc(100% - var(--gutter)*2)
    }
}

@media (min-width:1024px) {
    .push-left {
        margin-left: var(--gutter-lg)
    }
}

.stacked-centered {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-line-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-content: space-between;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    min-width: 100%
}

.stacked-centered>* {
    margin-bottom: 1rem
}

.btn,
button {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: transparent;
    border-radius: var(--ui-border-radius);
    color: var(--blue-6);
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-family: var(--font-gsans);
    font-size: var(--font-size-default);
    font-weight: var(--font-weight-bold);
    height: var(--ui-btn-height);
    justify-content: center;
    padding: 0 var(--spacer-md);
    text-align: center;
    -webkit-transition: background-color .3s ease, color .3s ease;
    transition: background-color .3s ease, color .3s ease
}

.btn.large,
button.large {
    font-size: var(--font-size-heading-5);
    padding-bottom: var(--gutter-sm);
    padding-top: var(--gutter-sm)
}

.btn.solid,
button.solid {
    background-color: var(--blue-6);
    color: #fff
}

.btn.white,
button.white {
    background-color: #fff;
    border: 1px solid transparent
}

.btn.white:hover,
button.white:hover {
    background-color: #fff;
    color: var(--blue-6)
}

.btn.primary,
button.primary {
    background-color: var(--blue-6);
    color: #fff
}

.btn.quiet,
button.quiet {
    background-color: transparent !important;
    border: none !important;
    color: #000;
    padding: 0 var(--gutter-sm)
}

.btn.quiet:hover,
button.quiet:hover {
    background-color: transparent !important;
    color: #000 !important
}

.btn.collapsed,
button.collapsed {
    padding: 0 !important
}

.btn .fa-arrow-right,
button .fa-arrow-right {
    left: 0;
    position: relative
}

.btn:hover .fa-arrow-right,
button:hover .fa-arrow-right {
    left: 3px;
    -webkit-transition: left .4s var(--ui-anim-func);
    transition: left .4s var(--ui-anim-func)
}

.icon-btn {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    border-radius: var(--ui-border-radius);
    color: #fff;
    cursor: pointer;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: var(--ui-btn-height);
    justify-content: center;
    width: var(--ui-btn-height)
}

.icon-btn.active,
.icon-btn:hover {
    background-color: hsla(0, 0%, 98%, .15);
    -webkit-transition: background-color .3s ease;
    transition: background-color .3s ease
}

main .btn,
main button {
    border: 1px solid var(--blue-6);
    font-size: var(--font-size-default)
}

main .btn:hover,
main button:hover {
    background-color: var(--blue-6);
    color: #fff
}

.carousel-section {
    background-color: var(--grey-1)
}

.carousel-section h2 {
    font-size: var(--font-size-heading-1);
    margin-bottom: var(--spacer)
}

.carousel .carousel-slider {
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    align-items: stretch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: calc(var(--gutter)*-1);
    overflow-x: auto;
    overflow-y: hidden;
    padding: 20px 0 30px;
    padding-left: var(--gutter);
    position: relative;
    scroll-behavior: smooth;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -webkit-transform: translate(0);
    transform: translate(0);
    z-index: 5
}

.carousel .carousel-slider::-webkit-scrollbar {
    display: none
}

.carousel .carousel-slider:before {
    -webkit-box-flex: 0;
    content: "";
    display: block;
    -ms-flex: 0 0 var(--gutter-sm);
    flex: 0 0 var(--gutter-sm);
    height: 100px
}

.carousel .story-item {
    margin-right: var(--gutter-sm);
    max-width: var(--ui-card-width);
    min-width: var(--ui-card-width)
}

.carousel .story-item:last-child {
    margin-right: var(--gutter)
}

.carousel {
    --featured-card-width: 600px;
    --featured-card-height: 600px
}

.carousel .carousel-featured-card {
    border-radius: var(--ui-border-radius);
    display: grid;
    grid-template-columns: 1fr;
    margin-right: var(--gutter-sm);
    min-width: 90vw
}

.carousel .carousel-featured-card:last-child {
    margin-right: var(--gutter)
}

.carousel .carousel-featured-card .media {
    background-color: var(--grey-2);
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: var(--ui-border-radius-sm);
    border-top-right-radius: var(--ui-border-radius-sm);
    height: 250px
}

.carousel .carousel-featured-card .text {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: var(--primary);
    border-bottom-left-radius: var(--ui-border-radius-sm);
    border-bottom-right-radius: var(--ui-border-radius-sm);
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 500px;
    justify-content: center;
    padding: var(--spacer);
    text-align: center
}

.carousel .carousel-featured-card .text h4 {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--gutter-sm)
}

.carousel .carousel-featured-card .text h3 {
    font-size: var(--font-size-heading-1);
    line-height: 1.1;
    margin-bottom: var(--gutter-sm)
}

.carousel .carousel-featured-card .text p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--gutter-sm)
}

.carousel .carousel-featured-card .text.dark h4,
.carousel .carousel-featured-card .text.dark p,
.carousel .carousel-featured-card .text.lite a.btn,
.carousel .carousel-featured-card .text.lite a.btn:hover,
.carousel .carousel-featured-card .text.lite h3,
.carousel .carousel-featured-card .text.lite h4,
.carousel .carousel-featured-card .text.lite p {
    color: var(--grey-3)
}

.carousel .carousel-featured-card .text.dark a.btn,
.carousel .carousel-featured-card .text.dark a.btn:hover,
.carousel .carousel-featured-card .text.dark h3 {
    color: #fff !important
}

@media (min-width:1024px) {
    .carousel .carousel-featured-card {
        -ms-flex-flow: wrap;
        flex-flow: wrap;
        grid-template-columns: var(--ui-card-width) var(--featured-card-width);
        min-width: auto
    }

    .carousel .carousel-featured-card .media {
        border-bottom-left-radius: var(--ui-border-radius-sm);
        border-bottom-right-radius: 0;
        border-top-left-radius: var(--ui-border-radius-sm);
        border-top-right-radius: 0;
        width: var(--ui-card-width)
    }

    .carousel .carousel-featured-card .text {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: var(--ui-border-radius-sm);
        border-top-left-radius: 0;
        border-top-right-radius: var(--ui-border-radius-sm);
        padding: var(--gutter-md)
    }

    .carousel .carousel-featured-card .text h3 {
        font-size: 54px
    }

    .carousel .carousel-featured-card .media,
    .carousel .carousel-featured-card .text {
        height: var(--featured-card-height)
    }
}

.carousel .carousel-card {
    -ms-flex-line-pack: justify;
    align-content: space-between;
    background-color: #fff;
    border-radius: var(--ui-border-radius);
    -webkit-box-shadow: var(--ui-drop-shadow);
    box-shadow: var(--ui-drop-shadow);
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    height: 435px;
    margin-right: var(--gutter-sm);
    max-width: var(--ui-card-width);
    min-width: 96vw;
    overflow: hidden;
    padding: var(--gutter);
    padding-bottom: 60px;
    position: relative
}

.carousel .carousel-card>a {
    display: block
}

.carousel .carousel-card:last-child {
    margin-right: var(--gutter)
}

.carousel .carousel-card .placeholder,
.carousel .carousel-card img {
    border-radius: 6px;
    margin-bottom: var(--gutter-sm);
    max-height: 202px;
    opacity: 1;
    position: relative
}

.carousel .carousel-card .placeholder {
    background-image: -webkit-gradient(linear, left top, right top, from(#9cc4f5), to(#b8f0f7));
    background-image: linear-gradient(90deg, #9cc4f5, #b8f0f7);
    min-height: 147px;
    width: 85%
}

.carousel .carousel-card .placeholder,
.carousel .carousel-card a,
.carousel .carousel-card h4,
.carousel .carousel-card img {
    z-index: 2
}

.carousel .carousel-card h4 {
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--gutter-sm)
}

.carousel .carousel-card a {
    color: #000;
    display: inline-block;
    font-weight: var(--font-weight-bold)
}

.carousel .carousel-card .carousel-card-bg {
    background-color: var(--primary);
    border-radius: var(--ui-border-radius);
    bottom: 0;
    height: 10rem;
    left: -50%;
    position: absolute;
    top: 50%;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition: -webkit-transform .25s ease-in;
    transition: -webkit-transform .25s ease-in;
    transition: transform .25s ease-in;
    transition: transform .25s ease-in, -webkit-transform .25s ease-in;
    width: 10rem
}

.carousel .carousel-card:hover {
    --delay: 300ms
}

.carousel .carousel-card:hover .carousel-card-bg {
    -webkit-transform: scale(10);
    transform: scale(10);
    -webkit-transition: -webkit-transform .6s var(--ui-anim-func) var(--delay);
    transition: -webkit-transform .6s var(--ui-anim-func) var(--delay);
    transition: transform .6s var(--ui-anim-func) var(--delay);
    transition: transform .6s var(--ui-anim-func) var(--delay), -webkit-transform .6s var(--ui-anim-func) var(--delay)
}

.carousel .carousel-card:hover h4 {
    color: #fff;
    -webkit-transition: color .4s var(--ui-anim-func) var(--delay);
    transition: color .4s var(--ui-anim-func) var(--delay)
}

.carousel .carousel-card:hover a {
    color: #fff;
    -webkit-transition: color .3s var(--ui-anim-func) var(--delay);
    transition: color .3s var(--ui-anim-func) var(--delay)
}

.carousel .carousel-card:hover a i {
    left: 5px;
    position: relative;
    -webkit-transition: left .3s var(--ui-anim-func) var(--delay);
    transition: left .3s var(--ui-anim-func) var(--delay)
}

.carousel .carousel-progress {
    margin-top: 35px
}

.carousel .carousel-progress .carousel-track {
    background-color: var(--grey-3);
    height: 4px
}

.carousel .carousel-progress .carousel-completed {
    background-color: var(--green-1);
    height: 100%;
    position: relative;
    width: 0
}

.carousel .carousel-progress .carousel-nav {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-end;
    min-width: 100%;
    padding: var(--gutter-sm) 0
}

.carousel .carousel-progress .carousel-nav a {
    display: inline-block;
    margin-left: var(--spacer-sm);
    -webkit-transition: opacity .2s ease;
    transition: opacity .2s ease
}

.carousel .carousel-progress .carousel-nav a.disabled {
    opacity: .5
}

@media (min-width:768px) {
    .carousel .carousel-slider:before {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 var(--gutter);
        flex: 0 0 var(--gutter)
    }

    .carousel .carousel-card {
        height: 500px;
        margin-right: var(--spacer);
        min-width: var(--ui-card-width)
    }

    .carousel .carousel-card h4 {
        max-width: 90%;
        min-width: 90%
    }
}

@media (min-width:1440px) {
    .carousel .carousel-slider {
        padding-left: var(--gutter-auto)
    }
}

.cookie-snack {
    background-color: #fff;
    bottom: 0;
    -webkit-box-shadow: var(--ui-drop-shadow);
    box-shadow: var(--ui-drop-shadow);
    display: none;
    left: 0;
    opacity: 0;
    padding: var(--spacer) 0;
    position: fixed;
    width: 100%;
    z-index: 11
}

@-webkit-keyframes fadein {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes fadein {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.cookie-snack.show {
    -webkit-animation-delay: .2s;
    animation-delay: .2s;
    -webkit-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: fadein;
    animation-name: fadein;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: block
}

.cookie-snack .container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 16px;
    justify-content: space-between;
    position: relative;
    top: 1px
}

.cookie-snack .container p {
    font-size: var(--font-size-heading-5);
    line-height: 1.5;
    margin-right: var(--gutter);
    max-width: 1200px
}

.cookie-snack .container .buttons-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px
}

.cookie-snack .container .buttons-container button:first-child {
    white-space: nowrap
}

@media (min-width:1024px) {
    .cookie-snack .container {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        gap: 0
    }
}

.embed-container {
    height: 0;
    max-width: 100%;
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative
}

.embed-container embed,
.embed-container iframe,
.embed-container object {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.feature-header,
.stacked-feature,
.stacked-header {
    position: relative
}

.feature-header>hgroup,
.stacked-feature>hgroup,
.stacked-header>hgroup {
    max-width: 90%;
    padding-left: 0;
    width: 90%
}

.feature-header>hgroup h2,
.stacked-feature>hgroup h2,
.stacked-header>hgroup h2 {
    font-size: var(--font-size-heading-1);
    line-height: 1
}

.feature-header>hgroup h4.eyebrow.faqs,
.stacked-feature>hgroup h4.eyebrow.faqs,
.stacked-header>hgroup h4.eyebrow.faqs {
    color: var(--violet-4)
}

.feature-header>hgroup p,
.stacked-feature>hgroup p,
.stacked-header>hgroup p {
    font-size: var(--font-size-heading-4)
}

.feature-header.full>hgroup,
.stacked-feature.full>hgroup,
.stacked-header.full>hgroup {
    max-width: 100% !important;
    padding-left: var(--spacer) !important
}

.feature-header.centered>hgroup,
.stacked-feature.centered>hgroup,
.stacked-header.centered>hgroup {
    margin: 0 auto;
    padding-left: 0;
    text-align: center
}

.feature-header.centered>hgroup h2,
.stacked-feature.centered>hgroup h2,
.stacked-header.centered>hgroup h2 {
    max-width: auto;
    width: auto
}

@media (min-width:1024px) {

    .feature-header>hgroup,
    .stacked-feature>hgroup,
    .stacked-header>hgroup {
        max-width: 885px;
        padding-left: calc(var(--gutter-lg))
    }

    .feature-header a.btn.fixed,
    .feature-header>div,
    .stacked-feature a.btn.fixed,
    .stacked-feature>div,
    .stacked-header a.btn.fixed,
    .stacked-header>div {
        bottom: 7px;
        position: absolute;
        right: 0
    }
}

.features {
    --anim-offset: 200px;
    margin-bottom: var(--gutter-sm)
}

@-webkit-keyframes slideup {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: 0
    }
}

.features .stacked-feature .feature {
    display: grid;
    opacity: 1;
    top: 0
}

.features .stacked-feature .feature.full {
    grid-template-columns: 1fr !important;
    padding-bottom: 0
}

.features .stacked-feature .feature.full .text {
    padding-left: 0;
    padding-right: 0
}

.features .stacked-feature .feature {
    --logo-size: 126px
}

.features .stacked-feature .feature.icons .text {
    -webkit-column-gap: var(--spacer-md);
    -moz-column-gap: var(--spacer-md);
    column-gap: var(--spacer-md);
    display: grid;
    grid-template-columns: var(--logo-size) 1fr !important
}

.features .stacked-feature .feature .icon {
    background-color: #fff;
    border-radius: var(--ui-border-radius-sm);
    -webkit-box-shadow: var(--ui-drop-shadow);
    box-shadow: var(--ui-drop-shadow);
    height: var(--logo-size);
    place-items: center;
    width: var(--logo-size)
}

.features .stacked-feature .feature .text>div {
    border-bottom: 1px solid var(--grey-3);
    margin-bottom: var(--gutter);
    padding-bottom: var(--spacer)
}

.features .stacked-feature .feature .text>div:last-child {
    border-bottom: none;
    padding-bottom: 0
}

.features .stacked-feature .feature .text>div h3 {
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--gutter-sm)
}

.features .stacked-feature .feature .text>div p {
    margin-bottom: var(--gutter-sm)
}

.features .stacked-feature .feature .text>div a.btn {
    margin-right: var(--gutter-sm)
}

@media (min-width:1024px) {
    .features .stacked-feature .feature.full {
        padding-left: var(--gutter-lg);
        padding-right: var(--gutter-lg)
    }
}

.features .feature {
    display: none;
    grid-template-columns: 1fr;
    opacity: 0;
    padding: var(--gutter) 0;
    position: relative;
    top: var(--anim-offset)
}

.features .feature.collapse {
    padding: 0
}

.features .feature.nospy {
    display: grid;
    opacity: 1;
    top: 0
}

.features .feature.active {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup;
    animation-name: slideup;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: grid
}

.features .feature .text {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

.features .feature .text h3 {
    font-size: var(--font-size-heading-1);
    line-height: 1;
    margin-bottom: var(--spacer-md)
}

.features .feature .text.subtle h3 {
    font-size: var(--font-size-heading-3)
}

.features .feature .text p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--gutter-sm);
    max-width: 90%
}

.features .feature .text a.btn {
    margin-bottom: 14px
}

.features .feature .media {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    margin-bottom: var(--gutter);
    order: 1;
    overflow: hidden;
    width: var(--feature-img-width)
}

.features .feature .media img {
    max-width: 600px;
    width: 100%
}

@media (min-width:1024px) {
    .features .feature {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        grid-template-columns: 1fr 40%
    }

    .features .feature .text {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        padding: 0 var(--gutter-xl) 0 var(--gutter)
    }

    .features .feature .text p {
        margin-bottom: var(--spacer-md)
    }

    .features .feature .media {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        margin-bottom: 0;
        order: 2
    }

    .features .feature.reverse {
        grid-template-columns: 40% 1fr
    }

    .features .feature.reverse .text {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        padding: 0 var(--gutter) 0 var(--gutter-xl)
    }

    .features .feature.reverse .media {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

.feature-columns {
    display: grid;
    gap: var(--gutter);
    grid-template-columns: 1fr
}

.feature-columns h3 {
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--gutter-sm)
}

.feature-columns p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--gutter-md)
}

.feature-columns img {
    max-width: 600px;
    width: 100%
}

.feature-columns>div {
    border-top: 4px solid var(--grey-3);
    padding: var(--gutter-sm) var(--gutter) 0 0
}

@media (min-width:1024px) {
    .feature-columns {
        -webkit-column-gap: var(--gutter-sm);
        -moz-column-gap: var(--gutter-sm);
        column-gap: var(--gutter-sm);
        grid-template-columns: 1fr 1fr 1fr
    }

    .feature-columns img {
        max-width: 100%
    }
}

.feature-grid {
    padding: var(--spacer) 0
}

.feature-grid .feature-header {
    margin-bottom: var(--gutter-md)
}

.feature-grid .feature-header h4.eyebrow {
    color: #fff
}

.feature-grid .feature-header h2 {
    color: #fff;
    margin-bottom: var(--spacer);
    max-width: 1022px
}

.feature-grid .feature-header hgroup {
    padding-left: var(--spacer)
}

.feature-grid .feature-grid-features {
    display: grid;
    row-gap: var(--gutter-sm) !important
}

.feature-grid .feature-grid-features.col-2 {
    -webkit-column-gap: 90px;
    -moz-column-gap: 90px;
    column-gap: 90px;
    grid-template-columns: 1fr
}

.feature-grid .feature-grid-features.col-3 {
    -webkit-column-gap: var(--gutter-sm);
    -moz-column-gap: var(--gutter-sm);
    column-gap: var(--gutter-sm);
    grid-template-columns: 1fr
}

.feature-grid .feature-grid-features>div {
    border-radius: 16px;
    padding: var(--spacer)
}

.feature-grid .feature-grid-features>div:hover {
    background-color: hsla(0, 0%, 100%, .15);
    -webkit-box-shadow: var(--ui-drop-shadow);
    box-shadow: var(--ui-drop-shadow);
    -webkit-transition: background-color .3s, -webkit-box-shadow .2s var(--ui-anim-func);
    transition: background-color .3s, -webkit-box-shadow .2s var(--ui-anim-func);
    transition: background-color .3s, box-shadow .2s var(--ui-anim-func);
    transition: background-color .3s, box-shadow .2s var(--ui-anim-func), -webkit-box-shadow .2s var(--ui-anim-func)
}

.feature-grid .feature-grid-features>div:hover h3 i {
    left: 3px;
    position: relative;
    -webkit-transition: left .4s var(--ui-anim-func);
    transition: left .4s var(--ui-anim-func)
}

.feature-grid .feature-grid-features>div img {
    margin-bottom: var(--spacer-md);
    max-height: 74px;
    max-width: 74px
}

.feature-grid .feature-grid-features>div h3,
.feature-grid .feature-grid-features>div p {
    color: #fff
}

.feature-grid .feature-grid-features>div h3 {
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--gutter-sm);
    padding-right: 20px
}

.feature-grid .feature-grid-features>div h3 i {
    font-size: 50%;
    position: relative;
    top: -3px
}

.feature-grid .feature-grid-features>div p {
    font-size: var(--font-size-heading-4)
}

.feature-grid .feature-grid-features>div .btn {
    color: #fff;
    margin-top: var(--gutter-sm)
}

.feature-grid .feature-grid-features>div .btn:hover {
    color: #fff !important
}

@media (min-width:768px) {
    .feature-grid .feature-grid-features.col-2 {
        -webkit-column-gap: var(--gutter);
        -moz-column-gap: var(--gutter);
        column-gap: var(--gutter);
        grid-template-columns: minmax(0, 400px) minmax(0, 400px)
    }

    .feature-grid .feature-grid-features.col-3 {
        -webkit-column-gap: var(--gutter-sm);
        -moz-column-gap: var(--gutter-sm);
        column-gap: var(--gutter-sm);
        grid-template-columns: minmax(0, 400px) minmax(0, 400px)
    }
}

@media (min-width:1024px) {
    .feature-grid .feature-grid-features {
        row-gap: var(--gutter)
    }

    .feature-grid .feature-grid-features.col-2 {
        -webkit-column-gap: 90px;
        -moz-column-gap: 90px;
        column-gap: 90px;
        grid-template-columns: minmax(0, 500px) minmax(0, 500px)
    }

    .feature-grid .feature-grid-features.col-3 {
        -webkit-column-gap: var(--gutter-sm);
        -moz-column-gap: var(--gutter-sm);
        column-gap: var(--gutter-sm);
        grid-template-columns: minmax(0, 400px) minmax(0, 400px) minmax(0, 400px)
    }
}

.feature-compare {
    display: grid;
    gap: var(--gutter-md);
    grid-template-columns: 1fr
}

.feature-compare>div .media {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    border-radius: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    margin-bottom: var(--spacer-md);
    min-height: 240px
}

.feature-compare>div .text h3 {
    font-size: var(--font-size-heading-2);
    line-height: 1;
    margin-bottom: var(--gutter-sm)
}

.feature-compare>div .text p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--gutter-sm)
}

@media (min-width:768px) {
    .feature-compare {
        grid-template-columns: 1fr 1fr
    }
}

.dropdown {
    display: inline-block;
    position: relative
}

.dropdown .filters-dropdown__button {
    border-color: #000;
    color: #000;
    gap: 8px
}

.dropdown .filters-dropdown__button:hover {
    background: none;
    color: #000
}

.dropdown .filters-dropdown__button.mobile-button>i {
    display: none
}

.dropdown .filters-dropdown__button.primary {
    border: none !important;
    color: #fff !important
}

.dropdown .filters-dropdown__button.primary:hover {
    background-color: var(--blue-6) !important
}

.dropdown .filters-dropdown-content {
    --button-height: 40px;
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: show-opacity;
    animation-name: show-opacity;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    background-color: #fff;
    border-radius: 8px;
    -webkit-box-shadow: 0 8px 24px 0 rgba(0, 0, 0, .25);
    box-shadow: 0 8px 24px 0 rgba(0, 0, 0, .25);
    display: none;
    min-width: 160px;
    padding: var(--gutter-sm) 0;
    position: absolute;
    right: 0;
    top: calc(var(--button-height) + 10px);
    z-index: 6
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container {
    display: grid;
    grid-template-columns: 13rem 1px 13rem 1px 13rem
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container>div {
    margin: 0 auto;
    width: 80%
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container>div,
.dropdown .filters-dropdown-content .filters-dropdown__filters-container>div .filters-dropdown__checkbox-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 20px
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container>div .filters-dropdown__checkbox-container>label {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #4a4a4a;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 14px;
    gap: 25px
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container>div .filters-dropdown__checkbox-container>label input {
    border: 2px solid #a4a4a4;
    border-radius: 2px
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container .separator {
    background-color: #e8eaed;
    height: 100%;
    width: 100%
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container .filter-title {
    color: #4a4a4a;
    font-size: 16px
}

.dropdown .filters-dropdown-content .filters-dropdown__filters-container .filter-title>i {
    display: none
}

.dropdown .filters-dropdown-content .filters-dropdown__buttons-container {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--gutter-sm);
    justify-content: flex-end;
    margin-top: var(--gutter-sm);
    padding: 0 var(--gutter-sm)
}

.dropdown .filters-dropdown-content .filters-dropdown__buttons-container>button:first-child {
    border-color: #000 !important;
    color: #000 !important
}

.dropdown .filters-dropdown-content .filters-dropdown__buttons-container>button:first-child:hover {
    background: none !important
}

.dropdown .filters-dropdown-content .filters-dropdown__buttons-container>button:nth-child(2) {
    background-color: var(--blue-6);
    color: #fff
}

.dropdown .filters-dropdown-content.mobile-open {
    --buttons-container-height: 135px;
    --title-container-height: 80px;
    background-color: #fff;
    display: grid;
    grid-template-rows: var(--title-container-height) calc(100% - var(--title-container-height) - var(--buttons-container-height)) var(--buttons-container-height);
    height: 100%;
    left: 0;
    padding: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10
}

.dropdown .filters-dropdown-content.mobile-open .filters-dropdown__filters-container {
    grid-template-columns: none;
    grid-template-rows: -webkit-min-content 1px -webkit-min-content 1px -webkit-min-content 1px;
    grid-template-rows: min-content 1px min-content 1px min-content 1px;
    overflow: scroll;
    padding: 0 16px
}

.dropdown .filters-dropdown-content.mobile-open .filters-dropdown__filters-container>div {
    gap: 0;
    margin: 0;
    padding-left: 16px;
    width: 100%
}

.dropdown .filters-dropdown-content.mobile-open .filters-dropdown__filters-container .filters-dropdown__checkbox-container {
    display: none
}

.dropdown .filters-dropdown-content.mobile-open .filters-dropdown__filters-container .filters-dropdown__checkbox-container.show {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: show-opacity;
    animation-name: show-opacity;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: -webkit-box !important;
    display: -ms-flexbox !important;
    display: flex !important;
    margin: 16px 0 2rem 16px
}

.dropdown .filters-dropdown-content.mobile-open .filters-dropdown__buttons-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    gap: 8px;
    padding: 0 16px 24px
}

.dropdown .filters-dropdown-content.mobile-open .filters-dropdown__buttons-container>button {
    padding: 12px
}

.dropdown .filters-dropdown-content.mobile-open .filter-title {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: center;
    color: #4a4a4a;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 60px;
    justify-content: space-between
}

.dropdown .filters-dropdown-content.mobile-open .filter-title>i {
    display: inline;
    -webkit-transition: -webkit-transform .2s var(--ui-anim-func);
    transition: -webkit-transform .2s var(--ui-anim-func);
    transition: transform .2s var(--ui-anim-func);
    transition: transform .2s var(--ui-anim-func), -webkit-transform .2s var(--ui-anim-func)
}

.dropdown .filters-dropdown-content.mobile-open .filter-title.selected>i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.dropdown .filters-dropdown__mobile-header {
    display: none
}

.dropdown .filters-dropdown__mobile-header.show {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: space-between;
    padding: 0 4px 0 16px
}

.dropdown .filters-dropdown__mobile-header.show>span:first-child {
    color: #4a4a4a;
    font-size: 24px
}

.dropdown .filters-dropdown__mobile-header.show>span:nth-child(2) {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #4a4a4a;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--ui-btn-height);
    justify-content: center;
    width: var(--ui-btn-height)
}

.dropdown .filters-dropdown__mobile-header.show>span:nth-child(2):hover {
    background-color: #dcdcdc;
    border-radius: 100%
}

.dropdown .show {
    display: block
}

#events-filters-dropdown .filters-dropdown-content .filters-dropdown__filters-container {
    grid-template-columns: 19.5rem 1px 19.5rem
}

#events-filters-dropdown .filters-dropdown-content.mobile-open .filters-dropdown__filters-container {
    grid-template-columns: none
}

@-webkit-keyframes show-opacity {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes show-opacity {
    0% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.footer-light {
    background-color: var(--grey-1);
    padding: 70px var(--gutter)
}

.footer-light ul a {
    color: var(--grey-6)
}

.footer-light ul a:hover {
    text-decoration: underline
}

.footer-light .content {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    width: 100%
}

.footer-light .content.footer-main {
    padding-bottom: 65px
}

.footer-light .content.footer-social {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid var(--grey-4);
    padding-bottom: 34px
}

.footer-light .content.footer-social>div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.footer-light .content.footer-social>div a {
    margin-right: 1.25rem
}

.footer-light .content.footer-social>div span {
    color: var(--grey-6);
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-5)
}

.footer-light .content.footer-social .lang span {
    display: inline-block;
    margin-right: 1rem
}

.footer-light .content.footer-tray {
    padding-top: 34px
}

.footer-light .content.footer-tray div {
    text-align: center;
    width: 100%
}

.footer-light .content.footer-tray div:first-child {
    margin-bottom: 14px
}

.footer-light .content.footer-tray ul li {
    display: inline;
    margin-left: 1rem
}

.footer-light .logo {
    margin-bottom: var(--gutter);
    position: relative;
    top: -5px;
    width: var(--ui-logo-width)
}

.footer-light .footer-links {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%
}

.footer-light .footer-links ul {
    display: inline-block;
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-5);
    margin-bottom: var(--gutter);
    margin-left: 1rem
}

.footer-light .footer-links ul li:first-child {
    color: #000;
    display: block;
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--spacer-sm)
}

.footer-light .footer-links ul li {
    margin-bottom: var(--spacer-sm)
}

@media (min-width:768px) {
    .footer-light .content {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    .footer-light .content.footer-tray {
        -webkit-column-gap: var(--gutter);
        -moz-column-gap: var(--gutter);
        column-gap: var(--gutter)
    }

    .footer-light .content.footer-tray div {
        text-align: left;
        width: auto
    }

    .footer-light .content.footer-tray div:first-child {
        width: 70%
    }

    .footer-light .footer-links {
        grid-template-columns: repeat(3, 1fr);
        width: 55%
    }
}

.footer-dark {
    background-color: var(--blue-9);
    padding: 70px var(--gutter)
}

.footer-dark ul a {
    color: var(--grey-3)
}

.footer-dark ul a:hover {
    text-decoration: underline
}

.footer-dark .content {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    width: 100%
}

.footer-dark .content.footer-main {
    padding-bottom: 65px
}

.footer-dark .content.footer-social {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid var(--grey-4);
    padding-bottom: 34px
}

.footer-dark .content.footer-social>div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.footer-dark .content.footer-social>div a {
    margin-right: 1.25rem
}

.footer-dark .content.footer-social>div span {
    color: var(--grey-6);
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-5)
}

.footer-dark .content.footer-social .lang span {
    display: inline-block;
    margin-right: 1rem
}

.footer-dark .content.footer-tray {
    padding-top: 34px
}

.footer-dark .content.footer-tray div {
    color: var(--grey-3);
    text-align: center;
    width: 100%
}

.footer-dark .content.footer-tray div:first-child {
    margin-bottom: 14px
}

.footer-dark .content.footer-tray ul li {
    display: inline;
    margin-left: 1rem
}

.footer-dark .logo {
    margin-bottom: var(--gutter);
    position: relative;
    top: -5px;
    width: var(--ui-logo-width)
}

.footer-dark .footer-links {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%
}

.footer-dark .footer-links ul {
    display: inline-block;
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-5);
    margin-bottom: var(--gutter);
    margin-left: 1rem
}

.footer-dark .footer-links ul li:first-child {
    color: var(--grey-1);
    display: block;
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--spacer-sm)
}

.footer-dark .footer-links ul li {
    margin-bottom: var(--spacer-sm)
}

@media (min-width:768px) {
    .footer-dark .content {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    .footer-dark .content.footer-tray {
        -webkit-column-gap: var(--gutter);
        -moz-column-gap: var(--gutter);
        column-gap: var(--gutter)
    }

    .footer-dark .content.footer-tray div {
        text-align: left;
        width: auto
    }

    .footer-dark .content.footer-tray div:first-child {
        width: 70%
    }

    .footer-dark .footer-links {
        grid-template-columns: repeat(3, 1fr);
        width: 55%
    }
}

form label.hidden {
    visibility: hidden;
    width: 0
}

form span.error {
    color: var(--red);
    display: block;
    font-size: var(--font-size-heading-5);
    margin-top: 8px;
    padding-left: 32px
}

form a {
    color: var(--primary)
}

form .disclaimer {
    color: var(--grey-6);
    font-size: 14px;
    margin-bottom: var(--spacer-md);
    width: 100%
}

form .field-grid {
    -webkit-column-gap: var(--gutter-sm);
    -moz-column-gap: var(--gutter-sm);
    column-gap: var(--gutter-sm);
    display: grid;
    grid-template-columns: 1fr
}

form .field-wrapper {
    margin-bottom: var(--spacer-md)
}

form .field {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--grey-2);
    border: 1px solid transparent;
    border-radius: 63px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 70px;
    padding: 0 var(--spacer-md)
}

form .field.error {
    border-color: var(--red)
}

form .field i {
    color: var(--grey-5);
    margin-right: var(--spacer-sm)
}

form .field input {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    position: relative;
    top: -1px
}

form .checkbox {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

form .checkbox .field {
    border-radius: 4px;
    height: auto;
    margin-bottom: 0;
    margin-right: 16px;
    padding: var(--spacer-sm)
}

form .checkbox input[type=checkbox] {
    background-color: transparent;
    border: none;
    cursor: pointer
}

form .checkbox input[type=checkbox]:checked {
    background-color: var(--primary)
}

form .checkbox label {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    color: var(--grey-6);
    flex-grow: 1;
    font-size: 18px
}

form input,
form label,
form select {
    color: #000;
    font-size: var(--font-size-heading-5)
}

form input[type=email],
form input[type=search],
form input[type=text],
form select {
    background-color: transparent;
    border: none
}

form select {
    width: 100%
}

form ::-webkit-input-placeholder {
    color: var(--grey-6)
}

form ::-moz-placeholder {
    color: var(--grey-6)
}

form :-ms-input-placeholder {
    color: var(--grey-6)
}

form ::-ms-input-placeholder {
    color: var(--grey-6)
}

form ::placeholder,
form select:disabled {
    color: var(--grey-6)
}

@media (min-width:1024px) {
    form .disclaimer {
        width: 75%
    }

    form .field-grid {
        grid-template-columns: 1fr 1fr
    }
}

.page-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: var(--ui-header-height)
}

.page-header.mobile-nav-open {
    height: var(--ui-header-navigation-height)
}

.page-header.mobile-nav-open .event-bar {
    display: none
}

.page-header .event-bar {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background: var(--violet-4);
    color: #fff;
    font-family: var(--font-gsans);
    font-size: var(--font-size-default);
    font-weight: var(--font-weight-bold);
    height: 100%;
    justify-content: center
}

.header-light,
.page-header .event-bar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.header-light {
    background-color: transparent;
    left: 0;
    position: fixed;
    top: 0;
    -webkit-transition: top .4s ease;
    transition: top .4s ease;
    z-index: 10
}

.header-light.hide {
    top: calc(var(--ui-header-height)*-1)
}

.header-light .content {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-height: var(--ui-header-navigation-height);
    min-height: var(--ui-header-navigation-height);
    padding: 0 var(--gutter-sm);
    width: 100%
}

.header-light .content,
.header-light .content>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.header-light .content>div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header-light .logo {
    position: relative;
    top: -2px;
    width: var(--ui-logo-width);
    z-index: 15
}

.header-light .logo img {
    width: 100%
}

.header-light .logo.logo-white {
    display: block
}

.header-light .logo.logo-normal {
    display: none
}

.header-light {
    --anim-offset: 30px;
    --dd-offset-top: 54px
}

@-webkit-keyframes dd-slidedown {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: var(--dd-offset-top)
    }
}

@-webkit-keyframes nav-slideover {
    0% {
        opacity: 0
    }

    to {
        left: 0;
        opacity: 1
    }
}

.header-light nav {
    display: none
}

.header-light nav ul {
    margin: 0;
    padding: 0
}

.header-light nav>ul {
    text-wrap: nowrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-4);
    font-weight: var(--font-weight-bold);
    list-style: none
}

.header-light nav>ul>li {
    display: block;
    position: relative;
    z-index: 2
}

.header-light nav>ul>li a.btn {
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 13px 16px;
    text-align: left;
    -webkit-transition: background-color .3s ease;
    transition: background-color .3s ease
}

.header-light nav>ul>li a.btn:active,
.header-light nav>ul>li a.btn:hover {
    background-color: hsla(0, 0%, 98%, .15)
}

.header-light a.btn#get-started__header {
    background-color: #fff;
    color: var(--blue-6);
    display: none
}

.header-light a.btn#event-cta__header {
    background-color: var(--violet-4);
    color: #fff;
    display: none
}

.header-light .hamburger i {
    position: relative;
    top: 1px
}

.header-light .search {
    display: none;
    overflow: hidden
}

.header-light .search,
.header-light .search i {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header-light .search i {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 100%;
    left: 1px;
    padding: 0 var(--gutter-sm);
    position: relative;
    top: 1px
}

.header-light .search.active {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    height: 50px;
    justify-content: space-between;
    -webkit-transition: width .3s var(--ui-anim-func);
    transition: width .3s var(--ui-anim-func);
    width: 50vw
}

.header-light .search.active form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.header-light .search form {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    display: none;
    flex-grow: 1;
    height: 100%;
    margin: 0 -10px
}

.header-light .search form input {
    background-color: transparent;
    border: none;
    color: #fff;
    font-family: var(--font-gsans);
    font-size: var(--font-size-default);
    font-weight: var(--font-weight-bold);
    padding: 0 8px;
    width: 100%
}

.header-light .search form input::-webkit-input-placeholder {
    color: var(--grey-4)
}

.header-light .search form input::-moz-placeholder {
    color: var(--grey-4)
}

.header-light .search form input:-ms-input-placeholder {
    color: var(--grey-4)
}

.header-light .search form input::-ms-input-placeholder {
    color: var(--grey-4)
}

.header-light .search form input::placeholder {
    color: var(--grey-4)
}

.header-light.mobile-nav-open .content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: var(--gutter-sm);
    row-gap: var(--spacer-md)
}

.header-light.mobile-nav-open .logo {
    top: -1px
}

.header-light.mobile-nav-open .logo.logo-normal {
    display: none
}

.header-light.mobile-nav-open .logo.logo-white {
    display: block
}

.header-light.mobile-nav-open a.btn#get-started__header {
    background-color: #fff !important;
    bottom: 44px;
    color: var(--blue-6) !important
}

.header-light.mobile-nav-open a.btn#event-cta__header,
.header-light.mobile-nav-open a.btn#get-started__header {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    left: var(--gutter-sm);
    position: fixed;
    width: calc(100% - var(--gutter-sm)*2);
    z-index: 15
}

.header-light.mobile-nav-open a.btn#event-cta__header {
    background-color: var(--violet-4) !important;
    bottom: var(--spacer-md);
    color: #fff !important
}

.header-light.mobile-nav-open .close {
    position: absolute;
    right: 24px;
    top: 22px;
    z-index: 15
}

.header-light.mobile-nav-open .close i {
    position: relative;
    top: 1px
}

.header-light.mobile-nav-open nav {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: nav-slideover;
    animation-name: nav-slideover;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    background-color: var(--blue-6);
    -webkit-box-shadow: var(--ui-box-shadow);
    box-shadow: var(--ui-box-shadow);
    display: block;
    height: 100%;
    left: -100%;
    opacity: 0;
    overflow: hidden;
    padding: var(--gutter-lg) var(--gutter-sm);
    position: fixed;
    top: 0;
    width: 100%
}

.header-light.mobile-nav-open nav>ul {
    display: inline-block;
    height: 85%;
    overflow-y: auto;
    position: relative;
    top: 70px;
    width: 100%
}

.header-light.mobile-nav-open nav>ul>li {
    margin-bottom: 5px
}

.header-light.mobile-nav-open nav>ul>li.selected>a i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.header-light.mobile-nav-open nav>ul>li.selected .dd {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: dd-slidedown;
    animation-name: dd-slidedown;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: block
}

.header-light.mobile-nav-open nav>ul>li>a {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    margin-bottom: 3px;
    padding-left: var(--gutter-sm)
}

.header-light.mobile-nav-open nav>ul>li>a i {
    margin-left: 8px;
    position: relative;
    top: 1px;
    -webkit-transition: -webkit-transform .2s var(--ui-anim-func);
    transition: -webkit-transform .2s var(--ui-anim-func);
    transition: transform .2s var(--ui-anim-func);
    transition: transform .2s var(--ui-anim-func), -webkit-transform .2s var(--ui-anim-func)
}

.header-light.mobile-nav-open nav .dd-connector {
    display: none
}

.header-light.mobile-nav-open nav .dd {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: none;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-left: var(--gutter-sm);
    top: 200px
}

.header-light.mobile-nav-open nav .dd ul {
    display: block
}

.header-light.mobile-nav-open nav .dd ul li {
    display: block;
    margin-bottom: 4px
}

.header-light.mobile-nav-open nav .dd ul li a.btn {
    color: var(--grey-2);
    display: inline-block;
    font-weight: var(--font-weight-default);
    height: auto;
    padding: 9px 16px var(--spacer-sm)
}

.header-light.mobile-nav-open nav .dd ul li a.btn.active,
.header-light.mobile-nav-open nav .dd ul li a.btn:active,
.header-light.mobile-nav-open nav .dd ul li a.btn:hover {
    font-weight: var(--font-weight-bold)
}

.header-light.mobile-nav-open nav .dd ul li a.btn:active,
.header-light.mobile-nav-open nav .dd ul li a.btn:hover {
    background-color: hsla(0, 0%, 98%, .15);
    -webkit-transition: background-color .3s, color .3s ease;
    transition: background-color .3s, color .3s ease
}

.header-light.mobile-nav-open .search {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    z-index: 5
}

.header-light.mobile-nav-open .search form {
    margin-left: -20px;
    margin-right: 0
}

@media (min-width:1024px) and (any-hover:hover) {
    .header-light .content {
        padding: 0 var(--gutter)
    }

    .header-light nav {
        background-color: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
        display: inline-block;
        font-size: var(--font-size-default);
        margin-right: 5px
    }

    .header-light nav>ul>li {
        display: inline-block;
        margin-left: var(--spacer-sm)
    }

    .header-light nav>ul>li .dd li.mobile-only,
    .header-light nav>ul>li a i {
        display: none
    }

    .header-light nav>ul>li:hover a.btn {
        background-color: hsla(0, 0%, 98%, .15)
    }

    .header-light nav>ul>li:hover .dd-connector {
        display: block
    }

    .header-light nav>ul>li:hover .dd {
        -webkit-animation-delay: 0ms;
        animation-delay: 0ms;
        -webkit-animation-duration: .3s;
        animation-duration: .3s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
        -webkit-animation-name: dd-slidedown;
        animation-name: dd-slidedown;
        -webkit-animation-timing-function: var(--ui-anim-func);
        animation-timing-function: var(--ui-anim-func);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .header-light nav>ul>li:first-child .dd {
        left: 60%
    }

    .header-light nav>ul>li:nth-child(2) .dd {
        left: 86%;
        width: 245px
    }

    .header-light nav>ul>li:nth-child(3) .dd {
        left: 75%
    }

    .header-light nav>ul>li:nth-child(5) .dd.dd-double {
        width: 338px
    }

    .header-light nav .dd,
    .header-light nav .dd-connector {
        display: none;
        position: absolute
    }

    .header-light nav .dd-connector {
        height: var(--dd-offset-top);
        left: 0;
        top: 0;
        width: 100%;
        z-index: -1
    }

    .header-light nav .dd {
        background-color: #fff;
        border-radius: 6px;
        -webkit-box-shadow: var(--ui-drop-shadow);
        box-shadow: var(--ui-drop-shadow);
        left: 50%;
        min-width: 190px;
        padding: var(--gutter-sm);
        padding-bottom: 18px;
        top: var(--anim-offset);
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        z-index: 11
    }

    .header-light nav .dd ul {
        display: block;
        min-width: 100%
    }

    .header-light nav .dd ul li {
        display: block;
        margin-bottom: 6px
    }

    .header-light nav .dd ul li:last-child {
        padding-bottom: 0
    }

    .header-light nav .dd ul li a.btn {
        color: var(--grey-6);
        display: block;
        font-weight: var(--font-weight-default);
        height: auto;
        margin-left: -8px;
        padding: 9px 16px var(--spacer-sm)
    }

    .header-light nav .dd ul li a.btn.active,
    .header-light nav .dd ul li a.btn:active,
    .header-light nav .dd ul li a.btn:hover {
        font-weight: var(--font-weight-bold)
    }

    .header-light nav .dd ul li a.btn:active,
    .header-light nav .dd ul li a.btn:hover {
        background-color: var(--grey-2);
        color: #000;
        -webkit-transition: background-color .3s, color .3s ease;
        transition: background-color .3s, color .3s ease
    }

    .header-light nav .dd ul li a.subMenu {
        padding-left: 24px
    }

    .header-light nav .dd.dd-double ul {
        min-width: 49%
    }

    .header-light nav .dd.dd-double ul:first-child {
        margin-right: 2%
    }

    .header-light a.btn#event-cta__header,
    .header-light a.btn#get-started__header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .header-light a.btn#event-cta__header {
        margin-left: var(--gutter-sm)
    }

    .header-light .search {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-right: var(--gutter-sm)
    }

    .header-light .hamburger,
    .header-light.searching nav {
        display: none
    }
}

body.interior header:not(.mobile-nav-open) {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

body.interior.in-content header:not(.mobile-nav-open) {
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, .2) !important;
    box-shadow: 0 1px 6px rgba(0, 0, 0, .2) !important
}

body.in-content header:not(.mobile-nav-open),
body.interior header:not(.mobile-nav-open) {
    background-color: #fff;
    -webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
    box-shadow: 0 1px 6px rgba(0, 0, 0, .2);
    top: 0 !important;
    -webkit-transition: background-color .3s, top 300px ease, -webkit-box-shadow .2s;
    transition: background-color .3s, top 300px ease, -webkit-box-shadow .2s;
    transition: background-color .3s, box-shadow .2s, top 300px ease;
    transition: background-color .3s, box-shadow .2s, top 300px ease, -webkit-box-shadow .2s
}

body.in-content header:not(.mobile-nav-open) .logo.logo-white,
body.interior header:not(.mobile-nav-open) .logo.logo-white {
    display: none
}

body.in-content header:not(.mobile-nav-open) .logo.logo-normal,
body.interior header:not(.mobile-nav-open) .logo.logo-normal {
    display: block
}

body.in-content header:not(.mobile-nav-open) nav,
body.interior header:not(.mobile-nav-open) nav {
    color: #000;
    -webkit-transition: color .3s;
    transition: color .3s
}

body.in-content header:not(.mobile-nav-open) nav>ul>li:hover>a.btn,
body.interior header:not(.mobile-nav-open) nav>ul>li:hover>a.btn {
    background-color: transparent
}

body.in-content header:not(.mobile-nav-open) nav>ul>li a.btn,
body.interior header:not(.mobile-nav-open) nav>ul>li a.btn {
    color: var(--grey-6)
}

body.in-content header:not(.mobile-nav-open) nav>ul>li a.btn:hover,
body.interior header:not(.mobile-nav-open) nav>ul>li a.btn:hover {
    background-color: var(--grey-1);
    color: var(--blue-6)
}

body.in-content header:not(.mobile-nav-open) nav>ul>li a.btn.active,
body.interior header:not(.mobile-nav-open) nav>ul>li a.btn.active {
    color: var(--blue-6)
}

body.in-content header:not(.mobile-nav-open) .icon-btn,
body.interior header:not(.mobile-nav-open) .icon-btn {
    color: var(--grey-6)
}

body.in-content header:not(.mobile-nav-open) .icon-btn.active,
body.in-content header:not(.mobile-nav-open) .icon-btn:hover,
body.interior header:not(.mobile-nav-open) .icon-btn.active,
body.interior header:not(.mobile-nav-open) .icon-btn:hover {
    background-color: var(--grey-1)
}

body.in-content header:not(.mobile-nav-open) .search form input,
body.interior header:not(.mobile-nav-open) .search form input {
    color: #000
}

body.in-content header:not(.mobile-nav-open) .search form input::-webkit-input-placeholder,
body.interior header:not(.mobile-nav-open) .search form input::-webkit-input-placeholder {
    color: var(--grey-5)
}

body.in-content header:not(.mobile-nav-open) .search form input::-moz-placeholder,
body.interior header:not(.mobile-nav-open) .search form input::-moz-placeholder {
    color: var(--grey-5)
}

body.in-content header:not(.mobile-nav-open) .search form input:-ms-input-placeholder,
body.interior header:not(.mobile-nav-open) .search form input:-ms-input-placeholder {
    color: var(--grey-5)
}

body.in-content header:not(.mobile-nav-open) .search form input::-ms-input-placeholder,
body.interior header:not(.mobile-nav-open) .search form input::-ms-input-placeholder {
    color: var(--grey-5)
}

body.in-content header:not(.mobile-nav-open) .search form input::placeholder,
body.interior header:not(.mobile-nav-open) .search form input::placeholder {
    color: var(--grey-5)
}

body.in-content header:not(.mobile-nav-open) .search.active,
body.interior header:not(.mobile-nav-open) .search.active {
    background-color: var(--grey-2)
}

body.in-content header:not(.mobile-nav-open) a.btn#get-started__header,
body.interior header:not(.mobile-nav-open) a.btn#get-started__header {
    background-color: var(--blue-6);
    color: #fff
}

body.in-content header:not(.mobile-nav-open) a.btn#event-cta__header,
body.interior header:not(.mobile-nav-open) a.btn#event-cta__header {
    background-color: var(--violet-4);
    color: #fff
}

.header-dark {
    background-color: var(--blue-10) !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    left: 0;
    position: fixed;
    top: 0;
    -webkit-transition: top .4s ease;
    transition: top .4s ease;
    width: 100%;
    z-index: 10
}

.header-dark.hide {
    top: calc(var(--ui-header-height)*-1)
}

.header-dark .content {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    max-height: var(--ui-header-navigation-height);
    min-height: var(--ui-header-navigation-height);
    padding: 0 var(--gutter-sm);
    width: 100%
}

.header-dark .content,
.header-dark .content>div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.header-dark .content>div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header-dark .logo {
    position: relative;
    top: -2px;
    width: var(--ui-logo-width);
    z-index: 15
}

.header-dark .logo img {
    width: 100%
}

.header-dark .logo.logo-white {
    display: block
}

.header-dark .logo.logo-normal {
    display: none
}

.header-dark {
    --anim-offset: 30px;
    --dd-offset-top: 54px
}

@keyframes dd-slidedown {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: var(--dd-offset-top)
    }
}

@keyframes nav-slideover {
    0% {
        opacity: 0
    }

    to {
        left: 0;
        opacity: 1
    }
}

.header-dark nav {
    display: none
}

.header-dark nav ul {
    margin: 0;
    padding: 0
}

.header-dark nav ul a.btn {
    color: var(--grey-1) !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 13px 16px;
    text-align: left;
    -webkit-transition: background-color .3s ease;
    transition: background-color .3s ease
}

.header-dark nav ul a.btn.active,
.header-dark nav ul a.btn:hover {
    background-color: hsla(0, 0%, 100%, .25)
}

.header-dark nav>ul {
    text-wrap: nowrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-4);
    font-weight: var(--font-weight-bold);
    list-style: none
}

.header-dark nav>ul>li {
    display: block;
    position: relative;
    z-index: 2
}

.header-dark nav>ul>li a.btn {
    color: var(--grey-1) !important;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 13px 16px;
    text-align: left;
    -webkit-transition: background-color .3s ease;
    transition: background-color .3s ease
}

.header-dark nav>ul>li a.btn.active,
.header-dark nav>ul>li a.btn:hover {
    background-color: hsla(0, 0%, 100%, .25) !important
}

.header-dark a.btn#get-started__header {
    background-color: #fff !important;
    color: var(--blue-6) !important;
    display: none
}

.header-dark a.btn#event-cta__header {
    background-color: var(--violet-4);
    color: #fff;
    display: none
}

.header-dark .hamburger i {
    position: relative;
    top: 1px
}

.header-dark .search {
    display: none;
    overflow: hidden
}

.header-dark .search,
.header-dark .search i {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.header-dark .search i {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    height: 100%;
    left: 1px;
    padding: 0 var(--gutter-sm);
    position: relative;
    top: 1px
}

.header-dark .search.active {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    height: 50px;
    justify-content: space-between;
    -webkit-transition: width .3s var(--ui-anim-func);
    transition: width .3s var(--ui-anim-func);
    width: 50vw
}

.header-dark .search.active form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.header-dark .search form {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    display: none;
    flex-grow: 1;
    height: 100%;
    margin: 0 -10px
}

.header-dark .search form input {
    background-color: transparent;
    border: none;
    color: #fff;
    font-family: var(--font-gsans);
    font-size: var(--font-size-default);
    font-weight: var(--font-weight-bold);
    padding: 0 8px;
    width: 100%
}

.header-dark .search form input::-webkit-input-placeholder {
    color: var(--grey-4)
}

.header-dark .search form input::-moz-placeholder {
    color: var(--grey-4)
}

.header-dark .search form input:-ms-input-placeholder {
    color: var(--grey-4)
}

.header-dark .search form input::-ms-input-placeholder {
    color: var(--grey-4)
}

.header-dark .search form input::placeholder {
    color: var(--grey-4)
}

.header-dark.mobile-nav-open .content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-top: var(--gutter-sm);
    row-gap: var(--spacer-md)
}

.header-dark.mobile-nav-open .logo {
    top: -1px
}

.header-dark.mobile-nav-open .logo.logo-normal {
    display: none
}

.header-dark.mobile-nav-open .logo.logo-white {
    display: block
}

.header-dark.mobile-nav-open a.btn#get-started__header {
    background-color: #fff !important;
    bottom: 100px;
    color: var(--blue-6) !important
}

.header-dark.mobile-nav-open a.btn#event-cta__header,
.header-dark.mobile-nav-open a.btn#get-started__header {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    left: var(--gutter-sm);
    position: fixed;
    width: calc(100% - var(--gutter-sm)*2);
    z-index: 15
}

.header-dark.mobile-nav-open a.btn#event-cta__header {
    background-color: var(--violet-4) !important;
    bottom: var(--spacer-md);
    color: #fff !important
}

.header-dark.mobile-nav-open .close {
    position: absolute;
    right: 24px;
    top: 22px;
    z-index: 15
}

.header-dark.mobile-nav-open .close i {
    position: relative;
    top: 1px
}

.header-dark.mobile-nav-open nav {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: nav-slideover;
    animation-name: nav-slideover;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    background-color: var(--blue-6);
    -webkit-box-shadow: var(--ui-box-shadow);
    box-shadow: var(--ui-box-shadow);
    display: block;
    height: 100%;
    left: -100%;
    opacity: 0;
    overflow: hidden;
    padding: var(--gutter-lg) var(--gutter-sm);
    position: fixed;
    top: 0;
    width: 100%
}

.header-dark.mobile-nav-open nav>ul {
    display: inline-block;
    height: 90%;
    overflow-y: auto;
    position: relative;
    top: 70px;
    width: 100%
}

.header-dark.mobile-nav-open nav>ul>li {
    margin-bottom: 5px
}

.header-dark.mobile-nav-open nav>ul>li.selected>a i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.header-dark.mobile-nav-open nav>ul>li.selected .dd {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: dd-slidedown;
    animation-name: dd-slidedown;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: block
}

.header-dark.mobile-nav-open nav>ul>li>a {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    margin-bottom: 3px;
    padding-left: var(--gutter-sm)
}

.header-dark.mobile-nav-open nav>ul>li>a i {
    margin-left: 8px;
    position: relative;
    top: 1px;
    -webkit-transition: -webkit-transform .2s var(--ui-anim-func);
    transition: -webkit-transform .2s var(--ui-anim-func);
    transition: transform .2s var(--ui-anim-func);
    transition: transform .2s var(--ui-anim-func), -webkit-transform .2s var(--ui-anim-func)
}

.header-dark.mobile-nav-open nav .dd-connector {
    display: none
}

.header-dark.mobile-nav-open nav .dd {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: none;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-left: var(--gutter-sm);
    top: 200px
}

.header-dark.mobile-nav-open nav .dd ul {
    display: block
}

.header-dark.mobile-nav-open nav .dd ul li {
    display: block;
    margin-bottom: 4px
}

.header-dark.mobile-nav-open nav .dd ul li a.btn {
    color: var(--grey-2);
    display: inline-block;
    font-weight: var(--font-weight-default);
    height: auto;
    padding: 9px 16px var(--spacer-sm)
}

.header-dark.mobile-nav-open nav .dd ul li a.btn.active,
.header-dark.mobile-nav-open nav .dd ul li a.btn:active,
.header-dark.mobile-nav-open nav .dd ul li a.btn:hover {
    font-weight: var(--font-weight-bold)
}

.header-dark.mobile-nav-open nav .dd ul li a.btn:active,
.header-dark.mobile-nav-open nav .dd ul li a.btn:hover {
    background-color: hsla(0, 0%, 98%, .15);
    -webkit-transition: background-color .3s, color .3s ease;
    transition: background-color .3s, color .3s ease
}

.header-dark.mobile-nav-open .search {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    z-index: 5
}

.header-dark.mobile-nav-open .search form {
    margin-left: -20px;
    margin-right: 0
}

@media (min-width:1024px) and (any-hover:hover) {
    .header-dark .content {
        padding: 0 var(--gutter)
    }

    .header-dark nav {
        background-color: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
        display: inline-block;
        font-size: var(--font-size-default);
        margin-right: 5px
    }

    .header-dark nav>ul>li {
        display: inline-block;
        margin-left: var(--spacer-sm)
    }

    .header-dark nav>ul>li .dd li.mobile-only,
    .header-dark nav>ul>li a i {
        display: none
    }

    .header-dark nav>ul>li:hover a.btn:hover {
        background-color: red
    }

    .header-dark nav>ul>li:hover .dd-connector {
        display: block
    }

    .header-dark nav>ul>li:hover .dd {
        -webkit-animation-delay: 0ms;
        animation-delay: 0ms;
        -webkit-animation-duration: .3s;
        animation-duration: .3s;
        -webkit-animation-fill-mode: forwards;
        animation-fill-mode: forwards;
        -webkit-animation-iteration-count: 1;
        animation-iteration-count: 1;
        -webkit-animation-name: dd-slidedown;
        animation-name: dd-slidedown;
        -webkit-animation-timing-function: var(--ui-anim-func);
        animation-timing-function: var(--ui-anim-func);
        background-color: var(--blue-9);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .header-dark nav>ul>li:first-child .dd {
        left: 60%
    }

    .header-dark nav>ul>li:nth-child(2) .dd {
        left: 86%;
        width: 245px
    }

    .header-dark nav>ul>li:nth-child(3) .dd {
        left: 75%
    }

    .header-dark nav>ul>li:nth-child(5) .dd.dd-double {
        width: 338px
    }

    .header-dark nav .dd,
    .header-dark nav .dd-connector {
        display: none;
        position: absolute
    }

    .header-dark nav .dd-connector {
        height: var(--dd-offset-top);
        left: 0;
        top: 0;
        width: 100%;
        z-index: -1
    }

    .header-dark nav .dd {
        background-color: #fff;
        border-radius: 6px;
        -webkit-box-shadow: var(--ui-drop-shadow);
        box-shadow: var(--ui-drop-shadow);
        left: 50%;
        min-width: 190px;
        padding: var(--gutter-sm);
        padding-bottom: 18px;
        top: var(--anim-offset);
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        z-index: 11
    }

    .header-dark nav .dd ul {
        display: block;
        min-width: 100%
    }

    .header-dark nav .dd ul li {
        display: block;
        margin-bottom: 6px
    }

    .header-dark nav .dd ul li:last-child {
        padding-bottom: 0
    }

    .header-dark nav .dd ul li a.btn {
        color: var(--grey-6);
        display: block;
        font-weight: var(--font-weight-default);
        height: auto;
        margin-left: -8px;
        padding: 9px 16px var(--spacer-sm)
    }

    .header-dark nav .dd ul li a.btn.active,
    .header-dark nav .dd ul li a.btn:active,
    .header-dark nav .dd ul li a.btn:hover {
        font-weight: var(--font-weight-bold)
    }

    .header-dark nav .dd ul li a.btn:active,
    .header-dark nav .dd ul li a.btn:hover {
        background-color: var(--grey-2);
        color: #000;
        -webkit-transition: background-color .3s, color .3s ease;
        transition: background-color .3s, color .3s ease
    }

    .header-dark nav .dd ul li a.subMenu {
        padding-left: 24px
    }

    .header-dark nav .dd.dd-double ul {
        min-width: 49%
    }

    .header-dark nav .dd.dd-double ul:first-child {
        margin-right: 2%
    }

    .header-dark a.btn#event-cta__header,
    .header-dark a.btn#get-started__header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    .header-dark a.btn#event-cta__header {
        margin-left: var(--gutter-sm)
    }

    .header-dark .search {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-right: var(--gutter-sm)
    }

    .header-dark .hamburger,
    .header-dark.searching nav {
        display: none
    }
}

body.interior section.hero {
    background-color: transparent;
    overflow: hidden;
    padding: var(--gutter-md) 0
}

body.interior section.hero .container {
    text-align: center
}

body.interior section.hero {
    --img-width: 600px
}

body.interior section.hero .mantle {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: grid;
    gap: var(--gutter-md);
    grid-template-columns: 1fr
}

body.interior section.hero .mantle.full {
    grid-template-columns: 1fr !important
}

body.interior section.hero .mantle.full .text {
    text-align: center !important;
    width: 100%
}

body.interior section.hero .mantle.full .text h1 {
    margin: 0 auto;
    max-width: 100%
}

body.interior section.hero .mantle .text {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    text-align: center
}

body.interior section.hero .mantle .text h1 {
    font-size: var(--font-size-heading-1);
    line-height: 1;
    margin: 0 auto;
    max-width: 485px
}

body.interior section.hero .mantle .text h2 {
    font-size: var(--font-size-heading-3);
    margin-top: var(--spacer-md);
    max-width: auto
}

body.interior section.hero .mantle .media {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

body.interior section.hero .mantle .media img {
    margin: 0 auto;
    max-width: var(--img-width);
    width: 100%
}

body.interior section.hero h2 {
    font-size: var(--font-size-heading-2);
    font-weight: 400;
    margin: var(--gutter-lg) auto var(--spacer);
    max-width: 925px
}

@media (min-width:1024px) {
    body.interior section.hero .mantle {
        gap: var(--gutter-md);
        grid-template-columns: 1fr minmax(0, var(--img-width))
    }

    body.interior section.hero .mantle .text {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        padding-left: var(--gutter);
        text-align: left
    }

    body.interior section.hero .mantle .text h1 {
        font-size: 70px;
        margin: 0
    }

    body.interior section.hero .mantle .media {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }

    body.interior section.hero .mantle .media img {
        max-width: 100%
    }
}

.insert {
    background-color: transparent;
    border-radius: 40px;
    display: grid;
    grid-template-columns: 1fr;
    position: relative
}

.insert .eyebrow {
    color: #000
}

.insert .text {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    padding: var(--gutter);
    z-index: 2
}

.insert .text h4.eyebrow {
    margin-bottom: var(--spacer-sm)
}

.insert .text h3 {
    font-size: var(--font-size-heading-2);
    font-weight: var(--font-weight-default);
    margin-bottom: var(--gutter-sm);
    max-width: 820px
}

.insert .text a,
.insert .text a.btn {
    border-color: #000;
    color: #000;
    font-weight: var(--font-weight-bold)
}

.insert .text a.btn:hover,
.insert .text a:hover {
    background-color: transparent;
    color: #000
}

.insert .text a.btn {
    margin-bottom: var(--spacer-sm)
}

.insert .media {
    position: relative;
    z-index: 1
}

.insert .media img {
    bottom: 0;
    position: absolute;
    right: 0
}

.insert.dart-insert {
    background-image: -webkit-gradient(linear, left top, right top, from(#9cc4f5), to(#b8f0f7));
    background-image: linear-gradient(90deg, #9cc4f5, #b8f0f7)
}

.insert.dart-insert .text h3 {
    margin-bottom: var(--spacer)
}

.insert.dart-insert .media {
    min-height: 325px
}

.insert.dart-insert .media img {
    right: 0
}

.insert.dart-insert.dev .media {
    height: 325px
}

.insert.dart-insert.dev .media img {
    height: 100%;
    left: 50px;
    position: relative
}

.insert.culture-insert {
    background-color: #74c7f7;
    overflow: hidden
}

.insert.culture-insert img {
    bottom: 0;
    height: 100%;
    min-width: 1024px;
    position: absolute;
    right: 0
}

.insert.developer-story-insert {
    background-image: -webkit-gradient(linear, left top, right top, from(#ff8485), to(#f9eac6));
    background-image: linear-gradient(90deg, #ff8485, #f9eac6)
}

.insert.developer-story-insert .media img {
    height: 385px;
    position: static
}

.insert.cta-insert {
    background-color: #042449;
    overflow: hidden
}

.insert.cta-insert .text {
    padding-bottom: 96px;
    padding-top: 96px
}

.insert.cta-insert .media {
    position: static
}

.insert.cta-insert .media img {
    bottom: auto;
    height: 100%;
    top: 0
}

.insert.cta-insert a,
.insert.cta-insert h3,
.insert.cta-insert p {
    color: #fff
}

.insert.cta-insert h3 {
    font-size: var(--font-size-heading-1);
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--gutter-sm)
}

.insert.cta-insert p {
    font-size: var(--font-size-heading-4);
    margin-bottom: 2rem
}

.insert.cta-insert a.btn:not(.quiet) {
    background-color: #fff !important;
    color: var(--blue-6) !important
}

.insert.cta-insert a.btn.quiet,
.insert.cta-insert a.btn.quiet:hover {
    color: #fff !important
}

@media (min-width:1024px) {
    .insert {
        grid-template-columns: 1fr minmax(0, 441px);
        min-height: 315px
    }

    .insert .text {
        padding: 64px 0 64px 64px
    }

    .insert.developer-story-insert .media {
        position: static
    }

    .insert.developer-story-insert .media img {
        position: absolute
    }

    .insert.dart-insert {
        -webkit-column-gap: var(--gutter-sm);
        -moz-column-gap: var(--gutter-sm);
        column-gap: var(--gutter-sm);
        grid-template-columns: 1fr minmax(0, 390px)
    }

    .insert.dart-insert .media {
        min-height: 315px
    }

    .insert.dart-insert.dev .media {
        height: auto;
        min-height: auto
    }

    .insert.dart-insert.dev .media img {
        height: auto;
        left: auto;
        position: absolute
    }

    .insert.cta-insert .text {
        padding: var(--gutter-md)
    }

    .insert.cta-insert .text h3 {
        margin-bottom: var(--spacer-sm)
    }
}

.logos {
    display: grid;
    gap: var(--gutter-sm);
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr))
}

.logos .logos-col.centerpiece>div {
    height: 356px;
    width: 356px
}

.logos .logos-col>div {
    background-color: var(--grey-1);
    border-radius: var(--ui-border-radius-sm);
    -webkit-box-shadow: var(--ui-drop-shadow-sm);
    box-shadow: var(--ui-drop-shadow-sm);
    display: grid;
    height: 163px;
    padding: 37px;
    place-items: center;
    width: 163px
}

.logos .logos-col>div:before {
    content: "";
    display: block;
    grid-area: 1/1/2/2;
    padding-bottom: 100%
}

.logos .logos-col>div img {
    grid-area: 1/1/2/2;
    width: 100%
}

.map button.gm-ui-hover-effect {
    right: 0 !important;
    top: 1px !important
}

.map .map-info-window {
    padding: 20px
}

.map .map-info-window h4 {
    color: var(--primary);
    font-size: 14px;
    font-weight: var(--font-weight-default);
    margin-bottom: var(--spacer-sm)
}

.map .map-info-window h3 {
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--spacer-sm)
}

.map .map-info-window p {
    font-size: var(--font-size-heading-5);
    margin-bottom: var(--gutter-sm)
}

.newsletter {
    display: grid;
    grid-template-columns: 1fr;
    row-gap: var(--gutter)
}

.newsletter .text h2 {
    font-size: var(--font-size-heading-1);
    line-height: 1
}

@-webkit-keyframes slidedown {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: 0
    }
}

@keyframes slidedown {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: 0
    }
}

.newsletter .form {
    overflow: hidden
}

.newsletter .form h3 {
    color: var(--grey-6);
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--spacer-md)
}

.newsletter .form p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--spacer)
}

.newsletter .form .hidden-fields {
    opacity: 0;
    position: relative;
    top: -150px
}

.newsletter .form .hidden-fields.active {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .4s;
    animation-duration: .4s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slidedown;
    animation-name: slidedown;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func)
}

.newsletter .form .optin {
    font-size: var(--font-size-default)
}

.newsletter .form .success h3 {
    margin-bottom: var(--spacer-sm)
}

.newsletter .form .global-error {
    margin-bottom: var(--spacer-md)
}

.newsletter .form .global-error span {
    padding-left: 0
}

.newsletter .form .captcha-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

.newsletter .form .captcha-container .error,
.newsletter .form .captcha-container .g-recaptcha {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.newsletter .form .captcha-container .error {
    padding: 0
}

@media (min-width:1024px) {
    .newsletter {
        grid-template-columns: 40% 1fr
    }
}

#notification.module {
    padding-bottom: 0
}

#notification .notification .notification-message {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: var(--blue-6);
    border-radius: 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-4);
    margin-bottom: 1rem;
    padding: var(--gutter-sm)
}

#notification .notification .notification-message img {
    margin-right: var(--gutter-sm);
    width: 50px
}

#notification .notification .notification-message a {
    color: #fff
}

#notification .notification .notification-message a:hover {
    text-decoration: none
}

#notification .notification .notification-message i svg {
    font-size: .7em
}

#notification .notification .notification-nav {
    display: none;
    padding-left: 2rem
}

#notification .notification .notification-nav span {
    display: inline-block;
    height: 16px;
    margin-right: var(--spacer-sm);
    width: 16px
}

#notification .notification .notification-nav span a {
    background-color: #fff;
    border: 3px solid #dadcdf;
    border-radius: 100%;
    display: block;
    height: 100%;
    -webkit-transition: border-color .2s ease;
    transition: border-color .2s ease;
    width: 100%
}

#notification .notification .notification-nav span.active a,
#notification .notification .notification-nav span:hover a {
    border: 3px solid var(--green-1)
}

@media (min-width:1024px) {
    #notification .notification {
        padding: var(--gutter-sm) 32px
    }

    #notification .notification img {
        width: 60px
    }
}

section#stories {
    background-color: var(--grey-1);
    padding-bottom: var(--gutter-lg)
}

.story-grid .story-grid-header h3 {
    font-size: var(--font-size-heading-2);
    margin-bottom: var(--gutter-md);
    text-align: center
}

.story-grid .story-grid-items {
    -webkit-column-gap: var(--gutter-sm);
    -moz-column-gap: var(--gutter-sm);
    column-gap: var(--gutter-sm);
    display: grid;
    grid-template-columns: 1fr;
    row-gap: var(--gutter)
}

@media (min-width:768px) {
    .story-grid .story-grid-items {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width:1024px) {
    .story-grid .story-grid-items {
        grid-template-columns: repeat(3, 1fr)
    }
}

.story-detail {
    padding: var(--gutter-md) 0 var(--gutter-lg) 0;
    text-align: center
}

.story-detail .story-logo {
    background-color: var(--grey-1);
    border-radius: var(--ui-border-radius-sm);
    -webkit-box-shadow: var(--ui-drop-shadow-sm);
    box-shadow: var(--ui-drop-shadow-sm);
    display: grid;
    height: 128px;
    margin: 0 auto;
    margin-bottom: var(--gutter-md);
    padding: 19px;
    place-items: center;
    width: 128px
}

.story-detail>h1 {
    line-height: 1.2;
    margin: 0 auto var(--gutter-lg);
    max-width: 850px
}

.story-detail>h2 {
    font-size: var(--font-size-heading-2);
    font-weight: 400;
    margin: 0 auto var(--gutter-md);
    max-width: 950px
}

.story-detail h3 {
    font-size: var(--font-size-heading-3);
    margin: 0 auto var(--gutter-sm);
    max-width: 925px
}

.story-detail .btn-row {
    margin-bottom: var(--gutter-sm);
    margin-top: var(--gutter)
}

.story-detail p {
    line-height: 1.5
}

.story-detail p br {
    display: none
}

.story-detail ol,
.story-detail ul {
    list-style-type: decimal;
    margin: 0 0 0 var(--gutter);
    padding: 0
}

.story-detail ol li,
.story-detail ul li {
    line-height: 1.3;
    margin-bottom: var(--spacer-sm)
}

.story-detail ul {
    list-style-type: disc
}

.story-detail ol,
.story-detail p,
.story-detail ul {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--spacer);
    text-align: left
}

.story-detail .embed-container,
.story-detail img.full-width,
.story-detail img.poster {
    margin-bottom: var(--gutter-md);
    width: 100%
}

.story-detail .story-body img.full-width {
    margin-top: var(--gutter-md)
}

.story-detail .success-metrics {
    background-color: transparent;
    background-image: var(--grad-violet-blue-35);
    border-radius: var(--ui-border-radius);
    margin-bottom: var(--gutter-md);
    min-height: 340px;
    padding: var(--gutter-md)
}

.story-detail .success-metrics>h2 {
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--gutter)
}

.story-detail .success-metrics .success-metrics-wrapper {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-column-gap: var(--gutter);
    -moz-column-gap: var(--gutter);
    column-gap: var(--gutter);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    justify-content: center
}

.story-detail .success-metrics .success-metrics-wrapper>div {
    max-width: 195px
}

.story-detail .success-metrics .success-metrics-wrapper>div h4 {
    font-size: 54px;
    margin-bottom: var(--spacer-sm)
}

.story-detail .success-metrics .success-metrics-wrapper>div h3 {
    font-family: var(--font-roboto);
    font-size: var(--font-size-heading-4);
    font-weight: var(--font-weight-default)
}

@media (min-width:1024px) {

    .story-detail ol,
    .story-detail p,
    .story-detail ul {
        padding: 0 var(--gutter-lg)
    }
}

.story-item a:hover h3,
.story-item a:hover h4,
.story-item a:hover p {
    color: var(--primary)
}

.story-item img {
    margin-bottom: var(--gutter-sm);
    width: 100%
}

.story-item.video-item {
    min-width: 544px;
    width: 544px
}

.story-item.video-item .media {
    height: 306px;
    margin-bottom: var(--gutter-sm);
    overflow: hidden;
    padding-top: 56.25%;
    position: relative;
    width: 544px
}

.story-item.video-item .media img {
    left: 0;
    margin-bottom: 0;
    position: absolute;
    top: -51px;
    width: 100%
}

.story-item.video-item .media:hover .play-btn {
    opacity: 1;
    -webkit-transition: opacity .3s;
    transition: opacity .3s
}

.story-item .media {
    position: relative
}

.story-item .play-btn {
    height: 74px;
    left: calc(50% - 37px);
    opacity: .85;
    place-items: center;
    position: absolute;
    top: calc(50% - 37px);
    width: 74px;
    z-index: 1
}

.story-item .text {
    padding-right: var(--gutter-sm)
}

.story-item h4 {
    font-size: 14px;
    font-weight: var(--font-weight-default);
    margin-bottom: 14px
}

.story-item h3 {
    font-size: var(--font-size-heading-3)
}

.story-item h3,
.story-item p {
    margin-bottom: var(--gutter-sm)
}

.story-item p {
    font-size: var(--font-size-heading-4)
}

.tabs {
    --text-width: 394px;
    --anim-offset: 200px
}

.tabs .tabs-footer,
.tabs .tabs-header {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: 60px;
    min-width: 100%;
    text-align: center
}

.tabs .tabs-footer h2,
.tabs .tabs-header h2 {
    font-size: 32px;
    font-weight: 400;
    margin-bottom: 45px;
    max-width: 800px
}

.tabs .tabs-footer {
    margin-top: 40px
}

.tabs .tabs-menu ul {
    text-wrap: nowrap;
    background-color: var(--grey-1);
    border-radius: var(--ui-border-radius);
    display: inline-block;
    overflow: hidden
}

.tabs .tabs-menu ul li {
    border: none;
    max-width: 33.33333%
}

.tabs .tabs-menu ul li:hover {
    background-color: var(--grey-3);
    color: var(--grey-6)
}

.tabs .tabs-menu ul li.active {
    background-color: var(--blue-6);
    color: #fff
}

@media (min-width:1024px) {
    .tabs .tabs-menu ul li {
        max-width: 165px
    }
}

.tabs .tab-content {
    display: none;
    grid-template-columns: 1fr;
    opacity: 0;
    position: relative;
    top: var(--anim-offset)
}

.tabs .tab-content.no-spy {
    top: 0
}

.tabs .tab-content.active {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup;
    animation-name: slideup;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: grid
}

.tabs .tab-content .media img,
.tabs .tab-content .media video {
    margin: 0 auto;
    max-width: 600px;
    width: 100%
}

.tabs .tab-content .text {
    padding: var(--gutter-sm)
}

.tabs .tab-content .text h3 {
    color: #000;
    font-size: var(--font-size-heading-2);
    margin-bottom: var(--gutter-sm)
}

.tabs .tab-content .text p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--spacer)
}

.tabs .extra-content {
    display: none;
    opacity: 0
}

.tabs .extra-content.active {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup;
    animation-name: slideup;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: block
}

@media (min-width:1024px) {
    .tabs .tabs-menu ul li {
        width: 165px
    }

    .tabs .tab-content {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        grid-template-columns: 1fr var(--text-width)
    }

    .tabs .tab-content .media img,
    .tabs .tab-content .media video {
        max-width: 100%
    }
}

.testimonial {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    --logo-size: 111px;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 520px;
    justify-content: flex-end;
    position: relative
}

.testimonial>img {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: var(--ui-card-width)
}

.testimonial .testimonial-wrapper {
    background-color: #fff;
    border-radius: var(--ui-border-radius);
    -webkit-box-shadow: var(--ui-drop-shadow);
    box-shadow: var(--ui-drop-shadow);
    -webkit-column-gap: var(--gutter);
    -moz-column-gap: var(--gutter);
    column-gap: var(--gutter);
    display: grid;
    grid-template-columns: 1fr;
    max-width: calc(var(--logo-size)*10);
    padding: var(--gutter);
    position: relative;
    z-index: 2
}

.testimonial .testimonial-logo {
    background-color: #fff;
    border-radius: var(--ui-border-radius-sm);
    -webkit-box-shadow: var(--ui-drop-shadow-sm);
    box-shadow: var(--ui-drop-shadow-sm);
    display: grid;
    height: var(--logo-size);
    margin-bottom: var(--spacer);
    padding: var(--gutter-sm);
    place-items: center;
    width: var(--logo-size)
}

.testimonial .testimonial-quote {
    font-family: var(--font-gsans)
}

.testimonial .testimonial-quote blockquote p {
    color: #000;
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--gutter-sm)
}

.testimonial .testimonial-quote div.sep {
    border-bottom: 4px solid var(--grey-6);
    margin-bottom: var(--spacer-md);
    margin-top: var(--spacer-md);
    opacity: .5;
    width: 45px
}

.testimonial .testimonial-quote span {
    color: var(--grey-6);
    font-size: var(--font-size-heading-4);
    font-weight: var(--font-weight-bold);
    opacity: .5
}

@media (min-width:1024px) {
    .testimonial .testimonial-wrapper {
        grid-template-columns: var(--logo-size) 1fr
    }
}

body.brand section.hero {
    --lt-blue: #196bd4;
    --dk-blue: #1783e1;
    background-color: var(--primary);
    background-image: linear-gradient(to bottom, var(--lt-blue) 20%, transparent 60%), radial-gradient(ellipse at -50% -150%, transparent 80%, var(--lt-blue) 80%), linear-gradient(145deg, var(--lt-blue) 0, var(--dk-blue) 60%);
    padding: var(--gutter-xl) 0
}

body.brand section.hero .mantle {
    padding: var(--spacer) 0
}

body.brand section.hero .mantle .text h1,
body.brand section.hero .mantle .text h4 {
    color: #fff
}

body.brand section.hero .mantle .text h1 {
    margin-bottom: var(--spacer) !important;
    max-width: 375px !important
}

body.brand section.hero .mantle .btn.quiet {
    color: #fff !important;
    font-weight: 400
}

body.brand section.hero .mantle .btn.quiet:hover {
    text-decoration: underline
}

@media (min-width:768px) {
    body.brand section.hero .mantle .text h1 {
        max-width: 570px !important
    }
}

@media (min-width:1024px) {
    body.brand section.hero .mantle .text h1 {
        max-width: 570px !important
    }
}

body.brand .downloadable-image-harness .downloadable-image {
    background-color: #fff;
    border: 1px solid var(--ui-border-color);
    border-radius: 16px;
    padding: var(--spacer)
}

body.brand .downloadable-image-harness .downloadable-image img {
    max-width: 100%
}

body.brand .downloadable-image-harness .downloadable-options {
    margin-left: 16px;
    padding: 10px 0
}

body.brand .downloadable-image-harness .downloadable-options a {
    color: var(--blue-7);
    display: inline-block;
    font-size: 14px;
    margin-right: 5px
}

body.brand .stacked-feature.brand-feature>hgroup {
    margin-bottom: var(--spacer);
    max-width: 100%;
    padding-left: 0;
    width: 100%
}

body.brand .stacked-feature.brand-feature>hgroup h2 {
    margin-bottom: var(--spacer-md)
}

body.brand .stacked-feature.brand-feature .feature {
    grid-template-columns: 1fr;
    padding: 0
}

body.brand .stacked-feature.brand-feature .feature .text {
    -webkit-box-ordinal-group: 2 !important;
    -ms-flex-order: 1 !important;
    order: 1 !important;
    padding: 0
}

body.brand .stacked-feature.brand-feature .feature .text h3 {
    font-size: var(--font-size-heading-2)
}

body.brand .stacked-feature.brand-feature .feature .media {
    margin-bottom: 0
}

@media (min-width:1024px) {
    body.brand .stacked-feature.brand-feature .feature {
        gap: var(--gutter-sm);
        grid-template-columns: 1fr 50%
    }
}

body.brand .variations hgroup h3 {
    font-size: var(--font-size-heading-2);
    margin-bottom: var(--gutter)
}

body.brand .variations .variation-grid {
    display: grid;
    gap: var(--gutter-sm);
    grid-template-columns: 1fr
}

body.brand .variations .variation-grid>div h4,
body.brand .variations .variation-grid>div p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--gutter-sm)
}

@media (min-width:768px) {
    body.brand .variations .variation-grid {
        grid-template-columns: repeat(2, 1fr)
    }

    body.brand .variations .variation-grid>div p {
        min-height: 85px
    }
}

@media (min-width:1024px) {
    body.brand .variations .variation-grid {
        grid-template-columns: repeat(4, 1fr)
    }

    body.brand .variations .variation-grid>div p {
        min-height: 120px
    }
}

body.brand .compare-cols {
    --green: #158477;
    --red: #d43324;
    display: grid;
    gap: var(--gutter-sm);
    grid-template-columns: 1fr
}

body.brand .compare-cols .image-harness {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: #fff;
    border: 1px solid var(--ui-border-color);
    border-radius: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
    padding: 35px 0
}

body.brand .compare-cols .compare-label {
    font-size: var(----font-size-default);
    font-weight: 400;
    padding: var(--spacer-sm) 0
}

body.brand .compare-cols .compare-label span {
    font-weight: 700
}

body.brand .compare-cols .compare-label.good {
    border-top: 12px solid var(--green);
    color: var(--green)
}

body.brand .compare-cols .compare-label.bad {
    border-top: 12px solid var(--red);
    color: var(--red)
}

@media (min-width:768px) {
    body.brand .compare-cols {
        grid-template-columns: 1fr 1fr
    }
}

body.brand .subsection {
    padding-top: var(--gutter-md)
}

body.brand .subsection hgroup {
    margin-bottom: var(--gutter)
}

body.brand .subsection hgroup h3 {
    font-size: var(--font-size-heading-2);
    margin-bottom: var(--gutter-sm)
}

body.brand .subsection hgroup p {
    font-size: var(--font-size-heading-4)
}

@media (min-width:1024px) {
    body.brand .subsection {
        padding-top: var(--gutter-lg)
    }

    body.brand .subsection hgroup {
        margin-bottom: var(--gutter-md)
    }
}

body.brand section#logo {
    margin: var(--gutter-md) 0
}

body.brand section#logo .stacked-feature hgroup {
    margin-bottom: var(--gutter)
}

body.brand section#logo .downloadable-image-harness .downloadable-image {
    padding: var(--gutter-lg) var(--gutter-md)
}

@media (min-width:768px) {
    body.brand section#logo .downloadable-image-harness .downloadable-image {
        padding: var(--gutter-lg) 150px
    }
}

@media (min-width:1024px) {
    body.brand section#logo {
        margin: var(--gutter-lg) 0
    }

    body.brand section#logo .downloadable-image-harness .downloadable-image {
        padding: var(--gutter-lg) var(--gutter-md)
    }
}

body.brand section#logo-color-variations {
    background-image: var(--grad-blue-light-35);
    padding: var(--gutter-md) 0
}

body.brand section#logo-color-variations .variation-grid>div .downloadable-image {
    background-color: var(--blue-10);
    padding: 110px 70px
}

body.brand section#logo-color-variations .variation-grid>div:first-child .downloadable-image {
    background-color: #fff
}

@media (min-width:1024px) {
    body.brand section#logo-color-variations {
        padding: var(--gutter-lg) 0
    }

    body.brand section#logo-color-variations .variation-grid>div .downloadable-image {
        padding: 110px 60px
    }
}

body.brand section#logo-variations {
    background-color: var(--grey-1);
    padding: var(--gutter-md) 0
}

body.brand section#logo-variations .variation-grid>div .downloadable-image {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 370px;
    justify-content: center
}

body.brand section#logo-variations .variation-grid>div:first-child .downloadable-image img {
    width: 115px
}

body.brand section#logo-variations .variation-grid>div:nth-child(2) .downloadable-image img {
    width: 92px
}

body.brand section#logo-variations .variation-grid>div:nth-child(3) .downloadable-image img {
    width: 300px
}

@media (min-width:1024px) {
    body.brand section#logo-variations {
        padding: var(--gutter-lg) 0
    }

    body.brand section#logo-variations .variation-grid {
        grid-template-columns: repeat(3, 1fr)
    }

    body.brand section#logo-variations .variation-grid>div p {
        min-height: 100px
    }

    body.brand section#logo-variations .variation-grid>div .downloadable-image {
        padding: 110px 60px
    }
}

body.brand section#logo-sizing-spacing {
    padding-bottom: var(--spacer)
}

body.brand section#logo-sizing-spacing .compare-cols {
    background-color: #fff;
    border: 1px solid var(--ui-border-color);
    border-radius: 16px;
    gap: 30px;
    padding: 40px
}

@media (min-width:768px) {
    body.brand section#logo-sizing-spacing .compare-cols {
        grid-template-columns: 1fr;
        padding: 80px
    }
}

@media (min-width:1024px) {
    body.brand section#logo-sizing-spacing .compare-cols {
        grid-template-columns: minmax(0, 1fr) minmax(0, 499px);
        padding: 120px 100px
    }
}

body.brand section#logo-alignment {
    padding-bottom: var(--gutter-lg)
}

body.brand section#logo-alignment .image-harness img {
    max-width: 300px
}

body.brand section#logo-contrast {
    background-color: var(--grey-1);
    padding-bottom: var(--spacer)
}

body.brand section#logo-contrast .compare-cols .image-harness {
    padding: 138px 0
}

body.brand section#logo-contrast .compare-cols .image-harness img {
    max-width: 65%
}

body.brand section#logo-contrast .compare-cols>div:first-child .image-harness {
    background-color: #2968d0
}

body.brand section#logo-contrast .compare-cols>div:nth-child(2) .image-harness {
    background-color: #53b7f7
}

body.brand section#logo-ligatures {
    background-color: var(--grey-1);
    padding-bottom: var(--gutter-md)
}

body.brand section#logo-ligatures .compare-cols .image-harness {
    padding: 45px
}

body.brand section#logo-ligatures .compare-cols .image-harness img {
    max-width: 85%
}

@media (min-width:1024px) {
    body.brand section#logo-ligatures {
        padding-top: var(--gutter-lg)
    }

    body.brand section#logo-ligatures .compare-cols .image-harness img {
        max-width: 70%
    }
}

body.brand section#color {
    padding-bottom: var(--gutter-lg)
}

body.brand section#color hgroup {
    margin-bottom: var(--spacer)
}

body.brand section#color hgroup h2 {
    font-size: var(--font-size-heading-1)
}

body.brand section#color .colors-row {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: grid;
    gap: 0;
    grid-template-columns: 1fr
}

body.brand section#color .colors-row.colors-primary .colors-grid .color:first-child .color-chip {
    background-color: #042b59
}

body.brand section#color .colors-row.colors-primary .colors-grid .color:nth-child(2) .color-chip {
    background-color: #0553b1
}

body.brand section#color .colors-row.colors-primary .colors-grid .color:nth-child(3) .color-chip {
    background-color: #027dfd
}

body.brand section#color .colors-row.colors-secondary {
    padding-bottom: var(--spacer-md)
}

body.brand section#color .colors-row.colors-secondary .colors-grid .color:first-child .color-chip {
    background-color: #f25d50
}

body.brand section#color .colors-row.colors-secondary .colors-grid .color:nth-child(2) .color-chip {
    background-color: #fff275
}

body.brand section#color .colors-row.colors-secondary .colors-grid .color:nth-child(3) .color-chip {
    background-color: #6200ee
}

body.brand section#color .colors-row.colors-secondary .colors-grid .color:nth-child(4) .color-chip {
    background-color: #1cdac5
}

body.brand section#color .colors-grid {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    display: grid;
    gap: 16px;
    order: 2;
    padding: var(--spacer) 0
}

body.brand section#color .colors-grid .color-chip {
    aspect-ratio: 1/1;
    width: 100%
}

body.brand section#color .colors-grid.col-3 {
    grid-template-columns: repeat(3, 1fr)
}

body.brand section#color .colors-grid.col-4 {
    grid-template-columns: repeat(4, 1fr)
}

body.brand section#color .colors-desc {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1
}

body.brand section#color .colors-desc h3 {
    font-size: var(--font-size-heading-2);
    margin-bottom: var(--gutter-sm)
}

body.brand section#color .colors-desc p {
    font-size: var(--font-size-heading-4)
}

body.brand section#color .color .color-chip {
    border-radius: var(--ui-border-radius-sm)
}

body.brand section#color .color .color-desc {
    display: block;
    min-width: 100%;
    padding: var(--spacer-sm) 0
}

body.brand section#color .color .color-desc h4 {
    font-size: 16px;
    margin-bottom: 5px
}

body.brand section#color .color .color-desc h5 {
    color: var(--grey-6);
    font-size: 14px;
    font-weight: 400
}

body.brand section#color .colors-grid.col-4 .color-desc {
    display: block
}

@media (min-width:1024px) {
    body.brand section#color .colors-row {
        gap: var(--gutter-lg);
        grid-template-columns: 55% 1fr
    }

    body.brand section#color .colors-row .colors-grid {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        gap: var(--gutter-sm);
        order: 1
    }

    body.brand section#color .colors-row .colors-desc {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2
    }

    body.brand section#color .color .color-desc {
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        align-items: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        justify-content: space-between
    }
}

body.brand section#dash {
    padding-bottom: var(--gutter)
}

body.brand section#dash .feature {
    gap: var(--gutter);
    padding: 0
}

body.brand section#dash .feature .text {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    padding-right: var(--gutter)
}

body.brand section#dash .feature .media {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2
}

body.brand section#dash .feature .media .downloadable-image {
    padding: 90px 45px
}

@media (min-width:1024px) {
    body.brand section#dash .feature {
        gap: var(--gutter-md);
        grid-template-columns: 1fr 50%
    }

    body.brand section#dash .feature .text {
        padding-right: 0
    }
}

body.buildWithAI section.hero {
    background-image: linear-gradient(35deg, #dcf5ff 10%, #f3fcff 60%)
}

body.buildWithAI #notification.module {
    padding-bottom: 0 !important;
    padding-top: var(--gutter)
}

@media (min-width:1024px) {
    body.buildWithAI .tabs .tab-content {
        grid-template-columns: 1fr 1fr
    }

    body.buildWithAI .tabs .media {
        margin: 0 5rem 0 auto;
        max-width: 330px !important
    }
}

body.buildWithAI .tabs .tabs-menu {
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: none
}

body.buildWithAI .tabs .tabs-menu ul>li {
    max-width: unset !important;
    width: auto !important
}

body.buildWithAI #feature-columns {
    padding-top: 0
}

body.buildWithAI #feature-columns .feature-column-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

body.buildWithAI #feature-columns .feature-column-container img {
    margin-top: auto
}

body.buildWithAI #feature-grid {
    background: linear-gradient(124.64deg, var(--blue-5) 0, var(--violet-4) 100%)
}

body.buildWithAI #find-inspiration-carousel {
    background-color: transparent;
    padding: 56px 0
}

body.buildWithAI #find-inspiration-carousel hgroup {
    padding-left: 0 !important
}

@media (min-width:1024px) {
    body.buildWithAI #find-inspiration-carousel {
        padding: var(--gutter-md) 0
    }
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider {
    padding: 20px 0 50px
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item {
    max-width: 222px;
    min-width: 222px
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item:first-child {
    margin-left: var(--gutter)
}

@media (min-width:1280px) {
    body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item:first-child {
        margin-left: var(--gutter-auto)
    }
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item img {
    max-width: 222px;
    min-width: 222px
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item .text {
    padding-right: 0
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item .text h3 {
    font-size: 24px
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item .learn-more-button {
    display: none
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item a {
    cursor: pointer
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-slider .story-item a:hover {
    color: var(--blue-6)
}

body.buildWithAI #find-inspiration-carousel .carousel .carousel-progress .carousel-completed {
    border-radius: 4px;
    height: 4px;
    margin-bottom: 32px
}

body.community section.hero {
    padding-bottom: 0
}

body.community section.hero h1 {
    margin: 0 auto var(--gutter-lg);
    max-width: 885px
}

body.community section.hero .success-metrics {
    background-color: transparent;
    background-image: var(--grad-yellow-blue-35);
    border-radius: var(--ui-border-radius);
    padding: var(--gutter-md)
}

body.community section.hero .success-metrics .success-metrics-wrapper {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    align-items: flex-start;
    -webkit-column-gap: var(--gutter);
    -moz-column-gap: var(--gutter);
    column-gap: var(--gutter);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: wrap;
    flex-flow: wrap;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 990px;
    padding: 0 var(--gutter-sm)
}

body.community section.hero .success-metrics .success-metrics-wrapper .success-metric {
    margin-bottom: var(--gutter);
    text-align: left
}

body.community section.hero .success-metrics .success-metrics-wrapper .success-metric h4 {
    border-left: 3px solid var(--grey-5);
    font-size: 54px;
    line-height: .7;
    margin-bottom: 18px;
    padding-left: 20px
}

body.community section.hero .success-metrics .success-metrics-wrapper .success-metric:first-child h4 {
    border-color: var(--violet-4)
}

body.community section.hero .success-metrics .success-metrics-wrapper .success-metric:nth-child(2) h4 {
    border-color: var(--primary)
}

body.community section.hero .success-metrics .success-metrics-wrapper .success-metric:nth-child(3) h4 {
    border-color: var(--green-1)
}

body.community section.hero .success-metrics .success-metrics-wrapper .success-metric h3 {
    font-family: var(--font-roboto);
    font-size: var(--font-size-heading-4);
    font-weight: var(--font-weight-default);
    padding-left: 20px
}

body.community section.hero .success-metrics h2 {
    font-size: var(--font-size-heading-2);
    margin: 0 auto var(--spacer-md);
    max-width: 775px
}

body.community section.hero .success-metrics h2:first-child {
    margin-bottom: var(--gutter-md)
}

body.community section.hero .success-metrics p {
    font-family: var(--font-gsans);
    font-size: 16px;
    font-weight: var(--font-weight-bold)
}

@media (min-width:1024px) {
    body.community section.hero .scuess-metrics-wrapper {
        margin-bottom: var(--gutter-md);
        padding: var(--gutter-lg)
    }

    body.community section.hero .scuess-metrics-wrapper .success-metric {
        margin-bottom: 0
    }
}

body.community section.content-container {
    padding-top: var(--gutter-md)
}

body.community #gdes {
    background-image: var(--grad-liteyellow-blue)
}

body.community #community-events .feature-header hgroup {
    max-width: 750px
}

body.community #map .map {
    background-color: #eee;
    height: 700px
}

body.community #map .map .cluster img {
    height: 100% !important;
    width: 100% !important
}

body.community #twitter {
    padding: var(--gutter-sm) 0
}

body.community #twitter .text {
    -webkit-box-ordinal-group: 2 !important;
    -ms-flex-order: 1 !important;
    order: 1 !important
}

body.community #twitter .media {
    -webkit-box-ordinal-group: 3 !important;
    -ms-flex-order: 2 !important;
    order: 2 !important
}

body.community #twitter .social-icons {
    margin-bottom: var(--gutter)
}

body.community #twitter .social-icons>div {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

body.community #twitter .social-icons>div a {
    margin-right: 1.25rem
}

body.community #twitter .social-icons>div span {
    color: var(--grey-6);
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-5)
}

@media (min-width:1024px) {
    body.community #twitter .feature {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        grid-template-columns: 1fr 55%
    }

    body.community #twitter .twitter-embed {
        position: relative;
        top: -8px
    }

    body.community #twitter .social-icons {
        margin-bottom: 0
    }
}

body.community #community-grid {
    --dk-purple: #0e0e4c;
    --md-purple: #00186b;
    --lt-purple: #34137e;
    background-color: var(--dk-purple);
    background-image: linear-gradient(to bottom, var(--dk-purple) 20%, transparent 60%), radial-gradient(ellipse at -50% -150%, transparent 80%, var(--dk-purple) 80%), linear-gradient(145deg, var(--dk-purple) 0, var(--lt-purple) 60%)
}

body.community #community-grid>div a .icon {
    margin-bottom: var(--spacer-md);
    max-height: 74px;
    max-width: 74px
}

body.community #community-grid>div a .icon.framed-icon {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    background-color: #fff;
    border-radius: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 74px;
    justify-content: center;
    padding: 12px;
    width: 74px
}

body.community #community-grid>div a .icon.framed-icon img {
    width: 100%
}

body.community #community-grid>div a .icon img {
    margin-bottom: 0
}

body.community .dart-insert {
    background-image: -webkit-gradient(linear, left top, right top, from(#5bccfc), to(#beeafe));
    background-image: linear-gradient(90deg, #5bccfc, #beeafe);
    grid-template-columns: 1fr;
    overflow: hidden
}

body.community .dart-insert .media {
    position: static
}

body.community .dart-insert .media img {
    bottom: auto;
    height: 100%;
    top: 0;
    width: auto
}

body.communityEvents section.hero {
    background-image: var(--grad-yellow-blue-75)
}

body.communityEvents .hero .text h3 {
    font-size: var(--font-size-heading-1);
    line-height: 1;
    margin-bottom: var(--spacer-md)
}

body.communityEvents .hero .text p {
    font-size: var(--font-size-heading-4);
    margin-bottom: var(--spacer-md)
}

body.communityEvents .story-grid {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center
}

body.communityEvents .story-grid button {
    margin-top: 16px
}

body.communityEvents .story-grid .story-grid-header h3 {
    padding-top: 112px;
    text-align: left
}

body.communityEvents .story-grid .story-grid-items .story-item .text h3 {
    margin-top: 12px
}

body.communityEvents #newsletter {
    margin-top: var(--gutter-lg)
}

body.culture section.hero {
    background-image: linear-gradient(35deg, #dcf5ff 50%, #f3fcff 90%)
}

body.culture section.hero .container>h2 {
    font-size: var(--font-size-heading-2);
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--gutter-sm)
}

body.culture section.hero .container>p {
    font-family: var(--font-gsans);
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--gutter)
}

body.culture section.hero .container>h3 {
    font-size: var(--font-size-heading-3);
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--gutter-sm)
}

body.culture #feature-columns .feature-columns>div {
    border-color: var(--blue-4)
}

body.culture #code {
    background-image: linear-gradient(35deg, #dcf5ff 10%, #f3fcff 60%);
    padding: var(--gutter-xl) 0
}

body.culture #code>.container {
    margin: 0 auto;
    max-width: 886px
}

body.culture #code .stacked-header hgroup {
    margin-bottom: 81px;
    max-width: 660px;
    padding-left: 0
}

body.culture #code .story-detail {
    padding: 0;
    text-align: left
}

body.culture #code .story-detail br {
    display: block
}

body.culture #code .story-detail ol,
body.culture #code .story-detail p,
body.culture #code .story-detail ul {
    padding: 0
}

body.culture #code .story-detail ol a,
body.culture #code .story-detail ol a:hover,
body.culture #code .story-detail p a,
body.culture #code .story-detail p a:hover,
body.culture #code .story-detail ul a,
body.culture #code .story-detail ul a:hover {
    color: var(--grey-6);
    text-decoration: underline
}

body.developers section.hero {
    background-image: var(--grad-blue-green-145)
}

body.developers #feature-grid {
    --lt-blue: #196bd4;
    --dk-blue: #1783e1;
    background-color: var(--primary);
    background-image: linear-gradient(to bottom, var(--lt-blue) 20%, transparent 60%), radial-gradient(ellipse at -50% -150%, transparent 80%, var(--lt-blue) 80%), linear-gradient(145deg, var(--lt-blue) 0, var(--dk-blue) 60%)
}

body.developers #stories hgroup h2 {
    max-width: 650px
}

body.ecosystem section.hero {
    background: var(--grad-red-blue-35)
}

body.ecosystem #consultants-feature,
body.ecosystem #consultants-packages {
    background: var(--grad-liteyellow-blue)
}

body.events section.hero {
    background-image: var(--grad-blue-yellow-35)
}

body.events #notification.module {
    background-color: var(--grey-1)
}

body.events .carousel-featured-card.flutter-apprentice .text {
    background-color: var(--blue-7)
}

body.events .carousel-featured-card.flutter-engage .text {
    background-color: var(--blue-4)
}

body.events #newsletter {
    margin-top: var(--gutter-lg)
}

body.events .event_image_container {
    margin-bottom: var(--gutter-sm);
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
    width: 100%
}

body.events .event_image_container>img {
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 0;
    width: 100%
}

body.events.event-detail .story-detail>h1 {
    margin-bottom: var(--spacer-md)
}

body.events.event-detail .story-detail>h2 {
    font-size: var(--font-size-heading-3);
    max-width: 725px
}

body.events.event-detail .story-detail .story-logo {
    padding: 35px
}

body.events.event-detail .story-detail .story-logo img {
    left: -3px;
    position: relative;
    top: -6px
}

body.events.event-detail .story-detail .story-body {
    margin: 0 auto;
    max-width: 950px
}

body.events.event-detail .story-detail .story-cta-button {
    margin-bottom: 3rem;
    position: relative;
    top: -1rem
}

body.events.event-detail .story-detail .story-cta-button a.btn {
    font-size: var(--font-size-heading-5);
    height: 50px;
    padding: 0 var(--gutter)
}

body.events.event-detail.event-challenge .story-detail>h1 {
    max-width: 90% !important
}

body.events.event-detail #mentions hgroup,
body.events.event-detail #sessions hgroup,
body.events.event-detail #winners hgroup {
    margin-bottom: var(--gutter-sm)
}

body.events.event-detail #sessions,
body.events.event-detail #winners {
    background-color: var(--grey-1)
}

body.events.event-detail .event-sessions,
body.events.event-detail .event-winners {
    -webkit-column-gap: var(--gutter);
    -moz-column-gap: var(--gutter);
    column-gap: var(--gutter);
    display: grid;
    padding: var(--spacer) 0;
    row-gap: var(--gutter-md);
    text-align: left
}

body.events.event-detail .event-sessions .event-session img,
body.events.event-detail .event-sessions .event-winner img,
body.events.event-detail .event-winners .event-session img,
body.events.event-detail .event-winners .event-winner img {
    margin-bottom: 16px;
    width: 100%
}

body.events.event-detail .event-sessions .event-session h3,
body.events.event-detail .event-sessions .event-winner h3,
body.events.event-detail .event-winners .event-session h3,
body.events.event-detail .event-winners .event-winner h3 {
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 10px;
    text-align: center
}

body.events.event-detail .event-sessions .event-session h3 span,
body.events.event-detail .event-sessions .event-winner h3 span,
body.events.event-detail .event-winners .event-session h3 span,
body.events.event-detail .event-winners .event-winner h3 span {
    color: var(--grey-6);
    font-weight: 400
}

body.events.event-detail .event-sessions .event-session h4,
body.events.event-detail .event-sessions .event-winner h4,
body.events.event-detail .event-winners .event-session h4,
body.events.event-detail .event-winners .event-winner h4 {
    font-size: var(--font-size-heading-3);
    line-height: 1.1;
    margin-bottom: var(--spacer-sm);
    max-width: 90%
}

body.events.event-detail .event-sessions .event-session p,
body.events.event-detail .event-sessions .event-winner p,
body.events.event-detail .event-winners .event-session p,
body.events.event-detail .event-winners .event-winner p {
    font-size: var(--font-size-heading-5)
}

body.events.event-detail .event-sessions .event-session a:hover h4,
body.events.event-detail .event-sessions .event-session a:hover p,
body.events.event-detail .event-sessions .event-winner a:hover h4,
body.events.event-detail .event-sessions .event-winner a:hover p,
body.events.event-detail .event-winners .event-session a:hover h4,
body.events.event-detail .event-winners .event-session a:hover p,
body.events.event-detail .event-winners .event-winner a:hover h4,
body.events.event-detail .event-winners .event-winner a:hover p {
    color: var(--primary)
}

@media (min-width:768px) {

    body.events.event-detail .event-sessions,
    body.events.event-detail .event-winners {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width:1024px) {

    body.events.event-detail .event-sessions,
    body.events.event-detail .event-winners {
        grid-template-columns: repeat(3, 1fr)
    }
}

body.events.event-detail .event-mentions,
body.events.event-detail .other-sessions {
    padding: var(--spacer) 0
}

body.events.event-detail .event-mentions ul,
body.events.event-detail .other-sessions ul {
    -webkit-column-count: 1;
    -moz-column-count: 1;
    column-count: 1;
    line-height: 1.5
}

body.events.event-detail .event-mentions ul li,
body.events.event-detail .other-sessions ul li {
    font-size: var(--font-size-heading-5);
    margin-bottom: 12px
}

body.events.event-detail .event-mentions ul li a,
body.events.event-detail .other-sessions ul li a {
    color: var(--primary)
}

body.events.event-detail .event-mentions ul li a:hover,
body.events.event-detail .other-sessions ul li a:hover {
    text-decoration: underline
}

@media (min-width:768px) {

    body.events.event-detail .event-mentions ul,
    body.events.event-detail .other-sessions ul {
        -webkit-column-count: 2;
        -moz-column-count: 2;
        column-count: 2
    }
}

@media (min-width:1024px) {

    body.events.event-detail .event-mentions ul,
    body.events.event-detail .other-sessions ul {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3
    }
}

body.events #stories .story-grid-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

body.events #stories .story-grid-header h3 {
    margin-bottom: var(--gutter-sm);
    width: 100%
}

body.events #stories .story-grid-header .dropdown {
    margin-bottom: var(--gutter-sm)
}

@media (min-width:768px) {
    body.events #stories .story-grid-header {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-align: normal;
        -ms-flex-align: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        align-items: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: space-between
    }

    body.events #stories .story-grid-header h3 {
        margin-bottom: var(--gutter-md);
        text-align: left
    }

    body.events #stories .story-grid-header .dropdown {
        margin-bottom: 0
    }
}

body.events #stories .story-item .text div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1rem;
    margin-bottom: var(--gutter-sm)
}

body.events #stories .story-item .text div span {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

body.events #stories .story-item .text div span img {
    height: 15px;
    margin: 0 0 2px;
    max-width: 12px
}

body.events #stories .story-item .text div span label {
    text-wrap: nowrap
}

body.games #notification.module {
    background-color: var(--blue-10)
}

body.games section.hero {
    --mobile-header-max-height: 360px;
    --desktop-header-max-height: 460px;
    background: linear-gradient(124.64deg, #027dfd, #833ef2);
    padding-bottom: var(--gutter);
    padding-top: var(--gutter)
}

body.games section.hero .img-container {
    height: var(--mobile-header-max-height);
    position: relative
}

body.games section.hero .img-container img {
    left: 0;
    max-height: var(--mobile-header-max-height);
    max-width: 100% !important;
    opacity: 0;
    position: absolute;
    right: 0;
    width: auto !important
}

body.games section.hero .img-container img:first-child {
    -webkit-animation: fadeInOut1 8s infinite;
    animation: fadeInOut1 8s infinite
}

body.games section.hero .img-container img:nth-child(2) {
    -webkit-animation: fadeInOut2 8s infinite;
    animation: fadeInOut2 8s infinite
}

body.games section.hero .img-container img:nth-child(3) {
    -webkit-animation: fadeInOut3 8s infinite;
    animation: fadeInOut3 8s infinite
}

@-webkit-keyframes fadeInOut1 {

    16.6%,
    26.6% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    0%,
    33.2%,
    to {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3)
    }
}

@keyframes fadeInOut1 {

    16.6%,
    26.6% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    0%,
    33.2%,
    to {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3)
    }
}

@-webkit-keyframes fadeInOut2 {

    49.8%,
    59.8% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    0%,
    33.2%,
    66.4%,
    to {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3)
    }
}

@keyframes fadeInOut2 {

    49.8%,
    59.8% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    0%,
    33.2%,
    66.4%,
    to {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3)
    }
}

@-webkit-keyframes fadeInOut3 {

    83%,
    93% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    0%,
    33.2%,
    66.4%,
    to {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3)
    }
}

@keyframes fadeInOut3 {

    83%,
    93% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }

    0%,
    33.2%,
    66.4%,
    to {
        opacity: 0;
        -webkit-transform: scale(.3);
        transform: scale(.3)
    }
}

@media (min-width:1024px) {
    body.games section.hero .img-container {
        height: var(--desktop-header-max-height)
    }

    body.games section.hero .img-container img {
        max-height: var(--desktop-header-max-height)
    }
}

body.games section.hero .container {
    padding: 0
}

body.games section.hero .container .mantle .text {
    padding: 0 16px
}

body.games section.hero .container .mantle .text h1,
body.games section.hero .container .mantle .text h2 {
    color: #fff;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content
}

body.games section.hero .container .mantle .text h1 {
    font-size: 34px;
    line-height: 44px;
    text-align: left
}

body.games section.hero .container .mantle .text h2 {
    font-size: 24px;
    line-height: 32px;
    margin-bottom: 0;
    margin-top: 16px;
    text-align: left
}

@media (min-width:1024px) {
    body.games section.hero {
        padding-bottom: var(--gutter-lg) !important;
        padding-top: var(--gutter-lg) !important
    }

    body.games section.hero .img-container {
        height: 490px
    }

    body.games section.hero .container {
        width: calc(100% - var(--gutter)*2)
    }

    body.games section.hero .container>h2 {
        margin: 48px auto
    }

    body.games section.hero .container .mantle {
        gap: 96px;
        grid-template-columns: 1fr 1fr
    }

    body.games section.hero .container .mantle .text {
        padding-left: 0
    }

    body.games section.hero .container .mantle .text h1 {
        font-size: 48px;
        line-height: 48px
    }

    body.games section.hero .container .mantle .text h2 {
        font-size: 36px;
        line-height: 43px
    }

    body.games section.hero h2 {
        max-width: unset
    }
}

body.games section.content-container {
    background-color: var(--blue-10)
}

body.games .body {
    color: var(--grey-3)
}

body.games .body,
body.games p {
    font-size: var(--font-size-heading-4)
}

body.games .btn:hover {
    background-color: hsla(0, 0%, 100%, .25)
}

body.games a.quiet:hover {
    color: var(--blue-4) !important
}

@media (min-width:1024px) {
    body.games #feature-columns.module {
        padding: 48px 0 !important
    }
}

body.games #feature-columns.module {
    padding: 0
}

body.games #feature-columns .feature-columns {
    gap: 0
}

body.games #feature-columns .feature-columns .feature-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    border-bottom: 4px solid hsla(0, 0%, 100%, .2);
    border-top: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    gap: 32px;
    padding: 24px 0 0
}

@media (min-width:1024px) {
    body.games #feature-columns .feature-columns .feature-wrapper {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        border-bottom: none;
        border-top: 4px solid hsla(0, 0%, 100%, .2);
        -ms-flex-direction: column;
        flex-direction: column;
        gap: 0
    }
}

body.games #feature-columns .feature-columns .feature-wrapper .text h3 {
    font-size: 28px
}

body.games #feature-columns .feature-columns .feature-wrapper h3 {
    color: var(--grey-1)
}

@media (min-width:1024px) {
    body.games #feature-columns .feature-columns {
        gap: var(--gutter)
    }

    body.games #feature-columns .feature-columns p {
        min-height: 141px
    }
}

body.games #tabs {
    padding-bottom: var(--spacer);
    padding-top: var(--spacer)
}

body.games #tabs .tabs .tabs-title {
    color: var(--grey-1);
    font-size: 24px;
    font-weight: 400;
    line-height: 32px;
    margin: 48px 0;
    text-align: left
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-title {
        font-size: 28px;
        padding: 0 84px;
        text-align: center
    }
}

body.games #tabs .tabs .tabs-header {
    display: block
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }

    body.games #tabs .tabs .tabs-header .tabs-menu {
        width: unset !important
    }
}

body.games #tabs .tabs .tabs-header .tabs-menu {
    display: block;
    padding: 0
}

body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper {
    -ms-overflow-style: none;
    background-color: transparent;
    border-radius: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    overflow: scroll;
    scrollbar-width: none
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper {
        background-color: hsla(0, 0%, 100%, .2);
        border-radius: 24px;
        display: inline-block;
        overflow: hidden
    }

    body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper li {
        font-size: 16px !important;
        padding: 0 24px !important
    }
}

body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper li:hover {
    background-color: hsla(0, 0%, 100%, .25)
}

body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper li {
    text-wrap: nowrap;
    color: #fff;
    font-size: 14px;
    max-width: unset;
    min-width: 140px;
    padding: 0 16px
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper li.active {
        background-color: #fff !important;
        border: none;
        border-radius: var(--ui-border-radius) !important;
        color: var(--blue-6) !important
    }
}

body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper li.active {
    background-color: transparent;
    border-bottom: 2px solid #fff;
    border-radius: 0;
    color: #fff
}

body.games #tabs .tabs .tabs-header .tabs-menu .tabs-wrapper::-webkit-scrollbar {
    display: none
}

body.games #tabs .tabs .tabs-content .tab-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-content .tab-content {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

body.games #tabs .tabs .tabs-content .tab-content.active {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 32px;
    justify-content: center
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-content .tab-content.active {
        gap: 139px
    }
}

body.games #tabs .tabs .tabs-content .tab-content .a-wrapper {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-content .tab-content .a-wrapper {
        -webkit-box-pack: left;
        -ms-flex-pack: left;
        justify-content: left
    }
}

body.games #tabs .tabs .tabs-content .tab-content .btn {
    height: 44px
}

body.games #tabs .tabs .tabs-content .tab-content .text {
    max-width: 500px;
    padding: 0
}

body.games #tabs .tabs .tabs-content .tab-content .text .title {
    font-size: 24px;
    font-weight: 700;
    line-height: 36px;
    margin-bottom: 24px
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-content .tab-content .text .title {
        font-size: 28px;
        line-height: 38px
    }
}

body.games #tabs .tabs .tabs-content .tab-content .text .quiet {
    color: #fff
}

body.games #tabs .tabs .tabs-content .tab-content .text .white-btn {
    border: 1px solid #fff;
    color: #fff
}

body.games #tabs .tabs .tabs-content .tab-content img {
    max-width: 500px
}

@media (min-width:1024px) {
    body.games #tabs .tabs .tabs-content .tab-content img {
        float: right
    }
}

body.games #tabs .tabs .first-tab {
    color: var(--blue-2)
}

body.games #tabs .tabs .second-tab {
    color: var(--pink)
}

body.games #tabs .tabs .third-tab {
    color: var(--violet-1)
}

body.games #tabs .tabs h2 {
    font-size: 32px
}

@media (min-width:1024px) {
    body.games #tabs .tabs li {
        font-size: 20px;
        height: 48px;
        max-width: 330px;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }
}

body.games #tabs .tabs li.active {
    background-color: var(--blue-5)
}

body.games #dash-demo {
    padding-bottom: var(--spacer);
    padding-top: var(--spacer)
}

@media (min-width:1024px) {
    body.games #dash-demo {
        padding-bottom: 112px;
        padding-top: 112px
    }
}

body.games #dash-demo .eyebrow {
    color: var(--grey-3)
}

body.games #dash-demo h3 {
    color: var(--grey-1)
}

body.games #dash-demo .btn {
    border: 1px solid #fff;
    color: #fff;
    font-size: 14px;
    height: 44px
}

@media (min-width:1024px) {
    body.games #dash-demo .btn {
        font-size: 16px !important
    }
}

body.games #dash-demo .feature {
    gap: 32px;
    grid-template-columns: 1fr;
    padding: 0
}

body.games #dash-demo .feature .media {
    margin: 0 auto
}

body.games #dash-demo .feature .media img {
    max-width: 500px
}

body.games #dash-demo .feature .text .btn-wrapper {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    justify-content: space-between
}

@media (min-width:1024px) {
    body.games #dash-demo .feature .text .btn-wrapper {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        gap: 56px;
        justify-content: flex-start
    }
}

body.games #dash-demo .feature .text .btn-wrapper>.btn {
    padding-left: 32px;
    padding-right: 32px
}

body.games #dash-demo .feature .text .btn-wrapper>.quiet {
    padding: 0
}

body.games #dash-demo .feature .text .eyebrow {
    font-size: 22px
}

body.games #dash-demo .feature .text h3 {
    font-size: var(--font-size-heading-1)
}

@media (min-width:1024px) {
    body.games #dash-demo .feature {
        gap: 72px;
        grid-template-columns: 1fr 45%
    }

    body.games #dash-demo .feature .text {
        padding: 0 0 0 var(--gutter-md)
    }

    body.games #dash-demo .feature .text .eyebrow {
        font-size: 24px
    }

    body.games #dash-demo .feature .text p {
        max-width: 100%
    }

    body.games #dash-demo .feature .media {
        margin: 0
    }
}

body.games #flame {
    padding-bottom: var(--spacer);
    padding-top: var(--spacer)
}

body.games #flame .eyebrow {
    color: var(--grey-3)
}

body.games #flame h3 {
    color: var(--grey-1)
}

body.games #flame .btn {
    border: 1px solid #fff;
    color: #fff;
    font-size: 16px !important;
    height: 44px
}

body.games #flame .feature {
    -webkit-column-gap: 32px;
    -moz-column-gap: 32px;
    column-gap: 32px;
    grid-template-columns: 1fr;
    padding: 0
}

body.games #flame .feature .media {
    margin-bottom: 0 auto
}

body.games #flame .feature .text h3 {
    font-size: var(--font-size-heading-1)
}

body.games #flame .feature .text .body {
    max-width: 100%
}

@media (min-width:1024px) {
    body.games #flame .feature {
        grid-template-columns: 40% 1fr
    }

    body.games #flame .feature .text {
        padding: 0 var(--gutter) 0 0;
        width: 610px
    }

    body.games #flame .feature .text p {
        max-width: 100%
    }
}

@media (min-width:1280px) {
    body.games #flame .feature {
        gap: 72px;
        grid-template-columns: 40% 1fr
    }

    body.games #flame .feature .media {
        margin: 0
    }

    body.games #flame .feature .text {
        padding: 0 var(--gutter-md) 0 var(--gutter);
        width: 610px
    }

    body.games #flame .feature .text p {
        max-width: 100%
    }
}

body.games #flame .media {
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1
}

body.games #stories {
    background-color: var(--blue-9);
    padding-bottom: 56px
}

@media (min-width:1024px) {
    body.games #stories {
        padding-bottom: var(--gutter-lg)
    }
}

body.games #stories .story-grid-header {
    padding: 0 0 56px
}

@media (min-width:1024px) {
    body.games #stories .story-grid-header {
        padding: 112px 50px 112px 0
    }
}

body.games #stories .story-grid-header .eyebrow {
    color: var(--grey-3);
    font-size: var(--font-size-heading-4);
    margin-bottom: 0
}

body.games #stories .story-grid-header h3 {
    color: var(--grey-1);
    font-size: var(--font-size-heading-1);
    margin-bottom: 0;
    text-align: left
}

body.games #stories .story-grid-items .story-item a:hover h3,
body.games #stories .story-grid-items .story-item a:hover h4,
body.games #stories .story-grid-items .story-item a:hover p {
    color: var(--blue-4) !important
}

body.games #stories .story-grid-items .story-item .text {
    padding-right: 0
}

body.games #stories .story-grid-items .story-item .text h3 {
    color: var(--grey-1);
    margin-bottom: 8px
}

@media (min-width:1024px) {
    body.games #stories .story-grid-items .story-item .text h3 {
        margin-bottom: 24px
    }
}

body.games #stories .story-grid-items .story-item .text p {
    color: var(--grey-3);
    margin-bottom: 0
}

body.games #resources {
    background-image: linear-gradient(123.21deg, #0553b1, #a57cf6);
    padding: 56px 16px
}

@media (min-width:1024px) {
    body.games #resources {
        padding: var(--gutter-md) var(--gutter)
    }
}

body.games #resources .feature-grid {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 56px;
    padding: 0
}

@media (min-width:1024px) {
    body.games #resources .feature-grid {
        gap: 72px;
        padding: var(--spacer) 0
    }
}

body.games #resources .feature-grid .feature-header {
    margin: 0;
    width: -webkit-fill-available
}

body.games #resources .feature-grid .feature-header hgroup {
    max-width: unset;
    padding-left: 0;
    width: auto
}

body.games #resources .feature-grid .feature-header hgroup h2 {
    font-size: 46px;
    line-height: 46px;
    margin-bottom: 0;
    max-width: unset
}

@media (min-width:1024px) {
    body.games #resources .feature-grid .feature-header hgroup h2 {
        font-size: 60px;
        line-height: 60px
    }
}

body.games #resources .feature-grid .feature-grid-features {
    gap: 56px !important
}

@media (min-width:1024px) {
    body.games #resources .feature-grid .feature-grid-features {
        gap: unset !important;
        grid-template-columns: minmax(0, 430px) minmax(0, 430px) minmax(0, 430px)
    }
}

body.games #resources .feature-grid .feature-grid-features>div {
    padding: 0
}

body.games #resources .feature-grid .feature-grid-features>div img {
    margin-bottom: 24px
}

body.games #resources .feature-grid .feature-grid-features>div h3 {
    margin-bottom: 8px
}

@media (min-width:1024px) {
    body.games #resources .feature-grid .feature-grid-features>div {
        padding: 40px 10px
    }

    body.games #resources .feature-grid .feature-grid-features>div img {
        margin-bottom: 32px
    }

    body.games #resources .feature-grid .feature-grid-features>div h3 {
        text-wrap: nowrap;
        margin-bottom: 24px
    }
}

body.games #featured-games {
    background-color: var(--blue-10);
    padding: 56px 0
}

body.games #featured-games hgroup {
    padding-left: 0 !important
}

body.games #featured-games hgroup .eyebrow {
    color: var(--grey-3)
}

body.games #featured-games hgroup h2 {
    color: var(--grey-1)
}

@media (min-width:1024px) {
    body.games #featured-games {
        padding: var(--gutter-lg) 0
    }
}

body.games #featured-games .carousel .carousel-slider .story-item {
    min-width: 222px
}

body.games #featured-games .carousel .carousel-slider .story-item img {
    border-radius: 37px;
    width: 222px
}

body.games #featured-games .carousel .carousel-slider .story-item .text {
    padding-right: 0
}

body.games #featured-games .carousel .carousel-slider .story-item .text h3 {
    color: var(--grey-1);
    font-size: 24px
}

body.games #featured-games .carousel .carousel-progress,
body.games #featured-games .carousel .carousel-slider .story-item .text p {
    color: #fff
}

body.games #featured-games .carousel .carousel-progress .carousel-track {
    background-color: hsla(0, 0%, 100%, .2)
}

body.games #featured-games .carousel .carousel-progress .carousel-completed {
    background-color: #fff;
    border-radius: 4px;
    height: 4px;
    margin-bottom: 32px
}

body.games #playlist {
    background-color: var(--blue-9)
}

body.games #playlist .stacked-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 0 0 40px;
    padding-left: var(--gutter);
    width: 100%
}

@media (min-width:1024px) {
    body.games #playlist .stacked-header {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: space-between;
        margin: 0;
        max-width: 100%;
        padding-right: 50px
    }
}

@media (min-width:1280px) {
    body.games #playlist .stacked-header {
        padding-left: var(--gutter-auto)
    }
}

body.games #playlist .stacked-header>div {
    position: relative
}

body.games #playlist .stacked-header .btn {
    border: 1px solid #fff;
    color: #fff
}

body.games #playlist p {
    color: var(--grey-3);
    font-family: var(--font-gsans);
    font-weight: 700;
    margin-bottom: 0
}

@media (min-width:1024px) {
    body.games #playlist p {
        margin-bottom: var(--gutter-sm)
    }
}

body.games #playlist h2 {
    color: var(--grey-1)
}

body.games #playlist .carousel {
    padding-left: var(--gutter)
}

body.games #playlist .carousel .carousel-slider {
    padding: 0 0 0 24px
}

@media (min-width:1024px) {
    body.games #playlist .carousel .carousel-slider {
        padding: 20px 0 30px;
        padding-left: var(--gutter-auto)
    }
}

body.games #playlist .carousel .carousel-slider .video-item {
    min-width: 100%;
    width: 100%
}

@media (min-width:1024px) {
    body.games #playlist .carousel .carousel-slider .video-item {
        min-width: 544px;
        width: 544px
    }
}

body.games #playlist .carousel .carousel-slider .video-item .media {
    height: 156px;
    width: 358px
}

@media (min-width:1024px) {
    body.games #playlist .carousel .carousel-slider .video-item .media {
        height: 306px;
        width: 544px
    }
}

body.games #playlist .carousel .carousel-slider .video-item .media img {
    height: 295px;
    top: -40px;
    width: 358px
}

@media (min-width:1024px) {
    body.games #playlist .carousel .carousel-slider .video-item .media img {
        height: auto;
        left: 0;
        top: -51px;
        width: 100%
    }
}

body.games #playlist .carousel .carousel-slider .video-item .text h3 {
    color: var(--grey-1)
}

body.games #playlist .carousel .carousel-slider .video-item .text p {
    font-family: var(--font-roboto);
    font-weight: 400;
    line-height: 24px
}

body.games #playlist .carousel .carousel-progress {
    color: #fff
}

body.games #playlist .carousel .carousel-progress .carousel-track {
    background-color: hsla(0, 0%, 100%, .2)
}

body.games #playlist .carousel .carousel-progress .carousel-nav {
    padding: 0
}

@media (min-width:1024px) {
    body.games #playlist .carousel .carousel-progress .carousel-nav {
        padding: var(--gutter-sm) 0
    }
}

body.games #playlist .carousel .carousel-progress .carousel-completed {
    background-color: #fff;
    border-radius: 4px;
    height: 4px;
    margin-bottom: 32px
}

body.games #developer-stories {
    padding: 56px 0
}

@media (min-width:1024px) {
    body.games #developer-stories {
        padding: 224px 0 var(--gutter-md)
    }
}

body.games #developer-stories .insert {
    border-radius: 12px
}

@media (min-width:1024px) {
    body.games #developer-stories .insert {
        border-radius: 40px
    }
}

body.games #developer-stories .container {
    background-image: linear-gradient(244.25deg, rgba(231, 248, 255, .5) 50.88%, rgba(248, 187, 208, .5))
}

body.games #developer-stories .container .text {
    padding: var(--gutter)
}

@media (min-width:1024px) {
    body.games #developer-stories .container .text {
        padding: 64px 0 64px 64px
    }
}

body.games #developer-stories .container .text .eyebrow {
    color: var(--grey-3)
}

@media (min-width:1024px) {
    body.games #developer-stories .container .text .eyebrow {
        font-size: 24px
    }
}

body.games #developer-stories .container .text h3 {
    color: var(--grey-1)
}

body.games #developer-stories .container .text a {
    color: #fff;
    font-size: 14px;
    padding: 0
}

@media (min-width:1024px) {
    body.games #developer-stories .container .text a {
        font-size: 16px
    }
}

body.games #developer-stories .container .media img {
    height: 431px;
    margin: 0 auto;
    position: relative
}

@media (min-width:1024px) {
    body.games #developer-stories .container .media img {
        position: absolute;
        right: 30px
    }

    body.games #level-up {
        padding: var(--gutter-lg) 0
    }
}

body.games #level-up .stacked-header {
    padding: 0 0 56px
}

@media (min-width:1024px) {
    body.games #level-up .stacked-header {
        padding: 72px 0
    }
}

body.games #level-up .stacked-header hgroup {
    padding-left: 0
}

@media (min-width:1024px) {
    body.games #level-up .stacked-header hgroup {
        max-width: -webkit-fit-content;
        max-width: -moz-fit-content;
        max-width: fit-content
    }
}

body.games #level-up .stacked-header hgroup .eyebrow {
    color: var(--grey-3) !important
}

body.games #level-up .stacked-header hgroup p {
    margin-top: 16px
}

@media (min-width:1024px) {
    body.games #level-up .stacked-header hgroup p {
        margin-top: var(--gutter-sm)
    }
}

body.games #level-up .stacked-header hgroup h2,
body.games #level-up .stacked-header hgroup p {
    color: var(--grey-1)
}

@media (min-width:1024px) {
    body.games #level-up .feature-compare>div {
        width: 520px
    }
}

body.games #level-up .feature-compare>div:first-child .media {
    background-image: linear-gradient(35deg, #e8f9ff 40%, #faf9c5 80%)
}

body.games #level-up .feature-compare>div:first-child .media img {
    height: 74px
}

body.games #level-up .feature-compare>div:nth-child(2) .media {
    background-image: linear-gradient(35deg, #d0f2ff 40%, #e8f9ff 80%)
}

body.games #level-up .feature-compare>div:nth-child(2) .media img {
    height: 74px
}

body.games #level-up .feature-compare>div .text h3 {
    color: var(--grey-1)
}

body.games #level-up .feature-compare>div .text p {
    color: var(--grey-3);
    margin-bottom: 16px
}

body.games #level-up .feature-compare>div .text .subtitle {
    color: var(--grey-3);
    font-size: 12px;
    line-height: 16px
}

@media (min-width:1024px) {
    body.games #level-up .feature-compare>div .text .subtitle {
        font-size: 15px;
        line-height: 21px
    }
}

body.games #notification.module {
    padding-bottom: 0
}

body.games .carousel .carousel-progress {
    margin-top: 0
}

body.games #cta {
    background: linear-gradient(124.64deg, #027dfd, #833ef2)
}

body.games #cta .insert {
    background-color: var(--blue-10);
    border-radius: 40px;
    display: grid;
    grid-template-columns: 1fr;
    position: relative
}

body.games #cta .insert .eyebrow {
    color: #000
}

body.games #cta .insert .text {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    padding: var(--gutter);
    z-index: 2
}

body.games #cta .insert .text h4.eyebrow {
    margin-bottom: var(--spacer-sm)
}

body.games #cta .insert .text h3 {
    font-size: var(--font-size-heading-2);
    font-weight: var(--font-weight-default);
    margin-bottom: var(--gutter-sm);
    max-width: 820px
}

body.games #cta .insert .text a,
body.games #cta .insert .text a.btn {
    border-color: #000;
    color: #000;
    font-weight: var(--font-weight-bold)
}

body.games #cta .insert .text a.btn:hover,
body.games #cta .insert .text a:hover {
    background-color: transparent;
    color: #000
}

body.games #cta .insert .text a.btn {
    margin-bottom: var(--spacer-sm)
}

body.games #cta .insert .media {
    position: relative;
    z-index: 1
}

body.games #cta .insert .media img {
    bottom: 0;
    position: absolute;
    right: 0
}

body.games #cta .insert.cta-insert {
    background-color: #042449;
    overflow: hidden
}

body.games #cta .insert.cta-insert .text {
    padding-bottom: 96px;
    padding-top: 96px
}

body.games #cta .insert.cta-insert .media {
    position: static
}

body.games #cta .insert.cta-insert .media img {
    bottom: auto;
    height: 100%;
    top: 0
}

body.games #cta .insert.cta-insert a,
body.games #cta .insert.cta-insert h3,
body.games #cta .insert.cta-insert p {
    color: #fff
}

body.games #cta .insert.cta-insert h3 {
    font-size: var(--font-size-heading-1);
    font-weight: var(--font-weight-bold);
    margin-bottom: var(--gutter-sm)
}

body.games #cta .insert.cta-insert p {
    font-size: var(--font-size-heading-4);
    margin-bottom: 2rem
}

body.games #cta .insert.cta-insert a.btn:not(.quiet) {
    background-color: #fff !important;
    color: var(--blue-6) !important
}

body.games #cta .insert.cta-insert a.btn.quiet,
body.games #cta .insert.cta-insert a.btn.quiet:hover {
    color: #fff !important
}

@media (min-width:1024px) {
    body.games #cta .insert {
        grid-template-columns: 1fr minmax(0, 441px);
        min-height: 315px
    }

    body.games #cta .insert .text {
        padding: 64px 0 64px 64px
    }

    body.games #cta .insert.cta-insert .text {
        padding: var(--gutter-md)
    }

    body.games #cta .insert.cta-insert .text h3 {
        margin-bottom: 16px
    }
}

body.globalGamersChallenge #banner {
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    max-height: 720px;
    padding: 0 1rem;
    position: relative
}

body.globalGamersChallenge #banner,
body.globalGamersChallenge #banner .text {
    -webkit-box-orient: vertical;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 1rem;
    justify-content: center
}

body.globalGamersChallenge #banner .text {
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

body.globalGamersChallenge #banner .text h1,
body.globalGamersChallenge #banner .text h2 {
    color: #fff
}

body.globalGamersChallenge #banner .text h2 {
    font-size: var(--font-size-heading-3);
    font-weight: 400
}

body.globalGamersChallenge #banner #global-citizen-flutter-logo {
    left: 0;
    max-width: 260px;
    position: absolute;
    top: 0
}

body.globalGamersChallenge #story .story-detail {
    max-width: none;
    padding: initial;
    width: auto
}

body.globalGamersChallenge #story .story-detail .tabs {
    --anim-offset: 200px
}

body.globalGamersChallenge #story .story-detail .tabs .modal {
    background-color: rgba(0, 0, 0, .5);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100
}

body.globalGamersChallenge #story .story-detail .tabs .modal,
body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner {
    background: #fff;
    border-radius: 10px;
    -webkit-box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    padding: 0;
    position: relative;
    width: 312px
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-media {
    -webkit-box-flex: 50%;
    -ms-flex: 50%;
    flex: 50%
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-media .modal-img {
    border-radius: 10px 10px 0 0;
    height: 320px;
    -o-object-fit: cover;
    object-fit: cover
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-media .modal-inner-close {
    cursor: pointer;
    position: absolute;
    right: 16px;
    top: 16px
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-body {
    -webkit-box-flex: 50%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 50%;
    flex: 50%;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    justify-content: flex-start;
    padding: 24px;
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-body a,
body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-body h3,
body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-body p,
body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-body>h5 {
    margin: 0;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-body>h5 {
    color: #13c2ad
}

body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner .modal-body>a>h5 {
    margin-right: 8px
}

body.globalGamersChallenge #story .story-detail .tabs .tabs-header {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: inherit;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-bottom: 64px
}

body.globalGamersChallenge #story .story-detail .tabs .tabs-menu ul {
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    overflow: scroll;
    text-align: center
}

body.globalGamersChallenge #story .story-detail .tabs ul::-webkit-scrollbar {
    display: none
}

body.globalGamersChallenge #story .story-detail .tabs ul {
    border-radius: 0;
    margin: 0;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs ul>a {
    -webkit-box-flex: 0;
    border: none;
    -ms-flex: none;
    flex: none;
    margin-bottom: 0
}

body.globalGamersChallenge #story .story-detail .tabs ul>a:hover {
    background-color: var(--grey-3);
    color: var(--grey-6)
}

body.globalGamersChallenge #story .story-detail .tabs ul>a.active {
    background-color: var(--blue-6);
    color: #fff
}

body.globalGamersChallenge #story .story-detail .tabs .tabs-content {
    margin: 64px auto;
    max-width: 1112px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content {
    display: none;
    opacity: 0;
    position: relative;
    top: var(--anim-offset)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content.no-spy {
    top: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content.active {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup;
    animation-name: slideup;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: block
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module {
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .features.container {
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 120px;
    position: static
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview,
body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-flex: 50%;
    align-items: flex-start;
    -ms-flex: 50%;
    flex: 50%;
    margin-top: 60px;
    padding: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content>hgroup {
    margin-bottom: 32px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h1 {
    font-size: 46px;
    line-height: 55px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
    color: var(--violet-4);
    margin-bottom: 16px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content p {
    margin: 0;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content .btn {
    margin-top: 32px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .content .overview-content p {
    margin-bottom: 40px !important
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .content .btn {
    font-size: 16px;
    height: 50px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth .overview-content .btn.primary {
    background: linear-gradient(91.87deg, #4100e0 .1%, #f8bbd0 120.1%);
    border: none;
    -webkit-box-shadow: 1px 6px 16px rgba(148, 85, 217, .24);
    box-shadow: 1px 6px 16px rgba(148, 85, 217, .24);
    padding: 13px 48px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended .overview-content {
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended .btn {
    font-size: 16px;
    height: 50px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended p {
    font-size: 24px;
    line-height: 32px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .get-involved .overview-content .get-involved-link {
    margin-bottom: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .feature {
    margin-top: 100px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .feature h3,
body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .feature p {
    margin: 0;
    padding: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .feature p {
    margin-top: 24px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .features.container {
    margin: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .stacked-feature>hgroup {
    margin: 0 0 112px;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    padding: 0;
    text-align: left;
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature {
    border-bottom: 1px solid var(--grey-3);
    margin-top: 40px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature:last-child {
    border-bottom: none;
    padding-bottom: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature h3 {
    margin: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature p {
    margin: 24px 0 0;
    padding: 0 0 40px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature p:empty {
    display: none
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module {
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .features.container {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between;
    position: static
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 16px;
    margin-top: 60px;
    max-width: 90%;
    padding-left: 0;
    text-align: left;
    width: 90%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup h1 {
    font-size: 46px;
    line-height: 55px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup h4.eyebrow.faqs {
    color: var(--violet-4)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup p {
    font-size: var(--font-size-heading-4)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section {
    margin-top: 64px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section p {
    margin-bottom: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section .btn.quiet.workshop-nav {
    color: var(--primary);
    font-size: var(--font-size-heading-4);
    margin-bottom: 80px;
    margin-top: 16px;
    padding: 0;
    text-align: left;
    text-decoration: underline
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature {
    padding: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature h1 {
    font-size: 36px;
    line-height: 40px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature p {
    margin-top: 16px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature h2 {
    font-size: 34px;
    font-weight: var(--font-weight-default);
    line-height: 40px;
    margin: 64px 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container {
    border-bottom: 1px solid var(--grey-3)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container,
body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection {
    margin-bottom: 64px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h3 {
    color: var(--grey-6);
    font-size: 28px;
    font-weight: var(--font-weight-default);
    line-height: 34px;
    margin: 0 0 8px;
    min-width: 198px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection p {
    color: var(--grey-6);
    font-size: 20px;
    line-height: 30px;
    margin: 24px 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h4 {
    color: var(--grey-6);
    font-size: 20px;
    font-weight: var(--font-weight-default);
    line-height: 24px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul {
    margin-top: 16px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul>p {
    color: var(--grey-6);
    font-size: 16px;
    font-weight: var(--font-weight-bold);
    line-height: 24px;
    margin: 8px 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module {
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .header h1 {
    color: #000;
    text-align: start
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .header p {
    color: var(--grey-6);
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block {
    color: var(--grey-6);
    margin-bottom: 48px;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block b {
    font-size: 16px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block h2 {
    color: #000;
    font-size: 28px;
    font-weight: 700;
    line-height: 34px;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block p {
    color: var(--grey-6);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 32px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block a {
    color: #00e;
    text-decoration: underline
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block ul {
    font-size: var(--font-size-heading-5);
    margin: 0 0 0 12px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block ul.no-bullets {
    list-style-type: none;
    margin-left: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block ul.no-bullets>li {
    margin-left: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block ul .text-margins {
    display: block;
    margin: var(--spacer-sm) 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block.columns {
    display: grid;
    grid-template-columns: 1fr 1fr
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block.columns h2,
body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block.columns ul {
    grid-column: span 2
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block .btn.quiet {
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 80px;
    justify-content: space-between;
    margin-bottom: 120px;
    position: static
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-flex: 50%;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 50%;
    flex: 50%;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content>hgroup {
    margin-bottom: 32px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content h1 {
    font-size: 46px;
    line-height: 55px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
    color: var(--violet-4)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content p {
    font-size: 24px;
    margin: 0 0 32px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content .btn.primary {
    margin-top: 8px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .embed-container {
    height: 286px;
    margin: 0;
    padding: 0;
    position: static;
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .embed-container>iframe {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature {
    display: block;
    margin-top: 100px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature h3,
body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature p {
    margin: 0;
    padding: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature p {
    margin-top: 24px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 48px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid {
    grid-gap: 24px;
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 24px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid .content-card {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--grey-3);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid .content-card .embed-container {
    margin: 0;
    min-height: 239px;
    padding: 0;
    position: static;
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid .content-card .embed-container>iframe {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid .content-card .card-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    padding: 32px 48px 32px 32px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid .content-card .card-content h3 {
    font-size: 28px;
    font-weight: 700;
    line-height: 34px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid .content-card .card-content p {
    color: var(--grey-6);
    font-size: 16px;
    margin: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container h3 {
    color: #000;
    font-size: 46px;
    font-weight: var(--font-weight-normal)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module {
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features.container {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .explore {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between;
    margin-bottom: 120px;
    position: static
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .explore .explore-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-flex: 50%;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 50%;
    flex: 50%;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: flex-start;
    margin-top: 60px;
    padding: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .explore .explore-content>hgroup {
    margin-bottom: 32px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .explore .explore-content h1 {
    font-size: 46px;
    line-height: 55px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .explore .explore-content h4.eyebrow.faqs {
    color: var(--violet-4)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .explore .explore-content p {
    margin: 0 0 32px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .explore .explore-content .btn.primary {
    margin-top: 8px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .feature {
    margin-top: 100px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .feature h3,
body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .feature p {
    margin: 0;
    padding: 0;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .stacked-feature .feature p {
    margin-top: 24px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: space-between
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div {
    background: #041e3c;
    background-image: linear-gradient(359.97deg, rgba(58, 241, 215, .53) .03%, rgba(4, 30, 60, 0) 22.5%);
    border-radius: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 320px;
    overflow: hidden;
    position: relative;
    width: 312px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div:hover {
    background-image: linear-gradient(359.97deg, rgba(58, 241, 215, .53) .03%, rgba(4, 30, 60, 0) 66.5%);
    -webkit-box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    cursor: pointer
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div:hover>img {
    opacity: 0;
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div:hover>h3 {
    left: 50%;
    opacity: 1;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div.today-card {
    border: 8px solid #f9e84c
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div.locked-card {
    background-image: linear-gradient(359.97deg, #502c69 .03%, rgba(4, 30, 60, 0) 66.5%);
    cursor: auto
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div>img {
    border-radius: 20px;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: opacity .2s ease-in-out, -webkit-transform .3s cubic-bezier(.47, 1.64, .41, .8);
    transition: opacity .2s ease-in-out, -webkit-transform .3s cubic-bezier(.47, 1.64, .41, .8);
    transition: transform .3s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out;
    transition: transform .3s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out, -webkit-transform .3s cubic-bezier(.47, 1.64, .41, .8)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div>h3 {
    color: #fff;
    font-size: 40px;
    left: 50%;
    line-height: 60px;
    opacity: 0;
    position: absolute;
    top: 70%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: top .5s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out;
    transition: top .5s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out;
    width: 100%
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div .day-badge {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #27f5dd;
    border-radius: 12px;
    bottom: 8px;
    color: #041e3c;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 40px;
    font-weight: 700;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    justify-content: center;
    line-height: 34px;
    min-height: 80px;
    min-width: 80px;
    padding: 21px 14px;
    position: absolute;
    right: 8px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div .day-badge img {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: none;
    transition: none
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div .day-badge.today {
    background: #f9e84c;
    border-radius: 12px 0;
    bottom: 0;
    right: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div .day-badge.locked {
    background: #041e3c;
    color: #fff
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div .day-badge.locked:hover {
    cursor: auto
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .content-cards div .day-badge:hover {
    -webkit-box-shadow: none;
    box-shadow: none
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module {
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between;
    margin-bottom: 40px;
    padding: 0 28px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-header hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 60px;
    min-width: 300px;
    text-align: left;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block {
    margin-bottom: 48px;
    margin-top: 48px
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block h2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    margin-bottom: 32px;
    text-align: left
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block ol,
body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block p {
    color: var(--grey-6);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block ol {
    margin: 0 0 0 var(--gutter-sm)
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block iframe {
    margin: 0 auto
}

body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block.resources p {
    margin: 0
}

body.globalGamersChallenge #story .story-detail #prizes.module {
    padding: 0
}

body.globalGamersChallenge #story .story-detail #prizes.module .container p {
    color: var(--grey-6);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 32px;
    padding: 0
}

body.globalGamersChallenge #story .story-detail #prizes.module .container img {
    margin: 24px auto
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 27px
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-nav .btn.quiet {
    color: var(--primary);
    font-size: var(--font-size-heading-5);
    padding: 0
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-nav .btn.quiet>i {
    margin-right: 5px
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-header h1 {
    color: #000;
    text-align: start
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-header p {
    margin-top: 1rem
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-header .iframe-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 2rem;
    overflow: scroll
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block,
body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block {
    color: var(--grey-6);
    margin-bottom: 48px;
    text-align: left
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block h2,
body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block h2 {
    color: var(--grey-6);
    font-size: 24px;
    font-weight: 700;
    line-height: 34px;
    text-align: left
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block .title,
body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block .title {
    font-size: 32px
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block a,
body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block a {
    color: #00e;
    text-decoration: underline
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block pre,
body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block pre {
    white-space: pre-line;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block ul,
body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block ul {
    font-size: var(--font-size-heading-5)
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block i,
body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block i {
    color: var(--grey-6);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 1rem
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block .media-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 418px
}

body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block .media-container:nth-child(3) {
    max-width: 647px
}

body.globalGamersChallenge #winners.module .container .winners-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    color: var(--grey-6);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between;
    margin-bottom: 40px;
    padding: 0
}

body.globalGamersChallenge #winners.module .container .winners-header hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 300px;
    text-align: left;
    width: 100%
}

body.globalGamersChallenge #winners.module .container .winners-header hgroup h1 {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

body.globalGamersChallenge #winners.module .container #mentions hgroup,
body.globalGamersChallenge #winners.module .container #sessions hgroup,
body.globalGamersChallenge #winners.module .container #winners hgroup {
    margin-bottom: var(--gutter-sm)
}

body.globalGamersChallenge #winners.module .container #sessions,
body.globalGamersChallenge #winners.module .container #winners {
    background-color: var(--grey-1)
}

body.globalGamersChallenge #winners.module .container .event-sessions,
body.globalGamersChallenge #winners.module .container .event-winners {
    -webkit-column-gap: var(--gutter);
    -moz-column-gap: var(--gutter);
    column-gap: var(--gutter);
    display: grid;
    padding: var(--spacer) 0;
    row-gap: var(--gutter-md);
    text-align: left
}

body.globalGamersChallenge #winners.module .container .event-sessions .event-session img,
body.globalGamersChallenge #winners.module .container .event-sessions .event-winner img,
body.globalGamersChallenge #winners.module .container .event-winners .event-session img,
body.globalGamersChallenge #winners.module .container .event-winners .event-winner img {
    margin-bottom: 16px;
    width: 100%
}

body.globalGamersChallenge #winners.module .container .event-sessions .event-session h3,
body.globalGamersChallenge #winners.module .container .event-sessions .event-winner h3,
body.globalGamersChallenge #winners.module .container .event-winners .event-session h3,
body.globalGamersChallenge #winners.module .container .event-winners .event-winner h3 {
    font-size: 16px;
    line-height: 1.4;
    margin-bottom: 10px;
    text-align: center
}

body.globalGamersChallenge #winners.module .container .event-sessions .event-session h3 span,
body.globalGamersChallenge #winners.module .container .event-sessions .event-winner h3 span,
body.globalGamersChallenge #winners.module .container .event-winners .event-session h3 span,
body.globalGamersChallenge #winners.module .container .event-winners .event-winner h3 span {
    color: var(--grey-6);
    font-weight: 400
}

body.globalGamersChallenge #winners.module .container .event-sessions .event-session h4,
body.globalGamersChallenge #winners.module .container .event-sessions .event-winner h4,
body.globalGamersChallenge #winners.module .container .event-winners .event-session h4,
body.globalGamersChallenge #winners.module .container .event-winners .event-winner h4 {
    font-size: var(--font-size-heading-3);
    line-height: 1.1;
    margin-bottom: var(--spacer-sm);
    max-width: 90%
}

body.globalGamersChallenge #winners.module .container .event-sessions .event-session p,
body.globalGamersChallenge #winners.module .container .event-sessions .event-winner p,
body.globalGamersChallenge #winners.module .container .event-winners .event-session p,
body.globalGamersChallenge #winners.module .container .event-winners .event-winner p {
    font-size: var(--font-size-heading-5);
    padding: 0
}

body.globalGamersChallenge #winners.module .container .event-sessions .event-session a:hover h4,
body.globalGamersChallenge #winners.module .container .event-sessions .event-session a:hover p,
body.globalGamersChallenge #winners.module .container .event-sessions .event-winner a:hover h4,
body.globalGamersChallenge #winners.module .container .event-sessions .event-winner a:hover p,
body.globalGamersChallenge #winners.module .container .event-winners .event-session a:hover h4,
body.globalGamersChallenge #winners.module .container .event-winners .event-session a:hover p,
body.globalGamersChallenge #winners.module .container .event-winners .event-winner a:hover h4,
body.globalGamersChallenge #winners.module .container .event-winners .event-winner a:hover p {
    color: var(--primary)
}

@media (min-width:768px) {

    body.globalGamersChallenge #winners.module .container .event-sessions,
    body.globalGamersChallenge #winners.module .container .event-winners {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (min-width:1024px) {

    body.globalGamersChallenge #winners.module .container .event-sessions,
    body.globalGamersChallenge #winners.module .container .event-winners {
        grid-template-columns: repeat(3, 1fr)
    }

    body.globalGamersChallenge #banner {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: flex-start;
        padding: 180px
    }

    body.globalGamersChallenge #banner .text {
        max-width: 530px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    body.globalGamersChallenge #banner #global-citizen-flutter-logo {
        margin: 1rem 1.5rem
    }

    body.globalGamersChallenge #story .story-detail .tabs .modal .modal-inner {
        width: 532px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tabs-menu ul {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content {
        margin-top: 116px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview {
        margin-bottom: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-flex: 50%;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex: 50%;
        flex: 50%;
        -ms-flex-direction: column;
        flex-direction: column;
        justify-content: space-between;
        margin-top: 0;
        padding: 0;
        text-align: left
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content>hgroup {
        margin-bottom: 32px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h1 {
        font-size: 64px;
        line-height: 72px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
        color: var(--violet-4)
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content p {
        margin: 0;
        padding: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content .btn {
        margin-top: 32px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(odd) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(odd) .overview-content {
        margin-left: 82px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(2n) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(2n) .overview-content {
        margin-right: 82px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth {
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: flex-start;
        align-items: center;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        gap: 82px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth .img-container {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%;
        height: 375px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth .overview-content {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%;
        margin-left: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended p {
        width: 515px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .get-involved {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        gap: 63px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #home.module .stacked-feature .get-involved .overview-content {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%;
        margin-left: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: space-between;
        padding-right: 10%
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup {
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1;
        margin: 0 24px 120px 0;
        max-width: 885px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup h1 {
        font-size: 64px;
        line-height: 72px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section {
        margin-top: 80px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section .btn.quiet.workshop-nav {
        margin-bottom: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature h1 {
        font-size: 60px;
        line-height: 60px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature h2 {
        font-size: 40px;
        font-weight: var(--font-weight-default);
        line-height: 56px;
        margin: 80px 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        margin-top: 80px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: flex-start;
        margin-bottom: 80px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection>h3 {
        margin-right: 24px;
        min-width: 198px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h3 {
        color: var(--grey-6);
        font-size: 28px;
        font-weight: var(--font-weight-default);
        line-height: 34px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection p {
        color: var(--grey-6);
        font-size: 20px;
        line-height: 30px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h4 {
        color: var(--grey-6);
        font-size: 20px;
        font-weight: var(--font-weight-default);
        line-height: 24px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul {
        margin-top: 16px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul>p {
        color: var(--grey-6);
        font-size: 16px;
        font-weight: var(--font-weight-bold);
        line-height: 24px;
        margin: 0 0 4px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .header h1 {
        text-align: start
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block h2 {
        color: #000
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #resources.module .container .resources-body .text-block ul li {
        margin-left: 20px;
        text-align: left
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-bottom: 160px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-flex: 50%;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex: 50%;
        flex: 50%;
        -ms-flex-direction: column;
        flex-direction: column;
        justify-content: flex-start;
        margin-top: 0;
        padding: 0;
        text-align: left
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content>hgroup {
        margin-bottom: 32px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content h1 {
        font-size: 64px;
        line-height: 72px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
        color: var(--violet-4)
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content p {
        font-size: 24px;
        margin: 0 0 32px;
        padding: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .overview-content .btn.primary {
        font-size: 16px;
        height: 50px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .overview .embed-container {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature {
        margin-top: 160px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container {
        margin-top: 112px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container .content-grid {
        grid-gap: 24px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        margin-top: 56px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #content.module .stacked-feature .feature .content-section-container>h3 {
        font-size: 60px;
        font-weight: 700;
        line-height: 60px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-bottom: 60px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore .explore-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-flex: 60%;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex: 60%;
        flex: 60%;
        -ms-flex-direction: column;
        flex-direction: column;
        justify-content: flex-start;
        margin-right: 32px;
        margin-top: 0;
        padding: 0;
        text-align: left
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore .explore-content>hgroup {
        margin-bottom: 32px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore .explore-content h1 {
        font-size: 64px;
        line-height: 72px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore .explore-content h4.eyebrow.faqs {
        color: var(--violet-4)
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore .explore-content p {
        margin: 0 0 32px;
        padding: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore .explore-content .btn.primary {
        margin-top: 8px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .stacked-feature .explore img {
        -webkit-box-flex: 40%;
        -ms-flex: 40%;
        flex: 40%
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        gap: 48px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards div {
        width: 338.65px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards div img {
        border-radius: 20px 0 0 0;
        width: 100%
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards div>h3 {
        font-size: 44px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards div .day-badge {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards div .day-badge.locked {
        background: #041e3c;
        min-width: 80px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards div:nth-child(5n-3),
    body.globalGamersChallenge #story .story-detail .tabs .tab-content #guide.module .features .content-cards div:nth-child(5n-4) {
        width: 532px
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-header {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        color: var(--grey-6);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
        justify-content: space-between;
        margin-bottom: 40px;
        padding: 0
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-header hgroup {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        min-width: 300px;
        text-align: left;
        width: 100%
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-header hgroup h1 {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body .text-block h2 {
        color: #000;
        font-size: 32px;
        text-align: left
    }

    body.globalGamersChallenge #story .story-detail .tabs .tab-content #wallet.module .container .wallet-body img {
        margin: 48px auto
    }

    body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block ul {
        font-size: var(--font-size-heading-5);
        margin: 0;
        padding: 0
    }

    body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .text-block ul li {
        margin-left: 20px;
        text-align: left
    }

    body.globalGamersChallenge #story .story-detail #prizes.module .container .prizes-body .media-block {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        gap: 2rem
    }
}

body.home section.hero {
    background-color: #1a68d3;
    background-image:   radial-gradient(ellipse at top, #0056a0 5%, transparent 60%), 
    linear-gradient(45deg, transparent, #007bff 70%), 
    linear-gradient(135deg, #003d6c, transparent 50%), 
    linear-gradient(225deg, transparent 0%, #0056a0 70%), 
    radial-gradient(ellipse at bottom right, transparent 80%, #007bff 0), 
    radial-gradient(ellipse at top left, #0056a0 40%, transparent 80%), 
    radial-gradient(ellipse at 10% 90%, transparent 80%, #b0cfff 0);
    overflow: hidden;
    padding-bottom: var(--gutter-lg);
    padding-top: calc(var(--ui-header-height) + 80px)
}

body.home section.hero .container {
    text-align: center
}

body.home section.hero {
    --anim-dur: 750ms;
    --anim-delay-1: 400ms;
    --anim-delay-2: 100ms;
    --anim-offset: 400px
}

body.home section.hero h1 {
    -webkit-animation-delay: var(--anim-delay-2);
    animation-delay: var(--anim-delay-2);
    -webkit-animation-duration: var(--anim-dur);
    animation-duration: var(--anim-dur);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup;
    animation-name: slideup;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    color: #fff;
    margin-bottom: 80px;
    opacity: 0;
    position: relative;
    top: 110px
}

body.home section.hero h2 {
    color: #fff;
    font-size: var(--font-size-heading-2);
    font-weight: 400;
    margin: 0 auto 40px;
    max-width: 880px
}

body.home section.hero a.btn {
    background-color: #fff !important;
    border: 1px solid transparent;
    color: var(--blue-6) !important
}

body.home section.hero .gallery {
    --center-pad: 18px;
    --center-border-radius: 20px;
    --center-card-width: 250px;
    --center-card-height: 519px;
    --center-width: calc(var(--center-card-width) + var(--center-pad)*2);
    --card-inner-offset: var(--font-size-heading-4);
    --card-vert-offset: 110px;
    --card-sm-height: 296px;
    --card-sm-portrait-width: 201px;
    height: 842px;
    position: relative
}

@media (min-width:1024px) {
    body.home section.hero .gallery {
        --center-pad: 32px;
        --center-border-radius: 32px;
        --center-card-width: 368px;
        --center-card-height: 764px;
        margin-bottom: 80px
    }
}

@-webkit-keyframes slideup-outer {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: var(--card-vert-offset)
    }
}

@keyframes slideup-outer {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: var(--card-vert-offset)
    }
}

@-webkit-keyframes slideup-center {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: 0
    }
}

@keyframes slideup-center {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: 0
    }
}

body.home section.hero .gallery .inner-fixed {
    display: grid;
    grid-template-columns: 1fr var(--center-width) 1fr;
    height: 100%;
    left: -50%;
    margin: auto;
    position: absolute;
    right: -50%
}

body.home section.hero .gallery .col {
    opacity: 0;
    position: relative
}

body.home section.hero .gallery .col-outer {
    -webkit-animation-delay: var(--anim-delay-1);
    animation-delay: var(--anim-delay-1);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup-outer;
    animation-name: slideup-outer;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func)
}

body.home section.hero .gallery .col-center,
body.home section.hero .gallery .col-outer {
    -webkit-animation-duration: var(--anim-dur);
    animation-duration: var(--anim-dur);
    top: var(--anim-offset)
}

body.home section.hero .gallery .col-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-animation-delay: var(--anim-delay-2);
    animation-delay: var(--anim-delay-2);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup-center;
    animation-name: slideup-center;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    padding: 0 var(--center-pad)
}

body.home section.hero .gallery .col-center .card-a {
    border-radius: var(--center-border-radius);
    -webkit-box-shadow: 0 16px 48px rgba(0, 0, 0, .35);
    box-shadow: 0 16px 48px rgba(0, 0, 0, .35);
    height: var(--center-card-height);
    position: relative;
    width: 100%
}

body.home section.hero .gallery .card {
    background-color: #fff;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: var(--ui-border-radius-sm);
    -webkit-box-shadow: var(--ui-drop-shadow);
    box-shadow: var(--ui-drop-shadow);
    height: var(--card-sm-height);
    position: absolute;
    width: var(--card-sm-portrait-width)
}

body.home section.hero .gallery .col-left .card-a {
    height: 19.5rem;
    right: 0;
    top: -14px;
    width: 525px
}

body.home section.hero .gallery .col-left .card-b {
    right: 0;
    top: calc(var(--card-sm-height) + var(--card-inner-offset))
}

body.home section.hero .gallery .col-left .card-c {
    right: calc(201px + var(--card-inner-offset));
    top: calc(var(--card-vert-offset) + var(--card-sm-height) + var(--card-inner-offset))
}

body.home section.hero .gallery .col-right .card-a {
    left: 0;
    top: 0
}

body.home section.hero .gallery .col-right .card-b {
    height: var(--card-sm-height);
    left: calc(var(--card-sm-portrait-width) + var(--card-inner-offset));
    top: var(--card-vert-offset);
    width: 482px
}

body.home section.hero .gallery .col-right .card-c {
    left: calc(var(--card-sm-portrait-width) + var(--card-inner-offset));
    top: calc(var(--card-vert-offset) + var(--card-sm-height) + var(--card-inner-offset))
}

body.home section.hero .gallery .col-right .card-d {
    left: 0;
    top: calc(var(--card-sm-height) + var(--card-inner-offset))
}

body.home #notification {
    padding-bottom: 0 !important;
    padding-top: var(--gutter)
}

body.home #tabs {
    padding-bottom: 0
}

body.home #tabs .tabs-header {
    margin-bottom: 50px
}

body.home #tabs .tab-content .media {
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    position: relative;
    top: -20px
}

body.home #tabs .tab-content .media video {
    max-width: none !important;
    width: 125%
}

body.home #tabs .tab-content .text {
    position: relative;
    top: -30px;
    z-index: 2
}

@media (min-width:1024px) {
    body.home #tabs .tabs-header {
        margin-bottom: 30px
    }

    body.home #tabs .tab-content .media,
    body.home #tabs .tab-content .text {
        top: 0
    }
}

body.home #community {
    overflow: hidden;
    padding-top: var(--gutter)
}

body.home #community .container {
    height: 715px;
    padding-top: var(--gutter);
    text-align: center
}

@media (min-width:1024px) {
    body.home #community .container {
        height: 980px
    }
}

body.home #community .logo-garden {
    --garden-height: 535px;
    --outer-pad: 18px;
    --outer-width: 100px;
    --centerpiece-pad: 30px;
    --centerpiece-width: 220px
}

@media (min-width:1024px) {
    body.home #community .logo-garden {
        --garden-height: 700px;
        --outer-pad: 35px;
        --outer-width: 163px;
        --centerpiece-pad: 35px;
        --centerpiece-width: 356px
    }
}

body.home #community .logo-garden {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: var(--garden-height);
    justify-content: center
}

body.home #community .logo-garden .inner-fixed {
    display: grid;
    gap: var(--gutter-sm);
    grid-template-columns: 1fr 1fr 1fr var(--centerpiece-width) 1fr 1fr 1fr;
    height: 100%
}

body.home #community .logo-garden .logo-col {
    position: relative
}

body.home #community .logo-garden .logo-col:first-child,
body.home #community .logo-garden .logo-col:nth-child(7) {
    top: 24px
}

body.home #community .logo-garden .logo-col:nth-child(2),
body.home #community .logo-garden .logo-col:nth-child(6) {
    top: -48px
}

body.home #community .logo-garden .logo-col:nth-child(3),
body.home #community .logo-garden .logo-col:nth-child(5) {
    top: 60px
}

body.home #community .logo-garden .logo-col>div {
    background-color: var(--grey-1);
    border-radius: var(--ui-border-radius-sm);
    -webkit-box-shadow: var(--ui-drop-shadow-sm);
    box-shadow: var(--ui-drop-shadow-sm);
    display: grid;
    height: var(--outer-width);
    margin-bottom: 24px;
    padding: var(--outer-pad);
    place-items: center;
    width: var(--outer-width)
}

body.home #community .logo-garden .logo-col.logo-centerpiece>div {
    height: var(--centerpiece-width);
    padding: var(--centerpiece-pad);
    width: var(--centerpiece-width)
}

body.home #community .text {
    position: relative;
    text-align: center;
    top: -195px;
    z-index: 3
}

body.home #community .text hgroup {
    margin: 0 auto 40px;
    max-width: 780px
}

body.home #community .text h2 {
    font-size: var(--font-size-heading-1);
    line-height: 1
}

body.home #community .text p {
    font-size: var(--font-size-heading-4);
    margin: 0 auto 30px;
    max-width: 500px
}

body.home #newsletter {
    margin-top: var(--gutter-lg)
}

body.integrations section.hero {
    background-image: linear-gradient(35deg, #f3fcff 10%, #93faee 80%)
}

body.learn section.hero {
    background-image: var(--grad-violet-blue-35)
}

body.learn .learn-tabs {
    margin-bottom: var(--gutter-md);
    padding-top: var(--gutter)
}

body.learn .learn-tabs .tabs {
    border-bottom: 1px solid var(--grey-4);
    padding-bottom: var(--gutter-lg)
}

body.learn .learn-stage-grid {
    padding: 0
}

body.learn .learn-stage-grid .feature-grid-features>div {
    padding: var(--gutter-sm)
}

body.learn .learn-stage-grid .feature-grid-features>div:hover {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

body.learn .learn-stage-grid .feature-grid-features>div i {
    background-color: #e7f8ff;
    background-repeat: no-repeat;
    border-radius: 100%;
    display: inline-block;
    height: 68px;
    margin-bottom: var(--gutter-sm);
    width: 68px
}

body.learn .learn-stage-grid .feature-grid-features>div h4 {
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    font-size: var(--font-size-heading-3);
    margin-bottom: var(--spacer-md);
    min-height: 100px;
    padding-bottom: var(--spacer-md)
}

body.learn .learn-stage-grid .feature-grid-features>div ul {
    color: var(--grey-6);
    font-size: var(--font-size-heading-4);
    line-height: 1.4;
    list-style: none;
    padding-left: var(--gutter-sm);
    text-align: left
}

body.learn .learn-stage-grid .feature-grid-features>div ul li {
    margin-bottom: 14px;
    position: relative
}

body.learn .learn-stage-grid .feature-grid-features>div ul li a {
    color: var(--primary)
}

body.learn .learn-stage-grid .feature-grid-features>div ul li a:hover {
    text-decoration: underline
}

body.learn .learn-stage-grid .feature-grid-features>div ul li:not(.nested):before {
    color: var(--grey-6);
    content: "\2022";
    font-size: 1.2rem;
    left: -1.2rem;
    position: absolute;
    top: -2px
}

body.learn #transition-docs {
    background-image: linear-gradient(35deg, #f5fbfe 50%, #fcfce2 90%)
}

body.learn #cookbook {
    background-image: var(--grad-violet-blue-35)
}

body.learn #cookbook .features {
    margin-bottom: 0
}

body.learn #start-learning,
body.learn .carousel-section {
    padding-top: var(--gutter-lg)
}

#banner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 1027px;
    justify-content: flex-end
}

#banner .embed-container {
    height: 100%;
    max-height: 600px;
    max-width: 1075px;
    padding: 0 var(--gutter-sm);
    width: 100%
}

#banner .embed-container iframe {
    position: static
}

#banner .hero-details {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: var(--gutter-sm);
    justify-content: space-between;
    margin-bottom: 69px;
    margin-top: 54px
}

#banner .hero-details .btn.secondary {
    background-color: #fff;
    border: none
}

#banner .hero-details .btn.secondary:hover {
    color: var(--primary)
}

#banner .hero-details p {
    color: #fff;
    font-size: var(--font-size-heading-5);
    max-width: 579px;
    text-align: center
}

#story .story-detail {
    max-width: none;
    padding: initial;
    width: auto
}

#story .story-detail .tabs {
    --anim-offset: 200px
}

@keyframes slideup {
    0% {
        opacity: 0
    }

    to {
        opacity: 1;
        top: 0
    }
}

#story .story-detail .tabs .modal {
    background-color: rgba(0, 0, 0, .5);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100
}

#story .story-detail .tabs .modal,
#story .story-detail .tabs .modal .modal-inner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center
}

#story .story-detail .tabs .modal .modal-inner {
    background: #fff;
    border-radius: 10px;
    -webkit-box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    padding: 0;
    position: relative;
    width: 312px
}

#story .story-detail .tabs .modal .modal-inner .modal-media {
    -webkit-box-flex: 50%;
    -ms-flex: 50%;
    flex: 50%
}

#story .story-detail .tabs .modal .modal-inner .modal-media .modal-img {
    border-radius: 10px 10px 0 0;
    height: 320px;
    -o-object-fit: cover;
    object-fit: cover
}

#story .story-detail .tabs .modal .modal-inner .modal-media .modal-inner-close {
    cursor: pointer;
    position: absolute;
    right: 16px;
    top: 16px
}

#story .story-detail .tabs .modal .modal-inner .modal-body {
    -webkit-box-flex: 50%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 50%;
    flex: 50%;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    justify-content: flex-start;
    padding: 24px;
    width: 100%
}

#story .story-detail .tabs .modal .modal-inner .modal-body a,
#story .story-detail .tabs .modal .modal-inner .modal-body h3,
#story .story-detail .tabs .modal .modal-inner .modal-body p,
#story .story-detail .tabs .modal .modal-inner .modal-body>h5 {
    margin: 0;
    padding: 0
}

#story .story-detail .tabs .modal .modal-inner .modal-body>h5 {
    color: #13c2ad
}

#story .story-detail .tabs .modal .modal-inner .modal-body>a>h5 {
    margin-right: 8px
}

#story .story-detail .tabs .tabs-header {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    display: inherit;
    -ms-flex-direction: row;
    flex-direction: row;
    margin-bottom: 64px
}

#story .story-detail .tabs .tabs-menu ul {
    background-color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 8px;
    overflow: scroll;
    text-align: center
}

#story .story-detail .tabs ul::-webkit-scrollbar {
    display: none
}

#story .story-detail .tabs ul {
    border-radius: 0;
    margin: 0;
    padding: 0
}

#story .story-detail .tabs ul>a {
    -webkit-box-flex: 0;
    border: none;
    -ms-flex: none;
    flex: none;
    margin-bottom: 0
}

#story .story-detail .tabs ul>a:hover {
    background-color: var(--grey-3);
    color: var(--grey-6)
}

#story .story-detail .tabs ul>a.active {
    background-color: var(--blue-6);
    color: #fff
}

#story .story-detail .tabs .tabs-content {
    margin: 64px auto;
    max-width: 1112px
}

#story .story-detail .tabs .tab-content {
    display: none;
    opacity: 0;
    position: relative;
    top: var(--anim-offset)
}

#story .story-detail .tabs .tab-content.no-spy {
    top: 0
}

#story .story-detail .tabs .tab-content.active {
    -webkit-animation-delay: 0ms;
    animation-delay: 0ms;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    -webkit-animation-iteration-count: 1;
    animation-iteration-count: 1;
    -webkit-animation-name: slideup;
    animation-name: slideup;
    -webkit-animation-timing-function: var(--ui-anim-func);
    animation-timing-function: var(--ui-anim-func);
    display: block
}

#story .story-detail .tabs .tab-content #home.module {
    padding: 0
}

#story .story-detail .tabs .tab-content #home.module .features.container {
    width: 100%
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 120px;
    position: static
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview,
#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-flex: 50%;
    align-items: flex-start;
    -ms-flex: 50%;
    flex: 50%;
    margin-top: 60px;
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content>hgroup {
    margin-bottom: 32px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h1 {
    font-size: 46px;
    line-height: 55px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
    color: var(--violet-4);
    margin-bottom: 16px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content p {
    margin: 0;
    padding: 0
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content .btn {
    margin-top: 32px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .on-demand .overview-content p {
    margin-bottom: 40px !important
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .on-demand .btn {
    font-size: 16px;
    height: 50px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth .overview-content .btn.primary {
    background: linear-gradient(91.87deg, #4100e0 .1%, #f8bbd0 120.1%);
    border: none;
    -webkit-box-shadow: 1px 6px 16px rgba(148, 85, 217, .24);
    box-shadow: 1px 6px 16px rgba(148, 85, 217, .24);
    padding: 13px 48px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended .overview-content {
    width: 100%
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended .btn {
    font-size: 16px;
    height: 50px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended p {
    font-size: 24px;
    line-height: 32px
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .get-involved .overview-content .get-involved-link {
    margin-bottom: 0
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .feature {
    margin-top: 100px;
    padding: 0
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .feature h3,
#story .story-detail .tabs .tab-content #home.module .stacked-feature .feature p {
    margin: 0;
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #home.module .stacked-feature .feature p {
    margin-top: 24px
}

#story .story-detail .tabs .tab-content #faqs.module .features.container {
    margin: 0
}

#story .story-detail .tabs .tab-content #faqs.module .stacked-feature>hgroup {
    margin: 0 0 112px;
    max-width: -webkit-fit-content;
    max-width: -moz-fit-content;
    max-width: fit-content;
    padding: 0;
    text-align: left;
    width: 100%
}

#story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature {
    border-bottom: 1px solid var(--grey-3);
    margin-top: 40px;
    padding: 0
}

#story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature:last-child {
    border-bottom: none;
    padding-bottom: 0
}

#story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between
}

#story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature h3 {
    margin: 0
}

#story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature p {
    margin: 24px 0 0;
    padding: 0 0 40px
}

#story .story-detail .tabs .tab-content #faqs.module .stacked-feature .feature p:empty {
    display: none
}

#story .story-detail .tabs .tab-content #schedule.module {
    padding: 0
}

#story .story-detail .tabs .tab-content #schedule.module .features.container {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

#story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between;
    position: static
}

#story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    margin-bottom: 16px;
    margin-top: 60px;
    max-width: 90%;
    padding-left: 0;
    text-align: left;
    width: 90%
}

#story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup h1 {
    font-size: 46px;
    line-height: 55px
}

#story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup h4.eyebrow.faqs {
    color: var(--violet-4)
}

#story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup p {
    font-size: var(--font-size-heading-4)
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section {
    margin-top: 64px
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section p {
    margin-bottom: 0
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section .btn.quiet.workshop-nav {
    color: var(--primary);
    font-size: var(--font-size-heading-4);
    margin-bottom: 80px;
    margin-top: 16px;
    padding: 0;
    text-align: left;
    text-decoration: underline
}

#story .story-detail .tabs .tab-content #schedule.module .feature {
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #schedule.module .feature h1 {
    font-size: 36px;
    line-height: 40px
}

#story .story-detail .tabs .tab-content #schedule.module .feature p {
    margin-top: 16px;
    padding: 0
}

#story .story-detail .tabs .tab-content #schedule.module .feature h2 {
    font-size: 34px;
    font-weight: var(--font-weight-default);
    line-height: 40px;
    margin: 64px 0
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container {
    border-bottom: 1px solid var(--grey-3)
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container,
#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection {
    margin-bottom: 64px
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h3 {
    color: var(--grey-6);
    font-size: 28px;
    font-weight: var(--font-weight-default);
    line-height: 34px;
    margin: 0 0 8px;
    min-width: 198px
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection p {
    color: var(--grey-6);
    font-size: 20px;
    line-height: 30px;
    margin: 24px 0
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h4 {
    color: var(--grey-6);
    font-size: 20px;
    font-weight: var(--font-weight-default);
    line-height: 24px
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul {
    margin-top: 16px
}

#story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul>p {
    color: var(--grey-6);
    font-size: 16px;
    font-weight: var(--font-weight-bold);
    line-height: 24px;
    margin: 8px 0
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 80px;
    justify-content: space-between;
    margin-bottom: 120px;
    position: static
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-flex: 50%;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 50%;
    flex: 50%;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content>hgroup {
    margin-bottom: 32px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content h1 {
    font-size: 46px;
    line-height: 55px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
    color: var(--violet-4)
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content p {
    font-size: 24px;
    margin: 0 0 32px;
    padding: 0
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content .btn.primary {
    margin-top: 8px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .embed-container {
    height: 286px;
    margin: 0;
    padding: 0;
    position: static;
    width: 100%
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .embed-container>iframe {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    width: 100%
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview.on-demand-demo {
    margin-bottom: 0;
    margin-top: 150px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview.on-demand-demo .overview-content hgroup {
    margin: 0
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview.on-demand-demo .overview-content a {
    height: 50px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview.on-demand-demo .overview-content p {
    margin: 0
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview.on-demand-demo .overview-content {
    gap: 40px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview.on-demand-demo .img-container {
    -webkit-box-flex: 50%;
    -ms-flex: 50%;
    flex: 50%;
    height: 375px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview.on-demand-demo .img-container>img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    width: 100%
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature {
    display: block;
    margin-top: 100px;
    padding: 0
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature h3,
#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature p {
    margin: 0;
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature p {
    margin-top: 24px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 48px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid {
    grid-gap: 24px;
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 24px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid .on-demand-card {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--grey-3);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid .on-demand-card .embed-container {
    margin: 0;
    min-height: 239px;
    padding: 0;
    position: static;
    width: 100%
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid .on-demand-card .embed-container>iframe {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: relative;
    width: 100%
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid .on-demand-card .card-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 12px;
    padding: 32px 48px 32px 32px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid .on-demand-card .card-content h3 {
    font-size: 28px;
    font-weight: 700;
    line-height: 34px
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid .on-demand-card .card-content p {
    color: var(--grey-6);
    font-size: 16px;
    margin: 0
}

#story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container h3 {
    color: #000;
    font-size: 46px;
    font-weight: var(--font-weight-normal)
}

#story .story-detail .tabs .tab-content #community.module {
    padding: 0
}

#story .story-detail .tabs .tab-content #community.module .community-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between
}

#story .story-detail .tabs .tab-content #community.module hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 60px;
    min-width: 300px;
    text-align: left;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content
}

#story .story-detail .tabs .tab-content #community.module .eyebrow {
    color: var(--violet-4)
}

#story .story-detail .tabs .tab-content #community.module .community-section {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid var(--grey-3);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    margin-bottom: 100px;
    margin-top: 100px;
    padding-bottom: 100px
}

#story .story-detail .tabs .tab-content #community.module .community-section #map {
    padding: 0;
    width: 100%
}

#story .story-detail .tabs .tab-content #community.module .community-section #map .map {
    background-color: #eee;
    height: 700px;
    width: 100%
}

#story .story-detail .tabs .tab-content #community.module .community-section #map .map .cluster img {
    height: 100% !important;
    width: 100% !important
}

#story .story-detail .tabs .tab-content #community.module .community-section #map .map .map-info-window {
    max-width: 354px;
    padding: 4px;
    text-align: left
}

#story .story-detail .tabs .tab-content #community.module .community-section #map .map .map-info-window h5 {
    color: #000;
    font-size: 16px;
    font-weight: var(--font-weight-normal);
    line-height: 20px;
    margin-bottom: 14px
}

#story .story-detail .tabs .tab-content #community.module .community-section #map .map .map-info-window h3 {
    color: #000;
    font-size: 24px;
    font-weight: var(--font-weight-normal);
    line-height: 30px
}

#story .story-detail .tabs .tab-content #community.module .community-section #map .map .map-info-window p {
    font-size: 14px;
    font-weight: var(--font-weight-normal);
    line-height: 20px;
    margin: 0;
    padding: 0
}

#story .story-detail .tabs .tab-content #community.module .community-section #map .map .map-info-window .btn.quiet {
    color: var(--primary);
    font-size: 18px;
    font-weight: var(--font-weight-normal);
    line-height: 20px;
    margin: 12px 0 0;
    padding: 0
}

#story .story-detail .tabs .tab-content #community.module .community-section>h1 {
    font-weight: var(--font-weight-normal)
}

#story .story-detail .tabs .tab-content #community.module .community-section>p {
    margin-bottom: 80px;
    margin-top: 24px;
    padding: 0;
    text-align: justify
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container {
    grid-gap: 32px;
    display: grid;
    grid-auto-rows: 0;
    grid-template-columns: 1fr;
    grid-template-rows: repeat(6, 1fr)
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container.expanded {
    grid-auto-rows: auto auto
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container .qa-card {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 1px solid var(--grey-3);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    max-width: 346px;
    padding: 48px
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container .qa-card>h3 {
    font-weight: var(--font-weight-normal)
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container .qa-card>p {
    font-size: var(--font-size-heading-4);
    font-weight: var(--font-weight-normal);
    line-height: 24px;
    margin: 0;
    padding: 0;
    text-align: center
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container .qa-card .btn.quiet {
    color: var(--primary);
    font-size: 16px;
    margin-top: 40px
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container .qa-card:nth-child(n+7) {
    display: none
}

#story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container .qa-card:nth-child(n+7).expanded {
    display: block
}

#story .story-detail .tabs .tab-content #community.module .community-section .btn.quiet {
    margin-top: 32px
}

#story .story-detail .tabs .tab-content #community.module .community-section .btn.quiet i,
#story .story-detail .tabs .tab-content #community.module .community-section .btn.quiet>p {
    color: var(--primary);
    font-size: var(--font-size-heading-3);
    margin: 0 12px 0 0;
    padding: 0
}

#story .story-detail .tabs .tab-content #community.module .community-section .btn.quiet:hover {
    color: var(--primary) !important
}

#story .story-detail .tabs .tab-content #twitter.module {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: space-between;
    padding: var(--gutter-sm) 0
}

#story .story-detail .tabs .tab-content #twitter.module .text {
    -webkit-box-flex: 25%;
    -ms-flex: 25%;
    flex: 25%;
    max-width: 352px;
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #twitter.module .text h3 {
    font-size: 36px;
    line-height: 60px;
    margin: 0 0 16px
}

#story .story-detail .tabs .tab-content #twitter.module .media {
    -webkit-box-flex: 75%;
    -ms-flex: 75%;
    flex: 75%;
    max-width: 646px
}

#story .story-detail .tabs .tab-content #twitter.module .social-icons {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: 16px;
    margin-bottom: var(--gutter)
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module {
    padding: 0
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features.container {
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .explore {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between;
    margin-bottom: 120px;
    position: static
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .explore .explore-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-box-flex: 50%;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 50%;
    flex: 50%;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: flex-start;
    margin-top: 60px;
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .explore .explore-content>hgroup {
    margin-bottom: 32px
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .explore .explore-content h1 {
    font-size: 46px;
    line-height: 55px
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .explore .explore-content h4.eyebrow.faqs {
    color: var(--violet-4)
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .explore .explore-content p {
    margin: 0 0 32px;
    padding: 0
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .explore .explore-content .btn.primary {
    margin-top: 8px
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    justify-content: center;
    padding: 0;
    text-align: left;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .feature {
    margin-top: 100px;
    padding: 0
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .feature h3,
#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .feature p {
    margin: 0;
    padding: 0;
    text-align: left
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .stacked-feature .feature p {
    margin-top: 24px
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: 24px;
    justify-content: space-between
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div {
    background: #041e3c;
    background-image: linear-gradient(359.97deg, rgba(58, 241, 215, .53) .03%, rgba(4, 30, 60, 0) 22.5%);
    border-radius: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 320px;
    overflow: hidden;
    position: relative;
    width: 312px
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div:hover {
    background-image: linear-gradient(359.97deg, rgba(58, 241, 215, .53) .03%, rgba(4, 30, 60, 0) 66.5%);
    -webkit-box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
    cursor: pointer
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div:hover>img {
    opacity: 0;
    -webkit-transform: scale(1.5);
    transform: scale(1.5)
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div:hover>h3 {
    left: 50%;
    opacity: 1;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div.today-card {
    border: 8px solid #f9e84c
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div.locked-card {
    background-image: linear-gradient(359.97deg, #502c69 .03%, rgba(4, 30, 60, 0) 66.5%);
    cursor: auto
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div>img {
    border-radius: 20px;
    -o-object-fit: cover;
    object-fit: cover;
    -webkit-transition: opacity .2s ease-in-out, -webkit-transform .3s cubic-bezier(.47, 1.64, .41, .8);
    transition: opacity .2s ease-in-out, -webkit-transform .3s cubic-bezier(.47, 1.64, .41, .8);
    transition: transform .3s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out;
    transition: transform .3s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out, -webkit-transform .3s cubic-bezier(.47, 1.64, .41, .8)
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div>h3 {
    color: #fff;
    font-size: 40px;
    left: 50%;
    line-height: 60px;
    opacity: 0;
    position: absolute;
    top: 70%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: top .5s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out;
    transition: top .5s cubic-bezier(.47, 1.64, .41, .8), opacity .2s ease-in-out;
    width: 100%
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div .day-badge {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #27f5dd;
    border-radius: 12px;
    bottom: 8px;
    color: #041e3c;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 40px;
    font-weight: 700;
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    justify-content: center;
    line-height: 34px;
    min-height: 80px;
    min-width: 80px;
    padding: 21px 14px;
    position: absolute;
    right: 8px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div .day-badge img {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
    -webkit-transition: none;
    transition: none
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div .day-badge.today {
    background: #f9e84c;
    border-radius: 12px 0;
    bottom: 0;
    right: 0
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div .day-badge.locked {
    background: #041e3c;
    color: #fff
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div .day-badge.locked:hover {
    cursor: auto
}

#story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .content-cards div .day-badge:hover {
    -webkit-box-shadow: none;
    box-shadow: none
}

#story .story-detail #guidelines.module,
#story .story-detail #workshop-details.module {
    padding: 0
}

#story .story-detail #guidelines.module .container .guidelines-nav,
#story .story-detail #guidelines.module .container .workshop-details-nav,
#story .story-detail #workshop-details.module .container .guidelines-nav,
#story .story-detail #workshop-details.module .container .workshop-details-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 27px
}

#story .story-detail #guidelines.module .container .guidelines-nav .btn.quiet,
#story .story-detail #guidelines.module .container .workshop-details-nav .btn.quiet,
#story .story-detail #workshop-details.module .container .guidelines-nav .btn.quiet,
#story .story-detail #workshop-details.module .container .workshop-details-nav .btn.quiet {
    color: var(--primary);
    font-size: var(--font-size-heading-5)
}

#story .story-detail #guidelines.module .container .guidelines-nav .btn.quiet>i,
#story .story-detail #guidelines.module .container .workshop-details-nav .btn.quiet>i,
#story .story-detail #workshop-details.module .container .guidelines-nav .btn.quiet>i,
#story .story-detail #workshop-details.module .container .workshop-details-nav .btn.quiet>i {
    margin-right: 5px
}

#story .story-detail #guidelines.module .container .guidelines-header,
#story .story-detail #guidelines.module .container .workshop-details-header,
#story .story-detail #workshop-details.module .container .guidelines-header,
#story .story-detail #workshop-details.module .container .workshop-details-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    justify-content: space-between;
    margin-bottom: 40px;
    padding: 0 28px
}

#story .story-detail #guidelines.module .container .guidelines-header hgroup,
#story .story-detail #guidelines.module .container .workshop-details-header hgroup,
#story .story-detail #workshop-details.module .container .guidelines-header hgroup,
#story .story-detail #workshop-details.module .container .workshop-details-header hgroup {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-top: 60px;
    min-width: 300px;
    text-align: left;
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content
}

#story .story-detail #guidelines.module .container .guidelines-header hgroup .eyebrow,
#story .story-detail #guidelines.module .container .workshop-details-header hgroup .eyebrow,
#story .story-detail #workshop-details.module .container .guidelines-header hgroup .eyebrow,
#story .story-detail #workshop-details.module .container .workshop-details-header hgroup .eyebrow {
    color: var(--violet-4)
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block {
    border-bottom: 1px solid var(--grey-3);
    margin-bottom: 48px;
    margin-top: 48px;
    padding-bottom: 48px
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block:last-child,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block:last-child,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block:last-child,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block:last-child {
    border-bottom: none;
    margin: 0;
    padding: 0
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block h2,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block h2,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block h2,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block h2 {
    font-size: 28px;
    font-weight: 700;
    line-height: 34px;
    margin-bottom: 32px;
    text-align: left
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block p,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block p,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block p,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block p {
    color: var(----grey-6);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    margin-bottom: 0;
    padding: 0
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block a,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block a,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block a,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block a {
    color: #1389fd
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block ul,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block ul,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block ul,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block ul {
    font-size: var(--font-size-heading-5);
    margin: 0 0 0 12px;
    padding: 0
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block.columns,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block.columns,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block.columns,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block.columns {
    display: grid;
    grid-template-columns: 1fr 1fr
}

#story .story-detail #guidelines.module .container .guidelines-body .text-block.columns h2,
#story .story-detail #guidelines.module .container .guidelines-body .text-block.columns ul,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block.columns h2,
#story .story-detail #guidelines.module .container .workshop-details-body .text-block.columns ul,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block.columns h2,
#story .story-detail #workshop-details.module .container .guidelines-body .text-block.columns ul,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block.columns h2,
#story .story-detail #workshop-details.module .container .workshop-details-body .text-block.columns ul {
    grid-column: span 2
}

#story .story-detail #workshop-details.module .container .workshop-details-body .text-block {
    max-width: 800px;
    text-align: left
}

#story .story-detail #workshop-details.module .container .workshop-details-body .text-block b {
    font-size: 16px
}

#story .story-detail #workshop-details.module .container .workshop-details-body .text-block a {
    text-decoration: underline
}

#story .story-detail #workshop-details.module .container .workshop-details-body .text-block {
    border: none
}

#story .story-detail #workshop-details.module .container .workshop-details-body .text-block:last-child {
    border-bottom: 1px solid rgba(0, 0, 0, .1);
    margin-bottom: 52px;
    padding-bottom: 48px
}

#story .story-detail #workshop-details.module .btn.quiet {
    padding: 0
}

@media (min-width:1024px) {
    #story .story-detail .tabs .modal .modal-inner {
        width: 532px
    }

    #story .story-detail .tabs .tabs-menu ul {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }

    #story .story-detail .tabs .tab-content {
        margin-top: 116px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview {
        margin-bottom: 160px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-flex: 50%;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex: 50%;
        flex: 50%;
        -ms-flex-direction: column;
        flex-direction: column;
        justify-content: space-between;
        margin-top: 0;
        padding: 0;
        text-align: left
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content>hgroup {
        margin-bottom: 32px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h1 {
        font-size: 64px;
        line-height: 72px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
        color: var(--violet-4)
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content p {
        margin: 0;
        padding: 0
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview .overview-content .btn {
        margin-top: 32px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(odd) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(odd) .overview-content {
        margin-left: 82px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(2n) {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .overview:nth-child(2n) .overview-content {
        margin-right: 82px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth {
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: flex-start;
        align-items: center;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        gap: 82px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth .img-container {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%;
        height: 375px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .holo-booth .overview-content {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%;
        margin-left: 0
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .flutter-forward-extended p {
        width: 515px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .get-involved {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        gap: 63px
    }

    #story .story-detail .tabs .tab-content #home.module .stacked-feature .get-involved .overview-content {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%;
        margin-left: 0
    }

    #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: space-between
    }

    #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup {
        margin: 0 24px 120px 0;
        max-width: 885px
    }

    #story .story-detail .tabs .tab-content #schedule.module .stacked-feature-banner>hgroup h1 {
        font-size: 64px;
        line-height: 72px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section {
        margin-top: 80px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-section .btn.quiet.workshop-nav {
        margin-bottom: 0
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature h1 {
        font-size: 60px;
        line-height: 60px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature h2 {
        font-size: 40px;
        font-weight: var(--font-weight-default);
        line-height: 56px;
        margin: 80px 0
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        margin-top: 80px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: flex-start;
        margin-bottom: 80px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection>h3 {
        margin-right: 24px;
        min-width: 198px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h3 {
        color: var(--grey-6);
        font-size: 28px;
        font-weight: var(--font-weight-default);
        line-height: 34px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection p {
        color: var(--grey-6);
        font-size: 20px;
        line-height: 30px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection h4 {
        color: var(--grey-6);
        font-size: 20px;
        font-weight: var(--font-weight-default);
        line-height: 24px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul {
        margin-top: 16px
    }

    #story .story-detail .tabs .tab-content #schedule.module .feature .schedule-container .schedule-subsection ul>p {
        color: var(--grey-6);
        font-size: 16px;
        font-weight: var(--font-weight-bold);
        line-height: 24px;
        margin: 0 0 4px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-bottom: 160px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-flex: 50%;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex: 50%;
        flex: 50%;
        -ms-flex-direction: column;
        flex-direction: column;
        justify-content: flex-start;
        margin-top: 0;
        padding: 0;
        text-align: left
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content>hgroup {
        margin-bottom: 32px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content h1 {
        font-size: 64px;
        line-height: 72px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content h4.eyebrow.faqs {
        color: var(--violet-4)
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content p {
        font-size: 24px;
        margin: 0 0 32px;
        padding: 0
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .overview-content .btn.primary {
        font-size: 16px;
        height: 50px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .overview .embed-container {
        -webkit-box-flex: 50%;
        -ms-flex: 50%;
        flex: 50%
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature {
        margin-top: 160px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container {
        margin-top: 112px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container .on-demand-grid {
        grid-gap: 24px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        margin-top: 56px
    }

    #story .story-detail .tabs .tab-content #on-demand.module .stacked-feature .feature .on-demand-section-container>h3 {
        font-size: 60px;
        font-weight: 700;
        line-height: 60px
    }

    #story .story-detail .tabs .tab-content #community.module .community-header {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-direction: row;
        flex-direction: row
    }

    #story .story-detail .tabs .tab-content #community.module hgroup {
        margin-top: 0;
        width: 400px
    }

    #story .story-detail .tabs .tab-content #community.module .community-section .collapsible-container {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(2, 1fr)
    }

    #story .story-detail .tabs .tab-content #twitter.module {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        padding: 0 50px
    }

    #story .story-detail .tabs .tab-content #twitter.module .text {
        margin-right: 72px;
        max-width: 294px;
        padding-right: 24px
    }

    #story .story-detail .tabs .tab-content #twitter.module .text h3 {
        font-size: 60px;
        line-height: 60px;
        margin: 0 0 32px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-bottom: 60px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore .explore-content {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        -webkit-box-align: start;
        -ms-flex-align: start;
        -webkit-box-flex: 60%;
        align-items: flex-start;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex: 60%;
        flex: 60%;
        -ms-flex-direction: column;
        flex-direction: column;
        justify-content: flex-start;
        margin-right: 32px;
        margin-top: 0;
        padding: 0;
        text-align: left
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore .explore-content>hgroup {
        margin-bottom: 32px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore .explore-content h1 {
        font-size: 64px;
        line-height: 72px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore .explore-content h4.eyebrow.faqs {
        color: var(--violet-4)
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore .explore-content p {
        margin: 0 0 32px;
        padding: 0
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore .explore-content .btn.primary {
        margin-top: 8px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .stacked-feature .explore img {
        -webkit-box-flex: 40%;
        -ms-flex: 40%;
        flex: 40%
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        gap: 48px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards div {
        width: 338.65px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards div img {
        border-radius: 20px 0 0 0;
        width: 100%
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards div>h3 {
        font-size: 44px
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards div .day-badge {
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards div .day-badge.locked {
        background: #041e3c;
        min-width: 80px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards div:nth-child(5n-3),
    #story .story-detail .tabs .tab-content #seventeen-days-of-flutter.module .features .content-cards div:nth-child(5n-4) {
        width: 532px
    }

    #story .story-detail #guidelines.module .container .guidelines-header,
    #story .story-detail #workshop-details.module .container .guidelines-header {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-direction: row;
        flex-direction: row;
        margin-bottom: 60px
    }

    #story .story-detail #guidelines.module .container .guidelines-header hgroup,
    #story .story-detail #workshop-details.module .container .guidelines-header hgroup {
        margin-top: 0;
        width: 400px
    }

    #story .story-detail #guidelines.module .container .guidelines-body,
    #story .story-detail #guidelines.module .container .workshop-details-body,
    #story .story-detail #workshop-details.module .container .guidelines-body,
    #story .story-detail #workshop-details.module .container .workshop-details-body {
        margin: 0 156px
    }

    #story .story-detail #guidelines.module .container .guidelines-body .text-block ul,
    #story .story-detail #guidelines.module .container .workshop-details-body .text-block ul,
    #story .story-detail #workshop-details.module .container .guidelines-body .text-block ul,
    #story .story-detail #workshop-details.module .container .workshop-details-body .text-block ul {
        display: grid;
        grid-auto-columns: 50%;
        grid-auto-flow: column;
        margin-left: 0
    }

    #story .story-detail #guidelines.module .container .guidelines-body .text-block ul li,
    #story .story-detail #guidelines.module .container .workshop-details-body .text-block ul li,
    #story .story-detail #workshop-details.module .container .guidelines-body .text-block ul li,
    #story .story-detail #workshop-details.module .container .workshop-details-body .text-block ul li {
        margin-left: 20px;
        text-align: left
    }

    #story .story-detail #guidelines.module .container .guidelines-body .text-block ul.five-rows,
    #story .story-detail #guidelines.module .container .workshop-details-body .text-block ul.five-rows,
    #story .story-detail #workshop-details.module .container .guidelines-body .text-block ul.five-rows,
    #story .story-detail #workshop-details.module .container .workshop-details-body .text-block ul.five-rows {
        grid-template-rows: auto repeat(4, 1fr)
    }

    #story .story-detail #guidelines.module .container .guidelines-body .text-block ul.eight-rows,
    #story .story-detail #guidelines.module .container .workshop-details-body .text-block ul.eight-rows,
    #story .story-detail #workshop-details.module .container .guidelines-body .text-block ul.eight-rows,
    #story .story-detail #workshop-details.module .container .workshop-details-body .text-block ul.eight-rows {
        grid-template-rows: repeat(8, 1fr)
    }

    #story .story-detail #guidelines.module .container .workshop-details-body,
    #story .story-detail #workshop-details.module .container .workshop-details-body {
        margin: 0 190px
    }
}

body.monetization section.hero {
    background-image: linear-gradient(35deg, #f3fcff 10%, #93faee 80%)
}

body.monetization #resources,
body.monetization #resources-1 {
    background-image: linear-gradient(145deg, #0654b2 20%, #28f5de 80%)
}

body.monetization #resources-2 {
    background-image: linear-gradient(145deg, #0654b2 30%, #a57df7 90%)
}

body.multiplatform.mobile section.hero {
    background-image: linear-gradient(35deg, #fcfce2 30%, #dcf5fe 60%)
}

body.multiplatform.mobile #feature-grid {
    background-image: linear-gradient(145deg, #0569d8 30%, #833ff3 90%)
}

body.multiplatform.embedded section.hero {
    background-image: linear-gradient(35deg, #dcf5ff 10%, #f3fcff 60%)
}

body.multiplatform.embedded #feature-grid {
    background-image: linear-gradient(35deg, #0a71c8 30%, #14bafe 90%)
}

body.multiplatform.desktop section.hero {
    background-image: linear-gradient(35deg, #d9fef7 10%, #f3fcff 60%)
}

body.multiplatform.desktop section.hero .container>h2 {
    max-width: 800px
}

body.multiplatform.desktop #feature-grid {
    background-image: linear-gradient(145deg, #0654b2 30%, #14b8fd 90%)
}

body.multiplatform.web section.hero {
    background-image: linear-gradient(35deg, #e6e4fd 10%, #f3fcff 60%)
}

body.multiplatform.web #feature-grid {
    background-image: linear-gradient(145deg, #037efe 30%, #1cdac6 90%)
}

body.multiplatform #notification.module {
    padding-bottom: 0
}

body.multiplatform.ios section .divider {
    background: var(--grey-3);
    height: 1px;
    margin-top: 56px;
    width: 100%
}

body.multiplatform.ios section .body {
    color: var(--grey-6);
    font-family: var(--font-roboto);
    font-size: 20px;
    font-weight: 400;
    line-height: 30px;
    margin-bottom: 40px
}

body.multiplatform.ios section.hero {
    background: linear-gradient(225deg, rgba(231, 248, 255, .5), rgba(184, 234, 254, .5))
}

@media (min-width:1024px) {
    body.multiplatform.ios section.hero .container .mantle .text {
        width: 553px
    }
}

body.multiplatform.ios section.hero .container .mantle .text h1 {
    font-size: 48px
}

body.multiplatform.ios section.hero .container .mantle .text h3 {
    margin-bottom: 32px;
    margin-top: 8px
}

body.multiplatform.ios section.ios-tabs {
    padding-top: var(--spacer)
}

@media (min-width:1024px) {
    body.multiplatform.ios section.ios-tabs .tabs .tabs-header .tabs-menu {
        width: unset !important
    }
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-header .tabs-menu {
    width: 300px
}

@media (min-width:1024px) {
    body.multiplatform.ios section.ios-tabs .tabs .tabs-header .tabs-menu li {
        min-width: unset !important
    }
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-header .tabs-menu li {
    min-width: 140px
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

@media (min-width:1024px) {
    body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content.active {
    gap: 24px
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content .a-wrapper,
body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content.active {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center
}

@media (min-width:1024px) {
    body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content .a-wrapper {
        -webkit-box-pack: left;
        -ms-flex-pack: left;
        justify-content: left
    }
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content .btn {
    font-size: 16px !important;
    height: 48px
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content .text {
    max-width: 500px;
    padding: 0
}

@media (min-width:1024px) {
    body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content img {
        float: right;
        height: 218px;
        width: auto
    }
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content .mono {
    font-family: var(--font-roboto-mono) !important
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-content .tab-content h3>a {
    color: var(--blue-6);
    text-decoration: underline
}

body.multiplatform.ios section.ios-tabs .tabs .tabs-title {
    margin: 48px 0;
    text-align: center
}

body.multiplatform.ios section.ios-tabs .tabs .title {
    color: #13c2ad;
    font-size: 24px;
    font-weight: 700;
    line-height: 32px;
    margin-bottom: 8px;
    text-align: left
}

body.multiplatform.ios section.ios-tabs .tabs .second-tab {
    color: var(--violet-2)
}

body.multiplatform.ios section.ios-tabs .tabs .third-tab {
    color: var(--coral)
}

body.multiplatform.ios section.ios-tabs .tabs h2 {
    font-size: 32px
}

@media (min-width:1024px) {
    body.multiplatform.ios section.ios-tabs .tabs li {
        font-size: 20px;
        height: 48px;
        max-width: 330px;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }
}

body.multiplatform.ios section.ios-tabs .tabs li.active {
    background-color: var(--blue-5)
}

body.multiplatform.ios #list h2 {
    font-size: 40px;
    margin-bottom: 16px
}

@media (min-width:1024px) {
    body.multiplatform.ios #list h2 {
        font-size: 48px;
        line-height: 72px
    }
}

body.multiplatform.ios #list h3 {
    color: var(--grey-6);
    font-size: 24px;
    line-height: 27px
}

body.multiplatform.ios #list p {
    color: var(--grey-6);
    font-size: 20px;
    line-height: 30px
}

body.multiplatform.ios #list .columns {
    display: grid;
    grid-template-columns: 1fr
}

@media (min-width:1024px) {
    body.multiplatform.ios #list .columns {
        grid-template-columns: 1fr 1fr
    }

    body.multiplatform.ios #list .columns ul {
        -webkit-column-gap: 48px;
        -moz-column-gap: 48px;
        column-gap: 48px;
        display: grid;
        grid-auto-flow: column;
        grid-column: span 2;
        grid-template-rows: repeat(3, 1fr)
    }
}

body.multiplatform.ios #list .columns ul {
    margin-top: 32px
}

body.multiplatform.ios #list .columns ul li::marker {
    color: var(--blue-6);
    content: "\2022";
    display: inline-block;
    width: 24px
}

body.multiplatform.ios #list .columns ul li {
    color: var(--grey-6);
    font-size: 12px;
    margin-bottom: 16px;
    padding-left: 24px
}

@media (min-width:1024px) {
    body.multiplatform.ios #list .columns ul li {
        font-size: 28px
    }
}

body.multiplatform.ios #list .columns ul li span {
    font-size: 20px
}

body.multiplatform.ios #list .columns ul a {
    color: var(--blue-6)
}

body.multiplatform.ios #playlist h2 {
    font-size: 48px
}

body.multiplatform.ios #feature-grid {
    background-image: linear-gradient(145deg, #0569d8 30%, #833ff3 90%)
}

body.multiplatform.ios #feature-grid h2 {
    font-size: 48px
}

body.multiplatform.ios #feature-grid .feature-header {
    margin-bottom: 32px
}

body.multiplatform.ios #feature-grid .feature-grid-features>div {
    padding: 32px
}

body.multiplatform.ios #feature-grid .feature-grid-features .feature-with-link {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: 32px
}

body.news section.hero {
    background-image: linear-gradient(35deg, #f3fcff 10%, #93faee 80%);
    padding-bottom: var(--gutter) !important;
    padding-top: var(--gutter) !important
}

@media (min-width:1024px) {
    body.news section.hero .container>h2 {
        margin-bottom: var(--spacer) !important;
        margin-top: var(--spacer) !important;
        max-width: 600px !important
    }

    body.news section.hero .container .mantle {
        gap: 0;
        grid-template-columns: 1fr 55%
    }

    body.news section.hero .container .mantle .text {
        padding-left: 0
    }

    body.news section.hero .container .mantle .text h1 {
        font-size: 64px;
        font-weight: 700;
        line-height: 72px;
        max-width: 100%
    }

    body.news section.hero .container .mantle .text h2 {
        font-size: 34px;
        font-weight: 400;
        line-height: 40px
    }
}

body.news .divider {
    background: var(--grey-3);
    border-radius: 2px;
    height: 4px;
    margin: 16px auto;
    width: 1340px
}

body.news #feature-columns .container {
    margin: 0 auto
}

body.news #feature-columns .feature-columns .card {
    border: none;
    padding: 0;
    width: 100%
}

@media (min-width:1024px) {
    body.news #feature-columns .feature-columns p {
        min-height: 141px
    }
}

body.news #flutter-news-toolkit .container {
    margin: 0 auto
}

body.news #flutter-news-toolkit .media img {
    width: 312px
}

body.news #flutter-news-toolkit h3 {
    font-size: 44px
}

@media (min-width:1024px) {
    body.news #flutter-news-toolkit .feature.toolkit {
        gap: 137px;
        grid-template-columns: 1fr 1fr
    }

    body.news #flutter-news-toolkit .feature.toolkit h4 {
        font-size: 24px
    }

    body.news #flutter-news-toolkit .feature.toolkit h3 {
        font-size: 64px
    }

    body.news #flutter-news-toolkit .feature.toolkit p {
        font-size: 24px
    }

    body.news #flutter-news-toolkit .feature.toolkit .text {
        -webkit-box-ordinal-group: 3;
        -ms-flex-order: 2;
        order: 2;
        padding: 0
    }

    body.news #flutter-news-toolkit .feature.toolkit .media img {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        height: 575px;
        order: 1;
        width: 544px
    }
}

body.news #resources {
    background-image: linear-gradient(145deg, #0654b2 20%, #28f5de 80%)
}

body.notfound section.hero {
    padding: 10px 0
}

body.notfound #content h1,
body.notfound #content h2 {
    text-align: center
}

body.notfound #content h1 {
    font-size: var(--font-size-heading-1);
    margin-bottom: var(--gutter)
}

body.notfound #content h2 {
    font-size: var(--font-size-heading-3);
    margin: 0 auto;
    margin-bottom: var(--gutter);
    max-width: 658px
}

body.notfound #content img {
    display: block;
    margin: 0 auto;
    margin-bottom: var(--gutter);
    max-width: 850px;
    width: 100%
}

body.notfound #content .links {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    display: grid;
    -ms-flex-direction: column;
    flex-direction: column;
    grid-template-columns: 1fr;
    margin: 0 auto;
    margin-bottom: var(--gutter);
    max-width: 620px;
    text-align: center
}

body.notfound #content .links ul {
    display: block;
    margin: 0;
    padding: 0
}

body.notfound #content .links ul li {
    margin-bottom: var(--spacer-sm)
}

body.notfound #content .links a {
    color: var(--blue-6);
    font-size: var(--font-size-heading-5);
    font-weight: var(--font-weight-bold)
}

body.notfound #content .links a:hover {
    text-decoration: underline
}

@media (min-width:640px) {
    body.notfound #content section.hero {
        padding: 20px 0
    }

    body.notfound #content .links {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        grid-template-columns: 1fr 1fr 15%;
        justify-content: space-between;
        position: relative;
        text-align: left
    }
}

body.partner {
    font-family: var(--font-roboto)
}

body.partner #notification.module {
    background-color: var(--grey-1)
}

body.partner section.hero {
    background: linear-gradient(224deg, var(--blue-1) 0, var(--blue-2) 100%)
}

body.partner .hero-content {
    margin: 0 auto;
    width: 90%
}

body.partner .hero-content h2 {
    font-family: var(--font-gsans);
    font-size: 2.625rem !important;
    font-style: normal;
    font-weight: 700 !important;
    margin: 0 !important
}

body.partner .hero-content p {
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 400;
    margin: 1.5rem 0 0
}

body.partner section.content-container .story-grid {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: var(--gutter);
    justify-content: center
}

body.partner .terms-of-service-text-container {
    padding: 7rem 0
}

body.partner .text-container {
    margin: 0 auto;
    width: 85%
}

body.partner .text-container h3 {
    font-family: var(--font-gsans);
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 1.5rem
}

body.partner .text-container p.paragraph {
    font-family: var(--font-roboto);
    font-size: 1rem;
    line-height: 1.5rem;
    margin-bottom: 1.75rem
}

body.partner .text-container p.paragraph:first-of-type {
    margin-top: 1.75rem
}

body.partner .text-container p.paragraph:last-of-type {
    margin-bottom: 0
}

body.partner .text-container p>a {
    text-decoration-line: underline
}

body.partner .carousel-section h1 {
    margin: auto 24px
}

body.partner .carousel-section .carousel .carousel-slider {
    padding-left: var(--gutter)
}

body.partner .carousel-section .carousel .carousel-slider .carousel-featured-card .text .btn.quiet,
body.partner .carousel-section .carousel .carousel-slider .carousel-featured-card .text h3,
body.partner .carousel-section .carousel .carousel-slider .carousel-featured-card .text p {
    color: #fff
}

body.partner .carousel-section .carousel .carousel-slider .carousel-featured-card .text .btn.quiet:hover,
body.partner .carousel-section .carousel .carousel-slider .carousel-featured-card .text h3:hover,
body.partner .carousel-section .carousel .carousel-slider .carousel-featured-card .text p:hover {
    color: #fff !important
}

body.partner #stories .stories-header {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: flex-end;
    width: 100%
}

body.partner #newsletter {
    background-color: #fff;
    padding-top: var(--gutter-lg)
}

body.partner #cta {
    background-color: #fff
}

@media (min-width:768px) {
    body.partner .hero-content {
        width: 80%
    }

    body.partner .text-container {
        width: 70%
    }

    body.partner .carousel-section {
        padding: 0 80px 70px
    }

    body.partner .carousel-section h1 {
        margin-bottom: 44px;
        margin-left: 50px
    }
}

@media (min-width:1024px) {
    body.partner .hero-content {
        width: 70%
    }

    body.partner .hero-content h2 {
        font-size: 3.625rem !important
    }

    body.partner .text-container {
        width: 50%
    }

    body.partner .carousel-section {
        padding: 0 80px 70px
    }

    body.partner .carousel-section h1 {
        margin-bottom: 44px;
        margin-left: 50px
    }
}

body.showcase #header .container>.mantle>.media {
    padding: 92px 0
}

body.showcase #notification.module {
    background-color: var(--grey-1)
}

body.showcase #flutter-apps {
    padding: 56px 0
}

body.showcase #flutter-apps hgroup {
    padding-left: 0 !important
}

@media (min-width:1024px) {
    body.showcase #flutter-apps {
        padding: var(--gutter-md) 0
    }
}

body.showcase #flutter-apps .carousel .carousel-slider {
    padding: 20px 0 50px
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item {
    min-width: 222px
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item:first-child {
    margin-left: var(--gutter)
}

@media (min-width:1280px) {
    body.showcase #flutter-apps .carousel .carousel-slider .story-item:first-child {
        margin-left: var(--gutter-auto)
    }
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item img {
    border-radius: 37px;
    max-width: 222px;
    min-width: 222px
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item .text {
    padding-right: 0
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item .text h3 {
    font-size: 24px
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item .learn-more-button {
    width: 100%
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item a {
    cursor: pointer;
    position: absolute
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item a:hover,
body.showcase #flutter-apps .carousel .carousel-slider .story-item:hover {
    color: var(--blue-6)
}

body.showcase #flutter-apps .carousel .carousel-slider .story-item:hover .learn-more-button {
    background-color: var(--blue-6);
    color: #fff;
    width: 100%
}

body.showcase #flutter-apps .carousel .carousel-progress .carousel-completed {
    border-radius: 4px;
    height: 4px;
    margin-bottom: 32px
}

body.showcase #stories {
    padding-bottom: var(--gutter-md)
}

body.showcase #stories .story-grid-header {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    width: 100%
}

body.showcase #stories .story-grid-header h2 {
    font-size: var(--font-size-heading-1);
    margin-bottom: var(--gutter-sm);
    width: 100%
}

@media (min-width:768px) {
    body.showcase #stories .story-grid-header {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-direction: row;
        flex-direction: row;
        justify-content: space-between
    }

    body.showcase #stories .story-grid-header h2 {
        margin-bottom: 0;
        text-align: left
    }
}

body.showcase #stories .story-item a:hover h4,
body.showcase #stories .story-item a:hover p,
body.showcase #stories .story-item a:hover span {
    color: var(--primary)
}

body.showcase #stories .showcase__story-content>span {
    font-size: var(--font-size-default);
    margin-bottom: 16px
}

body.showcase #stories .story-grid {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    gap: var(--gutter);
    justify-content: center
}

body.showcase #developer-stories .story-item {
    max-width: calc(100% - var(--gutter));
    min-width: calc(100% - var(--gutter))
}

body.showcase #developer-stories .story-item:last-child {
    margin-right: var(--gutter-sm)
}

@media (min-width:640px) {
    body.showcase #developer-stories .story-item {
        max-width: var(--ui-card-width) !important;
        min-width: var(--ui-card-width) !important
    }

    body.showcase #developer-stories .story-item:last-child {
        margin-right: var(--gutter)
    }
}

body.showcase .see-more {
    padding-top: var(--gutter);
    text-align: center
}

body.showcase .see-more a.btn {
    padding: 0
}

body.showcase #companies {
    overflow: hidden
}

body.showcase #companies h2 {
    max-width: 460px
}

body.showcase #companies .logo-garden {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center
}

body.showcase #companies .inner-fixed {
    justfiy-content: center;
    display: grid
}

body.showcase #companies .logo-row {
    -ms-flex-item-align: center;
    align-self: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    gap: var(--gutter-sm);
    margin-bottom: var(--gutter-sm);
    position: relative
}

body.showcase #companies .logo-row:first-child,
body.showcase #companies .logo-row:nth-child(3) {
    left: calc(82px + var(--gutter-sm)/2)
}

body.showcase #companies .logo-row>div {
    background-color: var(--grey-1);
    border-radius: var(--ui-border-radius-sm);
    -webkit-box-shadow: var(--ui-drop-shadow-sm);
    box-shadow: var(--ui-drop-shadow-sm);
    display: grid;
    height: 164px;
    min-width: 164px;
    padding: 37px;
    place-items: center;
    width: 164px
}