loser.css

/* ----------------------------------------- */
/*  Fonts                                    */
/* ----------------------------------------- */
@font-face {
  font-family: 'Modesto Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('../../fonts/modesto-condensed/modesto-condensed.woff2') format('woff2');
}
@font-face {
  font-family: 'Modesto Condensed';
  font-style: normal;
  font-weight: 700;
  src: url('../../fonts/modesto-condensed/modesto-condensed-bold.woff2') format('woff2');
}
.modesto {
  font-family: "Modesto Condensed", "Palatino Linotype", serif;
  font-size: 20px;
  font-weight: 700;
}

/* ----------------------------------------- */
/*  Flexbox                                  */
/* ----------------------------------------- */
.flexrow {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.flexrow > * {
  flex: 1;
}

.flexcol {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: flex-start;
}

.flexcol > * {
  flex: 1;
}

/* ----------------------------------------- */
/*  loser app                                */
/* ----------------------------------------- */
.loser .window-content {
  height: 100%;
  width: 100%;
  padding: 0px;
  margin: 0px;
  font-family: "Modesto Condensed", "Palatino Linotype", serif;
  font-size: 15px;
}

/* ----------------------------------------- */
/*  sheet                                    */
/* ----------------------------------------- */
.loser.sheet span.sep {
  flex: none;
  margin: 0 1px;
  display: inline;
  position: relative;
  color: #7a7971;
  font-weight: normal;
}

.loser.sheet input:read-only,
.loser.sheet textarea:read-only {
  border: none;
}

.loser.sheet .rollable:hover {
  cursor: pointer;
}

.loser.sheet a.rollable:hover {
  text-shadow: 0 0 10px red;
}

.loser.sheet h4.rollable:hover,
.loser.sheet .rollable:hover > h4 {
  color: #000;
  text-shadow: 0 0 10px red;
}

.loser.sheet .window-content .tab {
  height: 100%;
  overflow-y: auto;
  align-content: flex-start;
}

.loser.sheet .sheet-navigation {
  flex: 0 0 30px;
  margin-bottom: 5px;
  font-family: "Modesto Condensed", "Palatino Linotype", serif;
  font-size: 20px;
  font-weight: 700;
}
.loser.sheet .sheet-navigation .item {
  height: 30px;
  line-height: 32px;
  margin: 0 24px;
  border-bottom: 3px solid #b5b3a4;
}
.loser.sheet .sheet-navigation .item.active {
  border-bottom: 3px solid #44191A;
}

.loser.sheet .form-group.stacked label.checkbox,
.loser.sheet .form-group.stacked label.radio {
  flex: auto;
  text-align: left;
}

/* ----------------------------------------- */
/*  actor                                    */
/* ----------------------------------------- */

/* ----------------------------------------- */
/*  playable                                */
/* ----------------------------------------- */
.loser.sheet.actor.playable {
  min-width: 720px;
  min-height: 680px;
}

.loser.sheet.actor.playable .core-details {
  border-bottom: 2px groove #eeede0;
  flex: 0 0 164px;
  height: 164px;
}

.loser.sheet.actor.playable .core-details img.pic {
  flex: 0 0 160px;
  max-width: 160px;
  height: 160px;
  border: none;
  border-right: 2px groove #eeede0;
}

.loser.sheet.actor.playable .core-details .facts {
  margin-left: 10px;
  margin-right: 10px;
}

.loser.sheet.actor.playable .core-details .facts .charname {
  font-size: 24px;
  flex: 0 0 24px;
  margin-top: 4px;
}

.loser.sheet.actor.playable .basics {
  flex: 1 0 auto;
  margin: 0;
  padding: 0;
  margin-top: 10px;
  max-height: 36px;
}

.loser.sheet.actor.playable .basics .charclass {
  flex: 1 0 100px;
  width: 100px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .basics .charlevel {
  flex: 1 0 20px;
  width: 20px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .basics .charxp {
  flex: 1 0 40px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .basics .charalign {
  flex: 1 0 100px;
  width: 100px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .basics .charsecskill {
  flex: 1 0 100px;
  width: 100px;
  margin: none;
}

.loser.sheet.actor.playable ul.attributes {
  flex: 0 0 80px;
  list-style: none;
  margin: 0;
  padding: 0;
  min-width: 400px;
}

.loser.sheet.actor.playable ul.attributes li.attribute {
  height: 80px;
  margin: 0 5px 0 0;
  border: 2px groove #eeede0;
  border-radius: 4px;
  text-align: center;
  padding-bottom: 12px;
}

.loser.sheet.actor.playable ul.attributes li.attribute:last-child {
  margin: 0;
}

.loser.sheet.actor.playable ul.attributes li.attribute .attribute-value {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 28px;
  line-height: 28px;
  font-family: "Modesto Condensed", "Palatino Linotype", serif;
  font-size: 20px;
  font-weight: 700;
}

.loser.sheet.actor.playable ul.attributes li.attribute .attribute-value > * {
  font-weight: 400;
  font-size: 24px;
}

.loser.sheet.actor.playable ul.attributes li.attribute .attribute-value.multiple input {
  flex: 0 0 33%;
}

.loser.sheet.actor.playable ul.attributes li.attribute .attribute-footer {
  flex: 0 0 18px;
  margin-top: -1px;
  line-height: 18px;
  font-family: "Signika", sans-serif;
  font-size: 12px;
  font-weight: 400;
  white-space: nowrap;
}

.loser.sheet.actor.playable h4.box-title {
  height: 18px;
  line-height: 16px;
  margin: 4px 8px 2px;
  font-family: "Modesto Condensed", "Palatino Linotype", serif;
  font-size: 20px;
  font-weight: 700;
  font-size: 18px;
  color: #4b4a44;
  border-bottom: 1px solid #c9c7b8;
  white-space: nowrap;
}

.loser.sheet.actor.playable .other-attributes {
  flex: 1 0 60px;
  width: 60px;
  margin-left: 10px;
}

.loser.sheet.actor.playable .other-attributes .loyalty {
  width: 30px;
}

.loser.sheet.actor.playable .other-attributes .bab {
  width: 30px;
}

.loser.sheet.actor.playable .sst {
  flex: 1 0 auto;
  border-bottom: 2px groove #eeede0;
  padding: 0;
  margin: 0;
  margin-top: 8px;
  max-height: 300px;
}

.loser.sheet.actor.playable .sst ul {
  flex: 1 0 250px;
  list-style: none;
  height: 250px;
}

.loser.sheet.actor.playable .sst .ability-scores {
  flex: 1 0 250px;
  width:200px;
  border-right: 2px groove #eeede0;
}

.loser.sheet.actor.playable .sst .ability-score li {
  flex: 1 0 auto;
  max-height: 60px;
}

.loser.sheet.actor.playable .sst .ability-score h4 {
  flex: 1 0 50px;
  font-size: 32px;
  max-width: 50px;
  margin-right: 10px;
  margin-top: 10px;
}

.loser.sheet.actor.playable .sst .ability-score input {
  flex: 1 0 50px;
  font-size: 32px;
  max-width: 50px;
  margin-top: 14px;
  margin-right: 10px;
}

.loser.sheet.actor.playable .sst .ability-score .txt-details {
  flex: 1 0 200px;
  font-size: 12px;
  height: 60px;
  max-height: 60px;
}

.loser.sheet.actor.playable .sst .saves {
  flex: 1 0 auto;
  margin-right: 8px;
  margin-left: 8px;
  margin-top: 30px;
}

.loser.sheet.actor.playable .sst .save h4 {
  flex: 1 0 100px;
  font-size: 20px;
  max-width: 100px;
  margin-right: 10px;
}

.loser.sheet.actor.playable .sst .save input {
  flex: 1 0 50px;
  font-size: 24px;
  max-width: 50px;
}

.loser.sheet.actor.playable .sst .save input.pp {
  margin-top: 6px;
}

.loser.sheet.actor.playable .button-town a {
  margin-left: 8px;
  margin-top: 4px;
  font-size: 24px;
}

/* ----------------------------------------- */
/* Partial - Inventory                       */

.loser.sheet.actor.playable .inventory-partial {
  margin-left: 8px;
  margin-top: 4px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .inventory-partial .header {
  border-bottom: 2px groove #eeede0;
  font-size: 24px;
  max-height: 40px;
}

.loser.sheet.actor.playable .inventory-partial .header .slots {
  text-align: right;
  padding-right: 20px;
}

.loser.sheet.actor.playable .inventory-partial .inventory-lists .header {
  border-bottom: 2px groove #eeede0;
  font-size: 18px;
  max-height: 40px;
}

.loser.sheet.actor.playable .inventory-partial .inventory-lists .header .slots {
  text-align: right;
  padding-right: 20px;
}

.loser.sheet.actor.playable .inventory-partial .inventory-lists .item {
  margin-top: 5px;
  margin-bottom: 5px;
}

.loser.sheet.actor.playable .inventory-partial .inventory-lists .item .drop {
  margin-top: 6px;
}

.loser.sheet.actor.playable .inventory-partial .inventory-lists .item-image {
  flex: 0 0 30px;
  height: 30px;
  background-size: 30px;
  border: none;
  margin-right: 5px;
}

.loser.sheet.actor.playable .inventory-partial .inventory-lists .item-image:hover {
  cursor: pointer;
  background-size: 40px;
}

.loser.sheet.actor.playable .inventory-partial .inventory-lists .item-name {
  flex: 1 0 150px;
  min-width: 150px;
}

/* ----------------------------------------- */
/* Partial - Spells                          */

.loser.sheet.actor.playable .spells-partial {
  margin-left: 8px;
  margin-top: 4px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .spells-partial .header {
  border-bottom: 2px groove #eeede0;
  font-size: 24px;
  max-height: 40px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .header {
  border-bottom: 2px groove #eeede0;
  font-size: 18px;
  max-height: 40px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .item {
  margin-top: 5px;
  margin-bottom: 5px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .drop {
  margin-top: 6px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .item-image {
  flex: 0 0 30px;
  height: 30px;
  background-size: 30px;
  border: none;
  margin-right: 5px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .item-image:hover {
  cursor: pointer;
  background-size: 40px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .item-name {
  flex: 1 0 150px;
  min-width: 150px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .range {
  flex: 1 0 150px;
  min-width: 150px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .range .times-mem {
  margin-left: 8px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .range .spell-mem {
  margin-left: 8px;
}

.loser.sheet.actor.playable .spells-partial .spell-list .range .spell-demem {
  margin-left: 4px;
}

/* ----------------------------------------- */
/* Partial - Features                        */

.loser.sheet.actor.playable .features-partial {
  margin-left: 8px;
  margin-top: 4px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .features-partial .features-list .header {
  border-bottom: 2px groove #eeede0;
  font-size: 18px;
  max-height: 40px;
}

.loser.sheet.actor.playable .features-partial .features-list .features-list .item {
  margin-top: 5px;
  margin-bottom: 5px;
}

.loser.sheet.actor.playable .features-partial .features-list .drop {
  margin-top: 6px;
}

.loser.sheet.actor.playable .features-partial .features-list .item-image {
  flex: 0 0 30px;
  height: 30px;
  background-size: 30px;
  border: none;
  margin-right: 5px;
}

.loser.sheet.actor.playable .features-partial .features-list .item-image:hover {
  cursor: pointer;
  background-size: 40px;
}

.loser.sheet.actor.playable .features-partial .features-list .item-name {
  flex: 1 0 150px;
  min-width: 150px;
}

/* ----------------------------------------- */
/* Partial - Capabilities                        */

.loser.sheet.actor.playable .capabilities-partial {
  margin-left: 8px;
  margin-top: 4px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .capabilities-partial .features-list .header {
  border-bottom: 2px groove #eeede0;
  font-size: 18px;
  max-height: 40px;
}

.loser.sheet.actor.playable .capabilities-partial .features-list .item {
  margin-top: 5px;
  margin-bottom: 5px;
}

.loser.sheet.actor.playable .capabilities-partial .features-list .drop {
  margin-top: 6px;
}

.loser.sheet.actor.playable .capabilities-partial .features-list .item-image {
  flex: 0 0 30px;
  height: 30px;
  background-size: 30px;
  border: none;
  margin-right: 5px;
}

.loser.sheet.actor.playable .capabilities-partial .features-list .item-image:hover {
  cursor: pointer;
  background-size: 40px;
}

.loser.sheet.actor.playable .capabilities-partial .features-list .item-name {
  flex: 1 0 150px;
  min-width: 150px;
}

/* ----------------------------------------- */
/* Partial - Logistics                        */

.loser.sheet.actor.playable .logistics-partial {
  margin-left: 8px;
  margin-top: 4px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .logistics-partial .logistics-base-input {
  margin-top: 4px;
  max-height: 60px;
}

.loser.sheet.actor.playable .logistics-partial .logistics-base-input input {
  width: 60px;
  margin-left: 3px;
}

.loser.sheet.actor.playable .logistics-partial .logistics-list .header {
  border-bottom: 2px groove #eeede0;
  font-size: 18px;
  max-height: 40px;
}

.loser.sheet.actor.playable .logistics-partial .header .slots {
  text-align: right;
  padding-right: 20px;
}

.loser.sheet.actor.playable .logistics-partiall .logistics-list .item {
  margin-top: 5px;
  margin-bottom: 5px;
}

.loser.sheet.actor.playable .logistics-partial .logistics-list .drop {
  margin-top: 6px;
}

.loser.sheet.actor.playable .logistics-partial .logistics-list .item-image {
  flex: 0 0 30px;
  height: 30px;
  background-size: 30px;
  border: none;
  margin-right: 5px;
}

.loser.sheet.actor.playable .logistics-partial .logistics-list .item-image:hover {
  cursor: pointer;
  background-size: 40px;
}

.loser.sheet.actor.playable .logistics-partial .logistics-list .item-name {
  flex: 1 0 150px;
  min-width: 150px;
}

/* ----------------------------------------- */
/* Partial - Notes                           */

.loser.sheet.actor.playable .notes-partial {
  margin-left: 8px;
  margin-top: 4px;
  margin-right: 4px;
}

.loser.sheet.actor.playable .notes-partial .wrapper {
  margin-top: 8px;
  margin-left: 8px;
  font-size: 12px;
  font-style: normal;
  border-bottom: 2px groove #eeede0;
}

.loser.sheet.actor.playable .notes-partial .wrapper .title {
  font-size: 18px;
  font-weight: 700;
  margin-top: 8px;
}

.loser.sheet.actor.playable .notes-partial .editor {
  margin-left: 8px;
  margin-right: 8px;
  margin-top: 4px;
  min-height: 130px;
  font-size: 12px;
  font-style: normal;
  font-family: Verdana, Helvetica, sans-serif;
}

.loser.sheet.actor.playable .notes-partial .editor .editor-content {
  min-height: 130px;
}

.loser.sheet.actor.playable .notes-partial .editor .tox-toolbar__primary {
  font-size: 12px;
  font-style: normal;
}



/* ----------------------------------------- */
/*  Item                                     */
/* ----------------------------------------- */
.loser.sheet.item {
  margin: 0;
  padding: 0;
  min-width: 450px;
  min-height: 380px;
}

.loser.sheet.item .core-details {
  border-bottom: 2px groove #eeede0;
  flex: 0 0 81px;
  height: 81px;
}

.loser.sheet.item .core-details img.pic {
  flex: 0 0 80px;
  max-width: 80px;
  height: 80px;
  border: none;
  border-right: 2px groove #eeede0;
}

.loser.sheet.item .core-details .basics {
  margin-top: 4px;
  margin-left: 8px;
  margin-right: 8px;
}

.loser.sheet.item .itemname {
  font-size: 42px;
  min-height: 48px;
}
.loser.sheet.item .iteminfo {
  font-size: 24px;
  margin-top: 4px;
}

.loser.sheet.item .iteminfo .slots {
  text-align: right;
  margin-left: 4px;
}

.loser.sheet.item .phys-desc {
  margin-top: 8px;
  margin-left: 8px;
  font-size: 12px;
  font-style: normal;
  font-family: Verdana, Helvetica, sans-serif;
  border-bottom: 2px groove #eeede0;
}

.loser.sheet.item .phys-desc .phys-stack {
  flex: 0 0 130px;
  max-height: 130px;
}

.loser.sheet.item .phys-desc .phys-detail {
  flex: 0 0 40px;
  max-width: 150px;
  max-height: 40px;
  border: none;
  border-right: 2px groove #eeede0;
}

.loser.sheet.item .phys-desc .phys-detail span {
  flex: 0 0 80px;
  min-width: 80px;
  font-weight: 300;
  margin-top: 4px;
  font-size: 12px;
}

.loser.sheet.item .phys-desc .phys-detail input {
  max-width: 40px;
}

.loser.sheet.item .phys-desc .desc-detail {
  margin-left: 8px;
  margin-right: 8px;
  min-height: 130px;
}

.loser.sheet.item .phys-desc .desc-detail .editor-content {
  min-height: 130px;
}

.loser.sheet.item .item-properties {
  margin-left: 8px;
  font-size: 20px;
}

.loser.sheet.item .item-properties label.checkbox {
  flex: 0 0 98px;
  font-size: 14px;
}

.loser.sheet.item .details .title {
  flex: 1 0 100px;
  max-width: 100px;
  margin-top: 4px;
  margin-left: 8px;
  font-size: 20px;
}

.loser.sheet.item .details .value {
  flex: 1 0 50px;
  max-width: 50px;
  margin-top: 4px;
}

/* ----------------------------------------- */
/*  Equipment                                */
/* ----------------------------------------- */
.loser.sheet.item .equipment {
  font-size: 14px;
  font-style: normal;
  font-family: Verdana, Helvetica, sans-serif;
  margin-left: 8px;
  margin-bottom: 8px;
}

.loser.sheet.item .equipment.resource-die {
  margin-top: 4px;
}

.loser.sheet.item .equipment .title {
  flex: 1 0 100px;
  max-width: 100px;
  margin-top: 4px;
}

.loser.sheet.item .equipment .d1 {
  flex: 1 0 20px;
  max-width: 20px;
  margin-top: 4px;
}
.loser.sheet.item .equipment .die-size {
  flex: 1 0 50px;
  max-width: 50px;
}

/* ----------------------------------------- */
/*  Weapon                                   */
/* ----------------------------------------- */

/* ----------------------------------------- */
/*  Armor                                    */
/* ----------------------------------------- */

/* ----------------------------------------- */
/*  Currency                                 */
/* ----------------------------------------- */
.loser.sheet.item.currency {
  min-height: 550px;
}

.loser.sheet.item.currency .phys-desc .desc-detail {
  margin-left: 8px;
  margin-right: 8px;
  min-height: 60px;
}

.loser.sheet.item.currency .coins-and-gems {
  margin-left: 8px;
  margin-right: 8px;
  margin-top: 4px;
  margin-bottom: 4px;
}

.loser.sheet.item.currency .coins-and-gems span.title {
  font-weight: 700;
  margin-top: 4px;
  font-size: 24px;
}

.loser.sheet.item.currency .coins-and-gems span.denom-title {
  margin-top: 4px;
  text-align: right;
  margin-right: 3px;
}

/* ----------------------------------------- */
/*  Spell                                    */
/* ----------------------------------------- */
.loser.sheet.item.spell {
  min-height: 430px;
}

.loser.sheet.item.spell .phys-desc .desc-detail {
  margin-left: 8px;
  margin-right: 8px;
  min-height: 60px;
}

.loser.sheet.item.spell .details {
  margin-top: 4px;
}

.loser.sheet.item.spell .right {
  text-align: right;
  margin-right: 3px;
}

.loser.sheet.item.spell select {
  max-width: 100px;
}

/* ----------------------------------------- */
/*  Feature                                  */
/* ----------------------------------------- */

.loser.sheet.item.feature .details {
  margin-top: 4px;
}
.loser.sheet.item.feature select {
  max-width: 150px;
}

/* ----------------------------------------- */
/*  Logistic                                 */
/* ----------------------------------------- */
.loser.sheet.item.logistic {
  min-height: 430px;
}

.loser.sheet.item.logistic .phys-desc .desc-detail {
  margin-left: 8px;
  margin-right: 8px;
  min-height: 60px;
}

.loser.sheet.item.logistic .details {
  margin-top: 4px;
}

.loser.sheet.item.logistic .right {
  text-align: right;
  margin-right: 3px;
}

.loser.sheet.item.logistic .currency {
  min-width: 150px;
}

.loser.sheet.item.logistic .details input {
  max-width: 100px;
}

/* ----------------------------------------- */
/*  monster                                  */
/* ----------------------------------------- */
.loser.sheet.actor.monster {
  min-width: 720px;
  min-height: 680px;
}