My video has black margins on the sides when I play full screen. How can I lose the black margins?

I created slides in Keynote and exported them as an mp4. Then I imported that mp4 into Screenflow to do the editing and add music, etc. Then I exported the completed video as an mp4 from Screenflow. Everything with the video looks great except for the big black margins on each side when I play it in full screen (see image below). I want the actual video to fill the entire screen without those black margins being there. How can I do that?

More info you want to know...

- I exported the mp4 from Keynote at 1024 x 768 and also exported the finished/edited mp4 from Screenflow at 1024 x 768.

- The finished mp4 out of Screenflow is 281 MB.

- After compressing with Handbrake the file is 46 MB.

- I will host this video on Amazon S3.


QUESTIONS:

1) Instead of 1024 x 768, what is the optimum size that will fill the entire screen and will load quickly?

2) Since the size exported out of Keynote was 1024 x 768 and the edited video out of Screenflow was 1024 x 768, does that mean that I'm screwed and will have to start all over with the export out of Keynote? (Oh gawd I hope not!) Or can I just export the existing Screenflow document in a different format?

Thanks very much.

P.S. There is something wrong with this forum. When I click the attached image below it automatically logs me out and then when I log back in I'm stuck on the page with the image. I tried to submit a support ticket but it won't accept my email address, username, and/or password.