.hero {
	width: 100%;
	position: relative;
	overflow: hidden;
	/*margin-bottom: 48px;*/
	}
	
	.hero-carousel article {
		width: 980px;
		margin: 0 auto;
		height: 420px;
		display: block;
		float: left;
		position: relative;
		}
				
	.hero-carousel-container article {
		float: left;
		}
		
		.hero-carousel article div {
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			z-index: 2;
			background: rgba(47,49,51,0.8);
		}
		
		.hero-carousel article.current div {
			display: none;
		}
	
		.hero-carousel article img{
			position: absolute;
			top: 0;
			left: 0;
			z-index: 1;
			}
	
		.hero-carousel-nav {
			margin-top: 200px;
			width: 100%;
			position: absolute;
			z-index: 3;
			}
			
			.hero-carousel-nav li {
				position: absolute;
				cursor: pointer;
				width: 100px;
				height: 100px;
				}
				
			.hero-carousel-nav li.prev {
				left: 25px;
				}
			.hero-carousel-nav li.next {
				right: 25px;
				}
				
			.hero-carousel-nav li.prev a {
				display: block;
				width: 100%;
				height: 100%;
				background: url(../img/frecetta-left.png);
				}
			
			.hero-carousel-nav li.next a {
				display: block;
				width: 100%;
				height: 100%;
				background: url(../img/frecetta-right.png);
				}
				
.mask-left,
.mask-right {
  width: 9999px;
  height: 420px;
  position: absolute;
  z-index: 2;
}
.mask-left .mask,
.mask-right .mask {
  background: black;
  filter: alpha(opacity=80);
  -moz-opacity: 0.80;
  -khtml-opacity: 0.80;
  opacity: 0.80;
  display: block;
  width: 100%;
  height: 100%;
  -webkit-transition: opacity 0.3s;
  -moz-transition: opacity 0.3s;
  -o-transition: opacity 0.3s;
  transition: opacity 0.3s;
}