/*! Basscss | http://basscss.com | MIT License */

/* Basscss Type Scale */

.h00 { font-size: 4rem; font-size: var(--h00) }

.h0 { font-size: 3rem; font-size: var(--h0) }

.h1 { font-size: 2rem; font-size: var(--h1) }

.h2 { font-size: 1.5rem; font-size: var(--h2) }

.h3 { font-size: 1.25rem; font-size: var(--h3) }

.h4 { font-size: 1rem; font-size: var(--h4) }

.h5 { font-size: .875rem; font-size: var(--h5) }

.h6 { font-size: .75rem; font-size: var(--h6) }

:root {
  --h00: 4rem;
  --h0: 3rem;
  --h1: 2rem;
  --h2: 1.5rem;
  --h3: 1.25rem;
  --h4: 1rem;
  --h5: .875rem;
  --h6: .75rem;
}

/* Basscss Typography */

.font-family-inherit { font-family: inherit }

.font-size-inherit { font-size: inherit }

.text-decoration-none { text-decoration: none }

.bold    { font-weight: bold; font-weight: var(--bold-font-weight, bold) }

.regular { font-weight: normal }

.italic  { font-style: italic }

.caps    { text-transform: uppercase; letter-spacing: .2em; letter-spacing: var(--caps-letter-spacing); }

.left-align   { text-align: left }

.center       { text-align: center }

.right-align  { text-align: right }

.justify      { text-align: justify }

.nowrap { white-space: nowrap }

.break-word { word-wrap: break-word }

.line-height-1 { line-height: 1; line-height: var(--line-height-1) }

.line-height-2 { line-height: 1.125; line-height: var(--line-height-2) }

.line-height-3 { line-height: 1.25; line-height: var(--line-height-3) }

.line-height-4 { line-height: 1.5; line-height: var(--line-height-4) }

.list-style-none { list-style: none }

.underline { text-decoration: underline }

.truncate {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.list-reset {
  list-style: none;
  padding-left: 0;
}

:root {
  --line-height-1: 1;
  --line-height-2: 1.125;
  --line-height-3: 1.25;
  --line-height-4: 1.5;
  --caps-letter-spacing: .2em;
  --bold-font-weight: bold;
}

/* Basscss Layout */

.inline       { display: inline }

.block        { display: block }

.inline-block { display: inline-block }

.table        { display: table }

.table-cell   { display: table-cell }

.overflow-hidden { overflow: hidden }

.overflow-scroll { overflow: scroll }

.overflow-auto   { overflow: auto }

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table
}

.clearfix:after { clear: both }

.left  { float: left }

.right { float: right }

.fit { max-width: 100% }

.max-width-1 { max-width: 24rem; max-width: var(--width-1) }

.max-width-2 { max-width: 32rem; max-width: var(--width-2) }

.max-width-3 { max-width: 48rem; max-width: var(--width-3) }

.max-width-4 { max-width: 64rem; max-width: var(--width-4) }

.border-box { -webkit-box-sizing: border-box; box-sizing: border-box }

:root {
  --width-1: 24rem;
  --width-2: 32rem;
  --width-3: 48rem;
  --width-4: 64rem;
}

/* Basscss Align */

.align-baseline { vertical-align: baseline }

.align-top      { vertical-align: top }

.align-middle   { vertical-align: middle }

.align-bottom   { vertical-align: bottom }

/* Basscss Margin */

.m0  { margin:        0 }

.mt0 { margin-top:    0 }

.mr0 { margin-right:  0 }

.mb0 { margin-bottom: 0 }

.ml0 { margin-left:   0 }

.mx0 { margin-left:   0; margin-right:  0 }

.my0 { margin-top:    0; margin-bottom: 0 }

.m1  { margin:        .5rem; margin:        var(--space-1) }

.mt1 { margin-top:    .5rem; margin-top:    var(--space-1) }

.mr1 { margin-right:  .5rem; margin-right:  var(--space-1) }

.mb1 { margin-bottom: .5rem; margin-bottom: var(--space-1) }

.ml1 { margin-left:   .5rem; margin-left:   var(--space-1) }

.mx1 { margin-left:   .5rem; margin-left:   var(--space-1); margin-right:  .5rem; margin-right:  var(--space-1) }

.my1 { margin-top:    .5rem; margin-top:    var(--space-1); margin-bottom: .5rem; margin-bottom: var(--space-1) }

.m2  { margin:        1rem; margin:        var(--space-2) }

.mt2 { margin-top:    1rem; margin-top:    var(--space-2) }

.mr2 { margin-right:  1rem; margin-right:  var(--space-2) }

.mb2 { margin-bottom: 1rem; margin-bottom: var(--space-2) }

.ml2 { margin-left:   1rem; margin-left:   var(--space-2) }

.mx2 { margin-left:   1rem; margin-left:   var(--space-2); margin-right:  1rem; margin-right:  var(--space-2) }

.my2 { margin-top:    1rem; margin-top:    var(--space-2); margin-bottom: 1rem; margin-bottom: var(--space-2) }

.m3  { margin:        2rem; margin:        var(--space-3) }

.mt3 { margin-top:    2rem; margin-top:    var(--space-3) }

.mr3 { margin-right:  2rem; margin-right:  var(--space-3) }

.mb3 { margin-bottom: 2rem; margin-bottom: var(--space-3) }

.ml3 { margin-left:   2rem; margin-left:   var(--space-3) }

.mx3 { margin-left:   2rem; margin-left:   var(--space-3); margin-right:  2rem; margin-right:  var(--space-3) }

.my3 { margin-top:    2rem; margin-top:    var(--space-3); margin-bottom: 2rem; margin-bottom: var(--space-3) }

.m4  { margin:        4rem; margin:        var(--space-4) }

.mt4 { margin-top:    4rem; margin-top:    var(--space-4) }

.mr4 { margin-right:  4rem; margin-right:  var(--space-4) }

.mb4 { margin-bottom: 4rem; margin-bottom: var(--space-4) }

.ml4 { margin-left:   4rem; margin-left:   var(--space-4) }

.mx4 { margin-left:   4rem; margin-left:   var(--space-4); margin-right:  4rem; margin-right:  var(--space-4) }

.my4 { margin-top:    4rem; margin-top:    var(--space-4); margin-bottom: 4rem; margin-bottom: var(--space-4) }

.mxn1 { margin-left: calc(.5rem * -1); margin-left: calc(var(--space-1) * -1); margin-right: calc(.5rem * -1); margin-right: calc(var(--space-1) * -1); }

.mxn2 { margin-left: calc(1rem * -1); margin-left: calc(var(--space-2) * -1); margin-right: calc(1rem * -1); margin-right: calc(var(--space-2) * -1); }

.mxn3 { margin-left: calc(2rem * -1); margin-left: calc(var(--space-3) * -1); margin-right: calc(2rem * -1); margin-right: calc(var(--space-3) * -1); }

.mxn4 { margin-left: calc(4rem * -1); margin-left: calc(var(--space-4) * -1); margin-right: calc(4rem * -1); margin-right: calc(var(--space-4) * -1); }

.m-auto  { margin: auto; }

.mt-auto { margin-top: auto }

.mr-auto { margin-right: auto }

.mb-auto { margin-bottom: auto }

.ml-auto { margin-left: auto }

.mx-auto { margin-left: auto; margin-right: auto; }

.my-auto { margin-top: auto; margin-bottom: auto; }

:root {
  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 2rem;
  --space-4: 4rem;
}

/* Basscss Padding */

.p0  { padding: 0 }

.pt0 { padding-top: 0 }

.pr0 { padding-right: 0 }

.pb0 { padding-bottom: 0 }

.pl0 { padding-left: 0 }

.px0 { padding-left: 0; padding-right:  0 }

.py0 { padding-top: 0;  padding-bottom: 0 }

.p1  { padding:        .5rem; padding:        var(--space-1) }

.pt1 { padding-top:    .5rem; padding-top:    var(--space-1) }

.pr1 { padding-right:  .5rem; padding-right:  var(--space-1) }

.pb1 { padding-bottom: .5rem; padding-bottom: var(--space-1) }

.pl1 { padding-left:   .5rem; padding-left:   var(--space-1) }

.py1 { padding-top:    .5rem; padding-top:    var(--space-1); padding-bottom: .5rem; padding-bottom: var(--space-1) }

.px1 { padding-left:   .5rem; padding-left:   var(--space-1); padding-right:  .5rem; padding-right:  var(--space-1) }

.p2  { padding:        1rem; padding:        var(--space-2) }

.pt2 { padding-top:    1rem; padding-top:    var(--space-2) }

.pr2 { padding-right:  1rem; padding-right:  var(--space-2) }

.pb2 { padding-bottom: 1rem; padding-bottom: var(--space-2) }

.pl2 { padding-left:   1rem; padding-left:   var(--space-2) }

.py2 { padding-top:    1rem; padding-top:    var(--space-2); padding-bottom: 1rem; padding-bottom: var(--space-2) }

.px2 { padding-left:   1rem; padding-left:   var(--space-2); padding-right:  1rem; padding-right:  var(--space-2) }

.p3  { padding:        2rem; padding:        var(--space-3) }

.pt3 { padding-top:    2rem; padding-top:    var(--space-3) }

.pr3 { padding-right:  2rem; padding-right:  var(--space-3) }

.pb3 { padding-bottom: 2rem; padding-bottom: var(--space-3) }

.pl3 { padding-left:   2rem; padding-left:   var(--space-3) }

.py3 { padding-top:    2rem; padding-top:    var(--space-3); padding-bottom: 2rem; padding-bottom: var(--space-3) }

.px3 { padding-left:   2rem; padding-left:   var(--space-3); padding-right:  2rem; padding-right:  var(--space-3) }

.p4  { padding:        4rem; padding:        var(--space-4) }

.pt4 { padding-top:    4rem; padding-top:    var(--space-4) }

.pr4 { padding-right:  4rem; padding-right:  var(--space-4) }

.pb4 { padding-bottom: 4rem; padding-bottom: var(--space-4) }

.pl4 { padding-left:   4rem; padding-left:   var(--space-4) }

.py4 { padding-top:    4rem; padding-top:    var(--space-4); padding-bottom: 4rem; padding-bottom: var(--space-4) }

.px4 { padding-left:   4rem; padding-left:   var(--space-4); padding-right:  4rem; padding-right:  var(--space-4) }

:root {
  --space-1: .5rem;
  --space-2: 1rem;
  --space-3: 2rem;
  --space-4: 4rem;
}

/* Basscss Grid */

