Modal popup border disappears when css background applied - asp.net

Question

I am using the Ajax Modal Popup Extender to display a panel as a modal popup. I've applied a CSS class to the panel and everything displays fine. However, when I add the BackgroundCssClass property to my popup extender, the border on my panel does not show up. The modal background displays properly and everything else in the panel remains the same, but I can't get the border to display. What might be causing this?
**CSS**
.PopupPanel
{
width: 75%;
height: 55%;
text-align: center;
padding: 5px;
overflow: auto;
border-style: solid;
border-width: 8px;
border-color: #0055A5;
background-color: White;
}
.ModalBackground
{
background-color: rgba(170,170,174,0.5);
}
**ASPX**
<asp:Panel ID="InputPanel" runat="server" CssClass="PopupPanel">
<asp:Label ID="HeaderLabel" runat="server"
Text="[text here]"
Font-Size="Large"></asp:Label>
<br />
<asp:TextBox ID="TextBox1" runat="server" TextMode="MultiLine" Width="85%"
Height="65%" Wrap="False"></asp:TextBox>
<br />
<asp:Button ID="okButton" runat="server" Text="Submit"
CssClass="genericButton" />
<asp:Button ID="CancelButton" runat="server" Text="Cancel"
CssClass="genericButton" />
</asp:Panel>
<ajaxToolkit:ModalPopupExtender ID="ModalPopupExtender1" runat="server"
PopupControlID="InputPanel" TargetControlID="PasteButton"
BackgroundCssClass="ModalBackground" PopupDragHandleControlID="HeaderLabel">
</ajaxToolkit:ModalPopupExtender>