a {
    color: var(--text);
    text-decoration: none;
    outline: none;
    transition: all .1s;

    svg {
        fill: var(--text);
    }

    &:hover {
        color: var(--color-primary);

        svg {
            fill: var(--color-primary);
        }
    }
}

hr {
    width: 95%;
    color: var(--color-lightgray);
    margin: 1rem auto;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0.75rem 0.5rem;
    font-weight: bold;
}

h1 {
    @include font-size(3.5rem);
}

h2 {
    @include font-size(3rem);
}

h3 {
    @include font-size(2.5rem);
}

h4 {
    @include font-size(2rem);
}

h5 {
    @include font-size(1.5rem);
}

h6 {
    @include font-size(1rem);
}

p {
    @include font-size(1.2rem);
    margin: .5rem;

    a {
        &:link {
            color: var(--color-info);
        }

        &:visited {
            color: var(--color-secondary);
        }

        &:hover {
            color: var(--color-primary);
        }
    }
}

pre {
    white-space: pre-wrap;
    word-wrap: break-word;
}

q {
    font-weight: lighter;
}

blockquote {
    background-color: var(--listBack);
    margin: .5rem;
    padding: .75rem;
    font-weight: lighter;
    @include font-size(1rem);
    border-radius: var(--border-size);
    border-left: var(--color-primary) solid .25rem;

    &.dashed {
        background-color: transparent;
        border: 1px dashed var(--color-primary);
    }

    &.secondary {
        border-left: var(--color-secondary) solid .25rem;
    }
}