@font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-ExtraLight.woff2') format('woff2');
        font-weight: 200;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-Light.woff2') format('woff2');
        font-weight: 300;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-Regular.woff2') format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
    }
    
    @font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-Medium.woff2') format('woff2');
        font-weight: 500;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-SemiBold.woff2') format('woff2');
        font-weight: 600;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-Bold.woff2') format('woff2');
        font-weight: 700;
        font-style: normal;
        font-display: swap;
    }
        
    @font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-ExtraBold.woff2') format('woff2');
        font-weight: 800;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Roboto';
        src: url('../fonts/Roboto-Black.woff2') format('woff2');
        font-weight: 900;
        font-style: normal;
        font-display: swap;
    }


    /**==== URBANIST FONT INSTALL ====**/

    @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-ExtraLight.woff2') format('woff2');
        font-weight: 200;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-Light.woff2') format('woff2');
        font-weight: 300;
        font-style: normal;
        font-display: swap;
    }

      @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-Regular.woff2') format('woff2');
        font-weight: 400;
        font-style: normal;
        font-display: swap;
    }
    
    @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-Medium.woff2') format('woff2');
        font-weight: 500;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-SemiBold.woff2') format('woff2');
        font-weight: 600;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-Bold.woff2') format('woff2');
        font-weight: 700;
        font-style: normal;
        font-display: swap;
    }
        
    @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-ExtraBold.woff2') format('woff2');
        font-weight: 800;
        font-style: normal;
        font-display: swap;
    }

    @font-face {
        font-family: 'Urbanist';
        src: url('../fonts/Urbanist-Black.woff2') format('woff2');
        font-weight: 900;
        font-style: normal;
        font-display: swap;
    }