diff --git a/files/templates/comments.html b/files/templates/comments.html
index 26a2ce116..85efd9c8a 100644
--- a/files/templates/comments.html
+++ b/files/templates/comments.html
@@ -283,9 +283,17 @@
75% {transform: rotate(-{{c.award_count("tilt")}}deg);}
100% {transform: rotate(0deg);}
}
+ @media (max-width: 720px) {
+ @keyframes c{{c.id}}-tilt {
+ 0% {transform: rotate(0deg);}
+ 25% {transform: rotate({{c.award_count("tilt")/4}}deg);}
+ 75% {transform: rotate(-{{c.award_count("tilt")/4}}deg);}
+ 100% {transform: rotate(0deg);}
+ }
+ }
.comment-{{c.id}}-only {
animation-name: c{{c.id}}-tilt;
- animation-duration: 60s !important;
+ animation-duration: 30s !important;
animation-iteration-count: infinite !important;
animation-direction: alternate !important;
animation-timing-function: linear !important;
diff --git a/files/templates/submission.html b/files/templates/submission.html
index af0d16940..1d440b06a 100644
--- a/files/templates/submission.html
+++ b/files/templates/submission.html
@@ -536,6 +536,14 @@
75% {transform: rotate(-{{p.award_count("tilt")}}deg);}
100% {transform: rotate(0deg);}
}
+ @media (max-width: 720px) {
+ @keyframes post-tilt {
+ 0% {transform: rotate(0deg);}
+ 25% {transform: rotate({{p.award_count("tilt")/4}}deg);}
+ 75% {transform: rotate(-{{p.award_count("tilt")/4}}deg);}
+ 100% {transform: rotate(0deg);}
+ }
+ }
#post-root {
animation-name: post-tilt;
animation-duration: 60s !important;