Vorrei riuscire a capire come agire sui bottoni NEXT. e PREV.
Di questi sono riuscito solamente a cambiare lo stile del carattere tramite "gallery a" ma non riesco a modificarne la posizione.
Questi sono i codici che riguardano lo script:

<script type="text/javascript" src="JS/easySlider/easySlider/js/easySlider.js"></script>
<script type="text/javascript">
$(document).ready(function(){

$("#slider").easySlider({
prevText: 'Previous Slide',
prevId: 'prevBut',
nextText: 'Next Slide',
nextId: 'nextBut',
orientation: 'horizontal'


});

$("#slider2").easySlider({
prevText: 'Previous Slide',
prevId: 'prevBut2',
nextText: 'Next Slide',
nextId: 'nextBut2',

});



$("#slider3").easySlider({
prevText: 'Previous Slide',
prevId: 'prevBut2',
nextText: 'Next Slide',
nextId: 'nextBut2',

});
});

</script>



<style type="text/css">
/* jQuery lightBox plugin - Gallery style */
#gallery{
margin:250px 0 0 0;
width:100%;
height:3000px;
text-decoration:none
}

#gallery a{
font-family:Arial, Helvetica, sans-serif;
color:#FFF;
text-decoration:none;
}

#gallery ul {
list-style: none;
padding:100px 0 0 50px;
margin:0 0 50px 0
}
#gallery ul li {
display: inline;
}
#gallery ul img {
margin:0 auto;
border: 5px solid #3e3e3e;
border-width:0;
}
#gallery ul a:hover img {
border: 1px solid none;
border-width:0;
color: #fff;
}
#gallery ul a:hover { color: #fff;
}

</style>


------------------------------------------------------------------------



#slider ul, #slider li{
margin:0;
padding:0;
list-style:none;
}
#slider, #slider li{

width:900px;
height:500px;
overflow:hidden;
}
span#prevBtn{}
span#nextBtn{}




#slider2 ul, #slider2 li{
margin:0;
padding:0;
list-style:none;
}
#slider2, #slider2 li{

width:900px;
height:500px;
overflow:hidden;
}
span#prevBtn{}
span#nextBtn{}





#slider3 ul, #slider3 li{
margin:0;
padding:0;
list-style:none;
}
#slider3, #slider3 li{

width:900px;
height:500px;
overflow:hidden;
}
span#prevBtn{}
span#nextBtn{}