@font-face {
    font-family: 'Titlefont';
    src: url('fonts/PixelFraktur.ttf');
    font-weight: normal;
    font-style: normal;
}


.box {
    border-right: 3px solid white;
    border-bottom: 3px solid white;
    border-left: 3px solid black;
    border-top: 3px solid black;
    background-image:url(images/BG3.png);
}

.header-text {
    margin:0;
    padding:15px;
    font-family: Titlefont;
    color: white;
}


html {
    margin:0;
    padding:0;
    background-image:url(images/BG.png);
    background-attachment: fixed;
    image-rendering:pixelated;
    -webkit-font-smoothing: none;
    color:white;
}

html::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}

header {
    display:flex;
    flex-direction:row;
    /* align-items: center; */
    margin:0;
    padding:0;
    background: linear-gradient(to right, rgb(0, 0, 0), rgba(0, 0, 0, 0));
    font-size:25px;
    position: sticky;
    top:0;
}

.sparkle {
    position:fixed;
    z-index: -1;
}

#colorify {
    border: 2px solid white;
    background-color:black;
    background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    margin:25px;
    font-family:'Times New Roman', Times, serif;
    cursor:pointer;
}

#header-divider {
    content:"";
    display:block;
    position:absolute;
    background: linear-gradient(to right, rgb(255, 255, 255), rgba(0, 0, 0, 0));
    width:50%;
    height:3px;
}

#main {
    display:grid;
}

aside {
    position:fixed;
    width:20vw;
    height:auto;
    padding:10px;
    overflow-y:scroll;
}

aside div {
    width:auto;
    margin:10px;
    padding:10px;
}

aside::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}

#journal {
    overflow:scroll;
    height:300px;
}

#journal::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}

.entry {
    width:auto;
    min-height:250px;
    border: 2px solid white;
    color: white;
    font-size:20px;
    background-color:black;
    margin:10px;
}

#AOTW {
    height:175px;
}

#album-cover {
    width:auto;
    height:60%;
    float:left;
    margin-right:15px;
}

body {
    margin:0px;
    padding:0px;
}

.container {
    width:50vw;
    display:grid;
    grid-template-columns:auto auto;
    margin:auto;
    padding:25px;
}

.container div {
    padding: 10px;
    font-size: 30px;
    text-align: center;
    background-image:url(images/BG2.png);
    color:white;
    margin:7px;
}

.window-title {
    font-family: Titlefont;
}

.container div:after {
    content: "";
    display: block;
    padding-top: 100%;
}