/* =================================================================
    eCoupon Form
================================================================= */
.e-coupon-container {
    padding: 0 0 1.5rem 1.5rem;
    background-color: transparent;
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 100%;
    margin: 1rem 0;
}
.e-coupon-form {
    background-color: transparent;
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 0;
}
.e-coupon-container > .success {
    display: none;
    width: 100%;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 1rem;
    padding-bottom: 1rem;
    font-weight: 700;
    color: var(--brand-primary-opal);
    flex: 0 0 100%;
}
.e-coupon-container > .e-coupon-form > .error {
    display: none;
    color: var(--brand-tertiary-fire-opal);
    font-size: 1rem;
    padding-left: 15px;
    font-weight: 700;
    width: 100%;
    flex-grow: 1;
    order: 2;
}
.e-coupon-container > .e-coupon-form > .email-input {
    font-family: "Open Sans","Arial",sans-serif;
    padding: 7px 15px;
    min-height: 50px;
    max-height: 50px;
    border: 1px solid rgb(204, 204, 204);
    margin-bottom: 0;
    margin-right: 1rem;
    width: auto;
    border-radius: 0.85rem;
}
.e-coupon-container .e-coupon-form label {
    flex: 0 1 100%;
    font-weight: 700;
    padding-bottom: 0.5rem;
}
.e-coupon-container .e-coupon-form .email-input::-webkit-input-placeholder,
.e-coupon-container .e-coupon-form .email-input:-moz-placeholder,
.e-coupon-container .e-coupon-form .email-input::-moz-placeholder,
.e-coupon-container .e-coupon-form .email-input:-ms-input-placeholder,
.e-coupon-container .e-coupon-form .email-input::-ms-input-placeholder,
.e-coupon-container .e-coupon-form .email-input::placeholder {
    font-style: italic;
}
.e-coupon-container .e-coupon-form .primary-button {
    text-transform: none;
    font-size: 1rem;
    height: 100%;
    min-height: 35px;
    max-height: 50px;
    border: 0;
    color: #fff;
    width: auto;
    cursor: pointer;
    border-radius: 2rem;
    padding: 0.75rem 1.5rem;
    font-weight: 700;
}
/* FT Blue */
.e-coupon-container .e-coupon-form .primary-button--opal {
    background-color: var(--brand-primary-opal);
    color: var(--brand-primary-marble);
    border: 0.125rem solid var(--brand-primary-opal);
}
/* FT Green */
.e-coupon-container .e-coupon-form .primary-button--ftgreen {
    background-color: var(--color-ftgreen);
    color: var(--brand-primary-marble);
    border: 0.125rem solid var(--color-ftgreen);
}
/* Topaz */
.e-coupon-container .e-coupon-form .primary-button--topaz {
    background-color: var(--brand-secondary-topaz);
    color: #000;
    border: 0.125rem solid var(--brand-secondary-topaz);
}
/* Azurite */
.e-coupon-container .e-coupon-form .primary-button--azurite {
    background-color: var(--brand-secondary-azurite);
    color: var(--brand-primary-marble);
    border: 0.125rem solid var(--brand-secondary-azurite);
}
/* Ghost */
.e-coupon-container .e-coupon-form .primary-button--ghost {
  background-color: transparent;
  color: var(--brand-secondary-lapis);
  border: 0.125rem solid var(--brand-secondary-lapis);
}
@media only screen and (min-width: 56.25em) {
    .e-coupon-container .e-coupon-form .primary-button--opal:hover,
    .e-coupon-container .e-coupon-form .primary-button--opal:focus {
        background-color: var(--color-ftgreen);
        color: var(--brand-primary-marble);
        border: 0.125rem solid var(--color-ftgreen);
    }
    .e-coupon-container .e-coupon-form .primary-button--ftgreen:hover,
    .e-coupon-container .e-coupon-form .primary-button--ftgreen:focus {
        background-color: var(--color-ftgreen);
        color: var(--brand-primary-marble);
        border: 0.125rem solid var(--color-ftgreen);
    }
    .e-coupon-container .e-coupon-form .primary-button--topaz:hover,
    .e-coupon-container .e-coupon-form .primary-button--topaz:focus {
        background-color: var(--brand-secondary-azurite);
        color: var(--brand-primary-marble);
        border: 0.125rem solid var(--brand-secondary-azurite);
    }
    .e-coupon-container .e-coupon-form .primary-button--azurite:hover,
    .e-coupon-container .e-coupon-form .primary-button--azurite:focus {
        background-color: var(--brand-secondary-lapis);
        color: var(--brand-primary-marble);
        border: 0.125rem solid var(--brand-secondary-lapis);
    }
    .e-coupon-container .e-coupon-form .primary-button--ghost:hover,
    .e-coupon-container .e-coupon-form .primary-button--ghost:focus {
        background-color: var(--color-ftgreen);
        color: var(--brand-primary-marble);
        border: 0.125rem solid var(--color-ftgreen);
    }
}
.e-coupon-container > .e-coupon-form > .primary-button[disabled="disabled"] {
    background-color: var(--brand-secondary-moonstone);
    color: var(--brand-primary-marble);
    cursor: wait;
}
@media only screen and (min-width: 768px){
    .e-coupon-container > .e-coupon-form {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    .e-coupon-container > .e-coupon-form > .email-input,
    .e-coupon-container .e-coupon-form .primary-button {
        flex: 1;
    }
}
@media only screen and (max-width: 767px) {
    .e-coupon-container {
        flex-direction: column;
        width: 100%;
    }
    .e-coupon-container > .e-coupon-form {
        display: flex;
        flex-flow: column;
        width: 100%;
        justify-content: space-between;
        margin-bottom: 0;
        margin-top: 0;
    }
    .e-coupon-container > .e-coupon-form > .email-input {
        margin-bottom: 1rem;
        margin-right: 0;
    }
    .e-coupon-container > .e-coupon-form > .submit {
        width: 100%;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Momentum */
.momentum .e-coupon-container {
    padding: 0 0 1.5rem 1.5rem;
    background-color: transparent;
    display: flex;
    justify-content: center;
    flex-direction: column;
    width: 100%;
}
.momentum .e-coupon-container > .e-coupon-form > .email-input {
    font-family: "Open Sans","Arial",sans-serif;
    padding: 7px 15px;
    min-height: 50px;
    border: 1px solid rgb(204, 204, 204);
    max-width: 320px;
    margin-bottom: 0;
    margin-right: 1rem;
    width: 100%;
    border-radius: 0.85rem;
}
.momentum .e-coupon-container .e-coupon-form .submit {
    text-transform: none;
    font-size: 1rem;
    height: 100%;
    min-height: 35px;
    border: 0;
    color: #fff;
    width: auto;
    max-width: 320px;
    cursor: pointer;
    border-radius: 2rem;
    padding: 0.75rem 1.5rem;
    border: 2px solid var(--brand-secondary-azurite);
    color: var(--brand-secondary-azurite);
    background: transparent;
    font-weight: 700;
}
.momentum .e-coupon-container .e-coupon-form .submit:hover,
.momentum .e-coupon-container .e-coupon-form .submit:focus {
    background: var(--color-ftgreen) !important;
    border: 2px solid var(--color-ftgreen) !important;
    color: var(--brand-primary-marble) !important;
}