/* COLORS Yellow: #fcd67b; Orange: #8c4110;; */ /* Text */ h1 { font-family: "Times New Roman", Times, serif; font-size: 1.25em; color: #FFF; letter-spacing: 0.0625em; z-index: 0; text-transform: uppercase; } hr { background-color: #2d241d; border : 0.2em solid #2d241d; margin : 0.1em; } textarea { border : 0.1em solid #302720; color : #000000; color : #302720; font-family : 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; height : 3em; line-height : 1em; margin : 0; min-height : 1em; overflow : hidden; overflow-wrap: break-word; padding : 1%; resize : vertical; white-space : pre-line; } .charsheet { margin-left: -2%; } div.sheet-injuries-grid hr, div.sheet-ark-development-grid hr, div.sheet-ark-other-grid hr { border: 1px solid; } .sheet-header-h1 { font-family : "Times New Roman", Times, serif; font-size : 1.25em; color : #000; letter-spacing: 0.0625em; z-index : 0; } .sheet-header > h1 { margin: -1em 0 0 0; text-shadow: 0.2em 0.2em 0.4em #000000; } hr.sheet-horizontal-rule, hr.sheet-horizontal-rule::before { background-color: transparent; border-color : #000; border-radius : 0.5em; height : 0.5em; } hr.sheet-horizontal-rule { border-style : solid; border-width : 1px 0 0 0; margin : 0.5em 0.5em 0em 0.5em; overflow : visible; width : 90%; } hr.sheet-horizontal-rule::before { /* Not really supposed to work, but does */ display : block; content : ""; margin-top : -0.6em; border-style : solid; border-width : 0 0 1px 0; } div.sheet-header { align-items : center; border-bottom : 0.1em solid #2e2217; color : #FFF; display : flex; font-weight : bold; height : 3em; justify-content: center; margin : 0px -0.4em 0 -0.4em; text-align : center; } div.sheet-header h2 { color : #fff; font-size : 0.9em; font-variant: small-caps; font-weight : normal; line-height : 1em; text-align : center; } div.sheet-column-header { color : #FFF; font-size : 0.9em; padding : 2em 0.1em 0px 0px; text-align: center; } .sheet-footer { font-size: 0.95em; display: block; text-align: right; margin: -15px 0 0 -10px; } .sheet-label { font-weight: bold; } .sheet-small-caps { font-variant-caps: small-caps; } .sheet-equal { margin : 4px 1px 0 1px; text-align: center; } .sheet-center, .sheet-grid-item.sheet-center { text-align: center; } /* TABNS */ div.sheet-grid-tabs { display : grid; grid-template-columns: 8em 8em 25em 8em 8em; grid-gap : 1%; } div.sheet-grid-tabs button { height: 2em; } div.sheet-grid-tabs button[title="Character"] { grid-column: 1; } div.sheet-grid-tabs button[title="Ark"] { grid-column: 2; } div.sheet-grid-tabs img[alt="Mutant Year Zero"] { grid-column: 3; } div.sheet-grid-tabs button[title="Log"] { grid-column: 4; } div.sheet-grid-tabs button[title="NPC"] { grid-column: 5; } /* Hide actual radio */ input.sheet-skull[type="radio"] { cursor : pointer; height : 2em; left : 6px; margin : 0em -0.89em; opacity : 0; position: relative; top : 1px; width : 1.25em; z-index : 1; } /* Fake radio using skull */ input.sheet-skull[type="radio"] + span::before { background-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/skullred.png); content : ""; display : inline-block; font-size : 24px; height : 16px; line-height : 14px; margin-right : 6px; text-align : center; vertical-align : middle; width : 16px; } /* Removes skull from all radios _after_ selected one */ input[type="radio"]:checked ~ input.sheet-skull[type="radio"] + span::before, input.sheet-skull[type="radio"]:checked ~ input.sheet-skull[type="radio"] + span::before { content: ""; background-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/skull.png); } /* Fake radio using xbox for Experience/Willpower */ input[type="radio"].sheet-xbox + span::before { margin-right: 0px; margin-left: -20px; line-height: 14px; text-align: center; display: inline-block; vertical-align: middle; content: url(http://imgsrv.roll20.net:5100/?src=i.imgur.com/f3cpSW5.png); width: 15px; height: 15px; font-size: 24px; } input.sheet-xbox { z-index: 1; margin-top: 3px; width: 16px; opacity: 0; } /* Removes xbox from all radios _after_ selected one */ input[type="radio"]:checked ~ input[type="radio"].sheet-xbox + span::before, input[type="radio"].sheet-xbox:checked ~ input[type="radio"].sheet-xbox + span::before { content: ""; } /* Fake radio using xbox for Conditions */ input[type="checkbox"].sheet-xbox + span::before { /* unchecked image */ background-image: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/dot.png); margin-right : 0px; line-height : 14px; text-align : center; display : inline-block; vertical-align : middle; /* Checked image */ content : url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/dotx.png); width : 15px; height : 15px; font-size : 24px; } .sheet-injuries-grid > div input.sheet-xbox { z-index: 1; width : 20px; height : 20px; opacity: 0; margin : 0; } /* Removes xbox from all radios _after_ selected one */ input[type="checkbox"].sheet-xbox:not(:checked) + span::before { content: ""; } /* repcontrol */ /* this sets the formatting for all repcontrol buttons */ .repcontrol { display: flex; justify-content: flex-end; } .repcontrol_add, .repcontrol_edit, .repcontrol_del { box-shadow: none; height : 1.2em; margin : 1px; padding : 0 1px 3px 1px; width : 3.25em; } .repcontrol_move { cursor: move; float: right; margin-right: 5px; } div.sheet-repeating-relationships .itemcontrol .repcontrol_del { margin-right: 6%; } /* Sheet Tabs */ div.sheet-tab-content { border-top: 1px solid #ffffff; display : none; margin-top: -8%; } input.sheet-tab[value="character"] ~ div.sheet-character, input.sheet-tab[value="ark"] ~ div.sheet-ark, input.sheet-tab[value="log"] ~ div.sheet-log { display: block; } button { background : buttonface; border : solid 1px #000; border-right : 3px solid #999; border-style : outset; box-shadow : 2px 2px 2px #000; margin : 1%; text-transform: capitalize; vertical-align: middle; } input.sheet-tab[value="character"] ~ button[name="act_tab_character"], input.sheet-tab[value="ark"] ~ button[name="act_tab_ark"], input.sheet-tab[value="log"] ~ button[name="act_tab_log"], input.sheet-tab[value="npc"] ~ button[name="act_tab_npc"], button:hover { color : #fcd67b; background-color: #8c4110; } /* Remove the Die Icon */ button::before { display: none; } div.sheet-wrapper { font-family : "Palatino Linotype", "Book Antiqua", Palatino, serif; overflow : hidden; padding-bottom: 3em; padding-top : 5.5em; width : 67em; } img[alt="Mutant Year Zero"] { height : 8em; padding: 1% 10%; margin-bottom: 1%; } input { color : #302720; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } .sheet-input, input[type="text"].sheet-input, input[type="number"].sheet-input { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; color: #302720; width: 100%; height: 2.25em; } input[type="text"], input[type="number"], select { border : 0.1em solid #302720; color : #302720; height : 2em; text-align: center; width : 100%; } select.sheet-input { width: 100%; color: #302720; padding: 0; margin: 0; } input[type="checkbox"].sheet-input { margin-top: 0.7em; height: 1.1em; } input[disabled].sheet-input-number, input[readonly].sheet-input, textarea[disabled].sheet-input, textarea[readonly].sheet-input, input[readonly].sheet-input-number { background-color: #eeeeee; border-color: #6e6e6e; color: #6e6e6e; cursor: not-allowed; font-style: italic; } button > input.sheet-input { max-height: 1.75em; } button[type="action"] { border-radius: 5px; } /* Align Inputs to left */ div.sheet-log-grid input[name="attr_terrain"], div.sheet-log-grid input[name="attr_threat_notes"], div.sheet-log-grid input[name="attr_comment"], div.sheet-ark-projects-repeating input[name="attr_name"], div.sheet-ark-info-grid input[name="attr_ark_name"], div.sheet-ark-bosses-grid input[name="attr_name"], div.sheet-relationships-grid input[type="text"] { text-align: left; } /* hide/show areas */ .sheet-expand { opacity: 0; position: absolute; top: -8px; left: -4px; width: 18px; height: 18px; z-index: 6; } button.sheet-toggles { background : none; border : none; color : #A0A0A0; content : "y"; cursor : pointer; font-family : pictos; font-size : 1.2em; font-weight : normal; height : 1.2em; opacity : 0; padding : 0px; text-transform: lowercase; width : 1.2em; z-index : 3; } button.sheet-toggles-repeating { left : -0.4em; margin-top: 0px; position : absolute; } .sheet-vehicle-grid input.sheet-expand + span::before { margin-top: 2.75em; } .repitem .sheet-talents-grid:hover input.sheet-expand + span::before, .repitem .sheet-talents-grid input.sheet-expand:checked + span::before, .repitem .sheet-gear-grid:hover input.sheet-expand + span::before, .repitem .sheet-gear-grid input.sheet-expand:checked + span::before, .sheet-vehicle-grid:hover input.sheet-expand + span::before, .sheet-vehicle-grid input.sheet-expand:checked + span::before, .repitem .sheet-vehicle_gear-grid:hover input.sheet-expand + span::before, .repitem .sheet-vehicle_gear-grid input.sheet-expand:checked + span::before, button.sheet-toggles:hover { opacity: 100; } /* character grid layout */ div.sheet-grid { display: grid; grid-column-gap: 0.2em; grid-row-gap: 0.2em; } div.sheet-character-grid { grid-template-columns: 1fr 1fr 1fr; } div.sheet-character-row { display: inline-block; width: 100%; margin-top: 0.2em; } div.sheet-character-row div.sheet-two-col-left, div.sheet-character-row div.sheet-one-col-right { display: inline-block; vertical-align: top; } div.sheet-character-row div.sheet-two-col-left { width: 67%; } div.sheet-character-row div.sheet-one-col-right { width: 32.5%; } div.sheet-two-col-left div.sheet-2grid { grid-template-columns: 1fr 1fr; } div.sheet-box { background-color: #ead3b8; border : 0.2em solid #2e2217; border-radius : 0.1em; padding : 0 0.4em; text-align : left; } div.sheet-character-attributes { background-color: #c77624; grid-column : 1; grid-row-start : 1; } div.sheet-character-details { grid-row-start: 1; grid-column: 1; padding: 5px; } div.sheet-character-appearance { grid-row-start: 1; grid-column: 2; } div.sheet-character-injuries { grid-row-start: 1; } div.sheet-character-weapons { grid-row-start: 3; grid-column: 1 / 3; } div.sheet-character-skills { grid-column-start: 1; grid-row-start : 2; } div.sheet-character-dice_pool { grid-row-start: 2; grid-column-start: 2; } div.sheet-character-talents { grid-row-start: 2; grid-column-start: 1; } div.sheet-rot-level { grid-column : 1 / 1; grid-row-start : 4; } div.sheet-character-armor { grid-row-start: 4; grid-column: 2 / 2; } div.sheet-character-gear { grid-row-start: 4; grid-column-start: 1; } div.sheet-character-experience { grid-row-start: 5; grid-column : 1 / 1; height : 2.8em; } div.sheet-experience-dots { border : 0.2em solid #2e2217; grid-column : 2; grid-row-start: 5; padding : 0.5em; width : 95.5%; } div.sheet-character-relationships { grid-row-start: 6; grid-column: 1 / 3; grid-row-end: span 2; } div.sheet-character-notes { grid-row: 8; grid-column: 1 / 3; } /* ---------------------------------- Attributes */ div.sheet-attributes-grid { grid-template-columns: 3fr 0.5fr 1.5fr 7fr; } div.sheet-attributes-grid h3, div.sheet-character-appearance h2 { font-size : 1.2em; text-shadow: 0px 1px 1em #fff; } div.sheet-wounds-grid h3 { font-style : italic; grid-column: 1; grid-row : 1; line-height: 1em; text-align : center; } div.sheet-attributes-grid hr { grid-column: 1 / 5; } div.sheet-attributes-grid.sheet-header h1 { grid-column: 1 / 6; grid-row : 1; text-align : center; } div.sheet-attributes-grid.sheet-header h2 { grid-row : 1; padding-top: 2em; text-align : center; } div.sheet-attributes-grid.sheet-header h2:nth-of-type(1), div.sheet-attributes-grid.sheet-header h2:nth-of-type(2) { margin-left: 42%; } div.sheet-attributes-grid h2[data-i18n="strength"], div.sheet-attributes-grid input[name="attr_strength_max"], div.sheet-attributes-grid input[name="attr_strength"] { grid-row: 1; } div.sheet-attributes-grid h2[data-i18n="agility"], div.sheet-attributes-grid input[name="attr_agility_max"], div.sheet-attributes-grid input[name="agility"] { grid-row: 2; } div.sheet-attributes-grid h2[data-i18n="wits"], div.sheet-attributes-grid input[name="attr_wits_max"], div.sheet-attributes-grid input[name="wits"] { grid-row: 3; } div.sheet-attributes-grid h2[data-i18n="empathy"], div.sheet-attributes-grid input[name="attr_empathy_max"], div.sheet-attributes-grid input[name="empathy"], div.sheet-attributes-grid input[name="attr_doubt"] { grid-row: 4; } div.sheet-attributes-grid h2[data-i18n="strength"], div.sheet-attributes-grid h2[data-i18n="agility"], div.sheet-attributes-grid h2[data-i18n="wits"], div.sheet-attributes-grid h2[data-i18n="empathy"] { grid-column: 1; } div.sheet-attributes-grid.sheet-header h2:nth-of-type(1), div.sheet-attributes-grid input[name="attr_strength_max"], div.sheet-attributes-grid input[name="attr_agility_max"], div.sheet-attributes-grid input[name="attr_wits_max"], div.sheet-attributes-grid input[name="attr_empathy_max"] { grid-column: 2; } div.sheet-attributes-grid.sheet-header h2:nth-of-type(2), div.sheet-attributes-grid input[name="attr_strength"], div.sheet-attributes-grid input[name="attr_agility"], div.sheet-attributes-grid input[name="attr_wits"], div.sheet-attributes-grid input[name="attr_empathy"] { grid-column: 3; } div.sheet-attributes-grid.sheet-header h2:nth-of-type(3) { grid-column: 4; } div.sheet-attributes-grid input[type="number"], div.sheet-attributes-grid input[type="text"] { margin-top: 0.5em; } div.sheet-wounds-grid { display: grid; grid-template-columns: 1fr; } div.sheet-wounds-grid input[title="No Damage"] { margin: 0.1em 0.5em 0em 0em; } /* ---------------------------------- Details */ div.sheet-details-grid { grid-template-columns: 1fr 4fr 1fr 4fr; padding : 0.3em; } div.sheet-details-grid span[data-i18n="name"], div.sheet-details-grid span[data-i18n="role"] { grid-row-start : 1; text-align: center; padding: 5%; } div.sheet-details-grid input[name="attr_character_name"], div.sheet-details-grid input[name="attr_role"] { grid-row-start : 1; } div.sheet-details-grid span[data-i18n="name"] { grid-column-start: 1; } div.sheet-details-grid input[name="attr_role"] { grid-column-start: 2; } div.sheet-details-grid span[data-i18n="role"] { grid-column-start: 3; } div.sheet-details-grid input[name="attr_role"] { grid-column-start: 4; } /* ---------------------------------- Appearance */ div.sheet-appearance-grid { grid-template-columns: 1fr 4fr; } div.sheet-appearance-header { grid-row-start: 1; grid-column : 1 / 3; } div.sheet-appearance-header h1 { grid-column : 1 / 3; height : 100%; margin-bottom: -0.2em; margin-top : -0.2em; } div.sheet-appearance-grid button[name="act_settings_face"], div.sheet-appearance-grid button[name="act_settings_face"] + h2, div.sheet-appearance-grid button[name="act_settings_body"], div.sheet-appearance-grid button[name="act_settings_body"] + h2, div.sheet-appearance-grid button[name="act_settings_clothing"], div.sheet-appearance-grid button[name="act_settings_clothing"] + h2 { grid-column-start: 1; } div.sheet-appearance-grid span, div.sheet-appearance-grid textarea { grid-column-start: 2; margin : 4% 2%; width : 95%; } div.sheet-appearance-grid button[name="act_settings_face"], div.sheet-appearance-grid button[name="act_settings_face"] + h2 { grid-row-start: 1; } div.sheet-appearance-grid button[name="act_settings_body"], div.sheet-appearance-grid button[name="act_settings_body"] + h2 { grid-row-start: 2; } div.sheet-appearance-grid button[name="act_settings_clothing"], div.sheet-appearance-grid button[name="act_settings_clothing"] + h2 { grid-row-start: 3; } /* ---------------------------------- Critical Injuries */ div.sheet-box.sheet-character-injuries { min-height: 16.3em; } div.sheet-injuries-grid { grid-template-columns: 1fr 6fr 5fr 1fr 6fr 5fr; } div.sheet-injuries-grid hr { grid-column: 1 / 7; } div.sheet-injuries-grid span[data-i18n="starving"], div.sheet-injuries-grid span[data-i18n="dehydrated"], div.sheet-injuries-grid span[data-i18n="sleepless"], div.sheet-injuries-grid span[data-i18n="hypothermic"] { text-align: center; } div.sheet-injuries-grid input[name="attr_hungry"], div.sheet-injuries-grid input[name="attr_hungry"] + span, div.sheet-injuries-grid span[data-i18n="starving"], div.sheet-injuries-grid input[name="attr_thirsty"], div.sheet-injuries-grid input[name="attr_thirsty"] + span, div.sheet-injuries-grid span[data-i18n="dehydrated"] { grid-row: 2; } div.sheet-injuries-grid hr:nth-of-type(1) { grid-row: 3; } div.sheet-injuries-grid input[name="attr_sleepy"], div.sheet-injuries-grid input[name="attr_sleepy"] + span, div.sheet-injuries-grid span[data-i18n="sleepless"], div.sheet-injuries-grid input[name="attr_cold"], div.sheet-injuries-grid input[name="attr_cold"] + span, div.sheet-injuries-grid span[data-i18n="hypothermic"] { grid-row: 5; } div.sheet-injuries-grid hr:nth-of-type(2) { grid-row: 6; } div.sheet-injuries-grid input[name="attr_hungry"], div.sheet-injuries-grid input[name="attr_hungry"] + span, div.sheet-injuries-grid input[name="attr_sleepy"], div.sheet-injuries-grid input[name="attr_sleepy"] + span { grid-column: 1; } div.sheet-injuries-grid span[data-i18n="starving"], div.sheet-injuries-grid span[data-i18n="sleepless"] { grid-column: 2 / 4; } div.sheet-injuries-grid input[name="attr_thirsty"], div.sheet-injuries-grid input[name="attr_thirsty"] + span, div.sheet-injuries-grid input[name="attr_cold"], div.sheet-injuries-grid input[name="attr_cold"] + span { grid-column: 4; } div.sheet-injuries-grid span[data-i18n="dehydrated"], div.sheet-injuries-grid span[data-i18n="hypothermic"] { grid-column: 5 / 7; } input[name="attr_hungry"]:checked ~ span[data-i18n="starving"], input[name="attr_sleepy"]:checked ~ span[data-i18n="sleepless"], input[name="attr_thirsty"]:checked ~ span[data-i18n="dehydrated"], input[name="attr_cold"]:checked ~ span[data-i18n="hypothermic"] { color : #800000; font-weight: bold; } .sheet-injuries-grid label { font-size: 1em; } div.sheet-injuries-header { grid-row-start: 1; } div.sheet-injuries-header h1 { grid-row-start: 1; grid-column : 1 / 7; } div.sheet-injuries-box { grid-row-start: 7; grid-column : 1 / 7; } div.sheet-injuries-grid label[data-i18n="injury"], div.sheet-injuries-grid input[name="attr_injury_name"] { grid-row-start: 1; } div.sheet-injuries-grid label[data-i18n="lethal"], div.sheet-injuries-grid select[name="attr_injury_lethal"] { grid-row-start: 2; } div.sheet-injuries-grid label[data-i18n="time-limit"], div.sheet-injuries-grid input[name="attr_injury_time_limit"] { grid-row-start: 3; } div.sheet-injuries-grid label[data-i18n="effects"], div.sheet-injuries-grid input[name="attr_injury_effects"] { grid-row-start: 4; } div.sheet-injuries-grid label[data-i18n="healing-time"], div.sheet-injuries-grid input[name="attr_injury_heal_time"] { grid-row-start: 5; } div.sheet-injuries-grid label[data-i18n="injury"], div.sheet-injuries-grid label[data-i18n="lethal"], div.sheet-injuries-grid label[data-i18n="time-limit"], div.sheet-injuries-grid label[data-i18n="effects"], div.sheet-injuries-grid label[data-i18n="healing-time"] { grid-column: 1 / 3; } div.sheet-injuries-grid input[name="attr_injury_name"], div.sheet-injuries-grid select[name="attr_injury_lethal"], div.sheet-injuries-grid input[name="attr_injury_time_limit"], div.sheet-injuries-grid input[name="attr_injury_effects"], div.sheet-injuries-grid input[name="attr_injury_heal_time"] { grid-column: 3 / 7; } /* ---------------------------------- Weapons */ div.sheet-character-weapons div.sheet-header, div.sheet-weapons-box { grid-column: 1 / 8; } div.sheet-weapons-grid { grid-template-columns: 1.5fr 6fr 2fr 2fr 2fr 2fr 9fr; padding: 0 0 2px 0; } div.sheet-character-weapons div.sheet-header { grid-row : 1; text-align : center; } div.sheet-repeating-weapons-grid { grid-template-columns: 1fr 7fr 2fr 2fr 2fr 2fr 10fr; margin-bottom : 1%; } div.sheet-weapons-grid h2[data-i18n="name"], div.sheet-weapons-grid input[name="attr_weapon_name"], div.sheet-weapons-grid select[name="attr_weapon_skill"], div.sheet-weapons-grid select[name="attr_weapon_bonus"], div.sheet-weapons-grid input[name="attr_weapon_damage"], div.sheet-weapons-grid input[name="attr_weapon_features"], div.sheet-weapons-grid button.sheet-dicefontd6 { grid-row: 1; } div.sheet-weapons-grid button.sheet-dicefontd6 { grid-column: 1; } div.sheet-character-weapons div.sheet-header h1 { grid-column: 1 / 8; grid-row : 1; } div.sheet-character-weapons div.sheet-header h2 { grid-row : 1; margin-top: 2em; } div.sheet-character-weapons div.sheet-header h2:nth-of-type(1), div.sheet-weapons-grid input[name="attr_weapon_name"] { grid-column: 2; } div.sheet-character-weapons div.sheet-header h2:nth-of-type(2), div.sheet-weapons-grid select[name="attr_weapon_skill"] { grid-column: 3; } div.sheet-character-weapons div.sheet-header h2:nth-of-type(3), div.sheet-weapons-grid select[name="attr_weapon_bonus"] { grid-column: 4; } div.sheet-character-weapons div.sheet-header h2:nth-of-type(4), div.sheet-weapons-grid input[name="attr_weapon_damage"] { grid-column: 5; } div.sheet-character-weapons div.sheet-header h2:nth-of-type(5), div.sheet-weapons-grid select[name="attr_weapon_range"] { grid-column: 6; } div.sheet-character-weapons div.sheet-header h2:nth-of-type(6), div.sheet-weapons-grid input[name="attr_weapon_features"] { grid-column: 7; } /* ---------------------------------- Dice Pool */ div.sheet-dice_pool-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: auto; grid-column-gap: 2px; grid-row-gap: 2px; padding-bottom: 5px; } .sheet-dice_pool-box1 { grid-row-start: 1; grid-column: 1/4; } div.sheet-dice_pool-box1 h1[data-i18n="dice-pool"] { text-transform: uppercase; } /* ---------------------------------- Talents */ div.sheet-box.sheet-character-talents { min-height: 37em; } div.sheet-talents-grid { grid-template-columns: auto 4em 3em; } div.sheet-talents-grid span { text-align: center; } .sheet-talents-box, .sheet-mutant-box { grid-row-start: 1; grid-column: 1 / 4; } .sheet-talents-box1 { grid-row-start: 1; grid-column-start: 1; } .sheet-talents-box2 { grid-row-start: 1; grid-column-start: 2; } .sheet-talents-box3 { grid-row-start: 1; grid-column-start: 3; } .sheet-talents-box4 { grid-row-start: 2; grid-column: 1 / 4; } /* ------------------------------- Mutantions */ div.sheet-mutantions-grid { display: grid; grid-template-columns: 1fr; } div.sheet-mutants-grid div.sheet-dots { border-bottom : 0.2em solid #2e2217; margin-bottom : 2%; padding : 0.4em; } /* ---------------------------------- Skills */ div.sheet-skills-grid { grid-template-columns: 5fr 1.5fr 1.5fr 0.5fr 1fr; padding : 1px 0; } div.sheet-skill-orange { background-color: #c77624; border-bottom : 0.1em solid #2d241d; margin : 0em -0.4em 0.5em -0.4em; padding : 0.5em 0.3em; } div.sheet-skill-orange span.sheet-equal { color: #fff; } div.sheet-skills-grid h1 { grid-column: 1 / 6; grid-row : 1; text-align : center; } div.sheet-skills-grid h2 { grid-row : 1; padding-top: 2em; text-align : center; } div.sheet-skills-grid hr { grid-column: 1 / 6; } div.sheet-skills-grid h2:nth-of-type(1) { grid-column: 2; } div.sheet-skills-grid h2:nth-of-type(2) { grid-column: 3; } div.sheet-skills-grid h2:nth-of-type(3) { grid-column: 5; } div.sheet-skills-grid button { grid-column: 1; height: 1.5em; } div.sheet-skills-grid input[type="number"] { grid-column: 2; } div.sheet-skills-grid input[type="text"] { grid-column: 3; } div.sheet-skills-grid span[class="equal"] { grid-column: 4; } div.sheet-skills-grid input[type="text"][name*="total"] { grid-column: 5; } div.sheet-repeating-skill-grid { grid-column: 1 / 6; background-color: #ead3b8; } div.sheet-repeating-skill-grid select { width: 100%; } div.sheet-repeating-skill-grid span { text-align: center; } /* ---------------------------------- Armor/Helmet */ .sheet-armor-container { display: grid; grid-template-columns: 1.5fr; grid-column-gap: 10px; padding-bottom: 2px; } .sheet-armor-grid { display: grid; grid-template-columns: auto 1.75em 3em 3em 3em; grid-row-gap: 2px; grid-column-gap: 2px; } .sheet-armor-subgrid { display: grid; grid-template-columns: 9em 1.75em 3em 3em 3em; grid-column-gap: 4px; justify-content: end; } .sheet-armor-subgrid > span, .sheet-armor-subgrid > input { display: flex; justify-content: space-around; align-items: center; } .sheet-armor-box { grid-row-start: 1; grid-column: 1/6; } .sheet-armor-box1 { grid-row-start: 1; grid-column-start: 1; } .sheet-armor-box2 { grid-row-start: 1; grid-column-start: 2; } .sheet-armor-box3 { grid-row-start: 1; grid-column-start: 3; } .sheet-armor-box4 { grid-row-start: 1; grid-column-start: 4; color: #fff; } .sheet-armor-box5 { grid-row-start: 1; grid-column-start: 5; } .sheet-armor-box6 { grid-row-start: 2; grid-column: 1/6; } .sheet-armor-box7 { grid-row-start: 3; grid-column: 1/6; } .sheet-armor-box8 { grid-row-start: 4; grid-column: 1/6; } /* ---------------------------------- NECESSITIES */ div.sheet-character-necessities { } .sheet-nec-grid div.sheet-header { grid-column: 1 / 4; } .sheet-nec-grid { display : grid; grid-column-gap : 1%; grid-row-gap : 0.1em; grid-template-columns: 1fr 1fr 1fr; grid-template-rows : auto; } .sheet-nec-grid img { filter: invert(80%); width: 35%; } /* ---------------------------------- Gear */ div.sheet-box.sheet-character-gear { min-height: 28.5em; } .sheet-gear-grid { display : grid; grid-column-gap : 1%; grid-row-gap : 0.1em; grid-template-columns: auto 3em 2em 3em; grid-template-rows : auto; } div.sheet-gear-grid span, div.sheet-vehicle_gear-grid { text-align: center; } div.sheet-gear-grid input[name="attr_gear_name"], div.sheet-vehicle_gear-grid input[name="attr_vehicle_gear_name"] { grid-column: 1 / 2; } .sheet-gear-subgrid { display: grid; grid-template-columns: 4em 3em 9em 3em; grid-column-gap: 2px; } .sheet-gear-subgrid > div { display: flex; justify-content: space-around; align-items: center; } .sheet-gear-box1 { grid-row-start: 1; grid-column: 1/5; } .sheet-gear-box2 { grid-row-start: 1; grid-column-start: 2; } .sheet-gear-box3 { grid-row-start: 1; grid-column-start: 3; } .sheet-gear-box4 { grid-row-start: 1; grid-column-start: 4; } .sheet-gear-box5 { grid-row-start: 2; grid-column: 1/5; } .sheet-gear-coin { grid-row-start: 3; grid-column: 1/5; } .sheet-gear-box6 { grid-row-start: 4; grid-column: 1/5; } .sheet-gear-box7 { grid-row-start: 1; grid-column: 1/2; } .sheet-gear-box8 { grid-row-start: 1; grid-column-start: 2; } .sheet-gear-box9 { grid-row-start: 1; grid-column-start: 3; } .sheet-gear-box10 { grid-row-start: 1; grid-column-start: 4; } /* ---------------------------------- vehicle */ .sheet-vehicle-grid { display: grid; grid-template-columns: auto repeat(4, 2.5em); grid-template-rows: auto; grid-row-gap: 2px; position: relative; } .sheet-vehicle-grid > div { display: flex; justify-content: space-around; align-items: center; } .sheet-vehicle-box1 { grid-row-start: 1; grid-column: 1/6; } .sheet-vehicle-box2 { grid-row-start: 2; grid-column-start: 1; } .sheet-vehicle-box3 { grid-row-start: 2; grid-column-start: 2; } .sheet-vehicle-box4 { grid-row-start: 2; grid-column-start: 3; } .sheet-vehicle-box5 { grid-row-start: 2; grid-column-start: 4; } .sheet-vehicle-box6 { grid-row-start: 2; grid-column-start: 5; } .sheet-vehicle-box7 { grid-row-start: 3; grid-column: 1/6; } /* ---------------------------------- vehicle_gear */ .sheet-vehicle_gear-grid { display: grid; grid-template-columns: auto 3em 2em 3em; grid-template-rows: auto; grid-row-gap: 2px; } .sheet-vehicle_gear-subgrid { display: grid; grid-template-columns: 4em 3em 9em 3em; grid-row-gap: 2px; grid-column-gap: 2px; } .sheet-vehicle_gear-subgrid > div { display: flex; justify-content: space-around; align-items: center; } .sheet-vehicle_gear-box1 { grid-row-start: 1; grid-column: 1/5; } .sheet-vehicle_gear-box2 { grid-row-start: 1; grid-column-start: 2; } .sheet-vehicle_gear-box3 { grid-row-start: 1; grid-column-start: 3; } .sheet-vehicle_gear-box4 { grid-row-start: 1; grid-column-start: 4; } .sheet-vehicle_gear-box5 { grid-row-start: 2; grid-column: 1/5; } .sheet-vehicle_gear-coin { grid-row-start: 3; grid-column: 1/5; } .sheet-vehicle_gear-box6 { grid-row-start: 4; grid-column: 1/5; } .sheet-vehicle_gear-box7 { grid-row-start: 1; grid-column: 1/2; } .sheet-vehicle_gear-box8 { grid-row-start: 1; grid-column-start: 2; } .sheet-vehicle_gear-box9 { grid-row-start: 1; grid-column-start: 3; } .sheet-vehicle_gear-box10 { grid-row-start: 1; grid-column-start: 4; } /* ---------------------------------- Experience/Willpower */ .sheet-experience-grid { display: grid; grid-template-columns: 4.25fr 2.2em 1fr; margin-right: -1px; } div.sheet-experience-box { grid-row-start: 1; grid-column-start: 1; } div.sheet-experience-box div.sheet-dots { grid-row-start: 1; grid-column-start: 2; } div.sheet-experience-grid .sheet-header { border-bottom: none; } div.sheet-experience-grid .sheet-header > h1 { margin: 0; } /* ---------------------------------- Relationships/Notes */ div.sheet-relationships-grid, div.sheet-notes-grid { display : grid; grid-template-columns: 5fr 14fr 1fr; grid-column-gap : 2px; grid-row-gap : 1px; } div.sheet-relationships-header { grid-row-start: 1; grid-column: 1 / 4; } div.sheet-relationships-header h1 { grid-row : 1; grid-column: 1 / 4; } div.sheet-relationships-header h2 { grid-row : 1; grid-column: 3; margin-top : 2em; } div.sheet-repeating-relationships { grid-row-start: 3; grid-column: 1 / 4; } div.sheet-relationships-grid hr, div.sheet-notes-grid hr { grid-column : 1/4; } div.sheet-relationships-grid input.sheet-input-number { height: 2.3em; font-weight: bold; } div.sheet-relationships-grid label + input { grid-column: 2 / 4; width: 100%; } div.sheet-relationships-grid label[data-i18n="i-hate"], div.sheet-relationships-grid input[name="attr_hate"] { grid-row: 4; } div.sheet-relationships-grid label[data-i18n="i-protect"], div.sheet-relationships-grid input[name="attr_protect"] { grid-row: 5; } div.sheet-relationships-grid label[data-i18n="i-dream"], div.sheet-relationships-grid input[name="attr_dream"] { grid-row: 6; } div.sheet-relationships-grid input[type="checkbox"], div.sheet-relationships-grid input[type="checkbox"] + span { grid-column: 3; grid-row : 1; } div.sheet-relationships-grid textarea { grid-column: 2 / 4; } div.sheet-relationships-grid span[name*="pc_name"], div.sheet-notes-grid span[name="attr_note_name"] { font-weight: bold; } /* Styled Check boxes */ div.sheet-relationships-grid input[type="checkbox"], div.sheet-ark-projects-grid input[type="checkbox"], div.sheet-log-grid input[type="checkbox"] { height : 2em; opacity : 0; position : relative; width : 2em; z-index : 3; } /* This is the box that the check will live in */ div.sheet-relationships-grid input[type="checkbox"] + span, div.sheet-ark-projects-grid input[type="checkbox"] + span, div.sheet-log-grid input[type="checkbox"] + span { background : #fff; border : 0.2em solid #000; border-radius: 1em; box-shadow : inset 0px 0px 3px 1px #7c7c7c; display : inline-block; height : 1em; margin : 0.5em; width : 1em; } /* This is for the checkmark */ div.sheet-relationships-grid input[type="checkbox"]:checked + span::before, div.sheet-ark-projects-grid input[type="checkbox"]:checked + span::before, div.sheet-log-grid input[type="checkbox"]:checked + span::before { color : #c77624; content : "3"; display : inline-block; font-family: pictos; font-size : 2em; left : -0.1em; position : relative; text-align : center; top : -0.5em; width : 1em; } /* Notes */ div.sheet-notes-grid { grid-template-columns: 1fr 3fr; } div.sheet-notes-box-header, div.sheet-notes-box-repeating { grid-column: 1 / 3; } div.sheet-notes-box-repeating textarea { height : 2.5em; min-height: 2.5em; } .sheet-notes-grid > input.sheet-input-number, .sheet-notes-grid > textarea { display : flex; justify-content: space-around; align-items : center; box-sizing : border-box; } /* ark grid layout */ div.sheet-ark div.sheet-box { padding: 0px; } div.sheet-ark-details-grid, div.sheet-ark-boss-row { grid-template-columns: 2fr 1fr; } /* ---------------------------------- ark Details */ div.sheet-ark-info-grid { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr; } div.sheet-ark h1 { padding : 0.5% 2%; text-align : left; text-transform: uppercase; } div.sheet-ark-info-grid h1 { margin-bottom : 1%; grid-column : 1 / 8; grid-row : 1; } div.sheet-ark-info-grid span.sheet-label, div.sheet-ark-development-grid span.sheet-label { padding: 3%; } div.sheet-ark-info-grid span[data-i18n="type"] { grid-column: 1; } div.sheet-ark-info-grid hr { grid-column: 1 / 7; } div.sheet-ark-info-grid input[name="attr_ark_name"] { grid-column: 2 / 4; } div.sheet-ark-info-grid span[data-i18n="coordinates"], div.sheet-ark-info-grid span[data-i18n="battle-level"] { grid-column: 4; } div.sheet-ark-info-grid input[name="attr_ark_coordinates"] { grid-column: 5 / 7; } div.sheet-ark-info-grid span[data-i18n="type"], div.sheet-ark-info-grid input[name="attr_ark_name"], div.sheet-ark-info-grid span[data-i18n="coordinates"], div.sheet-ark-info-grid input[name="attr_ark_coordinates"] { grid-row: 2; } div.sheet-ark-info-grid hr { grid-row: 3; } div.sheet-ark-info-grid span[data-i18n="battle-level"] { grid-row: 4; } div.sheet-ark-info-grid span[name="attr_ark_battle_level"] { background-color: #eeeeee; border : 0.1em solid #2e2217; border-color : #6e6e6e; color : #6e6e6e; cursor : not-allowed; font-style : italic; grid-column : 5; grid-row : 4; text-align : center; width : 3em; } div.sheet-ark-info-grid button.sheet-dicefontd6 { grid-column: 6; grid-row: 4; height: 1em; width: 1em; } div.sheet-ark-info-grid span[data-i18n="description"] { grid-column: 1; grid-row: 4; } div.sheet-ark-info-grid textarea { grid-column: 1 / 7; grid-row : 5; margin : 0.5% 1%; width : 96%; } /* ----------------------------- development levels */ div.sheet-ark-development-grid { background-color : #d48f43; display : grid; grid-column : 2; grid-template-columns: 3fr 1fr; } div.sheet-ark-development-grid h1 { grid-column: 1 / 3; grid-row : 1; } div.sheet-ark-development-grid hr { grid-column: 1 / 3; } div.sheet-ark-development-grid input[type="number"] { margin-left: 25%; width : 3.5em; } div.sheet-ark-development-grid input[name="attr_ark_food_supply"] { margin-top: 4%; } div.sheet-ark-development-grid input[name="attr_ark_warfare"], div.sheet-ark-other-grid input[name="attr_ark_season"] { margin-bottom: 0.2em; } /* ----------------------------- ark projects */ div.sheet-ark-projects { margin-bottom: 1%; margin-top : 1%; } div.sheet-ark-projects-grid { grid-template-columns: 5fr 6fr 5fr 1fr 1fr 1fr; padding : 0.2em; } div.sheet-ark-projects-header { grid-column: 1 / 7; grid-row : 1; } div.sheet-ark-projects-header h2, div.sheet-ark-bosses-header h2, div.sheet-log-grid h2 { color : #fff; font-size : 0.9em; text-align: center; width : 100%; } div.sheet-ark-projects-header h2[data-i18n="comment"], div.sheet-ark-projects-header h2[data-i18n="skills"], div.sheet-ark-projects-header h2[data-i18n="workpoints"], div.sheet-ark-projects-header h2[data-i18n="complete"] { grid-row: 1; } div.sheet-ark-projects-header h2[data-i18n="comment"], div.sheet-ark-projects-header input[name="attr_comment"] { grid-column: 2; } div.sheet-ark-projects-header h2[data-i18n="skills"], div.sheet-ark-projects-header input[name="attr_skills"] { grid-column: 3; } div.sheet-ark-projects-header h2[data-i18n="workpoints"] { grid-column: 4 / 6; } div.sheet-ark-projects-header input[name="attr_work_points"] { grid-column: 4; } div.sheet-ark-projects-header input[name="attr_work_points_max"] { grid-column: 5; } div.sheet-ark-projects-header h2[data-i18n="complete"], div.sheet-ark-projects-grid input[type="checkbox"], div.sheet-ark-projects-grid input[type="checkbox"] + span { grid-column: 6; grid-row : 1; } div.sheet-ark-projects-grid input[type="checkbox"], div.sheet-ark-projects-grid input[type="checkbox"] + span { margin-left: 40%; } div.sheet-ark-projects-header input[name="attr_skills"], div.sheet-ark-projects-header input[name="attr_work_points"] { text-align: center; } div.sheet-ark-projects-repeating { grid-column: 1 / 7; } /* ---------------------------------- ark Bosse */ div.sheet-ark-bosses-grid { grid-template-columns: 2fr 1fr; } div.sheet-ark-bosses-repeating { grid-column: 1 / 2; } div.sheet-ark-bosses-header { grid-row: 1; } div.sheet-ark-bosses-header h1, div.sheet-ark-bosses-grid input[name="attr_name"] { grid-column: 1; } div.sheet-ark-bosses-header h2, div.sheet-ark-bosses-grid input[name="attr_type"] { grid-column: 2; } /* ---------------------------------- ark Other Information */ div.sheet-ark-boss-row { margin-bottom: 1%; } div.sheet-ark-other-grid { background-color: #d48f43; grid-template-columns: 7em 1fr 1fr 1fr; } div.sheet-ark-other-grid h1, div.sheet-ark-other-grid hr { grid-column: 1 / 5; } div.sheet-ark-other-grid span { padding: 0.3em; } div.sheet-ark-other-grid span[data-i18n="population"], div.sheet-ark-other-grid input[name="attr_ark_population"] { grid-row: 2; } div.sheet-ark-other-grid hr:nth-of-type(1) { grid-row: 3; } div.sheet-ark-other-grid span[data-i18n="water-source"], div.sheet-ark-other-grid input[name="attr_ark_water_source"] { grid-row: 4; } div.sheet-ark-other-grid hr:nth-of-type(2) { grid-row: 5; } div.sheet-ark-other-grid span[data-i18n="season"], div.sheet-ark-other-grid input[name="attr_ark_season"] { grid-row: 6; } div.sheet-ark-other-grid input[name="attr_ark_population"] { grid-column: 3 / 5; width: 100%; } div.sheet-ark-other-grid input[name="attr_ark_water_source"], div.sheet-ark-other-grid input[name="attr_ark_season"] { grid-column: 2 / 5; } /* ---------------------------------- ark Notes */ div.sheet-ark-notes-grid { grid-template-columns: 1fr; grid-template-rows: auto; } div.sheet-ark-notes h1 { grid-row-start: 1; grid-column: 1 / 6; } div.sheet-ark-notes-repeating { grid-row-start: 2; grid-column: 1 / 6 } div.sheet-ark-notes textarea { box-sizing : border-box; grid-column : 1 / 6; grid-row-start: 2; margin : 0.5em 1%; min-height : 5em; width : 98%; } /* ---------------------------------- log */ div.sheet-log-grid { grid-template-columns: 2fr 5fr 2fr 1fr 6fr 1.2em 1fr 1.2em 1fr 1.2em 1fr 1.2em 1fr; } div.sheet-log-grid-header { height: 4em; } div.sheet-log-grid-header h1, div.sheet-log-grid h2 { grid-row: 1; } div.sheet-log-grid-header h1 { font-size : 2em; grid-column: 1 / 14; text-align : center; } div.sheet-log-grid h2 { color : #FFF; font-size : 0.9em; padding : 2em 0.1em 0px 0px; text-align: center } div.sheet-log-grid h2[data-i18n="coordinates"], div.sheet-log-grid input[name="attr_coordinates"] { grid-column: 1; } div.sheet-log-grid h2[data-i18n="terrain"], div.sheet-log-grid input[name="attr_terrain"] { grid-column: 2; } div.sheet-log-grid h2[data-i18n="rot-level"], div.sheet-log-grid input[name="attr_rot_level"] { grid-column: 3; } div.sheet-log-grid h2[data-i18n="threat"] { grid-column: 4; text-align: left; } div.sheet-log-grid h2[data-i18n="threat-notes"] { grid-column: 5; } div.sheet-log-grid input[name="attr_threat"], div.sheet-log-grid input[name="attr_threat"] + span { grid-row : 1; grid-column: 4; margin-left: 25%; } div.sheet-log-grid input[name="attr_threat_notes"] { grid-column: 5; } div.sheet-log-grid label.sheet-log-resouces { text-align: right; margin-bottom: 0px; margin-top: 10%; grid-row: 1; } div.sheet-log-grid label[data-i18n="a"] { grid-column: 6; } div.sheet-log-grid label[data-i18n="b"] { grid-column: 8; } div.sheet-log-grid label[data-i18n="g"] { grid-column: 10; } div.sheet-log-grid label[data-i18n="w"] { grid-column: 12; } div.sheet-log-grid input[name="attr_artifacts"], div.sheet-log-grid input[name="attr_artifacts"] + span { grid-column: 7; grid-row: 1; } div.sheet-log-grid input[name="attr_bullets"], div.sheet-log-grid input[name="attr_bullets"] + span { grid-column: 9; grid-row: 1; } div.sheet-log-grid input[name="attr_grub"], div.sheet-log-grid input[name="attr_grub"] + span { grid-column: 11; grid-row: 1; } div.sheet-log-grid input[name="attr_water"], div.sheet-log-grid input[name="attr_water"] + span { grid-column: 13; grid-row: 1; } div.sheet-log-grid h2[data-i18n="resources-found"]{ grid-column: 6 / 13; } div.sheet-log-grid input[name="attr_comment"] { grid-column: 1 / 14; grid-row: 3; } div.sheet-ark-bosses-repeating .repcontainer .repitem, div.sheet-repeating-log-grid .repcontainer .repitem, div.sheet-weapons-box .repcontainer .repitem { margin-top: 1%; } /* GRID STYLING */ .sheet-grid-item { text-align: center; } div.sheet-init-item { grid-column: 2; margin-top: 10%; } .sheet-sub-grid-item { text-align: center; margin: 2px; } .sheet-span-two { grid-column: 1 / 3 ; } .sheet-span-three { grid-column: 1 / 4; } .sheet-span-right { grid-column: 2 / 4; } /**** DICE ROLLER STYLING ****/ div.sheet-weapons-grid button[type="action"]:hover, div.sheet-weapons-grid button[type="action"]:hover > span, button[type="roll"]:hover { color: #fff; background-color: #8c4110; } button[type="action"] > span { font-size: 95%; } input.sheet-dice-selection { width: 70px; height: 18px; position: relative; margin: 1px 1px 1px 1px; cursor: pointer; z-index: 1; opacity: 0; } input.sheet-dice-selection + span::before { content: attr(title); color: #000; border: solid 1px #000; border-radius: 5px; text-align: center; display: inline-block; background: buttonface; width: 70px; height: 18px; box-shadow: 2px 2px 2px #000; vertical-align: middle; margin: 3px 3px 3px -70px; } input.sheet-dice-selection:hover + span::before { background: #a9a9a9; color: #fff; } input.sheet-dice-selection:checked + span::before { color: #000; background: yellow; font-weight: bold; } input.sheet-skill:checked + span::before { color: #fff; background: #235402; } input.sheet-gear:checked + span::before { color: #fff; background: #000000; } input.sheet-negative:checked + span::before { color: #fff; background: #800080; } /* ROLL TEMPLATE STYLING */ .sheet-rolltemplate-rolls { padding: 12px 0 12px 0; } .sheet-rolltemplate-rolls button:hover { background:none; } .sheet-rolltemplate-rolls span.sheet-label { font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-weight: bold; } .sheet-rolltemplate-rolls .sheet-template-wrap { background-color: #f1f1f1; border-radius: 5px; width: 240px; padding: 5px; box-sizing: border-box; overflow: hidden; border: 5px solid #000; border-image-slice: 74; border-image-width: 50px 80px 50px 80px; border-image-outset: 4 4 3 4; border-image-repeat: repeat; margin-left: -20px; } .sheet-rolltemplate-rolls div.sheet-template-header { background-color: #000; font-family: "Times New Roman", Times, serif; font-size: 1.1em; font-weight: bold; word-break: break-word; color: #FFF; display: flex; justify-content: space-between; padding: 4px 5px 4px 5px; margin: 2px -5px 2px -5px; } .sheet-rolltemplate-rolls .sheet-template-header a { color: #FFF; } .sheet-rolltemplate-rolls .sheet-template-span-left.sheet-template-header { width: 43%; } .sheet-rolltemplate-rolls .sheet-template-span-center.sheet-template-header { z-index: 1; } .sheet-rolltemplate-rolls .sheet-template-span-right.sheet-template-header { width: 43%; text-align: right; display: block; } .sheet-rolltemplate-rolls div.sheet-template-subtitle, .sheet-rolltemplate-rolls div.sheet-template-footer { font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; font-size: 1em; display: flex; align-items: center; justify-content: center; padding: 2px; margin: 0 -5px 5px -5px; } .sheet-rolltemplate-rolls div.sheet-template-subtitle { font-weight: bold; } .sheet-rolltemplate-rolls div.sheet-free-text { font-size : 1em; display : flex; align-items : center; justify-content: left; line-height : 1em; padding : 2px; margin : -2px -5px 2px -5px; } .sheet-rolltemplate-rolls .sheet-template-grid { font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif; display: grid; grid-gap: 1px; background-color: transparent; padding: 0; margin: 0em 0.2em 0.2em 0.2em; grid-template-columns: repeat(6, 1fr); } .sheet-rolltemplate-rolls .sheet-template-grid-item { background-color: transparent; border: none; border-radius: 5px; padding: 3px; text-align: center; } .sheet-rolltemplate-rolls .sheet-template-span-six { grid-column: 1 / 7; } .sheet-rolltemplate-rolls .sheet-template-span-half { grid-column: 1 / 4; line-height: 1em; } .sheet-rolltemplate-rolls .sheet-template-span-2nd-half { grid-column: 4 / 7; line-height: 1em; } .sheet-rolltemplate-rolls .sheet-template-span-left { grid-column: 1 / 3; } .sheet-rolltemplate-rolls .sheet-template-span-center { grid-column: 3 / 5; } .sheet-rolltemplate-rolls .sheet-template-span-right { grid-column: 5 / 7; } .sheet-rolltemplate-rolls .sheet-template-grid .sheet-scroll-text { text-align: left; max-height: 6em; overflow-y: auto; } /* used for consumable's single dice roll */ .sheet-rolltemplate-rolls .sheet-template-span-center-die { grid-column: 3 / 5; width: 38%; margin-left: 24%; } .sheet-rolltemplate-rolls .sheet-template-span-one { grid-column: 1 / 2; } .sheet-rolltemplate-rolls .sheet-template-span-two { grid-column: 2 / 3; } .sheet-rolltemplate-rolls .sheet-template-span-three { grid-column: 3 / 4; } .sheet-rolltemplate-rolls .sheet-template-span-four { grid-column: 4 / 5; } .sheet-rolltemplate-rolls .sheet-template-span-five { grid-column: 5 / 6; } .sheet-rolltemplate-rolls .sheet-template-span-shix { grid-column: 6 / 7; } .sheet-rolltemplate-rolls .sheet-template-success { max-width: 100%; height: auto; } .sheet-rolltemplate-rolls .sheet-template-bane { max-width: 100%; height: auto; } .sheet-rolltemplate-rolls .sheet-template-bold { font-weight: bold; } .sheet-rolltemplate-rolls .sheet-template-inline { font-size : 2em; font-family : "Palatino Linotype", "Book Antiqua", Palatino, serif; background-color: transparent; border : none; display : inline-block; margin : 50% 0 50% 0; line-height : 0; } .sheet-rolltemplate-rolls .sheet-template-smaller { font-size: 0.75em; } .sheet-rolltemplate-rolls .sheet-dice { border : 1px solid #000; border-radius: 5px; color : #fff; line-height : 0; padding : 3px; text-align : center; } .sheet-rolltemplate-rolls .sheet-template-base-dice, .sheet-rolltemplate-rolls .sheet-template-other-dice { background-color: yellow; color : #000; } .sheet-rolltemplate-rolls .sheet-template-skill-dice { background-color: #235402; } .sheet-rolltemplate-rolls .sheet-template-gear-dice { background-color: #000; } .sheet-rolltemplate-rolls .sheet-template-purple-dice { background-color: #800080; } .sheet-rolltemplate-rolls .sheet-template-skill-dice img, .sheet-rolltemplate-rolls .sheet-template-gear-dice img, .sheet-rolltemplate-rolls .sheet-template-purple-dice img { -webkit-filter: invert(100%); } .sheet-rolltemplate-rolls .sheet-dice > .inlinerollresult { background-color: transparent; border : none; display : inline-block; font-family : "Palatino Linotype", "Book Antiqua", Palatino, serif; font-size : 2em; font-weight : bold; line-height : 0; margin : 50% 0 50% 0; opacity : 0.4; } .sheet-rolltemplate-rolls .inlinerollresult.fullcrit, .sheet-rolltemplate-rolls .inlinerollresult.importantroll, .sheet-rolltemplate-rolls .inlinerollresult.fullfail { color: inherit; border: none; } .sheet-rolltemplate-rolls .inlinerollresult.fullcrit, .sheet-rolltemplate-rolls .sheet-template-base-dice .inlinerollresult.fullfail, .sheet-rolltemplate-rolls .sheet-template-gear-dice .inlinerollresult.fullfail, .sheet-rolltemplate-rolls .sheet-template-other-dice .inlinerollresult.fullfail { margin-bottom: 0em; margin-left : -9%; margin-top : 0em; max-width : 100%; opacity : 1; } /* TURN THE GEAR & SKILL DICE WHITE */ .sheet-rolltemplate-rolls .sheet-template-gear-dice .inlinerollresult.fullcrit, .sheet-rolltemplate-rolls .sheet-template-gear-dice .inlinerollresult.fullfail, .sheet-rolltemplate-rolls .sheet-template-skill-dice .inlinerollresult.fullcrit, .sheet-rolltemplate-rolls .sheet-template-skill-dice .inlinerollresult.fullfail { -webkit-filter: invert(100%); } .sheet-rolltemplate-rolls .inlinerollresult.fullcrit { content: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/radiation.png"); } .sheet-rolltemplate-rolls .sheet-template-base-dice .inlinerollresult.fullfail, .sheet-rolltemplate-rolls .sheet-template-other-dice .inlinerollresult.fullfail { content: url(https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/biohazard.png); } .sheet-rolltemplate-rolls .sheet-template-gear-dice .inlinerollresult.fullfail { content: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/boom.png"); } /* Mutant Year Zero */ div.sheet-settings { overflow : hidden; } div.sheet-settings textarea { height : 8em; min-height: 8em; overflow : scroll; resize : none; width : 95%; } input.sheet-display[value*="display"] ~ div.sheet-settings { height : 0px; transition: height 2s; -webkit-transition: height 2s; /* Safari */ } input.sheet-display[value*="settings"] ~ div.sheet-settings { border-top: 1px dotted orange; height : 13em; transition: height 2s; -webkit-transition: height 2s; /* Safari */ } input.sheet-display[value*="settings"] ~ div.sheet-repeating-skill-grid.sheet-settings { height: 2.5em; } input.sheet-display[value*="settings"] ~ div.sheet-relationships-grid.sheetsettings { height: 10em; } input.sheet-display[value*="settings"] ~ button.sheet-toggles, input.sheet-display[value*="face"] ~ button[name="act_settings_face"], input.sheet-display[value*="body"] ~ button[name="act_settings_body"], input.sheet-display[value*="clothing"] ~ button[name="act_settings_clothing"] { opacity: 100; } input.sheet-display[value*="face"] ~ button[name="act_settings_face"], input.sheet-display[value*="body"] ~ button[name="act_settings_body"], input.sheet-display[value*="clothing"] ~ button[name="act_settings_clothing"] { margin: -10px 0 0 -6px; } .sheet-appearance-grid input.sheet-display ~ button[name="act_settings_face"]:hover, .sheet-appearance-grid input.sheet-display ~ button[name="act_settings_body"]:hover, .sheet-appearance-grid input.sheet-display ~ button[name="act_settings_clothing"]:hover { margin: -10px 0 0 -6px; } input.sheet-display[value*="face"] ~ textarea[name="attr_face"], input.sheet-display[value*="body"] ~ textarea[name="attr_body"], input.sheet-display[value*="clothing"] ~ textarea[name="attr_clothing"] { display: inline-block; } div.sheet-appearance-grid textarea, input.sheet-display[value*="face"] ~ span[name="attr_face"], input.sheet-display[value*="body"] ~ span[name="attr_body"], input.sheet-display[value*="clothing"] ~ span[name="attr_clothing"] { display: none; } div.sheet-dots { background-color: #c77624; margin-left : -0.35em; margin-right : -0.35em; } div.sheet-dots input[type="radio"] { border-radius : 1em; cursor : pointer; height : 1.23em; left : 1.5em; margin-left : -1.4em; opacity : 0; position : relative; vertical-align: middle; width : 1.23em; z-index : 1; } div.sheet-dots input[type="radio"] + span { background-color: #794725; border : 0.15em solid #2d281d; border-radius : 1.5em; color : #fff; display : inline-block; font-weight : bold; height : 1.5em; text-align : center; vertical-align : middle; width : 1.5em; } div.sheet-dots input[type="radio"]:checked ~ input[type="radio"] + span { background-color: #fff; color : #2d281d; } div.sheet-rot-grid input[type="number"].sheet-input-number { width: 4em; } div.sheet-rot-grid div.sheet-dots { border-bottom: 0.2em solid #2e2217; margin-bottom: 2%; margin-right : -0.4em; padding : 0.5em; } div.sheet-rot-grid label[title="permaneant rot"] { display: inline-block; width: 80%; } div.sheet-rot-grid label[title="permaneant rot"] > span { text-transform: capitalize; } div.sheet-rot-grid div.sheet-dots span { content: url('https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/biohazard.png'); } input[name="attr_rot_permenant"][value="0"] ~ input:nth-of-type(1n+1) + span, input[name="attr_rot_permenant"][value="1"] ~ input:nth-of-type(1n+4) + span, input[name="attr_rot_permenant"][value="2"] ~ input:nth-of-type(1n+5) + span, input[name="attr_rot_permenant"][value="3"] ~ input:nth-of-type(1n+6) + span, input[name="attr_rot_permenant"][value="4"] ~ input:nth-of-type(1n+7) + span, input[name="attr_rot_permenant"][value="5"] ~ input:nth-of-type(1n+8) + span, input[name="attr_rot_permenant"][value="6"] ~ input:nth-of-type(1n+9) + span, input[name="attr_rot_permenant"][value="7"] ~ input:nth-of-type(1n+10) + span, input[name="attr_rot_permenant"][value="8"] ~ input:nth-of-type(1n+11) + span, input[name="attr_rot_permenant"][value="9"] ~ input:nth-of-type(1n+12) + span, input[name="attr_rot_permenant"][value="10"] ~ input:nth-of-type(1n+13) + span { content: ""; } /***** COLLAPSABLE DIVS *****/ button.sheet-dicefontd6 { font-family: "dicefontd6"; } button.sheet-collapse { overflow: hidden; } span.sheet-collapsible { grid-column : 1 / 4; height : 0em; padding-left: 5%; text-align : left; visibility : hidden; white-space : pre-line; word-break : break-word; } input.sheet-display[value*="collapse"] ~ div.sheet-grid span.sheet-collapsible { height : auto; text-align: left; visibility: visible; } input.sheet-display[value*="settings"] ~ div.sheet-grid button.sheet-toggles { opacity: 100; } button.sheet-collapse[type="action"] { background : none; border : none; box-shadow : none; font-size : 1.2em; font-weight: bold; text-align : left; } button.sheet-collapse[type="action"]:hover { color: #c77624; } /* NPC Settings */ /*input.sheet-tab[value="npc"] ~ div.sheet-npc { display: inline-flex; }*/ div.sheet-npc { margin-bottom : 2%; padding-bottom: 0em; } div.sheet-npc h2 { font-size : 1.5em; font-variant : small-caps; line-height : 1em; text-transform: capitalize; } div.sheet-npc h3 { font-size : 1.2em; text-align: center; } div.sheet-npc h3[title="npc current attribute"] { grid-column: 2; } div.sheet-npc h3[title="npc maximum attribute"] { grid-column: 3; } div.sheet-npc textarea { width: 97%; } div.sheet-npc div.sheet-npc-info div:nth-of-type(1n+3) { width: 100%; } div.sheet-npc div.sheet-npc-flex { background-color: hsl(165, 18%, 96%); } input.sheet-tab[value="npc"] ~ div.sheet-npc, input.sheet-tab[value="npc"] ~ div.sheet-character { align-items : flex-start; display : inline-flex; flex-direction : row; flex-wrap : wrap; justify-content : flex-start; max-width : 100%; min-width : 350px; width : 40%; } div.sheet-npc input[name="attr_know_modifier"] { background-color: hsl(41, 64%, 63%); border : 0.4em solid hsl(17, 58%, 39%); height : 4em; width : 4em; border-radius : 10em; color : #000; font-size : 1.1em; font-weight : bolder; } div.sheet-npc div.sheet-wrapper { padding-bottom: 0em; padding-top : 0em; } input.sheet-tab[value="npc"] ~ div.sheet-grid-tabs button[name="act_tab_ark"], input.sheet-tab[value="npc"] ~ div.sheet-grid-tabs button[name="act_tab_log"] { display: none; } input.sheet-tab[value="npc"] ~ div.sheet-grid-tabs { grid-template-columns: 8em 25em 8em; } input.sheet-tab[value="npc"] ~ div.sheet-grid-tabs img[alt="Mutant Year Zero"] { grid-column: 2; } input.sheet-tab[value="npc"] ~ div.sheet-grid-tabs button[name="act_tab_npc"] { grid-column: 3; } div.sheet-npc-name-grid { grid-template-columns: 5fr 1fr; margin-bottom : 5%; margin-top : 1%; } div.sheet-npc-name-grid input[name="attr_character_name"] { grid-column: 1; grid-row : 1; margin-top : 5%; } div.sheet-npc-name-grid input[name="attr_know_modifier"] { grid-column: 2; grid-row : 1; } div.sheet-npc-name-grid textarea { grid-column: 1 / 3; grid-row : 2; } div.sheet-npc-attr-grid { grid-template-columns: 12em 1fr 1fr; width: 100%; } div.sheet-npc-attr-grid input[type="number"] { margin : 1% 10%; padding : 5%; text-align: center; width : 5em; } div.sheet-npc-attr-grid label { grid-column: 1; width : 6em; } div.sheet-npc input[name="attr_name"] { margin-bottom: 2%; margin-top : 1%; } input.sheet-tab[value="npc"] ~ div.sheet-character { display: inline-flex; vertical-align: top; } input.sheet-tab[value="npc"] ~ div.sheet-character div.sheet-pc-only { display: none; } input.sheet-tab[value="npc"] ~ div.sheet-character div.sheet-character-row div.sheet-character-dice_pool { background : hsl(165, 20%, 96%); margin-top : -0.5em; vertical-align: top; } input.sheet-tab[value="npc"] ~ div.sheet-character div.sheet-character-row div.sheet-two-col-left { width: 85%; } input.sheet-tab[value="npc"] ~ div.sheet-character div.sheet-character-row div.sheet-two-col-left div.sheet-2grid { grid-template-columns: 1fr; } input.sheet-tab[value="npc"] ~ div.sheet-wrapper { padding-top: 0em; } input.sheet-tab[value="npc"] ~ div.sheet-tab-content { margin-top: 0em; } /* Add Backgrounds to Headers */ div.sheet-attributes-grid.sheet-header { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header.jpg"); } div.sheet-appearance-header h1 { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header7.jpg"); } div.sheet-injuries-header { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header2.jpg"); } div.sheet-skills-grid.sheet-header { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header3.jpg"); } div.sheet-dice_pool-box1 { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header.jpg"); } div.sheet-talents-box { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header9.jpg"); } div.sheet-mutant-box { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header10.jpg"); } div.sheet-character-weapons div.sheet-header, div.sheet-gear-box1, div.sheet-gear-box6, span.sheet-armor-box4, div.sheet-notes-box-header, div.sheet-ark-notes h1[data-i18n="notes"], div.sheet-nec-grid div.sheet-header { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header13.jpg"); } div.sheet-relationships-header, div.sheet-ark h1[data-i18n="ark"], div.sheet-log-grid-header { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header15.jpg"); } div.sheet-rot-box { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header12.jpg"); } div.sheet-armor-box, div.sheet-ark-development-grid h1 { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header12.jpg"); } div.sheet-character-experience, div.sheet-vehicle_gear-box6.sheet-header { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header6.jpg"); } div.sheet-ark-notes-grid h1, div.sheet-ark-bosses-header, div.sheet-vehicle_gear-box1 { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header18.jpg"); } div.sheet-ark-projects-header { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header17.jpg"); } div.sheet-ark-other-grid h1 { background-size: cover; background-image: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Mutant%20Year%20Zero/images/header19.jpg"); }