.payments-module .form-payment {
  max-width: 1000px;
}
.payments-module .form .cards {
  float: left;
  margin-bottom: 20px;
}
.payments-module .form .cards input[type='radio'] {
  display: none;
}
.payments-module .form .cards input[type='radio'] + label {
  width: 71px;
  height: 44px;
  border: 2px solid #eee;
  border-radius: 4px;
  display: inline-block;
  cursor: pointer;
  padding: 0;
  margin-right: 5px;
}
.payments-module .form .cards input[type='radio']#cctypev + label {
  background: url('/assets/payments/cc_visa.png') no-repeat;
}
.payments-module .form .cards input[type='radio']#cctypem + label {
  background: url('/assets/payments/cc_mc.png') no-repeat;
}
.payments-module .form .cards input[type='radio']#cctypea + label {
  background: url('/assets/payments/cc_amex.png') no-repeat;
}
.payments-module .form .cards input[type='radio']#cctypepp + label {
  background: url('/assets/payments/cc_pp.png') no-repeat;
}
.payments-module .form .cards input[type='radio']:checked + label {
  border: 2px solid #6cc;
}
.payments-module .form .billing-form #ccname {
  width: 400px;
}
.payments-module .form .billing-form #ccn {
  width: 290px;
  font-family: 'Roboto';
  font-size: 18px;
  font-style: normal;
}
.payments-module .form .billing-form .exp-cont select#exp1 {
  width: 70px;
}
.payments-module .form .billing-form .exp-cont select#exp2 {
  width: 100px;
}
.payments-module .form .billing-form #cvv {
  width: 80px;
  margin-left: 25px;
}
.payments-module .form .pppt_form .submit-btn {
  margin: 40px auto 0 auto;
  text-align: center;
  width: 280px;
  display: block;
}
.payments-module .form .pppt_form .submit-btn:after {
  z-index: 1;
}
.payments-module .form .pppt_form .submit-btn input {
  color: #fff;
  background: transparent;
  font-size: 22px;
  font-family: 'Montserrat', sans-serif;
  font-style: normal;
  text-transform: uppercase;
  font-weight: 600;
  padding: 13px 0;
  cursor: pointer;
  border: none;
  z-index: 2;
  position: relative;
}
.payments-module .form .pppt_form .submit-btn input:hover {
  background-color: transparent;
  color: #66cccc;
}
/* CC CSS */
.payments-module .form .credit-card-box {
  perspective: 1000px;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  -o-perspective: 1000px;
  -ms-perspective: 1000px;
  width: 270px;
  height: 190px;
}
.payments-module .form .credit-card-box:hover .flip,
.credit-card-box.hover .flip {
  -ms-transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
.payments-module .form .credit-card-box .front,
.payments-module .form .credit-card-box .back {
  width: 270px;
  height: 190px;
  border-radius: 15px;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  /*background: -webkit-linear-gradient(315deg, #bd6772, #53223f);*/
  /*background: linear-gradient(135deg, #bd6772, #53223f);*/
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#66cccc+1,6b7ed6+40,374859+70 */
  background: #66cccc; /* Old browsers */
  background: -moz-linear-gradient(-45deg, #66cccc 1%, #6b7ed6 40%, #374859 70%); /* FF3.6-15 */
  background: -webkit-linear-gradient(
    -45deg,
    #66cccc 1%,
    #6b7ed6 40%,
    #374859 70%
  ); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(
    135deg,
    #66cccc 1%,
    #6b7ed6 40%,
    #374859 70%
  ); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66cccc', endColorstr='#374859',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  position: absolute;
  color: #fff;
  font-family: Inconsolata;
  top: 0;
  left: 0;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.3);
}
.payments-module .form .credit-card-box .front::before,
.payments-module .form .credit-card-box .back::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: url('/assets/payments/map.svg') no-repeat center;
  background-size: cover;
  opacity: 0.05;
}
.payments-module .form .credit-card-box .flip {
  -webkit-transition: 0.6s;
  transition: 0.6s;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  position: relative;
}
.payments-module .form .credit-card-box .logo {
  position: absolute;
  top: 9px;
  right: 20px;
  width: 60px;
}
.payments-module .form .credit-card-box .logo img {
  -webkit-filter: invert(1);
  filter: invert(1);
  width: 100%;
  height: auto;
}
.payments-module .form .credit-card-box .front {
  z-index: 2;
  -ms-transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}
