* {
    margin: 0;
    padding: 0;
    font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
    /* border: 1px solid red; */
}

:root {
    --green: rgba(0, 160, 0, 0.4);
    --green-highlight: #00f0000f;
    --blue: rgb(178 215 255);;
    --red: rgba(160, 0, 0, 0.4);
    --yellow: rgba(160, 160, 0, 0.4);
    --grey: #d0d0d0d8;
    --grey-no-opacity: #d0d0d0;
    --tooltip-grey: #C3C3C3;
    --grey-font: #444;
    --grey-font: rgba(75, 75, 75, 0.85);
}

body {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: #f4f4f4;
    font-size: 100%;
    margin: 0 50px;
    /* color: var(--grey-font); */
}

h2 {
    font-size: 1.2em;
}

h3 {
    margin-top: 10px;
    text-align: center;
    font-size: 2em;
}

.button {
    border: none;
    border-radius: 5px;
    cursor: pointer;
    padding: 12px 0;
    text-align: center;
}

.logo-container {
    display: flex;
    justify-content: center;
    margin-top: 20px;
}

.logo-container img {
    width: 100%;
    max-width: 200px;
}

.green {
    background-color: var(--green);
}

.red {
    background-color: var(--red);
}

.yellow {
    background-color: var(--yellow);
}

.dark-on-hover:hover {
    filter: brightness(85%);
}

.product-stat {
    border: solid 1px var(--grey);
    margin-top: 10px;
    height: auto;
    padding: 5px;
    text-align: center;
}

.flex {
    display: flex;
}

.flex-center {
    justify-content: center;
}

.flex-column {
    flex-direction: column;
}