/* needed for Apply Now button and Join Now banner */

html, body { overflow-x: visible; } /* overriding what's in dg.css, but not sure why it's there */
/* 
.card-nav { padding-right: 115px; }
.explore-close { padding-right: 115px; }
.explore-links { right: 115px; max-width: 270px; }
*/
.nav-link-applyNow { position: absolute !important; right: 0; z-index: 6;height: 50px; display: flex; align-items: center; color: #fff; text-decoration: none; font-weight: 500;  }
@media (max-width: 1280px) {.nav-link-applyNow { right: 15px; } }

.blueBG:has(.join-now) { padding: 0; margin: 0; }

.join-now {
	text-align: center;
	padding: 12px 0 14px 0;
	position: relative;
	background: #00175A;
	color: #fff;
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
}

	.join-now a { text-decoration: underline; color: #fff;}
	
	.join-now-close { color: #fff; position: absolute; width: 40px; height: 40px; border: none; cursor: pointer; right: 5px; top: 2px; background: none; font-size: 2em;}


/* ----------------- */

.hh-flourish { opacity: .4; }

.card-navBG { background: var(--color-bright-blue); border-bottom: 1px solid rgba(255,255,255,.25); }

.explore-close { background: var(--color-bright-blue); border-bottom: 1px solid transparent; }
.explore-link { background-color: var(--color-bright-blue); border-bottom: 1px solid rgba(255,255,255,.25); }
.explore-link-external { background-color: var(--color-white); border-bottom: 1px solid #4f6093; }

.hh-welcomeBG { background: rgba(0,23,90, .7); height: 110px; }
.hhw-text h1 { text-wrap: balance; }

.hf-subhead { color: #AED5F4;}

.acc-head { color: #00175A; }

.benefit-category { border: 1px solid var(--color-bright-blue); border-left: 3px solid var(--color-bright-blue); }
.bc-head { background-color: var(--color-bright-blue); background-image: url(../img/world_service_tile_blue.svg); }

.qs-icons { background-image: linear-gradient(var(--color-bright-blue),var(--color-bright-blue)); }

.ribbonBG { background-image: url(../img/ribbon-light-blue.svg); }
.fb-head {  background-color:#00175A; }

.greyBG { background: var(--color-bright-blue); }

.head-flourish:before { background: url(../img/head-flourish-1.svg) no-repeat; background-position: 100% 10px; background-size: auto 140px; width: 550px; }

.sc-item svg path { fill: var(--color-bright-blue); }

.amex-offersBG { background-color: #00175A; }
.amex-offers  { background-image: url(../img/ribbon-white10.svg); }

.tct-box h2 { color: var(--color-white); background: var(--color-bright-blue); }

.tct-item p:not(:last-child) { margin-bottom: 1em; }

.sc-items { border: 2px solid #00175A; }

.mr-item { background-color: var(--color-bright-blue); }

.shop-and-dine { border: 2px solid var(--color-bright-blue); }

/* small card in sticky nav - all four HTML pages */
.cn-card { background-image: url(../green/img/card-nav.png?v=0); }

/* index.html */
.home-heroBG { background-image:url(../green/img/home-hero.jpg?v=0); }
.not-a-member { background:  var(--color-bright-blue);}

/* desktop-only left column image in MR section on earn-rewards-points.html */
.mi-img {  background-image: url(../green/img/rewards-MRHero.jpg?v=0); }

/* accelerator images on earn-rewards-points.html */
.acc3xDining { background-image:url(../green/img/rewards-3xDining.jpg?v=0); }
.acc3xTransit { background-image:url(../green/img/rewards-3xTransit.jpg?v=0); }
.acc3xTravel { background-image:url(../green/img/rewards-3xTravel.jpg?v=0); }
.acc1xEverythingElse { background-image:url(../green/img/rewards-1xEverythingElse.jpg?v=0); }
.ai-img { background-image: url(../green/img/rewards-1xEverythingElse.jpg?v=0); }

/* feature benefits on discover-your-benefits.html */
.fb-featured1 { background-image:url(../green/img/benefits-featured1.jpg?v=1)}
.fb-featured2 { background-image:url(../green/img/benefits-featured2.jpg?v=1); background-position: bottom center; }

/* send-and-split on set-up-and-payments.html */
.send-and-split-text { background: var(--color-white); color: #00175A; }
.icon-split { background-image: url(../img/icon-split-dark-blue.svg); }
.icon-send { background-image: url(../img/icon-send-dark-blue.svg); }
.send-and-split-text .mri-text .cta-text { background-image: url(../img/arrow.svg); color: #00175A; }
.sas-img { background-image:url(../green/img/setup-sendAndSplit.jpg?v=0) }

@media all and (max-width: 950px) {
	.hhw-text h2 { font-size: calc(1.8rem * .625);}
}

@media all and (max-width: 850px) {
	.fb-head {  background-color: rgba(0,23,90,.8); }
}

@media all and (max-width: 700px) {
	/* discover-your-benefits.html mobile headers for other benefits - desktop versions are on page */
	.ob-forTheExperience { background-image:url(../green/img/benefits-forTheExperience.jpg?v=0); }
	.ob-forASafeJourney { background-image:url(../green/img/benefits-forASafeJourney.jpg?v=0); }
	.ob-forEverydaySecurity { background-image:url(../green/img/benefits-forEverydaySecurity.jpg?v=0); }

	.hh-flourish { opacity: .7; }

	.hhw-text h2 { font-size: calc(1.5rem * .625);}
}

@media (max-width: 500px) {
	.head-flourish:before { background-position: 0 100%; background-size: contain; width: 100%; }
}

@media (width >= 750px) {
	.hh-welcomeBG {
		height: auto !important;
	}

	.hhw-text {
		padding-bottom: 20px;
	}
}