// HTML5 ✰ Boilerplate
//
// style.css contains a reset, font normalization and some base styles.
//
// Credit is left where credit is due.
// Much inspiration was taken from these projects:
// - yui.yahooapis.com/2.8.1/build/base/base.css
// - camendesign.com/design/
// - praegnanz.de/weblog/htmlcssjs-kickstart
//
// Modified to fit Survival ✚ Kit

  html {
    @include sk-html;
    overflow-y: scroll;
  }


// Sections (body, section, nav, article, aside, h1..6, header, footer, address)
// ----------------------------------------

  body, select, input, textarea { color: $font-color; font-family: $base-font-family; }

  body {  @include sk-body; font-size: $base-font-size; line-height: $base-line-height; }


// Grouping Content (p, hr, pre, blockquote, ol, ul, li, dl, dt, dt, dd, figure, figcaption, div)
// ----------------------------------------

  p { margin: 0 0 1em 0;}
  li { margin-bottom: (1em / 2);}

  hr { border: 0; border-top: 1px solid $hr-color; display: block; height: 1px; margin: 1em 0; padding: 0; }

  blockquote  { color: #666; font-style: italic; margin: 1.5em; }

  // normalize monospace sizing
  // meyerweb.com/eric/thoughts/2010/02/12/fixed-monospace-sizing/
  // en.wikipedia.org/wiki/MediaWiki_talk:Common.css/Archive_11#Teletype_style_fix_for_Chrome
  pre {
    // www.pathf.com/blogs/2008/05/formatting-quoted-code-in-blog-posts-css21-white-space-pre-wrap/
    white-space: pre; white-space: pre-wrap; word-wrap: break-word;
    padding: 15px;
  }

  pre, code, kbd, samp { font-family: monospace, sans-serif; }

  // Lists
  ul, ol { margin:$list-margin; padding:$list-padding;}

  ol { list-style-type: decimal; }

  // Remove margin from navigation lists.
  nav ul,
  nav li  { list-style:none; list-style-image: none; margin: 0; }

  // Lists
  dl      { margin: 0 0 1.5em 0; }

  dl dt   { font-weight: bold; }

  dd      { margin-left: 1.5em;}


// Text Level Semantics (a, em, strong, small, s, cite, q, dfn, abbr, time, code, var, samp, kbd, sub, i, b, u, mark, ruby, rt, rp, bdi, bdo, span, br, wbr)
// ----------------------------------------

  // Accessible focus treatment: people.opera.com/patrickl/experiments/keyboard/test
  a {text-decoration:none;}

  a:hover, a:active { outline: none; text-decoration:underline;}

  a, a:active, a:visited { color: $link-color; }

  a:hover { color: $link-hover-color; }

  // Headers (h1, h2, etc) have no default font-size or margin; define those yourself
  h1, h2, h3, h4, h5, h6 { @include sk-header-tags; }

  // j.mp/webkit-tap-highlight-color
  a:link { -webkit-tap-highlight-color: #FF5E99; }

  small { font-size: 85%; }

  strong, b, th, dfn { font-weight: bold; }

  em, i { font-style:italic; }

  mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }

  abbr,
  acronym     { border-bottom: 1px dotted #666; }

  address     { font-style: italic; margin: 0 0 1.5em; }

  // Set sub, sup without affecting line-height: gist.github.com/413930
  sub, sup { font-size: 75%; line-height: 0; position: relative; }

  sup { top: -0.5em; }

  sub { bottom: -0.25em; }


// Embedded Content (img)
// ----------------------------------------

  // Bicubic resizing for non-native sized IMG:
  // code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/
  .ie7 img { -ms-interpolation-mode: bicubic; }


// Tabular Data (table, caption, colgroup, col, tbody, thead, tfoot, tr, td, th)
// ----------------------------------------

  table       { margin-bottom: 1.4em; width:100%; }

  th          { font-weight: bold; }

  th,td,caption { padding: 4px 10px 4px 5px; text-align: left; }


// Edits (ins, del)
// ----------------------------------------

  ins { background-color: #ff9; color: #000; text-decoration: none; }

  del { color:#666; }


// Forms
// ----------------------------------------

  select, input, textarea, button { font: 99% $base-font-family; outline:none;}

  td { vertical-align: top; }

  textarea { overflow: auto; }

  // Align checkboxes, radios, text inputs with their label by: Thierry Koblentz tjkdesign.com/ez-css/css/base.css
  input[type="radio"] { vertical-align: text-bottom; }

  input[type="checkbox"] { vertical-align: bottom; }

  // Hand cursor on clickable input elements

  label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }

  // Webkit browsers add a 2px margin outside the chrome of form elements
  button, input, select, textarea { margin: 0; }


  // required:valid and required:invalid moved to form.scss

  // Make buttons play nice in IE:
  // www.viget.com/inspire/styling-the-button-element-in-internet-explorer/
  button { overflow: visible;  width: auto; }

  @if in-compatibility-mode() {
  .ie7 input[type="checkbox"] { vertical-align: baseline; }

  .ie6 input { vertical-align: text-bottom; }

  .ie6 legend, .ie7 legend { margin-left: -7px; }
  }


// Etc.
// ----------------------------------------

  ::-moz-selection{ background: $selected-background-color; color:$selected-font-color; text-shadow: none; }
  ::selection { background:$selected-background-color; color:$selected-font-color; text-shadow: none; }