Embedded animation scaling issue

<!--This is the html for the animation-->

<div class="animabox">
      <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="1600" height="768" id="FlashID" title="Background">
        <param name="movie" value="resources/img/First_page.swf">
        <param name="quality" value="high">
        <param name="wmode" value="opaque">
        <param name="swfversion" value="6.0.65.0">
      <!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
        <param name="expressinstall" value="Scripts/expressInstall.swf">
      <!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
      <!--[if !IE]>-->
        <object type="application/x-shockwave-flash" data="resources/img/First_page.swf" width="1600" height="768">
        <!--<![endif]-->
          <param name="quality" value="high">
          <param name="wmode" value="opaque">
          <param name="swfversion" value="6.0.65.0">
          <param name="expressinstall" value="Scripts/expressInstall.swf">
        <!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
          <div>
            <h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
            <p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
          </div>
        <!--[if !IE]>-->
        </object>
      <!--<![endif]-->
    </object>
  </div>
<script type="text/javascript">
swfobject.registerObject("FlashID");
    </script>

/*--These are the css rules to scale the animation to cover the screen--*/

body{
  height: 768px;
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
}

/*--background animation--*/

.animabox {
  z-index: 1;
  height: 768px;
  width: 1600px;
  position: fixed;
  margin: 0px;
}

.animabox object {
object-position: center;
object-fit: cover;
}

I am attempting to use an embedded animation as a background image. I designed the artwork at 1600px x 768 px, to cover the total visible monitor area. Yet when I veiw what I created there is white space at the bottom and the top still. I have been able to achieve the desired scaling using just <background-image> but not when I embed an animation using the <object> tag.  

Can anyone see where I might be going wrong if I want to acheive a full page animated background?