colored scrollbox

<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Mali:wght@500&display=swap" rel="stylesheet">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Gamja+Flower&display=swap" rel="stylesheet">
<style>
@font-face { font-family: cutie; src: url(https://dl.dropbox.com/s/xo075bh6tbd4f7d/CP.ttf); }

#scroll01 {
height: 170px;
width: 100%;
padding: 10px;
margin-left: auto;
margin-right: auto;
background: #F5EEE9;
border-radius: 10px;
font-size: 13px;
font-family: Mali;
line-height: 1.4;
text-align: left;
overflow: auto;
}

mark {
font-family: cutie;
font-size: 15px;
background: #FFF;
border-radius: 9px;
border: 1px solid #D4C6BC;
padding-left: 5px;
padding-right: 5px;
color: #000;
height: 5px;
}

</style>
<div id="scroll01">
<p></p>
<mark>about</mark> hey ~ your info goes here
</div>