Template

Style Guide

Layout
Section Left and Right Padding:

Base

Tablet

Mobile L

Mobile

Small:

20px

20px

20px

20px

Normal:

40px

40px

40px

40px

Container:

Base

Tablet

Mobile L

Mobile

Max Width:

1360px

None

None

None

Micro Spacing:

Base

Tablet

Mobile L

Mobile

Micro:

4px

4px

4px

4px

Nano:

8px

8px

8px

8px

Mini:

10px

10px

10px

10px

Tiny:

12px

12px

12px

12px

Small:

16px

16px

16px

16px

Semi:

20px

20px

20px

20px

Base Spacing:

Base

Tablet

Mobile L

Mobile

Base:

24px

24px

24px

24px

Medium:

32px

32px

32px

32px

Regular:

40px

40px

40px

40px

Big:

48px

48px

48px

48px

Large:

56px

56px

56px

56px

Extra Large:

64px

64px

64px

64px

Macro Spacing:

Base

Tablet

Mobile L

Mobile

Huge:

72px

72px

72px

72px

Massive:

88px

88px

88px

88px

Giant:

96px

96px

96px

96px

Colossal:

128px

128px

128px

128px

Enourmous:

156px

156px

156px

156px

Epic:

200px

200px

200px

200px

Fonts

Main:

Instrument Sans

Italic:

Lora

Size:

Base

Tablet

Mobile L

Mobile

Body S:

14px

14px

14px

14px

Body:

16px

16px

16px

16px

Body M:

18px

18px

18px

18px

Body L:

20px

20px

20px

20px

H6:

20px

20px

20px

20px

H5:

24px

24px

24px

24px

H4:

32px

30px

30px

28px

H3:

36px

34px

34px

30px

H2:

40px

36px

36px

32px

H1:

48px

40px

40px

34px

Height:

Base

Tablet

Mobile L

Mobile

Body S:

100%

100%

100%

100%

Body:

140%

140%

140%

140%

Body M:

140%

140%

140%

140%

Body L:

140%

140%

140%

140%

Heading:

120%

120%

120%

120%

Font Weight:

Base

Tablet

Mobile L

Mobile

Normal

400

400

400

400

Medium

500

500

500

500

Semi-Bold

600

600

600

600

Letter Spacing:

Base

Tablet

Mobile L

Mobile

H4:

-0.64px

-0.6px

-0.6px

-0.56px

H3:

-0.72px

-0.68px

-0.68px

-0.6px

H2:

-0.8px

-0.72px

-0.72px

-0.64px

H1:

-1.44px

-1.2px

-1.2px

-1.02px

Radius & Blur
Items:

Base

Tablet

Mobile L

Mobile

Blur:

32px

32px

32px

32px

Small:

8px

8px

8px

8px

Normal:

12px

12px

12px

12px

Large:

24px

24px

24px

24px

Turbo Large:

100px

100px

100px

100px

Colors
Light Black Green
Black Green
Green
Black
Black 60%
Black 40%
Black 15%
Black 7%
Black 5%
White
White 60%
White 15%
White 7%
Gray
Orange
Rich Text

H1 - Heading 1

H2 - Heading 2

H3 - Heading 3

H4 - Heading 4

H5 - Heading 5
H6 - Heading 6

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.

Solar Panels Image

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.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

Form
Eco Small Consultant ImageEco Small Consultant ImageEco Small Consultant Image

Great ideas need great consultation.

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.