.enrollIdShieldTileStep1 .answers {
  display: none;
}
.enrollIdShieldTileStep1 label {
  font-weight: bold;
}
.enrollIdShieldTileStep1 .validation {
  color: #ee0000;
}
.enrollIdShieldTileStep1 .indent {
  padding-left: 1.5em;
}
.enrollIdShieldTileStep1 .error {
  color: #ee0000;
}

.enrollIdShieldTileStep2 label {
  font-weight: bold; 
}
.enrollIdShieldTileStep2 .validation {
  color: #ee0000;
}
.enrollIdShieldTileStep2 .indent {
  padding-left: 0.8em;
}
.enrollIdShieldTileStep2 .error {
  color: #ee0000;
}
.enrollIdShieldTileStep2 .alignMiddle {
  vertical-align: middle;
}
.enrollIdShieldTileStep2 #selectedCategory {
  margin-right: 10px;
}
.enrollIdShieldTileStep2 #firefoxUsers {
  display: none;
}
.enrollIdShieldTileStep2 #columnLeft {
  float: left;
  width: 33%;
  padding-top: 10px;
}
.enrollIdShieldTileStep2 #columnCenter {
  float: left;
  width: 33%;
  padding-top: 10px;
}
.enrollIdShieldTileStep2 #columnRight {
  float: right;
  width: 33%;
  padding-top: 10px;
}
.enrollIdShieldTileStep2 #footer_new {
  clear: both;
}
.enrollIdShieldTileStep2 .table {
  width: 405px;
}
.enrollIdShieldTileStep2 .radioCell {
  padding-bottom: 5px;
  padding-left: 50px;
}
.enrollIdShieldTileStep2 .tableCell {
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 5px;
}
.enrollIdShieldTileStep2 .image {
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 5px;
}
.enrollIdShieldTileStep2 .image1 {
  margin-top: 5px;
  margin-bottom: 0px;
  margin-left: 5px;
  margin-right: 5px;
}
.enrollIdShieldTileStep2 .image2 {
  margin-top: 0px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 5px;
}
.wrap-up-ae-link {
  width: 100%;
  margin-top: 20px;
  text-align: center;
  color: #0e57c1;
}

.mv-manageEmp-return-link {
  width: 100%;
  margin-top: 20px;
  text-align: center;
  color: #0e57c1;
}

.enrollIdShieldTileStep3 label {
  font-weight: bold;
}
.enrollIdShieldTileStep3 .indent1 {
  padding-left: 0.75em;
}
.enrollIdShieldTileStep3 .indent2 {
  padding-left: 1.8em;
}

/****************Capture Email*******************/

.secondaryLink {
  padding: 10px;
  margin-bottom: 10px;
  margin-left: 20px;
  margin-right: 10px;
  font-size: var(--fs11);
}

.teamsiteData-cli-prompt p:first-child {
  font-size: var(--fs11);
  font-weight: 600;
}

.clmSecondaryLink {
  padding: 10px;
  margin-bottom: 10px;
  margin-left: 20px;
  margin-right: 10px;
  font-size: var(--fs11);
}
.manageAeCancelLink {
  padding: 10px;
  margin-bottom: 10px;
  /* margin-left: 20px; */
  margin-right: 10px;
  font-size: var(--body-font-size);
}
.cliSecondaryLink {
  padding: 10px;
  margin-bottom: 10px;
  margin-left: 20px;
  margin-right: 10px;
  /* font-size: 0.917em; */
  display: initial !important;
  margin-left: 20px !important;
}
.wrapUpLink {
  /* padding: 10px; */
  margin-bottom: 10px;
}
.manageEmp-return-link {
  margin-bottom: 10px;
  margin-top: 20px;
}
.updateSpendingReturnLink {
  margin-bottom: 10px;
  margin-top: 20px;
}
.maxPageWidth {
  max-width: 550px;
}

/************************************************/

/*Manage ID Shield Images and Phrases Step 1 styles- begin*/
.manageIDShieldImagesAndPhrasesStep1 label {
  font-weight: bold;
}
.manageIDShieldImagesAndPhrasesStep1 .validation {
  color: #ee0000;
}
.manageIDShieldImagesAndPhrasesStep1 .indent {
  padding-left: 0.8em;
}
.manageIDShieldImagesAndPhrasesStep1 .error {
  color: #ee0000;
}
.manageIDShieldImagesAndPhrasesStep1 .alignMiddle {
  vertical-align: middle;
}
.manageIDShieldImagesAndPhrasesStep1 #selectedCategory {
  margin-right: 10px;
}
.manageIDShieldImagesAndPhrasesStep1 #firefoxUsers {
  display: none;
}
.manageIDShieldImagesAndPhrasesStep1 #columnLeft {
  float: left;
  width: 33%;
  padding-top: 10px;
}
.manageIDShieldImagesAndPhrasesStep1 #columnCenter {
  float: left;
  width: 33%;
  padding-top: 10px;
}
.manageIDShieldImagesAndPhrasesStep1 #columnRight {
  float: right;
  width: 33%;
  padding-top: 10px;
}
.manageIDShieldImagesAndPhrasesStep1 #footer_new {
  clear: both;
}
.manageIDShieldImagesAndPhrasesStep1 .table {
  width: 405px;
}
.manageIDShieldImagesAndPhrasesStep1 .radioCell {
  padding-bottom: 5px;
  padding-left: 50px;
}
.manageIDShieldImagesAndPhrasesStep1 .tableCell {
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 5px;
}
.manageIDShieldImagesAndPhrasesStep1 .image {
  margin-top: 5px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 5px;
}
.manageIDShieldImagesAndPhrasesStep1 .image1 {
  margin-top: 5px;
  margin-bottom: 0px;
  margin-left: 5px;
  margin-right: 5px;
}
.manageIDShieldImagesAndPhrasesStep1 .image2 {
  margin-top: 0px;
  margin-bottom: 5px;
  margin-left: 5px;
  margin-right: 5px;
}

/*Manage ID Shield Images and Phrases Step 1 styles- end*/

/*Add an Account styles- begin*/
.addAccount #cancel_button,
.addAccount #save_button {
  margin-top: 15px;
}
.addAccount .ng-modal-overlay {
  /* A dark translucent div that covers the whole screen */
  /*position:absolute;*/
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.8;
}
.addAccount .ng-modal-dialog {
  /* A centered div above the overlay with a box shadow. */
  z-index: 10000;
  position: fixed;
  width: 35%; /* Default */

  /* Center the dialog */
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);

  background-color: #fff;
  box-shadow: 4px 4px 80px #000;
  /* For IE 8 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=0),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=90),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=180),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=270);
}
.addAccount .ng-modal-dialog-content {
  padding: 10px;
  text-align: left;
}
.addAccount .ng-modal-close {
  position: absolute;
  top: 3px;
  right: 5px;
  padding: 5px;
  cursor: pointer;
  font-size: var(--fs14);
  display: inline-block;
  font-weight: bold;
}

/* Styles for RTA pages- begin */
/* New Content Wrapper seen in RTA flow */
#layoutContentBody .collectionsWrapup,
.updated-content-wrapper #layoutContentBody,
.loginAssistance #layoutContentBody,
#layoutContentBody .loginAssistanceFAQ,
.updated-content-wrapper #layoutContentErrorMessages {
  max-width: 500px;
}

.updated-content-wrapper h2 {
  font-size: var(--fs14);
  margin: 0;
}

.updated-content-wrapper .tranCoreButton {
  text-transform: none;
}

.content-margin-25 {
  margin-bottom: 25px;
  margin-top: 25px;
}

.field-container {
  display: flex;
  flex-direction: column;
  max-width: 100%;
}

.field-container.large-view {
  max-width: 300px;
}

.field-container label {
  font-weight: bold;
}

.field-container input,
.button-container {
  margin-top: 10px;
  margin-bottom: 20px;
}
.updateMailingAddress input[type="checkbox"] {
  margin-left: 0;
}
.updateMailingAddress input[type="checkbox"] ~ label {
  padding-left: 5px;
}
.addPhoneNumber input[type="checkbox"] ~ label,
.editPhoneNumber input[type="checkbox"] ~ label,
input[type="radio"] ~ span {
  padding-left: 5px;
}

.updated-content-wrapper select {
  width: 100%;
  margin-top: 10px;
}

.updated-content-wrapper #popupTitleBar {
  height: 0;
  padding: 0;
}

.updated-content-wrapper #popupFrame {
  height: auto !important;
  margin: 15px;
}

#cancelModalHeading,
#rtpRemovePhoneModalHeading,
#rteRemoveEmailModalHeading {
  font-size: var(--fs14);
}

.mt-30 {
  margin-top: 30px;
}

.rte-email-address-links {
  padding-left: 25px;
}

.vcp_accountSummary_col {
  border-bottom: 1px solid black;
  text-align: left;
  vertical-align: top;
}
@media only screen and (max-width: 640px) {
  .updated-content-wrapper .tranCoreButton {
    margin-left: 0;
  }

  .rte-email-address-links {
    padding-left: 0;
    display: block;
  }

  div.paypal-otp-input-area input[type="number"] {
    width: 96%;
    border: none;
    border-bottom: 1px solid #ccc;
    border-radius: 0;
    outline: none;
    padding: 10px 5px 2px 5px;
    height: 20px !important;
  }
}

.link-underline {
  text-decoration: underline;
}

img.icn-alert {
  padding-right: 15px;
  height: 17px;
  vertical-align: bottom;
}

.bannerImage {
  float: left;
}

.bannerLink {
  padding-left: 3px;
  padding-right: 3px;
}

.transactionDetails .trancoreBannerOmvError .bannerLink {
  color: #000000;
}
.trancoreBannerOmvError {
  width: 100%;
  border-left: 4px solid #e84e4e;
  background-color: #fa7676;
  box-sizing: border-box;
}

.trancoreBannerOmvAlert {
  width: 100%;
  border-left: 4px solid #fa8202;
  background-color: #fcae5a;
  box-sizing: border-box;
}

@media only screen and (max-width: 640px) {
  .updated-content-wrapper .tranCoreButton {
    margin-left: 0;
  }
  img.icn-alert {
    padding-right: 15px;
    height: 20px;
  }
}

/* Styles for RTA pages- end */

@media only screen and (max-width: 640px) {
  .addAccount .ng-modal-dialog {
    width: 78%;
  }
}

/*Add an Account styles- end*/

/*Travel notification styles- begin*/
.travelNotification #cancel_button,
.travelNotification #save_button {
  margin-top: 15px;
}
.travelNotification .ng-modal-overlay {
  /* A dark translucent div that covers the whole screen */
  /*position:absolute;*/
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.8;
}
.travelNotification .ng-modal-dialog {
  /* A centered div above the overlay with a box shadow. */
  z-index: 10000;
  position: fixed;
  width: 35%; /* Default */

  /* Center the dialog */
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);

  background-color: #fff;
  box-shadow: 4px 4px 80px #000;
  /* For IE 8 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=0),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=90),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=180),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=270);
}
.travelNotification .ng-modal-dialog-content {
  padding: 10px;
  text-align: left;
}
.travelNotification .ng-modal-close {
  position: absolute;
  top: 3px;
  right: 5px;
  padding: 5px;
  cursor: pointer;
  font-size: 120%;
  display: inline-block;
  font-weight: bold;
}
@media only screen and (max-width: 640px) {
  .travelNotification .ng-modal-dialog {
    width: 78%;
  }
}
/*Travel notification styles- end*/

@media only screen and (max-width: 640px) {
  .accountSummary div#layoutContentArea {
    padding: 0px;
  }
  .accountSummary div#layoutContentPageSubHeader,
  .accountSummary div#layoutContentErrorMessages {
    padding: 0px 2.5% 0px 2.5%;
  }
}

.accountSummary #cancel_button,
.accountSummary #save_button,
.verifySSN #cancel_button,
.verifySSN #save_button {
  margin-top: 15px;
}
.accountSummary .ng-modal-overlay,
.verifySSN .ng-modal-overlay {
  /* A dark translucent div that covers the whole screen */
  /*position:absolute;*/
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000000;
  opacity: 0.8;
}
.accountSummary .ng-modal-dialog,
.verifySSN .ng-modal-dialog {
  /* A centered div above the overlay with a box shadow. */
  z-index: 10000;
  position: fixed;
  width: 35%; /* Default */

  /* Center the dialog */
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);

  background-color: #fff;
  box-shadow: 4px 4px 80px #000;
  /* For IE 8 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=0),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=90),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=180),
    progid:DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=270);
}
.accountSummary .ng-modal-dialog-content,
.verifySSN .ng-modal-dialog-content {
  padding: 10px;
  text-align: left;
}
.accountSummary .ng-modal-close,
.verifySSN .ng-modal-close {
  position: absolute;
  top: 3px;
  right: 5px;
  padding: 5px;
  cursor: pointer;
  font-size: 120%;
  display: inline-block;
  font-weight: bold;
}
@media only screen and (max-width: 640px) {
  .accountSummary .ng-modal-dialog,
  .verifySSN .ng-modal-dialog {
    width: 78%;
  }
}

/*Transaction Details styles- begin*/
/*.transactionDetails #tc_accountSummary {
  width: 62%;
}*/

/*Customer Message Block styles*/
.customerMessageContainer {
  padding: 0 0.8rem;
  width: auto;
  height: auto;
  margin-bottom: 20px;
  /* position: relative; */
  z-index: 20;
}

.fid-app .customerMessageContainer,
.fidelity-app .customerMessageContainer {
  width: auto;
}

