<div id="target">
    <div class="title">
      <p>Episode II</p>
      <h1>The Next Chapter</h1>
    </div>    
    <p>
      As I look forward to this next chapter in my life, 
      I’m filled with a sense of excitement and determination. 
      Over the years, I’ve had the privilege of working in 
      dynamic roles across various industries, gaining deep 
      expertise in software development and technology management. 
    </p>     
    <p>
      I’ve also had the opportunity to serve as a leader, whether 
      at work or through my volunteer efforts at my church. These
      experiences have shaped my approach to problem-solving,
      collaboration, and staying adaptable in the face of change. 
      Now, I’m ready to channel this wealth of knowledge into new 
      opportunities that challenge me to grow further, both 
      personally and professionally.  
    </p>     
    <p>
      This chapter is about alignment—ensuring my skills, passions,
      and aspirations are in sync. Whether I’m mentoring others, 
      solving complex technical problems, or continuing to learn 
      and innovate, my focus remains on creating meaningful impact. 
    </p>     
    <p>
      At the same time, I’m embracing the balance that life demands.
      Spending quality time with my family, enjoying moments with my 
      grandbaby, and remaining a committed leader in my church community
      remind me of the importance of grounding myself in purpose and 
      service. 
    </p>     
    <p>
      I’m confident that the steps I’m taking now will lead 
      to opportunities where I can thrive while staying true to what
      matters most.  
    </p>     
  </div>
#target{
    position:absolute;
    top:-500px;
    bottom:0;
    left:0;
    right:0;
    padding-left: 200px;
    padding-right: 200px;
    overflow:hidden;
    font-size:40px;
    text-align:center;
    font-family:sans-serif;
}
#target>div{
    padding-top:900px;
    animation:autoscroll 1250s linear;
}

body{
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    width: 90%;
    transform-origin:50% 100%;
    transform:perspective(200px) rotateX(10deg);
}
html{
    color:yellow;
    background:black;
}
html:after{
    content:'';
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    background:linear-gradient(top,rgba(0,0,0,1),rgba(0,0,0,0) 50%);
    background:linear-gradient(to bottom,rgba(0,0,0,1),rgba(0,0,0,0) 50%);
    pointer-events:none;
}
@keyframes autoscroll{
    to{
        margin-top:-50000px;
    }    
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.