.nav-profile-component {
  height: inherit;
  position: relative;
  display: block; }
  .nav-profile-component > .flex {
    height: inherit; }
  .nav-profile-component .item {
    color: #212121;
    margin: 0;
    display: inline-block;
    line-height: 1;
    height: auto; }
    @media only screen and (min-width: 601px) {
      .nav-profile-component .item {
        position: relative; } }
    .nav-profile-component .item .btn.btn-floating {
      box-shadow: none;
      transition: box-shadow .2s ease; }
      .nav-profile-component .item .btn.btn-floating:hover {
        box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.14), 0 1px 10px 0 rgba(0, 0, 0, 0.12), 0 2px 4px -1px rgba(0, 0, 0, 0.3); }
      .nav-profile-component .item .btn.btn-floating span {
        font-size: 1.5rem;
        display: inline-block; }
  .nav-profile-component .dropdown .dropdown-header h5 {
    font-size: 1.2rem;
    margin-top: 0;
    margin-bottom: 0.25rem;
    font-weight: bold;
    color: #212121; }
  .nav-profile-component .dropdown .dropdown-header h6 {
    font-size: 1rem;
    margin: 0;
    color: #757575;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  .nav-profile-component .dropdown .dropdown-header .icon-wrapper {
    margin: .75rem auto;
    width: 60px;
    height: 60px;
    background-color: #465A64;
    border-radius: 100%;
    color: #FFFFFF;
    text-align: center;
    font-size: 2rem;
    line-height: 60px; }

.nav-apps-component {
  height: inherit;
  position: relative;
  display: block; }
  .nav-apps-component > .flex {
    height: inherit; }
  .nav-apps-component .item {
    color: #212121;
    margin: 0;
    display: inline-block;
    line-height: 1;
    height: auto; }
    @media only screen and (min-width: 601px) {
      .nav-apps-component .item {
        position: relative; } }
    .nav-apps-component .item .btn.btn-floating {
      box-shadow: none;
      border: 1px solid #eeeeee;
      transition: box-shadow .2s ease; }
      .nav-apps-component .item .btn.btn-floating:hover {
        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.12), 0 1px 5px 0 rgba(0, 0, 0, 0.2); }
      .nav-apps-component .item .btn.btn-floating i {
        display: block;
        line-height: 1;
        font-size: 1.3rem; }
      .nav-apps-component .item .btn.btn-floating span {
        font-size: 1.5rem;
        display: inline-block; }
  @media only screen and (min-width: 601px) {
    .nav-apps-component .dropdown {
      max-width: 320px; } }
  .nav-apps-component .dropdown .dropdown-list-wrapper {
    padding: 0.75rem !important;
    max-height: 400px !important; }
    .nav-apps-component .dropdown .dropdown-list-wrapper .apps-list-component .sbm {
      margin-bottom: .5rem; }
    .nav-apps-component .dropdown .dropdown-list-wrapper .apps-list-component .img-wrapper {
      width: 50px;
      height: 50px;
      line-height: 50px; }
      .nav-apps-component .dropdown .dropdown-list-wrapper .apps-list-component .img-wrapper i {
        font-size: 2rem;
        height: auto;
        line-height: normal;
        padding-right: 0; }
    .nav-apps-component .dropdown .dropdown-list-wrapper .apps-list-component span {
      font-size: .8rem; }

