@font-face
{
font-family: "cursivecasual";
src: url("fonts/cursive.ttf");
}

@font-face
{
font-family: "soup";
src: url("fonts/soup.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:550px;
padding:0px;
margin:0px;
overflow:hidden;
font-family:cursivecasual;
font-size:20px;
background:#212121;
}

#main_div
{
position:absolute;
top:0px;
left:0px;
width:800px;
height:550px;
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;
}

#game_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
display:none;
background:url(images/game_background.png);
}

.game_over_div
{
position:absolute;
top:0px;
left:0px;
width:100%;
height:100%;
background-image:url(images/game_over_1_background.png);
display:none;
color:#fff;
z-index:10;
}

#game_over_2_div
{
background-image:url(images/game_over_2_0_background.png);
}

#game_over_3_div
{
background-image:url(images/game_over_3_0_background.png);
}

#game_over_4_div
{
background-image:url(images/game_over_4_0_background.png);
}

#game_over_5_div
{
background-image:url(images/game_over_5_background.png);
}

#game_over_message_div
{
position:absolute;
top:78px;
left:72px;
width:570px;
font-size:22px;
text-align:center;
color:#fff;
}

.item_bought
{
position:absolute;
top:136px;
left:161px;
width:30px;
height:30px;
}

.draggable_item
{
position:absolute;
top:390px;
left:590px;
display:none;
}

.flip
{
transform:scale(-1,1);
}

#lounge_info
{
background:#95c023;
border-radius:30px;
position:absolute;
top:445px;
left:10px;
width:780px;
height:93px;
color:#fff;
}

#lounge_info_text
{
position:absolute;
top:1px;
left:20px;
width:740px;
font-size:24px;
text-align:center;
}

#lounge_info_teacher
{
position:absolute;
top:-55px;
}

.draggable
{
cursor:pointer;
}

.preload
{
width:1px;
height:1px;
opacity:0;
}

.sound_button
{
position:absolute;
bottom:4px;
left:4px;
width:81px;
height:81px;
background-image:url(images/sound_off.png);
cursor:pointer;
opacity:0;
}

#score_div
{
position:absolute;
top:22px;
left:695px;
width:100px;
text-align:center;
color:#ffff66;
font-size:33px;
}

#timer_div
{
position:absolute;
top:22px;
left:25px;
width:100px;
text-align:center;
font-size:33px;
color:#ffff66;
}

.button
{
position:absolute;
cursor:pointer;
background-image:url(images/blank.gif);
}

#sound_off_icon
{
position:absolute;
top:5px;
left:718px;
display:none;
cursor:pointer;
}

#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;
}

.card
{
border-radius:6px;
position:absolute;
top:0px;
left:0px;
width:135px;
height:190px;
color:#fff;
font-size:51px;
cursor:pointer;
}

#card_0
{
border:3px solid #2ba8a8;
background:#33cccc;
top:150px;
left:50px;
}

#card_1
{
border:3px solid #a22828;
background:#cc3333;
top:230px;
left:220px;
}

#card_2
{
border:3px solid #ff7b7b;
background:#ff9999;
top:150px;
left:400px;
}

#card_3
{
border:3px solid #d2a800;
background:#ffcc00;
top:230px;
left:580px;
}

#cards_div
{
position:absolute;
top:0px;
left:0px;
}

.underline
{
width:109px;
height:10px;
border-radius:10px;
background:#fff;
}

.zoom
{
transform: scale(1.2);
transition: transform 500ms ease-in-out;
}

.unzoom
{
transform: scale(1);
transition: transform 500ms ease-in-out;
}

.result_pic
{
position:absolute;
top:-67px;
left:40px;
display:none;
}

.correct_div
{
position:absolute;
top:200px;
left:0px;
color:#79aeb6;
width:140px;
text-align:center;
font-size:17px;
display:none;
}

.numpad
{
border:1px solid #000;
border-radius:3px;
font-size:35px;
width:54px;
height:40px;
text-align:center;
font-weight:bold;
text-shadow:2px 2px #aaa;
color:#000;
background:#fff;
}