	
	#carousel-image-and-text {
		width: 1100px;
		height: 120px;
		margin: 0 auto;
		padding-top: 10px;

	}	
	#carousel-image-and-text .arrow-holder {
		height: 120px;
	}		
	#carousel-image-and-text .touchcarousel-item {
		margin-right: 1px;	
		width: 202px;
		height: 120px;		
	}
	#carousel-image-and-text .item-block {
		width: 202px;
		height: 110px;
		display: block;
	}
	#carousel-image-and-text .item-block img,
	#carousel-image-and-text .item-block h4, 
	#carousel-image-and-text .item-block p {
		float: left;
		position: relative;
		display: block;
		margin: 0;	
	}
	#carousel-image-and-text .item-block img {
		width: 202px;
		height: 110px;		
		border: 0;
		padding: 0;		
	}
	#carousel-image-and-text .item-block {			
		text-decoration: none;
		color: inherit;			
	}					
	#carousel-image-and-text .item-block h4 {
		font-family: Calibri, Arial, Tahoma, Verdana, 'Roboto', sans-serif;
        font-weight:500;
        font-size:18px;
		color: #000;
		width: 100%;
		height: auto;		
		padding: 10px 0 10px 0;
		-webkit-transition: color 0.2s ease-out; 
		-moz-transition: color 0.2s ease-out;
		transition: color 0.2s ease-out;  	
	}
	#carousel-image-and-text .item-block:hover h4 {	
		color: #1873c9;		
	}
	#carousel-image-and-text .item-block p {			
		font-family: Calibri, Arial, Tahoma, Verdana, 'Roboto', sans-serif;
		color: #555;		
		width: 158px;
		padding: 0 0 0 6px;
	}
	#carousel-image-and-text .scrollbar-holder {
		display:none;
		background: #CED7DB;
		bottom: 0;
		height: 1px;
		left: 0;
		right: 0;

	}
	#carousel-image-and-text .scrollbar {
		background-color: #45a8ce !important;
		bottom: 0;
		display:none;
	}		



/******************************************************\
*
*  1. Main containers (carousel size, background)
*
\******************************************************/

.touchcarousel {
position: relative;
width: 600px;
height: 400px;		

/* style is removed after carousel is inited, use !important if you want to keep it*/
overflow: hidden; 
}

.touchcarousel .touchcarousel-container {
position: relative;    
    margin: 0;
    padding: 0;
    list-style: none;    
left: 0;
}

.touchcarousel .touchcarousel-wrapper {
position: relative;
overflow:hidden;
width: 100%;
height: 100%;
}





/******************************************************\
*
*  2. Carousel items (item styling, spacing between items)
*
\******************************************************/

.touchcarousel .touchcarousel-item {
/* use margin-right for spacing between items */
margin-left: 9px;
margin-right: 9px !important;
padding: 0;	
float: left;		
}

/* Last carousel item  */
.touchcarousel .touchcarousel-item.last {
margin-right: 0 !important;		
}

/******************************************************\
*
*  3. Arrows(direction) navigation
*
\******************************************************/

/* arrow hitstate and icon holder */
.touchcarousel .arrow-holder {
height: 100%;
width: 45px;
position: absolute;
top: 0;
display: block;
cursor: pointer;	
z-index: 25;	
}

.touchcarousel .arrow-holder.left {	
left: 0;	
}

.touchcarousel .arrow-holder.right {	
right: 0;
}

/* arrow icons */
.touchcarousel .arrow-icon{		
width: 45px;
height: 90px;
top:50%;
margin-top:-45px;	
position: absolute;	
cursor: pointer;	
}

.touchcarousel .arrow-icon.left { }

.touchcarousel .arrow-icon.right { }

.touchcarousel .arrow-holder:hover .arrow-icon { }

.touchcarousel .arrow-holder.disabled { cursor: default; }

.touchcarousel .arrow-holder.disabled .arrow-icon { cursor: default; }





/******************************************************\
*
*  4. Paging navigation
*
\******************************************************/

.touchcarousel .tc-paging-container {
width:100%;
overflow:hidden;
position:absolute;
margin-top:-20px;
z-index:25;
}

