#viewarea1{border:0px solid #000000;margin:0px auto;padding:0px;width:100%; max-width:100%;display:block;position:relative;}
/* buttons */
#viewarea1 .direction-nav a {width:20px;height:30px;display:block;position:absolute;margin-top:-32px;cursor: pointer;text-indent: -9999px;z-index: 100;top:45%;border:0px solid #ddd;}
#viewarea1 .direction-nav  .btnLeft {float:left;left:0;z-index:1;}
#viewarea1 .direction-nav  .btnLeft img{max-width:100%; width:100%;}
#viewarea1 .direction-nav  .btnRight {float:right;right:0;z-index:1;}
#viewarea1 .direction-nav  .btnRight img{max-width:100%; width:100%;}
#viewarea1 .prev {float:left; position:relative;cursor:hand;margin:0px 0px 0 0;z-index:1;}
#viewarea1 .next {float:right; position:relative;cursor:hand;margin:0px 0px 0 0;right:0px;z-index:1;}
#viewarea1 .next:hover, .carousel .next:active,
.prev:hover, .carousel .prev:active{border: none;outline: none;}  



#viewarea1 .carousel  {padding:20px 0 0;margin:0px auto;position:relative;border:0px solid #ff6600;margin-left:-5000px;margin-right:-5000px;display:block;overflow:hidden;}
#viewarea1 .carousel .noimage {background: url('../img/noimage.png') no-repeat center; border:0px solid #000000;}
  
			
/* frame background */
#viewarea1 .carousel .jCarouselLiteCommon {margin:0px auto;display:block;

/* Needed for rendering without flicker */position: relative;visibility: hidden;left: -5000px;right: -5000px;padding:0px;border:0px solid #000000;}


#viewarea1 .carousel ul {margin:0px;padding:0px;border:0px solid #000;}
		


/* image size */
#viewarea1 .carousel li {overflow:hidden;padding:7px;margin:0 2px;float:left;display:block;list-style:none;border:0px solid #ddd;}
#viewarea1 .carousel li img{border:0px solid #dddddd !important;margin:0px;}

#viewarea1 .carousel .bannertitle{overflow: visible;cursor: hand;text-align: center;position:relative;clear:both;border:0px solid #000;margin-top:0px;color:#555; font-weight:500; font-size:16px;padding:20px 0px;background:#fff; letter-spacing:-1px;}


.carousel a,
.carousel a:hover, 
.carousel a:active,
.carousel a:visited{text-decoration: none;}  



.carousel .item {
    overflow: hidden;
    position: relative;
    z-index: 1;
    width: 100%;
	border:0px solid #ddd;
	box-sizing:border-box;
	padding:5%;
    background-attachment: fixed;
	background-size:cover;
	-webkit-transition:all 1s;
	-moz-transition:all 1s;
	-o-transition:all 1s;
	-ms-transition:all 1s;
	transition:all 1s;

}

.carousel .item::before{
  content:"";
  position:absolute; top:0;right:0;bottom:0;left:0;
  background:inherit;
  transition:inherit;
}



.carousel .item:hover::before{
 transform: scale(1.2);
}