:root {
    --FONT_default_family: "Suisse Intl", serif;
    --FONT_default_400: 300 36px/42px var(--FONT_default_family);
    --FONT_default_300: 300 28px/34px var(--FONT_default_family);
    --FONT_default_200: 300 22px/28px var(--FONT_default_family);
    --FONT_default_100: 400 18px/22px var(--FONT_default_family);
    --FONT_default_75: 400 14px/17px var(--FONT_default_family);
    --FONT_default_50: 400 11px/14px var(--FONT_default_family);
    --FONT_highlight_400: 600 36px/42px var(--FONT_default_family);
    --FONT_highlight_300: 600 28px/34px var(--FONT_default_family);
    --FONT_highlight_200: 600 22px/28px var(--FONT_default_family);
    --FONT_highlight_100: 600 18px/22px var(--FONT_default_family);
    --FONT_highlight_75: 600 14px/17px var(--FONT_default_family);
    --FONT_highlight_50: 600 11px/14px var(--FONT_default_family);
    --FONT_brand_family: "National 2 Compressed", serif;
    --FONT_brand_400: 500 52px/52px var(--FONT_brand_family);
    --FONT_brand_300: 500 48px/48px var(--FONT_brand_family);
    --FONT_brand_200: 500 44px/44px var(--FONT_brand_family);
    --FONT_brand_100: 500 40px/40px var(--FONT_brand_family);
    --FONT_deco_family: "National 2 Compressed", serif;
    --FONT_deco_300: 400 40px/40px var(--FONT_deco_family);
    --FONT_deco_200: 400 34px/34px var(--FONT_deco_family);
    --FONT_deco_100: 400 30px/30px var(--FONT_deco_family)
}

@font-face {
    font-family: "Suisse Intl";
    font-style: normal;
    font-weight: 400;
    src: url("../../SuisseIntl-Regular-WebS.woff2") format("woff2");
    font-display: fallback
}

@font-face {
    font-family: "Suisse Intl";
    font-style: normal;
    font-weight: 300;
    src: url("../../SuisseIntl-Light-WebS.woff2") format("woff2");
    font-display: fallback
}

@font-face {
    font-family: "Suisse Intl";
    font-style: normal;
    font-weight: 600;
    src: url("../../SuisseIntl-SemiBold-WebS.woff2") format("woff2");
    font-display: fallback
}

@font-face {
    font-family: "National 2 Compressed";
    font-style: normal;
    font-weight: 400;
    src: url("../../national-2-compressed-regular.woff2") format("woff2");
    font-display: fallback
}

@font-face {
    font-family: "National 2 Compressed";
    font-style: normal;
    font-weight: 500;
    src: url("../../national-2-compressed-medium.woff2") format("woff2");
    font-display: fallback
}

.wdk-form-text .inputWrapper textarea,.wdk-modalbox .modalboxContent article {
    overflow-y: auto;
    scrollbar-color: var(--COLOR_supportDark_500) var(--COLOR_supportLight_100);
    scrollbar-width: thin
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar,.wdk-modalbox .modalboxContent article::-webkit-scrollbar {
    width: 12px;
    height: 12px
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar-track,.wdk-modalbox .modalboxContent article::-webkit-scrollbar-track {
    background: rgba(0,0,0,0);
    border-radius: var(--borderRadius_rounded)
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar-thumb,.wdk-modalbox .modalboxContent article::-webkit-scrollbar-thumb {
    background: var(--COLOR_supportDark_500);
    border: 3px solid rgba(0,0,0,0);
    border-radius: var(--borderRadius_rounded);
    background-clip: content-box
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar-thumb:hover,.wdk-modalbox .modalboxContent article::-webkit-scrollbar-thumb:hover {
    background: var(--COLOR_supportDark_400);
    border: 3px solid rgba(0,0,0,0);
    background-clip: content-box
}

:root {
    --COLOR_primary_100_dark: #1e5a32;
    --COLOR_primary_100: #307d58;
    --COLOR_primary_100_light: #f0f5f2;
    --COLOR_secondary_100: #f0f5f2;
    --COLOR_tertiary_100: #fffaf5;
    --COLOR_decoration_100_dark: #203e20;
    --COLOR_decoration_100: #527052;
    --COLOR_decoration_100_light: #f1f4f1;
    --COLOR_decoration_200_dark: #00325a;
    --COLOR_decoration_200: #006e96;
    --COLOR_decoration_200_light: #ebf3f7;
    --COLOR_decoration_300_dark: #700;
    --COLOR_decoration_300: #a91e1e;
    --COLOR_decoration_300_light: #f8eded;
    --COLOR_decoration_400_dark: #3b0c0c;
    --COLOR_decoration_400: #77390b;
    --COLOR_decoration_400_light: #f4efec;
    --COLOR_premium_100: #ef6054;
    --COLOR_premium_200: #e84134;
    --COLOR_premium_300: #f89637;
    --COLOR_offer_100: #e84034;
    --COLOR_offer_200: #e84134;
    --COLOR_gradient_unlock_100_45: linear-gradient(45deg, var(--COLOR_unlock_100) 0%, var(--COLOR_unlock_200) 100%);
    --COLOR_gradient_unlock_100_90: linear-gradient(90deg, var(--COLOR_unlock_100) 0%, var(--COLOR_unlock_200) 100%);
    --COLOR_gradient_unlock_100_180: linear-gradient(0deg, var(--COLOR_unlock_100) 0%, var(--COLOR_unlock_200) 100%);
    --COLOR_gradient_unlock_150_0_fade: linear-gradient(0deg, rgb(0 110 150 / 90%) 0%, rgb(14 173 178 / 50%) 50.52%, rgb(14 173 178 / 0%) 100%);
    --COLOR_gradient_healthy_dating_100_45: linear-gradient(45deg, var(--COLOR_offer_200) 0%, var(--COLOR_decoration_200) 100%);
    --COLOR_gradient_healthy_dating_100_90: linear-gradient(90deg, var(--COLOR_offer_200) 0%, var(--COLOR_decoration_200) 100%);
    --COLOR_gradient_premium_100_45: linear-gradient(45deg, var(--COLOR_premium_100) 0%, var(--COLOR_premium_300) 100%);
    --COLOR_gradient_premium_100_90: linear-gradient(90deg, var(--COLOR_premium_100) 0%, var(--COLOR_premium_300) 100%);
    --COLOR_gradient_premium_100_90_alpha: linear-gradient(90deg, #ef605415 0%, #f8963715 100%);
    --COLOR_unlock_100: #006e96;
    --COLOR_unlock_200: #0eadb2;
    --COLOR_alertError_100: #dc001a;
    --COLOR_alertError_200: #fdebed;
    --COLOR_alertInfo_100: #0270c9;
    --COLOR_alertInfo_200: #ebf4fb;
    --COLOR_alertSuccess_100: #198000;
    --COLOR_alertSuccess_200: #edf5eb;
    --COLOR_alertWarning_100: #ef5602;
    --COLOR_alertWarning_200: #ef5602;
    --COLOR_alertOnline_100: #00df9a;
    --COLOR_supportDark_100: #000;
    --COLOR_supportDark_200: #404047;
    --COLOR_supportDark_300: #66666c;
    --COLOR_supportDark_400: #99999d;
    --COLOR_supportDark_500: #d9d9db;
    --COLOR_supportDark_600: #f2f2f2;
    --COLOR_supportDark_090: #000000d9;
    --COLOR_supportDark_080: #00000a99;
    --COLOR_supportDark_070: #00000a8a;
    --COLOR_supportDark_060: #00000057;
    --COLOR_supportDark_050: #00000026;
    --COLOR_supportDark_040: #0000000d;
    --COLOR_supportLight_100: #fff;
    --COLOR_supportLight_090: #fffffff0;
    --COLOR_supportLight_080: #ffffffb3;
    --COLOR_supportLight_070: #ffffff80;
    --COLOR_supportLight_060: #ffffff54;
    --COLOR_supportLight_050: #ffffff29;
    --COLOR_supportLight_040: #ffffff1a;
    --COLOR_defaultText: var(--COLOR_supportDark_100);
    --COLOR_defaultText_hover: var(--COLOR_alertInfo_100);
    --COLOR_defaultText2: var(--COLOR_primary_100);
    --COLOR_defaultText2_hover: var(--COLOR_supportDark_100);
    --COLOR_intern_peg: #c8007d
}

bst-opener::after {
    position: absolute;
    visibility: hidden;
    content: "S"
}

@media only screen and (min-width: 481px) {
    bst-opener::after {
        content:"M"
    }
}

@media only screen and (min-width: 768px) {
    bst-opener::after {
        content:"L"
    }
}

@media only screen and (min-width: 980px) {
    bst-opener::after {
        content:"XL"
    }
}

.wdk-form-text .inputWrapper textarea,.wdk-modalbox .modalboxContent article {
    overflow-y: auto;
    scrollbar-color: var(--COLOR_supportDark_500) var(--COLOR_supportLight_100);
    scrollbar-width: thin
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar,.wdk-modalbox .modalboxContent article::-webkit-scrollbar {
    width: 12px;
    height: 12px
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar-track,.wdk-modalbox .modalboxContent article::-webkit-scrollbar-track {
    background: rgba(0,0,0,0);
    border-radius: var(--borderRadius_rounded)
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar-thumb,.wdk-modalbox .modalboxContent article::-webkit-scrollbar-thumb {
    background: var(--COLOR_supportDark_500);
    border: 3px solid rgba(0,0,0,0);
    border-radius: var(--borderRadius_rounded);
    background-clip: content-box
}

.wdk-form-text .inputWrapper textarea::-webkit-scrollbar-thumb:hover,.wdk-modalbox .modalboxContent article::-webkit-scrollbar-thumb:hover {
    background: var(--COLOR_supportDark_400);
    border: 3px solid rgba(0,0,0,0);
    background-clip: content-box
}

@keyframes spin-left {
    0% {
        transform: rotate(359deg)
    }

    100% {
        transform: rotate(0deg)
    }
}

@keyframes spin-right {
    0% {
        transform: rotate(0deg)
    }

    100% {
        transform: rotate(359deg)
    }
}

@keyframes highlightFade {
    0% {
        background: none
    }

    20% {
        background: var(--COLOR_supportDark_050)
    }

    50% {
        background: var(--COLOR_supportDark_050)
    }

    100% {
        background: none
    }
}

.spinLeft {
    display: inline-block;
    transform-origin: center center;
    animation: spin-left 2s infinite linear
}

.spinRight {
    display: inline-block;
    transform-origin: center center;
    animation: spin-right 2s infinite linear
}

@keyframes anim-effect-ivana-1 {
    0% {
        opacity: 1;
        transform: scale3d(0.5, 0.5, 1)
    }

    7.5% {
        opacity: 0;
        transform: scale3d(1.1, 1.1, 1)
    }

    7.51% {
        opacity: 1;
        transform: scale3d(0.5, 0.5, 1)
    }

    15%,100% {
        opacity: 0;
        transform: scale3d(1.1, 1.1, 1)
    }
}

@keyframes anim-effect-ivana-2 {
    0% {
        opacity: 1;
        transform: scale3d(0.5, 0.5, 1)
    }

    6%,7.5% {
        opacity: 0;
        transform: scale3d(1.2, 1.2, 1)
    }

    7.51% {
        opacity: 1;
        transform: scale3d(0.5, 0.5, 1)
    }

    12%,100% {
        opacity: 0;
        transform: scale3d(1.2, 1.2, 1)
    }
}

@keyframes fade-in {
    from {
        opacity: 0
    }
}

@keyframes fade-out {
    to {
        opacity: 0
    }
}

@keyframes slide-from-right {
    from {
        transform: translateX(60px)
    }
}

@keyframes slide-to-right {
    to {
        transform: translateX(60px)
    }
}

@keyframes slide-to-left {
    to {
        transform: translateX(-60px)
    }
}

::view-transition-old(conversation-area) {
    animation: 200ms cubic-bezier(0.4, 0, 1, 1) both fade-out,300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-to-right
}

::view-transition-new(conversation-area) {
    animation: 200ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in,300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-from-right
}

::view-transition-old(full-size),::view-transition-new(full-size) {
    animation: none;
    mix-blend-mode: normal
}

.has-noViewTransition {
    view-transition-name: none !important
}

.wdk-icon {
    width: 24px;
    height: 24px;
    fill: var(--COLOR_supportDark_090)
}

.wdk-icon img {
    width: 100%;
    height: 100%
}

.wdk-icon[class*=" illu_"],.wdk-icon [class^=illu_] {
    width: 48px;
    height: 48px
}

.wdk-iconInline {
    width: 24px;
    height: 24px
}

.wdk-iconInline path#a {
    fill: #ff0
}

.wdk-iconInline path#b {
    fill: red
}

[class^=bg-icon_]::before,[class*=" bg-icon_"]::before,[class^=bg-illu_]::before,[class*=" bg-illu_"]::before {
    content: "";
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    display: inline-block;
    color: inherit;
    background-color: currentcolor
}

[class^=bg-illu_]::before,[class*=" bg-illu_"]::before {
    width: 48px;
    height: 48px
}

.bg-icon_arrow_down::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_down.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_down.svg)
}

.bg-icon_arrow_up::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_up.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_up.svg)
}

.bg-icon_arrow_left::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_left.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_left.svg)
}

.bg-icon_arrow_right::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_right.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_right.svg)
}

.bg-icon_arrow_down_bold::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_down_bold.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_down_bold.svg)
}

.bg-icon_arrow_up_bold::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_up_bold.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_up_bold.svg)
}

.bg-icon_arrow_left_bold::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_left_bold.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_left_bold.svg)
}

.bg-icon_arrow_right_bold::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_right_bold.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_right_bold.svg)
}

.bg-icon_arrow_down_light::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_down_light.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_down_light.svg)
}

.bg-icon_arrow_up_light::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_up_light.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_up_light.svg)
}

.bg-icon_arrow_left_light::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_left_light.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_left_light.svg)
}

.bg-icon_arrow_right_light::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_right_light.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_right_light.svg)
}

.bg-icon_arrow_down_regular::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_down_regular.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_down_regular.svg)
}

.bg-icon_arrow_up_regular::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_up_regular.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_up_regular.svg)
}

.bg-icon_arrow_left_regular::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_left_regular.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_left_regular.svg)
}

.bg-icon_arrow_right_regular::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_arrow_right_regular.svg);
    mask-image: url(../../img/icons/single_color/icon_arrow_right_regular.svg)
}

.bg-icon_add_circle_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_add_circle_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_add_circle_filled.svg)
}

.bg-icon_add_circle_off::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_add_circle_off.svg);
    mask-image: url(../../img/icons/single_color/icon_add_circle_off.svg)
}

.bg-icon_add::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_add.svg);
    mask-image: url(../../img/icons/single_color/icon_add.svg)
}

.bg-icon_address_book::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_address_book.svg);
    mask-image: url(../../img/icons/single_color/icon_address_book.svg)
}

.bg-icon_android::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_android.svg);
    mask-image: url(../../img/icons/single_color/icon_android.svg)
}

.bg-icon_anniv::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_anniv.svg);
    mask-image: url(../../img/icons/single_color/icon_anniv.svg)
}

.bg-icon_apple::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_apple.svg);
    mask-image: url(../../img/icons/single_color/icon_apple.svg)
}

.bg-icon_atom_heart::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_atom_heart.svg);
    mask-image: url(../../img/icons/single_color/icon_atom_heart.svg)
}

.bg-icon_badge::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_badge.svg);
    mask-image: url(../../img/icons/single_color/icon_badge.svg)
}

.bg-icon_bike::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_bike.svg);
    mask-image: url(../../img/icons/single_color/icon_bike.svg)
}

.bg-icon_bin_restore::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_bin_restore.svg);
    mask-image: url(../../img/icons/single_color/icon_bin_restore.svg)
}

.bg-icon_bin::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_bin.svg);
    mask-image: url(../../img/icons/single_color/icon_bin.svg)
}

.bg-icon_birthday_cake::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_birthday_cake.svg);
    mask-image: url(../../img/icons/single_color/icon_birthday_cake.svg)
}

.bg-icon_body_height::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_body_height.svg);
    mask-image: url(../../img/icons/single_color/icon_body_height.svg)
}

.bg-icon_book_checkmark::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_book_checkmark.svg);
    mask-image: url(../../img/icons/single_color/icon_book_checkmark.svg)
}

.bg-icon_buggy::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_buggy.svg);
    mask-image: url(../../img/icons/single_color/icon_buggy.svg)
}

.bg-icon_bulb::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_bulb.svg);
    mask-image: url(../../img/icons/single_color/icon_bulb.svg)
}

.bg-icon_burger_menu::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_burger_menu.svg);
    mask-image: url(../../img/icons/single_color/icon_burger_menu.svg)
}

.bg-icon_cam_outline::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_cam_outline.svg);
    mask-image: url(../../img/icons/single_color/icon_cam_outline.svg)
}

.bg-icon_cam::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_cam.svg);
    mask-image: url(../../img/icons/single_color/icon_cam.svg)
}

.bg-icon_camera_badge::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_camera_badge.svg);
    mask-image: url(../../img/icons/single_color/icon_camera_badge.svg)
}

.bg-icon_capitol::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_capitol.svg);
    mask-image: url(../../img/icons/single_color/icon_capitol.svg)
}

.bg-icon_chart::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_chart.svg);
    mask-image: url(../../img/icons/single_color/icon_chart.svg)
}

.bg-icon_check_bold::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_check_bold.svg);
    mask-image: url(../../img/icons/single_color/icon_check_bold.svg)
}

.bg-icon_check_circle_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_check_circle_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_check_circle_filled.svg)
}

.bg-icon_check_circle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_check_circle.svg);
    mask-image: url(../../img/icons/single_color/icon_check_circle.svg)
}

.bg-icon_check::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_check.svg);
    mask-image: url(../../img/icons/single_color/icon_check.svg)
}

.bg-icon_circle_000p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_000p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_000p.svg)
}

.bg-icon_circle_010p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_010p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_010p.svg)
}

.bg-icon_circle_020p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_020p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_020p.svg)
}

.bg-icon_circle_030p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_030p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_030p.svg)
}

.bg-icon_circle_040p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_040p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_040p.svg)
}

.bg-icon_circle_050p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_050p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_050p.svg)
}

.bg-icon_circle_060p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_060p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_060p.svg)
}

.bg-icon_circle_070p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_070p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_070p.svg)
}

.bg-icon_circle_080p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_080p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_080p.svg)
}

.bg-icon_circle_090p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_090p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_090p.svg)
}

.bg-icon_circle_100p::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_100p.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_100p.svg)
}

.bg-icon_circle_arrows::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_circle_arrows.svg);
    mask-image: url(../../img/icons/single_color/icon_circle_arrows.svg)
}

.bg-icon_clipboard::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_clipboard.svg);
    mask-image: url(../../img/icons/single_color/icon_clipboard.svg)
}

.bg-icon_clock::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_clock.svg);
    mask-image: url(../../img/icons/single_color/icon_clock.svg)
}

.bg-icon_clover::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_clover.svg);
    mask-image: url(../../img/icons/single_color/icon_clover.svg)
}

.bg-icon_compass_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_compass_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_compass_filled.svg)
}

.bg-icon_compass::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_compass.svg);
    mask-image: url(../../img/icons/single_color/icon_compass.svg)
}

.bg-icon_compatibility::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_compatibility.svg);
    mask-image: url(../../img/icons/single_color/icon_compatibility.svg)
}

.bg-icon_control::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_control.svg);
    mask-image: url(../../img/icons/single_color/icon_control.svg)
}

.bg-icon_crown::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_crown.svg);
    mask-image: url(../../img/icons/single_color/icon_crown.svg)
}

.bg-icon_device_desktop::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_device_desktop.svg);
    mask-image: url(../../img/icons/single_color/icon_device_desktop.svg)
}

.bg-icon_device_smartphone::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_device_smartphone.svg);
    mask-image: url(../../img/icons/single_color/icon_device_smartphone.svg)
}

.bg-icon_download::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_download.svg);
    mask-image: url(../../img/icons/single_color/icon_download.svg)
}

.bg-icon_drag_handle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_drag_handle.svg);
    mask-image: url(../../img/icons/single_color/icon_drag_handle.svg)
}

.bg-icon_diamond::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_diamond.svg);
    mask-image: url(../../img/icons/single_color/icon_diamond.svg)
}

.bg-icon_dot_menu::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_dot_menu.svg);
    mask-image: url(../../img/icons/single_color/icon_dot_menu.svg)
}

.bg-icon_earth::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_earth.svg);
    mask-image: url(../../img/icons/single_color/icon_earth.svg)
}

.bg-icon_edit_note::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_edit_note.svg);
    mask-image: url(../../img/icons/single_color/icon_edit_note.svg)
}

.bg-icon_education::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_education.svg);
    mask-image: url(../../img/icons/single_color/icon_education.svg)
}

.bg-icon_envelope::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_envelope.svg);
    mask-image: url(../../img/icons/single_color/icon_envelope.svg)
}

.bg-icon_exclamation_point_circle_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_exclamation_point_circle_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_exclamation_point_circle_filled.svg)
}

.bg-icon_exclamation_point_circle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_exclamation_point_circle.svg);
    mask-image: url(../../img/icons/single_color/icon_exclamation_point_circle.svg)
}

.bg-icon_exclamation_point::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_exclamation_point.svg);
    mask-image: url(../../img/icons/single_color/icon_exclamation_point.svg)
}

.bg-icon_eye_closed::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_eye_closed.svg);
    mask-image: url(../../img/icons/single_color/icon_eye_closed.svg)
}

.bg-icon_eye::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_eye.svg);
    mask-image: url(../../img/icons/single_color/icon_eye.svg)
}

.bg-icon_filter::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_filter.svg);
    mask-image: url(../../img/icons/single_color/icon_filter.svg)
}

.bg-icon_flower::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_flower.svg);
    mask-image: url(../../img/icons/single_color/icon_flower.svg)
}

.bg-icon_forbidden::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_forbidden.svg);
    mask-image: url(../../img/icons/single_color/icon_forbidden.svg)
}

.bg-icon_gift::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_gift.svg);
    mask-image: url(../../img/icons/single_color/icon_gift.svg)
}

.bg-icon_glas::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_glas.svg);
    mask-image: url(../../img/icons/single_color/icon_glas.svg)
}

.bg-icon_group_2::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_group_2.svg);
    mask-image: url(../../img/icons/single_color/icon_group_2.svg)
}

.bg-icon_group::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_group.svg);
    mask-image: url(../../img/icons/single_color/icon_group.svg)
}

.bg-icon_heart::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_heart.svg);
    mask-image: url(../../img/icons/single_color/icon_heart.svg)
}

.bg-icon_heart_fill::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_heart_fill.svg);
    mask-image: url(../../img/icons/single_color/icon_heart_fill.svg)
}

.bg-icon_heart_icebreaker_1::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_heart_icebreaker_1.svg);
    mask-image: url(../../img/icons/single_color/icon_heart_icebreaker_1.svg)
}

.bg-icon_heart_icebreaker::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_heart_icebreaker.svg);
    mask-image: url(../../img/icons/single_color/icon_heart_icebreaker.svg)
}

.bg-icon_heart_like_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_heart_like_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_heart_like_filled.svg)
}

.bg-icon_heart_like_outline::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_heart_like_outline.svg);
    mask-image: url(../../img/icons/single_color/icon_heart_like_outline.svg)
}

.bg-icon_house_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_house_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_house_filled.svg)
}

.bg-icon_house::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_house.svg);
    mask-image: url(../../img/icons/single_color/icon_house.svg)
}

.bg-icon_i_circle_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_i_circle_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_i_circle_filled.svg)
}

.bg-icon_i_circle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_i_circle.svg);
    mask-image: url(../../img/icons/single_color/icon_i_circle.svg)
}

.bg-icon_inbox::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_inbox.svg);
    mask-image: url(../../img/icons/single_color/icon_inbox.svg)
}

.bg-icon_invisible::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_invisible.svg);
    mask-image: url(../../img/icons/single_color/icon_invisible.svg)
}

.bg-icon_keys::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_keys.svg);
    mask-image: url(../../img/icons/single_color/icon_keys.svg)
}

.bg-icon_kid::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_kid.svg);
    mask-image: url(../../img/icons/single_color/icon_kid.svg)
}

.bg-icon_language::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_language.svg);
    mask-image: url(../../img/icons/single_color/icon_language.svg)
}

.bg-icon_lifebelt::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_lifebelt.svg);
    mask-image: url(../../img/icons/single_color/icon_lifebelt.svg)
}

.bg-icon_list::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_list.svg);
    mask-image: url(../../img/icons/single_color/icon_list.svg)
}

.bg-icon_location_pin::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_location_pin.svg);
    mask-image: url(../../img/icons/single_color/icon_location_pin.svg)
}

.bg-icon_lock::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_lock.svg);
    mask-image: url(../../img/icons/single_color/icon_lock.svg)
}

.bg-icon_logo::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_logo.svg);
    mask-image: url(../../img/icons/single_color/icon_logo.svg)
}

.bg-icon_logout::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_logout.svg);
    mask-image: url(../../img/icons/single_color/icon_logout.svg)
}

.bg-icon_love_couple::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_love_couple.svg);
    mask-image: url(../../img/icons/single_color/icon_love_couple.svg)
}

.bg-icon_magazin::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_magazin.svg);
    mask-image: url(../../img/icons/single_color/icon_magazin.svg)
}

.bg-icon_magnifying_glass_minus::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_magnifying_glass_minus.svg);
    mask-image: url(../../img/icons/single_color/icon_magnifying_glass_minus.svg)
}

.bg-icon_magnifying_glass_plus::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_magnifying_glass_plus.svg);
    mask-image: url(../../img/icons/single_color/icon_magnifying_glass_plus.svg)
}

.bg-icon_male_female::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_male_female.svg);
    mask-image: url(../../img/icons/single_color/icon_male_female.svg)
}

.bg-icon_message_2::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message_2.svg);
    mask-image: url(../../img/icons/single_color/icon_message_2.svg)
}

.bg-icon_message_bubble::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message_bubble.svg);
    mask-image: url(../../img/icons/single_color/icon_message_bubble.svg)
}

.bg-icon_message_bubbles::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message_bubbles.svg);
    mask-image: url(../../img/icons/single_color/icon_message_bubbles.svg)
}

.bg-icon_message_outline::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message_outline.svg);
    mask-image: url(../../img/icons/single_color/icon_message_outline.svg)
}

