javascript – When loading custom font after refresh of page, other font type is displaing

I changed my page title font to custom font.
When I refresh a page especially at IE I see other font type for a moment and then my custom font load.
How to change this to show only a proper font type ? (this looks really bad).

@font-face {font-family: "ISOCT3"; 
src: url("https://example_page.com/ISOCT3/6d585d4b2c76dabcf084d51d2e9c87e1.eot"); 
src: url("https://example_page.com/ISOCT3/6d585d4b2c76dabcf084d51d2e9c87e1_2.eot?#iefix") format("embedded-opentype"), 
url("https://example_page.com/ISOCT3/6d585d4b2c76dabcf084d51d2e9c87e1.woff2") format("woff2"), 
url("https://example_page.com/ISOCT3/6d585d4b2c76dabcf084d51d2e9c87e1_2.woff") format("woff"), 
url("https://example_page.com/ISOCT3/6d585d4b2c76dabcf084d51d2e9c87e1.ttf") format("truetype"), 
url("https://db.onlinewebfonts.com/t/6d585d4b2c76dabcf084d51d2e9c87e1.svg#ISOCT3") format("svg"); }

#header .header_logo {
    font-family: ISOCT3;
    font-size: 38px;
    font-weight: bolder;
    margin: auto;
    padding-top: 28px;
    padding-bottom: 20px;
    max-width: 80%;
    color: #b8860b;
    text-align: center;
    letter-spacing: 3px;
    padding: 8px 0;
    float: center;
}

<div class="header_logo">
                <a href="https://example_page.com/" style="text-decoration: none;">
                PAGE NAME
                </a>
            </div>

Tags: java, javascriptjavascript