PageSourceSearch

https://www.sparklebox.co.uk/topic/

html sparklebox.co.uk collected 2026-10-03 21:38:02 UTC 79,689 bytes, 2,378 lines download raw bytes

1<style>
2
3
4#topic-top {
5    display: grid;
6	grid-template-columns: 1fr 1fr;
7	column-gap: 10px;
8}
9
10.subjects {
11	display: grid;
12    grid-template-columns: 1fr 1fr;
13    float: left;
14}
15
16#adsense_27 {
17	width: 100%;
18	max-width: 1000px;
19	margin-left: auto;
20	margin-right: auto;
21}
22
23#category_menu_container {
24	margin: 15px auto;
25}
26
27@media only screen and (max-width: 988px) {
28 .subjects, #betweenmensandgrid_topichome .ad {
29	 width: 100%;
30 }
31 #betweenmensandgrid_topichome .ad {
32	 float: unset;
33	 margin: 0 auto;
34 }
35
36}
37
38@media only screen and (max-width: 480px) {
39
40	#previewtitlebox {
41	margin-bottom: 10px;
42	}
43}
44
45</style>
46
47
48<!DOCTYPE html>
49<html style="margin: 0 !important">
50<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
vendor: 1 bytes, line 50
50
51<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>
51 
52<script src="https://unpkg.com/imagesloaded@4/imagesloaded.pkgd.min.js"></script>
52
53
54<link href="http://www.sparklebox.co.uk/feed.xml" rel="alternate" type="application/rss+xml" title="Latest SparkleBox Updates" />
55
56	
56<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
56
57	
57<script>
58		 (adsbygoogle = window.adsbygoogle || []).push({
59			  google_ad_client: "ca-pub-3041606403452784",
60			  enable_page_level_ads: true
61		 });
62	</script>
62
63	
63<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
63
64	
65
66<!-- Fixed Position -->
67	 	
68<script>
69(adsbygoogle = window.adsbygoogle || []).push({});
70
71
72</script>
72
73
74		 <!--
75	single or category
76  ~ Copyright (C) 2014-2015 Media.net Advertising FZ-LLC All Rights Reserved
77  -->
78<script type="text/javascript">
79    window._mNHandle = window._mNHandle || {};
80    window._mNHandle.queue = window._mNHandle.queue || [];
81    medianet_versionId = "3121199"; 
82</script>
vendor: 1 bytes, line 82
82
83<script src="//contextual.media.net/dmedianet.js?cid=8CU327283" async="async"></script>
83
84
85	 
85<script>
86let windowWidth;
87if (screen.width <= 480 ) {
88 var isMobilenotTablet = true;
89 	$(document).ready(function () {
90										var widthofgriditem = $("body").find('.grid-item-inner').width();
91	 											if (widthofgriditem == null){
92												var widthofgriditem = $("#previewimagesbox").width();
93											}
94	// 									$("#menubuttonscontainer").css({"maxWidth": "none"});
95	// 									$("#menubuttonscontainer").width(widthofgriditem);
96	// 									$("#menubutton1").width(45);
97	// 									var widthformenubutton = (widthofgriditem - 45)/3;
98	// 									$("#menubutton2").width(widthformenubutton);
99	// 									$("#menubutton3").width(widthformenubutton);
100	// 									$("#menubutton4").width(widthformenubutton);
101	 	var headerReduceStart = 45;
102	 	var lastScrollTop = 0;
103
104				$(window).on('scroll', function () {
105					var scrollTop = $(this).scrollTop();
106					var scrolling = lastScrollTop - scrollTop;
107					if (window.scrollY >= headerReduceStart )
108						{
109							var currentTop = parseInt($("#mainheader").css("top")); // cant let if negative or positive
110								currentTop--;						
111							if (scrolling > 0) {
112								if ((scrolling+currentTop)  <= (0) ) {
113									$("#mainheader").css("top",0+(scrolling/2)+currentTop);
114									$("#headerblackborder").css("top",0+(scrolling/2)+currentTop);
115								} else {
116									$("#mainheader").css("top", 0);
117									$("#headerblackborder").css("top", 0);
118								}
119							} else {
120								// console.log("going down");
121								// console.log(0+(scrolling)+currentTop);
122								if ((0+(scrolling)+currentTop)  >= (0-45) ) { //40
123									$("#mainheader").css("top",0+(scrolling/2)+currentTop); 
124									$("#headerblackborder").css("top",0+(scrolling/2)+currentTop); 								
125								} else {
126									$("#mainheader").css("top", (0-45));
127									$("#headerblackborder").css("top", (0-45));
128								}
129							} 
130					} else {
131						$("#mainheader").css("top", 0);
132						$("#headerblackborder").css("top", 0);
133					}
134			
135				lastScrollTop = scrollTop;
136			});
137	}); 
138
139} else {
140	 var isMobilenotTablet = false
141	$(document).ready(function () {
142	var	maxheaderHeight = 105;
143	var	minheaderHeight = 40;
144	var lastScrollTop = 0;
145	var headerReduceStart;
146	const Ads = $(".ad");
147	const minfromTop = maxheaderHeight;
148	const maxfromTop = 400 - maxheaderHeight;
149	var eachOffset;
150	// console.log(Ads);
151// 	$(".ad").each(function() {
152// 		eachOffset = $(this).offset().top.toFixed(2);
153
154// eachOffset = eachOffset - maxheaderHeight - 10;
155
156// 		maxheaderHeight;
157// 		if (eachOffset > minfromTop && eachOffset < maxfromTop){
158// 			return false;
159// 		}
160// 	});
161// 	eachOffset = parseInt(eachOffset);
162// 	if (eachOffset > 0){
163// 		headerReduceStart = eachOffset;
164// 	} else {
165		headerReduceStart = 111;
166//  }
167
168	let marginBottom = $("#searchlabel").css("margin-bottom");
169	let marginTop = $("#searchlabel").css("margin-top");
170	
171	//var offset = $("#menubuttonscontainer").offset();
172	 $(window).on('scroll', function () {
173		 windowWidth = $( window ).width();
174		if ((windowWidth >= 480 )) {
175
176			var scrollTop = $(this).scrollTop();
177			var scrolling = lastScrollTop - scrollTop;
178			const height = $("#mainheadercenter").height();
179			const fromTop = $("#google-search-header").css("top");
180			// console.log(window.scrollY);
181			// console.log(headerReduceStart);
182			if (window.scrollY >= headerReduceStart )
183			{
184
185				var currentTop = parseInt($("#mainheader").css("top")); // cant let if negative or positive
186					currentTop--;
187				if (scrolling > 0) {
188
189					if ((scrolling+currentTop)  <= (0) ) {
190						$("#mainheader").css("top",0+(scrolling/3)+currentTop); }
191					else {
192						$("#mainheader").css("top", 0);
193					}
194					
195				} else {
196					if ((0+(scrolling)+currentTop)  >= (0-65) ) {
197						$("#mainheader").css("top",0+(scrolling/3)+currentTop); }
198					else {
199						$("#mainheader").css("top", (0-65));
200					}
201				} 
202		} else {
203			$("#mainheader").css("top", 0);
204		}
205
206				if (scrollTop > lastScrollTop){
207			if (scrollTop > 65) {
208
209			} else {
210
211			}
212		} else {
213
214		}
215		lastScrollTop = scrollTop;
216	}
217	});
218	
219});		
220		}
221 </script>
221 <title> Topic Printables for Primary School - SparkleBox </title> 
222	<link rel="stylesheet" href="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/style.css">
223
224
225
226<style>
227	
228	body {
229		margin: unset;
230
231	}
232	#mainheadercenter {
233		max-width: 1000px;
234		width: 100%;
235	}
236	#mainheadercentertop {
237		height: 65px;
238	}
239
240	#menubuttonscontainer {
241		position: unset;
242		margin: 0 auto;
243		width: 100%;
244		display: flex;
245		justify-content: center;
246	}
247
248	.menu__sblogo--small {
249		display: none;
250	}
251
252	#google-search-header {
253		width: 1000px;
254	}
255
256
257@media only screen and (max-width: 1000px) {
258
259	.gsc-search-button {
260		padding-right: 12px;
261	}
262
263}
264
265@media only screen and (max-width: 986px) {
266
267	
268
269	#menubutton1 {
270		order: 999;
271		flex-grow: 1;
272		border-color: #CC0000;
273	}
274
275	#menubutton8 {
276		display: none;
277	}
278
279	#menubutton1 img {
280		position: initial !important;
281		margin: 0 auto;
282	}
283	#menubutton1 p {
284		display: none;
285	}
286
287
288}
289
290
291@media only screen and (max-width: 915px) { 
292	#google-search-header {
293		width: 500px;
294	}
295	#menubutton7 {
296		display: none;
297	}
298
299}
300
301
302
303@media only screen and (max-width: 765px) { 
304	#google-search-header {
305		width: 370px;
306	}
307	#menubutton9 {
308		display: none;
309	}
310	#menubutton1 {
311
312		border-color: black;
313	}
314
315}
316
317@media only screen and (max-width: 675px) { 
318
319	#menubutton6 {
320		display: none;
321	}
322
323}
324
325
326@media only screen and (max-width: 650px) {
327	.menu__sblogo--small {
328		display: block;
329		margin: 0 15px;
330	}
331
332	#mainheadercentertop {
333		display: none;
334	}
335	#content-top {
336    margin-top: 60px !important;
337	}
338	#mainheader, #mainheadercenter {
339		height: 39px;
340	}
341	#menubutton5 {
342	display: none;
343	}
344}
345
346@media only screen and (max-width: 450px) {
347	#menubutton4 {
348		display: none;
349	}
350}
351
352@media only screen and (max-width: 350px) {
353	#menubutton3 {
354		display: none;
355	}
356}
357
358
359</style>
360<head>
361<!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 64 bytes, lines 361-362
361
362<script async src="https://www.googletagmanager.com/gtag/js?id=
362UA-134024-2
vendor: 12 bytes, line 362
362"></script>
363<script>
364  
vendor: 134 bytes, lines 364-368
364window.dataLayer = window.dataLayer || [];
365  function gtag(){dataLayer.push(arguments);}
366  gtag('js', new Date());
367
368  gtag('config', '
368UA-134024-2
vendor: 4 bytes, line 368
368');
369</script>
369
370<meta name="viewport" content="width=device-width, initial-scale=1.0">
371
372<meta http-equiv="Cache-control" content="public">
373<meta name="theme-color" content="#CCCCFF"> 
374
375<meta name="description" content="1000s of FREE teaching resources for Early Years and Primary School teachers.">
376		
377
378<script>
379
380
381 
382$(document).ready(function() {
383		
384			
385if ((screen.width <= 654)) {
386  // nothing
387} else {
388 
389//console.log("Ready");		
390var $grid = $('.grid').masonry({
391itemSelector: ".grid-item",
392columnWidth: '.grid-sizer',
393  percentPosition: true,
394  stagger: 30,
395})
396
397
398
399 $grid.find(".grid-item").css("visibility", "visible");
400
401$grid.imagesLoaded().progress( function() {
402 $grid.masonry('layout');
403});
404
405
406
407$grid.imagesLoaded( function() {
408  //$grid.find('.grid-item').removeClass('are-images-unloaded');
409  //$grid.masonry( 'option', { itemSelector: '.grid-item' });
410  //var $items = $grid.find('.grid-item');
411  //$grid.masonry( 'appended', $items );
412
413});
414
415$grid.imagesLoaded().done( function( instance ) {
416	$('.loader1').hide();
417});
418
419
420		$(".grid-item").mouseenter(function(){
421
422			$(this).find(".previewanddownload").show();
423
424 });
425 		$(".grid-item").mouseleave(function(){
426			$(this).find(".previewanddownload").hide();
427
428 });
429
430		
431} //is mobile
432});
433	
434	</script>
434 
435
436<script> 
437
438
439
440function UrlExists(url) {
441    var http = new XMLHttpRequest();
442    http.open('HEAD', url, false);
443    http.send();
444if (http.status == 404) {
445	  console.warn("%cSparkleBox System: " + url + "does not exist" ,"background-color: orange");
446}
447}
448
449function relatedItems(){
450$(document).ready(function(){
451	      $('#featurecontainer').on('load', function() {
452		  var count485 = 0;
453		  var relateditemsURLs = [];
454		   var relateditemsNames = [];
455$("#featurecontainer").contents().find('a').each(function() {
456	
457
458count485++;
459		relateditemsURLs[count485] = $(this).attr('href');
460		relateditemsNames[count485] = $(this).attr('href').replace(/\/$/, "");
461	relateditemsNames[count485] = relateditemsNames[count485].replace('.html','');
462		var n = relateditemsNames[count485].lastIndexOf("/");
463relateditemsNames[count485] = relateditemsNames[count485].slice(n+1);
464relateditemsNames[count485] = replaceAll(relateditemsNames[count485], "-", " ")
465relateditemsNames[count485] = toTitleCase(relateditemsNames[count485]);
466if ((relateditemsNames[count485].indexOf('creativeasin') > -1) || (relateditemsURLs[count485].indexOf('amzn') > -1)) 
467{
468 relateditemsNames.pop();
469 relateditemsURLs.pop();
470   count485--;
471
472}
473});
474fLen = relateditemsURLs.length;
475
476for (i = 1; i < fLen; i++) {
477
478var mrelatedvarURLtypeof =  "typeof mrelated" + i + "URL";
479var mrelatedvarURL =  "mrelated" + i + "URL";
480if (eval(mrelatedvarURLtypeof) != 'undefined')
481{ 
482relateditemsURLs[i] = eval(mrelatedvarURL);
483}
484var mrelatedvartitletypeof =  "typeof mrelated" + i + "title";
485var mrelatedvartitle =  "mrelated" + i + "title";
486if (eval(mrelatedvartitletypeof) != 'undefined')
487{ 
488relateditemsNames[i] = eval(mrelatedvartitle);
489
490}
491	// console.log(i);
492	//console.log(relateditemsURLs[i]);
493	//console.log(relateditemsNames[i]);
494	//console.log("%c" + relateditemsNames[i]  + "#" + relateditemsURLs[i], "font-weight: bold; background-color: Thistle");
495	//if (relateditemsURLs[i].charAt(0) != "h" ) {$( "#mrelatedJSinner" ).append( "<li> <a href=\"http://" + relateditemsURLs[i] + "\">" + relateditemsNames[i] + "</a> </li>");	}
496	//else {
497	//$( "#mrelatedJSinner" ).append( "<li> <a href=\"" + relateditemsURLs[i] + "\">" + relateditemsNames[i] + "</a> </li>");		
498	//}
499
500}		
501
502	
503//$(this).contents().find( "style" ).append('#divMain > img:first-of-type {display: none;}');
504
505  //  $(this).contents().find( "style" ).append('#divMain > img:nth-child(2) {display: none;} #divMain > img:nth-child(9) {display: none;} #divMain .OBJ-3 {display: none;} #divMain .C-4 {display: none;}  #divMain > img:nth-child(5) {display: none;} #divMain p {display: none;} #divMain > a:nth-child(8) > img {display: none;} #divMain span {display: none;} #divMain > div:nth-child(7) {display: none}');
506   }); // lightbox read
507      }); // page ready
508}; // function
509function lightbox(refID, width, height, url){
510		
511
512		var closeButton = document.getElementById("lightboxclose"); 
513		 var elem = document.getElementById("lightbox"); 	
514		  var iframe = document.getElementById("lightboxIframe"); 	
515
516		windowWidth = $( window ).width();
517		var windowHeight = $( window ).height();
518
519		$('#lightbox').show();
520			if ((windowWidth <= 480 ) && (refID == "menubutton1")) {
521			var width = 290;
522			var height = 350;
523			elem.style.borderTop = "4px solid white";
524			
525			var url = "https://www.sparklebox.co.uk/menus/2014/mobile/";
526		var isMobile = true;	
527			} 
528			
529			else if (refID == "menubutton1") {
530				elem.style.borderTop = "4px solid white";
531			}
532			
533			
534			else {
535				elem.style.borderTop = "4px solid white";
536				elem.style.borderBottom = "4px solid white";
537				elem.style.borderLeft = "4px solid white";
538				elem.style.borderRight = "4px solid white";
539			}
540			
541			
542
543		 elem.width = width + "px";
544		 elem.height = height + "px";
545		 iframe.width = width + "px";
546		 iframe.height = height + "px";
547
548
549			// var marginTop = elem.style.marginTop = 0-(height/2) + "px";
550				// var marginLeft = elem.style.marginLeft = 0-(width/2) + "px";
551
552		  
553		  if (isMobile == true) { // no animation
554			  closeButton.style.display = 'block';
555		closeButton.style.position = 'fixed';
556			elem.style.opacity = 1;
557
558		  } else {
559			pos = 0;
560		   elem.style.opacity = 0.1;
561		  var id = setInterval(frame, 1);
562
563			 // var marginTopEnd =  0-((height/2)+56);
564			  //var marginLeftEnd = 0-(width/2);
565			  //var iterations = height/5;
566			  //var iterationStepMT = (marginTopEnd - //elem.style.marginTop)/iterations;
567			  //var iterationStepML = (marginLeftEnd - //elem.style.marginLeft)/iterations;
568		  function frame() {
569			if (pos >= 1 ) {
570			  clearInterval(id);
571			  closeButton.style.display = 'block';
572		closeButton.style.position = 'fixed';
573			} else {
574				
575				
576			  pos = pos+0.05; 
577			  elem.style.opacity = pos;
578			  //elem.width = pos*(width/height) + 'px'; 
579			  //elem.height = pos + 'px'; 
580			  //elem.style.marginTop = 0-((height/2)+56)/(pos/height) + 'px';
581			 //elem.style.marginLeft = 0-(width/2)/(pos/height) + 'px';
582			  //elem.style.marginTop = elem.style.marginTop + //iterationStepMT;
583			  //elem.style.marginLeft = elem.style.marginLeft + //iterationStepML;
584			} 
585		  } // END frame function
586		  } //END if mobile
587		  
588		document.getElementById('lightboxIframe').src = url;
589		//document.getElementById('lightbox').width = width;
590		 //document.getElementById('lightbox').height = height;
591		// document.getElementById("lightbox").style.marginTop = 0-(height/2)-56;
592		 // document.getElementById("lightbox").style.marginLeft = 0-(width/2);
593		 
594		 
595		 var offset = $('#lightbox').offset();
596		 var offsetTop = offset.top;
597		  var offsetLeft = offset.left;
598 };
599
600 function toTitleCase(str)
601{
602    return str.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
603}
604 function replaceAll(str, find, replace) {
605  return str.replace(new RegExp(find, 'g'), replace);
606}
607
608 
609$(document).ready(function(){
610
611
612
613  $(window).scroll(function(){
614	$('#blackbackground').hide();
615	$('#lightbox').hide();
616	$('#lightboxclose').hide();   
617	})
618
619
620
621$(".lightbox").click(function(){
622	$('#blackbackground').show();
623});
624 
625 $("#blackbackground").click(function(){
626	$('#blackbackground').hide();
627	$('#lightbox').hide();
628	$('#lightboxclose').hide();
629	$('#373476408').hide();
630 });
631 
632  $("#lightboxclose").click(function(){
633	$('#blackbackground').hide();
634	$('#lightbox').hide();
635	$('#lightboxclose').hide();
636 });
637
638 
639 
640$("#suggestedresourcessbutton").mouseenter(function(){
641	document.getElementById("suggestresourceicon").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/suggest_trans.png";	
642});
643	
644$("#suggestedresourcessbutton").mouseleave(function(){
645	document.getElementById("suggestresourceicon").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/suggest.png";	
646});
647	
648	
649	
650$("#lightboxclose").mouseenter(function(){
651	document.getElementById("lightboxclose").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/lightbox_close_trans.png";	
652});
653	
654$("#lightboxclose").mouseleave(function(){
655	document.getElementById("lightboxclose").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/lightbox_close.png";	
656});
657	
658	
659	
660$("#menubutton1").mouseenter(function(){
661	document.getElementById("menubutton1image").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/hamburger_trans.jpg";	
662});
663	
664$("#menubutton1").mouseleave(function(){
665document.getElementById("menubutton1image").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/hamburger.jpg";	
666});
667	
668	if (relateditems !== undefined) {
669
670  $("#relateditemsbutton").mouseenter(function(){
671document.getElementById("relateditemicon").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/related_trans.png";	
672    });
673
674	$("#relateditemsbutton").mouseleave(function(){
675		document.getElementById("relateditemicon").src = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/related.png";	
676    });
677	}; 
678
679});
680
681</script>
681
682
683<div id="headerblackborder" class="hide-93491"> </div>
684
685<div id="mainheader" class="hide-93491 bottomblueshort lightblue">
686
687<div id="mainheadercenter" class="bottomblueshort lightblue" >
688<div id="mainheadercentertop">
689<div id="google-search-header">
690<p id="searchlabel" class="clear"> Find Resources </p>
691	
691<script>
692  (function() { // google search
693    var cx = '016562706526168575532:6exxkhvhsqg';
694    var gcse = document.createElement('script');
695    gcse.type = 'text/javascript';
696    gcse.async = true;
697    gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
698    var s = document.getElementsByTagName('script')[0];
699    s.parentNode.insertBefore(gcse, s);
700  })();
701</script>
701
702<gcse:searchbox-only></gcse:searchbox-only>
703</div>
704
705<a href="https://www.Sparklebox.co.uk">
706<img id="logo_top" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/logo_top.png">
707</a>
708</div> <!-- mainheadercentertop -->
709<div id="menubuttonscontainer">
710		<!-- <a  class="lightbox" href="http://www.sparklebox.co.uk/menus/2014/full/"> -->
711		<a href="https://www.sparklebox.co.uk/"><img class="menu__sblogo--small" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/sb_small.png"></a>
712		<div id="menubutton1" class="menubutton lightbox" onclick="lightbox(&#39;menubutton1&#39;, 1000, 410, &#39;https://www.SparkleBox.co.uk/menus/2014/full/&#39;)">
713		<img id="menubutton1image" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/hamburger.jpg">
714		<p>Menu</p>
715		<img id="menubutton1imageM" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/sb_small.png">
716		</div><!--  menubutton1 --><!--</a>-->
717		<a href="https://www.sparklebox.co.uk/literacy/"><div id="menubutton2" class="menubutton"><p>Literacy</p></div><!--  menubutton2 --></a>
718		<a href="https://www.sparklebox.co.uk/maths/"><div id="menubutton3" class="menubutton"><p>Maths</p></div><!--  menubutton3 --></a>
719		<a href="https://www.sparklebox.co.uk/topic/"><div id="menubutton4" class="menubutton"><p>Topics</p></div><!--  menubutto4 --></a>
720		<a href="https://www.sparklebox.co.uk/signs-and-labels/"><div id="menubutton5" class="menubutton"><p>Signs and Labels</p></div><!--  menubutton5 --></a>
721		<a href="https://www.sparklebox.co.uk/class-management/"><div id="menubutton6" class="menubutton"><p>Class Management</p></div><!--  menubutton6 --></a>
722		<a href="https://www.sparklebox.co.uk/special-needs/"><div id="menubutton7" class="menubutton"><p>Special Needs</p></div><!--  menubutton7 --></a>
723		<a href="https://www.sparklebox.co.uk/other/"><div id="menubutton8" class="menubutton"><p>Other</p></div><!--  menubutto8 --></a>
724		<a href="https://www.sparklebox.co.uk/popular/"><div id="menubutton9" class="menubutton"><p>Popular</p></div><!--  menubutto9 --></a>
725</div><!--  menubuttonscontainer -->
726
727</div><!--  mainheadercenter --></div><!--  mainheader -->
728<link rel='dns-prefetch' href='//s.w.org' />
729<link rel="alternate" type="application/rss+xml" title="www.sparklebox.co.uk &raquo; Topic Category Feed" href="https://www.sparklebox.co.uk/topic/feed/" />
730		
730<script type="text/javascript">
731			window._wpemojiSettings = {"baseUrl":"https:\/\/s.w.org\/images\/core\/emoji\/12.0.0-1\/72x72\/","ext":".png","svgUrl":"https:\/\/s.w.org\/images\/core\/emoji\/12.0.0-1\/svg\/","svgExt":".svg","source":{"concatemoji":"https:\/\/www.sparklebox.co.uk\/wp-includes\/js\/wp-emoji-release.min.js?ver=5.2.28"}};
732			!function(e,a,t){var n,r,o,i=a.createElement("canvas"),p=i.getContext&&i.getContext("2d");function s(e,t){var a=String.fromCharCode;p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,e),0,0);e=i.toDataURL();return p.clearRect(0,0,i.width,i.height),p.fillText(a.apply(this,t),0,0),e===i.toDataURL()}function c(e){var t=a.createElement("script");t.src=e,t.defer=t.type="text/javascript",a.getElementsByTagName("head")[0].appendChild(t)}for(o=Array("flag","emoji"),t.supports={everything:!0,everythingExceptFlag:!0},r=0;r<o.length;r++)t.supports[o[r]]=function(e){if(!p||!p.fillText)return!1;switch(p.textBaseline="top",p.font="600 32px Arial",e){case"flag":return s([55356,56826,55356,56819],[55356,56826,8203,55356,56819])?!1:!s([55356,57332,56128,56423,56128,56418,56128,56421,56128,56430,56128,56423,56128,56447],[55356,57332,8203,56128,56423,8203,56128,56418,8203,56128,56421,8203,56128,56430,8203,56128,56423,8203,56128,56447]);case"emoji":return!s([55357,56424,55356,57342,8205,55358,56605,8205,55357,56424,55356,57340],[55357,56424,55356,57342,8203,55358,56605,8203,55357,56424,55356,57340])}return!1}(o[r]),t.supports.everything=t.supports.everything&&t.supports[o[r]],"flag"!==o[r]&&(t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&t.supports[o[r]]);t.supports.everythingExceptFlag=t.supports.everythingExceptFlag&&!t.supports.flag,t.DOMReady=!1,t.readyCallback=function(){t.DOMReady=!0},t.supports.everything||(n=function(){t.readyCallback()},a.addEventListener?(a.addEventListener("DOMContentLoaded",n,!1),e.addEventListener("load",n,!1)):(e.attachEvent("onload",n),a.attachEvent("onreadystatechange",function(){"complete"===a.readyState&&t.readyCallback()})),(n=t.source||{}).concatemoji?c(n.concatemoji):n.wpemoji&&n.twemoji&&(c(n.twemoji),c(n.wpemoji)))}(window,document,window._wpemojiSettings);
733		</script>
733
734		<style type="text/css">
735img.wp-smiley,
736img.emoji {
737	display: inline !important;
738	border: none !important;
739	box-shadow: none !important;
740	height: 1em !important;
741	width: 1em !important;
742	margin: 0 .07em !important;
743	vertical-align: -0.1em !important;
744	background: none !important;
745	padding: 0 !important;
746}
747</style>
748	<link rel='stylesheet' id='wp-block-library-css'  href='https://www.sparklebox.co.uk/wp-includes/css/dist/block-library/style.min.css?ver=5.2.28' type='text/css' media='all' />
749<link rel='https://api.w.org/' href='https://www.sparklebox.co.uk/wp-json/' />
750<link rel="EditURI" type="application/rsd+xml" title="RSD" href="https://www.sparklebox.co.uk/xmlrpc.php?rsd" />
751<link rel="wlwmanifest" type="application/wlwmanifest+xml" href="https://www.sparklebox.co.uk/wp-includes/wlwmanifest.xml" /> 
752<meta name="generator" content="WordPress 5.2.28" />
753<style type="text/css">.broken_link, a.broken_link {
754	text-decoration: line-through;
755}</style> 
756</head>
757<body id="body-category-2537" class="category" style="margin: 0px;"> 
758
759<div id="blackbackground"></div> <!--  for lightbox - hidden -->
760<div id="lightbox" style="">
761	<div style="position: relative">
762		<iframe id="lightboxIframe" src="about:blank"></iframe>
763		<img id="lightboxclose"  style="position: absolute; right: -20px; top: -20px" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/lightbox_close.png">
764	</div>
765</div>
766	<!--Start Cookie Script--> 
767<!-- 
767<script type="text/javascript" charset="UTF-8" src="//chs02.cookie-script.com/s/e8139f5be5cd4595ac280ed8635d2565.js"></script>
767 -->
768<!--End Cookie Script -->
769
770
771
772
773
774
775<div id="content-top" class="hide-93491">
776	<style>
777		ins {
778			background-color: #FFD8B2;
779		}
780	</style>
781	
782 
782<script>
783console.log("catID: 2537");
784</script>
784 <div id="adsense_3" class="dHide mobile-fullwidth-noheight ad ym15">
785		<div class="advertisementlabel clear">
786	Advertisement
787	</div> 
788<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
788
789<!-- Mobile_300x250 -->
790<ins class="adsbygoogle"
791    data-ad-client="ca-pub-3041606403452784"
792    data-ad-slot="2844875649"
793    data-ad-format="auto"></ins>
794<script>
795(adsbygoogle = window.adsbygoogle || []).push({});
796</script>
796</div><!--  smallAd -->  	 </div> <!--  content-top --> 
797	  <img id="titlebox-header" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/header-cat-topic.jpg" >
798	 
799   <div id="rootmap-container">
800	<div id="rootmap" class="withTitleImage">
801	<a href="https://www.sparklebox.co.uk"> HOME </a>
802 
803	> <span>  Topic </span>
804	</div> <!--  rootmap -->
805	 </div> <!--  rootmap-container -->
806      </div> <!--  content-top --> 
807
808 <div id="previewtitlebox" class="lightorange toporange Mbottomorange">
809
810  
811
812 <h1><span>Topic </span> </h1>   
813 <div id="relateditemsbutton"
814 class=" norelateditems "> 
815  
816
817
818<img id="relateditemicon" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/related_inactive.png" >
819<p> RELATED ITEMS </p>
820 
821 </div> <!--  relateditemsbutton -->
822  <!-- </a> -->
823   <!--  <a data-fancybox="gallery" class="fancybox2" href="http://www.SparkleBox.co.uk/menus/2014/suggest/"> -->
824  <div id="suggestedresourcessbutton" class="lightbox" style="" onclick="lightbox('suggestedresourcessbutton', 900, 400, 'https://www.sparklebox.co.uk/menus/2014/suggest/?')"
825 >
826  <p> SUGGEST A RESOURCE </p>
827<img id="suggestresourceicon" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/suggest.png" >
828  </div> <!--  relateditemsbutton -->
829 <!-- </a> -->
830  </div> <!--  previewtitlebox --> <style>
831
832@media only screen and (max-width: 659px) {
833
834	#topic-top, #topic-top .banners, #topic-top .banners img {
835		width: 100%;
836		height: unset;
837	}
838	#topic-top {
839		grid-template-rows: unset;
840	}
841}
842</style>
843<div id="topic-top">
844	<div class="banners container">
845		<a href="https://www.sparklebox.co.uk/topic/world-around-us/weather-and-seasons/winter.html"><img src="/custom/topic/banner1.jpg"></a>
846		<a href="https://www.sparklebox.co.uk/topic/living/life-cycles.html"><img src="/custom/topic/banner2.jpg"></a>
847	</div>
848	<div class="upcomingevents container lightorange toporange">
849	 
850 
851<div class="wrapper">
852 
853  
854  
855
856        	  <span id="upcomingtitlehomepage-mobile" class="
857 grilledcheese"> 
858	  Upcoming Events...	  </span>
859	  
860	  
861	  <p class="upcomingEvent clear">
862  <a class="" href="http://www.sparklebox.co.uk/topic/faiths-festivals-celebrations/fireworks-night.html">
863  Bonfire Night</a></p>
864
865     	  
866	  <p class="upcomingEvent clear">
867  <a class="" href="http://www.sparklebox.co.uk/topic/faiths-festivals-celebrations/diwali.html">
868  Diwali</a></p>
869
870     	  
871	  <p class="upcomingEvent clear">
872  <a class="" href="http://www.sparklebox.co.uk/topic/faiths-festivals-celebrations/poppy.html">
873  Remembrance Day</a></p>
874
875     	  
876	  <p class="upcomingEvent clear">
877  <a class="" href="http://www.sparklebox.co.uk/topic/faiths-festivals-celebrations/st-andrews-day.html">
878  St Andrew's Day</a></p>
879
880     	  
881	  <p class="upcomingEvent clear">
882  <a class="" href="http://www.sparklebox.co.uk/topic/faiths-festivals-celebrations/christmas/">
883  Christmas Day</a></p>
884
885     	  
886
887  </div> <!-- wrapper -->
888
889	</div>
890 </div><div id="category_menu_container"><div style="color: red";></div><div style="color: orange"></div> 
891<style>
892    .menu-category-standard__container {
893    max-width: 988px;
894    width: 100%;
895    display: grid;
896    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
897    grid-gap: 10px;
898    margin: 0 auto;
899    }
900
901
902    .menu-category-standard__paragraph {
903        width: 80%;
904        margin: 0 auto;
905        display: table-cell;
906        vertical-align: middle;
907    }
908
909    .menu-category-standard__text {
910        line-height: 28.00px;
911        font-family: "Arial", sans-serif;
912        color: #ffffff;
913        font-size: 24.0px;
914        text-align: center;
915        vertical-align: middle;
916        margin: 0 auto;
917        display: block;
918        width: 80%;
919    }
920
921
922    .menu-category-standard__item {
923        background-color: #FF8000;
924        height: 110px;
925        width: 100%;
926        display: table;
927    }
928
929    .menu-category-standard__item:hover {
930        background-color:  #e67300;
931    }
932
933    @media only screen and (max-width: 500px) {
934	.menu-category-standard__container {
935        grid-template-columns: 1fr;
936    }
937    .menu-category-standard__item {
938        height: 50px;
939    }
940
941    .menu-category-standard__text {
942    font-weight: bold;
943    font-size: 13px;
944    line-height: 18px }
945
946}
947
948</style>
949
950<div id="menu-category-standard2537" class="menu-category-standard__container">
951    <a style="" href="https://www.sparklebox.co.uk/topic/world-around-us
951/"> 
952        <div class="menu-category-standard__item">
953            <p class="menu-category-standard__paragraph">
954                <span class="menu-category-standard__text">
955                    The World Around Us                </span>
956            </p>
957        </div>
958    </a>
959    <a style="" href="https://www.sparklebox.co.uk/topic/faiths-festivals-celebrations/"> 
960        <div class="menu-category-standard__item">
961            <p class="menu-category-standard__paragraph">
962                <span class="menu-category-standard__text">
963                    Faiths, Festivals and Celebrations                </span>
964            </p>
965        </div>
966    </a>
967    <a style="" href="https://www.sparklebox.co.uk/topic/roleplay/"> 
968        <div class="menu-category-standard__item">
969            <p class="menu-category-standard__paragraph">
970                <span class="menu-category-standard__text">
971                    Role-Play                </span>
972            </p>
973        </div>
974    </a>
975    <a style="" href="https://www.sparklebox.co.uk/topic/creative-arts/"> 
976        <div class="menu-category-standard__item">
977            <p class="menu-category-standard__paragraph">
978                <span class="menu-category-standard__text">
979                    Creative Arts                </span>
980            </p>
981        </div>
982    </a>
983    <a style="" href="https://www.sparklebox.co.uk/topic/past/"> 
984        <div class="menu-category-standard__item">
985            <p class="menu-category-standard__paragraph">
986                <span class="menu-category-standard__text">
987                    History and the Past                </span>
988            </p>
989        </div>
990    </a>
991    <a style="" href="https://www.sparklebox.co.uk/topic/fantasy/"> 
992        <div class="menu-category-standard__item">
993            <p class="menu-category-standard__paragraph">
994                <span class="menu-category-standard__text">
995                    Fantasy and Fiction                </span>
996            </p>
997        </div>
998    </a>
999    <a style="" href="https://www.sparklebox.co.uk/topic/languages/"> 
1000        <div class="menu-category-standard__item">
1001            <p class="menu-category-standard__paragraph">
1002                <span class="menu-category-standard__text">
1003                    Languages                </span>
1004            </p>
1005        </div>
1006    </a>
1007    <a style="" href="https://www.sparklebox.co.uk/topic/pe/"> 
1008        <div class="menu-category-standard__item">
1009            <p class="menu-category-standard__paragraph">
1010                <span class="menu-category-standard__text">
1011                    Physical Education                </span>
1012            </p>
1013        </div>
1014    </a>
1015    <a style="" href="https://www.sparklebox.co.uk/topic/computers-technology/"> 
1016        <div class="menu-category-standard__item">
1017            <p class="menu-category-standard__paragraph">
1018                <span class="menu-category-standard__text">
1019                    Computers and Technology                </span>
1020            </p>
1021        </div>
1022    </a>
1023    <a style="" href="https://www.sparklebox.co.uk/topic/creative-arts/playdough-mats/"> 
1024        <div class="menu-category-standard__item">
1025            <p class="menu-category-standard__paragraph">
1026                <span class="menu-category-standard__text">
1027                    Playdough Activity Mats                </span>
1028            </p>
1029        </div>
1030    </a>
1031    <a style="" href="https://www.sparklebox.co.uk/topic/creative-arts/art-and-design/colouring-pages/"> 
1032        <div class="menu-category-standard__item">
1033            <p class="menu-category-standard__paragraph">
1034                <span class="menu-category-standard__text">
1035                    Colouring Pages                </span>
1036            </p>
1037        </div>
1038    </a>
1039    <a style="" href="https://www.sparklebox.co.uk/topic/other/"> 
1040        <div class="menu-category-standard__item">
1041            <p class="menu-category-standard__paragraph">
1042                <span class="menu-category-standard__text">
1043                    General Topic Resources                </span>
1044            </p>
1045        </div>
1046    </a>
1047</div></div>
1048<style> 
1049
1050.betweenmensandgrid_topichome_menuandad {
1051	display: grid;
1052	grid-template-columns: 1fr auto;
1053
1054}
1055
1056@media only screen and (max-width: 700px) {
1057	.betweenmensandgrid_topichome_menuandad {
1058	display: grid;
1059	grid-template-columns: unset;
1060	grid-template-rows: auto auto;
1061	grid-row-gap: 15px;
1062}
1063}
1064
1065</style>
1066
1067 <div id="betweenmensandgrid_topichome" class="betweenmenusandgrid">
1068<div class="standardTitle title lightorange toporange " style="margin-bottom: 15px"><span class="grilledcheese">
1069    Subjects</span></div>
1070
1071	<div class="betweenmensandgrid_topichome_menuandad">
1072
1073		<style>
1074.menu-image-text-horizontal {
1075    display: grid;
1076    grid-template-columns: 1fr 1fr;
1077    grid-row-gap: 10px;
1078}
1079
1080.menu-image-text-horizontal span {
1081    line-height: 28.00px;
1082    font-family: "Arial", sans-serif;
1083    font-size: 24.0px;
1084    vertical-align: middle;
1085    color: blue;
1086}
1087
1088.menu-image-text-horizontal img {
1089    height: 77px;
1090    width: 77px;
1091}
1092
1093.menu-image-text-horizontal span {
1094    margin-left: 5px;
1095}
1096
1097
1098.menu-image-text-horizontal .item {
1099    display: flex;
1100    align-items: center;
1101}
1102
1103@media only screen and (max-width: 500px) {
1104	.menu-image-text-horizontal  {
1105        grid-template-columns: 1fr;
1106    }
1107}
1108
1109</style>
1110
1111<div class="menu-image-text-horizontal">
1112            <a href="http://www.sparklebox.co.uk/topic/science/">
1113            <div class="item">
1114                    <img alt="Science" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-science.png">
1115                    <span>Science<span>
1116            </div>
1117        </a>
1118            <a href="http://www.sparklebox.co.uk/topic/computers-technology/ict.html">
1119            <div class="item">
1120                    <img alt="ICT" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-ict.png">
1121                    <span>ICT<span>
1122            </div>
1123        </a>
1124            <a href="http://www.sparklebox.co.uk/topic/geography/">
1125            <div class="item">
1126                    <img alt="Geography" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-geography.png">
1127                    <span>Geography<span>
1128            </div>
1129        </a>
1130            <a href="http://www.sparklebox.co.uk/topic/past/">
1131            <div class="item">
1132                    <img alt="History" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-history.png">
1133                    <span>History<span>
1134            </div>
1135        </a>
1136            <a href="http://www.sparklebox.co.uk/topic/dt/">
1137            <div class="item">
1138                    <img alt="D&T" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-d&t.png">
1139                    <span>D&T<span>
1140            </div>
1141        </a>
1142            <a href="http://www.sparklebox.co.uk/topic/faiths-festivals-celebrations/">
1143            <div class="item">
1144                    <img alt="RE" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-re.png">
1145                    <span>RE<span>
1146            </div>
1147        </a>
1148            <a href="http://www.sparklebox.co.uk/topic/creative-arts/art-and-design/art.html">
1149            <div class="item">
1150                    <img alt="Art" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-art.png">
1151                    <span>Art<span>
1152            </div>
1153        </a>
1154            <a href="http://www.sparklebox.co.uk/topic/creative-arts/music/">
1155            <div class="item">
1156                    <img alt="Music" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-music.png">
1157                    <span>Music<span>
1158            </div>
1159        </a>
1160            <a href="http://www.sparklebox.co.uk/topic/pe/">
1161            <div class="item">
1162                    <img alt="PE" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-pe.png">
1163                    <span>PE<span>
1164            </div>
1165        </a>
1166            <a href="http://www.sparklebox.co.uk/topic/pshe/">
1167            <div class="item">
1168                    <img alt="PSHE" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-pshe.png">
1169                    <span>PSHE<span>
1170            </div>
1171        </a>
1172            <a href="http://www.sparklebox.co.uk/topic/languages/">
1173            <div class="item">
1174                    <img alt="MFL" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-mfl.png">
1175                    <span>MFL<span>
1176            </div>
1177        </a>
1178            <a href="http://www.sparklebox.co.uk/topic/creative-arts/dance/">
1179            <div class="item">
1180                    <img alt="Dance" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-dance.png">
1181                    <span>Dance<span>
1182            </div>
1183        </a>
1184            <a href="http://www.sparklebox.co.uk/topic/creative-arts/drama/">
1185            <div class="item">
1186                    <img alt="Drama" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-drama.png">
1187                    <span>Drama<span>
1188            </div>
1189        </a>
1190            <a href="http://www.sparklebox.co.uk/topic/hsie/">
1191            <div class="item">
1192                    <img alt="HSIE (Australia)" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-hsie.png">
1193                    <span>HSIE (Australia)<span>
1194            </div>
1195        </a>
1196            <a href="http://www.sparklebox.co.uk/topic/pdhpe/">
1197            <div class="item">
1198                    <img alt="PDHPE (Australia)" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/categories/topic/icon-pdhpe.png">
1199                    <span>PDHPE (Australia)<span>
1200            </div>
1201        </a>
1202    </div>				<div class="ad desktopOnly">	
1203				
1203<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
1203
1204			<!-- 300x600_preview -->
1205			<ins class="adsbygoogle"
1206					style="display:block;width:300px;height:600px"
1207					data-ad-client="ca-pub-3041606403452784"
1208					data-ad-slot="4747713241"></ins>
1209			
1209<script>
1210			(adsbygoogle = window.adsbygoogle || []).push({});
1211			</script>
1211
1212				</div> <!--  smallAd --> 
1213				<div class="smallAd grid-item-inner mobileOnly" style="width: 100%">
1214			
1214<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
1214
1215			<!-- Mobile_300x250 -->
1216			<ins class="adsbygoogle"
1217					style="display: block;"
1218				data-ad-client="ca-pub-3041606403452784"
1219				data-ad-slot="2844875649"
1220				data-ad-format="auto"></ins>
1221			
1221<script>
1222			(adsbygoogle = window.adsbygoogle || []).push({});
1223			</script>
1223
1224			</div>
1225	</div>
1226</div></div><!--  container-subcategories --><div id="featuretitlebox" class="clear titlebox subtitlebox lightorange toporange">
1227	<span class="grilledcheese"> Popular Resources in this Section </span> 
1228	 </div><!--  featuretitlebox -->  
1228<script>
1229		//console.log("argArray: ");
1230		</script>
1230 <style>
1231.lds-hourglass {
1232  display: block;
1233  margin: 0 auto;
1234  position: relative;
1235  width: 115px;
1236    height: 115px;
1237}
1238.lds-hourglass:after {
1239  content: " ";
1240  display: block;
1241  border-radius: 50%;
1242  width: 0;
1243  height: 0;
1244  margin: 6px;
1245  box-sizing: border-box;
1246  border: 52px solid #fff;
1247  border-color: #E5E5FF transparent #E5E5FF transparent;
1248  animation: lds-hourglass 1.2s infinite;
1249}
1250@keyframes lds-hourglass {
1251  0% {
1252    transform: rotate(0);
1253    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
1254  }
1255  50% {
1256    transform: rotate(900deg);
1257    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
1258  }
1259  100% {
1260    transform: rotate(1800deg);
1261  }
1262}
1263
1264
1265
1266.grid-item:hover .previewanddownload {
1267    display: block;
1268}
1269
1270.grid {
1271	min-height: 100vh !important;
1272}
1273
1274  .grid, #featuretitlebox, .grid-container {
1275        width: 1318px;
1276        }
1277        .grid-sizer,
1278        .grid-item { width: 25%;
1279        margin-bottom: 15px; }
1280        .grid-item-width2 {
1281        width: 50%;
1282        }
1283        .grid-item-width3, .grid-item-inner-width3 {
1284        width: 75%;
1285        }
1286        .grid-item-width4, .grid-item-inner-width4 {
1287        width: 100%;
1288      }
1289
1290  .grid-item-width5 {
1291    width: 100% !important;
1292  }
1293.grid-thumb {
1294	max-width: 100% !important;
1295	margin: 0 auto !important;
1296}
1297.previewanddownload-container {
1298	margin-bottom: 5px;
1299}
1300.grid-thumbP {
1301	height: 427px;
1302}
1303.grid-thumbL {
1304	height: 214px;
1305}
1306.grid-thumbB {
1307	height: 63px;
1308}
1309.grid-thumbV, .grid-thumbsb7261, .grid-thumbsb7246, .grid-thumbsb12011 {
1310  height: 500px;
1311}
1312
1313.grid-thumbBPPL.grid-thumbB, .grid-thumbBPP.grid-thumbB, .grid-thumbBBBBBB.grid-thumbB, .grid-thumbBBBBB.grid-thumbB, .grid-thumbBBB.grid-thumbB, .grid-thumbBB.grid-thumbB {
1314	margin-bottom: 5px !important;
1315}
1316
1317.grid-thumbsb3352 {
1318    height: 132px;
1319}
1320.grid-thumbsb10594 {
1321  height: 340px;
1322}
1323.grid-thumbsb9448 {
1324  height: 885px;
1325}
1326.grid-thumbsb11583 {
1327  height: 767px;
1328}
1329.grid-thumbS {
1330	height: 302px;
1331}
1332.grid-thumbBdouble {
1333	height: 134px;
1334}
1335.grid-thumbE {
1336	height: 228px;
1337}
1338
1339.flag_listing {
1340	width: 28px;
1341    height: 20px;
1342    margin-right: 5px;
1343    opacity: 0.9;
1344}
1345
1346.listing-label {
1347	margin: 0 !important;
1348}
1349
1350
1351.grid-header {
1352      border-top: 9px solid #ccccff;
1353      background: #E5E5FF;
1354      width: 100%;
1355      max-width: 1650px;
1356      visibility: visible;
1357    }
1358.grid-header span {
1359  font-size: 25px;
1360  margin-left: 5px;
1361  line-height: 40px;
1362}
1363
1364
1365
1366@media only screen and (max-width: 1820px) { 
1367  .grid-container__ad1, .grid-container__ad2 {
1368      display: none;
1369  }
1370}
1371
1372
1373
1374    @media only screen and (max-width: 1318px) { 
1375        .grid, #featuretitlebox, .grid-container {
1376        width: 986px;
1377        }
1378        .grid-sizer,
1379        .grid-item { width: 33.33%;
1380        margin-bottom: 15px; }
1381        .grid-item-width2 {
1382        width: 66.66%;
1383        }
1384        .grid-item-width3, .grid-item-width4, .grid-item-inner-width4 {
1385        width: 100%;
1386        }
1387    }
1388
1389
1390    @media only screen and (max-width: 986px) { 
1391        .grid, #featuretitlebox, .grid-container {
1392        width: 654px;
1393        }
1394        .grid-sizer,
1395        .grid-item { width: 50%;
1396        margin-bottom: 15px; }
1397        .grid-item-width2, .grid-item-width3, .grid-item-inner-width3, .grid-item-width4, .grid-item-inner-width4 {
1398        width: 100%;
1399        }
1400    }
1401
1402    @media only screen and (max-width: 654px) { 
1403        .grid, #featuretitlebox, .grid-container {
1404        width: 100%;
1405        }
1406        .grid-sizer,
1407        .grid-item { width: 100%;
1408        margin-bottom: 15px; }
1409        .grid-item-width2, .grid-item-width3, .grid-item-inner-width3, .grid-item-width4, .grid-item-inner-width4, .grid-item-inner  {
1410        width: 100%;
1411        }
1412		.grid-thumb {
1413			max-height: unset;
1414   			max-width: unset;
1415		}
1416		.previewanddownload-container {
1417		max-width: 450px;
1418		margin: 0 auto;
1419    margin-bottom: 5px;
1420    width: 308px;
1421		}
1422    .grid-thumbBdouble {
1423	height: 64px;
1424  }
1425    }
1426
1427
1428.grid-container {
1429  position: relative;
1430  margin: 0 auto;
1431}
1432
1433
1434.grid-container__ad1, .grid-container__ad2 {
1435  height: 600px;
1436  width: 160px;
1437  position: absolute;
1438  top: 0;
1439}
1440
1441.grid-container__ad1 ins, .grid-container__ad2 ins {
1442  background-color: unset;
1443}
1444.grid-container__ad1 {
1445  left: -180px;
1446}
1447.grid-container__ad2 {
1448  right: -180px;
1449}
1450</style> 
1451 
1451<script>
1452 const resourceEles = [];
1453 let loadLock = false;
1454			const isScrolledIntoView = (above = 0, div = ".loader2") =>
1455			{
1456				if ($(div).offset().top < above) {return true}
1457				const docViewTop = $(window).scrollTop();
1458				const docViewBottom = docViewTop + window.innerHeight;
1459				let elemTop = $(div).offset().top - above;
1460				if (elemTop < 0) {
1461					elemTop = 0;
1462				}
1463				let elemBottom = elemTop + $(div).height();
1464				if (elemBottom < 0) {
1465					elemBottom = 0;
1466				}
1467				const isInView = ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
1468				//console.log(div, isInView, elemBottom, docViewBottom, elemTop, docViewTop);
1469				return isInView;
1470			}
1471
1472			const isEmpty = value => 
1473				value === undefined ||
1474				value === false ||
1475				value === null ||
1476			(typeof value === 'object' && Object.keys(value).length === 0) ||
1477			(typeof value === 'string' && value.trim().length === 0)
1478 </script>
1478
1479 <div class=grid-container>
1480    <div class="grid-container__ad1">
1481        
1481<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
1481
1482        <!-- grid outlying leaderboard -->
1483        <ins class="adsbygoogle"
1484            style="display:inline-block;width:160px;height:600px"
1485            data-ad-client="ca-pub-3041606403452784"
1486            data-ad-slot="5690823497"></ins>
1487        
1487<script>
1488            (adsbygoogle = window.adsbygoogle || []).push({});
1489        </script>
1489
1490    </div><!-- grid-container__ad1 -->
1491    <div class="grid-container__ad2">
1492        
1492<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
1492
1493        <!-- grid outlying leaderboard -->
1494        <ins class="adsbygoogle"
1495            style="display:inline-block;width:160px;height:600px"
1496            data-ad-client="ca-pub-3041606403452784"
1497            data-ad-slot="5690823497"></ins>
1498        
1498<script>
1499            (adsbygoogle = window.adsbygoogle || []).push({});
1500        </script>
1500
1501    </div><!-- grid-container__ad2 -->
1502    <div class="grid center-block clearfix">
1503          <div class="activate-grid" style="width: 0, height: 0;"></div>
1504          <div class="grid-sizer"></div>
1505        
1505<script>
1506let pageType = "test";
1507
1508 
1509		pageType = "category";
1510		let requests = 0;
1511let LoadedIDs = [9999999999];
1512
1513LoadedIDs.push(2537)
1514
1515let firstLoad = true;
1516let noPosts = false;
1517
1518categories = [];
1519notCategories = [];
1520let arg = 1;
1521let posts = [];
1522let hasPreloadedPosts = false;
1523</script>
1523
1524
1525 
1526		
1526<script> LoadedIDs.push(7275); </script>
1526
1527		        <article class="grid-item grid-item-nativeAd" style="visibility: visible">
1528        <div class="nativeAd grid-item-inner ad">
1529        
1529<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
1529
1530        <ins class="adsbygoogle"
1531            style="display:block"
1532            data-ad-format="fluid"
1533            data-ad-layout-key="-6i+em+z-4g+66"
1534            data-ad-client="ca-pub-3041606403452784"
1535            data-ad-slot="2252164605"></ins>
1536        
1536<script>
1537            (adsbygoogle = window.adsbygoogle || []).push({});
1538        </script>
1538
1539        </div>
1540        </article>
1541
1542                <article class="grid-item " style="visibility: visible">
1543            <div class="grid-item-inner grid-item-inner-post ">
1544                <div class="grid-item-inner-container grid-item-">
1545                    <a href="https://www.sparklebox.co.uk/4391-4400/sb4392.html">
1546                        <div class="previewanddownload-container">
1547                                                                    <img class="grid-thumb grid-thumbBB grid-thumbB" src="https://www.sparklebox.co.uk/wp-content/uploads/1-817-listing.jpg" style="min-height: 56px;">
1548                                                                    <img class="grid-thumb grid-thumbBB grid-thumbB" src="https://www.sparklebox.co.uk/wp-content/uploads/2-646-listing.jpg" style="min-height: 56px;">
1549                                                         <img class="previewanddownload" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/previewanddownload.png">
1550                        <img class="listing-label" src="">
1551                        </div>
1552                    </a>
1553                    <a href="https://www.sparklebox.co.uk/4391-4400/sb4392.html">
1554                            <span>Topic/Topics Display Banners (SB4392)</span>
1555                    </a>
1556                    <p>Simple printable banners for your classroom topic/topics display board</p>
1557                    <img src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/flags/small/afrikaans.jpg" class="flag_listing"><img src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/flags/small/german.jpg" class="flag_listing"><img src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/flags/small/greek.jpg" class="flag_listing">            
1558                </div>
1559            </div>
1560        </article>
1561         
1562		
1562<script> LoadedIDs.push(7399); </script>
1562
1563		        <article class="grid-item " style="visibility: visible">
1564            <div class="grid-item-inner grid-item-inner-post ">
1565                <div class="grid-item-inner-container grid-item-editable">
1566                    <a href="https://www.sparklebox.co.uk/previews/8551-8575/sb8559-editable-topic-book-covers.html">
1567                        <div class="previewanddownload-container">
1568                                                                    <img class="grid-thumb grid-thumbPP grid-thumbP" src="https://www.sparklebox.co.uk/wp-content/uploads/1-830-listing.jpg" style="min-height: 56px;">
1569                                                         <img class="previewanddownload" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/previewanddownload.png">
1570                        <img class="listing-label" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/listing-label-editable.png">
1571                        </div>
1572                    </a>
1573                    <a href="https://www.sparklebox.co.uk/previews/8551-8575/sb8559-editable-topic-book-covers.html">
1574                            <span>Editable Topic Book Covers (SB8559)</span>
1575                    </a>
1576                    <p>Printable book covers for your topic books or folders</p>
1577                                
1578                </div>
1579            </div>
1580        </article>
1581         
1582		
1582<script> LoadedIDs.push(89644); </script>
1582
1583		 
1584        <article class="grid-item grid-item-tallAd" style="visibility: visible">
1585            <div class="tallAd grid-item-inner ad">
1586                
1586<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
1586
1587                    <ins class="adsbygoogle" style="display: block; width: 300px; height: 600px" data-ad-client="ca-pub-3041606403452784" data-ad-slot="4747713241"></ins>
1588                
1588<script>
1589                    (adsbygoogle = window.adsbygoogle || []).push({});
1590                </script>
1590
1591            </div>
1592        </article>
1593                <article class="grid-item " style="visibility: visible">
1594            <div class="grid-item-inner grid-item-inner-post ">
1595                <div class="grid-item-inner-container grid-item-">
1596                    <a href="https://www.sparklebox.co.uk/previews/11876-11900/sb11886-we-are-learning-about-banners.html">
1597                        <div class="previewanddownload-container">
1598                                                                    <img class="grid-thumb grid-thumbBBBBB grid-thumbB" src="https://www.sparklebox.co.uk/wp-content/uploads/1-10554-listing.jpg" style="min-height: 56px;">
1599                                                                    <img class="grid-thumb grid-thumbBBBBB grid-thumbB" src="https://www.sparklebox.co.uk/wp-content/uploads/2-8468-listing.jpg" style="min-height: 56px;">
1600                                                                    <img class="grid-thumb grid-thumbBBBBB grid-thumbB" src="https://www.sparklebox.co.uk/wp-content/uploads/3-7357-listing.jpg" style="min-height: 56px;">
1601                                                         <img class="previewanddownload" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/previewanddownload.png">
1602                        <img class="listing-label" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/listing-label-editable.png">
1603                        </div>
1604                    </a>
1605                    <a href="https://www.sparklebox.co.uk/previews/11876-11900/sb11886-we-are-learning-about-banners.html">
1606                            <span>We Are Learning About… Display Banners (SB11886)</span>
1607                    </a>
1608                    <p>A set of printable banners that each print over 3 landscape pages</p>
1609                                
1610                </div>
1611            </div>
1612        </article>
1613         
1614		
1614<script> LoadedIDs.push(5941); </script>
1614
1615		        <article class="grid-item grid-item-width2" style="visibility: visible">
1616            <div class="grid-item-inner grid-item-inner-post grid-item-inner-width2">
1617                <div class="grid-item-inner-container grid-item-">
1618                    <a href="https://www.sparklebox.co.uk/previews/sb12032-our-topic-wall-display-banner/">
1619                        <div class="previewanddownload-container">
1620                                                                    <img class="grid-thumb grid-thumbB grid-thumbBdouble" src="https://www.sparklebox.co.uk/wp-content/uploads/1-658-listingL.jpg" style="min-height: 56px;">
1621                                                         <img class="previewanddownload" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/previewanddownload.png">
1622                        <img class="listing-label" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/listing-label-editable.png">
1623                        </div>
1624                    </a>
1625                    <a href="https://www.sparklebox.co.uk/previews/sb12032-our-topic-wall-display-banner/">
1626                            <span>Our Topic Wall Display Banner (SB12032)</span>
1627                    </a>
1628                    <p>A banner that prints over 3 landscape pages for your classroom Topic Wall display board</p>
1629                                
1630                </div>
1631            </div>
1632        </article>
1633         
1634		
1634<script> LoadedIDs.push(5954); </script>
1634
1635		        <article class="grid-item " style="visibility: visible">
1636            <div class="grid-item-inner grid-item-inner-post ">
1637                <div class="grid-item-inner-container grid-item-">
1638                    <a href="https://www.sparklebox.co.uk/previews/sb12033-our-topic-wall-display-poster/">
1639                        <div class="previewanddownload-container">
1640                                                                    <img class="grid-thumb grid-thumbL grid-thumbL" src="https://www.sparklebox.co.uk/wp-content/uploads/1-660-listing.jpg" style="min-height: 56px;">
1641                                                         <img class="previewanddownload" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/previewanddownload.png">
1642                        <img class="listing-label" src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/listing-label-editable.png">
1643                        </div>
1644                    </a>
1645                    <a href="https://www.sparklebox.co.uk/previews/sb12033-our-topic-wall-display-poster/">
1646                            <span>Our Topic Wall Display Poster (SB12033)</span>
1647                    </a>
1648                    <p>A printable A4 heading for your classroom Topic Wall display board</p>
1649                                
1650                </div>
1651            </div>
1652        </article>
1653        
1653<script>
1654	posts = [];
1655	console.log(posts);
1656	posts.forEach((post) => {
1657		LoadedIDs.push(post.ID);
1658	})
1659
1660 $(document).ready(function() {
1661   
1662  //console.log("Ready");		
1663  const $gridJS = $('.grid').masonry({
1664  itemSelector: ".grid-item",
1665  columnWidth: '.grid-sizer',
1666    percentPosition: true,
1667    stagger: 30,
1668
1669  })
1670
1671  $gridJS.masonry('layout'); // arrange preloaded
1672  $gridJS.on('layoutComplete', () => {console.log("layout done")});
1673
1674  
1675
1676  const toggleLoader = (show = true) => {
1677	if(!show) {
1678	$( ".loader2" ).css( "display", "none" );
1679	} else {
1680		$( ".loader2" ).css( "display", "block");
1681	}
1682  };
1683
1684  const hideGrid = () => {
1685	document.getElementsByClassName('grid-container')[0].style.display = "none";
1686  }
1687
1688  
1689	const appendToGrid = (fragment, loads) => {
1690			const googlePush = () => {
1691					//console.log("googlePush");
1692					try {
1693					(adsbygoogle = window.adsbygoogle || []).push({});
1694					}
1695					catch(err) {
1696						 console.error(err.message);
1697						}
1698					}
1699		// append items to grid
1700			fragment.forEach(item => {
1701				const {html, type} = item;
1702				$gridJS.append( html );
1703				$gridJS.masonry( 'appended', html ); 
1704				if (type === "ad") {
1705					googlePush();
1706				}
1707			})
1708	};
1709	
1710
1711	const createGridItem = (posts, fragment = [], loads) => {
1712
1713	if(isEmpty(posts)) {
1714		noPosts = true;
1715		return;
1716	}
1717	const {title, link, images, description, isPhoto, isCollection, doubleWidth, overLayImage, flags, thumbLabel, thumbLabelSRC, numberOfImages, type, thumbnailCode, ID, adUnit} = posts[0];
1718	const gridItem = document.createElement('article');
1719
1720	let gridAdScript, gridAdIns, gridAdDiv;
1721	switch (type) {
1722		case "post":
1723			let hasDescription = true;
1724			if (isPhoto || isCollection) {
1725				hasDescription = false;
1726			}
1727			
1728				gridItem.className = "grid-item";
1729				gridItem.style.visibility = "visible";
1730
1731			const gridItemInner = document.createElement('div');
1732				gridItemInner.className = "grid-item-inner grid-item-inner" + loads + " grid-item-inner-post";
1733			const gridItemInnerContainer = document.createElement('div');
1734				gridItemInnerContainer.className = "grid-item-inner-container grid-item-";
1735			const ahref = document.createElement('a');
1736				ahref.setAttribute("href", link);
1737			const ahref2 = document.createElement('a');
1738				ahref2.setAttribute("href", link);
1739			const ahref3 = document.createElement('a');
1740				ahref3.setAttribute("href", link);
1741			const previewAndDownloadContainer = document.createElement('div');
1742				previewAndDownloadContainer.className = "previewanddownload-container";
1743			
1744			const gridThumbs = [];
1745			let thumbCodeIsSB = false;
1746			// check if thumbcode is normal e.g. PPPP or is an SB number e.g. sb1235
1747			if (/\d/.test(thumbnailCode) || thumbnailCode === undefined || thumbnailCode === "undefined") {
1748				thumbCodeIsSB = thumbnailCode;
1749			}
1750			images.forEach((image, index) => {
1751				let thumbLetter;
1752				if (index < numberOfImages) {
1753				if (thumbCodeIsSB != false) {
1754					thumbLetter = thumbCodeIsSB;
1755				} else {
1756					thumbLetter = thumbnailCode[index];
1757				}
1758				if (doubleWidth) {
1759					thumbLetter = thumbLetter + "double";
1760				}
1761
1762				thumbImg = document.createElement('img');
1763				thumbImg.className = "grid-thumb" + " grid-thumb" + thumbnailCode  + " grid-thumb" + thumbLetter;
1764				thumbImg.setAttribute("src", image);
1765				thumbImg.style.minHeight = "56px";
1766				gridThumbs.push(thumbImg);
1767			}
1768			});
1769			let flagImages;
1770			if (!isEmpty(flags)) {
1771				flagImages = flags.map(flag => {
1772					flagImg = document.createElement('img');
1773					flagImg.className = "flag_listing";
1774					flagImg.setAttribute("src", flag);
1775					return flagImg;
1776				})
1777			}
1778			const previewAndDownload = document.createElement('img');
1779				previewAndDownload.setAttribute("src", overLayImage);
1780				previewAndDownload.className = "previewanddownload";
1781	
1782
1783
1784			let labelEle;
1785			if (!isEmpty(thumbLabel)) {
1786				labelEle = document.createElement('img');
1787				labelEle.className = "listing-label";
1788				labelEle.setAttribute("src", thumbLabelSRC);
1789			}
1790			const titleSpan = document.createElement('span');
1791				titleSpan.innerHTML = title;
1792			let descriptionP;
1793			if (hasDescription) {
1794				descriptionP = document.createElement('p');
1795				descriptionP.innerHTML = description;
1796			}
1797
1798			if (!isEmpty(doubleWidth)) {
1799				gridItem.className = gridItem.className + "  grid-item-width2";
1800				gridItemInner.className = gridItemInner.className + " grid-item-inner-post grid-item-inner-width2";
1801			} 
1802
1803			if (!isEmpty(thumbLabel)) {
1804				gridItemInnerContainer.className = gridItemInnerContainer.className + thumbLabel;
1805			}
1806
1807			ahref.appendChild(titleSpan);
1808			
1809				gridItemInner.appendChild(ahref);
1810					gridItemInner.appendChild(gridItemInnerContainer);
1811					gridThumbs.forEach(gT => {
1812						previewAndDownloadContainer.appendChild(gT);
1813					})
1814
1815					previewAndDownloadContainer.appendChild(previewAndDownload);
1816					if (!isEmpty(thumbLabel)) {
1817						previewAndDownloadContainer.appendChild(labelEle);
1818					}
1819
1820					
1821					ahref2.appendChild(previewAndDownloadContainer);
1822					ahref3.appendChild(titleSpan);
1823					gridItemInnerContainer.appendChild(ahref2);
1824					gridItemInnerContainer.appendChild(ahref3);
1825
1826					
1827					if (hasDescription) {
1828						gridItemInnerContainer.appendChild(descriptionP);
1829					}
1830					if (!isEmpty(flags)) {
1831						flagImages.forEach( flgimg => {
1832							gridItemInnerContainer.appendChild(flgimg);
1833						})
1834					}
1835					
1836			gridItem.appendChild(gridItemInner);
1837		break;
1838		case "header":
1839		gridItem.className = "grid-header grid-item grid-item-width5";
1840		let headerSpan = document.createElement('span');
1841		headerSpan.className = "grilledcheese";
1842		headerSpan.innerHTML = title;
1843		gridItem.append(headerSpan);
1844		break;
1845		case "ad":
1846			switch (adUnit) {
1847			case "tall":
1848				gridItem.className = "grid-item grid-item-tallAd";
1849				gridItem.style.visibility = "visible";
1850				gridAdScript = document.createElement("script");
1851				gridAdScript.async = true;
1852				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1853				gridItem.append(gridAdScript);
1854				gridAdIns = document.createElement("ins");
1855				gridAdIns.className = "adsbygoogle";
1856				gridAdIns.style.display = "block";
1857				gridAdIns.style.width = "300px";
1858				gridAdIns.style.height = "600px";
1859				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1860				gridAdIns.dataset.adSlot = "4747713241";
1861				gridAdDiv = document.createElement("div");
1862				gridAdDiv.className = "tallAd grid-item-inner ad";
1863				gridAdDiv.append(gridAdIns);
1864				gridItem.append(gridAdDiv);
1865			break;
1866			case "small":
1867				gridItem.className = "grid-item grid-item-smallAd";
1868				gridItem.style.visibility = "visible";
1869				gridAdIns = document.createElement("ins");
1870				gridAdIns.style.width = "300px";
1871				gridAdIns.style.height = "250px";
1872				gridAdIns.className = "adsbygoogle";
1873				gridAdIns.style.display = "block";
1874				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1875				gridAdIns.dataset.adSlot = "2858669266";
1876				gridAdDiv = document.createElement("div");
1877				gridAdDiv.className = "smallAd grid-item-inner ad";
1878				gridAdScript = document.createElement("script");
1879				gridAdScript.async = true;
1880				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1881				gridAdDiv.append(gridAdScript);
1882				gridAdDiv.append(gridAdIns);
1883				gridItem.append(gridAdDiv);
1884			break;
1885			case "tiny banner":
1886				gridItem.className = "grid-item grid-item-tinyBanner";
1887				gridItem.style.visibility = "visible";
1888				gridAdIns = document.createElement("ins");
1889				gridAdIns.style.backgroundColor = "transparent";
1890				gridAdIns.style.width = "320px";
1891				gridAdIns.style.height = "100px";
1892				gridAdIns.className = "adsbygoogle";
1893				gridAdIns.style.display = "block";
1894				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1895				gridAdIns.dataset.adSlot = "4697613518";
1896				gridAdDiv = document.createElement("div");
1897				gridAdDiv.className = "tinyBanner grid-item-inner ad";
1898				gridAdScript = document.createElement("script");
1899				gridAdScript.async = true;
1900				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1901				gridAdDiv.append(gridAdScript);
1902				gridAdDiv.append(gridAdIns);
1903				gridItem.append(gridAdDiv);
1904			break;
1905			case "tiny half banner":
1906				gridItem.className = "grid-item grid-item-tinyHalfBanner";
1907				gridItem.style.visibility = "visible";
1908				gridAdIns = document.createElement("ins");
1909				gridAdIns.style.backgroundColor = "transparent";
1910				gridAdIns.style.width = "320px";
1911				gridAdIns.style.height = "50px";
1912				gridAdIns.className = "adsbygoogle";
1913				gridAdIns.style.display = "block";
1914				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1915				gridAdIns.dataset.adSlot = "9159888116";
1916				gridAdDiv = document.createElement("div");
1917				gridAdDiv.className = "tinyHalfBanner grid-item-inner ad";
1918				gridAdScript = document.createElement("script");
1919				gridAdScript.async = true;
1920				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1921				gridAdDiv.append(gridAdScript);
1922				gridAdDiv.append(gridAdIns);
1923				gridItem.append(gridAdDiv);
1924			break;
1925			case "three columns":
1926				gridItem.className = "grid-item grid-item-width3 grid-item-threeColumns";
1927				gridItem.style.visibility = "visible";
1928				gridAdIns = document.createElement("ins");
1929				gridAdIns.style.width = "988px";
1930				gridAdIns.style.height = "320px";
1931				gridAdIns.className = "adsbygoogle";
1932				gridAdIns.style.display = "block";
1933				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1934				gridAdIns.dataset.adSlot = "4043007396";
1935				gridAdDiv = document.createElement("div");
1936				gridAdDiv.className = "threeColumns grid-item-inner grid-item-inner-width3 ad";
1937				gridAdScript = document.createElement("script");
1938				gridAdScript.async = true;
1939				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1940				gridAdDiv.append(gridAdScript);
1941				gridAdDiv.append(gridAdIns);
1942				gridItem.append(gridAdDiv);
1943			break;
1944			case "four columns":
1945				gridItem.className = "grid-item grid-item-width4 grid-item-fourColumns";
1946				gridItem.style.visibility = "visible";
1947				gridAdIns = document.createElement("ins");
1948				gridAdIns.style.width = "1200px";
1949				gridAdIns.style.height = "250px";
1950				gridAdIns.className = "adsbygoogle";
1951				gridAdIns.style.display = "block";
1952				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1953				gridAdIns.dataset.adSlot = "7351697011";
1954				gridAdDiv = document.createElement("div");
1955				gridAdDiv.className = "fourColumns grid-item-inner grid-item-inner-width4 ad";
1956				gridAdScript = document.createElement("script");
1957				gridAdScript.async = true;
1958				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1959				gridAdDiv.append(gridAdScript);
1960				gridAdDiv.append(gridAdIns);
1961				gridItem.append(gridAdDiv);
1962			break;
1963			case "links1":
1964				gridItem.className = "grid-item grid-item-links1";
1965				gridItem.style.visibility = "visible";
1966				gridAdIns = document.createElement("ins");
1967				gridAdIns.style.width = "200px";
1968				gridAdIns.style.height = "90px";
1969				gridAdIns.className = "adsbygoogle";
1970				gridAdIns.style.display = "block";
1971				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1972				gridAdIns.dataset.adSlot = "9347304968";
1973				gridAdDiv = document.createElement("div");
1974				gridAdDiv.className = "links1 grid-item-inner ad";
1975				gridAdScript = document.createElement("script");
1976				gridAdScript.async = true;
1977				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1978				gridAdDiv.append(gridAdScript);
1979				gridAdDiv.append(gridAdIns);
1980				gridItem.append(gridAdDiv);
1981			break;
1982			case "links2":
1983				gridItem.className = "grid-item grid-item-width3 grid-item-links2";
1984				gridItem.style.visibility = "visible";
1985				gridAdIns = document.createElement("ins");
1986				gridAdIns.style.width = "728px";
1987				gridAdIns.style.height = "15px";
1988				gridAdIns.className = "adsbygoogle";
1989				gridAdIns.style.display = "block";
1990				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
1991				gridAdIns.dataset.adSlot = "9347304968";
1992				gridAdDiv = document.createElement("div");
1993				gridAdDiv.className = "links2 grid-item-inner grid-item-inner-width3 ad";
1994				gridAdScript = document.createElement("script");
1995				gridAdScript.async = true;
1996				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
1997				gridAdDiv.append(gridAdScript);
1998				gridAdDiv.append(gridAdIns);
1999				gridItem.append(gridAdDiv);
2000			break;
2001			case "tinier banner":
2002				gridItem.className = "grid-item  grid-item-tinier-banner";
2003				gridItem.style.visibility = "visible";
2004				gridAdIns = document.createElement("ins");
2005				gridAdIns.style.backgroundColor = "transparent";
2006				gridAdIns.style.width = "234px";
2007				gridAdIns.style.height = "60px";
2008				gridAdIns.className = "adsbygoogle";
2009				gridAdIns.style.display = "block";
2010				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
2011				gridAdIns.dataset.adSlot = "6624405873";
2012				gridAdDiv = document.createElement("div");
2013				gridAdDiv.className = "tinier-banner grid-item-inner ad";
2014				gridAdScript = document.createElement("script");
2015				gridAdScript.async = true;
2016				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
2017				gridAdDiv.append(gridAdScript);
2018				gridAdDiv.append(gridAdIns);
2019				gridItem.append(gridAdDiv);
2020			break;
2021			case "square":
2022				gridItem.className = "grid-item  grid-item-square";
2023				gridItem.style.visibility = "visible";
2024				gridAdIns = document.createElement("ins");
2025				gridAdIns.style.width = "250px";
2026				gridAdIns.style.height = "250px";
2027				gridAdIns.className = "adsbygoogle";
2028				gridAdIns.style.display = "block";
2029				gridAdIns.dataset.adClient = "ca-pub-3041606403452784";
2030				gridAdIns.dataset.adSlot = "5220643108";
2031				gridAdDiv = document.createElement("div");
2032				gridAdDiv.className = "square grid-item-inner ad";
2033				gridAdScript = document.createElement("script");
2034				gridAdScript.async = true;
2035				gridAdScript.src = `//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js`;
2036				gridAdDiv.append(gridAdScript);
2037				gridAdDiv.append(gridAdIns);
2038				gridItem.append(gridAdDiv);
2039			break;
2040			default:
2041			console.error("AdUnit not recognised", adUnit);
2042			break;
2043		}
2044		break;
2045		default:
2046			console.error("Type not recognised", type);
2047		break;
2048	}
2049
2050	const obj = {html: gridItem, type};
2051	fragment.push(obj);
2052	posts.shift();
2053	toggleLoader(false);
2054		if (posts.length > 0) {
2055			return createGridItem(posts, fragment, loads);
2056		} else {
2057			appendToGrid(fragment, loads)
2058		}
2059	}
2060
2061
2062
2063	let loads = 0;
2064	let adData;
2065	adData = [{
2066		type: "ad",
2067		adUnit: "tall",
2068		positions: [1],
2069	},
2070	{
2071		type: "ad",
2072		adUnit: "small",
2073		positions: [13],
2074	},
2075	// {
2076	// 	type: "ad",
2077	// 	adUnit: "tiny banner",
2078	// 	positions: [13],
2079	// },
2080	// {
2081	// 	type: "ad",
2082	// 	adUnit: "tiny half banner",
2083	// 	positions: [14],
2084	// },
2085	// {
2086	// 	type: "ad",
2087	// 	adUnit: "links1",
2088	// 	positions: [7, 15],
2089	// },
2090	// {
2091	// 	type: "ad",
2092	// 	adUnit: "tinier banner",
2093	// 	positions: [9],
2094	// },
2095	// {
2096	// 	type: "ad",
2097	// 	adUnit: "square",
2098	// 	positions: [10],
2099	// },
2100	];
2101
2102
2103	// 2 row and less
2104	if (window.innerWidth < 986) {
2105		adData = [{
2106		type: "ad",
2107		adUnit: "tiny banner",
2108		positions: [13, 7],
2109	},
2110	{
2111		type: "ad",
2112		adUnit: "small",
2113		positions: [4, 10],
2114	}
2115	];
2116	}
2117
2118	
2119		const ifNoPosts = () => {
2120		let noPosts = false;
2121		switch(pageType) {
2122			case "single":
2123				pageType = "popular300";
2124				createGridItem([{type: "header", title: "More From Around The Site..."}])
2125				noPosts = false; //fixme
2126			break;		
2127			case "popular300":
2128				pageType = "popular200";
2129
2130				getPosts({doPostRequest: true})
2131			break;
2132			case "popular200":
2133				pageType = "popular100";
2134				getPosts({doPostRequest: true})
2135			break;
2136			default:
2137			noPosts = true;
2138			toggleLoader(false);
2139			console.error("No more posts", pageType)
2140			break;	
2141		}
2142	}
2143
2144		
2145
2146	const postsChecker = (label) => {
2147		const postArray = [];
2148		posts.map(post => {
2149			if (postArray.includes(post.title, label)) {
2150				console.error(post.title);
2151			}
2152			postArray.push(post.title);
2153		})
2154	}
2155		// seperate posts array
2156	const afterGetPosts = (newPosts = posts) => {
2157		postsChecker("afterGetPosts");
2158
2159		posts = newPosts;
2160		const postsToCreate = posts.splice(0, 15);
2161		adData.forEach((_adData, index) => {
2162			_adData.positions.forEach(position => {
2163				postsToCreate.splice(position-1, 0, _adData);
2164			});
2165			if (adData.length === index+1) {
2166				loads++;
2167				createGridItem(postsToCreate, [], loads);
2168			}
2169		})
2170
2171	}
2172	
2173	let gettingPosts = false;
2174
2175	// POST request
2176	const getPosts = (obj = {argNum: 0}) => {
2177		console.log(posts);
2178		toggleLoader(true);
2179		const {delayCreateGridItems, noCreateGridItems, doPostRequest, argNum} = obj;
2180		let arg;
2181		let dataToSend = {};
2182		if (isEmpty(delayCreateGridItems) && isEmpty(noCreateGridItems)) {
2183			afterGetPosts();
2184		}
2185		if (!isEmpty(doPostRequest)) {
2186			if (!gettingPosts) {
2187				gettingPosts = true;
2188
2189				const dataToSend = {LoadedIDs};
2190									categories.push(2537);
2191									const req = () => {
2192
2193					if ((pageType === "single") || (pageType === "category") || (pageType === "categoryChildren")) {
2194						dataToSend.categories = categories;
2195						dataToSend.notCategories = notCategories;
2196					}
2197					let url;
2198					if (true === false) {
2199						url = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/ajax/posts.php?debug=debug";
2200					} else {
2201						url = "https://www.sparklebox.co.uk/wp-content/themes/sparklebox/ajax/posts.php";
2202
2203					}
2204					dataToSend.pageType = pageType;
2205					$.post(url, dataToSend)
2206					.done((res) => {
2207						requests++;
2208						gettingPosts = false;
2209						if (pageType === "single") {
2210							if (!isEmpty(res.categories)) {
2211								res.categories.forEach( cat => {
2212								if (!categories.includes(cat)) {
2213									categories.push(cat);
2214								}
2215								})
2216							}
2217							if (!isEmpty(res.notCategories)) {
2218								res.notCategories.forEach( cat => {
2219									if (!notCategories.includes(cat)) {
2220										notCategories.push(cat);
2221									}
2222								})
2223							}
2224						} else if (pageType === "category") {
2225							pageType = "categoryChildren";
2226						}
2227						if (isEmpty(res.data)) {
2228							// if (argNum < argTags[dataToSend.pageType].length) {
2229							// 	argNum++;
2230							// 	// make request again
2231							// 	return req(); 
2232							// } else { 
2233								ifNoPosts();
2234						//	}
2235						} else {
2236							toggleLoader(false);
2237							LoadedIDs = LoadedIDs.concat(res.IDs);
2238							posts = posts.concat(res.data);
2239
2240							if (!isEmpty(delayCreateGridItems) && isEmpty(noCreateGridItems)) {
2241								afterGetPosts(posts);
2242							}
2243						}
2244					})
2245				}
2246				req();
2247
2248			}
2249		}
2250	}
2251
2252	let adsSticky = false;
2253
2254	window.onscroll = function() {
2255
2256	if (!adsSticky) {
2257		if (($(".grid-container__ad1").offset().top - $(window).scrollTop()) <= 125) {
2258			adsSticky = true;
2259			$(".grid-container__ad1").css("left", $(".grid-container__ad1").offset().left + "px"); 
2260			$(".grid-container__ad1").css("top", "125px"); 
2261			$(".grid-container__ad1").css("position", "fixed");
2262			$(".grid-container__ad2").css("left", $(".grid-container__ad2").offset().left + "px"); 
2263			$(".grid-container__ad2").css("top", "125px"); 
2264			$(".grid-container__ad2").css("position", "fixed");
2265			$(".fixedpositionadcontainer").css("display", "none");
2266		}
2267	} 
2268	const getParamsGetPost = () => {
2269			postsChecker("isScrolledIntoView");
2270			if (posts.length <= 0) {
2271			//console.log("run out");
2272				getPosts({doPostRequest: true, delayCreateGridItems: true});	
2273			} else if (posts.length <= 60) {
2274				//console.log("getting reserve");
2275				getPosts({doPostRequest: true})
2276			} else {
2277				//console.log("posts NO get", posts);
2278				getPosts();
2279			} 
2280	}
2281
2282		if (!noPosts) {
2283			let inView = false;
2284			if (firstLoad) {
2285				inView = isScrolledIntoView(1000,".activate-grid");
2286			} else {
2287				inView = isScrolledIntoView(600,".loadingPoint");
2288			}
2289			if (inView) {
2290				firstLoad = false;
2291				getParamsGetPost();
2292			}
2293
2294		} else {
2295			toggleLoader(false);
2296		}
2297	};
2298});
2299			
2300</script>
2300
2301    </div><!--  theGrid --> 
2302  </div><!--  gridcontainer --> 
2303  <div class="loader2 lds-hourglass"></div>
2304  <div class="loadingPoint"></div>
2305</div>
2306
2307		</div><!--  featuredresources --><div id="related_items_container" class="clear"> 
2308		<iframe id="featurecontainer" height="270px" src="" scrolling="no"></iframe>	</div> 					 <div id="mrelatedJS">
2309	 <h1> Related Items </h1>
2310	  <div id="mrelatedJSinner" style="margin-bottom: 15px;"> 
2311	 </div></div><iframe id="lightbox" src="about:blank"></iframe><style>
2312@media only screen and (max-width: 1000px) {
2313	#preview-footer {
2314		display: none;
2315	}
2316}
2317</style>
2318
2319 <div id="adsense_footer" class="banner-fullwidth ad clear"> 
2320							   
2320<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
2320
2321						<!-- general_listings_728x90 -->
2322						<ins class="adsbygoogle"
2323							 data-ad-client="ca-pub-3041606403452784"
2324							 data-ad-slot="6924453242"
2325							 data-ad-format="auto"
2326							 ></ins>
2327						
2327<script>
2328						(adsbygoogle = window.adsbygoogle || []).push({});
2329						</script>
2329
2330							  </div> 
2331<div style="width: 100%;" class="lightblue clear"> </div>
2332<div id="preview-footer" class="lightblue clear">
2333<div id="footer-main"> 
2334<div id="footer-left">
2335<a href="https://www.sparklebox.co.uk">
2336<img src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/logo_top.png"></a>
2337<p>© Copyright SparkleBox Teacher Resources (UK) Ltd. <span>&nbsp;<a href="https://www.sparklebox.co.uk/about/" class="C-10">About Us</a> | <a href="https://www.sparklebox.co.uk/about/terms.html" class="C-10">Terms and Conditions of Use</a> | <a href="https://www.sparklebox.co.uk/copyright/" class="C-10">Copyright</a> | <a href="https://www.sparklebox.co.uk/about/privacy.html" class="C-10">Privacy Policy</a> | <a href="https://www.sparklebox.co.uk/about/cookie-policy.html" class="C-10">Cookie Policy</a> | <a href="https://www.sparklebox.co.uk/faq/" class="C-10">FAQ</a></span></p>
2338
2339
2340	<!-- AddThis Button BEGIN -->
2341	<span id="footer-left-addthislabel"> Follow Us: </span>
2342 <div id="footer-left-addthis">
2343<div class="addthis_toolbox addthis_32x32_style addthis_default_style">
2344<a class="addthis_button_twitter_follow" addthis:userid="sparklebox"></a>
2345<a class="addthis_button_google_follow" addthis:userid="105965356921869447283"></a>
2346<a class="addthis_button_pinterest_follow" addthis:userid="sparkleboxtr"></a>
2347<a class="addthis_button_rss_follow" addthis:url="https://feeds.feedburner.com/co/djxf"></a> 
2348
2349</div> <!-- class = addthis_toolbox  -->
2350</div> <!--  footer-left-addthis -->
2351</div> <!--  footer-left -->
2352<div id="footer-right">
2353<a href="https://www.sparklebox.co.uk">
2354<img src="https://www.sparklebox.co.uk/wp-content/themes/sparklebox/images/bump_yellow.png"> 
2355</a>
2356
2357</div> <!--  div id="footer-right -->
2358</div> <!--  footer-main -->
2359
2360</div> <!--  site-footer  -->
2361<script type="text/javascript" src="https://s7.addthis.com/js/300/addthis_widget.js#pubid=sparklebox"></script>
2361 
2362<script type="text/javascript">
2363var addthis_config = {
2364          services_exclude: 'print',
2365		  data_track_clickback: false,
2366        //    "data_track_addressbar":true,
2367          data_ga_property: 'UA-134024-2',
2368          ui_cobrand: "SparkleBox"
2369} 
2370</script>
2370 
2371</body>
2372</html>
2373
2374
2375<!-- Dynamic page generated in 0.376 seconds. -->
2376<!-- Cached page generated by WP-Super-Cache on 2026-10-03 15:48:56 -->
2377
2378<!-- Compression = gzip -->

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.