@charset "utf-8";
@import url('/fonts/HCoGothamSSm/HCoGothamSSm.css');
@import url('/fonts/Gotham/Gotham.css');

:root {
  /* Background colors */
  --primary-background-color: #ffffff;
  --secondary-background-color: #092f37;
  --gradient-primary-background-color: #eeeeee;
  --gradient-secondary-background-color: #fcfcfc;
  --symbol-fill-color: #892041;
  --button-background-color: #ffffff;
  --button-hover-background-color: #7e2941;
  --filled-button-background-color: #7e2941;
  --filled-button-hover-background-color: #2b8473;
  --table-header-background-color: #e1e1e1;
  --table-alternating-inner-shadow: #e7eae4;
  --table-alternating-background-color: #f9f9f9;

  /* Text colors */
  --primary-text-color: #52484b;
  --header-text-color: #111111;
  --paragraph-text-color: #52494b;
  --primary-link-text-color: #52494b;
  --label-text-color: #52494b;
  --secondary-text-color: #ffffff;
  --secondary-link-text-color: #ffffff;
  --tertiary-link-text-color: #0045a6;
  --link-hover-color: #006cff;
  --filled-button-text-color: #ffffff;
  --input-placeholder-text-color: #9f9fa0;
  --button-text-color: #7e2941;
  --button-hover-text-color: #ffffff;
  --error-color: #d0021b;

  /* Border colors */
  --primary-link-border-color: #52494b;
  --filled-button-primary-border-color: #e8eae5;
  --content-box-border-color: #e8eae5;
  --focus-outline-color: #006cff;
  --input-focus-border-color: #072f37;
  --navigation-border-bottom-hover-color: #81d6c6;
}

/* Login Page Styles */
body,
button,
a,
li,
p {
  font-family: 'HCo Gotham SSm';
}

div.loginHeader {
  height: 250px;
  background-color: var(--primary-link-border-color);
  border: none;
  background-size: cover;
  background-position-x: center;
}

#loginHeaderBar img {
  height: 70px;
  padding-top: 50px;
  padding-left: 35px;
}

#mainContent h1 {
  color: var(--header-text-color);
  font-weight: 400;
  font-size: 22px;
  line-height: 30px;
  padding: 10px 0 10px 0;
}

div.actionArea {
  padding: 0 30px 0 30px;
  border: none;
}

ul.login li label {
  font-size: 16px;
  line-height: 18px;
  color: var(--paragraph-text-color);
}

ul.login li {
  margin-bottom: 5px;
}

input::placeholder {
  color: var(--input-placeholder-text-color);
}

input[type='text'],
input[type='password'],
select {
  display: block;
  height: 40px;
  width: 100%;
  margin-bottom: 25px;
  text-indent: 10px;
  font-size: 15px;
  color: var(--label-text-color);
  border: 1px solid var(--filled-button-primary-border-color);
  outline-color: var(--primary-text-color);
  padding-top: 4px;
}

button.button,
a.button,
a.button:visited,
a.button:hover,
input.button,
input.button:visited {
  border: 1px solid var(--filled-button-primary-border-color);
  background-color: var(--filled-button-background-color);
  border-radius: 0;
  padding: 18px;
  color: var(--secondary-link-text-color);
  line-height: 19px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0;
  font-size: 15px;
  margin-top: 0;
  margin-bottom: 10px;
  cursor: pointer;
  display: inline-block;
  box-shadow: none;
  min-width: 110px;
}

a,
a:visited,
a:hover {
  color: var(--tertiary-link-text-color);
  text-decoration: underline;
}

div.payorHeaderContainer a {
  text-decoration: none;
}

li#resets {
  color: var(--tertiary-link-text-color);
  display: flex;
  justify-content: space-between;
}

li#memberReg {
  text-align: center;
}

div#footer {
  background-color: var(--table-alternating-background-color);
  padding: 10px 25px 25px 25px;
  font-size: 14px;
}

div#footer li {
  font-size: 13px;
}

h1.footerContactUs {
  color: var(--header-text-color);
  font-weight: 400;
  font-size: 22px;
  line-height: 30px;
  padding: 10px 0 5px 0;
}

#footer h2 {
  color: var(--primary-text-color);
  padding-top: 10px;
}

#footer p {
  padding-top: 10px;
  padding-bottom: 10px;
  color: var(--primary-text-color);
}

/* -----Forgot Username Password Styles---- */

#loginFormContainer .loginFormHeader {
  background: none;
  background-color: #092f37;
  text-shadow: none;
  padding-top: 50px;
  font-weight: 400;
  font-size: 20px;
}

#loginFormContainer h1 {
  font-size: 24px !important;
  padding-bottom: 18px;
}

