.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;}



details {
  color: #424242;
}
.special-box {
  margin: 12.5px 12.5px;
  padding: 10px 0 10px 95px;
  min-height: 60px;

  /* Theme style */
  background: #eee7da;
  color: #424242;
}
.special-box:before{
  content: "";
  display: block;
  width: 48px;
  height: 48px;
  background-repeat: no-repeat;
  margin: 0 0 -48px -70px;
}
@mixin box($name, $bg) {
  /* Theme style */
  .#{$name} {
    background: $bg;
    padding-right: 4%;
    padding-top: 2%;
    font-family: monospace, serif;
    font-size: 1rem;

    background-image: url("/s/imgM/ic_" + $name + "_black_48px.svg");
    background-position: 25px center;
    background-repeat: no-repeat;
  }
}

@include box('information', #daeaee);
@include box('note', #bed2ff);
@include box('attention', #eee7da);
@include box('question', #e2daee);
@include box('good', #aea);
@include box('bad', #eaa);

details {
  background-color: lightyellow;
  border-radius: 20px;
  margin: 40px;
  padding: 25px;

  summary {
    cursor: pointer;
  }
}

.secret {
  padding: 10px 0 10px 15px;
  min-height: 20px;

  /* Theme style */
  background: #eee;
}
.hiden_block_quote {
  display: none;
}
.special-box-content {
  margin-top: 5px;
}
kbd {
  padding: 2px 6px;
  border-radius: 3px;
  border-bottom-width: 3px;

  /* Theme style */
  text-shadow: 0 1px 0 #fff;
  background-color: #f8f6ea;
  border: 1px solid #e0dab6;
  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;
    line-height : 24px;
    border-radius : 3px;
    font-size: 12px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

    /* Theme style */
    border : 1px solid rgba(27, 31, 35, 0.2);
    background : #c0c0c0 url('image.png') no-repeat center center;
    color: #24292e;
    background-color: #eff3f6;
    background-image: linear-gradient(to top, #fafbfc 0%, #eff3f6 90%);

  }
  > div > div {
    font-weight: bold;
  }
}
.no-style {
  text-decoration: none;
}

@mixin state($border, $border-c) {
  border-radius: 2px;
  outline: none;
  border-color: $border-c;

  /* Theme style */
  box-shadow: 0 0 5px $border-c;
  border: 2px solid $border;
}

/* Theme style */
.valid {
  @include state(#c0392b, #9F9);
}
.invalid {
  @include state(#c0392b, #f99);
}
.glowing {
  @include state(#c0392b, #99F);
}