shadow

Style

>> Example of normal paragraph text:

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry’s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.


>> Titles

h1

h2

h3

h4

h5

>> Gaps / Seperators

We use different size seperators throughout the website. This allows us to create consistent gaps vertically

<div class=”seperator10″></div>
<div class=”seperator20″></div>
<div class=”seperator30″></div>
<div class=”seperator40″></div>


>> Success Message

Should use this code throughout the website in all sections, for all users:

<p class=”msg-ok”><i class=”fa fa-check” aria-hidden=”true”></i> Exam booked with SUCCESS, please check your email for instructions</p>

To look like this


>> Notification Messages

Should use this code throughout the website in all sections, for all users:

<p class=”notice”><i class=”fa fa-info-circle” aria-hidden=”true”></i> There are no exam dates at the moment</p>

To look like this


>> Failure Messages

Should use this code throughout the website in all sections, for all users:

<p class=”msg-err”><i class=”fa fa-ban” aria-hidden=”true”></i> The credentials provided are wrong</p>

To look like this


>> General Notes

  • All pages have a <h1> title at the top of them. This makes the whole system flow better and is good practice.