form#loginForm,
div#sidebar {
  padding: 16px 20px 0 20px;
}

#loginForm li h2 {
  font-size: 22px !important;
  font-weight: 400;
  color: var(--header-text-color);
}

div#sidebarInner h2 a {
  text-decoration: none;
  display: block;
  font-size: 13px;
  color: var(--paragraph-text-color);
}

.mobileAccountHelpPage div#sidebarInner h2 a {
  color: var(--tertiary-link-text-color);
  text-decoration: underline;
}

#loginForm li label {
  font-size: 16px !important;
  color: var(--paragraph-text-color);
  padding-top: 5px;
}

form#loginForm,
div#sidebar,
p.legalText {
  background: none;
  border: none;
}

em.required.ht1-InputRequiredAsterisk {
  display: none;
}

.acctMgtButtons {
  flex-direction: column;
}

.acctMgtButtons .halfWidth {
  width: 100%;
  margin: 10px;
}

.acctMgtButtons div input {
  width: 100% !important; /* need to override acctMgtButtons 99% width !important */
  padding: 15px;
}

#loginForm a#cancel {
  color: var(--symbol-fill-color);
  background-color: var(--primary-background-color);
  padding: 15px !important; /* need to override */
}

.sidebarInner_h2_span {
  display: block;
}

div#sidebarInner h2 {
  color: var(--header-text-color);
  font-size: 19px;
  font-weight: 400;
}

div#sidebarInner p {
  color: var(--label-text-color);
  font-size: 13px;
  line-height: 16px;
}

div#sidebarInner p strong,
div#sidebarInner em {
  font-weight: normal;
  font-style: normal;
}

p.legalText {
  color: var(--label-text-color);
  font-size: 13px;
  line-height: 16px;
  padding: 5px 20px 5px 20px;
}

a.retrieveUsernameLink,
a.retrieveUsernameLink:visited,
a.retrieveUsernameLink:hover {
  text-decoration: none;
  font-size: 14px;
  color: var(--label-text-color);
}

#footer div.copyright {
  padding: 10px 20px 50px 20px;
  color: var(--label-text-color);
}

div #footer {
  background: none;
  border: none;
  padding: 0;
}

#footer div.copyright {
  background: none;
}

#footer .copyright a.logo {
  display: none;
}

/* Retrieve Your Username */
input#firstName,
input#lastName,
input#email {
  margin-bottom: 10px !important;
}

ul.menuList li a,
ul.menuList li a:hover,
ul.menuList li a:visited {
  color: var(--tertiary-link-text-color) !important;
  font-weight: 400 !important;
  font-size: 16px !important;
  padding-left: 15px !important;
}

/* ------Logo Holder------ */
div.logoHolder {
  background-color: var(--secondary-background-color);
  height: 100px;
  display: flex;
  justify-content: space-around;
  padding: 15px 20px 0 20px;
}

div.logoHolder img {
  width: 40%;
}

div#memberBar {
  border: none;
  background-color: var(--primary-background-color);
}

#headerBar {
  background-color: var(--primary-background-color);
  border: none;
}

#headerBar h1 {
  color: var(--header-text-color);
  text-shadow: none;
  font-weight: 400;
  font-size: 22px;
  text-align: left;
  padding-left: 25px;
  padding-right: 20px;
}

#mainContent.userInformation .actionItemWrapper .pageHeader,
#mainContent.mobileMemberInformationSummary .pageHeader,
#mainContent.communicationPreferencesContent .actionItemWrapper .pageHeader {
  padding: 10px 15px 10px 15px;
}

#accountUpdate .actionItemWrapper .pageHeader {
  color: var(--header-text-color);
  padding: 10px 15px 10px 15px;
  font-size: 22px;
  font-weight: 400;
}

#accountUpdate #loginContainer #mainContent #loginForm h3:first-of-type {
  padding-top: 0px;
}

/* ------ Nav and Menu Buttons ----- */

#menuButton {
  background-color: var(--input-focus-border-color);
  color: var(--secondary-link-text-color);
  position: absolute;
  top: -60px;
  left: 10px;
}

#menuButton.is-active {
  background-color: var(--input-focus-border-color);
}

div#dropDownMenu {
  background: var(--primary-background-color);
  box-shadow: none;
  border-right: 1px solid var(--content-box-border-color);
  padding-top: 20px;
}

#dropDownMenu ul li a {
  background: var(--primary-background-color);
  color: var(--label-text-color);
  font-size: 15px;
  text-decoration: none;
  font-weight: 400;
  padding-top: 20px;
  padding-bottom: 20px;
}

