/* *****************************************************************************
	ATTENTION!
	
	With responsive design we want to create some general rules for screen sizes
	and what that should mean in regards to layout.  The following thresholds
	will give us some consistency:
	
		Phone Views: 			0-640px 	 (max-width: 640px)
		Table Portrait Views: 	641px-790px  (max-width: 790px)
		Tablet Landscape Views: 791px-1024px (max-width: 1024px)
		
***************************************************************************** */
@import "../../chat-partners/chat.fid.css";
/* Transmit Secure */
@import "../../../static/shared/css/tokens/fid-tokens.css";
@import "../../../static/shared/css/transmit-secure.css";
@import "../../../static/shared/css/browser-not-supported.css";
body {
  color: #000000;
}

div.contentContainer {
  max-width: 1000px;
  margin: 0 auto;
  padding: 0;
  box-shadow: 0 7px 15px 3px rgba(0, 0, 0, 0.15);
}

#skipTopNav {
  height: 1px;
  left: -500px;
  overflow: hidden;
  position: absolute;
  top: -50px;
  width: 1px;
  z-index: 2;
}

#layoutContentAreaWrapper:focus {
  outline: none;
}

/* Disabled button style for Fid- begin MOVED FROM SHARED/ALERT.CSS */
.fidelity-app .alerts .tranCoreButton.disabled {
  background-color: #ebebeb;
  background-image: none;
  color: #0e67a9;
  border: 1px solid #ccc;
}
/* Disabled button style for Fid- end */

/* Transaction details for Fid - begin MOVED FROM SHARED/PAGES.CSS */
.fidelity-app .transactionDetails .standardDetails.std-no-border {
  background: none !important;
}
.fidelity-app .transactionDetails .standardDetails.std-border {
  background: url("/onlineCard/static/fid/img/trans_details_dashed.png") left
    bottom repeat-x;
}
/* Transaction details for Fid - end */

/*************************** Header ***************************/

div#layoutTopWrapper {
  background-color: #368727;
}

div#layoutTopWrapper > div.layoutPageContent2 > div.layoutPageContent3 {
  padding: 0 2%;
}

div#layoutBottomNav {
  border-top: 1px solid #dbdcde;
  height: 36px;
}

.topWrapper a:link {
  color: #ffffff;
}

.topWrapper a:visited {
  color: #ffffff;
}

.topWrapper a:hover {
  color: #ffffff;
}

.topWrapper a.active {
  color: #ffffff;
}

.vcp_welcomeUser_message .loyaltyNumber {
  display: block;
  padding-bottom: 5px;
}

div.vcp_welcomeUser_message + div.vcp_welcomeUser_links {
  padding-left: 50px;
}

#tc_HeaderLogout {
  padding-bottom: 0;
}

.headerLogo {
  padding-top: 20px;
}

.headerContent {
  color: #ffffff;
}

/*************************** Navigation Bar ***************************/

ul#mainNav {
  display: block;
}

.navMenuWrapper,
.authTopNav li,
.unauthTopNav li {
  /*background: url("/onlineCard/static/fid/img/nav_bkgrnd.png");
	background-repeat:repeat-x; 
	background-position: left bottom;*/
  border-bottom: none;
}

.activeMenuItem {
  background-color: transparent;
}
.inactiveTab {
  background-color: #ebebeb;
}
ul.leftNav li a {
  display: block;
}

ul.leftNav li.activeMenuItem,
ul.leftNav li:hover {
  background: #2d3d0f;
}

ul.leftNav li.activeMenuItem a.activeMenuItem,
ul.leftNav li.activeMenuItem a.activeMenuItem:link,
ul.leftNav li.activeMenuItem a.activeMenuItem:visited,
ul.leftNav li.activeMenuItem a.activeMenuItem:active {
  color: #ffffff;
}
ul.leftNav li a,
ul.leftNav li a:link,
ul.leftNav li a:hover,
ul.leftNav li a:visited,
ul.leftNav li a:active {
  color: #ffffff;
}

ul.leftNav {
  font-size: 1.25em;
  line-height: 36px;
}
ul.leftNav li {
  border-right: 1px solid #dbdcde;
  cursor: pointer;
  min-width: 145px;
  text-align: center;
  padding: 0;
}
ul.leftNav li.leftMost {
  border-left: 1px solid #dbdcde;
}

/*************************** Footer ***************************/

div#layoutBottomWrapper {
  background-image: none;
  background-color: #dbdcde;
}

div#layoutBottomWrapper.noBackground {
  background-image: none;
  background: none;
  box-shadow: none !important;
}

.transmit-login--footer__content [data-testid="rpc-privacyPledge"],
.transmit-login--footer__content [data-testid="legacy-privacypledge"]{
  margin-top: 1.5rem;
}

div#layoutBottomWrapper > div.layoutPageContent2 {
  background-color: #ffffff;
}
div#layoutBottomWrapper > div.layoutPageContent2 > div.layoutPageContent3 {
  padding: 20px 2%;
}

div#layoutBottomWrapper
  > div.layoutPageContent2
  > div.layoutPageContent3
  > div.footerLine {
  clear: both;
  border-top: 1px solid #dbdcde;
  padding-top: 20px;
}

.bottomWrapper {
  color: #565656;
  /*background-color:#565656; */
}
.bottomWrapper a:link,
.bottomWrapper a:visited,
.bottomWrapper a:hover,
.bottomWrapper a:active {
  color: #0e57c1;
  text-decoration: underline;
}

.bottomWrapper a:hover {
  text-decoration: underline;
}

.footer a:link,
.footer a:active,
.footer a:visited {
  color: #ffffff;
}

#footerContent a.basic.cpra {
	text-transform: unset !important;
}

.footer-pcsp .footer--content a.basic,
.footer-pcsp .transmit-login--footer__content a.basic,
.footer-pcsp .footer--content span.usb-link.basic {
	display: unset !important;
	font-weight: normal;
	text-transform: unset !important;
}

#layoutSecurityStandardsMessageArea {
  color: White;
}
#layoutCopyrightMessageArea {
  color: White;
}

a.securityStdLink:link,
a.securityStdLink:active,
a.securityStdLink:visited {
}

div.environmentInfo {
  clear: both;
  color: #0e57c1;
}

.footerCopyright {
  float: right;
  text-align: right;
  margin-top: 39px;
}
@-moz-document url-prefix() {
  /* selects in firefox */
  .footerCopyright {
    margin-top: 44px;
  }
}
@supports (-webkit-appearance: none) {
  /* this is the only way in pure CSS to target a style solely to IE 12 and up, aka Edge */
  .footerCopyright {
    margin-top: 12px;
  }
}

.footerLogo {
  float: left;
}
.footerIssuer {
  float: left;
  text-align: left;
  padding-left: 15px;
}

.footerIssuer p {
  display: inline;
}

.fidelityFooterOwnerStatement {
  font-family: var(--usb-circular, var(--usb-fallback));
  color: #565656;
  font-size: var(--body-font-size);
}

.fidelityFooter {
  font-family: var(--usb-circular, var(--usb-fallback));
  color: #565656;
  font-size: 10px;
}

@media only screen and (max-width: 768px) {
  .footerLogo {
    float: none;
    width: 100%;
    text-align: center;
  }
  .footerIssuer {
    float: none;
    width: 100%;
    text-align: center;
    margin-top: 10px;
    padding-left: 0px;
  }
  .footerCopyright {
    float: none;
    margin-top: 10px;
    width: 100%;
    text-align: center;
  }

  #privacyPledgeFooter,
  .privacyPledgeFooter {
    width: 100%;
  }

  .footerPrivate {
    float: right;
    text-align: start;
    margin-top: 1000px;
  }
}

/*************************** Button ***************************/