.bg-icon_message_plus::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message_plus.svg);
    mask-image: url(../../img/icons/single_color/icon_message_plus.svg)
}

.bg-icon_message_plus_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message_plus_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_message_plus_filled.svg)
}

.bg-icon_message_service::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message_service.svg);
    mask-image: url(../../img/icons/single_color/icon_message_service.svg)
}

.bg-icon_message::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_message.svg);
    mask-image: url(../../img/icons/single_color/icon_message.svg)
}

.bg-icon_mic_off::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_mic_off.svg);
    mask-image: url(../../img/icons/single_color/icon_mic_off.svg)
}

.bg-icon_mic::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_mic.svg);
    mask-image: url(../../img/icons/single_color/icon_mic.svg)
}

.bg-icon_minimize::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_minimize.svg);
    mask-image: url(../../img/icons/single_color/icon_minimize.svg)
}

.bg-icon_minus_circle_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_minus_circle_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_minus_circle_filled.svg)
}

.bg-icon_minus_circle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_minus_circle.svg);
    mask-image: url(../../img/icons/single_color/icon_minus_circle.svg)
}

.bg-icon_more_an::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_more_an.svg);
    mask-image: url(../../img/icons/single_color/icon_more_an.svg)
}

.bg-icon_more_io::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_more_io.svg);
    mask-image: url(../../img/icons/single_color/icon_more_io.svg)
}

.bg-icon_muffin::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_muffin.svg);
    mask-image: url(../../img/icons/single_color/icon_muffin.svg)
}

.bg-icon_music::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_music.svg);
    mask-image: url(../../img/icons/single_color/icon_music.svg)
}

.bg-icon_nameplate::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_nameplate.svg);
    mask-image: url(../../img/icons/single_color/icon_nameplate.svg)
}

.bg-icon_no_photo::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_no_photo.svg);
    mask-image: url(../../img/icons/single_color/icon_no_photo.svg)
}

.bg-icon_office_building::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_office_building.svg);
    mask-image: url(../../img/icons/single_color/icon_office_building.svg)
}

.bg-icon_outgoing::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_outgoing.svg);
    mask-image: url(../../img/icons/single_color/icon_outgoing.svg)
}

.bg-icon_paper_plane_v2::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_paper_plane_v2.svg);
    mask-image: url(../../img/icons/single_color/icon_paper_plane_v2.svg)
}

.bg-icon_paper_plane::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_paper_plane.svg);
    mask-image: url(../../img/icons/single_color/icon_paper_plane.svg)
}

.bg-icon_paw::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_paw.svg);
    mask-image: url(../../img/icons/single_color/icon_paw.svg)
}

.bg-icon_payment_credit_card::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_payment_credit_card.svg);
    mask-image: url(../../img/icons/single_color/icon_payment_credit_card.svg)
}

.bg-icon_percent::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_percent.svg);
    mask-image: url(../../img/icons/single_color/icon_percent.svg)
}

.bg-icon_pencil::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_pencil.svg);
    mask-image: url(../../img/icons/single_color/icon_pencil.svg)
}

.bg-icon_phone::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_phone.svg);
    mask-image: url(../../img/icons/single_color/icon_phone.svg)
}

.bg-icon_photo_rejected::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_photo_rejected.svg);
    mask-image: url(../../img/icons/single_color/icon_photo_rejected.svg)
}

.bg-icon_photo::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_photo.svg);
    mask-image: url(../../img/icons/single_color/icon_photo.svg)
}

.bg-icon_picture::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_picture.svg);
    mask-image: url(../../img/icons/single_color/icon_picture.svg)
}

.bg-icon_pin_minus::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_pin_minus.svg);
    mask-image: url(../../img/icons/single_color/icon_pin_minus.svg)
}

.bg-icon_pin_plus::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_pin_plus.svg);
    mask-image: url(../../img/icons/single_color/icon_pin_plus.svg)
}

.bg-icon_pin::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_pin.svg);
    mask-image: url(../../img/icons/single_color/icon_pin.svg)
}

.bg-icon_plane::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_plane.svg);
    mask-image: url(../../img/icons/single_color/icon_plane.svg)
}

.bg-icon_play::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_play.svg);
    mask-image: url(../../img/icons/single_color/icon_play.svg)
}

.bg-icon_pray::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_pray.svg);
    mask-image: url(../../img/icons/single_color/icon_pray.svg)
}

.bg-icon_question_mark_circle_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_question_mark_circle_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_question_mark_circle_filled.svg)
}

.bg-icon_question_mark_circle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_question_mark_circle.svg);
    mask-image: url(../../img/icons/single_color/icon_question_mark_circle.svg)
}

.bg-icon_question_mark::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_question_mark.svg);
    mask-image: url(../../img/icons/single_color/icon_question_mark.svg)
}

.bg-icon_reply::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_reply.svg);
    mask-image: url(../../img/icons/single_color/icon_reply.svg)
}

.bg-icon_rocket::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_rocket.svg);
    mask-image: url(../../img/icons/single_color/icon_rocket.svg)
}

.bg-icon_search::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_search.svg);
    mask-image: url(../../img/icons/single_color/icon_search.svg)
}

.bg-icon_settings_cog::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_settings_cog.svg);
    mask-image: url(../../img/icons/single_color/icon_settings_cog.svg)
}

.bg-icon_share::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_share.svg);
    mask-image: url(../../img/icons/single_color/icon_share.svg)
}

.bg-icon_shield::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_shield.svg);
    mask-image: url(../../img/icons/single_color/icon_shield.svg)
}

.bg-icon_smile::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_smile.svg);
    mask-image: url(../../img/icons/single_color/icon_smile.svg)
}

.bg-icon_smiley_happy::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_smiley_happy.svg);
    mask-image: url(../../img/icons/single_color/icon_smiley_happy.svg)
}

.bg-icon_smiley_joyful::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_smiley_joyful.svg);
    mask-image: url(../../img/icons/single_color/icon_smiley_joyful.svg)
}

.bg-icon_smiley_neutral::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_smiley_neutral.svg);
    mask-image: url(../../img/icons/single_color/icon_smiley_neutral.svg)
}

.bg-icon_smiley_sad::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_smiley_sad.svg);
    mask-image: url(../../img/icons/single_color/icon_smiley_sad.svg)
}

.bg-icon_smiley_skeptical::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_smiley_skeptical.svg);
    mask-image: url(../../img/icons/single_color/icon_smiley_skeptical.svg)
}

.bg-icon_smoke::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_smoke.svg);
    mask-image: url(../../img/icons/single_color/icon_smoke.svg)
}

.bg-icon_social_facebook::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_social_facebook.svg);
    mask-image: url(../../img/icons/single_color/icon_social_facebook.svg)
}

.bg-icon_social_feed::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_social_feed.svg);
    mask-image: url(../../img/icons/single_color/icon_social_feed.svg)
}

.bg-icon_sort::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_sort.svg);
    mask-image: url(../../img/icons/single_color/icon_sort.svg)
}

.bg-icon_sparkle_outline::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_sparkle_outline.svg);
    mask-image: url(../../img/icons/single_color/icon_sparkle_outline.svg)
}

.bg-icon_sparkle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_sparkle.svg);
    mask-image: url(../../img/icons/single_color/icon_sparkle.svg)
}

.bg-icon_spin_left::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_spin_left.svg);
    mask-image: url(../../img/icons/single_color/icon_spin_left.svg)
}

.bg-icon_spin_right::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_spin_right.svg);
    mask-image: url(../../img/icons/single_color/icon_spin_right.svg)
}

.bg-icon_sport_shoe::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_sport_shoe.svg);
    mask-image: url(../../img/icons/single_color/icon_sport_shoe.svg)
}

.bg-icon_star_2::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_star_2.svg);
    mask-image: url(../../img/icons/single_color/icon_star_2.svg)
}

.bg-icon_star::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_star.svg);
    mask-image: url(../../img/icons/single_color/icon_star.svg)
}

.bg-icon_super_cards_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_super_cards_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_super_cards_filled.svg)
}

.bg-icon_super_cards_outline::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_super_cards_outline.svg);
    mask-image: url(../../img/icons/single_color/icon_super_cards_outline.svg)
}

.bg-icon_table_tennis::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_table_tennis.svg);
    mask-image: url(../../img/icons/single_color/icon_table_tennis.svg)
}

.bg-icon_tactic::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_tactic.svg);
    mask-image: url(../../img/icons/single_color/icon_tactic.svg)
}

.bg-icon_thumbs_up_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_thumbs_up_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_thumbs_up_filled.svg)
}

.bg-icon_thumbs_up::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_thumbs_up.svg);
    mask-image: url(../../img/icons/single_color/icon_thumbs_up.svg)
}

.bg-icon_thumbs_down_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_thumbs_down_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_thumbs_down_filled.svg)
}

.bg-icon_thumbs_down::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_thumbs_down.svg);
    mask-image: url(../../img/icons/single_color/icon_thumbs_down.svg)
}

.bg-icon_ticket::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_ticket.svg);
    mask-image: url(../../img/icons/single_color/icon_ticket.svg)
}

.bg-icon_tools::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_tools.svg);
    mask-image: url(../../img/icons/single_color/icon_tools.svg)
}

.bg-icon_upload::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_upload.svg);
    mask-image: url(../../img/icons/single_color/icon_upload.svg)
}

.bg-icon_user_outline::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_user_outline.svg);
    mask-image: url(../../img/icons/single_color/icon_user_outline.svg)
}

.bg-icon_user_uni_200_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_user_uni_200_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_user_uni_200_filled.svg)
}

.bg-icon_user::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_user.svg);
    mask-image: url(../../img/icons/single_color/icon_user.svg)
}

.bg-icon_wallet::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_wallet.svg);
    mask-image: url(../../img/icons/single_color/icon_wallet.svg)
}

.bg-icon_warning::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_warning.svg);
    mask-image: url(../../img/icons/single_color/icon_warning.svg)
}

.bg-icon_wedding_rings::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_wedding_rings.svg);
    mask-image: url(../../img/icons/single_color/icon_wedding_rings.svg)
}

.bg-icon_x_circle_filled::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_x_circle_filled.svg);
    mask-image: url(../../img/icons/single_color/icon_x_circle_filled.svg)
}

.bg-icon_x_circle::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_x_circle.svg);
    mask-image: url(../../img/icons/single_color/icon_x_circle.svg)
}

.bg-icon_x::before {
    -webkit-mask-image: url(../../img/icons/single_color/icon_x.svg);
    mask-image: url(../../img/icons/single_color/icon_x.svg)
}

.bg-illu_academic_cap::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_academic_cap.svg);
    mask-image: url(../../img/icons/single_color/illu_academic_cap.svg)
}

.bg-illu_apron::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_apron.svg);
    mask-image: url(../../img/icons/single_color/illu_apron.svg)
}

.bg-illu_arm::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_arm.svg);
    mask-image: url(../../img/icons/single_color/illu_arm.svg)
}

.bg-illu_armchair::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_armchair.svg);
    mask-image: url(../../img/icons/single_color/illu_armchair.svg)
}

.bg-illu_avocado::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_avocado.svg);
    mask-image: url(../../img/icons/single_color/illu_avocado.svg)
}

.bg-illu_baby_bottle::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_baby_bottle.svg);
    mask-image: url(../../img/icons/single_color/illu_baby_bottle.svg)
}

.bg-illu_backpack::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_backpack.svg);
    mask-image: url(../../img/icons/single_color/illu_backpack.svg)
}

.bg-illu_backpack2::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_backpack2.svg);
    mask-image: url(../../img/icons/single_color/illu_backpack2.svg)
}

.bg-illu_backstage_pass::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_backstage_pass.svg);
    mask-image: url(../../img/icons/single_color/illu_backstage_pass.svg)
}

.bg-illu_badminton::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_badminton.svg);
    mask-image: url(../../img/icons/single_color/illu_badminton.svg)
}

.bg-illu_bag::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_bag.svg);
    mask-image: url(../../img/icons/single_color/illu_bag.svg)
}

.bg-illu_ballet_shoes::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_ballet_shoes.svg);
    mask-image: url(../../img/icons/single_color/illu_ballet_shoes.svg)
}

.bg-illu_balls::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_balls.svg);
    mask-image: url(../../img/icons/single_color/illu_balls.svg)
}

.bg-illu_baseball::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_baseball.svg);
    mask-image: url(../../img/icons/single_color/illu_baseball.svg)
}

.bg-illu_basketball::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_basketball.svg);
    mask-image: url(../../img/icons/single_color/illu_basketball.svg)
}

.bg-illu_bicycle_bag::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_bicycle_bag.svg);
    mask-image: url(../../img/icons/single_color/illu_bicycle_bag.svg)
}

.bg-illu_bicycle::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_bicycle.svg);
    mask-image: url(../../img/icons/single_color/illu_bicycle.svg)
}

.bg-illu_birthday_cake::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_birthday_cake.svg);
    mask-image: url(../../img/icons/single_color/illu_birthday_cake.svg)
}

.bg-illu_bonfire::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_bonfire.svg);
    mask-image: url(../../img/icons/single_color/illu_bonfire.svg)
}

.bg-illu_books::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_books.svg);
    mask-image: url(../../img/icons/single_color/illu_books.svg)
}

.bg-illu_boots::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_boots.svg);
    mask-image: url(../../img/icons/single_color/illu_boots.svg)
}

.bg-illu_bowl::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_bowl.svg);
    mask-image: url(../../img/icons/single_color/illu_bowl.svg)
}

.bg-illu_bowling::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_bowling.svg);
    mask-image: url(../../img/icons/single_color/illu_bowling.svg)
}

.bg-illu_brush_pencil::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_brush_pencil.svg);
    mask-image: url(../../img/icons/single_color/illu_brush_pencil.svg)
}

.bg-illu_burger::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_burger.svg);
    mask-image: url(../../img/icons/single_color/illu_burger.svg)
}

.bg-illu_bus::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_bus.svg);
    mask-image: url(../../img/icons/single_color/illu_bus.svg)
}

.bg-illu_camera::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_camera.svg);
    mask-image: url(../../img/icons/single_color/illu_camera.svg)
}

.bg-illu_canoe::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_canoe.svg);
    mask-image: url(../../img/icons/single_color/illu_canoe.svg)
}

.bg-illu_canyon::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_canyon.svg);
    mask-image: url(../../img/icons/single_color/illu_canyon.svg)
}

.bg-illu_capitol::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_capitol.svg);
    mask-image: url(../../img/icons/single_color/illu_capitol.svg)
}

.bg-illu_car::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_car.svg);
    mask-image: url(../../img/icons/single_color/illu_car.svg)
}

.bg-illu_carrot::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_carrot.svg);
    mask-image: url(../../img/icons/single_color/illu_carrot.svg)
}

.bg-illu_cat_dog::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_cat_dog.svg);
    mask-image: url(../../img/icons/single_color/illu_cat_dog.svg)
}

.bg-illu_checklist::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_checklist.svg);
    mask-image: url(../../img/icons/single_color/illu_checklist.svg)
}

.bg-illu_chefs_toque::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_chefs_toque.svg);
    mask-image: url(../../img/icons/single_color/illu_chefs_toque.svg)
}

.bg-illu_children::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_children.svg);
    mask-image: url(../../img/icons/single_color/illu_children.svg)
}

.bg-illu_child_figures::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_child_figures.svg);
    mask-image: url(../../img/icons/single_color/illu_child_figures.svg)
}

.bg-illu_chili_pepper::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_chili_pepper.svg);
    mask-image: url(../../img/icons/single_color/illu_chili_pepper.svg)
}

.bg-illu_chocolate::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_chocolate.svg);
    mask-image: url(../../img/icons/single_color/illu_chocolate.svg)
}

.bg-illu_cigarette::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_cigarette.svg);
    mask-image: url(../../img/icons/single_color/illu_cigarette.svg)
}

.bg-illu_cocktail::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_cocktail.svg);
    mask-image: url(../../img/icons/single_color/illu_cocktail.svg)
}

.bg-illu_coffee_mug::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_coffee_mug.svg);
    mask-image: url(../../img/icons/single_color/illu_coffee_mug.svg)
}

.bg-illu_coffee::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_coffee.svg);
    mask-image: url(../../img/icons/single_color/illu_coffee.svg)
}

.bg-illu_communication::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_communication.svg);
    mask-image: url(../../img/icons/single_color/illu_communication.svg)
}

.bg-illu_compass::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_compass.svg);
    mask-image: url(../../img/icons/single_color/illu_compass.svg)
}

.bg-illu_controller::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_controller.svg);
    mask-image: url(../../img/icons/single_color/illu_controller.svg)
}

.bg-illu_countryside::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_countryside.svg);
    mask-image: url(../../img/icons/single_color/illu_countryside.svg)
}

.bg-illu_crazy_eyes::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_crazy_eyes.svg);
    mask-image: url(../../img/icons/single_color/illu_crazy_eyes.svg)
}

.bg-illu_cricket::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_cricket.svg);
    mask-image: url(../../img/icons/single_color/illu_cricket.svg)
}

.bg-illu_croissant::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_croissant.svg);
    mask-image: url(../../img/icons/single_color/illu_croissant.svg)
}

.bg-illu_crossed_fingers::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_crossed_fingers.svg);
    mask-image: url(../../img/icons/single_color/illu_crossed_fingers.svg)
}

.bg-illu_cruise_ship::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_cruise_ship.svg);
    mask-image: url(../../img/icons/single_color/illu_cruise_ship.svg)
}

.bg-illu_cupcake::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_cupcake.svg);
    mask-image: url(../../img/icons/single_color/illu_cupcake.svg)
}

.bg-illu_daypack::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_daypack.svg);
    mask-image: url(../../img/icons/single_color/illu_daypack.svg)
}

.bg-illu_disco_ball::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_disco_ball.svg);
    mask-image: url(../../img/icons/single_color/illu_disco_ball.svg)
}

.bg-illu_diving_glasses::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_diving_glasses.svg);
    mask-image: url(../../img/icons/single_color/illu_diving_glasses.svg)
}

.bg-illu_diy::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_diy.svg);
    mask-image: url(../../img/icons/single_color/illu_diy.svg)
}

.bg-illu_dobok::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_dobok.svg);
    mask-image: url(../../img/icons/single_color/illu_dobok.svg)
}

.bg-illu_dumbbell::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_dumbbell.svg);
    mask-image: url(../../img/icons/single_color/illu_dumbbell.svg)
}

.bg-illu_ear::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_ear.svg);
    mask-image: url(../../img/icons/single_color/illu_ear.svg)
}

.bg-illu_earth::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_earth.svg);
    mask-image: url(../../img/icons/single_color/illu_earth.svg)
}

.bg-illu_educational_building::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_educational_building.svg);
    mask-image: url(../../img/icons/single_color/illu_educational_building.svg)
}

.bg-illu_empanadas::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_empanadas.svg);
    mask-image: url(../../img/icons/single_color/illu_empanadas.svg)
}

.bg-illu_eye::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_eye.svg);
    mask-image: url(../../img/icons/single_color/illu_eye.svg)
}

.bg-illu_face_blowing_a_kiss::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_face_blowing_a_kiss.svg);
    mask-image: url(../../img/icons/single_color/illu_face_blowing_a_kiss.svg)
}

.bg-illu_face_laughing::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_face_laughing.svg);
    mask-image: url(../../img/icons/single_color/illu_face_laughing.svg)
}

.bg-illu_face_with_hand_over_mouth::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_face_with_hand_over_mouth.svg);
    mask-image: url(../../img/icons/single_color/illu_face_with_hand_over_mouth.svg)
}

.bg-illu_face_with_monocle::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_face_with_monocle.svg);
    mask-image: url(../../img/icons/single_color/illu_face_with_monocle.svg)
}

.bg-illu_face_with_pleading_eyes::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_face_with_pleading_eyes.svg);
    mask-image: url(../../img/icons/single_color/illu_face_with_pleading_eyes.svg)
}

.bg-illu_face_with_rolling_eyes::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_face_with_rolling_eyes.svg);
    mask-image: url(../../img/icons/single_color/illu_face_with_rolling_eyes.svg)
}

.bg-illu_face_with_tears_of_joy::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_face_with_tears_of_joy.svg);
    mask-image: url(../../img/icons/single_color/illu_face_with_tears_of_joy.svg)
}

.bg-illu_falafel::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_falafel.svg);
    mask-image: url(../../img/icons/single_color/illu_falafel.svg)
}

.bg-illu_figure_ruler::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_figure_ruler.svg);
    mask-image: url(../../img/icons/single_color/illu_figure_ruler.svg)
}

.bg-illu_filmstrip::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_filmstrip.svg);
    mask-image: url(../../img/icons/single_color/illu_filmstrip.svg)
}

.bg-illu_fish_2::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_fish_2.svg);
    mask-image: url(../../img/icons/single_color/illu_fish_2.svg)
}

.bg-illu_fish::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_fish.svg);
    mask-image: url(../../img/icons/single_color/illu_fish.svg)
}

.bg-illu_fitness::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_fitness.svg);
    mask-image: url(../../img/icons/single_color/illu_fitness.svg)
}

.bg-illu_flipper::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_flipper.svg);
    mask-image: url(../../img/icons/single_color/illu_flipper.svg)
}

.bg-illu_float::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_float.svg);
    mask-image: url(../../img/icons/single_color/illu_float.svg)
}

.bg-illu_food_truck::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_food_truck.svg);
    mask-image: url(../../img/icons/single_color/illu_food_truck.svg)
}

.bg-illu_football::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_football.svg);
    mask-image: url(../../img/icons/single_color/illu_football.svg)
}

.bg-illu_games::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_games.svg);
    mask-image: url(../../img/icons/single_color/illu_games.svg)
}

.bg-illu_gender::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_gender.svg);
    mask-image: url(../../img/icons/single_color/illu_gender.svg)
}

.bg-illu_glas::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_glas.svg);
    mask-image: url(../../img/icons/single_color/illu_glas.svg)
}

.bg-illu_globe_leaf::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_globe_leaf.svg);
    mask-image: url(../../img/icons/single_color/illu_globe_leaf.svg)
}

.bg-illu_globe::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_globe.svg);
    mask-image: url(../../img/icons/single_color/illu_globe.svg)
}

.bg-illu_gluten_free::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_gluten_free.svg);
    mask-image: url(../../img/icons/single_color/illu_gluten_free.svg)
}

.bg-illu_goggles::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_goggles.svg);
    mask-image: url(../../img/icons/single_color/illu_goggles.svg)
}

.bg-illu_golf::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_golf.svg);
    mask-image: url(../../img/icons/single_color/illu_golf.svg)
}

.bg-illu_gong::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_gong.svg);
    mask-image: url(../../img/icons/single_color/illu_gong.svg)
}

.bg-illu_gourmet::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_gourmet.svg);
    mask-image: url(../../img/icons/single_color/illu_gourmet.svg)
}

.bg-illu_grill::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_grill.svg);
    mask-image: url(../../img/icons/single_color/illu_grill.svg)
}

.bg-illu_guitar_mic::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_guitar_mic.svg);
    mask-image: url(../../img/icons/single_color/illu_guitar_mic.svg)
}

.bg-illu_halal::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_halal.svg);
    mask-image: url(../../img/icons/single_color/illu_halal.svg)
}

.bg-illu_hammer_wrench::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hammer_wrench.svg);
    mask-image: url(../../img/icons/single_color/illu_hammer_wrench.svg)
}

.bg-illu_hand_heart::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hand_heart.svg);
    mask-image: url(../../img/icons/single_color/illu_hand_heart.svg)
}

.bg-illu_hand_shake::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hand_shake.svg);
    mask-image: url(../../img/icons/single_color/illu_hand_shake.svg)
}

.bg-illu_handball::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_handball.svg);
    mask-image: url(../../img/icons/single_color/illu_handball.svg)
}

.bg-illu_hat::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hat.svg);
    mask-image: url(../../img/icons/single_color/illu_hat.svg)
}

.bg-illu_headphones::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_headphones.svg);
    mask-image: url(../../img/icons/single_color/illu_headphones.svg)
}

.bg-illu_heart::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_heart.svg);
    mask-image: url(../../img/icons/single_color/illu_heart.svg)
}

.bg-illu_hearts::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hearts.svg);
    mask-image: url(../../img/icons/single_color/illu_hearts.svg)
}

.bg-illu_helmet::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_helmet.svg);
    mask-image: url(../../img/icons/single_color/illu_helmet.svg)
}

.bg-illu_hiking_boots::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hiking_boots.svg);
    mask-image: url(../../img/icons/single_color/illu_hiking_boots.svg)
}

.bg-illu_hockey::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hockey.svg);
    mask-image: url(../../img/icons/single_color/illu_hockey.svg)
}

.bg-illu_house::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_house.svg);
    mask-image: url(../../img/icons/single_color/illu_house.svg)
}

.bg-illu_house2::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_house2.svg);
    mask-image: url(../../img/icons/single_color/illu_house2.svg)
}

.bg-illu_hugging_face::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_hugging_face.svg);
    mask-image: url(../../img/icons/single_color/illu_hugging_face.svg)
}

.bg-illu_index_pointing_up::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_index_pointing_up.svg);
    mask-image: url(../../img/icons/single_color/illu_index_pointing_up.svg)
}

.bg-illu_jambalaya::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_jambalaya.svg);
    mask-image: url(../../img/icons/single_color/illu_jambalaya.svg)
}

.bg-illu_kayak::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_kayak.svg);
    mask-image: url(../../img/icons/single_color/illu_kayak.svg)
}

.bg-illu_kite::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_kite.svg);
    mask-image: url(../../img/icons/single_color/illu_kite.svg)
}

.bg-illu_kosher::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_kosher.svg);
    mask-image: url(../../img/icons/single_color/illu_kosher.svg)
}

.bg-illu_language::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_language.svg);
    mask-image: url(../../img/icons/single_color/illu_language.svg)
}

.bg-illu_laptop_code::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_laptop_code.svg);
    mask-image: url(../../img/icons/single_color/illu_laptop_code.svg)
}

.bg-illu_laptop_text::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_laptop_text.svg);
    mask-image: url(../../img/icons/single_color/illu_laptop_text.svg)
}

.bg-illu_laptop_world::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_laptop_world.svg);
    mask-image: url(../../img/icons/single_color/illu_laptop_world.svg)
}

.bg-illu_laptop::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_laptop.svg);
    mask-image: url(../../img/icons/single_color/illu_laptop.svg)
}

.bg-illu_leaves::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_leaves.svg);
    mask-image: url(../../img/icons/single_color/illu_leaves.svg)
}

