JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header">

            <div class="container-fluid">
                <div class="row-fluid">
                    <div class="holder span12 text-center">
                        <p><span>somthing</span> here</p>
                        <p id="p1">- this website is designed by bla bla bla -</p>
                    </div>
                </div>
            </div>

            <video id="bgvideo" autoplay loop poster="imgs/main_img.jpg">

                    <source src="http://www.w3schools.com/html/movie.ogg" type="video/ogg">

            </video>

        </div>

        <div class="service">
            <div class="container-fluid">
                <div class="row-fluid text-center">
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eveniet, impedit, fugit. Nisi laboriosam rem optio unde. Saepe harum iusto, provident atque similique nulla dolore ad, sint esse asperiores enim eligendi.</p>

                    <p>Laborum magnam dolorem perferendis, ut, aut maxime. Quia dolores, sequi id architecto ea incidunt magni, enim maiores provident suscipit repellat voluptate possimus! Deserunt, quisquam non! Harum a architecto, quas tempora.</p>

                    <p>Ut nemo eligendi consequuntur reprehenderit cupiditate eveniet eos odit ducimus molestiae vitae, maxime ullam, praesentium dolores labore fuga alias eum hic ipsa similique voluptates repellendus. Aliquam facilis, cum fugiat tempora.</p>

                </div>
            </div>
        </div>

CSS

.header{
    position: fixed;
    min-width: 100%;
    min-height: 100%;
}

#bgvideo{
    min-width: 100%;
    min-height: 100%;
    position: relative;
    top: 0;
    left: 0;
}

.holder{
    position: absolute;
    z-index: 3;
    font-size: 250%;
    line-height: 1;
    margin-top: 300px;
    color: #fff;
    font-family: lucidahand;
    text-shadow: 3px 3px 4px rgba(0, 0, 0, 1);
}

.service{
   position: absolute;
   top: 1000px;

}