body {
    margin: 0;
    font-family: "Montserrat", monospace;
    background-color: #101010;

    z-index: 1;
}

.loading {
    width: 100%;
    height: 100%;
    z-index: 1000;

    background-color: #101010;

    position: fixed;

    display: grid;

    transition: all 2s ease;
}

.transparent {
    background-color: transparent;

    z-index: -100;
}

.transparent img {
    opacity: 0;
}

.transparent .loader {
    opacity: 0;
}

.loading-container {
    justify-self: center;
    align-self: center;
}

.loading-container img {

    transition: all 2s ease;
    
    width: 30vw;
}

.loader {
    margin-top: 50px;

    display: flex;
    justify-content: center;

    align-items: center;
}


html {
    scroll-behavior: smooth;
}

:root {
    --text-colour: white;   

    --primary-colour: #191919;
    --secondary-colour: #222222;
    --tertiary-colour: #2e2e2e;
    --quaternary-colour: #4d4d4e;
    --quinary-colour: #3d3d3d;

    --primary-accent-colour: #ba7c00;
    --secondary-accent-colour: rgb(128, 85, 0);
}

.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    user-drag: none;
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}