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

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

hr {
    border-top: 2px solid white;
}

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

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

.page-footer {
    position: relative;
    margin-top: -55px; /* negative value of footer height */
    height: 52px;
    clear:both;
    border-top: 3px solid white;
}

.font-always-small {
    font-size: 0.8rem;
}
.font-bigger {
    font-size: 1.2rem;
}

.link {
    cursor: pointer;
    z-index: 10;
}

.red {
    color: red;
}

.jq-dnone {
    display: none;
}

.w-10 {
    width: 10% !important;
}
.w-15 {
    width: 15% !important;
}
.w-20 {
    width: 20% !important;
}
.w-60 {
    width: 60% !important;
}
.w-70 {
    width: 70% !important;
}

.clear-input {
    position: absolute;
    right: 8px;
    top: 5px;
    margin: auto;
    cursor: pointer;
    color: #ccc;
    z-index: 1;
}

.clear-input:hover {
    color: darkred;
}

label.crit {
    white-space: pre-wrap;
}

table tfoot
{
    border-top: 2px solid black;
    font-weight: bold;
}

th.rotate {
    height: 270px;
    white-space: nowrap;
}

th.rotate > div {
    transform:
        translate(0px, 65px)
        rotate(285deg);
    width: 0px;
}
th.rotate > div > span {
    border-bottom: 1px solid #ccc;
    padding: 5px 10px;
    margin-left: 55px;
    z-index: -10;
}

@media screen and (max-width: 575px) {
    .font-small {
        font-size: 2.5vw;
    }
    .font-mid {
        font-size: 4vw;
    }
}
@media screen and (min-width: 576px) and (max-width: 767px) {
    .font-small {
        font-size: 2vw;
    }
    .font-mid {
        font-size: 3vw;
    }
}
@media screen and (min-width: 768px) {
    .font-small {
        font-size: 1rem;
    }
    .font-mid {
        font-size: 1rem;
    }
}