/**
* Wrappers
*/

.container,
.container-fluid {
    width: 100%;
    padding-right: var(--bs-gutter-x, 22px);
    padding-left: var(--bs-gutter-x, 22px);
    margin-right: auto;
    margin-left: auto;
}

.container {
    max-width: 1306px;
}

@media (min-width: 768px) {
    .container,
    .container-fluid {
        padding-right: var(--bs-gutter-x, 52px);
        padding-left: var(--bs-gutter-x, 52px);
    }
}

@media (min-width: 1200px) {
    .container,
    .container-fluid {
        padding-right: var(--bs-gutter-x, 63px);
        padding-left: var(--bs-gutter-x, 63px);
    }
}

@media (min-width: 1367px) {
    .container,
    .container-fluid {
        padding-right: var(--bs-gutter-x, 21px);
        padding-left: var(--bs-gutter-x, 21px);
    }
}

/**
* Grid System
*/

.row {
    --bs-gutter-x: 19px;
    display: flex;
    flex-wrap: wrap;
    margin-right: calc(var(--bs-gutter-x) * -.5);
    margin-left: calc(var(--bs-gutter-x) * -.5);
}

.row>* {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
}

.col {
    flex: 1 0 0%;
}

.col-auto {
    flex: 0 0 auto;
    width: auto;
}

/* XXS Grid (Default) */
.col-xxs-1 { flex: 0 0 auto; width: 8.33333333%; }
.col-xxs-2 { flex: 0 0 auto; width: 16.66666667%; }
.col-xxs-3 { flex: 0 0 auto; width: 25%; }
.col-xxs-4 { flex: 0 0 auto; width: 33.33333333%; }
.col-xxs-5 { flex: 0 0 auto; width: 41.66666667%; }
.col-xxs-6 { flex: 0 0 auto; width: 50%; }
.col-xxs-7 { flex: 0 0 auto; width: 58.33333333%; }
.col-xxs-8 { flex: 0 0 auto; width: 66.66666667%; }
.col-xxs-9 { flex: 0 0 auto; width: 75%; }
.col-xxs-10 { flex: 0 0 auto; width: 83.33333333%; }
.col-xxs-11 { flex: 0 0 auto; width: 91.66666667%; }
.col-xxs-12 { flex: 0 0 auto; width: 100%; }

.col-xxs-offset-1 { margin-left: 8.33333333%; }
.col-xxs-offset-2 { margin-left: 16.66666667%; }
.col-xxs-offset-3 { margin-left: 25%; }
.col-xxs-offset-4 { margin-left: 33.33333333%; }
.col-xxs-offset-5 { margin-left: 41.66666667%; }
.col-xxs-offset-6 { margin-left: 50%; }
.col-xxs-offset-7 { margin-left: 58.33333333%; }
.col-xxs-offset-8 { margin-left: 66.66666667%; }
.col-xxs-offset-9 { margin-left: 75%; }
.col-xxs-offset-10 { margin-left: 83.33333333%; }
.col-xxs-offset-11 { margin-left: 91.66666667%; }

/* XS Grid (600px and up) */
@media (min-width: 600px) {
    .col-xs-auto { flex: 0 0 auto; width: auto; }
    .col-xs-1 { flex: 0 0 auto; width: 8.33333333%; }
    .col-xs-2 { flex: 0 0 auto; width: 16.66666667%; }
    .col-xs-3 { flex: 0 0 auto; width: 25%; }
    .col-xs-4 { flex: 0 0 auto; width: 33.33333333%; }
    .col-xs-5 { flex: 0 0 auto; width: 41.66666667%; }
    .col-xs-6 { flex: 0 0 auto; width: 50%; }
    .col-xs-7 { flex: 0 0 auto; width: 58.33333333%; }
    .col-xs-8 { flex: 0 0 auto; width: 66.66666667%; }
    .col-xs-9 { flex: 0 0 auto; width: 75%; }
    .col-xs-10 { flex: 0 0 auto; width: 83.33333333%; }
    .col-xs-11 { flex: 0 0 auto; width: 91.66666667%; }
    .col-xs-12 { flex: 0 0 auto; width: 100%; }

    .col-xs-offset-0 { margin-left: 0; }
    .col-xs-offset-1 { margin-left: 8.33333333%; }
    .col-xs-offset-2 { margin-left: 16.66666667%; }
    .col-xs-offset-3 { margin-left: 25%; }
    .col-xs-offset-4 { margin-left: 33.33333333%; }
    .col-xs-offset-5 { margin-left: 41.66666667%; }
    .col-xs-offset-6 { margin-left: 50%; }
    .col-xs-offset-7 { margin-left: 58.33333333%; }
    .col-xs-offset-8 { margin-left: 66.66666667%; }
    .col-xs-offset-9 { margin-left: 75%; }
    .col-xs-offset-10 { margin-left: 83.33333333%; }
    .col-xs-offset-11 { margin-left: 91.66666667%; }
}

