.bloc
  .effect
    p.text   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore molestiae inventore error ab necessitatibus, neque repellendus amet hic dolor enim nemo, quasi officiis magni rem nulla adipisci quae eius ipsa impedit, reiciendis autem numquam aut mollitia ipsum expedita. Fuga hic at delectus vel quod repellat consequatur modi nam veritatis quas debitis sapiente dicta quaerat assumenda nisi reiciendis quae omnis ipsum, sequi soluta animi dolores illo recusandae amet doloribus. Eaque adipisci saepe necessitatibus, odit asperiores repellendus perspiciatis ad, quae dolorum neque minus sint, corporis rerum quam quas. Veritatis ex voluptas, amet nesciunt distinctio. Vitae atque harum debitis eaque, quo est veritatis accusamus laborum excepturi eum soluta at beatae ut velit deserunt quasi, tenetur eius nam consequuntur temporibus aliquid distinctio reprehenderit assumenda repudiandae pariatur! Sapiente aut vero dolores nesciunt provident. Hic adipisci, illo at explicabo voluptas recusandae quam quia temporibus! Commodi asperiores soluta, explicabo minus maiores natus, omnis provident animi et veniam illo enim fugit sunt molestiae cupiditate distinctio ducimus quod fugiat exercitationem nihil voluptas odit. Autem corrupti non unde aperiam nam dolores assumenda commodi, nisi perferendis voluptatibus officia, repudiandae eius vero repellat voluptatum aspernatur atque hic error optio laboriosam. Eligendi odit maxime suscipit, vel excepturi dolor quisquam. Blanditiis nihil iure, sint.
    h1 Don't panic
    p.text   Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore molestiae inventore error ab necessitatibus, neque repellendus amet hic dolor enim nemo, quasi officiis magni rem nulla adipisci quae eius ipsa impedit, reiciendis autem numquam aut mollitia ipsum expedita. Fuga hic at delectus vel quod repellat consequatur modi nam veritatis quas debitis sapiente dicta quaerat assumenda nisi reiciendis quae omnis ipsum, sequi soluta animi dolores illo recusandae amet doloribus. Eaque adipisci saepe necessitatibus, odit asperiores repellendus perspiciatis ad, quae dolorum neque minus sint, corporis rerum quam quas. Veritatis ex voluptas, amet nesciunt distinctio. Vitae atque harum debitis eaque, quo est veritatis accusamus laborum excepturi eum soluta at beatae ut velit deserunt quasi, tenetur eius nam consequuntur temporibus aliquid distinctio reprehenderit assumenda repudiandae pariatur! Sapiente aut vero dolores nesciunt provident. Hic adipisci, illo at explicabo voluptas recusandae quam quia temporibus! Commodi asperiores soluta, explicabo minus maiores natus, omnis provident animi et veniam illo enim fugit sunt molestiae cupiditate distinctio ducimus quod fugiat exercitationem nihil voluptas odit. Autem corrupti non unde aperiam nam dolores assumenda commodi, nisi perferendis voluptatibus officia, repudiandae eius vero repellat voluptatum aspernatur atque hic error optio laboriosam. Eligendi odit maxime suscipit, vel excepturi dolor quisquam. Blanditiis nihil iure, sint.
View Compiled
@import "compass/css3";

@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,800);
body{
  height: 100%;
  background: #fff;
  font-family: "Open Sans";
}
p{
  margin-top: 50px;
  text-align: center;
  font-weight: 400;
}
.bloc{

  width: 80vw;
  height: 200%;
  margin: 0px auto 1000px auto;
 
}
.info{
  float: left;
  width: 50%;
}
.effect{

  width: 100%;
 // background: url() 50% 50% no-repeat;
  background-size: contain;
  height: 500px;
  h1{
   
    font-weight: 900;
  //   text-shadow: 1px 1px 0px #fff;
    font-size: 12vw;
    text-align: center;
    margin: 0;
    color: #222;
   background: url(https://i.imgur.com/jGIGWOA.jpg) repeat fixed;
    -webkit-background-clip:text;
       background-clip: text;

     -webkit-text-fill-color:transparent;
   text-fill-color: transparent;
    animation : bp 8s infinite linear;
    
  }
  .text{
    text-align: center;
    margin: 0;
    font-size: 1.5vw;
  }
}

@keyframes bp {
  100%   { background-position: 0% 552px; }
  0% { background-position: 0% 0px; }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.