
.m-page-loader {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    -moz-align-items: center;
    -ms-align-items: center;
    align-items: center;
    display: none; }
    .m-page--loading .m-page-loader {
      display: -webkit-box;
      /* OLD - iOS 6-, Safari 3.1-6 */
      display: -moz-box;
      /* OLD - Firefox 19- (buggy but mostly works) */
      display: -ms-flexbox;
      /* TWEENER - IE 10 */
      display: -webkit-flex;
      /* NEW - Chrome */
      display: flex; }
    .m-page-loader.m-page-loader--non-block {
      position: fixed;
      top: 50%;
      left: 50%;
      right: auto;
      bottom: auto;
      width: auto; }
      .m-page--loading-non-block .m-page-loader.m-page-loader--non-block {
        display: inline-block; }
  
  .m-page-loader {
    background: #ffffff; }
    .m-page-loader.m-page-loader--non-block {
      background: transparent; }
  
  .m-page-loader.m-page-loader--skin-dark {
    background: #2c2e3e; }
    .m-page-loader.m-page-loader--skin-dark.m-page-loader--non-block {
      background: transparent; }



.m-blockui {
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
-ms-border-radius: 4px;
-o-border-radius: 4px;
border-radius: 4px;
display: table;
table-layout: fixed; }
.m-blockui > span {
    display: table-cell;
    vertical-align: middle;
    padding: 8px 15px;
    font-size: 1rem;
    font-weight: 400; }
    .m-blockui > span > .m-loader,
    .m-blockui > span > .m-spinner {
    margin-right: 10px; }

.m-blockui {
background: #ffffff;
-webkit-box-shadow: 0px 0px 15px 1px rgba(69, 65, 78, 0.2) ;
-moz-box-shadow: 0px 0px 15px 1px rgba(69, 65, 78, 0.2) ;
box-shadow: 0px 0px 15px 1px rgba(69, 65, 78, 0.2) ; }
.m-blockui.m-blockui-no-shadow {
    -webkit-box-shadow: none ;
    -moz-box-shadow: none ;
    box-shadow: none ; }
.m-blockui > span {
    color: #6f727d; }

.m-blockui.m-blockui--skin-dark {
background: #2c2e3e;
-webkit-box-shadow: 0px 2px 12px 0px rgba(39, 35, 102, 0.06) ;
-moz-box-shadow: 0px 2px 12px 0px rgba(39, 35, 102, 0.06) ;
box-shadow: 0px 2px 12px 0px rgba(39, 35, 102, 0.06) ; }
.m-blockui.m-blockui--skin-dark.m-blockui-no-shadow {
    -webkit-box-shadow: none ;
    -moz-box-shadow: none ;
    box-shadow: none ; }
.m-blockui.m-blockui--skin-dark > span {
    color: #9093ac; }
      


.m-spinner {
    display: inline-block;
    width: 1.5rem;
    height: 1.5rem;
    margin: 0 auto;
    border-radius: 100%;
    opacity: 0 ;
    filter: alpha(opacity=0) ;
    -webkit-animation: m-spinner-scaleout 0.9s infinite ease-in-out;
    -moz-animation: m-spinner-scaleout 0.9s infinite ease-in-out;
    -ms-animation: m-spinner-scaleout 0.9s infinite ease-in-out;
    -o-animation: m-spinner-scaleout 0.9s infinite ease-in-out;
    animation: m-spinner-scaleout 0.9s infinite ease-in-out; }
    .m-spinner.m-spinner--lg {
      width: 2rem;
      height: 2rem; }
    .m-spinner.m-spinner--sm {
      width: 1.2rem;
      height: 1.2rem; }
    .btn .m-spinner {
      position: relative;
      line-height: 0; }
  
  @-webkit-keyframes m-spinner-scaleout {
    0% {
      opacity: 0.3 ;
      filter: alpha(opacity=30) ;
      -webkit-transform: scale(0);
      -moz-transform: scale(0);
      -ms-transform: scale(0);
      -o-transform: scale(0);
      transform: scale(0); }
    100% {
      opacity: 1 ;
      filter: alpha(opacity=100) ;
      -webkit-transform: scale(1);
      -moz-transform: scale(1);
      -ms-transform: scale(1);
      -o-transform: scale(1);
      transform: scale(1); } }
  
  @-moz-keyframes m-spinner-scaleout {
    0% {
      opacity: 0.3 ;
      filter: alpha(opacity=30) ;
      -webkit-transform: scale(0);
      -moz-transform: scale(0);
      -ms-transform: scale(0);
      -o-transform: scale(0);
      transform: scale(0); }
    100% {
      opacity: 1 ;
      filter: alpha(opacity=100) ;
      -webkit-transform: scale(1);
      -moz-transform: scale(1);
      -ms-transform: scale(1);
      -o-transform: scale(1);
      transform: scale(1); } }
  
  @-o-keyframes m-spinner-scaleout {
    0% {
      opacity: 0.3 ;
      filter: alpha(opacity=30) ;
      -webkit-transform: scale(0);
      -moz-transform: scale(0);
      -ms-transform: scale(0);
      -o-transform: scale(0);
      transform: scale(0); }
    100% {
      opacity: 1 ;
      filter: alpha(opacity=100) ;
      -webkit-transform: scale(1);
      -moz-transform: scale(1);
      -ms-transform: scale(1);
      -o-transform: scale(1);
      transform: scale(1); } }
  
  @keyframes m-spinner-scaleout {
    0% {
      opacity: 0.3 ;
      filter: alpha(opacity=30) ;
      -webkit-transform: scale(0);
      -moz-transform: scale(0);
      -ms-transform: scale(0);
      -o-transform: scale(0);
      transform: scale(0); }
    100% {
      opacity: 1 ;
      filter: alpha(opacity=100) ;
      -webkit-transform: scale(1);
      -moz-transform: scale(1);
      -ms-transform: scale(1);
      -o-transform: scale(1);
      transform: scale(1); } }
  
  .m-spinner {
    background-color: #e2e5ec; }
  
  .m-spinner.m-spinner--skin-dark {
    background-color: #a9acb8; }
  
  .m-spinner.m-spinner--brand {
    background-color: #0774c6; }
  
  .m-spinner.m-spinner--metal {
    background-color: #c4c5d6; }
  
  .m-spinner.m-spinner--light {
    background-color: #ffffff; }
  
  .m-spinner.m-spinner--accent {
    background-color: #00c5dc; }
  
  .m-spinner.m-spinner--focus {
    background-color: #9816f4; }
  
  .m-spinner.m-spinner--primary {
    background-color: #5867dd; }
  
  .m-spinner.m-spinner--success {
    background-color: #34bfa3; }
  
  .m-spinner.m-spinner--info {
    background-color: #36a3f7; }
  
  .m-spinner.m-spinner--warning {
    background-color: #ffb822; }
  
  .m-spinner.m-spinner--danger {
    background-color: #f4516c; }



.m-loader {
    position: relative; }
    .m-loader:before {
      content: '';
      box-sizing: border-box;
      position: absolute;
      top: 50%;
      left: 50%;
      border-top: 2px solid #07d;
      border-right: 2px solid transparent;
      -webkit-border-radius: 50%;
      -moz-border-radius: 50%;
      -ms-border-radius: 50%;
      -o-border-radius: 50%;
      border-radius: 50%;
      -webkit-animation: m-loader-rotate 0.6s linear infinite;
      -moz-animation: m-loader-rotate 0.6s linear infinite;
      -ms-animation: m-loader-rotate 0.6s linear infinite;
      -o-animation: m-loader-rotate 0.6s linear infinite;
      animation: m-loader-rotate 0.6s linear infinite; }
    .m-loader:before {
      width: 1.4rem;
      height: 1.4rem;
      margin-top: -0.7rem;
      margin-left: -0.7rem;
      border-top-width: 2px;
      border-right-width: 2px; }
    .m-loader.m-loader--lg:before {
      width: 2rem;
      height: 2rem;
      margin-top: -1rem;
      margin-left: -1rem;
      border-top-width: 3px;
      border-right-width: 3px; }
    .m-loader.m-loader--sm:before {
      width: 1rem;
      height: 1rem;
      margin-top: -0.5rem;
      margin-left: -0.5rem;
      border-top-width: 1px;
      border-right-width: 1px; }
    .m-loader.m-loader--right:before {
      left: auto;
      right: 0.7rem; }
    .m-loader.m-loader--right.m-loader--lg:before {
      right: 1rem; }
    .m-loader.m-loader--right.m-loader--sm:before {
      right: 0.5rem; }
    .m-loader.m-loader--right.btn {
      padding-right: 3.35rem; }
      .m-loader.m-loader--right.btn.m-loader--lg {
        padding-right: 4.75rem; }
      .m-loader.m-loader--right.btn.m-loader--sm {
        padding-right: 2.25rem; }
    .m-loader.m-loader--left:before {
      left: 1.4rem; }
    .m-loader.m-loader--left.m-loader--lg:before {
      left: 2rem; }
    .m-loader.m-loader--left.m-loader--sm:before {
      left: 1rem; }
    .m-loader.m-loader--left.btn {
      padding-left: 3.35rem; }
      .m-loader.m-loader--left.btn.m-loader--lg {
        padding-left: 4.75rem; }
      .m-loader.m-loader--left.btn.m-loader--sm {
        padding-left: 2.25rem; }
  
  @-webkit-keyframes m-loader-rotate {
    to {
      transform: rotate(360deg); } }
  
  @-moz-keyframes m-loader-rotate {
    to {
      transform: rotate(360deg); } }
  
  @-o-keyframes m-loader-rotate {
    to {
      transform: rotate(360deg); } }
  
  @keyframes m-loader-rotate {
    to {
      transform: rotate(360deg); } }
  
  .m-loader:before {
    border-top-color: #dfe2ea; }
  
  .m-loader.m-loader--skin-dark:before {
    border-top-color: #acafba; }
  
  .m-loader.m-loader--brand:before {
    border-top-color: #0774c6; }
  
  .m-loader.m-loader--metal:before {
    border-top-color: #c4c5d6; }
  
  .m-loader.m-loader--light:before {
    border-top-color: #ffffff; }
  
  .m-loader.m-loader--accent:before {
    border-top-color: #00c5dc; }
  
  .m-loader.m-loader--focus:before {
    border-top-color: #9816f4; }
  
  .m-loader.m-loader--primary:before {
    border-top-color: #5867dd; }
  
  .m-loader.m-loader--success:before {
    border-top-color: #34bfa3; }
  
  .m-loader.m-loader--info:before {
    border-top-color: #36a3f7; }
  
  .m-loader.m-loader--warning:before {
    border-top-color: #ffb822; }
  
  .m-loader.m-loader--danger:before {
    border-top-color: #f4516c; }