.tranCoreButton,
.svc-btn,
.svc-btn-primary,
.svc-btn-secondary,
.svc-layout-container .form-field > a[type="submit"] {
  background-color: rgb(19, 115, 180);
  border-bottom-color: rgb(54, 110, 183);
  border-bottom-left-radius: 4.995px;
  border-bottom-right-radius: 4.995px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-image-outset: 0px;
  border-image-repeat: stretch;
  border-image-slice: 100%;
  border-image-source: none;
  border-image-width: 1;
  border-left-color: rgb(54, 110, 183);
  border-left-style: solid;
  border-left-width: 1px;
  border-right-color: rgb(54, 110, 183);
  border-right-style: solid;
  border-right-width: 1px;
  border-top-color: rgb(54, 110, 183);
  border-top-left-radius: 4.995px;
  border-top-right-radius: 4.995px;
  border-top-style: solid;
  border-top-width: 1px;
  box-sizing: border-box;
  color: rgb(255, 255, 255);
  cursor: pointer;
  display: inline-block;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 15px;
  font-stretch: normal;
  font-style: normal;
  font-variant: normal;
  font-weight: bold;
  height: 41px;
  letter-spacing: normal;
  line-height: normal;
  margin-bottom: 7.995px;
  margin-left: 0px;
  margin-right: 10px;
  margin-top: 0px;
  padding-bottom: 9px;
  padding-left: 14.25px;
  padding-right: 14.25px;
  padding-top: 9px;
  text-align: center;
  text-decoration: none;
  text-indent: 0px;
  text-rendering: auto;
  text-shadow: rgb(42, 88, 147) 0px -1px 0px;
  text-transform: none;
  vertical-align: middle;
  word-spacing: 0px;
  writing-mode: lr-tb;
  -webkit-writing-mode: horizontal-tb;
}

.tranCoreButton:hover,
.svc-btn:hover,
.svc-btn-primary:hover,
.svc-btn-secondary:hover,
.svc-layout-container .form-field > a[type="submit"]:hover,
.svc-btn-primary:focus,
.svc-btn-secondary:focus,
input.tranCoreButton:focus,
button.tranCoreButton:focus,
a.tranCoreButton:focus,
.tranCoreButton > a:focus,
span.tranCoreButton[role="button"]:focus {
  cursor: pointer;
  background-color: #1373b4;
  outline-color: rgb(255, 255, 255);
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 50%,
    color-stop(0%, #6eb5f9),
    color-stop(100%, #2b89cb)
  );
  background-image: -webkit-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -moz-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -ms-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -o-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: linear-gradient(top, #6eb5f9, #2b89cb 50%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb)";
}
.tranCoreButton:active {
  box-shadow: 0 3px 5px #0b6baa inset;
}

.fidelity-app #BalanceTransferApp button.svc-btn:disabled,
.fidelity-app button.btn:disabled,
.fidelity-app input[type="button"]:disabled,
.fidelity-app input[type="submit"]:disabled {
  background-color: rgb(117, 119, 111);
  background: linear-gradient(
    to bottom,
    rgb(150, 150, 150) 0%,
    rgb(108, 108, 108) 50%
  );
  color: rgb(255, 255, 255);
  border: none;
  text-shadow: none;
}

.omv_esignDecline .tranCoreButton {
  height: auto;
  min-height: 41px;
  white-space: pre-wrap;
}

/* ************************** Body Box ************************** */
#layoutContentAreaWrapper:focus {
  outline: none;
}
div#layoutContentArea {
  position: relative;
}

div#layoutContentBody {
}
div#layoutContentErrorMessages, div#layoutContentErrorMessagesBT {
  position: relative;
  z-index: 1;
  background-color: #ffffff;
}
div#layoutMiddleWrapper {
  background-color: #dbdcde;
}

div#layoutMiddleWrapper > div.layoutPageContent2 {
  background-color: #ffffff;
}
#layoutPageContent {
  background-color: #dbdcde;
}

.middleWrapper a:link {
  color: #0e57c1;
}

.middleWrapper a.tranCoreButton:link {
  color: #ffffff;
}
.middleWrapper a:visited {
  color: #0e57c1;
}
.middleWrapper a.tranCoreButton:visited {
  color: #ffffff;
}
.middleWrapper a:hover {
  color: #0e57c1;
  text-decoration: underline;
}
.middleWrapper a.tranCoreButton:hover {
  color: #ffffff;
  text-decoration: none;
}
.middleWrapper a:active {
  color: #0e57c1;
}
.middleWrapper a.tranCoreButton:active {
  color: #ffffff;
}
.middleWrapper a,
.svc-btn-link {
  color: #0e57c1;
}
.middleWrapper a.tranCoreButton {
  color: #ffffff;
}
.middleWrapper .label {
  color: #000000;
}

.middleWrapper .fieldtitle {
  color: #000000;
}

#layoutDateMessageArea {
  color: #000000;
}

#layoutHeaderContainer .contentAreaSubHeader {
  color: #000000;
}

.middleWrapper h2.contentAreaSubHeader {
  color: #000000;
}
h2.contentAreaSubHeader {
  margin: 0px;
  padding: 0px;
}
.middleWrapper h1,
h2,
h3,
h4,
h5,
h6,
.contentAreaTitleSection {
  color: #000000;
}
.privatePolicy {
  width: 700px;
  padding: 0px 250px;
  text-align: right;
  bottom: 20px;
  position: relative;
  float: top-right;
}

.copyRightfooter {
  width: 800px;
  padding: 0px 150px;
  text-align: right;
  bottom: 22px;
  position: relative;
}

div#layoutContentWrapper {
  opacity: ;
  /* filter:alpha(opacity=0);  For IE8 and earlier */
}
/* ************************** Table Info Box ************************** */
.table_header_coloring {
  color: White;
  background-color: #57a1d3;
}
.column_header_coloring {
  color: #57a1d3;
}

.column_header_coloring a:link {
  color: White;
}

.column_header_coloring a:visited,
.column_header_coloring a:active {
}

.column_header_coloring a:hover {
  color: White;
}

th {
  color: #000000;
  background-color: #ffffff;
}
.vcp_transactionDetail_Type {
  color: White;
}

#tc_searchLink a,
#tc_printerFriendlyLink a {
  text-decoration: underline;
}
.tc_Table tr {
  border-bottom: 1px solid #dbdcde;
}

.tc_Table tr.odd,
.claims-odd-row {
  background-color: #ffffff;
}

.tc_Table th,
.tc_Table td.blankHeader {
  border-top: 1px solid #dbdcde;
}
#transactionDetailTable_summary tr,
#transactionDetailTable_summary_Responsive tr,
#transactionDetailSummaryPrintFriendly tr {
  border-top: 1px solid #dbdcde;
}
#transactionDetailTable_summary td,
#transactionDetailTable_summary_Responsive td {
  padding: 10px 5px;
}

.transactionDetailsLinksSpacing3 {
  height: 5px;
}

.transactionDetailsVerticalAlign {
  vertical-align: top;
}

/* ************************** Login / Unauthenticated ************************** */
#loginEnhancement {
  background-color: #d7d7d7;
}
.loginTitle {
  color: #ffffff;
  background-color: #333333;
}
div.loginBox {
  z-index: 1;
  /* background: url("/onlineCard/static/fid/img/login_bkgrnd.png") left top repeat-x; */
  background-color: transparent;
  height: 285px;
}
div.loginBox div.loginTitle {
  background-color: transparent;
  color: #000000;
  font-size: 2em;
  margin-bottom: -10px;
  padding-bottom: 0;
  text-transform: capitalize;
}
div#loginbuttonnav + div.tieringElement {
  padding-top: 8px;
}

div#loginbuttonnav + div.tieringElement + div.tieringElement {
  padding-top: 5px;
}
div.loginForm input[type="text"] {
  padding: 1em;
}

div.bx-controls {
  display: none;
}

