.page-loading .menu-container,.page-loading .menu-panel {
  display:none;
}

.menu-container {
  background-color:#000;
  display:block;
  position:absolute;
  top:0;
  left:0;
  width:280px;
  z-index:24;
  height:100%;
  overflow-x:hidden;
  overflow-y:scroll;
}

.menu-panel {
  position:absolute;
  display:block;
  width:280px;
  -webkit-transition:left 0.3s;
  -moz-transition:left 0.3s;
  -o-transition:left 0.3s;
  transition:left 0.3s;
  left:0;
  top:0;
  z-index:25;
}

.sub-menu-panel {
  background-color:#000;
  position:absolute;
  top:0;
  left:280px;
  z-index:5;
  height:100%;
  width:280px;
  overflow-y:scroll;
  -webkit-transition:left 0.3s;
  -moz-transition:left 0.3s;
  -o-transition:left 0.3s;
  transition:left 0.3s;
}

.sub-menu-panel.open {
  left:0;
  z-index:75;
}

.ed-outer.ed-menu-open {
  overflow-x:hidden;
}

.ed-outer .editor-tools,
.ed-outer .ed-page,
.ed-outer .editor-drawer {
  -webkit-transition:-webkit-transform 0.3s;
  -moz-transition:-moz-transform 0.3s;
  -o-transition:-o-transform 0.3s;
  transition:transform 0.3s;
}

.ed-outer.ed-menu-open .editor-tools,
.ed-outer.ed-menu-open .ed-page,
.ed-outer.ed-menu-open .editor-drawer {
  -webkit-transform:translate3d(280px,0,0);
  -moz-transform:translate3d(280px,0,0);
  -ms-transform:translate3d(280px,0,0);
  -o-transform:translate3d(280px,0,0);
  transform:translate3d(280px,0,0);
}

.ed-outer.ed-menu-open .editor-tools .nav-hamburger {
  background-color:#262626;
  height:100%;
}

.menu-container.submenu-focused .menu-panel {
  left:-280px;
  z-index:5;
}

.menu-container.menu-focused .sub-menu-panel {
  left:280px;
}

@media screen and (min-width:50em) {
  .ed-outer.ed-menu-open {
    overflow-x:visible;
  }
  .ed-outer .editor-tools,
  .ed-outer .ed-page {
    -webkit-transition:left 0.3s;
    -moz-transition:left 0.3s;
    -o-transition:left 0.3s;
    transition:left 0.3s;
  }
  .ed-outer.ed-menu-open .editor-tools,
  .ed-outer.ed-menu-open .ed-page {
    left:280px;
    -webkit-transform:none;
    -moz-transform:none;
    -ms-transform:none;
    -o-transform:none;
    transform:none;
  }
  .ed-outer.ed-menu-open .editor-drawer {
    -webkit-transform:none;
    -moz-transform:none;
    -ms-transform:none;
    -o-transform:none;
    transform:none;
  }
  .ed-outer .versions-menu {
    -webkit-transition:left 0.3s;
    -moz-transition:left 0.3s;
    -o-transition:left 0.3s;
    transition:left 0.3s;
  }
  .ed-outer.ed-menu-open .versions-menu {
    left:22.5em;
  }
}

.nav-header {
  background-color:#262626;
  padding:2.375em 1em 1em;
  color:#f2f2f2;
  position:relative;
}

.nav-back-header {
  background-color:#262626;
  position:relative;
}

.nav-back-header a {
  width:100%;
  display:block;
  height:49px;
}

@media screen and (min-width:50em) {
  .nav-header {
    padding:2.375em 1.5em 1em;
  }
  .nav-back-header a {
    height:32px;
  }
}

.nav-border {
  border-top:1px solid #404040;
}

.counts {
  font-size:13px;
  font-size:0.8125rem;
  margin-bottom:0;
  width:100%;
}

.counts span {
  color:#999;
}

.counts li:first-child::after {
  color:gray;
  content:"\2022";
  margin:0 0.3em 0 0.6em;
}

.counts .number {
  color:#e6e6e6;
}

