Global Styles

This page is designed to demonstrate your GLOBAL SETTINGS that affect your entire site as a whole. It’s important to maintain a consistent style throughout your site.

Headings Style

Default Heading Font:
Quicksand

Default Heading Sizes in px:

Desktop: 50,40,30,25,20,15

Tablet: 40,30,25,20,15

Mobile: 30,25,20,15

Default Heading Weights:

 900,500,800,600,400,300

Desktop : 50px | 900

H1 Heading

H1 Heading

Tablet : 40px | 900

H1 Heading

H1 Heading

Mobile : 30px | 900

H1 Heading

H1 Heading

Desktop : 40px | 800

H2 Heading

H2 Heading

Tablet : 30px | 800

H2 Heading

H2 Heading

Mobile : 25px | 800

H2 Heading

H2 Heading

Desktop : 30px | 600

H3 Heading

H3 Heading

Tablet : 25px | 600

H3 Heading

H3 Heading

Mobile : 25px | 600

H3 Heading

H3 Heading

Desktop : 25px | 600

H4 Heading

H4 Heading

Tablet : 20px | 600

H4 Heading

H4 Heading

Mobile : 20px | 600

H4 Heading

H4 Heading

Desktop : 20px | 500

H5 Heading
H5 Heading

Tablet : 18px | 500

H5 Heading
H5 Heading

Mobile : 18px | 500

H5 Heading
H5 Heading

Desktop : 15px | 400

H6 Heading
H6 Heading

Tablet : 18px | 400

H6 Heading
H6 Heading

Mobile : 18px | 400

H6 Heading
H6 Heading

Paragraph Style

Default Font:

Montserrat

Default Sizes in px:

Desktop: 17

Tablet: 16

Mobile: 15

Default Weights:

400

Default  Line height in px:

20

Desktop : 17px | 400

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Tablet : 16px | 400

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Mobile : 15px | 400

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

List Style

Default Heading Font: Montserrat

Default Heading Sizes in px:

Desktop: 17

Tablet: 16

Mobile: 15

Default Heading Weights:

400

Desktop : 17px | 400

Unordered List (H5)
  • Something Cool
  • Something Cooler
  • Something Wicked Cool
Ordered List (H5)
  1. Something Cool
  2. Something Cooler
  3. Something Wicked Cool
Custom List
  • Something Cool
  • Something Cooler
  • Something Wicked Cool

Note: Use the below code and css for custom list style

				
					<ul class="check-list">
 	<li>Something Cool</li>
 	<li>Something Cooler</li>
 	<li>Something Wicked Cool</li>
</ul>
<style>
ul.check-list {
    list-style: none;
    margin-left: 30px;
}
ul.check-list li{
    margin-bottom: 5px;
    font-size: 17px;
    font-weight: 400;
    line-height: 22px;
}
ul.check-list li::before {
    content: "\f058";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    left: 5px;
}
</style>
				
			

Tablet : 16px | 400

Unordered List (H5)
  • Something Cool
  • Something Cooler
  • Something Wicked Cool
Ordered List (H5)
  1. Something Cool
  2. Something Cooler
  3. Something Wicked Cool
Custom List
  • Something Cool
  • Something Cooler
  • Something Wicked Cool

Note: Use the below code and css for custom list style

				
					<ul class="check-list">
 	<li>Something Cool</li>
 	<li>Something Cooler</li>
 	<li>Something Wicked Cool</li>
</ul>
<style>
ul.check-list {
    list-style: none;
    margin-left: 30px;
}
ul.check-list li{
    margin-bottom: 5px;
    font-size: 17px;
    font-weight: 400;
    line-height: 22px;
}
ul.check-list li::before {
    content: "\f058";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    left: 5px;
}
@media (min-width: 768px) and (max-width: 1024px){
   ul.check-list li{
       font-size: 16px;
   }
}

</style>
				
			

Mobile : 15px | 400

Unordered List (H5)
  • Something Cool
  • Something Cooler
  • Something Wicked Cool
Ordered List (H5)
  1. Something Cool
  2. Something Cooler
  3. Something Wicked Cool
Custom List
  • Something Cool
  • Something Cooler
  • Something Wicked Cool

Note: Use the below code and css for custom list style

				
					<ul class="check-list">
 	<li>Something Cool</li>
 	<li>Something Cooler</li>
 	<li>Something Wicked Cool</li>
