/* Copyright 1999-2018. Plesk International GmbH. All rights reserved. */
html {
    font: normal 13px/1.4 "-apple-system", "system-ui", "BlinkMacSystemFont", "Segoe UI", "Roboto", "Helvetica Neue", "Arial", sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    overflow-y: scroll;
    color: #000;
}
html,
body {
    height: 100%;
    min-height: 100%;
	background: #545f71;
	margin: 0; 
}
a { background-color: transparent; }
a:active,
a:hover { outline: 0; }
a {
    color: #2498e3;
    text-decoration: none;
    cursor: pointer;
}
a:hover {
    color: #188dd9;
    text-decoration: underline;
}
img {
    box-sizing: border-box;
    border: 0;
    vertical-align: middle;
    -ms-interpolation-mode: bicubic;
}


#logo_login{width: 250px; display: block; transform: scale(0); margin: 40px auto 0 auto; animation-name: scala_no_bounce; animation-delay: 1.8s; animation-duration: .3s; animation-timing-function: ease; animation-fill-mode: forwards; transform-origin: bottom;}
#logo_login img{width: 100%; height: auto;}

#mario{width: 80%; max-width: 500px; margin: 5px auto 0 auto; animation-name: ruota_y; animation-delay: 3.5s; animation-duration: 1s; animation-direction: reverse; animation-fill-mode: forwards;}
#mario img{width: 100%; height: auto;}

/* ANIMATIONS */

@keyframes scala {
    0% {transform: scale(0.5);}
    75% {transform: scale(1.03);}
    100% {transform: scale(1);}
}

@keyframes scala_no_bounce {
    0% {transform: scale(0);}
    100% {transform: scale(1);}
}

@keyframes lampeggia {
    0% {box-shadow: 0 0 3px 0 #00BCD4;}
    100% {box-shadow: 0 0 6px 3px #00BCD4;}
}

@keyframes ruota_y {
    0% {transform: rotate3d(0, 1, 0, 90deg); opacity: 0;}
    100% {transform: rotate3d(0, 1, 0, 0deg); opacity: 1;}
}

@keyframes scala_y {
    0% {transform: ScaleY(0);}
    100% {transform: ScaleY(1);}
}

.page-container {
    position: relative;
    display: table;
    width: 100%;
    height: 100%;
    table-layout: fixed;
}