@font-face{
    font-family:"8bit";
    src:url(8bit.ttf) format("truetype")
}
b{
    font-family:"8bit"
}
*{
    box-sizing:border-box!important;
    image-rendering:pixelated;
    image-rendering:-moz-crisp-edges
}
body,html{
    width:100%;
    height:400px;
    padding:0;
    margin:0;
    font-family:"8bit";
    letter-spacing:-1px;
    color:#342161
}
b{
    color:#342161
}
button{
    border-radius:10px;
    height:40px;
    width:auto;
    background-color:#e5c7fc;
    border:3px solid #b888ea;
    gap:0;
    margin:0;
    line-height:0;
    display:flex;
    align-content:center;
    float:left;
    margin:5px;
    transition:.3s all ease-in-out
}
button>b{
    display:flex;
    align-self:center;
    padding-left:0
}
path{
    fill:#b888ea
}
.the{
    margin-left:20px;
    margin-right:20px;
    margin-top:30px;
    text-shadow:0 0 3px #fff;
    background:url(gifs/rainbwline.gif);
    border:3px solid #7316c9;
    overflow:auto
}
.buttons{
    margin-top:10px;
    margin-left:20px
}
button:hover{
    transform:scale(1.1);
    box-shadow:0 0 20px #fff
}
.pagedoll{
    margin-top:50px;
    background-image:url(gifs/pagedoll.gif);
    width:201px;
    height:147px;
    transform:scaleX(-1)
}
.sidenav{
    height:100%;
    width:200px;
    position:fixed;
    z-index:1;
    top:0;
    left:0;
    background-color:#342161;
    overflow:hidden;
    padding-top:20px;
    padding-right:10px;
    opacity:.8
}
.sidenav:hover{
    opacity:1
}
.sidenav a{
    margin-top:10px;
    text-align:left;
    padding:6px 8px 6px 16px;
    text-decoration:none;
    font-size:25px;
    color:#fff;
    display:block;
    opacity:1;
    letter-spacing:-2px
}
.sidenav a:hover{
    color:#fcfca0
}
.sidenav-a>img{
    box-shadow:0 0 10px #26154f
}
.main{
    margin-left:250px;
    width:1000px;
    flex-direction:column;
    align-items:center
}
body{
    background-image:url(gifs/rainbowstr2.gif)
}
.title{
    background-image:url(gifs/purpleanimstar.gif);
    border:3px solid #b888ea;
    width:1000px;
    height:100px;
    margin-top:50px;
    color:#342161;
    font-weight:700;
    margin-bottom:20px;
    display:flex;
    justify-content:center;
    flex-direction:column;
    align-items:center
}
.links{
    size:100%
}
.button{
    padding:16px 32px;
    text-align:center;
    text-decoration:none;
    display:inline-block;
    font-size:20px;
    margin:4px 2px;
    transition-duration:.4s;
    cursor:pointer;
    background-color:#6b00b8;
    color:#fff;
    border:6px solid #c778ff;
    border-radius:500px;
    font-family:8bit
}
.button:hover{
    background-color:#c778ff;
    color:#fff
}
@-moz-keyframes scroll-left{
    0%{
        -moz-transform:translateX(100%)
    }
    100%{
        -moz-transform:translateX(-100%)
    }
}
@-webkit-keyframes scroll-left{
    0%{
        -webkit-transform:translateX(100%)
    }
    100%{
        -webkit-transform:translateX(-100%)
    }
}
@keyframes scroll-left{
    0%{
        transform:translateX(100%)
    }
    100%{
        transform:translateX(-100%)
    }
}
.dashed{
    height:10px;
    width:1000px;
    border-top:3px dashed #b888ea
}
.dashed2{
    height:10px;
    width:90%;
    border-top:3px dashed #7316c9
}
.yellow{
    background:url(gifs/yellowstars.gif);
    border:3px solid #f79e20;
    width:100%;
    height:350px
}
a{
    max-width:200px;
    max-height:200px;
    padding:5px
}
.home1{
    background:url(gifs/rainbwline.gif);
    border:3px solid #7316c9;
    width:100%;
    height:100%
}
::-webkit-scrollbar-thumb{
    background-color:#f99;
    border:1px s#7316c9
}
::-webkit-scrollbar-thumb:hover{
    background-color:#ff9
}
::-webkit-scrollbar-thumb:active{
    background-color:#f7e7ff
}
::-webkit-scrollbar{
    background-color:#9cf;
    width:12px;
    border:1px #7316c9
}