@font-face {
  font-family: 'icons';
  src: url("fonts/icomoon.woff") format('woff'), url("fonts/icomoon.ttf") format('truetype'), url("fonts/icomoon.otf") format('opentype'), url("fonts/icomoon.eot") format('embedded-opentype');
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.cardhold_name {
  width: 50%;
  float: left;
  padding-right: 5%;
  padding-top: 1px;
  padding-bottom: 1px;
}
#edit_cardhold_name {
  width: 50%;
  float: left;
  margin-left:20px;

}
.cardhold_phone {
  width: 45%;
  float: left;
  padding-top: 1px;
  padding-bottom: 1px;
  text-align:right;
}
/*.ccrow{
	margin-bottom:5px;
	border: 1px solid red;
}*/
.card-bounding{
  width: 100%;
  /*max-width: 50%;*/
  top:50%;
  padding: 10px;
  border: 1px solid #999999;
  /*font-family: 'Roboto';*/
  background: #ffffff;
  display: block;
}

/*.card-bounding aside{
  font-size:16px;
  border: 1px solid red;
  padding-top: 8px;
}*/
.card-container {
  width: 100%;
  position: relative;
  box-sizing: border-box;
  border: 1px solid #ccc;
  margin: 0px 0px 15px auto;
}
.card-container input {
  width: 100%;
  letter-spacing: 1px;
  font-size: .75rem;
  padding: 10px 12px 12px 1px;
  border: 0;
  outline: none;
  box-sizing: border-box;
}
.card-type {
  width: 65px;
  height: 41px;
  background: url("images/blankcc.png");
  background-repeat: no-repeat;
  position: absolute;
}
.card-type.mastercard {
  background: url("images/mastercard.png");
  width: 63px;
  height: 41px;
}
.card-type.visa {
  background: url("images/visa.png");
  width: 66px;
  height: 41px;
}
.card-type.amex {
  background: url("images/amex.png");
  width: 62px;
  height: 41px;
}
.card-type.discover {
  background: url("images/discover.png");
   width: 67px;
  height: 41px;
}
.card-valid {
  position: absolute;
  top: 0;
  right: 15px;
  line-height: 40px;
  font-size: 20px;
  font-family: 'icons';
  color: #ccc;
}
.card-valid.active {
  color: #42ca7c;
}
.card-details {
  width: 100%;
  text-align: left;
  margin: 10px 10px 10px auto;
  padding-top: 0px;
  transition: 300ms ease;
}
.card-details-temp input {
  font-size: 12px;
  /*padding: 12px;*/
  box-sizing: border-box;
  width: 100%;
}
.card-details input.error {
  border: 1px solid #c2313c;
  box-shadow: 0 4px 8px 0 rgba(238,76,87,0.3);
  outline: none;
}
.expiration-temp {
  width: 100%;
  float: none;
  padding-right: 0%;
  margin-top: 5px;
}
.expirylabel-temp{
 	padding-bottom:10px;
 }
 .expirydiv-temp {
 	margin-top: 10px;
 }
 .cvvPositioning{
 	padding-left: 65px;
 	 width: 80px;
 }
 #cvv{
  width:60px;
}

.cvvdiv{
  float:right;
  width:150px;
}
#cc_exp_mth {
  width: 50px;
}
#cc_exp_yr {
  width: 50px;
}
.cardTable{
	 border: 2px;
	 width: 100%;
     text-align:center;
     border: 0px;
     border-collapse: collapse;
 }
 .cardTable td.ccradiotd {
	 text-align:left;
	 vertical-align: middle;
     width: 30%;
     padding-left: 25px;
 }
 .cardTable td.ccradionumtd {
     text-align:left;
	 vertical-align: middle;
     width: 10%;
 }

 .cardTable  td.cvvneededtd {
     vertical-align: middle;
     width: 10%;
 }
 .cardTable  td.ccnametd {
     vertical-align: middle;
     width: 30%;
 }
 .cardTable  td.ccexpirytd {
     vertical-align: middle;
     width: 10%;
 }
 .expiredspan {
 	color: red;
 }
 .ccinput-error {
 	border: 1px solid red;
 }
.cardTable td.ccdeletetd {
       vertical-align: middle;
       width: 10%;
 }
.input-disabled{background-color:#eeeeee;border:1px solid #ABADB3;padding:2px 1px;}
:-moz-submit-invalid {
  box-shadow: none;
}
:-moz-ui-invalid {
  box-shadow:none;
}
 .card-clr-on {
   background-color:rgba(0,0,0,.18);
 }