﻿@import url("/WebPatterns/Theme.Patterns_SilkUI.css?35");

:root {
        
    /* Typography - Size */
    --font-size-display: 36px;
    
    --font-size-h1: 32px;
    --font-size-h2: 28px;
    --font-size-h3: 26px;
    --font-size-h4: 22px;
    --font-size-h5: 20px;
    --font-size-h6: 18px;

    --font-size-base: 16px;
    --font-size-s: 14px;
    --font-size-xs: 12px;   

    /* Typography - Weight */
    --font-light: 300;
    --font-regular: 400;
    --font-semi-bold: 600;
    --font-bold: 700;
    
    
    /* Color - Deloitte */
    --color-deloitte-green: #86BC25;
    --color-red: #E73C02;
    --color-red-light: #FB7171;
    --color-grey: #999;
    --color-dark-red:#843534;
    --color-dark-yellow:#EABD30;
     
    /* Deloitte accessible color*/
    --color-green-4:#43b02a;
    --color-green-accessible:#26890D;
    --color-green-6:#046A38;
    --color-teal-accessible:#0d8390;
    --color-blue-accessible:#007cb0;
    --color-gray-10:#63666A;
    --color-link-accesible:#005587;

    /* Color - Brand */
    --color-primary: #86BC25;
    --color-secondary: #303d60;
    
    --color-primary-hover: #295fd6;
    --color-primary-selected: rgba(20, 110, 245, .12);
    --color-primary-lightest: linear-gradient(rgba(255, 255, 255, .9), rgba(255, 255, 255, .9));

    /* Color - Extended */
    --color-red-lightest: #faeaea;
    --color-red-lighter: #e9aaaa;
    --color-red-light: #d96a6a;
    --color-red: #c92a2a;
    --color-red-dark: #ab2424;
    --color-red-darker: #8d1d1d;
    --color-red-darkest: #6f1717;
    
    --color-pink-lightest: #fbebf0;
    --color-pink-lighter: #efadc4;
    --color-pink-light: #e27098;
    --color-pink: #d6336c;
    --color-pink-dark: #b62b5c;
    --color-pink-darker: #96244c;
    --color-pink-darkest: #761c3b;
    
    --color-grape-lightest: #f7ecfa;
    --color-grape-lighter: #dfb2e9;
    --color-grape-light: #c678d9;
    --color-grape: #ae3ec9;
    --color-grape-dark: #9435ab;
    --color-grape-darker: #7a2b8d;
    --color-grape-darkest: #60226f;
    
    --color-violet-lightest: #f1edfd;
    --color-violet-lighter: #c6b6f6;
    --color-violet-light: #9b7fef;
    --color-violet: #7048e8;
    --color-violet-dark: #5f3dc5;
    --color-violet-darker: #4e32a2;
    --color-violet-darkest: #3e2880;
   
    --color-indigo-lightest: #eceffd;
    --color-indigo-lighter: #b3c1f7;
    --color-indigo-light: #7b92f1;
    --color-indigo: #4263eb;
    --color-indigo-dark: #3854c8;
    --color-indigo-darker: #2e45a5;
    --color-indigo-darkest: #243681;
    
    --color-blue-lightest: #e8f2fa;
    --color-blue-lighter: #a3c9ea;
    --color-blue-light: #5fa1db;
    --color-blue: #1a79cb;
    --color-blue-dark: #1667ad;
    --color-blue-darker: #12558e;
    --color-blue-darkest: #0e4370;
    
    --color-cyan-lightest: #e7f2f4;
    --color-cyan-lighter: #9eccd3;
    --color-cyan-light: #56a6b2;
    --color-cyan: #0d8091;
    --color-cyan-dark: #0b6d7b;
    --color-cyan-darker: #095a66;
    --color-cyan-darkest: #074650;
    
    --color-teal-lightest: #e6f2ef;
    --color-teal-lighter: #9cccbd;
    --color-teal-light: #52a58c;
    --color-teal: #087f5b;
    --color-teal-dark: #076c4d;
    --color-teal-darker: #065940;
    --color-teal-darkest: #044632;
    
    --color-green-lightest: #ebf7ed;
    --color-green-lighter: #afe0b8;
    --color-green-light: #73c982;
    --color-green: #37b24d;
    --color-green-dark: #2f9741;
    --color-green-darker: #267d36;
    --color-green-darkest: #1e622a;
    
    --color-lime-lightest: #f1f8e8;
    --color-lime-lighter: #c7e3a2;
    --color-lime-light: #9ecd5c;
    --color-lime: #74b816;
    --color-lime-dark: #639c13;
    --color-lime-darker: #51810f;
    --color-lime-darkest: #40650c;
    
    --color-orange-lightest: #fef0e6;
    --color-orange-lighter: #fcc29c;
    --color-orange-light: #f99551;
    --color-orange: #f76707;
    --color-orange-dark: #d25806;
    --color-orange-darker: #ad4805;
    --color-orange-darkest: #883904;
    
    --color-yellow-lightest: #fef5e5;
    --color-yellow-lighter: #fbd999;
    --color-yellow-light: #f8bc4c;
    --color-yellow: #f59f00;
    --color-yellow-dark: #d08700;
    --color-yellow-darker: #ac6f00;
    --color-yellow-darkest: #875700;
    
    /* Color - Neutral */
    --color-neutral-0: #ffffff;
    --color-neutral-1: #f8f9fa;
    --color-neutral-2: #f1f3f5;
    --color-neutral-3: #e9ecef;
    --color-neutral-4: #dee2e6;
    --color-neutral-5: #ced4da;
    --color-neutral-6: #adb5bd;
    --color-neutral-7: #6a7178;
    --color-neutral-8: #4f575e;
    --color-neutral-9: #272b30;
    --color-neutral-10: #101213;
    
    /* Color - Semantic */
    --color-error-light: #fceaea;
    --color-error: #dc2020;
    
    --color-warning-light: #fdf6e5;
    --color-warning: #e9a100;
    
    --color-success-light: #eaf3eb;
    --color-success: #29823b;
    
    --color-info-light: #e5f5fc;
    --color-info: #017aad;

    /* Space - Sizes */
    --space-none: 0;
    --space-xs: 4px;
    --space-s: 8px;
    --space-base: 16px;
    --space-m: 24px;
    --space-l: 32px;
    --space-xl: 40px;
    --space-xxl: 48px;
    
    /* Border Radius */
    --border-radius-none: 0;
    --border-radius-soft: 4px;
    --border-radius-rounded: 100px;
    --border-radius-circle: 100%;
    
    /* Border Size */
    --border-size-none: 0;
    --border-size-s: 1px;
    --border-size-m: 2px;
    --border-size-l: 3px;

    /* Elevation / Shadow */
    --shadow-none: none;
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, .1);
    --shadow-s: 0 2px 4px rgba(0, 0, 0, .1);
    --shadow-m: 0 4px 6px rgba(0, 0, 0, .1);
    --shadow-l: 0 6px 8px rgba(0, 0, 0, .1);
    --shadow-xl: 0 8px 10px rgba(0, 0, 0, .1);

    /* App Settings */
    --color-background-body: #f3f6f8;
    --header-size: 56px;
    --side-menu-size: 300px;
}

/*

    To override a style copy and paste it to
    the application theme and then modify it

    File: Deloitte Theme
    
    $0. Fonts
    $1. General Properties
    $2. Structure
    $3. Forms
    $4. Buit-in widgets
    $5. RichWidgets
    $6. Login
    $7. SILK Patterns
    $8. Usefull Classes
    $9. Deloitte Patterns
    $10. Custom Classes
    $11. Studio Preview
    $12. Print

*/

/*------------------------------------*\
        $0. Fonts
\*-------------------------------------*/

/* Fonts > Import Font */
@font-face {
    font-family: 'Open Sans';
    src: url('/Deloitte_Theme/fonts/opensans-regular-webfont.eot');
    src: url('/Deloitte_Theme/fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/Deloitte_Theme/fonts/opensans-regular-webfont.woff') format('woff'),
         url('/Deloitte_Theme/fonts/opensans-regular-webfont.ttf') format('truetype'),
         url('/Deloitte_Theme/fonts/opensans-regular-webfont.svg') format('svg');
    font-weight: 300;
}

@font-face {
    font-family: 'Open Sans';
    src: url('/Deloitte_Theme/fonts/opensans-regular-webfont.eot');
    src: url('/Deloitte_Theme/fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/Deloitte_Theme/fonts/opensans-regular-webfont.woff') format('woff'),
         url('/Deloitte_Theme/fonts/opensans-regular-webfont.ttf') format('truetype'),
         url('/Deloitte_Theme/fonts/opensans-regular-webfont.svg') format('svg');
    font-weight: 400;
}

@font-face {
    font-family: 'Open Sans';
    src: url('/Deloitte_Theme/fonts/opensans-bold-webfont.eot');
    src: url('/Deloitte_Theme/fonts/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/Deloitte_Theme/fonts/opensans-bold-webfont.woff') format('woff'),
         url('/Deloitte_Theme/fonts/opensans-bold-webfont.ttf') format('truetype'),
         url('/Deloitte_Theme/fonts/opensans-bold-webfont.svg') format('svg');
    font-weight: 600;
}

@font-face {
    font-family: 'Open Sans';
    src: url('/Deloitte_Theme/fonts/opensans-bold-webfont.eot');
    src: url('/Deloitte_Theme/fonts/opensans-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/Deloitte_Theme/fonts/opensans-bold-webfont.woff') format('woff'),
         url('/Deloitte_Theme/fonts/opensans-bold-webfont.ttf') format('truetype'),
         url('/Deloitte_Theme/fonts/opensans-bold-webfont.svg') format('svg');
    font-weight: 700;
}

@font-face {
    font-family: 'Open Sans';
    src: url('/Deloitte_Theme/fonts/opensans-extrabold-webfont.eot');
    src: url('/Deloitte_Theme/fonts/opensans-extrabold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/Deloitte_Theme/fonts/opensans-extrabold-webfont.woff') format('woff'),
         url('/Deloitte_Theme/fonts/opensans-extrabold-webfont.ttf') format('truetype'),
         url('/Deloitte_Theme/fonts/opensans-extrabold-webfont.svg') format('svg');
    font-weight: 800;
}

/* Fonts > Font Classes */


/* Fonts > Font Definition */
html,
body,
a,
select,
form,
fieldset,
table,
tr,
td,
img,
input,
button,
select,
textarea,
optgroup,
option {
    font-family: 'Open Sans', sans-serif;
}

.TileIcon_text,
.TileNumber_text,
.TileIconText_label,
.Heading1,
.Heading2,
.Heading3,
.Heading4,
.Header_title a,
.EditableTable thead td,
.TableRecords_Header {
    font-family: 'Open Sans', sans-serif;
}

/*------------------------------------*\
    $1. General Properties
\*-------------------------------------*/

html,
body,
form,
.Page {
    height: 100%;
    position: relative;
}

body,
select,
textarea,
input {
    color: #263238;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.43;
}

body {
    background-color: #f4f4f4;
    -webkit-tap-highlight-color: rgba(0,0,0,0);

    -webkit-overflow-scrolling: touch;
}

/*------------------------------------------------------------*/
/* 1.1 General Properties > a links ***************************/
/*------------------------------------------------------------*/



a.delete-link,
a.delete-link:link,
a.delete-link:visited {
    color: var(--color-red);
    opacity: 0.5;
}

.desktop a:hover,
.desktop a:link:hover,
.desktop a:visited:hover {
    color: #0076a8;
    text-decoration: underline;
}

div[onclick] {
    cursor: pointer; /* add a pointer cursor when the div has a click event */
}
/*------------------------------------------------------------*/
/* 1.2 General Properties > Margins ***************************/
/*------------------------------------------------------------*/

.OSAutoMarginTop {
    margin-top: 20px;
}

.OSInlineClear {
    /* This style will never be used in runtime.
    When applied in Service Studio, it will prevent the style 'OSInline' from being
    automatically applied to divs and tables with widths != (fill parent) */
}

/*------------------------------------*\
              $2. Structure
\*-------------------------------------*/

/*------------------------------------------------------------*/
/* 2.1 Structure > Header *************************************/
/*------------------------------------------------------------*/

.Header {
    border-bottom: 1px solid rgba(0,0,0,.2);
    height: 60px;
    line-height: 60px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 20;

    
}

.Header_center {
    position: relative;
}

.tablet .Header_center.ThemeGrid_Container,
.phone .Header_center.ThemeGrid_Container {
    padding: 0;
}

/* Structure > Header Background */
.Header_background {
    background-color: rgb(0, 0, 0);
    height: 100%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}

.Page.UseHeaderFade .Header .Header_background {
    display: none;
}

/* Structure > Header Title */
.Header_Title {
    float: left;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 150px;
    text-overflow: ellipsis;
    white-space: nowrap;

    
}

.phone .Header_Title,
.tablet .Header_Title {
    left: 60px;
    padding: 0;
    position: absolute;
    right: 60px;
    text-align: center;
}

/* Structure > Header Search */
.Header_Search {
    display: inline-block;
    margin-right: 20px;
    min-width: 100px;
}

/* Search inside header */
.Header .Search_wrapper input[type="text"] {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 3px;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2);
    height: 32px;
    line-height: 30px;
    padding-left: 30px;
}

.Header .Search_wrapper input[type="text"]:focus {
    border-color: #ccc;
    box-shadow: none;
}

.Header .Search_wrapper:after {
    left: 10px;
    top: 9px;
}

.Header .Search_wrapper input[type="text"] {
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 30px;
    color: #fff;
    -webkit-transition: all 300ms ease;
            transition: all 300ms ease;
    width: 100px;
}

.Header .Search_wrapper input[type="text"]:focus {
    border: 1px solid rgba(255, 255, 255, .3);
    width: 200px;
}

.Header .Search_wrapper:after {
    color: #cdcdcd;
    left: 10px;
    pointer-events: none;
}

.phone .Application_Menu .Login_Menu .Header_Search {
    margin-left: 30px;
    margin-right: 0;
}

/* Structure > Header Menu */
.Header_Menu,
.Header_Menu .ListRecords {
    display: inline-block;

    
    
}

.Header_Menu a,
.Header_Menu a:link,
.Header_Menu a:visited {
    color: #fff;
}

.Header_Menu a:hover,
.Header_Menu a:link:hover,
.Header_Menu a:visited:hover {
    color: #86bc25;
}

.phone .Header_Menu a:hover,
.phone .Header_Menu a:link:hover,
.phone .Header_Menu a:visited:hover,
.tablet .Header_Menu a:hover,
.tablet .Header_Menu a:link:hover,
.tablet .Header_Menu a:visited:hover {
    color: #fff;
}

.phone .Header_Menu a:hover,
.phone .Header_Menu a:link:hover,
.phone .Header_Menu a:visited:hover,
.tablet .Header_Menu a:hover,
.tablet .Header_Menu a:link:hover,
.tablet .Header_Menu a:visited:hover {
    color: #fff;
}

.phone .Menu_DropDownButton.open .Menu_TopMenu .Menu_DropDownArrow,
.tablet .Menu_DropDownButton.open .Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #fff;
}

/* Structure > Header Others Menu */
.Login_Menu {
    margin-right: 20px;
    position: absolute;
    right: 0;
    top: 0;
    white-space: nowrap;
}

.desktop.small.UseSidebar .Login_Menu {
    margin-right: 55px;
}

.phone .Login_Menu,
.tablet .Login_Menu {
    bottom: 0;
    display: block;
    margin-right: 0;
    top: initial;
    width: 100%;
}

.phone .Application_Menu .Login_Menu a:link,
.phone .Application_Menu .Login_Menu a:visited,
.tablet .Application_Menu .Login_Menu .logout_info a {
    padding: 0;
}

.phone .Application_Menu .Login_Menu .Login_Info {
    width: 100%;
}

.phone .Application_Menu .Login_Menu .Login_Info a,
.phone .Application_Menu .Login_Menu .Login_Info .Logout_Icon a {
    display: block;
}

.tablet .Application_Menu .Login_Menu .Login_Info .logout_info,
.phone .Application_Menu .Login_Menu .Login_Info .logout_info {
    border-top: 1px solid #fff;
    margin-top: 10px;
}

/* Structure > Header Button Menu */
a.Header_ButtonMenu {
    color: #fff;
    display: none;
    float: left;
    font-size: 20px;
    text-align: center;
    width: 50px;
}

.desktop a.Header_ButtonMenu {
    color: #dab702;
}

.tablet a.Header_ButtonMenu,
.phone a.Header_ButtonMenu {
    display: block;
    width: 50px;
}

