@import url('https://fonts.cdnfonts.com/css/montserrat');
@import url('https://fonts.cdnfonts.com/css/pt-serif'); 

:root {
    --font_primary: 'Montserrat', sans-serif;
    --font_secondary: 'PT-serif', sans-serif;
    --font_weight_extralight: 275;
    --font_weight_light: 300;
    --font_weight_regular: 400;
    --font_weight_medium: 500;
    --font_weight_semibold: 600;
    --font_weight_bold: 700;
    --font_weight_extrabold: 800;
    --font_weight_black: 900;
}

* {
    font-family: var(--font_primary);
}

.h0 {
    font-size: 6rem;
}


h1 {
    font-size: 3rem;
    font-weight: var(--font_weight_extrabold);
    line-height: 1.2;
    margin-bottom: 0.75rem;
}
h1.banner {
    font-weight: var(--font_weight_black);
    text-align: center;
}
h1.banner_1 {
    font-size: 6rem;
    font-weight: var(--font_weight_bold);
    text-transform: uppercase;
    letter-spacing: 3px;
    margin-bottom: 0;
}
@media screen and (max-width: 768px) {
    h1.banner_1 {
        font-size: 2rem;
    }
}
h1.banner_2 {
    font-size: 6rem;
    text-transform: uppercase;
    margin-bottom: 0;
}
@media screen and (max-width: 768px) {
    h1.banner_2 {
        font-size: 3rem;
    }
}

h1.banner_3 {
    font-size: 6rem;
    margin-bottom: 0;
    }
    @media screen and (max-width: 900px) {
    h1.banner_3 {
        font-size: 7rem;
    }
}
h1.slim {
    font-weight: var(--font_weight_bold);
    letter-spacing: 2px;
}
h1.large {
    font-size: 6rem;
}

h2 {
    font-size: 2.5rem;
    font-weight: var(--font_weight_extrabold);
    line-height: 1.2;
    margin-bottom: 0.75rem;
}
h2.slim {
    font-size: 2rem;
    font-weight: var(--font_weight_regular);
}

h3 {
    font-size: 2rem;
    font-weight: var(--font_weight_bold);
    line-height: 1.2;
    margin-bottom: 0.75rem;
}
h3.slim {
    font-weight: var(--font_weight_regular);
    letter-spacing: 3px;
}

h4 {
    font-size: 1.5rem;
    font-weight: var(--font_weight_semibold);
    line-height: 1;
    letter-spacing: 1px;
    margin-bottom: 0.5rem;
    margin-top: 0;
}
h4.slim {
    font-weight: var(--font_weight_medium);
}
h4.spaced {
    letter-spacing: 7px;
}

h5 {
    font-size: 1.25rem;
    font-weight: var(--font_weight_semibold);
    line-height: 1.2;
    margin-bottom: 0.5rem;
}

h5.slim {
    font-weight: var(--font_weight_medium);
}

h6 {
    font-size: 1rem;
    font-weight: var(--font_weight_semibold);
    line-height: 1.2;
    margin-bottom: 0.5rem;
}

b {
    font-weight: var(--font_weight_bold);
}

i {
    text-align: center;
}

p {
    font-size: 1rem;
    font-weight: var(--font_weight_regular);
    line-height: 1.5;
    margin-bottom: 0.25rem;
    margin-top: 0;
}
p.medium {
    font-weight: var(--font_weight_medium);
}
p.semibold { 
    font-weight: var(--font_weight_semibold);
    letter-spacing: 0.8px;
}
p.bold {
    font-weight: var(--font_weight_bold);
    letter-spacing: 1px;
}
p.extrabold {
    font-weight: var(--font_weight_extrabold);
}
p.black {
    font-weight: var(--font_weight_black);
}
p.small {
    font-size: 0.9rem !important;
    line-height: 1.2;
}
p.large {
    font-size: 1.2rem;
    line-height: 1.8;
}

h1.gray, h2.gray, h3.gray, h4.gray, h5.gray, h6.gray, p.gray {
    color: darkgray;
    cursor: pointer;
}
h1.gray.active, h2.gray.active, h3.gray.active, h4.gray.active, h5.gray.active, h6.gray.active, p.gray.active {
    color: var(--color_primary);
}
h1.gray:hover, h2.gray:hover, h3.gray:hover, h4.gray:hover, h5.gray:hover, h6.gray:hover, p.gray:hover {
    color: var(--color_primary);
}

a.white, h1.white, h2.white, h3.white, h4.white, h5.white, h6.white, p.white {
    color: white;
    text-shadow: 0 0 50px rgb(0 0 0 / 20%);
}

h1.min_content, h2.min_content, h3.min_content, h4.min_content, h5.min_content, h6.min_content, p.min_content {
    width: -webkit-min-content;
    width: -moz-min-content;
    width: min-content;
}
h1.max_content, h2.max_content, h3.max_content, h4.max_content, h5.max_content, h6.max_content, p.max_content {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
}
h1.caps, h2.caps, h3.caps, h4.caps, h5.caps, h6.caps, p.caps {
    text-transform: uppercase;
}
h1.center, h2.center, h3.center, h4.center, h5.center, h6.center, p.center {
    text-align: center;
}
h1.no_margin, h2.no_margin, h3.no_margin, h4.no_margin, h5.no_margin, h6.no_margin, p.no_margin {
    margin-bottom: 0;
}
h1.caps, h2.caps, h3.caps, h4.caps, h5.caps, h6.caps, p.caps {
    text-transform: uppercase;
}

.no_margin {
    margin: 0 !important;
}
.no_margin_bottom {
    margin-bottom: 0 !important;
}