/******************carousel page1, carousel page2, carousel page4**********************/
#carousel{
	position:relative;
	padding-right:4px;
}
	#carousel .es-carousel, #carousel2 .es-carousel{
		width:100%;
		height:180px;
		overflow:hidden;
	}
		#carousel li, #carousel1 li, #carousel2 li{float:left; position:relative;}
	#carousel .buttons, #carousel2 .buttons{
		position:absolute;
		left:0;
		bottom:-100%;
		width:100%;
		height:47px;
		overflow:hidden;
		font:800 12px/15px 'Open Sans', sans-serif;
		text-align:center;
		text-transform:uppercase;
	}
		#carousel .button1, #carousel2 .button1{
			float:left;
			display:block;
			width:107px;
			color:#fff;
			padding-right:1px;
			background:url(../images/carousel-button1-bg.png) right top no-repeat;
		}
		#carousel .button2, #carousel2 .button2{
			float:left;
			display:block;
			width:110px;
			color:#fff;
			padding-left:1px;
			background:url(../images/carousel-button2-bg.png) left top no-repeat;
		}
			#carousel .buttons span, #carousel2 .buttons span{
				display:block;
				width:100%;
				padding:18px 0 14px;
				background:url(../images/carousel-buttons-tail.png) center top repeat-x;
			}
			#carousel .buttons a:hover, #carousel2 .buttons a:hover{text-decoration:none; background-color:#151515;}
#carousel .es-nav-prev, #carousel1 .es-nav-prev, #carousel2 .es-nav-prev{
	display:block !important;
	width:31px;
	height:36px;
	overflow:hidden;
	position:absolute;
	top:-61px;
	right:30px;
	text-indent: 100%;
	white-space: nowrap;
	cursor:pointer;
	z-index:999;
	background:url(../images/carousel-prev.png) 0 -39px no-repeat;
}
#carousel .es-nav-next, #carousel1 .es-nav-next, #carousel2 .es-nav-next{
	display:block !important;
	width:30px;
	height:36px;
	overflow:hidden;
	position:absolute;
	top:-61px;
	right:0px;
	text-indent: 100%;
	white-space: nowrap;
	cursor:pointer;
	z-index:999;
	background:url(../images/carousel-next.png) 0 -39px no-repeat;
}
	#carousel .es-nav-prev:hover, #carousel .es-nav-next:hover,
	#carousel1 .es-nav-prev:hover, #carousel1 .es-nav-next:hover,
	#carousel2 .es-nav-prev:hover, #carousel2 .es-nav-next:hover{background-position:0 top;}

/******************carousel page2, carousel page4**********************/
#carousel1, #carousel2{position:relative;}
	#carousel1 .es-carousel{
	width: 100%;
	height: 181px;
	overflow: hidden;
	}
		#carousel1 li a{display:block; overflow:hidden; margin-bottom:2px;}
#carousel1 .es-nav-prev, #carousel1 .es-nav-next{top:-53px;}
/*-------------------------------------------------------------------*/

@media only screen and (max-width: 995px) {
	#carousel{padding-right:0px;}
	#carousel li, #carousel1 li, #carousel2 li {padding-right:15px;}
	#carousel .buttons, #carousel2 .buttons{width:219px;}
	#carousel .es-nav-prev, #carousel .es-nav-next,
	#carousel2 .es-nav-prev, #carousel2 .es-nav-next{top:-45px;}
}

@media only screen and (max-width: 767px) {
	#carousel li, #carousel1 li, #carousel2 li{padding-right:0px;}
	#carousel .es-carousel, #carousel2 .es-carousel{height:148px;}
	#carousel1 .es-carousel{height:296px;}
	#carousel .buttons, #carousel2 .buttons{width:180px; height:35px;}
	#carousel .buttons a, #carousel2 .buttons a{width:89px;}
	#carousel .buttons span, #carousel2 .buttons span{padding:10px 0;}
	#carousel1 .lightbox-image span{background-size:auto 80%;}
}

@media only screen and (max-width: 479px) {
	#carousel .es-carousel, #carousel2 .es-carousel{height:99px;}
	#carousel1 .es-carousel{height:198px;}
	#carousel .buttons, #carousel2 .buttons{display:none;}
}
