/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/css.css to edit this template
*/
/* 
    Created on : Feb 25, 2023, 9:55:27 AM
    Author     : Administrator
*/

.bgHover:hover{
    animation-duration: .3s;
    animation-name: hoverBg;
    background: #f16217;
    animation-iteration-count: 1;
    animation-fill-mode:forwards;
    cursor: pointer;
}
@keyframes hoverBg {
    from {
        background-size:0%;
        width:98%;
    }

    to {
        width:100%;
        background-size:100%;
        color:aliceblue;
        font-size:14px;
        -webkit-box-shadow: -1px 15px 20px -11px rgba(0,0,0,0.75);
        -moz-box-shadow: -1px 15px 20px -11px rgba(0,0,0,0.75);
        box-shadow: -1px 15px 20px -11px rgba(0,0,0,0.75);
    }
}
table.table tbody tr:hover{
/*    animation-duration: .2s;
    animation-name: hoverTr;
    animation-fill-mode:forwards;*/

}
@keyframes hoverTr {
    from {
        width:100%;
        background-size:100%;
        /*color:aliceblue;*/
        font-size:14px;
    }

    to {
        width:100%;
        background: darkslategray;
        color:aliceblue;
        font-size:14px;
        -webkit-box-shadow: -1px 15px 20px -11px rgba(0,0,0,0.75) !important;
        -moz-box-shadow: -1px 15px 20px -11px rgba(0,0,0,0.75) !important;
        box-shadow: -1px 15px 20px -11px rgba(0,0,0,0.75) !important;
    }
}

.normal_link:hover{
    font-weight: bolder;
    color:aliceblue;
}

.sidemenu_bar:hover{
    animation-duration: 1s;
    animation-name: hoverSelfService;
    animation-fill-mode:forwards;
    animation-iteration-count: 1;
}

@keyframes hoverSelfService {
    from {
        width: 120px;
        margin-left:-110px;
        background: black;
        margin-top: 100px;
    }

    to {
        width: 120px;
        margin-left:-16px;
        background: black;
        margin-top: 100px;
    }
}

.sidemenu_bar_setting:hover{
    animation-duration: 1s;
    animation-name: hoverSettingBtn;
    animation-fill-mode:forwards;
    animation-iteration-count: 1;
}
@keyframes hoverSettingBtn {
    from {
        width: 135px;
        margin-left:-110px;
        background: black;
        margin-top: 150px;
    }

    to {
        width: 135px;
        margin-left:-16px;
        background: black;
        margin-top: 150px;
    }
}

.userPanelBring{
    animation-duration: 1s;
    animation-name: actUserPanel;
    animation-fill-mode:forwards;
    animation-iteration-count: 1;


}
@keyframes actUserPanel {
    from {
        position: fixed;
        height: 100%;
        background: #008fb3;
        width:20%;
        margin-left: 100%;
        z-index: 999;
        margin-top:-50px;
    }

    to {
        position: fixed;
        height: 100%;
        background: #008fb3;
        width:20%;
        margin-left: 80%;
        z-index: 999;
        margin-top:-50px;
    }
}

.userPanelOut{
    animation-duration: 1s;
    animation-name: actUserPanelOut;
    animation-fill-mode:forwards;
    animation-iteration-count: 1;


}
@keyframes actUserPanelOut {
    from {
        position: fixed;
        height: 100%;
        background: #008fb3;
        width:20%;
        margin-left: 80%;
        z-index: 999;
        margin-top:-50px;
    }

    to {
        position: fixed;
        height: 100%;
        background: #008fb3;
        width:20%;
        margin-left: 100%;
        z-index: 999;
        margin-top:-50px;
    }
}