@charset "UTF-8";
/*!
 * BluBank Style
 * Copyright 2023 The BluBank Authors
 */
:root {
    --blu-text-color: #081F3C;
    --blu-text-secondary-color: #718E9C;
    --blu-colors-white: #FFF;
    --blu-colors-blue: #FF6600;
    --blu-colors-red: #FF0D3B;
    --blu-colors-green: #00AB84;
    --blu-colors-yellow: #BF9D00;
    --blu-colors-gray: #BFCCD3;
    --blu-colors-black: #081F3C;
    --blu-colors-surfaceHigh: #081F3C;
    --blu-colors-surfaceMedium: #718E9C;
    --blu-colors-surfaceDisable: #BFCCD3;
    --blu-colors-OnPrimary: #FFFFFF;
    --blu-colors-light: #F9F0E9;
    --blu-colors-lightSurfaceMedium: #F7F9FA;
    --blu-colors-lead: #718E9C;
    --blu-colors-footer-li: #718E9C;
    --blu-divider-color: #CCD6DC;
    --blu-btn-primary-bg: #Ff7d1a;
    --blu-btn-primary-bg-hovered: #FF6600;
    --blu-btn-primary-bg-pressed: #FF6600;
    --blu-btn-primary-bg-focused: #FF6600;
    --blu-btn-primary-bg-disabled: #BFCCD3;
    --blu-btn-primary-stroke: transparent;
    --blu-btn-primary-stroke-hovered: transparent;
    --blu-btn-primary-stroke-pressed: transparent;
    --blu-btn-primary-stroke-focused: transparent;
    --blu-btn-primary-stroke-disabled: transparent;
    --blu-btn-primary-text: #FFFFFF;
    --blu-btn-primary-text-hovered: #FFFFFF;
    --blu-btn-primary-text-pressed: #FFFFFF;
    --blu-btn-primary-text-focused: #FFFFFF;
    --blu-btn-primary-text-disabled: #718E9C;
    --blu-btn-secondary-bg: #FFFFFF;
    --blu-btn-secondary-bg-hovered: #F9F0E9;
    --blu-btn-secondary-bg-pressed: #DCE9FA;
    --blu-btn-secondary-bg-focused: #FFFFFF;
    --blu-btn-secondary-bg-disabled: #FFFFFF;
    --blu-btn-secondary-stroke: #FF6600;
    --blu-btn-secondary-stroke-hovered: #FF6600;
    --blu-btn-secondary-stroke-pressed: #FF6600;
    --blu-btn-secondary-stroke-focused: #FF6600;
    --blu-btn-secondary-stroke-disabled: #BFCCD3;
    --blu-btn-secondary-text: #FF6600;
    --blu-btn-secondary-text-hovered: #FF6600;
    --blu-btn-secondary-text-pressed: #FF6600;
    --blu-btn-secondary-text-focused: #FF6600;
    --blu-btn-secondary-text-disabled: #BFCCD3;
    --blu-btn-tertiary-bg: #F9F0E9;
    --blu-btn-tertiary-bg-hovered: #DDEAFA;
    --blu-btn-tertiary-bg-pressed: #CDE0F8;
    --blu-btn-tertiary-bg-focused: #F9F0E9;
    --blu-btn-tertiary-bg-disabled: #F2F5F6;
    --blu-btn-tertiary-stroke: transparent;
    --blu-btn-tertiary-stroke-hovered: transparent;
    --blu-btn-tertiary-stroke-pressed: transparent;
    --blu-btn-tertiary-stroke-focused: transparent;
    --blu-btn-tertiary-stroke-disabled: transparent;
    --blu-btn-tertiary-text: #FF6600;
    --blu-btn-tertiary-text-hovered: #FF6600;
    --blu-btn-tertiary-text-pressed: #FF6600;
    --blu-btn-tertiary-text-focused: #FF6600;
    --blu-btn-tertiary-text-disabled: #BFCCD3;
    --blu-btn-text-bg: transparent;
    --blu-btn-text-bg-hovered: #F9F0E9;
    --blu-btn-text-bg-pressed: #DDEAFA;
    --blu-btn-text-bg-focused: transparent;
    --blu-btn-text-bg-disabled: transparent;
    --blu-btn-text-stroke: transparent;
    --blu-btn-text-stroke-hovered: transparent;
    --blu-btn-text-stroke-pressed: transparent;
    --blu-btn-text-stroke-focused: transparent;
    --blu-btn-text-stroke-disabled: transparent;
    --blu-btn-text-text: #FF6600;
    --blu-btn-text-text-hovered: #FF6600;
    --blu-btn-text-text-pressed: #FF6600;
    --blu-btn-text-text-focused: #FF6600;
    --blu-btn-text-text-disabled: #BFCCD3;
    --blu-btn-white-bg: #FFFFFF;
    --blu-btn-white-bg-hovered: #F9F0E9;
    --blu-btn-white-bg-pressed: #DCE9FA;
    --blu-btn-white-bg-focused: #FFFFFF;
    --blu-btn-white-bg-disabled: #FFFFFF;
    --blu-btn-white-stroke: transparent;
    --blu-btn-white-stroke-hovered: transparent;
    --blu-btn-white-stroke-pressed: transparent;
    --blu-btn-white-stroke-focused: transparent;
    --blu-btn-white-stroke-disabled: transparent;
    --blu-btn-white-text: #FF6600;
    --blu-btn-white-text-hovered: #FF6600;
    --blu-btn-white-text-pressed: #FF6600;
    --blu-btn-white-text-focused: #FF6600;
    --blu-btn-white-text-disabled: #BFCCD3;
    --blu-btn-chip-selected-bg: #FF6600;
    --blu-btn-chip-selected-bg-hovered: #FF6600;
    --blu-btn-chip-selected-bg-pressed: #FF6600;
    --blu-btn-chip-selected-bg-focused: #FF6600;
    --blu-btn-chip-selected-bg-disabled: #BFCCD3;
    --blu-btn-chip-selected-stroke: transparent;
    --blu-btn-chip-selected-stroke-hovered: transparent;
    --blu-btn-chip-selected-stroke-pressed: transparent;
    --blu-btn-chip-selected-stroke-focused: transparent;
    --blu-btn-chip-selected-stroke-disabled: transparent;
    --blu-btn-chip-selected-text: #FFFFFF;
    --blu-btn-chip-selected-text-hovered: #FFFFFF;
    --blu-btn-chip-selected-text-pressed: #FFFFFF;
    --blu-btn-chip-selected-text-focused: #FFFFFF;
    --blu-btn-chip-selected-text-disabled: #718E9C;
    --blu-btn-chip-unselected-bg: #FFFFFF;
    --blu-btn-chip-unselected-bg-hovered: #F9F0E9;
    --blu-btn-chip-unselected-bg-pressed: #DCE9FA;
    --blu-btn-chip-unselected-bg-focused: #FFFFFF;
    --blu-btn-chip-unselected-bg-disabled: #FFFFFF;
    --blu-btn-chip-unselected-stroke: #F2F5F6;
    --blu-btn-chip-unselected-stroke-hovered: #F2F5F6;
    --blu-btn-chip-unselected-stroke-pressed: #F2F5F6;
    --blu-btn-chip-unselected-stroke-focused: #F2F5F6;
    --blu-btn-chip-unselected-stroke-disabled: #F2F5F6;
    --blu-btn-chip-unselected-text: #718E9C;
    --blu-btn-chip-unselected-text-hovered: #718E9C;
    --blu-btn-chip-unselected-text-pressed: #718E9C;
    --blu-btn-chip-unselected-text-focused: #718E9C;
    --blu-btn-chip-unselected-text-disabled: #BFCCD3;
    --blu-btn-faq-selected-bg: #FF6600;
    --blu-btn-faq-selected-bg-hovered: #FF6600;
    --blu-btn-faq-selected-bg-pressed: #FF6600;
    --blu-btn-faq-selected-bg-focused: #FF6600;
    --blu-btn-faq-unselected-bg: #FFFFFF;
    --blu-btn-faq-unselected-bg-hovered: #F9F0E9;
    --blu-btn-faq-unselected-bg-pressed: #DCE9FA;
    --blu-btn-faq-unselected-bg-focused: #FFFFFF;
    --blu-cards-bg-surface: #F2F5F6;
    --blu-cards-bg-blue: #F9F0E9;
    --blu-cards-bg-yellow: #FFF8DB;
    --blu-cards-bg-rose: #FBF2F3;
    --blu-cards-bg-red: #FBF2F3;
    --blu-cards-bg-green: #E5F7F4;
    --blu-cards-bg-purple: #F2F1F9;
    --blu-cards-bg-gold: #F8F6F1;
    --blu-cards-btn-bg: #FFFFFF;
    --blu-cards-btn-text: #FF6600;
    --blu-cards-btn-bg-hovered: #FF6600;
    --blu-cards-btn-text-hovered: #FFFFFF;
    --blu-card-color-selector-blue: #FF6600;
    --blu-card-color-selector-blue-hovered: #FF6600;
    --blu-card-color-selector-blue-pressed: #FF6600;
    --blu-card-color-selector-red: #FF0D3B;
    --blu-card-color-selector-red-hovered: #FF0D3B;
    --blu-card-color-selector-red-pressed: #FF0D3B;
    --blu-card-color-selector-green: #00AB84;
    --blu-card-color-selector-green-hovered: #00AB84;
    --blu-card-color-selector-green-pressed: #00AB84;
    --blu-card-color-selector-black: #000000;
    --blu-card-color-selector-black-hovered: #000000;
    --blu-card-color-selector-black-pressed: #000000;
    --blu-card-color-selector-white: #FFFFFF;
    --blu-card-color-selector-white-hovered: #FFFFFF;
    --blu-card-color-selector-white-pressed: #FFFFFF
}

