cr nyamuchis horizontal scrollbox

-- SCROLLBOX CSS --
<style>

.boxes { /* scrollboxes with info dont change width and height */
width: 10em;
border: 1px solid #8ba9da;
border-radius: 5px;
white-space: normal;
display: inline-block;
height: 11em;
padding: .5em;
font-size:.8em;
vertical-align: middle;
margin-right: .5em;
background: rgba(255, 255, 255, 0.8);
overflow-y: scroll;
text-align: left;
font-family: 'Outfit', sans-serif;
}

mark {/* mark thing for subtitles, you can change basically anything here */
text-shadow: -2px 0 #6494a7, 0 2px #6494a7, 2px 0 #6494a7, 0 -2px #6494a7;
font-family: newrom;
font-size:2em;
color:white;
background: none;
}

a { /* links, you can change the text deco or erase it */
color: #8ba9da;
text-decoration: underline;
text-decoration-style: dotted;
font-weight:bold;
}

a:hover {color: #8ba9da;
transition: .6s;}
a { color: #8ba9da; }
}

</style>

-- INFO EMBED --

<div id="cont">
<div class="boxes">
<center><mark>about</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info
<br><span style="color:#F0AFAF;"><strong>fun facts</strong></span> info info info info info info info info info info info info info info info info info info info info info info info info info info info info
</div>

<div class="boxes">
<center><mark>likes</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info
<br>
<br>
<center><mark>dislikes</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info
<br>
<br>
<center><mark>comforts</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info
<br>
<br>
<center><mark>stan list</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info
</div>

<div class="boxes">
<center><mark>byf</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info <br>
<br>
<center><mark>dnf</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info
</div>

<div class="boxes">
<center><mark>notes</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info
</div>

<div class="boxes">
<center><mark>extra</mark></center>
<br>
info info info info info info info info info info info info info info info info info info info info info info info info info info info info </div>
</div>