@media only screen and (max-width: 640px) {
  div.loginForm input[type="text"] {
    padding: 0.5em;
  }
  ul#navTabs li.activeMenuItem,
  ul#navTabs li.inactiveTab {
    width: 100% !important;
  }
}
/******Paypal Return To services link*******/
@media (max-width: 320px) {
  div.paypal-returnToServices {
    text-align: center !important;
  }
  .paypal-returnLabel-margin {
    margin-bottom: 5px;
    margin-top: 30px;
  }
  .paypal-input-textarea {
    text-align: center;
  }
  div.paypal-input-textarea input[type="text"] {
    width: 95%;
  }
}
/* ***************************** Carousel Box ********************************* */
div.carouselBox {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 0;
  margin-top: -20px;
}
.bx-wrapper .bx-viewport {
  border: none;
  left: 0px;
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
  bottom: 20px;
  width: 95%;
  text-align: right;
  font-size: 0px;
}
.bx-pager-item {
}
.bx-wrapper {
  margin: 0 auto;
}
ul.bxslider {
  position: relative;
  margin: 0;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
  background: none repeat scroll 0 0 #57a1d3;
}
.bx-wrapper img {
  width: 100%;
}

/* ************************** User Info Box ************************** */
.welcomeMessageArea {
  color: #565656;
  background-color: ;
  background: -moz-linear-gradient(top, 0%, 100%); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%),
    color-stop(100%)
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, 0%, 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, 0%, 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, 0%, 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, 0%, 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="", endColorstr="", GradientType=0); /* IE6-8 */
}
.vcp_welcomeUser_links a:link {
  color: #ffffff;
  text-decoration: underline;
}
.vcp_welcomeUser_links a:link img {
  background-color: #57a1d3;
}

.vcp_welcomeUser_links a:active,
.vcp_welcomeUser_links a:visited {
  color: #ffffff;
}
.vcp_welcomeUser_links a:active img,
.vcp_welcomeUser_links a:visited img {
  background-color: #57a1d3;
}
.vcp_welcomeUser_links a:hover {
  color: #ffffff;
  text-decoration: underline;
}
.vcp_welcomeUser_links a:hover img {
  background-color: #57a1d3;
}

.vcp_welcomeUser_attention {
  color: #ffffff !important;
  font-weight: bold;
}
.vcp_welcomeUser_attention img {
  background-color: #ffffff !important;
}

.vcp_welcomeUser_links_tablet a {
  background: -moz-linear-gradient(top, 0%, 100%); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%),
    color-stop(100%)
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, 0%, 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, 0%, 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, 0%, 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, 0%, 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="", endColorstr="", GradientType=0); /* IE6-8 */
}
.welcomeMessageArea .tranCoreButton {
  background: -moz-linear-gradient(top, 0%, 100%); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%),
    color-stop(100%)
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top, 0%, 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top, 0%, 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, 0%, 100%);
  /* IE10+ */
  background: linear-gradient(to bottom, 0%, 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="", endColorstr="", GradientType=0); /* IE6-8 */
}
/* ************************** Transaction Details Specific Styles ************************** */
.vcpTransDetailsImage {
  background-color: #57a1d3;
  background: -moz-linear-gradient(top, #57a1d3 0%, #57a1d3 100%); /* FF3.6+ */
  background: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0%, #57a1d3),
    color-stop(100%, #57a1d3)
  ); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(
    top,
    #57a1d3 0%,
    #57a1d3 100%
  ); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(
    top,
    #57a1d3 0%,
    #57a1d3 100%
  ); /* Opera 11.10+ */
  background: -ms-linear-gradient(top, #57a1d3 0%, #57a1d3 100%); /* IE10+ */
  background: linear-gradient(to bottom, #57a1d3 0%, #57a1d3 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#57a1d3", endColorstr="#57a1d3", GradientType=0); /* IE6-8 */
}
.topNavSmall {
  background-color: transparent;
}

#tc_accountSummaryHeader {
  font-size: 1.5em;
}

.printerFriendlyTransactionDetailsHeader {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 1%;
  background-color: #333333;
  color: #ffffff;
  font-weight: bold;
}
.printerFriendlyTransactoinDetailsDateRange {
  padding-top: 5px;
  padding-bottom: 5px;
  margin-left: 2%;
}
table#transactionDetailTable_completed .standardDetails,
table#transactionDetailTable_completed .moreDescDetails_row,
.claims-dup-txn-list {
  border-bottom: none;
  background: url("/onlineCard/static/fid/img/trans_details_dashed.png") left
    bottom repeat-x;
}
.claims-dup-txn-form .claims-dup-txn-content {
  border-top: solid 1px rgb(219, 220, 222);
}
ul#navTabs:after {
  content: "";
  display: table;
  clear: both;
}
ul#navTabs li {
  padding: 0;
}

ul#navTabs li.activeMenuItem {
  border-bottom: 1px solid #fff;
  border-right: none;
  position: relative;
  top: 1px;
  z-index: 3;
  width: 180px;
  background: transparent none;
}
ul#navTabs li.activeMenuItem a.activeMenuItem {
  border-top: 1px solid #ccc;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  background: #ffffff none;
  margin: -2px -1px 0;
  padding-bottom: 1px;
  font-size: 1em;
  color: #000000;
}
ul#navTabs li.inactiveTab {
  background: transparent none;
  border-bottom: 1px solid #ccc;
  margin: 2px 0 0;
  border-right: none;
  width: 180px;
}
ul#navTabs li.inactiveTab a.inactiveTab {
  background: #eeeeee none;
  border-top: 1px solid #ccc;
  border-right: 1px solid #ccc;
  color: #0e67a9;
  margin-top: -2px;
  font-size: 1em;
}
ul#navTabs li#tc_PostedTab a.inactiveTab {
  border-left: 1px solid #ccc;
}

#navTabs .cursor_help {
  float: right;
  margin-right: 3px;
}
ul#navTabs + div {
  border-bottom: 1px solid #ccc;
  clear: both;
  height: 1px;
  margin: 0;
  padding: 0;
  position: relative;
  top: -2px;
  z-index: 1;
}
/* ************************** Alerts Specific Styles ************************** */
.alerts .tabs-top {
  margin-top: 3px;
}
/* removed .alerts name-space to make styles portable */
.tab {
  border: 1px solid #ccc;
  border-left: 0;
  margin: 0;
  padding: 1% 4%;
  font-size: 120%;
  position: relative;
  padding-right: calc(4% + 20px);
  display: inline;
}
div.tab:first-of-type {
  border-left: 1px solid #ccc;
}
.tab a,
.tab > span {
  color: #0e67a9;
}
.tab-holder .tab a,
.tab-holder .tab > span {
  text-decoration: none;
}
.tab .cursor_help {
  position: absolute;
  top: 7px;
  right: 3px;
}
.selected-tab {
  background-color: #ffffff;
  border-bottom: 1px solid #ffffff;
  line-height: 22px;
}
.selected-tab a,
.tab-holder .selected-tab a,
.selected-tab > span,
.tab-holder .selected-tab > span {
  color: #000;
}
.alerts .tabs-body {
  border-top: 1px solid #ccc;
  margin-top: 1px;
}
.alerts .tabs-body .tc_Table > tbody > tr,
.alerts .tabs-body .tc_Table > thead > tr {
  border-bottom: none;
  background: url("/onlineCard/static/fid/img/trans_details_dashed.png") left
    bottom repeat-x;
}
.alerts .tabs-body .tc_Table > tbody > tr.group-header {
  border-bottom: none;
  background: #ebebeb url("/onlineCard/static/fid/img/trans_details_dashed.png")
    left bottom repeat-x;
}
.tab-holder {
  min-height: 27px;
  border-bottom: 1px solid #ccc;
}
/* counteract the strange height problem of .tab element on My Account page */
@media screen and (min-width: 905px) {
  .transactionDetails .tab-holder {
    min-height: 29px;
  }
}
/* ************************* GENERAL PURPOSE STYLES ************************** */
.italics {
  font-style: italic;
}
th img.cursor_help {
  vertical-align: -3px;
}

.cursor_help {
  padding-bottom: 2px;
  vertical-align: -5px;
}
.bold {
  font-weight: bold;
}

.noFocusOutline:focus,
#dialog1Focus:focus {
  outline: none;
}
.fidelity-app .required,
.fidelity-app .errortext {
  color: #e01616;
}

/***************************Claims Progress Bar css ***************************/
.claims-progress-bar .step.completed .claims-pb-circle,
.claims-progress-bar .step.completed .claims-pb-bar,
.claims-progress-bar .step.current .claims-pb-circle,
.claims-progress-bar .step.current .claims-pb-bar {
  background: rgb(19, 115, 180);
}