@font-face {
    font-family: "IRANYekanXVF";
    src: url(../fonts/IRANYekanXVF.woff) format("woff"), url(../fonts/IRANYekanXVF.woff2) format("woff2")
}

@font-face {
    font-family: "Yekan Bakh VF";
    src: url('../font/woff/YekanBakh-VF.woff') format('woff'),
    url('../font/woff2/YekanBakh-VF.woff2') format('woff2');
}
body {
    -ms-overflow-style: none;
    scrollbar-width: none;
    font-family: "Yekan Bakh VF", tahoma, arial, serif;
    font-weight: 400;
    font-style: normal;
    color: var(--blu-colors-black);
    overflow-x: hidden;
    direction: rtl;
    text-align: right;
    letter-spacing: 0 !important;
    font-variation-settings: "DOTS" 1
}

body::-webkit-scrollbar {
    display: none
}

body {
}

.blu-fnt {
    letter-spacing: 0
}

.page-body p {
    font-weight: 400;
    font-size: 16px;
    line-height: 180%
}

.h1, .h2, .h3, .h4, .h5, .h6, .page-body p, h1, h2, h3, h4, h5, h6 {
    color: var(--blu-colors-black)
}

.headline-large, p.headline-large {
    font-size: 32px;
    color: var(--blu-colors-black)
}

