html{
font-family:'Open Sans',sans-serif;
}
body{
font-family:'Open Sans',sans-serif;
}
#gamebg{
position:absolute;
width:100%;
height:100%;
}
#gametitle_bg{
position:absolute;
z-index:70;
left:70px;
top:56px;
width:504px;
height:384.00px;
}
#gameover_bg2{
position:absolute;
z-index:70;
left:68px;
top:166px;
width:504px;
height:198.00px;
display:none;
}
#gametitle{
position:absolute;
z-index:80;
left:70px;
top:56px;
width:504px;
height:384.00px;
}
#trebleguy{
position:absolute;
z-index:90;
left:76px;
top:180px;
width:133px;
height:143.81px;
}
#welcometxt1{
position:absolute;
z-index:210;
left:118px;
top:88px;
width:390px;
height:18.00px;
text-align:left;
font-weight:700;
color:#004d00;
font-size:16px;
letter-spacing:-.5px;
line-height:16px;
}
#replaybut1{
position:absolute;
z-index:210;
left:76px;
top:354px;
width:154px;
height:52.00px;
text-align:center;
font-weight:700;
border:3px solid transparent;color:#000066;cursor:pointer;
display:none;
border-radius:5px;
font-size:14px;
letter-spacing:-.5px;
line-height:18px;
}
#replaybut1:hover{
border:3px solid #000066;color:#ff0000;}
#replaybut1:active{
border:3px solid #000066;color:#ff0000;}
#welcometxt3{
position:absolute;
z-index:215;
left:328px;
top:296px;
width:80px;
height:22.00px;
text-align:center;
font-weight:700;
color:#005500;
font-size:22px;
letter-spacing:0px;
line-height:22px;
cursor:default;
}
#apple1{
position:absolute;
z-index:223;
left:299px;
top:10px;
width:34px;
height:42.00px;
}
#apple2{
position:absolute;
z-index:223;
left:310px;
top:180px;
width:34px;
height:42.00px;
display:none;
}
#apple3{
position:absolute;
z-index:223;
left:520px;
top:180px;
width:34px;
height:42.00px;
display:none;
}
#nextbut{
position:absolute;
z-index:999;
left:558px;
top:452px;
width:80px;
height:34.00px;
color:#ffff00;
font-weight:700;
text-align:center;
cursor:pointer;
display:none;
background:radial-gradient(ellipse at center, #00ff00 0%, #006600 77%,#000000 100%);
border-radius:5px;
font-size:18px;
line-height:30px;
}
#nextbut:hover{
color:#ff9900}
#nextbut:active{
color:#ff9900}
#dynbut1{
position:absolute;
z-index:505;
left:554px;
top:440px;
width:80px;
height:34.00px;
color:#ffff00;
font-weight:700;
text-align:center;
cursor:pointer;
background:radial-gradient(ellipse at center, #00ff00 0%, #006600 77%,#000000 100%);
border-radius:5px;
font-size:18px;
line-height:30px;
}
#dynbut1:hover{
color:#ff9900}
#dynbut1:active{
color:#ff9900}
#dynbut2{
position:absolute;
z-index:510;
left:554px;
top:440px;
width:80px;
height:34.00px;
color:#ffff00;
font-weight:700;
text-align:center;
cursor:pointer;opacity:0.0;
display:none;
background:radial-gradient(ellipse at center, #00ff00 0%, #006600 77%,#000000 100%);
border-radius:5px;
font-size:18px;
line-height:30px;
}
#dynbut2:hover{
color:#ff9900}
#dynbut2:active{
color:#ff9900}
#gamescore{
position:absolute;
z-index:350;
left:481px;
top:10px;
width:106px;
height:22.00px;
color:#000000;
font-weight:700;
text-align:right;
cursor:pointer;

