Shortcodes

Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue. Proin sodales libero eget ante. Nulla quam. Aenean laoreet. Vestibulum nisi lectus, commodo ac, facilisis ac, ultricies eu, pede. Ut orci risus, accumsan porttitor, cursus quis, aliquet eget, justo. Sed pretium blandit orci. Ut eu diam at pede suscipit sodales.

Grid system

For the purposes of this theme we used 12-column system where the smallest section is 70px wide. You can see example of all columns you can use on illustration bellow. You can use any combination of the columns you want as long as the sum of their numbers is twelve (for example span8 and span4).

1
1
1
1
1
1
1
1
1
1
1
1
2
2
2
2
2
2
3
3
3
3
4
4
4
5
7
6
6
7
5
8
4
9
3
10
2
11
1
12

Icons Graciously provided by Glyphicons

  • icon-glass
  • icon-music
  • icon-search
  • icon-envelope
  • icon-heart
  • icon-star
  • icon-star-empty
  • icon-user
  • icon-film
  • icon-th-large
  • icon-th
  • icon-th-list
  • icon-ok
  • icon-remove
  • icon-zoom-in
  • icon-zoom-out
  • icon-off
  • icon-signal
  • icon-cog
  • icon-trash
  • icon-home
  • icon-file
  • icon-time
  • icon-road
  • icon-download-alt
  • icon-download
  • icon-upload
  • icon-inbox
  • icon-play-circle
  • icon-repeat
  • icon-refresh
  • icon-list-alt
  • icon-lock
  • icon-flag
  • icon-headphones
  • icon-volume-off
  • icon-volume-down
  • icon-volume-up
  • icon-qrcode
  • icon-barcode
  • icon-tag
  • icon-tags
  • icon-book
  • icon-bookmark
  • icon-print
  • icon-camera
  • icon-font
  • icon-bold
  • icon-italic
  • icon-text-height
  • icon-text-width
  • icon-align-left
  • icon-align-center
  • icon-align-right
  • icon-align-justify
  • icon-list
  • icon-indent-left
  • icon-indent-right
  • icon-facetime-video
  • icon-picture
  • icon-pencil
  • icon-map-marker
  • icon-adjust
  • icon-tint
  • icon-edit
  • icon-share
  • icon-check
  • icon-move
  • icon-step-backward
  • icon-fast-backward
  • icon-backward
  • icon-play
  • icon-pause
  • icon-stop
  • icon-forward
  • icon-fast-forward
  • icon-step-forward
  • icon-eject
  • icon-chevron-left
  • icon-chevron-right
  • icon-plus-sign
  • icon-minus-sign
  • icon-remove-sign
  • icon-ok-sign
  • icon-question-sign
  • icon-info-sign
  • icon-screenshot
  • icon-remove-circle
  • icon-ok-circle
  • icon-ban-circle
  • icon-arrow-left
  • icon-arrow-right
  • icon-arrow-up
  • icon-arrow-down
  • icon-share-alt
  • icon-resize-full
  • icon-resize-small
  • icon-plus
  • icon-minus
  • icon-asterisk
  • icon-exclamation-sign
  • icon-gift
  • icon-leaf
  • icon-fire
  • icon-eye-open
  • icon-eye-close
  • icon-warning-sign
  • icon-plane
  • icon-calendar
  • icon-random
  • icon-comment
  • icon-magnet
  • icon-chevron-up
  • icon-chevron-down
  • icon-retweet
  • icon-shopping-cart
  • icon-folder-close
  • icon-folder-open
  • icon-resize-vertical
  • icon-resize-horizontal

Image Position

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet. Duis sagittis ipsum. Praesent mauris. Fusce nec tellus sed augue semper porta. Mauris massa. Vestibulum lacinia arcu eget nulla. Class aptent taciti sociosqu ad litora torquent per conubia.

Video frame

Quisque libero magna, pharetra vel accumsan non, porta sit amet nisl. Cras magna ipsum, molestie vitae mollis consequat, eleifend et libero. Nulla at pretium nisi. Vestibulum aliquet ipsum sit amet eget lorem sollicitudin tincidunt. Aliquam accumsan, ipsum at feugiat vulputate, enim quam egestas risus, ac iterdum consectetur nunc eros et est. Ut euismod luctus nunc, non placerat mi elementum ac. Aenean sodales est sit amet magna gravida vestibulum. Fusce cursus lacinia mattis. Proin at risus ante, in volutpat lectus.

Sed ultricies dignissim turpis, ultricies sagittis massa imperdiet ut. Nullam imperdiet viverra venenatis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent erat tortor, dignissim non pulvinar et, laoreet et massa. Curabitur at lorem purus, aliquam aliquet ipsum. Nullam at orci magna. Aenean dignissim orci ut diam pretium tempor. Praesent bibendum tincidunt purus nec commodo. Cras suscipit dui ut quam suscipit consectetur. Mauris in lacus vitae neque iaculis porttitor laoreet faucibus ante. Aliquam erat volutpat. Sed in gravida tortor. Donec tincidunt pellentesque sollicitudin quisque libero magna, pharetra vel accumsan non, porta sit amet nisl. Cras magna ipsum, molestie vitae mollis consequat, eleifend et libero. Nulla at pretium nisi. Vestibulum aliquet ipsum sit amet lorem sollicitudin tincidunt. Aliquam accumsan, ipsum at feugiat vulputate, enim quam egestas risus, interdum consectetur nunc.

