#now{
    width:100px;
    height:100px;
    position:fixed;
    background:red;
    color:white;
}

#pageout {

width:100%;
height:100%;
text-align:center;
position:fixed;
background:rgba(255,255,255,1);
z-index:999;
display:none;

}

#sakurawarp{
    width:0px;
    height:0px;
    position:fixed;
    z-index:998;
    left:50%;
    top:50%;
    transform-origin:50% 50%;
    -moz-transform-origin:50% 50%;
    -webkit-transform-origin:50% 50%;
    transform:translate(-50%,-50%);
    -moz-transform:translate(-50%,-50%);
    -webkit-transform:translate(-50%,-50%);
    background-size:contain;
    background-repeat:no-repeat;
    background-position:50% 50%;
}

@keyframes scalein{
    0%{
        width:0px;
        height:0px;
    }
    100%{
        width:3500px;
        height:3500px;
    }
}

@-moz-keyframes scalein{
    0%{
        width:0px;
        height:0px;
    }
    100%{
        width:3500px;
        height:3500px;
    }
}

@-webkit-keyframes scalein{
    0%{
        width:0px;
        height:0px;
    }
    100%{
        width:3500px;
        height:3500px;
    }
}

#disp{
    width:500px;
    height:100px;
    background:blue;
}

#sakura {

width:100%;
height:100%;
text-align:center;
position:fixed;
background:rgba(255,255,255,1);
z-index:999;

}

#sakuraimg {
position:absolute;
top:45%;
left:50%;
-moz-transform:translate(-50%,0);
-webkit-transform:translate(-50%,0);
}

#sakura img {
    -moz-transform-origin:50% 50%;
    -webkit-transform-origin:50% 50%;
    -webkit-animation:rotate 2s infinite linear;
}

@-webkit-keyframes rotate {
0% {
    -moz-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    }
50% {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    }
100% {
    -moz-transform:rotate(360deg);
    -webkit-transform: rotate(360deg);
    }
}


#loading {
color:#f1d1df;
position:absolute;
top:45%;
left:50%;
-moz-transform:translate(-50%,90px);
-webkit-transform:translate(-50%,90px);
}

.idou{
    cursor:pointer;
}