/* 
    Created on : 2019-12-1
    Author     : Yaerius
*/

html, body {
    height: 99%;
    font-size: 1rem;
}

#wrap {
    min-height: 100%;
    padding: 0;
}

#main {
    overflow:auto;
    padding-bottom:50px; /* this needs to be bigger than footer height*/
}

.page-footer {
    position: relative;
    margin-top: -40px; /* negative value of footer height */
    height: 40px;
    clear:both;
}

.link {
    cursor: pointer;
}

.red {
    color: red;
}

.pointer {
    cursor: pointer;
}

@media screen and (max-width: 575px) {
    .font-small, .font-small tr td button, .font-small tr td input, .font-small tr td span {
        font-size: 2.5vw;
    }
    .font-small tr td button, .font-small tr td input {
        padding: 2px 4px;
    }
    .font-mid, .font-mid tr td button, .font-mid tr td input {
        font-size: 4vw;
    }
    .quantity-button {
        width: 70px;
    }
}
@media screen and (min-width: 576px) and (max-width: 767px) {
    .font-small, .font-small tr td button, .font-small tr td input, .font-small tr td span {
        font-size: 2vw;
    }
    .font-small tr td button, .font-small tr td input {
        padding: 3px 6px;
    }
    .font-mid, .font-mid tr td button, .font-mid tr td input {
        font-size: 3vw;
    }
    .quantity-button {
        width: 100px;
    }
}
@media screen and (min-width: 768px) {
    .font-small, .font-small tr td button, .font-small tr td input, .font-small tr td span {
        font-size: 1rem;
    }
    .font-mid, .font-mid tr td button, .font-mid tr td input {
        font-size: 1rem;
    }
    .quantity-button {
        width: 140px;
    }
}