@font-face {
    font-family: "dogica"; 
    src: url("/fonts/dogica.ttf") format("truetype");
}
@font-face {
    font-family: "toxica"; 
    src: url("/fonts/toxica.ttf") format("truetype");
}
@font-face {
    font-family: "floozy"; 
    src: url("/fonts/floozy.ttf") format("truetype");
}
@font-face {
    font-family: "silkscreen"; 
    src: url("/fonts/silkscreen.ttf") format("truetype");
}
@font-face {
    font-family: "elegance"; 
    src: url("/fonts/elegance.ttf") format("truetype");
}
@font-face {
    font-family: "memory"; 
    src: url("/fonts/memory.ttf") format("truetype");
}
@font-face {
    font-family: "clubland"; 
    src: url("/fonts/clubland.ttf") format("truetype");
}
@font-face {
    font-family: "digitechno"; 
    src: url("/fonts/digitechno.ttf") format("truetype");
}
@font-face {
    font-family: "skin"; 
    src: url("/fonts/skin.ttf") format("truetype");
}
@font-face {
    font-family: "porcelain"; 
    src: url("/fonts/porcelain.ttf") format("truetype");
}

::selection {
  color: #000;
  background: rgba (255, 0, 0, 0);
}


::-webkit-scrollbar {
width: 4px;
}
 
::-webkit-scrollbar-track {
background-color: rgba(241, 244, 245, 0.0);
}
 
::-webkit-scrollbar-thumb {
border-radius: 0px;
background: #000;
box-shadow: inset 0 0 3px #fff;
}

body{
background-color: #fcfdfd;
padding: 0px;
margin: 0px;

}
#background{
z-index:-1;
padding: 0px;
margin: 0px;
}

#typedtext{
  position:absolute;
  left: 80vw;
  top: 10px;
  z-index: 50;
}
#back{
  position:absolute;
  left: 10px;
  top: 5px;
  z-index: 50;
}
#header{
background-color: #;
width: 420px;
height: 20px;
cursor: move;
font-family: toxica;
}
#div1{
position:absolute;
background-color: #fcfdfd;
width: 460px;
height: 200px;
margin: 20px;
padding: 0px;
overflow-x:hidden;
overflow-y:scroll;
border: px solid #000;
box-shadow: 0px 0px 20px 20px #fcfdfd;
z-index: 31;
cursor: move;
left: 810px;
top: 290px;
}
#div2{
position:absolute;
background-color: #fcfdfd;
width: 460px;
height: 200px;
margin: 20px;
padding: 0px;
overflow-x:hidden;
overflow-y:scroll;
border: px solid #000;
box-shadow: 0px 0px 20px 20px #fcfdfd;
z-index: 32;
cursor: move;
left: 350px;
top: 60px;
}
#div3{
position:absolute;
background-color: #fcfdfd;
width: 460px;
height: 200px;
margin: 20px;
padding: 0px;
overflow-x:hidden;
overflow-y:scroll;
border: px solid #000;
box-shadow: 0px 0px 20px 20px #fcfdfd;
z-index: 33;
cursor: move;
left: 330px;
top: 500px;
}

#div5{
position:absolute;
background-color: #fcfdfd;
width: 230px;
height: 60px;
margin: 20px;
padding: 0px;
overflow-x:hidden;
overflow-y:scroll;
border: px solid #000;
box-shadow: 0px 0px 20px 20px #fcfdfd;
z-index: 34;
cursor: move;
left: 1030px;
top: 450px;
}

textarea {
    margin-top: 5px;
    color: #000;
    background-color: #fff;
    font-size: 8px;
    font-family: silkscreen;
    line-height: 10px;
}

#div6{
position:absolute;
background-color: #fcfdfd;
width: 200px;
height: 20px;
margin: 20px;
padding: 0px;
overflow-x:hidden;
overflow-y:scroll;
border: px solid #000;
box-shadow: 0px 0px 20px 20px #fcfdfd;
z-index: 35;
cursor: move;
left: 950px;
top: 530px;
}

.draggable{
  
}

#text{
  overflow-x: hidden;
  overflow-y: scroll;
  background-color: #;
  width: 460px;
  height: 200px;
}
p{
font-family: silkscreen;
margin: 5px;
font-size: 9px;
}
h1{
font-family: toxica;
font-size: 50px;
margin-top: 5px;
margin-right: 50px;
}
a {
  color: #000;
  text-decoration: none;
}
a:hover{
text-shadow: 0 0 2px #000;
}
#chibi {
position: fixed;
top: 400px;
left: -50px;
z-index: 48;
pointer-events:none;
} 
#colour{
filter: sepia(100%) hue-rotate(-200deg) saturate(2) brightness(0.9);
margin: 0px;
width: 88px;
height: 31px;
}
#colour:hover {
    filter: none ;
}


        ::-webkit-scrollbar {
        width: 0;
        /* remove scrollbar space */
        background: transparent;
        /* to make scrollbar invisible */
        }

        ::-webkit-scrollbar-thumb {
        background: transparent;
        }