ive got this iFrame froom google drive and its rendering with two thick black borders top and bottom, it also isnt autoplaying or looping which I thought I set it to. Whats the best way to approach this?

    <div className="mt-12 sm:mt-16 lg:mt-0 lg:col-start-1">
                        <div className="pr-4 -ml-48 sm:pr-6 md:-ml-16 lg:px-0 lg:m-0 lg:relative lg:h-full">
                            <iframe
              className="relative right-32 p-0 m-0"
                                src="https://drive.google.com/file/d/14JF5_OmTykWsg1bjF1FPLDvNSJe3NYSm/preview"
                                width="100%"
                                height="100%"
                                frameBorder='0'
                                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                                allowFullScreen
                                title="Embedded youtube"
                            ></iframe>
           
                        </div>
                    </div>