Simplified OOCSS definitions and some helpers

oocss.css

/*template.css*/
.main{display:table-cell;*display:block;width:auto;}
.row,.main{*zoom:1;}
.row:after,.main:after{clear:both;display:block;visibility:hidden;overflow:hidden;height:0 !important;line-height:0;font-size:xx-large;content:" x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x ";}
.page{margin:0 auto;width:950px;_text-align:left;} /* wraps other template elems to set width */ /* text-align IE5.5 */
.liquid{width:auto;margin:0;}
/* ====== Columns ====== */
.leftCol{float:left;width:250px;_margin-right:-3px;}
.rightCol{float:right;width:300px;_margin-left:-3px;}

/*grid.css*/
.line,.lastUnit{overflow:hidden; *overflow:visible;*zoom:1;}
.unit{float:left;}
.unitRight{float:right;}
.size1of1{float:none;}
.size1of2{width:50%;}
.size1of3{width:33.33333%;}
.size2of3{width:66.66666%;}
.size1of4{width:25%;}
.size3of4{width:75%;}
.size1of5{width:20%;}
.size2of5{width:40%;}
.size3of5{width:60%;}
.size4of5{width:80%;}
.lastUnit{float:none;width:auto;_position:relative;_left:-3px;_margin-right:-3px;}

/*spacing.css*/
/* spacing helpers
p,m = padding,margin
a,t,r,b,l,h,v = all,top,right,bottom,left,horizontal,vertical
s,m,l,n = small(5px),medium(10px),large(20px),none(0px)
*/
.ptn,.pvn,.pan{padding-top:0px !important}
.pts,.pvs,.pas{padding-top:5px !important}
.ptm,.pvm,.pam{padding-top:10px !important}
.ptl,.pvl,.pal{padding-top:20px !important}
.prn,.phn,.pan{padding-right:0px !important}
.prs,.phs,.pas{padding-right:5px !important}
.prm,.phm,.pam{padding-right:10px !important}
.prl,.phl,.pal{padding-right:20px !important}
.pbn,.pvn,.pan{padding-bottom:0px !important}  
.pbs,.pvs,.pas{padding-bottom:5px !important}
.pbm,.pvm,.pam{padding-bottom:10px !important}
.pbl,.pvl,.pal{padding-bottom:20px !important}
.pln,.phn,.pan{padding-left:0px !important}
.pls,.phs,.pas{padding-left:5px !important}
.plm,.phm,.pam{padding-left:10px !important}
.pll,.phl,.pal{padding-left:20px !important}
.mtn,.mvn,.man{margin-top:0px !important}
.mts,.mvs,.mas{margin-top:5px !important}
.mtm,.mvm,.mam{margin-top:10px !important}
.mtl,.mvl,.mal{margin-top:20px !important}
.mrn,.mhn,.man{margin-right:0px !important}
.mrs,.mhs,.mas{margin-right:5px !important}
.mrm,.mhm,.mam{margin-right:10px !important}
.mrl,.mhl,.mal{margin-right:20px !important}
.mbn,.mvn,.man{margin-bottom:0px !important}  
.mbs,.mvs,.mas{margin-bottom:5px !important}
.mbm,.mvm,.mam{margin-bottom:10px !important}
.mbl,.mvl,.mal{margin-bottom:20px !important}
.mln,.mhn,.man{margin-left:0px !important}
.mls,.mhs,.mas{margin-left:5px !important}
.mlm,.mhm,.mam{margin-left:10px !important}
.mll,.mhl,.mal{margin-left:20px !important}
.mra,.mha{margin-right:auto !important}
.mla,.mha{margin-left:auto !important}

/*media.css*/
/* ====== media ====== */
.media{overflow:hidden;*overflow:visible;*zoom:1;}
.media .img{float:left;}
.media .img.right{float:right;}
.media .img img{display:block;}
.media .imgExt{float:right;}
.media .bd, .media .ft, .media .hd{overflow:hidden; *overflow:visible; *zoom:1;}

/* ====== Helper ====== */
.hidden {display:none;}
.invisible {visibility:hidden;}
.element-invisible {
    position: absolute !important;
    height: 1px; width: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px); /* IE6, IE7 */
    clip: rect(1px, 1px, 1px, 1px);
}
.fLeft {float:left;}
.fRight {float:right;}
.clearfix:after {content:'\20';display:block;height:0;clear:both;}
.clearfix {*zoom:1;}
.inline-block {display:inline-block;*zoom:1;*display:inline;}

/* ====== Multiple Columns ====== */
.columns {display:block !important;}
.columns li {vertical-align:top;display:-moz-inline-stack !important;display:inline-block !important;*display:inline !important;*zoom:1;border-left:0 none !important;border-right:0 none !important;margin:0 !important;padding-left:0 !important;padding-right:0 !important;}
.columns1 li {width:100%;}
.columns2 li {width:50%;}
.columns3 li {width:33.3339%;}
.columns4 li {width:25%;}
.columns5 li {width:20%;}
.columns6 li {width:16%;}

/* ====== Lists ====== */
.horizontal-list {*zoom:1;}
.horizontal-list:after {content:'\20';display:block;height:0;clear:both;}
.horizontal-list li {float:left;}
.inline-list li {display:inline;}