/* Heroes of Newerth Tour Page 
	Heroes fo Newerth
	Beyond Gaming.com
		Dino Vidakovic
		Vjekoslav Azenic
		Sean Anteau
*/

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

@font-face {
font-family: 'Quiz';
src: url('frizquadratastd.eot?') format('eot'),
url('frizquadratastd.woff') format('woff'),
url('frizquadratastd.otf') format('otf'),
url('frizquadratastd.ttf') format('truetype');
} 

body{
	position: relative;
	padding: 0;
	margin:0;
	background:#000 url(images/background.jpg) no-repeat;
	background-size: auto;
}
.wrapper{
	width:1138px;
	margin:0 auto;
	position: relative;
}
.header{
	width:1138px;
	height:300px;
	background: url(images/header.png) no-repeat;
	position: relative;
}
	.header-bar{
		height:66px;
		background: url(images/header-bar.png) repeat;
		position: absolute;
		top:137px;
		width: 100%;
		z-index: -1;
	}
	.header .nav{	
		position: absolute;
		top:157px;
		left: 166px;
		padding:0;
		margin:0;
	}
		.header .nav li{
			display: inline;
		}
			.header .nav li a{
				display:block;
				float: left;
				height: 40px;
				text-indent: -9999px;
			}
		.nav .hontv{
			width:112px;
		}
		.nav .brackets{
			width: 100px;
		}
		.nav .schedule{
			width: 113px;
			margin: 0 172px 0 0;
		}
		.nav .teams{
			width:100px;
		}
		.nav .sponsors{
			width:100px;
		}
		.nav .blog{
			width:100px;
		}
	.header a.competenow{
		height: 78px;
		width: 288px;
		position: absolute;
		left: 426px;
		top:236px;
		text-indent:-9999px;
	}
		.header a.competenow:hover{
					background: url(images/bars.png) -81px -597px no-repeat;
		}
	.content{
		width:894px;
		margin: 0 0 100px 74px;
		position: relative;
		background: url(images/contentback-middle.jpg) repeat;
		padding: 40px 50px 150px;
		z-index: -1;
		float: left;
	}
		.content > .top{
			height:805px;
			width:969px;
			position: absolute;
			top: 0;
			left: 11px;
			z-index: -1;
			background: url(images/contentback-top.png) 0 0 no-repeat;
		}
		.content > .bottom{
			height: 596px;
			width:969px;
			position: absolute;
			bottom:0;
			left: 11px;
			z-index:-2;
			background: url(images/contentback-bottom.png) 0 0 no-repeat;
		}
			.content > .bottom > .left{
				width:44px;
				height:596px;
				background: url(images/bars.png) -81px 0 no-repeat;
				position: absolute;
				left:-44px;
				bottom: 0;
			}
			.content > .bottom > .right{
				width: 35px;
				height: 596px;
				background: url(images/bars.png) -125px 0 no-repeat;
				position: absolute;
				right:-35px;
				bottom: 0;
			}
			.content > .bottom > .bottom{
				width:1061px;
				height:87px;
				background: url(images/bar-bottom.png) no-repeat;
				position:absolute;
				bottom: -87px;
				left: -48px;
			}
		.bar-left{
			height: 805px;
			width:41px;
			background:url(images/bars.png) no-repeat;
			position: absolute;
			left: -30px;
			top:0;
		}
		.bar-right{
			width:40px;
			height:805px;
			background: url(images/bars.png) -41px 0 no-repeat;
			position: absolute;
			right: -26px;
			top:0;
		}
	.content .left{
		float:left;
		width: 522px;
		margin: 0 20px 0 0;
	}
	.content .middle{
		z-index: 1;
		position:relative;
	}
