body.sp-checkout-modal-open {
    margin: 0; height: 100%; overflow: hidden;
}

.page-load-error {
    width: 896px;
    margin: auto;
    padding-top: 10px;
    padding-bottom: 10px;
    display: none;
}

.donation-form-container.responsive #select_grid_row {
    display: none;
}

.checkout-input-field {
    width: 250px;
    font-weight: bold;
    color: #181818;
    line-height: 3em;
    font-size: 18px;
    border-top: 0;
    margin: 0;
    padding: 0;
}

.checkout-drop-down {
    appearance: auto !important;
}

.checkout-label {
    padding-left: 15px !important;
}

div.donation-form-container.responsive {
    background: inherit;
    border: none;
    padding: 0px;
    color: inherit;
    font-family: inherit;
    font-size: inherit;
    margin: auto;
    width: 896px;
}
.donation-form-container.responsive .form-content {
    margin: 0;
    padding: 0;
    width: 100%;
}
.donation-form-container.responsive h2.section-header-container,
.donation-form-container.responsive #level_standard_row .FormLabelText,
.donation-form-container span.FormLabelText {
    color: #181818;
    line-height: 3em;
    font-size:18px;
    font-weight:700;
    border-top: 0;
    margin: 0;
    padding: 0;
}
.donation-form-container.responsive h1.donation-headline {
    max-width: 600px;
    font-weight: 700;
    margin: 20px 0px;
}
/* Input and Label Styles */
.donation-form-container.responsive div.form-row div.form-content > input[type="text"] {
    -webkit-border-radius: 2px 2px 2px 2px;
    -moz-border-radius: 2px 2px 2px 2px;
    border-radius: 2px 2px 2px 2px;
    color: #1c1c1c;
    background-color: #FFFFFF;
    border: 1px solid rgb(180, 180, 180);
    outline: none;
    padding: 5px 0px 5px 5px;
    margin: 5px 1px 3px 0;
    font-size: 1em;
    font-weight: 500;
    box-shadow: inset 0px 0px 1px 0px rgba(97,99,101,0.54), inset 1px 1px 4px 0px rgba(215,215,215,0.85);
    width: 94%;
    max-width: 620px;
    height: 44px;
    line-height: 40px;
}
.donation-form-container.responsive div.form-row div.form-content > input[type="text"]:focus {
    border-color: #1c1c1c;
}

/* Donation Levels */
.donation-form-container.responsive .don-standard-levels {
    min-height: 180px;
}
.donation-form-container.responsive #level_standard_row .field-required {
    display: none;
}
.donation-form-container.responsive .form-donation-level .form-content {
    margin: 0;
    height: inherit;
}
.donation-form-container.responsive .donation-levels {
    position: relative;
    height: 95px;
    clear: both;
    padding-top: 10px;
}
.donation-form-container.responsive .donation-level-container {
    border: none;
    margin: 0 10px 10px 0;
    width: 125px;
    float: left;
}