Quisque libero magna, pharetra vel accumsan non, porta sit amet nisl. Cras magna ipsum, molestie vitae mollis consequat, eleifend et libero. Nulla at pretium nisi. Vestibulum aliquet ipsum sit amet eget lorem sollicitudin tincidunt. Aliquam accumsan, ipsum at feugiat vulputate, enim quam egestas risus, ac iterdum consectetur nunc eros et est. Ut euismod luctus nunc, non placerat mi elementum ac. Aenean sodales est sit amet magna gravida vestibulum. Fusce cursus lacinia mattis. Proin at risus ante, in volutpat lectus.

Sed ultricies dignissim turpis, ultricies sagittis massa imperdiet ut. Nullam imperdiet viverra venenatis. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Praesent erat tortor, dignissim non pulvinar et, laoreet et massa. Curabitur at lorem purus, aliquam aliquet ipsum. Nullam at orci magna. Aenean dignissim orci ut diam pretium tempor. Praesent bibendum tincidunt purus nec commodo. Cras suscipit dui ut quam suscipit consectetur. Mauris in lacus vitae neque iaculis porttitor laoreet faucibus ante. Aliquam erat volutpat. Sed in gravida tortor. Donec tincidunt pellentesque sollicitudin quisque libero magna, pharetra vel accumsan non, porta sit amet nisl. Cras magna ipsum, molestie vitae mollis consequat, eleifend et libero. Nulla at pretium nisi. Vestibulum aliquet ipsum sit amet lorem sollicitudin tincidunt. Aliquam accumsan, ipsum at feugiat vulputate, enim quam egestas risus, interdum consectetur nunc.

Toggle

Morbi in dui quis est pulvinar ullamcorper

Nulla facilisi. Integer lacinia sollicitudin massa. Morbi in dui quis est pulvinar ullamcorper. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue.

Integer lacinia sollicitudin massa ultricies

Morbi in dui quis est pulvinar ullamcorper. Nulla facilisi. Integer lacinia sollicitudin massa. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue.

Vestibulum tincidunt malesuada tellus

Integer lacinia sollicitudin massa. Morbi in dui quis est pulvinar ullamcorper. Nulla facilisi. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue.

Tabs

Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit agna,endrerit sit amet, tincidunt ac, viverra sed, nulla.

Quisque diam lorem, interdum vitae,dapibus ac, scelerisque vitae, pede.

Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit agna,endrerit sit amet, tincidunt ac, viverra sed, nulla.

Quisque diam lorem, interdum vitae,dapibus ac, scelerisque vitae, pede.

Suspendisse sollicitudin velit sed leo. Ut pharetra augue nec augue. Nam elit agna,endrerit sit amet, tincidunt ac, viverra sed, nulla.

Quisque diam lorem, interdum vitae,dapibus ac, scelerisque vitae, pede.

Accordion

Morbi in dui quis est pulvinar ullamcorper

Nulla facilisi. Integer lacinia sollicitudin massa. Morbi in dui quis est pulvinar ullamcorper. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue.

Integer lacinia sollicitudin massa ultricies

Morbi in dui quis est pulvinar ullamcorper. Nulla facilisi. Integer lacinia sollicitudin massa. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue.

Vestibulum tincidunt malesuada tellus

Integer lacinia sollicitudin massa. Morbi in dui quis est pulvinar ullamcorper. Nulla facilisi. Cras metus. Sed aliquet risus a tortor. Integer id quam. Morbi mi. Quisque nisl felis, venenatis tristique, dignissim in, ultrices sit amet, augue.

Buttons

Button class="" Description
btn Standard gray button with gradient
btn btn-primary Provides extra visual weight and identifies the primary action in a set of buttons
btn btn-info Used as an alternate to the default styles
btn btn-success Indicates a successful or positive action
btn btn-warning Indicates caution should be taken with this action
btn btn-danger Indicates a dangerous or potentially negative action
btn btn-inverse Alternate dark gray button, not tied to a semantic action or use

Message Box Styles

Info Style
Lorem ipsum dolor sit amet, sed amet eget aliquam, rutrum habitant laboriosam ut, nascetur sit suscipit non totam, facilisi tristique.
Success Style
Lorem ipsum dolor sit amet, sed amet eget aliquam, rutrum habitant laboriosam ut, nascetur sit suscipit non totam, facilisi tristique.
Warning Style
Lorem ipsum dolor sit amet, sed amet eget aliquam, rutrum habitant laboriosam ut, nascetur sit suscipit non totam, facilisi tristique.
Error Style
Lorem ipsum dolor sit amet, sed amet eget aliquam, rutrum habitant laboriosam ut, nascetur sit suscipit non totam, facilisi tristique.