/**
  * Author: Alonso Vidales <alonso.vidales@tras2.es>
  * Date: 2012-02-13
  */

html, body {
	background: #000000;
	margin: 0px;
	border: 0px;
	padding: 0px;
}

img {
	border: 0px;
	margin:0;
}

#main_canvas {
	width: 600px;
	height: 570px;
	background-image: url('../img/moonfull.jpg');
	font-family:Arial, Helvetica, sans-serif;
	margin: 0px;
	border: 0px;
	padding: 0px;
}

.button {
	cursor: pointer;
}

/**
  * Monster styles from here
  */
.monster {
	background-image: url('../img/enemies_96x64.png');
	background-repeat: no-repeat;
	position: absolute;
	width: 32px;
	height: 32px;
	z-index: 100;
}

.monster.killed {
	background-image: url('../img/invaderkilled.png') !important;
	background-position: 0px 0px !important;
}

.monster.fat {
	background-position: 0px 0px;
}

.monster.fat.animation {
	background-position: 0px -32px;
}

.monster.slim {
	background-position: -32px 0px;
}

.monster.slim.animation {
	background-position: -32px -32px;
}

.monster.squid {
	background-position: -64px 0px;
}

.monster.squid.animation {
	background-position: -64px -32px;
}

/**
  * MisteryShip styles from here
  */
.mistery_ship {
	background-image: url('../img/mistery_ship.png');
	background-repeat: no-repeat;
	position: absolute;
	width: 60px;
	height: 37px;
}

.mistery_ship_points {
	position: absolute;
	width: 60px;
	text-align: center;
	font-family: Arial;
	color: #ff0000;
	font-size: 18px;
}

/**
  * Ship styles from here
  */
.ship {
	background-image: url('../img/ship.png');
	background-repeat: no-repeat;
	position: absolute;
	width: 50px;
	height: 56px;
}

.ship.destroy {
	background-image: url('../img/explosion.png') !important;
}

/**
  * Bomb styles from here
  */
.bomb {
	position: absolute;
	width: 2px;
	height: 15px;
	background-color: #ebebeb;
}

/**
  * Missile styles from here
  */
.missile {
	position: absolute;
	width: 2px;
	height: 15px;
	background-color: #77f215;
}

/**
  * Other elements styles from here
  */
.bottom_line {
	position: absolute;
	background-color: #38710d;
	width: 595px;
	height: 1px;
	top: 518px;
	left: 10px;
}

.scoreboard {
	font-family: Arial;
	position: absolute;
	color: #ebebeb;
	font-size: 20px;
}

.instructions {
	border-color: #444;
	border-width: 1px;
	border-style: solid;
	border-radius: 5px;
	background: #020d30;
	height: 85px;
	width: 380px;
	margin: auto;
}

/**
  * Game over styles from here
  */
.game_over {
	position: relative;
	margin: 4px;
	color: #77f215;
	text-align: center;
}

.game_over.window {
	border-color: #1713c3;
	border-width: 4px;
	border-style: solid;
	border-radius: 20px;
	top: 60px;
	left: 90px;
	width: 400px;
	height: 390px;
	
	background: #000000; /* Old browsers */
	background: -moz-linear-gradient(top,  #000000 1%, #031b66 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#000000), color-stop(100%,#031b66)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #000000 1%,#031b66 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #000000 1%,#031b66 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #000000 1%,#031b66 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #000000 1%,#031b66 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#031b66',GradientType=0 ); /* IE6-9 */

}
#startlink {
	position:absolute;
	top: 480px;
	left: 350px;
	font-size:20px;
}

#embedcode {
	position:absolute;
	top: 490px;
	font-size:small;
	color:gray;
	line-height:80%;
}

.game_over.text {
	top: 20px;
	font-size: 40px;
}

.game_over.image {
	top: 40px;
	left: 155px;
	display: block;
	/*width: 90px;*/
}

.game_over.score {
	top: 70px;
	font-size: 20px;
}

a:link, a:visited {
	color: #fff;
	text-decoration:none;
}

.game_over.link_to_cv, game_over_window.link_to_cv:visited {
	top: 70px;
	text-decoration: none;
	font-size: 19px;
	color:#FFF;
}

.shield {
	background-image: url('../img/shield.png');
	background-repeat: no-repeat;
	position: absolute;
	width: 66px;
	height: 48px;
	z-index: 25;
}

.detroyed {
	position: absolute;
	background-image: url('../img/shield_destroyed_area.png');
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	z-index: 50;
}