.Page.active .Header_ButtonMenu {
    color: #72c02c;
}

/* Structure > Header Login Info */
.Login_Info,
.AppSwitcherContainer,
a.Login_Info_Username,
a.Login_Info_Username:link,
a.Login_Info_Username:visited {
    color: #333;
    font-size: 100%;
    font-weight: normal;
}

.Login_Info_Logout {
    font-size: 22px;
}

.Login_Info_Logout:before,
.Login_Info_Username:before,
.AppSwitcherContainer:before,
.AppSwitcherLink[disabled="disabled"]:before {
    color: #b3b3b3;
    font-family: FontAwesome;
    font-size: 14px;
    margin-right: 5px;
}

.Login_Info_Username:before {
    content: "\f007";
}

.Login_Info_Logout:before {
    content: "\f011";
    margin-right: 0;
}

a.Header_Call_Button {
    background-color: #00a3e0;
    border-radius: 2px;
    padding: 5px 10px;
}

a.Header_Call_Button:hover,
a.Header_Call_Button:link:hover {
    color: #fff ! important;
}

.Header_Call_Button .fa {
    margin-left: 8px;
}

/* Responsive Context */
.tablet .Login_Info_Logout:before,
.phone .Login_Info_Logout:before {
    font-size: 20px;
}

.phone .Application_Menu a.Header_Call_Button,
.phone .Application_Menu a.Header_Call_Button:link,
.phone .Application_Menu a.Header_Call_Button:link:visited,
.tablet .Application_Menu a.Header_Call_Button,
.tablet .Application_Menu a.Header_Call_Button:link,
.tablet .Application_Menu a.Header_Call_Button:link:visited {
    border-radius: 2px;
    display: inline-block;
    height: 40px;
    line-height: 40px;
    margin: 0 auto;
    margin-top: 10px;
    text-align: center;
    width: 160px;
}

.Logout_Icon {
    border-radius: 50%;
    text-align: center;
    width: 22px;
}

.Application_Title a,
.Application_Title a:link,
.Application_Title a:visited,
.Application_Title a:hover {
    color: #fff;
    padding-right: 10px;
    text-decoration: none;
}

.Header .Application_Title img {
    max-height: 30px;
    vertical-align: middle;
}

.Header .IconBadge {
    color: #fff;
    line-height: 10px;
}

.Header .IconBadge_number {
    border-color: #000;
    height: 17px;
    right: -7px;
    top: -10px;
}

.Header .IconBadge span.fa {
    font-size: 14px;
}

/* Responsive Context */
.tablet .Application_Title,
.phone .Application_Title {
    padding: 0;
}

.phone .Header .IconBadge_number,
.tablet .Header .IconBadge_number {
    border-color: #72c02c;
}

/*------------------------------------------------------------*/
/* 2.2 Structure > Menu ***************************************/
/*------------------------------------------------------------*/

.Menu_TopMenus {
    text-transform: uppercase;
    width: 100%;
}

/* Item Menu */
.Menu_TopMenu {
    position: relative;
}

/* Link/Button Menu */
.Menu_TopMenu a:link,
.Menu_TopMenu a:visited,
.Menu_TopMenu a {
    color: #fff;
    display: inline-block;
    font-weight: 700;
    padding: 0 20px;
    text-align: center;
    text-decoration: none;
    -webkit-transition: all 300ms ease;
            transition: all 300ms ease;
}

.tablet .Menu_TopMenu a,
.phone .Menu_TopMenu a {
    text-align: left;
}

/* Hover Menu */
.Menu_TopMenu a:hover {
    color: #fff;
}

/* Pointer */
.Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #fff;
    opacity: .5;
    position: absolute;
    right: 8px;
    top: 50%;
    -webkit-transition: all 300ms ease;
            transition: all 300ms ease;
}

.Menu_DropDownButton.open .Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #86bc25;
    opacity: 1;
    -webkit-transform: rotate(180deg) translateY(2px);
            transform: rotate(180deg) translateY(2px);
}

.Menu_DropDownButton.open .Menu_TopMenu a {
    color: #fff;
}

/* Active Menu */
.Menu_TopMenuActive {
    border-bottom: 3px solid #86bc25;
    height: 60px;
    line-height: 60px;
}

/* Submenu Item */
.Menu_DropDownPanel {
    background-color: #72c02c;
    border: none;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    box-shadow: 0 2px 10px 0 rgba(0,0,0,.2);
}

/* Active Menus */
.Menu_TopMenuActive a:link,
.Menu_TopMenuActive a:visited,
a.Menu_SubMenuItemActive:link,
a.Menu_SubMenuItemActive:visited {
    color: #fff;
}

/* Reset any inherit styles (e.g.: ChicagoMobile -> Chicago) */
div.Menu_DropDownPanel a,
div.Menu_DropDownPanel a:link,
div.Menu_DropDownPanel a:visited {
    color: #717578;
    height: auto;
}

div.Menu_DropDownPanel a:hover,
div.Menu_DropDownPanel a:link:hover,
div.Menu_DropDownPanel a:visited:hover {
    color: #fff;
}

/* SubMenu */
.Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownPanel a.Menu_SubMenuItem:link,
.Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    color: #fff;
    display: block;
    padding: 3px 45px;
}

/* hover submenu item */
.Menu_DropDownPanel a.Menu_SubMenuItem:hover,
.Menu_DropDownPanel a.Menu_SubMenuItem.Menu_SubMenuItemActive {
    background-color: #43b02a;
    color: #fff;
    font-weight: 700;
}

/* Menu tablet and phone */
.tablet .Application_Menu,
.phone .Application_Menu {
    background: #72c02c;
    bottom: 0;
    display: block;
    height: auto;
    left: 0;
    overflow: auto;
    position: fixed;
    top: 59px;
    /* Enable hardware acceleration */
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
    /* Animate the menu when opening and closing */
    -webkit-transition: all 300ms ease-out;
            transition: all 300ms ease-out;
    width: 250px;
    /* reduce animation flickering */

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-perspective: 1000;
        -ms-perspective: 1000;
            perspective: 1000;
}

.phone .Application_Menu {
    overflow-x: hidden;
    width: 100%;
}

.tablet.active .Application_Menu,
.phone.active .Application_Menu {
    -webkit-transform: translateX(0);
            transform: translateX(0);
}

.tablet .Application_Menu .Menu_TopMenu,
.phone .Application_Menu .Menu_TopMenu {
    border-top-width: 1px;
    margin: 0;
    padding: 0 0;
    width: 100%;
}

.tablet .Application_Menu .Menu_DropDownButton:hover,
.phone .Application_Menu .Menu_DropDownButton:hover {
    background: #43b02a;
}

.tablet .Application_Menu .Menu_DropDownButton.open .Menu_TopMenu,
.phone .Application_Menu .Menu_DropDownButton.open .Menu_TopMenu {
    background: #43b02a;
    box-shadow: none;
}

.tablet.active .Menu_Container,
.phone.active .Menu_Container {
    margin-bottom: 44px; /* iphone bottom toolbar */
    right: 0;
    width: 100%;
}

.tablet .Application_Menu .Menu_DropDownButton,
.phone .Application_Menu .Menu_DropDownButton {
    display: block;
    position: relative;
}

.tablet .Application_Menu a,
.phone .Application_Menu a,
.tablet .Application_Menu a:link,
.phone .Application_Menu a:link,
.tablet .Application_menu a:visited,
.phone .Application_menu a:visited {
    border: 0;
    box-sizing: border-box;
    display: inline-block;
    -webkit-transform: translateX(-300px) scale(.5);
            transform: translateX(-300px) scale(.5);
    -webkit-transition: all 300ms ease;
            transition: all 300ms ease;
    width: 100%;
}

.tablet.active .Application_Menu a,
.phone.active .Application_Menu a,
.tablet.active .Application_Menu a:link,
.phone.active .Application_Menu a:link,
.phone.active .Application_Menu a:visited,
.phone.active .Application_Menu a:visited {
    -webkit-transform: translateX(0) scale(1);
            transform: translateX(0) scale(1);
}

.tablet .Application_Menu .Menu_DropDownPanel,
.phone .Application_Menu .Menu_DropDownPanel {
    background-color: #50861f;
    border: 0;
    box-shadow: none;
    margin: 0;
    padding: 0;
    position: static;
}

.phone .Application_Menu .Menu_DropDownArrow,
.tablet .Application_Menu .Menu_DropDownArrow {
    opacity: 1;
    position: absolute;
    right: 14px;
    top: 30px;
}

.MenuSlider_IsOpen .LoginInfo {
    font-size: 30px;
}

/*------------------------------------------------------------*/
/* 2.3 Structure > Footer *************************************/
/*------------------------------------------------------------*/

.Footer {
    font-size: 12px;
    line-height: 40px;
    text-align: center;
    width: 100%;

    
}

.Footer a,
.Footer a:link,
.Footer a:visited {
    color: #005587;
    text-decoration: underline;
}

.Footer a:hover{
    text-decoration: underline;
}


/*------------------------------------------------------------*/
/* 2.4 Structure > Content ************************************/
/*------------------------------------------------------------*/

.Page > .Content {
    padding-top: 0;
}

html .ThemeGrid_Container {
    padding-left: 20px;
    padding-right: 20px;
}

.ThemeGrid_Container {
    margin-left: auto;
    margin-right: auto;
    max-width: 1280px;
}

/* Structure > Main Content */
.MainContent {
    min-height: 100%;
    padding: 20px;
    padding-bottom: 60px;
    
}

.phone .MainContent {
    padding: 0px;
}

.Page.active .MainContent {
    pointer-events: none;
}

/*------------------------------------------------------------*/
/* 2.5 Structure > Sidebar ************************************/
/*------------------------------------------------------------*/

a.Header_ButtonSidebar {
    color: #fff;
    display: none;
    float: right;
    font-size: 20px;
    text-align: center;
    width: 40px;
}

.desktop.small.UseSidebar a.Header_ButtonSidebar,
.tablet.UseSidebar a.Header_ButtonSidebar {
    display: block;
}

.Sidebar {
    background: #f8f8f8;
    height: 100%;
    padding: 30px;
    position: fixed;
    right: -320px;
    top: 50px;
    width: 450px;

    
    
    
}

.desktop .Sidebar,
.desktop.hd .Sidebar,
.desktop.big .Sidebar {
    right: 0;
}

.desktop.TopFullWidth .Sidebar,
.desktop.hd.TopFullWidth .Sidebar,
.desktop.big.TopFullWidth .Sidebar {
    display: inline-block;
    float: right;
    margin-top: 10px;
    position: initial;
}

.desktop.small .Sidebar,
.tablet .Sidebar {
    background-color: #edf1f3;
    right: -450px;
    -webkit-transition: -webkit-transform 300ms ease;
            transition:         transform 300ms ease;
}

.desktop.small .Sidebar.open,
.tablet .Sidebar.open {
    -webkit-transform: translateX(-450px);
            transform: translateX(-450px);
}

.ie8.desktop.small .Sidebar.open {
    right: 0;
}

.phone .Sidebar {
    position: relative;
    right: 0;
    width: 100%;
}

/*------------------------------------------------------------*/
/* 2.6 Structure > Title Section ******************************/
/*------------------------------------------------------------*/

.Title_Section .Title {
    line-height: 40px;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 50%;
}

.Title_Section {
    background-position: center center;
    background-size: cover;
    /*box-shadow: inset 0 -1px 2px rgba(0, 0, 0, .15);*/
    color: #333;
    margin-top: 0;
    padding: 80px 20px 30px 20px;
}

.Title_Section.Black {
    background-color: #131819;
    color: #fff;
}

.Title_Section.Blue {
    background-color: #00a3e0;
    color: #fff;
}

.Title_Section.Transparent {
    background-color: transparent;
}

.Title_Section.White {
    background-color: #fff;
}

.Title_Section.Yellow {
    background-color: #dab702;
    color: #fff;
}

.Title_Section.Orange {
    background-color: #ed8b00;
    color: #fff;
}

.Title_Section.Red {
    background-color: #da291c;
    color: #fff;
}

.Title_Section.DarkRed {
    background-color: #b71c1c;
    color: #fff;
}

.Title_Section.DarkSilver {
    background-color: #bbbcbc;
    color: #fff;
}

.Title_Section.DarkGray {
    background-color: #53565a;
    color: #fff;
}

.Title_Section.Plum {
    background-color: #541798;
    color: #fff;
}

.Title_Section.DarkPlum {
    background-color: #000660;
    color: #fff;
}

.Title_Section.Green {
    background-color: #43b02a;
    color: #fff;
}

.Title_Section.LightGreen {
    background-color: #72c02c;
    color: #fff;
}

.Title_Section.Turquoise {
    background-color: #00b0c1;
    color: #fff;
}

.Title_Section.DarkBlue {
    background-color: #194968;
    color: #fff;
}

.Title_Section.Silver {
    background-color: #d0d0ce;
}

.Title_Section.Gray {
    background-color: #97999b;
    color: #fff;
}

.Title_Section.BackgroundFixed {
    background-attachment: fixed;
}

.tablet .Title_Section.BackgroundFixed,
.phone .Title_Section.BackgroundFixed {
    background-attachment: scroll;
}

.UseSidebar .Title_Section {
    margin: 70px 20px 0 20px;
    padding: 20px 0;
}

.Title_Section.Silver .SectionWebsite_title,
.Title_Section.Transparent .SectionWebsite_title,
.Title_Section.White .SectionWebsite_title {
    color: #333;
}

.Title_Section.Yellow .SectionWebsite_title {
    color: #fff;
}

/* Structure > Page Title Actions */
.Title_Section .Actions {
    line-height: 32px;
    text-align: right;
    width: 50%;
}

.Title_Section .Actions a {
    margin-left: 20px;
    text-decoration: none;
}

.Title_Section .Actions a:first-child {
    margin-left: 0;
}

.phone.portrait .Actions {
    margin-bottom: 0;
    position: relative;
    text-align: center;
    width: 100%;
}

.phone.portrait .Actions .Button {
    margin: 0;
    margin-bottom: 10px;
    width: 100%;
}

.phone.portrait .Actions .Button:last-child {
    margin-bottom: 0;
}

.phone .Title_Section .Title {
    margin-bottom: 10px;
    width: 100%;
}

.phone .Title_Section .Actions,
.phone .Title_Section a.ActionAdd,
.phone .Title_Section a.ActionEdit,
.phone .Title_Section a.ActionDelete,
.phone .Title_Section a.ActionChange {
    width: 100%;
}

.Title_Links {
    font-size: 14px;
    margin-top: 5px;
}

/*------------------------------------------------------------*/
/* 2.7 Structure > Website ************************************/
/*------------------------------------------------------------*/

.Website .MainContent {
    margin: 0;
    min-height: inherit;
    padding: 0;

     /* push the footer down on preview */
}

.Website .Footer {
    background-color: inherit;
    height: auto;
    padding: 0;
    position: static;
    width: auto;
}

.SectionWebsite {
    text-align: center;
}

.SectionWebsite.UsePadding {
    padding: 40px 0;
}

.SectionWebsite .AccordionVertical,
.SectionWebsite .Box.Silver,
.SectionWebsite .Box.White,
.SectionWebsite .Panel,
.SectionWebsite .Card,
.SectionWebsite .SectionExpandable,
.SectionWebsite.Transparent .Box.Transparent,
.SectionWebsite.Silver .Box.Transparent,
.SectionWebsite.Silver .Section,
.SectionWebsite.White .Box.Transparent,
.SectionWebsite.Transparent .Section {
    color: #333;
}

.SectionWebsite .Box,
.SectionWebsite .Box.Transparent {
    color: #fff;
}

.SectionWebsite_title {
    color: #fff;
    margin-bottom: 40px;
    text-align: center;
}

/*------------------------------------*\
    $3. Forms
\*-------------------------------------*/

html input {
    height: 34px;
}

textarea,
select,
input {
    font-size: 14px;
}

