/*!
 * REST
 * (c) 2018 Shiro
 * Released under the MIT License.
 */
body, p {
  margin: 0; }

p {
  line-height: 2; }

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

.clearfix::after {
  content: "";
  display: table;
  clear: both;
  float: none;
  *zoom: 1; }

.oo-button {
  display: inline-block;
  padding: 0 1px;
  margin: 0 -1px;
  -webkit-filter: brightness(100%);
          filter: brightness(100%);
  -webkit-transition: -webkit-filter .34s;
  transition: -webkit-filter .34s;
  transition: filter .34s;
  transition: filter .34s, -webkit-filter .34s; }
  .oo-button:hover {
    -webkit-filter: brightness(107%);
            filter: brightness(107%); }
  .oo-button:active {
    -webkit-filter: brightness(93%);
            filter: brightness(93%); }
  .oo-button.disabled {
    -webkit-filter: grayscale(100%);
            filter: grayscale(100%);
    cursor: not-allowed; }
    .oo-button.disabled .btn {
      background: #ddd;
      pointer-events: none; }
  .oo-button.loading {
    cursor: wait;
    -webkit-filter: opacity(66%);
            filter: opacity(66%); }
    .oo-button.loading .btn {
      pointer-events: none; }
  .oo-button .btn {
    position: relative;
    display: inline-block;
    font-size: .14rem;
    padding: 0 1em;
    line-height: 2;
    border: 1px solid #999;
    border-radius: 4px;
    color: #444;
    text-align: center;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    cursor: pointer;
    -webkit-transition: background .34s, border .34s, color .34s, -webkit-filter .34s;
    transition: background .34s, border .34s, color .34s, -webkit-filter .34s;
    transition: background .34s, border .34s, filter .34s, color .34s;
    transition: background .34s, border .34s, filter .34s, color .34s, -webkit-filter .34s; }
    .oo-button .btn svg {
      height: 1.4em;
      margin: 0 .5em; }
      .oo-button .btn svg:first-child {
        margin-left: -.5em; }
      .oo-button .btn svg:last-child {
        margin-right: -.5em; }
    .oo-button .btn .loading {
      display: inline;
      margin: 0 .5em 0 -.5em; }
      .oo-button .btn .loading::after {
        content: '';
        display: inline-block;
        vertical-align: middle;
        margin: .2em;
        width: 1em;
        height: 1em;
        border: 1px solid transparent;
        border-radius: 50%;
        border-left-color: inherit;
        -webkit-transform-origin: 50% 50%;
            -ms-transform-origin: 50% 50%;
                transform-origin: 50% 50%;
        -webkit-animation: buttonEffectCircle 1s infinite linear;
                animation: buttonEffectCircle 1s infinite linear; }
    .oo-button .btn:hover {
      border-color: #409eff;
      color: #409eff; }
    .oo-button .btn.spread::before {
      content: '';
      position: absolute;
      display: block;
      top: -1px;
      left: -1px;
      bottom: -1px;
      right: -1px;
      border-radius: inherit;
      opacity: 0;
      -webkit-box-shadow: 0 0 0 6px;
              box-shadow: 0 0 0 6px;
      color: #50bfff;
      -webkit-transition: all .4s linear;
      transition: all .4s linear;
      z-index: -1; }
    .oo-button .btn.spread:active::before {
      -webkit-transition: all 1ms linear;
      transition: all 1ms linear;
      -webkit-box-shadow: 0 0 0 0;
              box-shadow: 0 0 0 0;
      opacity: 0.618; }
  .oo-button.circle .btn {
    border-radius: 1em;
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    width: 2em;
    padding: 0; }
    .oo-button.circle .btn svg {
      margin: 0; }
  .oo-button.rectangle .btn {
    border-radius: 0; }
  .oo-button.primary .btn {
    background-color: #409eff;
    border-color: #409eff;
    color: #fff; }
    .oo-button.primary .btn::before {
      color: #409eff; }
  .oo-button.info .btn {
    background-color: #50bfff;
    border-color: #50bfff;
    color: #fff; }
  .oo-button.success .btn {
    background-color: #34c849;
    border-color: #34c849;
    color: #fff; }
    .oo-button.success .btn::before {
      color: #34c849; }
  .oo-button.warning .btn {
    background-color: #fdbc40;
    border-color: #fdbc40;
    color: #fff; }
    .oo-button.warning .btn::before {
      color: #fdbc40; }
  .oo-button.error .btn {
    background-color: #fc605d;
    border-color: #fc605d;
    color: #fff; }
    .oo-button.error .btn::before {
      color: #fc605d; }
  .oo-button.dashed .btn {
    border-style: dashed; }
  .oo-button.dotted .btn {
    border-style: dotted; }

@-webkit-keyframes buttonEffectCircle {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes buttonEffectCircle {
  0% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }
