Example

Promo header
2500 x 779

Comic Relief supports projects around the world.

Would you like to donate monthly or make a one off donation?

Your donation could pay for:

£
Back

Giftaid it

Gift aid it and the Government will give
Comic Relief £7.50 (25%)
on top of your £30 donation.

* By ticking I state I am a UK taxpayer making a personal donation and understand that if I pay less Income Tax and/or Capital Gains Tax than the amount of Gift Aid claimed on all my donations, it is my responsibility to pay any difference. Find out more

Stay up to date with Comic Relief

We'd love to keep you in the loop and tell you how your money helps to change lives.

Your details will be kept safe and never shared with other organisations; see our  privacy policy(opens in a new window)

Name, surname, email and billing address: we need these to process your payment, create a receipt and send it to you. We’ll also use it to claim Gift Aid, if you’ve told us to.

Your details will be kept safe and never shared with other organisations; see our privacy policy (opens in a new window).

Back

Your details

Markup: donate-page.twig
<header class="header" role="banner">
	<div class="header__inner-wrapper">
    <div id="block-branding" class="block block-branding">
      <a href="https://www.comicrelief.com" title="Home" rel="home noopener noreferrer" class="site-logo site-logo--crdonate">
        <img src="./kss-assets/images/cr_logo.svg" alt="Home">
      </a>
    </div>
  </div>
