:focus {outline:none;}
::-moz-focus-inner {border:0;}

blockquote {
  border-left: 3px solid grey;
  font-style: italic;
  color: #666;
  padding-left: 1em;
}

code {
  font-family: sans-serif;
  display: inline-block;
  padding: 0 .4rem;
  border-radius: 5px;
  font-size: .8rem;
  font-weight: 700;
  background: rgba(0,0,0,.1);
  color: #888;
}
    
html, body {
  font-family: sans-serif;
  scroll-behavior: smooth;
  text-rendering: optimizeSpeed;
  background-color: #111;
  overflow-y: auto;
  scrollbar-width: thin;
  padding: 0 !important;
}

#__nuxt, #__layout {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
    
#main {
  min-height: 200px;
  overflow: hidden;
  scrollbar-width: thin;
  transition: background-color .5s, opacity .5s; //, color 1s;
  background-color: white;
  &.dark {
    background-color: #111;
  }
}

#content {
  flex-grow: 1;
  max-width: 1000px;
  width: 100%;
  margin: 0 auto;
}
    
#header, #footer {
  color: white;
  background-color: #222;
  font-size: 18px;
  // > *{
  //   max-width: 1200px;
  //   margin: 0 auto;
  // }
}

    
#footer {
  a {
    color: orangered;
    transition: color .4s;
    &:hover {
      text-decoration: none;
      color: orange;
    }
  }

  #links a {
    margin-left: 15px;
  }
  min-height: 6em;
  padding-top: 2em;
  font-size: 1em;
}
    
#header .el-menu--horizontal {
  background-color: #222;
  color: white;
  .el-menu-item, .el-submenu__title {
    color: white;
  }

  .el-menu-item:not(.is-disabled):focus,
  .el-menu-item.is-active,
  .el-menu-item:not(.is-disabled):hover,
  .el-submenu:focus > .el-submenu__title,
  .el-submenu:hover > .el-submenu__title,
  .el-submenu.is-active > .el-submenu__title,
  .el-submenu.is-opened {
    color: white;
    background-color: #111;
  }
}


.page-enter-active {
  transition: opacity .05s;
}

.page-enter, .page-leave-active {
  transition: opacity .3s; //, transform .3s;
  opacity: 0;
  // transform: translateX(30px);
}

.el-card {
  max-width: 700px;
  margin: 0 auto;
}

.el-menu-item {
  a {
    color: #303133;
    display: block;
    text-decoration: none;
    text-overflow: ellipsis;
    overflow: hidden;
  }
}

.el-message-box {
  max-width: 90%;
}

.el-button--success.is-plain {
  color: #2c8600;
  border-color: #9de27b;
  background-color: #f9fff6;
}

.el-button--mini, .el-button--mini.is-round {
  padding: 6px 12px;
  font-size: 0.8rem;
}

.bg-dark {
  background-color: #292929 !important;
}

.el-dialog {
  min-height: 300px;
  max-width: 600px;
  width: 100%;
  .el-dialog__body {
    word-break: normal !important;
  }
}

// @media only screen and (max-width: 768px) {
  // .el-card {
    // padding: 0px !important;
    // border-radius: 0px;
  // }
// }