My resources and archives section didn't stack on top of each-other.

My resources and archives section didn't stack on top of each-other and the bit of text showing "Verde Moderna by Dave Shea" has a background of sandy white, do you have any idea what I did wrong? Here is the CSS that affects the stacking archives and the list of other pages.

footer { background: #9bc152; }

footer:after { content: " "; display: table; clear: both; }

footer a { float: left; box-sizing: border-box; width: 20%; text-align: center; background: #9bc152; padding: 1em 0; color: #f6f4ec; letter-spacing: 0.5em; }

footer a:nth-of-type(even) { background: #81a53d; }

footer a:hover { background: #f6f4ec; color: #9bc152; }

aside { width: 100%; }

.sidebar { background: #1b1b21; color: #6b6d85; padding: 4em 0; text-align: center; }

.design-selection { float: left; width: 60%; font-style: italic; box-sizing: border-box; border-right: 1px solid #6b6d85; }

.design-archives, .zen-resources { display: inline-block; display: 40%; }

.sidebar h3 { font-size: .75em; margin: 0; line-height: 1.6em; padding: 0.5em 4%; color: #6b6d85; }

.sidebar ul { padding: 0; }

.sidebar li { list-style: none; padding: 0.3em 2%;

}

.sidebar a { font-family: 'Alegreya Sans SC','Alegreya Sans', Verdana, Tahoma, sans-serif; font-style: normal; color: #9bc152; letter-spacing: 0.06em; }

.sidebar a:hover { color: #f6f4ec; }

.design-selection a:nth-of-type(even) { font-family: 'Alegreya Sans', Verdana, Tahoma, sans-serif; color: #f6f4ec; }

.sidebar a:hover:nth-of-type(even) { color: #47495d; }

.zen-resources h3 { padding: 0.92em; }

.design-archives a, .zen-resources a { color: #47495d; }