/* Stepped Form Styles - Differences in French*/
/* form-main-template-FR.css */

.header-container svg {
  max-width: 130px;
  width: 130px;
}

@media only screen and (min-width: 450px) {
  .header-container svg {
    max-width: 170px;
    width: 170px;
  }
}

@media only screen and (min-width: 768px) {
  .header-container svg {
    max-width: 200px;
    width: 200px;

  }
}

/*FRENCH - dollar sign goes to the right of the amount. */
.custom-radio-buttons .en__field--withOther .en__field__element--radio .en__field__item--other::before {
  left: auto;
  top: 17px;
  right: 17px;
}

/* Form Field Select Option Styles */
.en__field__element--select::after {
  top: 38px;
}

.en__field__element--splitselect .en__field__item::after {
  top: 12px;
}

/* CC Icons */
/*Place them under the CC field for mobile visibility*/
.payment-type-wrapper.no-buttons + .credit-card-icons-wrapper {
  top: 155px;
}

.payment-type-wrapper.show-buttons + .credit-card-icons-wrapper {
  top: 250px;
}

.en__component--formblock .en__field.en__field--ccnumber {
  padding-bottom: 60px;
}

.credit-card-container {
  padding-left: 120px;
}

.credit-card-container h3 { 
  display: inline-block; 
  top: 9px;
}

/* Split CC Expiry */
.en__field--ccexpire .en__field__element--splitselect .en__field__item:nth-of-type(1n):before {
  content: 'Mois';
}

.en__field--ccexpire .en__field__element--splitselect .en__field__item:nth-of-type(2n):before {
  content: 'Ann\00e9 e';
}

.en__field--splittext.en__field--phoneNumber .en__field__item:nth-of-type(2)::before {
  content: 'Poste';
 }

 @media only screen and (min-width: 768px) {
  form .en__error::before {
    padding-right: 8px;
  }

  .en__errorList.error-mobile .en__error {
    padding: 1em 1em 1em 3em;
  }
}

@media only screen and (min-width: 1024px) {
  form .en__errorList {
    width: 50%;
  }

  .en__errorList.error-desktop {
    display: inline-block;
  }

  .en__errorList.error-mobile {
    display: none;
  }
  
  form .en__error {
    margin: 2em 3em 1em;
  }
}

/* ////////////////////////////// */
/* Form Button Styles */
/* ////////////////////////////// */
.en__submit button::after {
  top: 37px;
}

.step-2 .en__submit {
  padding-bottom: 30px;
  padding-top: 30px;
}

@media(min-width:768px) {
  .step-2 .en__submit {
  	padding-bottom: 0;
    padding-top: 20px;
  }
}

.en__submit button {
	height: 75px;
}

/* Donation Summary */
.en__component.donation-summary-wrapper {
  bottom: 40px;
}

@media only screen and (min-width: 768px) {
  .en__component.donation-summary-wrapper {
  	bottom: 0;
 }
}

@media only screen and (min-width: 1024px) {
  .en__component.donation-summary-wrapper {
    bottom: 25px;
  }
}

.en__field--ccvv label::after {
  content: 'Le code de 3-4 chiffres au dos de votre carte';
}

@media only screen and (min-width: 768px) {
	.step-2 .back-link {
    bottom: 69px;
  }
}

@media only screen and (min-width: 1024px) {
  .step-2 .back-link {
    bottom: 67px;
  }
}

/* ////////////////////////////// */
/* Back link */
/* ////////////////////////////// */
@media only screen and (max-width: 767px) {
  .link {
    padding-top: 3em;
  }
}

/*
@media only screen and (min-width: 450px) {
  .en__component--row--1:nth-of-type(1) {
    background-position: bottom;
  }
}
*/
/* form-main-template-FR.css */