.nav-header h3,
.nav-border h4 {
  font-weight:normal;
  font-size:14px;
  font-size:0.875rem;
}

.nav-header h3 {
  margin-bottom:.5em;
}

.nav-header h3 span {
  color:#ccc;
  font-size:12px;
  font-size:0.75rem;
}

.autocomplete-suggestions {
  border:1px solid #ccc;
  background-color:#fff;
  overflow:auto;
  max-width:24em;
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  -ms-border-radius:3px;
  -o-border-radius:3px;
  border-radius:3px;
}

.autocomplete-suggestion {
  padding:2px 5px;
  white-space:nowrap;
  overflow:hidden;
  font-size:12px;
  font-size:0.75rem;
  color:#999;
  cursor:pointer;
}

.autocomplete-selected {
  background-color:#e6e6e6;
}

.autocomplete-suggestions strong {
  font-weight:normal;
  color:#4d4d4d;
}

.cell-tags {
  display:none;
}

.can-haz-tags .cell-tags {
  display:block;
  background:#f7f7f7;
  padding:9px;
  position:relative;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  font-size:11px;
  font-size:0.6875rem;
  -webkit-transition:all 0.3s;
  -moz-transition:all 0.3s;
  -o-transition:all 0.3s;
  transition:all 0.3s;
}

.cell-tags .toggle-tagging {
  float:right;
  width:20px;
  height:20px;
  text-indent:-1000em;
  overflow:hidden;
  -webkit-border-radius:3em;
  -moz-border-radius:3em;
  -ms-border-radius:3em;
  -o-border-radius:3em;
  border-radius:3em;
  background-color:#fff;
  -webkit-transition:background-color 0.3s;
  -moz-transition:background-color 0.3s;
  -o-transition:background-color 0.3s;
  transition:background-color 0.3s;
  position:relative;
}

.tagging .cell-tags .toggle-tagging {
  background-color:#999;
}

.cell-tags .toggle-tagging .icon-content {
  position:absolute;
  left:0;
  top:0;
  width:20px;
  height:20px;
  background-size:8px 8px;
  background-position:50% 50%;
  -webkit-transition:opacity 0.3s;
  -moz-transition:opacity 0.3s;
  -o-transition:opacity 0.3s;
  transition:opacity 0.3s;
}

.cell-tags .toggle-tagging .ico-arrow-down-white {
  opacity:0;
  background-size:8px 4px;
}

.tagging .cell-tags .toggle-tagging .ico-arrow-down-white {
  opacity:1;
}

.tagging .cell-tags .toggle-tagging .ico-add-sm {
  opacity:0;
}

.cell-tags .tags-onboarding {
  display:none;
  font-style:italic;
  color:#b7b7b7;
  font-size:11px;
  font-size:0.6875rem;
  padding:0 0 0 .4em;
  overflow:hidden;
  position:relative;
  margin-bottom:6px;
}

.cell-tags.empty .tags-onboarding {
  display:inline-block;
  float:left;
  margin-top:-1px;
}

.tagging .cell-tags .tags-onboarding {
  display:none;
}

.cell-tags ul {
  display:inline;
  margin-bottom:0;
}

.cell-tags li {
  display:inline-block;
  padding:.1em .6em .3em .45em;
  background-color:#fff;
  -webkit-border-radius:1em;
  -moz-border-radius:1em;
  -ms-border-radius:1em;
  -o-border-radius:1em;
  border-radius:1em;
  color:#999;
  font-size:11px;
  font-size:0.6875rem;
  margin-right:0.2em;
  margin-bottom:5px;
  word-break:break-word;
  overflow:hidden;
  position:relative;
  max-width:80%;
}

.cell-tags:after {
  content:"";
  display:table;
  clear:both;
}

.tagging .cell-tags li {
  padding-right:.1em;
}

.cell-tags li a {
  display:none;
  color:#999;
  margin:1px 0 0;
}

.tagging .cell-tags li a {
  display:inline-block;
}

.cell-tags li a:hover {
  text-decoration:none;
  color:#999;
}

