smalkil/layout.less

@basesize: 1em;

.clearfix() {
  *zoom: 1;

  &:before,
  &:after {
    content: " ";
    display: table;
  }
  &:after {
    clear: both;
  }
}

body{
  margin: @basesize 2 * @basesize;
  font-size: @basesize;
  line-height: 1.5 * @basesize;
  margin-bottom: 1.5 * @basesize;
}

h1 {
  font-size: 2 * @basesize;
  line-height: 0.75 * @basesize;
}

h2 {
  font-size: 1.5 * @basesize;
  line-height: @basesize;
}

p {
  text-indent: 2 * @basesize;
}

h1, h2, h3, h4, h5, h6 {  }
p { }
ol, ul { }
a { }
blockquote { }
pre, code { }
small { }
acronym {
  border-bottom: 1px dashed @foreground4;
  color: @foreground4;
}

.hidden {
  display: none;
}

.grid (@cols: 16) {
  @gutter: 1.5%;//1.5 * @basesize;
  .clearfix();
  .col(@width: 1) {
    //display: block;
    float: left;
    padding-left: @gutter;
    width: percentage(@width / @cols) - @gutter;
  }
  .column   { .col();   }
  .column2  { .col(2);  }
  .column3  { .col(3);  }
  .column4  { .col(4);  }
  .column5  { .col(5);  }
  .column6  { .col(6);  }
  .column7  { .col(7);  }
  .column8  { .col(8);  }
  .column9  { .col(9);  }
  .column10 { .col(10); }
  .column11 { .col(11); }
  .column12 { .col(12); }
  .column13 { .col(13); }
  .column14 { .col(14); }
  .column15 { .col(15); }
  .column16 { .col(16); }
  margin-left: - @gutter;
}