display:none;
font-size:22px;
line-height:22px;
cursor:default;
}
#gamescoretit{float:left;}
#gamescoretxt{float:right;}
#instructionstxt1{
position:absolute;
z-index:230;
left:244px;
top:110px;
width:156px;
height:56.00px;
text-align:center;
font-weight:700;
color:#7b0607;
display:none;
font-size:20px;
letter-spacing:0px;
line-height:26px;
}
#instructionstxt5{
position:absolute;
z-index:230;
left:210px;
top:166px;
width:246px;
height:56.00px;
text-align:center;
font-weight:700;
color:#7b0607;
display:none;
font-size:20px;
letter-spacing:0px;
line-height:26px;
}
#instructionstxt4{
position:absolute;
z-index:235;
left:280px;
top:70px;
width:86px;
height:30.00px;
text-align:left;
font-weight:700;
color:#005700;
display:none;
font-size:30px;
letter-spacing:0px;
line-height:30px;
cursor:default;
}
#instructionstxt6{
position:absolute;
z-index:238;
left:450px;
top:354px;
width:106px;
height:18.00px;
text-align:left;
font-weight:700;
color:#005700;
display:none;
font-size:18px;
letter-spacing:-.5px;
line-height:18px;
cursor:default;
}
#instructionsimg1{
position:absolute;
z-index:240;
left:258px;
top:223px;
width:192px;
height:38.00px;
display:none;
}
#instructionstxt2{
position:absolute;
z-index:245;
left:64px;
top:192px;
width:228px;
height:24.00px;
text-align:left;
font-weight:600;
color:#ffff00;
display:none;
font-size:18px;
letter-spacing:-.5px;
line-height:24px;
cursor:default;
}
#instructionstxt3{
position:absolute;
z-index:246;
left:64px;
top:216px;
width:392px;
height:24.00px;
text-align:left;
font-weight:600;
color:#ffff00;
display:none;
font-size:18px;
letter-spacing:-.5px;
line-height:24px;
cursor:default;
}
#instructionstxt7{
position:absolute;
z-index:246;
left:64px;
top:240px;
width:276px;
height:24.00px;
text-align:left;
font-weight:600;
color:#ffff00;
display:none;
font-size:18px;
letter-spacing:-.5px;
line-height:24px;
cursor:default;
}
#instr1{
position:absolute;
z-index:300;
left:0px;
top:262px;
width:640px;
height:104.00px;
}
#questioncounter{
position:absolute;
z-index:350;
left:110px;
top:10px;
width:92px;
height:22.00px;
color:#000000;
font-weight:700;
text-align:center;
cursor:pointer;

display:none;
font-size:22px;
line-height:22px;
cursor:default;
}
#questioncountertit{float:left;}
#questioncountertxt{float:right;}
#againbut{
position:absolute;
z-index:400;
left:140px;
top:314px;
width:120px;
height:34.00px;
color:#ffff00;
font-weight:700;
text-align:center;
cursor:pointer;

display:none;
background:radial-gradient(ellipse at center, #ff0000 0%, #660000 77%,#000000 100%);
border-radius:5px;
font-size:18px;
line-height:30px;
}
#againbut:hover{
color:#ff9900}
#againbut:active{
color:#ff9900}
#quitbut1{
position:absolute;
z-index:400;
left:380px;
top:314px;
width:120px;
height:34.00px;
color:#ffff00;
font-weight:700;
text-align:center;
cursor:pointer;

display:none;
background:radial-gradient(ellipse at center, #ff0000 0%, #660000 77%,#000000 100%);
border-radius:5px;
font-size:18px;
line-height:30px;
}
#quitbut1:hover{
color:#ff9900}
#quitbut1:active{
color:#ff9900}
#end3txt{
position:absolute;
z-index:410;
left:197px;
top:177px;
width:242px;
height:54.00px;
color:#660000;
font-weight:700;
text-align:center;
display:none;
font-family:'Comic Neue';
font-size:54px;
line-height:54px;
cursor:default;
}
#quittxt1{
position:absolute;
z-index:410;
left:132px;
top:169px;
width:376px;
height:110.00px;
color:#006600;
font-weight:700;
text-align:center;
margin:0 auto;
display:none;
font-family:'Comic Neue';
font-size:48px;
line-height:48px;
cursor:default;
}
#correcttxt1{
position:absolute;
z-index:410;
left:126px;
top:260px;
width:150px;
height:70.00px;
color:#ffff00;
font-weight:700;
text-align:center;
margin:0 auto;
display:none;
font-family:'Comic Neue';
font-size:60px;
line-height:60px;
cursor:default;
}
#completetxt2{
position:absolute;
z-index:415;
left:150px;
top:233px;
width:332px;
height:26.00px;
color:#007d00;
font-weight:700;
text-align:center;
margin:0 auto;
display:none;
font-family:'Comic Neue';
font-size:26px;
line-height:26px;
cursor:default;
}
#completetxt1{
position:absolute;
z-index:415;
left:210px;
top:267px;
width:212px;
height:26.00px;
color:#007d00;
font-weight:700;
text-align:center;
margin:0 auto;
display:none;
font-family:'Comic Neue';
font-size:26px;
line-height:26px;
cursor:default;
}
#answerbuts{
position:absolute;
z-index:500;
left:0px;
top:372px;
width:640px;
height:48.00px;
text-align:center;

display:none;
}
#answerbut0{
position:absolute;
z-index:110;
left:32px;
top:2px;
width:156px;
height:50.00px;
text-align:center;cursor:pointer;
font-size:20px;
line-height:32px;
}
#answerbut1{
position:absolute;
z-index:110;
left:246px;
top:16px;
width:156px;
height:50.00px;
text-align:center;cursor:pointer;
font-size:20px;
line-height:32px;
}
#answerbut2{
position:absolute;
z-index:110;
left:454px;
top:10px;
width:156px;
height:50.00px;
text-align:center;cursor:pointer;
font-size:20px;
line-height:32px;
}
#incorrecttxt1{
position:absolute;
z-index:550;
left:126px;
top:376px;
width:50px;
height:60.00px;
color:#006600;
font-weight:700;
text-align:center;
margin:0 auto;
display:none;
font-family:'Comic Neue';
font-size:60px;
line-height:60px;
cursor:default;
}
#audiotrigger{
position:absolute;
z-index:51;
left:286px;
top:178px;
width:99px;
height:36.00px;
text-align:center;
cursor:pointer;

