# Front-end Style Guide

## Layout

The designs were created to the following widths:

- Mobile: 375px
- Desktop: 1440px

## Colors

### Primary

- Light red (CTA text): hsl(356, 100%, 66%)
- Very light red (CTA hover background): hsl(355, 100%, 74%)
- Very dark blue (headings): hsl(208, 49%, 24%)

### Neutral

- White (text): hsl(0, 0%, 100%)
- Grayish blue (footer text): hsl(240, 2%, 79%)
- Very dark grayish blue (body copy): hsl(207, 13%, 34%)
- Very dark black blue (footer background): hsl(240, 10%, 16%)

### Gradient

Background gradient - Intro/CTA mobile nav:

- Very light red: hsl(13, 100%, 72%)
- Light red: hsl(353, 100%, 62%)

Background gradient - body:

- Very dark gray blue: hsl(237, 17%, 21%)
- Very dark desaturated blue: hsl(237, 23%, 32%)

## Typography

### Body Copy

- Font size: 16px

### Fonts

- Family: [Overpass](https://fonts.google.com/specimen/Overpass?preview.text_type=custom)
- Weights: 300, 600

- Family: [Ubuntu](https://fonts.google.com/specimen/Ubuntu?preview.text_type=custom)
- Weights: 400, 500, 700
