.zoom {
    transition: transform .3s;
}

.zoom:hover {
    -ms-transform: scale(1.4); /* IE 9 */
    -webkit-transform: scale(1.4); /* Safari 3-8 */
    transform: scale(1.4); 
}

.black-text{
    color:#000 !important;
}

.survey-control {
    width: auto !important;
    padding: 0 3px !important;
    height: auto !important;
}

.margin-left-small {
    margin-left: 1em;
}

.button-spacer {
    width:2em;
    display: inline-block;
}

.action-button-spacer{
    width:1em;
    display: inline-block;
}

.width-auto {
    width:auto !important;
}

#overlay{	
    position: fixed;
    top: 0;
    z-index: 100000;
    width: 100%;
    height:100%;
    display: none;
    background: rgba(0,0,0,0.6);
}
.cv-spinner {
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;  
}
.spinner {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #007bff solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}
.spinner-default {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #007bff solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}
.spinner-darkmode {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #222222 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}
.spinner-darkmenus {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #777777 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}
.spinner-defaultgreen {
    width: 40px;
    height: 40px;
    border: 4px #ddd solid;
    border-top: 4px #28a745 solid;
    border-radius: 50%;
    animation: sp-anime 0.8s infinite linear;
}
@keyframes sp-anime {
    100% { 
        transform: rotate(360deg); 
    }
}
.is-hide{
    display:none;
}

.nav-legacy.nav-sidebar>.nav-item>.nav-link.active {
    background-color: inherit !important;
    border-left: 12px solid transparent;
    box-shadow: none !important;
}

.img-circle-20 {
    border-radius: 20%;
}

input[type=date] {
    position: relative;
    width: 150px;
    /*height: 20px;*/
    color: white;
}

input[type=date]:before {
    position: absolute;
    top: 5px; left: 5px;
    content: attr(data-date);
    display: inline-block;
    color: black;
}

input[type=date]::-webkit-datetime-edit, input[type=date]::-webkit-inner-spin-button, input[type=date]::-webkit-clear-button {
    display: none;
}

input[type=date]::-webkit-calendar-picker-indicator {
    position: absolute;
    top: 3px;
    right: 0;
    color: black;
    opacity: 1;
}