.u-background {
    colors      = 'blue' 'gray' 'green' 'pink' 'purple' 'red' 'yellow';
    palletes    = ds dp ls lp;
                // ds = dark saturated
                // dp = dark pastel
                // ls = light saturated
                // lp = light pastel
    areas       = 'math' 'human-sciences' 'nature-sciences' 'languages' 'essay';

    &--dark-blue {
        background-color: $color--main-dark;
    }

    for color in colors {
        &--{color} {
            background-color: lookup('$color--ls-' + color) !important;

            for pal in palletes {
                &-{pal} {
                    background-color: lookup('$color--' + pal + '-' + color) !important;
                }
            }
        }
    }

    // Áreas de conhecimento

    for area in areas {
        &--{area} {
            background-color: lookup('$color--' + area) !important;
        }
    }
}