roll20-character-sheets/Dominion/Dominion.css

.charsheet div,
.charsheet p {
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    hyphens: auto;
}

.charsheet .sheet-3colrow .sheet-col {
    width: calc(33% - 30px) !important;
}

div.sheet-Null,
div.sheet-Cavalier,
div.sheet-Connetable,
div.sheet-Courtisan,
div.sheet-Gargouille,
div.sheet-Golem,
div.sheet-Espion,
div.sheet-Negociant,
div.sheet-Pontife,
div.sheet-Scientiste,
div.sheet-Seigneur,
div.sheet-Autre,
div.sheet-Lieutenant,

div.sheet-sante0,
div.sheet-sante1,
div.sheet-sante2,
div.sheet-sante3,
div.sheet-sante4,
div.sheet-sante5,
div.sheet-sante6,

div.sheet-role1,
div.sheet-role2,
div.sheet-role3,
div.sheet-role4,
div.sheet-role5,
div.sheet-role6
{
    display: none;
}

div.sheet-Family,
div.sheet-Character{
    display: none;
}

.sheet-hidden,
.charsheet input[type="radio"] {
  display: none;
}

input.sheet-type-selector {
  width: 170px;
  height: 20px;
  display: none;
  opacity: 0;
  z-index: 1;
  margin: 0;
  padding: 0;
  position: absolute;
}
.sheet-3waybox:checked + .sheet-3waybox, {
  display: inline-block;
}

/* Styling of the span common to all states */
span.sheet-type-selector {
  border: solid 1px #a7a7a7;
  text-align: center;
  display: inline-block;
  background: #cccccc;
  color: #3f3f3f;
  width: 170px;
  height: 20px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 1px;
  font-family: serif;
  font-weight: 600;
  cursor: pointer;
}
input.sheet-type-selector:hover ~ span {
  color: #ca9d00;
}

/* Here you can style the span depending on what state is toggled */
input.sheet-type-selector[value="character"]:checked ~ span::before {
  content: "Mode Dignite";
}
input.sheet-type-selector[value="family"]:checked ~ span::before {
  content: "Mode Maison";
}


input[type="radio"][value="0"].sheet-cplaybook:checked ~ div.sheet-Null,
input[type="radio"][value="1"].sheet-cplaybook:checked ~ div.sheet-Cavalier,
input[type="radio"][value="2"].sheet-cplaybook:checked ~ div.sheet-Connetable,
input[type="radio"][value="3"].sheet-cplaybook:checked ~ div.sheet-Courtisan,
input[type="radio"][value="4"].sheet-cplaybook:checked ~ div.sheet-Gargouille,
input[type="radio"][value="5"].sheet-cplaybook:checked ~ div.sheet-Golem,
input[type="radio"][value="6"].sheet-cplaybook:checked ~ div.sheet-Espion,
input[type="radio"][value="7"].sheet-cplaybook:checked ~ div.sheet-Negociant,
input[type="radio"][value="8"].sheet-cplaybook:checked ~ div.sheet-Pontife,
input[type="radio"][value="9"].sheet-cplaybook:checked ~ div.sheet-Scientiste,
input[type="radio"][value="10"].sheet-cplaybook:checked ~ div.sheet-Seigneur,
input[type="radio"][value="11"].sheet-cplaybook:checked ~ div.sheet-Autre,
input[type="radio"][value="99"].sheet-cplaybook:checked ~ div.sheet-Lieutenant,

input[type="radio"][value="family"]:checked ~ div.sheet-Family,
input[type="radio"][value="character"]:checked ~ div.sheet-Character
{
    display: block;
}

option.sheet-SkinSelect:checked
{
    display: none;
}

input[type="radio"][value="0"].sheet-santecheck:checked ~ div.sheet-sante0,
input[type="radio"][value="1"].sheet-santecheck:checked ~ div.sheet-sante1,
input[type="radio"][value="2"].sheet-santecheck:checked ~ div.sheet-sante2,
input[type="radio"][value="3"].sheet-santecheck:checked ~ div.sheet-sante3,
input[type="radio"][value="4"].sheet-santecheck:checked ~ div.sheet-sante4,
input[type="radio"][value="5"].sheet-santecheck:checked ~ div.sheet-sante5,
input[type="radio"][value="6"].sheet-santecheck:checked ~ div.sheet-sante6,
input[type="radio"][value="1"].sheet-rolecheck:checked ~ div.sheet-role1,
input[type="radio"][value="2"].sheet-rolecheck:checked ~ div.sheet-role2,
input[type="radio"][value="3"].sheet-rolecheck:checked ~ div.sheet-role3,
input[type="radio"][value="4"].sheet-rolecheck:checked ~ div.sheet-role4,
input[type="radio"][value="5"].sheet-rolecheck:checked ~ div.sheet-role5,
input[type="radio"][value="6"].sheet-rolecheck:checked ~ div.sheet-role6
{
  display: inline-block;
}

.charsheet button[type="roll"]:hover {
    color: #ca9d00;
    /*color: #e4bd1e;*/
}

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

.sheet-stats input[type="number"] {
    font-size:13px;
    color:black;
    height:30px
    text-align:center;
}

