Delay the fade-in animation until the fps calculation is done.

In some small devices the animation is causing that the fps calculation
does not get the correct number because the animation is too heavy.
This change adds some seconds to the start of the initial fade-in animation
to make sure it happens when the fps calculation is done. We also
delay the next color change animation accordingly.

MotionMark/resources/runner/motionmark.css

diff --git a/MotionMark/resources/runner/motionmark.css b/MotionMark/resources/runner/motionmark.css
index 4ead52a..0ca5d75 100644
--- a/MotionMark/resources/runner/motionmark.css
+++ b/MotionMark/resources/runner/motionmark.css
@@ -46,7 +46,7 @@
     background-size: auto 225%, auto 100%;
     background-repeat: no-repeat;
 
-    animation: background-fade 1s ease-in 1s, background-color 60s linear infinite 2s;
+    animation: background-fade 1s ease-in 6s, background-color 60s linear infinite 7s;
     animation-play-state: paused;
 
     will-change: background-color;
@@ -111,7 +111,7 @@
 
     color: hsl(35, 100%, 50%);
 
-    animation: foreground-color 60s linear infinite 2s;
+    animation: foreground-color 60s linear infinite 7s;
     animation-play-state: paused;
 
     will-change: color;
@@ -185,7 +185,7 @@
 
     transition: 100ms filter ease-in-out;
 
-    animation: background-color 60s linear infinite 2s;
+    animation: background-color 60s linear infinite 7s;
     animation-play-state: paused;
 
     will-change: background-color;