Menu

Heading Styles

Complete Typography options are available with this skin pack so you can easily stylize your text and contact with beautiful look.. So what are you waiting for?? Here are example of Standard/by-default text elements and classes

This is Simple Heading 1

This is Simple Heading 2

This is Simple Heading 3

This is Simple Heading 4

This is Simple Heading 5
This is Simple Heading 6

Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec.


Heading Styles in Caudex-Regular

<h1 class="font-caudex">

This is Simple Heading 1

This is Simple Heading 2

This is Simple Heading 3

This is Simple Heading 4

This is Simple Heading 5
This is Simple Heading 6

Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec.


Heading Styles in MyriadPro

<h1 class="font-myriadpro">

This is Simple Heading 1

This is Simple Heading 2

This is Simple Heading 3

This is Simple Heading 4

This is Simple Heading 5
This is Simple Heading 6

Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec.


Heading Styles in Muli-Regular

<h1 class="font-muli">

This is Simple Heading 1

This is Simple Heading 2

This is Simple Heading 3

This is Simple Heading 4

This is Simple Heading 5
This is Simple Heading 6

Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec.


Heading Styles in SansationRegular

<h1 class="font-sansation">

This is Simple Heading 1

This is Simple Heading 2

This is Simple Heading 3

This is Simple Heading 4

This is Simple Heading 5
This is Simple Heading 6

Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec.


Heading Styles in TitilliumText22LBold

<h1 class="font-titillium">

This is Simple Heading 1

This is Simple Heading 2

This is Simple Heading 3

This is Simple Heading 4

This is Simple Heading 5
This is Simple Heading 6

Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec. Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec.


 

This is a sample of the 'attention' style. To use this use the folllowing html: <span class="attention">....</span>This is a sample of the 'notice' style. To use this use the folllowing html: <span class="notice">....</span>This is a sample of the 'alert' style. To use this use the folllowing html: <span class="alert">....</span>This is a sample of the 'download' style. To use this use the folllowing html: <span class="download">....</span>This is a sample of the 'approved' style. To use this use the folllowing html: <span class="approved">....</span>This is a sample of the 'media' style. To use this use the folllowing html: <span class="media">....</span>This is a sample of the 'note' style. To use this use the folllowing html: <span class="note">....</span>This is a sample of the 'cart' style. To use this use the folllowing html: <span class="cart">....</span>This is a sample of the 'doc ' style. To use this use the folllowing html: <span class="doc ">....</span>

list styles

  • To use this style create a list in the following format: <ul class="special-1"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-2"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-3"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-4"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-5"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-6"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-7"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-8"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-9"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-9white"><li>....</li><li>....</li>...</ul>.

This Is Link Button

Button Link To use this type: <a class="action_buttonBlue"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonNavyBlue"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonRoyalBlue"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonOcean"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonAqua"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttoncorpgreen"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonGreen"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonLime"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonIndigo"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonLilac"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonRed"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonOrange"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonGrey"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonBlack"><span> Button Link</span></a>

This Is Simple Link

Simple Link To use this type: <a >....</a>

Heading Styles

Complete Typography options are available with this skin pack so you can easily stylize your text and contact with beautiful look.. So what are you waiting for?? Here are example of some text elements and classes

This is Simple Heading 1

This is Simple Heading 2

This is Simple Heading 3

This is Simple Heading 4

This is Simple Heading 5
This is Simple Heading 6
 

This is a sample of the 'attention' style. To use this use the folllowing html: <span class="attention">....</span>This is a sample of the 'notice' style. To use this use the folllowing html: <span class="notice">....</span>This is a sample of the 'alert' style. To use this use the folllowing html: <span class="alert">....</span>This is a sample of the 'download' style. To use this use the folllowing html: <span class="download">....</span>This is a sample of the 'approved' style. To use this use the folllowing html: <span class="approved">....</span>This is a sample of the 'media' style. To use this use the folllowing html: <span class="media">....</span>This is a sample of the 'note' style. To use this use the folllowing html: <span class="note">....</span>This is a sample of the 'cart' style. To use this use the folllowing html: <span class="cart">....</span>This is a sample of the 'doc ' style. To use this use the folllowing html: <span class="doc ">....</span>

list styles

  • To use this style create a list in the following format: <ul class="special-1"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-2"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-3"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-4"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-5"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-6"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-7"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-8"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-9"><li>....</li><li>....</li>...</ul>.
  • To use this style create a list in the following format: <ul class="special-9white"><li>....</li><li>....</li>...</ul>.

This Is Link Button

Button Link To use this type: <a class="action_buttonBlue"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonNavyBlue"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonRoyalBlue"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonOcean"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonAqua"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttoncorpgreen"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonGreen"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonLime"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonIndigo"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonLilac"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonRed"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonOrange"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonGrey"><span> Button Link</span></a>

Button Link To use this type: <a class="action_buttonBlack"><span> Button Link</span></a>

This Is Simple Link

Simple Link To use this type: <a >....</a>

This is Accordion - click a heading

To setup this accordion simply Copy paste the sample html provided in a text/html module using the Edit Content feature of DNN.

Click here to copy the code. You can add as many accordion tabs as you need. The Container applied to this module is named SimpleCurveContainer. Try applying CntBlank for a more clean appearance

Accordion heading two

To setup this accordion simply Copy paste the sample html provided in a text/html module using the Edit Content feature of DNN.

Click here to copy the code. You can add as many accordion tabs as you need. The Container applied to this module is named SimpleCurveContainer. Try applying CntBlank for a more clean appearance

Clicking on one item closes the other one

To setup this accordion simply Copy paste the sample html provided in a text/html module using the Edit Content feature of DNN.

Click here to copy the code. You can add as many accordion tabs as you need. The Container applied to this module is named SimpleCurveContainer. Try applying CntBlank for a more clean appearance.

Easy Slider Setup

1.    Add a Html module to BannerPane
2.    Go to module settings for this module
3.    Apply the Responsiveslider-  demo file as container
4.    Now Go to Edit Content option for this module and copy paste the code from read more link below
5.    You can upload your own images and update the path in this code

Read More

Customer Support

Font Muli Regular


Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec

Read More

Skin Manual

Font Caudex


Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec

Read More

Installation Guide

Font Sansation


Donec accumsan malesuada orcidonec sitmet eros lorem isum dolor amet incon. Adipiscing elit maurise pharetra magna accumsan. Malesuada orcdonec umet lorem doloronsec

Read More

Click To View Lightbox

Cum sociis natoque penatibus et magnis dis parturient montes, nascetur.

Click To View Lighbox

Curabitur blandit tempus porttitor. Maecenas sed diam eget risus varius blandit.

Click To View Lightbox

Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociie.

Click To View Lightbox

Curabitur blandit tempus porttitor. Maecenas sed diam eget risus varius blandit.
Copyright 2013 by DnnArt.net
Signin  | Signup |