$font: 'bf23', sans-serif;

$heading: #ffffff;

$text: #caccce;
$textSecondary: #8d8e91;
$textTertiary: #646568;

$blurple: #8891f7;
$green: #66c79b;
$orange: #fbbb4b;
$red: #f26e70;

$gold: #cfa76b;
$silver: #a7abad;
$bronze: #ebb487;

$surface: #181a20;
$surfaceSecondary: #1e2129;
$surfaceTertiary: #23262f;

$menu: #1e2129;
$tip: #23262f;
$border: #272a35;

$shadowBottom: 0px 4px 4px #00000029;
$shadowAll: 0 8px 15px #00000033;


@function rem($value) {
  $remValue: calc($value / 16) * 1rem; 
  
  @return $remValue;
}

@mixin background($url, $color, $verticalAlignment, $horizontalAlignment, $scaling) {
  background: $url $color no-repeat $verticalAlignment $horizontalAlignment / $scaling;
}