#customerMessageHeader,
#customerMessageHeader p,
#customerMessageHeader span {
  font-weight: 600;
}

#customerMessage,
#customerMessage p,
#customerMessage span {
  font-weight: 400;
}
#customerMessage h4,
#customerMessage h3 {
  margin: 0;
  font-weight: 400;
}

.transactionDetails #tc_accountBlock {
  width: 62%;
}

.transactionDetails #transactionDetailTable_pending,
.transactionDetails #transactionDetailTable_recurring {
  display: none;
}
.transactionDetails #transactionDetailTable_completed {
  display: table;
}
.transactionDetails #transactionDetailTable_completed {
  width: 100%;
}
.transactionDetails #transactionDetailTable_recurring h2 {
  padding-top: 10px;
  padding-left: 1%;
}
.transactionDetails #pendingPagination,
.transactionDetails #recurringPagination {
  display: none;
}
.transactionDetails #postedPagination {
  display: block;
}

.transactionDetails div#layoutContentArea {
  padding: 0px;
}

.transactionDetails th.tranDateCol_resp,
.transactionDetails th.postDateCol,
.transactionDetails th.descCol,
.transactionDetails th.amountCol_resp {
  cursor: pointer;
}

.transactionDetails .bx-wrapper .bx-pager,
.transactionDetails .bx-wrapper .bx-controls-auto {
  bottom: 20px;
  width: 95%;
  text-align: right;
  font-size: 0px;
}
.transactionDetails .bx-wrapper {
  margin: 0 auto;
}
.transactionDetails ul.bxslider {
  position: relative;
  margin: 0;
}
.transactionDetails .moreDescDetails_row .transactionDetailsDescription {
  display: flex;
  flex-flow: row wrap;
}
.transactionDetails .enhanced-txn-col {
  flex: 0 0 19%;
  padding-bottom: 20px;
  padding-right: 8px;
  -ms-word-wrap: break-word;
  /*word-break: break-all;*/
}
.transactionDetails .moreDescDetails_row .day-week {
  margin-top: -15px;
  margin-bottom: 20px;
}
.transactionDetails td.descCol {
  cursor: pointer;
}
.transactionDetails .standardDetails.std-no-border {
  border-bottom: 0;
}
.fidelity-app .transactionDetails .standardDetails.std-no-border {
  background: none !important;
}
.transactionDetails .standardDetails.std-border {
  border-bottom: 1px solid;
}
.fidelity-app .transactionDetails .standardDetails.std-border {
  background: url("/onlineCard/static/fid/img/trans_details_dashed.png") left bottom repeat-x;
}
.transactionDetails .twoColTableValue .span-dispute {
  display: inline-block;
  text-align: left;
}

@media only screen and (max-width: 1024px) {
  /*.transactionDetails #tc_accountSummary {
    width: 100%;
  }*/
  .transactionDetails #tc_accountBlock {
    width: 100%;
  }
  .transactionDetails .enhanced-txn-col {
    flex: 0 0 23%;
  }

  /* removing this code to show download transaction button for all view of screen in transaction details page, @kamal, Meduri on 02/10/21 */
  /* .navDownloadTransactionData,
  .downloadTransactionLink {
    display: none !important;
  } */
}

.reviewTransactionDataSharing #popupFrame {
  height: 325px !important;
}

@media only screen and (max-width: 420px) {
  .reviewTransactionDataSharing #popupFrame {
    height: 400px !important;
  }
}

@media only screen and (max-width: 790px) {
  .transactionDetails .enhanced-txn-col {
    flex: 0 0 31%;
  }
}

@media only screen and (max-width: 640px) {
  .transactionDetails .enhanced-txn-col {
    flex: 0 0 47%;
  }
  .transactionDetails #transactionDetailTable_recurring h2 {
    padding-top: 20px;
    font-size: 1.5em;
  }
  /* removing this code to show download transaction button for all view of screen in transaction details page, @kamal, Meduri on 02/10/21 */
  /* .navDownloadTransactionData,
  .downloadTransactionLink {
    display: none !important;
  } */
}

@media only screen and (max-width: 375px) {
  .transactionDetails .enhanced-txn-col {
    padding-bottom: 15px;
    flex: 0 0 90%;
  }
  .transactionDetails .twoColTableValue .span-dispute {
    float: left;
  }
}
/*Transaction Details styles- end*/

/*Change Address styles- begin*/
.changeAddressChitl1of3 .checkBoxAndText,
.changeAddress1of3 .checkBoxAndText {
  margin-top: 10px;
  height: 25px;
}

.changeAddressChitl1of3 .checkBoxOnLeft,
.changeAddress1of3 .checkBoxOnLeft {
  width: 10%;
  max-width: 20px;
  vertical-align: middle;
  float: left;
  margin: 5px;
}

.changeAddressChitl1of3 .checkBoxTextOnRight,
.changeAddress1of3 .checkBoxTextOnRight {
  width: 80%;
  vertical-align: middle;
  float: left;
  margin: 5px;
}
/*Change Address styles- end*/

/*Popup layout styles- begin*/
#popupLayoutContent {
  margin: 0;
  font-family: var(--usb-circular, var(--usb-fallback));
  padding: 15px;
}

#esignConsent {
  height: 100%;
  overflow: auto;
}

.popupContent {
  padding-right: 22px;
}
/*Popup layout styles- end*/

.alerts div.tieringElement.phonePaddingForContentWithTables {
  padding-top: 15px;
}

.alerts td.alertTableDesc,
.alerts td.vcp_alert_detail {
  padding-left: 9px;
}

/*Income Prompt teamsite override */
.incomePrompt div.income-explaination p {
  display: inline;
}

@media only screen and (max-width: 640px) {
  .alerts div#layoutContentArea {
    padding: 0;
  }
  .alerts div#layoutContentPageSubHeader,
  .alerts div#layoutContentErrorMessages {
    padding: 0 2.5% 0 2.5%;
  }
  .alerts div.phonePaddingForContentWithTables {
    padding: 0 2.5% 0 2.5%;
  }
  .alerts div.tieringElement.phonePaddingForContentWithTables {
    padding-top: 10px;
  }
  .alerts .vcp_alert_detail {
    white-space: normal;
  }
  .alerts .vcp_alert_status {
    white-space: normal;
    min-width: 75px;
  }
  .alerts .vcp_alert_action {
    white-space: normal;
    min-width: 65px;
  }
  .alerts input.alertNonTextInput {
    width: 95%;
    margin-top: 2.5%;
  }
  .alerts .text_margin {
    margin-top: 5px;
  }
  .alert_header_carrot__omv {
    float: right;
    padding-right: 30px;
  }
  .alert_header_carrot__omv span {
    font-weight: bold;
  }

  .alertTableDesc.omv__view {
    padding-left: 10px;
  }

  .alertTableAction.omv__view {
    padding-right: 10px;
  }

  .tc_Table.omv__view tr:last-child {
    border-bottom: none;
  }
}

/*Setup alert Step One styles- begin*/
@media only screen and (max-width: 640px) {
  .enrollmentStatements #dd_addr_type_1,
  .enrollmentStatements #dd_addr_type_2,
  .enrollmentStatements #dd_addr_type_3,
  .updateAlert #dd_addr_type_1,
  .updateAlert #dd_addr_type_2,
  .updateAlert #dd_addr_type_3,
  .createAlert #dd_addr_type_1,
  .createAlert #dd_addr_type_2,
  .createAlert #dd_addr_type_3 {
    margin: 0px 5px 5px 0px;
  }
  .enrollmentStatements input.alertNonTextInput,
  .updateAlert input.alertNonTextInput,
  .createAlert input.alertNonTextInput {
    width: 95%;
    margin-top: 2.5%;
  }

  div#layoutContentErrorMessages {
    background: #ffffff;
    padding-left: 10px;
  }

  .enrollmentStatements div#layoutContentPageSubHeader,
  .enrollmentStatements div#layoutContentErrorMessages,
  .updateAlert div#layoutContentPageSubHeader,
  .updateAlert div#layoutContentErrorMessages,
  .createAlert div#layoutContentPageSubHeader,
  .createAlert div#layoutContentErrorMessages {
    padding: 0 2.5% 0 2.5%;
  }
}
/*Setup alert Step One styles- end*/

.textOptInPage .loader_img {
  margin: -6px auto;
  width: 3%;
}
.textOptInPage .tranCoreButton {
  margin-bottom: 5px;
}
.textOptInPage #address_text_1,
.textOptInPage #address_text_2,
.textOptInPage #address_text_3,
.textOptInPage #addressText_1,
.textOptInPage #addressText_2,
.textOptInPage #addressText_3 {
  display: inline-block;
  width: 15%;
}
.textOptInPage .adjust_button {
  margin-left: 0px;
}
.textOptInPage .error_text {
  color: #ee0000;
}
.textOptInPage .circle {
  position: absolute;
  width: 20px;
  height: 20px;
  border: none;
  background-color: #ee0000;
  overflow: visible;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  /* margin-top: -15px; */
}
.textOptInPage .color_red {
  background-color: #ee0000;
}
.textOptInPage .color_green {
  background-color: green;
}
.textOptInPage .circle div {
  text-align: center;
  font-size: 15px;
  line-height: 19px;
  font-weight: bold;
  /*This is made important to try and correct for iOS bug that makes the X grey instead of white.*/
  color: #ffffff !important;
  height: 20px;
  width: 20px;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -10px;
  margin-left: -10px;
  font-family: var(--usb-circular, var(--usb-fallback));
  padding-top: 0px;
}
.textOptInPage .checkBoxAndText {
  margin-top: 10px;
  height: 25px;
}
.textOptInPage .checkBoxOnLeft {
  width: 10%;
  max-width: 20px;
  vertical-align: middle;
  float: left;
  margin: 5px;
}
.textOptInPage .checkBoxTextOnRight {
  width: 80%;
  vertical-align: middle;
  float: left;
  margin: 5px;
}
.textOptInPage ol.alert_content > li:not(:first-child) {
  padding-top: 5px;
}
@media only screen and (max-width: 640px) {
  .textOptInPage #addressText_1,
  .textOptInPage #addressText_2,
  .textOptInPage #addressText_3 {
    display: block;
  }
  .textOptInPage .loader_img {
    margin: -3px auto;
    width: 4%;
  }
  .textOptInPage #address_text_1_confirm,
  .textOptInPage #address_text_2_confirm,
  .textOptInPage #address_text_3_confirm {
    width: 42%;
    margin-right: 5px;
    margin-bottom: 5px;
  }
  .textOptInPage .checkBoxTextOnRight {
    margin: 0px;
  }
  .textOptInPage #address_text_1,
  .textOptInPage #address_text_2,
  .textOptInPage #address_text_3,
  .textOptInPage #addressText_1,
  .textOptInPage #addressText_2,
  .textOptInPage #addressText_3,
  .textOptInPage #address_text_1.omv__view,
  .textOptInPage #address_text_2.omv__view,
  .textOptInPage #address_text_3.omv__view,
  .textOptInPage #addressText_1.omv__view,
  .textOptInPage #addressText_2.omv__view,
  .textOptInPage #addressText_3.omv__view {
    width: 35%;
  }
  .textOptInPage .circle {
    position: relative;
    margin-top: 10px;
  }
}
.textOptInPage #address_text_1_send_button,
.textOptInPage #address_text_2_send_button,
.textOptInPage #address_text_3_send_button {
  display: none;
}
/*OMV overrides for ipad portrait orientation*/
@media only screen and (min-width: 641px) {
  .textOptInPage #address_text_1_confirm,
  .textOptInPage #address_text_2_confirm,
  .textOptInPage #address_text_3_confirm {
    width: 57%;
    margin-right: 5px;
    margin-bottom: 5px;
  }

  .textOptInPage .circle {
    position: relative;
    margin-top: 10px;
  }
  .confirmationBlock_omv {
    display: flex;
  }
  .addressTextConfirmBlock_omv {
    width: 46%;
    /*margin-top: -5px;*/
  }
}

@media only screen and (max-width: 640px) {
  .alertsHistory div#layoutContentArea {
    padding: 0px;
  }
  .alertsHistory div#layoutContentPageSubHeader,
  .alertsHistory div#layoutContentErrorMessages {
    padding: 0px 2.5% 0px 2.5%;
  }
  .alertsHistory div.phonePaddingForContentWithTables {
    padding: 0px 2.5% 0px 2.5%;
  }
}

@media only screen and (max-width: 640px) {
  .enrollmentStatements #dd_addr_type_1,
  .enrollmentStatements #dd_addr_type_2,
  .enrollmentStatements #dd_addr_type_3 {
    margin: 0px 5px 5px 0px;
  }
  .enrollmentStatements input.alertNonTextInput {
    width: 95%;
    margin-top: 2.5%;
  }
  .enrollmentStatements div#layoutContentPageSubHeader,
  .enrollmentStatements div#layoutContentErrorMessages {
    padding: 0 2.5% 0 2.5%;
  }
}

/*styles for reactive search box used by OMV*/
.omv-alerts-suggest {
  width: auto;
  border: 1px solid black;
}

.suggestedContact {
  display: block;
  padding: 2px;
}

/*style for dynamic form input wrapper pulled out of code for alerts*/
.alerts .alerts-dynamic-input {
  display: inline-block;
  padding-left: 8px;
}

.alerts .alerts-dynamic-input-omv input {
  width: 95%;
  margin-top: 2.5%;
  margin-left: 0px;
  height: 2.5em;
  font-size: 1rem;
  border-bottom: none !important;
}

.textOptInPage .omv_button--hollow {
  text-transform: uppercase;
}

