﻿@import url("/WebPatterns/Theme.Patterns_SilkUI.css?3356");

/*
    
    To override a style copy and paste it to 
    the application theme and then modify it

    File: LiverpoolTheme

    1. General Properties
    2. Structure
    3. Forms
    4. Built-in widgets
    5. RichWidgets
    6. Login
    7. Theme Grid
    0. Studio Preview
    
*/

/* vietnamese */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: local('Nunito Regular'), local('Nunito-Regular'), url(https://fonts.gstatic.com/s/nunito/v9/4fsTWUM100DESRCrYMRNTfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
  unicode-range: U+0102-0103, U+0110-0111, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: local('Nunito Regular'), local('Nunito-Regular'), url(https://fonts.gstatic.com/s/nunito/v9/qEjAkCC_I8-NsX6aYiQHCfesZW2xOQ-xsNqO47m55DA.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 400;
  src: local('Nunito Regular'), local('Nunito-Regular'), url(https://fonts.gstatic.com/s/nunito/v9/cSNs3NwpEgPVRQzvkh3NeQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2212, U+2215;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Regular.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Regular.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Regular.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Regular.svg#Open-Sans') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Bold.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Bold.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Bold.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Bold.svg#Open-Sans') format('svg');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Italic.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Italic.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Italic.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Italic.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Italic.svg#Open-Sans') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Semibold.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Semibold.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Semibold.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Semibold.svg#Open-Sans') format('svg');
    font-weight: 600;
    font-style: normal;
}

/* Font OpenSans classes */

.OpenSans_Regular {font-family: 'Open-Sans', Meiryo, sans-serif;font-weight: 400;}
.OpenSans_Bold {font-family: 'Open-Sans', Meiryo, sans-serif;font-weight: 700;}
.OpenSans_Italic {font-family: 'Open-Sans', Meiryo, sans-serif;font-style: italic;}
.OpenSans_Semibold {font-family: 'Open-Sans', Meiryo, sans-serif;font-weight: 600;}
/*------------------------------------*\
        $1. General Properties
\*-------------------------------------*/

body {background: #ececec;
    -webkit-tap-highlight-color: rgba(0,0,0,0);}
html,
body,
form,
.Page {
    height: 100%;
}

html,  a, fieldset, button, select, optgroup, option {
    font-family: 'Open-Sans', Meiryo, sans-serif;
}

body,
select,
textarea,
input {
    color: #333;
    font-size: 14px;
    font-weight: normal;
    line-height: 1.43;
}
body,
select,
textarea,
input,
.Heading1,
.Heading2,
.Heading3,
.Heading4 {
    font-family: 'Nunito', sans-serif;
    color: rgba(0, 0, 0, 1);
}

a,
a:link,
a:visited {
    color: rgba(0, 164, 154, 1);
    -webkit-transition: color .2s ease-in;
            transition: color .2s ease-in;
    font-weight: bold;
}

/*------------------------------------*\
              $2. Structure
\*-------------------------------------*/

/* Header **************************/
.Header {
    background-color: rgba(255, 255, 255, 1);
    color: rgba(142, 1, 43, 1);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 20;
     /* avoid adorners overlapping header */
}
.Header img {
    vertical-align: middle;
}
.Header_RightSection {
    float: right;
    height: 50px;
    line-height: 50px;
    width: 40px;
}

/* Button Menu **************************/
a.Header_ButtonMenu {
    color: #fff;
    display: none;
    font-size: 20px;
}

.tablet a.Header_ButtonMenu,
.phone a.Header_ButtonMenu {
    display: block;
}

/* APP Title **************************/
.Application_Title {
    color: white;
    font-size: 16px;
    letter-spacing: 1px;
    line-height: 50px;
    overflow: hidden;
    padding-left: 3px;
    padding-right: 10px;
    text-decoration: none;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

/* on tablet and phone **************************/
.tablet .Application_Title,
.phone .Application_Title {
    padding: 0;
}

.Application_Title a,
.Application_Title a:link,
.Application_Title a:visited,
.Application_Title a:hover {
    color: rgba(142, 1, 43, 1);
    font-size: 16px;
    font-weight: normal;
    letter-spacing: 1px;
    padding-right: 10px;
    text-decoration: none;
}

.Application_Title img {
    max-height: 48px;
    padding-bottom: 4px;
}

/* User info **************************/
.Login_Info,
.AppSwitcherContainer,
a.Login_Info_Username,
a.Login_Info_Username:link,
a.Login_Info_Username:visited {
    color: #fff;
    font-size: 100%;
    font-weight: normal;
    margin-right: 10px;
}

.Login_Info {
    float: right;
    padding: 15px 0;
}

.Login_Info_Logout {
    font-size: 0;
}

.Login_Info_Logout:before,
.Login_Info_Username:before,
.AppSwitcherContainer:before,
.AppSwitcherLink[disabled="disabled"]:before {
    color: #fff;
    font-family: FontAwesome;
    font-size: 14px;
    margin-right: 5px;
}

.Login_Info_Username:before {
    content: "\f007"; /* fa-user at http://fortawesome.github.io/Font-Awesome/icons/ */
}

.Login_Info_Logout:before {
    content: "\f011"; /* fa-power-off at http://fortawesome.github.io/Font-Awesome/icons/ */
    margin-right: 0;
}

/* on tablet and phone **************************/
.tablet .Login_Info_Logout:before,
.phone .Login_Info_Logout:before {
    font-size: 20px;
}

/* 
    *** Menu structure ***
    
    div.Header_Menu
    - div.Application_Menu
    - - div.Menu_TopMenus
    - - - div.Menu_DropDownButton
    - - - - div.Menu_TopMenu
    - - - - - sapn.Menu_DropDownArrow
    - - - - div.Menu_DropDownPanel
    - - - - - div.Menu_SubItemsPlaceholder
    - - - - - - a.Menu_SubMenuItem
    
*/

/* Menu **************************/
.Header_Menu,
.Application_Menu {
    background-color: rgba(255, 255, 255, 1);
    box-shadow: 0 -2px 0 0 rgba(0, 0, 0, .25) inset;
    white-space: nowrap;
    height: 30px;
    margin-top: 10px;
}

.ie8 .Header_Menu {
    border-bottom: 2px solid rgba(142, 1, 43, 1);
}

/* Application_Menu **************************/
.Application_Menu a,
.Application_Menu a:link,
.Application_Menu a:visited {
    border-color: rgba(0, 0, 0, .15);
}

.tablet .Application_Menu a,
.phone .Application_Menu a,
.tablet .Application_Menu a:link,
.phone .Application_Menu a:link,
.phone .Application_Menu a:visited,
.phone .Application_Menu a:visited {
    border: 0;
    border-bottom: 1px solid #63001E;
    box-sizing: border-box;
    display: inline-block;
    width: 100%;
}

.tablet .Application_Menu,
.phone .Application_Menu {
    bottom: 0;
    box-shadow: 0 3px 5px #888;
    display: block;
    height: auto;
    overflow: auto;
    position: fixed;
    right: -270px;
    top: 50px;
    /* Enable hardware acceleration */
    -webkit-transform: translateZ(0);
        -ms-transform: translateZ(0);
            transform: translateZ(0);
    /* Animate the menu when opening and closing */
    -webkit-transition: all .3s ease-out;
            transition: all .3s ease-out;
    width: 260px;
    /* reduce animation flickering */

    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    -webkit-perspective: 1000;
            perspective: 1000;
}


/* Menu_TopMenu **************************/
.tablet .Menu_TopMenus,
.phone .Menu_TopMenus {
    width: 100%;
}

/* .Menu_DropDownButton **************************/
.tablet .Application_Menu .Menu_DropDownButton,
.phone .Application_Menu .Menu_DropDownButton {
    display: block;
    position: relative;
}

.Application_Menu div.Menu_DropDownPanel a,
.Application_Menu div.Menu_DropDownPanel a:link,
.Application_Menu div.Menu_DropDownPanel a:visited {
    border-bottom: solid 1px rgb(132,177,84);
}

.Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: #fff;
    position: absolute;
    right: 8px;
    top: 50%;
}

/* .Application_Menu **************************/
.tablet.active .Application_Menu,
.phone.active .Application_Menu {
    right: 0;
}

/* .Menu_TopMenu **************************/
.Menu_TopMenu {
    height: 21px;
    position: relative;
}

.tablet .Menu_TopMenu,
.phone .Menu_TopMenu {
    border: 0;
    margin: 0;
    padding: 0;
    width: 100%;
}

.Menu_TopMenu a:link,
.Menu_TopMenu a:visited,
.Menu_TopMenu a {
     background-color:  rgba(255, 255, 255, 1);
    font-family: 'Nunito', sans-serif;
    color: rgba(34, 91, 107, 1);
    display: inline-block;
    padding: 4px 20px;
    text-decoration: none;
    text-shadow: none;
}
.Menu_TopMenu a:hover,
.Menu_TopMenu:hover {
    background-color: #cbe8e5;
    color:rgba(255, 255, 255, 1) ;
    box-shadow: 0 -1px 0 0 rgba(0, 0, 0, .25) inset;
}

.Menu_TopMenuActive,
.Menu_DropDownButton.open .Menu_TopMenu {
    background-color: #a90002;
    border-bottom: none;
    box-shadow: 0 -2px 0 0 rgba(0, 0, 0, .25) inset;
}

.Menu_TopMenuActive a:link,
.Menu_TopMenuActive a:visited,
a.Menu_SubMenuItemActive:link,
a.Menu_SubMenuItemActive:visited,
a.Menu_SubMenuItem:hover {
    color: white;
}

/* .Menu_DropDownPanel */
.Menu_DropDownPanel {
    background-color: rgba(132, 177, 84, 1);
    border: none;
    box-shadow: none;
    margin-top: 0;
}

.Menu_DropDownPanel a,
.Menu_DropDownPanel a:link,
.Menu_DropDownPanel a:visited {
    border-bottom: solid 1px rgba(132, 177, 84, 1);
    display: block;
    height: auto;
}

.tablet .Menu_DropDownPanel,
.phone .Menu_DropDownPanel {
    background-color: #999;
    border: 0;
    box-shadow: none;
    margin: 0;
    padding: 0;
    position: static;
}

.phone .Menu_DropDownArrow,
.tablet .Menu_DropDownArrow {
    position: absolute;
    right: 14px;
    top: 21px;
}

/* Menu_SubMenuItem */
.Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownPanel a.Menu_SubMenuItem:link,
.Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    background-color: #ca081e;
    border-bottom: 1px solid rgba(0, 0, 0, .15);
    color: #fff;
    display: block;
    padding: 3px 30px;
}

.ie8 .Menu_DropDownPanel a.Menu_SubMenuItem,
.ie8 .Menu_DropDownPanel a.Menu_SubMenuItem:link,
.ie8 .Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    border-bottom: 1px solid #a90002;
}

