:root {
    --cubit: 10px;

    --min-width: 320px;

    --c1: #ECE9E3;
    --c2: #3b1c13;
    --c3: #760516;
    --c4: #175567;
    --c5: #006F71;

    --c1n: 236,233,227;
    --c2n: 59,28,19;
    --c3n: 118,5,22;
    --c4n: 23,85,103;
    --c5n: 0,111,113;

    --cg0: #000000;
    --cg1: #333333;
    --cg2: #656565;
    --cg3: #999999;
    --cg4: #cccccc;
    --cg5: #e8e8e8;
    --cg6: #ffffff;

    --cgn0: 0, 0, 0;
    --cgn1: 51, 51, 51;
    --cgn2: 101, 101, 101;
    --cgn3: 153, 153, 153;
    --cgn4: 204, 204, 204;
    --cgn5: 232, 232, 232;
    --cgn6: 255, 255, 255;
}

body { background-color: var( --cg6 ); }

@media screen and ( min-width: 576px )  { :root { --cubit: 11px; }}
@media screen and ( min-width: 768px )  { :root { --cubit: 12px; }}
@media screen and ( min-width: 992px )  { :root { --cubit: 12.5px; }}
@media screen and ( min-width: 1200px ) { :root { --cubit: 13px; }}
@media screen and ( min-width: 1400px ) { :root { --cubit: 13.5px; }}
@media screen and ( min-width: 1920px ) { :root { --cubit: 14px; }}
@media screen and ( min-width: 2048px ) { :root { --cubit: 14.5px; }}
@media screen and ( min-width: 2560px ) { :root { --cubit: 15px; }}
@media screen and ( min-width: 3840px ) { :root { --cubit: 15.5px; }}
@media screen and ( min-width: 4096px ) { :root { --cubit: 16px; }}
@media screen and ( min-width: 5120px ) { :root { --cubit: 17px; }}
@media screen and ( min-width: 7680px ) { :root { --cubit: 18px; }}