p.headline-large {
    margin-bottom: 12px
}

.headline-medium, .page-title, p.headline-medium, p.page-title {
    font-size: 28px;
    color: var(--blu-colors-black)
}

.page-title, p.page-title {
    font-weight: 700;
    line-height: 160%
}

p.headline-medium {
    margin-bottom: 1rem
}

.headline-small, p.headline-small {
    font-size: 24px;
    color: var(--blu-colors-black)
}

p.headline-small {
    margin-bottom: 12px
}

.title-large, p.title-large {
    font-size: 20px
}

.title-medium, p.title-medium {
    font-size: 16px
}

.body-large, p.body-large {
    font-size: 18px
}

.page-subtitle, p.page-subtitle {
    font-weight: 400;
    font-size: 18px;
    line-height: 180%
}

.body-medium, p.body-medium {
    font-size: 16px
}

.body-small, .label-medium, p.body-small, p.label-medium {
    font-size: 14px
}

.sidebar-widget-li {
    margin-top: .5rem
}

.sidebar-widget-li a:hover {
    transition: ease 200ms
}

.blu-sidebar {
    border: 1px solid #f2f5f6;
    padding: 4rem 1rem
}

.sidebar-widgets {
    position: sticky;
    top: 200px
}

.page-topic.active a, .sidebar-widget-li a:hover {
    color: var(--blu-colors-blue)
}

.feature-icon {
    margin-bottom: 20px
}

.features-item-3 .feature-icon img {
    width: 56px;
    height: 56px
}

.features-item-6 .feature-icon img {
    width: 40px;
    height: 40px
}

.features-section {
    margin-bottom: 72px
}

.feature-content {
    padding: 0 40px;
    margin: 24px 0
}

.feature-content p {
    margin-bottom: .5rem
}

.blu-text-black {
    color: var(--blu-text-color)
}

.blu-text-secondary {
    color: var(--blu-text-secondary-color)
}

.blu-text-blue {
    color: var(--blu-colors-blue)
}

.blu-text-white {
    color: var(--blu-colors-white)
}

.blu-muted-text {
    color: var(--blu-colors-surfaceMedium)
}

.mt-12 {
    margin-top: .75rem !important
}

.mb-12 {
    margin-bottom: .75rem !important
}

.mb-16 {
    margin-bottom: 1rem !important
}

.mb-24 {
    margin-bottom: 1.5rem !important
}

.mb-32 {
    margin-bottom: 2rem !important
}

.mb-96 {
    margin-bottom: 6rem !important
}

.mt-40 {
    margin-top: 2.5rem !important
}

.px-36 {
    padding: 0 2.25rem
}

.px-96 {
    padding: 0 6rem
}

.p-40 {
    padding: 2.5rem
}

.blu-lead {
    color: #718e9c
}

.blu-white-space-24, .blu-white-space-48 {
    width: 100%;
    height: 1.5rem !important;
    padding: 0 !important;
    margin: 0 !important
}

.blu-white-space-48 {
    height: 3rem !important
}

.blu-white-space-128, .blu-white-space-200, .blu-white-space-64 {
    width: 100%;
    height: 4rem !important;
    padding: 0 !important;
    margin: 0 !important
}

.blu-white-space-128, .blu-white-space-200 {
    height: 8rem !important
}

.blu-white-space-200 {
    height: 12.5rem !important
}

.blu-fs-d-lg-64, .display-large, p.display-large {
    font-size: 4rem;
    font-weight: 800;
    line-height: 120%
}

.blu-fs-d-md-48, .display-medium, p.display-medium {
    font-size: 3rem;
    font-weight: 800;
    line-height: 160%
}

.blu-fs-d-sm-36, .display-small, p.display-small {
    font-size: 2.25rem;
    font-weight: 800;
    line-height: 160%
}

.blu-fs-h-lg-32, .headline-large, p.headline-large {
    font-size: 2rem;
    font-weight: 700;
    line-height: 160%
}

.blu-fs-h-md-28, .headline-medium, p.headline-medium {
    font-size: 1.75rem;
    font-weight: 700;
    line-height: 160%
}

.blu-fs-h-sm-24, .headline-small, p.headline-small {
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 160%
}

.blu-fs-t-lg-20, .title-large, p.title-large {
    font-size: 1.25rem !important;
    font-weight: 700;
    line-height: 160%
}

.blu-fs-t-md-16, .title-medium, p.title-medium {
    font-size: 1rem;
    font-weight: 600;
    line-height: 160%
}

.blu-fs-t-sm-14, .title-small, p.title-small {
    font-size: .875rem;
    font-weight: 600;
    line-height: 160%
}

.blu-fs-l-lg-18, .label-large, p.label-large {
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 175%
}

.blu-fs-l-md-14, .label-medium, p.label-medium {
    font-size: .875rem;
    font-weight: 500;
    line-height: 170%
}

