html{
    height:  100%;
}

body{
    background: white url("../images/bg-pattern.png") repeat;
    font-size: 13px;
    height:  100%;
    position: relative;
}

.sad {
    font-family: 'Rokkitt', serif;
    position: absolute;
    width: 100%;
    text-align: center;
    font-size: 3em;
    padding: 20px;
    margin:  auto;
    top: 38%;
}


@keyframes rotate-full {
    0% {
        -webkit-transform: rotate(0deg)
    }
    100% {
        -webkit-transform: rotate(360deg)
    }
}



.footer-svg{
    animation: rotate-full 40s 0s linear infinite reverse;
    /*animation: flip 3s 0s linear infinite reverse;*/
    position: fixed;
    bottom: -220px;
    right: -100px;
    z-index: 0;
    opacity: .5;
}

.cover{
    position: absolute;
    top:0;
    left:0;
    width: 100%;
    height: 100%;
    z-index: 1000;
    background: white;
    opacity: .8;
}

@keyframes flip {
    0% { transform: rotateY(0deg); opacity: 1; }
    13% { opacity: 0.4; }
    25% { transform: rotateY(180deg); opacity: 1; }
    50% { transform: rotateY(180deg); opacity: 1; }
    63% { opacity: 0.4; }
    75% { transform: rotateY(0deg); opacity: 1; }
    100% { transform: rotateY(0deg); opacity: 1; }
}

.cover-svg{
    position: absolute;
    top:50%;
    left:50%;
    width: 90px;
    height: 74px;
    margin-top: -45px;
    margin-left: -37px; 
    z-index: 1001;
    animation: flip 3s 0s linear infinite reverse;
}
.cover-text{
    position: absolute;
    top:50%;
    left:50%;
    width: 90px;
    height: 74px;
    margin-top: 40px;
    margin-left: -37px; 
    z-index: 1001;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    color: #175718;
}
