

/** 
 * @see http://www.html5hacks.com/blog/2012/11/28/elegantly-resize-your-page-with-the-at-viewport-css-declaration/
 */
@viewport {
    width: 980px;
    min-zoom: 1;
    max-zoom: 1;
	zoom: 100% !important;
    orientation: landscape;
}

@import url(//fonts.googleapis.com/css?family=Press+Start+2P);

html, body {
	zoom: 100% !important;
}

html,
p {
	/*    font-family: verdana, sans-serif;*/
	font-family: 'Press Start 2P', cursive;
	font-size: 9px;
	line-height: 170%;
	color: #eee;
	padding: 0;
	margin: 0;
	/*    background: url('../images/tile/green.png') repeat;*/

}
body {
	padding: 0;
	margin: 0;
	width: 100%;
	height: 100%;
	border: none;
	overflow: hidden;
	background-color: darkslategrey;
	/*cursor: url('../images/viewfinder64x64.png') 32 32, move;*/

	/*
	 * CSS rule to disable text selection highlighting
	 * http://stackoverflow.com/questions/16805684/javascript-disable-text-select
	 */

	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
/* tables
*/
table,
td,
th {
	margin: 0;
	padding: 0;
	border: 1px solid #fff;
	border-collapse: collapse;
}
th,
td {
	padding: 5px;
}
.track {
	font-family: Arial, Helvetica, sans-serif;
	color: #000000;
	padding: 2px 20px;
	background: -moz-linear-gradient(top, #adadad 0%, #f5f0f5);
	background: -webkit-gradient(linear, left top, left bottom, from(#adadad), to(#f5f0f5));
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: 1px solid #fff;
	-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5), inset 0px 0px 1px rgba(255, 255, 255, 0.7);
	-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5), inset 0px 0px 1px rgba(255, 255, 255, 0.7);
	box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5), inset 0px 0px 1px rgba(255, 255, 255, 0.7);
	text-shadow: 0px -1px 0px rgba(255, 255, 255, 0.4), 0px 1px 0px rgba(115, 115, 115, 0.3);
	z-index: 99999999;
}
.monospace {
	font-family: monospace;
}
h1 {
	font-family: monospace;
	font-size: 20px;
	position: absolute;
	top: 100px;
	left: 900px;
	z-index: 999999999999;
	display: none;
}
#showAnimationQueue {
	position: absolute;
	bottom: 20px;
	right: 410px;
}
#path {
	position: absolute;
	bottom: 20px;
	right: 10px;
}
#path2 {
	position: absolute;
	bottom: 20px;
	right: 10px;
}
#from {
	position: absolute;
	top: 20px;
	right: 10px;
}
#to {
	position: absolute;
	top: 60px;
	right: 10px;
}
/*************************************/.dim {
	width: 78px;
	height: 78px;
	position: relative;
	float: left;
	/*	border-top: 1px dotted black;
	  border-right: 1px dotted black;
	  border-left: 1px dotted transparent;
	  border-bottom: 1px dotted transparent;*/

	border: 1px solid transparent;
	z-index: 0;
}
.grass {
	background-color: transparent;
	/*	background: #3C4536 url('../images/tile/grass.png') repeat;*/

}
.house {
	background: url('../images/tile/house3.png') repeat;
	z-index: 999999 !important;
}
.house2 {
	background: url('../images/tile/house4.png') repeat;
	z-index: 999999 !important;
}
/* Bï¿½ume
*/
.treeOne {
	/* 1 baum mitte */

	background-image: url('../images/tile/tree4.png');
	background-position: center center;
	background-repeat: no-repeat;
	z-index: 999999 !important;
}
.trees {
	background-image: url('../images/tile/tree4.png'), url('../images/tile/tree4.png');
	background-position: left top, -40px -40px;
	background-repeat: repeat;
	z-index: 999999 !important;
}
.tree1 {
	/* baum mitte, 2 reste unten links rechts */

	background-image: url('../images/tile/tree4.png'), url('../images/tile/tree4.png'), url('../images/tile/tree4.png');
	background-position: left top, 40px 40px, -40px 40px;
	background-repeat: no-repeat;
	z-index: 999999 !important;
}
.treeUL {
	/* baum rest unten links */

	background-image: url('../images/tile/tree4.png');
	background-position: -40px 40px;
	background-repeat: no-repeat;
	z-index: 999999 !important;
}
.treeULOL {
	/* baum rest unten links + oben links */

	background-image: url('../images/tile/tree4.png'), url('../images/tile/tree4.png');
	background-position: -40px -40px, -40px 40px;
	background-repeat: no-repeat;
	z-index: 999999 !important;
}
.treeORUR {
	/* baum rest unten rechts + oben rechts */

	background-image: url('../images/tile/tree4.png'), url('../images/tile/tree4.png');
	background-position: 40px 40px, 0px -40px;
	background-repeat: no-repeat;
	z-index: 999999 !important;
}
/*sadsaas
*/
.tree11 {
	/* baum rest unten links + oben links +/ 
			  /*background-image: url('../images/tile/tree4.png'), url('../images/tile/tree4.png'), url('../images/tile/tree4.png'), url('../images/tile/tree4.png'), url('../images/tile/tree4.png');
			  background-position: center center, -5px 10px, -2px 40px, 40px 10px, 40px 40px; */

	background-image: url('../images/tile/tree4.png'), url('../images/tile/tree4.png');
	background-position: 25px center, 0px 5px;
	background-size: 75%, 50%;
	background-repeat: no-repeat;
	z-index: 999999 !important;
}
.powerupFuel {
	/*background: url('../stupid-tiles/deactivated/std-fuel.png') center center no-repeat;*/

	background: url('../images/warpbutton/F.gif') center center no-repeat;
	z-index: 0 !important;
}
.powerupAmmo {
	/*background: url('../stupid-tiles/deactivated/std-ammo.png') center center no-repeat;*/

	background: url('../images/warpbutton/A.gif') center center no-repeat;
	z-index: 0 !important;
}
.flak {
	background: url('../images/tile/Uniticon-aa_flak_gun.png') center center no-repeat;
	z-index: 999999 !important;
}
.boxes {
	background: url('../images/tile/stones.png') repeat;
	z-index: 999999 !important;
}
.road1 {
	background: url('../images/tile/road1.png') center center no-repeat;
	z-index: 0 !important;
}
/*.tree2 {
	width: 601px;
	height: 680px;
	background: url('../images/tile/tree4.png') no-repeat;
	z-index: 999999 !important;
}*/
.titan {
	background: url('../images/titan/W.png') center center no-repeat;
	/*	border: 1px dotted red;*/

	z-index: 10;
	float: left;
}
.titan span {
	white-space: nowrap;
}
#titan {
	position: absolute;
	top: 0px;
	left: 0px;
}
.titan span {
	padding-left: 21px;
	position: absolute;
	top: 0px;
	left: 0px;
	width: auto;
	font-family: monospace;
	letter-spacing: -0.1em;
	font-size: 11px;
	z-index: 999999999999 !important;
}
#arrow {
	background: url('../images/titan/TitaTNSD_9.png') center center no-repeat;
	position: absolute;
	top: 5px;
	left: 8px;
	width: 64px;
	height: 64px;
	z-index: 9999999999999 !important;
}
#titan2 {
	position: absolute;
	top: 400px;
	left: 1240px;
}
#titan3 {
	position: absolute;
	top: 160px;
	left: 160px;
}
.bullet {
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: #9acd32;
	/*border: 1px solid @bulletBGColor;*/
	z-index: 9 !important;
	width: 10px;
	height: 2px;
	display: none;
	/*border: 1px solid red;*/

}
.bullet > .blast2 {
	position: absolute;
	top: -9px;
	left: -40px;
	-webkit-animation: pulsate 0.05s linear;
	-webkit-animation-iteration-count: infinite;
	/*border: 1px solid blue;*/

}
.rocket {
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: #9acd32;
	z-index: 9999999 !important;
	width: 20px;
	height: 2px;
	display: none;
}
.rocket > .blast2 {
	position: absolute;
	top: -9px;
	left: -40px;
	-webkit-animation: pulsate 0.05s linear;
	-webkit-animation-iteration-count: infinite;
}
.bullethole {
	position: absolute;
	background: url('../images/tile/bullethole.png') center center no-repeat;
	width: 30px;
	height: 30px;
	z-index: 0;
	display: none;
}
.explosion,
.circle {
	position: absolute;
	top: -30px;
	left: -10px;
	background: url('../images/explosion.gif') no-repeat;
	z-index: 999999999999 !important;
}
.explosion2 {
	/* Treffer */

	position: absolute;
	/*	background: url('../images/feuer.gif') no-repeat;
	  width: 78px;
	  height: 121px;*/

	background: url('../images/feuer2.gif') -25 -15 no-repeat;
	width: 149px;
	height: 108px;
	z-index: 999999999999 !important;
	display: none;
}
.smoke {
	position: absolute;
	top: -15px;
	left: -35px;
	background: url('../images/smoke.gif') center center no-repeat;
	z-index: 999999999999 !important;
	width: 44px;
	height: 38px;
	/*	display: none;*/

}
.hypersplash {
	position: absolute;
	background: url('../images/feuer.gif') no-repeat;
	z-index: 999999999999 !important;
	width: 78px;
	height: 121px;
	display: none;
}
.shadow {
	/*	-moz-box-shadow: 1px 1px 5px #000;
	  -webkit-box-shadow: 1px 1px 5px #000;*/

	box-shadow: 0px 0px 8px #000;
}
.flagBlue {
	position: absolute;
	background: url('../images/flagblue.png') no-repeat;
	width: 37px;
	height: 46px;
	z-index: 1;
	display: none;
}
.flagGreen {
	position: absolute;
	background: url('../images/flaggreen.png') no-repeat;
	width: 37px;
	height: 46px;
	z-index: 1;
	display: none;
}
.breadcrumb {
	position: absolute;
	margin: 15px 0 0 15px;
	font-size: 10px;
	font-family: monospace;
	background-color: #707070;
	width: 50px;
	height: 50px;
	border: 1px solid white;
	border-radius: 50%;
	z-index: 0;
}
/* animations
*/
@-moz-keyframes cloud1 {
	/*                            x     y									*/
	0% {
		background-position: 0px -100px, 300px -100px, 600px -150px;
	}
	100% {
		background-position: 2000px 1000px,	2000px 600px,	1000px 600px;
	}
}
@-webkit-keyframes cloud1 {
	/*                            x     y									*/
	0% {
		background-position: 0px -100px, 300px -100px, 600px -150px;
	}
	100% {
		background-position: 2000px 1000px,	2000px 600px,	1000px 600px;
	}
}
@-moz-keyframes cloud2 {
	/*                            x     y		*/
	0% {
		background-position: -300px -300px;
	}
	100% {
		background-position: 2000px 1000px;
	}
}
@-webkit-keyframes cloud2 {
	/*                            x     y		*/
	0% {
		background-position: -300px -300px;
	}
	100% {
		background-position: 2000px 1000px;
	}
}
@-moz-keyframes cloud3 {
	/*                            x     y		*/
	0% {
		background-position: 300px -300px;
	}
	100% {
		background-position: 2000px 1000px;
	}
}
@-webkit-keyframes cloud3 {
	/*                            x     y		*/
	0% {
		background-position: 300px -300px;
	}
	100% {
		background-position: 2000px 1000px;
	}
}
.cloud {
	border: 1px solid red;
	position: absolute;
	top: 0px;
	overflow: hidden;
	width: 100%;
	/* box */

	/*	width: 100%;
	  height: 1860px;*/

	display: block;
	/* anim */

	background-color: transparent;
	background-repeat: no-repeat, no-repeat, no-repeat;
	z-index: 999999 !important;
}
#cloud1 {
	background-image: url('../images/clouds_0.png'), url('../images/clouds_5.png'), url('../images/clouds_9.png');
	/*	-moz-animation: cloud1 30s linear infinite;
	  -webkit-animation: cloud1 30s linear infinite;
	  animation: cloud1 30s linear infinite;*/

}
#cloud2 {
	background-image: url('../images/clouds_5.png');
	/*	-moz-animation: cloud2 40s linear infinite;
	  -webkit-animation: cloud2 40s linear infinite;
	  animation: cloud2 40s linear infinite;*/

}
#cloud3 {
	width: 300px;
	height: 300px;
	background-image: url('../images/clouds_9.png');
	/*	-moz-animation: cloud3 40s linear infinite;
	  -webkit-animation: cloud3 40s linear infinite;
	  animation: cloud3 40s linear infinite;*/

}
/*---------------------
*/
.border-1px.dotted-red {
	border: 1px dotted red;
}
.tank {
	position: absolute;
	left: 400px;
	top: 200px;
	width: 80px;
	height: 80px;
	/*                cursor:pointer;*/

	display: block;
}
.flag img {
	margin-right: 5px;
}
.flag {
	position: absolute;
	top: -15px;
	width: 255px;
	height: 14px;
	overflow: hidden;
	z-index: 30;
}
.tankSkeleton {
	/*						border-right: 5px solid purple;*/

	width: 50px;
	height: 31px;
	position: absolute;
	top: 25px;
	left: 16px;
	background: transparent url('../images/W2.png') center center no-repeat;
	font-size: 20px;
	color: olive;
	z-index: 12;
}
.tankSkeleton span {
	/* taktisches Zeichen */

/*	position: relative;
	top: 6px;
	left: 3px;*/
	/*font-size: 12px !important;*/
	
	position: absolute;
	border-radius: 50%;
	background-color: #eee8aa;
	opacity: 0.3;
	display: none;
	background: -moz-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(249, 255, 147, 0.65)), color-stop(77%, rgba(0, 0, 0, 0)));
	background: -webkit-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: -o-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: -ms-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: linear-gradient(to right, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6f9ff93', endColorstr='#00000000', GradientType=1);	
}
.tankLights {
	position: absolute;
	border-radius: 50%;
	background-color: #eee8aa;
	opacity: 0.3;
	display: none;
	background: -moz-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(249, 255, 147, 0.65)), color-stop(77%, rgba(0, 0, 0, 0)));
	background: -webkit-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: -o-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: -ms-linear-gradient(left, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	background: linear-gradient(to right, rgba(249, 255, 147, 0.65) 0%, rgba(0, 0, 0, 0) 77%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#a6f9ff93', endColorstr='#00000000', GradientType=1);
}
.tankLights1 {
	width: 180px;
	height: 44px;
	top: 14px;
	left: 65px;
	-webkit-transform: rotate(5deg);
}
.tankLights2 {
	width: 180px;
	height: 44px;
	top: -30px;
	left: 65px;
	-webkit-transform: rotate(-5deg);
}
.turret {
	position: absolute;
	top: 25px;
	left: 11px;
	background: transparent url('../images/turret2.png') center center no-repeat;
	width: 59px;
	height: 31px;
	z-index: 11;
	/* 99999999 */

	/*border: 1px solid red;*/

}
.blast {
	width: 40px;
	height: 20px;
	position: relative;
	top: 4px;
	left: 65px;
	border-radius: 50%;
	opacity: 0.5;
	background: -moz-linear-gradient(left, #f4f4f4 0%, rgba(125, 185, 232, 0) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%, #f4f4f4), color-stop(100%, rgba(125, 185, 232, 0)));
	background: -webkit-linear-gradient(left, #f4f4f4 0%, rgba(125, 185, 232, 0) 100%);
	background: -o-linear-gradient(left, #f4f4f4 0%, rgba(125, 185, 232, 0) 100%);
	background: -ms-linear-gradient(left, #f4f4f4 0%, rgba(125, 185, 232, 0) 100%);
	background: linear-gradient(to right, #f4f4f4 0%, rgba(125, 185, 232, 0) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f4f4f4', endColorstr='#007db9e8', GradientType=1);
}
.blast2 {
	width: 40px;
	height: 20px;
	position: relative;
	top: 4px;
	left: 65px;
	border-radius: 50%;
	opacity: 0.5;
	/*					background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(244,244,244,1)), color-stop(100%,rgba(125,185,232,0)));
					  background: -webkit-linear-gradient(left,  rgba(244,244,244,1) 0%,rgba(125,185,232,0) 100%);*/

	background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(125, 185, 232, 0)), color-stop(100%, #f4f4f4));
	background: -webkit-linear-gradient(left, rgba(125, 185, 232, 0) 0%, #f4f4f4 100%);
	/*					background: -moz-linear-gradient(left,  rgba(244,244,244,1) 0%, rgba(125,185,232,0) 100%);
					  background: -o-linear-gradient(left,  rgba(244,244,244,1) 0%,rgba(125,185,232,0) 100%);
					  background: -ms-linear-gradient(left,  rgba(244,244,244,1) 0%,rgba(125,185,232,0) 100%);
					  background: linear-gradient(to right,  rgba(244,244,244,1) 0%,rgba(125,185,232,0) 100%);
					  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4', endColorstr='#007db9e8',GradientType=1 );*/

}
.shieldInfo {
	position: absolute;
	bottom: 0px;
	left: 10px;
	width: 60px;
	height: 5px;
	border: 1px solid #356635;
}
.shieldInfo div {
	width: 100%;
	height: 5px;
	background-color: #356635;
	color: white;
}
.fuelInfo {
	position: absolute;
	bottom: -12px;
	left: 10px;
	width: 60px;
	height: 5px;
	border: 1px solid #191970;
}
.fuelInfo div {
	width: 100%;
	height: 5px;
	background-color: #191970;
	/* #500  #203c31 */

	color: white;
}
.ammoInfo {
	position: absolute;
	bottom: -24px;
	left: 10px;
	width: 60px;
	height: 5px;
	border: 1px solid #441122;
}
.ammoInfo div {
	width: 100%;
	height: 5px;
	background-color: #441122;
	color: white;
}
.tankselection {
	width: 80px;
	height: 80px;
	border: 1px dotted yellowgreen;
	border-radius: 50%;
	background: url('../images/loadingCircle.gif') no-repeat;
	background: url('../images/495.GIF') 0px 0px no-repeat;
	/*background: url('../images/RadarGreen.gif') no-repeat;*/

	/*background: url('../images/Action_80px.gif') 0px 0px no-repeat;*/

	/*background-size: 25%;*/

	/*						z-index: 0;*/

}
.smoke {
	position: relative;
	top: 0px;
	left: 0px;
	background: url('../images/smoke.gif') center center no-repeat;
	z-index: 999999999999 !important;
	width: 44px;
	height: 38px;
}
.bot {
	font-family: monospace;
	color: orange;
	/*					border: 1px dotted orange;
				  border-radius: 50%;*/

	-webkit-animation: pulsate 4s ease-out;
	-webkit-animation-iteration-count: infinite;
	-moz-animation: pulsate 4s ease-out;
	-moz-animation-iteration-count: infinite;
}
.spawnpoint {
	font-size: 9px;
	font-family: monospace !important;
	color: orange;
	border: 1px solid #606060;
	/* royalblue */

	border-radius: 50%;
	/*					opacity: 0;
				  -webkit-animation: comeAndGo 5s ease-out;
				  -webkit-animation-iteration-count: 1; 				
				  -moz-animation: comeAndGo 5s ease-out;
				  -moz-animation-iteration-count: 1;					*/

}
#dragWrapper {
	position: fixed;
	top: 0px;
	left: 0px;
	width: 1000px;
	height: 1000px;
}
#container {
	position: relative;
	outline: 1px solid #000;
	background: #2f4f4f url('../images/tile/green.png') repeat;
	box-shadow: 0px 0px 150px #000;
	cursor: url('../images/viewfinder64x64.png') 32 32, move;
}
.display-none {
	display: none;
}
.float-left {
	float: left;
}
button {
	padding: 10px;
}
#info,
#info2,
#info3 {
	overflow: auto;
	position: fixed;
	bottom: 20px;
	left: 20px;
	border: 1px solid white;
	background-color: #808000;
	width: auto;
	height: auto;
	z-index: 99999999999999;
	padding: 5px;
	display: none;
}
#info2 {
	left: 220px;
}
#info3 {
	left: 420px;
}
/* rotating
*/
@-webkit-keyframes rotating {
	0% {
		-webkit-transform: rotate(0deg);
	}
	100% {
		-webkit-transform: rotate(360deg);
	}
}
@-moz-keyframes rotating {
	0% {
		-moz-transform: rotate(0deg);
	}
	100% {
		-moz-transform: rotate(360deg);
	}
}
@-o-keyframes rotating {
	0% {
		-o-transform: rotate(0deg);
	}
	100% {
		-o-transform: rotate(360deg);
	}
}
@-ms-keyframes rotating {
	0% {
		-ms-transform: rotate(0deg);
	}
	100% {
		-ms-transform: rotate(360deg);
	}
}
@keyframes rotating {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}
.rotating {
	-webkit-animation: rotating 5s linear;
	-webkit-animation-iteration-count: infinite;
	-moz-animation: rotating 5s linear;
	-moz-animation-iteration-count: infinite;
}
/* pulsate
*/
@-webkit-keyframes pulsate {
	0% {
		-webkit-transform: scale(0, 0);
		opacity: 0.0;
	}
	20% {
		-webkit-transform: scale(1, 1);
		opacity: 1;
	}
	50% {
		-webkit-transform: scale(1, 1);
		opacity: 1;
	}
	100% {
		-webkit-transform: scale(1.2, 1.2);
		opacity: 0.0;
	}
}
@-moz-keyframes pulsate {
	0% {
		-moz-transform: scale(0, 0);
		opacity: 0.0;
	}
	20% {
		-moz-transform: scale(1, 1);
		opacity: 1;
	}
	50% {
		-moz-transform: scale(1, 1);
		opacity: 1;
	}
	100% {
		-moz-transform: scale(1.2, 1.2);
		opacity: 0.0;
	}
}
@keyframes pulsate {
	0% {
		transform: scale(0, 0);
		opacity: 0.0;
	}
	20% {
		transform: scale(1, 1);
		opacity: 1;
	}
	50% {
		transform: scale(1, 1);
		opacity: 1;
	}
	100% {
		transform: scale(1.2, 1.2);
		opacity: 0.0;
	}
}
.pulsate {
	-webkit-animation: pulsate 4s ease-out;
	-webkit-animation-iteration-count: infinite;
	-moz-animation: pulsate 4s ease-out;
	-moz-animation-iteration-count: infinite;
}
/* comeAndGo
*/
@-webkit-keyframes comeAndGo {
	0% {
		-webkit-transform: scale(0, 0);
		opacity: 0.0;
	}
	20% {
		-webkit-transform: scale(1, 1);
		opacity: 1;
	}
	90% {
		-webkit-transform: scale(1, 1);
		opacity: 1;
	}
	100% {
		-webkit-transform: scale(0, 0);
		opacity: 0.0;
	}
}
@-moz-keyframes comeAndGo {
	0% {
		-moz-transform: scale(0, 0);
		opacity: 0.0;
	}
	20% {
		-moz-transform: scale(1, 1);
		opacity: 1;
	}
	90% {
		-moz-transform: scale(1, 1);
		opacity: 1;
	}
	100% {
		-moz-transform: scale(0, 0);
		opacity: 0.0;
	}
}
@keyframes comeAndGo {
	0% {
		transform: scale(0, 0);
		opacity: 0.0;
	}
	20% {
		transform: scale(1, 1);
		opacity: 1;
	}
	90% {
		transform: scale(1, 1);
		opacity: 1;
	}
	100% {
		transform: scale(0, 0);
		opacity: 0.0;
	}
}
.comeAndGo {
	opacity: 0;
	-webkit-animation: comeAndGo 5s ease-out;
	-webkit-animation-iteration-count: 1;
	-moz-animation: comeAndGo 5s ease-out;
	-moz-animation-iteration-count: 1;
}
/* info windows
*/.infoWindow {
	padding: 20px;
	position: fixed;
	border: 1px solid silver;
	background-color: #808000;
	z-index: 9999999999999999999;
	opacity: 0.9;
}
#controller {
	width: 400px;
	height: 400px;
	bottom: 40px;
	right: 10px;
	overflow: auto;
	cursor: move;		
}
#playerMenu {
	width: 400px;
	top: 10px;
	right: 10px;
	cursor: move;
}
.raisingPoints {
	color: #adff2f;
}
.Seigaiha {
	height: 80px;
	/* Can be anything */

	position: relative;
	margin: 0;
	/* Just for demo spacing */

	background: transparent;
	-moz-border-radius: 25%;
	-webkit-border-radius: 25%;
	border-radius: 25%;
	padding: 0;
	background: radial-gradient(#000000 15%, transparent 16%) 0 0, radial-gradient(#000000 15%, transparent 16%) 8px 8px, radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%) 0 1px, radial-gradient(rgba(255, 255, 255, 0.1) 15%, transparent 20%) 8px 9px;
	background-color: darkslategray;
	background-size: 16px 16px;
}
/* progress
*/
.meter {
	height: 80px;
	/* Can be anything */

	position: relative;
	margin: 0;
	/* Just for demo spacing */

	background: transparent;
	-moz-border-radius: 25%;
	-webkit-border-radius: 25%;
	border-radius: 25%;
	padding: 0;
	/*	-webkit-box-shadow: inset 0 -1px 1px rgba(255,255,255,0.3);
	  -moz-box-shadow   : inset 0 -1px 1px rgba(255,255,255,0.3);
	  box-shadow        : inset 0 -1px 1px rgba(255,255,255,0.3);*/

}
.meter > span {
	border-radius: 50%;
	display: block;
	width: 100%;
	height: 100%;
	background-color: #2bc253;
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #2bc253), color-stop(1, #54f054));
	background-image: -moz-linear-gradient(center bottom, #2bc253 37%, #54f054 69%);
	-webkit-box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3), inset 0 -2px 6px rgba(0, 0, 0, 0.4);
	-moz-box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3), inset 0 -2px 6px rgba(0, 0, 0, 0.4);
	box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3), inset 0 -2px 6px rgba(0, 0, 0, 0.4);
	position: relative;
	overflow: hidden;
}
.meter > span:after,
.animate > span > span {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, rgba(255, 255, 255, 0.2)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.2)), color-stop(0.75, rgba(255, 255, 255, 0.2)), color-stop(0.75, transparent), to(transparent));
	background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
	z-index: 1;
	-webkit-background-size: 50px 50px;
	-moz-background-size: 50px 50px;
	-webkit-animation: move 2s linear infinite;
	overflow: hidden;
}
.powerup {
	position: relative;
}
.powerup > div > div {
	width: 50px !important;
	height: 50px !important;
	top: 15px;
	left: 15px;
}
.powerup > .powerupFuel,
.powerup > .powerupAmmo,
.powerup > .powerupShield {
	position: absolute;
	top: 17px;
	left: 17px;
}
.powerupFuel {
	background: url('../images/City-Gas-station-icon.png') center center no-repeat;
	width: 48px;
	height: 48px;
}
.powerupAmmo {
	background: url('../images/Military-Ammo-tin-icon.png') center center no-repeat;
	width: 48px;
	height: 48px;
}
.powerupShield {
	background: url('../images/Security-Refresh-shield-icon.png') center center no-repeat;
	width: 48px;
	height: 48px;
}
.animate > span:after {
	display: none;
}
@-webkit-keyframes move {
	0% {
		background-position: 0 0;
	}
	100% {
		background-position: 50px 50px;
	}
}
.ammoMeter > span {
	background-color: silver;
	background-image: -moz-linear-gradient(top, #c0c0c0, #441122);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #c0c0c0), color-stop(1, #441122));
	background-image: -webkit-linear-gradient(#c0c0c0, #441122);
	opacity: 0.5;
}
.fuelMeter > span {
	background-color: silver;
	background-image: -moz-linear-gradient(top, #c0c0c0, #191970);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #c0c0c0), color-stop(1, #191970));
	background-image: -webkit-linear-gradient(#c0c0c0, #191970);
	opacity: 0.5;
}
.shieldMeter > span {
	background-color: silver;
	background-image: -moz-linear-gradient(top, #c0c0c0, #356635);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #c0c0c0), color-stop(1, #356635));
	background-image: -webkit-linear-gradient(#c0c0c0, #356635);
	opacity: 0.5;
}
.orange > span {
	background-color: #f1a165;
	background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f1a165), color-stop(1, #f36d0a));
	background-image: -webkit-linear-gradient(#f1a165, #f36d0a);
}
.red > span {
	background-color: #f0a3a3;
	background-image: -moz-linear-gradient(top, #f0a3a3, #f42323);
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0a3a3), color-stop(1, #f42323));
	background-image: -webkit-linear-gradient(#f0a3a3, #f42323);
}
.nostripes > span > span,
.nostripes > span:after {
	-webkit-animation: none;
	background-image: none;
}
#statusbar {
	position: fixed;
	bottom: 0px;
	left: 0px;
	z-index: 99999999999999;
	padding: 10px 0 10px 0;
	height: 10px;
	width: 100%;
	background-color: black;
	color: white;
}
	#statusbar a {
		color: white;
	}
#minimap {
	position: absolute;
	top: 10px;
	left: 10px;
	transform-origin: 0 0; /* @see http://stackoverflow.com/questions/18943773/css-wrong-position-of-transform-scale-container-children */

	height: 1px;
	width: 1px;
	
	/*border: 1px solid white;*/
	background: #2f4f4f url('../images/tile/green.png') repeat;
	box-shadow: 0px 0px 150px #000;
	cursor: move;
	
	/*opacity: 0.9;*/
}
.minimapTank {
	position: absolute; 
	top: 560px; 
	left: 160px;
	width: 80px; 
	height: 80px; 
	margin: 0px; 
	background-color: silver; 
	z-index: 10;
	border-radius: 50%;
}
.worker {
	position: relative;
	top: -50px;
}
/* jquery tooltip
*/
.ui-tooltip {
	width: 100px;
	padding: 2px 10px 2px 10px;
	color: white;
	border-radius: 10px;
	text-transform: uppercase;
	box-shadow: 0 0 7px black;
	opacity: 0.5;
}
.flipH {
	-moz-transform: scaleX(-1);
	-o-transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
	filter: FlipH;
	-ms-filter: "FlipH";
}


.blink {
  animation: blink 1s steps(5, start) infinite;
  -webkit-animation: blink 1s steps(5, start) infinite;
}
@keyframes blink {
  to {
	visibility: hidden;
  }
}
@-webkit-keyframes blink {
  to {
	visibility: hidden;
  }
}


/* 2015-01-21
*/
.tankHull {
	position: absolute;
	top: -25px;
	left: -20px;
	padding: 0;
	width: 127px;
	height: 127px;
	background: url('../images/carro_base.png');
	background-position: 0px 0px;
	/*border: 1px solid red;*/

	z-index: 10;
}
.tankTurret {
	position: absolute;
	top: -25px;
	left: -20px;
	padding: 0;
	width: 127px;
	height: 127px;
	background: url('../images/torrette_base.png');
	background-position: 0px 0px;
	
	z-index: 20;
} 
