/* State classes replace application-written style attributes. */
.online-visible { display: revert !important; }
#gdprbar.online-visible { display: flex !important; }
.online-inline { display: inline-block !important; }
.online-hidden { display: none !important; }
.online-pre-line { white-space: pre-line; }
.online-emphasis { font-size: 120%; }
#pageframe { font-size: 30pt; }
#loginpage .imgpart > img { max-width: 600px; }
#loginpage .stepone > strong, #loginpage .steptwo > strong { font-size: 120%; }
.online-fade-in { animation: online-fade-in 150ms ease-out; }
.online-fade-out { animation: online-fade-out 150ms ease-in forwards; pointer-events: none; }
.online-fade-250 { animation-duration: 250ms; }
.online-fade-500 { animation-duration: 500ms; }
.online-login-attention { animation: online-login-attention 1100ms linear; }
#mainmenu.sticked { animation: online-fade-in 250ms ease-out; }
.group_resp_items.online-visible { animation: online-fade-in 200ms ease-out; }
@keyframes online-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes online-fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes online-login-attention {
    0%, 18%, 36%, 54%, 72%, 90% { opacity: 0; }
    9%, 27%, 45%, 63%, 81%, 100% { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .online-fade-in, .online-fade-out, .online-login-attention,
    #mainmenu.sticked, .group_resp_items.online-visible { animation: none; }
}