/* Router */

.section-routers .section-content {
	justify-content: center;
}

.section-routers .router {
	width: 70%;
}

@media only screen and (max-width: 1068px) {
	.section-routers .router {
		width: 80%;
	}
}

@media only screen and (max-width: 734px) {
	.section-routers .router {
		width: 100%;
	}
}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
	.tiles-grid .tiles-container .tile.apple-pay {
		min-height: 520px;
	}

	.section-payments .apple-pay .bottom {
		bottom: 75px;
	}
}

@media only screen and (min-width: 735px) {
	.section-routers .section-content .router.apple-pay {
		margin: 0 auto;
	}

	.section-routers .section-content .front-face {
		display: flex;
		align-items: center;
		padding-bottom: 0;
		padding-top: 0;
	}

	.section-routers .section-content .front-face .left {
		height: 100%;
		width: 60%;
		margin: 0 auto;
		padding-top: 60px;
	}

	.section-routers .section-content .front-face .right {
		height: 100%;
		width: 40%;
		padding-top: 90px;
	}

	.section-routers .apple-pay .overview-routers-apple-pay {
		display: block;
		width: var(--p-width);
		height: var(--p-height);
		--p-width: 180px;
		--p-height: 180px;
		position: static;
		left: unset;
		margin-left: 0;
		bottom: unset;
	}
}

/* Ribbon */

.section-hero .ribbon.show {
	display: none;
}

/* Transport and travel section */
@media only screen and (min-width: 1069px) {
	.section-transit-and-tickets .tile-header h2 br {
		display: block;
	}
}

/* fix color display js bug */
.section-identity .tiles-container {
	padding-bottom: 0;
}
.section-identity {
	min-height: unset;
}

/* No physical cards */
.section-payments .no-physical-cards .front-face {
	display: flex;
	justify-content: space-between;
	padding-right: 68px;
	padding-top: 0;
	padding-bottom: 0;
}

@media only screen and (max-width: 1068px) {
	.section-payments .no-physical-cards .front-face {
		padding-right: 66px;
	}
}

@media only screen and (max-width: 734px) {
	.section-payments .no-physical-cards .front-face {
		flex-direction: column;
		padding: 40px 26px 0;
	}
}

.section-payments .no-physical-cards .front-face h3 {
	align-self: center;
}

.section-payments .no-physical-cards .overview-loyalty-and-rewards {
	align-self: flex-end;
	margin: 0;
	display: block;
	width: var(--p-width);
	height: var(--p-height);
	--p-width: 367px;
	--p-height: 648px;
}

@media only screen and (max-width: 1068px) and (max-width: 1068px) {
	.section-payments .no-physical-cards .overview-loyalty-and-rewards {
		--p-width: 250px;
		--p-height: 426px;
	}
}

@media only screen and (max-width: 734px) and (max-width: 734px) {
	.section-payments .no-physical-cards .overview-loyalty-and-rewards {
		--p-width: 200px;
		--p-height: 308px;
		margin-top: 26px;
	}
}

@media only screen and (max-width: 734px) {
	.section-payments .no-physical-cards .overview-loyalty-and-rewards {
		align-self: center;
	}
}

.section-payments .no-physical-cards .overview-loyalty-and-rewards img {
	padding-top: 75px;
}

@media only screen and (max-width: 1068px) {
	.section-payments .no-physical-cards .overview-loyalty-and-rewards img {
		padding-top: 38px;
	}
}

@media only screen and (max-width: 734px) {
	.section-payments .no-physical-cards .overview-loyalty-and-rewards img {
		padding-top: 4px;
	}
}

/* Apple Pay tile */
@media only screen and (min-width: 1069px) and (max-width: 1440px) {
	.section-payments .apple-pay.tile {
		min-height: 757px;
	}
}

@media only screen and (max-width: 734px) {
	.section-payments .apple-pay .front-face {
		padding: 40px 26px 46px;
	}
}

.section-payments .apple-pay .bottom {
	display: flex;
	justify-content: space-between;
	position: absolute;
	bottom: 122px;
	width: 714px;
	left: 50%;
	transform: translateX(calc(-50% + 20px));
}