textarea:focus,
select:focus,
input:focus {
    border-color: #aaa;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

/*------------------------------------------------------------*/
/* 3.1 Forms > Radio Button & Checkbox ************************/
/*------------------------------------------------------------*/
html input[type="radio"],
html input[type="checkbox"] {
    background-color: transparent;
    box-shadow: none !important;
    height: 20px;
}

input[type="checkbox"]:after {
    border: 3px solid #333;
    border-right: 0;
    border-top: 0;
    height: 5px;
    left: 20%;
    top: 23%;
    width: 11px;
}

input[type="radio"]:before,
input[type="checkbox"]:before {
    background: #fff;
    /*border-color: #eceff1;
    box-shadow: none;*/
    border-color: #aaa;
    box-shadow: inset 0 0 2px #000;
}

.checkbox-circle input[type="checkbox"]:before {
    border-radius: 25px;
}

input[type="radio"]:focus,
input[type="checkbox"]:focus {
    border: 0;
}

input[type="radio"]:checked:before {
    background: var(--color-blue-accessible);
}

input[type="radio"]:checked:after {
    background: #fff;
    border-color: transparent;
}

input[type="radio"]:disabled:before {
    background: #f4f6f8;
    box-shadow: none;
}

input[type="radio"]:disabled:checked:after {
    background: #cfd8dc;
    border-color: transparent;
}

.ie input[type="radio"],
.ie input[type="checkbox"],
.ie .Form input[type="radio"],
.ie .Form input[type="checkbox"] {
    border-radius: 0;
}

input[type="checkbox"]:checked:before {
    background: white;
}

input[type="checkbox"]:checked:after {
    border-color: var(--color-blue-accessible);
}

input[type="checkbox"]:disabled:checked:before {
    background: #f4f6f8;
}

input[type="checkbox"]:disabled:before {
    background-color: #f4f6f8;
    box-shadow: none;
}

/*------------------------------------------------------------*/
/* 3.2 Forms > Inputs, Selects & Textarea *********************/
/*------------------------------------------------------------*/
textarea,
select,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"] {
    background-color: #fff;
    border: 1px solid #DCDCDC;
    border-radius: 2px;
    /*box-shadow: inset 0 -2px 0 0 rgba(19,24,25,0.2);*/
    font-size: 12px;
    line-height: 40px;
    vertical-align: initial;
}

textarea {
    height: 100px;
    line-height: 24px;
}

select {
    box-shadow: none;
    line-height: 20px;
    padding: 4px 6px;
}

.ie8 select {
    padding: 6px;
}

/*------------------------------------------------------------*/
/* 3.3 Forms > ReadOnly & Disabled ****************************/
/*------------------------------------------------------------*/

.Form:not(.ReadOnly) {
    cursor: text;
}

select.ReadOnly {
    cursor: pointer;
}

.Form input.ReadOnly,
.Form textarea.ReadOnly,
.Form select.ReadOnly {
    font-size: 12px;
}

.Form input.ReadOnly:not(.Not_Valid),
.Form textarea.ReadOnly:not(.Not_Valid),
.Form select.ReadOnly:not(.Not_Valid) {
    border-radius: 2px;
    box-shadow: none;
    cursor: pointer;
    font-size: 12px;
}

.Form input.ReadOnly:not(.Not_Valid):focus,
.Form textarea.ReadOnly:not(.Not_Valid):focus,
.Form select.ReadOnly:not(.Not_Valid):focus {
    background-color: #fff;
    border: 1px solid #aaa;
    border-radius: 2px;
    font-size: 12px;
}

.Form input.ReadOnly:not(.Not_Valid),
.Form textarea.ReadOnly:not(.Not_Valid),
.Form select.ReadOnly:not(.Not_Valid) {
    background-color: #fff;
    border: 1px solid #DCDCDC;
    box-shadow: inset 0 -2px 0 0 rgba(19,24,25,0.2);
}

.Form textarea.ReadOnly[readonly="readonly"],
.Form textarea.ReadOnly[disabled="disabled"],
.Form select.ReadOnly[disabled="disabled"],
.Form input.ReadOnly[readonly="readonly"],
.Form input.ReadOnly[disabled="disabled"],
.Form input[disabled="disabled"].ReadOnly:not(.Not_Valid),
.Form input[readonly="readonly"].ReadOnly:not(.Not_Valid),
.Form textarea[disabled="disabled"].ReadOnly:not(.Not_Valid),
.Form textarea[readonly="readonly"].ReadOnly:not(.Not_Valid),
.Form select[disabled="disabled"].ReadOnly:not(.Not_Valid),
.Form select[readonly="readonly"].ReadOnly:not(.Not_Valid),
textarea[disabled="disabled"],
textarea[readonly="readonly"],
select[disabled="disabled"],
input[readonly="readonly"],
input[disabled="disabled"] {
    background-color: #f4f6f8;
    cursor: not-allowed;
}

input[disabled="disabled"][type="text"]:focus,
input[disabled="disabled"][type="password"]:focus,
textarea[disabled="disabled"]:focus,
textarea[readonly="readonly"]:focus,
select[disabled="disabled"]:focus,
input[readonly="readonly"]:focus,
input[disabled="disabled"]:focus,
.Form input[readonly="readonly"].ReadOnly:not(.Not_Valid):focus,
.Form input[disabled="disabled"].ReadOnly:not(.Not_Valid):focus,
.Form textarea[readonly="readonly"].ReadOnly:not(.Not_Valid):focus,
.Form textarea[disabled="disabled"].ReadOnly:not(.Not_Valid):focus,
.Form select[readonly="readonly"].ReadOnly:not(.Not_Valid):focus,
.Form select[disabled="disabled"].ReadOnly:not(.Not_Valid):focus {
    background-color: #f4f6f8;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

input[type="radio"].ReadOnly,
input[type="checkbox"].ReadOnly,
.Form input.ReadOnly[disabled="disabled"][type="radio"],
.Form input.ReadOnly[readonly="readonly"][type="radio"],
.Form input.ReadOnly[disabled="disabled"][type="checkbox"],
.Form input.ReadOnly[readonly="readonly"][type="checkbox"],
.Form input[type="radio"].ReadOnly,
.Form input[type="checkbox"].ReadOnly {
    background-color: transparent;
    border-width: 0;
}

/*------------------------------------------------------------*/
/* 3.4 Forms > Not Valid **************************************/
/*------------------------------------------------------------*/

.Form input.Not_Valid,
.Form select.Not_Valid,
.Form textarea.Not_Valid,
input.Not_Valid,
select.Not_Valid,
textarea.Not_Valid {
    border-radius: 4px;
}

.Form textarea.Not_Valid:focus,
.Form textarea.Not_Valid,
textarea.Not_Valid:focus,
textarea.Not_Valid {
    font-size: 12px;
    padding: 10px 12px;
}

select.Not_Valid:focus,
input.Not_Valid:focus,
textarea.Not_Valid:focus {
    border: 1px solid #bf1601;
}

.Form input[type="checkbox"].Not_Valid,
.Form input[type="radio"].Not_Valid,
input[type="checkbox"].Not_Valid,
input[type="radio"].Not_Valid {
    border: transparent;
    padding: 0;
}

.Form input.ReadOnly,
.Form textarea.ReadOnly {
    background: #fff;
}

/*------------------------------------*\
    $4. Buit-in widgets
\*-------------------------------------*/

/*------------------------------------------------------------*/
/* 4.1 Buit-in widgets > Filter Form **************************/
/*------------------------------------------------------------*/

.Filters_Wrapper {
    background: #fff;
    border-radius: 0;
    line-height: 32px;
    padding: 10px;
}

.Filters_Wrapper .Button {
    margin-left: 10px;
}

/*------------------------------------------------------------*/
/* 4.2 Buit-in widgets > EditableTable ************************/
/*------------------------------------------------------------*/

.EditableTable {
    border: 0;
}

.EditableTable thead tr th {
    border-bottom: 2px solid #eceff1;
    color: #78909c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.EditableTable thead td {
    color: #333;
    font-weight: 700;
}

.EditableTable td {
    padding: 8px 6px;
}

.EditableTable tr:nth-child(odd) {
    background-color: transparent;
}

.EditableTable tr:nth-child(even) {
    background-color: #f6f7f8;
}

.EditableTable tbody tr:not(.RowControlGroup) td {
    border-bottom: 0;
}

td.RowWithAddAction {
    background: none repeat scroll 0 0 #fff;
    border-bottom: none;
    padding: 0;
}

td.RowWithAddAction a {
    padding: 10px 0 10px 22px;
}

.EditableTable tbody tr:not(.RowControlGroup):not(.Selected) td:first-child {
    padding-left: 12px;
}

.EditableTable tr.RowControlGroup a {
    color: #86bc25;
}

.EditableTable tr.RowControlGroup a:hover {
    color: #dab702;
}

.EditableTable tr.RowControlGroup .ControlActions {
    border: 0;
}

.EditableTable select,
.EditableTable input[type="text"],
.EditableTable input[type="password"],
.EditableTable input[type="datetime"],
.EditableTable input[type="datetime-local"],
.EditableTable input[type="date"],
.EditableTable input[type="month"],
.EditableTable input[type="time"],
.EditableTable input[type="week"],
.EditableTable input[type="number"],
.EditableTable input[type="email"],
.EditableTable input[type="url"],
.EditableTable input[type="search"],
.EditableTable input[type="tel"],
.EditableTable input[type="color"] {
    height: 32px;
    line-height: 30px;
}

.EditableTable tr.RowControlGroup a.SaveRowAction {
    color: #43b02a;
}

.EditableTable tr.RowControlGroup a.CancelRowAction {
    color: #00a3e0;
}

.EditableTable tr.RowControlGroup a.DeleteRowAction {
    color: #f44336;
}

/*------------------------------------------------------------*/
/* 4.3 Buit-in widgets > TableRecords *************************/
/*------------------------------------------------------------*/

.TableRecords {
    background-color: #fefefe;
    border: 0;
    box-shadow: none;
    padding: 5px 0 0;
}

.TableRecords_Header {
    border-bottom: solid 2px #eceff1;
    color: #78909c;
    font-size: 12px;
    font-weight: 700;
    padding: 10px;
    text-transform: uppercase;
}

.TableRecords > tbody > tr:hover {
    background: #fefefe;
}

.TableRecords_OddLine {
    background-color: transparent;
}

.TableRecords_EvenLine {
    background-color: #f6f7f8;
}

.TableRecords_OddLine:first-child,
.TableRecords_EvenLine:first-child,
.TableRecords_Header:first-child {
    padding-left: 20px;
}

.TableRecords_OddLine,
.TableRecords_EvenLine {
    border: 0;
    padding: 15px 10px;
}

.TableRecords_OddLine:not(:first-child),
.TableRecords_EvenLine:not(:first-child) {
    border: 0;
}

/*------------------------------------------------------------*/
/* 4.4 Buit-in widgets > ShowRecord ***************************/
/*------------------------------------------------------------*/
.ShowRecord_Caption {
    color: #78909c;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

/*------------------------------------------------------------*/
/* 4.5 Buit-in widgets > EditRecord ***************************/
/*------------------------------------------------------------*/
.EditRecord_Caption {
    color: #78909c;
    font-weight: 700;
}

/*------------------------------------*\
              $5. RichWidgets
\*-------------------------------------*/

/*------------------------------------------------------------*/
/* 5.1 RichWidgets > Feedback Ajax Loading ********************/
/*------------------------------------------------------------*/

.Feedback_AjaxWait {
    background-color: white;
    border-radius: 0;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    bottom: 0;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .2);
    color: #86bc25;
    font-size: 12px;
    height: 60px;
    padding: 16px 20px 10px 20px;
    right: 20px;
}

.Feedback_AjaxWait .Loader {
    background: url(/SilkUIFramework/img/loading_lisbon_yellow.gif?1083) no-repeat;
    height: 16px;
    position: relative;
    text-indent: -9999em;
    width: 16px;
}

/*------------------------------------------------------------*/
/* 5.2 RichWidgets > Feedback Message *************************/
/*------------------------------------------------------------*/

div.Feedback_Message_Wrapper {
    left: 0;
    margin-top: 102px;
    z-index: 9;
}

div.Feedback_Message_Error,
div.Feedback_Message_Success,
div.Feedback_Message_Warning,
div.Feedback_Message_Info {
    border-radius: 0;
    box-shadow: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    line-height: normal;
    max-width: 100%;
    min-width: 300px;
    padding: 10px 40px 10px 40px;
    word-break: break-word;

    -webkit-backface-visibility: hidden;
}

div.Feedback_Message_Info:before,
div.Feedback_Message_Success:before,
div.Feedback_Message_Error:before,
div.Feedback_Message_Warning:before {
    font-size: 20px;
    left: 15px;
    top: 9px;
}

a.Feedback_Message_Wrapper_Close {
    color: #000;
    opacity: .3;
    right: 10px;
    top: 8px;
}

a.Feedback_Message_Wrapper_Close:hover {
    opacity: .6;
}

.tablet a.Feedback_Message_Wrapper_Close,
.phone a.Feedback_Message_Wrapper_Close {
    pointer-events: none;
}

div.Feedback_Message_Error .Feedback_Message_Wrapper_Close:after,
div.Feedback_Message_Warning .Feedback_Message_Wrapper_Close:after,
div.Feedback_Message_Info .Feedback_Message_Wrapper_Close:after,
div.Feedback_Message_Success .Feedback_Message_Wrapper_Close:after {
    color: #000;
    content: "\f00d";
    font-family: FontAwesome;
    text-align: right;
}

div.Feedback_Message_Success a.Feedback_Message_Wrapper_Close,
div.Feedback_Message_Error a.Feedback_Message_Wrapper_Close,
div.Feedback_Message_Warning a.Feedback_Message_Wrapper_Close,
div.Feedback_Message_Info a.Feedback_Message_Wrapper_Close {
    opacity: 1;
}

/* RichWidgets > Feedback Message > Success */
div.Feedback_Message_Success {
    background-color: #26890D;
    border: 0;
    color: #fff;
}

div.Feedback_Message_Success:before {
    color: #fff;
}

div.Feedback_Message_Success a.Feedback_Message_Wrapper_Close:after {
    color: #000;
    opacity: .1;
}

/* RichWidgets > Feedback Message > Error */
div.Feedback_Message_Error {
    background-color: #DA291C;
    border: 0;
    color: #fff;
}

div.Feedback_Message_Error:before {
    color: #fff;
}

div.Feedback_Message_Error a.Feedback_Message_Wrapper_Close:after {
    color: #000;
    opacity: .1;
}

/* RichWidgets > Feedback Message > Warning */
div.Feedback_Message_Warning {
    background-color: #ffd54f;
    border: 0;
    color: #000;
}

div.Feedback_Message_Warning:before {
    color: #fff;
}

div.Feedback_Message_Warning a.Feedback_Message_Wrapper_Close:after {
    color: #000;
    opacity: .1;
}

/* RichWidgets > Feedback Message > Info */
div.Feedback_Message_Info {
    background-color: #007CB0;
    border: 0;
    color: #fff;
}

div.Feedback_Message_Info:before {
    color: #fff;
}

div.Feedback_Message_Info a.Feedback_Message_Wrapper_Close:after {
    color: #000;
    opacity: .1;
}

/*------------------------------------------------------------*/
/* 5.3 RichWidgets > List Navigation **************************/
/*------------------------------------------------------------*/

a.ListNavigation_PageNumber:link,
span.ListNavigation_CurrentPageNumber,
span.ListNavigation_Ellipsis,
a.ListNavigation_Previous:link,
a.ListNavigation_Next:link,
span.ListNavigation_DisabledNext,
span.ListNavigation_DisabledPrevious {
    cursor: pointer;
    display: inline-block;
    font-size: 12px;
    font-weight: normal;
    margin: 0 0 0 10px;
    padding: 2px 7px;
    text-align: center;
    text-shadow: none;
    vertical-align: middle;
    white-space: nowrap;
}

a.ListNavigation_PageNumber:link,
span.ListNavigation_CurrentPageNumber,
span.ListNavigation_Ellipsis,
a.ListNavigation_Previous:link,
a.ListNavigation_Next:link {
    background: #eceff1;
    border: 0;
    border-radius: 2px;
    color: #00a3e0;
}

a.ListNavigation_PageNumber:link:hover,
a.ListNavigation_Previous:link:hover,
a.ListNavigation_Next:link:hover {
    background: #007CB0;
    color: #fff;
}

span.ListNavigation_CurrentPageNumber {
    background: #007CB0;
    color: #fff;
}

span.ListNavigation_DisabledNext,
span.ListNavigation_DisabledPrevious {
    cursor: default;
    display: none;
}

a.ListNavigation_Next:link {
    color: transparent;
    overflow: hidden;
    padding: 2px 10px;
    position: relative;
    width: 0;
}

a.ListNavigation_Next:link:hover {
    background: #007CB0;
    color: transparent;
}

a.ListNavigation_Previous:link {
    color: transparent;
    overflow: hidden;
    padding: 2px 10px;
    position: relative;
    width: 0;
}

a.ListNavigation_Previous:link:hover {
    background: #007CB0;
    color: transparent;
}

.ListNavigation_Previous:before,
.ListNavigation_DisabledPrevious:before {
    color: #007CB0;
    content: "\f104";
    font-family: FontAwesome;
    margin-right: 8px;
    position: absolute;
    right: 0;
}

.ListNavigation_Next:after,
.ListNavigation_DisabledNext:after {
    color: #007CB0;
    content: "\f105";
    font-family: FontAwesome;
    left: 0;
    margin-left: 8px;
    position: absolute;
}

.ListNavigation_Next:hover:after,
.ListNavigation_DisabledNext:hover:after {
    color: #fff;
}

.ListNavigation_Previous:hover:before,
.ListNavigation_DisabledPrevious:hover:before {
    color: #fff;
}

/*------------------------------------------------------------*/
/* 5.4 RichWidgets > Popup Editor *****************************/
/*------------------------------------------------------------*/

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar {
    background-color: #fff;
    height: 50px;
    padding-top: 10px;
}

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-titlebar-close,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar-close {
    background-image: url(/WebPatterns/img/PopupCloseDark.png?35);
    opacity: .3;
    right: 20px;
    top: 20px;
}

div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-titlebar-close-no-title {
    opacity: .3;
}

div.os-internal-Popup .os-internal-ui-dialog .os-internal-ui-dialog-title,
div.os-internal-Popup.os-internal-ui-dialog .os-internal-ui-dialog-title {
    color: #131819;
    font-size: 22px;
    font-weight: 400;
}

/*------------------------------------*\
        $6. Login
\*------------------------------------*/

.Login {
    background-color: #010100;
    color: #fff;
    height: 100%;
    min-height: 280px;
    position: absolute;
    width: 100%;

    
    
}

.Login_Box {
    left: 25%;
    margin-top: -280px;
    padding-top: 20px;
    width: 300px;
}

.Login__Form .InputWithIcons .InputIcon {
    background: transparent;
    border-right: 1px solid #eceff1;
    color: #607d8b;
    font-size: 20px;
    height: 30px;
    line-height: 30px;
    margin: 10px 0;
    padding: 0 6px;
}

.Login__Form input[type="text"],
.Login__Form input[type="password"],
.Login__Form input[type="email"] {
    color: #758d99;
    font-style: italic;
    height: 50px;
    line-height: 50px;
}

.Login__Form .Button,
.Login__Form .Button.ButtonDefault,
.Login__Form  .Button.Is_Default {
    background: #046A38;
    height: 50px;
    line-height: 50px;
}

.phone .Login_Box,
.tablet .Login_Box {
    left: 50%;
    margin-left: 0 !important;
    margin-top: 0 !important;
    padding-top: 0;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
       -moz-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%);
    z-index: 2;
}

