@font-face
{
font-family: "cursivecasual";
src: url("fonts/cursive.ttf");
}

@font-face
{
font-family: "onestroke";
src: url("fonts/onestroke.ttf");
}

@media (orientation: portrait)
{ /* tablet and smaller */
#overlay
	{
	position: absolute;
	z-index: 9999;
	width: 100%;
	height:100%;
	top: 0;
	bottom: 0;
	content: "";
	background: #212121 url(images/turndevice.png) 0 0 no-repeat;
	background-size: 100% auto;
	}
}

body
{
width:800px;
height:477px;
padding:0px;
margin:0px;
overflow:hidden;
font-family:cursivecasual;
font-size:20px;
color:#fff;
background:#212121;
}

#main_div
{
position:absolute;
top:0px;
left:0px;
width:800px;
height:477px;
overflow:hidden;
padding:0;
margin:0;
}

#frontpage_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url(images/frontpage_background.png);
display:none;
}

#info_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url(images/info_background.png);
display:none;
}

#code_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url(images/code_background.png);
display:none;
}

#next_level_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url(images/next_round_background.png);
display:none;
}

#next_level_pic
{
position:absolute;
top:120px;
left:310px;
width:200px;
}

#next_level_desc
{
position:absolute;
top:301px;
left:445px;
font-size:22px;
color:#43220c;
}

#next_level_code
{
position:absolute;
top:358px;
left:303px;
font-family:Arial;
font-size:24px;
color:#a20000;
}

#lives_div
{
position:absolute;
top:54px;
right:-145px;
width:0px;
height:3px;
background:#00f;
}

#game_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url(images/game_background.png);
display:none;
}

#game_over_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url(images/game_over_background.png);
display:none;
color:#f15a24;
z-index:10;
font-size:40px;
}

.sound_button
{
position:absolute;
bottom:4px;
left:4px;
width:81px;
height:81px;
background-image:url(images/sound_off.png);
background-size:100% 100%;
cursor:pointer;
opacity:0;
}

#menu_popup
{
position:absolute;
top:127px;
left:259px;
width:300px;
height:165px;
background-image:url(images/menu_popup.png);
display:none;
z-index:1000;
}

#improve_popup
{
position:absolute;
top:127px;
left:259px;
width:300px;
height:143px;
background-image:url(images/improve_popup.png);
display:none;
z-index:1000;
}

#timer_div
{
position:absolute;
top:8px;
left:76px;
color:#fff;
font-size:28px;
}

#score_div
{
position:absolute;
top:9px;
left:758px;
color:#fff;
font-size:28px;
}

#question_div
{
position:absolute;
top:9px;
left:140px;
width:540px;
text-align:center;
color:yellow;
font-size:34px;
-webkit-text-stroke:1px #f00;
}

.button
{
position:absolute;
cursor:pointer;
background-image:url(images/blank.gif);
}

#greyout
{
background-color: #fff;
filter:alpha(opacity=40);
opacity: 0.4;
-moz-opacity:0.4;
z-index: 0;
height: 100%;
width: 100%;
background-repeat:no-repeat;
background-position:center;
position:absolute;
top: 0px;
left: 0px;
display:none;
}

#game_header
{
position:absolute;
top:0px;
left:0px;
}

#result_div
{
position:absolute;
top:200px;
left:0px;
width:800px;
text-align:center;
font-size:40px;
color:#0f0;
-webkit-text-stroke:2px #f00;
z-index:100;
display:none;
}

.correct
{
color:yellow;
font-size:90px;
}

.incorrect
{
font-size:90px;
color:#f00;
-webkit-text-stroke:1px yellow;
}

#game_over_message_div
{
position:absolute;
top:161px;
left:92px;
text-align:center;
}

#pirate_1
{
position:absolute;
top:222px;
left:0px;
width:180px;
cursor:pointer;
}

#pirate_2
{
position:absolute;
top:190px;
left:147px;
width:180px;
cursor:pointer;
}

#pirate_3
{
position:absolute;
top:179px;
left:303px;
width:180px;
cursor:pointer;
}

#pirate_4
{
position:absolute;
top:180px;
left:465px;
width:180px;
cursor:pointer;
}

#pirate_5
{
position:absolute;
top:240px;
left:610px;
width:180px;
cursor:pointer;
}

#rock_1
{
position:absolute;
top:384px;
left:30px;
width:144px;
height:50px;
cursor:pointer;
text-align:center;
}

#rock_2
{
position:absolute;
top:360px;
left:188px;
width:144px;
height:53px;
cursor:pointer;
text-align:center;
}

#rock_3
{
position:absolute;
top:343px;
left:338px;
width:151px;
height:40px;
cursor:pointer;
text-align:center;
}

#rock_4
{
position:absolute;
top:356px;
left:499px;
width:127px;
height:50px;
cursor:pointer;
text-align:center;
}

#rock_5
{
position:absolute;
top:393px;
left:642px;
width:128px;
height:46px;
cursor:pointer;
text-align:center;
}

.rock
{
font-size:28px;
-webkit-text-stroke:1px yellow;
padding-top:8px;
color:#000;
}

.preload
{
width:1px;
height:1px;
opacity:0;
}

#code_input
{
position:absolute;
top:157px;
left:200px;
width:420px;
height:40px;
font-family:cursivecasual;
font-size:40px;
text-align:center;
background:#a57949;
border:none;
}

#code_wrong
{
position:absolute;
top:218px;
left:210px;
font-size:35px;
color:#f00;
display:none;
}