CSS/HTML code solution for multiple videos

Hi everyone. I am trying to finish up this portfolio flipbook. I have this CSS/HTML code placing and sizing a video in the upper right half of page 3.

CSS
.video1 {
width: 895px;
weight: 504px;
position: absolute;
left: 67px;
top: 30px;
}

HTML
<video class=”video1 play-on-shown pause-on-hide”
src=”https://artpocalypse.com/wp-content/uploads/2021/02/LEATHER_BW.mov”></video&gt;

I have 11 videos total and have been changing ‘video1’ and the src: for each new video/page. On completion, only the video on the first page plays. is there also a code solution that will LOOP each video once it starts to play?

Looking for a revised code solution that will work as intended for all videos. Thanks.

The page I need help with: [log in to see the link]