.blu-fs-l-sm-12, .label-small, p.label-small {
    font-size: .75rem;
    font-weight: 500;
    line-height: 160%
}

.blu-fs-b-lg-18, .body-large, p.body-large {
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 180%
}

.blu-fs-b-md-16, .body-medium, p.body-medium {
    font-size: 1rem;
    font-weight: 400;
    line-height: 180%
}

.blu-fs-b-sm-14, .body-small, p.body-small {
    font-size: .875rem;
    font-weight: 400;
    line-height: 180%
}

.blu-badge {
    border: 0;
    font-size: .75rem;
    font-weight: 500;
    line-height: 160%;
    border-radius: 1rem;
    display: inline-block;
    cursor: default
}

.blu-badge-lg {
    padding: .25rem .75rem
}

.blu-badge-md {
    padding: .125rem .5rem
}

.blu-badge-sm {
    padding: 0 .375rem
}

.blu-badge-bg-blue, .blu-badge-bg-green, .blu-badge-bg-red {
    background-color: var(--blu-colors-blue) !important;
    color: var(--blu-colors-white) !important
}

.blu-badge-bg-green, .blu-badge-bg-red {
    background-color: var(--blu-colors-red) !important
}

.blu-badge-bg-green {
    background-color: var(--blu-colors-green) !important
}

.blu-badge-bg-black, .blu-badge-bg-gray, .blu-badge-bg-yellow {
    background-color: var(--blu-colors-yellow) !important;
    color: var(--blu-colors-white) !important
}

.blu-badge-bg-black, .blu-badge-bg-gray {
    background-color: var(--blu-colors-gray) !important
}

.blu-badge-bg-black {
    background-color: var(--blu-colors-black) !important
}

.blu-badge-bg-white {
    background-color: var(--blu-colors-white) !important;
    color: var(--blu-colors-black) !important
}

.blu-badge-text-blue, .blu-badge-text-red {
    background-color: transparent !important;
    color: var(--blu-colors-blue) !important
}

.blu-badge-text-red {
    color: var(--blu-colors-red) !important
}

.blu-badge-text-green, .blu-badge-text-yellow {
    background-color: transparent !important;
    color: var(--blu-colors-green) !important
}

.blu-badge-text-yellow {
    color: var(--blu-colors-yellow) !important
}

.blu-badge-text-black, .blu-badge-text-gray {
    background-color: transparent !important;
    color: var(--blu-colors-gray) !important
}

.blu-badge-text-black {
    color: var(--blu-colors-black) !important
}

.blu-divider-thin {
    border-top: .03125rem solid var(--blu-divider-color)
}

.blu-divider-regular {
    border-top: .0625rem solid var(--blu-divider-color)
}

.blu-divider-bold {
    border-top: .125rem solid var(--blu-divider-color)
}

.blu-divider-thin-dotted {
    border-top: .03125rem dashed var(--blu-divider-color)
}

.blu-divider-regular-dotted {
    border-top: .0625rem dashed var(--blu-divider-color)
}

.blu-divider-bold-dotted {
    border-top: .125rem dashed var(--blu-divider-color)
}

.blu-ficon {
    width: 1.5rem;
    height: 1.5rem
}

.blu-ficon-primary {
    color: var(--blu-colors-blue)
}

.blu-ficon-negative {
    color: var(--blu-colors-red)
}

.blu-ficon-warning {
    color: var(--blu-colors-yellow)
}

.blu-ficon-positive {
    color: var(--blu-colors-green)
}

.blu-ficon-surfaceHigh {
    color: var(--blu-colors-yellow)
}

.blu-btn, .btn {
    border-radius: .625rem;
    padding: .75rem 1.25rem;
    text-align: center;
    font-size: 1.125rem;
    font-weight: 500;
    line-height: 175%;
    color: var(--blu-colors-white);
    border: 0;
    transition: 200ms;
    text-decoration: none !important
    font-variation-settings: "DOTS" 1;
}

.blu-btn-icon-right {
    margin-left: .5rem
}

.blu-btn-icon-left {
    margin-right: .5rem
}

.blu-btn-chips {
    border-radius: 2.625rem;
    padding: .4375rem 1rem
}

.blu-btn-primary {
    background-color: var(--blu-btn-primary-bg);
    color: var(--blu-btn-primary-text);
    border-color: var(--blu-btn-primary-stroke)
}

.blu-btn-primary:hover {
    background-color: var(--blu-btn-primary-bg-hovered);
    color: var(--blu-btn-primary-text-hovered);
    border-color: var(--blu-btn-primary-stroke-hovered)
}

.blu-btn-primary:active {
    background-color: var(--blu-btn-primary-bg-pressed);
    color: var(--blu-btn-primary-text-pressed);
    border-color: var(--blu-btn-primary-stroke-pressed)
}

.blu-btn-primary:focus {
    background-color: var(--blu-btn-primary-bg-focused);
    color: var(--blu-btn-primary-text-focused);
    border-color: var(--blu-btn-primary-stroke-focused)
}

.blu-btn-primary:disabled {
    background-color: var(--blu-btn-primary-bg-disabled);
    color: var(--blu-btn-primary-text-disabled);
    border-color: var(--blu-btn-primary-stroke-disabled)
}

