[title title=”Features” type=”h1″ underline=”1″ different_values=”0″]
[/title]
[html format=”ckeditor” different_values=”0″]

The following is a preview of appearance and behavior of LivIcons.

[/html]
[title title=”Any color, any size” type=”h2″ underline=”1″ different_values=”0″]
[/title]
[row different_values=”0″]
[col tablet=”4″ desktop=”4″ style_margin_right=”99″ different_values=”0″]
[html format=”ckeditor” different_values=”0″]

LivIcons are based on SVG (scalable vector graphic) in all modern browsers and on VML (Vector Markup Language) in IE6 – IE8. So these icons can be any size with good look at any devices. And, of course, any color can be applied too.

[/html]
[/col]
[col tablet=”7″ desktop=”7″ different_values=”0″]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-small”]







[/styledcontainer]
[/col]
[/row]
[title title=”Animated and static” type=”h2″ underline=”1″ different_values=”0″ style_padding_top=”75″]
[/title]
[row different_values=”0″]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[html format=”ckeditor” different_values=”0″]

The main feature is LivIcons are animated, but they can be static like any other icons too.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″ extra_classes=”text-center”]
[html format=”ckeditor” different_values=”0″]

We are animated!

[/html]
[html format=”ckeditor” different_values=”0″ style_margin_top=”80″]

We are static.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-center”]




[/styledcontainer]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-center” style_margin_top=”20″]




[/styledcontainer]
[/col]
[/row]
[title title=”Click and hover events” type=”h2″ underline=”1″ different_values=”0″ style_padding_top=”75″]
[/title]
[row different_values=”0″]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[html format=”ckeditor” different_values=”0″]

LivIcons support two types of events: ‘click’ and ‘hover’.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″ extra_classes=”text-center”]
[html format=”ckeditor” different_values=”0″]

We live on ‘click’.

[/html]
[html format=”ckeditor” different_values=”0″ style_margin_top=”80″]

We live on ‘hover’.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-center”]




[/styledcontainer]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-center” style_margin_top=”20″]




[/styledcontainer]
[/col]
[/row]
[title title=”Looped animation” type=”h2″ underline=”1″ different_values=”0″ style_padding_top=”75″]
[/title]
[row different_values=”0″]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[html format=”ckeditor” different_values=”0″]

Animation can be repeated infinitely if appropriate.

Please don’t get carried away with this option.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″ extra_classes=”text-center”]
[html format=”ckeditor” different_values=”0″]

Click to start/stop animations.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-center”]




[/styledcontainer]
[/col]
[/row]
[title title=”Original colors by default” type=”h2″ underline=”1″ different_values=”0″ style_padding_top=”75″]
[/title]
[row different_values=”0″]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[html format=”ckeditor” different_values=”0″]

This option matches to different icons with traditional colors, such as browsers, social networks etc.

Note: Not animated from v1.1!

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″ extra_classes=”text-center”]
[html format=”ckeditor” different_values=”0″]

Icons with ‘original’ colors.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-center”]




[/styledcontainer]
[/col]
[/row]
[title title=”Shadowed” type=”h2″ underline=”1″ different_values=”0″ style_padding_top=”75″]
[/title]
[row different_values=”0″]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[html format=”ckeditor” different_values=”0″]

For webkit browsers you can apply css filter ‘drop-shadow’.

Note: work in Chrome 18.0+, Safari 6.0+, iOS Safari 6.0+, Blackberry Browser 10.0+, Chrome for Android 25.0+

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″ extra_classes=”text-center”]
[html format=”ckeditor” different_values=”0″]

We have a shadow.

[/html]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[styledcontainer type=”content-block” border=”frame border-radius” overlay=”0″ different_values=”0″ style_background_color=”f5f5f5″ extra_classes=”text-center”]




[/styledcontainer]
[/col]
[/row]
[title title=”Call-to-action buttons” type=”h2″ underline=”1″ different_values=”0″ style_margin_top=”75″]
[/title]
[row different_values=”0″]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[button color_type=”0″ color=”btn-success” type=”block” different_values=”0″]

