credit hikiko pro-standard codes

<style>

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

@font-face {
font-family:'cupcake';
src: url(https://dl.dropbox.com/s/dayh8onbivwmqq7/Cherry%20Cupcake%20Personal%20Use.ttf);

}
@font-face {
font-family: Chemre;
src: url(https://dl.dropbox.com/s/a4vu0khvvhe5lwq/Chemre.ttf);
}
::-webkit-scrollbar {
width: 14px;
height: 10px;
}

::-webkit-scrollbar-thumb {
background: linear-gradient(90deg, rgba(238,238,238,1) 38%, rgba(206,206,206,1) 62%);
border: 1.5px solid #888888;
border-radius: 5px;
}

::-webkit-scrollbar-track {
background: linear-gradient(90deg, rgba(230,230,230,1) 6%, rgba(240,240,240,1) 18%);
}

::-webkit-scrollbar-button {
display: block;
width: 14px;
height: 16px;
}

::-webkit-scrollbar-button:vertical:start:decrement {
background: white;
background-image: url("https://dl.dropbox.com/s/vtnpkuealr2f7u4/whc8iy3_d.png");
border: 1.5px solid #888888;
border-radius: 5px;
}

::-webkit-scrollbar-button:vertical:start:increment {
display: none;
}

::-webkit-scrollbar-button:vertical:end:decrement {
display: none;
}

::-webkit-scrollbar-button:vertical:end:increment {
background: white;
background-image: url("https://dl.dropbox.com/s/vtnpkuealr2f7u4/whc8iy3_d.png");
border: 1.5px solid #888888;
border-radius: 5px;
}
#text01 {
position: absolute;
z-index: 9;
top: -0.5em;
}
#image01 .frame {
border-radius: 10px 10px 0px 0px;
}
#container02 > .wrapper {
box-shadow: inset 0 7px 5px -7px white, inset 7px 0 5px -7px gray, inset -7px 0 5px -7px gray, inset 0 -7px 5px -7px gray;
width: 11.125em;
height: 2em;
left: .875em;
position: absolute;
bottom: 6.975em;
z-index: 9;
}
#text02 {
font-family: roman;
}
#container03 > .wrapper {
box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 56%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
width: 13em;
height: 2.75em;
left: -0.225em;
position: absolute;
bottom: -0.225em;
z-index: 9;
border-radius: 0px 50px 50px 50px;
}
#text03 {
font-family: Chemre;
}
#image02 .frame {
position: absolute;
z-index: 99;
top: -1.5em;
left: 9.25em;
}
#container04 > .wrapper, #container05 > .wrapper, #container06 > .wrapper, #container07 > .wrapper {
box-shadow: inset 13px 0px 6px -10px rgb(66 66 66 / 56%), inset -13px 0px 6px -10px rgb(66 66 66 / 56%), inset 0px 13px 6px -10px #ffffff, inset 0px -13px 6px -10px rgb(66 66 66 / 38%);
width: 12em;
height: 14em;
left: 13em;
position: absolute;
bottom: 3em;
z-index: 9;
}
#text04, #text06, #text08, #text10 {
background: white;
border: 2px #808080 dashed;
padding: 5px;
overflow-y: scroll;
height: 8.5em;
border-radius: 10px;
}
mark {
font-family:'cupcake';
-webkit-text-stroke: 1px black;
font-size: 2.5em;
color: #dcb4e4;
}
</style>