div.gift-type-container .gift-type-button {
    height: 60px;
    float: left;
    margin-right: 10px;
}
.donation-form-container.responsive .donation-level-input-container,
.donation-form-container.responsive .generic-repeat-label-checkbox-container {
    padding: 0;
}
.donation-form-container.responsive .donation-level-input-container {
    height: 95px;
}
.donation-form-container.responsive .donation-level-label-input-container {
    float: left;
}
.donation-form-container.responsive .donation-level-container.other-field .form-content .donation-level-input-container > label {
    float: right;
    margin-right: 0px;
}
.donation-form-container.responsive .donation-levels input[type="radio"],
.donation-form-container.responsive .donation-level-label-input-container {
    text-indent: -9999px;
    height: 0;
    width: 0;
}
.donation-form-container.responsive .donation-level-label-container {
    line-height: 35px;
    align-self: center;
}
.donation-form-container.responsive .donation-level-input-container label.donation-level-selector {
    float: left;
    clear: none;
    background-color: #CCCCCC;
    background-image: none;
    border-radius: 4px 4px 4px 4px;
    color: #333333;
    cursor: pointer;
    font-size: 1.7em;
    margin-right: 1%;
    padding-left: 0;
    text-align: center;
    vertical-align: middle;
    width: 125px;
    height: 95px;
    line-height: 95px;
    font-weight: 700;
    display: flex;
    justify-content: center;
}
.donation-form-container.responsive .donation-level-input-container label:hover {
    background-color: #DDDDDD;
}
.donation-form-container.responsive .gift-type-container {
    height: 40px;
    border: 0;
    margin-bottom: 15px;
}
.donation-form-container.responsive .sustaining-frequency-container,
.donation-form-container.responsive .sustaining-duration-container {
    float: left;
    clear: left;
    margin-top: 10px;
    margin-bottom:10px;
}
div.form-row.form-selectlist .form-content select {
    padding: 2px 25px 2px 7px;
}
.donation-form-container.responsive .gift-type-container label.gift-type-label {
    float: left;
    clear: none;
    background-color: #CCCCCC;
    background-image: none;
    border-radius: 4px 4px 4px 4px;
    color: #333333;
    cursor: pointer;
    font-size: 1.7em;
    margin-right: 1%;
    padding-left: 0;
    text-align: center;
    vertical-align: middle;
    min-height: 30px;
    justify-content: center;
    white-space: nowrap;
    padding: 10px;
}
.donation-form-container.responsive .gift-type-container button.gift-type-button {
    background-color: #cccccc;
    border-radius: 4px 4px 4px 4px;
    margin-right: 10px;
}
.donation-form-container.responsive .donation-level-input-container label.selected,
.donation-form-container.responsive .donation-level-input-container .selected,
.donation-form-container.responsive .gift-type-container label.selected,
.donation-form-container.responsive .donation-level-input-container .selected:hover {
    background-color: #1D8FD7;
}
.donation-form-container.responsive .other-field {
    width: 100%;
    position: absolute;
    left: 0;
}
.donation-form-container.responsive label + .donation-level-user-entered {
    float: left;
    margin-left: 0;
}
.donation-form-container.responsive .donation-level-user-entered {
    position: relative;
    display: none;
}
.donation-form-container.responsive .donation-level-user-entered input[type="text"] {
    position: relative;
    top: -10px;
    height: 95px;
    font-size: 3.3em;
    text-indent: 1.5em;
    width: 515px;
    margin-right: 1%;
    padding: 0;
    display: block;
    line-height: 1px;
    color: #000000;
}
.donation-level-user-entered label.userCurrency #dollarSign {
    font-size: 4em;
    line-height: 95px;
    color: #CCCCCC;
    margin: 0;
    position: absolute;
    top: -10px;
    left: 20px;
    z-index: 1000;
    width: 40px;
}
.donation-form-container.responsive .otherClose {
    position: absolute;
    right: 20px;
    top: 5px;
    opacity: .6;
}
.donation-form-container.responsive .otherClose:hover {
    border-bottom: 0;
    opacity: 1;
}
/* End Donation Levels */

/* Donate Button Styles */
.donation-form-container.responsive .button-sub-container {
    clear:both;
    float:left;
}
.donation-form-container.responsive button#pstep_finish,
.donation-form-container.responsive button#goto_donation_form_button {
    max-width:none;
    padding:25px 15px;
    #width:380px;
    background:#1D8FD7;
    color:#000000;
    border:none;
    font-size:2em;
    font-weight:700;
    border-radius:6px;
    transition:.5s;
    float:left;
    clear:both;
}
.donation-form-container.responsive button#pstep_finish.disabled {
    background: #CCCCCC;
}
.donation-form-container.responsive button#pstep_finish.enabled {
    background: #1D8FD7;
}
/* End Donate Button Styles */

/* Error/Info Message Styles */
div.responsive div.error,
div.responsive div.success {
    display: none;
}
div.responsive div.success {
    border: 1px solid #479B0D;
    background-color: #A2D1BE1A;
    padding: 3px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    margin-top: 4px;
}
div.responsive div#message span.error-message-header,
div.responsive div#message span.success-message-header {
    display: block;
    content: "\f12a";
    font: normal bold normal 20px FontAwesome;
    line-height: 20px;
    color: #B94A49;
    padding-bottom: 25px;
}