div#dropDownMenu ul li a.mobileInnerLink.open {
  color: var(--secondary-text-color);
  background-color: var(--filled-button-hover-background-color);
}

div#dropDownMenu ul li {
  border-bottom: 1px solid var(--filled-button-hover-background-color);
}

div#dropDownMenu ul li .mobileInner li {
  background: none;
  padding-left: 25px;
  border: none;
}

div#dropDownMenu ul li a.mobileInnerLink span {
  background: url(/images/mobile/buttonSprite_555.png) no-repeat scroll right
    top;
  width: 20px;
  background-size: 20px;
  background-repeat: repeat;
  background-position-y: -25px;
  background-position-x: 5px;
}

div#dropDownMenu ul li a.mobileInnerLink.open span {
  background: url(/images/mobile/navUpArrow.png) no-repeat scroll right top;
}

#footer div.copyright ul li a.logo {
  display: none;
}

.actionItemWrapper.topHeaderBar__rightSideIcons {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  box-sizing: border-box;
  height: 60px;
  padding: 0;
}

.actionItemWrapper.topHeaderBar__rightSideIcons #headerBar {
  position: unset;
  margin-right: auto;
}

#contextNav {
  width: 190px;
}

#contextNav li a {
  background-color: var(--primary-background-color);
  color: var(--symbol-fill-color);
  font-size: 15px;
  text-decoration: none;
  padding: 15px 0 15px 10px;
}

#contextNavButton {
  background-image: url(/images/mobile/avera/chevron-down.svg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 50px;
  width: 60px;
  height: 60px;
  position: relative;
  top: auto;
  padding: 0;
  text-indent: -9999px;
  z-index: 9999;
  background-color: var(--primary-background-color);
  transform: rotate(270deg);
  overflow: hidden;
  float: right;
}

#contextNavButton.is-active {
  transform: rotate(90deg);
  background-color: var(--primary-background-color);
  background-size: 50px;
  height: 60px;
  width: 60px;
  z-index: 999;
  box-shadow: none;
  padding-left: 0;
}

.one-edge-shadow {
  box-shadow: 0 8px 6px -6px black;
}

#contextNav a i {
  margin-right: 8px;
  margin-bottom: -5px;
}

#contextNav a i.contextInbox,
#contextNav a i.contextSent,
#contextNav a i.contextArchived,
#contextNav a i.contextArchive {
  background-image: url('/images/mobile/avera/folder.svg');
  background-size: 20px;
  width: 20px;
  height: 20px;
  background-position: 0 0;
}

#contextNav a i.contextArchived,
#contextNav a i.contextArchive {
  background-image: url('/images/mobile/avera/trash.svg');
}

#contextNav a {
  font-size: 16px;
}

ul#contextNav.js-contextMenu {
  top: 50px;
  box-shadow: -1px 1px 10px var(--input-placeholder-text-color);
}

.pageContent a.compose {
  background-image: url(/images/mobile/avera/pencil.svg);
  background-position: center;
  background-repeat: no-repeat;
  width: 60px;
  background-size: 20px;
  height: 60px;
  top: 0;
  right: 0;
  position: relative;
}

/* ------- Claims ----- */

h1#payorHeader.claims {
  color: var(--header-text-color);
  padding: 10px 15px 10px 15px;
  font-size: 22px;
  font-weight: 400;
  margin-top: -10px;
}

.claimsPageHeader {
  display: none;
}

#mainContent ul.menuList li a span {
  text-decoration: none;
  color: var(--label-text-color);
}

#mainContent ul.menuList li a em {
  text-decoration: underline;
  font-style: normal;
}

ul.menuList {
  background: none;
}

#mainContent ul.menuList li a span.status.ht-mobile-Claims-itemStatus {
  color: var(--label-text-color);
  font-weight: bold;
  font-size: 10px;
  line-height: 16px;
}

span.summary.summaryStatus span {
  color: var(--label-text-color);
  font-weight: bold;
  font-size: 10px;
  line-height: 16px;
}

#mainContent ul.menuList li a span.summary {
  margin: 0;
}

#mainContent ul.menuList li a span.summary.ht-mobile-Claims-itemBilled {
  font-size: 12px;
  font-weight: 600;
  display: block;
}

#mainContent ul.menuList li {
  background: none;
}

#mainContent
  ul.menuList
  li
  a
  span.ht-mobile-Claims-itemDateLabel.mdateOfService {
  color: var(--label-text-color);
  text-decoration: none !important;
  font-weight: bold;
  font-size: 12px;
  line-height: 22px;
}

span.ht-mobile-Claims-itemDate {
  color: var(--primary-text-color) !important;
  text-decoration: none !important;
  line-height: 22px;
}