/*Navigation styles*/
@media only screen and (min-width: 641px) {
  ul#mainNav,
  ul#topNav {
    display: block !important;
  }
}

/*Style to make sure that target for the links in the nav is not limited to the text*/
ul.leftNav li a {
  display: block;
}

/*style to add some space before help icon for all the partners across all the pages*/
img.cursor_help {
  padding-left: 3px;
}

.contentBold,
.disclaimerBold {
  font-weight: bold;
}

.editAutoPayConfirmation .largerLabel,
.autoPayConfirmation .largerLabel,
.confirmPayment .largerLabel,
.editConfirmPayment .largerLabel,
.largerLabelUpdated,
#CardActivationApp .recurring-merchant-section .largerLabel {
  font-size: var(--fs16);
  font-weight: bold;
}
.autoPayConfirmation #autopayPaymentSchedule {
  margin: 20px 0;
}
.autoPayConfirmation .payment-details {
  border-bottom: 1.9px solid;
  padding-bottom: 5px;
  width: 125px;
}

.autopayFirstPayment {
  margin: 20px 0 20px 0;
}

/*Recurring Merchants page styles- begin*/
.recurringChargesMerchants section#layoutContentPageSubHeader #subHeader {
  padding-left: 1%;
}
.recurringChargesMerchants .twoColTableValue {
  margin-top: -2.5%;
  margin-bottom: 25px;
}
.recurringChargesMerchants #transactionDetailTable_recurring h2 {
  display: none;
}
@media only screen and (max-width: 640px) {
  .recurringChargesMerchants .twoColTableValue {
    margin-bottom: 0;
    margin-top: 15px;
    padding-left: 1%;
    text-align: left;
  }
}
/*Recurring Merchants page styles- end*/

div.real-time-modal-centered-text {
  display: flex;
  flex-direction: column;
  margin: 0;
  top: auto;
  width: 100%;
}

.real-time-modal-centered-text a {
  margin: 0;
  padding: 0 !important;
  text-align: center;
  width: 100%;
}

.real-time-modal-centered-text a:nth-child(1) {
  margin-bottom: 10px;
}

/* ************************* RTP/ RTE PHONE/ EMAIL LIST STYLE ************************** */
.phoneNumbers ul,
.emailAddresses ul {
  list-style-type: none;
  padding-left: 0px;
  margin-top: 0px;
  white-space: nowrap;
}
.phoneNumbers ul li,
.emailAddresses ul li {
  margin: 0px;
}

li.rtp-phone-number {
  display: flex;
  justify-content: space-between;
  max-width: 225px;
}
li.rte-email-address {
  display: flex;
  justify-content: flex-start;
}

@media only screen and (max-width: 640px) {
  li.rte-email-address {
    display: block;
    justify-content: normal;
  }

  .emailAddresses ul {
    white-space: normal;
  }

  .emailAddresses ul li {
    overflow-wrap: break-word;
    word-wrap: break-word;
  }

  .emailAddresses ul li:not(:first-child) {
    padding-top: 20px;
  }
}

#rteRemoveEmailModalText {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

#transactionDetailTable_recurring .elanTable tr .merchant-name {
  width: 35%;
}
#transactionDetailTable_recurring .elanTable tr .merchant-info {
  width: 45%;
}
#transactionDetailTable_recurring .elanTable td.merchant-name,
#transactionDetailTable_recurring .elanTable td.merchant-info {
  word-break: break-all;
}
#popupLayoutContent .greencheck,
.confirmPayment .greencheck,
.editConfirmPayment .greencheck,
.contactInfo .greencheck {
  background-image: url(../img/check_green_icon.png);
  background-repeat: no-repeat;
  background-position: center;
  min-width: 22px;
  min-height: 22px;
  background-size: contain;
  display: inline-block;
  margin-right: 5px;
  transform: translate(0%, 25%);
}

.contactinfo-confirmation-container {
  align-items: flex-start;
  display: flex;
}

.contactinfo-confirmation-container p {
  margin-top: 0;
}

.contactinfo-confirmation-container .greencheck {
  transform: none;
}

div.rtp-add-phone-number-cancel-no-phone {
  display: flex;
  flex-direction: column;
  margin: 0;
  top: auto;
  width: 100%;
}

.rtp-add-phone-number-cancel-no-phone a {
  margin: 0;
  padding: 0 !important;
  text-align: center;
  width: 100%;
}

.rtp-add-phone-number-cancel-no-phone a:nth-child(1) {
  margin-bottom: 10px;
}

li.rtp-phone-number {
  display: flex;
  justify-content: space-between;
  max-width: 225px;
}

.managePaymentBanner {
  display: flex;
  align-items: center;
}

#popupLayoutContent .updatedlabel,
.confirmPayment .updatedlabel,
.editConfirmPayment .updatedlabel {
  font-size: 22px;
  color: #4d4f53;
}
#popupLayoutContent .changeAddress,
.confirmPayment .changeAddress,
.editConfirmPayment .changeAddress {
  padding-left: 35px;
}

/*card activation confirmation page styles- begin*/
#CardActivationApp img.success-indicator {
  vertical-align: middle;
  padding-right: 10px;
}
#CardActivationApp .recurring-merchant-section {
  padding: 20px 0;
}
/*card activation confirmation page styles- end*/

@media only screen and (max-width: 640px) {
  .confirmPayment .mobile-header,
  .editConfirmPayment .mobile-header {
    text-align: center;
  }
}
@media only screen and (max-width: 640px) {
  .wrapUpLink {
    padding: 10px;
    margin-bottom: 10px;
  }
  .manageEmp-return-link {
    padding: 10px;
    margin-bottom: 10px;
    margin-top: 20px;
  }
}
@media only screen and (max-width: 640px) {
  .updateSpendingReturnLink {
    padding: 10px;
    margin-bottom: 10px;
    margin-top: 0px !important;
  }
}

/*styles for the vertical positioning of the footer and body content container*/
div#root,
div#root > div,
div#root > div > div#layoutPageContent:not(.ie-user) {
  min-height: 100vh;
}
div#root > div > div#layoutPageContent:not(.ie-user) {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
div#layoutPageContent:not(.ie-user) div#layoutMiddleWrapper {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

/*ShieldImageComponent Styles*/

.alignImage {
  margin-right: 20px;
  margin-top: 20px;
  margin-bottom: 20px;
  height: auto;
  width: auto;
  float: left;
  text-align: left;
}
.alignMe {
  clear: both;
}

/*BrowserCheckComponent Styles*/

a img {
  border: none;
}

#ieUpgradeMask {
  display: none;
  background: #000000;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1000;
  filter: alpha(opacity=50);
  opacity: 0.5;
}

#ieUpgradeMaskFrame {
  display: none;
  width: 100%;
  position: absolute;
  z-index: 999;
  height: 100%;
  top: 0;
  left: 0;
  filter: alpha(opacity=0);
  opacity: 0;
}

#ieUpgrade {
  display: none;
  width: 500px;
  background: #ffffff;
  z-index: 1010;
  position: absolute;
  top: 20px;
  border: 1px solid red;
  padding: 10px 25px 10px;
}

#ieUpgrade h1 {
  color: #646262;
  font-weight: bold;
  font-size: var(--fs16);
  margin: 0;
  padding: 0;
  clear: both;
}

#ieUpgrade .upgradeContent {
  color: #646262;
  font-size: var(--body-font-size);
  text-align: left;
  padding-top: 10px;
}

#ieUpgrade .upgradeClose {
  margin: 0 0 10px;
  color: #226afb;
  font-weight: bold;
  font-size: var(--fs14);
}

#ieUpgrade .upgradeCloseX {
  margin: 0 0 10px;
  color: #226afb;
  font-weight: bold;
  font-size: var(--fs14);
  float: right;
  color: red;
  font-weight: bold;
  font-size: 15px;
  cursor: pointer;
}

#upgradeCloseLink {
  cursor: pointer;
  text-decoration: underline;
}

#ieUpgrade .upgradeBrowsers {
  margin: 0 auto;
  text-align: center;
}

#ieUpgrade .upgradeBrowsers img {
  margin: 0 10px;
}

#upgradeBrowsersLinks {
  list-style-type: none;
  text-align: center;
  margin-left: 10px;
  height: 100px;
}

#upgradeBrowsersLinks li {
  float: left;
  color: #226afb;
  font-size: var(--fs11);
}

#upgradeBrowsersLinks li a {
  text-decoration: none;
  color: #226afb;
  font-size: var(--fs11);
}

/**** Transaction Data Sharing Page ****/
.Opt-In.Status {
  padding-bottom: 15px;
}
.customize-toggle-label {
  margin-left: 0px;
  margin-top: 0px;
  height: 31px !important;
}
.vertical-center {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
  align-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.status-label {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 31px;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center;
  border: 1px solid #dddddd;
  padding: 0px 10px 0px 10px;
  border-right: none;
}

.toggle-label {
  position: relative;
  width: 80px;
  height: 30px;
  border: 1px solid #dddddd;
}
.toggle-label input[type="checkbox"] {
  opacity: 0;
  position: absolute;
  width: 100%;
  height: 100%;
}
.toggle-label input[type="checkbox"] + .back {
  position: absolute;
  width: 100%;
  height: 100%;
  background: #19398a;
  -webkit-transition: background 150ms linear;
  -o-transition: background 150ms linear;
  transition: background 150ms linear;
}
.toggle-label input[type="checkbox"]:checked + .back {
  background: #19398a;
}

.toggle-label input[type="checkbox"] + .back .toggle {
  display: block;
  position: absolute;
  content: " ";
  background: #efefef;
  width: 50%;
  height: 100%;
  -webkit-transition: margin 15ms linear;
  -o-transition: margin 15ms linear;
  transition: margin 15ms linear;
  border-right: 1px solid #efefef;
  border-radius: 0;
}
.toggle-label input[type="checkbox"]:checked + .back .toggle {
  margin-left: 39px;
}
.toggle-label .label {
  display: block;
  position: absolute;
  width: 50%;
  line-height: 30px;
  text-align: center;
  font-size: var(--fs11);
}
.toggle-label .label.on {
  right: 0px;
}
.toggle-label .label.off {
  left: 0px;
}

.toggle-label input[type="checkbox"]:checked + .back .label.off {
  color: #efefef;
}
.toggle-label input[type="checkbox"] + .back .label.on {
  color: #efefef;
}
.toggle-label input[type="checkbox"]:checked + .back .label.on {
  color: #4d4f53;
}
.toggle-label .back:hover {
  cursor: pointer;
}

/*** Transaction Data Sharing Alert popup ***/

.transactiondatasharing .ng-modal-overlay {
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #efefef;
  opacity: 0.8;
}

.transactiondatasharing .ng-modal-dialog {
  z-index: 10000;
  position: fixed;
  width: 75%;
  max-width: 300px;
  top: 42%;
  left: 45%;
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  background-color: white;
  border: 3px solid black;
  outline: none;
  /*box-shadow: 4px 4px 80px #000;*/
  /* For IE 8 */
  filter: progid: DXImageTransform.Microsoft.Shadow(Color=#707070, Strength=3, Direction=0),
    progid: DXImageTransform.Microsoft.Shadow(Color=#707070, Strength=3, Direction=90),
    progid: DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=180),
    progid: DXImageTransform.Microsoft.Shadow(Color=#404040, Strength=3, Direction=270);
}

.transactiondatasharing .ng-modal-dialog-content {
  padding: 10px;
  text-align: left;
}

.transactiondatasharing .container {
  display: table;
  margin-top: 4%;
  width: 100%;
  border-collapse: collapse;
}

/*.transactiondatasharing .selected-tab {
    background-color: #19398a;
}

.transactiondatasharing .tab {
    text-transform: uppercase;
}
.transactiondatasharing .selected-tab {
    background: #707070;
	
}
.transactiondatasharing .tab {
   font-weight: bold;
    display: table-row;
    text-align: center;
    line-height: 20px;
    display: inline;
    padding: 1% 2%;
    background-color: #EFEFEF;
    margin-right: 1px;
}

.transactiondatasharing .tab-holder {
    height: 26px;
}

#transactionDataSharingForm .transactiondatasharing .tab a {
    color: #4D4F53;
    font-weight: bold;
    font-size: 1.167em;
}

#transactionDataSharingForm .transactiondatasharing .selected-tab a {
    color: #EFEFEF;
}

.transactiondatasharing .selected-tab {
    background-color: #19398a;
}*/

.vcp_subscriberid {
  display: inline;
  margin-left: 10px;
}
.vcp_subscriberid_link {
  display: inline;
}
/*.headerContent.subscriberId {
    padding-right: 254px;
}*/

.tab-Element {
  margin-left: 15px;
}

.tab-bodyElement {
  padding-bottom: 35px;
}
.omv-accountBubbleLink {
  display: block;
}

/*for IE users, will fix footer overlap issue*/
#layoutMiddleWrapper.ie-user {
  /*padding-bottom: 5%;*/
  position: relative;
}
#layoutMiddleWrapper.ie-user:after {
  display: block;
  content: ".";
  visibility: hidden;
  position: relative;
  bottom: 0;
  height: 10vh;
  width: 100%;
}

/*for the misalignment of floats in header for: elan, usb, usb-quicken*/
@media screen and (min-width: 640px) {
  .header-float-control {
    clear: right;
    float: right;
  }
  .header-float-control .headerContent:first-child {
    padding-right: 0px;
    float: none;
  }
}

/* prevent user from clicking outside of modal when present on page */
.modal-present-unclickable {
  pointer-events: none;
}
.modal-present-unclickable .ng-modal {
  pointer-events: auto;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type="number"] {
  -moz-appearance: textfield;
  margin: 0;
}

/* Edgecases for padding of Page Headers in responsive views  */
@media only screen and (max-width: 640px) {
  .accountSummary h1.contentAreaSubHeader span {
    padding-left: 1%;
  }
}

/* min width to fields based on number of characters */
@media only screen and (max-width: 1024px) {
  body input[type="text"],
  body input[type="number"],
  body input[type="password"],
  body input[type="tel"],
  body input[type="email"],
  body select {
    height: 2.5em;
  }
}
body input[type="text"],
body input[type="number"],
body input[type="password"],
body input[type="tel"],
body input[type="email"],
body select {
  background-color: transparent;
}
.tc_field_2_chars {
  min-width: 47px;
  max-width: 47px;
}
.tc_field_3_chars {
  min-width: 54px;
  max-width: 54px;
}
.tc_field_4_chars {
  min-width: 60px;
  max-width: 60px;
}
.tc_field_5_chars {
  min-width: 68px;
  max-width: 68px;
}
.tc_field_7_chars {
  min-width: 75px;
  max-width: 75px;
}
.tc_field_10_chars {
  min-width: 103px;
  max-width: 103px;
}
.tc_field_12_chars {
  min-width: 142px;
  max-width: 142px;
}
.tc_field_16_chars {
  min-width: 145px;
  max-width: 145px;
}
.tc_field_20_chars {
  min-width: 165px;
  max-width: 165px;
}

/* Fix given for defectID-48556
*/
@media (max-width: 1024px) {
  .auSelectOMV {
    font-size: 1rem;
    height: 2.5em;
    padding: 0px;
  }
}
.auSelect {
  padding: 1px 2px;
}

/* Fix given for defectID-6964
 */
#dd_addr_email_1,
#new_email_1,
#dd_addr_text_1,
#new_text_1,
#dd_addr_email_2,
#new_email_2,
#dd_addr_text_2,
#new_text_2,
#dd_addr_email_3,
#new_email_3,
#dd_addr_text_3,
#new_text_3 {
  margin-left: 0.5em;
}
/* Fix given for defectID-3926
 */
