dio-v
8/1/2013 - 8:24 AM

Grid system Dio Less

Grid system Dio Less

@siteWidth:960px;
.row { clear: both; margin: 0 auto; max-width: @siteWidth; width: 96%;*zoom: 1;}
.row:before, .row:after { content: ""; display: table; }
.row:after { clear: both; }
.row.wide { width: 100%; max-width: 100%;}
.row .row { width: 100% }
.row.wide .row { max-width: @siteWidth; margin:0 auto; }
.columns {float: left;}

img, object, embed { max-width: 100%; height: auto; }
object, embed { height: 100%; }
img { -ms-interpolation-mode: bicubic; }

@mainWidth:100%;
@colwidth: @mainWidth/12;
.one { width: @colwidth*1; }
.two { width: @colwidth*2; }
.three { width: @colwidth*3; }
.four { width: @colwidth*4; }
.five { width: @colwidth*5; }
.six { width: @colwidth*6; }
.seven { width: @colwidth*7; }
.eight { width: @colwidth*8; }
.nine { width: @colwidth*9; }
.ten { width: @colwidth*10; }
.eleven { width: @colwidth*11; }
.twelve { margin-left: 0; width: @colwidth*12; }

@media only screen and (max-width: 768px) {
	.columns{
		width:100%;
		float:none;
    padding:0!important;		
	}
  .row{padding:0 10px;}
  .row .row, .row.wide{padding:0;}	
}