Here is the Custom HTML shown in the video:

<div class="hero-section">
<div class="overlay-white">
<h2>Welcome to WPOptimal</h2>
<p>This is Just a Line of Text</p>
<div class="text-center"><a class="btn" href="#"><button class="btn btn-primary" type="button">Contact Us Today</button></a>
</div>
</div> <!-- close overlay-white -->
</div> <!-- close hero-section -->

Here is the CSS shown in the video:

.hero-section {
    margin: 180px auto;
}

.hero-section h2 {
    font-size: 2.3rem; 
    color: #fff; 
    font-weight: 700; 
    text-align: center; 
    text-shadow: 1px 1px 1px #333; 
    margin: 10px auto!important;
}

.hero-section p {
    font-size: 1.4rem; 
    color: #333; 
    text-align: center; 
    margin: 10px auto!important;
}

.overlay-white {
    background-color: rgba(255, 255, 255, 0.5); 
    max-width: 600px;
    margin: 0 auto;
    padding: 40px;
}