.bg-illu_leaves2::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_leaves2.svg);
    mask-image: url(../../img/icons/single_color/illu_leaves2.svg)
}

.bg-illu_light_bulb::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_light_bulb.svg);
    mask-image: url(../../img/icons/single_color/illu_light_bulb.svg)
}

.bg-illu_location_pin::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_location_pin.svg);
    mask-image: url(../../img/icons/single_color/illu_location_pin.svg)
}

.bg-illu_lotus::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_lotus.svg);
    mask-image: url(../../img/icons/single_color/illu_lotus.svg)
}

.bg-illu_luggage::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_luggage.svg);
    mask-image: url(../../img/icons/single_color/illu_luggage.svg)
}

.bg-illu_mask::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mask.svg);
    mask-image: url(../../img/icons/single_color/illu_mask.svg)
}

.bg-illu_mat::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mat.svg);
    mask-image: url(../../img/icons/single_color/illu_mat.svg)
}

.bg-illu_mat2::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mat2.svg);
    mask-image: url(../../img/icons/single_color/illu_mat2.svg)
}

.bg-illu_meat::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_meat.svg);
    mask-image: url(../../img/icons/single_color/illu_meat.svg)
}

.bg-illu_medal::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_medal.svg);
    mask-image: url(../../img/icons/single_color/illu_medal.svg)
}

.bg-illu_mic::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mic.svg);
    mask-image: url(../../img/icons/single_color/illu_mic.svg)
}

.bg-illu_microphone::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_microphone.svg);
    mask-image: url(../../img/icons/single_color/illu_microphone.svg)
}

.bg-illu_motorcycle::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_motorcycle.svg);
    mask-image: url(../../img/icons/single_color/illu_motorcycle.svg)
}

.bg-illu_mountain_climbing::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mountain_climbing.svg);
    mask-image: url(../../img/icons/single_color/illu_mountain_climbing.svg)
}

.bg-illu_mountainbike::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mountainbike.svg);
    mask-image: url(../../img/icons/single_color/illu_mountainbike.svg)
}

.bg-illu_mountains::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mountains.svg);
    mask-image: url(../../img/icons/single_color/illu_mountains.svg)
}

.bg-illu_mouth::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_mouth.svg);
    mask-image: url(../../img/icons/single_color/illu_mouth.svg)
}

.bg-illu_naan::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_naan.svg);
    mask-image: url(../../img/icons/single_color/illu_naan.svg)
}

.bg-illu_neutral_face::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_neutral_face.svg);
    mask-image: url(../../img/icons/single_color/illu_neutral_face.svg)
}

.bg-illu_olive_oil::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_olive_oil.svg);
    mask-image: url(../../img/icons/single_color/illu_olive_oil.svg)
}

.bg-illu_om_symbol::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_om_symbol.svg);
    mask-image: url(../../img/icons/single_color/illu_om_symbol.svg)
}

.bg-illu_open_book::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_open_book.svg);
    mask-image: url(../../img/icons/single_color/illu_open_book.svg)
}

.bg-illu_paddle::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_paddle.svg);
    mask-image: url(../../img/icons/single_color/illu_paddle.svg)
}

.bg-illu_padel_tennis::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_padel_tennis.svg);
    mask-image: url(../../img/icons/single_color/illu_padel_tennis.svg)
}

.bg-illu_palette::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_palette.svg);
    mask-image: url(../../img/icons/single_color/illu_palette.svg)
}

.bg-illu_palm_tree::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_palm_tree.svg);
    mask-image: url(../../img/icons/single_color/illu_palm_tree.svg)
}

.bg-illu_parachute::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_parachute.svg);
    mask-image: url(../../img/icons/single_color/illu_parachute.svg)
}

.bg-illu_parasol::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_parasol.svg);
    mask-image: url(../../img/icons/single_color/illu_parasol.svg)
}

.bg-illu_party_face::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_party_face.svg);
    mask-image: url(../../img/icons/single_color/illu_party_face.svg)
}

.bg-illu_paw::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_paw.svg);
    mask-image: url(../../img/icons/single_color/illu_paw.svg)
}

.bg-illu_peace_hand::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_peace_hand.svg);
    mask-image: url(../../img/icons/single_color/illu_peace_hand.svg)
}

.bg-illu_pen::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pen.svg);
    mask-image: url(../../img/icons/single_color/illu_pen.svg)
}

.bg-illu_pencile_brush::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pencile_brush.svg);
    mask-image: url(../../img/icons/single_color/illu_pencile_brush.svg)
}

.bg-illu_phone_like::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_phone_like.svg);
    mask-image: url(../../img/icons/single_color/illu_phone_like.svg)
}

.bg-illu_piano::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_piano.svg);
    mask-image: url(../../img/icons/single_color/illu_piano.svg)
}

.bg-illu_pillar::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pillar.svg);
    mask-image: url(../../img/icons/single_color/illu_pillar.svg)
}

.bg-illu_pizza::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pizza.svg);
    mask-image: url(../../img/icons/single_color/illu_pizza.svg)
}

.bg-illu_plant::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_plant.svg);
    mask-image: url(../../img/icons/single_color/illu_plant.svg)
}

.bg-illu_plaster::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_plaster.svg);
    mask-image: url(../../img/icons/single_color/illu_plaster.svg)
}

.bg-illu_pommel_horse::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pommel_horse.svg);
    mask-image: url(../../img/icons/single_color/illu_pommel_horse.svg)
}

.bg-illu_pool::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pool.svg);
    mask-image: url(../../img/icons/single_color/illu_pool.svg)
}

.bg-illu_popcorn_menu::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_popcorn_menu.svg);
    mask-image: url(../../img/icons/single_color/illu_popcorn_menu.svg)
}

.bg-illu_pot::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pot.svg);
    mask-image: url(../../img/icons/single_color/illu_pot.svg)
}

.bg-illu_prawn::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_prawn.svg);
    mask-image: url(../../img/icons/single_color/illu_prawn.svg)
}

.bg-illu_pray::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pray.svg);
    mask-image: url(../../img/icons/single_color/illu_pray.svg)
}

.bg-illu_pumpkin::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_pumpkin.svg);
    mask-image: url(../../img/icons/single_color/illu_pumpkin.svg)
}

.bg-illu_race_car::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_race_car.svg);
    mask-image: url(../../img/icons/single_color/illu_race_car.svg)
}

.bg-illu_racetrack::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_racetrack.svg);
    mask-image: url(../../img/icons/single_color/illu_racetrack.svg)
}

.bg-illu_record_player::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_record_player.svg);
    mask-image: url(../../img/icons/single_color/illu_record_player.svg)
}

.bg-illu_relieved_face::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_relieved_face.svg);
    mask-image: url(../../img/icons/single_color/illu_relieved_face.svg)
}

.bg-illu_rope::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_rope.svg);
    mask-image: url(../../img/icons/single_color/illu_rope.svg)
}

.bg-illu_rugby::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_rugby.svg);
    mask-image: url(../../img/icons/single_color/illu_rugby.svg)
}

.bg-illu_ruler::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_ruler.svg);
    mask-image: url(../../img/icons/single_color/illu_ruler.svg)
}

.bg-illu_running_top::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_running_top.svg);
    mask-image: url(../../img/icons/single_color/illu_running_top.svg)
}

.bg-illu_saddle::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_saddle.svg);
    mask-image: url(../../img/icons/single_color/illu_saddle.svg)
}

.bg-illu_sailboat::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_sailboat.svg);
    mask-image: url(../../img/icons/single_color/illu_sailboat.svg)
}

.bg-illu_sandwich::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_sandwich.svg);
    mask-image: url(../../img/icons/single_color/illu_sandwich.svg)
}

.bg-illu_shoeprint::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_shoeprint.svg);
    mask-image: url(../../img/icons/single_color/illu_shoeprint.svg)
}

.bg-illu_skateboard::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_skateboard.svg);
    mask-image: url(../../img/icons/single_color/illu_skateboard.svg)
}

.bg-illu_skater::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_skater.svg);
    mask-image: url(../../img/icons/single_color/illu_skater.svg)
}

.bg-illu_ski_lift::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_ski_lift.svg);
    mask-image: url(../../img/icons/single_color/illu_ski_lift.svg)
}

.bg-illu_ski::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_ski.svg);
    mask-image: url(../../img/icons/single_color/illu_ski.svg)
}

.bg-illu_skyline::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_skyline.svg);
    mask-image: url(../../img/icons/single_color/illu_skyline.svg)
}

.bg-illu_smiling_face_degree::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_degree.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_degree.svg)
}

.bg-illu_smiling_face_licking_lips::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_licking_lips.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_licking_lips.svg)
}

.bg-illu_smiling_face_with_glasses::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_with_glasses.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_with_glasses.svg)
}

.bg-illu_smiling_face_with_halo::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_with_halo.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_with_halo.svg)
}

.bg-illu_smiling_face_with_heart_eyes::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_with_heart_eyes.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_with_heart_eyes.svg)
}

.bg-illu_smiling_face_with_hearts::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_with_hearts.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_with_hearts.svg)
}

.bg-illu_smiling_face_with_smiling_eyes::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_with_smiling_eyes.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_with_smiling_eyes.svg)
}

.bg-illu_smiling_face_with_sunglasses::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smiling_face_with_sunglasses.svg);
    mask-image: url(../../img/icons/single_color/illu_smiling_face_with_sunglasses.svg)
}

.bg-illu_smirking_face::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smirking_face.svg);
    mask-image: url(../../img/icons/single_color/illu_smirking_face.svg)
}

.bg-illu_smoothie::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_smoothie.svg);
    mask-image: url(../../img/icons/single_color/illu_smoothie.svg)
}

.bg-illu_sneaker::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_sneaker.svg);
    mask-image: url(../../img/icons/single_color/illu_sneaker.svg)
}

.bg-illu_snowboard::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_snowboard.svg);
    mask-image: url(../../img/icons/single_color/illu_snowboard.svg)
}

.bg-illu_soccer::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_soccer.svg);
    mask-image: url(../../img/icons/single_color/illu_soccer.svg)
}

.bg-illu_soup_bowl::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_soup_bowl.svg);
    mask-image: url(../../img/icons/single_color/illu_soup_bowl.svg)
}

.bg-illu_spa::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_spa.svg);
    mask-image: url(../../img/icons/single_color/illu_spa.svg)
}

.bg-illu_star_struck::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_star_struck.svg);
    mask-image: url(../../img/icons/single_color/illu_star_struck.svg)
}

.bg-illu_steak_leaves::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_steak_leaves.svg);
    mask-image: url(../../img/icons/single_color/illu_steak_leaves.svg)
}

.bg-illu_stones::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_stones.svg);
    mask-image: url(../../img/icons/single_color/illu_stones.svg)
}

.bg-illu_stoppwatch::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_stoppwatch.svg);
    mask-image: url(../../img/icons/single_color/illu_stoppwatch.svg)
}

.bg-illu_sup_board::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_sup_board.svg);
    mask-image: url(../../img/icons/single_color/illu_sup_board.svg)
}

.bg-illu_surfboard::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_surfboard.svg);
    mask-image: url(../../img/icons/single_color/illu_surfboard.svg)
}

.bg-illu_sushi::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_sushi.svg);
    mask-image: url(../../img/icons/single_color/illu_sushi.svg)
}

.bg-illu_sword_wand::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_sword_wand.svg);
    mask-image: url(../../img/icons/single_color/illu_sword_wand.svg)
}

.bg-illu_table_tennis::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_table_tennis.svg);
    mask-image: url(../../img/icons/single_color/illu_table_tennis.svg)
}

.bg-illu_taco::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_taco.svg);
    mask-image: url(../../img/icons/single_color/illu_taco.svg)
}

.bg-illu_tajine::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_tajine.svg);
    mask-image: url(../../img/icons/single_color/illu_tajine.svg)
}

.bg-illu_telescope::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_telescope.svg);
    mask-image: url(../../img/icons/single_color/illu_telescope.svg)
}

.bg-illu_target::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_target.svg);
    mask-image: url(../../img/icons/single_color/illu_target.svg)
}

.bg-illu_tennis::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_tennis.svg);
    mask-image: url(../../img/icons/single_color/illu_tennis.svg)
}

.bg-illu_tent::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_tent.svg);
    mask-image: url(../../img/icons/single_color/illu_tent.svg)
}

.bg-illu_thinker::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_thinker.svg);
    mask-image: url(../../img/icons/single_color/illu_thinker.svg)
}

.bg-illu_thought_balloon::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_thought_balloon.svg);
    mask-image: url(../../img/icons/single_color/illu_thought_balloon.svg)
}

.bg-illu_tickets::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_tickets.svg);
    mask-image: url(../../img/icons/single_color/illu_tickets.svg)
}

.bg-illu_travel_pin::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_travel_pin.svg);
    mask-image: url(../../img/icons/single_color/illu_travel_pin.svg)
}

.bg-illu_trees_2::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_trees_2.svg);
    mask-image: url(../../img/icons/single_color/illu_trees_2.svg)
}

.bg-illu_trees::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_trees.svg);
    mask-image: url(../../img/icons/single_color/illu_trees.svg)
}

.bg-illu_tv::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_tv.svg);
    mask-image: url(../../img/icons/single_color/illu_tv.svg)
}

.bg-illu_tzatziki::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_tzatziki.svg);
    mask-image: url(../../img/icons/single_color/illu_tzatziki.svg)
}

.bg-illu_upside_down_face::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_upside_down_face.svg);
    mask-image: url(../../img/icons/single_color/illu_upside_down_face.svg)
}

.bg-illu_van::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_van.svg);
    mask-image: url(../../img/icons/single_color/illu_van.svg)
}

.bg-illu_vase::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_vase.svg);
    mask-image: url(../../img/icons/single_color/illu_vase.svg)
}

.bg-illu_volleyball::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_volleyball.svg);
    mask-image: url(../../img/icons/single_color/illu_volleyball.svg)
}

.bg-illu_walking_sticks::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_walking_sticks.svg);
    mask-image: url(../../img/icons/single_color/illu_walking_sticks.svg)
}

.bg-illu_waving_hand::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_waving_hand.svg);
    mask-image: url(../../img/icons/single_color/illu_waving_hand.svg)
}

.bg-illu_wedding_rings::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_wedding_rings.svg);
    mask-image: url(../../img/icons/single_color/illu_wedding_rings.svg)
}

.bg-illu_wellness::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_wellness.svg);
    mask-image: url(../../img/icons/single_color/illu_wellness.svg)
}

.bg-illu_windsurf_boards::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_windsurf_boards.svg);
    mask-image: url(../../img/icons/single_color/illu_windsurf_boards.svg)
}

.bg-illu_wine_glasses::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_wine_glasses.svg);
    mask-image: url(../../img/icons/single_color/illu_wine_glasses.svg)
}

.bg-illu_wine::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_wine.svg);
    mask-image: url(../../img/icons/single_color/illu_wine.svg)
}

.bg-illu_wallet::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_wallet.svg);
    mask-image: url(../../img/icons/single_color/illu_wallet.svg)
}

.bg-illu_world::before {
    -webkit-mask-image: url(../../img/icons/single_color/illu_world.svg);
    mask-image: url(../../img/icons/single_color/illu_world.svg)
}

.icon-photo::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_photo.svg");
    mask-image: url("../../img/icons/single_color/icon_photo.svg")
}

.icon-lock::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_lock.svg");
    mask-image: url("../../img/icons/single_color/icon_lock.svg")
}

.icon-cam::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_cam.svg");
    mask-image: url("../../img/icons/single_color/icon_cam.svg")
}

.icon-male-female::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_male_female.svg");
    mask-image: url("../../img/icons/single_color/icon_male_female.svg")
}

.icon-halfling_search::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_search.svg");
    mask-image: url("../../img/icons/single_color/icon_search.svg")
}

.icon-settings::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_tools.svg");
    mask-image: url("../../img/icons/single_color/icon_tools.svg")
}

.icon-user::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_user_uni_200_filled.svg");
    mask-image: url("../../img/icons/single_color/icon_user_uni_200_filled.svg")
}

.icon-play::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_play.svg");
    mask-image: url("../../img/icons/single_color/icon_play.svg")
}

.icon-speakbubbles::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_message_bubbles.svg");
    mask-image: url("../../img/icons/single_color/icon_message_bubbles.svg")
}

.icon-book-checkmark::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_book_checkmark.svg");
    mask-image: url("../../img/icons/single_color/icon_book_checkmark.svg")
}

.icon-compass::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_compass.svg");
    mask-image: url("../../img/icons/single_color/icon_compass.svg")
}

.icon-compatibility::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_compatibility.svg");
    mask-image: url("../../img/icons/single_color/icon_compatibility.svg")
}

.icon-love-couple::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_love_couple.svg");
    mask-image: url("../../img/icons/single_color/icon_love_couple.svg")
}

.icon-gift::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_gift.svg");
    mask-image: url("../../img/icons/single_color/icon_gift.svg")
}

.icon-magazin::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_magazin.svg");
    mask-image: url("../../img/icons/single_color/icon_magazin.svg")
}

.icon-bulb::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_bulb.svg");
    mask-image: url("../../img/icons/single_color/icon_bulb.svg")
}

.icon-office-building::before {
    content: "" !important;
    margin-right: 8px;
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    background-color: var(--COLOR_supportDark_300);
    -webkit-mask-image: url("../../img/icons/single_color/icon_office_building.svg");
    mask-image: url("../../img/icons/single_color/icon_office_building.svg")
}

:root {
    --boxShadow_small: 0 3px 8px 1px rgb(0 0 0 / 20%);
    --boxShadow_mid: 0 5px 14px 2px rgb(0 0 0 / 20%);
    --boxShadow_large: 0 9px 26px 2px rgb(0 0 0 / 30%);
    --boxShadow_extra_large: 0 5px 80px 2px rgb(0 0 0 / 15%)
}

:root {
    --borderRadius_75: 10px;
    --borderRadius_100: 20px;
    --borderRadius_200: 32px;
    --borderRadius_rounded: 500px;
    --borderRadius_circle: 50%;
    --borderRadius_textfield: var(--borderRadius_75);
    --borderRadius_button: var(--borderRadius_rounded)
}

*,*::before,*::after {
    box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

:focus {
    outline: none
}

:where(:not(:defined)) {
    display: none
}

:where(:not(:defined)):where([jsless]) {
    display: block
}

body {
    -webkit-font-smoothing: antialiased !important
}

@media(pointer: coarse) {
    body {
        cursor:pointer
    }
}

body .debugLayerOutput {
    position: absolute;
    top: 0;
    padding: 4px;
    overflow: scroll;
    width: 100%;
    height: 100%;
    font-size: 12px;
    z-index: 999;
    background-color: var(--COLOR_supportDark_600);
    margin-bottom: 8px;
    color: var(--COLOR_supportDark_100)
}

body .debugLayerOutput table {
    margin-top: 8px;
    border-collapse: collapse
}

body .debugLayerOutput table tr td {
    border: 1px solid var(--COLOR_supportDark_500);
    padding: 1px 4px
}

body #pageWrapper {
    overflow: hidden
}

body strong {
    font-weight: 600
}

body a:focus-visible,body button:focus-visible {
    outline: 2px dashed currentcolor
}

.noDisplay {
    display: none !important
}

.visuallyHidden {
    position: absolute !important;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%)
}

@media(max-width: 480px) {
    .hideInS {
        display:none !important
    }
}

@media(min-width: 481px)and (max-width: 767px) {
    .hideInM {
        display:none !important
    }
}

@media(min-width: 768px)and (max-width: 979px) {
    .hideInL {
        display:none !important
    }
}

@media(min-width: 980px) {
    .hideInXL {
        display:none !important
    }
}

@media(max-width: 480px) {
    .hideInSM {
        display:none !important
    }
}

@media(min-width: 481px)and (max-width: 767px) {
    .hideInSM {
        display:none !important
    }
}

@media(min-width: 768px)and (max-width: 979px) {
    .hideInLXL {
        display:none !important
    }
}

@media(min-width: 980px) {
    .hideInLXL {
        display:none !important
    }
}

#postscribeTracking,#affiliate_tracking,#webtracking {
    display: none
}

@media print {
    .hidden-print {
        display: none !important
    }
}

.fromIap {
    padding: 20px
}

.fromIap h1 {
    font: var(--FONT_highlight_200)
}

.fromIap p {
    font: var(--FONT_default_100)
}

.photo img,img.photo,#bgImgBox img {
    pointer-events: none !important
}

html,body {
    height: 100%;
    color: var(--COLOR_defaultText);
    font: var(--FONT_default_75)
}

body {
    background: var(--COLOR_primary_100)
}

body #header {
    padding: 24px
}

body #header .brandLogo,body #header .brandLogo img {
    display: block;
    margin: 0 auto;
    height: 40px
}

body #pageWrapper {
    position: relative;
    min-height: 100%
}

body #pageWrapper .socialSignOnSeparator {
    position: relative;
    width: 100%;
    overflow: hidden;
    text-align: center;
    white-space: nowrap
}

body #pageWrapper .socialSignOnSeparator::before {
    position: absolute;
    left: 0;
    top: 10px;
    display: inline-block;
    content: "";
    width: 100%;
    border-top: 1px solid var(--COLOR_supportDark_080);
    opacity: .5;
    vertical-align: 4px
}

body #pageWrapper .socialSignOnSeparator .speratorText {
    position: relative;
    z-index: 1;
    color: var(--COLOR_supportDark_300);
    background-color: var(--COLOR_supportLight_100);
    padding: 4px 8px
}

body #pageWrapper article {
    padding: 0 16px;
    margin: 0 auto 16px auto;
    background-color: var(--COLOR_supportLight_100);
    max-width: 95%;
    border-radius: var(--borderRadius_75)
}

@media only screen and (min-width: 768px) {
    body #pageWrapper article {
        max-width:720px
    }
}

body #pageWrapper article .tabs {
    display: flex;
    margin: 0 auto;
    max-width: 480px;
    padding: 0;
    list-style: none
}

body #pageWrapper article .tabs li {
    width: 50%;
    flex-grow: 1;
    font: var(--FONT_highlight_100);
    text-align: center;
    background-color: var(--COLOR_supportDark_040);
    border-top: 5px solid rgba(0,0,0,0)
}

body #pageWrapper article .tabs li:hover {
    background-color: rgb(var(--COLOR_primary_100) 0.1)
}

body #pageWrapper article .tabs li.active {
    border-color: var(--COLOR_primary_100);
    background-color: var(--COLOR_supportLight_100)
}

body #pageWrapper article .tabs li.active:hover {
    background-color: var(--COLOR_supportLight_100)
}

body #pageWrapper article .tabs li a {
    display: inline-block;
    width: 100%;
    text-decoration: none;
    color: var(--COLOR_supportDark_100)
}

body #pageWrapper article .tabs li span {
    display: inline-block;
    padding: 8px 0 12px 0
}

body #pageWrapper article h2 {
    margin-top: 28px;
    margin-bottom: 24px;
    font: var(--FONT_default_200);
    text-align: center
}

body #pageWrapper #loadingText {
    display: none;
    text-align: center;
    top: 30%;
    position: absolute;
    width: 100%;
    font: var(--FONT_default_300);
    color: var(--COLOR_supportLight_100)
}

body #pageWrapper #loadingText i {
    display: block;
    animation-name: spinner;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-duration: 2s;
    transform-style: preserve-3d
}

body #pageWrapper #loadingText i::before {
    width: 46px;
    height: 46px
}

body #pageWrapper #loadingText.is-visible {
    display: block
}

@keyframes spinner {
    from {
        transform: rotateY(5deg)
    }

    to {
        transform: rotateY(-355deg)
    }
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

main {
    display: block
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible
}

pre {
    font-family: monospace,monospace;
    font-size: 1em
}

a {
    background-color: transparent
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,strong {
    font-weight: bolder
}

code,kbd,samp {
    font-family: monospace,monospace;
    font-size: 1em
}

small {
    font-size: 80%
}

sub,sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sub {
    bottom: -0.25em
}

sup {
    top: -0.5em
}

img {
    border-style: none
}

button,input,optgroup,select,textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,input {
    overflow: visible
}

button,select {
    text-transform: none
}

button,[type=button],[type=reset],[type=submit] {
    -webkit-appearance: button
}

button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner {
    border-style: none;
    padding: 0
}

button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring {
    outline: 1px dotted ButtonText
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    box-sizing: border-box;
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

progress {
    vertical-align: baseline
}

textarea {
    overflow: auto
}

[type=checkbox],[type=radio] {
    box-sizing: border-box;
    padding: 0
}

[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button {
    height: auto
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

details {
    display: block
}

summary {
    display: list-item
}

template {
    display: none
}

[hidden] {
    display: none
}

#techErrorMessages {
    display: block !important;
    position: absolute;
    top: 0;
    width: 100%
}

#errorOnMediaServer {
    display: none !important
}

.topInfoBar {
    display: none;
    position: relative;
    z-index: 1000;
    width: 100%;
    margin: 0 auto;
    border-top: 5px solid #ef5602;
    border-bottom: 5px solid #000;
    background-color: #fff;
    background-attachment: fixed
}

.topInfoBar .textWrapper {
    padding-top: 15px;
    padding-bottom: 15px;
    padding-left: 30px
}

.topInfoBar .textWrapper p {
    color: #000;
    font: var(--FONT_highlight_75);
    margin: 0
}

@media only screen and (min-width: 768px) {
    .topInfoBar .textWrapper p {
        font:var(--FONT_highlight_100)
    }
}

.topInfoBar .textWrapper p.withWarning::before .wdk-icon.icon_warning {
    vertical-align: bottom;
    fill: #ef5602
}

.topInfoBar .textWrapper p a {
    color: var(--COLOR_primary_100)
}

.topInfoBar a.buttonStyle {
    border: 1px solid #8a8a8a;
    border-radius: var(--borderRadius_75);
    background-color: #dadada;
    padding: 13px 15px;
    color: #000;
    font: var(--FONT_default_75);
    text-decoration: none;
    display: inline-block
}

.topInfoBar a.buttonStyle::before {
    font: var(--FONT_highlight_300);
    vertical-align: -16%
}

.topInfoBar a.buttonStyle:hover {
    background-color: #fff
}

.topInfoBar a.buttonStyle:active {
    background-color: #dadada
}

.topInfoBar .hideInfoBar {
    cursor: pointer;
    position: absolute;
    right: 6%;
    top: 12px;
    display: block;
    font: var(--FONT_highlight_300);
    color: #66666b;
    text-decoration: none
}

.topInfoBar .hideInfoBar .wdk-icon {
    width: 20px;
    height: 20px
}

.no-cookies #cookieError {
    display: block !important
}

#JSError {
    display: block
}

#JSError .withWarning .wdk-icon.icon_warning {
    vertical-align: bottom
}