</header>
<main>
  <div class="kss-modifier__example promo-header promo-header--default promo-header--small" style="background: url('./kss-assets/images/single_donation_skate_girl.jpg') center top no-repeat transparent;">
    <h1 class="font--xlarge"><span class="kss-image-dimension">Promo header <br/>2500 x 779</span></h1>
  </div>

  <!-- MONEYBUY BLOCK -->
  <div class="form__step form__step--payment">
    <form name="comicrelief_payinbundle_payment" method="post" novalidate="" class="has-validation-callback">

      <div class="form__row form__row--payment form__row--moneybuy-block">
        <div id="js-togglebtn-amount" class="form__fieldset form__togglebtn-amount">
          <h1 class="form__subtitle select-label">Comic Relief supports projects around the world.</h1>

          <fieldset id="giving_type_selector">
            <legend class="visuallyhidden">Would you like to donate monthly or make a one off donation?</legend>
              <div class="form__field--wrapper">
                <input id="monthly_giving_selector" name="giving_type_selector" type="radio" value="MONTHLY">
                <label for="monthly_giving_selector">Monthly <span>Donation</span></label>
              </div>
              <div class="form__field--wrapper">
                <input id="one_off_selector" name="giving_type_selector" type="radio" value="SINGLE" checked="">
                <label for="one_off_selector">Single <span>Donation</span></label>
              </div>
          </fieldset>

          <p>Your donation could pay for:</p>
          <div>
            <button class="select-amount-btn" aria-label="£30 could pay for vital education about maternal health in Sierra Leone">
              <span class="select-amount">
                <span class="amount-text">£30</span>
              </span>
              <span class="select-amount--context">vital education about maternal health in Sierra Leone</span>
            </button>
            <button class="select-amount-btn" aria-label="£50 could pay for over 160 tests to quickly diagnose people with malaria">
              <span class="select-amount">
                <span class="amount-text">£50</span>
              </span>
              <span class="select-amount--context">over 160 tests to quickly diagnose people with malaria</span>
            </button>
            <button class="select-amount-btn" aria-label="£150 could pay for 6 specialist trauma counselling sessions for refugees in the UK">
              <span class="select-amount">
                <span class="amount-text">£150</span>
              </span>
              <span class="select-amount--context">6 specialist trauma counselling sessions for refugees in the UK</span>
            </button>
          </div>
        </div>
      <div class="form__fieldset">
        <span id="js-currency-label" class="currency-input-label">£</span>
        <div class="form__field--wrapper form__money form__field--amount">
          <label id="field-label--amount" class="form__field form__field--amount form__money required" for="field-input--amount">Enter amount</label>
          <input type="number" id="field-input--amount" name="amount" required="" placeholder="0" pattern="[^[0-9]+$]" class="form__field form__field--amount " aria-describedby="field-label--amount field-error--amount" min="1" max="5000" value="">
        </div>
        <div class="form__field--wrapper form__choice form__field--currency">
          <label class="form__field form__field--currency form__choice required" for="comicrelief_payinbundle_payment_currency"> Currency</label>
          <select id="comicrelief_payinbundle_payment_currency" name="comicrelief_payinbundle_payment[currency]" class="form__field form__field--currency">
            <optgroup label="currency"><option value="GBP" data-currency="£">£ GBP</option>
              <option value="USD" data-currency="$">$ USD</option>
              <option value="AUD" data-currency="$">$ AUD</option>
              <option value="EUR" data-currency="€">€ EUR</option>
            </optgroup>
          </select>
        </div>
      </div>
      <div class="form__fieldset form__amount-submit">
        <button id="comicrelief_payinbundle_payment_amount_submit" type="submit" name="comicrelief_payinbundle_payment[submit]" class="form__next">Donate now</button>
      </div>
      </div>
    </form>
  </div>
  
  <!-- GIFTAID BLOCK -->
  <div class="form__step form__step--payment">
    <form name="comicrelief_payinbundle_payment" method="post" novalidate="" class="has-validation-callback">
      <div class="form__row form__row--giftaid">
        <a class="form__back" href="/" role="button" aria-label="Back to donation amount">Back</a>
        <div class="form__fieldset">
            <h1 class="giftaid-title"><span class="visually-hidden">Giftaid it</span></h1>
            <p>Gift aid it and<span class="font--family-bold"> the Government will give <br>Comic Relief £7.50 (25%)</span> on top of your £30 donation.</p>
            <div id="field-wrapper--giftaid">
              <div class="form__fieldset form__field--wrapper form__field-wrapper--checkbox form__field-wrapper--background">
                  <label id="field-label--giftaid" for="field-input--giftaid" class="form__field-label">Yes, I would like Comic Relief to claim Gift Aid on my donation *</label>
                  <div class="form__field--giftaid"><input class="form__field form__field--checkbox " type="checkbox" id="field-input--giftaid" name="giftaid" value="0"><span></span></div>
              </div>
              <div class="form__fieldset form__field--wrapper  form__field-additional-text">
                  <div>* By ticking I state I am a UK taxpayer making a personal donation and understand that if I pay less Income Tax and/or Capital Gains Tax than the amount of Gift Aid claimed on all my donations, it is my responsibility to pay any difference. <a href="https://www.comicrelief.com/frequently-asked-questions" class="link inline" target="_blank" rel="noopener noreferrer" aria-label="Find out more about Gift Aid (opens in a new window)">Find out more </a></div>
              </div>
            </div>
        </div>
      </div>
      <div class="form__row form__row--keep-touch">
        <div class="form__fieldset">
            <fieldset>
              <h2 class="form__subtitle">Stay up to date with Comic Relief</h2>
              <p class="form__subcopy">We'd love to keep you in the loop and tell you how your money helps to change lives.</p>
              <div>
                  <div id="field-wrapper--permissionEmail">
                    <div class="form__fieldset form__field--wrapper form__field-wrapper--checkbox form__field-wrapper--background">
                        <label id="field-label--permissionEmail" for="field-input--permissionEmail" class="form__field-label">Yes, keep me updated by email.</label>
                        <div class="form__field--permissionEmail"><input class="form__field form__field--checkbox " type="checkbox" id="field-input--permissionEmail" name="permissionEmail" value="0"><span></span></div>
                    </div>
                  </div>
              </div>
              <div>
                  <div id="field-wrapper--permissionPost">
                    <div class="form__fieldset form__field--wrapper form__field-wrapper--checkbox form__field-wrapper--background">
                        <label id="field-label--permissionPost" for="field-input--permissionPost" class="form__field-label">No, do not contact me by post</label>
                        <div class="form__field--permissionPost"><input class="form__field form__field--checkbox " type="checkbox" id="field-input--permissionPost" name="permissionPost" value="1"><span></span></div>
                    </div>
                  </div>
              </div>
              <p>Your details will be kept safe and never shared with other organisations; see our &nbsp;<a href="https://www.comicrelief.com/privacy-policy" target="blank" rel="noopener noreferrer" class="link link--dark-purple">privacy policy<span class="visuallyhidden">(opens in a new window)</span></a></p>
            </fieldset>
        </div>
      </div>
      <div class="form__row form__row--payment-buttons">
        <div class="form__fieldset">
          <button id="comicrelief_payinbundle_payment_card" class="payment-button form__next" type="submit" aria-label="Pay by card">pay by card</button>
        </div>
      </div>
      <div class="form__row form__row--just-in-time-block">
        <div class="form__fieldset">
            <a href="#show-public" aria-expanded="false" class="link toggle-link show-link" aria-label="Click to open for more information on why we are asking for this information">Why do we collect this info?</a>
            <div class="just-in-time--content just-in-time--content-close">
              <p><strong>Name, surname, email and billing address:</strong> we need these to process your payment, create a receipt and send it to you. We’ll also use it to claim Gift Aid, if you’ve told us to.</p>
              <p>Your details will be kept safe and never shared with other organisations; see our <a href="https://www.comicrelief.com/privacy-policy" rel="noopener noreferrer" target="_blank" class="link link-dark--grey">privacy policy <span class="visuallyhidden">(opens in a new window)</span></a>.</p>
            </div>
        </div>
      </div>
    </form>
  </div>
  
  <!-- ADDRESS BLOCK -->
  <div class="form__step form__step--payment">
    <form name="comicrelief_payinbundle_payment" method="post" novalidate="" class="has-validation-callback">
      <div class="form__row form__row--your-detail">
        <a id="js-back-details" class="form__back" href="/" role="button" aria-label="Back to Giftaid claim">Back</a>
        <div class="form__fieldset">
            <h1 class="form__subtitle">Your details</h1>
            <div id="field-wrapper--firstName">
              <div class="form__fieldset form__field--wrapper form__field-wrapper--text    ">
                  <label id="field-label--firstName" for="field-input--firstName" class="form__field-label required ">First name</label>
                  <div class="form__field--firstName"><input type="text" id="field-input--firstName" name="firstName" class="form__field form__field--text " required="" placeholder="" pattern="" aria-describedby="field-label--firstName field-error--firstName" value="" style="background-image: url(&quot;data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAAAXNSR0IArs4c6QAAAfBJREFUWAntVk1OwkAUZkoDKza4Utm61iP0AqyIDXahN2BjwiHYGU+gizap4QDuegWN7lyCbMSlCQjU7yO0TOlAi6GwgJc0fT/fzPfmzet0crmD7HsFBAvQbrcrw+Gw5fu+AfOYvgylJ4TwCoVCs1ardYTruqfj8fgV5OUMSVVT93VdP9dAzpVvm5wJHZFbg2LQ2pEYOlZ/oiDvwNcsFoseY4PBwMCrhaeCJyKWZU37KOJcYdi27QdhcuuBIb073BvTNL8ln4NeeR6NRi/wxZKQcGurQs5oNhqLshzVTMBewW/LMU3TTNlO0ieTiStjYhUIyi6DAp0xbEdgTt+LE0aCKQw24U4llsCs4ZRJrYopB6RwqnpA1YQ5NGFZ1YQ41Z5S8IQQdP5laEBRJcD4Vj5DEsW2gE6s6g3d/YP/g+BDnT7GNi2qCjTwGd6riBzHaaCEd3Js01vwCPIbmWBRx1nwAN/1ov+/drgFWIlfKpVukyYihtgkXNp4mABK+1GtVr+SBhJDbBIubVw+Cd/TDgKO2DPiN3YUo6y/nDCNEIsqTKH1en2tcwA9FKEItyDi3aIh8Gl1sRrVnSDzNFDJT1bAy5xpOYGn5fP5JuL95ZjMIn1ya7j5dPGfv0A5eAnpZUY3n5jXcoec5J67D9q+VuAPM47D3XaSeL4AAAAASUVORK5CYII=&quot;); background-repeat: no-repeat; background-attachment: scroll; background-size: 16px 18px; background-position: 98% 50%;"></div>
              </div>
            </div>
            <div id="field-wrapper--lastName">
              <div class="form__fieldset form__field--wrapper form__field-wrapper--text    ">
                  <label id="field-label--lastName" for="field-input--lastName" class="form__field-label required ">Last name</label>
                  <div class="form__field--lastName"><input type="text" id="field-input--lastName" name="lastName" class="form__field form__field--text " required="" placeholder="" pattern="" aria-describedby="field-label--lastName field-error--lastName" value=""></div>
              </div>
            </div>
            <div id="field-wrapper--email">
              <div class="form__fieldset form__field--wrapper form__field-wrapper--email    ">
                  <label id="field-label--email" for="field-input--email" class="form__field-label required ">Email</label>
                  <div class="form__field--email"><input type="email" id="field-input--email" name="email" class="form__field form__field--email " required="" placeholder="example@example.com" pattern="" aria-describedby="field-label--email field-error--email" value=""></div>
              </div>
            </div>
            <div id="field-wrapper--confirmEmail">
              <div class="form__fieldset form__field--wrapper form__field-wrapper--email    ">
                  <label id="field-label--confirmEmail" for="field-input--confirmEmail" class="form__field-label required ">Confirm email</label>
                  <div class="form__field--confirmEmail"><input type="email" id="field-input--confirmEmail" name="confirmEmail" class="form__field form__field--email " required="" placeholder="example@example.com" pattern="" aria-describedby="field-label--confirmEmail field-error--confirmEmail" value=""></div>
              </div>
            </div>
        </div>
      </div>
      <div class="form__row form__row--your--address">
        <div class="form__row form__row--billing-detail form__row--address-lookup">
            <div id="field-wrapper--postcode">
              <div class="form__fieldset form__field--wrapper form__field-wrapper--text   search-box ">
                  <label id="field-label--postcode" for="field-input--postcode" class="form__field-label required ">Postal address</label>
                  <div class="form__field--postcode">
                    <input type="text" id="field-input--postcode" name="postcode" class="form__field form__field--text " required="" placeholder="SE1 7TP" pattern="/^[A-Za-z0-9\/\-.\s]+$/" aria-describedby="field-label--postcode field-error--postcode" value="">
                    <div class="form__btn"><input type="button" id="postcode_button" class="form__btn--postcode " value="FIND ADDRESS"></div>
                  </div>
              </div>
            </div>
            <div class="form__field--wrapper"><a href="/" role="button" class="link" aria-describedby="field-error--addressDetails">Or enter your address manually</a></div>
            <div id="address-detail" class="form__field--address-detail">
              <div class="hide">
                  <div id="field-wrapper--address1">
                    <div class="form__fieldset form__field--wrapper form__field-wrapper--text    ">
                        <label id="field-label--address1" for="field-input--address1" class="form__field-label required ">Address line 1</label>
                        <div class="form__field--address1"><input type="text" id="field-input--address1" name="address1" class="form__field form__field--text " required="" placeholder="" pattern="/^[A-Za-z0-9_.'\/&amp;\s-]+$/" aria-describedby="field-label--address1 field-error--address1" value=""></div>
                    </div>
                  </div>
                  <div id="field-wrapper--address2">
                    <div class="form__fieldset form__field--wrapper form__field-wrapper--text    ">
                        <label id="field-label--address2" for="field-input--address2" class="form__field-label ">Address line 2<span>&nbsp;(Optional)&nbsp;</span></label>
                        <div class="form__field--address2"><input type="text" id="field-input--address2" name="address2" class="form__field form__field--text " placeholder="" pattern="/^[A-Za-z0-9_.'\/&amp;\s-]+$/" aria-describedby="field-label--address2 field-error--address2" value=""></div>
                    </div>
                  </div>
                  <div id="field-wrapper--address3">
                    <div class="form__fieldset form__field--wrapper form__field-wrapper--text    ">
                        <label id="field-label--address3" for="field-input--address3" class="form__field-label ">Address line 3<span>&nbsp;(Optional)&nbsp;</span></label>
                        <div class="form__field--address3"><input type="text" id="field-input--address3" name="address3" class="form__field form__field--text " placeholder="" pattern="/^[A-Za-z0-9_.'\/&amp;\s-]+$/" aria-describedby="field-label--address3 field-error--address3" value=""></div>
                    </div>
                  </div>
                  <div id="field-wrapper--town">
                    <div class="form__fieldset form__field--wrapper form__field-wrapper--text    ">
                        <label id="field-label--town" for="field-input--town" class="form__field-label required ">Town/City</label>
                        <div class="form__field--town"><input type="text" id="field-input--town" name="town" class="form__field form__field--text " required="" placeholder="" pattern="/^[A-Za-z0-9_.'\/&amp;\s-]+$/" aria-describedby="field-label--town field-error--town" value=""></div>
                    </div>
                  </div>
                  <div id="field-wrapper--country" class="form__fieldset form__field--wrapper form__field-wrapper--select  ">
                    <label id="field-label--country" for="field-select--country" class="form__field-label  required">Country</label>
                    <select id="field-select--country" name="country" aria-describedby="field-label--country field-error--country">
                        <option value="GB" selected="">United Kingdom</option>
                        <option value="" disabled="">-------------------</option>
                        <option value="AF">Afghanistan</option>
                        <option value="AX">Åland Islands</option>
                        <option value="AL">Albania</option>
                        <option value="DZ">Algeria</option>
                        <option value="AS">American Samoa</option>
                        <option value="AD">Andorra</option>
                        <option value="AO">Angola</option>
                        <option value="AI">Anguilla</option>
                        <option value="AQ">Antarctica</option>
                        <option value="AG">Antigua &amp; Barbuda</option>
                        <option value="AR">Argentina</option>
                        <option value="AM">Armenia</option>
                        <option value="AW">Aruba</option>
                        <option value="AC">Ascension Island</option>
                        <option value="AU">Australia</option>
                        <option value="AT">Austria</option>
                        <option value="AZ">Azerbaijan</option>
                        <option value="BS">Bahamas</option>
                        <option value="BH">Bahrain</option>
                        <option value="BD">Bangladesh</option>
                        <option value="BB">Barbados</option>
                        <option value="BY">Belarus</option>
                        <option value="BE">Belgium</option>
                        <option value="BZ">Belize</option>
                        <option value="BJ">Benin</option>
                        <option value="BM">Bermuda</option>
                        <option value="BT">Bhutan</option>
                        <option value="BO">Bolivia</option>
                        <option value="BA">Bosnia &amp; Herzegovina</option>
                        <option value="BW">Botswana</option>
                        <option value="BR">Brazil</option>
                        <option value="IO">British Indian Ocean Territory</option>
                        <option value="VG">British Virgin Islands</option>
                        <option value="BN">Brunei</option>
                        <option value="BG">Bulgaria</option>
                        <option value="BF">Burkina Faso</option>
                        <option value="BI">Burundi</option>
                        <option value="KH">Cambodia</option>
                        <option value="CM">Cameroon</option>
                        <option value="CA">Canada</option>
                        <option value="IC">Canary Islands</option>
                        <option value="CV">Cape Verde</option>
                        <option value="BQ">Caribbean Netherlands</option>
                        <option value="KY">Cayman Islands</option>
                        <option value="CF">Central African Republic</option>
                        <option value="EA">Ceuta &amp; Melilla</option>
                        <option value="TD">Chad</option>
                        <option value="CL">Chile</option>
                        <option value="CN">China</option>
                        <option value="CX">Christmas Island</option>
                        <option value="CC">Cocos (Keeling) Islands</option>
                        <option value="CO">Colombia</option>
                        <option value="KM">Comoros</option>
                        <option value="CG">Congo - Brazzaville</option>
                        <option value="CD">Congo - Kinshasa</option>
                        <option value="CK">Cook Islands</option>
                        <option value="CR">Costa Rica</option>
                        <option value="CI">Côte d’Ivoire</option>
                        <option value="HR">Croatia</option>
                        <option value="CU">Cuba</option>
                        <option value="CW">Curaçao</option>
                        <option value="CY">Cyprus</option>
                        <option value="CZ">Czechia</option>
                        <option value="DK">Denmark</option>
                        <option value="DG">Diego Garcia</option>
                        <option value="DJ">Djibouti</option>
                        <option value="DM">Dominica</option>
                        <option value="DO">Dominican Republic</option>
                        <option value="EC">Ecuador</option>
                        <option value="EG">Egypt</option>
                        <option value="SV">El Salvador</option>
                        <option value="GQ">Equatorial Guinea</option>
                        <option value="ER">Eritrea</option>
                        <option value="EE">Estonia</option>
                        <option value="ET">Ethiopia</option>
                        <option value="EZ">Eurozone</option>
                        <option value="FK">Falkland Islands</option>
                        <option value="FO">Faroe Islands</option>
                        <option value="FJ">Fiji</option>
                        <option value="FI">Finland</option>
                        <option value="FR">France</option>
                        <option value="GF">French Guiana</option>
                        <option value="PF">French Polynesia</option>
                        <option value="TF">French Southern Territories</option>
                        <option value="GA">Gabon</option>
                        <option value="GM">Gambia</option>
                        <option value="GE">Georgia</option>
                        <option value="DE">Germany</option>
                        <option value="GH">Ghana</option>
                        <option value="GI">Gibraltar</option>
                        <option value="GR">Greece</option>
                        <option value="GL">Greenland</option>
                        <option value="GD">Grenada</option>
                        <option value="GP">Guadeloupe</option>
                        <option value="GU">Guam</option>
                        <option value="GT">Guatemala</option>
                        <option value="GG">Guernsey</option>
                        <option value="GN">Guinea</option>
                        <option value="GW">Guinea-Bissau</option>
                        <option value="GY">Guyana</option>
                        <option value="HT">Haiti</option>
                        <option value="HN">Honduras</option>
                        <option value="HK">Hong Kong SAR China</option>
                        <option value="HU">Hungary</option>
                        <option value="IS">Iceland</option>
                        <option value="IN">India</option>
                        <option value="ID">Indonesia</option>
                        <option value="IR">Iran</option>
                        <option value="IQ">Iraq</option>
                        <option value="IE">Ireland</option>
                        <option value="IM">Isle of Man</option>
                        <option value="IL">Israel</option>
                        <option value="IT">Italy</option>
                        <option value="JM">Jamaica</option>
                        <option value="JP">Japan</option>
                        <option value="JE">Jersey</option>
                        <option value="JO">Jordan</option>
                        <option value="KZ">Kazakhstan</option>
                        <option value="KE">Kenya</option>
                        <option value="KI">Kiribati</option>
                        <option value="XK">Kosovo</option>
                        <option value="KW">Kuwait</option>
                        <option value="KG">Kyrgyzstan</option>
                        <option value="LA">Laos</option>
                        <option value="LV">Latvia</option>
                        <option value="LB">Lebanon</option>
                        <option value="LS">Lesotho</option>
                        <option value="LR">Liberia</option>
                        <option value="LY">Libya</option>
                        <option value="LI">Liechtenstein</option>
                        <option value="LT">Lithuania</option>
                        <option value="LU">Luxembourg</option>
                        <option value="MO">Macau SAR China</option>
                        <option value="MK">Macedonia</option>
                        <option value="MG">Madagascar</option>
                        <option value="MW">Malawi</option>
                        <option value="MY">Malaysia</option>
                        <option value="MV">Maldives</option>
                        <option value="ML">Mali</option>
                        <option value="MT">Malta</option>
                        <option value="MH">Marshall Islands</option>
                        <option value="MQ">Martinique</option>
                        <option value="MR">Mauritania</option>
                        <option value="MU">Mauritius</option>
                        <option value="YT">Mayotte</option>
                        <option value="MX">Mexico</option>
                        <option value="FM">Micronesia</option>
                        <option value="MD">Moldova</option>
                        <option value="MC">Monaco</option>
                        <option value="MN">Mongolia</option>
                        <option value="ME">Montenegro</option>
                        <option value="MS">Montserrat</option>
                        <option value="MA">Morocco</option>
                        <option value="MZ">Mozambique</option>
                        <option value="MM">Myanmar (Burma)</option>
                        <option value="NA">Namibia</option>
                        <option value="NR">Nauru</option>
                        <option value="NP">Nepal</option>
                        <option value="NL">Netherlands</option>
                        <option value="NC">New Caledonia</option>
                        <option value="NZ">New Zealand</option>
                        <option value="NI">Nicaragua</option>
                        <option value="NE">Niger</option>
                        <option value="NG">Nigeria</option>
                        <option value="NU">Niue</option>
                        <option value="NF">Norfolk Island</option>
                        <option value="KP">North Korea</option>
                        <option value="MP">Northern Mariana Islands</option>
                        <option value="NO">Norway</option>
                        <option value="OM">Oman</option>
                        <option value="PK">Pakistan</option>
                        <option value="PW">Palau</option>
                        <option value="PS">Palestinian Territories</option>
                        <option value="PA">Panama</option>
                        <option value="PG">Papua New Guinea</option>
                        <option value="PY">Paraguay</option>
                        <option value="PE">Peru</option>
                        <option value="PH">Philippines</option>
                        <option value="PN">Pitcairn Islands</option>
                        <option value="PL">Poland</option>
                        <option value="PT">Portugal</option>
                        <option value="PR">Puerto Rico</option>
                        <option value="QA">Qatar</option>
                        <option value="RE">Réunion</option>
                        <option value="RO">Romania</option>
                        <option value="RU">Russia</option>
                        <option value="RW">Rwanda</option>
                        <option value="WS">Samoa</option>
                        <option value="SM">San Marino</option>
                        <option value="ST">São Tomé &amp; Príncipe</option>
                        <option value="SA">Saudi Arabia</option>
                        <option value="SN">Senegal</option>
                        <option value="RS">Serbia</option>
                        <option value="SC">Seychelles</option>
                        <option value="SL">Sierra Leone</option>
                        <option value="SG">Singapore</option>
                        <option value="SX">Sint Maarten</option>
                        <option value="SK">Slovakia</option>
                        <option value="SI">Slovenia</option>
                        <option value="SB">Solomon Islands</option>
                        <option value="SO">Somalia</option>
                        <option value="ZA">South Africa</option>
                        <option value="GS">South Georgia &amp; South Sandwich Islands</option>
                        <option value="KR">South Korea</option>
                        <option value="SS">South Sudan</option>
                        <option value="ES">Spain</option>
                        <option value="LK">Sri Lanka</option>
                        <option value="BL">St. Barthélemy</option>
                        <option value="SH">St. Helena</option>
                        <option value="KN">St. Kitts &amp; Nevis</option>
                        <option value="LC">St. Lucia</option>
                        <option value="MF">St. Martin</option>
                        <option value="PM">St. Pierre &amp; Miquelon</option>
                        <option value="VC">St. Vincent &amp; Grenadines</option>
                        <option value="SD">Sudan</option>
                        <option value="SR">Suriname</option>
                        <option value="SJ">Svalbard &amp; Jan Mayen</option>
                        <option value="SZ">Swaziland</option>
                        <option value="SE">Sweden</option>
                        <option value="CH">Switzerland</option>
                        <option value="SY">Syria</option>
                        <option value="TW">Taiwan</option>
                        <option value="TJ">Tajikistan</option>
                        <option value="TZ">Tanzania</option>
                        <option value="TH">Thailand</option>
                        <option value="TL">Timor-Leste</option>
                        <option value="TG">Togo</option>
                        <option value="TK">Tokelau</option>
                        <option value="TO">Tonga</option>
                        <option value="TT">Trinidad &amp; Tobago</option>
                        <option value="TA">Tristan da Cunha</option>
                        <option value="TN">Tunisia</option>
                        <option value="TR">Turkey</option>
                        <option value="TM">Turkmenistan</option>
                        <option value="TC">Turks &amp; Caicos Islands</option>
                        <option value="TV">Tuvalu</option>
                        <option value="UM">U.S. Outlying Islands</option>
                        <option value="VI">U.S. Virgin Islands</option>
                        <option value="UG">Uganda</option>
                        <option value="UA">Ukraine</option>
                        <option value="AE">United Arab Emirates</option>
                        <option value="UN">United Nations</option>
                        <option value="US">United States</option>
                        <option value="UY">Uruguay</option>
                        <option value="UZ">Uzbekistan</option>
                        <option value="VU">Vanuatu</option>
                        <option value="VA">Vatican City</option>
                        <option value="VE">Venezuela</option>
                        <option value="VN">Vietnam</option>
                        <option value="WF">Wallis &amp; Futuna</option>
                        <option value="EH">Western Sahara</option>
                        <option value="YE">Yemen</option>
                        <option value="ZM">Zambia</option>
                        <option value="ZW">Zimbabwe</option>
                    </select>
                  </div>
              </div>
            </div>
        </div>
      </div>
      <div class="form__row">
        <div class="form__fieldset">
            <div class="form__field--wrapper form__submit form__field--submit"><button type="submit" id="comicrelief_payinbundle_payment_submit" name="comicrelief_payinbundle_payment[submit]">Continue</button></div>
        </div>
      </div>
    </form>
  </div>

</main>

<div class="partners">
   <section class="donate__partners">
      <div class="donate__partners-fr"><img src="./kss-assets/images/frsb.png" alt="Registered with Fundraising Regulator - Logo"></div>
      <div class="donate__partners-digicert"><img src="./kss-assets/images/logo_digicert_v1.jpg" alt="DigiCert Logo"></div>
      <p class="donate__partners-copy font--xsmall">By working with the best partners like Braintree, DigiCert, Paypal, Stripe and WorldPay, we'll keep your data safe. <a class="hyperlink" href="https://www.cafonline.org/" aria-label="Click here to go to Charities Aid Foundation account">Donate using your Charities Aid Foundation account</a></p>
   </section>
</div>
Source: _donate-styleguide.scss, line 1