.Menu_DropDownPanel a.Menu_SubMenuItem:hover,
.Menu_DropDownPanel a.Menu_SubMenuItem.Menu_SubMenuItemActive {
    background-color: #a90002;
}

/* Page Title **************************/
.Title {
    margin: 0;    
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 70%;
}

.Title.Heading1 {
    line-height: 20px;
    margin-top: 0;
}

.phone.portrait .Title.Heading1 {
    border: none;
    display: block;
    height: 40px;
    margin-bottom: 10px;
    padding: 0;
    position: relative;
    text-align: center;
    width: 100%;
}

.Title_Section {
    margin-top: 45px;
    position: relative;
}

/* Actions page **************************/
.Actions {
    font-size: 16px;
    line-height: 34px;
    text-align: right;
    width: 30%;
}

.phone.portrait .Actions {
    margin-bottom: 0;
    padding: 0;
    position: relative;
    text-align: center;
    width: 100%;
}

.phone.portrait .Actions .Button {
    margin: 0;
    margin-bottom: 10px;
    width: 100%;
}

.Actions a {
    margin-left: 20px;
}

.Actions a:first-child {
    margin-left: 0;
}

/* Scaffolding generated actions **************************/
a.ActionAdd,
a.ActionEdit,
a.ActionChange,
a.ActionDelete {
    background-color: rgba(142, 1, 43, 1);
    color: #FFF;
    border: 1px solid rgba(142, 1, 43, 1);
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    height: 32px;
    line-height: 30px;
    margin-left: 10px;
    padding: 0 15px;
    text-shadow: none;
}