.legacybrowser #legacyBrowser {
    display: block !important
}

.legacybrowser #legacyBrowser .textWrapper {
    padding: 8px 60px 0 12px;
    margin: 0 auto;
    max-width: 980px
}

.legacybrowser #legacyBrowser .textWrapper::after {
    content: "";
    display: table;
    clear: both
}

.legacybrowser #legacyBrowser .hideInfoBar {
    right: 12px
}

.legacybrowser #legacyBrowser .withWarning {
    position: relative;
    padding-left: 44px;
    margin-bottom: 16px;
    font: var(--FONT_default_50)
}

@media only screen and (min-width: 768px) {
    .legacybrowser #legacyBrowser .withWarning {
        font:var(--FONT_default_75)
    }
}

.legacybrowser #legacyBrowser .withWarning .wdk-icon.icon_warning {
    vertical-align: bottom;
    fill: var(--COLOR_alertWarning_100)
}

.legacybrowser #legacyBrowser .withWarning strong {
    font-weight: bold
}

.legacybrowser #legacyBrowser .browserButtons {
    text-align: center;
    margin: 0 0 12px 0;
    padding: 0
}

.legacybrowser #legacyBrowser .browserButtons::after {
    content: "";
    display: table;
    clear: both
}

.legacybrowser #legacyBrowser .browserButtons li {
    display: inline-block;
    margin: 0 4px
}

.legacybrowser #legacyBrowser .browserButtons li a {
    line-height: 1.1em;
    text-align: left;
    padding: 8px 8px
}

.legacybrowser #legacyBrowser .browserButtons li a span {
    display: inline-block
}

.legacybrowser #legacyBrowser .browserButtons li a .browsericon {
    width: 33px;
    height: 33px;
    margin-right: 8px;
    background-repeat: no-repeat
}

.legacybrowser #legacyBrowser .browserButtons li a.chrome .browsericon {
    background-image: url("../../img/browser_chrome.png")
}

.legacybrowser #legacyBrowser .browserButtons li a.firefox .browsericon {
    background-image: url("../../img/browser_firefox.png")
}

.legacybrowser #legacyBrowser .browserButtons li a.ie {
    display: none
}

@media only screen and (min-width: 768px) {
    .legacybrowser #legacyBrowser .browserButtons li a.ie {
        display:inline-block
    }
}

.legacybrowser #legacyBrowser .browserButtons li a.ie .browsericon {
    background-image: url("../../img/browser_edge.png")
}

#errorModalboxSessionExpired {
    text-align: center
}

#errorModalboxSessionExpired .scrollingContent {
    overflow: hidden
}

#errorModalboxSessionExpired i {
    display: block;
    margin: 0 auto;
    width: 30px;
    height: 30px;
    overflow: hidden;
    font: var(--FONT_highlight_300)
}

#offlineError {
    position: fixed;
    display: flex;
    bottom: 0;
    margin: 8px;
    width: calc(100% - 16px);
    background-color: var(--COLOR_supportDark_090);
    z-index: 1000;
    padding: 8px 16px;
    text-align: center;
    font: var(--FONT_default_75);
    color: var(--COLOR_supportLight_100);
    box-shadow: var(--boxShadow_mid)
}

@keyframes shake {
    10%,90% {
        transform: translate3d(-2px, 0, 0)
    }

    20%,80% {
        transform: translate3d(2px, 0, 0)
    }

    30%,50%,70% {
        transform: translate3d(-5px, 0, 0)
    }

    40%,60% {
        transform: translate3d(5px, 0, 0)
    }
}

#offlineError.attention p {
    animation: shake .82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both
}

#offlineError p {
    width: 100%;
    margin: 0
}

html.is-offline .js-onlineOnly {
    filter: blur(2px) saturate(0)
}

#lieFiNotification {
    position: fixed;
    display: flex;
    justify-content: space-between;
    align-items: center;
    bottom: 0;
    margin: 8px;
    width: calc(100% - 16px);
    background-color: var(--COLOR_supportDark_090);
    z-index: 1000;
    padding: 0 16px;
    text-align: center;
    font: var(--FONT_default_75);
    color: var(--COLOR_supportLight_100);
    box-shadow: var(--boxShadow_mid)
}

#lieFiNotification p {
    margin-right: 16px
}

html.is-inPWA body {
    overscroll-behavior-y: none;
    -webkit-user-select: none;
    user-select: none;
    touch-action: pan-y pan-x
}

html.is-inPWA body p,html.is-inPWA body a {
    -webkit-user-drag: none
}

#pageWrapper {
    min-height: 100vh;
    display: flex;
    flex-direction: column
}

#pageWrapper #content {
    flex: 1 0 auto
}

peg-footer {
    width: 100%;
    background-color: rgba(0,0,0,0);
    padding: 16px 8px;
    margin-top: 12px;
    overflow: auto;
    font: var(--FONT_default_50);
    line-height: 24px;
    color: var(--COLOR_defaultText);
    text-align: center
}

peg-footer nav {
    margin: 0
}

peg-footer nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0
}

peg-footer nav ul li {
    display: inline-block;
    padding: 0 9px 0 0;
    font: var(--FONT_default_50)
}

peg-footer nav ul li::before {
    content: "·";
    padding-right: 6px;
    color: var(--COLOR_supportDark_300);
    font: var(--FONT_highlight_200);
    vertical-align: -4px
}

peg-footer nav ul li:first-child::before {
    display: none
}

peg-footer nav ul li:last-child {
    padding-right: 0
}

peg-footer nav ul li a {
    color: var(--COLOR_supportDark_100);
    text-decoration: none
}

peg-footer nav ul li a:hover {
    text-decoration: underline
}

peg-footer nav ul li a sup.updated::after {
    content: "Updated";
    padding: 0 4px 0 2px;
    border-radius: var(--borderRadius_rounded);
    text-align: center;
    background-color: var(--COLOR_alertError_100);
    color: var(--COLOR_supportLight_100);
    font-size: 9px
}

@media only screen and (min-width: 768px) {
    peg-footer nav ul li a sup.updated::after {
        margin-left:4px
    }
}

peg-footer .copyrightText {
    color: var(--COLOR_supportDark_300);
    margin: 20px 0 0 0
}

peg-footer .trustWrapper {
    margin-top: 8px
}

peg-footer .trustWrapper .trustLogo {
    display: inline-flex;
    align-items: center;
    padding: 4px 8px 4px 10px;
    border: 1px solid var(--COLOR_supportDark_070);
    border-radius: var(--borderRadius_75)
}

peg-footer .trustWrapper .trustLogo img {
    display: inline-block;
    margin-left: 12px
}

peg-footer[skin=primaryDark] {
    color: var(--COLOR_supportLight_100);
    background-color: var(--COLOR_primary_100_dark)
}

peg-footer[skin=primaryDark] nav ul li a,peg-footer[skin=primaryDark] nav ul li::before,peg-footer[skin=primaryDark] .copyrightText {
    color: var(--COLOR_supportLight_100)
}

peg-footer[skin=lightgray] {
    background-color: var(--COLOR_supportDark_040)
}

@media only screen and (min-width: 768px) {
    peg-footer[skin=lightgray] nav ul li.logout {
        display:none
    }
}

peg-footer[skin=oldRegistrationCheckout] {
    color: var(--COLOR_supportLight_100);
    background-color: var(--COLOR_supportDark_050)
}

peg-footer[skin=oldRegistrationCheckout] nav ul li a,peg-footer[skin=oldRegistrationCheckout] nav ul li::before,peg-footer[skin=oldRegistrationCheckout] .copyrightText {
    color: var(--COLOR_supportLight_100)
}

peg-photo-selector {
    display: grid;
    gap: 1rem;
    width: 100%
}

peg-photo-selector .wdk-styledHintBox.t-error:not(.is-visible),peg-photo-selector wdk-dialog:not([open]) {
    position: absolute;
    visibility: hidden
}

peg-photo-selector .wdk-styledHintBox.t-error,peg-photo-selector .wdk-styledHintBox.t-error.is-visible {
    margin: 0
}

peg-photo-selector #dragDropArea {
    display: grid;
    place-content: center;
    place-items: center;
    min-height: 100px;
    padding: 1.25rem;
    cursor: default;
    font: var(--FONT_default_100);
    text-align: center;
    color: var(--COLOR_supportDark_300);
    border-radius: var(--borderRadius_75);
    border: 2px dashed var(--COLOR_defaultText)
}

@media only screen and (pointer: coarse) {
    peg-photo-selector #dragDropArea {
        display:none
    }
}

peg-photo-selector #dragDropArea.dragOver {
    border-color: var(--COLOR_alertSuccess_100);
    box-shadow: 0 0 20px -6px var(--COLOR_supportDark_100) inset
}

peg-photo-selector #dragDropArea .wdk-icon.icon_upload {
    display: block;
    width: 46px;
    height: 46px
}

peg-photo-selector #uploadButton {
    position: relative;
    display: flex;
    justify-content: center
}

peg-photo-uploader {
    display: flex;
    justify-content: center;
    flex-direction: column
}

peg-photo-uploader progress {
    accent-color: var(--COLOR_primary_100);
    width: 100%;
    height: 30px
}

peg-photo-editor #imageContainer {
    --gap: calc(2 * 24px);
    --padding: calc(2 * 24px);
    --buttons: calc(2 * 48px);
    --headline: 28px;
    --base-height: 100dvh;
    max-height: calc(var(--base-height) - var(--gap) - var(--padding) - var(--buttons) - var(--headline));
    min-height: 380px
}

@media only screen and (min-width: 481px) {
    peg-photo-editor #imageContainer {
        --base-height: 80dvh
    }
}

peg-photo-editor #imageContainer .cropper-view-box {
    outline: 1px solid var(--COLOR_supportDark_100);
    outline-color: var(--COLOR_supportDark_100)
}

peg-photo-editor #imageContainer .cropper-view-box::after {
    position: absolute;
    top: 0;
    bottom: 0;
    margin-top: auto;
    margin-bottom: auto;
    left: 0;
    content: "";
    width: 100%;
    height: 0;
    padding-bottom: 100%;
    border: 1px solid var(--COLOR_supportDark_100);
    border-radius: var(--borderRadius_circle)
}

peg-photo-editor .photouploadControls {
    display: grid;
    grid-template-columns: 1fr 1fr;
    list-style: none;
    margin: 0;
    padding: 0
}

peg-photo-editor .photouploadControls .controlGroup {
    display: flex;
    justify-content: center
}

@media(pointer: coarse) {
    peg-photo-editor .photouploadControls {
        grid-template-columns:1fr
    }

    peg-photo-editor .photouploadControls .controlGroup.zoom {
        display: none
    }
}

peg-photo-upload-dialog {
    --gap: 48px;
    display: grid;
    padding: calc(var(--gap)/2);
    background-color: var(--COLOR_supportLight_100);
    height: 100dvh
}

@media only screen and (min-width: 481px) {
    peg-photo-upload-dialog {
        border-radius:var(--borderRadius_100);
        height: auto
    }
}

peg-photo-upload-dialog[enable-photo-description] {
    grid-template-columns: 100% 100%;
    overflow: hidden;
    gap: var(--gap)
}

peg-photo-upload-dialog[enable-photo-description]>* {
    transition: 200ms ease-in
}

peg-photo-upload-dialog:has(>[data-tab=photo-editor][inert]) [data-tab=photo-editor],peg-photo-upload-dialog:has(>[data-tab=photo-editor][inert]) [data-tab=photo-description] {
    transform: translateX(calc(-100% - var(--gap)))
}

peg-photo-upload-dialog:has(>[data-tab=photo-description][inert]) [data-tab=photo-editor],peg-photo-upload-dialog:has(>[data-tab=photo-description][inert]) [data-tab=photo-description] {
    transform: translateX(0)
}

peg-photo-upload-dialog [data-tab=photo-editor] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: min-content 1fr min-content;
    grid-template-areas: "heading heading" "editor editor" "abort save";
    gap: 24px
}

peg-photo-upload-dialog [data-tab=photo-editor] h3 {
    grid-area: heading
}

peg-photo-upload-dialog [data-tab=photo-editor] peg-photo-editor {
    grid-area: editor
}

peg-photo-upload-dialog [data-tab=photo-editor] .abort {
    grid-area: abort
}

peg-photo-upload-dialog [data-tab=photo-editor] .save,peg-photo-upload-dialog [data-tab=photo-editor] .continue {
    grid-area: save
}

peg-photo-upload-dialog [data-tab=photo-description] {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: min-content 1fr min-content;
    grid-template-areas: "heading heading" "label label" "back save";
    gap: 24px
}

peg-photo-upload-dialog [data-tab=photo-description] h3 {
    grid-area: heading
}

peg-photo-upload-dialog [data-tab=photo-description] .back {
    grid-area: back
}

peg-photo-upload-dialog [data-tab=photo-description] .descriptionLayer {
    grid-area: label
}

peg-photo-upload-dialog [data-tab=photo-description] .save,peg-photo-upload-dialog [data-tab=photo-description] .continue {
    grid-area: save
}

peg-photo-upload-dialog h3 {
    font: var(--FONT_default_200);
    color: var(--COLOR_defaultText);
    margin: 0
}

/*!
 * Cropper.js v1.5.6
 * https://fengyuanchen.github.io/cropperjs
 *
 * Copyright 2015-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2019-10-04T04:33:44.164Z
 */
.cropper-container {
    direction: ltr;
    font-size: 0;
    line-height: 0;
    position: relative;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none
}

.cropper-container img {
    display: block;
    height: 100%;
    image-orientation: 0deg;
    max-height: none !important;
    max-width: none !important;
    min-height: 0 !important;
    min-width: 0 !important;
    width: 100%
}

.cropper-wrap-box,.cropper-canvas,.cropper-drag-box,.cropper-crop-box,.cropper-modal {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.cropper-wrap-box,.cropper-canvas {
    overflow: hidden
}

.cropper-drag-box {
    background-color: #fff;
    opacity: 0
}

.cropper-modal {
    background-color: #000;
    opacity: .5
}

.cropper-view-box {
    display: block;
    height: 100%;
    outline: 1px solid #39f;
    outline-color: rgba(51, 153, 255, 0.75);
    overflow: hidden;
    width: 100%
}

.cropper-dashed {
    border: 0 dashed #eee;
    display: block;
    opacity: .5;
    position: absolute
}

.cropper-dashed.dashed-h {
    border-bottom-width: 1px;
    border-top-width: 1px;
    height: 33.3333333333%;
    left: 0;
    top: 33.3333333333%;
    width: 100%
}

.cropper-dashed.dashed-v {
    border-left-width: 1px;
    border-right-width: 1px;
    height: 100%;
    left: 33.3333333333%;
    top: 0;
    width: 33.3333333333%
}

.cropper-center {
    display: block;
    height: 0;
    left: 50%;
    opacity: .75;
    position: absolute;
    top: 50%;
    width: 0
}

.cropper-center::before,.cropper-center::after {
    background-color: #eee;
    content: " ";
    display: block;
    position: absolute
}

.cropper-center::before {
    height: 1px;
    left: -3px;
    top: 0;
    width: 7px
}

.cropper-center::after {
    height: 7px;
    left: 0;
    top: -3px;
    width: 1px
}

.cropper-face,.cropper-line,.cropper-point {
    display: block;
    height: 100%;
    opacity: .1;
    position: absolute;
    width: 100%
}

.cropper-face {
    background-color: #fff;
    left: 0;
    top: 0
}

.cropper-line {
    background-color: #39f
}

.cropper-line.line-e {
    cursor: ew-resize;
    right: -3px;
    top: 0;
    width: 5px
}

.cropper-line.line-n {
    cursor: ns-resize;
    height: 5px;
    left: 0;
    top: -3px
}

.cropper-line.line-w {
    cursor: ew-resize;
    left: -3px;
    top: 0;
    width: 5px
}

.cropper-line.line-s {
    bottom: -3px;
    cursor: ns-resize;
    height: 5px;
    left: 0
}

.cropper-point {
    background-color: #39f;
    height: 5px;
    opacity: .75;
    width: 5px
}

.cropper-point.point-e {
    cursor: ew-resize;
    margin-top: -3px;
    right: -3px;
    top: 50%
}

.cropper-point.point-n {
    cursor: ns-resize;
    left: 50%;
    margin-left: -3px;
    top: -3px
}

.cropper-point.point-w {
    cursor: ew-resize;
    left: -3px;
    margin-top: -3px;
    top: 50%
}

.cropper-point.point-s {
    bottom: -3px;
    cursor: s-resize;
    left: 50%;
    margin-left: -3px
}

.cropper-point.point-ne {
    cursor: nesw-resize;
    right: -3px;
    top: -3px
}

.cropper-point.point-nw {
    cursor: nwse-resize;
    left: -3px;
    top: -3px
}

.cropper-point.point-sw {
    bottom: -3px;
    cursor: nesw-resize;
    left: -3px
}

.cropper-point.point-se {
    bottom: -3px;
    cursor: nwse-resize;
    height: 20px;
    opacity: 1;
    right: -3px;
    width: 20px
}

@media(min-width: 768px) {
    .cropper-point.point-se {
        height:15px;
        width: 15px
    }
}

@media(min-width: 992px) {
    .cropper-point.point-se {
        height:10px;
        width: 10px
    }
}

@media(min-width: 1200px) {
    .cropper-point.point-se {
        height:5px;
        opacity: .75;
        width: 5px
    }
}

.cropper-point.point-se::before {
    background-color: #39f;
    bottom: -50%;
    content: " ";
    display: block;
    height: 200%;
    opacity: 0;
    position: absolute;
    right: -50%;
    width: 200%
}

.cropper-invisible {
    opacity: 0
}

.cropper-bg {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC")
}

.cropper-hide {
    display: block;
    height: 0;
    position: absolute;
    width: 0
}

.cropper-hidden {
    display: none !important
}

.cropper-move {
    cursor: move
}

.cropper-crop {
    cursor: crosshair
}

.cropper-disabled .cropper-drag-box,.cropper-disabled .cropper-face,.cropper-disabled .cropper-line,.cropper-disabled .cropper-point {
    cursor: not-allowed
}

html.has-modalboxOpen {
    height: 100vh;
    overflow-y: initial
}

html.has-modalboxOpen body {
    width: 100%;
    overflow: hidden
}

html.has-modalboxOpen body #pageWrapper {
    filter: blur(16px)
}

.wdk-modalbox {
    position: fixed;
    top: 0;
    left: 0;
    display: flex;
    overflow: hidden;
    width: 0;
    height: 0;
    justify-content: center
}

@media only screen and (min-width: 768px) {
    .wdk-modalbox {
        align-items:center
    }
}

.wdk-modalbox::before {
    content: "";
    display: block;
    position: fixed;
    inset: 0 0 0 0;
    z-index: -1;
    width: 0;
    height: 0;
    will-change: opacity;
    opacity: 0;
    background-color: var(--COLOR_supportDark_080)
}

.wdk-modalbox.is-open {
    z-index: 210;
    overflow: visible;
    width: 100%;
    height: 100%
}

.wdk-modalbox.is-open::before {
    width: 100%;
    height: 100%;
    opacity: 1
}

@media only screen and (min-width: 768px) {
    .wdk-modalbox.is-open::before {
        transition:opacity 200ms ease-out
    }
}

@media only screen and (max-width: 767px) {
    .wdk-modalbox.is-open.is-bottomDrawer {
        width:100%;
        height: 100%;
        margin-top: 0;
        align-items: flex-end;
        justify-content: center
    }

    .wdk-modalbox.is-open.is-bottomDrawer .modalboxContent {
        max-width: 540px;
        max-height: 90vh;
        height: auto;
        margin-left: 0;
        margin-right: 0;
        border-radius: 0
    }
}

.wdk-modalbox.is-open.has-smallContent {
    margin-top: 0;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center
}

.wdk-modalbox.is-open.has-smallContent .modalboxContent {
    max-width: 540px;
    max-height: 90vh;
    margin-left: 16px;
    margin-right: 16px;
    height: auto;
    border-radius: var(--borderRadius_100)
}

.wdk-modalbox.is-open.has-fullBgImage .modalboxContent {
    background-size: cover;
    color: var(--COLOR_supportLight_100)
}

.wdk-modalbox.is-open.has-fullBgImage .modalboxContent h3 {
    color: var(--COLOR_supportLight_100)
}

.wdk-modalbox.is-open.transition-in .modalboxContent {
    opacity: 1
}

@media only screen and (min-width: 768px) {
    .wdk-modalbox.is-open.transition-in .modalboxContent {
        transform:scale(1) translate(0)
    }
}

.wdk-modalbox.is-open.transition-out .modalboxContent {
    opacity: 0
}

@media only screen and (min-width: 768px) {
    .wdk-modalbox.is-open.transition-out .modalboxContent {
        transform:scale(0.8) translateY(50%)
    }
}

.wdk-modalbox.t-success header h3 {
    color: var(--COLOR_alertSuccess_100)
}

.wdk-modalbox .modalboxContent {
    position: relative;
    width: 100%;
    height: 100%;
    opacity: 0;
    display: flex;
    flex-direction: column;
    background-color: var(--COLOR_supportLight_100);
    overflow: hidden;
    transition: opacity 150ms ease-out
}

.ios .wdk-modalbox .modalboxContent {
    overflow: scroll;
    -webkit-overflow-scrolling: touch
}

.ios .wdk-modalbox .modalboxContent article {
    flex-grow: initial
}

@media only screen and (min-width: 768px) {
    .wdk-modalbox .modalboxContent {
        height:auto;
        max-height: 90vh;
        transition: transform .4s cubic-bezier(0.25, 0.8, 0.25, 1),opacity .4s cubic-bezier(0.25, 0.8, 0.25, 1);
        transform: scale(0.8) translateY(50%);
        will-change: transform;
        width: 100%;
        max-width: 560px;
        border-radius: var(--borderRadius_100)
    }
}

.wdk-modalbox .modalboxContent header h3 {
    display: inline-block;
    margin: 0;
    padding: 12px 8px 0 12px;
    font: var(--FONT_default_200);
    color: var(--COLOR_defaultText);
    width: calc(100% - 34px)
}

@media only screen and (min-width: 481px) {
    .wdk-modalbox .modalboxContent header h3 {
        padding:18px 8px 14px 20px
    }
}

.wdk-modalbox .modalboxContent article {
    position: relative;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: 12px;
    max-width: calc(100% - 34px);
    -webkit-overflow-scrolling: touch
}

@media only screen and (min-width: 481px) {
    .wdk-modalbox .modalboxContent article {
        padding:20px
    }
}

.wdk-modalbox .modalboxContent article p {
    margin: 0 0 16px 0
}

.wdk-modalbox .modalboxContent article p:last-child {
    margin: 0
}

.wdk-modalbox .modalboxContent header+article {
    max-width: 100%
}

@media only screen and (max-width: 767px) {
    .wdk-modalbox .modalboxContent header+footer {
        margin-top:24px
    }
}

.wdk-modalbox .modalboxContent footer {
    display: flex;
    width: 100%;
    min-height: 44px;
    padding: 8px 4px;
    align-items: center;
    justify-content: center;
    background-color: var(--COLOR_supportLight_100);
    flex-shrink: 0
}

@media only screen and (min-width: 481px) {
    .wdk-modalbox .modalboxContent footer {
        padding:20px 10px
    }
}

.wdk-modalbox .modalboxContent footer .buttonsContainer {
    width: 100%;
    display: flex;
    flex-flow: wrap;
    justify-content: space-between;
    margin: 0;
    padding: 0
}

.wdk-modalbox .modalboxContent footer .buttonsContainer .buttonItem {
    flex-basis: calc(40% - 20px);
    flex-grow: 1;
    list-style: none;
    text-align: center;
    vertical-align: top;
    margin: 2px 0;
    padding: 0 10px
}

.wdk-modalbox .modalboxContent footer .buttonsContainer .buttonItem .wdk-button {
    width: 100%
}

.wdk-modalbox .modalboxContent .layerInModalbox {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 11;
    justify-content: center;
    align-items: center;
    background-color: var(--COLOR_supportDark_050)
}

.wdk-modalbox .modalboxContent .layerInModalbox.is-open {
    display: flex
}

.wdk-modalbox .modalboxContent .layerInModalbox .layerContent {
    width: calc(100% - 32px);
    height: auto;
    background-color: var(--COLOR_supportLight_100);
    flex: none;
    text-align: left;
    border-radius: var(--borderRadius_100);
    box-shadow: var(--boxShadow_mid)
}

@media only screen and (min-width: 768px) {
    .wdk-modalbox .modalboxContent .layerInModalbox .layerContent {
        width:70%;
        overflow: hidden
    }
}

.wdk-modalbox .modalboxContent .layerInModalbox .layerContent footer {
    padding: 16px 16px 32px 16px;
    background-color: rgba(0,0,0,0)
}

.wdk-modalbox .wdk-button.closeX {
    position: absolute;
    top: 16px;
    right: 16px;
    z-index: 230
}

.wdk-modalbox .wdk-button.closeX.t-plainHighlightSkin4 {
    background-color: var(--COLOR_supportDark_600);
    padding: 0;
    border: 2px solid rgba(0,0,0,0);
    border-radius: 30px;
    height: 32px;
    width: 32px
}

.wdk-modalbox .wdk-button.closeX.t-plainHighlightSkin4 .icon {
    margin-right: 0
}

.wdk-modalbox .wdk-button.closeX.t-plainHighlightSkin4 .icon svg {
    width: 14px;
    height: 14px;
    fill: var(--COLOR_supportDark_400)
}

.wdk-modalbox.is-opaque.is-open>.wdk-button.closeX {
    display: block
}

.wdk-modalbox.is-opaque>.wdk-button.closeX {
    display: none;
    position: fixed;
    top: 12px;
    right: 12px;
    color: #fff
}

.wdk-modalbox.is-opaque>.wdk-button.closeX.t-plainHighlightSkin4 {
    background-color: rgba(0,0,0,0)
}

@media only screen and (min-width: 768px) {
    .wdk-modalbox.is-opaque>.wdk-button.closeX {
        top:20px;
        right: 20px
    }
}

.wdk-modalbox.is-opaque>.wdk-button.closeX .icon {
    margin-right: 0
}