.paddingBottom5px {
  padding-bottom: 0.3em;
}

.marginTop10px {
  margin-top: 10px;
}
.marginTop15px {
  margin-top: 15px;
}
.marginbottom5px {
  margin-bottom: 5px;
}

/*input fields with grey background needing white hardcoded*/
#initialQuestions span.answers > input,
div.infoVerification input {
  background-color: white;
}

@media only screen and (max-width: 375px) {
  .manageIDShieldImagesAndPhrasesStep1 #columnRight {
    float: none;
  }
}

td.tranDateCol_resp,
td.amountCol_resp,
.vcp_welcomeUser_message,
.transactionDetails #postedPagination,
.transactionDetails th.amountCol_resp {
  padding-left: 10px;
  padding-right: 10px;
}

.incomePrompt #popupTitle {
  float: none;
  font-size: 1.1em;
}

.incomePrompt #popupFrame {
  margin: 0;
  position: relative;
  z-index: 202;
}
.EsignPoupHeading {
  padding-top: 12px !important;
  display: inline-block;
}
.topHeaderSummary {
  margin-bottom: 20px;
  width: 100%;
  height: auto;
}

#esignAgreementContainer td:nth-child(2) {
  padding-left: 1%;
  padding-right: 1%;
}

#esignAgreementContainer tr {
  vertical-align: top;
}

div#contentWrapper {
  outline: none;
}

.tc_page_speedbump h2.contentAreaSubHeader {
  padding: 0;
  font-size: 2em;
}
.tc_page_speedbump .buttonnav .tranCoreButton:first-of-type {
  margin-left: 0;
}

ul.cardLostStolenList {
  padding-left: 1.25rem;
}
.enhancedTransactionsModal {
  z-index: 10001;
  left: calc(50% - 170px);
  position: absolute;
  top: 25vh;
  border: 1px solid #000000;
  background-color: #ffffff;
  outline: none;
  max-width: 340px;
  margin: 0;
  padding: 10px 15px;
}

.right_alignedLink {
  margin-left: 90% !important;
  text-decoration: none;
}
.deliveryFee span {
  font-weight: bold;
}
@media only screen and (max-width: 640px) {
  .makePaymentWidth {
    width: 227%;
  }
  .OMVpdpWidth {
    width: 145%;
  }
}

@media only screen and (max-width: 320px) {
  .makePaymentWidth {
    width: 300%;
  }
}
/* CardReplacement & Responsive View for CR Start*/

@media only screen and (max-width: 320px) {
  .full-width-btn {
    width: 100%;
    margin: 100px 0px 10px 0px !important;
  }
}

@media only screen and (max-width: 640px) {
  .full-width-btn {
    margin: 100px 0px 10px 0px !important;
  }
}
.header-line {
  border-bottom: 1px solid #000;
  padding-bottom: 10px;
}
.listStyle {
  padding-left: 20px;
  margin: 0px;
}
/* CardReplacement End */

/* preferred email style starts here */

.preferred-email-input-label,
.security-alerts-preferredemail-label {
  font-weight: bold;
}

.preferred-email-text-area {
  width: 232px;
}
.preferred-email-text-area-input {
  width: 300px;
  z-index: 2;
}
.preferredEmail-teamsite-content {
  max-width: 500px;
}

.preferred-email-EnterEmail,
.security-alerts-link {
  margin-bottom: 15px;
}
.preferred-email-addAlternate {
  margin-top: 20px;
}
.preferred-email-deleteEmail-text {
  width: 370px;
  margin-top: 8px;
}
.preferred-email-alternateClearField,
.addPhoneNumber-checkBox {
  display: flex;
}
.preferred-email-clearField-icon {
  background-color: #5b5959;
  border-radius: 50%;
  font-size: 7px;
  z-index: 4;
  color: snow;
  margin-left: -2%;
  margin-top: 0.4%;
  position: relative;
  cursor: pointer;
  font-weight: bold;
  padding: 2px;
  width: 9px;
  height: 9px;
  text-align: -webkit-center;
  padding-top: 3px;
  padding-right: 3px;
}
.preferred-email-inputField {
  width: 304px;
  margin-bottom: 12px;
}
.preferred-email-confirmText {
  margin-top: 20px;
  margin-bottom: 30px;
}
.preferred-email-errorMessage {
  color: #ee0000 !important;
}
.preferred-email-errorList {
  margin-top: 0.4em;
}
/* Security Alerts - Preferred Email styles starts here */
.security-alerts-largerLabel {
  margin-bottom: 20px;
  font-size: 15px;
  font-weight: bold;
  margin-top: 25px;
}
.sec-alert-padding {
  font-weight: bold;
  margin-bottom: 5px;
}
.sec-alert-button {
  margin-left: 20px !important;
}
.sec-paddingContent {
  margin-bottom: 15px;
}
/*card replacement*/
.deliveryText {
  display: inline;
}
.standardDeliveryFee {
  margin-left: 42px;
  display: inline;
}
.expeditedDeliveryFee {
  margin-left: 25px;
  display: inline;
}
/* login tooltips */
.login-tooltips {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
/*biometric login*/
.tranCoreButton.biometricReminderModalButton {
  width: 100%;
}

#biometricLoginReminderPopup {
  position: absolute;
  top: 131px;
  left: 10%;
  background: #fff;
  border: 1px solid black;
  width: 80%;
}

#biometricSpinner {
  width: 40px;
  margin: 0 auto;
}

/* ******Paypal Feature Styles****** */
.paypal-button-margin {
  margin-bottom: 25px;
  margin-top: 25px;
}
.paypal-returnLabel-margin {
  margin-bottom: 5px;
  margin-top: 30px;
}
.paypal-label-bold {
  font-weight: 700;
}
.paypal-radio-inputs input[type="radio"] {
  margin: 4px;
  display: inline-block;
  vertical-align: middle;
}
.paypal-error {
  color: red;
  margin-top: -0.5rem;
}
.paypal-radio-inputs > div {
  display: block;
  margin: 1em 0em;
}

.paypal-Teamsite-Content > p {
  margin-bottom: 15px;
  font-weight: 400;
}

/* ******lock or unlock Feature Styles****** */
.lockOrUnlock-unlock-icon {
  background-image: url(../img/success-checkmark.png);
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: top;
  width: 16px;
  height: 15px;
  background-size: contain;
  display: inline-block;
  margin-right: 5px;
}
.lockOrUnlock-lock-icon {
  background-image: url(../img/locked-icon.png);
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: top;
  width: 16px;
  height: 15px;
  background-size: contain;
  display: inline-block;
  margin-right: 5px;
}
.lockOrUnlock-lock-text {
  margin-bottom: 15px;
  max-width: 480px;
  line-height: 1.5;
}
.lockOrUnlock-ul {
  max-width: 480px;
}
.lockOrUnlock-button-margin,
.paypal-button-margin {
  margin-bottom: 25px;
  margin-top: 25px;
}
.lockOrUnlock-returnLabel-margin {
  margin-bottom: 5px;
  margin-top: 30px;
}
.lockOrUnlock-button,
.sentence-case-button {
  text-transform: none !important;
}
.lockOrUnlock-active-text {
  color: #0a853d;
}
.lockOrUnlock-inactive-text {
  color: #e6172c;
}
.lock-banner-heading {
  margin-top: 0px;
  margin-bottom: 5px;
}
.lock-banner-status-text {
  margin-bottom: 10px;
  width: 95%;
}
.transactionDetails .cardLockedBanner h3 {
  margin: 0;
}
.transactionDetails .cardLockedBanner,
.transactionDetails .paymentPastDueBanner {
  background-color: white;
  margin-bottom: 20px;
  position: relative;
}

.cardActivationBanner {
  position: relative;
}

.transactionDetails .cardLockedBanner button {
  margin-bottom: 10px;
  margin-left: 0px;
}
.contact-us-help-text {
  max-width: 480px;
}
.transactionDetails .cardLockedBanner .lock-banner-status-text a,
.transactionDetails .cardLocked-banner-omv .lock-banner-status-text-omv a {
  white-space: nowrap;
}
@media only screen and (max-width: 320px) {
  #layoutContentBody .lockOrUnlock-lock-text {
    max-width: 290px;
  }
  #layoutContentBody .lockOrUnlock-ul {
    margin-left: -16px;
  }
  .lock-banner-status-text {
    width: 90%;
  }
}
@media only screen and (max-width: 640px) {
  .lock-banner-status-text {
    width: 85%;
  }
}
/* lockUnlock feature styles ends */

/* lostStolen specific styles starts */
.cardDeliveryOptions #shieldLibraryComponent .form-control__radio .label__container {
  margin-top: 8px;
}

@media only screen and (min-width: 320px) and (max-width: 640px) {
  .confirmReviewSubmitRequest #shieldLibraryComponent a.basic.returnLostStolen {
    display: block;
    text-align: center;
  }
}
/* lostStolen specific styles ends */
@media only screen and (min-width: 320px) and (max-width: 640px) {
  .sendOneTimePasscode #shieldLibraryComponent .usb-button.button--default,
  .oneTimePasscode #shieldLibraryComponent .usb-button.button--default,
  .reportCardLostStolen #shieldLibraryComponent .usb-button.button--default,
  .lostStolenAdditionalDetails #shieldLibraryComponent .usb-button.button--default,
  .reviewRecentTransactions #shieldLibraryComponent .usb-button.button--default,
  .cardDeliveryOptions #shieldLibraryComponent .usb-button.button--default,
  .reviewSubmitRequest #shieldLibraryComponent .usb-button.button--default,
  .confirmReviewSubmitRequest #shieldLibraryComponent .usb-button.button--default,
  .cardReplacement #shieldLibraryComponent .usb-button.button--default,
  .cardReplacementSelectUsers #shieldLibraryComponent .usb-button.button--default,
  .cardReplacementDeliveryOptions #shieldLibraryComponent .usb-button.button--default,
  .cardReplacementReviewSubmit #shieldLibraryComponent .usb-button.button--default,
  .contactDetailsPrompt #shieldLibraryComponent .usb-button.button--default {
    margin-bottom: 0px;
  }
}

.cardDeliveryOptions #shieldLibraryComponent .form-control__radio .label__text {
  font-weight: bold;
}

.cardReplacementDeliveryOptions #shieldLibraryComponent .form-control__radio .label__text,
.editCardDeliveryOptions #shieldLibraryComponent .form-control__radio .label__text {
  font-weight: bold;
}

.cardReplacementDeliveryOptions #shieldLibraryComponent .label__address,
.cardDeliveryOptions #shieldLibraryComponent .label__address,
.editCardDeliveryOptions #shieldLibraryComponent .label__address {
  font-size: 0.75em;
  font-weight: 400;
}

.textOptInPage .confirmationBlock_omv #addressText_1,
.textOptInPage .confirmationBlock_omv #addressText_2,
.textOptInPage .confirmationBlock_omv #addressText_3 {
  line-height: 38px;
}

.cardHub.updated-content-wrapper #layoutContentBody,
.cardHub.updated-content-wrapper #layoutContentErrorMessages,
.cardHub .updated-content-wrapper #layoutContentBody,
.cardHub .updated-content-wrapper #layoutContentErrorMessages {
  max-width: unset;
}

.cardHub a {
  text-decoration: none !important;
  border-bottom: 1px solid #cdcdd3;
  padding: 15px;
}

