@import url(reset.css);
@import url(../lib/codemirror/lib/codemirror.css);
editor {
  display: block;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }

.CodeMirror {
  height: 100%;
  font-size: 1em;
  line-height: 1.7em;
  font-family: "proxima-nova", AvenirNext-Regular, Gotham-Light, DIN-Light;
  background: #f3fafa;
  color: #848789; }

.CodeMirror-sizer {
  width: 50%;
  margin: auto !important;
  padding: 50px 0 !important; }

.cm-s-default .cm-tag {
  color: #A7A9AC; }

.cm-s-default .cm-tag-red {
  color: #EE2D73; }

.cm-s-default .cm-tag-orange {
  color: #D59108; }

.cm-s-default .cm-tag-yellow {
  color: #C9C917; }

.cm-s-default .cm-tag-green {
  color: #13BF5C; }

.cm-s-default .cm-tag-teal {
  color: #09B0B0; }

.cm-s-default .cm-tag-blue {
  color: #46adf9; }

.cm-s-default .cm-tag-purple {
  color: #9F2AD2; }

.cm-s-default .cm-tag.strike {
  color: #0d1414 !important; }

.cm-s-default .cm-check {
  display: inline-block;
  width: 1em;
  cursor: default;
  -webkit-transition: all .12s;
  -moz-transition: all .12s;
  transition: all .12s;
  color: transparent;
  background: url(../images/check-box.svg) no-repeat;
  background-position: center;
  background-size: 100%; }

.cm-s-default .cm-check-done {
  display: inline-block;
  width: 1em;
  cursor: default;
  -webkit-transition: all .12s;
  -moz-transition: all .12s;
  transition: all .12s;
  color: transparent;
  background: url(../images/check-icon.svg) no-repeat;
  background-position: center;
  background-size: 100%;
  opacity: 0.6; }

.cm-s-default .cm-section-title {
  font-weight: 700;
  font-size: 1.3em;
  color: #0d1414; }

.cm-s-default .todo {
  font-size: 1.07em;
  color: #0d1414; }

.cm-s-default .cm-tab {
  width: 20px; }

.strike {
  font-style: italic;
  text-decoration: line-through rgba(0, 0, 0, 0.2);
  opacity: .3; }

.math {
  color: #3ec58e; }

.tree-toggle {
  position: relative;
  top: -2px;
  display: inline-block;
  margin-left: -18px;
  width: 18px;
  font-size: 14px;
  text-align: center;
  cursor: default;
  opacity: .6; }

.CodeMirror div.CodeMirror-cursor {
  margin-left: -1px;
  border-left: 2px solid #52A4FF; }

.CodeMirror-selected {
  background: rgba(82, 164, 255, 0.4) !important; }

.CodeMirror-selectedtext {
  color: white; }

@media (max-width: 970px) {
  .CodeMirror {
    height: 100%;
    font-size: 0.9em;
    line-height: 1.7em; } }
@media (max-width: 768px) {
  .CodeMirror-sizer {
    width: auto;
    margin-left: 170px !important;
    margin-right: 50px !important; } }
@media (max-width: 640px) {
  .CodeMirror-sizer {
    margin-left: 20px !important;
    margin-right: 20px !important; } }
.dark-theme .CodeMirror {
  background: #0d1414;
  color: #848789; }
.dark-theme .cm-s-default .cm-tag {
  color: #A7A9AC; }
.dark-theme .cm-s-default .cm-tag-red {
  color: #EE2D73; }
.dark-theme .cm-s-default .cm-tag-orange {
  color: #D59108; }
.dark-theme .cm-s-default .cm-tag-yellow {
  color: #F5F521; }
.dark-theme .cm-s-default .cm-tag-green {
  color: #13BF5C; }
.dark-theme .cm-s-default .cm-tag-teal {
  color: #09B0B0; }
.dark-theme .cm-s-default .cm-tag-blue {
  color: #46adf9; }
.dark-theme .cm-s-default .cm-tag-purple {
  color: #9F2AD2; }
.dark-theme .cm-s-default .cm-tag.strike {
  color: #f3fafa !important; }
.dark-theme .cm-s-default .cm-section-title {
  color: #f3fafa; }
.dark-theme .cm-s-default .todo {
  color: #f3fafa; }
.dark-theme .strike {
  text-decoration: line-through rgba(255, 255, 255, 0.7);
  opacity: .25; }
.dark-theme .math {
  color: #3ec58e; }
.dark-theme .CodeMirror-selected {
  background: rgba(82, 164, 255, 0.4) !important; }
.dark-theme .CodeMirror-selectedtext {
  color: #f3fafa; }

.icon {
  display: inline-block;
  width: 25px;
  height: 25px;
  background-color: #9BB9B9;
  -webkit-mask-position: center; }

sidebar {
  position: fixed;
  z-index: 2; }

.sidebar-nav {
  position: fixed;
  bottom: 22px;
  left: 22px;
  z-index: 10; }
  .sidebar-nav .selected .icon {
    background: #52A4FF; }

.sidebar-nav-button {
  display: block;
  width: 35px;
  height: 35px;
  padding: 0; }
  .sidebar-nav-button .icon {
    -webkit-transition: all .12s;
    -moz-transition: all .12s;
    transition: all .12s; }
  .sidebar-nav-button:hover .icon {
    background-color: #52A4FF; }

.filter-icon {
  -webkit-mask-image: url(../images/filter-icon.svg);
  mask-image: url(../images/filter-icon.svg); }

.tag-icon {
  -webkit-mask-image: url(../images/tag-icon.svg);
  mask-image: url(../images/tag-icon.svg); }

.map-icon {
  -webkit-mask-image: url(../images/map-icon.svg);
  mask-image: url(../images/map-icon.svg); }

.sidebar-search-control {
  position: relative;
  margin: 0 10px;
  height: 50px; }
  .sidebar-search-control .filter-icon {
    position: absolute;
    top: -4px;
    bottom: 0;
    margin: auto;
    z-index: 1;
    -webkit-mask-image: url(../images/filter-icon.svg);
    mask-image: url(../images/filter-icon.svg);
    -webkit-transition: all .12s;
    -moz-transition: all .12s;
    transition: all .12s; }

.sidebar-search-input {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  text-indent: 25px;
  border-bottom: 1px solid #C3E1E1;
  font-family: Gotham-Light;
  -webkit-transition: all .12s;
  -moz-transition: all .12s;
  transition: all .12s; }
  .sidebar-search-input:focus {
    border-bottom-color: #52A4FF; }
    .sidebar-search-input:focus + .icon {
      background-color: #52A4FF; }

.sidebar-section-control {
  position: fixed;
  top: 0;
  left: 0;
  width: 220px;
  bottom: 0;
  -webkit-transition: all .1s ease-out;
  -moz-transition: all .1s ease-out;
  transition: all .1s ease-out;
  opacity: 0;
  pointer-events: none; }
  .sidebar-section-control.visible {
    opacity: 1;
    pointer-events: auto; }

.sidebar-section-list {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  overflow: auto;
  padding: 50px 0;
  font-size: 0.75em;
  line-height: 1.2; }
  .sidebar-section-list li {
    position: relative;
    margin: 7px 17px;
    padding-left: 23px; }

.sidebar-section-completed {
  float: right; }

.sidebar-section {
  cursor: pointer;
  -webkit-transition: all .12s;
  -moz-transition: all .12s;
  transition: all .12s; }
  .sidebar-section:hover {
    color: #52A4FF; }

.sidebar-tag-control {
  padding: 10px; }

.sidebar-tag {
  font-size: 10px;
  border: 1px solid #C3E1E1;
  border-radius: 3px;
  display: inline-block;
  margin-right: 5px;
  padding: 2px 8px 1px;
  cursor: pointer;
  -webkit-transition: all .12s;
  -moz-transition: all .12s;
  transition: all .12s; }
  .sidebar-tag .selected, .sidebar-tag:hover {
    border-color: #84acf7; }

.check-control {
  padding: 0 10px; }

.progress {
  position: fixed;
  right: 10px;
  bottom: 10px;
  width: 100px;
  height: 100px; }

.progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0; }

.checks-done {
  position: absolute;
  top: 32px;
  left: 0;
  width: 47px;
  text-align: right;
  font-size: 12px;
  opacity: 0;
  -webkit-transition: all .17s;
  -moz-transition: all .17s;
  transition: all .17s; }

.checks-total {
  position: absolute;
  top: 48px;
  left: 53px;
  width: 47px;
  text-align: left;
  font-size: 12px;
  opacity: 0;
  -webkit-transition: all .17s;
  -moz-transition: all .17s;
  transition: all .17s; }

.sidebar-section-progress {
  vertical-align: middle; }

.sidebar-section-progress {
  position: absolute;
  left: 0px;
  top: -3px;
  -webkit-transform: scale(0.6);
  -moz-transform: scale(0.6);
  transform: scale(0.6);
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  transition: all .2s; }

.done-circle {
  position: absolute;
  left: 4px;
  top: 1px; }

.progress-outline {
  fill: rgba(0, 0, 0, 0.2); }

.dark-theme .progress-outline {
  fill: rgba(255, 255, 255, 0.3); }

.progress-ring {
  stroke: #52A4FF;
  stroke-width: 3px; }

.progress-ring,
.progress-outline {
  -webkit-transition: all .2s;
  -webkit-transform-origin: center;
  -moz-transform-origin: center;
  transform-origin: center; }

.progress-slash {
  stroke: rgba(0, 0, 0, 0.2);
  -webkit-transform: scale(0);
  -moz-transform: scale(0);
  transform: scale(0);
  -webkit-transform-origin: 50px 50px;
  -moz-transform-origin: 50px 50px;
  transform-origin: 50px 50px;
  -webkit-transition: all .17s;
  -moz-transition: all .17s;
  transition: all .17s; }

.tag-formatter {
  position: fixed;
  top: -500px;
  left: -500px;
  padding: 15px 25px 25px;
  background-color: white;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15);
  transform: translateY(4px);
  opacity: 0;
  pointer-events: none;
  -webkit-transition: opacity .15s, transform .15s;
  -moz-transition: opacity .15s, transform .15s;
  transition: opacity .15s, transform .15s; }
  .tag-formatter.is-shown {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    transform: translateY(0);
    pointer-events: auto; }

.tag-color-button {
  display: block;
  float: left;
  margin-right: 8px;
  width: 20px;
  height: 20px;
  border: none;
  padding: 0;
  -webkit-transition: all .2s;
  -moz-transition: all .2s;
  transition: all .2s; }
  .tag-color-button.is-selected {
    border-radius: 50%;
    transform: rotate(45deg); }

.tag-formatter-label {
  display: block;
  text-align: center;
  margin-bottom: 10px;
  font-size: 12px;
  font-weight: bold;
  text-transform: uppercase;
  color: #0d1414; }

.utility-bar {
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 10000;
  text-align: right;
  font-size: 0.75em;
  line-height: 1.2;
  color: #9BB9B9; }
  .utility-bar a,
  .utility-bar .settings-button {
    cursor: pointer;
    color: #0d1414; }
    .utility-bar a:hover,
    .utility-bar .settings-button:hover {
      color: #52A4FF; }

.dark-theme a,
.dark-theme .settings-button {
  color: #f3fafa; }

.nix-logo,
.nix-logo-white {
  width: 6em; }

.nix-logo-white {
  display: none; }

.dark-theme .nix-logo {
  display: none; }
.dark-theme .nix-logo-white {
  display: inline-block; }

.tag-color-button-none {
  background: #A7A9AC; }

.tag-color-button-red {
  background: #EE2D73; }

.tag-color-button-orange {
  background: #D59108; }

.tag-color-button-yellow {
  background: #C9C917; }

.tag-color-button-green {
  background: #13BF5C; }

.tag-color-button-teal {
  background: #09B0B0; }

.tag-color-button-blue {
  background: #46adf9; }

.tag-color-button-purple {
  background: #9F2AD2; }

@media (max-width: 970px) {
  .sidebar-section-control {
    width: 150px; }

  .sidebar-section-list li {
    margin: 5px 10px; } }
@media (max-width: 768px) {
  .utility-bar {
    left: 20px;
    right: auto;
    text-align: left; }

  .sidebar-section-list {
    bottom: 130px; } }
@media (max-width: 640px) {
  .utility-bar {
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    background-color: #f3fafa;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.18); }

  .sidebar-section-control {
    display: none; }

  .utility-links {
    float: right;
    text-align: right; }

  .dark-theme .utility-bar {
    background-color: #0d1414; } }
modal {
  color: #0d1414; }
  modal a {
    color: #0d1414 !important; }
  modal .modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    width: 650px;
    height: 300px;
    z-index: 100;
    background-color: white;
    padding: 50px;
    font-size: 14px; }
  modal.visible .modal,
  modal.visible .modal-shade {
    display: block; }
  modal h4 {
    margin-bottom: 40px;
    font-size: 1.2em;
    font-weight: bold;
    text-align: center; }
  modal .close-button {
    position: absolute;
    top: 10px;
    left: 10px;
    width: 25px;
    height: 25px;
    padding: 0;
    font-size: 20px;
    opacity: .35;
    -webkit-transition: all .15s;
    -moz-transition: all .15s;
    transition: all .15s; }
    modal .close-button:hover {
      opacity: 1; }
  modal .instruction-list {
    line-height: 1.4; }
    modal .instruction-list li {
      margin-bottom: 2.5em; }
  modal .instruction-list-example {
    padding: 8px 12px;
    margin: 0.5em 0;
    background: #f3fafa; }
  modal .instruction-section {
    width: 350px; }
  modal .settings-section {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 200px;
    padding: 50px;
    background: #f3fafa; }
  modal section {
    float: left; }
  modal .modal-shade {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99;
    background: rgba(82, 164, 255, 0.5); }
  modal .section-example {
    font-weight: bold; }
  modal .tag-example {
    color: #EE2D73; }
  modal a {
    color: #0d1414; }
    modal a:hover {
      color: #52A4FF; }
  modal .setting-block {
    margin-bottom: 15px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding-bottom: 15px; }
    modal .setting-block:last-of-type {
      border: none; }
  modal .setting-name {
    display: inline-block;
    line-height: 25px; }
  modal .setting-icon {
    width: 50px; }
  modal .branding {
    position: absolute;
    bottom: 50px;
    right: 50px;
    text-align: right; }
  modal .toggle {
    float: right;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 60px;
    height: 25px;
    background: #D1E2E2;
    border-radius: 15px;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.17);
    -webkit-transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95);
    -moz-transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95);
    transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95); }
    modal .toggle.on {
      background: #52A4FF; }
      modal .toggle.on .toggle-thumb {
        left: 37px; }
      modal .toggle.on .toggle-label-on {
        opacity: 1; }
      modal .toggle.on .toggle-label-off {
        opacity: 0; }
  modal .toggle-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    z-index: 1;
    width: 21px;
    height: 21px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.17);
    -webkit-transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95);
    -moz-transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95);
    transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95); }
  modal .toggle-label-on,
  modal .toggle-label-off {
    position: absolute;
    z-index: 0;
    line-height: 25px;
    font-size: 8px;
    text-transform: uppercase;
    -webkit-transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95);
    -moz-transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95);
    transition: all 0.2s cubic-bezier(0.85, 0, 0.59, 0.95);
    pointer-events: none;
    cursor: default; }
  modal .toggle-label-on {
    left: 7px;
    color: #f3fafa;
    opacity: 0; }
  modal .toggle-label-off {
    right: 7px;
    color: #0d1414;
    opacity: 1; }
  modal .slider {
    float: right;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 60px;
    height: 25px; }
  modal .slider-track {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 0;
    margin: auto;
    width: 100%;
    height: 6px;
    border-radius: 5px;
    background: #D1E2E2;
    box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.17); }
  modal .slider-thumb {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    margin: auto;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: white;
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.17); }
  modal .font-control-buttons {
    float: right;
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 80px;
    height: 25px;
    border-radius: 3px;
    background: white;
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.17); }
  modal .font-control-button {
    float: left;
    width: 33.33%;
    height: 100%;
    padding: 0;
    box-shadow: inset 1px 0 0 rgba(0, 0, 0, 0.1); }
    modal .font-control-button:first-child {
      box-shadow: none;
      border-radius: 3px 0 0 3px; }
    modal .font-control-button:last-child {
      border-radius: 0 3px 3px 0; }
    modal .font-control-button.on {
      background: #D1E2E2;
      box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 2px 0 rgba(0, 0, 0, 0.1); }
      modal .font-control-button.on + .font-control-button {
        box-shadow: none; }
    modal .font-control-button.font-size-1 {
      font-size: .6em; }
    modal .font-control-button.font-size-2 {
      font-size: .8em; }
    modal .font-control-button.font-size-3 {
      font-size: 1em; }
  modal .signup-section {
    position: absolute;
    bottom: 50px;
    left: 50px;
    right: 50px;
    text-align: center; }
    modal .signup-section label {
      display: block;
      margin-bottom: 10px;
      font-size: .8em; }
    modal .signup-section .mc-field-group {
      margin-bottom: 10px; }
    modal .signup-section .email {
      width: 100%;
      padding: 8px 0;
      background: white;
      border: 1px solid rgba(0, 0, 0, 0.17);
      font-family: "proxima-nova", AvenirNext-Regular, Gotham-Light, DIN-Light;
      font-size: .8em;
      text-align: center;
      border-radius: 3px; }
    modal .signup-section .button {
      padding: 8px 24px;
      background: #52A4FF;
      font-family: "proxima-nova", AvenirNext-Regular, Gotham-Light, DIN-Light;
      font-size: .8em;
      color: #f3fafa;
      border-radius: 3px; }

@media (max-width: 768px) {
  modal .modal {
    width: 550px;
    padding: 35px; }
  modal .close-button {
    top: 5px;
    left: 5px; }
  modal .instruction-section {
    width: 320px; }
  modal .settings-section {
    padding: 35px;
    width: 180px; } }
.splash {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100000000;
  background-color: #f3fafa;
  -webkit-transition: all .4s;
  -moz-transition: all .4s;
  transition: all .4s;
  pointer-events: none; }
  .splash.hidden {
    opacity: 0; }

@-webkit-keyframes LOGO_IN {
  from {
    opacity: 0;
    -webkit-transform: translateY(5px); }
  to {
    opacity: 1;
    -webkit-transform: translateY(0); } }
@-moz-keyframes LOGO_IN {
  from {
    opacity: 0;
    -moz-transform: translateY(5px); }
  to {
    opacity: 1;
    -moz-transform: translateY(0); } }
@keyframes LOGO_IN {
  from {
    opacity: 0;
    transform: translateY(5px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
.splash-logo {
  position: absolute;
  top: 0;
  left: 50px;
  bottom: 100px;
  width: 172px;
  margin: auto;
  opacity: 0;
  -webkit-animation: LOGO_IN .3s .2s 1 ease-out forwards;
  -moz-animation: LOGO_IN .3s .2s 1 ease-out forwards;
  animation: LOGO_IN .3s .2s 1 ease-out forwards; }

@-webkit-keyframes TAG_IN {
  from {
    opacity: 0;
    -webkit-transform: translateY(-5px); }
  to {
    opacity: .5;
    -webkit-transform: translateY(0); } }
@-moz-keyframes TAG_IN {
  from {
    opacity: 0;
    -moz-transform: translateY(-5px); }
  to {
    opacity: .5;
    -moz-transform: translateY(0); } }
@keyframes TAG_IN {
  from {
    opacity: 0;
    transform: translateY(-5px); }
  to {
    opacity: .5;
    transform: translateY(0); } }
.tagline {
  position: absolute;
  top: 60px;
  bottom: 0;
  left: 50px;
  height: 20px;
  margin: auto;
  text-align: left;
  font-size: 14px;
  font-style: italic;
  line-height: 1.4;
  color: #0d1414;
  opacity: 0;
  -webkit-animation: TAG_IN .3s .6s 1 ease-out forwards;
  -moz-animation: TAG_IN .3s .6s 1 ease-out forwards;
  animation: TAG_IN .3s .6s 1 ease-out forwards; }

html, body {
  height: 100%; }

html {
  font-size: 16px;
  line-height: 1.5; }

body {
  font-family: "proxima-nova", AvenirNext-Regular, Gotham-Light, DIN-Light;
  background: #f3fafa; }
  body.dark-theme {
    background: #0d1414;
    color: #f3fafa; }
  body.mobile editor,
  body.mobile sidebar,
  body.mobile modal {
    display: none; }

button {
  -webkit-appearance: none;
  border: none;
  background: none; }

@media (max-width: 970px) {
  html {
    font-size: 14px; } }
@media (max-width: 600px) {
  html {
    font-size: 14px; } }

/*# sourceMappingURL=styles.css.map */