.blu-btn-secondary {
    background-color: var(--blu-btn-secondary-bg);
    color: var(--blu-btn-secondary-text);
    outline-offset: -.125rem;
    outline: var(--blu-btn-secondary-stroke) solid .125rem
}

.blu-btn-secondary:hover {
    background-color: var(--blu-btn-secondary-bg-hovered);
    color: var(--blu-btn-secondary-text-hovered);
    outline-color: var(--blu-btn-secondary-stroke-hovered)
}

.blu-btn-secondary:active {
    background-color: var(--blu-btn-secondary-bg-pressed);
    color: var(--blu-btn-secondary-text-pressed);
    outline-color: var(--blu-btn-secondary-stroke-pressed)
}

.blu-btn-secondary:focus {
    background-color: var(--blu-btn-secondary-bg-focused);
    color: var(--blu-btn-secondary-text-focused);
    outline-color: var(--blu-btn-secondary-stroke-focused);
    outline: .125rem solid !important;
    outline-offset: -.125rem
}

.blu-btn-secondary:disabled {
    background-color: var(--blu-btn-secondary-bg-disabled);
    color: var(--blu-btn-secondary-text-disabled);
    outline-color: var(--blu-btn-secondary-stroke-disabled)
}

.blu-btn-text {
    background-color: var(--blu-btn-text-bg);
    color: var(--blu-btn-text-text);
    border-color: var(--blu-btn-text-stroke)
}

.blu-btn-text:hover {
    background-color: var(--blu-btn-text-bg-hovered);
    color: var(--blu-btn-text-text-hovered);
    border-color: var(--blu-btn-text-stroke-hovered)
}

.blu-btn-text:active {
    background-color: var(--blu-btn-text-bg-pressed);
    color: var(--blu-btn-text-text-pressed);
    border-color: var(--blu-btn-text-stroke-pressed)
}

.blu-btn-text:focus {
    background-color: var(--blu-btn-text-bg-focused);
    color: var(--blu-btn-text-text-focused);
    border-color: var(--blu-btn-text-stroke-focused)
}

.blu-btn-text:disabled {
    background-color: var(--blu-btn-text-bg-disabled);
    color: var(--blu-btn-text-text-disabled);
    border-color: var(--blu-btn-text-stroke-disabled)
}

.blu-btn-white {
    background-color: var(--blu-btn-white-bg);
    color: var(--blu-btn-white-text);
    border-color: var(--blu-btn-white-stroke)
}

.blu-btn-white:hover {
    background-color: var(--blu-btn-white-bg-hovered);
    color: var(--blu-btn-white-text-hovered);
    border-color: var(--blu-btn-white-stroke-hovered)
}

.blu-btn-white:active {
    background-color: var(--blu-btn-white-bg-pressed);
    color: var(--blu-btn-white-text-pressed);
    border-color: var(--blu-btn-white-stroke-pressed)
}

.blu-btn-white:focus {
    background-color: var(--blu-btn-white-bg-focused);
    color: var(--blu-btn-white-text-focused);
    border-color: var(--blu-btn-white-stroke-focused)
}

.blu-btn-white:disabled {
    background-color: var(--blu-btn-white-bg-disabled);
    color: var(--blu-btn-white-text-disabled);
    border-color: var(--blu-btn-white-stroke-disabled)
}

.blu-btn-chips-selected {
    background-color: var(--blu-btn-chip-selected-bg);
    color: var(--blu-btn-chip-selected-text);
    border-color: var(--blu-btn-chip-selected-stroke)
}

.blu-btn-chips-selected:hover {
    background-color: var(--blu-btn-chip-selected-bg-hovered);
    color: var(--blu-btn-chip-selected-text-hovered);
    border-color: var(--blu-btn-chip-selected-stroke-hovered)
}

.blu-btn-chips-selected:active {
    background-color: var(--blu-btn-chip-selected-bg-pressed);
    color: var(--blu-btn-chip-selected-text-pressed);
    border-color: var(--blu-btn-chip-selected-stroke-pressed)
}

.blu-btn-chips-selected:focus {
    background-color: var(--blu-btn-chip-selected-bg-focused);
    color: var(--blu-btn-chip-selected-text-focused);
    border-color: var(--blu-btn-chip-selected-stroke-focused)
}

.blu-btn-chips-selected:disabled {
    background-color: var(--blu-btn-chip-selected-bg-disabled);
    color: var(--blu-btn-chip-selected-text-disabled);
    border-color: var(--blu-btn-chip-selected-stroke-disabled)
}

.blu-btn-chips-unselected {
    background-color: var(--blu-btn-chip-unselected-bg);
    color: var(--blu-btn-chip-unselected-text);
    outline-offset: -.125rem;
    outline: var(--blu-btn-chip-unselected-stroke) solid .125rem
}

.blu-btn-chips-unselected:hover {
    background-color: var(--blu-btn-chip-unselected-bg-hovered);
    color: var(--blu-btn-chip-unselected-text-hovered);
    border-color: var(--blu-btn-chip-unselected-stroke-hovered)
}

.blu-btn-chips-unselected:active {
    background-color: var(--blu-btn-chip-unselected-bg-pressed);
    color: var(--blu-btn-chip-unselected-text-pressed);
    border-color: var(--blu-btn-chip-unselected-stroke-pressed)
}

