_base.scss

//
// Base
//

body {
    position: relative;
    color: $color-night-sky;
    font-family: 'Montserrat', sans-serif;
    background-color: $color-bright;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4 {
    text-transform: uppercase;
    font-family: 'Knewave';
}

h5, .h5,
h6, .h6 {
    text-transform: uppercase;
}

h1, .h1 {
    font-size: 2.25rem;
    line-height: 1;

    @media (min-width: 480px) {
        font-size: 3rem;
    }
}

a {
    color: $color-link;

    &:hover {
        color: darken($color-link, 10%);
        text-decoration: none;
    }
}

p a {
    text-decoration: underline;

    &[target="_blank"] {
        .fa {
            margin-left: .3rem;
            font-size: .75rem;
        }
    }
}

main {
    p {
        line-height: 1.8;
    }

    a {
        text-decoration: underline;
    }

    h1, .h1,
    h2, .h2,
    h3, .h3,
    h4, .h4 {
        text-transform: uppercase;
        font-family: 'Knewave';

        a {
            text-decoration: none;
        }
    }

    .post {
        margin-bottom: 2rem;
    }
}

hr {
    border-width: 1px;
    border-color: $color-night-sky;
}