/* NCC */

a,
a:link,
a:visited {
    color: #000;
    outline: none;
}

.desktop a:hover,
.desktop a:link:hover,
.desktop a:visited:hover {
    color: #b39501;
}

/*------------------------------------*\
              $2. Structure
\*-------------------------------------*/

/* Header ******************************/
.Header_background {
    background-color: #EAEAEA;
    border-bottom: #e6e6e6 solid 2px;
}

.Header_Menu a,
.Header_Menu a:link,
.Header_Menu a:visited {
    color: #000;
}

.Header_Menu a:hover,
.Header_Menu a:link:hover,
.Header_Menu a:visited:hover {
    color: #000;
}

/* Sorts the logo ratio */
.Header .Application_Title img {
    height: 40px;
    max-height: 60px;
}

/* Button Menu */
a.Header_ButtonMenu {
    color: #000;
}

.desktop a.Header_ButtonMenu {
    color: #000;
}

.Page.active .Header_ButtonMenu {
    color: #000;
}

/* Button Sidebar */
a.Header_ButtonSidebar {
    color: #000;
    font-size: 20px;
}

/* Sidebar **********************************/
.Sidebar {
    border-left: 1px solid #ddd;   
}

.desktop.small .Sidebar,
.tablet .Sidebar {
    background-color: #EAEAEA;
}

.SectionWebsite_title {
    color: #000;
}

.SectionWebsite .Card {
    color: #333;
}

.SectionWebsite .Panel {
    color: #333;
}

.SectionWebsite .AccordionVertical {
    color: #333;
}

.SectionWebsite .SectionExpandable {
    color: #333;
}

.SectionWebsite .Box {
    color: #fff;
}

.Website .Footer {
    color: #FFFFFF;
    background-color: #3C3C3B;
}

.BackOffice .Footer {
    color: #FFFFFF;
    background-color: #3C3C3B;
}

/* APP Title */
.Application_Title a,
.Application_Title a:link,
.Application_Title a:visited,
.Application_Title a:hover {
    color: #fff;
}

/* Menu ***************************************/

/* hover menu */
.Menu_TopMenu a:hover {
    color: #956b29;
}

/* link/button menu */
.Menu_TopMenu a:link,
.Menu_TopMenu a:visited,
.Menu_TopMenu a {
    color: #000;
}

/* pointer */
.Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #EAEAEA;
}

.Menu_DropDownButton.open .Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #EAEAEA;
}

/* active menu */
.Menu_TopMenuActive {
    background-color: rgba(0, 0, 0, .1);
    border-top: 3px solid #fff;
    box-shadow: inset 0 1px 3px rgba(0, 0, 0, .5);
}

.Menu_DropDownButton.open .Menu_TopMenu a {
    color: #fff;
}

/* active menus */
.Menu_TopMenuActive a:link,
.Menu_TopMenuActive a:visited,
a.Menu_SubMenuItemActive:link,
a.Menu_SubMenuItemActive:visited {
    color: #000;
}

/* submenu item */
.Menu_DropDownPanel {
    background-color: #454952;
    box-shadow: 0 2px 10px 0 rgba(0,0,0,.2);
}

/* reset any inherit styles (e.g.: ChicagoMobile -> Chicago) */
div.Menu_DropDownPanel a,
div.Menu_DropDownPanel a:link,
div.Menu_DropDownPanel a:visited {
    color: #000;
}

div.Menu_DropDownPanel a:hover,
div.Menu_DropDownPanel a:link:hover,
div.Menu_DropDownPanel a:visited:hover {
    color: #000;
}

/* submenu */
.Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownPanel a.Menu_SubMenuItem:link,
.Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    color: rgba(0, 0, 0, .75);
}

/* hover submenu item */
.Menu_DropDownPanel a.Menu_SubMenuItem:hover,
.Menu_DropDownPanel a.Menu_SubMenuItem.Menu_SubMenuItemActive {
    background-color: #444;
    color: #956b29;
}

/* Menu tablet and phone */
.tablet .Application_Menu,
.phone .Application_Menu {
    background: #EAEAEA;
}

.tablet .Application_Menu .Menu_DropDownButton.open .Menu_TopMenu,
.phone .Application_Menu .Menu_DropDownButton.open .Menu_TopMenu {
    box-shadow: 0 3px 1px rgba(0,0,0,.3);
}

