@import url(nav.css);
@import url(aside.css);
@import url(main.css);
@import url(rside.css);
@import url(workpage.css);
@import url(resume.css);

html {
    scroll-behavior: smooth;
}

:root{
    --background_color: #000000;
    --bg-color: #212121;
    --letter_color:#FAF9F6;
    --main_font: "Poppins", sans-serif;
    --border_color: rgb(66, 65, 65);
    --my_yellow: #ABF518;
    --cursor: url(../cursor/pointer.cur), auto;
    --cursor_link: url(../cursor/link.cur), auto;
    --cursor_text: url(../cursor/beam.cur), auto;
}

a, li, button{
    cursor: var(--cursor_link);
}

p{
    cursor: var(--cursor_text);
}

body{
    cursor: var(--cursor);
    display: flex;
    background-color: var(--background_color);
    font-family: var(--main_font);
    font-size: 16px;
    font-weight: 500;
    color: #FAF9F6;
}

@media screen and (max-width: 428px){
    body{
        display: flex;
        flex-direction: column;
        background-color: var(--background_color);
        font-family: var(--main_font);
        font-size: 16px;
        font-weight: 500;
        color: #FAF9F6;
    }
}

#particles-js {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -1;
}

@keyframes glowing {
    0% {
        filter: drop-shadow(0 0 5px #abf518) drop-shadow(0 0 1px #abf518);
    }
    50% {
        filter: drop-shadow(0 0 1px #abf518) drop-shadow(0 0 1px #abf518);
    }
    100% {
        filter: drop-shadow(0 0 5px #abf518) drop-shadow(0 0 1px #abf518);
    }
}