@import url("https://fonts.googleapis.com/css?family=Della+Respira&display=swap&family=Lato"); .charsheet { padding: 0 !important; position: relative; top: -11px; line-height: 16px; cursor: default; color: #333; font-size: 0; font-family: "Lato", sans-serif; } /* Sheet container */ .sheet-container { position: relative; max-width: 1190px; min-width: 860px; } div, span, textarea, span, label { box-sizing: border-box; } select { font-size: 12px; line-height: 1; border-radius: 0; margin: 0; padding: 0; } .sheet-standard-margin { margin-bottom: 5px; } .sheet-large-margin { margin-bottom: 10px; } button[type="roll"], button[type="action"] { display: flex; border: none; margin: 0; padding: 0; text-shadow: none; background: transparent; box-shadow: none; box-sizing: border-box; font-family: inherit; outline: none; border-radius: 0; transition: all 0.2s; z-index: 3; } button[type="roll"].btn::before, button[type="action"].btn::before { content: ""; } button[type="roll"]:hover, button[type="action"]:hover { color: #669999; } label { display: flex; margin: 0; padding: 0; width: auto; color: #333; font: inherit; } label input[type="checkbox"], label input[type="radio"] { position: absolute; } label:hover input[type="checkbox"] + span, label:hover input[type="radio"] + span { opacity: 0.7; } input[type="number"], input[type="text"], textarea { border: none; font-family: inherit; background: transparent; box-shadow: none; width: 100%; padding: 0; margin: 0; color: #333; border-radius: 0; transition: all 0.2s, height 0.4s; } input[type="number"]:focus, input[type="text"]:focus, textarea:focus { box-shadow: inset 0 0 1px 1px rgba(66, 66, 66, 0.3), 0 0 2px 1px rgba(66, 66, 66, 0.3); } textarea { resize: vertical; display: block; } textarea:active, textarea:focus { transition: height 0s; } input[type="checkbox"], input[type="radio"] { opacity: 0; z-index: 1; -moz-appearance: none; vertical-align: unset; position: relative; } input[type="checkbox"] + span, input[type="radio"] + span { cursor: pointer; display: inline-block; transition: all 0.2s, opacity 0s; } .sheet-logo { background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/logo_large.png"); background-size: auto 100%; background-repeat: no-repeat; margin-bottom: 5px; } /* SETTINGS FOR HIDING STUFF ON THE SHEET */ .sheet-hidden { display: none !important; } .sheet-hider[value="0"] + li, .sheet-hider[value="0"] + div, .sheet-hider[value="0"] + label { display: none; } .sheet-zero-height-hider + div { overflow: hidden; transition: max-height 1s; } .sheet-zero-height-hider[value="0"] + div { max-height: 0; } /* Auto-expand textareas */ /* Preloading graphics*/ .sheet-preload { opacity: 0; position: absolute; } .sheet-preload img { width: 1px; height: 1px; } /* REPEATING SECTION CONTROLS */ .repcontrol { display: flex; margin-top: 3px; } .repcontrol .repcontrol_edit { margin-left: auto; order: 1; } .repcontrol button { background: transparent; color: #555; border-radius: 0; border-color: #999; transition: all 0.2s; font-family: pictos; font-size: 0; font-weight: bold; padding: 5px 3px 2px; line-height: 8px; } .repcontrol button:hover { color: black; border-color: black; background: #ddd; } .repcontrol button.repcontrol_edit::after { content: "("; } .repcontrol button.repcontrol_add::after { content: "&"; } .repcontrol button.repcontrol_edit::after, .repcontrol button.repcontrol_add::after { font-size: 12px; } .repcontainer.editmode + .repcontrol button.repcontrol_edit::after { content: ")"; } .itemcontrol { z-index: 20; } .itemcontrol .btn { padding: 0 6px; line-height: 16px; } /* CHECKBOXES */ input[type="radio"].sheet-radiobox { flex: 0 0 auto; width: 12px; height: 12px; margin-right: -12px; } input[type="radio"].sheet-radiobox + span { flex: 0 0 auto; width: 12px; height: 12px; border: 1px solid black; } input[type="radio"].sheet-radiobox:hover + span { opacity: 0.7; } input[type="radio"].sheet-radiobox:last-child + span { margin-right: 0 !important; } input[type="radio"].sheet-radiobox.sheet-large { height: 14px; width: 14px; margin-right: -14px; } input[type="radio"].sheet-radiobox.sheet-large + span { height: 14px; width: 14px; } input[type="radio"].sheet-radiobox + span { background: #669999; } input.sheet-zero:checked ~ input[type="radio"].sheet-radiobox + span, input.sheet-radiobox:checked ~ input[type="radio"].sheet-radiobox + span { background: white; } input[type="checkbox"].sheet-squarebox { flex: 0 0 auto; width: 12px; height: 12px; margin-right: -12px; } input[type="checkbox"].sheet-squarebox + span { flex: 0 0 auto; width: 12px; height: 12px; border: 1px solid black; } input[type="checkbox"].sheet-squarebox:hover + span { opacity: 0.7; } input[type="checkbox"].sheet-squarebox:last-child + span { margin-right: 0 !important; } input[type="checkbox"].sheet-squarebox.sheet-large { height: 14px; width: 14px; margin-right: -14px; } input[type="checkbox"].sheet-squarebox.sheet-large + span { height: 14px; width: 14px; } input[type="checkbox"].sheet-squarebox + span { background: white; } input[type="checkbox"].sheet-squarebox:checked + span { background: #669999; } input[type="checkbox"].sheet-squarebox:checked ~ .sheet-colored-if-checked { color: #669999; } input[type="checkbox"].sheet-circlebox { flex: 0 0 auto; width: 12px; height: 12px; margin-right: -12px; } input[type="checkbox"].sheet-circlebox + span { flex: 0 0 auto; width: 12px; height: 12px; border: 1px solid black; } input[type="checkbox"].sheet-circlebox:hover + span { opacity: 0.7; } input[type="checkbox"].sheet-circlebox:last-child + span { margin-right: 0 !important; } input[type="checkbox"].sheet-circlebox.sheet-large { height: 14px; width: 14px; margin-right: -14px; } input[type="checkbox"].sheet-circlebox.sheet-large + span { height: 14px; width: 14px; } input[type="checkbox"].sheet-circlebox + span { background: white; } input[type="checkbox"].sheet-circlebox:checked + span { background: #669999; } input[type="checkbox"].sheet-circlebox + span { border-radius: 50%; } input[type="checkbox"].sheet-trianglebox { flex: 0 0 auto; width: 12px; height: 12px; margin-right: -12px; } input[type="checkbox"].sheet-trianglebox + span { flex: 0 0 auto; width: 12px; height: 12px; border: 1px solid black; } input[type="checkbox"].sheet-trianglebox:hover + span { opacity: 0.7; } input[type="checkbox"].sheet-trianglebox:last-child + span { margin-right: 0 !important; } input[type="checkbox"].sheet-trianglebox.sheet-large { height: 14px; width: 14px; margin-right: -14px; } input[type="checkbox"].sheet-trianglebox.sheet-large + span { height: 14px; width: 14px; } input[type="checkbox"].sheet-trianglebox + span { height: 0; width: 0; border-color: transparent; border-top-color: white; border-width: 12px 6px 0; } input[type="checkbox"].sheet-trianglebox:checked + span { border-top-color: red; } input[type="checkbox"].sheet-diamondbox { flex: 0 0 auto; width: 12px; height: 12px; margin-right: -12px; } input[type="checkbox"].sheet-diamondbox + span { flex: 0 0 auto; width: 12px; height: 12px; border: 1px solid black; } input[type="checkbox"].sheet-diamondbox:hover + span { opacity: 0.7; } input[type="checkbox"].sheet-diamondbox:last-child + span { margin-right: 0 !important; } input[type="checkbox"].sheet-diamondbox.sheet-large { height: 14px; width: 14px; margin-right: -14px; } input[type="checkbox"].sheet-diamondbox.sheet-large + span { height: 14px; width: 14px; } input[type="checkbox"].sheet-diamondbox + span { background: white; } input[type="checkbox"].sheet-diamondbox + span::before { content: ""; background: black; opacity: 0; display: block; z-index: 3; position: absolute; left: 4px; top: -4px; width: 2px; height: 19px; } input[type="checkbox"].sheet-diamondbox:checked + span::before, input[type="checkbox"].sheet-diamondbox:hover + span { opacity: 1; } input[type="checkbox"].sheet-diamondbox:checked:hover + span::before { opacity: 0.7; } input[type="checkbox"].sheet-diamondbox:hover + span::before { opacity: 0.3; } input[type="checkbox"].sheet-diamondbox + span { transform: rotate(45deg) scale(0.85); } input[type="checkbox"].sheet-circlebox.sheet-fakeradio + span { background: #669999; } .sheet-fakeradio:checked ~ input[type="checkbox"].sheet-circlebox.sheet-fakeradio + span { background: white; } input[type="checkbox"].sheet-squarebox.sheet-fakeradio + span { background: #669999; } .sheet-fakeradio:checked ~ input[type="checkbox"].sheet-squarebox.sheet-fakeradio + span { background: white; } input[type="checkbox"].sheet-squarebox.sheet-fakeradio2 + span { background: #669999; } .sheet-fakeradio2:checked ~ input[type="checkbox"].sheet-squarebox.sheet-fakeradio2 + span { background: white; } input[type="checkbox"].sheet-dot + span::before { content: ""; height: 7px; width: 7px; border-radius: 50%; z-index: 1; background: black; position: absolute; margin-left: 2px; margin-top: 1px; } .sheet-floatingbar { width: 3px; height: 2px; flex: 0 0 auto; background: #999; } .sheet-floating-vert-bar { width: 2px; height: 6px; flex: 0 0 auto; background: #999; } /* Zero resetter */ input.sheet-zero { width: 13px; height: 13px; margin-right: -13px; vertical-align: top; } input.sheet-zero + span { height: 11px; width: 11px; margin-top: 1px; margin-right: 2px; vertical-align: top; border: 1px solid black; background: white; border-radius: 50%; position: relative; } input.sheet-zero + span::before, input.sheet-zero + span::after { position: absolute; width: 1px; content: ""; left: 0; background: black; height: 11px; } input.sheet-zero + span::after { transform: translate(4px, -1px) rotate(135deg); } input.sheet-zero + span::before { transform: translate(4px, -1px) rotate(45deg); } input.sheet-zero:checked + span { visibility: hidden; } /* NOTES */ .sheet-auto-expand { position: relative; cursor: text; word-wrap: break-word; line-height: 14px; min-height: 28px; } .sheet-auto-expand span { visibility: hidden; white-space: pre-wrap; display: block; } .sheet-auto-expand textarea { position: absolute; overflow: hidden; z-index: 1; top: 0; left: 0; resize: none; height: 100%; word-wrap: break-word; padding: inherit; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; text-align: inherit; } .sheet-notes { position: relative; cursor: text; word-wrap: break-word; line-height: 17px; min-height: 34px; background: linear-gradient(transparent 16px, #a7a7a7 1px) 0 0/100% 17px; padding: 0 3px; width: 100%; font-size: 13px; } .sheet-notes span { visibility: hidden; white-space: pre-wrap; display: block; } .sheet-notes textarea { position: absolute; overflow: hidden; z-index: 1; top: 0; left: 0; resize: none; height: 100%; word-wrap: break-word; padding: inherit; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; text-align: inherit; } .sheet-type:not([value=""]) ~ .sheet-type-selector, .sheet-type:not([value="character"]) ~ .sheet-type-character, .sheet-type:not([value="strife"]) ~ .sheet-type-strife, .sheet-type:not([value="island"]) ~ .sheet-type-island { display: none; } .sheet-type-selector { border: 2px solid black; padding: 15px; margin: 20px auto; width: 240px; text-align: center; } .sheet-type-selector .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; font-size: 16px; margin-bottom: 8px; } .sheet-type-selector .sheet-content { display: grid; text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; grid-template: auto / 1fr 1fr 1fr; } .sheet-type-selector button[type="action"] { font-size: 14px; justify-content: center; } .sheet-type-character { display: grid; align-items: start; gap: 5px; font-size: 12px; grid-template: 50px 23px repeat(4, auto)/6.5fr 3.5fr 5.2fr 4.8fr; } .sheet-logo { grid-column: 1; grid-row: span 2; align-self: stretch; } .sheet-title-vertical { display: grid; grid-template-columns: 14px 1fr; column-gap: 3px; } .sheet-title-vertical > .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; font-size: 14px; line-height: 1; text-align: center; transform: rotate(-90deg); height: 14px; align-self: center; justify-self: center; } .sheet-title-vertical > .sheet-content { border-left: 2px solid black; } .sheet-glory { grid-column: span 2; align-self: stretch; } .sheet-glory > .sheet-title { width: 55px; } .sheet-glory .sheet-content { display: grid; padding-left: 5px; gap: 5px; grid-template: auto/repeat(4, 1fr); } .sheet-glory .sheet-content .sheet-box { display: flex; align-items: center; } .sheet-namebox { align-self: stretch; } .sheet-namebox > .sheet-title { width: 50px; } .sheet-namebox .sheet-content { display: grid; gap: 5px; padding-left: 5px; grid-template: auto/ 22% 32% 1fr; font-size: 12px; } .sheet-namebox .sheet-content label { line-height: 1; align-items: center; margin: 0; padding: 0; } .sheet-namebox .sheet-content input + span { margin-right: 3px; } .sheet-info { display: grid; align-content: start; grid-row: 3; grid-column: 1; grid-gap: 10px; } .sheet-info .sheet-infobox { display: grid; min-height: 39px; grid-template: auto / 34% 1fr; } .sheet-info .sheet-infobox .sheet-title { display: grid; background-color: #cad8dc; align-content: center; } .sheet-info .sheet-infobox .sheet-title .sheet-auto-expand { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; background-color: #cad8dc; padding: 3px; padding: 3px 5px; font-size: 12.5px; text-align: center; min-height: 14px; } .sheet-info .sheet-infobox .sheet-title .sheet-auto-expand input[type="text"], .sheet-info .sheet-infobox .sheet-title .sheet-auto-expand .sheet-auto-expand { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; } .sheet-info .sheet-infobox .sheet-content { display: flex; align-items: center; border: 2px solid black; } .sheet-info .sheet-infobox .sheet-content input[type="text"], .sheet-info .sheet-infobox .sheet-content .sheet-auto-expand { padding: 2px 4px; } .sheet-info .sheet-infobox .sheet-content input[type="text"], .sheet-info .sheet-infobox .sheet-content .sheet-auto-expand { flex: 1 1 auto; width: 0; font-size: 13px; line-height: 1.2; min-height: 18px; } .sheet-info select { width: 45px; height: 100%; border-left: 2px solid black; } .sheet-honored-god { position: relative; } .sheet-honored-god label { position: absolute; z-index: 5; width: auto; height: 12px; right: -6px; margin: 0; padding: 0; } .sheet-honored-god label:first-of-type { top: calc(25% - 6px); } .sheet-honored-god label:last-of-type { bottom: calc(25% - 6px); } button[type="roll"].sheet-domain-button-arts_oration { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/arts_oration.png"); } button[type="roll"].sheet-domain-button-blood_valor { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/blood_valor.png"); } button[type="roll"].sheet-domain-button-craft_reason { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/craft_reason.png"); } button[type="roll"].sheet-domain-button-resolve_spirit { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/resolve_spirit.png"); } .charsheet .sheet-domains { display: grid; border-left: 2px solid black; line-height: 1; align-content: start; align-self: start; grid-row: 2 / 4; grid-column: 2; grid-gap: 10px; margin-top: 5px; } .charsheet .sheet-domains .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; height: 12px; padding-left: 2px; } .charsheet .sheet-domains button[type="roll"].btn { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; background-color: #cad8dc; padding: 3px; display: block; text-align: center; font-size: 12px; white-space: normal; margin: 0; padding: 3px 3px 3px 20px; line-height: 1.2; width: 0; flex: 1 1 0; background-size: auto 65%; background-position: 3px center; background-repeat: no-repeat; } .charsheet .sheet-domains button[type="roll"].btn input[type="text"], .charsheet .sheet-domains button[type="roll"].btn .sheet-auto-expand { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; } .charsheet .sheet-domains button[type="roll"].btn.btn::before { content: ""; } .charsheet .sheet-domains select { width: 49px; border-width: 2px 2px 2px 0; height: 100%; border: 2px solid black; } .charsheet .sheet-domains .sheet-domain { display: flex; height: 39px; } .charsheet .sheet-domains .sheet-domain:last-child button[type="roll"] { background-position: 8px center; } .sheet-favors { position: relative; left: -17px; width: calc(100% + 17px); grid-row: 4; grid-column: span 2; } .sheet-favors > .sheet-title { width: 137px; } .sheet-favors .sheet-content { display: grid; gap: 5px; grid-template: auto/repeat(4, 1fr); } .sheet-favorbox { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; background-color: #cad8dc; padding: 3px; position: relative; padding: 5px 3px; border-right: 2px solid black; } .sheet-favorbox input[type="text"], .sheet-favorbox .sheet-auto-expand { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; } .sheet-favorbox label { position: absolute; z-index: 5; width: auto; height: 12px; right: -6px; margin: 0; padding: 0; } .sheet-favorbox label:first-of-type { top: calc(25% - 6px); } .sheet-favorbox label:last-of-type { bottom: calc(25% - 6px); } .sheet-favorbox .sheet-label { font-weight: bold; } .sheet-style-notes { position: relative; left: -17px; width: calc(100% + 17px); grid-row: 5; min-height: 135px; grid-column: span 2; } .sheet-style-notes .sheet-auto-expand { min-height: 90px; } .sheet-style-notes > .sheet-title { width: 135px; } .sheet-recite { position: relative; left: -17px; width: calc(100% + 17px); min-height: 155px; grid-row: 6; grid-column: span 3; } .sheet-recite > .sheet-title { width: 158px; } .sheet-recite .sheet-content { gap: 3px 5px; column-gap: 5px; row-gap: 3px; display: grid; align-content: start; grid-template: auto/repeat(4, 1fr); padding-left: 5px; } .sheet-recite .sheet-content > :first-child { margin-bottom: 5px; } .sheet-recite .sheet-content > :first-child, .sheet-recite .sheet-content > :last-child { grid-column: span 4; } .sheet-recite .sheet-content .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; font-weight: bold; } .sheet-recite .sheet-content > .sheet-auto-expand { font-size: 13px; line-height: 15px; min-height: 15px; } .sheet-recite .sheet-recite-box .sheet-auto-expand { font-size: 10.5px; line-height: 1.5; font-style: italic; } .sheet-pathos-bonds { grid-row: span 4; align-self: stretch; align-items: start; border-left: 2px solid black; display: grid; grid-template: auto / 57px 1fr; margin: 5px 0 0 5px; } .sheet-pathos-bonds .sheet-pathos-fate { border-right: 2px solid black; border-bottom: 2px solid black; display: flex; align-items: center; flex-flow: column; padding-bottom: 8px; } .sheet-pathos-bonds .sheet-pathos-fate input[type="checkbox"].sheet-circlebox, .sheet-pathos-bonds .sheet-pathos-fate input[type="checkbox"].sheet-squarebox { margin-right: 0; margin-bottom: -12px; } .sheet-pathos-bonds .sheet-pathos-fate .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; padding: 0 1px; margin-bottom: 5px; } .sheet-pathos-bonds .sheet-agony { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; width: 100%; background: #bbb; text-align: center; color: black; } .sheet-pathos-bonds .sheet-fate { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; width: 100%; text-align: center; background: black; color: white; } .sheet-pathos-bonds .sheet-bonds .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; padding-left: 2px; margin-bottom: 5px; } .sheet-pathos-bonds .sheet-bonds .repitem { display: grid; padding: 0 3px; border-bottom: 2px solid #999; grid-template: auto / 30px 1fr; margin-bottom: 4px; } .sheet-pathos-bonds .sheet-bonds input[type="number"] { font-size: 12px; width: 100%; } .sheet-pathos-bonds .sheet-bonds .repitem input[type="text"] { font-size: 12px; width: 100%; } .sheet-pathos-bonds .repcontrol { padding-left: 2px; } .sheet-pathos-bonds .sheet-bond-uses { margin-top: 10px; } .sheet-pathos-bonds .sheet-bond-uses .sheet-top { font-style: italic; text-align: center; line-height: 1.1; padding: 0 3px; } .sheet-pathos-bonds .sheet-bond-uses .sheet-bond-use { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; min-height: 14px; margin-top: 5px; padding: 3px; background: #ddd; } .sheet-great-deeds-boons { grid-row: span 4; margin-top: 5px; border-left: 2px solid black; } .sheet-great-deeds-boons .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; padding-left: 2px; margin-bottom: 5px; } .sheet-great-deeds-boons .repitem { display: flex; padding: 0 2px; border-bottom: 2px solid #999; margin-bottom: 3px; } .sheet-great-deeds-boons .repitem .sheet-squarebox { margin: 3px -12px 0 3px; } .sheet-great-deeds-boons .repitem .sheet-squarebox + span { margin: 3px 5px 0 0; } .sheet-great-deeds-boons .sheet-auto-expand { flex: 1 1 auto; margin: 3px 0; min-height: 14px; } .sheet-great-deeds-boons .repcontrol { padding-left: 2px; } .sheet-great-deeds-boons .sheet-boons { margin-top: 10px; } .sheet-great-deeds-boons .sheet-boon { display: flex; background-color: #cad8dc; padding: 4px; align-items: center; margin: 5px 0 0 3px; } .sheet-great-deeds-boons .sheet-boon .sheet-squarebox + span { margin-right: 5px; } .sheet-great-deeds-boons .sheet-divider { height: 2px; background: black; margin-top: 5px; } .sheet-virtues { border-left: 2px solid black; width: 140px; padding-left: 3px; } .sheet-virtues .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; } .sheet-virtues .sheet-virtue { background: #ddd; display: grid; grid-template: auto / 35px 1fr; margin-top: 5px; gap: 5px; padding: 3px; } .sheet-virtues input[type="number"].sheet-value { width: 100%; font-weight: bold; font-size: 13px; } .sheet-rolltemplate-agon-hero .sheet-holder, .sheet-rolltemplate-agon-strife .sheet-holder { color: white; position: relative; font-size: 14px; line-height: 1.2; display: grid; user-select: none; cursor: default; overflow: hidden; font-variant-numeric: lining-nums; margin: 0 -5px -4px -45px; width: 299px; font-family: "Times New Roman", serif; align-content: start; align-items: end; box-sizing: border-box; padding: 51px 20px 29px 33px; background-repeat: no-repeat; background-color: white; background-size: 299px auto; } .sheet-rolltemplate-agon-hero div, .sheet-rolltemplate-agon-strife div { box-sizing: border-box; } .withoutavatars .sheet-rolltemplate-agon-hero, .withoutavatars .sheet-rolltemplate-agon-strife { margin-left: -15px; } .sheet-rolltemplate-agon-hero .sheet-type, .sheet-rolltemplate-agon-strife .sheet-type { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/type_any.png"); width: 93px; height: 33px; background-size: 100% 100%; z-index: 1; } .sheet-rolltemplate-agon-hero .sheet-type.sheet-type-arts_oration, .sheet-rolltemplate-agon-strife .sheet-type.sheet-type-arts_oration { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/type_arts_oration.png"); } .sheet-rolltemplate-agon-hero .sheet-type.sheet-type-blood_valor, .sheet-rolltemplate-agon-strife .sheet-type.sheet-type-blood_valor { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/type_blood_valor.png"); } .sheet-rolltemplate-agon-hero .sheet-type.sheet-type-craft_reason, .sheet-rolltemplate-agon-strife .sheet-type.sheet-type-craft_reason { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/type_craft_reason.png"); } .sheet-rolltemplate-agon-hero .sheet-type.sheet-type-resolve_spirit, .sheet-rolltemplate-agon-strife .sheet-type.sheet-type-resolve_spirit { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/type_resolve_spirit.png"); } .sheet-rolltemplate-agon-hero .inlinerollresult, .sheet-rolltemplate-agon-strife .inlinerollresult { border: none !important; background-color: transparent; font-weight: bold; padding: 0 3px 0 0; font-size: 20px; } .sheet-rolltemplate-agon-hero .sheet-holder { padding: 51px 20px 29px 33px; } .sheet-rolltemplate-agon-hero .sheet-suffers ~ .sheet-holder { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/bg_suffers.png"); grid-template: 33px 42px 42px 69px/ 120px 1fr; height: 260px; } .sheet-rolltemplate-agon-hero .sheet-prevails ~ .sheet-holder { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/bg_prevails.png"); grid-template: 33px 42px 42px 200px/ 120px 1fr; height: 407px; } .sheet-rolltemplate-agon-hero .sheet-type { grid-column: span 2; } .sheet-rolltemplate-agon-hero .sheet-target, .sheet-rolltemplate-agon-hero .sheet-result, .sheet-rolltemplate-agon-hero .sheet-name, .sheet-rolltemplate-agon-hero .sheet-description { z-index: 1; } .sheet-rolltemplate-agon-hero .sheet-target { padding-left: 61px; } .sheet-rolltemplate-agon-hero .sheet-result { color: black; padding-left: 53px; } .sheet-rolltemplate-agon-hero .sheet-name { grid-column: span 2; text-transform: uppercase; line-height: 1.1; letter-spacing: 1px; padding-left: 4px; } .sheet-rolltemplate-agon-hero .sheet-description { grid-column: span 2; padding-right: 20px; } .sheet-rolltemplate-agon-strife .sheet-holder { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/rolltemplate/bg_strife.png"); padding: 84px 20px 29px 21px; grid-template: 39px 32px 47px / auto; height: 252px; } .sheet-rolltemplate-agon-strife .sheet-type { width: 124px; height: 44px; } .sheet-rolltemplate-agon-strife .sheet-roll { color: black; padding-left: 127px; } .sheet-rolltemplate-agon-strife .sheet-harm { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; } .sheet-type-strife { display: grid; grid-template: 483px auto / 550px 1fr; grid-gap: 5px; align-items: start; } .sheet-vault-of-heaven { border-left: 2px solid black; } .sheet-vault-of-heaven .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; } .sheet-vault-of-heaven > .sheet-title { padding-left: 3px; font-size: 14px; line-height: 1.6; } .sheet-vault-of-heaven .sheet-wrath { background-color: #8ab1b9; display: grid; padding: 0 0 10px; grid-gap: 5px; grid-template: auto/repeat(6, 1fr); } .sheet-vault-of-heaven .sheet-wrath .sheet-box .sheet-title { font-weight: bold; text-align: center; } .sheet-vault-of-heaven .sheet-wrath .sheet-box .sheet-checks { display: flex; align-items: center; justify-content: center; margin-top: 2px; } .sheet-vault-of-heaven .sheet-wrath .sheet-box .sheet-floatingbar { width: 8px; margin: 0 -2px; background-color: black; } .sheet-vault-stars { background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Agon%20Official/Assets/vault_of_heaven.png"); height: 382px; background-size: 100% auto; position: relative; } .sheet-vault-stars label { width: 12px; position: absolute; } .sheet-vault-stars label input[type="checkbox"] + span { border-width: 2px; } .sheet-vault-stars .sheet-favor-aphrodite-1, .sheet-vault-stars .sheet-favor-aphrodite-2, .sheet-vault-stars .sheet-favor-aphrodite-3 { left: 40px; } .sheet-vault-stars .sheet-favor-aphrodite-1 { top: 95px; } .sheet-vault-stars .sheet-favor-aphrodite-2 { top: 129px; } .sheet-vault-stars .sheet-favor-aphrodite-3 { top: 161px; } .sheet-vault-stars .sheet-favor-apollo-1, .sheet-vault-stars .sheet-favor-apollo-2, .sheet-vault-stars .sheet-favor-apollo-3 { top: 229px; } .sheet-vault-stars .sheet-favor-apollo-1 { left: 9px; } .sheet-vault-stars .sheet-favor-apollo-2 { left: 39px; } .sheet-vault-stars .sheet-favor-apollo-3 { left: 71px; } .sheet-vault-stars .sheet-favor-ares-1 { top: 82px; left: 109px; } .sheet-vault-stars .sheet-favor-ares-2 { top: 60px; left: 132px; } .sheet-vault-stars .sheet-favor-ares-3 { top: 38px; left: 155px; } .sheet-vault-stars .sheet-favor-artemis-1, .sheet-vault-stars .sheet-favor-artemis-2, .sheet-vault-stars .sheet-favor-artemis-3 { top: 183px; } .sheet-vault-stars .sheet-favor-artemis-1 { left: 102px; } .sheet-vault-stars .sheet-favor-artemis-2 { left: 131px; } .sheet-vault-stars .sheet-favor-artemis-3 { left: 158px; } .sheet-vault-stars .sheet-favor-athena-1, .sheet-vault-stars .sheet-favor-athena-2, .sheet-vault-stars .sheet-favor-athena-3 { top: 100px; } .sheet-vault-stars .sheet-favor-athena-1 { left: 185px; } .sheet-vault-stars .sheet-favor-athena-2 { left: 220px; } .sheet-vault-stars .sheet-favor-athena-3 { left: 256px; } .sheet-vault-stars .sheet-favor-demeter-1 { top: 193px; left: 204px; } .sheet-vault-stars .sheet-favor-demeter-2 { top: 254px; left: 238px; } .sheet-vault-stars .sheet-favor-demeter-3 { top: 270px; left: 254px; } .sheet-vault-stars .sheet-favor-hekate-1, .sheet-vault-stars .sheet-favor-hekate-2, .sheet-vault-stars .sheet-favor-hekate-3 { left: 313px; } .sheet-vault-stars .sheet-favor-hekate-1 { top: 13px; } .sheet-vault-stars .sheet-favor-hekate-2 { top: 57px; } .sheet-vault-stars .sheet-favor-hekate-3 { top: 95px; } .sheet-vault-stars .sheet-favor-hephaistos-1, .sheet-vault-stars .sheet-favor-hephaistos-2, .sheet-vault-stars .sheet-favor-hephaistos-3 { left: 312px; } .sheet-vault-stars .sheet-favor-hephaistos-1 { top: 153px; } .sheet-vault-stars .sheet-favor-hephaistos-2 { top: 181px; } .sheet-vault-stars .sheet-favor-hephaistos-3 { top: 220px; } .sheet-vault-stars .sheet-favor-hera-1 { top: 144px; left: 370px; } .sheet-vault-stars .sheet-favor-hera-2 { top: 120px; left: 394px; } .sheet-vault-stars .sheet-favor-hera-3 { top: 99px; left: 416px; } .sheet-vault-stars .sheet-favor-hermes-1 { top: 230px; left: 370px; } .sheet-vault-stars .sheet-favor-hermes-2 { top: 194px; left: 403px; } .sheet-vault-stars .sheet-favor-hermes-3 { top: 230px; left: 433px; } .sheet-vault-stars .sheet-favor-poseidon-1, .sheet-vault-stars .sheet-favor-poseidon-2, .sheet-vault-stars .sheet-favor-poseidon-3 { left: 480px; } .sheet-vault-stars .sheet-favor-poseidon-1 { top: 13px; } .sheet-vault-stars .sheet-favor-poseidon-2 { top: 66px; } .sheet-vault-stars .sheet-favor-poseidon-3 { top: 108px; } .sheet-vault-stars .sheet-favor-zeus-1, .sheet-vault-stars .sheet-favor-zeus-2, .sheet-vault-stars .sheet-favor-zeus-3 { top: 191px; } .sheet-vault-stars .sheet-favor-zeus-1 { left: 467px; } .sheet-vault-stars .sheet-favor-zeus-2 { left: 495px; } .sheet-vault-stars .sheet-favor-zeus-3 { left: 521px; } .sheet-vault-stars .sheet-godname { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; font-size: 10px; color: #666; text-align: center; position: absolute; width: 80px; } .sheet-vault-stars .sheet-name-aphrodite { left: 6px; top: 177px; } .sheet-vault-stars .sheet-name-ares { left: 100px; top: 104px; } .sheet-vault-stars .sheet-name-athena { left: 186px; top: 174px; } .sheet-vault-stars .sheet-name-hekate { left: 280px; top: 124px; } .sheet-vault-stars .sheet-name-hera { left: 363px; top: 162px; } .sheet-vault-stars .sheet-name-poseidon { left: 447px; top: 125px; } .sheet-vault-stars .sheet-name-apollo { left: 6px; top: 275px; } .sheet-vault-stars .sheet-name-artemis { left: 100px; top: 227px; } .sheet-vault-stars .sheet-name-demeter { left: 186px; top: 277px; } .sheet-vault-stars .sheet-name-hephaistos { left: 280px; top: 236px; } .sheet-vault-stars .sheet-name-hermes { left: 370px; top: 300px; } .sheet-vault-stars .sheet-name-zeus { left: 461px; top: 257px; } .sheet-destinies { grid-row: span 2; } .sheet-destinies .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; padding-left: 3px; font-size: 14px; line-height: 1.6; } .sheet-destinies .sheet-name { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; background: #cad8dc; padding: 2px 8px; width: 150px; margin-left: 10px; font-weight: bold; } .sheet-destinies .sheet-notes { border-top: 2px solid black; min-height: 53px; } .sheet-destinies .repitem { margin-top: 5px; } .sheet-type-island { margin-right: 25px; } .sheet-type-island .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; padding-left: 2px; margin-bottom: 5px; } .sheet-type-island .repcontainer .repitem { border: none !important; outline: none !important; } .sheet-type-island .repcontainer .repitem:not(:first-child) { margin-top: 40px; } .sheet-stats { display: grid; grid-template-columns: 1fr 0.5fr 0.5fr; grid-gap: 10px; margin-bottom: 20px; align-items: center; } .sheet-stats .sheet-island-name input { text-transform: uppercase; font-size: 20px; font-family: "Della Respira", serif; padding-left: 4px; font-weight: bold; } .sheet-stats .sheet-divine-wrath .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; background: #ddd; text-align: center; padding: 2px 4px; } .sheet-stats .sheet-divine-wrath input[type="checkbox"] + span { border-width: 16px 8px 0; } .sheet-stats .sheet-divine-wrath input[type="checkbox"]:not(:checked) + span { border-top-color: #999; } .sheet-stats .sheet-divine-wrath .sheet-checks { display: flex; align-items: center; justify-content: center; margin-top: 2px; font-size: 10px; font-weight: bold; } .sheet-stats .sheet-divine-wrath .sheet-checks label { display: block; margin-right: 5px; } .sheet-stats .sheet-strife-level .sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; background: #ddd; text-align: center; padding: 2px 4px; } .sheet-stats .sheet-strife-level .sheet-checks { display: grid; font-size: 16px; grid-template: auto/repeat(4, 1fr); line-height: 1.4; font-weight: bold; } .sheet-stats .sheet-strife-level .sheet-checks label { justify-content: center; } .sheet-stats .sheet-strife-level .sheet-checks input:checked + span { color: #669999; } .sheet-roller { display: grid; grid-gap: 5px; grid-template-columns: 1fr 100px; } .sheet-roller .sheet-harm { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 3px; } .sheet-roller .sheet-harmbox { display: flex; align-items: center; background: #ddd; padding: 2px; } .sheet-roller .sheet-harmbox input[type="text"].sheet-title { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; width: 68px; margin-right: auto; padding-left: 2px; } .sheet-roller button[type="roll"].sheet-strife-button { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; font-size: 16px; line-height: 1.2; white-space: normal; margin: 0; border: 2px solid; } .sheet-roller .sheet-dice select { width: 100%; border: 2px solid black; } .sheet-roller .sheet-dice input[type="text"] { text-transform: uppercase; font-size: 12px; font-family: "Della Respira", serif; padding-left: 4px; background: #ddd; } .sheet-roller .sheet-dice .sheet-enabled { display: flex; align-items: center; } .sheet-roller .sheet-dice .sheet-strifedie { display: grid; grid-template-columns: 15px 1fr 350px 50px; grid-gap: 5px; } .sheet-roller .sheet-dice .sheet-strifedie:not(:first-of-type) { margin-top: 10px; } .sheet-roller .sheet-dice .sheet-strifedie:not(.sheet-default) { display: none; } .sheet-roller .sheet-dice .sheet-strife-dice .sheet-strifedie-name[value]:not([value=""]) + .sheet-strifedie, .sheet-roller .sheet-dice .sheet-strife-dice .sheet-strifedie-name[value]:not([value=""]) + .sheet-strifedie + .sheet-strifedie-name + .sheet-strifedie { display: grid; opacity: 1; } .sheet-cnotes { margin-top: 10px; }