Style Guide

Link

HTML code

Bold Text

HTML code

Italic Text

HTML code

Intro Text

Lorum ipsum tempor interdum suspendisse augue quam, venenatis nec congue at accu msan atmassa ed quis.

HTML code

Horizontal Rule

HTML code

Dotted Rule

HTML code

Blockquote

“Nunc facilisis tempor felis vel lobortis. Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam.”

Quoted person's name in bold

HTML code

Table

HTML code

Headline

Maecenas vel nisi quam

Donec magna lacus, malesuada venenatis molestie a, dignissim vitae sapien. Nunc facilisis tempor felis vel lobortis. Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam. Etiam tellus turpis, molestie eu elementum nec, dictum in arcu.

HTML code

Heading Level 2

Maecenas vel nisi quam

Donec magna lacus, malesuada venenatis molestie a, dignissim vitae sapien. Nunc facilisis tempor felis vel lobortis. Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam. Etiam tellus turpis, molestie eu elementum nec, dictum in arcu.

HTML code

Heading Level 3

Maecenas vel nisi quam

Donec magna lacus, malesuada venenatis molestie a, dignissim vitae sapien. Nunc facilisis tempor felis vel lobortis. Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam. Etiam tellus turpis, molestie eu elementum nec, dictum in arcu.

HTML code

Heading Level 4

Maecenas vel nisi quam

Donec magna lacus, malesuada venenatis molestie a, dignissim vitae sapien. Nunc facilisis tempor felis vel lobortis. Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam. Etiam tellus turpis, molestie eu elementum nec, dictum in arcu.

HTML code

Heading Level 5

Maecenas vel nisi quam

Donec magna lacus, malesuada venenatis molestie a, dignissim vitae sapien. Nunc facilisis tempor felis vel lobortis. Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam. Etiam tellus turpis, molestie eu elementum nec, dictum in arcu.

HTML code

Heading Level 6

Maecenas vel nisi quam

Donec magna lacus, malesuada venenatis molestie a, dignissim vitae sapien. Nunc facilisis tempor felis vel lobortis. Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam. Etiam tellus turpis, molestie eu elementum nec, dictum in arcu.

HTML code

Info Message

This is an info message

HTML code

Success Message

This is a success message

HTML code

Warning Message

This is a warning message!

HTML code

Bullet List

• Duis et augue in purus condimentum condimentum eget eget odio.
• Maecenas vel nisi quam.
• Nullam in orci sit amet.
• In lacus libero, egestas eget venenatis vitae, posuere porttitor elit. Vivamus vel tristique magna.

HTML code

Numbered List

1. Duis et augue in purus condimentum condimentum eget eget odio.
2. Maecenas vel nisi quam.
3. Nullam in orci sit amet.
4. In lacus libero, egestas eget venenatis vitae, posuere porttitor elit. Vivamus vel tristique magna.

HTML code

Ticked List

• Duis et augue in purus condimentum condimentum eget eget odio.
• Maecenas vel nisi quam.
• Nullam in orci sit amet.
• In lacus libero, egestas eget venenatis vitae, posuere porttitor elit. Vivamus vel tristique magna.

HTML code

Crossed List

• Duis et augue in purus condimentum condimentum eget eget odio.
• Maecenas vel nisi quam.
• Nullam in orci sit amet.
• In lacus libero, egestas eget venenatis vitae, posuere porttitor elit. Vivamus vel tristique magna.

HTML code

Two-Column List

• Duis et augue in purus condimentum condimentum eget eget odio.
• Duis et augue in purus condimentum condimentum eget eget odio.
• Duis et augue in purus condimentum condimentum eget eget odio.
• Duis et augue in purus condimentum condimentum eget eget odio.

HTML code

Two-Column List (Divided)

• Duis et augue in purus condimentum condimentum eget eget odio.
• Duis et augue in purus condimentum condimentum eget eget odio.
• Duis et augue in purus condimentum condimentum eget eget odio.
• Duis et augue in purus condimentum condimentum eget eget odio.

HTML code

Block List (links)