.phone .Login-floating-background,
.tablet .Login-floating-background {
    background-color: rgba(0, 0, 0, .7);
    height: 100%;
    left: 0;
    position: fixed;
    width: 100%;
    z-index: 1;
}

.LoginForm_Subtitle {
    font-size: 24px;
    font-weight: 400;
    margin-top: 15px;
}

.Login__Logo {
    padding-bottom: 80px;
}

.Login_background {
    
}

.Login_background img {
    
    
}

.Login__Form {
    background-color: transparent;
    padding: 20px 0;
}

.phone .Login_Footer {
    padding: 15px 0;
}

/* Accordion Harrow */
.fa-angle-down:before {
    padding-left: 1px;
}

/* Burguer */
.fa-bars {
    cursor: pointer;
}

/*------------------------------------*\
        $7 SILK Patterns
\*------------------------------------*/

/*------------------------------------------------------------*/
/* 7.1 SILK Patterns > Content ********************************/
/*------------------------------------------------------------*/

/* SILK Patterns > Accordion */
.AccordionVertical {
    background-color: #fff;
    border: none;
    box-shadow: none;
}

.AccordionVertical__header {
    border-radius: 2px;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.13);
}

.AccordionVertical_item.open .AccordionVertical__header {
    font-weight: 400;
}

.AccordionVertical___title {
    color: #263238;
}

.AccordionVertical___icon {
    border-left: 0;
    color: #949fa3;
}

.AccordionVertical___icon > .fa {
    border: 0;
    color: #00a3e0;
    font-size: 24px;
}

.AccordionVertical_item.open > .AccordionVertical__header > .AccordionVertical___icon > .fa {
    border: 0;
    color: #cfd8dc;
}

.AccordionVertical_item.open > .AccordionVertical__content {
    background: #f3f6f7;
    padding: 16px 20px 25px 20px;
}

/* SILK Patterns > Alert */
.Alert {
    border: 0;
    border-radius: 0;
}

.Alert.Info {
    background-color: #00a3e0;
    color: #fff;
}

.Alert.Info span.fa {
    color: #fff;
}

.Alert.Success {
    background-color: #72c02c;
    color: #fff;
}

.Alert.Success span.fa {
    color: #fff;
}

.Alert.Error {
    background-color: #DA291C;
    color: #fff;
}

.Alert.Error span.fa {
    color: #fff;
}

.Alert.Warning {
    background-color: #ffd54f;
    color: #7d7341;
}

.Alert.Warning span.fa {
    color: #7d7341;
}

/* SILK Patterns > Balloon */
.Balloon {
    border-color: #fff;
    border-radius: 2px;
    box-shadow: 0 1px 10px 0 rgba(0,0,0,.1);
}

/* Format the Balloon Arrow Position */
.Balloon .tooltipster-arrow-top.tooltipster-arrow {
    top: 0;
}

.Balloon .tooltipster-arrow-bottom.tooltipster-arrow {
    top: 0;
}

.Balloon .tooltipster-arrow-left.tooltipster-arrow {
    left: -1px;
}

.Balloon .tooltipster-arrow-right.tooltipster-arrow {
    left: 1px;
}

.Balloon_footer {
    border: 0;
}

/* SILK Patterns > BlankSlate */
.Blank {
    background: #f3f6f7;
    border: 0;
    border-radius: 6px;
}

/* SILK Patterns > Box */


/* SILK Patterns > Bullets */


/* SILK Patterns > ButtonsArea */


/* SILK Patterns > Cards */
.Card {
    background-color: #fff;
    border: 0;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.13);
}

/* SILK Patterns > Carousel */
.owl-theme .owl-controls .owl-buttons div {
    background: transparent;
    color: #79868a;
    font-size: 30px;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span {
    background-color: #00a3e0;
}

/* SILK Patterns > Info */


/* SILK Patterns > Modal */
.ModalContainer {
    border: 0;
    border-radius: 2px;
    box-shadow: 0 1px 6px 0 rgba(0,0,0,.3);
}

.ModalContainer .Heading1 {
    border-bottom: 1px solid #eceff1;
    margin-bottom: 28px;
    padding-bottom: 18px;
}

/* SILK Patterns > Panel */
.Panel {
    background: #fff;
    border: 0;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.13);
    padding: 20px;
    padding-bottom: 10px;
}

.Panel_header {
    border-bottom: 1px solid #eceff1;
    padding: 0;
    padding-bottom: 18px;
}

.Panel .Panel_footer {
    border: 0;
    padding-bottom: 0;
}

/* SILK Patterns > Post */
.Post .Post_icon img {
    border: 0;
    border-radius: 4px;
}

.Post__description {
    margin-top: 10px;
}

.Post .Post__label {
    font-size: 14px;
    font-weight: 700;
}

/* SILK Patterns > Section */


/* SILK Patterns > Section Expandable */
.SectionExpandable {
    background-color: #fff;
    border: 0;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.13);
}

.SectionExpandable .SectionExpandable_header {
    padding: 7px 10px;
}

.SectionExpandable.expanded .SectionExpandable_header {
    position: relative;
    border-bottom: 2px solid rgba(227,227,227,0.5);
}

.SectionExpandable.expanded .SectionExpandable_header:after {
    bottom: 0;
    content: "";
    height: 1px;
    left: 20px;
    position: absolute;
    right: 20px;
}

.SectionExpandable .SectionExpandable_header .Heading2 {
    font-size: 16px;
    font-weight: bold;
    line-height: normal;
    padding-left: 10px;
}

.SectionExpandable__icon {
    color: #86BC25;
}

.SectionExpandable.expanded .SectionExpandable__icon {
    color: #cfd8dc;
    padding-left: 0;
}

.SectionExpandable .SectionExpandable_header .Heading2.SectionExpandable__icon {
    font-size: 24px;
}

.SectionExpandable_content {
    padding-left: 20px;
    padding-right: 20px;
}

.SectionExpandable_content label {
    font-weight: 700;
}

.SectionExpandable_content > div:not(:last-child) {
    margin-bottom: 20px;
}

.SectionExpandable.expanded .SectionExpandable_content {
    padding: 15px 20px 30px 20px;
}

/* SILK Patterns > Separator */
.Separator {
    border-bottom: 1px solid #eceff1;
}

/* SILK Patterns > Tooltip */
.tooltip_style {
    background-color: #333;
    color: white;
}

/* TOOLTIP FIX */
.tooltipster-arrow-top .tooltipster-arrow-border,
.tooltipster-arrow-top-right .tooltipster-arrow-border,
.tooltipster-arrow-top-left .tooltipster-arrow-border,
.tooltipster-arrow-top span,
.tooltipster-arrow-top-right span,
.tooltipster-arrow-top-left span {
    bottom: -8px;
}

.tooltipster-arrow-bottom span,
.tooltipster-arrow-bottom-right span,
.tooltipster-arrow-bottom-left span,
.tooltipster-arrow-bottom .tooltipster-arrow-border,
.tooltipster-arrow-bottom-right .tooltipster-arrow-border,
.tooltipster-arrow-bottom-left .tooltipster-arrow-border {
    top: -8px;
}

.tooltipster-arrow-left span,
.tooltipster-arrow-left .tooltipster-arrow-border {
    right: -8px;
}

.tooltipster-arrow-right span,
.tooltipster-arrow-right .tooltipster-arrow-border {
    left: -8px;
}

/*------------------------------------------------------------*/
/* 7.2 SILK Patterns > Controls *******************************/
/*------------------------------------------------------------*/

/* SILK Patterns > ButtonGroup */
.ButtonGroup_button * {
    color: #00a3e0;
}

.ButtonGroup_button.Button {
    border-color: #aaa;
    border-right-width: 0;
    border-style: solid;
    border-width: 1px;
    color: #333;
}

.desktop .ButtonGroup_button.Button:hover,
.tablet .ButtonGroup_button.Button:hover,
.phone .ButtonGroup_button.Button:hover {
    background: #000;
    color: white;
}

.ButtonGroup_button.Button:first-child {
    border-radius: 2px 0 0 2px;
}

.ButtonGroup_button.Button:last-child {
    border-radius: 0 2px 2px 0;
}

.desktop .ButtonGroup_button.Button.disabled,
.desktop .ButtonGroup_button.Button.disabled:hover {
    background-color: #eceff1;
    box-shadow: none;
}

.ButtonGroup_button.Button.active.disabled, 
.ButtonGroup_button.Button.active.disabled:hover {
    background: #aaa;
    color: white;
}

.ButtonGroup_button.active,
.desktop .ButtonGroup_button.active:hover {
    background: none;
    background-color: #333;
    border-bottom-width: 1px;
    box-shadow: inset 0 1px 1px 0 rgba(18,20,20,.2);
    color: #fff;
}

.ButtonGroup_button.active span.fa,
.desktop .ButtonGroup_button.active:hover span.fa {
    color: #fff;
}

.phone .ButtonGroup_button.Button:first-child {
    border-bottom-left-radius: 0;
    border-top-right-radius: 2px;
}

