Maandoverzicht AUG en JUL

by bluesweater

HTML

<div class="magazineContainer">

	<div class="pagesContainer">
	
		<!-- FRONT COVER -->
  		<!-- Change the url() to your front cover URL -->
  		<div id="page_0" class="pages">
      
      <div style="overflow: hidden; width: 688px; height:725px"><iframe style="overflow: hidden; margin-top: -58px; margin-left: -8px;" src="//jsfiddle.net/bluesweater/w59hzdkp/52//embedded/result" frameborder="0" width="700" height="1100"></iframe></div>
      
  			<div class="goForth next arrow" style="color: #3c4c00;"><span class="arrowSize">→</span></div>
 		</div>

		<!-- Below is the first page of the magazine, notice the first line says 'page_1'-->
  		<!-- Your image should be 688px in width and 500px in height -->
  		<!-- You can put the html from your layout and text between 'ARTICLE START' and 'ATICLE END' --> 

  		<!-- PAGE 1 -->
  		<div id="page_1" class="pages">
			<!-- Article Start -->
      <div style="overflow: hidden; width: 688px; height:725px"><iframe style="overflow: hidden; margin-top: -58px; margin-left: -8px;" src="//jsfiddle.net/bluesweater/m81gf9nh/4//embedded/result" frameborder="0" width="700" height="1100"></iframe></div>
        			<!-- Article End -->
  			<div class="goForth back" style="color: #fff;"><span>Terug</span></div>
  			<div class="goForth next" style="color: #fff;"><span>Blogs</span></div>
		</div>

		<!-- PAGE 2 -->
		<div id="page_2" class="pages">
			<!-- Article Start -->
      
      <div style="overflow: hidden; width: 688px; height:725px"><iframe style="overflow: hidden; margin-top: -58px; margin-left: -8px;" src="//jsfiddle.net/bluesweater/m184qzcv/1//embedded/result" frameborder="0" width="700" height="1100"></iframe></div>
      <!-- Article End -->
			<div class="goForth back" style="color: #fff;"><span>Setjes per week</span></div>
			<div class="goForth next" style="color: #fff;"><span>Looks</span></div>
		</div>

		<!-- PAGE 3 -->
		<div id="page_3" class="pages">
			<!-- Article Start -->
      <img...