:root {
  --blue: #0054a3;
  --font-family-sans-serif: font-family: 'Open Sans', sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
}

body {
	font-family: 'Open Sans', sans-serif;
}

hr {color: #e3e3e3;}

.bridge-blue {background-color: #0054a3;}

.navbar {
	padding-bottom: 0;
}
strong {
	font-weight: bold;
}

.contact {
	width: 250px;
	height: 90px;
	float: right;
	padding: 0;
	padding-top: 20px;
	display: block;
}

.contact h2 {
	color: #fff;
	font-size: 16px;
	font-weight: bold;
	line-height: 22px;
}
.contact h2 i {
	font-size: 36px;
	float: left;
	padding-right: 20px;
	padding-top: 5px;
}

.howitworks h3 {
	font-size: 18px;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: bold;
}

.howitworks {
	font-size: 14px;
}

.howitworks ol {
	padding-left: 15px; !important;
}
.howitworks ol li {
	padding-bottom: 10px;
}

.cta {
	font-weight: bold;
	color: #fff !important;
}
.cta i {
	font-size: 24px;
	padding-right: 20px;
	padding-top: 7px;
}


.cta small {
	font-size: 12pt;
	line-height: 12pt !important;
	padding-bottom: 20px;
	display: block;
}

p.printlink {
	font-size: 14px;
	padding-top: 10px;
	text-align: center;
}

button.redeem {
	font-size: 30px;
	line-height: 28px;
	padding-top: 20px;
	padding-bottom: 20px;
	margin-top: 30px;
	margin-bottom: 30px;
}
button.redeem small {
	font-size: 14px;
	line-height: 15px;
}

.details {
	background-color: #f8f8f8;
	border: #e4e4e4 1px solid;
	padding: 20px;
	}
.details h2 {
	text-align: center;
	font-weight: bold;
	padding-bottom: 7px;
	margin-bottom: 25px;
	display: block;
	border-bottom: #e4e4e4 1px solid;
}
.label-text {
	font-weight: bold;
	font-size: 12px;
	text-transform: uppercase;
	display: block;
}

.details.mobile {
	text-align: center;	
}

.item-name {
	font-size: 20px;
	font-weight: bold;
	margin-top: -3px;
}
.red {color: red;}

.details img.brand {
	max-width: 200px;
	max-height: 80px;
	vertical-align: top;
}

.step {
	text-align: center;
}
.step p {
	margin-top: -10px;
	font-size: 18px;
}
span.step-number {
	display: inline-block;
	margin-top: 30px;
	margin-bottom: 20px;
	background-color: #0054a3;
	height: 30px;
	width: 30px;
	border-radius: 15px;
	color: #fff;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}

.step-number img {
}
.footer {
	padding: 20px;
	background-color: #f1efef;
	font-size: 14px;
	color: #999;
	clear: both;
}
.attributes {
	text-align: left;
	padding: 10px;
}

.spacer25 {
	height: 25px;
	display: block;
	clear: both;
	border: #ddd 1px solid;
}
.spacer20 {
	height: 20px;
	display: block;
	clear: both;
}
.spacer50 {
	height: 50px;
	display: block;
	clear: both;
}
.pos {
	background-color: #d7e9f3;
	border: #afd8f3 1px solid;
	color: #0556a3 !important;
	text-align: left !important;
}

.pos i {
	font-size: 48px;
	padding-bottom: 20px;
}
.navbar-brand .center {
	width: 100%;
	text-align: center !important;	
}
.redeem-button {
	text-align: center;
	margin-top: -10px;
}
.redeem-button i {
	font-size: 36pt;
}


.navbar-brand img {
	max-width: 200px;
	max-height: 55px;
}
.payment-card {
	background-image: url(../img/card-blue.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100%;
	max-width: 320px;
	min-height: 210px;

}

.payment-card .label {
	color: #ffffff;
	font-size: 14px;
	position: relative;
	padding-top: 40px;
	padding-left: 20px;
text-align: left;
opacity: 0.6;
}

.payment-card .cvv {
	color: #ffffff;
	font-size: 14px;
	padding-left: 20px;
	padding-top: 10px;
text-align: left;
	  font-family: Courier, monospace;
	  opacity: 0.6;
}

.payment-card .card-number {
	  font-family: Courier, monospace;
	  font-size: 16px;
	  color: #fff;
	padding-left: 20px;
	margin-top: -2px;
text-align: left;

}
.payment-card .small-number {
	  font-family: Courier, monospace;
	  font-size: 16px;
	  color: #fff;
	padding-left: 20px;
	margin-top: -5px;
text-align: left;

}

.payment-card img.card-logo {
	position: relative;
	top: 15px;
	left: -32px;
	max-width: 190px;
	max-height: 50px;
	text-align: left;
}


.payment-card img.card-issuer-logo {
	position: relative;
	top: -60px;
	right: 10px;
	max-width: 80px;
	max-height: 80px;
	text-align: right;
	float: right;
}

.payment-card .value {
	float: right;
	color: #ffffff;
	position: relative;
	top: 13px;
	right: 40px;
	text-align: left;
}

.payment-card .value .value-label {
	color: #ffffff;
	font-size: 14px;
	text-align: left;
	opacity: 0.6;
}
.payment-card .value .value-amount {
	color: #ffffff;
	font-size: 24px;
	font-weight: bold;
	text-align: left;
	margin-top: -5px;
}

.prominent-details {
	clear: both;
	display: block;
	position: relative;
	top: -30px;
}

img.barcode {
	max-width: 385px;
	height: auto;
	text-align: center !important;
}

.prominent-details .card-number {
	  font-family: Courier, monospace;
	  font-size: 24px;
  }

.prominent-details .cvc .label {
	font-weight: bold;
	color: #666666;
	margin-top: 30px;
}

span.cvc-number {
	font-family: Courier, monospace;
	font-size: 24px;
	font-weight: bold;
	padding-left: 10px;
	color: #000;
	line-height: 10px;

}

.terms {
	display: block;
	padding: 15px;
	border: 1px solid #ccc;
	background-color: #fff;
	font-style: italic;
	font-size: 14px;
	margin-top: 30px;
}





.payment-card-s3 {
	background-image: url(../img/card-s3.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100%;
	max-width: 320px;
	min-height: 210px;

}

.payment-card-s3 .label {
	color: #ffffff;
	font-size: 14px;
	padding-top: 70px;
	padding-left: 20px;
text-align: left;
opacity: 0.6;
}

.payment-card-s3 .cvv {
	color: #ffffff;
	font-size: 14px;
	padding-left: 20px;
	padding-top: 10px;
text-align: left;
	  font-family: Courier, monospace;
	  opacity: 0.6;
}

.payment-card-s3 .card-number {
	  font-family: Courier, monospace;
	  font-size: 16px;
	  color: #fff;
	padding-left: 20px;
	margin-top: -2px;
text-align: left;

}
.payment-card-s3 .small-number {
	  font-family: Courier, monospace;
	  font-size: 16px;
	  color: #fff;
	padding-left: 20px;
	margin-top: -7px;
text-align: left;

}





/* do we n eed this? 
.payment-card-print {
	background-image: url(../img/card-visa2.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100%;
	max-width: 500px;
	min-height: 330px;

}

.payment-card-print .label {
	color: #ffffff;
	font-size: 18px;
	padding-top: 130px;
	padding-left: 30px;
text-align: left;
opacity: 0.6;
}

.payment-card-print .cvv {
	color: #ffffff;
	font-size: 18px;
	padding-left: 30px;
	padding-top: 10px;
text-align: left;
	  font-family: Courier, monospace;
	  opacity: 0.6;
}

.payment-card-print .card-number {
	  font-family: Courier, monospace;
	  font-size: 28px;
	  color: #fff;
	padding-left: 30px;
	margin-top: -2px;
text-align: left;

}
.payment-card-print .small-number {
	  font-family: Courier, monospace;
	  font-size: 18px;
	  color: #fff;
	padding-left: 30px;
	margin-top: -7px;
text-align: left;

}




.payment-card-print-s3 {
	background-image: url(../img/card-s3.png);
	background-repeat: no-repeat;
	background-position: left top;
	background-size: 100%;
	max-width: 500px;
	min-height: 330px;

}

.payment-card-print-s3 .label {
	color: #ffffff;
	font-size: 18px;
	padding-top: 130px;
	padding-left: 30px;
text-align: left;
opacity: 0.6;
}

.payment-card-print-s3 .cvv {
	color: #ffffff;
	font-size: 18px;
	padding-left: 30px;
	padding-top: 10px;
text-align: left;
	  font-family: Courier, monospace;
	  opacity: 0.6;
}

.payment-card-print-s3 .card-number {
	  font-family: Courier, monospace;
	  font-size: 28px;
	  color: #fff;
	padding-left: 30px;
	margin-top: -2px;
text-align: left;

}
.payment-card-print-s3 .small-number {
	  font-family: Courier, monospace;
	  font-size: 18px;
	  color: #fff;
	padding-left: 30px;
	margin-top: -7px;
text-align: left;

}

*/


.sidebar {
	color: #666666 !important;
}







.toprule-gray {
	display: block;
	padding-top: 5px;
	border-top: #999 1px dotted;
	margin-top: 20px;
}

@media (min-width: 768px) {
	.phone {
		display: none;
	}
	.show-print {
		display: none;
	}


}


/* Accordion */
.accordion > .card:last-of-type {
	border-radius: 10px !important;
	background-color: #e8e5e5;
}

.accordion.useful-dropdown .btn-link {
	font-weight: bold;
	color: #666666;
}
.accordion.useful-dropdown .btn-link:hover {
	text-decoration: none;;
}
.card-body {
	background-color: #fff;
}
.details h2 {
	border-bottom: none;
}
.accordion.useful-dropdown > .card .card-header {
	margin-bottom: 0;
}
.accordion.useful-dropdown .accordion-icon {
	float: right;
}
.accordion.useful-dropdown .card-body {border-bottom: 1px solid rgba(0, 0, 0, 0.125)}


@media (max-width: 768px) {

	.details h2 {
		font-size: 24px;
		letter-spacing: 0;
		text-align: center;
	}
	h2.card-heading {
		font-size: 18px;
		text-transform: uppercase;
		letter-spacing: 2px !important;
	}
	
	.label-text {
		display: block;
		color: #888888;
	}
	.item-name {
		margin-top: none;
	}
	.details img.brand {
		margin-left: 0;
		max-width: 200px;
		max-height: 80px;
	}
	.contact {
		width: 250px;
		height: 80px;
		padding: 0;
		margin-top: 10px;
		padding-top: 10px;
		padding-left: 30px;
		display: block;
		color: #000000;
	}
	.contact h2 {
		color: #fff;
		font-size: 18px;
		font-weight: bold;
		line-height: 22px;
		margin-top: -10px;
	}
	.contact h2 i {
		font-size: 36px;
		float: left;
		padding-right: 10px;
		padding-top: 2px;
	}
	.show-print {
		display: none;
	}

}

@media only print {
	.hide-print {
		display: none;
	}
	.show-print {
		display: inline;
	}
	.phone {
		display: block;
	}
	.payment-card {
		background-image: none;;
		border: 2px solid #000;
		border-radius: 20px;
	}
	.payment-card .label {
		color: #000;
	}
	
	.payment-card .cvv, .payment-card .small-number {
		color: #000;
	}

	.payment-card .value {
		color: #000;
	}
	
	.payment-card .value .value-label, .payment-card .card-number {
		color: #000;
	}
	.payment-card .value .value-amount {
		color: #000;
	}

	.col-md-8 {
		-ms-flex: 0 0 66.666667%;
		flex: 0 0 66.666667%;
		max-width: 66.666667%;
	}

	.col-md-4 {
		-ms-flex: 0 0 33.333333%;
		flex: 0 0 33.333333%;
		max-width: 33.333333%;
	}
}

	

}