.phone .ButtonGroup_button.Button:last-child {
    border-bottom-left-radius: 2px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.phone .NoResponsive > .ButtonGroup .ButtonGroup_button.Button:first-child {
    border-bottom-left-radius: 2px;
    border-top-right-radius: 0;
}

.phone .NoResponsive > .ButtonGroup .ButtonGroup_button.Button:last-child {
    border-bottom-left-radius: 0;
    border-top-right-radius: 2px;
}

/* SILK Patterns > Calendar */
.pika-button {
    line-height: 80px;
}

.is-selected .pika-button {
    background: #00a3e0;
    font-weight: 400;
}

.pika-table th {
    background: #f3f6f7;
    border-bottom: 1px solid #eceff1;
    color: #00a3e0;
    line-height: 40px;
    opacity: 1;
}

.pika-table th abbr[title],
.pika-table th acronym[title] {
    text-decoration: none;
}

.pika-title {
    border-bottom: 1px solid #eceff1;
    color: #00a3e0;
    height: 52px;
}

.pika-title .pika-label:nth-child(2) {
    font-weight: 400;
}

.pika-label {
    font-weight: 700;
}

.pika-title div,
.pika-prev:after,
.pika-next:after {
    color: #00a3e0;
}

.pika-single {
    border: 1px solid #eceff1;
}

.pika-prev,
.is-rtl .pika-next,
.pika-lendar .Calendar-prevYear,
.pika-lendar .Calendar-nextYear,
.pika-next,
.is-rtl .pika-prev {
    border: 0;
}

.pika-prev:after {
    height: 52px;
    top: 2px;
}

.pika-next:after {
    height: 52px;
    top: 2px;
}

body > .Calendar-topCont .Calendar-day,
body > .Calendar-topCont .Calendar-weekNumber,
.Calendar-dayNames div,
.Calendar-bottomBar-today,
.triggerTime,
.triggerTimeBack {
    color: #00a3e0;
    font-weight: 700;
    line-height: 42px;
}

.pika-time-container {
    border: 1px solid #eceff1;
}

/* SILK Patterns > Dropdown */

.DropdownMenu {
    border-radius: 5px;    
    box-shadow: 1px 1px 3px #eeeeee;
    border-color: #eeeeee;
}

.DropdownMenu .PH > a {
    color: #263238;
    padding-left: 15px;
    padding-right: 15px;
}
/*
.ButtonDropdown.open .ButtonDropdown_button.Button {
    background-color: #fff;
    border-bottom-width: 1px;
    box-shadow: inset 0 2px 4px 0 rgba(18,20,20,.2);
}
*/

.ButtonDropdown.open .ButtonDropdown_button.Button .ButtonDropdown_icon {
    background-color: transparent;
}

.ButtonDropdown_button.Button,
.IconDropdown_button.Button,
.ButtonDropdown_button.Button:hover,
.IconDropdown_button.Button:hover,
.desktop .ButtonDropdown_button.Button,
.desktop .ButtonDropdown_button.Button:hover,
.desktop .IconDropdown_button.Button,
.desktop .IconDropdown_button.Button:hover {
    background-color: transparent;
    border: none;
    box-shadow: none;
    border-radius: 2px;
    color: var(--color-deloitte-green);
    padding: 0;
    font-size: large;
}

.DropdownMenu .PH > a:hover,
.desktop .DropdownMenu .PH > a:hover {
    background-color: rgba(0,163,224,.2);
    color: #00a3e0;
    font-weight: 700;
}

.ButtonDropdown_icon,
.IconDropdown_button.Button .IconDown {
    background-color: #fff;
    height: 29px;
    margin-left: 10px;
    width: 30px;
}

.ButtonDropdown_icon .fa,
.InlineDropdown_icon .fa,
.IconDown .fa {
    color: #00a3e0;
}

.ButtonDropdown .ButtonDropdown_icon,
.InlineDropdown .InlineDropdown_icon {
    margin-left: 30px;
}

.IconDropdown_button.Button .IconDown {
    margin-left: 40px;
}

.ButtonDropdown.open .ButtonDropdown_icon .fa-caret-down:before,
.InlineDropdown.open .InlineDropdown_icon .fa-caret-down:before,
.IconDropdown.open .IconDown .fa-caret-down:before {
    content: "\f0d8";
}

.phone .ButtonDropdown_icon,
.tablet .ButtonDropdown_icon {
    height: 35px;
}

.ButtonDropdown_button.Button:hover .ButtonDropdown_icon {
    background-color: transparent;
    -webkit-transition: all 100ms ease;
            transition: all 100ms ease;
}

.IconDropdown_button.Button {
    padding-right: 0;
}

.phone .IconDropdown_button.Button .IconDown,
.tablet .IconDropdown_button.Button .IconDown {
    height: 35px;
}

.IconDropdown_button.Button:hover .IconDown {
    background-color: transparent;
    -webkit-transition: all 100ms ease;
            transition: all 100ms ease;
}

.IconDropdown.open .IconDropdown_button.Button {
    background-color: #f5f5f5;
    box-shadow: inset 0 2px 4px 0 rgba(18,20,20,.2);
}

.IconDropdown.open .IconDropdown_button.Button .IconDown {
    background-color: transparent;
}

/* SILK Patterns > FileUpload */
.FileUpload {
    background-color: rgba(0,0,0,0.05);
    border: 1px solid #CCCCCC;
    border-radius: 4px;
    padding: 10px;
}

.FileUpload_Label {
    padding: 0 20px;
}

.FileUpload .Button.Is_Default,
.FileUpload .Button {
    background-color: #00a3e0;
    border-radius: 2px;
    height: 30px;
    line-height: 30px;
    padding: 0 20px;
}

/* SILK Patterns > InputWithIcons */
.InputWithIcons.Right .InputIcon {
    border-bottom-right-radius: 1px;
    border-top-right-radius: 1px;
}

.InputWithIcons .InputIcon {
    background: #f3f6f7;
    border-bottom-left-radius: 1px;
    border-top-left-radius: 1px;
    color: #90a4ae;
}

/* SILK Patterns > RangeSlider */
.SliderRange .ui-slider-range {
    background-color: #00a3e0;
    border-radius: 16px;
    box-shadow: none;
    height: 16px;
}

.SliderRange {
    background-color: #f3f6f7;
    border: none;
    border-radius: 16px;
    box-shadow: none;
    height: 16px;
}

.SliderRange .ui-slider-handle,
.phone .SliderRange .ui-slider-handle,
.tablet .SliderRange .ui-slider-handle {
    background: none;
    background-color: #fff;
    border-radius: 30px;
    box-shadow: 0 1px 3px rgba(107, 107, 107, .3);
    height: 30px;
    top: -6px;
    width: 30px;
}

.SliderRange .ui-slider-handle:before,
.phone .SliderRange .ui-slider-handle:before,
.tablet .SliderRange .ui-slider-handle:before {
    border-color: #90a4ae;
    height: 12px;
    left: 9px;
    margin-left: 0;
    top: 8px;
}

.SliderRange .ui-slider-handle:after,
.phone .SliderRange .ui-slider-handle:after,
.tablet .SliderRange .ui-slider-handle:after {
    border-color: #90a4ae;
    height: 12px;
    left: 13px;
    top: 8px;
    width: 2px;
}

.SliderRange .ui-slider-handle:active {
    box-shadow: none;
}

.Slider_minvalue,
.Slider_maxvalue,
.Slider_currentvalue,
.Slider_currentvalue2 {
    color: #333;
}

/* SILK Patterns > Search */


select {
    height: 40px;
    line-height: 25px;
    border-radius: 2px;
    box-shadow: none;
    border: 1px solid #DCDCDC;
    padding-left: 15px;
    font-size: 14px;
}

select:focus {
    border-color: #00a3e0;
}

/* SILK Patterns > Search */

.Search_wrapper input[type="text"] {
    height: 40px;
    line-height: 40px;
    border-radius: 2px;
    box-shadow: none;
    border: 1px solid #DCDCDC;
    padding-left: 15px;
    font-size: 14px;
}

.Search_wrapper input[type="text"]:focus {
    border-color: #00a3e0;
}

.Search_wrapper:after {
    border-right: none;
    color: #607d8b;
    left: auto;
    right: 5px;
    line-height: 20px;
    padding-right: 15px;
    top: 10px;
}

/* SILK Patterns > Select2 */
.select2-container .select2-choice {
    color: #263238;
    height: 40px;
    line-height: 40px;
}

.select2-container .select2-choice .select2-arrow,
.select2-container .select2-choice div {
    background-color: #f6f6f6;
    border-left: 0;
    width: 40px;
}

.select2-container .select2-choice .select2-arrow:before {
    color: #00a3e0;
    content: "\f0d7";
    font-family: "FontAwesome";
    margin-left: 16px;
}

.select2-container.select2-dropdown-open .select2-choice .select2-arrow:before {
    content: "\f0d8";
}

.select2-container .select2-choice .select2-arrow b,
.select2-container .select2-choice div b {
    background-position: 7px 2px;
    width: 40px;
}

.select2-dropdown-open .select2-choice .select2-arrow b,
.select2-dropdown-open .select2-choice div b {
    background-position: -11px 2px;
}

.select2-container .select2-choice span {
    color: #263238;
}

.select2-dropdown-open .select2-choice {
    background-color: #fff;
}

.select2-drop.select2-drop-active {
    border-top: 1px solid #dadbde;
    padding-top: 5px;
}

.select2-search {
    padding-bottom: 4px;
}

.select2-search input {
    background: none;
    border-radius: 30px;
    line-height: 30px;
    padding-left: 28px;
}

.select2-search:before {
    color: #607d8b;
    content: "\f002";
    font-family: "FontAwesome";
    left: 16px;
    position: absolute;
    top: 10px;
}

.select2-results .select2-highlighted {
    background-color: #ccedf9;
    color: #000;
    font-weight: 500;
}

.select2-container-multi .select2-choices .select2-search-choice {
    background: #007CB0;
    border: 0;
    color: #fff;
    line-height: 24px;
    padding: 3px 14px 3px 20px;
    position: relative;
}

.select2-container-multi .select2-search-choice-close {
    background: none;
    font-size: 12px;
    left: 6px;
    top: 3px;
}

.select2-container-multi .select2-search-choice-close:before {
    color: black;
    content: "\f00d";
    font-family: "FontAwesome";
    opacity: 1;
    position: absolute;
}

.select2-default{
    color: var(--color-gray-10)!important;
}

/* SILK Patterns > ToggleButton */
.ToggleButton {
    background: #cfd8dc;
    border: 0;
    border-radius: 100px;
    width: 40px;
    height: 20px;
}

.ToggleButton.changed {
    border: 0;
}

.ToggleButton_label:after {
    border: 0;
    border-radius: 100%;
    height: 12px;
    left: 3px;
    top: 4px;
    width: 12px;
}

.ToggleButton_label.changed:after {
    border: 0;
    border-radius: 100%;
    height: 12px;
    left: 24px;
    top: 4px;
    width: 12px;
}

/*------------------------------------------------------------*/
/* 7.3 SILK Patterns > Data ***********************************/
/*------------------------------------------------------------*/

/* SILK Patterns > Badge */
.Badge {
    border-radius: 2px;
    font-size: 14px;
    font-weight: bold;
    line-height: 20px;
    padding: 0;
}

/* SILK Patterns > Counter */
.Counter {
    background-color: #fff;
    border: 0;
    border-radius: 2px;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.13);
}

.Counter.Small,
.Counter.Medium,
.Counter.Large {
    background: #fff;
}

.Counter.Small {
    height: 70px;
}

.Counter.Medium {
    height: 90px;
}

.Counter.Large {
    height: 110px;
}

.Counter.Small .Counter_number,
.Counter.Small .Counter_label,
.Counter.Medium .Counter_number,
.Counter.Medium .Counter_label {
    margin: 0 15px;
    top: 50%;
    transform: translateY(-50%);
}

.Counter.Small .Counter_number,
.Counter.Medium .Counter_number {
    border-radius: 2px;
    font-size: 14px;
    height: 20px;
    width: 20px;
}

.Counter.Small .Counter_row,
.Counter.Medium .Counter_row {
    display: inline-block;
    height: 100%;
    width: 50%;
}

.Counter.Small .Counter_row:first-child,
.Counter.Medium .Counter_row:first-child {
    float: right;
    text-align: right;
}

.Counter.Small .Counter_row:last-child,
.Counter.Medium .Counter_row:last-child {
    float: left;
    text-align: left;
}

.Counter.Small .Counter_number,
.Counter.Medium .Counter_number {
    color: #fff;
    left: initial;
    right: 0;
    text-align: center;
}

.Counter .Counter_label {
    color: #333;
    font-weight: 700;
}

.Counter.Large .Counter_number {
    font-size: 36px;
    font-weight: 400;
}

.Counter.Large .Counter_row:first-child {
    height: 60%;
}

.Counter.Large .Counter_row:last-child {
    height: 45%;
}

/* SILK Patterns > IconBadge */
.IconBadge_number {
    background: #da291c;
    line-height: 11px;
    min-width: 17px;
    padding: 1px;
    right: -5px;
    top: -5px;
}

/* SILK Patterns > ProgressBar */
.Progress {
    background-color: #dadbde;
    border-radius: 40px;
    box-shadow: none;
}

.Progress_bar {
    border-radius: 40px;
}

.Progress.Large {
    font-size: 14px;
    font-weight: 700;
    height: 32px;
}

/* SILK Patterns > Tile */
.Tile {
    background-color: #fff;
    border-bottom: solid 4px #fff;
    border-radius: 2px;
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.13);
    color: #949fa3;
}

.TileIcon_icon,
.TileNumber_number,
.TileIconText_icon {
    color: #384142;
}

/* SILK Patterns > UserInitials */

.UserInitials,
.UserInitials.Small,
.UserInitials.Medium,
.UserInitials.Large {
    background-color: #f6f7f8;
    border: 0
    box-sizing: content-box;
}
/*------------------------------------------------------------*/
/* 7.4 SILK Patterns > Layout *********************************/
/*------------------------------------------------------------*/

/* SILK Patterns > Layout Popup */
.MainPopup {
    background: #fff;
    display: table-cell;
    padding: 14px 16px;
    vertical-align: top;
}

.MainPopup .Button.ThemeGrid_MarginGutter {
    margin-left: 10px;
}

/*------------------------------------------------------------*/
/* 7.5 SILK Patterns > Mobile *********************************/
/*------------------------------------------------------------*/

/* SILK Patterns > BottomMenu */
.BottomMenu_wrapper {
    background-color: transparent;
}

.BottomMenu_item.active {
    background-color: #dab702;
}

.BottomMenu_item.active span.fa {
    color: #fff;
}

.BottomMenu_wrapper a span.fa,
.BottomMenu_item span.fa {
    color: #bdc5c7;
}

/* SILK Patterns > ListItem */
.ListItem {
    background-color: #fff;
    border: 1px solid #dadbde;
    padding-left: 15px;
}

a .ListItem:after {
    color: #949fa3;
}

/* SILK Patterns > ListItemGroup */
.ListItemGroup .ListItem {
    border: 0;
    border-bottom: solid 1px  #dadbde;
}

/* SILK Patterns > ListItemToggle */


/*------------------------------------------------------------*/
/* 7.6 SILK Patterns > Navigation *****************************/
/*------------------------------------------------------------*/

/* SILK Patterns > Breadbrumbs */
.Breadcrumbs {
    color: #90a4ae;
    font-size: 14px;
}

.Breadcrumbs a {
    color: #00a3e0;
}

.Breadcrumbs .fa {
    color: #00a3e0;
    font-size: 20px;
}

/* SILK Patterns > NavigationBar */
.NavigationBar a,
.NavigationBar a:link,
.NavigationBar a:visited {
    color: #37474f;
}

.NavigationBar a.Active {
    color: #263238;
}

.desktop .NavigationBar a:hover,
.desktop .NavigationBar a:link:hover {
    color: #263238;
}

.NavigationBar a.Active:not(.ie7):before,
.NavigationBar a.Active:not(.ie8):before {
    border-bottom: 4px solid #00a3e0;
    display: none;
}

.NavigationBar a:after,
.NavigationBar a:link:after {
    background-color: #eceff1;
    width: 100%;
}

.NavigationBar a.Active:after {
    background-color: #00a3e0;
}

.desktop .NavigationBar a:hover:after,
.desktop .NavigationBar a:link:hover:after {
    background-color: #00a3e0;
}

.desktop .NavigationBar a:hover,
.desktop .NavigationBar a:link:hover {
    font-weight: 700;
}

.phone .NavigationBar a:active,
.phone .NavigationBar a:link:active,
.tablet .NavigationBar a:active,
.tablet .NavigationBar a:link:active {
    color: #00a3e0;
}

.phone .NavigationBar a:active:after,
.phone .NavigationBar a:link:active:after,
.tablet .NavigationBar a:active:after,
.tablet .NavigationBar a:link:active:after {
    background-color: #00a3e0;
}

/* SILK Patterns > SectionIndex */
.SectionIndex a,
.SectionIndex a:link,
.SectionIndex a:visited {
    color: #37474f;
}

.SectionIndex a.active,
.SectionIndex a:hover,
.desktop .SectionIndex a.active,
.desktop .SectionIndex a:hover {
    color: #37474f;
}

.SectionIndex.vertical a {
    border-left: 2px solid transparent;
    margin: 0 0 4px 0;
    padding: 8px 0 8px 10px;
}

.SectionIndex.vertical a.active,
.SectionIndex.vertical a:hover {
    border-left-color: #00a3e0;
}

/* SILK Patterns > Tabs */
.Tabs {
    border: 0;
    border-top: none;
    background: white;
    box-shadow: inset 0 -1px 1px 0 rgba(255,255,255,0.5), 0 2px 2px 0 rgba(0,0,0,0.22);
}

.Tabs_header {
    background: transparent;
}

.Tabs_body {
    padding: 25px 30px;
}

.Tabs__tab {
    background: #f8f8f8;
    border-bottom: 1px solid #eceff1;
    border-left: 0;
    border-top: 0;
    color: #999;
    padding: 10px;
}

.Tabs__tab label {
    font-size: 12px;
    white-space: pre-wrap;
    overflow: overlay;
}

.Tabs__tab.active {
    background: transparent;
    border-top: 4px solid #86BC25;
    color: #333;
}

.Tabs__tab:not(.active) {
    padding-top: 14px;
}


.Tabs__tab:hover {
    background: transparent;
    color: #263238;
}

.Tabs > .Tabs_header > .PH:empty {
    display: none;
}

/* SILK Patterns > Wizard */
.WizardParent {
    border: 0;
    overflow: visible;
    padding-left: 15px;
}

.WizardStep a,
.WizardStep a:link {
    background: transparent;
    bottom: -25px;
    left: -15px;
    line-height: 10px;
    position: absolute;
}

.WizardStep a:before,
.WizardStep a:link:before {
    background: #72c02c;
    border: 5px solid #fefefe;
    border-radius: 30px;
    content: "";
    height: 20px;
    left: 10px;
    position: absolute;
    top: -35px;
    width: 20px;
}

.WizardStep.Past a:before,
.WizardStep.Past a:link:before {
    background: #00a3e0;
}

.WizardStep.Past a,
.WizardStep.Past a:link,
.WizardStep.Past a:visited {
    line-height: 10px;
}

.WizardStep.ActiveStep,
.WizardStep.ActiveStep a,
.WizardStep.ActiveStep a:link,
.WizardStep.ActiveStep a:visited {
    border-top-color: #72c02c;
}

.WizardStep.Past {
    background: #00a3e0;
}

.WizardStep {
    background: #eceff1;
    border: 0;
    height: 10px;
    line-height: 10px;
    margin: 0;
    padding: 0;
    position: relative;
}

.WizardStep:after,
.WizardStep:before {
    display: none;
}

/*------------------------------------*\
      $8. Usefull Classes
\*------------------------------------*/

/*------------------------------------------------------------*/
/* 8.1 Usefull Classes > Text Classes *************************/
/*------------------------------------------------------------*/

.Heading1 {
    font-size: 32px;
    font-weight: 400;
    line-height: 43px;
}

.Heading2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 33px;
}

.Heading3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 24px;
}

.Heading4 {
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
}

.Label {
    background: #cfd8dc;
    border-radius: 10px;
    color: #78909c;
    font-weight: 700;
    padding: 2px 12px;
}

.label-assigned-to {
    background: #666;
    color: white;
}

.Text_Error {
    color: #DA291C;
}

.Text_Note {
    color: #90a4ae;
}

.Note {
    color: #90a4ae;
    font-size: 12px;
    font-weight: 700;
}

.Semibold {
    font-weight: 700;
}

.Skin,
.White-Skin {
    padding: 20px 30px;
}

.White-Skin {
    background: white;
}

.White-skin-menu {
    border-radius: 10px 10px 0 0;
}

/*------------------------------------------------------------*/
/* 8.2 Usefull Classes > Buttons ******************************/
/*------------------------------------------------------------*/
.Button,
a.Button {
    background: #fff;
    border: 1px solid #DCDCDC;
    border-bottom-width: 0;
    border-radius: 3px;
    box-shadow: inset 0 -2px 0 0 rgba(19,24,25,0.2);
    color: #333;
    line-height: 32px;
    padding: 0 24px;
    -webkit-transition: all 100ms ease;
            transition: all 100ms ease;
}

.ie8 .Button,
.ie8 a.Button {
    border-bottom-width: 1px;
}

input.Button:focus {
    border-bottom: 1px solid #999;
}

input.Button {
    line-height: 31px;
}

.desktop .Button:hover,
.desktop a.Button:hover {
    background-color: #f8f8f8;
    border-bottom-width: 1px;
    box-shadow: none;
    color: #333;
}