#claimDetail li div h2.name {
  color: var(--tertiary-link-text-color) !important;
  text-decoration: underline;
  font-weight: 400;
  font-size: 18px;
}

/* -- Claim Detail -- */

h1#payorHeader.claimdetails {
  color: var(--header-text-color);
  padding: 0px 20px 0 15px;
  font-size: 22px;
  font-weight: 400;
}

#claimDetail h2.ht-mobile-ClaimDetail-xref.ht-mobile-ClaimDetail-headerValue {
  font-size: 16px;
  padding-top: 5px !important;
}

ul#claimDetail {
  padding: 0 10px 10px 10px;
}

#claimDetail li span,
span.ht-mobile-ClaimDetail-headerLabel {
  color: var(--primary-text-color) !important;
  font-size: 16px;
  font-weight: bold;
}

#claimDetail
  span.ht-mobile-ClaimDetail-status.ht-mobile-ClaimDetail-headerValue.status {
  color: var(--primary-text-color);
  font-size: 16px;
  padding-top: 5px;
}

#claimDetail li span.dateOfService {
  font-size: 16px;
  font-weight: normal;
  padding-top: 5px;
}

#claimSummary li span.right {
  font-size: 14px;
}

h2.name.ht-mobile-ClaimDetail-headerValue {
  padding: 5px 0 !important;
}

li.ht-mobile-ClaimDetail-summaryHeadingWrapper {
  padding: 10px 10px 10px 10px !important;
}

li.ht-mobile-ClaimDetail-summaryHeadingWrapper h2 {
  font-weight: 400 !important;
  color: var(--header-text-color);
  font-size: 20px !important;
  padding: 10px !important;
}

li.border.last {
  padding: 0px 20px 20px 20px !important;
  border-top: none !important;
  font-size: 13px;
}

#claimSummary li.inner {
  padding: 20px 20px 0px 20px;
}

li.border.last.totalAmounts {
  border-top: 1px solid #cececf !important;
  border-bottom: none !important;
  margin-top: 15px !important;
}

li.border.last.totalAmounts h2 {
  color: var(--header-text-color) !important;
  font-weight: 400 !important;
  font-size: 20px !important;
  padding-top: 15px !important;
}

#claimSummary li {
  padding: 0 20px 0 20px;
}

ul#claimSummary {
  padding-bottom: 50px;
}

/* ----- Condition Search -------- */

#bodyView {
  padding-top: 80px;
}

#tabs {
  border: none;
}

#tabs ul {
  background: var(--primary-background-color);
  border: none;
}

#tabs ul li a {
  margin: 0;
  border-radius: 0;
  font-weight: 400;
  color: var(--header-text-color);
  background: none !important;
  background-color: var(--filled-button-text-color) !important;
  border-top: 1px var(--content-box-border-color) solid;
  border-bottom: 1px solid var(--content-box-border-color);
  border-left: 1px var(--content-box-border-color) solid;
}

#tabs ul li.activeState a,
#tabs ul li a.active {
  background-color: var(--filled-button-hover-background-color) !important;
  color: var(--filled-button-text-color);
  border-bottom: 1px solid var(--filled-button-hover-background-color);
}

ul#listRegions li {
  background-color: white !important;
  padding-left: 20px;
}

ul#listRegions li span {
  font-weight: 400 !important;
  font-size: 16px !important;
}

div.tabContainer {
  margin-bottom: 50px;
}

#listView {
  padding-top: 50px;
}

/* ---------- Messaging / Inbox --------- */
a.newMessage {
  margin-left: 25px;
  font-size: 13px;
}

ul.menuList.clickable {
  border-top: 1px solid #cececf;
  margin-top: 5px;
}

span.read,
span.unread,
#mainContent ul.menuList li a.mail {
  font-size: 16px !important;
  line-height: 25px;
}

i.contextPaperClip {
  background: url('/images/mobile/avera/attachment.svg');
  padding: 15px 13px;
  background-size: 30px;
  position: absolute;
}

span.summary.from {
  padding-left: 25px;
}

#mainContent ul.menuList li a span.read {
  text-decoration: none;
  color: var(--tertiary-link-text-color);
  padding-left: 25px;
}

#mainContent ul.menuList li a span.unread {
  color: var(--tertiary-link-text-color);
  text-decoration: underline !important;
  padding-left: 25px;
}

li.messageDateTime {
  font-size: 14px;
}

div#messageDetail {
  padding: 10px 30px 10px 30px !important;
  font-size: 14px;
}

ul.messageDetailInformation li {
  font-size: 12px;
}

div.viewMessage {
  padding-top: 15px;
}

div.viewMessage h3 {
  font-size: 18px !important;
  font-weight: 400;
  color: var(--tertiary-link-text-color);
  padding-top: 20px;
}

