@import url('https://fonts.googleapis.com/css2?family=Pixelify+Sans:wght@400..700&display=swap');

*, *::before, *::after {

    box-sizing: border-box;
    margin: 0;

}

body {

    background: #020202;
    color: white;
    font-family: "Pixelify Sans", sans-serif;
    text-shadow: 1px 1px 2px white, 0 0 1em white, 0 0 0.2em white;
    text-decoration: none;

}

.header {

    font-size: 2em;
    text-align: left;

}

.smalltext, .smalltext a:link {

    color: white;
    text-decoration: none;
    font-size: 1em;
    text-align: center;
    margin-top: 10px;
    cursor: pointer;

}

.smalltext a:visited {

    color: white;
    text-decoration: none;

}

.smalltext span {

    opacity: 0;

}

.smalltext:hover span {

    opacity: 1;

}

.container {

    position: relative;
    overflow: hidden;
    height: 100vh;

}

.content {

    margin-inline: 10%;
    height: inherit;
    display: flex;
    justify-content: center;
    flex-direction: column;
    flex-shrink: 1;
    flex-wrap: nowrap;
    z-index: 0;

}

.content img {

    height: auto;
    width: 80vw;

}

.fuzzy-overlay {

    position: absolute;
    inset: -200%;
    background-image: url("/img/entry/noise.jpg");
    opacity: 5%;
    z-index: 10;
    pointer-events: none; 
    animation: shift 0.4s linear infinite both;
    
}
@keyframes shift {

    0% {

        transform: translateX(30%) translateY(30%);

    }

    100% {

        transform: translateX(-30%) translateY(-30%);

    }

}