Star Trek 2 Red Alert using CSS3

This is a recreation of the Star Trek II (Wrath of Khan) red alert, using HTML and CSS3. It will only work on browers that support CSS3 animations (so will not currently work on IE). If you wish to alter the size then, providing you keep the aspect ratio the same, you should only need to adjust the font sizes. Everything else should scale correctly. NOTE: The font is not entirely accurate but was the closest free font I could find. Also Webkit browsers do not correctly crop the left and right edges, so they incorrectly appear straight instead of curved. Firefox does not have this problem. However I have found the animations are far smoother in Webkit browsers than in Firefox. Live long and prosper CSS3! John Williams 2012

by doublewombat

HTML

<!--
    This is a recreation of the Star Trek II (Wrath of Khan) red alert, using HTML and CSS3.
    It will only work on browers that support CSS3 animations (so will not currently work on IE).
    If you wish to alter the size then, providing you keep the aspect ratio the same, you should
    only need to adjust the font sizes.  Everything else should scale correctly.

    NOTE: The font is not entirely accurate but was the closest free font I could find. Also
    Webkit browsers do not correctly crop the left and right edges, so they incorrectly appear
    straight instead of curved.  Firefox does not have this problem.  However I have found the
    animations are far smoother in Webkit browsers than in Firefox.

    Live long and prosper CSS3!  John Williams 2012
-->

<!DOCTYPE HTML>
<html>
    <head>
        <title>Star Trek 2 Red Alert</title>
        <meta charset="utf-8">
        <meta name="description" content="Star Trek 2 Red Alert by John Williams 2012">
        <meta name="keywords" content="red alert,star trek,wrath of khan">
        <link href='http://fonts.googleapis.com/css?family=Orbitron' rel='stylesheet' type='text/css'>
        <style>
            body{margin:0;padding:0;background-color:black;}
            #redAlert {font-family:orbitron;color:#BF0019;background-color:black;position:absolute;width:100%;height:100%;display:table}
            #redAlert .centreContent {display:table-cell;text-align:center;vertical-align: middle}
            #redAlert .centredContent {display:inline-block;width:800px;height:680px}
            #redAlert .outerMask{width:800px;height:680px;overflow:hidden;position: absolute;}
            #redAlert .curvedEdges{height:110%;top: -5%;overflow:hidden;background-color:#BF0019;position:absolute;width: 100% ;-moz-border-radius: 50%;-webkit-border-radius: 50%; border-radius:50%}
            #redAlert .innerContent{    height: 91%;position: absolute;top: 4.5%;width: 100%;}

            #redAlert .messageBanner {height:...