a.ActionAdd:hover,
a.ActionEdit:hover,
a.ActionChange:hover,
a.ActionDelete:hover {
    box-shadow: 0 0 1px 0 rgba(50, 50, 50, .75);
    text-decoration: none;
    background-color: #63001E;
    border-color: #63001E;
}

a.ActionAdd:active,
a.ActionEdit:active,
a.ActionChange:active,
a.ActionDelete:active {
    box-shadow: 0 0 20px 5px rgba(0, 0, 0, .25) inset;
}

a[disabled="disabled"].ActionAdd,
a[disabled="disabled"].ActionEdit,
a[disabled="disabled"].ActionDelete,
a[disabled="disabled"].ActionChange {
    background-color: #ccc;
    border: 1px solid #ccc;
    box-shadow: none;
}

a[disabled="disabled"].ActionAdd:hover,
a[disabled="disabled"].ActionEdit:hover,
a[disabled="disabled"].ActionDelete:hover,
a[disabled="disabled"].ActionChange:hover {
    color: #fff;
}

/* To work with old applications **************************/
.Title_Links {
    font-size: 14px;
    margin-top: 5px;
}

/* content **************************/
.Content {
    background: #efefef;
    margin-bottom: -50px;
    min-height: 100%;
    padding-top: 50px;
}

/* min width for desktop */
.desktop .Content.ThemeGrid_Wrapper {
    min-width: 980px;
}

/* phone and tablet **************************/
.phone .Content,
.tablet .Content {
    padding-top: 50px;
}

/* MainContent **************************/
.MainContent {
    background: #efefef;
    margin-top: 30px;
    min-height: 100%;
    padding-bottom: 80px;

     /* push the footer down on preview */
}

.Page.active .MainContent {
    pointer-events: none;
}

/* Footer **************************/
.Footer {
    background: rgba(132, 177, 84, 1);
    color: #999;
    font-size: 12px;
    min-height: 50px;
    padding: 10px 0;
    position: absolute;
    text-align: center;
    width: 100%;
}
.Footer img {
    padding-bottom: 3px;
}

/* Popup editor  **************************/
.MainPopup {
    background: #fff;
    display: table-cell;
    padding: 14px 16px;
    vertical-align: top;
}

.MainPopup .Button.ThemeGrid_MarginGutter {
    margin-left: 10px;
}

/* limit width **************************/
html .ThemeGrid_Container {
    max-width: 1240px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 10px;
    padding-right: 10px;
}

.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) */
}



/*------------------------------------*\
              $3. Forms
\*-------------------------------------*/

textarea,
select,
input {
    border-radius: 0;
    box-shadow: none; /*inset 0 2px 2px rgba(0, 0, 0, .075);*/
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    /*font-size: 16px;*/
}

html input {
    height: 34px;
}

