::before,
::after,
*{
/*    box-sizing: border-box;*/
    cursor: url(/resources/images/miscellaneous/yunomouse.png), auto !important;
}
.tabecolor{
    color: #a0ce5c;
}
.btn_list{
    list-style-type: none;
    padding-left: 1rem;
    padding-top: 1rem;
    font-size: 1.85rem;
    margin: auto;

}
.hover{
    background-color: black;
    height: 35px;
    width: 296px;
    text-indent: 1rem;
}
.hover:hover{
    color: black;
    background-color: white;
}
.menubtn{
    display: block;
    color: inherit;
    text-decoration: none;
    padding-top: 2px;
}
.text{
    margin-top: 0px;
    margin-bottom: 0px;
    /*padding-left: 1rem;*/
    font-size: 1.25rem;
    word-break: break-word;
    line-height: 1.4em;
    word-spacing: 0.05em;
    letter-spacing: 0.08em;
    text-shadow: 0px 2px 0px blue;
}
.info{
    text-indent: 1rem;
    text-align: left;
    padding: 0.5rem 4rem;
}
.greeting{
    font-size: 1.75rem;
    /*outline: 2px solid red;*/
/*    color: black;
    text-shadow: 0px 2px 0px black;*/
}
.type-effect{
    width: 100%;
    white-space: nowrap;
    overflow: hidden;
    animation:
    typing 2s steps(35),
    cursor .1s step-end infinite alternate;
}

@keyframes cursor {
    50% { border-color: transparent }
}
@keyframes typing {
    from { width: 0 }
}

.title{
    margin-top: 1rem;
    margin-bottom: 0;
    text-shadow: 0px 3px 0px blue;
}
.images{
    display: flex;
    flex-direction: column;
/*    max-width: 640px;*/
}
.img{
/*    padding: 1rem;
    flex-basis: 50%;*/
    border: #000000 solid;
    margin-top: 1rem;
    margin-bottom: 1rem;
}
#body{
/*     background-image:url('/home/tabe/Documents/neocities/resources/images/eb_bg.png'); */
    /*background:url('/home/tabe/Documents/neocities/resources/images/Backgrounds/NP2_0172_cropped.png') no-repeat center center fixed;*/
/*     background-image:url('/home/tabe/Documents/neocities/resources/images/Backgrounds/NP2_0172_cropped.png'); */
    background-size: cover;
/*     background-repeat: no-repeat; */
    image-rendering: pixelated;
    background-color: black;
    color: white;
    font-family: "Retro";
    margin: auto;
    /*height: 1000px;*/
   /* height: 100vh;*/
/*   position: absolute;*/
    overflow: hidden;
}
#websiteContainer{
    max-width: 1200px;
/*    max-height: 1000px;*/
/*    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;*/
    margin: auto;
    display: flex;
/*    justify-content: center;
    align-items: start;*/
    flex-flow: wrap;
/*     gap: 16px */
}
/*#websiteSpacerTop{
    height: 220px;
}*/
#background{
/*    flex: 3 1 20%;*/
    height: 550px;
    background-image:url('/resources/images/backgrounds/Desert.png');
    background-size: cover;
    z-index: -2;
 /*   background-repeat: no-repeat;*/
/*     background:url('/neocities/resources/images/Backgrounds/NP2_0172_cropped.png') no-repeat center center fixed; */
}
#container{
    display: flex;
    /*flex: 1 1 72%;*/
    flex: 8.75;
    flex-direction: column;
    position: relative;
 /*/*   overflow: hidden;*/*/
/*    align-self: flex-start;*/
}
/*#container_02{
/*    display: flex;*/
/*    flex-direction: row;*/
/*    position: absolute;*/

#navboxContainer{
    width: 328px;
    position: absolute;
    height: 172px;
