pro-standard cr crdskiz & d8ncer codes

<style>
@font-face {
font-family: water resistant;
src: url(https://dl.dropbox.com/s/9jrts3f7xb20whu/waterresistant.ttf);
}

@font-face {
font-family: nintendo;
src: url(https://dl.dropbox.com/s/vlxjtnvrl9s0snp/Nintendo-DS-BIOS.ttf);
}

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

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

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

@font-face {
font-family: romantics;
src: url(https://dl.dropbox.com/s/22ucjgki60vvnpe/romantic.ttf);
}
</style>

<style>
#container01 {
transition: 0.6s ease;
bottom: 0em;
}
#container01 > .wrapper {
box-shadow: inset 0 7px 7px -5px white, inset 7px 0 7px -7px #454545, inset -7px 0 7px -7px #454545, inset 0 -7px 7px -7px #454545;
border-radius: 0.50em;
width: 120px;
height: 120px;
position: absolute;
left: 3.5em;
bottom: -5.9em;
border: 1px dotted #DAE8F7;
}

#container01:hover {
bottom: 4em;
}

</style>

<style>
::-webkit-scrollbar {
width: 16px
}
::-webkit-scrollbar-corner {
background: #eee
}

::-webkit-scrollbar-track:vertical {
background: linear-gradient(90deg, #e5e5e5, #f0f0f0 20%);
}

::-webkit-scrollbar-thumb {
border: 1.5px solid #888;
border-radius: 3px;
box-shadow: inset 0 -1px 1px #fff, inset 0 1px 1px #fff;
background-color: #eee;
}
::-webkit-scrollbar-thumb:vertical {
background: url("https://dl.dropbox.com/s/9a29qbkza3gmgl7/scroll1.png"), linear-gradient(90deg, #eee 45%, #ddd 0, #bbb);
background-repeat: no-repeat;
background-size: 65% auto, cover;
background-position: center;
}

::-webkit-scrollbar-button:vertical:end:increment,
::-webkit-scrollbar-button:vertical:start:decrement {
display: block
}

::-webkit-scrollbar-button:vertical {
height: 15px
}
::-webkit-scrollbar-button:vertical:start:decrement {
background: white;
background: url("https://dl.dropbox.com/s/n9ji42h9hdgdtpc/scroll3.png"), linear-gradient(90deg, #e5e5e5, #f0f0f0 20%);
background-repeat: no-repeat;
background-position: center;
-moz-background-size: 100% auto, cover;
-webkit-background-size: 100% auto, cover;
-o-background-size: 100% auto, cover;
background-size: 100% auto, cover;
background-position: center;
border-radius: 0 3px 0 0;
}

::-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: url("https://dl.dropbox.com/s/cdcco6pih7n1lae/scroll4.png"), linear-gradient(90deg, #e5e5e5, #f0f0f0 20%);
background-repeat: no-repeat;
background-position: center;
-moz-background-size: 100% auto, cover;
-webkit-background-size: 100% auto, cover;
-o-background-size: 100% auto, cover;
background-size: 100% auto, cover;
background-position: center;
border-radius: 0 0 3px 0;
}

#text01 {
right: 5em;
position: absolute;
z-index: 5;
top: 1em;
}
#text02 {
font-family: romantics;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #000;
font-weight: bold;
letter-spacing: 5px;
font-size: 2em;
margin-top: -13px;
}
#text03 {
background: #ffffffcf;
padding-left: 2px;
padding-right: 2px
padding-top: 2px;
height: 50px;
overflow-y: scroll;
font-family: nintendo;
border-radius: 0.50em;
border: 2px dotted black;
}
#text03 a {
text-decoration: dotted underline;
padding-right: 4px;
}
#container02 > .wrapper {
box-shadow: inset 0 4px 7px -0px white, inset 7px 0 7px -7px black, inset -7px 0 7px -7px black, inset 0 -7px 7px -7px black;
width: 350px;
border-radius: 1em;
height: 230px;
}
#buttons02 li a {
box-shadow: inset 0 7px 9px -0px white, inset 7px 0 7px -7px black, inset -7px 0 7px -7px black, inset 0 -7px 7px -7px black, 0px 0px 7px 0px darkgray;
border-radius: 50%;
width: 40px;
height: 40px;
position: absolute;
z-index: 3;
bottom: .7em;
right: 5em;
font-family: genty;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #000;
}
#buttons01 li a {
box-shadow: inset 0 7px 9px -0px white, inset 7px 0 7px -7px black, inset -7px 0 7px -7px black, inset 0 -7px 7px -7px black, 0px 0px 7px 0px darkgray;
border-radius: 50%;
width: 40px;
height: 40px;
position: absolute;
z-index: 3;
bottom: 0.3em;
right: 2.75em;
font-family: alagard;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #000;

}
#buttons03 li a {
box-shadow: inset 0 7px 9px -0px white, inset 7px 0 7px -7px black, inset -7px 0 7px -7px black, inset 0 -7px 7px -7px black, 0px 0px 7px 0px darkgray;
border-radius: 50%;
width: 40px;
height: 40px;
position: absolute;
z-index: 3;
bottom: 1.2em;
right: .55em;
font-family: naskle;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #000;
}
#text04, #text06, #text08, #text10 {
font-family: naskle;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
z-index: 3;
font-size: 2.5em;
}
#text04 strong {
font-family: alagard;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
font-weight: 400;
}
#text04 mark {
font-family: genty;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
color: #F1D485;
}
#text06 strong {
font-family: alagard;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
font-weight: 400;
}
#text08 strong {
font-family: alagard;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
font-weight: 400;
}
#text10 strong {
font-family: alagard;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
font-weight: 400;
}
#text06 mark {
font-family: genty;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
color: #F1D485;
}
#text08 mark {
font-family: genty;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
color: #F1D485;
}
#text10 mark {
font-family: genty;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #fff;
color: #F1D485;
}
#text05, #text07, #text11 {
background: #ffffffcf;
padding: 2px;
height: 100px;
font-family: nintendo;
border-radius: 0.50em 0em 0em 0.50em;
overflow-y: scroll;
border: 2px dotted black;
}
#text05 mark {
font-family: romantics;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #000;
z-index: 3;
font-weight: bold;
letter-spacing: 3px;
padding-right: 5px;
}
#text07 mark {
font-family: romantics;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #000;
z-index: 3;
font-weight: bold;
letter-spacing: 3px;
padding-right: 5px;
}
#text11 mark {
font-family: romantics;
-webkit-text-stroke: 0.5px black;
text-shadow: 2px 2px 1px #000;
z-index: 3;
font-weight: bold;
letter-spacing: 3px;
padding-right: 5px;
}
#container03 > .wrapper, #container04 > .wrapper, #container06 > .wrapper {
box-shadow: inset 0 7px 7px -5px white, inset 7px 0 7px -7px #454545, inset -7px 0 7px -7px #454545, inset 0 -7px 7px -7px #454545;
width: 200px;
border-radius: .5em;
height: 150px;
position: absolute;
z-index: 10;
bottom: 4.9em;
right: 2em;
border: 1px dotted #DAE8F7;
}
#text09 {
background: #ffffffcf;
padding-left: 2px;
padding-right: 2px
padding-top: 2px;
height: 75px;
font-family: nintendo;
border-radius: 0.50em 0em 0em 0.50em;
border: 2px dotted black;
overflow-y: scroll;
}
#container05 > .wrapper {
box-shadow: inset 0 7px 7px -5px white, inset 7px 0 7px -7px #454545, inset -7px 0 7px -7px #454545, inset 0 -7px 7px -7px #454545;
width: 130px;
border-radius: .5em;
height: 130px;
position: absolute;
z-index: 10;
bottom: 4.15em;
left: 2em;
border: 1px dotted #DAE8F7;
}
</style>