:root { 
  --black: #000000;
  --gray: #dedede;
  --orange: #f26b0e;
  --white: #ffffff;
 
  --font-size-l: 32px;
  --font-size-m: 24px;
  --font-size-s: 20px;
  --font-size-xl: 42px;
  --font-size-xs: 18px;
  --font-size-xxl: 52px;
  --font-size-xxs: 14px;
 
  --font-family-lato: "Lato", Helvetica;
}

.title {
  font-family: var(--font-family-lato);
  font-size: var(--font-size-xl);
  font-style: normal;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 52px;
}

.headline {
  color: var(--black);
  font-family: var(--font-family-lato);
  font-size: var(--font-size-l);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 52px;
}

.body-text {
  font-family: var(--font-family-lato);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0;
}

.button-text {
  font-family: var(--font-family-lato);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 700;
  letter-spacing: 0;
}

.lato-bold-white-20px {
  color: var(--white);
  font-family: var(--font-family-lato);
  font-size: var(--font-size-s);
  font-style: normal;
  font-weight: 700;
}

.lato-medium-christine-14px {
  color: var(--orange);
  font-family: var(--font-family-lato);
  font-size: var(--font-size-xxs);
  font-style: normal;
  font-weight: 500;
}

.lato-black-white-18px {
  color: var(--white);
  font-family: var(--font-family-lato);
  font-size: var(--font-size-xs);
}

.lato-normal-white-18px {
  color: var(--white);
  font-family: var(--font-family-lato);
  font-size: var(--font-size-xs);
  font-style: normal;
  font-weight: 400;
}

.lato-black-white-24px {
  color: var(--white);
  font-family: var(--font-family-lato);
  font-size: var(--font-size-m);
  font-style: normal;
  font-weight: 900;
}

.flex-row {
  align-items: center;
  align-self: center;
  display: flex;
  margin-right: 0;
  margin-top: 28px;
  min-width: 480px;
}

.home-icon {
  background-image: url(../img/all-apps.svg);
  background-position: 50% 50%;
  background-size: cover;
  height: 25px;
  margin-right: 1.0px;
  width: 25px;
}

.navigation {
  align-items: flex-start;
  display: flex;
  margin-bottom: 0;
  min-width: 134px;
}

.navigation-item-1-active {
  background-color: var(--orange);
  border-radius: 5.5px;
  height: 11px;
  width: 11px;
}

.navigation-item-active {
  background-color: var(--orange);
  border-radius: 5.5px;
  height: 11px;
  margin-left: 5px;
  width: 11px;
}

.navigation-item {
  background-color: var(--gray);
  border-radius: 5.5px;
  height: 11px;
  margin-left: 5px;
  width: 11px;
}

.t-button-container {
  height: 55px;
  margin-left: 26px;
  position: relative;
  width: 218px;
}

.default-button {
  align-items: flex-end;
  background-color: var(--orange);
  cursor: pointer;
  display: flex;
  height: 54px;
  justify-content: flex-end;
  left: 106px;
  min-width: 112px;
  padding: 11px 28px;
  position: absolute;
  top: 1px;
}
