﻿@import url("/OutSystemsUIWeb/Theme.BaseTheme.css?14907");

/*----------------------------------------------------*\

    Allegro Theme Customization
    
   $. Base Customization
        $0. Page layout
        $1. Buttons / Links
        $2. Widgets
        $3. OutSystems UI Blocks
        $4. Utility classes and colors
    
    $5. Custom CSS
    $6. ExcludeFromPickers

    \*----------------------------------------------------*/
/*--------------------------------------------------------------*/
/*--------------------- Base Customization ---------------------*/
/*--------------------------------------------------------------*/
/* roboto-300 - latin */
@font-face {
    font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url("/AllegroTheme/roboto-300.eot");
  /* IE9 Compat Modes */
  src: local("Roboto Light"), local("Roboto-Light"), url("/AllegroTheme/roboto-300.eot?#iefix") format("embedded-opentype"), url("/AllegroTheme/roboto-300.woff2") format("woff2"), url("/AllegroTheme/roboto-300.woff") format("woff"), url("/AllegroTheme/roboto-300.ttf") format("truetype"), url("/AllegroTheme/roboto-300.svg#Roboto") format("svg");
  /* Legacy iOS */
}

/* roboto-regular - latin */
@font-face {
    font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url("/AllegroTheme/roboto-400.eot");
  /* IE9 Compat Modes */
  src: local("Roboto"), local("Roboto-Regular"), url("/AllegroTheme/roboto-400.eot?#iefix") format("embedded-opentype"), url("/AllegroTheme/roboto-400.woff2") format("woff2"), url("/AllegroTheme/roboto-400.woff") format("woff"), url("/AllegroTheme/roboto-400.ttf") format("truetype"), url("/AllegroTheme/roboto-400.svg#Roboto") format("svg");
  /* Legacy iOS */
}

/* roboto-500 - latin */
@font-face {
    font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url("/AllegroTheme/roboto-500.eot");
  /* IE9 Compat Modes */
  src: local("Roboto Medium"), local("Roboto-Medium"), url("/AllegroTheme/roboto-500.eot?#iefix") format("embedded-opentype"), url("/AllegroTheme/roboto-500.woff2") format("woff2"), url("/AllegroTheme/roboto-500.woff") format("woff"), url("/AllegroTheme/roboto-500.ttf") format("truetype"), url("/AllegroTheme/roboto-500.svg#Roboto") format("svg");
  /* Legacy iOS */
}

/* roboto-700 - latin */
@font-face {
    font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url("/AllegroTheme/roboto-700.eot");
  /* IE9 Compat Modes */
  src: local("Roboto Bold"), local("Roboto-Bold"), url("/AllegroTheme/roboto-700.eot?#iefix") format("embedded-opentype"), url("/AllegroTheme/roboto-700.woff2") format("woff2"), url("/AllegroTheme/roboto-700.woff") format("woff"), url("/AllegroTheme/roboto-700.ttf") format("truetype"), url("/AllegroTheme/roboto-700.svg#Roboto") format("svg");
  /* Legacy iOS */
}

:root {
    --color-primary: #E79041;
    --color-primary-hover: #c1742f;
    --color-secondary: #2C376F;
    --color-secondary-dark: #242a4c;
    --color-white-opacity: #ffffffcc;
    --border-color: #D0D0D0;
    --font-semi-bold: 500;
    --header-size: 75px;
}

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-family: 'Roboto', sans-serif;
}

html p {
    margin: 0;
}

/*---------- $0. Page layout ----------*/
.layout-top {
    background-color: var(--color-neutral-3);
}

.layout-top .header .Menu_TopMenu {
    border-top-width: var(--border-size-l);
    border-bottom-width: var(--border-size-l);
}

.layout-top .header .Menu_TopMenu.Menu_TopMenuActive > div a,
    .layout-top .header .Menu_TopMenu.Menu_TopMenuActive > div a:visited,
    .layout-top .header .Menu_TopMenu.Menu_TopMenuActive > div a:hover,
    .layout-top .header .Menu_TopMenu:hover.Menu_TopMenuActive > div a {
    color: var(--color-secondary-dark);
}

.layout-top .header .Menu_TopMenu:hover, .layout-top .header .Menu_TopMenu.Menu_TopMenuActive {
    border-bottom: var(--border-size-l) solid var(--color-primary);
}

.layout-top .header-top {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 16px 0;
}

.layout-top .header-content {
    background-color: var(--color-secondary);
}

