Storyboard Animation for Path control not working

Question

So I have a Path object that is implemented as follows:

<Path x:Name="arrow" Data="M0,0L0.67,0 4,2.67 7.25,0 8,0 8,0.67 4,4 0,0.75z" Fill="Black" Height="4" RenderTransformOrigin="0.5,0.5" Stretch="None" Width="8">
    <Path.RenderTransform>
        <TransformGroup>
            <RotateTransform Angle="0"/>
            <TranslateTransform/>
        </TransformGroup>
    </Path.RenderTransform>
</Path>

With this Path I have the following animation attached that works perfectly.

WORKING:

<VisualStateGroup x:Name="ExpandStateGroup">
    <VisualState x:Name="Expanded">
        <Storyboard>
            <DoubleAnimation Duration="0:0:0.2" To="180" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="arrow"/>
        </Storyboard>
    </VisualState>
    <VisualState x:Name="Collapsed">
        <Storyboard>
            <DoubleAnimation Duration="0:0:0.2" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="arrow"/>
        </Storyboard>
    </VisualState>
</VisualStateGroup>

However when I add the color animations neither of the animations work. Also, the expand seems to happen instantaneously rather than expanding smoothly. The Collapse works fine though.

NOT WORKING:

<VisualStateGroup x:Name="ExpandStateGroup">
    <VisualState x:Name="Expanded">
        <Storyboard>
            <ColorAnimation To="Red" Duration="0:0:0.2" Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="arrow" />
            <DoubleAnimation Duration="0:0:0.2" To="180" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="arrow"/>
        </Storyboard>
    </VisualState>
    <VisualState x:Name="Collapsed">
        <Storyboard>
            <ColorAnimation To="Black" Duration="0:0:0.2" Storyboard.TargetProperty="(Path.Fill).(SolidColorBrush.Color)" Storyboard.TargetName="arrow" />
            <DoubleAnimation Duration="0:0:0.2" To="0" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[0].(RotateTransform.Angle)" Storyboard.TargetName="arrow"/>
        </Storyboard>
    </VisualState>
</VisualStateGroup>

It has to do with the coloranimation because when I try to perform the color animation by itself it doesn't work. This is a part of the Telerik RadExpander user control.

If any other information is needed please don't hesitate to ask.

NOTE 1: If I set the Fill color in the path declaration to black and set the collapsed fill color to green the arrow will start out as green, but as soon as I expand it turns black and never changes color again.

Note 2: When the coloranimation is set the doubleanimation never works.