/* SLIDER */
.slider {
	width: 522px;
	position:relative;
	float: left;
}
.slider .top{
	width: 522px;
	height: 295px;
	position:relative;
}
.slider .frame{
	width:522px;
	height:295px;
	background: url(images/slide-frame.png);
	position:absolute;
	top: 0;
	left:0;
	z-index: 1;
}
.slider .slide{
	height: 285px;
	width: 522px;
	background:red;
	margin:5px 0 0 0;
	overflow:hidden;
	float: left;
	position: absolute;
}
	.slider .slide a{
		display: block;
	}
	.slider .slide .info{
		width: 476px;
		min-height:20px;
		background: url(images/slider-trans.png) repeat;
		position: absolute;
		bottom:16px;
		left:13px;
		color: #EFD19F;
		padding:5px 10px 10px;
	}
		.slider .slide .info h1{
			color: #fff;
			font-size:20px;
			font-weight:bold;
			font-family: Quiz, serif;
		}
.slider .slides{
	height: 40px;
	width: 522px;
}
.slider .slidernav li{
	display: inline;
}
.slider .slidernav a{
	display:block;
	float:left;
}
.slider .slidernav a#back > div{
	width:26px;
	height:28px;
	background: url(images/bars.png) -159px -1px no-repeat;
	margin:20px 5px 0 0;
}
.slider .slidernav a#next > div{
	width:26px;
	height:28px;
	background: url(images/bars.png) -185px -1px no-repeat;
	margin:20px 0 0 5px;
}
/* LATEST NEWS */
.latest-news{
float:left;
margin:20px 0 0 0;
}
.latest-news img{
	float: left;
	margin: 0 0 10px 0;
}
.latest-news h1{
	font-size: 42px;
	color:#532d15;
	text-align:center;
	border-bottom:1px solid #b07a51;
	padding:0 0 10px 0;
	margin:0px 0 20px 0;
	display:block;
}
.latest-news h2 a{
	color: #8b5e16;
	font-size: 20px;
	text-decoration: none;
}
	.latest-news .left{
		width: 242px;
		float:left;
	}
		.latest-news .left span{
			margin: 10px 0;
			font-size: 12px;
			display: block;
		}
		.latest-news .left a,
		.latest-news .right > a{
			color:#8b5e16;
			display: block;
			margin:10px 0 0 0;
			text-decoration: none;
		}
	.latest-news .right{
		float:left;
		width: 260px;
	}
	.latest-news ul li {
		border-bottom: 1px solid #d0cec3;
		padding: 10px 0;
	}
	.latest-news ul li a{
		color: #8b5e16;
		text-decoration: none;
	}
/* RIGHT */
.right{
	float:left;
}
/* LEADERBOARD */
.leaderboard{
	width: 345px;
	height:363px;
	background: url(images/right.png) 0 0 no-repeat;	
}
	.leaderboard table{
		margin: 48px 0 0 10px;
		width: 320px;
		font-size: 13px;
		float: left;
		text-align: center;
	}
		.leaderboard table thead{
			background: #C0BBA7;
		}
		.leaderboard table tr{
			border-bottom: 1px solid #C8C3AD;

		}
		.leaderboard table tr th,
		.leaderboard table tr td{
			padding: 4px 0;
		}
/* LATEST VIDEOS */
.latest-videos{
	width: 335px;
	height: 364px;
	margin: 20px 0 0 0;
	padding: 70px 0 0 10px;
	background: url(images/right.png) 0 -363px no-repeat;
}
.latest-videos > a{
	width: 141px;
	display:block;
	text-align: center;
	text-decoration: none;
	color: #532d15;
	margin: 0 10px 15px;
	float: left;
}
	.latest-videos > a span{
		color: black;
		margin: 0 4px;
	}
/* Registration */
.register{
	width:630px;
	margin: 40px auto 0;
}
.register h1{
	text-align: center;
	font-size: 42px;
	color: #532d15;
	border-bottom: 1px solid gray;
	padding: 0 0 10px 0;
}
.register p{
	font-size:16px;
	text-align: center;
	margin: 10px 0;
}
.register h2{
	font-size:20px;
	text-align:center;
	margin:20px 0;
}
.register a{
	color: #8B5E16;
	text-decoration: none;
}
.register li{
	width:600px;
	height: 30px;
	display:block;
	margin: 0 0 8px 0;
}
.register .checkboxes{
	margin: 40px 0 0 0;
}
	.register .checkboxes li{
		margin: 0 0 2px 0;
	}
