/******************carousel**********************/
#carousel{position:relative;}
	#carousel .es-carousel{width:100%; overflow:hidden;}
		#carousel li{float:left; position:relative;}
		#carousel li a{
			display:block;
			width:100%;
			height:100%;
			text-decoration:none;
			position:relative;
			overflow:hidden;
		}
		#carousel li span{
			position:absolute;
			top:-100%;
			left:0;
			display:block;
			width:100%;
			font:400 18px/22px 'Boogaloo', cursive;
			color:#fff;
			text-align:center;
			text-shadow:0 1px 3px #000;
			background:url(../images/carousel-hover.png) 0 0 repeat;
			border-radius:6px;
			padding:29px 0;
		}
			#carousel li:hover span{top:0;}
#carousel .es-nav-prev, #carousel .es-nav-next{
	display:block !important;
	width:36px;
	height:36px;
	overflow:hidden;
	background-position:center top;
	background-repeat:no-repeat;
	position:absolute;
	top:1px;
	text-indent: -100%;
	font-size:0;
	line-height:0;
	white-space: nowrap;
	cursor:pointer;
	z-index:996;
}
#carousel .es-nav-prev{background-image:url(../images/carousel-prev.png); left:-1px;}
#carousel .es-nav-next{background-image:url(../images/carousel-next.png); right:1px;}
	#carousel .es-nav-prev:hover, #carousel .es-nav-next:hover{background-position:0 -52px;}

/*-------------------------------------------------------------------*/

@media only screen and (min-width: 768px) and (max-width: 995px) {
	#carousel li{width:172px !important;}
	#carousel li span{padding:20px 0 21px;}
}

@media only screen and (max-width: 767px) {
	#carousel li span{padding:25px 0 26px;}
}

@media only screen and (max-width: 479px) {
	#carousel li span{font-size:14px; line-height:17px; padding:17px 0;}
}