.grid  {float: left; width: 50%; padding: 1% 1% 0 0; border-top: 3px solid #ccc; overflow: hidden}
 
@media all and (max-width: 639px) {
	.grid  {width: 99%;}
}
@media all and (min-width: 640px) {
	.grid  {width: 49%;}
}
@media all and (min-width: 800px) {
	.grid {width: 32%;}
}
@media all and (min-width: 1000px) {
	.grid {width: 23%;}
}
@media all and (min-width: 1200px) {
	.grid {width: 19%;}
}

#content {
    -webkit-column-count : 4;
    -webkit-column-gap : 20px;
    -moz-column-count : 4;
    -moz-column-gap : 20px;
    }

#contentwrapper {width: 90%; margin: 0 auto}
@media all and (min-width: 1200px) {
	#contentwrapper  {
	-webkit-column-count : 2;
	-webkit-column-gap : 20px;
	-moz-column-count : 2;
	-moz-column-gap : 20px;
	}
}
@media all and (min-width: 1600px) {
	#contentwrapper  {
	-webkit-column-count : 3;
        -webkit-column-gap : 20px;
        -moz-column-count : 3;
        -moz-column-gap : 20px;
	}
}

/* The above was ripped from http://reinholdweber.com/css/css3-a-big-storm-is-coming/ */

html { background : #202020;
        color : #f0f0f0;
        font-family : tahmoa, sans-serif, monospace; }

a { color : #e0e0a0;
        text-decoration : none; }

img { border-style: none; }

code { font-size : 1.40em;
        font-weight : bold; }