@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:opsz,wght@9..40,300..700&family=Geist:wght@300..800&family=IBM+Plex+Sans:wght@300;400;500;600;700&family=Inter:wght@300..800&family=Manrope:wght@300..800&family=Montserrat:wght@300..800&family=Plus+Jakarta+Sans:wght@300..800&family=Space+Grotesk:wght@300..700&family=Urbanist:wght@300..800&family=Work+Sans:wght@300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fira+Code:wght@300..700&family=IBM+Plex+Mono:wght@300;400;500;600;700&family=JetBrains+Mono:wght@300..800&family=Roboto+Mono:wght@300..700&family=Source+Code+Pro:wght@300..800&family=Space+Mono:wght@400;700&family=Ubuntu+Mono:wght@400;700&display=swap');

:root {
    --gallery-max-width: 100rem;
    --gallery-fluid-width: 90vw;
    --gallery-gap: 5rem;
    --gallery-medium-breakpoint: 75rem;
    --gallery-square-medium-max-height: 55svh;
    --gallery-portrait-max-height: 50rem;
    --gallery-portrait-min-height: 20rem;
    --gallery-portrait-fluid-height: 66.666vw;
    --gallery-mobile-breakpoint: 48rem;
    --gallery-mobile-gap: 1.5rem;
    --gallery-mobile-column-gap: 2rem;
    --gallery-square-medium-width: 55vw;
}

* {
    color: #4a4a4a;
    /*font-size: 18px;*/
    /*font-family: "DM Sans", sans-serif;*/
}



.title {
    font-size: 36px;
    font-family: "DM Sans", sans-serif;
    font-weight: 400;
    color: black;
}

.desc {
    font-family: "Host Grotesk", sans-serif;
    color: #3d3d3d;
}

.desc {
    font-size: 18px;
}

.details {
    gap: .1rem;
    font-family: "Source Code Pro", monospace;
    font-weight: 600;
    font-size: 15px;
    color: #7e7e7e;
}

.button {
    font-family: "Host Grotesk", sans-serif;
    font-size: 16px;
    letter-spacing: 1px;
}


/* Firefox */
* {
    scrollbar-width: thin;
    scrollbar-color: #cfcfcf transparent;
}

    /* Chrome, Edge, Safari */
    *::-webkit-scrollbar {
        width: 6px;
        height: 6px;
    }

    *::-webkit-scrollbar-track {
        background: transparent;
    }

    *::-webkit-scrollbar-thumb {
        background-color: #cfcfcf;
        border-radius: 999px;
    }

        *::-webkit-scrollbar-thumb:hover {
            background-color: #b5b5b5;
        }

    /* Remove scrollbar arrows/buttons */
    *::-webkit-scrollbar-button,
    *::-webkit-scrollbar-button:single-button,
    *::-webkit-scrollbar-button:vertical:decrement,
    *::-webkit-scrollbar-button:vertical:increment,
    *::-webkit-scrollbar-button:horizontal:decrement,
    *::-webkit-scrollbar-button:horizontal:increment {
        display: none;
        width: 0;
        height: 0;
    }