PRO STANDARD #3

-----------------EMBED 01
<STYLE>

#scrolle {
padding:10px;
width: 100%;
border: 0px solid #7d7d7d;
height:100px;
border-radius:0.875em;
overflow:scroll;
overflow-x: hidden;
padding: 3px;
z-index:999; }

#scrolle a{
color: inherit;
text-decoration: dotted;
transition: color 0.25s ease;
color:black; }

#scrolle a:hover {
filter: blur(0.1rem);
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out;
-o-transition: all .3s ease-in-out;
-ms-transition: all .5s ease-in-out;
transition: all .3s ease-in-out;
text-decoration: dotted;
color: black;cursor: help;}

strong {
font-family: manuscribe;
background: white;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-size: 1.5em;
text-align:left;
color:inherit;}

::-webkit-scrollbar {
width: 7px; }

::-webkit-scrollbar-track {
border-radius: 10px;
opacity:0.5px; } /

::-webkit-scrollbar-thumb {
background: radial-gradient(circle, rgba(146, 140, 152,1) 0%, rgba(112, 104, 108,1) 50%, rgba(112, 104, 108,1) 100%);
border-radius: 10px;
opacity: 80%; }

::-webkit-scrollbar-thumb:hover { background: radial-gradient(circle, rgba(146, 140, 152,1) 0%, rgba(112, 104, 108,1) 50%, rgba(112, 104, 108,1) 100%);
opacity: 1.0; }

#text03{ font-family: 'Bai Jamjuree', sans-serif; font-size:1.375em; }

#text03 mark{
border: 1px solid white;
background-color:#c9c6cc;
color: #000;
border-radius: 100%;
padding: 0 0px 0 0px;
font-weight:950; }

#container05{
position: absolute;top:8em;
z-index:999999;
left:9px;
-webkit-animation:scale-in-ver-center .5s cubic-bezier(.25,.46,.45,.94) both;animation:scale-in-ver-center .5s cubic-bezier(.25,.46,.45,.94) both}

/* ----------------------------------------------
* Generated by Animista on 2022-4-17 13:45:34
* Licensed under FreeBSD License.
* See http://animista.net/license for more info.
* w: http://animista.net, t: @cssanimista
* ---------------------------------------------- */

@-webkit-keyframes scale-in-ver-center{0%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:1}100%{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1}}@keyframes scale-in-ver-center{0%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:1}100%{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1}}

#container05.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;}

#container05.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;}

#container06{
position: absolute;top:8em;
z-index:999999;
left:9px;
-webkit-animation:scale-in-ver-center .5s cubic-bezier(.25,.46,.45,.94) both;animation:scale-in-ver-center .5s cubic-bezier(.25,.46,.45,.94) both}

#container06.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;}

#container06.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;}

#container07{
position: absolute;top:8em;
z-index:999999;
left:9px;
-webkit-animation:scale-in-ver-center .5s cubic-bezier(.25,.46,.45,.94) both;animation:scale-in-ver-center .5s cubic-bezier(.25,.46,.45,.94) both}

#container07.columns > .wrapper > .inner > * > *:last-child {
margin-bottom: 0 !important;}

#container07.columns > .wrapper > .inner > * > *:first-child {
margin-top: 0 !important;}

#text01{
font-family: Manuscribe;}

#text01 a:hover {
filter: blur(0.1rem);
-webkit-transition: all .3s ease-in-out;
-moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out;
-ms-transition: all .5s ease-in-out;
transition: all .3s ease-in-out;
text-decoration: none;
font-style:italics;
cursor: help;}

#text01 a{
color: inherit;
text-decoration: none;
transition: color 0.25s ease;}

#text02{
font-family: ROMANTIC;}

@font-face {
font-family: Manuscribe;
src: url(https://dl.dropbox.com/s/o6x6hslh0vo6crd/Manuscribe-Regular.ttf);}

@font-face {
font-family: romantic;
src: url(https://dl.dropbox.com/s/xggwcxb6mlf6pwq/ROMANTIC.TTF);}

@font-face { font-family: 'icons'; src: url(https://dl.dropbox.com/s/2tohzt1ogc3bueo/IconBitTwo.ttf); }

</style>



-----------------EMBED 02

<style>
#container04{
position: absolute;
top:8em;
z-index:999999;
left:9px;
-webkit-animation:scale-out-vertical .2s cubic-bezier(.55,.085,.68,.53) both;animation:scale-out-vertical .2s cubic-bezier(.55,.085,.68,.53) both}

/* ----------------------------------------------
* Generated by Animista on 2022-4-17 13:59:13
* Licensed under FreeBSD License.
* See http://animista.net/license for more info.
* w: http://animista.net, t: @cssanimista
* ---------------------------------------------- */

@-webkit-keyframes scale-out-vertical{0%{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1}100%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:1}}@keyframes scale-out-vertical{0%{-webkit-transform:scaleY(1);transform:scaleY(1);opacity:1}100%{-webkit-transform:scaleY(0);transform:scaleY(0);opacity:1}}

</style>



-----------------EMBED FOR SCROLLBOX ABOUT
<div id="scrolle">
<div id="text03">
<mark>about</mark></p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Amet facilisis magna etiam tempor orci eu lobortis elementum nibh. Leo in vitae turpis massa sed elementum tempus. Porta non pulvinar neque laoreet suspendisse interdum consectetur libero. Vitae et leo duis ut diam quam nulla porttitor massa.
<br></br>

<mark> my links</mark>
<a href="https://link"> LINK NAME</a>
</div>
</div>


-----------------EMBED FOR SCROLLBOX RULES
<div id="scrolle">
<div id="text03">
<mark>before you follow</mark></br>
<strong>1.</strong> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<br></br>

<strong>2.</strong> Amet facilisis magna etiam tempor orci eu lobortis elementum nibh. Leo in vitae turpis massa sed elementum tempus.
<br></br>

<strong>3.</strong> Porta non pulvinar neque laoreet suspendisse interdum consectetur libero. Vitae et leo duis ut diam quam nulla porttitor massa.
</div>
</div>


-----------------EMBED FOR SCROLLBOX STAN
<div id="scrolle">
<div id="text03">
<mark>stanlist</mark> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.<br></br>

<mark>ults</mark> Amet facilisis magna etiam tempor orci eu lobortis elementum nibh. Leo in vitae turpis massa sed elementum tempus.
<br></br>

<mark>support</mark> Porta non pulvinar neque laoreet suspendisse interdum consectetur libero. Vitae et leo duis ut diam quam nulla porttitor massa.
</div>
</div>