.tablet .Application_Menu .Menu_DropDownPanel,
.phone .Application_Menu .Menu_DropDownPanel {
    background-color: rgba(0, 0, 0, .3);
}

/* User */
.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__Logo {
    padding-top: 10px;
    background-color: #EAEAEA;
}

/* Responsive Context */
.tablet .Login_Info_Logout:before,
.phone .Login_Info_Logout:before {
    font-size: 20px;
}

/* Content *********************************************/

/* If we use sidebar */
.desktop:not(.small).UseSidebar .Content {
    background-color: #FFFFFF;
}

.UseSidebar .Content {
    background-color: #FFFFFF;
}

/* Title Page ************/

.Title_Section {
    background-color: #EAEAEA;  
    box-shadow: inset 0 -1px 2px rgba(0, 0, 0, .15);
    color: #FFF;
}

/* To work with old applications */
.Title_Links {
    font-size: 14px;
    margin-top: 5px;
}

/* Main Content ****************************/

/* Footer **********************************/
.Footer {
    background-color: #7F1183;
}

.phone .Footer {
    font-size: 16px;
}

.Footer a,
.Footer a:link,
.Footer a:visited {
    color: #fff;
    font-size: 12px;
}

.MainPopup {
    background: #fff;
}

/* File Upload **************************/
.FileUpload {
    background-color: rgba(0,0,0,.05);
    border: 1px solid #ccc;
}

.FileUpload.active .FileUpload_Label {
    color: #999;
}

/*------------------------------------*\
              $3. Text formatting
\*-------------------------------------*/

/*------------------------------------*\
              $4. Forms
\*-------------------------------------*/
textarea,
select,
input {
    font-size: 14px;
}

/* radio and checkbox override rules */
html input[type="radio"],
html input[type="checkbox"] {
    background-color: transparent;
}

input[type="checkbox"]:after {
    border: 3px solid #333;
}

.Form input.ReadOnly:not(.Not_Valid),
.Form textarea.ReadOnly:not(.Not_Valid),
.Form select.ReadOnly:not(.Not_Valid) {
    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;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
    font-size: 12px;
}

textarea:focus,
select:focus,
input:focus {
    border-color: #aaa;
}

.Form input.ReadOnly:not(.Not_Valid),
.Form textarea.ReadOnly:not(.Not_Valid),
.Form select.ReadOnly:not(.Not_Valid) {
    background-color: #fff;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.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: #f5f5f5;
}

/* All focus disabled inputs - maintain same style*/
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: #f5f5f5;
    border: 1px solid #ccc;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}

.Form input.ReadOnly,
.Form textarea.ReadOnly,
.Form select.ReadOnly {
    font-size: 12px;
}

textarea:focus,
select:focus,
input:focus {
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1) !important;
}

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;
}

.Form textarea.Not_Valid:focus,
.Form textarea.Not_Valid,
textarea.Not_Valid:focus,
textarea.Not_Valid {
    font-size: 12px;
}

select.Not_Valid:focus,
input.Not_Valid:focus,
textarea.Not_Valid:focus {
    border: 1px solid #bf1601;
}

.Form input.ReadOnly,
.Form textarea.ReadOnly {
    background: #fff;
}

/*------------------------------------*\
              $5. Buit-in widgets
\*-------------------------------------*/

a.ListNavigation_PageNumber:link,
span.ListNavigation_CurrentPageNumber,
span.ListNavigation_Ellipsis,
a.ListNavigation_Previous:link,
a.ListNavigation_Next:link {
    background: #fff;
    border: 1px solid #999;
    color: #333;
    font-size: 14px;
    font-weight: normal;
}

.TableRecords_Header {
    border-bottom: solid 1px #eee;
    color: #999;
    font-size: 12px;
    font-weight: bold;
}

.TableRecords > tbody > tr:hover {
    background: #fff;
}

.TableRecords {
    background-color: #fff;
    border: 1px solid #dadbde;
    box-shadow: 0 1px 2px rgba(211, 211, 211, .5);
}

.TableRecords_OddLine {
    background-color: #fafafa;
}

