Example

Thank you

Your payment has been processed.

Transaction ID: 371d3265-efcd-11e7-89992-0e0f567937ca

Don’t forget to tick the box if you want your story to have a chance to be featured.
This is a required field
This is a required field
Where does the money go

Where your money goes

Sport Relief uses the money you give to fund incredible projects, in the UK and around the world, that tackle important social issues and ensure people are safe, happy and healthy.

Find out more

Team sports relief

#teamsportrelief

Show that you're part of a nation-wide team of awesome fundraisers, by sharing photos of your Sport Relief activites on your social channels. Don't forget to tag us with #teamsportrelief!

See the team

Markup: rednoseday/pages/success-page.twig
<section id="payin-step-four" class="content success-content">
  <div class="bg--gradient-purple-ruby promo-header promo-header--default  promo-header--no-image">
    <div class="promo-header__content">
    	<div class="promo-header__content-inner promo-header__content-inner--centre">
       	<h1 class="text-align-center font--white">Thank you</h1>
        <p>Your payment has been processed.</p>
      </div>
    </div>
  </div>
  <div class="form__row form__row--title">
    <div class="form__fieldset">
      <p>Transaction ID: <strong> 371d3265-efcd-11e7-89992-0e0f567937ca</strong>
      </p>
    </div>
  </div>
  <div class="form__row--user-generate-content">
    <div class="form__fieldset">
      <div class="form-error"></div>
        <div class="form-user-content">
          <div class="form-user-content--copy-">
            <div class="form__field--wrapper form__text form__field--whatyoudid has-error form__field--help">
              <label for="comicrelief_payin_success_whatYouDid">
                Tell us about your fundraising activities and you could feature in our next campaign!
              </label>
              <span class="form__field--help-info">Don’t forget to tick the box if you want your story to have a chance to be featured.</span>
              <textarea id="comicrelief_payin_success_whatYouDid" name="comicrelief_payin_success[whatYouDid]" required="required" maxlength="400" placeholder="Enter your Sport Relief 2018 story..." class="form__field form__field--whatYouDid" data-validation="required length" data-validation-length="max400"></textarea>
              <div class="form__field--error"></div>
              <span class="help-block form-error">This is a required field</span>
            </div>
            <div class="form__field--wrapper form__checkbox form__field--permission has-error">
              <label class="form__checkbox required" for="comicrelief_payin_success_permission">
                I am happy for Comic Relief to contact me about my fundraising
              </label>
              <input type="checkbox" id="comicrelief_payin_success_permission" name="comicrelief_payin_success[permission]" required="required" value="1" data-validation="required" class="valid" style="">
              <span></span>
              <span class="help-block form-error">This is a required field</span>
            </div>
            <div class="form__row form__nav">
              <div class="form__fieldset">
                <div class="form__field--wrapper form__submit form__field--submit">
                  <button type="submit" id="comicrelief_payin_success_submit" name="comicrelief_payin_success[submit]" class="btn btn--ruby" disabled="true">Submit story</button>
                </div>
              </div>
            </div>
        </div>
      </div>
    </div>
  </div>
  <div class="cards cards--three-grid-centre">
    <div class="cards__wrapper">
      <div class="card">
          <div class="card__image">
              <img src="kss-assets/images/1-1-img.jpg" alt="Where does the money go" />
          </div>
          <div class="card__content-wrapper">
            <div class="cards__content">
              <h3>Where your money goes</h3>
              <p>Sport Relief uses the money you give to fund incredible projects, in the UK and around the world, that tackle important social issues and ensure people are safe, happy and healthy.</p>
              <p><a href="https://www.sportrelief.com/where-your-money-goes" title="Where your money goes">Find out more</a></p>
            </div>
          </div>
      </div>
      <div class="card">
          <div class="card__image">
            <img src="kss-assets/images/1-1-img.jpg" alt="Team sports relief" />
          </div>
          <div class="card__content-wrapper">
            <div class="cards__content">
              <h3>#teamsportrelief</h3>
              <p>Show that you're part of a nation-wide team of awesome fundraisers, by sharing photos of your Sport Relief activites on your social channels. Don't forget to tag us with #teamsportrelief!</p>
              <p><a href="https://www.instagram.com/explore/tags/teamsportrelief/" title="Instagram Team Sport Relief">See the team</a></p>
            </div>
          </div>
      </div>
    </div>
  </div>
</section>
Source: _payin-styleguide.scss, line 7