I have one of my moving elements (second.bg - aka "trainers.jpg") at the moment, the position of the element is at the very top of the relative page, I can move it horizontally by changing the horizontal percentage below in the HTML
Code:
$('.bg').parallax("27%", 0.4);
but I need to change the vertical position, and I can't figure out how to do that.

Under the CSS sheet, I can change the vertical position of the text boxes by changing my padding
Code:
.story .float-left, .story .float-right{
	padding: 420px 0 0 0;
This is what I have under my CSS to change the position of the trainers.jpg image

Code:
#second .bg{
	background: url(images/trainers.png) 50% 0 no-repeat fixed;
	height: 1300px;
	margin: 0 auto;
	padding: 220px 0 0 0;
	position: absolute;
	width: 900px;
	z-index: 100px;
Help? I just need to make it vertically LOWER
Here is the full HTML & CSS

Code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jQuery Parallax Plugin Demo</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="scripts/jquery.parallax-1.1.3.js"></script>
<script type="text/javascript" src="scripts/jquery.localscroll-1.2.7-min.js"></script>
<script type="text/javascript" src="scripts/jquery.scrollTo-1.4.2-min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$('#nav').localScroll(800);
	
	//.parallax(xPosition, speedFactor, outerHeight) options:
	//xPosition - Horizontal position of the element
	//inertia - speed to move relative to vertical scroll. Example: 0.1 is one tenth the speed of scrolling, 2 is twice the speed of scrolling
	//outerHeight (true/false) - Whether or not jQuery should use it's outerHeight option to determine when a section is in the viewport
	$('#intro').parallax("50%", 0.1);
	$('#second').parallax("50%", 0.2);
	$('.bg').parallax("27%", 0.4);
	$('#third').parallax("50%", 0.3);

})
</script>
</head>

<body>
	<ul id="nav">
		<li><a href="#intro" title="Next Section"><img src="images/dot.png" alt="Link" /></a></li>
	    <li><a href="#second" title="Next Section"><img src="images/dot.png" alt="Link" /></a></li>
	    <li><a href="#third" title="Next Section"><img src="images/dot.png" alt="Link" /></a></li>
	    <li><a href="#fifth" title="Next Section"><img src="images/dot.png" alt="Link" /></a></li>
	</ul>
	
	<div id="intro">
		<div class="story">
	    	<div class="float-left">
			<h2>Chlo Alpert</h2>
	        <p>BA (Honours) Design Communication, FGA, DG.</p>
	        </div>
	    </div> <!--.story-->
	</div> <!--#intro-->
	
	<div id="second">
		<div class="story"><div class="bg"></div>
	    	<div class="float-right">
	            <h2>About</h2>
	            <p>Originally from State College,PA, educated in
		  England, UK, and now based in San Francisco, CA. My
		  passions are in business, technology,
		  entrepreneurship, and mineralogy.    </p>
	
	        </div>
	    </div> <!--.story-->
	    
	</div> <!--#second-->
	
	<div id="third">
		<div class="story">
	    	<div class="float-left">
	        	<h2>Education</h2>
	            <p>The user gets a slap! Actually, all that jQuery does is moves the backgrounds relative to the position of the scrollbar. Without it, the backgrounds simply stay put and the user would never know they are missing out on the awesome! CSS2 does a good enough job to still make the effect look cool.</p>
	        </div>
	    </div> <!--.story-->
	</div> <!--#third-->
	
	<div id="fifth">
		<div class="story">
		    <p>Check out my new plugin <a href="http://www.sequencejs.com" title="Sequence.js">Sequence.js</a> for parallax effects and a whole lot more!</p>
	        
	        <h2>Chlo Alpert</h2>
	        <ul>
	            <li><strong>Twitter</strong>: <a href="http://www.twitter.com/chloealpert" title="Follow Chloe on Twitter">@chloealpert</a></li>
	            <li><strong>Blog</strong>: <a
	        href="http://www.chloealpert.tumblr.com/"
	        title="Follow Chloe on Tumblr">Blog</a></li>
	            <li><strong>Website</strong>: <a
	        href="http://www.chloealpert.com" title="Chloe Alpert">www.chloealpert.comk</a></li>
	        </ul>
	        
	        <p>This demo is based on the <a href="http://www.nikebetterworld.com" title="Nike Better World">Nikebetterworld.com</a> website.</p>
	        
	        <ul>

</body>
</html>
& CSS

Code:
/* CSS Document */

body{
	margin: 0;
	min-width: 980px;
	padding: 0;
}

p{
	margin: 0 0 20px 0;	
}

p, ul{
	font-family:"Proxima Nova Light", 'Helvetica Neue', Arial, Helvetica, sans-serif;
	font-size-adjust:0.488;
	font-weight:100;
	font-style:normal;
}

img{
	border: 0;
}

h1, #pixels{
	font-family:"Times 900", Verdana, serif;
	font-size-adjust:0.40;
	font-weight:700;
	font-style:normal;
}

h2{
	font-family:"Beau Sans Pro Book", Verdana, sans-serif;
	font-size-adjust:0.531;
	font-weight:500;
	font-style:normal;
}

#header h1, #pixels{
	color: #48941A;
}

.float-left{
	float: left;	
	margin: 0 0 0 20px;
}

.float-right{
	float: right;
	margin: 0 20px 0 0;
}

.center{
	font-size: 2.5em;
	padding: 80px 0 0 0;
	text-align: center;
}

#nav{
	list-style: none;
	position: fixed;
	right: 20px;
}

#nav li{
	margin: 0 0 15px 0;	
}

#header, #intro, #second{
	width: 100%;
}

#intro{
	background:url(images/a.jpg) 100% 0 no-repeat fixed;
	color: white;
	height: 780px;
	margin: 0 auto;
	padding: 0;
}

#second{
	background: url(images/secondBG.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 1300px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
}

#second .bg{
	background: url(images/trainers.png) 50% 0 no-repeat fixed;
	height: 1300px;
	margin: 0 auto;
	padding: 220px 0 0 0;
	position: absolute;
	width: 900px;
	z-index: 100px;
}

#third{
	background: url(images/thirdBG.jpg) 50% 0 no-repeat fixed;
	color: white;
	height: 650px;
	padding: 100px 0 0 0;	
}

#fifth{
	background: #ccc;
	height: 400px;
	margin: 0 auto;
	padding: 40px 0 0 0;
}

.story{
	margin: 0 auto;
	min-width: 480px;
	overflow: auto;
	width: 980px;
}

.story .float-left, .story .float-right{
	padding: 420px 0 0 0;
	position: relative;
	width: 620px;	
}