/* radio and checkbox override rules **************************/
html input[type="radio"],
html input[type="checkbox"] {
    background-color: transparent;
    box-shadow: none !important;
    height: 20px;
    border-collapse: separate;
}
input[type="checkbox"]:after {
    border: 3px solid #111;
    border-right: 0;
    border-top: 0;
    height: 5px;
    left: 20%;
    top: 23%;
    width: 11px;
}

/* Checkboxes and Radio Buttons **************************/
input[type="radio"]:before,
input[type="checkbox"]:before {
    box-shadow: none;
}

input[type="checkbox"]:disabled:before {
    box-shadow: none;
    background-color: #e9e9e9;
}

/* force padding to center vertically on Firefox **************************/
select {
    height: 34px;
    padding: 4px 8px;
}

input[type="radio"]:focus,
input[type="checkbox"]:focus {
    border: 0;
}

textarea:focus {
    border: 1px solid #949494;
}

.Form:not(.ReadOnly) {
    cursor: pointer;
}

select.ReadOnly {
    cursor: pointer;
}

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"],
.Form input.ReadOnly,
.Form textarea.ReadOnly,
.Form select.ReadOnly {
    /*font-size: 16px;*/
    line-height: 28px;
}

textarea,
select {
    line-height: 20px;
}

.ie8 select {
    padding: 5px 6px;
}

.Form input[type="text"],
.Form input[type="password"],
.Form input[type="datetime"],
.Form input[type="datetime-local"],
.Form input[type="date"],
.Form input[type="month"],
.Form input[type="time"],
.Form input[type="week"],
.Form input[type="number"],
.Form input[type="email"],
.Form input[type="url"],
.Form input[type="search"],
.Form input[type="tel"],
.Form input[type="color"],
.Form select,
.Form textarea {
    box-shadow: none; /*inset 0 2px 2px rgba(0, 0, 0, .075);*/
}

.Form input.ReadOnly,
.Form textarea.ReadOnly,
.Form select.ReadOnly,
.Form textarea.ReadOnly[readonly="readonly"],
.Form input.ReadOnly[readonly="readonly"],
textarea[readonly="readonly"],
input[readonly="readonly"] {
    cursor: text;
}



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 select[readonly="readonly"].ReadOnly:not(.Not_Valid):focus,
.Form select[disabled="disabled"].ReadOnly:not(.Not_Valid):focus {
    border: 1px solid #ccc;
}

.Form textarea[disabled="disabled"]:focus,
.Form textarea[readonly="readonly"]:focus,
textarea[disabled="disabled"]:focus,
textarea[readonly="readonly"]:focus {
    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;
}

/*------------------------------------*\
              $4. Buit-in widgets
\*-------------------------------------*/

/* Table pavigation **************************/
a.ListNavigation_PageNumber:link,
span.ListNavigation_CurrentPageNumber,
span.ListNavigation_Ellipsis,
a.ListNavigation_Previous:link,
a.ListNavigation_Next:link {
    background: #fcfcfc;
    border: 1px solid #ccc;
    color: #2e3136;
    display: inline-block;
    filter: none;
    font-size: 14px;
    font-weight: normal;
    padding: 5px 20px;
    /* Add Touch States to Your Buttons: Remove the tap highlight color, we want to use active state css instead */
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    -webkit-tap-highlight-color: transparent;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-appearance: none;
       -moz-appearance: none;
}

a.ListNavigation_PageNumber:link:hover,
span.ListNavigation_Ellipsis:hover,
a.ListNavigation_Previous:link:hover,
a.ListNavigation_Next:link:hover {
    background-color: #e6e6e6;
    border-color: #4c4c4c;
    box-shadow: 0 0 1px 0 rgba(50, 50, 50, .75);
    text-decoration: none;
}

span.ListNavigation_CurrentPageNumber {
    background-color: #e6e6e6;
    border: 1px solid #4c4c4c;
}

/* TableRecords **************************/
.TableRecords_Header {
    border-bottom: 1px solid #d0d0d0;
    color: #2e3136;
    font-size: 14px;
    font-weight: bold;
    padding: 5px 0 10px 10px;
}

.TableRecords > tbody > tr:hover {
    background: #fafcff;
}

.TableRecords {
    background: none repeat scroll 0 0 #fff;
    border-color: #d0d0d0;
    border-style: solid;
    border-width: 1px;
    padding: 5px 0 0;
}

.TableRecords_OddLine,
.TableRecords_EvenLine {
    border-bottom: none;
}

.TableRecords_EvenLine {
    background-color: #f4f4f4;
}

.TableRecords_OddLine:first-child,
.TableRecords_EvenLine:first-child,
.TableRecords_Header:first-child {
    padding-left: 20px;
}

