/*
  slideshow.css
  ==
  This is the essential CSS markup that is required for jSlide to work properly.
*/
div.showcase {
position: relative;
font-size:11px;
width: 400px;
margin-bottom: 20px;
}
div.showcase ul.indexwork a{
background:#cdeaf0;
-moz-border-radius:5px;
-webkit-border-radius:5px;
border-radius:5px;
padding:0px 5px;
margin-top:5px;
text-decoration: none;
}
div.showcase ul.indexwork a:hover{
color: #000;
}
div.showcase ul.layers {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
clear: both;
position: relative;
top: 0;
left: 0;
}
div.showcase ul.layers li {
float: left;
position: absolute;
}        
div.showcase ul.indexwork .active {
color: #fff;
text-decoration: none;
background:#2a3d78 !important;
} 
div.showcase ul.indexwork .active:hover {
color: #cdeaf0;
} 
.loading {
background: url(../images/ajax-loader.gif) no-repeat center !important;
}
div.showcase ul.indexwork {
margin: 0px;
padding: 0px;
float:right;
overflow:hidden;
}
div.showcase ul.indexwork li {
float: left;
padding: 0px 5px 0px 0px;
list-style: none;
margin-top:5px;
}
div.showcase a.prevwork, div.showcase a.nextwork{
position:absolute;
top:0px;
text-indent:-9999px;
display:block;
width:70px;
height:200px;
background:none;
}
div.showcase a.prevwork{
left:10px; 
}
div.showcase a.prevwork:hover{
background: url(../images/btn_prev.png) left center no-repeat;
}
div.showcase a.nextwork{
right:10px;
}
div.showcase a.nextwork:hover{
background: url(../images/btn_next.png) right center no-repeat;
}
div.showcase ul.layers, div.showcase ul.layers li {
width: 400px;
height: 250px;
}
div.showcase ul.layers li { margin-right:5px; }