cr bjork crd co codes (pro-standard)

<style>
#scroll {
box-sizing: border-box;
white-space: nowrap;
font: 12px system-ui;
padding: 7px;
border-radius: 4px;
border: 1px solid #888;
overflow: auto;
height: 15em;
width: 15em;
}

.con {
height: 95%;
width: 95%;
white-space: normal;
display: inline-block;
padding: .2em;
vertical-align: middle;
overflow: auto;
border-radius: 4px;
border: 1px solid #888;
}
.con:nth-child(2) {
margin: 0 5px 0 5px ;
}

/** START OF THE SCROLLBAR CODE **/
::-webkit-scrollbar {
width: 16px
}
::-webkit-scrollbar:horizontal {
height: 16px
}
::-webkit-scrollbar-corner {
background: #eee
}

::-webkit-scrollbar-track:vertical {
background: linear-gradient(90deg, #e5e5e5, #f0f0f0 20%);
}
::-webkit-scrollbar-track:horizontal {
background: linear-gradient(180deg, #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-thumb:horizontal {
background: url("https://dl.dropbox.com/s/tykz2yw9tctbe4c/scroll2.png"), linear-gradient(180deg, #eee 45%, #ddd 0, #bbb);
background-repeat: no-repeat;
background-size: 20% auto, cover;
background-position: center;
}

::-webkit-scrollbar-button:horizontal:end:increment,
::-webkit-scrollbar-button:horizontal:start:decrement,
::-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;
}

::-webkit-scrollbar-button:horizontal {
width: 15px
}
::-webkit-scrollbar-button:horizontal:start:increment {
display: none;
}
::-webkit-scrollbar-button:horizontal:end:decrement {
display: none;
}

::-webkit-scrollbar-button:horizontal:start:decrement {
background: white;
background: url("https://dl.dropbox.com/s/xcm618ghd823271/scroll5.png"), linear-gradient(180deg, #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 0 3px;
}
::-webkit-scrollbar-button:horizontal:end:increment {
background: white;
background: url("https://dl.dropbox.com/s/byeyi7am889ii9m/scroll6.png"), linear-gradient(180deg, #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;
}
@font-face {
font-family: pixel;
src: url(https://dl.dropbox.com/s/kmhe7d3n18vdz5e/w95fa.woff?dl=0);
}

@font-face {
font-family: B;
src: url(https://dl.dropbox.com/s/pefk842bs1sgr4w/04B_30__.TTF);
}
#buttons01 li a {
background: #E1E1E1;
font-family: pixel;
}
#container02 > .wrapper, #container03 > .wrapper, #container05 > .wrapper {
box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
}

#container01 {
top: -0.5em;
}

#gallery01 ul li .frame {
border-radius: 10px 0px 10px 0px;
}
#gallery02 ul li .frame {
border-radius: 10px 0px 10px 0px;
}
#gallery03 ul li .frame {
border-radius: 10px 0px 10px 0px;
}

#text01 {
font-family: pixel;
height: 18em;
overflow: auto;
padding: 5px;
border: 1px solid black;
border-radius: 5px 5px 5px;
background: white;
}
#text01 mark {
font-family: B;
font-size: 1.5em;
background: linear-gradient(180deg, #0094FF, #29A6FF, #59BAFF, #FFF);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(0px 0px 1px black);
}
@media only screen and (max-width: 600px) {
#text01 {
height: 15em;
}
}

#container04 {
position: absolute;
z-index: 99;
top: 17em;
left: 18.5em;
width: 1em;
}

@media only screen and (max-width: 600px) {
#container04 {
left: 15em;
top: 15.5em;
}
}
#text02 mark {
font-family: B;
font-size: 1.5em;
background: linear-gradient(180deg, #0094FF, #29A6FF, #59BAFF, #FFF);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(0px 0px 1px black);
}
#text03 mark {
font-family: B;
font-size: 1.5em;
background: linear-gradient(180deg, #0094FF, #29A6FF, #59BAFF, #FFF);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(0px 0px 1px black);
}

#text04 mark {
font-family: B;
font-size: 1.5em;
background: linear-gradient(180deg, #0094FF, #29A6FF, #59BAFF, #FFF);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(0px 0px 1px black);
}
#text02, #text03, #text04 {
font-family: pixel;
height: 5em;
overflow: auto;
padding: 5px;
border: 1px solid black;
border-radius: 5px 5px 5px;
background: white;
}

#text05 mark {
font-family: B;
font-size: 1.5em;
background: linear-gradient(180deg, #0094FF, #29A6FF, #59BAFF, #FFF);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(0px 0px 1px black);
}
#text05 {
font-family: pixel;
height: 11em;
overflow: auto;
padding: 5px;
border: 1px solid black;
border-radius: 5px 5px 5px;
background: white;
}
</style>