body {
	background-color: #716659;
}


.logo {
  width: 100%;
  text-align: left;
  background-color: white;
}

.wrapper-body {
	margin: 30px;
	color: white;
}

.card-background {
	width: 450px;
	height: 250px;
	-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px; /* future proofing */
-khtml-border-radius: 10px; /* for old Konqueror browsers */
background-color: #116DBE;
color: #FFFFFF;
}

.card-value {
	padding: .6em 0 0 9.5em;
	font-size: 28px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
}

.card-number {
	margin: 3em 0 .1em 0em;
	padding: .5em 0 .3em 1em;
	background-color: #C6D4ED;
	color: #000000;
	font-size: 22px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	line-height: .7em;
}

.card-type {
	color: #EC272B;
}

.card-number-smalltext {
	padding: 0 0 0 0;
	color: #000000;
	font-size: 8px;
	font-family: Arial, Helvetica, sans-serif;
}

.valid-thru-text {
	float:right;
	color: #000000;
	font-size: 15px;
	padding: 1em 1em 0 20em;
}

.card-verification {
	float: left;
	width: 75px;
	margin: 0 0 .1em 1em;
	padding: .4em .3em .2em .4em;
	background-color: #C6D4ED;
	color: #000000;
	font-size: 22px;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	line-height: .7em;
}

.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }