:root {
    --qp-primary: #2DAA8C;
    --qp-secondary: #E0D620;
    --qp-dark: #4D6764;
    --qp-light: #BFCFCD;
    --qp-white: #FAFCFC;
    --qp-black: #3D4544;
    --qp-shadow: #F4F6F6;
}

.qp-btn {
    background: var(--qp-primary);
    border-radius: 8px;
    border: none;
}

.qp-btn > span > img {
    height: 20em;
}

.qp-btn-outline {
    background: transparent;
    color: var(--qp-dark);
    border-radius: 8px;
    border: 2px solid var(--qp-dark);
}

.qp-btn-outline:hover {
    color: var(--qp-white);
}

.qp-btn-outline > span > img {
    height: 2em;
}

.qp-btn-small {
    padding: 10px;
    border: 2px solid var(--qp-dark);
    border-radius: 50%;
}

.qp-btn-small > span > img {
    height: 2em;
}

.qp-input {
    border-radius: 8px;
    border: 2px solid var(--qp-dark);
    padding: 10px;
    height: 3.49em;
}

.qp-bg-secondary {
    background: var(--qp-secondary);
}

.qp-color-dark {
    color: var(--qp-dark);
}

.container {
    width: 90%;
}