html { padding: 0; }
body { margin: 20px; padding: 50px 5px; }

/* Layout */
#container { position: relative; width: 55em; min-width: 600px; max-width: 100%; margin: 0 auto; padding: 0; }

#header { width: 100%; height: 5em; overflow: hidden; }
#header a { height: 1em; overflow: hidden; }
#header a,  #resources li a { display: block; }

#skiplinks { margin: -10px -5px 0 -5px; padding: 0; position: absolute; top: -1.4em; right: 0; }
#skiplinks li { display: block; float: left; margin: 0; padding: 0; }
#skiplinks a { padding: .2em .5em; }

/* Body Layout */
#body { display: table; table-layout: fixed; border-collapse: collapse; width: 100%; }
#bodygroup { display: table-row; }
#content, #resources { display: table-cell; vertical-align: top; }

/* Columns */
#content { width: 60%; }
#resources { width: 35%; }


/* Main Content */
#content { padding: 2em 2.5%; }
#content h1 { margin: 0 -1em; }
#content h1 a { display: block; }

#content h2 { margin: .5em -2em .5em 0; border: 0 solid #FFC71E; border-width: 5px 0 2px 5px; border-top-color: transparent; }


/* Resources */
#resources h2 { height: 2em; margin: 0; padding: 0; }
#resources ul, #resources li { display: block; margin: 0; padding: 0; }
#resources>div { padding: 1em; margin: 1em; }

#resources h3 { margin: -1em -1em 0; }

/* Site Navigation */
#sitenav { position: absolute; top: 5em; right: 0; left: 0; margin: 0 35% 0 5px; padding: 0; height: 2em; }
#sitenav ul,
#sitenav li { margin: 0; padding: 0; }
#sitenav>li { display: block; float: left; width: 33%; position: relative; }
#sitenav>ul>li:first-child+li { width: 34%; } /* This is a substitute for :nth-child(2) which is not yet supported in Mozilla */

#sitenav a { display: block; height: 100%; }