Keep control in bottom after scaling

My page structre is on top there is a panel of height 30 and on bottom also there is a panel with height 30 . And a scrollviewer in the middle
 I always want to keep the scrollviewer in the center. But now what is happening is when i scale down the scrollviewer contents the bottom frame also coming to top LIKE IN THE IMAGE 

Image may be NSFW.
Clik here to view. the code i used is

<Grid><ScrollViewer  Margin="0,35,5,35" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"><StackPanel Orientation="Horizontal"  HorizontalAlignment="Center" VerticalAlignment="Center">
              i want to show the contents of stackpanel always at center. Even if i scaletransform the panel area</StackPanel></ScrollViewer><Grid VerticalAlignment="Top"  Background="LightGray" Height="30"></Grid><Grid VerticalAlignment="Bottom" Background="LightGray" Height="30">            </Grid></Grid>

How to keep that bottom panel always on bottom

Thanks ***Share Knowledge to gain more***