[container extra=”row”]
[one_half extra=”” anim=””]
[heading icon=”” type=”standard” size=”h2″ extra=””]Tabs[/heading]
[tabs]
[tabh]
[tab id=”0″ class=”active”] Sample Tab #1
[/tab] [tab id=”1″ class=””] Sample Tab #2
[/tab] [tab id=”2″ class=””] Sample Tab #3
[/tab] [/tabh] [tabc] [tabrow id=”0″ class=”active”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor.[/tabrow] [tabrow id=”1″ class=””]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus.[/tabrow] [tabrow id=”2″ class=””]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor.aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor.[/tabrow] [/tabc] [/tabs] [heading icon=”” type=”standard” size=”h2″ extra=””]Progress Bars[/heading] [progress_bar percentage=”90″ name=” HTML/CSS ” value=”90″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”95″ name=”Photoshop” value=”95″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”75″ name=”Joomla” value=”75″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”100″ name=”Wordpress” value=”100″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”40″ name=” Stripped Progress Bar ” value=”40″ type=”progress-striped” colour=”progress-bar-success”] [progress_bar percentage=”20″ name=” Colored Progress Bars ” value=”20″ type=”colored” colour=”progress-bar-info”] [progress_bar percentage=”60″ name=”” value=”60″ type=”colored” colour=”progress-bar-warning”] [progress_bar percentage=”80″ name=”” value=”80″ type=”colored” colour=”progress-bar-danger”] [/one_half] [one_half extra=”” anim=””] [heading icon=”” type=”standard” size=”h2″ extra=””]Accordion[/heading] [accordions id=”ac”] [accgroup] [acchead id=”ac” tab_id=”ac0″ class=”active”]Accordion Panel #1[/acchead] [accbody tab_id=”ac0″ in=”in”]Accordion Body #1[/accbody] [/accgroup] [accgroup] [acchead id=”ac” tab_id=”ac1″ class=””]Accordion Panel #2[/acchead] [accbody tab_id=”ac1″ in=””]Accordion Body #2[/accbody] [/accgroup] [accgroup] [acchead id=”ac” tab_id=”ac2″ class=””]Accordion Panel #3[/acchead] [accbody tab_id=”ac2″ in=””]Accordion Body #3[/accbody] [/accgroup] [/accordions] [heading icon=”” type=”standard” size=”h2″ extra=””]Toggles[/heading] [toggles id=”sn”] [togglegroup] [togglehead id=”sn” tab_id=”sn0″]Toggle Panel #1[/togglehead] [togglebody tab_id=”sn0″]Toggle Body #1[/togglebody] [/togglegroup] [togglegroup] [togglehead id=”sn” tab_id=”sn1″]Toggle Panel #2[/togglehead] [togglebody tab_id=”sn1″]Toggle Body #2[/togglebody] [/togglegroup] [togglegroup] [togglehead id=”sn” tab_id=”sn2″]Toggle Panel #3[/togglehead] [togglebody tab_id=”sn2″]Toggle Body #3[/togglebody] [/togglegroup] [/toggles] [/one_half] [/container] [divider extra=””] [container extra=”row”] [one_full extra=”” anim=”bounceInRight”] [heading icon=”” type=”standard” size=”h2″ extra=””]Alert Boxes[/heading] [alert type=”alert-standard” close=”true”]Oh snap! Change a few things up and try submitting again.[/alert] [alert type=”alert-warning” close=”true”]Warning! Best check yo self, you’re not looking too good. [/alert] [alert type=”alert-error” close=”true”]Oh snap! Change a few things up and try submitting again.[/alert] [alert type=”alert-info” close=”true”]Heads up! This alert needs your attention, but it’s not super important. [/alert] [alert type=”alert-success” close=”true”]Well done! You successfully read this important alert message. [/alert] [/one_full] [/container] [divider extra=””] [container extra=”row”] [one_half extra=”” anim=””][heading size=”h2″ extra=””]Tooltips[/heading] [paragraph extra=””]Tight pants next level keffiyeh [imic_tooltip link=”#” direction=”top” title=”Default Tooltip”]you probably[/imic_tooltip] haven’t heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney’s fixie sustainable quinoa 8-bit american apparel [imic_tooltip link=”#” direction=”bottom” title=”Another Tooltip”]have a[/imic_tooltip] terry richardson vinyl chambray.[/paragraph] [/one_half] [one_half extra=”” anim=””][heading size=”h3″ extra=””]Modal Box[/heading] [paragraph extra=””]Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults.[/paragraph] [paragraph extra=””]Toggle a modal via JavaScript by clicking the button below. It will slide down and fade in from the top of the page.[/paragraph] [modal_box id=”mymodal” title=”Modal title” text=”One fine body…” button=”Launch demo modal”][/one_half] [/container] [divider extra=””] [imic_count to=”9000″ speed=”2000″ icon=”fa-glass” textstyle=”div” subject=”Drinks Consumed”] [imic_count to=”96″ speed=”2500″ icon=”fa-map-marker” textstyle=”div” subject=”Places Visited”] [imic_count to=”1500″ speed=”3000″ icon=”fa-music” textstyle=”div” subject=”Songs Played”] [imic_count to=”1400″ speed=”3500″ icon=”fa-dribbble” textstyle=”div” subject=”hours played”] [divider extra=””] [container extra=”row”] [one_full extra=”” anim=””][heading size=”h2″ extra=””]Forms[/heading] [paragraph extra=””]Individual form controls automatically receive some global styling.[/paragraph] [imic_form][/one_full] [/container] [divider extra=””] [container extra=”row”] [two_third extra=”” anim=””][heading size=”h2″ extra=””]Buttons[/heading] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=””]Default[/imic_button] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=””]Primary[/imic_button] [imic_button colour=”btn-success” type=”enabled” link=”http://” target=”_self” extraclass=””]Success[/imic_button] [imic_button colour=”btn-info” type=”enabled” link=”http://” target=”_self” extraclass=””]Info[/imic_button] [imic_button colour=”btn-warning” type=”enabled” link=”http://” target=”_self” extraclass=””]Warning[/imic_button] [imic_button colour=”btn-danger” type=”enabled” link=”http://” target=”_self” extraclass=””]Danger[/imic_button] [heading size=”h2″ extra=”spaced”]Button Disabled[/heading] [imic_button colour=”btn-primary” type=”disabled” link=”http://” target=”_self” extraclass=””]Primary button[/imic_button] [imic_button colour=”btn-default” type=”disabled” link=”http://” target=”_self” extraclass=””]Button[/imic_button] [heading size=”h2″ extra=”spaced”]Labels[/heading] [label type=”label-default”]Default[/label] [label type=”label-primary”]Primary[/label] [label type=”label-success”]Success[/label] [label type=”label-info”]Info[/label] [label type=”label-warning”]Warning[/label] [label type=”label-danger”]Danger[/label][/two_third][one_third extra=”” anim=””][heading size=”h2″ extra=””]Button Sizes[/heading] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-lg”]Large Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-lg”]Large Button[/imic_button][/paragraph] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=””]Default Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=””]Default Button[/imic_button][/paragraph] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-sm”]Small Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-sm”]Small Button[/imic_button] [/paragraph] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-xs”]Extra Small Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-xs”]Extra Small Button[/imic_button] [/paragraph] [/one_third] [/container]
[/tab] [tab id=”1″ class=””] Sample Tab #2
[/tab] [tab id=”2″ class=””] Sample Tab #3
[/tab] [/tabh] [tabc] [tabrow id=”0″ class=”active”]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor.[/tabrow] [tabrow id=”1″ class=””]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus.[/tabrow] [tabrow id=”2″ class=””]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce velit tortor, dictum in gravida nec, aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor.aliquet non lorem. Donec vestibulum justo a diam ultricies pellentesque. Quisque mattis diam vel lacus tincidunt elementum. Sed vitae adipiscing turpis. Aenean ligula nibh, molestie id viverra a, dapibus at dolor.[/tabrow] [/tabc] [/tabs] [heading icon=”” type=”standard” size=”h2″ extra=””]Progress Bars[/heading] [progress_bar percentage=”90″ name=” HTML/CSS ” value=”90″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”95″ name=”Photoshop” value=”95″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”75″ name=”Joomla” value=”75″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”100″ name=”Wordpress” value=”100″ type=”” colour=”progress-bar-primary”] [progress_bar percentage=”40″ name=” Stripped Progress Bar ” value=”40″ type=”progress-striped” colour=”progress-bar-success”] [progress_bar percentage=”20″ name=” Colored Progress Bars ” value=”20″ type=”colored” colour=”progress-bar-info”] [progress_bar percentage=”60″ name=”” value=”60″ type=”colored” colour=”progress-bar-warning”] [progress_bar percentage=”80″ name=”” value=”80″ type=”colored” colour=”progress-bar-danger”] [/one_half] [one_half extra=”” anim=””] [heading icon=”” type=”standard” size=”h2″ extra=””]Accordion[/heading] [accordions id=”ac”] [accgroup] [acchead id=”ac” tab_id=”ac0″ class=”active”]Accordion Panel #1[/acchead] [accbody tab_id=”ac0″ in=”in”]Accordion Body #1[/accbody] [/accgroup] [accgroup] [acchead id=”ac” tab_id=”ac1″ class=””]Accordion Panel #2[/acchead] [accbody tab_id=”ac1″ in=””]Accordion Body #2[/accbody] [/accgroup] [accgroup] [acchead id=”ac” tab_id=”ac2″ class=””]Accordion Panel #3[/acchead] [accbody tab_id=”ac2″ in=””]Accordion Body #3[/accbody] [/accgroup] [/accordions] [heading icon=”” type=”standard” size=”h2″ extra=””]Toggles[/heading] [toggles id=”sn”] [togglegroup] [togglehead id=”sn” tab_id=”sn0″]Toggle Panel #1[/togglehead] [togglebody tab_id=”sn0″]Toggle Body #1[/togglebody] [/togglegroup] [togglegroup] [togglehead id=”sn” tab_id=”sn1″]Toggle Panel #2[/togglehead] [togglebody tab_id=”sn1″]Toggle Body #2[/togglebody] [/togglegroup] [togglegroup] [togglehead id=”sn” tab_id=”sn2″]Toggle Panel #3[/togglehead] [togglebody tab_id=”sn2″]Toggle Body #3[/togglebody] [/togglegroup] [/toggles] [/one_half] [/container] [divider extra=””] [container extra=”row”] [one_full extra=”” anim=”bounceInRight”] [heading icon=”” type=”standard” size=”h2″ extra=””]Alert Boxes[/heading] [alert type=”alert-standard” close=”true”]Oh snap! Change a few things up and try submitting again.[/alert] [alert type=”alert-warning” close=”true”]Warning! Best check yo self, you’re not looking too good. [/alert] [alert type=”alert-error” close=”true”]Oh snap! Change a few things up and try submitting again.[/alert] [alert type=”alert-info” close=”true”]Heads up! This alert needs your attention, but it’s not super important. [/alert] [alert type=”alert-success” close=”true”]Well done! You successfully read this important alert message. [/alert] [/one_full] [/container] [divider extra=””] [container extra=”row”] [one_half extra=”” anim=””][heading size=”h2″ extra=””]Tooltips[/heading] [paragraph extra=””]Tight pants next level keffiyeh [imic_tooltip link=”#” direction=”top” title=”Default Tooltip”]you probably[/imic_tooltip] haven’t heard of them. Photo booth beard raw denim letterpress vegan messenger bag stumptown. Farm-to-table seitan, mcsweeney’s fixie sustainable quinoa 8-bit american apparel [imic_tooltip link=”#” direction=”bottom” title=”Another Tooltip”]have a[/imic_tooltip] terry richardson vinyl chambray.[/paragraph] [/one_half] [one_half extra=”” anim=””][heading size=”h3″ extra=””]Modal Box[/heading] [paragraph extra=””]Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults.[/paragraph] [paragraph extra=””]Toggle a modal via JavaScript by clicking the button below. It will slide down and fade in from the top of the page.[/paragraph] [modal_box id=”mymodal” title=”Modal title” text=”One fine body…” button=”Launch demo modal”][/one_half] [/container] [divider extra=””] [imic_count to=”9000″ speed=”2000″ icon=”fa-glass” textstyle=”div” subject=”Drinks Consumed”] [imic_count to=”96″ speed=”2500″ icon=”fa-map-marker” textstyle=”div” subject=”Places Visited”] [imic_count to=”1500″ speed=”3000″ icon=”fa-music” textstyle=”div” subject=”Songs Played”] [imic_count to=”1400″ speed=”3500″ icon=”fa-dribbble” textstyle=”div” subject=”hours played”] [divider extra=””] [container extra=”row”] [one_full extra=”” anim=””][heading size=”h2″ extra=””]Forms[/heading] [paragraph extra=””]Individual form controls automatically receive some global styling.[/paragraph] [imic_form][/one_full] [/container] [divider extra=””] [container extra=”row”] [two_third extra=”” anim=””][heading size=”h2″ extra=””]Buttons[/heading] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=””]Default[/imic_button] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=””]Primary[/imic_button] [imic_button colour=”btn-success” type=”enabled” link=”http://” target=”_self” extraclass=””]Success[/imic_button] [imic_button colour=”btn-info” type=”enabled” link=”http://” target=”_self” extraclass=””]Info[/imic_button] [imic_button colour=”btn-warning” type=”enabled” link=”http://” target=”_self” extraclass=””]Warning[/imic_button] [imic_button colour=”btn-danger” type=”enabled” link=”http://” target=”_self” extraclass=””]Danger[/imic_button] [heading size=”h2″ extra=”spaced”]Button Disabled[/heading] [imic_button colour=”btn-primary” type=”disabled” link=”http://” target=”_self” extraclass=””]Primary button[/imic_button] [imic_button colour=”btn-default” type=”disabled” link=”http://” target=”_self” extraclass=””]Button[/imic_button] [heading size=”h2″ extra=”spaced”]Labels[/heading] [label type=”label-default”]Default[/label] [label type=”label-primary”]Primary[/label] [label type=”label-success”]Success[/label] [label type=”label-info”]Info[/label] [label type=”label-warning”]Warning[/label] [label type=”label-danger”]Danger[/label][/two_third][one_third extra=”” anim=””][heading size=”h2″ extra=””]Button Sizes[/heading] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-lg”]Large Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-lg”]Large Button[/imic_button][/paragraph] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=””]Default Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=””]Default Button[/imic_button][/paragraph] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-sm”]Small Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-sm”]Small Button[/imic_button] [/paragraph] [paragraph extra=””] [imic_button colour=”btn-primary” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-xs”]Extra Small Button[/imic_button] [imic_button colour=”btn-default” type=”enabled” link=”http://” target=”_self” extraclass=”” size=”btn-xs”]Extra Small Button[/imic_button] [/paragraph] [/one_third] [/container]