:root {
  --container-width: 100%;
  --container-padding: 16px;
  --font-main: var(--font-family);
  --font-accent: var(--second-family);
  --text-color: var(--main-white);
  --font-family: "Helvetica Neue", sans-serif;
  --second-family: "Gilroy", sans-serif;
  --page-bg: var(--main-black);
  --main-white: #fff;
  --main-yellow: #fed500;
  --main-black: #010101;
  --input-bg: #121212;
  --caret-color: var(--main-yellow);
}
@media (min-width: 768px) {
  :root {
    --container-width: 736px;
      --container-padding: 14px;

  }
}
@media (min-width: 1024px) {
  :root {
    --container-width: 1024px;
      --container-padding: 16px;

  }
}
@media (min-width: 1440px) {
  :root {
    --container-width: 1408px;
      --container-padding: 0px;

  }
}
@media (min-width: 1920px) {
  :root {
    --container-width: 1857px;
      --container-padding: 0px;

  }
}