/* ************************* TABLET LANDSCAPE VIEW ************************** */
@media only screen and (max-width: 1024px) {
}

/* ************************** TABLET PORTRAIT VIEW ************************** */
@media only screen and (max-width: 890px) {
  ul.leftNav li {
    min-width: 0;
    padding: 0 3%;
  }
}
@media only screen and (max-width: 720px) {
  ul.leftNav li {
    min-width: 0;
    padding: 0 2%;
  }
}
/* ******************************* PHONE VIEW ******************************* */
@media only screen and (max-width: 640px) {
  /* ************************** Navigation Bar ************************** */
  ul#mainNav {
    display: none;
  }
  div#layoutBottomNav {
    z-index: 2;
    border-top: none;
  }
  .activeMenuItem {
    background-color: transparent;
  }

  .inactiveTab {
    background-color: #373739;
  }
  ul.leftNav li {
    padding: 0;
  }
  ul.leftNav li.activeMenuItem a.activeMenuItem,
  ul.leftNav li.activeMenuItem a.activeMenuItem:link,
  ul.leftNav li.activeMenuItem a.activeMenuItem:hover,
  ul.leftNav li.activeMenuItem a.activeMenuItem:visited,
  ul.leftNav li.activeMenuItem a.activeMenuItem:active {
    color: #ffffff;
    background: #597a1d none;
  }
  ul.leftNav li a,
  ul.leftNav li a:link,
  ul.leftNav li a:hover,
  ul.leftNav li a:visited,
  ul.leftNav li a:active {
    color: #ffffff;
  }
  ul.leftNav li a:hover,
  ul.leftNav li a:active {
    color: #ffffff;
    background: #597a1d none;
  }
  ul.leftNav li.activeMenuItem {
  }
  ul.leftNav li {
    background-color: #597a1d;
  }
  ul.leftNav li {
    border-right: 0px;
    text-align: right;
  }
  ul.leftNav li.leftMost {
    border-left: 0px;
  }
  ul#navTabs li {
    border-right: none;
    border-top: 1px solid #ebebeb;
    border-bottom: 1px solid #ebebeb;
  }
  ul#navTabs li.activeMenuItem {
    background-color: #57a1d3;
  }
  ul#navTabs li.inactiveTab {
    background-color: #ffffff;
  }
  ul#navTabs li.activeMenuItem a {
    background-color: #57a1d3;
    color: #ffffff;
  }
  ul#navTabs li.inactiveTab a {
    background-color: #ffffff;
    color: #000000;
  }
  .optionsSmallCell {
    display: table-cell;
    background-color: #d7d7d7;
    line-height: 34px;
    text-align: center;
    width: 50%;
    cursor: pointer;
  }
  .lastNavLink {
    border-bottom: 1px solid #373739;
  }
  .navMenuWrapper {
    background-image: none;
    background-color: none;
    border: none;
  }
  .tranCoreButton {
    margin-bottom: 10px;
  }

  .transactionDetailsLinksSpacing2 {
    height: 15px;
  }

  .tc_Table td,
  .tc_Table th {
    text-align: left;
  }

  .tranCoreButton {
    margin-bottom: 10px;
    margin-left: 10px;
  }

  /********************Sub Headers********************/
  .middleWrapper h2.contentAreaSubHeader {
    padding: 10px 0px;
  }
  /* Adding padding-top for new H1 headding tag for only fid partner under 640px */
  .middleWrapper h1.contentAreaSubHeader {
    padding-top: 10px;
  }
  option::selection {
    background: red; /* WebKit/Blink Browsers */
  }
  option::-moz-selection {
    background: red; /* Gecko Browsers */
  }
}
/* ********************** EVERYTHING EXCEPT PHONE VIEW ********************** */
@media only screen and (min-width: 641px) {
  div#layoutBottomNav {
    border-top: 1px solid #dbdcde;
  }
  .tc_shadow {
  }
  .tc_page_shadow {
  }
}
#layoutPageContent #popupLayoutContent {
  background-color: #ffffff;
}

/* ********************** FIDELITY SPECIFIC FLEXBOX STYLES ********************** */
#root,
#root > div {
  /* min-height: 100vh; */
}
#layoutPageContent:not(.ie-user) {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  position: relative;
}
#layoutPageContent:not(.ie-user) > .contentContainer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -webkit-box-shadow: none;
  box-shadow: none;
}
#layoutPageContent:not(.ie-user) .contentContainer > .middleWrapper {
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
  background-color: #ffffff;
}
#layoutPageContent:not(.ie-user) #layoutMiddleWrapper:before {
  content: "";
  position: absolute;
  bottom: 0px;
  width: 100%;
  background-color: #ffffff;
  left: 0;
  height: 10px;
  z-index: 1;
}
#layoutPageContent:not(.ie-user) #layoutMiddleWrapper,
#layoutPageContent:not(.ie-user) #layoutBottomWrapper {
  position: relative;
  -webkit-box-shadow: 0 7px 15px 3px rgba(0, 0, 0, 0.15);
  box-shadow: 0 7px 15px 3px rgba(0, 0, 0, 0.15);
}
#layoutPageContent:not(.ie-user) #layoutMiddleWrapper:after,
#layoutPageContent:not(.ie-user) #layoutBottomWrapper:after {
  content: "";
  clear: both;
  background-color: #dbdcde;
  position: absolute;
  height: 100%;
  bottom: 0;
  left: 0;
  z-index: -1;
  /* width: 100vw; */
  margin-left: calc(50% - 50vw);
}
/* ******************************* FIDELITY STYLES MOVED OVER FROM SRC ******************************* */
.fidelity-app .bx-wrapper .bx-pager,
.fidelity-app .bx-wrapper .bx-controls-auto {
  bottom: 20px;
  width: 95%;
  text-align: right;
  font-size: 0px;
}
.fidelity-app .bx-wrapper {
  margin: 0 auto;
}

.fidelity-app ul.bxslider {
  position: relative;
  margin: 0;
}
.fidelity-app ul.bxslider li {
  float: left;
  list-style: outside none none;
  position: relative;
  max-width: 100%;
}
/* .fidelity-app div.layoutPageContent3 {
		padding: 20px 0% 20px 0%;
	} */
/* .fidelity-app div#layoutContentArea {
		padding: 0px;
	} */
/* .fidelity-app .middleWrapper h2.contentAreaSubHeader {
   		display: none;
   	} */
.fidelity-app div.loginSpacer {
  position: relative;
  width: 2%;
  float: left;
}
@media only screen and (max-width: 640px) {
  .fidelity-app div.loginBox {
    width: 96%;
    border-width: 0px;
  }
  .fidelity-app .loginForm,
  .loginTitle {
    width: 100%;
  }
  .fidelity-app div.loginSpacer {
    display: none;
  }
}
.fidelity-app a img {
  border: none;
}

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

  width: 500px;
  background: #ffffff;
  z-index: 1010;
  position: absolute;
  top: 20px;
  border: 1px solid red;
  padding: 10px 25px 10px;
}
.fidelity-app #ieUpgrade h1 {
  color: #646262;
  font-weight: bold;
  font-size: var(--fs16);
  margin: 0;
  padding: 0;
  clear: both;
}
.fidelity-app #ieUpgrade .upgradeContent {
  color: #646262;

  font-size: var(--body-font-size);
  text-align: left;
  padding-top: 10px;
}
.fidelity-app #ieUpgrade .upgradeClose {
  margin: 0 0 10px;
  color: #226afb;
  font-weight: bold;
  font-size: var(--fs14);
}
.fidelity-app #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;
}
.fidelity-app #upgradeCloseLink {
  cursor: pointer;
  text-decoration: underline;
}
.fidelity-app #ieUpgrade .upgradeBrowsers {
  margin: 0 auto;
  text-align: center;
}
.fidelity-app #ieUpgrade .upgradeBrowsers img {
  margin: 0 10px;
}