.TableRecords_OddLine,
.TableRecords_EvenLine {
    border-bottom: 1px solid #eee;
}

.EditableTable thead td {
    color: #333;
    font-weight: bold;
}

.EditableTable {
    border: 1px solid #ddd;
}
.EditableTable thead tr th {
    background-color: #fff;
    border-bottom: 1px solid #ddd;
}

.EditableTable tr:nth-child(odd) {
    background-color: #fafafa;
}

.EditableTable tbody tr:not(.RowControlGroup) td {
    border-bottom: 1px solid #ddd;
}

td.RowWithAddAction {
    background: none repeat scroll 0 0 #fff;
}

.EditableTable tr.RowControlGroup a:hover {
    color: #956b29;
}

.EditableTable tr.RowControlGroup a {
    color: #b39501;
}

/*------------------------------------*\
              $6. RichWidgets
\*-------------------------------------*/

/* Feedback Message **************************/
div.Feedback_Message_Info:before,
div.Feedback_Message_Success:before,
div.Feedback_Message_Error:before,
div.Feedback_Message_Warning:before {
    font-size: 20px;
}

div.Feedback_Message_Success {
    background-color: #dff0d8;
    border: 1px solid #cbe0ba;
    color: #346b35;
}

div.Feedback_Message_Success a.Feedback_Message_Wrapper_Close:after {
    color: #346b35;
}

div.Feedback_Message_Success:before {
    color: #7dc62b;
}

div.Feedback_Message_Error {
    background-color: #f5e7e7;
    border: 1px solid #ead8d8;
    color: #843534;
}

div.Feedback_Message_Error a.Feedback_Message_Wrapper_Close:after {
    color: #843557;
}

div.Feedback_Message_Error:before {
    color: #e58d8d;
}

div.Feedback_Message_Warning {
    background-color: #fcf8e3;
    border: 1px solid #f1deb6;
    color: #8a6d3b;
}

div.Feedback_Message_Warning a.Feedback_Message_Wrapper_Close:after {
    color: #8a6d3b;
}

div.Feedback_Message_Warning:before {
    color: #eabd30;
}

div.Feedback_Message_Info {
    background-color: #fcf8e3;
    border: 1px solid #f1deb6;
    color: #8a6d3b;
}

div.Feedback_Message_Info a.Feedback_Message_Wrapper_Close:after {
    color: #8a6d3b;
}

div.Feedback_Message_Info:before {
    color: #eabd30;
}

a.Feedback_Message_Wrapper_Close {
    color: #000;
}

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;
    font-family: FontAwesome;
}

/* Ajax Loading */
.Feedback_AjaxWait {
    background-color: #fff;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .2);
    color: #cba900;
    font-size: 12px;
}

/* Burguer */
.MenuSlider_IsOpen .LoginInfo {
    font-size: 30px;
}

.Filters_Wrapper {
    background: #fff;
}

.Search_wrapper input[type="text"] {
    background-color: #fff;
    border: 1px solid #ddd;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2);
}

.Search_wrapper input[type="text"]:focus {
    border-color: #ccc;
}

/* Search inside header */
.Header .Search_wrapper input[type="text"] {
    background-color: transparent;
    border: 1px solid rgba(255, 255, 255, .2);
    color: #fff;
}

.Header .Search_wrapper input[type="text"]:focus {
    border: 1px solid rgba(255, 255, 255, .3);
}

.Header .Search_wrapper:after {
    color: #cdcdcd;
}

/*------------------------------------*\
        $7. Login
\*-------------------------------------*/

/* login container **************************/

/* Form **************************/
.Login__Form {
    background-color: transparent;
}

/******* 
    Adoption of the Hi-Fi Mockup 
********/

.LoginButton {    
    border-color: transparent;
    background-color: #EAEAEA;
    color: #FFFFFF;    
    font-family: Roboto;    
    font-size: 16px;    
    font-weight: bold;    
}

/* Button Look and Feel */

a.Button {
    background-color: #FFFFFF;
    border: 1px solid #EAEAEA;
    color: #EAEAEA;
}

.Form input.MainButton, 
a.Button.MainButton{
    background-color: #EAEAEA;
    color: #000;
}

.Form input.SecondButton {
    background-color: #FFFFFF;
    color: #7F1183;
}

