html, body, p, a {
    font-family: 'Inter', sans-serif;
    font-weight: 400;
}

h1, h2, h3, h4, h5, h6, .navbar-brand, .h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: 'Rubik', sans-serif;
    font-weight: 500;
}

.bg-very-dark {
    background-color: #0A0A0A;
}

.text-mid, footer .nav-link, footer .nav-link:focus, .oneofus {
    color: #999999;
}

footer .nav-link:hover, .oneofus:hover {
    color: #0a58ca;
}

.made-by-text {
    color: #A5A5A5;
}

.modal .modal-content {
    background-color: #222222;
}

.modal .modal-content .modal-header {
    border-bottom: none;
}

.modal .modal-content .modal-header .btn-close {
    -webkit-filter: invert(100%);
    filter: invert(100%);
}

#home {
    background-size: cover;
    background-position: center center;
    background-image: url("hero_bg.jpg");
    background-color: #000000;
}

.social-link {
    filter: brightness(50%);
    transition: ease all 250ms;
    width: 24px;
    height: 24px;
}

.social-link:hover {
    filter: brightness(100%);
}