please note: all vertical spacing and css line‐height ... · 12 col bootstrap page layout with...

13
1100px page width, 20px gutter 20px gutters 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible by 8 (8, 16, 24,32,40 etc.) TURN ON PAGE GUIDES IN PHOTOSHOP TO VIEW VERTICAL ALIGNMENT REFER TO PHOTOSHOP FILES FOR ACCURATE FONT SIZES & LINE HEIGHTS Use Google Font‐family: Roboto Font‐weight(s): 300(light), 400(normal), 700(bold/strong) H1 font‐size:42px color: #be0d20; H1 font‐weight:300; Default body text= font‐size: 15px; line‐height:24px; font‐weight:400; color:#282828 Text links, bold/strong= #be0d20 Page bkg color=#ededed 104px 248px 120px 48px 336px 336px WIDGET HEADER: Font‐size: 22‐24px; Line‐height:24px; Color: #ffffff; WIDGET COPY: Font‐size: 14px; Line‐height:16px; Color: #ffffff; LINK COLOR: #ffffcc; PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible by 8 (8, 16, 24,32,40 etc.) ALL WIDGETS: width: 340px height:272px 20px gutters 20px gutters

Upload: others

Post on 09-Jul-2020

5 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

1100px page width, 20px gutter20px gutters

12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible by 8 (8, 16, 24,32,40 etc.)TURN ON PAGE GUIDES IN PHOTOSHOP TO VIEW VERTICAL ALIGNMENTREFER TO PHOTOSHOP FILES FOR ACCURATE FONT SIZES & LINE HEIGHTSUse Google Font‐family: RobotoFont‐weight(s): 300(light), 400(normal), 700(bold/strong)H1 font‐size:42px color: #be0d20; H1 font‐weight:300;Default body text= font‐size: 15px; line‐height:24px; font‐weight:400; color:#282828Text links, bold/strong= #be0d20Page bkg color=#ededed

104px

248px

120px

48px

336px

336px

WIDGET HEADER: Font‐size: 22‐24px;Line‐height:24px;Color: #ffffff;

WIDGET COPY:Font‐size: 14px;Line‐height:16px;Color: #ffffff;

LINK COLOR: #ffffcc;

PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible by 8 (8, 16, 24,32,40 etc.) 

ALL WIDGETS:width: 340pxheight:272px

20px gutters

20px gutters

Page 2: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible by 8 (8, 16, 24,32,40 etc.) 

Nav menu bkg=#3b3b3b

Slider bkg: #979797Slider images to be provided

Page color#ededed

Header bkg=#ffffff

Background‐color: #be0d20border‐top:1px solid #ffffff

Page color#ededed

Font‐size: 26px;Font‐weight: 300; 

Font‐size: 12px;Line‐height:16pxFont‐weight: 400; 

Font‐size: 11px;Font‐weight: 400,700; 

footer bkg color#ffffff

Each column in footer has: padding‐left:20px;

Button color: #be0d20

www. http://www.totalankleinstitute.com/

Border: 3px solid #be0d20

BUTTONborder:1px solid #ffffff;padding:15px;

Page 3: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Breadcrumb area

These are graphics

SECONDARY NAVbackground‐color:#be0d20font‐size: 14px;line‐height: 32px;padding‐left:15px;padding‐right:15px;

InBone‐Products.psdhttp://www.totalankleinstitute.com/inbone‐products.html

Font‐size:22px;Line‐height:24px;Font‐weight: 700;

Font‐size:14px;Line‐height: 16px;Font‐weight: 400;

Color:#ffffff;

Page 4: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Breadcrumbtext color: #282828;font‐size:15px;font‐weight:700;Height: 48px;

H1=42pxH1 weight: 300;Bold text=18pxBody text= 15pxLine‐height: 24px;

List ItemFont‐size:15pxLine‐height: 32px;

Section headerFont‐size: 28pxFont‐weight: 700;

Inbone‐P

roducts‐To

tal‐Ankle.p

sdhttp

://www.to

talanklein

stitute.co

m/in

bone‐an

kle.htm

l

Body text= 15pxLine‐height: 24px;

Page 5: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Title: 22px #be0d20Line‐height:16px;

Body text= 14pxLine‐height: 16px;

Title: 22px #be0d20Line‐height:24px;

Body text= 14pxLine‐height: 16px;

Products‐P

ROPHEC

Y.psd

http

://www.to

talanklein

stitute.co

m/prophecy‐p

reoperative‐n

avigation‐gu

ides.h

tml

Title: 22px #be0d20Line‐height:24px;Body text= 14pxLine‐height: 24px;

Title: 22px #be0d20Line‐height:24px;Body text= 14pxLine‐height: 24px;

Page 6: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Breadcrumbtext color: #282828font‐size:15px;font‐weight:700;Height: 48px;

These are graphics

H1=42pxH1 weight: 300;Bold text=18pxBody text= 15pxLine‐height: 24px;

INFINITY‐Products.psdhttp://www.totalankleinstitute.com/infinity‐products.html

Page 7: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Body textfont‐size:15pxline‐height: 24px;

line‐height: 32px;

INFIN

ITY‐Products‐To

tal‐Ankle.p

sdhttp

://www.to

talanklein

stitute.co

m/in

finity‐an

kle.htm

l

Section headersfont‐size:20pxline‐height: 24px;font‐weight:700;

font‐size:15pxline‐height: 32px;

Border: 1px solid #ededed

Page 8: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Resource‐Center.psdhttp://www.totalankleinstitute.com/resource‐center.html

Button color: #be0d20

Page 9: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Physician‐Stories.psdhttp://www.totalankleinstitute.com/physician‐stories.html

Page 10: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Events.psdhttp://www.totalankleinstitute.com/events.html

Page 11: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

In‐the‐News.psdhttp://www.totalankleinstitute.com/in‐the‐news.html

META  DATA1Font‐color:#be0d20;

POST BODYBody text= 15pxLine‐height: 24px;

Page 12: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

About‐us.psdhttp://www.totalankleinstitute.com/about‐us.html

Page 13: PLEASE NOTE: All vertical spacing and CSS line‐height ... · 12 col Bootstrap page layout with 20px gutters. PLEASE NOTE: All vertical spacing and CSS line‐height should be divisible

Contact.psdhttp://www.totalankleinstitute.com/contact.html

Recreate form at:http://www.totalankleinstitute.com/contact.html

Button color: #be0d20