/* SM Grid (768px and up) */
@media (min-width: 768px) {
    .row {
        --bs-gutter-x: 32px;
    }

    .col-sm-auto { flex: 0 0 auto; width: auto; }
    .col-sm-1 { flex: 0 0 auto; width: 8.33333333%; }
    .col-sm-2 { flex: 0 0 auto; width: 16.66666667%; }
    .col-sm-3 { flex: 0 0 auto; width: 25%; }
    .col-sm-4 { flex: 0 0 auto; width: 33.33333333%; }
    .col-sm-5 { flex: 0 0 auto; width: 41.66666667%; }
    .col-sm-6 { flex: 0 0 auto; width: 50%; }
    .col-sm-7 { flex: 0 0 auto; width: 58.33333333%; }
    .col-sm-8 { flex: 0 0 auto; width: 66.66666667%; }
    .col-sm-9 { flex: 0 0 auto; width: 75%; }
    .col-sm-10 { flex: 0 0 auto; width: 83.33333333%; }
    .col-sm-11 { flex: 0 0 auto; width: 91.66666667%; }
    .col-sm-12 { flex: 0 0 auto; width: 100%; }

    .col-sm-offset-0 { margin-left: 0; }
    .col-sm-offset-1 { margin-left: 8.33333333%; }
    .col-sm-offset-2 { margin-left: 16.66666667%; }
    .col-sm-offset-3 { margin-left: 25%; }
    .col-sm-offset-4 { margin-left: 33.33333333%; }
    .col-sm-offset-5 { margin-left: 41.66666667%; }
    .col-sm-offset-6 { margin-left: 50%; }
    .col-sm-offset-7 { margin-left: 58.33333333%; }
    .col-sm-offset-8 { margin-left: 66.66666667%; }
    .col-sm-offset-9 { margin-left: 75%; }
    .col-sm-offset-10 { margin-left: 83.33333333%; }
    .col-sm-offset-11 { margin-left: 91.66666667%; }
}

/* MD Grid (1025px and up) */
@media (min-width: 1025px) {
    .col-md-auto { flex: 0 0 auto; width: auto; }
    .col-md-1 { flex: 0 0 auto; width: 8.33333333%; }
    .col-md-2 { flex: 0 0 auto; width: 16.66666667%; }
    .col-md-3 { flex: 0 0 auto; width: 25%; }
    .col-md-4 { flex: 0 0 auto; width: 33.33333333%; }
    .col-md-5 { flex: 0 0 auto; width: 41.66666667%; }
    .col-md-6 { flex: 0 0 auto; width: 50%; }
    .col-md-7 { flex: 0 0 auto; width: 58.33333333%; }
    .col-md-8 { flex: 0 0 auto; width: 66.66666667%; }
    .col-md-9 { flex: 0 0 auto; width: 75%; }
    .col-md-10 { flex: 0 0 auto; width: 83.33333333%; }
    .col-md-11 { flex: 0 0 auto; width: 91.66666667%; }
    .col-md-12 { flex: 0 0 auto; width: 100%; }

    .col-md-offset-0 { margin-left: 0; }
    .col-md-offset-1 { margin-left: 8.33333333%; }
    .col-md-offset-2 { margin-left: 16.66666667%; }
    .col-md-offset-3 { margin-left: 25%; }
    .col-md-offset-4 { margin-left: 33.33333333%; }
    .col-md-offset-5 { margin-left: 41.66666667%; }
    .col-md-offset-6 { margin-left: 50%; }
    .col-md-offset-7 { margin-left: 58.33333333%; }
    .col-md-offset-8 { margin-left: 66.66666667%; }
    .col-md-offset-9 { margin-left: 75%; }
    .col-md-offset-10 { margin-left: 83.33333333%; }
    .col-md-offset-11 { margin-left: 91.66666667%; }
}

