text on video

[morrning]

how can i write text on video?

[locksy]

this should work

`<style>
#background {
position: relative;
background-color: black;
width: 100%;
height: 100%;
}

    video {
        width: 100%;
    }
    
    @mixin center() {
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        left: 50%;
        top: 50%;
    }
    
    #container {
        position: absolute;
        left: 5%;
        right: 0;
        top: 0;
        bottom: 0;
        height: 15%;
        margin: auto;
        color: rgb(243, 133, 0);
        font-size: 60pt;
        text-align: center;
        mix-blend-mode: difference;
        @include center();
    }
    
    .title {
        font-weight: 800;
        color: transparent;
        font-size: 120px;
        background: url("https://pbs.twimg.com/media/D0qmD4KX0AAjEap.jpg") repeat;
        background-position: 40% 50%;
        -webkit-background-clip: text;
        position: relative;
        text-align: center;
        letter-spacing: -8px;
    }
    
    .subtitle {
        display: block;
        text-align: center;
        padding-top: 10px;
        font-size: 1.7rem;
    }
</style> 

loading...

my website

    </div>
    <div id="video">
        <span>loading<br> my website</span>
        <video width="100%" height="100%" autoplay muted preload="auto">
      <source src="loader.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'>
      </video>
    </div>

`