.wdk-modalbox.is-opaque>.wdk-button.closeX .icon .wdk-icon.icon_x {
    fill: var(--COLOR_supportLight_100);
    width: 32px;
    height: 32px
}

.wdk-modalbox.is-opaque.is-open div.modalboxContent {
    background-color: rgba(0,0,0,0);
    color: var(--COLOR_supportLight_100)
}

@media only screen and (max-width: 767px) {
    .wdk-modalbox.is-opaque.is-open div.modalboxContent {
        max-height:calc(100% - 62px);
        margin-top: 50px;
        margin-bottom: 12px
    }
}

.wdk-modalbox.is-opaque footer {
    background-color: rgba(0,0,0,0)
}

.wdk-modalbox.skipIntroAnimation.is-open::before {
    transition: none;
    transform: none
}

.wdk-modalbox.skipIntroAnimation.transition-in .modalboxContent {
    transition: none;
    transform: none
}

.wdk-modalbox.skipOutroAnimation.is-open::before {
    transition: none;
    transform: none
}

.wdk-modalbox.skipOutroAnimation.transition-out .modalboxContent {
    transition: none;
    transform: none
}

.formGroupText {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-bottom: 20px
}

.formGroupText .wdk-form-text {
    padding-bottom: 0
}

.formGroupText label {
    display: flex;
    align-items: center;
    width: 100%;
    font: var(--FONT_default_75);
    color: var(--COLOR_supportDark_100);
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 6px;
    padding-right: 20px
}

@media only screen and (min-width: 481px) {
    .formGroupText label {
        white-space:nowrap
    }
}

.formGroupText label .mandatory {
    margin-right: 4px;
    position: relative;
    vertical-align: unset;
    top: 0;
    font: var(--FONT_default_100);
    align-self: flex-start;
    line-height: 17px
}

.formGroupText label.t-icon::before {
    float: left;
    margin-top: 3px;
    margin-right: 3px
}

.formGroupText .infoText {
    display: block;
    width: 100%;
    padding: 4px 0;
    font: var(--FONT_default_75);
    color: var(--COLOR_alertInfo_100)
}

.wdk-form-text {
    position: relative;
    display: block;
    padding-bottom: 20px
}

.wdk-form-text .designWrapper {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-touch-callout: none;
    display: flex;
    flex-wrap: wrap;
    -webkit-user-select: none;
    user-select: none;
    position: relative;
    text-align: left;
    width: 100%
}

.wdk-form-text .designWrapper .infoLink {
    position: absolute;
    display: block;
    top: -4px;
    right: 0;
    font-size: 20px;
    color: var(--COLOR_alertInfo_100);
    z-index: 1;
    text-decoration: none
}

.wdk-form-text .designWrapper .infoLink+label {
    padding-right: 24px
}

.no-touchevents .wdk-form-text .designWrapper .infoLink:hover {
    text-decoration: none
}

.wdk-form-text .designWrapper .infoLink::before {
    width: 18px;
    height: 18px
}

.wdk-form-text label {
    display: flex;
    align-items: center;
    width: 100%;
    font: var(--FONT_default_75);
    color: var(--COLOR_supportDark_100);
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 6px;
    padding-right: 20px
}

@media only screen and (min-width: 481px) {
    .wdk-form-text label {
        white-space:nowrap
    }
}

.wdk-form-text label .mandatory {
    margin-right: 4px;
    position: relative;
    vertical-align: unset;
    top: 0;
    font: var(--FONT_default_100);
    align-self: flex-start;
    line-height: 17px
}

.wdk-form-text label.t-icon::before {
    float: left;
    margin-right: 4px
}

.wdk-form-text label.t-icon .wdk-icon {
    width: 14px;
    height: 14px;
    margin-right: 4px
}

.wdk-form-text .inputWrapper {
    position: relative;
    width: 100%
}

.wdk-form-text .inputWrapper textarea,.wdk-form-text .inputWrapper input {
    position: relative;
    display: block;
    width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 0 8px;
    border: 2px solid var(--COLOR_supportDark_070);
    border-radius: var(--borderRadius_75);
    appearance: none;
    background: var(--COLOR_supportLight_100);
    font: var(--FONT_default_100);
    color: var(--COLOR_supportDark_100);
    transition: border-color .2s
}

.wdk-form-text .inputWrapper textarea:focus-visible,.wdk-form-text .inputWrapper input:focus-visible {
    border-color: var(--COLOR_supportDark_090)
}

.wdk-form-text .inputWrapper textarea::placeholder,.wdk-form-text .inputWrapper input::placeholder {
    color: var(--COLOR_supportDark_400)
}

.wdk-form-text .inputWrapper textarea[disabled],.wdk-form-text .inputWrapper textarea[readonly],.wdk-form-text .inputWrapper input[disabled],.wdk-form-text .inputWrapper input[readonly] {
    color: var(--COLOR_supportDark_050);
    border-color: var(--COLOR_supportDark_050)
}

.wdk-form-text .inputWrapper textarea[type=number],.wdk-form-text .inputWrapper input[type=number] {
    appearance: textfield
}

.wdk-form-text .inputWrapper.t-icon .wdk-icon {
    position: absolute;
    top: 0;
    display: block;
    margin-top: 10px;
    margin-left: 12px;
    width: 22px;
    height: 22px;
    z-index: 1;
    transition: color .3s;
    pointer-events: none;
    fill: var(--COLOR_defaultText)
}

.wdk-form-text .inputWrapper.t-icon input {
    padding-left: 44px
}

.wdk-form-text .inputWrapper textarea {
    line-height: 24px;
    padding: 9px 10px;
    resize: none;
    word-wrap: break-word;
    min-height: 166px;
    height: 100%
}

.ios .wdk-form-text .inputWrapper textarea {
    overflow: scroll
}

@media only screen and (min-width: 768px) {
    .ios .wdk-form-text .inputWrapper textarea {
        min-height:200px
    }
}

.wdk-form-text .inputWrapper .limitReachedInfo {
    top: 0;
    left: -2px;
    width: 1px;
    height: 1px;
    position: absolute;
    overflow: hidden
}

.wdk-form-text .inputWrapper .charCounter {
    display: none
}

.wdk-form-text .infoText {
    display: block;
    width: 100%;
    padding: 4px 8px;
    font: var(--FONT_default_75);
    color: var(--COLOR_alertInfo_100)
}

.wdk-form-text wdk-approval-tag {
    margin-top: 8px
}

.wdk-form-text.has-error input,.wdk-form-text.has-error textarea,.wdk-form-text:has(wdk-hintbox-error[show]) input,.wdk-form-text:has(wdk-hintbox-error[show]) textarea {
    border-color: var(--COLOR_alertError_100)
}

.wdk-form-text.has-hiddenLabel label {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px
}

.wdk-form-text.has-fullHeight {
    flex-grow: 1
}

.wdk-form-text.has-fullHeight .designWrapper {
    display: flex;
    flex-flow: column;
    height: 100%
}

.wdk-form-text.has-fullHeight label,.wdk-form-text.has-fullHeight .wdk-styledHintBox {
    flex-shrink: 0
}

.wdk-form-text.has-fullHeight .inputWrapper {
    flex-grow: 1
}

.wdk-form-text.is-nearLimit input,.wdk-form-text.is-nearLimit textarea {
    padding-right: 58px
}

.wdk-form-text.is-nearLimit .charCounter {
    position: absolute;
    bottom: 2px;
    right: 2px;
    height: 40px;
    padding: 0 12px 0 24px;
    display: flex;
    align-items: center;
    color: var(--COLOR_alertSuccess_100);
    font: var(--FONT_default_75)
}

.wdk-form-text.is-limitReached .charCounter {
    color: var(--COLOR_alertError_100)
}

.wdk-form-toggles {
    position: relative
}

.wdk-form-toggles input[type=checkbox],.wdk-form-toggles input[type=radio] {
    position: absolute;
    opacity: 0
}

.wdk-form-toggles input[type=checkbox]+label,.wdk-form-toggles input[type=radio]+label {
    position: relative;
    display: inline-block;
    min-height: 48px;
    margin-left: -14px;
    padding-left: 48px;
    padding-top: 17px;
    cursor: pointer
}

.wdk-form-toggles input[type=checkbox]+label::before,.wdk-form-toggles input[type=radio]+label::before {
    content: "";
    position: absolute;
    left: 14px;
    top: 17px;
    width: 20px;
    height: 20px;
    background-color: var(--COLOR_supportLight_100);
    transition: border .15s linear;
    border: 2px solid var(--COLOR_supportDark_080)
}

.wdk-form-toggles input[type=checkbox]+label::after,.wdk-form-toggles input[type=radio]+label::after {
    content: "";
    position: absolute;
    background-color: var(--COLOR_alertSuccess_100);
    opacity: 0;
    transition: all .15s linear
}

.wdk-form-toggles input[type=checkbox]:checked+label::before,.wdk-form-toggles input[type=radio]:checked+label::before {
    border-color: var(--COLOR_alertSuccess_100)
}

.wdk-form-toggles input[type=checkbox]:checked+label::after,.wdk-form-toggles input[type=radio]:checked+label::after {
    opacity: 1
}

.wdk-form-toggles input[type=checkbox]:disabled+label,.wdk-form-toggles input[type=radio]:disabled+label {
    color: var(--COLOR_supportDark_070);
    cursor: default
}

.wdk-form-toggles input[type=checkbox]:disabled+label::before,.wdk-form-toggles input[type=radio]:disabled+label::before {
    border-color: var(--COLOR_supportDark_070)
}

.wdk-form-toggles input[type=checkbox]:disabled+label::after,.wdk-form-toggles input[type=radio]:disabled+label::after {
    background-color: var(--COLOR_supportDark_040)
}

.wdk-form-toggles input[type=checkbox]:focus-visible+label::before,.wdk-form-toggles input[type=radio]:focus-visible+label::before {
    outline: 2px dashed currentcolor;
    outline-offset: 2px;
    outline-offset: 1px
}

.wdk-form-toggles input[type=radio] {
    top: 17px;
    left: 4px
}

.wdk-form-toggles input[type=radio]+label::before {
    top: 17px;
    border-radius: 10px
}

.wdk-form-toggles input[type=radio]+label::after {
    top: 22px;
    left: 19px;
    width: 10px;
    height: 10px;
    border-radius: var(--borderRadius_circle)
}

.wdk-form-toggles input[type=radio]:checked:disabled+label::after {
    background-color: var(--COLOR_supportDark_100);
    opacity: .2
}

.wdk-form-toggles input[type=checkbox] {
    top: 20px;
    left: 4px
}

.wdk-form-toggles input[type=checkbox]+label::before {
    border-radius: 4px
}

.wdk-form-toggles input[type=checkbox]+label::after {
    content: "";
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    display: inline-block;
    color: inherit;
    background-color: currentcolor;
    -webkit-mask-image: url(../../img/icons/single_color/icon_check.svg);
    mask-image: url(../../img/icons/single_color/icon_check.svg);
    vertical-align: -3px;
    width: 18px;
    height: 18px;
    top: 18px;
    left: 15px;
    background-color: var(--COLOR_supportLight_100);
    padding-top: 1px
}

.wdk-form-toggles input[type=checkbox]:checked+label::before {
    background-color: var(--COLOR_alertSuccess_100)
}

.wdk-form-toggles input[type=checkbox]:checked:disabled+label::before {
    border: 0;
    background-color: var(--COLOR_supportDark_070)
}

.wdk-form-toggles input[type=checkbox]:checked:disabled+label::after {
    background-color: var(--COLOR_supportLight_100)
}

.wdk-form-toggles input[type=checkbox].switch {
    position: absolute;
    opacity: 0;
    top: 24px;
    left: 27px
}

.wdk-form-toggles input[type=checkbox].switch+label {
    margin-left: 0;
    padding-top: 12px;
    outline: none;
    -webkit-user-select: none;
    user-select: none
}

.wdk-form-toggles input[type=checkbox].switch+label::before {
    padding: 2px;
    width: 36px;
    height: 14px;
    left: 6px;
    top: 20px;
    background: var(--COLOR_supportDark_100);
    opacity: .5;
    border: 0;
    transition: all .3s;
    border-radius: 14px
}

.wdk-form-toggles input[type=checkbox].switch+label::after {
    -webkit-mask-image: none;
    mask-image: none;
    content: "";
    top: 17px;
    left: 3px;
    height: 20px;
    width: 20px;
    background-color: var(--COLOR_supportLight_100);
    border: 1px solid var(--COLOR_supportDark_090);
    opacity: 1;
    border-radius: 14px;
    transition: all .4s cubic-bezier(0.4, 0, 0.2, 1)
}

.wdk-form-toggles input[type=checkbox].switch:checked+label::before {
    background-color: var(--COLOR_alertSuccess_100)
}

.wdk-form-toggles input[type=checkbox].switch:checked+label::after {
    margin-left: 22px;
    background-color: var(--COLOR_alertSuccess_100);
    border-color: var(--COLOR_alertSuccess_100)
}

.wdk-form-toggles input[type=checkbox].switch:disabled+label::after {
    background-color: var(--COLOR_supportDark_600);
    border-color: var(--COLOR_supportDark_050)
}

.wdk-form-toggles input[type=checkbox].switch:checked:disabled+label::before {
    background-color: var(--COLOR_alertSuccess_100);
    opacity: .25
}

.wdk-form-toggles input[type=checkbox].switch:checked:disabled+label::after {
    border-color: var(--COLOR_alertSuccess_100)
}

.wdk-button {
    position: relative;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    font: var(--FONT_highlight_100);
    white-space: nowrap;
    cursor: pointer;
    text-decoration: none;
    opacity: 1;
    transition: opacity .3s .1s,background-color .2s,box-shadow .2s linear;
    box-shadow: var(--boxShadow_mid);
    height: 48px;
    border: 2px solid rgba(0,0,0,0);
    background: var(--COLOR_supportDark_080);
    background-origin: border-box;
    border-radius: var(--borderRadius_button);
    color: var(--COLOR_supportLight_100)
}

.wdk-button::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 48px;
    margin-top: -2px
}

.wdk-button.hover,.wdk-button:hover {
    text-decoration: none
}

.wdk-button:active,.wdk-button.active {
    transition-duration: 0s;
    box-shadow: var(--boxShadow_small)
}

.wdk-button:disabled,.wdk-button:disabled:hover,.wdk-button:disabled:active,.wdk-button.disabled,.wdk-button.disabled:hover,.wdk-button.disabled:active {
    cursor: default;
    pointer-events: none;
    opacity: .4
}

html:not(.ios,.macSafari) .wdk-button:disabled,html:not(.ios,.macSafari) .wdk-button:disabled:hover,html:not(.ios,.macSafari) .wdk-button:disabled:active,html:not(.ios,.macSafari) .wdk-button.disabled,html:not(.ios,.macSafari) .wdk-button.disabled:hover,html:not(.ios,.macSafari) .wdk-button.disabled:active {
    box-shadow: none
}

.wdk-button:focus-visible {
    outline: 2px dashed currentcolor;
    outline-offset: 2px
}

.wdk-button .icon {
    display: flex;
    margin-right: 8px
}

.wdk-button .icon svg,.wdk-button .icon img {
    width: 18px;
    height: 18px
}

.wdk-button.t-rightIcon {
    flex-direction: row-reverse
}

.wdk-button.t-rightIcon .icon {
    margin-left: 8px;
    margin-right: 0
}

.wdk-button.t-iconOnly {
    width: 48px;
    height: 48px;
    padding: 0
}

.wdk-button.t-iconOnly.is-loading .icon {
    opacity: 0
}

.wdk-button.t-iconOnly.t-size_auto {
    height: auto;
    width: auto
}

.wdk-button.t-iconOnly.t-size_auto::after {
    height: calc(100% + 16px);
    width: calc(100% + 16px);
    inset: -8px 8px 8px -8px
}

.wdk-button.t-iconOnly.t-size_auto .icon svg,.wdk-button.t-iconOnly.t-size_auto .icon img {
    width: 20px;
    height: 20px
}

.wdk-button.t-iconOnly.t-size_50 {
    height: 32px;
    width: 32px
}

.wdk-button.t-iconOnly.t-size_50::after {
    height: 48px;
    width: 48px;
    margin-top: -10px;
    margin-left: -10px
}

.wdk-button.t-iconOnly.t-size_50 .icon svg,.wdk-button.t-iconOnly.t-size_50 .icon img {
    width: 20px;
    height: 20px
}

.wdk-button.t-iconOnly.t-size_75 {
    height: 36px;
    width: 36px
}

.wdk-button.t-iconOnly.t-size_75::after {
    height: 48px;
    width: 48px;
    margin-top: -10px;
    margin-left: -10px
}

.wdk-button.t-iconOnly.t-size_75 .icon svg,.wdk-button.t-iconOnly.t-size_75 .icon img {
    width: 20px;
    height: 20px
}

.wdk-button.t-iconOnly.t-size_200 {
    height: 56px;
    width: 56px
}

.wdk-button.t-iconOnly.t-size_200::after {
    display: none
}

.wdk-button.t-iconOnly.t-size_200 .icon svg,.wdk-button.t-iconOnly.t-size_200 .icon img {
    width: 32px;
    height: 32px
}

.wdk-button.t-iconOnly .text {
    position: absolute !important;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%)
}

.wdk-button.t-iconOnly .icon {
    margin: 0
}

.wdk-button.t-iconOnly .icon svg,.wdk-button.t-iconOnly .icon img {
    width: 24px;
    height: 24px
}

@media only screen and (max-width: 767px) {
    .wdk-button.t-iconOnlyInSM {
        padding:0 8px
    }

    .wdk-button.t-iconOnlyInSM.is-loading .wdk-icon {
        opacity: 0
    }

    .wdk-button.t-iconOnlyInSM .icon svg,.wdk-button.t-iconOnlyInSM .icon img {
        width: 24px;
        height: 24px
    }

    .wdk-button.t-iconOnlyInSM .text {
        position: absolute !important;
        left: -10000px;
        top: auto;
        width: 1px;
        height: 1px;
        overflow: hidden;
        clip: rect(0 0 0 0);
        clip-path: inset(50%)
    }

    .wdk-button.t-iconOnlyInSM .trippleDot::before {
        left: -12px
    }

    .wdk-button.t-iconOnlyInSM .trippleDot::after {
        left: 12px
    }
}

.wdk-button.t-bubbleTopLeft {
    border-top-left-radius: 0
}

.wdk-button.t-bubbleTopRight {
    border-top-right-radius: 0
}

.wdk-button.t-primarySkin1 {
    background-color: var(--COLOR_primary_100);
    color: var(--COLOR_supportLight_100)
}

@media(hover: hover) {
    .wdk-button.t-primarySkin1:hover,.wdk-button.t-primarySkin1.hover {
        background-color:#588169
    }
}

.wdk-button.t-primarySkin1:active,.wdk-button.t-primarySkin1.active {
    background-color: #346145
}

.wdk-button.t-primarySkin1.disabled,.wdk-button.t-primarySkin1.disabled:hover,.wdk-button.t-primarySkin1.disabled:active,.wdk-button.t-primarySkin1.disabled.active,.wdk-button.t-primarySkin1:disabled,.wdk-button.t-primarySkin1:disabled:hover,.wdk-button.t-primarySkin1:disabled:active,.wdk-button.t-primarySkin1:disabled.active {
    opacity: .3
}

.wdk-button.t-primarySkin1:focus-visible {
    outline-color: var(--COLOR_primary_100)
}

.wdk-button.t-primarySkin1 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-primarySkin1.t-circle .text {
    color: var(--COLOR_supportDark_300)
}

.wdk-button.t-primarySkin2 {
    background-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_primary_100)
}

@media(hover: hover) {
    .wdk-button.t-primarySkin2:hover,.wdk-button.t-primarySkin2.hover {
        opacity:.8;
        background-color: var(--COLOR_supportDark_600)
    }
}

.wdk-button.t-primarySkin2:active,.wdk-button.t-primarySkin2.active {
    opacity: .6;
    background-color: var(--COLOR_supportDark_600)
}

.wdk-button.t-primarySkin2.disabled,.wdk-button.t-primarySkin2.disabled:hover,.wdk-button.t-primarySkin2.disabled:active,.wdk-button.t-primarySkin2.disabled.active,.wdk-button.t-primarySkin2:disabled,.wdk-button.t-primarySkin2:disabled:hover,.wdk-button.t-primarySkin2:disabled:active,.wdk-button.t-primarySkin2:disabled.active {
    opacity: .4
}

.wdk-button.t-primarySkin2:focus-visible {
    outline-color: var(--COLOR_supportDark_100)
}

.wdk-button.t-primarySkin2 .icon svg {
    fill: var(--COLOR_primary_100)
}

.wdk-button.t-primarySkin3 {
    background-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_supportDark_100)
}

@media(hover: hover) {
    .wdk-button.t-primarySkin3:hover,.wdk-button.t-primarySkin3.hover {
        opacity:.8;
        background-color: var(--COLOR_supportDark_600)
    }
}

.wdk-button.t-primarySkin3:active,.wdk-button.t-primarySkin3.active {
    opacity: .6;
    background-color: var(--COLOR_supportDark_600)
}

.wdk-button.t-primarySkin3.disabled,.wdk-button.t-primarySkin3.disabled:hover,.wdk-button.t-primarySkin3.disabled:active,.wdk-button.t-primarySkin3.disabled.active,.wdk-button.t-primarySkin3:disabled,.wdk-button.t-primarySkin3:disabled:hover,.wdk-button.t-primarySkin3:disabled:active,.wdk-button.t-primarySkin3:disabled.active {
    opacity: .4
}

.wdk-button.t-primarySkin3 .icon svg {
    fill: var(--COLOR_supportDark_100)
}

.wdk-button.t-primarySkin4 {
    background-color: var(--COLOR_supportDark_080);
    color: var(--COLOR_supportLight_100);
    box-shadow: none
}

@media(hover: hover) {
    .wdk-button.t-primarySkin4:hover,.wdk-button.t-primarySkin4.hover {
        background-color:var(--COLOR_supportDark_090)
    }
}

.wdk-button.t-primarySkin4:focus-visible {
    outline-color: var(--COLOR_defaultText)
}

.wdk-button.t-primarySkin4:active,.wdk-button.t-primarySkin4.active {
    background-color: var(--COLOR_supportDark_100)
}

.wdk-button.t-primarySkin4.disabled,.wdk-button.t-primarySkin4.disabled:hover,.wdk-button.t-primarySkin4.disabled:active,.wdk-button.t-primarySkin4.disabled.active,.wdk-button.t-primarySkin4:disabled,.wdk-button.t-primarySkin4:disabled:hover,.wdk-button.t-primarySkin4:disabled:active,.wdk-button.t-primarySkin4:disabled.active {
    opacity: .4
}

.wdk-button.t-primarySkin4 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-primarySkin5 {
    background-color: var(--COLOR_supportLight_050);
    color: var(--COLOR_supportLight_100);
    border: 0 none;
    box-shadow: none;
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
    font: var(--FONT_default_100)
}

.wdk-button.t-primarySkin5::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
    border-radius: var(--borderRadius_button);
    border: 1px solid var(--COLOR_supportLight_080);
    mix-blend-mode: soft-light;
    pointer-events: none
}

@media(hover: hover) {
    .wdk-button.t-primarySkin5:hover,.wdk-button.t-primarySkin5.hover {
        background-color:var(--COLOR_supportLight_060)
    }
}

.wdk-button.t-primarySkin5:focus-visible {
    outline-color: var(--COLOR_defaultText)
}

.wdk-button.t-primarySkin5:active,.wdk-button.t-primarySkin5.active {
    border: 0 none;
    background-color: var(--COLOR_supportLight_040);
    color: var(--COLOR_supportLight_070)
}

.wdk-button.t-primarySkin5:active::before,.wdk-button.t-primarySkin5.active::before {
    border-color: var(--COLOR_supportLight_050)
}

.wdk-button.t-primarySkin5:active .icon svg,.wdk-button.t-primarySkin5.active .icon svg {
    fill: var(--COLOR_supportLight_070)
}

.wdk-button.t-primarySkin5.disabled,.wdk-button.t-primarySkin5.disabled:hover,.wdk-button.t-primarySkin5.disabled:active,.wdk-button.t-primarySkin5.disabled.active,.wdk-button.t-primarySkin5:disabled,.wdk-button.t-primarySkin5:disabled:hover,.wdk-button.t-primarySkin5:disabled:active,.wdk-button.t-primarySkin5:disabled.active {
    background-color: var(--COLOR_supportLight_040);
    color: var(--COLOR_supportLight_060);
    border: 0 none;
    opacity: 1
}

.wdk-button.t-primarySkin5.disabled::before,.wdk-button.t-primarySkin5.disabled:hover::before,.wdk-button.t-primarySkin5.disabled:active::before,.wdk-button.t-primarySkin5.disabled.active::before,.wdk-button.t-primarySkin5:disabled::before,.wdk-button.t-primarySkin5:disabled:hover::before,.wdk-button.t-primarySkin5:disabled:active::before,.wdk-button.t-primarySkin5:disabled.active::before {
    border-color: var(--COLOR_supportLight_060)
}

.wdk-button.t-primarySkin5.disabled .icon svg,.wdk-button.t-primarySkin5.disabled:hover .icon svg,.wdk-button.t-primarySkin5.disabled:active .icon svg,.wdk-button.t-primarySkin5.disabled.active .icon svg,.wdk-button.t-primarySkin5:disabled .icon svg,.wdk-button.t-primarySkin5:disabled:hover .icon svg,.wdk-button.t-primarySkin5:disabled:active .icon svg,.wdk-button.t-primarySkin5:disabled.active .icon svg {
    fill: var(--COLOR_supportLight_070)
}

.wdk-button.t-primarySkin5 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-primarySpecialSkin1 {
    background-image: var(--COLOR_gradient_unlock_100_45);
    color: var(--COLOR_supportLight_100)
}

@media(hover: hover) {
    .wdk-button.t-primarySpecialSkin1:hover,.wdk-button.t-primarySpecialSkin1.hover {
        background-image:var(--COLOR_gradient_unlock_100_180)
    }
}

.wdk-button.t-primarySpecialSkin1:active,.wdk-button.t-primarySpecialSkin1.active {
    background-image: var(--COLOR_gradient_unlock_100_90)
}

.wdk-button.t-primarySpecialSkin1.disabled,.wdk-button.t-primarySpecialSkin1.disabled:hover,.wdk-button.t-primarySpecialSkin1.disabled:active,.wdk-button.t-primarySpecialSkin1.disabled.active,.wdk-button.t-primarySpecialSkin1:disabled,.wdk-button.t-primarySpecialSkin1:disabled:hover,.wdk-button.t-primarySpecialSkin1:disabled:active,.wdk-button.t-primarySpecialSkin1:disabled.active {
    opacity: .3
}

