/* COLORS
============================= */
.repcontrol {
  display: inline-grid;
  grid-template-columns: 1fr 1fr;
  margin: 1%;
  width: 98%; }
  .repcontrol .btn {
    color: transparent !important;
    float: unset;
    padding: 0px;
    text-shadow: none;
    width: 2.5em; }
  .repcontrol .repcontrol_add {
    position: relative; }
  .repcontrol .repcontrol_edit:after,
  .repcontrol .repcontrol_add:after {
    background: transparent;
    color: #004242;
    font-family: pictos;
    font-size: 1.5em;
    position: relative;
    width: 0.2em; }
  .repcontrol .repcontrol_edit:after {
    content: '(';
    left: -100%; }
  .repcontrol .repcontrol_add:after {
    content: '&';
    left: -70%; }
  .repcontrol .repcontrol_edit:hover,
  .repcontrol .repcontrol_add:hover,
  .repcontrol .repcontrol_edit:focus,
  .repcontrol .repcontrol_add:focus {
    background: #d9d9d9; }
  .repcontrol .repcontrol_edit:hover:after,
  .repcontrol .repcontrol_add:hover:after,
  .repcontrol .repcontrol_edit:focus:after,
  .repcontrol .repcontrol_add:focus:after {
    color: #113232; }

.editmode ~ .repcontrol .repcontrol_edit:after {
  content: ')'; }

.itemcontrol {
  z-index: 10; }
  .itemcontrol .repcontrol_del,
  .itemcontrol .repcontrol_move {
    font-size: 1em;
    height: 2em;
    padding: 0px;
    width: 2em; }
  .itemcontrol .repcontrol_del {
    background-color: darkred;
    font-family: pictos; }
    .itemcontrol .repcontrol_del:before {
      display: none; }

div.sheet-npc .repcontrol .repcontrol_add {
  left: 90%; }

/* SWITCHES
============================= */
/* GLOBAL SETTINGS
    =============================  */
* {
  box-sizing: border-box;
  font-family: sans-serif; }

.charsheet {
  min-width: 850px;
  background-size: cover; }
  .charsheet h1, .charsheet h2, .charsheet h3 {
    color: whitesmoke; }
  .charsheet h1 {
    font-size: 1.5em; }
  .charsheet h2 {
    font-size: 1.1em;
    line-height: 1em;
    padding-top: 10%; }
  .charsheet h3 {
    font-size: 1em; }
  .charsheet input[type=text],
  .charsheet input[type=number] {
    border: 3px solid #004242;
    height: 2em;
    width: 100%;
    border-radius: 6px;
    font-style: bold;
    font-size: 1.2em; }
    .charsheet input[type=text]::placeholder,
    .charsheet input[type=number]::placeholder {
      color: #000; }
  .charsheet input[type=text] {
    text-align: left; }
  .charsheet input[type=number][type=number]::-webkit-inner-spin-button, .charsheet input[type=number][type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    margin: 0; }
  .charsheet input[type=number][type="number"]:disabled {
    background: #000;
    color: whitesmoke; }
  .charsheet label {
    width: 100%; }
  .charsheet select {
    -moz-appearance: none;
    -webkit-appearance: none;
    background: whitesmoke;
    border: 3px solid #004242;
    color: #000;
    height: 2.2em;
    line-height: 1em;
    margin: 0px;
    padding: 0% 0% 0% 5%;
    width: 100%; }
    .charsheet select optgroup {
      font-weight: bold; }
    .charsheet select option {
      text-align: center; }
  .charsheet textarea::placeholder {
    color: #000; }

/* SWITCHES
============================= */
/* The switch - the box around the slider */
.sheet-switch {
  position: relative;
  display: inline-block;
  width: 50px;
  height: 24px; }

/* Hide default HTML checkbox */
.sheet-switch input {
  opacity: 0;
  width: 0;
  height: 0; }

/* The slider */
.sheet-slider {
  -webkit-transition: .4s;
  background-color: #4d4d4d;
  border-radius: 34px;
  bottom: 0;
  cursor: pointer;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transition: .4s; }

.sheet-slider:before {
  -webkit-transition: .4s;
  background-color: whitesmoke;
  border-radius: 50%;
  bottom: 4px;
  content: "";
  height: 16px;
  left: 4px;
  position: absolute;
  transition: .4s;
  width: 16px; }

input:checked + .sheet-slider {
  background-color: #004242; }

input:focus + .sheet-slider {
  box-shadow: 0 0 1px #004242; }

input:checked + .sheet-slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px); }

/* GRID
============================= */
div.sheet-grid {
  display: inline-grid;
  grid-column-gap: 1%; }

/* GENERIC STYLES
============================= */
.sheet-border-bottom {
  border-bottom: 0.15em solid #004242; }

.sheet-center {
  text-align: center; }

.sheet-background-color {
  background-color: rgba(1, 1, 1, 0.71); }

.sheet-dashed {
  border: 3px dashed rgba(1, 1, 1, 0.71); }

 /* PC
============================= */
div.sheet-pc {
  background-color: rgba(1, 1, 1, 0.71);
  grid-column-gap: 0.1%;
  grid-row-gap: 1%;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;
  padding-bottom: 10%;
  width: 100%;
 /* CHARACTER INFO
----------------------------- */
 /* CHARACTER QUOTE
----------------------------- */
  	/* CHARACTER SHAOOW
      ----------------------------- */
  /* TABS
   ----------------------------- */
  	/* TOUGHNESS & CORRUPTION SHARED STYLES
   ----------------------------- */
  	/* TOUGHNESS
   ----------------------------- */
  	/* CORRUPTION
   ----------------------------- */
  	/* ATTRIBUTES
   ----------------------------- */
  	/* ATTACKS & DEFENSE SHARED STYLES
   ----------------------------- */
  	/* ATTACKS
   ----------------------------- */
  /* DEFENSE
  ----------------------------- */
  	/* TRAITS & ABILITIES
   ----------------------------- */
  	/* TRAITS
   ----------------------------- */
  	/* ABILITIES
   ----------------------------- */ }
  div.sheet-pc div.sheet-character-info {
    grid-template-columns: 22em 2fr 3fr 2fr 1fr 1fr;
    grid-area: 1 / 1 / 1 / 3; }
    div.sheet-pc div.sheet-character-info label {
      grid-row: 1; }
    div.sheet-pc div.sheet-character-info span {
      grid-row: 2; }
  div.sheet-pc div.sheet-character-quote {
    grid-template-columns: 1fr 90% 1fr;
    grid-column: 1 / 2; }
    div.sheet-pc div.sheet-character-quote input[type="text"] {
      font-style: italic; }
    div.sheet-pc div.sheet-character-quote label {
      grid-column: 2 / 3;
      font-style: italic; }
    div.sheet-pc div.sheet-character-quote span.sheet-quote {
      transform: rotate(180deg);
      position: relative;
      font-size: 3em; }
      div.sheet-pc div.sheet-character-quote span.sheet-quote:nth-of-type(1) {
        transform: rotate(360deg);
        top: -20%; }
      div.sheet-pc div.sheet-character-quote span.sheet-quote:nth-of-type(2) {
        transform: rotate(180deg);
        top: -20%; }
  div.sheet-pc div.sheet-character-shadow {
    grid-column: 2 / 3; }
  div.sheet-pc div.sheet-tabs {
    grid-column: 1 / 4;
    grid-template-columns: 1fr 1fr 1fr;
    border-bottom: 5px solid #000; }
    div.sheet-pc div.sheet-tabs input.sheet-tab:nth-of-type(1),
    div.sheet-pc div.sheet-tabs span.sheet-tab:nth-of-type(1) {
      grid-row: 1;
      grid-column: 1 / 1; }
    div.sheet-pc div.sheet-tabs input.sheet-tab:nth-of-type(2),
    div.sheet-pc div.sheet-tabs span.sheet-tab:nth-of-type(2) {
      grid-row: 1;
      grid-column: 2 / 2; }
    div.sheet-pc div.sheet-tabs input.sheet-tab:nth-of-type(3),
    div.sheet-pc div.sheet-tabs span.sheet-tab:nth-of-type(3) {
      grid-row: 1;
      grid-column: 3 / 3; }
    div.sheet-pc div.sheet-tabs input.sheet-tab:nth-of-type(4),
    div.sheet-pc div.sheet-tabs span.sheet-tab:nth-of-type(4) {
      grid-row: 1;
      grid-column: 4 / 4; }
  div.sheet-pc div.sheet-tough-corr-row {
    margin: 0px 20%; }
    div.sheet-pc div.sheet-tough-corr-row label {
      grid-row: 2; }
    div.sheet-pc div.sheet-tough-corr-row span {
      grid-row: 3; }
  div.sheet-pc div.sheet-toughness {
    grid-column: 1 / 2;
    grid-template-columns: 1fr 1fr 1fr; }
    div.sheet-pc div.sheet-toughness h1 {
      grid-area: 1 / 1 / 1 / 4; }
  div.sheet-pc div.sheet-corruption {
    grid-column: 2 / 3;
    grid-template-columns: 5em 1fr 1fr 1fr; }
    div.sheet-pc div.sheet-corruption button[type="roll"] {
      grid-row: 2;
      background-image: url(http://i.imgur.com/MC61Qmt.png?1);
      background-position: center;
      height: 1.5em; }
      div.sheet-pc div.sheet-corruption button[type="roll"]:before {
        display: none; }
    div.sheet-pc div.sheet-corruption h1 {
      grid-area: 1 / 1 / 1 / 5; }
    div.sheet-pc div.sheet-corruption select {
      grid-row: 3; }
  div.sheet-pc div.sheet-attributes {
    grid-column: 1 / 3;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    margin-bottom: 2%; }
    div.sheet-pc div.sheet-attributes input[type="number"] {
      background: whitesmoke;
      border-radius: 3em;
      border: 3px solid #004242;
      color: #000;
      font-size: 1.5em;
      height: 3em;
      text-align: center;
      width: 3em;
      grid-row: 1;
      margin-left: 15%;
      padding: 0 .5em; }
    div.sheet-pc div.sheet-attributes button {
      background: rgba(16, 32, 48, 0.78);
      grid-row: 2;
      height: 1.5em;
      overflow: hidden;
      text-align: center;
      font-size: 1.3em;
      border-bottom: 2px solid #113232;
      border-right: 2px solid #113232;
      color: whitesmoke;
      text-shadow: 1px 1px 2px #004242, 0 0 25px #113232, 0 0 5px #113232; }
      div.sheet-pc div.sheet-attributes button:before {
        display: none; }
      div.sheet-pc div.sheet-attributes button span {
        box-shadow: 3px 3px 2px #4d4d4d inset, -3px -3px 1px #113232 inset;
        padding: .5em 0; }
  div.sheet-pc div.sheet-attacks,
  div.sheet-pc div.sheet-defense {
    grid-column: 1 / 3; }
    div.sheet-pc div.sheet-attacks button[type="roll"],
    div.sheet-pc div.sheet-defense button[type="roll"] {
      background-position: center;
      background-repeat: no-repeat;
      height: 100%;
      width: 100%; }
      div.sheet-pc div.sheet-attacks button[type="roll"]:before,
      div.sheet-pc div.sheet-defense button[type="roll"]:before {
        display: none; }
    div.sheet-pc div.sheet-attacks div.sheet-section-header h1,
    div.sheet-pc div.sheet-defense div.sheet-section-header h1 {
      grid-row: 1; }
    div.sheet-pc div.sheet-attacks div.sheet-section-header h2,
    div.sheet-pc div.sheet-defense div.sheet-section-header h2 {
      grid-row: 1;
      border-top-left-radius: 3em;
      border-top-right-radius: 3em; }
    div.sheet-pc div.sheet-attacks div.sheet-section-header h3,
    div.sheet-pc div.sheet-defense div.sheet-section-header h3 {
      grid-row: 3; }
  div.sheet-pc div.sheet-attacks h1 {
    grid-column: 1 / 6; }
  div.sheet-pc div.sheet-attacks h2 {
    grid-column: 6 / 9; }
  div.sheet-pc div.sheet-attacks button[type="roll"] {
    background-image: url(http://i.imgur.com/EPH4536.png); }
  div.sheet-pc div.sheet-attacks div.sheet-section-header,
  div.sheet-pc div.sheet-attacks div.sheet-section-body {
    grid-template-columns: 2.5em 15em 8em 5em 1fr 5em 5em 5em;
    width: 100%; }
  div.sheet-pc div.sheet-defense h1 {
    grid-column: 1 / 7; }
  div.sheet-pc div.sheet-defense h2 {
    grid-column: 7 / 10; }
  div.sheet-pc div.sheet-defense button[type="roll"] {
    background-image: url(http://i.imgur.com/QFy0qCe.png?); }
  div.sheet-pc div.sheet-defense div.sheet-section-header,
  div.sheet-pc div.sheet-defense div.sheet-section-body {
    grid-template-columns: 2.5em 15em 4em 8em 5em 1fr 4em 5em 5em;
    width: 100%; }
  div.sheet-pc div.sheet-section-pc2 {
    grid-column: 1 / 3; }
    div.sheet-pc div.sheet-section-pc2 div.sheet-left-side,
    div.sheet-pc div.sheet-section-pc2 div.sheet-right-side {
      display: inline-block;
      vertical-align: top;
      width: 48%; }
    div.sheet-pc div.sheet-section-pc2 div.sheet-left-side {
      margin-right: 2%; }
  div.sheet-pc div.sheet-traits,
  div.sheet-pc div.sheet-abilities {
    margin: 0px 5%;
    grid-template-rows: min-content;
    width: 100%; }
    div.sheet-pc div.sheet-traits button[type=roll],
    div.sheet-pc div.sheet-abilities button[type=roll] {
      color: #000; }
      div.sheet-pc div.sheet-traits button[type=roll]:before,
      div.sheet-pc div.sheet-abilities button[type=roll]:before {
        display: block; }
    div.sheet-pc div.sheet-traits h1,
    div.sheet-pc div.sheet-abilities h1 {
      grid-area: 1 / 1 / 1 / 4; }
    div.sheet-pc div.sheet-traits label.sheet-long,
    div.sheet-pc div.sheet-abilities label.sheet-long {
      grid-column: 2 / 7; }
    div.sheet-pc div.sheet-traits select[name*="attribute"],
    div.sheet-pc div.sheet-abilities select[name*="attribute"] {
      grid-column: 1 / 3; }
    div.sheet-pc div.sheet-traits input[type="text"][name*="type"],
    div.sheet-pc div.sheet-abilities input[type="text"][name*="type"] {
      grid-column: 3 / 5; }
    div.sheet-pc div.sheet-traits textarea,
    div.sheet-pc div.sheet-abilities textarea {
      grid-column: 1 / 7; }
    div.sheet-pc div.sheet-traits div.sheet-section-body,
    div.sheet-pc div.sheet-abilities div.sheet-section-body {
      margin-bottom: 2%; }
    div.sheet-pc div.sheet-traits div.sheet-section-header,
    div.sheet-pc div.sheet-abilities div.sheet-section-header {
      max-height: 2.5em; }
  div.sheet-pc div.sheet-traits div.sheet-section-header,
  div.sheet-pc div.sheet-traits div.sheet-section-body,
  div.sheet-pc div.sheet-abilities div.sheet-section-header,
  div.sheet-pc div.sheet-abilities div.sheet-section-body {
    grid-template-columns: 2.5em 1fr 1fr 1fr 1fr 1fr;
    width: 98%; }
  div.sheet-pc div.sheet-boon,
  div.sheet-pc div.sheet-burdens {
    margin: 0px 5%;
    grid-template-rows: min-content;
    width: 100%; }
    div.sheet-pc div.sheet-boon div.sheet-section-header,
    div.sheet-pc div.sheet-boon div.sheet-section-body,
    div.sheet-pc div.sheet-burdens div.sheet-section-header,
    div.sheet-pc div.sheet-burdens div.sheet-section-body {
      grid-template-columns: 1fr 1fr 1fr 1fr; }
      div.sheet-pc div.sheet-boon div.sheet-section-header label:nth-of-type(1),
      div.sheet-pc div.sheet-boon div.sheet-section-body label:nth-of-type(1),
      div.sheet-pc div.sheet-burdens div.sheet-section-header label:nth-of-type(1),
      div.sheet-pc div.sheet-burdens div.sheet-section-body label:nth-of-type(1) {
        grid-row: 1;
        grid-column: 1 / 5; }
    div.sheet-pc div.sheet-boon textarea,
    div.sheet-pc div.sheet-burdens textarea {
      grid-column: 1 / 5; }
  div.sheet-pc div.sheet-traits,
  div.sheet-pc div.sheet-boon {
    grid-column: 1 / 2; }
  div.sheet-pc div.sheet-abilities,
  div.sheet-pc div.sheet-burdens {
    grid-column: 2 / 3; }
  div.sheet-pc div.sheet-section-pc3,
  div.sheet-pc div.sheet-section-pc4 {
    grid-column: 1 / 3; }
  div.sheet-pc div.sheet-section-pc3 select {
    width: 15%; }

 /* OLD CSS
============================= */
/*** Background ***/
.sheet-col-small {
  text-align: center;
  min-width: 5em; }

.sheet-col-medium {
  text-align: center;
  min-width: 6em; }

.sheet-row > div {
  display: inline-block; }

.sheet-row {
  padding: 0 30px 10px 30px; }

.sheet-2colrow > .sheet-col {
  margin: 10px !important; }

/*** Font ***/
::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: #fafafa;
  background-color: transparent; }

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #fafafa;
  opacity: 1; }

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #fafafa;
  opacity: 1; }

:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #fafafa; }

/*** Pages ***/
.sheet-row div[class^="repcontrol"] {
  padding: 1em; }

input.sheet-tab {
  width: 100%;
  height: 23px;
  cursor: pointer;
  position: relative;
  opacity: 0;
  z-index: 9999;
  vertical-align: top; }

span.sheet-tab {
  text-align: center;
  display: inline-block;
  padding-left: 3px;
  padding-right: 3px;
  height: 23px;
  cursor: pointer;
  position: relative;
  margin-top: 0px;
  color: #FAFAFA;
  border-radius: 5px 5px 0px 0px;
  font-size: 12px;
  box-shadow: 2px 2px 5px #FAFAFA inset,-2px -2px 5px #202020 inset;
  vertical-align: top;
  background-color: #303030; }

input.sheet-tab::before {
  display: inline-block;
  margin-top: -30px;
  content: attr(title);
  text-align: center;
  width: 100%;
  height: 100%; }

input.sheet-tab:checked::before {
  background: #4E686A;
  color: blue; }

/* Next section makes a page visible when the tab is clicked */
div.sheet-section-pc1,
div.sheet-section-pc2,
div.sheet-section-pc3,
div.sheet-section-pc4 {
  display: none; }

input.sheet-tab[value="1"] ~ div.sheet-pc div.sheet-section-pc1 {
  display: inline-grid; }

input.sheet-tab[value="1"] ~ div.sheet-pc div.sheet-section-pc2,
input.sheet-tab[value="2"] ~ div.sheet-pc div.sheet-section-pc2,
input.sheet-tab[value="3"] ~ div.sheet-pc div.sheet-section-pc3,
input.sheet-tab[value="4"] ~ div.sheet-pc div.sheet-section-pc4 {
  display: inline-block; }

input.sheet-tab:checked + span.sheet-tab {
  box-shadow: -2px -2px 5px #FAFAFA inset, 2px 2px 5px #202020 inset;
  opacity: 1; }

label {
  margin: 0;
  padding: 0;
  text-align: left;
  font-size: 1em;
  font-weight: normal;
  color: #D8D8D8; }

input[type=radio] {
  margin: 0 5px 0 5px; }

input[type=number] {
  -moz-appearance: textfield; }

input[type="number"].sheet-number-box-small {
  border: 3px solid #004040;
  padding: 0 0 0 3px;
  width: 3.1em;
  height: 2em;
  text-align: left;
  vertical-align: middle;
  border-radius: 6px; }

.sheet-roll {
  width: 25px;
  height: 25px;
  border: 2px solid #004040;
  border-radius: 6px; }

input[type="checkbox"] {
  border: 3px solid #004040;
  color: #000000;
  background: #FBFCFC;
  border-radius: 6px;
  font-size: 12px;
  box-shadow: 1px 1px 2px #000101, -1px -1px 2px #000101,1px -1px 2px #000101, -1px 1px 2px #000101; }

textarea {
  padding: 3px;
  box-sizing: border-box;
  margin: 0;
  resize: vertical;
  overflow: hidden;
  display: block;
  text-align: left;
  border: 3px solid #004040;
  color: #000000;
  background: #FBFCFC;
  border-radius: 6px;
  height: 6.3em;
  width: 100%; }

input[name^="attr_friend"] {
  width: 48%; }

.sheet-table fieldset,
.sheet-table {
  display: table;
  text-align: center; }

.sheet-table > fieldset,
.sheet-table > div {
  display: table-row;
  width: 75px; }

.sheet-table fieldset > div,
.sheet-table > div > div {
  display: table-cell;
  vertical-align: bottom; }

.sheet-table label {
  text-align: center; }

/*** Buttons ***/
/*** Roll Templates ***/
.sheet-rolltemplate-defense,
.sheet-rolltemplate-attack, .sheet-rolltemplate-attrib {
  padding: 1px; }

.sheet-rolltemplate-attack table {
  font-family: "Georgia";
  background-color: #a0a0a0;
  background: url(http://www.designbolts.com/wp-content/uploads/2013/02/Rough-Grey-Tilable-Pattern-For-Website-Background.jpg) top left repeat;
  width: 100%;
  border: 3px solid #7f0000; }

.sheet-rolltemplate-attack th {
  border-top: 3px solid #7f0000;
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  font-weight: bold;
  color: #7f0000; }

.sheet-rolltemplate-attack td {
  padding: 3px; }

.sheet-rolltemplate-attack .sheet-attkhead {
  border-bottom: 3px solid #7f0000; }

.sheet-rolltemplate-attack .sheet-attkcat {
  text-align: right;
  width: 50%; }

.sheet-rolltemplate-attack .sheet-attkresult {
  font-weight: bold;
  text-align: left;
  width: 50%;
  padding-left: 5px; }

.sheet-rolltemplate-attack .sheet-attkhit {
  color: #007f00; }

.sheet-rolltemplate-attack .sheet-attkmiss {
  color: #7f0000; }

.sheet-rolltemplate-attack .sheet-effex {
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  /*    border-top:3px solid #7f0000; */ }

.sheet-rolltemplate-defense table {
  font-family: "Georgia";
  background-color: #a0a0a0;
  background: url(http://www.designbolts.com/wp-content/uploads/2013/02/Rough-Grey-Tilable-Pattern-For-Website-Background.jpg) top left repeat;
  width: 100%;
  border: 3px solid #00007f; }

.sheet-rolltemplate-defense th {
  border-top: 3px solid #00007f;
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  font-weight: bold;
  color: #00007f; }

.sheet-rolltemplate-defense td {
  padding: 3px; }

.sheet-rolltemplate-defense .sheet-defhead {
  border-bottom: 3px solid #00007f; }

.sheet-rolltemplate-defense .sheet-defcat {
  text-align: right;
  width: 50%; }

.sheet-rolltemplate-defense .sheet-defresult {
  font-weight: bold;
  text-align: left;
  width: 50%;
  padding-left: 5px; }

.sheet-rolltemplate-defense .sheet-defhit {
  color: #7f0000; }

.sheet-rolltemplate-defense .sheet-defmiss {
  color: #007f00; }

.sheet-rolltemplate-defense .sheet-effex {
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  /*    border-top:3px solid #00007f; */ }

.sheet-rolltemplate-attrib table {
  font-family: "Georgia";
  background-color: #a0a0a0;
  background: url(http://www.designbolts.com/wp-content/uploads/2013/02/Rough-Grey-Tilable-Pattern-For-Website-Background.jpg) top left repeat;
  width: 100%;
  border: 3px solid #007f00; }

.sheet-rolltemplate-attrib th {
  border-top: 3px solid #007f00;
  border-bottom: 3px solid #007f00;
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  color: #007f00; }

.sheet-rolltemplate-attrib td {
  padding: 3px; }

.sheet-rolltemplate-attrib .sheet-attribcat {
  text-align: right;
  width: 50%; }

.sheet-rolltemplate-attrib .sheet-attribresult {
  font-weight: bold;
  text-align: left;
  width: 50%;
  padding-left: 5px; }

.sheet-rolltemplate-attrib .sheet-attribhit {
  color: #007f00;
  font-weight: bold; }

.sheet-rolltemplate-attrib .sheet-attribmiss {
  color: #7f0000;
  font-weight: bold; }

.sheet-rolltemplate-attrib .sheet-effex {
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  border-top: 3px solid #007f00; }

.sheet-rolltemplate-abilitycheck table {
  font-family: "Georgia";
  background-color: #a0a0a0;
  background: url(http://www.designbolts.com/wp-content/uploads/2013/02/Rough-Grey-Tilable-Pattern-For-Website-Background.jpg) top left repeat;
  width: 100%;
  border: 3px solid #cc6600; }

.sheet-rolltemplate-abilitycheck th {
  border-top: 3px solid #cc6600;
  border-bottom: 3px solid #cc6600;
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  color: #cc6600; }

.sheet-rolltemplate-abilitycheck td {
  padding: 3px; }

.sheet-rolltemplate-abilitycheck .sheet-attribcat {
  text-align: right;
  width: 50%; }

.sheet-rolltemplate-abilitycheck .sheet-attribresult {
  font-weight: bold;
  text-align: left;
  width: 50%;
  padding-left: 5px; }

.sheet-rolltemplate-abilitycheck .sheet-attribhit {
  color: #007f00;
  font-weight: bold; }

.sheet-rolltemplate-abilitycheck .sheet-attribmiss {
  color: #7f0000;
  font-weight: bold; }

.sheet-rolltemplate-abilitycheck .sheet-effex {
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  border-top: 3px solid #cc6600; }

.sheet-rolltemplate-powercheck table {
  font-family: "Georgia";
  background-color: #a0a0a0;
  background: url(http://www.designbolts.com/wp-content/uploads/2013/02/Rough-Grey-Tilable-Pattern-For-Website-Background.jpg) top left repeat;
  width: 100%;
  border: 3px solid #9900ff; }

.sheet-rolltemplate-powercheck th {
  border-top: 3px solid #9900ff;
  border-bottom: 3px solid #9900ff;
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  color: #9900ff; }

.sheet-rolltemplate-powercheck td {
  padding: 3px; }

.sheet-rolltemplate-powercheck .sheet-attribcat {
  text-align: right;
  width: 50%; }

.sheet-rolltemplate-powercheck .sheet-attribresult {
  font-weight: bold;
  text-align: left;
  width: 50%;
  padding-left: 5px; }

.sheet-rolltemplate-powercheck .sheet-attribhit {
  color: #007f00;
  font-weight: bold; }

.sheet-rolltemplate-powercheck .sheet-attribmiss {
  color: #7f0000;
  font-weight: bold; }

.sheet-rolltemplate-powercheck .sheet-effex {
  background-color: #ffffff;
  background: url(https://www.toptal.com/designers/subtlepatterns/patterns/concrete_seamless.png) top left repeat;
  text-align: center;
  border-top: 3px solid #9900ff; }

.charsheet {
  background-color: #000303;
  background-image: url("http://i.imgur.com/XOomnMY.jpg?1");
  background-repeat: no-repeat;
  background-position: 0px 33px;
  text-shadow: 1px 1px 2px #000101, -1px -1px 2px #000101,1px -1px 2px #000101, -1px 1px 2px #000101, 1px 1px 12px #000101, -1px -1px 12px #000101,1px -1px 12px #000101, -1px 1px 12px #000101;
  color: #FAFAFA; }

/*** Misc***/
[class^="sheet-faded"] {
  background-color: rgba(0, 0, 0, 0.3);
  display: inline;
  border-radius: 1em 1em 0 0; }

.sheet-faded-nam {
  vertical-align: middle;
  width: 76px;
  padding: 4px; }

.sheet-faded-nam > div {
  display: inline-block;
  width: 32%; }

.sheet-faded-text {
  vertical-align: middle;
  padding: 4px; }

.sheet-label-row div,
.sheet-label-row label {
  display: inline-block; }

.sheet-label-row div > span {
  margin-right: 6px; }

.sheet-label-large {
  padding: 0;
  font-size: 1.5em;
  margin: 0px 0px .5em 0px; }

.sheet-row-with-labels div {
  display: inline-block;
  vertical-align: bottom; }

.sheet-row-with-labels label {
  text-align: center; }

.sheet-ability-section {
  width: 360px;
  display: inline-block;
  padding: 4px 4px 0 4px; }

.sheet-attributes {
  display: inline-block;
  width: 100%;
  vertical-align: top;
  height: 80px;
  border-radius: 6px;
  text-align: center; }

.sheet-attributes > div {
  display: inline-block;
  padding-bottom: 5px;
  font-size: 16px;
  width: 10.5%; }

.charsheet * {
  box-sizing: border-box;
  font-family: "Georgia"; }