.Button:hover:active,
a.Button:hover:active {
    background-color: #f8f8f8;
    border-bottom-width: 1px;
    box-shadow: none;
    color: #fff;
}

/* Usefull Classes > Default Action Button */
.Button.ButtonDefault,
.Button.Is_Default {
    background-color: #046A38;
    color: #fff;
    border: 1px solid #DCDCDC;
}

.desktop .Button.ButtonDefault:hover,
.desktop .Button.Is_Default:hover {
    background-color: #26890D;
    border-color: ##6890D;
    color: #fff;
}

.Button.ButtonDefault:hover:active,
.Button.Is_Default:hover:active {
    background-color: #26890D;
    color: #fff;
}

/* Scaffolding buttons */
a.ActionAdd,
a.ActionAdd:link,
a.ActionAdd:visited,
a.ActionEdit,
a.ActionEdit:link,
a.ActionEdit:visited,
a.ActionDelete,
a.ActionDelete:link,
a.ActionDelete:visited,
a.ActionChange,
a.ActionChange:link,
a.ActionChange:visited {
    background-color: #72c02c;
    border: 1px solid 0;
    border-bottom: 0;
    border-radius: 2px;
    box-shadow: none;
    color: #fff;
    display: inline-block;
    line-height: 30px;
    margin-left: 10px;
    min-width: 80px;
    padding: 10px 24px;
    text-align: center;
    -webkit-transition: all 100ms ease;
            transition: all 100ms ease;
}

.desktop a.ActionAdd:hover,
.desktop a.ActionAdd:hover:visited,
.desktop a.ActionAdd:link:hover,
.desktop a.ActionEdit:hover,
.desktop a.ActionEdit:link:hover,
.desktop a.ActionEdit:link:visited,
.desktop a.ActionDelete:hover,
.desktop a.ActionDelete:hover:visited,
.desktop a.ActionDelete:link:hover,
.desktop a.ActionChange:hover,
.desktop a.ActionChange:hover:visited,
.desktop a.ActionChange:link:hover {
    background-color: #26890D;
    border-bottom-width: 1px;
    border-color: 0;
    box-shadow: none;
    color: #fff;
}

.desktop a.ActionAdd:hover:active,
.desktop a.ActionEdit:hover:active,
.desktop a.ActionDelete:hover:active,
.desktop a.ActionChange:hover:active {
    background-color: #26890D;
    border-color: 0;
    color: #fff;
}

/* Usefull Classes > Other buttons */
.Button.Is_Orange {
    background-color: #F5A623;
    color: #000;
}

.Button.Is_Orange:hover {
    background-color: #F6AF39;
    color: #000;
}

.Button.Is_White {
    background-color: #FFF;
    color: #000;
}

.Button.Is_White:hover {
    background-color: #FFF;
    color: #000;
}

.Button.Is_Black {
    background-color: #333;
    color: white;
}

.Button.Is_Black:hover {
    background-color: #000;
    color: white;
}

.Button.Is_Brown {
    background-color: #BF9300;
    color: white;
}

.Button.Is_Brown:hover {
    background-color: #977503;
    color: white;
}

.Button.Is_LightRed,
.Button.Is_LightRed:hover 
.Button.Erase,
.Button.Erase:hover  {
    background-color: var(--color-red-light);
    color: white;
}

.Button.Cancel {
    border: 1px solid #00a3e0;
    color: #00a3e0;
}

.desktop .Button.Cancel:hover {
    background-color: #fff;
    border: 1px solid #00a3e0;
    color: #00a3e0;
}

.Button.Cancel:hover:active {
    color: #00a3e0;
}

.Button.Success {
    background-color: #72c02c;
    border-color: 0;
    color: #fff;
}

.desktop .Button.Success:hover {
    background-color: #43b02a;
    border-color: 0;
    color: #fff;
}

.Button.Success:hover:active {
    background-color: #43b02a;
    border-color: 0;
    color: #fff;
}

.Button.Danger,
a.ActionDelete {
    background-color: #DA291C;
    border-color: 0;
    color: #fff;
}

.desktop .Button.Danger:hover {
    background-color: #b71c1c;
    border-color: 0;
    color: #fff;
}

.Button.Danger:hover:active {
    background-color: #b71c1c;
    border-color: 0;
    color: #fff;
}

.Button.Link {
    background-color: transparent;
    border-color: transparent;
    box-shadow: none;
    color: #00a3e0;
    font-weight: 500;
}

.desktop .Button.Link:hover {
    background-color: transparent;
    border-color: 0;
    color: #0076a8;
}

a.Button.Link:active,
.Button.Link:active {
    background-color: transparent;
    border-bottom-width: 1px;
    border-color: 0;
    color: #0076a8;
}

.Button.Small,
.Panel__Actions .Button,
.Section_Actions .Button {
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    min-width: 60px;
    padding: 0 18px;
}

.Button.Icon {
    min-width: 0;
    padding: 0 18px;
}

.Button.Icon span.fa {
    margin: 0;
}

.Button.Loading:before,
.Button.Loading[disabled]:before,
.Button.Loading:disabled:before {
    background-image: url(/WebPatterns/img/loading_lisbon_yellow.gif?35);
}

.Button.Is_Default.Loading:before,
.Button.Is_Default.Loading[disabled]:before,
.Button.Is_Default.Loading:disabled:before,
.Button.ButtonDefault.Loading:before,
.Button.ButtonDefault.Loading[disabled]:before,
.Button.ButtonDefault.Loading:disabled:before {
    background-image: url(/WebPatterns/img/loading_lisbon_white.gif?35);
}

.Button.Small.Loading:before {
    margin-top: 4px;
}

.Button.Loading.Icon:before {
    margin-right: 0;
}

.Button.Loading span.fa {
    display: none;
}

/* Styles for Disabled Buttons  */
.Button[disabled],
.Button:disabled,
.Button.ButtonDefault[disabled],
.Button.Is_Default:disabled,
.Button.ButtonDefault:disabled,
.Button.Danger[disabled],
.Button.Danger:disabled,
.Button.Success[disabled],
.Button.Success:disabled {
    background-color: #eceff1;
    color: #90a4ae;
}

.Button.Is_Default[disabled] {
    background-color: #046A38;
    color: white;
    opacity: 0.5;
}

.Button[disabled].Is_Orange,
.Button:disabled.Is_Orange {
    background: #F5A623;
    color: #000;
    opacity: 0.5;
}

.Button[disabled].Is_White,
.Button:disabled.Is_White {
    background-color: #f2f2f2;
    color: #000;
    opacity: 0.5;
}

/* Responsive Context **************************/
.phone .Button,
.tablet .Button,
.phone a.Button,
.tablet a.Button {
    height: 38px;
    line-height: 36px;
    text-decoration: none;
}

.phone input.Button:focus,
.tablet input.Button:focus,
.phone input.Button,
.tablet input.Button {
    height: 37px;
    line-height: 37px;
}

.phone .Button.Small,
.tablet .Button.Small {
    height: 30px;
    line-height: 28px;
}
/*------------------------------------------------------------*/
/* 8.3 Usefull Classes > Background Colors ********************/
/*------------------------------------------------------------*/

.Black {
    background-color: #000;
    color: #fff;
}

.Blue {
    background-color: #00a3e0;
    color: #fff;
}

.DarkBlue {
    background-color: #3f51b5;
    color: #fff;
}

.DarkPlum {
    background-color: #000660;
    color: #fff;
}

.DarkRed {
    background-color: #b71c1c;
    color: #fff;
}

.DarkSilver {
    background-color: #bbbcbc;
    color: #fff;
}

.DarkGray {
    background-color: #53565a;
    color: #fff;
}

.Gray {
    background-color: #97999b;
    color: #fff;
}

.Green {
    background-color: #43b02a;
    color: #fff;
}

.LightGreen {
    background-color: #72c02c;
    color: #fff;
}

.Orange {
    background-color: #ed8b00;
    color: #fff;
}

.Plum {
    background-color: #541798;
    color: #fff;
}

.Red {
    background-color: #da291c;
    color: #fff;
}

.Silver {
    background-color: #d0d0ce;
    color: #000;
}

.Turquoise {
    background-color: #00bcd4;
    color: #fff;
}

.White {
    background-color: #fff;
    color: #000;
}

.Yellow {
    background-color: #d8c101;
    color: #fff;
}

/* Usefull Classes > Counter & Tile Background */
.Tile.Black {
    background-color: #fff;
    border-bottom-color: #131819;
}

.Counter.Small.Black .Counter_number,
.Counter.Medium.Black .Counter_number {
    background-color: #131819;
}

.Counter.Large.Black .Counter_number {
    color: #131819;
}

.Tile.Blue {
    background-color: #fff;
    border-bottom-color: #00a3e0;
}

.Counter.Small.Blue .Counter_number,
.Counter.Medium.Blue .Counter_number {
    background-color: #00a3e0;
}

.Counter.Large.Blue .Counter_number {
    color: #00a3e0;
}

.Tile.DarkBlue {
    background-color: #fff;
    border-bottom-color: #194968;
}

.Counter.Small.DarkBlue .Counter_number,
.Counter.Medium.DarkBlue .Counter_number {
    background-color: #194968;
}

.Counter.Large.DarkBlue .Counter_number {
    color: #194968;
}

.Tile.DarkPlum {
    background-color: #fff;
    border-bottom-color: #000660;
}

.Counter.Small.DarkPlum .Counter_number,
.Counter.Medium.DarkPlum .Counter_number {
    background-color: #000660;
}

.Counter.Large.DarkPlum .Counter_number {
    color: #000660;
}

.Tile.DarkRed {
    background-color: #fff;
    border-bottom-color: #b71c1c;
}

.Counter.Small.DarkRed .Counter_number,
.Counter.Medium.DarkRed .Counter_number {
    background-color: #b71c1c;
}

.Counter.Large.DarkRed .Counter_number {
    color: #b71c1c;
}

.Tile.DarkSilver {
    background-color: #fff;
    border-bottom-color: #bbbcbc;
}

.Counter.Small.DarkSilver .Counter_number,
.Counter.Medium.DarkSilver .Counter_number {
    background-color: #bbbcbc;
}

.Counter.Large.DarkSilver .Counter_number {
    color: #bbbcbc;
}

.Tile.DarkGray {
    background-color: #fff;
    border-bottom-color: #53565a;
}

.Counter.Small.DarkGray .Counter_number,
.Counter.Medium.DarkGray .Counter_number {
    background-color: #53565a;
}

.Counter.Large.DarkGray .Counter_number {
    color: #53565a;
}

.Tile.Gray {
    background-color: #fff;
    border-bottom-color: #97999b;
}

.Counter.Small.Gray .Counter_number,
.Counter.Medium.Gray .Counter_number {
    background-color: #97999b;
}

.Counter.Large.Gray .Counter_number {
    color: #97999b;
}

.Tile.Green {
    background-color: #fff;
    border-bottom-color: #43b02a;
}

.Counter.Small.Green .Counter_number,
.Counter.Medium.Green .Counter_number {
    background-color: #43b02a;
}

.Counter.Large.Green .Counter_number {
    color: #43b02a;
}

.Tile.LightGreen {
    background-color: #fff;
    border-bottom-color: #72c02c;
}

.Counter.Small.LightGreen .Counter_number,
.Counter.Medium.LightGreen .Counter_number {
    background-color: #72c02c;
}

.Counter.Large.LightGreen .Counter_number {
    color: #72c02c;
}

.Tile.Orange {
    background-color: #fff;
    border-bottom-color: #ed8b00;
}

.Counter.Small.Orange .Counter_number,
.Counter.Medium.Orange .Counter_number {
    background-color: #ed8b00;
}

.Counter.Large.Orange .Counter_number {
    color: #ed8b00;
}

.Tile.Plum {
    background-color: #fff;
    border-bottom-color: #541798;
}

.Counter.Small.Plum .Counter_number,
.Counter.Medium.Plum .Counter_number {
    background-color: #541798;
}

.Counter.Large.Plum .Counter_number {
    color: #541798;
}

.Tile.Red {
    background-color: #fff;
    border-bottom-color: #da291c;
}

.Counter.Small.Red .Counter_number,
.Counter.Medium.Red .Counter_number {
    background-color: #da291c;
}

.Counter.Large.Red .Counter_number {
    color: #da291c;
}

.Tile.Silver {
    background-color: #fff;
    border-bottom-color: #d0d0ce;
}

.Counter.Small.Silver .Counter_number,
.Counter.Medium.Silver .Counter_number {
    background-color: #d0d0ce;
}

.Counter.Large.Silver .Counter_number {
    color: #d0d0ce;
}

.Tile.Transparent {
    background-color: #fff;
    border-bottom-color: transparent;
}

.Counter.Small.Transparent .Counter_number,
.Counter.Medium.Transparent .Counter_number {
    background-color: transparent;
}

.Counter.Large.Transparent .Counter_number {
    color: transparent;
}

.Tile.Turquoise {
    background-color: #fff;
    border-bottom-color: #00b0c1;
}

.Counter.Small.Turquoise .Counter_number,
.Counter.Medium.Turquoise .Counter_number {
    background-color: #00b0c1;
}

.Counter.Large.Turquoise .Counter_number {
    color: #00b0c1;
}

.Tile.White {
    background-color: #fff;
    border-bottom-color: #fff;
}

.Counter.Small.White .Counter_number,
.Counter.Medium.White .Counter_number {
    background-color: #fff;
}

.Counter.Large.White .Counter_number {
    color: #fff;
}

.Tile.Yellow {
    background-color: #fff;
    border-bottom-color: #dab702;
}

.Counter.Small.Yellow .Counter_number,
.Counter.Medium.Yellow .Counter_number {
    background-color: #dab702;
}

.Counter.Large.Yellow .Counter_number {
    color: #dab702;
}

/* Usefull Classes > User Initials Background */
.UserInitials.Black {
    border-color: #131819;
    color: #131819;
}

.UserInitials.Blue {
    border-color: #00a3e0;
    color: #00a3e0;
}

.UserInitials.DarkBlue {
    border-color: #194968;
    color: #194968;
}

.UserInitials.DarkPlum {
    border-color: #000660;
    color: #000660;
}

.UserInitials.DarkRed {
    border-color: #b71c1c;
    color: #b71c1c;
}

.UserInitials.DarkSilver {
    border-color: #bbbcbc;
    color: #bbbcbc;
}

.UserInitials.DarkGray {
    border-color: #53565a;
    color: #53565a;
}

.UserInitials.Gray {
    border-color: #97999b;
    color: #97999b;
}

.UserInitials.Green {
    border-color: #43b02a;
    color: #43b02a;
}

.UserInitials.LightGreen {
    border-color: #72c02c;
    color: #72c02c;
}

.UserInitials.Orange {
    border-color: #ed8b00;
    color: #ed8b00;
}

.UserInitials.Plum {
    border-color: #541798;
    color: #541798;
}

.UserInitials.Red {
    border-color: #da291c;
    color: #da291c;
}

.UserInitials.Silver {
    border-color: #d0d0ce;
    color: #d0d0ce;
}

.UserInitials.Transparent {
    border-color: transparent;
    color: transparent;
}

.UserInitials.Turquoise {
    border-color: #00b0c1;
    color: #00b0c1;
}

.UserInitials.White {
    border-color: #fff;
    color: #fff;
}

.UserInitials.Yellow {
    border-color: #dab702;
    color: #dab702;
}

/*------------------------------------------------------------*/
/* 8.4 Usefull Classes > Text Colors **************************/
/*------------------------------------------------------------*/

.Page .Text_black {
    color: #000;
}

.Page .Text_blue {
    color: #00a3e0;
}

.Page .Text_darkblue {
    color: #3f51b5;
}

.Page .Text_darkplum {
    color: #000660;
}

.Page .Text_darkRed {
    color: #b71c1c;
}

.Page .Text_darkSilver {
    color: #bbbcbc;
}

.Page .Text_darkGray {
    color: #53565a;
}

.Page .Text_gray {
    color: #97999b;
}

.Page .Text_green {
    color: #43b02a;
}

.Page .Text_lightGreen {
    color: #72c02c;
}

.Page .Text_orange {
    color: #ed8b00;
}

.Page .Text_plum {
    color: #541798;
}

.Page .Text_red {
    color: #da291c;
}

.Page .Text_silver {
    color: #d0d0ce;
}

.Page .Text_turquoise {
    color: #00bcd4;
}

.Page .Text_white {
    color: #fff;
}

.Page .Text_yellow {
    color: #d8c101;
}


/* ImageStyle **************************/
img.Image_rounded {
    border-radius: 2px;
}

