public/styles/vanilla/less/base.less
/*  ###########################################################################
    Author:    DutchCelt Design
    ########################################################################### */


        
/*  HTML5 display-role reset for older browsers ------------------------------- */

    article, aside, details, figcaption, figure, 
    footer, header, hgroup, menu, nav, section {
        display: block;
        }
        
    audio, canvas, video {
        display: inline-block;
        }


/*  Basic front-end patterns  ------------------------------------------------- */
    
    html {
        font-size: 100%;
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
        }

    body {
        margin: 0;
        font-style: normal;
        font-weight: normal;
        font-size: @body-scale;
        line-height: @transport;
        font-family: @typeface;
        text-rendering: optimizeLegibility;
        }
    ul, ol {
        margin-left: 0;
        padding: 0;
        }
    li ul, li ol {
        margin-left: @em;
        }
    ol ol {
        margin-left: @em;
        list-style-type:lower-alpha;
        }
    ol ol ol {
        margin-left: @em;
        list-style-type:lower-roman;
        }
    dl {
        margin-left: 0;
        padding: 0;
        }
    dt{ 
        margin-left: 0;
        font-weight: bold;
        }
    dd {
        margin-left: 0;
        display: list-item;
        list-style-type:disc;
        font-style: italic;
        }
        
    img {
        border: 0;
        -ms-interpolation-mode: bicubic;
        }
    code {
        white-space: pre;
        } 
                
    hgroup {
        padding: 0 0 @em 0;
        line-height: 1;
        }

    blockquote {
        text-align: right;
        font-style: italic;
        }
    blockquote:before, blockquote:after,
    q:before, q:after {
        content: "";
        }
    blockquote, q {
        quotes: "" "";
        }
    [hidden] {
        display: none;
        }

        
/*  Headings ------------------------------------------------------------------     
                
    1.  Added OO CSS classes to enable consistant and interchangable headings
        These can be used internally via LESS to extend more cleanly 
    2.  Setting margin to zero seems to be more usefull across typograhpic patterns
    
    */

    .h0 {
        margin: @interline 0 0 0; 
        font-weight: @header-weight;
        .double-great-primer;
        line-height: @header-lineheight;
        }
    h1, .h1 {
        margin: @interline 0 0 0; 
        font-weight: @header-weight;
        .two-line-pica;
        line-height: @header-lineheight;
        }
    h2, .h2 {
        margin: @interline 0 0 0; 
        font-weight: @header-weight;
        .double-pica;
        line-height: @header-lineheight;
        }
    h3, .h3 {
        margin: @interline 0 0 0; 
        font-weight: @header-weight;
        .great-primer;
        line-height: @header-lineheight;
        }
    h4, .h4 {
        margin: @interline 0 0 0; 
        font-weight: @header-weight;
        .augustin;
        line-height: @header-lineheight;
        }
    h5, .h5 {
        margin: @interline 0 0 0; 
        font-weight: @header-weight;
        .pica;
        line-height: @header-lineheight;
        }
    h6, .h6 {
        margin: @interline 0 0 0; 
        font-weight: @header-weight;
        .small-pica;
        line-height: @header-lineheight;
        }
    
    
/*  tables still need 'cellspacing="0"' in the markup ------------------------- */

    table {
        border-collapse: separate;
        border-spacing: 0;
        }
        
    caption, th, td {
        padding: @h @w;
        text-align: left;
        vertical-align: top;
        line-height: 1.2;
        background: inherit;
        }
    th { font-weight: bold; }
    

/*  links --------------------------------------------------------------------- */

    a { 
        text-decoration: none; 
        color: @link-color;
        background-repeat: no-repeat;
        }
    a:visited  {
        color: @link-color-visited;
        }
    a:hover  { 
        text-decoration:none; 
        color: @link-color-hover;
        outline: 0
        }
    a:active  { 
        text-decoration:none; 
        color: @link-color-active;
        outline: 0
        }
    a:focus {
        outline: thin dotted;
        }
