/* 
    Created on : 27-aug-2015, 16:34:13
    Author     : REDBLOM
*/
/* 
    Created on : 11-dec-2014, 10:36:06
    Author     : REDBLOM
*/
.pure-g {
  display: -webkit-flex;
  -webkit-flex-flow: row wrap; }
  .pure-g * {
    box-sizing: border-box; }

body {
  /* redblom:Menu manager */ }
  body * {
    /*font-family: Courier;*/ }
  body .editable-content {
    border: 1px solid rgba(192, 192, 192, 0.5);
    -moz-border-radius: 10px;
    border-radius: 10px; }
  body div.redblom-home {
    position: relative;
    /*        ul.menu {
                .pure-menu-open, .pure-menu-open li {
                    background: none;
                    .active {
                        font-weight: bolder;
                        background-color: white;
                    }
                }
            }
            ul.menu > li > ul {
                display: none;
                margin-top: 2.2em;
            }
            ul.menu > li:hover > ul, ul.menu > li > ul.open {
                display: block;
            }
            ul.menu > li > ul > li.active, ul.menu > li:hover > ul > li {
                border: 1px solid silver;
                border-top-color: white;
                background-color: white;
            }*/ }
    body div.redblom-home .home-header {
      position: relative;
      /*            nav ul.menu {
                      li {
                          display: inline-block;
                      }
                  }*/ }
      body div.redblom-home .home-header .admin-control-container {
        left: 2em;
        top: 2em; }
    body div.redblom-home div[class*="-content"] {
      position: relative; }
      body div.redblom-home div[class*="-content"] div.admin-control-container {
        position: absolute;
        left: -30px; }
        body div.redblom-home div[class*="-content"] div.admin-control-container .admin-control {
          z-index: initial !important; }
        body div.redblom-home div[class*="-content"] div.admin-control-container .admin-control .halflings {
          font-family: 'Glyphicons Halflings';
          font-size: 20px; }
        body div.redblom-home div[class*="-content"] div.admin-control-container a {
          color: black; }
      body div.redblom-home div[class*="-content"] div[class*="-content"] div.admin-control-container {
        left: -25px;
        top: -5px; }
        body div.redblom-home div[class*="-content"] div[class*="-content"] div.admin-control-container .admin-control .halflings {
          font-size: 14px; }
    body div.redblom-home div.redblom-page-section {
      position: relative;
      margin-top: 3em; }
      body div.redblom-home div.redblom-page-section div.resource-not-public {
        position: absolute;
        top: -1.2em;
        color: red;
        font-size: smaller;
        font-weight: bold; }
    body div.redblom-home div.admin-control-container {
      z-index: initial; }
  body * .admin-control-edit-inline {
    display: none !important; }
  body div.resource-form-dialog {
    width: 600px !important; }
    body div.resource-form-dialog .pure-form .header {
      height: 2em;
      margin-bottom: 1em;
      font-weight: bolder; }
    body div.resource-form-dialog .pure-form .error-message {
      color: red;
      font-size: smaller;
      float: right; }
    body div.resource-form-dialog .pure-form span.page-section-uri-domain {
      background-color: #eee;
      border: 1px solid #ccc;
      border-radius: 4px;
      padding-top: 0.5em;
      padding-bottom: 0.5em;
      padding-left: 0.2em;
      padding-right: 0.2em;
      margin-left: 0.5em; }
    body div.resource-form-dialog .pure-form input.page-section-uri-hash {
      padding-left: 0;
      padding-right: 0;
      border-right: none;
      text-align: right; }
    body div.resource-form-dialog .pure-form input {
      width: calc(60% + 1em); }
    body div.resource-form-dialog .pure-form input.page-section-uri {
      /*border-left: none;*/
      /*width: 60%;*/ }
  body div.login {
    margin-top: 8%;
    border: 1px solid silver;
    padding: 1em; }
    body div.login div.note {
      margin-top: 1em; }
    body div.login form#login-form .errorSummary p {
      font-weight: bold; }
    body div.login form#login-form .errorSummary li {
      list-style: none;
      color: red; }
  body div.under-construction {
    position: absolute;
    /*width: 100%;*/
    z-index: 500; }
    body div.under-construction p {
      text-align: center;
      color: red;
      font-weight: bold;
      margin-top: 0.5em; }
  body div.json-editor .hide {
    display: none; }
  body div.json-editor button {
    height: 1.7em;
    width: 1.7em;
    border-radius: 5px;
    border: 1px solid #d3d3d3;
    background: #e6e6e6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
    font-weight: normal;
    color: #555555;
    position: relative;
    top: -0.2em;
    margin-left: 0.5em; }
    body div.json-editor button span {
      left: -1px; }
    body div.json-editor button span:before {
      position: relative;
      top: 1px;
      /*left: 0.1em;*/ }
    body div.json-editor button span.add-existing-page-sections:before, body div.json-editor button span.add-layout-row:before {
      content: "\002b"; }
    body div.json-editor button span.remove-page-section:before {
      content: "\e014";
      font-weight: lighter; }
    body div.json-editor button span.move-up-page-section:before {
      content: "\e260"; }
    body div.json-editor button span.move-down-page-section:before {
      content: "\e259"; }
  body div.json-editor h3 span:before {
    left: 0px !important; }
  body div.json-editor h3 > div {
    float: right;
    margin-right: 1em; }
  body div.json-editor div[data-schematype="array"] h3 {
    margin-top: 0.3em;
    margin-bottom: 0; }
  body div.json-editor div[data-schematype="object"] h3 {
    margin-top: 0;
    margin-bottom: 0; }
  body div.json-editor select {
    margin-left: 1em; }
  body div.json-editor label {
    position: relative;
    top: -2px; }
  body div.json-editor input {
    position: relative;
    top: -2px;
    margin-left: 0.5em;
    width: 85%; }
  body div.json-editor div.container-sections {
    background-color: whitesmoke;
    border: 1px solid silver;
    border-radius: 3px;
    margin-bottom: 3px; }
  body div.json-editor.page-sections div.form-control {
    padding-bottom: 0.3em !important; }
    body div.json-editor.page-sections div.form-control label {
      position: relative !important;
      font-size: larger !important; }
    body div.json-editor.page-sections div.form-control input {
      width: 89% !important;
      margin-left: 0.5em !important;
      padding-left: 0.2em;
      border: none;
      border-radius: 3px; }
  body div.select-page-sections-dialog, body div.select-page-dialog, body div.cms-select-page-link-dialog, body div.cms-select-sheet-link-dialog {
    width: 600px !important; }
    body div.select-page-sections-dialog ol#selectable, body div.select-page-dialog ol#selectable, body div.cms-select-page-link-dialog ol#selectable, body div.cms-select-sheet-link-dialog ol#selectable {
      font-size: smaller;
      list-style-type: none;
      margin: 0;
      padding: 0; }
      body div.select-page-sections-dialog ol#selectable #feedback, body div.select-page-dialog ol#selectable #feedback, body div.cms-select-page-link-dialog ol#selectable #feedback, body div.cms-select-sheet-link-dialog ol#selectable #feedback {
        font-size: 1.4em; }
      body div.select-page-sections-dialog ol#selectable .ui-selecting, body div.select-page-dialog ol#selectable .ui-selecting, body div.cms-select-page-link-dialog ol#selectable .ui-selecting, body div.cms-select-sheet-link-dialog ol#selectable .ui-selecting {
        background: #FECA40; }
      body div.select-page-sections-dialog ol#selectable .ui-selected, body div.select-page-dialog ol#selectable .ui-selected, body div.cms-select-page-link-dialog ol#selectable .ui-selected, body div.cms-select-sheet-link-dialog ol#selectable .ui-selected {
        background: #F39814;
        color: white; }
      body div.select-page-sections-dialog ol#selectable li, body div.select-page-dialog ol#selectable li, body div.cms-select-page-link-dialog ol#selectable li, body div.cms-select-sheet-link-dialog ol#selectable li {
        margin: 3px;
        padding: 0.4em;
        font-size: 1.4em;
        height: 18px;
        cursor: pointer;
        overflow: hidden; }
    body div.select-page-sections-dialog div.admin-buttons button, body div.select-page-dialog div.admin-buttons button, body div.cms-select-page-link-dialog div.admin-buttons button, body div.cms-select-sheet-link-dialog div.admin-buttons button {
      height: 2em;
      width: 2em;
      border-radius: 5px;
      border: 1px solid #d3d3d3;
      background: #e6e6e6 url(images/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x;
      font-weight: normal;
      color: #555555; }
    body div.select-page-sections-dialog div.admin-buttons button#create-new-page-section span.create-new-page:before, body div.select-page-sections-dialog div.admin-buttons button#create-new-page-section span.create-new-page-section:before, body div.select-page-sections-dialog div.admin-buttons button#create-new-page span.create-new-page:before, body div.select-page-sections-dialog div.admin-buttons button#create-new-page span.create-new-page-section:before, body div.select-page-dialog div.admin-buttons button#create-new-page-section span.create-new-page:before, body div.select-page-dialog div.admin-buttons button#create-new-page-section span.create-new-page-section:before, body div.select-page-dialog div.admin-buttons button#create-new-page span.create-new-page:before, body div.select-page-dialog div.admin-buttons button#create-new-page span.create-new-page-section:before, body div.cms-select-page-link-dialog div.admin-buttons button#create-new-page-section span.create-new-page:before, body div.cms-select-page-link-dialog div.admin-buttons button#create-new-page-section span.create-new-page-section:before, body div.cms-select-page-link-dialog div.admin-buttons button#create-new-page span.create-new-page:before, body div.cms-select-page-link-dialog div.admin-buttons button#create-new-page span.create-new-page-section:before, body div.cms-select-sheet-link-dialog div.admin-buttons button#create-new-page-section span.create-new-page:before, body div.cms-select-sheet-link-dialog div.admin-buttons button#create-new-page-section span.create-new-page-section:before, body div.cms-select-sheet-link-dialog div.admin-buttons button#create-new-page span.create-new-page:before, body div.cms-select-sheet-link-dialog div.admin-buttons button#create-new-page span.create-new-page-section:before {
      content: "\002b"; }
  body body.dragging, body body.dragging * {
    cursor: move !important; }
  body .dragged {
    position: absolute;
    opacity: 0.5;
    z-index: 2000; }
  body div[id="resource-form-dialog/resource/update/redblom/menu"] {
    min-height: 300px !important;
    /*         Hide the real menu 
            ul.menu {
                display: none;
            }*/ }
    body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu {
      margin: 0px; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu ol {
        margin: 0px; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu ol li.item-insert {
          position: absolute;
          right: 3.5em;
          width: 30px;
          margin-top: -1.4em; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu ol li ol li.item-insert {
          right: 5.5em; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li {
        position: relative;
        list-style: none;
        border: 1px solid #cccccc;
        margin-top: 3px;
        /*font-size: smaller;*/
        padding: 0.3em;
        cursor: default; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li a {
          display: inline-block;
          padding: 0px;
          color: #0088cc; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.label-edit, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.target-edit, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.resource-create, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.item-remove {
          height: 1em;
          width: 1em;
          margin-left: 0.5em; }
          body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.label-edit span, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.target-edit span, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.resource-create span, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.item-remove span {
            font-size: 0.7em; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.label-edit span:before {
          position: absolute;
          content: "\270f";
          top: -1px; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.target-edit span:before {
          position: absolute;
          content: "\e161";
          top: -1px; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.resource-create span:before {
          position: absolute;
          content: "\002b";
          top: -1px; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.item-remove {
          position: absolute;
          top: 0.4em;
          right: 0.5em; }
          body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li button.item-remove span:before {
            position: absolute;
            content: "\2212";
            top: -1px; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li.placeholder {
        position: relative;
        margin-bottom: 1em;
        padding: 0px; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li.placeholder:before {
        content: ">"; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu span.icon-move {
        margin-top: 0.1em;
        margin-right: 0.5em;
        width: 1em;
        font-size: 0.8em;
        cursor: move; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu span.icon-move:before {
        content: '\e068'; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.overlay {
        position: fixed;
        width: 0px;
        height: 0px; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.overlay.active {
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
        z-index: 100;
        background-color: silver;
        opacity: 0.7; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit {
        position: absolute;
        margin-top: -1em;
        display: inline-block;
        z-index: 101;
        border: 1px solid silver;
        border-style: outset;
        border-radius: 3px;
        padding: 15px;
        vertical-align: text-top;
        background-color: whitesmoke; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit input, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit button, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit input, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit button {
          display: inline-block;
          width: 0px;
          height: 0px;
          vertical-align: text-top; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit input, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit input {
          border-top-style: inset;
          border-top-width: 2px; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit button, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit button {
          border: 2px outset buttonface;
          margin-left: 10px; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit.active, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit.active {
        opacity: 1; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit.active input, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit.active button, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit.active input, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit.active button {
          width: auto;
          height: auto; }
      body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit.inactive, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit.inactive {
        opacity: 0;
        padding: 0px;
        border: none; }
        body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit.inactive input, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.label-edit.inactive button, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit.inactive input, body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu a div.target-edit.inactive button {
          width: 0px;
          height: 0px;
          border: none; }
    body div[id="resource-form-dialog/resource/update/redblom/menu"] ol.menu li.placeholder:before {
      position: absolute;
      /** Define arrowhead **/ }
  body div.editable-content:hover {
    background-color: rgba(204, 255, 255, 0.4); }
  body div.admin-control-container div.menu-header {
    display: none; }
  body div.home-admin-control-container {
    height: 1.8em; }
    body div.home-admin-control-container div.admin-details span.app-name {
      text-align: right;
      font-weight: bold; }
    body div.home-admin-control-container div.admin-details span.login-name {
      text-align: right; }
  body div.page-admin-control-container {
    position: fixed !important;
    left: 0.3em !important;
    z-index: 402 !important; }
  body div.page-info {
    position: fixed !important;
    top: 0.1em !important;
    left: 3em !important;
    z-index: 402 !important;
    display: inline-block; }
    body div.page-info div.page-title {
      display: inline-block;
      font-size: 1.5em;
      font-weight: bold;
      color: #444444; }
    body div.page-info div.resource-not-public {
      position: relative;
      display: inline-block;
      margin-left: 1em;
      color: red;
      font-weight: bold; }
  body .CodeMirror {
    border: 1px solid silver; }
  body .CodeMirror-hints {
    z-index: 1000; }

body.admin div.redblom-home .home-header {
  padding-top: 1em; }
body.admin div.select-page-dialog li,
body.admin div.cms-select-page-link-dialog {
  white-space: nowrap; }
body.admin span.cke-editor-link-navigate::after {
  font-size: .6em;
  content: "\e164";
  cursor: pointer;
  position: absolute;
  margin-top: -.6em;
  margin-left: -.2em; }

/* 
    Created on : 29-jun-2015, 11:51:52
    Author     : REDBLOM
*/
body nav.pure-menu .pure-menu-has-children a.menu-header-link {
  display: inline-block;
  padding: .5em .5em;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
  font-weight: bold;
  text-transform: uppercase; }
body nav.pure-menu .pure-menu-has-children a.menu-header-link:hover, body nav.pure-menu .pure-menu-has-children a.menu-header-link:focus, body nav.pure-menu .pure-menu-has-children > a.pure-menu-link {
  background-color: #eee; }
body nav.pure-menu .pure-menu-has-children > a.pure-menu-link {
  display: inline;
  /*border-bottom: 1px solid #eee;*/
  margin-right: 0.25em;
  margin-left: -.25em;
  /*padding: 0;*/ }
body nav.pure-menu .pure-menu-has-children a.pure-menu-link::after {
  position: absolute;
  font-size: 1.5em;
  color: #000;
  right: .55em;
  top: -.1em;
  padding: 0; }
body nav.pure-menu .pure-menu-children {
  background-color: #cb0520; }
body nav.pure-menu ul ul {
  left: 20% !important; }
body div.redblom-home .home-header {
  margin-top: 0px;
  /*top: 3em;*/ }
  body div.redblom-home .home-header .admin-control-container {
    left: -.2em;
    top: 1.8em; }
@media screen and (max-width: 52em) {
  body div.redblom-home #layout.active {
    margin-left: 0px !important; } }
body div.redblom-home div.pdk-sheet [class*="redblom-section-row-"] div.redblom-page-section {
  margin-top: 0; }
@media screen and (max-width: 52em) {
  body div.redblom-home div.pdk-sheet [class*="redblom-section-row-"].nr-of-sections-2 .pure-u-1-4, body div.redblom-home div.pdk-sheet [class*="redblom-section-row-"].nr-of-sections-2 .pure-u-md-1-4 {
    width: 50%; }
  body div.redblom-home div.pdk-sheet [class*="redblom-section-row-"].nr-of-sections-3 .pure-u-1-4, body div.redblom-home div.pdk-sheet [class*="redblom-section-row-"].nr-of-sections-3 .pure-u-md-1-4 {
    width: 33.33333%; } }
body div.redblom-home div.pdk-sheet [class*="redblom-section-row-"].nr-of-sections-0, body div.redblom-home div.pdk-sheet [class*="redblom-section-row-"].nr-of-sections-0 * {
  height: 0px;
  width: 0px; }
body div.redblom-home div.redblom-page div.redblom-page-section div.resource-not-public {
  left: 1em; }
body div.redblom-home div.redblom-page div.redblom-page-section .admin-control-container {
  left: -.5em !important;
  top: -1.1em !important; }
body div.redblom-home div.redblom-page form.comment-form textarea {
  width: 40em;
  height: 10em; }
body div.redblom-home div.redblom-page form.comment-form div.message {
  margin-bottom: 1em; }
body div.redblom-home div.pdk-form-comment-condensed {
  background-color: lightgray;
  margin-bottom: 2em;
  padding: 1em; }
body .unselectable {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */ }

body.admin div.redblom-home .home-header {
  /*padding-top: em;*/ }

td.redblom-cms-button {
  padding-left: 0.5em; }

.pure-img-responsive {
  max-width: 100%;
  height: auto; }

/*
Add transition to containers so they can push in and out.
*/
#layout,
#sheets-menu,
.menu-link {
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out; }

/*
This is the parent `<div>` that contains the menu and the content area.
*/
#layout {
  position: relative;
  padding-left: 0; }

#layout.active #sheets-menu {
  left: 150px;
  width: 175px; }

#layout.active .menu-link {
  left: 175px; }

/*
The content `<div>` is where all your content goes.
*/
.content {
  margin: 0 auto;
  padding: 0 2em;
  max-width: 800px;
  margin-bottom: 50px;
  line-height: 1.6em; }

.header {
  margin: 0;
  color: #333;
  text-align: center;
  padding: 2.5em 2em 0;
  border-bottom: 1px solid #eee; }

.header h1 {
  margin: 0.2em 0;
  font-size: 3em;
  font-weight: 300; }

.header h2 {
  font-weight: 300;
  color: #ccc;
  padding: 0;
  margin-top: 0; }

.content-subhead {
  margin: 50px 0 20px 0;
  font-weight: 300;
  color: #888; }

/*
The `#sheets-menu` `<div>` is the parent `<div>` that contains the `.pure-menu` that
appears on the left side of the page.
*/
#sheets-menu {
  margin-left: -150px;
  /* "#sheets-menu" width */
  width: 150px;
  position: fixed;
  /*top: 0;*/
  top: 5em;
  left: 0;
  bottom: 0;
  z-index: initial;
  background: #191818;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  z-index: 1; }

/*
All anchors inside the menu should be styled like this.
*/
#sheets-menu a {
  color: #999;
  border: none;
  padding: 0.6em 0 0.6em 0.6em; }

/*
Remove all background/borders, since we are applying them to #sheets-menu.
*/
#sheets-menu .pure-menu,
#sheets-menu .pure-menu ul {
  border: none;
  background: transparent; }

/*
Add that light border to separate items into groups.
*/
#sheets-menu .pure-menu ul,
#sheets-menu .pure-menu .menu-item-divided {
  border-top: 1px solid #333; }

/*
Change color of the anchor links on hover/focus.
*/
#sheets-menu .pure-menu li a:hover,
#sheets-menu .pure-menu li a:focus {
  background: #333; }

/*
This styles the selected menu item `<li>`.
*/
#sheets-menu .pure-menu-selected,
#sheets-menu .pure-menu-heading {
  background: #1f8dd6; }

/*
This styles a link within a selected menu item `<li>`.
*/
#sheets-menu .pure-menu-selected a {
  color: #fff; }

/*
This styles the menu heading.
*/
#sheets-menu .pure-menu-heading {
  font-size: 110%;
  color: #fff;
  margin: 0; }

/* -- Dynamic Button For Responsive Menu -------------------------------------*/
/*
The button to open/close the Menu is custom-made and not part of Pure. Here's
how it works:
*/
/*
`.menu-link` represents the responsive menu toggle that shows/hides on
small screens.
*/
.menu-link {
  position: fixed;
  display: block;
  /* show this only on small screens */
  /*top: 0;*/
  top: 3em;
  left: 0;
  /* "#sheets-menu width" */
  /*    background: #000;
      background: rgba(0,0,0,0.7);*/
  font-size: 10px;
  /* change this value to increase/decrease button size */
  z-index: 10;
  width: 2em;
  height: auto;
  padding: 1.7em 1.7em;
  margin-top: 4em; }

.menu-link:hover,
.menu-link:focus {
  /*background: #000;*/ }

.menu-link span {
  position: relative;
  display: block;
  font-size: 2em; }

.menu-link span,
.menu-link span:before,
.menu-link span:after {
  background-color: #fff;
  width: 100%;
  left: -5px;
  /*height: 0.2em;*/ }

.menu-link span:before,
.menu-link span:after {
  position: absolute;
  margin-top: -0.6em;
  color: white; }

.menu-link span:after {
  content: "\e235";
  left: -0.5em; }

.menu-link.active span:after {
  content: "\e234";
  left: -.2em; }

/* -- Responsive Styles (Media Queries) ------------------------------------- */
/*
Hides the menu at `48em`, but modify this based on your app's needs.
*/
@media (min-width: 148em) {
  .header,
  .content {
    padding-left: 2em;
    padding-right: 2em; }

  #layout {
    padding-left: 150px;
    /* left col width "#sheets-menu" */
    left: 0; }

  #sheets-menu {
    left: 150px; }

  .menu-link {
    position: fixed;
    left: 150px;
    display: none; }

  #layout.active .menu-link {
    left: 150px; } }
@media (max-width: 148em) {
  /* Only apply this when the window is small. Otherwise, the following
  case results in extra padding on the left:
      * Make the window small.
      * Tap the menu to trigger the active state.
      * Make the window large again.
  */
  #layout.active {
    position: relative; }

  body.admin #layout.active {
    margin-left: 150px; } }

/*# sourceMappingURL=site.base.css.map */