img.Image_thumb {
    background: none;
    border: 0;
    border-radius: 0;
    padding: 0;
}

/*------------------------------------*\
      $9. Deloitte Patterns
\*------------------------------------*/

/* ---------- Vertical Tabs ---------- */
.desktop .VerticalTabs .Tabs_header {
    float: left;
    width: 200px;
}

.desktop .VerticalTabs .Tabs__tab {
    border-bottom: 1px solid #eceff1;
    display: block;
    text-align: left;
}

.desktop .VerticalTabs .Tabs__tab.active {
    background: transparent;
    border-bottom-color: #eceff1;
    border-bottom-width: 1px;
    border-left: 2px solid #00a3e0;
    color: #263238;
    font-weight: 700;
}

.desktop .VerticalTabs .Tabs_body {
    display: inline-block;
    padding: 0;
    padding-left: 20px;
    width: calc(100% - 200px);
}

.desktop .VerticalTabs .Tabs__tab:first-child {
    border-top: 1px solid #eceff1;
}

.client-logo {
    height: 48px;
    width: 170px;
}

.line-2 {
    box-sizing: border-box;
    height: 2px;
    width: 233px;
    border: 2px solid rgba(227,227,227,0.5);
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.2);
}

.menu-footer {
    border-radius: 0 0 10px 10px;
    background: linear-gradient(180deg, #3C3F45 0%, #1C1E21 100%);
    box-shadow: inset 0 1px 3px 0 rgba(0,0,0,0.5);
}

.deloitte-logo {
    height: 13px;
    width: 70px;
}
.halo {
    height: 13px;
    width: 35px;
}

/*------------------------------------*\
      $10. Custom Classes
\*------------------------------------*/


.TableRecords_BottomNavigation .ListNavigation_Wrapper a {
    border-radius: 4px;    
    background-color: #FFFFFF;
}

.TableRecords_BottomNavigation .ListNavigation_Wrapper span span.ListNavigation_CurrentPageNumber {  
    border: 1px solid var(--color-deloitte-green);    
    border-radius: 4px;    
    background-color: #FFFFFF;   
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.5);
    color: var(--color-deloitte-green);
}

.TableRecords_BottomNavigation .ListNavigation_Wrapper{
    padding-right: 20px;
    padding-bottom: 20px;
}

.TableRecords_BottomNavigation .ListNavigation_Wrapper span a.ListNavigation_PageNumber:link,
.TableRecords_BottomNavigation .ListNavigation_Wrapper a.ListNavigation_Next:after, 
.TableRecords_BottomNavigation .ListNavigation_Wrapper a.ListNavigation_DisabledNext:after,
.TableRecords_BottomNavigation .ListNavigation_Wrapper a.ListNavigation_Previous:before, 
.TableRecords_BottomNavigation .ListNavigation_Wrapper a.ListNavigation_DisabledPrevious:before{
        color: #666666;
}

.TableRecords_BottomNavigation .ListNavigation_Wrapper span a.ListNavigation_PageNumber:link:hover,
.TableRecords_BottomNavigation .ListNavigation_Wrapper a.ListNavigation_Previous:link:hover,
.TableRecords_BottomNavigation .ListNavigation_Wrapper a.ListNavigation_Next:link:hover{
    border: 1px solid var(--color-deloitte-green);    
    border-radius: 4px;    
    background-color: #FFFFFF;   
    box-shadow: 1px 1px 2px 0 rgba(0,0,0,0.5);
    color: transparent;
}

.TableRecords_BottomNavigation .ListNavigation_Wrapper span a.ListNavigation_PageNumber:link:hover{
    color: var(--color-deloitte-green);
}

/** Label **/


.label-size-14 {
    font-weight: 700;
    font-size: 14px;
    color: #333333;
    line-height: 19px;
    font-family: 'Open Sans', sans-serif;
}

.label-header-size-17 {
    font-size: 17px;
    font-weight: bold;
    line-height: 23px;
    color: #333333;
}

/** MENU **/

.Header select,
.Login_Menu select {
    line-height: 18px ! important;
    padding-top: 0px ! important;
    padding-bottom: 0px ! important;
    height: 29px;
    width: 74px;
    font-size: 12px;
    padding: 8px;
    border-radius: 22.5px;
}

/*------------------------------------*\
      $11. Studio Preview
\*------------------------------------*/

/*------------------------------------*\
      $12. Print
\*------------------------------------*/

.flex-list {
    display:flex;
    flex-wrap: wrap;
}

ul {
    list-style-position: inside;
    -webkit-padding-start: 40px;
}

.Page>.Content {
    padding-top: 59px;
    margin-top: 0px;
}


a.fake-btn-link span {
    color: #333;
    font-weight: normal;
}

.desktop a.fake-btn-link:hover{
    text-decoration: none;
}
/** TOOL TIP **/


.hasTooltip .span-tooltip {
    display: none;
    color: #333333;
    text-decoration: none;
    padding: 3px;
    font-size: 12px;
}

.hasTooltip:hover .span-tooltip {
    display: block;
    position: absolute;
    background-color: #FFF;
    border: 1px solid #CCC;
    margin: 5px 0px;
    padding: 5px;
    border-radius: 5px;
    max-width:  400px;
    word-break: break-all;
    word-wrap:  break-word;
    white-space:  normal;
    z-index: 4;
}

body div.Feedback_Message_Error, 
body div.Feedback_Message_Success, 
body div.Feedback_Message_Warning, 
body div.Feedback_Message_Info,
body div.Feedback_Message_Wrapper {
    z-index: 4020;
}

/* $4.4.7 - Patterns - Navigation - Wizard */
.wizard-item {
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
    -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    position: relative;
    width: 100%;
}

.wizard-item.label-top .wizard-item-icon-wraper {
    -webkit-box-ordinal-group: 3;
               -ms-flex-order: 2;
                        order: 2;
}

.wizard-item.label-top .wizard-item-label {
    -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    -webkit-box-ordinal-group: 2;
               -ms-flex-order: 1;
                        order: 1;
}

.ie11 .wizard.flex-direction-row .wizard-item.label-top .wizard-item-label,
.ie10 .wizard.flex-direction-row .wizard-item.label-top .wizard-item-label {
    -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;    
}

.wizard-item-icon:empty {
    height: 8px;
    width: 8px;
}

.wizard-item-icon {
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    background-color: var(--color-neutral-5);
    border-radius: var(--border-radius-circle);
    border: var(--border-size-m) solid var(--color-neutral-5);
    color: var(--color-neutral-0);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 44px;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
    margin: 0 auto;
    position: relative;
    width: 44px;
    z-index: 2;
    font-size: 18px;
}

.wizard-item.active .wizard-item-icon {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-neutral-0);
    box-shadow: 0 0 0 4px var(--color-neutral-0), 0 0 0 5px var(--color-primary);
}

.wizard-item.past .wizard-item-icon {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-neutral-0);
}

.wizard-item-icon .fa-fw {
    font-size: var(--font-size-xs);
    width: auto;
}

.wizard-item-icon-wraper {
    margin: var(--space-s) var(--space-none);
    position: relative;
    width: 100%;
}

.wizard-item .wizard-item-icon-wraper:before {
    content: '';
    height: 2px;
    position: absolute;
    right: calc(50% + 12px);
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    width: calc(100% - 24px);
    z-index: 0;
}

.wizard-item.past .wizard-item-icon-wraper:before {
    background-color: var(--color-primary);
}

.wizard-item.active .wizard-item-icon-wraper:before {
    background-color: var(--color-primary);
}

.wizard-item.next .wizard-item-icon-wraper:before {
    background-color: var(--color-neutral-5);
}

.wizard-item:first-child .wizard-item-icon-wraper:before {
    content: none;
}

.wizard-item-label {
    color: var(--color-neutral-7);
    text-align: center;
}

.wizard-item.past .wizard-item-label {
    color: var(--color-neutral-8);
}

.wizard-item.active .wizard-item-label {
    color: var(--color-neutral-10);
}

.wizard-item.next .wizard-item-icon .fa-fw {
    color: var(--color-neutral-5);
}

.wizard-vertical .wizard-item {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
       -ms-flex-direction: row;
           flex-direction: row;
    margin-bottom: var(--space-l);
}

.wizard-vertical .wizard-item:last-child {
    margin-bottom: var(--space-none);
}

.wizard-vertical .wizard-item-icon-wraper {
    margin: var(--space-none) var(--space-s) var(--space-none) var(--space-none);
    width: auto;
}

.wizard-vertical .wizard-item .wizard-item-icon-wraper:before {
    bottom: calc(50% + 12px);
    height: calc(100% + 18px);
    left: 50%;
    top: auto;
    -webkit-transform: translateY(0) translateX(-50%);
            transform: translateY(0) translateX(-50%);
    width: 2px;
}

.wizard-vertical .wizard-item.label-top .wizard-item-label {
    text-align: right;
}

.wizard-vertical .wizard-item.label-top .wizard-item-icon-wraper {
    margin: var(--space-none) var(--space-none) var(--space-none) var(--space-s);
}

.wizard .ListRecords {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%;
}

.wizard-vertical .ListRecords {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
}

.ie11 .wizard-vertical .wizard-item {
    -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
}

/* $4.2.9 - Patterns - Controls - RangeSlider */
.range-slider {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
       -ms-flex-direction: column;
           flex-direction: column;
    margin-bottom: var(--space-l);
}