div.responsive div#message span.success-message-header {
    padding-top: 25px;
    padding-left: 10px;
}
div.responsive div#message span.success-message-header {
    color: #12870F;
}
div.responsive div#message span.error-message-text {
    font-size: 15px;
}
div.responsive div.ErrorMessage.page-error,
div.responsive div.form-info-message {
    margin: 40px 0px 16px 0px;
}
div.responsive div.ErrorMessage.page-error>span.field-error-indicator,
div.responsive div.form-info-message div.form-message-text > span.header-info-message,
div.responsive div.form-info-message div.form-message-text > span.header-warning-message {
    background: inherit;
    height: auto;
    width: auto;
    vertical-align: baseline;
}
div.responsive div.ErrorMessage.page-error>span.field-error-indicator {
    padding-left: 16px;
}
div.responsive div.ErrorMessage.page-error>span.field-error-indicator:before {
    content: "\f12a";
    font: normal normal normal 18px FontAwesome;
    line-height: 18px;
    color: #B94A49;
}
div.responsive div.form-info-message div.form-message-text > span.header-info-message:before,
div.responsive div.form-info-message div.form-message-text > span.header-warning-message:before {
    content: "Please note: ";
    font-size: 18px;
    font-weight: 600;
    line-height: 18px;
    color: #93AA43;
}
div.responsive span.field-error-text,
div.responsive div.ErrorMessage.page-error>span.field-error-text,
div.error > span.error-message-text
 {
    background-color: #FEEAEB;
    color: #B94A49;
    border: none;
    vertical-align: baseline;
    font-size: 18px;
    font-weight: 400;
    line-height: 23px;
}
div.responsive div.form-info-message {
    border: 1px solid #93AA43;
    padding: 3px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    background-color: #F4F8E6;
}
div.responsive div.form-info-message div.form-message-text {
    background-color: #F4F8E6;
    padding: 5px 12px 6px;
    color: #93AA43;
    vertical-align:baseline;
    font-size: 18px;
    font-weight: 400;
    line-height: 23px;
}
/* End Error Message Styles */

/* IE Styles */
input::-ms-clear {
    display: none;
}

/* Secure checkout loading styles */
div#secure_checkout_loading {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: fixed;
    display: block;
    opacity: 0.7;
    background-color: #fff;
    z-index: 99;
    display: flex;
    justify-content: center;
}
#loading_image {
    z-index: 100;
    vertical-align: middle;
    align-self: center;
}
.honoreeField {
    padding: 5px;
    margin-top: 8px;
    margin-bottom: 8px;
    margin-right: 0;
    padding-left: 0px;
}

.honoreeToggleField input[type = "checkbox"] {
    margin-left: 0px;
}

.honoreeField input[type=text],
.honoreeField select,
.honoreeField textarea {
    margin-top: 3px;
    display: block;
}
div.form-input select {
    height: 40px;
    border: 1px solid #000000;
    line-height: 38px;
    width: 100%;
    border-radius: 0;
    box-shadow: none;
}
div.sustaining-gift-message {
    clear: left;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 1.1em;
}
#donation-method-modal {
    position: relative;
    max-width: 380px;
    left: 50%;
    margin-left: -190px;
}
#donation-method-modal .modal-content {
    border-radius: 10px 10px 12px 12px;
}
.donation-method-modal-overlay {
    background-color: rgba(0, 0, 0, 0.8);
}
.modal-lock-icon {
    padding: 0 5px;
}
.pointer {
    cursor: pointer;
}
#save_payment_method {
    background-color: #1D8630;
    color: #FFFFFF;
    min-width: 250px;
    max-width: 370px;
    height: 50px;
    font-size: 1.2em;
}
#save_payment_method.disabled {
    cursor: not-allowed;
    font-size: 1.2em;
    pointer-events: unset;
}

.modal-content label {
    white-space: normal;
}
/* End secure checkout loading styles */