/*
	HotPress Web Framework
	By: Team HotPress Web
	Created: 2011
*/

/* `Hero
----------------------------------------------------------------------------------------------------*/

.hero {
	height:245px;
	margin:0 auto;
	overflow:hidden;
	padding:0;
	position:relative;
	width:615px;
	background-color: #FFF;
}

/* Image --------------------------*/

.hero-image {
	height:245px;
	margin:0;
	overflow:hidden;
	padding:0px;
	right:0px;
	top:0;
	width:615px;
	z-index:15;
}
.hero-images{
	position:relative;
}
.hero-images ul{
	margin:0;
	padding:0;
}
.hero-images ul li {
	position: absolute;
	padding:0;
	top:0;
    display:none;
    background:none;
}
	
/* Description --------------------------*/

.hero-description{
	background: none;
	color: #333;
	display: block;
	height: 180px;
	left: 50px;
	margin: 0;
	overflow: hidden;
	padding: 10px;
	position:absolute;
	top: 50px;
	width: 420px;
	z-index: 3;
}
.hero-description h1{
	color: #000;
	font-size: 20px;
	margin-bottom: 10px;
}
.hero-description p {
	margin-bottom: 10px;
}		
	.hero-description a.hero-link:link,
	.hero-description a.hero-link:visited {
		background: #666;
		color: #fff;
		display: inline-block;
		font-size: 12px;
		padding: 5px 10px;
		text-decoration: none;			
	}
	
	.hero-description a.hero-link:hover,
	.hero-description a.hero-link:active {
		background: #333;
	}
.hero-descriptions {
	left:13px;
	position: relative;
	top:0px;
    z-index:17;
}
.hero-descriptions ul{
	margin:0;
	padding:0;
}
.hero-descriptions ul li {
	position: absolute;
	top:0;
    display:none;
    background:none;
}	
	
/* Overlay --------------------------*/

.hero-overlay {
	background: url("images/hero-overlay.png") no-repeat scroll 0 0;
	display: block;
	height: 300px;
	left: 0;
	position: absolute;
	top: 0;
	width: 960px;
	z-index: 2;
}
.hero-divider{
	display:none;
}

/* Title --------------------------*/
	.hero-title {
	}
	
	.hero-title a:link,
	.hero-title a:visited {
		color: #ccc;
		text-decoration: none;
	}
	
	.hero-title a:hover,
	.hero-title a:active {
		color: #000;
	}

/* Controls --------------------------*/

	.hero-controls {
		bottom: 5px;
		left: 10px;
		position: absolute;	
		z-index: 4;
	}
	
	.hero-controls ul {
		margin: 0;
		overflow: hidden;
		padding: 0;
	}
	
	.hero-controls ul li {
		background: none;
		float: left;
		list-style: none;
		margin: 0 5px;
		padding: 0;
	}
	
	.hero-controls ul li a:link,
	.hero-controls ul li a:visited {
		color: #999;
		margin: 0;
		padding: 0;
		text-decoration: none;
	}
	
	.hero-controls ul li a:hover,
	.hero-controls ul li a:active {
		color: #000;
	}
	
	.hero-controls ul li.hero-prev a,
	.hero-controls ul li.hero-next a{
		display: block;
		height: 20px;
		text-indent: -9999px;
		width: 20px;
	}
	.hero-controls ul li.hero-prev a{
		background: url("images/hero-arrow-prev.png") no-repeat scroll 0 0;
	}
	
	.hero-controls ul li.hero-next a{
		background: url("images/hero-arrow-next.png") no-repeat scroll 0 0;
	}