/*------------------ FOR ALL STYLING OF ASSETS IN SPECIFIC INSTANCES/GAMES ------------------*/


/* Bug Operation */
.bug {
	position:absolute;
	z-index:10;
	cursor:url("../img/tweezer.png"), auto;
}

.bug-highlight {
	border-radius:500px;
	border:5px solid red;
}

@-webkit-keyframes bug-animation {
	0% { -webkit-transform: rotate(0deg); }
    50% { -webkit-transform: rotate(45deg);opacity:0.6; }
    100% { -webkit-transform: rotate(0deg); }
}

.bug-animation {
	-webkit-animation: bug-animation 1s infinite;
	-moz-animation: bug-animation 1s infinite;
	-o-animation: bug-animation 1s infinite;
	animation: bug-animation 1s infinite;
}

.dish {
	position:absolute;
	z-index:-1;
	left:250px;
	bottom:-75px;
}

/* Parasite Operation */
div.parasite {
	position:absolute;
	z-index:9;
	top:350px;
	left:450px;
	cursor:url("../img/scalpel.png"), auto;
}


/* Lung Operation */

.lung_tumor#stage_1 {
	z-index:9;
	cursor:url("../img/scalpel.png"), auto;
	display:none;
}

.lung_tumor#stage_2 {
	z-index:8;
	cursor:url("../img/scalpel.png"), auto;
	display:none;
}

.lung_tumor#stage_3 {
	z-index:7;
	cursor:url("../img/ointment.png"), auto;
	display:none;
}

.lung_tumor#stage_4 {
	z-index:6;
	cursor:url("../img/ointment.png"), auto;
	display:none;
	
}

.lung_tumor {
	position:absolute;
	display:none;
}

/* X-ray Operation */

.xray-container {
	width:600px;
	height:400px;
	position:relative;
	top:100px;
	left:200px;
}

.bone-box {
	margin:-1px;
	border:1px solid white;
	position:absolute;
	width:200px;
	height:100px;
}

.moving-bone {
	cursor:url("../img/tweezer.png"), auto;
}

.bone-box#box-one {
	top:0px;
	left:0px;
}

.bone-box#box-two {
	top:0px;
	left:200px;
}

.bone-box#box-three {
	top:0px;
	left:400px;
}

.bone-box#box-four {
	top:100px;
	left:0px;
}

.bone-box#box-five {
	top:100px;
	left:200px;
}

.bone-box#box-six {
	top:100px;
	left:400px;
}

.bone-box#box-seven {
	top:200px;
	left:0px;
}

.bone-box#box-eight {
	top:200px;
	left:200px;
}

.bone-box#box-nine {
	top:200px;
	left:400px;
}

.bone-box#box-ten {
	top:300px;
	left:0px;
}

.bone-box#box-eleven {
	top:300px;
	left:200px;
}

.bone-box#box-twelve {
	top:300px;
	left:400px;
}


.moving-bone {
  width: 100px;
  height: 100px;
  min-width: 50px;
  min-height: 50px;
  position: absolute;
}

.xray-reveal {
	z-index:1;
	position:absolute;
	display:none;
	top:20%;
	left:20%;
}

.xray-bg {
	z-index:0;
	position:absolute;
	display:none;
}


/*-- Spine Operation--*/
.spine-container {
	width:600px;
	height:180px;
	position:relative;
	top:200px;
	left:180px;
	border-radius:50px;
}

.spine-bone-container {
	width:97px;
	height:250px;
	position:absolute;
	top:160px;
	left:800px;
}

.spine-box {
	margin:-1px;
	border:1px solid white;
	position:absolute;
	width:100px;
	height:180px;
}

.spine {
	display:inline-block;
}

.spine-box#box-one {
	left:0px;
}

.spine-box#box-two {
	left:100px;
}

.spine-box#box-three {
	left:200px;
}

.spine-box#box-four {
	left:300px;
}

.spine-box#box-five {
	left:400px;
}

.spine-box#box-six {
	left:500px;
}