</ul>
<style>
ul.check-list {
    list-style: none;
    margin-left: 30px;
}
ul.check-list li{
    margin-bottom: 5px;
    font-size: 17px;
    font-weight: 400;
    line-height: 22px;
}
ul.check-list li::before {
    content: "\f058";
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    position: absolute;
    left: 5px;
}
@media (max-width: 767px){
   ul.check-list li{
       font-size: 15px;
   }
}
</style>
				
			

This page is designed to demonstrate your GLOBAL SETTINGS that affect your entire site as a whole. It’s important to maintain a consistent style throughout your site.

Heading Style

H1 , H2, H3, H4 , H5, H6 Headings

Black : #010101

Paragraph Style

Black : #424242

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Button Style

Primary

Black Button

Outlined Button

This page is designed to demonstrate your GLOBAL SETTINGS that affect your entire site as a whole. It’s important to maintain a consistent style throughout your site.

Tabs

Accordion

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.

Slider

Slide 1 Heading
Lorem ipsum dolor sit amet consectetur adipiscing elit dolor
Click Here
Slide 2 Heading
Lorem ipsum dolor sit amet consectetur adipiscing elit dolor
Click Here
Slide 3 Heading
Lorem ipsum dolor sit amet consectetur adipiscing elit dolor
Click Here
Previous slide
Next slide

Video

This page is designed to demonstrate your GLOBAL SETTINGS that affect your entire site as a whole. It’s important to maintain a consistent style throughout your site.

Images Style

Square shape

Circle shape

Rounded Shape

This page is designed to demonstrate your GLOBAL SETTINGS that affect your entire site as a whole. It’s important to maintain a consistent style throughout your site.

Masonary Gallery Style

Grid Gallery Style

Justified Gallery Style

Pricing Table 1

Loreum Ipsum

Product 1

$XXX

per month*

Feature 1
Feature 2
Feature 3
Feature 4
Feature 5
Feature 6
Feature 7
Loreum Ipsum

Product 2

$XXX

per month*

Feature 1
Feature 2
Feature 3
Feature 4
Feature 5
Feature 6
Feature 7
Feature 8
Loreum Ipsum

Product 3

$XXX

per month*

Feature 1
Feature 2
Feature 3
Feature 4
Feature 5
Feature 6
Feature 7
Feature 8
Loreum Ipsum

Product 4

$XXX

per month*

Feature 1
Feature 2
Feature 3
Feature 4
Feature 5
Feature 6
Feature 7
Feature 8

Pricing Table 2

  • Feature 1Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 2Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 3Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 4Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 5Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 6Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 7Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 8Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 9Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Monthly
  • Annual

ECONOMY

$ XX Per Month
  •  
  •  
  • Not Included
  •  
  •  
  • XXX+
  •  
  • $XX+
  • $XX
  • $XX+
  • Over $XXX

BASIC

$ XX Per Month
  •  
  •  
  • Not Included
  •  
  •  
  • XXX+
  •  
  • $XXX+
  • $XX
  • $XX+
  • Over $XXXX

ADVANCED

$ XXX Per Month
  •  
  •  
  • YES
  •  
  •  
  • XXXX+
  •  
  • $XXX+
  • $XXX
  • $XXX+
  • Over $XXXX

ELITE

$ XXX Per Month
  •  
  •  
  • YES
  •  
  •  
  • XXXX+
  •  
  • $XXX+
  • $XXX
  • $XXX+
  • $XXXX+
  • Feature 1Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 2Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 3Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 4Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 5Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 6Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 7Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 8Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 9Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Monthly
  • Annual

ECONOMY

$ XX Per Month
  •  
  •  
  • Not Included
  •  
  •  
  • XXX+
  •  
  • $XX+
  • $XX
  • $XX+
  • Over $XXX
  • Feature 1Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 2Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 3Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 4Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 5Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 6Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 7Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 8Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 9Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Monthly
  • Annual

BASIC

$ XX Per Month
  •  
  •  
  • Not Included
  •  
  •  
  • XXX+
  •  
  • $XXX+
  • $XX
  • $XX+
  • Over $XXXX
  • Feature 1Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 2Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 3Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 4Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 5Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 6Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 7Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 8Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 9Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Monthly
  • Annual

ADVANCED

$ XXX Per Month
  •  
  •  
  • YES
  •  
  •  
  • XXXX+
  •  
  • $XXX+
  • $XXX
  • $XXX+
  • Over $XXXX
  • Feature 1Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 2Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 3Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 4Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 5Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 6Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 7Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 8Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Feature 9Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
  • Monthly
  • Annual

ELITE

$ XXX Per Month
  •  
  •  
  • YES
  •  
  •  
  • XXXX+
  •  
  • $XXX+
  • $XXX
  • $XXX+
  • $XXXX+
Shopping Cart
Scroll to Top