@font-face {
    font-family: Square721;
    src: url(square721.ttf);
}
body 
{
	background: #DDD;
	color: black;
	font-family: Square721, "Trebuchet MS", Helvetica, Verdana, arial, sans-serif;
	width: 100%;
	height: 100%;
	font-size: 14pt;
	padding: 0;
	margin: 0;
    text-shadow: 0px 1px 0px #fff;
}
a{
     text-decoration: none;
     color: Blue;
}
.heading
{
    background-color: #ccc;
    background-image: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#999));
    border-bottom: 1px solid #666;
}
.heading h1{
    color: #222;
    font-size: 20px;
    font-weight: bold;
	margin: 0 auto;
	padding: 10px 0;
    text-align: center;
    text-shadow: 0px 1px 0px #fff;
    max-width: 200px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    border-bottom: 0;
}
.centered{
	text-align:center;
}
#content
{
	background: #FFF;
	margin:auto;
}

h1
{
    margin: 0;
    font-weight:bold;
    background-color: #ccc;
    border-bottom: 1px solid #666;
    color: #222;
    display: block;
    font-size: 20px;
    font-weight: bold;
    padding: 10px 0;
    text-align: center;
    text-decoration: none;
    text-shadow: 0px 1px 0px #fff;
    background-image: -webkit-gradient(linear, left top, left bottom,
    from(#ccc), to(#999));

}
.menu
{
    margin: 10px;
}
.menu a
{
	margin-top:0;
	background-color: #FFFFFF;
	border: 1px solid #999999;
	color: #222222;
	display: block;
	font-size: 17px;
	font-weight: bold;
	margin-bottom: -1px;
	padding: 12px 10px;
	text-decoration: none;
}

.menu a:first-child {
-webkit-border-top-left-radius: 8px;
-webkit-border-top-right-radius: 8px;
}
.menu a:last-child {
-webkit-border-bottom-left-radius: 8px;
-webkit-border-bottom-right-radius: 8px;
}

#mainbox 
{
	padding: 10px;
	text-align: justify;
}

.cent
{
	text-align: center;
}
img 
{
	border: 0;
	margin: 0;
	padding: 0;
}
.footer {
    font-size:xx-small;
    text-align:center;
    padding-bottom:5px;
}
li	{
	margin-bottom: 0.5em;
}

.button
		{
			color: #fff;
			text-decoration: none;
			display: inline-block;
			padding: 4px 10px;
			-webkit-border-radius: 5px;
			font: normal 14px/16px Square721, "Trebuchet MS", Helvetica, Verdana, arial, sans-serif;
		}
		
		.button.black {
			background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#8097b9),color-stop(0.5, #8097b9), color-stop(0.5, #4a6c9b), to(#4a6c9b));
			border: solid 1px rgba(79, 79, 79, 0.75);
		}
		.button.black:hover {
			background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, 
				from(#4286f5), 
				color-stop(0.5, #4286f5),
				color-stop(0.5, #194fdb),
				to(#194fdb));
		}
		header.button
		{
		
		}
		.button.back {
			position: absolute;
			left: 15px;
			top: 10px;
		}
		.back.black > span {
			background-image: -webkit-gradient(linear, left top, right bottom, from(#8097b9),color-stop(0.5, #8097b9), color-stop(0.5, #4a6c9b), to(#4a6c9b));
			border-left: solid 1px rgba(79, 79, 79, 0.75);
			border-bottom: solid 1px rgba(79, 79, 79, 0.75);
			-webkit-border-top-left-radius: 6px;
			-webkit-border-bottom-right-radius: 6px;
			height: 19px;
			width: 19px;
			display: inline-block;
			-webkit-transform: rotate(45deg);
			-webkit-mask-image: -webkit-gradient(linear, left bottom, right top, 
				from(#000000), 
				color-stop(0.5,#000000), 
				color-stop(0.5, transparent), 
				to(transparent));
			position: absolute;
			left: -8px;
			top: 2px;
			-webkit-background-clip: content;
		}
		.back:hover > span {
			background-image: -webkit-gradient(linear, left top, right bottom, 
				from(#4286f5), 
				color-stop(0.5, #4286f5),
				color-stop(0.5, #194fdb),
				to(#194fdb));
		}
		
		.button.next {
			position: absolute;
			right: 15px;
			top:10px;
		}
		.next.black > span {
			background-image: -webkit-gradient(linear, left top, right bottom, from(#8097b9),color-stop(0.5, #8097b9), color-stop(0.5, #4a6c9b), to(#4a6c9b));
			border-right: solid 1px rgba(79, 79, 79, 0.75);
			border-top: solid 1px rgba(79, 79, 79, 0.75);
			-webkit-border-top-left-radius: 6px;
			-webkit-border-bottom-right-radius: 6px;
			height: 20px;
			width: 20px;
			display: inline-block;
			-webkit-transform: rotate(45deg);
			-webkit-mask-image: -webkit-gradient(linear, right top, left bottom, from(#000000), color-stop(0.5,#000000), color-stop(0.5, transparent), to(transparent));
			position: absolute;
			right: -8px;
			top: 1px;
			-webkit-background-clip: content
		}
		.next:hover > span {
			background-image: -webkit-gradient(linear, left top, right bottom, 
				from(#4286f5), 
				color-stop(0.5, #4286f5),
				color-stop(0.5, #194fdb),
				to(#194fdb));
		}
        .red{
	color: #D22027;
	font-weight: bold;
}