/* General */

div#bgscreen,
div#lightbox,
div#modalcontain,
div#progressbar,
div#purchaseflex {
	display: none;
}
div#printable div.noprint {
	display: none !important;
}
div#printable {
	width: 4in;
	margin: 0;
	padding: 0;
	font-family: "Arial", "Helvetica", sans-serif;
}
div#printable div {
	page-break-after: always;
}
div#printable div:last-child {
	page-break-after: avoid;
}

/* Boarding passes */

div#printable div.boardingpass p {
	margin: 0.1972in 0.25in;
	text-align: center;
}
div#printable div.boardingpass p.imgheader {
	margin: 0;
	padding: 0.0903in;
	border-bottom: 0.25pt solid black;
}
div#printable div.boardingpass p.imgheader img {
	height: 0.66in;
}
div#printable div.boardingpass p.pax {
	margin: 0.2243in 0.25in;
}
div#printable div.boardingpass p.pax span:first-child {
	display: block;
	margin: 0;
	text-transform: uppercase;
	font-size: 8pt;
}
div#printable div.boardingpass p.pax span:last-child {
	display: block;
	margin: 0;
	font-size: 18pt;
	font-weight: bold;
}
div#printable div.boardingpass p.paxinfo {
	display: flex;
	justify-content: space-between;
	text-transform: uppercase;
}
div#printable div.boardingpass p.paxinfo > span:first-child {
	text-align: left;
}
div#printable div.boardingpass p.paxinfo > span:last-child {
	text-align: right;
}
div#printable div.boardingpass p.paxinfo span span:first-child {
	display: block;
	font-size: 8pt;
}
div#printable div.boardingpass p.paxinfo span span:last-child {
	display: block;
	font-size: 18pt;
	font-weight: bold;
}
div#printable div.boardingpass p.qr {
	width: 1.6258in;
	height: 1.6258in;
	margin: 0.1972in auto;
	text-align: center;
}
div#printable div.boardingpass p.qr img,
div#printable div.boardingpass p.qr canvas {
	max-width: 1.6258in;
}
div#printable div.boardingpass p.effdate {
	margin: 0 0.25in;
	font-size: 12pt;
	font-weight: bold;
	text-align: center;
}
div#printable div.boardingpass p.ticketnumber {
	margin: 0 0.25in;
	font-size: 10pt;
	text-align: center;
	padding-bottom: 0.21in;
}

/* Receipt */

div#printable div.receipt {
	padding: 0.23in 0.4326in;
}
div#printable div.receipt p.imgheader {
	margin: 0;
	display: flex;
	align-items: end;
	font-size: 16pt;
	justify-content: space-between;
	text-transform: uppercase;
	font-weight: bold;
}
div#printable div.receipt p.imgheader img {
	height: 30pt;
}
div#printable div.receipt p.orderinfo {
	margin: 0.197in 0;
	display: grid;
	justify-content: stretch;
	grid-template-columns: 50% 50%;
}
div#printable div.receipt p.orderinfo span.double {
	grid-column: 1/span 2;
}
div#printable div.receipt p.orderinfo span span:first-child {
	display: block;
	font-size: 8pt;
}
div#printable div.receipt p.orderinfo span span:last-child {
	display: block;
	font-size: 16pt;
	font-weight: bold;
}
div#printable div.receipt p.fareinfo {
	display: grid;
	justify-content: stretch;
	grid-template-columns: 1fr 0fr;
	margin: 0 0 0.1197in 0;
	align-items: end;
}
div#printable div.receipt p.fareinfo > span:first-child span.shortname {
	font-size: 10pt;
	font-weight: bold;
	display: block;
}
div#printable div.receipt p.fareinfo > span:first-child span.longname,
div#printable div.receipt p.fareinfo > span:first-child span.travel {
	font-size: 8pt;
	display: block;
}
div#printable div.receipt p.fareinfo > span:last-child {
	text-align: right;
	font-size: 8pt;
}
div#printable div.receipt p.payment,
div#printable div.receipt p.total {
	display: grid;
	justify-content: stretch;
	grid-template-columns: 1fr 0fr;
	margin: 0 0 0.1197in 0;
	align-items: end;
	font-size: 8pt;
}
div#printable div.receipt p.total {
	font-weight: bold;
}

/* Commuter card */

div#printable div.commutercard {
	position: relative;
	top: 0;
	left: 0;
	padding: 0.235in;
	overflow: hidden;
}
div#printable div.commutercard img.imgbg {
	position: absolute;
	top: -10%;
	left: -10%;
	max-width: 60%;
}
div#printable div.commutercard img.imgheader {
	position: absolute;
	top: 0.235in;
	left: 0.235in;
	height: 0.5in;
}
div#printable div.commutercard p.cardnumber {
	text-align: right;
	font-size: 11pt;
	font-weight: bold;
	line-height: 0.475in;
	margin: 0;
}
div#printable div.commutercard p.qr {
	margin: 0 0 0 auto;
	height: 1.03in;
	width: 1.03in;
}
div#printable div.commutercard p.qr img,
div#printable div.commutercard p.qr canvas {
	max-width: 1.03;
}
div#printable div.commutercard p.rider {
	position: absolute;
	bottom: 0.235in;
	left: 0.235in;
	margin: 0;
	font-size: 11pt;
	font-weight: bold;
}
