*,
*::before,
*::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'Open Sans', Roboto, sans-serif;
    color: var(--dark-gray);
}

img {
    max-width: 100%;
    width: auto;
    height: auto;
}

.container {
    width: 95%;
    margin: 0 auto;
    max-width: var(--max-width);
}

/* ### HEADINGS ### */

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--dark-blue);
}

h1 {
    font-size: 1.7rem;
    margin: 1.5rem 0;
}

h2 {
    font-size: 1.2rem;
    margin: 1.4rem 0 1.2rem 0;
}

h3,
h4,
h5,
h6 {
    font-size: 1.1rem;
    margin: 1.3rem 0 1.1rem 0;
}

@media only screen and (min-width: 768px) {
    h1 {
        font-size: 2rem;
        margin: 2rem 0;
    }
    h2 {
        font-size: 1.5rem;
        margin: 1.8rem 0 1.3rem 0;
    }
    h3,
    h4,
    h5,
    h6 {
        font-size: 1.2rem;
        margin: 1.4rem 0 1.2rem 0;
    }
}

/* ### TEXT ### */

p,
li,
a,
span.mod-menu__heading,
span.mod-menu__separator {
    font-size: 1rem;
    line-height: 1.6;
    margin: 0;
}

ul {
    list-style-position: inside;
    padding-left: 0;
    margin: 0;
}

a,
a:visited {
    text-decoration: none;
    color: var(--dark-blue);
}

a:hover {
    color: var(--sky-blue);
}

h1>a,
h2>a,
h3>a,
h4>a,
h5>a,
h6>a,
h1>a:visited,
h2>a:visited,
h3>a:visited,
h4>a:visited,
h6>a:visited,
h5>a:visited {
    color: var(--dark-blue);
    line-height: 1.4;
}

h1>a:hover,
h2>a:hover,
h3>a:hover,
h4>a:hover,
h6>a:hover,
h5>a:hover {
    color: var(--sky-blue);
}

hr {
    width: 25%;
    color: var(--dark-blue);
    background-color: var(--dark-blue);
    border: 0;
    height: 3px;
    text-align: left;
    display: inline-block;
    margin: 1.5em 0;
}