@media (orientation: portrait)
{ /* tablet and smaller */
#overlay
	{
	position: relative;
	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:600px;
height:420px;
padding:0px;
margin:0px;
overflow:hidden;

color:#fff;
background:#212121;
} */
body {
	font-family: samim;
	margin: 0 auto;
    background-image: url("../bg.jpg");
    background-size: cover;
    background-repeat: no-repeat;
   }
#main_div
{
position:absolute;
/* top:0px;
left:0px; */
width:600px;
height:420px;
overflow:hidden;
/* padding:0;*/
margin:0 auto; 
}

#game_div
{
position:absolute;
top:0px;
left:0px;
margin:0 auto;
width:100%;
height:100%;
font-family: samim;
background-image:url(images/game_background.png);
/* transition: transform 1000ms linear; */
display:none;
}

#frontpage_div
{
position:absolute;
top:-40px;
left:146px;
width:368px;
cursor:pointer;
display:none;
}

#game_over_popup
{
position:absolute;
top:92px;
left:106px;
width:384px;
height:231px;
background-image:url(images/game_over_popup_lose.png);
display:none;
}

#cert_div
{
display:none;
}

#cert_message
{
	color:#ffd066;
font-family: samim;
position:absolute;
top:112px;
left:0px;
width:400px;
text-align:center;
}

.sound_button
{
position:absolute;
top:392px;
left:508px;
width:25px;
height:25px;
background-image:url(images/sound_off.png);
cursor:pointer;
opacity:0;
background-size:100% 100%;
}

#score_div
{
position:absolute;
top:391px;
left:182px;
width:300px;
font-size:25px;
color:#0f0;
text-align:center;
}

#question_div
{

position:absolute;
top:0px;
left:183px;
width:300px;
text-align:center;
color:#fff;
font-size:25px;
}

.room_number
{
background:#dda976;
width:20px;
font-weight:bold;
font-size:11px;
}

#elevator_div
{
position:absolute;
top:324px;
left:-62px;
width:36px;
height:36px;
margin-left:-6px;
margin-top:-5px;
background-image:url(images/elevator.png);
}

#elevator_outer
{
position:absolute;
top:0px;
left:0px;
}

#elevator_door_left
{
position:absolute;
top:7px;
left:6px;
width:13px;
height:27px;
}

#elevator_door_right
{
position:absolute;
top:7px;
right:6px;
width:12px;
height:27px;
}

#owl_left
{
position:absolute;
top:17px;
left:-4px;
height:22px;
}

#owl_right
{
position:absolute;
top:14px;
left:24px;
height:27px;
}

#owl_middle
{
position:absolute;
top:16px;
left:10px;
height:21px;
}

#steam_left
{
position:absolute;
top:9px;
left:6px;
width:8px;
animation:fade1 1s linear infinite;
}

#steam_right
{
position:absolute;
top:9px;
left:21px;
width:8px;
animation:fade2 1s linear infinite;
}

@keyframes fade1 {
  50% {
    opacity: 0;
  }
}

@keyframes fade2 {
  100% {
    opacity: 0;
  }
}

#owl_door
{
position:absolute;
top:7px;
left:18px;
width:0px;
height:36px;
overflow:hidden;
}

#speech_bubble
{
position:absolute;
top:0px;
left:-5px;
width:40px;
height:12px;
background-image:url(images/speech_bubble.png);
text-align:center;
background-size:100% 100%;
font-family: samim;
font-size:3px;
padding-top:4px;
color:#000;
font-weight:bold;
line-height:3px;

}

.room
{
position:absolute;
width:23px;
height:26px;
border:2px solid rgba(0,0,0,0);
cursor:pointer;
font-size:11px;
color:#000;
text-align:center;
padding-top:2px;
}

#rooms_div
{
position:absolute;
top:34px;
left:157px;
}

.button
{
position:absolute;
cursor:pointer;
background-image:url(images/blank.gif);
}

.preload
{
width:1px;
height:1px;
opacity:0;
}

#sound_button
{
position:absolute;
top:391px;
left:117px;
width:70px;
height:69px;
background-image:url(images/sound_button.png);
cursor:pointer;
}
