/**
* Available vars:
* @var --viewport-from: <number> - Number in pixels without the unit. Required if `--font-size` is not exist.
* @var --viewport-to: <number> - Number in pixels without the unit. Required if `--font-size` is not exist.
* @var --font-size-from: <number> - Number in pixels without the unit. Required if `--font-size` and `--min-font-size` is not exist.
* @var --font-size-to: <number> - Number in pixels without the unit. Required if `--font-size` and `--max-font-size` is not exist.
* @var --max-font-size: <number> - Number in pixels without the unit. Optional.
* @var --min-font-size: <number> - Number in pixels without the unit. Optional.
* @var --viewport-unit-converter: 1vw | 1vh | 1vmin | 1vmax - Optional. Default: 1vw.
* @var --font-size: <length> | <percentage> | <absolute-size> | <relative-size> | Global values - Optional.

  --viewport-from: 476;
  --font-size-from: 20;
  --min-font-size: 26;
  --viewport-to: 992;
  --font-size-to: 26;
  --max-font-size: 26;
  
*/
*,
*::before,
*::after {
  --viewport-unit-converter: 1vw;
  --fz-from: var(--font-size-from, var(--min-font-size));
  --fz-to: var(--font-size-to, var(--max-font-size));
  --fz-slope: (var(--fz-to) - var(--fz-from)) / (var(--viewport-to) - var(--viewport-from)) * 100;
  --fz-intercept: (var(--viewport-to) * var(--fz-from) - var(--viewport-from) * var(--fz-to)) / (var(--viewport-to) - var(--viewport-from));
  --font-size: calc(var(--fz-slope) * var(--viewport-unit-converter) + var(--fz-intercept) * 1px);

  --min-fz-px: calc(var(--min-font-size) * 1px);
  --max-fz-px: calc(var(--max-font-size) * 1px);
  --clamp: clamp(var(--min-fz-px), var(--font-size), var(--max-fz-px));
  --max: var(--has-max, var(--min));  
  --min: var(--has-min, var(--font-size));
  --has-max: min(var(--max-fz-px), var(--font-size));
  --has-min: max(var(--min-fz-px), var(--font-size));
  font-size: var(--clamp, var(--max));

  --color-White: 255,255,255;
  --color-Snow: 250,250,250;
  --color-Gainsboro: 221,221,221;
  --color-WhiteSmoke: 245,245,245;
  --color-VeryLightGrey: 204,204,204;
  --color-Nobel: 153,153,153;
  --color-Matterhorn: 85,85,85;
  --color-Charcoal: 68,68,68;
  --color-NightRider: 51,51,51;
  --color-Black: 0,0,0;

  --color-Smalt: 11,49,143;

  --color-Sunflower: 218,190,15;
  --color-Astral: 55,115,141;
  --color-CoralTree: 176,116,97;
  --color-Lochinvar: 68,153,136;
  --color-BuddhaGold: 181,163,17;	
  --color-FireBrick: 183,33,33;
  --color-PrussianBlue: 4,43,88;
  --color-Pelorous: 40,157,204;

  --color-AliceBlue: 243,248,252;

  --color-GoldenSand: 238,205,105;

  --color-Persimmon: 235,97,0;

  --color-Cyan: 0,156,209;

  --color-dali: 109,167,126;
  --color-curapipeblue: 0,51,101;
  --color-curapipegreen: 51,173,55;

  --color-PersianRed: 195,48,48;

  --color-streamaxblue: 0,117,194;
  --color-streamaxgreen: 171,205,3;

  --color-brigadegreen: 0,174,187;

  --color-geoxyellow: 236,199,82;

  --color-radarsensorgreen: 0,174,187;
  --color-rapidablue: 0,117,194;
  
  --color-beamrblue: 0,117,194;

  --fontsize-Md: 16px;
  --fontsize-Sm: 15px;
  --fontsize-Xs: 14px;
  --fontsize-2s: 12px;

  --family-roboto: 'Roboto', sans-serif;
  

}