* {
  margin: 0;
  padding: 0;
}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em,
img, ins, kbd, q, samp, small, strong, sub,
sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, figcaption, figure, footer, header,
hgroup, menu, nav, section, summary,
time, mark, audio, video, textarea {
  font-family: "Open Sans", Arial, "Sans-Serif";
  font-size: 100%;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility !important;
}

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em,
img, ins, kbd, q, samp, small, strong, sub,
sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td, article, aside,
canvas, details, figcaption, figure, footer, header,
hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: middle;
}

html, body {
  width: 100%;
  min-width: 100%;
  min-height: 100%;
  font-size: 0.9em;
  background-color: #dedede;
}

body {
  position: relative;
}

a {
  text-decoration: none;
}

ul {
  list-style: none;
}

ul {
  list-style: outside none none;
}

@keyframes animActiveElement {
  from {
    padding: 1px 2px;
    margin: 6px 2px 0px 0px;
  }
  to {
    padding: 3px 2px;
    margin: 2px 2px 0px 0px;
  }
}
@keyframes animAppMenuHeightHomePage {
  0% {
    height: 30px;
  }
  25% {
    height: 33px;
  }
  50% {
    height: 36px;
  }
  75% {
    height: 39px;
  }
  100% {
    height: 43px;
  }
}
@keyframes animAppMenuHeightOtherPage {
  0% {
    height: 43px;
  }
  25% {
    height: 39px;
  }
  50% {
    height: 36px;
  }
  75% {
    height: 33px;
  }
  100% {
    height: 30px;
  }
}
@keyframes animAppMenuPaddingHomePage {
  0% {
    margin-top: 0px;
  }
  25% {
    margin-top: 5px;
  }
  50% {
    margin-top: 9px;
  }
  75% {
    margin-top: 13px;
  }
  100% {
    margin-top: 17px;
  }
}
.phHeaderTODO {
  position: absolute;
  z-index: 1;
  font-size: 17px;
  display: block;
  width: 100%;
  text-align: center;
  height: 40px;
  color: white;
  background: linear-gradient(to bottom, #000000 0%, #565656 100%);
  /* W3C */
}

.phHeaderTODO:hover {
  z-index: 0;
}

.phHeaderTODO span {
  margin: 10px 0px 0px 0px;
  display: block;
}

.phNavigationTODO:hover {
  z-index: 2;
}

/* menu place holders + menu */
.phNavigation {
  position: relative;
  width: 100%;
  height: 40px;
  background: #000000;
  /* Old browsers */
  background: linear-gradient(to bottom, #000 0%, #616161 100%);
  /* W3C */
}

.phNavigation > .phLogo {
  float: left;
  width: 40px;
}

.phLogo > .imgHomeLogo {
  display: block;
  width: 50px;
  height: 40px;
}

.phLogo > .imgHomeLogo img {
  height: 100%;
  padding-left: 5px;
}

.phNavigation > .phMenu {
  float: left;
}

.dynamicMenuSource {
  display: none;
}

.phNavigation > .phModuleMenu {
  float: left;
}

.phBckgrdActMenu {
  float: left;
  margin: 10px 0px 0px 10px;
}

.phNavigation > .phModuleMenu li {
  background-color: #FFEB9C;
}

.phNavigation > .phModuleMenu li a {
  background-color: #FFEB9C;
  color: Black;
}

.uiMenu {
  padding: 0;
  margin: 0;
  list-style-type: none;
  height: 40px;
  z-index: 10000;
  background: #000000;
  /* Old browsers */
  background: linear-gradient(to bottom, #000 0%, #616161 100%);
  /* W3C */
}

.uiMenu li {
  float: left;
}

.uiMenu li a {
  padding: 13px 15px 13px 15px;
  display: block;
  color: #fff;
  text-decoration: none;
  font: 13px Arial, Sans-Serif;
  font-weight: bold;
}

.uiMenu li a:hover {
  color: #fff;
  cursor: pointer;
}

/* Submenu */
.uiMenu ul {
  position: absolute;
  left: -9999px;
  top: -9999px;
  list-style-type: none;
  z-index: 10000;
}

.uiMenu li {
  transition: all 0.1s;
}

.uiMenu li:hover {
  position: relative;
  background: #000;
}

.uiMenu li:hover a {
  color: #fff;
}

.uiMenu li:hover ul {
  left: 0px;
  top: 40px;
  padding: 0px;
  box-shadow: 2px 3px 3px 0px rgba(0, 0, 0, 0.25);
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

.uiMenu li:hover ul li {
  background-color: #000;
}

.uiMenu li:hover ul li a {
  width: 215px;
  padding: 8px 5px;
  text-indent: 10px;
}

.uiMenu li:hover ul li:last-child {
  margin-top: -1px;
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

.uiMenu li:hover ul li.uiMenuSeparator a {
  height: 1px;
  width: 225px;
  padding: 0;
  background-color: #D89000;
  box-sizing: border-box;
}

.uiMenu li:hover ul li a:hover {
  background: #ad6a11;
  color: #fff;
  background: #4286f4;
}

.uiMenu li:hover ul li:last-child a:hover {
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

.phNavigation > .phUserInfo {
  float: right;
}

.phUserInfo > .phUser {
  float: right;
}

.phUserInfo > .icoLogout {
  float: right;
}

.icoLogout > a {
  display: block;
  width: 40px;
  height: 40px;
  background: url("../../images/ux/icoLogout.png") no-repeat;
}

.icoLogout > a:hover {
  background: #dd9e00 url("../../images/ux/icoLogoutHover.png") no-repeat;
}

.phUser > ul {
  margin: 0;
  padding: 0;
  list-style: none;
  color: #fff;
  font: 11px Arial, Sans-Serif;
  margin-right: 5px;
}

.phUser > ul li {
  text-align: right;
  padding-top: 4px;
}

.phUser > ul li a {
  font-weight: bold;
  text-decoration: none;
  color: #fff;
}

.phUser > ul li a:hover {
  color: #dd9e00;
}

.phBreadcrumb {
  position: relative;
  width: 100%;
  height: 25px;
  padding: 6px 0px 0px 10px;
  box-sizing: border-box;
  background: #d3d3d3;
  /* Old browsers */
  background: linear-gradient(to bottom, #d3d3d3 0%, #b5b5b5 100%);
  /* W3C */
}

.phBreadcrumb > ul {
  margin: 0;
  padding: 0;
  list-style: none;
  font: 12px Arial, Sans-Serif;
}

/* menu place holders + menu */
/* Tile menu starts here*/
/* ============================================================
  TILE NAVIGATION
============================================================ */
/* nav styles */
.uiGridMenu {
  display: none;
}

.uiGridMenu .uiGridMenuSearch {
  width: 100%;
  text-align: center;
}
.uiGridMenu .uiGridMenuSearch input {
  width: 100%;
  max-width: 200px;
  height: 30px;
  text-align: center;
  border-radius: 15px;
  border: 2px solid #4e342e;
}

.uiGridMenu .uiGridMenuIcon {
  color: #d7ffd9;
  margin: 0px 10px 0px 0px;
  font-size: 15px;
}

.uiGridMenu .uiMenuGroup {
  background-color: #00600f;
  margin-top: 15px;
  padding: 3px;
  color: #fff;
  font-weight: bold;
  font-size: 15px;
  text-align: center;
}

.uiGridMenu.open {
  display: block;
}

.uiGridMenu ul {
  list-style: none;
}

.uiGridMenu li {
  vertical-align: top;
  display: inline-block;
  overflow: hidden;
  transition: background 0.3s;
  width: 120px;
  margin: 10px 3px;
}

.uiGridMenu a {
  display: block;
  padding: 10px;
  margin: 10px;
  text-decoration: none;
  color: #4e342e;
  transition: background 0.3s, transform 0.3s;
}

.uiGridMenu a:hover {
  background-color: #d7ffd9;
  box-shadow: 3px 3px 5px #6a6767, -2px 1px 5px #6a6767;
}

/* smoother transitions */
.uiGridMenu li,
.uiGridMenu a {
  transform: translate3d(0, 0, 0);
}

.uiGridMenu a span {
  display: block;
}

.uiGridMenu li img {
  width: 50px;
}

/* media queries */
@media (max-width: 480px) {
  .uiGridMenu {
    display: block;
  }

  .uiGridMenu li {
    width: 40%;
  }

  .phMenu {
    display: none;
  }
}
@media all and (min-width: 480px) {
  .uiGridMenu {
    display: block;
  }

  .phMenu {
    display: none;
  }
}
@media all and (min-width: 768px) {
  .uiGridMenu a {
    text-align: center;
    padding: 0px;
  }

  .phMenu {
    display: none;
  }
}
@media all and (min-width: 1024px) {
  .uiGridMenu a {
    padding: 0px;
    margin-top: 5px;
  }

  .phMenu {
    display: block;
  }
}
/* ============================================================
  NAVIGATION TOGGLE
============================================================ */
a.nav-toggle {
  display: block;
  margin-bottom: 20px;
  padding: 20px;
  background-color: #dce6f0;
  color: #646464;
  text-align: center;
}

a.nav-toggle:hover {
  background-color: #c8d2dc;
}

@media all and (min-width: 480px) {
  a.nav-toggle {
    display: none;
  }
}
/* Tile menu ends here*/
.uiHorizontalScroll {
  width: 100%;
  overflow: auto;
  white-space: nowrap;
}

.uiHorizontalScroll .uiScrollItem {
  display: inline-block;
  float: unset !important;
}

.uiAppMenuRow img,
.uiTopMenuRow img {
  width: 25px;
  margin: 0px 3px;
}

.uiShortcutMenu {
  margin-left: 20px;
}
.uiShortcutMenu .uiShortcutMenuRow {
  color: #ffffff;
  text-decoration: none;
  font-weight: normal;
  cursor: pointer;
  margin: 0px 10px;
}
.uiShortcutMenu .uiShortcutMenuRow img {
  width: 25px;
  margin: 0px 3px;
}

.uiResetFloats {
  clear: both;
}

.uiAppContentStart {
  min-height: 35px;
}

.uiAppPaper {
  background: #dedede;
}

.uiAppSideMenu {
  margin-top: "35px";
  margin-bottom: "35px";
  width: "100%";
}

.uiAppHeader {
  background-color: #000000 !important;
}
.uiAppHeader .uiAppToolBar {
  height: 30px;
  min-height: 30px;
  max-height: 30px;
}
.uiAppHeader .uiAppMenuIcon {
  padding: 3px 5px 3px 0px;
  margin-top: 0px;
}
.uiAppHeader .uiAppMenuIcon img {
  height: 30px;
}

.uiSarasPathHome .uiAppMenuIcon {
  padding: 3px 5px 3px 0px;
  margin-top: 17px;
}
.uiSarasPathHome .uiAppMenuIcon img {
  height: 43px;
}

.uiAppFooter {
  font-size: 10px;
  padding: 5px 5px;
}
.uiAppFooter .AlignRight {
  position: absolute;
  right: 34px;
}

.uiAppIcon {
  color: #1e8e3e;
}

.uiAppToolBar .uiUserCulture {
  cursor: pointer;
}
.uiAppToolBar .uiAppIconWithLink,
.uiAppToolBar .uiAppIconWithTitle {
  color: #ffffff;
  text-decoration: none;
  font-weight: normal;
  margin: 0px 3px;
}
.uiAppToolBar .uiAppIconWithLink .uiAppIcon,
.uiAppToolBar .uiAppIconWithTitle .uiAppIcon {
  color: #1e8e3e;
  margin: 0px 3px;
}
.uiAppToolBar .uiAppIconWithLink span,
.uiAppToolBar .uiAppIconWithTitle span {
  padding: 0px;
  display: inline-flex;
  vertical-align: super;
}
.uiAppToolBar .uiAppIconWithLink {
  cursor: pointer;
}
.uiAppToolBar .uiAppIconWithTitle {
  cursor: default;
}
.uiAppToolBar .uiAppIconWithTitle:hover {
  text-decoration: none;
}
.uiAppToolBar .uiAppWarningTag {
  padding: 1px 3px;
  background-color: white;
  color: red;
  border-left: 3px solid blue;
}

.uiServerProfile {
  -moz-border-radius: 20px;
  border-radius: 20px;
  border: none;
  padding: 3px 0px;
  margin: 0px 3px;
}
.uiServerProfile .uiSPInd {
  background-color: #999696;
  -moz-border-radius: 50%;
  border-radius: 50%;
  height: 12px;
  width: 12px;
  display: inline-flex;
  border: 2px solid #ffffff;
  vertical-align: super;
}
.uiServerProfile .uiSPName {
  -moz-osx-font-smoothing: grayscale;
  font-family: "Google Sans", Roboto, RobotoDraft, Helvetica, Arial, sans-serif;
  font-size: 0.875rem;
  letter-spacing: 0.25px;
  align-self: center;
  bottom: -1px;
  color: #ffffff;
  display: inline-flex;
  margin-left: 4px;
  vertical-align: super;
}

.uiSPTest {
  border: none;
}
.uiSPTest .uiSPInd {
  background-color: #ff7961;
}
.uiSPTest .uiSPName {
  text-decoration: dotted;
}

.uiSPLive {
  border: none;
}
.uiSPLive .uiSPInd {
  background-color: #1e8e3e;
}
.uiSPLive .uiSPName {
  text-decoration: underline;
}

.uiWrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.uiWrapper > .uiHeader {
  width: 100%;
  height: auto;
}

.uiWrapper > .uiHeader {
  background: #005005;
  box-shadow: 0px 0px 2px 1px #d1cfcf;
}

.uiWrapper > .uiHeader .uiHighlightKey {
  color: #ffffff;
}

.uiWrapper > .uiContents {
  padding: 1px;
  background: #dedede;
}

.uiNavMenu {
  position: relative;
  padding: 3px 6px;
  height: 31px;
  overflow: auto;
}

.uiNavMenu .uiHighlightKey {
  font-size: 15px;
}

.uiNavMenu ul {
  list-style: none;
}

.uiNavMenu ul li {
  float: left;
  margin-top: 2px;
  margin-right: 10px;
}

.uiNavMenu ul li:last-child {
  margin-right: 0;
}

.uiNavMenu .uiActive {
  border-bottom: 2px solid #000;
}

.uiNavMenu > .uiNavPlan {
  float: left;
}

.uiNavMenu > .uiNavBckAct {
  display: block;
  width: 400px;
  margin: 0 auto;
}

.uiNavMenu > .uiNavUser {
  float: right;
}

.uiNavMenu > .uiNavUser li:first-child {
  width: 100px;
  padding: 0px 20px 0px 0px;
}

.detailcontents {
  box-sizing: border-box;
}

.detailcontents {
  position: relative;
}

.phLeftColumn,
.phRightColumn {
  position: fixed;
  width: 250px;
  top: 90px;
  height: calc(100% - 90px);
  padding: 0 5px 5px 5px;
}

.phMiddleColumn {
  position: relative;
  width: calc(100% - 507px);
  margin: 0 auto;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
}

.detailcontents > .phMiddleColumn > .phSectionContents {
  padding: 2px 4px;
  margin: 5px;
  overflow: auto;
}

.phLeftColumn {
  left: 0;
}

.phRightColumn {
  right: 0;
}

.phSectionContents > .phHeader {
  display: block;
  overflow: auto;
}

.phPageFooter a {
  display: inline-block;
  width: 100px;
  background-color: #ccc;
  padding: 5px 10px;
  margin-bottom: 3px;
  font-weight: bold;
  text-align: center;
  cursor: pointer;
}

.phPageFooter a:hover {
  color: #000;
  text-decoration: underline;
}

.phLeftColumn, .phRightColumn {
  position: fixed;
  width: 150px;
  height: calc(100% - 90px);
  padding: 0 5px 5px 5px;
  top: 100px;
}

.phMiddleColumn {
  position: relative;
  width: calc(100% - 160px);
  margin: 0px 160px 0px 0px;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.5);
}

.phFullWidth {
  width: 100%;
  position: inherit;
  margin: 0px auto;
}

.phPageFooter a {
  width: 100%;
}

.phSectionContents > .phHeader {
  display: block;
  overflow: auto;
}

.FullWidthContainer,
.uiFitToContainer {
  width: 100%;
  padding: 10px;
}

.uiCol {
  display: block;
  float: left;
  width: 50%;
}

.uiSingleColumn {
  display: grid;
}

.uiFWGrid {
  clear: both;
}
.uiFWGrid > .uiRow {
  width: 100%;
  clear: both;
}
.uiFWGrid > .uiCol {
  display: block;
  width: 100%;
}

.uiGrid {
  clear: both;
}
.uiGrid > .uiRow {
  width: 100%;
  clear: both;
}
.uiGrid > .uiCol {
  display: block;
  float: left;
  width: unset;
}

.uiGridColTwo > .uiCol {
  display: block;
  float: left;
  width: 50%;
}

.uiGridColThree > .uiCol {
  display: block;
  float: left;
  width: 33%;
}

.uiGridColFour > .uiCol {
  display: block;
  float: left;
  width: 25%;
}

.MarginBottom50 {
  margin-bottom: 50px;
}

.uiBorderTop {
  border-top: 1px dotted #258625;
}

.uiFontSize11 {
  display: block;
  font-size: 11px;
}

.uiBlackContainer {
  background-color: #3e2723 !important;
  color: #ffffff !important;
}

.uiColorBlue {
  color: #0080ff;
}

.uiColorActionGrey,
.uiColorGrey {
  color: #999696;
}

.uiColorActionGreen,
.uiColorGreen {
  color: #255d00;
}

.uiColorNegativeAction,
.uiColorRed {
  color: #ff7961;
}

.uiColorAction {
  color: #3e2723;
}

.uiBlackContainer .uiColorAction {
  color: #fff;
}

.uiFloatRight {
  float: right;
}

.uiFloatLeft {
  float: left;
}

.uiTextLeft {
  text-align: left;
}

.uiCultureList {
  margin: 10px 5px;
}
.uiCultureList span.uiLink {
  font-weight: normal;
  cursor: pointer;
  padding: 0px 5px;
  color: #4e342e;
}
.uiCultureList span.uiActive {
  font-weight: bold;
  color: #4e342e;
  padding: 0px 5px;
  text-decoration: underline;
}

.uiCompanyList {
  margin: 10px 5px;
}
.uiCompanyList .uiActive {
  font-weight: bold;
  color: #4e342e;
}

.uiListScroll {
  height: 500px;
  overflow-y: scroll;
}

.uiHomeIntro {
  text-align: center;
  margin: 10px;
}

.uiWorkApproval .uiAppWFAction {
  display: none;
  position: absolute;
  background-color: #fff;
  z-index: 1000;
  box-shadow: 2px 3px 3px 0px rgba(0, 0, 0, 0.25);
  border-bottom-right-radius: 6px;
  border-bottom-left-radius: 6px;
}

.uiWorkApproval:hover .uiAppWFAction {
  display: block;
}

#srTagAttributes {
  float: left;
  width: 870px;
}

#srAttributeHeader {
  margin-left: 50px;
  float: left;
  width: 300px;
}

.login-header {
  height: 75px;
  background-color: black;
  padding: 10px 20px;
}

.login-header .header-container {
  width: 100%;
}

.login-header .erpLogo {
  display: inline-block;
  width: 30%;
}

.login-header .erpLogo img {
  width: 100%;
  max-width: 150px;
}

.login-header .customerSupport {
  float: right;
  margin: 20px auto;
}

.login-header .customerSupport span {
  display: block;
  font-size: 16px;
  font-weight: bold;
  text-align: right;
  color: #C2C95C;
}

.login-header .customerSupport .slogan a {
  font-size: 12px;
  color: #Dc853D;
}

.frmLoginContainer {
  width: 450px;
  margin: 75px auto 0px auto;
}

.frmLoginInput {
  margin: 20px 0 0 0;
  background-color: #ffffff;
  border-radius: 5px;
  box-shadow: 0px 0px 4px 2px #d1cfcf;
}

.frmLoginInput > .frmInput {
  padding: 10px 0px 10px 65px;
}

.frmLoginInput ul {
  margin: 0;
  padding: 0;
  list-style: none;
  font-size: 13px;
  font-weight: bold;
}

.frmLoginInput ul li {
  margin: 15px 0px 3px 0px;
}

.frmLoginInput ul li span {
  display: block;
}

.frmLoginInput ul li input {
  width: 300px;
}

.frmLoginInput ul li > select {
  width: 312px;
  padding: 5px;
  border: 1px solid #000;
  border-radius: 4px;
}

.frmLoginInput .phTitle {
  padding: 10px;
  background-color: #255d00 !important;
  color: #fff;
  font-weight: bold;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}

.frmLoginInput .uiGeneralAction {
  font-size: 15px;
  padding: 6px 20px;
}

.frmLoginInput .frmFooter {
  padding: 10px;
  clear: both;
  border-top: 3px solid #347bdc;
  color: #000;
  font-weight: bold;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  height: 30px;
}

.frmLoginInput .frmFooter .left {
  float: left;
}

.frmLoginInput .frmFooter .right {
  float: right;
}

.frmLoginInput .messages {
  padding: 5px;
  display: block;
}

.phSearchPanel {
  position: relative;
  margin-bottom: 5px;
  border-radius: 5px;
}

.phSearchPanel .uiGroupContent {
  background-color: #fff;
}

.phSearchPanel > .phSearchFav {
  display: inline-block;
  padding: 5px 5px 5px 10px;
}

.phSearchPanel > .phSearchCriteria {
  position: relative;
  background-color: #E6E6E6;
}

.phSearchPanel > .phSearchNew {
  display: inline-block;
  padding: 5px 5px 3px 10px;
  overflow: visible;
}

.frmSearch > .uiSelectedCriteria {
  display: inline-block;
  padding: 0;
  margin: 0;
  background: none;
}

.frmSearch > .uiSelectedCriteria ul {
  padding: 0;
  margin: 0;
  background: none;
}

.frmSearch > .uiSelectedCriteria ul li:first-child {
  padding: 0;
  margin-right: 10px;
  background: none;
  color: #000;
  border: none;
  text-align: left;
}

.frmSearch > .uiSelectedCriteria ul li:first-child:hover {
  color: #000;
  border: none;
  cursor: auto;
}

.frmSearch > .uiSelectedCriteria ul li {
  display: inline-block;
  position: relative;
  padding: 2px 12px;
  margin-right: 7px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background: #347bdc;
  /* Old browsers */
  border-radius: 4px;
  cursor: pointer;
}

.frmSearch > .uiSearchInput {
  display: inline-block;
}

.frmSearch > .uiSearchAction {
  display: inline-block;
}

.frmSearchCriteria .uiField {
  color: blue;
  font-size: large;
}
.frmSearchCriteria .uiCriteria {
  color: #404040;
}
.frmSearchCriteria .uiValue {
  font-weight: bold;
  font-size: medium;
}
.frmSearchCriteria .ui-state-active {
  background-color: aqua;
}

/*search results group content*/
.uiGroupContentSR {
  box-shadow: 3px 3px 5px #6a6767, -2px 1px 5px #6a6767;
  z-index: 0;
  padding: 0px;
  margin: 0px 5px 10px 5px;
  border-radius: 3px;
}

.uiDynamicGroupSection {
  height: 35px;
  position: relative;
}
.uiDynamicGroupSection > div > div {
  height: 40px;
  overflow: hidden;
}
.uiDynamicGroupSection .uiPreviousGroup {
  color: #0080ff;
  font-weight: bold;
  overflow: hidden;
  word-break: break-all;
  max-width: 70px;
  display: inline-block;
}
.uiDynamicGroupSection .uiDynamicGroupSelector {
  width: fit-content;
  font-size: 11px;
  display: inline-block;
  overflow: hidden;
  line-height: 11px;
  height: 15px;
}
.uiDynamicGroupSection .uiGroupButton {
  display: inline-flex;
  width: 25px;
  height: 25px;
}
.uiDynamicGroupSection .uiTabActive {
  background: #0080ff !important;
}

.uipopover {
  position: absolute;
  display: block;
  margin-left: 10px;
  padding: 10px;
  border: 1px solid #2864b6;
  z-index: 1000;
  box-sizing: border-box;
  height: auto;
  top: 77px;
  left: 10px;
  white-space: normal;
  background-color: #FFF;
  background-clip: padding-box;
  box-shadow: 1px 1px 2px 0px rgba(10, 10, 10, 0.5);
  border-radius: 5px;
}

.uipopover ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.uipopover ul li {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
}

.uipopover ul li > #srcBldrCriteriaValue1,
.uipopover ul li > #srcBldrCriteriaValue2 {
  padding: 4px;
  border: 1px solid #2864b6;
  border-radius: 4px;
  margin-right: 7px;
}

.uipopover ul li > #srcBldrCriteriaValue1:focus,
.uipopover ul li > #srcBldrCriteriaValue2:focus {
  background-color: #FFF;
  border: 1px solid #000;
}

.uipopover ul li > select {
  padding: 4px;
  background-color: #FCFEFD;
  border: 1px solid #2864b6;
  border-radius: 4px;
  margin-right: 7px;
}

#search input[type=text] {
  width: 250px;
}

/* Company Master ends here */
.uiSHTBContent span {
  font-size: 110%;
}

.uiSHTBContent input[type=text] {
  width: 250px;
}

.uiSearchHead {
  border-radius: 3px;
  margin-top: 10px;
}

.uiItemPopupForm {
  margin: 0;
  padding: 0;
  list-style: none;
}

.uiItemPopupForm li {
  display: block;
  overflow: auto;
  padding: 7px 0;
}

.uiItemPopupForm li .uiColumn {
  width: 50%;
  float: left;
}

.uiItemPopupForm li #uncstlbl {
  position: relative;
  width: 35%;
  float: left;
}

