body {
    background-color: #050505;
    background-image: linear-gradient(to bottom, #000000, rgb(0, 0, 0), rgb(5, 5, 5));
    background-attachment: fixed;
    color: #fff;
    font-family: ms gothic;
    image-rendering: pixelated;
}
@font-face {
        font-family: type;
        src: url(Calculator.ttf)
}
audio{display: none;}
.stars {
    width: 100%;
    height: 100%;
    background-image: url(stars.png);
}
h1{
    font-family: type;
    margin: 10px;
    color: #fff;
}
#page {
    margin-top: 0px;
    width: 100%;
    display: flex;
    justify-content: center;
    gap: 60px;
}
.box {
    width: 300px;
    height: 600px;
}
#container {
    height: fit-content;
    width: 800px;
}
#planet {
    justify-self: center;
    margin-bottom: 60px;
    position: relative;
}
#image {
    position: inherit;
    z-index: 2;
}
#image:hover {
    z-index: 1;
}
.link {
    position: absolute;
    width: fit-content;
    height: fit-content;
    top: 50%; 
    left: 50%; 
    transform: translate(-50%, -50%);
    color: white;
    z-index: 1;
}
#ascii {
    margin: 60px;
    color: #839993;
    transform: translateX(-80px);
}
#cbox {
    border: 2px solid #fff;
    background-color: #000;
}
#statuscafe {
    margin-top: 60px;
    padding: .5em;
    border: 2px solid #fff;
    background-color: #000;
}
#statuscafe-username {
    margin-bottom: .5em;
}
#statuscafe-content {
    margin: 0 1em 0.5em 1em;
}
.results {
     border: 2px solid #fff;
    background-color: #000;
    margin: 60px auto auto;
}
.blinkies {
    display: flex;
    justify-content: center;
    margin: 60px auto auto;
    filter: grayscale(80%);
}
.footer {
    width: 100%;
    height: 100px;
}

/*gallery*/
#photos {
    width: 820px;
    margin: 100px auto auto;
    display: flex;
    flex-direction: column;
    gap: 60px;
}
.photo {
    border: 1px double #101413;
    image-rendering: unset;
}
#photo-info {
    display: flex;
    flex-direction: column;
    gap: 4px;
}