@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&display=swap');


@import url('https://fonts.googleapis.com/css2?family=Micro+5&display=swap');



.border {
    border: 2px solid red;
    margin: 3px;
}

.flex {
    display: flex;
}

.justify-center {
    justify-content: center;
}

.items-center {
    align-items: center;
}

.bg-black {
    background-color: black;
    color: white;
}

/* This property is something new, and is used to invert the colors of svg's🎋 */
.invert {
    filter: invert(1);
}

.bg-gray {
    background-color: #121212;
}

.rounded {
    border-radius: 9px;
}

.p-1 {
    padding: 10px;
}

/* Width */
::-webkit-scrollbar {
    width: 8px;
}

/* Track */
::-webkit-scrollbar-track {
    background: transparent;
    /* Dark background color */
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: rgba(128, 128, 128, 0.292);
    /* Lighter color for the scrollbar thumb */
    border-radius: 5px;
    /* Rounder edges */
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background:  rgba(128, 128, 128, 0.612);
    /* Darker color on hover */
}