/*
California State East Bay Theme:
  Red: #d50005
  White: #fff
  Black: #000

  Buttons on their own:
    background-color: #d50032;
    border: 1px solid #000;
    color: #fff;
    font-size: 1.1em;
    text-decoration: none;
    display: block;
    padding: 2px 10px;

  Buttons next to red menus:
    color: #d50032;
    display: inline-block;
    background-color: #fff;
    border: 1px solid #d50032;
    font-family:  Helvetica, Arial, sans-serif;
    font-size: 1.2em;
    padding: 5px 43px;
    text-transform: uppercase;
    text-decoration: none;
}
*/


html,
body {
  background-color: #ffffff !important;
}

/* Typography */
html,
body,
textarea,
select,
label,
table,
a,
h2,
h3,
h4,
h5,
.res-detail-permissions,
.rich-subtable-footercell,
.subtablecell,
.txtinput,
.commentCls,
.superscript,
.dateRangeCompFont,
.dr-table-cell,
.dr-pnl,
.dr-pnl-b,
.dr-pnl-h,
.dr-tbpnl-tb,
.dr-tbpnl-cntnt,
.dr-subtable-cell,
.dr-table-footercell,
.rich-table-headercell,
.rich-table-subheadercell,
.target-cell,
.rich-shuttle-source-cell,
.rich-shuttle-source-cell-active,
.rich-shuttle-source-cell-selected,
.rich-shuttle-source-caption,
.rich-shuttle-target-cell,
.rich-shuttle-target-cell-active,
.rich-shuttle-target-cell-selected,
.rich-shuttle-target-caption,
.rich-list-shuttle-button-content,
.panel,
.subLevelTreeTbl,
.user-entitlement-table-cell,
.user-access-table-cell,
.user-entitlement-table-hdr {
  font-family: Helvetica, Georgia, Serif !important;
  font-size: 1.2rem;
  font-weight: bold;
}

/** Inputs **/
input {
  font-family: Helvetica, Georgia, Serif !important;
  font-size: 1.2rem !important;
  font-weight: bold !important;
}

/* Gets rid of yellow input backgrounds */
input:not([type="image"]):focus,
.subtab:hover:not(.subtab-disabled),
.sapUserInfoMenu:hover,
.sapUserInfoMenuSelected:hover {
  background-color: #fff !important;
}

select:focus {
  background-color: #fff !important;
  border: 1px solid #d50005 !important;
  outline: none !important;
}

select option:focus {
  background-color: #fff !important;
  border: 1px solid #d50005 !important;
  outline: none !important;
}

/* Custom input outline on focus */
input:focus {
  outline: none !important;
  border: 1px solid #d50005 !important;
  box-shadow: 0 0 5px #000 !important;
}

/* Italicized Sub Text */
.requiredFieldText {
  font-weight: 600 !important;
  font-size: 1.4rem !important;
  font-family: serif, sans-serif !important;
}

.maintab-active a,
.reqClearBoth a,
.bannerLink,
.historyLink,
.resourceLink,
a.pagingIndexPanel:focus,
a.pagingIndexPanel:hover,
a.tblsortCol:focus,
a.tblsortCol:hover,
.apprRequiredField,
.sociallogin,
.newAttrbColor,
.hpam-tab-link-grey,
a.ss_labelCenterText,
a {
  color: #d50032;
  outline: none;
  text-decoration: none;
}

/* Forgot PSWD text */
.kioskbodyinstr {
  color: #d50032 !important;
}

/** Dialog **/
/* h2.panelheader also affects dynamic UI titles */
h2.panelheader {
  font-weight: 600 !important;
  font-size: 2rem !important;
}

/* body */
.loginmsg3,
.panel.alertDialog {
  color: #000 !important;
}

#selfServicecommonMessageForm {
  padding: 0px !important;

}

/* Outline */
.panel.alertDialog {
  outline: -webkit-focus-ring-color auto 2px !important;
}

/* Header */
#header {
  background-color: rgba(0, 0, 0, 0.8);
  border: none;
  -webkit-transition: padding 0.3s ease;
  -moz-transition: padding 0.3s ease;
  transition: padding 0.3s ease;
}

.site-header {
  background-color: #000;
  height: 6.5em;
  -webkit-box-shadow: 0px 4px 0px 0px rgba(54, 54, 54, 0.11);
  -moz-box-shadow: 0px 4px 0px 0px rgba(54, 54, 54, 0.11);
  box-shadow: 0px 4px 0px 0px rgba(54, 54, 54, 0.11);
  border-color: transparent;
  border: 1px solid transparent;
}

.bannerLogo {
  display: block;
  width: 100%;
  /* max-width: 475px !important; */
  /* max-height: none !important; */
  border: none;
}

/** Main Banner Title **/
.bannerMid {
  margin-right: auto;
  margin-left: 10rem;
}

.bannerText {
  color: #fff;
  font-weight: bold;
}

/** Username Greeting **/
.welcomeMsg {
  color: #fff;
}

.bannerRight {
  position: relative;
  top: 0.9rem;
  color: #fff;
}

.kioskbody {
  padding: 0 1rem;
}

