#bg {
    position:fixed;
    top: 0px;
    left: 0px;
    width: 100vw;
    height: 100vh;
    background: url("./res/bg.png");
    background-size: 100%;
    z-index: -100;
}

section {
    background-color: rgba(255, 255, 255, 0.5);
    padding: 10px;
    backdrop-filter: blur(10px);
}

@keyframes fade {
    from {

    }
    1% {
        opacity: 0%;
        transform: translateY(100px) rotateY(90deg);
    }
    99% {
        opacity: 100%;
        transform: translateY(0px) rotateY(0deg);
    }
    to {
        
    }
}

* {
    -webkit-text-stroke: 1px black;
}

section {
    animation: fade 0.5s normal infinite ease-in-out;
    animation-iteration-count: 1;
}

img {
    position: relative;
    transition: all 0.3s;
    z-index: 100;
}

img:hover {
    position: relative;
    transform: scale(1.25, 1.25) perspective(300px) rotateX(25deg);
    transition: all 0.3s;
    z-index: 100;
}

a section img:hover {
    position: relative;
    transform: scale(1, 1);
    transition: all 0.3s;
    z-index: 100;
}

a section {
    position: relative;
    transition: all 0.3s;
    z-index: 100;
}

a section:hover {
    position: relative;
    transform: scale(1.25, 1.25) perspective(300px) rotateX(25deg);
    transition: all 0.3s;
    z-index: 100;
}

a:hover, a:visited, a:link, a:active {
    text-decoration: none;
}