mazerte/generator-footguard

// ------------------------------------------------------------------------------
//   @group Variables - Colors, Fonts, etc.
// ------------------------------------------------------------------------------
@md-colors-background     : #fefefe;

@md-colors-foreground     : #444;
@md-colors-headers        : #111;
@md-colors-quotes         : #666;

@md-colors-link           : #0645ad;
@md-colors-link-visited   : #0b0080;
@md-colors-link-hover     : #06e;
@md-colors-link-active    : #faa700;

@md-colors-selection      : rgba(255,255,0,0.3);
@md-colors-selection-text : @md-colors-foreground;

@md-font-headers          : 'Droid Serif', Georgia, Palatino, 'Palatino Linotype', Times, 'Times New Roman', serif;
@md-font-body             : 'Droid Serif', Georgia, Palatino, 'Palatino Linotype', Times, 'Times New Roman', serif;
@md-font-monospace        : 'Monaco', 'Ubuntu Mono', 'Lucida Console', 'Courier New', Courier, monospace;

// ------------------------------------------------------------------------------
//   @group Pagewide Styles
// ------------------------------------------------------------------------------
// These are totally optional of course
html {
    font-size: 100%;
    overflow-y: scroll;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    color:@md-colors-foreground;
    background:@md-colors-background;

    font-family: @md-font-body;
    font-size:12px;

    line-height:1.5em;
    padding:1em;
    max-width:52em;
}

// ------------------------------------------------------------------------------
//   @group Hyperlinks
// ------------------------------------------------------------------------------
a {
    color:@md-colors-link;
    text-decoration:none;

    &:visited { color: @md-colors-link-visited; }
    &:hover   { color: @md-colors-link-hover;   }
    &:active  { color: @md-colors-link-active;  }
    &:focus   { outline: thin dotted; }

    &:hover, &:active {
        outline: 0;
    }

    &::-moz-selection, &::selection {
        background: @md-colors-selection;
        color: @md-colors-link;
    }
}

::-moz-selection, ::selection {
    background: @md-colors-selection;
    color: @md-colors-selection-text;
}

// ------------------------------------------------------------------------------
//   @group Paragraphs and Headings
// ------------------------------------------------------------------------------
p {
    margin:1em 0;
}

h1, h2, h3, h4, h5, h6 {
    font-family: @md-font-headers;
    color: @md-colors-headers;
    font-weight: normal;
    line-height: 1em;
}

h4, h5, h6 {
    font-weight: bold;
}

h1 { font-size: 2.5em; }
h2 { font-size: 2em;   }
h3 { font-size: 1.5em; }
h4 { font-size: 1.2em; }
h5 { font-size: 1em;   }
h6 { font-size: 0.9em; }

// ------------------------------------------------------------------------------
//   @group General Typography
// ------------------------------------------------------------------------------
blockquote {
    color: @md-colors-quotes;
    margin: 0;
    padding-left: 1.5em;
    border-left: 0.5em mix(@md-colors-quotes, @md-colors-background, 25%) solid;
}

hr {
    display: block;
    height: 2px;
    border: 0;
    border-top: 1px solid lighten(@md-colors-foreground, 60%);
    border-bottom: 1px solid darken(@md-colors-background, 10%);
    margin: 1em 0;
    padding: 0;
}

pre, code, kbd, samp {
    font-family: @md-font-monospace;
    color: mix(@md-colors-foreground, @md-colors-headers, 50%);
    font-size: 0.98em;
}

pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap:   break-word;
}

b, strong     { font-weight: bold; }
dfn, mark, em { font-style: italic; }

ins {
    background: #ff9; color: @md-colors-headers; text-decoration: none;
}

mark {
    background: #ff0; color: @md-colors-headers; font-weight: bold;
}

sub, sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sup { top: -0.5em;     }
sub { bottom: -0.25em; }

ul, ol {
    margin: 1em 0;
    padding: 0 0 0 2em;
}
li p:last-child {
    margin:0
}
dd {
    margin: 0 0 0 2em;
}

// ------------------------------------------------------------------------------
//   @group Non-Text Elements
// ------------------------------------------------------------------------------
img {
    max-width:100%;
    border: 0;
    -ms-interpolation-mode: bicubic;
    vertical-align: middle;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}
td {
    vertical-align: top;
}

// ------------------------------------------------------------------------------
//   @group Media Queries
// ------------------------------------------------------------------------------
@media only screen and (min-width: 480px) {
    body {
        font-size:14px;
    }
}

@media only screen and (min-width: 768px) {
    body {
        font-size:16px;
    }
}

@media print {
    * { background: transparent !important; color: black !important; filter:none !important; -ms-filter: none !important; }
    body {font-size:12pt; max-width:100%;}
    a, a:visited { text-decoration: underline; }
    hr { height: 1px; border:0; border-bottom:1px solid black; }
    a[href]:after { content: " (" attr(href) ")"; }
    abbr[title]:after { content: " (" attr(title) ")"; }
    .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
    pre, blockquote { border: 1px solid #999; padding-right: 1em; page-break-inside: avoid; }
    tr, img { page-break-inside: avoid; }
    img { max-width: 100% !important; }
    @page :left { margin: 15mm 20mm 15mm 10mm; }
    @page :right { margin: 15mm 10mm 15mm 20mm; }
    p, h2, h3 { orphans: 3; widows: 3; }
    h2, h3 { page-break-after: avoid; }
}