*, *:before, *:after {
  box-sizing: border-box; }

  img {
    display: block;
    max-width: 100%; }

    body {
      background: rgba(77, 82, 89, 0.075);
      color: #4d5259;
      font-family: 'Noto Sans', sans-serif;
      font-size: 16px;
      font-weight: 400;
      line-height: 1.618;
      padding-bottom: 4.854em;
      text-rendering: optimizeLegibility; }

      nav ul {
        margin: 0;
        padding: 0; }

        nav li {
          border-radius: 2px;
          list-style: none;
          margin: 0;
          padding: 0.35em;
          -webkit-transition: background 300ms ease;
          -moz-transition: background 300ms ease;
          -ms-transition: background 300ms ease;
          -o-transition: background 300ms ease;
          transition: background 300ms ease; }

          li#uninvolved img {
            -moz-transform: rotate(180deg);
            -webkit-transform: rotate(180deg);
            -o-transform: rotate(180deg);
            -ms-transform: rotate(180deg);
            transform: rotate(180deg); }

            li#delta_low {
              padding: 0.55em; }

              li#clear {
                padding: 0.575em; }

                li#download {
                  padding: 0.45em; }

                  li:hover, li.selected {
                    background: white;
                    -webkit-box-shadow: 0 0 1px 0 rgba(77, 82, 89, 0.1);
                    box-shadow: 0 0 3px 0 rgba(77, 82, 89, 0.1);
                    cursor: pointer; }

                    .wrapper, #ui {
                      margin: 0 auto;
                      max-width: 1200px;
                      padding: 0 2.427em; }

                      #ui {
                        display: none;
                        margin-top: 1.309em; }

                        .grid {
                          display: grid;
                          grid-gap: 2.424em;
                          grid-template-columns: 32px 16fr 9fr;
                          margin-top: 1.618em; }

                          #response {
                            color: rgba(77, 82, 89, 0.8);
                            font-family: 'Lusitana', serif;
                            font-size: 1.5em; }

                            #response p {
                              margin: 0 0 1.309em 0; }

                              span {
                                -webkit-transition: all 300ms ease;
                                -moz-transition: all 300ms ease;
                                -ms-transition: all 300ms ease;
                                -o-transition: all 300ms ease;
                                transition: all 300ms ease; }

                                .highlight {
                                  background-color: white;
                                  border-bottom: 2px solid #708090;
                                  color: #4d5259;
                                  margin-bottom: -2px; }

                                  .b_high .highlight {
                                    border-bottom-color: darkblue; }

                                    .b_low .highlight {
                                      border-bottom-color: dodgerblue;
                                      border-bottom-style: dotted; }

                                      .congruent .highlight, .delta .highlight {
                                        border-bottom-color: dimgray;
                                        border-bottom-style: dotted; }

                                        .involvement .highlight {
                                          border-bottom-color: REBECCAPURPLE; }

                                          .uninvolved .highlight {
                                            border-bottom-color: mediumpurple;
                                            border-bottom-style: dotted; }

                                            .r_high .highlight {
                                              border-bottom-color: crimson; }

                                              .r_low .highlight {
                                                border-bottom-color: lightcoral;
                                                border-bottom-style: dotted; }

                                                .crossed .highlight, .delta_low .highlight {
                                                  border-bottom-color: dimgray; }

                                                  .b_dominant .highlight {
                                                    border-bottom-color: darkblue;
                                                    border-bottom-style: dashed; }

                                                    .r_dominant .highlight {
                                                      border-bottom-color: crimson;
                                                      border-bottom-style: dashed; }

                                                      #definitions dl {
                                                        background: white;
                                                        margin: 0; }

                                                        #definitions dt, #definitions dd {
                                                          display: none;
                                                          padding-left: 1.309em;
                                                          padding-right: 1.309em; }

                                                          #definitions dt {
                                                            font-weight: 700;
                                                            margin: 0;
                                                            padding-top: 1.309em; }

                                                            #definitions dd {
                                                              margin: 0.1545em 0 0;
                                                              padding-bottom: 1.309em; }

                                                              #definitions dd em {
                                                                font-style: normal;
                                                                text-decoration: underline; }

                                                                #granularity dt, #granularity dd {
                                                                  margin: 0;
                                                                  display: inline-block; }

                                                                  #granularity dt {
                                                                    font-weight: 700;
                                                                    padding: 0; }

                                                                    #granularity dd {
                                                                      padding: 0 1em 0 0; }

                                                                      label {
                                                                        font-size: 0.85em;
                                                                        letter-spacing: 1px;
                                                                        text-transform: uppercase; }

                                                                        #submit_container {
                                                                          margin: 1em 0; }

                                                                          input {
                                                                            display: block; }

                                                                            textarea {
                                                                              background: white;
                                                                              border: 2px solid rgba(77, 82, 89, 0.35);
                                                                              height: 10em;
                                                                              line-height: 1.309;
                                                                              padding: 1.309em;
                                                                              width: 100%; }

                                                                              form button {
                                                                                background: #4d5259;
                                                                                border: 0;
                                                                                color: white;
                                                                                cursor: pointer;
                                                                                display: block;
                                                                                font-size: 0.85em;
                                                                                line-height: 1;
                                                                                padding: 1em 3em;
                                                                                text-transform: uppercase; }

                                                                                button[disabled=disabled] {
                                                                                  background: rgba(77, 82, 89, 0.7);
                                                                                  color: rgba(255, 255, 255, 0.7);
                                                                                  cursor: not-allowed; }

                                                                                  .error_message {
                                                                                    color: darkred;
                                                                                    margin: -1em 0 0.25em; }

                                                                                    input:focus, select:focus, textarea:focus, button:focus, .noUi-handle {
                                                                                      outline: none; }

                                                                                      #ngram, #granularity {
                                                                                        font-size: 0.85em; }

                                                                                        #ngram {
                                                                                          background: transparent;
                                                                                          border: 0;
                                                                                          padding: 0; }

                                                                                          #granularity {
                                                                                            margin: 0;
                                                                                            position: relative;
                                                                                            top: 0.35em; }

                                                                                            #ngram_control {
                                                                                              width: 80%; }

                                                                                              #granularity_control {
                                                                                                width: 400px; }

                                                                                                #ngram_display, #granularity_display {
                                                                                                  margin: 0.5em 0; }

                                                                                                  #report {
                                                                                                    display: none;
                                                                                                    margin: 2.618em auto; }

                                                                                                    .auth-submitted {
                                                                                                      margin: 1em auto;
                                                                                                      padding: 0 0.75em;
                                                                                                      max-width: 800px; }

                                                                                                      #authentication {
                                                                                                        background: #4D5258;
                                                                                                        color: white;
                                                                                                        padding: 0.5em;
                                                                                                        margin: 0 0 0.5em;
                                                                                                        text-align: center; }
                                                                                                        #authentication a {
                                                                                                          color: #ffc; }

