body { 
	margin: 0;
	overflow: hidden;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

a {
		text-decoration: none;
		color: #2E86AB;
}

#loading{
	position: absolute;
	top:50%;
	left:50%;
	transform: translate(-50%, -50%);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 2em;
	z-index:-1;
}

#notification_bar {
	position: absolute;
	top:20px;
	right: 0;

	height: 80px;
	width: 0;
	/*width: 320px; 320 is the expended value, when showed by Jquery*/
	background-color: #1C232A;
	opacity: 0; /* Set to 0.9 when showed */
	z-index: 100;
	border-left: 24px solid #2E86AB;
}

#notification_bar p{
	margin: 6px;
	color: #EAEAEA;
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
}

#picture_zoom{
	position: absolute;
	top: 10%;
	bottom: 10%;
	left: 10%;
	right: 10%;
	border: 4px solid black;
	z-index: 100;
	
}
#picture_zoom img{
	width: 100%;
	height: 100%;
}

@media only screen and (min-width: 1000px) {
	#movement_keys{
		display: none;/*Those keys should be visible only on phones*/
	}
}

#movement_keys{
	z-index: 101;
	position: absolute;
	bottom: 10px;
	right: 10px;
	width: 170px;
	height: 115px;
}

#movement_keys div{
	width: 50px;
	height: 50px;
	z-index: 102;
	background-color: #2E86AB;
	opacity: 0.8;
}

#key_up{
	position: absolute;
	top:5px;
	left:50%;
	transform: translateX(-50%);
}

#key_left{
	position: absolute;
	top:60px;
	left:5px;
}
#key_down{
	position: absolute;
	top:60px;
	left:60px;
}
#key_right{
	position: absolute;
	top:60px;
	right:5px;
}