.Form input.ThirdButton {
    background-color: #FFFFFF;    
    color: #7F1183;
    border: 1px solid #D3DCDF;
}

input.Button.TransparentButton {
    background-color: transparent;
    border: 1px solid rgba(255,255,255,0.2);  
    color: #FFFFFF;
}

input.Button {
    background-color: #EAEAEA;
    border: 1px solid #3C3C3B;
    color: #000;
}   
    
input.Button:focus {
    background-color: #fff;
    border: 1px solid #EAEAEA;
    color: #EAEAEA;
}

.Button.ButtonDefault,
.Button.Is_Default {
    background-color: #3C3C3B;
    border-color: #3C3C3B;
    color: #fff;
}

.desktop .Button.ButtonDefault:hover,
.desktop .Button.Is_Default:hover {
    background-color: #EAEAEA;
    border-color: #3C3C3B;
    color: #000;
}

.Button.ButtonDefault:hover:active,
.Button.Is_Default:hover:active {
    background-color: #fff;
    border-color: #fff;
    color: #EAEAEA;
}

.desktop .Button:hover,
.desktop a.Button:hover {
    background-color: #3C3C3B;
    color: #FFFFFF;
}

.Button:hover:active,
a.Button:hover:active {
    background-color: #EAEAEA;
    color: #FFFFFF;
}

.Form label {
    color: #000;    
    font-family: Roboto;    
    font-size: 14px;    
}

.Form input {
    border: 1px solid #D3DCDF;       
    background-color: #FFFFFF;    
    box-shadow: inset 0 1px 2px 0 rgba(0,0,0,0.3);
}

/* Notification */
.HeaderNotification {
    background-color: #EAEAEA;
    color: #FFFFFF;    
    font-family: Roboto;    
    font-size: 20px;  
}

/* Receipt ReceiptValidationMessage */
.ValidationMessage {
    color: #b10e1e;
}

.errorSummary {
    border: 4px solid #b10e1e;
}

/* Change Link color of the editable table (need to apply the EditableTableLink class to the Editable table for it to work) */
.EditableTableLink a{
    color: #b39501;   
}

.Menu_DropDownPanel {
    background-color: #EAEAEA;
}

div.Menu_DropDownPanel a, div.Menu_DropDownPanel a:link, div.Menu_DropDownPanel a:visited{
    color: #000;
}

/* Icons */
.fa-cog {
    color: #000;
}


/* Blue badge customisation */

.open .AccordionVertical__header {
    background-color: #EAEAEA;
    color: #FFF;
}

.Alert {
    background-color: lightgrey;
}

.Alert .fa {
    font-size: 5em;
}

.Bold {
    font-weight: 600;
}

.CrossList li:before {
  color:red;
  font-size: 20px;
  font-weight: bolder;
}

.CircleIcon {
    background-color:grey;
    font-weight: 600;
}

.ConfirmationTile {
    background-color: lightgrey;
}

.confirmationRow {
    border-bottom: 1px solid #bfc1c3;
}

.confirmationRow:first-child {
    border-top: 1px solid #bfc1c3;
}

.confirmationTag {
    font-weight: 600;
    background-color: grey;
    color: #ffffff;
}

.ExampleImage {
    width:100%;
    max-width: 300px;
    margin: 0 auto;
}

h2 {
    font-weight: normal;
}

.hintText {
    color:#6f777b;
}

.TickList li:before {
  color:green;
  font-size: 20px;
  font-weight: bolder;
}

.Tile {
    background-color: lightgrey; 
}

.required {
    background-color: red;
}

/* WASTE STYLING */

.WizardStep.ActiveStep {
    background-color: #3C3C3B;
    background: #3C3C3B;
}

.WizardStep.ActiveStep:after {
    border-top-color: #3C3C3B;
    border-right-color: #3C3C3B; 
}

.WizardStep.ActiveStep:before{
    border-top-color: #3C3C3B;
    border-bottom-color: #3C3C3B; 
}

.WizardStep.Past {
    background-color: #3C3C3B;
    background: #3C3C3B;
}

.WizardStep.Past:after {
    border-top-color: #3C3C3B;
    border-right-color: #3C3C3B; 
}

.DarkPurple {
    background-color: #3C3C3B;
}