/* HTML5 CSS RESET */
p, a, h1, h2, h3, h4, h5 {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
body:before
{
   content: "";
   position: fixed;
   top: -10px;
   left: 0;
   width: 100%;
   height: 10px;
   z-index: 100;
   -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
   -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
   box-shadow: 0px 0px 10px rgba(0,0,0,.8);
}
body{
	margin: 0;
	background: url('img/bg-grad.png');
	background-repeat: repeat-x;
	font-family:Verdana, Geneva, Tahoma, sans-serif;
	font-size:12px;
	color:#686868;
}
#outer {
	position: relative;
	/*top: 50%;*/
	left: 0px;
	width: 100%;
	overflow: visible;
}
#inner {
	width: 980px;
	background-image: url('img/bg-shadow.png');
	background-repeat: repeat-y;
	/*height: 200px;*/
	margin-left: -490px;  /***  width / 2   ***/
	position: relative;
	/*top: -100px;          /***  height / 2   ***/
	left: 50%;
	/*-webkit-box-shadow: 2px 0px 3px 0px rgba(000, 000, 000, .5);
	box-shadow: 2px 0px 3px 0px rgba(000, 000, 000, .5);*/
}
#top-bar {
	width: 100%;
	height: 130px;
	
	/*background-color: #0017af; /* TO MATCH FOOTER */
	background: #af0092; /* TO MATCH FOOTER2 */
}
#header {
	margin-left: auto;
	margin-right: auto;
	width: 810px;
	color: #fff;
}
#header img {
	float: left;
}
#page-content {
	margin-left: auto;
	margin-right: auto;
	width: 810px;
}
#fade {
	width: 980px;
	height: 41px;
	background-image: url('img/bg-shadow-fade.png');
	background-repeat: repeat-x;
	margin-left: -489px;
	position: relative;
	left: 50%;
}
/*
.drop-shadow {
   position:relative;
   width:90%;
}

.drop-shadow:before,
.drop-shadow:after {
   content:"";
   position:absolute;
   z-index:-1;
   bottom:15px;
   left:10px;
   width:50%;
   height:20%;
   max-width:300px;
   -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
   -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
   box-shadow:0 15px 10px rgba(0, 0, 0, 0.7);
   -webkit-transform:rotate(-3deg);
   -moz-transform:rotate(-3deg);
   -o-transform:rotate(-3deg);
   transform:rotate(-3deg);
}

.drop-shadow:after{
   right:10px;
   left:auto;
   -webkit-transform:rotate(3deg);
   -moz-transform:rotate(3deg);
   -o-transform:rotate(3deg);
   transform:rotate(3deg);
 }
*/

/* 3D BOX SHADOW SECTION */
.box {
	position: relative;
	width: 60%;
	background: #ddd;
	-moz-border-radius: 4px;
	border-radius: 4px;
	padding: 2em 1.5em;
	color: rgba(0,0,0, .8);
	text-shadow: 0 1px 0 #fff;
	line-height: 1.5;
	/*margin: 60px auto; /* USE TO SET SURROUNDING MARGIN AND SET TO CENTRE ALIGNED */
	margin: 20px 0 20px 50px; /* USE TO SET SURROUNDING MARGIN */
}
.box:before{ 
	z-index: -1;
	position: absolute;
	content: "";
	bottom: 15px;
	left: 10px;
	width: 50%;
	top: 80%;
	max-width:300px;
	background: rgba(0, 0, 0, 0.7);
	-webkit-box-shadow: 0 15px 10px rgba(0,0,0, 0.7);
	-moz-box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
	box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
	-webkit-transform: rotate(-3deg);
	-moz-transform: rotate(-3deg);
	-o-transform: rotate(-3deg);
	-ms-transform: rotate(-3deg);
	transform: rotate(-3deg);
}
.box:after {
	-webkit-transform: rotate(3deg);
	-moz-transform: rotate(3deg);
	-o-transform: rotate(3deg);
	-ms-transform: rotate(3deg);
	transform: rotate(3deg);
	right: 10px;
	left: auto;
}
#footer {
	text-align:left;
	width: 100%;
	height: 252px;
	padding-top: 20px;
	background-image: url('img/footer2.png');
	background-position: center;
	color: #fff;
}
#footer a:link, #footer a:visited {
	text-decoration: none;
	color: #aaa;
}
#footer a:hover {
	text-decoration: underline;
	color: #fff;
}

/* GNASHERS H STYLES */
h1 {
    font-size: 2.2em;
    margin-bottom: 4px;
}
h2 {
    font-size: 2.0em;
    margin-bottom: 4px;
}
h3 {
    font-size: 1.8em;
    margin-bottom: 4px;
}
h4 {
    font-size: 1.6em;
    margin-bottom: 4px;
}
h5 {
    font-size: 1.4em;
    margin-bottom: 4px;
}