/*
	Prevent Flash of Unstyled Content
	Using JS to determine heading level means <h2>s are often too big and the wrong color on initial page load.
	So we are styling everything to look like <h3> as these are the most common and the median of the standard 1-6 levels.
	Not very DRY as these are ripped manually from other stylesheets but we want to make sure the page doesn't appear to load too slowly.
*/

hgroup > :first-child
{
   font-size: 24px;
   font-size: 2.4rem;
   line-height: 1.3;
}

hgroup
{
   margin-bottom: 1em;
}

[role="main"] .title ~ :not(article) hgroup > :first-child
{
   color:#114e76;
}

/*[role="main"] hgroup
{
   border-bottom: 1px solid #e1e1e1;
}*/

.docs [role="main"] hgroup
{
	padding-bottom: .5em;
}