Files
roll20-character-sheets-tester/The ADVANCED Pandemonium/The_ADVANCED_Pandemonium.css
T

3728 lines
78 KiB
CSS

@import url('https://fonts.googleapis.com/css?family=Crimson+Text&family=Xanh+Mono&display=swap');
/*#region roll20 settings*/
.ui-dialog .largedialog {
background-image: url(http://imgur.com/Z4ti7rM.png);
}
.nav-tabs {
padding-bottom: 5px;
}
.ui-dialog,
.ui-dialog .ui-dialog-titlebar {
background-image: url(http://imgur.com/Z4ti7rM.png) !important;
overflow-x: hidden;
}
.nav-tabs li,
.sheet-darkmode .ui-dialog .nav-tabs li {
border-radius: 10px;
margin-right: 5px;
width: 125px;
height: 20px !important;
padding: 1px;
font-weight: 700;
margin-bottom: 0px !important;
color: #356780;
cursor: pointer;
text-decoration: none;
text-align: center;
background: rgba(7, 16, 25, 0.15);
}
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus,
.sheet-darkmode .ui-dialog .nav-tabs > li > a:hover,
.sheet-darkmode .ui-dialog .nav-tabs > li > a:focus {
border-radius: 10px;
margin-left: -1px;
margin-top: -1px;
width: 125px;
height: 20px !important;
padding: 1px;
font-weight: 700;
line-height: 18px;
margin-bottom: 0px !important;
color: #356780;
cursor: pointer;
text-decoration: none;
text-align: center;
background: rgba(7, 16, 25, 0.15);
}
.nav-tabs > li > a {
line-height: 14px;
padding: 0px;
margin: 0px;
margin-top: 2px;
}
.nav-tabs > li.active > a,
.sheet-darkmode .ui-dialog .nav-tabs > li.active > a {
color: #85d6ff;
background: rgb(7, 16, 25);
box-shadow: inset 0px 2px #0ce;
padding-top: 3px !important;
margin-top: -1px !important;
margin-left: -1px;
border-radius: 10px;
width: 125px !important;
}
.sheet-darkmode .ui-dialog .nav-tabs > li a {
color: black;
}
.sheet-darkmode {
color: black;
}
.nav-tabs > li.active > a:hover,
.sheet-darkmode .ui-dialog .nav-tabs > li.active > a:hover {
cursor: pointer;
color: rgb(7, 13, 20);
background: #85d6ff;
box-shadow: inset 0px 2px rgb(7, 13, 20);
padding-top: 1px !important;
margin-top: -1px !important;
margin-left: -1px;
border-radius: 10px;
width: 125px !important;
}
.nav-tabs > li.active > a:focus,
.sheet-darkmode .ui-dialog .nav-tabs > li.active > a:focus {
cursor: pointer;
color: #85d6ff;
background: rgb(7, 13, 20);
box-shadow: inset 0px 2px #0ce;
padding-top: 1px !important;
margin-top: -1px !important;
margin-left: -1px;
border-radius: 10px;
width: 125px !important;
}
.sheet-darkmode .ui-dialog .nav-tabs > li a:hover,
.sheet-darkmode .ui-dialog .nav-tabs > li a:focus {
cursor: pointer;
color: #85d6ff;
background: #65656c;
box-shadow: inset 0px 2px #0ce;
padding-top: 1px !important;
margin-top: -4px !important;
margin-left: -3px;
border-radius: 10px;
width: 125px !important;
}
.sheet-darkmode .charsheet {
background-color: white;
}
/*#endregion*/
/*#region fullSheet*/
* {
font-family: 'Crimson Text', serif !important;
}
*,
*:after,
*:before {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.clearfix:before,
.clearfix:after {
content: ' ';
display: table;
}
.diceButton {
font-family: 'dicefontd10' !important;
background: transparent;
border: 0px;
font-size: 26pt;
margin-bottom: 5px;
-webkit-text-stroke-width: thin;
-webkit-text-stroke-color: #85d6ff;
color: black;
}
.clearfix:after {
clear: both;
}
input {
line-height: 15px;
height: 15px !important;
}
body {
font-family: sans-serif;
background: #f6f9fa;
}
a {
color: #ccc;
text-decoration: none;
outline: none;
}
@keyframes fadeInScale {
0% {
transform: scale(0.9);
opacity: 0;
}
100% {
transform: scale(1);
opacity: 1;
}
}
.no_wrap {
text-align: center;
color: #0ce;
}
.link {
text-align: center;
}
summary {
cursor: pointer;
user-select: none;
}
.largeTitle {
line-height: 35px;
height: 35px !important;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 10px 10px 0px 0px;
justify-content: space-between;
}
.passiveButton {
color: #85d6ff !important;
width: 40px !important;
}
input[disabled],
select[disabled],
textarea[disabled],
input[readonly],
select[readonly],
textarea[readonly] {
cursor: default !important;
-webkit-touch-callout: none !important;
-webkit-user-select: none !important;
-khtml-user-select: none !important;
-moz-user-select: none !important;
-ms-user-select: none !important;
user-select: none !important;
}
.hiddenSheet {
background: rgba(7, 16, 25, 0);
border-bottom: 1px solid black;
border-top: 0px;
border-left: 0px;
border-right: 0px;
outline: none;
color: black;
font-size: 10pt;
width: inherit;
padding: inherit !important;
padding-left: 2px !important;
padding-right: 2px !important;
padding-bottom: 0px !important;
text-align: inherit !important;
}
.hiddenSheetTitle {
background: rgb(227, 241, 255);
color: #091623;
text-align: center;
font-weight: 900;
font-size: 12pt;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type='number'] {
-moz-appearance: textfield;
}
textarea {
padding: 1px 3px;
vertical-align: top;
resize: none;
overflow: auto;
-ms-overflow-style: none;
line-height: 11px;
background-color: #16335021;
cursor: auto;
}
.ui-dialog::-webkit-scrollbar,
::-webkit-scrollbar {
width: 20px;
cursor: pointer !important;
}
::-webkit-scrollbar-track {
background-color: transparent;
cursor: pointer !important;
}
.ui-dialog::-webkit-scrollbar-track {
background: transparent;
}
.ui-dialog::-webkit-scrollbar-thumb,
::-webkit-scrollbar-thumb {
background-color: #33a7f163;
border-radius: 20px;
border: 6px solid transparent;
background-clip: content-box;
cursor: pointer !important;
}
.ui-dialog::-webkit-scrollbar-thumb:hover,
::-webkit-scrollbar-thumb:hover {
background-color: #2373a5a2;
cursor: pointer !important;
}
.centered {
text-align: center !important;
}
.section-main,
.section-secondary,
.antagonist_grid {
width: 870px !important;
}
h1,
h2,
h3,
h4,
h5 {
line-height: 16px;
}
h1 {
font-size: 15pt;
font-weight: normal;
}
h2 {
font-size: 13pt;
}
h3 {
font-size: 11pt;
}
h4 {
font-size: 10pt;
}
input {
vertical-align: top !important;
}
input:focus,
select:focus,
textarea:focus,
button:focus {
outline: none;
user-select: none;
}
.logo {
display: flex;
justify-content: space-between;
align-items: center;
height: 80px !important;
}
.logoAntagonist {
display: flex;
justify-content: space-between;
align-items: center;
height: 98px !important;
width: 339px;
}
p {
margin: 0px;
}
a.clickToClose {
position: absolute;
width: 100%;
height: 100%;
z-index: -1;
cursor: default;
}
input[readonly]::selection {
color: #85d6ff;
}
div.flexJustify {
justify-content: space-between !important;
}
.header {
color: #85d6ff !important;
font-weight: bolder;
width: 100%;
}
.bordered {
border: 1px solid black;
border-radius: 10px;
margin-bottom: 5px;
}
.centertitle {
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
width: 100%;
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
.charsheet button[type='roll']::before {
font-family: 'dicefontd10' !important;
content: 'k' !important;
background: transparent;
border: none;
outline: none;
color: inherit !important;
background-repeat: no-repeat;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
font-size: 0.9em !important;
}
.pictos {
font-family: 'Pictos' !important;
font-weight: normal;
font-style: normal;
}
.dfontd20 {
font-family: 'dicefontd20' !important;
font-weight: normal;
font-style: normal;
}
.attributesabilities .abil {
padding-top: 10px;
padding-bottom: 5px;
padding-left: 5px;
border-radius: 14px;
border: 1px solid black;
background-color: transparent;
margin-bottom: 3px;
}
.test button[type='roll']::before {
font-family: 'Pictos' !important;
content: 'w' !important;
background: transparent;
border: none;
outline: none;
background-repeat: no-repeat;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
font-size: 0.6em !important;
}
button.diceButton.teste {
font-family: "Pictos" !important;
color: #85d6ff;
}
.anchorButton {
background: #071019;
color: #85d6ff;
width: 69px;
height: 22px;
font-size: 11pt;
text-align: center;
border-radius: 10px;
}
.stanceButton {
height: 18px;
margin-top: 2px;
line-height: 17px;
}
.button[type='roll'] {
font-family: 'dicefontd10' !important;
font-size: 30pt !important;
background: transparent;
border: none;
outline: none;
color: inherit !important;
background-repeat: no-repeat;
box-shadow: none;
-webkit-box-shadow: none;
-moz-box-shadow: none;
padding-bottom: 9px !important;
}
.charsheet {
min-width: 880px;
color: #091623;
font-size: 15pt;
padding: 0px 8px !important;
margin-left: -12px;
background-image: url(http://imgur.com/Z4ti7rM.png);
}
/*#endregion*/
/*#region augments & Blessings*/
input.blessingsName::placeholder {
width: 100% !important;
font-size: 10pt;
height: 25px !important;
background: rgba(0, 0, 0, 0);
border: 0px;
text-align: center;
font-weight: bolder;
color: #85d6ff;
}
input.blessingsName {
width: 100% !important;
font-size: 10pt;
height: 25px !important;
background: rgba(0, 0, 0, 0);
border: 0px;
text-align: center;
font-weight: bolder;
color: #85d6ff;
}
.blessingsNameInput {
width: 75%;
font-size: 9pt !important;
}
div.blessingsFlex {
display: flex;
height: 18px;
align-items: center;
}
.isWAR,
.nonWAR,
.hasUses {
display: none;
}
.warToggle[value='1'] ~ .isWAR,
.warToggle[value='0'] ~ .nonWAR {
display: flex;
flex-direction: column;
}
.warUsesToggle[value='1'] ~ .hasUses {
display: block;
}
.abilitySummary > summary {
background: rgba(7, 16, 25, 1);
height: 18px;
border-radius: 15px !important;
}
.abilitySummary[open] > summary {
height: 18px;
border-radius: 15px 15px 0px 0px !important;
}
.abilitySummary[open] > .passiveFlex {
height: fit-content;
padding-bottom: 8px;
}
.blessingsDescription {
width: 98% !important;
align-self: center;
margin-top: 5px;
height: 60px !important;
font-size: 8pt;
}
.bionicsDescription {
width: 95% !important;
align-self: center;
margin-top: 5px;
margin-bottom: 6px;
height: 60px !important;
font-size: 8pt;
}
/*#endregion*/
/*#region antagonists*/
.antButton {
font-family: 'Pictos' !important;
background: transparent;
border: 0px;
font-size: 18pt;
margin-right: 10px;
-webkit-text-stroke-width: thin;
-webkit-text-stroke-color: #85d6ff;
height: 15px !important;
width: 25px !important;
color: #85d6ff !important;
margin-left: 0px !important;
padding-left: 0px !important;
margin-top: 1px;
}
.antagonist_grid {
display: flex;
justify-content: space-between;
align-items: center;
height: 80px !important;
flex-direction: column;
}
.antagonist_passive_grid {
display: grid;
grid-template-columns: 50px 85px 39px 116px 122px;
align-items: center;
padding-left: 5px;
margin-top: 3px;
margin-bottom: 3px;
padding-right: 5px;
}
.manifestationAntagonist {
width: 93%;
height: 21px;
margin: 0px;
margin-left: 5px;
}
.characterNameAntagonist {
width: 97%;
margin-left: 5px;
padding-left: 6px !important;
}
div.nameAndLegacy__rowAntagonist {
display: grid;
position: relative;
top: -40px;
left: -33px;
grid-template-columns: 51px 149px 15px 103px 118px;
grid-template-areas:
'a b b g h'
'e f c c d'
'i j y y z';
grid-template-rows: repeat(3, 20px);
align-items: center;
}
div.passiveWarShellAntagonist {
display: flex;
flex-direction: column;
margin-top: 5px;
}
/*#endregion*/
/*#region nameLegacyStance*/
.ectomorph,
.endomorph,
.mesomorph,
.spatial,
.logical,
.intrapersonal,
.interpersonal,
.kinaesthetic {
opacity: 0;
}
.bodyToggle[value='1'] ~ .ectomorph,
.bodyToggle[value='2'] ~ .endomorph,
.bodyToggle[value='3'] ~ .mesomorph {
opacity: 1;
}
.mindToggle[value='1'] ~ .intrapersonal,
.mindToggle[value='2'] ~ .interpersonal,
.mindToggle[value='3'] ~ .kinaesthetic,
.mindToggle[value='4'] ~ .logical,
.mindToggle[value='5'] ~ .spatial {
opacity: 1;
}
.mainGrid {
display: grid;
grid-template-columns: 50px 15px 15px 15px 15px 15px;
grid-template-rows: repeat(6, 14px);
grid-template-areas:
'd d d d d e'
'f f f g gg ggg'
'h h h h i ii'
'j k kk kkk l ll'
'm n nn nnn o oo'
'p p p p p q';
}
.bodyMindAddition {
width: 40px !important;
font-size: 17pt;
text-align: left !important;
border: none;
background: transparent !important;
}
.legacy:where([value='ExemplarD'], [value='Gaia'], [value='Magus'], [value='ExemplarG'], [value='EnhancerP'], [value='EnhancerS'], [value='EnhancerT'], [value='Luminous'])
~ .popupManifestations {
margin: 10px auto;
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 90%;
position: relative;
transition: all 0.5s ease-in-out;
}
.popupToolkit {
margin: 45px auto;
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 300px;
position: relative;
transition: all 0.5s ease-in-out;
}
div.characteristicsShellInner {
display: grid;
grid-template-columns: 1fr 1fr;
justify-items: center;
}
div.characteristicsShellADVANCED {
display: grid;
width: 98%;
margin-left: 2px;
margin-top: 5px;
grid-template-rows: 40px repeat(5, 85px);
grid-template-columns: 1fr 1fr;
grid-template-areas:
'title title'
'body mind'
'acuity durability'
'vitality agility'
'nerve comprehension'
'essence discernment';
}
div.characteristicsShellRightSide {
display: grid;
width: 98%;
margin-right: 2px;
margin-top: 5px;
padding-left: 5px;
padding-right: 5px;
grid-template-rows: 40px 25px repeat(2, 20px) repeat(5, 71px);
grid-template-columns: 0.75fr 1.25fr;
grid-template-areas: 'title title';
align-items: end;
}
.advancedShell {
font-size: xx-large;
height: 45px !important;
align-self: center;
background: rgba(7, 16, 25, 0);
border: 0px;
border-bottom: 1px solid black;
outline: none;
font-weight: bold;
color: black;
justify-self: end;
width: 32% !important;
}
div.characteristicsShell,
div.manifestationsShell {
border: 1px solid black;
border-radius: 15px 15px 15px 15px !important;
background-color: rgb(227, 241, 255);
min-height: 45px;
}
.advancedJustify {
flex-direction: column;
display: flex;
width: 95%;
justify-self: center;
}
select.bodySelect {
font-size: 16pt;
height: 65% !important;
align-items: center;
line-height: 22px;
margin: 0px;
width: 100%;
text-align: center !important;
border: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
font-weight: 700;
}
select.bodySelect::-ms-expand {
display: none;
}
.manifestation {
width: 155px;
height: 18px;
margin: 0px;
margin-left: 1px;
font-size: 9.5pt;
padding: 0px !important;
}
.characterName,
.characterTerrain,
.characterHazard {
width: 95%;
margin-left: 5px;
padding-left: 6px !important;
}
div.nameAndLegacy__row {
display: flex;
flex-direction: column;
position: relative;
top: -17px;
}
.nameAndLegacy__cell {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.luminous,
.magus,
.enhancerP,
.enhancerS,
.enhancerT,
.exemplarG,
.exemplarD,
.gaia {
display: none;
}
.legacy[value='Luminous'] ~ div.luminous,
.legacy[value='Magus'] ~ div.magus,
.legacy[value='EnhancerP'] ~ div.enhancerP,
.legacy[value='EnhancerS'] ~ div.enhancerS,
.legacy[value='EnhancerT'] ~ div.enhancerT,
.legacy[value='ExemplarG'] ~ div.exemplarG,
.legacy[value='ExemplarD'] ~ div.exemplarD,
.legacy[value='Gaia'] ~ div.gaia {
display: grid;
flex-direction: column;
padding: 0px 5px 5px 5px;
grid-template-columns: 90px 1fr;
}
.legacy {
display: flex;
flex-direction: column;
align-content: center;
justify-content: center;
}
/*#endregion*/
/*#region tabAndPageSetup*/
.player_sheet,
.antagonist_sheet {
display: none;
}
.antagonist_flag[value='0'] ~ .player_sheet,
.antagonist_flag[value='1'] ~ .antagonist_sheet {
display: block;
}
#activetab1 {
grid-area: a;
}
#activetab2 {
grid-area: b;
}
#activetab3 {
grid-area: c;
}
#activecontent1 {
grid-area: d;
}
#activecontent2 {
grid-area: e;
}
#activecontent3 {
grid-area: f;
}
.activetabInput {
opacity: 0;
width: 50px !important;
z-index: 1 !important;
height: 23px !important;
padding: 1px;
}
section {
clear: both;
display: none;
}
label {
font-weight: 700;
margin-bottom: 0px !important;
font-size: 18px;
display: block;
align-self: flex-start;
width: 20%;
padding: 0.3em;
color: #356780;
cursor: pointer;
text-decoration: none;
text-align: center;
background: rgba(7, 16, 25, 0.15);
display: flex !important;
justify-content: space-evenly;
align-items: center;
}
#activetab1:checked ~ #activecontent1,
#activetab2:checked ~ #activecontent2,
#activetab3:checked ~ #activecontent3,
#activetab4:checked ~ #activecontent4 {
display: block;
background: transparent;
color: #999;
border-bottom: 2px solid #f0f0f0;
}
.activetab_containerNew .activetab-content p,
.activetab_containerNew .activetab-content h3,
.activetab_containerNewAntagonist .activetab-content p,
.activetab_containerNewAntagonist .activetab-content h3 {
-webkit-animation: fadeInScale 0.7s ease-in-out;
-moz-animation: fadeInScale 0.7s ease-in-out;
animation: fadeInScale 0.7s ease-in-out;
}
.activetab_containerNew .activetab-content h3,
.activetab_containerNewAntagonist .activetab-content h3 {
text-align: center;
}
.activetab_containerNew [id^='activetab']:checked + label.top,
.activetab_containerNewAntagonist [id^='activetab']:checked + label.top {
color: #85d6ff;
background: rgb(7, 16, 25);
box-shadow: inset 0 3px #0ce, inset -3px 0px 0 0px #0ce,
inset 3px 0px 0 0px #0ce;
padding-top: 2px !important;
}
.activetab_containerNew [id^='activetab']:checked + label.middle,
.activetab_containerNewAntagonist [id^='activetab']:checked + label.middle {
color: #85d6ff;
background: rgb(7, 16, 25);
box-shadow: inset -3px 0px 0 0px #0ce, inset 3px 0px 0 0px #0ce;
padding-top: 2px !important;
}
.activetab_containerNew [id^='activetab']:checked + label.bottom,
.activetab_containerNewAntagonist [id^='activetab']:checked + label.bottom {
color: #85d6ff;
background: rgb(7, 16, 25);
box-shadow: inset 0 -3px #0ce, inset -3px 0px 0 0px #0ce,
inset 3px 0px 0 0px #0ce;
padding-top: 2px !important;
}
div.lowerPage__row {
display: grid;
width: 100%;
grid-template-columns: 471px 390px;
column-gap: 6px;
}
.abilityPursuit__row {
position: relative;
top: -149px;
left: -5px;
width: 397px;
}
/*#endregion*/
/*#region shieldingStaminaStressWounds*/
div.stressWoundsStamina__row {
display: grid;
grid-template-columns: 129px 122px 100px 122px 268px 132px;
height: 212px;
align-items: center;
margin-top: -60px;
}
div.stressWoundsStamina__cell {
height: 102%;
}
.shieldingStaminaFlexCorrection {
display: flex;
height: fit-content;
justify-content: center;
flex-direction: column;
row-gap: 2px;
}
.rightside {
justify-self: end !important;
text-align: right;
}
.leftside {
padding-left: 0px !important;
margin-top: -26px;
margin-bottom: 9px;
}
input.stressWoundsBox {
width: 22px !important;
height: 22px !important;
margin-right: 3px;
}
.stressWoundsBoxes {
height: 25px;
}
.numberStress {
background: transparent;
border: 0px;
border-bottom: 1px solid !important;
padding: 0px;
margin-bottom: 3px !important;
text-align: center;
font-weight: 900;
width: 17px !important;
margin-left: 12px;
margin-right: 28px;
}
.numberWounds {
background: transparent;
border: 0px;
border-bottom: 1px solid !important;
padding: 0px;
margin-bottom: 3px !important;
text-align: center;
font-weight: 900;
width: 17px !important;
margin-right: 10px;
margin-left: 10px;
}
div.effort__row {
display: grid;
width: 98%;
border: 1px solid black;
border-radius: 15px;
grid-template-rows: 25px 23px 25px;
grid-template-columns: repeat(5, 1fr);
grid-template-areas:
'a a a a a'
'b b c d d'
'e e e e f';
}
div.shielding__row {
display: grid;
width: 98%;
border: 1px solid black;
border-radius: 15px;
grid-template-rows: 25px repeat(5, 20px) 25px;
grid-template-columns: 1fr 0.5fr 1fr 0.5fr 1fr 1fr;
grid-template-areas:
'a a a aa aa aa'
'b c d g g g'
'bb cc dd gg gg gg'
'bbb ccc ddd ggg ggg ggg'
'bbbb cccc dddd gggg gggg gggg'
'bbbbb ccccc ddddd ggggg ggggg ggggg'
'e e f ee ee ff';
}
div.shielding__rowAntagonist {
display: grid;
width: 98%;
border: 1px solid black;
border-radius: 15px;
grid-template-rows: 25px 30px 25px;
grid-template-columns: repeat(5, 1fr);
grid-template-areas:
'a a a a a'
'b b c d d'
'e e e e f';
}
div.hitpoints__rowAntagonist {
display: grid;
width: 98%;
border: 1px solid black;
border-radius: 15px;
grid-template-rows: 25px 30px 25px;
grid-template-columns: repeat(5, 1fr);
grid-template-areas:
'a a a a a a'
'b b c c d d'
'e e f ee ee ff';
}
.shieldingStaminaMax {
width: 40px !important;
padding: 1px !important;
height: 20px !important;
}
.shielding1,
.stamina1 {
border-radius: 10px 10px 0px 0px;
grid-area: a;
}
.shielding2,
.stamina2 {
grid-area: b;
font-size: 17pt;
width: 95% !important;
align-self: center;
background: rgba(7, 16, 25, 0);
border-bottom: 1px solid black;
border-top: 0px;
border-left: 0px;
border-right: 0px;
outline: none;
font-weight: bold;
color: black;
justify-self: end;
margin-top: 2px !important;
height: 18px !important;
}
.hp1 {
grid-area: b;
font-size: 12pt;
width: 95% !important;
align-self: center;
background: rgba(7, 16, 25, 0);
border-bottom: 1px solid black;
border-top: 0px;
border-left: 0px;
border-right: 0px;
outline: none;
font-weight: bold;
color: black;
justify-self: end;
margin-top: 2px !important;
height: 15px !important;
}
.shielding3,
.stamina3 {
grid-area: c;
justify-self: center;
font-size: xx-large;
font-weight: 900;
align-self: center;
margin-top: 1px;
margin-right: -5px;
}
.hp3 {
grid-area: c;
font-size: 15pt !important;
justify-self: center;
font-size: xx-large;
font-weight: 900;
align-self: center;
margin-top: 1px;
margin-right: -5px;
}
.shielding4,
.stamina4 {
grid-area: e;
padding-top: 2px;
}
.shielding5,
.stamina5 {
grid-area: f;
padding-top: 3px;
padding-right: 2px;
margin-left: -12px;
height: 26px;
background: rgb(7, 16, 25);
border-bottom-right-radius: 10px;
}
.shielding6,
.stamina6 {
grid-area: d;
font-size: 17pt;
align-self: center;
width: 95% !important;
background: rgba(7, 16, 25, 0);
border-bottom: 1px solid black;
border-top: 0px;
border-left: 0px;
border-right: 0px;
outline: none;
font-weight: bold;
color: black;
height: 25px !important;
}
.hp2 {
grid-area: d;
font-size: 12pt;
align-self: center;
width: 95% !important;
background: rgba(7, 16, 25, 0);
border-bottom: 1px solid black;
border-top: 0px;
border-left: 0px;
border-right: 0px;
outline: none;
font-weight: bold;
color: black;
height: 18px !important;
}
/*#endregion*/
/*#region generalWAR*/
input.passiveReactiveName::placeholder {
width: 100% !important;
font-size: 15pt;
height: 25px !important;
background: rgba(0, 0, 0, 0);
border: 0px;
text-align: center;
font-weight: bolder;
color: #85d6ff;
}
.passiveReactiveWAREffects,
.passiveReactiveWARDescription {
width: 95% !important;
margin-top: 3px;
margin-bottom: 3px;
}
.shardTitle {
border-radius: 3px 3px 0px 0px;
background-color: #071019;
color: #85d6ff;
width: 100% !important;
}
.shardFlexL {
display: flex;
flex-direction: column;
align-items: center;
height: 24px;
border: 1px solid black;
border-radius: 5px;
padding: 0px;
text-align: center;
width: 42px;
}
.shardFlexR {
display: flex;
flex-direction: column;
align-items: center;
height: 30px;
border: 1px solid black;
border-radius: 5px;
padding: 0px;
text-align: center;
width: 70px;
}
.inputShell {
border-bottom: 1px solid black;
height:12px;
width:20px;
border-radius: 3px;
}
.inputField {
border: none;
width: inherit !important;
}
.shardFlexRR {
display: flex;
flex-direction: column;
align-items: center;
height: 30px;
border: 1px solid black;
border-radius: 5px;
padding: 0px;
text-align: center;
width: 75px;
}
.shardUseFlex {
display: flex;
flex-direction: column;
align-items: center;
margin-left: 1px;
height: 24px;
border: 1px solid black;
border-radius: 5px;
padding: 0px;
width: 40px;
}
div.passiveWarStatsReactiveWar__row {
display: grid;
grid-template-rows: auto;
grid-gap: 3px;
grid-template-columns: 283px 146px;
margin-bottom: 2px;
margin-top: 2px;
position: relative;
top: 1px;
}
.passiveDescription {
display: flex;
width: 287px;
align-items: flex-start;
justify-content: flex-end;
height: fit-content;
margin-right: 4px;
}
div.passiveWarShell,
div.passiveWarShellAntagonist,
div.activeWarShell,
div.reactiveWarShell,
div.stanceShell {
border: 1px solid black;
border-radius: 15px 15px 15px 15px !important;
}
div.passiveReactiveTextShell {
border: 1px solid black;
border-radius: 15px 15px 15px 15px !important;
background-color: rgb(227, 241, 255);
height: 228px;
width: 400px;
}
div.specialisationTextShell {
display: flex;
border: 1px solid black;
border-radius: 15px 15px 15px 15px !important;
background-color: rgb(227, 241, 255);
margin-bottom: -25px;
flex-direction: column;
}
/*#endregion*/
/*#region passiveWAR*/
.reactiveButton {
color: #85d6ff !important;
width: 40px !important;
}
div.passiveWarShell {
display: flex;
align-items: end;
row-gap: 3px;
flex-direction: column;
}
div.passiveFlex,
div.reactiveFlex {
display: flex;
height: 19px;
align-items: center;
margin-left: -1px;
}
.title,
.passiveTitle,
.reactiveTitle {
line-height: 25px;
height: 25px !important;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 10px 10px 0px 0px;
justify-content: space-between;
}
.passiveTitleFlex,
.reactiveTitleFlex {
align-self: center;
border-radius: 10px 10px 0px 0px;
line-height: 22px;
}
/*#endregion*/
/*#region equipment*/
.valueSelect {
border: none;
border-bottom: 1px solid black;
margin: 0px;
height: 20px;
font-size: 8pt;
padding: 0px !important;
font-weight: bolder;
color: black !important;
margin-top: 4px;
}
.equipmentCharges {
display: flex;
flex-direction: column;
align-items: center;
margin-left: 2px;
margin-top: -1px;
}
.chargesAmount {
border: none;
border-bottom: 1px solid black;
width: 20px !important;
text-align: center;
margin-right: 2px;
background-color: transparent !important;
padding: 0px;
}
.minMaxStrength {
border: none;
border-bottom: 1px solid black;
width: 57px !important;
text-align: center;
margin-right: 2px;
padding: 0px;
font-size: 11px;
}
.headIsContainer,
.headIsNotContainer,
.backIsContainer,
.backIsNotContainer,
.torsoIsContainer,
.torsoIsNotContainer,
.armOneIsContainer,
.armOneIsNotContainer,
.armTwoIsContainer,
.armTwoIsNotContainer,
.hipIsContainer,
.hipIsNotContainer,
.legOneIsContainer,
.legOneIsNotContainer,
.legTwoIsContainer,
.legTwoIsNotContainer,
.feetIsContainer,
.feetIsNotContainer,
.bodyIsContainer,
.bodyIsNotContainer {
display: none;
}
.headContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .headIsContainer,
.backContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .backIsContainer,
.torsoContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .torsoIsContainer,
.armOneContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .armOneIsContainer,
.armTwoContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .armTwoIsContainer,
.hipContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .hipIsContainer,
.legOneContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .legOneIsContainer,
.legTwoContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .legTwoIsContainer,
.feetContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .feetIsContainer,
.bodyContainer:where([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar'])
~ .bodyIsContainer {
display: flex;
}
.headContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .headIsNotContainer,
.backContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .backIsNotContainer,
.torsoContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .torsoIsNotContainer,
.armOneContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .armOneIsNotContainer,
.armTwoContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .armTwoIsNotContainer,
.hipContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .hipIsNotContainer,
.legOneContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .legOneIsNotContainer,
.legTwoContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .legTwoIsNotContainer,
.feetContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .feetIsNotContainer,
.bodyContainer:where(:not([value='Poor'], [value='Basic'], [value='Common'], [value='Premium'], [value='Excellent'], [value='Stellar']))
~ .bodyIsNotContainer {
display: flex;
}
.headEquipment {
position: absolute;
top: 55px;
left: 125px;
}
.backEquipment {
position: absolute;
top: 82px;
left: 145px;
}
.torsoEquipment {
position: absolute;
top: 130px;
left: 170px;
}
.armEquipmentOne {
position: absolute;
top: 160px;
left: 172px;
}
.armEquipmentTwo {
position: absolute;
top: 185px;
left: 172px;
}
.hipEquipment {
position: absolute;
top: 210px;
left: 180px;
}
.legEquipmentOne {
position: absolute;
top: 280px;
left: 172px;
}
.legEquipmentTwo {
position: absolute;
top: 315px;
left: 172px;
}
.feetEquipment {
position: absolute;
top: 370px;
left: 185px;
}
.fullBodyEquipment {
position: absolute;
top: 410px;
left: 25px;
text-align: center;
}
.equipmentInput {
display: flex;
border: none;
border-bottom: 1px solid black !important;
width: 100px;
background-color: transparent !important;
padding: 0px;
font-weight: bolder;
margin-top: 9px !important;
color: black !important;
font-size: 11px;
}
.bionicsInput {
width: 430px !important;
display: flex;
font-weight: bold;
margin-top: 2px !important;
margin-bottom: 2px !important;
color: black !important;
font-size: 15px;
margin-left: 4px;
height: 29px !important;
}
.equipmentInput::placeholder {
font-weight: bolder;
}
.equipmentShell {
display: flex;
}
.bionicsShell {
display: flex;
align-items: center;
}
.looseEquipmentShell {
display: flex;
height: 24px;
}
.looseEquipment {
padding-bottom: 4px;
width: 99%;
margin-top: 2px;
margin-left: 1px;
}
div.equipmentShellUpper {
border: 1px solid black;
display: flex;
border-radius: 15px 15px 15px 15px !important;
background-color: rgb(255, 255, 255);
min-height: 150px;
width: 850px;
flex-direction: column;
height: 460px;
overflow: hidden;
}
div.bionicShellUpper {
border: 1px solid black;
display: flex;
border-radius: 15px 15px 15px 15px !important;
background-color: rgb(255, 255, 255);
min-height: 150px;
width: 700px;
flex-direction: column;
height: 460px;
overflow: hidden;
}
div.equipmentShellLower {
border: 1px solid black;
border-radius: 15px 15px 15px 15px !important;
background-color: rgb(227, 241, 255);
height: 400px;
width: 266px;
margin-top: 15px;
display: flex;
flex-direction: column;
overflow: overlay;
background-color: rgb(7, 16, 25);
}
/*#endregion*/
/*#region combatStats*/
div.stanceFlexInternal {
display: flex;
flex-direction: row;
align-items: baseline;
font-weight: 900;
height: fit-content;
}
input.stanceName,
input.manifestationName,
input.passiveReactiveName {
width: 100% !important;
font-size: 15pt;
height: 25px !important;
background: rgba(0, 0, 0, 0);
border: 0px;
text-align: center;
font-weight: bolder;
color: #85d6ff;
}
.actionsTitle {
line-height: 25px;
margin-top: -6px;
height: 25px !important;
background: rgb(7, 16, 25);
text-align: center;
margin-top: -3px;
font-weight: bolder;
color: #85d6ff;
border-radius: 10px 10px 0px 0px;
justify-content: space-between;
margin-left: -1px;
}
.passiveReactivePopupFlex {
display: flex;
width: 100%;
align-items: center;
justify-content: space-around;
flex-direction: column;
height: 140px;
}
.actionsTitle {
line-height: 25px;
height: 25px !important;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 10px 10px 0px 0px;
justify-content: space-between;
}
div.combatShell {
border: 1px solid black;
border-radius: 15px 15px 15px 15px;
}
.combatFatigueExhausted {
margin-top: 1px;
border-bottom: 1px solid black;
grid-template-columns: 0px 50px 47px 110px 15px 20px;
column-gap: 2px;
}
div.combatFlex {
display: flex;
width: 100%;
height: 17px !important;
align-items: center;
}
div.combatGrid {
display: grid;
width: 100%;
height: 16px;
grid-template-columns: 0px 92px 49px 0px;
column-gap: 3px;
align-content: center;
align-items: center;
justify-items: start;
}
div.combatGridReactive {
display: grid;
width: 100%;
height: 21px;
grid-template-columns: 0px 92px 39px 0px;
align-content: center;
align-items: center;
justify-items: start;
}
div.combatGridAntagonist {
display: flex;
width: 100%;
height: 18px;
column-gap: 3px;
align-items: center;
align-content: center;
padding-left: 15px;
padding-right: 15px;
}
.combatTitle {
height: 25px !important;
line-height: 25px;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 10px 10px 0px 0px;
justify-content: center;
}
.qualityTitle {
height: 17px !important;
line-height: 17px;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 10px;
justify-content: center;
display: flex;
}
.repeating_qualities[open] .qualityTitle {
border-radius: 10px 10px 0px 0px;
}
input.fatigueExhausted {
width: 18px !important;
height: 18px !important;
justify-self: center !important;
}
/*#endregion*/
/*#region activeWAR*/
select.WARSelect {
font-size: 10pt;
height: 19px !important;
margin-top: 0px;
margin-bottom: 0px;
}
select.activeSelect {
font-size: 8pt;
height: 16px !important;
margin-top: 0px;
margin-bottom: -1px;
border: none;
}
select.genderSelect {
position: absolute;
font-size: 8pt;
height: 19px !important;
border: 1px solid;
width: 74px;
top: 34px;
left: 5px;
}
.bodyMale,
.bodyFemale,
.bodyGenderless {
display: none;
}
.genderSelect[value='Male'] ~ .bodyMale,
.genderSelect[value='Female'] ~ .bodyFemale,
.genderSelect[value='Genderless'] ~ .bodyGenderless {
display: block;
}
.bodyGenderless {
margin-left: 25px;
height: 395px;
margin-left: -3px;
}
.bodyFemale {
height: 375px;
margin-bottom: 33px !important;
margin-left: -26px;
}
.bodyMale {
margin-left: -41px;
height: 415px;
}
.repeating_ability,
.repeating_war,
.repeating_war_amtagonist {
border: 1px solid black;
border-radius: 15px;
margin-bottom: 2px;
}
.repeating_warAntagonist {
border: 1px solid black;
border-radius: 15px;
margin-bottom: 3px;
}
.repeating_qualities {
border: 1px solid black;
border-radius: 14px;
margin-bottom: 3px;
width: 96%;
margin-left: 9px;
}
.activeDamage,
.activeMalicious,
.activeHealing,
.activeBeneficial {
display: none;
}
.activeType:where([value='1']) ~ .activeTypeName:before {
content: 'Assault';
}
.activeType:where([value='1'], [value='2'], [value='4'], [value='1a']) ~ .activeDamage,
.activeType:where([value='5'], [value='5a']) ~ .activeMalicious,
.activeType:where([value='6'], [value='6a'], [value='7']) ~ .activeHealing,
.activeType:where([value='3'], [value='3a']) ~ .activeBeneficial {
display: flex;
justify-content: center;
}
.con,
.boon,
.flaweded,
.booned,
.coned,
.boonflaw,
.conflaw {
display: none;
}
.activeType:where([value='5'], [value='5a']) ~ .con,
.activeType:where([value='3'], [value='3a']) ~ .boon {
display: flex !important;
justify-content: center !important;
}
.special_toggle:where([value='6'], [value='11'], [value='21'], [value='31']) ~ .flaweded,
.special_toggle[value='15'] ~ .booned,
.special_toggle[value='25'] ~ .coned,
.special_toggle[value='16'] ~ .boonflaw,
.special_toggle[value='26'] ~ .conflaw {
display: flex !important;
justify-content: center !important;
}
.activeType:where([value='5'], [value='5a'], [value='3'], [value='3a'])
~ div.activeGridInnerFourthDouble,
.flawed_toggle[value='1'] ~ div.activeGridInnerFourthDouble,
div.activeGridInnerFourthDoubleDouble {
display: flex;
height: fit-content;
justify-items: start;
width: 99%;
font-size: 10pt;
margin-top: 3px;
margin-right: 4px;
margin-left: 2px;
justify-content: center;
column-gap: 5px;
align-items: center;
}
.condition {
display: none;
}
.activeType:where([value='5'], [value='5a'], [value='3'], [value='3a'])
~ .condition {
display: flex;
}
.activetab_containerNew {
display: none;
}
.activeType:where([value='5'], [value='5a'], [value='3'], [value='3a'])
~ .activetab_containerNew {
display: flex;
margin-left: 3px;
margin-right: 5px;
margin-bottom: 5px;
margin-top: -5px;
grid-template-rows: 23px 23px 23px auto !important;
}
.activetab_containerNewAntagonist {
display: grid;
grid-template-columns: 60px 1fr;
grid-template-areas:
'a d'
'c d';
margin-left: 5px;
margin-right: 5px;
margin-bottom: 5px;
margin-top: -5px;
grid-template-rows: 23px auto !important;
}
.activeType:where(:not([value='5'], [value='5a'], [value='3'], [value='3a']))
~ .activetab_containerNew {
display: flex;
margin-left: 5px;
margin-right: 5px;
margin-bottom: 5px;
margin-top: -5px;
grid-template-rows: 23px 23px 23px !important;
}
.activeType:where([value='5'], [value='5a'], [value='3'], [value='3a'], [value='6'], [value='6a'], [value='8'], [value='7'])
~ div.activeGridInnerOtherDouble {
display: grid;
grid-template-columns: 30px 64px 33px 61px 33px;
height: 25px !important;
align-items: center;
justify-items: start;
width: 100%;
font-size: 10pt;
margin-left: 4px;
}
div.activeWarShellSmallDouble {
display: flex;
flex-direction: column;
align-items: end;
column-gap: 3px;
height: 52px;
}
div.activeWarShellSmallDoubleAntagonist {
display: grid;
grid-template-rows: 23px;
grid-template-columns: 1fr;
align-items: end;
column-gap: 3px;
height: 24px;
}
.activetab_containerDouble {
display: grid;
grid-template-columns: repeat(3, 65px) 53px;
grid-template-areas:
'a b c h'
'd d d d'
'e e e e'
'f f f f'
'g g g g';
}
div.activeGrid {
display: grid;
grid-template-columns: 50px 25px 1fr 60px;
height: 24px !important;
align-items: center;
justify-items: center;
}
div.activeGridInner {
display: grid;
grid-template-columns: 45px 174px 91px 30px 118px 28px;
height: 18px !important;
align-items: end;
justify-items: end;
width: 100%;
margin-top: -10px;
font-size: 10pt;
}
div.activeGridInnerDouble {
display: flex;
height: 31px !important;
align-items: center;
justify-items: start;
width: 428px;
font-size: 10pt;
margin-right: -4px;
}
div.activeGridInnerDoubleAntagonist {
display: grid;
grid-template-columns: 34px 245px;
height: 18px !important;
align-items: end;
justify-items: start;
width: 383px;
font-size: 10pt;
margin-left: 4px;
}
:disabled,
input:read-only {
border: 0px;
margin-top: 1px !important;
background: transparent;
}
div.activeGridInnerSecondary {
display: flex;
height: 17px !important;
align-items: end;
justify-items: end;
width: 100%;
font-size: 10pt;
}
div.activeGridInnerSecondaryDouble {
display: flex;
height: 24px !important;
column-gap: 8px;
align-items: center;
justify-items: start;
width: 100%;
font-size: 10pt;
margin-left: -7px;
margin-top: 4px;
}
div.activeGridInnerTertiaryDouble {
display: flex;
height: 24px !important;
column-gap: 9px;
align-items: center;
justify-items: start;
width: 100%;
font-size: 10pt;
margin-left: -7px;
margin-top: 3px;
position: relative;
left: 7px;
}
div.activeGridInnerSecondaryDoubleAntagonist {
display: grid;
grid-template-columns: 57px 35px 50px 35px 77px 20px;
height: 24px !important;
align-items: center;
justify-items: start;
width: 100%;
font-size: 11pt !important;
margin-left: 4px;
margin-top: 4px;
}
div.activeGridInnerTertiaryDoubleAntagonist {
display: grid;
grid-template-columns: 70px 120px 70px 103px;
height: 24px !important;
align-items: center;
justify-items: start;
width: 100%;
font-size: 10pt;
margin-left: 4px;
margin-top: 1px;
}
div.activeGridInnerFourthDouble,
div.activeGridInnerOtherDouble {
display: none;
}
.activeWARDouble {
display: flex;
flex-direction: column;
}
.activeTextarea {
width: 97% !important;
margin: 0px 10px 0px 10px;
line-height: 13px;
}
.activeColumnTitle {
line-height: 25px;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 20px;
height: 40px;
display: flex;
align-items: center;
margin-bottom: 5px;
}
.activeColumnTitleAntagonist {
line-height: 25px;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 20px;
height: 25px;
display: flex;
align-items: center;
margin-bottom: 3px;
margin-top: -6px;
justify-content: center;
}
.activeColumnTitleAntagonistTwo {
line-height: 25px;
background: rgb(7, 16, 25);
text-align: center;
font-weight: bolder;
color: #85d6ff;
border-radius: 20px;
height: 25px;
display: flex;
align-items: center;
margin-bottom: 5px;
margin-top: 5px;
justify-content: center;
}
.qualities {
width: 98% !important;
height: 293px !important;
margin-bottom: 0px !important;
}
.activeWARName {
height: 25px !important;
background: rgba(0, 0, 0, 0) !important;
border: 0px !important;
text-align: center !important;
font-size: 15pt !important;
margin-top: -6px !important;
}
.activeWARNameDouble {
height: 25px !important;
background: rgba(0, 0, 0, 0) !important;
border: 0px !important;
text-align: center !important;
display: flex;
justify-items: center;
font-size: 10pt !important;
width: 247px;
}
.activeWARNameAntagonist {
height: 25px !important;
background: rgba(0, 0, 0, 0) !important;
border: 0px !important;
text-align: center !important;
display: flex;
justify-items: center;
font-size: 10pt !important;
width: 399px;
}
.activeUsesToggle[value='0'] ~ .activeUses,
.activeUsesToggle[value='1'] ~ .stupid,
.activeUsesToggle[value='0'] ~ .stupider {
display: none !important;
}
.activeUsesToggle[value='1'] ~ .activeUses,
.activeUsesToggle[value='0'] ~ .stupid,
.activeUsesToggle[value='1'] ~ .stupider {
display: flex !important;
}
div.activeGridDouble {
display: flex;
height: 24px !important;
align-items: center;
justify-items: center;
margin-left: -1px;
margin-right: -1px;
}
.rotate {
transform: rotate(-90deg);
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}
div.activeGridDoubleAntagonist {
display: grid;
grid-template-columns: 1fr;
height: 24px !important;
align-items: center;
}
.activeUsesToggle[value='0'] ~ div.activeGridDoubleSecond {
display: flex;
height: 25px !important;
align-items: center;
justify-items: start;
justify-content: space-between;
}
.activeUsesToggle[value='1'] ~ div.activeGridDoubleSecond {
display: flex;
height: 25px !important;
align-items: center;
justify-items: start;
justify-content: space-between;
}
div.activeGridDoubleSecondAntagonist {
display: grid;
grid-template-columns: 53px 63px 47px 80px 73px 27px;
height: 28px !important;
align-items: center;
justify-items: start;
margin-left: -60px;
}
h4.activeClick {
position: absolute;
width: 250px;
height: 25px;
}
h4.qualityClick {
position: absolute;
width: 200px;
height: 17px;
}
h4.blessingsClick {
position: absolute;
width: 263px;
height: 18px;
}
.augmentsRight {
border: 1px solid black;
border-radius: 13px;
margin-top: 7px;
width: 315px !important;
}
h4.augmentClick {
position: absolute;
width: 255px;
height: 25px;
}
.superiorityShow {
display: none;
}
.superiorityToggle[value='1'] ~ .superiorityShow {
display: block;
}
.augmentLevel {
width: 20px !important;
font-size: 11px !important;
text-align: center !important;
height: 12px !important;
}
.shardLevel {
width: 20px !important;
font-size: 11px !important;
text-align: center !important;
height: 10px !important;
margin-top: 1px !important;
padding-top: 2px !important;
}
.augmentButton[type='roll'] {
margin-top: 2px !important;
margin-right: 5px !important;
color: #85d6ff !important;
font-weight: 100 !important;
font-size: 19pt !important;
}
.activeButton {
width: 67% !important;
height: 25px !important;
position: absolute;
background: none !important;
color: transparent !important;
margin: 0px;
margin-top: -2px;
left: 77px;
border: 0px;
opacity: 0% !important;
}
.activeInput {
width: 15px !important;
height: 15px !important;
margin-top: 0px !important;
}
.activeActive {
justify-self: end;
}
.activeInactive {
display: none;
}
.activeEndurance {
display: flex;
grid-area: f;
align-items: center;
margin-right: 5px;
}
.activeInputResult[value='1'] ~ div.activeActive,
.activeInputResult[value='0'] ~ div.activeInactive {
display: grid;
margin-right: 8px;
}
.activeInput:checked ~ .activeWARNameDouble {
width: 247px;
}
.activeInput:not(:checked) ~ .activeWARNameDouble {
width: 247px;
}
h4.activeClickDouble {
position: absolute;
width: 245px;
height: 25px;
right: 39px;
}
.flawed,
.passive_flawed,
.cone,
.ctwo {
display: none !important;
}
.passive_flawed_toggle[value='0'] ~ .cone,
.passive_flawed_toggle[value='2'] ~ .ctwo {
display: grid !important;
}
.flawed_toggle[value='1'] ~ .flawed {
display: flex !important;
}
.passive_flawed_toggle[value='2'] ~ .passive_flawed {
display: block !important;
}
.passive_flawed_toggle[value='0'] ~ div.effectsbox {
height: 205px !important;
}
.passive_flawed_toggle[value='2'] ~ div.effectsbox {
height: 205px !important;
}
.passive_flawed_toggle[value='0'] ~ .effectsboxtext {
height: 170px !important;
}
.passive_flawed_toggle[value='2'] ~ .effectsboxtext {
height: 170px !important;
}
.passive_flawed_toggle[value='2'] ~ .passiveReactivePopupFlex {
height: 109px !important;
}
/*#endregion*/
/*#region repeatingControl*/
.itemcontrol {
z-index: 10;
}
.repcontrol_add {
align-self: flex-end;
border-radius: 20px;
font-size: 14pt !important;
}
.repcontrol_edit {
align-self: flex-start !important;
border-radius: 20px;
font-size: 14pt !important;
}
.abilityShell .repcontrol_add {
align-self: flex-end;
border-radius: 20px;
font-size: 10pt !important;
width: 40px;
opacity: 1;
padding-left: 4px;
padding-right: 8px;
margin: 5px 0px;
}
.repcontainer[data-groupname='repeating_ability'],
.repcontainer[data-groupname='repeating_war'],
.repcontainer[data-groupname='repeating_qualities'],
.repcontainer[data-groupname='repeating_warantagonist'] {
display: flex;
flex-wrap: wrap;
column-gap: 4px;
flex-direction: column;
row-gap: 1px;
margin-right: 3px;
margin-bottom: 2px;
}
.repcontainer[data-groupname='repeating_warantagonist'] .repitem {
max-width: 400px;
}
.repcontainer[data-groupname='repeating_toolkit'] .repitem {
display: grid;
grid-template-columns: 121px 21px;
height: 17px !important;
margin-top: 4px;
direction: ltr;
}
.repcontainer[data-groupname='repeating_talents'] .repitem {
height: 17px !important;
margin-top: 4px;
}
[data-groupname='repeating_ability'] > button.btn.repcontrol_add {
margin-right: 3px;
}
[data-groupname='repeating_warrunes'] > button.btn.repcontrol_add {
position:absolute;
z-index: 2;
top: 105px;
right: 7px;
}
[data-groupname='repeating_warrunes'] > button.btn.repcontrol_edit {
position:absolute;
z-index: 2;
left:8px;
top: 105px;
}
[data-groupname='repeating_ability'] > button.btn.repcontrol_modify {
margin-left: 3px;
}
[data-groupname='repeating_ability'] > button.btn.repcontrol_edit {
margin-left: 3px;
}
.itemcontrol[data-groupname='repeating_ability'] .repcontrol_del {
font-size: 8pt;
padding: 0px 6px;
margin-right: 5px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_ability']
.repitem
.itemcontrol
.repcontrol_del {
font-size: 8pt;
padding: 0px 6px;
margin-right: 5px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_toolkit']
.repitem
.itemcontrol
.repcontrol_del {
font-size: 7pt;
padding: 0px 4px;
margin-right: 2px;
margin-top: -2px;
height: 17px;
line-height: 15px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_talents']
.repitem
.itemcontrol
.repcontrol_del {
font-size: 7pt;
padding: 0px 4px;
margin-right: 2px;
margin-top: -2px;
height: 17px;
line-height: 15px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_toolkit']
.repitem
.itemcontrol
.repcontrol_move {
position: relative;
font-size: 11pt;
top: -13px;
left: 5px;
padding: 0px 4px;
line-height: 14px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_talents']
.repitem
.itemcontrol
.repcontrol_move {
position: relative;
font-size: 11pt;
top: -13px;
left: 5px;
padding: 0px 4px;
line-height: 14px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_ability']
.repitem
.itemcontrol
.repcontrol_move {
position: relative;
font-size: 11pt;
top: -8px;
left: 9px;
padding: 0px 4px;
line-height: 14px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_war']
.repitem
.itemcontrol
.repcontrol_del {
position: relative;
font-size: 19pt;
width: 40px;
top: 3px;
right: 4px;
padding: 3px 4px 5px 4px;
line-height: 28px;
border-radius: 38px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_war']
.repitem
.itemcontrol
.repcontrol_move {
position: relative;
font-size: 36pt;
width: 40px;
top: 2px;
left: 4px;
padding: 3px 4px 3px 4px;
line-height: 28px;
font-weight: 900;
border-radius: 38px;
}
.repcontrol[data-groupname='repeating_ability'],
.repcontrol[data-groupname='repeating_war'],
.repcontrol[data-groupname='repeating_qualities'],
.repcontrol[data-groupname='repeating_warantagonist'] {
display: flex;
justify-content: space-between;
}
.repcontrol[data-groupname='repeating_power'] .repcontrol_move {
grid-area: d;
}
.repcontrol[data-groupname='repeating_power'] .repcontrol_edit {
font-size: 11pt !important;
align-self: flex-end !important;
order: 2;
}
.repcont .repcontrol[data-groupname='repeating_power'] .repcontrol_add {
grid-area: d;
margin-bottom: 20px;
}
.repcontrol[data-groupname='repeating_equipment'] .repcontrol_add {
position: absolute;
top: 410px;
right: 11px;
}
.repcontrol[data-groupname='repeating_toolkit'] .repcontrol_add {
position: absolute;
bottom: 8px;
left: 110px;
padding-top: 2px;
font-size: 14px !important;
font-weight: bolder;
height: 23px;
}
.repcontrol[data-groupname='repeating_talents'] .repcontrol_add {
position: absolute;
bottom: 8px;
right: 6px;
padding-top: 2px;
font-size: 14px !important;
font-weight: bolder;
height: 23px;
}
.repcontrol[data-groupname='repeating_talents'] .repcontrol_edit {
position: absolute;
bottom: 8px;
right: 61px;
padding-top: 2px;
font-size: 14px !important;
font-weight: bolder;
height: 23px;
}
.repcontrol[data-groupname='repeating_equipment'] .repcontrol_del {
margin-right: 17px;
}
.repcontrol[data-groupname='repeating_toolkit'] .repcontrol_del {
margin-right: 17px;
}
a.repcontainer[data-groupname='repeating_equipment'] a.btn.repcontrol_move {
margin-top: -11px;
margin-left: 1px;
}
a.repcontainer[data-groupname='repeating_toolkit'] a.btn.repcontrol_move {
margin-top: -11px;
margin-left: 1px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_toolkit']
.repitem
.itemcontrol
.repcontrol_move {
position: relative;
font-size: 11pt;
top: -10px;
left: 1px;
padding: 0px 4px;
line-height: 14px;
border-radius: 50px;
padding-top: 2px;
width: 19px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_talents']
.repitem
.itemcontrol
.repcontrol_move {
position: relative;
font-size: 11pt;
top: -10px;
left: 1px;
padding: 0px 4px;
line-height: 14px;
border-radius: 50px;
padding-top: 2px;
width: 19px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_toolkit']
.repitem
.itemcontrol
.repcontrol_del {
font-size: 7pt;
padding: 0px 4px;
margin-right: 3px;
margin-top: -2px;
height: 19px;
line-height: 15px;
border-radius: 50px;
width: 20px;
}
.ui-dialog
.charsheet
.repcontainer[data-groupname='repeating_talents']
.repitem
.itemcontrol
.repcontrol_del {
font-size: 7pt;
padding: 0px 4px;
margin-right: 0px;
margin-top: -3px;
height: 19px;
line-height: 15px;
border-radius: 50px;
width: 20px;
}
.repcontrol[data-groupname='repeating_equipment'] .repcontrol_edit {
position: absolute;
top: 410px;
left: 585px;
}
.repcontrol[data-groupname='repeating_toolkit'] .repcontrol_edit {
position: absolute;
bottom: 8px;
left: 6px;
padding-top: 2px;
font-size: 14px !important;
font-weight: bolder;
height: 23px;
}
.repcontrol[data-groupname='repeating_blessings'] .repcontrol_add,
.repcontrol[data-groupname='repeating_powers'] .repcontrol_add {
position: absolute;
top: 569px;
left: 697px;
}
.repcontainer[data-groupname='repeating_blessings'],
.repcontainer[data-groupname='repeating_powers'] {
display: flex;
flex-wrap: wrap;
}
.repcontrol[data-groupname='repeating_blessings'] .repcontrol_del,
.repcontrol[data-groupname='repeating_powers'] .repcontrol_del {
margin-right: 17px;
}
.repcontainer[data-groupname='repeating_blessings'] a.btn.repcontrol_move,
.repcontainer[data-groupname='repeating_powers'] a.btn.repcontrol_move {
display: none;
}
.repcontrol[data-groupname='repeating_blessings'] .repcontrol_edit,
.repcontrol[data-groupname='repeating_powers'] .repcontrol_edit {
position: absolute;
top: 569px;
left: 143px;
}
.abilityShell .repcontrol_edit {
align-self: flex-start !important;
border-radius: 20px;
font-size: 10pt !important;
width: 40px;
opacity: 1;
padding-left: 10px;
margin: 5px 0px;
}
.abilityShell .repcontrol_del {
height: 20px;
width: 20px;
padding: 0px;
margin-top: 1px;
margin-right: 4px;
border-radius: 25px;
}
.abilityShell .repcontrol_move {
padding: 0px;
height: 20px;
width: 20px;
border-radius: 25px;
position: relative;
z-index: 10;
align-self: flex-start;
left: 4px;
top: 2px;
}
/*#endregion*/
/*#region popupControl*/
.overlay {
position: fixed;
z-index: 1;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.7);
transition: opacity 500ms;
visibility: hidden;
opacity: 0;
width: 100%;
}
.overlay:target {
visibility: visible;
opacity: 1;
}
.popupCharacteristics {
margin: 10px auto;
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 75%;
position: relative;
transition: all 0.5s ease-in-out;
}
.popupWAR {
margin: 10px auto;
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 402px;
position: relative;
transition: all 0.5s ease-in-out;
}
.popupSpecialisation {
margin: 10px auto;
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 652px;
position: relative;
transition: all 0.5s ease-in-out;
}
.popupEquipment {
margin: 10px auto;
padding: 1px;
border-radius: 15px;
width: 852px;
position: relative;
transition: all 0.5s ease-in-out;
height: 460px;
}
.popupBionic {
margin: 10px auto;
padding: 1px;
border-radius: 15px;
width: 702px;
position: relative;
transition: all 0.5s ease-in-out;
height: 460px;
}
.popupEquipmentUpper {
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 852px;
position: relative;
transition: all 0.5s ease-in-out;
margin-bottom: 5px;
height: 462px;
}
.popupBionicUpper {
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 702px;
position: relative;
transition: all 0.5s ease-in-out;
margin-bottom: 5px;
height: 462px;
}
.popupEquipmentLower {
padding: 1px;
background-color: #85d6ff;
border-radius: 15px;
width: 752px;
position: relative;
transition: all 0.5s ease-in-out;
}
.popupCharacteristics .close,
.popupToolkit .close,
.popupManifestations .close,
.popupWAR .close,
.popupEquipment .close {
height: 35px;
min-width: 25px;
color: #85d6ff;
transition: all 200ms;
font-size: 30px;
font-weight: bold;
text-decoration: none;
opacity: 0.9 !important;
}
.popupCharacteristics .close:hover,
.popupToolkit .close:hover,
.popupManifestations .close:hover,
.popupWAR .close:hover,
.popupEquipment .close:hover {
color: #06d85f;
}
.popupCharacteristics .content {
max-height: 50%;
overflow: auto;
}
/*#endregion*/
/*#region actions abilities powers pursuit*/
.pursuitName {
font-size: 10pt !important;
margin-right: 5px;
margin-left: 5px;
margin-bottom: -5px;
}
.bionics {
display: none;
}
.bionic_check[value='EnhancerT'] ~ .bionics {
display: block !important;
}
div.actionShell {
height: fit-content;
width: 430px !important;
border-radius: 15px 15px 15px 15px;
border: 1px solid black;
line-height: 25px !important;
display: grid;
grid-template-rows: 25px;
align-items: center;
position: relative;
padding-bottom: 3px;
top: -25px;
margin-bottom: -25px;
}
.pursuitButton[type='roll'] {
color: black !important;
font-weight: bolder !important;
margin-right: -3px !important;
margin-left: 0px !important;
padding-left: 1px !important;
height: 20px !important;
font-size: 20pt !important;
margin-bottom: 1px !important;
}
.manButton {
font-family: 'dicefontd10' !important;
background: transparent !important;
border: 0px;
font-size: 17pt !important;
margin-bottom: 10px !important;
-webkit-text-stroke-width: thin;
-webkit-text-stroke-color: black;
height: 15px !important;
width: 25px !important;
color: black !important;
margin-left: 0px !important;
padding-left: 0px !important;
-webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0),
0 1px 2px rgba(0, 0, 0, 0);
-moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0),
0 1px 2px rgba(0, 0, 0, 0);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0), 0 1px 2px rgba(0, 0, 0, 0);
}
.abilitiesActionsButton {
align-self: center;
border-radius: 25px;
padding-bottom: 1px;
width: 135px;
height: 28px !important;
line-height: 29px;
font-size: 14pt;
}
.combatButton {
align-self: center;
border-radius: 25px;
padding-bottom: 21px;
padding-top: 2px;
width: 125px;
background: #071019;
color: #85d6ff;
height: 20px;
font-size: 12pt;
font-weight: 300;
text-align: center;
}
/*#endregion*/
/*#region bionics*/
.cns_bionics_description,
.pns_bionics_description,
.cs_bionics_description,
.larm_bionics_description,
.rarm_bionics_description,
.barm_bionics_description,
.legs_bionics_description,
.structural_bionics_description {
display: none;
}
.cns_toggle:where(:not([value=''])) ~ .cns_bionics_description,
.pns_toggle:where(:not([value=''])) ~ .pns_bionics_description,
.cs_toggle:where(:not([value=''])) ~ .cs_bionics_description,
.larm_toggle:where(:not([value=''])) ~ .larm_bionics_description,
.rarm_toggle:where(:not([value=''])) ~ .rarm_bionics_description,
.barm_toggle:where(:not([value=''])) ~ .barm_bionics_description,
.legs_toggle:where(:not([value=''])) ~ .legs_bionics_description,
.structural_toggle:where(:not([value=''])) ~ .structural_bionics_description {
display: block;
}
.cnsBionics {
position: absolute;
top: 85px;
left: 120px;
}
.pnsBionics {
position: absolute;
top: 57px;
left: 120px;
}
.csBionics {
position: absolute;
top: 130px;
left: 160px;
}
.structuralBionics {
position: absolute;
bottom: 20px;
left: 15px;
}
.larmBionics {
position: absolute;
top: 170px;
left: 175px;
}
.rarmBionics {
position: absolute;
top: 195px;
left: 175px;
}
.legsBionics {
position: absolute;
top: 300px;
left: 175px;
}
.bothBionics {
position: absolute;
top: 170px;
left: 175px;
}
.armtoggleBionics {
position: absolute;
top: 153px;
left: 175px;
}
.both_arms,
.double_arms {
display: none;
}
.arm_toggle[value='1'] ~ .both_arms,
.arm_toggle[value='0'] ~ .double_arms {
display: block;
}
h4.bionicsClick {
position: absolute;
width: 237px;
height: 18px;
}
#edit-button:active {
color: #85d6ff;
background: rgb(7, 16, 25);
padding-top: 3px !important;
margin-top: -4px !important;
margin-left: -3px;
border-radius: 10px;
width: 34px !important;
position: absolute;
padding-left: 5px;
left: 412px;
top: 13px;
height: 20px !important;
}
#edit-button:hover {
color: #356780;
background: rgba(7, 16, 25, 0.3);
padding-top: 3px !important;
margin-top: -4px !important;
margin-left: -3px;
border-radius: 10px;
width: 34px !important;
position: absolute;
padding-left: 5px;
left: 412px;
top: 13px;
height: 20px !important;
}
#edit-button {
color: #404040;
background: rgba(7, 16, 25, 0.15);
padding-top: 3px !important;
margin-top: -4px !important;
margin-left: -3px;
font-weight: 700;
line-height: 14px;
border-radius: 10px;
width: 34px !important;
position: absolute;
padding-left: 5px;
left: 412px;
top: 13px;
height: 20px !important;
}
.playercharsheet {
display: grid;
grid-template-columns: 435px auto;
column-gap: 3px;
margin-left: -10px;
}
/*#endregion*/
/*#region rolltemplates*/
.sheet-rolltemplate-reactive,
.sheet-rolltemplate-active,
.sheet-rolltemplate-ability,
.sheet-rolltemplate-pursuit,
.sheet-rolltemplate-antagonistdamage,
.sheet-rolltemplate-blank,
.sheet-rolltemplate-defence,
.sheet-rolltemplate-resistance,
.sheet-rolltemplate-manoeuvre {
display: flex;
flex-wrap: wrap;
justify-content: center;
width: 230px !important;
}
.sheet-rolltemplate-empty {
display: none;
}
.sheet-rolltemplate-manoeuvre div.sheet-template-container,
.sheet-rolltemplate-ability div.sheet-template-container,
.sheet-rolltemplate-pursuit .sheet-template-container,
.sheet-rolltemplate-blank div.sheet-template-container,
.sheet-rolltemplate-stress div.sheet-template-container,
.sheet-rolltemplate-reactive div.sheet-template-container,
.sheet-rolltemplate-active div.sheet-template-container,
.sheet-rolltemplate-antagonistdamage div.sheet-template-container,
.sheet-rolltemplate-defence div.sheet-template-container,
.sheet-rolltemplate-resistance div.sheet-template-container {
border: 2px solid #000 !important;
border-radius: 14px !important;
font-size: 9pt;
width: 100%;
cursor: default;
line-height: 1.15em;
}
.sheet-rolltemplate-manoeuvre .sheet-template-header,
.sheet-rolltemplate-reactive .sheet-template-header,
.sheet-rolltemplate-pursuit .sheet-template-header,
.sheet-rolltemplate-blank .sheet-template-header,
.sheet-rolltemplate-stress .sheet-template-header {
font-family: 'Crimson Text', serif !important;
background: rgb(7, 16, 25) !important;
color: #85d6ff !important;
padding: 2px;
font-weight: bolder;
border-bottom: 1px solid black;
line-height: 1em;
font-size: 1em;
border-radius: 10px 10px 0px 0px !important;
text-align: center;
cursor: default;
}
.sheet-rolltemplate-ability .sheet-template-header {
display: flex !important;
justify-content: space-between !important;
font-family: 'Crimson Text', serif !important;
background: rgb(7, 16, 25) !important;
color: #85d6ff !important;
padding: 2px;
font-weight: bolder;
border-bottom: 1px solid black;
line-height: 1em;
font-size: 1em;
border-radius: 10px 10px 0px 0px !important;
text-align: center;
cursor: default;
padding-left: 15px;
padding-right: 15px;
}
.sheet-rolltemplate-active .sheet-template-header,
.sheet-rolltemplate-antagonistdamage .sheet-template-header,
.sheet-rolltemplate-defence .sheet-template-header,
.sheet-rolltemplate-resistance .sheet-template-header {
font-family: 'Crimson Text', serif !important;
background: rgb(7, 16, 25) !important;
color: #85d6ff !important;
padding: 2px;
font-weight: bolder;
line-height: 1em;
font-size: 1em;
border-radius: 10px 10px 0px 0px !important;
text-align: center;
cursor: default;
padding-left: 10px !important;
padding-right: 10px !important;
}
.sheet-rolltemplate-antagonistdamage .sheet-template-headerFix,
.sheet-rolltemplate-defence .sheet-template-headerFix,
.sheet-rolltemplate-resistance .sheet-template-headerFix,
.sheet-rolltemplate-active .sheet-template-headerFix {
display: flex !important;
justify-content: space-between !important;
padding-left: 10px !important;
padding-right: 10px !important;
}
.sheet-rolltemplate-active .sheet-template-headerCenter {
display: flex !important;
justify-content: center !important;
padding-left: 10px !important;
padding-right: 10px !important;
}
.sheet-rolltemplate-active .sheet-template-subheader,
.sheet-rolltemplate-antagonistdamage .sheet-template-subheader {
font-family: 'Crimson Text', serif !important;
background: rgb(7, 16, 25) !important;
color: #85d6ff !important;
padding: 2px;
font-weight: bolder;
border-bottom: 1px solid black;
line-height: 1em;
font-size: 1em;
border-radius: 0px;
text-align: left;
cursor: default;
display: flex;
justify-content: space-between;
padding-left: 10px;
padding-right: 10px;
border-radius: 0px !important;
}
.sheet-rolltemplate-manoeuvre .sheet-template-row-outcome,
.sheet-rolltemplate-ability .sheet-template-row-outcome,
.sheet-rolltemplate-reactive .sheet-template-row-outcome,
.sheet-rolltemplate-pursuit .sheet-template-row-outcome,
.sheet-rolltemplate-blank .sheet-template-row-outcome,
.sheet-rolltemplate-active .sheet-template-row-outcome,
.sheet-rolltemplate-antagonistdamage .sheet-template-row-outcome,
.sheet-rolltemplate-defence .sheet-template-row-outcome,
.sheet-rolltemplate-resistance .sheet-template-row-outcome,
.sheet-rolltemplate-stress .sheet-template-row-outcome {
font-family: 'Crimson Text', serif !important;
font-weight: bold;
color: rgb(7, 16, 25) !important;
border-radius: 0px 0px 14px 14px;
text-align: center;
display: flex;
flex-direction: row;
flex-wrap: wrap;
min-height: 25px !important;
align-items: center;
justify-content: center;
font-style: italic;
padding-left: 10px !important;
padding-right: 10px !important;
}
.sheet-rolltemplate-active .sheet-template-row-outcome-two {
font-family: 'Crimson Text', serif !important;
font-weight: bold;
color: rgb(7, 16, 25) !important;
border-radius: 0px 0px 14px 14px;
text-align: center;
display: flex;
flex-direction: row;
flex-wrap: wrap;
min-height: 15px !important;
align-items: center;
justify-content: center;
font-style: italic;
padding-left: 10px !important;
padding-right: 10px !important;
}
.sheet-darkmode.ui-widget-content {
color: var(--dark-secondarytext) !important;
}
.sheet-darkmode .activeWARNameDouble,
.sheet-darkmode .passiveReactiveName,
.sheet-darkmode .blessingsName {
color: #85d6ff !important;
}
.sheet-rolltemplate-active .sheet-template-row-outcome-info,
.sheet-rolltemplate-antagonistdamage .sheet-template-row-outcome-info {
font-family: 'Crimson Text', serif !important;
font-weight: bold;
color: rgb(7, 16, 25) !important;
border-radius: 0px 0px 14px 14px;
text-align: left;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
font-style: italic;
padding-left: 10px !important;
padding-right: 10px !important;
}
.sheet-rolltemplate-defence .sheet-template-row-outcome-effect,
.sheet-rolltemplate-resistance .sheet-template-row-outcome-effect {
font-family: 'Crimson Text', serif !important;
font-weight: bold;
color: rgb(7, 16, 25) !important;
border-radius: 0px 0px 14px 14px;
text-align: left;
display: flex;
flex-direction: row;
flex-wrap: wrap;
text-align: justify;
justify-content: space-between;
font-style: bold;
padding-left: 10px !important;
padding-right: 10px !important;
font-size: 11px;
line-height: 11px;
padding-top: 3px;
padding-bottom: 3px;
}
.sheet-rolltemplate-antagonistdamage .sheet-template-row-outcome a[href^='~'] {
font-family: 'dicefontd10' !important;
background: transparent;
border: 0px;
font-size: 26pt;
font-style: normal !important;
margin-bottom: 5px;
-webkit-text-stroke-width: thin;
-webkit-text-stroke-color: black;
color: black;
padding-left: 10px !important;
padding-right: 10px !important;
}
.sheet-rolltemplate-reactive .sheet-template-justify {
display: flex;
justify-content: space-between;
padding: 0px 10px;
}
.sheet-rolltemplate-pursuit .sheet-template-justify {
display: grid !important;
grid-template-columns: 1fr 1fr;
padding: 0px 10px !important;
column-gap: 15px;
}
.sheet-rolltemplate-pursuit .sheet-template-left {
justify-self: end !important;
}
.sheet-rolltemplate-pursuit .sheet-template-right {
justify-self: start !important;
font-weight: 900;
}
.sheet-rolltemplate-manoeuvre .sheet-template-row,
.sheet-rolltemplate-ability .sheet-template-row,
.sheet-rolltemplate-reactive .sheet-template-row,
.sheet-rolltemplate-pursuit .sheet-template-row,
.sheet-rolltemplate-blank .sheet-template-row,
.sheet-rolltemplate-active .sheet-template-row,
.sheet-rolltemplate-antagonistdamage .sheet-template-row,
.sheet-rolltemplate-defence .sheet-template-row,
.sheet-rolltemplate-resistance .sheet-template-row,
.sheet-rolltemplate-stress .sheet-template-row {
font-family: 'Crimson Text', serif !important;
font-weight: 900;
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
padding-left: 5px !important;
padding-right: 5px !important;
min-height: 8px;
}
.sheet-rolltemplate-manoeuvre .inlinerollresult,
.sheet-rolltemplate-ability .inlinerollresult,
.sheet-rolltemplate-reactive .inlinerollresult,
.sheet-rolltemplate-pursuit .inlinerollresult,
.sheet-rolltemplate-blank .inlinerollresult,
.sheet-rolltemplate-active .inlinerollresult,
.sheet-rolltemplate-antagonistdamage .inlinerollresult,
.sheet-rolltemplate-defence .inlinerollresult,
.sheet-rolltemplate-resistance .inlinerollresult,
.sheet-rolltemplate-stress .inlinerollresult {
display: inline-block;
text-align: center;
border: 2px solid rgba(167, 168, 170, 1);
cursor: default;
}
.sheet-rolltemplate-manoeuvre .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-reactive .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-reactive .sheet-template-row-outcome .inlinerollresult,
.sheet-rolltemplate-pursuit .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-blank .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-active .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-active .sheet-template-row-outcome .inlinerollresult,
.sheet-rolltemplate-antagonistdamage .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-antagonistdamage
.sheet-template-row-outcome
.inlinerollresult,
.sheet-rolltemplate-defence .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-defence .sheet-template-row-outcome .inlinerollresult,
.sheet-rolltemplate-resistance .sheet-template-row .inlinerollresult,
.sheet-rolltemplate-resistance .sheet-template-row-outcome .inlinerollresult,
.sheet-rolltemplate-blank .sheet-template-row-outcome .inlinerollresult,
.sheet-rolltemplate-stress .sheet-template-row .inlinerollresult {
background: transparent;
border: none;
pointer-events: none;
}
.sheet-rolltemplate-active .sheet-template-row-center,
.sheet-rolltemplate-defence .sheet-template-row-center {
justify-content: center;
}
.sheet-rolltemplate-active .sheet-template-row-flex {
display: flex;
}
.sheet-rolltemplate-defence .sheet-template-row-roll .inlinerollresult,
.sheet-rolltemplate-resistance .sheet-template-row-roll .inlinerollresult,
.sheet-rolltemplate-active .sheet-template-row-roll .inlinerollresult,
.sheet-rolltemplate-blank .sheet-template-row-roll .inlinerollresult,
.sheet-rolltemplate-manoeuvre .sheet-template-row-roll .inlinerollresult,
.sheet-rolltemplate-pursuit .sheet-template-row-roll .inlinerollresult {
background: transparent;
border: 2px solid !important;
border-radius: 50px;
pointer-events: none;
font-weight: bold;
line-height: 18px;
min-height: 17px;
min-width: 12px;
max-height: 17px;
max-width: 12px;
}
.sheet-rolltemplate-defence .sheet-template-row-roll .fullcrit,
.sheet-rolltemplate-resistance .sheet-template-row-roll .fullcrit,
.sheet-rolltemplate-active .sheet-template-row-roll .fullcrit,
.sheet-rolltemplate-blank .sheet-template-row-roll .fullcrit,
.sheet-rolltemplate-manoeuvre .sheet-template-row-roll .fullcrit,
.sheet-rolltemplate-pursuit .sheet-template-row-roll .fullcrit {
border: 2px solid #3fb315 !important;
height: 14px;
padding-top: 2px;
line-height: 15px;
}
.sheet-rolltemplate-defence .sheet-template-row-roll .fullfail,
.sheet-rolltemplate-resistance .sheet-template-row-roll .fullfail,
.sheet-rolltemplate-active .sheet-template-row-roll .fullfail,
.sheet-rolltemplate-blank .sheet-template-row-roll .fullfail,
.sheet-rolltemplate-manoeuvre .sheet-template-row-roll .fullfail,
.sheet-rolltemplate-pursuit .sheet-template-row-roll .fullfail {
border: 2px solid #b31515 !important;
line-height: 15px;
}
.sheet-rolltemplate-blank .sheet-template-row-roll .inlinerollresult {
padding-left: 2px;
margin-left: 3px;
margin-right: 3px;
}
.sheet-rolltemplate-blank .sheet-template-row {
justify-content: center;
}
.sheet-rolltemplate-blank .sheet-template-row-outcome {
font-size: 12pt !important;
}
.sheet-rolltemplate-manoeuvre .sheet-template-row,
.sheet-rolltemplate-reactive .sheet-template-row,
.sheet-rolltemplate-pursuit .sheet-template-row,
.sheet-rolltemplate-blank .sheet-template-row,
.sheet-rolltemplate-active .sheet-template-row,
.sheet-rolltemplate-ability .sheet-template-row,
.sheet-rolltemplate-antagonistdamage .sheet-template-row,
.sheet-rolltemplate-stress .sheet-template-row,
.sheet-rolltemplate-defence .sheet-template-row,
.sheet-rolltemplate-manoeuvre .sheet-template-row-outcome,
.sheet-rolltemplate-reactive .sheet-template-row-outcome,
.sheet-rolltemplate-ability .sheet-template-row-outcome,
.sheet-rolltemplate-pursuit .sheet-template-row-outcome,
.sheet-rolltemplate-blank .sheet-template-row-outcome,
.sheet-rolltemplate-defence .sheet-template-row-outcome,
.sheet-rolltemplate-resistance .sheet-template-row-outcome,
.sheet-rolltemplate-active .sheet-template-row-outcome,
.sheet-rolltemplate-antagonistdamage .sheet-template-row-outcome,
.sheet-rolltemplate-stress .sheet-template-row-outcome {
cursor: default;
padding-left: 5px !important;
padding-right: 5px !important;
color: black;
font-size: 11px;
line-height: 11px;
padding-top: 3px;
padding-bottom: 3px;
}
.sheet-rolltemplate-active .sheet-template-span,
.sheet-rolltemplate-defence .sheet-template-span,
.sheet-rolltemplate-resistance .sheet-template-span {
display: flex;
justify-content: space-evenly;
width: 100%;
flex-wrap: wrap;
}
.sheet-rolltemplate-active .sheet-template-spanFlex,
.sheet-rolltemplate-defence .sheet-template-spanFlex,
.sheet-rolltemplate-resistance .sheet-template-spanFlex {
display: grid;
flex-direction: column;
align-items: center;
grid-template-rows: 20px 12px;
justify-items: center;
row-gap: 4px;
}
.sheet-rolltemplate-manoeuvre div:nth-child(odd),
.sheet-rolltemplate-ability div:nth-child(odd),
.sheet-rolltemplate-defence div:nth-child(odd),
.sheet-rolltemplate-resistance div:nth-child(odd),
.sheet-rolltemplate-pursuit div:nth-child(odd),
.sheet-rolltemplate-blank div:nth-child(odd),
.sheet-rolltemplate-reactive div:nth-child(odd),
.sheet-rolltemplate-stress div:nth-child(odd),
.sheet-rolltemplate-active div:nth-child(odd),
.sheet-rolltemplate-antagonistdamage div:nth-child(odd) {
background-color: rgba(197, 197, 224, 1);
}
.sheet-rolltemplate-manoeuvre div:nth-child(even),
.sheet-rolltemplate-ability div:nth-child(even),
.sheet-rolltemplate-defence div:nth-child(even),
.sheet-rolltemplate-resistance div:nth-child(even),
.sheet-rolltemplate-pursuit div:nth-child(even),
.sheet-rolltemplate-blank div:nth-child(even),
.sheet-rolltemplate-reactive div:nth-child(even),
.sheet-rolltemplate-stress div:nth-child(even),
.sheet-rolltemplate-active div:nth-child(even),
.sheet-rolltemplate-antagonistdamage div:nth-child(even) {
background-color: rgba(233, 233, 233, 1);
}
.sheet-rolltemplate-active div:last-child,
.sheet-rolltemplate-reactive div:last-child,
.sheet-rolltemplate-manoeuvre div:last-child,
.sheet-rolltemplate-antagonistdamage div:last-child,
.sheet-rolltemplate-resistance div:last-child,
.sheet-rolltemplate-ability div:last-child,
.sheet-rolltemplate-defence div:last-child,
.sheet-rolltemplate-pursuit div:last-child,
.sheet-rolltemplate-blank div:last-child,
.sheet-rolltemplate-stress div:last-child {
border-radius: 0px 0px 10px 10px;
padding-bottom: 1px;
}
/*#endregion*/