nya {
    position:fixed;
    border-style: solid;
    height:90vh;
    width: 50vw;
    top: 5vh;
    Left: 4vw;
    display:grid;
    grid-template-columns: 100px auto;
    grid-template-rows:auto auto 30px;
    grid-template-areas: 
    "header header"
    "sidebar main"
    "sidebar navbar"
    "footer footer";
}

astrito {
    height:635px;
    width:510px;
    position: fixed;
    right:14.2vw;
    bottom:0px;
    background-image: url("https://weirdlookingstar.neocities.org/helloastro.gif");
    background-repeat:no-repeat;
    pointer-events:none;
}

@media screen and (max-width: 1100px){
    astrito {
        right:80px;
    }
}

@media screen  and (max-width: 900px){
    astrito {
        right:6px;
    }
    nya {
        width:53vw;
    }
}

@media screen and (max-width: 700px){
    astrito {
        display:none;
    }

    nya{
        width:80vw;
        height:80vh;
        position:absolute;
        margin:5vw;
    }
    
    h1 {
        font-size:25px;
    }
    
    h2 {
        font-size: 500px;
    }
}


header {
    grid-area: header;
    background-color:rgb(22, 22, 22);
    color:white;
    text-align:center;
    padding: 1em;
}

aside {
    grid-area: sidebar;
    background-color:rgba(8, 8, 8, 0.733);
    overflow-y:auto;
    padding-right: 1em;
    pointer-events: none;
}

aside::-webkit-scrollbar{
    display:none
}

.group {
    display: flex;
    flex-direction: column;
    animation: spin 8s infinite linear;
    gap:5px;
    padding-bottom:7px;
}

@keyframes spin {
    from {transform: translateY(0px);}
    to {transform: translateY(-100%);}
}


img.stamp {
    height:auto;
    width:100px;
}

main {
    grid-area: main;
    overflow-y: scroll;
    height: content;
    padding: .5em;
    font-size: 1.3em;
    background-color:rgb(255, 255, 255);
}

.click {
    grid-area:navbar;
    display:flex;
     flex-direction: row;
     gap:5px;
     height:24px;
     padding:0.34em;
    background-color:rgb(214, 214, 214);
}

a.hi {
    
    padding: 1px 6px;
    border: 1px outset;
    border-radius: 3px;
    text-decoration: none;
    width:100%;
    display:flex;
    background-color: rgba(51, 51, 51, 0.911);
    color:white;
}

footer {
    grid-area: footer;
    background-color:rgb(22, 22, 22);
    color:white;
    line-height:5vh;
    text-align: center;
    justify-content:center;
    align-items: center;
    font-size: clamp(15px, 1vw, 1vw);
}

h1, h2, p {
    margin:0px
}

h1 {
    font-family:'title1';
    font-size: clamp(25px, 1.8vw, 1.8vw);
}

h2 {
    font-family:'title2';
    font-size: clamp(23px, 2.6vw, 2.9vw);
}

p {
    font-family: 'text1';
}

body {
    background-color:rgb(94, 94, 94);
}