.cardHub .serviceContentTitle {
  border-bottom: none;
  width: 340px;
}
.cardHub ul#firstList,
.cardHub ul#secondList,
.cardHub ul#thirdList,
.cardHub ul#fourthList {
  border-top: 1px solid #cdcdd3;
}

.cardHub ons-icon.ons-icon.fa-angle-right.fa {
  float: right;
  color: #666666;
  font-size: var(--fs16);
  font-weight: bold;
}

.cardHub .bottomSection {
  padding-top: 55px;
}
/* Services page shield changes */
.cardHub #shieldLibraryComponent a {
  padding: 15px;
  display: block;
}
li.iconImgDisplay a {
  display: flex !important;
  align-items: center;
}
.cardHub #shieldLibraryComponent a.basic {
  font-weight: 600;
}
.cardHub a:focus,
.cardHub a:hover {
  border: 1px solid #4b4b4b !important;
  margin: -1px -1px 0px -1px !important;
  outline: none;
}
/* End of shield changes */
.cardHub h1#subHeader,
.cardHub.updated-content-wrapper #layoutContentBody,
.cardHub.updated-content-wrapper #layoutContentErrorMessages,
.cardHub .updated-content-wrapper #layoutContentBody,
.cardHub .updated-content-wrapper #layoutContentErrorMessages {
  margin: 30px 0px 20px 90px;
}

.cardHub h1#subHeader {
  font-weight: bold;
  font-size: 28px;
}

.cardHub h2.contentAreaSubHeader {
  font-weight: bold;
  font-size: var(--fs20);
  height: 54px;
  width: 340px;
}

p.cardHubContent {
  width: 400px;
  font-size: var(--fs14);
  padding-bottom: 45px;
}

.cardHub .tieringElement.verticalListOfLinks {
  width: 340px;
  margin-right: 120px;
  font-size: var(--fs16);
  font-weight: bold;
  padding-top: 0px;
  padding-inline-start: 0px;
  margin-block-end: 0px;
  margin-block-start: 0px;
  margin-top: 0px;
  padding: 0px;
}

.cardHub li {
  display: block;
}

.cardHub .tieringElement.verticalListOfLinks a {
  margin-bottom: 0px;
  margin-top: 0px;
}

.cardHub .tieringElement.verticalListOfLinks a:active {
  background-color: #f2f2f2;
  border: none;
  border-bottom: 1px solid #cdcdd3;
}

@media screen and (min-width: 321px) and (max-width: 1024px) {
  .svc-modal--button {
    width: unset !important;
  }
  .cardHub h1#subHeader,
  .cardHub.updated-content-wrapper #layoutContentBody,
  .cardHub.updated-content-wrapper #layoutContentErrorMessages,
  .cardHub .updated-content-wrapper #layoutContentBody,
  .cardHub .updated-content-wrapper #layoutContentErrorMessages {
    margin: 30px 20px 20px 20px;
  }
  .cardHub .serviceContentTitle,
  .cardHub .serviceContentBoxLeft,
  .cardHub .serviceContentBoxRight,
  p.cardHubContent,
  .cardHub .tieringElement.verticalListOfLinks {
    width: 100%;
  }
  .cardHub div#layoutContentArea {
    padding: 10px 0% 20px 0%;
  }
  .cardHub .rightSection {
    padding-top: 55px;
  }
}

@media only screen and (max-width: 320px) {
  .svc-btn--hollow {
    width: 100%;
  }
  .svc-btn--full {
    width: 100%;
    margin-bottom: 20px !important;
  }
  .svc-modal--button {
    margin-bottom: 20px !important;
  }
  .cardHub h1#subHeader,
  .cardHub.updated-content-wrapper #layoutContentBody,
  .cardHub.updated-content-wrapper #layoutContentErrorMessages,
  .cardHub .updated-content-wrapper #layoutContentBody,
  .cardHub .updated-content-wrapper #layoutContentErrorMessages {
    margin: 30px 15px 30px 15px;
  }
  .cardHub .serviceContentTitle,
  p.cardHubContent,
  .cardHub .serviceContentBoxLeft,
  .cardHub .serviceContentBoxRight,
  .cardHub .tieringElement.verticalListOfLinks {
    width: 100%;
  }
  .cardHub div#layoutContentArea {
    padding: 10px 1.5% 20px 1.5%;
  }
  .cardHub .rightSection {
    padding-top: 55px;
  }
  .secondaryLink {
    width: 100%;
    padding: 25%;
  }

  .clmSecondaryLink {
    width: 100%;
    padding: 5% 25% 5% 35%;
  }
  .manageAeCancelLink {
    width: 100%;
    padding: 5% 25% 5% 45%;
  }
  .cliSecondaryLink {
    width: 100%;
  }
  .wrapUpLink {
    padding: 10px;
    margin-bottom: 10px;
  }
  .manageEmp-return-link {
    padding: 10px;
    margin-bottom: 10px;
    margin-top: 20px;
  }
  .updateSpendingReturnLink {
    text-align: center;
    margin-bottom: 10px;
    margin-top: 0px !important;
  }

  input#secondaryEmail,
  input#primaryEmail {
    width: 100%;
  }
}

#layoutPageContent.ie-user .cardHub .servicesContent {
  width: 810px;
}

.ons-icon {
  display: inline-block;
  line-height: inherit;
  font-style: normal;
  font-weight: 400;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

.fa {
  font-family: "FontAwesome";
}

.cardHub #layoutContentArea {
  overflow: hidden;
}

@media only screen and (max-width: 640px) {
  input[type="email"] {
    max-width: 100%;
  }
}

.contactInfoTopMargin {
  margin-top: 8px;
}

.contactInfoBottomMargin {
  margin-bottom: 8px;
  /* margin-bottom: 1em; */
}

.addPhoneNumber .button-container button,
.addPhoneNumber a.new_omvButton,
.editPhoneNumber .button-container button,
.editPhoneNumber a.new_omvButton,
.addCompanyPhoneNumber .button-container button,
.addCompanyPhoneNumber a.new_omvButton,
.editCompanyPhoneNumber .button-container button,
.editCompanyPhoneNumber a.new_omvButton,
.addEmailAddress .button-container button,
.addEmailAddress a.new_omvButton,
.editEmailAddress .button-container button,
.editEmailAddress a.new_omvButton,
.updateMailingAddress .button-container button,
.updateMailingAddress a.new_omvButton,
.finalistCheck .button-container button,
.updatePhysicalAddress .button-container button,
.updatePhysicalAddress .button-container button,
.updatePhysicalAddress a.new_omvButton,
#rtpRemove .button-container button,
#rtpRemove a.new_omvButton,
#rteRemove .button-container button,
#rteRemove a.new_omvButton {
  text-transform: none;
}

.addPhoneNumber input.desktopPhoneInput,
.editPhoneNumber input.desktopPhoneInput,
.addCompanyPhoneNumber input.desktopPhoneInput,
.editCompanyPhoneNumber input.desktopPhoneInput {
  width: 100px;
  padding: 5px;
}

@media only screen and (max-width: 1024px) {
  .addPhoneNumber input.desktopPhoneInput,
  .editPhoneNumber input.desktopPhoneInput,
  .addCompanyPhoneNumber input.desktopPhoneInput,
  .editCompanyPhoneNumber input.desktopPhoneInput {
    padding: 0 5px;
  }
}

@media (max-width: 325px) {
  .addPhoneNumber a.new_omvButton,
  .editPhoneNumber a.new_omvButton,
  .addCompanyPhoneNumber a.new_omvButton,
  .editCompanyPhoneNumber a.new_omvButton,
  .updateMailingAddress a.new_omvButton,
  .updatePhysicalAddress a.new_omvButton {
    padding: 10px;
  }
}

.rtp-phone-number-links a:nth-child(1),
.rte-email-address-links a:nth-child(1) {
  margin-right: 5px;
}

.rtp-phone-number-links a:nth-child(2),
.rte-email-address-links a:nth-child(2) {
  margin-left: 5px;
}

.rtp-radio {
  align-items: center;
  display: flex;
}

.rtp-radio span {
  font-weight: normal;
}

.rtp-radio input[type="radio"] {
  margin-top: 0;
}
#enrollWaitAnimation {
  display: block;
  margin-top: 5.5em;
  text-align: center;
}
#sPayLoader {
  display: block;
  margin-top: 18.5em;
  text-align: center;
}
#enrollPopupMask {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 1;
  background-color: rgba(220, 220, 220, 0.8) !important;
  z-index: 9000;
}

.redirectToCMC #layoutContentBody,
.redirectToCMC #layoutContentErrorMessages {
  max-width: 500px;
}
.redirectToCMC #leavingModal p {
  margin: 0;
}
.redirectToCMC .listLinks a {
  display: block;
}
.redirectToCMC .omv .listLinks {
  text-align: center;
}
.redirectToCMC .listLinks a + a {
  padding-top: 20px;
}

@media only screen and (max-width: 640px) {
  #enrollWaitAnimation {
    display: block;
    margin-top: 12em;
    text-align: center;
  }
}

@media only screen and (max-width: 450px) {
  #enrollWaitAnimation {
    display: block;
    margin-top: 21em !important;
    text-align: center;
  }
}

@media only screen and (max-width: 640px) {
  .haveQuestionLink img.cursor_help {
    margin-right: 10px;
  }
}

@media only screen and (max-width: 375px) {
  .enrollIdShieldTileStep2 div.table {
    width: 100%;
  }
  .enrollIdShieldTileStep2 div.table > div {
    display: flex;
    justify-content: space-evenly;
  }
  .enrollIdShieldTileStep2 #columnLeft,
  .enrollIdShieldTileStep2 #columnRight,
  .enrollIdShieldTileStep2 #columnCenter {
    box-sizing: border-box;
    float: none;
    width: 100%;
  }
  .enrollIdShieldTileStep2 .tableCell {
    box-sizing: border-box;
    padding: 5px;
    text-align: center;
    margin: 0px;
  }

  .enrollIdShieldTileStep2 .image {
    max-width: 100%;
    margin: 0px;
  }

  .enrollIdShieldTileStep2 .radioCell {
    padding-left: 0px;
  }
}

/* Shield changes to LostStolen/cardReplacement card delivery pages */
#shieldLibraryComponent .standardDeliveryFeeShield,
#shieldLibraryComponent .expeditedDeliveryFeeShield {
  color: #555;
  display: inline-block;
  position: absolute;
  margin-top: -2.1rem;
  margin-left: 12.5rem;
  font-size: var(--body-font-size);
}

#shieldLibraryComponent .expeditedDeliveryFeeShield {
  margin-top: -3.4rem;
}

@supports (-ms-ime-align: auto) {
  #shieldLibraryComponent .standardDeliveryFeeShield,
  #shieldLibraryComponent .expeditedDeliveryFeeShield {
    margin-top: -2.6rem !important;
  }
  .reviewRecentTransactions #shieldLibraryComponent .form-control__radio .label__text,
  .cardReplacement #shieldLibraryComponent .form-control__radio .label__text {
    line-height: 1.7 !important;
  }
  .cardDeliveryOptions #shieldLibraryComponent .form-control__radio .label__text,
  .cardReplacementDeliveryOptions #shieldLibraryComponent .form-control__radio .label__text {
    line-height: 1 !important;
  }
  .cardDeliveryOptions #shieldLibraryComponent .form-control__radio.disabled,
  .cardDeliveryOptions #shieldLibraryComponent .form-control__radio .label__sm,
  .cardReplacementDeliveryOptions #shieldLibraryComponent .form-control__radio.disabled,
  .cardReplacementDeliveryOptions #shieldLibraryComponent .form-control__radio .label__sm {
    line-height: 0 !important;
  }
}
/* Ends here */
.cardReplacement #shieldLibraryComponent .cardReplace-margin {
  margin-left: 1em;
}
/* Ends here */

/*********** ApplePay feature styles starts here ***********/
.applePay-body-omv {
  margin: 10px 20px 20px 20px;
}
.applePay-agree-text {
  font-size: var(--fs20);
}

.apple-pay-logo {
  padding-top: 32px;
  padding-bottom: 13px;
  width: 111px;
  height: 63px;
}

.apple-pay-icon {
  padding-top: 32px;
  width: 30px;
  height: 19px;
}
.apple-pay-bold-text {
  font-weight: 600;
}

.apple-icon_small {
  padding-right: 12px;
  width: 30px;
  height: 19px;
}

.featurePay-body-omv {
  margin: 10px 20px 20px 20px;
}

.featurePay-txt {
  padding-left: 16px;
  display: block;
  font-size: var(--fs16);
  font-weight: 600;
}

.featurePay-sub-txt {
  display: block;
  padding-left: 16px;
  font-size: var(--body-font-size);
  padding-top: 5px;
  color: #4d4f53;
  font-weight: bold;
}

.PayPal-txt {
  font-size: var(--fs16);
  font-weight: 600;
  padding-left: 35px;
}

.PayPal-sub-txt {
  font-size: var(--body-font-size);
  margin-left: -53px;
  padding-top: 40px;
}

.applePay-txt {
  padding-left: 55px;
  display: block;
  font-size: var(--fs16);
  font-weight: 600;
  margin-top: -33px;
}

.applePay-sub-txt {
  display: block;
  padding-left: 55px;
  font-size: var(--body-font-size);
  padding-top: 5px;
  color: #4d4f53;
  font-weight: bold;
}

.successBanner {
  background-color: green;
  border-left: rgba(0, 255, 0, 0.5) solid 10px;
  color: black;
  padding: 6px;
}

