/*
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: .25s;
    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:black;
        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:blue;
}

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

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

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

.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;
    }
}

.bgBlock{
    -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);
}

.navhover {
    /*font-size: 2rem;*/
    /*color: #ffffff;*/
    /*position: relative;*/
    /*display: inline-block;*/
    transition: font-weight 0.2s ease;
}

.navhover::after,
.navhover::before {
    content: '';
    position: absolute;
    width: 100%;
    height: 2px;
    background: linear-gradient(to right, #ff0000, #00ffff, #80ff00);
    bottom: -0px;
    left: 0;
    font-weight: bolder;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.3s ease-out;
}

.navhover::before {
    top: -0px;
    transform-origin: left;
}
.navhover:hover {
    font-weight: bolder;
}
.navhover:hover::after,
.navhover:hover::before {
    transform: scaleX(1);
    font-weight: bolder;
}