:root { 
  --alto: #d9d9d9;
  --athens-gray: #e7edf3;
  --black: #000000;
  --brandblue---dark: #00123e;
  --gray100: #f4f5ff;
  --gray200: #a4bbd5;
  --gray500: #5c7189;
  --gray700: #3c4957;
  --white: #ffffff;
 
  --font-size-l: 24px;
  --font-size-m: 20px;
  --font-size-s: 18px;
  --font-size-xl: 25px;
  --font-size-xs: 16px;
  --font-size-xxl: 27px;
  --font-size-xxs: 12.6px;
 
  --font-family-barlow: "Barlow", Helvetica;
  --font-family-roboto: "Roboto", Helvetica;
  --font-family-roboto-medium: "Roboto-Medium", Helvetica;
}
.h2---info-jogo {
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
}

.h3---info-jogo {
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
}

.roboto-normal-oxford-blue-20px {
  color: var(--gray700);
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.roboto-normal-waikawa-gray-16px {
  color: var(--gray500);
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 400;
}

.roboto-normal-tangaroa-20px {
  color: var(--brandblue---dark);
  font-family: var(--font-family-roboto);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
}

.barlow-semi-bold-casper-12-6px {
  color: var(--gray200);
  font-family: var(--font-family-barlow);
  font-size: var(--font-size-xxs);
  font-style: italic;
  font-weight: 600;
}

.roboto-medium-black-16px {
  color: var(--black);
  font-family: var(--font-family-roboto-medium);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 500;
}