HTML
<div class="about about-reverse">
<div class="left">
<div class="media_box media_box--small">
<img class="media_image" src="img/1_ART.jpg" alt="tyblue">
</div>
</div>
<div class="right">
<div class="media_box media_box--small">
<img class="media_image" src="img/1_IMG_FLOWER.jpg" alt="tyblue">
</div>
<div class="media_box media_box--small">
<img class="media_image" src="img/1_SKY.jpeg" alt="tyblue">
</div>
<div class="hero-video">
<div class="media_box media_box--backvideo">
<video loop autoplay class="media_image">
<source src="video/WEBSITEBACKGROUNDVIDEO.webm" type="video/webm">
<source src="video/WEBSITEBACKGROUNDVIDEO.mp4" type="video/mp4">
</video>
I wanted to share some of the HTML I used for my website. I was able to use this code to add a looping video to the background of my site! The HTML used allows the video to be responsive on any device or browser. I used Handbreak to turn my files into mp4/webm files to ensure that the videos were properly formatted.