.sheet-stats button[type="roll"]::before{
    content: "";
    font-size:10px;
}

.sheet-stats button[type="roll"] {
    text-decoration:none;
    border:none;
    background:none;
    border:none;
    box-shadow:none;
    font-size:13px;
    padding:0;
    font-weight:bold;
}

hr.sheet-stats {
    display: block;
    height: 4px;
    border: 0;
    /*border-top: 4px solid #dac590;*/
    border-top: 4px solid black;
    margin: 1em 0;
    padding: 0;
}

hr {
    display: block;
    height: 4px;
    border: 0;
    border-top: 1px solid #000;
    margin: 1em 0;
    padding: 0;
}

textarea {
    resize:vertical;
    width:95%;
}

textarea:focus {
    border-color: #ca9d00;
}

.sheet-rolelieutenant select {
  color: #ca9d00;
  text-align: center;
  font-weight: bold;
}

h1 {
    font-size: 120%;
    font-family:"Tahoma";
    color: black;
    padding-left:30px;
    /*text-shadow: 1px 0 0 #cbb385, 0 1px 0 #cbb385, 0 -1px 0 #cbb385, -1px 0 0 #cbb385;*/
}

label {
    font-weight:normal;
    font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size:13px;
    cursor:pointer;
    display:inline-block;
}

img {
    vertical-align:top;
    display:inline-block;
}

label input[type="radio"]:checked + span,
label input[type="radio"]:hover + span,
label input[type="checkbox"]:checked + span,
input[type="checkbox"]:checked + b,
input[type="checkbox"]:hover + b,
input[type="radio"]:checked + span + b,
input[type="radio"]:hover + span + b,
input[type="radio"]:checked + b,
input[type="radio"]:hover + b,
label input[type="checkbox"]:hover + span,
input[type="radio"]:checked + input[type="text"],
input[type="checkbox"]:checked + input[type="text"]
{
    color: #ca9d00;
    border-color: #ca9d00;
}

input[type="checkbox"] {
    margin-bottom:3px;
}

input[type="number"] {
    text-align:center;
    color:black;
}

.sheet-Null img {
    margin-right:10px;
    vertical-align:middle;
    width: 10%;
}

.sheet-Null img +span {
    display: inline-block;
    width: 80%;
    vertical-align:middle;
}

.sheet-moves label,
.sheet-rang label,
.sheet-progression label,
.sheet-fatalitesautre label,
.sheet-equipementautre label,
.sheet-looks label{
    padding:0;
    margin:0;
}

.sheet-looks input[type="text"] {
  color: #ca9d00;
}

input:focus
{
    border-color: #ca9d00;
}

.sheet-moves input[type="text"],
.sheet-moves textarea {
    border:none;
    border-radius:0;
    background:none;
}

.sheet-moves input[type="text"] {
    font-weight:bold;
}

.sheet-stats input[type="checkbox"],
.sheet-equipement input[type="checkbox"],
.sheet-sante input[type="checkbox"],
.sheet-fatalites input[type="checkbox"],
.sheet-rang input[type="checkbox"],
.sheet-progression input[type="checkbox"]
{
    display:none;
}

.sheet-equipementautre input[type="text"],
.sheet-fatalitesautre input[type="text"] {
  width: 92%;
}

.sheet-sante input[type="text"] {
    font-weight:bold;
    border:none;
    border-radius:0;
    background:none;
    padding:0;
    margin-bottom:2px;
}

.sheet-relations input[type="text"] {
    border:none;
    border-radius:0;
    background:none;
    padding:0;
    margin-bottom:2px;
    width:75%;
}

.sheet-relations input[type="text"]:first-child {
  font-weight:bold;
  color: #ca9d00;
  width: 20%;
}

.sheet-rang input[type="checkbox"] {
    display: inline-block;
}

.sheet-etat {
  margin-top:5px;
  text-align: center;
}



/*-----radio boxes-----*/

/* -----Hide actual radio----- */
input.sheet-normal[type="radio"]
{
    opacity: 0;
    width: 16px;
    height: 16px;
    position: relative;
    top: 5px;
    left: 6px;
    margin: -10px;
    cursor: pointer;
    z-index: 1;
    display:inline;
}

/* -----Fake radio----- */
input.sheet-normal[type="radio"] + span::before
{
    margin-right: 2px;
    border: solid 1px #a8a8a8;
    line-height: 12px;
    text-align: center;
    display: inline-block;
    vertical-align: middle;
    
    -moz-box-shadow: 0 0 2px #ccc;
    -webkit-box-shadow: 0 0 2px #ccc;
    box-shadow: 0 0 2px #ccc;
    
    background: black;
    
    font-family: 'New Times Roman';
    color:black;
    content: "";
    width: 11px;
    height: 11px;
    font-size: 3em;
    text-shadow:none;
    
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;
}

/* -----Remove dot from all radios _after_ selected one----- */
input.sheet-normal[type="radio"]:checked ~ input.sheet-normal[type="radio"] + span::before
{    
    content: "";
    background:white;
}

/*------------empty traits-----------*/
input.sheet-zero[type="radio"]:checked + span::before
{
    opacity: 0.2;
}

