<!-- 
            Copyright: Copyright 1998-2001 W3C (MIT, INRIA, Keio), All Rights Reserved.
See http://www.w3.org/Consortium/Legal/.
Author: Aaron Cohen (Intel)
           Version: February 7, 2001
            Module: Animation Module
           Feature: animation
         File Name: animation-overall-BE-01.smil
  Media Components: none
 Expected Behavior: green square grows large while little yellow square moves to
                    the upper left.
                    A 3s, blue rectangle appears, 
                    and then the rectangle follows a 
                    path from upper left to center while rectangle changes
                    color to red.
-->
<smil xmlns="http://www.w3.org/2001/SMIL20/Language">
    <head>
        <layout>
            <root-layout width="640" height="480" backgroundColor="white"/>
            <region id="whole" height="640px" width="480px" z-index="0"/>
            <region id="rect1" top="10px" left="10px" height="10px" width="10px" backgroundColor="yellow" z-index="2"/>
            <region id="rect2" top="75px" left="25px" height="10px" width="10px" backgroundColor="green" z-index="1"/>
            <region id="rect3" top="100px" left="30px" height="0px" width="0px" backgroundColor="blue" z-index="3"/>
        </layout>
    </head>
    <body>
        <par dur="indefinite">
            <img src="../images/animation-overall-BE-01.jpg" region="whole"/>
            <animate targetElement="rect1" attributeName="top" begin="0s" dur="9s" fill="freeze" from="200" to="25"/>
            <animate targetElement="rect1" attributeName="left" begin="0s" dur="9s" fill="freeze" from="200" to="75"/>
            <animate targetElement="rect2" attributeName="width" begin="0s" dur="9s" fill="freeze" from="50" to="400"/>
            <animate targetElement="rect2" attributeName="height" begin="0s" dur="9s" fill="freeze" from="50" to="300"/> 
            <set targetElement="rect3" attributeName="width" to="100" begin="3s" dur="6s" fill="freeze"/>
            <set targetElement="rect3" attributeName="height" to="10" begin="3s" dur="6s" fill="freeze"/>
            <animateMotion targetElement="rect3" additive="sum" path="M 0 0 L 50 225" begin="3s" dur="6s" fill="freeze"/>
            <animateColor targetElement="rect3" attributeName="backgroundColor" from="#0000FF" to="#800000" begin="3s" dur="6s" fill="freeze"/>
        </par>
    </body>
</smil>