@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@100;700&family=Poppins:ital,wght@0,400;0,600;1,400&family=Cousine:ital,wght@1,700&display=swap');
:root {
    --shadow: #250902;
    --darkest: #38040e;
    --midtone: #640d14;
    --lightest: #800e13;
    --accent: #E5383B;
    --highlight: #F5F3F4;
    --copy: poppins;
    --title: antonio;
    --tiny: cousine;
}

* {
    box-sizing: border-box;
    cursor: url(https://cur.cursors-4u.net/cursors/cur-9/cur817.cur), auto !important;
}

a {
    color: var(--accent);
    transition: 0.5s ease-in-out;
    text-decoration: none;
}

a:hover {
    color: var(--lightest);
}

body {
    font-family: var(--copy);
    color: var(--highlight);
    overflow-y: hidden;
    background: linear-gradient(0deg, hsla(355, 77%, 22%, 1) 0%, hsla(12, 90%, 8%, 1) 100%) fixed;
}

::-webkit-scrollbar {
    width: 3px;
}

::-webkit-scrollbar-track {
    background: var(--lightest);
}

::-webkit-scrollbar-thumb {
    background: var(--darkest);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--midtone);
}

#credit {
    position: absolute;
    bottom: 20px;
    left: 20px;
    font-size: 12px;
    font-style: italic;
    text-transform: uppercase;
}

#credit>a:hover {
    color: var(--highlight);
}