#notif_container.disabled{
    display:none;
}

.notif_button_disable{
    display: none;
}

#notif_container.dismissed{
    transform:scale(1.05) translateX(-50%);
    opacity:0;
}

#notif_container.dismissed  #notif_accept:hover{
    cursor: default;
}

#notif_container.dismissed  #notif_decline:hover{
    cursor: default;
}

#notif_container.visible{
    transform: translateY(0px) translateX(-50%);
}

#notif_container{
    display: flex;
    flex-direction: column;
    position: fixed;
    top: 0;
    background: white;
    box-shadow: rgb(0 0 0 / 75%) 0px 0px 10px -3px;
    padding: 20px;
    padding-top:30px;
    font-family: system-ui;
    width: calc(100% - 42px);
    max-width: 400px;
    margin: 0 calc(50vw);
    opacity:1;
    transform: translateY(calc(-100% - 20px)) translateX(-50%);
    transition: transform 0.5s, opacity 0.5s;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
	z-index: 10000;
}

#notif_upper{
    display:flex;
    flex-flow: wrap;
}

#notif_logo{
    width: 48px;
    height: 48px;
    background-image: url(https://ds-slave.cz/supply/notification.png);
    background-size: cover;
    margin-right: 20px;
}

#notif_text{
    font-size: 13pt;
    font-weight: 500;
}

#notif_text2{
    font-weight: 300;
}

#notif_bottom{
    display: flex;
    width: 100%;
    justify-content: end;
    margin-top: 20px;
}

#notif_prompt{
    padding: 5px 20px;
    color: steelblue;
}

#notif_decline:hover{
    /*background-color:red;*/
    /*color:white;*/
}

#notif_decline{
    user-select: none; /* supported by Chrome and Opera */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    /*border: red solid 1px;*/
    /*border-radius: 5px;*/
    /*background-color: white;*/
    cursor:pointer;
    padding: 5px 20px;
    margin-right:20px;
    color:steelblue;
    /*transition: background-color 0.5s, color 0.5s;*/
}

#notif_accept:hover{
    --color: rgb(46, 83, 114);
}

#notif_accept{
    user-select: none; /* supported by Chrome and Opera */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    --color:steelblue;
    border: var(--color) solid 1px;
    border-radius: 5px;
    background: var(--color);
    padding: 5px 30px;
    color: white;
    cursor:pointer;
    transition: all 0.5s;
}