.uiItemPopupForm li #UOMLbl {
  position: relative;
  width: 15%;
  float: left;
}

.uiItemPopupForm li #taxamt {
  position: relative;
  width: 30%;
  float: right;
  margin-right: 143px;
}

.uiItemPopupForm li #itemdesc {
  position: relative;
  width: 100%;
  float: left;
}

.uiItemPopupForm li #UOMLbl span {
  display: block;
  width: 28px !important;
  padding-top: 5px;
  border: none !important;
  background: none;
  float: left;
}

.uiItemPopupForm li input[type=text] {
  width: 113px;
}

.phPopupContent {
  overflow-y: scroll;
}

.uiitemDetailMain {
  position: relative;
  margin-top: 5px;
  background-color: #FFF;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 5px;
}

.uieditornew #searchItem {
  margin-left: 5px;
  margin-top: 5px;
}

.uiAccessory {
  text-align: left;
  height: 25px;
  width: 100%;
  background-color: #d7ffd9;
}

.uiitemImage {
  display: block;
  width: 100px;
  height: 100px;
  float: left;
  margin-right: 15px;
  cursor: pointer;
}

.uiMediaDropZone {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px;
  border-width: 2px;
  border-radius: 2px;
  border-color: #eeeeee;
  border-style: dashed;
  background-color: #fafafa;
  color: #bdbdbd;
  outline: none;
  transition: border 0.24s ease-in-out;
}

.uiMediaActiveDropZone {
  border-color: #0080ff;
}

.uiMediaAcceptedDropZone {
  border-color: #255d00;
}

.uiMediaRejectedDropZone {
  border-color: #ff7961;
}

#itemDetailPart {
  margin-top: 60px;
}

.uiPPEditLine input[type=text] {
  width: 250px;
}

.uiAppWFAction {
  position: relative;
  border: 1px solid #ccc;
  padding: 1px 5px;
}

.uiAppWFAction > .phSectionTitle {
  text-align: center;
  background: #ccc;
  font-size: 12px;
  font-weight: bold;
  padding: 3px;
}

.uiAppWFAction > .phSectionContents {
  position: relative;
  width: 100%;
  height: 100%;
  font-size: 12px;
  overflow: auto;
}

/* for Approval workflow */
.uiApvWrkFlwActivity {
  margin-top: 2px;
}

.uiApvWrkFlwActivityInfo {
  position: relative;
  border-bottom: 1px solid #EFEBE9;
  overflow: auto;
}

.uiApvWrkFlwActivityInfo .appWrkFlwRowNumber {
  width: 18px;
  height: 18px;
  text-align: center;
  display: inline-block;
  border-bottom-right-radius: 9px;
  position: relative;
  margin-right: 5px;
  margin-top: 0px;
  background-color: #4e342e;
  color: white;
  font-size: 11px;
  float: left;
}

.uiApvWrkFlwActivityInfo .appWrkFlowRowContent {
  position: relative;
  padding: 5px;
  min-width: 150px;
}

.uiApvWrkFlwActivityInfo .appWrkFlowRowContent li {
  margin-bottom: 3px;
}

.uiApvWrkFlwActivityInfo .appWrkFlowRowContent .wrkFlowName {
  font-weight: bold;
}

.uiApvWrkFlwActivityInfo .appWrkFlowRowContent .rowColName {
  float: left;
  color: #800000;
  font-weight: bold;
}

.uiApvWrkFlwActivityInfo .appWrkFlowRowContent .rowColContent {
  float: left;
}

.uiImportItemsHeaderForm {
  margin: 0;
  padding: 0;
  list-style: none;
}

.uiImportItemsHeaderForm li {
  position: relative;
  display: block;
  overflow: auto;
  padding: 7px 0;
}

.uiImportItemsHeaderForm li span {
  display: inline-block;
  padding-top: 5px;
  margin-left: 5px;
}

.uiImportItemsHeaderForm li .uiColumn {
  position: relative;
  width: 49%;
  float: left;
}

.uiImportItemsHeaderForm li input[type=text] {
  width: 130px;
}

/* for Item Packing */
.uiRBListHeader {
  background-color: #F1F1F1;
  font-weight: bold;
}

.uiDelRefBreakup ul li {
  text-align: center;
  width: 40px;
}

.uiDelRefBreakup ul span {
  text-align: center;
  width: 40px;
}

.uiIPListHeader {
  background-color: #F1F1F1;
  font-weight: bold;
}

.uiSHContent span {
  font-size: 110%;
}

.uiSHContent input[type=text] {
  width: 250px;
}

.uiSHOContent {
  float: left;
}

.uiSHOContent span {
  font-size: 110%;
}

.uiSHOContent input[type=text] {
  width: 250px;
}

/* For Tax Template */
.uiSHTContent {
  float: left;
}

.uiSHTContent span {
  font-size: 110%;
}

.uiSHTContent input[type=text] {
  width: 250px;
}

.uiTaxTemplateList ul li {
  text-align: center;
  width: 40px;
}

.uiTaxTemplateList ul span {
  text-align: center;
  width: 40px;
}

.uiTaxListHeader {
  background-color: #F1F1F1;
  font-weight: bold;
}

.uiTaxTemplateList li .uiTaxListHeader {
  background-color: #f1f1f1;
  font-weight: bold;
}

/* Tax Template ends here */
.uiHeaderForm li span {
  display: block;
  padding-top: 5px;
  margin-left: 5px;
}

.uiHeaderForm {
  margin: 0;
  padding: 0;
  list-style: none;
}

.uiHeaderForm li {
  position: relative;
  display: block;
  overflow: auto;
  padding: 7px 0;
}

.uiHeaderForm li .uiColumn {
  position: relative;
  width: 27%;
  float: left;
}

.uiHeaderForm li .ui2Columns {
  position: relative;
  width: 45%;
  float: left;
}

.uiHeaderForm li .uiRightColumn {
  margin-left: 30px;
}

.uiHeaderForm li input[type=text] {
  width: 150px;
}

.uieditornew input[type=text] {
  width: 175px;
}

.uisave-cancelbutton {
  float: left;
  margin-left: 320px;
  cursor: pointer;
}

.uiTime {
  color: #fff;
  float: left;
  margin: 12px 0px 0px 10px;
  font-weight: bold;
}

.uiViewActivatorGreen ul li.uiTime,
.uiViewActivatorBlue ul li.uiTime {
  background: #b5b7bc;
  color: #000;
  cursor: default;
  border-bottom: 1px solid #000;
}

.uiDashGroupTitle {
  padding: 3px 0px;
  box-shadow: 0px 3px 5px #0e0e0e;
  background-color: #373737;
  color: #fff;
  font-weight: bold;
  border-radius: 3px 3px 0px 0px;
}

.uiDashGroupTitleNA {
  padding: 3px 0px;
  box-shadow: 0px 3px 5px #0e0e0e;
  background-color: #000;
  color: #fff;
  border-radius: 3px 3px 0px 0px;
}

.uiDashViewS {
  height: 120px;
}

.uiDashViewD {
  height: 300px;
}

.uiCertResponse {
  display: inline-block;
}

/* for paging */
.uiInvSearchPaging {
  float: right;
}
.uiInvSearchPaging .uiPageNumber {
  text-align: center;
}

.btnFirstPage,
.btnLastPage,
.uiInvPagePre,
.uiInvPageNext,
.uiInvPageCurrent {
  min-width: 30px;
  height: 21px;
  float: left;
}

.btnFirstPage {
  background: url("../../images/ux/buttonFirstpage.png") no-repeat left top;
}

.btnLastPage {
  width: 55px;
  font-size: 13px;
  text-align: right;
  color: white;
  background: url("../../images/ux/buttonLastpage.png") no-repeat left top;
}

.uiInvPagePre {
  background: url("../../images/ux/psButtonPre.png") no-repeat left top;
}

.uiInvPageNext {
  background: url("../../images/ux/psButtonNext.png") no-repeat left top;
}

.btnFirstPage:disabled,
.btnLastPage:disabled,
.uiInvPagePre:disabled,
.uiInvPageNext:disabled {
  background-position: left -21px;
  cursor: default;
}

.uiInvPageCurrent {
  font-weight: bold;
  font-size: 15px;
  text-align: center;
  padding: 0px 5px;
}

.uiOptions {
  display: inline-block;
}

.uiOptions td {
  display: inline-block;
  margin-left: 10px;
}

.uiOptions td label {
  display: inline-block;
  margin-left: 3px;
}

.uiConfigureAction {
  height: 25px;
  text-align: center;
  padding: 25px;
}

.uiSearchQCItemList {
  width: 350px;
}

.uiSearchSubList {
  min-width: 450px;
  text-align: left;
}
.uiSearchSubList .sItemCode {
  width: 120px;
  display: inline-block;
}
.uiSearchSubList .sItemID {
  width: 230px;
  display: inline-block;
}
.uiSearchSubList .sItemWeight {
  width: 50px;
  display: inline-block;
  text-align: center;
}
.uiSearchSubList .sBomWeight {
  width: 70px;
  display: inline-block;
  text-align: center;
}

