html,
body {
    margin: 0px;
    font-family: sans-serif;
    /* font-size: 16px; */
    height: 100%;
    cursor: default;
    background: #f5f5f5;
}

* {
    box-sizing: border-box;
}

a {
    cursor: pointer;
    text-decoration: none;
    color: black;
}

input {
    font-size: 16px;
    border-radius: 3px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    padding: 5px;
}

input[type="checkbox"] {
    height: 20px;
    width: 20px;
    cursor: pointer;
}

input::placeholder {
    color: #aaa;
}

select {
    font-size: 16px;
    border-radius: 3px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    padding: 5px;
    cursor: pointer;
}

/* TABULATOR =============================================================================================== */

/* .tabulator {
    border: 1px solid red;
} */

.tabulator-cell {
    border-right: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.tabulator-cell input[type="checkbox"] {
    width: 20px;
    height: 20px;
    cursor: pointer;
}

/* TABULATOR ADD TO CART INPUT GROUP =============================================================================================== */

.input-group {
    display: flex;
}

.input-group input {
    width: 80px;
    margin-right: 5px;
}

.input-group .btn i {
    margin-right: 0px;
}

.no-margin {
    margin: 0px;
}

/* COUNTER =============================================================================================== */

.counter {
    display: flex;
    margin-left: auto;
    border-radius: 3px;
    background: red;
    color: white;
    padding: 0px 5px;
}

/* BUTTONS =============================================================================================== */

.btn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px 5px;
    border: solid 1px rgba(0, 0, 0, 0.2);
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    cursor: pointer;
    border-radius: 3px;
    box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, 0.2);
    /* right, bottom blur spread */
}

.btn i {
    margin-right: 5px;
}

.btn:hover {
    background: rgb(221, 221, 221);
}

.btn-black {
    background: rgb(69, 69, 69);
    color: white;
}

.btn-black:hover {
    background: rgb(47, 47, 47);
}

.btn-blue {
    background: rgb(60, 105, 182);
    color: white;
}

.btn-blue:hover {
    background: rgb(50, 87, 150);
}

.btn-green {
    background: rgb(76, 182, 60);
    color: white;
}

.btn-green:hover {
    background: rgb(64, 154, 51);
}

.btn-red {
    background: rgb(231, 65, 65);
    color: white;
}

.btn-red:hover {
    background: rgb(184, 52, 52);
}

.btn-yellow {
    background: rgb(255, 240, 26);
}

.btn-yellow:hover {
    background: rgb(245, 228, 0);
}