.wdk-button.t-primarySpecialSkin1:focus-visible {
    outline-color: var(--COLOR_primary_100)
}

.wdk-button.t-primarySpecialSkin1 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-primarySpecialSkin1.t-circle .text {
    color: var(--COLOR_supportDark_300)
}

.wdk-button.t-primarySpecialSkin2 {
    background-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_supportDark_100)
}

@media(hover: hover) {
    .wdk-button.t-primarySpecialSkin2:hover,.wdk-button.t-primarySpecialSkin2.hover {
        opacity:.7
    }
}

.wdk-button.t-primarySpecialSkin2:active,.wdk-button.t-primarySpecialSkin2.active {
    opacity: .6
}

.wdk-button.t-primarySpecialSkin2.disabled,.wdk-button.t-primarySpecialSkin2.disabled:hover,.wdk-button.t-primarySpecialSkin2.disabled:active,.wdk-button.t-primarySpecialSkin2.disabled.active,.wdk-button.t-primarySpecialSkin2:disabled,.wdk-button.t-primarySpecialSkin2:disabled:hover,.wdk-button.t-primarySpecialSkin2:disabled:active,.wdk-button.t-primarySpecialSkin2:disabled.active {
    opacity: .3
}

.wdk-button.t-primarySpecialSkin2:focus-visible {
    outline-color: var(--COLOR_primary_100)
}

.wdk-button.t-primarySpecialSkin2 .icon::before {
    background-image: var(--COLOR_gradient_unlock_100_45)
}

.wdk-button.t-primarySpecialSkin2 .text {
    background: var(--COLOR_supportDark_100);
    background-image: var(--COLOR_gradient_unlock_100_45);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: rgba(0,0,0,0)
}

.wdk-button.t-primarySpecialSkin2.t-circle .text {
    color: var(--COLOR_supportDark_300)
}

.wdk-button.t-outlineSkin1 {
    border-width: 1px;
    border-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_supportLight_100);
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-outlineSkin1:hover,.wdk-button.t-outlineSkin1.hover {
        background-color:color-mix(in srgb, var(--COLOR_supportLight_100), transparent 92%)
    }
}

.wdk-button.t-outlineSkin1:active,.wdk-button.t-outlineSkin1.active {
    background-color: color-mix(in srgb, var(--COLOR_supportLight_100), transparent 84%)
}

.wdk-button.t-outlineSkin1.disabled,.wdk-button.t-outlineSkin1.disabled:hover,.wdk-button.t-outlineSkin1.disabled:active,.wdk-button.t-outlineSkin1.disabled.active,.wdk-button.t-outlineSkin1:disabled,.wdk-button.t-outlineSkin1:disabled:hover,.wdk-button.t-outlineSkin1:disabled:active,.wdk-button.t-outlineSkin1:disabled.active {
    opacity: .5
}

.wdk-button.t-outlineSkin1 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-outlineSkin2 {
    border-width: 1px;
    border-color: var(--COLOR_supportDark_080);
    color: var(--COLOR_supportDark_100);
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-outlineSkin2:hover,.wdk-button.t-outlineSkin2.hover {
        background-color:color-mix(in srgb, var(--COLOR_supportDark_100), transparent 92%)
    }
}

.wdk-button.t-outlineSkin2:active,.wdk-button.t-outlineSkin2.active {
    background-color: color-mix(in srgb, var(--COLOR_supportDark_100), transparent 84%)
}

.wdk-button.t-outlineSkin2.disabled,.wdk-button.t-outlineSkin2.disabled:hover,.wdk-button.t-outlineSkin2.disabled:active,.wdk-button.t-outlineSkin2.disabled.active,.wdk-button.t-outlineSkin2:disabled,.wdk-button.t-outlineSkin2:disabled:hover,.wdk-button.t-outlineSkin2:disabled:active,.wdk-button.t-outlineSkin2:disabled.active {
    opacity: .5
}

.wdk-button.t-outlineSkin2 .icon svg {
    fill: var(--COLOR_supportDark_100)
}

.wdk-button.t-outlineSkin3 {
    border-width: 1px;
    border-color: var(--COLOR_primary_100);
    color: var(--COLOR_primary_100);
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-outlineSkin3:hover,.wdk-button.t-outlineSkin3.hover {
        background-color:color-mix(in srgb, var(--COLOR_primary_100), transparent 92%)
    }
}

.wdk-button.t-outlineSkin3:active,.wdk-button.t-outlineSkin3.active {
    background-color: color-mix(in srgb, var(--COLOR_primary_100), transparent 84%)
}

.wdk-button.t-outlineSkin3.disabled,.wdk-button.t-outlineSkin3.disabled:hover,.wdk-button.t-outlineSkin3.disabled:active,.wdk-button.t-outlineSkin3.disabled.active,.wdk-button.t-outlineSkin3:disabled,.wdk-button.t-outlineSkin3:disabled:hover,.wdk-button.t-outlineSkin3:disabled:active,.wdk-button.t-outlineSkin3:disabled.active {
    opacity: .5
}

.wdk-button.t-outlineSkin3 .icon svg {
    fill: var(--COLOR_primary_100)
}

.wdk-button.t-outlineSkin4 {
    border-width: 1px;
    border-color: var(--COLOR_decoration_100);
    color: var(--COLOR_decoration_100);
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-outlineSkin4:hover,.wdk-button.t-outlineSkin4.hover {
        background-color:color-mix(in srgb, var(--COLOR_decoration_100), transparent 92%)
    }
}

.wdk-button.t-outlineSkin4:active,.wdk-button.t-outlineSkin4.active {
    background-color: color-mix(in srgb, var(--COLOR_decoration_100), transparent 84%)
}

.wdk-button.t-outlineSkin4.disabled,.wdk-button.t-outlineSkin4.disabled:hover,.wdk-button.t-outlineSkin4.disabled:active,.wdk-button.t-outlineSkin4.disabled.active,.wdk-button.t-outlineSkin4:disabled,.wdk-button.t-outlineSkin4:disabled:hover,.wdk-button.t-outlineSkin4:disabled:active,.wdk-button.t-outlineSkin4:disabled.active {
    opacity: .5
}

.wdk-button.t-outlineSkin4 .icon svg {
    fill: var(--COLOR_decoration_100)
}

.wdk-button.t-outlineSkin5 {
    border-width: 1px;
    border-color: var(--COLOR_decoration_200);
    color: var(--COLOR_decoration_200);
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-outlineSkin5:hover,.wdk-button.t-outlineSkin5.hover {
        background-color:color-mix(in srgb, var(--COLOR_decoration_200), transparent 92%)
    }
}

.wdk-button.t-outlineSkin5:active,.wdk-button.t-outlineSkin5.active {
    background-color: color-mix(in srgb, var(--COLOR_decoration_200), transparent 84%)
}

.wdk-button.t-outlineSkin5.disabled,.wdk-button.t-outlineSkin5.disabled:hover,.wdk-button.t-outlineSkin5.disabled:active,.wdk-button.t-outlineSkin5.disabled.active,.wdk-button.t-outlineSkin5:disabled,.wdk-button.t-outlineSkin5:disabled:hover,.wdk-button.t-outlineSkin5:disabled:active,.wdk-button.t-outlineSkin5:disabled.active {
    opacity: .5
}

.wdk-button.t-outlineSkin5 .icon svg {
    fill: var(--COLOR_decoration_200)
}

.wdk-button.t-outlineSkin6 {
    border-width: 1px;
    border-color: var(--COLOR_decoration_300);
    color: var(--COLOR_decoration_300);
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-outlineSkin6:hover,.wdk-button.t-outlineSkin6.hover {
        background-color:color-mix(in srgb, var(--COLOR_decoration_300), transparent 92%)
    }
}

.wdk-button.t-outlineSkin6:active,.wdk-button.t-outlineSkin6.active {
    background-color: color-mix(in srgb, var(--COLOR_decoration_300), transparent 84%)
}

.wdk-button.t-outlineSkin6.disabled,.wdk-button.t-outlineSkin6.disabled:hover,.wdk-button.t-outlineSkin6.disabled:active,.wdk-button.t-outlineSkin6.disabled.active,.wdk-button.t-outlineSkin6:disabled,.wdk-button.t-outlineSkin6:disabled:hover,.wdk-button.t-outlineSkin6:disabled:active,.wdk-button.t-outlineSkin6:disabled.active {
    opacity: .5
}

.wdk-button.t-outlineSkin6 .icon svg {
    fill: var(--COLOR_decoration_300)
}

.wdk-button.t-plainHighlightSkin1 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_primary_100);
    transition: none
}

@media(hover: hover) {
    .wdk-button.t-plainHighlightSkin1:hover,.wdk-button.t-plainHighlightSkin1.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainHighlightSkin1.t-size_50,.wdk-button.t-plainHighlightSkin1.t-size_75,.wdk-button.t-plainHighlightSkin1.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainHighlightSkin1.t-size_50,.wdk-button.t-plainHighlightSkin1.t-size_75 {
    font: var(--FONT_highlight_75)
}

.wdk-button.t-plainHighlightSkin1.t-size_200 {
    font: var(--FONT_highlight_100)
}

.wdk-button.t-plainHighlightSkin1:active,.wdk-button.t-plainHighlightSkin1.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainHighlightSkin1.disabled,.wdk-button.t-plainHighlightSkin1.disabled:hover,.wdk-button.t-plainHighlightSkin1.disabled:active,.wdk-button.t-plainHighlightSkin1.disabled.active,.wdk-button.t-plainHighlightSkin1:disabled,.wdk-button.t-plainHighlightSkin1:disabled:hover,.wdk-button.t-plainHighlightSkin1:disabled:active,.wdk-button.t-plainHighlightSkin1:disabled.active {
    opacity: .4
}

.wdk-button.t-plainHighlightSkin1 .icon svg {
    fill: var(--COLOR_primary_100)
}

.wdk-button.t-plainHighlightSkin2 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_supportLight_100);
    transition: none
}

@media(hover: hover) {
    .wdk-button.t-plainHighlightSkin2:hover,.wdk-button.t-plainHighlightSkin2.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainHighlightSkin2.t-size_50,.wdk-button.t-plainHighlightSkin2.t-size_75,.wdk-button.t-plainHighlightSkin2.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainHighlightSkin2.t-size_50,.wdk-button.t-plainHighlightSkin2.t-size_75 {
    font: var(--FONT_highlight_75)
}

.wdk-button.t-plainHighlightSkin2.t-size_200 {
    font: var(--FONT_highlight_100)
}

.wdk-button.t-plainHighlightSkin2:active,.wdk-button.t-plainHighlightSkin2.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainHighlightSkin2.disabled,.wdk-button.t-plainHighlightSkin2.disabled:hover,.wdk-button.t-plainHighlightSkin2.disabled:active,.wdk-button.t-plainHighlightSkin2.disabled.active,.wdk-button.t-plainHighlightSkin2:disabled,.wdk-button.t-plainHighlightSkin2:disabled:hover,.wdk-button.t-plainHighlightSkin2:disabled:active,.wdk-button.t-plainHighlightSkin2:disabled.active {
    opacity: .4
}

.wdk-button.t-plainHighlightSkin2 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-plainHighlightSkin3 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_supportDark_100);
    transition: none
}

@media(hover: hover) {
    .wdk-button.t-plainHighlightSkin3:hover,.wdk-button.t-plainHighlightSkin3.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainHighlightSkin3.t-size_50,.wdk-button.t-plainHighlightSkin3.t-size_75,.wdk-button.t-plainHighlightSkin3.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainHighlightSkin3.t-size_50,.wdk-button.t-plainHighlightSkin3.t-size_75 {
    font: var(--FONT_highlight_75)
}

.wdk-button.t-plainHighlightSkin3.t-size_200 {
    font: var(--FONT_highlight_100)
}

.wdk-button.t-plainHighlightSkin3:active,.wdk-button.t-plainHighlightSkin3.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainHighlightSkin3.disabled,.wdk-button.t-plainHighlightSkin3.disabled:hover,.wdk-button.t-plainHighlightSkin3.disabled:active,.wdk-button.t-plainHighlightSkin3.disabled.active,.wdk-button.t-plainHighlightSkin3:disabled,.wdk-button.t-plainHighlightSkin3:disabled:hover,.wdk-button.t-plainHighlightSkin3:disabled:active,.wdk-button.t-plainHighlightSkin3:disabled.active {
    opacity: .4
}

.wdk-button.t-plainHighlightSkin3 .icon svg {
    fill: var(--COLOR_supportDark_100)
}

.wdk-button.t-plainHighlightSkin4 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_supportDark_300);
    transition: none
}

@media(hover: hover) {
    .wdk-button.t-plainHighlightSkin4:hover,.wdk-button.t-plainHighlightSkin4.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainHighlightSkin4.t-size_50,.wdk-button.t-plainHighlightSkin4.t-size_75,.wdk-button.t-plainHighlightSkin4.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainHighlightSkin4.t-size_50,.wdk-button.t-plainHighlightSkin4.t-size_75 {
    font: var(--FONT_highlight_75)
}

.wdk-button.t-plainHighlightSkin4.t-size_200 {
    font: var(--FONT_highlight_100)
}

.wdk-button.t-plainHighlightSkin4:active,.wdk-button.t-plainHighlightSkin4.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainHighlightSkin4.disabled,.wdk-button.t-plainHighlightSkin4.disabled:hover,.wdk-button.t-plainHighlightSkin4.disabled:active,.wdk-button.t-plainHighlightSkin4.disabled.active,.wdk-button.t-plainHighlightSkin4:disabled,.wdk-button.t-plainHighlightSkin4:disabled:hover,.wdk-button.t-plainHighlightSkin4:disabled:active,.wdk-button.t-plainHighlightSkin4:disabled.active {
    opacity: .4
}

.wdk-button.t-plainHighlightSkin4 .icon svg {
    fill: var(--COLOR_supportDark_080)
}

.wdk-button.t-plainDefaultSkin1 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_primary_100);
    transition: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-plainDefaultSkin1:hover,.wdk-button.t-plainDefaultSkin1.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainDefaultSkin1.t-size_50,.wdk-button.t-plainDefaultSkin1.t-size_75,.wdk-button.t-plainDefaultSkin1.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainDefaultSkin1:active,.wdk-button.t-plainDefaultSkin1.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainDefaultSkin1.disabled,.wdk-button.t-plainDefaultSkin1.disabled:hover,.wdk-button.t-plainDefaultSkin1.disabled:active,.wdk-button.t-plainDefaultSkin1.disabled.active,.wdk-button.t-plainDefaultSkin1:disabled,.wdk-button.t-plainDefaultSkin1:disabled:hover,.wdk-button.t-plainDefaultSkin1:disabled:active,.wdk-button.t-plainDefaultSkin1:disabled.active {
    opacity: .4
}

.wdk-button.t-plainDefaultSkin1 .icon svg {
    fill: var(--COLOR_primary_100)
}

.wdk-button.t-plainDefaultSkin2 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_supportLight_100);
    transition: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-plainDefaultSkin2:hover,.wdk-button.t-plainDefaultSkin2.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainDefaultSkin2.t-size_50,.wdk-button.t-plainDefaultSkin2.t-size_75,.wdk-button.t-plainDefaultSkin2.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainDefaultSkin2:active,.wdk-button.t-plainDefaultSkin2.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainDefaultSkin2.disabled,.wdk-button.t-plainDefaultSkin2.disabled:hover,.wdk-button.t-plainDefaultSkin2.disabled:active,.wdk-button.t-plainDefaultSkin2.disabled.active,.wdk-button.t-plainDefaultSkin2:disabled,.wdk-button.t-plainDefaultSkin2:disabled:hover,.wdk-button.t-plainDefaultSkin2:disabled:active,.wdk-button.t-plainDefaultSkin2:disabled.active {
    opacity: .4
}

.wdk-button.t-plainDefaultSkin2 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-plainDefaultSkin3 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_supportDark_100);
    transition: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-plainDefaultSkin3:hover,.wdk-button.t-plainDefaultSkin3.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainDefaultSkin3.t-size_50,.wdk-button.t-plainDefaultSkin3.t-size_75,.wdk-button.t-plainDefaultSkin3.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainDefaultSkin3:active,.wdk-button.t-plainDefaultSkin3.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainDefaultSkin3.disabled,.wdk-button.t-plainDefaultSkin3.disabled:hover,.wdk-button.t-plainDefaultSkin3.disabled:active,.wdk-button.t-plainDefaultSkin3.disabled.active,.wdk-button.t-plainDefaultSkin3:disabled,.wdk-button.t-plainDefaultSkin3:disabled:hover,.wdk-button.t-plainDefaultSkin3:disabled:active,.wdk-button.t-plainDefaultSkin3:disabled.active {
    opacity: .4
}

.wdk-button.t-plainDefaultSkin3 .icon svg {
    fill: var(--COLOR_supportDark_100)
}

.wdk-button.t-plainDefaultSkin4 {
    padding: 0;
    border: none;
    border-radius: 0;
    background-color: rgba(0,0,0,0);
    box-shadow: none;
    color: var(--COLOR_supportDark_300);
    transition: none;
    font: var(--FONT_default_100)
}

@media(hover: hover) {
    .wdk-button.t-plainDefaultSkin4:hover,.wdk-button.t-plainDefaultSkin4.hover {
        opacity:.7;
        text-decoration: underline;
        text-underline-position: under
    }
}

.wdk-button.t-plainDefaultSkin4.t-size_50,.wdk-button.t-plainDefaultSkin4.t-size_75,.wdk-button.t-plainDefaultSkin4.t-size_200 {
    padding-inline:0}

.wdk-button.t-plainDefaultSkin4:active,.wdk-button.t-plainDefaultSkin4.active {
    opacity: .7;
    text-decoration: underline;
    text-underline-position: under
}

.wdk-button.t-plainDefaultSkin4.disabled,.wdk-button.t-plainDefaultSkin4.disabled:hover,.wdk-button.t-plainDefaultSkin4.disabled:active,.wdk-button.t-plainDefaultSkin4.disabled.active,.wdk-button.t-plainDefaultSkin4:disabled,.wdk-button.t-plainDefaultSkin4:disabled:hover,.wdk-button.t-plainDefaultSkin4:disabled:active,.wdk-button.t-plainDefaultSkin4:disabled.active {
    opacity: .4
}

.wdk-button.t-plainDefaultSkin4 .icon svg {
    fill: var(--COLOR_supportDark_080)
}

.wdk-button.t-premiumSkin1 {
    border: none;
    background-image: var(--COLOR_gradient_premium_100_45);
    background-position: 0;
    background-size: cover;
    color: var(--COLOR_supportLight_100)
}

.wdk-button.t-premiumSkin1::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 48px;
    border-radius: var(--borderRadius_button)
}

@media(hover: hover) {
    .wdk-button.t-premiumSkin1:hover::before,.wdk-button.t-premiumSkin1.hover::before {
        box-shadow:inset 0 0 0 1000px var(--COLOR_supportLight_050)
    }
}

.wdk-button.t-premiumSkin1:active::before,.wdk-button.t-premiumSkin1.active::before {
    box-shadow: inset 0 0 0 1000px color-mix(in srgb, var(--COLOR_supportDark_100), transparent 80%) !important
}

.wdk-button.t-premiumSkin1.disabled,.wdk-button.t-premiumSkin1.disabled:hover,.wdk-button.t-premiumSkin1.disabled:active,.wdk-button.t-premiumSkin1.disabled.active,.wdk-button.t-premiumSkin1:disabled,.wdk-button.t-premiumSkin1:disabled:hover,.wdk-button.t-premiumSkin1:disabled:active,.wdk-button.t-premiumSkin1:disabled.active {
    opacity: .9
}

.wdk-button.t-premiumSkin1:focus-visible {
    outline-color: var(--COLOR_premium_100)
}

.wdk-button.t-premiumSkin1.t-size_50::before {
    height: 32px
}

.wdk-button.t-premiumSkin1.t-size_75::before {
    height: 36px
}

.wdk-button.t-premiumSkin1.t-size_200::before {
    height: 60px
}

.wdk-button.t-premiumSkin1 .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-premiumSkin1 .text {
    position: relative
}

.wdk-button.t-premiumSkin2 {
    border: none;
    background-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_supportLight_100)
}

.wdk-button.t-premiumSkin2::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 48px;
    border-radius: var(--borderRadius_button)
}

@media(hover: hover) {
    .wdk-button.t-premiumSkin2:hover::before,.wdk-button.t-premiumSkin2.hover::before {
        box-shadow:inset 0 0 0 1000px var(--COLOR_supportLight_050)
    }
}

.wdk-button.t-premiumSkin2:active::before,.wdk-button.t-premiumSkin2.active::before {
    box-shadow: inset 0 0 0 1000px color-mix(in srgb, var(--COLOR_supportDark_100), transparent 80%) !important
}

.wdk-button.t-premiumSkin2.disabled,.wdk-button.t-premiumSkin2.disabled:hover,.wdk-button.t-premiumSkin2.disabled:active,.wdk-button.t-premiumSkin2.disabled.active,.wdk-button.t-premiumSkin2:disabled,.wdk-button.t-premiumSkin2:disabled:hover,.wdk-button.t-premiumSkin2:disabled:active,.wdk-button.t-premiumSkin2:disabled.active {
    opacity: .9
}

.wdk-button.t-premiumSkin2:focus-visible {
    outline-color: var(--COLOR_premium_100)
}

.wdk-button.t-premiumSkin2.t-size_50::before {
    height: 32px
}

.wdk-button.t-premiumSkin2.t-size_75::before {
    height: 36px
}

.wdk-button.t-premiumSkin2.t-size_200::before {
    height: 60px
}

.wdk-button.t-premiumSkin2 .icon::before {
    background-image: var(--COLOR_gradient_premium_100_45);
    width: 18px;
    height: 18px
}

.wdk-button.t-premiumSkin2 .icon svg {
    fill: var(--COLOR_offer_200)
}

.wdk-button.t-premiumSkin2 .text {
    position: relative;
    background: var(--COLOR_premium_100);
    background-image: var(--COLOR_gradient_premium_100_45);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: rgba(0,0,0,0)
}

.wdk-button.t-primarySuccess {
    background-color: var(--COLOR_alertSuccess_100);
    color: var(--COLOR_supportLight_100)
}

@media(hover: hover) {
    .wdk-button.t-primarySuccess:hover,.wdk-button.t-primarySuccess.hover {
        background-color:#3e9429
    }
}

.wdk-button.t-primarySuccess:active,.wdk-button.t-primarySuccess.active {
    background-color: #156d01
}

.wdk-button.t-primarySuccess.disabled,.wdk-button.t-primarySuccess.disabled:hover,.wdk-button.t-primarySuccess.disabled:active,.wdk-button.t-primarySuccess.disabled.active,.wdk-button.t-primarySuccess:disabled,.wdk-button.t-primarySuccess:disabled:hover,.wdk-button.t-primarySuccess:disabled:active,.wdk-button.t-primarySuccess:disabled.active {
    opacity: .3
}

.wdk-button.t-primarySuccess:focus-visible {
    outline-color: var(--COLOR_alertSuccess_100)
}

.wdk-button.t-primarySuccess .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-primaryAttention {
    background-color: var(--COLOR_alertWarning_100);
    color: var(--COLOR_supportLight_100)
}

@media(hover: hover) {
    .wdk-button.t-primaryAttention:hover,.wdk-button.t-primaryAttention.hover {
        background-color:#f2712a
    }
}

.wdk-button.t-primaryAttention:active,.wdk-button.t-primaryAttention.active {
    background-color: #cb4903
}

.wdk-button.t-primaryAttention.disabled,.wdk-button.t-primaryAttention.disabled:hover,.wdk-button.t-primaryAttention.disabled:active,.wdk-button.t-primaryAttention.disabled.active,.wdk-button.t-primaryAttention:disabled,.wdk-button.t-primaryAttention:disabled:hover,.wdk-button.t-primaryAttention:disabled:active,.wdk-button.t-primaryAttention:disabled.active {
    opacity: .3
}

.wdk-button.t-primaryAttention:focus-visible {
    outline-color: var(--COLOR_alertWarning_100)
}

.wdk-button.t-primaryAttention .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-primaryError {
    background-color: var(--COLOR_alertError_100);
    color: var(--COLOR_supportLight_100)
}

@media(hover: hover) {
    .wdk-button.t-primaryError:hover,.wdk-button.t-primaryError.hover {
        background-color:#e2293f
    }
}

.wdk-button.t-primaryError:active,.wdk-button.t-primaryError.active {
    background-color: #bb0018
}

.wdk-button.t-primaryError.disabled,.wdk-button.t-primaryError.disabled:hover,.wdk-button.t-primaryError.disabled:active,.wdk-button.t-primaryError.disabled.active,.wdk-button.t-primaryError:disabled,.wdk-button.t-primaryError:disabled:hover,.wdk-button.t-primaryError:disabled:active,.wdk-button.t-primaryError:disabled.active {
    opacity: .3
}

.wdk-button.t-primaryError:focus-visible {
    outline-color: var(--COLOR_alertError_100)
}

.wdk-button.t-primaryError .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-primaryInfo {
    background-color: var(--COLOR_alertInfo_100);
    color: var(--COLOR_supportLight_100)
}

@media(hover: hover) {
    .wdk-button.t-primaryInfo:hover,.wdk-button.t-primaryInfo.hover {
        background-color:#2a87d2
    }
}

.wdk-button.t-primaryInfo:active,.wdk-button.t-primaryInfo.active {
    background-color: #025fac
}

.wdk-button.t-primaryInfo.disabled,.wdk-button.t-primaryInfo.disabled:hover,.wdk-button.t-primaryInfo.disabled:active,.wdk-button.t-primaryInfo.disabled.active,.wdk-button.t-primaryInfo:disabled,.wdk-button.t-primaryInfo:disabled:hover,.wdk-button.t-primaryInfo:disabled:active,.wdk-button.t-primaryInfo:disabled.active {
    opacity: .3
}

.wdk-button.t-primaryInfo:focus-visible {
    outline-color: var(--COLOR_alertInfo_100)
}

.wdk-button.t-primaryInfo .icon svg {
    fill: var(--COLOR_supportLight_100)
}

.wdk-button.t-knightRider {
    width: 100%;
    white-space: normal
}

