@media only screen and (min-width: 320px) {
    :root{
        --main-font: 'Albert Sans', sans-serif;
        --title-font: 'Albert Sans', sans-serif;
    }
    
    html, body{
        font-family: 'Albert Sans', sans-serif;
        font-size:14px;
    }
    h1, h2, h3, .block-editor :where(.editor-styles-wrapper) :is(h1, h2, h3) {
        font-family: var(--title-font);
    }

    h4, h5, h6, .block-editor :where(.editor-styles-wrapper) :is(h4, h5, h6) {
        font-family: var(--title-font);
    }
    
    h1 {
        font-weight: bold;
        font-size: 2.4rem;
    }

    h2 {
        font-size: 2.2rem;
        font-weight: bold;
        margin-bottom:20px;
    }

    h3 {
        font-size: 1.8rem;
        font-weight: bold;
        margin-bottom:20px;
    }

    h4 {
        font-size: 1.2rem;
        font-weight: bold;
        font-family: var(--title-font);
        margin-bottom:20px;
    }

    h5 {
        font-size: 1rem;
        font-weight: bold;
        font-family: var(--title-font);
        margin-bottom:20px;
    }


    a {
        font-size: 1rem;
        font-weight:600;
        
    }
    p a, .editor-styles-wrapper p a{
        text-decoration: underline;
    }
    p a:hover, .editor-styles-wrapper p a:hover{
        text-decoration: none;
    }
    .main-navigation .main-nav ul li a {
        font-size: 1rem;
        font-weight: 600;
    }

    p {
        font-size: 1em;
        line-height:1.6em;
    }

    .larger-text {
        font-size: 1.25rem;
    }



}
@media only screen and (min-width: 768px) {
    html, body{
        font-size:14px;
    }

}

@media only screen and (min-width: 990px) {
    html, body{
        font-size: 14px;
    }
    h1 {
        font-size: 3.6rem;
    }
    h2 {
        font-size: 3rem;
    }
    h5 {
        font-size: 1rem;
    }
    .main-navigation .main-nav ul li a {
        font-size: min(1vw, 1.1rem);
    }
    
}

@media only screen and (min-width: 1280px) {
    
}