.addList {
  box-shadow: none;
  background: var(--primary-background-color);
}

a.button.cancelButton {
  width: 100%;
  margin-top: 1px;
  padding-top: 17px !important; /* Override base.css !important */
  padding-bottom: 17px !important; /* Override base.css !important */
  text-shadow: none !important; /* Override base.css !important */
  color: var(--paragraph-text-color);
  font-size: 15px;
  background: var(--gradient-primary-background-color);
}

.actionArea#composeMessage ul.composeMessageForm li {
  padding-left: 32px;
  padding-right: 32px;
}

li.clearfix.to {
  padding-left: 32px !important; /* Override base.css !important */
}

label.px100 {
  color: var(--label-text-color) !important;
  font-weight: bold;
  font-size: 14px;
}

li.clearfix.subjectLine {
  border-bottom: none;
}

input.messageInput {
  margin-bottom: 5px;
}

.composeMessageForm li label {
  padding-left: 0;
}

li.to,
li.subjectLine,
li.markUrget {
  padding-top: 10px !important;
}

input.messageInput {
  height: 30px;
}

form#composeMessage ul li label input {
  left: 5px;
}

#multiDeleteActions {
  border-top: none;
}

#multiDeleteActions ul li.halfWidth {
  width: 50%;
}

a#deleteMessages.button {
  width: 88%;
  margin-right: 2%;
  padding-top: 17px !important; /* override base.css !important */
  padding-bottom: 17px !important; /* override base.css !important */
}

#multiDeleteActions ul a.cancelButton {
  margin-left: 2%;
  width: 88%;
  float: left;
}

#mainContent div.actionArea.viewMessage ul.messageAttachments a {
  border: 1px solid lightgray;
  padding: 5px;
  border-radius: 3px;
  text-decoration: underline;
  display: flex;
  margin: 5px 0;
  width: fit-content;
}

#mainContent ul.menuList li.deleteOn a.mail span.paperclip {
  background: none;
}

#mainContent ul.menuList li a:hover,
#mainContent ul.menuList li a.selected {
  background-color: var(--primary-background-color);
}

.ht-mobileContent-secureMessaging-composeMessage #payorHeader {
  display: none;
}

#composeMessage ul.composeMessageForm li.clearfix.to {
  padding: 0 !important; /* Override base.css !important */
}

#composeMessage ul.composeMessageForm li.subjectLine,
#composeMessage ul.composeMessageForm li.messageArea {
  padding-left: 15px !important; /* Override base.css !important */
  padding-right: 15px !important; /* Override base.css !important */
}

.actionArea#composeMessage ul.composeMessageForm li div#addRecipients li,
.composeMessageForm div.messageToContainer {
  padding-left: 15px;
  padding-right: 15px;
}

.composeMessageForm h1.composeMessageTitle {
  padding: 16px !important; /*used to override the default padding for h1 */
}

.composeMessageForm div.messageToContainer {
  display: flex;
}

.composeMessageForm div.messageToContainer div.recipientsContainer {
  display: flex;
  flex-direction: column-reverse;
}

.composeMessageForm div#recipients {
  display: flex;
  align-items: center;
  background: #eeeeee;
  padding: 0px 13px 0px 13px;
  border: 2px solid #e2e2e2;
  border-radius: 5px;
  height: 44px;
  width: fit-content !important; /* Override base.css !important */
  margin-bottom: 15px;
}

.composeMessageForm div#recipients a {
  display: flex;
  align-items: center;
  width: auto;
  text-indent: 0;
  text-decoration: none;
  color: #000000;
  padding-left: 30px;
  padding-right: 5px;
  background: url(/images/mobile/icons/Icon-Message-Add.svg) no-repeat left;
}

.composeMessageForm div#recipients a span#removeRecipientsLabel {
  display: none;
}

.composeMessageForm div#recipients a.expanded {
  background: url('/images/mobile/icons/Icon-Message-Minus.svg') no-repeat left;
}

.composeMessageForm div#recipients a.expanded span#addRecipientsLabel {
  display: none;
}

.composeMessageForm div#recipients a.expanded span#removeRecipientsLabel {
  display: flex;
}

.composeMessageForm div.selectionContainer span.deleteContainer {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  min-height: 48px;
  padding: 13px;
  background: none;
  border-color: var(--label-text-color);
  border-radius: 5px;
  font-weight: bold;
  color: var(--label-text-color);
  margin-bottom: 10px;
  margin-top: 0;
}

.composeMessageForm div#toRecipients {
  padding-bottom: 0 !important; /* Override base.css !important */
}

