/*
 * -------------------
 * Styles for headings
 * -------------------
 */

h1, h2, h3, h4, h5, h6 {
    text-decoration: none !important;
    line-height: 1.2em !important;
    /*text-transform: uppercase;*/
    font-weight: 700 !important;
    font-family: var( --font-headings ) !important;
}

h1, h2, h3 {
    margin-bottom: 20px;
}

h4, h5, h6 {
    margin-bottom: 10px;
}

h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child {
    margin-bottom: 0px;
}

/*
 * --
 * h1
 * --
 */

h1 {
    font-size: 50px !important;
} @media ( max-width: 767px ) { h1 {
    font-size: 40px !important;
} }

h1.dark, h1.dark span, h1.dark p, h1.dark a, h1.dark i {
    color: var( --color-panthagray );
}

h1.light, h1.light span, h1.light p, h1.light a, h1.light i {
    color: var( --color-pearlwhite );
}

/*
 * --
 * h2
 * --
 */

h2 {
    font-size: 35px !important;
} @media ( max-width: 767px ) { h2 {
    font-size: 25px !important;
} }

h2.dark, h2.dark span, h2.dark p, h2.dark a, h2.dark i {
    color: var( --color-panthagray );
}

h2.light, h2.light span, h2.light p, h2.light a, h2.light i {
    color: var( --color-pearlwhite );
}

/*
 * --
 * h3
 * --
 */

h3 {
    font-size: 25px !important;
} @media ( max-width: 767px ) { h3 {
    font-size: 20px !important;
} }

h3.dark, h3.dark span, h3.dark p, h3.dark a, h3.dark i {
    color: var( --color-panthagray );
}

h3.light, h3.light span, h3.light p, h3.light a, h3.light i {
    color: var( --color-pearlwhite );
}

/*
 * --
 * h4
 * --
 */

h4 {
    font-size: 16px !important;
}

h4.dark, h4.dark span, h4.dark p, h4.dark a, h4.dark i {
    color: var( --color-panthagray );
}

h4.light, h4.light span, h4.light p, h4.light a, h4.light i {
    color: var( --color-pearlwhite );
}

/*
 * --
 * h5
 * --
 */

h5 {
    font-size: 10px !important;
}

h5.dark, h5.dark span, h5.dark p, h5.dark a, h5.dark i {
    color: var( --color-panthagray );
}

h5.light, h5.light span, h5.light p, h5.light a, h5.light i {
    color: var( --color-pearlwhite );
}