body
{
	font-family: 'Roboto', sans-serif;
	font-size:11pt;
	color:#fff;
  background-repeat: repeat;
  background-image: url("/images/website/bg.png");
}


#title {
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
	box-sizing: border-box;
	display: block;
	text-align: center;
}

#logo {
	font-family: 'Righteous', sans-serif;
	font-weight: 300;
	font-size: 70pt;
	color: #ffffff;
	display: block;
	text-shadow: 0px 0px 10px #ffffff;
	text-align: center;
	animation: color_cycle 16s infinite;
}

#logo img {
	width:70%;
}

#signin_button {
	font-weight: 400;
	font-size: 14pt;
	color: #ffffff;
	display: inline-block;
	text-align: center;
	box-shadow: 0 3px 10px rgba(0,0,0,.23),0 3px 10px rgba(0,0,0,.16);
	border-radius: 4px;
	padding: 10px 20px;
	background-color: #AFB42B;
	margin-top: 10px;
	transition: background-color .2s ease;
}

#signin_button:hover {
	background-color: #CDDC39;
	cursor: pointer;
	transition: background-color  .2s ease;
}

#createaccount_button {
	font-weight: 400;
	font-size: 11pt;
	color: #ffffff;
	display: block;
	text-align: center;
	padding: 10px 20px;
	margin-top: 10px;
}

#createaccount_button:hover {
	cursor: pointer;
 	text-decoration-line: underline;
  text-decoration-style: solid;
}

@keyframes color_cycle
{
  0%   { text-shadow: 0px 0px 10px #ffffff; }
  25%  { text-shadow: 0px 0px 10px #ffff00; }
  50%  { text-shadow: 0px 0px 10px #ff00ff; }
  75% { text-shadow: 0px 0px 10px #00ffff; }
  100% { text-shadow: 0px 0px 10px #ffffff; }
}

@keyframes rotate_bg
{
  from  { transform: rotate(0deg); }
  to  { transform: rotate(360deg); }
}