.no-user-select {
      -moz-user-select: none;
      -webkit-user-select: none;
      -ms-user-select: none;
      user-select: none;
  }
  
  .angucomplete-dropdown {

      border-color: #ececec;
      border-width: 1px;
      border-style: solid;
      border-radius: 2px;
      /*width: 250px;*/
      padding: 6px;
      cursor: pointer;
      z-index: 9999;
      position: absolute;
      /*top: 32px;
      left: 0px;
      */
      margin-top: -6px;
      background-color: #ffffff;
  }
  
  .angucomplete-description {
      font-size: 14px;
  }
  
  .angucomplete-row {
      padding: 5px;
      color: #000000;
      margin-bottom: 4px;
      clear: both;

  }
  
  .angucomplete-selected-row {

      background-color: #aaaaff;

  }

  .container .row {

      margin-left: 0;
      margin-right: 0;
  }

  /*ul.side-nav.fixed li {

      font-size: 24px;

  }

  ul.side-nav.fixed li a.class {

      height: 28px;

      font-size: 20px;

      line-height: normal;

      font-weight: 600;

  }
  
  ul.side-nav.fixed li a {

      font-size: 24px;

  }*/

  /* Flashcard directive css */

  .card {

      word-wrap: break-word;

  }
  
  .card.flashy {

      float: left;

      text-align: center;

      margin: 6px;

      transition: all 0.2s cubic-bezier(0, 0, 0.6, 1);

      font-family: 'Titillium Web', sans-serif;

  }

  .card.flashy.shrinky {

      height: 0;
      opacity: 0;
      overflow: hidden;

  }

  .card-overlay {

      cursor: pointer;

      left: 0;

      opacity: 0;
      position: absolute;
      top: 0;

      transition: visibility 0s cubic-bezier(0, 0, 0.6, 1) 0.2s,

      opacity 0.2s cubic-bezier(0, 0, 0.6, 1);

      /* animation effect to appear on off-hover */

      visibility: hidden;

      height: 100%;
      width: 100%;

  }
  
  .card-overlay i {

      color: #FFF;
      left: 50%;
      position: absolute;
      top: 50%;
      transform: translate(-50%, -50%);

      transition: all 0.2s cubic-bezier(0, 0, 0.6, 1) 0s;
  }
  
  .center-me:hover i {
      text-shadow: 0 0 15px rgba(255,255,255,0.7);

  }
  
  .card:hover .card-overlay {

      opacity: 0.9;

      transition-delay: 0s; /* animation effect to appear on hover */
      visibility: visible;

  }
  
  .top-box {

      background-color: rgba(0, 81, 229, 0.6);

      height: 65%;
      position: relative;

      transition: all 0.2s cubic-bezier(0, 0, 0.6, 1) 0s;

      width: 100%;

  }

  .top-box:hover {

      background-color: rgba(0, 81, 229, 0.75);

  }
  
  .bottom-box {

      height: 35%;
      width: 100%;

  }
  
  .left-box {

      background-color: rgba(15, 0, 155, 0.6);

      float: left;
      position: relative;
      height: 100%;

      transition: all 0.2s cubic-bezier(0, 0, 0.6, 1) 0s;

      width: 50%;

  }

  .left-box:hover {

      background-color: rgba(15, 0, 155, 0.75);

  }
  
  .right-box {

      background-color: rgba(207, 0, 86, 0.6);

      float: right;
      height: 100%;
      position: relative;

      transition: all 0.2s cubic-bezier(0, 0, 0.6, 1) 0s;

      width: 50%;

  }

  .right-box:hover {

      background-color: rgba(207, 0, 86, 0.75);

  }
  
  .center-me {

      height: 100%;

      margin: 0 auto;
      text-align: center;

      vertical-align: middle;

      width: 100%;

  }

  .modal.bottom-sheet {

      width: 40%;
      margin-left: auto;
      margin-right: auto;

  }

  #newCard input[type=text] {
      height: 3rem !important;
  }

  .input-field label {

      color: #673ab7;

  }
  
  /* label focus color */
  .input-field input[type]:focus + label {

      color: #b388ff;

  }
  
  /* label underline focus color */
  .input-field input[type]:focus {

      border-bottom: 1px solid #b388ff;
      box-shadow: 0 1px 0 0 #b388ff;

  }
  
  /* valid color */
  .input-field input[type].valid {

      border-bottom: 1px solid #673ab7;
      box-shadow: 0 1px 0 0 #673ab7;

  }
  
  /* invalid color */
  .input-field input[type].invalid {

      border-bottom: 1px solid #673ab7;
      box-shadow: 0 1px 0 0 #673ab7;

  }
  
  /* icon prefix focus color */
  .input-field .prefix.active {

      color: #b388ff;

  }
  
  /* label focus color */
  .input-field textarea[type]:focus + label {

      color: #b388ff;

  }
  
  /* label underline focus color */
  .input-field textarea[type]:focus {

      border-bottom: 1px solid #b388ff;
      box-shadow: 0 1px 0 0 #b388ff;

  }

  
  body {

      background-color: #3e1944;

      overflow-x: hidden;

      font-family: 'Titillium Web', sans-serif;

  }

  html {
      background: transparent;
  }

  .btn {

      background-color: #673ab7;

  }

  .btn:hover {

      background-color: #7c4dff;

  }

  .btn-floating {

      background-color: #673ab7;

  }

  
  .btn-floating:hover {

      background-color: #7c4dff;

  }

  #logo-container {

      margin-bottom: 18px;

  }

  
  #lean-overlay {

      display: none !important;

  }

  /*#sidenav-overlay {

      background-color: rgba(0, 0, 0, 0) !important;

  }*/