.success_Banner {
  margin-bottom: 15px;
}
.success_Banner .usb-notification > .confirmation {
  border: 1px solid #d3e9dc;
  border-top: 5px solid #0a853d;
  background-color: #f5faf7;
  box-shadow: 0 1px 3px #c2e1ce;

  display: flex;
  align-content: center;
  vertical-align: middle;
  /*width: 100%; */
  padding: 0.75rem 3rem 1rem 1rem;
  border-radius: 0.5rem;
  position: relative;
  outline-offset: -1px;
  color: #2c2c2c;
  font-family: var(--usb-circular, var(--usb-fallback));
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
}

.success_Banner .usb-notification .icon {
  display: inline-block;
  align-self: center;
  position: relative;
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 0.75rem;
}

.success_Banner .svg-icon.success {
  color: #0a853d;
  fill: #0a853d;
}

.success_Banner .svg-icon {
  max-width: 100%;
  display: inline;
}

.featurePay-agree-text {
  font-size: var(--fs18);
  font-weight: bold;
}

.feature-pay-logo {
  padding-top: 32px;
  padding-bottom: 13px;
}

.imgSamsung .feature-pay-logo {
  width: 130px;
  height: 63px;
}

.imgGoogle .feature-pay-logo {
  width: 155px;
  height: 63px;
}
.googlePay-vendor-logo {
  height: 24px;
}

.samsungPay-vendor-logo {
  height: 20px;
}

.googlePay-vendor-button {
  background-color: white;
  border-radius: 6px;
  border: 2px solid #dadce0;
  height: 45px;
  padding-top: 8px;
}
.samsungPay-vendor-button {
  background-color: black;
  border-radius: 6px;
  border: 2px solid black;
  height: 45px;
  padding-top: 11px;
}

.featurePay-body-omv .feature_omv_cancel {
  text-transform: capitalize;
  font-size: 0.875rem;
  font-weight: bold;
  float: none;
}
.feature-pay-bold-text {
  font-weight: 600;
  padding-top: 35px;
}

.feature-pay-bold-text-device-info {
  font-weight: 600;
}

.feature-pay-padding {
  padding: 20px 0px 25px 0px;
}

.samsungPay-body-omv {
  margin: 10px 20px 20px 20px;
}

.samsungPay-agree-text {
  font-size: var(--fs18);
  font-weight: bold;
}

.samsung-pay-logo {
  padding-top: 32px;
  padding-bottom: 13px;
  width: 111px;
  height: 63px;
}

.samsungPay-body-omv .samsung_omv_cancel {
  text-transform: capitalize;
  font-size: 0.875rem;
  font-weight: bold;
  float: none;
}
.samsung-pay-bold-text {
  font-weight: 600;
  padding-top: 35px;
}

.samsung-pay-padding {
  padding: 20px 0px 25px 0px;
}

div.applePay-input-area input[type="number"] {
  width: 100%;
  border: none;
  border-bottom: 1px solid #ccc;
  border-radius: 0;
  outline: none;
}

div.feature-pay-input-area input[type="number"] {
  width: 96%;
  border: none;
  border-bottom: 1px solid #ccc;
  border-radius: 0;
  outline: none;
  padding: 10px 5px 2px 5px;
  height: 20px !important;
}

.managePaymentBanner {
  display: flex;
  align-items: center;
}

.tc_page_speedbump .buttonnav a#extSiteLink {
  text-decoration: none;
}

.trancoreDeleteEmailAddress {
  float: right;
  text-decoration: underline;
  margin-top: 5px;
}

img.icn-info {
  padding-right: 15px;
  height: 20px;
  vertical-align: bottom;
}

.info_bannerText {
  padding: 3px;
}

.omv_infoBannerText {
  padding: 2px;
}

.displayInfoImagePadding > section > header.padding10 {
  padding-left: 0px;
  padding-bottom: 0px;
}
#disclosureBodyContent h2 {
  padding-top: 15px;
  padding-bottom: 15px;
}
#settlementContent {
  border-radius: 5px;
  background-color: #e4e5e4;
}
#enrollmentConfirmationMessage span {
  vertical-align: super;
  margin-left: 7px;
}
.errortext1 {
  animation-duration: 0.1s;
  color: #ee0000;
  animation-name: blinkin;
}

@keyframes blinkin {
  from {
    margin-left: 0.5%;
    width: 300%;
  }
}

#confrimationAgreement h2 {
  padding-top: 15px;
  padding-bottom: 10px;
}

#confrimationAgreement p {
  padding-bottom: 10px;
}

#beforeEnrollBodyContent li,
#enrollmentConfirmationBodyContent li {
  margin-block-start: 1em;
  margin-block-end: 1em;
}

#beforeEnrollBodyContent ul {
  padding-bottom: 1px;
}
/*Add ".field-reset-Trancore" class to your fiedlset in order to remove the borders*/
fieldset.field-reset-Trancore {
  padding-left: unset;
  border: none;
}
/*Targetting fieldset for IE*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  fieldset.field-reset-Trancore {
    padding-left: 0;
  }
}
.contactDetailsPrompt legend {
  font-weight: bold;
  padding-top: 13px;
}
@media only screen and (min-width: 320px) and (max-width: 639px) {
  .contactDetailsPrompt .Link {
    margin: 13px !important;
    text-align: center;
    width: -webkit-fill-available;
  }
  .contactDetailsPrompt#shieldLibraryComponent a.basic {
    margin-top: 20px;
    display: block;
    text-align: center;
  }
}
.contactDetailsPrompt#shieldLibraryComponent .usb-notification > .error p span,
.contactDetailsPrompt#shieldLibraryComponent .usb-notification > .error h3,
.contactDetailsPrompt#shieldLibraryComponent .usb-notification > .error ul li span,
.contactDetailsPrompt .usb-notification > .error .single-notification--text,
.contactDetailsPrompt#shieldLibraryComponent .usb-notification > .error h2,
.contactDetailsPrompt #shieldLibraryComponent .usb-notification > .error span {
  font-size: var(--body-font-size);
}
.contactDetailsPrompt#shieldLibraryComponent .usb-notification > .error ul {
  padding: 0px 0px 0px 16px;
  margin: 0;
}
.contactDetailsPrompt#shieldLibraryComponent .usb--error-message span {
  line-height: 1.25em;
}
.contactDetailsPrompt #shieldLibraryComponent .pageLevelErrorLink {
  text-decoration: none !important;
  font-size: var(--body-font-size);
  display: inline;
}
.contactDetailsPrompt #shieldLibraryComponent .linkSpan {
  text-decoration: underline;
}
#transactionDetailTable_summary,
#transactionDetailTable_summary_Responsive,
#transactionDetailSummaryPrintFriendly {
  border-collapse: collapse;
  border-spacing: 0;
  line-height: 1.5em;
}

#transactionDetailTable_summary tr,
#transactionDetailTable_summary_Responsive tr,
#transactionDetailSummaryPrintFriendly tr {
  border-top: 1px solid;
}

#transactionDetailTable_summary td,
#transactionDetailTable_summary_Responsive td {
  padding: 10px;
  height: 80px;
}
@media only screen and (max-width: 640px) {
  #transactionDetailTable_summary td,
  #transactionDetailTable_summary_Responsive td {
    padding: 10px;
    height: 0px;
  }
}

#transactionDetailTable_summary,
#transactionDetailTable_summary_Responsive > tbody > tr:last-child {
  border-bottom: none;
}

/* New EnrollmentPage --> overriding shield styles */
.enrollmentPage .password1_hlp {
  width: 300px;
}

.enrollmentPage .helper-Text {
  margin-top: 5px;
}

.enrollmentPage .helpTextImg {
  margin-left: 25px;
  margin-top: 20px;
}
.enrollmentPage .EnrollPageToolTip {
  vertical-align: middle;
  padding: 0px 8px 0px 8px;
}
.enrollmentPage .form-control__input input {
  width: 300px;
}

.enrollmentPage .form-control__input.label-top label {
  position: unset;
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  color: #4d4f53;
  margin-bottom: 0.5rem;
  transform: none;
}
.enrollmentPage .form-control__input.show-hide input {
  padding-right: 0rem;
}
/* remove below style after converting the label to shield for "3-digit security code */

.enrollmentPage .label-padding {
  padding-top: 5px;
  margin: auto;
}
.enrollmentPage .omv-label-padding {
  padding-top: 0px;
  margin: auto;
}

.enrollmentPage .form-control__input.show-hide button {
  display: none;
}

.enrollmentPage .enrollRadioGroup {
  margin-top: 10px;
}
.enrollmentPage .enrollmentRadioErrorLabel span.radioErrorText {
  vertical-align: super;
  margin-left: 4px;
  color: #be1324;
  font-weight: 400;
}
.enrollmentPage .WarningIconEnrollment {
  color: #be1324;
  fill: #be1324;
}
@media only screen and (min-width: 320px) and (max-width: 640px) {
  .enrollmentPage .form-control__input input {
    width: 97%;
  }
  .enrollementButtonComponent {
    text-align: center;
  }
  .publicCardActivation .usb--basic-input {
    width: 97%;
  }
}

@media only screen and (max-width: 320px) {
  .enrollmentPage .usb-button,
  #cardActActivationBtn {
    width: 100%;
  }

  .enrollmentPage .usb-link {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 14%;
  }
  .enrollmentPage .form-control__input input {
    width: 94%;
  }

  .publicCardActivation .usb--wrapper .usb--basic-input {
    width: 95%;
  }

  .enrollmentPage .form-control__input .helper-text__container .helper-text__text {
    max-width: 250px;
  }
}

.enrollmentPage .form-control__input .helper-text__container .helper-text__text,
.enrollmentPage .EnrollmentEmailFieldHelpText {
  max-width: 300px;
}

.enrollmentPage #radioLabel {
  font-weight: bold;
}

.enrollmentPage #signaturePanelCode_lbl,
.enrollmentPage #fourDigitPin,
.enrollmentPage #cardNumber_lbl {
  font-weight: bold;
}
/*
.enrollmentPage .form-control__radio {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  cursor: pointer;
  margin-left: 0.25rem;
  color: #555;
  font-family: HelveticaNeue-USB,Helvetica Neue,Helvetica,Arial,sans-serif;
  font-weight: 400;
  font-size: 0.8rem;
  line-height: 1;
}

*/

/*Overriding shield styles for Login Assistance*/
#shieldLibraryComponent a.basic.loginBasicLink {
  padding-top: 12px;
}
.loginAssistance #layoutContentErrorMessages,
.loginAssistanceFAQ #layoutContentErrorMessages {
  display: none;
}
.single-panel__header-title {
  padding: 0px 8px 12px 32px;
}
/*Single group FAQ questions CSS on focus*/
.single-panel__header-title:focus {
  padding-top: 12px;
  box-shadow: inset 0 0 0 2px #109cde;
  outline: none;
}

/*All feature related classes can be added here for H1,H2,H3 style as per guide lines*/

.loginAssistanceFAQ h3 {
  font-size: var(--body-font-size);
  line-height: 1.25em;
}
.loginAssistance h2,
.loginAssistanceFAQ h2 {
  font-size: var(--fs14);
  line-height: 1.25em;
  padding: 16px 18px 16px 0px;
}
.loginAssistance #layoutContentPageSubHeader h1,
.loginFaq #layoutContentPageSubHeader h1,
.enroll #layoutContentPageSubHeader h1 {
  font-size: 24px;
  line-height: 1.25em;
  padding: 0px 18px 24px 0px;
  margin: 0;
  font-weight: 700;
}

/*
 .form-control__input.error .helper-text__container{
display: block;
}
*/

.enrollmentPage .form-control__input.errortext label,
#shieldLibraryComponent .form-control__input.errortext label.is-focused,
#shieldLibraryComponent .form-control__input.label-top.errortext label {
  color: #ee0000;
}
#layoutContentErrorMessages .usb-notification {
  background-color: #ffffff;
}
/*Overriding CSS styles for Shield Accordion*/
#shieldLibraryComponent .accordion-panel h3 {
  margin: 0;
}
/*-Publi pages Card Activation styles */
.publicCardActivation #input_cardArtCardNumber,
#input_cardArtSSN,
#input_cardArtThreeDigitCode {
  width: 285px;
}

.publicCardActivation #input_cardArtCardNumber + button.show-hide__button,
#input_cardArtSSN + button.show-hide__button,
#input_cardArtThreeDigitCode + button.show-hide__button {
  left: 255px;
}

.publicCardActivation .usb--error-message {
  width: 275px;
}
.publicCardActivation .usb-button.button--default {
  margin: 30px 12px 20px 0px;
}

.publicCardActivation .usb--wrapper button.show-hide__button {
  top: 2rem;
  margin-right: 10px;
  cursor: pointer;
}

@media only screen and (min-width: 641px) {
  .publicCardActivation .usb--wrapper {
    width: 300px;
    padding-top: 0;
  }
}
.publicCardActivation .usb--wrapper {
  padding-top: 0;
}

.publicCardActivation > .publicCardField {
  position: relative;
  margin: 0 0 4px;
}

.publicCardActivation > .publicCardField .tooltip.unAuthPageToolTip {
  left: 76px;
  top: -4px;
  position: absolute;
  z-index: 9;
}

.publicCardActReturnLink {
  margin-top: 20px;
}

.tc_Header .headerLink {
  float: right;
  margin: 20px 12px 20px 0;
}

.tc_Header .headerLink span {
  text-decoration: none;
}

.publicContentHeader {
  font-size: 15px;
  padding: 16px 0px 8px 0px;
}

.publicCardActivationSuccess {
  max-width: 500px;
}

