﻿@import url("/LisbonTheme/Theme.LisbonTheme.css?8756");

/*
    How to generate a theme for your company: 
    
        1 - Go to https://silkui.outsystems.com/ThemeCustomizer/GenerateLisbon.aspx
        2 - Copy the generated CSS
        3 - Replace the CSS for Primary Color Customization below with the Generated CSS

*/


/*  INDEX  */

    /* $1. ::::::: General Properties :::::::: */
        /* $1.1 Root - CSS Variables*/
        /* $1.2 Styles - Border Radius*/
        /* $1.3 Import Font*/
        /* $1.4 Links Color */
        
    /* $2. ::::::: Backgroung Definition :::::::: */
    
    /* $3. ::::::: Menu Custom :::::::: */
        /* $3.1 Header*/
        /* $3.2 Link/button menu*/
        /* $3.3 LoginInfo - User */
    
    /* $4. ::::::: Widgets / Elements / Components :::::::: */
        /* $4.1 Accordion, Button Groups, Selects */
        /* $4.2 Radio And Checkbox */
        /* $4.3 Toggle Buttons */
        /* $4.4 Buttons */
        /* $4.5 Form */
        /* $4.6 Inputs And Selectors */
        /* $4.7 Patterns - Content - Carousel */
        /* $4.8 Dropdown */
            /* $4.8.1 DropdownSelect */
            /* $4.8.2 Listbox - Choices Multiple */
        /* $4.9 Popup */
        /* $4.10 Calendar */
        /* $4.11 Slider */
        /* $4.12 Feedback */
        /* $4.13 EditableTable */
        /* $4.14 FileUpload */
        
    /* $5. ::::::: CUSTOM :::::::: */
        /* $5.1 Icons and Marks */
        /* $5.2 Tables - TablesRecords*/
        /* $5.3 Checkbox Into Tables */
        /* $5.4 Texts */
        /* $5.5 Others */
        /* $5.6 Keyframes */



/* $1. ::::::: General Properties :::::::: */

/* $1.1 Root - CSS Variables*/

:root {
    /* Color - Neutral */
    --color-neutral-0: #fff;
    --color-neutral-1: #f8f9fa;
    --color-neutral-10: #000;
    --color-neutral-2: #f1f3f5;
    --color-neutral-3: #e9ecef;
    --color-neutral-4: #dee2e6;
    --color-neutral-5: #ced4da;
    --color-neutral-6: #adb5bd;
    --color-neutral-7: #999999;
    --color-neutral-8: #5c656d;
    --color-neutral-9: #2B2B2B;
    
    /* Color - Brand */
    --color-primary: #B15533;
    --color-secondary: #009FDF;
    --color-tertiary: #D40F7D;
    --color-quaternary:#EEB816;
    
    /* Color - Extended */
    --color-success: #2a843c;
    --color-text: #666;
    --color-warning: #ffa000;
    

    /* Border */
    --border-radius-circle: 100%;
    --border-radius-extra-soft: 2px;
    /* Border Radius */
    --border-radius-none: 0;
    --border-radius-rounded: 100px;
    --border-radius-soft: 4px;
    --border-size-l: 3px;
    --border-size-m: 2px;
    /* Border Size */
    --border-size-none: 0;
    --border-size-s: 1px;
    
    /* Typography - Weight */
    --font-light: 300;
    --font-medium: 600;
    --font-regular: 400;
    --font-size-base: 14px;
    /* Typography - Size */
    --font-size-display: 36px;
    --font-size-h1: 22px;
    --font-size-h2: 20px;
    --font-size-h3: 18px;
    --font-size-h4: 16px;
    --font-size-h5: 16px;
    --font-size-h6: 16px;
    --font-size-s: 12px;
    --font-size-xs: 10px;
    --header-size: 56px;
    
    /* Space - Sizes */
    --space-none: 0;
    --space-s: 12px;
    --space-xl: 40px;
    --space-xs: 4px;
    --space-xxl: 48px;
}


/* $1.2 Styles - Border Radius*/

.border-radius-none { border-radius: var(--border-radius-none); }
.border-radius-soft { border-radius: var(--border-radius-soft); }
.border-radius-rounded { border-radius: var(--border-radius-rounded); }
.border-radius-circle { border-radius: var(--border-radius-circle); }


/* $1.3 Import Font*/