.composeMessageForm
  div.selectionContainer
  span.deleteContainer
  a.removeElement {
  transform: scale(1.5) translateY(-2px);
  margin-left: 13px;
  background: url(/images/mobile/icons/icon_x.png) no-repeat scroll 0 3px
    transparent;
  background-size: 8px 8px;
}

.composeMessageForm div.selectionContainer input[type='text'],
input[disabled='disabled'] {
  background: none;
  height: 0;
  padding: 0;
  display: contents;
}

.composeMessageForm div.selectionContainer {
  padding: 0;
}

.composeMessageForm div.selectionContainer input.fullWidth {
  margin: 0;
}

.composeMessageForm li div#addRecipients {
  background: #eeeeee;
}

.composeMessageForm li div#addRecipients li {
  background: url('/images/mobile/icons/Icon-Message-Add.svg') no-repeat right
    center;
  background-position: calc(100% - 10px);
  border-top: 1px solid #dcdcdc;
}

.composeMessageForm div#toRecipients {
  padding-bottom: 0 !important; /* Override base.css !important */
}

.composeMessageForm li div#addRecipients div ul#addRecipientsInner li label {
  font-weight: bold;
  color: var(--label-text-color);
}

.composeMessageForm li.messageArea {
  margin-top: 40px;
}

.composeMessageForm li.messageArea,
.composeMessageForm li.subjectLine {
  border-bottom: 0;
}

.composeMessageForm li.subjectLine input[type='text'],
.composeMessageForm li.messageArea textarea {
  box-sizing: border-box;
  resize: none;
}

.composeMessageForm li.subjectLine input[type='text'] {
  height: 40px;
  width: 100%;
}

.actionArea#composeMessage ul.composeMessageForm li.markUrgent {
  float: right;
  margin-right: 15px;
  margin-top: 5px;
  border: none;
  border-radius: 5px;
  background: #eeeeee;
  padding: 10px 0;
}

.composeMessageForm li.markUrgent label {
  padding: 0 12px;
}

.composeMessageForm li.messageArea textarea {
  border: 1px solid var(--content-box-border-color);
  padding: 10px;
}

#composeMessage #actionButtons.submitCancelButtons {
  padding: 15px;
}

#composeMessage #actionButtons.submitCancelButtons ul li.halfWidth {
  width: calc(50% - 7px);
}

#composeMessage #actionButtons.submitCancelButtons ul li div {
  margin: 0;
  font-family: 'HCo Gotham SSm';
}

#composeMessage
  #actionButtons.submitCancelButtons
  ul
  li
  div
  input[type='submit'] {
  font-family: 'HCo Gotham SSm';
}

#composeMessage #actionButtons.submitCancelButtons ul li div a.cancelButton {
  margin-left: 14px;
}

/* --- Provider Search ---- */

ul.grid li a {
  border: 1px solid var(--filled-button-primary-border-color);
  background: none;
  background-color: var(--filled-button-background-color);
  border-radius: 0;
  padding: 18px;
  color: var(--secondary-link-text-color);
}

span.pharmacy,
span.urgentCare,
span.hospital,
span.providers {
  font-size: 16px;
  font-weight: 400;
  text-shadow: none;
}

div#mobileSearch p {
  padding-left: 25px;
}

div#providerSearchResults {
  background-color: var(--primary-background-color);
}

div#providerSearchResults h2 {
  padding-top: 15px;
  padding-bottom: 15px;
}

div#providerSearch.genericModal div.modalHeader h1 {
  background-color: var(--secondary-background-color);
  font-size: 18px;
}

#contextButton {
  background-image: url(/images/mobile/buttonSprite-black.png);
}

div.modalContent p.marginBottom {
  font-size: 14px;
  padding: 5px;
}

div.modalContent a.modalClose {
  background-color: var(--table-alternating-background-color);
  border-radius: 0;
  border: 1px solid var(--primary-link-border-color);
  color: var(--button-text-color);
  text-shadow: none !important; /* override base text-shadow !important */
}

.useMobileGeoSwitch__customCheckbox {
  position: absolute;
  padding: 12px 5px;
}

#providerListMap.is-visible {
  margin-top: 32px;
}

/* provAdvancedSearch */

#rightNav {
  width: 285px;
  overflow: scroll;
}

#provAdvancedSearch ul li #provZip {
  width: 35%;
  text-indent: 5px;
}

#provAdvancedSearch ul li select#state,
#provAdvancedSearch ul li .provFullSelect,
#provAdvancedSearch ul li select {
  width: 97%;
  text-indent: 0;
  padding-left: 0;
}

#mobileContent.ht-mobileContent-provdir-search #provListHeader {
  background-color: transparent;
}

