@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; /* Internet Explorer 10+ */
    scrollbar-width: none; /* Firefox */
    font-variation-settings: "DOTS" 1;
    letter-spacing: -0.03em;
}

body::-webkit-scrollbar {
    display: none; /* Safari and Chrome */
}

body {
    font-family: "Yekan Bakh VF", tahoma, arial, serif;
    font-weight: normal;
    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;*/
    font-variation-settings: "DOTS" 1;
    letter-spacing: -0.03em;
}

body, .blu-fnt {
    letter-spacing: 0;
}

.page-body p {
    font-weight: 400;
    font-size: 16px;
    line-height: 180%;
    color: var(--blu-colors-black);
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    color: var(--blu-colors-black);
}

.headline-large, p.headline-large {
    font-weight: 700;
    font-size: 32px;
    line-height: 160%;
    color: var(--blu-colors-black);
}

p.headline-large {
    margin-bottom: 12px;
}

.headline-medium, p.headline-medium, .page-title, p.page-title {
    font-weight: 700;
    font-size: 28px;
    line-height: 160%;
    color: var(--blu-colors-black);
}

p.headline-medium {
    margin-bottom: 1rem;
}

.headline-small, p.headline-small {
    font-weight: 700;
    font-size: 24px;
    line-height: 160%;
    color: var(--blu-colors-black);
}

p.headline-small {
    margin-bottom: 12px;
}

.title-large,p.title-large{
    font-weight: 700;
    font-size: 20px;
    line-height: 160%;
}

.title-medium, p.title-medium {
    font-weight: 600;
    font-size: 16px;
    line-height: 160%;
}

.body-large, p.body-large, .page-subtitle, p.page-subtitle {
    font-weight: 400;
    font-size: 18px;
    line-height: 180%;
}

.body-medium, p.body-medium {
    font-weight: 400;
    font-size: 16px;
    line-height: 180%;
}

.body-small, p.body-small {
    font-weight: 400;
    font-size: 14px;
    line-height: 180%;
}

.label-medium, p.label-medium {
    font-weight: 500;
    font-size: 14px;
    line-height: 170%;
}

.sidebar-widget-li {
    margin-top: .5rem;
}

.sidebar-widget-li a:hover {
    color: var(--blu-colors-blue);
    transition: ease 200ms;
}

.blu-sidebar {
    border: 1px solid #F2F5F6;
    padding: 4rem 1rem;
}

.sidebar-widgets{
    position: sticky;
    top: 200px;
}

.page-topic.active a{
    color: var(--blu-colors-blue);
}

.feature-wrapper {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}
.feature-intro{
    flex: none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: relative;
    flex: 1 1 25%;
    padding: 1rem;
}
.feature-intro:not(:last-child):after{
    content: url("/assets/icons/arrow-arc.svg");
    position: absolute;
    left: -20px; /*half of shape size*/
    top: 25%;
}
.blujr-icon-square-box{
    width: 3.5rem;
    height: 3.5rem;
    border-radius : .625rem;
    background: #FF7D1A linear-gradient(#ff8221, #ffaa68);
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 1.5rem;
}
.feature-intro:nth-child(1) .blujr-icon-square-box:after {
    content: "۱";
}
.feature-intro:nth-child(2) .blujr-icon-square-box:after {
    content: "۲";
}
.feature-intro:nth-child(3) .blujr-icon-square-box:after {
    content: "۳";
}
.feature-intro:nth-child(4) .blujr-icon-square-box:after {
    content: "۴";
}
.feature-intro:nth-child(5) .blujr-icon-square-box:after {
    content: "۵";
}
.feature-intro:nth-child(6) .blujr-icon-square-box:after {
    content: "۶";
}
.feature-intro:nth-child(7) .blujr-icon-square-box:after {
    content: "۷";
}
.feature-intro:nth-child(8) .blujr-icon-square-box:after {
    content: "۸";
}
.feature-intro:nth-child(9) .blujr-icon-square-box:after {
    content: "۹";
}
.feature-intro:nth-child(10) .blujr-icon-square-box:after {
    content: "۱۰";
}
@media (max-width: 600px) {
    .feature-intro:not(:last-child):after {
        transform: rotate(269deg);
        margin: 1.5rem 0 2.5rem;
        position: initial;
    }
}
.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 {
    width: 100%;
    height: 1.5rem !important;
    padding: 0 !important;
    margin: 0 !important;
}

.blu-white-space-48 {
    width: 100%;
    height: 3rem !important;
    padding: 0 !important;
    margin: 0 !important;
}

