/* bootstrap and native browser overrides */

.alert p {
    margin: 0;
}

.checkbox input[type=checkbox], .checkbox-inline input[type=checkbox], .radio input[type=radio], .radio-inline input[type=radio] {
    position: relative;
}

.donation-contents-wrapper {
    margin-top: 15px;
}

.donation-contents-wrapper .alert {
    font-size: 12px;
}

.donation-contents-wrapper .form-control {
    resize: none;
}

.donation-contents-wrapper h3 {
    margin: 5px;
}

.donation-contents-wrapper h2 {
    text-transform: uppercase;
    color: #E65100;
    margin: 5px;
}

.donation-contents-wrapper h1, h2, h3, h4, h5 {
    
}

.donation-contents-wrapper div.checkbox label {
    font-size: 12px;
}

.donation-contents-wrapper .nav-tabs > li {
    margin: 0;
    width: 50%;
}

.donation-contents-wrapper .nav-tabs {
    border: none;
}

.donation-contents-wrapper .nav-tabs > li a {
    background: #FFF;
    border: none;
    border-bottom: 2px solid #CCC;
}

.donation-contents-wrapper .nav-tabs > li.active a {
    border-bottom: 2px solid #E65100;
}

.donation-contents-wrapper .nav-tabs > li a:hover {
    border: none;
    border-bottom: 2px solid #E65100;
}

.donation-contents-wrapper .nav-tabs > li a:hover {
    border: none;
    border-bottom: 2px solid #E65100;
}

.donation-contents-wrapper .tab-content {
    border: none;
    padding: 0;
}

.donation-contents-wrapper hr {
    border-color: #CCC;
}

.donation-contents-wrapper .glyphicon {
    top: 0;
}

.donation-contents-wrapper .card {
    border: none;
}

.donation-contents-wrapper .btn:focus {
    outline: none;
}

.donation-contents-wrapper .btn-default:hover {
    color: #FFF;
}

.tab-content form {
    margin-top: 20px;
}

/* Monthly Donation */

.donation-steps-wrapper {
    margin-top: 0;
}

.donation-steps-wrapper .progress-bar {
    height: 2px;
    position: relative;
    background: none repeat scroll 0 0 #CCC;
}

.donation-steps {
    position: relative;
    margin: 0;
    padding: 0;
    text-align: center;
}

.donation-steps li {
    display: inline-block;
    width: 19%;
    text-align: center;
    padding: 10px 0;
    background: none;
    position: relative;
    border: none;
    float: none;
    vertical-align: top;
}

.donation-steps li:before {
    position: relative;
    content: "\00A0";
    width: 20px;
    height: 20px;
    margin: 15px auto;
    border-radius: 50%;
    z-index: 99;
    display: block;
}

.donation-steps li.multi-step-form-active:before {
    z-index: 99;
    background-color: #E65100;
}

.donation-steps li.multi-step-form-step-future:before {
    background-color: #CCC;
}

.donation-steps li.multi-step-form-step-complete:before {
    content: "\2713";
    background-color: #9FCF67;
    color: #FFF;
    padding-top: 2px;
}

.donation-steps li.multi-step-form-active {
    color: #E65100;
}

.donation-steps li.multi-step-form-step-complete {
    color: #006400;
}

.donation-steps .multi-step-form-step-skipped {
    display: none;
}

h1 strong, .h1 strong, h2 strong, .h2 strong, h3 strong, .h3 strong, h2 strong, .h2 strong, h4 strong, .h4 strong {
    border: none;
}

#direct-debit-guarantee-modal ul li {
    font-size: 11px;
    line-height: 22px;
}

/* hide sort code error messages for stringLength validator */
small[data-fv-for="sortcode_1"], small[data-fv-for="sortcode_2"], small[data-fv-for="sortcode_3"] {
    display:none !important;
}

/* Form Validation v1.6 - Hide sort code error messages */
.sort-code-wrapper > .fv-plugins-message-container > 
div[data-field="sortcode_1"],  
div[data-field="sortcode_2"], 
div[data-field="sortcode_3"]
{
    display: none !important;
}

/* Characters remaining */
.chars-remaining {
    text-align: right;
    padding: 5px;
}

/* CC fields / FormValidator icons */

.form-control-feedback.mastercard {
    background: url('../../images/payment-card-mastercard.png');
}

.form-control-feedback.visa {
    background: url('../../images/payment-card-visa.png');
    z-index: 3;
}

.card-payment-section .form-control-feedback {
    background-repeat: no-repeat;
    background-position: center center;
}

