#photo_slider{
	width: 430px;
}

		img { border: 0;}		
		
		a img {
		cursor: pointer;
		}
		
		
		.stripViewer .panelContainer .panel ul {
			text-align: left;
			margin: 0 15px 0 30px;
		}
		
		/* THE IMPORTANT STUFF STARTS HERE */
		
		.slider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			width: 100%;
			position: relative;
			margin: 0px;
		}

		/* These 2 lines specify style applied while slider is loading */
		.svw {width: 50px; height: 20px; background: #fff; overflow: hidden;}
		.svw ul {position: relative; left: -999em;}

		.stripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 
			margin: auto;
			width: 430px;
			clear: both;
			background: #fff;
		}
		
		.stripViewer .panelContainer { 
			position: relative;
			left: 0; top: 0;
			width: 100%;
			list-style-type: none;
			-moz-user-select: none; /* Stops the panels from highlighting/selecting, which I found problematic in Firefox. Also stops the CSS from validating though. Oh well. */
		}
		
		.stripViewer .panelContainer .panel { /* Each panel is arranged end-to-end */
			float:left;
			width: 150px; /* Also specified in  .stripViewer  above */
			margin: 10px 0px 0px 0px;
			height: 100%;
		}
		
		.stripViewer .panelContainer .panel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding: 10px;
		}
		
		.stripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: auto;
		}
		
		.stripNav ul { /* The auto-generated set of links */
			list-style: none;
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
		}
		
		/* If you change this, be sure to adjust the initial value of navWidth in slideviewer.js */
		.stripNav ul li {
			float: left;
			margin: 0px 2px 0px 0px; 
		}
		
		/* The nav links */
		.stripNav a { 
			background: url(../images/dot_un_selected.gif) no-repeat;
			display: block;
			width: 10px;
			height: 10px;
			margin: 5px 0px 5px 0px;
		}
		
		.stripNav a:hover {
			background: url(../images/dot_selected.gif) no-repeat;
		}
		
		.stripNav a.current {
			background: url(../images/dot_selected.gif) no-repeat;
		}
		
		.stripNavL, .stripNavR { /* The left and right arrows */
			position: absolute;
			text-indent: -9000em;
		}
		
		.stripNavL a, .stripNavR a {
			display: block;
			height: 10px;
			width: 10px;
		}
		
		.stripNavL {
			left: 0;
		}
		
		.stripNavR {
			right: 0;
		}
		
		.stripNavL {
			margin: 2px 0px 0px 0px;
			background: url(../images/arrow-left.gif) no-repeat;
		}
		
		.stripNavR {
			margin: 2px 0px 0px 0px;
			background: url(../images/arrow-right.gif) no-repeat;
		}
		
		.photo_section{
			font: bold 13px/14px 'Helvetica', Arial, sans-serif;
			color: #005699;
		}
		
		#currentImage{
			color:#005699;
			text-align: center;
			float: left;
			text-decoration: underline;
			margin: 0px 0px 10px 0px;
			text-align:center;
		}
		
		#prevLink{
			width: 175px;
		 	float:left;
			text-align:left;
		}
		
		#nextLink{
			float:right;
			text-align:right;
		}
		
		#selected_content{
			font: 11px Helvetica, Arial, sans-serif;
		}
		#selected_content a{
			cursor: pointer;
		}
		
		#imgMain{
			margin: 0px 0px 10px 0px;
		}
		
		.panel img{
			margin: 0px 0px 10px 0px;
		}
		
		/*  Side column sliders */
		
		.smallStripViewer .smallPanelContainer .smallPanel ul {
			text-align: left;
			margin: 0 0px 0 0px;
		}
		
		.smallSlider-wrap { /* This div isn't entirely necessary but good for getting the side arrows vertically centered */
			width: 100%;
			position: relative;
			margin: 0px;
		}

		/* These 2 lines specify style applied while slider is loading */
		.smallsvw {width: 115px; height: 20px; background: #fff; overflow: hidden;}
		.smallsvw ul {position: relative; left: -999em;}

		.smallStripViewer { /* This is the viewing window */
			position: relative;
			overflow: hidden; 
			margin: auto;
			width: 115px;
			clear: both;
			background: #fff;
		}
		
		.smallStripViewer .smallPanelContainer { 
			position: relative;
			left: 0; top: 0;
			width: 100%;
			list-style-type: none;
			-moz-user-select: none; /* Stops the panels from highlighting/selecting, which I found problematic in Firefox. Also stops the CSS from validating though. Oh well. */
		}
		
		.smallStripViewer .smallPanelContainer .smallPanel { /* Each panel is arranged end-to-end */
			float:left;
			width: 115px; /* Also specified in  .stripViewer  above */
			margin: 10px 0px 0px 0px;
			height: 100%;
		}
		
		.smallStripViewer .smallPanelContainer .smallPanel .wrapper { /* Wrapper to give some padding in the panels, without messing with existing panel width */
			padding: 2px;
		}
		
		.smallStripNav { /* This is the div to hold your nav (the UL generated at run time) */
			margin: auto;
		}
		
		.smallStripNav ul { /* The auto-generated set of links */
			list-style: none;
			margin: 0px 0px 0px 0px;
			padding: 0px 0px 0px 0px;
		}
		
		/* If you change this, be sure to adjust the initial value of navWidth in slideviewer.js */
		.smallStripNav ul li {
			float: left;
			margin: 0px 2px 0px 0px; 
		}
		
		/* The nav links */
		.smallStripNav a { 
			background: url(../images/dot_un_selected.gif) no-repeat;
			display: block;
			width: 10px;
			height: 10px;
			margin: 5px 0px 5px 0px;
		}
		
		.smallStripNav a:hover {
			background: url(../images/dot_selected.gif) no-repeat;
		}
		
		.smallStripNav a.current {
			background: url(../images/dot_selected.gif) no-repeat;
		}
		
		/* End side column sliders */