.card .card {
  margin-left: 2em;
}

.card li > div > .card,
.card li > .card {
  margin-left: 0;
  background-color: none;
}

article.card {
  background-color: #fff;
  border: 1px solid #aaa;
  border-radius: 3px;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.3);
  /*padding: 0.5em;*/
  min-width: 32em;
  max-width: 48em;
  overflow: visible;
  margin: 0.5em 2em 0.5em 0;
}
article.card:hover {
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.6);
}
article.card:target, article.card.selected {
  background-color: #eee;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.4);
}

article.card.graph {
  background-color: #fafafa;
  border: 1px dashed #aaa;
  border-radius: 3px;
  box-shadow: none;
  margin: 1em 2em 1em 0;
  max-width: 48%;
}

article.card.graph > header > .id {
  color: #aaa;
}

.card.embedded {
  border-left: 1pt dashed #666;
  border-bottom-left-radius: 6pt;
}

article.card.embedded {
  border: 1px solid #666;
  background-color: rgba(220, 220, 220, 0.8);
}

article.card.term {
  position: fixed;
  top: 1em;
  left: 42em;
  background-color: rgba(220, 220, 220, 0.8);
}

.card > header {
  overflow: overlay;
  overflow: hidden;
  padding: 0.5em 0.5em 0;
}

.kw {
  color: #888;
}

.card > header > b {
  color: #888;
}

.card > header > .id {
  display: block;
  float: right;
  color: #888;
  text-decoration: none;
  padding: 0.2em 0.4em;
  margin: -0.5em -0.5em 0 2em;
  border-top: none;
  border-right: none;
  border-bottom-left-radius: 5pt;
  box-shadow: inset 1.0pt -1pt 2pt rgba(0, 0, 0, 0.2);
}

article.card > div {
  margin: 0 0.5em;
}

article.card > div.p,
.card > div {
  margin: 0.4em 0.5em;
}

.card div > b {
  color: #888;
}

.card input {
  font-size: inherit;
  border: 1px solid #eee;
  background-color: inherit;
}

a.ref {
  display: inline-block;
  color: #888;
  background-color: #eee;
  border: 1px solid #888;
  border-radius: 6px;
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.2);
  padding: 0.1em 0.6em;
  text-decoration: none;
}

a.ref:hover, a.ref.selected {
  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.4);
}

.context {
  color: #999;
}

.ns {
  margin: 0.6em 0;
}

.context a.ref {
  color: #888;
  background-color: #eee;
  border: 1px solid #888;
}

.card .lang,
.card .datatype {
  display: inline-block;
  color: #333;
  background-color: #fafafa;
  border: 1px solid #aaa;
  border-radius: 3px;
  font-size: 0.72em;
  vertical-align: top;
  padding: 0.0em 0.2em;
  text-decoration: none;
}
.card .datatype {
  color: #48c;
  border: 1px solid #48c;
  background-color: #fafaff;
  font-weight: bold;
}

.card aside.rev {
  background-color: #eee;
  margin: 0;
  padding: 0.5em;
  border-top: 0.2em ridge;
}


.annotation,
#view article.triple {
  background-color: #eaeaea;
  border: 1pt dashed #aaa;
  border-radius: 2pt;
  font-style: italic;
  display: inline-block;
  vertical-align: top;
  margin: 0 0 0.4em 0.4em;
  position: relative;
}
#view header article.triple.card {
  margin: 0 0 0.4em;
  float: right;
  min-width: 99%;
}
.annotation,
.triple {
  font-size: 0.9em;
}
.annotation {
  padding: 0.2em 0.8em 0.2em 0.4em;
  border-top-right-radius: 0.9em;
}
.annotation:after {
  content: "";
  position: absolute;
  top: -1pt;
  right: -1pt;
  display: block;
  border-top-right-radius: 0.9em;
  border-top: 0.9em solid var(--border);
  border-right: 0.9em solid var(--border);
  border-bottom: none;
  border-left: none;
}

article.card .annotation div.p {
  margin: 0.1em 0.2em;
}