<!-- DC Coin Slider CSS -->
<link rel="stylesheet" type="text/css" href="dreamcodes/sliders/css/coin-slider/coin-slider-styles.css" />

<!-- DC Javascript Library -->
<script type="text/javascript" src="dreamcodes/jquery.min.js"></script> <!-- jQuery Library (do not call twice on same page) -->

<!-- DC Coin Slider JS -->
<script type="text/javascript" src="dreamcodes/sliders/js/coin-slider/coin-slider.min.js"></script>

<!-- DC Coin Slider Settings -->
<script type="text/javascript">
$(function() {
	$('#coin-slider').coinslider({				
		width: 980, // width of slider panel in pixels
		height: 400, // height of slider panel in pixels
		navigation: true, // prev next and buttons
		spw: 7, // squares per width
		sph: 5, // squares per height
		delay: 3000, // delay between images in ms (3000 = 3 seconds)
		sDelay: 30, // delay beetwen squares in ms
		opacity: 0.7, // opacity of title and navigation
		titleSpeed: 500, // speed of title appereance in ms
		effect: 'random', // random, swirl, rain, straight
		hoverPause: true // pause on hover	
	});
});
</script>

  <!-- DC Coin Slider Start -->
  <div style="width:980px; margin:0 auto; padding:10px; position:relative;"> <!-- define slider container width (strict enforce) -->
  <div class="sliderContainer">
    <div id="coin-slider"> 
    	<!-- sample local image: 
    	<a href="#"><img src="dreamcodes/sliders/images/coin-slider/add-images-here.jpg" width="980" height="400" /> <span>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</span></a> -->
    	<a href="#"><img src="http://pimg.co/p/980x400/ccc" width="980" height="400" /> <span>You must be the change you wish to see in the world - Gandhi</span></a> 
    	<a href="#"><img src="http://pimg.co/p/980x400/666" width="980" height="400" /> <span>To conquer oneself is a greater task than conquering others - The Buddha</span></a> 
    	<a href="#"><img src="http://pimg.co/p/980x400/333" width="980" height="400" /> <span>What you do not want done to yourself, do not do to others - Confucius</span></a> 
    </div>
    <div class="tsc_clear"></div> <!-- line break/clear line -->
  </div>
  </div>
  <!-- DC Coin Slider End -->