Found the css for it.
<div class="material-placeholder" style="width: 458px; height: 224px; position: relative; top: 0px; left: 0px;">
<div id="materialbox-overlay" style="opacity: 1; width: 1661px; height: 882px; left: 0px; top: 0px;"></div>
<img data-v-19407b35="" src="..." class="materialboxed active" style="object-position: 50% 50%; object-fit: cover; position: absolute; z-index: 1000; will-change: left, top, width, height; height: 731.13px; width: 1494.9px; left: -1101.95px; top: -232.565px;">
</div>
Changing the img to width: 100%; height: 100%; seems to inherit the parent div with the 458x224 dimensions. Is there any way to have the img be 100% w/h and cropped it necessary? I want the zoomed media to cover the entire screen.