.blu-btn-chips-unselected:focus {
    background-color: var(--blu-btn-chip-unselected-bg-focused);
    color: var(--blu-btn-chip-unselected-text-focused);
    border-color: var(--blu-btn-chip-unselected-stroke-focused)
}

.blu-btn-chips-unselected:disabled {
    background-color: var(--blu-btn-chip-unselected-bg-disabled);
    color: var(--blu-btn-chip-unselected-text-disabled);
    border-color: var(--blu-btn-chip-unselected-stroke-disabled)
}

.text-truncate-ml {
    -webkit-line-clamp: 1
}

.text-truncate-ml, .text-truncate-ml-2, .text-truncate-ml-3, .text-truncate-ml-4, .text-truncate-ml-5 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical
}

.text-truncate-ml-2 {
    -webkit-line-clamp: 2
}

.text-truncate-ml-3 {
    -webkit-line-clamp: 3
}

.text-truncate-ml-4 {
    -webkit-line-clamp: 4
}

.text-truncate-ml-5 {
    -webkit-line-clamp: 5
}

.blu-topbar {
    padding: 0;
    text-align: center;
    font-weight: 500;
    font-size: .875rem;
    line-height: 170%;
    position: relative;
}

.blu-topbar .btn-close{
    position: absolute;
    right: 3%;
    top: calc(50% - 10px);
}

.blu-topbar-text {
    color: var(--blu-colors-black);
    background: var(--blu-colors-light)
}

.blu-topbar-image {
    display: block;
    padding-bottom: 0;
    background: url(../img/blujr-banner-desktop.png) no-repeat top center;
    background-size: cover;
    width: 100%;
    height: 4.5rem
}

