How to resize two Panels Docked Top inside a Form proportionally

Question

This simple program Docks two Panels to top edge. Without anchoring the result is a blue panel on top of the green panel (Y-axis not Z-axis). Normal and as expected.
Adding anchoring for both panels in all four directions I expected proportional resizing on Form resize.
This probably happens except the panels end up in the same Y position, so one panel obscures the other.

How to get two panels docked to the top edge resize proportionally when the containing Form resizes?
.
.
.
using System;
using System.Windows.Forms;
using System.Drawing;

public class OnlyBlueGreen : Form
{
Panel bluePanel;
Panel greenPanel;

public OnlyBlueGreen()
{
InitiateGraphics();
}

void InitiateGraphics()
{
// blue
bluePanel = new Panel();
bluePanel.BackColor = Color.LightBlue;
bluePanel.Width = this.Width;
bluePanel.Height = 25;
bluePanel.Dock = DockStyle.Top;

// green
greenPanel = new Panel();
greenPanel.BackColor = Color.LightGreen;
greenPanel.Width = this.Width;
greenPanel.Height = bluePanel.Height;
greenPanel.Dock = DockStyle.Top;

this.Controls.Add(greenPanel);
this.Controls.Add(bluePanel);
bluePanel.Anchor = AnchorStyles.Right | AnchorStyles.Left | AnchorStyles.Top | AnchorStyles.Bottom;
greenPanel.Anchor = AnchorStyles.Right | AnchorStyles.Left | AnchorStyles.Top | AnchorStyles.Bottom;

}

public static void Main()
{
Application.Run(new OnlyBlueGreen());
}
}