.directory {
  cursor: pointer;
  list-style-type: disc;
}
.file {
  list-style: circle;
  a {
    padding-top: 5px;
    padding-bottom: 5px;
  }
}

.qcm_item p {margin: 0; padding: 0; display: inline;}
.qcm_check, .qcm_radio {padding-left: 32px;}

blockquote {
  color: #777;
  padding: 1px 2%;
  border-left: 5px solid #ccc;
}

.special-box {
  background: #eee7da;
  margin: 12.5px 12.5px;
  padding: 10px 0 10px 95px; 
  color: #424242;
  min-height: 60px;
}
.special-box:before{
  content: "";
  display: block;
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  margin: 0 0 -48px -70px;
}
@mixin box($name, $bg) {
  .#{$name} {
    background: $bg;
    padding-right: 4%;
    padding-top: 2%;
    font-family: monospace, serif;
    font-size: 14px;
    &:before {
      background-image: url("/s/imgM/ic_" + $name + "_black_48px.svg");
    }
  }
}
@include box('information', #daeaee);
@include box('comment', #eea);
@include box('attention', #eee7da);
@include box('question', #e2daee);
@include box('good', #aea);
@include box('bad', #eaa);

.secret {
  background: #eee;
  padding: 10px 0 10px 15px;
  min-height: 20px;
}
.hiden_block_quote {
  display: none;
}
.special-box-content {
  margin-top: 5px;
}
kbd {
  background-color: #f8f6ea;
  padding: 2px 6px;
  border-radius: 3px;
  border: 1px solid #e0dab6;
  border-bottom-width: 3px;
  text-shadow: 0 1px 0 #fff;
  color: #5e551f;
}
.view {
  position: relative;
}
.raw_button {
  position: absolute;
  top: 10px;
  right: 0;

  margin      : 0;
  padding     : 0;
  border      : 0;
  background  : transparent;
  font-family : inherit;
  font-size   : 1em;
  cursor      : pointer;
  > div {
    width       : 40px;
    height      : 24px;
    background  : #c0c0c0 url('image.png') no-repeat center center;
    line-height : 24px;
    border        : 1px solid rgba(27, 31, 35, 0.2);
    border-radius : 3px;
    font-size: 12px;

    color: #24292e;
    background-color: #eff3f6;
    background-image: linear-gradient(to top, #fafbfc 0%, #eff3f6 90%);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  }
  > div > div {
    font-weight: bold;
  }
}
.no-style {
  text-decoration: none;
}

@mixin state($border, $border-c) {
  border: 2px solid $border;
  border-radius: 2px;
  outline: none;
  border-color: $border-c;
  box-shadow: 0 0 5px $border-c;
}
.valid {
  @include state(#c0392b, #9F9);
}
.invalid {
  @include state(#c0392b, #f99);
}
.glowing {
  @include state(#c0392b, #99F);
}