diff --git a/files/assets/css/awards.css b/files/assets/css/awards.css
index a7ac4e538..8a31512c4 100644
--- a/files/assets/css/awards.css
+++ b/files/assets/css/awards.css
@@ -1,11 +1,17 @@
 #awards-container {
-position:fixed;
-pointer-events: none;
-z-index:9999;
+	position:fixed;
+	pointer-events: none;
+	z-index:9999;
 }
 
-#awards-container > div {
-position: absolute;
+.stackable-container > div {
+	position: absolute;
+}
+
+.stackable-container div,
+.stackable-container img, .ricardo {
+	animation-iteration-count: infinite !important;
+	animation-timing-function: linear !important;
 }
 
 /*seal*/
@@ -20,34 +26,18 @@ position: absolute;
 	}
 }
 
-.wholesome {animation: sealX 9s linear infinite}
-.wholesome img {animation: sealY 10s linear infinite}
+.wholesome {animation: sealX 9s alternate}
+.wholesome img {animation: sealY 10s alternate}
 
-.wholesome1 {animation-direction: alternate}
-.wholesome1 img {animation-direction: alternate}
-.wholesome2 {animation-direction: alternate-reverse}
-.wholesome2 img {animation-direction: alternate-reverse}
-.wholesome3 {animation-direction: alternate}
-.wholesome3 img {animation-direction: alternate-reverse}
-.wholesome4 {animation-direction: alternate-reverse}
-.wholesome4 img {animation-direction: alternate}
+.wholesome:nth-child(even),
+.wholesome:nth-child(n+2):nth-child(n+3) img
+{animation-direction: alternate-reverse}
 
 @keyframes sealX {
-	from {} to {transform: translateX(98vw)}
+	100% {transform: translateX(98vw)}
 }
 @keyframes sealY {
-	from {} to {transform: translateY(85vh)}
-}
-
-/*train common*/
-.train1, .scooter1 {top:2%}
-.train2, .scooter2 {top:27%}
-.train3, .scooter3 {top:52%}
-.train4, .scooter4 {top:77%}
-
-@keyframes train {
-	from {transform: translateX(-3vw)}
-	to {transform: translateX(99vw)}
+	100% {transform: translateY(85vh)}
 }
 
 /*train*/
@@ -62,9 +52,19 @@ position: absolute;
 	}
 }
 
-.train{animation: train 11s linear infinite;}
-.train:nth-of-type(odd) {animation-direction: reverse;}
-.train:nth-of-type(odd) img {transform: scaleX(-1);}
+.train:nth-child(1), .scooter:nth-child(1) {top:2%}
+.train:nth-child(2), .scooter:nth-child(2) {top:27%}
+.train:nth-child(3), .scooter:nth-child(3) {top:52%}
+.train:nth-child(4), .scooter:nth-child(4) {top:77%}
+
+.train {animation: train 12s;}
+.train:nth-child(odd) {animation-direction: reverse;}
+.train:nth-child(odd) img {transform: scaleX(-1);}
+
+@keyframes train {
+	from {transform: translateX(-3vw)}
+	to {transform: translateX(99vw)}
+}
 
 /*scooter*/
 .scooter img {
@@ -78,9 +78,9 @@ position: absolute;
 	}
 }
 
-.scooter {animation: train 11s linear infinite;}
-.scooter:nth-of-type(even) {animation-direction: reverse;}
-.scooter:nth-of-type(even) img {transform: scaleX(-1);}
+.scooter {animation: train 14s;}
+.scooter:nth-child(even) {animation-direction: reverse;}
+.scooter:nth-child(even) img {transform: scaleX(-1);}
 
 /*confetti*/
 .confetti {
@@ -102,9 +102,9 @@ position: absolute;
 	max-height: min(30vw,15rem);
 }
 