.wdk-button.t-knightRider::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJEAAADBCAMAAAD4iKLmAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAkUExURQAAAM7k/9jq/9bp/9Ln/87l/9Pn/9fp/9To/9Hm/8/l/9Dm/37zm1IAAAAMdFJOUwCVCyVUikQXNGR+cuN0eqEAAAI0SURBVHja7ZzJcsMgEAURIEDw//8bLUkk2/KSSgmeSj1Hn6aaGZ7amzHHl7UxurGsESm7dJTGsiodzYhSCiE4lYYWRCF4750UorGhYfBRBVGYOhqGUoq3UohKyTkHKUQ5932fk8hY/3TUdV2JUoi6qZqM03o5Lg2tiMZqcnTby/Ee0TRNg5NC1OdcSrDNN3+LaOxoGFKzRdtFNL7oQ6x8Zm8QeR9CrWeC+83fReTnjpLTQjR1VONxbu9yzI8NLYici9FW3fwHRFNDW0Rj99bWR9S/RHRwR88j9mbz54bqIXJaiOwnl+OKqFJDbxEFEH14OVZftNf5UWXR/ogoVkS0KtrT/FCYoryHiPx4svmh4ljHU+dHFMkPIvZs+SGMqEF+nDJi61+OWWfzBRTNomjkB4pGxKJoKNrF8gNFQ9HIj/+PtQoio5YfFkVD0VA08gNFI2JRtEsomuVTNBQNRSM/UDQUDUVD0VA08gNFQ9FQNBQNRUPRiFjyQ1nR+KIjioaioWjkB4qGoqFoKBqKhqIRsSgaioaioWgoGvmBohGxKBq/ReO3aCgaikZ+fJAflcb6zIpW9/0rFA1FQ9E08sNcNz+CQn4QsRdRNHM8o78pmjm8rNSnaEtFncvxF5OKom0xaSGaKyn8afLd0QUtRFO54V1+mOqVcsv82D86r4Vo3rrSLD9eHN2TiDXtKmQpRMs4td/8h3Hy94hM83JeCtF3sGiM9e0zgRSi5XEuaTU0jXi1jr4A9M/Pk1ODkzQAAAAASUVORK5CYII=") no-repeat -1500% -30px;
    animation: knightrider 6s linear infinite
}

@keyframes knightrider {
    0% {
        background-position: -1500% -30px
    }

    60% {
        background-position: 300% -30px
    }

    100% {
        background-position: 300% -30px
    }
}

.wdk-button.t-lottieAnimation {
    overflow: visible
}

.wdk-button.t-lottieAnimation .lottiAnimation {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 60px;
    height: 60px;
    transform: translate(-50%, -50%);
    z-index: 20
}

.wdk-button.t-lottieAnimation .lottiAnimation wdk-lottie-animation {
    width: 56px;
    position: relative;
    top: -14px
}

.wdk-button.t-lottieAnimation .icon {
    width: 24px;
    height: 24px;
    position: relative
}

.wdk-button.t-lottieAnimation .icon svg {
    width: 24px;
    height: 24px
}

.wdk-button.t-lottieAnimation.t-size_200 .icon {
    width: 32px;
    height: 32px
}

.wdk-button.t-lottieAnimation.t-size_200 .icon svg {
    width: 32px;
    height: 32px
}

.wdk-button.t-size_50 {
    height: 32px;
    padding: 0 14px;
    font: var(--FONT_highlight_75);
    font-weight: 500
}

.wdk-button.t-size_50::after {
    margin-top: -10px;
    height: 48px
}

.wdk-button.t-size_50 .icon svg,.wdk-button.t-size_50 .icon img {
    width: 12px;
    height: 12px
}

.wdk-button.t-size_75 {
    height: 36px;
    padding: 0 16px;
    font: var(--FONT_default_75)
}

.wdk-button.t-size_75::after {
    margin-top: -8px;
    height: 48px
}

.wdk-button.t-size_75 .icon svg,.wdk-button.t-size_75 .icon img {
    width: 14px;
    height: 14px
}

.wdk-button.t-size_200 {
    height: 56px;
    padding: 0 24px
}

.wdk-button.t-size_200::after {
    display: none
}

.wdk-button.t-circle {
    width: 48px;
    height: 48px;
    padding: 0;
    border-radius: var(--borderRadius_circle)
}

.wdk-button.t-circle.t-size_50 {
    width: 32px;
    height: 32px
}

.wdk-button.t-circle.t-size_50::after {
    height: 48px;
    width: 48px;
    margin-top: -10px;
    margin-left: -10px
}

.wdk-button.t-circle.t-size_50 .icon svg,.wdk-button.t-circle.t-size_50 .icon img {
    width: 20px;
    height: 20px
}

.wdk-button.t-circle.t-size_75 {
    width: 36px;
    height: 36px
}

.wdk-button.t-circle.t-size_75::after {
    height: 48px;
    width: 48px;
    margin-top: -8px;
    margin-left: -8px
}

.wdk-button.t-circle.t-size_75 .icon svg,.wdk-button.t-circle.t-size_75 .icon img {
    width: 20px;
    height: 20px
}

.wdk-button.t-circle.t-size_200 {
    width: 60px;
    height: 60px
}

.wdk-button.t-circle.t-size_200::after {
    display: none
}

.wdk-button.t-circle.t-size_200 .icon svg,.wdk-button.t-circle.t-size_200 .icon img {
    width: 36px;
    height: 36px
}

.wdk-button.t-circle.is-loading .icon {
    opacity: 0
}

.wdk-button.t-circle.is-loading .text {
    opacity: 1
}

.wdk-button.t-circle .icon {
    margin: 0
}

.wdk-button.t-circle .icon svg,.wdk-button.t-circle .icon img {
    width: 24px;
    height: 24px
}

.wdk-button.t-circle .text {
    display: block;
    position: absolute;
    top: 100%;
    left: 50%;
    width: 158%;
    margin: 5px 0 0 -79%;
    white-space: normal;
    text-align: center;
    font: var(--FONT_default_50)
}

body .wdk-styledHintBox {
    position: relative;
    margin-top: 8px;
    padding: 9px 6px;
    color: var(--COLOR_supportLight_100);
    font: var(--FONT_default_75);
    text-align: left;
    flex-shrink: 0;
    border-radius: var(--borderRadius_75)
}

body .wdk-styledHintBox .wdk-icon {
    position: absolute;
    left: 8px;
    top: 50%;
    margin-top: -16px;
    padding-right: 8px;
    fill: var(--COLOR_supportLight_100);
    width: 32px;
    height: 32px
}

body .wdk-styledHintBox .wdk-icon+.textWrapper {
    padding-left: 39px
}

body .wdk-styledHintBox.t-error,body .wdk-styledHintBox.t-error2 {
    margin-top: 0;
    max-height: 0;
    padding: 0;
    background-color: var(--COLOR_alertError_200);
    color: var(--COLOR_alertError_100);
    overflow: hidden;
    opacity: 0;
    transition: max-height .2s linear,opacity .2s linear,border .2s linear;
    border-width: 0 2px
}

body .wdk-styledHintBox.t-error .wdk-icon,body .wdk-styledHintBox.t-error2 .wdk-icon {
    opacity: 0;
    transition: max-height .2s linear,opacity .1s linear;
    fill: var(--COLOR_alertError_100)
}

body .wdk-styledHintBox.t-error a,body .wdk-styledHintBox.t-error2 a {
    color: var(--COLOR_alertError_100) !important
}

body .wdk-styledHintBox.t-error2 {
    background-color: var(--COLOR_alertError_200);
    color: var(--COLOR_alertError_100)
}

body .wdk-styledHintBox.t-error2 .wdk-icon {
    fill: var(--COLOR_alertError_100)
}

body .wdk-styledHintBox.t-errorForm {
    display: none;
    width: 100%;
    margin-top: 0;
    padding: 0;
    font: var(--FONT_default_75);
    color: var(--COLOR_alertError_100)
}

body .wdk-styledHintBox.t-errorForm.is-visible {
    padding: 4px 0;
    display: block
}

body .wdk-styledHintBox a {
    text-decoration: underline;
    color: var(--COLOR_supportLight_100) !important
}

.no-touchevents body .wdk-styledHintBox a:hover {
    text-decoration: none;
    color: inherit
}

body .wdk-styledHintBox .ariaLabel {
    display: none
}

.wdk-styledHintBox.t-error.is-visible,.wdk-styledHintBox.t-error2.is-visible {
    margin-top: 8px;
    max-height: 210px;
    font: var(--FONT_default_75);
    opacity: 1;
    padding: 9px 6px
}

.wdk-styledHintBox.t-error.is-visible .wdk-icon,.wdk-styledHintBox.t-error2.is-visible .wdk-icon {
    opacity: 1
}

.wdk-styledHintBox.t-error.is-visible .wdk-icon+.textWrapper,.wdk-styledHintBox.t-error2.is-visible .wdk-icon+.textWrapper {
    padding-left: 39px
}

@keyframes spinning-wheel {
    to {
        transform: rotate(360deg)
    }
}

.wdk-loadingSpinner {
    display: block;
    width: 22px;
    height: 22px;
    background-image: url("../../img/spinningwheel.svg");
    background-repeat: no-repeat;
    background-size: 22px 22px;
    transform-origin: center center
}

.is-loading.wdk-loadingSpinner {
    animation: spinning-wheel 1s steps(12, end) infinite
}

.t-white.wdk-loadingSpinner {
    background-image: url("../../img/spinningwheel_white.svg")
}

.t-size200.wdk-loadingSpinner {
    width: 32px;
    height: 32px;
    background-size: 32px 32px
}

.wdk_loadingIndicator {
    position: relative
}

.wdk_loadingIndicator.is-loading .text {
    opacity: 0
}

.wdk_loadingIndicator.is-loading .icon {
    opacity: 0
}

.wdk_loadingIndicator.is-loading .loader {
    opacity: 1
}

.wdk_loadingIndicator.is-loading .loader.trippleDot {
    animation: trippleDots 1s ease-in-out .6s infinite
}

.wdk_loadingIndicator.is-loading .loader.trippleDot::before {
    animation: trippleDots 1s ease-in-out .3s infinite
}

.wdk_loadingIndicator.is-loading .loader.trippleDot::after {
    animation: trippleDots 1s ease-in-out 0s infinite
}

.wdk_loadingIndicator.is-loading .loader.trippleDot.t-dark {
    animation: trippleDotsDark 1s ease-in-out .6s infinite
}

.wdk_loadingIndicator.is-loading .loader.trippleDot.t-dark::before {
    animation: trippleDotsDark 1s ease-in-out .3s infinite
}

.wdk_loadingIndicator.is-loading .loader.trippleDot.t-dark::after {
    animation: trippleDotsDark 1s ease-in-out 0s infinite
}

.wdk_loadingIndicator .text {
    display: inline-block;
    transition: opacity .25s
}

.wdk_loadingIndicator .icon {
    display: inline-flex;
    transition: opacity .25s
}

.wdk_loadingIndicator .loader {
    display: block;
    opacity: 0;
    transition: opacity .25s
}

.wdk_loadingIndicator .trippleDot {
    position: absolute;
    width: 6px;
    height: 6px;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background-color: var(--COLOR_supportLight_070);
    border-radius: var(--borderRadius_circle)
}

.wdk_loadingIndicator .trippleDot::before {
    content: "";
    position: absolute;
    left: -10px;
    height: 6px;
    width: 6px;
    border-radius: var(--borderRadius_circle);
    background-color: var(--COLOR_supportLight_070)
}

.wdk_loadingIndicator .trippleDot::after {
    content: "";
    position: absolute;
    left: 10px;
    height: 6px;
    width: 6px;
    border-radius: var(--borderRadius_circle);
    background-color: var(--COLOR_supportLight_100)
}

.wdk_loadingIndicator .trippleDot.t-dark {
    background-color: var(--COLOR_supportDark_070)
}

.wdk_loadingIndicator .trippleDot.t-dark::before {
    background-color: var(--COLOR_supportDark_070)
}

.wdk_loadingIndicator .trippleDot.t-dark::after {
    background-color: var(--COLOR_supportDark_070)
}

@keyframes trippleDots {
    0% {
        background-color: var(--COLOR_supportLight_070)
    }

    25% {
        background-color: var(--COLOR_supportLight_070)
    }

    50% {
        background-color: var(--COLOR_supportLight_070)
    }

    75% {
        background-color: var(--COLOR_supportLight_100)
    }

    100% {
        background-color: var(--COLOR_supportLight_070)
    }
}

@keyframes trippleDotsDark {
    0% {
        background-color: var(--COLOR_supportDark_070)
    }

    25% {
        background-color: var(--COLOR_supportDark_070)
    }

    50% {
        background-color: var(--COLOR_supportDark_070)
    }

    75% {
        background-color: var(--COLOR_supportDark_100)
    }

    100% {
        background-color: var(--COLOR_supportDark_070)
    }
}

#wdk-passwordRestrictionBox.t-default {
    position: absolute;
    bottom: 78%;
    width: 100%;
    margin-top: 20px;
    margin-bottom: 20px;
    padding: 12px;
    border: 2px solid var(--COLOR_primary_100);
    font: var(--FONT_default_75);
    border-radius: var(--borderRadius_75);
    z-index: 1;
    background: var(--COLOR_supportDark_600)
}

#wdk-passwordRestrictionBox.t-default::before,#wdk-passwordRestrictionBox.t-default::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    margin-left: -15px
}

#wdk-passwordRestrictionBox.t-default::before {
    border-color: var(--COLOR_primary_100) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
    border-style: solid;
    border-width: 15px 15px 9px 15px;
    z-index: 0
}

#wdk-passwordRestrictionBox.t-default::after {
    margin-left: -13px;
    margin-top: 0;
    border-color: var(--COLOR_supportDark_600) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
    border-style: solid;
    border-width: 12px 13px 9px 13px;
    z-index: 1
}

#wdk-passwordRestrictionBox.t-default.success {
    border-color: var(--COLOR_alertSuccess_100)
}

#wdk-passwordRestrictionBox.t-default.success::before {
    border-color: var(--COLOR_alertSuccess_100) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0)
}

#wdk-passwordRestrictionBox.t-default ul {
    padding-left: 3px
}

#wdk-passwordRestrictionBox.t-default ul li {
    position: relative;
    display: flex;
    margin: 13px 0 0 0;
    list-style-type: none !important;
    align-items: center;
    flex: 1 0 auto
}

#wdk-passwordRestrictionBox.t-default ul li .wdk-icon {
    width: 16px;
    height: 16px;
    fill: var(--COLOR_primary_100);
    margin-right: 4px
}

#wdk-passwordRestrictionBox.t-default ul li .wdk-icon.icon_check {
    display: none
}

#wdk-passwordRestrictionBox.t-default ul li.success {
    color: var(--COLOR_alertSuccess_100)
}

#wdk-passwordRestrictionBox.t-default ul li.success .wdk-icon {
    fill: var(--COLOR_alertSuccess_100)
}

#wdk-passwordRestrictionBox.t-default ul li.success .wdk-icon.icon_check {
    display: inline-block
}

#wdk-passwordRestrictionBox.t-default ul li.success .wdk-icon.icon_x {
    display: none
}

#wdk-passwordRestrictionBox.t-default ul li span {
    width: 100%
}

wdk-input-checkbox {
    display: inline-block;
    width: 100%;
    margin-bottom: 16px
}

wdk-input-checkbox input,wdk-input-checkbox label {
    cursor: pointer
}

wdk-input-checkbox[disabled] {
    opacity: .6
}

wdk-input-checkbox[disabled] input,wdk-input-checkbox[disabled] label {
    cursor: not-allowed
}

wdk-input-checkbox:not([skin=onBrand]) {
    color: var(--COLOR_supportDark_200)
}

wdk-input-checkbox:not([skin=onBrand]) .labelWrapper {
    color: var(--COLOR_supportDark_200)
}

wdk-input-checkbox:not([skin=onBrand]) .inputWrapper:not(.switch) {
    color: var(--COLOR_supportDark_200)
}

wdk-input-checkbox:not([skin=onBrand]) .inputWrapper:not(.switch) input {
    border-color: var(--COLOR_supportDark_200);
    accent-color: var(--COLOR_alertSuccess_100)
}

wdk-input-checkbox:not([skin=onBrand]) .inputWrapper.switch .switchSlider .switchKnob {
    background-color: var(--COLOR_supportDark_050)
}

wdk-input-checkbox:not([skin=onBrand]) .inputWrapper.switch input:checked+.switchSlider .switchKnob {
    background-color: var(--COLOR_supportDark_050)
}

wdk-input-checkbox:not([skin=onBrand]) .inputWrapper.switch input:checked+.switchSlider .switchKnob::before {
    background-color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox:not([skin=onBrand]) .inputWrapper.switch .switchBg {
    border-color: var(--COLOR_supportDark_100)
}

wdk-input-checkbox[skin=onBrand] {
    color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox[skin=onBrand] .labelWrapper {
    color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox[skin=onBrand] .labelWrapper .topInfo .wdk-icon {
    fill: var(--COLOR_supportLight_080)
}

wdk-input-checkbox[skin=onBrand] .inputWrapper:not(.switch) {
    color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox[skin=onBrand] .inputWrapper:not(.switch) input {
    border-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox[skin=onBrand] .inputWrapper.switch .switchBg {
    border-color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox[skin=onBrand] .inputWrapper.switch .switchKnob {
    background-color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox[skin=onBrand] .inputWrapper.switch .switchKnob::before {
    background-color: var(--COLOR_primary_100_dark) !important
}

wdk-input-checkbox[skin=onBrand] .inputWrapper.switch input:checked+.switchSlider .switchBg {
    background-color: var(--COLOR_supportLight_100)
}

wdk-input-checkbox[skin=onBrand] .inputWrapper.switch input:checked+.switchSlider .switchKnob {
    background-color: var(--COLOR_primary_100_dark)
}

wdk-input-checkbox[skin=onBrand] .inputWrapper.switch input:checked+.switchSlider .switchKnob::before {
    background-color: var(--COLOR_supportLight_100) !important
}

wdk-input-checkbox .designWrapper {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    gap: 12px
}

wdk-input-checkbox .designWrapper .inputWrapper:not(.switch) {
    position: relative;
    height: 20px
}

wdk-input-checkbox .designWrapper .inputWrapper:not(.switch) input {
    width: 20px;
    height: 20px
}

wdk-input-checkbox .designWrapper .inputWrapper:not(.switch) input:focus-visible {
    outline: 2px dashed currentcolor;
    outline-offset: 2px
}

wdk-input-checkbox .designWrapper .inputWrapper.switch {
    position: relative
}

wdk-input-checkbox .designWrapper .inputWrapper.switch input {
    position: absolute;
    opacity: 0;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1
}

wdk-input-checkbox .designWrapper .inputWrapper.switch input:checked+.switchSlider .switchKnob {
    margin-left: 20px
}

wdk-input-checkbox .designWrapper .inputWrapper.switch input:checked+.switchSlider .switchKnob::before {
    content: "";
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    display: inline-block;
    color: inherit;
    background-color: currentcolor;
    -webkit-mask-image: url(../../img/icons/single_color/icon_check.svg);
    mask-image: url(../../img/icons/single_color/icon_check.svg);
    vertical-align: -3px;
    width: 14px;
    height: 14px
}

wdk-input-checkbox .designWrapper .inputWrapper.switch input:focus-visible+.switchSlider .switchBg {
    outline: 2px dashed currentcolor;
    outline-offset: 2px
}

wdk-input-checkbox .designWrapper .inputWrapper.switch .switchSlider {
    position: relative;
    display: inline-block;
    min-height: 48px;
    width: 52px;
    cursor: pointer;
    margin-left: 0;
    padding-top: 12px;
    outline: none;
    -webkit-user-select: none;
    user-select: none
}

wdk-input-checkbox .designWrapper .inputWrapper.switch .switchSlider .switchBg {
    content: "";
    position: absolute;
    padding: 2px;
    width: 52px;
    height: 32px;
    left: 0;
    top: 11px;
    border-width: 2px;
    border-style: solid;
    transition: all .3s;
    border-radius: var(--borderRadius_rounded)
}

wdk-input-checkbox .designWrapper .inputWrapper.switch .switchSlider .switchKnob {
    position: absolute;
    top: 15px;
    left: 4px;
    height: 24px;
    width: 24px;
    border-radius: var(--borderRadius_circle);
    transition: all .4s cubic-bezier(0.4, 0, 0.2, 1)
}

wdk-input-checkbox .designWrapper .inputWrapper.switch .switchSlider .switchKnob::before {
    position: absolute;
    top: 5px;
    left: 5px;
    content: "";
    width: 24px;
    height: 24px;
    -webkit-mask-size: cover;
    mask-size: cover;
    display: inline-block;
    color: inherit;
    background-color: currentcolor;
    -webkit-mask-image: url(../../img/icons/single_color/icon_x.svg);
    mask-image: url(../../img/icons/single_color/icon_x.svg);
    vertical-align: -3px;
    width: 14px;
    height: 14px
}

wdk-input-checkbox .designWrapper .labelWrapper {
    position: relative;
    display: inline-block;
    text-align: left
}

wdk-input-checkbox .designWrapper .labelWrapper label {
    display: block;
    font: var(--FONT_default_100)
}

wdk-input-checkbox .designWrapper .labelWrapper label strong {
    font: var(--FONT_highlight_75)
}

wdk-input-checkbox .designWrapper .labelWrapper label sub {
    display: block;
    margin: 0;
    font: var(--FONT_default_75);
    bottom: 0
}

wdk-input-checkbox .errors:has(wdk-hintbox-error[show]) {
    padding-right: 16px;
    margin-bottom: 8px
}

peg-otp-page {
    display: block;
    max-width: 500px;
    min-width: 320px;
    margin: auto;
    padding: 12px;
    text-align: center;
    color: var(--COLOR_supportLight_100)
}

peg-otp-page .icon {
    display: block;
    margin: 0 auto
}

peg-otp-page h1 {
    font: var(--FONT_highlight_300)
}

peg-otp-page p {
    font: var(--FONT_default_100)
}

peg-otp-page .js-openModalDrawer {
    font: var(--FONT_highlight_100)
}

peg-otp-page #resendSuccessModal p,peg-otp-page #resendBlockedModal p {
    text-align: left
}

peg-liveness-page {
    display: block;
    max-width: 640px;
    min-width: 320px;
    margin: auto;
    padding: 12px;
    text-align: center;
    color: var(--COLOR_supportLight_100)
}

peg-liveness-page .headerLogo {
    display: block;
    margin: 0 auto
}

peg-liveness-page h1 {
    font: var(--FONT_highlight_300)
}

peg-liveness-page p {
    font: var(--FONT_default_100)
}

peg-liveness-page .termsAndConditionsWrapper {
    background-color: var(--COLOR_supportLight_100);
    border-radius: var(--borderRadius_100);
    color: var(--COLOR_supportDark_100);
    height: 400px;
    padding: 20px 0 20px 20px;
    font: var(--FONT_default_75);
    margin-bottom: 20px;
    box-shadow: var(--boxShadow_mid)
}

@media only screen and (min-width: 768px) {
    peg-liveness-page .termsAndConditionsWrapper {
        width:600px
    }
}

peg-liveness-page .termsAndConditionsWrapper .termsAndConditionsText {
    overflow-y: scroll;
    height: 100%;
    text-align: left
}

peg-liveness-page .termsAndConditionsWrapper .termsAndConditionsText h2 {
    line-height: 25px
}

peg-liveness-page .termsAndConditionsWrapper .termsAndConditionsText p {
    font: var(--FONT_default_75);
    margin-bottom: 20px
}

@media only screen and (min-width: 481px) {
    peg-liveness-page wdk-input-checkbox {
        margin:0 20px
    }
}

peg-liveness-page .startLivenessCheck {
    margin: 0 0 20px 0
}

@media only screen and (min-width: 481px) {
    peg-liveness-page .startLivenessCheck {
        margin:20px 0
    }
}

peg-liveness-page wdk-hintbox-error.tokenError {
    margin-bottom: 20px
}

@media only screen and (min-width: 481px) {
    peg-liveness-page wdk-hintbox-error.tokenError {
        margin-bottom:0
    }
}

peg-liveness-page-done {
    display: block;
    max-width: 640px;
    min-width: 320px;
    margin: auto;
    padding: 12px;
    text-align: center;
    color: var(--COLOR_supportLight_100)
}

peg-liveness-page-done .headerLogo {
    display: block;
    margin: 0 auto
}

peg-liveness-page-done h1 {
    font: var(--FONT_highlight_300)
}

peg-liveness-page-done p {
    font: var(--FONT_default_100);
    margin-bottom: 48px
}

peg-liveness-page-done .spinnerWrapper {
    display: flex;
    justify-content: center
}

peg-liveness-page-done .spinnerWrapper .spinnerInner {
    background-color: var(--COLOR_supportDark_050);
    border-radius: var(--borderRadius_100);
    padding: 20px
}

peg-liveness-page-done .refreshLimitReachedWrapper {
    background-color: var(--COLOR_supportDark_050);
    border-radius: var(--borderRadius_100);
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 40px 40px 24px 40px
}

peg-liveness-page-done .refreshLimitReachedWrapper p {
    margin: 0;
    margin-bottom: 32px
}

peg-liveness-page-done .refreshLimitReachedWrapper .callCustomerSupport {
    margin-bottom: 24px
}

peg-mandatoryphotoupload-page {
    display: block;
    max-width: 640px;
    min-width: 320px;
    margin: auto;
    padding: 12px;
    text-align: center;
    color: var(--COLOR_supportLight_100)
}

peg-mandatoryphotoupload-page .headerLogo {
    display: block;
    margin: 0 auto
}

peg-mandatoryphotoupload-page h1 {
    font: var(--FONT_highlight_300)
}

peg-mandatoryphotoupload-page p {
    font: var(--FONT_default_100)
}

peg-mandatoryphotoupload-page article#mandatoryPhotoUploadWrapper {
    display: flex;
    align-items: center;
    flex-direction: column;
    gap: 24px;
    background-color: var(--COLOR_supportLight_100);
    border-radius: var(--borderRadius_100);
    padding: 24px;
    color: var(--COLOR_supportDark_100)
}

peg-verification-code {
    display: block
}

peg-verification-code .codeWrapper {
    position: relative;
    width: 300px;
    height: 70px;
    margin: 24px auto;
    overflow: hidden;
    background-color: var(--COLOR_supportLight_050);
    border: 2px solid var(--COLOR_supportLight_100);
    border-radius: var(--borderRadius_75);
    font-family: menlo,consolas,monospace;
    font-size: 25pt;
    font-weight: bold
}

peg-verification-code .codeWrapper #code {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    z-index: 100;
    color: var(--COLOR_supportLight_100);
    text-shadow: 0 0 0 var(--COLOR_supportLight_100);
    background: rgba(0,0,0,0);
    border: none
}

peg-verification-code .codeWrapper #code[maxlength="4"] {
    padding: 16px 16px 16px 46px;
    letter-spacing: 42px
}

peg-verification-code .codeWrapper #code[maxlength="6"] {
    padding: 16px 16px 16px 28px;
    letter-spacing: 24px
}

peg-verification-code .codeWrapper #code.cursorHidden {
    color: rgba(0,0,0,0)
}

peg-verification-code .submitInProgress .codeWrapper #code {
    opacity: .3
}

