div.slider { position: relative; overflow: hidden; height: 385px; padding: 10px; } div.sliderinner { height: 375px; width: 5600px; position: absolute; } div.sliderinner div.largeimage { float: left; height: 375px; width: 560px; margin: 0 3px 0 0; -webkit-box-shadow: 0px 0px 40px #000; -moz-box-shadow: 0px 0px 40px #000; box-shadow: 0px 0px 40px #000; } div.sliderinner div.largeimage_off { float: left; opacity: .4; filter: alpha(opacity=40); height: 375px; width: 560px; margin: 0 3px 0 0; } div.slider span#nextbutton, div.slider span#backbutton { cursor: pointer; width: 41px; display: block; height: 54px; position: absolute; margin: 150px 20px 0 20px; z-index: 10; } div.slider span#nextbutton { right: 0; background-image: url(../art/slide_right.png); } div.slider span#nextbutton:hover { background-image: url(../art/slide_right_on.png); } div.slider span#backbutton { background-image: url(../art/slide_left.png); } div.slider span#backbutton:hover { background-image: url(../art/slide_left_on.png); } div.sliderinner div.largeimage span, div.sliderinner div.largeimage_off span { display: none; } div.thumbnails { text-align: center; padding: 6px; } ul.thumbs { list-style-type: none; margin: 0 auto; } ul.thumbs li { width: 50px; display: inline; cursor: pointer; } ul.thumbs li.sel img, ul.thumbs li.sel:hover img { border: 2px solid #ff0000; } ul.thumbs li img { border: 2px solid #333; } ul.thumbs li:hover img { border: 2px solid #F68B1F; } div.sliderinner div.desc_back { position: absolute; width: 560px; height: 120px; opacity: .8; filter: alpha(opacity=80); z-index: 20; margin-top: 304px; background-color: #eeece9; } div.sliderinner div.desc { position: absolute; text-align: left; width: 520px; margin-top: 304px; padding: 10px; height: 100px; z-index: 21; color: #333; text-align: center; font-size: 13px; line-height: 14px; } div.sliderinner div.desc span.title { font-size: 14px; display: block; letter-spacing: 2px; margin-bottom: 3px; line-height: 15px; color: #880123; }