table.session_display {
  border-collapse: collapse;
  margin: 2em auto; }
  table.session_display th, table.session_display td {
    border: 1px solid #7d858e;
    padding: 0.5em 0.75em;
    text-align: left; }

#copy {
  vertical-align: middle; }
  #copy span, #copy img {
    display: inline-block;
    vertical-align: middle; }
    #copy span {
      margin-bottom: 2px; }

.copy-icon img {
  width: 15px;
  opacity: 70%; }
  .copy-icon img:hover {
    cursor: pointer;
    opacity: 100%; }

.checkmark {
  display: none;
  width: 15px; }

.noUi-target, .noUi-target * {
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  -ms-touch-action: none;
  touch-action: none;
  -ms-user-select: none;
  -moz-user-select: none;
  user-select: none;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

  .noUi-target {
    position: relative;
    direction: ltr; }

    .noUi-base, .noUi-connects {
      width: 100%;
      height: 100%;
      position: relative;
      z-index: 1; }

      .noUi-connects {
        overflow: hidden;
        z-index: 0; }

        .noUi-connect, .noUi-origin {
          will-change: transform;
          position: absolute;
          z-index: 1;
          top: 0;
          left: 0;
          height: 100%;
          width: 100%;
          -ms-transform-origin: 0 0;
          -webkit-transform-origin: 0 0;
          -webkit-transform-style: preserve-3d;
          transform-origin: 0 0;
          transform-style: flat; }

          html:not([dir=rtl]) .noUi-horizontal .noUi-origin {
            left: auto;
            right: 0; }

            .noUi-vertical .noUi-origin {
              width: 0; }

              .noUi-horizontal .noUi-origin {
                height: 0; }

                .noUi-handle {
                  -webkit-backface-visibility: hidden;
                  backface-visibility: hidden;
                  position: absolute; }

                  .noUi-touch-area {
                    height: 100%;
                    width: 100%; }

                    .noUi-state-tap .noUi-connect, .noUi-state-tap .noUi-origin {
                      -webkit-transition: transform 0.3s;
                      transition: transform 0.3s; }

                      .noUi-state-drag * {
                        cursor: inherit !important; }

                        .noUi-horizontal {
                          height: 18px; }

                          .noUi-horizontal .noUi-handle {
                            width: 34px;
                            height: 28px;
                            left: -17px;
                            top: -6px; }

                            .noUi-vertical {
                              width: 18px; }

                              .noUi-vertical .noUi-handle {
                                width: 28px;
                                height: 34px;
                                left: -6px;
                                top: -17px; }

                                html:not([dir=rtl]) .noUi-horizontal .noUi-handle {
                                  right: -17px;
                                  left: auto; }

                                  .noUi-target {
                                    background: #FAFAFA;
                                    border-radius: 4px;
                                    border: 1px solid #D3D3D3;
                                    box-shadow: inset 0 1px 1px #F0F0F0, 0 3px 6px -5px #BBB; }

                                    .noUi-connects {
                                      border-radius: 3px; }

                                      .noUi-connect {
                                        background: #3FB8AF; }

                                        .noUi-draggable {
                                          cursor: ew-resize; }

                                          .noUi-vertical .noUi-draggable {
                                            cursor: ns-resize; }

                                            .noUi-handle {
                                              border: 1px solid #D9D9D9;
                                              border-radius: 3px;
                                              background: #FFF;
                                              cursor: default;
                                              box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #EBEBEB, 0 3px 6px -3px #BBB; }

                                              .noUi-active {
                                                box-shadow: inset 0 0 1px #FFF, inset 0 1px 7px #DDD, 0 3px 6px -3px #BBB; }

                                                .noUi-handle:after, .noUi-handle:before {
                                                  content: "";
                                                  display: block;
                                                  position: absolute;
                                                  height: 14px;
                                                  width: 1px;
                                                  background: #E8E7E6;
                                                  left: 14px;
                                                  top: 6px; }

                                                  .noUi-handle:after {
                                                    left: 17px; }

                                                    .noUi-vertical .noUi-handle:after, .noUi-vertical .noUi-handle:before {
                                                      width: 14px;
                                                      height: 1px;
                                                      left: 6px;
                                                      top: 14px; }

                                                      .noUi-vertical .noUi-handle:after {
                                                        top: 17px; }

                                                        [disabled] .noUi-connect {
                                                          background: #B8B8B8; }

                                                          [disabled] .noUi-handle, [disabled].noUi-handle, [disabled].noUi-target {
                                                            cursor: not-allowed; }

                                                            .noUi-pips, .noUi-pips * {
                                                              -moz-box-sizing: border-box;
                                                              box-sizing: border-box; }

                                                              .noUi-pips {
                                                                position: absolute;
                                                                color: #999; }

                                                                .noUi-value {
                                                                  position: absolute;
                                                                  white-space: nowrap;
                                                                  text-align: center; }

                                                                  .noUi-value-sub {
                                                                    color: #ccc;
                                                                    font-size: 10px; }

                                                                    .noUi-marker {
                                                                      position: absolute;
                                                                      background: #CCC; }

                                                                      .noUi-marker-sub {
                                                                        background: #AAA; }

                                                                        .noUi-marker-large {
                                                                          background: #AAA; }

                                                                          .noUi-pips-horizontal {
                                                                            padding: 10px 0;
                                                                            height: 80px;
                                                                            top: 100%;
                                                                            left: 0;
                                                                            width: 100%; }

                                                                            .noUi-value-horizontal {
                                                                              -webkit-transform: translate(-50%, 50%);
                                                                              transform: translate(-50%, 50%); }

                                                                              .noUi-rtl .noUi-value-horizontal {
                                                                                -webkit-transform: translate(50%, 50%);
                                                                                transform: translate(50%, 50%); }

                                                                                .noUi-marker-horizontal.noUi-marker {
                                                                                  margin-left: -1px;
                                                                                  width: 2px;
                                                                                  height: 5px; }

                                                                                  .noUi-marker-horizontal.noUi-marker-sub {
                                                                                    height: 10px; }

                                                                                    .noUi-marker-horizontal.noUi-marker-large {
                                                                                      height: 15px; }

                                                                                      .noUi-pips-vertical {
                                                                                        padding: 0 10px;
                                                                                        height: 100%;
                                                                                        top: 0;
                                                                                        left: 100%; }

                                                                                        .noUi-value-vertical {
                                                                                          -webkit-transform: translate(0, -50%);
                                                                                          transform: translate(0, -50%);
                                                                                          padding-left: 25px; }

                                                                                          .noUi-rtl .noUi-value-vertical {
                                                                                            -webkit-transform: translate(0, 50%);
                                                                                            transform: translate(0, 50%); }

                                                                                            .noUi-marker-vertical.noUi-marker {
                                                                                              width: 5px;
                                                                                              height: 2px;
                                                                                              margin-top: -1px; }

                                                                                              .noUi-marker-vertical.noUi-marker-sub {
                                                                                                width: 10px; }

                                                                                                .noUi-marker-vertical.noUi-marker-large {
                                                                                                  width: 15px; }

                                                                                                  .noUi-tooltip {
                                                                                                    display: block;
                                                                                                    position: absolute;
                                                                                                    border: 1px solid #D9D9D9;
                                                                                                    border-radius: 3px;
                                                                                                    background: #fff;
                                                                                                    color: #000;
                                                                                                    padding: 5px;
                                                                                                    text-align: center;
                                                                                                    white-space: nowrap; }

                                                                                                    .noUi-horizontal .noUi-tooltip {
                                                                                                      -webkit-transform: translate(-50%, 0);
                                                                                                      transform: translate(-50%, 0);
                                                                                                      left: 50%;
                                                                                                      bottom: 120%; }

                                                                                                      .noUi-vertical .noUi-tooltip {
                                                                                                        -webkit-transform: translate(0, -50%);
                                                                                                        transform: translate(0, -50%);
                                                                                                        top: 50%;
                                                                                                        right: 120%; }

.flashes {
  color: white;
  padding: 0;
  margin: 1em 0;
  text-align: center; }
  .flashes li {
    list-style: none;
    margin: 0;
    padding: 0.25em 1em; }
    .flashes .message {
      background: #5f6736; }
      .flashes .error {
        background: #c20000; }