:root {
    --color-black: #000;
    --color-darkNavy: #111827;
    --color-darkNavy2: #2b284c;
    --color-subtitle: #2a2739;
    --color-gray: #141618;
    --color-paragraph: #c4c4cc;
    --color-purple: #5203ff;
    --color-paragraph-secondary: #8d8d99;
    --color-paragraph-footer: #e1e1e6;
    --color-card-black: #a3a3a3;
    --color-primary: #64D700;
  
    --color-white: #fff;
    --color-dark1: #09090a;
    --color-dark2: #8d8d99;
    --color-dark3: #202024;
    --color-dark4: #111827;
    --color-gray1: #f3f4f6;
    --color-gray2: #6b7280;
  }

  body::-webkit-scrollbar-track {
    box-shadow: inset 0 0 10px 10px var(--color-black);
    border: solid 8px var(--color-black);
  }
  body::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 10px 10px var(--color-primary);
    border: solid 3px var(--color-black);
    border-radius: 5px;
  }
  body::-webkit-scrollbar-corner {
    background: var(--color-black);
  }
  body::-webkit-scrollbar {
    width: 10px;
  }

  body{
    font-family: "Roboto", sans-serif;
    font-size: 1.125rem;
    font-weight: 300;
  }

  .color-primary{
    color: var(--color-primary);
  }

  .button{
    border-radius: 12px;
    color: #000;
    padding: 12px;
    width: 100%;
    font-weight: 700;
    font-size: 1.125rem;
  }

  .button-primary{
    background-color: var(--color-primary);
  }

  .button-black{
    background-color: var(--color-black);
    color: var(--color-white);
  }

  .section h1{
    font-size: 2.2rem;
  }

  .section h2{
    font-size: 1.8rem;
    text-align: center;
    padding: 12px 0;
  }