.fidelity-app #upgradeBrowsersLinks {
  list-style-type: none;
  text-align: center;
  margin-left: 10px;
  height: 100px;
}
.fidelity-app #upgradeBrowsersLinks li {
  float: left;
  color: #226afb;
  font-size: var(--fs11);
}
.fidelity-app #upgradeBrowsersLinks li a {
  text-decoration: none;
  color: #226afb;
  font-size: var(--fs11);
}
/* Transaction Data Sharing Toggle */
.toggle-label input[type="checkbox"] + .back,
.toggle-label input[type="checkbox"]:checked + .back {
  background-color: rgb(19, 115, 180);
}
.toggle-label input[type="checkbox"]:checked + .back .label.on {
  color: #000000;
}
/* Servicing app and Claim Initiation feature styles for Fidelity */
.claims-category-header {
  background-color: #1373b4 !important;
}
/* Defect 8992 - fidelity input button not working on iphone and ipad */

.fid-input-btn {
  -webkit-appearance: none;
  background-color: rgb(19, 115, 180) !important;
  border-bottom-color: rgb(54, 110, 183) solid 1px !important;
  border-radius: 4.995px !important;
  border-image-outset: 0px !important;
  border-image-repeat: stretch !important;
  border-image-slice: 100% !important;
  border-image-source: none !important;
  border-image-width: 1 !important;
  box-sizing: border-box !important;
  color: rgb(255, 255, 255) !important;
  cursor: pointer !important;
  display: inline-block !important;
  font-family: Helvetica, Arial, sans-serif !important;
  font-size: 15px !important;
  font-stretch: normal !important;
  font-style: normal !important;
  font-variant: normal !important;
  font-weight: bold !important;
  height: 41px !important;
  letter-spacing: normal !important;
  line-height: normal !important;
  margin-bottom: 7.995px !important;
  margin-left: 0px !important;
  margin-right: 10px !important;
  margin-top: 0px !important;
  padding-bottom: 9px !important;
  padding-left: 14.25px !important;
  padding-right: 14.25px !important;
  padding-top: 9px !important;
  text-align: center !important;
  text-decoration: none !important;
  text-indent: 0px !important;
  text-rendering: auto !important;
  text-shadow: rgb(42, 88, 147) 0px -1px 0px !important;
  text-transform: none !important;
  vertical-align: middle !important;
}
.fid-input-btn:hover {
  cursor: pointer !important;
  background-color: #1373b4 !important;
  outline-color: rgb(255, 255, 255) !important;
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 50%,
    color-stop(0%, #6eb5f9),
    color-stop(100%, #2b89cb)
  ) !important;
  background-image: -webkit-linear-gradient(
    top,
    #6eb5f9,
    #2b89cb 50%
  ) !important;
  background-image: -moz-linear-gradient(top, #6eb5f9, #2b89cb 50%) !important;
  background-image: -ms-linear-gradient(top, #6eb5f9, #2b89cb 50%) !important;
  background-image: -o-linear-gradient(top, #6eb5f9, #2b89cb 50%) !important;
  background-image: linear-gradient(top, #6eb5f9, #2b89cb 50%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb) !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb)";
}

/* These changes need to be added to the OMV SASS stylesheet.  These overrides are in place as a temporary measure.  Jason B. 12/4/18 */
.alerts
  div#layoutContentArea
  #layoutContentBody
  table.tc_Table.omvAlertOptionSected
  tr.securityTab:not(.omvSelectedOption) {
  display: none;
}

.alerts
  div#layoutContentArea
  #layoutContentBody
  table.tc_Table.omvAlertOptionSected
  tr.fraudTab:not(.omvSelectedOption) {
  display: none;
}

.alerts
  div#layoutContentArea
  #layoutContentBody
  table.tc_Table.omvAlertOptionSected
  tr:not(.omvSelectedOption) {
  display: block;
}

.alerts
  div#layoutContentArea
  #layoutContentBody
  table.tc_Table.omvAlertOptionSected
  tr
  tr:not(.omvSelectedOption) {
  display: none;
}
.alerts
  div#layoutContentArea
  #layoutContentBody
  table.tc_Table.omvAlertOptionSected
  tr
  tr.omvSelectedOption {
  background-color: #fff;
  display: block;
}

.messageInbox #popupContainer {
  top: 0px !important;
}

.web_hollowButton {
  background-color: transparent;
  border-style: solid;
  border-width: 1px;
  color: #1373b4;
  border: solid 1px #1373b4;
  font-weight: normal;
}

.web_hollowButton:hover,
input.web_hollowButton:focus,
button.web_hollowButton:focus,
a.web_hollowButton:focus,
.web_hollowButton > a:focus,
span.web_hollowButton[role="button"]:focus {
  cursor: pointer;
  background-color: #1373b4;
  color: #ffffff;
  outline-color: rgb(255, 255, 255);
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 50%,
    color-stop(0%, #6eb5f9),
    color-stop(100%, #2b89cb)
  );
  background-image: -webkit-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -moz-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -ms-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -o-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: linear-gradient(top, #6eb5f9, #2b89cb 50%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb)";
}

.web_hollowButton:active {
  box-shadow: none;
}

@media only screen and (max-width: 320px) {
  .tranCoreButton {
    width: 100%;
    margin-left: 0px;
  }
  #popupFrame {
    margin: 10px;
  }
}
@media only screen and (min-width: 321px) and (max-width: 360px) {
  .reviewRecentTransactions #popupContainer,
  .reviewSubmitRequest #popupContainer,
  .confirmReviewSubmitRequest #popupContainer,
  .cardDeliveryOptions #popupContainer,
  .lostStolenAdditionalDetails #popupContainer,
  .cardReplacementSelectUsers #popupContainer,
  .cardReplacementDeliveryOptions #popupContainer,
  .cardReplacementReviewSubmit #popupContainer {
    width: auto !important;
    left: 1% !important;
    right: 1%;
  }
}
@media only screen and (min-width: 361px) and (max-width: 640px) {
  .reviewRecentTransactions #popupContainer,
  .reviewSubmitRequest #popupContainer,
  .confirmReviewSubmitRequest #popupContainer,
  .cardDeliveryOptions #popupContainer,
  .lostStolenAdditionalDetails #popupContainer,
  .cardReplacementSelectUsers #popupContainer,
  .cardReplacementDeliveryOptions #popupContainer,
  .cardReplacementReviewSubmit #popupContainer {
    width: 320px !important;
    left: 6% !important;
  }
}

@media only screen and (max-width: 320px) {
  .reviewRecentTransactions #popupContainer,
  .reviewSubmitRequest #popupContainer,
  .cardDeliveryOptions #popupContainer,
  .lostStolenAdditionalDetails #popupContainer,
  .cardReplacementSelectUsers #popupContainer,
  .cardReplacementDeliveryOptions #popupContainer,
  .cardReplacementReviewSubmit #popupContainer {
    left: 8% !important;
  }
}

.reviewRecentTransactions #popupFrame,
.reviewSubmitRequest #popupFrame,
.cardDeliveryOptions #popupFrame,
.lostStolenAdditionalDetails #popupFrame,
.cardReplacementSelectUsers #popupFrame,
.cardReplacementDeliveryOptions #popupFrame,
.cardReplacementReviewSubmit #popupFrame {
  margin: 0px;
  padding: 15px;
}

.reviewRecentTransactions #popupTitleBar,
.reviewSubmitRequest #popupTitleBar,
.cardDeliveryOptions #popupTitleBar,
.lostStolenAdditionalDetails #popupTitleBar,
.cardReplacementSelectUsers #popupTitleBar,
.cardReplacementDeliveryOptions #popupTitleBar,
.cardReplacementReviewSubmit #popupTitleBar {
  height: 0;
  padding: 0;
}

.cardHub h2.contentAreaSubHeader,
.cardHub h1#subHeader,
.cardHub a {
  color: #0e57c1;
}
/* Virtual Card styles */
.virtualcardSubheader {
  outline: none;
}

.icc-content .cardDetails {
  line-height: 28px;
  margin-top: 10px;
  width: 500px;
}

