MP4 video won't play in iPhones and iPads.. any ideas?

HTML-CSS
1

Working on my client website and MP4 video won’t play in iPhones and iPads. I can’t seem to find the class in CSS files like “videocontainer”. So don’t think it has been told to be hidden in media query… Any ideas?

<section class="section hidden-xs hidden-sm" id="home">
    <div class="videocontainer">
	<a class="arrow bounce text-center black-color" href="#products" style="position:absolute;bottom:30px;right:20px;"> <span class="ti-mouse"></span> <span class="ti-angle-double-down"></span> </a>
     <video class="video" id="amorvideo" preload="auto" playsinline loop autoplay>
          <source src="video/amor.mp4" type="video/mp4" poster="video/video-backdrop.jpg">
          </video> 
    </div>
    
</section>
2

Maybe try using <iframe> instead of video? Not sure if that will work but just an idea.

3

.mp4 is a container. the codec used on the video inside the video may not be mac or ios compatible.Has it been played by itself on those devices?