input.sheet-zero[type="radio"]:hover + span::before
{
    opacity: 1;
}

input.sheet-zero[type="radio"] + span::before
{
    font-size: 12px;
    content: "✖";
    opacity: 0.25;
}

.sheet-rolltemplate-default caption {
  text-align: center;
}

.sheet-rolltemplate-dominion div {
    text-align: center;
    background:#1000a0;
}

.sheet-rolltemplate-dominion h1 {
    font-size: 120%;
    font-family:"Tahoma";
    color: black;
    /*color: #aaabac;*/
    /*color: #ca9d00;*/
    color: #ca9d00;
    /*background: black;*/
    position: relative;
    text-shadow: 1px 0 0 #563f00, 0 1px 0 #563f00, 0 -1px 0 #563f00, -1px 0 0 #563f00;
}

.sheet-rolltemplate-dominion h1:after {
  content: '';
  width: 116.5px;
  height: 2px;
  background: #ca9d00;
  position: absolute;
  bottom: -4px;
  left:58.25px
}

/*.sheet-rolltemplate-dominion div.sheet-container {
    background: black;
    vertical-align: middle;
}*/

.sheet-rolltemplate-dominion div.sheet-container:first-child {
    border: 2px solid #ca9d00;
}

.sheet-rolltemplate-dominion .sheet-success div {
  background: #368212;
}

.sheet-rolltemplate-dominion .sheet-failure div {
  background: #B31515;
}

.sheet-rolltemplate-dominion .sheet-success div.sheet-result {
    width: 80%;
    display: inline-block;
    font-weight: bold;
    font-size: 20px;
    height: 37px;
    vertical-align: middle;
    line-height: 37px;
    /*color: #22AA22;*/
    /*9b7403  563f00*/
    /*color: #368212;*/
    color: #ca9d00;
    text-shadow: 1px 0 0 #563f00, 0 1px 0 #563f00, 0 -1px 0 #563f00, -1px 0 0 #563f00;
}
.sheet-rolltemplate-dominion div.sheet-result {
    width: 80%;
    display: inline-block;
    font-weight: bold;
    font-size: 20px;
    height: 37px;
    vertical-align: middle;
    line-height: 37px;
    /*color: #000080;*/
    color: #ca9d00;
    text-shadow: 1px 0 0 #563f00, 0 1px 0 #563f00, 0 -1px 0 #563f00, -1px 0 0 #563f00;
    padding-top: 5px;
}
.sheet-rolltemplate-dominion .sheet-failure div.sheet-result {
    width: 80%;
    display: inline-block;
    font-weight: bold;
    font-size: 20px;
    height: 37px;
    vertical-align: middle;
    line-height: 37px;
    /*color: #B31515;*/
    color:#ca9d00;
    text-shadow: 1px 0 0 #563f00, 0 1px 0 #563f00, 0 -1px 0 #563f00, -1px 0 0 #563f00;
}

.sheet-rolltemplate-dominion div.sheet-jet {
    width: 15%;
    display: inline-block;
    font-size: 20px;
    height: 37px;
    line-height: 37px;
    vertical-align: middle;
    /*text-shadow: 1px 0 0 #ca9d00, 0 1px 0 #ca9d00, 0 -1px 0 #ca9d00, -1px 0 0 #ca9d00;*/
    text-shadow: 1px 0 0 #563f00, 0 1px 0 #563f00, 0 -1px 0 #563f00, -1px 0 0 #563f00;
    padding-top: 5px;
}

/* 10+ colour */
.sheet-rolltemplate-dominion .sheet-success .inlinerollresult,
.sheet-rolltemplate-dominion .sheet-success .inlinerollresult.fullcrit,
.sheet-rolltemplate-dominion .sheet-success .inlinerollresult.fullfail,
.sheet-rolltemplate-dominion .sheet-success .inlinerollresult.importantroll{
    background-color: transparent;
    /*color: #22AA22;*/
    /*color: #368212;*/
    border: none;
}

/* 7-9 colour */
.sheet-rolltemplate-dominion .inlinerollresult,
.sheet-rolltemplate-dominion .inlinerollresult.fullcrit,
.sheet-rolltemplate-dominion .inlinerollresult.fullfail,
.sheet-rolltemplate-dominion .inlinerollresult.importantroll{
    background-color: transparent;
    /*color: #000080;*/
    /*color: #1000a0;*/
    color:#ca9d00;
    border: none;
}

/* 6- colour */
.sheet-rolltemplate-dominion .sheet-failure .inlinerollresult,
.sheet-rolltemplate-dominion .sheet-failure .inlinerollresult.fullcrit,
.sheet-rolltemplate-dominion .sheet-failure .inlinerollresult.fullfail,
.sheet-rolltemplate-dominion .sheet-failure .inlinerollresult.importantroll{
    background-color: transparent;
    /*color: #B31515;*/
    border: none;
}

input[type="checkbox"].sheet-expander + span::after {
    content: "▼";
    position: relative;
    left: -13px;
}

input[type="checkbox"].sheet-expander:checked + span::after {
    content: "▲";
}