/* Change the top position of formValidation icons */
.fv-plugins-bootstrap:not(.form-inline) label ~ .fv-plugins-icon {
    top: 22px;
}
/* Set the field border color */
.has-danger {
    color: #dc3545;
}
.has-success h3, .has-success label {
    color: #28a745;
}
.has-success .input-group-text {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #28a745;
}

.has-danger .input-group-text {
    color: #dc3545;
    background-color: #f2dede;
    border-color: #dc3545;
}

.has-danger h3, .has-danger label {
    color: #dc3545;
}

.has-feedback label ~ .form-control-feedback {
    top: 22px;
}

.ga-hidden, .ga-message {
    display: none;
}

.gift-aid-notice {
    background-color: #9FC349;
    padding: 20px;
    margin: -18px -60px 0 -60px;
    line-height: normal;
    font-size: 20px;
    color: #FFF;
}

.gift-aid-notice img {
    display: block;
    float: right;
    margin-top: 20px;
}

.donation-gift-aid-header {
    margin-bottom: 10px;
}

.btn-donation {
    background-color: #9fc248;
    border-color: #78962D;
}

.btn-donation:hover, .btn-donation:focus {
    background-color: #78962D;
    color: #FFF;
    border-color: #4C6313;
}

.forgot-password-form-link {
    padding: 5px 0;
}

.account-holder-field label {
    padding-right: 20px;
}

.sort-code-wrapper .form-control-feedback {
    display: none !important;
}
.sort-code-wrapper > fv-plugins-icon,
.sort-code-wrapper > i {
    display: none !important;
}

.sort-code-wrapper .input-group-addon {
    background: none;
    border: none;
}

.sort-code-wrapper .input-group input {
    padding: 5px;
    text-align: center;
}

.suggested-amount-wrapper {
    float: left !important;
}

.btn-share {
    margin-bottom: 10px;
}
.fundraising a {
    color: #fff;
}
@media (max-width: 480px) {

    .suggested-amount-wrapper {
        padding-left: 5px;
        padding-right: 5px;
    }

    .suggested-donation-amount {
        padding: 10px 2px;
    }
}

@media (max-width: 576px) {
    .gift-aid-notice {
        margin: -11px -15px 0 -15px;
    }
}

@media (max-width: 767px) {

    .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
        float: left;
    }

}

@media (min-width: 767px) and (max-width: 1199px) {

    .has-feedback .form-control.cc-cvc {
        padding-right: 25px;
    }

}

.ui-payment-progress-spinner {
    text-align: center;
    margin: 30px;
    color: #bbbbbb;
}

#apple-pay-button {
    display: none;
    background-color: black;
    background-image: -webkit-named-image(apple-pay-logo-white);
    background-size: 100% 100%;
    background-origin: content-box;
    background-repeat: no-repeat;
    width: 100%;
    height: 44px;
    padding: 10px 0;
    border-radius: 10px;
}

#apple-pay-section, .card-payment-section, .paypal-payment-section, .card-payment-spacer {
    display: none;
}

.totalDonationAmount {
    display: none;
}

.donationTipSelectorLabel {
    font-weight: normal !important;
    margin-bottom: 15px;
}

#donationTipOtherContainer {
    display: none;
}

#donationTipSelectorContainer {
    display: none;
}

#donationTipSelectorTipModal {
    margin-bottom: 10px;
}

#donationTipSelectorTipModalButton {
    overflow: visible;
    border: 0;
    background: none;
    outline: none;
    color: #0277BD;
    cursor: help;
}

.stripe-input {
    padding-top: 15px;
}

.postcode-input {
    font-size: 14px;
}

.donation-reminder-container {
    margin: 10px 0 10px 0;
    font-family: 'Lato', sans-serif;
    line-height: 2em;
}

.donation-reminder-label {
    display: inline-flex;
    font-size: 20px;
    color: #26211d;
}

.donation-reminder-value {
    display: inline-flex;
    font-size: 20px;
    color: #E65100;
}

.donation-reminder-edit {
    display: inline-flex;
    font-size: 20px;
    color: #26211d;
}

.donation-reminder-label-small {
    display: inline-flex;
    font-size: 12px;
    color: #26211d;
}

.donation-reminder-value-small {
    display: inline-flex;
    font-size: 12px;
    color: #E65100;
}

.donation-reminder-edit-small {
    display: inline-flex;
    font-size: 12px;
    color: #26211d;
}

#donation-charity-logo {
    max-height: 100px;
}