/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    width: 180px;
    margin-right: 10px;
    display: block;

    /* We set the width/height explicitly. No width/height causes infinite loops. */
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}


/*.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 245px;
    padding: 20px 40px;
}
*/
/*.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  245px;
    height: 330px;
}
*/

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}








/**
 *  Horizontal Buttons
 */

.jcarousel-skin-tango .jcarousel-prev-horizontal,
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    width: 180px;
    height: 302px;
}
.jcarousel-skin-tango .jcarousel-next-horizontal{
    right: 10px;
}
.jcarousel-skin-tango .jcarousel-prev-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-horizontal:hover{
    cursor: pointer;
    filter: alpha(opacity=50);
    background-color: #c2c1c1;
    background-color: rgba(194,193,193, 0.5);
    background-position: 50px 110px;
    background-image: url('../images/slider-left.png');
    background-repeat: no-repeat;

}
.jcarousel-skin-tango .jcarousel-next-horizontal:hover{
    background-image: url('../images/slider-right.png');
}
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal{
    display: none !important;
}





.jcarousel-pager-container:after {
  content: "";
  clear: both;
  display: block;
  height: 0;
  line-height: 0;
  visibility: hidden;
}

#carousel{
  width: 570px;
}

#carousel .jcarousel-pager-container ul {
  list-style-type: none;
  margin: 10px 0 0 0;
  padding: 0;
}

#carousel .jcarousel-pager-container li {
  float: left;
  margin-right: 8px;
}

.jcarousel-pager-container{
  margin: 0 auto;
  width: 182px;
}


.jcarousel-pager-container {
  text-align: center;
  height: 80px;
}
.jcarousel-pager-container a {
  display: inline-block;
  *display: inline;
  zoom: 1;
  border: 1px solid #b8b8b8;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  margin-bottom: 10px;
  width: 20px;
  height: 60px;
  position: relative;
  background-color: #e8e8e8;
  background-image: -moz-linear-gradient(top, #f7f7f7, #d1d1d1);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#f7f7f7), to(#d1d1d1));
  background-image: -webkit-linear-gradient(top, #f7f7f7, #d1d1d1);
  background-image: -o-linear-gradient(top, #f7f7f7, #d1d1d1);
  background-image: linear-gradient(to bottom, #f7f7f7, #d1d1d1);
  background-repeat: repeat-x;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff7f7f7', endColorstr='#ffd1d1d1', GradientType=0);
  -webkit-box-shadow: inset 1px -1px #e8e8e8;
  -moz-box-shadow: inset 1px -1px #e8e8e8;
  box-shadow: inset 1px -1px #e8e8e8;
}
.jcarousel-pager-container a:active,
.jcarousel-pager-container a:focus{
  outline: none;
}
.jcarousel-pager-container a:hover,
.jcarousel-pager-container a.visible:hover {
  background: #fff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  filter: ;
}
.jcarousel-pager-container a:hover:before,
.jcarousel-pager-container a.visible:hover:before {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 6px solid #a8a8a8;
  position: absolute;
  left: 0;
  bottom: -7px;
}
.jcarousel-pager-container a:hover:after,
.jcarousel-pager-container a.visible:hover:after {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 6px solid #fff;
  position: absolute;
  left: 0px;
  bottom: -6px;
}
.jcarousel-pager-container a.active {
  border: 2px solid #090;
  background: #fff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  filter: ;
}
.jcarousel-pager-container a.active:hover {
  cursor: default;
}
.jcarousel-pager-container a.active:before {
  content: "";
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-top: 6px solid #090;
  position: absolute;
  left: -2px;
  bottom: -7px;
}
.jcarousel-pager-container a.active:after {
  content: "";
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 5px solid #fff;
  position: absolute;
  left: 0px;
  bottom: -5px;
}
.jcarousel-pager-container a.visible {
  background: #fff;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
}
.jcarousel-pager-container .bar10 {
  height: 22px;
  margin-top: 38px;
}
.jcarousel-pager-container .bar20 {
  height: 27px;
  margin-top: 33px;
}
.jcarousel-pager-container .bar30 {
  height: 32px;
  margin-top: 28px;
}
.jcarousel-pager-container .bar40 {
  height: 37px;
  margin-top: 23px;
}
.jcarousel-pager-container .bar50 {
  height: 42px;
  margin-top: 18px;
}
.jcarousel-pager-container .bar60 {
  height: 47px;
  margin-top: 13px;
}
.jcarousel-pager-container .bar70 {
  height: 52px;
  margin-top: 8px;
}