html5のvideoタグで縦幅を指定したときに動画の中心を表示領域の中心にしたい

Question

現在以下のようなコードを書いています。
言葉では伝わりにくいのかもしれませんが、
以下のコードだと、動画の上部だけしか表示されません。
動画の中心を表示領域の中心としたいのですが、どのようにすればよろしいでしょうか。
また、その上で、以下のコードから不要な部分がございましたら同時に指摘をお願いしたいと思います。

<div class="top">
    <video autoplay loop muted poster="sample.jpg">
        <source src="./video/sample.mp4" type="video/mp4">
    </video>
</div>

video {
    top: 0;
    min-width:100%;
    min-height:100%;
    z-index:-100;
}

.top {
    height: 350px;
}

イメージとしては

上記の画像がもっと手の下が見えるようにしたいと思っています。

Comments

[kei344]

.topの記述は端折られていませんか？また、動画の縦横比かピクセルも質問文に追記していただけませんか？

Answer 1

    min-width:100%;
    min-height:100%;
    z-index:-100;
    position: relative;
    top: 50%;
    transform: translateY(-50%);

とすることで解決できました
kei344さん質問に回答いただいたのに申し訳ございません。
ありがとうございます！