Typography

This is a super h1 title
This is a super h1 title

Add the class .largeTitle. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is an h1 title
This is an h1 title

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is an h2 title
This is an h2 title

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is an h3 title
This is an h3 title

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is an h4 title
This is an h4 title

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is an h5 title
This is an h5 title

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

This is an h6 title
This is an h6 title

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

#main Padding

The div that houses all the content on a page has the id #main.
The default padding for #main is set to:

#main {
padding-top: 0;
padding-bottom: 0;
}

This padding is designed for pages that have a full-width header banner at the top.
For pages that do not have a top image header banner, add this code to the Custom CSS under the Page Options setting:

#main {
padding-top: 60px;
padding-bottom: 60px; /*optional*/
}

Container Padding

The container is the largest of Avada Builder’s essential building components.
These are the general paddings used throughout the containers on the website:

padding-top: 50px;
padding-bottom: 50px;

Depending on the content, the padding may differ. It is not necessary to include the padding to the top of the first container and bottom of the last container where the padding in #main, as described above, has been added.

For pages that do not have the #main padding, as described above, add the following:

To the first container, padding-top: 60px;
To the last container, padding-bottom: 60px;