.blu-topbar-background {
    background-image: linear-gradient(90deg, #90bff9 10%, #4389e0 50%, #90bff9 90%);
    padding-bottom: 0
}

.sticky-top {
    z-index: 99999
}

.navbar {
    padding: 0
}

header .nav-item {
    padding: 0 0 0 .5rem
}

header .blu-nav-link li, header .nav-link, header .navbar li a:not(.blu-btn) {
    padding: 1.5rem 1rem;
    color: #081f3c;
    text-align: center;
    font-weight: 500;
    font-size: .875rem;
    line-height: 170%
}

header .navbar-expand-lg .navbar-nav .nav-link {
    padding: 1.5rem 1rem
}

header .dropdown-menu[data-bs-popper] {
    top: 105%
}

header .dropdown-menu {
    box-shadow: 0 -1px 1px rgba(0, 0, 0, .02), 0 8px 16px rgba(0, 0, 0, .04)
}

.blu-brand {
    margin-left: 3rem
}

.blu-navbar-nav {
    margin: 0 3rem
}

.dropdown-toggle::after {
    margin-right: initial;
    vertical-align: initial;
    content: "";
    border: 0
}

.megamenu .nav-item-list li a, header .megamenu .nav-item-list li {
    border-radius: .625rem;
    padding: .5rem;
    font-weight: 500;
    font-size: .875rem;
    line-height: 170%;
    margin-left: .25rem;
    margin-top: .25rem
}

.megamenu .nav-item-list li .nav-item-icon {
    padding: .25rem;
    margin-left: .5rem;
    display: inline-block
}

.megamenu .nav-item-list li:hover {
    background-color: var(--blu-colors-light)
}

.blu-card-btn svg path, .megamenu .nav-item-list li:hover .nav-item-icon svg path, .rounded-box-btn svg path {
    fill: var(--blu-colors-blue)
}

.megamenu .nav-item-list li:hover:after {
    content: url(../icons/left-arrow.svg);
    float: left;
    color: var(--blu-colors-blue)
}

.hero-section {
    height: calc(100vh - 200px);
    position: relative;
    overflow: hidden;
    transition: 300ms
}

.hero-footer-sign {
    text-align: center;
    position: absolute;
    bottom: 0;
    right: calc(50% - 42px)
}

.blur-background {
    position: absolute;
    mix-blend-mode: hard-light;
    opacity: .85;
    width: 180px;
    height: 200px;
    top: 10%;
    left: 25%
}

.blur-circle {
    width: 120px;
    height: 160px;
    filter: blur(120px);
    position: absolute;
    left: 205px;
    top: 117px;
    background: #FF6600
}

.blur-circle:first-child {
    left: 265px;
    top: 77px;
    background: #FF6600
}

.blur-circle:last-child {
    left: 145px;
    top: 157px;
    background: #ff0d3b;
    opacity: .6
}

.blu-faq-question {
    padding: 30.125rem 1.5rem;
    border-radius: .625rem;
    color: var(--blu-colors-black);
    font-weight: 700;
    font-size: 1.25rem;
    line-height: 160%;
    border-bottom: .03125rem solid var(--blu-divider-color);
    background-color: var(--blu-btn-faq-unselected-bg)
}

.blu-faq-question:hover {
    background-color: var(--blu-btn-faq-unselected-bg-hovered)
}

.blu-faq-question:active {
    background-color: var(--blu-btn-faq-unselected-bg-pressed)
}

.blu-faq-question:focus {
    background-color: var(--blu-btn-faq-unselected-bg-focused)
}

.blu-faq-question-selected {
    color: var(--blu-colors-white);
    background-color: var(--blu-btn-faq-selected-bg)
}

.blu-faq-question-selected:hover {
    background-color: var(--blu-btn-faq-selected-bg-hovered)
}

.blu-faq-question-selected:active {
    background-color: var(--blu-btn-faq-selected-bg-pressed)
}

.blu-faq-question-selected:focus {
    background-color: var(--blu-btn-faq-selected-bg-focused)
}

.select-blue-color, .select-green-color, .select-red-color,
.select-yellow-color, .select-purple-color, .select-rosegold-color,
.select-black-color,.select-horiz-purple-color,.select-black-doodle-color,
.select-white-doodle-color,.select-color-doodle-color,
.select-explorer-color,
.select-game-doodle-color,
.select-dreamer-color,
.select-player-hero-color,
.select-cool-doodle-color,
.select-car-hero-color,
.select-artist-color
{
    border-color: transparent
}

.card-section {
    background: #eef4fc;
}

.select-blue-color:has(.selected), .select-blue-color:hover {
    border-color: var(--blu-card-color-selector-blue)
}

.select-blue-color .color-selection {
    background-color: #4E91E6;
}

.select-green-color:has(.selected), .select-green-color:hover {
    border-color: var(--blu-card-color-selector-blue)
}

.select-green-color .color-selection {
    background-color: var(--blu-card-color-selector-green)
}

.select-red-color:has(.selected), .select-red-color:hover {
    border-color: var(--blu-card-color-selector-blue)
}

.select-red-color .color-selection {
    background-color: var(--blu-card-color-selector-red)
}

.select-yellow-color .color-selection {
    background-color: #FFD100;
}
.select-purple-color .color-selection {
    background-color: #6558B1;
}
.select-rosegold-color .color-selection {
    background-color: #E1A6AD;
}

.select-horiz-purple-color .color-selection {
    background-color: #6558B1;
}
.select-color-doodle-color .color-selection {
    background-color: #E1A6AD;
}
.select-black-doodle-color .color-selection {
    background-color: #333;
}
.select-white-doodle-color .color-selection {
    background-color: #fff;
}
.select-explorer-color .color-selection {
    background-color: #2305A2;
}
.select-game-doodle-color .color-selection {
    background-color: #FC6500;
}
.select-dreamer-color .color-selection {
    background-color: #A996C3;
}
.select-player-hero-color .color-selection {
    background-color: #0085B0;
}
.select-cool-doodle-color .color-selection {
    background-color: #EB7BA9;
}
.select-car-hero-color .color-selection {
    background-color: #141414;
}
.select-artist-color .color-selection {
    background-color: #A5B946;
}

.horiz-card .card-data-section {
    padding: 0;
}
.card-section:has(#card-video-item-blue.selected),.card-render-blue .card-section{
    background-color: #eef4fc;
}
.card-section:has(#card-video-item-red.selected),.card-render-red .card-section{
    background-color: #fcf2f4;
}
.card-section:has(#card-video-item-green.selected),.card-render-green .card-section{
    background-color: #e5f8f3;
}
.card-section:has(#card-video-item-horiz-purple.selected),.card-render-horiz-purple .card-section{
    background-color: #e4e3f1;
}
.card-section:has(#card-video-item-color-doodle.selected),.card-render-color-doodle .card-section{
    background-color: #f5eceb;
}
.card-section:has(#card-video-item-black-doodle.selected),.card-render-black-doodle .card-section{
    background-color: #e1e1e1;
}
.card-section:has(#card-video-item-white-doodle.selected),.card-render-white-doodle .card-section{
    background-color: #e1e1e1;
}

.card-section:has(#card-video-item-explorer.selected),.card-render-explorer .card-section{
    background-color: #eeeef8;
}
.card-section:has(#card-video-item-game-doodle.selected),.card-render-game-doodle .card-section{
    background-color: #fce8de;
}
.card-section:has(#card-video-item-dreamer.selected),.card-render-dreamer .card-section{
    background-color: #e8e8f3;
}
.card-section:has(#card-video-item-player-hero.selected),.card-render-player-hero .card-section{
    background-color: #e9eef7;
}
.card-section:has(#card-video-item-cool-doodle.selected),.card-render-cool-doodle .card-section{
    background-color: #f8e8f1;
}
.card-section:has(#card-video-item-car-hero.selected),.card-render-car-hero .card-section{
    background-color: #ededed;
}
.card-section:has(#card-video-item-artist.selected),.card-render-artist .card-section{
    background-color: #e5f0f0;
}

.hideEl{
    display: none !important;
}

.select-black-color .color-selection {
    background-color: #333;
}

.rounded-box {
    border-radius: 1.5rem;
    padding: 3rem;
    position: relative
}

.rounded-box-pb-0 {
    padding-bottom: 0
}

.blu-bg-surface {
    background-color: var(--blu-cards-bg-surface)
}

.blu-bg-blue {
    background-color: var(--blu-cards-bg-blue)
}

.blu-bg-yellow {
    background-color: var(--blu-cards-bg-yellow)
}

.blu-bg-rose {
    background-color: var(--blu-cards-bg-rose)
}

.blu-bg-red {
    background-color: var(--blu-cards-bg-red)
}

.blu-bg-green {
    background-color: var(--blu-cards-bg-green)
}

.blu-bg-purple {
    background-color: var(--blu-cards-bg-purple)
}

.blu-bg-gold {
    background-color: var(--blu-cards-bg-gold)
}

.blu-card-btn, .rounded-box-btn {
    width: 3.5rem;
    height: 3.5rem;
    padding: .75rem;
    text-align: center;
    background-color: var(--blu-colors-white);
    border: .0625rem solid #f2f5f6;
    border-radius: 6.25rem;
    color: var(--blu-colors-blue)
}

.blu-card-btn:hover, .rounded-box-btn:hover, .rounded-box:hover .blu-card-btn, .rounded-box:hover .rounded-box-btn {
    background-color: var(--blu-colors-blue);
    border: 0;
    color: var(--blu-colors-white)
}

.blu-card-btn:hover svg path, .rounded-box-btn:hover svg path, .rounded-box:hover .blu-card-btn svg path, .rounded-box:hover .rounded-box-btn svg path {
    fill: var(--blu-colors-white)
}

.card-video {
    position: relative
}

.card-video-item {
    position: absolute;
    left: 0
}

.card-video video {
    opacity: 0
}

.card-video video.visible {
    opacity: 1
}

.blu-line-text-title {
    font-size: 20px;
    font-weight: 700;
    line-height: 160%;
    color: var(--blu-colors-white);
    margin-bottom: 8px
}

.bluline-features-item {
    margin-bottom: 1rem;
    padding: .5rem
}

.bluline-features-item p {
    margin-bottom: .5rem
}

.circle-icon {
    margin: 0 0 0 1rem
}

.tweets {
    padding: 40px 0
}

.tweet-item {
    padding: 2rem;
    border-radius: 1rem;
    background-color: var(--blu-colors-lightSurfaceMedium)
}

.tweet-text {
    font-weight: 500;
    font-size: 12px;
    line-height: 160%
}

.tweet-date, .tweet-user {
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 160%;
    font-weight: 600
}

.tweet-date {
    font-size: 12px;
    font-weight: 500;
    color: #718e9c
}

.teaser-content {
    padding: 48px 80px
}

.teaser-content p {
    margin-top: 16px;
    margin-bottom: 24px
}

.blu-accordion-item {
    border-radius: 10px;
    border: 0;
    margin-top: 2px
}

.accordion-item:first-of-type .accordion-button {
    border-radius: 10px 10px 0 0
}

.accordion-item:first-of-type .accordion-button.collapsed {
    border-radius: 10px
}

.accordion-button:not(.collapsed), .blu-accordion-header:not(.collapsed) {
    border-radius: 10px 10px 0 0
}

.blu-accordion-item.collapsed {
    border-radius: 10px
}

.accordion-button.blu-accordion-button {
    border-radius: 10px 10px 0 0
}

.blu-accordion-button.collapsed {
    border-radius: 10px
}

.blu-accordion-item:last-of-type, .blu-accordion-item:last-of-type .blu-accordion-button.collapsed {
    border-radius: 10px
}

.blu-accordion-button.collapsed {
    border: 0
}

.blu-accordion-item:not(:first-of-type) {
    border: 0
}

.blu-accordion-button {
    background-color: #fff;
    transition: .3s;
    border-radius: 10px;
    padding: 2rem 1.5rem
}

.blu-accordion-button:before {
    margin: 0 0 0 1.5rem;
    padding: 0
}

.accordion-button:hover {
    background-color: #eaf2fc
}

.accordion-button:active {
    background-color: #dce9fa
}

.accordion-button:focus {
    background-color: #fff;
    box-shadow: inset 0 0 0 4px rgba(78, 145, 230, .2)
}

.blu-accordion-button:not(.collapsed) {
    background-color: #ff7d1a;
    border-radius: 10px 10px 0 0;
    box-shadow: none
}

.accordion-button:not(.collapsed):hover {
    background-color: #ff7d1a
}

.accordion-button:not(.collapsed):active {
    background-color: #FF6600
}

.accordion-button:not(.collapsed):focus {
    background-color: #ff7d1a
}

.blu-divider-1x-solid {
    border-top: 1px solid #f1f1f1
}

.blu-accordion-collapse.collapsing, .blu-accordion-collapse.show {
    background-color: #ff7d1a;
    color: #fff;
    border-radius: 0 0 10px 10px;
    padding: 0 1.5rem
}

.blu-accordion-body {
    font-size: 18px;
    font-weight: 500;
    line-height: 175%;
    padding: 0 39px 2rem 0;
    margin: 0 13px 0 0
}

.accordion-button:after {
    background-image: none;
    width: 0;
    height: 0
}

.accordion {
    border-bottom: 0
}

.rounded-box-footer {
    position: relative;
    overflow: hidden
}

.rounded-box-btn {
    position: absolute;
    bottom: 10%;
    right: 5%;
    z-index: 9
}

footer .nav-item {
    text-align: right;
    margin-bottom: 1rem;
    padding: 0
}
@media (max-width: 576px){
    footer .nav-item {
        text-align: center;
    }
}

.blu-footer-row-menu {
    padding: 3.5rem 0
}

.blu-footer-row-copyright {
    padding: 2rem 0
}

footer p, footer ul {
    margin: 0
}

.ads-banner-wrapper {
    position: relative
}
.blu-topbar {
    display: block;
    padding: 0 !important;
}

.blu-topbar img {
    margin: 0
}

.ads-banner-wrapper .btn-close {
    position: absolute;
    right: 3%;
    top: calc(50% - 10px);
    --bs-btn-close-bg: url(/assets/icons/close.svg)
}