.main-text:hover,
.main-text:focus,
.main-text {
  color: var(--main-color);
}

.gray-text:hover,
.gray-text:focus,
.gray-text {
  color: var(--gray);
}

.gray-text-light:hover,
.gray-text-light:focus,
.gray-text-light {
  color: var(--gray-light);
}

.yellow-text:hover,
.yellow-text:focus,
.yellow-text {
  color: var(--yellow);
}

.yellow-text-light:hover,
.yellow-text-light:focus,
.yellow-text-light {
  color: var(--yellow-light);
}

.white-text:hover,
.white-text:focus,
.white-text {
  color: var(--white);
}

.black-text:hover,
.black-text:focus,
.black-text {
  color: var(--black);
}

.brown-text:hover,
.brown-text:focus,
.brown-text {
  color: #69443c;
}

.font-10 {
  font-size: 10px;
}

.font-12 {
  font-size: 12px;
}

.font-14 {
  font-size: 14px;
}

.font-16 {
  font-size: 16px;
}

.font-18 {
  font-size: 18px;
}

.font-20 {
  font-size: 20px;
}

.font-22 {
  font-size: 22px;
}

.font-24 {
  font-size: 24px;
}

.font-26 {
  font-size: 26px;
}

.font-28 {
  font-size: 28px;
}

.font-30 {
  font-size: 30px;
}

.font-36 {
  font-size: 36px;
}

h2,
.font-40 {
  font-size: 40px;
}

.font-55 {
  font-size: 55px;
}


/* heading */
h1 {
  font-size: 70px;
}

.fw-600 {
  font-weight: 600;
}