/*!*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./sfra-webpack-builder/node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./sfra-webpack-builder/node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./sfra-webpack-builder/node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[3]!./app/page-designer-custom/cartridges/module_pagedesigner_custom/cartridge/client/default/scss/pageDesigner/donationWidget.scss ***!
  \*********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/* Hide helper classes by default */
.hidden {
  display: none; }

.donation-widget {
  max-width: 320px;
  min-width: 320px;
  display: flex;
  flex-flow: column;
  flex-wrap: nowrap;
  background-color: #fff;
  border-radius: 16px;
  padding: 1.8em 1.2em 0em 1.2em;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.16), 0 6px 6px rgba(0, 0, 0, 0.1);
  align-items: center;
  text-align: center; }

/* Tabs */
.gift-types {
  display: flex;
  flex-flow: row;
  flex-wrap: nowrap;
  justify-self: center;
  place-self: center;
  margin: .4em 0;
  padding: 0;
  border: 2px solid #C4C3C3;
  border-radius: 8px;
  justify-content: space-evenly; }
  .gift-types .type-button {
    border: 2px solid transparent;
    border-radius: 8px;
    padding: .6em .4em;
    text-align: center;
    font: normal normal 400 16px / 16px 'gotham-book';
    background-color: transparent;
    transition: all .125s;
    cursor: pointer;
    min-width: 33%; }
    .gift-types .type-button.active {
      font-weight: 700;
      border-radius: 6px;
      border: 2px solid #3062FF;
      background-color: #ECF1FB; }

.amounts-section {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: flex-start;
  justify-content: flex-start;
  gap: 8px;
  margin-top: .4em; }
  .amounts-section .gift-amount {
    width: 31%; }
    .amounts-section .gift-amount button {
      border: 2px solid #C4C3C3;
      width: 100%;
      border-radius: 8px;
      padding: .6em .4em;
      text-align: center;
      font: normal normal 400 16px / 16px 'gotham-book';
      background-color: transparent;
      transition: all .125s; }
      .amounts-section .gift-amount button.active {
        border: 2px solid #3062FF;
        background-color: #ECF1FB; }

.section-oneheader-one,
.section-twoheader-one,
.section-threeheader-one {
  width: 100%;
  text-align: center; }

.section-three {
  padding-bottom: 10px; }

.custom-amount {
  margin-top: 8px;
  border: 2px solid #C4C3C3;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
  width: auto;
  border-radius: 8px;
  padding: .6em .4em;
  text-align: center;
  font: normal normal 400 16px / 16px 'gotham-book';
  background-color: transparent;
  transition: all .125s; }
  .custom-amount input {
    width: 100%;
    margin: 0 8px;
    border: none;
    outline: none;
    font: normal normal normal 16px / 16px 'gotham-book';
    color: #4470DE; }
  .custom-amount span {
    color: #797979;
    font-weight: 700; }

/*buttons*/
.firstButton,
.secondButton,
.backButton {
  text-decoration: none;
  text-align: center;
  padding: 10px;
  border-radius: 8px;
  cursor: pointer;
  font: normal normal bold 16px / 16px 'gotham-book';
  margin-top: 1.6em; }

.firstButton {
  width: 100%; }

.secondButton {
  width: 70%; }

.backButton {
  max-width: 20%;
  padding: 0; }
  .backButton svg {
    margin-top: 1.6em;
    height: 40px; }

.secure-text {
  height: 24px;
  padding: 24px;
  width: 75%;
  text-align: center;
  align-items: center;
  display: flex;
  justify-content: center;
  font: normal normal bold 14px / 16px 'gotham-book';
  letter-spacing: 0px;
  color: #727272;
  margin: auto; }

.headline {
  text-align: center;
  font: normal normal bold 22px / 24px 'gotham-book';
  margin: 0; }

.subheader {
  text-align: center;
  font: normal normal normal 14px / 24px 'gotham-book';
  color: #182543;
  margin: .4em 0; }

.address-fields,
.billing-fields {
  display: flex;
  flex-flow: column;
  flex-wrap: nowrap;
  margin: 0;
  padding: 0;
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  align-items: center; }

/* Message */
#donation-message {
  margin-top: 1rem;
  color: #007b00; }

#fail-message {
  color: #d00; }

.user-info,
.cc-info {
  width: 100%;
  border-radius: 8px;
  border: 2px solid #C4C3C3;
  padding: .6em .4em;
  text-align: center;
  font: normal normal 400 16px / 16px 'gotham-book';
  background-color: transparent;
  transition: all .125s; }
  .user-info.is-invalid,
  .cc-info.is-invalid {
    border: 1px solid #d00; }
  .user-info:active, .user-info:focus,
  .user-info:focus-within .user-info:focus-visible,
  .cc-info:active,
  .cc-info:focus,
  .cc-info:focus-within .user-info:focus-visible,
  .user-info:focus-within
  .cc-info:focus-visible,
  .cc-info:focus-within
  .cc-info:focus-visible {
    font-weight: 700;
    border-radius: 6px;
    border: 2px solid #3062FF;
    background-color: #ECF1FB; }

.half-container {
  width: 100%;
  display: inline-flex;
  justify-content: center; }
  .half-container .half {
    width: 50%; }

.error-container,
.order-error {
  background: pink;
  border-radius: 8px;
  border: 2px solid #d00;
  color: black;
  margin-top: 10px; }


/*# sourceMappingURL=donationWidget.css.map*/