html, body {
font-family:Segoe UI;
margin:0px;
padding:0px;
}
img, a {
	outline:none;
	border:none;
}
#splashscreen {
margin:0;
position:fixed;
width:100%;
height:100%;
top:0;
color:#FFFFFF;
background-image:url('../splashscreen.png');
background-position:center;
background-color:#FFD500;
background-repeat:no-repeat;
animation:splash 4s;
-ms-animation:splash 4s;
-webkit-animation:splash 4s;
-o-animation:splash 4s;
opacity:0;
z-index:-1;
}
@keyframes splash {
from {
z-index:2;
opacity: 1;
}
66% {
opacity: 1;
}
to {
opacity:0;
z-index:1;
display:none;
}
}
@-webkit-keyframes splash {
from {
z-index:2;
opacity: 1;
}
66% {
opacity: 1;
}
to {
opacity:0;
z-index:1;
display:none;
}
}
@-ms-keyframes splash {
from {
z-index:2;
opacity: 1;
}
66% {
opacity: 1;
}
to {
opacity:0;
z-index:1;
display:none;
}
}
@-o-keyframes splash {
from {
z-index:2;
opacity: 1;
}
66% {
opacity: 1;
}
to {
opacity:0;
z-index:1;
display:none;
}
}
#hoverarea {
	position:fixed;
	top:0px;
	right:0px;
	width:15px;
	height:15px;
}
#bottomhoverarea {
	position:fixed;
	bottom:0px;
	right:0px;
	width:15px;
	height:15px;
}
#starthoverarea {
	position:fixed;
	bottom:0px;
	left:0px;
	width:15px;
	height:15px;
}
#charmsbar {
	display:none;
	background-color:#111111;
	position:fixed;
	padding:5% 0;
	top:0px;
	right:0px;
	height:100%;
	width: 86px;

}
#settingscharms {
	padding : 40px;
	display:none;
	background-color:#3B66AD;
	position:fixed;
	top:0px;
	right:0px;
	height:100%;
	width: 345px;

}
#startbutton {
	display:none;
	position:fixed;
	left:0px;
	bottom:0px;
}
#iconnetwork {
	position:absolute;
	top:35px;
	left:25px;
}
#iconbattery {
	position:absolute;
	bottom:35px;
	left:32px;
}
#datetime {
	display:none;
	position:fixed;
	left:50px;
	bottom:50px;
	width:490px;
	height:139px;
	background-color: rgba(17,17,17,1);
}
#time {
	position:absolute;
	left:70px;
	bottom:19px;
	font-family: Segoe UI Light;
	font-size: 64pt;
	color:#FFFFFF;
}
#date {
	margin-top:20px;
	margin-right:20px;
	float:right;
	font-size:24pt;
	font-family: Segoe UI;
	color:#FFFFFF;
}