/* let a tablerecords act like a simple list */
.TableRecords.Simple {border:none;}
.desktop .TableRecords.Simple > tbody > tr:hover,
.desktop .TableRecords.Simple > tbody > tr:hover td {background: #fff;}
.TableRecords.Simple .TableRecords_EvenLine {background: none;}

.NoWrap {
    white-space: nowrap;
}

/* .EditableTable **************************/
.EditableTable thead td {
    color: #2e3136;
    font-weight: bold;
}

.EditableTable {
    border: 1px solid #d0d0d0;
}
.EditableTable thead td {
    border-bottom: 1px solid #d0d0d0;
}

.EditableTable tr:nth-child(even) {
    background: #f4f4f4;
}

td.RowWithAddAction {
    background: none repeat scroll 0 0 #fff;
    border-bottom: none;
    padding: 0;
}

td.RowWithAddAction a {
    padding: 10px 0 10px 22px;
}

td.EditRecord_Caption:first-child + .EditRecord_Value {
    padding-right: 20px;
}



/*------------------------------------*\
              $5. RichWidgets
\*-------------------------------------*/

/* Feedback Message **************************/
.Page.phone div.Feedback_Message_Wrapper,
.Page.tablet div.Feedback_Message_Wrapper {
    margin-top: 52px;
}

div.Feedback_Message_Wrapper {
    margin-top: 150px;
}

.Feedback_Message_Error,
.Feedback_Message_Success,
.Feedback_Message_Warning,
.Feedback_Message_Info {
    border: none;
    border-radius: 0 !important;
    border-radius: 3px;
    box-shadow: none;
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    color: white !important;
    max-width: 1200px;
    padding: 12px 50px 12px 28px;
    width: 100%;
}

div.Feedback_Message_Error,
div.Feedback_Message_Success,
div.Feedback_Message_Warning,
div.Feedback_Message_Info {
    min-width: 100px;
}

a.Feedback_Message_Wrapper_Close {
    font-size: 19px;
    top: 5px;
}

.tablet a.Feedback_Message_Wrapper_Close,
.phone a.Feedback_Message_Wrapper_Close {
    pointer-events: none;
}

.Feedback_Message_Wrapper_Close:after {
    color: white; /* IE8 */
    color: rgba(255, 255, 255, .5);
}

.Feedback_Message_Error {
    background-color: #bb5858;
}

.Feedback_Message_Error:before,
.Feedback_Message_Warning:before,
.Feedback_Message_Success:before,
.Feedback_Message_Info:before {
    display: none;
}

.Feedback_Message_Error:before {content: "";}
.Feedback_Message_Success:before {content: "\f05d";}
.Feedback_Message_Info:before {content: "\f05a";}
.Feedback_Message_Warning:before {content: "\f06a";}
.Feedback_Message_Success {background-color: #acc965;color: #333;}
.Feedback_Message_Warning {background-color: #f2c94e;color: #333;}
.Feedback_Message_Info {background-color: #aabdcf;color: #333;}

/* Feedback messages **************************/
.Feedback_Message_Error:before,
.Feedback_Message_Warning:before,
.Feedback_Message_Success:before,
.Feedback_Message_Info:before {display: none;}

/* Ajax Loading **************************/
.Feedback_AjaxWait {
    background-color: white;
    border-radius: 0;
    box-shadow: 1px 2px 8px 0 rgba(73, 70, 70, .48);
    color: #e73d25;
    font-size: 12px;
    height: 70px;
    padding: 0 15px;
}
.Feedback_AjaxWait .Loader {
    background: url(/UTZBaseTheme/img/loading_red.gif?6223) no-repeat;
    height: 11px;
    margin-bottom: 15px;
    margin-top: 20px;
    position: relative;
    text-indent: -9999em;
    width: 16px;
}

/*------------------------------------*\
              $6. Login
\*-------------------------------------*/
.Login_Title {
    color: #fff;
    font-size: 44px;
    font-weight: normal;
    text-shadow: 0 2px 2px rgba(122, 122, 122, .7);
}

.Login_Box {
    position: relative;
    z-index: 1;
    top: 0;
    left:0;
    width: 600px;
    margin-top: 20px;
    margin-left: calc(50vw - 300px);
    
}

.Login_Text {
    color: #333;
    font-size: 12px;
    font-weight: bold;
}

.Login_background + span .Feedback_Message_Wrapper {
    left: 0;
    margin-top: 0;
}

.Login_background + span .Feedback_Message_Wrapper span + .Feedback_Message_Error {
    max-width: none;
    min-width: 100%;
}

.Login_background + span .Feedback_Message_Wrapper span + .Feedback_Message_Error .Feedback_Message_Wrapper_Close:after {
    color: #fff;
    line-height: 30px;
}

.Login__Form .Button {
    margin: 0;
    max-width: max-content;
}

.Login__Footer {
    background-color: #fff;
    text-align: center;
    padding: 10px;
    border-top: solid 1px #ccc;
}
/* Responsive Context **************************/
.tablet .Login_Info_Username {
    margin-right: 10px;
}

.phone .Login_Info_Username {
    display: none;
}

.tablet .Login_Info_Logout,
.phone .Login_Info_Logout {
    bottom: 10px;
    position: fixed;
    right: -260px;
    z-index: 1;
}

.tablet.active .Login_Info_Logout,
.phone.active .Login_Info_Logout {
    right: 15px;
}

/*------------------------------------*\
              $7. UTZ Custom
\*-------------------------------------*/

/* NavigationBar **************************/
.NavigationBar a,
.NavigationBar a:link,
.NavigationBar a:visited {
    color: #c7c7c7;
}
.NavigationBar a.Active {
    color: #3e5154;
}
.NavigationBar a:after,
.NavigationBar a:link:after {
    background-color: #c7c7c7;
}
.NavigationBar a.Active:after {
    background-color: rgba(142, 1, 43, 1); 
}
.NavigationBar a.Active:not(.IE8):before {
    border-bottom: 4px solid rgba(142, 1, 43, 1);
}
.desktop .NavigationBar a:hover, 
.desktop .NavigationBar a:link:hover {
    color: #3e5154;
}
.desktop .NavigationBar a:hover:after, 
.desktop .NavigationBar a:link:hover:after {
    background-color: rgba(142, 1, 43, 1);
}
.NavigationBar.Vertical a.Active,
.NavigationBar.Vertical a:link.Active {
  border-color: rgba(142, 1, 43, 1);
}
.NavigationBar.Vertical a.Active:not(.IE8):before {
    border-left: 4px solid rgba(142, 1, 43, 1);
}
.desktop .NavigationBar.Vertical a:hover,
.desktop .NavigationBar.Vertical a:link:hover {;
    border-color: rgba(142, 1, 43, 1);
}
.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: rgba(142, 1, 43, 1);
}


/* WizardStep **************************/
.WizardStep {
    background-color: #C2C2C2;
}
.WizardStep:before {
    border-top-color: #C2C2C2;
    border-bottom-color: #C2C2C2;
}
.WizardStep:after {
    border-top: 1px solid #EFEFEF;
    border-right: 1px solid #EFEFEF;
}
.WizardStep a,
.WizardStep a:link,
.WizardStep a:visited {
    color: #FFF;
}
.WizardStep.ActiveStep {
    background: rgba(132, 177, 84, 1);
    font-weight: bold;
}
.WizardStep.ActiveStep:before {
    border-top-color: rgba(132, 177, 84, 1);
    border-bottom-color: rgba(132, 177, 84, 1);
}
.WizardStep.Past {
    background-color: rgba(132, 177, 84, 1);
}
.WizardStep.Past:before {
    border-color: rgba(132, 177, 84, 1);
}
.WizardStep.Past:after {
    border-top: 1px solid rgba(132, 177, 84, 1);
    border-right: 1px solid rgba(132, 177, 84, 1);
}

/* Button **************************/
.Button:first-child {margin-left:0;}
.Button,
a.Button {
   background-color: rgb(34,91,107);
   border: 1px solid rgb(34,91,107);
   color: white;
}
.Button:visited,
.Button:link {
    color: white;
}
.Button.ButtonDefault,
.Button.Is_Default {
    background-color: rgba(132, 177, 84, 1);
    color: #FFF;
    border-color: rgba(132, 177, 84, 1);
    border: 1px solid rgba(132, 177, 84, 1);
}
.desktop .Button.ButtonDefault:hover,
.Button.Is_Default:hover {
    background-color: rgb(0,164,154);
    border-color: rgb(0,164,154);
}
.Button[disabled] {background: #eeeeee;color: #ccc;border-color: #eeeeee;}
.Button.Cancel,a.ActionDelete {border-color: #999;color: #4c4c4c;}
.Button.Neutral {background-color:  #FCFCFC;}
.Button.Link {color: rgba(142, 1, 43, 1);}
.desktop .Button:hover,
.desktop a.Button:hover {background-color: rgb(0,164,154);border-color: rgb(0,164,154);}
.desktop .Button[disabled]:hover {color: #FF0000;}
.desktop .Button.Cancel:hover {background-color:  #e0e1e3;border-color: #999999;color: #4c4c4c;}
.desktop .Button.Success:hover {background-color: #acc469;}
.desktop .Button.Danger:hover {background-color: #9e5141;border-color: #9e5141;}
.desktop .Button.Link:hover {border-color: rgba(142, 1, 43, 1);color: rgba(142, 1, 43, 1);}
/***********************/



/* ********************************************* */
/* ********************************************* */
/* ** below here we need to merge with above **** */
/* ********************************************* */
/* ********************************************* */
.Login_Info,
.AppSwitcherContainer,
a.Login_Info_Username,
a.Login_Info_Username:link,
a.Login_Info_Username:visited {
    color: rgba(34, 91, 107, 1);
}

.Login_Info_Logout:before,
.Login_Info_Username:before,
.AppSwitcherContainer:before,
.AppSwitcherLink[disabled='disabled']:before {
    color: rgba(0, 164, 154, 1);
}

.Menu_DropDownPanel a,
.Menu_DropDownPanel a:link,
.Menu_DropDownPanel a:visited {
    color: rgba(255, 255, 255, 1);
}
.Menu_TopMenu .Menu_DropDownArrow {
    border-top-color: rgba(255, 255, 255, 1);
}
.Menu_TopMenuActive,
.Menu_TopMenuActive a:link,
.Menu_DropDownButton.open .Menu_TopMenu  {
    background-color: rgba(142, 1, 43, 1);
    color: rgba(255, 255, 255, 1);
}

.Menu_TopMenuActive a:visited,
a.Menu_SubMenuItemActive:link,
a.Menu_SubMenuItemActive:visited,
a.Menu_SubMenuItem:hover {
    color: rgba(255, 255, 255, 1);
}

.tablet .MenuSlider_Toggler, 
.phone .MenuSlider_Toggler {
    color: rgba(142, 1, 43, 1);
}

.Menu_DropDownPanel {
    background-color: rgba(132, 177, 84, 1);
}

.Menu_DropDownPanel a.Menu_SubMenuItem:hover {
    background-color: #cbe8e5;
}

.Menu_DropDownPanel a.Menu_SubMenuItem,
.Menu_DropDownPanel a.Menu_SubMenuItem:link,
.Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    border-color: #cbe8e5;
    color: rgba(255, 255, 255, 1);
    background-color: rgba(142, 1, 43, 1);
}

.ie8 .Menu_DropDownPanel a.Menu_SubMenuItem,
.ie8 .Menu_DropDownPanel a.Menu_SubMenuItem:link,
.ie8 .Menu_DropDownPanel a.Menu_SubMenuItem:visited {
    border-bottom: #cbe8e5;
}

.Menu_DropDownPanel a.Menu_SubMenuItem:hover {
    background-color: #cbe8e5;
}

.Feedback_AjaxWait {
    color: rgba(162, 55, 83, 1);
}

.Login_background + span .Feedback_Message_Wrapper span + .Feedback_Message_Error .Feedback_Message_Wrapper_Close:after {
    color: rgba(142, 1, 43, 1);
}

.DropdownMenu .PH > a:hover {
   color: rgba(210, 158, 172, 1);
}

.IconBadge_number {
    background-color: rgba(162, 55, 83, 1);
}

.SectionIndex.vertical a.active,
.SectionIndex.vertical a:hover {
    border-left-color: rgba(210, 158, 172, 1);
}

.SectionIndex a.active,
.SectionIndex a:hover {
    border-bottom: 2px solid rgba(210, 158, 172, 1);
    color: rgba(210, 158, 172, 1);
}

div.calendarPattern tr.daynames {
    border-top: 2px solid rgba(142, 1, 43, 1);
}

div.calendarPattern thead .button {
    color: rgba(142, 1, 43, 1);
}

div.calendarPattern tbody td.selected {
    background:  rgba(142, 1, 43, 1);
}

.DropdownMenu .PH > a:hover {
   color: #63001E;
}

.SectionIndex.vertical a.active,
.SectionIndex.vertical a:hover {
    border-left-color: #63001E;
}

.SectionIndex a.active,
.SectionIndex a:hover {
    border-bottom: 2px solid #63001E;
    color: #63001E;
}

.MainContent {
  /*  background: #FFFFFF;*/
    margin-top: 30px;
    min-height: 100%;
    padding-bottom: 80px;
    border-width:2px;
    border-color: rgba(142, 1, 43, 1);
     /* push the footer down on preview */
}

a.Header_ButtonMenu {
    color: #FFF;
}

.tablet .Menu_DropDownPanel,    
.phone .Menu_DropDownPanel {
    background-color: #999;
}
.TableRecords_Header {
    color: #2e3136;
    border-bottom: 1px solid #d0d0d0;
}

.TableRecords > tbody > tr:hover {
    background: #FAFCFF;
}

.TableRecords {
    background: none repeat scroll 0 0 #FFF;
    border-color: #d0d0d0;
}

.TableRecords_EvenLine {
    background-color: #F4F4F4;
}

.EditableTable thead td {
    color: #2e3136;
}

.EditableTable {
    border: 1px solid #d0d0d0;
}
.EditableTable thead td {
    border-bottom: 1px solid #d0d0d0;
}

.EditableTable tr:nth-child(even) {
    background: #F4F4F4;
}

td.RowWithAddAction {
    background: none repeat scroll 0 0 #FFF;
}

.Login_Title {
    color:  #fff;
}

.Login_Text {
    color: #333;
}

.Login_background + span .Feedback_Message_Wrapper span + .Feedback_Message_Error .Feedback_Message_Wrapper_Close:after {
    color: #fff;
}

.Login_Footer {
   color: #999;
}

.Accordion {
    background-color: #fff;
    border: 1px solid #d0d0d0;
}

.Post {
    background: none repeat scroll 0 0 #fff;
    padding: 5px;
    border: 1px solid #d0d0d0;
}

.tooltip_style {
    background-color: #393939;
}

.ButtonGroup_button.Button {
    color: #171717;
    background-color: #FCFCFC;
    border-color: #CCC;
    border-right: 1px solid #CBCBCB;
}

.ButtonGroup_button.Button:hover,
.ButtonGroup_button.Button.active,
.ButtonGroup_button.Button:active {
    border-color: #CBCBCB;
    background: #E6E6E6;
}

.ButtonGroup_button.Button:first-child {
    border-left: 1px solid #CBCBCB;
}

.desktop .ButtonGroup .Button:hover {
    border: 1px solid #CCC;
    background: #E6E6E6;
}
.desktop .ButtonGroup .Button:first-child:hover {
    border: 1px solid #CCC;
}
.desktop .ButtonGroup_button.Button.disabled,
.desktop .ButtonGroup_button.Button.disabled:hover {
    color: #999;
    background-color: #F5F5F5;
}

.desktop .ButtonGroup_button.Button.active,
.tablet .ButtonGroup_button.Button.active,
.phone .ButtonGroup_button.Button.active {
    background: #ccc;
}

.phone .ButtonGroup_button.Button,
.mini.tablet .ButtonGroup_button.Button {
    border-left: 1px solid #CCC;
} 

.DropdownMenu .PH > a {
   color: #A4A4A4;
}

.DropdownMenu .PH > a:hover {
   color: rgba(142, 1, 43, 1);
}

.ButtonDropdown_text,
.ButtonDropdown_icon {
    color: #000;
}

.IconDropdown.open .Button {
    background-color: rgba(34, 91, 107, 1);
    border-color: rgba(34, 91, 107, 1);
}

.IconBadge_number {
    border: 2px solid #F2F2F2;
    background-color: rgba(142, 1, 43, 1);
    text-shadow: 1px 1px rgba(0,0,0,0.5);
}

/* ExcludeFromPickers: Header, Application_Title, Login_Info, AppSwitcherContainer, Login_Info_Username, Login_Info_Logout, AppSwitcherListContainer, 
AppSwitcherList, AppSwitcherLink, AppSwitcherDownArrow, MainContent, Title, Actions, fa-plus, 
Title_Links, Content, Footer, MainPopup, ThemeGrid_MarginGutter, ThemeGrid_Container, OSInlineClear, Bold, Italic, Underline, Text_AlignBaseline, 
Header_Menu, Menu_TopMenus, Menu_TopMenuActive, Menu_TopMenu, Menu_SubMenuItemActive, Menu_SubMenuItem, Menu_DropDownArrow, Menu_DropDownPanel, Button, 
ListNavigation_PageNumber, ListNavigation_CurrentPageNumber, ListNavigation_Ellipsis, ListNavigation_Previous, ListNavigation_Next, ButtonDefault, 
Is_Default, Filters_Wrapper, EditRecord, EditRecord_Caption, EditRecord_Value, EditRecord_Buttons, ShowRecord_Caption, ShowRecord_Value,Te ShowRecord, 
TableRecords_Header, TableRecords, TableRecords_OddLine, TableRecords_EvenLine, TableRecords_BottomNavigation, RecordPicture, RecordPicture_Wrapper, 
InputMandatorySymbol, MandatoryCaption, Prompt, Not_Valid, ValidationMessage, Feedback_Message_Wrapper, Feedback_Message_Error, Feedback_Message_Success, 
Feedback_Message_Warning, Feedback_Message_Info, Feedback_Message_Wrapper_Close, os-internal-Popup, os-internal-ui-dialog, os-internal-ui-dialog-titlebar, 
os-internal-ui-autocomplete, os-internal-ui-state-hover, os-internal-ui-dialog-title, ListNavigation_DisabledNext, ListNavigation_DisabledPrevious, 
Chart_Color1, Chart_Color2, Chart_Color3, Chart_Color4, Chart_Color5, Chart_Color6, Chart_Color7, Chart_Color8, Chart_Color9, Chart_Color10, Responsive, 
ThemeGrid_Wrapper, ThemeGrid_Width1, ThemeGrid_Width2, ThemeGrid_Width3, ThemeGrid_Width4, ThemeGrid_Width5, ThemeGrid_Width6, ThemeGrid_Width7, ThemeGrid_Width8, 
ThemeGrid_Width9, ThemeGrid_Width10, ThemeGrid_Width11, ThemeGrid_Width12, ThemeGrid_Margin1, ThemeGrid_Margin2, ThemeGrid_Margin3, ThemeGrid_Margin4, ThemeGrid_Margin5, 
ThemeGrid_Margin6, ThemeGrid_Margin7, ThemeGrid_Margin8, ThemeGrid_Margin9, ThemeGrid_Margin10, ThemeGrid_Margin11, ThemeGrid_Margin1First, ThemeGrid_Margin2First,
ThemeGrid_Margin3First, ThemeGrid_Margin4First, ThemeGrid_Margin5First, ThemeGrid_Margin6First, ThemeGrid_Margin7First, ThemeGrid_Margin8First, ThemeGrid_Margin9First, 
ThemeGrid_Margin10First, ThemeGrid_Margin11First, Counter_Message, 2, ListNavigation_Wrapper, EPATaskbox_Container, ECT_FeedbackContainer, MenuSlider_IsOpen,
Header_LeftSection, Header_RightSection, Blue, Orange, LightBlue, Violet DarkGray, Feedback_AjaxWait, Gray, Green, MenuSlider_Toggler, OSAutoMarginTop, Red, 
TableRecords_TopNavigation, Tabs_Header, Tabs_TabBody, Tabs_TabOff, Tabs_TabOn, Tabs_Wrapper, Title_Section, White, Application_Menu, Breadcrumbs */




.Responsive div.Feedback_Message_Wrapper {
    margin-top: 35px;
}