[/button]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[button color_type=”0″ color=”btn-info” type=”block” different_values=”0″]

[/button]
[/col]
[col tablet=”4″ desktop=”4″ different_values=”0″]
[button color_type=”0″ color=”btn-danger” type=”block” different_values=”0″]

[/button]
[/col]
[/row]
[title title=”Different types of promo and intro” type=”h2″ underline=”1″ different_values=”0″ style_margin_top=”75″]
[/title]
[title title=”Promo 1 example” type=”h6″ underline=”0″ different_values=”0″]
[/title]
[row]
[col tablet=”4″ desktop=”4″]
[service_box type=”center_big” title=”Web Design” icon=”fa fa-picture-o” different_values=”0″]
[html]Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat.[/html]
[/service_box]
[/col]
[col tablet=”4″ desktop=”4″]
[service_box type=”center_big” title=”Graphic Design” icon=”fa fa-wrench” different_values=”0″]
[html]The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those intereste. It is a long established fact that a reader.[/html]
[/service_box]
[/col]
[col tablet=”4″ desktop=”4″]
[service_box type=”center_big” title=”Internet Marketing” icon=”fa fa-bug”]
[html]The readable content of a page when looking at its layout. The point of using. Duis aute irure dolor reprehenderit in voluptate velit esse cillum.[/html]
[/service_box]
[/col]
[/row]
[title title=”Promo 2 example” type=”h6″ underline=”0″ different_values=”0″]
[/title]
[row]
[col tablet=”4″ desktop=”4″]
[service_box type=”left_medium” link=”contact” title=”Web Design” icon=”fa fa-picture-o”]
[html]Content management systens Virtual shops and ecommerce Presentation websites Online catalogues[/html]
[/service_box]
[/col]
[col tablet=”4″ desktop=”4″]
[service_box type=”left_medium” link=”contact” title=”Graphic Design” icon=”fa fa-wrench”]
[html]The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those intereste.[/html]
[/service_box]
[/col]
[col tablet=”4″ desktop=”4″]
[service_box type=”left_medium” link=”contact” title=”Internet Marketing” icon=”fa fa-bug”]
[html]Content management systens Virtual shops and ecommerce Presentation websites Online catalogues[/html]
[/service_box]
[/col]
[/row]
[title title=”Metro Style” type=”h2″ underline=”1″ different_values=”0″ style_margin_top=”75″]
[/title]













[title title=”Pricing” type=”h2″ underline=”1″ style_margin_top=”75″ different_values=”0″]
[/title]
[row]
[col desktop=”6″ wide=”4″ different_values=”0″]
[pricing_table title=”First Package” price=”$199″ price_top_text=”Starting at” price_text=”/month” livicon=”shopping-cart” stars=”3″ read_more=”Read More” color=”default” description=”The generated Lorem Ipsum is therefore always free from repetition, injected humour.” different_values=”0″]
[/pricing_table]
[/col]
[col desktop=”6″ wide=”4″ different_values=”0″]
[pricing_table title=”Second Package” price=”$299″ price_top_text=”Starting at” price_text=”/month” livicon=”wrench” stars=”4″ color=”default” read_more=”Read More” different_values=”0″ link=”shop” description=”The generated Lorem Ipsum is therefore always free from repetition, injected humour.”]
[/pricing_table]
[/col]
[col desktop=”6″ wide=”4″ different_values=”0″]
[pricing_table title=”Third Package” price=”$399″ price_top_text=”Starting at” price_text=”/month” link=”shop” livicon=”piggybank” stars=”4″ color=”default” read_more=”Read More” different_values=”0″ description=”The generated Lorem Ipsum is therefore always free from repetition, injected humour.”]
[/pricing_table]
[/col]
[/row]
[html format=”ckeditor” different_values=”0″ style_margin_top=”76″]

[/html]