#mySlideshow {
width : 350px;
height : 300px;
z-index : 5;
}
.jdSlideshow {
display : none;
overflow : hidden;
position : relative;
}
.jdSlideshow img {
border : 0;
margin : 0;
}
.jdSlideshow .slideElement {
width : 100%;
height : 100%;
background-color : #fff;
background-repeat : no-repeat;
}
.jdSlideshow .loadingElement {
width : 100%;
height : 100%;
position : absolute;
left : 0;
top : 0;
background-color : #fff;
background-repeat : no-repeat;
background-position : center center;
background-image : url('img/loading-bar-black.gif');
}
.jdSlideshow .slideInfoZone {
position : absolute;
z-index : 10;
width : 100%;
margin : 0;
left : 0;
bottom : 0;
height : 40px;
background : #333;
color : #fff;
text-indent : 0;
}
.jdSlideshow .slideInfoZone h2 {
padding : 0;
font-size : 80%;
margin : 0;
margin : 2px 5px;
font-weight : bold;
color : inherit;
}
.jdSlideshow .slideInfoZone p {
padding : 0;
font-size : 60%;
margin : 2px 5px;
color : #eee;
}
.jdSlideshow a {
font-size : 100%;
text-decoration : none;
color : inherit;
}
.jdSlideshow a.right, .jdSlideshow a.left {
position : absolute;
height : 100%;
width : 40%;
cursor : pointer;
z-index : 10;
}
.jdSlideshow a.left {
left : 0;
top : 0;
background : url('img/fleche1.png') no-repeat top left;
}
* html .jdSlideshow a.left {
background : url('img/fleche1.gif') no-repeat top left;
}
.jdSlideshow a.right {
right : 0;
top : 0;
background : url('img/fleche2.png') no-repeat top right;
}
* html .jdSlideshow a.right {
background : url('img/fleche2.gif') no-repeat top right;
}