.jcarousel-skin-tango .jcarousel-container {
	/*-moz-border-radius: 10px;*/
	background: #FFFFFF;
	/*border: 1px solid #666;*/ /* styles for the silder div, border, background color, rounded, etc.*/
}
.jcarousel-skin-tango .jcarousel-item {
    width: 60px; /* NOTE:this width and height should be equal to thumbnail image width and height*/
    height: 60px;
	cursor: pointer;
}
.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}
/*===================horizontal format styles=================================*/
.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 480px; /* NOTE: this should the number of thumbs times their width plus the space between each of thumbs i.e. (for my example: 44px x 6 plus 10px x 5.*/
    padding: 10px 32px; /*NOTE:padding top and sides of the slider div. The 32px accomodates the background next/previous arrow images*/
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  480px; /* NOTE: this should the number of thumbs times their width plus the space between each of thumbs i.e. (44px x 6) + (10px x 5)*/
    height: 60px; /* NOTE: set to height of thumbnails*/
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
    margin-right: 10px; /* NOTE: space between the thumbnails, if you change this then change the math above for the container and clip */
}


/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
	position: absolute;
	top: 22px;
	right: 0px;
	width: 32px; /* if you change the next and previous images size then this must change too*/
	height: 32px;
	cursor: pointer;
	background: transparent url(../images/next.gif) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
   background-position: -32px 0;/* if you change the next image size then the position for all states here and below must change too*/
}

.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}

.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 22px;
    left: 0px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(../images/previous.gif) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
   background-position: -32px 0;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
/*    background-position: -64px 0;*/
}

.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;

}
/* =================== code for vertical styles ==================================*/

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 75px;
    height: 245px;
    padding: 40px 20px;
}
.jcarousel-skin-tango .jcarousel-clip-vertical {
    width:  75px;
    height: 245px;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 10px;
}

/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(../../../KD-DESIGN/JavaScript-class/slider-FINAL/tango-assets/next-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-next-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(../../../KD-DESIGN/JavaScript-class/slider-FINAL/tango-assets/prev-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:hover {
/*    background-position: 0 -32px;*/
}

.jcarousel-skin-tango .jcarousel-prev-vertical:active {
/*    background-position: 0 -64px;*/
}

.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}