.ico-remove-tag {
  float:right;
  height:6px;
  width:1em;
  text-indent:-1000em;
  position:relative;
  background-position:center center;
  padding:.4em;
}

.cell-tags .new-tag-input-wrapper {
  display:inline-block;
  padding:0 0 .7em;
  overflow:hidden;
  font-size:11px;
  font-size:0.6875rem;
}

.cell-tags input {
  background:transparent;
  border:none;
  font-size:11px;
  font-size:0.6875rem;
  width:1em;
  color:#666;
  padding:0;
  margin:0;
}

.cell-tags input:focus {
  outline:none;
}

.cell-tags .new-tag-measure {
  font-size:11px;
  font-size:0.6875rem;
  padding:4px;
  position:absolute;
  left:-1000em;
}

.tags-clipping-indicator {
  display:none;
  position:absolute;
  top:0.6em;
  right:3em;
  font-size:11px;
  font-size:0.6875rem;
  color:#999;
}

.tags-clipped .tags-clipping-indicator {
  display:block;
}

.tagging .tags-clipping-indicator {
  display:none;
}

.menu-panel .cell-tags {
  height:4.5em;
  overflow:hidden;
  -webkit-transition:all 0.3s;
  -moz-transition:all 0.3s;
  -o-transition:all 0.3s;
  transition:all 0.3s;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
  background-color:#262626;
  padding:15px 10px 6px 20px;
}

.tagging .menu-panel .cell-tags {
  height:auto;
}

