dfrpg-tools.css

/* CSS declarations go here */
@font-face {
  font-family: MelroseModernRoboOne;
  src: url("/MelroseModernOneSGOT.otf") format("opentype");
  /* Exclude AINR from this font, and use style Two for them */
  unicode-range: U+0-0040, U+0042-0048, U+004A-004D, U+004F-0051, U+0053-10FFFF
}

@font-face {
  font-family: MelroseModernRoboTwo;
  src: url("/MelroseModernTwoSGOT.otf") format("opentype");
  /* Only use AINR from this version of Melrose Modern */
  unicode-range: U+0041, U+0049, U+004E, U+0052
}

body {
  font-family: "chaparral-pro", serif;
  color: #003459;
}

p {
  display: inline;
  padding: 0;
}

.dfrpg-card {
  float: left;
  margin: 10px;
  padding: 11px 14px;
  width: 275px;
  background-color: #BDD1EC;

  border: 2px solid #00639f;
  border-radius: 18px/16px 0;

  -webkit-box-shadow: 4px 4px 0 0 rgba(0,122,194,1);
  -moz-box-shadow: 4px 4px 0 0 rgba(0,122,194,1);
  box-shadow: 4px 4px 0 0 rgba(0,122,194,1);

  page-break-inside: avoid;
}

.dfrpg-aspect {
  font-family: "gooddog-new", serif;
  text-align: center;
  font-size: 1.5em;
  font-weight: bold;

  border-radius: 18px/16px;
}

.dfrpg-card h3 {
  color: #007AC2;
  margin: 0 4px 8px;
  text-transform: uppercase;
  font-family: MelroseModernRoboOne, MelroseModernRoboTwo, serif;
  letter-spacing: 0.02em;
  font-size: 1.4em;
}

.dfrpg-card h4 {
  color: #007AC2;
  margin: 8px 0;
  text-transform: uppercase;
  font-family: MelroseModernRoboOne, MelroseModernRoboTwo, serif;
  /*letter-spacing: 0.04em;*/
  font-size: 1.10em;
}

.dfrpg-card ul {
  list-style: none;
  padding:0 0 0 1em;
  margin:0;
}

.dfrpg-card .aspects {
  padding-left: 1em;
  text-indent: -1em;
}

.dfrpg-card .aspects .label {
  font-weight: normal;
  font-style: normal;
}

.dfrpg-card li {
  margin-bottom: 6px;
}

.dfrpg-card ul.strong li {
  font-weight: bold;
  font-style: italic;
  padding-left: 1em;
  text-indent: -1.5em;
}

.dfrpg-card ul.strong li:before {
  font-style: normal;
  font-size: larger;
  content: "▼ ";
  color: #007ac2;
}

.dfrpg-card ul.medium li {
  font-weight: bold;
  font-style: italic;
  padding-left: 1em;
}

.dfrpg-card ul.medium li:before {
  font-style: normal;
  font-size: larger;
  color: #007ac2;
}

.dfrpg-card ul.short {
  display: inline;
  list-style: none;
}

.dfrpg-card ul.short li {
  font-weight: bold;
  font-style: italic;
  color: #007ac2;
  display: inline;
}

.dfrpg-card ul.short li:after {
  content: ", ";
}

.dfrpg-card ul.short li:last-child:after {
   content: "";
 }