.blu-white-space-64 {
    width: 100%;
    height: 4rem !important;
    padding: 0 !important;
    margin: 0 !important;
}

.blu-white-space-128 {
    width: 100%;
    height: 8rem !important;
    padding: 0 !important;
    margin: 0 !important;
}

.blu-white-space-200 {
    width: 100%;
    height: 12.5rem !important;
    padding: 0 !important;
    margin: 0 !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: 0.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: 0.875rem;
    font-weight: 500;
    line-height: 170%;
}

.blu-fs-l-sm-12,.label-small,p.label-small {
    font-size: 0.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: 0.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: 0.125rem .5rem;
}

.blu-badge-sm {
    padding: 0 .375rem;
}

.blu-badge-bg-blue {
    background-color: var(--blu-colors-blue) !important;
    color: var(--blu-colors-white) !important;;
}

.blu-badge-bg-red {
    background-color: var(--blu-colors-red) !important;;
    color: var(--blu-colors-white) !important;;
}

.blu-badge-bg-green {
    background-color: var(--blu-colors-green) !important;;
    color: var(--blu-colors-white) !important;;
}

.blu-badge-bg-yellow {
    background-color: var(--blu-colors-yellow) !important;
    color: var(--blu-colors-white) !important;;
}

.blu-badge-bg-gray {
    background-color: var(--blu-colors-gray) !important;;
    color: var(--blu-colors-white) !important;;
}

.blu-badge-bg-black {
    background-color: var(--blu-colors-black) !important;;
    color: var(--blu-colors-white) !important;;
}

.blu-badge-bg-white {
    background-color: var(--blu-colors-white) !important;
    color: var(--blu-colors-black) !important;
}

.blu-badge-text-blue {
    background-color: transparent !important;
    color: var(--blu-colors-blue) !important;
}

.blu-badge-text-red {
    background-color: transparent !important;
    color: var(--blu-colors-red) !important;
}

.blu-badge-text-green {
    background-color: transparent !important;
    color: var(--blu-colors-green) !important;
}

.blu-badge-text-yellow {
    background-color: transparent !important;
    color: var(--blu-colors-yellow) !important;
}

.blu-badge-text-gray {
    background-color: transparent !important;
    color: var(--blu-colors-gray) !important;
}

.blu-badge-text-black {
    background-color: transparent !important;
    color: var(--blu-colors-black) !important;
}

.blu-divider-thin {
    border-top: 0.03125rem solid var(--blu-divider-color);
}

.blu-divider-regular {
    border-top: 0.0625rem solid var(--blu-divider-color);
}

.blu-divider-bold {
    border-top: 0.125rem solid var(--blu-divider-color);
}

.blu-divider-thin-dotted {
    border-top: 0.03125rem dashed var(--blu-divider-color);
}

.blu-divider-regular-dotted {
    border-top: 0.0625rem dashed var(--blu-divider-color);
}

.blu-divider-bold-dotted {
    border-top: 0.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);
}

.btn, .blu-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;
}

.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);*/
    background-color: var(--blu-btn-primary-bg-focused);
    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: -0.125rem;
    outline: var(--blu-btn-secondary-stroke) solid 0.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: 0.125rem solid !important;
    outline-offset: -0.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-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);
    /*border: 2px solid;*/
    /*border-color: var(--blu-btn-chip-unselected-stroke);*/
    outline-offset: -0.125rem;
    outline: var(--blu-btn-chip-unselected-stroke) solid 0.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, .text-truncate-ml-2, .text-truncate-ml-3, .text-truncate-ml-4, .text-truncate-ml-5 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -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: 1.625rem 3rem;
    text-align: center;
    font-weight: 500;
    font-size: .875rem;
    line-height: 170%;
}

.blu-topbar-text {
    color: var(--blu-colors-black);
    background: var(--blu-colors-light);
}

.blu-topbar-image {
    padding-bottom: 0;
    background: url("../img/blujr-banner-desktop.png") no-repeat top center;
    background-size: cover;
    height: 4.5rem;
}

.blu-topbar-background {
    background-image: linear-gradient(90deg, #90bff9 10%, #4389e0 50%, #90bff9 90%);
    padding-bottom: 0;
}

.btn-close {

}

.sticky-top {
    z-index: 99999;
}

.navbar {
    padding: 0;
}

header .nav-item {
    padding: 0 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: 0.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: 0px -1px 1px rgba(0, 0, 0, 0.02), 0px 8px 16px rgba(0, 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;
}

header .megamenu .nav-item-list li, .megamenu .nav-item-list li a {
    border-radius: 0.625rem;
    padding: 0.5rem;
    font-weight: 500;
    font-size: 0.875rem;
    line-height: 170%;
    margin-left: 0.25rem;
    margin-top: 0.25rem;
}

.megamenu .nav-item-list li .nav-item-icon {
    padding: 0.25rem;
    margin-left: 0.5rem;
    display: inline-block;
}

.megamenu .nav-item-list li:hover {
    background-color: var(--blu-colors-light);
}

.megamenu .nav-item-list li:hover .nav-item-icon 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 - 150px);
    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: 0.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: 0.6;
}

.blu-faq-question {
    padding: 30.125rem 1.5rem;
    border-radius: 0.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 {
    border-color: transparent;
}

.select-blue-color:hover, .select-blue-color:has(.selected) {
    border-color: var(--blu-card-color-selector-blue);
}

.select-blue-color .color-selection {
    background-color: var(--blu-card-color-selector-blue);
}

.select-green-color {
    border-color: transparent;
}

.select-green-color:hover, .select-green-color:has(.selected) {
    /*border-color: #369c1a;*/
    border-color: var(--blu-card-color-selector-blue);
}

.select-green-color .color-selection {
    background-color: var(--blu-card-color-selector-green);
}

.select-yellow-color .color-selection {
    background-color: #FFD100;
}
.select-purple-color .color-selection {
    background-color: #6558B1;
}
.select-rose-gold-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;
}

.select-red-color {
    border-color: transparent;
}

.select-red-color:hover, .select-red-color:has(.selected) {
    /*border-color: #c61d3f;*/
    border-color: var(--blu-card-color-selector-blue);
}

.select-red-color .color-selection {
    background-color: var(--blu-card-color-selector-red);
}

.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);
}

.rounded-box-btn, .blu-card-btn {
    width: 3.5rem;
    height: 3.5rem;
    padding: .75rem;
    text-align: center;
    background-color: var(--blu-colors-white);
    border: 0.0625rem solid #F2F5F6;
    border-radius: 6.25rem;
    color: var(--blu-colors-blue);
}

.rounded-box-btn svg path, .blu-card-btn svg path {
    fill: var(--blu-colors-blue);
}

.rounded-box-btn:hover, .blu-card-btn:hover, .rounded-box:hover .rounded-box-btn, .rounded-box:hover .blu-card-btn {
    background-color: var(--blu-colors-blue);
    border: 0;
    color: var(--blu-colors-white);
}

.rounded-box-btn:hover svg path, .blu-card-btn:hover svg path, .rounded-box:hover .rounded-box-btn svg path, .rounded-box:hover .blu-card-btn svg path {
    fill: var(--blu-colors-white);
}

.card-video {
    position: relative;
}

.card-video-item {
    position: absolute;
    left: 0;
}

.card-video video {
    /*visibility: hidden;*/
    opacity: 0;
}

.card-video video.visible {
    /*visibility: 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-user {
    margin: 0;
    padding: 0;
    font-size: 14px;
    line-height: 160%;
    font-weight: 600;
}

.tweet-date {
    margin: 0;
    padding: 0;
    font-size: 12px;
    line-height: 160%;
    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;
}

.accordion-item:first-of-type .accordion-button {
    border-radius: 10px 10px 0 0;
}

.accordion-item:first-of-type .accordion-button.collapsed {
    border-radius: 10px;
}

.blu-accordion-header:not(.collapsed) {
    border-radius: 10px 10px 0 0;
}

.accordion-button: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 {
    border-radius: 10px;
}

.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, 0.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;
    /*box-shadow: inset 0 0 0 4px rgba(78, 145, 230, 0.2);*/
}

.blu-accordion-button {
    padding: 2rem 1.5rem;
}

.blu-divider-1x-solid {
    border-top: 1px solid #f1f1f1;
}

.blu-accordion-collapse.show, .blu-accordion-collapse.collapsing {
    background-color: #ff7d1a;
    color: #fff;
    border-radius: 0 0 10px 10px;
    padding: 0 1.5rem 0;
}

.blu-accordion-body {
    font-size: 18px;
    font-weight: 500;
    line-height: 175%;
    padding: 0 39px 2rem 0;
    margin: 0 13px 0 0;
    /*border-right: 2px solid #F9F0E9;*/
}

.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;
}

.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)
}






