/*======= NOVEL PRO =======*/
@font-face {    
    font-family: 'NovelPro';
    src: url('/PartnersPortal_Theme/NovelPro-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {    
    font-family: 'NovelPro-Bold';
    src: url('/PartnersPortal_Theme/NovelPro-Bold.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {    
    font-family: 'NovelPro-ExtraBold';
    src: url('/PartnersPortal_Theme/NovelPro-ExtraBold.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}


/*======= NOVEL SANS PRO =======*/

@font-face {    
    font-family: 'NovelSansPro_Regular';
    src: url('/PartnersPortal_Theme/NovelSansPro.Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {    
    font-family: 'NovelSansPro_SemiBold';
    src: url('/PartnersPortal_Theme/NovelSansPro_SemiBold.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {    
    font-family: 'NovelSansPro_Bold';
    src: url('/PartnersPortal_Theme/NovelSansPro.Bold.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}

@font-face {    
    font-family: 'NovelSansPro_ExtraBold';
    src: url('/PartnersPortal_Theme/NovelSansPro_ExtraBold.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}


 /* html, body, a, select, form, fieldset, table, tr, td, img, input, button, select, textarea, optgroup, option {
    font-family: 'Open-Sans', sans-serif;
} */

html,
body,
a,
select,
fieldset,
input,
button,
select,
textarea,
optgroup,
option {
    font-family: 'NovelSansPro_Regular', sans-serif;
}

/* $1.4 Links Color */

a,
a:link,
a:visited,
.Footer a,
.Footer a:link,
.Footer a:visited {
    color: var(--color-primary);
}

a[disabled="disabled"],
a[disabled="disabled"]:hover {
    color: var(--color-neutral-5);
    text-decoration: none;
}

.desktop a:hover,
.desktop a:link:hover,
.desktop a:visited:hover {
    color: var(--color-primary);
}

a.ListNavigation_PageNumber:link,
span.ListNavigation_CurrentPageNumber,
span.ListNavigation_Ellipsis {
    color: var(--color-primary);
}

a.ListNavigation_PageNumber:link:hover,
span.ListNavigation_CurrentPageNumber:hover,
span.ListNavigation_Ellipsis:hover {
    color: var(--color-primary);
}

a.ListNavigation_Previous:link,
a.ListNavigation_Next:link,
span.ListNavigation_DisabledNext, 
span.ListNavigation_DisabledPrevious {
    color: var(--color-primary);
}

a.ListNavigation_Previous:link:hover,
a.ListNavigation_Next:link:hover,
span.ListNavigation_DisabledNext:hover, 
span.ListNavigation_DisabledPrevious:hover {
    color: var(--color-primary);
}

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: var(--color-primary);
    border-color: var(--color-primary);
}

.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: var(--color-primary);
    border-color: var(--color-primary);
    box-shadow: none;
    color: var(--color-neutral-0);
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}

.desktop a.ActionAdd:hover:active,
.desktop a.ActionEdit:hover:active,
.desktop a.ActionDelete:hover:active,
.desktop a.ActionChange:hover:active {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-neutral-0);
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
}

.desktop a.ActionAdd:hover:active,
.desktop a.ActionEdit:hover:active,
.desktop a.ActionDelete:hover:active,
.desktop a.ActionChange:hover:active {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-neutral-0);
}

/* $2. ::::::: Backgroung Definition :::::::: */


.card {
    background-color: var(--color-neutral-0);
    border-radius: none;
    box-shadow: 0px 0px 10px 0px rgba(230, 230, 230, 1);
    margin-top: 10px;
    padding: 20px;
}

body {
    background-color: transparent;
    
    -webkit-tap-highlight-color: rgba(0,0,0,0);

    -webkit-overflow-scrolling: touch;
}


.bgMenu{
    background-image: url(/PartnersPortal_Theme/img/bgMenu_Grapes.png?10688);
    background-attachment: fixed;
    background-repeat:  no-repeat;
    background-position: absolute;
    /*background-size: cover;*/
    bottom: 0px;
    content : "";
    display: block;
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    opacity : 1;
    width: 220px;
    z-index: -1;
}


/* $3. ::::::: Menu Custom :::::::: */

/* $3.1 Header*/
.Header {
    border-bottom: none;
    height: 50px;
    line-height: 50px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 20;
    
}

.Application_Menu,
.Header_Menu {
    
    
    
    margin: 40px 0 0 15px;
}

.Menu_TopMenus{
    display: block;
}

.Menu_TopMenu{
    height: 100%;
    position: relative;
    cursor: pointer;
    font-size: 14px;
    text-align: center;
    margin-right: 60px;
    letter-spacing: 0.88px;
    color: var(--color-neutral-0);
    
}

.Menu_TopMenuActive{
    background-color: transparent;
    box-shadow: none;
    border-top: none;
    line-height: 44px;
}

/* $3.2 Link/button menu*/
.Menu_TopMenu a:link,
.Menu_TopMenu a:visited,
.Menu_TopMenu a {
    color: rgba(255, 255, 255);
    display: inline-block;
    font-family: 'NovelPro-ExtraBold';
    font-size: 20px;
    font-weight: 800;
    padding: 0px;
    text-align: left;
    text-decoration: none;
    -webkit-transition: all 300ms ease;
            transition: all 300ms ease;
}

.tablet a.Header_ButtonMenu, 
.phone a.Header_ButtonMenu {
    color: var(--color-neutral-0);
}

.Page.active .Header_ButtonMenu {
    color: var(--color-neutral-0);
}

.menuItemCopper{
    border-top: 1.5px solid var(--color-primary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 0.7;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}

.menuItemCopper:hover{
    opacity: 1;
}

.menuItemCopper_Active{
    border-top: 2.5px solid var(--color-primary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 1;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}

.menuItemBlue{
    border-top: 1.5px solid var(--color-secondary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 0.7;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}

.menuItemBlue:hover{
    opacity: 1;
}

.menuItemBlue_Active{
    border-top: 2.5px solid var(--color-secondary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 1;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}

.menuItemMagenta{
    border-top: 1.5px solid var(--color-tertiary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 0.7;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}

.menuItemMagenta:hover{
    opacity: 1;
}

.menuItemMagenta_Active{
    border-top: 2.5px solid var(--color-tertiary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 1;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}
.menuItemYellow{
    border-top: 1.5px solid var(--color-quaternary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 0.7;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}

.menuItemYellow:hover{
    opacity: 1;
}

.menuItemYellow_Active{
    border-top: 2.5px solid var(--color-quaternary);
    color: var(--color-neutral-0);
    height: 60px;
    margin-bottom: 20px;
    opacity: 1;
    padding: 10px 0 0 10px;
    text-align: left;
    width: 190px;
}


.menuItemBackoffice{
    color: var(--color-neutral-0);
    font-family: 'NovelSansPro_Bold';
    font-weight: 600;
    font-size: 14px;
}

.menuItemBackoffice:hover{
    color: var(--color-primary);
    font-family: 'NovelSansPro_Bold';
    font-weight: 600;
    font-size: 14px;
    cursor: pointer;
}


.bgBrandsMenu{
    background-color: var(--color-secondary);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

.bgBusinessMenu{
    background-color: var(--color-tertiary);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}

.tagBox{
    border: 1px solid var(--color-neutral-0);
    color: var(--color-neutral-0);
    font-size: 12px;
    height: 35px;
    margin-right: 10px;
    padding: 10px 5px;
    width: auto;
}

.tagBoxMainContent{
    background-color: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-7);
    color: var(--color-neutral-7);
    font-size: 12px;
    height: 35px;
    margin: 0 10px 10px 0;
    padding: 10px 5px;
    width: auto;
}

.Menu_DropDownPanel {
    background-color: var(--color-neutral-4);
    border-radius: 0;
    text-transform: uppercase;
    box-shadow: none;
    font-size: 11px;
}

.Header_Menu a:hover, 
.Header_Menu a:link:hover, 
.Header_Menu a:visited:hover,
.desktop a:hover, 
.desktop a:link:hover {
    color: var(--color-primary);
}

.Menu_DropDownArrow {
    border-top-color: var(--color-neutral-0);
}


.Menu_DropDownPanel a span.fa {
    color: var(--color-neutral-0);
}

.DropdownMenu .PH > a,
.DropdownMenu .PH > a:hover {
    color: var(--color-primary);
}

div.Menu_DropDownPanel a,
div.Menu_DropDownPanel a:link,
div.Menu_DropDownPanel a:visited {
    color: var(--color-neutral-2);
    height: auto;
}

div.Menu_DropDownPanel a:hover, 
div.Menu_DropDownPanel a:link:hover,
div.Menu_DropDownPanel a:visited:hover,
div.Menu_DropDownPanel a.Menu_SubMenuItem:hover,
div.Menu_DropDownPanel a.Menu_SubMenuItem.Menu_SubMenuItemActive {
    color: var(--color-neutral-0);
    background-color: transparent;
    box-shadow: none;
    
}

.Menu_DropDownPanel a.Menu_SubMenuItem:hover {
    background-color: var(--color-primary);
}

/* $3.3 LoginInfo - User */
.Login_Info a,
.Login_Info a:link,
.Login_Info a:visited{
    color: var(--color-neutral-9);
    font-family: 'NovelSansPro_Regular';
    font-size: 14px;
    line-height: 19px;
    font-weight: 600;
    text-transform: uppercase;
}

.Login_Info,
.AppSwitcherContainer,
a.Login_Info_Username,
a.Login_Info_Username:link,
a.Login_Info_Username:visited {
    color: var(--color-neutral-9);
    font-family: 'NovelSansPro_Regular';
    font-size: 14px;
    line-height: 19px;
    font-weight: 600;
    text-transform: uppercase;
}

/* $4. ::::::: Widgets / Elements / Components :::::::: */

/* $4.1 Accordion, Button Groups, Selects */

.SectionIndex.vertical a.active, 
.SectionIndex.vertical a:hover {
    color: var(--color-primary);
    border-left-color: var(--color-primary);
}

.SectionIndex a, 
.SectionIndex a:link, 
.SectionIndex a:visited,
.SectionIndex a.active, 
.SectionIndex a:hover,
.desktop .SectionIndex a:hover{
    color: var(--color-primary);
    border-bottom-color: var(--color-primary);
    text-decoration: none;
}


.AccordionVertical___title {
    color: var(--color-primary);
}

.SectionExpandable.expanded .SectionExpandable_header .Heading2 {
    color: var(--color-primary);
}
.AccordionVertical_item.open .AccordionVertical___icon > .fa {
    color: var(--color-primary);
}
.AccordionVertical_item.open > .AccordionVertical__header > .AccordionVertical___icon > .fa {
    color: var(--color-primary);
}

.expanded .SectionExpandable__icon.Heading2 > .fa {
    color: var(--color-primary);
}

.Panel .SectionExpandable__icon.Heading2 > .fa {
    color: var(--color-primary);
}

.ButtonGroup_button.Button:hover {
    background: var(--color-primary);
}

.select2-container .select2-choice span {
    color: white;
}

.select2-dropdown-open .select2-choice {
    background-color: var(--color-neutral-3);
}

.select2-results .select2-highlighted {
    background-color: var(--color-primary);
}

.IconBadge_number {
    background-color: var(--color-primary);
}

.desktop .NavigationBar a:hover, 
.desktop .NavigationBar a:link:hover {
    color: var(--color-primary);
}

.NavigationBar a.Active {
    color: var(--color-primary);
}

.desktop .NavigationBar a:hover:after, 
.desktop .NavigationBar a:link:hover:after,
.NavigationBar a.Active:after {
    background-color: var(--color-primary);
}

.NavigationBar a.Active:not(.IE8):before {
    border-bottom-color: var(--color-primary);
}

.desktop .NavigationBar.Vertical a:hover,
.desktop .NavigationBar.Vertical a:link:hover,
.NavigationBar.Vertical a.Active,
.NavigationBar.Vertical a:link.Active {
  border-color: var(--color-primary);
}

.NavigationBar.Vertical a.Active:not(.IE8):before {
    border-left-color: var(--color-primary);
}

.phone .NavigationBar .InlineDropdown:active,
.phone .NavigationBar .InlineDropdown:link:active,
.tablet .NavigationBar .InlineDropdown:active,
.tablet .NavigationBar .InlineDropdown:link:active,
.phone .NavigationBar a:active, 
.phone .NavigationBar a:link:active,
.tablet .NavigationBar a:active, 
.tablet .NavigationBar a:link:active {
    color: var(--color-primary);
}

.phone .NavigationBar .InlineDropdown:active:after,
.phone .NavigationBar .InlineDropdown:link:active:after,
.tablet .NavigationBar .InlineDropdown:active:after,
.tablet .NavigationBar .InlineDropdown:link:active:after,
.phone .NavigationBar a:active:after, 
.phone .NavigationBar a:link:active:after,
.tablet .NavigationBar a:active:after, 
.tablet .NavigationBar a:link:active:after {
    background-color: var(--color-primary);
}

.Tabs__tab.active {
    border-top-color: var(--color-primary);
    color: var(--color-primary);
}

.WizardStep a,
.WizardStep a:link,
.desktop .WizardStep a:hover,
.desktop .WizardStep a:link:hover
{
    color: var(--color-primary);
}

.WizardStep.ActiveStep {
    background: var(--color-primary);
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}

.WizardStep.ActiveStep:before {
    border-top-color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}

.WizardStep.Past {
    background: var(--color-primary);
}

.WizardStep.Past:before {
    border-top-color: var(--color-primary);
    border-bottom-color: var(--color-primary);
}

.WizardStep.Past a,
.WizardStep.Past a:hover,
.WizardStep.Past a:link,
.WizardStep.Past a:link:hover,
.WizardStep.Past a[disabled="disabled"],
.WizardStep.Past a[disabled="disabled"]:hover
.WizardStep.ActiveStep a,
.WizardStep.ActiveStep a:hover,
.WizardStep.ActiveStep a:link,
.WizardStep.ActiveStep a:link:hover,
.WizardStep.ActiveStep a[disabled="disabled"],
.WizardStep.ActiveStep a[disabled="disabled"]:hover {
    color: var(--color-neutral-0);
}

.WizardStep.Past:after {
    border-right-color: var(--color-primary);
    border-top-color: var(--color-primary);
    -webkit-filter: brightness(0.7);
    filter: brightness(0.7);
}

/* $4.2 Radio And Checkbox */

html input[type="radio"],
html input[type="checkbox"] {
    background-color: transparent;
    border-radius: 0;
    box-shadow: none !important;
    height: 20px;
    width: 20px;
}

input[type="radio"]:focus,
input[type="checkbox"]:focus {
    background-color: var(--color-neutral-10);
    height: 20px;
    width: 20px;
}

input[type="checkbox"]:after {
    border: 3px solid var(--color-neutral-8);
    border-right: 0;
    border-top: 0;
    height: 5px;
    left: 20%;
    top: 23%;
    width: 11px;
}

input[type="radio"]:before,
input[type="checkbox"]:before {
    background-color: transparent;
    border: 1px solid var(--color-neutral-6);
    border-radius: 0;
    display: block;
    height: 20px;
    width: 20px;
}



/* $4.3 Toggle Buttons */

.toggle-button {
    background-color: var(--color-neutral-6);
    border-radius: 8px;
    border: none;
    display: inline-block;
    height: 16px;
    position: relative;
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
    width: 28px;
}

.toggle-button:hover {
    background-color: var(--color-secondary);
    border: none;
}

.toggle-button.toggle-button-checked {
    background-color: var(--color-neutral-10);
    border: none;
}

.toggle-button.toggle-button-checked:hover {
    -webkit-filter: brightness(.9);
            filter: brightness(.9);
}

.toggle-button.toggle-button-disabled {
    background-color: var(--color-neutral-2);
    border: var(--border-size-s) solid var(--color-neutral-4);
    pointer-events: none;
}

.toggle-button:after {
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-rounded);
    border: var(--border-size-none);
    content: '';
    height: 10px;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 3px;
    -webkit-transform: translateX(3px) translateZ(0);
            transform: translateX(3px) translateZ(0);
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
    width: 10px;    
}

.toggle-button.toggle-button-checked:after {
    -webkit-transform: translateX(13px) translateZ(0);
            transform: translateX(13px) translateZ(0);
}

.toggle-button.toggle-button-disabled:after {
    background-color: var(--color-neutral-5);    
}

.toggle-button .checkbox {
    height: 100%;
    opacity: 0;
    position: absolute;
    width: 100%;  
}

/* $4.4 Buttons */
.buttonDisabledCustom{
    display: inline-block;
    font-family: 'NovelPro-Bold';
    height: 32px;
    opacity: 0.6;
    padding: 5px 10px;
    text-align: right;
    width: auto;
}
.buttonEnabledCustom{
    margin-left: 0px !important;
    text-align: right;
    width: 220px !important;
    display: block;
    padding: 5px 5px 5px 10px;
}

.buttonEnabledCustom:hover{
    background-color: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-6);
    border-radius: 0;
    box-shadow: none;
    color: color: var(--color-primary);
    cursor: pointer;
    display: inline-block;
    font-family: 'NovelPro-Bold';
    font-size: 14px;
    width: 220px !important;
    padding: 5px 5px 5px 10px;
    text-align: center;
    text-transform: uppercase;
}

.viewListButtonTab{
    width: 42px;
    padding: 12px 10px 8px 10px;
}

.viewImagesButtonTab{
    width: 42px;
    padding: 12px 10px 8px 10px;
}

input.Button {
    height: 32px;
    line-height: 32px;
}

.Button{
    border-radius: 0;
    box-shadow: none;
    color: var(--color-neutral-8);
    cursor: pointer;
    display: inline-block;
    font-family: 'NovelPro-Bold';
    font-size: 14px;
    line-height: 32px;
    width: auto;
    padding: 5px 15px;
    text-align: center;
    text-transform: uppercase;
}

.Button:hover{
    background-color: var(--color-neutral-4) !important;
    border: none !important;
    border-radius: 0;
    box-shadow: none;
    color: color: var(--color-primary);
    cursor: pointer;
    display: inline-block;
    font-family: 'NovelPro-Bold';
    font-size: 14px;
    line-height: 32px;
    width: auto;
    padding: 5px 15px;
    text-align: center;
    text-transform: uppercase;
}

.Button,
a.Button{
    color: var(--color-neutral-9);
    background-color: transparent;
    border: none;
}

.Button.ButtonDefault,
.Button.Is_Default {
    background-color: transparent;
    border-color: none;
    box-shadow: none;
    color: var(--color-neutral-10);
    font-family: 'NovelPro-Bold';
    font-size: 14px;
    line-height: 32px;
    text-align: center;
}

.desktop .Button.ButtonDefault:hover, 
.desktop .Button.Is_Default:hover {
    background-color: var(--color-neutral-4) !important;
    border: none !important;
    box-shadow: none;
    color: var(--color-primary);
    cursor: pointer;
    display: inline-block;
    font-family: 'NovelPro-Bold';
    font-size: 14px;
    line-height: 32px;
    width: auto;
    padding: 5px 15px;
    text-align: center;
    text-transform: uppercase;
    
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}

.Button.ButtonDefault:hover,
.Button.Is_Default:hover {
    background-color: var(--color-neutral-4) !important;
    border: none !important;
    box-shadow: none;
    color: var(--color-primary);
    cursor: pointer;
    display: inline-block;
    font-family: 'NovelPro-Bold';
    font-size: 14px;
    line-height: 32px;
    width: auto;
    padding: 5px 15px;
    text-align: center;
    text-transform: uppercase;
    
    -webkit-filter: brightness(0.9);
    filter: brightness(0.9);
}

.Button:hover:active,
a.Button:hover:active {
    color: var(--color-primary);
    line-height: 32px;
}

.Button.ButtonDefault:hover:active,
.Button.Is_Default:hover:active {
    background-color: var(--color-neutral-4) !important;
    border: none !important;
    color: var(--color-primary);
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
    line-height: 32px;
}

.Button.Link {
    color: var(--color-primary);
}

.desktop .Button.Link:hover {
    border-color: var(--color-primary);
    color: var(--color-primary);
}

.desktop .Button:hover, 
.desktop a.Button:hover {
    color: var(--color-primary);
}

.ButtonGroup_button.active, 
.desktop .ButtonGroup_button.active:hover {
    background-color: var(--color-primary);
}

.ButtonGroup_button.Button:hover,
.ButtonGroup_button.Button:hover .fa{
    color: var(--color-neutral-0);
}


/* $4.5 Form */

[disabled='disabled'],
[readonly='readonly'],
textarea[readonly='readonly'] {
    color: var(--color-neutral-5);
    pointer-events: none;
    background-color: var(--color-neutral-2);
    border: 1px solid var(--color-neutral-5);
}


/* $4.6 Inputs And Selectors */

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: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-6);
    border-radius: 0px;
    box-shadow: none;
    font-size: 12px;
    line-height: 30px;
    vertical-align: initial;
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;  
    max-height: 32px;
}

.input-with-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
}

.input-with-icon .input-with-icon-content-icon {
    display: -ms-inline-flexbox;
    display: -webkit-inline-box;
    display: inline-flex;
    height: 32px;
    left: 0;
    position: absolute;
    width: 40px;
}

.input-with-icon .input-with-icon-input,
.input-with-icon .input-with-icon-input input {
    width: 100%;
    left: -20px;
}

.input-with-icon.input-with-icon-right .input-with-icon-content-icon {
    left: auto;
    right: 0;
}

.input-with-icon .input-with-icon-content-icon,
.input-with-icon .input-with-icon-content-icon a {
    color: var(--color-neutral-7);
    top: 5px;
}


.input-with-icon .input-with-icon-content-icon.search-actions {
    left: auto;
    right: 0;
}

.input-with-icon.input-with-icon-right .input-with-icon-content-icon.search-actions {
    left: 0;
    right: auto;
    height: auto;
}

.input-with-icon .input-with-icon-content-icon.search-actions:hover {
    color: var(--color-neutral-8);
    cursor: pointer;
}

/* $4.7 Patterns - Content - Carousel */

.carousel {
    position: relative;
    -webkit-transition: opacity 330ms ease;
            transition: opacity 330ms ease;
}

.carousel.is--hidden {
    opacity: 0;
    
}

.carousel .tns-outer {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
    /*width: 70%;*/
    width: 100%;
}

.carousel .tns-ovh {
    position: relative;
    /*overflow: hidden;*/
}

.carousel .tns-item {
    cursor: -webkit-grab;
}

.carousel .tns-nav {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
    margin-top: 5px;
    z-index: 1;
}

.carousel .tns-nav button {
    background-color: transparent;
    border: 1.5px solid var(--color-primary);
    cursor: pointer;
    height: 20px;
    text-align: center;
    margin-right: 15px;
    width: 20px;
}

.carousel .tns-nav > [aria-selected="true"] {
    background: var(--color-primary);
}

.carousel .tns-horizontal.tns-subpixel > .tns-item {
    display: inline-block;
    vertical-align: top;
    white-space: normal;
}

.carousel .carousel-navigation {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.carousel .carousel-arrow-left,
.carousel .carousel-arrow-right {
    position: absolute;
    background:  transparent;
    border-radius: 50%;
    cursor: pointer;
    height: 40px;
    width: 40px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack:  center;
    -ms-flex-pack:  center;
    justify-content:  center;
    -webkit-box-align:  center;
    -ms-flex-align:  center;
    align-items:  center;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
            box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
    color: var(--color-neutral-7);
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
}

.carousel .carousel-arrow-left:hover,
.carousel .carousel-arrow-right:hover {
    color: var(--color-neutral-9);
}

.carousel .carousel-arrow-left {
    left: 0;
}

.carousel .carousel-arrow-right {
    right: 0;
}

.carousel .carousel-navigation.carousel-padding-none .carousel-arrow-left {
    left: 24px;
}

.carousel .carousel-navigation.carousel-padding-none .carousel-arrow-right {
    right: 24px;
}

.carousel .carousel-arrow-left .fa-fw,
.carousel .carousel-arrow-right .fa-fw {
    font-size: 24px;
}

.carousel .carousel-arrow-left .fa-fw {
    margin: -2px 0 0 -2px;
}

.carousel .carousel-arrow-right .fa-fw {
    margin: -2px -2px 0 0;
}

/* $4.8 Dropdown */

/* $4.8.1 DropdownSelect */
.choices {
    min-width: 150px;
    position: relative;
}

.choices.is-open.is-focused .choices__inner {
    border: 1px solid var(--color-primary);
    border-radius: 0;
}

.choices.Not_Valid .choices__inner {
    border: 1px solid var(--color-error);
}

.choices .choices__inner select {    
    opacity: 0;
    position: absolute;
    z-index: -10;
    pointer-events: none;
    width: 1px;
}

.choices:focus {
    outline: none;
}

.choices:last-child {
    margin-bottom: 0;
}

.choices.is-disabled {
    cursor: not-allowed;
}

.choices.is-disabled .choices__inner,
.choices.is-disabled .choices__input {
    background-color: var(--color-neutral-0);
    cursor: not-allowed;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}

.choices.is-disabled .choices__item {
    cursor: not-allowed;
}

.choices[data-type*="select-one"] {
    cursor: pointer;
}

.choices[data-type*="select-one"] .choices__inner .choices__inner {
    padding-bottom: 0;
}

/*.choices[data-type*="select-one"] .choices__inner .choices__input {
    background-color: var(--color-neutral-0);
    border-bottom: var(--border-size-s) solid var(--color-neutral-5);
    margin-bottom: var(--space-none);
    padding-left: var(--space-xl);
    padding: var(--space-s);
    position: relative;
    width: 100%;
}*/

.choices[data-type*="select-one"] .choices__button {
    height: auto;
    margin-right: 24px;
    margin-top: -10px;
    padding: 0;
    position: absolute;
    right: 0;
    top: 50%;
    width: 20px;
}

.choices[data-type*="select-one"] .choices__button:hover,
.choices[data-type*="select-one"] .choices__button:focus {
    opacity: 1;
}

.choices[data-type*="select-one"] .choices__button:focus {
    box-shadow: none;
}

.choices .search--wrapper input:not(.btn):not(.checkbox):not(.radio-button),
.choices .search--wrapper .input {
    padding-left: 25px;
    max-width: 100%;
}

.choices .search--wrapper {
    padding: 12px;
}

/* Arrow icon */
.choices[data-type*="select-one"]:after {

    content: '\f107';
    font: normal normal normal 24px/1 FontAwesome;
    font-family: 'FontAwesome';
    background-position: right center ;
    position: absolute;
    right: 16px;
    top: 8px;
    -webkit-transition: all 300ms ease;
    transition: all 300ms ease;
    transform-origin: center;
}

.choices[data-type*="select-one"].is-open:after {
    color: var(--color-primary);
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
}

.choices[data-type*="select-one"][dir="rtl"]:after {
    left: 16px;
    right: auto;
}

.choices[data-type*="select-one"][dir="rtl"] .choices__button {
    left: 0;
    margin-left: 20px;
    margin-right: 0;
    right: auto;
}

.choices[data-type*="select-multiple"] .choices__inner,
.choices[data-type*="text"] .choices__inner {
    cursor: text;
}

.choices[data-type*="select-one"] .choices__button {
    display: none;
}

.choices[data-type*="select-multiple"] .choices__button,
.choices[data-type*="text"] .choices__button {
    border: none;
    display: inline-block;
    line-height: 1;
    margin-bottom: 0;
    margin-left: 12px;
    margin-right: -4px;
    margin-top: 0;
    padding-left: 5px;
    position: relative;
    width: 8px;
}

.choices[data-type*="select-multiple"] .choices__button:hover,
.choices[data-type*="select-multiple"] .choices__button:focus,
.choices[data-type*="text"] .choices__button:hover,
.choices[data-type*="text"] .choices__button:focus {
    opacity: 1;
}

.choices__inner {
    border-radius: 0;
    border: 2px solid var(--color-neutral-4);
    color: var(--color-neutral-3);
    display: inline-block;
    height: 32px;
    line-height: calc(var(--font-size-base) * 2);
    padding-left: 6px;
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
    vertical-align: top;
    width: 100%; 
}

.choices[data-type*="select-multiple"] .choices__inner {
    height: auto;
    padding: 12px;
    border-radius: 0;
}

.choices__inner:hover {
    border: 1px solid var(--color-neutral-6);
}

.is-focused .choices__inner,
.is-open .choices__inner {
    border-color: var(--color-primary);
    border-radius: 0;
    color: var(--color-neutral-1);
}

.is-open .choices__inner {
    border-radius: 0;
}

.is-flipped.is-open .choices__inner {
    border-radius: 0;
}

.choices__list {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

.choices__list--single {
    display: inline-block;
    padding-right: 5px;
    width: 100%;
}

.choices__list.choices__list--dropdown {
    border-radius: 0;
}

.choices__list.choices__list--dropdown.is-active {
    margin-top: 4px;
}


.search--wrapper {
    position: relative;
}

.search--wrapper input {
    background-color: var(--color-neutral-0);
    border-radius: 0;
    border: 1px solid var(--color-neutral-6);
    height: 32px;
    padding: 4px 6px;
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
}

.search--wrapper:before {
    color: var(--color-neutral-7);
    content: '\f002';
    font-family: 'FontAwesome';
    left: 5px !important;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
}

/* $4.8.2 Listbox - Choices Multiple */

.choices__list--multiple {
    display: inline;
}

.choices__list--multiple .choices__item {
    display: -webkit-inline-box;
    display: -webkit-inline-flex;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    height: 25px;
    margin-top: 4px;
    margin-left: 4px;
    padding: 5px 8px;
    vertical-align: middle;
    font-size: 10px;
    font-weight: 600;
    color: var(--color-neutral-9);
    word-break: break-all;
    background-color: var(--color-neutral-3);
    border: 1px solid var(--color-neutral-6);
    border-radius: 2px;
}

.choices[data-type*='select-multiple'] .choices__button::after {
    content: '\f057';
    font: normal normal normal 14px/1 FontAwesome;
    font-family: 'FontAwesome';
    color: var(--color-text);
    text-indent: 0;
    -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            transform: translateY(-50%);
    position: absolute;
    top: 50%;
    left: 0;
}

.choices[data-type*='select-multiple'] .choices__item.is-highlighted .choices__button::after {
    color: var(--color-text);
}

.choices[data-type*='select-multiple'] .search--wrapper input {
    min-width: 100%;
    border: 0;
}

.choices[data-type*='select-multiple'] .choices__inner,
.choices[data-type*='select-multiple'] .search--wrapper,
.choices[data-type*='select-multiple'].is-open .search--wrapper {
    padding: 0;
}

.choices[data-type*='select-multiple'] .choices__inner{
    max-height: 200px;
    border: 1px solid var(--color-neutral-6);
    overflow-y: auto;
}

.choices[data-type*='select-multiple'] .search--wrapper input:focus {
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.choices[data-type*='select-multiple'].is-open .choices__inner {
    border: 1px solid var(--color-neutral-5);
}

.choices[data-type*='select-multiple'] .search--wrapper::before {
    left: var(--space-base);
}

.choices__list--multiple .choices__item {
    -webkit-transition: 150ms;
    -o-transition: 150ms;
    transition: 150ms;
}

.choices__list--multiple .choices__item:hover {
    background-color: var(--color-neutral-4);
}

.choices__list--multiple .choices__item[data-deletable] {
    padding-right: 12px;
}

.choices__list--multiple .choices__item.is-highlighted {
    color: var(--color-text);
    background-color: var(--color-neutral-4);
    border: 1px solid solid var(--color-neutral-3);
}

.is-disabled .choices__list--multiple .choices__item {
    background-color: var(--color-neutral-6);
    border: 1px solid var(--color-neutral-7);
    cursor: not-allowed;
}

.choices__list--dropdown {
    display: none;
    width: 100%;
    word-break: break-all;
    background-color: var(--color-neutral-0);
    border: 1px solid var(--color-neutral-5);
    position: relative;
    top: 100%;
    z-index: 1;
    overflow: hidden;
}

.choices__list--dropdown.is-active {
    display: block;
}

.is-flipped .choices__list--dropdown {
    margin-top: var(--space-none);
    margin-bottom: -1px;
    border-radius: var(--border-radius-soft) var(--border-radius-soft) var(--border-radius-none) var(--border-radius-none);
    top: auto;
    bottom: 100%;
}

.choices__list--dropdown .choices__list {
    max-height: 300px;
    position: relative;
    overflow: auto;

    -webkit-overflow-scrolling: touch;
    will-change: scroll-position;
}

.choices__list--dropdown .choices__item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    height: 38px;
    padding: var(--space-none) var(--space-base);
    position: relative;

    -webkit-box-align: center;
    -ms-flex-align: center;
}

.choices__list--dropdown choices-disabled {
    cursor: not-allowed;
}

.choices__item--disabled {
    cursor: not-allowed;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    opacity: .5;
}

.choices__heading {
    padding: var(--space-s);
    font-size: var(--font-size-s);
    font-weight: var(--font-medium);
    color: var(--color-neutral-5);
    border-bottom: var(--border-size-s) solid var(--color-neutral-0);
}

.choices__button {
    text-indent: -9999px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    border: var(--border-size-none);

    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none;
}

.choices__button:focus {
    outline: none;
}

.choices__input,
.Form .choices__input {
    display: inline-block;
    width: 100%;
    vertical-align: baseline;
    background-color: var(--color-neutral-0);
    border: var(--border-size-none);
}

.choices__input:focus,
.Form .choices__input:focus {
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.choices__placeholder {
    opacity: .5;
}

.choices__list--single .choices__item {
    width: 99%;
    padding-right: var(--space-base);
    line-height: 38px;
    white-space: nowrap;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    overflow: hidden;
}

.choices__list::-webkit-scrollbar {
    width: 5px;
}

.choices__list::-webkit-scrollbar-track {
    background: var(--color-neutral-4);
}

.choices__list::-webkit-scrollbar-thumb {
    background-color: var(--color-neutral-6);
}

.choices__list--dropdown .choices__item--selectable.is-highlighted {
    background-color: var(--color-neutral-2);
}

.choices__list--dropdown .choices__item--selectable.is-highlighted:after {
    opacity: .5;
}

.choices__item {
    cursor: default;
}

.choices__item--selectable {
    cursor: pointer;
}

/* rtl */
.choices[dir='rtl'] .search--wrapper input:not(.btn):not(.checkbox):not(.radio-button) {
    padding-right: var(--space-xl);
}

.choices[dir='rtl'] .search--wrapper:before {
    right: var(--space-base);
}

.choices[dir='rtl'] .choices__list--single {
    padding-right: var(--space-xs);
    padding-left: var(--space-base);
}

.choices[dir='rtl'] .choices__list--multiple .choices__item {
    margin-right: var(--space-xs);
    margin-left: var(--space-none);
}

.choices[dir='rtl'] .choices__list--dropdown .choices__item {
    text-align: right;
}

.choices[dir='rtl'] .choices__input {
    padding-right: 2px;
    padding-left: var(--space-none);
}

.choices[data-type*='select-multiple'][dir='rtl'] .choices__button,
.choices[data-type*='text'][dir='rtl'] .choices__button {
    margin-right: var(--space-s);
    margin-left: 0;
    padding-left: var(--space-none);
}

/* $4.9 Popup */

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: var(--color-primary);
}

.InfoTooltip .tooltipstered,
.ListItem  .tooltipstered{
    color: var(--color-primary);
}


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: var(--color-neutral-0);
    top:0;
}

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 {
    opacity: 1;
    top: 15px;
    background-image: url(/WebPatterns/img/PopupCloseWhite.png?8752);
}

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{
    padding-top:0;
}


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: var(--color-neutral-0);
    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 {
    opacity: 1;
    top: 15px;
    background-image: url(/WebPatterns/img/PopupCloseWhite.png?8752);
}

/* $4.10 Calendar */

.Calendar-day-selected, 
.Calendar-day-selected:hover {
    background: var(--color-primary);
}

.Calendar-navDisabled > div, 
.topBar-navDisabled .Calendar-navBtn > div,
.Calendar-time-down, 
.Calendar-time-up, 
.Calendar-time-am {
    color: var(--color-primary);
}

/* $4.11 Slider */

.SliderRange .ui-slider-range {
    background-color: var(--color-primary);
}

/* $4.12 Feedback */

.Feedback_AjaxWait {
    color: #222;
}

.Feedback_AjaxWait .Loader {
    -webkit-animation: loader 1.3s infinite linear;
            animation: loader 1.3s infinite linear;
    border-radius: 50%;
    font-size: 4px;
    height: 1em;
    margin-bottom: 20px;
    position: relative;
    text-indent: -9999em;
    -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
            transform: translateZ(0);
    width: 1em;
    background: transparent;
}

/* $4.13 EditableTable */
a,
a:link,
a:visited,
.EditableTable tr.RowControlGroup a  {
    color: var(--color-primary);
}

.EditableTable tr.RowControlGroup a:hover {
    color:  var(--color-primary);
}

/* $4.14 FileUpload */

.file-upload {
    -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
    background: var(--color-neutral-0);
    border: 1px dashed var(--color-neutral-6);
    border-radius: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 80px;
    -webkit-box-pack: justify;
       -ms-flex-pack: justify;
     justify-content: space-between;
    padding: var(--space-base);
    position: relative;
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
}

.file-upload .file-upload-icon,
.file-upload .file-upload-delete {
    color: var(--color-neutral-8);
    font-size: 20px;
    position: absolute;
    display: block;
    left: 47%;
    right: 47%;
    top: 10px;
}

.file-upload .file-upload-delete {
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: all 180ms linear;
            transition: all 180ms linear;
}

.file-upload.active .file-upload-delete {
    opacity: 1;
    pointer-events: auto;
}

.file-upload .file-upload-message {
    color: var(--color-neutral-8);
    -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    padding-left: 0px;
    
    text-align: center;
    margin-top: 10px;
}

.file-upload .file-upload-widget input[type=file] {
    cursor: pointer;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0;
}

/* $5. ::::::: CUSTOM :::::::: */

/* $5.1 Icons and Marks */

.positionRelative{
    position: relative;
    margin-left: 10px;
    width: 160px;
    height: 40px;
}

.positionRelative .statusIcon{
    position: absolute;
    top: 5px;
    left: 8px;
}


/* $5.2 Tables - TablesRecords*/

.NewTableRecords_Header {
    color: #999 !important;
    font-size: 12px !important;
    font-weight: bold !important;
    padding: 10px 5px 10px 0px;
    text-transform: uppercase;
    text-align: left;
    font-size: 10px;
    font-weight: bold !important;
    letter-spacing: 1px;
    line-height: 14px;
}

.NewTableRecords {
    margin-top: 10px;
    text-align: left;
    overflow-x: auto;
}

.NewTableRecords_OddLine,
.NewTableRecords_EvenLine {
    background-color: #fff;
    border-bottom: none;
    height: 61px;
    border-bottom: 1.5px solid #F5F5F5;
    text-align: left;
    vertical-align: middle;
    padding-right: 20px;
}

.NewTableRecords_OddLine:first-child,
.NewTableRecords_EvenLine:first-child,
.NewTableRecords_Header:first-child {
    padding-left: 20px;
    text-align: left;
}

.NewTableRecords tbody > tr:last-child > td {
    border-bottom: none;
}

tbody{
    box-shadow: 0px 0px 10px 0px rgba(245,245,245,1);
    color: var(--color-text);
    font-size: 14px;
    line-height: 19px;
}

.NewTableRecords a:link{
    color: var(--color-primary);
}

.NewTableRecords a:link:hover{
    color: var(--color-text) !important;
}


/* $5.3 Checkbox Into Tables */

.NewTableRecords_Header html input[type="checkbox"],
.NewTableRecords html input[type="checkbox"],
.NewTableRecords_OddLine html input[type="checkbox"],
.NewTableRecords_EvenLine html input[type="checkbox"],
.NewTableRecords_OddLine:first-child html input[type="checkbox"],
.NewTableRecords_EvenLine:first-child html input[type="checkbox"],
.NewTableRecords_Header:first-child html input[type="checkbox"]{
    background-color: transparent;
    border-radius: 0;
    box-shadow: none !important;
    height: 20px;
    width: 20px;
}

.NewTableRecords_Header input[type="checkbox"]:before,
.NewTableRecords input[type="checkbox"]:before,
.NewTableRecords_OddLine input[type="checkbox"]:before,
.NewTableRecords_EvenLine input[type="checkbox"]:before,
.NewTableRecords_OddLine:first-child input[type="checkbox"]:before,
.NewTableRecords_EvenLine:first-child input[type="checkbox"]:before,
.NewTableRecords_Header:first-child input[type="checkbox"]:before{
    background-color: transparent;
    border: 1px solid var(--color-neutral-7);
    border-radius: 0;
    display: block;
    height: 20px;
    width: 20px;
}

.NewTableRecords_Header input[type="checkbox"]:focus,
.NewTableRecords input[type="checkbox"]:focus,
.NewTableRecords_OddLine input[type="checkbox"]:focus,
.NewTableRecords_EvenLine input[type="checkbox"]:focus,
.NewTableRecords_OddLine:first-child input[type="checkbox"]:focus,
.NewTableRecords_EvenLine:first-child input[type="checkbox"]:focus,
.NewTableRecords_Header:first-child input[type="checkbox"]:focus{
    background-color: transparent;
    height: 20px;
    width: 20px;
}

.NewTableRecords_Header input[type="checkbox"]:after,
.NewTableRecords input[type="checkbox"]:after,
.NewTableRecords_OddLine input[type="checkbox"]:after,
.NewTableRecords_EvenLine input[type="checkbox"]:after,
.NewTableRecords_OddLine:first-child input[type="checkbox"]:after,
.NewTableRecords_EvenLine:first-child input[type="checkbox"]:after,
.NewTableRecords_Header:first-child input[type="checkbox"]:after{
    border: 3px solid var(--color-neutral-10);
    border-right: 0;
    border-top: 0;
    height: 5px;
    left: 20%;
    top: 23%;
    width: 11px;
}


/* $5.4 Texts */

.display-inline-block { display: inline-block; }

.text-align-right { text-align: right; }
.text-align-center { text-align: center; }
.text-align-left { text-align: left; }


.fileItem{
    display: inline-block;
    border-bottom: 1px solid var(--color-neutral-4);
    height: 30px;
    padding: 7px 5px 5px 0px;
}

.titlePageCustom{
    color: var(--color-neutral-9);
    font-family: 'NovelSansPro_SemiBold';
    font-size: 20px;
    height: 29px;
    line-height: 29px;
    margin-left: 10px;
    text-align: left;
    text-transform: uppercase;
    width: auto;
}

.labelGeneral{
    color: var(--color-neutral-9);
    font-family: 'NovelSansPro_Regular';
    font-size: 13px;
    height: 14px;
    line-height: 14px;
}

.labelCustom{
    color: var(--color-neutral-7);
    font-family: 'NovelSansPro_Bold';
    font-size: 10px;
    height: 14px;
    line-height: 14px;
    text-transform: uppercase;
}

.expressionCustom{
    color: var(--collor-neutral-10);
    font-size: 16px;
}

.statusCustom{
    display: block;
    padding: 5px;
    text-align: left;
    width: auto;
}

.fileContainer{
    border: 1px solid var(--color-neutral-6);
    background-color: var(--color-neutral-4);
    font-size: 12px;
    font-weight: 600;
    height: 32px;
    padding:10px 5px 5px 5px;
    text-align: center;
    text-transform: uppercase;
}


/* $5.5 Others */
.owl-theme .owl-controls .owl-page.active span, 
.owl-theme .owl-controls.clickable .owl-page:hover span {
    background-color: var(--color-primary);
}

td.RowWithAddAction a:hover {
    color: var(--color-primary);
    -webkit-filter: brightness(0.8);
    filter: brightness(0.8);
}


.pika-prev:after,
.pika-next:after {
    color: var(--color-primary); 
}

.pika-title {
    border-bottom: 2px solid var(--color-primary);
}

.is-selected .pika-button {
   background-color: var(--color-primary);
}

.has-event .pika-button:after {
   background-color: var(--color-primary); 
}



/* $5.6 Keyframes */
@-webkit-keyframes loader {
    0%,
    100% {
        box-shadow: 0 -3em 0 .2em #222, 2em -2em 0 0 #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 0 #222;
    }
    12.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 .2em #222, 3em 0 0 0 #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    25% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 0 #222, 3em 0 0 .2em #222, 2em 2em 0 0 #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    37.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 0 #222, 2em 2em 0 .2em #222, 0 3em 0 0 #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    50% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 0 #222, 0 3em 0 .2em #222, -2em 2em 0 0 #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    62.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 0 #222, -2em 2em 0 .2em #222, -3em 0 0 0 #222, -2em -2em 0 -.5em #222;
    }
    75% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 .2em #222, -2em -2em 0 0 #222;
    }
    87.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 0 #222, -2em -2em 0 .2em #222;
    }
}
@keyframes loader {
    0%,
    100% {
        box-shadow: 0 -3em 0 .2em #222, 2em -2em 0 0 #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 0 #222;
    }
    12.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 .2em #222, 3em 0 0 0 #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    25% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 0 #222, 3em 0 0 .2em #222, 2em 2em 0 0 #222, 0 3em 0 -.5em #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    37.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 0 #222, 2em 2em 0 .2em #222, 0 3em 0 0 #222, -2em 2em 0 -.5em #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    50% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 0 #222, 0 3em 0 .2em #222, -2em 2em 0 0 #222, -3em 0 0 -.5em #222, -2em -2em 0 -.5em #222;
    }
    62.5% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 0 #222, -2em 2em 0 .2em #222, -3em 0 0 0 #222, -2em -2em 0 -.5em #222;
    }
    75% {
        box-shadow: 0 -3em 0 -.5em #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 .2em #222, -2em -2em 0 0 #222;
    }
    87.5% {
        box-shadow: 0 -3em 0 0 #222, 2em -2em 0 -.5em #222, 3em 0 0 -.5em #222, 2em 2em 0 -.5em #222, 0 3em 0 -.5em #222, -2em 2em 0 0 #222, -3em 0 0 0 #222, -2em -2em 0 .2em #222;
    }
}

.Page.active .MainContent {
    pointer-events: none;
    opacity: .4;
}


/* Menu tablet and phone */
.tablet .Application_Menu,
.phone .Application_Menu {
    background-image: url(/PartnersPortal_Theme/img/bgMenu_Grapes.png?60581&10688);
    background-attachment: fixed;
    background-repeat: no-repeat;
    bottom: 0;
    display: block;
    height: auto;
    left: 0;
    overflow: auto;
    padding-top: 30px !important;
    position: fixed;
    top: 0;
    /* Enable hardware acceleration */
    -webkit-transform: translateX(-100%);
        -ms-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;
            perspective: 1000;    
    z-index: 1;
}