#alien {
	z-index:0;
	position:absolute;
}

#alien-cover {
	z-index:1;
	position:absolute;
}


/*-- Emergency Choice  --*/
.emergency-choice {
	width:200px;
	height:140px;
	position:absolute;
	top:240px;
	border-radius:12px;
	z-index:0;
	background-color:rgba(0,0,0,0.1);
	display:none;
	cursor:pointer;
	border:3px solid transparent;
}



.emergency-choice h1 {
	font-family:'Roboto';
	font-weight:300;
	text-align:center;
}

.emergency-choice-highlight, .emergency-choice h1:hover {
	border:2px solid white;
	background-color:rgba(0,0,0,0.5);
	-webkit-transition:0.2s all ease;
	-moz-transition:0.2s all ease;
	-o-transition:0.2s all ease;
	transition:0.2s all ease;
	z-index:-99;
	border-radius:5px;
}

#emergency-choice-1 {
	left:50px;
}	

#emergency-choice-2 {
	left:400px;
}

#emergency-choice-3 {
	left:750px;
}	



#code {
	position:absolute; 
	width: 300px;
	padding:10px;
	font-family:'Roboto'; 
	font-size:12px;
	font-weight:300;
	height: 27px; 
	background-color:rgba(0,0,0,0.8);
	font-size:20px; 
	color:white;
	top:50px;
	left:360px;
	text-align:center;
	display:none;
}

#code-submit {
	position:absolute; 
	width: 320px;
	padding:10px;
	font-family:'Roboto'; 
	font-size:12px;
	font-weight:400;
	background-color:rgba(0,0,0,0.8);
	font-size:20px; 
	left: 361px;
	color:white;
	top:97px;
	text-decoration:none;
	outline:0;
	border:0;
	display:none;	
	cursor:pointer;
}

#code-submit:hover{
	border:2px solid white;
}


/*-- Gate operation --*/
#gatebox {
	margin: 0px auto;
	width: 640px;
	position:absolute;
	top:150px;
	left:200px;
}
#gatecard {
	z-index: 1;
	margin: 10px 0 0;
}
#gatecard div{
	float: left;
	width: 100px;
	height: 100px;
	margin: 5px;
	padding: 5px;
	cursor: pointer;
	border: 1px solid rgba(39,245,176,0.8);
	-moz-box-shadow: 0 0 10px #A9F5F2;
	-webkit-box-shadow: 0 0 10px #A9F5F2;
	box-shadow: 0px 0px 10px #A9F5F2;
	background-color:rgba(0,0,0,0.5);
	z-index: 2;
}
#gatecard div img {
	display: none;
	border-radius: 10px;
	z-index: 3;
}

/*-- flashback --*/
.flashback{
	position:absolute;
	display:none;
}

#flashbackbg{
	position:absolute;
	z-index:0;
}

.flashback#artist{
	z-index:3;
}

.flashback#screen{
	z-index:2;
}

.flashback#doodle{
	z-index:1;
}

/* flashback monster --*/
.flashback#city{
	z-index:4;
}

.flashback#robot{
	z-index:3;
}

.flashback#monster{
	z-index:2;
}

#flashbackbg{
	z-index:1;
}



/*Earth Battle*/

#output {
	position: absolute;
	top: 10px;
	left: 10px;
	margin: 0;
}
#enemy {
	position: absolute;
	top: 10px;
	left: 10px;
}
#dragonsprite {
			background: transparent url(img/dragon-sprite-final.png) 0 0 repeat-x;
			position: absolute;
			top: 150px;
			left: 6px;
			width: 180px;
			height: 111px;
			z-index: 0;
			cursor: pointer;
		}

/* ending scene*/
.white{
	background-color:#ffffff;
	position:absolute;
	top:0px;
	left:0px;
	width:1000px;
	height:600px;
	z-index:-9999;
}

.black{
	background-color:#000000;
	position:absolute;
	top:0px;
	left:0px;
	width:1000px;
	height:600px;
	z-index:-9999;
}