main {
  padding: 2rem 3.5rem 2.5rem 3.5rem;
}

/** Sub Menu Tables **/
.acct-type-hdr,
.selresourcebar,
.res-detail-panel-new-user,
.requesters-table-caption-blue-bkgr,
.selaccountbar,
.account-details-container,
.apprRadioCellHeaderEnabled,
.assignedTableActionBck,
.certifytableActionBck,
.assignedTableActionBckEnd,
.certifytableActionBckEnd,
.tablenobordertopnobotmarg,
.tooltip,
.dateRangeCompInnerTable,
.subTableHeader {
  background-color: #000 !important;
  color: #fff !important;
}

.mobileTableActions {
  background-color: #000;
}

/* Login Screen */
.loginInput {
  margin-top: .5rem;
}

#loginform input[type="password"],
#loginform input[type="text"] {
  padding: 1rem .5rem !important;
}

.logonTitle h2 {
  font-size: 3.5em !important;
  font-weight: 300;
}

.loginUserIdArea label {
  font-size: 1.1em !important;
}

.loginButton {
  background-color: #d50032 !important;
  border: 1px solid #000 !important;
  color: #fff !important;
  padding: 0px 43px !important;
  font-weight: bold;
  font-size: 1.2em !important;
  padding: 0px 43px !important;
  margin-top: 2.5rem !important;
  font-family: Helvetica, Arial, sans-serif !important;
}

.loginButton:hover {
  color: #d50032 !important;
  background-color: #fff !important;
  border: 1px solid #d50032 !important;
}

/** Panels **/
/*
#mainPanel\:_form {}

#subtabPanel\:_form {}
*/

.rich-tab-active a,
.rich-tab-inactive a {
  font-family: Helvetica !important;
  font-size: 1.4rem;
}

/** Tabs **/
#mainPanel\:_form .tab {
  background-color: #000 !important;
  border-color: #000;
}

/** Active Tabs **/
#mainPanel\:_form .rich-tab-active {
  border-color: #fff;
}


/** Main Panel Inactive Tabs **/
#mainPanel\:_form .rich-tab-inactive {
  border-color: #000;
}

#mainPanel\:_form .rich-tab-inactive:hover,
#mainPanel\:_form .rich-tab-inactive:focus {
  border-color: #fff;
  cursor: pointer !important;
}

/** Main Panel Active Links **/
#mainPanel\:_form .rich-tab-active a {
  color: #fff !important;
  font-weight: bold;
  font-size: larger;
}

#mainPanel\:_form .rich-tab-active a:visited {
  outline: none !important;
  text-decoration: none !important;
}

/** Main Panel Inactive Links **/
#mainPanel\:_form .rich-tab-inactive a {
  font-weight: bold;
  color: #fff !important;
}

#mainPanel\:_form .rich-tab-inactive:hover a {
  color: #fff !important;
}

#mainPanel\:_form .rich-tab-inactive a:hover,
#mainPanel\:_form .rich-tab-inactive a:focus {
  color: #fff !important;
}

#mainPanel\:_form .rich-tab-inactive a:visited {
  outline: none !important;
  text-decoration: none !important;
}

/** Subtab Panel Active Tabs **/
#subtabPanel\:_form .rich-tab-active {
  background-color: #d50032 !important;
  border: 1px solid #000 !important;
  color: #fff !important;
}

/** Subtab Panel Inactive Tabs **/
#subtabPanel\:_form .rich-tab-inactive {
  background-color: #000 !important;
}

#subtabPanel\:_form .rich-tab-inactive:hover,
#subtabPanel\:_form .rich-tab-inactive:focus {
  color: #d50032 !important;
  display: inline-block !important;
  background-color: #fff !important;
  border: 1px solid #d50032 !important;
  font-size: 1.2em;
  cursor: pointer !important;
}

/** Subtab Panel Active Links **/
#subtabPanel\:_form .rich-tab-active a:visited {
  outline: none !important;
  text-decoration: none !important;
  color: #fff !important;
}

#subtabPanel\:_form .rich-tab-active a {
  color: #fff !important;
  font-weight: bold;
}

/** Subtab Panel Inactive Links **/
#subtabPanel\:_form .rich-tab-inactive a {
  color: #fff !important;
  font-weight: bold;
}

#subtabPanel\:_form .rich-tab-inactive:hover a {
  color: #d50032 !important;
  font-weight: bold;
}

#subtabPanel\:_form .rich-tab-inactive a:hover,
#subtabPanel\:_form .rich-tab-inactive a:focus {
  color: #d50032 !important;
}

#subtabPanel\:_form .rich-tab-inactive a:visited {
  outline: none !important;
  text-decoration: none !important;
  color: #d50032 !important;
}

.logoutIcon {
  filter: none;
}

.expandMenu {
  filter: none;
}

.sapUserInfoMenu,
.sapUserInfoMenuSelected {
  border: .1rem solid #d50005;
}

.subtab {
  border: .1rem solid rgb(238, 233, 227);
}

/** Round Number Badges **/
.panelnumber,
#activeSubTabTitle {
  background-color: #000 !important;
}

