:root {
    --color-red: rgba(196, 4, 20, 0.7);
    --color-blue: rgba(72, 95, 199, 0.7);
    --color-green: rgba(43, 88, 45, 1);
    --color-orange: rgba(165, 67, 0, 1);
    --color-grey: rgba(74, 74, 74, 1);
    --color-dark-grey: rgba(36, 36, 36, 1);
    --black-transparent: rgba(0, 0, 0, 0.8);
}

body {
    background: black;
    color: white;
    background-image: linear-gradient(to top, #162444, #111f3f, #0c1a3a, #071535, #050e30, #0d092a, #110424, #13001e, #150016, #13000d, #0c0004, #000000);
    background-repeat: no-repeat;
    background-position: bottom;
}

hr {
    background-color: var(--color-grey);
}

aside nav {
    > a:first-of-type {
        &:hover {
            background: none;
        }
    }
    a, form {
        &:hover {
            background-color: #363636;
        }
    }
    a {
        &[aria-current="page"] {
            background-color: var(--color-blue);
        }
    }
}

header {
    nav {
        span.graduate {
            &:hover {
                background: black;
            }
        }
    }
}

.notification {
    background-color: var(--color-blue);
}

video {
    background-color: black;
}

.red {
    background-color: var(--color-red);
    border-color: var(--color-red);
}

.blue {
    background-color: var(--color-blue);
    border-color: var(--color-blue);
}

.green {
    background-color: var(--color-green);
    border-color: var(--color-green);
}

.orange {
    background-color: var(--color-orange);
    border-color: var(--color-orange);
}

.grey {
    background-color: var(--color-grey);
    border-color: var(--color-grey);
}

.white {
    background-color: rgba(255, 255, 255, 0.7);
    color: black;
}

.fishing {
    background-color: #0075c9;
}

.facebook {
    background-color: #1b2e5b;
}

.instagram {
    background-color: #7638fa;
}

.venmo {
    background-color: #008CFF;
}

.paypal {
    background-color: #ffffff;
}