CSS Web Fonts

HTML

<section class="demo-section">
<div class="container"> 

<div class="row justify-content-center text-center">
<div class="col-md-4">

<div class="demo-container-01">
<div class="demo-01-main">Infinite</div>
<div class="demo-01-sub">Possibilities</div>
</div> 

</div>
<div class="col-md-4">

<div class="demo-container-02">
<div class="demo-02-main">Trust</div>
<div class="demo-02-sub">Yourself</div>
</div> 

</div>
</div>

</div>
</section>

CSS

@font-face {
font-family: 'bozart';
src: url('bozart.woff2') format('woff2'),
url('bozart.woff') format('woff');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'baby-kruffy';
src: url('baby-kruffy.woff2') format('woff2'),
url('baby-kruffy.woff') format('woff');
font-weight: normal;
font-style: normal;
} 

.demo-section {
background-image: url("background.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
padding: 4em 2em 2em 2em; 
}

.demo-container-01 {
font-family: bozart, sans-serif;
}

.demo-01-main {
position: relative;
font-size: 80px;
color: rgba(186, 255, 74, 0.40);
text-shadow: -10px 0 rgba(86, 114, 240, 0.40), 0 10px rgba(86, 114, 240, 0.40), 10px 0 rgba(86, 114, 240, 0.40), 0 -10px rgba(86, 114, 240, 0.40); 
letter-spacing: 6px;
}

.demo-01-sub {
position: relative;
top: -60px;
font-size: 30px;
color: rgba(255, 255, 255, 0.40);
text-shadow: -4px 0 rgba(219, 73, 69, 0.40), 0 4px rgba(219, 73, 69, 0.40), 4px 0 rgba(219, 73, 69, 0.40), 0 -4px rgba(219, 73, 69, 0.40); 
letter-spacing: 2px;
}

.demo-container-02 {
font-family: baby-kruffy, sans-serif;
}

.demo-02-main {
position: relative;
font-size: 90px;
color: rgba(186, 255, 74, 0.60);
text-shadow: -1px 1px 2px rgba(0, 0, 0, 0.20), 8px 8px rgba(86, 114, 240, 0.20); 
letter-spacing: 4px;
}

.demo-02-sub {
position: relative;
top: -65px;
font-size: 30px;
color: rgba(255, 255, 255, 0.60);
text-shadow: -4px 0 rgba(219, 73, 69, 0.20), 0 4px rgba(219, 73, 69, 0.40), 4px 0 rgba(219, 73, 69, 0.40), 0 -4px rgba(219, 73, 69, 0.40); 
letter-spacing: 2px;
}