.range-slider-values {
    -webkit-box-align: center;
       -ms-flex-align: center;
          align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.range-slider .noUi-connect {
    background: var(--color-primary);
}

.range-slider .noUi-target {
    background: var(--color-neutral-5);
    border-radius: var(--border-radius-soft);
    border: none;
}

.range-slider .noUi-handle {
    background: var(--color-neutral-0);
    border-radius: 50%;
    border: var(--border-size-s) solid var(--color-neutral-7);
    box-shadow: var(--shadow-xs);
    cursor: pointer;
    height: 24px;
    margin-top: -10px;
    width: 24px;
}

.range-slider .noUi-handle.noUi-active,
.range-slider .noUi-handle:hover {
    border: var(--border-size-s) solid var(--color-primary);
}

.range-slider .noUi-handle:before,
.range-slider .noUi-handle:after {
    background: transparent;
    border-color: var(--color-neutral-7);
    border-style: solid;
    content: '';
    height: 10px;
    margin-top: -5px;
    position: absolute;
    top: 50%;
}

.range-slider .noUi-handle:before {
    border-width: var(--border-size-none) var(--border-size-none) var(--border-size-none) var(--border-size-s);
    content: '';
    left: 6px;
}

.range-slider .noUi-handle:after {
    border-style: solid;
    border-width: var(--border-size-none) var(--border-size-s);
    left: 10px;
    width: 3px;
}

.range-slider .noUi-handle.noUi-active:before,
.range-slider .noUi-handle.noUi-active:after,
.range-slider .noUi-handle:hover:before,
.range-slider .noUi-handle:hover:after {
    border-color: var(--color-primary);
}

.range-slider .noUi-connects {
    border-radius: var(--border-radius-soft);
}

.range-slider .noUi-pips {
    color: var(--color-neutral-8);
}

.range-slider .noUi-marker {
    background: var(--color-neutral-5);
}

.range-slider .range-slider-separator.is--hidden {
    display: none;
}

.range-slider-label {
    color: var(--color-neutral-8);
    margin-left: var(--space-s);
}

.range-slider-separator {
    background-color: var(--color-neutral-4);
    font-size: 0;
    height: 2px;
    margin: var(--space-none) var(--space-s);
    width: 16px;
}

.range-slider-values .input {
    background: transparent;
    border: none;
    height: auto;
    margin-left: var(--space-none);
    padding: var(--space-none);
}

.range-slider .range-slider-values > * {
    word-break: normal;
}


/* Horizontal */
html:not([dir="rtl"]) .range-slider .noUi-horizontal .noUi-handle {
    right: -12px;
}

.range-slider .noUi-horizontal {
    height: 4px;
    margin: var(--space-base) var(--space-none) var(--space-base);
    width: 100%;
}

.range-slider .noUi-marker-horizontal {
    height: 4px;
}

.range-slider .noUi-pips-horizontal {
    padding: var(--space-s) var(--space-none) var(--space-none) var(--space-none);
}

.range-slider .noUi-value-horizontal {
    -webkit-transform: translate(-50%, 20%);
            transform: translate(-50%, 20%);
}

.range-slider .noUi-pips-horizontal {
    height: 30px;
}

/* Vertical */
.range-slider.vertical .range-slider-object {
    height: 100%;
    margin-top: var(--space-m);
}

.range-slider .noUi-vertical {
    height: 100px;
    margin-top: var(--space-base);
    width: 4px;
}

.range-slider .noUi-vertical .noUi-handle {
    left: -14px;
    top: -4px;
}

.range-slider .noUi-pips-vertical {
    padding: var(--space-none) var(--space-none) var(--space-none) 12px;
}

.range-slider .noUi-value-vertical {
    padding-left: var(--space-s);
}

.range-slider [data-isdisabled="true"] {
    pointer-events: none;
}

.range-slider [data-isdisabled="true"].noUi-target {
    background-color: var(--color-neutral-4);    
}

.range-slider [data-isdisabled="true"] .noUi-connect {
    background-color: var(--color-neutral-6);     
}

.range-slider [data-isdisabled="true"] .noUi-handle {
    background-color: var(--color-neutral-2);
    border: var(--border-size-s) solid var(--color-neutral-5);
    box-shadow: none;
}

.range-slider [data-isdisabled="true"] .noUi-handle:before, 
.range-slider [data-isdisabled="true"] .noUi-handle:after {
    border-color: var(--color-neutral-6);
}

.range-slider [data-isdisabled="true"] .noUi-pips {
    color: var(--color-neutral-6);
}

/* RangeSlider Service Studio Styles */
.range-slider {
    
}

.range-slider .range-slider-object {
    
    
    
    
    
}

.range-slider .range-slider-object:after {
    
    
    
    
    
    
    
}

.range-slider.interval .range-slider-object:after {
    
}

.range-slider:before,
.range-slider:after {
    
    
    
    
    
    
    
    
    
    
    
    
}

.range-slider.interval:after {
    
}

/* $4.5.2 - Patterns - Numbers - Counter */
.counter {
    background-color: var(--color-neutral-0);
    border: var(--border-size-s) solid var(--color-neutral-4);
    box-shadow: var(--shadow-none);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
    padding: var(--space-none) var(--space-m);
}

.counter .center-align {
    width: 100%;
}

.counter .center-align.flex-direction-column {
    -webkit-box-pack: center;
       -ms-flex-pack: center;
     justify-content: center;
}

.counter .center-align.flex-direction-row {
    -webkit-box-pack: justify;
       -ms-flex-pack: justify;
     justify-content: space-between;
}

.counter[class*="background-"] {
    border: var(--border-size-none);
    color: var(--color-neutral-0);
}


/** FOR ARABIC **/

/* Select */

.RTL .Form select.ReadOnly,
.RTL select {
    background-position: 5px center;
}

.RTL {
    direction: RTL;
}

.RTL .ThemeGrid_MarginGutter {
    margin-right: 20px;
    margin-left: 0;
}

.AlignLeft {
    text-align: left;
}

.RTL .AlignLeft {
    text-align: right;
}

.AlignRight {
    text-align: right;
}

.RTL .AlignRight {
    text-align: left;
}

.RTL .select2-container .select2-choice .select2-arrow, 
.RTL .select2-container .select2-choice div {
    left: 0;
    right: auto;
}

.RTL .select2-container .select2-choice .select2-arrow:before {
    color: #00a3e0;
    content: "\f0d7";
    font-family: "FontAwesome";
    margin-right: 16px;
    margin-left: 0px;
}

.RTL input[type="checkbox"]:after {
    left: auto;
    right: 20%;
}

.RTL .Button {
    margin-left: 0px;
    margin-right: 10px;
}

/* RichWidgets > Feedback Message > Success */
.RTL div.Feedback_Message_Info:before,
.RTL div.Feedback_Message_Success:before,
.RTL div.Feedback_Message_Error:before,
.RTL div.Feedback_Message_Warning:before {
    font-size: 20px;
    left: auto;
    right: 15px;
    top: 9px;
}

div.Feedback_Message_Success a.Feedback_Message_Wrapper_Close,
div.Feedback_Message_Error a.Feedback_Message_Wrapper_Close,
div.Feedback_Message_Warning a.Feedback_Message_Wrapper_Close,
div.Feedback_Message_Info a.Feedback_Message_Wrapper_Close {
    position: absolute;
    left: auto;
    right: 15px;
    top: 9px;
}

.RTL div.Feedback_Message_Success a.Feedback_Message_Wrapper_Close,
.RTL div.Feedback_Message_Error a.Feedback_Message_Wrapper_Close,
.RTL div.Feedback_Message_Warning a.Feedback_Message_Wrapper_Close,
.RTL div.Feedback_Message_Info a.Feedback_Message_Wrapper_Close {
    position: absolute;
    left: 15px;
    top: 9px;
    right: auto;
}

/*-------------------------------------*\
            $1. Columns2
\*-------------------------------------*/

.RTL .Columns2 > .Column.ColFirst {
    padding-left: 5px;
    padding-right: 0;
}

.RTL .Columns2 > .Column.ColLast {
    padding-left: 0;
    padding-right: 5px;
}

/*-------------------------------------*\
            $8. MediumRightColumn
\*-------------------------------------*/

.RTL .MediumRightColumns > .Column.ColFirst {
    width: 65%;
    padding-left: 5px;
    padding-right: 0px;
}

.RTL .MediumRightColumns > .Column.ColLast {
    width: 35%;
    padding-right: 5px;
    padding-left: 0px;
}

html, div, span, p {
    word-wrap: break-word;
}

pre {
    white-space:pre-line;
}

label {
    overflow-wrap: initial;
}

ul h1, ul h2, ul h3, ul h4, ul h5, ul h6 {
    display: inline;
}

/** Font Colors **/

.fc_grey {
    color: var(--color-grey);
}

.fc-green {
    color: var(--color-deloitte-green);
}

.fc-red,
.fc-red-light {
    color: var(--color-red);
}

.fc-red-light {
    opacity: 0.5;
}

.fc-grey-light, 
.fc-note {
    color: var(--color-grey);
}

.fc-yellow {
    color: var(--color-yellow);
}

/**Font Size **/

.fs-small {
    font-size: smaller;
}

/** Font Style **/

.italic {
    font-style: italic;
}

.text-ellipsis {
  flex: 1;
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.fs-number {
    font-size: 17px;
}

.half-opacity {
    opacity: 0.5;
}    

/** Margin & Padding **/

.mt10 { margin-top: 10px; }

/* Margin */
.margin-xs { margin: var(--space-xs); }
.margin-s { margin: var(--space-s); }
.margin-base { margin: var(--space-base); }
.margin-m { margin: var(--space-m); }
.margin-l { margin: var(--space-l); }
.margin-xl { margin: var(--space-xl); }
.margin-xxl { margin: var(--space-xxl); }

.margin-top-xs { margin-top: var(--space-xs); }
.margin-top-s { margin-top: var(--space-s); }
.margin-top-base { margin-top: var(--space-base); }
.margin-top-m { margin-top: var(--space-m); }
.margin-top-l { margin-top: var(--space-l); }
.margin-top-xl { margin-top: var(--space-xl); }
.margin-top-xxl { margin-top: var(--space-xxl); }

.margin-btm-xs { margin-bottom: var(--space-xs); }
.margin-btm-s { margin-bottom: var(--space-s); }
.margin-btm-base { margin-bottom: var(--space-base); }
.margin-btm-m { margin-bottom: var(--space-m); }
.margin-btm-l { margin-bottom: var(--space-l); }
.margin-btm-xl { margin-bottom: var(--space-xl); }
.margin-btm-xxl { margin-bottom: var(--space-xxl); }

.margin-left-xs { margin-left: var(--space-xs); }
.margin-left-s { margin-left: var(--space-s); }
.margin-left-base { margin-left: var(--space-base); }
.margin-left-m { margin-left: var(--space-m); }
.margin-left-l { margin-left: var(--space-l); }
.margin-left-xl { margin-left: var(--space-xl); }
.margin-left-xxl { margin-left: var(--space-xxl); }
.margin-left-10 { margin-left: 10px; }
.margin-left-20 { margin-left: 20px; }

.margin-right-xs { margin-right: var(--space-xs); }
.margin-right-s { margin-right: var(--space-s); }
.margin-right-base { margin-right: var(--space-base); }
.margin-right-m { margin-right: var(--space-m); }
.margin-right-l { margin-right: var(--space-l); }
.margin-right-xl { margin-right: var(--space-xl); }
.margin-right-xxl { margin-right: var(--space-xxl); }

.margin-x-xs { margin-left: var(--space-xs); margin-right: var(--space-xs); }
.margin-x-s { margin-left: var(--space-s); margin-right: var(--space-s); }
.margin-x-base { margin-left: var(--space-base); margin-right: var(--space-base); }
.margin-x-m { margin-left: var(--space-m); margin-right: var(--space-m); }
.margin-x-l { margin-left: var(--space-l); margin-right: var(--space-l); }
.margin-x-xl { margin-left: var(--space-xl); margin-right: var(--space-xl); }
.margin-x-xxl { margin-left: var(--space-xxl); margin-right: var(--space-xxl); }

.margin-y-xs { margin-top: var(--space-xs); margin-bottom: var(--space-xs); }
.margin-y-s { margin-top: var(--space-s); margin-bottom: var(--space-s); }
.margin-y-base { margin-top: var(--space-base); margin-bottom: var(--space-base); }
.margin-y-m { margin-top: var(--space-m); margin-bottom: var(--space-m); }
.margin-y-l { margin-top: var(--space-l); margin-bottom: var(--space-l); }
.margin-y-xl { margin-top: var(--space-xl); margin-bottom: var(--space-xl); }
.margin-y-xxl { margin-top: var(--space-xxl); margin-bottom: var(--space-xxl); }

/* Padding */
.padding-xs { padding: var(--space-xs); }
.padding-s { padding: var(--space-s); }
.padding-base { padding: var(--space-base); }
.padding-m { padding: var(--space-m); }
.padding-l { padding: var(--space-l); }
.padding-xl { padding: var(--space-xl); }
.padding-xxl { padding: var(--space-xxl); }

.padding-top-xs { padding-top: var(--space-xs); }
.padding-top-s { padding-top: var(--space-s); }
.padding-top-base { padding-top: var(--space-base); }
.padding-top-m { padding-top: var(--space-m); }
.padding-top-l { padding-top: var(--space-l); }
.padding-top-xl { padding-top: var(--space-xl); }
.padding-top-xxl { padding-top: var(--space-xxl); }

.padding-btm-xs { padding-bottom: var(--space-xs); }
.padding-btm-s { padding-bottom: var(--space-s); }
.padding-btm-base { padding-bottom: var(--space-base); }
.padding-btm-m { padding-bottom: var(--space-m); }
.padding-btm-l { padding-bottom: var(--space-l); }
.padding-btm-xl { padding-bottom: var(--space-xl); }
.padding-btm-xxl { padding-bottom: var(--space-xxl); }

.padding-left-xs { padding-left: var(--space-xs); }
.padding-left-s { padding-left: var(--space-s); }
.padding-left-base { padding-left: var(--space-base); }
.padding-left-m { padding-left: var(--space-m); }
.padding-left-l { padding-left: var(--space-l); }
.padding-left-xl { padding-left: var(--space-xl); }
.padding-left-xxl { padding-left: var(--space-xxl); }

.padding-right-xs { padding-right: var(--space-xs); }
.padding-right-s { padding-right: var(--space-s); }
.padding-right-base { padding-right: var(--space-base); }
.padding-right-m { padding-right: var(--space-m); }
.padding-right-l { padding-right: var(--space-l); }
.padding-right-xl { padding-right: var(--space-xl); }
.padding-right-xxl { padding-right: var(--space-xxl); }

.padding-x-xs { padding-left: var(--space-xs); padding-right: var(--space-xs); }
.padding-x-s { padding-left: var(--space-s); padding-right: var(--space-s); }
.padding-x-base { padding-left: var(--space-base); padding-right: var(--space-base); }
.padding-x-m { padding-left: var(--space-m); padding-right: var(--space-m); }
.padding-x-l { padding-left: var(--space-l); padding-right: var(--space-l); }
.padding-x-xl { padding-left: var(--space-xl); padding-right: var(--space-xl); }
.padding-x-xxl { padding-left: var(--space-xxl); padding-right: var(--space-xxl); }

.padding-y-xs { padding-top: var(--space-xs); padding-bottom: var(--space-xs); }
.padding-y-s { padding-top: var(--space-s); padding-bottom: var(--space-s); }
.padding-y-base { padding-top: var(--space-base); padding-bottom: var(--space-base); }
.padding-y-m { padding-top: var(--space-m); padding-bottom: var(--space-m); }
.padding-y-l { padding-top: var(--space-l); padding-bottom: var(--space-l); }
.padding-y-xl { padding-top: var(--space-xl); padding-bottom: var(--space-xl); }
.padding-y-xxl { padding-top: var(--space-xxl); padding-bottom: var(--space-xxl); }

/** Position & Display **/

.position-absolute { position: absolute; }
.position-relative { position: relative; }
.position-fixed { position: fixed; }

.display-inline { display: inline; }

.inline-block,
.display-inline-block { display: inline-block; }

.placeholder:empty { display: none; }

/** Height **/
.height-unset { height: unset; }

/*---------- flex properties ----------*/

.flex-100 {
    flex: 1 0 0;
}

.display-flex {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
}

.display-inline-flex {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
}


.flex-direction-row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
        -ms-flex-direction: row;
            flex-direction: row;
}

.flex-direction-row-reverse {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: row-reverse;
        -ms-flex-direction: row-reverse;
            flex-direction: row-reverse;
}

.flex-direction-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
        -ms-flex-direction: column;
            flex-direction: column;
}

.flex-direction-column-reverse {
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -webkit-flex-direction: column-reverse;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse;
}

.flex-wrap-nowrap {
    -webkit-flex-wrap: nowrap;
        -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
}

.flex-wrap-wrap {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
}

.flex-wrap-wrap-reverse {
    -webkit-flex-wrap: wrap-reverse;
        -ms-flex-wrap: wrap-reverse;
            flex-wrap: wrap-reverse;
}

.justify-content-flex-start {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}

.justify-content-flex-end {
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
        -ms-flex-pack: end;
            justify-content: flex-end;
}

.justify-content-center {
    -webkit-box-pack: center;
    -webkit-justify-content: center;
        -ms-flex-pack: center;
            justify-content: center;
}

.justify-content-space-between {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
        -ms-flex-pack: justify;
            justify-content: space-between;
}

.justify-content-space-around {
    -webkit-justify-content: space-around;
        -ms-flex-pack: distribute;
            justify-content: space-around;
}

.align-items-flex-start {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
        -ms-flex-align: start;
            align-items: flex-start;
}

.align-items-flex-end {
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
        -ms-flex-align: end;
            align-items: flex-end;
}

.align-items-center {
    -webkit-box-align: center;
    -webkit-align-items: center;
        -ms-flex-align: center;
            align-items: center;
}

.align-items-baseline {
    -webkit-box-align: baseline;
    -webkit-align-items: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
}

.align-items-stretch {
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
}

.align-content-flex-start {
    -webkit-align-content: flex-start;
        -ms-flex-line-pack: start;
            align-content: flex-start;
}

.align-content-flex-end {
    -webkit-align-content: flex-end;
        -ms-flex-line-pack: end;
            align-content: flex-end;
}

.align-content-center {
    -webkit-align-content: center;
        -ms-flex-line-pack: center;
            align-content: center;
}

.align-content-space-between {
    -webkit-align-content: space-between;
        -ms-flex-line-pack: justify;
            align-content: space-between;
}

.align-content-space-around {
    -webkit-align-content: space-around;
        -ms-flex-line-pack: distribute;
            align-content: space-around;
}

.align-content-strech {
    -webkit-align-content: stretch;
        -ms-flex-line-pack: stretch;
            align-content: stretch;
}

/** Popup Styling **/

.popup-header {
    font-size: 17px;
    font-weight: bold;
}

.popup-subheader {
    font-size: 14px;
    font-weight: bold;
}

/** feedback **/

.feedback-noaction,
.feedback-pending,
.feedback-overdue {
    border-radius: 2px;
    color: white;
    padding: 2px 4px;    
    font-size: 12px;
}

.feedback-overdue {
    background-color:#E58D8D;   
}

.feedback-pending {
    background-color:#EABD30;
}

.feedback-noaction {
    background-color:#7DC62B;
}

/**background-color**/

.bg-dark-yellow
{
    background-color: var(--color-dark-yellow);
}
.bg-dark-red
{
    background-color: var(--color-dark-red);
}

.hidden { display: none; }


/* $OutsystemWebUI - Patterns - Controls - ButtonGroup */
.button-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}

.button-group.justified,
.button-group.justified .ListRecords {
    width: 100%
}

.button-group .ListRecords {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.button-group label {
    -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    position: relative;
    word-break: normal;
}

/* Enable a label to be used inside button group */
.button-group label > label {
   pointer-events: none;
}

.button-group .btn {
    border-radius: var(--border-radius-none);
    border: var(--border-size-s) solid var(--color-primary);
    color: var(--color-primary);
    display: inline-flex;
    white-space: nowrap;
    width: 100%;
    
}

.Form .button-group .btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}

.button-group label:first-child .btn {
    border-radius: var(--border-radius-soft) var(--border-radius-none) var(--border-radius-none) var(--border-radius-soft);
}

.button-group label:last-child .btn {
    border-radius: var(--border-radius-none) var(--border-radius-soft) var(--border-radius-soft) var(--border-radius-none);
}

.button-group label .btn {
    text-align: center;
}

.button-group label:not(:first-child) .btn {
    border-left: var(--border-size-none);
}

.button-group input[type="radio"] {
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    
    
    
    
    
    
}

.button-group input[type="radio"]:checked + .btn {
    background-color: var(--color-primary);
    color: var(--color-neutral-0);
}

.phone .button-group label {
    -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    width: 100%; 
}

.phone .button-group label .btn:not(:first-child) {
    border-left: 1px solid var(--color-primary); 
}

.phone .button-group label:not(:first-of-type) .btn {
    border-top: none;
}

.phone .button-group label:first-child .btn {
    border-radius: var(--space-none);
    border-top-left-radius: var(--border-radius-soft);
    border-top-right-radius: var(--border-radius-soft);
}

.phone .button-group label:last-child .btn {
    border-radius: var(--space-none);
    border-bottom-left-radius: var(--border-radius-soft);
    border-bottom-right-radius: var(--border-radius-soft);
}

.phone .button-group,
.phone .button-group .ListRecords {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    width: 100%;
}

.ie10 :not(.justified).button-group label {
    display: table-cell;
}

.ie10 .button-group:not(.justified) label,
.ie11 .button-group:not(.justified) label {
    flex: none;
}

.Form.form-top .button-group label {
    padding-bottom: 0;
}

/* ButtonGroup Service Studio Styles */
.button-group > div,
.button-group .ListRecords > div{
    
    
}

.button-group > div:first-child .btn {
    
}

.button-group > div:last-child .btn {
    
}

.button-group > div:not(:first-child) .btn {
    
}

.button-group .radio-button:before {
    
    
}


.Col1-Rectangle-Label {
    color: #999999;
    font-size: var(--font-size-xs);    
    line-height: 20px;
    font-weight: normal;
    padding: 2px 6px;
    background-color: #E3E3E3;
    margin-right: var(--space-xs);
    margin-bottom: var(--space-xs);
}

.whitespace-break {
    white-space: break-spaces;
}


/*select-2*/

.select2-textblack .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice
{
    color: black !important;
}

.customnumeric > input
{
    text-align: left !important;
}

.yesno-wrapper *
{
    vertical-align: middle !important;
}
.website-desc
{
    margin-top: 10px;
}

.header-margin {
    margin:10px 0px 15px 0px; 
}

.header-margin.label-header-size-17 {
    display: block;
    margin: 0px 0px 10px 0px; 
}

.header-margin.label-size-14 {
    display: block;
    margin: 25px 0px 10px 0px; 
}

/* CKEditor 5 */
p+figure.image.image-style-side {
    margin-top: 0;
}

figure.image.image-style-side {
    float: right;
    margin-left: 1.5em;
    max-width: 50%;8
}

figure.image:not(.image-style-side) {
    clear: both;
    display: table;
    margin: 0.9em auto;
    min-width: 50px;
    text-align: center;
}

figure > figcaption {
    text-align: center;
}

/* Override starthidden class which make the content not visible in iframe */
.startHidden{
    display: block;
}

/* Calendar */
div.calendar .title,
div.calendar thead .button,
div.calendar thead .button.notclose,
div.calendar tfoot .ttip,
div.calendar tbody td.weekend, div.calendar tbody th.weekend{
    color: #666666;
}

/* Input placeholder */
::placeholder{
    color: var(--color-gray-10)!important;
}