.payments-module .form .credit-card-box .back {
  z-index: 1;
  -ms-transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
.payments-module .form .credit-card-box .back .logo {
  top: 185px;
}
.payments-module .form .credit-card-box .chip {
  position: absolute;
  width: 60px;
  height: 45px;
  top: 20px;
  left: 20px;
  background: -webkit-linear-gradient(315deg, #ddccf0 0%, #d1e9f5 44%, #f8ece7 100%);
  background: linear-gradient(135deg, #ddccf0 0%, #d1e9f5 44%, #f8ece7 100%);
  border-radius: 8px;
}
.payments-module .form .credit-card-box .chip::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border: 4px solid rgba(128, 128, 128, 0.1);
  width: 80%;
  height: 70%;
  border-radius: 5px;
}
.payments-module .form .credit-card-box .strip {
  background: -webkit-linear-gradient(315deg, #404040, #1a1a1a);
  background: linear-gradient(135deg, #404040, #1a1a1a);
  position: absolute;
  width: 100%;
  height: 50px;
  top: 30px;
  left: 0;
}
.payments-module .form .credit-card-box .number {
  position: absolute;
  margin: 0 auto;
  top: 85px;
  left: 19px;
  font-size: 29px;
}
.payments-module .form .credit-card-box label {
  padding: 0;
  font-size: 10px;
  letter-spacing: 1px;
  text-shadow: none;
  text-transform: uppercase;
  font-weight: normal;
  opacity: 0.5;
  display: block;
  margin-bottom: 3px;
}
.payments-module .form .credit-card-box .card-holder,
.payments-module .form .credit-card-box .card-expiration-date {
  position: absolute;
  margin: 0 auto;
  top: 130px;
  left: 19px;
  font-size: 16px;
  text-transform: capitalize;
}
.payments-module .form .credit-card-box .card-holder {
  width: 70%;
  overflow: hidden;
}
.payments-module .form .credit-card-box .card-holder label {
  float: left;
  width: 190px;
}
.payments-module .form .credit-card-box .card-holder div {
  text-align: left;
}
.payments-module .form .credit-card-box .card-expiration-date {
  text-align: right;
  left: auto;
  right: 20px;
  float: right;
  width: 20%;
}
.payments-module .form .credit-card-box .ccv {
  height: 15px;
  background: #fff;
  width: 85%;
  border-radius: 5px;
  top: 110px;
  left: 0;
  right: 0;
  position: absolute;
  margin: 0 auto;
  color: #000;
  text-align: right;
  padding: 10px;
  box-sizing: content-box;
}
.payments-module .form .credit-card-box label {
  float: right;
  background: none;
  line-height: 1;
  font-style: normal;
  width: auto;
  font-family: 'Inconsolata';
}
.payments-module .form .credit-card-box .ccv label {
  margin: -25px 0 14px;
  color: #fff;
}
/*IE FIX*/
.payments-module .form .credit-card-box {
  perspective: 1000px;
  -webkit-perspective: 1000px;
  -moz-perspective: 1000px;
  -o-perspective: 1000px;
  -ms-perspective: 1000px;
}
.payments-module .form .credit-card-box .flip {
  transition: 0.5s ease-out;
  -webkit-transition: 0.5s ease-out;
  -moz-transition: 0.5s ease-out;
  -o-transition: 0.5s ease-out;
  -ms-transition: 0.5s ease-out;
  transform-style: preserve-3d;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  -o-transform-style: preserve-3d;
  -ms-transform-style: preserve-3d;
  /* content backface is visible so that static content still appears */
  backface-visibility: visible;
  -webkit-backface-visibility: visible;
  -moz-backface-visibility: visible;
  -o-backface-visibility: visible;
  -ms-backface-visibility: visible;
}
.payments-module .form .credit-card-box.hover .flip {
  transform: rotateY(180deg);
  -webkit-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
}
.payments-module .form .credit-card-box .flip .front,
.payments-module .form .credit-card-box .flip .back {
  /* Backface visibility works great for all but IE. As such, we mark the backface visible in IE and manage visibility ourselves */
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  -ms-backface-visibility: visible;
}
.payments-module .form .credit-card-box .flip .front,
.payments-module .form .credit-card-box.hover .flip .front {
  transform: rotateY(0deg);
  -webkit-transform: rotateY(0deg);
  -moz-transform: rotateY(0deg);
  -o-transform: rotateY(0deg);
  -ms-transform: rotateY(0deg);
}
.payments-module .form .credit-card-box .flip .back,
.payments-module .form .credit-card-box.hover .flip .back {
  transform: rotateY(-180deg);
  -webkit-transform: rotateY(-180deg);
  -moz-transform: rotateY(-180deg);
  -o-transform: rotateY(-180deg);
  -ms-transform: rotateY(-180deg);
}
.payments-module .form .credit-card-box .flip .front,
.payments-module .form .credit-card-box.hover .flip .back {
  /* IE Hack. Halfway through the card flip, set visibility. Keep other browsers visible throughout the card flip. */
  animation: stayvisible 0.5s both;
  -webkit-animation: stayvisible 0.5s both;
  -moz-animation: stayvisible 0.5s both;
  -o-animation: stayvisible 0.5s both;
  -ms-animation: donothing 0.5s;
  -ms-transition: visibility 0s linear 0.17s;
  visibility: visible;
}
.credit-card-box.hover .flip .front,
.credit-card-box .flip .back {
  /* IE Hack. Halfway through the card flip, set visibility. Keep other browsers visible throughout the card flip. */
  animation: stayvisible 0.5s both;
  -webkit-animation: stayvisible 0.5s both;
  -moz-animation: stayvisible 0.5s both;
  -o-animation: stayvisible 0.5s both;
  -ms-animation: donothing 0.5s;
  -ms-transition: visibility 0s linear 0.17s;
  visibility: hidden;
}

.payments-module .form-payment .payment-details {
  border: 1px solid #c3c3c3;
  border-left: none;
  border-right: none;
  padding: 20px 0 4px;
  margin-bottom: 24px;
}
.payments-module .form-payment .payment-details p {
  font-size: 35px;
  font-weight: 400;
  font-family: 'Khand', sans-serif;
  margin: 0;
  padding: 0;
}
.payments-module .form-payment .payment-details label,
.payments-module .form-payment .payment-addons label {
  font-size: 14px;
  font-weight: 700;
  font-family: 'Roboto', sans-serif;
  text-transform: uppercase;
}
.payments-module .form-payment .payment-addons label:not(.form-checkbox) {
  margin-bottom: 20px;
}
.payments-module .form-payment .payment-addons p {
  margin-bottom: 10px;
}
.payments-module .form-payment .payment-addons label span {
  font-size: 16px;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  text-transform: none;
}
.payments-module .form-payment .payment-details.payment-details-green {
  position: relative;
  border: none;
  padding: 20px 0 12px;
  margin-top: 30px;
  margin-bottom: 0;
}
.payments-module .form-payment .payment-details.payment-details-green:before {
  content: '';
  position: absolute;
  width: calc(100% + 96px);
  height: 100%;
  background-color: #66cccc;
  top: 0;
  left: -48px;
  z-index: -1;
}
.payments-module .form-payment .payment-details.payment-details-green p {
  color: #fff;
  font-size: 50px;
  line-height: 58px;
}
@keyframes stayvisible {
  from {
    visibility: visible;
  }
  to {
    visibility: visible;
  }
}
@-webkit-keyframes stayvisible {
  from {
    visibility: visible;
  }
  to {
    visibility: visible;
  }
}
@-moz-keyframes stayvisible {
  from {
    visibility: visible;
  }
  to {
    visibility: visible;
  }
}
@-o-keyframes stayvisible {
  from {
    visibility: visible;
  }
  to {
    visibility: visible;
  }
}
@-ms-keyframes donothing {
  0% {
  }
  100% {
  }
}
/* END CC CSS */
.payments-module .submitProcessing {
  background: #6cc;
  color: #000;
  font-family: 'Montserrat', sans-serif;
  font-style: normal;
  text-transform: uppercase;
  font-weight: 400;
  height: 40px;
  padding: 0 20px;
  cursor: pointer;
  border: none;
  margin-top: 20px;
}
.payments-module .submitProcessing:hover {
  background-color: #6bb;
}
#stripe_error_message,
.payments-module .ui-state-error {
  color: #c00;
}
.payments-module .payment-success {
  color: #090;
}
.payments-module .large-msg {
  font-size: 20px;
  text-align: center;
}
.payments-module .form-payment .payment-details label.form-checkbox {
  margin-top: 18px;
}
.payments-module .form-payment .payment-details.payment-details-green .recurring_payment p {
  font-size: 36px;
  padding-top: 14px;
  line-height: 100%;
}
#totalPaymentOr {
  text-decoration: line-through;
  font-size: 35px;
  line-height: 35px;
  color: #2c3e50;
}
#recurring_payment_old {
  text-decoration: line-through;
  font-size: 25px;
  line-height: 25px;
  color: #2c3e50;
  padding-top: 6px;
  margin-bottom: 1px;
}
@media only screen and (max-width: 1600px) {
  .payments-module .form-payment .payment-details label.form-checkbox {
    margin-top: 14px;
  }
}

@media only screen and (min-width: 768px) and (max-width: 1199px) {
  .payments-module .form .amount-to-pay #item_description {
    width: 100%;
    margin-bottom: 20px;
  }
  .payments-module .form .book_form .form-inner input.medium-field,
  .payments-module .form .book_form .form-inner input.long-field {
    width: 100%;
    box-sizing: border-box;
  }
  .payments-module .form .book_form .form-inner select.medium-field {
    width: 100%;
    margin-bottom: 20px;
  }
  .payments-module .form .billing-form #ccname {
    width: 100%;
  }
  .payments-module .form .billing-form #ccn {
    margin-right: 0;
    width: 290px;
  }
  .payments-module .form .billing-form #cvv {
    margin-right: 0;
    width: 60px;
  }
  .payments-module .form .billing-form .right-col {
    width: 100%;
  }
  .payments-module .form .credit-card-box {
    margin: 0 0 40px 0;
  }
}

