mi {
  font-family: cmmi10;
}

mo {
  font-family: cmr10;
}

div.hop-busy-anim {
  position: fixed;
  top: 5px;
  right: 5px;
  z-index: 1000000;
  text-align: center;
  margin-left: auto;
  margin-right: auto;
  border: 0;
}

body[hssclass=hop-error] {
  background-color: #555558;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100000;
}

div[hssclass=hop-error-frame] {
  background-color: #222225;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
  z-index: 100001;
  opacity: 0.7;
}

div[hssclass=hop-error] {
  overflow: auto;
  background: white;
  border: 4px dashed;
  border-color: red;
  opacity: 1;
  color: black;
  top: 30px;
  bottom: 30px;
  left: 30px;
  right: 30px;
  position: fixed;
  z-index: 100002;
  margin: 100px;
}

span[hssclass=hop-error-img] {
  display: inline-block;
  position: absolute;
  z-index: 100003;
  left: 20px;
  top: 20px;
  width: 64px;
  height: 64px;
  background-image: url(  "icons/errors/error.png" );
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

div[hssclass=hop-error] > div {
  z-index: 100003;
  position: absolute;
  left: 96px;
  top: 20px;
  right: 1em;
  bottom: 1ex;
  font-size: 14pt;
}

div[hssclass=hop-error-title] {
  font-family: sans-serif;
  font-size: x-large;
  font-weight: bold;
  border-bottom: 1px solid #bbb;
  color: red;
}

div[hssclass=hop-error-msg] {
  margin-bottom: 20px;
  margin-top: 20px;
  padding-bottom: 20px;
  padding-top: 20px;
  font-family: sans-serif;
  font-weight: bold;
}

div[hssclass=hop-error-body] {
  margin-bottom: 20px;
  padding-bottom: 20px;
  font-family: sans-serif;
  font-weight: normal;
}

pre[hssclass=hop-error-notification] {
  font-size: 80%;
  color: #00a;
}

div[hssclass=hop-error-msg] tt {
  font-family: monospace;
  font-weight: 200;
  font-size: 105%;
  color: inherit;
}

div[hssclass=hop-error-trace] {
  border-top: 1px dashed #bbb;
  background-color: inherit;
  padding-top: 2ex;
  padding-bottom: 2ex;
  font-weight: bold;
  font-size: 85%;
  color: black;
}

div[hssclass=hop-error-trace] pre {
  color: #00a;
  font-weight: normal;
  padding-left: 1em;
  font-size: 9pt;
}

div[hssclass=hop-error].warning {
  border-color: darkorange;
}

div[hssclass=hop-error].warning div[hssclass=hop-error-title] {
  border-color: darkorange;
}

div[hssclass=hop-error].warning > span[hssclass=hop-error-img] {
  background-image: url(  "icons/errors/warning.png" );
}

div[hssclass=hop-error].notfound {
  border-color: #f1d630;
}

div[hssclass=hop-error].notfound div[hssclass=hop-error-title] {
  color: #f1d630;
}

div[hssclass=hop-error].notfound > span[hssclass=hop-error-img] {
  background-image: url(  "icons/errors/notfound.png" );
}

div[hssclass=hop-error].remote > span[hssclass=hop-error-img] {
  background-image: url(  "icons/errors/error2.png" );
}

div[hssclass=hop-error].client > span[hssclass=hop-error-img] {
  background-image: url(  "icons/errors/client-error.png" );
}

div[hssclass=hop-error].security > span[hssclass=hop-error-img] {
  background-image: url(  "icons/errors/privacy.png" );
}

span[hssclass=hop-eval-error] {
  border: 3px dashed red;
  color: black;
  font-weight: bold;
}

span[hssclass=hop-parse-error] {
  border: 3px dashed darkorange;
  color: black;
  font-weight: bold;
}

div[hssclass=hop-error] tt {
  color: #00a;
}

@media all and (max-width: 1024px) { div[hssclass=hop-error] {
  margin: 0;
}

 }