@media only screen and (max-width: 1068px) {
	.section-payments .apple-pay .bottom {
		width: 502px;
		bottom: 55px;
		transform: translateX(calc(-50% + 13px));
	}
}

@media only screen and (max-width: 734px) {
	.section-payments .apple-pay .bottom {
		transform: translateX(calc(-50% + 5px));
		width: 264px;
		bottom: 56px;
		padding-top: 15px;
		position: relative;
		bottom: auto;
	}
}

.section-payments .apple-pay .bottom > div {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 44px;
}

@media only screen and (max-width: 1068px) {
	.section-payments .apple-pay .bottom > div {
		padding-bottom: 38px;
	}
}

@media only screen and (max-width: 734px) {
	.section-payments .apple-pay .bottom > div {
		padding-bottom: 40px;
	}
}

.section-payments .apple-pay .bottom .overview-icon-in-store-payments {
	display: block;
	width: var(--p-width);
	height: var(--p-height);
	--p-width: 144px;
	--p-height: 164px;
}

@media only screen and (max-width: 1068px) and (max-width: 1068px) {
	.section-payments .apple-pay .bottom .overview-icon-in-store-payments {
		--p-width: 112px;
		--p-height: 128px;
	}
}

@media only screen and (max-width: 734px) and (max-width: 734px) {
	.section-payments .apple-pay .bottom .overview-icon-in-store-payments {
		--p-width: 58px;
		--p-height: 66px;
	}
}

.section-payments .apple-pay .bottom .overview-icon-in-app-payments {
	display: block;
	width: var(--p-width);
	height: var(--p-height);
	--p-width: 180px;
	--p-height: 164px;
}

@media only screen and (max-width: 1068px) and (max-width: 1068px) {
	.section-payments .apple-pay .bottom .overview-icon-in-app-payments {
		--p-width: 138px;
		--p-height: 128px;
	}
}

@media only screen and (max-width: 734px) and (max-width: 734px) {
	.section-payments .apple-pay .bottom .overview-icon-in-app-payments {
		--p-width: 71px;
		--p-height: 66px;
	}
}

.section-payments .apple-pay .bottom .overview-icon-online-payments {
	display: block;
	width: var(--p-width);
	height: var(--p-height);
	--p-width: 142px;
	--p-height: 164px;
}

@media only screen and (max-width: 1068px) and (max-width: 1068px) {
	.section-payments .apple-pay .bottom .overview-icon-online-payments {
		--p-width: 111px;
		--p-height: 128px;
	}
}

@media only screen and (max-width: 734px) and (max-width: 734px) {
	.section-payments .apple-pay .bottom .overview-icon-online-payments {
		--p-width: 57px;
		--p-height: 66px;
	}
}

.section-payments .apple-pay .bottom p {
	text-align: center;
	position: absolute;
	bottom: 0;
	white-space: nowrap;
}

.section-payments .apple-pay .back-face {
	padding-right: 0;
	padding-top: 0;
	padding-bottom: 0;
}

.section-payments .apple-pay .back-face .image-column {
	justify-content: space-around;
}

.section-payments .apple-pay .back-face .overview-back-apple-pay {
	display: block;
	width: var(--p-width);
	height: var(--p-height);
	--p-width: 365px;
	--p-height: 595px;
}

@media only screen and (max-width: 1068px) and (max-width: 1068px) {
	.section-payments .apple-pay .back-face .overview-back-apple-pay {
		--p-width: 236px;
		--p-height: 384px;
	}
}

@media only screen and (max-width: 734px) and (max-width: 734px) {
	.section-payments .apple-pay .back-face .overview-back-apple-pay {
		--p-width: 236px;
		--p-height: 384px;
	}
}
@media only screen and (min-width: 1068px) {
	.section-payments .apple-pay .bottom p {
		bottom: -25px;
	}
}
@media only screen and (max-width: 734px) {
	.section-payments .apple-pay .bottom > div {
		padding-bottom: 70px;
	}

	.section-payments .apple-pay .bottom p {
		bottom: 20px;
	}
}
