Typography
Headings
Heading 1
Heading 2
Heading 3
Heading 4
Bold
Use bold text to make something stand out.
Italics
Italic is great for adding emphasis.
Paragraph
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
Lists
Bullet List
- List Item 1
- List Item 2
- List Item 3
- List Item 4
Numbered List
- List Item 1
- List Item 2
- List Item 3
- List Item 4
Blockquotes
Blockquotes are great for including extracts from the main text that deserve to stand out.
Text alignment
Left Aligned
This paragraph of text is aligned left, this is the default and we would recommending this as much as possible throughout the site to keep it consistent.
Center Aligned
This paragraph of text is aligned centrally and can be used to make certain blocks of text stand out.
Right Aligned
This paragraph of text is aligned right and can be used wherever you see fit.
Anchors
Links within text are called anchors, look like this and can be clicked to visit the site.
Colours
Colours
#ff4057
#900048
#ffc1af
#21003b
#ff825f
#838383
#f4f2f2
#323232
#6f6f6f
Shortcodes
Alert
How to use
Copy the code below exactly how it appears and change the text as required.
[alert]Warning[/alert]
Quote with citation
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. Joe Bloggs
How to use
Copy the code below exactly how it appears and change the text as required.
[blockquote quote="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor." cite="Joe Bloggs"]
Button
How to use
Copy the code below exactly how it appears and change the text as required.
[button label="Click me to visit the homepage!" link="https://www.bspr.co.uk/"]
Download
How to use
Copy the code below exactly how it appears and change the text as required.
[download title="Download this PDF" link="https://www.google.com"]
Panel
Title
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
How to use
Copy the code below exactly how it appears and change the text as required.
[panel title="Title" content="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."]