/*    background-color: black;*/
/*    background-image: url("/neocities/resources/images/navbox_bg.png");*/
/*    background-size: contain;*/
    border-style: solid;
    border-color: red;
    flex-basis: 32%;
    top: 375px;
    left: -16px;
    border-image-slice: 13 13 13 13;
    border-image-width: 32px;
    border-image-outset: 13px 13px 13px 13px;
    border-image-repeat: repeat repeat;
    border-image-source: url("/resources/images/miscellaneous/navbox.png");
    align-self: center;
    z-index: 1;
}
#infoContainer{
    width: 43.2rem;
    position: absolute;
    height: 32rem;
    background-color: #000000a8;
    background-size: contain;
    border-style: solid;
    border-color: red;
    flex-basis: 32%;
    top: 24px;
    left: 287px;
    border-image-slice: 13 13 13 13;
    border-image-width: 20px;
    border-image-outset: 18px 13px 16px 13px;
    border-image-repeat: repeat repeat;
    border-image-source: url("/resources/images/miscellaneous/navbox.png");
    overflow-y: auto;
    scrollbar-width: thin;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
}
#bar_1{
    flex: auto;
    align-self: normal;
    background-image: url('/resources/images/miscellaneous/sidebar.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
}
#bar_2{
    flex: auto;
    align-self: normal;
    background-image: url('/resources/images/miscellaneous/sidebar2.png');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: unset;
}
#yunobox{
    border-image-slice: 25 27 15 27;
    border-image-width: 42px 32px 20px 32px;
    border-image-outset: 0px 0px 0px 0px;
    border-image-repeat: stretch stretch;
    border-image-source: url("/resources/images/miscellaneous/yuno.png");
    border-style: solid;
    background-color: #000000;
    padding-left: 48px;
    padding-right: 64px;
    padding-top: 44px;
    padding-bottom: 16px;
    height: 118px;
/*    width: 875px;*/
/*    flex: 4 1 10%;*/
    flex: auto;
/*    align-self: center;*/
    margin-top: 2px;
}
#navbar{
    background-color: white;
}
@font-face {
    font-family: 'MrSaturn';
    src: url("/resources/fonts/senor-saturno-font/SenorSaturno-Aw9g.ttf");
}
@font-face {
    font-family: 'Retro';
    src: url("/resources/fonts/gbboot-font/Gbboot-ALpM.ttf");
}
@font-face {
    font-family: 'Nosut';
    src: url("/resources/fonts/Nosutaru-dotMPlusH-10-Regular.ttf");
}
@font-face {
    font-family: 'Chalk';
    src: url("/resources/fonts/Chalk-S_3_JP/Chalk-S-JP.otf");
}
/*@font-face {
    font-family: 'Mono';
    src: url("/resources/fonts/BlockBlueprint.ttf");
}*/
@font-face {
    font-family:"Font Awesome 6 Free";
    font-style:normal;
    font-weight:900;
    font-display:block;
    src:url(https://ka-f.fontawesome.com/releases/v6.7.2/webfonts/free-fa-solid-900.woff2) format("woff2"),
    url(https://ka-f.fontawesome.com/releases/v6.7.2/webfonts/free-fa-solid-900.ttf) format("truetype")
}
/*MUSIC PLAYER SET UP*/
#div2{
    height: 170px;
    /*width: 320px;*/
    right: 705px;
    top: 110px;
    text-align: center;
    position: absolute;
    z-index: 5;
}
.window{
    background: rgba(0, 0, 0, 0.75);
    box-shadow: inset -1px -1px #0a0a0a, inset 1px 1px #dfdfdf, inset -2px -2px grey, inset 2px 2px #fff;
    padding: 3px;
    position: relative;
    z-index: 99;
}
.title-bar{
    pointer-events: none;
    user-select: none;
    cursor: move;
    align-items: center;
    background: linear-gradient(to right, #ce2e37, #d2771e, #d4cb1f, #81c220, #2582b5, #8f289f, #bd2f68);
    display: flex;
    justify-content: space-between;
    padding: 3px 2px 3px 3px;
    margin: 3px;
    height: 20px;
    position: relative;
    z-index: 5;
}
.title-bar-text{
    color: #fff;
    font-weight: 700;
    letter-spacing: 0;
    margin-right: 24px;
    margin-top: 4px;
}
.title-bar-controls{
    pointer-events: auto;
    display: flex;
    position: relative;
    z-index: 99;
}
.window-body{
    position: relative;
    z-index: 99;
}
.controls{
    font-size: 15px !important;
    background-color: var(--contentbg);
    text-align: center;
    width: 100%;
}
.controls td{
    padding: 8px 1px 0px 2px;
}
.fa-brands:before,
.fa-regular:before,
.fa-solid:before,
.fa:before,
.fab:before,
.far:before,
.fas:before {
    content:var(--fa)
}
.fas{
    font-family: "Font Awesome 6 Free";
    font-style: normal;
}

.fa-play{
    --fa: "\f04b";

}
.fa-pause{
    --fa: "\f04c";
}
.fa-backward{
    --fa: "\f04a"
}
.fa-forward{
    --fa: "\f04e"
}
table{
    border-collapse: collapse;
    position: relative;
    text-align: left;
    white-space: nowrap;
}