#mobileContent.ht-mobileContent-provdir-search #contextButton.is-active {
  background-color: transparent;
  right: 35px;
  transform: rotate(180deg);
}

/* ------- Benefits and Eligibility ----- */

h1#payorHeader.benefitsandeligibility {
  padding: 10px 15px 10px 15px;
}

.listHeader h4 {
  font-weight: 400 !important;
  font-size: 18px;
  padding-top: 15px;
  padding-left: 15px;
}

div.listHeader {
  background-color: var(--primary-background-color);
  border-bottom: none;
  color: var(--header-text-color);
}

div.listSubHeader {
  background: none;
  padding: 0 25px 24px 25px;
  font-size: 14px;
}

#mainContent div.contentWrapper {
  padding: 0;
}

ul.itemDetail li {
  border-bottom: 1px solid var(--input-placeholder-text-color);
  padding: 15px 15px 15px 25px;
  margin-bottom: 0;
}

ul.itemDetail li label {
  font-weight: 400;
  font-size: 14px;
  color: var(--paragraph-text-color);
}

ul.itemDetail li span {
  float: right;
}

div.tableWrapper {
  padding: 15px 15px 0 20px;
  background-color: var(--gradient-primary-background-color);
  border-bottom: 1px solid var(--input-placeholder-text-color);
}

div.tableWrapper th {
  padding-right: 15px;
  font-size: 14px;
  padding-left: 5px;
}

/* --- My Plan: My Information --- */

div.memberInfoHeader {
  padding: 15px;
}

ul.memberInfoList li {
  padding-left: 0;
  padding-right: 0;
}

ul.memberInfoList li label {
  padding-left: 15px;
}

ul.memberInfoList li span.fullWidth {
  width: 95%;
}

ul.memberInfoList li span.value.halfWidth {
  width: 45%;
}

ul.memberInfoList li ul li span {
  float: left;
  padding-left: 15px;
  font-size: 15px;
}

ul.memberInfoList li ul li span span {
  padding-left: 0px;
  display: block;
}

a.button.memberInfo {
  width: 200px;
  margin: 15px 0 50px 15px;
}

/* --- My Preferences : User Information --- */

div.userInformation {
  margin-bottom: 50px;
}

div.userInformation form#loginForm {
  padding-top: 0;
}

/* -- My Preferences : Communication Preferences -- */

h1#payorHeader.communicationpreferences,
h1#payorHeader[title='Change Password'],
h1#payorHeader.myinformation {
  display: none;
}

#mainContent ul.mobileCheckList li.mobileCheck label.mobileCheckLabel {
  display: block;
}

/* -- My Preferences : Change Pword -- */

#mainContent h3 {
  padding-top: 25px;
  padding-bottom: 5px;
}

div#accountUpdate {
  padding-top: 0;
  margin-bottom: 50px;
}

.benefitDetail {
  font-size: 16px;
}

div.showBenefitButton {
  background-color: var(--filled-button-text-color) !important;
  border-top: 1px solid var(--content-box-border-color);
  padding-left: 25px;
  font-size: 16px;
}

#mainContent ul.mobileCheckList li {
  margin-top: 5px;
  margin-bottom: 10px;
}

div#showOnlineOnlyBtn {
  border-bottom: 1px solid var(--content-box-border-color);
  margin-bottom: 15px;
}

div#mainContent.benefitElement {
  border: none;
}

h2.userInformationHeader {
  padding-left: 27px !important;
}

form#loginForm input.action.button {
  width: 100%;
}

input:disabled,
#mainContent input.button[disabled='disabled'],
#mainContent .button input[disabled='disabled'] {
  background: #8c8c8c;
  background-color: #8c8c8c;
  border-color: #8c8c8c;
}

input:disabled:hover,
#mainContent input.button[disabled='disabled']:hover,
#mainContent .button input[disabled='disabled']:hover {
  cursor: not-allowed;
  box-shadow: none;
}

@media screen and (max-width: 375px) {
  div.loginHeader {
    height: 230px;
    background-color: var(--primary-background-color);
  }

  #loginHeaderBar img {
    height: 65px;
    padding-left: 30px;
  }
}

@media screen and (max-width: 400px) {
  span.pharmacy,
  span.urgentCare,
  span.hospital,
  span.providers {
    font-size: 13px;
  }
}

/* HIDE MOBILE WEB ELEMENTS FROM MOBILE APP */

