section h2 span.family{ float: right; } section h2 span.family img.family{ max-width: 2em; max-height: 2em; margin: -0.5em; width: 90%; height: 90%; } section h2 span.family img.family.current{ max-width: 2.5em; max-height: 2.5em; margin: -0.5em; width: 100%; height: 100%; } section h2 span.family img.family.disabled{ filter: sepia(100%) saturate(10%); opacity: 0.5; } article.stage{ margin: 0.5em; position: relative; padding: 0.3em 0.1em; } article.stage div.profile{ display: inline-block; vertical-align: top; } article.stage table.stats{ font-size: 75%; border: 0.1em solid black; color: #ffffff; margin: 0.4em; border-collapse: collapse; border-radius: 0.4em; display: inline-block; vertical-align: top; max-width: 10em; } article.stage table.stats td, article.stage table.stats th{ padding: 0.01em 0.5em; border: 0.1em solid #000000; } article.stage table.stats th{ font-weight: bold; background-color: #00000066; } article.stage table.stats td{ font-weight: bold; background-color: #ffffff33; } article.stage div.extra{ display: inline-block; } article.stage div.extra div.sources span{ display: block; font-size: 70%; margin: 0.5em 0 0 0; color: #ffffff; } article.stage div.extra div.sources img.source{ width: 2em; height: 2em; border: 0.1em solid #f2c920; border-radius: 0.3em; } article.stage div.extra div.essences span{ display: block; font-size: 70%; margin: 0.5em 0 0 0; color: #ffffff; } article.stage div.extra div.essences div.essence{ position: relative; display: inline-block; vertical-align: top; border-style: solid; border-width: 0.1em; border-radius: 15%; width: 1.3em; height: 1.3em; margin-bottom: 0.1em; } article.stage div.extra div.essences div.essence img{ position: absolute; top: 0; left: 0; width: 1.5em; height: 1.5em; } article.stage div.extra div.essences div.essence span{ position: absolute; font-size: 80%; top: 0.15em; left: 0.8em; color: #ffffff; text-shadow: 0 0 0.1em #000000, 0 0 0.1em #000000, 0 0 0.2em #000000, 0 0 0.2em #000000; } article.stage table.skills{ display: block; vertical-align: top; margin: 1em auto; color: #ffffff; text-align: center; width: 90%; position: relative; border-collapse: collapse; table-layout: fixed; border-top: 3px solid #c8ad78; border-bottom: 3px solid #c8ad78; } article.stage table.skills th{ border-left: 3px solid #c8ad78; border-right: 3px solid #c8ad78; border-bottom: 3px solid #c8ad78; font-size: 150%; padding: 0.5em; background-color: #00000066; } article.stage table.skills td{ vertical-align: top; padding: 0.2em 0.5em; border-right: 3px solid #c8ad78; border-left: 3px solid #c8ad78; background-color: #ffffff33; } article.stage table.skills img.skill_img{ width: 4em; height: 4em; border: 0.15em solid var(--ui-color-border); border-radius: 0.4em; margin-top: 1em; } article.stage table.skills span.skill_name{ text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.4em #000000; margin: 0 0 0.5em 0; display: block; font-weight: bold; } article.stage table.skills span.skill_description{ font-size: 80%; font-style: italic; margin: 0; padding: 0; display: block; line-height: 0.95em; } article.stage table.skills span.skill_formula{ display: block; text-align: center; margin-top: 1em; font-size: 80%; color: #cccccc; font-weight: bold; font-style: italic; font-family: monospace, monospace; } article.stage table.skills span.skill_effects{ display: block; text-align: center; } article.stage table.skills span.skill_effects img.effect_img{ width: 2em; height: 2em; border: 0.1em solid #000000; border-radius: 0.5em; } article.stage table.skills td.skill_up{ margin: 0.5em auto 0 auto; border-collapse: collapse; font-size: 80%; color: #efefef; font-style: italic; } article.stage table.skills td.skill_up span.level{ width: 3em; display: inline-block; } article.stage table.skills td.skill_up span.description{ font-style: italic; min-width: 6em; display: inline-block; width: 70%; }