.menu-panel .cell-tags li {
  margin-bottom:15px;
  max-width:72%;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.tagging .menu-panel .cell-tags li {
  margin-bottom:5px;
  max-width:80%;
  white-space:normal;
  text-overflow:none;
}

.menu-panel .tags-clipping-indicator {
  top:1.5em;
}

.menu-panel .cell-tags.empty .tags-onboarding {
  margin-top:1px;
}

.menu-panel .cell-tags .tag {
  background-color:#404040;
}

.menu-panel .cell-tags .toggle-tagging,
.tagging .menu-panel .cell-tags .toggle-tagging {
  background-color:#404040;
  -webkit-transform:rotate(180deg);
  -moz-transform:rotate(180deg);
  -ms-transform:rotate(180deg);
  -o-transform:rotate(180deg);
  transform:rotate(180deg);
}

.status-document {
  display:inline-block;
  font-weight:normal;
  font-size:14px;
  font-size:0.875rem;
  color:#999;
  margin-bottom:10px;
}

.status-document .active {
  background-color:#3d9ecf;
  color:#fff;
  -webkit-border-radius:0.2em;
  -moz-border-radius:0.2em;
  -ms-border-radius:0.2em;
  -o-border-radius:0.2em;
  border-radius:0.2em;
  font-size:13px;
  font-size:0.8125rem;
  padding:0.1em 0.5em;
  margin:0 0.2em;
  font-style:normal;
}

.status-document cite {
  color:#999;
  font-size:13px;
  font-size:0.8125rem;
  font-style:normal;
  font-weight:normal;
  background:#1a1a1a;
  -webkit-border-radius:0.2em;
  -moz-border-radius:0.2em;
  -ms-border-radius:0.2em;
  -o-border-radius:0.2em;
  border-radius:0.2em;
  padding:0.1em 0.5em;
  margin:0 0.2em;
}

.status-document a:hover,
.status-document a:active,
.status-document a:focus {
  color:#fff;
  background:#00ABE8;
  text-decoration:none;
}

.doc-status-hdg {
  background-color:#262626;
  border-bottom:1px solid #404040;
}

.doc-status {
  display:block;
  cursor:pointer;
  padding:1em 1.5em 1em 1em;
  background-color:#262626;
  color:#f2f2f2;
  position:relative;
}

@media screen and (min-width:50em) {
  .doc-status {
    padding-left:1.5em;
  }
}

a.doc-status {
  text-decoration:none;
  color:#ccc;
  width:238px;
  cursor:default;
}

a:hover.doc-status,
a:active.doc-status,
a:focus.doc-status {
  color:#fff;
}

a.doc-status.has-arrow {
  background-position:260px 50%;
  cursor:pointer;
}

.doc-status:before {
  content:" ";
  height:1em;
  width:1em;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;
  -ms-border-radius:2px;
  -o-border-radius:2px;
  border-radius:2px;
  display:inline-block;
  margin-right:11px;
  position:relative;
  top:2px;
  margin-left:2px;
}

@media screen and (min-width:50em) {
  .doc-status:before {
    margin-left:4px;
  }
}

.doc-status.status-draft:before {
  background-color:#3d9ecf;
}

.doc-status.status-reviewing:before {
  background-color:#826699;
}

.doc-status.status-revising:before {
  background-color:#d1a613;
}

.doc-status.status-copyediting:before {
  background-color:#C33;
}

.doc-status.status-final:before {
  background-color:#88b716;
}

.doc-tags {
  margin-bottom:0;
  margin-left:-.4em;
}

.doc-tags li {
  color:#999;
  background-color:#404040;
  font-size:11px;
  font-size:0.6875rem;
  -webkit-border-radius:3em;
  -moz-border-radius:3em;
  -ms-border-radius:3em;
  -o-border-radius:3em;
  border-radius:3em;
  padding:.2em .5em .4em;
}

.add-tags {
  position:absolute;
  right:5px;
  bottom:13px;
}

.status-selection-menu li,
.checked-menu li,
.sub-menu-panel .tag-list li {
  border-top:1px solid #404040;
}

.status-selection-menu li:last-child,
.checked-menu li:last-child,
.sub-menu-panel .tag-list li:last-child {
  border-bottom:1px solid #404040;
}

.status-selection-menu li label,
.checked-menu li label {
  padding:1em 1em 1em 1em;
  margin:0;
  display:block;
  color:#ccc;
  font-size:14px;
  font-size:0.875rem;
  background-position:.5em .5em;
  position:relative;
  width:80%;
  cursor:pointer;
}

.status-selection-menu li label {
  padding-left:3em;
}

.status-selection-menu li label:hover,
.checked-menu li label:hover {
  color:#fff;
}

.status-selection-menu input,
.checked-menu input {
  position:absolute;
  left:-1000em;
}

.status-selection-menu input:checked+label,
.checked-menu .selected label {
  background-position:250px 50%;
  color:#fff;
}

.selected .filter-your-docs {
  background-position:255px 50%;
  color:#fff;
}

.status-selection-menu label:before {
  background-color:#fff;
  content:" ";
  height:1em;
  width:1em;
  -webkit-border-radius:2px;
  -moz-border-radius:2px;
  -ms-border-radius:2px;
  -o-border-radius:2px;
  border-radius:2px;
  display:block;
  margin-right:11px;
  position:absolute;
  top:36%;
  left:1em;
}

.status-draft-menu label:before {
  background-color:#3d9ecf;
}

.status-reviewing-menu label:before {
  background-color:#826699;
}

.status-revising-menu label:before {
  background-color:#d1a613;
}

.status-copyediting-menu label:before {
  background-color:#C33;
}

.status-final-menu label:before {
  background-color:#88b716;
}

.sub-menu-panel .tag-header {
  border-top:1px solid #404040;
  border-bottom:none;
  padding:1.25em 1em 1em 1em;
}

.sub-menu-panel .manage-tags {
  top:2.1em;
  right:1.75em;
}

.sub-menu-panel .tag-list .tag-name {
  width:75%;
}

.sub-menu-panel .tag-list .count {
  width:12%;
  padding-right:20px;
}

.sub-menu-panel .tag-list li a {
  padding:1em;
}

.sub-menu-panel .tag-list {
  font-size:14px;
  font-size:0.875rem;
}

.sub-menu-panel .tag-list li.active a,
.sub-menu-panel .tag-list li.active a .tag-name,
.sub-menu-panel .tag-list li.active a .count {
  background-color:transparent;
  border:none;
  color:#fff;
  background-position:right 50%;
}

.sub-menu-panel .tag-list li.active a .count {
  background-position:right 50%;
}

.sub-menu-panel .tag-list li a:hover,
.sub-menu-panel .tag-list li a:hover .tag-name,
.sub-menu-panel .tag-list li a:hover .count {
  background-color:transparent;
  color:#fff;
  text-decoration:none;
}

.sub-menu-panel .tag-list-edit li:after {
  clear:both;
  display:table;
  content:"";
}

.sub-menu-panel .tag-list-edit li {
  padding:1em;
}

.sub-menu-panel .icon-changes {
  left:1em;
  top:1.5em;
}

.sub-menu-panel .save-tags {
  position:absolute;
  right:1.7em;
  top:2.25em;
}

.sub-menu-panel a.btn-flat {
  background:#404040;
  color:#999;
}

.sub-menu-panel a.btn-flat:hover,
.sub-menu-panel a.btn-flat:active,
.sub-menu-panel a.btn-flat:focus {
  background:#595959;
  color:#ccc;
}

.nav-desktop {
  display:none;
}

.small-copy {
  font-size:12px;
  font-size:0.75rem;
}

.nav-group {
  border-top:1px solid #404040;
  padding:1em 1em 0;
}

.nav-group:after,
.nav-group-no-border:after {
  content:"";
  display:table;
  clear:both;
}

.nav-group-no-border {
  padding:.5em 1em;
}

.nav-hdg-1,
.sub-menu-panel .tag-header h2 {
  color:#e6e6e6;
  font-weight:600;
  font-size:16px;
  font-size:1rem;
}

.nav-hdg-2 {
  font-size:12px;
  font-size:0.75rem;
  text-transform:uppercase;
  letter-spacing:2px;
  color:#999;
  margin-bottom:.5em;
  font-weight:400;
}

.nav-hdg-3 {
  font-size:13px;
  font-size:0.8125rem;
  color:#e6e6e6;
  font-weight:400;
  margin-bottom:.5em;
}

.hdg-margin {
  margin:1.25em 1em 1em 1em;
}

.nav-group a {
  color:#ccc;
  font-size:14px;
  font-size:0.875rem;
}

.nav-group a:hover,
.nav-group a:active,
.nav-group a:focus {
  color:#fff;
  text-decoration:none;
}

.nav-group-left {
  float:left;
}

.nav-group-right {
  float:right;
  width:50%;
}

.full-width-links {
  margin-bottom:0;
}

.full-width-links li a {
  width:85%;
  padding-left:26px;
  margin:.5em 0;
  display:block;
}

.full-width-links .has-icon {
  background-position:0 48%;
}

.full-width-links .ico-nav-delete {
  background-position-x:2px;
}

.align-right {
  text-align:right;
}

.nav-mobile-list li {
  border-top:1px solid #404040;
}

.nav-mobile-list li:first-child {
  border-top:none;
}

.nav-mobile-list li a {
  padding:1em 1em 1em 3em;
  margin:0;
  display:block;
  color:#ccc;
  font-size:14px;
  font-size:0.875rem;
  background-position:.5em .5em;
  position:relative;
  width:80%;
}

.nav-mobile-list li a.account {
  padding-left:1em;
}

.nav-mobile-list li .ico-avatar {
  float:left;
  margin:1px 10px 0 0;
}

.nav-mobile-list li a:hover,
.nav-mobile-list li a:active,
.nav-mobile-list li a:focus {
  color:#fff;
  text-decoration:none;
}

.nav-mobile-list li:last-child {
  border-bottom:1px solid #404040;
}

.nav-mobile-list .has-icon {
  background-position:15px 1.2em;
}

.nav-mobile-list .ico-nav-integrations {
  background-position:17px 1.3em;
}

.nav-mobile-list .ico-nav-leave {
  background-position-y:1.3em;
}

.nav-mobile-list .ico-nav-delete {
  background-position-x:17px;
}

.nav-mobile-list .ico-nav-next-arrow {
  position:absolute;
  right:4px;
  top:18px;
}

.views-group {
  padding-bottom:1em;
}

.views-list {
  margin-bottom:0;
}

.views-list a {
  display:block;
  float:left;
  margin-right:15px;
  font-size:12px;
  font-size:0.75rem;
  color:#999;
  text-align:center;
}

.icon-wrapper {
  background-color:#333;
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  -ms-border-radius:3px;
  -o-border-radius:3px;
  border-radius:3px;
  display:block;
  width:28px;
  height:28px;
  margin:0 auto 5px auto;
}

.icon-wrapper:hover {
  background-color:#e6e6e6;
}

.ico-hover-view-html {
  width:19px;
}

.icon-wrapper .is-icon {
  margin:0 auto;
  background-position:center -95px;
  width:28px;
  height:28px;
}

.icon-wrapper:hover .is-icon {
  background-position-y:6px;
}

.icon-wrapper .ico-hover-view-editor {
  background-position:center -94px;
}

.icon-wrapper .ico-hover-view-html {
  background-position:center -94px;
}

.ico-back-arrow {
  position:relative;
  margin:0;
  display:block;
  background-position:1em center;
}

.selected .icon-wrapper {
  background-color:#e6e6e6;
}

.selected .icon-wrapper .is-icon {
  background-position-y:6px;
}

.selected .icon-wrapper .ico-hover-view-preview,
.icon-wrapper:hover .ico-hover-view-preview {
  background-position-y:5px;
}

.integrations-list li a {
  margin:.5em 0;
}

.export-list li label {
  padding:1em 1em 1em 1em;
  color:#e6e6e6;
  display:block;
  font-size:14px;
  font-size:0.875rem;
}

.export-list input {
  position:absolute;
  left:10000em;
}

.export-list li label span {
  color:#999;
}

.menu-panel .unread .ico-hover-activity {
  background-position-y:-285px;
}

.menu-panel .unread .ico-hover-discuss {
  background-position-y:-284px;
}

.cheat-sheet {
  font-size:13px;
  font-size:0.8125rem;
  color:#999;
  margin-top:1em;
}

.cheat-sheet code {
  color:#3d9ecf;
  font-family:"jaf-facitweb","Lucida Grande","Lucida Sans",Arial,sans-serif;
}

.cheat-sheet .mono {
  font-family:Menlo,Consolas,Inconsolata,"Lucida Console",Monaco,Courier,monospace;
}

.cheat-sheet-bold {
  margin-left:1em;
}

.code-block {
  margin-top:6px;
}

.format-more {
  margin-top:4px;
}

.format-more a {
  font-size:12px;
  font-size:0.75rem;
}

@media screen and (min-width:50em) {
  .nav-group {
    border-top:1px solid #404040;
    padding:1.25em 1.5em;
  }
  .nav-group-no-border {
    padding:1em 1.5em;
  }
  .nav-desktop {
    display:block;
  }
  .nav-mobile {
    display:none;
  }
  .export-list li {
    -webkit-border-radius:0;
    -moz-border-radius:0;
    -ms-border-radius:0;
    -o-border-radius:0;
    border-radius:0;
    background-color:transparent;
  }
  .export-list li label {
    display:inline-block;
    font-size:13px;
    font-size:0.8125rem;
    margin-bottom:.6em;
    margin-right:.2em;
    background-color:#333;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    -ms-border-radius:3px;
    -o-border-radius:3px;
    border-radius:3px;
    padding:.2em .4em;
  }
  .export-list li label:hover {
    background-color:#4d4d4d;
    cursor:pointer;
  }
  .export-list li label:hover span {
    color:#b3b3b3;
  }
  .ed-outer.ed-menu-open .doc-label {
    margin-left:25px;
    left:auto;
  }
}

@media screen and (min-width:83em) {
  .ed-outer.ed-menu-open .doc-label {
    margin-left:-20px;
    left:auto;
  }
}

.no-border {
  border-top:none;
}

.mobile-none {
  display:none;
}

@media screen and (min-width:50em) {
  .mobile-none {
    display:block;
  }
  .desktop-none {
    display:none;
  }
}

.ed-outer.ed-menu-open .versions-pane {
  left:280px;
}

@media screen and (min-width:50em) {
  .ed-outer.ed-menu-open .versions-pane {
    left:0;
  }
}