Как сделать видео внутри телефона на html?

div {
    position: absolute;
    top: 25%;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 auto;
}

HunteR-VRX, HunteR-VRX, Это в качестве наметок, от которых отталкиваться

HunteR-VRX, Не совсем понимаю как это оформить в виде html
Как то так?

<div class="device">
      <figure>
        <img src="img/iphone.png" alt="Embedded video in Iphone">
        <video width="" height="">
          <source src="movie.mp4" type="video/mp4">
        </video>
      </figure>
    </div>

Ord EO,

html:

<div class="parent">
    <img class="" src="" alt="" />
    <div class="videoBlock">
        <video width="" height="">
          <source src="movie.mp4" type="video/mp4">
        </video>
    </div>
</div>

css:

.parent {
    position: relative;
}

.videoBlock {
   position: absolute;
    top: 25%;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 auto;
}

Видео криво встанет из-за полосы верху телефона. Можешь попробовать её отрезать и сделать отдельным элементом, потом спозиционируешь и оно будет как будто поверх видео.