.register label{

width:180px;
float:left;
text-align: right;
margin:0 20px 0 0;
padding:5px 0 0 0;
font-size: 18px;
color: #71401F;
}
.register input[type=text], input[type=password]{
	width:232px;
	height: 28px;
	background: transparent;
	border: none;
	display: block;
	margin: -30px 0 0 0;
	font-size: 16px;
}
.register select{
	width:252px;
	height: 30px;
	background: #fff;
	border: none;
	display: block;
	margin: 0px 0 0px -10px;	
	font-size:16px;
	padding:3px 1px 3px 4px;
	outline: none;
	float:left;
	border: 1px solid #666;
}
	.register option{
		background: #fff;
		padding: 2px 0 0 4px;
	}
.register input[type=checkbox]{
	margin: 0 4px -3px 0;
	float:left;
}
	.register li > span{
		width: 232px;
		height: 30px;
		display: block;
		float:left;
		background: url(images/form.png) 0 -60px repeat;
	}
		.register li > span.day,
		.register li > span.month{
			width:30px;
			margin: 0 37px 0 0;
		}
			.register li > span.day input,
			.register li > span.month input{
				width:30px;
			}

			.register li >span.day:after,
			.register li >span.month:after,
			.register li > span.year:after{
				margin-top: -30px;
			}
		.register li > span.year{
			width: 50px;
		}
	.register li > span:before{
		content: "";
		width: 10px;
		height:30px;
		display:block;
		margin: 0 0 0 -10px;
		background: url(images/form.png) 0 0 no-repeat;
	}
	.register li >span:after{
		content: "";
		width: 10px;
		height: 30px;
		display:block;
		float: right;
		margin: -30px -10px 0 0;
		background: url(images/form.png) 0 -30px no-repeat;
	}
	.register li > div{
		font-size:30px;
		font-weight:bold;
		color: #666;
		float:left;
		margin: 0 21px 0 -20px;
	}
.register button{
	width:144px;
	height:41px;
	display: block;
	margin: 20px auto 0;
	text-indent: -9999px;
	border: none;
	background: url(images/bars.png) -215px 0;
	cursor: pointer;
}
	.register button:hover{
		background-position: -215px -41px;
	}
	.register .gender{
		width:94px;
	}
	.register .timezone{
		width: 409px;
	}
/* ERROR */
.error{
	width: 800px;
	padding: 20px 0;
	margin: 20px auto;
	border: 2px solid #532d15;
	background: #b07a51;
	color:#efd19f;
	font-size:18px;
	text-align:center;
}
/* Success Page */
.success {
	min-height: 628px;
}
.success > div {
	width: 611px;
	height:77px;
	background:url(images/success-text.png) 0 0 no-repeat;
	margin: 60px auto 40px auto;
	text-indent: -9999px;
}
.success > a{
	width:533px;
	height:61px;
	text-indent:-9999px;
	margin: 0 auto;
	display:block;
	background: url(images/playhonbutton.png) no-repeat;
}
/* SPLASH */
body#splash{
	background: #000;
}
body#splash > div{
	width:1350px;
	height:1151px;
	margin: 0 auto;
	position: relative;
	background: url(images/splashHONfinal.jpg) no-repeat;
}
body#splash a.signup{
		
		height: 78px;
		width: 288px;
		position: absolute;
		left: 539px;
		top:575px;
		text-indent:-9999px;
}
	
	/*		body#splash a.signup:hover{
					background: url(images/bars.png) -81px -597px no-repeat;
		}
		*/
		body#splash a.bg{
			width: 218px;
			height:100px;
			text-indent: -9999px;
			position: absolute;
			top:672px;
			display: block;
			left: 228px;
		}
		body#splash a.facebook{
			width:60px;
			height:80px;
			text-indent:-9999px;
			position: absolute;
			top: 672px;
			left:938px;
			display: block;
		}
		body#splash a.twitter{
			left: 998px;
			top: 672px;
			width: 60px;
			height: 80px;
			text-indent: -9999px;
			position: absolute;
		}
		body#splash a.youtube{
			left: 1061px;
			top:672px;
			text-indent: -9999px;
			width: 60px;
			height:80px;
			position: absolute;
		}