@import url("https://fonts.googleapis.com/css?family=Bebas+Neue|Lexend|Caesar+Dressing|Noto+Sans+TC&display=swap"); .charsheet * { font-family: "Bebas Neue", "Arial"; --godsend: #c87d00; --sheetwidth: 800px; } .charsheet input[value=hellas].gamesys ~ * { font-family: "Caesar Dressing", Arial; --godsend: #a83521; } .charsheet .version { color: black; font-weight: bold; float: right; margin: -31px 13px; } .charsheet label, .charsheet .label, .charsheet span { color: var(--godsend); } .charsheet h1, .charsheet h2, .charsheet h3 { text-align: center; } .charsheet h2 { background-color: var(--godsend); width: calc(100% - 40px); margin: 0.4em 0 0.4em 15px; } .charsheet h3 { background-color: var(--godsend); width: calc(100% - 40px); margin: 0.2em 0 0.2em 5px; } .charsheet .cap { text-transform: capitalize; } .charsheet span.bold { font-weight: 800; font-size: medium; } .charsheet div.border-label label { border-style: solid; max-width: 80%; border-radius: 13px; } .charsheet .small-font { font-size: xx-small; height: 18px; } .charsheet input[type=text], .charsheet input[type=number], .charsheet textarea, .charsheet select, .charsheet option { font-family: "Lexend", Arial; } .charsheet input[type=text], .charsheet input[type=number] { background-color: transparent; border-style: none none solid none; border-color: var(--godsend); border-radius: 0px; } .charsheet input[type=number] { border: 1px solid var(--godsend); text-align: center; } .charsheet input[type=number].bubble { border: 2px solid var(--godsend); border-radius: 13px; } .charsheet input[type=checkbox].checkbox { border: solid var(--godsend); border-radius: 0px; } .charsheet select { border-color: var(--godsend); padding-top: 1px; } .charsheet input[type=number].ref { border-style: none none solid none; border-color: black; border-radius: 0px; } .charsheet input[type=number].ref::-webkit-inner-spin-button, .charsheet input[type=number].ref::-webkit-outer-spin-button, .charsheet input[type=number].txtfield::-webkit-inner-spin-button, .charsheet input[type=number].txtfield::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } .charsheet input[type=number].ref, .charsheet input[type=number].txtfield { -moz-appearance: textfield; } .charsheet textarea { width: 90%; height: 85%; background-color: transparent; } .charsheet textarea:placeholder-shown, .charsheet input[type=text]:placeholder-shown, .charsheet input[type=number]:placeholder-shown { background-color: #EAC9D1; } .charsheet textarea:focus, .charsheet input[type=text]:focus, .charsheet input[type=number]:focus { background-color: #ccc; } .charsheet button[type=roll]::before { position: relative; top: 2px; } .charsheet button[type=roll].txt-btn:before, .charsheet button[type=roll].skills:before { content: " "; } .charsheet button[type=roll].d6-dice::before { font-family: "dicefontd6", arial; content: "F "; color: white; } .charsheet button[type=roll].sendtext::before { font-family: "Pictos"; content: "w "; color: black; } .charsheet button[type=roll].txt-btn { height: 22px; border: 2px solid black; background-color: transparent; margin-left: 5px; font-weight: bold; padding: 2px 5px 4px 5px; text-shadow: none; } .charsheet button[type=roll].txt-btn:hover { background-color: #d9d9d9; border-radius: 10px; text-shadow: none; } .charsheet button[type=roll].red { background-color: #a83521; background-position: 0 -30px; color: white; } .charsheet button[type=roll].red:hover { background-color: #a83521; background-position: 0 -30px; color: white; font-size: 1.7em; } .charsheet div.tab-buttons { display: flex; gap: 30px; border: 2px black; border-style: none none solid none; width: var(--sheetwidth); height: 99px; } .charsheet div.tab-buttons button { font-size: 1.5em; } .charsheet div.tab-buttons select { width: 90px; } .charsheet div.tab-buttons h1.godsend { background: no-repeat center/100% url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/GODSEND-Agenda/img/logo.jpg"); } .charsheet div.tab-buttons h1.atlantis { background: no-repeat center/61% url("https://raw.githubusercontent.com/Anduh/roll20-character-sheets/godsend-agenda-1-3/GODSEND-Agenda/img/logo-atlantis.png"); } .charsheet div.tab-buttons h1.hellas { background: no-repeat center/100% url("https://raw.githubusercontent.com/Anduh/roll20-character-sheets/godsend-agenda-1-3/GODSEND-Agenda/img/logo-hellas.png"); } .charsheet div.tab-buttons h1.talislanta { background: no-repeat center/51% url("https://raw.githubusercontent.com/Anduh/roll20-character-sheets/godsend-agenda-1-3/GODSEND-Agenda/img/logo-talislanta.png"); } .charsheet div.tab-buttons h1 { display: none; } .charsheet div.tab-buttons input[value=godsend] ~ h1.godsend, .charsheet div.tab-buttons input[value=talislanta] ~ h1.talislanta, .charsheet div.tab-buttons input[value=hellas] ~ h1.hellas, .charsheet div.tab-buttons input[value=atlantis] ~ h1.atlantis { display: flex; height: 99px; width: 612px; } .charsheet .border { border-style: solid; border-radius: 13px; } .charsheet :is(div.section section) hr { display: block; margin-top: 0.5em; margin-bottom: 0.5em; margin-left: auto; margin-right: auto; border-style: solid; border-width: 2px; border-color: black; } .charsheet .section, .charsheet section { display: flex; padding: 5px; border: none; background: white; opacity: 0.9; max-width: 750px; } .charsheet .gap { gap: 10px; } .charsheet .columnflex { display: flex; flex-direction: column; } .charsheet .rowflex { display: flex; flex-direction: row; } .charsheet .wrap { flex-wrap: wrap; } .charsheet .nowrap { flex-wrap: nowrap; } .charsheet .center { align-items: center; } .charsheet .middle { justify-content: center; } .charsheet .spaced { justify-content: space-evenly; } .charsheet label.title { text-transform: capitalize; max-width: 150px; text-align: center; font-size: 25px; } .charsheet main.character { display: grid; grid-gap: 4px; grid-template-columns: 5fr 4fr; grid-template-rows: 65px 40px 162px auto 100px; grid-template-areas: "common common" "points points" "attrs notes" "skills notes" "footer footer"; width: var(--sheetwidth); height: auto; position: relative; } .charsheet section.common { grid-area: common; } .charsheet section.common input[type=text] { width: 170px; text-align: center; } .charsheet section.common input[type=text].name { font-size: 1.4em; color: var(--godsend); } .charsheet section.common label { margin-bottom: 2px; text-align: center; } .charsheet section.points { grid-area: points; } .charsheet section.points span { padding: 0em 0.5em; font-size: 1em; display: flex; align-items: center; text-align: center; } .charsheet section.points input[type=number] { font-size: 1.4em; width: 40px; } .charsheet section.attrs { grid-area: attrs; row-gap: 3px; } .charsheet section.attrs button[type=roll] { font-size: 1.8em; width: 47px; } .charsheet section.attrs input[type=number] { font-size: 1.5em; width: 2em; } .charsheet section.skills { grid-area: skills; padding-top: 0px; margin-top: -28px; } .charsheet section.skills .desc-row { display: flex; justify-content: center; gap: 5px; } .charsheet section.skills .desc-row span { display: flex; align-items: center; width: 40px; } .charsheet section.skills .desc-row span.attr { width: 50px; } .charsheet section.skills .desc-row span.desc { width: 68px; justify-content: center; } .charsheet section.skills .desc-row span.powers { width: 81px; } .charsheet section.skills .desc-row span.weapons { width: 188px; justify-content: center; } .charsheet section.skills .desc-row span.armor { width: 164px; justify-content: center; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) { display: flex; flex-flow: nowrap column; row-gap: 3px; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) > .repitem { display: flex; justify-content: center; gap: 3px; height: 29px; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) > .repitem input[type=text] { width: 40px; font-size: 1.3em; border-style: solid solid solid solid; height: 28px; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) > .repitem input[type=text].name { width: 140px; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) > .repitem input[type=text].desc { width: auto; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) > .repitem input[type=number] { font-size: 1.5em; width: 40px; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) > .repitem select { width: 52px; font-size: 1.5em; margin-bottom: 0px; text-align: center; padding-top: 2px; font-family: "Bebas Neue", Arial; } .charsheet section.skills :is(.repcontainer[data-groupname=repeating_skills], .repcontainer[data-groupname=repeating_powers], .repcontainer[data-groupname=repeating_weapons], .repcontainer[data-groupname=repeating_armor]) > .repitem button { margin: 1px 3px; } .charsheet section.notes { grid-area: notes; } .charsheet section.notes input[type=text] { width: 110px; } .charsheet section.notes textarea { height: 90px; } .charsheet section.footer { grid-area: footer; background: no-repeat center/100% url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/GODSEND-Agenda/img/result-chart.jpg"); } .charsheet main.notes { display: grid; width: 750px; position: relative; grid-template-columns: 1fr 1fr; } .charsheet main.notes h2 { grid-column: span 2; } .charsheet main.notes textarea { height: 100px; } .charsheet main.notes section { height: auto; } .charsheet main.settings { display: grid; width: 750px; position: relative; grid-template-columns: 1fr 1fr; } .charsheet main.settings h2 { grid-column: span 2; } .charsheet main.settings select.short { width: 70px; } .charsheet main.settings span { color: black; margin-right: 5px; } .charsheet main.settings .section * { font-size: 1.3em; } .charsheet main.character, .charsheet main.notes, .charsheet main.settings { display: none; } .charsheet input.tabstoggle[value=character] ~ main.character, .charsheet input.tabstoggle[value=notes] ~ main.notes, .charsheet input.tabstoggle[value=settings] ~ main.settings { display: grid; } .withoutavatars .sheet-rolltemplate-rolls { margin-left: -7px; } .sheet-rolltemplate-rolls { margin-left: -37px; font-family: "Yanone Kaffeesatz"; } .sheet-rolltemplate-rolls .sheet-container { border: 3px solid black; border-radius: 3px; } .sheet-rolltemplate-rolls .sheet-header { background-color: var(--header-bg-color, #a83521); color: var(--header-text-color, #FFF); text-align: left; text-transform: capitalize; padding: 5px; border-bottom: 2px solid black; } .sheet-rolltemplate-rolls .sheet-title, .sheet-rolltemplate-rolls .sheet-name { font-size: 1.4em; font-weight: bold; } .sheet-rolltemplate-rolls .sheet-subtitle { font-size: 1em; } .sheet-rolltemplate-rolls .sheet-container { --header-bg-color: #c87d00; --header-text-color: #FFF; } .sheet-rolltemplate-rolls .sheet-container.sheet-color-green { --header-bg-color: #008000; } .sheet-rolltemplate-rolls .sheet-container.sheet-color-blue { --header-bg-color: #0000e0; } .sheet-rolltemplate-rolls .sheet-container.sheet-color-gold { --header-bg-color: #ffdd1f; --header-text-color: #000; } .sheet-rolltemplate-rolls .sheet-container.sheet-color-purple { --header-bg-color: #c200c2; } .sheet-rolltemplate-rolls .sheet-container.sheet-color-black { --header-bg-color: #000; } .sheet-rolltemplate-rolls .sheet-container.sheet-color-white { --header-bg-color: #FFF; --header-text-color: #000; } .sheet-rolltemplate-rolls .sheet-content { display: grid; background: #FFF; grid-template-columns: auto auto; line-height: 1.4em; } .sheet-rolltemplate-rolls .sheet-content > div { padding: 5px; } .sheet-rolltemplate-rolls .sheet-content .sheet-key { font-weight: bold; padding-right: 10px; text-align: right; } .sheet-rolltemplate-rolls .sheet-content :nth-child(4n+3), .sheet-rolltemplate-rolls .sheet-content :nth-child(4n) { background: #EEE; } .sheet-rolltemplate-rolls .sheet-desc, .sheet-rolltemplate-rolls .sheet-crit, .sheet-rolltemplate-rolls .sheet-fail { grid-column: span 2; padding: 5px; text-align: center; } .sheet-rolltemplate-rolls .sheet-crit, .sheet-rolltemplate-rolls .sheet-fail { font-weight: bold; font-size: 1.3em; } .sheet-rolltemplate-rolls .sheet-crit { color: green; } .sheet-rolltemplate-rolls .sheet-fail { color: red; }