.ht-mobileApp #topBarContainer,
.ht-mobileApp #backNavButton,
.ht-mobileApp #Shell-sideMenuBtn-container,
.ht-mobileApp .ht-tfa-header-wrapper div,
.ht-mobileApp #regMobileBanner,
.ht-mobileApp #memberBar,
.ht-mobileApp #backButton,
.ht-mobileApp #menuButton,
.ht-mobileApp .loginHeader,
.ht-mobileApp .loginFooter,
.ht-mobileApp #dropDownMenu,
.ht-mobileApp #Shell-header,
.ht-mobileApp #Shell-footer {
  display: none !important;
}

.ht-mobileApp #loginFormContainer .loginFormHeader {
  padding-top: 18px;
  padding-bottom: 0;
  background-color: white;
  color: var(--header-text-color);
}

.ht-mobileApp .button {
  -webkit-appearance: none;
}

.ht-mobileApp .actionItems ul {
  display: flex !important;
  flex-direction: row;
}

.ht-mobileApp #multiDeleteActions .halfWidth,
.ht-mobileApp #actionButtons .halfWidth,
.ht-mobileApp .ht1-mobile-ActionButtons .halfWidth,
.ht-mobileApp .actionItems .halfWidth {
  margin: 0 !important;
}

.ht-mobileApp #multiDeleteActions .halfWidth a * {
  color: white !important;
}

.ht-mobileApp #multiDeleteActions ul {
  background: white;
}

/* Fix CSS grids */
.ht-mobileApp .grid {
  display: flex !important;
  flex-wrap: wrap;
  padding: 5px !important;
  width: auto;
}

.ht-mobileApp .grid li {
  flex-basis: 45%;
  flex-grow: 1;
  margin: 5px !important;
}

.ht-mobileApp #tabs ul {
  display: flex;
}

/* Disable Mobile Web Menu on swipe */
.isShowingLeftFlyout .ht-mobileApp .pageContent {
  -webkit-transform: translate3d(0, 0, 0) !important;
  transform: translate3d(0, 0, 0) !important;
}

/* Provider Search results hack to fix
   formatting and alignment of text and phone / map icons
*/
.ht-mobileApp #providerListDetails ul li .map,
.ht-mobileApp #providerListDetails ul li .phone {
  justify-content: flex-start !important;
}

.ht-mobileApp #providerListDetails ul.itemDetail li span,
.ht-mobileApp #mainContent .providerSearchArea .menuList p,
.ht-mobileApp #mainContent .providerSearchArea .menuList span {
  margin-top: 4px;
  text-align: left;
}

.ht-mobileApp h1#payorHeader.claims {
  margin-top: 0;
}

.ht-mobileApp .registrationContent {
  margin-top: 0;
}

ul.address li {
  border: none;
}

ul.memberInfoList li {
  padding: 20px 0;
}

ul.address li:first-child {
  padding: 0;
}

ul.address li:first-child label {
  font-weight: bold;
}

ul.address li span.mailingAddress {
  display: flex;
}
ul.address li span.mailingAddress span.mailingCountry {
  margin-left: 5px;
  padding: 0;
}

#alterReason h2 em.required {
  color: #cc0000;
}

/* CUSTOM CHECKBOXES */

.ht-checkable-wrapper {
  height: 20px;
  width: 20px;
  position: relative;
  z-index: 10;
}

#archiveMessagesForm .ht-checkable-wrapper {
  position: relative;
  top: 43px;
  left: 5px;
}

#mainContent #archiveMessagesForm .ht-checkable-wrapper .messageDelete {
  display: inline-block;
  bottom: 3px;
}

.ht-checkable-wrapper input[type='checkbox'] {
  content: '';
  opacity: 0;
  margin: 0;
  position: absolute !important;
  height: 20px;
  width: 20px;
}

.ht-checkable-wrapper input[type='checkbox'] + span::before {
  display: inline-block;
  content: '';
  height: 20px;
  width: 20px;
  background-size: contain;
  background-repeat: no-repeat;
}

.ht-checkable-wrapper input[type='checkbox'] {
  /* force caching of checked image */
  background-image: url('/images/mobile/avera/checkbox_checked.svg');
}
.ht-checkable-wrapper input[type='checkbox'] + span::before {
  background-image: url('/images/mobile/avera/checkbox_unchecked.svg');
}
.ht-checkable-wrapper input[type='checkbox']:checked + span::before {
  background-image: url('/images/mobile/avera/checkbox_checked.svg');
}

.ht-checkable-wrapper input[type='checkbox']:disabled + span::before {
  background-image: url('/images/mobile/avera/checkbox_unchecked_disabled.svg');
}
.ht-checkable-wrapper input[type='checkbox']:disabled:checked + span::before {
  background-image: url('/images/mobile/avera/checkbox_checked_disabled.svg');
}

/* CPS Landing Page */
#mainContent #provCustomSearchOptionsForm {
  --CPS-primary-color: var(--symbol-fill-color);
}
