body {
	background-color:#000;
	color:#fff;
	-webkit-animation:fadeIn 2s;
	text-align:center;
}
h1 {
	margin:auto;
	margin-top:10px;
	margin-bottom:10px;
	padding-top:8px;
	border:solid 1px #000;
	border-radius:100px;
	width:160px;
	color:#ea5;
	text-shadow: 0 0 10px #fff;
	text-align:center;
	text-decoration:underline;
	font-family:TrajanPro;
	-webkit-animation:pulse 3s;
	-webkit-animation-iteration-count:infinite;
	-webkit-transition:background-color 3s;
}
h1:hover {
	background-color:#333;
}
ul {
	margin:0;
	padding:5px;
	background-color:#333;
	border:solid 1px #000;
	border-radius:10px;
	text-align:center;
	font-family:Skia;
	-webkit-transition:background-color 3s;
}
ul:hover {
	background-color:#232;
}
li {
	display:inline;
}
div#diceButton {
	background-image:url('../images/1d20.png');
	width:32px;
	height:36px;
	position:absolute;
	top:5px;
}
div#diceButton:hover {
	background-position:0 37px;
	-webkit-animation:spin 3s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count:infinite;
}
div#diceBox {
	visibility:hidden;
	border:solid 1px #fff;
	border-radius:10px;
	background:#fff;
	color:#000;
	position:absolute;
	top:50px;
	padding:20px;
	-webkit-transition: width 1.5s, height 1.5s;
	width:0;
	height:0;
}
div#diceBox:hover {
	width:200px;
	height:300px;
}
div#diceBox div#inner_content {
	opacity:0.0;
	text-align:left;
}

div#diceBox div#inner_content {
	opacity:0.0;
	-webkit-transition: opacity 1s;
	-webkit-transition-delay:-1s;
}

div#diceBox:hover div#inner_content {
	opacity:1.0;
	-webkit-transition-delay:0.2s;
}

a:link, a:visited {
	color:#6f6;
	font-size:10pt;
	-webkit-transition: color 2s;
}
a:hover {
	color:#fb6;
}

@-webkit-keyframes fadeIn {
	from	{opacity:0.0;}
	to		{opacity:1.0;}
}
@-webkit-keyframes pulse {
	0%		{text-shadow: 0 0 10px #fff;}
	25%		{text-shadow: 0 0 10px #aaa;}
	50%		{text-shadow: 0 0 10px #888;}
	75%		{text-shadow: 0 0 10px #aaa;}
	100%	{text-shadow: 0 0 10px #fff;}
}

@-webkit-keyframes spin {
    from    {-webkit-transform:rotate(0deg);}
    to      {-webkit-transform:rotate(360deg);}
}

#-webkit-keyframes diceBoxGrow {
	from	{width:0;height:0;}
	to		{width:200px;height:300px;}
}

@font-face {
	font-family:TrajanPro;
	src:url('../fonts/TrajanPro-Regular.otf');
}
@font-face {
	font-family:Skia;
	src:url('../fonts/Skia.tff');
}
@font-face {
	font-family:Zapfino;
	src:url('../fonts/Zapfino.tff');
}