.publicCardActAppleStoreImg,
.publicCardActGoogleStoreImg {
  cursor: pointer;
  width: 129px;
  height: 37px;
  margin-right: 20px;
}

.publicCardActivationSuccess #cardActSuccessHeader {
  outline: none;
  margin-bottom: 15px;
}

@media only screen and (max-width: 320px) {
  .publicCardActAppleStoreImg,
  .publicCardActGoogleStoreImg {
    width: 40%;
    height: 40px;
  }
  .publicCardActAppleStoreImg {
    margin: 0px 10px 10px 20px;
  }
  .publicCardActGoogleStoreImg {
    margin: 0px 10px 10px 10px;
  }
  .publicCardActivationSuccess .usb-button,
  #cardActivationSuccessBtn {
    width: 100%;
  }
}

#shieldLibraryComponent .usb-button.button--default.publicCarActSuccessLogInButton {
  margin: 35px 12px 20px 0px;
}
/* END -Publi pages Card Activation styles */

/* ******RewardsAndBenefits Feature Styles****** */
.benefitsImg {
  width: 13px;
  display: inline;
}
.rewardsSummaryDiv,
.omvRewardsSummaryDiv {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.omvRewardsSummaryDiv {
  flex-direction: column;
}
div#rewardsSummaryText {
  display: inline-block;
  width: 59%;
  vertical-align: top;
}
.rewardsSummaryMessage {
  padding-right: 3rem;
}
div#rewardsSummaryImg img {
  width: 245px;
  height: 155px;
}
div#omvRewardsSummaryText h1 {
  width: 100%;
  font-size: 1rem;
  font-weight: bold;
}
div#omvRewardsSummaryText h4 {
  font-size: 0.875rem;
}
div#omvRewardsSummaryImg {
  align-self: center;
  margin-top: 1rem;
  margin-left: 20px;
  margin-right: 20px;
}
div#omvRewardsSummaryImg img {
  width: 100%;
}
.rewardsPointsDiv,
.benefitsDiv {
  border-bottom: 1px solid #cdcdd3;
  padding-bottom: 12px;
}
.omvRewardsPointsDiv .omvBenefitsDiv h3 {
  font-size: 0.875rem;
  font-weight: bold;
}
.rewardsPoints,
.benefitsSection {
  width: 30%;
  display: inline-block;
  vertical-align: top;
  margin-right: 2.25em;
}
.rewardsPoints .rewardsPointsHeader h3,
.omvRewardsPoints .rewardsPointsHeader h3 {
  text-transform: uppercase;
}
.omvRewardsPoints,
.omvBenefits {
  width: 100%;
  display: block;
  margin: 10px 0 10px 0;
}

.omvBenefits {
  margin-bottom: 20px;
}
.omvBenefitsHeader {
  margin-bottom: 1rem;
}
.omvRewardsPoints h4,
.omvBenefits h4 {
  font-size: 0.75rem;
  padding-bottom: 12px;
  font-weight: bold;
}
.rewardsPointsContent {
  display: flex;
  align-items: baseline;
  margin-top: 12px;
  font-weight: bold;
}
.benefitsContent {
  display: table-row;
  align-items: baseline;
  margin-top: 12px;
}
.rewardsPointsContent span {
  flex: 1;
  border-bottom: 2px dotted #4d4f53;
}
.rewardsPointsLabel {
  display: inline-block;
  font-weight: bold;
}
.benefitsLabel {
  display: table-cell;
  padding-bottom: 0.875rem;
  padding-left: 0.675rem;
}
.benefitsLabel li {
  display: inline;
  list-style: none;
}
.rewardsPointsValue {
  display: inline-block;
  font-weight: bold;
}
.rewardsPointsHelpText {
  font-style: italic;
  margin-top: 10px;
  margin-bottom: 20px;
  font-size: var(--body-font-size);
}
.omvRewardsPointsDiv,
.omvBenefitsDiv {
  border-bottom: 1px solid #cdcdd3;
  padding-bottom: 8px;
}
.omvRewardsPointsDiv h2 {
  font-size: 23px;
  font-weight: 700;
}
.omvBenefitsDiv h2 {
  font-size: 23px;
  font-weight: 700;
}
.omvBenefitsSubText {
  margin-top: 8px;
  margin-bottom: 1rem;
}
.omvRewardsPoints h3 {
  font-size: 15px;
  font-weight: 700;
}
.omvBenefits h3 {
  font-size: 15px;
  font-weight: 700;
}

.rewardsAndBenefits #shieldLibraryComponent a.basic {
  font-size: 1.35em;
  text-decoration: none;
  font-weight: bold;
}
.rewardsAndBenefits #shieldLibraryComponent a.basic:hover {
  text-decoration: none;
}
.rewardsAndBenefits a:focus,
.rewardsAndBenefits a:hover {
  outline: none;
}
.rewardsAndBenefits ons-icon.ons-icon.fa-angle-right.fa {
  padding: 0 0 0 10px;
}
#rewardsAndBenefitsIcon,
.rewardsAndBenefitsIcon {
  color: #555555 !important;
}
.rewardsAndBenefits .marginButtonNav {
  padding-top: 20px;
  margin-bottom: 0px !important;
}
#externalRewardsOMVLink {
  margin-bottom: 15px;
}
#externalRewardsSSOLink,
.linkoutRewardsOMV {
  font-size: 1.2em !important;
}
.benefitsLink {
  font-size: 1.35em;
  font-weight: bold;
  padding: 20px 0 10px 0;
  display: inline-block;
}
.benefitsLink a,
.benefitsLinkOMV a {
  text-decoration: none !important;
}
.benefitsLinkOMV {
  font-size: 1.2em;
  font-weight: bold;
  display: inline-block;
  padding: 10px 0 20px 0;
  padding-left: 1.25rem;
}
.benefitsFootnote {
  font-size: 0.9em !important;
  display: flex;
}
.benefitsFootnoteOMV {
  margin-bottom: 10px;
  padding-left: 1.25rem;
  padding-right: 1.25rem;
  display: flex;
}
.footNoteLabel,
.footNoteIndex {
  display: inline-flex;
}
.footNoteLabel p {
  line-height: initial !important;
  margin-top: 0;
}
.footNoteDiv {
  padding-top: 0.75rem;
}

@media only screen and (max-width: 640px) {
  div#rewardsSummaryText {
    width: 100%;
  }
  div#rewardsSummaryImg img {
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .rewardsPoints,
  .benefitsSection {
    width: 100%;
    display: block;
    margin: 0 0 10px 0;
  }
  .rewardsSummaryDiv {
    display: flex;
    flex-direction: column;
  }
  .rewardsSummaryDiv h1 {
    font-size: 1rem;
    font-weight: 600;
  }
  .rewardsSummaryDiv,
  .omvRewardsPointsDiv,
  .omvBenefitsDiv p {
    font-weight: 300;
    color: #333333;
    line-height: 1.3rem;
  }
}
/* RewardsAndBenefits feature styles ends */

/* *****IE browser notification styles*****  */
.notify_ie {
  display: none;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.notify_ie .layoutPageContent2 {
  padding-right: 64px;
  margin: 0 auto;
}
/* IE browser notification styles ends */

.publicCardActLoader {
  position: absolute;
  background-color: rgba(220, 220, 220, 0.8) !important;
  opacity: 0.5;
  z-index: 999999;
  width: 100%;
  height: 96%;
}

.publicCardActLoader .USBLoaderContainer {
  margin: 5rem auto;
}

@media only screen and (max-width: 640px) {
  .publicCardActLoader {
    height: 150%;
  }
}
/*Interstitial (eStatement, CLI Reinforcement, AddAuPrompt) styles starts*/
.interstitial .buttonnav.omvActions {
  margin: 25px 0;
}
.interstitial .buttonnav.omvActions,
.au_userPrompt .marginButtonNav {
  padding-top: 0;
  text-align: center;
}

.au_userPrompt p {
  max-width: 485px;
}

#payPalRemindMeLater {
  padding-bottom: 25px;
}

@media only screen and (max-width: 640px) {
  .au_userPrompt .buttonnav,
  .interstitial .buttonnav {
    text-align: center;
    /* padding: 0 0 20px; */
  }
  .au_userPrompt .buttonnav button {
    width: 100%;
  }
}

.cliReinforcementPrompt p {
  max-width: 500px;
}

.cliReinforcementPrompt .buttonnav.omvActions {
  padding: 0 1.25rem;
}

/*Interstitial styles ends*/

.paypal-button {
  display: flex;
  align-items: baseline;
}

#shieldLibraryComponent .paypal-button > button.button--secondary {
  display: flex;
  align-items: center;
  border-color: #4d4f53;
  border: solid 1px #4d4f53;
  background: #ffffff;
  color: #4d4f53;
}

#shieldLibraryComponent.incomePrompt-omv.omv_content .paypal-button {
  flex-direction: column;
  align-items: center;
}

#shieldLibraryComponent.incomePrompt-omv.omv_content .paypal-button > button.button--secondary {
  justify-content: center;
}

#shieldLibraryComponent .paypal-button > button.button--secondary:hover {
  background-color: #fff;
  border-color: #4d4f53;
  border: solid 1px #4d4f53;
  background: #ffffff;
  color: #4d4f53;
}

#shieldLibraryComponent .paypal-button > button.button--secondary:active {
  color: #4d4f53 !important;
}

.paypal-button .paypal-icon {
  position: relative;
  margin-left: 10px;
  max-width: 95px;
}

@media only screen and (max-width: 640px) {
  .paypal-button {
    align-items: normal;
    flex-direction: column;
  }
  .paypal-button > button.button--secondary {
    justify-content: center;
  }
}

#shieldLibraryComponent .fraudAlert .usb-button.button--default {
  margin: 20px 12px 0px 0px;
}

/*****************Message Granularity Styles******************/
.usb-notification.mgBanner > .error,
.usb-notification.mgBanner > .information {
  width: auto;
}

.mgHeader {
  font-weight: 700;
  font-size: var(--body-font-size);
}

.mgBody {
  font-size: var(--body-font-size);
  display: block;
}

.mgLinkContainer {
  display: flex;
  flex-flow: wrap;
  margin-bottom: -12px;
  margin-top: 12px;
}
.usb-notification > .error .mgBody > .single-notification--link-text,
.usb-notification > .error .mgLinkContainer > .single-notification--link-text {
  font-size: var(--body-font-size);
  color: #444444;
  margin: 0;
  vertical-align: baseline;
}

.usb-notification > .error .mgLinkContainer > .single-notification--link-text {
  margin: 0 12px 12px 0;
}

.usb-notification > .error .mgLinkContainer > .single-notification--link-text:hover,
.usb-notification > .error .mgBody > .single-notification--link-text:hover {
  text-decoration: underline;
}

p.mgBody {
  margin-block-end: 0;
  margin-block-start: 0;
  margin: 0 !important;
}

p.mgBody > span,
#mgBody p {
  font-size: var(--body-font-size);
  margin-right: 2px;
  display: inline;
}
div#mgErrorPageLevel--multiple-notification {
  margin-top: 3px;
}
.mgHeader p,
.mgBody p {
  margin: 0px;
}
.mgHeader p {
  margin-top: 5px;
}
#shieldLibraryComponent .mgTable .usb-notification .icon svg {
  width: 20px;
  height: 20px;
}
.mgTable .usb-notification.mgBanner .naked .mgHeader p {
  margin-top: 0px;
}
.pymtMGBanner {
  margin-bottom: -15px;
}
/*
#secureMessageAlert {
  width: 92%;
}*/
#secureMessageAlert>.usb-notification>.information {
	box-sizing: border-box;
}

#secureMessageAlert .usb-notification .icon svg {
  width: 20px;
  height: 20px;
}

#secureMessageAlert .linkSpan {
  text-decoration: underline;
}

span.mgBody {
  text-align: left;
}

@media only screen and (max-width: 320px) {
  .mgLinkContainer {
    flex-direction: column;
  }
  .usb-notification > .error .mgLinkContainer > .single-notification--link-text {
    margin-bottom: 12px;
  }
}

.contactDetailsPrompt #shieldLibraryComponent .helper-text__container {
  margin: 4px 0px;
}

/*****************************************************/

/****************Paypal Error Component*************************************/

.paypal-error {
  margin: 20px 0 0;
}

/*****************************************************/
@media only screen and (min-width: 640px) {
  .contactDetailsPrompt #shieldLibraryComponent .form-control__input input,
  .contactDetailsPrompt #shieldLibraryComponent .label-top input {
    width: 60%;
  }
}
.contactDetailsPrompt .phoneParagraph {
  padding-top: 0.25rem;
  margin: 4px 0px;
}
.contactDetailsPrompt h2#pageErrors-multiple-notification--message {
  height: unset;
  font-weight: bold;
}

/******************************************************************/

#chargeOffPageMeaningHeader {
  padding: 10px 0px 10px 0px;
}

#chargeOffPageMeaningBody {
  padding-bottom: 20px;
}

#shieldLibraryComponent .naked {
  display: flex;
}

.mgRow tr {
  border-bottom: transparent !important;
}

.tc_mgTable tr.mgRow,
.tc_mgTable tr.mg_lastRow {
  border-bottom: 1px solid #797979;
}

@media screen and (min-width: 321px) and (max-width: 640px) {
  #chargeOffPageHeader {
    padding-top: 20px;
  }
}
@media screen and (max-width: 639px) {
  .chargeOffGoBackLink,
  #chargeOffSeePaymentPlansLink,
  .omvLinksAlignCenter {
    text-align: center;
  }
}