.icc-content .cardDetails .continueBtn {
  background-color: #1373b4;
  color: #ffffff;
  width: 40%;
  font-weight: 700;
  font-size: var(--fs16);
  border: 1px solid;
  border-radius: 4px;
  line-height: 1.25em;
  padding: 0px 24px 0px 24px;
  margin: 30px 12px 20px 0px;
  height: 40px;
}
.icc-content .timerSection .continueBtn {
  background-color: #1373b4;
  color: #ffffff;
  font-size: var(--body-font-size);
  display: inline-block;
  font-weight: 700;
  padding: 10px;
  margin-bottom: 5px;
  border-width: 0px;
}
.icc-content .cardDetails .continueBtn:hover {
  background: -webkit-gradient(
    linear,
    50% 0%,
    50% 50%,
    color-stop(0%, #6eb5f9),
    color-stop(100%, #2b89cb)
  );
  color: #ffffff;
}
.icc-content .noteBold {
  font-weight: bold;
}
.icc-content .imgCard {
  margin: 20px auto;
}

.icc-content .cardDetails p {
  margin: 0px;
  padding: 2px 0px 2px 10px;
  background-color: #f7f7f7;
}
.icc-content .accessExpire {
  text-align: left;
  margin-top: 20px;
  font-size: var(--fs14);
  font-style: normal;
  outline: 0;
}
.icc-content .accessExpireSubMsg {
  text-align: left;
  margin-top: 20px;
}

.icc-content .modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
}

.resetPosition {
  position: unset !important;
}

div#layoutMiddleWrapper.resetPosition::before {
  height: 0px !important;
}

.icc-content .modal-main {
  position: absolute;
  background: #fff;
  width: 350px;
  height: 33%;
  margin: auto;
  border: 1px solid #000000;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 0px) and (max-width: 639px) {
  .icc-content .modal-main {
    width: 100%;
    height: 100%;
    border-radius: 0;
  }
}
.icc-content .modalHeader {
  margin: 40px 20px 16px;
  font-size: var(--fs14);
  font-weight: bold;
}
.icc-content .modalContent {
  margin: 16px 20px 20px;
  padding-right: 10px;
  font-size: var(--body-font-size);
}
.icc-content .modalCloseIcon {
  float: right;
  margin-top: 12px;
  margin-right: 12px;
  cursor: pointer;
  background-color: transparent;
  border: none;
}
.icc-content .timerSection {
  width: 289px;
  margin: 10px 20px;
  display: block;
}
.icc-content .timerBtn {
  margin: 0;
}
.icc-content .resetTxt {
  margin-top: 12px;
}

.reviewTransactionDataSharing #popupContainer {
  top: -50px !important;
}

/* Overriding Shield library styles for this applying partner specific styles */

/* Buttons */
#shieldLibraryComponent .usb-button.button--primary,
.yesBtn,
#shieldLibraryComponent .tooltip__content--dark {
  /* background-color: #1373b4; */
  background: #1373b4;
  color: #ffffff;
}
#shieldLibraryComponent .usb-button.button--primary:hover,
.yesBtn:hover {
  background: -webkit-gradient(
    linear,
    50% 0%,
    50% 50%,
    color-stop(0%, #6eb5f9),
    color-stop(100%, #2b89cb)
  );
  color: #ffffff;
  background-image: -ms-linear-gradient(top, #6eb5f9, #2b89cb 50%);
}
#shieldLibraryComponent .usb-button.button--secondary,
.endChatBtn,
.noBtn {
  /* background-color: #ffffff; */
  background: #ffffff;
  color: #1373b4;
  border-color: #1373b4;
}
#shieldLibraryComponent .usb-button.button--secondary:hover,
.endChatBtn:hover,
.noBtn:hover {
  /* background-color: #1373b4; */
  background: #1373b4;
  color: #ffffff;
  border-color: #1373b4;
}
#shieldLibraryComponent .usb-button.button--loud {
  background-color: #e87700;
  background-color: rgba(232, 119, 0, 1);
  color: #000000;
}
#shieldLibraryComponent .usb-button.button--loud:hover {
  background-color: #ff9e41;
  background-color: rgba(255, 158, 65, 1);
  color: #000000;
}
/* Links */
#shieldLibraryComponent a.basic,
#shieldLibraryComponent a.arrow,
#shieldLibraryComponent .arrow > a .anchor-children,
#shieldLibraryComponent span.arrow,
#shieldLibraryComponent .arrow > .anchor-children,
#shieldLibraryComponent a.subtle,
#shieldLibraryComponent a.inline,
#shieldLibraryComponent a.inline.dark,
.cardHub #shieldLibraryComponent a.basic:hover,
#shieldLibraryComponent span.usb-link,
.rewardsAndBenefits #shieldLibraryComponent a.basic:hover {
  color: #1373b4;
}
#shieldLibraryComponent a.basic:hover,
#shieldLibraryComponent a.arrow:hover,
#shieldLibraryComponent .arrow > a:hover,
#shieldLibraryComponent .arrow > a .anchor-children:hover,
#shieldLibraryComponent span.arrow:hover,
#shieldLibraryComponent .arrow > span:hover,
#shieldLibraryComponent .arrow > .anchor-children:hover,
#shieldLibraryComponent .usb-accordion .accordion-panel__header:hover,
#shieldLibraryComponent
  .usb-accordion
  .accordion-panel--expanded
  .accordion-panel__header,
#shieldLibraryComponent a.subtle:hover,
#shieldLibraryComponent a.inline:hover,
#shieldLibraryComponent a.inline.dark:hover,
#shieldLibraryComponent span.usb-link:hover {
  color: #4f7aa4;
}
/* radio buttons */
#shieldLibraryComponent
  .form-control__radio
  .input__container
  input[type="radio"]:hover:not(:checked):not(:disabled) {
  border: 1px solid #1373b4;
}
#shieldLibraryComponent
  .form-control__radio
  .input__container
  input[type="radio"]:checked {
  border: 2px solid #1373b4;
  background-color: #1373b4;
}
/* Check boxes */
#shieldLibraryComponent
  .form-control__checkbox
  input[type="checkbox"]:checked
  + label
  svg {
  background: #1373b4;
  border: 1px solid #1373b4;
}
#shieldLibraryComponent
  .form-control__checkbox
  input[type="checkbox"]:hover:not(:disabled)
  + label
  svg {
  border: 1px solid #1373b4;
}

#shieldLibraryComponent a.basic,
#shieldLibraryComponent a.arrow,
#shieldLibraryComponent .arrow > a .anchor-children,
#shieldLibraryComponent span.arrow,
#shieldLibraryComponent .arrow > .anchor-children,
#shieldLibraryComponent a.subtle,
#shieldLibraryComponent a.inline,
#shieldLibraryComponent a.inline.dark,
.cardHub #shieldLibraryComponent a.basic:hover,
#shieldLibraryComponent span.usb-link {
  color: #1373b4;
}

#shieldLibraryComponent
  .form-control__radio
  .input__container
  input[type="radio"]:checked {
  border: 2px solid #1373b4;
  background-color: #1373b4;
}

#shieldLibraryComponent
  .form-control__radio.is-focused
  .input__container:after {
  /* border:none; */
  border-color: #1373b4;
}
/*Trancore body color*/
#shieldLibraryComponent .usb-accordion .accordion-panel__header,
#shieldLibraryComponent .usb-accordion .accordion-panel__content {
  color: #000000;
}

#shieldLibraryComponent .form_control__select .labelText__container,
#shieldLibraryComponent .form_control__select__container select,
#shieldLibraryComponent .form_control__select.error .labelText__text,
#shieldLibraryComponent .usb--wrapper .usb--floating-label,
#shieldLibraryComponent .usb--info-message,
#shieldLibraryComponent .usb--basic-input,
#shieldLibraryComponent .form-control__radio .label__container {
  font-family: var(--usb-circular, var(--usb-fallback));
  color: #000 !important;
}

/* *****IE browser notification styles*****  */
.notify_ie {
  background-color: #dbdcde;
}
.notify_ie .layoutPageContent2 {
  max-width: 936px;
}
/* IE browser notification styles ends */

/* Shield generic styles for widgets to apply partner specific styles */

