@font-face {
    font-family: "Metropolis";
    src: url("../fonts/metropolis.black.otf") format("opentype");
}

@font-face {
    font-family: "Metropolis-Regular";
    src: url("../fonts/metropolis.regular.otf") format("opentype");
}

.fg-yellow {
    background-color: #fff280;
    opacity: 1;
}

.fg-orange {
    background-color: #ffb803;
    opacity: 1;
}

.fg-red {
    background-color: #f93c00;
    opacity: 1;
}

.fg-yellow-2 {
    background-color: #ffe600;
    opacity: 1;
}

.fg-green {
    background-color: #01df3f;
    opacity: 1;
}

.fg-text-red {
    font-family: "Metropolis";
    font-size: 18px;
    color: #2a90ff;
}

.fg-text-white {
    font-family: "Metropolis-Regular";
    font-size: 24px;
    font-weight: 500;
    text-align: center;
    color: #ffffff;
}

.fg-text-white-thick {
    font-family: "Metropolis";
    font-size: 24px;
    text-align: center;
    color: #ffffff;
}

.fg-text-orange {
    font-family: "Metropolis";
    font-size: 1rem;
    color: #ff9a03;
}

.fg-text-total {
    color: #f93c00;
    font-weight: 500;
}

.fg-icon-box {
    height: 73px;
    width: 73px;
    min-width: 73px;
    min-height: 73px;
    max-width: 73px;
    max-height: 73px;
}

.fg-bg-red {
    background-color: #e70000;
    color: #ffffff;
}

.fg-bg-fruit {
    background-color: #ffe600;
}

.fg-text-fruit {
    color: #ffe600;
}

.fg-bg-fruit-2 {
    background-color: #fec02f;
}

.fg-text-fruit-2 {
    color: #fec02f;
}

.fg-bg-drinks {
    background-color: #ff6737;
}

.fg-text-drinks {
    color: #ff6737;
}

.fg-bg-snacks {
    background-color: #c60b15;
}

.fg-text-snacks {
    color: #c60b15;
}

.fg-bg-vege {
    background-color: #c7d900;
}

.fg-text-vege {
    color: #c7d900;
}

.fg-bg-dry-food {
    background-color: #550d08;
}

.fg-text-dry-food {
    color: #550d08;
}

.fg-bg-personal-care {
    background-color: #c60b15;
}

.fg-text-personal-care {
    color: #c60b15;
}

.fg-bg-etc {
    background-color: #2a0306;
}

.fg-text-etc {
    color: #2a0306;
}

.fg-fruit-icon {
    vertical-align: middle;
    max-width: 100%;
    margin: 5px;
}

.fg-input {
    outline: 0;
    border-width: 0 0 2px;
    border-color: #ff9a03;
}

.fg-input:focus {
    border-width: 0 0 3px;
}