/* LG Grid (1200px and up) */
@media (min-width: 1200px) {
    .col-lg-auto { flex: 0 0 auto; width: auto; }
    .col-lg-1 { flex: 0 0 auto; width: 8.33333333%; }
    .col-lg-2 { flex: 0 0 auto; width: 16.66666667%; }
    .col-lg-3 { flex: 0 0 auto; width: 25%; }
    .col-lg-4 { flex: 0 0 auto; width: 33.33333333%; }
    .col-lg-5 { flex: 0 0 auto; width: 41.66666667%; }
    .col-lg-6 { flex: 0 0 auto; width: 50%; }
    .col-lg-7 { flex: 0 0 auto; width: 58.33333333%; }
    .col-lg-8 { flex: 0 0 auto; width: 66.66666667%; }
    .col-lg-9 { flex: 0 0 auto; width: 75%; }
    .col-lg-10 { flex: 0 0 auto; width: 83.33333333%; }
    .col-lg-11 { flex: 0 0 auto; width: 91.66666667%; }
    .col-lg-12 { flex: 0 0 auto; width: 100%; }

    .col-lg-offset-0 { margin-left: 0; }
    .col-lg-offset-1 { margin-left: 8.33333333%; }
    .col-lg-offset-2 { margin-left: 16.66666667%; }
    .col-lg-offset-3 { margin-left: 25%; }
    .col-lg-offset-4 { margin-left: 33.33333333%; }
    .col-lg-offset-5 { margin-left: 41.66666667%; }
    .col-lg-offset-6 { margin-left: 50%; }
    .col-lg-offset-7 { margin-left: 58.33333333%; }
    .col-lg-offset-8 { margin-left: 66.66666667%; }
    .col-lg-offset-9 { margin-left: 75%; }
    .col-lg-offset-10 { margin-left: 83.33333333%; }
    .col-lg-offset-11 { margin-left: 91.66666667%; }
}

/* XL Grid (1366px and up) */
@media (min-width: 1366px) {
    .col-xl-auto { flex: 0 0 auto; width: auto; }
    .col-xl-1 { flex: 0 0 auto; width: 8.33333333%; }
    .col-xl-2 { flex: 0 0 auto; width: 16.66666667%; }
    .col-xl-3 { flex: 0 0 auto; width: 25%; }
    .col-xl-4 { flex: 0 0 auto; width: 33.33333333%; }
    .col-xl-5 { flex: 0 0 auto; width: 41.66666667%; }
    .col-xl-6 { flex: 0 0 auto; width: 50%; }
    .col-xl-7 { flex: 0 0 auto; width: 58.33333333%; }
    .col-xl-8 { flex: 0 0 auto; width: 66.66666667%; }
    .col-xl-9 { flex: 0 0 auto; width: 75%; }
    .col-xl-10 { flex: 0 0 auto; width: 83.33333333%; }
    .col-xl-11 { flex: 0 0 auto; width: 91.66666667%; }
    .col-xl-12 { flex: 0 0 auto; width: 100%; }

    .col-xl-offset-0 { margin-left: 0; }
    .col-xl-offset-1 { margin-left: 8.33333333%; }
    .col-xl-offset-2 { margin-left: 16.66666667%; }
    .col-xl-offset-3 { margin-left: 25%; }
    .col-xl-offset-4 { margin-left: 33.33333333%; }
    .col-xl-offset-5 { margin-left: 41.66666667%; }
    .col-xl-offset-6 { margin-left: 50%; }
    .col-xl-offset-7 { margin-left: 58.33333333%; }
    .col-xl-offset-8 { margin-left: 66.66666667%; }
    .col-xl-offset-9 { margin-left: 75%; }
    .col-xl-offset-10 { margin-left: 83.33333333%; }
    .col-xl-offset-11 { margin-left: 91.66666667%; }
}