.layout-top .header-content .btn {
    margin-right: 0;
    margin-left: auto;
    margin-top: 8px;
}

.desktop .layout-top .header-content .ThemeGrid_Container > div:not(:empty) {
    height: 56px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.layout-top .header-content .Menu_TopMenu {
    padding-left: var(--space-base);
    padding-right: var(--space-base);
}

.desktop .layout-top .header-content .Menu_TopMenu > div a,
      .desktop .layout-top .header-content .Menu_TopMenu > div a:visited,
      .desktop .layout-top .header-content .Menu_TopMenu:hover > div a {
    color: #ffffffcc;
}

.desktop .layout-top .header-content .Menu_TopMenu:hover .Menu_DropDownArrow::before,
      .desktop .layout-top .header-content .Menu_TopMenu:hover .Menu_DropDownArrow::after {
    background-color: #ffffffcc;
}

.desktop .layout-top .header-content .Menu_TopMenu.Menu_TopMenuActive > div a,
      .desktop .layout-top .header-content .Menu_TopMenu.Menu_TopMenuActive > div a:visited,
      .desktop .layout-top .header-content .Menu_TopMenu.Menu_TopMenuActive > div a:hover,
      .desktop .layout-top .header-content .Menu_TopMenu:hover.Menu_TopMenuActive > div a {
    color: var(--color-neutral-0);
}

.tablet .layout-top .header {
    background-color: var(--color-neutral-0);
}

.phone .layout-top .header {
    background-color: var(--color-secondary);
}

.tablet .layout-top .header .menu-icon,
    .phone .layout-top .header .menu-icon {
    width: 30px;
    height: 18px;
}

.tablet .layout-top .header .menu-icon-line {
    background-color: var(--color-neutral-10);
}

.phone .layout-top .header .menu-icon-line {
    background-color: var(--color-neutral-0);
}

.tablet .layout-top .header-top,
    .phone .layout-top .header-top {
    height: 44px;
}

.tablet .layout-top .header-right,
    .phone .layout-top .header-right {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 16px;
    width: 54px;
    white-space: nowrap;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}

/* start separation
.tablet .layout-top .header-right a,
      .phone .layout-top .header-right a {
    color: var(--color-neutral-0);
}*/

.tablet .layout-top .header-right a{
    color: var(--color-neutral-8);
}
.phone .layout-top .header-right a {
    color: #9e9e9e;
    /*color: var(--color-neutral-0);*/
}


/*end separation*/

.tablet .layout-top .header-center,
    .phone .layout-top .header-center {
    color: var(--color-neutral-0);
    font-size: 18px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.layout-top .content .ThemeGrid_Container {
    padding-top: var(--space-m);
}

.layout-top .content-top-title {
    color: var(--color-neutral-9);
}

.layout-top .content-top-title, .layout-top .content-top-actions {
    margin-bottom: var(--space-m);
}

.desktop .layout-top .content-breadcrumbs:not(:empty) + .content-top .content-top-title:empty + .content-top-actions:not(:empty) {
    margin-bottom: var(--space-none);
}

.desktop .layout-top .content-breadcrumbs:not(:empty) + .content-top .content-top-title:empty + .content-top-actions:not(:empty) > * {
    top: -44px;
    position: relative;
}

/*.tablet .layout-tabs .header .menu-icon-line,*/
.phone .layout-tabs .header .menu-icon-line {
    opacity: 0;
    pointer-events: none;
}

/*.tablet .layout-tabs .Application_Menu,*/
.phone .layout-tabs .Application_Menu {
    display: block;
    position: relative;
    width: calc(100% + 32px);
    margin: 0 -16px;
    pointer-events: all;
    height: 50px;
}

/*.tablet .layout-tabs .Menu_TopMenus,*/
.phone .layout-tabs .Menu_TopMenus {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-transform: none !important;
        -ms-transform: none !important;
            transform: none !important;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    left: 0;
    background-color: transparent;
    padding: var(--space-none) var(--space-s);
}

/*.tablet .layout-tabs .Menu_TopMenus::before,*/
  .phone .layout-tabs .Menu_TopMenus::before {
    display: none;
}

/*.tablet .layout-tabs .Menu_TopMenu,*/
.phone .layout-tabs .Menu_TopMenu {
    text-align: center;
    white-space: nowrap;
}

/*.tablet .layout-tabs .Menu_TopMenu > div,*/
  .phone .layout-tabs .Menu_TopMenu > div {
    padding: var(--space-none);
}

/*.tablet .layout-tabs .Menu_TopMenu > div a,*/
    .phone .layout-tabs .Menu_TopMenu > div a {
    color: var(--color-white-opacity);
}

/*.tablet .layout-tabs .Menu_TopMenu.Menu_TopMenuActive > div a,
  .tablet .layout-tabs .Menu_TopMenu.Menu_TopMenuActive > div a:visited,
  .tablet .layout-tabs .Menu_TopMenu.Menu_TopMenuActive:hover > div a,*/
  .phone .layout-tabs .Menu_TopMenu.Menu_TopMenuActive > div a,
  .phone .layout-tabs .Menu_TopMenu.Menu_TopMenuActive > div a:visited,
  .phone .layout-tabs .Menu_TopMenu.Menu_TopMenuActive:hover > div a {
    color: var(--color-neutral-0);
}

.layout-login-form-content {
    background: url("/AllegroTheme/img/bglogin.png?30198") no-repeat center center fixed;
    background-size: cover;
}

.layout-login-simple .layout-login-form {
    background-color: #ffffff;
}

.layout-login-logo img {
    max-width: 300px;
}

.TopContainer {
    background-color: var(--color-secondary);
}

.TopContainer .ThemeGrid_Container:first-child {
    margin: 0 auto;
    padding: 0;
}

.TopContainer .TopContent {
    margin: var(--space-none) auto;
    padding: var(--space-m) var(--space-xl);
    color: var(--color-neutral-4);
}

.TopContainer .TopContent:empty {
    display: none;
}

.BottomMenu_wrapper {
    height: 50px;
    background-color: var(--color-neutral-0);
    position: fixed;
    border-top: 1px solid var(--color-neutral-3);
    left: 0;
    bottom: 0;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.BottomMenu_wrapper > * {
    width: 25%;
}

.BottomMenu_wrapper .BottomMenu_item {
    text-align: center;
}

.BottomMenu_wrapper .AppMenu_item.active {
    background-color: var(--color-primary);
    color: var(--color-neutral-0);
}

.BottomMenu_wrapper .AppMenu_text {
    margin-top: -5px;
    font-size: 15px;
    text-align: center;
}

.ThemeGrid_Container {
    max-width: 1280px;
}

.content-breadcrumbs .breadcrumbs-item .icon {
    color: var(--color-neutral-8);
}

.tablet .content-breadcrumbs,
.phone .content-breadcrumbs {
    display: none;
}

/* Popup Editor */
.MainContent-PopUp {
    background-color: #f3f6f8;
}

.MainContent-PopUp .image-centered img {
    max-height: 130px;
}

div.os-internal-Popup .os-internal-ui-dialog,
div.os-internal-Popup.os-internal-ui-dialog {
    background-color: #f3f6f8;
}

/*---------- $1. Buttons and Inputs ----------*/
.Is_Default,
.Button,
.btn {
    border: 2px solid var(--color-primary);
    background-color: var(--color-primary);
    color: var(--color-neutral-0);
    min-width: 126px;
}

.Is_Default:hover, .Is_Default:visited,
  .Button:hover,
  .Button:visited,
  .btn:hover,
  .btn:visited {
    color: var(--color-neutral-0);
}

.Is_Default:hover,
  .Button:hover,
  .btn:hover {
    -webkit-filter: brightness(0.9);
            filter: brightness(0.9);
}

.Is_Default:active,
  .Button:active,
  .btn:active {
    -webkit-filter: brightness(0.7);
            filter: brightness(0.7);
}

.Is_Default-secondary,
  .Button-secondary,
  .btn-secondary {
    background-color: var(--color-neutral-0);
}

.Is_Default-secondary, .Is_Default-secondary:hover,
    .Button-secondary,
    .Button-secondary:hover,
    .btn-secondary,
    .btn-secondary:hover {
    color: var(--color-primary);
}

/*Back grey button*/
.Is_Default-back,
  .Button-back,
  .btn-back {
    background-color: var(--color-neutral-0);
    border-color: #adb5bd;
    border-width: 1px;
    color: #5C656D;
}

.Is_Default-back, .Is_Default-back:hover,
    .Button-back,
    .Button-back:hover,
    .btn-back,
    .btn-back:hover {
    color: #5C656D;
}
/**/


.Is_Default-error,
  .Button-error,
  .btn-error {
    background-color: var(--color-red-dark);
    border-color: var(--color-red-dark);
}

.Is_Default-success,
  .Button-success,
  .btn-success {
    background-color: var(--color-lime);
    border-color: var(--color-lime);
}

.Is_Default-card,
  .Button-card,
  .btn-card {
    height: 104px;
    width: 97px;
    border-radius: var(--border-radius-soft);
    background-color: var(--color-neutral-4);
    color: var(--color-secondary);
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-right: var(--space-base);
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    padding: 12px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

.Is_Default-card .fa,
    .Button-card .fa,
    .btn-card .fa {
    font-size: 18px;
}

.Is_Default-card.is--active,
    .Button-card.is--active,
    .btn-card.is--active {
    background-color: var(--color-secondary);
}

.Is_Default-card.is--active,
      .Is_Default-card.is--active *,
      .Button-card.is--active,
      .Button-card.is--active *,
      .btn-card.is--active,
      .btn-card.is--active * {
    color: var(--color-neutral-0);
}

.Is_Default-ghost,
  .Button-ghost,
  .btn-ghost {
    background-color: transparent;
    border-color: transparent;
    min-width: unset;
}

.Is_Default-ghost, .Is_Default-ghost:visited,
    .Button-ghost,
    .Button-ghost:visited,
    .btn-ghost,
    .btn-ghost:visited {
    color: var(--color-neutral-7);
}

.Is_Default-ghost .fa,
    .Button-ghost .fa,
    .btn-ghost .fa {
    font-size: 18px;
}

.Is_Default-ghost:hover,
    .Button-ghost:hover,
    .btn-ghost:hover {
    background-color: var(--color-neutral-0);
    color: var(--color-neutral-8);
}

.Is_Default-icon,
  .Button-icon,
  .btn-icon {
    min-width: unset;
}

.phone .Is_Default-icon, .phone
    .Button-icon, .phone
    .btn-icon {
    width: auto;
    padding: 0 8px;
}

.button-group .btn {
    min-width: unset;
}

.button-group label:first-child:last-child .btn {
    border-radius: var(--border-radius-soft);
}

[type="radio"] + span {
    background-color: var(--color-neutral-0);
}

[type="radio"][disabled="disabled"] + .btn {
    border-color: var(--color-neutral-7);
    background-color: var(--color-neutral-4);
    color: var(--color-neutral-8);
    cursor: not-allowed;
}

[disabled="disabled"],
[readonly="readonly"],
textarea[readonly="readonly"] {
    color: var(--color-neutral-8);
}

/*---------- $2. widgets ----------*/
.accordion-item .accordion-item-header {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.accordion-item .accordion-item-icon {
    margin-left: var(--space-base);
}

.accordion-item .counter {
    max-width: 130px;
    margin: auto;
}

.badge {
    height: 26px;
    min-width: 26px;
    font-size: 12px;
}

.badge.background-neutral-4 {
    color: var(--color-neutral-0);
}

.Blank {
    margin: var(--space-xl) var(--space-none) var(--space-none);
}

.Blank_icon .fa {
    font-size: 27px;
}

.Blank_icon .fa-check {
    color: var(--color-success);
}

.Blank_desc {
    text-align: center;
    font-weight: var(--font-semi-bold);
    font-size: var(--font-size-h3);
    color: var(--color-neutral-9);
    margin-top: var(--space-base);
}

.card {
    border-color: #dee2e6;
}

.card .image-centered {
    height: 200px;
}

.phone .card .image-centered {
    height: 100px;
}

.card-border-none:hover {
    -webkit-box-shadow: 0 0 10px #e2dddd;
            box-shadow: 0 0 10px #e2dddd;
}

.card-background img {
    -webkit-transition: -webkit-transform .2s ease-in-out;
    transition: -webkit-transform .2s ease-in-out;
    -o-transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out;
    transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.card-background-content {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
}

.card-background-content .heading4 {
    color: var(--color-neutral-0);
    overflow: hidden;
    -o-text-overflow: ellipsis;
       text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.card-background:after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.66)));
    background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.66) 100%);
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.66) 100%);
    border-radius: var(--border-radius-soft);
}

