Nivo 7 JQuery Slider Compressing by about 15% after first image - image

Question

I would really appreciate some help with a problem I am having with the Nivo 7 JQuery image slider.
-My website is responsive and I have separate stylesheets for phone and desktop
-The slider works beautifully on the phone version and the problem occurs on the desktop version of my site
*Problem:*Slider compresses by about 15% after the first image, and stays this way throughout all other images, even when it hits the first image again. The images are all the same dimensions (I have checked numerous times). It's not a sizing problem, the slider simply covers up the bottom 15% of the images after the first image that appears. I have copied all of the code and attached the relevant stylsheets as directed on the nivo 7 site.
What I don't understand is that it works perfectly in my the phone version of my site, but not the desktop. The only difference between phone and desktop is the layout. On the desktop, I have put a div wrapper around the slider to limit the width to 59% and height as auto. The #home1 section simply states that the width is 100%. Below is the code:
<div id="homeWrapper">
<section id="home1">
<div class="slider-wrapper theme-light">
<div id="slider" class="nivoSlider">
<img src="pictures/home/MindBodySoulCafe.jpg" width="470" height="303" alt="Mind, Body, Soul project Cafe perspective">
<img src="pictures/home/MindBodySoulCAD.jpg" width="470" height="303" alt="floor plan of Mind, Body & Soul">
<img src="pictures/home/barkmaterials.jpg" width="470" height="303" alt="Materials used for Bark Media Project">
<img src="pictures/home/modelstairs.jpg" width="470" height="303" alt="Construction model for staircase">
</div>
</div>
<script type="text/javascript">
$(window).load(function() {
$('#slider').nivoSlider({
effect: 'slideInLeft',
pauseTime: 4000,
pauseOnHover: true,
startSlide: 0,
});
});
</script>
</section>
</div>
Unfortunately I don't have access to the css files at this time.