• Duis et augue in purus condimentum
• Duis et augue in purus condimentum
• Duis et augue in purus condimentum
• Duis et augue in purus condimentum

HTML code

Two-Column Block List (links)

• Duis et augue in purus condimentum
• Duis et augue in purus condimentum
• Duis et augue in purus condimentum
• Duis et augue in purus condimentum

HTML code

Definition List

In at sodales nisl

Sed non mauris felis, non iaculis ante. Duis et augue in purus condimentum condimentum eget eget odio. Etiam eget sem urna.

Vestibulum ante ipsum primis

Proin faucibus sem sed sapien dictum iaculis. Sed in lacus magna.

HTML code

PDF Download

Download our Brochure (276kb)
In order to view PDF documents you will need Adobe PDF Reader

Shortcode

Inserted Link

• Patient and visitor feedback survey

HTML code

Inserted External Link

• Patient and visitor feedback survey

HTML code

Share Icons

• Share on Facebook
• Share on Twitter
• Send by Email

Shortcode

Left-Aligned Image

Settings:

• Alignment: Left
• Size: Medium

HTML code

Right-Aligned Image

Settings:

• Alignment: Right
• Size: Medium

HTML code

Left-Aligned Image (Captioned)

Image caption purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam

Settings:

• Alignment: Left
• Size: Medium

HTML code

Right-Aligned Image (Captioned)

Image caption purus condimentum condimentum eget eget odio. Etiam eget sem urna. Maecenas vel nisi quam

Settings:

• Alignment: Right
• Size: Medium

HTML code

Highlight Button

HTML code

Alert Button

HTML code

Feature Button

HTML code

Feature Button (alternative)

HTML code

Highlight Badge

Shortcode

Alert Badge

Shortcode

Feature Badge

Shortcode

Feature Badge (alternative)

Shortcode

Basic Panel

HTML / Shortcode

Highlight Panel

HTML / Shortcode

Alert Panel

HTML / Shortcode

Feature Panel

HTML / Shortcode

Feature Panel (alternative)

HTML / Shortcode

Highlight Block

HTML / Shortcode

Alert Block

HTML / Shortcode

Feature Block

HTML / Shortcode

Feature Block (alternative)

HTML / Shortcode

Highlight Action Panel

HTML / Shortcode

Alert Action Panel

HTML / Shortcode

Feature Action Panel

HTML / Shortcode

Feature Action Panel (alternative)

HTML / Shortcode

Tagged News

Memories of wife Lorraine as Jeff sets off on epic bike ride

Posted on 15th August 2017 in Events, Fundraising, Hospitals, The trust

Precious memories of a much-loved wife and mum will be at the forefront of Jeff Bennison’s mind, as he sets off on an epic motorcycle adventure from The James Cook University Hospital on Saturday August 19. Jeff, from Leyburn, is completing an extraordinary Land’s End to John ‘o’ Groats motorcycle ride with a difference, in a bid to raise funds for the High Dependency Unit (HDU) and Intensive Care Unit (ICU) at The James Cook University Hospital, both of whom cared for wife Lorraine in her final days.

£10,000 a year fundraiser – it’s Simply ‘D Best’

Posted on 15th August 2017 in Fundraising, The trust

Raising £10,000 is an amazing achievement – but try doing it nine years on the go! The ‘D BEST’ charity team has collected more than £90,000 for local good causes since 2008.

View more news

HTML / Shortcode

Donate Button

Donate now

HTML / Shortcode

Media Element (without linked image)

Maecenas vel nisi quam

Maecenas diam mi, pellentesque quis tempor eget, interdum fringilla nulla. Morbi ac augue est. Etiam quis dolor sagittis felis consectetur mollis vitae quis erat. Vestibulum sit amet odio vel eros hendrerit lobortis et eget augue.

HTML / Shortcode

Media Element (with linked image)

Maecenas vel nisi quam

Maecenas diam mi, pellentesque quis tempor eget, interdum fringilla nulla. Morbi ac augue est. Etiam quis dolor sagittis felis consectetur mollis vitae quis erat. Vestibulum sit amet odio vel eros hendrerit lobortis et eget augue.

HTML / Shortcode