.hero {

	width: 100%;

	position: relative;

	overflow: hidden;

	}

	


		
		
		
	

				
	.hero-carousel article {
	opacity:1.0;
	margin: 0 auto;

		display: block;

		float: left; 

		position: relative;

		}
	.hero-carousel article.current {

		margin: 0 auto;

		display: block;

		float: left;

		position: relative;
		opacity:1 !important;

		}

	

		.hero-carousel article img {

			position: absolute; 

			top: 0;

			left: 10%; 
		/*	margin-left:-50%;*/
		/*	transform:translateX(-50%);*/
			z-index: 1;

			width:100%;
			;

			}

			

		.hero-carousel article .contents {

			position: absolute;

			z-index: 0;

			bottom:60px;

			left: 25px;

			list-style: none;

			color: #000;

			padding: 30px;

			background:url(../images/hero-caption-bg.png) repeat;

			color:#ffffff;

			font-size:20px;

			line-height:26px;

			font-family: 'bebas_neueregular';

			font-style:normal;

			}

		

		.hero-carousel article .contents h2 {

			color:#ffde00;

			font-size:60px;

			line-height:60px;

			font-family: 'bebas_neueregular';

			font-style:normal;

			}

			

		.hero-carousel article .contents p {

			color:#ffffff;

			font-size:20px;

			line-height:26px;

			font-family: 'bebas_neueregular';

			font-style:normal;

			}

	

		.hero-carousel-nav {

			position: absolute;

			bottom: 20px;

			z-index: 3;

			margin:0;

			padding:0;

			list-style-type:none;

			}

			

			.hero-carousel-nav li {

				float:left;

				padding-left:2px;

				}

				

			.hero-carousel-nav li.prev a {

				background-position:0px 0px;

				background-color:#181818;

				}

			

			.hero-carousel-nav li.next a {

				background-position:-27px 0px;

				background-color:#181818;

				}

				

			.hero-carousel-nav li a {

				background-image:url(../images/hero-controls.png);

				width:27px;

				height:24px;

				position:relative;

				text-indent:-9999px;

				display:block;

				-webkit-border-radius: 2px;

				-moz-border-radius: 2px;

				border-radius: 2px;

				}

			

			.hero-carousel-nav li.prev:hover a {

				background-color:#ffde00;

				-webkit-transition: background-color 0.1s linear;

				-moz-transition: background-color 0.1s linear;

				-ms-transition: background-color 0.1s linear;

				-o-transition: background-color 0.1s linear;

				transition: background-color 0.1s linear;

				}

			

			.hero-carousel-nav li.next:hover a {

				background-color:#ffde00;

				-webkit-transition: background-color 0.1s linear;

				-moz-transition: background-color 0.1s linear;

				-ms-transition: background-color 0.1s linear;

				-o-transition: background-color 0.1s linear;

				transition: background-color 0.1s linear;

				}

				

			.hero-carousel-nav li a:active,

			.hero-carousel-nav li a:focus { 

				border: none;

				outline: none;

				}

				

@media (min-width: 1280px) { 

	.hero-carousel-container article {

		width:1172px;

		}

}

@media (min-width: 1152px) and (max-width: 1279px) { 

	.hero-carousel-container article {

		width:1044px;

		}

}

@media (min-width: 1024px) and (max-width: 1151px) { 

	.hero-carousel-container article {

		width:916px;

		}

}

@media (min-width: 980px) and (max-width: 1023px) { 

	.hero-carousel-container article {

		width:772px;

		}

}

@media (min-width: 768px) and (max-width: 979px) { 

	.hero-carousel-container article {

		width:748px;

		}

}

@media (max-width: 767px) { 

	.hero-carousel-container article {

		width:460px;

		}

}

@media (max-width: 320px) { 

	.hero-carousel-container article {

		width:300px;

		}

}