/* Buttons */
#shieldPartnerWidgetWrap .usb-button.button--primary,
#shieldPartnerWidgetWrap .tooltip__content--dark {
  /* background-color: #1373b4; */
  background: #1373b4;
  color: #ffffff;
}
#shieldPartnerWidgetWrap .usb-button.button--primary:hover {
  background: -webkit-gradient(
    linear,
    50% 0%,
    50% 50%,
    color-stop(0%, #6eb5f9),
    color-stop(100%, #2b89cb)
  );
  color: #ffffff;
  background-image: -ms-linear-gradient(top, #6eb5f9, #2b89cb 50%);
}
#shieldPartnerWidgetWrap .usb-button.button--secondary {
  /* background-color: #ffffff; */
  background: #ffffff;
  color: #1373b4;
  border-color: #1373b4;
}
#shieldPartnerWidgetWrap .usb-button.button--secondary:hover {
  /* background-color: #1373b4; */
  background: #1373b4;
  color: #ffffff;
  border-color: #1373b4;
}
#shieldPartnerWidgetWrap .usb-button.button--loud {
  background-color: #e87700;
  background-color: rgba(232, 119, 0, 1);
  color: #000000;
}
#shieldPartnerWidgetWrap .usb-button.button--loud:hover {
  background-color: #ff9e41;
  background-color: rgba(255, 158, 65, 1);
  color: #000000;
}
/* Links */
#shieldPartnerWidgetWrap a.basic,
#shieldPartnerWidgetWrap a.arrow,
#shieldPartnerWidgetWrap .arrow > a .anchor-children,
#shieldPartnerWidgetWrap span.arrow,
#shieldPartnerWidgetWrap .arrow > .anchor-children,
#shieldPartnerWidgetWrap a.subtle,
#shieldPartnerWidgetWrap a.inline,
#shieldPartnerWidgetWrap a.inline.dark,
.cardHub #shieldPartnerWidgetWrap a.basic:hover,
#shieldPartnerWidgetWrap span.usb-link,
.rewardsAndBenefits #shieldPartnerWidgetWrap a.basic:hover {
  color: #1373b4;
}
#shieldPartnerWidgetWrap a.basic:hover,
#shieldPartnerWidgetWrap a.arrow:hover,
#shieldPartnerWidgetWrap .arrow > a:hover,
#shieldPartnerWidgetWrap .arrow > a .anchor-children:hover,
#shieldPartnerWidgetWrap span.arrow:hover,
#shieldPartnerWidgetWrap .arrow > span:hover,
#shieldPartnerWidgetWrap .arrow > .anchor-children:hover,
#shieldPartnerWidgetWrap .usb-accordion .accordion-panel__header:hover,
#shieldPartnerWidgetWrap
  .usb-accordion
  .accordion-panel--expanded
  .accordion-panel__header,
#shieldPartnerWidgetWrap a.subtle:hover,
#shieldPartnerWidgetWrap a.inline:hover,
#shieldPartnerWidgetWrap a.inline.dark:hover,
#shieldPartnerWidgetWrap span.usb-link:hover {
  color: #4f7aa4;
}
/* radio buttons */
#shieldPartnerWidgetWrap
  .form-control__radio
  .input__container
  input[type="radio"]:hover:not(:checked):not(:disabled) {
  border: 1px solid #1373b4;
}
#shieldPartnerWidgetWrap
  .form-control__radio
  .input__container
  input[type="radio"]:checked {
  border: 2px solid #1373b4;
  background-color: #1373b4;
}
/* Check boxes */
#shieldPartnerWidgetWrap
  .form-control__checkbox
  input[type="checkbox"]:checked
  + label
  svg {
  background: #1373b4;
  border: 1px solid #1373b4;
}
#shieldPartnerWidgetWrap
  .form-control__checkbox
  input[type="checkbox"]:hover:not(:disabled)
  + label
  svg {
  border: 1px solid #1373b4;
}

#shieldPartnerWidgetWrap a.basic,
#shieldPartnerWidgetWrap a.arrow,
#shieldPartnerWidgetWrap .arrow > a .anchor-children,
#shieldPartnerWidgetWrap span.arrow,
#shieldPartnerWidgetWrap .arrow > .anchor-children,
#shieldPartnerWidgetWrap a.subtle,
#shieldPartnerWidgetWrap a.inline,
#shieldPartnerWidgetWrap a.inline.dark,
.cardHub #shieldPartnerWidgetWrap a.basic:hover,
#shieldPartnerWidgetWrap span.usb-link {
  color: #1373b4;
}

#shieldPartnerWidgetWrap
  .form-control__radio
  .input__container
  input[type="radio"]:checked {
  border: 2px solid #1373b4;
  background-color: #1373b4;
}

#shieldPartnerWidgetWrap
  .form-control__radio.is-focused
  .input__container:after {
  /* border:none; */
  border-color: #1373b4;
}
/*Trancore body color*/
#shieldPartnerWidgetWrap .usb-accordion .accordion-panel__header,
#shieldPartnerWidgetWrap .usb-accordion .accordion-panel__content {
  color: #000000;
}

#shieldPartnerWidgetWrap .form_control__select .labelText__container,
#shieldPartnerWidgetWrap .form_control__select__container select,
#shieldPartnerWidgetWrap .form_control__select.error .labelText__text,
#shieldPartnerWidgetWrap .usb--wrapper .usb--floating-label,
#shieldPartnerWidgetWrap .usb--info-message,
#shieldPartnerWidgetWrap .usb--basic-input,
#shieldPartnerWidgetWrap .form-control__radio .label__container {
  font-family: var(--usb-circular, var(--usb-fallback));
  color: #000 !important;
}

/* TOKENS CAN BE IN SEPARATE FILE -> tokens.css, then imported  */
/* TOOLTIPS Added PublicPageTooltip class to context-help.js  */
/* HARD CODE COLORS FOR IE */
/* #lock {
  fill: #597a1d;
  fill: var(--primary-background);
} */
.background--primary {
  background: #597a1d;
  background: var(--primary-background);
}
.background--secondary {
  background-color: #f8f8f8;
  background-color: var(--hero-background-color);
}
.PublicPageTooltip .tooltip__content--dark {
  background: var(--primary);
  background: rgb(75, 119, 187);
}

/* fidility agent chat minimize icon button */
div.floatingBtn, button.floatingBtn {
  background-color: rgb(19, 115, 180);
  font-family: var(--usb-circular, var(--usb-fallback));
  /* width: 185px;
  height: 43px; */
}
button.sendBtn {
  background:rgb(19, 115, 180);
}
/* fidility agent chat minimize icon button position */
/* @media only screen and (min-width: 1022px) {
  button.floatingBtn {
   
    left: calc(50% + 278px);
  }
} */
@media only screen and (min-width: 600px) and (max-width: 1440px) {
  button.floatingBtn {
    bottom: 12%;
  }
}
@media only screen and (max-width: 599px) {
  button.floatingBtn {
    /* right: 2%; */
    bottom: 20%;
  }
}
  
/**
Header and Navigation bar styles for fidelity pilot users starts here 
**/

#shieldLibraryComponent .navBarMenuItem a.basic,
#shieldLibraryComponent .pilotActiveMenuItem a.basic {
  text-decoration: none;
  color: #024A7A;
  width: auto;
  font-size: 1rem;
  padding: 0.75rem 1.25rem;
  border-bottom: 1px solid transparent;
}

#shieldLibraryComponent .pilotActiveMenuItem a.basic {
  font-weight: 700;
  color: #000000;
}

#shieldLibraryComponent .pilotActiveMenuItem a.basic,
#shieldLibraryComponent .pilotActiveMenuItem a.basic:hover,
#shieldLibraryComponent .pilotActiveMenuItem a.basic:active,
#shieldLibraryComponent .navBarMenuItem a.basic:hover {
  border-bottom-color: #000000;
}

