Style Guide
This is body text content. Quo usque tandem abutere, Catilina, patientia nostra? Hi omnes lingua, institutis, legibus inter se differunt. Pellentesque habitant morbi tristique senectus et netus.
Sed haec quis possit intrepidus aestimare tellus. Fabio vel iudice vincam, sunt in culpa qui officia. Mercedem aut nummos unde unde extricat, amaras.
Sociis natoque penatibus et magnis dis parturient. Nihilne te nocturnum praesidium Palati, nihil urbis vigiliae. Unam incolunt Belgae, aliam Aquitani, tertiam. Fictum, deserunt mollit anim laborum astutumque!
Heading 1
Only for use in the page title; not for use in the content area.
Heading 2
To be used for all major headings, particularly those referenced with Anchor Links.
Heading 3
For sub-headings under an H2
Heading 4
For sub-headings under an H3
Anchor Links
Use Anchor Links for key content on a page, that should have a link from the top. ie:
- Swimming Lessons
- How to Pay
- Booking
- Contact
Example: Aquatic Centre
Example: External Link
Accordions
Use Accordions to display a compact group of related content, such as:
- Swimming lesson options
- Bus routes
- FAQs
- etc.
Example: Local Transit
Primary Actions
These are things like Booking, Registration, Payment, etc. There should only be one or two primary actions on a page.
Secondary Actions
Two Column Demo
Non equidem invideo, miror magis posuere velit aliquet. Plura mihi bona sunt, inclinet, amari petere vellent. Quo usque tandem abutere, Catilina, patientia nostra? Ut enim ad minim veniam, quis nostrud exercitation. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
Fabio vel iudice vincam, sunt in culpa qui officia. Ab illo tempore, ab est sed immemorabili. Unam incolunt Belgae, aliam Aquitani, tertiam.
Three Column Demo
Non equidem invideo, miror magis posuere velit aliquet. Plura mihi bona sunt, inclinet, amari petere vellent. Quo usque tandem abutere, Catilina, patientia nostra? Ut enim ad minim veniam, quis nostrud exercitation. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
Accordion #1
Quo usque tandem abutere, Catilina, patientia nostra? Ut enim ad minim veniam, quis nostrud exercitation. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
Fabio vel iudice vincam, sunt in culpa qui officia. Ab illo tempore, ab est sed immemorabili. Unam incolunt Belgae, aliam Aquitani, tertiam.
Accordion #2
Petierunt uti sibi concilium totius Galliae in diem certam indicere. Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
Fabio vel iudice vincam, sunt in culpa qui officia. Ab illo tempore, ab est sed immemorabili. Unam incolunt Belgae, aliam Aquitani, tertiam.
Accordion #3
Fabio vel iudice vincam, sunt in culpa qui officia. Ab illo tempore, ab est sed immemorabili. Unam incolunt Belgae, aliam Aquitani, tertiam.
Accordion #4
Quo usque tandem abutere, Catilina, patientia nostra? Ut enim ad minim veniam, quis nostrud exercitation. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
Background Image Demo (on left)
Read More Example (below)
Quo usque tandem abutere, Catilina, patientia nostra? Ut enim ad minim veniam, quis nostrud exercitation. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
Quo usque tandem abutere, Catilina, patientia nostra? Ut enim ad minim veniam, quis nostrud exercitation. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua.
Fabio vel iudice vincam, sunt in culpa qui officia. Ab illo tempore, ab est sed immemorabili. Unam incolunt Belgae, aliam Aquitani, tertiam.
Grid of Features (Icons + Text)
Image Collage Example
