/* Brand color palette */
/* Content width */
/* Mixins */
.authorised #container {
  background: transparent; }
.authorised h1 {
  margin-bottom: 20px;
  font-size: 36px;
  letter-spacing: normal;
  line-height: normal;
  text-align: center;
  text-transform: none; }
.authorised h2 {
  font-family: 'DIN Bold', sans-serif;
  font-size: 30px;
  text-align: center; }
.authorised h3 {
  font-size: 26px;
  font-family: 'DIN Med', sans-serif;
  text-transform: none;
  letter-spacing: normal; }
.authorised p {
  margin-top: 0;
  font-family: 'DIN', sans-serif;
  line-height: normal; }
.authorised a {
  word-break: break-word;
  color: #5e0d8b;
  -moz-transition: color 0.2s ease-out;
  -o-transition: color 0.2s ease-out;
  -webkit-transition: color 0.2s ease-out;
  transition: color 0.2s ease-out; }
.authorised .code {
  display: inline-table;
  padding: 6px;
  font-family: Courier, 'Courier New', 'Letter Gothic Std', Consolas, sans-serif;
  font-size: 0.75em;
  border: none;
  border-radius: 3px;
  line-height: 0.75em;
  white-space: nowrap;
  cursor: text;
  background: rgba(218, 214, 223, 0.5);
  -webkit-box-shadow: inset 0 0 2px #5b5377;
  -moz-box-shadow: inset 0 0 2px #5b5377;
  box-shadow: inset 0 0 2px #5b5377; }
.authorised button,
.authorised .button {
  display: block;
  width: auto;
  margin: 0;
  padding: 12px 30px;
  border: none;
  border-radius: 0;
  outline: none;
  font-family: 'DIN Bold', sans-serif;
  font-size: 20px;
  text-decoration: none;
  text-align: center;
  background: #fff;
  color: #2f1a45;
  cursor: pointer;
  opacity: 1;
  -moz-transition: background 0.1s ease-out;
  -o-transition: background 0.1s ease-out;
  -webkit-transition: background 0.1s ease-out;
  transition: background 0.1s ease-out; }
  .authorised button:active, .authorised button:hover,
  .authorised .button:active,
  .authorised .button:hover {
    background: #e2e0e9; }
  .authorised button.loading,
  .authorised .button.loading {
    background: #fff url(/assets/img/spinner-purple.svg) center center no-repeat;
    background-size: 30px;
    color: transparent;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none; }
  .authorised button.purple,
  .authorised .button.purple {
    background: #5e0d8b;
    color: #fff; }
    .authorised button.purple:active, .authorised button.purple:hover,
    .authorised .button.purple:active,
    .authorised .button.purple:hover {
      background: #3e095c; }
    .authorised button.purple[disabled],
    .authorised .button.purple[disabled] {
      background: #5e0d8b; }
    .authorised button.purple.loading,
    .authorised .button.purple.loading {
      background: #5e0d8b url(/assets/img/spinner-white.svg) center center no-repeat;
      background-size: 30px;
      color: transparent; }
  .authorised button.debugger-btn,
  .authorised .button.debugger-btn {
    display: inline-table;
    width: auto;
    margin: 0 20px 50px 0;
    font-family: 'DIN Med', sans-serif; }
  .authorised button[disabled],
  .authorised .button[disabled] {
    opacity: .4;
    background-color: #fff;
    cursor: default;
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none; }
.authorised #freshwidget-button {
  display: block !important;
  right: 25px;
  height: 44px;
  width: 44px;
  z-index: 5; }
  .authorised #freshwidget-button a {
    display: block;
    position: static;
    height: 100%;
    width: 100%;
    border-radius: 100%;
    background: #5b5377 url(/assets/img/envelope.svg) center center no-repeat;
    background-size: 20px;
    -webkit-box-shadow: 0 0 1px #5b5377;
    -moz-box-shadow: 0 0 1px #5b5377;
    box-shadow: 0 0 1px #5b5377;
    -webkit-transition: -webkit-box-shadow .2s ease;
    -moz-transition: -moz-box-shadow .2s ease;
    -o-transition: -o-box-shadow .2s ease;
    transition: box-shadow .2s ease; }
    .authorised #freshwidget-button a img {
      display: none; }
    .authorised #freshwidget-button a:hover {
      -webkit-box-shadow: 0 0 5px #5b5377;
      -moz-box-shadow: 0 0 5px #5b5377;
      box-shadow: 0 0 5px #5b5377; }
.authorised .widget-ovelay {
  opacity: 1;
  background: rgba(0, 0, 0, 0.4); }

#dashboard {
  width: 100%;
  padding: 0; }
  #dashboard a:hover {
    color: #3e095c; }
  #dashboard #wrapper {
    display: table;
    width: 1366px;
    margin: 0 auto; }
  #dashboard .info-message {
    position: fixed;
    top: -36px;
    z-index: 7;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out; }
    #dashboard .info-message.enter {
      -webkit-transform: translateY(36px);
      -moz-transform: translateY(36px);
      -ms-transform: translateY(36px);
      -o-transform: translateY(36px);
      transform: translateY(36px); }
  #dashboard .icons-holder {
    position: relative;
    float: left;
    height: 58px;
    width: 58px;
    margin-right: 30px;
    background: url(/assets/img/msg-icon-dark.svg) center center no-repeat; }
    #dashboard .icons-holder img {
      position: absolute;
      bottom: 0;
      right: -14px;
      max-width: 28px;
      max-height: 28px; }
  #dashboard .overlay {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.07);
    z-index: 9; }
  #dashboard .modal {
    display: table;
    position: fixed;
    left: 50%;
    top: 35%;
    width: auto;
    max-width: 640px;
    margin: 0 auto;
    border-radius: 6px;
    overflow: hidden;
    background: #F9FAFB;
    z-index: 10;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%); }
    #dashboard .modal h1 {
      margin: 0;
      font-size: 22px; }
    #dashboard .modal .modal-header {
      position: relative;
      padding: 15px 50px 15px 20px;
      border-bottom: 1px solid #ccc;
      background: #F9FAFB;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      #dashboard .modal .modal-header:after {
        bottom: 0; }
    #dashboard .modal .modal-body {
      position: relative;
      max-height: 550px;
      padding: 15px;
      overflow-y: auto;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
    #dashboard .modal .modal-footer {
      position: relative;
      display: table;
      width: 100%;
      padding: 15px;
      border-top: 1px solid #ccc;
      background: #F9FAFB;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      #dashboard .modal .modal-footer:before {
        top: 0; }
    #dashboard .modal .modal-header:after,
    #dashboard .modal .modal-footer:before {
      content: "";
      position: absolute;
      left: 0;
      right: 0;
      height: 50%;
      width: 100%;
      box-shadow: 0 0 30px rgba(0, 0, 0, 0.15);
      -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.15);
      -moz-box-shadow: 0 0 30px rgba(0, 0, 0, 0.15);
      border-radius: 100%;
      z-index: -1; }
    #dashboard .modal .close {
      right: 14px;
      top: 16px; }
    #dashboard .modal .buttons {
      width: 100%;
      text-align: center; }
      #dashboard .modal .buttons button {
        display: inline-block;
        min-width: 95px; }
      #dashboard .modal .buttons .confirm-btn {
        margin-left: 40px; }
  #dashboard .error-message {
    margin-top: 8px;
    color: #e2231a; }
  #dashboard #bot-details label,
  #dashboard #account label,
  #dashboard #add-bot-wrapper label {
    display: inline-block;
    margin: 24px 0 8px 12px;
    font-family: 'DIN Med', sans-serif;
    font-size: 22px; }
    #dashboard #bot-details label a,
    #dashboard #account label a,
    #dashboard #add-bot-wrapper label a {
      font-family: 'DIN Bold', sans-serif; }
  #dashboard #bot-details input,
  #dashboard #account input,
  #dashboard #add-bot-wrapper input {
    width: 100%;
    padding: 7px 14px 8px;
    border: none;
    outline: none;
    font-size: 20px;
    background: #fff;
    color: #000;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    #dashboard #bot-details input::-webkit-input-placeholder,
    #dashboard #account input::-webkit-input-placeholder,
    #dashboard #add-bot-wrapper input::-webkit-input-placeholder {
      color: rgba(0, 0, 0, 0.25); }
    #dashboard #bot-details input:-moz-placeholder,
    #dashboard #account input:-moz-placeholder,
    #dashboard #add-bot-wrapper input:-moz-placeholder {
      /* Firefox 18- */
      color: rgba(0, 0, 0, 0.25); }
    #dashboard #bot-details input::-moz-placeholder,
    #dashboard #account input::-moz-placeholder,
    #dashboard #add-bot-wrapper input::-moz-placeholder {
      /* Firefox 19+ */
      color: rgba(0, 0, 0, 0.25); }
    #dashboard #bot-details input:-ms-input-placeholder,
    #dashboard #account input:-ms-input-placeholder,
    #dashboard #add-bot-wrapper input:-ms-input-placeholder {
      color: rgba(0, 0, 0, 0.25); }
    #dashboard #bot-details input[type=checkbox],
    #dashboard #account input[type=checkbox],
    #dashboard #add-bot-wrapper input[type=checkbox] {
      margin: 0 6px 0 0; }
    #dashboard #bot-details input.invalid,
    #dashboard #account input.invalid,
    #dashboard #add-bot-wrapper input.invalid {
      -webkit-box-shadow: 0 0 2px 0 red;
      -moz-box-shadow: 0 0 2px 0 red;
      box-shadow: 0 0 2px 0 red; }
  #dashboard #bots {
    display: table;
    width: 100%; }
    #dashboard #bots .bot-name {
      display: inline-block;
      font-family: 'DIN Bold', sans-serif;
      font-size: 30px; }
    #dashboard #bots #no-bots {
      padding-top: 40px; }
      #dashboard #bots #no-bots p {
        width: 88%;
        margin: 20px auto 25px;
        line-height: 30px;
        font-size: 22px; }
      #dashboard #bots #no-bots .icon {
        height: 113px;
        width: 151px;
        margin: 0 auto 32px;
        background: url(/assets/img/add-icon-purple.svg) center center no-repeat; }
    #dashboard #bots #bots-list {
      padding-top: 40px; }
      #dashboard #bots #bots-list ul {
        margin: 28px 0 0 0;
        padding: 0; }
      #dashboard #bots #bots-list li {
        display: table;
        position: relative;
        width: 100%;
        padding: 15px 0 7px 15px;
        border-top: 1px solid #ccc;
        line-height: 60px;
        background: #fff;
        cursor: pointer;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box; }
        #dashboard #bots #bots-list li:first-child {
          border-top: none; }
        #dashboard #bots #bots-list li .view-details {
          position: absolute;
          right: 30px;
          top: 50%;
          font-family: 'DIN Bold', sans-serif;
          font-size: 22px;
          color: #5e0d8b;
          cursor: pointer;
          -webkit-transform: translateY(-50%);
          -moz-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          -o-transform: translateY(-50%);
          transform: translateY(-50%); }
    #dashboard #bots .info-text {
      margin-top: 45px;
      font-size: 22px; }
      #dashboard #bots .info-text img {
        position: relative;
        top: -5px;
        float: left;
        max-width: 82px;
        margin: 0 14px 0 15px; }
      #dashboard #bots .info-text .copy {
        display: inline-block;
        max-width: calc(100% - 100px);
        padding-top: 10px; }
      #dashboard #bots .info-text .link {
        font-family: 'DIN Med', sans-serif;
        text-decoration: underline;
        cursor: pointer; }
    #dashboard #bots .more-platforms {
      margin: 24px 0 0 112px;
      font-size: 18px;
      cursor: pointer; }
      #dashboard #bots .more-platforms a {
        font-family: 'DIN Med', sans-serif;
        text-decoration: underline;
        color: #2f1a45;
        word-break: normal;
        -moz-transition: color 0.15s linear;
        -o-transition: color 0.15s linear;
        -webkit-transition: color 0.15s linear;
        transition: color 0.15s linear; }
        #dashboard #bots .more-platforms a:hover {
          color: #160c20; }
    #dashboard #bots .add-bot-btn {
      margin-bottom: 50px; }
      #dashboard #bots .add-bot-btn.center {
        float: none;
        margin: 50px auto; }
  #dashboard #bot-details {
    padding: 40px 0; }
    #dashboard #bot-details h1.icons-header {
      display: table;
      margin: 0 auto 60px;
      line-height: 60px; }
    #dashboard #bot-details h2 {
      text-align: left; }
    #dashboard #bot-details .icons-holder {
      margin-right: 24px; }
    #dashboard #bot-details button {
      display: inline-block; }
    #dashboard #bot-details .invalid-bot {
      font-size: 24px;
      text-align: center; }
    #dashboard #bot-details .approval-message {
      margin: 30px 0 15px;
      padding: 18px 10px;
      font-family: 'DIN Med', sans-serif;
      font-size: 18px;
      text-align: center;
      background: #5e0d8b;
      color: #fff;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
      #dashboard #bot-details .approval-message a {
        color: #fff; }
    #dashboard #bot-details .platform-definitions-container input[type=checkbox] {
      width: auto;
      margin-left: 12px; }
    #dashboard #bot-details #platforms .platform-img {
      height: 70px;
      width: 70px;
      padding-bottom: 60px; }
    #dashboard #bot-details .bot-settings {
      margin-bottom: 35px; }
    #dashboard #bot-details .slack-bot-name {
      padding-top: 20px; }
      #dashboard #bot-details .slack-bot-name label {
        display: block; }
      #dashboard #bot-details .slack-bot-name input {
        float: left;
        max-width: 300px;
        margin-right: 10px; }
      #dashboard #bot-details .slack-bot-name button {
        padding: 9px 16px;
        font-size: 18px; }
        #dashboard #bot-details .slack-bot-name button.loading {
          background-size: 20px; }
  #dashboard #account {
    padding: 40px 0; }
    #dashboard #account .personal-details {
      display: table;
      width: 400px;
      margin: 0 auto 60px; }
      #dashboard #account .personal-details input {
        max-width: 400px; }
        #dashboard #account .personal-details input::-webkit-input-placeholder {
          color: #000; }
        #dashboard #account .personal-details input:-moz-placeholder {
          /* Firefox 18- */
          color: #000; }
        #dashboard #account .personal-details input::-moz-placeholder {
          /* Firefox 19+ */
          color: #000; }
        #dashboard #account .personal-details input:-ms-input-placeholder {
          color: #000; }
        #dashboard #account .personal-details input#first-name::-webkit-input-placeholder, #dashboard #account .personal-details input#last-name::-webkit-input-placeholder, #dashboard #account .personal-details input#company::-webkit-input-placeholder, #dashboard #account .personal-details input#website::-webkit-input-placeholder {
          color: rgba(0, 0, 0, 0.25); }
        #dashboard #account .personal-details input#first-name:-moz-placeholder, #dashboard #account .personal-details input#last-name:-moz-placeholder, #dashboard #account .personal-details input#company:-moz-placeholder, #dashboard #account .personal-details input#website:-moz-placeholder {
          /* Firefox 18- */
          color: rgba(0, 0, 0, 0.25); }
        #dashboard #account .personal-details input#first-name::-moz-placeholder, #dashboard #account .personal-details input#last-name::-moz-placeholder, #dashboard #account .personal-details input#company::-moz-placeholder, #dashboard #account .personal-details input#website::-moz-placeholder {
          /* Firefox 19+ */
          color: rgba(0, 0, 0, 0.25); }
        #dashboard #account .personal-details input#first-name:-ms-input-placeholder, #dashboard #account .personal-details input#last-name:-ms-input-placeholder, #dashboard #account .personal-details input#company:-ms-input-placeholder, #dashboard #account .personal-details input#website:-ms-input-placeholder {
          color: rgba(0, 0, 0, 0.25); }
      #dashboard #account .personal-details #password-text {
        -webkit-text-security: disc; }
    #dashboard #account .save-btn {
      width: 150px;
      margin: 0 auto; }
    #dashboard #account .modal label {
      margin: 0 0 12px 0; }
    #dashboard #account .modal button {
      width: 145px;
      margin: 0 15px; }
  #dashboard #debugger {
    display: table;
    width: 100%;
    padding: 40px 0; }
    #dashboard #debugger .debugger-toggle {
      float: left;
      margin: 20px 0 0; }
    #dashboard #debugger .refresh-info {
      float: left;
      width: 100%;
      margin-top: -10px;
      font-size: 16px; }
    #dashboard #debugger .back-to-bot {
      float: right;
      width: auto;
      margin: 30px 0 0;
      padding: 15px; }
    #dashboard #debugger .no-data {
      margin-top: 15px;
      font-size: 18px; }
    #dashboard #debugger h2 {
      display: inline-table; }
    #dashboard #debugger .modal p {
      margin: 5px 0 25px; }
    #dashboard #debugger .modal button {
      margin-left: 10px; }
    #dashboard #debugger .download-csv {
      display: inline-table;
      margin-left: 20px;
      padding-right: 20px;
      white-space: nowrap;
      color: #00add8;
      -moz-transition: color 0.2s ease;
      -o-transition: color 0.2s ease;
      -webkit-transition: color 0.2s ease;
      transition: color 0.2s ease; }
      #dashboard #debugger .download-csv:hover {
        color: #0084a5; }
      #dashboard #debugger .download-csv.disabled {
        pointer-events: none;
        opacity: .55;
        background: url(/assets/img/spinner-purple.svg) right center no-repeat;
        background-size: 15px; }
    #dashboard #debugger .log-data {
      clear: both;
      padding-top: 50px; }
      #dashboard #debugger .log-data h2 {
        margin: 0;
        text-align: left; }
    #dashboard #debugger .row-info {
      display: block;
      padding: 10px 0 20px; }
    #dashboard #debugger .table-container {
      display: table;
      position: relative;
      width: 100%; }
      #dashboard #debugger .table-container .table-overlay {
        display: none;
        position: absolute;
        height: 100%;
        width: 100%;
        background: rgba(255, 255, 255, 0.35) url(/assets/img/spinner-purple.svg) center center no-repeat;
        background-size: 35px;
        z-index: 1; }
      #dashboard #debugger .table-container.change-page .table-overlay {
        display: block; }
    #dashboard #debugger #latest-activity {
      width: 100%;
      margin-bottom: 10px;
      text-align: left;
      border-collapse: collapse;
      background: #fff;
      -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
      -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
      box-shadow: 0 0 15px rgba(0, 0, 0, 0.15); }
      #dashboard #debugger #latest-activity thead {
        font-family: 'DIN Med', sans-serif;
        font-size: 18px;
        line-height: 26px;
        background: #5e0d8b;
        color: #fff; }
      #dashboard #debugger #latest-activity tr {
        cursor: pointer;
        -webkit-transition: -webkit-box-shadow .2s ease;
        -moz-transition: -moz-box-shadow .2s ease;
        -o-transition: -o-box-shadow .2s ease;
        transition: box-shadow .2s ease; }
        #dashboard #debugger #latest-activity tr:hover {
          -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
          -moz-box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
          box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); }
      #dashboard #debugger #latest-activity th, #dashboard #debugger #latest-activity td {
        padding: 5px 10px;
        border: 1px solid #dad6df; }
    #dashboard #debugger .latest-installations {
      table-layout: fixed; }
      #dashboard #debugger .latest-installations td {
        word-wrap: break-word; }
    #dashboard #debugger .nav-buttons button {
      display: inline-table;
      width: 110px;
      margin: 10px 10px 10px 0;
      padding: 10px 20px;
      font-family: 'DIN Med', sans-serif;
      font-size: 16px;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box; }
    #dashboard #debugger.installations td button {
      padding: 10px 15px;
      font-size: 16px; }
    #dashboard #debugger.installations #latest-activity {
      font-size: 15px; }
      #dashboard #debugger.installations #latest-activity tr {
        cursor: text; }
      #dashboard #debugger.installations #latest-activity th, #dashboard #debugger.installations #latest-activity td {
        padding: 5px 6px; }
  #dashboard #call-view {
    padding: 40px 10px; }
    #dashboard #call-view h4 {
      font-family: 'DIN Bold', sans-serif;
      font-size: 20px; }
    #dashboard #call-view #call-details {
      margin-top: 30px; }
    #dashboard #call-view .data-row {
      display: table;
      width: 100%;
      padding: 10px 0;
      border-bottom: 1px solid #dad6df; }
    #dashboard #call-view .data-title,
    #dashboard #call-view .data-value {
      float: left;
      display: inline-block; }
    #dashboard #call-view .data-title {
      width: 150px;
      padding-right: 30px;
      font-family: 'DIN Bold', sans-serif; }
    #dashboard #call-view .data-value {
      width: calc(100% - 185px);
      word-break: break-all; }
      #dashboard #call-view .data-value .stat {
        display: inline-table;
        min-width: 90px; }
        #dashboard #call-view .data-value .stat div:first-child {
          padding-bottom: 8px;
          font-family: 'DIN Med', sans-serif; }
        #dashboard #call-view .data-value .stat div:last-child {
          font-size: 14px; }
        #dashboard #call-view .data-value .stat.green div:last-child {
          color: #4CAF50; }
    #dashboard #call-view .checkpoint {
      padding: 6px 0; }
      #dashboard #call-view .checkpoint .data-title {
        text-transform: capitalize; }
  #dashboard #add-bot-wrapper {
    padding: 20px 0 35px; }
    #dashboard #add-bot-wrapper form,
    #dashboard #add-bot-wrapper .form {
      display: table;
      width: 100%;
      margin-top: 30px; }
    #dashboard #add-bot-wrapper h1 {
      text-align: left; }
    #dashboard #add-bot-wrapper input, #dashboard #add-bot-wrapper button {
      -webkit-transition: background .1s ease-out, -webkit-box-shadow .2s ease;
      -moz-transition: background .1s ease-out, -moz-box-shadow .2s ease;
      -o-transition: background .1s ease-out, -o-box-shadow .2s ease;
      transition: background .1s ease-out, box-shadow .2s ease; }
      #dashboard #add-bot-wrapper input:focus, #dashboard #add-bot-wrapper button:focus {
        -webkit-box-shadow: 0 0 5px #00add8;
        -moz-box-shadow: 0 0 5px #00add8;
        box-shadow: 0 0 5px #00add8; }
    #dashboard #add-bot-wrapper input#botname {
      display: block;
      line-height: 45px; }
    #dashboard #add-bot-wrapper input[type=checkbox] {
      display: inline-table;
      width: auto;
      margin: 0 4px 0 4px; }
    #dashboard #add-bot-wrapper .buttons {
      display: table;
      width: 100%;
      margin: 30px 0; }
    #dashboard #add-bot-wrapper button {
      display: inline-block; }
      #dashboard #add-bot-wrapper button#manifest {
        margin-left: 12px;
        margin-top: 10px; }
    #dashboard #add-bot-wrapper .setup-slack-bot h1 {
      margin-bottom: 25px;
      text-align: center; }
    #dashboard #add-bot-wrapper .setup-slack-bot p {
      margin-bottom: 20px;
      font-size: 20px; }
    #dashboard #add-bot-wrapper .platform-fields h1 {
      text-align: center; }
    #dashboard #add-bot-wrapper .add-manually h3 {
      margin-top: 10px; }
    #dashboard #add-bot-wrapper .add-manually label {
      word-break: break-word; }
      #dashboard #add-bot-wrapper .add-manually label a {
        font-family: 'DIN Bold', sans-serif;
        color: #5e0d8b; }
    #dashboard #add-bot-wrapper.deploy-fields {
      padding-top: 0; }
      #dashboard #add-bot-wrapper.deploy-fields label {
        display: block; }
  #dashboard .intro-instruction {
    margin: 10px auto 30px;
    font-size: 20px; }
  #dashboard .instruction-screen {
    max-height: 450px;
    max-width: 90%;
    margin-top: 20px; }
  #dashboard #platforms {
    display: table;
    width: 100%;
    padding: 0; }
    #dashboard #platforms li {
      position: relative;
      float: left;
      width: 30%;
      margin: 0 3% 30px 0;
      padding: 30px 10px;
      text-align: center;
      opacity: 1;
      background: #fff;
      cursor: pointer;
      -moz-box-sizing: border-box;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      -moz-transition: opacity 0.2s ease;
      -o-transition: opacity 0.2s ease;
      -webkit-transition: opacity 0.2s ease;
      transition: opacity 0.2s ease; }
      #dashboard #platforms li:hover {
        opacity: .9; }
      #dashboard #platforms li.disabled {
        opacity: 1;
        cursor: default; }
    #dashboard #platforms .platform-img {
      display: table;
      height: 100px;
      width: 100px;
      margin: 0 auto; }
    #dashboard #platforms .platform-name {
      margin-top: 10px;
      font-family: 'DIN Med', sans-serif; }
    #dashboard #platforms .labs-wrapper {
      position: absolute;
      left: 0;
      top: 0;
      height: 60px;
      width: 60px;
      overflow: hidden;
      cursor: default; }
    #dashboard #platforms .labs {
      width: 85px;
      height: 20px;
      position: absolute;
      transform: rotateZ(-45deg);
      top: 12px;
      background: rgba(91, 83, 119, 0.51);
      left: -20px;
      font-size: 14px;
      color: #fff; }
    #dashboard #platforms .tooltip.multi-line {
      left: 50px;
      top: 14px;
      max-width: 180px;
      white-space: normal;
      cursor: default;
      z-index: 1; }
      #dashboard #platforms .tooltip.multi-line:after {
        bottom: auto;
        left: -5px;
        top: 10px;
        border-left: none;
        border-right: 5px solid #d9d8ee;
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent; }
  #dashboard #add-bot-wrapper .sidebar-overlay,
  #dashboard #bot-details .sidebar-overlay {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
    height: 100%;
    width: 100%;
    pointer-events: none;
    background: transparent;
    -moz-transition: background 0.2s ease-in;
    -o-transition: background 0.2s ease-in;
    -webkit-transition: background 0.2s ease-in;
    transition: background 0.2s ease-in; }
    #dashboard #add-bot-wrapper .sidebar-overlay.active,
    #dashboard #bot-details .sidebar-overlay.active {
      pointer-events: auto;
      background: rgba(91, 83, 119, 0.5);
      z-index: 5; }
  #dashboard #add-bot-wrapper .sidebar-fields,
  #dashboard #add-bot-wrapper .sidebar-slack-features,
  #dashboard #bot-details .sidebar-fields,
  #dashboard #bot-details .sidebar-slack-features {
    position: fixed;
    bottom: 0;
    right: 0;
    top: 0;
    height: 100%;
    width: 750px;
    min-width: 50%;
    max-width: 100%;
    padding: 50px 15px 15px;
    overflow-y: auto;
    background: #f2f2f2;
    z-index: 6;
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: -webkit-transform 0.2s ease-in;
    -moz-transition: -moz-transform 0.2s ease-in;
    -o-transition: -o-transform 0.2s ease-in;
    transition: transform 0.2s ease-in;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    #dashboard #add-bot-wrapper .sidebar-fields .close,
    #dashboard #add-bot-wrapper .sidebar-slack-features .close,
    #dashboard #bot-details .sidebar-fields .close,
    #dashboard #bot-details .sidebar-slack-features .close {
      left: 15px;
      top: 15px; }
    #dashboard #add-bot-wrapper .sidebar-fields h2,
    #dashboard #add-bot-wrapper .sidebar-slack-features h2,
    #dashboard #bot-details .sidebar-fields h2,
    #dashboard #bot-details .sidebar-slack-features h2 {
      margin: 0 auto 30px;
      text-align: center; }
    #dashboard #add-bot-wrapper .sidebar-fields input,
    #dashboard #add-bot-wrapper .sidebar-slack-features input,
    #dashboard #bot-details .sidebar-fields input,
    #dashboard #bot-details .sidebar-slack-features input {
      line-height: 28px; }
    #dashboard #add-bot-wrapper .sidebar-fields .radio-label,
    #dashboard #add-bot-wrapper .sidebar-slack-features .radio-label,
    #dashboard #bot-details .sidebar-fields .radio-label,
    #dashboard #bot-details .sidebar-slack-features .radio-label {
      margin-right: 15px;
      margin-top: 5px;
      cursor: pointer; }
      #dashboard #add-bot-wrapper .sidebar-fields .radio-label input,
      #dashboard #add-bot-wrapper .sidebar-slack-features .radio-label input,
      #dashboard #bot-details .sidebar-fields .radio-label input,
      #dashboard #bot-details .sidebar-slack-features .radio-label input {
        width: auto;
        border-radius: 50%; }
    #dashboard #add-bot-wrapper .sidebar-fields .command-prefix,
    #dashboard #add-bot-wrapper .sidebar-slack-features .command-prefix,
    #dashboard #bot-details .sidebar-fields .command-prefix,
    #dashboard #bot-details .sidebar-slack-features .command-prefix {
      position: relative; }
      #dashboard #add-bot-wrapper .sidebar-fields .command-prefix input,
      #dashboard #add-bot-wrapper .sidebar-slack-features .command-prefix input,
      #dashboard #bot-details .sidebar-fields .command-prefix input,
      #dashboard #bot-details .sidebar-slack-features .command-prefix input {
        padding-left: 20px; }
      #dashboard #add-bot-wrapper .sidebar-fields .command-prefix:before,
      #dashboard #add-bot-wrapper .sidebar-slack-features .command-prefix:before,
      #dashboard #bot-details .sidebar-fields .command-prefix:before,
      #dashboard #bot-details .sidebar-slack-features .command-prefix:before {
        content: '/';
        position: absolute;
        left: 10px;
        font-size: 22px;
        line-height: 40px;
        opacity: .5; }
    #dashboard #add-bot-wrapper .sidebar-fields.active,
    #dashboard #add-bot-wrapper .sidebar-slack-features.active,
    #dashboard #bot-details .sidebar-fields.active,
    #dashboard #bot-details .sidebar-slack-features.active {
      -webkit-transform: translateX(0);
      -moz-transform: translateX(0);
      -ms-transform: translateX(0);
      -o-transform: translateX(0);
      transform: translateX(0); }
  #dashboard #add-bot-wrapper .sidebar-fields label,
  #dashboard #bot-details .sidebar-fields label {
    margin: 18px 0 8px 0; }
  #dashboard #add-bot-wrapper .sidebar-fields .buttons,
  #dashboard #bot-details .sidebar-fields .buttons {
    width: 90%;
    margin: 40px auto 10px; }
  #dashboard #add-bot-wrapper .sidebar-slack-features .single-feature,
  #dashboard #bot-details .sidebar-slack-features .single-feature {
    margin-bottom: 20px;
    border: 1px solid #5b5377; }
    #dashboard #add-bot-wrapper .sidebar-slack-features .single-feature form,
    #dashboard #bot-details .sidebar-slack-features .single-feature form {
      margin-top: 0; }
    #dashboard #add-bot-wrapper .sidebar-slack-features .single-feature.expanded .arrow,
    #dashboard #bot-details .sidebar-slack-features .single-feature.expanded .arrow {
      border: none;
      -webkit-transform: rotateZ(90deg);
      -moz-transform: rotateZ(90deg);
      -ms-transform: rotateZ(90deg);
      -o-transform: rotateZ(90deg);
      transform: rotateZ(90deg); }
    #dashboard #add-bot-wrapper .sidebar-slack-features .single-feature.expanded .slack-feature-details,
    #dashboard #bot-details .sidebar-slack-features .single-feature.expanded .slack-feature-details {
      display: block; }
    #dashboard #add-bot-wrapper .sidebar-slack-features .single-feature .buttons,
    #dashboard #bot-details .sidebar-slack-features .single-feature .buttons {
      display: table;
      width: 100%;
      margin: 20px 0 0; }
  #dashboard #add-bot-wrapper .sidebar-slack-features label,
  #dashboard #bot-details .sidebar-slack-features label {
    margin-left: 0; }
  #dashboard #add-bot-wrapper .sidebar-slack-features .show-details-btn,
  #dashboard #bot-details .sidebar-slack-features .show-details-btn {
    display: table;
    width: 100%;
    margin: 0;
    padding: 0 0 0 10px;
    border-radius: 0;
    outline: none;
    line-height: 50px;
    text-align: left;
    background: transparent;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    #dashboard #add-bot-wrapper .sidebar-slack-features .show-details-btn:focus,
    #dashboard #bot-details .sidebar-slack-features .show-details-btn:focus {
      -webkit-box-shadow: none;
      -moz-box-shadow: none;
      box-shadow: none; }
  #dashboard #add-bot-wrapper .sidebar-slack-features .slack-feature-details,
  #dashboard #bot-details .sidebar-slack-features .slack-feature-details {
    display: none;
    padding: 10px;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
  #dashboard #add-bot-wrapper .sidebar-slack-features .add-more,
  #dashboard #bot-details .sidebar-slack-features .add-more {
    float: right;
    padding: 10px; }
  #dashboard #add-bot-wrapper .sidebar-slack-features .arrow,
  #dashboard #bot-details .sidebar-slack-features .arrow {
    display: block;
    float: right;
    height: 50px;
    width: 50px;
    border-left: 1px solid #5b5377;
    background: rgba(91, 83, 119, 0.65) url(/assets/img/nav-right.svg) center center no-repeat;
    background-size: 7px; }
  #dashboard #add-bot-wrapper .switch-element,
  #dashboard #bot-details .switch-element {
    width: 90%;
    margin: 0 auto; }
  #dashboard #add-bot-wrapper .new-item,
  #dashboard #bot-details .new-item {
    position: relative;
    margin-left: 82px;
    padding: 4px 0 18px;
    border-bottom: 1px solid #ccc;
    cursor: default;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
    #dashboard #add-bot-wrapper .new-item:last-child,
    #dashboard #bot-details .new-item:last-child {
      padding-bottom: 0;
      border-bottom: none; }
  #dashboard #add-bot-wrapper .item-order-number,
  #dashboard #bot-details .item-order-number {
    position: absolute;
    top: 10px;
    left: -82px;
    height: 60px;
    width: 60px;
    font-family: 'DIN Bold', sans-serif;
    font-size: 32px;
    line-height: 60px;
    text-align: center;
    background: url(/assets/img/number-frame-dark.svg) center center no-repeat;
    color: #fff; }
  #dashboard #add-bot-wrapper .clipboard,
  #dashboard #bot-details .clipboard {
    position: relative;
    float: right;
    height: 40px;
    width: 50px;
    margin: 0 0 0 10px;
    padding: 0;
    background-image: url(/assets/img/clipboard.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 20px; }
    #dashboard #add-bot-wrapper .clipboard .tooltip,
    #dashboard #bot-details .clipboard .tooltip {
      display: none; }
  #dashboard .features-wrapper {
    display: table;
    width: 100%;
    margin: 50px 0 30px; }
    #dashboard .features-wrapper .platform-feature-box {
      float: left;
      width: 33%;
      margin-bottom: 40px; }
  #dashboard .platform-feature {
    position: relative;
    height: 180px;
    width: 220px;
    padding: 25px 15px 15px;
    margin: 0 auto;
    font-size: 18px;
    text-align: center;
    background: #fff;
    cursor: pointer;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box; }
  #dashboard .active-indicator,
  #dashboard .master-indicator {
    display: table;
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    margin: 0 auto;
    border-radius: 1px;
    background-color: #ededed; }
    #dashboard .active-indicator.on,
    #dashboard .master-indicator.on {
      height: 30px;
      width: 30px;
      background: transparent url(/assets/img/check-active.svg) center center no-repeat;
      background-size: 28px;
      box-shadow: none; }
  #dashboard .active-indicator {
    height: 26px;
    width: 26px;
    -webkit-box-shadow: 0 0 1px 0 #5b5377;
    -moz-box-shadow: 0 0 1px 0 #5b5377;
    box-shadow: 0 0 1px 0 #5b5377; }
  #dashboard .master-indicator {
    height: 30px;
    width: 30px;
    background: url(/assets/img/master.svg) center center no-repeat;
    background-size: 28px;
    cursor: default; }
  #dashboard .mio-credentials {
    width: 75%;
    margin: 15px 0 60px; }
    #dashboard .mio-credentials label {
      display: block; }
    #dashboard .mio-credentials input {
      line-height: 40px;
      max-width: calc(100% - 70px);
      padding: 0 12px !important; }
  #dashboard #credentials p {
    font-size: 22px; }
  #dashboard #credentials .mio-credentials {
    margin-left: auto;
    margin-right: auto; }
  #dashboard #before ul {
    margin-top: 40px;
    list-style: initial;
    font-size: 20px;
    line-height: 1.5; }
  #dashboard #before li {
    margin-bottom: 15px; }
  #dashboard #before h1 {
    text-align: left; }
  #dashboard #before p {
    max-width: 90%;
    margin: 10px 0 15px;
    font-size: 20px; }
  #dashboard #before .buttons {
    margin-top: 40px; }
  #dashboard #before button {
    display: inline-block; }
  #dashboard #deploy-bot .cancel-btn {
    margin-right: 40px; }
  #dashboard #deploy-bot .platform-definition {
    display: table;
    width: 100%;
    margin-bottom: 40px; }
  #dashboard #deploy-bot-wrapper {
    padding-top: 70px; }
    #dashboard #deploy-bot-wrapper h1 {
      text-align: left; }
      #dashboard #deploy-bot-wrapper h1 span {
        text-transform: capitalize; }
    #dashboard #deploy-bot-wrapper .select-master-platform h1 {
      margin-bottom: 40px; }
    #dashboard #deploy-bot-wrapper .select-master-platform .form {
      display: table;
      width: 100%; }
  #dashboard #setup-complete h1 {
    text-align: left; }
  #dashboard #setup-complete p {
    font-size: 20px; }
  #dashboard #setup-complete button {
    margin: 50px 0 0; }
  #dashboard .toggle-feature {
    float: left;
    height: 26px;
    width: 55px;
    margin-top: 8px;
    border: 1px solid rgba(91, 83, 119, 0.2);
    border-radius: 2px;
    background: rgba(91, 83, 119, 0.2);
    cursor: pointer;
    -moz-transition: background-color 0.2s linear;
    -o-transition: background-color 0.2s linear;
    -webkit-transition: background-color 0.2s linear;
    transition: background-color 0.2s linear; }
    #dashboard .toggle-feature div {
      float: left;
      height: 100%;
      width: 50%;
      border-radius: 1px;
      text-align: center;
      background: #fff;
      -webkit-box-shadow: 0 0 6px -1px #5b5377;
      -moz-box-shadow: 0 0 6px -1px #5b5377;
      box-shadow: 0 0 6px -1px #5b5377;
      -webkit-transition: -webkit-transform 0.2s linear;
      -moz-transition: -moz-transform 0.2s linear;
      -o-transition: -o-transform 0.2s linear;
      transition: transform 0.2s linear; }
    #dashboard .toggle-feature span {
      display: inline-block;
      height: 14px;
      width: 2px;
      border-radius: 1px;
      margin: 6px -1px 0 0;
      background: rgba(91, 83, 119, 0.2);
      -webkit-box-shadow: inset 0 0 4px -1px #5b5377;
      -moz-box-shadow: inset 0 0 4px -1px #5b5377;
      box-shadow: inset 0 0 4px -1px #5b5377; }
    #dashboard .toggle-feature.on {
      background: #5e0d8b; }
      #dashboard .toggle-feature.on div {
        -webkit-transform: translateX(100%);
        -moz-transform: translateX(100%);
        -ms-transform: translateX(100%);
        -o-transform: translateX(100%);
        transform: translateX(100%); }
      #dashboard .toggle-feature.on span {
        background: #5e0d8b;
        -moz-transition: background-color 0.2s linear;
        -o-transition: background-color 0.2s linear;
        -webkit-transition: background-color 0.2s linear;
        transition: background-color 0.2s linear; }

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