:root {

  /**  @font family declaration */
  --rs-ff-body: 'Space Grotesk', sans-serif;
  --rs-ff-title: 'Space Grotesk', sans-serif;
  --rs-ff-p: 'Space Grotesk', sans-serif;
  --rs-ff-fontawesome: "Font Awesome 6 Pro";
  --rs-ff-remixicon: "remixicon";

  /** @color declaration */


  // common color
  --rs-white: #FFFFFF;
  --rs-black: #1F1F1F;
  --rs-light: #eee;

  // theme color
  --rs-theme-orange: #EA5501;
  --rs-theme-red: #E30613;
  --rs-theme-blue: #005EB8;
  --rs-theme-light-blue: #0D80CE;
  --rs-theme-green: #023B4A;
  --rs-theme-light-green: #507A7C;
  --rs-theme-yellow: #F7C600;
  --rs-theme-deep-blue: #3B37FD;
  --rs-theme-cyan: #00CAA4;
  --rs-theme-medium-blue: #1455AA;
  --rs-theme-medium-yellow: #FFCA3B;


  // body text color
  --rs-text-primary: #616161;
  --rs-text-secondary: #CBCCCD;
  --rs-text-tertiary: #142340;

  // title color
  --rs-title-primary: #1F1F1F;
  --rs-title-secondary: #152A40;

  // bg color
  --rs-bg-primary: #F7F7F7;


  // border color
  --rs-border-primary: rgba(0, 0, 0, 0.05);
  --rs-border-secondary:rgba(102, 102, 102, 0.2);
  --rs-border-tertiary: #152A40;

  //  placeholder color
  --rs-placeholder: rgba(30, 30, 30, 0.4);


  // rgba color
  --rs-rgba-1: rgba(255, 255, 255, 0.07);
  --rs-rgba-2: rgba(255, 255, 255, 0.05);


  // extra color
  --rs-rating-color: #FFC62D;


  /** @font weight declaration */
  --rs-fw-normal: normal;
  --rs-fw-thin: 100;
  --rs-fw-elight: 200;
  --rs-fw-light: 300;
  --rs-fw-regular: 400;
  --rs-fw-medium: 500;
  --rs-fw-sbold: 600;
  --rs-fw-bold: 700;
  --rs-fw-ebold: 800;
  --rs-fw-black: 900;

  /** @font size declaration */
  --rs-fs-body: 18px;
  --rs-fs-p: 17px;
  --rs-fs-h1: 68px;
  --rs-fs-h2: 52px;
  --rs-fs-h3: 38px;
  --rs-fs-h4: 28px;
  --rs-fs-h5: 24px;
  --rs-fs-h6: 20px;
  --rs-fs-b1: 14px;
  --rs-fs-b2: 16px;
  --rs-fs-b3: 18px;
  --rs-fs-b4: 22px;
}

$white: #ffffff;
$black: #000000;
$theme-black: #231F40;
$primary: #5777FF;
$secondary: #F3DABA;
$info: #0dcaf0;
$warning: #ffc107;
$danger: #FF0000;