@font-face {
    font-family: 'Roboto Regular';
    src: url('./roboto/Roboto-Regular.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto Bold';
    src: url('./roboto/Roboto-Bold.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto Black';
    src: url('./roboto/Roboto-Black.ttf') format('truetype');
}

@font-face {
    font-family: 'Roboto Medium';
    src: url('./roboto/Roboto-Medium.ttf') format('truetype');
}

/**
    * Scoped to the root of the document and all its descendant elements.
   */
   :root {
    /** Use --dxp-g to make broad changes **/
    --Blue-Arrecife: #009BDB;
    --Digital-Blue:#00a7e1;
    --Digital-Gray:#D9D8D6;
    --Dark-Gray:#777779;
    --Mid-Gray:#A9A8A9;
    --Light-Gray:#D0D2D3;

    --Steel: #4a4f54;
    --Cloud:#f4f4f4;
    --Snow:#F9F9F9;
    /** set the font for all root/body text **/
    --roboto-bold: "Roboto Bold";
    --roboto-regular: "Roboto Regular";
    --roboto-black: "Roboto Black";
    --roboto-medium: "Roboto Medium";
    /** set the font for headings **/
}

    /* h1 {
        font-family: var(--roboto-black);
        font-style: normal;
        font-weight: 900;
        font-size: 72px;
        line-height: 84px;
        letter-spacing: -0.05em;
    }

    h2 {
        font-family: var(--roboto-black);
        font-style: normal;
        font-weight: 900;
        font-size: 46px;
        line-height: 50px;
        letter-spacing: -0.04em;
    }
    h3{
        font-family: var(--roboto-black);
        font-style: normal;
        font-weight: 900;
        font-size: 36px;
        line-height: 42px;
        letter-spacing: -0.04em;

    }
    h5{
        font-family: var(--roboto-black);;
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 22px;
    }

    .p-mind{
        font-family: 'Roboto';
        font-style: normal;
        font-weight: 400;
        font-size: 16px;
        line-height: 22px;
    } */
