@import url('https://fonts.googleapis.com/css2?family=Fira+Mono:wght@400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Fira+Mono:wght@400;500;700&display=swap');

@font-face {
    font-family: 'PrimaryFont';
    font-style: normal;
    font-weight: normal;
    src: local('signategrotesk-black'), url('signategrotesk-black.ttf') format('truetype');
}

@font-face {
    font-family: 'SecondaryFont';
    font-style: normal;
    font-weight: normal;
    src: local('anton'), url('anton.ttf') format('truetype');
}


:root {
    --primary-font: 'PrimaryFont', sans-serif;
    --secondary-font: 'SecondaryFont', sans-serif;
    --secondary-font-bkp: 'Barlow Condensed', sans-serif;
    --mono-font: 'Fira Mono', monospace;
    --fira-code-vf: 'Fira Code VF', monospace;
}

.sub-nav {
    font-family: var(--fira-code-vf);
    font-weight: 300;
}

.sub-nav .text-bold {
    font-weight: 700;
}

.main_title{
    font-family: var(--primary-font);
    text-transform: uppercase;
    /* font-size: 4rem; */
    color: #ffffff;
 padding-bottom: 3rem;
 z-index: 2;
}

button span {
    font-family: var(--secondary-font-bkp);
    font-size: 25px;
}