$color-red: #ff0000;
$color-green: #00ff00;

$breakpoints: (
    xs: (dir: min, size: 0px),
    s: (dir: min, size: 421px),
    m: (dir: min, size: 701px),
    l: (dir: min, size: 1001px),
    xl: (dir: min, size: 1301px),
);

$borders: (
    default: (
        size: 2px 4px 6px 8px 10px,
        color: $color-red,
    ),
    different: (
        size: 1px 2px 3px 4px 5px,
        color: $color-green,
    ),
    skip: (
        size: 5px 5px 10px 10px 15px,
        color: $color-red,
    ),
);

$border-radii: (
    default: 10px 15px 20px 25px 30px,
    different: 10px 20px 30px 40px 50px,
    skip: 10px 10px 10px 20px 30px,
);

$box-shadows: (
    default: (
        size: 2px 4px 6px 8px 10px,
        offsetY: 4px 8px 12px 16px 20px,
        color: $color-red,
        opacity: 0.8,
    ),
    dummy: (
        size: 10px 20px 30px 40px 50px,
        offsetY: 5px 10px 15px 20px 25px,
        color: $color-green,
        opacity: 0.8,
    ),
    skip: (
        size: 5px 5px 5px 10px 10px,
        offsetY: 5px 15px 15px 15px 15px,
        color: $color-green,
        opacity: 0.5,
    ),
);

$widths: (
    default: 90vw 80vw 75vw 71vw 67.5vw,
    thin: 70vw 60vw 55vw 51vw 47.5vw,
);

$gutters: (
    default: 10px 15px 20px 25px 30px,
    condensed: 5px 7.5px 10px 12.5px 15px,
);

$spacings: (
    small: 5px 10px 15px 20px 25px,
    large: 10px 20px 30px 40px 50px,
);