
/* HTML Stuffs */
@font-face {
    font-family: VCR OSD Mono;
    src: url("./assets/fonts/vcr.ttf");
}
html,body {
    height:100%;
    background-color: black;
    margin: 0px;
    color: #FFF;
    font-family: VCR OSD Mono;
    font-weight: lighter;
    text-rendering:optimizeLegibility;

}
/* Game */
.gameCanvas {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

/* Cameras */
#camWorld {
    background-color: #b61e1e;
    position: absolute;
    top: 50%;
    left: 50%;
}

#camHUD {
    background-color: rgba(0, 0, 0, 0);
    width: 100%;
    height: 100%;
    position: absolute;
}

#camOther {
    background-color: rgba(0, 0, 0, 0);
    width: 100%;
    height: 100%;
    position: absolute;
}


/* Object */
img, p {
    margin: 0px;
    position: absolute;
}

/* Effects */
.textStroke
{
    color: white;
    text-shadow:
    /* Outline */
    -1px -1px 0 #000000,
    1px -1px 0 #000000,
    -1px 1px 0 #000000,
    1px 1px 0 #000000,  
    -2px 0 0 #000000,
    2px 0 0 #000000,
    0 2px 0 #000000,
    0 -2px 0 #000000;
}

/* PlayState / Gameplay */
#note-strum-opponent, #note-strum-player {
    position: absolute;
    transform: scale(0.6);
    top: 50px;
    left: 50px;
}
.note-scroll {
    margin: 0px;
    position: absolute;
}
.note-scroll-player {
    margin: 0px;
    position: absolute;
}
#note-group-opponent-sustain, #note-group-player-sustain {
    margin: 0px;
    position: absolute;
}
#touch-group {
    position:absolute;
}
#touch-input {
    position:absolute;
    height: 100%;
}
#bg-video {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    height:100%;
}
#fps-text {
    font-family: Consolas;
}
#rating-sprite {
    position: absolute;
    transform: scale(0.4);
}

#combo-sprite {
    position: absolute;
    transform: scale(0.3);
}

#countdown-sprite {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%) scale(0.5);
}