.btn-file {
    position: relative;
    overflow: hidden;
}

    .btn-file input[type=file] {
        position: absolute;
        top: 0;
        right: 0;
        min-width: 100%;
        min-height: 100%;
        font-size: 100px;
        text-align: right;
        filter: alpha(opacity=0);
        opacity: 0;
        outline: none;
        background: white;
        cursor: inherit;
        display: block;
    }

.Clickable {
    cursor: pointer;
}

.table-hover-cells > tbody > tr > th:hover,
.table-hover-cells > tbody > tr > td:hover {
    background-color: #A9A9A9;
}

.table-hover-cells > tbody > tr > th.active:hover,
.table-hover-cells > tbody > tr > td.active:hover,
.table-hover-cells > tbody > tr.active > th:hover,
.table-hover-cells > tbody > tr.active > td:hover {
    background-color: #A9A9A9;
}

.table-hover.table-hover-cells > tbody > tr:hover > th:hover,
.table-hover.table-hover-cells > tbody > tr:hover > td:hover {
    background-color: #A9A9A9;
}

.table-hover.table-hover-cells > tbody > tr.active:hover > th:hover,
.table-hover.table-hover-cells > tbody > tr.active:hover > td:hover {
    background-color: #A9A9A9;
}

.customized-control-input:focus {
    box-shadow: none;
}

.active-row {
    background: Aqua;
}

.highlighted {
    text-shadow: -3px 0px 3px yellow, 3px 0px 3px yellow, 6px 0px 6px yellow, -6px 0px 6px yellow;
    color: black;
}

@media (max-width: 768px) {
    input[type=checkbox] {
        width: 22px;
    }
}


.modal-xl {
    width: 90%;
    max-width: 1200px;
}

.modal-l {
    width: 60%;
    max-width: 800px;
}

.table-small, .table-sm input {
    font-size: 85%;
}

    .table-small input {
        height: 85%;
    }

.colorPickSelector {
    border-radius: 5px;
    width: 108px;
    height: 36px;
    cursor: pointer;
    -webkit-transition: all linear .2s;
    -moz-transition: all linear .2s;
    -ms-transition: all linear .2s;
    -o-transition: all linear .2s;
    transition: all linear .2s;
}

    .colorPickSelector:hover {
        transform: scale(1.1);
    }

.Condensed > thead > tr > th {
    font-weight: normal;
    font-size: 11px;
}

.Condensed > tbody > tr > td {
    font-size: 8px;
}

.btn-male {
    background-color: blue;
}

.btn-male:hover {
    background-color: lightblue;
}

.btn-female {
    background-color: pink;
}

.btn-female:hover {
    background-color: lightpink;
}

.modal-dialog.font-small label, .modal-dialog.font-small input, .modal-dialog.font-small select, .modal-dialog.font-small button {
    font-size: 80%;
}
    .modal-dialog.font-small input[type="text"], .modal-dialog.font-small select {
        height: 80%;
    }

    .modal-dialog.font-small input[type="time"]{
        height: 47%;
    }

.font-small {
    font-size: 80%;
}

.select-xs {
    height: calc(1.3rem + 2px);
    padding: 0.25rem 0.5rem;
    font-size: 0.75rem;
    line-height: 1.5;
}