div.layoutTopWrapperContainer {
  background: #ffffff;
  box-shadow: 0px 2px 4px -2px rgb(0 0 0 / 50%);
}
.pilotTopNavSmall {
  display: none;
}
div.tc_PilotHeader {
  min-height: 66px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.25rem;
  text-align: left;
  line-height: 1.5;
  font-size: 0.75rem;
  font-family: HelveticaNeue-USB, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-style: normal;
  font-weight: 400;
  color: #ffffff;
  box-sizing: border-box;
  align-items: center;
  display: flex;
}
div.pilotHeaderLogo {
  float: left;
  line-height: 0;
}
div.pilotHeaderLogo img {
  max-width: 100%;
}

#linkGroup1.pilot_welcomeUser_links{
  margin-inline-start: auto;
}

div.pilot_welcomeUser_links {
  letter-spacing: 0.02em;
}

#shieldLibraryComponent .pilot_welcomeUser_links a:link,
#shieldLibraryComponent .pilot_welcomeUser_links a:link :active,
#shieldLibraryComponent .pilot_welcomeUser_links a:link :visited,
#shieldLibraryComponent .pilot_welcomeUser_links a:link :hover {
  color: #ffffff;
  text-decoration: none;
  margin-right: 10px;
  margin-left: 10px;
}

div#pilotLayoutBottomNav {
  background: #ffffff;
  max-width: 1200px;
  margin: 0 auto;
}

ul.pilotLeftNav {
  margin: 0;
  padding-inline-start: 0px;
  margin-block-start: 0;
  margin-block-end: 0;
  display: flex;
}
ul.pilotLeftNav li {
  padding: 0;
  list-style: none;
  float: left;
}

ul.pilotLeftNav li.userLinkNavItems,
span.chevronDownIcon,
span.chevronRightIcon {
  display: none;
}

@media only screen and (max-width: 768px) {
  .pilotTopNavSmall {
    display: block;
    padding: 20px 0px 0 10px;
    float: left;
  }

  .pilotTopNavSmall button {
    background: none;
    border: none;
  }

  #hamburgerMenu span.svg-icon, #closeButton span.svg-icon {
    color: #fff;
    fill: #fff;
  }

  div.pilotHeaderLogo {
    max-width: 75%;
    margin: auto;
  }
  
  div#linkGroup1.pilot_welcomeUser_links {
    display: none;
  }

  #shieldLibraryComponent .pilot_welcomeUser_links a:link,
  #shieldLibraryComponent .pilot_welcomeUser_links a:link :active,
  #shieldLibraryComponent .pilot_welcomeUser_links a:link :visited,
  #shieldLibraryComponent .pilot_welcomeUser_links a:link :hover {
    margin-right: 0px;
  }

  #pilotBottomNavBarContent.hideDiv ,
  #closeButton {
    display: none;
  }
  
  ul.pilotLeftNav {
    flex-direction: column;
    width: 100%;
  }
  ul.pilotLeftNav li.userLinkNavItems {
    display: flex;
    align-items: center;
    min-height: 2.25rem;
  }

  #shieldLibraryComponent .userLinkNavItems a.basic {
    text-decoration: none;
    color: #2c2c2c;
    font-size: 1rem;
    padding: 0.5rem 0.75rem;
    background: #fff;
    width: 100%;
    border: none;
  }

  .profileIcon,
  .activeProfileIcon,
  span.chevronDownIcon,
  span.chevronRightIcon {
    padding-left: 0.75rem;
    display: inline;
  }

  ul.pilotLeftNav li.navBarMenuItem,
  ul.pilotLeftNav li.pilotActiveMenuItem {
    background: #f7f7fa;
    width: 100%;
    border: 1px solid #e5e5e5;
    box-sizing: border-box;
    display: flex;
    align-items: center;
  }

  #shieldLibraryComponent .pilotActiveMenuItem a.basic,
  #shieldLibraryComponent .navBarMenuItem a.basic {
    padding: 0.75rem 0.5rem;
    border-bottom: none;
  }

}
/* PILOT footer */
.diyPilot--footer {
  max-width: 1344px;
}
.diyPilot--footer a.basic {
  text-decoration: none;
  font-weight: normal;
}
/**
Enroll confirm page for pilot users starts here 
**/
#confirmationMessage{
  padding-top: 20px;
  max-width: 450px;
}
#buttonSession{
  padding-top: 35px;
}

@media only screen and (min-width: 768px) {
  #shieldLibraryComponent .usb-button.button--primary#loginButton{
    width: 200px;
  }
}

/*Tooltip position*/
.securePageTooltip .tooltip__content--dark {
  background: #1373b4;
  font-weight: normal;
  text-transform: none;
}
.securePageTooltip{
  vertical-align: middle;
}
.tab .tooltip{
  position: absolute;
  right: 3px;
}

@media only screen and (max-width: 640px) {
  .securePageTooltip .tooltip__content--right {
    top: 1.5rem;
    left: 50%;
    -webkit-transform: translate(-50%);
    -ms-transform: translate(-50%);
    transform: translate(-50%);
  }
}

.browserNotSupported .login--footer{
  background: none !important;
}

/* Removing footer highlight in creditlimitincrease */
#layoutPageContent:not(.ie-user) #layoutBottomWrapper.bottomWrapperClass,
#layoutPageContent:not(.ie-user) #layoutMiddleWrapper.layoutMiddleWrapperClass:before{
  position: inherit;
}
#chatCta, #chatCta:hover,#chatCta:focus, #shieldLibraryComponent .usb-button.button--primary.chatCta,
#shieldLibraryComponent .usb-button.button--primary.chatCta:hover, 
#shieldLibraryComponent .usb-button.button--primary.chatCta:focus,
#shieldLibraryComponent .usb-button.button--primary.chatCta:focus:before,
#shieldLibraryComponent .usb-button.button--primary.chatCta:active
.usb-button.chatCta:focus:before,
.usb-button.button--primary.chatCta:active,
.usb-button.button--primary.chatCta:hover,
.usb-button.button--primary.chatCta:focus,
#shieldLibraryComponent .usb-button.button--primary.chatCta:active,
.usb-button.chatCta:focus:before,
.tranCoreButton.chatCta:hover{
  background-color: rgb(19, 115, 180);
  background:rgb(19, 115, 180); 
  border-bottom-color: rgb(54, 110, 183);
  border-bottom-left-radius: 4.995px;
  border-bottom-right-radius: 4.995px;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-image-outset: 0px;
  border-image-repeat: stretch;
  border-image-slice: 100%;
  border-image-source: none;
  border-image-width: 1;
  border-left-color: rgb(54, 110, 183);
  border-left-style: solid;
  border-left-width: 1px;
  border-right-color: rgb(54, 110, 183);
  border-right-style: solid;
  border-right-width: 1px;
  border-top-color: rgb(54, 110, 183);
  border-top-left-radius: 4.995px;
  border-top-right-radius: 4.995px;
  border-top-style: solid;
  border-top-width: 1px;
  box-sizing: border-box;
  height: 41px;
  display: inline-block;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 15px;
  font-stretch: normal;
  font-style: normal;
  font-variant: normal;
  font-weight: bold;
}
.tranCoreButton.chatCta:disabled, #chatCta:disabled:focus, #chatCta:disabled,#chatCta:disabled:hover, #shieldLibraryComponent .usb-button.button--primary.chatCta:disabled, .usb-button.button--primary.chatCta:focus:before{
  background: linear-gradient( to bottom, rgb(150, 150, 150) 0%, rgb(108, 108, 108) 50% );
  color: rgb(255, 255, 255);
  border: none;
  text-shadow: none;
  cursor: not-allowed;
  box-shadow: none
}
#chatCta:hover, #shieldLibraryComponent .usb-button.button--primary.chatCta:hover{
  cursor: pointer;
  background-color: #1373b4;
  outline-color: rgb(255, 255, 255);
  background-image: -webkit-gradient(
    linear,
    50% 0%,
    50% 50%,
    color-stop(0%, #6eb5f9),
    color-stop(100%, #2b89cb)
  );
  background-image: -webkit-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -moz-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -ms-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: -o-linear-gradient(top, #6eb5f9, #2b89cb 50%);
  background-image: linear-gradient(top, #6eb5f9, #2b89cb 50%);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#6eb5f9, endColorstr=#2b89cb)";
}