Shortcodes
Get started
Get started
Columns
12
6
6
4
4
4
3
3
3
3
2
2
2
2
2
2
8
4
Color theme
Dark background
Add .dark-bg class to any element to use this (#243135) background color in the global section (or .light-bg class to use default background color #2D3E43)
Notice!
If you change background color by adding .dark-bg or .light-bg, background of some features in this theme also will be inverse.
Base CSS
Typography
Simple heading:
h1. Heading 1
h2. Heading 2
h3. Heading 3
h4. Heading 4
h5. Heading 5
h6. Heading 6
Add .with-border class to the heading:
h1. Heading 1
h2. Heading 2
h3. Heading 3
h4. Heading 4
h5. Heading 5
h6. Heading 6
Blockquotes
h2. Heading 2
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante. Author name
Lists
Unordered
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Integer posuere erat a ante
- Risus et vulputate mollis
- Massa nulla aliquam neque et vulputate mollis
- Pellentesque ornare, risus et vulputate mollis
- Massa nulla aliquam neque
Ordered
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Integer posuere erat a ante
- Risus et vulputate mollis
- Massa nulla aliquam neque et vulputate mollis
- Pellentesque ornare, risus et vulputate mollis
- Massa nulla aliquam neque
Tables
Default styles
Add .table class to any <table>.
| First Name | Last Name | Username |
|---|---|---|
| Mark | Otto | @mdo |
| Jacob | Thornton | @fat |
| Larry the Bird | ||
Hover styles
Add .table-hover to enable a hover state.
| First Name | Last Name | Username |
|---|---|---|
| Mark | Otto | @mdo |
| Jacob | Thornton | @fat |
| Larry the Bird | ||
Forms
Button colors
Disabled buttons
Button sizes
Emphasis classes
Muted. Fusce dapibus, tellus ac cursus commodo, tortor mauris nibh.
Text-info. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis.
Text-success. Duis mollis, est non commodo luctus, nisi erat porttitor ligula.
Text-warning. Etiam porta sem malesuada magna mollis euismod.
Text-error. Donec ullamcorper nulla non metus auctor fringilla.
Labels
Default
Info
Success
Warning
Important
Inverse
Badges
1 2 4 6 8 10Helper classes
.section - increment margin-top and margin-bottom by 30 pixels.
.margin-0 - remove all margins.
.margin-top-10 - increment margin-top by 10 pixels.
.margin-bottom-10 - increment margin-bottom by 10 pixels.
.margin-top-15 - increment margin-top by 15 pixels.
.margin-bottom-15 - increment margin-bottom by 15 pixels.
.margin-top-20 - increment margin-top by 20 pixels.
.margin-bottom-20 - increment margin-bottom by 20 pixels.
.color - add a green color.
.trigger - add dashed border to any links.
.code - wrap inline snippets of code.
.parallax - add the element with background-image to create parallax effect.
.black-bg - add to fill the area small dots.
.text - add with parent .parallax class to create animated text in parallax section.
.no-aminate - add with .text class to stop the animation.
.goTop - add to scroll top.
.link-list - add to the <ul> element to leave the links a text color (#B1C1C6).
.large-view - add with .parallax class. Create fullscreen parallax block (height 100%).
.default-view - add with .parallax class. Create medium parallax block (height 350px).
.small-view - add with .parallax class. Create small parallax block (height 150px).
Components
Progress bar
Design
80%Development
75%Branding
40%Usability
60%Concepts
100%Responsive video
Thumbnails
Pricing tables
Single purchase
$ 10 / mo
- Single installation
- Full Responsive
- Parallax Effect
- HTML5 & CSS3
- Smooth scrolling
- Unlimited Support
- Bootstrap 2.3.0
Multiple purchase
$ 50 / mo
- Multiple installation
- Full Responsive
- Parallax Effect
- HTML5 & CSS3
- Smooth scrolling
- Unlimited Support
- Bootstrap 2.3.0
Extended license
$ 500 / mo
- Unlimited installation
- Full Responsive
- Parallax Effect
- HTML5 & CSS3
- Smooth scrolling
- Unlimited Support
- Bootstrap 2.3.0
