#body { overflow: auto; }

h2 { font-size: 1.2em; font-weight: bold; }

#cards { text-align: center; }

#body .card {
  margin: 0.5em;
  padding: 0.75em;
  padding-right: 125px;
  width: 18em;
  height: 12em;
  position: relative;
  display: inline-block;
  background-image: url(/images/cards/squiggly.png);
  background-position: 0% 60%;
  background-repeat: no-repeat;
  border: 1px solid;
  text-align: left;
  font-family: "Arial Narrow", "Arial", "Helvetica", sans-serif;
  overflow: hidden;
}

#body .card * { margin: 0; padding: 0; line-height: 1em; }

#body .card h3 {
  font-size: 2em;
  font-weight: bold;
  line-height: 0.9em;
}
#body .card .position {
  font-weight: bold;
  font-size: 1.2em;
  letter-spacing: -0.025em;
}

#body .card dt,
#body .card dt.empty { display: none; }

#body .card dt { clear: left; }

#body .card .e-mail,
#body .card .cell,
#body .card .fax { display: block; float: left; }
#body .card dt.e-mail::after,
#body .card dt.cell::after,
#body .card dt.fax::after { content: ": "; white-space: pre; }
#body .card dd,
#body .card dt.empty + dd.cell { display: block; min-height: 1.2em; }

#body .card .fax { font-size: 0.8em; }

#body .card dt.empty + dd.cell { font-size: 0.5em; }
#body .card .cell { font-size: 1.1em; }

#body .card .address,
#body .card .phone { position: absolute; right: 0; width: 33.3333%; line-height: 1em; }

#body .card .address { bottom: 2.9em; font-size: 0.8em; }
#body .card .phone { bottom: 1em; font-weight: bold; }
#body .card .toll { bottom: 0; }

#body .card .locality::after { content: ", "; }
#body .card .region { margin-right: 0.5em; }

#body .card .org { position: absolute; left: -195%; bottom: -0.3em; font-size: 1.5em; }
#body .card .office { font-size: 1.4em; }

#body .card .web { position: absolute; left: 0.5em; bottom: 0.7em; }

#body .card .logo { position: absolute; width: 45%; right: 0.5em; top: 0.5em; }
#body .card .logo img {
  display: block;
  position: absolute;
  float: right;
  width: 100%;
}
#body .card .logo::after {
  content: url(/images/cards/unipro.png);
  width: 75px;
  height: 22px;
  position: absolute;
  left: -50%;
  top: 11.5em;
}

/* ==== */

#body .staff > * { margin: 0; }

#body .staff {
  border: 2px solid #dd9;
  margin: 0.5em;
  padding: 0;
  width: 45%;
  float: left;
}

#body .staff > h2 {
  padding: 0.416667em; /* ~ 0.5em / 1.2em */
  padding-bottom: 0;
}

#body .staff > p {
  border-bottom: 2px solid #dd9;
  padding: 0 0.5em 0.5em 0.5em;
}

#body .staff > dl { margin: 0.5em; }

#body .staff dt { float: left; clear: left; padding-right: 0.5em; }
#body .staff dt::after { content: ": "; }

#body .staff dd { margin-bottom: 0.5em; }