guides-style.md

Guides Style Guidelines

Colors

@light-blue: #f7f9fc;
@blue: #c7d5f6;
@text-color: #212c3f;

General Text

• font-family: Chaparral Pro (served from fonts.com)
• font-size: 18px
• font-weight: 300
• line-height: 24px
• Maximum text width: 740px
• color: @text-color

Headlines

• font-family: Brandon Grotesque (served from fonts.com)

Guide Title / H1

• font-size: 39px
• font-weight: 900

H2

• font-size: 26px
• font-weight: 900
• underline 1px solid @text-color

Code

• font-family: Eco Coding (served from fonts.com)

Block

• font-size: 14px

• line-height: 24px

• font-weight: regular: 400, bold: 700

• padding: 20px 24px

• margin: 0 24px

• background-color: @light-blue

• border: 1px solid @blue

• border-radius: 2px

Inline

• font-size: 14px

• line-height: 24px

• font-weight: 400

• padding: 0 .5em

• background-color: @light-blue

• border: 1px solid @blue

• border-radius: 2px

Headlines

H2

• font-size: 24px
• font-weight: 700

Fonts.com

Embed script (css based)

<link type="text/css" rel="stylesheet" href="http://fast.fonts.net/cssapi/612f00fa-0426-4384-9f33-d44fc6370a63.css"/>

Embed script (js based)

<script type="text/javascript" src="http://fast.fonts.net/jsapi/612f00fa-0426-4384-9f33-d44fc6370a63.js"></script>

Font family

font-family:'Eco Coding W01';
font-family:'Chaparral W01';
font-family:'Brandon Grotesque W01';