.touchcarousel .tc-paging-centerer {	
float: left;
position: relative;
left: 50%;		
}

.touchcarousel .tc-paging-centerer-inside {
float: left;
position: relative;
left: -50%;
}

/* Paging items */
.touchcarousel .tc-paging-item {			
float:left;	
cursor:pointer;		
position:relative;
display:block;	
text-indent: -9999px;	
}

.touchcarousel .tc-paging-item.current { }

.touchcarousel .tc-paging-item:hover { }


/******************************************************\
*
*  5. Scrollbar
*
\******************************************************/
.touchcarousel .scrollbar-holder {
position: absolute;
z-index: 30;
left: 6px;
right: 6px;	
bottom: 5px;
height:4px;
overflow: hidden;
}

.touchcarousel .scrollbar {
position: absolute;
left:0;	
height:4px;
bottom: 0px;
}

.touchcarousel .scrollbar.dark {
background-color: rgb(130, 130, 130);	
background-color: rgba(0, 0, 0, 0.5);
}

.touchcarousel .scrollbar.light {
background-color: rgb(210, 210, 210);	
background-color: rgba(255, 255, 255, 0.5);	
}

/******************************************************\
*
*  6. Cursors
*
\******************************************************/

/* IE and Opera use "move", FF uses -moz-grab */
.touchcarousel .grab-cursor{ cursor:url(../_touchcarousel/grab.png) 8 8, move; }

.touchcarousel .grabbing-cursor{ cursor:url(../_touchcarousel/grabbing.png) 8 8, move; }

/* Cursor that used when mouse drag is disabled */
.touchcarousel .auto-cursor{ cursor:auto; }




.touchcarousel.grey-blue .arrow-icon {	
background-image: url('../_touchcarousel/sprite.png');
background-repeat: no-repeat;
width: 11px;
height: 19px;	
margin-top: -9px;
}

.touchcarousel.grey-blue .arrow-holder {
width: 19px;
height: 100%;
-moz-opacity: 1;	
-webkit-opacity: 1;	
opacity: 1;	
}

.touchcarousel.grey-blue .arrow-holder.left {
left: -20px;
}

.touchcarousel.grey-blue .arrow-holder.right {	
right: -20px;
}

.touchcarousel.grey-blue .arrow-icon.left {
left: 0;
background-position: -6px -15px !important;
top:54%;
}

.touchcarousel.grey-blue .arrow-icon.right {
right: 0;
background-position: -186px -15px !important;
top:54%;
}

.touchcarousel.grey-blue .arrow-holder:hover .arrow-icon.left {
background-position: -36px -15px;
}

.touchcarousel.grey-blue .arrow-holder:hover .arrow-icon.right {
background-position: -156px -15px;
}

.touchcarousel.grey-blue .arrow-holder.disabled .arrow-icon.left {
background-position: -66px -15px;
}

.touchcarousel.grey-blue .arrow-holder.disabled .arrow-icon.right {
background-position: -126px -15px;
}

.touchcarousel.grey-blue .arrow-holder:hover {
-moz-opacity: 1;	
-webkit-opacity: 1;	
opacity: 1;	
}

.touchcarousel.grey-blue .arrow-holder:active .arrow-icon {
margin-top: -8px;
}

.touchcarousel.grey-blue .arrow-holder.disabled {
-moz-opacity: 1;	
-webkit-opacity: 1;	
opacity: 1;	
}

/******************************************************\
*
*  2. Paging navigation
*
\******************************************************/

.touchcarousel.grey-blue .tc-paging-item {
background: url('../_touchcarousel/sprite.png') no-repeat -95px -4px;

width: 16px;
height: 16px;	

-moz-opacity: 0.8;	
-webkit-opacity: 0.8;	
opacity: 0.8;	
}

.touchcarousel.grey-blue .tc-paging-item.current {	
background: url('../_touchcarousel/sprite.png') no-repeat -95px -22px;
}

.touchcarousel.grey-blue .tc-paging-item:hover {		
-moz-opacity: 1;	
-webkit-opacity: 1;	
opacity: 1;		
}



