Buy Now
Your Cart

Style Guide

Typography

H1

Lorem ipsum dolor sit amet, consectetur adipiscing elit,

H2

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incidi

H3

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et

H4

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore ma

p

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. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

.heavy

h1

h2

H3

H4

Duis aute irure

.alt_font

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore ma

.sub_text
Lorem ipsum dolor sit

Buttons

Main CTA

.btn

Add To Cart CTA

.btn .btn_green

Buy Now

Main CTA

.btn

Text Button

.text-link

Text Button
+ Arrow

.text-link .text-arrow

Text Button
+ Heavy

.text-link .heavy

Text Button
+ Arrow
+ Heavy

.text-link .text-arrow .heavy

Text Buttons + White

+ .white

Colors

.light_grey_bg

.gradient_main_bg

.gradient_dark_bg

.gradient_faded

.dark_grey_transperant

.gradient_main_text

applied to text element

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod t

.green_text

applied to text element

Lorem ipsum dolor sit

.subtle_box

adds box shadow

Lorem ipsum dolor sit

.white_bg_w_shadow

adds box shadow

Lorem ipsum dolor sit

Padding

.padding

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

.vert_padding

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

.vert_padding_double

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

.vert_padding_double

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

.bottom_padding

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

.bottom_padding_double

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

.add_margin_top

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

.add_margin_bottom

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,

Grid

Grid-Uniform with 2 .large--six--twelfths

quis nostrud exercitteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est labor

Grid with 2 .large--six--twelfths

quis nostrud exercitteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est labor

Grid with 3 .large--four--twelfths

Grid reverse with 2 .large--six--twelfths

quis nostrud exercitteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est labor

Grid with canceled float and vertical aligned middle ( .vert_align_middle )

quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voltion ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate veluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est labor

quis nostrud exercitteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est labor

Grid reverse with canceled left / right margin ( .cancel_grid_margin )

Pre-Made Sections

3 Up Blocks

consectetur adipiscing elit

Lorem elit, sed do eiusmod tempor incididunt

consectetur adipiscing elit

Lorem ipsum doadipiscing elit, sed do eiusmod tscing elit, sed do eiusmod tscing elit, sed do eiusmod tscing elit, sed do eiusmod tscing elit, sed do eiusmod tempor incididunt

consectetur adipiscing elit

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt

Thinner Inner Block ( .medium_center )

onsectetur adipiscing eli

onsectetur adipiscing elivonsectetur adipiscing eli

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididuntLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididuntLorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt

Watch Video

Carousel Example

Carousel Example 2

Customer Reviews Carousel

Feature With 2 Up

velit esse cill

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. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est labor

quis nostrud exercitation

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. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est labor