title: how to override bootstrap font family?
body: <p>My custom CSS</p>
  
  <pre><code>@font-face {
      font-family: 'DINAlternateBold';
      src: url(./fonts/din/DINAlternateBold.otf);
      }
  
  h4.DINAlternateBold-font {
      font-family: 'DINAlternateBold', sans-serif !important ;
      }
  </code></pre>
  
  <p>html tag</p>
  
  <pre><code>&lt;h4 class="DINAlternateBold-font text-uppercase"&gt;Dashboard&lt;/h4&gt;
  </code></pre>
  
  <p>Currently its showing in console as below, but i want to overwrite with my custom font file</p>
  
  <pre><code>font-family": '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif'
  </code></pre>