/** Sub Page Titles **/
.panel h2 {
  color: #d50005 !important;
}

.panelheader {
  font-weight: 300 !important;
  color: #000 !important;
}

.panel.numbered.disabled h2,
.panel.numbered.disabled h3.panelheader {
  font-weight: 300 !important;
  color: gray !important;
}

/* Buttons */
.buttonL1,
.buttonL2,
.buttonL3,
.buttonL4,
.anchorAsButton,
.mutliselectBtn,
.chevronMultiSelectBtn,
.ss_manager_button,
.launch_wf_button,
.sapUserInfoMenuSelected,
.hpam-tab-link,
.dateRangeCompFont,
.rich-calendar-today,
.rich-calendar-header,
.rich-calendar-tool,
.rich-calendar-month {
  background-color: #d50032 !important;
  border: 1px solid #000 !important;
  font-family: Helvetica, Arial, sans-serif !important;
  color: #fff !important;
  padding: 0px 43px !important;
  font-weight: bold;
}

.buttonL1:hover,
.buttonL2:hover,
.buttonL3:hover,
.buttonL4:hover,
.anchorAsButton:hover,
.mutliselectBtn:hover,
.chevronMultiSelectBtn:hover,
.apprRadioCellHeaderApproved,
.apprRadioCellBodyApproved,
.apprRadioCellHeaderDenied,
.apprRadioCellBodyDenied,
.apprRadioCellHeaderReassigned,
.apprRadioCellBodyReassigned {
  font-family: Helvetica, Arial, sans-serif !important;
  color: #d50032 !important;
  background-color: #fff !important;
  border: 1px solid #d50032 !important;
}

.buttonL1Disabled,
.buttonL2Disabled,
.buttonL3Disabled,
.buttonL4Disabled {
  font-family: Helvetica, Arial, sans-serif !important;
  color: #ffffff !important;
  background-color: gray;
  font-weight: bold;
}

.tbl-search-input,
.tbl-search-combo,
.ss_input_default_4,
.ss_input_default_3,
.ss_input_default_2,
.ss_input_default_1,
.ss_input_default_date_4,
.ss_input_default_date_3,
.ss_input_default_date_2,
.ss_input_default_date_1,
.acct-type-combo,
.readOnly_ss_input_default,
.rich-sb-int,
.panel.numbered.disabled h2,
.create-user-combo,
.create-user-input,
.create-user-input2,
.create-user-input-ns,
.create-user-input-nsnrm,
.create-user-input_captcha,
.manager-panel-data,
.defaultInputLabel,
.defaultReadOnlyField,
.ss_input_default,
.ss_input_captcha,
.certifyItemListingOptTextGray,
.inpanel,
.historyHeaderDisabled,
.defaultInputField {
  color: #000 !important;
  font-weight: 300 !important;
}

@media only screen and (max-width: 575.98px) {
  .bannerLogo {
    max-width: 34rem !important;
    height: 4.6rem !important;
    object-fit: fill;
    padding: 0.8rem 0;
    object-position: -1% 0;
  }
}

@media only screen and (min-width: 767.98px) and (max-width: 1349.98px) {
  .subtabOverflow .subtab {
    border-color: #000 !important;
  }

  .subtabOverflow .subtabMenu {
    background-color: #000 !important;
  }

  .subtabOverflow .subtab-active,
  .subtabOverflow .subtab-active:hover {
    background-color: #fff !important;
  }
}

@media only screen and (max-width: 991.98px) {
  .mobileTableHeader {
    background-color: #000 !important;
  }

  .mobileRowSelected {
    background-color: #fff !important;
  }

  #certifyFormRecertify .historyHeader,
  #changeCertifyActionForm .historyHeader,
  #changeSysCertifyActionForm .historyHeader,
  .assignedaccounttable .historyHeader,
  .systemaccounttable .historyHeader {
    background-color: #fff !important;
  }
}

@media only screen and (max-width: 767.98px) {
  .subtab {
    background-color: #fff !important;
  }

  #subtabPanel\:_form .rich-tab-inactive:hover {
    width: 100%;
    box-sizing: border-box;
    padding: 0 1.2rem !important;
    border: 1px solid #000 !important;
  }

  #subtabPanel\:_form .rich-tab-inactive:hover a {
    outline: none !important;
    text-decoration: none !important;
    width: 100%;
  }

  .activeTab {
    outline: none !important;
    text-decoration: none !important;
    color: #000 !important;
    font-weight: bold;
    font-size: larger;
    border-bottom: medium solid #000;
    background: none !important;
    background-color: #fff !important;
  }

  .subtab-active.mobileTab[showmenu="true"] {
    border-left: .8rem solid #d50032 !important;
  }

  .mobileRowHeader {
    color: #000 !important;
  }

  .rich-tab-header.mobileTab {
    border-top: .1rem solid white !important;
  }

  #activeSubTabTitle {
    background-color: #fff !important;
    border-bottom: medium solid #000;
  }

  #activeSubTabTitle .subTabTitleText {
    outline: none !important;
    text-decoration: none !important;
    color: #000 !important;
    font-weight: bold;
    font-size: larger;
  }
}