.uiSearchRouteItemList {
  min-width: 500px;
  text-align: left;
}
.uiSearchRouteItemList .sSeqNo {
  width: 50px;
  text-align: center;
  display: inline-block;
}
.uiSearchRouteItemList .sTktNo {
  width: 70px;
  text-align: center;
  display: inline-block;
}
.uiSearchRouteItemList .sItemCode {
  width: 50px;
  text-align: center;
  display: inline-block;
}
.uiSearchRouteItemList .sRoute {
  width: 100px;
  display: inline-block;
}
.uiSearchRouteItemList .sPassengerName {
  width: 110px;
  text-align: center;
  display: inline-block;
}
.uiSearchRouteItemList .sTktClass {
  width: 70px;
  text-align: center;
  display: inline-block;
}
.uiSearchRouteItemList .sCost {
  width: 70px;
  display: inline-block;
  text-align: right;
}

.uiContextMenuProcessStatus {
  display: inline-block;
}
.uiContextMenuProcessStatus .uiContextMenu,
.uiContextMenuProcessStatus .uiLabel {
  float: left;
}

.phInvGrid {
  display: grid;
  grid-template-columns: 45fr 27fr 28fr;
  grid-template-areas: "tracker tracker tracker" "item header summary" "item customfield summary" "item terms summary" "supporting supporting supporting" "comment comment comment";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.phInvGrid .phSectionTracker {
  grid-area: tracker;
}
.phInvGrid .phSectionItem {
  grid-area: item;
  background: #fff;
}
.phInvGrid .phSectionItem .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phInvGrid .phSectionHeader {
  grid-area: header;
  background: #fff;
}
.phInvGrid .phSectionHeader .phViewArea .phViewContent {
  max-height: 200px;
  overflow: auto;
}
.phInvGrid .phSectionCustomField {
  grid-area: customfield;
  background: #fff;
}
.phInvGrid .phSectionCustomField .phViewArea .phViewContent {
  max-height: 70px;
  overflow: auto;
}
.phInvGrid .phSectionTerms {
  grid-area: terms;
  background: #fff;
}
.phInvGrid .phSectionTerms .phViewArea .phViewContent {
  max-height: 110px;
  overflow: auto;
}
.phInvGrid .phSectionSummary {
  grid-area: summary;
  background: #fff;
}
.phInvGrid .phSectionSupportingInfo {
  grid-area: supporting;
  display: flex;
  column-gap: 15px;
}
.phInvGrid .phSectionSupportingInfo > div {
  flex-grow: 1;
  background: #fff;
  border: 1px solid #00600f;
  border-radius: 5px;
}
.phInvGrid .phSectionSupportingInfo .phSectionPayPlan {
  max-width: 27%;
  width: fit-content;
}
.phInvGrid .phSectionSupportingInfo .phSectionActions {
  max-width: 27%;
}
.phInvGrid .phSectionSupportingInfo .phViewArea .phViewContent {
  height: 150px;
  overflow: auto;
}
.phInvGrid .phSectionComment {
  grid-area: comment;
  background: #fff;
}

.uiSarasPackageRestaurant .grid-container-303-parent .phViewAreaItem {
  display: grid;
  min-height: 80px;
  grid-template-rows: 20px 30px 20px;
  grid-template-columns: 12fr 20fr 23fr 15fr 30fr;
  grid-template-areas: "ref ref name name qty" "info info info info info" "cost cost cost cost action";
  grid-column-gap: 3px;
  grid-row-gap: 1px;
  border-bottom: 1px solid #EFEBE9;
}
.uiSarasPackageRestaurant .grid-container-303-parent .phViewAreaItem .phViewName {
  grid-area: name;
  overflow: hidden;
}
.uiSarasPackageRestaurant .grid-container-303-parent .phViewAreaItem .phViewRef {
  grid-area: ref;
}
.uiSarasPackageRestaurant .grid-container-303-parent .phViewAreaItem .phViewInfo {
  grid-area: info;
  margin-top: 10px;
}
.uiSarasPackageRestaurant .grid-container-303-parent .phViewAreaItem .phViewQty {
  grid-area: qty;
  font-size: 20px;
  align-self: center;
  justify-self: center;
}
.uiSarasPackageRestaurant .grid-container-303-parent .phViewAreaItem .phViewCost {
  grid-area: cost;
}
.uiSarasPackageRestaurant .grid-container-303-parent .phViewAreaItem .phViewAction {
  grid-area: action;
  align-self: center;
  justify-self: center;
}
.uiSarasPackageRestaurant .phInvGrid {
  grid-template-areas: "tracker tracker tracker" "supporting supporting supporting" "item header summary" "item customfield summary" "item customfield summary" "comment comment comment";
}
.uiSarasPackageRestaurant .phInvGrid .phSectionTerms {
  display: none;
}
.uiSarasPackageRestaurant .phInvGrid .phSectionCustomField {
  grid-area: customfield;
  background: #fff;
}
.uiSarasPackageRestaurant .phInvGrid .phSectionCustomField .phViewArea .phViewContent {
  max-height: 300px;
  overflow: auto;
}

.uiBoxItemLineNo {
  left: -4px;
  width: 30px;
  height: 20px;
  text-align: center;
  color: white;
  display: inline-block;
  position: relative;
  border-bottom-right-radius: 15px;
  background-color: #4e342e;
}

.uiBoxItem {
  margin: 1px 2px 10px 1px;
  border-radius: 5px;
}
.uiBoxItem .phKeyValueView {
  display: inline-block;
  margin-left: 5px;
}
.uiBoxItem .phKeyValueView .uiKey {
  width: 30px;
  margin: 0px 5px 0px 5px;
  font-weight: bold;
}
.uiBoxItem .phKeyValueView .uiValue {
  min-width: 30px;
}
.uiBoxItem .uiChildSection {
  display: none;
}
.uiBoxItem .uiChildSection > a {
  font-weight: bold;
  color: #0000FF;
  cursor: pointer;
  margin-right: 10px;
}
.uiBoxItem:hover .uiChildSection {
  display: block;
}
.uiBoxItem:hover {
  box-shadow: 5px 5px 5px #d1cfcf;
}

.phViewAreaItem {
  display: grid;
  grid-template-rows: 20px 20px auto 20px auto;
  grid-template-columns: 12fr 13fr 30fr 15fr 30fr;
  grid-template-areas: "ref ref ref ref ref" "name name name name qty" "info info info info image" "cost cost cost cost action" "cost cost cost cost action";
  grid-column-gap: 3px;
  grid-row-gap: 1px;
  border-bottom: 1px solid #EFEBE9;
}
.phViewAreaItem .phViewImage {
  grid-area: image;
  max-height: 50px;
  width: 50px;
  align-self: center;
  justify-self: center;
}
.phViewAreaItem .phViewCode {
  grid-area: code;
}
.phViewAreaItem .phViewName {
  grid-area: name;
  overflow: hidden;
}
.phViewAreaItem .phViewRef {
  grid-area: ref;
}
.phViewAreaItem .phViewInfo {
  grid-area: info;
}
.phViewAreaItem .phViewAttr {
  grid-area: attr;
}
.phViewAreaItem .phViewQty {
  grid-area: qty;
  font-size: 20px;
  align-self: center;
  justify-self: center;
}
.phViewAreaItem .phViewCost {
  grid-area: cost;
}
.phViewAreaItem .phViewAction {
  grid-area: action;
  align-self: baseline;
  justify-self: center;
}
.phViewAreaItem .phViewChild {
  grid-area: child;
}

.phChildGroupViewAreaItem {
  display: grid;
  min-height: 120px;
  grid-template-rows: 20px 20px auto 20px 20px;
  grid-template-columns: 12fr 13fr 30fr 15fr 30fr;
  grid-template-areas: "ref ref ref ref ref" "name name name name qty" "info info info info image" "cost cost cost cost action" "childAlloc childAlloc childAlloc childAlloc childTotal";
  grid-column-gap: 3px;
  grid-row-gap: 1px;
  border-bottom: 1px solid #EFEBE9;
}
.phChildGroupViewAreaItem .phViewImage {
  grid-area: image;
  max-height: 50px;
  width: 50px;
  align-self: center;
  justify-self: center;
}
.phChildGroupViewAreaItem .phViewCode {
  grid-area: code;
}
.phChildGroupViewAreaItem .phViewName {
  grid-area: name;
  overflow: hidden;
}
.phChildGroupViewAreaItem .phViewRef {
  grid-area: ref;
}
.phChildGroupViewAreaItem .phViewInfo {
  grid-area: info;
}
.phChildGroupViewAreaItem .phViewAttr {
  grid-area: attr;
}
.phChildGroupViewAreaItem .phViewQty {
  grid-area: qty;
  font-size: 20px;
  align-self: center;
  justify-self: center;
}
.phChildGroupViewAreaItem .phViewCost {
  grid-area: cost;
}
.phChildGroupViewAreaItem .phViewAction {
  grid-area: action;
  align-self: center;
  justify-self: center;
}
.phChildGroupViewAreaItem .phViewAlloc {
  grid-area: childAlloc;
}
.phChildGroupViewAreaItem .phViewChildTotal {
  grid-area: childTotal;
  text-align: center;
}

.phProfileGrid .phSectionOutstanding {
  background: #fff;
}
.phProfileGrid .phSectionHeader {
  background: #fff;
}
.phProfileGrid .phSectionHeader .phViewArea .phViewContent {
  overflow: auto;
}
.phProfileGrid .phSectionAnniv {
  background: #fff;
}
.phProfileGrid .phSectionAnniv .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phProfileGrid .phSectionContact {
  background: #fff;
}
.phProfileGrid .phSectionContact .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phProfileGrid .phSectionAddress {
  background: #fff;
}
.phProfileGrid .phSectionAddress .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phProfileGrid .phSectionProductInfo {
  background: #fff;
}
.phProfileGrid .phSectionProductInfo .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phProfileGrid .phSectionTerms {
  background: #fff;
}
.phProfileGrid .phSectionTerms .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phProfileGrid .phSectionTax {
  background: #fff;
}
.phProfileGrid .phSectionTax .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phProfileGrid .phSectionBank {
  background: #fff;
}
.phProfileGrid .phSectionBank .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phProfileGrid .phSectionImage {
  background: #fff;
}
.phProfileGrid .phSectionImage .phViewArea .phViewContentContainer {
  min-height: 200px;
  max-height: 500px;
  overflow: auto;
}
.phProfileGrid .phSectionAttach {
  background: #fff;
}
.phProfileGrid .phSectionAttach .phViewArea .phViewContentContainer {
  min-height: 200px;
  max-height: 500px;
  overflow: auto;
}
.phProfileGrid .phSectionReference1 {
  min-height: 500px;
  overflow: auto;
}
.phProfileGrid .phSectionId {
  min-height: 400px;
  overflow: auto;
  background: #fff;
}
.phProfileGrid .phSectionMem {
  min-height: 400px;
  overflow: auto;
  background: #fff;
}

.phItemGrid .phSectionHeader {
  background: #ffffff;
}
.phItemGrid .phSectionHeader .phViewArea .phViewContent {
  max-height: 600px;
  overflow: auto;
}
.phItemGrid .phSectionGrouping {
  background: #ffffff;
}
.phItemGrid .phSectionGrouping .phViewArea .phViewContent {
  max-height: 250px;
  overflow: auto;
}
.phItemGrid .phSectionTag {
  background: #ffffff;
}
.phItemGrid .phSectionTag .phViewArea .phViewContent {
  max-height: 200px;
  overflow: auto;
}
.phItemGrid .phSectionAttr {
  background: #ffffff;
}
.phItemGrid .phSectionAttr .phViewArea .phViewContent {
  max-height: 200px;
  overflow: auto;
}
.phItemGrid .phSectionImage {
  background: #ffffff;
}
.phItemGrid .phSectionImage .phViewArea .phViewContent {
  max-height: 600px;
  overflow: auto;
}
.phItemGrid .phSectionTech {
  background: #ffffff;
}
.phItemGrid .phSectionTech .phViewArea .phViewContent {
  max-height: 600px;
  overflow: auto;
}
.phItemGrid .phSectionPrice {
  background: #ffffff;
}
.phItemGrid .phSectionPrice .phViewArea .phViewContent {
  max-height: 600px;
  overflow: auto;
}

.phVoucherGrid .phSectionHeader {
  background: #fff;
}
.phVoucherGrid .phSectionHeader .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.phVoucherGrid .phSectionDetail {
  background: #fff;
}
.phVoucherGrid .phSectionDetail .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.phVoucherGrid .phSectionTrans {
  background: #fff;
}
.phVoucherGrid .phSectionTrans .phViewArea .phViewContent {
  overflow: auto;
}
.phVoucherGrid .phSectionAttach {
  background: #fff;
}
.phVoucherGrid .phSectionAttach .phViewArea .phViewContent {
  min-height: 200px;
  max-height: 500px;
  overflow: auto;
}

.phTaskGrid {
  display: grid;
  grid-template-columns: 30fr 30fr 40fr;
  grid-template-areas: "header detail group" "header detail group" "header detail attach" "header detail attach" "attr attr attr" "invlink invlink invlink" "log log log";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.phTaskGrid .phSectionHeader {
  grid-area: header;
  background: #fff;
}
.phTaskGrid .phSectionHeader .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.phTaskGrid .phSectionDetail {
  grid-area: detail;
  background: #fff;
}
.phTaskGrid .phSectionDetail .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.phTaskGrid .phSectionGrouping {
  grid-area: group;
  background: #fff;
}
.phTaskGrid .phSectionAttach {
  grid-area: attach;
  background: #fff;
}
.phTaskGrid .phSectionAttach .phViewArea .phViewContent {
  max-height: 500px;
  height: 120px;
  overflow: auto;
}
.phTaskGrid .phSectionAttr {
  grid-area: attr;
  background: #fff;
}
.phTaskGrid .phSectionComment {
  grid-area: log;
  background: #fff;
}
.phTaskGrid .phSectionInvLink {
  grid-area: invlink;
  background: #fff;
}

.grid-container-7022-parent .phTaskGrid {
  display: grid;
  grid-template-columns: 30fr 20fr 20fr 30fr;
  grid-template-areas: "header detail group group" "header detail group group" "header detail attach image" "header detail attach image" "attr attr attr attr" "invlink invlink invlink invlink" "log log log log";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.grid-container-7022-parent .phTaskGrid .phSectionHeader {
  grid-area: header;
  background: #fff;
}
.grid-container-7022-parent .phTaskGrid .phSectionHeader .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.grid-container-7022-parent .phTaskGrid .phSectionDetail {
  grid-area: detail;
  background: #fff;
}
.grid-container-7022-parent .phTaskGrid .phSectionDetail .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.grid-container-7022-parent .phTaskGrid .phSectionGrouping {
  grid-area: group;
  background: #fff;
}
.grid-container-7022-parent .phTaskGrid .phSectionAttach {
  grid-area: attach;
  background: #fff;
}
.grid-container-7022-parent .phTaskGrid .phSectionAttach .phViewArea .phViewContent {
  max-height: 500px;
  height: 120px;
  overflow: auto;
}
.grid-container-7022-parent .phTaskGrid .phSectionImage {
  grid-area: image;
  background: #fff;
}
.grid-container-7022-parent .phTaskGrid .phSectionImage .phViewArea .phViewContent {
  max-height: 500px;
  height: 120px;
  overflow: auto;
}
.grid-container-7022-parent .phTaskGrid .phSectionAttr {
  grid-area: attr;
  background: #fff;
}
.grid-container-7022-parent .phTaskGrid .phSectionComment {
  grid-area: log;
  background: #fff;
}
.grid-container-7022-parent .phTaskGrid .phSectionInvLink {
  grid-area: invlink;
  background: #fff;
}

.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid {
  display: grid;
  grid-template-columns: 30fr 20fr 20fr 30fr;
  grid-template-areas: "header detail group group" "header detail group group" "header detail attach attach" "header detail attach attach" "attr attr attr attr" "invlink invlink invlink invlink" "log log log log";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionHeader {
  grid-area: header;
  background: #fff;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionHeader .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionDetail {
  grid-area: detail;
  background: #fff;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionDetail .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionGrouping {
  grid-area: group;
  background: #fff;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionAttach {
  grid-area: attach;
  background: #fff;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionAttach .phViewArea .phViewContent {
  max-height: 500px;
  height: 120px;
  overflow: auto;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionAttr {
  grid-area: attr;
  background: #fff;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionComment {
  grid-area: log;
  background: #fff;
}
.uiSarasClientHariOm .grid-container-70101-parent .phTaskGrid .phSectionInvLink {
  grid-area: invlink;
  background: #fff;
}

.uiSarasClientJV .grid-container-70101-parent .phTaskGrid {
  display: grid;
  grid-template-columns: 30fr 20fr 20fr 30fr;
  grid-template-areas: "header detail group group" "header detail group group" "header detail attach image" "header detail attach image" "attr attr attr attr" "invlink invlink invlink invlink" "log log log log" "budget budget budget budget";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionHeader {
  grid-area: header;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionHeader .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionDetail {
  grid-area: detail;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionDetail .phViewArea .phViewContent {
  max-height: 500px;
  overflow: auto;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionGrouping {
  grid-area: group;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionAttach {
  grid-area: attach;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionAttach .phViewArea .phViewContent {
  max-height: 500px;
  height: 120px;
  overflow: auto;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionImage {
  grid-area: image;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionImage .phViewArea .phViewContent {
  max-height: 500px;
  height: 120px;
  overflow: auto;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionAttr {
  grid-area: attr;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionComment {
  grid-area: log;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionInvLink {
  grid-area: invlink;
  background: #fff;
}
.uiSarasClientJV .grid-container-70101-parent .phTaskGrid .phSectionBudget {
  grid-area: budget;
  background: #fff;
}

.phBudgetGrid .phSectionHeader {
  background: #fff;
}
.phBudgetGrid .phSectionHeader .phViewArea .phViewContent {
  min-height: 300px;
  max-height: 500px;
  overflow: auto;
}
.phBudgetGrid .phSectionAction {
  background: #fff;
}
.phBudgetGrid .phSectionAction .phViewArea .phViewContent {
  min-height: 300px;
  max-height: 500px;
  overflow: auto;
}

.phCompanyGrid {
  display: grid;
  grid-template-columns: 40fr 60fr;
  grid-template-areas: "search search" "detail branch" "detail branch";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.phCompanyGrid .phSectionSearch {
  grid-area: search;
  background: #fff;
}
.phCompanyGrid .phSectionEditor {
  grid-area: detail;
  background: #fff;
}
.phCompanyGrid .phSectionBranch {
  grid-area: branch;
  background: #fff;
}

.phAMCGrid {
  display: grid;
  grid-template-columns: 100fr;
  grid-template-areas: "header" "attr" "series" "attach";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.phAMCGrid .phSectionHeader {
  grid-area: header;
  background: #fff;
}
.phAMCGrid .phSectionAttr {
  grid-area: attr;
  background: #fff;
}
.phAMCGrid .phSectionSeries {
  grid-area: series;
  background: #fff;
}
.phAMCGrid .phSectionSeries .phViewArea .phViewContent {
  min-height: 55px;
  padding: 20px;
  overflow: auto;
}
.phAMCGrid .phSectionAttch {
  grid-area: attach;
  background: #fff;
}
.phAMCGrid .phSectionAttch .phViewArea .phViewContent {
  min-height: 100px;
  overflow: auto;
}

.grid-container-24-parent .uiBoxItem {
  margin: 5px 2px 10px 1px;
}
.grid-container-24-parent .phViewAreaItem {
  border-bottom: 1px solid #EFEBE9;
  display: grid;
  min-height: 50px;
  grid-template-rows: 20px auto;
  grid-template-columns: 25fr 45fr 15fr 15fr;
  grid-template-areas: "name name cost action" "info info info info";
  grid-column-gap: 3px;
  grid-row-gap: 1px;
}
.grid-container-24-parent .phViewAreaItem .phViewName {
  grid-area: name;
  overflow: hidden;
}
.grid-container-24-parent .phViewAreaItem .phViewInfo {
  grid-area: info;
}
.grid-container-24-parent .phViewAreaItem .phViewCost {
  grid-area: cost;
  font-size: 20px;
  align-self: center;
  justify-self: center;
}
.grid-container-24-parent .phViewAreaItem .phViewAction {
  grid-area: action;
  align-self: center;
  justify-self: center;
}
.grid-container-24-parent .phViewAreaItem .phViewChild {
  grid-area: child;
  display: none;
}

.grid-container-7020-parent .phTaskGrid {
  grid-template-columns: 30fr 30fr 40fr;
  grid-template-areas: "header detail attr" "group group group" "attach attach attach" "invlink invlink invlink" "log log log";
}

.uiBoxChoice ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: inline-block;
}

.uiBoxChoice ul li {
  display: inline-block;
  padding: 6px 12px;
  margin-right: 2px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background: #13a555;
  border-radius: 4px;
  cursor: pointer;
}

.uiBoxChoice ul li.selected {
  background: #000;
  color: #fff;
}

.uiPopupItem {
  background-color: #fff;
  height: 300px;
  width: 450px;
  overflow: auto;
  padding: 5px 5px;
  box-shadow: 3px 3px 5px #0e0e0e;
  border: 1px solid #0e0e0e;
}

.uiFormMini,
.uiPopupItem {
  background-color: #fff;
}

.notifyjs-rep-base {
  width: 250px;
  min-height: 50px;
  margin-bottom: 10px;
  background: #f2bcf8;
  padding: 1px;
  border-radius: 3px;
  box-shadow: 1px 1px 2px #0e0e0e;
}
.notifyjs-rep-base .cross {
  display: block;
  position: absolute;
  width: 15px;
  height: 15px;
  cursor: pointer;
  top: 2px;
  right: 5px;
}
.notifyjs-rep-base .cross:after {
  content: "x";
  text-align: center;
  display: block;
  font-size: 15px;
  font-weight: bold;
  padding-top: 0px;
  color: #ba00e5;
}
.notifyjs-rep-base .title {
  color: #000;
  font-weight: bold;
  padding: 3px;
}
.notifyjs-rep-base .msg {
  padding: 3px;
  text-align: left;
  font-size: 12px;
}
.notifyjs-rep-base .msg .link {
  font-weight: bold;
  color: #000;
  font-size: 11px;
  text-decoration: underline;
}

.phSearchPanel .MuiIconButton-root {
  padding-top: 12px;
  padding-left: 0px;
}
.phSearchPanel .MuiFormControl-marginNormal {
  margin-top: 0px;
}
.phSearchPanel .MuiInputAdornment-positionEnd {
  margin-left: 0px;
}
.phSearchPanel .MuiSvgIcon-root {
  font-size: 25px;
}
.phSearchPanel .MuiIconButton-root {
  color: #4e342e;
}

.MuiPaper-elevation3 hr {
  margin: 10px 10px 5px;
}
.MuiPaper-elevation3 .uiSaveAction {
  margin: 0px;
}

.uiCriteriaUpdater {
  box-shadow: 3px 3px 5px #6a6767, -2px 1px 5px #6a6767;
  padding: 10px;
}
.uiCriteriaUpdater .uiLbl {
  display: inline-block;
  width: 80px;
}
.uiCriteriaUpdater li {
  margin-top: 5px;
}
.uiCriteriaUpdater select {
  width: 150px;
}
.uiCriteriaUpdater input {
  width: 150px;
}
.uiCriteriaUpdater .uiActionButton {
  width: 150px;
  margin-left: 80px;
}
.uiCriteriaUpdater .MuiFormControl-root.MuiTextField-root.uiHide {
  float: right;
  width: 125px;
}
.uiCriteriaUpdater .MuiFormControl-root.MuiTextField-root.uiHide button {
  padding-top: 30px;
  padding-left: 0px;
  left: 0px;
}
.uiCriteriaUpdater span.MuiIconButton-label {
  text-align: left;
  display: block;
}
.uiCriteriaUpdater .MuiSvgIcon-root {
  margin-top: 10px;
}
.uiCriteriaUpdater .MuiIconButton-root:hover {
  background-color: transparent;
}
.uiCriteriaUpdater .MuiFormHelperText-root.Mui-error {
  text-align: right;
}
.uiCriteriaUpdater .MuiInput-root {
  height: 20px;
}
.uiCriteriaUpdater .MuiIconButton-root {
  padding-left: 0px;
}
.uiCriteriaUpdater .MuiFormControl-marginNormal {
  margin: 0px;
}
.uiCriteriaUpdater .MuiInputAdornment-positionEnd {
  margin: 0px;
}

.phBookingGrid {
  display: grid;
  grid-template-columns: 40fr 15fr 15fr 30fr;
  grid-template-areas: "itin request request bHeader" "itin request request bHeader" "pax pax pax pax" "attach attach Trans Trans";
  grid-column-gap: 15px;
  grid-row-gap: 15px;
}
.phBookingGrid .phSectionPassenger {
  grid-area: pax;
  background: #fff;
}
.phBookingGrid .phSectionAttach {
  grid-area: attach;
  background: #fff;
}
.phBookingGrid .phSectionRequest {
  grid-area: request;
  background: #fff;
}
.phBookingGrid .phSectionItinerary {
  grid-area: itin;
  background: #fff;
}
.phBookingGrid .phSectionHeader {
  grid-area: bHeader;
  background: #fff;
}
.phBookingGrid .phSectionTrans {
  grid-area: Trans;
  background: #fff;
}

.phBookingItinGrid {
  display: grid;
  grid-template-rows: 20px 75px 20px 20px 20px;
  grid-template-columns: 32fr 10fr 10fr 12fr 16fr 15fr 5fr;
  grid-template-areas: "airlineName airlineName vehicle vehicle class class childViews" "orgDest orgDest orgDest orgDest cost cost actionBtn" "pnr pnr pnr pnr bkActionBtn bkActionBtn bkActionBtn" "pax pax pax remark remark remark remark" "ref1 ref1 ref1 ref2 ref2 ref2 ref2";
  grid-column-gap: 1px;
  grid-row-gap: 1px;
  border-bottom: 1px solid #258625;
  padding: 2px 2px 2px 5px;
}
.phBookingItinGrid .uiLbl {
  display: inline-block;
  width: 40px;
}
.phBookingItinGrid .phAirlineName {
  grid-area: airlineName;
  background: #fff;
}
.phBookingItinGrid .phClass {
  grid-area: class;
  background: #fff;
}
.phBookingItinGrid .phVehicle {
  grid-area: vehicle;
  background: #fff;
}
.phBookingItinGrid .phConfirmDate {
  grid-area: confirmDate;
  background: #fff;
}
.phBookingItinGrid .phPnr {
  grid-area: pnr;
  background: #fff;
}
.phBookingItinGrid .phOrgDest {
  grid-area: orgDest;
  background: #fff;
}
.phBookingItinGrid .phCost {
  grid-area: cost;
  background: #fff;
}
.phBookingItinGrid .phIssueCancel {
  grid-area: bkActionBtn;
  background: #fff;
}
.phBookingItinGrid .phIssueCancel .uiConfirm, .phBookingItinGrid .phIssueCancel .uiCancel {
  height: 20px;
  line-height: 8px;
}
.phBookingItinGrid .phActionBtn {
  grid-area: actionBtn;
  background: #fff;
}
.phBookingItinGrid .phPax {
  grid-area: pax;
  background: #fff;
}
.phBookingItinGrid .phPax div {
  margin-right: 3px;
}
.phBookingItinGrid .phRemark {
  grid-area: remark;
  background: #fff;
}
.phBookingItinGrid .phChildViews {
  grid-area: childViews;
  background: #fff;
}
.phBookingItinGrid .phRef1 {
  grid-area: ref1;
  background: #fff;
}
.phBookingItinGrid .phRef2 {
  grid-area: ref2;
  background: #fff;
}

.phFlightDetailGrid {
  display: grid;
  grid-template-rows: 25px 260px 115px 30px;
  grid-template-columns: 23% 21% 26% 30%;
  grid-template-areas: "back back back back" "flightDetail flightDetail costDetail costDetail" "baggage priceMsg costDetail costDetail" "pax pax pax pax";
  grid-row-gap: 1px;
}
.phFlightDetailGrid .phBackViews {
  grid-area: back;
  background: #fff;
}
.phFlightDetailGrid .phFlightDetailViews {
  grid-area: flightDetail;
  background: #fff;
}
.phFlightDetailGrid .phCostDetailViews {
  grid-area: costDetail;
  background: #fff;
}
.phFlightDetailGrid .phBaggageViews {
  grid-area: baggage;
  background: #fff;
}
.phFlightDetailGrid .phPriceMsgViews {
  grid-area: priceMsg;
  background: #fff;
}
.phFlightDetailGrid .phPaxViews {
  grid-area: pax;
  border-top: 1px solid #313131;
  background: #fff;
}

.phBookingDashboardGrid {
  display: grid;
  grid-template-columns: 25% 25% 25% 25%;
  grid-template-areas: "summary1 summary2 summary3 summary4 " "booking booking booking booking";
  grid-row-gap: 1px;
  padding: 10px;
  background: white;
}
.phBookingDashboardGrid .phSectionSummary1 {
  grid-area: summary1;
  background: #fff;
}
.phBookingDashboardGrid .phSectionSummary2 {
  grid-area: summary2;
  background: #fff;
}
.phBookingDashboardGrid .phSectionSummary3 {
  grid-area: summary3;
  background: #fff;
}
.phBookingDashboardGrid .phSectionSummary3 .uiTotal {
  float: left;
  margin: 0px 5px;
}
.phBookingDashboardGrid .phSectionSummary3 .uiPrice {
  padding-right: 6px;
}
.phBookingDashboardGrid .phSectionSummary4 {
  grid-area: summary4;
  background: #fff;
}
.phBookingDashboardGrid .phSectionSummary4 .uiTotal {
  float: left;
  margin: 0px 5px;
}
.phBookingDashboardGrid .phSectionSummary4 .uiPrice {
  padding-right: 6px;
}
.phBookingDashboardGrid .phSectionBooking {
  grid-area: booking;
  background: #fff;
}
.phBookingDashboardGrid .phAction {
  padding-bottom: 5px;
  border-bottom: 1.5px solid #b8860b;
}
.phBookingDashboardGrid .primaryTab {
  background: linear-gradient(to bottom, #b8860b 0%, #d5ae4f 100%);
  border-radius: 10px;
  color: white;
  width: 200px;
  text-align: center;
  display: inline-block;
  margin-right: 10px;
}
.phBookingDashboardGrid .uiTabsNav > li {
  border: 1.5px solid #007ff6;
  background-color: #fff;
  font-weight: bold;
  color: #007ff6;
  border-top-right-radius: 5px;
  border-top-left-radius: 5px;
}

.phQCRequestGrid {
  background: white;
}
.phQCRequestGrid .phSectionSamplingInfo {
  display: grid;
  grid-template-columns: 25% 75%;
  grid-template-areas: "list group";
  grid-column-gap: 3px;
  background: white;
  overflow: hidden;
}
.phQCRequestGrid .phSectionSamplingInfo .phSectionSamplingList {
  grid-area: list;
  background: white;
  overflow-y: scroll;
}
.phQCRequestGrid .phSectionSamplingInfo .phSectionSamplingGroup {
  grid-area: group;
  background: white;
  overflow-y: scroll;
}
.phQCRequestGrid .phGroupSampling {
  display: grid;
  grid-template-columns: 50% 50%;
  grid-template-areas: "sd sp";
  grid-column-gap: 3px;
  background: white;
  overflow: hidden;
}
.phQCRequestGrid .phGroupSampling .phSectionSamplingDetail {
  grid-area: sd;
  background: white;
}
.phQCRequestGrid .phGroupSampling .phSectionSamplingParams {
  grid-area: sp;
  background: white;
  overflow-y: scroll;
}
.phQCRequestGrid .phGroupSampling .phSectionSamplingParams .uiSearchHeading {
  background-color: white;
  color: black;
  border-bottom: 1px solid #3f3f3f;
  margin-bottom: 2px;
}

.phStorageGrid .phSectionHeader {
  background: #fff;
}
.phStorageGrid .phSectionHeader .uiGridColOne > ul > li,
.phStorageGrid .phSectionHeader .uiGridCol > ul > li {
  display: inline-block;
}
.phStorageGrid .phSectionPendingItems {
  background: #fff;
}
.phStorageGrid .phSectionPendingItems .phViewArea .phViewContentContainer {
  max-height: 515px;
  overflow: auto;
}
.phStorageGrid .phSectionLocations {
  background: #fff;
}
.phStorageGrid .phSectionLocations .phViewArea .phViewContent {
  overflow: hidden;
}
.phStorageGrid .phSectionLocations .phViewContent .uiRowBoxContainer {
  margin: 5px;
  border: 1px solid black;
  min-height: 150px;
}
.phStorageGrid .phSectionLocations .phViewContent .uiSelectedRowBoxContainer {
  margin: 5px;
  border: 1px solid #00600f;
  background-color: #d7ffd9;
  min-height: 150px;
}
.phStorageGrid .phSectionLocations .phViewContent .uiRowBoxContainer .uiHeaderBlock,
.phStorageGrid .phSectionLocations .phViewContent .uiSelectedRowBoxContainer .uiHeaderBlock {
  text-align: center;
  vertical-align: middle;
  border-bottom: 1px dashed #00600f;
  font-size: 11px;
}

.uiProductionTable .uiColumnQty {
  width: 70px;
}

.uiProductionTable .uiColumnQtySpacious {
  width: 70px;
}

.uiOSProdDetail {
  width: 150px;
}
.uiOSProdDetail .uiDetailRow {
  float: left;
  margin: 2px 10px 2px 0px;
  box-shadow: 2px 3px 3px 0px rgba(0, 0, 0, 0.25);
}
.uiOSProdDetail .uiDetailRow .uiProdInfoLeft {
  min-width: 30px;
  display: inline-block;
  text-align: center;
  padding: 3px 5px;
}
.uiOSProdDetail .uiDetailRow .uiProdInfoRight {
  min-width: 30px;
  display: inline-block;
  text-align: center;
  padding: 3px 5px;
}

.uiProdTaskDashRow {
  width: 280px;
}
.uiProdTaskDashRow .uiBar {
  width: 230px;
}
.uiProdTaskDashRow .uiBarInfo {
  width: 230px;
}
.uiProdTaskDashRow .uiDashboardGroup {
  width: 260px;
}
.uiProdTaskDashRow .uiDashboardGroup .uiRecordContainer {
  width: 230px;
}
.uiProdTaskDashRow .uiDashboardGroup .uiFooterBlock {
  width: 260px;
}
.uiProdTaskDashRow .uiBoxSection170 {
  max-width: 260px;
  width: 260px;
}
.uiProdTaskDashRow .uiDashViewD .uiContentBlock {
  width: 260px;
}

.uiCostCard .uiGroupRowTypeL .uiGroupType,
.uiCostCard .uiGroupRowTypeO .uiGroupType,
.uiCostCard .uiGroupRowTypeM .uiGroupType {
  color: #0080ff;
}
.uiCostCard .uiGroupRowTypeA .uiGroupType,
.uiCostCard .uiGroupRowTypeR .uiGroupType {
  color: #ff7961;
}
.uiCostCard .uiGroupTotal {
  border-top: 3px double #000;
  border-bottom: 1px solid #000;
  margin-top: 10px;
}

.GoogleSignin {
  display: block;
  cursor: pointer;
  border: medium none;
  padding: 3px 10px 3px 3px;
  font-size: 20px;
  font-weight: bold;
  color: #999696;
  border-radius: 15px;
  background-color: #ffffff;
}
.GoogleSignin img {
  margin-right: 5px;
}

.message {
  display: none;
}

.tooltip {
  color: #000;
}

.loading,
.uiInputMsg {
  top: 100px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  text-align: center;
  font-size: 1em;
  font-weight: bold;
  padding: 5px;
  box-shadow: 10px 10px 5px #888888;
  border-radius: 6px;
  z-index: 1000;
  display: block;
}

.loading {
  background-color: #000;
  color: #fff;
}

.uiInputMsg {
  background-color: #a8e7f7;
  color: #0000ff;
}

.uiInputErr {
  background-color: #fdfdfd;
  border: 3px solid #f35d63;
  position: absolute;
  margin: 0px 10px;
  text-align: left;
  font-size: 15px;
  font-weight: bold;
  max-width: 350px;
  min-width: 250px;
  padding: 8px 3px;
  box-shadow: 7px 7px 5px #888888;
  border-radius: 3px;
  z-index: 1000;
  display: block;
  color: #ff7961;
}

.uiInlineErr {
  background-color: #fdfdfd;
  border: 1px solid #f35d63;
  text-align: left;
  font-weight: bold;
  padding: 5px 3px;
  border-radius: 3px;
  display: inline-block;
  width: 100%;
  color: #ff7961;
}

.uiLbl {
  display: inline-block;
  width: 135px;
  font-weight: bold;
  text-align: left !important;
}

.uiLblS {
  display: inline-block;
  width: 90px;
  font-weight: bold;
  text-align: left !important;
}

.uiLblF {
  display: block;
  width: 100%;
  font-weight: bold;
  text-align: left !important;
}

.uiLblInLine {
  display: inline-block;
  font-weight: bold;
  margin: 0px 5px;
}

.uiVal {
  display: inline-block;
  padding: 3px 0px;
  text-align: justify;
}

.uiForm .uiLbl {
  width: 135px;
}

.uiFormFree .uiLbl {
  width: unset;
}

.uiFormMini .uiLbl {
  width: 60px;
}
.uiFormMini .uiLblInLine {
  font-weight: bold;
  width: 60px;
  margin-left: 10px;
}

.uiFormMacro .uiLbl {
  width: 50px;
  font-size: 10px;
}
.uiFormMacro .uiVal {
  width: 30px;
  font-size: 10px;
  text-align: center;
}

.uiShortHand .uiLbl {
  color: rgba(0, 0, 0, 0.87);
}

.uiBold {
  font-weight: bold;
}

.uiGridColOne > ul > li,
.uiGridCol > ul > li {
  margin: 3px 0px;
  box-sizing: border-box;
  border-bottom: 1px dotted #00600f;
  overflow: auto;
  min-height: 25px;
}

.uiGridColOne > ul > li:last-child,
.uiGridCol > ul > li:last-child {
  border-bottom: none;
}

.uiGridColOne > .uiCol,
.uiGridCol > .uiCol {
  display: block;
  float: left;
  width: 100% !important;
}

.uiCol > ul > li {
  margin: 3px 0px;
  box-sizing: border-box;
  border-bottom: 1px dotted #00600f;
  overflow: auto;
  min-height: 25px;
}

.uiCol > ul > li:last-child {
  border-bottom: none;
}

.uiCol > ul > li .uiAction {
  float: right;
}

.detailcontents .phSection .sAppWorkflow {
  height: 450px;
}

.detailcontents .phSection .sComments {
  height: 215px;
}

.phSectionContents > .phListHeader,
.phSectionContents > .phListContents,
.phSectionContents > .phListSummary {
  display: block;
  width: 100%;
  min-width: 180px;
}

.phSectionContents > .phListHeader,
.phSectionContents > .phListSummary {
  background-color: #eee;
}

.phSectionContents > .phListHeader {
  border-bottom: 1px solid #ccc;
}

.detailcontents > .phRightColumn .sFixed {
  height: 175px;
  overflow: auto;
}

.detailcontents > .phRightColumn > table {
  width: 100%;
  border-collapse: collapse;
}

.detailcontents > .phRightColumn table th,
.detailcontents > .phRightColumn table td {
  font-size: 12px !important;
  padding: 5px;
  box-sizing: border-box;
  border-bottom: 1px solid #eee;
}

.detailcontents > .phRightColumn table thead th {
  background-color: #eee;
  border-top: 1px solid rgba(50, 50, 50, 0.5);
  color: #000;
  font-weight: bold;
  text-align: left;
}

.detailcontents > .phRightColumn table .listHeader th {
  background-color: #eee;
}

.detailcontents > .phRightColumn .listSupplier td:first-child {
  width: 40%;
}

.detailcontents > .phRightColumn table tfoot td {
  background-color: #eee;
  font-weight: bold;
}

.detailcontents > .phRightColumn table tr td .listLabel,
.detailcontents > .phRightColumn table tr td .listData {
  display: inline-block;
}

.detailcontents > .phRightColumn table tr td .listLabel {
  width: 30px;
}

.phItemList {
  border: 1px solid #ccc;
  margin: 10px 0px;
  border-radius: 5px;
}

.phViewArea {
  display: block;
  overflow: auto;
  border-radius: 5px;
}
.phViewArea .phPopupContainer {
  border-radius: 0px 0px 5px 5px;
}
.phViewArea .phViewHeading {
  background: #00600f;
  color: #fff;
  padding: 3px;
  font-weight: bold;
  overflow: auto;
  border-radius: 5px 5px 0px 0px;
  border-bottom: 1px solid #fff;
}
.phViewArea .phViewHeading .phTitle {
  float: left;
  padding: 0px;
}
.phViewArea .phViewHeading .phAction {
  float: right;
}
.phViewArea .phViewHeading .phAction .uiApproveIconButton,
.phViewArea .phViewHeading .phAction .uiRejectIconButton,
.phViewArea .phViewHeading .phAction .uiActionIconButton {
  border: 1px solid #fff;
  padding: 0px;
  margin: 0px 3px;
}
.phViewArea .phViewHeading .phAction .uiActionButton {
  border: 1px solid #fff;
  padding: 3px 5px;
  margin: 0px 1px;
}
.phViewArea .phViewContent {
  background: #fff;
}
.phViewArea .phPopupContent {
  background: #fff;
  padding: 1px;
}
.phViewArea .phViewAction {
  background: #fff;
}
.phViewArea .uiBlackContainer .phViewAction {
  background: unset;
}
.phViewArea .phViewAction .phAction {
  margin: 5px;
}

.uiFormMini,
.uiForm {
  margin: 0;
  padding: 0;
  list-style: none;
}

.uiFormMini li,
.uiForm li {
  position: relative;
  display: block;
  overflow: auto;
  padding: 7px 0;
}

.uiFormMini li .uiColumn,
.uiForm li .uiColumn {
  position: relative;
  width: 50%;
  float: left;
}

.uiFormMini li > span,
.uiForm li > span {
  padding-top: 5px;
  margin-left: 5px;
}

.uiFormMini li input[type=text],
.uiForm li input[type=text] {
  width: 175px;
}

.uiListTable,
.uiSearchResults {
  border-radius: 3px;
}
.uiListTable .uiCol_Fixed,
.uiSearchResults .uiCol_Fixed {
  border-left: 1px solid #EFEBE9;
}
.uiListTable .row-selector,
.uiSearchResults .row-selector {
  color: #000;
  cursor: pointer;
  text-decoration: none;
  width: 55px;
  padding: 3px 2px;
  display: block;
  text-align: center;
  background-color: #ffb1ff;
}
.uiListTable .row-selector:hover,
.uiSearchResults .row-selector:hover {
  color: #000;
  text-decoration: underline;
}
.uiListTable .row-selected .row-selector,
.uiSearchResults .row-selected .row-selector {
  background-color: #b1e1ff;
}
.uiListTable .uiGridBody .uiGridRowType_3, .uiListTable .uiSearchRow,
.uiSearchResults .uiGridBody .uiGridRowType_3,
.uiSearchResults .uiSearchRow {
  background-color: #fff;
  border-bottom: 1px solid #EFEBE9;
}
.uiListTable .uiGridBody .uiGridRowType_3:last-child, .uiListTable .uiSearchRow:last-child,
.uiSearchResults .uiGridBody .uiGridRowType_3:last-child,
.uiSearchResults .uiSearchRow:last-child {
  border-bottom: none;
}
.uiListTable .uiGridBody .uiGridRowType_3:hover, .uiListTable .uiSearchRow:hover,
.uiSearchResults .uiGridBody .uiGridRowType_3:hover,
.uiSearchResults .uiSearchRow:hover {
  background-color: #d7ffd9;
}
.uiListTable .uiGridBody .uiGridRowType_3:hover .uiCol_Fixed, .uiListTable .uiSearchRow:hover .uiCol_Fixed,
.uiSearchResults .uiGridBody .uiGridRowType_3:hover .uiCol_Fixed,
.uiSearchResults .uiSearchRow:hover .uiCol_Fixed {
  border-top: 1px solid #00600f;
  border-bottom: 1px solid #00600f;
}
.uiListTable .uiSearchHeading, .uiListTable .uiGridHeading .uiGridRowType_2,
.uiSearchResults .uiSearchHeading,
.uiSearchResults .uiGridHeading .uiGridRowType_2 {
  padding: 1px 0px;
  background-color: #00600f;
  font-weight: bold;
  color: #fff;
}
.uiListTable .uiSearchSubList li,
.uiSearchResults .uiSearchSubList li {
  padding: 3px 0px 3px 0px;
  border-bottom: 1px solid #EFEBE9;
}
.uiListTable .uiSearchSubList li:last-child,
.uiSearchResults .uiSearchSubList li:last-child {
  padding: 3px 0px 0px 0px;
  border-bottom: none;
}
.uiListTable .uiSearchRow > td, .uiListTable .uiGridBody .uiCol_Fixed, .uiListTable .uiGridHeading .uiCol_Fixed,
.uiSearchResults .uiSearchRow > td,
.uiSearchResults .uiGridBody .uiCol_Fixed,
.uiSearchResults .uiGridHeading .uiCol_Fixed {
  padding: 1px 2px;
  border-bottom: 1px solid #EFEBE9;
}
.uiListTable .uiCompact .uiSearchRow > td, .uiListTable .uiCompact .uiGridBody .uiCol_Fixed, .uiListTable .uiCompact .uiGridHeading .uiCol_Fixed,
.uiSearchResults .uiCompact .uiSearchRow > td,
.uiSearchResults .uiCompact .uiGridBody .uiCol_Fixed,
.uiSearchResults .uiCompact .uiGridHeading .uiCol_Fixed {
  padding: 1px 2px;
  border-bottom: 1px solid #EFEBE9;
}
.uiListTable .uiComfortable .uiSearchRow > td, .uiListTable .uiComfortable .uiGridBody .uiCol_Fixed, .uiListTable .uiComfortable .uiGridHeading .uiCol_Fixed,
.uiSearchResults .uiComfortable .uiSearchRow > td,
.uiSearchResults .uiComfortable .uiGridBody .uiCol_Fixed,
.uiSearchResults .uiComfortable .uiGridHeading .uiCol_Fixed {
  padding: 3px 5px;
  border-bottom: 1px solid #EFEBE9;
}
.uiListTable .uiCozy .uiSearchRow > td, .uiListTable .uiCozy .uiGridBody .uiCol_Fixed, .uiListTable .uiCozy .uiGridHeading .uiCol_Fixed,
.uiSearchResults .uiCozy .uiSearchRow > td,
.uiSearchResults .uiCozy .uiGridBody .uiCol_Fixed,
.uiSearchResults .uiCozy .uiGridHeading .uiCol_Fixed {
  padding: 7px 7px;
  border-bottom: 1px solid #EFEBE9;
}
.uiListTable .uiGridHeading .uiColSearch,
.uiSearchResults .uiGridHeading .uiColSearch {
  cursor: pointer;
  text-decoration: underline;
}
.uiListTable .uiImage,
.uiSearchResults .uiImage {
  height: 100px;
  width: 100px;
  align-self: center;
  justify-self: center;
}
.uiListTable .uiImage img,
.uiSearchResults .uiImage img {
  height: 100px;
  width: 100px;
}

.listSearchResults table td .listItemDetails li > span,
.listSearchResults table th > span {
  display: inline-block;
  width: 100px;
  line-height: 1.5;
}

.listSearchResults table td .listItemDetails li > span.catimg {
  width: 20px;
  height: 100%;
  font-size: 9px;
  text-align: center;
}

.listItemDetails table tr td {
  padding-bottom: 25px;
}

.listItemDetails table tr td:last-child {
  padding: 0;
}

.listItemDetails table td .uiActionButton {
  background-color: #ccc;
}

.listItemDetails table td .uiActionButton:hover {
  background-color: #000;
}

.uiFrmSection {
  border: 1px solid #00600f;
  border-radius: 3px;
  margin-top: 1px;
}

.uiSecTitle {
  display: block;
  font-weight: bold;
  padding: 8px 5px;
  color: #005005;
}

.uiFrmSection .uiSecContents {
  width: 100%;
  display: block;
  overflow: auto;
}

.uiFrmSection .uiColumn {
  width: 35%;
  display: block;
  float: left;
}

.uiFrmSection .uiColumn span {
  display: block;
  padding: 3px 5px;
  float: left;
}

.uiFrmSection .uiColumn .uiInput {
  width: 60px;
}

.uiTimeInput {
  width: 50px;
  text-align: center;
  padding: 2px 1px;
}

.uiAddBox {
  height: 120px;
  width: 150px;
  text-align: center;
  margin: 20px 0px;
  border: 1px solid #000;
  font-size: 30px;
  background-color: #cecece;
}

.uiAddBox a {
  margin: 25% auto;
  display: block;
}

.uiAddBox a:hover {
  text-decoration: none;
}

.uiHighlightText {
  font-weight: bold;
}

.uiSectionInline {
  float: left;
}

.uiSection250 {
  width: 250px;
}

.uiSection300 {
  width: 300px;
}

.uiSection350 {
  width: 350px;
}

.uiSection370 {
  width: 370px;
}

.uiSection400 {
  width: 400px;
}

.uiSection450 {
  width: 450px;
}

.uiSection500 {
  width: 500px;
}

.uiGridColOne li > span,
.uiGridCol li > span,
.uiGridColTwo li > span,
.uiGridColThree li > span {
  display: inline-block;
  padding-top: 0px;
}

.uiGridColOne > ul,
.uiGridCol > ul,
.uiGridColTwo > ul,
.uiGridColThree > ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.uiGridColOne li,
.uiGridCol li,
.uiGridColTwo li,
.uiGridColThree li {
  display: block;
  overflow: auto;
  padding: 2px 0;
}

.uiGridColOne li #cmt,
.uiGridCol li #cmt,
.uiGridColTwo li #cmt,
.uiGridColThree li #cmt {
  position: relative;
  width: 100%;
  float: left;
}

.uiGridColOne li .uiColumn,
.uiGridCol li .uiColumn,
.uiGridColTwo li .uiColumn,
.uiGridColThree li .uiColumn {
  width: 50%;
  float: left;
}

.two-column {
  width: 50%;
  float: left;
}

.section-container {
  margin: 10px;
}

.uiRowWrap10 {
  margin: 10px;
}

.uiColumnContainer {
  width: 100%;
}

/*tabs */
.tab-list {
  border-bottom: 1px solid #ccc;
  padding-left: 0;
}

.tab-list-item {
  display: inline-block;
  list-style: none;
  margin-bottom: -1px;
  padding: 0.5rem 0.75rem;
}

.tab-list-active {
  background-color: white;
  border: solid #ccc;
  border-width: 1px 1px 0 1px;
}

.uiTabContainer {
  display: inline-block;
  margin-bottom: 1px;
}

.uiTabDetails {
  margin-top: 0px;
}

.uiTabDetails::after {
  content: "";
  display: table;
  clear: both;
}

.uiROHeader {
  background-color: #000000;
  color: White;
  font-weight: bold;
  padding: 10px;
}

.uiBlankColumn15 {
  height: 15px;
}

.uiSpacerUD10 {
  margin: 10px 0px;
}

.uiSpacer {
  margin-top: 0px;
}

.uiSpacer3 {
  margin-top: 3px;
}

.uiSpacer5 {
  margin-top: 5px;
}

.uiSpacer10 {
  margin-top: 10px;
}

.uiSpacer15 {
  margin-top: 15px;
}

.uiSpacer20 {
  margin-top: 20px;
}

.uiSpacer80 {
  margin-top: 80px;
}

.uiSpacerH5 {
  display: inline-block;
  margin: 0px 5px;
}

.uiSpacerH10 {
  display: inline-block;
  margin: 0px 10px 0px 10px;
}

.uiSpacerH15 {
  display: inline-block;
  margin: 0px 15px;
}

.uiSpacerH20 {
  display: inline-block;
  margin: 0px 20px;
}

.uiSpacerH25 {
  display: inline-block;
  margin: 0px 25px;
}

.uiSpacerH30 {
  display: inline-block;
  margin: 0px 30px;
}

.uiSpacerH35 {
  display: inline-block;
  margin: 0px 35px;
}

.uiSpacerH50 {
  display: inline-block;
  margin: 0px 50px;
}

.uiSpacerH5 {
  margin: 0px 5px;
}

.uiSpacerL2 {
  margin-left: 2px;
}

.uiSpacerL5 {
  margin-left: 5px;
}

.uiSpacerL10 {
  margin-left: 10px;
}

.uiSpacerL20 {
  margin-left: 20px;
}

.uiSpacerL50 {
  margin-left: 50px;
}

.uiSpacerR2 {
  margin-right: 2px;
}

.uiHeight35 {
  height: 35px;
}

.uiFormEditor {
  margin: 0;
  padding: 0;
  list-style: none;
}

.uiFormEditor li {
  position: relative;
  display: block;
  overflow: auto;
  padding: 7px 0;
}

.uiFormEditor li .uiColumn {
  position: relative;
  width: 50%;
  float: left;
}

.uiHeaderElement {
  font-weight: bold;
  margin: 3px 0px;
  color: darkgreen;
}

.uiBox {
  padding: 3px;
  width: auto;
  margin: 5px 0px;
}

.uiBox300p {
  align-self: flex-start;
  width: 300px;
}

.uiColumnSet {
  display: flex;
  flex-flow: row wrap;
  gap: 10px 0px;
  justify-content: flex-start;
  align-items: flex-start;
  align-content: flex-start;
}

.uiBoxSet {
  padding: 3px;
  width: auto;
  margin: 5px 0px;
}

li.uiColumns200 {
  width: 200px;
  float: left;
}

.uiBulletList {
  list-style: square none inside;
}

li.uiColumns300 {
  width: 300px;
  float: left;
}

.uiContentRight {
  text-align: right;
}

.uiAnnounceRow {
  padding: 5px;
}

.uiRowBoxContainer {
  border: 1px solid #0080ff;
  padding: 5px;
  margin: 10px 0px 0px 0px;
  border-radius: 3px;
}

.uiGroupHeader {
  margin: 3px 5px 0px 5px;
}

.uiGroupContent {
  box-shadow: 3px 3px 5px #6a6767, -2px 1px 5px #6a6767;
  z-index: 0;
  padding: 2px 3px;
  margin: 0px 5px 5px 5px;
  border-radius: 0px;
}

.uiRowBoxContainer2 {
  border: 1px solid #0080ff;
  border-top: 3px solid #0080ff;
  padding: 5px;
  margin: 0px 10px 10px 10px;
  border-radius: 3px;
}

.uiRoundedBox1 {
  background-color: #ffffff;
  border: 1px solid #008cff !important;
  padding: 5px 0px 0px 0px;
  border-radius: 3px;
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  display: inline-block;
}

.uiCircle20 {
  width: 20px;
  height: 20px;
  margin: 3px 0px 0px 0px;
  float: right;
  text-align: center;
  background-color: #4e342e;
  color: #ffffff;
  font-size: 10px;
  font-weight: bold;
  border-radius: 50%;
}

.childSectionTitle {
  font-weight: bold;
}

.uiChildSection {
  padding: 0px 5px;
}

.uiRowBoxContainer .uiChildSection {
  padding: 0px;
}

.uiSectionContainer .uiActivator {
  font-weight: bold;
  color: #0000FF;
  cursor: pointer;
  margin-right: 10px;
}

.uiSectionContainer > a:hover,
.uiChildSection a:hover {
  color: #000;
}

.uiChildSection a {
  font-weight: bold;
  color: #0a8ab5;
  cursor: pointer;
  margin-right: 10px;
  text-decoration: underline;
}

.uiBlock,
.block,
.uiBlock100,
.uiBoxData .sectionButton {
  display: block;
}

.uiBlock100 {
  width: 100%;
}

.uiMultiTags {
  display: inline-block;
  padding: 0;
  margin: 0;
  background: none;
}

.uiMultiTags ul li {
  display: inline-block;
  padding: 6px 12px;
  margin-right: 7px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  background-color: #2864b6;
  position: relative;
}

.uiTagInput {
  padding: 6px 0px;
}

.uiVal50p {
  width: 55%;
}

.uiVal20 {
  width: 20px;
}

.uiVal30 {
  width: 30px;
}

.uiVal40 {
  width: 40px;
}

.uiVal50 {
  width: 50px;
}

.uiVal70 {
  width: 70px;
}

.uiAlignRight {
  text-align: right;
}

.uiShrinkInSort {
  max-width: 100%;
}

.uiBoxHiddenAction .uiActionBlock {
  display: none;
}
.uiBoxHiddenAction:hover .uiActionBlock {
  display: block;
}

.uiBoxAttachment {
  min-height: 70px;
}
.uiBoxAttachment .uiAccessory {
  height: 15px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
  border: 1px solid #ccc;
  border-bottom-style: none;
}
.uiBoxAttachment .uiFileBlock {
  display: block;
  padding: 5px;
  border: 1px solid #ccc;
  border-radius: 5px;
  margin: 3px 0px 0px 0px;
  width: 200px;
  background-color: #fff;
  text-align: center;
  font-size: 12px;
  height: 30px;
  overflow: hidden;
}
.uiBoxAttachment .uiInfoBlock {
  display: none;
  font-size: 11px;
  height: 15px;
  overflow: hidden;
  width: 200px;
}
.uiBoxAttachment:hover .uiInfoBlock {
  display: block;
}
.uiBoxAttachment .uiActionBlock {
  display: none;
}
.uiBoxAttachment:hover .uiActionBlock {
  display: block;
}

.uiBoxImage {
  min-height: 170px;
}
.uiBoxImage .uiAccessory {
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
  border-bottom-left-radius: 0px;
  border-bottom-right-radius: 0px;
  border: 1px solid #ccc;
  border-bottom-style: none;
}
.uiBoxImage .uiFileBlock {
  display: block;
  position: relative;
  padding: 5px;
  border: 1px solid #ccc;
  border-top-style: none;
  border-radius: 5px;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  width: 100%;
  background-color: #fff;
  text-align: center;
  font-size: 12px;
  height: 100px;
}
.uiBoxImage .uiFileBlock img {
  height: 80px;
  width: 100%;
}
.uiBoxImage .uiActionAdd {
  height: 100px;
  width: 155px;
  padding-top: 5px;
  background-position: left top;
  text-align: center;
}
.uiBoxImage .uiDefaultItemNo {
  display: none;
}
.uiBoxImage .uiDefaultItemYes {
  display: block;
  position: absolute;
  width: 25px;
  height: 25px;
  top: -7px;
  right: -7px;
  background-color: #ff0204;
  border-radius: 36px;
  background: url(../../images/ux/icoCheck.png) no-repeat;
  background-size: 25px 25px;
}
.uiBoxImage .uiInfoBlock {
  display: none;
}
.uiBoxImage:hover .uiInfoBlock {
  display: block;
}
.uiBoxImage .uiActionBlock {
  display: none;
}
.uiBoxImage:hover .uiActionBlock {
  display: block;
}

.uiShrinkInSort .uiBoxImage {
  min-height: 100px;
}
.uiShrinkInSort .uiBoxImage .uiFileBlock {
  height: 70px;
}
.uiShrinkInSort .uiBoxImage .uiFileBlock img {
  height: 100%;
}
.uiShrinkInSort .uiBoxImage:hover .uiInfoBlock {
  display: none;
}
.uiShrinkInSort .uiBoxImage:hover .uiActionBlock {
  display: none;
}

.uiInfoAvailableYes {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-color: #ff0204;
  border-radius: 36px;
  background: url(../../images/ux/icoCheck.png) no-repeat;
  background-size: 25px 25px;
}

.uiBoxHeader .uiActionAdd {
  height: 30px;
  width: 155px;
  padding-top: 5px;
  background-position: left top;
  text-align: center;
}
.uiBoxHeader .uiMainBlockClear {
  display: block;
  padding: 1px 5px;
  border: 1px solid #00600f;
  border-radius: 5px;
  margin: 0px 0px 0px 0px;
  text-align: center;
  font-size: 12px;
  min-width: 100px;
  overflow: hidden;
}
.uiBoxHeader .uiMainBlock {
  display: block;
  padding: 1px 5px;
  border: 1px solid #00600f;
  border-radius: 5px;
  margin: 3px 0px 0px 0px;
  background-color: #fff;
  text-align: center;
  font-size: 12px;
  min-width: 100px;
  overflow: hidden;
}
.uiBoxHeader .uiInfoBlock {
  font-size: 12px;
  min-width: 100px;
  overflow: hidden;
}
.uiBoxHeader .uiActionBlock {
  display: none;
}
.uiBoxHeader:hover .uiActionBlock {
  display: block;
}

.uiActionBlock a {
  display: inline-block;
  margin-right: 5px;
}

.uiBoxSection {
  margin: 5px 0px 0px 10px;
  border: 1px solid #ccc;
  border-radius: 5px 5px 0px 0px;
}

.uiBorderRoundAll {
  border-radius: 5px;
}

.uiBoxSection .composition-activator {
  padding: 5px 0px;
}

.uiBoxSection .uiBoxMessage {
  display: block;
  text-align: center;
  padding: 20px 0px;
}

.uiBoxSection150 {
  width: 150px;
  max-width: 150px;
}

.uiBoxSection170 {
  width: 170px;
  max-width: 170px;
}

.uiBoxSection200 {
  width: 200px;
  max-width: 200px;
}

.uiBoxSection150 .uiBoxData {
  min-height: 100px;
  max-height: 150px;
}

.uiBoxHeight150 {
  overflow: auto;
  height: 150px;
}

.uiRowHeight1 {
  min-height: 18px;
}

.uiRowHeight2 {
  min-height: 30px;
}

.uiBoxData50 {
  height: 50px;
  padding: 0px 5px;
}

.uiBoxSection200 {
  width: 200px;
  max-width: 200px;
}

.uiBoxSection250 {
  width: 250px;
  max-width: 250px;
}

.uiBoxSection300 {
  width: 300px;
  max-width: 300px;
}

.uiBoxSectionFullWidth {
  width: 100%;
}

.uiBoxSection200 .uiBoxData {
  min-height: 100px;
}

.uiBoxSectionFullWidth .uiBoxData {
  height: 100px;
  margin: 0px auto;
}

.uiBoxSection300 .uiScrollMsg {
  display: block;
  width: 230px;
  height: 25px;
  float: left;
}

.uiBoxTitle,
.uiListTable .uiTableTitle {
  width: 100%;
  height: 30px;
  font-weight: bold;
  background-color: #f5daa736;
  color: #000;
}

.uiBoxTitle > span,
.uiListTable .uiTableTitle > span {
  padding: 5px;
  display: block;
  vertical-align: middle;
}

.uiBoxTitle .title {
  padding: 8px 0px 0px 5px;
}

.in-line,
.uiInline,
.uiBoxTitle .uiInline {
  display: inline-block;
}

.uiInlineFloat5 {
  float: left;
  margin: 5px 5px;
}

.uiInlineFloat {
  float: left;
  margin: 5px 15px;
}

.uiListTable .uiTableTitle span, .phTitle span {
  font-size: 15px;
}

.phTitle span {
  margin: 0px 0px 0px 5px;
}

.uiListTable .uiTableTitle span {
  display: block;
  margin: 0px 0px 0px 5px;
}

.phAction {
  float: right;
}

.uiListTable .uiTableTitle .title {
  float: left;
  padding: 8px 0px 0px 5px;
}

.uiBoxTitle .action,
.uiListTable .uiTableTitle .action {
  float: right;
}

.uiListTable .uiRow,
.uiListTable .uiSearchHeading {
  width: 100%;
  padding: 5px 0px;
}

.uiListTable .uiRow50 {
  width: 100%;
  height: 50px;
}

.uiListTable .uiRow70 {
  width: 100%;
  height: 70px;
}

.uiListTable .uiColumnCenter,
.uiColumnLeft, .uiColumnRight,
.uiListTable .uiColumn {
  display: inline-block;
}

.uiCellSmallImage {
  width: 100px;
}

.uiColumnRight {
  text-align: right;
}

.uiColumnLeft {
  text-align: left;
}

.uiROCellRight {
  display: block;
  text-align: right;
}

.uiCenter {
  text-align: center;
}

.uiROCellCenter {
  display: block;
  text-align: center;
}

.uiContentCenter,
.uiListTable .uiSearchHeading .uiColumn,
.uiListTable .uiColumnCenter {
  text-align: center;
  vertical-align: middle;
}

.uiListTable .uiColumn input {
  width: 95%;
  margin: 0px 3px;
}

.uiColumn20, .uiListTable .uiColumn20 {
  width: 20px;
}

.uiColumn30, .uiListTable .uiColumn30 {
  width: 30px;
}

.uiColumn50, .uiListTable .uiColumn50 {
  width: 50px;
}

.uiColumn70, .uiListTable .uiColumn70 {
  width: 70px;
}

.uiColumn70, .uiListTable .uiColumn70 {
  width: 70px;
}

.uiColumn90, .uiListTable .uiColumn90 {
  width: 90px;
}

.uiColumn100, .uiListTable .uiColumn100 {
  width: 100px;
}

.uiColumn130, .uiListTable .uiColumn130 {
  width: 130px;
}

.uiColumn150, .uiListTable .uiColumn150 {
  width: 150px;
}

.uiColumn170, .uiListTable .uiColumn170 {
  width: 170px;
}

.uiColumn200, .uiListTable .uiColumn200 {
  width: 200px;
}

.uiColumn350, .uiListTable .uiColumn350 {
  width: 350px;
}

.uiListTable .uiColumn250 {
  width: 250px;
}

.uiListTable .uiSpacious {
  padding: 0px 5px;
}

.uiListTable .uiExtraInfoAlways,
.uiListTable .uiExtraInfo {
  color: #045eef;
}

.uiListTable .uiExtraInfo {
  display: none;
}

.uiExtraInfo .uiLink {
  color: #4286f4;
  text-decoration: underline;
}

.uiHaveExtra:hover .uiExtraInfo {
  display: block;
}

.phSectionGroup {
  clear: both;
}

.phSectionGroup .phSectionColumn {
  float: left;
}

.phSectionGroup .ui2Column {
  width: 50%;
}

.uiBoxBlue {
  background-color: #fff;
  border: 1px solid #00600f;
  margin: 10px 5px;
  padding: 5px;
}

.uiBoxBlue:hover {
  background-color: #d7ffd9;
}

.uiBoxPlain {
  background-color: #fff;
  border: 1px solid #00600f;
  margin: 10px 5px;
  padding: 5px;
}

.uiH110 {
  width: 110px;
}

.uiBar {
  padding: 3px;
  border: 1px solid #828891;
  background-color: #bdbfc1;
  color: #000000;
  width: 140px;
  text-align: left;
  margin-top: 3px;
  cursor: pointer;
  overflow: hidden;
  position: relative;
}

.uiDashOver .uiBar {
  background-color: #000000 !important;
  color: #ffffff !important;
}

.uiBarInfo {
  padding: 3px;
  border: 1px solid #fff;
  background-color: #e5e6e8;
  color: #000000;
  width: 140px;
  text-align: left;
  margin-top: 0px;
  cursor: pointer;
  overflow: hidden;
  position: relative;
}

.uiTableRecordBar {
  padding: 3px;
  border: 1px solid #828891;
  background-color: #bdbfc1;
  text-align: left;
  margin-top: 3px;
  overflow: hidden;
  position: relative;
}

.uiDashRowRCol {
  text-align: center;
  margin-left: 1px;
  top: 0px;
  height: 100%;
  color: #000;
  position: absolute;
  right: 0px;
  font-size: 11px;
  width: 25px;
}

.uiCenterLabel {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.uiRecordContainer {
  position: relative;
}

.uiDashPop {
  height: 300px;
  width: 450px;
  background-color: #fff;
  overflow: auto;
  z-index: 999;
  padding: 5px 5px;
  box-shadow: 3px 3px 5px #0e0e0e;
  border: 1px solid #0e0e0e;
}

.uiDashPop .uiFormMini {
  background-color: #fff;
  list-style: outside none none;
  overflow: visible;
  text-align: left;
}
.uiDashPop .uiFormMini li {
  display: block;
  width: 100%;
  margin-top: 2px;
  padding: 2px;
}
.uiDashPop .uiFormMini .uiLbl {
  width: 100px;
}

.uiDivider {
  border-bottom: 1px solid #4e342e;
}

.uiLeftAlignText {
  text-align: left;
}

.uiCenterAlignText {
  text-align: center;
}

.uiRightAlignText {
  text-align: right;
}

.uiPrimary {
  color: #00600f;
  font-weight: bold;
}

.uiSecondary {
  color: #4e342e;
  font-weight: bold;
}

.uiSectionDividerTitle {
  margin-top: 5px;
  color: #4e342e;
  font-weight: bold;
}

.uiBlue {
  color: #0080ff;
  font-weight: bold;
}

.uiRed {
  color: #ff7961;
  font-weight: bold;
}

.uiGreen {
  color: #255d00;
  font-weight: bold;
}

.uiGrey {
  color: #999696;
  font-weight: bold;
}

.uiESort {
  min-height: 20px;
}

.uiESort li {
  min-height: 20px;
}

.uiDashboardGroup .uiHeaderBlock {
  height: auto;
}

.uiDashViewD .uiContentBlock {
  height: 245px;
  overflow-y: scroll;
}

.uiDashViewS .uiContentBlock {
  height: 100px;
}

.uiUnHighlight {
  font-size: 10px;
}

.uiDashboardGroup .uiFooterBlock {
  height: 30px;
  background-color: #504e4e;
  margin: 0px -5px 10px -5px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}

.uiDashFixedHeader1 {
  position: fixed;
  top: 35px;
  z-index: 1;
  background: #fff;
  padding: 5px 10px;
  width: 100%;
  left: 0px;
}

.uiDashFixedHeader2 {
  position: fixed;
  z-index: 1;
  width: 100%;
}

.uiDashContentLayer1 {
  margin: 30px 0px 250px 0px;
}

.uiDashFixedFooter2 {
  position: fixed;
  bottom: 35px;
  z-index: 1;
  background: #fff;
  padding: 5px 10px;
  width: 100%;
  left: 0px;
}

.autoDataTitle {
  font-size: large;
  font-weight: bold;
  color: #000;
}

.FormFields div {
  margin-top: 20px;
}

.formAction {
  margin: 10px 0px 5px 0px;
  clear: both;
}

.formAction a {
  display: inline-block;
  padding: 5px 10px;
  background-color: #0080ff;
  border: 0;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  border-radius: 4px;
}

.formAction a:hover {
  background-color: #6fb6fc;
  color: #000;
}

.UIdbSynch .uiActionHeader {
  background-color: #7d8888;
  padding: 5px;
  color: #fff;
}

.UIdbSynch .uiActionList {
  padding: 10px 5px;
  background-color: #e6e6aa;
}

.UIdbSynch .uiActionList span {
  margin-left: 10px;
  margin-right: 3px;
}

.UIdbSynch .uiActionResultHeader {
  background-color: #aad0ec;
  padding: 10px 5px;
}

.UIdbSynch .uiActionResultList {
  list-style: none;
  padding: 0px;
  margin: 10px;
}

.uiNoPadding {
  padding: 0px;
}

.uiPadding10 {
  padding: 10px;
}

.uiBox50PInline {
  width: 45%;
  display: inline-block;
}

.uiBox20PInline {
  width: 23%;
  display: inline-block;
}

.UIdbSynch .uiActionResultListRow {
  height: 250px;
}

.UIdbSynch .uiActionResultListRow .uiHeader {
  height: 50px;
  background-color: #e2d2bf;
  padding: 3px;
}

.UIdbSynch .uiActionResultListRow .uiContent {
  height: 200px;
  overflow: auto;
}

.UIdbSynch .uiActionResultListRowMini {
  height: 95px;
}

.uiPad5 {
  padding: 5px;
}

.uiFullScreen {
  position: absolute;
  top: 0px;
  left: 0px;
  height: 100%;
  width: 100%;
  background-color: #fff;
}

.uiFullScreen .editor {
  height: 100%;
  width: 100%;
}

.uiDisabled {
  color: #ff7961;
}

.uiItalic {
  font-style: italic;
}

.uiManualInfo {
  display: block;
  margin-top: 5px;
  color: #0080ff;
}

.uiExtraInfo {
  font-style: italic;
  display: block;
  margin-top: 5px;
}

.uiInlineMargin5 {
  margin: 5px;
  padding: 0px;
}

.uiActionSection a {
  margin: 5px 2px;
}

.uiInlineBlock50p {
  width: 50%;
  float: left;
}

.uiTable {
  display: table;
}
.uiTable .uiRow {
  display: table-row;
}
.uiTable .uiCell {
  display: table-cell;
  padding: 0px 5px;
}

.phSectionMaterial .uiTable, .phSectionProcess .uiTable {
  width: 100%;
}

.uiSizeV30p {
  height: 30px;
}

.uiSizeV40p {
  height: 40px;
}

.uiSizeV70p {
  height: 70px;
}

.uiSize70p {
  width: 70%;
}

.uiRow {
  display: block;
  width: 100%;
  clear: both;
}

.uiRow1Column {
  display: block;
  width: 100%;
  clear: both;
}

.uiRow2Column {
  display: inline-block;
  width: 49%;
}

.uiRow3Column {
  display: inline-block;
  width: 33%;
}

.uiListTable .uiRow3Column,
.uiListTable .uiRow2Column,
.uiListTable .uiRow1Column {
  margin: 3px 0px;
  padding: 1px 1px;
  box-sizing: border-box;
  border-bottom: 1px dotted #00600f;
  overflow: auto;
  min-height: 25px;
}

.uiListTable .uiRow3Column:last-child,
.uiListTable .uiRow2Column:last-child,
.uiListTable .uiRow1Column:last-child {
  border-bottom: none;
}

.uiListRow,
.uiSelectedListRow {
  margin: 1px 0px;
  padding: 3px 3px;
  border-bottom: 1px solid #EFEBE9;
}

.uiListRow {
  cursor: pointer;
}
.uiListRow:hover {
  background-color: #d7ffd9;
}

.uiSelectedListRow {
  background-color: #d7ffd9;
}

.uiActionIndicator {
  cursor: pointer;
}

.MuiPickersBasePicker-pickerView {
  background: white;
}

.uiError {
  position: absolute;
  bottom: -40px;
  left: 3px;
  background-color: #d32f2f;
  color: white;
  z-index: 100;
  width: max-content;
  padding: 5px 11px;
  border-radius: 7px;
}

/* tabs */
.tabs {
  padding: 10px 3px 3px 5px !important;
}

.tab-list {
  border-bottom: 0px !important;
  padding-left: 0;
}

.tab-list-item {
  border: 1px solid #bdbcbc !important;
  margin-right: 10px;
  padding: 3px 9px !important;
  cursor: pointer;
  font-size: 13px;
  width: fit-content;
  display: inline-block;
  font-weight: bold;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

.tab-list-active {
  background-color: #008cff !important;
  border: 1px solid #303030 !important;
  color: white;
}

.tab-content {
  border-top: 1px solid black !important;
  box-sizing: border-box;
  padding: 5px 5px;
  width: 100%;
}

/*End Tabs */
.widthInherit {
  width: inherit;
}

.uiWidthMaxContent {
  width: max-content;
}

.uiWidth50p {
  width: 50%;
}

.uiBgWhite {
  background-color: #ffffff;
  color: #000;
}

.uiBgBlue {
  background: #0080ff;
  color: #fff;
}

.uiBgGreen {
  background: #255d00;
  color: #fff;
}

.uiConsolidatedVal {
  min-height: 18px;
  padding: 0px 15px;
  border: 1px solid #9fa6aa;
  border-radius: 3px;
  display: inline-block;
  margin: 0px 10px;
}

.uiBlockHeading {
  font-weight: bold;
  background: #01579b;
  color: white;
  text-align: center;
}

button {
  /*TODO check the impact of this on existing screens.*/
  /*display: block;*/
  cursor: pointer;
  border: none;
  border: medium none;
}

input[type=password],
input[type=text] {
  min-height: 18px;
  padding: 2px 1px;
  border: 1px solid #9fa6aa;
  border-radius: 3px;
  background-color: white;
}

select {
  min-height: 22px;
}

.uiDefaultIconButton {
  margin: "0px 5px 0px 0px";
  cursor: pointer;
}

.uiWhiteIcon {
  color: #ffffff;
  cursor: pointer;
}

.uiDeleteIconButton,
.uiApproveIconButton,
.uiRejectIconButton,
.uiActionIconButton {
  display: inline-block;
  background-color: #3e2723;
  color: #ffffff;
  padding: 0px;
  margin: 0px 3px;
  border-radius: 3px;
  cursor: pointer;
  text-align: center;
}

.uiDeleteIconButton {
  background-color: #ffffff;
  color: #ff7961;
}

.uiApproveIconButton {
  background-color: #ffffff;
  color: #255d00;
}

.uiApproveIconButton {
  background-color: #ffffff;
  color: #255d00;
}

.uiRejectIconButton {
  background-color: #ffffff;
  color: #ff7961;
}

.uiCheckRowSelector {
  text-align: center;
}
.uiCheckRowSelector input {
  width: 100%;
}

.uiRowSelector,
.sectionButton,
.uiAction a,
.uiRiskyOption,
.uiSaveActionButton, .uiActionButton, .uiActionButtonBlue {
  display: inline-block;
  background-color: #3e2723;
  color: #fff;
  padding: 5px 5px;
  font-size: 12px;
  font-weight: bold;
  border-radius: 3px;
  cursor: pointer;
  text-align: center;
}

.uiActionButtonBlue {
  background-color: #347bdc;
}

.uiRowSelector {
  padding: 2px 2px;
  width: 65px;
}

.uiTooltip {
  font-size: 12px;
  line-height: 1.2;
}

.uiSaveAction,
.uiGeneralAction,
.uiYesAction,
.uiCancelAction {
  padding: 6px 12px;
  color: #000;
  font-weight: bold;
  text-decoration: none;
  cursor: pointer;
  border-radius: 3px;
}

.uiSaveActionButton, .uiSaveAction {
  background: darkgoldenrod;
  color: #fff;
}

.uiGeneralAction, .uiYesAction,
.uiCancelAction {
  color: #fff;
  background: #347bdc;
}

.uiRowSelector.uiSelected {
  background: #347bdc;
}

.uiGroupControl10 {
  margin: 0px 10px 0px 10px;
}

.uiHoverRound:hover {
  background-color: #EFEBE9;
  border-radius: 30px;
}

.uiActionIconRound {
  height: 22px;
  width: 22px;
  margin: 0px 3px;
  padding: 0px;
  cursor: pointer;
}

.uiActionIconSimple {
  height: 22px;
  width: 22px;
  margin: 0px 3px;
  padding: 2px;
  cursor: pointer;
}

.uiActionAddFav {
  height: 25px;
  width: 25px;
  display: inline-block;
  margin: 0px;
  cursor: pointer;
  color: #4e342e;
}

.uiActionSelFav {
  height: 25px;
  width: 15px;
  display: inline-block;
  background: url(../../images/ux/arrow_down.png) no-repeat;
  background-size: 25px 25px;
  background-position: center;
  margin: 0px;
  cursor: pointer;
}

.uiActionWithMenu {
  margin: 0px 5px;
  height: 0px;
  cursor: pointer;
}

.uiActionWithMenuSelector {
  content: "";
  cursor: pointer;
  height: 10px;
  width: 15px;
  margin: 0px 3px;
  display: inline-block;
  background: url(../../images/ux/arrow_down.png) no-repeat;
  background-size: 25px 25px;
  background-position: center;
}

.uiActionSearch {
  height: 25px;
  width: 25px;
  margin: 0px 5px 0px 5px;
  cursor: pointer;
  color: #4e342e;
}

button:disabled {
  background-color: #504e4e;
  color: "#000000";
  cursor: not-allowed;
}

.uiActionRefresh {
  height: 25px;
  width: 25px;
  display: inline-block;
  margin: 0px 5px 0px 5px;
  cursor: pointer;
  color: #4e342e;
}

.uiSarasIcon {
  height: 25px;
  width: 25px;
  color: #4e342e;
}

.uiProgressScopeClass {
  color: #EFEBE9;
}

.uiProgressClass {
  color: #0080ff;
}

.uiProgressLabelClass {
  font-size: 10px;
  color: #999696;
}

.uiComfortText {
  padding: 0px 1px;
}

.uiPriority {
  padding: 3px;
  width: 35px;
  display: inline-block;
  text-align: center;
  margin-left: 10px;
}

.uiActionAdd {
  height: 25px;
  width: 25px;
  background: url(../../images/ux/add.png) no-repeat;
  background-size: 25px 25px;
  cursor: pointer;
}

.uiActionEdit {
  height: 25px;
  width: 25px;
  background: url(../../images/ux/edit.png) no-repeat;
  background-size: 25px 25px;
  cursor: pointer;
}

.uiActionDelete {
  height: 25px;
  width: 25px;
  background: url(../../images/ux/delete.png) no-repeat;
  background-size: 25px 25px;
  cursor: pointer;
}

.uiActionConfirm {
  height: 25px;
  width: 25px;
  background: url(../../images/ux/confirm.png) no-repeat;
  background-size: 25px 25px;
  cursor: pointer;
}

.uiActionCancel {
  height: 25px;
  width: 25px;
  background: url(../../images/ux/cancel.png) no-repeat;
  background-size: 25px 25px;
  cursor: pointer;
}

.uiBlack {
  background: #373737;
}

.uiWrapper > .uiHeader .uiSaveAction, .uiWrapper > .uiHeader .uiGeneralAction {
  border: 1px solid #fff;
}

.uiRiskyOption {
  background: #c5c3b6;
  border-bottom: 2px solid #7b4406;
  border-right: 1px solid #7b3d07;
}

hr {
  border: 1px solid #F1F1f1;
}

.uiDeleteActionCross::after {
  content: "x";
  text-align: center;
  display: block;
  font-size: 11px;
  padding-top: 0px;
  color: #fff;
}

.uiDeleteActionCross {
  display: block;
  position: absolute;
  width: 15px;
  height: 15px;
  cursor: pointer;
  top: -7px;
  right: -7px;
  background-color: #ff0204;
  border-radius: 36px;
}

.btnSubmitApproval {
  text-align: center;
  width: auto;
  display: block;
  padding: 5px 10px;
  margin: 0px auto;
  background-color: #0080ff;
  border: 0;
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  cursor: pointer;
  border-radius: 4px;
}

.btnSubmitApproval:hover {
  background-color: #6fb6fc;
  color: #000;
}

.uiLink,
.uiLinkBlack,
.uiLinkWhite,
.uiLinkBlue {
  font-weight: bold;
  cursor: pointer;
  text-decoration: none;
}

.uiLink {
  color: #4e342e;
}

.uiLinkRow {
  color: #000;
  cursor: pointer;
  text-decoration: none;
}

.uiLinkRow:hover {
  background-color: #d7ffd9;
}

.uiLinkBlack {
  color: #000000;
}

.uiLinkWhite {
  color: #ffffff;
}

.uiLinkBlue {
  color: #00600f;
}

.uiLinkBlack:hover,
.uiLinkWhite:hover,
.uiLink:hover {
  text-decoration: underline;
}

.uiChkLabel {
  display: inline-block;
}

.uiFrmText {
  width: 90%;
}

.uiFrmTextWithSH {
  width: 80%;
}

.onoffswitch {
  display: inline-block;
}

.uiNotifyNo::before {
  background-image: none;
}

.uiDialog {
  overflow: visible;
}

.ui-autocomplete {
  max-height: 300px;
  min-width: 250px;
  overflow-y: auto;
  overflow-x: auto;
  z-index: 99999999999999;
}

.uiNotifyYes::before {
  content: " ";
  background-image: url("../../images/ux/Notify.png");
  background-size: 25px 25px;
  background-repeat: no-repeat;
  background-position-x: right;
  height: 25px;
  width: 25px;
  display: inline-block;
}

.uiOnOff {
  padding: 5px;
}

fieldset.uiSwitch label.ui-state-active,
fieldset.uiSwitch label {
  width: 100px;
  padding: 3px;
}

.sectionButton {
  border-radius: 0px;
}

.uiBoxData .uiActionActivator {
  margin: 20px auto;
  display: block;
  width: 300px;
}

.uiBoxSection300 .uiCommentLink {
  display: block;
  width: 50px;
  height: 25px;
  cursor: pointer;
  float: right;
  text-align: center;
  top: -5px;
  position: relative;
}

.uiCommentLink {
  content: " ";
  background-image: url("../../images/ux/comment.png");
  background-size: 25px 25px;
  background-repeat: no-repeat;
  background-position: center;
  width: 25px;
  height: 25px;
  display: block;
  float: right;
}

.uiViewActivatorBlue ul li, .uiViewActivatorGreen ul li {
  display: inline-block;
  padding: 6px 3px;
  margin: 3px 2px 0px 0px;
  font-size: 12px;
  font-weight: bold;
  color: #fff;
  text-align: center;
  border-bottom: 1px solid #fff;
  border-radius: 4px;
}

.uiViewActivatorGreen ul li {
  min-width: 145px;
  background: darkgoldenrod;
  /* W3C */
}

.uiViewActivatorBlue ul li {
  min-width: 100px;
  background: #347bdc;
  /* W3C */
}

.uiViewActivatorBlue ul li a, .uiViewActivatorGreen ul li a {
  color: #fff;
  text-decoration: none;
}

.uiViewActivatorBlue ul li:hover,
.uiViewActivatorGreen ul li:hover {
  border-bottom: 1px solid #000;
}

.uiViewActivatorBlue ul li:hover,
.uiViewActivatorGreen ul li:hover,
.uiViewActivatorBlue ul li:hover span,
.uiViewActivatorGreen ul li:hover span {
  cursor: pointer;
}

.uiPrint {
  background-position: left bottom;
  background-size: 24px 24px;
  height: 25px;
  width: 25px;
  display: inline-block;
  cursor: pointer;
  background-repeat: no-repeat;
  margin-top: 2.5px;
}

.uiPrintIcon1 {
  background-image: url(../../images/ux/ui-print-general.png);
}

.uiPrintIcon2 {
  background-image: url(../../images/ux/TaskActivityLogReport.png);
  background-color: transparent;
}

.uiPrintIcon3 {
  background-image: url(../../images/ux/TaskCallReport.png);
  background-color: transparent;
}

.uiDashSHLink {
  cursor: pointer;
  color: #fff;
}

.uiSearchLink {
  background-image: url(../../images/ux/search-items.png);
  background-position: left bottom;
  background-size: 15px 15px;
  height: 22px;
  width: 20px;
  display: inline-block;
  cursor: pointer;
  background-repeat: no-repeat;
}

/* CMNSearchNewFields, CMNSearchSavedFields ends here */
.uiDropDownCombo {
  height: 28px;
  width: 250px;
  margin: 0px;
  padding: 0px;
  display: inline-block;
}

.uiGridFilterCombo1 {
  color: #fff;
  font-weight: bold;
  background-color: #02660f;
}

.uiConfirmDialogInput input[type=text] {
  width: 95%;
  margin: 3px 5px;
}

.uiContextMenu {
  width: 24px;
  min-height: 24px;
  display: inline-block;
}

.uiContextMenu {
  background: url("../../images/ux/btnContextMenu.png") no-repeat right top;
}

.uiContextMenu:disabled {
  color: #fff;
  background: #9a5e1b;
  border-bottom: 2px solid #5f3404;
  border-right: 2px solid #5f3404;
  background-position: left -21px;
  cursor: default;
}

.uiHighlightKey {
  font-size: 17px;
}

.uiHighlightGreen {
  font-size: 17px;
  color: #255d00;
}

.uiHighlightRed {
  font-size: 17px;
  color: #ff7961;
}

.uiHighlightBlue {
  font-size: 17px;
  color: #0080ff;
}

.uiTextRight {
  text-align: right;
}

.frmSearchCriteria {
  width: 100%;
  padding-top: 0px;
}

.uiTabs {
  position: relative;
}
.uiTabs .uiTabsNav {
  margin: 0;
  padding: 0px 0px;
}
.uiTabs .uiTabsNav .uiTabAnchor {
  float: left;
  padding: 2px 4px;
  text-decoration: none;
}
.uiTabs .uiTabsNav .uiTab {
  list-style: none;
  float: left;
  position: relative;
  top: 0;
  border-bottom-width: 0;
  padding: 1px 2px;
  margin: 6px 2px 0px 0px;
  white-space: nowrap;
  border-radius: 5px 5px 0px 0px;
  border: 1px solid rgba(0, 0, 0, 0.28);
  background-color: #fff;
  font-weight: bold;
  color: #000;
  cursor: pointer;
}
.uiTabs .uiTabsNav .uiTabActive {
  background: #4e342e;
  color: #fff !important;
  font-weight: bold !important;
  padding: 3px 2px;
  margin: 2px 2px 0px 0px;
  animation-name: animActiveElement;
  animation-duration: 0.1s;
  cursor: default;
}
.uiTabs .uiTabsNav .uiTabActive a {
  color: #fff !important;
}
.uiTabs .hiddenTabs {
  display: none;
  height: 0px;
  overflow: hidden;
}

.uiRadio {
  display: inline-block;
}
.uiRadio input[type=radio] {
  margin: 0px 2px;
}
.uiRadio label {
  margin: 0px 10px 0px 5px;
  vertical-align: baseline;
}

.darkGoldenBtn {
  cursor: pointer;
  background: darkgoldenrod;
  color: white;
  font-size: 100%;
  font-weight: bold;
}

.uiDnDDropTarget {
  min-height: "200px";
  min-width: "143px";
  height: "120%";
}

.uiDnDDragOverList {
  background-color: #EFEBE9;
}

.uiWrkFlwActivityStatusApproved {
  display: inline-block;
  background: #00B050;
  text-align: center;
  font-weight: bold;
  color: #fff;
  padding: 3px 5px;
  min-width: 70px;
}

.uiWrkFlwActivityStatusRejected {
  display: inline-block;
  background: #FF5050;
  text-align: center;
  font-weight: bold;
  color: #fff;
  padding: 3px 5px;
  min-width: 70px;
}

.uiWrkFlwActivityStatusPending {
  display: inline-block;
  background: #00B0F0;
  text-align: center;
  font-weight: bold;
  color: #fff;
  padding: 3px 5px;
  min-width: 70px;
}

.uiWrkFlwActivityStatusSkipped {
  display: inline-block;
  background: #E7E6E6;
  text-align: center;
  font-weight: bold;
  color: #484848;
  padding: 3px 5px;
  width: 50px;
}

.uiWorkFlowIndicateApprove {
  background-image: url("../../images/ux/icoCheck.png");
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 0px 0px;
  width: 25px;
  height: 25px;
  float: left;
  margin-right: 10px;
  cursor: pointer;
}

.uiWorkFlowIndicateReject {
  background-image: url("../../images/ux/icoNoCheck.png");
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: 0px 0px;
  width: 25px;
  height: 25px;
  float: left;
  cursor: pointer;
}

.uiBatchReviewApprove {
  background-image: url("../../images/ux/icoCheck.png");
  background-repeat: no-repeat;
  background-size: 15px 15px;
  background-position: 56px 4px;
  width: 75px;
  display: inline-block;
  float: none;
  margin-right: 10px;
  cursor: pointer;
  text-align: left;
}

.uiBatchReviewReject {
  background-image: url("../../images/ux/icoNoCheck.png");
  background-repeat: no-repeat;
  background-size: 15px 15px;
  background-position: 56px 4px;
  width: 75px;
  display: inline-block;
  float: none;
  cursor: pointer;
  text-align: left;
}

.uiApprover .uiPLDIndicateApprove {
  background-image: url("../../images/ux/icoCheck.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
  margin: 0px 5px 0px 5px;
  width: 31px;
  height: 31px;
  float: left;
  cursor: pointer;
}

.uiApprover .uiPLDIndicateReject {
  background-image: url("../../images/ux/icoNoCheck.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
  margin: 0px 5px 0px 5px;
  width: 31px;
  height: 31px;
  float: left;
  cursor: pointer;
}

.uiP_HighestPriority {
  background: #00B050;
  color: #fff;
}

.uiP_HighPriority {
  background: #66FF33;
  color: #000;
}

.uiP_VeryUrgent {
  background: #CCFF99;
}

.uiP_Urgent {
  background: #FFFF00;
}

.uiP_NormalPriority {
  background-color: #FFCD2D;
  color: #000000;
}

.uiP_LowPriority {
  background: #FF9933;
}

.uiP_PriorityNotSet {
  background: #FF5050;
  color: #fff;
}

.uiC_FullConfidence {
  background: #00B050;
}

.uiC_VeryHighConfidence {
  background: #3BF500;
}

.uiC_HighConfidence {
  background: #CCFF99;
}

.uiC_NotSoBad {
  background: #FFFF00;
}

.uiC_Confidence50_50 {
  background: #FFCD2D;
  color: #000000;
}

.uiC_LowConfidence {
  background: #FF9933;
}

.uiC_NoConfidence {
  background: #FF5050;
}

.uiHighlightError {
  color: #ff7961;
}

.uiHighlightMsg {
  color: #0080ff;
}

.labReviewStatusApproved {
  display: inline-block;
  background-color: #00B050;
  width: 13px;
  height: 13px;
  color: #f7f9fc;
  border: 1px solid #000;
  border-radius: 50%;
}

.labReviewStatusRejected {
  display: inline-block;
  background-color: #FF5050;
  width: 13px;
  height: 13px;
  border: 1px solid #000;
  color: #fff;
  border-radius: 50%;
}

.labReviewStatusOnHold {
  display: inline-block;
  background-color: #E7E6E6;
  width: 13px;
  height: 13px;
  border: 1px solid #000;
  border-radius: 50%;
}

.labReviewStatusQuarantine {
  display: inline-block;
  background-color: #FF8C00;
  width: 13px;
  height: 13px;
  border: 1px solid #000;
  color: #fff;
  border-radius: 50%;
}

.labReviewStatusDraft {
  display: inline-block;
  background-color: #44DCFF;
  width: 13px;
  height: 13px;
  border: 1px solid #000;
  color: #000;
  border-radius: 50%;
}

.labReviewStatusUnderTest {
  display: inline-block;
  background-color: #FFD700;
  width: 13px;
  height: 13px;
  border: 1px solid #000;
  color: #000;
  border-radius: 50%;
}

.docReviewStatusNotSubmitted,
.docReviewStatusPending,
.docReviewStatusApproved,
.docReviewStatusRejected,
.docReviewStatusSkipped {
  display: inline-block;
  height: 24px;
  padding: 3px 15px;
  border: 1px solid #fff;
  border-radius: 5px;
}

.uiStatusCompactReviewNotSubmitted,
.docReviewStatusNotSubmitted {
  background-color: #fcba03;
  color: #000;
}

.uiStatusCompactReviewPending,
.docReviewStatusPending {
  background-color: #5076ff;
  color: #fff;
}

.uiStatusCompactReviewApproved,
.docReviewStatusApproved {
  background-color: #00B050;
  color: #fff;
}

.uiStatusCompactReviewRejected,
.docReviewStatusRejected {
  background-color: tomato;
  color: #fff;
}

.uiStatusCompactReviewSkipped,
.docReviewStatusSkipped {
  background-color: #E7E6E6;
  color: #000;
}

.uiBoxTitle .uiReviewStatus {
  border: 1px solid #fff;
  display: inline-block;
}

.uiStatusCompactDocument,
.uiStatusCompactFinance,
.uiStatusCompactReview,
.uiStatusCompactQC,
.uiStatusCompact {
  border: 1px solid #fff;
  display: inline-block;
  height: 24px;
  width: 24px;
  text-align: center;
  border-radius: 36px;
  padding: 3px 3px;
}

.uiDocumentStatus {
  border: 1px solid #fff;
  display: inline-block;
  height: 24px;
  text-align: center;
  border-radius: 5px;
  padding: 0px 10px;
}

.uiRoundedText {
  text-align: center;
  border-radius: 5px;
  padding: 3px;
}

.autoDataAction {
  font-weight: bold;
}

.autoDataManualAction {
  color: #d3a01d;
}

.autoDataExecuted {
  color: #18840a;
}

.autoDataActionFailed {
  color: #f24624;
}

.autoDataProposed {
  color: #4286f4;
}

.uiCertReviewStatus2 {
  background-image: url("../../images/ux/icoCheck.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
  width: 25px;
  height: 25px;
  float: left;
  margin-right: 3px;
  cursor: pointer;
}

.uiCertReviewStatus3 {
  background-image: url("../../images/ux/icoNoCheck.png");
  background-repeat: no-repeat;
  background-position: 0px 0px;
  width: 25px;
  height: 25px;
  float: left;
  margin-right: 3px;
  cursor: pointer;
}

.uiGridRowType_1 {
  height: 30px;
  font-weight: bold;
  text-align: center;
}

.uiGridRowType_2 {
  height: 30px;
  background-color: #00600f;
  font-weight: bold;
  text-align: center;
  color: #fff;
}

.uiGridRowType_2 td.uiCol_Repeat {
  background-color: #dcae42;
  color: #000;
}

.uiGridRowType_3 td.uiCol_Repeat {
  background-color: #f5daa736;
}

.uiGridRowType_3 {
  height: 30px;
}

.uiCol_Repeat .uiROCellCenter {
  font-size: 15px;
}

.uiItemParentRow {
  background-color: #d7ffd9;
}

.uiItemBatchRow {
  background-color: #EFEBE9;
}

.uiHighlightMatTypeMAIN {
  background-color: #255d00;
  width: 75px;
  display: inline-block;
  color: #fff;
}

.uiHighlightMatTypeSF {
  background-color: #0080ff;
  width: 75px;
  display: inline-block;
  color: #fff;
}

.uiHighlightMatTypeNIR {
  background-color: #999696;
  width: 75px;
  display: inline-block;
  color: #fff;
}

/*search screen tabs*/
.uiCornerAll, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
  border-top-right-radius: 3px;
}

.uiCornerAll, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
  border-top-left-radius: 3px;
}

.ui-helper-clearfix:before, .ui-helper-clearfix:after {
  content: "";
  display: table;
  border-collapse: collapse;
}

/*end tabs */
.ui-icon {
  background-image: url(../../images/ux/ui-icons_222222_256x240.png);
}

.ui-state-default .ui-icon {
  background-image: url(../../images/ux/ui-icons_ef8c08_256x240.png);
}

.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
  background-image: url(../../images/ux/ui-icons_ef8c08_256x240.png);
}

.uiStateActive .ui-icon {
  background-image: url(../../images/ux/ui-icons_ef8c08_256x240.png);
}

.ui-state-highlight .ui-icon {
  background-image: url(../../images/ux/ui-icons_228ef1_256x240.png);
}

.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
  background-image: url(../../images/ux/ui-icons_ffd27a_256x240.png);
}

.ui-tooltip {
  background-color: #000;
  color: #fff;
  opacity: unset;
}

.uiAutoCompleteInput,
.ui-autocomplete-input, ui-timepicker-input {
  background-color: #c6f7bb;
}

.uiSearchInput .ui-autocomplete-input {
  background-color: #fff;
  width: 150px;
}

.ui-menu-item {
  background-color: #ccced1;
  color: black;
  border: 1px solid white;
}

.uiMenuGreen .ui-menu-item:hover {
  background: #007ff6;
  color: #fff;
}
.uiMenuGreen .ui-menu-item:hover .uiMenuItemLabel {
  background: #007ff6;
  color: #fff;
}
.uiMenuGreen .ui-menu-item a, .uiMenuGreen .uiDeleteActionCross {
  padding: 0px;
}
.uiMenuGreen .uiMenuItem {
  padding: 3px 1px;
}

.frmSearchCriteria .uiStateActive {
  background: #d7ffd9;
}

.ui-menu .ui-menu-item a.uiStateActive, .uiStateActive a {
  color: #fff;
}

.uiActionSection,
.uiDialog .uiDialogAction {
  border-top: 3px solid #4e342e;
  background: #fff;
  height: 50px;
  padding: 0px;
  margin: 0px;
}

.ui-menu {
  position: absolute;
  width: 200px;
  z-index: 999999;
}

.switchOnOffLabel.uiStateActive, .uiDayWorking,
.switchOnOffLabel, .uiDayHoliday {
  padding: 1px;
  min-width: 20px;
  width: auto;
  display: inline-block;
  text-align: center;
}

.switchOnOffLabel, .uiDayHoliday {
  background-color: #cecac4 !important;
  padding: 3px !important;
  color: #000 !important;
  border: 1px solid #6d6b69 !important;
}

.switchOnOffLabel.uiStateActive, .uiDayWorking {
  background-color: #178223 !important;
  padding: 3px !important;
  color: #fff !important;
  border: 1px solid #647c4d !important;
}

.switchOnOffLabel .switchOnOff {
  display: none;
}
.switchOnOffLabel span {
  display: none;
}

.uiOnOff.uiStateActive, .switchOnOffLabel {
  padding: 5px;
}

.ui-datepicker-trigger {
  content: url("../../images/ux/calendar.gif");
  margin-left: 2px;
}

.uiCalendarFlatLook {
  border: 0px;
  border-radius: 0px;
  height: auto;
  width: 80px;
  background-color: transparent;
}

.uiDashFixedHeader2 .uiCalendarFlatLook {
  color: #fff;
  border-color: #fff;
}

.onoffswitch-inner {
  text-align: left;
}

.onoffswitch-inner:before {
  background-color: #188124;
}

/*DocSearchCriteria Style */
.uiHideMuiDatepickerTxt .MuiInput-underline:before, .uiHideMuiDatepickerTxt .MuiInput-underline:hover {
  border: none !important;
}

.uiHideMuiDatepickerTxt .MuiInput-underline:after, .uiHideMuiDatepickerTxt .MuiInput-underline:after:hover {
  border: none;
}

.uiHideMuiDatepickerTxt {
  margin: 0px;
  overflow: hidden;
  width: 50px !important;
}

.uiHideMuiDatepickerTxt input[type=text] {
  visibility: hidden;
  width: 1px;
}

.uiDatePicker {
  width: 150px;
  margin-top: unset !important;
  margin-bottom: unset !important;
  overflow: hidden;
}
.uiDatePicker .MuiInput-underline {
  border-bottom: none !important;
}
.uiDatePicker .MuiInput-underline::before {
  border-bottom: none !important;
}

.phViewHeading .uiDatePicker svg {
  fill: white;
}

/*end DocSearchCriteria Style */
.searchSelectContainer {
  height: 500px;
}

.MuiPopover-root {
  z-index: 100001 !important;
}

/*# sourceMappingURL=saras.css.map */