My sequence ids are not displayed (or displayed white on white)

[alslonik]

Hi, When I embed the browser sequence on my html page (part of internal biodatabase) the headers of my fasta disappear. They exist, but are white on white. How do I change the color of the font that represent the fasta headers in the browser? Or restore the blue background?
Thanks!

Here is the embedded chunk:

<div class="col-md-12" style="max-width: 100%; overflow-x: auto ; border: 1px solid black; padding: 10px;">
<meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>MSABrowser Example</title>
    <link type="text/css" rel="stylesheet" href="https://cdn.jsdelivr.net/gh/msabrowser/msabrowser@v1.1//css/style.css" media="screen" />
    <script src="https://html2canvas.hertzen.com/dist/html2canvas.min.js" type="text/javascript"></script>
    <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
    <script src="https://cdn.jsdelivr.net/gh/msabrowser/msabrowser@v1.1//javascript/msabrowser.js"></script>
        <!-- Header for Alignment -->
        <h2>MSABrowser Example</h2>
       <!<article>
            <!<br> <!For example, you can view a particular <a href="javascript:void(0)" > <!<onclick="viewer.scrollToPosition(1,5)"> <!variation on a species</a> <!or by clicking the link.
        </article>

        <!-- MSABrowser Demo -->
        <section id="MSABrowserDemo"></section>
        <!-- end of MSABrowser Demo -->


        <script type="text/javascript" charset="utf-8" color="black" >
            var viewer;
            var annotations = [
                {
                    source: "Annotations #1",
                    data: [{
                        'annotation_id': 'Conserved domain',
                        'annotation_name': 'Conserved domain',
                        'annotation_external_link': 'https://msabrowser.github.io/',
                        'annotation_start_point': 8,
                        'annotation_end_point': 28
                    }]
                }
            ];
            var alterations = [
                {
                    'sequenceIndex': 1,
                    'position': 5,
                    'note': 'A modification note with a red asterisk might be detailed here using <a href="https://msabrowser.github.io/"> extra </a> information.'
                        + '<br><div style="background:red">Special box</div>'
                        + '<br><p style="color: blue;">P tag is also used here.</p>'
                        + '<br> <img height=65 width=230 src="https://user-images.githubusercontent.com/65191506/81839302-06123400-9550-11ea-92d2-ac904ccd32c6.png"> ',
                    'source': 'Modification',
                    'type': Alteration.Modification
                },];

            $.get("msa.fasta", (fasta) => {

                viewer = new MSABrowser({
                id: "MSABrowserDemo",
        msa: MSAProcessor({
            fasta: fasta,
            hasConsensus: true
        }),
        annotations: annotations,
        alterations: alterations,
        colorSchema: "clustal2",
    });

    viewer.export("msa.fasta");
});
        </script>
      </div>