display:none;
font-size:24px;
line-height:30px;
}
#imgx1{position:absolute;z-index:452;left:16px;top:260px;width:186px;height:276.00px;display:none;}
#imgx1_bg{position:absolute;z-index:1;left:0px;top:0px;}
#imgx1_1{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_2{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_3{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_4{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_5{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_6{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_7{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_8{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_9{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_10{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx1_but{position:absolute;z-index:551;left:68px;top:176px;width:52px;height:22px;border-radius:5px;text-align:center;font-weight:600;cursor:pointer;display:none;color:#ffff00;background:radial-gradient(ellipse at center, #ff0000 0%, #660000 77%,#000000 100%)}
#imgx1_but:hover{color:#00cc00;}
#imgx2{position:absolute;z-index:453;left:230px;top:274px;width:186px;height:276.00px;display:none;}
#imgx2_bg{position:absolute;z-index:1;left:0px;top:0px;}
#imgx2_1{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_2{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_3{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_4{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_5{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_6{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_7{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_8{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_9{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_10{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx2_but{position:absolute;z-index:551;left:68px;top:176px;width:52px;height:22px;border-radius:5px;text-align:center;font-weight:600;cursor:pointer;display:none;color:#ffff00;background:radial-gradient(ellipse at center, #ff0000 0%, #660000 77%,#000000 100%)}
#imgx2_but:hover{color:#00cc00;}
#imgx3{position:absolute;z-index:454;left:437px;top:268px;width:186px;height:276.00px;display:none;}
#imgx3_bg{position:absolute;z-index:1;left:0px;top:0px;}
#imgx3_1{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_2{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_3{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_4{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_5{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_6{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_7{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_8{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_9{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_10{position:absolute;z-index:1;left:0px;top:0px;display:none;}
#imgx3_but{position:absolute;z-index:551;left:68px;top:176px;width:52px;height:22px;border-radius:5px;text-align:center;font-weight:600;cursor:pointer;display:none;color:#ffff00;background:radial-gradient(ellipse at center, #ff0000 0%, #660000 77%,#000000 100%)}
#imgx3_but:hover{color:#00cc00;}

.fly{
position:absolute;
width:20px;
height:25px;
}
.notebut{
cursor:pointer !important;
outline:none;
-webkit-tap-highlight-color:transparent;
}
.butkw{
width:30px;
height:115px;
}
.butkb{
width:22px;
height:70px;
}
#keyholder{
position:relative;
z-index:2;
left:0px;
top:0px;
}

.notebut img{
position:absolute;
}
.notebut img.notehint{
display:none !important;
}
.notebut.hint img.notehint{
display:block !important;
}
.notebut img:nth-child(1){
display:block !important;
}
.notebut.hover img:nth-child(1),
.notebut.click img:nth-child(1){
display:block !important;
}
.notebut.hover img:nth-child(2),
.notebut.click img:nth-child(2){
display:none !important;
}
.notebut.hover:hover img:nth-child(1),
.notebut.click:active img:nth-child(1){
display:none !important;
}
.notebut.hover:hover img:nth-child(2),
.notebut.click:active img:nth-child(2){
display:block !important;
}
.notebut.hoverclick img:nth-child(1){
display:block !important;
}
.notebut.hoverclick img:nth-child(2){
display:none !important;
}
.notebut.hoverclick img:nth-child(3){
display:none !important;
}
.notebut.hoverclick:hover img:nth-child(1){
display:none !important;
}
.notebut.hoverclick:hover img:nth-child(2){
display:block !important;
}
.notebut.hoverclick:hover img:nth-child(3){
display:none !important;
}
.notebut.hoverclick:active img:nth-child(1){
display:none !important;
}
.notebut.hoverclick:active img:nth-child(2){
display:none !important;
}
.notebut.hoverclick:active img:nth-child(3){
display:block !important;
}
.notebut.hoverclick.midiinput img:nth-child(1){
display:none !important;
}
.notebut.hoverclick.midiinput img:nth-child(2){
display:none !important;
}
.notebut.hoverclick.midiinput img:nth-child(3){
display:block !important;
}
#midistatus{
text-transform:capitalize;display:none;}
#fwbut{
position:absolute;
z-index:999;
width:40px;
height:40px;
left:0px;
top:440px;
background-color:rgba(255,255,255,0.5);
display:none;
}