/*
 * Custom fonts
 */
@font-face {
    font-family: 'normalfont';
    font-weight: bold;
    src: url('res/BPreplayBold_0.otf'); 
}

@font-face {
    font-family: 'chinesefont';
    font-weight: bold;
    src: url('res/BPreplayBold_0.otf'); 
}
/*
 * No idea.
 */
body, canvas, div {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    -khtml-user-select: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/*
 * To remove the top and left whitespace
 */
* { 
    margin:0;
    padding:0;
}

/*
 * Just to make sure these are full screen.
 */
html, body
{
    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    background-color: #FFFFFF;
    overflow:hidden;
}

body {
    padding-bottom: 50px;
}

/*
 * To remove the scrollbars.
 */
#canvas {
    display: block;
    z-index: 1;
}

#bg {
    position: absolute;
    top: -100px;
    left: -315px;
}

#logo {
    position: absolute;
    top: 50px;
    left: 180px;
}
#barbg {
    position: absolute;
    top: 500px;
    left: 37px;
}
#over {
    position: absolute;
    top: 508px;
    left: 47px;
}
#fill {
    position: absolute;
    top: 506px;
    left: 45px;
}
#percentText {
    position: absolute;
    top: 513px;
    left: 690px;

    font-family: 'normalfont';
}
#container {
    position: absolute;
    left: 0px;
    top: 0px;
}

#rotatePopup {
    position: absolute;
    width: 1430px;
    height: 600px;
    left: 0px;
    top: 0px;
    z-index: 2;
}
#rotateBG {
    position: absolute;
    background-color: #1CDFFF;
    width: 1430px;
    height: 600px;
    left: -315px;
    top: 0px;
}
#rotateImg {
    position: absolute;
    left: 543px;
    top: 172px;
}