.container { width: 700px; margin: 0 auto; padding: 48px 0; }
.container .box { float: left; width: 300px; margin: 5px; padding: 20px; }
.container .expanded { float: none; width: auto; margin-bottom: 10px; }
.container .dark { background: #292929 url(../images/dark-pattern.png); }
.container .light { background: #eee url(../images/light-pattern.png); }
.dark pre { color: #bbb; background: #444; background: rgba(105,105,105,0.3); }
.light pre { color: #333; background: #ccc; background: rgba(155,155,155,0.3); }

@media screen and (max-width: 780px) {
	.container { width: auto; padding: 10px; }
	.container .box { float: none; width: auto; }
}