.col {
  float: left;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.col-right {
  float: right;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

.col-1 {
  width: calc(1/12 * 100%);
}

.col-2 {
  width: calc(2/12 * 100%);
}

.col-3 {
  width: calc(3/12 * 100%);
}

.col-4 {
  width: calc(4/12 * 100%);
}

.col-5 {
  width: calc(5/12 * 100%);
}

.col-6 {
  width: calc(6/12 * 100%);
}

.col-7 {
  width: calc(7/12 * 100%);
}

.col-8 {
  width: calc(8/12 * 100%);
}

.col-9 {
  width: calc(9/12 * 100%);
}

.col-10 {
  width: calc(10/12 * 100%);
}

.col-11 {
  width: calc(11/12 * 100%);
}

.col-12 {
  width: 100%;
}

@media (min-width: 40em) {

  .sm-col {
    float: left;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

  .sm-col-right {
    float: right;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

  .sm-col-1 {
    width: calc(1/12 * 100%);
  }

  .sm-col-2 {
    width: calc(2/12 * 100%);
  }

  .sm-col-3 {
    width: calc(3/12 * 100%);
  }

  .sm-col-4 {
    width: calc(4/12 * 100%);
  }

  .sm-col-5 {
    width: calc(5/12 * 100%);
  }

  .sm-col-6 {
    width: calc(6/12 * 100%);
  }

  .sm-col-7 {
    width: calc(7/12 * 100%);
  }

  .sm-col-8 {
    width: calc(8/12 * 100%);
  }

  .sm-col-9 {
    width: calc(9/12 * 100%);
  }

  .sm-col-10 {
    width: calc(10/12 * 100%);
  }

  .sm-col-11 {
    width: calc(11/12 * 100%);
  }

  .sm-col-12 {
    width: 100%;
  }

}

@media (min-width: 52em) {

  .md-col {
    float: left;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

  .md-col-right {
    float: right;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

  .md-col-1 {
    width: calc(1/12 * 100%);
  }

  .md-col-2 {
    width: calc(2/12 * 100%);
  }

  .md-col-3 {
    width: calc(3/12 * 100%);
  }

  .md-col-4 {
    width: calc(4/12 * 100%);
  }

  .md-col-5 {
    width: calc(5/12 * 100%);
  }

  .md-col-6 {
    width: calc(6/12 * 100%);
  }

  .md-col-7 {
    width: calc(7/12 * 100%);
  }

  .md-col-8 {
    width: calc(8/12 * 100%);
  }

  .md-col-9 {
    width: calc(9/12 * 100%);
  }

  .md-col-10 {
    width: calc(10/12 * 100%);
  }

  .md-col-11 {
    width: calc(11/12 * 100%);
  }

  .md-col-12 {
    width: 100%;
  }

}

@media (min-width: 64em) {

  .lg-col {
    float: left;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

  .lg-col-right {
    float: right;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

  .lg-col-1 {
    width: calc(1/12 * 100%);
  }

  .lg-col-2 {
    width: calc(2/12 * 100%);
  }

  .lg-col-3 {
    width: calc(3/12 * 100%);
  }

  .lg-col-4 {
    width: calc(4/12 * 100%);
  }

  .lg-col-5 {
    width: calc(5/12 * 100%);
  }

  .lg-col-6 {
    width: calc(6/12 * 100%);
  }

  .lg-col-7 {
    width: calc(7/12 * 100%);
  }

  .lg-col-8 {
    width: calc(8/12 * 100%);
  }

  .lg-col-9 {
    width: calc(9/12 * 100%);
  }

  .lg-col-10 {
    width: calc(10/12 * 100%);
  }

  .lg-col-11 {
    width: calc(11/12 * 100%);
  }

  .lg-col-12 {
    width: 100%;
  }

}

.flex { display: -ms-flexbox; display: -webkit-box; display: flex }

@media (min-width: 40em) {
  .sm-flex { display: -ms-flexbox; display: -webkit-box; display: flex }
}

@media (min-width: 52em) {
  .md-flex { display: -ms-flexbox; display: -webkit-box; display: flex }
}

@media (min-width: 64em) {
  .lg-flex { display: -ms-flexbox; display: -webkit-box; display: flex }
}

.flex-column  { -ms-flex-direction: column; flex-direction: column }

.flex-wrap    { -ms-flex-wrap: wrap; flex-wrap: wrap }

.items-start    { -ms-flex-align: start; align-items: flex-start }

.items-end      { -ms-flex-align: end; align-items: flex-end }

.items-center   { -ms-flex-align: center; align-items: center }

.items-baseline { -ms-flex-align: baseline; align-items: baseline }

.items-stretch  { -ms-flex-align: stretch; align-items: stretch }

.self-start    { -ms-flex-item-align: start; align-self: flex-start }

.self-end      { -ms-flex-item-align: end; align-self: flex-end }

.self-center   { -ms-flex-item-align: center; align-self: center }

.self-baseline { -ms-flex-item-align: baseline; align-self: baseline }

.self-stretch  { -ms-flex-item-align: stretch; align-self: stretch }

.justify-start   { -ms-flex-pack: start; justify-content: flex-start }

.justify-end     { -ms-flex-pack: end; justify-content: flex-end }

.justify-center  { -ms-flex-pack: center; justify-content: center }

.justify-between { -ms-flex-pack: justify; justify-content: space-between }

.justify-around  { -ms-flex-pack: distribute; justify-content: space-around }

.justify-evenly  { -ms-flex-pack: space-evenly; justify-content: space-evenly }

.content-start   { -ms-flex-line-pack: start; align-content: flex-start }

.content-end     { -ms-flex-line-pack: end; align-content: flex-end }

.content-center  { -ms-flex-line-pack: center; align-content: center }

.content-between { -ms-flex-line-pack: justify; align-content: space-between }

.content-around  { -ms-flex-line-pack: distribute; align-content: space-around }

.content-stretch { -ms-flex-line-pack: stretch; align-content: stretch }

/* 1. Fix for Chrome 44 bug. https://code.google.com/p/chromium/issues/detail?id=506893 */

.flex-auto {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  min-width: 0; /* 1 */
  min-height: 0; /* 1 */
}

.flex-none { -ms-flex: none; flex: none }

.order-0 { -ms-flex-order: 0; order: 0 }

.order-1 { -ms-flex-order: 1; order: 1 }

.order-2 { -ms-flex-order: 2; order: 2 }

.order-3 { -ms-flex-order: 3; order: 3 }

.order-last { -ms-flex-order: 99999; order: 99999 }

/* Basscss Position */

.relative { position: relative }

.absolute { position: absolute }

.fixed    { position: fixed }

.top-0    { top: 0 }

.right-0  { right: 0 }

.bottom-0 { bottom: 0 }

.left-0   { left: 0 }

.z1 { z-index: 1; z-index: var(--z1) }

.z2 { z-index: 2; z-index: var(--z2) }

.z3 { z-index: 3; z-index: var(--z3) }

.z4 { z-index: 4; z-index: var(--z4) }

:root {
  --z1: 1;
  --z2: 2;
  --z3: 3;
  --z4: 4;
}

/* Basscss Border */

.border {
  border-style: solid;
  border-width: 1px;
  border-width: var(--border-width);
}

.border-top {
  border-top-style: solid;
  border-top-width: 1px;
  border-top-width: var(--border-width);
}

.border-right {
  border-right-style: solid;
  border-right-width: 1px;
  border-right-width: var(--border-width);
}

.border-bottom {
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-width: var(--border-width);
}

.border-left {
  border-left-style: solid;
  border-left-width: 1px;
  border-left-width: var(--border-width);
}

.border-none { border: 0 }

.rounded { border-radius: 3px; border-radius: var(--border-radius) }

.circle  { border-radius: 50% }

.rounded-top    { border-radius: 3px 3px 0 0; border-radius: var(--border-radius) var(--border-radius) 0 0 }

.rounded-right  { border-radius: 0 3px 3px 0; border-radius: 0 var(--border-radius) var(--border-radius) 0 }

.rounded-bottom { border-radius: 0 0 3px 3px; border-radius: 0 0 var(--border-radius) var(--border-radius) }

.rounded-left   { border-radius: 3px 0 0 3px; border-radius: var(--border-radius) 0 0 var(--border-radius) }

.not-rounded { border-radius: 0 }

:root {
  --border-width: 1px;
  --border-radius: 3px;
}

/* Basscss Hide */

.hide {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}

@media (max-width: 40em) {
  .xs-hide { display: none !important }
}

@media (min-width: 40em) and (max-width: 52em) {
  .sm-hide { display: none !important }
}

@media (min-width: 52em) and (max-width: 64em) {
  .md-hide { display: none !important }
}

@media (min-width: 64em) {
  .lg-hide { display: none !important }
}

.display-none { display: none !important }


/*
  TODO:
  - Intellisense support somehow
  - Take care of stray colors
  - Find rgb and rgba stray colors
*/

/*
  --------------------------------------------------------------
  usage in css:
  .my-class {
    color: var(--primary);
  }

  usage in js:
  import colors from '../path/to/colors/colors'
  <div style={{ color: colors.primary }} />
  --------------------------------------------------------------
*/

:root {
  /* Stray color values. Take care of these! */
  --todo_2f2f2f: #2f2f2f;
  --todo_333: #333;
  --todo_666: #666;
  --todo_525252: #525252;
  --todo_979797: #979797;
  --todo_8a8a8a: #8a8a8a;
  --todo_8c8c8c: #8c8c8c;
  --todo_ddd: #ddd;
  --todo_eee: #eee;
  --todo_aaa: #aaa;
  --todo_f6f6f6: #f6f6f6;
  --todo_A9A9A9: #A9A9A9;
  --todo_F1F1F1: #F1F1F1;
  --todo_f5f5f5: #f5f5f5;
  --todo_f9f9f9: #f9f9f9;
  --todo_f7f7f7: #f7f7f7;
  --todo_0051BA: #0051BA;
  --todo_007BFF: #007BFF;
  --todo_rgb255_13_25: rgb(255, 13, 25);
  /* ---------------- */

  --primary: #FCDA32;
  --primaryLight: #FDE884;
  --primaryLighter: #FEF7D6;
  --primaryTransparent:  rgba(252, 218, 50, 0.5);

  --secondary: #225CBB;
  --secondaryLight: #548EDB;
  --secondaryLighter: #D2DEF1;

  --error: #C71110;
  --errorLightAlt: #bf5758;
  --errorLight: #e79696;
  --errorLighter: #f7dcdc;

  --warn: #E69E5E;
  --warnLighter: #F3C195;

  --success: #2CBA03;
  --successDark: #376f26;

  --gray: #B3B3B3;
  --grayAlt: #808080;
  --grayDark: #222;
  --grayLight: #E5E5E5;
  --grayLightAlt: #E1E1E1;
  --grayLighter: #fbfcfc;
  --grayAccessible: #595959;
  --grayBlueDark: #282C35;
  --grayBlueLight: #2d3340;

  --white: #fff;
  --white10: rgba(255,255,255,0.1);
  --white25: rgba(255,255,255,0.25);
  --white40: rgba(255,255,255,0.4);
  --white55: rgba(255,255,255,0.55);
  --white70: rgba(255,255,255,0.7);
  --white85: rgba(255,255,255,0.85);

  --black: #000;
  --black10: rgba(0,0,0,0.1);
  --black25: rgba(0,0,0,0.25);
  --black40: rgba(0,0,0,0.4);
  --black55: rgba(0,0,0,0.55);
  --black70: rgba(0,0,0,0.7);
  --black85: rgba(0,0,0,0.85);
}

html {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: 'Verdana', sans-serif;
}

* + *, * > * {
  -webkit-box-sizing: inherit;
          box-sizing: inherit;
  font-family: inherit;
}

html, body {
  height: 100%;
  width: 100%;
}

body {
  margin: 0;
  padding: 0;
  background-color: #fbfcfc;
  background-color: var(--grayLighter);
}

button {
  border: 0;
  border-radius: 0;
  background: transparent;
}

.styled-button {
  height: 40.5px;
  width: 204px;
  border: 1px solid #000;
  border-radius: 4px;
  background-color: #225cbb;
  color: #fff;
  text-align: center,;
  cursor: pointer;
  font-size: 0.75rem;
  font-weight: bold;
  margin-bottom: 1rem
}

button:focus,
button:active {
  outline: none;
}

body.hide-scrollbar::-webkit-scrollbar {
  display: none;
}

.custom-scrollbar ::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,0.2);
}

.custom-scrollbar ::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.custom-scrollbar ::-webkit-scrollbar-track {
  background: rgba(0,0,0,0.05);
}

.custom-scrollbar-inverted ::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(255,255,255,0.4);
}

.custom-scrollbar-inverted ::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

.custom-scrollbar-inverted ::-webkit-scrollbar-track {
  background: rgba(255,255,255,0.1);
}

a {
  cursor: pointer;
  text-decoration: none;
}

@-webkit-keyframes pulsate {
  0% {
    background-color: none;
  }
  50% {
    background-color: #FCDA32;
    background-color: var(--primary);
  }
  100% {
    background-color: none;
  }
}

.img-responsive {
  width: 100%;
  display: block;
}

.userselect-none {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.userselect-text {
  -webkit-user-select: text;
     -moz-user-select: text;
      -ms-user-select: text;
          user-select: text;
}

/* COLORS */

.transition-bg-color { -webkit-transition: background-color 0.15s; transition: background-color 0.15s}

.bg-transparent, .bg-transparent-hover:hover, .bg-transparent-focus:focus, .bg-transparent-active:active { background: transparent; }

.bc-transparent { border-color: transparent; }

/* -- Primary */

.bg-primary, .bg-primary-hover:hover { background-color: #FCDA32; background-color: var(--primary); }

.bg-primary-light, .bg-primary-light-hover:hover { background-color: #FDE884; background-color: var(--primaryLight); }

.bg-primary-lighter, .bg-primary-lighter-hover:hover { background-color: #FEF7D6; background-color: var(--primaryLighter); }

.bg-primary-transparent, .bg-primary-transparent-hover:hover { background-color: rgba(252, 218, 50, 0.5); background-color: var(--primaryTransparent); }

.c-primary, .c-primary-hover:hover { color: #FCDA32; color: var(--primary); }

.c-primary-light, .c-primary-light-hover:hover { color: #FDE884; color: var(--primaryLight); }

.c-primary-lighter, .c-primary-lighter-hover:hover { color: #FEF7D6; color: var(--primaryLighter); }

.fill-primary, .fill-primary-hover:hover { fill: #FCDA32; fill: var(--primary); }

.fill-primary-light, .fill-primary-light-hover:hover { fill: #FDE884; fill: var(--primaryLight); }

.fill-primary-lighter, .fill-primary-lighter-hover:hover { fill: #FEF7D6; fill: var(--primaryLighter); }

.bc-primary, .bc-primary-hover:hover { border-color: #FCDA32; border-color: var(--primary); }

.bc-primary-light, .bc-primary-light-hover:hover { border-color: #FDE884; border-color: var(--primaryLight); }

.bc-primary-lighter, .bc-primary-lighter-hover:hover { border-color: #FEF7D6; border-color: var(--primaryLighter); }

/* -- Secondary */

.c-secondary, .c-secondary-hover:hover { color: #225CBB; color: var(--secondary); }

.c-secondary-light, .c-secondary-light-hover { color: #548EDB; color: var(--secondaryLight); }

.c-secondary-lighter, .c-secondary-lighter-hover:hover { color: #D2DEF1; color: var(--secondaryLighter); }

.bg-secondary, .bg-secondary-hover:hover { background-color: #225CBB; background-color: var(--secondary); }

.bg-secondary-light, .bg-secondary-light-hover:hover { background-color: #548EDB; background-color: var(--secondaryLight); }

.bg-secondary-lighter, .bg-secondary-lighter-hover:hover { background-color: #D2DEF1; background-color: var(--secondaryLighter); }

.bc-secondary, .bc-secondary-hover:hover, .bc-secondary-focus:focus { border-color: #225CBB; border-color: var(--secondary); }

.bc-secondary-light, .bc-secondary-light-hover:hover, .bc-secondary-light-focus:focus { border-color: #548EDB; border-color: var(--secondaryLight); }

.bc-secondary-lighter, .bc-secondary-lighter-hover:hover, .bc-secondary-lighter-focus:focus { border-color: #D2DEF1; border-color: var(--secondaryLighter); }

*/

/* -- Gray */
.bg-gray, .bg-gray-hover:hover { background-color: #B3B3B3; background-color: var(--gray); }

.bg-gray-dark, .bg-gray-dark-hover:hover { background-color: #222; background-color: var(--grayDark); }

.bg-gray-light, .bg-gray-light-hover:hover { background-color: #E5E5E5; background-color: var(--grayLight); }

.bg-gray-lighter, .bg-gray-lighter-hover:hover { background-color: #fbfcfc; background-color: var(--grayLighter); }

.bg-gray-blue-dark, .bg-gray-blue-dark-hover:hover { background-color: #282C35; background-color: var(--grayBlueDark); }

.bg-gray-blue-light, .bg-gray-blue-light-hover:hover { background-color: #2d3340; background-color: var(--grayBlueLight); }

.c-gray, .c-gray-hover:hover { color: #B3B3B3; color: var(--gray); }

.c-gray-accessible, .c-gray-accessible-hover:hover { color: #595959; color: var(--grayAccessible); }

.c-gray-dark, .c-gray-dark-hover:hover { color: #222; color: var(--grayDark); }

.c-gray-light, .c-gray-light-hover:hover { color: #E5E5E5; color: var(--grayLight); }

.c-gray-lighter, .c-gray-lighter-hover:hover { color: #fbfcfc; color: var(--grayLighter); }

.bc-gray, .bc-gray-hover:hover { border-color: #B3B3B3; border-color: var(--gray); }

.bc-gray-accessible, .bc-gray-accessible-hover:hover { border-color: #595959; border-color: var(--grayAccessible); }

.bc-gray-dark, .bc-gray-dark-hover:hover { border-color: #222; border-color: var(--grayDark); }

.bc-gray-light, .bc-gray-light-hover:hover { border-color: #E5E5E5; border-color: var(--grayLight); }

.bc-gray-lighter, .bc-gray-lighter-hover:hover { border-color: #fbfcfc; border-color: var(--grayLighter); }

.fill-gray, .fill-gray-hover:hover { fill: #B3B3B3; fill: var(--gray); }

.fill-gray-dark, .fill-gray-dark-hover:hover { fill: #222; fill: var(--grayDark); }

.fill-gray-light, .fill-gray-light-hover:hover { fill: #E5E5E5; fill: var(--grayLight); }

.fill-gray-lighter, .fill-gray-lighter-hover:hover { fill: #fbfcfc; fill: var(--grayLighter); }

.c-gray-light-hover-trigger:hover .c-gray-light-hover-triggee {
  color: #E5E5E5;
  color: var(--grayLight);
}

/* -- Error */

.bg-error, .bg-error-hover:hover { background-color: #C71110; background-color: var(--error); }

.c-error, .c-error-hover:hover { color: #C71110; color: var(--error); }

.bc-error { border-color: #C71110; border-color: var(--error); }

.bg-error-light { background-color: #e79696; background-color: var(--errorLight); }

.c-error-light { color: #e79696; color: var(--errorLight); }

.bc-error-light { border-color: #e79696; border-color: var(--errorLight); }

.bg-error-lighter { background-color: #f7dcdc; background-color: var(--errorLighter); }

.bg-warn-lighter { background-color: #F3C195; background-color: var(--warnLighter); }

/* -- Success */

.bg-success { background-color: #2CBA03; background-color: var(--success); }

.bg-success-dark { background-color: #376f26; background-color: var(--successDark); }

.c-success { color: #2CBA03; color: var(--success); }

.bc-success { border-color: #2CBA03; border-color: var(--success); }

/* -- White */

.c-white, .c-white-hover:hover { color: #fff; color: var(--white); }

.c-white-10, .c-white-10-hover:hover { color: rgba(255,255,255,0.1); color: var(--white10); }

.c-white-25, .c-white-25-hover:hover { color: rgba(255,255,255,0.25); color: var(--white25); }

.c-white-40, .c-white-40-hover:hover { color: rgba(255,255,255,0.4); color: var(--white40); }

.c-white-55, .c-white-55-hover:hover { color: rgba(255,255,255,0.55); color: var(--white55); }

.c-white-70, .c-white-70-hover:hover { color: rgba(255,255,255,0.7); color: var(--white70); }

.c-white-85, .c-white-85-hover:hover { color: rgba(255,255,255,0.85); color: var(--white85); }

.fill-white, .fill-white-hover:hover { fill: #fff; fill: var(--white); }

.fill-white-10, .fill-white-10-hover:hover { fill: rgba(255,255,255,0.1); fill: var(--white10); }

.fill-white-25, .fill-white-25-hover:hover { fill: rgba(255,255,255,0.25); fill: var(--white25); }

.fill-white-40, .fill-white-40-hover:hover { fill: rgba(255,255,255,0.4); fill: var(--white40); }

.fill-white-55, .fill-white-55-hover:hover { fill: rgba(255,255,255,0.55); fill: var(--white55); }

.fill-white-70, .fill-white-70-hover:hover { fill: rgba(255,255,255,0.7); fill: var(--white70); }

.fill-white-85, .fill-white-85-hover:hover { fill: rgba(255,255,255,0.85); fill: var(--white85); }

.bg-white, .bg-white-hover:hover { background-color: #fff; background-color: var(--white); }

.bg-white-10, .bg-white-10-hover:hover { background-color: rgba(255,255,255,0.1); background-color: var(--white10); }

.bg-white-25, .bg-white-25-hover:hover { background-color: rgba(255,255,255,0.25); background-color: var(--white25); }

.bg-white-40, .bg-white-40-hover:hover { background-color: rgba(255,255,255,0.4); background-color: var(--white40); }

.bg-white-55, .bg-white-55-hover:hover { background-color: rgba(255,255,255,0.55); background-color: var(--white55); }

.bg-white-70, .bg-white-70-hover:hover { background-color: rgba(255,255,255,0.7); background-color: var(--white70); }

.bg-white-85, .bg-white-85-hover:hover { background-color: rgba(255,255,255,0.85); background-color: var(--white85); }

.bc-white, .bc-white-hover:hover { border-color: #fff; border-color: var(--white); }

.bc-white-10, .bc-white-10-hover:hover { border-color: rgba(255,255,255,0.1); border-color: var(--white10); }

.bc-white-25, .bc-white-25-hover:hover { border-color: rgba(255,255,255,0.25); border-color: var(--white25); }

.bc-white-40, .bc-white-40-hover:hover { border-color: rgba(255,255,255,0.4); border-color: var(--white40); }

.bc-white-55, .bc-white-55-hover:hover { border-color: rgba(255,255,255,0.55); border-color: var(--white55); }

.bc-white-70, .bc-white-70-hover:hover { border-color: rgba(255,255,255,0.7); border-color: var(--white70); }

.bc-white-85, .bc-white-85-hover:hover { border-color: rgba(255,255,255,0.85); border-color: var(--white85); }

/* -- Black */

.bg-black, .bg-black-hover:hover { background-color: #000; background-color: var(--black); }

.bg-black-10, .bg-black-10-hover:hover { background-color: rgba(0,0,0,0.1); background-color: var(--black10); }

.bg-black-25, .bg-black-25-hover:hover { background-color: rgba(0,0,0,0.25); background-color: var(--black25); }

.bg-black-40, .bg-black-40-hover:hover { background-color: rgba(0,0,0,0.4); background-color: var(--black40); }

.bg-black-55, .bg-black-55-hover:hover { background-color: rgba(0,0,0,0.55); background-color: var(--black55); }

.bg-black-70, .bg-black-70-hover:hover { background-color: rgba(0,0,0,0.7); background-color: var(--black70); }

.bg-black-85, .bg-black-85-hover:hover { background-color: rgba(0,0,0,0.85); background-color: var(--black85); }

.bc-black, .bc-black-hover:hover { border-color: #000; border-color: var(--black); }

.bc-black-10, .bc-black-10-hover:hover { border-color: rgba(0,0,0,0.1); border-color: var(--black10); }

.bc-black-25, .bc-black-25-hover:hover { border-color: rgba(0,0,0,0.25); border-color: var(--black25); }

.bc-black-40, .bc-black-40-hover:hover { border-color: rgba(0,0,0,0.4); border-color: var(--black40); }

.bc-black-55, .bc-black-55-hover:hover { border-color: rgba(0,0,0,0.55); border-color: var(--black55); }

.bc-black-70, .bc-black-70-hover:hover { border-color: rgba(0,0,0,0.7); border-color: var(--black70); }

.bc-black-85, .bc-black-85-hover:hover { border-color: rgba(0,0,0,0.85); border-color: var(--black85); }

.c-black, .c-black-hover:hover { color: #000; color: var(--black); }

.c-black-10, .c-black-10-hover:hover { color: rgba(0,0,0,0.1); color: var(--black10); }

.c-black-25, .c-black-25-hover:hover { color: rgba(0,0,0,0.25); color: var(--black25); }

.c-black-40, .c-black-40-hover:hover { color: rgba(0,0,0,0.4); color: var(--black40); }

.c-black-55, .c-black-55-hover:hover { color: rgba(0,0,0,0.55); color: var(--black55); }

.c-black-70, .c-black-70-hover:hover { color: rgba(0,0,0,0.7); color: var(--black70); }

.c-black-85, .c-black-85-hover:hover { color: rgba(0,0,0,0.85); color: var(--black85); }

.fill-black, .fill-black-hover:hover { fill: #000; fill: var(--black); }

.fill-black-10, .fill-black-10-hover:hover { fill: rgba(0,0,0,0.1); fill: var(--black10); }

.fill-black-25, .fill-black-25-hover:hover { fill: rgba(0,0,0,0.25); fill: var(--black25); }

.fill-black-40, .fill-black-40-hover:hover { fill: rgba(0,0,0,0.4); fill: var(--black40); }

.fill-black-55, .fill-black-55-hover:hover { fill: rgba(0,0,0,0.55); fill: var(--black55); }

.fill-black-70, .fill-black-70-hover:hover { fill: rgba(0,0,0,0.7); fill: var(--black70); }

.fill-black-85, .fill-black-85-hover:hover { fill: rgba(0,0,0,0.85); fill: var(--black85); }

/* Labels */

.label-primary,
.label-secondary,
.label-gray-light {
  border-radius: 8px;
  padding: 1px 4px;
  color: #222;
  color: var(--grayDark);
}

.label-primary {
  background-color: #FCDA32;
  background-color: var(--primary);
}

.label-secondary {
  background-color:  #225CBB;
  background-color:  var(--secondary);
  color: #fbfcfc;
  color: var(--grayLighter);
}

.label-gray-light {
  background-color:  #E5E5E5;
  background-color:  var(--grayLight);
}

/* Tags */

.tag {
  border-radius: 0.2rem;
  background-color: #E5E5E5;
  background-color: var(--grayLight);
  padding: 0.3rem 0.5rem;
  margin: 0.2rem;
  text-align: center;
  font-size: .75rem;
}

/* BORDERS */

.border-dashed { border-style: dashed }

/* Border radius */

.br-0 { border-radius: 0; }

.br-2, .br-small { border-radius: 2px; }

.br-big { border-radius: 4px; }

.br-8 { border-radius: 8px; }

.br-16 { border-radius: 16px; }

.brtl-2 { border-top-left-radius: 2px; }

.brtr-2 { border-top-right-radius: 2px; }

.brbl-2 { border-bottom-left-radius: 2px; }

.brbr-2 { border-bottom-right-radius: 2px; }

.bw-1 { border-width: 1px; }

.bw-2 { border-width: 2px; }

.bw-4 { border-width: 4px; }

/* Box Shadow (Outer border) */

.bs-primary { -webkit-box-shadow: #FCDA32 0px 0px 0px 4px; box-shadow: #FCDA32 0px 0px 0px 4px; -webkit-box-shadow: var(--primary) 0px 0px 0px 4px; box-shadow: var(--primary) 0px 0px 0px 4px; }

.bs-secondary { -webkit-box-shadow: #225CBB 0px 0px 0px 4px; box-shadow: #225CBB 0px 0px 0px 4px; -webkit-box-shadow: var(--secondary) 0px 0px 0px 4px; box-shadow: var(--secondary) 0px 0px 0px 4px; }

.bs-gray { -webkit-box-shadow: #B3B3B3 0px 0px 0px 4px; box-shadow: #B3B3B3 0px 0px 0px 4px; -webkit-box-shadow: var(--gray) 0px 0px 0px 4px; box-shadow: var(--gray) 0px 0px 0px 4px; }

.bst { -webkit-box-shadow: transparent 0px 0px 0px 4px; box-shadow: transparent 0px 0px 0px 4px; }

/* Box Shadow Inset (Inner border) */

.bsi-primary { -webkit-box-shadow: inset 0 0 0 2px #FCDA32; box-shadow: inset 0 0 0 2px #FCDA32; -webkit-box-shadow: inset 0 0 0 2px var(--primary); box-shadow: inset 0 0 0 2px var(--primary); }

.bsi-secondary { -webkit-box-shadow: inset 0 0 0 2px #225CBB; box-shadow: inset 0 0 0 2px #225CBB; -webkit-box-shadow: inset 0 0 0 2px var(--secondary); box-shadow: inset 0 0 0 2px var(--secondary); }

.bsi-gray { -webkit-box-shadow: inset 0 0 0 2px #B3B3B3; box-shadow: inset 0 0 0 2px #B3B3B3; -webkit-box-shadow: inset 0 0 0 2px var(--gray); box-shadow: inset 0 0 0 2px var(--gray); }

.bst { -webkit-box-shadow: 0 1px transparent; box-shadow: 0 1px transparent; }

/* BG EFFECTS */

.bg-error-striped {
  background-image: repeating-linear-gradient( -45deg, rgba(255,255,255,0), rgba(255,255,255,0) 2px, rgba(191, 87, 88, 0.25) 2px, rgba(191, 87, 88, 0.25) 4px );
}

/* Paper */

.paper-1 { -webkit-box-shadow: rgba(0, 0, 0, 0.117647) 0px 1px 6px, rgba(0, 0, 0, 0.117647) 0px 1px 4px; box-shadow: rgba(0, 0, 0, 0.117647) 0px 1px 6px, rgba(0, 0, 0, 0.117647) 0px 1px 4px; }

.paper-2 { -webkit-box-shadow: rgba(0, 0, 0, 0.156863) 0px 3px 10px, rgba(0, 0, 0, 0.227451) 0px 3px 10px; box-shadow: rgba(0, 0, 0, 0.156863) 0px 3px 10px, rgba(0, 0, 0, 0.227451) 0px 3px 10px; }

.paper-3 { -webkit-box-shadow: rgba(0, 0, 0, 0.188235) 0px 10px 30px, rgba(0, 0, 0, 0.227451) 0px 6px 10px; box-shadow: rgba(0, 0, 0, 0.188235) 0px 10px 30px, rgba(0, 0, 0, 0.227451) 0px 6px 10px; }

.paper-4 { -webkit-box-shadow: rgba(0, 0, 0, 0.247059) 0px 14px 45px, rgba(0, 0, 0, 0.219608) 0px 10px 18px; box-shadow: rgba(0, 0, 0, 0.247059) 0px 14px 45px, rgba(0, 0, 0, 0.219608) 0px 10px 18px; }

.paper-5 { -webkit-box-shadow: rgba(0, 0, 0, 0.298039) 0px 19px 60px, rgba(0, 0, 0, 0.219608) 0px 15px 20px; box-shadow: rgba(0, 0, 0, 0.298039) 0px 19px 60px, rgba(0, 0, 0, 0.219608) 0px 15px 20px; }

.drop-shadow { -webkit-box-shadow: 0 2px 6px 0 rgba(89,89,89,0.62); box-shadow: 0 2px 6px 0 rgba(89,89,89,0.62); }

:focus::-webkit-input-placeholder { color: transparent; }

.disabled {
  opacity: 0.5;
  pointer-events: none;
}

.muted { opacity: 0.5; }

.pointer-disabled {
  pointer-events: none;
}

.pointer-enabled {
  pointer-events: all;
}

.pointer-initial {
  pointer-events: initial;
}

.noselect {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

/* Hovers */

.ease-in-out {
  -webkit-transition: 50ms ease-in-out;
  transition: 50ms ease-in-out;
}

.scale {
  -webkit-transition: -webkit-transform 50ms linear;
  transition: -webkit-transform 50ms linear;
  transition: transform 50ms linear;
  transition: transform 50ms linear, -webkit-transform 50ms linear;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
  -webkit-transform: initial;
      -ms-transform: initial;
          transform: initial;
}

.scale:hover { -webkit-transform: scale(1.1,1.1); -ms-transform: scale(1.1,1.1); transform: scale(1.1,1.1); }

.pointer { cursor: pointer; }

.text-cursor { cursor: text;	}

.crosshair { cursor: crosshair; }

.initial-cursor { cursor: auto; cursor: initial; }

.default-cursor { cursor: default; }

.grabbable {
  cursor: move;
  cursor: grab;
  cursor: -webkit-grab;
}

.grabbable:active {
  cursor: grabbing;
  cursor: -webkit-grabbing;
}

.upAnimation {
  -webkit-transition: -webkit-transform 100ms;
  transition: -webkit-transform 100ms;
  transition: transform 100ms;
  transition: transform 100ms, -webkit-transform 100ms;
}

.upAnimation:hover {
  -webkit-transform: translateY(-2px);
      -ms-transform: translateY(-2px);
          transform: translateY(-2px);
}

.leftAnimation {
  -webkit-transition: -webkit-transform 100ms;
  transition: -webkit-transform 100ms;
  transition: transform 100ms;
  transition: transform 100ms, -webkit-transform 100ms;
}

.leftAnimation:hover {
  -webkit-transform: translateX(-2px);
      -ms-transform: translateX(-2px);
          transform: translateX(-2px);
}

.rightAnimation {
  -webkit-transition: -webkit-transform 100ms;
  transition: -webkit-transform 100ms;
  transition: transform 100ms;
  transition: transform 100ms, -webkit-transform 100ms;
}

.rightAnimation:hover {
  -webkit-transform: translateX(2px);
      -ms-transform: translateX(2px);
          transform: translateX(2px);
}

.goBack > * {
  -webkit-transition: -webkit-transform 200ms;
  transition: -webkit-transform 200ms;
  transition: transform 200ms;
  transition: transform 200ms, -webkit-transform 200ms;
}

.goBack:hover > * {
  -webkit-transform: translateX(-2px);
      -ms-transform: translateX(-2px);
          transform: translateX(-2px);
}

/* Visibility */

.hidden,
.visible-hover {
  display: none;
}

.visible-hover:hover,
.visible-hover-trigger:hover .visible-hover {
  display: block;
}

.opacity-hover-trigger .opacity-hover-triggee,
.opacity-hover {
  opacity: 0;
  -webkit-transition: opacity 160ms linear;
  transition: opacity 160ms linear;
}

.opacity-hover-trigger:hover .opacity-hover-triggee,
.opacity-hover:hover {
  opacity: 1;
}

.opacity-hover-lighter {
  opacity: 1;
  -webkit-transition: opacity 50ms ease-in-out;
  transition: opacity 50ms ease-in-out;
}

.opacity-hover-lighter:hover {
  opacity: 0.80;
}

.opacity-hover-lighter-performant {
  opacity: 1;
}

.opacity-hover-lighter-performant:hover {
  opacity: 0.80;
}

.opacity-hover-lighter-performant-alt {
  opacity: 1;
}

.opacity-hover-lighter-performant-alt:hover {
  opacity: 0.70;
}

.opacity-hover-parent .opacity-hover-child {
  opacity: 0;
}

.opacity-hover-parent:hover .opacity-hover-child {
  opacity: 1;
}

.invisible {
  visibility: hidden;
}

/* Inheritance size */

.max-height-inherit {
  max-height: inherit;
}

.max-width-inherit {
  max-width: inherit;
}

.max-inherit {
  max-height: inherit;
  max-width: inherit;
}

/* Overflow */

.overflow-hidden { overflow: hidden; }

.overflow-y-hidden { overflow-y: hidden; }

.overflow-x-hidden { overflow-x: hidden; }

.overflow-scroll { overflow: scroll; }

.overflow-y-scroll { overflow-y: scroll; }

.overflow-x-scroll { overflow-x: scroll; }

.overflow-overlay { overflow: overlay; }

.overflow-y-overlay { overflow-y: overlay; }

.overflow-x-overlay { overflow-x: overlay; }

.overflow-auto { overflow: auto; }

.overflow-y-auto { overflow-y: auto; }

.overflow-x-auto { overflow-x: auto; }

.overflow-anchor-none { overflow-anchor: none; }

.smooth-scroll { scroll-behavior: smooth; }

.zn1-hover:hover { z-index: -1; }

.z0-hover:hover { z-index: 0; }

.z1-hover:hover { z-index: 1; }

.z2-hover:hover { z-index: 2; }

.z3-hover:hover { z-index: 3; }

.z4-hover:hover { z-index: 4; }

/* Typography */

.f1 { font-size: 3rem; }

.f2 { font-size: 2.25rem; }

.f3 { font-size: 1.5rem; }

.f4 { font-size: 1.25rem; }

.f5 { font-size: 1rem; }

.f6 { font-size: .875rem; }

.f7 { font-size: .75rem; }

.f8 { font-size: .625rem; }

.uppercase { text-transform: uppercase; }

.capitalize { text-transform: capitalize; }

.lowercase { text-transform: lowercase; }

.border-first-none:first-of-type { border: none; }

.border-last-none:last-of-type { border: none; }

.border-none { border: none; }

.nowrap { white-space: nowrap; }

.break-word { word-wrap: break-word; }

.underline-hover:hover {
  text-decoration: underline;
}

.bold-hover:hover {
  font-weight: bold;
}

.line-height {
  line-height: 1.5em;
}

/* Psuedo class helpers */

.block-before:before {
  display: block !important;
}

/* Selections */

.select-disable {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.select-enable {
  -webkit-user-select: all;
     -moz-user-select: all;
      -ms-user-select: all;
          user-select: all;
}

/* Pointer Events */

.events-disable {
  pointer-events: none;
}

.events-enable {
  pointer-events: auto;
}

.events-inherit {
  pointer-events: inherit;
}

/* Layout and Grid */

/* -- Positon */

.top-0 { top: 0; }

.right-0 { right: 0; }

.left-0 { left: 0; }

.bottom-0 { bottom: 0; }

.top-50 { top: 50%; }

.right-50 { right: 50%; }

.left-50 { left: 50%; }

.bottom-50 { bottom: 50%; }

/* Negative margin > see basscss.com for usage */

.mtn1 { margin-top: -0.5rem; }

.mtn2 { margin-top: -1rem; }

.mtn3 { margin-top: -2rem; }

.mtn4 { margin-top: -4rem; }

.mbn1 { margin-bottom: -0.5rem; }

.mbn2 { margin-bottom: -1rem; }

.mbn3 { margin-bottom: -2rem; }

.mbn4 { margin-bottom: -4rem; }

/* Margin auto - addition to basscss> see basscss.com for usage */

.m-auto {margin: auto;}

.my-auto {margin-top: auto; margin-bottom: auto;}

.flex-1 { -ms-flex: 1; flex: 1 1; }

.width-100 { width: 100%; }

.width-90 { width: 90%; }

.width-80 { width: 80%; }

.width-75 { width: 75%; }

.width-70 { width: 70%; }

.width-66 { width: calc((100% / 3) * 2); }

.width-60 { width: 60%; }

.width-50 { width: 50%; }

.width-40 { width: 40%; }

.width-33 { width: calc(100% / 3); }

.width-30 { width: 30%; }

.width-25 { width: 25%; }

.width-20 { width: 20%; }

.width-16 { width: calc(100% / 6); }

.width-12 { width: calc(100% / 8); }

.width-10 { width: 10%; }

.height-100 { height: 100%; }

.height-50 { height: 50%; }

/* X-Small Screens */

@media (min-width: 30em) {
  .xs-width-100 { width: 100%; }
  .xs-width-50 { width: 50%; }
  .xs-width-33 { width: calc(100% / 3); }
  .xs-width-25 { width: 25%; }
  .xs-width-20 { width: 20%; }
  .xs-width-16 { width: calc(100% / 6); }
  .xs-width-12 { width: calc(100% / 8); }
  .xs-width-10 { width: 10%; }

  .xs-col-1 { width: calc(100% / 12 * 1); }
  .xs-col-2 { width: calc(100% / 12 * 2); }
  .xs-col-3 { width: calc(100% / 12 * 3); }
  .xs-col-4 { width: calc(100% / 12 * 4); }
  .xs-col-5 { width: calc(100% / 12 * 5); }
  .xs-col-6 { width: calc(100% / 12 * 6); }
  .xs-col-7 { width: calc(100% / 12 * 7); }
  .xs-col-8 { width: calc(100% / 12 * 8); }
  .xs-col-9 { width: calc(100% / 12 * 9); }
  .xs-col-10 { width: calc(100% / 12 * 10); }
  .xs-col-11 { width: calc(100% / 12 * 11); }
  .xs-col-12 { width: calc(100% / 12 * 12); }

  .xs-p0 { padding: 0; }
}

/* Small Screens */

@media (min-width: 40em) {
  .sm-width-100 { width: 100%; }
  .sm-width-50 { width: 50%; }
  .sm-width-33 { width: calc(100% / 3); }
  .sm-width-25 { width: 25%; }
  .sm-width-20 { width: 20%; }
  .sm-width-16 { width: calc(100% / 6); }
  .sm-width-12 { width: calc(100% / 8); }
  .sm-width-10 { width: 10%; }
}

/* Medium Screens */

@media (min-width: 52em) {
  .md-width-100 { width: 100%; }
  .md-width-50 { width: 50%; }
  .md-width-33 { width: calc(100% / 3); }
  .md-width-25 { width: 25%; }
  .md-width-20 { width: 20%; }
  .md-width-16 { width: calc(100% / 6); }
  .md-width-12 { width: calc(100% / 8); }
  .md-width-10 { width: 10%; }
}

/* Large Screens */

@media (min-width: 64em) {
  .lg-width-100 { width: 100%; }
  .lg-width-50 { width: 50%; }
  .lg-width-33 { width: calc(100% / 3); }
  .lg-width-25 { width: 25%; }
  .lg-width-20 { width: 20%; }
  .lg-width-16 { width: calc(100% / 6); }
  .lg-width-12 { width: calc(100% / 8); }
  .lg-width-10 { width: 10%; }
}

/* X-Large Screens */

@media (min-width: 80em) {
  .xl-width-100 { width: 100%; }
  .xl-width-50 { width: 50%; }
  .xl-width-33 { width: calc(100% / 3); }
  .xl-width-25 { width: 25%; }
  .xl-width-20 { width: 20%; }
  .xl-width-16 { width: calc(100% / 6); }
  .xl-width-12 { width: calc(100% / 8); }
  .xl-width-10 { width: 10%; }

  .xl-col-1 { width: calc(100% / 12 * 1); }
  .xl-col-2 { width: calc(100% / 12 * 2); }
  .xl-col-3 { width: calc(100% / 12 * 3); }
  .xl-col-4 { width: calc(100% / 12 * 4); }
  .xl-col-5 { width: calc(100% / 12 * 5); }
  .xl-col-6 { width: calc(100% / 12 * 6); }
  .xl-col-7 { width: calc(100% / 12 * 7); }
  .xl-col-8 { width: calc(100% / 12 * 8); }
  .xl-col-9 { width: calc(100% / 12 * 9); }
  .xl-col-10 { width: calc(100% / 12 * 10); }
  .xl-col-11 { width: calc(100% / 12 * 11); }
  .xl-col-12 { width: calc(100% / 12 * 12); }
}

/* XX-Large Screens */

@media (min-width: 120em) {
  .xxl-width-100 { width: 100%; }
  .xxl-width-50 { width: 50%; }
  .xxl-width-33 { width: calc(100% / 3); }
  .xxl-width-25 { width: 25%; }
  .xxl-width-20 { width: 20%; }
  .xxl-width-16 { width: calc(100% / 6); }
  .xxl-width-12 { width: calc(100% / 8); }
  .xxl-width-10 { width: 10%; }

  .xxl-col-1 { width: calc(100% / 12 * 1); }
  .xxl-col-2 { width: calc(100% / 12 * 2); }
  .xxl-col-3 { width: calc(100% / 12 * 3); }
  .xxl-col-4 { width: calc(100% / 12 * 4); }
  .xxl-col-5 { width: calc(100% / 12 * 5); }
  .xxl-col-6 { width: calc(100% / 12 * 6); }
  .xxl-col-7 { width: calc(100% / 12 * 7); }
  .xxl-col-8 { width: calc(100% / 12 * 8); }
  .xxl-col-9 { width: calc(100% / 12 * 9); }
  .xxl-col-10 { width: calc(100% / 12 * 10); }
  .xxl-col-11 { width: calc(100% / 12 * 11); }
  .xxl-col-12 { width: calc(100% / 12 * 12); }
}

@-webkit-keyframes progress-bar-stripes {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 1rem 0;
  }
}

@keyframes progress-bar-stripes {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: 1rem 0;
  }
}

/* React virtualized dependencies, TODO: remove when webpack */

/* Table default theme */

.ReactVirtualized__Table__headerRow {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
}

.ReactVirtualized__Table__row {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
}

.ReactVirtualized__Table__headerTruncatedText {
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.ReactVirtualized__Table__headerColumn,
.ReactVirtualized__Table__rowColumn {
  margin-right: 10px;
  min-width: 0px;
}

.ReactVirtualized__Table__rowColumn {
  text-overflow: ellipsis;
  white-space: nowrap;
}

.ReactVirtualized__Table__headerColumn:first-of-type,
.ReactVirtualized__Table__rowColumn:first-of-type {
  margin-left: 10px;
}

.ReactVirtualized__Table__sortableHeaderColumn {
  cursor: pointer;
}

.ReactVirtualized__Table__sortableHeaderIconContainer {
  display: -ms-flexbox;
  display: -webkit-box;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
}

.ReactVirtualized__Table__sortableHeaderIcon {
  -ms-flex: 0 0 24px;
      flex: 0 0 24px;
  height: 1em;
  width: 1em;
  fill: currentColor;
}

/* Annotations */

.annotation-closed:hover {
  background: #225CBB !important;
  background: var(--secondary) !important;
}

/* Misc */

@media screen and (max-width: 1300px) {
  .hide-when-small {
    display: none;
  }
}

.Yl_vDMHVm_45qhcNMTtg {}

.ReactModal__Body--open .hWD1S_QLwC4TjKhO6b0e {
    background: rgba(255, 255, 255, 0.6);
  }

.ReactModal__Body--open .DWAr0zKKmZxsbaCG9Xv5 {
    background: rgba(0, 0, 0, 0.6);
  }

.ReactModal__Body--open .Ngd1LJT1AksKQlisquzE:before {
    -webkit-box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.15);
            box-shadow: 0px 0px 50px rgba(0, 0, 0, 0.15);
  }

.ReactModal__Body--open .Lk1rcYdKKTGMuTThoGqj:before {
    -webkit-box-shadow: 0px 0px 110px var(--todo_2f2f2f);
            box-shadow: 0px 0px 110px var(--todo_2f2f2f);
  }

.wSNWrSuF3pKL6BWGR8AR {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;

  -webkit-transition-delay: 150ms;

          transition-delay: 150ms;
  -webkit-transition: background 100ms ease-in;
  transition: background 100ms ease-in;
}

.DWAr0zKKmZxsbaCG9Xv5 {

  background: rgba(0, 0, 0, 0);
}

.lH11bqBKs04vQWfCIbdD {
  border-radius: 2;
  top: 47%;
  left: 50%;
  max-width: 90%;
  -webkit-transform: translate(-50%, -47%);
      -ms-transform: translate(-50%, -47%);
          transform: translate(-50%, -47%);
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden
}

.lH11bqBKs04vQWfCIbdD:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;

    -webkit-transition-delay: 150ms;

            transition-delay: 150ms;
    -webkit-transition: -webkit-box-shadow 50ms ease-in;
    transition: -webkit-box-shadow 50ms ease-in;
    transition: box-shadow 50ms ease-in;
    transition: box-shadow 50ms ease-in, -webkit-box-shadow 50ms ease-in;
  }

.Lk1rcYdKKTGMuTThoGqj {

  position: fixed
}

.Lk1rcYdKKTGMuTThoGqj:before {
    -webkit-box-shadow: 0px 0px 0px var(--todo_2f2f2f);
            box-shadow: 0px 0px 0px var(--todo_2f2f2f);
  }

.Ngd1LJT1AksKQlisquzE {

  position: absolute
}

.Ngd1LJT1AksKQlisquzE:before {
    -webkit-box-shadow: 0px 0px 0px rgba(0,0,0,0.15);
            box-shadow: 0px 0px 0px rgba(0,0,0,0.15);
  }

.hWD1S_QLwC4TjKhO6b0e {

  background: rgba(255, 255, 255, 0);
}

.nc6nlwAjR0PvIjYzbtH3 {
  padding: 0;
}

.U03a1_2g2zdR5QYznknZ {
  padding: 0.5rem;
}

.KIOQVvRhug0UUgoFeilE {
  padding: 0.75rem 1rem;
}

.m46LG8_qrvjbt5dtgUdY {
  padding: 1.6rem 2rem;
}

.Ej8d238X7VvlZOz9SBfF {
  padding: 0;
}

.EN3prnzmwDDFLRGPVlOg {
  padding: 0.5rem;
}

.ybedsR9trmeDknCoxVTy {
  padding: 0.75rem;
}

.ZG5M7jnCNqC1rMSbZBzk {
  padding: 1.6rem;
}

.tIIslUrUBmoLwoYzsP6x svg + div {
  margin-left: 0.5rem;
}

.tIIslUrUBmoLwoYzsP6x svg {}

.NkGXMLE0KFbZ4mxh8yvS {
  border-width: 1px
}

.NkGXMLE0KFbZ4mxh8yvS:hover {
    -webkit-box-shadow: inset 0 0 0 1px var(--white);
            box-shadow: inset 0 0 0 1px var(--white);
  }

.tIIslUrUBmoLwoYzsP6x:focus {
  -webkit-box-shadow: inset 0 0 0 1px var(--white), 0 0 0 1px var(--primary);
          box-shadow: inset 0 0 0 1px var(--white), 0 0 0 1px var(--primary);
}

.OJKLM12Hq_GGnl2Sc1Gg:focus {
  -webkit-box-shadow: inset 0 0 0 1px var(--white), 0 0 0 1px var(--secondary);
          box-shadow: inset 0 0 0 1px var(--white), 0 0 0 1px var(--secondary);
}

.gac1qZvzQeymckIk9YFn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.gac1qZvzQeymckIk9YFn button {
  margin-left: 2px
}

.gac1qZvzQeymckIk9YFn button .vh2DMY_RlNS2B74aAiyN {
    border-radius: 4px;
  }

.gac1qZvzQeymckIk9YFn button .RtxYpMDZBkl1bwq5MzvF {
    border-radius: 2px;
  }

.gac1qZvzQeymckIk9YFn button:not(:first-of-type):not(:last-of-type) {
    border-radius: 0;
  }

.gac1qZvzQeymckIk9YFn button:first-of-type {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-left: 0;
    margin-right: -1px;
  }

.gac1qZvzQeymckIk9YFn button:last-of-type {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }

.gac1qZvzQeymckIk9YFn:first-child {
  margin-left: 0;
}

.agKQtshxl2tmyQ8yWDLc { width: 160px; }

.iVlJlPPSAZmHCR8GgyYw { top: 100%; }
.CesEL4bKzzoWaJverwiA { bottom: 100%; }
.anWcFS_aOXGKBbWTGLc1 { right: 0; }
.PtUNkzDYp9EdviCSmxn4 { left: 0; }

.MO6flaU7qhRJLOHPG7ir { }
.eRmuimivl9x3HYmfnNZa { }
.g__yAiZDw6gFoHTVDm9k { }
.l1jAB6Rac5KKQtl6XCSr { }

.w8SLLeRYJJVOOzn8kpcy {
  font-size: 0.8rem;
}


  .Boo0QYyQ6UoSPtXBRMVy:first-child:hover {
    text-decoration: underline;
  }

.Boo0QYyQ6UoSPtXBRMVy:not(:first-child):hover {
    cursor: default;
  }

.Boo0QYyQ6UoSPtXBRMVy:not(:first-child) {
    pointer-events: auto;
  }

.kiUB_zEHBmfPiKCKQdEO {
  text-transform: capitalize;
  font-size: 10px;
}

.kiUB_zEHBmfPiKCKQdEO:hover {
  color: var(--grayLight);
}

.d3qxR4uIU7YvvTCVBDPD {
  color: var(--white);
  padding:0;
}

.d3qxR4uIU7YvvTCVBDPD:hover {
  color: var(--grayLight);
}

input,
textarea {
  font-family: 'Verdana', sans-serif;
}

.rTWgonlSXs50_OQsA7Ha {
  padding: 0.5rem;
  color: var(--grayDark);
  background: var(--white);
  border: 1px solid var(--grayLight);
  border-radius: 2px;
  line-height: 1.5;
  font-size: 0.75rem;
}

.kFaNgU83LgpoNgvkb2LW {
}

.rTWgonlSXs50_OQsA7Ha:focus {
  outline: none;
  border: 1px solid var(--secondary);
}

.mtgyYOlPAJlOoDqN6OOP {
  padding: 0;
  margin: 0;
  border: none;
}

.a8qrb_vZfEg3jddUFFil {
  color: inherit;
  font-size: 0.75rem;
}

.kRQPNLdC8JcDPggMfYEc {
  font-weight: bold;
}

.ox69PH50sRQ8dJW3_POg {
  font-weight: normal;
}

.QIStoeGeuhhUkisN4ir2 {
  color: var(--white);
}

.Vpe8runmH5pF4JAT5GUX {
  color: var(--grayAlt);
}

.kwAuBtJ94S99xYZaSRas {
}

.PP9sRVhWkql8ue7UWbrK {
  font-size: inherit;
  width: 100%;
  padding-left: 0.5em;
  border-color: var(--gray) !important;
}

.PP9sRVhWkql8ue7UWbrK:focus {
  outline: none;
  border: 1px solid var(--secondary) !important;
}

.Yrv0NEUWa514xlfUBYFW {
  border-color: transparent !important;
}

.vLr7vvAWZVOyAOidaYXK {
  border-color: transparent !important;
  color: var(--grayLightAlt) !important;
}

.eNqB5DjREteYofvRuGGb {
}

.GlunjugAVssxGDSu80A2 {
}

.bN9ZBzkVDk_fjIFQo2zk {
}

.LZuQxj8bTVc3UvE73jZm {
}

.LZuQxj8bTVc3UvE73jZm::-webkit-search-cancel-button{
  -webkit-appearance: none;
}

.TYN65w08LoO24taUxkto {
  border-color: var(--errorLightAlt);
}

.tzxRrTWxCYy8pTdWWnpl {
  -webkit-appearance: none;
  width: 100%;
  background: transparent;
  padding: 0;
  border: 1px solid transparent;
}

.s1ZLYObyuxxDbc44GJUQ {
}

.tzxRrTWxCYy8pTdWWnpl:focus {
  border: 1px solid var(--secondary);
}

.tzxRrTWxCYy8pTdWWnpl:active::-webkit-slider-thumb,
.tzxRrTWxCYy8pTdWWnpl::-webkit-slider-thumb {
  width: 22px;
  height: 22px;
  border-radius: 22px;
  margin-top: -9.5px;
}

.tzxRrTWxCYy8pTdWWnpl::-webkit-slider-thumb {
  -webkit-appearance: none;
  background: var(--secondary);
}

.s1ZLYObyuxxDbc44GJUQ::-webkit-slider-thumb {
  background: var(--grayLightAlt);
}

.tzxRrTWxCYy8pTdWWnpl:focus,
.tzxRrTWxCYy8pTdWWnpl:active,
.tzxRrTWxCYy8pTdWWnpl:hover {
  outline: none;
  background: transparent;
  color: transparent;
}

.tzxRrTWxCYy8pTdWWnpl::-webkit-slider-runnable-track {
  width: 100%;
  height: 4px;
  cursor: pointer;
  border-radius: 2px;
  background: rgba(0,0,0,0.2);
  -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);
          box-shadow: inset 0 2px 4px rgba(0,0,0,0.2);
}

.s1ZLYObyuxxDbc44GJUQ::-webkit-slider-runnable-track {
  background: var(--grayLightAlt);
  -webkit-box-shadow: none;
          box-shadow: none;
}

.bN9ZBzkVDk_fjIFQo2zk, .kFaNgU83LgpoNgvkb2LW {
  display:none;
}

.bN9ZBzkVDk_fjIFQo2zk + label, .kFaNgU83LgpoNgvkb2LW + label {
  cursor: pointer;
}

.uNTk88X4qd3UIAFLxgDa {
  display: inline-block;
  width: 2em;
  height: 2em;
  margin: 0 4px 0 0;
  vertical-align: middle;
  border-radius: 50%;
  border: 0.2em solid;
  border-color: inherit;
}

.GkI_892rmXkqOgEwlGeT {
  border: none;
}

.bN9ZBzkVDk_fjIFQo2zk:checked + .kRQPNLdC8JcDPggMfYEc .uNTk88X4qd3UIAFLxgDa {
  -webkit-box-shadow: inset 0px 0px 0px 3px white;
          box-shadow: inset 0px 0px 0px 3px white;
}

.FGzP2jWZ3dnzZBrjfigW {
  display: inline-block;
  width: 2em;
  height: 2em;
  margin: 0 4px 0 0;
  vertical-align: middle;
  border: 0.2em solid;
  border-color: inherit;
}

.X4064hk3f6OdgtCyrffr {
  border-color: var(--white);
}

.cWFcdgJGVrH0h1Qe25ql {
  border: none;
}

.kFaNgU83LgpoNgvkb2LW:checked + .kRQPNLdC8JcDPggMfYEc .FGzP2jWZ3dnzZBrjfigW {
  -webkit-box-shadow: inset 0px 0px 0px 3px var(--white);
          box-shadow: inset 0px 0px 0px 3px var(--white);
}

.yPh7f2HFILGy0twssree div,
.ldWL2pGZy6SvEGHyFKQt div {
  margin-top: 7px;
}

.yPh7f2HFILGy0twssree label,
.yPh7f2HFILGy0twssree div,
.ldWL2pGZy6SvEGHyFKQt label,
.ldWL2pGZy6SvEGHyFKQt div {
  font-weight: normal;
  display: inline-block;
  margin-right: 1em;
}

.K4dMhlMHw1gtCsmcdAN5 label {
  font-weight: normal;
}

.ox8swnoeF4KMpGf2eJEt label {
  font-weight: normal;
}

.yPh7f2HFILGy0twssree > div:last-of-type,
.yPh7f2HFILGy0twssree > div:last-of-type div,
.yPh7f2HFILGy0twssree > div:last-of-type label,
.ldWL2pGZy6SvEGHyFKQt > div:last-of-type label,
.ldWL2pGZy6SvEGHyFKQt > div:last-of-type div,
.ldWL2pGZy6SvEGHyFKQt > div:last-of-type {
  margin-right: 0;
}

/* REACT INPUT SELECT */
.react-select-container {
  line-height: 1.5;
  font-size: 0.8rem;
}

.react-select__control {
  color: var(--grayDark) !important ;
  background: var(--white) !important;
  border-radius: 2px !important;
  border: 1px solid var(--todo_eee) !important;
}

.react-select__control:hover {
  border-color: var(--secondary) !important;
}

.react-select__control--is-focused {
  Box-shadow: none !important;
  border-color: var(--secondary) !important;
}

.react-select__multi-value {
  background-color: var(--secondary) !important;
  color: var(--grayLighter) !important;
}

.react-select__multi-value__label {
  padding-left: 0.4rem !important;
  padding-right: 0.4rem !important;
  color: var(--grayLighter) !important;
  font-size: .75rem !important;
}

.react-select__multi-value__remove:hover {
  background-color: var(--secondaryLight) !important;
  color: var(--grayLighter) !important;
}

.react-select__option--is-focused {
  background-color: var(--secondary) !important;
  color: var(--grayLighter) !important;
}

.react-select__dropdown-indicator {
  color: var(--grayLight) !important;
}

.react-select__indicator-separator {
  background-color: var(--grayLight) !important;
}

/* REACT INPUT RANGE */
.ZXErZrzk7iTllLRHtBN_ {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  background: var(--secondary);
  border: 1px solid var(--secondary);
  border-radius: 100%;
  cursor: pointer;
  display: block;
  height: 1.4rem;
  margin-left: -0.7rem;
  margin-top: -0.85rem;
  outline: none;
  position: absolute;
  top: 50%;
  -webkit-transition: -webkit-transform 0.3s ease-out, -webkit-box-shadow 0.3s ease-out;
  transition: -webkit-transform 0.3s ease-out, -webkit-box-shadow 0.3s ease-out;
  transition: transform 0.3s ease-out, box-shadow 0.3s ease-out;
  transition: transform 0.3s ease-out, box-shadow 0.3s ease-out, -webkit-transform 0.3s ease-out, -webkit-box-shadow 0.3s ease-out;
  width: 1.4rem;
}

.ZXErZrzk7iTllLRHtBN_:nth-child(1) {
  margin-left: 2rem;
}

.jMXyo8McZKStVDMiUmsz .ZXErZrzk7iTllLRHtBN_ {
  background: var(--grayLight);
  border: 1px solid var(--grayLight);
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transform: none;
      -ms-transform: none;
          transform: none;
}

.fNVlsWMDAxc6kVaga4hz {
  -webkit-transition: left 0.3s ease-out;
  transition: left 0.3s ease-out;
}

._2fCHd5RJG8y4e44KdJlE {
  color: var(--grayDark);
  font-size: 0.7rem;
  -webkit-transform: translateZ(0);
          transform: translateZ(0);
  white-space: nowrap;
}

.y3t7FNObnqfl9TYm0gnv,
.XVol5PEIGQPDZWAZcgQz {
  display: none;
}

.Q8OO5gHh6QcUXaDHdiuX {
  position: absolute;
  top: -2rem;
  left: -1.5rem;
  width: 3rem;
  text-align: center;
}

.dXI49tv7V3vUhCTSs5lm {
  position: relative;
  display: block;
}

.XhODbwQFUkPy7Eykezly {
  background: var(--grayLight);
  border-radius: 0.3rem;
  cursor: pointer;
  display: block;
  height: 0.2rem;
  position: relative;
  -webkit-transition: left 0.3s ease-out, width 0.3s ease-out;
  transition: left 0.3s ease-out, width 0.3s ease-out;
}

.jMXyo8McZKStVDMiUmsz .XhODbwQFUkPy7Eykezly {
  background: var(--grayLight);
}

.xXga2L11CQ6SNgSk_Xkj {
  left: 0.7rem;
  position: absolute;
  right: 0.7rem;
  top: 50%;
}

._0TarguDkIbv8wrzZoaGC {
  background: var(--secondary);
}

.tzxRrTWxCYy8pTdWWnpl {
  height: 1rem;
  position: relative;
  width: 94%;
  margin: auto;
}

.ezIQsToZgOk2vXe6E3uR,
.nwelwgc4a9looYOYKG3j,
.ezIQsToZgOk2vXe6E3uR:focus,
.ezIQsToZgOk2vXe6E3uR:active,
.nwelwgc4a9looYOYKG3j:focus,
.nwelwgc4a9looYOYKG3j:active {
  background: transparent;
  -webkit-box-shadow: none;
          box-shadow: none;
  border: none;
  outline: none;
  padding-bottom: 0.2rem;
}

.ezIQsToZgOk2vXe6E3uR,
.ezIQsToZgOk2vXe6E3uR:focus,
.ezIQsToZgOk2vXe6E3uR:active {
  resize: none;
  font-size: 1rem;
}

.nwelwgc4a9looYOYKG3j,
.nwelwgc4a9looYOYKG3j:focus,
.nwelwgc4a9looYOYKG3j:active {
  -webkit-box-shadow: 0 1px 0;
          box-shadow: 0 1px 0;
  padding-right: 1.5rem;
}

._7_SG387Gb67PJ3O97Bo5 {
  -webkit-box-shadow: 0 1px transparent;
          box-shadow: 0 1px transparent;
  padding-right: 1.5rem;
  -webkit-transition: -webkit-box-shadow 150ms ease-in-out;
  transition: -webkit-box-shadow 150ms ease-in-out;
  transition: box-shadow 150ms ease-in-out;
  transition: box-shadow 150ms ease-in-out, -webkit-box-shadow 150ms ease-in-out;
  min-width: 0;
  padding-bottom: 0.2rem;
}

._7_SG387Gb67PJ3O97Bo5:not(.VtG3uiXvx7bm_dyyNaVD):hover {
  -webkit-box-shadow: 0 1px 0;
          box-shadow: 0 1px 0;
}

._7_SG387Gb67PJ3O97Bo5 svg {
  right: 0;
  top: 0;
  opacity: 0;
  -webkit-transition: opacity 150ms ease-in-out;
  transition: opacity 150ms ease-in-out;
}

._7_SG387Gb67PJ3O97Bo5:not(.VtG3uiXvx7bm_dyyNaVD):hover svg {
  opacity: 1;
}

.hnhCGHcCJajz9rRU7QN7 {
  top: 0;
  right: -35px;

  width: 27px;
  height: 27px;

  color: var(--todo_ddd);
  font-size: 20px;
  line-height: 27px;
  text-align: center;

  border-radius: 3px;
}

.hnhCGHcCJajz9rRU7QN7:hover {
  color: var(--grayLight);
  background: rgba(0,0,0,0.05);
}

.vPGRIOKIUc1fT1hz0EXw {
  width: calc(100% - 22px);
  background: var(--white);
  color: var(--grayDark);
  border-radius: 0 0 0 2px;
}

.ToRZ6k8hnSXEEmNvp9sS {
  border-radius: 2px 0 0 0;
}

.mUVOeLbcMuSbcCJw9GsS {
  border-top: none;
  overflow: hidden;
}

.UVatfArUYiELhJsBSqOS {
  padding-top: 0.5rem;
  font-size: 0.75rem;
  padding-bottom: 0.5rem;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  pointer-events: auto;
  line-height: 1.5;
  border-radius: 2px;
}

.mz904qICdoHlwPJlPKOm {
  pointer-events: none;
  position: relative;
}

.mz904qICdoHlwPJlPKOm:before {
  position: absolute;
  right: 0.5rem;
  top: 50%;
  font-size: 0.8em;
  -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
          transform: translateY(-50%);
}

.UVatfArUYiELhJsBSqOS:focus,
.UVatfArUYiELhJsBSqOS:active,
.UVatfArUYiELhJsBSqOS:hover {
  outline: none;
}

.YLP_eCnPtAqV9e7asic2 .KOQL42en4zTe5VfOmL9l,
.KOQL42en4zTe5VfOmL9l {
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transition: -webkit-box-shadow 100ms linear;
  transition: -webkit-box-shadow 100ms linear;
  transition: box-shadow 100ms linear;
  transition: box-shadow 100ms linear, -webkit-box-shadow 100ms linear;
}

.YLP_eCnPtAqV9e7asic2:hover .KOQL42en4zTe5VfOmL9l,
.KOQL42en4zTe5VfOmL9l:hover {
  -webkit-box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
          box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
}

.JMYgNVmFe25lggLfXurp {
  -webkit-box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
          box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
}

._mqdCb2mvSuq8xI2zcNo:hover {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
  }

._mqdCb2mvSuq8xI2zcNo {
  -webkit-transition: scale 100ms ease-in-out;
  transition: scale 100ms ease-in-out;
}

.koQz4rnDwLGH3jSt5_CR:hover .ish0_ZWnYrEgMA0h_Ibh { 
  opacity: 1;
}

.ish0_ZWnYrEgMA0h_Ibh {
  opacity: 0;
  -webkit-transition: opacity 100ms ease-in-out;
  transition: opacity 100ms ease-in-out;
}

.mIAPWxAkn_lVBJriJxPV {
  opacity: 1;
}
.xHXkkIGPEO9XLcN4pwDu {
  -webkit-transition: -webkit-transform 100ms;
  transition: -webkit-transform 100ms;
  transition: transform 100ms;
  transition: transform 100ms, -webkit-transform 100ms;
}

.rvnZhaum9P_O8fje58Ju {
}

.rvnZhaum9P_O8fje58Ju:hover {
    -webkit-transform: translateY(-2px);
        -ms-transform: translateY(-2px);
            transform: translateY(-2px);
  }

.f1gFJlr8KwC7ROcd4fAp {
}

.f1gFJlr8KwC7ROcd4fAp:hover {
    -webkit-transform: translateX(-2px);
        -ms-transform: translateX(-2px);
            transform: translateX(-2px);
  }

.u0D75Lxl_iIFXK3ZDkP5 {
}

.u0D75Lxl_iIFXK3ZDkP5:hover {
    -webkit-transform: translateX(2px);
        -ms-transform: translateX(2px);
            transform: translateX(2px);
  }

.hugpKuSpmSwSUpnCPi4j > * {
  -webkit-transition: -webkit-transform 200ms;
  transition: -webkit-transform 200ms;
  transition: transform 200ms;
  transition: transform 200ms, -webkit-transform 200ms;
}

.hugpKuSpmSwSUpnCPi4j:hover > * {
  -webkit-transform: translateX(-2px);
      -ms-transform: translateX(-2px);
          transform: translateX(-2px);
}

.ksL6FJV8ySjva6QgbPha {
  -webkit-transition: opacity 10ms linear;
  transition: opacity 10ms linear;
  opacity: 0.8
}
.ksL6FJV8ySjva6QgbPha:hover {
    opacity: 1;
  }

.TvLh1d6QfEsbCphUcJTP *::-webkit-scrollbar {
  display: none;
}

.WJemOovcjm52MlmxLgqY {
  padding: 0 0.3rem;
}

.KuljTsJ1MNxb7qcYXNbV {}

.FaEL6zvJu_EW3QWKYGro {
}

.N93fOKS8Ipk2rLWuSWqM {
  border-width: 8px;
}

.ASkCNgmN9BTkHX23zc6v {
  -webkit-box-shadow: -4px 2px 5px rgba(0,0,0,0.1);
          box-shadow: -4px 2px 5px rgba(0,0,0,0.1);
}

.KTvXfSlFKuTloYj7mRJg {
  -webkit-box-shadow: 4px 2px 5px rgba(0,0,0,0.1);
          box-shadow: 4px 2px 5px rgba(0,0,0,0.1);
}

.FaEL6zvJu_EW3QWKYGro:first-of-type,
.N93fOKS8Ipk2rLWuSWqM + .FaEL6zvJu_EW3QWKYGro {
  border: none;
}

.HS2A3hRMy8b3ET1yLmQg {
  fill: var(--todo_eee);
  pointer-events: visible;
  -webkit-transition: all 50ms ease-in-out;
  transition: all 50ms ease-in-out;
}

.HS2A3hRMy8b3ET1yLmQg:hover, .ZdSLOJaHPWokhP9gcMaJ:hover {
  fill: var(--white);
  cursor: pointer;
}
.HS2A3hRMy8b3ET1yLmQg:hover:active {
  fill: var(--primary);
}

.Im5HyNDFF3S2KU7xgd00 {
  fill: var(--todo_aaa);
}

.k3RYij55_a1myxmxoYBd {
  stroke-width: 0.75;
  stroke: var(--grayDark);
}

.SK7ykZb1kZrt5WS8w9Ay {
  stroke-width: 0.75;
  stroke: var(--todo_8c8c8c);
}

.Kyxdzf0rkpzJ9BO41oLo {
  stroke: var(--grayLight);
}

.Im5HyNDFF3S2KU7xgd00:hover {
  fill: var(--grayLight);
}

.rLHPUrvrj4h78m1WJ7yO {
  border: 1px solid var(--grayDark);
}
.vvGr5hC5o1O4cBk7Bhgp {
  border: 1px solid var(--grayLight);
}

.FtZ5f93RIs4kJ4qrDjUX {
  -webkit-transition: -webkit-transform 100ms;
  transition: -webkit-transform 100ms;
  transition: transform 100ms;
  transition: transform 100ms, -webkit-transform 100ms;
}

.xSmHs23jrfBCZz5tGcXf {
}

.xSmHs23jrfBCZz5tGcXf:hover {
    -webkit-transform: translateX(-2px);
        -ms-transform: translateX(-2px);
            transform: translateX(-2px);
  }

.EDJw7wCw3i30R3VL4p8n {
}

.EDJw7wCw3i30R3VL4p8n:hover {
    -webkit-transform: translateX(2px);
        -ms-transform: translateX(2px);
            transform: translateX(2px);
  }

.vNmKF1rUqoPGVe8WQKi5 {
  border-radius: 50%;
  width: 0.8rem;
  height: 0.8rem;
  background-color: var(--gray);
  margin-left: 0.8rem;
  margin-right: 0.8rem;
  cursor: pointer;
}

.e_5sht8moW7rJ371JmNA {
  width: 1rem;
  height: 1rem;
  background-color: var(--primary);
}

.KW9pG1W3XYRCkAJmIKDd {
  width: 1rem;
  height: 1rem;
  background-color: var(--secondary);
}
.Dc_yNDDKbrWEwbF2I8_8 {
  border-bottom: 1px solid #f2f2f2;
  font-size: 14px;
}
.Dc_yNDDKbrWEwbF2I8_8:hover {
  background-color: #ededed;
  cursor: pointer;
}
.dTGZeTyQGRzks0sC9LIs:focus {
  outline-color: auto;
}

.dTGZeTyQGRzks0sC9LIs:hover {
  border-top: 1px solid var(--secondary);
  border-bottom: 1px solid var(--secondary);
}
.ZgNSHfl_M1kvt2IfYO6g .RTuLrioTIH4pwPdJljZ1,
.RTuLrioTIH4pwPdJljZ1 {
  -webkit-box-shadow: none;
          box-shadow: none;
  -webkit-transition: -webkit-box-shadow 100ms linear;
  transition: -webkit-box-shadow 100ms linear;
  transition: box-shadow 100ms linear;
  transition: box-shadow 100ms linear, -webkit-box-shadow 100ms linear;
}

.ZgNSHfl_M1kvt2IfYO6g:hover .RTuLrioTIH4pwPdJljZ1,
.RTuLrioTIH4pwPdJljZ1:hover {
  -webkit-box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
          box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
}

.rzTlYjtUaUBSoC5mPmoq {
  -webkit-box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
          box-shadow: inset 0 0 0 2px var(--grayDark), inset 0 0 0 5px var(--white);
}

.mDcarVsbL1SY5QTq0v4g:hover {
  -webkit-transform: scale(1.1);
      -ms-transform: scale(1.1);
          transform: scale(1.1);
  }

.mDcarVsbL1SY5QTq0v4g {
  -webkit-transition: scale 100ms ease-in-out;
  transition: scale 100ms ease-in-out;
}
.YssDA9obqfrIiHJ4Put1 {
    white-space: wrap; 
    overflow: show;
  }

._zq0gW2XarmL4lQjL6LQ:focus {
  outline-color: auto;
}

._zq0gW2XarmL4lQjL6LQ:hover {
  border-top: 1px solid var(--primary);
  border-bottom: 1px solid var(--primary);
}
.nhN4j_qXiN4aWx6yJwAb {
  height: 403px;
  width: 240px;
  border: 1px solid var(--grayLight);
  border-radius: 2px;
}
.Bw1eT7SU2XjiLHXb5RK4:focus {
  outline-color: auto;
}

.Bw1eT7SU2XjiLHXb5RK4:hover {
  border-top: 1px solid var(--primary);
  border-bottom: 1px solid var(--primary);
}

.sz8nSOQDJzC2NEman1_w {
  background: var(--secondaryLighter);
}

.fVfBLst8DkEPnieBviNt:focus {
  outline-color: auto;
}

.eJIKFwNAlwgCd4CtE2_X {
  -webkit-transition: -webkit-transform 100ms;
  transition: -webkit-transform 100ms;
  transition: transform 100ms;
  transition: transform 100ms, -webkit-transform 100ms;
}

.f9tZF6pk5HLBBkW6OPb6 {
}

.f9tZF6pk5HLBBkW6OPb6:hover {
    -webkit-transform: translateY(-2px);
        -ms-transform: translateY(-2px);
            transform: translateY(-2px);
  }

/*# sourceMappingURL=main.dac9e17e.css.map*/