Heading | Special Content | Bubbles | Boxes & Legends
--- | --- | --- | ---
Heading 1 # This is an Heading 1 | Heading 2 ## This is an Heading 2 | Highlight Code
    This is a sample
| Bubbles Gray Around Buble's content goes here! Put author name here | Box Notice This is a notice
Heading 3 ### This is an Heading 3 | Heading 4 #### This is an Heading 4 | Quote 1 Wisi sed pede Phasellus Vestibulum elit consequat consequat eu pellr. | Quote 2 Wisi sed pede Phasellus Vestibulum elit consequat consequat eu pellr. | Bubbles Gray Square Buble's content goes here! Put author name here | Box Success This is a box success
Heading 5 ##### This is an Heading 5 | Heading 6 ###### This is an Heading 6 | Highlight Your highlight phrase goes here! | Drop Cap T his is a Magazine Style Drop Cap. The first letter in this paragraph is big. JA Templates bring into your Jooomla template the magazine drop cap technique and CSS2 includes the first-letter pseudo class. In all fairness to the paragraph itself we probably should type enough to see how it looks when it is surrounded by its textual friends by using more words. | Bubbles Black Around Buble's content goes here! Put author name here | Box Error This is a box error
|  | Block Dropcap Special 01This is a sample block Dropcap. 02This is a sample block Dropcap. 03This is a sample block Dropcap. | Bubbles Black Square Buble's content goes here! Put author name here | Box Sticky This is a box sticky
Badge | BlockDropcap Square AThis is a sample block Dropcap. BThis is a sample block Dropcap. CThis is a sample block Dropcap. | Bubbles Blue Around Buble's content goes here! Put author name here | Box Download This is a box download
Badge Top Use module suffix: _badge badge-top to put this badge on any module you like! | Badge New Use module suffix: _badge badge-new to put this badge on any module you like! | BlockDropcap Around aThis is a sample block Dropcap. bThis is a sample block Dropcap. cThis is a sample block Dropcap. | Bubbles Blue Square Buble's content goes here! Put author name here | Box Blank This is a box blank
Badge Pick Use module suffix: _badge badge-pick to put this badge on any module you like! | Badge Hot Use module suffix: _badge badge-hot to put this badge on any module you like! |  |  | Box Hilite This is a box hilite
| INSET | tABLE & fROM | Legend ### Legend the view content demo
| Left Inset Left Inset TitleThis is a left Inset. Use <span class="inset-left"><span class="inset-title">Your content goes here!</span> to create a left Inset! | Right Inset Right Inset TitleThis is a right Inset. Use <span class="inset-right"><span class="inset-title">Your content goes here!</span> to create a right Inset! | Table
Column One | Column Two | Column Three
--- | --- | ---
Row One / TD One | Row One / TD Two | Row One / TD Three
Row Two / TD One | Row Two / TD Two | Row Two / TD Three
Row Three / TD One | Row Three / TD Two | Row Three / TD Three
Row Four / TD One | Row Four / TD Two | Row Four / TD Three
| From Fieldset & Legend tags Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla dapibus sapien vel mauris viverra quis euismod dui tincidunt. Phasellus laoreet mattis est, eu vulputate sapien suscipit ac. Vestibulum porttitor justo a est elementum luctus. Nulla ac pharetra nulla. Quisque metus orci. Sample Input Sample Radio Input Sample CheckBox Input: Sample Select Field: Sample Textarea Field: Textarea text | Legend Hilite ### Legend the view content demo