peg-verification-code .submitInProgress #verificationLoader {
    display: inline-block;
    margin-top: 16px
}

peg-verification-code #verificationLoader {
    display: none
}

peg-verification-code #verificationError,peg-verification-code #verificationTimeoutError {
    width: 300px;
    margin: 12px auto;
    border-radius: var(--borderRadius_75)
}

peg-otp-help-dialog {
    display: block;
    background-color: var(--COLOR_supportLight_100)
}

@media only screen and (min-width: 481px) {
    peg-otp-help-dialog {
        border-radius:var(--borderRadius_100)
    }
}

peg-otp-help-dialog button,peg-otp-help-dialog a {
    display: block;
    width: 100%;
    border-bottom: 1px solid var(--COLOR_supportDark_500) !important
}

peg-otp-help-dialog button#cancelButton,peg-otp-help-dialog a#cancelButton {
    border: none !important
}

body#loginPage {
    overflow-y: scroll
}

body#loginPage.directSocialSignOn #wrapperForLoadingAnimation {
    opacity: 0;
    transform: scale(0.01)
}

body#loginPage section#wrapperForLoadingAnimation {
    transition: opacity 200ms linear,transform 300ms linear
}

body#loginPage section#wrapperForLoadingAnimation.hidden {
    opacity: 0;
    transform: scale(0.01)
}

body#loginPage #content article {
    position: relative;
    display: block;
    padding: 16px;
    height: auto;
    color: var(--COLOR_defaultText)
}

@media only screen and (min-width: 768px) {
    body#loginPage #content article {
        padding:40px 60px;
        max-width: 550px
    }
}

body#loginPage #content article #loginForm {
    margin: 0 auto
}

@media only screen and (min-width: 481px) {
    body#loginPage #content article #loginForm {
        max-width:360px
    }
}

body#loginPage #content article #loginForm .belowPasswordField {
    display: flex;
    justify-content: flex-end
}

body#loginPage #content article #loginForm .belowPasswordField a {
    display: inline-block;
    padding: 8px 0 0 0;
    font: var(--FONT_default_75);
    color: var(--COLOR_supportDark_300);
    text-decoration: none;
    line-height: 18px
}

body#loginPage #content article #loginForm .belowPasswordField a:hover {
    text-decoration: underline
}

body#loginPage #content article #loginForm .belowPasswordField a.has-loginError {
    font: var(--FONT_highlight_75);
    text-decoration: underline
}

body#loginPage #content article #loginForm #loginErrorFromServer {
    margin-bottom: 10px;
    overflow: hidden
}

body#loginPage #content article #loginForm #loginFormSubmit {
    display: block;
    width: 100%;
    font: var(--FONT_highlight_75);
    margin-top: 12px;
    z-index: 2
}

body#loginPage #content article #loginForm #loginInfo label {
    font: var(--FONT_default_75);
    padding-top: 19px;
    padding-left: 42px;
    color: var(--COLOR_supportDark_300)
}

body#loginPage #content article #loginForm #loginInfo a {
    font: var(--FONT_default_50);
    color: var(--COLOR_defaultText)
}

body#loginPage #content article #loginForm .socialSignOnSeparator {
    display: block;
    margin: 12px 0
}

body#loginPage #content article #loginForm .socialSignOnSeparator .speratorText {
    display: inline
}

body#loginPage #content article #loginForm .speratorText {
    display: none;
    padding-left: 18px;
    padding-right: 18px;
    background-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_supportDark_300);
    font: var(--FONT_default_75)
}

body#loginPage #content article #loginForm #googleLoginContainer {
    margin-top: 4px
}

body#loginPage footer .visibleOnMobile a {
    color: var(--COLOR_supportLight_100)
}

@media only screen and (min-width: 980px) {
    body#loginPage.is-customerPortalLogin section {
        display:flex;
        width: calc(100% - 40px);
        max-width: 1000px;
        margin: 0 auto;
        align-items: flex-start
    }
}

body#loginPage.is-customerPortalLogin article {
    padding: 24px
}

@media only screen and (min-width: 980px) {
    body#loginPage.is-customerPortalLogin article {
        width:50%;
        margin-right: 20px
    }

    body#loginPage.is-customerPortalLogin article:last-of-type {
        margin-right: 0
    }
}

body#loginPage.is-customerPortalLogin article h2 {
    margin-top: 0
}

body#loginPage.is-customerPortalLogin article #loginForm .belowPasswordField {
    justify-content: space-between
}

body#loginPage.is-customerPortalLogin #customerPortalLoginCard .wrapper {
    max-width: 360px;
    margin: 0 auto
}

body#loginPage.is-customerPortalLogin #customerPortalLoginCard a {
    width: 100%
}

body#verificationPage {
    background: var(--COLOR_primary_100)
}

body#verificationPage section#wrapperForLoadingAnimation.hidden {
    opacity: 0;
    transform: scale(0.01)
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm {
    max-width: 500px;
    min-width: 320px;
    margin: auto;
    text-align: center;
    color: var(--COLOR_supportLight_100);
    padding: 12px
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm h1 {
    line-height: 1
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm>div,body#verificationPage section#wrapperForLoadingAnimation #verificationForm>input {
    margin-top: 20px
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .back {
    position: absolute;
    left: 10px;
    color: var(--COLOR_supportLight_100);
    font: var(--FONT_default_400);
    text-decoration: none
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .back .wdk-icon.icon_arrow_left_bold {
    fill: var(--COLOR_supportLight_100);
    width: 32px;
    height: 32px
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .info {
    font: var(--FONT_default_100)
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm #email {
    color: var(--COLOR_supportLight_100);
    font: var(--FONT_highlight_100);
    background: rgba(0,0,0,0);
    border: none
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm.submitInProgress .codeWrapper #code {
    opacity: .3
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm.submitInProgress #verificationLoader {
    display: inline-block;
    margin-top: 16px
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .codeWrapper {
    position: relative;
    width: 300px;
    height: 70px;
    background-color: var(--COLOR_supportLight_050);
    border-radius: var(--borderRadius_75);
    overflow: hidden;
    margin: 20px auto auto;
    border: 2px solid var(--COLOR_supportLight_100)
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .codeWrapper .monospaced {
    font-family: menlo,consolas,monospace;
    font-weight: bold;
    font-size: 25pt
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .codeWrapper #code {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 15px 15px 15px 26px;
    z-index: 100;
    color: var(--COLOR_supportLight_100);
    text-shadow: 0 0 0 var(--COLOR_supportLight_100);
    background: rgba(0,0,0,0);
    border: none;
    letter-spacing: 5px
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .codeWrapper #code.cursorHidden {
    color: rgba(0,0,0,0)
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .codeWrapper.length4 #code {
    padding: 15px 15px 15px 46px;
    letter-spacing: 42px
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm .codeWrapper.length6 #code {
    padding: 15px 15px 15px 28px;
    letter-spacing: 24px
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm #verificationLoader {
    display: none
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm #verificationError,body#verificationPage section#wrapperForLoadingAnimation #verificationForm #verificationTimeoutError {
    width: 300px;
    margin: 10px auto auto;
    border-radius: var(--borderRadius_75)
}

body#verificationPage section#wrapperForLoadingAnimation #verificationForm #verificationError .countDown,body#verificationPage section#wrapperForLoadingAnimation #verificationForm #verificationTimeoutError .countDown {
    margin: auto;
    font-weight: bolder
}

body#verificationPage section#wrapperForLoadingAnimation .helpLinkWrapper {
    text-align: center
}

body#verificationPage section#wrapperForLoadingAnimation .helpLinkWrapper a {
    font: var(--FONT_highlight_100)
}

body#verificationPage section#wrapperForLoadingAnimation .counterHelper {
    display: none
}

body#verificationPage .resendBlockedCounter {
    text-align: center;
    font: var(--FONT_highlight_300)
}

body#verificationPage #helpModal article {
    max-width: unset;
    padding: 0
}

body#verificationPage #helpModal article a {
    outline-offset: -4px
}

body#verificationPage #helpModal article a:not(:last-child) {
    border-bottom: 1px solid var(--COLOR_supportDark_500)
}

body#passwordPage {
    overflow-y: scroll
}

body#passwordPage.directSocialSignOn #wrapperForLoadingAnimation {
    opacity: 0;
    transform: scale(0.01)
}

body#passwordPage section#wrapperForLoadingAnimation {
    transition: opacity 200ms linear,transform 300ms linear
}

body#passwordPage section#wrapperForLoadingAnimation.hidden {
    opacity: 0;
    transform: scale(0.01)
}

body#passwordPage #content article {
    position: relative;
    display: block;
    padding: 16px;
    height: auto;
    color: var(--COLOR_defaultText)
}

@media only screen and (min-width: 768px) {
    body#passwordPage #content article {
        padding:40px 60px;
        max-width: 550px
    }
}

body#passwordPage #content article h2 {
    margin-top: 0
}

body#passwordPage #content article h3 {
    text-align: center
}

body#passwordPage #content article #passwordForm {
    margin: 0 auto
}

@media only screen and (min-width: 481px) {
    body#passwordPage #content article #passwordForm {
        max-width:360px
    }
}

body#passwordPage #content article #passwordForm #wdk-passwordRestrictionBox.t-default {
    position: relative
}

body#passwordPage #content article #passwordForm #passwordFormSubmit {
    display: block;
    width: 100%;
    font: var(--FONT_highlight_75);
    margin-top: 12px;
    z-index: 2
}

body#passwordPage #content article #legalText {
    font: var(--FONT_default_50);
    color: var(--COLOR_supportDark_300);
    text-align: center;
    max-width: 480px;
    margin: 0 auto
}

body#passwordPage #content article #legalText p {
    margin: 0
}

body#passwordPage #content article #legalText a {
    color: var(--COLOR_supportDark_300)
}

body#passwordPage #content article #legalText a:hover {
    color: var(--COLOR_supportDark_300)
}

body#passwordPage footer .visibleOnMobile a {
    color: var(--COLOR_supportLight_100)
}

body#registrationPage.directSocialSignOn #wrapperForLoadingAnimation {
    opacity: 0;
    transform: scale(0.01)
}

body#registrationPage #wrapperForLoadingAnimation {
    transition: opacity 200ms linear,transform 300ms linear
}

body#registrationPage #wrapperForLoadingAnimation.hidden {
    opacity: 0;
    transform: scale(0.01)
}

body#registrationPage #formSection article {
    position: relative;
    z-index: 10;
    padding: 16px;
    background-color: var(--COLOR_supportLight_100);
    width: 95%;
    border-radius: var(--borderRadius_75);
    max-width: 540px;
    margin: 0 auto;
    color: var(--COLOR_defaultText)
}

@media only screen and (min-width: 481px) {
    body#registrationPage #formSection article {
        padding-top:40px;
        position: static
    }
}

@media only screen and (min-width: 768px) {
    body#registrationPage #formSection article {
        padding:40px 60px;
        max-width: 550px
    }
}

@media only screen and (min-width: 768px) {
    body#registrationPage #formSection article {
        width:100%
    }
}

body#registrationPage #formSection article #doubleRegistrationError {
    margin-bottom: 12px
}

body#registrationPage #formSection article form {
    width: 100%
}

body#registrationPage #formSection article form #mysexEssexRow {
    width: calc(100% - 24px);
    margin: 0 12px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: flex-start;
    overflow: hidden
}

@media only screen and (min-width: 481px) {
    body#registrationPage #formSection article form #mysexEssexRow {
        max-width:480px;
        margin: 0 auto 12px auto
    }
}

body#registrationPage #formSection article form #mysexEssexRow #essexRow label {
    align-self: flex-end
}

body#registrationPage #formSection article form #mysexEssexRow .column {
    display: flex;
    flex-wrap: wrap;
    width: 42%;
    justify-content: space-between
}

body#registrationPage #formSection article form #mysexEssexRow .column .rowLabel {
    display: block;
    width: 100%;
    margin-bottom: 8px;
    text-align: center;
    font: var(--FONT_default_100)
}

body#registrationPage #formSection article form #mysexEssexRow .column label {
    display: block;
    position: relative;
    width: 46%;
    cursor: pointer;
    overflow: hidden;
    text-align: center;
    border: 2px solid var(--COLOR_supportDark_080);
    border-radius: var(--borderRadius_circle)
}

body#registrationPage #formSection article form #mysexEssexRow .column label:hover {
    border: 2px solid var(--COLOR_supportDark_090)
}

body#registrationPage #formSection article form #mysexEssexRow .column label::before {
    content: "";
    display: block;
    padding-top: 100%
}

body#registrationPage #formSection article form #mysexEssexRow .column label span {
    display: block;
    color: var(--COLOR_supportDark_300);
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: 0
}

body#registrationPage #formSection article form #mysexEssexRow .column label input[type=checkbox],body#registrationPage #formSection article form #mysexEssexRow .column label input[type=radio] {
    opacity: 0
}

body#registrationPage #formSection article form #mysexEssexRow .column label input[type=checkbox]:focus-visible+img,body#registrationPage #formSection article form #mysexEssexRow .column label input[type=radio]:focus-visible+img {
    outline: 2px dashed currentcolor;
    outline-offset: 2px;
    outline-offset: -12px
}

body#registrationPage #formSection article form #mysexEssexRow .column label .radioWrapContent {
    inset: 0 0 0 0;
    position: absolute;
    width: 100%;
    font: var(--FONT_default_75)
}

@media only screen and (min-width: 768px) {
    body#registrationPage #formSection article form #mysexEssexRow .column label .radioWrapContent {
        font:var(--FONT_default_100)
    }
}

body#registrationPage #formSection article form #mysexEssexRow .column label img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none
}

body#registrationPage #formSection article form #mysexEssexRow .column label img.default {
    display: block
}

body#registrationPage #formSection article form #mysexEssexRow .column label img.active {
    display: none
}

body#registrationPage #formSection article form #mysexEssexRow .column label.selected {
    background-color: var(--COLOR_primary_100);
    border: 2px solid var(--COLOR_primary_100)
}

body#registrationPage #formSection article form #mysexEssexRow .column label.selected img {
    filter: brightness(200%)
}

body#registrationPage #formSection article form #mysexEssexRow .column label.selected span {
    color: var(--COLOR_alertSuccess_100)
}

body#registrationPage #formSection article form #mysexEssexRow #regsexError {
    width: 100%
}

body#registrationPage #formSection article form #emailRow {
    padding-top: 10px
}

@media only screen and (min-width: 481px) {
    body#registrationPage #formSection article form .formElementWrapper {
        max-width:380px;
        margin: 0 auto
    }
}

body#registrationPage #formSection article form #emailNoticeBox,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg {
    position: absolute;
    bottom: 100%;
    right: 0;
    width: 100%;
    margin-bottom: 12px;
    padding: 20px;
    background-color: var(--COLOR_supportDark_500);
    font: var(--FONT_default_75);
    z-index: 3;
    border-radius: var(--borderRadius_75);
    border: 2px solid var(--COLOR_supportDark_100)
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #emailNoticeBox,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg {
        right:-332px;
        width: 316px;
        bottom: auto
    }
}

body#registrationPage #formSection article form #emailNoticeBox::before,body#registrationPage #formSection article form #emailNoticeBox::after,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::before,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::after {
    position: absolute;
    content: "";
    left: 50%;
    margin-left: -15px;
    top: 100%
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #emailNoticeBox::before,body#registrationPage #formSection article form #emailNoticeBox::after,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::before,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::after {
        left:-24px;
        margin-left: 0;
        top: 22px
    }
}

body#registrationPage #formSection article form #emailNoticeBox::after,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::after {
    border-style: solid;
    z-index: 1;
    margin-left: -13px;
    border-color: var(--COLOR_supportDark_500) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
    border-width: 12px 13px 9px 13px
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #emailNoticeBox::after,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::after {
        margin-left:5px;
        border-color: rgba(0,0,0,0) var(--COLOR_supportDark_500) rgba(0,0,0,0) rgba(0,0,0,0);
        border-width: 15px 9px 15px 12px
    }
}

body#registrationPage #formSection article form #emailNoticeBox::before,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::before {
    border-style: solid;
    z-index: 0;
    border-color: var(--COLOR_supportDark_100) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0);
    border-width: 15px 15px 9px 15px
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #emailNoticeBox::before,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::before {
        border-color:rgba(0,0,0,0) var(--COLOR_supportDark_100) rgba(0,0,0,0) rgba(0,0,0,0);
        border-width: 15px 9px 15px 15px
    }
}

body#registrationPage #formSection article form #emailNoticeBox {
    top: -130px
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #emailNoticeBox {
        top:-10px
    }
}

body#registrationPage #formSection article form #emailNoticeBox p {
    position: relative;
    margin: 12px 0;
    padding-left: 45px
}

body#registrationPage #formSection article form #emailNoticeBox p .wdk-icon {
    position: absolute;
    top: 0;
    left: 0;
    fill: var(--COLOR_supportDark_100);
    width: 24px;
    height: 24px
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg {
    border-color: var(--COLOR_primary_100)
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg {
        top:-50px
    }

    body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::before,body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::after {
        top: 65px
    }
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg.success {
    border-color: var(--COLOR_alertSuccess_100)
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg.success::before {
    border-color: var(--COLOR_alertSuccess_100) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0)
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg.success::before {
        border-color:rgba(0,0,0,0) var(--COLOR_alertSuccess_100) rgba(0,0,0,0) rgba(0,0,0,0)
    }
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::before {
    border-color: var(--COLOR_primary_100) rgba(0,0,0,0) rgba(0,0,0,0) rgba(0,0,0,0)
}

@media only screen and (min-width: 980px) {
    body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg::before {
        border-color:rgba(0,0,0,0) var(--COLOR_primary_100) rgba(0,0,0,0) rgba(0,0,0,0)
    }
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul {
    list-style-type: none;
    padding-left: 0
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li {
    position: relative;
    margin: 13px 0 0 0;
    display: flex;
    align-items: center
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li .wdk-icon {
    flex: 1 0 auto;
    width: 16px;
    width: 16px;
    height: 16px;
    fill: var(--COLOR_primary_100);
    margin-right: 4px
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li .wdk-icon.icon_check {
    display: none
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li.success {
    color: var(--COLOR_alertSuccess_100)
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li.success .wdk-icon {
    fill: var(--COLOR_alertSuccess_100)
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li.success .wdk-icon.icon_check {
    display: inline-block
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li.success .wdk-icon.icon_x {
    display: none
}

body#registrationPage #formSection article form #wdk-passwordRestrictionBox.t-profileReg ul li span {
    width: 100%
}

body#registrationPage #formSection article form #regFormSubmit {
    margin-top: 18px;
    font: var(--FONT_highlight_75);
    z-index: 2
}

body#registrationPage #formSection article form .socialSignOnSeparator {
    margin-top: 12px;
    margin-bottom: 12px
}

body#registrationPage #formSection article form .socialSignOnSeparator .speratorText {
    display: inline;
    padding-left: 18px;
    padding-right: 18px;
    background-color: var(--COLOR_supportLight_100);
    color: var(--COLOR_supportDark_300);
    font: var(--FONT_default_75)
}

body#registrationPage #formSection article form .speratorText {
    display: none
}

body#registrationPage #formSection article form #googleRegContainer {
    margin-top: 4px
}

body#registrationPage #formSection article form peg-turnstile {
    display: block;
    height: 0
}

body#registrationPage #formSection article form peg-turnstile[is-interactive-challenge] {
    margin-top: 18px;
    height: auto
}

body#registrationPage #formSection article #specialofferRow {
    font: var(--FONT_default_50);
    color: var(--COLOR_supportDark_300);
    margin-top: -16px
}

body#registrationPage #formSection article #legalText {
    font: var(--FONT_default_50);
    color: var(--COLOR_supportDark_300);
    text-align: center;
    max-width: 480px;
    margin: 0 auto
}

body#registrationPage #formSection article #legalText p {
    margin: 18px 0 0 0
}

body#registrationPage #formSection article #legalText a {
    color: var(--COLOR_supportDark_300)
}

body#registrationPage #formSection article #legalText a:hover {
    color: var(--COLOR_supportDark_300)
}

body#registrationPage footer .visibleOnMobile a {
    color: var(--COLOR_supportLight_100)
}

#genderSelectionPage.isNewGenderScreenEnabled {
    background: var(--COLOR_primary_100);
    background-attachment: fixed;
    font: var(--FONT_default_100)
}

#genderSelectionPage.isNewGenderScreenEnabled #header {
    display: none
}

#genderSelectionPage.isNewGenderScreenEnabled .infoText {
    margin: 40px 0;
    color: var(--COLOR_supportLight_100);
    font: var(--FONT_default_50)
}

#genderSelectionPage.isNewGenderScreenEnabled .infoText a {
    color: inherit
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper {
    background-color: rgba(0,0,0,0);
    min-height: calc(100vh - 140px);
    max-width: 95%
}

@media only screen and (min-width: 768px) {
    #genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper {
        max-width:720px
    }
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm {
    display: grid;
    grid-template-rows: auto 1fr auto;
    padding-top: 40px;
    min-height: calc(100vh - 140px)
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm h1 {
    font: var(--FONT_highlight_200);
    color: var(--COLOR_supportLight_100);
    margin: 0 0 64px 0;
    grid-row: 1
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm>div {
    grid-row: 2
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm>div ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    list-style: none;
    padding: 0
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm>div ul li input {
    position: absolute;
    opacity: 0
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm>div ul li label {
    display: block;
    width: 100%;
    padding: 17px 20px;
    font: var(--FONT_default_100);
    word-wrap: break-word;
    color: var(--COLOR_supportLight_100);
    background-color: var(--COLOR_supportLight_040);
    border-radius: var(--borderRadius_75);
    cursor: pointer
}

@media(pointer: fine) {
    #genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm>div ul li label:hover {
        background-color:var(--COLOR_supportLight_050)
    }
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm>div ul li input:checked+label {
    color: var(--COLOR_defaultText);
    background-color: var(--COLOR_supportLight_100)
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm>div ul li input:focus-visible+label {
    outline: 2px dashed currentcolor;
    outline-offset: 2px
}

#genderSelectionPage.isNewGenderScreenEnabled article.changeGenderWrapper #changeGenderForm .buttonWrapper {
    grid-row: 3;
    align-self: end;
    display: flex;
    justify-content: center
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) {
    font: var(--FONT_default_100)
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article {
    position: relative;
    z-index: 10;
    padding: 16px;
    background-color: var(--COLOR_supportLight_100);
    width: 95%;
    border-radius: var(--borderRadius_75);
    max-width: 540px;
    margin: 0 auto;
    color: var(--COLOR_defaultText)
}

@media only screen and (min-width: 768px) {
    #genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article {
        width:100%
    }
}

@media only screen and (min-width: 481px) {
    #genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article {
        padding-top:40px;
        position: static
    }
}

@media only screen and (min-width: 768px) {
    #genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article {
        padding:40px 60px;
        max-width: 550px
    }
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article h1 {
    margin: 0 0 1em 0;
    font: var(--FONT_default_200)
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article p {
    margin: 0
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article .form-row {
    margin: 28px 0
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article form {
    width: 100%
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article form button[type=submit] {
    width: 100%;
    margin-top: 30px
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article #legalText {
    font: var(--FONT_default_50);
    color: var(--COLOR_supportDark_300);
    text-align: center
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article #legalText p {
    margin: 18px 0 0 0
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article #legalText a {
    color: var(--COLOR_supportDark_300)
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) #formSection article #legalText a:hover {
    color: var(--COLOR_supportDark_300)
}

#genderSelectionPage:not(.isNewGenderScreenEnabled) footer .visibleOnMobile a {
    color: var(--COLOR_supportLight_100)
}

#searchGenderSelectionPage {
    background: var(--COLOR_primary_100);
    font: var(--FONT_default_100)
}

#searchGenderSelectionPage article.changeGenderWrapper {
    background-color: rgba(0,0,0,0);
    min-height: calc(100vh - 140px);
    max-width: 95%
}

@media only screen and (min-width: 768px) {
    #searchGenderSelectionPage article.changeGenderWrapper {
        max-width:720px
    }
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm {
    display: grid;
    grid-template-rows: auto 1fr auto;
    padding-top: 40px;
    min-height: calc(100vh - 140px)
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm h1 {
    font: var(--FONT_highlight_200);
    color: var(--COLOR_supportLight_100);
    margin: 0 0 64px 0;
    grid-row: 1
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div {
    grid-row: 2
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div ul {
    display: flex;
    flex-direction: column;
    gap: 8px;
    list-style: none;
    padding: 0
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div ul li input {
    position: absolute;
    opacity: 0
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div ul li label {
    display: block;
    width: 100%;
    padding: 17px 20px;
    font: var(--FONT_default_100);
    word-wrap: break-word;
    color: var(--COLOR_supportLight_100);
    background-color: var(--COLOR_supportLight_040);
    border-radius: 4px;
    cursor: pointer
}

@media(pointer: fine) {
    #searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div ul li label:hover {
        background-color:var(--COLOR_supportLight_050)
    }
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div ul li input:checked+label {
    color: var(--COLOR_defaultText);
    background-color: var(--COLOR_supportLight_100)
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div ul li input:focus-visible+label {
    outline: 2px dashed currentcolor;
    outline-offset: 2px
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div .infoText {
    margin: 40px 0;
    color: var(--COLOR_supportLight_100);
    font: var(--FONT_default_50)
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm>div .infoText a {
    color: inherit
}

#searchGenderSelectionPage article.changeGenderWrapper #changeSearchGenderForm .buttonWrapper {
    grid-row: 3;
    align-self: end;
    display: flex;
    justify-content: center
}