.cards {
  overflow: hidden;
  height: 40px;
}

.cards li {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background: url('../images/card_logos.png') no-repeat;
  background-position: 0 0;
  display: block;
  float: left;
  margin-right: 8px;
  text-indent: -9999px;
  width: 51px;
  height: 32px;
}

.cards .visa {
  background-position: 0 0;
}

.cards .dinersclub {
  background-position: -51px 0;
}

.cards .mastercard {
  background-position: -102px 0;
}

.cards .amex {
  background-position: -153px 0;
}

.cards .discover {
  background-position: -204px 0;
}

.cards .visa.off {
  background-position: 0 -32px;
}

.cards .dinersclub.off {
  background-position: -51px -32px;
}

.cards .mastercard.off {
  background-position: -102px -32px;
}

.cards .amex.off {
  background-position: -153px -32px;
}

.cards .discover.off {
  background-position: -204px -32px;
}

form input.valid {
  background: url('../images/tick.png') 360px center no-repeat;
}