/*------------------------------------*\
COMPONENTS
\*------------------------------------*/
section.fx-block {
--section-margins: 50px;

@media (min-width: 768px) {
    --section-margins: 60px; 
}

@media (min-width: 1200px) {
    --section-margins: 90px; 
}

}
&.section-margins,
.section-margins {
    margin-top: var(--section-margins);
    margin-bottom: var(--section-margins);
    margin-block-end: var(--section-margins) !important;
}

/* Used only for sections with colored backgrounds */
&.section-padding,
.section-padding {
    padding-top: var(--section-margins);
    padding-bottom: var(--section-margins);
}

section.fx-block {
--section-margins: 50px;

@media (min-width: 768px) {
    --section-margins: 60px; 
}

@media (min-width: 1200px) {
    --section-margins: 90px; 
}

}


/**
* Text alignment
*/

.text-left     { text-align: left !important; }
.text-center   { text-align: center !important; }
.text-right    { text-align: right !important; }



/**
 * Icons
 */

 @font-face {
    font-family: 'forte-icon';
    src:  url('/wp-content/themes/csgi-forte/assets/icons/forte-icon.eot?eg1t0h');
    src:  url('/wp-content/themes/csgi-forte/assets/icons/forte-icon.eot?eg1t0h#iefix') format('embedded-opentype'),
        url('/wp-content/themes/csgi-forte/assets/icons/forte-icon.ttf?eg1t0h') format('truetype'),
        url('/wp-content/themes/csgi-forte/assets/icons/forte-icon.woff?eg1t0h') format('woff'),
        url('/wp-content/themes/csgi-forte/assets/icons/forte-icon.svg?eg1t0h#forte-icon') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: block;
    }
    
    [class^="icon-"], [class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'forte-icon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    }
    
    .icon-down-arrow:before {
    content: "\e900";
    }
    .icon-impact:before {
    content: "\e901";
    }
    .icon-inspiration:before {
    content: "\e902";
    }
    .icon-integrity:before {
    content: "\e903";
    }
    .icon-left-arrow:before {
    content: "\e904";
    }
    .icon-right-arrow:before {
    content: "\e905";
    }
    .icon-up-arrow:before {
    content: "\e906";
    }

/* Slick Slider */

/* Only show the 1st slide while your slider is loading - Utility Classes
NOTE: Add the .fx-slider class to the wrapper that is holding your entire slider.
NOTE: Add the .fx-slide class to the wrapper of each individual slide.
Guru: https://app.getguru.com/card/ixR67EpT/Slick-Slider
*/

.fx-slider .fx-slide {
    display: none;
}

.fx-slider .fx-slide:first-child {
    display: block;
}

.fx-slider.slick-initialized .fx-slide {
    display: block;
}


.slick-arrow {
    position: absolute;
    top: unset;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 0);
    padding: 0;
    font-size: 0;
    color: #BADAF3;
    background-color: var(--theme-color3);
    width: 38px;
    height: 38px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    z-index: 1;
}
.slick-arrow {
    cursor: pointer;
}

.slick-arrow::before {
    font-family: 'forte-icon';
    font-size: 18px;
    color: var(--theme-color1);
}

.slick-prev::before {
    content: "\e904";
}

.slick-next:before {
    content: "\e905";
}

.slick-prev {
    margin-left: -22px;
}

.slick-next {
    margin-left: 22px;
}