.nav-bar-component {
  z-index: 11;
  position: relative;
  height: 55px;
  line-height: 55px;
  background: #FFFFFF; }
  @media only screen and (min-width: 601px) {
    .nav-bar-component {
      padding-left: .75rem;
      padding-right: .75rem;
      border-bottom: 1px solid #eeeeee; } }
  .nav-bar-component .nav-brand-component {
    height: 55px;
    float: left;
    display: block;
    position: relative;
    padding-left: .75rem;
    padding-right: .75rem; }
    .nav-bar-component .nav-brand-component .brand-logo img {
      max-height: 35px;
      margin: 10px 0;
      display: block; }
    .nav-bar-component .nav-brand-component .brand-name {
      padding: 0 .75rem; }
      .nav-bar-component .nav-brand-component .brand-name h2 {
        margin: 0;
        font-size: 1.3rem;
        line-height: 55px;
        color: #424242;
        font-weight: bold; }
  .nav-bar-component .nav-item {
    height: 55px; }
    .nav-bar-component .nav-item.nav-right {
      float: right; }
  .nav-bar-component .dropdown {
    line-height: normal;
    z-index: 999;
    position: fixed;
    top: 55px;
    right: 0;
    background-color: #FFFFFF;
    margin: 0;
    width: 100vw;
    max-width: 320px; }
    @media only screen and (min-width: 601px) {
      .nav-bar-component .dropdown {
        position: absolute;
        top: 60px;
        right: -0.75rem;
        width: auto;
        min-width: 320px;
        max-width: 640px; } }
    .nav-bar-component .dropdown .dropdown-header {
      padding: .75rem 1.5rem;
      border-bottom: 1px solid #eeeeee; }
    .nav-bar-component .dropdown .dropdown-list-wrapper {
      padding: 0;
      max-height: 50vh;
      overflow-y: auto;
      border-bottom: 1px solid #eeeeee; }
      .nav-bar-component .dropdown .dropdown-list-wrapper ul {
        margin: 0;
        border: none;
        list-style-type: none; }
        .nav-bar-component .dropdown .dropdown-list-wrapper ul li {
          padding: 0; }
          .nav-bar-component .dropdown .dropdown-list-wrapper ul li a {
            color: #212121;
            display: inline-block;
            min-height: 2.5rem;
            font-size: 1rem;
            width: 100%;
            padding: 0.75rem 1.5rem; }
          .nav-bar-component .dropdown .dropdown-list-wrapper ul li i {
            color: #212121;
            font-size: 1rem;
            line-height: 1.2rem;
            padding-right: 0.75rem; }
    .nav-bar-component .dropdown .dropdown-footer {
      padding-top: .5rem;
      padding-bottom: .5rem; }

.loader {
  position: relative;
  -webkit-animation: show-loader .35s ease-in-out;
          animation: show-loader .35s ease-in-out; }
  .loader:before, .loader:after {
    -webkit-animation-name: pulse-loader;
            animation-name: pulse-loader;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-duration: 4s;
            animation-duration: 4s;
    box-shadow: 0 0 5px rgba(73, 118, 188, 0.4);
    border-radius: 50%;
    border: 3px solid rgba(73, 118, 188, 0.6);
    content: '';
    display: block;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 0; }
  .loader:after {
    -webkit-animation-delay: 2s;
            animation-delay: 2s; }
  .loader .center-circle {
    position: absolute;
    top: 25%;
    left: 25%;
    width: 50%;
    height: 50%;
    border-radius: 50%;
    background-color: #4976bc;
    transform: scale(1);
    -webkit-animation: pulse-circle 4s infinite;
            animation: pulse-circle 4s infinite;
    z-index: 1; }
    .loader .center-circle i {
      font-size: 25px;
      color: #FFFFFF;
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%); }

@-webkit-keyframes show-loader {
  0% {
    opacity: 0;
    transform: scale(0); }
  40% {
    opacity: 1; }
  100% {
    transform: scale(1); } }

@keyframes show-loader {
  0% {
    opacity: 0;
    transform: scale(0); }
  40% {
    opacity: 1; }
  100% {
    transform: scale(1); } }

@-webkit-keyframes pulse-loader {
  0% {
    opacity: 0;
    transform: scale(0); }
  40% {
    opacity: 1; }
  100% {
    opacity: 0;
    transform: scale(1); } }

@keyframes pulse-loader {
  0% {
    opacity: 0;
    transform: scale(0); }
  40% {
    opacity: 1; }
  100% {
    opacity: 0;
    transform: scale(1); } }

@-webkit-keyframes pulse-circle {
  0% {
    transform: scale(1); }
  25% {
    transform: scale(1); }
  30% {
    transform: scale(1.1); }
  35% {
    transform: scale(1); }
  75% {
    transform: scale(1); }
  80% {
    transform: scale(1.1); }
  85% {
    transform: scale(1); } }

@keyframes pulse-circle {
  0% {
    transform: scale(1); }
  25% {
    transform: scale(1); }
  30% {
    transform: scale(1.1); }
  35% {
    transform: scale(1); }
  75% {
    transform: scale(1); }
  80% {
    transform: scale(1.1); }
  85% {
    transform: scale(1); } }

@media only screen and (max-width: 600px) {
  .page-title-component {
    margin-bottom: 1rem; } }

.page-title-component h5 {
  margin-top: 1.5rem;
  margin-bottom: 0;
  font-size: 1.5rem; }
  @media only screen and (min-width: 601px) {
    .page-title-component h5 {
      font-size: 2rem; } }
  .page-title-component h5 span {
    vertical-align: middle; }
  .page-title-component h5 button.btn.btn-flat {
    margin-right: 0.75rem;
    height: auto;
    line-height: normal;
    vertical-align: middle;
    color: #212121; }
    .page-title-component h5 button.btn.btn-flat i {
      font-size: 1.5rem; }
  @media only screen and (max-width: 600px) {
    .page-title-component h5 {
      margin-top: 1rem; } }

.page-title-component h6 {
  margin-top: 0.5rem;
  margin-bottom: 0; }
  @media only screen and (max-width: 600px) {
    .page-title-component h6 {
      font-size: .9rem; } }

.snackbar-component {
  position: absolute;
  bottom: 65px;
  left: 50%;
  z-index: 10;
  transform: translateX(-50%);
  width: auto;
  min-width: calc(320px - 1.5rem);
  max-width: 688px;
  min-height: 48px; }
  .snackbar-component .snackbar {
    padding: .75rem;
    vertical-align: middle;
    border-radius: 4px;
    opacity: 0;
    transition: all .35s ease;
    text-align: left; }
    .snackbar-component .snackbar.active {
      opacity: 1; }
    .snackbar-component .snackbar span.message {
      font-size: 1rem;
      vertical-align: middle; }
    .snackbar-component .snackbar button.btn {
      vertical-align: middle;
      margin-left: 1.5rem; }
    .snackbar-component .snackbar.snackbar-default {
      background-color: #212121; }
      .snackbar-component .snackbar.snackbar-default span.message {
        color: #fafafa; }

.password-strength-component {
  margin-left: -.25rem;
  margin-right: -.25rem;
  line-height: 1;
  position: relative; }
  .password-strength-component .part {
    padding: 0.5rem 0.25rem 0 0.25rem; }
    .password-strength-component .part::before {
      display: block;
      content: '';
      border-radius: 3px;
      height: 2px;
      background: rgba(158, 158, 158, 0.2); }
  .password-strength-component.strength-terrible .status {
    color: #e53935; }
  .password-strength-component.strength-terrible .part-1::before {
    background: #e53935; }
  .password-strength-component.strength-bad .status {
    color: #fb8c00; }
  .password-strength-component.strength-bad .part-1::before,
  .password-strength-component.strength-bad .part-2::before {
    background: #fb8c00; }
  .password-strength-component.strength-good .status {
    color: #fbc02d; }
  .password-strength-component.strength-good .part-1::before,
  .password-strength-component.strength-good .part-2::before,
  .password-strength-component.strength-good .part-3::before {
    background: #fbc02d; }
  .password-strength-component.strength-great .status {
    color: #8bc34a; }
  .password-strength-component.strength-great .part-1::before,
  .password-strength-component.strength-great .part-2::before,
  .password-strength-component.strength-great .part-3::before,
  .password-strength-component.strength-great .part-4::before {
    background: #8bc34a; }

.snow-effect-component {
  position: absolute;
  z-index: 0;
  top: 0;
  right: 0;
  width: 100vw;
  height: 100vh; }
  .snow-effect-component canvas {
    display: block; }

.toggle-switch-component.switch label .lever {
  background-color: rgba(0, 0, 0, 0.26);
  margin-top: 3px;
  margin-bottom: 3px; }

.toggle-switch-component.switch label input[type=checkbox]:checked + .lever {
  background: rgba(73, 118, 188, 0.5); }
  .toggle-switch-component.switch label input[type=checkbox]:checked + .lever:after {
    background: #4976bc; }

.side-bar-component {
  position: relative;
  background: #FFFFFF; }
  @media only screen and (min-width: 601px) {
    .side-bar-component {
      margin-top: 1.5rem;
      margin-bottom: 1.5rem; } }
  @media only screen and (max-width: 600px) {
    .side-bar-component {
      height: 3rem;
      overflow: hidden;
      box-shadow: 0 0px 0px 0 transparent, 0 0px 3px 0 rgba(0, 0, 0, 0.12), 0 2px 2px -3px rgba(0, 0, 0, 0.2); } }
  .side-bar-component .collection {
    margin: 0;
    border: none;
    display: flex; }
    @media only screen and (min-width: 601px) {
      .side-bar-component .collection {
        display: -webkit-box;
        box-sizing: border-box;
        flex-wrap: wrap; } }
    @media only screen and (max-width: 600px) {
      .side-bar-component .collection {
        flex-wrap: nowrap;
        padding-bottom: 17px;
        overflow-y: hidden;
        overflow-x: auto; } }
  .side-bar-component a.collection-item {
    border: none; }
    .side-bar-component a.collection-item i {
      font-size: 1.2rem;
      padding-right: .75rem; }
    @media only screen and (min-width: 601px) {
      .side-bar-component a.collection-item {
        width: 100%;
        margin-left: auto;
        left: auto;
        right: auto; } }
    @media only screen and (max-width: 600px) {
      .side-bar-component a.collection-item {
        width: auto;
        white-space: nowrap; } }
  .side-bar-component .slide {
    display: none; }
    @media only screen and (max-width: 600px) {
      .side-bar-component .slide {
        position: absolute;
        bottom: 19px;
        left: 0;
        position: absolute;
        background: #4976bc;
        height: 4px;
        width: 120px;
        transition: left 0.15s ease-in-out; } }