.bc-1 {
    .background-clip(padding-box);
}

.bc-2 {
    .background-clip(padding-box, border-box);
}

.bs-1 {
    .background-size(cover);
}

.bs-2 {
    .background-size(cover, 50% auto);
}

.bo-1 {
    .background-origin(padding-box);
}

.bo-2 {
    .background-origin(padding-box, border-box);
}

.lg-1 {
    .linear-gradient(to top right, #c00 0%, #00c 50%, #0c0 100%);
}

.lg-2 {
    .linear-gradient(30deg, red, blue, green);
}

.lg-3 {
    .linear-gradient(bottom, #000, #fff);
}

.hg {
    .horizontal-gradient(red, blue);
}

.vg {
    .vertical-gradient(red, blue);
}

.rlg-1 {
    .repeating-linear-gradient(to top right, #c00 0%, #00c 5%, #0c0 10%);
}

.rlg-2 {
    .repeating-linear-gradient(30deg, red, blue 10px, green 20px);
}

.lg-3 {
    .repeating-linear-gradient(bottom, #000, #fff 10px);
}

.rg-1 {
    .radial-gradient(circle 10px at 0 0, #c00 0%, #00c 50%, #0c0 100%);
}

.rg-2 {
    .radial-gradient(ellipse farthest-corner at 10px 20px, #fff 20%, #ccc 60%);
}

.rg-3 {
    .radial-gradient(circle, #c00 0%, #0c0 100%);
}

.rg-4 {
    .radial-gradient(closest-side, #fff 20%, #ccc 60%);
}

.rrg-1 {
    .repeating-radial-gradient(circle 10px at 0 0, #c00 0%, #00c 50%, #0c0 100%);
}

.rrg-2 {
    .repeating-radial-gradient(ellipse farthest-corner at 10px 20px, #fff 20%, #ccc 60%);
}

.rrg-3 {
    .repeating-radial-gradient(circle, #c00 0%, #0c0 100%);
}

.rrg-4 {
    .repeating-radial-gradient(closest-side, #fff 20%, #ccc 60%);
}

