Gatsby Project: CSS crashes when I reload page

I am building a site with Gatsby.
I am using a component that imports a script and returns a form.
The problem is, that after you loaded the page that shows the form, and then you click to any other page and go back to that form page, the css fully crashes for the entire site and you have to refresh the whole page.
To check out what I mean click this link https://baerenherz.org/, go to the dark blue button on the very right of the menu, then click to any other navigation site and then click again on the blue button (jetzt-spenden).

Here is my component for the donation form :

import React, { useState, useEffect } from "react"
import {Helmet} from "react-helmet"

import Loading from "./Loading"

function Child() {
  return(
    <div style={{width: "75%", margin: "4em auto"}} >
      <Helmet>
        <script type='text/javascript' aysnc>
          {` window.rnw.tamaro.runWidget('.dds-widget-container', {language: 'de'}) `}
        </script>
      </Helmet>
      <div className="dds-widget-container"></div>
    </div>
  )
}

function RaiseNow() {
  const [loaded, setLoaded] = useState(false)

  useEffect(() => {
    const scriptTag = document.createElement('script')
    scriptTag.src='https://tamaro.raisenow.com/xxx/latest/widget.js'
    scriptTag.addEventListener('load', ()=> setLoaded(true))
    document.body.appendChild(scriptTag)
    return ()=>{
      scriptTag.removeEventListener(); // check if necessary
      setLoaded(false) // check if necessary
    }

  }, []);


  return (
    <>
      {loaded ? <Child /> : <Loading/>}
    </>
  )
      }


export default RaiseNow

What I noticed is, that the second time you visit the page, the Loading.... component does not even show anymore.. the Layout is displayed but as soon as the form shows, it crashes...

Since I cannot solve this issue since literally last year I would really appreciate any help with this. Thank you in advance.