Style Guide

Use this guide to help you navigate the design files. In a professional work place you would be given this information in many different deliverables like a sketch file, photoshop file, or invision link. But for this week I am providing the necessary information to get you started.

Font family can be found here: https://fonts.google.com/specimen/Roboto

GENERAL STYLES

Background: #FFFFFF
Color: #222222
Font Family: Roboto, Arial, sans-serif

Page Specific

Home Page

Recent Projects Gray Square: #D8D8D8
Button borders: #222222

Services Page

Tab selected background: #5E9FB9
Tab Hover background: #222222
Tab Hover color: #FFF;

Footer

Background: #828282

General Text

Font Weight: Regular
Font Size: 16px
Line Height: 24px

Jumbotron Headers

Font Weight: Bold
Font Size: 64px
Line Height: 75px
Color: #FFFFFF

Sub Headers

Font Weight: Bold
Font Size: 28px
Color: #222222

Footer Headings

Font Weight: Regular
Font Size: 20px
Line Height: 24px
Color: #FFFFFF

Footer Text

Font Weight: Regular
Font Size: 14px
Line Height: 26px
Color: #FFFFFF

Navigation Logo

Font Weight: Bold
Font Size: 24px
Color: #FFFFFF

Navigation Text (Expanded)

Font Weight: Bold
Font Size: 48px
Line Height: 85px
Color: #FFFFFF
Hover Color: #222222