rem font-size not rendering properly in css animation - html

Question

So I'm trying to have a sentence where certain words are animated (rotated through) - I thought it was working, but once I viewed the site on my mobile I found an issue.
When viewed on a desktop (and even inside dev tools), the animated text is rendered in the correct size. However, once I view it on a mobile device (iPhone), the text becomes super small
I'm also using bootstrap on the page so I thought that maybe something was being overridden. But as you can see I've basically removed all the bootstrap classes and it still isn't working.
.animated span {
color: #007bff;
font-size: 0;
opacity: 0;
-ms-animation: topToBottom 10s infinite;
-webkit-animation: topToBottom 10s infinite;
animation: topToBottom 10s infinite;
}
.animated span:nth-child(2) {
-ms-animation-delay: 2s;
-webkit-animation-delay: 2s;
animation-delay: 2s;
}
.animated span:nth-child(3) {
-ms-animation-delay: 4s;
-webkit-animation-delay: 4s;
animation-delay: 4s;
}
.animated span:nth-child(4) {
-ms-animation-delay: 6s;
-webkit-animation-delay: 6s;
animation-delay: 6s;
}
.animated span:nth-child(5) {
-ms-animation-delay: 8s;
-webkit-animation-delay: 8s;
animation-delay: 8s;
}
#-webkit-keyframes topToBottom {
0%,
20% {
font-size: 2.5rem;
opacity: 1;
}
/* visible for 1s */
20.01%,
100% {
opacity: 0;
font-size: 0rem;
}
<h1 class=" cover-heading animated">TribePulse replaces <br />
<span>status updates</span>
<span>engagement surveys</span>
<span>progress reports</span>
<span>status meetings</span>
<span>EoD emails</span>
</h1>
Demo on glitch: https://empty-cemetery.glitch.me/
When you view it on desktop, all the blue writing is the correct size. However, once you view it on mobile the animated text becomes tiny.

Answer 1

you can check how your page looks and performs on a mobile device:
https://developers.google.com/web/tools/chrome-devtools/device-mode/
you can also customize the contents using media queries.Media Queries for Standard Devices
If you want to know more info you can visit:
https://css-tricks.com/snippets/css/media-queries-for-standard-devices/