{ display: block; width: 98%; margin: auto; text-align: center; } @media screen and (max-width : 990px){ { width: 100%; } } article.stage{ margin: 0.5em; position: relative; border-radius: 1em; background: #351e0b; border: 0.2em solid #f2c920; padding: 0.3em; } article.stage div.profile{ display: inline-block; vertical-align: top; } article.stage div.profile div.details{ display: inline-block; vertical-align: top; text-align: center; } article.stage div.profile div.details span.stars{ display: block; } article.stage div.profile div.details span.stars img.star{ width: 1em; height: 1em; } article.stage div.profile div.details span.archetype{ color: #ffffff; display: block; text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000; font-size: 80%; } article.stage div.profile h4{ color: #ffffff; font-weight: bold; text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.4em #000000; margin: 0.1em; display: block; } article.stage table.stats{ font-size: 65%; 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,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 div.skills{ text-align: center; } article.stage div.skills div.skill{ display: inline-block; vertical-align: top; margin: 0.5em; color: #ffffff; text-align: center; max-width: 20%; } article.stage div.skills div.skill img.skill_img{ width: 4em; height: 4em; border: 0.2em solid #f2c920; border-radius: 0.4em; } article.stage div.skills div.skill span.skill_name{ text-shadow: 0 0 0.2em #000000, 0 0 0.2em #000000, 0 0 0.4em #000000; display: block; font-weight: bold; font-size: 90%; } article.stage div.skills div.skill span.skill_description{ font-size: 70%; font-style: italic; } article.stage div.skills div.skill span.skill_effects{ display: block; text-align: center; margin-top: 1em; } article.stage div.skills div.skill span.skill_effects img.effect_img{ width: 1.5em; height: 1.5em; border: 0.1em solid #000000; border-radius: 0.5em; } article.stage div.skills div.skill table.skill_up{ font-size: 70%; margin-top: 1em; } article.stage div.skills div.skill table.skill_up td{ color: #ffffff; padding: 0.03em 0.3em; } article.stage div.skills div.skill table.skill_up td.level{ font-style: italic; padding-right: 0.8em; min-width: 3em; }