Colours

Primary / light
#918ED6
Primary / Light
#DF7260
Primary
#D4432B
Primary / Dark
#9F3220
Primary / Darkest
#120F57
Secondary / light
#E9A195
Secondary / Light
#DF7260
Secondary
#D4432B
Secondary / Dark
#9F3220
Secondary / Darkest
#6A2115
Tertiary / light
#F2E9D9
Tertiary / Light
#EAD2B0
Tertiary
#E1BB87
Tertiary / Dark
#B38C5A
Tertiary / Darkest
#84622D
Error
#FF2400
Warning
#FFCE2D
Success
#4E8B43
Tertiary / Dark
#B38C5A
Tertiary / Darkest
#84622D

Typography

Header 1

Font: Helvetica Neue / Color: #000000 / Size: 50px/52px

Header 2

Font: Georgia / Color: #747473 / Size: 36px

Header 3

Font: Georgia / Color: #747473 / Size: 30px

Header 4

Font: Georgia / Color: #747473 / Size: 24px
Header 5
Font: Georgia / Color: #747473 / Size: 12px
Header 6
Font: Georgia / Color: #747473 / Size: 10px

This is body copy. 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.

Product Cards

DR MARTENS 101 Black Virginia Boots 30700001 DR MARTENS 101 Black Virginia Boots 30700001
On Sale
DR MARTENS

101 Black Virginia Boots

€94,50
€94,50 €189,00
Size
EU
UK
US
DICKIES 13Inch Multi Pocket Short Rec Whitecap Gray DK0A4XOZF901 DICKIES 13Inch Multi Pocket Short Rec Whitecap Gray DK0A4XOZF901
On Sale
DICKIES

13Inch Multi Pocket Short Rec Whitecap Gray

€45,50
€45,50 €65,00
Size
EU
UK
US
NEW BALANCE 1906R Spruce Driftwood M1906RRC NEW BALANCE 1906R Spruce Driftwood M1906RRC
On Sale
NEW BALANCE

1906R Spruce Driftwood

€102,00
€102,00 €170,00
Size
EU
UK
US
NORTH FACE 1996 Retro Nuptse Jacket NF0A3C8D-ZU31 NORTH FACE 1996 Retro Nuptse Jacket NF0A3C8D-ZU31
NORTH FACE

1996 Retro Nuptse Jacket

€350,00
€350,00
Size
EU
UK
US

Grid

As agreed with design, we will use CSS Grid for the over-arching layout of the website. For this, we have created a twelve column grid ( with spacing and gaps ), use .moonbase mb-10 to create a grid use the grid. Children of the grid will want to use .col-span-1, .col-span-2

6
6
4
4
4
3
3
3
3
2
2
2
2
2
2
1
2
3
4
5
6
7
8
9
10
11
12

Buttons

Primary - Default
Hover State
Disabled State
Secondary - Default
Hover State
Disabled State
Tertiary - Default
Hover State
Disabled State
Outline - Default
Hover State
Disabled State

Form

Accordions

Accordion 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.

Accordion 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.

Table

Statement Summary
Account Due Date Amount Period
Visa - 3412 04/01/2016 $1,190 03/01/2016 - 03/31/2016
Visa - 6076 03/01/2016 $2,443 02/01/2016 - 02/29/2016
Corporate AMEX 03/01/2016 $1,181 02/01/2016 - 02/29/2016
Visa - 3412 02/01/2016 $842 01/01/2016 - 01/31/2016

Drawers