@charset "UTF-8";
/*
    PLEASE NOTE!

    If you make a change to this file, talk to Systems/Infrastructure to do the following:
    1) Upload the new file to replace the existing one in the "emma-static-cdn" S3 bucket.
    2) Bust the cache on this file in the Cloudfront instance in front of that S3 bucket.

    Requests to "https://app.e2ma.net/css/signup-refresh.sml.css" redirect
    to "static-cdn.e2ma.net" which is an alias for the Cloudfront instance
    in front of "emma-static-cdn."

    Non-production requests still serve from their non-production app servers.
    No upload or cache busting necessary for non-production changes to appear.

*/
/* Controls width of your form */
.e2ma_signup_form {
    box-sizing: border-box;
    font-family: proxima-nova, Helvetica, Arial, sans-serif;
    margin: auto;
    max-width: 100%;
    padding: 0 15px;
    width: 180px;
}

/* Mobile optimization */
@media only screen and (max-device-width: 320px) {
    .e2ma_signup_form {
        width: 100%;
    }
}

/* Controls the style, width, and font style of the text input, select and textarea fields */
.e2ma_signup_form input[type=text],
.e2ma_signup_form input[type=email],
.e2ma_signup_form textarea,
.e2ma_signup_form select[multiple=multiple] {
    box-sizing: border-box;
    border: 1px solid #B8BCC2;
    color: #84878E;
    font-family: proxima-nova, Helvetica, Arial, sans-serif;
    font-size: 13px;
    height: 36px;
    padding: 5px;
    width: 100%;
}

/* Prevents auto-zooming of page and form elements when filling out the form */
@media only screen and (max-device-width: 320px) {
    .e2ma_signup_form input[type=text],
    .e2ma_signup_form input[type=email],
    .e2ma_signup_form textarea,
    .e2ma_signup_form select[multiple=multiple],
    .e2ma_signup_form select,
    .e2ma_signup_form select:focus {
        font-size: 1rem;
    }
}

.e2ma_signup_form input[type="text"]:focus,
.e2ma_signup_form input[type="email"]:focus,
.e2ma_signup_form textarea:focus,
.e2ma_signup_form select[multiple=multiple]:focus {
    border: 1px solid #46AFD8;
    outline: none;
}

.e2ma_signup_form textarea {
    min-height: 138px;
}

.e2ma_signup_form select {
    max-width: 180px;
}

.e2ma_signup_form select[multiple=multiple] {
    height: 72px;
    padding-left: 0;
}

/* Controls width, style, and padding of the table border outlines around individual member fields */
.e2ma_signup_form_row {
    margin-bottom: 5px;
}

/* Controls alignment and display of image in welcome message */
.e2ma_signup_image_container {
    text-align: center;
}

/* Mobile optimization for images */
.e2ma_signup_image_container > img {
    display: block;
    height: auto !important;
    margin: auto auto 18px;
    max-width: 100% !important;
}

/* Controls border around signup image (when image is linked) */
.e2ma_signup_image {
    border: 0;
}

/* Controls style and formatting of welcome message */
.e2ma_signup_message {
    color: #84878E;
    font-size: 14px;
    line-height: 20px;
}

/* Controls style and formatting of form field labels (first name, last name, etc.) */
.e2ma_signup_form_label {
    color: #40454F;
    font-size: 14px;
    font-weight: 600;
    min-width: 150px;
    padding-top: 10px;
}

/* Controls spacing and style for any text used to list options under multiple choice fields) */
.e2ma_signup_form_element, .e2ma_signup_form_element select:nth-child(3) {
    margin-top: 5px;
}

/* Removes the bullets to the left of list items on the sign up pages */
.e2ma_signup_form_element li {
    color: #40454f;
    font-size: 13px;
    list-style: none;
}

.e2ma_signup_form_element ul {
    padding-left: 0;
    margin: 5px 0 0;
}

/* For signup screens that are set to allow people to select which audience groups they'd like to join: Controls style for "Select your interests..." text */
.e2ma_signup_form_group_label {
    color: #40454F;
    font-size: 14px;
    font-weight: 600;
    min-width: 150px;
    padding-top: 10px;
}

/* For signup screens that are set to allow people to select which audience groups they'd like to join: Controls style and spacing for groups displayed as options */
.e2ma_signup_form_groups {
    margin-bottom: 10px;
}

/* Controls the style and spacing of the word "required" and border surrounding that text */
.e2ma_signup_form_required_footnote {
    color: #40454F;
    font-size: 13px;
    margin: 10px 0 5px 0;
}

/* Controls the color of the asterisk that indicates a field is required */
.e2ma_signup_form_required_asterix {
    color: #E96058;
}

/* Controls the alignment of "submit" button */
.e2ma_signup_form_button_row {
    margin: 10px 0;
    padding: 10px 0;
    text-align: left;
}

/* Precautionary step to ensure "clear" button no longer displays on forms */
.e2ma_signup_form_button_row #e2ma_signup_reset_button.e2ma_signup_form_button {
    display: none;
}

/*Overrides mobile browser default settings for button styles (for additional control of "submit" button) */
.e2ma_signup_form input[type=submit],
.e2ma_signup_form .e2ma_signup_form_button {
    -webkit-appearance: none;
    -webkit-border-radius: 0;
    border-radius: 0;
}

/*Overrides browser default settings for button styles (for additional control of "submit" button) */
.e2ma_signup_form_button {
    background-color: #B8BCC2;
    border: none;
    color: white;
    font-size: 12px;
    font-weight: 600;
    height: 24px;
    padding: 0 18px;
    text-transform: uppercase;
}

.e2ma_signup_form_button:hover {
    background-color: #9B9EA3;
    cursor: pointer;
}

.e2ma_signup_form_group_list {
    color: #40454f;
    font-size: 13px;
    margin-top: 5px;
}