.log {
  position: relative;
  margin-top: 35px
}

.log .log-tail {
  z-index: 80;
  position: absolute;
  display: block;
  top: 0;
  right: 0;
  margin: 10px 10px 0 0
}

.log .log-tail .tail-label {
  display: none;
  cursor: pointer
}

.log .log-tail:hover .tail-label {
  display: inline-block
}

.log .log-tail:hover .tail-status {
  display: none
}

.log .log-tail.scrolling {
  position: fixed;
  right: 32px
}

.log .log-tail.bottom {
  bottom: 45px;
  top: inherit
}

.log .log-tail .tail-status {
  position: relative;
  display: inline-block;
  height: 20px;
  width: 20px;
  vertical-align: middle;
  background-color: #696867;
  border-radius: 50%
}

.log .log-tail .tail-status:after {
  content: "";
  display: block;
  height: 10px;
  width: 10px;
  background: #F2F2F2;
  border-radius: 50%
}

.log .log-tail.active .tail-status {
  background-color: #6b0
}

.log .to-top {
  z-index: 80;
  position: absolute;
  display: block;
  bottom: 2px;
  right: 2px;
  margin-right: 2px;
  padding-right: 16px;
  text-align: right;
  color: #999;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iNSIgd2lkdGg9IjEwIj4KPHBhdGggZmlsbD0iI2MyYzJjMiIgZD0iTTEwLDUsNSwwLDAsNXoiLz4KPC9zdmc+Cgo=) right 6px no-repeat
}

.flash .log .close,.hooks-error .log .close,.log .flash .close,.log .hooks-error .close,.log .icon,.log .popup .close,.popup .log .close {
  width: 1.3em;
  height: 1.1em;
  margin-right: 6px;
  vertical-align: middle
}

.log .icon--down {
  width: .7em;
  height: .9em;
  margin-right: 4px
}

.log-header {
  height: 44px;
  margin: 0;
  padding: .7em .8em .6em;
  text-align: right;
  background-color: #444
}

.log-header a {
  margin-left: .4em
}

.log-body {
  position: relative
}

.log-body pre {
  clear: left;
  min-height: 42px;
  padding: 15px 0;
  color: #F1F1F1;
  font-family: monospace;
  font-size: 12px;
  line-height: 19px;
  white-space: pre-wrap;
  word-wrap: break-word;
  background-color: #2a2a2a;
  counter-reset: line-numbering;
  margin: 0
}

.log-body .cut {
  padding: 20px 15px 0 55px
}

.log-body p {
  position: relative;
  padding: 0 15px 0 55px;
  margin: 0;
  min-height: 16px
}

.log-body p:hover {
  background-color: #444!important
}

.log-body p.highlight {
  background-color: #666
}

.log-body p.highlight a {
  color: #fff
}

.log-body p a {
  display: inline-block;
  text-align: right;
  min-width: 40px;
  margin-left: -33px;
  cursor: pointer;
  text-decoration: none
}

.log-body p a::before {
  content: counter(line-numbering);
  counter-increment: line-numbering;
  padding-right: 1em
}

.log-body .fold {
  position: relative;
  height: 16px;
  overflow: hidden;
  cursor: pointer
}

.log-body .fold.open {
  height: auto
}

.log-body .fold p:first-of-type {
  padding-right: 190px;
  background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAiIHdpZHRoPSIxMCI+CjxwYXRoIGQ9Im0wLjUsMS41LDQuNSw3LDQuNS03eiIgc3Ryb2tlPSIjNTU1IiBzdHJva2Utd2lkdGg9IjAuNSIgZmlsbD0iIzY2NiIvPgo8L3N2Zz4KCg==) 8px 3px no-repeat #333
}

.log-body .fold p:first-of-type.highlight {
  background-color: #777
}

.log-body .fold:not(.open) p:first-of-type {
  visibility: visible;
  height: auto;
  min-height: 16px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGhlaWdodD0iMTAiIHdpZHRoPSIxMCI+CjxwYXRoIGQ9Ik0yLDksOSw1LDIsMXoiIHN0cm9rZT0iIzU1NSIgc3Ryb2tlLXdpZHRoPSIwLjUiIGZpbGw9IiM2NjYiLz4KPC9zdmc+Cgo=)
}

.log-body .fold .fold-name {
  position: absolute;
  z-index: 1;
  display: block;
  top: 2px;
  right: 85px;
  padding: 0 7px 2px;
  line-height: 10px;
  font-size: 10px;
  background-color: #666;
  border-radius: 6px;
  color: #bbb
}

.log-body .fold-end,.log-body .fold-start:not(.fold) {
  display: none
}

.log-body .duration {
  position: absolute;
  display: block;
  top: 2px;
  right: 12px;
  padding: 0 7px 2px;
  line-height: 10px;
  font-size: 10px;
  background-color: #666;
  border-radius: 6px;
  color: #bbb
}

.log-body .loading {
  padding: 25px 0 0 10px
}

.log-notice {
  background-color: #A6ADAD;
  color: #fff;
  min-height: 70px;
  line-height: 35px;
  text-align: center
}
