ATOMS
BRAND COLORS
NEUTRAL COLORS
UTILITY COLORS
FONTS
Primary font: “Open Sans”, sans serif
Secondary font: Not set
Tertiary font: Not set
IMAGE MASKS
class="image-mask-1"
class="image-mask-2"
class="image-mask-3"
FORM FIELDS / ELEMENTS
TEXT
HEADINGS
Specify the line height here if changed from default
Heading Level 1
Heading Level 2
Heading Level 3
Heading Level 4
Heading Level 5
Heading Level 6
INLINE ELEMENTS
Strong is used to indicate strong importance
This text has added emphasis
The b element is stylistically different text from normal text, without any special importance
The i element is text that is set off from the normal text
The u element is text with an unarticulated, though explicitly rendered, non-textual annotation
This text is deleted and
This text has a strikethrough
SuperscriptSup
Subscript for things like H2O
This small text is small for for fine print, etc.
PARAGRAPH
Default left <p>
Nam porttitor blandit accumsan. Ut vel dictum sem, a pretium dui. In malesuada enim in dolor euismod, id commodo mi consectetur. Curabitur at vestibulum nisi. Nullam vehicula nisi velit. Mauris turpis nisl, molestie ut ipsum et, suscipit vehicula odio. Vestibulum
BLOCKQUOTE
Nam porttitor blandit accumsan. Ut vel dictum sem, a pretium dui. In malesuada enim in dolor euismod, id commodo mi consectetur. Curabitur at vestibulum nisi. Nullam vehicula nisi velit. Mauris turpis nisl, molestie ut ipsum et, suscipit vehicula
TABLES
DEFAULT TABLE
# | First Name | Last Name | Username |
---|---|---|---|
1 | Mark | Otto | @mdo |
2 | Jacob | Thornton | @fat |
3 | Larry | the Bird |
STRIPED TABLE
# | First Name | Last Name | Username |
---|---|---|---|
1 | Mark | Otto | @mdo |
2 | Jacob | Thornton | @fat |
3 | Larry | the Bird |
LISTS
UNORDERED LIST
- List Item 1
- List Item 2
- List Item 3
ORDERED LIST
- List Item 1
- List Item 2
- List Item 3
.small-dots
- List Item 1
- List Item 2
- List Item 3
ul.list-group
- List Item 1
- List Item 2
- List Item 3
ol.list-group
- List Item 1
- List Item 2
- List Item 3
MOLECULES
ORGANISMS
TEAM BLOCK OVERVIEW
[ff_team_overview]
[ff_team_overview showposts=3]TEAM BLOCK OVERVIEW CAROUSEL
[ff_team_overview heading="Other profiles" heading_class="f-15" showposts=9 class="carousel-cols-3 navigation-style-2 mt-50"]
[ff_team_overview heading="Other profiles" heading_class="f-15" showposts=9 class="carousel-cols-3 navigation-style-2 mt-50"]INSTAGRAM FEED
[ff_instagram_carousel]
[ff_instagram_carousel num=10] [ff_instagram_carousel feed_type="hashtag" hashtag="webdesign"]
[ff_instagram_carousel num=10 feed_type="hashtag" hashtag="webdesign"]NEWS
[ff_news_query showposts="NUM_HERE"]
[ff_news_query showposts=3][ff_news_query style="2" showposts="NUM_HERE"]
[ff_news_query style="2" showposts=3]ROTATING / CAROUSELS
[ff_cta_carousel bg_color="#COLOR_HEX_CODE_HERE"]
[ff_item template="cta-1" heading="TEXT_HERE" text="TEXT_HERE" btn_text="TEXT_HERE" btn_link="#LINK_HERE"]
[/ff_cta_carousel]
Heading here
Heading here
Heading here
[ff_testimonials_carousel heading="TEXT_HERE" limit=NUMBER]
.custom-scroll
Just add “custom-scroll” for your div that have a fix height or width, Just add “custom-scroll” for your div that have a fix height or width
Just add “custom-scroll” for your div that have a fix height or width, Just add “custom-scroll” for your div that have a fix height or width
Just add “custom-scroll” for your div that have a fix height or width, Just add “custom-scroll” for your div that have a fix height or width
Just add “custom-scroll” for your div that have a fix height or width, Just add “custom-scroll” for your div that have a fix height or width
.custom-scroll.alt-1