.mgRow #mgInformation > .information,
.selectAcct_mgBanner .usb-notification.mgBanner > .information {
  -webkit-box-shadow: unset;
  box-shadow: none;
  border: 0px;
  border-top: 0px;
  background-color: transparent;
  padding: 0px;
  margin-top: -11px;
  margin-bottom: -12px;
}
#shieldLibraryComponent .mgRow .usb-notification.mgBanner {
  line-height: 1.5;
  margin-top: -11px;
  margin-bottom: 0px;
}

.mgRow .usb-notification > .naked .mgLinkContainer > .single-notification--link-text,
.selectAcct_mgBanner .mgLinkContainer > .single-notification--link-text {
  margin: 0 12px 12px 0;
}
.selectAcct_mgBanner .mgLinkContainer {
  font-size: var(--body-font-size);
}
@media screen and (max-width: 320px) {
  .mgRow .usb-notification > .naked .mgLinkContainer > .single-notification--link-text,
  .selectAcct_mgBanner .mgLinkContainer > .single-notification--link-text {
    margin: 0 12px 12px 0;
  }
}
@media screen and (max-width: 640px) {
  .mgRow #mgInformation > .information,
  .selectAcct_mgBanner .usb-notification.mgBanner > .information {
    margin-top: -11px;
    margin-bottom: -15px;
  }
}
#mgErrorPageLevel-multiple-notification--message {
  height: auto;
  padding-bottom: 0px;
}
@media (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .mgTable {
    table-layout: fixed;
  }
  .displayInfoImagePadding > section > header.padding10 {
    padding: 10px 0px 0px 0px;
  }
}
tr#selectTableRow {
  border-bottom: transparent;
}
td.selectTableCol {
  padding: 0px;
}
.tc_mgTable th.vcp_accountSummary_tabheader {
  border-top: 1px solid #797979;
  border-bottom: 1px solid #797979;
}

/*Revamped contact us page styles begins here */

.contactUsContainer #liveChatButton button {
  margin: 0;
}

.contactUsDiv .contactUsContainer {
  column-count: 2;
  column-gap: 0px;
  display: block;
  flex-flow: unset;
  height: auto;
  margin-top: 20px;
}

.contactUsDiv-OMV .contactUsContainer {
  margin: 20px;
}

.contactUsDiv-OMV h2 {
  font-weight: bold;
  font-size: 24px;
  margin: 20px 0px;
}

.contactUsContainer .icon-header {
  margin: -30px 0 0 38px;
  display: block;
}

.contactUsContainer .contactUsList .contactUs-icon svg {
  width: 22px;
  aspect-ratio: auto 1/1;
}

.contactUsContainer .contactUsList .contactUs-icon svg.single path {
  fill: hsl(220, 4%, 31%);
}

.contactUsDiv h2 {
  font-size: var(--fs14);
  margin: 15px 0px;
}

.contactUsContainer .icon-header h3 {
  font-size: var(--fs18);
  font-weight: normal;
  margin-top: 0px;
  margin-bottom: 0px;
}

.contactUsList {
  padding: 16px;
  /* margin-right: 24px; */
  margin-right: 0px;
  margin-bottom: 24px;
  margin-left: 0px;
  background: #f7f7fa;
  border-radius: 12px;
  break-inside: avoid;
  display: block;
  width: -webkit-fill-available;
  min-height: 5rem;
  box-sizing: border-box;
}
/*Revamped contactus Page */
.contactUsContainer .contactUsList {
  width: -webkit-fill-available !important;
}

.contactUsDiv > h3,
.contactUsDiv > p {
  margin: 15px 0;
}

.contactUsDiv > h3 {
  font-weight: bold;
}

.fidelity-app .techinical-contact-list-bottom {
  margin-bottom: -50px;
}

.fidelity-app .headerWrapper {
  background-color: #597a1d;
}

.contactUsDiv-OMV .contactUsContainer.chat-omv {
  margin-left: 0px;
  margin-right: 0px;
}

/* .connect-customer-interface {
  z-index: 9999;
  bottom: 0px;
  right: 10px;
}

.end-chat-overlay{
  z-index: 9999;
  bottom: 0px;
  right: 0px;
} */

.connect-customer-interface {
  z-index: 9999;
}

.connect-customer-interface .noBtn,
.connect-customer-interface .yesBtn {
  padding: unset;
}

.connect-customer-interface .headerWrapper {
  padding: unset;
  height: 50px;
}

.connect-customer-interface div[aria-describedby="chat-error-text"] .headerWrapper {
  height: 50px;
  font-family: var(--usb-circular, var(--usb-fallback));
  font-weight: 700;
  padding: 10px 0px 10px 0px;
}

.connect-customer-interface div[aria-describedby="chat-error-text"] div {
  font-family: var(--usb-circular, var(--usb-fallback));
}

.connect-customer-interface #chat-error-text {
  font-size: var(--fs18);
  font-weight: 700;
}

.connect-customer-interface #end-chat-error.noBtn {
  padding: 10px 40px;
}

@media only screen and (min-width: 321px) and (max-width: 640px) {
  .contactUsList {
    margin-right: 0px;
  }
  .contactUsContainer {
    column-count: 1 !important;
  }
}

@media only screen and (max-width: 320px) {
  .contactUsList {
    width: -webkit-fill-available;
    margin-right: 0px;
  }
  .contactUsContainer {
    column-count: 1 !important;
  }
}

@media only screen and (min-width: 600px) {
  .contactUsContainer.chat-omv,
  .contactUsContainer.chat-desktop {
    column-count: 2;
    display: grid;
    column-gap: 1rem;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: minmax(min-content, max-content);
  }
}
/* @media only screen and (min-width: 1022px) {
  .connect-customer-interface,
  .connect-customer-interface .connect-customer-interface > div {
    left: calc(50% + 180px);
  }
} */

/* @media only screen and (min-width: 601px) {
  .connect-customer-interface {
    bottom: 0;
    right: 0;
    height: 70%;
  }
  .end-chat-overlay  {
    bottom: 0;
    right: 0;
    height: calc(70% - 50px);
  }
} */

/* @media only screen and (min-width: 1600px) {
  .connect-customer-interface {
    height: 55%;
  }
  .end-chat-overlay  {
    height: calc(55% - 50px);
  }
} */

/* @media only screen and (max-width: 599px) {
  .connect-customer-interface {
    top: unset !important;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;        
  }  
  .connect-customer-interface .end-chat-overlay{
    top: unset !important;
    bottom: 0;
    right: 0;
    width: 100%;
    height: calc(100% - 50px);
  }
} */

.omv_button--full.chat-omv {
  border-radius: 4px;
  text-transform: none;
}

/*Revamped contact us page styles ends here */

/*Below style is added to test the UDBModal View in omv, will revert the changes in the next deployment */
.usb-modal--container .modal-content {
  height: 100% !important;
}

/* DIY Pilot Styles */
.fidelity-app.diy-pilot-user .contentContainer {
  margin: 0;
  box-shadow: 0px 2px 4px -2px rgb(0 0 0 / 50%) !important;
  width: 100vw;
}
.fidelity-app.diy-pilot-user div#layoutPageContent:not(.ie-user) div#layoutMiddleWrapper {
  margin: 0;
  width: 100%;
  display: block;
}
.fidelity-app.diy-pilot-user div#layoutMiddleWrapper {
  width: 100vw;
}
div#layoutMiddleWrapper.fidelity-app.diy-pilot-user {
  margin: 0;
}
/* div#layoutPageContent:not(.ie-user) */
div#layoutMiddleWrapper.fidelity-app.diy-pilot-user {
  margin: 0;
}

.fidelity-app.diy-pilot-user div#layoutMiddleWrapper {
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  position: inherit !important;
}
div#layoutPageContent:not(.ie-user).fidelity-app.diy-pilot-user div#layoutMiddleWrapper,
div#layoutPageContent.fidelity-app.diy-pilot-user {
  background-color: #f2f2f5;
}
.fidelity-app.diy-pilot-user div.contentContainer {
  max-width: 100vw;
}
#layoutPageContent:not(.ie-user) > .contentContainer {
  width: 100%;
}
.fidelity-app.diy-pilot-user .footer--content {
  max-width: 1200px;
  margin: auto;
  margin-top: 2rem;
}

.fidelity-app.diy-pilot-user hr {
  width: 100%;
}
.fidelity-app.diy-pilot-user div#layoutMiddleWrapper > div.layoutPageContent2 {
  border-radius: 0.75rem;
  margin-top: 2rem;
}

.messageIcon svg {
  width: 20px;
  height: 20px;
}

.diy-pilot-user:not(.ie-user) .middleWrapper:before {
  background-color: unset !important;
}
.diyFooterBuild {
  font-size: 1rem;
  font-family: var(--usb-circular, var(--usb-fallback));
  width: 90%;
  padding-left: 1rem;
  margin: auto;
  padding-top: 12px;
  max-width: 1200px;
}
.diyFooterBuild .environmentInfo {
  color: rgb(19, 115, 180);
}

@media only screen and (max-width: 768px) {
  .fidelity-app.diy-pilot-user .footer--content {
    padding-left: 1rem;
  }
  .diyFooterBuild {
    padding-left: 2rem;
  }
}
/* BEGIN DIY OMV footer changes */
div#layoutBottomWrapper .transmit-login--footer__content.diy-omv {
  text-align: left;
  padding-left: 1rem;
  font-size: 0.75rem;
  margin-right: 15px;
}
.footer--content.diy-omv#footerContent p {
  font-style: normal;
  font-size: var(--fs14);
  line-height: 21px;
  font-weight: 400;
  color: #000000;
}
.footer--content.diy-omv#footerContent p a {
  line-height: 250%;
  font-weight: 400;
  text-decoration: none;
}
.fidelity-app .footer--content.diy-omv#footerContent p a {
  color: #024a7a;
}
.diy-omv .environmentInfo {
  color: #000000;
  margin-top: 15px;
  line-height: 21px;
}
.omvFooter-diy .environmentInfo {
  color: #000000;
  margin: 15px 15px 0 15px;
  line-height: 21px;
}
.diy-omvcontainer {
  background: #f2f2f5;
}
.diy-omv hr {
  background: #cdcdd3;
  height: 1px;
  border: none;
  margin-top: 1rem;
}
.diy-omvFooter {
  margin: 15px 15px 0px 15px;
}
.transmit-login--footer__content.diy-omv div > div {
  padding-left: 0 !important;
  margin-top: 0.75rem;
  margin-bottom: 1rem;
}
.transmit-login--footer__content.diy-omv [data-testid="rpc-copyright"] {
  margin-bottom: 1rem;
}
.footer--content.diy-omv#footerContent div > div .connectionSecuredLabel {
  padding-left: 0.5rem;
}
.diy-omvHeader #layoutTopWrapper .tc_Header .headerLogo img {
  transform: scale(3.99);
}
/* END DIY OMV footer changes */
div#layoutContentWrapper {
  min-height: calc(100vh - 20rem);
}

/* addToPaypalAgreePage css changes */
.addToPaypalAgreePage #layoutContentBody {
  max-width: 100%;
}
#paypalLayoutContentBody {
  max-width: 500px;
}
.toolTipAlign > .securePageTooltip > .tooltip__content--bottom {
  transform: translate(-100%);
}
@media only screen and (max-width: 640px) {
  .toolTipAlign > .securePageTooltip > .tooltip__content--bottom {
    transform: translate(-50%);
  }
}

/* Banner Chat CTA Button styles */
#chatCta, #chatCta:hover, #chatCta:focus,
#chatCta:active
#chatCta:focus:before, #chatCta:hover:before, #shieldLibraryComponent .usb-button.button--default.chatCta, 
#shieldLibraryComponent .usb-button.button--primary.chatCta, #chatCta:active:before, .usb-button.button--primary.chatCta:focus:before{
  border-radius: 6px;
 -moz-border-radius: 6px;
 -webkit-border-radius: 6px;
 border: 0px;
 display: inline-block;
 font-family: var(--usb-circular, var(--usb-fallback));
 font-size: var(--body-font-size);
 font-weight: 600;
 vertical-align: middle;
 text-align: center;
 color: White;
 -webkit-appearance: none;
 margin-bottom: 7.995px;
 margin-left: 0px;
 margin-right: 10px;
 margin-top: -4px;
 padding: 10px;
 height: auto;
 line-height: normal;
 content: none
}

 #chatCta:disabled, #chatCta:disabled:hover, #chatCta:disabled:focus, #shieldLibraryComponent .usb-button.button--primary.chatCta:disabled{
  background-color: #a9a9a9
 }

.mgLinkContainer {
  flex-flow: wrap;
  margin-bottom: -12px;
  margin-top: 12px;
  display: flex;
}
@media only screen and (min-width: 320px) and (max-width: 640px) {
  .mgLinkContainer {
    display: flex;
    flex-flow: wrap;
    padding-left: 0%;
    justify-content: flex-start;
  }
  .usb-notification>.error .tranCoreButton {
    margin: 0px 0px 0px 0px;
  }

  #chatCta, #chatCta:hover, #chatCta:focus,
  #chatCta:active
  #chatCta:focus:before, #chatCta:hover:before, #shieldLibraryComponent .usb-button.button--default.chatCta, 
  #shieldLibraryComponent .usb-button.button--primary.chatCta, #chatCta:active:before, .usb-button.button--primary.chatCta:focus:before{
    flex: 1 0 100%;
    width: auto;
    max-width: 382px;
  }
 
  .usb-notification>.error button {
    margin: 0px;
    width: 100%;
    max-width: 382px
  }
}
.yesBtn, .noBtn{
  padding: 10px;
}