.card-background.card--hover .more-news {
    position: absolute;
    left: -24px;
    top: -24px;
    width: calc(100% + 48px);
    height: calc(100% + 48px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    font-weight: bold;
    color: white;
}

.card-background.card--hover:after {
    background-color: #FFA14C;
    opacity: .76;
}

.card-background:hover .card-background-image img {
    -webkit-transform: scale(1.05);
        -ms-transform: scale(1.05);
            transform: scale(1.05);
}

.columns-gallery .card-background {
    margin: 0 10px 20px 0;
}

.card-border-none, .card-background {
    border: 0;
    -webkit-transition: -webkit-box-shadow .3s ease;
    transition: -webkit-box-shadow .3s ease;
    -o-transition: box-shadow .3s ease;
    transition: box-shadow .3s ease;
    transition: box-shadow .3s ease, -webkit-box-shadow .3s ease;
}

.desktop .card-margin-none.full-height,
  .tablet .card-margin-none.full-height {
    height: 460px !important;
    margin: 0 10px 20px 0 !important;
}

.card-info {
    background-color: #565F8B;
    border-color: #565F8B;
    color: var(--color-neutral-0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 12px 8px;
}

.card-info .btn.btn-ghost {
    background-color: #898FAE;
    color: #fff;
    font-size: 12px;
    padding: 0 4px;
    height: 24px;
}

.card-info .btn.btn-ghost:hover {
    background-color: #E79041;
}

.card-info .fa-angle-right {
    text-align: left;
}

.columns-align-bottom {
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
}

.phone .columns-invert .columns-item:nth-child(1) {
    margin-bottom: 0 !important;
}

.phone .columns-invert .columns-item:nth-child(2) {
    -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
            order: -1;
}

.tabs-header-item {
    font-size: var(--font-size-s);
    color: rgba(255, 255, 255, 0.7);
    border-bottom-width: var(--border-size-l);
}

.tabs-header-item:hover {
    border-bottom: var(--border-size-l) solid var(--color-primary);
    color: var(--color-neutral-4);
}

.tabs-header-item.active {
    border-bottom: var(--border-size-l) solid var(--color-primary);
    color: var(--color-neutral-0);
}

.tabs-white {
    border: var(--border-size-s) solid #D0D0D0;
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-soft);
}

.tabs-white .tabs-header-item {
    padding-left: var(--space-l);
    padding-right: var(--space-l);
}

.tabs-white .tabs-header-item, .tabs-white .tabs-header-item:hover {
    color: var(--color-neutral-9);
}

.tabs-white .tabs-content {
    background-color: var(--color-neutral-0);
    padding: 20px;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
}

.tippy-tooltip {
    max-width: 250px;
}

.TableRecords,
.EditableTable {
    border-color: var(--border-color);
}

.TableRecords .TableRecords_Header,
  .EditableTable .TableRecords_Header {
    background-color: #F6F6F6;
    border-bottom: 0;
}

.TableRecords .TableRecords_OddLine, .TableRecords .TableRecords_EvenLine,
  .EditableTable .TableRecords_OddLine,
  .EditableTable .TableRecords_EvenLine {
    border-bottom-color: #EEEEEE;
}

.wizard-item-icon {
    width: 10px;
    height: 10px;
    border-color: var(--color-neutral-7);
    background-color: transparent;
}

.wizard-item-icon .fa {
    position: absolute;
    left: 50%;
    top: -40px;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    font-size: 24px;
    color: var(--color-blue);
    opacity: 0;
}

.wizard-item-icon-wraper {
    margin-top: var(--space-l);
}

.wizard-item-label {
    font-size: 20px;
    line-height: 25px;
}

.wizard-item.past .wizard-item-icon {
    background-color: var(--color-neutral-9);
    border-color: var(--color-neutral-9);
}

.wizard-item.past .wizard-item-label {
    color: var(--color-neutral-9);
}

.wizard-item.active .wizard-item-icon {
    background-color: var(--color-blue);
    border-color: var(--color-blue);
}

.wizard-item.active .wizard-item-icon .fa {
    opacity: 1;
}

.wizard-item.active .wizard-item-label {
    color: var(--color-blue);
    font-weight: var(--font-semi-bold);
}

.wizard-item.past .wizard-item-icon-wraper:before, .wizard-item.active .wizard-item-icon-wraper:before, .wizard-item.next .wizard-item-icon-wraper:before {
    background: -webkit-gradient(linear, left top, right top, color-stop(33%, #DADDE1), color-stop(0%, rgba(255, 255, 255, 0))) repeat-x bottom;
    background: -o-linear-gradient(left, #DADDE1 33%, rgba(255, 255, 255, 0) 0%) repeat-x bottom;
    background: linear-gradient(to right, #DADDE1 33%, rgba(255, 255, 255, 0) 0%) repeat-x bottom;
    background-size: 9px 3px;
}

.tablet .wizard-item-icon,
.phone .wizard-item-icon {
    border-width: var(--border-size-s);
}

.tablet .wizard-item-icon .fa,
  .phone .wizard-item-icon .fa {
    top: -30px;
    font-size: 18px;
    opacity: 1;
}

.tablet .wizard-item-label,
.phone .wizard-item-label {
    display: none;
}

.tablet .wizard-item.next .wizard-item-icon .fa,
.phone .wizard-item.next .wizard-item-icon .fa {
    color: var(--color-neutral-7);
}

/*---------- $4. Utility classes and colors ----------*/
/*---------- $5. Custom CSS ----------*/
.image-centered.small {
    width: 90px;
}

.image-centered img {
    max-height: 100%;
}


div.os-internal-Popup.os-internal-ui-dialog.os-internal-ui-draggable .os-internal-ui-dialog-titlebar.os-internal-header-space {
    background-color: white !important;
}


/**/
div.os-internal-Popup.os-internal-ui-dialog.os-internal-ui-draggable .os-internal-ui-dialog-titlebar.os-internal-header-space {
    background-color: white !important;
}

body {    
    background-color: white !important;
}

div.os-internal-Popup.os-internal-ui-dialog {
    background-color: #ffffff !important;
}

.InitialsH4 .user-avatar-medium {
    font-size: var(--font-size-h4);
    height: 50px;
    width: 50px;
}

.card-align-center {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding: 12px 8px;
}

.choices__list--dropdown .choices__item {
    min-height: 40px;
    height: auto;
    word-break: normal;
}

.EyeBtn{
    color: #868E96;
    font-size: 14px;
    padding: 6px;
    border-radius: 4px;
}

.EyeBtn:hover{
    background-color: #FEF0E6;
    color: #E79041 !important;
}

.titleAcc{
    font-size: 20px;
    color: #15181A;
    font-weight: bold;
}

.subTitleAcc{
    color: #868E96;
    font-size: 14px;
    font-weight: normal;
}

.phone .user-avatar-medium {
    display:none;
}

.ms-choice {
    height: 40px;
    border: var(--border-size-s) solid var(--color-neutral-5);
    text-align: left;
    line-height: 42px;
    color: var(--color-neutral-9);
}

.ms-choice > div:after {
    color: var(--color-neutral-7);
    content: '\f107';
    font: normal normal normal 24px/1 FontAwesome;
    font-family: 'FontAwesome';
    position: absolute;
    right: 16px;
    top: 8px;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    transform-origin: center;
}

.ms-choice > div.open:after {
  transform: rotate(180deg);
}


.ms-choice > span {
    padding-left: 16px;
}

.ms-choice > div {
    background: none;
}
.ms-choice > div.open {
    background: none;
}

.ms-drop ul > li {
  color: #343a40;
  margin-top:8px;
}

[disabled="disabled"], [readonly="readonly"], textarea[readonly="readonly"] {
    background-color: #F1F3F5 !important;
    border: 2px solid #c6c6c6;
}

.btnxl:hover{
    color: #E79041 !important;
    background-color: #FCF3EC !important;
}

/*Infinity Progress Bar*/

.progress-line, .progress-line:before {
height: 15px;
width: 100%;
margin: 0;
}
.progress-line {
    background-color: #f3f6f8;
    display: flex;
}
.progress-line:before {
    border-radius: 8px;
    background-color: #e79141;
    content: '';
    -webkit-animation: running-progress 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
    animation: running-progress 2s cubic-bezier(0.4, 0, 0.2, 1) infinite;
}
@-webkit-keyframes running-progress {
0% { margin-left: 0px; margin-right: 100%; }
50% { margin-left: 25%; margin-right: 0%; }
100% { margin-left: 100%; margin-right: 0; }
}
@keyframes running-progress {
0% { margin-left: 0px; margin-right: 100%; }
50% { margin-left: 25%; margin-right: 0%; }
100% { margin-left: 100%; margin-right: 0; }
}
/*End Infinity Progress Bar*/

/*month class*/
.MonthYearClass select{
    border:none;
    font-size: 26px;
    font-weight: 500;
    background-color: transparent;
} 

.MonthYearClass select:hover,.MonthYearClass select:focus {
    border:none;
    background-color: #ffffff;
} 
/*month class*/

/*eRequestMenu*/
.phone .layout-top .Application_Menu {
    pointer-events: visible;
    position: relative;
    z-index: 99;
}