@media only screen and (max-width: 992px) {
  .payments-module .form-payment .payment-details.payment-details-green::before {
    width: calc(100% + 48px);
    left: -24px;
  }
}
@media only screen and (max-width: 1200px) {
  .payments-module .form-payment .payment-details p {
    font-size: 32px;
  }
  .payments-module .form-payment .payment-details label.form-checkbox {
    margin-top: 11px;
  }
}

@media only screen and (min-width: 0px) and (max-width: 768px) {
  .payments-module .form .amount-to-pay #item_description {
    width: 100%;
    margin-bottom: 20px;
  }
  .payments-module .form .book_form .form-inner input.medium-field,
  .payments-module .form .book_form .form-inner input.long-field {
    width: 100%;
    box-sizing: border-box;
  }
  .payments-module .form .book_form .form-inner select.medium-field {
    width: 100%;
    margin-bottom: 20px;
  }
  .payments-module .form .billing-form #ccname {
    width: 100%;
  }
  .payments-module .form .billing-form #ccn {
    margin-right: 0;
    width: 210px;
  }
  .payments-module .form .billing-form .exp-cont select#exp1 {
    width: 95px;
  }
  .payments-module .form .billing-form #cvv {
    margin: 20px 0;
    width: 60px;
  }
  .payments-module .form .billing-form .right-col {
    width: 100%;
  }
  .payments-module .form .credit-card-box {
    margin: 0 0 30px;
  }
  .internal_booking_form div.labelCont {
    transform: scale(0.7);
    margin-top: -22px;
  }
  .payments-module .form {
    padding: 65px 0 70px 0;
  }
  .payments-module .form-payment .payment-details label.form-checkbox {
    margin-top: 6px;
  }
  .payments-module .form-payment .payment-details p {
    font-size: 24px;
  }
}
@media only screen and (min-width: 0px) and (max-width: 600px) {
  .payments-module .form-payment .payment-addons label:not(.form-checkbox) {
    margin-bottom: 10px;
  }

  .payments-module .form-payment .payment-addons label span {
    font-size: 14px;
  }

  .internal_booking_form div.labelCont {
    transform: scale(0.7);
    margin-top: -18px;
  }
  .payments-module .form .pppt_form label:not(.form-checkbox) {
    float: none;
    width: 100%;
    box-sizing: border-box;
  }
  .payments-module .form .billing-form #ccn {
    width: 100%;
  }
  .payments-module .form .billing-form #cvv {
    margin: 0 0 25px 0;
  }
  .payments-module .form .cards input[type='radio'] + label {
    margin-right: 0;
  }
}
