/* bits.scss */
/* special Luxi font */
@font-face {
  font-family: 'LuxiSerifRegular';
  src: url("../fonts/luxirr-webfont.eot");
  src: url("../fonts/luxirr-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/luxirr-webfont.woff") format("woff"), url("../fonts/luxirr-webfont.ttf") format("truetype"), url("../fonts/luxirr-webfont.svg#LuxiSerifRegular") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'LuxiSerifOblique';
  src: url("../fonts/luxirri-webfont.eot");
  src: url("../fonts/luxirri-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/luxirri-webfont.woff") format("woff"), url("../fonts/luxirri-webfont.ttf") format("truetype"), url("../fonts/luxirri-webfont.svg#LuxiSerifOblique") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'LuxiSerifBold';
  src: url("../fonts/luxirb-webfont.eot");
  src: url("../fonts/luxirb-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/luxirb-webfont.woff") format("woff"), url("../fonts/luxirb-webfont.ttf") format("truetype"), url("../fonts/luxirb-webfont.svg#LuxiSerifBold") format("svg");
  font-weight: normal;
  font-style: normal; }

@font-face {
  font-family: 'LuxiSerifBoldOblique';
  src: url("../fonts/luxirbi-webfont.eot");
  src: url("../fonts/luxirbi-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/luxirbi-webfont.woff") format("woff"), url("../fonts/luxirbi-webfont.ttf") format("truetype"), url("../fonts/luxirbi-webfont.svg#LuxiSerifBoldOblique") format("svg");
  font-weight: normal;
  font-style: normal; }

/*
Goldilocks Approach to Responsive Web Design Boilerplate

Author: Design by Front - @designbyfront
Version: 0.1
URL: http://www.goldilocksapproach.com
----------------------------------------------------------------------------------------

CONTENTS - GLOBAL.CSS
-----------------------------------------
1. RESET
2. ROOT
3. CORE TYPOGRAPHY
4. LINKS
5. GLOBAL LAYOUT & GLOBAL CUSTOM TYPOGRAPHY
6. CUSTOM LAYOUT & TYPOGRAPHY (Baby bear)
7. BROWSER AND NON-SEMANTIC STYLING

CONTENTS - LAYOUT.CSS
-----------------------------------------
8. CUSTOM LAYOUT & TYPOGRAPHY (Daddy bear)
9. CUSTOM LAYOUT & TYPOGRAPHY (Mummy bear)

*/
/* 1. RESET
----------------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

* {
  box-sizing: border-box; }

/* 2. ROOT
----------------------------------------------------------------------------------------*/
html {
  overflow-y: scroll;
  background: #619212 url(../images/wavecut_green.jpg); }

/* /ht Ethan Marcotte - http://front.ie/l8rJaA */
img, embed, object, video {
  max-width: 100%; }

.ie6 img.full, .ie6 object.full, .ie6 embed, .ie6 video {
  width: 100%; }

/* 3. CORE TYPOGRAPHY (separate from .typography styles)
----------------------------------------------------------------------------------------*/
nav ul, nav ol {
  list-style: none;
  margin: 0;
  padding: 0; }

a, a:visited {
  color: #619212;
  text-decoration: none; }

a:hover {
  text-decoration: underline; }

/* 5. GLOBAL LAYOUT & GLOBAL CUSTOM TYPOGRAPHY
----------------------------------------------------------------------------------------*/
.header {
  width: 100%;
  overflow: hidden;
  padding: 1em; }
  .header a.brand {
    height: 100px;
    display: block; }
    .header a.brand:hover {
      text-decoration: none; }
  .header img {
    float: left;
    height: 100%; }
  .header h1 {
    font-family: "LuxiSerifRegular", serif;
    color: #000;
    font-size: 2.618em;
    line-height: 1em; }
  .header nav.primary {
    overflow: auto;
    background: #619212;
    padding: 0.5em;
    letter-spacing: .03em; }
    .header nav.primary ul {
      float: left; }
    .header nav.primary li {
      float: left;
      margin-right: 1em;
      font-family: "LuxiSerifRegular", serif;
      font-size: 1.4em; }
      .header nav.primary li a {
        color: #ecefe6;
        text-shadow: 1px 1px 1px black; }
      .header nav.primary li:current a {
        color: orange; }

#main {
  padding-left: 1em; }

.content {
  overflow: hidden;
}  

.typography nav.secondary ul {
  list-style-type: none;
  margin-left: 0;
}

.typography nav.secondary ul li {
  padding-left: 1em;
  text-indent: -1em;
}

.typography nav.secondary ul li.current {
  font-weight: bold;
}

footer {
  margin-top: 20px;
  clear: both;
  padding-top: 10px;
  border-top: 4px solid #619212;
}

/* 6. CUSTOM LAYOUT & TYPOGRAPHY (Baby bear)
----------------------------------------------------------------------------------------*/
#container {
  padding: 0.809em;
  max-width: 30em;
  margin: auto; }

#main, .sidebar {
  width: 100%; }

header .brand img {
  margin: -0.5em 0.5em 0 0; }
header .brand h1 {
  font-size: 1.618em; }

aside {
  width: 100%; }

.responsive_menu select {
    display: block;
    width: 100%;
    height: 36px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857;
    color: rgb(85, 85, 85);
    vertical-align: middle;
    background-color: rgb(255, 255, 255);
    background-image: none;
    border: none;
} 

.content a.new-button {
  padding: 8px;
  background: cornflowerblue;
  color: #fff;
  border-radius: 4px;
} 

.content a.new-button:hover {
  text-decoration: none;
  background: #0a2659;
}

/* 7. BROWSER AND NON-SEMANTIC STYLING
----------------------------------------------------------------------------------------*/
.cf:before, .cf:after {
  content: "";
  display: block; }

.cf:after {
  clear: both; }

.ie6 .cf {
  zoom: 1; }