-.ricardo1 {animation: ricardo1Xa 5.8s linear infinite, ricardo1Xb 11.6s linear infinite, ricardo1Y 23.2s linear infinite;}
-.ricardo2 {animation: ricardo2 8.5s linear infinite;}
-.ricardo3 {animation: ricardo3 10s linear infinite;}
+.ricardo1 {animation: ricardo1Xa 5.8s, ricardo1Xb 11.6s, ricardo1Y 23.2s;}
+.ricardo2 {animation: ricardo2 8.5s;}
+.ricardo3 {animation: ricardo3 10s;}
 
 @keyframes ricardo1Xa {
 	0% {right: -200px}
diff --git a/files/templates/awards.html b/files/templates/awards.html
index 425735cd3..aca2b9963 100644
--- a/files/templates/awards.html
+++ b/files/templates/awards.html
@@ -1,14 +1,16 @@
 <div id="awards-container" class="w-100 h-100">
 {% macro stackable_award(award, src, alt) %}
+	<div class="stackable-container">
 	{% for i in range(min(p.award_count(award, v), 4)) %}
-		<div class="{{award}} {{award}}{{i+1}}">
+		<div class="{{award}}">
 			<img alt="{{alt}}" src="{{src}}">
 		</div>
 	{% endfor %}
+	</div>
 {% endmacro %}
 
 {% if p.award_count("wholesome", v) %}
-	{% set wholesome = '/i/wholesome.webp' if SITE_NAME == PCM else '/e/marseywholesome.webp' %}
+	{% set wholesome = '/i/wholesome.webp' if SITE_NAME == 'PCM' else '/e/marseywholesome.webp' %}
 	{{ stackable_award('wholesome', wholesome, ':#marseywholesome:') }}
 {% endif %}
 
@@ -22,7 +24,7 @@
 
 {% if p.award_count("firework", v) %}
 	<script defer src="{{'js/fireworks.js' | asset}}"></script>
-	{{ stackable_award('firework', i) }}
+	{{ stackable_award('firework') }}
 {% endif %}
 
 {% if p.award_count("confetti", v) %}
@@ -73,4 +75,8 @@
 	</style>
 {% endif %}
 
+{% if SITE_NAME == 'PCM' %}
+	{% include "awards_PCM.html" %}
+{% endif %}
+
 </div>
diff --git a/files/templates/awards_PCM.html b/files/templates/awards_PCM.html
index 0593e53cb..6de894d6c 100644
--- a/files/templates/awards_PCM.html
+++ b/files/templates/awards_PCM.html
@@ -1,199 +1,11 @@
 {% if p.award_count("croag", v) %}
-	<style>
-		.croag {
-			position:fixed;
-			z-index:9999;
-			pointer-events: none;
-		}
-		.croag1 {
-			top: 15%
-		}
-		.croag2 {
-			top: 40%
-		}
-		.croag3 {
-			top: 65%
-		}
-		.croag4 {
-			top: 90%
-		}
-		.croagimg {
-			width: 169px !important;
-			height: 68px !important;
-		}
-		@media (max-width: 992px) {
-			.croagimg {
-				width: 100px !important;
-				height: 40px !important;
-			}
-		}
-	</style>
-
-	<marquee class="croag croag1" direction="left" scrollamount=10 width="100%">
-		<img alt="croag" class="croagimg mirrored" src="/i/PCM/croag.webp?v=2000">
-	</marquee>
-
-	{% if p.award_count("croag", v) > 1 %}
-		<marquee class="croag croag2" direction="right" scrollamount=10 width="100%">
-			<img alt="croag" class="croagimg" src="/i/PCM/croag.webp?v=2000">
-		</marquee>
-	{% endif %}
-
-	{% if p.award_count("croag", v) > 2 %}
-		<marquee class="croag croag3" direction="left" scrollamount=10 width="100%">
-			<img alt="croag" class="croagimg mirrored" src="/i/PCM/croag.webp?v=2000">
-		</marquee>
-	{% endif %}
-
-	{% if p.award_count("croag", v) > 3 %}
-		<marquee class="croag croag4" direction="right" scrollamount=10 width="100%">
-			<img alt="croag" class="croagimg" src="/i/PCM/croag.webp?v=2000">
-		</marquee>
-	{% endif %}
+	{{ stackable_award('croag', '/i/PCM/croag.webp', 'croag') }}
 {% endif %}
 
 {% if p.award_count("toe", v) %}
-	{% if g.inferior_browser %}
-		<style>
-			.toeimg {
-				width: 100px !important;
-				height: auto !important;
-			}
-			@media (max-width: 992px) {
-				.toeimg {
-					width: 30px !important;
-					height: auto !important;
-				}
-			}
-			
-			.toe {
-				position:fixed;
-				z-index:9999;
-				pointer-events: none;
-				width: 100% !important;
-				height: 100% !important;
-			}
-			
-			@keyframes moveX {
-				from {} to {transform: translateX(98vw)}
-			}
-
-			@keyframes moveY {
-				from {} to {transform: translateY(90vh)}
-			}
-
-			.toe1 {
-				animation: moveX 4s linear 0s infinite alternate !important;
-				animation-delay:0s;
-			}
-			.toe1 > img {
-				animation: moveY 6.8s linear 0s infinite alternate !important;
-			}
-		</style>
-		<div class="toe toe1" height="100%" width="100%">
-			<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-		</div>
-		
-		{% if p.award_count("toe", v) > 1 %}
-			<style>
-				.toe2 {
-					animation: moveX 5s linear 0s infinite alternate !important;
-					animation-delay:1s;
-				}
-				.toe2 > img {
-					animation: moveY 8s linear 0s infinite alternate !important;
-					animation-delay:1s;
-				}
-			</style>
-			<div class="toe toe2" height="100%" width="100%">
-				<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-			</div>
-		{% endif %}
-		
-		{% if p.award_count("toe", v) > 2 %}
-			<style>
-				.toe3 {
-					animation: moveX 4s linear 0s infinite alternate !important;
-					animation-delay:2s;
-				}
-				.toe3 > img {
-					animation: moveY 5s linear 0s infinite alternate !important;
-					animation-delay:2s;
-				}
-			</style>
-			<div class="toe toe3" height="100%" width="100%">
-				<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-			</div>
-		{% endif %}
-		
-		{% if p.award_count("toe", v) > 3 %}
-			<style>
-				.toe4 {
-					animation: moveX 5s linear 0s infinite alternate !important;
-					animation-delay:3s;
-				}
-				.toe4 > img {
-					animation: moveY 6.8s linear 0s infinite alternate !important;
-					animation-delay:3s;
-				}
-			</style>
-			<div class="toe toe4" height="100%" width="100%">
-				<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-			</div>
-		{% endif %}
-	{% else %}
-		<style>
-			.toe {
-				position:fixed;
-				z-index:9999;
-				pointer-events: none;
-				width: 100% !important;
-				height: 100% !important;
-			}
-			.toeimg {
-				width: 100px !important;
-				height: auto !important;
-			}
-			@media (max-width: 992px) {
-				.toeimg {
-					width: 30px !important;
-					height: auto !important;
-				}
-			}
-		</style>
-		<div class="toe" height="100%" width="100%">
-			<marquee class="toe" scrollamount=10 behavior="alternate" direction="up" height="100%" width="100%">
-				<marquee direction="right" scrollamount=10 behavior="alternate" height="100%" width="100%">
-					<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-				</marquee>
-			</marquee>
-		</div>
-
-		{% if p.award_count("toe", v) > 1 %}
-			<marquee class="toe" scrollamount=10 behavior="alternate" direction="down" height="100%">
-				<marquee direction="right" scrollamount=10 behavior="alternate" width="100%">
-					<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-				</marquee>
-			</marquee>
-		{% endif %}
-
-		{% if p.award_count("toe", v) > 2 %}
-			<marquee class="toe" scrollamount=10 behavior="alternate" direction="up" height="100%">
-				<marquee direction="left" scrollamount=10 behavior="alternate" width="100%">
-					<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-				</marquee>
-			</marquee>
-		{% endif %}
-
-		{% if p.award_count("toe", v) > 3 %}
-			<marquee class="toe" scrollamount=10 behavior="alternate" direction="down" height="100%">
-				<marquee direction="left" scrollamount=10 behavior="alternate" width="100%">
-					<img alt="Blade's toe" class="toeimg" src="/i/PCM/toe.webp?v=2000">
-				</marquee>
-			</marquee>
-		{% endif %}		
-	{% endif %}
+	{{ stackable_award('toe', '/i/PCM/toe.webp', "Blade's toe") }}
 {% endif %}
+
 {% if p.award_count("crab", v) %}
 	<script>
 		let audio = new Audio('/assets/media/crab.mp3');
@@ -207,3 +19,45 @@
 		prepare_to_pause(audio)
 	</script>
 {% endif %}
+
+<style>
+	.toe img {
+		width: 100px !important;
+		height: auto !important;
+	}
+	@media (max-width: 992px) {
+		.toe img {
+			width: 30px !important;
+			height: auto !important;
+		}
+	}
+
+	.toe {animation: sealX 8s alternate; animation-delay: -1s}
+	.toe img {animation: sealY 11s alternate-reverse; animation-delay: -1s}
+
+	.toe:nth-child(even) {animation-direction: alternate-reverse}
+	.toe:nth-child(n+2):nth-child(n+3) img {animation-direction: alternate}
+
+	.croag img {
+		width: 169px !important;
+		height: 68px !important;
+	}
+	@media (max-width: 992px) {
+		.croag img {
+			width: 100px !important;
+			height: 40px !important;
+		}
+	}
+
+	.croag:nth-child(1) {top:2%}
+	.croag:nth-child(2) {top:27%}
+	.croag:nth-child(3) {top:52%}
+	.croag:nth-child(4) {top:77%}
+
+	.croag {margin-top:10vh; animation-delay:-1s !important}
+
+	.croag {animation: train 14s;}
+	.croag:nth-child(odd) {animation-direction: reverse;}
+	.croag:nth-child(odd) img {transform: scaleX(-1);}
+
+</style>
diff --git a/files/templates/submission.html b/files/templates/submission.html
index dcd4efd99..2f22bfc44 100644
--- a/files/templates/submission.html
+++ b/files/templates/submission.html
@@ -16,9 +16,6 @@
 </style>
 
 {% include "awards.html" %}
-{% if SITE_NAME == 'PCM' %}
-	{% include "awards_PCM.html" %}
-{% endif %}
 {% endblock %}
 {% set ups=p.upvotes %}
 {% set downs=p.downvotes %}