/* Main */

body {
    -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;
    font-family: 'Patrick Hand', cursive;
    overflow:hidden;
    margin:0;
    /* Day Night Anim */
    background-color:#C4FFFE;
    animation: DayNight 900s infinite linear;
}

@keyframes DayNight {
    0% {background-color:#C4FFFE}
    50% {background-color:#221454}
    100% {background-color:#C4FFFE}
}

.Centered {
    position: absolute; top: 50%; left: 50%; margin-right: -50%; transform: translate(-50%, -50%); text-align:center;
}

#Main {
    transform:scale(1);
}

/* Loading Text */
.LoadingText {
    animation: LoadingText 1s infinite ease-in-out;
}
@keyframes LoadingText {
    0% {transform:scale(1);}
    50% {transform:scale(1.15);}
    100% {transform:scale(1);}
}

/* Starry Night */
.StarryNight {
    background-image:url("../image/night.gif"); background-repeat:repeat;
    position:fixed; top:0px; left:0px; width:100%; height:100%;
    animation: StarFade 900s infinite linear;
}

@keyframes StarFade {
    0% {filter:opacity(0%)}
    25% {filter:opacity(0%)}
    50% {filter:opacity(60%)}
    75% {filter:opacity(0%)}
    100% {filter:opacity(0%)}
}

/* Clouds BG */
.Clouds {
    animation: CloudScroll 20s infinite linear, CloudFade 900s infinite linear;
    filter:opacity(50%);
}
@keyframes CloudFade {
    0% {filter:opacity(50%)}
    50% {filter:opacity(2%)}
    100% {filter:opacity(50%)}
}
@keyframes CloudScroll {
    from {transform:translateX(0px);}
    to {transform:translateX(-720px);}
}

/* Globe */
.Globe {
    position:fixed; bottom:-1560px; left:50%; transform:translateX(-510px);
    animation:NightDarken 900s infinite linear;
}

.GlobeImg {
    image-rendering:pixelated;
    animation: GlobeRotate 15s infinite linear;
}

@keyframes GlobeRotate {
    0% {transform:rotate(0deg) scale(3)}
    100% {transform:rotate(360deg) scale(3)}
}

/* Furret */
.Furret {
    position:fixed; bottom:250px; left:0px; right:0px; text-align:center;
    transform:scale(0.8);
    animation:NightDarken 900s infinite linear;
}

@keyframes NightDarken {
    0% {filter:brightness(100%)}
    50% {filter:brightness(30%)}
    100% {filter:brightness(100%)}
}

/* Timer */
.Timer {
    position:fixed; bottom:30px; right:30px; font-size:1.5rem;
    text-shadow:1px 1px rgb(255, 255, 255);
}