.slick-arrow:hover, 
.slick-arrow:focus {
    background-color: var(--theme-color1);
    color: var(--theme-color3);
}

.slick-arrow:hover::before, 
.slick-arrow:focus::before  {
    color: var(--theme-color3) !important;
}

/**
* Images
*/

.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}

.object-fit {
    -o-object-fit: cover;
        object-fit: cover;
    width: 100%;
    height: 100%;
}

.object-fit--contain {
    -o-object-fit: contain;
        object-fit: contain;
    width: 100%;
    height: 100%;
}

/**
* Visiblity
*/

.show { display: block !important; }

.visible-xxs,
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg { display: none !important; }

.visible-xxs-block,
.visible-xxs-inline,
.visible-xxs-inline-block,
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block { display: none !important; }

@media (max-width: 599px) {
    .visible-xxs      { display: block !important; }
    table.visible-xxs { display: table; }
    tr.visible-xxs    { display: table-row !important; }
    th.visible-xxs,
    td.visible-xxs    { display: table-cell !important; }

    .visible-xxs-block        { display: block !important; }
    .visible-xxs-inline       { display: inline !important; }
    .visible-xxs-inline-block { display: inline-block !important; }
}

@media (min-width: 600px) and (max-width: 767px) {
    .visible-xs      { display: block !important; }
    table.visible-xs { display: table; }
    tr.visible-xs    { display: table-row !important; }
    th.visible-xs,
    td.visible-xs    { display: table-cell !important; }

    .visible-xs-block        { display: block !important; }
    .visible-xs-inline       { display: inline !important; }
    .visible-xs-inline-block { display: inline-block !important; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .visible-sm      { display: block !important; }
    table.visible-sm { display: table; }
    tr.visible-sm    { display: table-row !important; }
    th.visible-sm,
    td.visible-sm    { display: table-cell !important; }

    .visible-sm-block        { display: block !important; }
    .visible-sm-inline       { display: inline !important; }
    .visible-sm-inline-block { display: inline-block !important; }
}

@media (min-width: 1025px) and (max-width: 1199px) {
    .visible-md      { display: block !important; }
    table.visible-md { display: table; }
    tr.visible-md    { display: table-row !important; }
    th.visible-md,
    td.visible-md    { display: table-cell !important; }

    .visible-md-block        { display: block !important; }
    .visible-md-inline       { display: inline !important; }
    .visible-md-inline-block { display: inline-block !important; }
}

@media (min-width: 1200px) {
    .visible-lg      { display: block !important; }
    table.visible-lg { display: table; }
    tr.visible-lg    { display: table-row !important; }
    th.visible-lg,
    td.visible-lg    { display: table-cell !important; }

    .visible-lg-block        { display: block !important; }
    .visible-lg-inline       { display: inline !important; }
    .visible-lg-inline-block { display: inline-block !important; }
}

/**
* Hiding
*/

.hide,
.hidden-xxs-up { display: none !important; }
.hidden       { display: none !important; visibility: hidden !important; }
.invisible    { visibility: hidden !important; }
.text-hide    {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

@media (max-width: 599px) {
    .hidden-xxs { display: none !important; }
}

@media (min-width: 600px) {
    .hidden-xs-up { display: none !important; }
}

@media (min-width: 600px) and (max-width: 767px) {
    .hidden-xs { display: none !important; }
}

@media (max-width: 767px) {
    .hidden-xs-down { display: none !important; }
}

@media (min-width: 768px) {
    .hidden-sm-up { display: none !important; }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .hidden-sm { display: none !important; }
}

@media (max-width: 1024px) {
    .hidden-sm-down { display: none !important; }
}

@media (min-width: 1025px) {
    .hidden-md-up { display: none !important; }
}

@media (min-width: 1025px) and (max-width: 1199px) {
    .hidden-md { display: none !important; }
}

@media (max-width: 1199px) {
    .hidden-md-down { display: none !important; }
}

@media (min-width: 1200px) {
    .hidden-lg { display: none !important; }
}

/**
* Screen Readers
*/

.sr-only,
.screen-reader-text,
.wpcf7 .screen-reader-response {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.sr-only-focusable:active,
.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
}

/**
* Print
*/

.visible-print,
.visible-print-block,
.visible-print-inline,
.visible-print-inline-block { display: none !important; }

@media print {
    .visible-print      { display: block !important; }
    table.visible-print { display: table; }
    tr.visible-print    { display: table-row !important; }
    th.visible-print,
    td.visible-print    { display: table-cell !important; }

    .visible-print-block        { display: block !important; }
    .visible-print-inline       { display: inline !important; }
    .visible-print-inline-block { display: inline-block !important; }

    .hidden-print { display: none !important; }
}


/* Positioning */

@media (min-width: 1200px) {
    .flex-opposite {
        flex-direction: row-reverse;
    }
}

/* CSG NEW Theme Variables */
.page-template-plum-themes {
--theme-color0: #f3e1f0;
--theme-color1: #E4B0C3;
--theme-color2: #B22372;
--theme-color3: #8F1C5F;
--theme-color4: #4D083C;
}

.page-template-berry-themes{
--theme-color0: #e8e1f3;
--theme-color1: #D1B9D9;
--theme-color2: #976CAE;
--theme-color3: #5C3883;
--theme-color4: #2E1B46;
}

.page-template-teal-themes {
--theme-color0: #e1f1f3;
--theme-color1: #B4E1E7;
--theme-color2: #71B2B6;
--theme-color3: #005253;
--theme-color4: #00393A;
}

.page-template-blue-themes{
--theme-color0: #E1ECF3;
--theme-color1: #BADAF3;
--theme-color2: #0082C0;
--theme-color3: #154A92;
--theme-color4: #0F1C6B;
}

a.button, .btn, .btn-solid {
    border-radius: 50px !important;
}

.fx-block .btn::before,
.fx-block .btn-secondary::before,
.fx-block .btn.btn-secondary::before,
.fx-block .btn.btn-primary::before {
    content: "\e905";
    font-family: 'forte-icon';
    position: absolute;
    right: 18px;
    top: 50%;
    transform: translate(0, -50%);
    font-size: 16px;
    font-weight: normal;
    color: var(--theme-color1);
}

section.fx-block {
    position: relative;
    z-index: 2;

    p a:not(.btn), p a:visited:not(.btn) {
        color: var(--theme-color2);
        cursor: pointer;
        text-decoration: none;
    }

    p a:not(.btn):hover, p a:visited:not(.btn):hover {
        color: var(--theme-color3);
        text-decoration: underline;
    }

    &.bg-blue-gradient p a:not(.btn):hover,
    &.bg-blue-gradient p a:visited:not(.btn):hover {
        color: #fff;
    }

    .btn {
        position: relative;
        display: inline-block;
        color: #FFFFFF;
        border-radius: 100px;
        font-size: 14px;
        line-height: 1.21em;
        font-weight: 400;
        padding: 10px 44px 11px 20px;
        vertical-align: middle;
        text-decoration: none;
        transition: all ease-in-out 0.2s;
        background: var(--theme-color3);
        margin-top: 20px;
    }

    .btn-secondary {
        background: var(--theme-color2);
        color: #ffffff;
    }

    .btn-secondary:hover {
        background: var(--theme-color3) !important;
    }
    
    .btn-white {
        background: #ffff;
        color: var(--theme-color3);
    }
    
}

/* Block Background Colors */

.bg-white,
.bg-white {
    background: #ffffff;
    color: #000000;
}

.bg-gray,
.bg-gray {
    background: #F5F5F5;
    color: #000000;
}

.bg-blue,
.bg-blue {
    background: var(--theme-color3);
    color: #ffffff;
}

.bg-dark-blue,
.bg-dark-blue {
    background: var(--theme-color4);
    color: #ffffff;
}

.bg-blue-gradient,
.bg-blue-gradient {
    background: linear-gradient(180deg, var(--theme-color3) 0%, var(--theme-color4) 100%);
    color: #ffffff;
}