icon Style
Error icon Use class="icon icon-error" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Message icon Use class="icon icon-message" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Tips icon Use class="icon icon-tips" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Note icon Use class="icon icon-note" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Tag icon Use class="icon icon-tag" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | RSS icon Use class="icon icon-rss" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this.
Cart icon Use class="icon icon-cart" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Page icon Use class="icon icon-page" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Demo icon Use class="icon icon-demo" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Download icon Use class="icon icon-download" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Discussion icon Use class="icon icon-discussion" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Info icon Use class="icon icon-info" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this.
Readmore icon Use class="icon icon-readmore" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Doc icon Use class="icon icon-doc" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Signup icon Use class="icon icon-signup" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Login icon Use class="icon icon-login" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Submit icon Use class="icon icon-submit" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Extension icon Use class="icon icon-extension" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this.
User icon Use class="icon icon-user" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Group icon Use class="icon icon-group" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Key icon Use class="icon icon-key" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Birthday icon Use class="icon icon-birthday" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Photo icon Use class="icon icon-photo" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Calendar icon Use class="icon icon-calendar" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this.
Address icon Use class="icon icon-address" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Phone icon Use class="icon icon-phone" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Mobi icon Use class="icon icon-mobi" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Fax icon Use class="icon icon-fax" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Email icon Use class="icon icon-email" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Website icon Use class="icon icon-website" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this.
Yahoo icon Use class="icon icon-yahoo" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Gmail icon Use class="icon icon-gmail" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Skype icon Use class="icon icon-skype" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | MSN icon Use class="icon icon-msn" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Facebook icon Use class="icon icon-facebook" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this. | Twitter icon Use class="icon icon-twitter" with any HTML element (H3, SPAN, P, LI, INPUT, BUTTON,...) to make this.

List | Button | CSS3 Button | TAG
--- | --- | --- | ---
Ordered List This is a sample Ordered List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | White button & Demo icon Live demo | White button Gray Use class="button-css3 white" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | White tag 1 001This is a sample white tag | White tag 2 This is a sample white bigrounded tag
Unordered List This is a sample Unordered List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | Silver button & Info icon Club Info | Gray button Gray Use class="button-css3 white" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Gray tag 1 001This is a sample gray tag | Gray tag 2 This is a sample gray bigrounded tag
Definition List This is a sample Definition List. Condimentum quis. Congue Quisque augue elit dolor. Condimentum quis sapien. Congue Quisque augue elit dolor. Nunc cursus sem et pretium sapien eget. Condimentum quis sapien. Congue Quisque augue elit dolor. Nunc cursus sem et pretium sapien eget. | Gray button & Discussion icon Discussion | Black button Black Use class="button-css3 black" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Black tag 1 001This is a sample black tag | Black tag 2 This is a sample black bigrounded tag
Arrow List This is a sample Arrow List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | Black button & Download icon Download | Blue Bigrounded button Blue Use class="button-css3 blue bigrounded" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Blue tag 1 001This is a sample blue tag | Blue tag 2 This is a sample blue bigrounded tag
Star List This is a sample Star List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | Blue button & Readmore icon Read More | Green Bigrounded button Green Use class="button-css3 green bigrounded" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Green tag 1 001This is a sample green tag | Green tag 2 This is a sample green bigrounded tag
Check List This is a sample Check List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | Red button & Doc icon Documentation | Red Smallbutton button Red Use class="button-css3 red smallbutton" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Red tag 1 001This is a sample red tag | Red tag 2 This is a sample red bigrounded tag
Bullet List This is a sample Bullet List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | Pink button & Signup icon Sign Up | Pink Smallbutton button Pink Use class="button-css3 pink smallbutton" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Pink tag 1 001This is a sample pink tag | Pink tag 2 This is a sample pink bigrounded tag
Cross List This is a sample Cross List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | Orange button & Submit icon Submit A Ticket | Orange Bigbutton button Orange Use class="button-css3 orange bigbutton" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Orange tag 1 001This is a sample orange tag | Orange tag 2 This is a sample orange bigrounded tag
Add List This is a sample Add List. Lorem ipsum dolor sit amet consectetuer. Condimentum quis. Congue Quisque augue elit dolor nibh. | Violet button & Extension icon Extension | Rosy Bigbutton button Rosy Use class="button-css3 rosy bigbutton" with any HTML element (A, INPUT, BUTTON, SPAN, P, H3 ...) to make this. | Rosy tag 1 001This is a sample rosy tag | Rosy tag 2 This is a sample rosy bigrounded tag
| Green button & Login icon Login |  |  |