main {
    .content {
        margin: var(--margin-large) 2%;

        h2 {
            margin-top: var(--margin-medium);
        }

        a {
            color: var(--text-color);
        }
    }
}

@media screen and (max-width: 1100px) {
    .content {
        padding: var(--margin-large) var(--margin-small);
    }
}

@media screen and (max-width: 900px) {
    main {
        
        .content {
            padding: var(--margin-large) var(--padding-small);

            >h2,
            h3,
            h4,
            h5,
            h6,
            p,
            a {
                font-size: 1.5rem;
            }
        }
    }
}

@media screen and (max-width: 480px) {
    main .content {
        padding: var(--padding-small);
        font-size: var(--font-size-small);
    }
}